@cloudscape-design/components-themeable 3.0.512 → 3.0.514

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 (63) hide show
  1. package/lib/internal/manifest.json +1 -1
  2. package/lib/internal/scss/app-layout/visual-refresh/mobile-toolbar.scss +1 -1
  3. package/lib/internal/template/app-layout/visual-refresh/background.d.ts.map +1 -1
  4. package/lib/internal/template/app-layout/visual-refresh/background.js +2 -1
  5. package/lib/internal/template/app-layout/visual-refresh/background.js.map +1 -1
  6. package/lib/internal/template/app-layout/visual-refresh/breadcrumbs.d.ts.map +1 -1
  7. package/lib/internal/template/app-layout/visual-refresh/breadcrumbs.js +2 -1
  8. package/lib/internal/template/app-layout/visual-refresh/breadcrumbs.js.map +1 -1
  9. package/lib/internal/template/app-layout/visual-refresh/header.d.ts.map +1 -1
  10. package/lib/internal/template/app-layout/visual-refresh/header.js +2 -1
  11. package/lib/internal/template/app-layout/visual-refresh/header.js.map +1 -1
  12. package/lib/internal/template/app-layout/visual-refresh/mobile-toolbar.d.ts.map +1 -1
  13. package/lib/internal/template/app-layout/visual-refresh/mobile-toolbar.js +2 -1
  14. package/lib/internal/template/app-layout/visual-refresh/mobile-toolbar.js.map +1 -1
  15. package/lib/internal/template/app-layout/visual-refresh/notifications.d.ts.map +1 -1
  16. package/lib/internal/template/app-layout/visual-refresh/notifications.js +2 -1
  17. package/lib/internal/template/app-layout/visual-refresh/notifications.js.map +1 -1
  18. package/lib/internal/template/app-layout/visual-refresh/styles.css.js +80 -80
  19. package/lib/internal/template/app-layout/visual-refresh/styles.scoped.css +170 -170
  20. package/lib/internal/template/app-layout/visual-refresh/styles.selectors.js +80 -80
  21. package/lib/internal/template/container/internal.d.ts.map +1 -1
  22. package/lib/internal/template/container/internal.js +2 -1
  23. package/lib/internal/template/container/internal.js.map +1 -1
  24. package/lib/internal/template/content-layout/internal.d.ts.map +1 -1
  25. package/lib/internal/template/content-layout/internal.js +3 -2
  26. package/lib/internal/template/content-layout/internal.js.map +1 -1
  27. package/lib/internal/template/internal/components/dark-ribbon/index.d.ts.map +1 -1
  28. package/lib/internal/template/internal/components/dark-ribbon/index.js +2 -1
  29. package/lib/internal/template/internal/components/dark-ribbon/index.js.map +1 -1
  30. package/lib/internal/template/internal/environment.js +1 -1
  31. package/lib/internal/template/internal/environment.json +1 -1
  32. package/lib/internal/template/internal/generated/styles/tokens.d.ts +1 -0
  33. package/lib/internal/template/internal/generated/styles/tokens.js +1 -0
  34. package/lib/internal/template/internal/generated/theming/index.cjs +2 -0
  35. package/lib/internal/template/internal/generated/theming/index.cjs.d.ts +8 -0
  36. package/lib/internal/template/internal/generated/theming/index.d.ts +8 -0
  37. package/lib/internal/template/internal/generated/theming/index.js +2 -0
  38. package/lib/internal/template/internal/utils/content-header-utils.d.ts +2 -0
  39. package/lib/internal/template/internal/utils/content-header-utils.d.ts.map +1 -0
  40. package/lib/internal/template/internal/utils/content-header-utils.js +7 -0
  41. package/lib/internal/template/internal/utils/content-header-utils.js.map +1 -0
  42. package/lib/internal/template/internal/utils/global-flags.d.ts +11 -0
  43. package/lib/internal/template/internal/utils/global-flags.d.ts.map +1 -0
  44. package/lib/internal/template/internal/utils/global-flags.js +25 -0
  45. package/lib/internal/template/internal/utils/global-flags.js.map +1 -0
  46. package/lib/internal/template/split-panel/icons/bottom-icon-refresh.d.ts.map +1 -1
  47. package/lib/internal/template/split-panel/icons/bottom-icon-refresh.js +3 -2
  48. package/lib/internal/template/split-panel/icons/bottom-icon-refresh.js.map +1 -1
  49. package/lib/internal/template/split-panel/icons/side-position-refresh.d.ts.map +1 -1
  50. package/lib/internal/template/split-panel/icons/side-position-refresh.js +2 -1
  51. package/lib/internal/template/split-panel/icons/side-position-refresh.js.map +1 -1
  52. package/lib/internal/template/table/internal.d.ts.map +1 -1
  53. package/lib/internal/template/table/internal.js +2 -1
  54. package/lib/internal/template/table/internal.js.map +1 -1
  55. package/lib/internal/template/token-group/styles.scoped.css +1 -1
  56. package/lib/internal/template/tutorial-panel/components/tutorial-list/styles.scoped.css +1 -1
  57. package/lib/internal/template/wizard/internal.d.ts.map +1 -1
  58. package/lib/internal/template/wizard/internal.js +2 -1
  59. package/lib/internal/template/wizard/internal.js.map +1 -1
  60. package/lib/internal/template/wizard/wizard-form-header.d.ts.map +1 -1
  61. package/lib/internal/template/wizard/wizard-form-header.js +2 -1
  62. package/lib/internal/template/wizard/wizard-form-header.js.map +1 -1
  63. package/package.json +1 -1
package/lib/internal/template/app-layout/visual-refresh/styles.selectors.js CHANGED
@@ -2,85 +2,85 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "background": "awsui_background_hyvsj_1w7yt_93",
6
- "scrolling-background": "awsui_scrolling-background_hyvsj_1w7yt_96",
7
- "sticky-background": "awsui_sticky-background_hyvsj_1w7yt_102",
8
- "has-sticky-notifications": "awsui_has-sticky-notifications_hyvsj_1w7yt_110",
9
- "breadcrumbs": "awsui_breadcrumbs_hyvsj_1w7yt_123",
10
- "has-sticky-background": "awsui_has-sticky-background_hyvsj_1w7yt_133",
11
- "drawers-container": "awsui_drawers-container_hyvsj_1w7yt_145",
12
- "has-open-drawer": "awsui_has-open-drawer_hyvsj_1w7yt_156",
13
- "disable-body-scroll": "awsui_disable-body-scroll_hyvsj_1w7yt_179",
14
- "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_hyvsj_1w7yt_184",
15
- "has-multiple-triggers": "awsui_has-multiple-triggers_hyvsj_1w7yt_225",
16
- "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_hyvsj_1w7yt_235",
17
- "drawers-trigger-content": "awsui_drawers-trigger-content_hyvsj_1w7yt_239",
18
- "drawers-trigger-overflow": "awsui_drawers-trigger-overflow_hyvsj_1w7yt_253",
19
- "drawers-trigger": "awsui_drawers-trigger_hyvsj_1w7yt_239",
20
- "drawer": "awsui_drawer_hyvsj_1w7yt_145",
21
- "drawer-content-container": "awsui_drawer-content-container_hyvsj_1w7yt_283",
22
- "drawer-close-button": "awsui_drawer-close-button_hyvsj_1w7yt_292",
23
- "drawer-content": "awsui_drawer-content_hyvsj_1w7yt_283",
24
- "drawer-content-hidden": "awsui_drawer-content-hidden_hyvsj_1w7yt_300",
25
- "drawer-slider": "awsui_drawer-slider_hyvsj_1w7yt_303",
26
- "is-drawer-open": "awsui_is-drawer-open_hyvsj_1w7yt_310",
27
- "content": "awsui_content_hyvsj_1w7yt_336",
28
- "layout": "awsui_layout_hyvsj_1w7yt_357",
29
- "has-max-content-width": "awsui_has-max-content-width_hyvsj_1w7yt_440",
30
- "content-type-dashboard": "awsui_content-type-dashboard_hyvsj_1w7yt_455",
31
- "content-type-table": "awsui_content-type-table_hyvsj_1w7yt_469",
32
- "content-type-cards": "awsui_content-type-cards_hyvsj_1w7yt_469",
33
- "is-overlap-disabled": "awsui_is-overlap-disabled_hyvsj_1w7yt_475",
34
- "is-hide-mobile-toolbar": "awsui_is-hide-mobile-toolbar_hyvsj_1w7yt_478",
35
- "has-content-gap-left": "awsui_has-content-gap-left_hyvsj_1w7yt_510",
36
- "has-content-gap-right": "awsui_has-content-gap-right_hyvsj_1w7yt_513",
37
- "content-first-child-notifications": "awsui_content-first-child-notifications_hyvsj_1w7yt_523",
38
- "has-breadcrumbs": "awsui_has-breadcrumbs_hyvsj_1w7yt_526",
39
- "content-first-child-header": "awsui_content-first-child-header_hyvsj_1w7yt_529",
40
- "has-header": "awsui_has-header_hyvsj_1w7yt_529",
41
- "content-first-child-main": "awsui_content-first-child-main_hyvsj_1w7yt_550",
42
- "disable-content-paddings": "awsui_disable-content-paddings_hyvsj_1w7yt_550",
43
- "has-split-panel": "awsui_has-split-panel_hyvsj_1w7yt_593",
44
- "split-panel-position-bottom": "awsui_split-panel-position-bottom_hyvsj_1w7yt_593",
45
- "block-body-scroll": "awsui_block-body-scroll_hyvsj_1w7yt_609",
46
- "unfocusable": "awsui_unfocusable_hyvsj_1w7yt_614",
47
- "container": "awsui_container_hyvsj_1w7yt_624",
48
- "is-navigation-open": "awsui_is-navigation-open_hyvsj_1w7yt_649",
49
- "is-tools-open": "awsui_is-tools-open_hyvsj_1w7yt_652",
50
- "is-split-panel-open": "awsui_is-split-panel-open_hyvsj_1w7yt_652",
51
- "split-panel-position-side": "awsui_split-panel-position-side_hyvsj_1w7yt_652",
52
- "has-active-drawer": "awsui_has-active-drawer_hyvsj_1w7yt_652",
53
- "mobile-toolbar": "awsui_mobile-toolbar_hyvsj_1w7yt_661",
54
- "mobile-toolbar-nav": "awsui_mobile-toolbar-nav_hyvsj_1w7yt_677",
55
- "mobile-toolbar-breadcrumbs": "awsui_mobile-toolbar-breadcrumbs_hyvsj_1w7yt_681",
56
- "mobile-toolbar-tools": "awsui_mobile-toolbar-tools_hyvsj_1w7yt_685",
57
- "navigation-container": "awsui_navigation-container_hyvsj_1w7yt_694",
58
- "show-navigation": "awsui_show-navigation_hyvsj_1w7yt_738",
59
- "animating": "awsui_animating_hyvsj_1w7yt_760",
60
- "showButtons": "awsui_showButtons_hyvsj_1w7yt_1",
61
- "navigation": "awsui_navigation_hyvsj_1w7yt_694",
62
- "openNavigation": "awsui_openNavigation_hyvsj_1w7yt_1",
63
- "animated-content": "awsui_animated-content_hyvsj_1w7yt_822",
64
- "hide-navigation": "awsui_hide-navigation_hyvsj_1w7yt_831",
65
- "notifications": "awsui_notifications_hyvsj_1w7yt_841",
66
- "sticky-notifications": "awsui_sticky-notifications_hyvsj_1w7yt_847",
67
- "split-panel-bottom": "awsui_split-panel-bottom_hyvsj_1w7yt_864",
68
- "position-bottom": "awsui_position-bottom_hyvsj_1w7yt_911",
69
- "openSplitPanelBottom": "awsui_openSplitPanelBottom_hyvsj_1w7yt_1",
70
- "split-panel-side": "awsui_split-panel-side_hyvsj_1w7yt_940",
71
- "position-side": "awsui_position-side_hyvsj_1w7yt_953",
72
- "tools-container": "awsui_tools-container_hyvsj_1w7yt_975",
73
- "tools": "awsui_tools_hyvsj_1w7yt_975",
74
- "openTools": "awsui_openTools_hyvsj_1w7yt_1",
75
- "has-tools-form-persistence": "awsui_has-tools-form-persistence_hyvsj_1w7yt_1072",
76
- "hide-tools": "awsui_hide-tools_hyvsj_1w7yt_1082",
77
- "show-tools": "awsui_show-tools_hyvsj_1w7yt_1094",
78
- "has-tools-form": "awsui_has-tools-form_hyvsj_1w7yt_1072",
79
- "trigger-badge-wrapper": "awsui_trigger-badge-wrapper_hyvsj_1w7yt_1178",
80
- "trigger": "awsui_trigger_hyvsj_1w7yt_1178",
81
- "selected": "awsui_selected_hyvsj_1w7yt_1241",
82
- "badge": "awsui_badge_hyvsj_1w7yt_1261",
83
- "trigger-wrapper": "awsui_trigger-wrapper_hyvsj_1w7yt_1265",
84
- "dot": "awsui_dot_hyvsj_1w7yt_1271"
5
+ "background": "awsui_background_hyvsj_1lgfi_93",
6
+ "scrolling-background": "awsui_scrolling-background_hyvsj_1lgfi_96",
7
+ "sticky-background": "awsui_sticky-background_hyvsj_1lgfi_102",
8
+ "has-sticky-notifications": "awsui_has-sticky-notifications_hyvsj_1lgfi_110",
9
+ "breadcrumbs": "awsui_breadcrumbs_hyvsj_1lgfi_123",
10
+ "has-sticky-background": "awsui_has-sticky-background_hyvsj_1lgfi_133",
11
+ "drawers-container": "awsui_drawers-container_hyvsj_1lgfi_145",
12
+ "has-open-drawer": "awsui_has-open-drawer_hyvsj_1lgfi_156",
13
+ "disable-body-scroll": "awsui_disable-body-scroll_hyvsj_1lgfi_179",
14
+ "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_hyvsj_1lgfi_184",
15
+ "has-multiple-triggers": "awsui_has-multiple-triggers_hyvsj_1lgfi_225",
16
+ "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_hyvsj_1lgfi_235",
17
+ "drawers-trigger-content": "awsui_drawers-trigger-content_hyvsj_1lgfi_239",
18
+ "drawers-trigger-overflow": "awsui_drawers-trigger-overflow_hyvsj_1lgfi_253",
19
+ "drawers-trigger": "awsui_drawers-trigger_hyvsj_1lgfi_239",
20
+ "drawer": "awsui_drawer_hyvsj_1lgfi_145",
21
+ "drawer-content-container": "awsui_drawer-content-container_hyvsj_1lgfi_283",
22
+ "drawer-close-button": "awsui_drawer-close-button_hyvsj_1lgfi_292",
23
+ "drawer-content": "awsui_drawer-content_hyvsj_1lgfi_283",
24
+ "drawer-content-hidden": "awsui_drawer-content-hidden_hyvsj_1lgfi_300",
25
+ "drawer-slider": "awsui_drawer-slider_hyvsj_1lgfi_303",
26
+ "is-drawer-open": "awsui_is-drawer-open_hyvsj_1lgfi_310",
27
+ "content": "awsui_content_hyvsj_1lgfi_336",
28
+ "layout": "awsui_layout_hyvsj_1lgfi_357",
29
+ "has-max-content-width": "awsui_has-max-content-width_hyvsj_1lgfi_440",
30
+ "content-type-dashboard": "awsui_content-type-dashboard_hyvsj_1lgfi_455",
31
+ "content-type-table": "awsui_content-type-table_hyvsj_1lgfi_469",
32
+ "content-type-cards": "awsui_content-type-cards_hyvsj_1lgfi_469",
33
+ "is-overlap-disabled": "awsui_is-overlap-disabled_hyvsj_1lgfi_475",
34
+ "is-hide-mobile-toolbar": "awsui_is-hide-mobile-toolbar_hyvsj_1lgfi_478",
35
+ "has-content-gap-left": "awsui_has-content-gap-left_hyvsj_1lgfi_510",
36
+ "has-content-gap-right": "awsui_has-content-gap-right_hyvsj_1lgfi_513",
37
+ "content-first-child-notifications": "awsui_content-first-child-notifications_hyvsj_1lgfi_523",
38
+ "has-breadcrumbs": "awsui_has-breadcrumbs_hyvsj_1lgfi_526",
39
+ "content-first-child-header": "awsui_content-first-child-header_hyvsj_1lgfi_529",
40
+ "has-header": "awsui_has-header_hyvsj_1lgfi_529",
41
+ "content-first-child-main": "awsui_content-first-child-main_hyvsj_1lgfi_550",
42
+ "disable-content-paddings": "awsui_disable-content-paddings_hyvsj_1lgfi_550",
43
+ "has-split-panel": "awsui_has-split-panel_hyvsj_1lgfi_593",
44
+ "split-panel-position-bottom": "awsui_split-panel-position-bottom_hyvsj_1lgfi_593",
45
+ "block-body-scroll": "awsui_block-body-scroll_hyvsj_1lgfi_609",
46
+ "unfocusable": "awsui_unfocusable_hyvsj_1lgfi_614",
47
+ "container": "awsui_container_hyvsj_1lgfi_624",
48
+ "is-navigation-open": "awsui_is-navigation-open_hyvsj_1lgfi_649",
49
+ "is-tools-open": "awsui_is-tools-open_hyvsj_1lgfi_652",
50
+ "is-split-panel-open": "awsui_is-split-panel-open_hyvsj_1lgfi_652",
51
+ "split-panel-position-side": "awsui_split-panel-position-side_hyvsj_1lgfi_652",
52
+ "has-active-drawer": "awsui_has-active-drawer_hyvsj_1lgfi_652",
53
+ "mobile-toolbar": "awsui_mobile-toolbar_hyvsj_1lgfi_661",
54
+ "mobile-toolbar-nav": "awsui_mobile-toolbar-nav_hyvsj_1lgfi_677",
55
+ "mobile-toolbar-breadcrumbs": "awsui_mobile-toolbar-breadcrumbs_hyvsj_1lgfi_681",
56
+ "mobile-toolbar-tools": "awsui_mobile-toolbar-tools_hyvsj_1lgfi_685",
57
+ "navigation-container": "awsui_navigation-container_hyvsj_1lgfi_694",
58
+ "show-navigation": "awsui_show-navigation_hyvsj_1lgfi_738",
59
+ "animating": "awsui_animating_hyvsj_1lgfi_760",
60
+ "showButtons": "awsui_showButtons_hyvsj_1lgfi_1",
61
+ "navigation": "awsui_navigation_hyvsj_1lgfi_694",
62
+ "openNavigation": "awsui_openNavigation_hyvsj_1lgfi_1",
63
+ "animated-content": "awsui_animated-content_hyvsj_1lgfi_822",
64
+ "hide-navigation": "awsui_hide-navigation_hyvsj_1lgfi_831",
65
+ "notifications": "awsui_notifications_hyvsj_1lgfi_841",
66
+ "sticky-notifications": "awsui_sticky-notifications_hyvsj_1lgfi_847",
67
+ "split-panel-bottom": "awsui_split-panel-bottom_hyvsj_1lgfi_864",
68
+ "position-bottom": "awsui_position-bottom_hyvsj_1lgfi_911",
69
+ "openSplitPanelBottom": "awsui_openSplitPanelBottom_hyvsj_1lgfi_1",
70
+ "split-panel-side": "awsui_split-panel-side_hyvsj_1lgfi_940",
71
+ "position-side": "awsui_position-side_hyvsj_1lgfi_953",
72
+ "tools-container": "awsui_tools-container_hyvsj_1lgfi_975",
73
+ "tools": "awsui_tools_hyvsj_1lgfi_975",
74
+ "openTools": "awsui_openTools_hyvsj_1lgfi_1",
75
+ "has-tools-form-persistence": "awsui_has-tools-form-persistence_hyvsj_1lgfi_1072",
76
+ "hide-tools": "awsui_hide-tools_hyvsj_1lgfi_1082",
77
+ "show-tools": "awsui_show-tools_hyvsj_1lgfi_1094",
78
+ "has-tools-form": "awsui_has-tools-form_hyvsj_1lgfi_1072",
79
+ "trigger-badge-wrapper": "awsui_trigger-badge-wrapper_hyvsj_1lgfi_1178",
80
+ "trigger": "awsui_trigger_hyvsj_1lgfi_1178",
81
+ "selected": "awsui_selected_hyvsj_1lgfi_1241",
82
+ "badge": "awsui_badge_hyvsj_1lgfi_1261",
83
+ "trigger-wrapper": "awsui_trigger-wrapper_hyvsj_1lgfi_1265",
84
+ "dot": "awsui_dot_hyvsj_1lgfi_1271"
85
85
  };
86
86
 
package/lib/internal/template/container/internal.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["container/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA4B,MAAM,OAAO,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAOlF,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAI1E,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACzG,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC9C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC;IAEzE,oBAAoB,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,oBAAoB,CAAC,CAAC;IACjF,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,YAAY,CAAC,CAAC;CAClE;AAED,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,sBAAsB,eAWvE;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,SAAS,EACT,KAAK,EACL,cAAc,EACd,oBAAoB,EACpB,cAAsB,EACtB,iBAAwB,EACxB,sBAA8B,EAC9B,uBAA+B,EAC/B,eAAuB,EACvB,WAAW,EACX,YAAoB,EACpB,qBAA4B,EAC5B,oBAAoB,EACpB,YAAY,EACZ,GAAG,SAAS,EACb,EAAE,sBAAsB,eAuHxB"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["container/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA4B,MAAM,OAAO,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAQlF,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAI1E,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACzG,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC9C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC;IAEzE,oBAAoB,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,oBAAoB,CAAC,CAAC;IACjF,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,YAAY,CAAC,CAAC;CAClE;AAED,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,sBAAsB,eAWvE;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,SAAS,EACT,KAAK,EACL,cAAc,EACd,oBAAoB,EACpB,cAAsB,EACtB,iBAAwB,EACxB,sBAA8B,EAC9B,uBAA+B,EAC/B,eAAuB,EACvB,WAAW,EACX,YAAoB,EACpB,qBAA4B,EAC5B,oBAAoB,EACpB,YAAY,EACZ,GAAG,SAAS,EACb,EAAE,sBAAsB,eAuHxB"}
package/lib/internal/template/container/internal.js CHANGED
@@ -5,6 +5,7 @@ import clsx from 'clsx';
5
5
  import React, { useEffect, useRef } from 'react';
6
6
  import { getBaseProps } from '../internal/base-component';
7
7
  import { useAppLayoutContext } from '../internal/context/app-layout-context';
8
+ import { contentHeaderClassName } from '../internal/utils/content-header-utils';
8
9
  import { StickyHeaderContext, useStickyHeader } from './use-sticky-header';
9
10
  import { useDynamicOverlap } from '../internal/hooks/use-dynamic-overlap';
10
11
  import { useMergeRefs } from '../internal/hooks/use-merge-refs';
@@ -67,7 +68,7 @@ export default function InternalContainer(_a) {
67
68
  [styles['with-paddings']]: !disableHeaderPaddings,
68
69
  [styles['with-hidden-content']]: !children || __hiddenContent,
69
70
  [styles['header-with-media']]: hasMedia,
70
- }) }, stickyStyles, { ref: headerMergedRef }), __darkHeader ? (React.createElement("div", { className: clsx(styles['dark-header'], 'awsui-context-content-header') }, header)) : (header)))),
71
+ }) }, stickyStyles, { ref: headerMergedRef }), __darkHeader ? (React.createElement("div", { className: clsx(styles['dark-header'], contentHeaderClassName) }, header)) : (header)))),
71
72
  React.createElement("div", { className: clsx(styles.content, fitHeight && styles['content-fit-height'], {
72
73
  [styles['with-paddings']]: !disableContentPaddings,
73
74
  }) }, children),
package/lib/internal/template/container/internal.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["container/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAC;AAE7E,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC3E,OAAO,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAC;AAC1E,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AACrE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC;AACpE,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAwB9D,MAAM,UAAU,0BAA0B,CAAC,KAA6B;IACtE,MAAM,EAAE,UAAU,EAAE,kBAAkB,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAC9D,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,OAAO,CACL,oBAAC,iBAAiB,oBACZ,KAAK,IACT,YAAY,EAAE,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,SAAS,EAAC,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,UAAU,EACtE,oBAAoB,EAAE,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,SAAS,EAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,kBAAkB,IACvE,CACH,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EAsBjB;;QAtBiB,EACxC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,qBAAqB,GAAG,KAAK,EAC7B,sBAAsB,GAAG,KAAK,EAC9B,SAAS,EACT,KAAK,EACL,cAAc,EACd,oBAAoB,EACpB,cAAc,GAAG,KAAK,EACtB,iBAAiB,GAAG,IAAI,EACxB,sBAAsB,GAAG,KAAK,EAC9B,uBAAuB,GAAG,KAAK,EAC/B,eAAe,GAAG,KAAK,EACvB,WAAW,EACX,YAAY,GAAG,KAAK,EACpB,qBAAqB,GAAG,IAAI,EAC5B,oBAAoB,EACpB,YAAY,OAEW,EADpB,SAAS,cArB4B,6WAsBzC,CADa;IAEZ,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC7C,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC/C,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,YAAY,EAAE,GAAG,eAAe,CACzD,OAAO,EACP,SAAS,EACT,cAAc,EACd,cAAc,EACd,oBAAoB,EACpB,qBAAqB,CACtB,CAAC;IACF,MAAM,SAAS,GAAG,WAAW,EAAE,CAAC;IAChC,MAAM,EAAE,sBAAsB,EAAE,GAAG,mBAAmB,EAAE,CAAC;IACzD,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IAErC,MAAM,gBAAgB,GAAG,SAAS,IAAI,OAAO,KAAK,WAAW,CAAC;IAC9D,MAAM,cAAc,GAAG,iBAAiB,CAAC,EAAE,QAAQ,EAAE,CAAC,gBAAgB,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC;IAE3F,MAAM,SAAS,GAAG,YAAY,CAAC,OAAO,EAAE,iBAAiB,CAAC,CAAC;IAC3D,MAAM,eAAe,GAAG,YAAY,CAAC,SAAS,EAAE,cAAc,EAAE,WAAW,CAAC,CAAC;IAE7E;;;;OAIG;IACH,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,4BAA4B,GAAG,QAAQ,IAAI,OAAO,KAAK,WAAW,IAAI,sBAAsB,CAAC;QACnG,IAAI,4BAA4B,EAAE;YAChC,sBAAsB,CAAC,IAAI,CAAC,CAAC;SAC9B;QAED,OAAO,GAAG,EAAE;YACV,IAAI,4BAA4B,EAAE;gBAChC,sBAAsB,CAAC,KAAK,CAAC,CAAC;aAC/B;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,QAAQ,EAAE,sBAAsB,EAAE,OAAO,CAAC,CAAC,CAAC;IAEhD,4EAA4E;IAC5E,6HAA6H;IAC7H,MAAM,sBAAsB,GAAG,QAAQ,IAAI,CAAC,QAAQ,CAAC;IAErD,MAAM,QAAQ,GAAG,CAAC,CAAC,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,OAAO,CAAA,CAAC;IAClC,MAAM,aAAa,GAAG,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,mCAAI,KAAK,CAAC;IAE/C,OAAO,CACL,6CACM,SAAS,EACT,oBAAoB,IACxB,SAAS,EAAE,IAAI,CACb,SAAS,CAAC,SAAS,EACnB,MAAM,CAAC,IAAI,EACX,MAAM,CAAC,WAAW,OAAO,EAAE,CAAC,EAC5B,SAAS,IAAI,MAAM,CAAC,YAAY,CAAC,EACjC,QAAQ,IAAI,CAAC,aAAa,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,EAC7F,sBAAsB,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,EACpD,SAAS,IAAI,MAAM,CAAC,OAAO,CAC5B,EACD,GAAG,EAAE,SAAS;QAEb,QAAQ,IAAI,CACX,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,SAAS,aAAa,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,MAAM,CAAC,KAAK,CAAC,EAC3F,KAAK,EAAE,aAAa,KAAK,KAAK,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,KAAI,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,KAAI,EAAE,EAAE,IAE/F,KAAK,CAAC,OAAO,CACV,CACP;QACD,6BACE,EAAE,EAAE,SAAS,EACb,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,EAAE,SAAS,IAAI,MAAM,CAAC,4BAA4B,CAAC,CAAC;YAE5F,MAAM,IAAI,CACT,oBAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,OAAO,EAAE;gBAC9C,2CACE,SAAS,EAAE,IAAI,CAAC,SAAS,IAAI,MAAM,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,kBAAkB,OAAO,EAAE,CAAC,EAAE;wBAC/F,CAAC,MAAM,CAAC,wBAAwB,CAAC,CAAC,EAAE,cAAc,IAAI,CAAC,QAAQ;wBAC/D,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC,EAAE,QAAQ;wBAC3C,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC,EAAE,gBAAgB;wBACnD,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,OAAO;wBACjC,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,qBAAqB;wBACjD,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,EAAE,CAAC,QAAQ,IAAI,eAAe;wBAC7D,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,EAAE,QAAQ;qBACxC,CAAC,IACE,YAAY,IAChB,GAAG,EAAE,eAAe,KAEnB,YAAY,CAAC,CAAC,CAAC,CACd,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,8BAA8B,CAAC,IAAG,MAAM,CAAO,CAC5F,CAAC,CAAC,CAAC,CACF,MAAM,CACP,CACG,CACuB,CAChC;YACD,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,SAAS,IAAI,MAAM,CAAC,oBAAoB,CAAC,EAAE;oBACzE,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,sBAAsB;iBACnD,CAAC,IAED,QAAQ,CACL;YACL,MAAM,IAAI,CACT,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE;oBAC7B,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,CAAC,sBAAsB;oBACjD,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,uBAAuB;iBACpD,CAAC,IAED,MAAM,CACH,CACP,CACG,CACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useEffect, useRef } from 'react';\nimport { ContainerProps } from './interfaces';\nimport { getBaseProps } from '../internal/base-component';\nimport { useAppLayoutContext } from '../internal/context/app-layout-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { StickyHeaderContext, useStickyHeader } from './use-sticky-header';\nimport { useDynamicOverlap } from '../internal/hooks/use-dynamic-overlap';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\nimport { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport { useModalContext } from '../internal/context/modal-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\n\nexport interface InternalContainerProps extends Omit<ContainerProps, 'variant'>, InternalBaseComponentProps {\n __stickyHeader?: boolean;\n __stickyOffset?: number;\n __mobileStickyOffset?: number;\n __disableFooterDivider?: boolean;\n __disableFooterPaddings?: boolean;\n __hiddenContent?: boolean;\n __headerRef?: React.RefObject<HTMLDivElement>;\n __darkHeader?: boolean;\n __disableStickyMobile?: boolean;\n /**\n * Additional internal variant:\n * * `embedded` - Use this variant within a parent container (such as a modal,\n * expandable section, container or split panel).\n * * `full-page` – Only for internal use in table, cards and other components\n */\n variant?: ContainerProps['variant'] | 'embedded' | 'full-page' | 'cards';\n\n __funnelSubStepProps?: ReturnType<typeof useFunnelSubStep>['funnelSubStepProps'];\n __subStepRef?: ReturnType<typeof useFunnelSubStep>['subStepRef'];\n}\n\nexport function InternalContainerAsSubstep(props: InternalContainerProps) {\n const { subStepRef, funnelSubStepProps } = useFunnelSubStep();\n const modalContext = useModalContext();\n\n return (\n <InternalContainer\n {...props}\n __subStepRef={modalContext?.isInModal ? { current: null } : subStepRef}\n __funnelSubStepProps={modalContext?.isInModal ? {} : funnelSubStepProps}\n />\n );\n}\n\nexport default function InternalContainer({\n header,\n footer,\n children,\n variant = 'default',\n disableHeaderPaddings = false,\n disableContentPaddings = false,\n fitHeight,\n media,\n __stickyOffset,\n __mobileStickyOffset,\n __stickyHeader = false,\n __internalRootRef = null,\n __disableFooterDivider = false,\n __disableFooterPaddings = false,\n __hiddenContent = false,\n __headerRef,\n __darkHeader = false,\n __disableStickyMobile = true,\n __funnelSubStepProps,\n __subStepRef,\n ...restProps\n}: InternalContainerProps) {\n const isMobile = useMobile();\n const baseProps = getBaseProps(restProps);\n const rootRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLDivElement>(null);\n const { isSticky, isStuck, stickyStyles } = useStickyHeader(\n rootRef,\n headerRef,\n __stickyHeader,\n __stickyOffset,\n __mobileStickyOffset,\n __disableStickyMobile\n );\n const contentId = useUniqueId();\n const { setHasStickyBackground } = useAppLayoutContext();\n const isRefresh = useVisualRefresh();\n\n const hasDynamicHeight = isRefresh && variant === 'full-page';\n const overlapElement = useDynamicOverlap({ disabled: !hasDynamicHeight || !__darkHeader });\n\n const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n const headerMergedRef = useMergeRefs(headerRef, overlapElement, __headerRef);\n\n /**\n * The visual refresh AppLayout component needs to know if a child component\n * has a high contrast sticky header. This is to make sure the background element\n * stays in the same vertical position as the header content.\n */\n useEffect(() => {\n const shouldUpdateStickyBackground = isSticky && variant === 'full-page' && setHasStickyBackground;\n if (shouldUpdateStickyBackground) {\n setHasStickyBackground(true);\n }\n\n return () => {\n if (shouldUpdateStickyBackground) {\n setHasStickyBackground(false);\n }\n };\n }, [isSticky, setHasStickyBackground, variant]);\n\n // The container is only sticky on mobile if it is the header for the table.\n // In this case we don't want the container to have sticky styles, as only the table header row will show as stuck on scroll.\n const shouldHaveStickyStyles = isSticky && !isMobile;\n\n const hasMedia = !!media?.content;\n const mediaPosition = media?.position ?? 'top';\n\n return (\n <div\n {...baseProps}\n {...__funnelSubStepProps}\n className={clsx(\n baseProps.className,\n styles.root,\n styles[`variant-${variant}`],\n fitHeight && styles['fit-height'],\n hasMedia && (mediaPosition === 'side' ? styles['with-side-media'] : styles['with-top-media']),\n shouldHaveStickyStyles && [styles['sticky-enabled']],\n isRefresh && styles.refresh\n )}\n ref={mergedRef}\n >\n {hasMedia && (\n <div\n className={clsx(styles[`media-${mediaPosition === 'side' ? 'side' : 'top'}`], styles.media)}\n style={mediaPosition === 'top' ? { height: media?.height || '' } : { width: media?.width || '' }}\n >\n {media.content}\n </div>\n )}\n <div\n id={contentId}\n ref={__subStepRef}\n className={clsx(styles['content-wrapper'], fitHeight && styles['content-wrapper-fit-height'])}\n >\n {header && (\n <StickyHeaderContext.Provider value={{ isStuck }}>\n <div\n className={clsx(isRefresh && styles.refresh, styles.header, styles[`header-variant-${variant}`], {\n [styles['header-sticky-disabled']]: __stickyHeader && !isSticky,\n [styles['header-sticky-enabled']]: isSticky,\n [styles['header-dynamic-height']]: hasDynamicHeight,\n [styles['header-stuck']]: isStuck,\n [styles['with-paddings']]: !disableHeaderPaddings,\n [styles['with-hidden-content']]: !children || __hiddenContent,\n [styles['header-with-media']]: hasMedia,\n })}\n {...stickyStyles}\n ref={headerMergedRef}\n >\n {__darkHeader ? (\n <div className={clsx(styles['dark-header'], 'awsui-context-content-header')}>{header}</div>\n ) : (\n header\n )}\n </div>\n </StickyHeaderContext.Provider>\n )}\n <div\n className={clsx(styles.content, fitHeight && styles['content-fit-height'], {\n [styles['with-paddings']]: !disableContentPaddings,\n })}\n >\n {children}\n </div>\n {footer && (\n <div\n className={clsx(styles.footer, {\n [styles['with-divider']]: !__disableFooterDivider,\n [styles['with-paddings']]: !__disableFooterPaddings,\n })}\n >\n {footer}\n </div>\n )}\n </div>\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["container/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 clsx from 'clsx';\nimport React, { useEffect, useRef } from 'react';\nimport { ContainerProps } from './interfaces';\nimport { getBaseProps } from '../internal/base-component';\nimport { useAppLayoutContext } from '../internal/context/app-layout-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { contentHeaderClassName } from '../internal/utils/content-header-utils';\nimport { StickyHeaderContext, useStickyHeader } from './use-sticky-header';\nimport { useDynamicOverlap } from '../internal/hooks/use-dynamic-overlap';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\nimport { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport { useModalContext } from '../internal/context/modal-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\n\nexport interface InternalContainerProps extends Omit<ContainerProps, 'variant'>, InternalBaseComponentProps {\n __stickyHeader?: boolean;\n __stickyOffset?: number;\n __mobileStickyOffset?: number;\n __disableFooterDivider?: boolean;\n __disableFooterPaddings?: boolean;\n __hiddenContent?: boolean;\n __headerRef?: React.RefObject<HTMLDivElement>;\n __darkHeader?: boolean;\n __disableStickyMobile?: boolean;\n /**\n * Additional internal variant:\n * * `embedded` - Use this variant within a parent container (such as a modal,\n * expandable section, container or split panel).\n * * `full-page` – Only for internal use in table, cards and other components\n */\n variant?: ContainerProps['variant'] | 'embedded' | 'full-page' | 'cards';\n\n __funnelSubStepProps?: ReturnType<typeof useFunnelSubStep>['funnelSubStepProps'];\n __subStepRef?: ReturnType<typeof useFunnelSubStep>['subStepRef'];\n}\n\nexport function InternalContainerAsSubstep(props: InternalContainerProps) {\n const { subStepRef, funnelSubStepProps } = useFunnelSubStep();\n const modalContext = useModalContext();\n\n return (\n <InternalContainer\n {...props}\n __subStepRef={modalContext?.isInModal ? { current: null } : subStepRef}\n __funnelSubStepProps={modalContext?.isInModal ? {} : funnelSubStepProps}\n />\n );\n}\n\nexport default function InternalContainer({\n header,\n footer,\n children,\n variant = 'default',\n disableHeaderPaddings = false,\n disableContentPaddings = false,\n fitHeight,\n media,\n __stickyOffset,\n __mobileStickyOffset,\n __stickyHeader = false,\n __internalRootRef = null,\n __disableFooterDivider = false,\n __disableFooterPaddings = false,\n __hiddenContent = false,\n __headerRef,\n __darkHeader = false,\n __disableStickyMobile = true,\n __funnelSubStepProps,\n __subStepRef,\n ...restProps\n}: InternalContainerProps) {\n const isMobile = useMobile();\n const baseProps = getBaseProps(restProps);\n const rootRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLDivElement>(null);\n const { isSticky, isStuck, stickyStyles } = useStickyHeader(\n rootRef,\n headerRef,\n __stickyHeader,\n __stickyOffset,\n __mobileStickyOffset,\n __disableStickyMobile\n );\n const contentId = useUniqueId();\n const { setHasStickyBackground } = useAppLayoutContext();\n const isRefresh = useVisualRefresh();\n\n const hasDynamicHeight = isRefresh && variant === 'full-page';\n const overlapElement = useDynamicOverlap({ disabled: !hasDynamicHeight || !__darkHeader });\n\n const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n const headerMergedRef = useMergeRefs(headerRef, overlapElement, __headerRef);\n\n /**\n * The visual refresh AppLayout component needs to know if a child component\n * has a high contrast sticky header. This is to make sure the background element\n * stays in the same vertical position as the header content.\n */\n useEffect(() => {\n const shouldUpdateStickyBackground = isSticky && variant === 'full-page' && setHasStickyBackground;\n if (shouldUpdateStickyBackground) {\n setHasStickyBackground(true);\n }\n\n return () => {\n if (shouldUpdateStickyBackground) {\n setHasStickyBackground(false);\n }\n };\n }, [isSticky, setHasStickyBackground, variant]);\n\n // The container is only sticky on mobile if it is the header for the table.\n // In this case we don't want the container to have sticky styles, as only the table header row will show as stuck on scroll.\n const shouldHaveStickyStyles = isSticky && !isMobile;\n\n const hasMedia = !!media?.content;\n const mediaPosition = media?.position ?? 'top';\n\n return (\n <div\n {...baseProps}\n {...__funnelSubStepProps}\n className={clsx(\n baseProps.className,\n styles.root,\n styles[`variant-${variant}`],\n fitHeight && styles['fit-height'],\n hasMedia && (mediaPosition === 'side' ? styles['with-side-media'] : styles['with-top-media']),\n shouldHaveStickyStyles && [styles['sticky-enabled']],\n isRefresh && styles.refresh\n )}\n ref={mergedRef}\n >\n {hasMedia && (\n <div\n className={clsx(styles[`media-${mediaPosition === 'side' ? 'side' : 'top'}`], styles.media)}\n style={mediaPosition === 'top' ? { height: media?.height || '' } : { width: media?.width || '' }}\n >\n {media.content}\n </div>\n )}\n <div\n id={contentId}\n ref={__subStepRef}\n className={clsx(styles['content-wrapper'], fitHeight && styles['content-wrapper-fit-height'])}\n >\n {header && (\n <StickyHeaderContext.Provider value={{ isStuck }}>\n <div\n className={clsx(isRefresh && styles.refresh, styles.header, styles[`header-variant-${variant}`], {\n [styles['header-sticky-disabled']]: __stickyHeader && !isSticky,\n [styles['header-sticky-enabled']]: isSticky,\n [styles['header-dynamic-height']]: hasDynamicHeight,\n [styles['header-stuck']]: isStuck,\n [styles['with-paddings']]: !disableHeaderPaddings,\n [styles['with-hidden-content']]: !children || __hiddenContent,\n [styles['header-with-media']]: hasMedia,\n })}\n {...stickyStyles}\n ref={headerMergedRef}\n >\n {__darkHeader ? (\n <div className={clsx(styles['dark-header'], contentHeaderClassName)}>{header}</div>\n ) : (\n header\n )}\n </div>\n </StickyHeaderContext.Provider>\n )}\n <div\n className={clsx(styles.content, fitHeight && styles['content-fit-height'], {\n [styles['with-paddings']]: !disableContentPaddings,\n })}\n >\n {children}\n </div>\n {footer && (\n <div\n className={clsx(styles.footer, {\n [styles['with-divider']]: !__disableFooterDivider,\n [styles['with-paddings']]: !__disableFooterPaddings,\n })}\n >\n {footer}\n </div>\n )}\n </div>\n </div>\n );\n}\n"]}
package/lib/internal/template/content-layout/internal.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["content-layout/internal.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAElD,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAMlF,KAAK,0BAA0B,GAAG,kBAAkB,GAAG,0BAA0B,CAAC;AAElF,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,QAAQ,EACR,cAAc,EACd,MAAM,EACN,iBAAiB,EACjB,GAAG,IAAI,EACR,EAAE,0BAA0B,eAkC5B"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["content-layout/internal.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAGlD,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAMlF,KAAK,0BAA0B,GAAG,kBAAkB,GAAG,0BAA0B,CAAC;AAElF,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,QAAQ,EACR,cAAc,EACd,MAAM,EACN,iBAAiB,EACjB,GAAG,IAAI,EACR,EAAE,0BAA0B,eAkC5B"}
package/lib/internal/template/content-layout/internal.js CHANGED
@@ -4,6 +4,7 @@ import { __rest } from "tslib";
4
4
  import React, { useRef } from 'react';
5
5
  import clsx from 'clsx';
6
6
  import { getBaseProps } from '../internal/base-component';
7
+ import { contentHeaderClassName } from '../internal/utils/content-header-utils';
7
8
  import { useDynamicOverlap } from '../internal/hooks/use-dynamic-overlap';
8
9
  import { useMergeRefs } from '../internal/hooks/use-merge-refs';
9
10
  import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
@@ -21,8 +22,8 @@ export default function InternalContentLayout(_a) {
21
22
  [styles['is-visual-refresh']]: isVisualRefresh,
22
23
  [styles['has-header']]: !!header,
23
24
  }), ref: mergedRef }),
24
- React.createElement("div", { className: clsx(styles.background, { [styles['is-overlap-disabled']]: isOverlapDisabled }, 'awsui-context-content-header'), ref: overlapElement }),
25
- header && React.createElement("div", { className: clsx(styles.header, 'awsui-context-content-header') }, header),
25
+ React.createElement("div", { className: clsx(styles.background, { [styles['is-overlap-disabled']]: isOverlapDisabled }, contentHeaderClassName), ref: overlapElement }),
26
+ header && React.createElement("div", { className: clsx(styles.header, contentHeaderClassName) }, header),
26
27
  React.createElement("div", { className: styles.content }, children)));
27
28
  }
28
29
  //# sourceMappingURL=internal.js.map
package/lib/internal/template/content-layout/internal.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["content-layout/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAC;AAC1E,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AACrE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAMjB;QANiB,EAC5C,QAAQ,EACR,cAAc,EACd,MAAM,EACN,iBAAiB,OAEU,EADxB,IAAI,cALqC,6DAM7C,CADQ;IAEP,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,MAAM,WAAW,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACjD,MAAM,SAAS,GAAG,YAAY,CAAC,WAAW,EAAE,iBAAiB,CAAC,CAAC;IAE/D,MAAM,eAAe,GAAG,gBAAgB,EAAE,CAAC;IAC3C,MAAM,cAAc,GAAG,iBAAiB,EAAE,CAAC;IAE3C,MAAM,iBAAiB,GAAG,CAAC,QAAQ,IAAI,cAAc,CAAC;IAEtD,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE;YAClD,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,EAAE,iBAAiB;YAClD,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,EAAE,eAAe;YAC9C,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM;SACjC,CAAC,EACF,GAAG,EAAE,SAAS;QAEd,6BACE,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,UAAU,EACjB,EAAE,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,EAAE,iBAAiB,EAAE,EACtD,8BAA8B,CAC/B,EACD,GAAG,EAAE,cAAc,GACnB;QAED,MAAM,IAAI,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,8BAA8B,CAAC,IAAG,MAAM,CAAO;QAE9F,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,QAAQ,CAAO,CAC5C,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\nimport { ContentLayoutProps } from './interfaces';\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useDynamicOverlap } from '../internal/hooks/use-dynamic-overlap';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\n\ntype InternalContentLayoutProps = ContentLayoutProps & InternalBaseComponentProps;\n\nexport default function InternalContentLayout({\n children,\n disableOverlap,\n header,\n __internalRootRef,\n ...rest\n}: InternalContentLayoutProps) {\n const baseProps = getBaseProps(rest);\n const rootElement = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs(rootElement, __internalRootRef);\n\n const isVisualRefresh = useVisualRefresh();\n const overlapElement = useDynamicOverlap();\n\n const isOverlapDisabled = !children || disableOverlap;\n\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.layout, {\n [styles['is-overlap-disabled']]: isOverlapDisabled,\n [styles['is-visual-refresh']]: isVisualRefresh,\n [styles['has-header']]: !!header,\n })}\n ref={mergedRef}\n >\n <div\n className={clsx(\n styles.background,\n { [styles['is-overlap-disabled']]: isOverlapDisabled },\n 'awsui-context-content-header'\n )}\n ref={overlapElement}\n />\n\n {header && <div className={clsx(styles.header, 'awsui-context-content-header')}>{header}</div>}\n\n <div className={styles.content}>{children}</div>\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["content-layout/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,sBAAsB,EAAE,MAAM,wCAAwC,CAAC;AAEhF,OAAO,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAC;AAC1E,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AACrE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAMjB;QANiB,EAC5C,QAAQ,EACR,cAAc,EACd,MAAM,EACN,iBAAiB,OAEU,EADxB,IAAI,cALqC,6DAM7C,CADQ;IAEP,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,MAAM,WAAW,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACjD,MAAM,SAAS,GAAG,YAAY,CAAC,WAAW,EAAE,iBAAiB,CAAC,CAAC;IAE/D,MAAM,eAAe,GAAG,gBAAgB,EAAE,CAAC;IAC3C,MAAM,cAAc,GAAG,iBAAiB,EAAE,CAAC;IAE3C,MAAM,iBAAiB,GAAG,CAAC,QAAQ,IAAI,cAAc,CAAC;IAEtD,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE;YAClD,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,EAAE,iBAAiB;YAClD,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,EAAE,eAAe;YAC9C,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM;SACjC,CAAC,EACF,GAAG,EAAE,SAAS;QAEd,6BACE,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,UAAU,EACjB,EAAE,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,EAAE,iBAAiB,EAAE,EACtD,sBAAsB,CACvB,EACD,GAAG,EAAE,cAAc,GACnB;QAED,MAAM,IAAI,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,sBAAsB,CAAC,IAAG,MAAM,CAAO;QAEtF,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,QAAQ,CAAO,CAC5C,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\nimport { ContentLayoutProps } from './interfaces';\nimport { getBaseProps } from '../internal/base-component';\nimport { contentHeaderClassName } from '../internal/utils/content-header-utils';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useDynamicOverlap } from '../internal/hooks/use-dynamic-overlap';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\n\ntype InternalContentLayoutProps = ContentLayoutProps & InternalBaseComponentProps;\n\nexport default function InternalContentLayout({\n children,\n disableOverlap,\n header,\n __internalRootRef,\n ...rest\n}: InternalContentLayoutProps) {\n const baseProps = getBaseProps(rest);\n const rootElement = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs(rootElement, __internalRootRef);\n\n const isVisualRefresh = useVisualRefresh();\n const overlapElement = useDynamicOverlap();\n\n const isOverlapDisabled = !children || disableOverlap;\n\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.layout, {\n [styles['is-overlap-disabled']]: isOverlapDisabled,\n [styles['is-visual-refresh']]: isVisualRefresh,\n [styles['has-header']]: !!header,\n })}\n ref={mergedRef}\n >\n <div\n className={clsx(\n styles.background,\n { [styles['is-overlap-disabled']]: isOverlapDisabled },\n contentHeaderClassName\n )}\n ref={overlapElement}\n />\n\n {header && <div className={clsx(styles.header, contentHeaderClassName)}>{header}</div>}\n\n <div className={styles.content}>{children}</div>\n </div>\n );\n}\n"]}
package/lib/internal/template/internal/components/dark-ribbon/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/components/dark-ribbon/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAKjD,UAAU,eAAe;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAQD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,eAAe,EAAE,EAAE,eAAe,eA0C3F"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/components/dark-ribbon/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAMjD,UAAU,eAAe;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAQD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,eAAe,EAAE,EAAE,eAAe,eA0C3F"}
package/lib/internal/template/internal/components/dark-ribbon/index.js CHANGED
@@ -2,6 +2,7 @@
2
2
  // SPDX-License-Identifier: Apache-2.0
3
3
  import React, { useEffect, useRef } from 'react';
4
4
  import { useMutationObserver } from '../../hooks/use-mutation-observer';
5
+ import { contentHeaderClassName } from '../../utils/content-header-utils';
5
6
  import styles from './styles.css.js';
6
7
  import { useStableCallback } from '@cloudscape-design/component-toolkit/internal';
7
8
  function setIfChanged(oldValue, newValue, setter) {
@@ -39,7 +40,7 @@ export default function DarkRibbon({ children, isRefresh, hasPlainStyling }) {
39
40
  if (hasPlainStyling === true || !isRefresh) {
40
41
  return React.createElement(React.Fragment, null, children);
41
42
  }
42
- return (React.createElement("div", { ref: containerRef, className: "awsui-context-content-header" },
43
+ return (React.createElement("div", { ref: containerRef, className: contentHeaderClassName },
43
44
  React.createElement("div", { ref: fillRef, className: styles['background-fill'] }),
44
45
  React.createElement("div", { className: styles.content }, children)));
45
46
  }
package/lib/internal/template/internal/components/dark-ribbon/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/dark-ribbon/index.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, { useEffect, useRef } from 'react';\nimport { useMutationObserver } from '../../hooks/use-mutation-observer';\nimport styles from './styles.css.js';\nimport { useStableCallback } from '@cloudscape-design/component-toolkit/internal';\n\ninterface DarkRibbonProps {\n children: React.ReactNode;\n isRefresh: boolean;\n hasPlainStyling?: boolean;\n}\n\nfunction setIfChanged(oldValue: string, newValue: string, setter: (newValue: string) => void) {\n if (oldValue !== newValue) {\n setter(newValue);\n }\n}\n\nexport default function DarkRibbon({ children, isRefresh, hasPlainStyling }: DarkRibbonProps) {\n const containerRef = useRef<HTMLDivElement>(null);\n const fillRef = useRef<HTMLDivElement>(null);\n const syncSizes = useStableCallback((from: HTMLElement, to: HTMLElement) => {\n // JSDOM calls mutation observer callback even if attribute did not change\n // https://github.com/jsdom/jsdom/issues/3305\n // To prevent infinite loops, we need to check the values before setting\n const size = from.getBoundingClientRect();\n const { height: oldHeight, left: oldLeft, right: oldRight } = to.style;\n setIfChanged(oldHeight, `${size.height}px`, newHeight => (to.style.height = newHeight));\n setIfChanged(oldLeft, `${-1 * size.left}px`, newLeft => (to.style.left = newLeft));\n setIfChanged(\n oldRight,\n `${-1 * (document.body.clientWidth - size.right)}px`,\n newRight => (to.style.right = newRight)\n );\n });\n useMutationObserver(containerRef, node => {\n if (fillRef.current) {\n syncSizes(node, fillRef.current);\n }\n });\n useEffect(() => {\n const handler = () => {\n if (containerRef.current && fillRef.current) {\n syncSizes(containerRef.current, fillRef.current);\n }\n };\n window.addEventListener('resize', handler);\n return () => window.removeEventListener('resize', handler);\n }, [syncSizes]);\n\n if (hasPlainStyling === true || !isRefresh) {\n return <>{children}</>;\n }\n\n return (\n <div ref={containerRef} className=\"awsui-context-content-header\">\n <div ref={fillRef} className={styles['background-fill']} />\n <div className={styles.content}>{children}</div>\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/dark-ribbon/index.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, { useEffect, useRef } from 'react';\nimport { useMutationObserver } from '../../hooks/use-mutation-observer';\nimport { contentHeaderClassName } from '../../utils/content-header-utils';\nimport styles from './styles.css.js';\nimport { useStableCallback } from '@cloudscape-design/component-toolkit/internal';\n\ninterface DarkRibbonProps {\n children: React.ReactNode;\n isRefresh: boolean;\n hasPlainStyling?: boolean;\n}\n\nfunction setIfChanged(oldValue: string, newValue: string, setter: (newValue: string) => void) {\n if (oldValue !== newValue) {\n setter(newValue);\n }\n}\n\nexport default function DarkRibbon({ children, isRefresh, hasPlainStyling }: DarkRibbonProps) {\n const containerRef = useRef<HTMLDivElement>(null);\n const fillRef = useRef<HTMLDivElement>(null);\n const syncSizes = useStableCallback((from: HTMLElement, to: HTMLElement) => {\n // JSDOM calls mutation observer callback even if attribute did not change\n // https://github.com/jsdom/jsdom/issues/3305\n // To prevent infinite loops, we need to check the values before setting\n const size = from.getBoundingClientRect();\n const { height: oldHeight, left: oldLeft, right: oldRight } = to.style;\n setIfChanged(oldHeight, `${size.height}px`, newHeight => (to.style.height = newHeight));\n setIfChanged(oldLeft, `${-1 * size.left}px`, newLeft => (to.style.left = newLeft));\n setIfChanged(\n oldRight,\n `${-1 * (document.body.clientWidth - size.right)}px`,\n newRight => (to.style.right = newRight)\n );\n });\n useMutationObserver(containerRef, node => {\n if (fillRef.current) {\n syncSizes(node, fillRef.current);\n }\n });\n useEffect(() => {\n const handler = () => {\n if (containerRef.current && fillRef.current) {\n syncSizes(containerRef.current, fillRef.current);\n }\n };\n window.addEventListener('resize', handler);\n return () => window.removeEventListener('resize', handler);\n }, [syncSizes]);\n\n if (hasPlainStyling === true || !isRefresh) {\n return <>{children}</>;\n }\n\n return (\n <div ref={containerRef} className={contentHeaderClassName}>\n <div ref={fillRef} className={styles['background-fill']} />\n <div className={styles.content}>{children}</div>\n </div>\n );\n}\n"]}
package/lib/internal/template/internal/environment.js CHANGED
@@ -1,4 +1,4 @@
1
1
  export var PACKAGE_SOURCE = "components";
2
- export var PACKAGE_VERSION = "3.0.0 (1bbe2c94)";
2
+ export var PACKAGE_VERSION = "3.0.0 (d1f65846)";
3
3
  export var THEME = "open-source-visual-refresh";
4
4
  export var ALWAYS_VISUAL_REFRESH = true;
package/lib/internal/template/internal/environment.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "PACKAGE_SOURCE": "components",
3
- "PACKAGE_VERSION": "3.0.0 (1bbe2c94)",
3
+ "PACKAGE_VERSION": "3.0.0 (d1f65846)",
4
4
  "THEME": "default",
5
5
  "ALWAYS_VISUAL_REFRESH": false
6
6
  }
package/lib/internal/template/internal/generated/styles/tokens.d.ts CHANGED
@@ -205,6 +205,7 @@ export const colorBorderDividerDefault: string;
205
205
  export const colorBorderDividerSecondary: string;
206
206
  export const colorBorderDropdownItemHover: string;
207
207
  export const colorBorderInputDefault: string;
208
+ export const colorBorderInputFocused: string;
208
209
  export const colorBorderItemFocused: string;
209
210
  export const colorBorderDropdownItemFocused: string;
210
211
  export const colorBorderItemSelected: string;
package/lib/internal/template/internal/generated/styles/tokens.js CHANGED
@@ -205,6 +205,7 @@ export var colorBorderDividerDefault = "var(--color-border-divider-default-j74ly
205
205
  export var colorBorderDividerSecondary = "var(--color-border-divider-secondary-um17yo, #e9ebed)";
206
206
  export var colorBorderDropdownItemHover = "var(--color-border-dropdown-item-hover-461g78, #7d8998)";
207
207
  export var colorBorderInputDefault = "var(--color-border-input-default-1zl7hq, #7d8998)";
208
+ export var colorBorderInputFocused = "var(--color-border-input-focused-3d15sl, #033160)";
208
209
  export var colorBorderItemFocused = "var(--color-border-item-focused-b2ntyl, #0972d3)";
209
210
  export var colorBorderDropdownItemFocused = "var(--color-border-dropdown-item-focused-5hbaf3, #414d5c)";
210
211
  export var colorBorderItemSelected = "var(--color-border-item-selected-k00wlz, #0972d3)";
package/lib/internal/template/internal/generated/theming/index.cjs CHANGED
@@ -9177,6 +9177,7 @@ module.exports.preset = {
9177
9177
  "colorBorderDividerSecondary",
9178
9178
  "colorBorderDropdownItemHover",
9179
9179
  "colorBorderInputDefault",
9180
+ "colorBorderInputFocused",
9180
9181
  "colorBorderItemFocused",
9181
9182
  "colorBorderDropdownItemFocused",
9182
9183
  "colorBorderItemSelected",
@@ -9488,6 +9489,7 @@ module.exports.preset = {
9488
9489
  "colorBorderDividerSecondary",
9489
9490
  "colorBorderDropdownItemHover",
9490
9491
  "colorBorderInputDefault",
9492
+ "colorBorderInputFocused",
9491
9493
  "colorBorderItemFocused",
9492
9494
  "colorBorderDropdownItemFocused",
9493
9495
  "colorBorderItemSelected",
package/lib/internal/template/internal/generated/theming/index.cjs.d.ts CHANGED
@@ -116,6 +116,7 @@ export declare interface TypedOverride {
116
116
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
117
117
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
118
118
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
119
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
119
120
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
120
121
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
121
122
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -336,6 +337,7 @@ export declare interface TypedOverride {
336
337
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
337
338
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
338
339
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
340
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
339
341
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
340
342
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
341
343
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -556,6 +558,7 @@ export declare interface TypedOverride {
556
558
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
557
559
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
558
560
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
561
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
559
562
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
560
563
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
561
564
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -776,6 +779,7 @@ export declare interface TypedOverride {
776
779
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
777
780
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
778
781
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
782
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
779
783
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
780
784
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
781
785
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -996,6 +1000,7 @@ export declare interface TypedOverride {
996
1000
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
997
1001
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
998
1002
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1003
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
999
1004
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1000
1005
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1001
1006
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -1216,6 +1221,7 @@ export declare interface TypedOverride {
1216
1221
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1217
1222
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1218
1223
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1224
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1219
1225
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1220
1226
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1221
1227
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -1436,6 +1442,7 @@ export declare interface TypedOverride {
1436
1442
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1437
1443
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1438
1444
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1445
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1439
1446
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1440
1447
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1441
1448
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -1656,6 +1663,7 @@ export declare interface TypedOverride {
1656
1663
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1657
1664
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1658
1665
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1666
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1659
1667
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1660
1668
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1661
1669
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
package/lib/internal/template/internal/generated/theming/index.d.ts CHANGED
@@ -116,6 +116,7 @@ export declare interface TypedOverride {
116
116
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
117
117
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
118
118
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
119
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
119
120
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
120
121
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
121
122
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -336,6 +337,7 @@ export declare interface TypedOverride {
336
337
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
337
338
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
338
339
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
340
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
339
341
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
340
342
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
341
343
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -556,6 +558,7 @@ export declare interface TypedOverride {
556
558
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
557
559
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
558
560
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
561
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
559
562
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
560
563
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
561
564
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -776,6 +779,7 @@ export declare interface TypedOverride {
776
779
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
777
780
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
778
781
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
782
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
779
783
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
780
784
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
781
785
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -996,6 +1000,7 @@ export declare interface TypedOverride {
996
1000
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
997
1001
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
998
1002
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1003
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
999
1004
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1000
1005
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1001
1006
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -1216,6 +1221,7 @@ export declare interface TypedOverride {
1216
1221
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1217
1222
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1218
1223
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1224
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1219
1225
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1220
1226
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1221
1227
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -1436,6 +1442,7 @@ export declare interface TypedOverride {
1436
1442
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1437
1443
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1438
1444
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1445
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1439
1446
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1440
1447
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1441
1448
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
@@ -1656,6 +1663,7 @@ export declare interface TypedOverride {
1656
1663
  colorBorderDividerSecondary?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1657
1664
  colorBorderDropdownItemHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1658
1665
  colorBorderInputDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1666
+ colorBorderInputFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1659
1667
  colorBorderItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1660
1668
  colorBorderDropdownItemFocused?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1661
1669
  colorBorderItemSelected?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
package/lib/internal/template/internal/generated/theming/index.js CHANGED
@@ -9177,6 +9177,7 @@ export var preset = {
9177
9177
  "colorBorderDividerSecondary",
9178
9178
  "colorBorderDropdownItemHover",
9179
9179
  "colorBorderInputDefault",
9180
+ "colorBorderInputFocused",
9180
9181
  "colorBorderItemFocused",
9181
9182
  "colorBorderDropdownItemFocused",
9182
9183
  "colorBorderItemSelected",
@@ -9488,6 +9489,7 @@ export var preset = {
9488
9489
  "colorBorderDividerSecondary",
9489
9490
  "colorBorderDropdownItemHover",
9490
9491
  "colorBorderInputDefault",
9492
+ "colorBorderInputFocused",
9491
9493
  "colorBorderItemFocused",
9492
9494
  "colorBorderDropdownItemFocused",
9493
9495
  "colorBorderItemSelected",
package/lib/internal/template/internal/utils/content-header-utils.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ export declare const contentHeaderClassName: string;
2
+ //# sourceMappingURL=content-header-utils.d.ts.map
package/lib/internal/template/internal/utils/content-header-utils.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"content-header-utils.d.ts","sourceRoot":"lib/default/","sources":["internal/utils/content-header-utils.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,sBAAsB,EAAE,MAEH,CAAC"}
package/lib/internal/template/internal/utils/content-header-utils.js ADDED
@@ -0,0 +1,7 @@
1
+ // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
+ // SPDX-License-Identifier: Apache-2.0
3
+ import { getGlobalFlag } from './global-flags';
4
+ export const contentHeaderClassName = getGlobalFlag('removeHighContrastHeader')
5
+ ? ''
6
+ : 'awsui-context-content-header';
7
+ //# sourceMappingURL=content-header-utils.js.map
package/lib/internal/template/internal/utils/content-header-utils.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"content-header-utils.js","sourceRoot":"lib/default/","sources":["internal/utils/content-header-utils.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAE/C,MAAM,CAAC,MAAM,sBAAsB,GAAW,aAAa,CAAC,0BAA0B,CAAC;IACrF,CAAC,CAAC,EAAE;IACJ,CAAC,CAAC,8BAA8B,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { getGlobalFlag } from './global-flags';\n\nexport const contentHeaderClassName: string = getGlobalFlag('removeHighContrastHeader')\n ? ''\n : 'awsui-context-content-header';\n"]}
package/lib/internal/template/internal/utils/global-flags.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ export declare const awsuiGlobalFlagsSymbol: unique symbol;
2
+ interface GlobalFlags {
3
+ removeHighContrastHeader?: boolean;
4
+ }
5
+ interface ExtendedWindow extends Window {
6
+ [awsuiGlobalFlagsSymbol]?: GlobalFlags;
7
+ }
8
+ export declare const getTopWindow: () => ExtendedWindow | undefined;
9
+ export declare const getGlobalFlag: (flagName: keyof GlobalFlags) => GlobalFlags[keyof GlobalFlags] | undefined;
10
+ export {};
11
+ //# sourceMappingURL=global-flags.d.ts.map