New release available "@primer/[email protected]" #6

github-actions · 2025-01-17T18:04:36Z

A new release is available: https://github.com/primer/brand/releases/tag/%40primer/react-brand%400.46.0.

Changelog

Minor Changes

#884 bbdf7f2f Thanks @rezrah! - Anti-aliasing is now applied automatically to all Text instances except under these conditions:
- When explicitly disabled via hasAntiAliasing={false}
- When font weight is light or extralight AND size is '100' or '200'
- When size is 100 (regardless of weight)
#893 d3c1ee2a Thanks @rezrah! - Updated secondary Button variant borders from subtle to default color for improved contrast.

#890 4692aeea Thanks @joshfarrant! - Enabled keyboard navigation in the IDE component and made the contents navigable by screen readers.

⚠️ Breaking changes

The alternativeText prop on the IDE component has been removed in favour of more granular descriptive text.

Before

<IDE alternativeText="A user asks how to concatenate arrays in JavaScript, Copilot demonstrates using the concat method, and the user confirms it worked.">
  <IDE.Chat />
</IDE>

After

<IDE>
  <IDE.Chat alternativeText="A user asks how to concatenate arrays in JavaScript, Copilot demonstrates using the concat method, and the user confirms it worked." />
</IDE>

Before

<IDE alternativeText="TypeScript sentiment analysis function with D3.js visualization.">
  <IDE.Editor
    files={[
      {
        name: 'index.js',
      },
    ]}
  />
</IDE>

After

<IDE>
  <IDE.Editor
    files={[
      {
        name: 'index.js',
        alternativeText: 'TypeScript sentiment analysis function with D3.js visualization.',
        // ...
      },
    ]}
  />
</IDE>

🔗 See the documentation for example usage, and more information on accessibility in the IDE component

Patch Changes

#887 8a49db27 Thanks @joshfarrant! - Link component improvements.
- Fixed a bug in the Link component where the underline wouldn't take the full width when arrowDirection='none'.
- Prop options are also now exported from the package root, specifically:
  - LinkSizes
  - LinkArrowDirections

#879 4f92311f Thanks @rezrah! - Added toggleColor prop to FAQ.Question and Accordion.Heading

<FAQ>
  <FAQ.Item>
    <FAQ.Question toggleColor="green-blue">...</FAQ.Question>
    <FAQ.Answer>...</FAQ.Answer>
  </FAQ.Item>
</FAQ>

<Accordion>
  <Accordion.Heading toggleColor="green-blue">...</Accordion.Heading>
  <Accordion.Content>...</Accordion.Content>
</Accordion>

🔗 See the documentation for examples and color options

#894 aecc8d8f Thanks @rezrah! - Improvements to duotone text in River component. Now supports <b> elements using a semi-bold font weight.

🔗 See documentation for usage examples
#892 e85c7316 Thanks @rezrah! - Upgraded dev dependencies for @types/node and eslint-plugin-github
#883 965a7865 Thanks @rezrah! - Visual spacing updates to RiverBreakout
- Reduced vertical gap between the main text and link.
- Applied a maximum width to the main text.
#872 872bdcf0 Thanks @joshfarrant! - VideoPlayer tooltips now show when the associated control receives focus.

❗ Dotcom integration checklist

Note

GitHub Staff only

Please ensure these items are checked before merging.

Performed successful integration test with github/github
- Install release @primer/[email protected]
- Verify CI passes
Manually verify regressions on following pages against production:
/features/copilot
/enterprise
/enterprise/advanced-security
/articles/security
/articles/security/what-is-security-testing
/features/preview
/features/copilot/getting-started and /features/copilot
/solutions/devops
/education
/mobile
/contact-sales
/about/diversity

The text was updated successfully, but these errors were encountered:

github-actions · 2025-01-17T18:04:37Z

Smoke test results

Updated secondary Button variant borders from subtle to default color for improved contrast. 🟢

Works as expected. All non-overridden secondary buttons now use darker outlines.

Before After

Before After
Added new accordion toggle color variables 🟢

Works as expected. Toggle colors in FAQs now accept color overrides

E.g.
Visual spacing updates to RiverBreakout 🟢

Works as expected. Breakout content now applies a max width and reduced spacing between paragraph and CTA

Before After
Improvements to duotone text in River component 🟢

Works as expected to documentation guidelines.

E.g.
Anti-aliasing is now applied automatically to all Text instances 🟢

Works as expected. Only applies in dark mode text instances. E.g.

⚠️ This is something to keep an eye on during further regression testing, due to previous rollbacks of AA. Recommend checking as many pages as possible for legibility issues.