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

[github-actions]

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

Changelog

Patch Changes

• #880 bfe40610 Thanks @rezrah! - Increased border radius of Card from large (16px) to xlarge (24px)

• #878 d9183796 Thanks @rezrah! - Added leadingComponent slot to SectionIntro for inserting arbitrary visuals and JSX above the heading.

  <SectionIntro leadingComponent={() => <img src="leading-visual.png" alt="description of your leading visual" />}>
    <SectionIntro.Heading>...</SectionIntro.Heading>
    <SectionIntro.Description>...</SectionIntro.Description>
    <SectionIntro.Link>...</SectionIntro.Link>
  </SectionIntro>

  🔗 See Storybook example

• #880 bfe40610 Thanks @rezrah! - Added hasBorder prop to Pillar for alternative presentation

  🔗 See Storybook for an example

• #703 621d8ee2 Thanks @joshfarrant! - VideoPlayer accessibility improvements

  • Improved contrast of play overlay focus styles.
  • Improved contrast of controls and title.
  • The title bar now hides while the video is playing.
  • The controls bar now hides when the cursor or keyboard focus leaves the video player, or after a few seconds of inactivity, and reappears when the cursor or keyboard focus returns.

• #862 eba0c530 Thanks @danielguillan! - Added image support to Pillar component

  Usage example:

  <Pillar>
    <Pillar.Image src="/path/to/your/image.jpg" alt="Required alternative text" />
    <Pillar.Heading>Code search & code view</Pillar.Heading>
    <Pillar.Description>
      Enables you to rapidly search, navigate, and understand code, right from GitHub.com.
    </Pillar.Description>
  </Pillar>

  🔗 See Storybook for an example

❗ 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

[github-actions]

Smoke test results

• Card — increased border radius 🟢
  Verified to be working in dotcom, docs, Storybook, and StackBlitz

  Screenshot from /features/copilot highlight border-radius change.

  Before	After

  There is an issue on the /enterprise/advanced-security page which is explained more in the hotfix #885.

  UPDATE: This is now resolved

• VideoPlayer — Accessibility improvements 🟢
  Verified to be working in dotcom, docs, Storybook, and StackBlitz

• SectionIntro — leadingComponent prop 🟢
  Verified to be working in dotcom, docs, Storybook, and StackBlitz

• Pillar — hasBorder prop 🟢
  Verified to be working in dotcom, docs, Storybook, and StackBlitz

• Pillar — Pillar.Image 🟢
  Verified to be working in dotcom, docs, Storybook, and StackBlitz

Release testing status: Ready to release 🟢