From fe7fb4a255160aa3b930c6698c7346b6ccf85b70 Mon Sep 17 00:00:00 2001 From: Zack Moore Date: Wed, 17 Sep 2025 18:04:46 -0400 Subject: [PATCH 01/33] init commit --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index 4f98f324b50..609e335cfb0 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,5 @@ + + From 34e5beb29dbacde6d53862c505b5bcb98d47210b Mon Sep 17 00:00:00 2001 From: Zack Moore Date: Fri, 19 Sep 2025 15:18:10 -0400 Subject: [PATCH 02/33] `HdsAdvancedTableTh` Remove `@isVisuallyHidden` argument (#3210) --- .changeset/hot-owls-rescue.md | 7 +++++++ .../components/src/components/hds/advanced-table/index.hbs | 1 - .../components/src/components/hds/advanced-table/th.ts | 1 - .../table/advanced-table/partials/code/component-api.md | 3 --- 4 files changed, 7 insertions(+), 5 deletions(-) create mode 100644 .changeset/hot-owls-rescue.md diff --git a/.changeset/hot-owls-rescue.md b/.changeset/hot-owls-rescue.md new file mode 100644 index 00000000000..582a7dff51a --- /dev/null +++ b/.changeset/hot-owls-rescue.md @@ -0,0 +1,7 @@ +--- +"@hashicorp/design-system-components": major +--- + + +`AdvancedTable` - Removed the `@isVisuallyHidden` argument from `HdsAdvancedTableTh` component. This setting is supported via setting `isVisuallyHidden` in the corresponding `@columns` item's configuration. + diff --git a/packages/components/src/components/hds/advanced-table/index.hbs b/packages/components/src/components/hds/advanced-table/index.hbs index 8f8bae33e58..45eb3875f77 100644 --- a/packages/components/src/components/hds/advanced-table/index.hbs +++ b/packages/components/src/components/hds/advanced-table/index.hbs @@ -84,7 +84,6 @@ @isExpandable={{column.isExpandable}} @isStickyColumn={{this._isStickyColumn column}} @isStickyColumnPinned={{this.isStickyColumnPinned}} - @isVisuallyHidden={{column.isVisuallyHidden}} @tableHeight={{this._tableHeight}} @tooltip={{column.tooltip}} @onClickToggle={{this._tableModel.toggleAll}} diff --git a/packages/components/src/components/hds/advanced-table/th.ts b/packages/components/src/components/hds/advanced-table/th.ts index 04e2d84f436..d3531a443cb 100644 --- a/packages/components/src/components/hds/advanced-table/th.ts +++ b/packages/components/src/components/hds/advanced-table/th.ts @@ -44,7 +44,6 @@ export interface HdsAdvancedTableThSignature { isExpandable?: boolean; isStickyColumn?: boolean; isStickyColumnPinned?: boolean; - isVisuallyHidden?: boolean; newLabel?: string; parentId?: string; rowspan?: number; diff --git a/website/docs/components/table/advanced-table/partials/code/component-api.md b/website/docs/components/table/advanced-table/partials/code/component-api.md index 74ace46c2fc..d9f99b3a979 100644 --- a/website/docs/components/table/advanced-table/partials/code/component-api.md +++ b/website/docs/components/table/advanced-table/partials/code/component-api.md @@ -222,9 +222,6 @@ If the `Th` component is passed as the first cell of a body row, `role="rowheade Text string which will appear in the [`Tooltip`](/components/tooltip). May contain basic HTML tags for formatting text such as `strong` and `em` tags. Not intended for multi-paragraph text or other more complex content. May not contain interactive content such as links or buttons. The `placement` and `offset` are automatically set and can’t be overwritten. - - If set to `true`, it visually hides the column’s text content (it will still be available to screen readers for accessibility). - The number of columns the cell spans. Used to apply the correct grid styles and the aria-rowspan attribute for accessibility. From 658dd36e347669860ff79ab52e15e7b311e4da70 Mon Sep 17 00:00:00 2001 From: Zack Moore Date: Mon, 22 Sep 2025 10:01:05 -0400 Subject: [PATCH 03/33] Fix `service` import deprecation (#3181) --- change.diff | 302 ++++++++++++++++++ .../hds/app-side-nav/portal/target.ts | 2 +- .../components/hds/side-nav/portal/target.ts | 2 +- .../src/components/hds/time/index.ts | 2 +- .../src/components/hds/time/range.ts | 2 +- website/app/components/doc/page/banner.js | 2 +- .../doc/page/header/algolia-search/index.js | 2 +- website/app/components/doc/page/sidebar.js | 2 +- .../app/components/doc/scroll-to-top/index.js | 2 +- website/app/controllers/application.js | 2 +- website/app/controllers/show.js | 2 +- website/app/modifiers/doc-track-event.js | 2 +- website/app/routes/show.js | 2 +- website/app/services/event-tracking.js | 2 +- website/app/services/head-data.js | 2 +- website/docs/components/pagination/index.js | 14 +- website/docs/components/tabs/index.js | 4 +- website/docs/foundations/tokens/index.js | 6 +- website/docs/icons/library/index.js | 10 +- 19 files changed, 333 insertions(+), 31 deletions(-) create mode 100644 change.diff diff --git a/change.diff b/change.diff new file mode 100644 index 00000000000..6076ae750ae --- /dev/null +++ b/change.diff @@ -0,0 +1,302 @@ +diff --git a/packages/components/addon-main.cjs b/packages/components/addon-main.cjs +index 797c851c5..da24a0b99 100644 +--- a/packages/components/addon-main.cjs ++++ b/packages/components/addon-main.cjs +@@ -4,19 +4,14 @@ + */ + + const { addonV1Shim } = require('@embroider/addon-shim'); +-const flightIconSprite = require('@hashicorp/flight-icons/svg-sprite/svg-sprite-module'); + + module.exports = { + ...addonV1Shim(__dirname), +- contentFor(type, config) { +- if ( +- !config.flightIconsSpriteLazyEmbed && +- !config.__flightIconsSpriteLoaded && +- type === 'body-footer' +- ) { +- config.__flightIconsSpriteLoaded = true; +- +- return flightIconSprite; +- } ++ options: { ++ '@embroider/macros': { ++ setOwnConfig: { ++ flightIconsSpriteLazyEmbed: true, ++ }, ++ }, + }, + }; +diff --git a/packages/components/package.json b/packages/components/package.json +index 60704a074..da4d2473e 100644 +--- a/packages/components/package.json ++++ b/packages/components/package.json +@@ -62,7 +62,6 @@ + "ember-concurrency": "^4.0.4", + "ember-element-helper": "^0.8.6", + "ember-focus-trap": "^1.1.1", +- "ember-get-config": "^2.1.1", + "ember-modifier": "^4.2.2", + "ember-power-select": "^8.7.1", + "ember-stargate": "^1.0.2", +diff --git a/packages/components/src/instance-initializers/load-sprite.ts b/packages/components/src/instance-initializers/load-sprite.ts +index a88ecd9ec..f98dd61fc 100644 +--- a/packages/components/src/instance-initializers/load-sprite.ts ++++ b/packages/components/src/instance-initializers/load-sprite.ts +@@ -3,19 +3,21 @@ + * SPDX-License-Identifier: MPL-2.0 + */ + +-import config from 'ember-get-config'; ++import { macroCondition, isTesting, getOwnConfig } from '@embroider/macros'; ++ ++interface Config { ++ flightIconsSpriteLazyEmbed: boolean; ++} + + export async function initialize() { +- // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access +- if (config?.flightIconsSpriteLazyEmbed) { ++ if (macroCondition(getOwnConfig().flightIconsSpriteLazyEmbed)) { + const { default: svgSprite } = await import( + '@hashicorp/flight-icons/svg-sprite/svg-sprite-module' + ); + + // in test environments we can inject the sprite directly into the ember testing container + // to avoid issues with tools like Percy that only consider content inside that element +- // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access +- if (config.environment === 'test') { ++ if (macroCondition(isTesting())) { + const container = window.document?.getElementById('ember-testing'); + + if (container && !container.querySelector('.flight-sprite-container')) { +diff --git a/packages/components/src/modifiers/hds-code-editor.ts b/packages/components/src/modifiers/hds-code-editor.ts +index 39f7d60ae..f0c74de7a 100644 +--- a/packages/components/src/modifiers/hds-code-editor.ts ++++ b/packages/components/src/modifiers/hds-code-editor.ts +@@ -7,7 +7,7 @@ import Modifier from 'ember-modifier'; + import { assert, warn } from '@ember/debug'; + import { registerDestructor } from '@ember/destroyable'; + import { task } from 'ember-concurrency'; +-import config from 'ember-get-config'; ++import { macroCondition, isTesting } from '@embroider/macros'; + import { Compartment } from '@codemirror/state'; + import { EditorView } from '@codemirror/view'; + import { guidFor } from '@ember/object/internals'; +@@ -208,8 +208,7 @@ export default class HdsCodeEditorModifier extends Modifier= 18'} + peerDependencies: + '@ember/string': ^3.1.1 || ^4.0.0 ++ ember-basic-dropdown: ^7.3.0 || ^8.6.1 + ember-engines: '>= 0.11.0' + ember-intl: ^7.3.0 + peerDependenciesMeta: +@@ -6425,10 +6417,6 @@ packages: + resolution: {integrity: sha512-gWG1k8+hio1rndJXxzIYhayL7ITof3ebkZ7HwFzFDaz3NARb8MjcVloKj1PFCheu8ZbY8iP8QTRPqb+J+N+Izg==} + engines: {node: '>= 18'} + +- ember-unique-id-helper-polyfill@1.2.2: +- resolution: {integrity: sha512-gjcwTBkCDUA0iYFS7aArfJub+eos/itxEsC399JUbdKNIBJLesB/1OHnmxLLwExZHp7gyHuiDFOPcknafhFm3g==} +- engines: {node: 12.* || 14.* || >= 16} +- + emittery@0.13.1: + resolution: {integrity: sha512-DeWwawk6r5yR9jFgnDKYt4sLS0LmHJJi3ZOnb5/JdbYwj3nW+FxQnHIjhBKz8YLC7oRNPVM9NQ47I3CVx34eqQ==} + engines: {node: '>=12'} +@@ -9840,7 +9828,6 @@ packages: + engines: {node: '>=0.6.0', teleport: '>=0.2.0'} + deprecated: |- + You or someone you depend on is using Q, the JavaScript Promise library that gave JavaScript developers strong feelings about promises. They can almost certainly migrate to the native JavaScript promise now. Thank you literally everyone for joining me in this bet against the odds. Be excellent to each other. +- + (For a CapTP with native promises, see @endo/eventual-send and @endo/captp) + + qs@6.13.0: +@@ -14158,10 +14145,10 @@ snapshots: + codemirror-lang-hcl: 0.0.0-beta.2 + decorator-transforms: 2.3.0(@babel/core@7.28.0) + ember-a11y-refocus: 5.1.0(@babel/core@7.28.0)(ember-source@6.4.0(@glimmer/component@2.0.0)(rsvp@4.8.5)) ++ ember-basic-dropdown: 8.6.2(@babel/core@7.28.0)(@ember/string@4.0.1)(@ember/test-helpers@5.2.2(@babel/core@7.28.0)(@glint/template@1.5.2))(@glimmer/component@2.0.0)(@glint/environment-ember-loose@1.5.2(@glimmer/component@2.0.0)(@glint/template@1.5.2)(ember-cli-htmlbars@6.3.0)(ember-modifier@4.2.2(@babel/core@7.28.0)))(@glint/template@1.5.2)(ember-source@6.4.0(@glimmer/component@2.0.0)(rsvp@4.8.5)) + ember-concurrency: 4.0.4(@babel/core@7.28.0)(@glint/template@1.5.2) + ember-element-helper: 0.8.8 + ember-focus-trap: 1.1.1(ember-source@6.4.0(@glimmer/component@2.0.0)(rsvp@4.8.5)) +- ember-get-config: 2.1.1(@glint/template@1.5.2) + ember-modifier: 4.2.2(@babel/core@7.28.0) + ember-power-select: 8.7.3(@babel/core@7.28.0)(@ember/test-helpers@5.2.2(@babel/core@7.28.0)(@glint/template@1.5.2))(@glimmer/component@2.0.0)(@glint/environment-ember-loose@1.5.2(@glimmer/component@2.0.0)(@glint/template@1.5.2)(ember-cli-htmlbars@6.3.0)(ember-modifier@4.2.2(@babel/core@7.28.0)))(@glint/template@1.5.2)(ember-basic-dropdown@8.6.2(@babel/core@7.28.0)(@ember/string@4.0.1)(@ember/test-helpers@5.2.2(@babel/core@7.28.0)(@glint/template@1.5.2))(@glimmer/component@2.0.0)(@glint/environment-ember-loose@1.5.2(@glimmer/component@2.0.0)(@glint/template@1.5.2)(ember-cli-htmlbars@6.3.0)(ember-modifier@4.2.2(@babel/core@7.28.0)))(@glint/template@1.5.2)(ember-source@6.4.0(@glimmer/component@2.0.0)(rsvp@4.8.5)))(ember-concurrency@4.0.4(@babel/core@7.28.0)(@glint/template@1.5.2))(ember-source@6.4.0(@glimmer/component@2.0.0)(rsvp@4.8.5)) + ember-stargate: 1.0.2(@babel/core@7.28.0)(@glimmer/component@2.0.0)(@glint/template@1.5.2) +@@ -14180,7 +14167,6 @@ snapshots: + - '@glimmer/component' + - '@glint/environment-ember-loose' + - '@glint/template' +- - ember-basic-dropdown + - ember-source + - supports-color + +@@ -14213,10 +14199,10 @@ snapshots: + codemirror-lang-hcl: 0.0.0-beta.2 + decorator-transforms: 2.3.0(@babel/core@7.28.0) + ember-a11y-refocus: 5.1.0(@babel/core@7.28.0)(ember-source@6.5.0(@glimmer/component@2.0.0)(rsvp@4.8.5)) ++ ember-basic-dropdown: 8.6.2(@babel/core@7.28.0)(@ember/string@4.0.1)(@ember/test-helpers@5.2.2(@babel/core@7.28.0)(@glint/template@1.5.2))(@glimmer/component@2.0.0)(@glint/environment-ember-loose@1.5.2(@glimmer/component@2.0.0)(@glint/template@1.5.2)(ember-cli-htmlbars@6.3.0)(ember-modifier@4.2.2(@babel/core@7.28.0)))(@glint/template@1.5.2)(ember-source@6.5.0(@glimmer/component@2.0.0)(rsvp@4.8.5)) + ember-concurrency: 4.0.4(@babel/core@7.28.0)(@glint/template@1.5.2) + ember-element-helper: 0.8.8 + ember-focus-trap: 1.1.1(ember-source@6.5.0(@glimmer/component@2.0.0)(rsvp@4.8.5)) +- ember-get-config: 2.1.1(@glint/template@1.5.2) + ember-modifier: 4.2.2(@babel/core@7.28.0) + ember-power-select: 8.7.3(@babel/core@7.28.0)(@ember/test-helpers@5.2.2(@babel/core@7.28.0)(@glint/template@1.5.2))(@glimmer/component@2.0.0)(@glint/environment-ember-loose@1.5.2(@glimmer/component@2.0.0)(@glint/template@1.5.2)(ember-cli-htmlbars@6.3.0)(ember-modifier@4.2.2(@babel/core@7.28.0)))(@glint/template@1.5.2)(ember-basic-dropdown@8.6.2(@babel/core@7.28.0)(@ember/string@4.0.1)(@ember/test-helpers@5.2.2(@babel/core@7.28.0)(@glint/template@1.5.2))(@glimmer/component@2.0.0)(@glint/environment-ember-loose@1.5.2(@glimmer/component@2.0.0)(@glint/template@1.5.2)(ember-cli-htmlbars@6.3.0)(ember-modifier@4.2.2(@babel/core@7.28.0)))(@glint/template@1.5.2)(ember-source@6.5.0(@glimmer/component@2.0.0)(rsvp@4.8.5)))(ember-concurrency@4.0.4(@babel/core@7.28.0)(@glint/template@1.5.2))(ember-source@6.5.0(@glimmer/component@2.0.0)(rsvp@4.8.5)) + ember-stargate: 1.0.2(@babel/core@7.28.0)(@glimmer/component@2.0.0)(@glint/template@1.5.2) +@@ -14235,7 +14221,6 @@ snapshots: + - '@glimmer/component' + - '@glint/environment-ember-loose' + - '@glint/template' +- - ember-basic-dropdown + - ember-source + - supports-color + +@@ -19832,14 +19817,6 @@ snapshots: + - encoding + - supports-color + +- ember-unique-id-helper-polyfill@1.2.2: +- dependencies: +- broccoli-funnel: 3.0.8 +- ember-cli-babel: 7.26.11 +- ember-cli-version-checker: 5.1.2 +- transitivePeerDependencies: +- - supports-color +- + emittery@0.13.1: {} + + emoji-regex@10.4.0: {} +diff --git a/showcase/ember-cli-build.js b/showcase/ember-cli-build.js +index 72fd59252..5e70ce95e 100644 +--- a/showcase/ember-cli-build.js ++++ b/showcase/ember-cli-build.js +@@ -9,6 +9,14 @@ const EmberApp = require('ember-cli/lib/broccoli/ember-app'); + + module.exports = function (defaults) { + const app = new EmberApp(defaults, { ++ '@embroider/macros': { ++ setConfig: { ++ '@hashicorp/design-system-components': { ++ flightIconsSpriteLazyEmbed: true, ++ }, ++ }, ++ }, ++ + 'ember-cli-babel': { + enableTypeScriptTransform: true, + }, +diff --git a/showcase/package.json b/showcase/package.json +index 9f0cf932a..5ec97a5c4 100644 +--- a/showcase/package.json ++++ b/showcase/package.json +@@ -101,7 +101,6 @@ + "ember-template-lint": "^7.7.0", + "ember-truth-helpers": "^4.0.3", + "ember-try": "^4.0.0", +- "ember-unique-id-helper-polyfill": "^1.2.2", + "eslint": "^9.27.0", + "eslint-config-prettier": "^10.1.5", + "eslint-plugin-ember": "^12.5.0", +diff --git a/website/app/routes/application.js b/website/app/routes/application.js +index 024690b0d..342c9f60f 100644 +--- a/website/app/routes/application.js ++++ b/website/app/routes/application.js +@@ -1,6 +1,7 @@ + import Route from '@ember/routing/route'; + import fetch from 'fetch'; +-import config from 'ember-get-config'; ++ ++import config from '../config/environment'; + + export default class ApplicationRoute extends Route { + model() { +diff --git a/website/app/routes/show.js b/website/app/routes/show.js +index b5f5155e4..df8c2e036 100644 +--- a/website/app/routes/show.js ++++ b/website/app/routes/show.js +@@ -6,11 +6,12 @@ import { + isUnauthorizedResponse, + isNotFoundResponse, + } from 'ember-fetch/errors'; +-import config from 'ember-get-config'; + import { service } from '@ember/service'; + import { action } from '@ember/object'; + import { reject } from 'rsvp'; + ++import config from '../config/environment'; ++ + export default class ShowRoute extends Route { + @service router; + queryParams = { +diff --git a/website/app/services/head-data.js b/website/app/services/head-data.js +index c885741b6..3c2020f99 100644 +--- a/website/app/services/head-data.js ++++ b/website/app/services/head-data.js +@@ -4,9 +4,10 @@ + */ + + import HeadDataService from 'ember-meta/services/head-data'; +-import config from 'ember-get-config'; + import { service } from '@ember/service'; + ++import config from '../config/environment'; ++ + export default class CustomHeadDataService extends HeadDataService { + @service router; + +diff --git a/website/package.json b/website/package.json +index c2b6cca59..901654ac9 100644 +--- a/website/package.json ++++ b/website/package.json +@@ -90,7 +90,6 @@ + "ember-cli-terser": "^4.0.2", + "ember-concurrency": "^4.0.4", + "ember-fetch": "^8.1.2", +- "ember-get-config": "^2.1.1", + "ember-load-initializers": "^3.0.1", + "ember-math-helpers": "^4.2.1", + "ember-meta": "^2.0.0", diff --git a/packages/components/src/components/hds/app-side-nav/portal/target.ts b/packages/components/src/components/hds/app-side-nav/portal/target.ts index c6ec46fea37..d3bd7aac162 100644 --- a/packages/components/src/components/hds/app-side-nav/portal/target.ts +++ b/packages/components/src/components/hds/app-side-nav/portal/target.ts @@ -4,7 +4,7 @@ */ import Component from '@glimmer/component'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; import { tracked } from '@glimmer/tracking'; import { action } from '@ember/object'; import { macroCondition, isTesting } from '@embroider/macros'; diff --git a/packages/components/src/components/hds/side-nav/portal/target.ts b/packages/components/src/components/hds/side-nav/portal/target.ts index 076fb5e9eab..d0eefb7877f 100644 --- a/packages/components/src/components/hds/side-nav/portal/target.ts +++ b/packages/components/src/components/hds/side-nav/portal/target.ts @@ -4,7 +4,7 @@ */ import Component from '@glimmer/component'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; import { tracked } from '@glimmer/tracking'; import { action } from '@ember/object'; import { macroCondition, isTesting } from '@embroider/macros'; diff --git a/packages/components/src/components/hds/time/index.ts b/packages/components/src/components/hds/time/index.ts index 3f35278fe0e..8a54306f9c3 100644 --- a/packages/components/src/components/hds/time/index.ts +++ b/packages/components/src/components/hds/time/index.ts @@ -5,7 +5,7 @@ import Component from '@glimmer/component'; import { typeOf } from '@ember/utils'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; import { action } from '@ember/object'; import type { DisplayType } from '../../../services/hds-time-types.ts'; diff --git a/packages/components/src/components/hds/time/range.ts b/packages/components/src/components/hds/time/range.ts index 1a0081f5efd..7198e56713e 100644 --- a/packages/components/src/components/hds/time/range.ts +++ b/packages/components/src/components/hds/time/range.ts @@ -4,7 +4,7 @@ */ import Component from '@glimmer/component'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; import type TimeService from '../../../services/hds-time'; export interface HdsTimeRangeSignature { diff --git a/website/app/components/doc/page/banner.js b/website/app/components/doc/page/banner.js index 9b3585a69b6..07e27019ec2 100644 --- a/website/app/components/doc/page/banner.js +++ b/website/app/components/doc/page/banner.js @@ -6,7 +6,7 @@ import Component from '@glimmer/component'; import { action } from '@ember/object'; import { tracked } from '@glimmer/tracking'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; const COOKIE_NAME = 'hide-banner'; diff --git a/website/app/components/doc/page/header/algolia-search/index.js b/website/app/components/doc/page/header/algolia-search/index.js index b06c1b25fcd..5dacbdf2634 100644 --- a/website/app/components/doc/page/header/algolia-search/index.js +++ b/website/app/components/doc/page/header/algolia-search/index.js @@ -6,7 +6,7 @@ import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; import { action } from '@ember/object'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; import { autocomplete } from '@algolia/autocomplete-js'; diff --git a/website/app/components/doc/page/sidebar.js b/website/app/components/doc/page/sidebar.js index 11bbecf28a3..3e19a71add2 100644 --- a/website/app/components/doc/page/sidebar.js +++ b/website/app/components/doc/page/sidebar.js @@ -7,7 +7,7 @@ import Component from '@glimmer/component'; import { restartableTask, timeout } from 'ember-concurrency'; import { action } from '@ember/object'; import { tracked } from '@glimmer/tracking'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; const DEBOUNCE_MS = 250; diff --git a/website/app/components/doc/scroll-to-top/index.js b/website/app/components/doc/scroll-to-top/index.js index 76f6472f24b..83743018981 100644 --- a/website/app/components/doc/scroll-to-top/index.js +++ b/website/app/components/doc/scroll-to-top/index.js @@ -5,7 +5,7 @@ import Component from '@glimmer/component'; import { action } from '@ember/object'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; import { tracked } from '@glimmer/tracking'; export default class DocScrollToTopComponent extends Component { diff --git a/website/app/controllers/application.js b/website/app/controllers/application.js index 75371a37580..35a77dbea76 100644 --- a/website/app/controllers/application.js +++ b/website/app/controllers/application.js @@ -7,7 +7,7 @@ import Controller from '@ember/controller'; import { action } from '@ember/object'; import { tracked } from '@glimmer/tracking'; import { scheduleOnce } from '@ember/runloop'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; import { next, later, cancel } from '@ember/runloop'; import { defaultValidator } from 'ember-a11y-refocus'; diff --git a/website/app/controllers/show.js b/website/app/controllers/show.js index 6a3aa626824..9cc91fe5ef3 100644 --- a/website/app/controllers/show.js +++ b/website/app/controllers/show.js @@ -4,7 +4,7 @@ import { set, action } from '@ember/object'; import { tracked } from '@glimmer/tracking'; import { A } from '@ember/array'; import { schedule } from '@ember/runloop'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; import { showdownConfig } from '../shared/showdown-config'; diff --git a/website/app/modifiers/doc-track-event.js b/website/app/modifiers/doc-track-event.js index 0907dc832e6..358d16110c5 100644 --- a/website/app/modifiers/doc-track-event.js +++ b/website/app/modifiers/doc-track-event.js @@ -5,7 +5,7 @@ import Modifier from 'ember-modifier'; import { registerDestructor } from '@ember/destroyable'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; import { assert } from '@ember/debug'; export default class DocTrackEvent extends Modifier { diff --git a/website/app/routes/show.js b/website/app/routes/show.js index 5efb9cef5b2..b5f5155e4e7 100644 --- a/website/app/routes/show.js +++ b/website/app/routes/show.js @@ -7,7 +7,7 @@ import { isNotFoundResponse, } from 'ember-fetch/errors'; import config from 'ember-get-config'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; import { action } from '@ember/object'; import { reject } from 'rsvp'; diff --git a/website/app/services/event-tracking.js b/website/app/services/event-tracking.js index cdec3198227..29fa5a61582 100644 --- a/website/app/services/event-tracking.js +++ b/website/app/services/event-tracking.js @@ -4,7 +4,7 @@ */ import Service from '@ember/service'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; import { action } from '@ember/object'; export default class EventService extends Service { diff --git a/website/app/services/head-data.js b/website/app/services/head-data.js index 4be4aa80618..c885741b65c 100644 --- a/website/app/services/head-data.js +++ b/website/app/services/head-data.js @@ -5,7 +5,7 @@ import HeadDataService from 'ember-meta/services/head-data'; import config from 'ember-get-config'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; export default class CustomHeadDataService extends HeadDataService { @service router; diff --git a/website/docs/components/pagination/index.js b/website/docs/components/pagination/index.js index 8023fb906e3..b87714c7830 100644 --- a/website/docs/components/pagination/index.js +++ b/website/docs/components/pagination/index.js @@ -6,7 +6,7 @@ import Component from '@glimmer/component'; import { action } from '@ember/object'; import { tracked } from '@glimmer/tracking'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; const getCursorParts = (cursor, records) => { const token = atob(cursor); @@ -14,7 +14,7 @@ const getCursorParts = (cursor, records) => { const direction = tokenParts[0]; const cursorID = parseInt(tokenParts[1]); const cursorIndex = records.findIndex( - (element) => element.id === parseInt(cursorID) + (element) => element.id === parseInt(cursorID), ); return { direction, cursorID, cursorIndex }; }; @@ -63,13 +63,13 @@ export default class Index extends Component { get demoCurrentPage() { return parseInt( - this.router?.currentRoute?.queryParams?.demoCurrentPage ?? 1 + this.router?.currentRoute?.queryParams?.demoCurrentPage ?? 1, ); } get demoCurrentPageSize() { return parseInt( - this.router?.currentRoute?.queryParams?.demoCurrentPageSize ?? 5 + this.router?.currentRoute?.queryParams?.demoCurrentPageSize ?? 5, ); } @@ -372,7 +372,7 @@ export default class Index extends Component { let { newPrevCursor, newNextCursor } = getNewPrevNextCursors( this.demoCurrentCursor, this.demoCurrentPageSize, - this.model.records + this.model.records, ); return { newPrevCursor, @@ -413,7 +413,7 @@ export default class Index extends Component { get demoPaginatedDataCompact() { const { direction, cursorIndex } = getCursorParts( this.demoCurrentCursor, - this.model.records + this.model.records, ); let start; @@ -440,7 +440,7 @@ export default class Index extends Component { console.log( pageSize !== undefined ? `Page changed to "${page}" with page size equal to "${pageSize}"!` - : `Page changed to "${page}"!` + : `Page changed to "${page}"!`, ); } diff --git a/website/docs/components/tabs/index.js b/website/docs/components/tabs/index.js index 30901207154..39243ff0b7e 100644 --- a/website/docs/components/tabs/index.js +++ b/website/docs/components/tabs/index.js @@ -5,7 +5,7 @@ import Component from '@glimmer/component'; import { action } from '@ember/object'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; export default class Index extends Component { @service router; @@ -19,7 +19,7 @@ export default class Index extends Component { get demoSelectedTab() { return parseInt( - this.router?.currentRoute?.queryParams?.demoSelectedTab ?? 0 + this.router?.currentRoute?.queryParams?.demoSelectedTab ?? 0, ); } diff --git a/website/docs/foundations/tokens/index.js b/website/docs/foundations/tokens/index.js index 3fd55673657..67aa9bcbda8 100644 --- a/website/docs/foundations/tokens/index.js +++ b/website/docs/foundations/tokens/index.js @@ -5,7 +5,7 @@ import Component from '@glimmer/component'; import { restartableTask, timeout } from 'ember-concurrency'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; import TOKENS_RAW from '@hashicorp/design-system-tokens/dist/docs/products/tokens.json'; @@ -16,7 +16,7 @@ const getAliases = (token, TOKENS_RAW) => { const path = token.path.join('.'); return TOKENS_RAW.filter( // note: also the original value is prefixed with `$` - (item) => item.original.$value === `{${path}.value}` + (item) => item.original.$value === `{${path}.value}`, ).map((alias) => `{${alias.path.join('.')}}`); }; @@ -54,7 +54,7 @@ export default class Index extends Component { t.name.indexOf(this.searchQuery) !== -1 || // note: we prefix `value` with `$` because we're using the DTCG format // we also convert it to string, because in some cases it's a number - String(t.$value).indexOf(this.searchQuery) !== -1 + String(t.$value).indexOf(this.searchQuery) !== -1, ); if (filteredTokens.length > 0) { diff --git a/website/docs/icons/library/index.js b/website/docs/icons/library/index.js index 84ab50ba60e..8dd0c418df1 100644 --- a/website/docs/icons/library/index.js +++ b/website/docs/icons/library/index.js @@ -6,7 +6,7 @@ import Component from '@glimmer/component'; import { action } from '@ember/object'; import { restartableTask, timeout } from 'ember-concurrency'; -import { inject as service } from '@ember/service'; +import { service } from '@ember/service'; import { NAMES } from '@hashicorp/design-system-components/components/hds/icon/index'; import catalog from '@hashicorp/flight-icons/catalog.json'; @@ -73,12 +73,12 @@ export default class Index extends Component { filteredIcons = this.allIcons.filter( (i) => i.size === this.selectedIconSize && - i.searchable.indexOf(this.searchQuery.toLowerCase()) !== -1 + i.searchable.indexOf(this.searchQuery.toLowerCase()) !== -1, ); } } else { filteredIcons = this.allIcons.filter( - (i) => i.size === this.selectedIconSize + (i) => i.size === this.selectedIconSize, ); } @@ -130,7 +130,7 @@ export default class Index extends Component { }); this.eventTracking.trackEvent( - `Icon Library - Group by Selector - ${selectedGroupType}` + `Icon Library - Group by Selector - ${selectedGroupType}`, ); } @@ -147,7 +147,7 @@ export default class Index extends Component { }); this.eventTracking.trackEvent( - `Icon Library - Size Selector - ${selectedIconSize}` + `Icon Library - Size Selector - ${selectedIconSize}`, ); } From 16aa67f98ed1181ddf84461fa010514dd580010d Mon Sep 17 00:00:00 2001 From: Zack Moore Date: Wed, 24 Sep 2025 14:27:47 -0400 Subject: [PATCH 04/33] Remove deprecated `HdsMenuPrimitive` component (#3224) --- .changeset/legal-swans-occur.md | 5 + packages/components/package.json | 1 - packages/components/src/components.ts | 3 - .../src/components/hds/dropdown/index.ts | 9 +- .../components/hds/menu-primitive/index.hbs | 25 ---- .../components/hds/menu-primitive/index.ts | 109 --------------- .../@hashicorp/design-system-components.scss | 1 - .../src/styles/components/dropdown.scss | 2 +- .../src/styles/components/menu-primitive.scss | 13 -- packages/components/src/template-registry.ts | 5 - .../hds/menu-primitive/index-test.js | 124 ------------------ .../breadcrumb/partials/code/component-api.md | 2 +- .../utilities/disclosure-primitive/index.md | 1 - .../partials/code/how-to-use.md | 2 - .../docs/utilities/menu-primitive/index.md | 28 ---- .../partials/code/component-api.md | 31 ----- .../partials/code/how-to-use.md | 29 ---- .../version-history/version-history.md | 7 - .../docs/utilities/popover-primitive/index.md | 1 - .../utilities/menu-primitive.jpg | Bin 27593 -> 0 bytes .../utilities/menu-primitive-test.js | 25 ---- 21 files changed, 12 insertions(+), 411 deletions(-) create mode 100644 .changeset/legal-swans-occur.md delete mode 100644 packages/components/src/components/hds/menu-primitive/index.hbs delete mode 100644 packages/components/src/components/hds/menu-primitive/index.ts delete mode 100644 packages/components/src/styles/components/menu-primitive.scss delete mode 100644 showcase/tests/integration/components/hds/menu-primitive/index-test.js delete mode 100644 website/docs/utilities/menu-primitive/index.md delete mode 100644 website/docs/utilities/menu-primitive/partials/code/component-api.md delete mode 100644 website/docs/utilities/menu-primitive/partials/code/how-to-use.md delete mode 100644 website/docs/utilities/menu-primitive/partials/version-history/version-history.md delete mode 100644 website/public/assets/illustrations/utilities/menu-primitive.jpg delete mode 100644 website/tests/acceptance/utilities/menu-primitive-test.js diff --git a/.changeset/legal-swans-occur.md b/.changeset/legal-swans-occur.md new file mode 100644 index 00000000000..6b641130ada --- /dev/null +++ b/.changeset/legal-swans-occur.md @@ -0,0 +1,5 @@ +--- +"@hashicorp/design-system-components": major +--- + +Removed the deprecated `MenuPrimitive` component diff --git a/packages/components/package.json b/packages/components/package.json index caa55b250ec..38b0ece2667 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -305,7 +305,6 @@ "./components/hds/layout/grid/item.js": "./dist/_app_/components/hds/layout/grid/item.js", "./components/hds/link/inline.js": "./dist/_app_/components/hds/link/inline.js", "./components/hds/link/standalone.js": "./dist/_app_/components/hds/link/standalone.js", - "./components/hds/menu-primitive.js": "./dist/_app_/components/hds/menu-primitive.js", "./components/hds/modal/body.js": "./dist/_app_/components/hds/modal/body.js", "./components/hds/modal/footer.js": "./dist/_app_/components/hds/modal/footer.js", "./components/hds/modal/header.js": "./dist/_app_/components/hds/modal/header.js", diff --git a/packages/components/src/components.ts b/packages/components/src/components.ts index 400dc061324..3b6fcc9a9d0 100644 --- a/packages/components/src/components.ts +++ b/packages/components/src/components.ts @@ -390,8 +390,5 @@ export { default as HdsDismissButton } from './components/hds/dismiss-button/ind // Interactive export { default as HdsInteractive } from './components/hds/interactive/index.ts'; -// MenuPrimitive -export { default as HdsMenuPrimitive } from './components/hds/menu-primitive/index.ts'; - // PopoverPrimitive export { default as HdsPopoverPrimitive } from './components/hds/popover-primitive/index.ts'; diff --git a/packages/components/src/components/hds/dropdown/index.ts b/packages/components/src/components/hds/dropdown/index.ts index 12bccfcd4ce..2f652915604 100644 --- a/packages/components/src/components/hds/dropdown/index.ts +++ b/packages/components/src/components/hds/dropdown/index.ts @@ -15,7 +15,7 @@ import { } from './types.ts'; import type { ComponentLike } from '@glint/template'; -import type { MenuPrimitiveSignature } from '../menu-primitive'; +import type { HdsPopoverPrimitiveSignature } from '../popover-primitive/index.ts'; import type { HdsDropdownFooterSignature } from './footer'; import type { HdsDropdownHeaderSignature } from './header'; import type { HdsDropdownListItemCheckboxSignature } from './list-item/checkbox'; @@ -39,15 +39,16 @@ export const POSITIONS: HdsDropdownPositions[] = Object.values( ); export interface HdsDropdownSignature { - Args: MenuPrimitiveSignature['Args'] & { + Args: { height?: string; isInline?: boolean; - isOpen?: boolean; + isOpen?: HdsPopoverPrimitiveSignature['Args']['isOpen']; listPosition?: HdsDropdownPositions; width?: string; enableCollisionDetection?: HdsAnchoredPositionOptions['enableCollisionDetection']; preserveContentInDom?: boolean; matchToggleWidth?: boolean; + onClose?: HdsPopoverPrimitiveSignature['Args']['onClose']; }; Blocks: { default: [ @@ -69,7 +70,7 @@ export interface HdsDropdownSignature { }, ]; }; - Element: MenuPrimitiveSignature['Element']; + Element: HTMLDivElement; } export default class HdsDropdown extends Component { diff --git a/packages/components/src/components/hds/menu-primitive/index.hbs b/packages/components/src/components/hds/menu-primitive/index.hbs deleted file mode 100644 index 29a6c04850b..00000000000 --- a/packages/components/src/components/hds/menu-primitive/index.hbs +++ /dev/null @@ -1,25 +0,0 @@ -{{! - Copyright (c) HashiCorp, Inc. - SPDX-License-Identifier: MPL-2.0 -}} -{{! - THIS COMPONENT IS NOW DEPRECATED -}} -{{! template-lint-disable no-invalid-interactive }} -
-
- {{yield (hash onClickToggle=this.onClickToggle isOpen=this.isOpen) to="toggle"}} -
- {{#if this.isOpen}} -
- {{yield (hash close=this.close) to="content"}} -
- {{/if}} -
-{{! template-lint-enable no-invalid-interactive }} \ No newline at end of file diff --git a/packages/components/src/components/hds/menu-primitive/index.ts b/packages/components/src/components/hds/menu-primitive/index.ts deleted file mode 100644 index db655a604da..00000000000 --- a/packages/components/src/components/hds/menu-primitive/index.ts +++ /dev/null @@ -1,109 +0,0 @@ -/** - * Copyright (c) HashiCorp, Inc. - * SPDX-License-Identifier: MPL-2.0 - */ - -import Component from '@glimmer/component'; -import { deprecate } from '@ember/debug'; -import { tracked } from '@glimmer/tracking'; -import { action } from '@ember/object'; -import { schedule } from '@ember/runloop'; -import type Owner from '@ember/owner'; - -export interface MenuPrimitiveSignature { - Args: { - // eslint-disable-next-line @typescript-eslint/no-explicit-any - onClose?: (...args: any[]) => void; - }; - Blocks: { - toggle?: [ - { - // eslint-disable-next-line @typescript-eslint/no-explicit-any - onClickToggle: (event: MouseEvent, ...args: any[]) => void; - isOpen?: boolean; - }, - ]; - content?: [ - { - // eslint-disable-next-line @typescript-eslint/no-explicit-any - close: (...args: any[]) => void; - }, - ]; - }; - Element: HTMLDivElement; -} - -export default class MenuPrimitive extends Component { - @tracked isOpen: boolean | undefined; // notice: if in the future we need to add a "@isOpen" prop to control the status from outside (eg to have the MenuPrimitive opened on render) just add "this.args.isOpen" here to initalize the variable - @tracked toggleRef: HTMLElement | undefined; - @tracked _element!: HTMLElement; - - constructor(owner: Owner, args: MenuPrimitiveSignature['Args']) { - super(owner, args); - - deprecate( - 'The `Hds::MenuPrimitive` component is now deprecated and will be removed in the next major version of `@hashicorp/design-system-components`.', - false, - { - id: 'hds.components.menu-primitive', - until: '5.0.0', - url: 'https://helios.hashicorp.design/components/menu-primitive?tab=version%20history#460', - for: '@hashicorp/design-system-components', - since: { - enabled: '4.10.0', - available: '4.10.0', - }, - } - ); - } - - @action - didInsert(element: HTMLElement): void { - this._element = element; - } - - @action - onClickToggle(event: MouseEvent): void { - // we store a reference to the DOM node that has the "onClickToggle" event associated with it - if (!this.toggleRef) { - this.toggleRef = event.currentTarget as HTMLElement; - } - this.isOpen = !this.isOpen; - // we explicitly apply a focus state to the toggle element to overcome a bug in WebKit (see https://github.com/hashicorp/design-system/commit/40cd7f6b3cb15c45f9a1235fafd0fb3ed58e6e62) - this.toggleRef?.focus(); - } - - @action - onFocusOut(event: FocusEvent): void { - // due to inconsistent implementation of relatedTarget across browsers we use the activeElement as a fallback - // if the related target is not part of the disclosed content we close the disclosed container - if ( - !this._element.contains( - (event.relatedTarget as Node) || (document.activeElement as Node) - ) - ) { - this.close(); - } - } - - @action - onKeyUp(event: KeyboardEvent): void { - if (event.key === 'Escape') { - this.close(); - this.toggleRef?.focus(); - } - } - - @action - close(): void { - // we schedule this afterRender to avoid an error in tests caused by updating `isOpen` multiple times in the same computation - // eslint-disable-next-line ember/no-runloop - schedule('afterRender', (): void => { - this.isOpen = false; - // we call the "onClose" callback if it exists (and is a function) - if (this.args.onClose && typeof this.args.onClose === 'function') { - this.args.onClose(); - } - }); - } -} diff --git a/packages/components/src/styles/@hashicorp/design-system-components.scss b/packages/components/src/styles/@hashicorp/design-system-components.scss index 00c6008b820..c74eaa36f4b 100644 --- a/packages/components/src/styles/@hashicorp/design-system-components.scss +++ b/packages/components/src/styles/@hashicorp/design-system-components.scss @@ -39,7 +39,6 @@ @use "../components/icon-tile"; @use "../components/layout"; // multiple components @use "../components/link"; // multiple components -@use "../components/menu-primitive"; @use "../components/modal"; @use "../components/page-header"; @use "../components/pagination"; diff --git a/packages/components/src/styles/components/dropdown.scss b/packages/components/src/styles/components/dropdown.scss index 0c35374cd8b..014c6146f74 100644 --- a/packages/components/src/styles/components/dropdown.scss +++ b/packages/components/src/styles/components/dropdown.scss @@ -207,7 +207,7 @@ $hds-dropdown-toggle-border-radius: $hds-button-border-radius; // LIST // UL ELEMENT -// GOES INSIDE HDS::MenuPrimitive's :content block +// GOES INSIDE HDS::PopoverPrimitive's popover element .hds-dropdown__content { position: relative; diff --git a/packages/components/src/styles/components/menu-primitive.scss b/packages/components/src/styles/components/menu-primitive.scss deleted file mode 100644 index 0ed5a234395..00000000000 --- a/packages/components/src/styles/components/menu-primitive.scss +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) HashiCorp, Inc. - * SPDX-License-Identifier: MPL-2.0 - */ - -// -// MenuPrimitive COMPONENT -// - -.hds-menu-primitive { - position: relative; - width: fit-content; -} diff --git a/packages/components/src/template-registry.ts b/packages/components/src/template-registry.ts index 66183aa31c6..2af371f3514 100644 --- a/packages/components/src/template-registry.ts +++ b/packages/components/src/template-registry.ts @@ -168,7 +168,6 @@ import type HdsLayoutGridComponent from './components/hds/layout/grid'; import type HdsLayoutGridItemComponent from './components/hds/layout/grid/item'; import type HdsLinkInlineComponent from './components/hds/link/inline'; import type HdsLinkStandaloneComponent from './components/hds/link/standalone'; -import type HdsMenuPrimitiveComponent from './components/hds/menu-primitive'; import type HdsModalBodyComponent from './components/hds/modal/body'; import type HdsModalFooterComponent from './components/hds/modal/footer'; import type HdsModalHeaderComponent from './components/hds/modal/header'; @@ -806,10 +805,6 @@ export default interface HdsComponentsRegistry { 'Hds::Link::Standalone': typeof HdsLinkStandaloneComponent; 'hds/link/standalone': typeof HdsLinkStandaloneComponent; - // MenuPrimitive - 'Hds::MenuPrimitive': typeof HdsMenuPrimitiveComponent; - 'hds/menu-primitive': typeof HdsMenuPrimitiveComponent; - // Modal 'Hds::Modal': typeof HdsModalComponent; 'hds/modal': typeof HdsModalComponent; diff --git a/showcase/tests/integration/components/hds/menu-primitive/index-test.js b/showcase/tests/integration/components/hds/menu-primitive/index-test.js deleted file mode 100644 index d284b683bb4..00000000000 --- a/showcase/tests/integration/components/hds/menu-primitive/index-test.js +++ /dev/null @@ -1,124 +0,0 @@ -/** - * Copyright (c) HashiCorp, Inc. - * SPDX-License-Identifier: MPL-2.0 - */ - -import { module, test } from 'qunit'; -import { setupRenderingTest } from 'showcase/tests/helpers'; -import { - click, - triggerEvent, - triggerKeyEvent, - render, - resetOnerror, -} from '@ember/test-helpers'; -import { hbs } from 'ember-cli-htmlbars'; - -module('Integration | Component | hds/menu-primitive/index', function (hooks) { - setupRenderingTest(hooks); - - hooks.afterEach(() => { - resetOnerror(); - }); - - test('it should render the component with a CSS class that matches the component name', async function (assert) { - await render(hbs``); - assert.dom('div#test-menu-primitive').hasClass('hds-menu-primitive'); - }); - - // TOGGLE + CONTENT - - test('it should render the "toggle" block but not the "content', async function (assert) { - await render(hbs` - - <:toggle> - - - - `); - await click('button#test-toggle-button'); - assert.dom('.hds-menu-primitive__content').exists(); - assert.dom('button#test-content-button').exists(); - await click('button#test-content-button'); - assert.dom('.hds-menu-primitive__content').doesNotExist(); - assert.dom('button#test-content-button').doesNotExist(); - }); -}); diff --git a/website/docs/components/breadcrumb/partials/code/component-api.md b/website/docs/components/breadcrumb/partials/code/component-api.md index c8414ae4ad0..e7a55f262d3 100644 --- a/website/docs/components/breadcrumb/partials/code/component-api.md +++ b/website/docs/components/breadcrumb/partials/code/component-api.md @@ -53,7 +53,7 @@ The Breadcrumb component is composed of three different parts, each with their o Set on the truncation toggle button. Accepts a string. - Elements passed as children are yielded to the content of the [MenuPrimitive](/utilities/menu-primitive) component (used to show/hide the yielded Breadcrumb Items via a "toggle" button). + Elements passed as children are yielded to the content of the [PopoverPrimitive](/utilities/popover-primitive) component (used to show/hide the yielded Breadcrumb Items via a "toggle" button). This component supports use of [`...attributes`](https://guides.emberjs.com/release/in-depth-topics/patterns-for-components/#toc_attribute-ordering). diff --git a/website/docs/utilities/disclosure-primitive/index.md b/website/docs/utilities/disclosure-primitive/index.md index 12e84933c37..20d84d180a9 100644 --- a/website/docs/utilities/disclosure-primitive/index.md +++ b/website/docs/utilities/disclosure-primitive/index.md @@ -5,7 +5,6 @@ caption: An internal utility component that provides show/hide functionality. related: - components/accordion - components/reveal - - utilities/menu-primitive previewImage: assets/illustrations/utilities/disclosure-primitive.jpg navigation: keywords: diff --git a/website/docs/utilities/disclosure-primitive/partials/code/how-to-use.md b/website/docs/utilities/disclosure-primitive/partials/code/how-to-use.md index 1aa2eec1bc9..b4fe3882bdf 100644 --- a/website/docs/utilities/disclosure-primitive/partials/code/how-to-use.md +++ b/website/docs/utilities/disclosure-primitive/partials/code/how-to-use.md @@ -9,8 +9,6 @@ The `DisclosurePrimitive` component renders an interactive element that triggers When the content is disclosed, the container can be closed by toggling the button (`click` or `enter/return`). -The [MenuPrimitive](/utilities/menu-primitive), another variant of this primitive, includes extra functionality to close the content panel by either clicking outside of the content, or via the `esc` key. - ```handlebars <:toggle as |t|> diff --git a/website/docs/utilities/menu-primitive/index.md b/website/docs/utilities/menu-primitive/index.md deleted file mode 100644 index bea8e07e917..00000000000 --- a/website/docs/utilities/menu-primitive/index.md +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: MenuPrimitive -description: An internal utility component that provides show/hide functionality. -caption: An internal utility component that provides show/hide functionality. -related: - - components/breadcrumb - - components/dropdown - - utilities/disclosure-primitive -previewImage: assets/illustrations/utilities/menu-primitive.jpg -navigation: - keywords: - - show - - hide - - accordion - - dropdown - - reveal -status: - deprecated: 4.10.0 ---- - -
- @include "partials/code/how-to-use.md" - @include "partials/code/component-api.md" -
- -
- @include "partials/version-history/version-history.md" -
diff --git a/website/docs/utilities/menu-primitive/partials/code/component-api.md b/website/docs/utilities/menu-primitive/partials/code/component-api.md deleted file mode 100644 index 1c78fc5c4d5..00000000000 --- a/website/docs/utilities/menu-primitive/partials/code/component-api.md +++ /dev/null @@ -1,31 +0,0 @@ -## Component API - -### MenuPrimitive - - - - A named block that works as "toggle" for the MenuPrimitive. - - - A function to be called by the interactive element to toggle visibility of the content. - - - Hook into this tracked property to access the state of `isOpen`. - - - - - A named block for the content that is shown/hidden upon toggling. - - - A function to programmatically close the MenuPrimitive. - - - - - A callback function invoked when the MenuPrimitive is closed (if provided). - - - This component supports use of [`...attributes`](https://guides.emberjs.com/release/in-depth-topics/patterns-for-components/#toc_attribute-ordering). - - diff --git a/website/docs/utilities/menu-primitive/partials/code/how-to-use.md b/website/docs/utilities/menu-primitive/partials/code/how-to-use.md deleted file mode 100644 index c83c97af526..00000000000 --- a/website/docs/utilities/menu-primitive/partials/code/how-to-use.md +++ /dev/null @@ -1,29 +0,0 @@ -!!! Warning - -**Deprecation notice** - -The `MenuPrimitive` component is deprecated and will be removed in a future major release. It has been replaced internally with the [`PopoverPrimitive`](/utilities/popover-primitive). -!!! - -## How to use this component - -The `MenuPrimitive` component renders an interactive element that triggers a custom event handler provided by the `:toggle` block (passed via `hash` by Ember). To comply with accessibility best practices, this element is usually a button or a component that renders a button. - -When the content is disclosed, the container can be closed in various way; toggling via the button (`click` or `enter/return`), clicking outside of the content, or via the `esc` key. - -**Note:** [DisclosurePrimitive](/utilities/disclosure-primitive), another variant of this primitive, excludes the functionality to close the content panel by either clicking outside of the content, or via the `esc` key. - -```handlebars - - <:toggle as |t|> - - - <:content> - your content here - - -``` - -### Content positioning - -The `:content` block is **not** positioned in relation to the `:toggle` block. We recommend applying `position: absolute` to a wrapper around the content that is then passed to the `:content` block. diff --git a/website/docs/utilities/menu-primitive/partials/version-history/version-history.md b/website/docs/utilities/menu-primitive/partials/version-history/version-history.md deleted file mode 100644 index 08695b741ad..00000000000 --- a/website/docs/utilities/menu-primitive/partials/version-history/version-history.md +++ /dev/null @@ -1,7 +0,0 @@ -## 4.10.0 - -In this version we replaced all `MenuPrimitive` instances with `PopoverPrimitive`. For this reason we now consider the MenuPrimitive deprecated and we plan to removed in a future major release. - -### How to migrate - -Consider migrating the existing `MenuPrimitive` instances to [`PopoverPrimitive`](/utilities/popover-primitive). diff --git a/website/docs/utilities/popover-primitive/index.md b/website/docs/utilities/popover-primitive/index.md index 1b76ed364ae..223386226c1 100644 --- a/website/docs/utilities/popover-primitive/index.md +++ b/website/docs/utilities/popover-primitive/index.md @@ -11,7 +11,6 @@ links: https://github.com/hashicorp/design-system/tree/main/packages/components/src/components/hds/popover-primitive related: - utilities/disclosure-primitive - - utilities/menu-primitive previewImage: assets/illustrations/utilities/popover-primitive.jpg navigation: keywords: diff --git a/website/public/assets/illustrations/utilities/menu-primitive.jpg b/website/public/assets/illustrations/utilities/menu-primitive.jpg deleted file mode 100644 index b8e013452146c7dc6b5b2d5204ca6fdc6a41cb5c..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 27593 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

2FrT(`wauc~1j@)573 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%0AViLPs%{b)k12}qX*>xJYayl`>2t;S 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 KtM`=tPX9j+A50Gb diff --git a/website/tests/acceptance/utilities/menu-primitive-test.js b/website/tests/acceptance/utilities/menu-primitive-test.js deleted file mode 100644 index 5f049a46561..00000000000 --- a/website/tests/acceptance/utilities/menu-primitive-test.js +++ /dev/null @@ -1,25 +0,0 @@ -/** - * Copyright (c) HashiCorp, Inc. - * SPDX-License-Identifier: MPL-2.0 - */ - -import { module, test } from 'qunit'; -import { visit, currentURL } from '@ember/test-helpers'; -import { setupApplicationTest } from 'website/tests/helpers'; -import { a11yAudit } from 'ember-a11y-testing/test-support'; - -module('Acceptance | utilities/menu-primitive', function (hooks) { - setupApplicationTest(hooks); - - test('visiting /utilities/menu-primitive', async function (assert) { - await visit('/utilities/menu-primitive'); - - assert.strictEqual(currentURL(), '/utilities/menu-primitive'); - }); - - test('utilities/menu-primitive passes a11y automated checks', async function (assert) { - await visit('/utilities/menu-primitive'); - await a11yAudit(); - assert.ok(true, 'a11y automation audit passed'); - }); -}); From 3af1a65089468d93821a68753e79761990b2142e Mon Sep 17 00:00:00 2001 From: Zack Moore Date: Tue, 30 Sep 2025 21:38:25 -0400 Subject: [PATCH 05/33] Remove unneeded sass-related dependencies (#3206) --- .changeset/full-showers-kiss.md | 5 +++++ packages/components/package.json | 7 +++---- pnpm-lock.yaml | 13 +++---------- 3 files changed, 11 insertions(+), 14 deletions(-) create mode 100644 .changeset/full-showers-kiss.md diff --git a/.changeset/full-showers-kiss.md b/.changeset/full-showers-kiss.md new file mode 100644 index 00000000000..d5426a68e97 --- /dev/null +++ b/.changeset/full-showers-kiss.md @@ -0,0 +1,5 @@ +--- +"@hashicorp/design-system-components": major +--- + +- Removed `sass` and `ember-cli-sass` dependencies. Consumers using `sass` in their projects should make sure it's added as a direct dependency to their project. diff --git a/packages/components/package.json b/packages/components/package.json index 38b0ece2667..6585d1c3263 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -59,7 +59,6 @@ "codemirror-lang-hcl": "^0.0.0-beta.2", "decorator-transforms": "^2.3.0", "ember-a11y-refocus": "^4.1.4", - "ember-cli-sass": "^11.0.1", "ember-concurrency": "^4.0.4", "ember-element-helper": "^0.8.6", "ember-focus-trap": "^1.1.1", @@ -71,10 +70,9 @@ "ember-truth-helpers": "^4.0.3", "luxon": "^3.4.2", "prismjs": "^1.30.0", - "sass": "^1.83.0", - "tracked-built-ins": "^4.0.0", "tabbable": "^6.2.0", - "tippy.js": "^6.3.7" + "tippy.js": "^6.3.7", + "tracked-built-ins": "^4.0.0" }, "devDependencies": { "@babel/core": "^7.27.1", @@ -113,6 +111,7 @@ "rollup": "^4.39.0", "rollup-plugin-copy": "^3.5.0", "rollup-plugin-scss": "^4.0.1", + "sass": "^1.89.2", "stylelint": "^16.17.0", "stylelint-config-rational-order": "^0.1.2", "stylelint-config-standard-scss": "^14.0.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 5fdc76dbdb8..7fb0d6e23a8 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -141,9 +141,6 @@ importers: ember-a11y-refocus: specifier: ^4.1.4 version: 4.1.4 - ember-cli-sass: - specifier: ^11.0.1 - version: 11.0.1 ember-concurrency: specifier: ^4.0.4 version: 4.0.4(@babel/core@7.28.0)(@glint/template@1.5.2) @@ -177,9 +174,6 @@ importers: prismjs: specifier: ^1.30.0 version: 1.30.0 - sass: - specifier: ^1.83.0 - version: 1.89.2 tabbable: specifier: ^6.2.0 version: 6.2.0 @@ -298,6 +292,9 @@ importers: rollup-plugin-scss: specifier: ^4.0.1 version: 4.0.1 + sass: + specifier: ^1.89.2 + version: 1.89.2 stylelint: specifier: ^16.17.0 version: 16.23.0(typescript@5.9.2) @@ -14205,7 +14202,6 @@ snapshots: codemirror-lang-hcl: 0.0.0-beta.2 decorator-transforms: 2.3.0(@babel/core@7.28.0) ember-a11y-refocus: 4.1.4 - ember-cli-sass: 11.0.1 ember-concurrency: 4.0.4(@babel/core@7.28.0)(@glint/template@1.5.2) ember-element-helper: 0.8.8 ember-focus-trap: 1.1.1(ember-source@6.5.0(@glimmer/component@1.1.2(@babel/core@7.28.0))(rsvp@4.8.5)) @@ -14217,7 +14213,6 @@ snapshots: ember-truth-helpers: 4.0.3(ember-source@6.5.0(@glimmer/component@1.1.2(@babel/core@7.28.0))(rsvp@4.8.5)) luxon: 3.7.1 prismjs: 1.30.0 - sass: 1.89.2 tabbable: 6.2.0 tippy.js: 6.3.7 tracked-built-ins: 4.0.0(@babel/core@7.28.0) @@ -14263,7 +14258,6 @@ snapshots: codemirror-lang-hcl: 0.0.0-beta.2 decorator-transforms: 2.3.0(@babel/core@7.28.0) ember-a11y-refocus: 4.1.4 - ember-cli-sass: 11.0.1 ember-concurrency: 4.0.4(@babel/core@7.28.0)(@glint/template@1.5.2) ember-element-helper: 0.8.8 ember-focus-trap: 1.1.1(ember-source@6.4.0(@glimmer/component@1.1.2(@babel/core@7.28.0))(rsvp@4.8.5)) @@ -14275,7 +14269,6 @@ snapshots: ember-truth-helpers: 4.0.3(ember-source@6.4.0(@glimmer/component@1.1.2(@babel/core@7.28.0))(rsvp@4.8.5)) luxon: 3.7.1 prismjs: 1.30.0 - sass: 1.89.2 tabbable: 6.2.0 tippy.js: 6.3.7 tracked-built-ins: 4.0.0(@babel/core@7.28.0) From 95ec1adc45838ae75830fd89e2a3ad8b6a35424e Mon Sep 17 00:00:00 2001 From: Zack Moore Date: Tue, 30 Sep 2025 21:52:06 -0400 Subject: [PATCH 06/33] `HdsDropdownListItemInteractive` - Remove deprecated `@text` argument (#3212) --- .changeset/cold-worlds-notice.md | 11 +++++ .../hds/dropdown/list-item/interactive.hbs | 12 +---- .../hds/dropdown/list-item/interactive.ts | 42 +---------------- .../components/mock/app/header/app-header.gts | 4 +- .../list-items/not-interactive.gts | 16 +++---- .../dropdown/list-item/interactive-test.js | 46 ++++--------------- .../dropdown/partials/code/component-api.md | 3 -- 7 files changed, 35 insertions(+), 99 deletions(-) create mode 100644 .changeset/cold-worlds-notice.md diff --git a/.changeset/cold-worlds-notice.md b/.changeset/cold-worlds-notice.md new file mode 100644 index 00000000000..26319a386e3 --- /dev/null +++ b/.changeset/cold-worlds-notice.md @@ -0,0 +1,11 @@ +--- +"@hashicorp/design-system-components": major +--- + + + +`Dropdown` - Removed the deprecated `@text` argument from the `HdsDropdownListItemInteractive` component. + +To migrate run the codemod `v4/dropdown-list-item-interactive` (see [readme file](https://github.com/hashicorp/design-system/tree/main/packages/codemods/transforms/v4/dropdown-list-item-interactive)) + + diff --git a/packages/components/src/components/hds/dropdown/list-item/interactive.hbs b/packages/components/src/components/hds/dropdown/list-item/interactive.hbs index 53fc34e1b9f..f62914dc95f 100644 --- a/packages/components/src/components/hds/dropdown/list-item/interactive.hbs +++ b/packages/components/src/components/hds/dropdown/list-item/interactive.hbs @@ -9,11 +9,7 @@ - {{#if (has-block)}} - {{yield (hash Badge=(component "hds/badge" size="small"))}} - {{else}} - {{this.text}} - {{/if}} + {{yield (hash Badge=(component "hds/badge" size="small"))}} {{else}} @@ -34,11 +30,7 @@ {{/if}} - {{#if (has-block)}} - {{yield (hash Badge=(component "hds/badge" size="small"))}} - {{else}} - {{this.text}} - {{/if}} + {{yield (hash Badge=(component "hds/badge" size="small"))}} {{#if @trailingIcon}} diff --git a/packages/components/src/components/hds/dropdown/list-item/interactive.ts b/packages/components/src/components/hds/dropdown/list-item/interactive.ts index 323942938b0..722866f4bc0 100644 --- a/packages/components/src/components/hds/dropdown/list-item/interactive.ts +++ b/packages/components/src/components/hds/dropdown/list-item/interactive.ts @@ -4,7 +4,7 @@ */ import Component from '@glimmer/component'; -import { assert, deprecate } from '@ember/debug'; +import { assert } from '@ember/debug'; import { HdsDropdownListItemInteractiveColorValues } from './types.ts'; @@ -13,7 +13,6 @@ import type { HdsInteractiveSignature } from '../../interactive'; import type { HdsDropdownListItemInteractiveColors } from './types.ts'; import type { ComponentLike } from '@glint/template'; import type { HdsBadgeSignature } from '../../badge/index.ts'; -import type Owner from '@ember/owner'; export const DEFAULT_COLOR = HdsDropdownListItemInteractiveColorValues.Action; export const COLORS: HdsDropdownListItemInteractiveColors[] = Object.values( @@ -25,10 +24,6 @@ export interface HdsDropdownListItemInteractiveSignature { color?: HdsDropdownListItemInteractiveColors; icon?: HdsIconSignature['Args']['name']; isLoading?: boolean; - /** - * @deprecated The `@text` argument for "Hds::Dropdown::ListItem::Interactive" has been deprecated. Please put text in the yielded block. See: https://helios.hashicorp.design/components/dropdown?tab=version%20history#4100 - */ - text?: string; trailingIcon?: HdsIconSignature['Args']['name']; }; Blocks: { @@ -42,41 +37,6 @@ export interface HdsDropdownListItemInteractiveSignature { } export default class HdsDropdownListItemInteractive extends Component { - constructor( - owner: Owner, - args: HdsDropdownListItemInteractiveSignature['Args'] - ) { - super(owner, args); - - if (args.text !== undefined) { - deprecate( - 'The `@text` argument for "Hds::Dropdown::ListItem::Interactive" has been deprecated. Please put text in the yielded block.', - false, - { - id: 'hds.dropdown.list-item.interactive', - until: '5.0.0', - url: 'https://helios.hashicorp.design/components/dropdown?tab=version%20history#4100', - for: '@hashicorp/design-system-components', - since: { - available: '4.10.0', - enabled: '5.0.0', - }, - } - ); - } - } - - get text(): string { - const { text } = this.args; - - assert( - '@text for "Hds::Dropdown::ListItem::Interactive" must have a valid value', - text !== undefined - ); - - return text; - } - get color(): HdsDropdownListItemInteractiveColors { const { color = DEFAULT_COLOR } = this.args; diff --git a/showcase/app/components/mock/app/header/app-header.gts b/showcase/app/components/mock/app/header/app-header.gts index 8f9d9f66ad4..226e101691b 100644 --- a/showcase/app/components/mock/app/header/app-header.gts +++ b/showcase/app/components/mock/app/header/app-header.gts @@ -96,7 +96,9 @@ export default class MockAppHeaderAppHeader extends Component - + + Account Settings + diff --git a/showcase/app/components/page-components/dropdown/sub-sections/list-items/not-interactive.gts b/showcase/app/components/page-components/dropdown/sub-sections/list-items/not-interactive.gts index 9c1734f77e5..a2414a80a74 100644 --- a/showcase/app/components/page-components/dropdown/sub-sections/list-items/not-interactive.gts +++ b/showcase/app/components/page-components/dropdown/sub-sections/list-items/not-interactive.gts @@ -43,10 +43,10 @@ const SubSectionListItemNotInteractive: TemplateOnlyComponent =