@cloudscape-design/components 3.0.814 → 3.0.815

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.
@@ -1,15 +1,15 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "drawer": "awsui_drawer_12i0j_huoml_185",
5
- "legacy": "awsui_legacy_12i0j_huoml_200",
6
- "last-opened": "awsui_last-opened_12i0j_huoml_208",
7
- "drawer-global": "awsui_drawer-global_12i0j_huoml_213",
8
- "drawer-hidden": "awsui_drawer-hidden_12i0j_huoml_220",
9
- "drawer-content-container": "awsui_drawer-content-container_12i0j_huoml_223",
10
- "drawer-close-button": "awsui_drawer-close-button_12i0j_huoml_231",
11
- "drawer-content": "awsui_drawer-content_12i0j_huoml_223",
12
- "drawer-content-hidden": "awsui_drawer-content-hidden_12i0j_huoml_240",
13
- "drawer-slider": "awsui_drawer-slider_12i0j_huoml_243"
4
+ "drawer": "awsui_drawer_12i0j_qyp9i_185",
5
+ "legacy": "awsui_legacy_12i0j_qyp9i_200",
6
+ "last-opened": "awsui_last-opened_12i0j_qyp9i_208",
7
+ "drawer-global": "awsui_drawer-global_12i0j_qyp9i_213",
8
+ "drawer-hidden": "awsui_drawer-hidden_12i0j_qyp9i_220",
9
+ "drawer-content-container": "awsui_drawer-content-container_12i0j_qyp9i_223",
10
+ "drawer-close-button": "awsui_drawer-close-button_12i0j_qyp9i_231",
11
+ "drawer-content": "awsui_drawer-content_12i0j_qyp9i_223",
12
+ "drawer-content-hidden": "awsui_drawer-content-hidden_12i0j_qyp9i_240",
13
+ "drawer-slider": "awsui_drawer-slider_12i0j_qyp9i_243"
14
14
  };
15
15
 
@@ -182,7 +182,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
182
182
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
183
183
  SPDX-License-Identifier: Apache-2.0
184
184
  */
185
- .awsui_drawer_12i0j_huoml_185:not(#\9) {
185
+ .awsui_drawer_12i0j_qyp9i_185:not(#\9) {
186
186
  position: sticky;
187
187
  z-index: 830;
188
188
  background-color: var(--color-background-container-content-z79u4u, #ffffff);
@@ -197,50 +197,50 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
197
197
  word-wrap: break-word;
198
198
  }
199
199
  @media (min-width: 689px) {
200
- .awsui_drawer_12i0j_huoml_185:not(#\9):not(.awsui_legacy_12i0j_huoml_200) {
200
+ .awsui_drawer_12i0j_qyp9i_185:not(#\9):not(.awsui_legacy_12i0j_qyp9i_200) {
201
201
  border-inline-start: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-layout-hrw5xj, #b4b4bb);
202
202
  }
203
203
  }
204
204
  @media (max-width: 688px) {
205
- .awsui_drawer_12i0j_huoml_185:not(#\9) {
205
+ .awsui_drawer_12i0j_qyp9i_185:not(#\9) {
206
206
  inline-size: 100%;
207
207
  }
208
- .awsui_drawer_12i0j_huoml_185.awsui_last-opened_12i0j_huoml_208:not(#\9) {
208
+ .awsui_drawer_12i0j_qyp9i_185.awsui_last-opened_12i0j_qyp9i_208:not(#\9) {
209
209
  z-index: 1001;
210
210
  }
211
211
  }
212
212
  @media (max-width: 688px) {
213
- .awsui_drawer_12i0j_huoml_185.awsui_drawer-global_12i0j_huoml_213:not(#\9) {
213
+ .awsui_drawer_12i0j_qyp9i_185.awsui_drawer-global_12i0j_qyp9i_213:not(#\9) {
214
214
  display: none;
215
215
  }
216
- .awsui_drawer_12i0j_huoml_185.awsui_drawer-global_12i0j_huoml_213.awsui_last-opened_12i0j_huoml_208:not(#\9) {
216
+ .awsui_drawer_12i0j_qyp9i_185.awsui_drawer-global_12i0j_qyp9i_213.awsui_last-opened_12i0j_qyp9i_208:not(#\9) {
217
217
  display: block;
218
218
  }
219
219
  }
220
- .awsui_drawer_12i0j_huoml_185.awsui_drawer-hidden_12i0j_huoml_220:not(#\9) {
220
+ .awsui_drawer_12i0j_qyp9i_185.awsui_drawer-hidden_12i0j_qyp9i_220:not(#\9) {
221
221
  display: none;
222
222
  }
223
- .awsui_drawer_12i0j_huoml_185 > .awsui_drawer-content-container_12i0j_huoml_223:not(#\9) {
223
+ .awsui_drawer_12i0j_qyp9i_185 > .awsui_drawer-content-container_12i0j_qyp9i_223:not(#\9) {
224
224
  grid-column: 1/span 2;
225
225
  grid-row: 1;
226
226
  display: grid;
227
227
  grid-template-columns: var(--space-m-udix3p, 16px) 1fr auto var(--space-m-udix3p, 16px);
228
- grid-template-rows: 10px auto 1fr;
228
+ grid-template-rows: 14px auto 1fr;
229
229
  overflow-y: auto;
230
230
  }
231
- .awsui_drawer_12i0j_huoml_185 > .awsui_drawer-content-container_12i0j_huoml_223 > .awsui_drawer-close-button_12i0j_huoml_231:not(#\9) {
231
+ .awsui_drawer_12i0j_qyp9i_185 > .awsui_drawer-content-container_12i0j_qyp9i_223 > .awsui_drawer-close-button_12i0j_qyp9i_231:not(#\9) {
232
232
  grid-column: 3;
233
233
  grid-row: 2;
234
234
  z-index: 1;
235
235
  }
236
- .awsui_drawer_12i0j_huoml_185 > .awsui_drawer-content-container_12i0j_huoml_223 > .awsui_drawer-content_12i0j_huoml_223:not(#\9) {
236
+ .awsui_drawer_12i0j_qyp9i_185 > .awsui_drawer-content-container_12i0j_qyp9i_223 > .awsui_drawer-content_12i0j_qyp9i_223:not(#\9) {
237
237
  grid-column: 1/span 4;
238
238
  grid-row: 1/span 2;
239
239
  }
240
- .awsui_drawer_12i0j_huoml_185 > .awsui_drawer-content-container_12i0j_huoml_223 > .awsui_drawer-content_12i0j_huoml_223.awsui_drawer-content-hidden_12i0j_huoml_240:not(#\9) {
240
+ .awsui_drawer_12i0j_qyp9i_185 > .awsui_drawer-content-container_12i0j_qyp9i_223 > .awsui_drawer-content_12i0j_qyp9i_223.awsui_drawer-content-hidden_12i0j_qyp9i_240:not(#\9) {
241
241
  display: none;
242
242
  }
243
- .awsui_drawer_12i0j_huoml_185 > .awsui_drawer-slider_12i0j_huoml_243:not(#\9) {
243
+ .awsui_drawer_12i0j_qyp9i_185 > .awsui_drawer-slider_12i0j_qyp9i_243:not(#\9) {
244
244
  grid-column: 1;
245
245
  grid-row: 1;
246
246
  block-size: 100%;
@@ -2,15 +2,15 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "drawer": "awsui_drawer_12i0j_huoml_185",
6
- "legacy": "awsui_legacy_12i0j_huoml_200",
7
- "last-opened": "awsui_last-opened_12i0j_huoml_208",
8
- "drawer-global": "awsui_drawer-global_12i0j_huoml_213",
9
- "drawer-hidden": "awsui_drawer-hidden_12i0j_huoml_220",
10
- "drawer-content-container": "awsui_drawer-content-container_12i0j_huoml_223",
11
- "drawer-close-button": "awsui_drawer-close-button_12i0j_huoml_231",
12
- "drawer-content": "awsui_drawer-content_12i0j_huoml_223",
13
- "drawer-content-hidden": "awsui_drawer-content-hidden_12i0j_huoml_240",
14
- "drawer-slider": "awsui_drawer-slider_12i0j_huoml_243"
5
+ "drawer": "awsui_drawer_12i0j_qyp9i_185",
6
+ "legacy": "awsui_legacy_12i0j_qyp9i_200",
7
+ "last-opened": "awsui_last-opened_12i0j_qyp9i_208",
8
+ "drawer-global": "awsui_drawer-global_12i0j_qyp9i_213",
9
+ "drawer-hidden": "awsui_drawer-hidden_12i0j_qyp9i_220",
10
+ "drawer-content-container": "awsui_drawer-content-container_12i0j_qyp9i_223",
11
+ "drawer-close-button": "awsui_drawer-close-button_12i0j_qyp9i_231",
12
+ "drawer-content": "awsui_drawer-content_12i0j_qyp9i_223",
13
+ "drawer-content-hidden": "awsui_drawer-content-hidden_12i0j_qyp9i_240",
14
+ "drawer-slider": "awsui_drawer-slider_12i0j_qyp9i_243"
15
15
  };
16
16
 
@@ -1,9 +1,9 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "navigation": "awsui_navigation_2p2ab_l5mb7_149",
5
- "is-navigation-open": "awsui_is-navigation-open_2p2ab_l5mb7_167",
6
- "animated-content": "awsui_animated-content_2p2ab_l5mb7_171",
7
- "hide-navigation": "awsui_hide-navigation_2p2ab_l5mb7_181"
4
+ "navigation": "awsui_navigation_2p2ab_lud9e_149",
5
+ "is-navigation-open": "awsui_is-navigation-open_2p2ab_lud9e_167",
6
+ "animated-content": "awsui_animated-content_2p2ab_lud9e_171",
7
+ "hide-navigation": "awsui_hide-navigation_2p2ab_lud9e_181"
8
8
  };
9
9
 
@@ -146,7 +146,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
146
146
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
147
147
  SPDX-License-Identifier: Apache-2.0
148
148
  */
149
- .awsui_navigation_2p2ab_l5mb7_149:not(#\9) {
149
+ .awsui_navigation_2p2ab_lud9e_149:not(#\9) {
150
150
  position: sticky;
151
151
  z-index: 830;
152
152
  background-color: var(--color-background-container-content-z79u4u, #ffffff);
@@ -164,22 +164,22 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
164
164
  prevent unwanted text wrapping.
165
165
  */
166
166
  }
167
- .awsui_navigation_2p2ab_l5mb7_149:not(#\9):not(.awsui_is-navigation-open_2p2ab_l5mb7_167) {
167
+ .awsui_navigation_2p2ab_lud9e_149:not(#\9):not(.awsui_is-navigation-open_2p2ab_lud9e_167) {
168
168
  inline-size: 0px;
169
169
  display: none;
170
170
  }
171
- .awsui_navigation_2p2ab_l5mb7_149 > .awsui_animated-content_2p2ab_l5mb7_171:not(#\9) {
171
+ .awsui_navigation_2p2ab_lud9e_149 > .awsui_animated-content_2p2ab_lud9e_171:not(#\9) {
172
172
  inline-size: var(--awsui-navigation-width-g964ok);
173
173
  }
174
174
  @media (max-width: 688px) {
175
- .awsui_navigation_2p2ab_l5mb7_149:not(#\9) {
175
+ .awsui_navigation_2p2ab_lud9e_149:not(#\9) {
176
176
  --awsui-navigation-width-g964ok: 100vw;
177
177
  z-index: 1001;
178
178
  }
179
179
  }
180
180
 
181
- .awsui_hide-navigation_2p2ab_l5mb7_181:not(#\9) {
181
+ .awsui_hide-navigation_2p2ab_lud9e_181:not(#\9) {
182
182
  position: absolute;
183
183
  inset-inline-end: var(--space-m-udix3p, 16px);
184
- inset-block-start: 10px;
184
+ inset-block-start: 14px;
185
185
  }
@@ -2,9 +2,9 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "navigation": "awsui_navigation_2p2ab_l5mb7_149",
6
- "is-navigation-open": "awsui_is-navigation-open_2p2ab_l5mb7_167",
7
- "animated-content": "awsui_animated-content_2p2ab_l5mb7_171",
8
- "hide-navigation": "awsui_hide-navigation_2p2ab_l5mb7_181"
5
+ "navigation": "awsui_navigation_2p2ab_lud9e_149",
6
+ "is-navigation-open": "awsui_is-navigation-open_2p2ab_lud9e_167",
7
+ "animated-content": "awsui_animated-content_2p2ab_lud9e_171",
8
+ "hide-navigation": "awsui_hide-navigation_2p2ab_lud9e_181"
9
9
  };
10
10
 
@@ -20,7 +20,7 @@ export function DrawerImplementation(_a) {
20
20
  React.createElement(InternalStatusIndicator, { type: "loading" },
21
21
  React.createElement(InternalLiveRegion, { tagName: "span" }, i18n('i18nStrings.loadingText', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.loadingText))))) : (React.createElement("div", Object.assign({}, containerProps, { ref: __internalRootRef }),
22
22
  header && React.createElement("div", { className: styles.header }, header),
23
- React.createElement("div", { className: styles['test-utils-drawer-content'] }, children)));
23
+ React.createElement("div", { className: clsx(styles['test-utils-drawer-content'], styles.content) }, children)));
24
24
  }
25
25
  export const createWidgetizedDrawer = createWidgetizedComponent(DrawerImplementation);
26
26
  //# sourceMappingURL=implementation.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/drawer/implementation.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AACzD,OAAO,uBAAuB,MAAM,8BAA8B,CAAC;AAGnE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,UAAU,oBAAoB,CAAC,EAOf;QAPe,EACnC,MAAM,EACN,QAAQ,EACR,OAAO,EACP,WAAW,EACX,iBAAiB,OAEG,EADjB,SAAS,cANuB,qEAOpC,CADa;IAEZ,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,0BAA0B,EAAE,CAAC;IAC/C,MAAM,IAAI,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IACvC,MAAM,cAAc,mCACf,SAAS,KACZ,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,IAAI,MAAM,CAAC,cAAc,CAAC,CAAC,GACzF,CAAC;IACF,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC7C,oBAAC,uBAAuB,IAAC,IAAI,EAAC,SAAS;YACrC,oBAAC,kBAAkB,IAAC,OAAO,EAAC,MAAM,IAC/B,IAAI,CAAC,yBAAyB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,CAAC,CACvC,CACG,CACtB,CACP,CAAC,CAAC,CAAC,CACF,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC5C,MAAM,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM,IAAG,MAAM,CAAO;QACxD,6BAAK,SAAS,EAAE,MAAM,CAAC,2BAA2B,CAAC,IAAG,QAAQ,CAAO,CACjE,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,sBAAsB,GAAG,yBAAyB,CAAC,oBAAoB,CAAC,CAAC","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 { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport InternalLiveRegion from '../live-region/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport { DrawerProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport type DrawerInternalProps = DrawerProps & InternalBaseComponentProps;\n\nexport function DrawerImplementation({\n header,\n children,\n loading,\n i18nStrings,\n __internalRootRef,\n ...restProps\n}: DrawerInternalProps) {\n const baseProps = getBaseProps(restProps);\n const isToolbar = useAppLayoutToolbarEnabled();\n const i18n = useInternalI18n('drawer');\n const containerProps = {\n ...baseProps,\n className: clsx(baseProps.className, styles.drawer, isToolbar && styles['with-toolbar']),\n };\n return loading ? (\n <div {...containerProps} ref={__internalRootRef}>\n <InternalStatusIndicator type=\"loading\">\n <InternalLiveRegion tagName=\"span\">\n {i18n('i18nStrings.loadingText', i18nStrings?.loadingText)}\n </InternalLiveRegion>\n </InternalStatusIndicator>\n </div>\n ) : (\n <div {...containerProps} ref={__internalRootRef}>\n {header && <div className={styles.header}>{header}</div>}\n <div className={styles['test-utils-drawer-content']}>{children}</div>\n </div>\n );\n}\n\nexport const createWidgetizedDrawer = createWidgetizedComponent(DrawerImplementation);\n"]}
1
+ {"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/drawer/implementation.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AACzD,OAAO,uBAAuB,MAAM,8BAA8B,CAAC;AAGnE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,UAAU,oBAAoB,CAAC,EAOf;QAPe,EACnC,MAAM,EACN,QAAQ,EACR,OAAO,EACP,WAAW,EACX,iBAAiB,OAEG,EADjB,SAAS,cANuB,qEAOpC,CADa;IAEZ,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,0BAA0B,EAAE,CAAC;IAC/C,MAAM,IAAI,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IACvC,MAAM,cAAc,mCACf,SAAS,KACZ,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,IAAI,MAAM,CAAC,cAAc,CAAC,CAAC,GACzF,CAAC;IACF,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC7C,oBAAC,uBAAuB,IAAC,IAAI,EAAC,SAAS;YACrC,oBAAC,kBAAkB,IAAC,OAAO,EAAC,MAAM,IAC/B,IAAI,CAAC,yBAAyB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,CAAC,CACvC,CACG,CACtB,CACP,CAAC,CAAC,CAAC,CACF,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC5C,MAAM,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM,IAAG,MAAM,CAAO;QACxD,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,2BAA2B,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,IAAG,QAAQ,CAAO,CACvF,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,sBAAsB,GAAG,yBAAyB,CAAC,oBAAoB,CAAC,CAAC","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 { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport InternalLiveRegion from '../live-region/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport { DrawerProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport type DrawerInternalProps = DrawerProps & InternalBaseComponentProps;\n\nexport function DrawerImplementation({\n header,\n children,\n loading,\n i18nStrings,\n __internalRootRef,\n ...restProps\n}: DrawerInternalProps) {\n const baseProps = getBaseProps(restProps);\n const isToolbar = useAppLayoutToolbarEnabled();\n const i18n = useInternalI18n('drawer');\n const containerProps = {\n ...baseProps,\n className: clsx(baseProps.className, styles.drawer, isToolbar && styles['with-toolbar']),\n };\n return loading ? (\n <div {...containerProps} ref={__internalRootRef}>\n <InternalStatusIndicator type=\"loading\">\n <InternalLiveRegion tagName=\"span\">\n {i18n('i18nStrings.loadingText', i18nStrings?.loadingText)}\n </InternalLiveRegion>\n </InternalStatusIndicator>\n </div>\n ) : (\n <div {...containerProps} ref={__internalRootRef}>\n {header && <div className={styles.header}>{header}</div>}\n <div className={clsx(styles['test-utils-drawer-content'], styles.content)}>{children}</div>\n </div>\n );\n}\n\nexport const createWidgetizedDrawer = createWidgetizedComponent(DrawerImplementation);\n"]}
@@ -1,9 +1,10 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "drawer": "awsui_drawer_1sxt8_1wqb3_177",
5
- "with-toolbar": "awsui_with-toolbar_1sxt8_1wqb3_216",
6
- "header": "awsui_header_1sxt8_1wqb3_220",
7
- "test-utils-drawer-content": "awsui_test-utils-drawer-content_1sxt8_1wqb3_256"
4
+ "drawer": "awsui_drawer_1sxt8_ppnoo_177",
5
+ "header": "awsui_header_1sxt8_ppnoo_213",
6
+ "with-toolbar": "awsui_with-toolbar_1sxt8_ppnoo_228",
7
+ "content": "awsui_content_1sxt8_ppnoo_246",
8
+ "test-utils-drawer-content": "awsui_test-utils-drawer-content_1sxt8_ppnoo_252"
8
9
  };
9
10
 
@@ -174,7 +174,7 @@
174
174
  */
175
175
  /* Style used for links in slots/components that are text heavy, to help links stand out among
176
176
  surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
177
- .awsui_drawer_1sxt8_1wqb3_177:not(#\9) {
177
+ .awsui_drawer_1sxt8_ppnoo_177:not(#\9) {
178
178
  border-collapse: separate;
179
179
  border-spacing: 0;
180
180
  box-sizing: border-box;
@@ -209,42 +209,32 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
209
209
  -webkit-font-smoothing: auto;
210
210
  -moz-osx-font-smoothing: auto;
211
211
  word-wrap: break-word;
212
- padding-block-start: var(--space-panel-header-vertical-gv9pti, 20px);
213
- padding-block-end: var(--space-panel-content-bottom-7k6er3, 40px);
214
- padding-inline-start: var(--space-panel-side-left-5t0who, 28px);
215
- padding-inline-end: var(--space-panel-side-right-xofg51, 24px);
216
- }
217
- .awsui_drawer_1sxt8_1wqb3_177.awsui_with-toolbar_1sxt8_1wqb3_216:not(#\9) {
218
- padding-block-start: var(--space-static-m-lrhgl2, 16px);
219
212
  }
220
213
 
221
- .awsui_header_1sxt8_1wqb3_220:not(#\9) {
214
+ .awsui_header_1sxt8_ppnoo_213:not(#\9) {
222
215
  font-size: var(--font-panel-header-size-edjz3l, 18px);
223
216
  line-height: var(--font-panel-header-line-height-kxi4u2, 22px);
224
217
  font-weight: var(--font-weight-heading-l-f8711v, 700);
225
218
  -webkit-font-smoothing: var(--font-smoothing-webkit-m8nc84, antialiased);
226
219
  -moz-osx-font-smoothing: var(--font-smoothing-moz-osx-foywby, grayscale);
227
220
  color: var(--color-text-heading-default-jen9ei, #0f141a);
228
- padding-block-end: var(--space-panel-header-vertical-gv9pti, 20px);
221
+ padding-block: var(--space-panel-header-vertical-gv9pti, 20px);
229
222
  padding-inline: var(--space-panel-side-left-5t0who, 28px) calc(var(--space-xl-lmui9r, 24px) + var(--space-scaled-xxl-wbot5q, 32px));
230
223
  border-block-end: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-panel-header-nnst86, #c6c6cd);
231
224
  margin-block-start: 0;
232
225
  margin-block-end: var(--space-panel-content-top-wac3yp, 20px);
233
- margin-inline-end: calc(-1 * var(--space-panel-side-right-xofg51, 24px));
234
- margin-inline-start: calc(-1 * var(--space-panel-side-left-5t0who, 28px));
235
226
  /* stylelint-disable @cloudscape-design/no-implicit-descendant, selector-max-type */
236
227
  /* stylelint-enable @cloudscape-design/no-implicit-descendant, selector-max-type */
237
228
  }
238
- .awsui_with-toolbar_1sxt8_1wqb3_216 > .awsui_header_1sxt8_1wqb3_220:not(#\9) {
229
+ .awsui_with-toolbar_1sxt8_ppnoo_228 > .awsui_header_1sxt8_ppnoo_213:not(#\9) {
239
230
  border-color: transparent;
240
- padding-block-end: var(--space-static-m-lrhgl2, 16px);
241
231
  margin-block-end: 0px;
242
232
  }
243
- .awsui_header_1sxt8_1wqb3_220 h2:not(#\9),
244
- .awsui_header_1sxt8_1wqb3_220 h3:not(#\9),
245
- .awsui_header_1sxt8_1wqb3_220 h4:not(#\9),
246
- .awsui_header_1sxt8_1wqb3_220 h5:not(#\9),
247
- .awsui_header_1sxt8_1wqb3_220 h6:not(#\9) {
233
+ .awsui_header_1sxt8_ppnoo_213 h2:not(#\9),
234
+ .awsui_header_1sxt8_ppnoo_213 h3:not(#\9),
235
+ .awsui_header_1sxt8_ppnoo_213 h4:not(#\9),
236
+ .awsui_header_1sxt8_ppnoo_213 h5:not(#\9),
237
+ .awsui_header_1sxt8_ppnoo_213 h6:not(#\9) {
248
238
  font-size: var(--font-panel-header-size-edjz3l, 18px);
249
239
  line-height: var(--font-panel-header-line-height-kxi4u2, 22px);
250
240
  font-weight: var(--font-weight-heading-l-f8711v, 700);
@@ -254,6 +244,12 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
254
244
  margin-block: 0;
255
245
  }
256
246
 
257
- .awsui_test-utils-drawer-content_1sxt8_1wqb3_256:not(#\9) {
247
+ .awsui_content_1sxt8_ppnoo_246:not(#\9):not(:empty) {
248
+ padding-inline-start: var(--space-panel-side-left-5t0who, 28px);
249
+ padding-inline-end: var(--space-panel-side-right-xofg51, 24px);
250
+ padding-block-end: var(--space-panel-content-bottom-7k6er3, 40px);
251
+ }
252
+
253
+ .awsui_test-utils-drawer-content_1sxt8_ppnoo_252:not(#\9) {
258
254
  /* used in test-utils */
259
255
  }
@@ -2,9 +2,10 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "drawer": "awsui_drawer_1sxt8_1wqb3_177",
6
- "with-toolbar": "awsui_with-toolbar_1sxt8_1wqb3_216",
7
- "header": "awsui_header_1sxt8_1wqb3_220",
8
- "test-utils-drawer-content": "awsui_test-utils-drawer-content_1sxt8_1wqb3_256"
5
+ "drawer": "awsui_drawer_1sxt8_ppnoo_177",
6
+ "header": "awsui_header_1sxt8_ppnoo_213",
7
+ "with-toolbar": "awsui_with-toolbar_1sxt8_ppnoo_228",
8
+ "content": "awsui_content_1sxt8_ppnoo_246",
9
+ "test-utils-drawer-content": "awsui_test-utils-drawer-content_1sxt8_ppnoo_252"
9
10
  };
10
11
 
@@ -1 +1 @@
1
- {"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/help-panel/implementation.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAIlF,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAI9C,MAAM,MAAM,sBAAsB,GAAG,cAAc,GAAG,0BAA0B,CAAC;AAEjF,wBAAgB,uBAAuB,CAAC,EACtC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,EACP,WAAW,EACX,iBAAiB,EACjB,GAAG,SAAS,EACb,EAAE,sBAAsB,eAuBxB;AAED,eAAO,MAAM,yBAAyB,yFAAqD,CAAC"}
1
+ {"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/help-panel/implementation.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAIlF,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAI9C,MAAM,MAAM,sBAAsB,GAAG,cAAc,GAAG,0BAA0B,CAAC;AAEjF,wBAAgB,uBAAuB,CAAC,EACtC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,EACP,WAAW,EACX,iBAAiB,EACjB,GAAG,SAAS,EACb,EAAE,sBAAsB,eAiCxB;AAED,eAAO,MAAM,yBAAyB,yFAAqD,CAAC"}
@@ -16,14 +16,16 @@ export function HelpPanelImplementation(_a) {
16
16
  const baseProps = getBaseProps(restProps);
17
17
  const isToolbar = useAppLayoutToolbarEnabled();
18
18
  const i18n = useInternalI18n('help-panel');
19
- const containerProps = Object.assign(Object.assign({}, baseProps), { className: clsx(baseProps.className, styles['help-panel'], isToolbar && styles['with-toolbar']) });
19
+ const containerProps = Object.assign(Object.assign({}, baseProps), { className: clsx(baseProps.className, styles['help-panel'], isToolbar && styles['with-toolbar'], loading && styles.loading) });
20
20
  return loading ? (React.createElement("div", Object.assign({}, containerProps, { ref: __internalRootRef }),
21
21
  React.createElement(InternalStatusIndicator, { type: "loading" },
22
22
  React.createElement(InternalLiveRegion, { tagName: "span" }, i18n('loadingText', loadingText))))) : (React.createElement("div", Object.assign({}, containerProps, { ref: __internalRootRef }),
23
23
  header && React.createElement("div", { className: clsx(styles.header) }, header),
24
24
  React.createElement(LinkDefaultVariantContext.Provider, { value: { defaultVariant: 'primary' } },
25
25
  React.createElement("div", { className: styles.content }, children)),
26
- footer && React.createElement("div", { className: styles.footer }, footer)));
26
+ footer && (React.createElement("div", { className: styles.footer },
27
+ React.createElement("hr", { role: "presentation" }),
28
+ footer))));
27
29
  }
28
30
  export const createWidgetizedHelpPanel = createWidgetizedComponent(HelpPanelImplementation);
29
31
  //# sourceMappingURL=implementation.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/help-panel/implementation.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,kDAAkD,CAAC;AAE7F,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AACzD,OAAO,uBAAuB,MAAM,8BAA8B,CAAC;AAGnE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,UAAU,uBAAuB,CAAC,EAQf;QARe,EACtC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,EACP,WAAW,EACX,iBAAiB,OAEM,EADpB,SAAS,cAP0B,+EAQvC,CADa;IAEZ,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,0BAA0B,EAAE,CAAC;IAC/C,MAAM,IAAI,GAAG,eAAe,CAAC,YAAY,CAAC,CAAC;IAC3C,MAAM,cAAc,mCACf,SAAS,KACZ,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,EAAE,SAAS,IAAI,MAAM,CAAC,cAAc,CAAC,CAAC,GAChG,CAAC;IACF,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC7C,oBAAC,uBAAuB,IAAC,IAAI,EAAC,SAAS;YACrC,oBAAC,kBAAkB,IAAC,OAAO,EAAC,MAAM,IAAE,IAAI,CAAC,aAAa,EAAE,WAAW,CAAC,CAAsB,CAClE,CACtB,CACP,CAAC,CAAC,CAAC,CACF,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC5C,MAAM,IAAI,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAG,MAAM,CAAO;QAC9D,oBAAC,yBAAyB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,cAAc,EAAE,SAAS,EAAE;YACtE,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,QAAQ,CAAO,CACb;QACpC,MAAM,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM,IAAG,MAAM,CAAO,CACpD,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,yBAAyB,GAAG,yBAAyB,CAAC,uBAAuB,CAAC,CAAC","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 { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { LinkDefaultVariantContext } from '../internal/context/link-default-variant-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport InternalLiveRegion from '../live-region/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport { HelpPanelProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport type HelpPanelInternalProps = HelpPanelProps & InternalBaseComponentProps;\n\nexport function HelpPanelImplementation({\n header,\n footer,\n children,\n loading,\n loadingText,\n __internalRootRef,\n ...restProps\n}: HelpPanelInternalProps) {\n const baseProps = getBaseProps(restProps);\n const isToolbar = useAppLayoutToolbarEnabled();\n const i18n = useInternalI18n('help-panel');\n const containerProps = {\n ...baseProps,\n className: clsx(baseProps.className, styles['help-panel'], isToolbar && styles['with-toolbar']),\n };\n return loading ? (\n <div {...containerProps} ref={__internalRootRef}>\n <InternalStatusIndicator type=\"loading\">\n <InternalLiveRegion tagName=\"span\">{i18n('loadingText', loadingText)}</InternalLiveRegion>\n </InternalStatusIndicator>\n </div>\n ) : (\n <div {...containerProps} ref={__internalRootRef}>\n {header && <div className={clsx(styles.header)}>{header}</div>}\n <LinkDefaultVariantContext.Provider value={{ defaultVariant: 'primary' }}>\n <div className={styles.content}>{children}</div>\n </LinkDefaultVariantContext.Provider>\n {footer && <div className={styles.footer}>{footer}</div>}\n </div>\n );\n}\n\nexport const createWidgetizedHelpPanel = createWidgetizedComponent(HelpPanelImplementation);\n"]}
1
+ {"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/help-panel/implementation.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,kDAAkD,CAAC;AAE7F,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AACzD,OAAO,uBAAuB,MAAM,8BAA8B,CAAC;AAGnE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,UAAU,uBAAuB,CAAC,EAQf;QARe,EACtC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,EACP,WAAW,EACX,iBAAiB,OAEM,EADpB,SAAS,cAP0B,+EAQvC,CADa;IAEZ,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,0BAA0B,EAAE,CAAC;IAC/C,MAAM,IAAI,GAAG,eAAe,CAAC,YAAY,CAAC,CAAC;IAC3C,MAAM,cAAc,mCACf,SAAS,KACZ,SAAS,EAAE,IAAI,CACb,SAAS,CAAC,SAAS,EACnB,MAAM,CAAC,YAAY,CAAC,EACpB,SAAS,IAAI,MAAM,CAAC,cAAc,CAAC,EACnC,OAAO,IAAI,MAAM,CAAC,OAAO,CAC1B,GACF,CAAC;IACF,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC7C,oBAAC,uBAAuB,IAAC,IAAI,EAAC,SAAS;YACrC,oBAAC,kBAAkB,IAAC,OAAO,EAAC,MAAM,IAAE,IAAI,CAAC,aAAa,EAAE,WAAW,CAAC,CAAsB,CAClE,CACtB,CACP,CAAC,CAAC,CAAC,CACF,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC5C,MAAM,IAAI,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAG,MAAM,CAAO;QAC9D,oBAAC,yBAAyB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,cAAc,EAAE,SAAS,EAAE;YACtE,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,QAAQ,CAAO,CACb;QACpC,MAAM,IAAI,CACT,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM;YAC3B,4BAAI,IAAI,EAAC,cAAc,GAAG;YACzB,MAAM,CACH,CACP,CACG,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,yBAAyB,GAAG,yBAAyB,CAAC,uBAAuB,CAAC,CAAC","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 { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { LinkDefaultVariantContext } from '../internal/context/link-default-variant-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport InternalLiveRegion from '../live-region/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport { HelpPanelProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport type HelpPanelInternalProps = HelpPanelProps & InternalBaseComponentProps;\n\nexport function HelpPanelImplementation({\n header,\n footer,\n children,\n loading,\n loadingText,\n __internalRootRef,\n ...restProps\n}: HelpPanelInternalProps) {\n const baseProps = getBaseProps(restProps);\n const isToolbar = useAppLayoutToolbarEnabled();\n const i18n = useInternalI18n('help-panel');\n const containerProps = {\n ...baseProps,\n className: clsx(\n baseProps.className,\n styles['help-panel'],\n isToolbar && styles['with-toolbar'],\n loading && styles.loading\n ),\n };\n return loading ? (\n <div {...containerProps} ref={__internalRootRef}>\n <InternalStatusIndicator type=\"loading\">\n <InternalLiveRegion tagName=\"span\">{i18n('loadingText', loadingText)}</InternalLiveRegion>\n </InternalStatusIndicator>\n </div>\n ) : (\n <div {...containerProps} ref={__internalRootRef}>\n {header && <div className={clsx(styles.header)}>{header}</div>}\n <LinkDefaultVariantContext.Provider value={{ defaultVariant: 'primary' }}>\n <div className={styles.content}>{children}</div>\n </LinkDefaultVariantContext.Provider>\n {footer && (\n <div className={styles.footer}>\n <hr role=\"presentation\" />\n {footer}\n </div>\n )}\n </div>\n );\n}\n\nexport const createWidgetizedHelpPanel = createWidgetizedComponent(HelpPanelImplementation);\n"]}
@@ -1,10 +1,11 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "help-panel": "awsui_help-panel_1d237_1x0ik_177",
5
- "with-toolbar": "awsui_with-toolbar_1d237_1x0ik_218",
6
- "header": "awsui_header_1d237_1x0ik_352",
7
- "content": "awsui_content_1d237_1x0ik_390",
8
- "footer": "awsui_footer_1d237_1x0ik_438"
4
+ "help-panel": "awsui_help-panel_1d237_17b17_177",
5
+ "loading": "awsui_loading_1d237_17b17_347",
6
+ "header": "awsui_header_1d237_17b17_352",
7
+ "with-toolbar": "awsui_with-toolbar_1d237_17b17_369",
8
+ "content": "awsui_content_1d237_17b17_387",
9
+ "footer": "awsui_footer_1d237_17b17_438"
9
10
  };
10
11