Release tracking

[primer]

This PR was opened by the Changesets release GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated.

Releases

@primer/brand-primitives@0.66.0

Minor Changes

• #1286 d948c46 Thanks @danielguillan! - Updates to RiverAccordion component

  New Features

  • New RiverAccordion prop: variant. This prop controls the layout and appearance of the RiverAccordion component. Two variants are available: default and gridline.

    The default variant is the pre-existing RiverAccordion configuration and remains the default value.

    The gridline variant adds lateral padding and borders for use within bordered grid layouts, using a 50/50 column split.

    <RiverAccordion variant="gridline" />

  Changes

  • Updated accordion icons: Replaced PlusIcon with ChevronDownIcon/ChevronUpIcon for better visual clarity of expand/collapse state.
  • Updated default text size: Text size in RiverAccordion.Content now defaults to 300 (previously 200) for improved readability.

• #1272 a386ed4 Thanks @danielguillan! - Updated all base color scales and functional tokens.

  Design token updates

  • Updated all 13 base color scale palettes (gray, blue, green, yellow, orange, red, purple, pink, coral, lemon, lime, teal, indigo) in both light and dark modes
  • Updated black-0 from #1f2328 to #000000 in both light and dark modes
  • Updated functional design tokens: --brand-color-text-default, --brand-color-text-muted, --brand-color-border-default, --brand-color-border-subtle, --brand-color-border-muted, --brand-color-success-fg, --brand-color-success-emphasis, --brand-color-accent-primary, and all hardcoded alpha tokens (--brand-color-success-muted, --brand-color-error-muted, --brand-color-neutral-muted, --brand-color-neutral-subtle)
  • Added new functional design tokens: --brand-color-text-emphasized, --brand-color-text-link-rest, --brand-color-text-link-pressed, --brand-color-text-danger, --brand-color-danger-fg, --brand-color-danger-emphasis, --brand-color-danger-muted, --brand-color-danger-subtle, --brand-color-canvas-muted
  • ⚠️ Deprecated --brand-color-error-* and --brand-color-text-error tokens, which are now aliased to the new --brand-color-danger-* and --brand-color-text-danger equivalents and will be removed in the future
  • ⚠️ Deprecated --brand-color-text-subtle, which is now remapped to the same value as --brand-color-text-muted and will be removed in the future
  • Updated --brand-InlineLink-color-rest and --brand-InlineLink-color-pressed to reference the new --brand-color-text-link-rest and --brand-color-text-link-pressed functional tokens
  • Updated --brand-Link-color-accent to reference the new --brand-color-text-link-rest functional token

Patch Changes

• #1299 ea8a60f Thanks @rezrah! - Upgraded dependencies to latest minor, patch, and select major versions.

  @primer/react-brand:

  • autoprefixer: 10.4.20 → 10.4.27
  • css-loader: 7.1.2 → 7.1.4
  • mini-css-extract-plugin: 2.9.2 → 2.10.2
  • postcss: 8.5.1 → 8.5.8
  • postcss-loader: 8.1.1 → 8.2.1
  • postcss-preset-env: 10.1.3 → 11.2.0
  • webpack: 5.101.3 → 5.105.4
  • webpack-cli: 6.0.1 → 7.0.2

  @primer/brand-primitives:

  • @primer/primitives: 9.1.1 → 9.1.2

  @primer/brand-css:

  • autoprefixer: 10.4.20 → 10.4.27
  • postcss: 8.5.1 → 8.5.8

@primer/react-brand@0.66.0

Minor Changes

• #1286 d948c46 Thanks @danielguillan! - Updates to RiverAccordion component

  New Features

  • New RiverAccordion prop: variant. This prop controls the layout and appearance of the RiverAccordion component. Two variants are available: default and gridline.

    The default variant is the pre-existing RiverAccordion configuration and remains the default value.

    The gridline variant adds lateral padding and borders for use within bordered grid layouts, using a 50/50 column split.

    <RiverAccordion variant="gridline" />

  Changes

  • Updated accordion icons: Replaced PlusIcon with ChevronDownIcon/ChevronUpIcon for better visual clarity of expand/collapse state.
  • Updated default text size: Text size in RiverAccordion.Content now defaults to 300 (previously 200) for improved readability.

• #1291 b989693 Thanks @danielguillan! - Added new subcomponents and variant prop to the SectionIntroStacked component:

  • SectionIntroStacked.Description
  • SectionIntroStacked.ItemIcon
  • SectionIntroStacked.ItemHeading
  • SectionIntroStacked.ItemDescription

  Heading and link sizes have also been updated. New variant prop supports default and gridline options.

  <SectionIntroStacked variant="gridline">
    <SectionIntroStacked.Heading>Section heading</SectionIntroStacked.Heading>
    <SectionIntroStacked.Description>A short description.</SectionIntroStacked.Description>
    <SectionIntroStacked.Link href="#">Learn more</SectionIntroStacked.Link>
    <SectionIntroStacked.Items>
      <SectionIntroStacked.Item>
        <SectionIntroStacked.ItemIcon icon={CpuIcon} />
        <SectionIntroStacked.ItemHeading>Feature one</SectionIntroStacked.ItemHeading>
        <SectionIntroStacked.ItemDescription>Description of this feature.</SectionIntroStacked.ItemDescription>
      </SectionIntroStacked.Item>
    </SectionIntroStacked.Items>
  </SectionIntroStacked>

• #1293 8519668 Thanks @danielguillan! - Add expressive variant to Testimonial which provides a two-column layout, a new Testimonial.Link subcomponent, and updated typographic styles.

  <Testimonial variant="expressive">
    <Testimonial.Quote>
      GitHub helps us ensure that we have our security controls baked into our pipelines all the way from the first line
      of code we're writing.
    </Testimonial.Quote>
    <Testimonial.Link href="/case-study">Read the full story</Testimonial.Link>
    <Testimonial.Name position="Staff Security Engineer">David Ross</Testimonial.Name>
    <Testimonial.Avatar src="/avatars/david-ross.png" alt="David Ross avatar" />
  </Testimonial>

• #1272 a386ed4 Thanks @danielguillan! - Updated all base color scales and functional tokens.

  Design token updates

  • Updated all 13 base color scale palettes (gray, blue, green, yellow, orange, red, purple, pink, coral, lemon, lime, teal, indigo) in both light and dark modes
  • Updated black-0 from #1f2328 to #000000 in both light and dark modes
  • Updated functional design tokens: --brand-color-text-default, --brand-color-text-muted, --brand-color-border-default, --brand-color-border-subtle, --brand-color-border-muted, --brand-color-success-fg, --brand-color-success-emphasis, --brand-color-accent-primary, and all hardcoded alpha tokens (--brand-color-success-muted, --brand-color-error-muted, --brand-color-neutral-muted, --brand-color-neutral-subtle)
  • Added new functional design tokens: --brand-color-text-emphasized, --brand-color-text-link-rest, --brand-color-text-link-pressed, --brand-color-text-danger, --brand-color-danger-fg, --brand-color-danger-emphasis, --brand-color-danger-muted, --brand-color-danger-subtle, --brand-color-canvas-muted
  • ⚠️ Deprecated --brand-color-error-* and --brand-color-text-error tokens, which are now aliased to the new --brand-color-danger-* and --brand-color-text-danger equivalents and will be removed in the future
  • ⚠️ Deprecated --brand-color-text-subtle, which is now remapped to the same value as --brand-color-text-muted and will be removed in the future
  • Updated --brand-InlineLink-color-rest and --brand-InlineLink-color-pressed to reference the new --brand-color-text-link-rest and --brand-color-text-link-pressed functional tokens
  • Updated --brand-Link-color-accent to reference the new --brand-color-text-link-rest functional token

Patch Changes

• #1299 ea8a60f Thanks @rezrah! - Upgraded dependencies to latest minor, patch, and select major versions.

  @primer/react-brand:

  • autoprefixer: 10.4.20 → 10.4.27
  • css-loader: 7.1.2 → 7.1.4
  • mini-css-extract-plugin: 2.9.2 → 2.10.2
  • postcss: 8.5.1 → 8.5.8
  • postcss-loader: 8.1.1 → 8.2.1
  • postcss-preset-env: 10.1.3 → 11.2.0
  • webpack: 5.101.3 → 5.105.4
  • webpack-cli: 6.0.1 → 7.0.2

  @primer/brand-primitives:

  • @primer/primitives: 9.1.1 → 9.1.2

  @primer/brand-css:

  • autoprefixer: 10.4.20 → 10.4.27
  • postcss: 8.5.1 → 8.5.8

@primer/brand-css@0.66.0

Patch Changes

• #1299 ea8a60f Thanks @rezrah! - Upgraded dependencies to latest minor, patch, and select major versions.

  @primer/react-brand:

  • autoprefixer: 10.4.20 → 10.4.27
  • css-loader: 7.1.2 → 7.1.4
  • mini-css-extract-plugin: 2.9.2 → 2.10.2
  • postcss: 8.5.1 → 8.5.8
  • postcss-loader: 8.1.1 → 8.2.1
  • postcss-preset-env: 10.1.3 → 11.2.0
  • webpack: 5.101.3 → 5.105.4
  • webpack-cli: 6.0.1 → 7.0.2

  @primer/brand-primitives:

  • @primer/primitives: 9.1.1 → 9.1.2

  @primer/brand-css:

  • autoprefixer: 10.4.20 → 10.4.27
  • postcss: 8.5.1 → 8.5.8

@primer/brand-docs@0.66.0

@primer/brand-storybook@0.66.0

@primer/brand-e2e@0.66.0

@primer/brand-fonts@0.66.0

@primer/brand-config@0.66.0

[github-actions]

❗ Pre-merge checklist

Please ensure these items are checked before merging.

✅ Preliminary checks

• All CI checks pass on this pull request
• Docs and Storybook previews open in a browser

🔌 Integration smoke tests

Dotcom

• Performed successful integration test with github/github-ui, as a primary consumer of Primer Brand
  • Install RC: npm install @primer/react-brand@{RC_VERSION} -w @github-ui/swp-core
  • Run development server
  • Manually verify release-specific bugfixes and/or features on the following pages:
    • /home
    • /features/copilot
    • /features/copilot/plans
    • /features/copilot/tutorials
    • /features/preview
    • /enterprise
    • /enterprise/contact
    • /security/advanced-security
    • /education
    • /mobile
    • /about/diversity
    • /newsroom
    • /resources/articles
    • /resources/articles/software-development
    • /resources/articles/software-development/what-is-cloud-native
    • /resources/whitepapers
    • /resources/whitepapers/how-the-c-suite-can-lead-ai-innovation
    • /solutions
    • /solutions/use-case/
    • /solutions/use-case/devops
    • /contentful-lp-tests/flex-example-dark (requires a flag)
    • /contentful-lp-tests/flex-example-light (requires a flag)
  • Manually compare production site to local instance for any non-release specific regressions

Subdomain sites

• Performed successful integration test with githubuniverse.com, as a Tier 1 consumer of Primer Brand outside of the monolith.

  • Run development server and verify no new console warnings or regressions are found
  • Run local build to verify the release compiles correctly
  • Manually performed side-by-side comparison with production

• Performed successful integration test with https://resources.github.com/, as a Tier 1 consumer of Primer Brand outside of the monolith.

  • Run development server and verify no new console warnings or regressions are found
  • Run local build to verify the release compiles correctly
  • Manually performed side-by-side comparison with production

Sandboxes

• Works in CodeSandbox or StackBlitz
  • New components render successfully
  • (optional) Tested in both SPA and SSR apps if release contains build changes

🤔 Cross-check (aka sanity test)

• Release notes accurately describe the changes made
• All bugfixes in this release have resolved their corresponding issues
• The issues for reverted PRs have been re-opened and commented on with a link to the reverted PR
• No noticeable regressions or side-effects have not been introduced as a result of changes in this release.
  • If they have, determine severity of the issue and consider hotfixing

After tests

• Add report summary of your findings, including any images. Use following template as a guide:

  #### Smoke test results
  
  - Feature 1 🟢 🟡 🔴 (choose one, depending on success levels)
  
    {insert screenshot}
  
  Release testing status: Ready to release 🟢 | Paused 🟡 🔴 (choose one and provide reason)

🚢 After merge

• Issue release comms in primer brand Slack channel
• Add the preview deployment's link to releases as a way of permalinking to old version's docs. Example

[github-actions]

🟢 No design token changes found

[github-actions]

⚠️ Visual differences found

Our visual comparison tests found UI differences.

Please review the differences by using the test artifacts to ensure that the changes were intentional.

Artifacts can be downloaded and reviewed locally.

Download links are available at the bottom of the workflow summary screen.

Example:

If the changes are expected, please run npm run test:visual:update-snapshots to replace the previous fixtures.

Review visual differences

[github-actions]

🟢 No unit test coverage changes found

All components and hooks with tests maintain the same coverage as the main branch.