@cloudscape-design/components 3.0.693 → 3.0.695

package/select/parts/styles.scoped.css

@@ -94,16 +94,16 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_placeholder_dwuol_1bifm_97:not(#\9) {
+.awsui_placeholder_dwuol_117oy_97:not(#\9) {
   color: var(--color-text-input-placeholder-mx1ygd, #5f6b7a);
   font-style: italic;
 }
 
-.awsui_item_dwuol_1bifm_102:not(#\9) {
+.awsui_item_dwuol_117oy_102:not(#\9) {
   display: flex;
   align-items: center;
 }
-.awsui_item_dwuol_1bifm_102 > .awsui_checkbox_dwuol_1bifm_106:not(#\9) {
+.awsui_item_dwuol_117oy_102 > .awsui_checkbox_dwuol_117oy_106:not(#\9) {
   position: relative;
   min-block-size: var(--size-control-28i7hr, 16px);
   min-inline-size: var(--size-control-28i7hr, 16px);
@@ -112,43 +112,43 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-inline-end: var(--space-field-horizontal-gg19kw, 12px);
 }
 
-.awsui_filter_dwuol_1bifm_115:not(#\9) {
+.awsui_filter_dwuol_117oy_115:not(#\9) {
   z-index: 4;
   flex-shrink: 0;
 }
 
-.awsui_trigger_dwuol_1bifm_120:not(#\9) {
+.awsui_trigger_dwuol_117oy_120:not(#\9) {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
 
-.awsui_layout-strut_dwuol_1bifm_126:not(#\9) {
+.awsui_layout-strut_dwuol_117oy_126:not(#\9) {
   inline-size: 100%;
   position: relative;
   transform: translate3d(0, 0, 0);
 }
 
-.awsui_list-bottom_dwuol_1bifm_132:not(#\9) {
+.awsui_list-bottom_dwuol_117oy_132:not(#\9) {
   /* used in unit-tests */
 }
 
-.awsui_selected-icon_dwuol_1bifm_136:not(#\9) {
+.awsui_selected-icon_dwuol_117oy_136:not(#\9) {
   color: var(--color-border-item-focused-b2ntyl, #0972d3);
 }
 
-.awsui_show-label-tag_dwuol_1bifm_140 > .awsui_selected-icon_dwuol_1bifm_136:not(#\9) {
+.awsui_show-label-tag_dwuol_117oy_140 > .awsui_selected-icon_dwuol_117oy_136:not(#\9) {
   padding-inline-start: var(--space-scaled-s-aqzyko, 12px);
 }
 
-.awsui_inline-token-trigger_dwuol_1bifm_144:not(#\9) {
+.awsui_inline-token-trigger_dwuol_117oy_144:not(#\9) {
   display: flex;
   flex-wrap: nowrap;
   column-gap: var(--space-xxs-p8yyaw, 4px);
   inline-size: 100%;
 }
 
-.awsui_inline-token-list_dwuol_1bifm_151:not(#\9) {
+.awsui_inline-token-list_dwuol_117oy_151:not(#\9) {
   display: flex;
   flex-wrap: nowrap;
   align-items: center;
@@ -159,11 +159,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
           mask-image: linear-gradient(270deg, transparent, white 20px, white);
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
 }
-.awsui_inline-token-list_dwuol_1bifm_151:not(#\9):dir(rtl) {
+.awsui_inline-token-list_dwuol_117oy_151:not(#\9):dir(rtl) {
   -webkit-mask-image: linear-gradient(-270deg, transparent, white 20px, white);
           mask-image: linear-gradient(-270deg, transparent, white 20px, white);
 }
-.awsui_inline-token-list_dwuol_1bifm_151 > .awsui_inline-token_dwuol_1bifm_144:not(#\9) {
+.awsui_inline-token-list_dwuol_117oy_151 > .awsui_inline-token_dwuol_117oy_144:not(#\9) {
   display: flex;
   align-items: center;
   min-inline-size: max-content;
@@ -180,29 +180,63 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   color: var(--color-text-body-default-at06ol, #000716);
 }
 
-.awsui_visual-refresh_dwuol_1bifm_181 > .awsui_inline-token-list_dwuol_1bifm_151 > .awsui_inline-token_dwuol_1bifm_144:not(#\9) {
+.awsui_visual-refresh_dwuol_117oy_181 > .awsui_inline-token-list_dwuol_117oy_151 > .awsui_inline-token_dwuol_117oy_144:not(#\9) {
   border-start-start-radius: var(--border-radius-badge-0z09dt, 4px);
   border-start-end-radius: var(--border-radius-badge-0z09dt, 4px);
   border-end-start-radius: var(--border-radius-badge-0z09dt, 4px);
   border-end-end-radius: var(--border-radius-badge-0z09dt, 4px);
 }
 
-.awsui_inline-token-hidden-placeholder_dwuol_1bifm_188:not(#\9) {
+.awsui_inline-token-hidden-placeholder_dwuol_117oy_188:not(#\9) {
   position: absolute !important;
   inset-block-start: -9999px !important;
   inset-inline-start: -9999px !important;
 }
 
-.awsui_inline-token-counter_dwuol_1bifm_194:not(#\9) {
+.awsui_inline-token-counter_dwuol_117oy_194:not(#\9) {
   white-space: nowrap;
 }
 
-.awsui_inline-token-trigger--disabled_dwuol_1bifm_198 > .awsui_inline-token-list_dwuol_1bifm_151 > .awsui_inline-token_dwuol_1bifm_144:not(#\9) {
+.awsui_inline-token-trigger--disabled_dwuol_117oy_198 > .awsui_inline-token-list_dwuol_117oy_151 > .awsui_inline-token_dwuol_117oy_144:not(#\9) {
   border-color: var(--color-border-control-disabled-bv2kkn, #d1d5db);
   background-color: var(--color-background-container-content-4un1ap, #ffffff);
   color: var(--color-text-disabled-f4c52h, #9ba7b6);
 }
 
-.awsui_disabled-reason-tooltip_dwuol_1bifm_204:not(#\9) {
+.awsui_inline-label-trigger-wrapper_dwuol_117oy_204:not(#\9) {
+  margin-block-start: -7px;
+}
+
+.awsui_inline-label-wrapper_dwuol_117oy_208:not(#\9) {
+  margin-block-start: calc(var(--space-scaled-xs-26e2du, 8px) * -1);
+}
+
+.awsui_inline-label_dwuol_117oy_204:not(#\9) {
+  background-image: linear-gradient(to bottom, transparent calc(100% - (var(--border-field-width-09w7vk, 2px) + var(--border-control-focus-ring-shadow-spread-0ctpjf, 0px) + 5px)), var(--color-background-input-default-igdh5e, #ffffff) 1px);
+  background-position: bottom;
+  box-sizing: border-box;
+  display: inline-block;
+  color: var(--color-text-form-label-ktbzsd, #000716);
+  font-weight: var(--font-display-label-weight-815ja9, 700);
+  font-size: var(--font-size-body-s-asqx2i, 12px);
+  line-height: 14px;
+  letter-spacing: var(--letter-spacing-body-s-z9jkwp, 0.005em);
+  position: relative;
+  inset-inline-start: calc(var(--border-field-width-09w7vk, 2px) + var(--space-field-horizontal-gg19kw, 12px) - var(--space-scaled-xxs-7597g1, 4px));
+  margin-block-start: var(--space-scaled-xs-26e2du, 8px);
+  padding-block-end: 2px;
+  padding-inline: var(--space-scaled-xxs-7597g1, 4px);
+  max-inline-size: calc(100% - 2 * var(--space-field-horizontal-gg19kw, 12px));
+  z-index: 1;
+}
+.awsui_inline-label_dwuol_117oy_204.awsui_inline-label-disabled_dwuol_117oy_230:not(#\9) {
+  background: var(--color-background-container-header-8b9fgi, #ffffff);
+  border-start-start-radius: 2px;
+  border-start-end-radius: 2px;
+  border-end-start-radius: 2px;
+  border-end-end-radius: 2px;
+}
+
+.awsui_disabled-reason-tooltip_dwuol_117oy_238:not(#\9) {
   /* used in test-utils or tests */
 }

package/select/parts/styles.selectors.js

@@ -2,22 +2,26 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "placeholder": "awsui_placeholder_dwuol_1bifm_97",
-  "item": "awsui_item_dwuol_1bifm_102",
-  "checkbox": "awsui_checkbox_dwuol_1bifm_106",
-  "filter": "awsui_filter_dwuol_1bifm_115",
-  "trigger": "awsui_trigger_dwuol_1bifm_120",
-  "layout-strut": "awsui_layout-strut_dwuol_1bifm_126",
-  "list-bottom": "awsui_list-bottom_dwuol_1bifm_132",
-  "selected-icon": "awsui_selected-icon_dwuol_1bifm_136",
-  "show-label-tag": "awsui_show-label-tag_dwuol_1bifm_140",
-  "inline-token-trigger": "awsui_inline-token-trigger_dwuol_1bifm_144",
-  "inline-token-list": "awsui_inline-token-list_dwuol_1bifm_151",
-  "inline-token": "awsui_inline-token_dwuol_1bifm_144",
-  "visual-refresh": "awsui_visual-refresh_dwuol_1bifm_181",
-  "inline-token-hidden-placeholder": "awsui_inline-token-hidden-placeholder_dwuol_1bifm_188",
-  "inline-token-counter": "awsui_inline-token-counter_dwuol_1bifm_194",
-  "inline-token-trigger--disabled": "awsui_inline-token-trigger--disabled_dwuol_1bifm_198",
-  "disabled-reason-tooltip": "awsui_disabled-reason-tooltip_dwuol_1bifm_204"
+  "placeholder": "awsui_placeholder_dwuol_117oy_97",
+  "item": "awsui_item_dwuol_117oy_102",
+  "checkbox": "awsui_checkbox_dwuol_117oy_106",
+  "filter": "awsui_filter_dwuol_117oy_115",
+  "trigger": "awsui_trigger_dwuol_117oy_120",
+  "layout-strut": "awsui_layout-strut_dwuol_117oy_126",
+  "list-bottom": "awsui_list-bottom_dwuol_117oy_132",
+  "selected-icon": "awsui_selected-icon_dwuol_117oy_136",
+  "show-label-tag": "awsui_show-label-tag_dwuol_117oy_140",
+  "inline-token-trigger": "awsui_inline-token-trigger_dwuol_117oy_144",
+  "inline-token-list": "awsui_inline-token-list_dwuol_117oy_151",
+  "inline-token": "awsui_inline-token_dwuol_117oy_144",
+  "visual-refresh": "awsui_visual-refresh_dwuol_117oy_181",
+  "inline-token-hidden-placeholder": "awsui_inline-token-hidden-placeholder_dwuol_117oy_188",
+  "inline-token-counter": "awsui_inline-token-counter_dwuol_117oy_194",
+  "inline-token-trigger--disabled": "awsui_inline-token-trigger--disabled_dwuol_117oy_198",
+  "inline-label-trigger-wrapper": "awsui_inline-label-trigger-wrapper_dwuol_117oy_204",
+  "inline-label-wrapper": "awsui_inline-label-wrapper_dwuol_117oy_208",
+  "inline-label": "awsui_inline-label_dwuol_117oy_204",
+  "inline-label-disabled": "awsui_inline-label-disabled_dwuol_117oy_230",
+  "disabled-reason-tooltip": "awsui_disabled-reason-tooltip_dwuol_117oy_238"
 };
   

package/select/parts/trigger.d.ts

@@ -10,6 +10,7 @@ export interface TriggerProps extends FormFieldValidationControlProps {
     readOnly?: boolean;
     triggerProps: SelectTriggerProps;
     selectedOption: OptionDefinition | null;
+    inlineLabelText?: string;
     isOpen?: boolean;
     triggerVariant?: SelectProps.TriggerVariant | MultiselectProps.TriggerVariant;
     inFilteringToken?: boolean;

package/select/parts/trigger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"trigger.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/trigger.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,6CAA6C,CAAC;AAC/E,OAAO,EAAE,+BAA+B,EAAE,MAAM,2CAA2C,CAAC;AAK5F,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAIzD,MAAM,WAAW,YAAa,SAAQ,+BAA+B;IACnE,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,kBAAkB,CAAC;IACjC,cAAc,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACxC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,cAAc,CAAC,EAAE,WAAW,CAAC,cAAc,GAAG,gBAAgB,CAAC,cAAc,CAAC;IAC9E,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;CACnD;AAED,QAAA,MAAM,OAAO,wFAgGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"trigger.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/trigger.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,6CAA6C,CAAC;AAC/E,OAAO,EAAE,+BAA+B,EAAE,MAAM,2CAA2C,CAAC;AAK5F,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAIzD,MAAM,WAAW,YAAa,SAAQ,+BAA+B;IACnE,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,kBAAkB,CAAC;IACjC,cAAc,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACxC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,cAAc,CAAC,EAAE,WAAW,CAAC,cAAc,GAAG,gBAAgB,CAAC,cAAc,CAAC;IAC9E,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;CACnD;AAED,QAAA,MAAM,OAAO,wFAiHZ,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/select/parts/trigger.js

@@ -9,7 +9,7 @@ import { useUniqueId } from '../../internal/hooks/use-unique-id';
 import { useVisualRefresh } from '../../internal/hooks/use-visual-mode';
 import { joinStrings } from '../../internal/utils/strings';
 import styles from './styles.css.js';
-const Trigger = React.forwardRef(({ ariaLabelledby, ariaDescribedby, controlId, invalid, warning, triggerProps, selectedOption, selectedOptions, triggerVariant, inFilteringToken, isOpen, placeholder, disabled, readOnly, }, ref) => {
+const Trigger = React.forwardRef(({ ariaLabelledby, ariaDescribedby, controlId, invalid, inlineLabelText, warning, triggerProps, selectedOption, selectedOptions, triggerVariant, inFilteringToken, isOpen, placeholder, disabled, readOnly, }, ref) => {
     const isVisualRefresh = useVisualRefresh();
     const generatedId = useUniqueId();
     const id = controlId !== null && controlId !== void 0 ? controlId : generatedId;
@@ -42,7 +42,10 @@ const Trigger = React.forwardRef(({ ariaLabelledby, ariaDescribedby, controlId,
         triggerContent = (React.createElement("span", { id: triggerContentId, className: styles.trigger }, selectedOption.label || selectedOption.value));
     }
     const mergedRef = useMergeRefs(triggerProps.ref, ref);
-    return (React.createElement(ButtonTrigger, Object.assign({}, triggerProps, { id: id, ref: mergedRef, pressed: isOpen, disabled: disabled, readOnly: readOnly, invalid: invalid, warning: warning && !invalid, inFilteringToken: inFilteringToken, inlineTokens: triggerVariant === 'tokens', ariaDescribedby: ariaDescribedby, ariaLabelledby: ariaLabelledbyIds }), triggerContent));
+    const triggerButton = (React.createElement(ButtonTrigger, Object.assign({}, triggerProps, { id: id, ref: mergedRef, pressed: isOpen, disabled: disabled, readOnly: readOnly, invalid: invalid, warning: warning && !invalid, inFilteringToken: inFilteringToken, inlineTokens: triggerVariant === 'tokens', ariaDescribedby: ariaDescribedby, ariaLabelledby: ariaLabelledbyIds }), triggerContent));
+    return (React.createElement(React.Fragment, null, inlineLabelText ? (React.createElement("div", { className: styles['inline-label-wrapper'] },
+        React.createElement("label", { htmlFor: controlId, className: clsx(styles['inline-label'], disabled && styles['inline-label-disabled']) }, inlineLabelText),
+        React.createElement("div", { className: styles['inline-label-trigger-wrapper'] }, triggerButton))) : (React.createElement(React.Fragment, null, triggerButton))));
 });
 export default Trigger;
 //# sourceMappingURL=trigger.js.map

package/select/parts/trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"trigger.js","sourceRoot":"","sources":["../../../../src/select/parts/trigger.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport ButtonTrigger from '../../internal/components/button-trigger';\nimport Option from '../../internal/components/option';\nimport { OptionDefinition } from '../../internal/components/option/interfaces';\nimport { FormFieldValidationControlProps } from '../../internal/context/form-field-context';\nimport { useMergeRefs } from '../../internal/hooks/use-merge-refs';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../../internal/hooks/use-visual-mode';\nimport { joinStrings } from '../../internal/utils/strings';\nimport { MultiselectProps } from '../../multiselect/interfaces';\nimport { SelectProps } from '../interfaces';\nimport { SelectTriggerProps } from '../utils/use-select';\n\nimport styles from './styles.css.js';\n\nexport interface TriggerProps extends FormFieldValidationControlProps {\n  placeholder: string | undefined;\n  disabled: boolean | undefined;\n  readOnly?: boolean;\n  triggerProps: SelectTriggerProps;\n  selectedOption: OptionDefinition | null;\n  isOpen?: boolean;\n  triggerVariant?: SelectProps.TriggerVariant | MultiselectProps.TriggerVariant;\n  inFilteringToken?: boolean;\n  selectedOptions?: ReadonlyArray<OptionDefinition>;\n}\n\nconst Trigger = React.forwardRef(\n  (\n    {\n      ariaLabelledby,\n      ariaDescribedby,\n      controlId,\n      invalid,\n      warning,\n      triggerProps,\n      selectedOption,\n      selectedOptions,\n      triggerVariant,\n      inFilteringToken,\n      isOpen,\n      placeholder,\n      disabled,\n      readOnly,\n    }: TriggerProps,\n    ref: React.Ref<HTMLButtonElement>\n  ) => {\n    const isVisualRefresh = useVisualRefresh();\n    const generatedId = useUniqueId();\n    const id = controlId ?? generatedId;\n    const triggerContentId = useUniqueId('trigger-content-');\n\n    let ariaLabelledbyIds = joinStrings(ariaLabelledby, triggerContentId);\n\n    let triggerContent = null;\n    if (triggerVariant === 'tokens') {\n      if (selectedOptions?.length) {\n        triggerContent = (\n          <span\n            className={clsx(\n              styles['inline-token-trigger'],\n              disabled && styles['inline-token-trigger--disabled'],\n              isVisualRefresh && styles['visual-refresh']\n            )}\n          >\n            <span className={styles['inline-token-list']}>\n              {selectedOptions.map(({ label }, i) => (\n                <span key={i} className={styles['inline-token']}>\n                  {label}\n                </span>\n              ))}\n            </span>\n            <span className={styles['inline-token-counter']} id={triggerContentId}>\n              <span className={styles['inline-token-hidden-placeholder']}>{placeholder}</span>\n              <span>({selectedOptions.length})</span>\n            </span>\n          </span>\n        );\n        ariaLabelledbyIds = ariaLabelledby;\n      } else {\n        triggerContent = (\n          <span aria-disabled=\"true\" className={clsx(styles.placeholder, styles.trigger)} id={triggerContentId}>\n            {placeholder}\n          </span>\n        );\n      }\n    } else if (!selectedOption) {\n      triggerContent = (\n        <span aria-disabled=\"true\" className={clsx(styles.placeholder, styles.trigger)} id={triggerContentId}>\n          {placeholder}\n        </span>\n      );\n    } else if (triggerVariant === 'option') {\n      triggerContent = <Option id={triggerContentId} option={{ ...selectedOption, disabled }} triggerVariant={true} />;\n    } else {\n      triggerContent = (\n        <span id={triggerContentId} className={styles.trigger}>\n          {selectedOption.label || selectedOption.value}\n        </span>\n      );\n    }\n\n    const mergedRef = useMergeRefs(triggerProps.ref, ref);\n\n    return (\n      <ButtonTrigger\n        {...triggerProps}\n        id={id}\n        ref={mergedRef}\n        pressed={isOpen}\n        disabled={disabled}\n        readOnly={readOnly}\n        invalid={invalid}\n        warning={warning && !invalid}\n        inFilteringToken={inFilteringToken}\n        inlineTokens={triggerVariant === 'tokens'}\n        ariaDescribedby={ariaDescribedby}\n        ariaLabelledby={ariaLabelledbyIds}\n      >\n        {triggerContent}\n      </ButtonTrigger>\n    );\n  }\n);\n\nexport default Trigger;\n"]}
+{"version":3,"file":"trigger.js","sourceRoot":"","sources":["../../../../src/select/parts/trigger.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport ButtonTrigger from '../../internal/components/button-trigger';\nimport Option from '../../internal/components/option';\nimport { OptionDefinition } from '../../internal/components/option/interfaces';\nimport { FormFieldValidationControlProps } from '../../internal/context/form-field-context';\nimport { useMergeRefs } from '../../internal/hooks/use-merge-refs';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../../internal/hooks/use-visual-mode';\nimport { joinStrings } from '../../internal/utils/strings';\nimport { MultiselectProps } from '../../multiselect/interfaces';\nimport { SelectProps } from '../interfaces';\nimport { SelectTriggerProps } from '../utils/use-select';\n\nimport styles from './styles.css.js';\n\nexport interface TriggerProps extends FormFieldValidationControlProps {\n  placeholder: string | undefined;\n  disabled: boolean | undefined;\n  readOnly?: boolean;\n  triggerProps: SelectTriggerProps;\n  selectedOption: OptionDefinition | null;\n  inlineLabelText?: string;\n  isOpen?: boolean;\n  triggerVariant?: SelectProps.TriggerVariant | MultiselectProps.TriggerVariant;\n  inFilteringToken?: boolean;\n  selectedOptions?: ReadonlyArray<OptionDefinition>;\n}\n\nconst Trigger = React.forwardRef(\n  (\n    {\n      ariaLabelledby,\n      ariaDescribedby,\n      controlId,\n      invalid,\n      inlineLabelText,\n      warning,\n      triggerProps,\n      selectedOption,\n      selectedOptions,\n      triggerVariant,\n      inFilteringToken,\n      isOpen,\n      placeholder,\n      disabled,\n      readOnly,\n    }: TriggerProps,\n    ref: React.Ref<HTMLButtonElement>\n  ) => {\n    const isVisualRefresh = useVisualRefresh();\n    const generatedId = useUniqueId();\n    const id = controlId ?? generatedId;\n    const triggerContentId = useUniqueId('trigger-content-');\n\n    let ariaLabelledbyIds = joinStrings(ariaLabelledby, triggerContentId);\n\n    let triggerContent = null;\n    if (triggerVariant === 'tokens') {\n      if (selectedOptions?.length) {\n        triggerContent = (\n          <span\n            className={clsx(\n              styles['inline-token-trigger'],\n              disabled && styles['inline-token-trigger--disabled'],\n              isVisualRefresh && styles['visual-refresh']\n            )}\n          >\n            <span className={styles['inline-token-list']}>\n              {selectedOptions.map(({ label }, i) => (\n                <span key={i} className={styles['inline-token']}>\n                  {label}\n                </span>\n              ))}\n            </span>\n            <span className={styles['inline-token-counter']} id={triggerContentId}>\n              <span className={styles['inline-token-hidden-placeholder']}>{placeholder}</span>\n              <span>({selectedOptions.length})</span>\n            </span>\n          </span>\n        );\n        ariaLabelledbyIds = ariaLabelledby;\n      } else {\n        triggerContent = (\n          <span aria-disabled=\"true\" className={clsx(styles.placeholder, styles.trigger)} id={triggerContentId}>\n            {placeholder}\n          </span>\n        );\n      }\n    } else if (!selectedOption) {\n      triggerContent = (\n        <span aria-disabled=\"true\" className={clsx(styles.placeholder, styles.trigger)} id={triggerContentId}>\n          {placeholder}\n        </span>\n      );\n    } else if (triggerVariant === 'option') {\n      triggerContent = <Option id={triggerContentId} option={{ ...selectedOption, disabled }} triggerVariant={true} />;\n    } else {\n      triggerContent = (\n        <span id={triggerContentId} className={styles.trigger}>\n          {selectedOption.label || selectedOption.value}\n        </span>\n      );\n    }\n\n    const mergedRef = useMergeRefs(triggerProps.ref, ref);\n    const triggerButton = (\n      <ButtonTrigger\n        {...triggerProps}\n        id={id}\n        ref={mergedRef}\n        pressed={isOpen}\n        disabled={disabled}\n        readOnly={readOnly}\n        invalid={invalid}\n        warning={warning && !invalid}\n        inFilteringToken={inFilteringToken}\n        inlineTokens={triggerVariant === 'tokens'}\n        ariaDescribedby={ariaDescribedby}\n        ariaLabelledby={ariaLabelledbyIds}\n      >\n        {triggerContent}\n      </ButtonTrigger>\n    );\n    return (\n      <>\n        {inlineLabelText ? (\n          <div className={styles['inline-label-wrapper']}>\n            <label\n              htmlFor={controlId}\n              className={clsx(styles['inline-label'], disabled && styles['inline-label-disabled'])}\n            >\n              {inlineLabelText}\n            </label>\n            <div className={styles['inline-label-trigger-wrapper']}>{triggerButton}</div>\n          </div>\n        ) : (\n          <>{triggerButton}</>\n        )}\n      </>\n    );\n  }\n);\n\nexport default Trigger;\n"]}

package/side-navigation/implementation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/side-navigation/implementation.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAMnD,MAAM,MAAM,2BAA2B,GAAG,mBAAmB,GAAG,0BAA0B,CAAC;AAE3F,wBAAgB,4BAA4B,CAAC,EAC3C,MAAM,EACN,UAAU,EACV,KAAU,EACV,QAAQ,EACR,QAAQ,EACR,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,2BAA2B,eAmD7B;AAED,eAAO,MAAM,8BAA8B,mGAA0D,CAAC"}
+{"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/side-navigation/implementation.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAMnD,MAAM,MAAM,2BAA2B,GAAG,mBAAmB,GAAG,0BAA0B,CAAC;AAE3F,wBAAgB,4BAA4B,CAAC,EAC3C,MAAM,EACN,UAAU,EACV,KAAU,EACV,QAAQ,EACR,QAAQ,EACR,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,2BAA2B,eAwD7B;AAED,eAAO,MAAM,8BAA8B,mGAA0D,CAAC"}

package/side-navigation/implementation.js

@@ -3,6 +3,7 @@ import { __rest } from "tslib";
 // SPDX-License-Identifier: Apache-2.0
 import React, { useCallback, useEffect, useMemo } from 'react';
 import clsx from 'clsx';
+import { getGlobalFlag } from '@cloudscape-design/component-toolkit/internal';
 import { getBaseProps } from '../internal/base-component';
 import { fireCancelableEvent, fireNonCancelableEvent } from '../internal/events';
 import { isDevelopment } from '../internal/is-development';
@@ -14,6 +15,7 @@ export function SideNavigationImplementation(_a) {
     var { header, activeHref, items = [], onFollow, onChange, __internalRootRef } = _a, props = __rest(_a, ["header", "activeHref", "items", "onFollow", "onChange", "__internalRootRef"]);
     const baseProps = getBaseProps(props);
     const parentMap = useMemo(() => generateExpandableItemsMapping(items), [items]);
+    const hasToolbar = getGlobalFlag('appLayoutWidget');
     if (isDevelopment) {
         // This code should be wiped in production anyway.
         // eslint-disable-next-line react-hooks/rules-of-hooks
@@ -27,7 +29,7 @@ export function SideNavigationImplementation(_a) {
     const onFollowHandler = useCallback((item, sourceEvent) => {
         fireCancelableEvent(onFollow, item, sourceEvent);
     }, [onFollow]);
-    return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(styles.root, baseProps.className), ref: __internalRootRef }),
+    return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(styles.root, baseProps.className, hasToolbar && styles['with-toolbar']), ref: __internalRootRef }),
         header && (React.createElement(Header, { definition: header, activeHref: activeHref, fireChange: onChangeHandler, fireFollow: onFollowHandler })),
         items && (React.createElement("div", { className: styles['list-container'] },
             React.createElement(NavigationItemsList, { variant: "root", items: items, fireFollow: onFollowHandler, fireChange: onChangeHandler, activeHref: activeHref })))));

package/side-navigation/implementation.js.map

@@ -1 +1 @@
-{"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/side-navigation/implementation.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAEjF,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAEhE,OAAO,EAAE,MAAM,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AACtD,OAAO,EAAE,mBAAmB,EAAE,8BAA8B,EAAE,MAAM,QAAQ,CAAC;AAE7E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,UAAU,4BAA4B,CAAC,EAQf;QARe,EAC3C,MAAM,EACN,UAAU,EACV,KAAK,GAAG,EAAE,EACV,QAAQ,EACR,QAAQ,EACR,iBAAiB,OAEW,EADzB,KAAK,cAPmC,8EAQ5C,CADS;IAER,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,MAAM,SAAS,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,8BAA8B,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEhF,IAAI,aAAa,EAAE;QACjB,kDAAkD;QAClD,sDAAsD;QACtD,SAAS,CAAC,GAAG,EAAE,CAAC,mBAAmB,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;KACtD;IAED,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,IAA2E,EAAE,QAAiB,EAAE,EAAE;QACjG,wGAAwG;QACxG,oEAAoE;QACpE,sBAAsB,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,iBAAiB,EAAE,SAAS,CAAC,GAAG,CAAC,IAAI,CAAE,EAAE,CAAC,CAAC;IAC1G,CAAC,EACD,CAAC,QAAQ,EAAE,SAAS,CAAC,CACtB,CAAC;IAEF,MAAM,eAAe,GAAG,WAAW,CACjC,CACE,IAI2C,EAC3C,WAAyC,EACzC,EAAE;QACF,mBAAmB,CAAC,QAAQ,EAAE,IAAI,EAAE,WAAW,CAAC,CAAC;IACnD,CAAC,EACD,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,OAAO,CACL,6CAAS,SAAS,IAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC,EAAE,GAAG,EAAE,iBAAiB;QAC1F,MAAM,IAAI,CACT,oBAAC,MAAM,IAAC,UAAU,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,eAAe,EAAE,UAAU,EAAE,eAAe,GAAI,CACjH;QACA,KAAK,IAAI,CACR,6BAAK,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC;YACtC,oBAAC,mBAAmB,IAClB,OAAO,EAAC,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,eAAe,EAC3B,UAAU,EAAE,eAAe,EAC3B,UAAU,EAAE,UAAU,GACtB,CACE,CACP,CACG,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,8BAA8B,GAAG,yBAAyB,CAAC,4BAA4B,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useMemo } from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { fireCancelableEvent, fireNonCancelableEvent } from '../internal/events';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { isDevelopment } from '../internal/is-development';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport { SideNavigationProps } from './interfaces';\nimport { Header, NavigationItemsList } from './parts';\nimport { checkDuplicateHrefs, generateExpandableItemsMapping } from './util';\n\nimport styles from './styles.css.js';\n\nexport type SideNavigationInternalProps = SideNavigationProps & InternalBaseComponentProps;\n\nexport function SideNavigationImplementation({\n  header,\n  activeHref,\n  items = [],\n  onFollow,\n  onChange,\n  __internalRootRef,\n  ...props\n}: SideNavigationInternalProps) {\n  const baseProps = getBaseProps(props);\n  const parentMap = useMemo(() => generateExpandableItemsMapping(items), [items]);\n\n  if (isDevelopment) {\n    // This code should be wiped in production anyway.\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    useEffect(() => checkDuplicateHrefs(items), [items]);\n  }\n\n  const onChangeHandler = useCallback(\n    (item: SideNavigationProps.Section | SideNavigationProps.ExpandableLinkGroup, expanded: boolean) => {\n      // generateExpandableItemsMapping walks through the entire tree, so we're certain about getting a value.\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n      fireNonCancelableEvent(onChange, { item, expanded: expanded, expandableParents: parentMap.get(item)! });\n    },\n    [onChange, parentMap]\n  );\n\n  const onFollowHandler = useCallback(\n    (\n      item:\n        | SideNavigationProps.Link\n        | SideNavigationProps.Header\n        | SideNavigationProps.LinkGroup\n        | SideNavigationProps.ExpandableLinkGroup,\n      sourceEvent: React.SyntheticEvent | Event\n    ) => {\n      fireCancelableEvent(onFollow, item, sourceEvent);\n    },\n    [onFollow]\n  );\n\n  return (\n    <div {...baseProps} className={clsx(styles.root, baseProps.className)} ref={__internalRootRef}>\n      {header && (\n        <Header definition={header} activeHref={activeHref} fireChange={onChangeHandler} fireFollow={onFollowHandler} />\n      )}\n      {items && (\n        <div className={styles['list-container']}>\n          <NavigationItemsList\n            variant=\"root\"\n            items={items}\n            fireFollow={onFollowHandler}\n            fireChange={onChangeHandler}\n            activeHref={activeHref}\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport const createWidgetizedSideNavigation = createWidgetizedComponent(SideNavigationImplementation);\n"]}
+{"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/side-navigation/implementation.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,aAAa,EAAE,MAAM,+CAA+C,CAAC;AAE9E,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAEjF,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAEhE,OAAO,EAAE,MAAM,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AACtD,OAAO,EAAE,mBAAmB,EAAE,8BAA8B,EAAE,MAAM,QAAQ,CAAC;AAE7E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,UAAU,4BAA4B,CAAC,EAQf;QARe,EAC3C,MAAM,EACN,UAAU,EACV,KAAK,GAAG,EAAE,EACV,QAAQ,EACR,QAAQ,EACR,iBAAiB,OAEW,EADzB,KAAK,cAPmC,8EAQ5C,CADS;IAER,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,MAAM,SAAS,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,8BAA8B,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAChF,MAAM,UAAU,GAAG,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAEpD,IAAI,aAAa,EAAE;QACjB,kDAAkD;QAClD,sDAAsD;QACtD,SAAS,CAAC,GAAG,EAAE,CAAC,mBAAmB,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;KACtD;IAED,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,IAA2E,EAAE,QAAiB,EAAE,EAAE;QACjG,wGAAwG;QACxG,oEAAoE;QACpE,sBAAsB,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,iBAAiB,EAAE,SAAS,CAAC,GAAG,CAAC,IAAI,CAAE,EAAE,CAAC,CAAC;IAC1G,CAAC,EACD,CAAC,QAAQ,EAAE,SAAS,CAAC,CACtB,CAAC;IAEF,MAAM,eAAe,GAAG,WAAW,CACjC,CACE,IAI2C,EAC3C,WAAyC,EACzC,EAAE;QACF,mBAAmB,CAAC,QAAQ,EAAE,IAAI,EAAE,WAAW,CAAC,CAAC;IACnD,CAAC,EACD,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,EAAE,UAAU,IAAI,MAAM,CAAC,cAAc,CAAC,CAAC,EACvF,GAAG,EAAE,iBAAiB;QAErB,MAAM,IAAI,CACT,oBAAC,MAAM,IAAC,UAAU,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,eAAe,EAAE,UAAU,EAAE,eAAe,GAAI,CACjH;QACA,KAAK,IAAI,CACR,6BAAK,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC;YACtC,oBAAC,mBAAmB,IAClB,OAAO,EAAC,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,eAAe,EAC3B,UAAU,EAAE,eAAe,EAC3B,UAAU,EAAE,UAAU,GACtB,CACE,CACP,CACG,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,8BAA8B,GAAG,yBAAyB,CAAC,4BAA4B,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useMemo } from 'react';\nimport clsx from 'clsx';\n\nimport { getGlobalFlag } from '@cloudscape-design/component-toolkit/internal';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { fireCancelableEvent, fireNonCancelableEvent } from '../internal/events';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { isDevelopment } from '../internal/is-development';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport { SideNavigationProps } from './interfaces';\nimport { Header, NavigationItemsList } from './parts';\nimport { checkDuplicateHrefs, generateExpandableItemsMapping } from './util';\n\nimport styles from './styles.css.js';\n\nexport type SideNavigationInternalProps = SideNavigationProps & InternalBaseComponentProps;\n\nexport function SideNavigationImplementation({\n  header,\n  activeHref,\n  items = [],\n  onFollow,\n  onChange,\n  __internalRootRef,\n  ...props\n}: SideNavigationInternalProps) {\n  const baseProps = getBaseProps(props);\n  const parentMap = useMemo(() => generateExpandableItemsMapping(items), [items]);\n  const hasToolbar = getGlobalFlag('appLayoutWidget');\n\n  if (isDevelopment) {\n    // This code should be wiped in production anyway.\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    useEffect(() => checkDuplicateHrefs(items), [items]);\n  }\n\n  const onChangeHandler = useCallback(\n    (item: SideNavigationProps.Section | SideNavigationProps.ExpandableLinkGroup, expanded: boolean) => {\n      // generateExpandableItemsMapping walks through the entire tree, so we're certain about getting a value.\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n      fireNonCancelableEvent(onChange, { item, expanded: expanded, expandableParents: parentMap.get(item)! });\n    },\n    [onChange, parentMap]\n  );\n\n  const onFollowHandler = useCallback(\n    (\n      item:\n        | SideNavigationProps.Link\n        | SideNavigationProps.Header\n        | SideNavigationProps.LinkGroup\n        | SideNavigationProps.ExpandableLinkGroup,\n      sourceEvent: React.SyntheticEvent | Event\n    ) => {\n      fireCancelableEvent(onFollow, item, sourceEvent);\n    },\n    [onFollow]\n  );\n\n  return (\n    <div\n      {...baseProps}\n      className={clsx(styles.root, baseProps.className, hasToolbar && styles['with-toolbar'])}\n      ref={__internalRootRef}\n    >\n      {header && (\n        <Header definition={header} activeHref={activeHref} fireChange={onChangeHandler} fireFollow={onFollowHandler} />\n      )}\n      {items && (\n        <div className={styles['list-container']}>\n          <NavigationItemsList\n            variant=\"root\"\n            items={items}\n            fireFollow={onFollowHandler}\n            fireChange={onChangeHandler}\n            activeHref={activeHref}\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport const createWidgetizedSideNavigation = createWidgetizedComponent(SideNavigationImplementation);\n"]}

package/side-navigation/styles.css.js

@@ -1,33 +1,34 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_l0dv0_1s9d7_97",
-  "header": "awsui_header_l0dv0_1s9d7_134",
-  "header-link": "awsui_header-link_l0dv0_1s9d7_147",
-  "header-link--has-logo": "awsui_header-link--has-logo_l0dv0_1s9d7_157",
-  "header-link-text": "awsui_header-link-text_l0dv0_1s9d7_157",
-  "header-logo": "awsui_header-logo_l0dv0_1s9d7_162",
-  "header-logo--stretched": "awsui_header-logo--stretched_l0dv0_1s9d7_168",
-  "list-container": "awsui_list-container_l0dv0_1s9d7_173",
-  "list": "awsui_list_l0dv0_1s9d7_173",
-  "list-variant-root": "awsui_list-variant-root_l0dv0_1s9d7_185",
-  "list-variant-root--last": "awsui_list-variant-root--last_l0dv0_1s9d7_192",
-  "list-variant-expandable-link-group": "awsui_list-variant-expandable-link-group_l0dv0_1s9d7_196",
-  "list-item": "awsui_list-item_l0dv0_1s9d7_200",
-  "section": "awsui_section_l0dv0_1s9d7_208",
-  "expandable-link-group": "awsui_expandable-link-group_l0dv0_1s9d7_209",
-  "section--no-ident": "awsui_section--no-ident_l0dv0_1s9d7_212",
-  "expandable-link-group--no-ident": "awsui_expandable-link-group--no-ident_l0dv0_1s9d7_213",
-  "refresh": "awsui_refresh_l0dv0_1s9d7_221",
-  "list-variant-section-group": "awsui_list-variant-section-group_l0dv0_1s9d7_229",
-  "section-group": "awsui_section-group_l0dv0_1s9d7_236",
-  "section-group-title": "awsui_section-group-title_l0dv0_1s9d7_247",
-  "link": "awsui_link_l0dv0_1s9d7_251",
-  "link-active": "awsui_link-active_l0dv0_1s9d7_260",
-  "info": "awsui_info_l0dv0_1s9d7_297",
-  "external-icon": "awsui_external-icon_l0dv0_1s9d7_301",
-  "divider": "awsui_divider_l0dv0_1s9d7_305",
-  "divider-default": "awsui_divider-default_l0dv0_1s9d7_310",
-  "divider-header": "awsui_divider-header_l0dv0_1s9d7_316"
+  "root": "awsui_root_l0dv0_lk9xb_97",
+  "header": "awsui_header_l0dv0_lk9xb_134",
+  "with-toolbar": "awsui_with-toolbar_l0dv0_lk9xb_146",
+  "header-link": "awsui_header-link_l0dv0_lk9xb_150",
+  "header-link--has-logo": "awsui_header-link--has-logo_l0dv0_lk9xb_160",
+  "header-link-text": "awsui_header-link-text_l0dv0_lk9xb_160",
+  "header-logo": "awsui_header-logo_l0dv0_lk9xb_165",
+  "header-logo--stretched": "awsui_header-logo--stretched_l0dv0_lk9xb_171",
+  "list-container": "awsui_list-container_l0dv0_lk9xb_176",
+  "list": "awsui_list_l0dv0_lk9xb_176",
+  "list-variant-root": "awsui_list-variant-root_l0dv0_lk9xb_191",
+  "list-variant-root--last": "awsui_list-variant-root--last_l0dv0_lk9xb_198",
+  "list-variant-expandable-link-group": "awsui_list-variant-expandable-link-group_l0dv0_lk9xb_202",
+  "list-item": "awsui_list-item_l0dv0_lk9xb_206",
+  "section": "awsui_section_l0dv0_lk9xb_214",
+  "expandable-link-group": "awsui_expandable-link-group_l0dv0_lk9xb_215",
+  "section--no-ident": "awsui_section--no-ident_l0dv0_lk9xb_218",
+  "expandable-link-group--no-ident": "awsui_expandable-link-group--no-ident_l0dv0_lk9xb_219",
+  "refresh": "awsui_refresh_l0dv0_lk9xb_227",
+  "list-variant-section-group": "awsui_list-variant-section-group_l0dv0_lk9xb_235",
+  "section-group": "awsui_section-group_l0dv0_lk9xb_242",
+  "section-group-title": "awsui_section-group-title_l0dv0_lk9xb_253",
+  "link": "awsui_link_l0dv0_lk9xb_257",
+  "link-active": "awsui_link-active_l0dv0_lk9xb_266",
+  "info": "awsui_info_l0dv0_lk9xb_303",
+  "external-icon": "awsui_external-icon_l0dv0_lk9xb_307",
+  "divider": "awsui_divider_l0dv0_lk9xb_311",
+  "divider-default": "awsui_divider-default_l0dv0_lk9xb_316",
+  "divider-header": "awsui_divider-header_l0dv0_lk9xb_322"
 };
   

package/side-navigation/styles.scoped.css

@@ -94,7 +94,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_root_l0dv0_1s9d7_97:not(#\9) {
+.awsui_root_l0dv0_lk9xb_97:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -132,7 +132,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   word-break: break-word;
 }
 
-.awsui_header_l0dv0_1s9d7_134:not(#\9) {
+.awsui_header_l0dv0_lk9xb_134:not(#\9) {
   font-size: var(--font-panel-header-size-edjz3l, 18px);
   line-height: var(--font-panel-header-line-height-kxi4u2, 22px);
   font-weight: var(--font-weight-heading-l-f8711v, 700);
@@ -144,8 +144,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   padding-inline-start: var(--space-panel-nav-left-b1g0mt, 28px);
   padding-inline-end: calc(var(--space-scaled-xxl-wbot5q, 32px) + var(--space-xl-lmui9r, 24px));
 }
+.awsui_with-toolbar_l0dv0_lk9xb_146 > .awsui_header_l0dv0_lk9xb_134:not(#\9) {
+  padding-block: var(--space-static-m-lrhgl2, 16px);
+}
 
-.awsui_header-link_l0dv0_1s9d7_147:not(#\9) {
+.awsui_header-link_l0dv0_lk9xb_150:not(#\9) {
   font-size: var(--font-panel-header-size-edjz3l, 18px);
   line-height: var(--font-panel-header-line-height-kxi4u2, 22px);
   font-weight: var(--font-weight-heading-l-f8711v, 700);
@@ -155,27 +158,30 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   min-block-size: var(--font-panel-header-line-height-kxi4u2, 22px);
   display: flex;
 }
-.awsui_header-link--has-logo_l0dv0_1s9d7_157 > .awsui_header-link-text_l0dv0_1s9d7_157:not(#\9) {
+.awsui_header-link--has-logo_l0dv0_lk9xb_160 > .awsui_header-link-text_l0dv0_lk9xb_160:not(#\9) {
   font-weight: 400;
   align-self: center;
 }
 
-.awsui_header-logo_l0dv0_1s9d7_162:not(#\9) {
+.awsui_header-logo_l0dv0_lk9xb_165:not(#\9) {
   margin-inline-end: var(--space-s-34lx8l, 12px);
   margin-block-start: var(--space-xxxs-zbmxqb, 2px);
   max-inline-size: calc(1.25 * var(--size-icon-big-zkdryd, 32px));
   align-self: flex-start;
 }
-.awsui_header-logo--stretched_l0dv0_1s9d7_168:not(#\9) {
+.awsui_header-logo--stretched_l0dv0_lk9xb_171:not(#\9) {
   max-inline-size: 100%;
   margin-inline-end: 0;
 }
 
-.awsui_list-container_l0dv0_1s9d7_173:not(#\9) {
+.awsui_list-container_l0dv0_lk9xb_176:not(#\9) {
   margin-block-start: var(--space-panel-content-top-wac3yp, 20px);
 }
+.awsui_with-toolbar_l0dv0_lk9xb_146 > .awsui_list-container_l0dv0_lk9xb_176:not(#\9) {
+  margin-block-start: 0px;
+}
 
-.awsui_list_l0dv0_1s9d7_173:not(#\9) {
+.awsui_list_l0dv0_lk9xb_176:not(#\9) {
   margin-block: 0;
   margin-inline: 0;
   padding-block: 0;
@@ -183,22 +189,22 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   padding-inline-start: var(--space-l-t419sm, 20px);
 }
 
-.awsui_list-variant-root_l0dv0_1s9d7_185:not(#\9) {
+.awsui_list-variant-root_l0dv0_lk9xb_191:not(#\9) {
   margin-block: 0;
   margin-inline: 0;
   padding-block: 0;
   padding-inline-start: var(--space-panel-nav-left-b1g0mt, 28px);
   padding-inline-end: var(--space-panel-side-right-xofg51, 24px);
 }
-.awsui_list-variant-root--last_l0dv0_1s9d7_192:not(#\9) {
+.awsui_list-variant-root--last_l0dv0_lk9xb_198:not(#\9) {
   margin-block-end: var(--space-panel-content-bottom-7k6er3, 40px);
 }
 
-.awsui_list-variant-expandable-link-group_l0dv0_1s9d7_196:not(#\9) {
+.awsui_list-variant-expandable-link-group_l0dv0_lk9xb_202:not(#\9) {
   padding-inline-start: var(--space-xxxl-4x2gki, 40px);
 }
 
-.awsui_list-item_l0dv0_1s9d7_200:not(#\9) {
+.awsui_list-item_l0dv0_lk9xb_206:not(#\9) {
   margin-block: var(--space-scaled-xs-26e2du, 8px);
   margin-inline: 0;
   padding-block: 0;
@@ -206,35 +212,35 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   list-style: none;
 }
 
-.awsui_section_l0dv0_1s9d7_208:not(#\9),
-.awsui_expandable-link-group_l0dv0_1s9d7_209:not(#\9) {
+.awsui_section_l0dv0_lk9xb_214:not(#\9),
+.awsui_expandable-link-group_l0dv0_lk9xb_215:not(#\9) {
   margin-inline-start: calc(-1 * var(--space-l-t419sm, 20px));
 }
-.awsui_section--no-ident_l0dv0_1s9d7_212:not(#\9),
-.awsui_expandable-link-group--no-ident_l0dv0_1s9d7_213:not(#\9) {
+.awsui_section--no-ident_l0dv0_lk9xb_218:not(#\9),
+.awsui_expandable-link-group--no-ident_l0dv0_lk9xb_219:not(#\9) {
   margin-inline-start: 0;
 }
 
-.awsui_section_l0dv0_1s9d7_208:not(#\9) {
+.awsui_section_l0dv0_lk9xb_214:not(#\9) {
   margin-block: calc(var(--space-scaled-2x-l-ujnz41, 20px) - var(--border-divider-section-width-1061zr, 1px));
   /* stylelint-disable-next-line selector-max-type */
 }
-.awsui_section_l0dv0_1s9d7_208.awsui_refresh_l0dv0_1s9d7_221:not(#\9) {
+.awsui_section_l0dv0_lk9xb_214.awsui_refresh_l0dv0_lk9xb_227:not(#\9) {
   margin-block: calc(var(--space-scaled-2x-m-owtj1o, 16px) - var(--border-divider-section-width-1061zr, 1px));
 }
-.awsui_section_l0dv0_1s9d7_208 > div:not(#\9) {
+.awsui_section_l0dv0_lk9xb_214 > div:not(#\9) {
   padding-block: 0;
   padding-inline: 0;
 }
 
-.awsui_list-variant-section-group_l0dv0_1s9d7_229:not(#\9) {
+.awsui_list-variant-section-group_l0dv0_lk9xb_235:not(#\9) {
   margin-block: 0;
   margin-inline: 0;
   padding-block: 0;
   padding-inline: 0;
 }
 
-.awsui_section-group_l0dv0_1s9d7_236:not(#\9) {
+.awsui_section-group_l0dv0_lk9xb_242:not(#\9) {
   font-size: var(--font-size-heading-m-sjd256, 18px);
   line-height: var(--line-height-heading-m-50evfk, 22px);
   letter-spacing: var(--letter-spacing-heading-m-0w575i, -0.01em);
@@ -245,11 +251,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-inline: 0;
 }
 
-.awsui_section-group-title_l0dv0_1s9d7_247:not(#\9) {
+.awsui_section-group-title_l0dv0_lk9xb_253:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_link_l0dv0_1s9d7_251:not(#\9) {
+.awsui_link_l0dv0_lk9xb_257:not(#\9) {
   font-size: var(--font-size-body-m-x4okxb, 14px);
   line-height: var(--line-height-body-m-30ar75, 20px);
   color: var(--color-text-body-secondary-w9jvno, #414d5c);
@@ -258,30 +264,30 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   -moz-osx-font-smoothing: auto;
 }
 
-.awsui_link-active_l0dv0_1s9d7_260:not(#\9) {
+.awsui_link-active_l0dv0_lk9xb_266:not(#\9) {
   font-weight: var(--font-wayfinding-link-active-weight-rbmzei, 700);
   -webkit-font-smoothing: var(--font-smoothing-webkit-m8nc84, antialiased);
   -moz-osx-font-smoothing: var(--font-smoothing-moz-osx-foywby, grayscale);
   color: var(--color-text-accent-n2acxv, #0972d3);
 }
 
-.awsui_header-link_l0dv0_1s9d7_147:not(#\9),
-.awsui_link_l0dv0_1s9d7_251:not(#\9) {
+.awsui_header-link_l0dv0_lk9xb_150:not(#\9),
+.awsui_link_l0dv0_lk9xb_257:not(#\9) {
   text-decoration: none;
 }
-.awsui_header-link_l0dv0_1s9d7_147:not(#\9):hover,
-.awsui_link_l0dv0_1s9d7_251:not(#\9):hover {
+.awsui_header-link_l0dv0_lk9xb_150:not(#\9):hover,
+.awsui_link_l0dv0_lk9xb_257:not(#\9):hover {
   color: var(--color-text-accent-n2acxv, #0972d3);
 }
-.awsui_header-link_l0dv0_1s9d7_147:not(#\9):focus,
-.awsui_link_l0dv0_1s9d7_251:not(#\9):focus {
+.awsui_header-link_l0dv0_lk9xb_150:not(#\9):focus,
+.awsui_link_l0dv0_lk9xb_257:not(#\9):focus {
   outline: none;
 }
-.awsui_header-link_l0dv0_1s9d7_147:not(#\9):hover, .awsui_header-link_l0dv0_1s9d7_147:not(#\9):focus, .awsui_link_l0dv0_1s9d7_251:not(#\9):hover, .awsui_link_l0dv0_1s9d7_251:not(#\9):focus {
+.awsui_header-link_l0dv0_lk9xb_150:not(#\9):hover, .awsui_header-link_l0dv0_lk9xb_150:not(#\9):focus, .awsui_link_l0dv0_lk9xb_257:not(#\9):hover, .awsui_link_l0dv0_lk9xb_257:not(#\9):focus {
   text-decoration: none;
 }
-body[data-awsui-focus-visible=true] .awsui_header-link_l0dv0_1s9d7_147:not(#\9):focus,
-body[data-awsui-focus-visible=true] .awsui_link_l0dv0_1s9d7_251:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_header-link_l0dv0_lk9xb_150:not(#\9):focus,
+body[data-awsui-focus-visible=true] .awsui_link_l0dv0_lk9xb_257:not(#\9):focus {
   outline: thin dotted;
   outline: var(--border-link-focus-ring-outline-kkfop6, 0);
   outline-offset: 2px;
@@ -293,26 +299,29 @@ body[data-awsui-focus-visible=true] .awsui_link_l0dv0_1s9d7_251:not(#\9):focus {
   box-shadow: 0 0 0 var(--border-link-focus-ring-shadow-spread-v8hkrl, 2px) var(--color-border-item-focused-b2ntyl, #0972d3);
 }
 
-.awsui_info_l0dv0_1s9d7_297:not(#\9) {
+.awsui_info_l0dv0_lk9xb_303:not(#\9) {
   margin-inline-start: var(--space-xs-zb16t3, 8px);
 }
 
-.awsui_external-icon_l0dv0_1s9d7_301:not(#\9) {
+.awsui_external-icon_l0dv0_lk9xb_307:not(#\9) {
   margin-inline-start: var(--space-xxs-p8yyaw, 4px);
 }
 
-.awsui_divider_l0dv0_1s9d7_305:not(#\9) {
+.awsui_divider_l0dv0_lk9xb_311:not(#\9) {
   border-block: none;
   border-inline: none;
 }
 
-.awsui_divider-default_l0dv0_1s9d7_310:not(#\9) {
+.awsui_divider-default_l0dv0_lk9xb_316:not(#\9) {
   margin-block: var(--space-scaled-2x-xl-udij7m, 24px);
   margin-inline: calc(-1 * var(--space-panel-divider-margin-horizontal-sbik1z, 8px));
   border-block-start: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-divider-default-j74lyz, #b6bec9);
 }
 
-.awsui_divider-header_l0dv0_1s9d7_316:not(#\9) {
+.awsui_divider-header_l0dv0_lk9xb_322:not(#\9) {
   margin-block-start: 0;
   border-block-start: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-panel-header-lf0q4c, #b6bec9);
+}
+.awsui_with-toolbar_l0dv0_lk9xb_146 > .awsui_divider-header_l0dv0_lk9xb_322:not(#\9) {
+  border-color: transparent;
 }