@cloudscape-design/components 3.0.1298 → 3.0.1299

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (107) hide show
  1. package/attribute-editor/styles.css.js +15 -15
  2. package/attribute-editor/styles.scoped.css +29 -28
  3. package/attribute-editor/styles.selectors.js +15 -15
  4. package/breadcrumb-group/item/styles.css.js +7 -7
  5. package/breadcrumb-group/item/styles.scoped.css +30 -29
  6. package/breadcrumb-group/item/styles.selectors.js +7 -7
  7. package/breadcrumb-group/styles.css.js +14 -14
  8. package/breadcrumb-group/styles.scoped.css +25 -25
  9. package/breadcrumb-group/styles.selectors.js +14 -14
  10. package/button-dropdown/category-elements/category-element.js +1 -1
  11. package/button-dropdown/category-elements/category-element.js.map +1 -1
  12. package/button-dropdown/category-elements/expandable-category-element.js +1 -1
  13. package/button-dropdown/category-elements/expandable-category-element.js.map +1 -1
  14. package/button-dropdown/category-elements/mobile-expandable-category-element.js +1 -1
  15. package/button-dropdown/category-elements/mobile-expandable-category-element.js.map +1 -1
  16. package/button-dropdown/item-element/index.js +1 -1
  17. package/button-dropdown/item-element/index.js.map +1 -1
  18. package/button-dropdown/item-element/styles.css.js +21 -21
  19. package/button-dropdown/item-element/styles.scoped.css +38 -37
  20. package/button-dropdown/item-element/styles.selectors.js +21 -21
  21. package/copy-to-clipboard/index.d.ts +1 -0
  22. package/copy-to-clipboard/index.d.ts.map +1 -1
  23. package/copy-to-clipboard/index.js +2 -2
  24. package/copy-to-clipboard/index.js.map +1 -1
  25. package/copy-to-clipboard/interfaces.d.ts +5 -0
  26. package/copy-to-clipboard/interfaces.d.ts.map +1 -1
  27. package/copy-to-clipboard/interfaces.js.map +1 -1
  28. package/copy-to-clipboard/internal.d.ts +1 -0
  29. package/copy-to-clipboard/internal.d.ts.map +1 -1
  30. package/copy-to-clipboard/internal.js +3 -3
  31. package/copy-to-clipboard/internal.js.map +1 -1
  32. package/copy-to-clipboard/styles.css.js +5 -3
  33. package/copy-to-clipboard/styles.scoped.css +18 -3
  34. package/copy-to-clipboard/styles.selectors.js +5 -3
  35. package/drawer/implementation.d.ts +3 -3
  36. package/drawer/implementation.d.ts.map +1 -1
  37. package/drawer/implementation.js +3 -2
  38. package/drawer/implementation.js.map +1 -1
  39. package/drawer/index.d.ts +2 -10
  40. package/drawer/index.d.ts.map +1 -1
  41. package/drawer/index.js +21 -9
  42. package/drawer/index.js.map +1 -1
  43. package/drawer/interfaces.d.ts +45 -18
  44. package/drawer/interfaces.d.ts.map +1 -1
  45. package/drawer/interfaces.js.map +1 -1
  46. package/drawer/styles.css.js +29 -25
  47. package/drawer/styles.scoped.css +43 -34
  48. package/drawer/styles.selectors.js +29 -25
  49. package/drawer/utils.d.ts +2 -2
  50. package/drawer/utils.d.ts.map +1 -1
  51. package/drawer/utils.js +6 -5
  52. package/drawer/utils.js.map +1 -1
  53. package/form-field/styles.css.js +24 -24
  54. package/form-field/styles.scoped.css +41 -41
  55. package/form-field/styles.selectors.js +24 -24
  56. package/help-panel/styles.css.js +6 -6
  57. package/help-panel/styles.scoped.css +73 -71
  58. package/help-panel/styles.selectors.js +6 -6
  59. package/internal/base-component/styles.scoped.css +25 -13
  60. package/internal/components/token-list/styles.css.js +10 -10
  61. package/internal/components/token-list/styles.scoped.css +24 -23
  62. package/internal/components/token-list/styles.selectors.js +10 -10
  63. package/internal/environment.js +2 -2
  64. package/internal/environment.json +2 -2
  65. package/internal/generated/styles/tokens.d.ts +24 -12
  66. package/internal/generated/styles/tokens.js +24 -12
  67. package/internal/generated/theming/index.cjs +164 -58
  68. package/internal/generated/theming/index.cjs.d.ts +225 -99
  69. package/internal/generated/theming/index.d.ts +225 -99
  70. package/internal/generated/theming/index.js +164 -58
  71. package/internal/manifest.json +1 -1
  72. package/key-value-pairs/styles.css.js +8 -8
  73. package/key-value-pairs/styles.scoped.css +12 -12
  74. package/key-value-pairs/styles.selectors.js +8 -8
  75. package/link/internal.js +1 -1
  76. package/link/internal.js.map +1 -1
  77. package/link/styles.css.js +21 -21
  78. package/link/styles.scoped.css +94 -84
  79. package/link/styles.selectors.js +21 -21
  80. package/package.json +1 -1
  81. package/pagination/index.d.ts.map +1 -1
  82. package/pagination/index.js +4 -1
  83. package/pagination/index.js.map +1 -1
  84. package/status-indicator/internal.js +1 -1
  85. package/status-indicator/internal.js.map +1 -1
  86. package/table/body-cell/td-element.js +1 -1
  87. package/table/body-cell/td-element.js.map +1 -1
  88. package/tag-editor/styles.css.js +3 -3
  89. package/tag-editor/styles.scoped.css +12 -11
  90. package/tag-editor/styles.selectors.js +3 -3
  91. package/test-utils/dom/drawer/index.d.ts +2 -0
  92. package/test-utils/dom/drawer/index.js +6 -0
  93. package/test-utils/dom/drawer/index.js.map +1 -1
  94. package/test-utils/selectors/drawer/index.d.ts +2 -0
  95. package/test-utils/selectors/drawer/index.js +6 -0
  96. package/test-utils/selectors/drawer/index.js.map +1 -1
  97. package/text-content/styles.css.js +1 -1
  98. package/text-content/styles.scoped.css +68 -66
  99. package/text-content/styles.selectors.js +1 -1
  100. package/tooltip/index.d.ts +0 -3
  101. package/tooltip/index.d.ts.map +1 -1
  102. package/tooltip/index.js +0 -3
  103. package/tooltip/index.js.map +1 -1
  104. package/drawer/next.d.ts +0 -5
  105. package/drawer/next.d.ts.map +0 -1
  106. package/drawer/next.js +0 -38
  107. package/drawer/next.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/drawer/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React from 'react';\n\nimport { ButtonProps } from '../button/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\n\nexport interface DrawerProps extends BaseComponentProps {\n /**\n * Header of the drawer.\n *\n * It should contain the only `h2` used in the drawer.\n */\n header?: React.ReactNode;\n\n /**\n * Main content of the drawer.\n */\n children?: React.ReactNode;\n\n /**\n * Renders the drawer in a loading state. We recommend that you also set a `i18nStrings.loadingText`.\n */\n loading?: boolean;\n\n /**\n * Determines whether the drawer content has padding. If `true`, removes the default padding from the content area.\n */\n disableContentPaddings?: boolean;\n\n /**\n * An object containing all the necessary localized strings required by the component.\n * - `loadingText` - The text that's displayed when the drawer is in a loading state.\n * @i18n\n */\n i18nStrings?: DrawerProps.I18nStrings;\n\n /**\n * Actions for the header. Available only if you specify the `header` property.\n */\n headerActions?: React.ReactNode;\n\n /**\n * Sticky footer content that remains visible at the bottom during scroll.\n *\n * Automatically becomes non-sticky when scrollable content area is too small\n * to ensure content remains accessible (not covered by the footer).\n */\n footer?: React.ReactNode;\n}\n\nexport namespace DrawerProps {\n export interface I18nStrings {\n loadingText?: string;\n }\n}\n\n// Props for a future release\nexport interface NextDrawerProps extends DrawerProps {\n /**\n * Sets the ARIA role of the drawer.\n * - `\"region\"` (default for non-`static` positions) — exposes the drawer as a\n * landmark region. The drawer receives focus when opened.\n * - `\"presentation\"` (default for `position=\"static\"`) — removes landmark semantics\n * from the drawer body. Use this when the containing element already provides the\n * appropriate semantic role (e.g. a wrapping `<nav>` or `<aside>`). The drawer does not\n * receive focus when opened.\n */\n role?: 'region' | 'presentation';\n\n /**\n * Sets the `aria-label` on the drawer body.\n * By default the body is labelled by the drawer's `header` content. Use this when you need a different\n * or more specific label (e.g. to include additional context or exclude parts of the header).\n * Does not apply when `role=\"presentation\"`. Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabel?: string;\n\n /**\n * Sets the `aria-labelledby` on the drawer body.\n * By default the body is labelled by the drawer's `header` content. Use this when you need a different\n * or more specific label (e.g. to include additional context or exclude parts of the header).\n * Does not apply when `role=\"presentation\"`. Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabelledby?: string;\n\n /**\n * Specifies the CSS positioning mode of the drawer, and supports the following options:\n * * `static` (default) - The drawer is positioned in the normal document flow.\n * * `sticky` - The drawer sticks to its nearest scrolling ancestor. Only meaningful with `placement=\"top\"` or `placement=\"bottom\"`.\n * Using `sticky` with `placement=\"start\"` or `placement=\"end\"` falls back to `static`.\n * * `absolute` - The drawer is positioned relative to its nearest positioned ancestor.\n * * `fixed` - The drawer is positioned relative to the viewport.\n */\n position?: NextDrawerProps.Position;\n\n /**\n * Specifies which edge of its container the drawer is anchored to, and supports these options:\n * * `start` - Anchored to the inline-start edge.\n * * `end` - (default) Anchored to the inline-end edge.\n * * `top` - Anchored to the top edge.\n * * `bottom` - Anchored to the bottom edge.\n */\n placement?: NextDrawerProps.Placement;\n\n /**\n * Specifies the distance in pixels between the drawer and the edges of its container.\n * Applicable when using `position=\"absolute\"` or `position=\"fixed\"`.\n * Supported properties:\n * * `start` - Distance from the inline-start edge. Not applicable when `placement` is `\"end\"`.\n * * `end` - Distance from the inline-end edge. Not applicable when `placement` is `\"start\"`.\n * * `top` - Distance from the top edge. Not applicable when `placement` is `\"bottom\"`.\n * * `bottom` - Distance from the bottom edge. Not applicable when `placement` is `\"top\"`.\n */\n offset?: NextDrawerProps.Offset;\n\n /**\n * Specifies the distance in pixels from the top or bottom edge of the scrolling container\n * at which the drawer sticks. Applicable only when using `position=\"sticky\"` with `placement=\"top\"` or `placement=\"bottom\"`.\n * * Supported properties:\n * * `top` - Distance from the top of the scrolling container.\n * * `bottom` - Distance from the bottom of the scrolling container.\n */\n stickyOffset?: NextDrawerProps.StickyOffset;\n\n /**\n * Sets the CSS `z-index` of the drawer. Use this to control stacking order when the drawer\n * overlaps other positioned elements on the page.\n *\n * Applicable when using `position=\"sticky\"`, `position=\"absolute\"`, or `position=\"fixed\"`.\n */\n zIndex?: number;\n\n /**\n * When defined, renders a close button in the header with the provided configuration.\n * The close button fires the `onClose` event with method `'close-action'` when\n * clicked.\n */\n closeAction?: Pick<\n ButtonProps,\n 'ariaLabel' | 'disabled' | 'disabledReason' | 'iconName' | 'iconSvg' | 'iconUrl' | 'iconAlt'\n >;\n\n /**\n * Hides the close action slot next to the header actions, which is present even\n * when close action is not set. Use it when a close action is not needed, or a\n * custom close action implementation is used.\n */\n hideCloseAction?: boolean;\n\n /**\n * Called when the user performs a close action. The `event.detail.method` indicates the trigger:\n * * `'close-action'` - The close button was clicked.\n * * `'backdrop-click'` - The backdrop was clicked (only when `backdrop=true`).\n * * `'escape'` - The Escape key was pressed (only when `backdrop=true`).\n */\n onClose?: NonCancelableEventHandler<NextDrawerProps.CloseDetail>;\n\n /**\n * Drawer open state. Set to `true` to show the drawer, `false` to hide it.\n * Handle the `onClose` event to update this value when the user requests to close the drawer.\n *\n * When the property is unset - the drawer is always visible, and the built-in focus in/out behaviors are disabled.\n */\n open?: boolean;\n\n /**\n * Shows a semi-transparent backdrop behind the drawer when open. Used with `absolute`\n * and `fixed` positions.\n *\n * When a backdrop is set, the keyboard focus is trapped inside the drawer by default\n * to prevent it from moving to elements covered by the backdrop. This can be overridden\n * with `focusBehavior.trapFocus`.\n */\n backdrop?: boolean;\n\n /**\n * Customizes focus-related behavior:\n *\n * - `autoFocus` - Whether focus moves into the drawer when `open` changes from `false` to `true`,\n * and captures the previously focused element for default return-focus on close.\n * Defaults to `true`. Set to `false` to manage focus-in manually via `ref.current.focus()`.\n *\n * - `trapFocus` - Whether keyboard focus is constrained to elements inside the drawer.\n * Defaults to `true` when `backdrop` is set, `false` otherwise.\n *\n * - `returnFocus` - Called instead of the default return-focus behavior when the drawer closes.\n * Use this to override where focus lands on close (e.g. a specific trigger element).\n * If omitted, focus returns to the element that was focused when the drawer opened.\n * If that element is no longer in the DOM, the behavior silently no-ops.\n */\n focusBehavior?: NextDrawerProps.FocusBehavior;\n}\n\nexport namespace NextDrawerProps {\n export type Position = 'static' | 'sticky' | 'absolute' | 'fixed';\n\n export type Placement = 'start' | 'end' | 'top' | 'bottom';\n\n export interface Offset {\n start?: number;\n end?: number;\n top?: number;\n bottom?: number;\n }\n\n export interface StickyOffset {\n top?: number;\n bottom?: number;\n }\n\n export interface CloseDetail {\n method: 'close-action' | 'backdrop-click' | 'escape';\n }\n\n export interface FocusBehavior {\n autoFocus?: boolean;\n trapFocus?: boolean;\n returnFocus?: () => void;\n }\n\n export interface Ref {\n /**\n * Moves focus to the drawer element. Use in controlled mode when `focusBehavior.autoFocus`\n * is disabled and you need to manage focus manually, or to focus a drawer, initially rendered\n * with `open=true`. The drawer with `role=\"presentation\"` cannot be focused.\n */\n focus(): void;\n }\n}\n"]}
1
+ {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/drawer/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React from 'react';\n\nimport { IconProps } from '../icon/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\n\nexport interface DrawerProps extends BaseComponentProps {\n /**\n * Header of the drawer.\n *\n * It should contain the only `h2` used in the drawer.\n */\n header?: React.ReactNode;\n\n /**\n * Main content of the drawer.\n */\n children?: React.ReactNode;\n\n /**\n * Renders the drawer in a loading state. We recommend that you also set a `i18nStrings.loadingText`.\n */\n loading?: boolean;\n\n /**\n * Determines whether the drawer content has padding. If `true`, removes the default padding from the content area.\n */\n disableContentPaddings?: boolean;\n\n /**\n * An object containing all the necessary localized strings required by the component.\n * - `loadingText` - The text that's displayed when the drawer is in a loading state.\n * @i18n\n */\n i18nStrings?: DrawerProps.I18nStrings;\n\n /**\n * Actions for the header. Available only if you specify the `header` property.\n */\n headerActions?: React.ReactNode;\n\n /**\n * Sticky footer content that remains visible at the bottom during scroll.\n *\n * Automatically becomes non-sticky when scrollable content area is too small\n * to ensure content remains accessible (not covered by the footer).\n */\n footer?: React.ReactNode;\n\n /**\n * Sets the ARIA role of the drawer.\n * - `\"region\"` (default for non-`static` positions) — exposes the drawer as a\n * landmark region. The drawer receives focus when opened.\n * - `\"presentation\"` (default for `position=\"static\"`) — removes landmark semantics\n * from the drawer body. Use this when the containing element already provides the\n * appropriate semantic role (e.g. a wrapping `<nav>` or `<aside>`). The drawer does not\n * receive focus when opened.\n */\n role?: 'region' | 'presentation';\n\n /**\n * Sets the `aria-label` on the drawer body.\n * By default the body is labelled by the drawer's `header` content. Use this when you need a different\n * or more specific label (e.g. to include additional context or exclude parts of the header).\n * Does not apply when `role=\"presentation\"`. Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabel?: string;\n\n /**\n * Sets the `aria-labelledby` on the drawer body.\n * By default the body is labelled by the drawer's `header` content. Use this when you need a different\n * or more specific label (e.g. to include additional context or exclude parts of the header).\n * Does not apply when `role=\"presentation\"`. Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabelledby?: string;\n\n /**\n * Specifies the CSS positioning mode of the drawer, and supports the following options:\n * * `static` (default) - The drawer is positioned in the normal document flow.\n * * `sticky` - The drawer sticks to its nearest scrolling ancestor. Only meaningful with `placement=\"top\"` or `placement=\"bottom\"`.\n * Using `sticky` with `placement=\"start\"` or `placement=\"end\"` falls back to `static`.\n * * `absolute` - The drawer is positioned relative to its nearest positioned ancestor.\n * * `fixed` - The drawer is positioned relative to the viewport.\n *\n * Do not use this property when using drawers inside app layout.\n */\n position?: DrawerProps.Position;\n\n /**\n * Specifies which edge of its container the drawer is anchored to, and supports these options:\n * * `start` - Anchored to the inline-start edge.\n * * `end` - (default) Anchored to the inline-end edge.\n * * `top` - Anchored to the top edge.\n * * `bottom` - Anchored to the bottom edge.\n *\n * Do not use this property when using drawers inside app layout.\n */\n placement?: DrawerProps.Placement;\n\n /**\n * Specifies the distance in pixels between the drawer and the edges of its container.\n * Applicable when using `position=\"absolute\"` or `position=\"fixed\"`.\n * Supported properties:\n * * `start` - Distance from the inline-start edge. Not applicable when `placement` is `\"end\"`.\n * * `end` - Distance from the inline-end edge. Not applicable when `placement` is `\"start\"`.\n * * `top` - Distance from the top edge. Not applicable when `placement` is `\"bottom\"`.\n * * `bottom` - Distance from the bottom edge. Not applicable when `placement` is `\"top\"`.\n *\n * Do not use this property when using drawers inside app layout.\n */\n offset?: DrawerProps.Offset;\n\n /**\n * Specifies the distance in pixels from the top or bottom edge of the scrolling container\n * at which the drawer sticks. Applicable only when using `position=\"sticky\"` with `placement=\"top\"` or `placement=\"bottom\"`.\n * * Supported properties:\n * * `top` - Distance from the top of the scrolling container.\n * * `bottom` - Distance from the bottom of the scrolling container.\n *\n * Do not use this property when using drawers inside app layout.\n */\n stickyOffset?: DrawerProps.StickyOffset;\n\n /**\n * Sets the CSS `z-index` of the drawer. Use this to control stacking order when the drawer\n * overlaps other positioned elements on the page.\n *\n * Applicable when using `position=\"sticky\"`, `position=\"absolute\"`, or `position=\"fixed\"`. Defaults to 830.\n *\n * Do not use this property when using drawers inside app layout.\n */\n zIndex?: number;\n\n /**\n * When defined, renders a close button in the header with the provided configuration.\n * The close button fires the `onClose` event with method `'close-action'` when\n * clicked.\n *\n * Do not use this property when using drawers inside app layout.\n */\n closeAction?: DrawerProps.CloseActionProps;\n\n /**\n * Hides the close action slot next to the header actions, which is present even\n * when close action is not set. Use it when a close action is not needed, or a\n * custom close action implementation is used.\n *\n * Do not use this property when using drawers inside app layout.\n */\n hideCloseAction?: boolean;\n\n /**\n * Called when the user performs a close action. The `event.detail.method` indicates the trigger:\n * * `'close-action'` - The close button was clicked.\n * * `'backdrop-click'` - The backdrop was clicked (only when `backdrop=true`).\n * * `'escape'` - The Escape key was pressed (only when `backdrop=true`).\n *\n * Do not use this property when using drawers inside app layout.\n */\n onClose?: NonCancelableEventHandler<DrawerProps.CloseDetail>;\n\n /**\n * Drawer open state. Set to `true` to show the drawer, `false` to hide it.\n * Handle the `onClose` event to update this value when the user requests to close the drawer.\n *\n * When the property is unset - the drawer is always visible, and the built-in focus in/out behaviors are disabled.\n *\n * Do not use this property when using drawers inside app layout.\n */\n open?: boolean;\n\n /**\n * Shows a semi-transparent backdrop behind the drawer when open. Used with `absolute`\n * and `fixed` positions.\n *\n * When a backdrop is set, the keyboard focus is trapped inside the drawer by default\n * to prevent it from moving to elements covered by the backdrop. This can be overridden\n * with `focusBehavior.trapFocus`.\n *\n * Do not use this property when using drawers inside app layout.\n */\n backdrop?: boolean;\n\n /**\n * Customizes focus-related behavior:\n *\n * - `autoFocus` - Whether focus moves into the drawer when `open` changes from `false` to `true`,\n * and captures the previously focused element for default return-focus on close.\n * Defaults to `true`. Set to `false` to manage focus-in manually via `ref.current.focus()`.\n *\n * - `trapFocus` - Whether keyboard focus is constrained to elements inside the drawer.\n * Defaults to `true` when `backdrop` is set, `false` otherwise.\n *\n * - `returnFocus` - Called instead of the default return-focus behavior when the drawer closes.\n * Use this to override where focus lands on close (e.g. a specific trigger element).\n * If omitted, focus returns to the element that was focused when the drawer opened.\n * If that element is no longer in the DOM, the behavior silently no-ops.\n *\n * Do not use this property when using drawers inside app layout.\n */\n focusBehavior?: DrawerProps.FocusBehavior;\n}\n\nexport namespace DrawerProps {\n export interface I18nStrings {\n loadingText?: string;\n }\n\n export type Position = 'static' | 'sticky' | 'absolute' | 'fixed';\n\n export type Placement = 'start' | 'end' | 'top' | 'bottom';\n\n export interface Offset {\n start?: number;\n end?: number;\n top?: number;\n bottom?: number;\n }\n\n export interface StickyOffset {\n top?: number;\n bottom?: number;\n }\n\n export interface CloseActionProps {\n ariaLabel?: string;\n disabled?: boolean;\n disabledReason?: string;\n iconName?: IconProps.Name;\n iconUrl?: string;\n iconSvg?: React.ReactNode;\n iconAlt?: string;\n }\n\n export interface CloseDetail {\n method: 'close-action' | 'backdrop-click' | 'escape';\n }\n\n export interface FocusBehavior {\n autoFocus?: boolean;\n trapFocus?: boolean;\n returnFocus?: () => void;\n }\n\n export interface Ref {\n /**\n * Moves focus to the drawer element. Use when `focusBehavior.autoFocus`\n * is disabled and you need to manage focus manually, or to focus a drawer, initially rendered\n * with `open=true`. The drawer with `role=\"presentation\"` cannot be focused.\n */\n focus(): void;\n }\n}\n"]}
@@ -1,30 +1,34 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "root": "awsui_root_1sxt8_1cneo_193",
5
- "drawer": "awsui_drawer_1sxt8_1cneo_197",
6
- "has-close-action": "awsui_has-close-action_1sxt8_1cneo_230",
7
- "position-absolute": "awsui_position-absolute_1sxt8_1cneo_233",
8
- "position-sticky": "awsui_position-sticky_1sxt8_1cneo_233",
9
- "position-fixed": "awsui_position-fixed_1sxt8_1cneo_233",
10
- "with-footer": "awsui_with-footer_1sxt8_1cneo_236",
11
- "position-static": "awsui_position-static_1sxt8_1cneo_240",
12
- "content": "awsui_content_1sxt8_1cneo_243",
13
- "header": "awsui_header_1sxt8_1cneo_271",
14
- "hide-close-action": "awsui_hide-close-action_1sxt8_1cneo_287",
15
- "with-additional-action": "awsui_with-additional-action_1sxt8_1cneo_291",
16
- "with-runtime-context": "awsui_with-runtime-context_1sxt8_1cneo_299",
17
- "with-toolbar": "awsui_with-toolbar_1sxt8_1cneo_302",
18
- "header-actions": "awsui_header-actions_1sxt8_1cneo_321",
19
- "close-action": "awsui_close-action_1sxt8_1cneo_327",
20
- "content-with-paddings": "awsui_content-with-paddings_1sxt8_1cneo_333",
21
- "footer": "awsui_footer_1sxt8_1cneo_340",
22
- "is-sticky": "awsui_is-sticky_1sxt8_1cneo_346",
23
- "test-utils-drawer-content": "awsui_test-utils-drawer-content_1sxt8_1cneo_354",
24
- "hidden": "awsui_hidden_1sxt8_1cneo_358",
25
- "focus-trap": "awsui_focus-trap_1sxt8_1cneo_362",
26
- "backdrop": "awsui_backdrop_1sxt8_1cneo_366",
27
- "backdrop-fixed": "awsui_backdrop-fixed_1sxt8_1cneo_370",
28
- "backdrop-absolute": "awsui_backdrop-absolute_1sxt8_1cneo_373"
4
+ "root": "awsui_root_1sxt8_ygv0p_193",
5
+ "drawer": "awsui_drawer_1sxt8_ygv0p_197",
6
+ "has-close-action": "awsui_has-close-action_1sxt8_ygv0p_230",
7
+ "position-absolute": "awsui_position-absolute_1sxt8_ygv0p_233",
8
+ "placement-end": "awsui_placement-end_1sxt8_ygv0p_233",
9
+ "position-sticky": "awsui_position-sticky_1sxt8_ygv0p_233",
10
+ "position-fixed": "awsui_position-fixed_1sxt8_ygv0p_233",
11
+ "placement-start": "awsui_placement-start_1sxt8_ygv0p_236",
12
+ "placement-top": "awsui_placement-top_1sxt8_ygv0p_239",
13
+ "placement-bottom": "awsui_placement-bottom_1sxt8_ygv0p_242",
14
+ "with-footer": "awsui_with-footer_1sxt8_ygv0p_245",
15
+ "position-static": "awsui_position-static_1sxt8_ygv0p_249",
16
+ "content": "awsui_content_1sxt8_ygv0p_252",
17
+ "header": "awsui_header_1sxt8_ygv0p_280",
18
+ "hide-close-action": "awsui_hide-close-action_1sxt8_ygv0p_296",
19
+ "with-additional-action": "awsui_with-additional-action_1sxt8_ygv0p_300",
20
+ "with-runtime-context": "awsui_with-runtime-context_1sxt8_ygv0p_308",
21
+ "with-toolbar": "awsui_with-toolbar_1sxt8_ygv0p_311",
22
+ "header-actions": "awsui_header-actions_1sxt8_ygv0p_330",
23
+ "close-action": "awsui_close-action_1sxt8_ygv0p_336",
24
+ "content-with-paddings": "awsui_content-with-paddings_1sxt8_ygv0p_342",
25
+ "footer": "awsui_footer_1sxt8_ygv0p_349",
26
+ "is-sticky": "awsui_is-sticky_1sxt8_ygv0p_355",
27
+ "test-utils-drawer-content": "awsui_test-utils-drawer-content_1sxt8_ygv0p_363",
28
+ "hidden": "awsui_hidden_1sxt8_ygv0p_367",
29
+ "focus-trap": "awsui_focus-trap_1sxt8_ygv0p_371",
30
+ "backdrop": "awsui_backdrop_1sxt8_ygv0p_375",
31
+ "backdrop-fixed": "awsui_backdrop-fixed_1sxt8_ygv0p_379",
32
+ "backdrop-absolute": "awsui_backdrop-absolute_1sxt8_ygv0p_382"
29
33
  };
30
34
 
@@ -190,11 +190,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
190
190
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
191
191
  SPDX-License-Identifier: Apache-2.0
192
192
  */
193
- .awsui_root_1sxt8_1cneo_193:not(#\9) {
193
+ .awsui_root_1sxt8_ygv0p_193:not(#\9) {
194
194
  display: contents;
195
195
  }
196
196
 
197
- .awsui_drawer_1sxt8_1cneo_197:not(#\9) {
197
+ .awsui_drawer_1sxt8_ygv0p_197:not(#\9) {
198
198
  border-collapse: separate;
199
199
  border-spacing: 0;
200
200
  box-sizing: border-box;
@@ -227,33 +227,42 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
227
227
  word-wrap: break-word;
228
228
  background-color: var(--color-background-drawer-5hs0eh, #ffffff);
229
229
  }
230
- .awsui_drawer_1sxt8_1cneo_197.awsui_has-close-action_1sxt8_1cneo_230:not(#\9) {
230
+ .awsui_drawer_1sxt8_ygv0p_197.awsui_has-close-action_1sxt8_ygv0p_230:not(#\9) {
231
231
  position: relative;
232
232
  }
233
- .awsui_drawer_1sxt8_1cneo_197.awsui_position-absolute_1sxt8_1cneo_233:not(#\9), .awsui_drawer_1sxt8_1cneo_197.awsui_position-sticky_1sxt8_1cneo_233:not(#\9), .awsui_drawer_1sxt8_1cneo_197.awsui_position-fixed_1sxt8_1cneo_233:not(#\9) {
234
- box-shadow: var(--shadow-panel-vk7iea, 0px 0px 0px 1px #b6bec9);
233
+ .awsui_drawer_1sxt8_ygv0p_197.awsui_position-absolute_1sxt8_ygv0p_233.awsui_placement-end_1sxt8_ygv0p_233:not(#\9), .awsui_drawer_1sxt8_ygv0p_197.awsui_position-sticky_1sxt8_ygv0p_233.awsui_placement-end_1sxt8_ygv0p_233:not(#\9), .awsui_drawer_1sxt8_ygv0p_197.awsui_position-fixed_1sxt8_ygv0p_233.awsui_placement-end_1sxt8_ygv0p_233:not(#\9) {
234
+ border-inline-start: var(--border-divider-section-width-uwo8my, 1px) solid var(--color-border-panel-header-ygztvl, #c6c6cd);
235
235
  }
236
- .awsui_drawer_1sxt8_1cneo_197.awsui_with-footer_1sxt8_1cneo_236:not(#\9) {
236
+ .awsui_drawer_1sxt8_ygv0p_197.awsui_position-absolute_1sxt8_ygv0p_233.awsui_placement-start_1sxt8_ygv0p_236:not(#\9), .awsui_drawer_1sxt8_ygv0p_197.awsui_position-sticky_1sxt8_ygv0p_233.awsui_placement-start_1sxt8_ygv0p_236:not(#\9), .awsui_drawer_1sxt8_ygv0p_197.awsui_position-fixed_1sxt8_ygv0p_233.awsui_placement-start_1sxt8_ygv0p_236:not(#\9) {
237
+ border-inline-end: var(--border-divider-section-width-uwo8my, 1px) solid var(--color-border-panel-header-ygztvl, #c6c6cd);
238
+ }
239
+ .awsui_drawer_1sxt8_ygv0p_197.awsui_position-absolute_1sxt8_ygv0p_233.awsui_placement-top_1sxt8_ygv0p_239:not(#\9), .awsui_drawer_1sxt8_ygv0p_197.awsui_position-sticky_1sxt8_ygv0p_233.awsui_placement-top_1sxt8_ygv0p_239:not(#\9), .awsui_drawer_1sxt8_ygv0p_197.awsui_position-fixed_1sxt8_ygv0p_233.awsui_placement-top_1sxt8_ygv0p_239:not(#\9) {
240
+ border-block-end: var(--border-divider-section-width-uwo8my, 1px) solid var(--color-border-panel-header-ygztvl, #c6c6cd);
241
+ }
242
+ .awsui_drawer_1sxt8_ygv0p_197.awsui_position-absolute_1sxt8_ygv0p_233.awsui_placement-bottom_1sxt8_ygv0p_242:not(#\9), .awsui_drawer_1sxt8_ygv0p_197.awsui_position-sticky_1sxt8_ygv0p_233.awsui_placement-bottom_1sxt8_ygv0p_242:not(#\9), .awsui_drawer_1sxt8_ygv0p_197.awsui_position-fixed_1sxt8_ygv0p_233.awsui_placement-bottom_1sxt8_ygv0p_242:not(#\9) {
243
+ border-block-start: var(--border-divider-section-width-uwo8my, 1px) solid var(--color-border-panel-header-ygztvl, #c6c6cd);
244
+ }
245
+ .awsui_drawer_1sxt8_ygv0p_197.awsui_with-footer_1sxt8_ygv0p_245:not(#\9) {
237
246
  display: flex;
238
247
  flex-direction: column;
239
248
  }
240
- .awsui_drawer_1sxt8_1cneo_197.awsui_with-footer_1sxt8_1cneo_236.awsui_position-static_1sxt8_1cneo_240:not(#\9) {
249
+ .awsui_drawer_1sxt8_ygv0p_197.awsui_with-footer_1sxt8_ygv0p_245.awsui_position-static_1sxt8_ygv0p_249:not(#\9) {
241
250
  min-block-size: 100%;
242
251
  }
243
- .awsui_drawer_1sxt8_1cneo_197.awsui_with-footer_1sxt8_1cneo_236 > .awsui_content_1sxt8_1cneo_243:not(#\9) {
252
+ .awsui_drawer_1sxt8_ygv0p_197.awsui_with-footer_1sxt8_ygv0p_245 > .awsui_content_1sxt8_ygv0p_252:not(#\9) {
244
253
  flex: 1;
245
254
  }
246
- .awsui_drawer_1sxt8_1cneo_197:not(#\9):focus {
255
+ .awsui_drawer_1sxt8_ygv0p_197:not(#\9):focus {
247
256
  outline: none;
248
257
  }
249
- body[data-awsui-focus-visible=true] .awsui_drawer_1sxt8_1cneo_197:not(#\9):focus {
258
+ body[data-awsui-focus-visible=true] .awsui_drawer_1sxt8_ygv0p_197:not(#\9):focus {
250
259
  position: relative;
251
260
  }
252
- body[data-awsui-focus-visible=true] .awsui_drawer_1sxt8_1cneo_197:not(#\9):focus {
261
+ body[data-awsui-focus-visible=true] .awsui_drawer_1sxt8_ygv0p_197:not(#\9):focus {
253
262
  outline: 2px dotted transparent;
254
263
  outline-offset: calc(-2px - 1px);
255
264
  }
256
- body[data-awsui-focus-visible=true] .awsui_drawer_1sxt8_1cneo_197:not(#\9):focus::before {
265
+ body[data-awsui-focus-visible=true] .awsui_drawer_1sxt8_ygv0p_197:not(#\9):focus::before {
257
266
  content: " ";
258
267
  display: block;
259
268
  position: absolute;
@@ -268,7 +277,7 @@ body[data-awsui-focus-visible=true] .awsui_drawer_1sxt8_1cneo_197:not(#\9):focus
268
277
  box-shadow: 0 0 0 2px var(--color-border-item-focused-uk47pl, #006ce0);
269
278
  }
270
279
 
271
- .awsui_header_1sxt8_1cneo_271:not(#\9) {
280
+ .awsui_header_1sxt8_ygv0p_280:not(#\9) {
272
281
  font-size: var(--font-panel-header-size-33h9j8, 18px);
273
282
  letter-spacing: var(--letter-spacing-heading-m-29ewnk, -0.01em);
274
283
  line-height: var(--font-panel-header-line-height-8xb2qj, 22px);
@@ -284,11 +293,11 @@ body[data-awsui-focus-visible=true] .awsui_drawer_1sxt8_1cneo_197:not(#\9):focus
284
293
  /* stylelint-disable @cloudscape-design/no-implicit-descendant, selector-max-type */
285
294
  /* stylelint-enable @cloudscape-design/no-implicit-descendant, selector-max-type */
286
295
  }
287
- .awsui_header_1sxt8_1cneo_271.awsui_hide-close-action_1sxt8_1cneo_287:not(#\9) {
296
+ .awsui_header_1sxt8_ygv0p_280.awsui_hide-close-action_1sxt8_ygv0p_296:not(#\9) {
288
297
  padding-inline: var(--space-panel-side-left-u1m3s9, 28px) var(--space-panel-side-right-8wwirc, 24px);
289
298
  }
290
299
  @media (min-width: 689px) {
291
- .awsui_header_1sxt8_1cneo_271.awsui_with-additional-action_1sxt8_1cneo_291:not(#\9) {
300
+ .awsui_header_1sxt8_ygv0p_280.awsui_with-additional-action_1sxt8_ygv0p_300:not(#\9) {
292
301
  /*
293
302
  this padding is needed when the drawer renders inside a runtime drawer and the runtime drawer has an additional action
294
303
  on the right (or left in rtl). in this case this padding ensures that the drawer's content does not overlap with runtime actions
@@ -296,18 +305,18 @@ body[data-awsui-focus-visible=true] .awsui_drawer_1sxt8_1cneo_197:not(#\9):focus
296
305
  padding-inline: var(--space-panel-side-left-u1m3s9, 28px) calc(var(--space-xxxl-aut1u7, 40px) + var(--space-scaled-xxl-6wgq96, 32px));
297
306
  }
298
307
  }
299
- .awsui_header_1sxt8_1cneo_271.awsui_with-runtime-context_1sxt8_1cneo_299:not(#\9) {
308
+ .awsui_header_1sxt8_ygv0p_280.awsui_with-runtime-context_1sxt8_ygv0p_308:not(#\9) {
300
309
  padding-block: 14px;
301
310
  }
302
- .awsui_with-toolbar_1sxt8_1cneo_302 > .awsui_header_1sxt8_1cneo_271:not(#\9) {
311
+ .awsui_with-toolbar_1sxt8_ygv0p_311 > .awsui_header_1sxt8_ygv0p_280:not(#\9) {
303
312
  border-color: transparent;
304
313
  margin-block-end: 0px;
305
314
  }
306
- .awsui_header_1sxt8_1cneo_271 h2:not(#\9),
307
- .awsui_header_1sxt8_1cneo_271 h3:not(#\9),
308
- .awsui_header_1sxt8_1cneo_271 h4:not(#\9),
309
- .awsui_header_1sxt8_1cneo_271 h5:not(#\9),
310
- .awsui_header_1sxt8_1cneo_271 h6:not(#\9) {
315
+ .awsui_header_1sxt8_ygv0p_280 h2:not(#\9),
316
+ .awsui_header_1sxt8_ygv0p_280 h3:not(#\9),
317
+ .awsui_header_1sxt8_ygv0p_280 h4:not(#\9),
318
+ .awsui_header_1sxt8_ygv0p_280 h5:not(#\9),
319
+ .awsui_header_1sxt8_ygv0p_280 h6:not(#\9) {
311
320
  font-size: var(--font-panel-header-size-33h9j8, 18px);
312
321
  letter-spacing: var(--letter-spacing-heading-m-29ewnk, -0.01em);
313
322
  line-height: var(--font-panel-header-line-height-8xb2qj, 22px);
@@ -318,32 +327,32 @@ body[data-awsui-focus-visible=true] .awsui_drawer_1sxt8_1cneo_197:not(#\9):focus
318
327
  margin-block: 0;
319
328
  }
320
329
 
321
- .awsui_header-actions_1sxt8_1cneo_321:not(#\9) {
330
+ .awsui_header-actions_1sxt8_ygv0p_330:not(#\9) {
322
331
  display: inline-flex;
323
332
  align-items: flex-start;
324
333
  z-index: 1;
325
334
  }
326
335
 
327
- .awsui_close-action_1sxt8_1cneo_327:not(#\9) {
336
+ .awsui_close-action_1sxt8_ygv0p_336:not(#\9) {
328
337
  position: absolute;
329
- inset-block-start: var(--space-panel-header-vertical-ckfgmy, 20px);
338
+ inset-block-start: var(--space-static-m-m6qboo, 16px);
330
339
  inset-inline-end: var(--space-scaled-l-sej05l, 20px);
331
340
  }
332
341
 
333
- .awsui_content-with-paddings_1sxt8_1cneo_333:not(#\9):not(:empty) {
342
+ .awsui_content-with-paddings_1sxt8_ygv0p_342:not(#\9):not(:empty) {
334
343
  padding-block-start: var(--space-panel-content-top-qvd1dr, 20px);
335
344
  padding-inline-start: var(--space-panel-side-left-u1m3s9, 28px);
336
345
  padding-inline-end: var(--space-panel-side-right-8wwirc, 24px);
337
346
  padding-block-end: var(--space-panel-content-bottom-24c6lu, 40px);
338
347
  }
339
348
 
340
- .awsui_footer_1sxt8_1cneo_340:not(#\9) {
349
+ .awsui_footer_1sxt8_ygv0p_349:not(#\9) {
341
350
  background-color: var(--color-background-container-content-6u8rvp, #ffffff);
342
351
  border-block-start: var(--border-divider-section-width-uwo8my, 1px) solid var(--color-border-panel-header-ygztvl, #c6c6cd);
343
352
  padding-block: var(--space-panel-content-top-qvd1dr, 20px);
344
353
  padding-inline: var(--space-panel-side-left-u1m3s9, 28px) var(--space-panel-side-right-8wwirc, 24px);
345
354
  }
346
- .awsui_footer_1sxt8_1cneo_340.awsui_is-sticky_1sxt8_1cneo_346:not(#\9) {
355
+ .awsui_footer_1sxt8_ygv0p_349.awsui_is-sticky_1sxt8_ygv0p_355:not(#\9) {
347
356
  position: sticky;
348
357
  inset-block-end: 0;
349
358
  inset-inline-start: 0;
@@ -351,25 +360,25 @@ body[data-awsui-focus-visible=true] .awsui_drawer_1sxt8_1cneo_197:not(#\9):focus
351
360
  z-index: 810;
352
361
  }
353
362
 
354
- .awsui_test-utils-drawer-content_1sxt8_1cneo_354:not(#\9) {
363
+ .awsui_test-utils-drawer-content_1sxt8_ygv0p_363:not(#\9) {
355
364
  /* used in test-utils */
356
365
  }
357
366
 
358
- .awsui_hidden_1sxt8_1cneo_358:not(#\9) {
367
+ .awsui_hidden_1sxt8_ygv0p_367:not(#\9) {
359
368
  display: none;
360
369
  }
361
370
 
362
- .awsui_focus-trap_1sxt8_1cneo_362:not(#\9) {
371
+ .awsui_focus-trap_1sxt8_ygv0p_371:not(#\9) {
363
372
  display: contents;
364
373
  }
365
374
 
366
- .awsui_backdrop_1sxt8_1cneo_366:not(#\9) {
375
+ .awsui_backdrop_1sxt8_ygv0p_375:not(#\9) {
367
376
  inset: 0;
368
377
  background-color: var(--color-background-drawer-backdrop-ducxi3, rgba(35, 43, 55, 0.7));
369
378
  }
370
- .awsui_backdrop_1sxt8_1cneo_366.awsui_backdrop-fixed_1sxt8_1cneo_370:not(#\9) {
379
+ .awsui_backdrop_1sxt8_ygv0p_375.awsui_backdrop-fixed_1sxt8_ygv0p_379:not(#\9) {
371
380
  position: fixed;
372
381
  }
373
- .awsui_backdrop_1sxt8_1cneo_366.awsui_backdrop-absolute_1sxt8_1cneo_373:not(#\9) {
382
+ .awsui_backdrop_1sxt8_ygv0p_375.awsui_backdrop-absolute_1sxt8_ygv0p_382:not(#\9) {
374
383
  position: absolute;
375
384
  }
@@ -2,30 +2,34 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "root": "awsui_root_1sxt8_1cneo_193",
6
- "drawer": "awsui_drawer_1sxt8_1cneo_197",
7
- "has-close-action": "awsui_has-close-action_1sxt8_1cneo_230",
8
- "position-absolute": "awsui_position-absolute_1sxt8_1cneo_233",
9
- "position-sticky": "awsui_position-sticky_1sxt8_1cneo_233",
10
- "position-fixed": "awsui_position-fixed_1sxt8_1cneo_233",
11
- "with-footer": "awsui_with-footer_1sxt8_1cneo_236",
12
- "position-static": "awsui_position-static_1sxt8_1cneo_240",
13
- "content": "awsui_content_1sxt8_1cneo_243",
14
- "header": "awsui_header_1sxt8_1cneo_271",
15
- "hide-close-action": "awsui_hide-close-action_1sxt8_1cneo_287",
16
- "with-additional-action": "awsui_with-additional-action_1sxt8_1cneo_291",
17
- "with-runtime-context": "awsui_with-runtime-context_1sxt8_1cneo_299",
18
- "with-toolbar": "awsui_with-toolbar_1sxt8_1cneo_302",
19
- "header-actions": "awsui_header-actions_1sxt8_1cneo_321",
20
- "close-action": "awsui_close-action_1sxt8_1cneo_327",
21
- "content-with-paddings": "awsui_content-with-paddings_1sxt8_1cneo_333",
22
- "footer": "awsui_footer_1sxt8_1cneo_340",
23
- "is-sticky": "awsui_is-sticky_1sxt8_1cneo_346",
24
- "test-utils-drawer-content": "awsui_test-utils-drawer-content_1sxt8_1cneo_354",
25
- "hidden": "awsui_hidden_1sxt8_1cneo_358",
26
- "focus-trap": "awsui_focus-trap_1sxt8_1cneo_362",
27
- "backdrop": "awsui_backdrop_1sxt8_1cneo_366",
28
- "backdrop-fixed": "awsui_backdrop-fixed_1sxt8_1cneo_370",
29
- "backdrop-absolute": "awsui_backdrop-absolute_1sxt8_1cneo_373"
5
+ "root": "awsui_root_1sxt8_ygv0p_193",
6
+ "drawer": "awsui_drawer_1sxt8_ygv0p_197",
7
+ "has-close-action": "awsui_has-close-action_1sxt8_ygv0p_230",
8
+ "position-absolute": "awsui_position-absolute_1sxt8_ygv0p_233",
9
+ "placement-end": "awsui_placement-end_1sxt8_ygv0p_233",
10
+ "position-sticky": "awsui_position-sticky_1sxt8_ygv0p_233",
11
+ "position-fixed": "awsui_position-fixed_1sxt8_ygv0p_233",
12
+ "placement-start": "awsui_placement-start_1sxt8_ygv0p_236",
13
+ "placement-top": "awsui_placement-top_1sxt8_ygv0p_239",
14
+ "placement-bottom": "awsui_placement-bottom_1sxt8_ygv0p_242",
15
+ "with-footer": "awsui_with-footer_1sxt8_ygv0p_245",
16
+ "position-static": "awsui_position-static_1sxt8_ygv0p_249",
17
+ "content": "awsui_content_1sxt8_ygv0p_252",
18
+ "header": "awsui_header_1sxt8_ygv0p_280",
19
+ "hide-close-action": "awsui_hide-close-action_1sxt8_ygv0p_296",
20
+ "with-additional-action": "awsui_with-additional-action_1sxt8_ygv0p_300",
21
+ "with-runtime-context": "awsui_with-runtime-context_1sxt8_ygv0p_308",
22
+ "with-toolbar": "awsui_with-toolbar_1sxt8_ygv0p_311",
23
+ "header-actions": "awsui_header-actions_1sxt8_ygv0p_330",
24
+ "close-action": "awsui_close-action_1sxt8_ygv0p_336",
25
+ "content-with-paddings": "awsui_content-with-paddings_1sxt8_ygv0p_342",
26
+ "footer": "awsui_footer_1sxt8_ygv0p_349",
27
+ "is-sticky": "awsui_is-sticky_1sxt8_ygv0p_355",
28
+ "test-utils-drawer-content": "awsui_test-utils-drawer-content_1sxt8_ygv0p_363",
29
+ "hidden": "awsui_hidden_1sxt8_ygv0p_367",
30
+ "focus-trap": "awsui_focus-trap_1sxt8_ygv0p_371",
31
+ "backdrop": "awsui_backdrop_1sxt8_ygv0p_375",
32
+ "backdrop-fixed": "awsui_backdrop-fixed_1sxt8_ygv0p_379",
33
+ "backdrop-absolute": "awsui_backdrop-absolute_1sxt8_ygv0p_382"
30
34
  };
31
35
 
package/drawer/utils.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
- import { NextDrawerProps } from './interfaces';
3
- type PositionProps = Pick<NextDrawerProps, 'position' | 'placement' | 'offset' | 'stickyOffset' | 'zIndex'>;
2
+ import { DrawerProps } from './interfaces';
3
+ type PositionProps = Pick<DrawerProps, 'position' | 'placement' | 'offset' | 'stickyOffset' | 'zIndex'>;
4
4
  export declare function getPositionStyles({
5
5
  position,
6
6
  zIndex,
@@ -1 +1 @@
1
- {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/drawer/utils.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAI/C,KAAK,aAAa,GAAG,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,WAAW,GAAG,QAAQ,GAAG,cAAc,GAAG,QAAQ,CAAC,CAAC;AAE5G,wBAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,GAAG;IAChF,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC;CAC5B,CAmBA"}
1
+ {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/drawer/utils.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAI3C,KAAK,aAAa,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,WAAW,GAAG,QAAQ,GAAG,cAAc,GAAG,QAAQ,CAAC,CAAC;AAExG,wBAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,GAAG;IAChF,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC;CAC5B,CAmBA"}
package/drawer/utils.js CHANGED
@@ -1,5 +1,6 @@
1
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
2
  // SPDX-License-Identifier: Apache-2.0
3
+ import clsx from 'clsx';
3
4
  import { warnOnce } from '@cloudscape-design/component-toolkit/internal';
4
5
  import styles from './styles.css.js';
5
6
  export function getPositionStyles({ position, zIndex, ...props }) {
@@ -9,18 +10,18 @@ export function getPositionStyles({ position, zIndex, ...props }) {
9
10
  }
10
11
  switch (position) {
11
12
  case 'absolute':
12
- return getStyles(position, { position: 'absolute', zIndex, ...computeAbsoluteOffsets(props) });
13
+ return getStyles(position, { position: 'absolute', zIndex, ...computeAbsoluteOffsets(props) }, props.placement);
13
14
  case 'sticky':
14
- return getStyles(position, { position: 'sticky', zIndex, ...computeStickyOffsets(props) });
15
+ return getStyles(position, { position: 'sticky', zIndex, ...computeStickyOffsets(props) }, props.placement);
15
16
  case 'fixed':
16
- return getStyles(position, { position: 'fixed', zIndex, ...computeAbsoluteOffsets(props) });
17
+ return getStyles(position, { position: 'fixed', zIndex, ...computeAbsoluteOffsets(props) }, props.placement);
17
18
  case 'static':
18
19
  default:
19
20
  return getStyles(position);
20
21
  }
21
22
  }
22
- function getStyles(position = 'static', style = {}) {
23
- return { className: styles[`position-${position}`], style };
23
+ function getStyles(position = 'static', style = {}, placement) {
24
+ return { className: clsx(styles[`position-${position}`], placement && styles[`placement-${placement}`]), style };
24
25
  }
25
26
  function computeAbsoluteOffsets({ placement, offset: { top, bottom, start, end } = {}, }) {
26
27
  const style = {};
@@ -1 +1 @@
1
- {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/drawer/utils.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAItC,OAAO,EAAE,QAAQ,EAAE,MAAM,+CAA+C,CAAC;AAIzE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,UAAU,iBAAiB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,KAAK,EAAiB;IAI7E,IAAI,QAAQ,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,SAAS,KAAK,OAAO,IAAI,KAAK,CAAC,SAAS,KAAK,KAAK,CAAC,EAAE,CAAC;QACxF,QAAQ,CACN,QAAQ,EACR,sDAAsD,KAAK,CAAC,SAAS,wCAAwC,CAC9G,CAAC;QACF,QAAQ,GAAG,QAAQ,CAAC;IACtB,CAAC;IACD,QAAQ,QAAQ,EAAE,CAAC;QACjB,KAAK,UAAU;YACb,OAAO,SAAS,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,GAAG,sBAAsB,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;QACjG,KAAK,QAAQ;YACX,OAAO,SAAS,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,oBAAoB,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;QAC7F,KAAK,OAAO;YACV,OAAO,SAAS,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,sBAAsB,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;QAC9F,KAAK,QAAQ,CAAC;QACd;YACE,OAAO,SAAS,CAAC,QAAQ,CAAC,CAAC;IAC/B,CAAC;AACH,CAAC;AAED,SAAS,SAAS,CAAC,WAAqC,QAAQ,EAAE,QAA6B,EAAE;IAC/F,OAAO,EAAE,SAAS,EAAE,MAAM,CAAC,YAAY,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC;AAC9D,CAAC;AAED,SAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,GACM;IAC9C,MAAM,KAAK,GAAwB,EAAE,CAAC;IACtC,MAAM,MAAM,GAAG,EAAE,GAAG,EAAE,GAAG,aAAH,GAAG,cAAH,GAAG,GAAI,CAAC,EAAE,MAAM,EAAE,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,CAAC,EAAE,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,CAAC,EAAE,GAAG,EAAE,GAAG,aAAH,GAAG,cAAH,GAAG,GAAI,CAAC,EAAE,CAAC;IACxF,QAAQ,SAAS,EAAE,CAAC;QAClB,KAAK,KAAK;YACR,KAAK,CAAC,eAAe,GAAG,MAAM,CAAC,GAAG,CAAC;YACnC,KAAK,CAAC,gBAAgB,GAAG,MAAM,CAAC,KAAK,CAAC;YACtC,KAAK,CAAC,cAAc,GAAG,MAAM,CAAC,GAAG,CAAC;YAClC,MAAM;QACR,KAAK,QAAQ;YACX,KAAK,CAAC,aAAa,GAAG,MAAM,CAAC,MAAM,CAAC;YACpC,KAAK,CAAC,gBAAgB,GAAG,MAAM,CAAC,KAAK,CAAC;YACtC,KAAK,CAAC,cAAc,GAAG,MAAM,CAAC,GAAG,CAAC;YAClC,MAAM;QACR,KAAK,OAAO;YACV,KAAK,CAAC,gBAAgB,GAAG,MAAM,CAAC,KAAK,CAAC;YACtC,KAAK,CAAC,eAAe,GAAG,MAAM,CAAC,GAAG,CAAC;YACnC,KAAK,CAAC,aAAa,GAAG,MAAM,CAAC,MAAM,CAAC;YACpC,MAAM;QACR,KAAK,KAAK;YACR,KAAK,CAAC,cAAc,GAAG,MAAM,CAAC,GAAG,CAAC;YAClC,KAAK,CAAC,eAAe,GAAG,MAAM,CAAC,GAAG,CAAC;YACnC,KAAK,CAAC,aAAa,GAAG,MAAM,CAAC,MAAM,CAAC;YACpC,MAAM;IACV,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC;AAED,SAAS,oBAAoB,CAAC,EAC5B,SAAS,EACT,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,EACxC,YAAY,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,EAAE,YAAY,EAAE,GAAG,EAAE,GACI;IAC/D,MAAM,KAAK,GAAwB,EAAE,CAAC;IACtC,MAAM,MAAM,GAAG,EAAE,GAAG,EAAE,GAAG,aAAH,GAAG,cAAH,GAAG,GAAI,CAAC,EAAE,MAAM,EAAE,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,CAAC,EAAE,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,CAAC,EAAE,GAAG,EAAE,GAAG,aAAH,GAAG,cAAH,GAAG,GAAI,CAAC,EAAE,CAAC;IACxF,MAAM,YAAY,GAAG,EAAE,GAAG,EAAE,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,CAAC,EAAE,MAAM,EAAE,YAAY,aAAZ,YAAY,cAAZ,YAAY,GAAI,CAAC,EAAE,CAAC;IACxE,QAAQ,SAAS,EAAE,CAAC;QAClB,KAAK,KAAK;YACR,KAAK,CAAC,eAAe,GAAG,YAAY,CAAC,GAAG,CAAC;YACzC,KAAK,CAAC,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAC;YACpC,KAAK,CAAC,iBAAiB,GAAG,MAAM,CAAC,KAAK,CAAC;YACvC,KAAK,CAAC,eAAe,GAAG,MAAM,CAAC,GAAG,CAAC;YACnC,KAAK,CAAC,UAAU,GAAG,eAAe,MAAM,CAAC,KAAK,GAAG,MAAM,CAAC,GAAG,KAAK,CAAC;YACjE,MAAM;QACR,KAAK,QAAQ;YACX,KAAK,CAAC,aAAa,GAAG,YAAY,CAAC,MAAM,CAAC;YAC1C,KAAK,CAAC,cAAc,GAAG,MAAM,CAAC,MAAM,CAAC;YACrC,KAAK,CAAC,iBAAiB,GAAG,MAAM,CAAC,KAAK,CAAC;YACvC,KAAK,CAAC,eAAe,GAAG,MAAM,CAAC,GAAG,CAAC;YACnC,KAAK,CAAC,UAAU,GAAG,eAAe,MAAM,CAAC,KAAK,GAAG,MAAM,CAAC,GAAG,KAAK,CAAC;YACjE,MAAM;IACV,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React from 'react';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport { NextDrawerProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\ntype PositionProps = Pick<NextDrawerProps, 'position' | 'placement' | 'offset' | 'stickyOffset' | 'zIndex'>;\n\nexport function getPositionStyles({ position, zIndex, ...props }: PositionProps): {\n className: string;\n style: React.CSSProperties;\n} {\n if (position === 'sticky' && (props.placement === 'start' || props.placement === 'end')) {\n warnOnce(\n 'Drawer',\n `position=\"sticky\" is not supported with placement=\"${props.placement}\" and falls back to position=\"static\".`\n );\n position = 'static';\n }\n switch (position) {\n case 'absolute':\n return getStyles(position, { position: 'absolute', zIndex, ...computeAbsoluteOffsets(props) });\n case 'sticky':\n return getStyles(position, { position: 'sticky', zIndex, ...computeStickyOffsets(props) });\n case 'fixed':\n return getStyles(position, { position: 'fixed', zIndex, ...computeAbsoluteOffsets(props) });\n case 'static':\n default:\n return getStyles(position);\n }\n}\n\nfunction getStyles(position: NextDrawerProps.Position = 'static', style: React.CSSProperties = {}) {\n return { className: styles[`position-${position}`], style };\n}\n\nfunction computeAbsoluteOffsets({\n placement,\n offset: { top, bottom, start, end } = {},\n}: Pick<NextDrawerProps, 'placement' | 'offset'>) {\n const style: React.CSSProperties = {};\n const offset = { top: top ?? 0, bottom: bottom ?? 0, start: start ?? 0, end: end ?? 0 };\n switch (placement) {\n case 'top':\n style.insetBlockStart = offset.top;\n style.insetInlineStart = offset.start;\n style.insetInlineEnd = offset.end;\n break;\n case 'bottom':\n style.insetBlockEnd = offset.bottom;\n style.insetInlineStart = offset.start;\n style.insetInlineEnd = offset.end;\n break;\n case 'start':\n style.insetInlineStart = offset.start;\n style.insetBlockStart = offset.top;\n style.insetBlockEnd = offset.bottom;\n break;\n case 'end':\n style.insetInlineEnd = offset.end;\n style.insetBlockStart = offset.top;\n style.insetBlockEnd = offset.bottom;\n break;\n }\n return style;\n}\n\nfunction computeStickyOffsets({\n placement,\n offset: { top, bottom, start, end } = {},\n stickyOffset: { top: stickyTop, bottom: stickyBottom } = {},\n}: Pick<NextDrawerProps, 'placement' | 'offset' | 'stickyOffset'>) {\n const style: React.CSSProperties = {};\n const offset = { top: top ?? 0, bottom: bottom ?? 0, start: start ?? 0, end: end ?? 0 };\n const stickyOffset = { top: stickyTop ?? 0, bottom: stickyBottom ?? 0 };\n switch (placement) {\n case 'top':\n style.insetBlockStart = stickyOffset.top;\n style.marginBlockStart = offset.top;\n style.marginInlineStart = offset.start;\n style.marginInlineEnd = offset.end;\n style.inlineSize = `calc(100% - ${offset.start + offset.end}px)`;\n break;\n case 'bottom':\n style.insetBlockEnd = stickyOffset.bottom;\n style.marginBlockEnd = offset.bottom;\n style.marginInlineStart = offset.start;\n style.marginInlineEnd = offset.end;\n style.inlineSize = `calc(100% - ${offset.start + offset.end}px)`;\n break;\n }\n return style;\n}\n"]}
1
+ {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/drawer/utils.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport { DrawerProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\ntype PositionProps = Pick<DrawerProps, 'position' | 'placement' | 'offset' | 'stickyOffset' | 'zIndex'>;\n\nexport function getPositionStyles({ position, zIndex, ...props }: PositionProps): {\n className: string;\n style: React.CSSProperties;\n} {\n if (position === 'sticky' && (props.placement === 'start' || props.placement === 'end')) {\n warnOnce(\n 'Drawer',\n `position=\"sticky\" is not supported with placement=\"${props.placement}\" and falls back to position=\"static\".`\n );\n position = 'static';\n }\n switch (position) {\n case 'absolute':\n return getStyles(position, { position: 'absolute', zIndex, ...computeAbsoluteOffsets(props) }, props.placement);\n case 'sticky':\n return getStyles(position, { position: 'sticky', zIndex, ...computeStickyOffsets(props) }, props.placement);\n case 'fixed':\n return getStyles(position, { position: 'fixed', zIndex, ...computeAbsoluteOffsets(props) }, props.placement);\n case 'static':\n default:\n return getStyles(position);\n }\n}\n\nfunction getStyles(\n position: DrawerProps.Position = 'static',\n style: React.CSSProperties = {},\n placement?: DrawerProps.Placement\n) {\n return { className: clsx(styles[`position-${position}`], placement && styles[`placement-${placement}`]), style };\n}\n\nfunction computeAbsoluteOffsets({\n placement,\n offset: { top, bottom, start, end } = {},\n}: Pick<DrawerProps, 'placement' | 'offset'>) {\n const style: React.CSSProperties = {};\n const offset = { top: top ?? 0, bottom: bottom ?? 0, start: start ?? 0, end: end ?? 0 };\n switch (placement) {\n case 'top':\n style.insetBlockStart = offset.top;\n style.insetInlineStart = offset.start;\n style.insetInlineEnd = offset.end;\n break;\n case 'bottom':\n style.insetBlockEnd = offset.bottom;\n style.insetInlineStart = offset.start;\n style.insetInlineEnd = offset.end;\n break;\n case 'start':\n style.insetInlineStart = offset.start;\n style.insetBlockStart = offset.top;\n style.insetBlockEnd = offset.bottom;\n break;\n case 'end':\n style.insetInlineEnd = offset.end;\n style.insetBlockStart = offset.top;\n style.insetBlockEnd = offset.bottom;\n break;\n }\n return style;\n}\n\nfunction computeStickyOffsets({\n placement,\n offset: { top, bottom, start, end } = {},\n stickyOffset: { top: stickyTop, bottom: stickyBottom } = {},\n}: Pick<DrawerProps, 'placement' | 'offset' | 'stickyOffset'>) {\n const style: React.CSSProperties = {};\n const offset = { top: top ?? 0, bottom: bottom ?? 0, start: start ?? 0, end: end ?? 0 };\n const stickyOffset = { top: stickyTop ?? 0, bottom: stickyBottom ?? 0 };\n switch (placement) {\n case 'top':\n style.insetBlockStart = stickyOffset.top;\n style.marginBlockStart = offset.top;\n style.marginInlineStart = offset.start;\n style.marginInlineEnd = offset.end;\n style.inlineSize = `calc(100% - ${offset.start + offset.end}px)`;\n break;\n case 'bottom':\n style.insetBlockEnd = stickyOffset.bottom;\n style.marginBlockEnd = offset.bottom;\n style.marginInlineStart = offset.start;\n style.marginInlineEnd = offset.end;\n style.inlineSize = `calc(100% - ${offset.start + offset.end}px)`;\n break;\n }\n return style;\n}\n"]}
@@ -1,29 +1,29 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "error-icon-shake-wrapper": "awsui_error-icon-shake-wrapper_14mhv_1a5zf_153",
5
- "warning-icon-shake-wrapper": "awsui_warning-icon-shake-wrapper_14mhv_1a5zf_154",
6
- "awsui-motion-shake-horizontally": "awsui_awsui-motion-shake-horizontally_14mhv_1a5zf_1",
7
- "error-icon-scale-wrapper": "awsui_error-icon-scale-wrapper_14mhv_1a5zf_184",
8
- "warning-icon-scale-wrapper": "awsui_warning-icon-scale-wrapper_14mhv_1a5zf_185",
9
- "awsui-motion-scale-popup": "awsui_awsui-motion-scale-popup_14mhv_1a5zf_1",
10
- "warning": "awsui_warning_14mhv_1a5zf_154",
11
- "error": "awsui_error_14mhv_1a5zf_153",
12
- "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_14mhv_1a5zf_1",
13
- "root": "awsui_root_14mhv_1a5zf_236",
14
- "label": "awsui_label_14mhv_1a5zf_269",
15
- "info": "awsui_info_14mhv_1a5zf_285",
16
- "description": "awsui_description_14mhv_1a5zf_291",
17
- "constraint": "awsui_constraint_14mhv_1a5zf_292",
18
- "hints": "awsui_hints_14mhv_1a5zf_299",
19
- "constraint-has-validation-text": "awsui_constraint-has-validation-text_14mhv_1a5zf_300",
20
- "secondary-control": "awsui_secondary-control_14mhv_1a5zf_304",
21
- "controls": "awsui_controls_14mhv_1a5zf_308",
22
- "label-hidden": "awsui_label-hidden_14mhv_1a5zf_308",
23
- "label-wrapper": "awsui_label-wrapper_14mhv_1a5zf_311",
24
- "control": "awsui_control_14mhv_1a5zf_308",
25
- "error__message": "awsui_error__message_14mhv_1a5zf_338",
26
- "warning__message": "awsui_warning__message_14mhv_1a5zf_339",
27
- "visually-hidden": "awsui_visually-hidden_14mhv_1a5zf_343"
4
+ "error-icon-shake-wrapper": "awsui_error-icon-shake-wrapper_14mhv_ilwf6_153",
5
+ "warning-icon-shake-wrapper": "awsui_warning-icon-shake-wrapper_14mhv_ilwf6_154",
6
+ "awsui-motion-shake-horizontally": "awsui_awsui-motion-shake-horizontally_14mhv_ilwf6_1",
7
+ "error-icon-scale-wrapper": "awsui_error-icon-scale-wrapper_14mhv_ilwf6_184",
8
+ "warning-icon-scale-wrapper": "awsui_warning-icon-scale-wrapper_14mhv_ilwf6_185",
9
+ "awsui-motion-scale-popup": "awsui_awsui-motion-scale-popup_14mhv_ilwf6_1",
10
+ "warning": "awsui_warning_14mhv_ilwf6_154",
11
+ "error": "awsui_error_14mhv_ilwf6_153",
12
+ "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_14mhv_ilwf6_1",
13
+ "root": "awsui_root_14mhv_ilwf6_236",
14
+ "label": "awsui_label_14mhv_ilwf6_269",
15
+ "info": "awsui_info_14mhv_ilwf6_285",
16
+ "description": "awsui_description_14mhv_ilwf6_291",
17
+ "constraint": "awsui_constraint_14mhv_ilwf6_292",
18
+ "hints": "awsui_hints_14mhv_ilwf6_299",
19
+ "constraint-has-validation-text": "awsui_constraint-has-validation-text_14mhv_ilwf6_300",
20
+ "secondary-control": "awsui_secondary-control_14mhv_ilwf6_304",
21
+ "controls": "awsui_controls_14mhv_ilwf6_308",
22
+ "label-hidden": "awsui_label-hidden_14mhv_ilwf6_308",
23
+ "label-wrapper": "awsui_label-wrapper_14mhv_ilwf6_311",
24
+ "control": "awsui_control_14mhv_ilwf6_308",
25
+ "error__message": "awsui_error__message_14mhv_ilwf6_338",
26
+ "warning__message": "awsui_warning__message_14mhv_ilwf6_339",
27
+ "visually-hidden": "awsui_visually-hidden_14mhv_ilwf6_343"
28
28
  };
29
29