braid-design-system@34.0.4

Patch Changes

• playroom: Add "layout" and "block" recipes to snippets (#2009)

• playroom: Add support for frameSettings (#2006)

  Introduce new frameSettings for Playroom to configure frame options for specific frames.

  Settings added:

  • Stack Debug: Show highlight overlays of stack spacing to help review spacing and layout.
  • Dark Mode: Switch the colour mode to dark mode (only used by pages embedded in native apps currently).

braid-design-system@34.0.3

Patch Changes

• Textarea: Add support for automatic shrinking height with the grow prop (true by default). (#2000)

  Automatically shrink and grow height with content when using the grow prop.

braid-design-system@34.0.2

Patch Changes

• TooltipRenderer: Fix line wrapping with mixed character sets (#1975)

• docs: Update typography token values (#1981)

  Improve the typographic scale for better visual hierarchy and readability.

• Textarea: update min-height to match touchableSize (#1974)

• Migrate source code bundling to use tsdown. (#1971)

@braid-design-system/docs-ui@4.0.1

Patch Changes

• Migrate source code bundling to use tsdown. (#1971)

braid-design-system@34.0.1

Patch Changes

• MenuRenderer, OverflowMenu: Prevent the document from scrolling when opening the menu with the keyboard (#1952)

braid-design-system@34.0.0

Major Changes

• Hidden: Remove screen prop (#1947)

  Remove the deprecated screen prop from the Hidden component.
  For content designed to improve the screen reader experience, please use use the HiddenVisually component instead.
  Alternatively, for content designed to be hidden unconditionally, remove the screen prop.

  MIGRATION GUIDE:

  - <Hidden screen>
  + <Hidden>

• Box, atoms: Remove deprecated rating variable. (#1947)

  Consumers should use the brandAccent or neutral variables instead.

  MIGRATION GUIDE:

  # styles.css.ts
  import { vars } from 'braid-design-system/css';
  
  export const myStyle = style({
  -  color: vars.foregroundColor.rating,
  +  color: vars.foregroundColor.brandAccent,
  });

• Card: Remove rounded prop (#1947)

  The rounded prop only affected deleted themes such as apac and has no effect on supported themes.

  MIGRATION GUIDE:

  - <Card rounded>...</Card>
  + <Card>...</Card>

• Box, atoms: Remove deprecated outline value none, and boxShadow value outlineFocus. (#1947)

  Braid leverages the outline property directly, managing focus rings of interactive elements as part of its scoped CSS reset.

  MIGRATION GUIDE:

  For styling the focus ring via Box:

  1. Remove usage of outline="none" and boxShadow="outlineFocus"
  2. Refer to focus outlines for guidance on leveraging Braid's focus outline styles.

  - <Box outline="none" className={styles.customFocusStyles} />
  + <Box />

  For styling the focus outline of an element based on the focus of another element, see outlineStyle.

• apac: Remove in favour of seekJobs theme (#1947)

  The previously deprecated apac theme has been removed.
  Consumers should migrate to the seekJobs theme.

  MIGRATION GUIDE:

  # App.tsx
  - import apac from 'braid-design-system/themes/apac';
  + import seekJobs from 'braid-design-system/themes/seekJobs';
  
  - <BraidProvider theme={apac} ...>
  + <BraidProvider theme={seekJobs} ...>

• IconList: Remove deprecated component, in favour of more specific list types: IconBulletList and IconNumberedList. (#1947)

  MIGRATION GUIDE:

  -<IconList />
  +<IconBulletList />

• Toggle: Remove bleedY prop (#1947)

  Remove the deprecated bleedY prop from the Toggle component.
  Consumers should remove use of the bleedY prop, and if previously setting bleedY to false, should update their layout accordingly.

  MIGRATION GUIDE:

  - <Toggle bleedY />
  + <Toggle />

Patch Changes

• Update is-mobile dependency (#1945)

@braid-design-system/docs-ui@4.0.0

@braid-design-system/docs-ui@4.0.0

braid-design-system@33.14.0

Minor Changes

• TooltipRenderer: Add support for left and right placement, in addition to existing top and bottom. (#1942)

  EXAMPLE USAGE:

  <TooltipRenderer
    placement="left"
    ...props
  >
   ...
  </TooltipRenderer>

Patch Changes

• Improve components type definitions in support of Playroom props (#1941)

braid-design-system@33.13.0

Minor Changes

• Autosuggest: Add support for data attributes on individual suggestions (#1938)

  The data attributes are applied to each rendered list item.

  EXAMPLE USAGE:

  <Autosuggest
    suggestions={[
      {
        text: 'Apples',
        data: { testid: 'suggestion-apples' },
      },
    ]}
  />

Patch Changes

• ButtonIcon, TooltipRenderer: Close tooltips after clicking the trigger on desktop devices (#1932)

braid-design-system@33.12.4

Patch Changes

• Autosuggest, MenuRenderer, OverflowMenu, TooltipRenderer: Ensure TooltipRenderer is correctly positioned on Android devices (#1926)

  Additionally, adjust TooltipRenderer positioning at screen edges, removing extra edge spacing.
  This ensures the tooltip arrow is more closely aligned with the trigger when the trigger is near the edge of the screen.