Braid Design System Versions Save

Minor Changes

• Update semantic icon assets. (#1481)

  IconCritical: Move from circle to diamond outline. Increase the visual distinction from IconInfo. IconLanguage: Move from globe to characters. Better represents the concept of language. Previous asset available as IconGlobe.

  MIGRATION GUIDE

  As the above are updates to semantics icons, consumers are unaffected if their usage follows the icon's semantic intent. For those choosing the icon based on its visual appearance, please review the usage and consider decoupling from the semantic system icon for safer upgrades.

• Add new icons to the library (#1481)

Patch Changes

• Update Capsize dependencies (#1477)

Patch Changes

• Update Capsize dependencies (#1456)

• Checkbox: Improve tri-state handling (#1458)

  Fixes a bug in tri-state Checkbox where transitioning from mixed to checked could result in the visual presentation being out of sync with the desired state.

Patch Changes

• Text, Heading: Fix maxLines cropping of decending characters (#1451)

  Fixes a bug when using -webkit-box, where the descender on the last line of text could be cropped based on the combination of line height and font size.

Patch Changes

• Tab: Remove cropping of the icon slot (#1447)

  Previously the icon slot on a Tab was cropped on the left to improve alignment with the active tab indicator. For most icons in a Tab, this was subtle polish, but for others it had the undesirable side effect of clipping the side of the icon.

  Removing the cropping until we have a better solution for trimming whitespace around icons.

• Badge: Allow Badge to take arrays of values (#1443)

  Previously, Badge only accepted a string as children, to prevent the use of other components inside a Badge.

  However, when a variable is included with text inside the Badge, the children property is interpreted as an array. This prevents a very reasonable use case from being allowed:

  <Badge>{jobs.length} Jobs</Badge>
  // Error: Type '{ children: string[]; }' is not assignable to type 'BadgeProps'.
  

  This change allows Badge to accept a string, number, or array thereof.

• Fix circular dependencies (#1444)

Minor Changes

• IconSocialX: Add new icon (#1438)

  Add the new IconSocialX component to the suite of social icons, enabling teams to migrate across from IconSocialTwitter which has now been marked as deprecated.

  EXAMPLE USAGE:

  <IconSocialX />
  

  MIGRATION GUIDE: Teams should migrate from IconSocialTwitter to IconSocialX at their earliest convenience. The IconSocialTwitter component will be removed in a future release.

  -<IconSocialTwitter />
  +<IconSocialX />
  

• IconSort: Add new icon (#1438)

  EXAMPLE USAGE:

  <IconSort />
  

Patch Changes

• Icons: Update social icons (#1438)

  Update the suite of social icons to be more uniformly sized alongside each other as well as updating the Medium icon to reflect the latest branding.

• IconMoney: Update artwork to be currency agnostic (#1438)

Patch Changes

• Update react-focus-lock to avoid build warnings in Rollup and Vite (#1433)

Minor Changes

• Add optional logoHref prop to HeaderNavigation, which allows you to customise the route when clicking the Logo. (#1435)

Minor Changes

• Add HeaderNavigation component, used for showing site Logo, theme picker, and displaying the MenuButton component on smaller screens. (#1429)

Minor Changes

• Rating: Add weight support (#1430)

  Provide a weight prop to customise the weight of the text rating alongside the stars.

  EXAMPLE USAGE:

  <Rating rating={3} weight="strong" />
  

Patch Changes

• Inline Vanilla Extract styles imported from Capsize (#1423)