diff --git a/packages/react/src/components/Form/Form.stories.js b/packages/react/src/components/Form/Form.stories.js index ac7d51780a1f..b13468eb39c8 100644 --- a/packages/react/src/components/Form/Form.stories.js +++ b/packages/react/src/components/Form/Form.stories.js @@ -390,7 +390,7 @@ export const withAILabel = (args) => { labelText="Date Picker label" size="md" id="fluid-date-picker" - slug={aiLabel} + decorator={aiLabel} {...rest} /> @@ -544,7 +544,7 @@ withAILabel.argTypes = { type: 'boolean', }, table: { - category: 'Slug', + category: 'AILabel', }, }, }; diff --git a/packages/styles/scss/components/fluid-date-picker/_fluid-date-picker.scss b/packages/styles/scss/components/fluid-date-picker/_fluid-date-picker.scss index 6224b9503521..4a3532806eb4 100644 --- a/packages/styles/scss/components/fluid-date-picker/_fluid-date-picker.scss +++ b/packages/styles/scss/components/fluid-date-picker/_fluid-date-picker.scss @@ -399,7 +399,11 @@ border-inline-start-color: $border-subtle; } - // Slug styles + // AI Label styles + .#{$prefix}--date-picker--fluid + .#{$prefix}--date-picker-input__wrapper--decorator + .#{$prefix}--date-picker-input-inner-wrapper--decorator + > *, .#{$prefix}--date-picker--fluid .#{$prefix}--date-picker-input__wrapper--slug .#{$prefix}--ai-label, @@ -439,6 +443,15 @@ border-block-end-color: $ai-border-strong; } + .#{$prefix}--date-picker--fluid + .#{$prefix}--date-picker-input__wrapper--decorator + .#{$prefix}--date-picker__input, + .#{$prefix}--date-picker--fluid--invalid + .#{$prefix}--date-picker-input__wrapper--decorator + .#{$prefix}--date-picker__input, + .#{$prefix}--date-picker--fluid--warn + .#{$prefix}--date-picker-input__wrapper--decorator + .#{$prefix}--date-picker__input, .#{$prefix}--date-picker--fluid .#{$prefix}--date-picker-input__wrapper--slug .#{$prefix}--date-picker__input,