Skip to content

Releases: primer/brand

@primer/[email protected]

14 Aug 16:28
8265b93
Compare
Choose a tag to compare

Minor Changes

  • #684 e382a491 Thanks @danielguillan! - Extend Hero.Heading and Heading.Description length.

    Warning
    This change can lead to reduced contrast in certain situations. Please manually review all instances of the Hero - particularly those that use a background image - to ensure that minimum contrast requirements are met.

Patch Changes

  • #695 2bb68ea7 Thanks @joshfarrant! - ComparisonTable featured columns now identify themselves to screen readers by appending the text featured to the column title. This text can be customized using the visuallyHiddenFeaturedLabel prop.

  • #677 c76c8c87 Thanks @rezrah! - Removed redundant styles in default Section and BreakoutBanner components

  • #688 55a353c7 Thanks @rezrah! - Added experimental TextRevealAnimation component.

  • #688 55a353c7 Thanks @rezrah! - Remove strict, custom typings for Testimonial.Quote

  • #679 30f717dd Thanks @joshfarrant! - Fixed an issue where SubNav submenus were not accessible through keyboard navigation

@primer/[email protected]

14 Aug 16:27
8265b93
Compare
Choose a tag to compare

@primer/[email protected]

02 Aug 11:06
7da3471
Compare
Choose a tag to compare

See documentation for this release

Minor Changes

  • #654 ca967a49 Thanks @danielguillan! - Added Section component

    Example:

    <Section
      paddingBlockStart="condensed"
      paddingBlockEnd="spacious"
      backgroundImage="my-background.png"
      backgroundImageSize="cover"
      backgroundImagePosition="top center"
    >
      {/* Section content */}
    </Section>

    🔗 See the documentation for more examples

  • #664 ccd37a50 Thanks @rezrah! - PricingOptions now applies the subtle background color by default. This is to ensure adequate contrast on a standard canvas-default background.

    To apply the previous default background color (or custom color), you may override a new design token that has been provided for this reason: --brand-PricingOptions-item-bgColor.

  • #672 61d72605 Thanks @rezrah! - New breakout banner component generally available

    import {BreakoutBanner} from '@primer/react-brand'
    <BreakoutBanner>
      <BreakoutBanner.Heading>Where the most ambitious teams build great things</BreakoutBanner.Heading>
      <BreakoutBanner.LinkGroup>
        <Link href="#">Primary action</Link>
      </BreakoutBanner.LinkGroup>
    </BreakoutBanner>

    🔗 Read the documentation for usage guidelines and examples

Patch Changes

  • #659 6f2949b5 Thanks @joshfarrant! - Added tabAttributes prop to FAQGroup component. This prop is used to set arbitrary attributes on the tabs rendered by the FAQGroup component.

    For example, the below code will add data-analytics="tab-0" to the first tab and data-analytics="tab-1" to the second tab.

    <FAQGroup
      tabAttributes={(children, index) => ({
        'data-analytics': `tab-${index}`,
      })}
    >
      <FAQGroup.Heading>Frequently asked questions</FAQGroup.Heading>
      <FAQ>
        <FAQ.Heading>Using GitHub Enterprise</FAQ.Heading>
        <FAQ.Item>...</FAQ.Item>
        <FAQ.Item>...</FAQ.Item>
        <FAQ.Item>...</FAQ.Item>
      </FAQ>
    
      <FAQ>
        <FAQ.Heading>About GitHub Enterprise</FAQ.Heading>
        <FAQ.Item>...</FAQ.Item>
        <FAQ.Item>...</FAQ.Item>
        <FAQ.Item>...</FAQ.Item>
      </FAQ>
    </FAQGroup>
  • #668 9cb14ed3 Thanks @joshfarrant! - Fixed misalignment of FormControl.Validation icon

  • #667 3010db67 Thanks @joshfarrant! - Fixed bug with VideoPlayer component where a '0' could be seen in the bottom-left corner during the first render

  • #669 67fdd2d6 Thanks @rezrah! - Fixed inability to forward name props to the Select component when used inside a FormControl.

  • #660 8f8181b7 Thanks @rezrah! - Fixed width of the focus outline in the Select component to fill the entire width of the control when fullWidth option has bene applied.

@primer/[email protected]

02 Aug 11:06
7da3471
Compare
Choose a tag to compare

@primer/[email protected]

22 Jul 10:58
c542955
Compare
Choose a tag to compare

Minor Changes

  • #634 598a2c5d Thanks @joshfarrant! - ⚠️ This update contains a breaking change.

    Refactored VideoPlayer component to make it more modular and customisable.

    • The showTitle prop has been renamed to visuallyHiddenTitle and inverted.
      • This prop hides the title visually, but keeps it accessible to screen readers.
      • Where you previously passed showTitle={false}, you should now pass visuallyHiddenTitle={true}.
    • The branding prop has been renamed to showBranding.
    • Individual video controls can be optionally hidden by setting any of the showPlayPauseButton, showSeekControl, showCCButton, showMuteButton, showVolumeControl, and showFullScreenButton props to false.
    • A custom play icon can be provided using the playIcon prop.

Patch Changes

  • #623 8727997c Thanks @rezrah! - Added fullWidth prop to Hero.Heading to remove default max-width constraint, and enabling easier placement using a parent Grid.

  • #623 8727997c Thanks @rezrah! - Added RiverStoryScroll component, an experimental layout component that wraps around existing River patterns.

    <RiverStoryScroll>
      <River>
        <River.Visual />
        <River.Content />
      </River>
      <River>
        <River.Visual />
        <River.Content />
      </River>
      <River>
        <River.Visual />
        <River.Content />
      </River>
    </RiverStoryScroll>

    🔗 See Storybook for more examples.

  • #647 39e00cfa Thanks @joshfarrant! - Added isExternal prop to SubdomainNavBar.Link component. When isExternal is true, a link-external icon is displayed next to the link.

  • #644 b3f1f364 Thanks @danielguillan! - Improve the layout responsiveness of SubdomainNavBar

  • #639 ebf92224 Thanks @stamat! - Fix cut AnchorNav action button outline due the introduced overflow auto

  • #646 81e983e6 Thanks @rezrah! - Adds responsive toggling of feature lists in the PricingOptions component.

    PricingOptions.FeatureList can now be collapsed at regular and wide viewports.

    <PricingOptions>
      <PricingOptions.Item>
        <PricingOptions.FeatureList expanded={{narrow: true, regular: true, wide: true}} />
      </PricingOptions.Item>
    </PricingOptions>
  • #623 8727997c Thanks @rezrah! - Added --brand-CTABanner-bgColor token to CTABanner for easier customisation of the banners background color, when enabled.

@primer/[email protected]

22 Jul 10:58
c542955
Compare
Choose a tag to compare

Patch Changes

  • #623 8727997c Thanks @rezrah! - Added --brand-CTABanner-bgColor token to CTABanner for easier customisation of the banners background color, when enabled.

@primer/[email protected]

09 Jul 10:01
a137f26
Compare
Choose a tag to compare

See documentation for this release

Patch Changes

  • #632 77b98a4c Thanks @joshfarrant! - Partial revert of changes to the LogoSuite logobar elements.

    To allow optimal treatment of logos based on their respective file formats, <img> tag will continue be styled with a CSS filter, whereas inline <svg> elements will be styled with CSS fill.

  • #637 8887dc37 Thanks @joshfarrant! - Fixes previously non-functional aspectRatio prop on Image component

  • #636 3a76bfba Thanks @rezrah! - Added Statistic component.

    Use the statistic component to display concise numerical information.

    <Statistic>
      <Statistic.Heading>+25%</Statistic.Heading>
      <Statistic.Description>increase in developer speed</Statistic.Description>
    </Statistic>

    See the documentation for more usage examples.

@primer/[email protected]

09 Jul 10:01
a137f26
Compare
Choose a tag to compare

Patch Changes

  • #632 77b98a4c Thanks @joshfarrant! - Partial revert of changes to the LogoSuite logobar elements.

    To allow optimal treatment of logos based on their respective file formats, <img> tag will continue be styled with a CSS filter, whereas inline <svg> elements will be styled with CSS fill.

@primer/[email protected]

28 Jun 08:34
21498e3
Compare
Choose a tag to compare

Patch Changes

  • #595 d0c1630 Thanks @stamat! - AnchorNav accessibility improvements.

    • Removed JS-augmented scrolling behavior in AnchorNav, reverting to browser-defaults.
    • Fixed zoom-related bug where certain anchor nav items were not visible.
  • #629 03237fa Thanks @stamat! - Updated FAQGroup autofocusing conditions

  • #622 3450e4b Thanks @joshfarrant! - Improved keyboard navigation in mobile AnchorNav component. Arrow key navigation has been replaced with tab navigation.

  • #630 809960b Thanks @joshfarrant! - In Image component, the height prop is now correctly forwarded to the underlying img element, when using `as="picture" customization.

@primer/[email protected]

28 Jun 08:34
21498e3
Compare
Choose a tag to compare