@cloudscape-design/components 3.0.729 → 3.0.731

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 (118) hide show
  1. package/app-layout/classic.js +1 -1
  2. package/app-layout/classic.js.map +1 -1
  3. package/app-layout/drawer/styles.css.js +13 -13
  4. package/app-layout/drawer/styles.scoped.css +22 -22
  5. package/app-layout/drawer/styles.selectors.js +13 -13
  6. package/app-layout/mobile-toolbar/styles.css.js +8 -8
  7. package/app-layout/mobile-toolbar/styles.scoped.css +10 -10
  8. package/app-layout/mobile-toolbar/styles.selectors.js +8 -8
  9. package/app-layout/resize/styles.css.js +9 -0
  10. package/app-layout/resize/styles.scoped.css +179 -0
  11. package/app-layout/resize/styles.selectors.js +10 -0
  12. package/app-layout/styles.css.js +12 -16
  13. package/app-layout/styles.scoped.css +12 -43
  14. package/app-layout/styles.selectors.js +12 -16
  15. package/app-layout/utils/use-drawers.js +1 -1
  16. package/app-layout/utils/use-drawers.js.map +1 -1
  17. package/app-layout/utils/use-pointer-events.js +1 -1
  18. package/app-layout/utils/use-pointer-events.js.map +1 -1
  19. package/app-layout/visual-refresh-toolbar/compute-layout.d.ts +2 -1
  20. package/app-layout/visual-refresh-toolbar/compute-layout.d.ts.map +1 -1
  21. package/app-layout/visual-refresh-toolbar/compute-layout.js +2 -2
  22. package/app-layout/visual-refresh-toolbar/compute-layout.js.map +1 -1
  23. package/app-layout/visual-refresh-toolbar/drawer/index.d.ts.map +1 -1
  24. package/app-layout/visual-refresh-toolbar/drawer/index.js +4 -4
  25. package/app-layout/visual-refresh-toolbar/drawer/index.js.map +1 -1
  26. package/app-layout/visual-refresh-toolbar/drawer/use-resize.d.ts.map +1 -1
  27. package/app-layout/visual-refresh-toolbar/drawer/use-resize.js +1 -0
  28. package/app-layout/visual-refresh-toolbar/drawer/use-resize.js.map +1 -1
  29. package/app-layout/visual-refresh-toolbar/index.js +3 -3
  30. package/app-layout/visual-refresh-toolbar/index.js.map +1 -1
  31. package/app-layout/visual-refresh-toolbar/navigation/styles.css.js +4 -6
  32. package/app-layout/visual-refresh-toolbar/navigation/styles.scoped.css +6 -29
  33. package/app-layout/visual-refresh-toolbar/navigation/styles.selectors.js +4 -6
  34. package/app-layout/visual-refresh-toolbar/skeleton/index.d.ts.map +1 -1
  35. package/app-layout/visual-refresh-toolbar/skeleton/index.js +4 -3
  36. package/app-layout/visual-refresh-toolbar/skeleton/index.js.map +1 -1
  37. package/app-layout/visual-refresh-toolbar/skeleton/styles.css.js +16 -16
  38. package/app-layout/visual-refresh-toolbar/skeleton/styles.scoped.css +45 -31
  39. package/app-layout/visual-refresh-toolbar/skeleton/styles.selectors.js +16 -16
  40. package/app-layout/visual-refresh-toolbar/toolbar/styles.css.js +13 -13
  41. package/app-layout/visual-refresh-toolbar/toolbar/styles.scoped.css +15 -16
  42. package/app-layout/visual-refresh-toolbar/toolbar/styles.selectors.js +13 -13
  43. package/expandable-section/analytics-metadata/interfaces.d.ts +17 -0
  44. package/expandable-section/analytics-metadata/interfaces.d.ts.map +1 -0
  45. package/expandable-section/analytics-metadata/interfaces.js +4 -0
  46. package/expandable-section/analytics-metadata/interfaces.js.map +1 -0
  47. package/expandable-section/analytics-metadata/styles.css.js +6 -0
  48. package/expandable-section/analytics-metadata/styles.scoped.css +7 -0
  49. package/expandable-section/analytics-metadata/styles.selectors.js +7 -0
  50. package/expandable-section/expandable-section-container.d.ts +2 -1
  51. package/expandable-section/expandable-section-container.d.ts.map +1 -1
  52. package/expandable-section/expandable-section-container.js +13 -3
  53. package/expandable-section/expandable-section-container.js.map +1 -1
  54. package/expandable-section/expandable-section-header.d.ts.map +1 -1
  55. package/expandable-section/expandable-section-header.js +19 -7
  56. package/expandable-section/expandable-section-header.js.map +1 -1
  57. package/expandable-section/index.d.ts.map +1 -1
  58. package/expandable-section/index.js +1 -1
  59. package/expandable-section/index.js.map +1 -1
  60. package/expandable-section/internal.d.ts +2 -1
  61. package/expandable-section/internal.d.ts.map +1 -1
  62. package/expandable-section/internal.js +2 -2
  63. package/expandable-section/internal.js.map +1 -1
  64. package/flashbar/styles.css.js +47 -47
  65. package/flashbar/styles.scoped.css +158 -158
  66. package/flashbar/styles.selectors.js +47 -47
  67. package/internal/base-component/styles.scoped.css +10 -5
  68. package/internal/environment.js +1 -1
  69. package/internal/environment.json +1 -1
  70. package/internal/generated/styles/tokens.js +1 -1
  71. package/internal/generated/theming/index.cjs +15 -15
  72. package/internal/generated/theming/index.js +15 -15
  73. package/internal/manifest.json +1 -1
  74. package/package.json +1 -1
  75. package/property-filter/controller.d.ts +10 -7
  76. package/property-filter/controller.d.ts.map +1 -1
  77. package/property-filter/controller.js +16 -30
  78. package/property-filter/controller.js.map +1 -1
  79. package/property-filter/internal.d.ts.map +1 -1
  80. package/property-filter/internal.js +22 -7
  81. package/property-filter/internal.js.map +1 -1
  82. package/property-filter/property-editor.d.ts +2 -2
  83. package/property-filter/property-editor.d.ts.map +1 -1
  84. package/property-filter/property-editor.js +1 -1
  85. package/property-filter/property-editor.js.map +1 -1
  86. package/property-filter/token.d.ts +7 -8
  87. package/property-filter/token.d.ts.map +1 -1
  88. package/property-filter/token.js +6 -5
  89. package/property-filter/token.js.map +1 -1
  90. package/split-panel/bottom.d.ts +1 -4
  91. package/split-panel/bottom.d.ts.map +1 -1
  92. package/split-panel/bottom.js +5 -7
  93. package/split-panel/bottom.js.map +1 -1
  94. package/split-panel/implementation.d.ts.map +1 -1
  95. package/split-panel/implementation.js +5 -5
  96. package/split-panel/implementation.js.map +1 -1
  97. package/split-panel/side.d.ts.map +1 -1
  98. package/split-panel/side.js +5 -3
  99. package/split-panel/side.js.map +1 -1
  100. package/split-panel/styles.css.js +26 -27
  101. package/split-panel/styles.scoped.css +50 -215
  102. package/split-panel/styles.selectors.js +26 -27
  103. package/tabs/analytics-metadata/interfaces.d.ts +33 -0
  104. package/tabs/analytics-metadata/interfaces.d.ts.map +1 -0
  105. package/tabs/analytics-metadata/interfaces.js +4 -0
  106. package/tabs/analytics-metadata/interfaces.js.map +1 -0
  107. package/tabs/analytics-metadata/styles.css.js +9 -0
  108. package/tabs/analytics-metadata/styles.scoped.css +10 -0
  109. package/tabs/analytics-metadata/styles.selectors.js +10 -0
  110. package/tabs/index.d.ts.map +1 -1
  111. package/tabs/index.js +16 -2
  112. package/tabs/index.js.map +1 -1
  113. package/tabs/tab-header-bar.d.ts.map +1 -1
  114. package/tabs/tab-header-bar.js +36 -9
  115. package/tabs/tab-header-bar.js.map +1 -1
  116. package/wizard/styles.css.js +30 -30
  117. package/wizard/styles.scoped.css +59 -59
  118. package/wizard/styles.selectors.js +30 -30
@@ -1 +1 @@
1
- {"version":3,"file":"use-resize.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/use-resize.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAC;AAExE,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAWlE,MAAM,UAAU,SAAS,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAe;IACxG,MAAM,eAAe,GAAG,CAAC,QAAgB,EAAE,EAAE;QAC3C,MAAM,IAAI,GAAG,eAAe,CAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;QAE3D,IAAI,QAAQ,IAAI,QAAQ,EAAE;YACxB,QAAQ,CAAC,IAAI,CAAC,CAAC;SAChB;IACH,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAqB;QACzC,QAAQ,EAAE,MAAM;QAChB,QAAQ;QACR,SAAS;QACT,QAAQ,EAAE,eAAe;KAC1B,CAAC;IAEF,MAAM,YAAY,GAAG,eAAe,CAAC,QAAQ,EAAE,YAAY,EAAE,QAAQ,CAAC,CAAC;IACvE,MAAM,YAAY,GAAG,CAAC,CAAC,YAAY,GAAG,QAAQ,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ,CAAC,CAAC,GAAG,GAAG,CAAC;IAE/E,MAAM,aAAa,GAAG,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACzD,MAAM,SAAS,GAAG,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;IAEtD,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,YAAY,EAAE,CAAC;AACpD,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { getLimitedValue } from '../../../split-panel/utils/size-utils';\nimport { SizeControlProps } from '../../utils/interfaces';\nimport { useKeyboardEvents } from '../../utils/use-keyboard-events';\nimport { usePointerEvents } from '../../utils/use-pointer-events';\n\ninterface ResizeProps {\n currentWidth: number;\n minWidth: number;\n maxWidth: number;\n panelRef: React.RefObject<HTMLDivElement>;\n handleRef: React.RefObject<HTMLDivElement>;\n onResize: (newWidth: number) => void;\n}\n\nexport function useResize({ currentWidth, minWidth, maxWidth, panelRef, handleRef, onResize }: ResizeProps) {\n const onResizeHandler = (newWidth: number) => {\n const size = getLimitedValue(minWidth, newWidth, maxWidth);\n\n if (maxWidth >= minWidth) {\n onResize(size);\n }\n };\n\n const sizeControlProps: SizeControlProps = {\n position: 'side',\n panelRef,\n handleRef,\n onResize: onResizeHandler,\n };\n\n const clampedWidth = getLimitedValue(minWidth, currentWidth, maxWidth);\n const relativeSize = ((clampedWidth - minWidth) / (maxWidth - minWidth)) * 100;\n\n const onPointerDown = usePointerEvents(sizeControlProps);\n const onKeyDown = useKeyboardEvents(sizeControlProps);\n\n return { onKeyDown, onPointerDown, relativeSize };\n}\n"]}
1
+ {"version":3,"file":"use-resize.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/use-resize.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAC;AAExE,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAWlE,MAAM,UAAU,SAAS,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAe;IACxG,MAAM,eAAe,GAAG,CAAC,QAAgB,EAAE,EAAE;QAC3C,MAAM,IAAI,GAAG,eAAe,CAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;QAE3D,IAAI,QAAQ,IAAI,QAAQ,EAAE;YACxB,QAAQ,CAAC,IAAI,CAAC,CAAC;SAChB;IACH,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAqB;QACzC,QAAQ,EAAE,MAAM;QAChB,QAAQ;QACR,SAAS;QACT,QAAQ,EAAE,eAAe;QACzB,cAAc,EAAE,IAAI;KACrB,CAAC;IAEF,MAAM,YAAY,GAAG,eAAe,CAAC,QAAQ,EAAE,YAAY,EAAE,QAAQ,CAAC,CAAC;IACvE,MAAM,YAAY,GAAG,CAAC,CAAC,YAAY,GAAG,QAAQ,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ,CAAC,CAAC,GAAG,GAAG,CAAC;IAE/E,MAAM,aAAa,GAAG,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACzD,MAAM,SAAS,GAAG,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;IAEtD,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,YAAY,EAAE,CAAC;AACpD,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { getLimitedValue } from '../../../split-panel/utils/size-utils';\nimport { SizeControlProps } from '../../utils/interfaces';\nimport { useKeyboardEvents } from '../../utils/use-keyboard-events';\nimport { usePointerEvents } from '../../utils/use-pointer-events';\n\ninterface ResizeProps {\n currentWidth: number;\n minWidth: number;\n maxWidth: number;\n panelRef: React.RefObject<HTMLDivElement>;\n handleRef: React.RefObject<HTMLDivElement>;\n onResize: (newWidth: number) => void;\n}\n\nexport function useResize({ currentWidth, minWidth, maxWidth, panelRef, handleRef, onResize }: ResizeProps) {\n const onResizeHandler = (newWidth: number) => {\n const size = getLimitedValue(minWidth, newWidth, maxWidth);\n\n if (maxWidth >= minWidth) {\n onResize(size);\n }\n };\n\n const sizeControlProps: SizeControlProps = {\n position: 'side',\n panelRef,\n handleRef,\n onResize: onResizeHandler,\n hasTransitions: true,\n };\n\n const clampedWidth = getLimitedValue(minWidth, currentWidth, maxWidth);\n const relativeSize = ((clampedWidth - minWidth) / (maxWidth - minWidth)) * 100;\n\n const onPointerDown = usePointerEvents(sizeControlProps);\n const onKeyDown = useKeyboardEvents(sizeControlProps);\n\n return { onKeyDown, onPointerDown, relativeSize };\n}\n"]}
@@ -88,7 +88,7 @@ const AppLayoutVisualRefreshToolbar = React.forwardRef((_a, forwardRef) => {
88
88
  }));
89
89
  const resolvedNavigation = navigationHide ? null : navigation !== null && navigation !== void 0 ? navigation : React.createElement(React.Fragment, null);
90
90
  const { maxDrawerSize, maxSplitPanelSize, splitPanelForcedPosition, splitPanelPosition } = computeHorizontalLayout({
91
- activeDrawerSize,
91
+ activeDrawerSize: activeDrawer ? activeDrawerSize : 0,
92
92
  splitPanelSize,
93
93
  minContentWidth,
94
94
  navigationOpen: !!resolvedNavigation && navigationOpen,
@@ -96,6 +96,7 @@ const AppLayoutVisualRefreshToolbar = React.forwardRef((_a, forwardRef) => {
96
96
  placement,
97
97
  splitPanelOpen,
98
98
  splitPanelPosition: splitPanelPreferences === null || splitPanelPreferences === void 0 ? void 0 : splitPanelPreferences.position,
99
+ isMobile,
99
100
  });
100
101
  const { registered, toolbarProps } = useMultiAppLayout({
101
102
  forceDeduplicationType,
@@ -189,8 +190,7 @@ const AppLayoutVisualRefreshToolbar = React.forwardRef((_a, forwardRef) => {
189
190
  paddingBlockEnd: splitPanelOpen && splitPanelPosition === 'bottom' ? splitPanelReportedSize : '',
190
191
  }, toolbar: hasToolbar && React.createElement(AppLayoutToolbar, { appLayoutInternals: appLayoutInternals, toolbarProps: toolbarProps }), notifications: notifications && (React.createElement(AppLayoutNotifications, { appLayoutInternals: appLayoutInternals }, notifications)), contentHeader: contentHeader,
191
192
  // delay rendering the content until registration of this instance is complete
192
- content: registered ? content : null, navigation: resolvedNavigation && React.createElement(AppLayoutNavigation, { appLayoutInternals: appLayoutInternals }), navigationOpen: navigationOpen, navigationWidth: navigationWidth, tools: activeDrawer && React.createElement(AppLayoutDrawer, { appLayoutInternals: appLayoutInternals }), toolsOpen: !!activeDrawer, toolsWidth: activeDrawerSize, sideSplitPanel: splitPanelPosition === 'side' &&
193
- splitPanel && (React.createElement(AppLayoutSplitPanelSide, { appLayoutInternals: appLayoutInternals, splitPanelInternals: splitPanelInternals }, splitPanel)), bottomSplitPanel: splitPanelPosition === 'bottom' && (React.createElement(AppLayoutSplitPanelBottom, { appLayoutInternals: appLayoutInternals, splitPanelInternals: splitPanelInternals }, splitPanel)), splitPanelOpen: splitPanelOpen, placement: placement, contentType: contentType, maxContentWidth: maxContentWidth, disableContentPaddings: disableContentPaddings })));
193
+ content: registered ? content : null, navigation: resolvedNavigation && React.createElement(AppLayoutNavigation, { appLayoutInternals: appLayoutInternals }), navigationOpen: navigationOpen, navigationWidth: navigationWidth, tools: activeDrawer && React.createElement(AppLayoutDrawer, { appLayoutInternals: appLayoutInternals }), toolsOpen: !!activeDrawer, toolsWidth: activeDrawerSize, sideSplitPanel: splitPanelPosition === 'side' && (React.createElement(AppLayoutSplitPanelSide, { appLayoutInternals: appLayoutInternals, splitPanelInternals: splitPanelInternals }, splitPanel)), bottomSplitPanel: splitPanelPosition === 'bottom' && (React.createElement(AppLayoutSplitPanelBottom, { appLayoutInternals: appLayoutInternals, splitPanelInternals: splitPanelInternals }, splitPanel)), splitPanelOpen: splitPanelOpen, placement: placement, contentType: contentType, maxContentWidth: maxContentWidth, disableContentPaddings: disableContentPaddings })));
194
194
  });
195
195
  export default AppLayoutVisualRefreshToolbar;
196
196
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh-toolbar/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, { useImperativeHandle, useState } from 'react';\n\nimport ScreenreaderOnly from '../../internal/components/screenreader-only';\nimport { SplitPanelSideToggleProps } from '../../internal/context/split-panel-context';\nimport { fireNonCancelableEvent } from '../../internal/events';\nimport { useControllable } from '../../internal/hooks/use-controllable';\nimport { useMobile } from '../../internal/hooks/use-mobile';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { useGetGlobalBreadcrumbs } from '../../internal/plugins/helpers/use-global-breadcrumbs';\nimport globalVars from '../../internal/styles/global-vars';\nimport { getSplitPanelDefaultSize } from '../../split-panel/utils/size-utils';\nimport { AppLayoutProps, AppLayoutPropsWithDefaults } from '../interfaces';\nimport { SplitPanelProviderProps } from '../split-panel';\nimport { useDrawers } from '../utils/use-drawers';\nimport { useFocusControl } from '../utils/use-focus-control';\nimport { useSplitPanelFocusControl } from '../utils/use-split-panel-focus-control';\nimport { computeHorizontalLayout, computeVerticalLayout } from './compute-layout';\nimport { AppLayoutInternals } from './interfaces';\nimport {\n AppLayoutDrawer,\n AppLayoutNavigation,\n AppLayoutNotifications,\n AppLayoutSplitPanelBottom,\n AppLayoutSplitPanelSide,\n AppLayoutToolbar,\n} from './internal';\nimport { useMultiAppLayout } from './multi-layout';\nimport { SkeletonLayout } from './skeleton';\n\nconst AppLayoutVisualRefreshToolbar = React.forwardRef<AppLayoutProps.Ref, AppLayoutPropsWithDefaults>(\n (\n {\n ariaLabels,\n contentHeader,\n content,\n navigationOpen,\n navigationWidth,\n navigation,\n navigationHide,\n onNavigationChange,\n tools,\n toolsOpen: controlledToolsOpen,\n onToolsChange,\n toolsHide,\n toolsWidth,\n contentType,\n headerVariant,\n breadcrumbs,\n notifications,\n stickyNotifications,\n splitPanelPreferences: controlledSplitPanelPreferences,\n splitPanelOpen: controlledSplitPanelOpen,\n splitPanel,\n splitPanelSize: controlledSplitPanelSize,\n onSplitPanelToggle,\n onSplitPanelResize,\n onSplitPanelPreferencesChange,\n disableContentPaddings,\n minContentWidth,\n maxContentWidth,\n placement,\n ...rest\n },\n forwardRef\n ) => {\n const isMobile = useMobile();\n const { __embeddedViewMode: embeddedViewMode, __forceDeduplicationType: forceDeduplicationType } = rest as any;\n const splitPanelControlId = useUniqueId('split-panel');\n const [toolbarState, setToolbarState] = useState<'show' | 'hide'>('show');\n const [toolbarHeight, setToolbarHeight] = useState(0);\n const [notificationsHeight, setNotificationsHeight] = useState(0);\n\n const onNavigationToggle = (open: boolean) => {\n fireNonCancelableEvent(onNavigationChange, { open });\n };\n\n const [toolsOpen = false, setToolsOpen] = useControllable(controlledToolsOpen, onToolsChange, false, {\n componentName: 'AppLayout',\n controlledProp: 'toolsOpen',\n changeHandler: 'onToolsChange',\n });\n const onToolsToggle = (open: boolean) => {\n setToolsOpen(open);\n drawersFocusControl.setFocus();\n fireNonCancelableEvent(onToolsChange, { open });\n };\n\n const {\n drawers,\n activeDrawer,\n minDrawerSize,\n activeDrawerSize,\n ariaLabelsWithDrawers,\n onActiveDrawerChange,\n onActiveDrawerResize,\n } = useDrawers(rest, ariaLabels, {\n ariaLabels,\n toolsHide,\n toolsOpen,\n tools,\n toolsWidth,\n onToolsToggle,\n });\n\n const [splitPanelOpen = false, setSplitPanelOpen] = useControllable(\n controlledSplitPanelOpen,\n onSplitPanelToggle,\n false,\n {\n componentName: 'AppLayout',\n controlledProp: 'splitPanelOpen',\n changeHandler: 'onSplitPanelToggle',\n }\n );\n\n const onSplitPanelToggleHandler = () => {\n setSplitPanelOpen(!splitPanelOpen);\n fireNonCancelableEvent(onSplitPanelToggle, { open: !splitPanelOpen });\n };\n\n const [splitPanelPreferences, setSplitPanelPreferences] = useControllable(\n controlledSplitPanelPreferences,\n onSplitPanelPreferencesChange,\n undefined,\n {\n componentName: 'AppLayout',\n controlledProp: 'splitPanelPreferences',\n changeHandler: 'onSplitPanelPreferencesChange',\n }\n );\n\n const onSplitPanelPreferencesChangeHandler = (detail: AppLayoutProps.SplitPanelPreferences) => {\n setSplitPanelPreferences(detail);\n splitPanelFocusControl.setLastInteraction({ type: 'position' });\n fireNonCancelableEvent(onSplitPanelPreferencesChange, detail);\n };\n\n const [splitPanelSize = 0, setSplitPanelSize] = useControllable(\n controlledSplitPanelSize,\n onSplitPanelResize,\n getSplitPanelDefaultSize(splitPanelPreferences?.position ?? 'bottom'),\n { componentName: 'AppLayout', controlledProp: 'splitPanelSize', changeHandler: 'onSplitPanelResize' }\n );\n\n const [splitPanelReportedSize, setSplitPanelReportedSize] = useState(0);\n\n const onSplitPanelResizeHandler = (size: number) => {\n setSplitPanelSize(size);\n fireNonCancelableEvent(onSplitPanelResize, { size });\n };\n\n const [splitPanelToggleConfig, setSplitPanelToggleConfig] = useState<SplitPanelSideToggleProps>({\n ariaLabel: undefined,\n displayed: false,\n });\n\n const drawersFocusControl = useFocusControl(!!activeDrawer?.id);\n const navigationFocusControl = useFocusControl(navigationOpen);\n const splitPanelFocusControl = useSplitPanelFocusControl([splitPanelPreferences, splitPanelOpen]);\n\n useImperativeHandle(forwardRef, () => ({\n closeNavigationIfNecessary: () => isMobile && onNavigationToggle(false),\n openTools: () => onToolsToggle(true),\n focusToolsClose: () => drawersFocusControl.setFocus(true),\n focusActiveDrawer: () => drawersFocusControl.setFocus(true),\n focusSplitPanel: () => splitPanelFocusControl.refs.slider.current?.focus(),\n }));\n\n const resolvedNavigation = navigationHide ? null : navigation ?? <></>;\n const { maxDrawerSize, maxSplitPanelSize, splitPanelForcedPosition, splitPanelPosition } = computeHorizontalLayout({\n activeDrawerSize,\n splitPanelSize,\n minContentWidth,\n navigationOpen: !!resolvedNavigation && navigationOpen,\n navigationWidth,\n placement,\n splitPanelOpen,\n splitPanelPosition: splitPanelPreferences?.position,\n });\n\n const { registered, toolbarProps } = useMultiAppLayout({\n forceDeduplicationType,\n ariaLabels: ariaLabelsWithDrawers,\n navigation: resolvedNavigation,\n navigationOpen,\n onNavigationToggle,\n navigationFocusRef: navigationFocusControl.refs.toggle,\n breadcrumbs,\n activeDrawerId: activeDrawer?.id ?? null,\n // only pass it down if there are non-empty drawers or tools\n drawers: drawers?.length || !toolsHide ? drawers : undefined,\n onActiveDrawerChange,\n drawersFocusRef: drawersFocusControl.refs.toggle,\n splitPanel,\n splitPanelToggleProps: {\n ...splitPanelToggleConfig,\n active: splitPanelOpen,\n controlId: splitPanelControlId,\n position: splitPanelPosition,\n },\n splitPanelFocusRef: splitPanelFocusControl.refs.toggle,\n onSplitPanelToggle: onSplitPanelToggleHandler,\n });\n\n const hasToolbar = !embeddedViewMode && !!toolbarProps;\n const discoveredBreadcrumbs = useGetGlobalBreadcrumbs(hasToolbar);\n\n const verticalOffsets = computeVerticalLayout({\n topOffset: placement.insetBlockStart,\n hasVisibleToolbar: hasToolbar && toolbarState !== 'hide',\n notificationsHeight: notificationsHeight ?? 0,\n toolbarHeight: toolbarHeight ?? 0,\n stickyNotifications: !!stickyNotifications,\n });\n\n const appLayoutInternals: AppLayoutInternals = {\n ariaLabels: ariaLabelsWithDrawers,\n headerVariant,\n isMobile,\n breadcrumbs,\n discoveredBreadcrumbs,\n stickyNotifications,\n navigationOpen,\n navigation: resolvedNavigation,\n navigationFocusControl,\n activeDrawer,\n activeDrawerSize,\n minDrawerSize,\n maxDrawerSize,\n drawers: drawers!,\n drawersFocusControl,\n splitPanelPosition,\n splitPanelToggleConfig,\n splitPanelOpen,\n splitPanelControlId,\n splitPanelFocusControl,\n placement,\n toolbarState,\n setToolbarState,\n verticalOffsets,\n setToolbarHeight,\n setNotificationsHeight,\n onSplitPanelToggle: onSplitPanelToggleHandler,\n onNavigationToggle,\n onActiveDrawerChange,\n onActiveDrawerResize,\n };\n\n const splitPanelInternals: SplitPanelProviderProps = {\n bottomOffset: 0,\n getMaxHeight: () => {\n const availableHeight =\n document.documentElement.clientHeight - placement.insetBlockStart - placement.insetBlockEnd;\n // If the page is likely zoomed in at 200%, allow the split panel to fill the content area.\n return availableHeight < 400 ? availableHeight - 40 : availableHeight - 250;\n },\n maxWidth: maxSplitPanelSize,\n isForcedPosition: splitPanelForcedPosition,\n isOpen: splitPanelOpen,\n leftOffset: 0,\n onPreferencesChange: onSplitPanelPreferencesChangeHandler,\n onResize: onSplitPanelResizeHandler,\n onToggle: onSplitPanelToggleHandler,\n position: splitPanelPosition,\n reportSize: size => setSplitPanelReportedSize(size),\n reportHeaderHeight: () => {\n /*unused in this design*/\n },\n rightOffset: 0,\n size: splitPanelSize,\n topOffset: 0,\n setSplitPanelToggle: setSplitPanelToggleConfig,\n refs: splitPanelFocusControl.refs,\n };\n\n return (\n <>\n {/* Rendering a hidden copy of breadcrumbs to trigger their deduplication */}\n {!hasToolbar && breadcrumbs ? <ScreenreaderOnly>{breadcrumbs}</ScreenreaderOnly> : null}\n <SkeletonLayout\n style={{\n [globalVars.stickyVerticalTopOffset]: `${verticalOffsets.header}px`,\n [globalVars.stickyVerticalBottomOffset]: `${placement.insetBlockEnd}px`,\n paddingBlockEnd: splitPanelOpen && splitPanelPosition === 'bottom' ? splitPanelReportedSize : '',\n }}\n toolbar={\n hasToolbar && <AppLayoutToolbar appLayoutInternals={appLayoutInternals} toolbarProps={toolbarProps} />\n }\n notifications={\n notifications && (\n <AppLayoutNotifications appLayoutInternals={appLayoutInternals}>{notifications}</AppLayoutNotifications>\n )\n }\n contentHeader={contentHeader}\n // delay rendering the content until registration of this instance is complete\n content={registered ? content : null}\n navigation={resolvedNavigation && <AppLayoutNavigation appLayoutInternals={appLayoutInternals} />}\n navigationOpen={navigationOpen}\n navigationWidth={navigationWidth}\n tools={activeDrawer && <AppLayoutDrawer appLayoutInternals={appLayoutInternals} />}\n toolsOpen={!!activeDrawer}\n toolsWidth={activeDrawerSize}\n sideSplitPanel={\n splitPanelPosition === 'side' &&\n splitPanel && (\n <AppLayoutSplitPanelSide\n appLayoutInternals={appLayoutInternals}\n splitPanelInternals={splitPanelInternals}\n >\n {splitPanel}\n </AppLayoutSplitPanelSide>\n )\n }\n bottomSplitPanel={\n splitPanelPosition === 'bottom' && (\n <AppLayoutSplitPanelBottom\n appLayoutInternals={appLayoutInternals}\n splitPanelInternals={splitPanelInternals}\n >\n {splitPanel}\n </AppLayoutSplitPanelBottom>\n )\n }\n splitPanelOpen={splitPanelOpen}\n placement={placement}\n contentType={contentType}\n maxContentWidth={maxContentWidth}\n disableContentPaddings={disableContentPaddings}\n />\n </>\n );\n }\n);\n\nexport default AppLayoutVisualRefreshToolbar;\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh-toolbar/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,mBAAmB,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,gBAAgB,MAAM,6CAA6C,CAAC;AAE3E,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACxE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AACjE,OAAO,EAAE,uBAAuB,EAAE,MAAM,uDAAuD,CAAC;AAChG,OAAO,UAAU,MAAM,mCAAmC,CAAC;AAC3D,OAAO,EAAE,wBAAwB,EAAE,MAAM,oCAAoC,CAAC;AAG9E,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7D,OAAO,EAAE,yBAAyB,EAAE,MAAM,wCAAwC,CAAC;AACnF,OAAO,EAAE,uBAAuB,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAElF,OAAO,EACL,eAAe,EACf,mBAAmB,EACnB,sBAAsB,EACtB,yBAAyB,EACzB,uBAAuB,EACvB,gBAAgB,GACjB,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAE5C,MAAM,6BAA6B,GAAG,KAAK,CAAC,UAAU,CACpD,CACE,EA+BC,EACD,UAAU,EACV,EAAE;;QAjCF,EACE,UAAU,EACV,aAAa,EACb,OAAO,EACP,cAAc,EACd,eAAe,EACf,UAAU,EACV,cAAc,EACd,kBAAkB,EAClB,KAAK,EACL,SAAS,EAAE,mBAAmB,EAC9B,aAAa,EACb,SAAS,EACT,UAAU,EACV,WAAW,EACX,aAAa,EACb,WAAW,EACX,aAAa,EACb,mBAAmB,EACnB,qBAAqB,EAAE,+BAA+B,EACtD,cAAc,EAAE,wBAAwB,EACxC,UAAU,EACV,cAAc,EAAE,wBAAwB,EACxC,kBAAkB,EAClB,kBAAkB,EAClB,6BAA6B,EAC7B,sBAAsB,EACtB,eAAe,EACf,eAAe,EACf,SAAS,OAEV,EADI,IAAI,cA9BT,mgBA+BC,CADQ;IAIT,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,MAAM,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,wBAAwB,EAAE,sBAAsB,EAAE,GAAG,IAAW,CAAC;IAC/G,MAAM,mBAAmB,GAAG,WAAW,CAAC,aAAa,CAAC,CAAC;IACvD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAkB,MAAM,CAAC,CAAC;IAC1E,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IACtD,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAElE,MAAM,kBAAkB,GAAG,CAAC,IAAa,EAAE,EAAE;QAC3C,sBAAsB,CAAC,kBAAkB,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC;IACvD,CAAC,CAAC;IAEF,MAAM,CAAC,SAAS,GAAG,KAAK,EAAE,YAAY,CAAC,GAAG,eAAe,CAAC,mBAAmB,EAAE,aAAa,EAAE,KAAK,EAAE;QACnG,aAAa,EAAE,WAAW;QAC1B,cAAc,EAAE,WAAW;QAC3B,aAAa,EAAE,eAAe;KAC/B,CAAC,CAAC;IACH,MAAM,aAAa,GAAG,CAAC,IAAa,EAAE,EAAE;QACtC,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,mBAAmB,CAAC,QAAQ,EAAE,CAAC;QAC/B,sBAAsB,CAAC,aAAa,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC;IAClD,CAAC,CAAC;IAEF,MAAM,EACJ,OAAO,EACP,YAAY,EACZ,aAAa,EACb,gBAAgB,EAChB,qBAAqB,EACrB,oBAAoB,EACpB,oBAAoB,GACrB,GAAG,UAAU,CAAC,IAAI,EAAE,UAAU,EAAE;QAC/B,UAAU;QACV,SAAS;QACT,SAAS;QACT,KAAK;QACL,UAAU;QACV,aAAa;KACd,CAAC,CAAC;IAEH,MAAM,CAAC,cAAc,GAAG,KAAK,EAAE,iBAAiB,CAAC,GAAG,eAAe,CACjE,wBAAwB,EACxB,kBAAkB,EAClB,KAAK,EACL;QACE,aAAa,EAAE,WAAW;QAC1B,cAAc,EAAE,gBAAgB;QAChC,aAAa,EAAE,oBAAoB;KACpC,CACF,CAAC;IAEF,MAAM,yBAAyB,GAAG,GAAG,EAAE;QACrC,iBAAiB,CAAC,CAAC,cAAc,CAAC,CAAC;QACnC,sBAAsB,CAAC,kBAAkB,EAAE,EAAE,IAAI,EAAE,CAAC,cAAc,EAAE,CAAC,CAAC;IACxE,CAAC,CAAC;IAEF,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,eAAe,CACvE,+BAA+B,EAC/B,6BAA6B,EAC7B,SAAS,EACT;QACE,aAAa,EAAE,WAAW;QAC1B,cAAc,EAAE,uBAAuB;QACvC,aAAa,EAAE,+BAA+B;KAC/C,CACF,CAAC;IAEF,MAAM,oCAAoC,GAAG,CAAC,MAA4C,EAAE,EAAE;QAC5F,wBAAwB,CAAC,MAAM,CAAC,CAAC;QACjC,sBAAsB,CAAC,kBAAkB,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC;QAChE,sBAAsB,CAAC,6BAA6B,EAAE,MAAM,CAAC,CAAC;IAChE,CAAC,CAAC;IAEF,MAAM,CAAC,cAAc,GAAG,CAAC,EAAE,iBAAiB,CAAC,GAAG,eAAe,CAC7D,wBAAwB,EACxB,kBAAkB,EAClB,wBAAwB,CAAC,MAAA,qBAAqB,aAArB,qBAAqB,uBAArB,qBAAqB,CAAE,QAAQ,mCAAI,QAAQ,CAAC,EACrE,EAAE,aAAa,EAAE,WAAW,EAAE,cAAc,EAAE,gBAAgB,EAAE,aAAa,EAAE,oBAAoB,EAAE,CACtG,CAAC;IAEF,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAExE,MAAM,yBAAyB,GAAG,CAAC,IAAY,EAAE,EAAE;QACjD,iBAAiB,CAAC,IAAI,CAAC,CAAC;QACxB,sBAAsB,CAAC,kBAAkB,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC;IACvD,CAAC,CAAC;IAEF,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,QAAQ,CAA4B;QAC9F,SAAS,EAAE,SAAS;QACpB,SAAS,EAAE,KAAK;KACjB,CAAC,CAAC;IAEH,MAAM,mBAAmB,GAAG,eAAe,CAAC,CAAC,CAAC,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,EAAE,CAAA,CAAC,CAAC;IAChE,MAAM,sBAAsB,GAAG,eAAe,CAAC,cAAc,CAAC,CAAC;IAC/D,MAAM,sBAAsB,GAAG,yBAAyB,CAAC,CAAC,qBAAqB,EAAE,cAAc,CAAC,CAAC,CAAC;IAElG,mBAAmB,CAAC,UAAU,EAAE,GAAG,EAAE,CAAC,CAAC;QACrC,0BAA0B,EAAE,GAAG,EAAE,CAAC,QAAQ,IAAI,kBAAkB,CAAC,KAAK,CAAC;QACvE,SAAS,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,IAAI,CAAC;QACpC,eAAe,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,QAAQ,CAAC,IAAI,CAAC;QACzD,iBAAiB,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,QAAQ,CAAC,IAAI,CAAC;QAC3D,eAAe,EAAE,GAAG,EAAE,WAAC,OAAA,MAAA,sBAAsB,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAA,EAAA;KAC3E,CAAC,CAAC,CAAC;IAEJ,MAAM,kBAAkB,GAAG,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,UAAU,aAAV,UAAU,cAAV,UAAU,GAAI,yCAAK,CAAC;IACvE,MAAM,EAAE,aAAa,EAAE,iBAAiB,EAAE,wBAAwB,EAAE,kBAAkB,EAAE,GAAG,uBAAuB,CAAC;QACjH,gBAAgB,EAAE,YAAY,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC;QACrD,cAAc;QACd,eAAe;QACf,cAAc,EAAE,CAAC,CAAC,kBAAkB,IAAI,cAAc;QACtD,eAAe;QACf,SAAS;QACT,cAAc;QACd,kBAAkB,EAAE,qBAAqB,aAArB,qBAAqB,uBAArB,qBAAqB,CAAE,QAAQ;QACnD,QAAQ;KACT,CAAC,CAAC;IAEH,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,GAAG,iBAAiB,CAAC;QACrD,sBAAsB;QACtB,UAAU,EAAE,qBAAqB;QACjC,UAAU,EAAE,kBAAkB;QAC9B,cAAc;QACd,kBAAkB;QAClB,kBAAkB,EAAE,sBAAsB,CAAC,IAAI,CAAC,MAAM;QACtD,WAAW;QACX,cAAc,EAAE,MAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,EAAE,mCAAI,IAAI;QACxC,4DAA4D;QAC5D,OAAO,EAAE,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,MAAM,KAAI,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS;QAC5D,oBAAoB;QACpB,eAAe,EAAE,mBAAmB,CAAC,IAAI,CAAC,MAAM;QAChD,UAAU;QACV,qBAAqB,kCAChB,sBAAsB,KACzB,MAAM,EAAE,cAAc,EACtB,SAAS,EAAE,mBAAmB,EAC9B,QAAQ,EAAE,kBAAkB,GAC7B;QACD,kBAAkB,EAAE,sBAAsB,CAAC,IAAI,CAAC,MAAM;QACtD,kBAAkB,EAAE,yBAAyB;KAC9C,CAAC,CAAC;IAEH,MAAM,UAAU,GAAG,CAAC,gBAAgB,IAAI,CAAC,CAAC,YAAY,CAAC;IACvD,MAAM,qBAAqB,GAAG,uBAAuB,CAAC,UAAU,CAAC,CAAC;IAElE,MAAM,eAAe,GAAG,qBAAqB,CAAC;QAC5C,SAAS,EAAE,SAAS,CAAC,eAAe;QACpC,iBAAiB,EAAE,UAAU,IAAI,YAAY,KAAK,MAAM;QACxD,mBAAmB,EAAE,mBAAmB,aAAnB,mBAAmB,cAAnB,mBAAmB,GAAI,CAAC;QAC7C,aAAa,EAAE,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,CAAC;QACjC,mBAAmB,EAAE,CAAC,CAAC,mBAAmB;KAC3C,CAAC,CAAC;IAEH,MAAM,kBAAkB,GAAuB;QAC7C,UAAU,EAAE,qBAAqB;QACjC,aAAa;QACb,QAAQ;QACR,WAAW;QACX,qBAAqB;QACrB,mBAAmB;QACnB,cAAc;QACd,UAAU,EAAE,kBAAkB;QAC9B,sBAAsB;QACtB,YAAY;QACZ,gBAAgB;QAChB,aAAa;QACb,aAAa;QACb,OAAO,EAAE,OAAQ;QACjB,mBAAmB;QACnB,kBAAkB;QAClB,sBAAsB;QACtB,cAAc;QACd,mBAAmB;QACnB,sBAAsB;QACtB,SAAS;QACT,YAAY;QACZ,eAAe;QACf,eAAe;QACf,gBAAgB;QAChB,sBAAsB;QACtB,kBAAkB,EAAE,yBAAyB;QAC7C,kBAAkB;QAClB,oBAAoB;QACpB,oBAAoB;KACrB,CAAC;IAEF,MAAM,mBAAmB,GAA4B;QACnD,YAAY,EAAE,CAAC;QACf,YAAY,EAAE,GAAG,EAAE;YACjB,MAAM,eAAe,GACnB,QAAQ,CAAC,eAAe,CAAC,YAAY,GAAG,SAAS,CAAC,eAAe,GAAG,SAAS,CAAC,aAAa,CAAC;YAC9F,2FAA2F;YAC3F,OAAO,eAAe,GAAG,GAAG,CAAC,CAAC,CAAC,eAAe,GAAG,EAAE,CAAC,CAAC,CAAC,eAAe,GAAG,GAAG,CAAC;QAC9E,CAAC;QACD,QAAQ,EAAE,iBAAiB;QAC3B,gBAAgB,EAAE,wBAAwB;QAC1C,MAAM,EAAE,cAAc;QACtB,UAAU,EAAE,CAAC;QACb,mBAAmB,EAAE,oCAAoC;QACzD,QAAQ,EAAE,yBAAyB;QACnC,QAAQ,EAAE,yBAAyB;QACnC,QAAQ,EAAE,kBAAkB;QAC5B,UAAU,EAAE,IAAI,CAAC,EAAE,CAAC,yBAAyB,CAAC,IAAI,CAAC;QACnD,kBAAkB,EAAE,GAAG,EAAE;YACvB,yBAAyB;QAC3B,CAAC;QACD,WAAW,EAAE,CAAC;QACd,IAAI,EAAE,cAAc;QACpB,SAAS,EAAE,CAAC;QACZ,mBAAmB,EAAE,yBAAyB;QAC9C,IAAI,EAAE,sBAAsB,CAAC,IAAI;KAClC,CAAC;IAEF,OAAO,CACL;QAEG,CAAC,UAAU,IAAI,WAAW,CAAC,CAAC,CAAC,oBAAC,gBAAgB,QAAE,WAAW,CAAoB,CAAC,CAAC,CAAC,IAAI;QACvF,oBAAC,cAAc,IACb,KAAK,EAAE;gBACL,CAAC,UAAU,CAAC,uBAAuB,CAAC,EAAE,GAAG,eAAe,CAAC,MAAM,IAAI;gBACnE,CAAC,UAAU,CAAC,0BAA0B,CAAC,EAAE,GAAG,SAAS,CAAC,aAAa,IAAI;gBACvE,eAAe,EAAE,cAAc,IAAI,kBAAkB,KAAK,QAAQ,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAAE;aACjG,EACD,OAAO,EACL,UAAU,IAAI,oBAAC,gBAAgB,IAAC,kBAAkB,EAAE,kBAAkB,EAAE,YAAY,EAAE,YAAY,GAAI,EAExG,aAAa,EACX,aAAa,IAAI,CACf,oBAAC,sBAAsB,IAAC,kBAAkB,EAAE,kBAAkB,IAAG,aAAa,CAA0B,CACzG,EAEH,aAAa,EAAE,aAAa;YAC5B,8EAA8E;YAC9E,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,EACpC,UAAU,EAAE,kBAAkB,IAAI,oBAAC,mBAAmB,IAAC,kBAAkB,EAAE,kBAAkB,GAAI,EACjG,cAAc,EAAE,cAAc,EAC9B,eAAe,EAAE,eAAe,EAChC,KAAK,EAAE,YAAY,IAAI,oBAAC,eAAe,IAAC,kBAAkB,EAAE,kBAAkB,GAAI,EAClF,SAAS,EAAE,CAAC,CAAC,YAAY,EACzB,UAAU,EAAE,gBAAgB,EAC5B,cAAc,EACZ,kBAAkB,KAAK,MAAM,IAAI,CAC/B,oBAAC,uBAAuB,IACtB,kBAAkB,EAAE,kBAAkB,EACtC,mBAAmB,EAAE,mBAAmB,IAEvC,UAAU,CACa,CAC3B,EAEH,gBAAgB,EACd,kBAAkB,KAAK,QAAQ,IAAI,CACjC,oBAAC,yBAAyB,IACxB,kBAAkB,EAAE,kBAAkB,EACtC,mBAAmB,EAAE,mBAAmB,IAEvC,UAAU,CACe,CAC7B,EAEH,cAAc,EAAE,cAAc,EAC9B,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW,EACxB,eAAe,EAAE,eAAe,EAChC,sBAAsB,EAAE,sBAAsB,GAC9C,CACD,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,6BAA6B,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useImperativeHandle, useState } from 'react';\n\nimport ScreenreaderOnly from '../../internal/components/screenreader-only';\nimport { SplitPanelSideToggleProps } from '../../internal/context/split-panel-context';\nimport { fireNonCancelableEvent } from '../../internal/events';\nimport { useControllable } from '../../internal/hooks/use-controllable';\nimport { useMobile } from '../../internal/hooks/use-mobile';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { useGetGlobalBreadcrumbs } from '../../internal/plugins/helpers/use-global-breadcrumbs';\nimport globalVars from '../../internal/styles/global-vars';\nimport { getSplitPanelDefaultSize } from '../../split-panel/utils/size-utils';\nimport { AppLayoutProps, AppLayoutPropsWithDefaults } from '../interfaces';\nimport { SplitPanelProviderProps } from '../split-panel';\nimport { useDrawers } from '../utils/use-drawers';\nimport { useFocusControl } from '../utils/use-focus-control';\nimport { useSplitPanelFocusControl } from '../utils/use-split-panel-focus-control';\nimport { computeHorizontalLayout, computeVerticalLayout } from './compute-layout';\nimport { AppLayoutInternals } from './interfaces';\nimport {\n AppLayoutDrawer,\n AppLayoutNavigation,\n AppLayoutNotifications,\n AppLayoutSplitPanelBottom,\n AppLayoutSplitPanelSide,\n AppLayoutToolbar,\n} from './internal';\nimport { useMultiAppLayout } from './multi-layout';\nimport { SkeletonLayout } from './skeleton';\n\nconst AppLayoutVisualRefreshToolbar = React.forwardRef<AppLayoutProps.Ref, AppLayoutPropsWithDefaults>(\n (\n {\n ariaLabels,\n contentHeader,\n content,\n navigationOpen,\n navigationWidth,\n navigation,\n navigationHide,\n onNavigationChange,\n tools,\n toolsOpen: controlledToolsOpen,\n onToolsChange,\n toolsHide,\n toolsWidth,\n contentType,\n headerVariant,\n breadcrumbs,\n notifications,\n stickyNotifications,\n splitPanelPreferences: controlledSplitPanelPreferences,\n splitPanelOpen: controlledSplitPanelOpen,\n splitPanel,\n splitPanelSize: controlledSplitPanelSize,\n onSplitPanelToggle,\n onSplitPanelResize,\n onSplitPanelPreferencesChange,\n disableContentPaddings,\n minContentWidth,\n maxContentWidth,\n placement,\n ...rest\n },\n forwardRef\n ) => {\n const isMobile = useMobile();\n const { __embeddedViewMode: embeddedViewMode, __forceDeduplicationType: forceDeduplicationType } = rest as any;\n const splitPanelControlId = useUniqueId('split-panel');\n const [toolbarState, setToolbarState] = useState<'show' | 'hide'>('show');\n const [toolbarHeight, setToolbarHeight] = useState(0);\n const [notificationsHeight, setNotificationsHeight] = useState(0);\n\n const onNavigationToggle = (open: boolean) => {\n fireNonCancelableEvent(onNavigationChange, { open });\n };\n\n const [toolsOpen = false, setToolsOpen] = useControllable(controlledToolsOpen, onToolsChange, false, {\n componentName: 'AppLayout',\n controlledProp: 'toolsOpen',\n changeHandler: 'onToolsChange',\n });\n const onToolsToggle = (open: boolean) => {\n setToolsOpen(open);\n drawersFocusControl.setFocus();\n fireNonCancelableEvent(onToolsChange, { open });\n };\n\n const {\n drawers,\n activeDrawer,\n minDrawerSize,\n activeDrawerSize,\n ariaLabelsWithDrawers,\n onActiveDrawerChange,\n onActiveDrawerResize,\n } = useDrawers(rest, ariaLabels, {\n ariaLabels,\n toolsHide,\n toolsOpen,\n tools,\n toolsWidth,\n onToolsToggle,\n });\n\n const [splitPanelOpen = false, setSplitPanelOpen] = useControllable(\n controlledSplitPanelOpen,\n onSplitPanelToggle,\n false,\n {\n componentName: 'AppLayout',\n controlledProp: 'splitPanelOpen',\n changeHandler: 'onSplitPanelToggle',\n }\n );\n\n const onSplitPanelToggleHandler = () => {\n setSplitPanelOpen(!splitPanelOpen);\n fireNonCancelableEvent(onSplitPanelToggle, { open: !splitPanelOpen });\n };\n\n const [splitPanelPreferences, setSplitPanelPreferences] = useControllable(\n controlledSplitPanelPreferences,\n onSplitPanelPreferencesChange,\n undefined,\n {\n componentName: 'AppLayout',\n controlledProp: 'splitPanelPreferences',\n changeHandler: 'onSplitPanelPreferencesChange',\n }\n );\n\n const onSplitPanelPreferencesChangeHandler = (detail: AppLayoutProps.SplitPanelPreferences) => {\n setSplitPanelPreferences(detail);\n splitPanelFocusControl.setLastInteraction({ type: 'position' });\n fireNonCancelableEvent(onSplitPanelPreferencesChange, detail);\n };\n\n const [splitPanelSize = 0, setSplitPanelSize] = useControllable(\n controlledSplitPanelSize,\n onSplitPanelResize,\n getSplitPanelDefaultSize(splitPanelPreferences?.position ?? 'bottom'),\n { componentName: 'AppLayout', controlledProp: 'splitPanelSize', changeHandler: 'onSplitPanelResize' }\n );\n\n const [splitPanelReportedSize, setSplitPanelReportedSize] = useState(0);\n\n const onSplitPanelResizeHandler = (size: number) => {\n setSplitPanelSize(size);\n fireNonCancelableEvent(onSplitPanelResize, { size });\n };\n\n const [splitPanelToggleConfig, setSplitPanelToggleConfig] = useState<SplitPanelSideToggleProps>({\n ariaLabel: undefined,\n displayed: false,\n });\n\n const drawersFocusControl = useFocusControl(!!activeDrawer?.id);\n const navigationFocusControl = useFocusControl(navigationOpen);\n const splitPanelFocusControl = useSplitPanelFocusControl([splitPanelPreferences, splitPanelOpen]);\n\n useImperativeHandle(forwardRef, () => ({\n closeNavigationIfNecessary: () => isMobile && onNavigationToggle(false),\n openTools: () => onToolsToggle(true),\n focusToolsClose: () => drawersFocusControl.setFocus(true),\n focusActiveDrawer: () => drawersFocusControl.setFocus(true),\n focusSplitPanel: () => splitPanelFocusControl.refs.slider.current?.focus(),\n }));\n\n const resolvedNavigation = navigationHide ? null : navigation ?? <></>;\n const { maxDrawerSize, maxSplitPanelSize, splitPanelForcedPosition, splitPanelPosition } = computeHorizontalLayout({\n activeDrawerSize: activeDrawer ? activeDrawerSize : 0,\n splitPanelSize,\n minContentWidth,\n navigationOpen: !!resolvedNavigation && navigationOpen,\n navigationWidth,\n placement,\n splitPanelOpen,\n splitPanelPosition: splitPanelPreferences?.position,\n isMobile,\n });\n\n const { registered, toolbarProps } = useMultiAppLayout({\n forceDeduplicationType,\n ariaLabels: ariaLabelsWithDrawers,\n navigation: resolvedNavigation,\n navigationOpen,\n onNavigationToggle,\n navigationFocusRef: navigationFocusControl.refs.toggle,\n breadcrumbs,\n activeDrawerId: activeDrawer?.id ?? null,\n // only pass it down if there are non-empty drawers or tools\n drawers: drawers?.length || !toolsHide ? drawers : undefined,\n onActiveDrawerChange,\n drawersFocusRef: drawersFocusControl.refs.toggle,\n splitPanel,\n splitPanelToggleProps: {\n ...splitPanelToggleConfig,\n active: splitPanelOpen,\n controlId: splitPanelControlId,\n position: splitPanelPosition,\n },\n splitPanelFocusRef: splitPanelFocusControl.refs.toggle,\n onSplitPanelToggle: onSplitPanelToggleHandler,\n });\n\n const hasToolbar = !embeddedViewMode && !!toolbarProps;\n const discoveredBreadcrumbs = useGetGlobalBreadcrumbs(hasToolbar);\n\n const verticalOffsets = computeVerticalLayout({\n topOffset: placement.insetBlockStart,\n hasVisibleToolbar: hasToolbar && toolbarState !== 'hide',\n notificationsHeight: notificationsHeight ?? 0,\n toolbarHeight: toolbarHeight ?? 0,\n stickyNotifications: !!stickyNotifications,\n });\n\n const appLayoutInternals: AppLayoutInternals = {\n ariaLabels: ariaLabelsWithDrawers,\n headerVariant,\n isMobile,\n breadcrumbs,\n discoveredBreadcrumbs,\n stickyNotifications,\n navigationOpen,\n navigation: resolvedNavigation,\n navigationFocusControl,\n activeDrawer,\n activeDrawerSize,\n minDrawerSize,\n maxDrawerSize,\n drawers: drawers!,\n drawersFocusControl,\n splitPanelPosition,\n splitPanelToggleConfig,\n splitPanelOpen,\n splitPanelControlId,\n splitPanelFocusControl,\n placement,\n toolbarState,\n setToolbarState,\n verticalOffsets,\n setToolbarHeight,\n setNotificationsHeight,\n onSplitPanelToggle: onSplitPanelToggleHandler,\n onNavigationToggle,\n onActiveDrawerChange,\n onActiveDrawerResize,\n };\n\n const splitPanelInternals: SplitPanelProviderProps = {\n bottomOffset: 0,\n getMaxHeight: () => {\n const availableHeight =\n document.documentElement.clientHeight - placement.insetBlockStart - placement.insetBlockEnd;\n // If the page is likely zoomed in at 200%, allow the split panel to fill the content area.\n return availableHeight < 400 ? availableHeight - 40 : availableHeight - 250;\n },\n maxWidth: maxSplitPanelSize,\n isForcedPosition: splitPanelForcedPosition,\n isOpen: splitPanelOpen,\n leftOffset: 0,\n onPreferencesChange: onSplitPanelPreferencesChangeHandler,\n onResize: onSplitPanelResizeHandler,\n onToggle: onSplitPanelToggleHandler,\n position: splitPanelPosition,\n reportSize: size => setSplitPanelReportedSize(size),\n reportHeaderHeight: () => {\n /*unused in this design*/\n },\n rightOffset: 0,\n size: splitPanelSize,\n topOffset: 0,\n setSplitPanelToggle: setSplitPanelToggleConfig,\n refs: splitPanelFocusControl.refs,\n };\n\n return (\n <>\n {/* Rendering a hidden copy of breadcrumbs to trigger their deduplication */}\n {!hasToolbar && breadcrumbs ? <ScreenreaderOnly>{breadcrumbs}</ScreenreaderOnly> : null}\n <SkeletonLayout\n style={{\n [globalVars.stickyVerticalTopOffset]: `${verticalOffsets.header}px`,\n [globalVars.stickyVerticalBottomOffset]: `${placement.insetBlockEnd}px`,\n paddingBlockEnd: splitPanelOpen && splitPanelPosition === 'bottom' ? splitPanelReportedSize : '',\n }}\n toolbar={\n hasToolbar && <AppLayoutToolbar appLayoutInternals={appLayoutInternals} toolbarProps={toolbarProps} />\n }\n notifications={\n notifications && (\n <AppLayoutNotifications appLayoutInternals={appLayoutInternals}>{notifications}</AppLayoutNotifications>\n )\n }\n contentHeader={contentHeader}\n // delay rendering the content until registration of this instance is complete\n content={registered ? content : null}\n navigation={resolvedNavigation && <AppLayoutNavigation appLayoutInternals={appLayoutInternals} />}\n navigationOpen={navigationOpen}\n navigationWidth={navigationWidth}\n tools={activeDrawer && <AppLayoutDrawer appLayoutInternals={appLayoutInternals} />}\n toolsOpen={!!activeDrawer}\n toolsWidth={activeDrawerSize}\n sideSplitPanel={\n splitPanelPosition === 'side' && (\n <AppLayoutSplitPanelSide\n appLayoutInternals={appLayoutInternals}\n splitPanelInternals={splitPanelInternals}\n >\n {splitPanel}\n </AppLayoutSplitPanelSide>\n )\n }\n bottomSplitPanel={\n splitPanelPosition === 'bottom' && (\n <AppLayoutSplitPanelBottom\n appLayoutInternals={appLayoutInternals}\n splitPanelInternals={splitPanelInternals}\n >\n {splitPanel}\n </AppLayoutSplitPanelBottom>\n )\n }\n splitPanelOpen={splitPanelOpen}\n placement={placement}\n contentType={contentType}\n maxContentWidth={maxContentWidth}\n disableContentPaddings={disableContentPaddings}\n />\n </>\n );\n }\n);\n\nexport default AppLayoutVisualRefreshToolbar;\n"]}
@@ -1,11 +1,9 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "navigation": "awsui_navigation_2p2ab_z2esl_149",
5
- "is-navigation-open": "awsui_is-navigation-open_2p2ab_z2esl_177",
6
- "animating": "awsui_animating_2p2ab_z2esl_181",
7
- "openNavigation": "awsui_openNavigation_2p2ab_z2esl_1",
8
- "animated-content": "awsui_animated-content_2p2ab_z2esl_194",
9
- "hide-navigation": "awsui_hide-navigation_2p2ab_z2esl_203"
4
+ "navigation": "awsui_navigation_2p2ab_19x0t_149",
5
+ "is-navigation-open": "awsui_is-navigation-open_2p2ab_19x0t_167",
6
+ "animated-content": "awsui_animated-content_2p2ab_19x0t_171",
7
+ "hide-navigation": "awsui_hide-navigation_2p2ab_19x0t_180"
10
8
  };
11
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_z2esl_149:not(#\9) {
149
+ .awsui_navigation_2p2ab_19x0t_149:not(#\9) {
150
150
  position: sticky;
151
151
  background-color: var(--color-background-container-content-4un1ap, #ffffff);
152
152
  inset-block-end: 0;
@@ -164,43 +164,20 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
164
164
  prevent unwanted text wrapping.
165
165
  */
166
166
  }
167
- @keyframes awsui_openNavigation_2p2ab_z2esl_1 {
168
- from {
169
- opacity: 0;
170
- inline-size: calc(var(--space-layout-toggle-padding-lcu6qi, 12px) * 2 + var(--space-layout-toggle-diameter-hb85rk, 36px));
171
- }
172
- to {
173
- opacity: 1;
174
- inline-size: var(--awsui-navigation-width-g964ok);
175
- }
176
- }
177
- .awsui_navigation_2p2ab_z2esl_149:not(#\9):not(.awsui_is-navigation-open_2p2ab_z2esl_177) {
178
- inline-size: 0;
167
+ .awsui_navigation_2p2ab_19x0t_149:not(#\9):not(.awsui_is-navigation-open_2p2ab_19x0t_167) {
168
+ inline-size: 0px;
179
169
  display: none;
180
170
  }
181
- .awsui_navigation_2p2ab_z2esl_149.awsui_is-navigation-open_2p2ab_z2esl_177.awsui_animating_2p2ab_z2esl_181:not(#\9) {
182
- animation: awsui_openNavigation_2p2ab_z2esl_1 var(--motion-duration-refresh-only-fast-4jn2d7, 115ms);
183
- }
184
- @media (prefers-reduced-motion: reduce) {
185
- .awsui_navigation_2p2ab_z2esl_149.awsui_is-navigation-open_2p2ab_z2esl_177.awsui_animating_2p2ab_z2esl_181:not(#\9) {
186
- animation: none;
187
- transition: none;
188
- }
189
- }
190
- .awsui-motion-disabled .awsui_navigation_2p2ab_z2esl_149.awsui_is-navigation-open_2p2ab_z2esl_177.awsui_animating_2p2ab_z2esl_181:not(#\9), .awsui-mode-entering .awsui_navigation_2p2ab_z2esl_149.awsui_is-navigation-open_2p2ab_z2esl_177.awsui_animating_2p2ab_z2esl_181:not(#\9) {
191
- animation: none;
192
- transition: none;
193
- }
194
- .awsui_navigation_2p2ab_z2esl_149 > .awsui_animated-content_2p2ab_z2esl_194:not(#\9) {
171
+ .awsui_navigation_2p2ab_19x0t_149 > .awsui_animated-content_2p2ab_19x0t_171:not(#\9) {
195
172
  inline-size: var(--awsui-navigation-width-g964ok);
196
173
  }
197
174
  @media (max-width: 688px) {
198
- .awsui_navigation_2p2ab_z2esl_149:not(#\9) {
175
+ .awsui_navigation_2p2ab_19x0t_149:not(#\9) {
199
176
  --awsui-navigation-width-g964ok: 100vw;
200
177
  }
201
178
  }
202
179
 
203
- .awsui_hide-navigation_2p2ab_z2esl_203:not(#\9) {
180
+ .awsui_hide-navigation_2p2ab_19x0t_180:not(#\9) {
204
181
  position: absolute;
205
182
  inset-inline-end: var(--space-m-udix3p, 16px);
206
183
  inset-block-start: 10px;
@@ -2,11 +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_z2esl_149",
6
- "is-navigation-open": "awsui_is-navigation-open_2p2ab_z2esl_177",
7
- "animating": "awsui_animating_2p2ab_z2esl_181",
8
- "openNavigation": "awsui_openNavigation_2p2ab_z2esl_1",
9
- "animated-content": "awsui_animated-content_2p2ab_z2esl_194",
10
- "hide-navigation": "awsui_hide-navigation_2p2ab_z2esl_203"
5
+ "navigation": "awsui_navigation_2p2ab_19x0t_149",
6
+ "is-navigation-open": "awsui_is-navigation-open_2p2ab_19x0t_167",
7
+ "animated-content": "awsui_animated-content_2p2ab_19x0t_171",
8
+ "hide-navigation": "awsui_hide-navigation_2p2ab_19x0t_180"
11
9
  };
12
10
 
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/skeleton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,kBAAkB,CAAC;AAO9D,UAAU,mBACR,SAAQ,IAAI,CACV,0BAA0B,EACxB,eAAe,GACf,eAAe,GACf,SAAS,GACT,aAAa,GACb,iBAAiB,GACjB,wBAAwB,GACxB,YAAY,GACZ,gBAAgB,GAChB,iBAAiB,GACjB,OAAO,GACP,WAAW,GACX,YAAY,GACZ,WAAW,CACd;IACD,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACpC;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,aAAa,EACb,aAAa,EACb,OAAO,EACP,UAAU,EACV,cAAc,EACd,eAAe,EACf,KAAK,EACL,SAAS,EACT,UAAU,EACV,OAAO,EACP,cAAc,EACd,gBAAgB,EAChB,cAAc,EACd,SAAS,EACT,WAAW,EACX,eAAe,EACf,sBAAsB,GACvB,EAAE,mBAAmB,eAmDrB"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/skeleton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,kBAAkB,CAAC;AAQ9D,UAAU,mBACR,SAAQ,IAAI,CACV,0BAA0B,EACxB,eAAe,GACf,eAAe,GACf,SAAS,GACT,aAAa,GACb,iBAAiB,GACjB,wBAAwB,GACxB,YAAY,GACZ,gBAAgB,GAChB,iBAAiB,GACjB,OAAO,GACP,WAAW,GACX,YAAY,GACZ,WAAW,CACd;IACD,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACpC;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,aAAa,EACb,aAAa,EACb,OAAO,EACP,UAAU,EACV,cAAc,EACd,eAAe,EACf,KAAK,EACL,SAAS,EACT,UAAU,EACV,OAAO,EACP,cAAc,EACd,gBAAgB,EAChB,cAAc,EACd,SAAS,EACT,WAAW,EACX,eAAe,EACf,sBAAsB,GACvB,EAAE,mBAAmB,eAmDrB"}
@@ -3,6 +3,7 @@
3
3
  import React from 'react';
4
4
  import clsx from 'clsx';
5
5
  import customCssProps from '../../../internal/generated/custom-css-properties';
6
+ import sharedStyles from '../../resize/styles.css.js';
6
7
  import testutilStyles from '../../test-classes/styles.css.js';
7
8
  import styles from './styles.css.js';
8
9
  const contentTypeCustomWidths = ['dashboard', 'cards', 'table'];
@@ -18,15 +19,15 @@ export function SkeletonLayout({ style, notifications, contentHeader, content, n
18
19
  [customCssProps.navigationWidth]: `${navigationWidth}px`,
19
20
  [customCssProps.toolsWidth]: `${toolsWidth}px`,
20
21
  } },
21
- navigation && (React.createElement("div", { className: clsx(styles.navigation, !navigationOpen && styles['panel-hidden'], toolsOpen && styles['unfocusable-mobile']) }, navigation)),
22
+ navigation && (React.createElement("div", { className: clsx(styles.navigation, !navigationOpen && styles['panel-hidden'], toolsOpen && styles['unfocusable-mobile'], sharedStyles['with-motion']) }, navigation)),
22
23
  toolbar,
23
24
  React.createElement("main", { className: clsx(styles['main-landmark'], anyPanelOpen && styles['unfocusable-mobile']) },
24
25
  notifications,
25
26
  React.createElement("div", { className: clsx(styles.main, { [styles['main-disable-paddings']]: disableContentPaddings }), style: style },
26
27
  contentHeader && React.createElement("div", { className: styles['content-header'] }, contentHeader),
27
28
  React.createElement("div", { className: clsx(styles.content, testutilStyles.content) }, content)),
28
- bottomSplitPanel && (React.createElement("div", { className: clsx(styles['split-panel-bottom'], !splitPanelOpen && styles['split-panel-hidden']), style: { insetBlockEnd: placement.insetBlockEnd } }, bottomSplitPanel))),
29
+ bottomSplitPanel && (React.createElement("div", { className: clsx(styles['split-panel-bottom']), style: { insetBlockEnd: placement.insetBlockEnd } }, bottomSplitPanel))),
29
30
  sideSplitPanel && (React.createElement("div", { className: clsx(styles['split-panel-side'], !splitPanelOpen && styles['panel-hidden']) }, sideSplitPanel)),
30
- tools && React.createElement("div", { className: clsx(styles.tools, !toolsOpen && styles['panel-hidden']) }, tools)));
31
+ React.createElement("div", { className: clsx(styles.tools, !toolsOpen && styles['panel-hidden'], sharedStyles['with-motion']) }, tools)));
31
32
  }
32
33
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/skeleton/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 from 'react';\nimport clsx from 'clsx';\n\nimport customCssProps from '../../../internal/generated/custom-css-properties';\nimport { AppLayoutPropsWithDefaults } from '../../interfaces';\n\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\nconst contentTypeCustomWidths: Array<string | undefined> = ['dashboard', 'cards', 'table'];\n\ninterface SkeletonLayoutProps\n extends Pick<\n AppLayoutPropsWithDefaults,\n | 'notifications'\n | 'contentHeader'\n | 'content'\n | 'contentType'\n | 'maxContentWidth'\n | 'disableContentPaddings'\n | 'navigation'\n | 'navigationOpen'\n | 'navigationWidth'\n | 'tools'\n | 'toolsOpen'\n | 'toolsWidth'\n | 'placement'\n > {\n style?: React.CSSProperties;\n toolbar?: React.ReactNode;\n splitPanelOpen?: boolean;\n sideSplitPanel?: React.ReactNode;\n bottomSplitPanel?: React.ReactNode;\n}\n\nexport function SkeletonLayout({\n style,\n notifications,\n contentHeader,\n content,\n navigation,\n navigationOpen,\n navigationWidth,\n tools,\n toolsOpen,\n toolsWidth,\n toolbar,\n sideSplitPanel,\n bottomSplitPanel,\n splitPanelOpen,\n placement,\n contentType,\n maxContentWidth,\n disableContentPaddings,\n}: SkeletonLayoutProps) {\n const isMaxWidth = maxContentWidth === Number.MAX_VALUE || maxContentWidth === Number.MAX_SAFE_INTEGER;\n const anyPanelOpen = navigationOpen || toolsOpen;\n return (\n <div\n className={clsx(styles.root, testutilStyles.root, {\n [styles['has-adaptive-widths-default']]: !contentTypeCustomWidths.includes(contentType),\n [styles['has-adaptive-widths-dashboard']]: contentType === 'dashboard',\n })}\n style={{\n minBlockSize: `calc(100vh - ${placement.insetBlockStart}px - ${placement.insetBlockEnd}px)`,\n [customCssProps.maxContentWidth]: isMaxWidth ? '100%' : maxContentWidth ? `${maxContentWidth}px` : '',\n [customCssProps.navigationWidth]: `${navigationWidth}px`,\n [customCssProps.toolsWidth]: `${toolsWidth}px`,\n }}\n >\n {navigation && (\n <div\n className={clsx(\n styles.navigation,\n !navigationOpen && styles['panel-hidden'],\n toolsOpen && styles['unfocusable-mobile']\n )}\n >\n {navigation}\n </div>\n )}\n {toolbar}\n <main className={clsx(styles['main-landmark'], anyPanelOpen && styles['unfocusable-mobile'])}>\n {notifications}\n <div className={clsx(styles.main, { [styles['main-disable-paddings']]: disableContentPaddings })} style={style}>\n {contentHeader && <div className={styles['content-header']}>{contentHeader}</div>}\n <div className={clsx(styles.content, testutilStyles.content)}>{content}</div>\n </div>\n {bottomSplitPanel && (\n <div\n className={clsx(styles['split-panel-bottom'], !splitPanelOpen && styles['split-panel-hidden'])}\n style={{ insetBlockEnd: placement.insetBlockEnd }}\n >\n {bottomSplitPanel}\n </div>\n )}\n </main>\n {sideSplitPanel && (\n <div className={clsx(styles['split-panel-side'], !splitPanelOpen && styles['panel-hidden'])}>\n {sideSplitPanel}\n </div>\n )}\n {tools && <div className={clsx(styles.tools, !toolsOpen && styles['panel-hidden'])}>{tools}</div>}\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/skeleton/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 from 'react';\nimport clsx from 'clsx';\n\nimport customCssProps from '../../../internal/generated/custom-css-properties';\nimport { AppLayoutPropsWithDefaults } from '../../interfaces';\n\nimport sharedStyles from '../../resize/styles.css.js';\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\nconst contentTypeCustomWidths: Array<string | undefined> = ['dashboard', 'cards', 'table'];\n\ninterface SkeletonLayoutProps\n extends Pick<\n AppLayoutPropsWithDefaults,\n | 'notifications'\n | 'contentHeader'\n | 'content'\n | 'contentType'\n | 'maxContentWidth'\n | 'disableContentPaddings'\n | 'navigation'\n | 'navigationOpen'\n | 'navigationWidth'\n | 'tools'\n | 'toolsOpen'\n | 'toolsWidth'\n | 'placement'\n > {\n style?: React.CSSProperties;\n toolbar?: React.ReactNode;\n splitPanelOpen?: boolean;\n sideSplitPanel?: React.ReactNode;\n bottomSplitPanel?: React.ReactNode;\n}\n\nexport function SkeletonLayout({\n style,\n notifications,\n contentHeader,\n content,\n navigation,\n navigationOpen,\n navigationWidth,\n tools,\n toolsOpen,\n toolsWidth,\n toolbar,\n sideSplitPanel,\n bottomSplitPanel,\n splitPanelOpen,\n placement,\n contentType,\n maxContentWidth,\n disableContentPaddings,\n}: SkeletonLayoutProps) {\n const isMaxWidth = maxContentWidth === Number.MAX_VALUE || maxContentWidth === Number.MAX_SAFE_INTEGER;\n const anyPanelOpen = navigationOpen || toolsOpen;\n return (\n <div\n className={clsx(styles.root, testutilStyles.root, {\n [styles['has-adaptive-widths-default']]: !contentTypeCustomWidths.includes(contentType),\n [styles['has-adaptive-widths-dashboard']]: contentType === 'dashboard',\n })}\n style={{\n minBlockSize: `calc(100vh - ${placement.insetBlockStart}px - ${placement.insetBlockEnd}px)`,\n [customCssProps.maxContentWidth]: isMaxWidth ? '100%' : maxContentWidth ? `${maxContentWidth}px` : '',\n [customCssProps.navigationWidth]: `${navigationWidth}px`,\n [customCssProps.toolsWidth]: `${toolsWidth}px`,\n }}\n >\n {navigation && (\n <div\n className={clsx(\n styles.navigation,\n !navigationOpen && styles['panel-hidden'],\n toolsOpen && styles['unfocusable-mobile'],\n sharedStyles['with-motion']\n )}\n >\n {navigation}\n </div>\n )}\n {toolbar}\n <main className={clsx(styles['main-landmark'], anyPanelOpen && styles['unfocusable-mobile'])}>\n {notifications}\n <div className={clsx(styles.main, { [styles['main-disable-paddings']]: disableContentPaddings })} style={style}>\n {contentHeader && <div className={styles['content-header']}>{contentHeader}</div>}\n <div className={clsx(styles.content, testutilStyles.content)}>{content}</div>\n </div>\n {bottomSplitPanel && (\n <div className={clsx(styles['split-panel-bottom'])} style={{ insetBlockEnd: placement.insetBlockEnd }}>\n {bottomSplitPanel}\n </div>\n )}\n </main>\n {sideSplitPanel && (\n <div className={clsx(styles['split-panel-side'], !splitPanelOpen && styles['panel-hidden'])}>\n {sideSplitPanel}\n </div>\n )}\n <div className={clsx(styles.tools, !toolsOpen && styles['panel-hidden'], sharedStyles['with-motion'])}>\n {tools}\n </div>\n </div>\n );\n}\n"]}
@@ -1,21 +1,21 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "root": "awsui_root_7nfqu_1j6x7_149",
5
- "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_7nfqu_1j6x7_198",
6
- "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_7nfqu_1j6x7_213",
7
- "navigation": "awsui_navigation_7nfqu_1j6x7_228",
8
- "tools": "awsui_tools_7nfqu_1j6x7_229",
9
- "split-panel-side": "awsui_split-panel-side_7nfqu_1j6x7_253",
10
- "split-panel-bottom": "awsui_split-panel-bottom_7nfqu_1j6x7_259",
11
- "panel-hidden": "awsui_panel-hidden_7nfqu_1j6x7_272",
12
- "toolbar-container": "awsui_toolbar-container_7nfqu_1j6x7_276",
13
- "notifications-container": "awsui_notifications-container_7nfqu_1j6x7_282",
14
- "main-landmark": "awsui_main-landmark_7nfqu_1j6x7_289",
15
- "main": "awsui_main_7nfqu_1j6x7_289",
16
- "main-disable-paddings": "awsui_main-disable-paddings_7nfqu_1j6x7_298",
17
- "content-header": "awsui_content-header_7nfqu_1j6x7_308",
18
- "content": "awsui_content_7nfqu_1j6x7_308",
19
- "unfocusable-mobile": "awsui_unfocusable-mobile_7nfqu_1j6x7_318"
4
+ "root": "awsui_root_7nfqu_1dz4s_149",
5
+ "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_7nfqu_1dz4s_198",
6
+ "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_7nfqu_1dz4s_213",
7
+ "navigation": "awsui_navigation_7nfqu_1dz4s_228",
8
+ "tools": "awsui_tools_7nfqu_1dz4s_229",
9
+ "split-panel-side": "awsui_split-panel-side_7nfqu_1dz4s_260",
10
+ "split-panel-bottom": "awsui_split-panel-bottom_7nfqu_1dz4s_267",
11
+ "panel-hidden": "awsui_panel-hidden_7nfqu_1dz4s_280",
12
+ "toolbar-container": "awsui_toolbar-container_7nfqu_1dz4s_290",
13
+ "notifications-container": "awsui_notifications-container_7nfqu_1dz4s_296",
14
+ "main-landmark": "awsui_main-landmark_7nfqu_1dz4s_303",
15
+ "main": "awsui_main_7nfqu_1dz4s_303",
16
+ "main-disable-paddings": "awsui_main-disable-paddings_7nfqu_1dz4s_312",
17
+ "content-header": "awsui_content-header_7nfqu_1dz4s_322",
18
+ "content": "awsui_content_7nfqu_1dz4s_322",
19
+ "unfocusable-mobile": "awsui_unfocusable-mobile_7nfqu_1dz4s_332"
20
20
  };
21
21
 
@@ -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_root_7nfqu_1j6x7_149:not(#\9) {
149
+ .awsui_root_7nfqu_1dz4s_149:not(#\9) {
150
150
  border-collapse: separate;
151
151
  border-spacing: 0;
152
152
  box-sizing: border-box;
@@ -189,75 +189,83 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
189
189
  grid-template-rows: min-content min-content 1fr;
190
190
  }
191
191
  @media (min-width: 689px) {
192
- .awsui_root_7nfqu_1j6x7_149:not(#\9) {
192
+ .awsui_root_7nfqu_1dz4s_149:not(#\9) {
193
193
  grid-template-areas: "navigation toolbar toolbar toolbar toolbar tools" "navigation . notifications . sideSplitPanel tools" "navigation . main . sideSplitPanel tools";
194
194
  grid-template-columns: min-content minmax(var(--space-layout-content-horizontal-7l52k3, 24px), 1fr) minmax(0, var(--awsui-max-content-width-g964ok)) minmax(var(--space-layout-content-horizontal-7l52k3, 24px), 1fr) min-content min-content;
195
195
  grid-template-rows: min-content min-content 1fr min-content;
196
196
  }
197
197
  }
198
198
  @media (min-width: 689px) and (min-width: 1401px) {
199
- .awsui_root_7nfqu_1j6x7_149.awsui_has-adaptive-widths-default_7nfqu_1j6x7_198:not(#\9) {
199
+ .awsui_root_7nfqu_1dz4s_149.awsui_has-adaptive-widths-default_7nfqu_1dz4s_198:not(#\9) {
200
200
  --awsui-max-content-width-g964ok: 1280px;
201
201
  }
202
202
  }
203
203
  @media (min-width: 689px) and (min-width: 1921px) {
204
- .awsui_root_7nfqu_1j6x7_149.awsui_has-adaptive-widths-default_7nfqu_1j6x7_198:not(#\9) {
204
+ .awsui_root_7nfqu_1dz4s_149.awsui_has-adaptive-widths-default_7nfqu_1dz4s_198:not(#\9) {
205
205
  --awsui-max-content-width-g964ok: 1440px;
206
206
  }
207
207
  }
208
208
  @media (min-width: 689px) and (min-width: 2541px) {
209
- .awsui_root_7nfqu_1j6x7_149.awsui_has-adaptive-widths-default_7nfqu_1j6x7_198:not(#\9) {
209
+ .awsui_root_7nfqu_1dz4s_149.awsui_has-adaptive-widths-default_7nfqu_1dz4s_198:not(#\9) {
210
210
  --awsui-max-content-width-g964ok: 1620px;
211
211
  }
212
212
  }
213
213
  @media (min-width: 689px) and (min-width: 1401px) {
214
- .awsui_root_7nfqu_1j6x7_149.awsui_has-adaptive-widths-dashboard_7nfqu_1j6x7_213:not(#\9) {
214
+ .awsui_root_7nfqu_1dz4s_149.awsui_has-adaptive-widths-dashboard_7nfqu_1dz4s_213:not(#\9) {
215
215
  --awsui-max-content-width-g964ok: 1280px;
216
216
  }
217
217
  }
218
218
  @media (min-width: 689px) and (min-width: 1921px) {
219
- .awsui_root_7nfqu_1j6x7_149.awsui_has-adaptive-widths-dashboard_7nfqu_1j6x7_213:not(#\9) {
219
+ .awsui_root_7nfqu_1dz4s_149.awsui_has-adaptive-widths-dashboard_7nfqu_1dz4s_213:not(#\9) {
220
220
  --awsui-max-content-width-g964ok: 1620px;
221
221
  }
222
222
  }
223
223
  @media (min-width: 689px) and (min-width: 2541px) {
224
- .awsui_root_7nfqu_1j6x7_149.awsui_has-adaptive-widths-dashboard_7nfqu_1j6x7_213:not(#\9) {
224
+ .awsui_root_7nfqu_1dz4s_149.awsui_has-adaptive-widths-dashboard_7nfqu_1dz4s_213:not(#\9) {
225
225
  --awsui-max-content-width-g964ok: 2160px;
226
226
  }
227
227
  }
228
228
 
229
- .awsui_navigation_7nfqu_1j6x7_228:not(#\9),
230
- .awsui_tools_7nfqu_1j6x7_229:not(#\9) {
229
+ .awsui_navigation_7nfqu_1dz4s_228:not(#\9),
230
+ .awsui_tools_7nfqu_1dz4s_229:not(#\9) {
231
231
  grid-row: 1/-1;
232
232
  grid-column: 1/-1;
233
233
  background: var(--color-background-container-content-4un1ap, #ffffff);
234
234
  z-index: 850;
235
+ opacity: 1;
236
+ }
237
+ @media (max-width: 688px) {
238
+ .awsui_navigation_7nfqu_1dz4s_228:not(#\9),
239
+ .awsui_tools_7nfqu_1dz4s_229:not(#\9) {
240
+ inline-size: 100%;
241
+ }
235
242
  }
236
243
 
237
244
  @media (min-width: 689px) {
238
- .awsui_navigation_7nfqu_1j6x7_228:not(#\9) {
245
+ .awsui_navigation_7nfqu_1dz4s_228:not(#\9) {
239
246
  grid-area: navigation;
240
247
  inline-size: var(--awsui-navigation-width-g964ok);
241
- border-inline-end: 1px solid var(--color-border-divider-panel-side-93n0qu, #b6bec9);
248
+ border-inline-end: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-layout-1zovx9, #b6bec9);
242
249
  }
243
250
  }
244
251
 
245
252
  @media (min-width: 689px) {
246
- .awsui_tools_7nfqu_1j6x7_229:not(#\9) {
253
+ .awsui_tools_7nfqu_1dz4s_229:not(#\9) {
247
254
  grid-area: tools;
248
255
  inline-size: var(--awsui-tools-width-g964ok);
249
- border-inline-start: 1px solid var(--color-border-divider-panel-side-93n0qu, #b6bec9);
256
+ border-inline-start: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-layout-1zovx9, #b6bec9);
250
257
  }
251
258
  }
252
259
 
253
260
  @media (min-width: 689px) {
254
- .awsui_split-panel-side_7nfqu_1j6x7_253:not(#\9) {
261
+ .awsui_split-panel-side_7nfqu_1dz4s_260:not(#\9) {
255
262
  grid-area: sideSplitPanel;
256
- border-inline-start: 1px solid var(--color-border-divider-panel-side-93n0qu, #b6bec9);
263
+ border-inline-start: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-layout-1zovx9, #b6bec9);
264
+ opacity: 1;
257
265
  }
258
266
  }
259
267
 
260
- .awsui_split-panel-bottom_7nfqu_1j6x7_259:not(#\9) {
268
+ .awsui_split-panel-bottom_7nfqu_1dz4s_267:not(#\9) {
261
269
  position: sticky;
262
270
  z-index: 840;
263
271
  align-self: end;
@@ -265,58 +273,64 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
265
273
  grid-column: 1/-1;
266
274
  }
267
275
  @media (min-width: 689px) {
268
- .awsui_split-panel-bottom_7nfqu_1j6x7_259:not(#\9) {
276
+ .awsui_split-panel-bottom_7nfqu_1dz4s_267:not(#\9) {
269
277
  grid-column: 2/span 3;
270
278
  }
271
279
  }
272
280
 
273
- .awsui_panel-hidden_7nfqu_1j6x7_272:not(#\9) {
274
- display: none;
281
+ .awsui_panel-hidden_7nfqu_1dz4s_280:not(#\9) {
282
+ border-block: none;
283
+ border-inline: none;
284
+ opacity: 0;
285
+ z-index: 0;
286
+ }
287
+ .awsui_panel-hidden_7nfqu_1dz4s_280.awsui_navigation_7nfqu_1dz4s_228:not(#\9), .awsui_panel-hidden_7nfqu_1dz4s_280.awsui_tools_7nfqu_1dz4s_229:not(#\9) {
288
+ inline-size: 0px;
275
289
  }
276
290
 
277
- .awsui_toolbar-container_7nfqu_1j6x7_276:not(#\9) {
291
+ .awsui_toolbar-container_7nfqu_1dz4s_290:not(#\9) {
278
292
  grid-area: toolbar;
279
293
  block-size: 48px;
280
- border-block-end: 1px solid var(--color-border-divider-panel-bottom-dwyqvg, #b6bec9);
294
+ border-block-end: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-layout-1zovx9, #b6bec9);
281
295
  }
282
296
 
283
- .awsui_notifications-container_7nfqu_1j6x7_282:not(#\9) {
297
+ .awsui_notifications-container_7nfqu_1dz4s_296:not(#\9) {
284
298
  grid-area: notifications;
285
299
  }
286
- .awsui_notifications-container_7nfqu_1j6x7_282:not(#\9):not(:empty) {
300
+ .awsui_notifications-container_7nfqu_1dz4s_296:not(#\9):not(:empty) {
287
301
  padding-block-start: var(--space-scaled-xs-26e2du, 8px);
288
302
  }
289
303
 
290
- .awsui_main-landmark_7nfqu_1j6x7_289:not(#\9) {
304
+ .awsui_main-landmark_7nfqu_1dz4s_303:not(#\9) {
291
305
  display: contents;
292
306
  }
293
307
 
294
- .awsui_main_7nfqu_1j6x7_289:not(#\9) {
308
+ .awsui_main_7nfqu_1dz4s_303:not(#\9) {
295
309
  grid-area: main;
296
310
  margin-block-start: var(--space-scaled-s-aqzyko, 12px);
297
311
  margin-block-end: var(--space-layout-content-bottom-noqzmw, 40px);
298
312
  }
299
- .awsui_main-disable-paddings_7nfqu_1j6x7_298:not(#\9) {
313
+ .awsui_main-disable-paddings_7nfqu_1dz4s_312:not(#\9) {
300
314
  grid-column: 1/-1;
301
315
  margin-block: 0;
302
316
  }
303
317
  @media (min-width: 689px) {
304
- .awsui_main-disable-paddings_7nfqu_1j6x7_298:not(#\9) {
318
+ .awsui_main-disable-paddings_7nfqu_1dz4s_312:not(#\9) {
305
319
  grid-column: 2/span 3;
306
320
  }
307
321
  }
308
322
 
309
- .awsui_content-header_7nfqu_1j6x7_308:not(#\9) {
323
+ .awsui_content-header_7nfqu_1dz4s_322:not(#\9) {
310
324
  margin-block-end: var(--space-content-header-padding-bottom-y2enua, 16px);
311
325
  }
312
326
 
313
- .awsui_content_7nfqu_1j6x7_308:not(#\9) {
327
+ .awsui_content_7nfqu_1dz4s_322:not(#\9) {
314
328
  display: contents;
315
329
  }
316
330
 
317
331
  /* stylelint-disable-next-line selector-combinator-disallowed-list, selector-max-universal */
318
332
  @media (max-width: 688px) {
319
- .awsui_unfocusable-mobile_7nfqu_1j6x7_318 *:not(#\9) {
333
+ .awsui_unfocusable-mobile_7nfqu_1dz4s_332 *:not(#\9) {
320
334
  visibility: hidden;
321
335
  }
322
336
  }
@@ -2,21 +2,21 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "root": "awsui_root_7nfqu_1j6x7_149",
6
- "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_7nfqu_1j6x7_198",
7
- "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_7nfqu_1j6x7_213",
8
- "navigation": "awsui_navigation_7nfqu_1j6x7_228",
9
- "tools": "awsui_tools_7nfqu_1j6x7_229",
10
- "split-panel-side": "awsui_split-panel-side_7nfqu_1j6x7_253",
11
- "split-panel-bottom": "awsui_split-panel-bottom_7nfqu_1j6x7_259",
12
- "panel-hidden": "awsui_panel-hidden_7nfqu_1j6x7_272",
13
- "toolbar-container": "awsui_toolbar-container_7nfqu_1j6x7_276",
14
- "notifications-container": "awsui_notifications-container_7nfqu_1j6x7_282",
15
- "main-landmark": "awsui_main-landmark_7nfqu_1j6x7_289",
16
- "main": "awsui_main_7nfqu_1j6x7_289",
17
- "main-disable-paddings": "awsui_main-disable-paddings_7nfqu_1j6x7_298",
18
- "content-header": "awsui_content-header_7nfqu_1j6x7_308",
19
- "content": "awsui_content_7nfqu_1j6x7_308",
20
- "unfocusable-mobile": "awsui_unfocusable-mobile_7nfqu_1j6x7_318"
5
+ "root": "awsui_root_7nfqu_1dz4s_149",
6
+ "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_7nfqu_1dz4s_198",
7
+ "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_7nfqu_1dz4s_213",
8
+ "navigation": "awsui_navigation_7nfqu_1dz4s_228",
9
+ "tools": "awsui_tools_7nfqu_1dz4s_229",
10
+ "split-panel-side": "awsui_split-panel-side_7nfqu_1dz4s_260",
11
+ "split-panel-bottom": "awsui_split-panel-bottom_7nfqu_1dz4s_267",
12
+ "panel-hidden": "awsui_panel-hidden_7nfqu_1dz4s_280",
13
+ "toolbar-container": "awsui_toolbar-container_7nfqu_1dz4s_290",
14
+ "notifications-container": "awsui_notifications-container_7nfqu_1dz4s_296",
15
+ "main-landmark": "awsui_main-landmark_7nfqu_1dz4s_303",
16
+ "main": "awsui_main_7nfqu_1dz4s_303",
17
+ "main-disable-paddings": "awsui_main-disable-paddings_7nfqu_1dz4s_312",
18
+ "content-header": "awsui_content-header_7nfqu_1dz4s_322",
19
+ "content": "awsui_content_7nfqu_1dz4s_322",
20
+ "unfocusable-mobile": "awsui_unfocusable-mobile_7nfqu_1dz4s_332"
21
21
  };
22
22
 
@@ -1,18 +1,18 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "universal-toolbar": "awsui_universal-toolbar_1kzri_9v5ww_141",
5
- "disable-body-scroll": "awsui_disable-body-scroll_1kzri_9v5ww_163",
6
- "toolbar-hidden": "awsui_toolbar-hidden_1kzri_9v5ww_166",
7
- "toolbar-container": "awsui_toolbar-container_1kzri_9v5ww_169",
8
- "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_9v5ww_178",
9
- "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_9v5ww_182",
10
- "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_9v5ww_187",
11
- "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_9v5ww_195",
12
- "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_1kzri_9v5ww_196",
13
- "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_9v5ww_242",
14
- "has-multiple-triggers": "awsui_has-multiple-triggers_1kzri_9v5ww_250",
15
- "has-open-drawer": "awsui_has-open-drawer_1kzri_9v5ww_250",
16
- "drawers-trigger": "awsui_drawers-trigger_1kzri_9v5ww_242"
4
+ "universal-toolbar": "awsui_universal-toolbar_1kzri_1qisx_141",
5
+ "disable-body-scroll": "awsui_disable-body-scroll_1kzri_1qisx_162",
6
+ "toolbar-hidden": "awsui_toolbar-hidden_1kzri_1qisx_165",
7
+ "toolbar-container": "awsui_toolbar-container_1kzri_1qisx_168",
8
+ "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_1qisx_177",
9
+ "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_1qisx_181",
10
+ "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_1qisx_186",
11
+ "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_1qisx_194",
12
+ "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_1kzri_1qisx_195",
13
+ "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_1qisx_241",
14
+ "has-multiple-triggers": "awsui_has-multiple-triggers_1kzri_1qisx_249",
15
+ "has-open-drawer": "awsui_has-open-drawer_1kzri_1qisx_249",
16
+ "drawers-trigger": "awsui_drawers-trigger_1kzri_1qisx_241"
17
17
  };
18
18