diff --git a/.changeset/few-planets-invite.md b/.changeset/few-planets-invite.md deleted file mode 100644 index d073fb2df43..00000000000 --- a/.changeset/few-planets-invite.md +++ /dev/null @@ -1,17 +0,0 @@ ---- -'braid-design-system': minor ---- - ---- -updated: - - Toggle ---- - -**Toggle:** Add `togglePosition` prop - -Introduces the `togglePosition` prop, enabling the toggle to either be `leading` or `trailing` its label text. - -**EXAMPLE USAGE:** -```jsx - -``` \ No newline at end of file diff --git a/.changeset/popular-mails-hunt.md b/.changeset/popular-mails-hunt.md deleted file mode 100644 index 539608e0b19..00000000000 --- a/.changeset/popular-mails-hunt.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -'braid-design-system': patch ---- - ---- -updated: - - Tag ---- - -**Tag**: Add missing click event parameter to `onClear` prop type \ No newline at end of file diff --git a/.changeset/purple-clocks-impress.md b/.changeset/purple-clocks-impress.md deleted file mode 100644 index d46c99a19dc..00000000000 --- a/.changeset/purple-clocks-impress.md +++ /dev/null @@ -1,21 +0,0 @@ ---- -'braid-design-system': minor ---- - ---- -updated: - - Toggle ---- - -**Toggle:** Add `bleedY` prop - -Introduces the `bleedY` prop, enabling vertical bleed for the `Toggle` component. This removes excess vertical space created by the `Toggle` input. - -**EXAMPLE USAGE:** -```jsx - -``` - -**MIGRATION GUIDE:** - -Vertical bleed will become standard for the `Toggle` component in a future version. Please use the `bleedY` prop with a value of `true` and update your layout accordingly. \ No newline at end of file diff --git a/.changeset/sharp-bears-remember.md b/.changeset/sharp-bears-remember.md deleted file mode 100644 index 0df91094882..00000000000 --- a/.changeset/sharp-bears-remember.md +++ /dev/null @@ -1,18 +0,0 @@ ---- -'braid-design-system': minor ---- - ---- -updated: - - Tag ---- - -**Tag:** Introduce "addable" support - -Tag actions have been extended to now support being “added”. -A `Tag` will include a small add icon button when both an `onAdd` handler and `addLabel` prop are provided. - -**EXAMPLE USAGE:** -```jsx - {...}} addLabel="Add Tag" /> -``` diff --git a/.changeset/silver-carpets-act.md b/.changeset/silver-carpets-act.md deleted file mode 100644 index 12d6accfd65..00000000000 --- a/.changeset/silver-carpets-act.md +++ /dev/null @@ -1,18 +0,0 @@ ---- -'braid-design-system': minor ---- - ---- -updated: - - seekJobs ---- - -**seekJobs:** Use Tahoma for Thai fallback font - -Currently in the `seekJobs` theme, the fallback font for the Thai character set resolves to the default system font which differs by operating system. -By choosing a deterministic fallback that is available across operating systems, we can use [Capsize] to [improve the alignment] with the SEEK Sans web font, and reduce Cumulative Layout Shift for experiences that use Thai. - -Additionally, adding `sans-serif` as an ultimate fallback in the event that we ever fall all the way through the stack on an obscure operating system. - -[Capsize]: https://seek-oss.github.io/capsize/ -[improve the alignment]: https://github.com/seek-oss/capsize?tab=readme-ov-file#createfontstack diff --git a/.changeset/sixty-knives-worry.md b/.changeset/sixty-knives-worry.md deleted file mode 100644 index 21691fd94ea..00000000000 --- a/.changeset/sixty-knives-worry.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -'braid-design-system': patch ---- - ---- -updated: - - Toggle ---- - -**Toggle:** Improve label text vertical alignment at `small` size diff --git a/.changeset/strong-eggs-relax.md b/.changeset/strong-eggs-relax.md deleted file mode 100644 index c1bad84ad9c..00000000000 --- a/.changeset/strong-eggs-relax.md +++ /dev/null @@ -1,14 +0,0 @@ ---- -'braid-design-system': patch ---- - ---- -updated: - - Toggle ---- - -**Toggle:** Remove tick icon & fix antialias haze when selected - -Simplying the selected state design by removing the tick icon from the toggle thumb. - -Also fixes the antialias haze that appears around the thumb when selected. diff --git a/packages/braid-design-system/CHANGELOG.md b/packages/braid-design-system/CHANGELOG.md index 8507d2df084..020754d6412 100644 --- a/packages/braid-design-system/CHANGELOG.md +++ b/packages/braid-design-system/CHANGELOG.md @@ -1,5 +1,66 @@ # braid-design-system +## 32.20.0 + +### Minor Changes + +- **Toggle:** Add `togglePosition` prop ([#1509](https://github.com/seek-oss/braid-design-system/pull/1509)) + + Introduces the `togglePosition` prop, enabling the toggle to either be `leading` or `trailing` its label text. + + **EXAMPLE USAGE:** + + ```jsx + + ``` + +- **Toggle:** Add `bleedY` prop ([#1519](https://github.com/seek-oss/braid-design-system/pull/1519)) + + Introduces the `bleedY` prop, enabling vertical bleed for the `Toggle` component. This removes excess vertical space created by the `Toggle` input. + + **EXAMPLE USAGE:** + + ```jsx + + ``` + + **MIGRATION GUIDE:** + + Vertical bleed will become standard for the `Toggle` component in a future version. Please use the `bleedY` prop with a value of `true` and update your layout accordingly. + +- **Tag:** Introduce "addable" support ([#1521](https://github.com/seek-oss/braid-design-system/pull/1521)) + + Tag actions have been extended to now support being “added”. + A `Tag` will include a small add icon button when both an `onAdd` handler and `addLabel` prop are provided. + + **EXAMPLE USAGE:** + + ```jsx + {...}} addLabel="Add Tag" /> + ``` + +- **seekJobs:** Use Tahoma for Thai fallback font ([#1527](https://github.com/seek-oss/braid-design-system/pull/1527)) + + Currently in the `seekJobs` theme, the fallback font for the Thai character set resolves to the default system font which differs by operating system. + By choosing a deterministic fallback that is available across operating systems, we can use [Capsize] to [improve the alignment] with the SEEK Sans web font, and reduce Cumulative Layout Shift for experiences that use Thai. + + Additionally, adding `sans-serif` as an ultimate fallback in the event that we ever fall all the way through the stack on an obscure operating system. + + [Capsize]: https://seek-oss.github.io/capsize/ + [improve the alignment]: https://github.com/seek-oss/capsize?tab=readme-ov-file#createfontstack + +### Patch Changes + +- **Tag**: Add missing click event parameter to `onClear` prop type ([#1516](https://github.com/seek-oss/braid-design-system/pull/1516)) + +- **Toggle:** Improve label text vertical alignment at `small` size ([#1518](https://github.com/seek-oss/braid-design-system/pull/1518)) + +- **Toggle:** Remove tick icon & fix antialias haze when selected ([#1525](https://github.com/seek-oss/braid-design-system/pull/1525)) + + Simplying the selected state design by removing the tick icon from the toggle thumb. + + Also fixes the antialias haze that appears around the thumb when selected. + ## 32.19.1 ### Patch Changes diff --git a/packages/braid-design-system/package.json b/packages/braid-design-system/package.json index a81d4c4faa2..90075b65feb 100644 --- a/packages/braid-design-system/package.json +++ b/packages/braid-design-system/package.json @@ -1,6 +1,6 @@ { "name": "braid-design-system", - "version": "32.19.1", + "version": "32.20.0", "description": "Themeable design system for the SEEK Group", "homepage": "https://seek-oss.github.io/braid-design-system/", "bugs": { diff --git a/site/src/componentUpdates.json b/site/src/componentUpdates.json index 55088ec5faf..d0dc1e91e9c 100644 --- a/site/src/componentUpdates.json +++ b/site/src/componentUpdates.json @@ -3899,5 +3899,52 @@ "summary": "Move secondary ButtonIcon tone to icons\n\nFollowing the deprecation of the `secondary` tone of `ButtonIcon`, this updates all internal usages to apply the `secondary` tone directly to the icon." } ] + }, + { + "version": "32.20.0", + "updates": [ + { + "updated": [ + "Toggle" + ], + "summary": "**Toggle:** Add `togglePosition` prop\n\nIntroduces the `togglePosition` prop, enabling the toggle to either be `leading` or `trailing` its label text.\n\n**EXAMPLE USAGE:**\n```jsx\n\n```" + }, + { + "updated": [ + "Tag" + ], + "summary": "**Tag**: Add missing click event parameter to `onClear` prop type" + }, + { + "updated": [ + "Toggle" + ], + "summary": "**Toggle:** Add `bleedY` prop\n\nIntroduces the `bleedY` prop, enabling vertical bleed for the `Toggle` component. This removes excess vertical space created by the `Toggle` input.\n\n**EXAMPLE USAGE:**\n```jsx\n\n```\n\n**MIGRATION GUIDE:**\n\nVertical bleed will become standard for the `Toggle` component in a future version. Please use the `bleedY` prop with a value of `true` and update your layout accordingly." + }, + { + "updated": [ + "Tag" + ], + "summary": "**Tag:** Introduce \"addable\" support\n\nTag actions have been extended to now support being “added”.\nA `Tag` will include a small add icon button when both an `onAdd` handler and `addLabel` prop are provided.\n\n**EXAMPLE USAGE:**\n```jsx\n {...}} addLabel=\"Add Tag\" />\n```" + }, + { + "updated": [ + "seekJobs" + ], + "summary": "**seekJobs:** Use Tahoma for Thai fallback font\n\nCurrently in the `seekJobs` theme, the fallback font for the Thai character set resolves to the default system font which differs by operating system.\nBy choosing a deterministic fallback that is available across operating systems, we can use [Capsize] to [improve the alignment] with the SEEK Sans web font, and reduce Cumulative Layout Shift for experiences that use Thai.\n\nAdditionally, adding `sans-serif` as an ultimate fallback in the event that we ever fall all the way through the stack on an obscure operating system.\n\n[Capsize]: https://seek-oss.github.io/capsize/\n[improve the alignment]: https://github.com/seek-oss/capsize?tab=readme-ov-file#createfontstack" + }, + { + "updated": [ + "Toggle" + ], + "summary": "**Toggle:** Improve label text vertical alignment at `small` size" + }, + { + "updated": [ + "Toggle" + ], + "summary": "**Toggle:** Remove tick icon & fix antialias haze when selected\n\nSimplying the selected state design by removing the tick icon from the toggle thumb.\n\nAlso fixes the antialias haze that appears around the thumb when selected." + } + ] } ]