From bb2633f20d52da41e720016b6fae97d4d28451ae Mon Sep 17 00:00:00 2001 From: Philipp Schneider Date: Fri, 17 Oct 2025 16:19:52 +0200 Subject: [PATCH 1/7] First version of not-started-yet icon --- pages/steps/permutations-utils.tsx | 6 ++++++ src/icon-provider/interfaces.ts | 1 + src/icon/icons/status-not-started.svg | 3 +++ src/icon/interfaces.ts | 1 + src/status-indicator/interfaces.ts | 11 ++++++++++- src/status-indicator/internal.tsx | 1 + src/status-indicator/styles.scss | 1 + 7 files changed, 23 insertions(+), 1 deletion(-) create mode 100644 src/icon/icons/status-not-started.svg diff --git a/pages/steps/permutations-utils.tsx b/pages/steps/permutations-utils.tsx index 10bf0235cc..8a0b84e6ef 100644 --- a/pages/steps/permutations-utils.tsx +++ b/pages/steps/permutations-utils.tsx @@ -295,6 +295,12 @@ const allStatusesSteps: ReadonlyArray = [ header: 'loading step', details: 'Test description', }, + { + status: 'not-started-yet', + statusIconAriaLabel: 'not started yet', + header: 'not started yet step', + details: 'Test description', + }, ]; const emptySteps: ReadonlyArray = []; diff --git a/src/icon-provider/interfaces.ts b/src/icon-provider/interfaces.ts index b2c91e995f..833c97ea1b 100644 --- a/src/icon-provider/interfaces.ts +++ b/src/icon-provider/interfaces.ts @@ -126,6 +126,7 @@ export namespace IconProviderProps { 'status-in-progress'?: ReactNode | null; 'status-info'?: ReactNode | null; 'status-negative'?: ReactNode | null; + 'status-not-started'?: ReactNode | null; 'status-pending'?: ReactNode | null; 'status-positive'?: ReactNode | null; 'status-stopped'?: ReactNode | null; diff --git a/src/icon/icons/status-not-started.svg b/src/icon/icons/status-not-started.svg new file mode 100644 index 0000000000..04035be453 --- /dev/null +++ b/src/icon/icons/status-not-started.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/icon/interfaces.ts b/src/icon/interfaces.ts index 7f511ccdd1..4277af0f71 100644 --- a/src/icon/interfaces.ts +++ b/src/icon/interfaces.ts @@ -188,6 +188,7 @@ export namespace IconProps { | 'status-in-progress' | 'status-info' | 'status-negative' + | 'status-not-started' | 'status-pending' | 'status-positive' | 'status-stopped' diff --git a/src/status-indicator/interfaces.ts b/src/status-indicator/interfaces.ts index 9237b04ae4..63b69b81af 100644 --- a/src/status-indicator/interfaces.ts +++ b/src/status-indicator/interfaces.ts @@ -45,6 +45,15 @@ export interface StatusIndicatorProps extends BaseComponentProps { export namespace StatusIndicatorProps { // Why not enums? Explained there // https://stackoverflow.com/questions/52393730/typescript-string-literal-union-type-from-enum - export type Type = 'error' | 'warning' | 'success' | 'info' | 'stopped' | 'pending' | 'in-progress' | 'loading'; + export type Type = + | 'error' + | 'warning' + | 'success' + | 'info' + | 'stopped' + | 'pending' + | 'in-progress' + | 'loading' + | 'not-started-yet'; export type Color = 'blue' | 'grey' | 'green' | 'red' | 'yellow'; } diff --git a/src/status-indicator/internal.tsx b/src/status-indicator/internal.tsx index 9882b52ee6..2c421c3c9a 100644 --- a/src/status-indicator/internal.tsx +++ b/src/status-indicator/internal.tsx @@ -45,6 +45,7 @@ const typeToIcon: (size: IconProps.Size) => Record, 'in-progress': , loading: , + 'not-started-yet': , }); interface InternalStatusIconProps extends Pick { diff --git a/src/status-indicator/styles.scss b/src/status-indicator/styles.scss index 7f11ac115d..a7e37d71d4 100644 --- a/src/status-indicator/styles.scss +++ b/src/status-indicator/styles.scss @@ -18,6 +18,7 @@ $_status-colors: ( 'pending': awsui.$color-text-status-inactive, 'in-progress': awsui.$color-text-status-inactive, 'loading': awsui.$color-text-status-inactive, + 'not-started-yet': awsui.$color-text-status-inactive, ); $_color-overrides: ( From 8f0b0b9d446b28ffccaa90ce1c1d501017dd3e45 Mon Sep 17 00:00:00 2001 From: Philipp Schneider Date: Tue, 28 Oct 2025 15:31:03 +0100 Subject: [PATCH 2/7] change name of not started yet to not started --- src/status-indicator/interfaces.ts | 2 +- src/status-indicator/internal.tsx | 2 +- src/status-indicator/styles.scss | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/status-indicator/interfaces.ts b/src/status-indicator/interfaces.ts index 63b69b81af..4f1fad4707 100644 --- a/src/status-indicator/interfaces.ts +++ b/src/status-indicator/interfaces.ts @@ -54,6 +54,6 @@ export namespace StatusIndicatorProps { | 'pending' | 'in-progress' | 'loading' - | 'not-started-yet'; + | 'not-started'; export type Color = 'blue' | 'grey' | 'green' | 'red' | 'yellow'; } diff --git a/src/status-indicator/internal.tsx b/src/status-indicator/internal.tsx index 2c421c3c9a..d7835b2ff4 100644 --- a/src/status-indicator/internal.tsx +++ b/src/status-indicator/internal.tsx @@ -45,7 +45,7 @@ const typeToIcon: (size: IconProps.Size) => Record, 'in-progress': , loading: , - 'not-started-yet': , + 'not-started': , }); interface InternalStatusIconProps extends Pick { diff --git a/src/status-indicator/styles.scss b/src/status-indicator/styles.scss index a7e37d71d4..644d9ea84f 100644 --- a/src/status-indicator/styles.scss +++ b/src/status-indicator/styles.scss @@ -18,7 +18,7 @@ $_status-colors: ( 'pending': awsui.$color-text-status-inactive, 'in-progress': awsui.$color-text-status-inactive, 'loading': awsui.$color-text-status-inactive, - 'not-started-yet': awsui.$color-text-status-inactive, + 'not-started': awsui.$color-text-status-inactive, ); $_color-overrides: ( From cf8c3e3c37411f37b5285d1213604c7a8f58ef9d Mon Sep 17 00:00:00 2001 From: Philipp Schneider Date: Tue, 4 Nov 2025 17:34:37 +0100 Subject: [PATCH 3/7] fix: renamed the status --- pages/steps/permutations-utils.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/pages/steps/permutations-utils.tsx b/pages/steps/permutations-utils.tsx index 8a0b84e6ef..85057f53bc 100644 --- a/pages/steps/permutations-utils.tsx +++ b/pages/steps/permutations-utils.tsx @@ -296,9 +296,9 @@ const allStatusesSteps: ReadonlyArray = [ details: 'Test description', }, { - status: 'not-started-yet', - statusIconAriaLabel: 'not started yet', - header: 'not started yet step', + status: 'not-started', + statusIconAriaLabel: 'not started', + header: 'not started step', details: 'Test description', }, ]; From fee91e306617f72099b6b51c2480fcca18e8e474 Mon Sep 17 00:00:00 2001 From: Philipp Schneider Date: Wed, 5 Nov 2025 14:00:10 +0100 Subject: [PATCH 4/7] add: new status indicator icon add to pages --- pages/status-indicator/permutations.page.tsx | 2 +- pages/status-indicator/simple.page.tsx | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/pages/status-indicator/permutations.page.tsx b/pages/status-indicator/permutations.page.tsx index f62090a970..6c86feee2f 100644 --- a/pages/status-indicator/permutations.page.tsx +++ b/pages/status-indicator/permutations.page.tsx @@ -10,7 +10,7 @@ import ScreenshotArea from '../utils/screenshot-area'; const permutations = createPermutations([ { - type: ['error', 'warning', 'success', 'info', 'stopped', 'pending', 'in-progress', 'loading'], + type: ['error', 'warning', 'success', 'info', 'stopped', 'pending', 'in-progress', 'loading', 'not-started'], }, { type: ['pending'], diff --git a/pages/status-indicator/simple.page.tsx b/pages/status-indicator/simple.page.tsx index 418ff1ba78..329301b3d8 100644 --- a/pages/status-indicator/simple.page.tsx +++ b/pages/status-indicator/simple.page.tsx @@ -13,6 +13,7 @@ const statusToText: [StatusIndicatorProps.Type, string][] = [ ['pending', 'Pending'], ['in-progress', 'In progress'], ['loading', 'Loading'], + ['not-started', 'Not started'], ]; export default function StatusIndicatorScenario() { From 5944cb0be99392f965d576b8e67da8e7cdb44ca7 Mon Sep 17 00:00:00 2001 From: Philipp Schneider Date: Thu, 13 Nov 2025 11:28:14 +0100 Subject: [PATCH 5/7] add: update snapshot tests following the SOP --- .../__snapshots__/design-tokens.test.ts.snap | 128 +- .../__snapshots__/documenter.test.ts.snap | 1750 ++++------------- .../test-utils-selectors.test.tsx.snap | 1 - 3 files changed, 461 insertions(+), 1418 deletions(-) diff --git a/src/__tests__/snapshot-tests/__snapshots__/design-tokens.test.ts.snap b/src/__tests__/snapshot-tests/__snapshots__/design-tokens.test.ts.snap index 1f8f0d3c0b..9640ed354a 100644 --- a/src/__tests__/snapshot-tests/__snapshots__/design-tokens.test.ts.snap +++ b/src/__tests__/snapshot-tests/__snapshots__/design-tokens.test.ts.snap @@ -641,28 +641,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#ffffff", "light": "#16191f", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#879596", "light": "#687078", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#414750", "light": "#d5dbdb", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#ffffff", "light": "#16191f", @@ -3287,28 +3287,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#ffffff", "light": "#16191f", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#879596", "light": "#687078", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#414750", "light": "#d5dbdb", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#ffffff", "light": "#16191f", @@ -5933,28 +5933,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#ffffff", "light": "#16191f", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#879596", "light": "#687078", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#414750", "light": "#d5dbdb", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#ffffff", "light": "#16191f", @@ -8579,28 +8579,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#ffffff", "light": "#16191f", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#879596", "light": "#687078", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#414750", "light": "#d5dbdb", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#ffffff", "light": "#16191f", @@ -11225,28 +11225,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#ffffff", "light": "#16191f", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#879596", "light": "#687078", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#414750", "light": "#d5dbdb", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#ffffff", "light": "#16191f", @@ -13871,28 +13871,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#ffffff", "light": "#ffffff", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#879596", "light": "#879596", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#414750", "light": "#414750", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#ffffff", "light": "#ffffff", @@ -16517,28 +16517,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#ffffff", "light": "#16191f", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#879596", "light": "#687078", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#414750", "light": "#d5dbdb", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#ffffff", "light": "#16191f", @@ -19168,28 +19168,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#dedee3", "light": "#424650", @@ -21814,28 +21814,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#dedee3", "light": "#dedee3", @@ -24460,28 +24460,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#dedee3", "light": "#424650", @@ -27106,28 +27106,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#dedee3", "light": "#424650", @@ -29752,28 +29752,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#dedee3", "light": "#424650", @@ -32398,28 +32398,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#dedee3", "light": "#424650", @@ -35044,28 +35044,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#dedee3", "light": "#dedee3", @@ -37690,28 +37690,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#dedee3", "light": "#dedee3", @@ -40336,28 +40336,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of the active segment in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-default": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-disabled": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of disabled segments in a segmented control.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-hover": { - "$description": "Deprecated - this token is no longer in use.", + "$description": "The border color of inactive segments in a segmented control on hover.", "$value": { "dark": "#dedee3", "light": "#424650", diff --git a/src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap b/src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap index fb6bd7c226..db13f8c4cb 100644 --- a/src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap +++ b/src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap @@ -1050,10 +1050,10 @@ to control the state by listening to \`toolsChange\` and providing \`toolsOpen\` "name": "FlowType", "type": "union", "values": [ - "home", "create", "edit", "delete", + "home", "dashboard", "view-resource", ], @@ -1603,10 +1603,10 @@ to control the state by listening to \`toolsChange\` and providing \`toolsOpen\` "name": "FlowType", "type": "union", "values": [ - "home", "create", "edit", "delete", + "home", "dashboard", "view-resource", ], @@ -2363,8 +2363,8 @@ When controlling this directly, make sure to update the value based on filtering "name": "ScaleType", "type": "union", "values": [ - "time", "linear", + "time", "log", "categorical", ], @@ -2579,7 +2579,6 @@ The function receives the following properties: If more than 6 attributes are specified, a \`gridLayout\` must be provided. * \`label\` (ReactNode) - Text label for the form field. -* \`description\` (ReactNode) - Additional description for the form field. * \`info\` (ReactNode) - Info link for the form field. * \`errorText\` ((item, itemIndex) => ReactNode) - Error message text to display as a control validation message. It renders the form field as invalid if the returned value is not \`null\` or \`undefined\`. @@ -2614,15 +2613,8 @@ A \`gridLayout\` is an array of breakpoint definitions. Each definition consists "optional": true, "type": "ReadonlyArray", }, - { - "description": "Determines whether the add button is hidden", - "name": "hideAddButton", - "optional": true, - "type": "boolean", - }, { "description": "An object containing all the necessary localized strings required by the component.", - "i18nTag": true, "inlineType": { "name": "AttributeEditorProps.I18nStrings", "properties": [ @@ -2727,11 +2719,6 @@ The display of a row is handled by the \`definition\` property.", }, ], "regions": [ - { - "description": "Specifies additional actions displayed next to the add-button (or instead of the add-button if hidden).", - "isDefault": false, - "name": "additionalActions", - }, { "description": "Displayed below the add button. Use it for additional information related to the attribute editor.", "isDefault": false, @@ -2973,7 +2960,6 @@ Instead, use \`onSelect\` in combination with the \`onChange\` handler only as a "file", "pause", "play", - "microphone", "remove", "copy", "menu", @@ -2988,8 +2974,8 @@ Instead, use \`onSelect\` in combination with the \`onChange\` handler only as a "ellipsis", "zoom-in", "zoom-out", - "security", "download", + "security", "edit", "add-plus", "anchor-link", @@ -3049,6 +3035,7 @@ Instead, use \`onSelect\` in combination with the \`onChange\` handler only as a "list-view", "location-pin", "lock-private", + "microphone", "microphone-off", "mini-player", "multiscreen", @@ -3066,10 +3053,10 @@ Instead, use \`onSelect\` in combination with the \`onChange\` handler only as a "status-in-progress", "status-info", "status-negative", + "status-not-started", "status-positive", "status-stopped", "status-warning", - "stop-circle", "subtract-minus", "suggestions", "support", @@ -3376,13 +3363,6 @@ Note: Manual filtering doesn't disable match highlighting.", "optional": true, "type": "string", }, - { - "defaultValue": "false", - "description": "Defines whether entered text option is shown as the first option in the dropdown when value is non-empty.", - "name": "hideEnteredTextOption", - "optional": true, - "type": "boolean", - }, { "deprecatedTag": "The usage of the \`id\` attribute is reserved for internal use cases. For testing and other use cases, use [data attributes](https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes). If you must @@ -4135,8 +4115,8 @@ Use \`categorical\` for bar charts.", "name": "ScaleType", "type": "union", "values": [ - "time", "linear", + "time", "log", "categorical", ], @@ -4394,16 +4374,16 @@ Sizes are automatically scaled down in compact mode. "name": "BoxProps.SpacingSize | BoxProps.Spacing", "type": "union", "values": [ - ""s"", - ""m"", - ""n"", - ""xxxs"", - ""xxs"", - ""xs"", - ""l"", - ""xl"", - ""xxl"", - ""xxxl"", + "s", + "m", + "n", + "xxxs", + "xxs", + "xs", + "l", + "xl", + "xxl", + "xxxl", "BoxProps.Spacing", ], }, @@ -4459,16 +4439,16 @@ Sizes are automatically scaled down in compact mode. "name": "BoxProps.SpacingSize | BoxProps.Spacing", "type": "union", "values": [ - ""s"", - ""m"", - ""n"", - ""xxxs"", - ""xxs"", - ""xs"", - ""l"", - ""xl"", - ""xxl"", - ""xxxl"", + "s", + "m", + "n", + "xxxs", + "xxs", + "xs", + "l", + "xl", + "xxl", + "xxxl", "BoxProps.Spacing", ], }, @@ -4966,7 +4946,6 @@ This property is ignored if you use a predefined icon or if you set your custom "file", "pause", "play", - "microphone", "remove", "copy", "menu", @@ -4981,8 +4960,8 @@ This property is ignored if you use a predefined icon or if you set your custom "ellipsis", "zoom-in", "zoom-out", - "security", "download", + "security", "edit", "add-plus", "anchor-link", @@ -5042,6 +5021,7 @@ This property is ignored if you use a predefined icon or if you set your custom "list-view", "location-pin", "lock-private", + "microphone", "microphone-off", "mini-player", "multiscreen", @@ -5059,10 +5039,10 @@ This property is ignored if you use a predefined icon or if you set your custom "status-in-progress", "status-info", "status-negative", + "status-not-started", "status-positive", "status-stopped", "status-warning", - "stop-circle", "subtract-minus", "suggestions", "support", @@ -5636,7 +5616,6 @@ The following properties are supported across all types: ### action - \`href\` (string) - (Optional) Defines the target URL of the menu item, turning it into a link. -- \`download\` (boolean | string) - (Optional) Indicates that the link should be downloaded when clicked. Only works when \`href\` is also provided. If set to \`true\`, the browser will use the filename from the URL. If set to a string, that string will be used as the suggested filename. - \`external\` (boolean) - Marks a menu item as external by adding an icon after the menu item text. The link will open in a new tab when clicked. Note that this only works when \`href\` is also provided. - \`externalIconAriaLabel\` (string) - Adds an \`aria-label\` to the external icon. - \`iconName\` (string) - (Optional) Specifies the name of the icon, used with the [icon component](/components/icon/). @@ -5751,7 +5730,6 @@ The main action also supports the following properties of the [button](/componen "file", "pause", "play", - "microphone", "remove", "copy", "menu", @@ -5766,8 +5744,8 @@ The main action also supports the following properties of the [button](/componen "ellipsis", "zoom-in", "zoom-out", - "security", "download", + "security", "edit", "add-plus", "anchor-link", @@ -5827,6 +5805,7 @@ The main action also supports the following properties of the [button](/componen "list-view", "location-pin", "lock-private", + "microphone", "microphone-off", "mini-player", "multiscreen", @@ -5844,10 +5823,10 @@ The main action also supports the following properties of the [button](/componen "status-in-progress", "status-info", "status-negative", + "status-not-started", "status-positive", "status-stopped", "status-warning", - "stop-circle", "subtract-minus", "suggestions", "support", @@ -7660,19 +7639,14 @@ is provided by its parent form field component.", "description": "Use this property to specify a different dynamic modal root for the dialog. The function will be called when a user clicks on the trigger button.", "inlineType": { - "name": "(options: { abortSignal: AbortSignal; }) => Promise", - "parameters": [ - { - "name": "options", - "type": "{ abortSignal: AbortSignal; }", - }, - ], + "name": "() => Promise", + "parameters": [], "returnType": "Promise", "type": "function", }, "name": "getModalRoot", "optional": true, - "type": "((options: { abortSignal: AbortSignal; }) => Promise)", + "type": "(() => Promise)", }, { "description": "An object containing all the necessary localized strings required by the component. @@ -7840,170 +7814,170 @@ For more info on custom languages, see the [Code editor API](/components/code-ed "name": "CodeEditorProps.Language", "type": "union", "values": [ - ""stylus"", - ""d"", - ""mask"", - ""r"", - ""html"", - ""ruby"", - ""svg"", - ""text"", - ""json"", - ""red"", - ""space"", - ""dot"", - ""properties"", - ""abc"", - ""actionscript"", - ""c_cpp"", - ""clojure"", - ""coffee"", - ""csound_document"", - ""csound_orchestra"", - ""css"", - ""dart"", - ""diff"", - ""django"", - ""drools"", - ""edifact"", - ""erlang"", - ""fsl"", - ""gobstones"", - ""graphqlschema"", - ""haml"", - ""haskell"", - ""io"", - ""java"", - ""javascript"", - ""jsp"", - ""liquid"", - ""lsl"", - ""lua"", - ""makefile"", - ""markdown"", - ""maze"", - ""perl"", - ""php"", - ""python"", - ""razor"", - ""rst"", - ""sh"", - ""snippets"", - ""sql"", - ""sqlserver"", - ""tcl"", - ""tex"", - ""textile"", - ""velocity"", - ""wollok"", - ""slim"", - ""abap"", - ""ada"", - ""alda"", - ""apache_conf"", - ""apex"", - ""aql"", - ""asciidoc"", - ""asl"", - ""assembly_x86"", - ""autohotkey"", - ""batchfile"", - ""c9search"", - ""cirru"", - ""cobol"", - ""coldfusion"", - ""crystal"", - ""csharp"", - ""csound_score"", - ""curly"", - ""dockerfile"", - ""eiffel"", - ""ejs"", - ""elixir"", - ""elm"", - ""forth"", - ""fortran"", - ""fsharp"", - ""ftl"", - ""gcode"", - ""gherkin"", - ""gitignore"", - ""glsl"", - ""golang"", - ""groovy"", - ""handlebars"", - ""haskell_cabal"", - ""haxe"", - ""hjson"", - ""html_elixir"", - ""html_ruby"", - ""ini"", - ""jack"", - ""jade"", - ""json5"", - ""jsoniq"", - ""jssm"", - ""jsx"", - ""julia"", - ""kotlin"", - ""latex"", - ""less"", - ""lisp"", - ""livescript"", - ""logiql"", - ""luapage"", - ""lucene"", - ""matlab"", - ""mediawiki"", - ""mel"", - ""mixal"", - ""mushcode"", - ""mysql"", - ""nginx"", - ""nim"", - ""nix"", - ""nsis"", - ""nunjucks"", - ""objectivec"", - ""ocaml"", - ""pascal"", - ""perl6"", - ""pgsql"", - ""php_laravel_blade"", - ""pig"", - ""powershell"", - ""praat"", - ""prisma"", - ""prolog"", - ""protobuf"", - ""puppet"", - ""qml"", - ""rdoc"", - ""rhtml"", - ""rust"", - ""sass"", - ""scad"", - ""scala"", - ""scheme"", - ""scss"", - ""sjs"", - ""smarty"", - ""soy_template"", - ""swift"", - ""terraform"", - ""toml"", - ""tsx"", - ""twig"", - ""typescript"", - ""vala"", - ""vbscript"", - ""verilog"", - ""vhdl"", - ""visualforce"", - ""xml"", - ""xquery"", - ""yaml"", - ""zeek"", + "stylus", + "mask", + "html", + "ruby", + "svg", + "text", + "json", + "red", + "space", + "dot", + "d", + "r", + "properties", + "abc", + "actionscript", + "c_cpp", + "clojure", + "coffee", + "csound_document", + "csound_orchestra", + "css", + "dart", + "diff", + "django", + "drools", + "edifact", + "erlang", + "fsl", + "gobstones", + "graphqlschema", + "haml", + "haskell", + "io", + "java", + "javascript", + "jsp", + "liquid", + "lsl", + "lua", + "makefile", + "markdown", + "maze", + "perl", + "php", + "python", + "razor", + "rst", + "sh", + "snippets", + "sql", + "sqlserver", + "tcl", + "tex", + "textile", + "velocity", + "wollok", + "slim", + "abap", + "ada", + "alda", + "apache_conf", + "apex", + "aql", + "asciidoc", + "asl", + "assembly_x86", + "autohotkey", + "batchfile", + "c9search", + "cirru", + "cobol", + "coldfusion", + "crystal", + "csharp", + "csound_score", + "curly", + "dockerfile", + "eiffel", + "ejs", + "elixir", + "elm", + "forth", + "fortran", + "fsharp", + "ftl", + "gcode", + "gherkin", + "gitignore", + "glsl", + "golang", + "groovy", + "handlebars", + "haskell_cabal", + "haxe", + "hjson", + "html_elixir", + "html_ruby", + "ini", + "jack", + "jade", + "json5", + "jsoniq", + "jssm", + "jsx", + "julia", + "kotlin", + "latex", + "less", + "lisp", + "livescript", + "logiql", + "luapage", + "lucene", + "matlab", + "mediawiki", + "mel", + "mixal", + "mushcode", + "mysql", + "nginx", + "nim", + "nix", + "nsis", + "nunjucks", + "objectivec", + "ocaml", + "pascal", + "perl6", + "pgsql", + "php_laravel_blade", + "pig", + "powershell", + "praat", + "prisma", + "prolog", + "protobuf", + "puppet", + "qml", + "rdoc", + "rhtml", + "rust", + "sass", + "scad", + "scala", + "scheme", + "scss", + "sjs", + "smarty", + "soy_template", + "swift", + "terraform", + "toml", + "tsx", + "twig", + "typescript", + "vala", + "vbscript", + "verilog", + "vhdl", + "visualforce", + "xml", + "xquery", + "yaml", + "zeek", "string & { _?: undefined; }", ], }, @@ -8107,11 +8081,11 @@ You can use any theme provided by Ace.", element after a user closes the dialog. The function receives the return value of the most recent getModalRoot call as an argument.", "inlineType": { - "name": "(container: HTMLElement | null) => void", + "name": "(rootElement: HTMLElement) => void", "parameters": [ { - "name": "container", - "type": "HTMLElement | null", + "name": "rootElement", + "type": "HTMLElement", }, ], "returnType": "void", @@ -8119,7 +8093,7 @@ of the most recent getModalRoot call as an argument.", }, "name": "removeModalRoot", "optional": true, - "type": "((container: HTMLElement | null) => void)", + "type": "((rootElement: HTMLElement) => void)", }, { "description": "List of Ace themes available for selection in preferences dialog. Make sure you include at least one light and at @@ -8563,19 +8537,14 @@ the custom content is displayed at the bottom of the left column within the moda "description": "Use this property to specify a different dynamic modal root for the dialog. The function will be called when a user clicks on the trigger button.", "inlineType": { - "name": "(options: { abortSignal: AbortSignal; }) => Promise", - "parameters": [ - { - "name": "options", - "type": "{ abortSignal: AbortSignal; }", - }, - ], + "name": "() => Promise", + "parameters": [], "returnType": "Promise", "type": "function", }, "name": "getModalRoot", "optional": true, - "type": "((options: { abortSignal: AbortSignal; }) => Promise)", + "type": "(() => Promise)", }, { "deprecatedTag": "The usage of the \`id\` attribute is reserved for internal use cases. For testing and other use cases, @@ -8715,11 +8684,11 @@ It contains the following: element after a user closes the dialog. The function receives the return value of the most recent getModalRoot call as an argument.", "inlineType": { - "name": "(container: HTMLElement | null) => void", + "name": "(rootElement: HTMLElement) => void", "parameters": [ { - "name": "container", - "type": "HTMLElement | null", + "name": "rootElement", + "type": "HTMLElement", }, ], "returnType": "void", @@ -8727,7 +8696,7 @@ of the most recent getModalRoot call as an argument.", }, "name": "removeModalRoot", "optional": true, - "type": "((container: HTMLElement | null) => void)", + "type": "((rootElement: HTMLElement) => void)", }, { "description": "Configures the sticky columns preference that can be set for both left and right columns. @@ -10894,28 +10863,6 @@ modifying the value. A read-only component can receive focus.", "optional": false, "type": "ReadonlyArray", }, - { - "description": "Specifies custom content to fully override the relative range tab. -When provided, all default relative range functionality is replaced.", - "inlineType": { - "name": "DateRangePickerProps.RelativeRangeControl", - "parameters": [ - { - "name": "selectedRange", - "type": "DateRangePickerProps.RelativeValue | null", - }, - { - "name": "setSelectedRange", - "type": "(value: DateRangePickerProps.RelativeValue) => void", - }, - ], - "returnType": "React.ReactNode", - "type": "function", - }, - "name": "renderRelativeRangeContent", - "optional": true, - "type": "DateRangePickerProps.RelativeRangeControl", - }, { "defaultValue": "true", "description": "Specifies whether the component should show a button that @@ -12740,10 +12687,10 @@ exports[`Components definition for form matches the snapshot: form 1`] = ` "name": "FlowType", "type": "union", "values": [ - "home", "create", "edit", "delete", + "home", "dashboard", "view-resource", ], @@ -13127,6 +13074,13 @@ exports[`Components definition for header matches the snapshot: header 1`] = ` "optional": true, "type": "string", }, + { + "description": "Specifies secondary text that's displayed to the right of the heading title. This is commonly used +to display resource counters in table and cards components.", + "name": "counter", + "optional": true, + "type": "string", + }, { "description": "Overrides the default [HTML heading tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements) provided by the variant. Using this property does not change the visual appearance of the component.", @@ -13190,12 +13144,6 @@ HTML heading tag based on the specified \`variant\` or \`headingTagOverride\`.", "isDefault": true, "name": "children", }, - { - "description": "Specifies secondary content that's displayed to the right of the heading title. This is commonly used -to display resource counters in table and cards components.", - "isDefault": false, - "name": "counter", - }, { "description": "Supplementary text below the heading.", "isDefault": false, @@ -13411,7 +13359,6 @@ use the \`id\` attribute, consider setting it on a parent element instead.", "file", "pause", "play", - "microphone", "remove", "copy", "menu", @@ -13426,8 +13373,8 @@ use the \`id\` attribute, consider setting it on a parent element instead.", "ellipsis", "zoom-in", "zoom-out", - "security", "download", + "security", "edit", "add-plus", "anchor-link", @@ -13487,6 +13434,7 @@ use the \`id\` attribute, consider setting it on a parent element instead.", "list-view", "location-pin", "lock-private", + "microphone", "microphone-off", "mini-player", "multiscreen", @@ -13504,10 +13452,10 @@ use the \`id\` attribute, consider setting it on a parent element instead.", "status-in-progress", "status-info", "status-negative", + "status-not-started", "status-positive", "status-stopped", "status-warning", - "stop-circle", "subtract-minus", "suggestions", "support", @@ -14162,27 +14110,27 @@ The same applies to switching icons in the same configuration (for example, \`{' "type": "React.ReactNode", }, { - "name": "status-pending", + "name": "status-not-started", "optional": true, "type": "React.ReactNode", }, { - "name": "status-positive", + "name": "status-pending", "optional": true, "type": "React.ReactNode", }, { - "name": "status-stopped", + "name": "status-positive", "optional": true, "type": "React.ReactNode", }, { - "name": "status-warning", + "name": "status-stopped", "optional": true, "type": "React.ReactNode", }, { - "name": "stop-circle", + "name": "status-warning", "optional": true, "type": "React.ReactNode", }, @@ -14639,13 +14587,13 @@ This value may not be supported by all browsers or devices.", "type": "union", "values": [ "search", - "decimal", "numeric", "none", "url", "text", - "email", + "decimal", "tel", + "email", ], }, "name": "inputMode", @@ -14728,243 +14676,13 @@ including the date, month, week, time, datetime-local, number and range types.", "type": "union", "values": [ "number", - ""any"", + "any", ], }, "name": "step", "optional": true, "type": "InputProps.Step", }, - { - "inlineType": { - "name": "InputProps.Style", - "properties": [ - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "color", - "optional": true, - "type": "string", - }, - { - "name": "fontSize", - "optional": true, - "type": "string", - }, - { - "name": "fontStyle", - "optional": true, - "type": "string", - }, - { - "name": "fontWeight", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "placeholder", - "optional": true, - "type": "{ color?: string | undefined; fontSize?: string | undefined; fontStyle?: string | undefined; fontWeight?: string | undefined; }", - }, - { - "inlineType": { - "name": "object", - "properties": [ - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "default", - "optional": true, - "type": "string", - }, - { - "name": "disabled", - "optional": true, - "type": "string", - }, - { - "name": "focus", - "optional": true, - "type": "string", - }, - { - "name": "hover", - "optional": true, - "type": "string", - }, - { - "name": "readonly", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "backgroundColor", - "optional": true, - "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", - }, - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "default", - "optional": true, - "type": "string", - }, - { - "name": "disabled", - "optional": true, - "type": "string", - }, - { - "name": "focus", - "optional": true, - "type": "string", - }, - { - "name": "hover", - "optional": true, - "type": "string", - }, - { - "name": "readonly", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "borderColor", - "optional": true, - "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", - }, - { - "name": "borderRadius", - "optional": true, - "type": "string", - }, - { - "name": "borderWidth", - "optional": true, - "type": "string", - }, - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "default", - "optional": true, - "type": "string", - }, - { - "name": "disabled", - "optional": true, - "type": "string", - }, - { - "name": "focus", - "optional": true, - "type": "string", - }, - { - "name": "hover", - "optional": true, - "type": "string", - }, - { - "name": "readonly", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "boxShadow", - "optional": true, - "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", - }, - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "default", - "optional": true, - "type": "string", - }, - { - "name": "disabled", - "optional": true, - "type": "string", - }, - { - "name": "focus", - "optional": true, - "type": "string", - }, - { - "name": "hover", - "optional": true, - "type": "string", - }, - { - "name": "readonly", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "color", - "optional": true, - "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", - }, - { - "name": "fontSize", - "optional": true, - "type": "string", - }, - { - "name": "fontWeight", - "optional": true, - "type": "string", - }, - { - "name": "paddingBlock", - "optional": true, - "type": "string", - }, - { - "name": "paddingInline", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "root", - "optional": true, - "type": "{ backgroundColor?: { default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; } | undefined; ... 8 more ...; paddingInline?: string | undefined; }", - }, - ], - "type": "object", - }, - "name": "style", - "optional": true, - "systemTags": [ - "core", - ], - "type": "InputProps.Style", - }, { "defaultValue": "'text'", "description": "Specifies the type of control to render. @@ -15474,8 +15192,8 @@ When controlling this directly, make sure to update the value based on filtering "name": "ScaleType", "type": "union", "values": [ - "time", "linear", + "time", "log", "categorical", ], @@ -16595,8 +16313,8 @@ Use \`categorical\` for charts with bars.", "name": "ScaleType", "type": "union", "values": [ - "time", "linear", + "time", "log", "categorical", ], @@ -16741,10 +16459,10 @@ The event detail contains the \`reason\`, which can be any of the following: "name": "FlowType", "type": "union", "values": [ - "home", "create", "edit", "delete", + "home", "dashboard", "view-resource", ], @@ -16794,19 +16512,14 @@ The event detail contains the \`reason\`, which can be any of the following: "description": "Use this property to specify a different dynamic modal root for the dialog. The function will be called when a user clicks on the trigger button.", "inlineType": { - "name": "(options: { abortSignal: AbortSignal; }) => Promise", - "parameters": [ - { - "name": "options", - "type": "{ abortSignal: AbortSignal; }", - }, - ], + "name": "() => Promise", + "parameters": [], "returnType": "Promise", "type": "function", }, "name": "getModalRoot", "optional": true, - "type": "((options: { abortSignal: AbortSignal; }) => Promise)", + "type": "(() => Promise)", }, { "deprecatedTag": "The usage of the \`id\` attribute is reserved for internal use cases. For testing and other use cases, @@ -16830,11 +16543,11 @@ render to an element under \`document.body\`.", element after a user closes the dialog. The function receives the return value of the most recent getModalRoot call as an argument.", "inlineType": { - "name": "(container: HTMLElement | null) => void", + "name": "(rootElement: HTMLElement) => void", "parameters": [ { - "name": "container", - "type": "HTMLElement | null", + "name": "rootElement", + "type": "HTMLElement", }, ], "returnType": "void", @@ -16842,7 +16555,7 @@ of the most recent getModalRoot call as an argument.", }, "name": "removeModalRoot", "optional": true, - "type": "((container: HTMLElement | null) => void)", + "type": "((rootElement: HTMLElement) => void)", }, { "defaultValue": "'medium'", @@ -18391,88 +18104,6 @@ Add a button using the \`action\` property of the flashbar item instead.", "optional": true, "type": "string", }, - { - "inlineType": { - "name": "ProgressBarProps.Style", - "properties": [ - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "backgroundColor", - "optional": true, - "type": "string", - }, - { - "name": "borderRadius", - "optional": true, - "type": "string", - }, - { - "name": "height", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "progressBar", - "optional": true, - "type": "{ backgroundColor?: string | undefined; borderRadius?: string | undefined; height?: string | undefined; }", - }, - { - "inlineType": { - "name": "{ color?: string | undefined; fontSize?: string | undefined; fontWeight?: string | undefined; }", - "properties": [ - { - "name": "color", - "optional": true, - "type": "string", - }, - { - "name": "fontSize", - "optional": true, - "type": "string", - }, - { - "name": "fontWeight", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "progressPercentage", - "optional": true, - "type": "{ color?: string | undefined; fontSize?: string | undefined; fontWeight?: string | undefined; }", - }, - { - "inlineType": { - "name": "{ backgroundColor?: string | undefined; }", - "properties": [ - { - "name": "backgroundColor", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "progressValue", - "optional": true, - "type": "{ backgroundColor?: string | undefined; }", - }, - ], - "type": "object", - }, - "name": "style", - "optional": true, - "systemTags": [ - "core", - ], - "type": "ProgressBarProps.Style", - }, { "defaultValue": "0", "description": "Indicates the current progress as a percentage. The value must be between 0 and 100. Decimals are rounded.", @@ -18746,7 +18377,6 @@ This property is ignored if you use a predefined icon or if you set your custom "file", "pause", "play", - "microphone", "remove", "copy", "menu", @@ -18761,8 +18391,8 @@ This property is ignored if you use a predefined icon or if you set your custom "ellipsis", "zoom-in", "zoom-out", - "security", "download", + "security", "edit", "add-plus", "anchor-link", @@ -18822,6 +18452,7 @@ This property is ignored if you use a predefined icon or if you set your custom "list-view", "location-pin", "lock-private", + "microphone", "microphone-off", "mini-player", "multiscreen", @@ -18839,10 +18470,10 @@ This property is ignored if you use a predefined icon or if you set your custom "status-in-progress", "status-info", "status-negative", + "status-not-started", "status-positive", "status-stopped", "status-warning", - "stop-circle", "subtract-minus", "suggestions", "support", @@ -19098,236 +18729,6 @@ inadvertently sending data (such as user passwords) to third parties.", "optional": true, "type": "boolean", }, - { - "inlineType": { - "name": "PromptInputProps.Style", - "properties": [ - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "color", - "optional": true, - "type": "string", - }, - { - "name": "fontSize", - "optional": true, - "type": "string", - }, - { - "name": "fontStyle", - "optional": true, - "type": "string", - }, - { - "name": "fontWeight", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "placeholder", - "optional": true, - "type": "{ color?: string | undefined; fontSize?: string | undefined; fontStyle?: string | undefined; fontWeight?: string | undefined; }", - }, - { - "inlineType": { - "name": "object", - "properties": [ - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "default", - "optional": true, - "type": "string", - }, - { - "name": "disabled", - "optional": true, - "type": "string", - }, - { - "name": "focus", - "optional": true, - "type": "string", - }, - { - "name": "hover", - "optional": true, - "type": "string", - }, - { - "name": "readonly", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "backgroundColor", - "optional": true, - "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", - }, - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "default", - "optional": true, - "type": "string", - }, - { - "name": "disabled", - "optional": true, - "type": "string", - }, - { - "name": "focus", - "optional": true, - "type": "string", - }, - { - "name": "hover", - "optional": true, - "type": "string", - }, - { - "name": "readonly", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "borderColor", - "optional": true, - "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", - }, - { - "name": "borderRadius", - "optional": true, - "type": "string", - }, - { - "name": "borderWidth", - "optional": true, - "type": "string", - }, - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "default", - "optional": true, - "type": "string", - }, - { - "name": "disabled", - "optional": true, - "type": "string", - }, - { - "name": "focus", - "optional": true, - "type": "string", - }, - { - "name": "hover", - "optional": true, - "type": "string", - }, - { - "name": "readonly", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "boxShadow", - "optional": true, - "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", - }, - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "default", - "optional": true, - "type": "string", - }, - { - "name": "disabled", - "optional": true, - "type": "string", - }, - { - "name": "focus", - "optional": true, - "type": "string", - }, - { - "name": "hover", - "optional": true, - "type": "string", - }, - { - "name": "readonly", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "color", - "optional": true, - "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", - }, - { - "name": "fontSize", - "optional": true, - "type": "string", - }, - { - "name": "fontWeight", - "optional": true, - "type": "string", - }, - { - "name": "paddingBlock", - "optional": true, - "type": "string", - }, - { - "name": "paddingInline", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "root", - "optional": true, - "type": "{ backgroundColor?: { default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; } | undefined; ... 8 more ...; paddingInline?: string | undefined; }", - }, - ], - "type": "object", - }, - "name": "style", - "optional": true, - "systemTags": [ - "core", - ], - "type": "PromptInputProps.Style", - }, { "description": "Specifies the text entered into the form element.", "name": "value", @@ -20624,16 +20025,6 @@ path of the selected resource and \`errorText\` that may contain a validation er "detailType": "S3ResourceSelectorProps.ChangeDetail", "name": "onChange", }, - { - "cancelable": false, - "description": "Called when input focus is removed from the S3 URI input.", - "name": "onInputBlur", - }, - { - "cancelable": false, - "description": "Called when input focus is moved to the S3 URI input.", - "name": "onInputFocus", - }, ], "functions": [ { @@ -20781,19 +20172,14 @@ The return type of the function should be a promise that resolves to a list of v "description": "Use this property to specify a different dynamic modal root for the dialog. The function will be called when a user clicks on the trigger button.", "inlineType": { - "name": "(options: { abortSignal: AbortSignal; }) => Promise", - "parameters": [ - { - "name": "options", - "type": "{ abortSignal: AbortSignal; }", - }, - ], + "name": "() => Promise", + "parameters": [], "returnType": "Promise", "type": "function", }, "name": "getModalRoot", "optional": true, - "type": "((options: { abortSignal: AbortSignal; }) => Promise)", + "type": "(() => Promise)", }, { "description": "An object containing all the necessary localized strings required by the component.", @@ -21352,11 +20738,11 @@ and 'Size'.", element after a user closes the dialog. The function receives the return value of the most recent getModalRoot call as an argument.", "inlineType": { - "name": "(container: HTMLElement | null) => void", + "name": "(rootElement: HTMLElement) => void", "parameters": [ { - "name": "container", - "type": "HTMLElement | null", + "name": "rootElement", + "type": "HTMLElement", }, ], "returnType": "void", @@ -21364,7 +20750,7 @@ of the most recent getModalRoot call as an argument.", }, "name": "removeModalRoot", "optional": true, - "type": "((container: HTMLElement | null) => void)", + "type": "((rootElement: HTMLElement) => void)", }, { "description": "The current selected resource. Resource has the following properties: @@ -21598,7 +20984,6 @@ The event \`detail\` contains the current \`selectedOption\`.", "file", "pause", "play", - "microphone", "remove", "copy", "menu", @@ -21613,8 +20998,8 @@ The event \`detail\` contains the current \`selectedOption\`.", "ellipsis", "zoom-in", "zoom-out", - "security", "download", + "security", "edit", "add-plus", "anchor-link", @@ -21674,6 +21059,7 @@ The event \`detail\` contains the current \`selectedOption\`.", "list-view", "location-pin", "lock-private", + "microphone", "microphone-off", "mini-player", "multiscreen", @@ -21691,10 +21077,10 @@ The event \`detail\` contains the current \`selectedOption\`.", "status-in-progress", "status-info", "status-negative", + "status-not-started", "status-positive", "status-stopped", "status-warning", - "stop-circle", "subtract-minus", "suggestions", "support", @@ -22189,7 +21575,6 @@ If you want to clear the selection, use \`null\`.", "file", "pause", "play", - "microphone", "remove", "copy", "menu", @@ -22204,8 +21589,8 @@ If you want to clear the selection, use \`null\`.", "ellipsis", "zoom-in", "zoom-out", - "security", "download", + "security", "edit", "add-plus", "anchor-link", @@ -22265,6 +21650,7 @@ If you want to clear the selection, use \`null\`.", "list-view", "location-pin", "lock-private", + "microphone", "microphone-off", "mini-player", "multiscreen", @@ -22282,10 +21668,10 @@ If you want to clear the selection, use \`null\`.", "status-in-progress", "status-info", "status-negative", + "status-not-started", "status-positive", "status-stopped", "status-warning", - "stop-circle", "subtract-minus", "suggestions", "support", @@ -22654,7 +22040,6 @@ Links are rendered as \`\` tags. The anchor also has the attributes \`target="_blank"\` and \`rel="noopener"\`. Additionally, the \`activeHref\` property won't be modified when a user chooses the link. - \`externalIconAriaLabel\` (string) - Adds an aria-label to the external icon. -Note: Deprecated, use i18nStrings.externalIconAriaLabel instead. - \`info\` (ReactNode) - Enables you to display content next to the link. Although it is technically possible to insert any content, our UX guidelines allow only to add a Badge and/or a "New" label. @@ -23394,6 +22779,7 @@ We do not support using this attribute to apply custom styling.", "success", "warning", "info", + "not-started", ], }, "name": "type", @@ -23464,48 +22850,6 @@ use the \`id\` attribute, consider setting it on a parent element instead.", "optional": true, "type": "string", }, - { - "description": "The visual orientation of the steps (vertical or horizontal). -By default the orientation is vertical.", - "inlineType": { - "name": "StepsProps.Orientation", - "type": "union", - "values": [ - "horizontal", - "vertical", - ], - }, - "name": "orientation", - "optional": true, - "systemTags": [ - "core", - ], - "type": "string", - }, - { - "description": "Render a step. This overrides the default icon, header, and details provided by the component. -The function is called for each step and should return an object with the following keys: -* \`header\` (React.ReactNode) - Summary corresponding to the step. -* \`details\` (React.ReactNode) - (Optional) Additional information corresponding to the step. -* \`icon\` (React.ReactNode) - (Optional) Replaces the standard step icon from the status indicator.", - "inlineType": { - "name": "(step: StepsProps.Step) => { header: React.ReactNode; details?: React.ReactNode; icon?: React.ReactNode; }", - "parameters": [ - { - "name": "step", - "type": "StepsProps.Step", - }, - ], - "returnType": "{ header: React.ReactNode; details?: React.ReactNode; icon?: React.ReactNode; }", - "type": "function", - }, - "name": "renderStep", - "optional": true, - "systemTags": [ - "core", - ], - "type": "((step: StepsProps.Step) => { header: React.ReactNode; details?: React.ReactNode; icon?: React.ReactNode; })", - }, { "description": "An array of individual steps @@ -25714,236 +25058,6 @@ inadvertently sending data (such as user passwords) to third parties.", "optional": true, "type": "boolean", }, - { - "inlineType": { - "name": "TextareaProps.Style", - "properties": [ - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "color", - "optional": true, - "type": "string", - }, - { - "name": "fontSize", - "optional": true, - "type": "string", - }, - { - "name": "fontStyle", - "optional": true, - "type": "string", - }, - { - "name": "fontWeight", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "placeholder", - "optional": true, - "type": "{ color?: string | undefined; fontSize?: string | undefined; fontStyle?: string | undefined; fontWeight?: string | undefined; }", - }, - { - "inlineType": { - "name": "object", - "properties": [ - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "default", - "optional": true, - "type": "string", - }, - { - "name": "disabled", - "optional": true, - "type": "string", - }, - { - "name": "focus", - "optional": true, - "type": "string", - }, - { - "name": "hover", - "optional": true, - "type": "string", - }, - { - "name": "readonly", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "backgroundColor", - "optional": true, - "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", - }, - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "default", - "optional": true, - "type": "string", - }, - { - "name": "disabled", - "optional": true, - "type": "string", - }, - { - "name": "focus", - "optional": true, - "type": "string", - }, - { - "name": "hover", - "optional": true, - "type": "string", - }, - { - "name": "readonly", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "borderColor", - "optional": true, - "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", - }, - { - "name": "borderRadius", - "optional": true, - "type": "string", - }, - { - "name": "borderWidth", - "optional": true, - "type": "string", - }, - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "default", - "optional": true, - "type": "string", - }, - { - "name": "disabled", - "optional": true, - "type": "string", - }, - { - "name": "focus", - "optional": true, - "type": "string", - }, - { - "name": "hover", - "optional": true, - "type": "string", - }, - { - "name": "readonly", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "boxShadow", - "optional": true, - "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", - }, - { - "inlineType": { - "name": "object", - "properties": [ - { - "name": "default", - "optional": true, - "type": "string", - }, - { - "name": "disabled", - "optional": true, - "type": "string", - }, - { - "name": "focus", - "optional": true, - "type": "string", - }, - { - "name": "hover", - "optional": true, - "type": "string", - }, - { - "name": "readonly", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "color", - "optional": true, - "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", - }, - { - "name": "fontSize", - "optional": true, - "type": "string", - }, - { - "name": "fontWeight", - "optional": true, - "type": "string", - }, - { - "name": "paddingBlock", - "optional": true, - "type": "string", - }, - { - "name": "paddingInline", - "optional": true, - "type": "string", - }, - ], - "type": "object", - }, - "name": "root", - "optional": true, - "type": "{ backgroundColor?: { default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; } | undefined; ... 8 more ...; paddingInline?: string | undefined; }", - }, - ], - "type": "object", - }, - "name": "style", - "optional": true, - "systemTags": [ - "core", - ], - "type": "TextareaProps.Style", - }, { "description": "Specifies the text entered into the form element.", "name": "value", @@ -26831,7 +25945,6 @@ If an href is provided, it opens the link in a new tab.", "file", "pause", "play", - "microphone", "remove", "copy", "menu", @@ -26846,8 +25959,8 @@ If an href is provided, it opens the link in a new tab.", "ellipsis", "zoom-in", "zoom-out", - "security", "download", + "security", "edit", "add-plus", "anchor-link", @@ -26907,6 +26020,7 @@ If an href is provided, it opens the link in a new tab.", "list-view", "location-pin", "lock-private", + "microphone", "microphone-off", "mini-player", "multiscreen", @@ -26924,10 +26038,10 @@ If an href is provided, it opens the link in a new tab.", "status-in-progress", "status-info", "status-negative", + "status-not-started", "status-positive", "status-stopped", "status-warning", - "stop-circle", "subtract-minus", "suggestions", "support", @@ -27034,7 +26148,6 @@ We do not support using this attribute to apply custom styling.", "file", "pause", "play", - "microphone", "remove", "copy", "menu", @@ -27049,8 +26162,8 @@ We do not support using this attribute to apply custom styling.", "ellipsis", "zoom-in", "zoom-out", - "security", "download", + "security", "edit", "add-plus", "anchor-link", @@ -27110,6 +26223,7 @@ We do not support using this attribute to apply custom styling.", "list-view", "location-pin", "lock-private", + "microphone", "microphone-off", "mini-player", "multiscreen", @@ -27127,10 +26241,10 @@ We do not support using this attribute to apply custom styling.", "status-in-progress", "status-info", "status-negative", + "status-not-started", "status-positive", "status-stopped", "status-warning", - "stop-circle", "subtract-minus", "suggestions", "support", @@ -27624,7 +26738,7 @@ use the \`id\` attribute, consider setting it on a parent element instead.", }, { "inlineType": { - "name": "CancelableEventHandler", + "name": "CancelableEventHandler<{}>", "parameters": [ { "name": "event", @@ -27636,7 +26750,7 @@ use the \`id\` attribute, consider setting it on a parent element instead.", }, "name": "onFollow", "optional": true, - "type": "CancelableEventHandler", + "type": "CancelableEventHandler<{}>", }, { "name": "title", @@ -27683,7 +26797,7 @@ The following properties are supported across all utility types: ### menu-dropdown * \`description\` (string) - The description displayed inside the dropdown. -* \`items\` (ButtonDropdownProps.Items) - An array of dropdown items. This follows the same structure as the \`items\` property of the [button dropdown component](/components/button-dropdown). +* \`items\` (ButtonDropdownProps.Items) - An array of dropdown items. This follows the same structure as the \`items\` property of the [button dropdown component](/components/button-dropdown), with the exception of the checkbox item type. * \`onItemClick\` (NonCancelableEventHandler) - Specifies the event handler called when a dropdown item is selected. * \`onItemFollow\` (NonCancelableEventHandler) - Specifies the event handler called when a dropdown item is selected without pressing modifier keys, and the item has an \`href\` set. * \`expandableGroups\` (boolean) - Controls expandability of the item groups.", @@ -28413,10 +27527,10 @@ Defaults to \`false\`.", "name": "FlowType", "type": "union", "values": [ - "home", "create", "edit", "delete", + "home", "dashboard", "view-resource", ], @@ -28624,14 +27738,6 @@ Use this if you need to wait for a response from the server before the user can }, ], "regions": [ - { - "description": "Specifies right-aligned custom primary actions for the wizard. Overwrites existing buttons (e.g. Cancel, Next, Finish).", - "isDefault": false, - "name": "customPrimaryActions", - "systemTags": [ - "core", - ], - }, { "description": "Specifies left-aligned secondary actions for the wizard. Use a button dropdown if multiple actions are required.", "isDefault": false, @@ -36042,37 +35148,6 @@ wrapper.clickSelectAll(); ], }, }, - { - "description": "Returns an inline token.", - "name": "findInlineToken", - "parameters": [ - { - "description": "1-based index of the inline token to return", - "flags": { - "isOptional": false, - }, - "name": "tokenIndex", - "typeName": "number", - }, - ], - "returnType": { - "isNullable": true, - "name": "TokenWrapper", - }, - }, - { - "name": "findInlineTokens", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "Array", - "typeArguments": [ - { - "name": "TokenWrapper", - }, - ], - }, - }, { "name": "findPlaceholder", "parameters": [], @@ -36306,81 +35381,6 @@ wrapper.selectOptionByValue('option_1'); ], "name": "TokenGroupItemWrapper", }, - { - "methods": [ - { - "description": "Returns the token description.", - "name": "findDescription", - "parameters": [], - "returnType": { - "isNullable": true, - "name": "ElementWrapper", - "typeArguments": [ - { - "name": "HTMLElement", - }, - ], - }, - }, - { - "description": "Returns the token dismiss button.", - "name": "findDismiss", - "parameters": [], - "returnType": { - "isNullable": true, - "name": "ElementWrapper", - "typeArguments": [ - { - "name": "HTMLElement", - }, - ], - }, - }, - { - "description": "Returns the token label.", - "name": "findLabel", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "ElementWrapper", - "typeArguments": [ - { - "name": "HTMLElement", - }, - ], - }, - }, - { - "description": "Returns the token label tag.", - "name": "findLabelTag", - "parameters": [], - "returnType": { - "isNullable": true, - "name": "ElementWrapper", - "typeArguments": [ - { - "name": "HTMLElement", - }, - ], - }, - }, - { - "description": "Returns the token tags.", - "name": "findTags", - "parameters": [], - "returnType": { - "isNullable": true, - "name": "Array", - "typeArguments": [ - { - "name": "ElementWrapper", - }, - ], - }, - }, - ], - "name": "TokenWrapper", - }, { "methods": [ { @@ -39133,6 +38133,81 @@ Returns the current value of the input.", ], "name": "TimeInputWrapper", }, + { + "methods": [ + { + "description": "Returns the token description.", + "name": "findDescription", + "parameters": [], + "returnType": { + "isNullable": true, + "name": "ElementWrapper", + "typeArguments": [ + { + "name": "HTMLElement", + }, + ], + }, + }, + { + "description": "Returns the token dismiss button.", + "name": "findDismiss", + "parameters": [], + "returnType": { + "isNullable": true, + "name": "ElementWrapper", + "typeArguments": [ + { + "name": "HTMLElement", + }, + ], + }, + }, + { + "description": "Returns the token label.", + "name": "findLabel", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "ElementWrapper", + "typeArguments": [ + { + "name": "HTMLElement", + }, + ], + }, + }, + { + "description": "Returns the token label tag.", + "name": "findLabelTag", + "parameters": [], + "returnType": { + "isNullable": true, + "name": "ElementWrapper", + "typeArguments": [ + { + "name": "HTMLElement", + }, + ], + }, + }, + { + "description": "Returns the token tags.", + "name": "findTags", + "parameters": [], + "returnType": { + "isNullable": true, + "name": "Array", + "typeArguments": [ + { + "name": "ElementWrapper", + }, + ], + }, + }, + ], + "name": "TokenWrapper", + }, { "methods": [ { @@ -45361,37 +44436,6 @@ The dismiss button is only rendered when the \`dismissible\` property is set to "name": "ElementWrapper", }, }, - { - "description": "Returns an inline token.", - "name": "findInlineToken", - "parameters": [ - { - "description": "1-based index of the inline token to return", - "flags": { - "isOptional": false, - }, - "name": "tokenIndex", - "typeName": "number", - }, - ], - "returnType": { - "isNullable": false, - "name": "TokenWrapper", - }, - }, - { - "name": "findInlineTokens", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "MultiElementWrapper", - "typeArguments": [ - { - "name": "TokenWrapper", - }, - ], - }, - }, { "name": "findPlaceholder", "parameters": [], @@ -45500,61 +44544,6 @@ The dismiss button is only rendered when the \`dismissible\` property is set to ], "name": "TokenGroupItemWrapper", }, - { - "methods": [ - { - "description": "Returns the token description.", - "name": "findDescription", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "ElementWrapper", - }, - }, - { - "description": "Returns the token dismiss button.", - "name": "findDismiss", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "ElementWrapper", - }, - }, - { - "description": "Returns the token label.", - "name": "findLabel", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "ElementWrapper", - }, - }, - { - "description": "Returns the token label tag.", - "name": "findLabelTag", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "ElementWrapper", - }, - }, - { - "description": "Returns the token tags.", - "name": "findTags", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "MultiElementWrapper", - "typeArguments": [ - { - "name": "ElementWrapper", - }, - ], - }, - }, - ], - "name": "TokenWrapper", - }, { "methods": [ { @@ -47491,6 +46480,61 @@ To find a specific row use the \`findRow(n)\` function as chaining \`findRows(). ], "name": "TimeInputWrapper", }, + { + "methods": [ + { + "description": "Returns the token description.", + "name": "findDescription", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "ElementWrapper", + }, + }, + { + "description": "Returns the token dismiss button.", + "name": "findDismiss", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "ElementWrapper", + }, + }, + { + "description": "Returns the token label.", + "name": "findLabel", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "ElementWrapper", + }, + }, + { + "description": "Returns the token label tag.", + "name": "findLabelTag", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "ElementWrapper", + }, + }, + { + "description": "Returns the token tags.", + "name": "findTags", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "MultiElementWrapper", + "typeArguments": [ + { + "name": "ElementWrapper", + }, + ], + }, + }, + ], + "name": "TokenWrapper", + }, { "methods": [ { diff --git a/src/__tests__/snapshot-tests/__snapshots__/test-utils-selectors.test.tsx.snap b/src/__tests__/snapshot-tests/__snapshots__/test-utils-selectors.test.tsx.snap index 47986281f0..c46eb4c924 100644 --- a/src/__tests__/snapshot-tests/__snapshots__/test-utils-selectors.test.tsx.snap +++ b/src/__tests__/snapshot-tests/__snapshots__/test-utils-selectors.test.tsx.snap @@ -537,7 +537,6 @@ exports[`test-utils selectors 1`] = ` "select": [ "awsui_disabled-reason-tooltip_dwuol", "awsui_inline-label_dwuol", - "awsui_inline-token-list_dwuol", "awsui_placeholder_dwuol", "awsui_root_r2vco", ], From f97de63b08d1133700b364b396ca8436c7d40734 Mon Sep 17 00:00:00 2001 From: Philipp Schneider Date: Thu, 13 Nov 2025 11:46:46 +0100 Subject: [PATCH 6/7] add: update statusColor in steps --- src/steps/internal.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/steps/internal.tsx b/src/steps/internal.tsx index bd95a7bdce..f8006950be 100644 --- a/src/steps/internal.tsx +++ b/src/steps/internal.tsx @@ -23,6 +23,7 @@ const statusToColor: Record = { pending: 'text-status-inactive', 'in-progress': 'text-status-inactive', loading: 'text-status-inactive', + 'not-started': 'text-status-inactive', }; const CustomStep = ({ From 1eb12ecc5211413e37b17a3a92e72a47b0836cdd Mon Sep 17 00:00:00 2001 From: Philipp Schneider Date: Thu, 13 Nov 2025 14:15:54 +0100 Subject: [PATCH 7/7] fix: snapshot tests --- .../__snapshots__/design-tokens.test.ts.snap | 128 +- .../__snapshots__/documenter.test.ts.snap | 1735 +++++++++++++---- .../test-utils-selectors.test.tsx.snap | 1 + 3 files changed, 1418 insertions(+), 446 deletions(-) diff --git a/src/__tests__/snapshot-tests/__snapshots__/design-tokens.test.ts.snap b/src/__tests__/snapshot-tests/__snapshots__/design-tokens.test.ts.snap index 9640ed354a..1f8f0d3c0b 100644 --- a/src/__tests__/snapshot-tests/__snapshots__/design-tokens.test.ts.snap +++ b/src/__tests__/snapshot-tests/__snapshots__/design-tokens.test.ts.snap @@ -641,28 +641,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#16191f", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#879596", "light": "#687078", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#414750", "light": "#d5dbdb", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#16191f", @@ -3287,28 +3287,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#16191f", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#879596", "light": "#687078", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#414750", "light": "#d5dbdb", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#16191f", @@ -5933,28 +5933,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#16191f", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#879596", "light": "#687078", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#414750", "light": "#d5dbdb", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#16191f", @@ -8579,28 +8579,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#16191f", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#879596", "light": "#687078", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#414750", "light": "#d5dbdb", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#16191f", @@ -11225,28 +11225,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#16191f", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#879596", "light": "#687078", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#414750", "light": "#d5dbdb", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#16191f", @@ -13871,28 +13871,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#ffffff", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#879596", "light": "#879596", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#414750", "light": "#414750", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#ffffff", @@ -16517,28 +16517,28 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#16191f", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#879596", "light": "#687078", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#414750", "light": "#d5dbdb", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#ffffff", "light": "#16191f", @@ -19168,28 +19168,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", @@ -21814,28 +21814,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#dedee3", @@ -24460,28 +24460,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", @@ -27106,28 +27106,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", @@ -29752,28 +29752,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", @@ -32398,28 +32398,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", @@ -35044,28 +35044,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#dedee3", @@ -37690,28 +37690,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#dedee3", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#dedee3", @@ -40336,28 +40336,28 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t }, }, "color-border-segment-active": { - "$description": "The border color of the active segment in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-default": { - "$description": "The border color of inactive segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-disabled": { - "$description": "The border color of disabled segments in a segmented control.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", }, }, "color-border-segment-hover": { - "$description": "The border color of inactive segments in a segmented control on hover.", + "$description": "Deprecated - this token is no longer in use.", "$value": { "dark": "#dedee3", "light": "#424650", diff --git a/src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap b/src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap index db13f8c4cb..302bef6e23 100644 --- a/src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap +++ b/src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap @@ -1050,10 +1050,10 @@ to control the state by listening to \`toolsChange\` and providing \`toolsOpen\` "name": "FlowType", "type": "union", "values": [ + "home", "create", "edit", "delete", - "home", "dashboard", "view-resource", ], @@ -1603,10 +1603,10 @@ to control the state by listening to \`toolsChange\` and providing \`toolsOpen\` "name": "FlowType", "type": "union", "values": [ + "home", "create", "edit", "delete", - "home", "dashboard", "view-resource", ], @@ -2363,8 +2363,8 @@ When controlling this directly, make sure to update the value based on filtering "name": "ScaleType", "type": "union", "values": [ - "linear", "time", + "linear", "log", "categorical", ], @@ -2579,6 +2579,7 @@ The function receives the following properties: If more than 6 attributes are specified, a \`gridLayout\` must be provided. * \`label\` (ReactNode) - Text label for the form field. +* \`description\` (ReactNode) - Additional description for the form field. * \`info\` (ReactNode) - Info link for the form field. * \`errorText\` ((item, itemIndex) => ReactNode) - Error message text to display as a control validation message. It renders the form field as invalid if the returned value is not \`null\` or \`undefined\`. @@ -2613,8 +2614,15 @@ A \`gridLayout\` is an array of breakpoint definitions. Each definition consists "optional": true, "type": "ReadonlyArray", }, + { + "description": "Determines whether the add button is hidden", + "name": "hideAddButton", + "optional": true, + "type": "boolean", + }, { "description": "An object containing all the necessary localized strings required by the component.", + "i18nTag": true, "inlineType": { "name": "AttributeEditorProps.I18nStrings", "properties": [ @@ -2719,6 +2727,11 @@ The display of a row is handled by the \`definition\` property.", }, ], "regions": [ + { + "description": "Specifies additional actions displayed next to the add-button (or instead of the add-button if hidden).", + "isDefault": false, + "name": "additionalActions", + }, { "description": "Displayed below the add button. Use it for additional information related to the attribute editor.", "isDefault": false, @@ -2960,6 +2973,7 @@ Instead, use \`onSelect\` in combination with the \`onChange\` handler only as a "file", "pause", "play", + "microphone", "remove", "copy", "menu", @@ -2974,8 +2988,8 @@ Instead, use \`onSelect\` in combination with the \`onChange\` handler only as a "ellipsis", "zoom-in", "zoom-out", - "download", "security", + "download", "edit", "add-plus", "anchor-link", @@ -3035,7 +3049,6 @@ Instead, use \`onSelect\` in combination with the \`onChange\` handler only as a "list-view", "location-pin", "lock-private", - "microphone", "microphone-off", "mini-player", "multiscreen", @@ -3057,6 +3070,7 @@ Instead, use \`onSelect\` in combination with the \`onChange\` handler only as a "status-positive", "status-stopped", "status-warning", + "stop-circle", "subtract-minus", "suggestions", "support", @@ -3363,6 +3377,13 @@ Note: Manual filtering doesn't disable match highlighting.", "optional": true, "type": "string", }, + { + "defaultValue": "false", + "description": "Defines whether entered text option is shown as the first option in the dropdown when value is non-empty.", + "name": "hideEnteredTextOption", + "optional": true, + "type": "boolean", + }, { "deprecatedTag": "The usage of the \`id\` attribute is reserved for internal use cases. For testing and other use cases, use [data attributes](https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes). If you must @@ -4115,8 +4136,8 @@ Use \`categorical\` for bar charts.", "name": "ScaleType", "type": "union", "values": [ - "linear", "time", + "linear", "log", "categorical", ], @@ -4374,16 +4395,16 @@ Sizes are automatically scaled down in compact mode. "name": "BoxProps.SpacingSize | BoxProps.Spacing", "type": "union", "values": [ - "s", - "m", - "n", - "xxxs", - "xxs", - "xs", - "l", - "xl", - "xxl", - "xxxl", + ""s"", + ""m"", + ""n"", + ""xxxs"", + ""xxs"", + ""xs"", + ""l"", + ""xl"", + ""xxl"", + ""xxxl"", "BoxProps.Spacing", ], }, @@ -4439,16 +4460,16 @@ Sizes are automatically scaled down in compact mode. "name": "BoxProps.SpacingSize | BoxProps.Spacing", "type": "union", "values": [ - "s", - "m", - "n", - "xxxs", - "xxs", - "xs", - "l", - "xl", - "xxl", - "xxxl", + ""s"", + ""m"", + ""n"", + ""xxxs"", + ""xxs"", + ""xs"", + ""l"", + ""xl"", + ""xxl"", + ""xxxl"", "BoxProps.Spacing", ], }, @@ -4946,6 +4967,7 @@ This property is ignored if you use a predefined icon or if you set your custom "file", "pause", "play", + "microphone", "remove", "copy", "menu", @@ -4960,8 +4982,8 @@ This property is ignored if you use a predefined icon or if you set your custom "ellipsis", "zoom-in", "zoom-out", - "download", "security", + "download", "edit", "add-plus", "anchor-link", @@ -5021,7 +5043,6 @@ This property is ignored if you use a predefined icon or if you set your custom "list-view", "location-pin", "lock-private", - "microphone", "microphone-off", "mini-player", "multiscreen", @@ -5043,6 +5064,7 @@ This property is ignored if you use a predefined icon or if you set your custom "status-positive", "status-stopped", "status-warning", + "stop-circle", "subtract-minus", "suggestions", "support", @@ -5616,6 +5638,7 @@ The following properties are supported across all types: ### action - \`href\` (string) - (Optional) Defines the target URL of the menu item, turning it into a link. +- \`download\` (boolean | string) - (Optional) Indicates that the link should be downloaded when clicked. Only works when \`href\` is also provided. If set to \`true\`, the browser will use the filename from the URL. If set to a string, that string will be used as the suggested filename. - \`external\` (boolean) - Marks a menu item as external by adding an icon after the menu item text. The link will open in a new tab when clicked. Note that this only works when \`href\` is also provided. - \`externalIconAriaLabel\` (string) - Adds an \`aria-label\` to the external icon. - \`iconName\` (string) - (Optional) Specifies the name of the icon, used with the [icon component](/components/icon/). @@ -5730,6 +5753,7 @@ The main action also supports the following properties of the [button](/componen "file", "pause", "play", + "microphone", "remove", "copy", "menu", @@ -5744,8 +5768,8 @@ The main action also supports the following properties of the [button](/componen "ellipsis", "zoom-in", "zoom-out", - "download", "security", + "download", "edit", "add-plus", "anchor-link", @@ -5805,7 +5829,6 @@ The main action also supports the following properties of the [button](/componen "list-view", "location-pin", "lock-private", - "microphone", "microphone-off", "mini-player", "multiscreen", @@ -5827,6 +5850,7 @@ The main action also supports the following properties of the [button](/componen "status-positive", "status-stopped", "status-warning", + "stop-circle", "subtract-minus", "suggestions", "support", @@ -7639,14 +7663,19 @@ is provided by its parent form field component.", "description": "Use this property to specify a different dynamic modal root for the dialog. The function will be called when a user clicks on the trigger button.", "inlineType": { - "name": "() => Promise", - "parameters": [], + "name": "(options: { abortSignal: AbortSignal; }) => Promise", + "parameters": [ + { + "name": "options", + "type": "{ abortSignal: AbortSignal; }", + }, + ], "returnType": "Promise", "type": "function", }, "name": "getModalRoot", "optional": true, - "type": "(() => Promise)", + "type": "((options: { abortSignal: AbortSignal; }) => Promise)", }, { "description": "An object containing all the necessary localized strings required by the component. @@ -7814,170 +7843,170 @@ For more info on custom languages, see the [Code editor API](/components/code-ed "name": "CodeEditorProps.Language", "type": "union", "values": [ - "stylus", - "mask", - "html", - "ruby", - "svg", - "text", - "json", - "red", - "space", - "dot", - "d", - "r", - "properties", - "abc", - "actionscript", - "c_cpp", - "clojure", - "coffee", - "csound_document", - "csound_orchestra", - "css", - "dart", - "diff", - "django", - "drools", - "edifact", - "erlang", - "fsl", - "gobstones", - "graphqlschema", - "haml", - "haskell", - "io", - "java", - "javascript", - "jsp", - "liquid", - "lsl", - "lua", - "makefile", - "markdown", - "maze", - "perl", - "php", - "python", - "razor", - "rst", - "sh", - "snippets", - "sql", - "sqlserver", - "tcl", - "tex", - "textile", - "velocity", - "wollok", - "slim", - "abap", - "ada", - "alda", - "apache_conf", - "apex", - "aql", - "asciidoc", - "asl", - "assembly_x86", - "autohotkey", - "batchfile", - "c9search", - "cirru", - "cobol", - "coldfusion", - "crystal", - "csharp", - "csound_score", - "curly", - "dockerfile", - "eiffel", - "ejs", - "elixir", - "elm", - "forth", - "fortran", - "fsharp", - "ftl", - "gcode", - "gherkin", - "gitignore", - "glsl", - "golang", - "groovy", - "handlebars", - "haskell_cabal", - "haxe", - "hjson", - "html_elixir", - "html_ruby", - "ini", - "jack", - "jade", - "json5", - "jsoniq", - "jssm", - "jsx", - "julia", - "kotlin", - "latex", - "less", - "lisp", - "livescript", - "logiql", - "luapage", - "lucene", - "matlab", - "mediawiki", - "mel", - "mixal", - "mushcode", - "mysql", - "nginx", - "nim", - "nix", - "nsis", - "nunjucks", - "objectivec", - "ocaml", - "pascal", - "perl6", - "pgsql", - "php_laravel_blade", - "pig", - "powershell", - "praat", - "prisma", - "prolog", - "protobuf", - "puppet", - "qml", - "rdoc", - "rhtml", - "rust", - "sass", - "scad", - "scala", - "scheme", - "scss", - "sjs", - "smarty", - "soy_template", - "swift", - "terraform", - "toml", - "tsx", - "twig", - "typescript", - "vala", - "vbscript", - "verilog", - "vhdl", - "visualforce", - "xml", - "xquery", - "yaml", - "zeek", + ""stylus"", + ""d"", + ""mask"", + ""r"", + ""html"", + ""ruby"", + ""svg"", + ""text"", + ""json"", + ""red"", + ""space"", + ""dot"", + ""properties"", + ""abc"", + ""actionscript"", + ""c_cpp"", + ""clojure"", + ""coffee"", + ""csound_document"", + ""csound_orchestra"", + ""css"", + ""dart"", + ""diff"", + ""django"", + ""drools"", + ""edifact"", + ""erlang"", + ""fsl"", + ""gobstones"", + ""graphqlschema"", + ""haml"", + ""haskell"", + ""io"", + ""java"", + ""javascript"", + ""jsp"", + ""liquid"", + ""lsl"", + ""lua"", + ""makefile"", + ""markdown"", + ""maze"", + ""perl"", + ""php"", + ""python"", + ""razor"", + ""rst"", + ""sh"", + ""snippets"", + ""sql"", + ""sqlserver"", + ""tcl"", + ""tex"", + ""textile"", + ""velocity"", + ""wollok"", + ""slim"", + ""abap"", + ""ada"", + ""alda"", + ""apache_conf"", + ""apex"", + ""aql"", + ""asciidoc"", + ""asl"", + ""assembly_x86"", + ""autohotkey"", + ""batchfile"", + ""c9search"", + ""cirru"", + ""cobol"", + ""coldfusion"", + ""crystal"", + ""csharp"", + ""csound_score"", + ""curly"", + ""dockerfile"", + ""eiffel"", + ""ejs"", + ""elixir"", + ""elm"", + ""forth"", + ""fortran"", + ""fsharp"", + ""ftl"", + ""gcode"", + ""gherkin"", + ""gitignore"", + ""glsl"", + ""golang"", + ""groovy"", + ""handlebars"", + ""haskell_cabal"", + ""haxe"", + ""hjson"", + ""html_elixir"", + ""html_ruby"", + ""ini"", + ""jack"", + ""jade"", + ""json5"", + ""jsoniq"", + ""jssm"", + ""jsx"", + ""julia"", + ""kotlin"", + ""latex"", + ""less"", + ""lisp"", + ""livescript"", + ""logiql"", + ""luapage"", + ""lucene"", + ""matlab"", + ""mediawiki"", + ""mel"", + ""mixal"", + ""mushcode"", + ""mysql"", + ""nginx"", + ""nim"", + ""nix"", + ""nsis"", + ""nunjucks"", + ""objectivec"", + ""ocaml"", + ""pascal"", + ""perl6"", + ""pgsql"", + ""php_laravel_blade"", + ""pig"", + ""powershell"", + ""praat"", + ""prisma"", + ""prolog"", + ""protobuf"", + ""puppet"", + ""qml"", + ""rdoc"", + ""rhtml"", + ""rust"", + ""sass"", + ""scad"", + ""scala"", + ""scheme"", + ""scss"", + ""sjs"", + ""smarty"", + ""soy_template"", + ""swift"", + ""terraform"", + ""toml"", + ""tsx"", + ""twig"", + ""typescript"", + ""vala"", + ""vbscript"", + ""verilog"", + ""vhdl"", + ""visualforce"", + ""xml"", + ""xquery"", + ""yaml"", + ""zeek"", "string & { _?: undefined; }", ], }, @@ -8081,11 +8110,11 @@ You can use any theme provided by Ace.", element after a user closes the dialog. The function receives the return value of the most recent getModalRoot call as an argument.", "inlineType": { - "name": "(rootElement: HTMLElement) => void", + "name": "(container: HTMLElement | null) => void", "parameters": [ { - "name": "rootElement", - "type": "HTMLElement", + "name": "container", + "type": "HTMLElement | null", }, ], "returnType": "void", @@ -8093,7 +8122,7 @@ of the most recent getModalRoot call as an argument.", }, "name": "removeModalRoot", "optional": true, - "type": "((rootElement: HTMLElement) => void)", + "type": "((container: HTMLElement | null) => void)", }, { "description": "List of Ace themes available for selection in preferences dialog. Make sure you include at least one light and at @@ -8537,14 +8566,19 @@ the custom content is displayed at the bottom of the left column within the moda "description": "Use this property to specify a different dynamic modal root for the dialog. The function will be called when a user clicks on the trigger button.", "inlineType": { - "name": "() => Promise", - "parameters": [], + "name": "(options: { abortSignal: AbortSignal; }) => Promise", + "parameters": [ + { + "name": "options", + "type": "{ abortSignal: AbortSignal; }", + }, + ], "returnType": "Promise", "type": "function", }, "name": "getModalRoot", "optional": true, - "type": "(() => Promise)", + "type": "((options: { abortSignal: AbortSignal; }) => Promise)", }, { "deprecatedTag": "The usage of the \`id\` attribute is reserved for internal use cases. For testing and other use cases, @@ -8684,11 +8718,11 @@ It contains the following: element after a user closes the dialog. The function receives the return value of the most recent getModalRoot call as an argument.", "inlineType": { - "name": "(rootElement: HTMLElement) => void", + "name": "(container: HTMLElement | null) => void", "parameters": [ { - "name": "rootElement", - "type": "HTMLElement", + "name": "container", + "type": "HTMLElement | null", }, ], "returnType": "void", @@ -8696,7 +8730,7 @@ of the most recent getModalRoot call as an argument.", }, "name": "removeModalRoot", "optional": true, - "type": "((rootElement: HTMLElement) => void)", + "type": "((container: HTMLElement | null) => void)", }, { "description": "Configures the sticky columns preference that can be set for both left and right columns. @@ -10863,6 +10897,28 @@ modifying the value. A read-only component can receive focus.", "optional": false, "type": "ReadonlyArray", }, + { + "description": "Specifies custom content to fully override the relative range tab. +When provided, all default relative range functionality is replaced.", + "inlineType": { + "name": "DateRangePickerProps.RelativeRangeControl", + "parameters": [ + { + "name": "selectedRange", + "type": "DateRangePickerProps.RelativeValue | null", + }, + { + "name": "setSelectedRange", + "type": "(value: DateRangePickerProps.RelativeValue) => void", + }, + ], + "returnType": "React.ReactNode", + "type": "function", + }, + "name": "renderRelativeRangeContent", + "optional": true, + "type": "DateRangePickerProps.RelativeRangeControl", + }, { "defaultValue": "true", "description": "Specifies whether the component should show a button that @@ -12687,10 +12743,10 @@ exports[`Components definition for form matches the snapshot: form 1`] = ` "name": "FlowType", "type": "union", "values": [ + "home", "create", "edit", "delete", - "home", "dashboard", "view-resource", ], @@ -13074,13 +13130,6 @@ exports[`Components definition for header matches the snapshot: header 1`] = ` "optional": true, "type": "string", }, - { - "description": "Specifies secondary text that's displayed to the right of the heading title. This is commonly used -to display resource counters in table and cards components.", - "name": "counter", - "optional": true, - "type": "string", - }, { "description": "Overrides the default [HTML heading tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements) provided by the variant. Using this property does not change the visual appearance of the component.", @@ -13144,6 +13193,12 @@ HTML heading tag based on the specified \`variant\` or \`headingTagOverride\`.", "isDefault": true, "name": "children", }, + { + "description": "Specifies secondary content that's displayed to the right of the heading title. This is commonly used +to display resource counters in table and cards components.", + "isDefault": false, + "name": "counter", + }, { "description": "Supplementary text below the heading.", "isDefault": false, @@ -13359,6 +13414,7 @@ use the \`id\` attribute, consider setting it on a parent element instead.", "file", "pause", "play", + "microphone", "remove", "copy", "menu", @@ -13373,8 +13429,8 @@ use the \`id\` attribute, consider setting it on a parent element instead.", "ellipsis", "zoom-in", "zoom-out", - "download", "security", + "download", "edit", "add-plus", "anchor-link", @@ -13434,7 +13490,6 @@ use the \`id\` attribute, consider setting it on a parent element instead.", "list-view", "location-pin", "lock-private", - "microphone", "microphone-off", "mini-player", "multiscreen", @@ -13456,6 +13511,7 @@ use the \`id\` attribute, consider setting it on a parent element instead.", "status-positive", "status-stopped", "status-warning", + "stop-circle", "subtract-minus", "suggestions", "support", @@ -14134,6 +14190,11 @@ The same applies to switching icons in the same configuration (for example, \`{' "optional": true, "type": "React.ReactNode", }, + { + "name": "stop-circle", + "optional": true, + "type": "React.ReactNode", + }, { "name": "subtract-minus", "optional": true, @@ -14587,13 +14648,13 @@ This value may not be supported by all browsers or devices.", "type": "union", "values": [ "search", + "decimal", "numeric", "none", "url", "text", - "decimal", - "tel", "email", + "tel", ], }, "name": "inputMode", @@ -14676,13 +14737,243 @@ including the date, month, week, time, datetime-local, number and range types.", "type": "union", "values": [ "number", - "any", + ""any"", ], }, "name": "step", "optional": true, "type": "InputProps.Step", }, + { + "inlineType": { + "name": "InputProps.Style", + "properties": [ + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "color", + "optional": true, + "type": "string", + }, + { + "name": "fontSize", + "optional": true, + "type": "string", + }, + { + "name": "fontStyle", + "optional": true, + "type": "string", + }, + { + "name": "fontWeight", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "placeholder", + "optional": true, + "type": "{ color?: string | undefined; fontSize?: string | undefined; fontStyle?: string | undefined; fontWeight?: string | undefined; }", + }, + { + "inlineType": { + "name": "object", + "properties": [ + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "default", + "optional": true, + "type": "string", + }, + { + "name": "disabled", + "optional": true, + "type": "string", + }, + { + "name": "focus", + "optional": true, + "type": "string", + }, + { + "name": "hover", + "optional": true, + "type": "string", + }, + { + "name": "readonly", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "backgroundColor", + "optional": true, + "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", + }, + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "default", + "optional": true, + "type": "string", + }, + { + "name": "disabled", + "optional": true, + "type": "string", + }, + { + "name": "focus", + "optional": true, + "type": "string", + }, + { + "name": "hover", + "optional": true, + "type": "string", + }, + { + "name": "readonly", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "borderColor", + "optional": true, + "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", + }, + { + "name": "borderRadius", + "optional": true, + "type": "string", + }, + { + "name": "borderWidth", + "optional": true, + "type": "string", + }, + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "default", + "optional": true, + "type": "string", + }, + { + "name": "disabled", + "optional": true, + "type": "string", + }, + { + "name": "focus", + "optional": true, + "type": "string", + }, + { + "name": "hover", + "optional": true, + "type": "string", + }, + { + "name": "readonly", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "boxShadow", + "optional": true, + "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", + }, + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "default", + "optional": true, + "type": "string", + }, + { + "name": "disabled", + "optional": true, + "type": "string", + }, + { + "name": "focus", + "optional": true, + "type": "string", + }, + { + "name": "hover", + "optional": true, + "type": "string", + }, + { + "name": "readonly", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "color", + "optional": true, + "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", + }, + { + "name": "fontSize", + "optional": true, + "type": "string", + }, + { + "name": "fontWeight", + "optional": true, + "type": "string", + }, + { + "name": "paddingBlock", + "optional": true, + "type": "string", + }, + { + "name": "paddingInline", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "root", + "optional": true, + "type": "{ backgroundColor?: { default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; } | undefined; ... 8 more ...; paddingInline?: string | undefined; }", + }, + ], + "type": "object", + }, + "name": "style", + "optional": true, + "systemTags": [ + "core", + ], + "type": "InputProps.Style", + }, { "defaultValue": "'text'", "description": "Specifies the type of control to render. @@ -15192,8 +15483,8 @@ When controlling this directly, make sure to update the value based on filtering "name": "ScaleType", "type": "union", "values": [ - "linear", "time", + "linear", "log", "categorical", ], @@ -16313,8 +16604,8 @@ Use \`categorical\` for charts with bars.", "name": "ScaleType", "type": "union", "values": [ - "linear", "time", + "linear", "log", "categorical", ], @@ -16459,10 +16750,10 @@ The event detail contains the \`reason\`, which can be any of the following: "name": "FlowType", "type": "union", "values": [ + "home", "create", "edit", "delete", - "home", "dashboard", "view-resource", ], @@ -16512,14 +16803,19 @@ The event detail contains the \`reason\`, which can be any of the following: "description": "Use this property to specify a different dynamic modal root for the dialog. The function will be called when a user clicks on the trigger button.", "inlineType": { - "name": "() => Promise", - "parameters": [], + "name": "(options: { abortSignal: AbortSignal; }) => Promise", + "parameters": [ + { + "name": "options", + "type": "{ abortSignal: AbortSignal; }", + }, + ], "returnType": "Promise", "type": "function", }, "name": "getModalRoot", "optional": true, - "type": "(() => Promise)", + "type": "((options: { abortSignal: AbortSignal; }) => Promise)", }, { "deprecatedTag": "The usage of the \`id\` attribute is reserved for internal use cases. For testing and other use cases, @@ -16543,11 +16839,11 @@ render to an element under \`document.body\`.", element after a user closes the dialog. The function receives the return value of the most recent getModalRoot call as an argument.", "inlineType": { - "name": "(rootElement: HTMLElement) => void", + "name": "(container: HTMLElement | null) => void", "parameters": [ { - "name": "rootElement", - "type": "HTMLElement", + "name": "container", + "type": "HTMLElement | null", }, ], "returnType": "void", @@ -16555,7 +16851,7 @@ of the most recent getModalRoot call as an argument.", }, "name": "removeModalRoot", "optional": true, - "type": "((rootElement: HTMLElement) => void)", + "type": "((container: HTMLElement | null) => void)", }, { "defaultValue": "'medium'", @@ -18104,6 +18400,88 @@ Add a button using the \`action\` property of the flashbar item instead.", "optional": true, "type": "string", }, + { + "inlineType": { + "name": "ProgressBarProps.Style", + "properties": [ + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "backgroundColor", + "optional": true, + "type": "string", + }, + { + "name": "borderRadius", + "optional": true, + "type": "string", + }, + { + "name": "height", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "progressBar", + "optional": true, + "type": "{ backgroundColor?: string | undefined; borderRadius?: string | undefined; height?: string | undefined; }", + }, + { + "inlineType": { + "name": "{ color?: string | undefined; fontSize?: string | undefined; fontWeight?: string | undefined; }", + "properties": [ + { + "name": "color", + "optional": true, + "type": "string", + }, + { + "name": "fontSize", + "optional": true, + "type": "string", + }, + { + "name": "fontWeight", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "progressPercentage", + "optional": true, + "type": "{ color?: string | undefined; fontSize?: string | undefined; fontWeight?: string | undefined; }", + }, + { + "inlineType": { + "name": "{ backgroundColor?: string | undefined; }", + "properties": [ + { + "name": "backgroundColor", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "progressValue", + "optional": true, + "type": "{ backgroundColor?: string | undefined; }", + }, + ], + "type": "object", + }, + "name": "style", + "optional": true, + "systemTags": [ + "core", + ], + "type": "ProgressBarProps.Style", + }, { "defaultValue": "0", "description": "Indicates the current progress as a percentage. The value must be between 0 and 100. Decimals are rounded.", @@ -18377,6 +18755,7 @@ This property is ignored if you use a predefined icon or if you set your custom "file", "pause", "play", + "microphone", "remove", "copy", "menu", @@ -18391,8 +18770,8 @@ This property is ignored if you use a predefined icon or if you set your custom "ellipsis", "zoom-in", "zoom-out", - "download", "security", + "download", "edit", "add-plus", "anchor-link", @@ -18452,7 +18831,6 @@ This property is ignored if you use a predefined icon or if you set your custom "list-view", "location-pin", "lock-private", - "microphone", "microphone-off", "mini-player", "multiscreen", @@ -18474,6 +18852,7 @@ This property is ignored if you use a predefined icon or if you set your custom "status-positive", "status-stopped", "status-warning", + "stop-circle", "subtract-minus", "suggestions", "support", @@ -18729,6 +19108,236 @@ inadvertently sending data (such as user passwords) to third parties.", "optional": true, "type": "boolean", }, + { + "inlineType": { + "name": "PromptInputProps.Style", + "properties": [ + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "color", + "optional": true, + "type": "string", + }, + { + "name": "fontSize", + "optional": true, + "type": "string", + }, + { + "name": "fontStyle", + "optional": true, + "type": "string", + }, + { + "name": "fontWeight", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "placeholder", + "optional": true, + "type": "{ color?: string | undefined; fontSize?: string | undefined; fontStyle?: string | undefined; fontWeight?: string | undefined; }", + }, + { + "inlineType": { + "name": "object", + "properties": [ + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "default", + "optional": true, + "type": "string", + }, + { + "name": "disabled", + "optional": true, + "type": "string", + }, + { + "name": "focus", + "optional": true, + "type": "string", + }, + { + "name": "hover", + "optional": true, + "type": "string", + }, + { + "name": "readonly", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "backgroundColor", + "optional": true, + "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", + }, + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "default", + "optional": true, + "type": "string", + }, + { + "name": "disabled", + "optional": true, + "type": "string", + }, + { + "name": "focus", + "optional": true, + "type": "string", + }, + { + "name": "hover", + "optional": true, + "type": "string", + }, + { + "name": "readonly", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "borderColor", + "optional": true, + "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", + }, + { + "name": "borderRadius", + "optional": true, + "type": "string", + }, + { + "name": "borderWidth", + "optional": true, + "type": "string", + }, + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "default", + "optional": true, + "type": "string", + }, + { + "name": "disabled", + "optional": true, + "type": "string", + }, + { + "name": "focus", + "optional": true, + "type": "string", + }, + { + "name": "hover", + "optional": true, + "type": "string", + }, + { + "name": "readonly", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "boxShadow", + "optional": true, + "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", + }, + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "default", + "optional": true, + "type": "string", + }, + { + "name": "disabled", + "optional": true, + "type": "string", + }, + { + "name": "focus", + "optional": true, + "type": "string", + }, + { + "name": "hover", + "optional": true, + "type": "string", + }, + { + "name": "readonly", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "color", + "optional": true, + "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", + }, + { + "name": "fontSize", + "optional": true, + "type": "string", + }, + { + "name": "fontWeight", + "optional": true, + "type": "string", + }, + { + "name": "paddingBlock", + "optional": true, + "type": "string", + }, + { + "name": "paddingInline", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "root", + "optional": true, + "type": "{ backgroundColor?: { default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; } | undefined; ... 8 more ...; paddingInline?: string | undefined; }", + }, + ], + "type": "object", + }, + "name": "style", + "optional": true, + "systemTags": [ + "core", + ], + "type": "PromptInputProps.Style", + }, { "description": "Specifies the text entered into the form element.", "name": "value", @@ -20025,6 +20634,16 @@ path of the selected resource and \`errorText\` that may contain a validation er "detailType": "S3ResourceSelectorProps.ChangeDetail", "name": "onChange", }, + { + "cancelable": false, + "description": "Called when input focus is removed from the S3 URI input.", + "name": "onInputBlur", + }, + { + "cancelable": false, + "description": "Called when input focus is moved to the S3 URI input.", + "name": "onInputFocus", + }, ], "functions": [ { @@ -20172,14 +20791,19 @@ The return type of the function should be a promise that resolves to a list of v "description": "Use this property to specify a different dynamic modal root for the dialog. The function will be called when a user clicks on the trigger button.", "inlineType": { - "name": "() => Promise", - "parameters": [], + "name": "(options: { abortSignal: AbortSignal; }) => Promise", + "parameters": [ + { + "name": "options", + "type": "{ abortSignal: AbortSignal; }", + }, + ], "returnType": "Promise", "type": "function", }, "name": "getModalRoot", "optional": true, - "type": "(() => Promise)", + "type": "((options: { abortSignal: AbortSignal; }) => Promise)", }, { "description": "An object containing all the necessary localized strings required by the component.", @@ -20738,11 +21362,11 @@ and 'Size'.", element after a user closes the dialog. The function receives the return value of the most recent getModalRoot call as an argument.", "inlineType": { - "name": "(rootElement: HTMLElement) => void", + "name": "(container: HTMLElement | null) => void", "parameters": [ { - "name": "rootElement", - "type": "HTMLElement", + "name": "container", + "type": "HTMLElement | null", }, ], "returnType": "void", @@ -20750,7 +21374,7 @@ of the most recent getModalRoot call as an argument.", }, "name": "removeModalRoot", "optional": true, - "type": "((rootElement: HTMLElement) => void)", + "type": "((container: HTMLElement | null) => void)", }, { "description": "The current selected resource. Resource has the following properties: @@ -20984,6 +21608,7 @@ The event \`detail\` contains the current \`selectedOption\`.", "file", "pause", "play", + "microphone", "remove", "copy", "menu", @@ -20998,8 +21623,8 @@ The event \`detail\` contains the current \`selectedOption\`.", "ellipsis", "zoom-in", "zoom-out", - "download", "security", + "download", "edit", "add-plus", "anchor-link", @@ -21059,7 +21684,6 @@ The event \`detail\` contains the current \`selectedOption\`.", "list-view", "location-pin", "lock-private", - "microphone", "microphone-off", "mini-player", "multiscreen", @@ -21081,6 +21705,7 @@ The event \`detail\` contains the current \`selectedOption\`.", "status-positive", "status-stopped", "status-warning", + "stop-circle", "subtract-minus", "suggestions", "support", @@ -21575,6 +22200,7 @@ If you want to clear the selection, use \`null\`.", "file", "pause", "play", + "microphone", "remove", "copy", "menu", @@ -21589,8 +22215,8 @@ If you want to clear the selection, use \`null\`.", "ellipsis", "zoom-in", "zoom-out", - "download", "security", + "download", "edit", "add-plus", "anchor-link", @@ -21650,7 +22276,6 @@ If you want to clear the selection, use \`null\`.", "list-view", "location-pin", "lock-private", - "microphone", "microphone-off", "mini-player", "multiscreen", @@ -21672,6 +22297,7 @@ If you want to clear the selection, use \`null\`.", "status-positive", "status-stopped", "status-warning", + "stop-circle", "subtract-minus", "suggestions", "support", @@ -22040,6 +22666,7 @@ Links are rendered as \`\` tags. The anchor also has the attributes \`target="_blank"\` and \`rel="noopener"\`. Additionally, the \`activeHref\` property won't be modified when a user chooses the link. - \`externalIconAriaLabel\` (string) - Adds an aria-label to the external icon. +Note: Deprecated, use i18nStrings.externalIconAriaLabel instead. - \`info\` (ReactNode) - Enables you to display content next to the link. Although it is technically possible to insert any content, our UX guidelines allow only to add a Badge and/or a "New" label. @@ -22850,6 +23477,48 @@ use the \`id\` attribute, consider setting it on a parent element instead.", "optional": true, "type": "string", }, + { + "description": "The visual orientation of the steps (vertical or horizontal). +By default the orientation is vertical.", + "inlineType": { + "name": "StepsProps.Orientation", + "type": "union", + "values": [ + "horizontal", + "vertical", + ], + }, + "name": "orientation", + "optional": true, + "systemTags": [ + "core", + ], + "type": "string", + }, + { + "description": "Render a step. This overrides the default icon, header, and details provided by the component. +The function is called for each step and should return an object with the following keys: +* \`header\` (React.ReactNode) - Summary corresponding to the step. +* \`details\` (React.ReactNode) - (Optional) Additional information corresponding to the step. +* \`icon\` (React.ReactNode) - (Optional) Replaces the standard step icon from the status indicator.", + "inlineType": { + "name": "(step: StepsProps.Step) => { header: React.ReactNode; details?: React.ReactNode; icon?: React.ReactNode; }", + "parameters": [ + { + "name": "step", + "type": "StepsProps.Step", + }, + ], + "returnType": "{ header: React.ReactNode; details?: React.ReactNode; icon?: React.ReactNode; }", + "type": "function", + }, + "name": "renderStep", + "optional": true, + "systemTags": [ + "core", + ], + "type": "((step: StepsProps.Step) => { header: React.ReactNode; details?: React.ReactNode; icon?: React.ReactNode; })", + }, { "description": "An array of individual steps @@ -25058,6 +25727,236 @@ inadvertently sending data (such as user passwords) to third parties.", "optional": true, "type": "boolean", }, + { + "inlineType": { + "name": "TextareaProps.Style", + "properties": [ + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "color", + "optional": true, + "type": "string", + }, + { + "name": "fontSize", + "optional": true, + "type": "string", + }, + { + "name": "fontStyle", + "optional": true, + "type": "string", + }, + { + "name": "fontWeight", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "placeholder", + "optional": true, + "type": "{ color?: string | undefined; fontSize?: string | undefined; fontStyle?: string | undefined; fontWeight?: string | undefined; }", + }, + { + "inlineType": { + "name": "object", + "properties": [ + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "default", + "optional": true, + "type": "string", + }, + { + "name": "disabled", + "optional": true, + "type": "string", + }, + { + "name": "focus", + "optional": true, + "type": "string", + }, + { + "name": "hover", + "optional": true, + "type": "string", + }, + { + "name": "readonly", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "backgroundColor", + "optional": true, + "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", + }, + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "default", + "optional": true, + "type": "string", + }, + { + "name": "disabled", + "optional": true, + "type": "string", + }, + { + "name": "focus", + "optional": true, + "type": "string", + }, + { + "name": "hover", + "optional": true, + "type": "string", + }, + { + "name": "readonly", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "borderColor", + "optional": true, + "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", + }, + { + "name": "borderRadius", + "optional": true, + "type": "string", + }, + { + "name": "borderWidth", + "optional": true, + "type": "string", + }, + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "default", + "optional": true, + "type": "string", + }, + { + "name": "disabled", + "optional": true, + "type": "string", + }, + { + "name": "focus", + "optional": true, + "type": "string", + }, + { + "name": "hover", + "optional": true, + "type": "string", + }, + { + "name": "readonly", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "boxShadow", + "optional": true, + "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", + }, + { + "inlineType": { + "name": "object", + "properties": [ + { + "name": "default", + "optional": true, + "type": "string", + }, + { + "name": "disabled", + "optional": true, + "type": "string", + }, + { + "name": "focus", + "optional": true, + "type": "string", + }, + { + "name": "hover", + "optional": true, + "type": "string", + }, + { + "name": "readonly", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "color", + "optional": true, + "type": "{ default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; }", + }, + { + "name": "fontSize", + "optional": true, + "type": "string", + }, + { + "name": "fontWeight", + "optional": true, + "type": "string", + }, + { + "name": "paddingBlock", + "optional": true, + "type": "string", + }, + { + "name": "paddingInline", + "optional": true, + "type": "string", + }, + ], + "type": "object", + }, + "name": "root", + "optional": true, + "type": "{ backgroundColor?: { default?: string | undefined; disabled?: string | undefined; focus?: string | undefined; hover?: string | undefined; readonly?: string | undefined; } | undefined; ... 8 more ...; paddingInline?: string | undefined; }", + }, + ], + "type": "object", + }, + "name": "style", + "optional": true, + "systemTags": [ + "core", + ], + "type": "TextareaProps.Style", + }, { "description": "Specifies the text entered into the form element.", "name": "value", @@ -25945,6 +26844,7 @@ If an href is provided, it opens the link in a new tab.", "file", "pause", "play", + "microphone", "remove", "copy", "menu", @@ -25959,8 +26859,8 @@ If an href is provided, it opens the link in a new tab.", "ellipsis", "zoom-in", "zoom-out", - "download", "security", + "download", "edit", "add-plus", "anchor-link", @@ -26020,7 +26920,6 @@ If an href is provided, it opens the link in a new tab.", "list-view", "location-pin", "lock-private", - "microphone", "microphone-off", "mini-player", "multiscreen", @@ -26042,6 +26941,7 @@ If an href is provided, it opens the link in a new tab.", "status-positive", "status-stopped", "status-warning", + "stop-circle", "subtract-minus", "suggestions", "support", @@ -26148,6 +27048,7 @@ We do not support using this attribute to apply custom styling.", "file", "pause", "play", + "microphone", "remove", "copy", "menu", @@ -26162,8 +27063,8 @@ We do not support using this attribute to apply custom styling.", "ellipsis", "zoom-in", "zoom-out", - "download", "security", + "download", "edit", "add-plus", "anchor-link", @@ -26223,7 +27124,6 @@ We do not support using this attribute to apply custom styling.", "list-view", "location-pin", "lock-private", - "microphone", "microphone-off", "mini-player", "multiscreen", @@ -26245,6 +27145,7 @@ We do not support using this attribute to apply custom styling.", "status-positive", "status-stopped", "status-warning", + "stop-circle", "subtract-minus", "suggestions", "support", @@ -26738,7 +27639,7 @@ use the \`id\` attribute, consider setting it on a parent element instead.", }, { "inlineType": { - "name": "CancelableEventHandler<{}>", + "name": "CancelableEventHandler", "parameters": [ { "name": "event", @@ -26750,7 +27651,7 @@ use the \`id\` attribute, consider setting it on a parent element instead.", }, "name": "onFollow", "optional": true, - "type": "CancelableEventHandler<{}>", + "type": "CancelableEventHandler", }, { "name": "title", @@ -26797,7 +27698,7 @@ The following properties are supported across all utility types: ### menu-dropdown * \`description\` (string) - The description displayed inside the dropdown. -* \`items\` (ButtonDropdownProps.Items) - An array of dropdown items. This follows the same structure as the \`items\` property of the [button dropdown component](/components/button-dropdown), with the exception of the checkbox item type. +* \`items\` (ButtonDropdownProps.Items) - An array of dropdown items. This follows the same structure as the \`items\` property of the [button dropdown component](/components/button-dropdown). * \`onItemClick\` (NonCancelableEventHandler) - Specifies the event handler called when a dropdown item is selected. * \`onItemFollow\` (NonCancelableEventHandler) - Specifies the event handler called when a dropdown item is selected without pressing modifier keys, and the item has an \`href\` set. * \`expandableGroups\` (boolean) - Controls expandability of the item groups.", @@ -27527,10 +28428,10 @@ Defaults to \`false\`.", "name": "FlowType", "type": "union", "values": [ + "home", "create", "edit", "delete", - "home", "dashboard", "view-resource", ], @@ -27738,6 +28639,14 @@ Use this if you need to wait for a response from the server before the user can }, ], "regions": [ + { + "description": "Specifies right-aligned custom primary actions for the wizard. Overwrites existing buttons (e.g. Cancel, Next, Finish).", + "isDefault": false, + "name": "customPrimaryActions", + "systemTags": [ + "core", + ], + }, { "description": "Specifies left-aligned secondary actions for the wizard. Use a button dropdown if multiple actions are required.", "isDefault": false, @@ -35148,6 +36057,37 @@ wrapper.clickSelectAll(); ], }, }, + { + "description": "Returns an inline token.", + "name": "findInlineToken", + "parameters": [ + { + "description": "1-based index of the inline token to return", + "flags": { + "isOptional": false, + }, + "name": "tokenIndex", + "typeName": "number", + }, + ], + "returnType": { + "isNullable": true, + "name": "TokenWrapper", + }, + }, + { + "name": "findInlineTokens", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "Array", + "typeArguments": [ + { + "name": "TokenWrapper", + }, + ], + }, + }, { "name": "findPlaceholder", "parameters": [], @@ -35381,6 +36321,81 @@ wrapper.selectOptionByValue('option_1'); ], "name": "TokenGroupItemWrapper", }, + { + "methods": [ + { + "description": "Returns the token description.", + "name": "findDescription", + "parameters": [], + "returnType": { + "isNullable": true, + "name": "ElementWrapper", + "typeArguments": [ + { + "name": "HTMLElement", + }, + ], + }, + }, + { + "description": "Returns the token dismiss button.", + "name": "findDismiss", + "parameters": [], + "returnType": { + "isNullable": true, + "name": "ElementWrapper", + "typeArguments": [ + { + "name": "HTMLElement", + }, + ], + }, + }, + { + "description": "Returns the token label.", + "name": "findLabel", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "ElementWrapper", + "typeArguments": [ + { + "name": "HTMLElement", + }, + ], + }, + }, + { + "description": "Returns the token label tag.", + "name": "findLabelTag", + "parameters": [], + "returnType": { + "isNullable": true, + "name": "ElementWrapper", + "typeArguments": [ + { + "name": "HTMLElement", + }, + ], + }, + }, + { + "description": "Returns the token tags.", + "name": "findTags", + "parameters": [], + "returnType": { + "isNullable": true, + "name": "Array", + "typeArguments": [ + { + "name": "ElementWrapper", + }, + ], + }, + }, + ], + "name": "TokenWrapper", + }, { "methods": [ { @@ -38133,81 +39148,6 @@ Returns the current value of the input.", ], "name": "TimeInputWrapper", }, - { - "methods": [ - { - "description": "Returns the token description.", - "name": "findDescription", - "parameters": [], - "returnType": { - "isNullable": true, - "name": "ElementWrapper", - "typeArguments": [ - { - "name": "HTMLElement", - }, - ], - }, - }, - { - "description": "Returns the token dismiss button.", - "name": "findDismiss", - "parameters": [], - "returnType": { - "isNullable": true, - "name": "ElementWrapper", - "typeArguments": [ - { - "name": "HTMLElement", - }, - ], - }, - }, - { - "description": "Returns the token label.", - "name": "findLabel", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "ElementWrapper", - "typeArguments": [ - { - "name": "HTMLElement", - }, - ], - }, - }, - { - "description": "Returns the token label tag.", - "name": "findLabelTag", - "parameters": [], - "returnType": { - "isNullable": true, - "name": "ElementWrapper", - "typeArguments": [ - { - "name": "HTMLElement", - }, - ], - }, - }, - { - "description": "Returns the token tags.", - "name": "findTags", - "parameters": [], - "returnType": { - "isNullable": true, - "name": "Array", - "typeArguments": [ - { - "name": "ElementWrapper", - }, - ], - }, - }, - ], - "name": "TokenWrapper", - }, { "methods": [ { @@ -44436,6 +45376,37 @@ The dismiss button is only rendered when the \`dismissible\` property is set to "name": "ElementWrapper", }, }, + { + "description": "Returns an inline token.", + "name": "findInlineToken", + "parameters": [ + { + "description": "1-based index of the inline token to return", + "flags": { + "isOptional": false, + }, + "name": "tokenIndex", + "typeName": "number", + }, + ], + "returnType": { + "isNullable": false, + "name": "TokenWrapper", + }, + }, + { + "name": "findInlineTokens", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "MultiElementWrapper", + "typeArguments": [ + { + "name": "TokenWrapper", + }, + ], + }, + }, { "name": "findPlaceholder", "parameters": [], @@ -44544,6 +45515,61 @@ The dismiss button is only rendered when the \`dismissible\` property is set to ], "name": "TokenGroupItemWrapper", }, + { + "methods": [ + { + "description": "Returns the token description.", + "name": "findDescription", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "ElementWrapper", + }, + }, + { + "description": "Returns the token dismiss button.", + "name": "findDismiss", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "ElementWrapper", + }, + }, + { + "description": "Returns the token label.", + "name": "findLabel", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "ElementWrapper", + }, + }, + { + "description": "Returns the token label tag.", + "name": "findLabelTag", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "ElementWrapper", + }, + }, + { + "description": "Returns the token tags.", + "name": "findTags", + "parameters": [], + "returnType": { + "isNullable": false, + "name": "MultiElementWrapper", + "typeArguments": [ + { + "name": "ElementWrapper", + }, + ], + }, + }, + ], + "name": "TokenWrapper", + }, { "methods": [ { @@ -46480,61 +47506,6 @@ To find a specific row use the \`findRow(n)\` function as chaining \`findRows(). ], "name": "TimeInputWrapper", }, - { - "methods": [ - { - "description": "Returns the token description.", - "name": "findDescription", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "ElementWrapper", - }, - }, - { - "description": "Returns the token dismiss button.", - "name": "findDismiss", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "ElementWrapper", - }, - }, - { - "description": "Returns the token label.", - "name": "findLabel", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "ElementWrapper", - }, - }, - { - "description": "Returns the token label tag.", - "name": "findLabelTag", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "ElementWrapper", - }, - }, - { - "description": "Returns the token tags.", - "name": "findTags", - "parameters": [], - "returnType": { - "isNullable": false, - "name": "MultiElementWrapper", - "typeArguments": [ - { - "name": "ElementWrapper", - }, - ], - }, - }, - ], - "name": "TokenWrapper", - }, { "methods": [ { diff --git a/src/__tests__/snapshot-tests/__snapshots__/test-utils-selectors.test.tsx.snap b/src/__tests__/snapshot-tests/__snapshots__/test-utils-selectors.test.tsx.snap index c46eb4c924..47986281f0 100644 --- a/src/__tests__/snapshot-tests/__snapshots__/test-utils-selectors.test.tsx.snap +++ b/src/__tests__/snapshot-tests/__snapshots__/test-utils-selectors.test.tsx.snap @@ -537,6 +537,7 @@ exports[`test-utils selectors 1`] = ` "select": [ "awsui_disabled-reason-tooltip_dwuol", "awsui_inline-label_dwuol", + "awsui_inline-token-list_dwuol", "awsui_placeholder_dwuol", "awsui_root_r2vco", ],