From a5b5e5a3cfe881dc21a04bc23b4fc631a479e5b1 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Tue, 27 Feb 2024 09:48:06 +0000 Subject: [PATCH 1/7] Version Packages --- .changeset/angry-kings-suffer.md | 25 --- .changeset/fair-files-relate.md | 5 - .changeset/four-rice-bake.md | 10 - .changeset/hip-drinks-matter.md | 10 - .changeset/itchy-feet-poke.md | 5 - .changeset/long-meals-appear.md | 5 - .changeset/modern-zebras-destroy.md | 29 --- .changeset/popular-papayas-march.md | 5 - .changeset/silver-masks-change.md | 5 - .changeset/smart-glasses-turn.md | 5 - .changeset/sour-tigers-pull.md | 7 - .changeset/strong-balloons-repeat.md | 5 - .changeset/two-gorillas-tease.md | 12 -- packages/codemods/CHANGELOG.md | 10 + packages/codemods/package.json | 2 +- packages/components/CHANGELOG.md | 139 +++++++++++++- packages/components/package.json | 6 +- packages/ember-flight-icons/CHANGELOG.md | 32 +++- packages/ember-flight-icons/package.json | 2 +- packages/tokens/CHANGELOG.md | 15 ++ packages/tokens/package.json | 2 +- .../release-notes/partials/components.md | 178 ++++++++++++++---- .../release-notes/partials/design-tokens.md | 21 ++- .../partials/ember-flight-icons.md | 40 +++- .../partials/figma-library-foundations.md | 4 +- yarn.lock | 8 +- 26 files changed, 390 insertions(+), 197 deletions(-) delete mode 100644 .changeset/angry-kings-suffer.md delete mode 100644 .changeset/fair-files-relate.md delete mode 100644 .changeset/four-rice-bake.md delete mode 100644 .changeset/hip-drinks-matter.md delete mode 100644 .changeset/itchy-feet-poke.md delete mode 100644 .changeset/long-meals-appear.md delete mode 100644 .changeset/modern-zebras-destroy.md delete mode 100644 .changeset/popular-papayas-march.md delete mode 100644 .changeset/silver-masks-change.md delete mode 100644 .changeset/smart-glasses-turn.md delete mode 100644 .changeset/sour-tigers-pull.md delete mode 100644 .changeset/strong-balloons-repeat.md delete mode 100644 .changeset/two-gorillas-tease.md diff --git a/.changeset/angry-kings-suffer.md b/.changeset/angry-kings-suffer.md deleted file mode 100644 index 598738ca4c..0000000000 --- a/.changeset/angry-kings-suffer.md +++ /dev/null @@ -1,25 +0,0 @@ ---- -"@hashicorp/ember-flight-icons": major -"@hashicorp/design-system-components": major ---- - -Converted Ember packages to v2 addon format. - -To migrate update Sass cofiguration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: - -```js -sassOptions: { - precision: 4, - includePaths: [ - './node_modules/@hashicorp/design-system-tokens/dist/products/css', - './node_modules/@hashicorp/ember-flight-icons/dist/styles' - './node_modules/@hashicorp/design-system-components/dist/styles', - ], -}, -``` - -Alternatively, you can import the CSS by adding this configuration in `ember-cli-build.js`. - -```js -app.import('node_modules/@hashicorp/design-system-components/dist/styles/@hashicorp/design-system-components.css'); -``` diff --git a/.changeset/fair-files-relate.md b/.changeset/fair-files-relate.md deleted file mode 100644 index aff61cd227..0000000000 --- a/.changeset/fair-files-relate.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@hashicorp/design-system-components": minor ---- - -`Table` - Added multi-select functionality diff --git a/.changeset/four-rice-bake.md b/.changeset/four-rice-bake.md deleted file mode 100644 index 3285a0279e..0000000000 --- a/.changeset/four-rice-bake.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -"@hashicorp/design-system-tokens": major ---- - -New tokens added for large and medium size `Tab` variants. The "medium" tokens replace the former equivalent tokens which were not differentiated by size. - -* `--token-tabs-tab-height-medium` (**Replaces `--token-tabs-tab-height`**) -* `--token-tabs-tab-height-large` (**New**) -* `--token-tabs-tab-padding-horizontal-medium` (**Replaces `--token-tabs-tab-padding-horizontal`**) -* `--token-tabs-tab-padding-horizontal-large` (**New**) diff --git a/.changeset/hip-drinks-matter.md b/.changeset/hip-drinks-matter.md deleted file mode 100644 index db5860063f..0000000000 --- a/.changeset/hip-drinks-matter.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -"@hashicorp/design-system-components": major ---- - -`Form::CharacterCount` - refactored the component, removing `onInsert` callback and adding use `@value` argument - -To migrate: - -- for standalone `Form::CharacterCount` instances you must pass in a `@value` arguments representing the value of the referenced input -- when used as a contextual component `F.CharacterCount` in `Form::[MaskedInput|TextInput|Textarea]::Field` make sure the form control is updating the associated `@value` on input (usually using `{{on "input" (fn this.updateValue)}}` function) diff --git a/.changeset/itchy-feet-poke.md b/.changeset/itchy-feet-poke.md deleted file mode 100644 index 37257c5d70..0000000000 --- a/.changeset/itchy-feet-poke.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@hashicorp/design-system-components": minor ---- - -`Tabs` - Added `@size` argument with new "large" size variant diff --git a/.changeset/long-meals-appear.md b/.changeset/long-meals-appear.md deleted file mode 100644 index fed5e77168..0000000000 --- a/.changeset/long-meals-appear.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@hashicorp/design-system-components": patch ---- - -`Dropdown` - Fixed dropdown list missing an accessible name when Checkmark items were passed in diff --git a/.changeset/modern-zebras-destroy.md b/.changeset/modern-zebras-destroy.md deleted file mode 100644 index 851ad6b2b6..0000000000 --- a/.changeset/modern-zebras-destroy.md +++ /dev/null @@ -1,29 +0,0 @@ ---- -"@hashicorp/design-system-components": major ---- - -`Table` - Multiple updates to the main component and its subcomponents: - -- Updated table headers to support tooltips -- Updated visual treatment and location of the "sort" button in the table headers -- Refactored CSS code to simplify usage of `hds-table`-related class names - -`Table::ThSort`: - -- Added support for tooltip via the `@tooltip` argument -- Updated visual treatment and location of the "sort" button -- Updated DOM structure of the `` content -- Remove class `hds-table__th-sort--button-content` -- Replaced class `hds-table__th-sort` with classes `hds-table__th` + `hds-table__th--sort` -- Replaced class `hds-table__th-sort--text--[left|center|right]` with `hds-table__th--align-[left|center|right]` -- Renamed `onClick` callback to `onClickSort` - -`Table::Th`: - -- Added support for tooltip via the `@tooltip` argument -- Updated DOM structure of the `` content -- Replaced class `hds-table__th--text-[left|center|right]` with `hds-table__th--align-[left|center|right]` - -`Table::Td`: - -- Replaced class `hds-table__td--text-[left|center|right]` with `hds-table__td--align-[left|center|right]` diff --git a/.changeset/popular-papayas-march.md b/.changeset/popular-papayas-march.md deleted file mode 100644 index 458ab33f81..0000000000 --- a/.changeset/popular-papayas-march.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@hashicorp/design-system-components": patch ---- - -`Flyout` - Reduce gap between Flyout and edge of screen from 40px to half of the minimized `SideNav` width in medium view. diff --git a/.changeset/silver-masks-change.md b/.changeset/silver-masks-change.md deleted file mode 100644 index e96a2ef21e..0000000000 --- a/.changeset/silver-masks-change.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@hashicorp/design-system-components": patch ---- - -Remove `ember-deep-tracked` dependency that was not used diff --git a/.changeset/smart-glasses-turn.md b/.changeset/smart-glasses-turn.md deleted file mode 100644 index 7dd282869c..0000000000 --- a/.changeset/smart-glasses-turn.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@hashicorp/design-system-codemods": patch ---- - -Add codemods for `design-system-components` v4 diff --git a/.changeset/sour-tigers-pull.md b/.changeset/sour-tigers-pull.md deleted file mode 100644 index d85daf4059..0000000000 --- a/.changeset/sour-tigers-pull.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@hashicorp/design-system-components": major ---- - -`Pagination` - Removed handling of query parameters from `onPageSizeChange` function for `Pagination::Numbered`. - -_Unfortunately, it's not possible to cover this breaking change with a codemod. Consumers should review their usage of the `onPageSizeChange` callback and, if necessary, implement the persistence of the "page number" and "page size" values via query parameters themselves._ diff --git a/.changeset/strong-balloons-repeat.md b/.changeset/strong-balloons-repeat.md deleted file mode 100644 index 82770499d9..0000000000 --- a/.changeset/strong-balloons-repeat.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@hashicorp/design-system-components": patch ---- - -`SideNav` - fixed issue with navigation elements remaining interactive when minimized diff --git a/.changeset/two-gorillas-tease.md b/.changeset/two-gorillas-tease.md deleted file mode 100644 index ff05456949..0000000000 --- a/.changeset/two-gorillas-tease.md +++ /dev/null @@ -1,12 +0,0 @@ ---- -"@hashicorp/design-system-components": major ---- - -Renamed namespaced contextual components as follows: - - - `Alert::Link::Standalone` to `Alert::LinkStandalone` - - `ApplicationState::Footer::Link::Standalone` to `ApplicationState::Footer::LinkStandalone` - - `Form::Checkbox::Group::Checkbox::Field` to `Checkbox::Group::CheckboxField` - - `Form::Radio::Group::Radio::Field` to `Form::Radio::Group::RadioField` - - `Form::Toggle::Group::Toggle::Field` to `Form::Toggle::Group::ToggleField` - - `Toast::Link::Standalone` to `Toast::LinkStandalone` diff --git a/packages/codemods/CHANGELOG.md b/packages/codemods/CHANGELOG.md index e593c9654e..e967a83627 100644 --- a/packages/codemods/CHANGELOG.md +++ b/packages/codemods/CHANGELOG.md @@ -1,5 +1,15 @@ # @hashicorp/design-system-codemods +## 0.1.1 + +### Patch Changes + +Add codemods for `design-system-components` v4 + +[#1884](https://github.com/hashicorp/design-system/pull/1884) + +
+ ## 0.1.0 ### Minor Changes diff --git a/packages/codemods/package.json b/packages/codemods/package.json index e0ffa9dd71..04fbff8f69 100644 --- a/packages/codemods/package.json +++ b/packages/codemods/package.json @@ -1,7 +1,7 @@ { "name": "@hashicorp/design-system-codemods", "description": "Helios Design System codemods", - "version": "0.1.0", + "version": "0.1.1", "scripts": { "lint": "eslint --cache .", "test": "codemod-cli test", diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index 5e394a1154..3b3492bc81 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -1,5 +1,143 @@ # @hashicorp/design-system-components +## 4.0.0 + +### Major Changes + +Converted Ember packages to v2 addon format. + +To migrate update Sass cofiguration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: + +```js +sassOptions: { + precision: 4, + includePaths: [ + './node_modules/@hashicorp/design-system-tokens/dist/products/css', + './node_modules/@hashicorp/ember-flight-icons/dist/styles' + './node_modules/@hashicorp/design-system-components/dist/styles', + ], +}, +``` + +Alternatively, you can import the CSS by adding this configuration in `ember-cli-build.js`. + +```js +app.import( + "node_modules/@hashicorp/design-system-components/dist/styles/@hashicorp/design-system-components.css" +); +``` + +[#1872](https://github.com/hashicorp/design-system/pull/1872) + +
+ +`Form::CharacterCount` - refactored the component, removing `onInsert` callback and adding use `@value` argument + +To migrate: + +- for standalone `Form::CharacterCount` instances you must pass in a `@value` arguments representing the value of the referenced input +- when used as a contextual component `F.CharacterCount` in `Form::[MaskedInput|TextInput|Textarea]::Field` make sure the form control is updating the associated `@value` on input (usually using `{{on "input" (fn this.updateValue)}}` function) + +[#1896](https://github.com/hashicorp/design-system/pull/1896) - Thanks [@meirish](https://github.com/meirish) for the contribution! 🙏 + +
+ +`Table` - Multiple updates to the main component and its subcomponents: + +- Updated table headers to support tooltips +- Updated visual treatment and location of the "sort" button in the table headers +- Refactored CSS code to simplify usage of `hds-table`-related class names + +`Table::ThSort`: + +- Added support for tooltip via the `@tooltip` argument +- Updated visual treatment and location of the "sort" button +- Updated DOM structure of the `` content +- Remove class `hds-table__th-sort--button-content` +- Replaced class `hds-table__th-sort` with classes `hds-table__th` + `hds-table__th--sort` +- Replaced class `hds-table__th-sort--text--[left|center|right]` with `hds-table__th--align-[left|center|right]` +- Renamed `onClick` callback to `onClickSort` + +`Table::Th`: + +- Added support for tooltip via the `@tooltip` argument +- Updated DOM structure of the `` content +- Replaced class `hds-table__th--text-[left|center|right]` with `hds-table__th--align-[left|center|right]` + +`Table::Td`: + +- Replaced class `hds-table__td--text-[left|center|right]` with `hds-table__td--align-[left|center|right]` + +[#1860](https://github.com/hashicorp/design-system/pull/1860) + +
+ +`Pagination` - Removed handling of query parameters from `onPageSizeChange` function for `Pagination::Numbered`. + +_Unfortunately, it's not possible to cover this breaking change with a codemod. Consumers should review their usage of the `onPageSizeChange` callback and, if necessary, implement the persistence of the "page number" and "page size" values via query parameters themselves._ + +[#1913](https://github.com/hashicorp/design-system/pull/1913) + +
+ +Renamed namespaced contextual components as follows: + +- `Alert::Link::Standalone` to `Alert::LinkStandalone` +- `ApplicationState::Footer::Link::Standalone` to `ApplicationState::Footer::LinkStandalone` +- `Form::Checkbox::Group::Checkbox::Field` to `Checkbox::Group::CheckboxField` +- `Form::Radio::Group::Radio::Field` to `Form::Radio::Group::RadioField` +- `Form::Toggle::Group::Toggle::Field` to `Form::Toggle::Group::ToggleField` +- `Toast::Link::Standalone` to `Toast::LinkStandalone` + +[#1884](https://github.com/hashicorp/design-system/pull/1884) + +
+ +### Minor Changes + +`Table` - Added multi-select functionality + +[#1859](https://github.com/hashicorp/design-system/pull/1859) + +
+ +`Tabs` - Added `@size` argument with new "large" size variant + +[#1937](https://github.com/hashicorp/design-system/pull/1937) + +
+ +### Patch Changes + +`Dropdown` - Fixed dropdown list missing an accessible name when Checkmark items were passed in + +[#1910](https://github.com/hashicorp/design-system/pull/1910) + +
+ +`Flyout` - Reduce gap between Flyout and edge of screen from 40px to half of the minimized `SideNav` width in medium view. + +[#1957](https://github.com/hashicorp/design-system/pull/1957) + +
+ +Remove `ember-deep-tracked` dependency that was not used + +[#1950](https://github.com/hashicorp/design-system/pull/1950) + +
+ +`SideNav` - fixed issue with navigation elements remaining interactive when minimized + +[#1909](https://github.com/hashicorp/design-system/pull/1909) + +
+ +**🔄 Updated dependencies:** + +- @hashicorp/ember-flight-icons@5.0.0 +- @hashicorp/design-system-tokens@2.0.0 + ## 3.6.0 ### Minor Changes @@ -11,7 +149,6 @@ _Since this is an update brand colors and product icons, we consider this a `min - @hashicorp/design-system-tokens@1.11.0 - @hashicorp/ember-flight-icons@4.1.0 - ## 3.5.0 ### Minor Changes diff --git a/packages/components/package.json b/packages/components/package.json index 3080de954d..c0d2f802da 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -1,6 +1,6 @@ { "name": "@hashicorp/design-system-components", - "version": "3.6.0", + "version": "4.0.0", "description": "Helios Design System Components", "keywords": [ "hashicorp", @@ -35,8 +35,8 @@ "@ember/string": "^3.1.1", "@ember/test-waiters": "^3.1.0", "@embroider/addon-shim": "^1.8.7", - "@hashicorp/design-system-tokens": "^1.11.0", - "@hashicorp/ember-flight-icons": "^4.1.0", + "@hashicorp/design-system-tokens": "^2.0.0", + "@hashicorp/ember-flight-icons": "^5.0.0", "dialog-polyfill": "^0.5.6", "ember-a11y-refocus": "^3.0.2", "ember-cli-sass": "^11.0.1", diff --git a/packages/ember-flight-icons/CHANGELOG.md b/packages/ember-flight-icons/CHANGELOG.md index 5a512d3bd0..e965be6586 100644 --- a/packages/ember-flight-icons/CHANGELOG.md +++ b/packages/ember-flight-icons/CHANGELOG.md @@ -1,5 +1,36 @@ # @hashicorp/ember-flight-icons +## 5.0.0 + +### Major Changes + +Converted Ember packages to v2 addon format. + +To migrate update Sass cofiguration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: + +```js +sassOptions: { + precision: 4, + includePaths: [ + './node_modules/@hashicorp/design-system-tokens/dist/products/css', + './node_modules/@hashicorp/ember-flight-icons/dist/styles' + './node_modules/@hashicorp/design-system-components/dist/styles', + ], +}, +``` + +Alternatively, you can import the CSS by adding this configuration in `ember-cli-build.js`. + +```js +app.import( + "node_modules/@hashicorp/design-system-components/dist/styles/@hashicorp/design-system-components.css" +); +``` + +[#1872](https://github.com/hashicorp/design-system/pull/1872) + +
+ ## 4.1.0 ### Minor Changes @@ -16,7 +47,6 @@ Improved resilience of SVG sprite loading script - @hashicorp/flight-icons@3.0.0 - ## 4.0.6 ### Patch Changes diff --git a/packages/ember-flight-icons/package.json b/packages/ember-flight-icons/package.json index d2cee2b6f6..b1e2c2fe9a 100644 --- a/packages/ember-flight-icons/package.json +++ b/packages/ember-flight-icons/package.json @@ -1,6 +1,6 @@ { "name": "@hashicorp/ember-flight-icons", - "version": "4.1.0", + "version": "5.0.0", "description": "The Ember addon for the HashiCorp Flight SVG icon set", "keywords": [ "ember-addon", diff --git a/packages/tokens/CHANGELOG.md b/packages/tokens/CHANGELOG.md index 4f83448bb8..5bb917209c 100644 --- a/packages/tokens/CHANGELOG.md +++ b/packages/tokens/CHANGELOG.md @@ -1,5 +1,20 @@ # @hashicorp/design-system-tokens +## 2.0.0 + +### Major Changes + +New tokens added for large and medium size `Tab` variants. The "medium" tokens replace the former equivalent tokens which were not differentiated by size. + +- `--token-tabs-tab-height-medium` (**Replaces `--token-tabs-tab-height`**) +- `--token-tabs-tab-height-large` (**New**) +- `--token-tabs-tab-padding-horizontal-medium` (**Replaces `--token-tabs-tab-padding-horizontal`**) +- `--token-tabs-tab-padding-horizontal-large` (**New**) + +[#1937](https://github.com/hashicorp/design-system/pull/1937) + +
+ ## 1.11.0 ### Minor Changes diff --git a/packages/tokens/package.json b/packages/tokens/package.json index 11232b3017..b87182c9f3 100644 --- a/packages/tokens/package.json +++ b/packages/tokens/package.json @@ -1,6 +1,6 @@ { "name": "@hashicorp/design-system-tokens", - "version": "1.11.0", + "version": "2.0.0", "description": "Helios Design Tokens", "keywords": [ "hashicorp", diff --git a/website/docs/whats-new/release-notes/partials/components.md b/website/docs/whats-new/release-notes/partials/components.md index 86b0ec47a1..c046e9228a 100644 --- a/website/docs/whats-new/release-notes/partials/components.md +++ b/website/docs/whats-new/release-notes/partials/components.md @@ -12,6 +12,144 @@

+## 4.0.0 + +**Major changes** + +Converted Ember packages to v2 addon format. + +To migrate update Sass cofiguration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: + +```js +sassOptions: { + precision: 4, + includePaths: [ + './node_modules/@hashicorp/design-system-tokens/dist/products/css', + './node_modules/@hashicorp/ember-flight-icons/dist/styles' + './node_modules/@hashicorp/design-system-components/dist/styles', + ], +}, +``` + +Alternatively, you can import the CSS by adding this configuration in `ember-cli-build.js`. + +```js +app.import( + "node_modules/@hashicorp/design-system-components/dist/styles/@hashicorp/design-system-components.css" +); +``` + +[#1872](https://github.com/hashicorp/design-system/pull/1872) + +
+ +`Form::CharacterCount` - refactored the component, removing `onInsert` callback and adding use `@value` argument + +To migrate: + +- for standalone `Form::CharacterCount` instances you must pass in a `@value` arguments representing the value of the referenced input +- when used as a contextual component `F.CharacterCount` in `Form::[MaskedInput|TextInput|Textarea]::Field` make sure the form control is updating the associated `@value` on input (usually using `{{on "input" (fn this.updateValue)}}` function) + +[#1896](https://github.com/hashicorp/design-system/pull/1896) - Thanks [@meirish](https://github.com/meirish) for the contribution! 🙏 + +
+ +`Table` - Multiple updates to the main component and its subcomponents: + +- Updated table headers to support tooltips +- Updated visual treatment and location of the "sort" button in the table headers +- Refactored CSS code to simplify usage of `hds-table`-related class names + +`Table::ThSort`: + +- Added support for tooltip via the `@tooltip` argument +- Updated visual treatment and location of the "sort" button +- Updated DOM structure of the `` content +- Remove class `hds-table__th-sort--button-content` +- Replaced class `hds-table__th-sort` with classes `hds-table__th` + `hds-table__th--sort` +- Replaced class `hds-table__th-sort--text--[left|center|right]` with `hds-table__th--align-[left|center|right]` +- Renamed `onClick` callback to `onClickSort` + +`Table::Th`: + +- Added support for tooltip via the `@tooltip` argument +- Updated DOM structure of the `` content +- Replaced class `hds-table__th--text-[left|center|right]` with `hds-table__th--align-[left|center|right]` + +`Table::Td`: + +- Replaced class `hds-table__td--text-[left|center|right]` with `hds-table__td--align-[left|center|right]` + +[#1860](https://github.com/hashicorp/design-system/pull/1860) + +
+ +`Pagination` - Removed handling of query parameters from `onPageSizeChange` function for `Pagination::Numbered`. + +_Unfortunately, it's not possible to cover this breaking change with a codemod. Consumers should review their usage of the `onPageSizeChange` callback and, if necessary, implement the persistence of the "page number" and "page size" values via query parameters themselves._ + +[#1913](https://github.com/hashicorp/design-system/pull/1913) + +
+ +Renamed namespaced contextual components as follows: + +- `Alert::Link::Standalone` to `Alert::LinkStandalone` +- `ApplicationState::Footer::Link::Standalone` to `ApplicationState::Footer::LinkStandalone` +- `Form::Checkbox::Group::Checkbox::Field` to `Checkbox::Group::CheckboxField` +- `Form::Radio::Group::Radio::Field` to `Form::Radio::Group::RadioField` +- `Form::Toggle::Group::Toggle::Field` to `Form::Toggle::Group::ToggleField` +- `Toast::Link::Standalone` to `Toast::LinkStandalone` + +[#1884](https://github.com/hashicorp/design-system/pull/1884) + +
+ +**Minor changes** + +`Table` - Added multi-select functionality + +[#1859](https://github.com/hashicorp/design-system/pull/1859) + +
+ +`Tabs` - Added `@size` argument with new "large" size variant + +[#1937](https://github.com/hashicorp/design-system/pull/1937) + +
+ +**Patch changes** + +`Dropdown` - Fixed dropdown list missing an accessible name when Checkmark items were passed in + +[#1910](https://github.com/hashicorp/design-system/pull/1910) + +
+ +`Flyout` - Reduce gap between Flyout and edge of screen from 40px to half of the minimized `SideNav` width in medium view. + +[#1957](https://github.com/hashicorp/design-system/pull/1957) + +
+ +Remove `ember-deep-tracked` dependency that was not used + +[#1950](https://github.com/hashicorp/design-system/pull/1950) + +
+ +`SideNav` - fixed issue with navigation elements remaining interactive when minimized + +[#1909](https://github.com/hashicorp/design-system/pull/1909) + +
+ +**🔄 Updated dependencies:** + +- @hashicorp/ember-flight-icons@5.0.0 +- @hashicorp/design-system-tokens@2.0.0 + ## 3.6.0 **Minor changes** @@ -23,7 +161,6 @@ _Since this is an update brand colors and product icons, we consider this a `min - @hashicorp/design-system-tokens@1.11.0 - @hashicorp/ember-flight-icons@4.1.0 - ## 3.5.0 **Minor changes** @@ -586,45 +723,6 @@ _Notice: while technically this is a breaking change, we consider this a fast-fo [#1635](https://github.com/hashicorp/design-system/pull/1635) -## 2.12.0 - -**Minor changes** - -`IconTile` - updated component to include `vault-secrets` product option - -[#1640](https://github.com/hashicorp/design-system/pull/1640) - -**Patch changes** - -`Text` - Removed leftover `console.log` from code - -[#1615](https://github.com/hashicorp/design-system/pull/1615) - -
- -Refactored the layout of the `Dropdown` checkbox and radio inputs to make the gap between the inputs and the associated text, as well as the icon and count, clickable. - -[#1618](https://github.com/hashicorp/design-system/pull/1618) - -
- -`Hds::Link::Standalone` - Changed font-weight from 500 to 400 to match font-weight of `Hds::Button`. - -[#1617](https://github.com/hashicorp/design-system/pull/1617) - -
- -`Stepper` - removed some CSS declarations that were not used/applied - -[#1628](https://github.com/hashicorp/design-system/pull/1628) - -
- -**🔄 Updated dependencies:** - -- @hashicorp/design-system-tokens@1.8.0 -- @hashicorp/ember-flight-icons@3.1.2 - --- diff --git a/website/docs/whats-new/release-notes/partials/design-tokens.md b/website/docs/whats-new/release-notes/partials/design-tokens.md index 47621453e3..f2855c2890 100644 --- a/website/docs/whats-new/release-notes/partials/design-tokens.md +++ b/website/docs/whats-new/release-notes/partials/design-tokens.md @@ -12,6 +12,21 @@

+## 2.0.0 + +**Major changes** + +New tokens added for large and medium size `Tab` variants. The "medium" tokens replace the former equivalent tokens which were not differentiated by size. + +- `--token-tabs-tab-height-medium` (**Replaces `--token-tabs-tab-height`**) +- `--token-tabs-tab-height-large` (**New**) +- `--token-tabs-tab-padding-horizontal-medium` (**Replaces `--token-tabs-tab-padding-horizontal`**) +- `--token-tabs-tab-padding-horizontal-large` (**New**) + +[#1937](https://github.com/hashicorp/design-system/pull/1937) + +
+ ## 1.11.0 **Minor changes** @@ -181,12 +196,6 @@ This release signifies the first major release of the HashiCorp Design System. M - [#98](https://github.com/hashicorp/design-system/pull/98) [`411cd9b9`](https://github.com/hashicorp/design-system/commit/411cd9b949e376d38eb1dc4d4af93ae17e6c686a) Thanks [@didoo](https://github.com/didoo)! - refactored “focus-ring” tokens and CSS helpers to support both “action” and “critical“ colors -## 0.6.1 - -**Patch changes** - -- [#83](https://github.com/hashicorp/design-system/pull/83) [`df267ec6`](https://github.com/hashicorp/design-system/commit/df267ec6cb27d68d0e835357ba736830cac9ce64) Thanks [@didoo](https://github.com/didoo)! - Added “foreground-action-visited-hover” color token to DevDot - --- diff --git a/website/docs/whats-new/release-notes/partials/ember-flight-icons.md b/website/docs/whats-new/release-notes/partials/ember-flight-icons.md index cbc095988d..85987dbb13 100644 --- a/website/docs/whats-new/release-notes/partials/ember-flight-icons.md +++ b/website/docs/whats-new/release-notes/partials/ember-flight-icons.md @@ -12,6 +12,37 @@

+## 5.0.0 + +**Major changes** + +Converted Ember packages to v2 addon format. + +To migrate update Sass cofiguration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: + +```js +sassOptions: { + precision: 4, + includePaths: [ + './node_modules/@hashicorp/design-system-tokens/dist/products/css', + './node_modules/@hashicorp/ember-flight-icons/dist/styles' + './node_modules/@hashicorp/design-system-components/dist/styles', + ], +}, +``` + +Alternatively, you can import the CSS by adding this configuration in `ember-cli-build.js`. + +```js +app.import( + "node_modules/@hashicorp/design-system-components/dist/styles/@hashicorp/design-system-components.css" +); +``` + +[#1872](https://github.com/hashicorp/design-system/pull/1872) + +
+ ## 4.1.0 **Minor changes** @@ -220,15 +251,6 @@ Fix error message for mismatched icon `@name` [#1375](https://github.com/hashicorp/design-system/pull/1375) [`2c7d70868`](https://github.com/hashicorp/design-system/commit/2c7d70868b0fa000618214589e2422e07db68b22) -## 3.0.2 - -**Patch changes** - -- [#715](https://github.com/hashicorp/design-system/pull/715) [`aeff4e02`](https://github.com/hashicorp/design-system/commit/aeff4e02e3c5c738104be326569c110dc2f79618) Thanks [@Dhaulagiri](https://github.com/Dhaulagiri)! - remove `ember-test-selectors` peerDependency - -- Updated dependencies [[`f9c22874`](https://github.com/hashicorp/design-system/commit/f9c22874ab24db25ee347c95e5c26dc0055a642e), [`b95f448a`](https://github.com/hashicorp/design-system/commit/b95f448a31cc138436caf0aae332139c5129d9dc)]: - - @hashicorp/flight-icons@2.12.0 - --- diff --git a/website/docs/whats-new/release-notes/partials/figma-library-foundations.md b/website/docs/whats-new/release-notes/partials/figma-library-foundations.md index 8128eb4b9c..4a93fa8c0e 100644 --- a/website/docs/whats-new/release-notes/partials/figma-library-foundations.md +++ b/website/docs/whats-new/release-notes/partials/figma-library-foundations.md @@ -18,11 +18,11 @@ ### October 31st, 2023 -`Components / Code Block / Code / 200` - Added component-specific text style for the Code Block. +`Components / Code Block / Code / 200` - Added component-specific text style for the CodeBlock. ### October 20th, 2023 -`Components / Code Block / Syntax` - Added syntax highlighting styles used by the Code Block component. +`Components / Code Block / Syntax` - Added syntax highlighting styles used by the CodeBlock component. --- diff --git a/yarn.lock b/yarn.lock index 00fe71ce36..c278300813 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3547,8 +3547,8 @@ __metadata: "@ember/test-waiters": "npm:^3.1.0" "@embroider/addon-dev": "npm:^4.1.3" "@embroider/addon-shim": "npm:^1.8.7" - "@hashicorp/design-system-tokens": "npm:^1.11.0" - "@hashicorp/ember-flight-icons": "npm:^4.1.0" + "@hashicorp/design-system-tokens": "npm:^2.0.0" + "@hashicorp/ember-flight-icons": "npm:^5.0.0" "@rollup/plugin-babel": "npm:^6.0.4" "@tsconfig/ember": "npm:^3.0.2" "@types/ember-qunit": "npm:^6.1.1" @@ -3591,7 +3591,7 @@ __metadata: languageName: unknown linkType: soft -"@hashicorp/design-system-tokens@npm:^1.11.0, @hashicorp/design-system-tokens@workspace:^, @hashicorp/design-system-tokens@workspace:packages/tokens": +"@hashicorp/design-system-tokens@npm:^2.0.0, @hashicorp/design-system-tokens@workspace:^, @hashicorp/design-system-tokens@workspace:packages/tokens": version: 0.0.0-use.local resolution: "@hashicorp/design-system-tokens@workspace:packages/tokens" dependencies: @@ -3622,7 +3622,7 @@ __metadata: languageName: unknown linkType: soft -"@hashicorp/ember-flight-icons@npm:^4.1.0, @hashicorp/ember-flight-icons@workspace:^, @hashicorp/ember-flight-icons@workspace:packages/ember-flight-icons": +"@hashicorp/ember-flight-icons@npm:^5.0.0, @hashicorp/ember-flight-icons@workspace:^, @hashicorp/ember-flight-icons@workspace:packages/ember-flight-icons": version: 0.0.0-use.local resolution: "@hashicorp/ember-flight-icons@workspace:packages/ember-flight-icons" dependencies: From e105d77e541cff3562c6def8f952638a12b97b59 Mon Sep 17 00:00:00 2001 From: Alex Date: Tue, 27 Feb 2024 10:09:10 +0000 Subject: [PATCH 2/7] Correct `design-system-codemods` version to minor --- packages/codemods/CHANGELOG.md | 6 +++--- packages/codemods/package.json | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/codemods/CHANGELOG.md b/packages/codemods/CHANGELOG.md index e967a83627..c7d3ec53cf 100644 --- a/packages/codemods/CHANGELOG.md +++ b/packages/codemods/CHANGELOG.md @@ -1,12 +1,12 @@ # @hashicorp/design-system-codemods -## 0.1.1 +## 0.2.0 -### Patch Changes +### Minor Changes Add codemods for `design-system-components` v4 - +
diff --git a/packages/codemods/package.json b/packages/codemods/package.json index 04fbff8f69..72d82e941e 100644 --- a/packages/codemods/package.json +++ b/packages/codemods/package.json @@ -1,7 +1,7 @@ { "name": "@hashicorp/design-system-codemods", "description": "Helios Design System codemods", - "version": "0.1.1", + "version": "0.2.0", "scripts": { "lint": "eslint --cache .", "test": "codemod-cli test", From 87894c7e71bc233e059f748ec2e312f9117954fe Mon Sep 17 00:00:00 2001 From: Alex Date: Tue, 27 Feb 2024 10:09:42 +0000 Subject: [PATCH 3/7] Fix typos --- packages/components/CHANGELOG.md | 4 +++- packages/ember-flight-icons/CHANGELOG.md | 2 +- website/docs/whats-new/release-notes/partials/components.md | 4 +++- .../whats-new/release-notes/partials/ember-flight-icons.md | 2 +- 4 files changed, 8 insertions(+), 4 deletions(-) diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index 3b3492bc81..01b25be472 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -6,7 +6,7 @@ Converted Ember packages to v2 addon format. -To migrate update Sass cofiguration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: +To migrate update Sass configuration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: ```js sassOptions: { @@ -68,6 +68,8 @@ To migrate: - Replaced class `hds-table__td--text-[left|center|right]` with `hds-table__td--align-[left|center|right]` +To migrate run the codemod `v4/table` (see [readme file](https://github.com/hashicorp/design-system/tree/main/packages/codemods/transforms/v4/table)) +
diff --git a/packages/ember-flight-icons/CHANGELOG.md b/packages/ember-flight-icons/CHANGELOG.md index e965be6586..dad7dbf7a9 100644 --- a/packages/ember-flight-icons/CHANGELOG.md +++ b/packages/ember-flight-icons/CHANGELOG.md @@ -6,7 +6,7 @@ Converted Ember packages to v2 addon format. -To migrate update Sass cofiguration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: +To migrate update Sass configuration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: ```js sassOptions: { diff --git a/website/docs/whats-new/release-notes/partials/components.md b/website/docs/whats-new/release-notes/partials/components.md index c046e9228a..375886de7c 100644 --- a/website/docs/whats-new/release-notes/partials/components.md +++ b/website/docs/whats-new/release-notes/partials/components.md @@ -18,7 +18,7 @@ Converted Ember packages to v2 addon format. -To migrate update Sass cofiguration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: +To migrate update Sass configuration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: ```js sassOptions: { @@ -80,6 +80,8 @@ To migrate: - Replaced class `hds-table__td--text-[left|center|right]` with `hds-table__td--align-[left|center|right]` +To migrate run the codemod `v4/table` (see [readme file](https://github.com/hashicorp/design-system/tree/main/packages/codemods/transforms/v4/table)) +
diff --git a/website/docs/whats-new/release-notes/partials/ember-flight-icons.md b/website/docs/whats-new/release-notes/partials/ember-flight-icons.md index 85987dbb13..3afad4209d 100644 --- a/website/docs/whats-new/release-notes/partials/ember-flight-icons.md +++ b/website/docs/whats-new/release-notes/partials/ember-flight-icons.md @@ -18,7 +18,7 @@ Converted Ember packages to v2 addon format. -To migrate update Sass cofiguration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: +To migrate update Sass configuration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: ```js sassOptions: { From 4d65ae8c2aa10b635ea23b3119029998b47b7fcb Mon Sep 17 00:00:00 2001 From: Alex Date: Tue, 27 Feb 2024 10:12:55 +0000 Subject: [PATCH 4/7] Fix capital letter --- packages/components/CHANGELOG.md | 2 +- website/docs/whats-new/release-notes/partials/components.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index 01b25be472..e7fb6a3468 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -129,7 +129,7 @@ Remove `ember-deep-tracked` dependency that was not used
-`SideNav` - fixed issue with navigation elements remaining interactive when minimized +`SideNav` - Fixed issue with naixed issue with navigation elements remaining interactive when minimized diff --git a/website/docs/whats-new/release-notes/partials/components.md b/website/docs/whats-new/release-notes/partials/components.md index 375886de7c..88c817b29d 100644 --- a/website/docs/whats-new/release-notes/partials/components.md +++ b/website/docs/whats-new/release-notes/partials/components.md @@ -141,7 +141,7 @@ Remove `ember-deep-tracked` dependency that was not used
-`SideNav` - fixed issue with navigation elements remaining interactive when minimized +`SideNav` - Fixed issue with navigation elements remaining interactive when minimized From 360feead280da4601f3201d16a9a1d2d440da959 Mon Sep 17 00:00:00 2001 From: Alex Date: Tue, 27 Feb 2024 10:17:44 +0000 Subject: [PATCH 5/7] Additional content fixes Tense, format and typos --- packages/components/CHANGELOG.md | 8 ++++---- .../docs/whats-new/release-notes/partials/components.md | 6 +++--- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index e7fb6a3468..1b9589b7ad 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -74,7 +74,7 @@ To migrate run the codemod `v4/table` (see [readme file](https://github.com/hash
-`Pagination` - Removed handling of query parameters from `onPageSizeChange` function for `Pagination::Numbered`. +`Pagination` - Removed handling of query parameters from `onPageSizeChange` function for `Pagination::Numbered` _Unfortunately, it's not possible to cover this breaking change with a codemod. Consumers should review their usage of the `onPageSizeChange` callback and, if necessary, implement the persistence of the "page number" and "page size" values via query parameters themselves._ @@ -117,19 +117,19 @@ Renamed namespaced contextual components as follows:
-`Flyout` - Reduce gap between Flyout and edge of screen from 40px to half of the minimized `SideNav` width in medium view. +`Flyout` - Reduced gap between Flyout and edge of screen from `40px` to half of the minimized SideNav width in medium view
-Remove `ember-deep-tracked` dependency that was not used +Removed `ember-deep-tracked` dependency that was not used
-`SideNav` - Fixed issue with naixed issue with navigation elements remaining interactive when minimized +`SideNav` - Fixed issue with navigation elements remaining interactive when minimized diff --git a/website/docs/whats-new/release-notes/partials/components.md b/website/docs/whats-new/release-notes/partials/components.md index 88c817b29d..22f0aacfda 100644 --- a/website/docs/whats-new/release-notes/partials/components.md +++ b/website/docs/whats-new/release-notes/partials/components.md @@ -86,7 +86,7 @@ To migrate run the codemod `v4/table` (see [readme file](https://github.com/hash
-`Pagination` - Removed handling of query parameters from `onPageSizeChange` function for `Pagination::Numbered`. +`Pagination` - Removed handling of query parameters from `onPageSizeChange` function for `Pagination::Numbered` _Unfortunately, it's not possible to cover this breaking change with a codemod. Consumers should review their usage of the `onPageSizeChange` callback and, if necessary, implement the persistence of the "page number" and "page size" values via query parameters themselves._ @@ -129,13 +129,13 @@ Renamed namespaced contextual components as follows:
-`Flyout` - Reduce gap between Flyout and edge of screen from 40px to half of the minimized `SideNav` width in medium view. +`Flyout` - Reduced gap between Flyout and edge of screen from `40px` to half of the minimized SideNav width in medium view
-Remove `ember-deep-tracked` dependency that was not used +Removed `ember-deep-tracked` dependency that was not used From 126d956a83f18d66b34feee694c9f08a18ff4ad8 Mon Sep 17 00:00:00 2001 From: Alex Date: Tue, 27 Feb 2024 10:25:42 +0000 Subject: [PATCH 6/7] Fix typo --- packages/components/CHANGELOG.md | 4 ++-- website/docs/whats-new/release-notes/partials/components.md | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index 1b9589b7ad..0db114cdad 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -6,7 +6,7 @@ Converted Ember packages to v2 addon format. -To migrate update Sass configuration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: +To migrate, update Sass configuration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: ```js sassOptions: { @@ -35,7 +35,7 @@ app.import( To migrate: -- for standalone `Form::CharacterCount` instances you must pass in a `@value` arguments representing the value of the referenced input +- for standalone `Form::CharacterCount` instances, you must pass in a `@value` argument representing the value of the referenced input - when used as a contextual component `F.CharacterCount` in `Form::[MaskedInput|TextInput|Textarea]::Field` make sure the form control is updating the associated `@value` on input (usually using `{{on "input" (fn this.updateValue)}}` function) diff --git a/website/docs/whats-new/release-notes/partials/components.md b/website/docs/whats-new/release-notes/partials/components.md index 22f0aacfda..b740472b2e 100644 --- a/website/docs/whats-new/release-notes/partials/components.md +++ b/website/docs/whats-new/release-notes/partials/components.md @@ -18,7 +18,7 @@ Converted Ember packages to v2 addon format. -To migrate update Sass configuration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: +To migrate, update Sass configuration in `ember-cli-build.js` to include the paths for `ember-flight-icons` and `design-system-components`: ```js sassOptions: { @@ -47,7 +47,7 @@ app.import( To migrate: -- for standalone `Form::CharacterCount` instances you must pass in a `@value` arguments representing the value of the referenced input +- for standalone `Form::CharacterCount` instances, you must pass in a `@value` argument representing the value of the referenced input - when used as a contextual component `F.CharacterCount` in `Form::[MaskedInput|TextInput|Textarea]::Field` make sure the form control is updating the associated `@value` on input (usually using `{{on "input" (fn this.updateValue)}}` function) From 662659b7e693e7bbb585f34f2a6a632c2a4f1cf4 Mon Sep 17 00:00:00 2001 From: Alex Date: Tue, 27 Feb 2024 10:45:59 +0000 Subject: [PATCH 7/7] Fix syntax braking the website renderer --- packages/components/CHANGELOG.md | 2 +- website/docs/whats-new/release-notes/partials/components.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index 0db114cdad..3a1f20ac24 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -36,7 +36,7 @@ app.import( To migrate: - for standalone `Form::CharacterCount` instances, you must pass in a `@value` argument representing the value of the referenced input -- when used as a contextual component `F.CharacterCount` in `Form::[MaskedInput|TextInput|Textarea]::Field` make sure the form control is updating the associated `@value` on input (usually using `{{on "input" (fn this.updateValue)}}` function) +- when used as a contextual component `F.CharacterCount` in `Form::[MaskedInput|TextInput|Textarea]::Field` make sure the form control is updating the associated `@value` on input (usually using `on "input" (fn this.updateValue)` function) diff --git a/website/docs/whats-new/release-notes/partials/components.md b/website/docs/whats-new/release-notes/partials/components.md index b740472b2e..339c99448d 100644 --- a/website/docs/whats-new/release-notes/partials/components.md +++ b/website/docs/whats-new/release-notes/partials/components.md @@ -48,7 +48,7 @@ app.import( To migrate: - for standalone `Form::CharacterCount` instances, you must pass in a `@value` argument representing the value of the referenced input -- when used as a contextual component `F.CharacterCount` in `Form::[MaskedInput|TextInput|Textarea]::Field` make sure the form control is updating the associated `@value` on input (usually using `{{on "input" (fn this.updateValue)}}` function) +- when used as a contextual component `F.CharacterCount` in `Form::[MaskedInput|TextInput|Textarea]::Field` make sure the form control is updating the associated `@value` on input (usually using `on "input" (fn this.updateValue)` function)