@cloudscape-design/components 3.0.67 → 3.0.68

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.
@@ -16,7 +16,7 @@ var DropdownTrigger = function (clickHandler, ref, isDisabled, isExpanded, ariaL
16
16
  return (React.createElement(InternalButton, { disabled: isDisabled, onClick: function (event) {
17
17
  event.preventDefault();
18
18
  clickHandler();
19
- }, ref: ref, "aria-expanded": isExpanded ? true : undefined, "aria-haspopup": true, ariaLabel: ariaLabel, variant: "breadcrumb-group", formAction: "none" }, "..."));
19
+ }, ref: ref, ariaExpanded: isExpanded, "aria-haspopup": true, ariaLabel: ariaLabel, variant: "breadcrumb-group", formAction: "none" }, "..."));
20
20
  };
21
21
  var EllipsisDropdown = function (_a) {
22
22
  var ariaLabel = _a.ariaLabel, dropdownItems = _a.dropdownItems, onDropdownItemClick = _a.onDropdownItemClick, onDropdownItemFollow = _a.onDropdownItemFollow;
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/breadcrumb-group/internal.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 styles from './styles.css.js';\nimport clsx from 'clsx';\nimport InternalIcon from '../icon/internal';\nimport InternalButtonDropdown from '../button-dropdown/internal';\nimport { LinkItem } from '../button-dropdown/interfaces';\nimport { InternalButton } from '../button/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { BreadcrumbItem } from './item/item';\nimport { BreadcrumbGroupProps, EllipsisDropdownProps } from './interfaces';\nimport { fireCancelableEvent } from '../internal/events';\nimport { getBaseProps } from '../internal/base-component';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { SomeRequired } from '../internal/types.js';\n\nconst DropdownTrigger = (\n clickHandler: () => void,\n ref: React.Ref<ButtonProps.Ref>,\n isDisabled: boolean,\n isExpanded: boolean,\n ariaLabel?: string\n) => {\n return (\n <InternalButton\n disabled={isDisabled}\n onClick={event => {\n event.preventDefault();\n clickHandler();\n }}\n ref={ref}\n aria-expanded={isExpanded ? true : undefined}\n aria-haspopup={true}\n ariaLabel={ariaLabel}\n variant=\"breadcrumb-group\"\n formAction=\"none\"\n >\n ...\n </InternalButton>\n );\n};\n\nconst EllipsisDropdown = ({\n ariaLabel,\n dropdownItems,\n onDropdownItemClick,\n onDropdownItemFollow,\n}: EllipsisDropdownProps) => {\n return (\n <li className={styles.ellipsis}>\n <InternalButtonDropdown\n ariaLabel={ariaLabel}\n items={dropdownItems}\n onItemClick={onDropdownItemClick}\n onItemFollow={onDropdownItemFollow}\n customTriggerBuilder={DropdownTrigger}\n />\n <span className={styles.icon}>\n <InternalIcon name=\"angle-right\" />\n </span>\n </li>\n );\n};\n\nexport const getEventDetail = <T extends BreadcrumbGroupProps.Item>(item: T) => ({\n item,\n text: item.text,\n href: item.href,\n});\n\ntype InternalBreadcrumbGroupProps<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item> = SomeRequired<\n BreadcrumbGroupProps<T>,\n 'expandAriaLabel'\n> &\n InternalBaseComponentProps;\n\nexport default function InternalBreadcrumbGroup<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item>({\n items = [],\n ariaLabel,\n expandAriaLabel,\n onClick,\n onFollow,\n __internalRootRef,\n ...props\n}: InternalBreadcrumbGroupProps<T>) {\n for (const item of items) {\n checkSafeUrl('BreadcrumbGroup', item.href);\n }\n const baseProps = getBaseProps(props);\n const isMobile = useMobile();\n\n let breadcrumbItems = items.map((item, index) => {\n return (\n <li className={styles.item} key={index}>\n <BreadcrumbItem\n item={item}\n onClick={onClick}\n onFollow={onFollow}\n isCompressed={isMobile}\n isLast={index === items.length - 1}\n />\n </li>\n );\n });\n\n const getEventItem = (e: CustomEvent<{ id: string }>) => {\n const { id } = e.detail;\n return items[parseInt(id)];\n };\n\n // Add ellipsis\n if (breadcrumbItems.length >= 3) {\n const dropdownItems: Array<LinkItem> = items\n .slice(1, items.length - 1)\n .map((item: BreadcrumbGroupProps.Item, index: number) => ({\n id: (index + 1).toString(), // the first item doesn't get inside dropdown\n text: item.text,\n href: item.href || '#',\n }));\n\n breadcrumbItems = [\n breadcrumbItems[0],\n <EllipsisDropdown\n key={'ellipsis'}\n ariaLabel={expandAriaLabel}\n dropdownItems={dropdownItems}\n onDropdownItemClick={e => fireCancelableEvent(onClick, getEventDetail(getEventItem(e)), e)}\n onDropdownItemFollow={e => fireCancelableEvent(onFollow, getEventDetail(getEventItem(e)), e)}\n />,\n ...breadcrumbItems.slice(1),\n ];\n }\n\n return (\n <nav\n {...baseProps}\n className={clsx(styles['breadcrumb-group'], isMobile && styles.mobile, baseProps.className)}\n aria-label={ariaLabel || undefined}\n ref={__internalRootRef}\n >\n <ol className={styles['breadcrumb-group-list']}>{breadcrumbItems}</ol>\n </nav>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/breadcrumb-group/internal.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 styles from './styles.css.js';\nimport clsx from 'clsx';\nimport InternalIcon from '../icon/internal';\nimport InternalButtonDropdown from '../button-dropdown/internal';\nimport { LinkItem } from '../button-dropdown/interfaces';\nimport { InternalButton } from '../button/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { BreadcrumbItem } from './item/item';\nimport { BreadcrumbGroupProps, EllipsisDropdownProps } from './interfaces';\nimport { fireCancelableEvent } from '../internal/events';\nimport { getBaseProps } from '../internal/base-component';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { SomeRequired } from '../internal/types.js';\n\nconst DropdownTrigger = (\n clickHandler: () => void,\n ref: React.Ref<ButtonProps.Ref>,\n isDisabled: boolean,\n isExpanded: boolean,\n ariaLabel?: string\n) => {\n return (\n <InternalButton\n disabled={isDisabled}\n onClick={event => {\n event.preventDefault();\n clickHandler();\n }}\n ref={ref}\n ariaExpanded={isExpanded}\n aria-haspopup={true}\n ariaLabel={ariaLabel}\n variant=\"breadcrumb-group\"\n formAction=\"none\"\n >\n ...\n </InternalButton>\n );\n};\n\nconst EllipsisDropdown = ({\n ariaLabel,\n dropdownItems,\n onDropdownItemClick,\n onDropdownItemFollow,\n}: EllipsisDropdownProps) => {\n return (\n <li className={styles.ellipsis}>\n <InternalButtonDropdown\n ariaLabel={ariaLabel}\n items={dropdownItems}\n onItemClick={onDropdownItemClick}\n onItemFollow={onDropdownItemFollow}\n customTriggerBuilder={DropdownTrigger}\n />\n <span className={styles.icon}>\n <InternalIcon name=\"angle-right\" />\n </span>\n </li>\n );\n};\n\nexport const getEventDetail = <T extends BreadcrumbGroupProps.Item>(item: T) => ({\n item,\n text: item.text,\n href: item.href,\n});\n\ntype InternalBreadcrumbGroupProps<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item> = SomeRequired<\n BreadcrumbGroupProps<T>,\n 'expandAriaLabel'\n> &\n InternalBaseComponentProps;\n\nexport default function InternalBreadcrumbGroup<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item>({\n items = [],\n ariaLabel,\n expandAriaLabel,\n onClick,\n onFollow,\n __internalRootRef,\n ...props\n}: InternalBreadcrumbGroupProps<T>) {\n for (const item of items) {\n checkSafeUrl('BreadcrumbGroup', item.href);\n }\n const baseProps = getBaseProps(props);\n const isMobile = useMobile();\n\n let breadcrumbItems = items.map((item, index) => {\n return (\n <li className={styles.item} key={index}>\n <BreadcrumbItem\n item={item}\n onClick={onClick}\n onFollow={onFollow}\n isCompressed={isMobile}\n isLast={index === items.length - 1}\n />\n </li>\n );\n });\n\n const getEventItem = (e: CustomEvent<{ id: string }>) => {\n const { id } = e.detail;\n return items[parseInt(id)];\n };\n\n // Add ellipsis\n if (breadcrumbItems.length >= 3) {\n const dropdownItems: Array<LinkItem> = items\n .slice(1, items.length - 1)\n .map((item: BreadcrumbGroupProps.Item, index: number) => ({\n id: (index + 1).toString(), // the first item doesn't get inside dropdown\n text: item.text,\n href: item.href || '#',\n }));\n\n breadcrumbItems = [\n breadcrumbItems[0],\n <EllipsisDropdown\n key={'ellipsis'}\n ariaLabel={expandAriaLabel}\n dropdownItems={dropdownItems}\n onDropdownItemClick={e => fireCancelableEvent(onClick, getEventDetail(getEventItem(e)), e)}\n onDropdownItemFollow={e => fireCancelableEvent(onFollow, getEventDetail(getEventItem(e)), e)}\n />,\n ...breadcrumbItems.slice(1),\n ];\n }\n\n return (\n <nav\n {...baseProps}\n className={clsx(styles['breadcrumb-group'], isMobile && styles.mobile, baseProps.className)}\n aria-label={ariaLabel || undefined}\n ref={__internalRootRef}\n >\n <ol className={styles['breadcrumb-group-list']}>{breadcrumbItems}</ol>\n </nav>\n );\n}\n"]}
@@ -1,21 +1,21 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "root": "awsui_root_14iqq_nllvs_97",
5
- "variant-default": "awsui_variant-default_14iqq_nllvs_109",
6
- "variant-stacked": "awsui_variant-stacked_14iqq_nllvs_109",
7
- "header": "awsui_header_14iqq_nllvs_132",
8
- "header-sticky-disabled": "awsui_header-sticky-disabled_14iqq_nllvs_137",
9
- "header-sticky-enabled": "awsui_header-sticky-enabled_14iqq_nllvs_141",
10
- "header-stuck": "awsui_header-stuck_14iqq_nllvs_147",
11
- "header-dynamic-height": "awsui_header-dynamic-height_14iqq_nllvs_152",
12
- "with-paddings": "awsui_with-paddings_14iqq_nllvs_158",
13
- "with-hidden-content": "awsui_with-hidden-content_14iqq_nllvs_161",
14
- "header-variant-cards": "awsui_header-variant-cards_14iqq_nllvs_165",
15
- "header-variant-full-page": "awsui_header-variant-full-page_14iqq_nllvs_189",
16
- "dark-header": "awsui_dark-header_14iqq_nllvs_197",
17
- "content": "awsui_content_14iqq_nllvs_201",
18
- "footer": "awsui_footer_14iqq_nllvs_208",
19
- "with-divider": "awsui_with-divider_14iqq_nllvs_211"
4
+ "root": "awsui_root_14iqq_xfc54_97",
5
+ "variant-default": "awsui_variant-default_14iqq_xfc54_110",
6
+ "variant-stacked": "awsui_variant-stacked_14iqq_xfc54_110",
7
+ "header": "awsui_header_14iqq_xfc54_133",
8
+ "header-sticky-disabled": "awsui_header-sticky-disabled_14iqq_xfc54_139",
9
+ "header-sticky-enabled": "awsui_header-sticky-enabled_14iqq_xfc54_143",
10
+ "header-stuck": "awsui_header-stuck_14iqq_xfc54_149",
11
+ "header-dynamic-height": "awsui_header-dynamic-height_14iqq_xfc54_154",
12
+ "with-paddings": "awsui_with-paddings_14iqq_xfc54_160",
13
+ "with-hidden-content": "awsui_with-hidden-content_14iqq_xfc54_163",
14
+ "header-variant-cards": "awsui_header-variant-cards_14iqq_xfc54_167",
15
+ "header-variant-full-page": "awsui_header-variant-full-page_14iqq_xfc54_191",
16
+ "dark-header": "awsui_dark-header_14iqq_xfc54_199",
17
+ "content": "awsui_content_14iqq_xfc54_203",
18
+ "footer": "awsui_footer_14iqq_xfc54_213",
19
+ "with-divider": "awsui_with-divider_14iqq_xfc54_219"
20
20
  };
21
21
 
@@ -94,7 +94,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
94
94
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
95
95
  SPDX-License-Identifier: Apache-2.0
96
96
  */
97
- .awsui_root_14iqq_nllvs_97:not(#\9) {
97
+ .awsui_root_14iqq_xfc54_97:not(#\9) {
98
98
  /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
99
99
  border-collapse: separate;
100
100
  border-spacing: 0;
@@ -129,10 +129,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
129
129
  color: var(--color-text-body-default-ajf1h5, #000716);
130
130
  font-weight: 400;
131
131
  font-family: var(--font-family-base-qnistn, "Open Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
132
- display: block;
132
+ display: flex;
133
+ flex-flow: column nowrap;
133
134
  word-wrap: break-word;
134
135
  }
135
- .awsui_root_14iqq_nllvs_97.awsui_variant-default_14iqq_nllvs_109:not(#\9), .awsui_root_14iqq_nllvs_97.awsui_variant-stacked_14iqq_nllvs_109:not(#\9) {
136
+ .awsui_root_14iqq_xfc54_97.awsui_variant-default_14iqq_xfc54_110:not(#\9), .awsui_root_14iqq_xfc54_97.awsui_variant-stacked_14iqq_xfc54_110:not(#\9) {
136
137
  box-shadow: var(--shadow-container-7nblnj, 0px 0px 1px 1px #e9ebed, 0px 1px 8px 2px rgba(0, 7, 22, 0.12));
137
138
  border-top: var(--border-container-top-width-jk6fhm, 0px) solid var(--color-border-container-top-srcvx4, transparent);
138
139
  border-radius: var(--border-radius-container-gh9ysk, 16px);
@@ -140,79 +141,80 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
140
141
  background-color: var(--color-background-container-content-i8i4a0, #ffffff);
141
142
  }
142
143
  @media screen and (-ms-high-contrast: active) {
143
- .awsui_root_14iqq_nllvs_97.awsui_variant-default_14iqq_nllvs_109:not(#\9), .awsui_root_14iqq_nllvs_97.awsui_variant-stacked_14iqq_nllvs_109:not(#\9) {
144
+ .awsui_root_14iqq_xfc54_97.awsui_variant-default_14iqq_xfc54_110:not(#\9), .awsui_root_14iqq_xfc54_97.awsui_variant-stacked_14iqq_xfc54_110:not(#\9) {
144
145
  border: var(--border-field-width-idlekx, 2px) solid var(--color-border-container-top-srcvx4, transparent);
145
146
  }
146
147
  }
147
- .awsui_root_14iqq_nllvs_97.awsui_variant-stacked_14iqq_nllvs_109:not(#\9):not(:last-child) {
148
+ .awsui_root_14iqq_xfc54_97.awsui_variant-stacked_14iqq_xfc54_110:not(#\9):not(:last-child) {
148
149
  border-bottom-right-radius: 0;
149
150
  border-bottom-left-radius: 0;
150
151
  }
151
- .awsui_root_14iqq_nllvs_97.awsui_variant-stacked_14iqq_nllvs_109 + .awsui_root_14iqq_nllvs_97.awsui_variant-stacked_14iqq_nllvs_109:not(#\9) {
152
+ .awsui_root_14iqq_xfc54_97.awsui_variant-stacked_14iqq_xfc54_110 + .awsui_root_14iqq_xfc54_97.awsui_variant-stacked_14iqq_xfc54_110:not(#\9) {
152
153
  border-top: var(--border-divider-section-width-4wm2it, 2px) solid var(--color-border-divider-default-7s2wjw, #e9ebed);
153
154
  border-top-left-radius: 0;
154
155
  border-top-right-radius: 0;
155
156
  box-shadow: var(--shadow-container-stacked-lumzae, -1px 1px 1px 0px #e9ebed, 1px 1px 1px 0px #e9ebed, 0px 9px 8px -7px rgba(0, 7, 22, 0.12), 8px 0px 8px -7px rgba(0, 7, 22, 0.12), -8px 0px 8px -7px rgba(0, 7, 22, 0.12));
156
157
  }
157
158
 
158
- .awsui_header_14iqq_nllvs_132:not(#\9) {
159
+ .awsui_header_14iqq_xfc54_133:not(#\9) {
160
+ flex: 0 0 auto;
159
161
  background-color: var(--color-background-container-header-4flbq5, #ffffff);
160
162
  border-top-left-radius: var(--border-radius-container-gh9ysk, 16px);
161
163
  border-top-right-radius: var(--border-radius-container-gh9ysk, 16px);
162
164
  }
163
- .awsui_header-sticky-disabled_14iqq_nllvs_137:not(#\9) {
165
+ .awsui_header-sticky-disabled_14iqq_xfc54_139:not(#\9) {
164
166
  position: relative;
165
167
  z-index: 1;
166
168
  }
167
- .awsui_header-sticky-enabled_14iqq_nllvs_141:not(#\9) {
169
+ .awsui_header-sticky-enabled_14iqq_xfc54_143:not(#\9) {
168
170
  top: 0;
169
171
  /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
170
172
  position: sticky;
171
173
  z-index: 800;
172
174
  }
173
- .awsui_header-stuck_14iqq_nllvs_147:not(#\9) {
175
+ .awsui_header-stuck_14iqq_xfc54_149:not(#\9) {
174
176
  box-shadow: var(--shadow-sticky-embedded-qit8ba, 0px 2px 0px 0px #e9ebed, 0px 16px 16px -12px rgba(0, 7, 22, 0.1));
175
177
  border: 0;
176
178
  border-radius: 0;
177
179
  }
178
- .awsui_header-dynamic-height_14iqq_nllvs_152.awsui_header-stuck_14iqq_nllvs_147:not(#\9) {
180
+ .awsui_header-dynamic-height_14iqq_xfc54_154.awsui_header-stuck_14iqq_xfc54_149:not(#\9) {
179
181
  margin-bottom: calc(var(--font-heading-xl-line-height-doxfdj, 40px) - var(--font-heading-l-line-height-gev4n1, 30px));
180
182
  }
181
- .awsui_header_14iqq_nllvs_132:not(#\9):not(:empty) {
183
+ .awsui_header_14iqq_xfc54_133:not(#\9):not(:empty) {
182
184
  border-bottom: var(--border-container-sticky-width-i7t7xe, 0px) solid var(--color-border-container-divider-4ade7z, transparent);
183
185
  }
184
- .awsui_header_14iqq_nllvs_132.awsui_with-paddings_14iqq_nllvs_158:not(#\9) {
186
+ .awsui_header_14iqq_xfc54_133.awsui_with-paddings_14iqq_xfc54_160:not(#\9) {
185
187
  padding: var(--space-container-header-vertical-zsjhel, 12px) var(--space-container-horizontal-ddrezg, 24px);
186
188
  }
187
- .awsui_header_14iqq_nllvs_132.awsui_with-hidden-content_14iqq_nllvs_161:not(#\9) {
189
+ .awsui_header_14iqq_xfc54_133.awsui_with-hidden-content_14iqq_xfc54_163:not(#\9) {
188
190
  border-bottom-left-radius: var(--border-radius-container-gh9ysk, 16px);
189
191
  border-bottom-right-radius: var(--border-radius-container-gh9ysk, 16px);
190
192
  }
191
- .awsui_header-variant-cards_14iqq_nllvs_165:not(#\9) {
193
+ .awsui_header-variant-cards_14iqq_xfc54_167:not(#\9) {
192
194
  box-shadow: var(--shadow-container-7nblnj, 0px 0px 1px 1px #e9ebed, 0px 1px 8px 2px rgba(0, 7, 22, 0.12));
193
195
  border-top: var(--border-container-top-width-jk6fhm, 0px) solid var(--color-border-container-top-srcvx4, transparent);
194
196
  border-radius: var(--border-radius-container-gh9ysk, 16px);
195
197
  box-sizing: border-box;
196
198
  }
197
199
  @media screen and (-ms-high-contrast: active) {
198
- .awsui_header-variant-cards_14iqq_nllvs_165:not(#\9) {
200
+ .awsui_header-variant-cards_14iqq_xfc54_167:not(#\9) {
199
201
  border: var(--border-field-width-idlekx, 2px) solid var(--color-border-container-top-srcvx4, transparent);
200
202
  }
201
203
  }
202
- .awsui_header-variant-cards_14iqq_nllvs_165:not(#\9):not(:empty) {
204
+ .awsui_header-variant-cards_14iqq_xfc54_167:not(#\9):not(:empty) {
203
205
  border-bottom: 1px solid #d5dbdb;
204
206
  /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
205
207
  }
206
208
  @supports (--css-variable-support-check: #000) {
207
- .awsui_header-variant-cards_14iqq_nllvs_165:not(#\9):not(:empty) {
209
+ .awsui_header-variant-cards_14iqq_xfc54_167:not(#\9):not(:empty) {
208
210
  border-bottom: 0;
209
211
  }
210
212
  }
211
- .awsui_header-variant-cards_14iqq_nllvs_165.awsui_header-stuck_14iqq_nllvs_147:not(#\9) {
213
+ .awsui_header-variant-cards_14iqq_xfc54_167.awsui_header-stuck_14iqq_xfc54_149:not(#\9) {
212
214
  border-top-left-radius: 0;
213
215
  border-top-right-radius: 0;
214
216
  }
215
- .awsui_header-variant-full-page_14iqq_nllvs_189.awsui_header-stuck_14iqq_nllvs_147:not(#\9) {
217
+ .awsui_header-variant-full-page_14iqq_xfc54_191.awsui_header-stuck_14iqq_xfc54_149:not(#\9) {
216
218
  box-shadow: var(--shadow-sticky-aijlo6, 0px 4px 20px 1px rgba(0, 7, 22, 0.1));
217
219
  }
218
220
 
@@ -220,20 +222,26 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
220
222
  The dynamic height dark header needs a background that will cover
221
223
  the default white background of the container component.
222
224
  */
223
- .awsui_dark-header_14iqq_nllvs_197:not(#\9) {
225
+ .awsui_dark-header_14iqq_xfc54_199:not(#\9) {
224
226
  background-color: var(--color-background-layout-main-sfhm4y, #ffffff);
225
227
  }
226
228
 
227
- .awsui_content_14iqq_nllvs_201.awsui_with-paddings_14iqq_nllvs_158:not(#\9) {
229
+ .awsui_content_14iqq_xfc54_203:not(#\9) {
230
+ flex: 1 0 auto;
231
+ }
232
+ .awsui_content_14iqq_xfc54_203.awsui_with-paddings_14iqq_xfc54_160:not(#\9) {
228
233
  padding: var(--space-scaled-l-t03y3z, 20px) var(--space-container-horizontal-ddrezg, 24px);
229
234
  }
230
- .awsui_header_14iqq_nllvs_132 + .awsui_content_14iqq_nllvs_201.awsui_with-paddings_14iqq_nllvs_158:not(#\9) {
235
+ .awsui_header_14iqq_xfc54_133 + .awsui_content_14iqq_xfc54_203.awsui_with-paddings_14iqq_xfc54_160:not(#\9) {
231
236
  padding-top: var(--space-container-content-top-fsd8nr, 0px);
232
237
  }
233
238
 
234
- .awsui_footer_14iqq_nllvs_208.awsui_with-paddings_14iqq_nllvs_158:not(#\9) {
239
+ .awsui_footer_14iqq_xfc54_213:not(#\9) {
240
+ flex: 0 0 auto;
241
+ }
242
+ .awsui_footer_14iqq_xfc54_213.awsui_with-paddings_14iqq_xfc54_160:not(#\9) {
235
243
  padding: var(--space-scaled-s-cu1hzn, 12px) var(--space-container-horizontal-ddrezg, 24px);
236
244
  }
237
- .awsui_footer_14iqq_nllvs_208.awsui_with-divider_14iqq_nllvs_211:not(#\9) {
245
+ .awsui_footer_14iqq_xfc54_213.awsui_with-divider_14iqq_xfc54_219:not(#\9) {
238
246
  border-top: var(--border-divider-section-width-4wm2it, 2px) solid var(--color-border-divider-default-7s2wjw, #e9ebed);
239
247
  }
@@ -2,21 +2,21 @@
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_14iqq_nllvs_97",
6
- "variant-default": "awsui_variant-default_14iqq_nllvs_109",
7
- "variant-stacked": "awsui_variant-stacked_14iqq_nllvs_109",
8
- "header": "awsui_header_14iqq_nllvs_132",
9
- "header-sticky-disabled": "awsui_header-sticky-disabled_14iqq_nllvs_137",
10
- "header-sticky-enabled": "awsui_header-sticky-enabled_14iqq_nllvs_141",
11
- "header-stuck": "awsui_header-stuck_14iqq_nllvs_147",
12
- "header-dynamic-height": "awsui_header-dynamic-height_14iqq_nllvs_152",
13
- "with-paddings": "awsui_with-paddings_14iqq_nllvs_158",
14
- "with-hidden-content": "awsui_with-hidden-content_14iqq_nllvs_161",
15
- "header-variant-cards": "awsui_header-variant-cards_14iqq_nllvs_165",
16
- "header-variant-full-page": "awsui_header-variant-full-page_14iqq_nllvs_189",
17
- "dark-header": "awsui_dark-header_14iqq_nllvs_197",
18
- "content": "awsui_content_14iqq_nllvs_201",
19
- "footer": "awsui_footer_14iqq_nllvs_208",
20
- "with-divider": "awsui_with-divider_14iqq_nllvs_211"
5
+ "root": "awsui_root_14iqq_xfc54_97",
6
+ "variant-default": "awsui_variant-default_14iqq_xfc54_110",
7
+ "variant-stacked": "awsui_variant-stacked_14iqq_xfc54_110",
8
+ "header": "awsui_header_14iqq_xfc54_133",
9
+ "header-sticky-disabled": "awsui_header-sticky-disabled_14iqq_xfc54_139",
10
+ "header-sticky-enabled": "awsui_header-sticky-enabled_14iqq_xfc54_143",
11
+ "header-stuck": "awsui_header-stuck_14iqq_xfc54_149",
12
+ "header-dynamic-height": "awsui_header-dynamic-height_14iqq_xfc54_154",
13
+ "with-paddings": "awsui_with-paddings_14iqq_xfc54_160",
14
+ "with-hidden-content": "awsui_with-hidden-content_14iqq_xfc54_163",
15
+ "header-variant-cards": "awsui_header-variant-cards_14iqq_xfc54_167",
16
+ "header-variant-full-page": "awsui_header-variant-full-page_14iqq_xfc54_191",
17
+ "dark-header": "awsui_dark-header_14iqq_xfc54_199",
18
+ "content": "awsui_content_14iqq_xfc54_203",
19
+ "footer": "awsui_footer_14iqq_xfc54_213",
20
+ "with-divider": "awsui_with-divider_14iqq_xfc54_219"
21
21
  };
22
22
 
@@ -1,5 +1,5 @@
1
1
 
2
- export var PACKAGE_VERSION = '3.0.0 (7aef8d6)';
2
+ export var PACKAGE_VERSION = '3.0.0 (94858e8)';
3
3
  export var THEME = 'open-source-visual-refresh';
4
4
  export var ALWAYS_VISUAL_REFRESH = true;
5
5
 
package/package.json CHANGED
@@ -113,6 +113,6 @@
113
113
  "./internal/base-component/index.js",
114
114
  "./internal/base-component/styles.css.js"
115
115
  ],
116
- "version": "3.0.67",
116
+ "version": "3.0.68",
117
117
  "license": "Apache-2.0"
118
118
  }