From 43131190b854786bc356a8b32872979d7d654ae6 Mon Sep 17 00:00:00 2001 From: Zack Moore Date: Fri, 19 Sep 2025 14:50:10 -0400 Subject: [PATCH 1/7] removed deprecated arg --- .../hds/dropdown/list-item/interactive.hbs | 12 +----- .../hds/dropdown/list-item/interactive.ts | 42 +------------------ 2 files changed, 3 insertions(+), 51 deletions(-) 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; From 4ca8030a0725d18f0fde1549f13cc7b4d707d0b8 Mon Sep 17 00:00:00 2001 From: Zack Moore Date: Fri, 19 Sep 2025 15:01:03 -0400 Subject: [PATCH 2/7] added changeset --- .changeset/cold-worlds-notice.md | 9 +++++++++ 1 file changed, 9 insertions(+) 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..085a91902e9 --- /dev/null +++ b/.changeset/cold-worlds-notice.md @@ -0,0 +1,9 @@ +--- +"@hashicorp/design-system-components": major +--- + + + +`Dropdown` - Removed the deprecated `@text` argument from the `HdsDropdownListItemInteractive` component. + + From cd30c9f078ad9280b274e53e4760542a0e6179c2 Mon Sep 17 00:00:00 2001 From: Zack Moore Date: Fri, 19 Sep 2025 16:33:35 -0400 Subject: [PATCH 3/7] fixing usage in the showcase --- showcase/app/components/mock/app/header/app-header.gts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) 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 + From c0dfc43b92a07bb553c1767df7f7eca62aaa9106 Mon Sep 17 00:00:00 2001 From: Zack Moore Date: Wed, 24 Sep 2025 15:32:41 -0400 Subject: [PATCH 4/7] updating integration tests --- .../dropdown/list-item/interactive-test.js | 46 ++++--------------- .../dropdown/partials/code/component-api.md | 3 -- 2 files changed, 10 insertions(+), 39 deletions(-) diff --git a/showcase/tests/integration/components/hds/dropdown/list-item/interactive-test.js b/showcase/tests/integration/components/hds/dropdown/list-item/interactive-test.js index 0a3873660f4..97ae809fa0c 100644 --- a/showcase/tests/integration/components/hds/dropdown/list-item/interactive-test.js +++ b/showcase/tests/integration/components/hds/dropdown/list-item/interactive-test.js @@ -23,7 +23,7 @@ module( test('it should render the component as a
  • element with a CSS class that matches the component name', async function (assert) { await render( - hbs``, + hbs`interactive`, ); assert.dom('.hds-dropdown-list-item').hasTagName('li'); assert @@ -35,19 +35,19 @@ module( test('it should render the "list-item" with a button by default"', async function (assert) { await render( - hbs``, + hbs`interactive`, ); assert.dom('.hds-dropdown-list-item > button').exists(); }); test('it should render the "list-item" with a link if it has a @route parameter"', async function (assert) { await render( - hbs``, + hbs`interactive`, ); assert.dom('.hds-dropdown-list-item > a').exists(); }); test('it should render the "list-item" with a link if it has a @href argument"', async function (assert) { await render( - hbs``, + hbs`interactive`, ); assert.dom('.hds-dropdown-list-item > a').exists(); }); @@ -56,7 +56,7 @@ module( test('it should render the "action" color as the default if no color is declared"', async function (assert) { await render( - hbs``, + hbs`interactive`, ); assert .dom('.hds-dropdown-list-item') @@ -64,7 +64,7 @@ module( }); test('it should render the correct CSS color class if the @color prop is declared', async function (assert) { await render( - hbs``, + hbs`interactive`, ); assert .dom('.hds-dropdown-list-item') @@ -75,19 +75,19 @@ module( test('if an `@icon` is declared a leading icon should be rendered', async function (assert) { await render( - hbs``, + hbs`interactive`, ); assert.dom('.hds-icon.hds-icon-clipboard-copy').exists(); }); test('if an `@trailingIcon` is declared a trailing icon should be rendered', async function (assert) { await render( - hbs``, + hbs`interactive`, ); assert.dom('.hds-icon.hds-icon-external-link').exists(); }); test('if both an `@icon` and an `@trailingIcon` are declared both the leading and trailing icons should be rendered', async function (assert) { await render( - hbs``, + hbs`interactive`, ); assert.dom('.hds-icon.hds-icon-clipboard-copy').exists(); assert.dom('.hds-icon.hds-icon-external-link').exists(); @@ -95,12 +95,6 @@ module( // CONTENT - test('it should render the text passed as @text prop', async function (assert) { - await render( - hbs``, - ); - assert.dom('.hds-dropdown-list-item').hasText('interactive text'); - }); test('it should render the yielded content', async function (assert) { await render(hbs` @@ -109,29 +103,9 @@ module( `); assert.dom('.hds-dropdown-list-item').hasText('interactive'); }); - test('it should render the text passed as @text prop if content is yielded', async function (assert) { - await render(hbs` - - interactive - - `); - assert.dom('.hds-dropdown-list-item').doesNotContainText('erroneous'); - }); // ASSERTIONS - test('it should throw an assertion if @text is missing/has no value and the component does not yield content', async function (assert) { - const errorMessage = - '@text for "Hds::Dropdown::ListItem::Interactive" must have a valid value'; - assert.expect(2); - setupOnerror(function (error) { - assert.strictEqual(error.message, `Assertion Failed: ${errorMessage}`); - }); - await render(hbs``); - assert.throws(function () { - throw new Error(errorMessage); - }); - }); test('it should throw an assertion if an incorrect value for @color is provided', async function (assert) { const errorMessage = '@color for "Hds::Dropdown::ListItem::Interactive" must be one of the following: action, critical; received: foo'; @@ -140,7 +114,7 @@ module( assert.strictEqual(error.message, `Assertion Failed: ${errorMessage}`); }); await render( - hbs``, + hbs`interactive text`, ); assert.throws(function () { throw new Error(errorMessage); diff --git a/website/docs/components/dropdown/partials/code/component-api.md b/website/docs/components/dropdown/partials/code/component-api.md index 4eb658a8d10..79eb1a3e1d4 100644 --- a/website/docs/components/dropdown/partials/code/component-api.md +++ b/website/docs/components/dropdown/partials/code/component-api.md @@ -209,9 +209,6 @@ It internally uses the [`Hds::Interactive`](/utilities/interactive) utility comp The `Badge` component, yielded as contextual component inside `interactive` blocks of the `Dropdown`. It exposes the same API as the [`Badge` component](/components/badge). - - Text to be used in the item. If no text value is defined and no content is yielded, an error will be thrown. - Color applied to the text and (optional) icons. From 80489cfbbbea1bf581d509cc2f9b0b59728e3148 Mon Sep 17 00:00:00 2001 From: Zack Moore Date: Tue, 30 Sep 2025 17:33:28 -0400 Subject: [PATCH 5/7] added link to codemod to changeset --- .changeset/cold-worlds-notice.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.changeset/cold-worlds-notice.md b/.changeset/cold-worlds-notice.md index 085a91902e9..26319a386e3 100644 --- a/.changeset/cold-worlds-notice.md +++ b/.changeset/cold-worlds-notice.md @@ -6,4 +6,6 @@ `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)) + From 735fc522070649f0a940a6f7ebd39717e4acb06c Mon Sep 17 00:00:00 2001 From: Zack Moore Date: Tue, 30 Sep 2025 17:38:00 -0400 Subject: [PATCH 6/7] fixed ts errors --- .../list-items/not-interactive.gts | 18 +++++++----------- 1 file changed, 7 insertions(+), 11 deletions(-) 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..24ea2ab55f0 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 @@ -27,9 +27,7 @@ const SubSectionListItemNotInteractive: TemplateOnlyComponent =