@cloudscape-design/components 3.0.257 → 3.0.259

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.
@@ -2,76 +2,76 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "appbar": "awsui_appbar_hyvsj_nghum_93",
6
- "appbar-nav": "awsui_appbar-nav_hyvsj_nghum_117",
7
- "breadcrumbs": "awsui_breadcrumbs_hyvsj_nghum_121",
8
- "appbar-tools": "awsui_appbar-tools_hyvsj_nghum_125",
9
- "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_hyvsj_nghum_126",
10
- "has-breadcrumbs": "awsui_has-breadcrumbs_hyvsj_nghum_167",
11
- "has-notifications-content": "awsui_has-notifications-content_hyvsj_nghum_175",
12
- "has-header": "awsui_has-header_hyvsj_nghum_181",
13
- "has-dynamic-overlap-height": "awsui_has-dynamic-overlap-height_hyvsj_nghum_181",
14
- "content-type-wizard": "awsui_content-type-wizard_hyvsj_nghum_182",
15
- "content-type-cards": "awsui_content-type-cards_hyvsj_nghum_185",
16
- "content-type-table": "awsui_content-type-table_hyvsj_nghum_186",
17
- "has-sticky-background": "awsui_has-sticky-background_hyvsj_nghum_189",
18
- "background": "awsui_background_hyvsj_nghum_224",
19
- "notifications-appbar-header": "awsui_notifications-appbar-header_hyvsj_nghum_227",
20
- "sticky-notifications": "awsui_sticky-notifications_hyvsj_nghum_240",
21
- "overlap": "awsui_overlap_hyvsj_nghum_246",
22
- "drawers-container": "awsui_drawers-container_hyvsj_nghum_270",
23
- "has-open-drawer": "awsui_has-open-drawer_hyvsj_nghum_282",
24
- "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_hyvsj_nghum_312",
25
- "has-multiple-triggers": "awsui_has-multiple-triggers_hyvsj_nghum_330",
26
- "drawers-trigger-content": "awsui_drawers-trigger-content_hyvsj_nghum_362",
27
- "drawer": "awsui_drawer_hyvsj_nghum_126",
28
- "drawer-close-button": "awsui_drawer-close-button_hyvsj_nghum_406",
29
- "drawer-content": "awsui_drawer-content_hyvsj_nghum_410",
30
- "is-drawer-open": "awsui_is-drawer-open_hyvsj_nghum_415",
31
- "content": "awsui_content_hyvsj_nghum_182",
32
- "layout": "awsui_layout_hyvsj_nghum_517",
33
- "has-max-content-width": "awsui_has-max-content-width_hyvsj_nghum_600",
34
- "content-type-dashboard": "awsui_content-type-dashboard_hyvsj_nghum_615",
35
- "is-overlap-disabled": "awsui_is-overlap-disabled_hyvsj_nghum_642",
36
- "disable-body-scroll": "awsui_disable-body-scroll_hyvsj_nghum_645",
37
- "has-sticky-notifications": "awsui_has-sticky-notifications_hyvsj_nghum_649",
38
- "has-split-panel": "awsui_has-split-panel_hyvsj_nghum_663",
39
- "split-panel-position-bottom": "awsui_split-panel-position-bottom_hyvsj_nghum_663",
40
- "has-content-gap-left": "awsui_has-content-gap-left_hyvsj_nghum_675",
41
- "has-content-gap-right": "awsui_has-content-gap-right_hyvsj_nghum_678",
42
- "block-body-scroll": "awsui_block-body-scroll_hyvsj_nghum_693",
43
- "container": "awsui_container_hyvsj_nghum_701",
44
- "disable-content-paddings": "awsui_disable-content-paddings_hyvsj_nghum_727",
45
- "is-navigation-open": "awsui_is-navigation-open_hyvsj_nghum_732",
46
- "is-tools-open": "awsui_is-tools-open_hyvsj_nghum_735",
47
- "is-split-panel-open": "awsui_is-split-panel-open_hyvsj_nghum_735",
48
- "split-panel-position-side": "awsui_split-panel-position-side_hyvsj_nghum_735",
49
- "content-type-default": "awsui_content-type-default_hyvsj_nghum_755",
50
- "content-type-form": "awsui_content-type-form_hyvsj_nghum_755",
51
- "unfocusable": "awsui_unfocusable_hyvsj_nghum_796",
52
- "navigation-container": "awsui_navigation-container_hyvsj_nghum_806",
53
- "show-navigation": "awsui_show-navigation_hyvsj_nghum_841",
54
- "animating": "awsui_animating_hyvsj_nghum_863",
55
- "showButtons": "awsui_showButtons_hyvsj_nghum_1",
56
- "navigation": "awsui_navigation_hyvsj_nghum_806",
57
- "openNavigation": "awsui_openNavigation_hyvsj_nghum_1",
58
- "animated-content": "awsui_animated-content_hyvsj_nghum_924",
59
- "hide-navigation": "awsui_hide-navigation_hyvsj_nghum_933",
60
- "notifications": "awsui_notifications_hyvsj_nghum_227",
61
- "split-panel-bottom": "awsui_split-panel-bottom_hyvsj_nghum_1000",
62
- "position-bottom": "awsui_position-bottom_hyvsj_nghum_1046",
63
- "openSplitPanelBottom": "awsui_openSplitPanelBottom_hyvsj_nghum_1",
64
- "split-panel-side": "awsui_split-panel-side_hyvsj_nghum_1075",
65
- "position-side": "awsui_position-side_hyvsj_nghum_1103",
66
- "openSplitPanelSide": "awsui_openSplitPanelSide_hyvsj_nghum_1",
67
- "tools-container": "awsui_tools-container_hyvsj_nghum_1140",
68
- "tools": "awsui_tools_hyvsj_nghum_1140",
69
- "openTools": "awsui_openTools_hyvsj_nghum_1",
70
- "has-tools-form-persistence": "awsui_has-tools-form-persistence_hyvsj_nghum_1225",
71
- "hide-tools": "awsui_hide-tools_hyvsj_nghum_1235",
72
- "show-tools": "awsui_show-tools_hyvsj_nghum_1247",
73
- "has-tools-form": "awsui_has-tools-form_hyvsj_nghum_1225",
74
- "trigger": "awsui_trigger_hyvsj_nghum_1314",
75
- "selected": "awsui_selected_hyvsj_nghum_1353"
5
+ "appbar": "awsui_appbar_hyvsj_iwse1_93",
6
+ "appbar-nav": "awsui_appbar-nav_hyvsj_iwse1_117",
7
+ "breadcrumbs": "awsui_breadcrumbs_hyvsj_iwse1_121",
8
+ "appbar-tools": "awsui_appbar-tools_hyvsj_iwse1_125",
9
+ "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_hyvsj_iwse1_126",
10
+ "has-breadcrumbs": "awsui_has-breadcrumbs_hyvsj_iwse1_167",
11
+ "has-notifications-content": "awsui_has-notifications-content_hyvsj_iwse1_175",
12
+ "has-header": "awsui_has-header_hyvsj_iwse1_181",
13
+ "has-dynamic-overlap-height": "awsui_has-dynamic-overlap-height_hyvsj_iwse1_181",
14
+ "content-type-wizard": "awsui_content-type-wizard_hyvsj_iwse1_182",
15
+ "content-type-cards": "awsui_content-type-cards_hyvsj_iwse1_185",
16
+ "content-type-table": "awsui_content-type-table_hyvsj_iwse1_186",
17
+ "has-sticky-background": "awsui_has-sticky-background_hyvsj_iwse1_189",
18
+ "background": "awsui_background_hyvsj_iwse1_224",
19
+ "notifications-appbar-header": "awsui_notifications-appbar-header_hyvsj_iwse1_227",
20
+ "sticky-notifications": "awsui_sticky-notifications_hyvsj_iwse1_240",
21
+ "overlap": "awsui_overlap_hyvsj_iwse1_246",
22
+ "drawers-container": "awsui_drawers-container_hyvsj_iwse1_270",
23
+ "has-open-drawer": "awsui_has-open-drawer_hyvsj_iwse1_282",
24
+ "disable-body-scroll": "awsui_disable-body-scroll_hyvsj_iwse1_316",
25
+ "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_hyvsj_iwse1_321",
26
+ "has-multiple-triggers": "awsui_has-multiple-triggers_hyvsj_iwse1_339",
27
+ "drawers-trigger-content": "awsui_drawers-trigger-content_hyvsj_iwse1_371",
28
+ "drawer": "awsui_drawer_hyvsj_iwse1_126",
29
+ "drawer-close-button": "awsui_drawer-close-button_hyvsj_iwse1_415",
30
+ "drawer-content": "awsui_drawer-content_hyvsj_iwse1_420",
31
+ "is-drawer-open": "awsui_is-drawer-open_hyvsj_iwse1_425",
32
+ "content": "awsui_content_hyvsj_iwse1_182",
33
+ "layout": "awsui_layout_hyvsj_iwse1_527",
34
+ "has-max-content-width": "awsui_has-max-content-width_hyvsj_iwse1_610",
35
+ "content-type-dashboard": "awsui_content-type-dashboard_hyvsj_iwse1_625",
36
+ "is-overlap-disabled": "awsui_is-overlap-disabled_hyvsj_iwse1_652",
37
+ "has-sticky-notifications": "awsui_has-sticky-notifications_hyvsj_iwse1_659",
38
+ "has-split-panel": "awsui_has-split-panel_hyvsj_iwse1_673",
39
+ "split-panel-position-bottom": "awsui_split-panel-position-bottom_hyvsj_iwse1_673",
40
+ "has-content-gap-left": "awsui_has-content-gap-left_hyvsj_iwse1_685",
41
+ "has-content-gap-right": "awsui_has-content-gap-right_hyvsj_iwse1_688",
42
+ "block-body-scroll": "awsui_block-body-scroll_hyvsj_iwse1_703",
43
+ "container": "awsui_container_hyvsj_iwse1_711",
44
+ "disable-content-paddings": "awsui_disable-content-paddings_hyvsj_iwse1_737",
45
+ "is-navigation-open": "awsui_is-navigation-open_hyvsj_iwse1_742",
46
+ "is-tools-open": "awsui_is-tools-open_hyvsj_iwse1_745",
47
+ "is-split-panel-open": "awsui_is-split-panel-open_hyvsj_iwse1_745",
48
+ "split-panel-position-side": "awsui_split-panel-position-side_hyvsj_iwse1_745",
49
+ "content-type-default": "awsui_content-type-default_hyvsj_iwse1_765",
50
+ "content-type-form": "awsui_content-type-form_hyvsj_iwse1_765",
51
+ "unfocusable": "awsui_unfocusable_hyvsj_iwse1_806",
52
+ "navigation-container": "awsui_navigation-container_hyvsj_iwse1_816",
53
+ "show-navigation": "awsui_show-navigation_hyvsj_iwse1_860",
54
+ "animating": "awsui_animating_hyvsj_iwse1_882",
55
+ "showButtons": "awsui_showButtons_hyvsj_iwse1_1",
56
+ "navigation": "awsui_navigation_hyvsj_iwse1_816",
57
+ "openNavigation": "awsui_openNavigation_hyvsj_iwse1_1",
58
+ "animated-content": "awsui_animated-content_hyvsj_iwse1_943",
59
+ "hide-navigation": "awsui_hide-navigation_hyvsj_iwse1_952",
60
+ "notifications": "awsui_notifications_hyvsj_iwse1_227",
61
+ "split-panel-bottom": "awsui_split-panel-bottom_hyvsj_iwse1_1019",
62
+ "position-bottom": "awsui_position-bottom_hyvsj_iwse1_1065",
63
+ "openSplitPanelBottom": "awsui_openSplitPanelBottom_hyvsj_iwse1_1",
64
+ "split-panel-side": "awsui_split-panel-side_hyvsj_iwse1_1094",
65
+ "position-side": "awsui_position-side_hyvsj_iwse1_1122",
66
+ "openSplitPanelSide": "awsui_openSplitPanelSide_hyvsj_iwse1_1",
67
+ "tools-container": "awsui_tools-container_hyvsj_iwse1_1159",
68
+ "tools": "awsui_tools_hyvsj_iwse1_1159",
69
+ "openTools": "awsui_openTools_hyvsj_iwse1_1",
70
+ "has-tools-form-persistence": "awsui_has-tools-form-persistence_hyvsj_iwse1_1253",
71
+ "hide-tools": "awsui_hide-tools_hyvsj_iwse1_1263",
72
+ "show-tools": "awsui_show-tools_hyvsj_iwse1_1275",
73
+ "has-tools-form": "awsui_has-tools-form_hyvsj_iwse1_1253",
74
+ "trigger": "awsui_trigger_hyvsj_iwse1_1342",
75
+ "selected": "awsui_selected_hyvsj_iwse1_1381"
76
76
  };
77
77
 
@@ -1 +1 @@
1
- {"version":3,"file":"tools.d.ts","sourceRoot":"lib/default/","sources":["app-layout/visual-refresh/tools.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,UAAU,UAAU;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAAE,QAAQ,EAAE,EAAE,UAAU,sBA+HrD;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,QAAQ,EAAE,OAAO,EAAE,cAAc,CAAC,EAAE,OAAO,WAU/E"}
1
+ {"version":3,"file":"tools.d.ts","sourceRoot":"lib/default/","sources":["app-layout/visual-refresh/tools.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,UAAU,UAAU;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAAE,QAAQ,EAAE,EAAE,UAAU,sBAiIrD;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,QAAQ,EAAE,OAAO,EAAE,cAAc,CAAC,EAAE,OAAO,WAU/E"}
@@ -19,7 +19,7 @@ import customCssProps from '../../internal/generated/custom-css-properties';
19
19
  * split panel in large viewports;
20
20
  */
21
21
  export default function Tools({ children }) {
22
- const { ariaLabels, drawers, handleSplitPanelClick, handleToolsClick, hasDefaultToolsWidth, hasDrawerViewportOverlay, isMobile, isSplitPanelOpen, isToolsOpen, loseToolsFocus, splitPanelDisplayed, splitPanelPosition, splitPanelRefs, splitPanelToggle, tools, toolsHide, toolsRefs, toolsWidth, } = useAppLayoutInternals();
22
+ const { ariaLabels, disableBodyScroll, drawers, handleSplitPanelClick, handleToolsClick, hasDefaultToolsWidth, hasDrawerViewportOverlay, isMobile, isSplitPanelOpen, isToolsOpen, loseToolsFocus, splitPanelDisplayed, splitPanelPosition, splitPanelRefs, splitPanelToggle, tools, toolsHide, toolsRefs, toolsWidth, } = useAppLayoutInternals();
23
23
  const hasSplitPanel = getSplitPanelStatus(splitPanelDisplayed, splitPanelPosition);
24
24
  const hasToolsForm = getToolsFormStatus(hasSplitPanel, isMobile, isSplitPanelOpen, isToolsOpen, toolsHide);
25
25
  const hasToolsFormPersistence = getToolsFormPersistence(hasSplitPanel, isSplitPanelOpen, isToolsOpen, toolsHide);
@@ -34,8 +34,9 @@ export default function Tools({ children }) {
34
34
  return (React.createElement(Transition, { in: isToolsOpen !== null && isToolsOpen !== void 0 ? isToolsOpen : false }, (state, transitionEventsRef) => {
35
35
  var _a, _b, _c;
36
36
  return (React.createElement("div", { className: clsx(styles['tools-container'], {
37
- [testutilStyles['drawer-closed']]: !isToolsOpen,
37
+ [styles['disable-body-scroll']]: disableBodyScroll,
38
38
  [styles.unfocusable]: isUnfocusable,
39
+ [testutilStyles['drawer-closed']]: !isToolsOpen,
39
40
  }), style: {
40
41
  [customCssProps.toolsAnimationStartingOpacity]: `${hasSplitPanel && isSplitPanelOpen ? 1 : 0}`,
41
42
  // Overwrite the default tools width (depends on breakpoints) only when the `toolsWidth` property has been set.
@@ -1 +1 @@
1
- {"version":3,"file":"tools.js","sourceRoot":"lib/default/","sources":["app-layout/visual-refresh/tools.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';\nimport { InternalButton } from '../../button/internal';\nimport { useAppLayoutInternals } from './context';\nimport TriggerButton from './trigger-button';\nimport styles from './styles.css.js';\nimport splitPanelStyles from '../../split-panel/styles.css.js';\nimport testutilStyles from '../test-classes/styles.css.js';\nimport { Transition } from '../../internal/components/transition';\nimport customCssProps from '../../internal/generated/custom-css-properties';\n\ninterface ToolsProps {\n children: React.ReactNode;\n}\n\n/**\n * The Tools component consists of the following elements:\n * the container, or root element, that sits as a direct child to the Layout grid definition;\n * the split panel, which exists only if there is a split panel in side position;\n * the tools, or drawer, that contains the hide tools form and the children passed through the API;\n * the show tools form that contains the triggers for both the drawer and the\n * split panel in large viewports;\n */\nexport default function Tools({ children }: ToolsProps) {\n const {\n ariaLabels,\n drawers,\n handleSplitPanelClick,\n handleToolsClick,\n hasDefaultToolsWidth,\n hasDrawerViewportOverlay,\n isMobile,\n isSplitPanelOpen,\n isToolsOpen,\n loseToolsFocus,\n splitPanelDisplayed,\n splitPanelPosition,\n splitPanelRefs,\n splitPanelToggle,\n tools,\n toolsHide,\n toolsRefs,\n toolsWidth,\n } = useAppLayoutInternals();\n\n const hasSplitPanel = getSplitPanelStatus(splitPanelDisplayed, splitPanelPosition);\n const hasToolsForm = getToolsFormStatus(hasSplitPanel, isMobile, isSplitPanelOpen, isToolsOpen, toolsHide);\n const hasToolsFormPersistence = getToolsFormPersistence(hasSplitPanel, isSplitPanelOpen, isToolsOpen, toolsHide);\n const isUnfocusable = hasDrawerViewportOverlay && !isToolsOpen;\n\n /**\n * If the drawers property is defined the Tools and SplitPanel will be mounted and rendered\n * by the Drawers component.\n */\n if ((toolsHide && !hasSplitPanel) || drawers) {\n return null;\n }\n\n return (\n <Transition in={isToolsOpen ?? false}>\n {(state, transitionEventsRef) => (\n <div\n className={clsx(styles['tools-container'], {\n [testutilStyles['drawer-closed']]: !isToolsOpen,\n [styles.unfocusable]: isUnfocusable,\n })}\n style={{\n [customCssProps.toolsAnimationStartingOpacity]: `${hasSplitPanel && isSplitPanelOpen ? 1 : 0}`,\n // Overwrite the default tools width (depends on breakpoints) only when the `toolsWidth` property has been set.\n [customCssProps.toolsWidth]: hasDefaultToolsWidth ? '' : `${toolsWidth}px`,\n }}\n onBlur={e => {\n if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n loseToolsFocus();\n }\n }}\n >\n {children}\n\n {!toolsHide && (\n <aside\n aria-hidden={!isToolsOpen ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(\n styles.tools,\n {\n [styles.animating]: state === 'entering',\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n [styles['is-tools-open']]: isToolsOpen,\n },\n testutilStyles.tools\n )}\n ref={state !== 'exiting' ? transitionEventsRef : undefined}\n >\n <div className={clsx(styles['animated-content'])}>\n <div className={clsx(styles['hide-tools'])}>\n <InternalButton\n ariaLabel={ariaLabels?.toolsClose ?? undefined}\n iconName={isMobile ? 'close' : 'angle-right'}\n onClick={() => handleToolsClick(false)}\n variant=\"icon\"\n formAction=\"none\"\n className={testutilStyles['tools-close']}\n ref={toolsRefs.close}\n />\n </div>\n\n {tools}\n </div>\n </aside>\n )}\n\n {!isMobile && (\n <aside\n aria-hidden={!hasToolsForm ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(styles['show-tools'], {\n [styles.animating]: state === 'exiting',\n [styles['has-tools-form']]: hasToolsForm,\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n })}\n ref={state === 'exiting' ? transitionEventsRef : undefined}\n >\n {!toolsHide && (\n <TriggerButton\n ariaLabel={ariaLabels?.toolsToggle}\n iconName=\"status-info\"\n onClick={() => handleToolsClick(!isToolsOpen)}\n selected={hasSplitPanel && isToolsOpen}\n className={testutilStyles['tools-toggle']}\n ref={toolsRefs.toggle}\n />\n )}\n\n {hasSplitPanel && splitPanelToggle.displayed && (\n <TriggerButton\n ariaLabel={splitPanelToggle.ariaLabel}\n iconName=\"view-vertical\"\n onClick={() => handleSplitPanelClick()}\n selected={hasSplitPanel && isSplitPanelOpen}\n className={splitPanelStyles['open-button']}\n ref={splitPanelRefs.toggle}\n />\n )}\n </aside>\n )}\n </div>\n )}\n </Transition>\n );\n}\n\n/**\n * Determine the default state of the Tools component. Mobile viewports should be\n * closed by default under all circumstances. If the toolsOpen prop has not been\n * set then it should be closed as well. Otherwise, default to the toolsOpen prop.\n */\nexport function getToolsDefaultState(isMobile: boolean, stateFromProps?: boolean) {\n let isToolsOpen;\n\n if (isMobile || stateFromProps === undefined) {\n isToolsOpen = false;\n } else {\n isToolsOpen = stateFromProps;\n }\n\n return isToolsOpen;\n}\n\n/**\n * This simple function returns the presence of the split panel as a child of the\n * Tools component. It must exist and be in side position.\n */\nfunction getSplitPanelStatus(splitPanelDisplayed: boolean, splitPanelPosition: string) {\n return splitPanelDisplayed && splitPanelPosition === 'side' ? true : false;\n}\n\n/**\n * By default the Tools form is styled as display: none; This behavior should\n * be unchanged in mobile viewports where the Tools form is always suppressed.\n * In large viewports, however the Tools form and its corresponding buttons\n * should be present in the UI under the below circumstances.\n */\nfunction getToolsFormStatus(\n hasSplitPanel: boolean,\n isMobile: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsForm = false;\n\n if (!isMobile) {\n // Both the Split Panel and Tools button are needed\n if (hasSplitPanel && !toolsHide) {\n hasToolsForm = true;\n }\n\n // The Split Panel button is needed\n if (hasSplitPanel && !isSplitPanelOpen && toolsHide) {\n hasToolsForm = true;\n }\n\n // The Tools button is needed\n if (!hasSplitPanel && !toolsHide && !isToolsOpen) {\n hasToolsForm = true;\n }\n }\n\n return hasToolsForm;\n}\n\n/**\n * Under two scenarios the Tools form that contains the triggers\n * for the Tools content and the Split Panel may be persistent\n * in the UI (as opposed to disappearing when one of the drawers\n * is open). This will also add a white background as opposed to the\n * default transparent background. The buttons will present and in a\n * selected / not selected state.\n */\nfunction getToolsFormPersistence(\n hasSplitPanel: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsFormPersistence = false;\n\n // Both Tools and Split Panel exist and one or both is open\n if (hasSplitPanel && !toolsHide && (isSplitPanelOpen || isToolsOpen)) {\n hasToolsFormPersistence = true;\n }\n\n return hasToolsFormPersistence;\n}\n"]}
1
+ {"version":3,"file":"tools.js","sourceRoot":"lib/default/","sources":["app-layout/visual-refresh/tools.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';\nimport { InternalButton } from '../../button/internal';\nimport { useAppLayoutInternals } from './context';\nimport TriggerButton from './trigger-button';\nimport styles from './styles.css.js';\nimport splitPanelStyles from '../../split-panel/styles.css.js';\nimport testutilStyles from '../test-classes/styles.css.js';\nimport { Transition } from '../../internal/components/transition';\nimport customCssProps from '../../internal/generated/custom-css-properties';\n\ninterface ToolsProps {\n children: React.ReactNode;\n}\n\n/**\n * The Tools component consists of the following elements:\n * the container, or root element, that sits as a direct child to the Layout grid definition;\n * the split panel, which exists only if there is a split panel in side position;\n * the tools, or drawer, that contains the hide tools form and the children passed through the API;\n * the show tools form that contains the triggers for both the drawer and the\n * split panel in large viewports;\n */\nexport default function Tools({ children }: ToolsProps) {\n const {\n ariaLabels,\n disableBodyScroll,\n drawers,\n handleSplitPanelClick,\n handleToolsClick,\n hasDefaultToolsWidth,\n hasDrawerViewportOverlay,\n isMobile,\n isSplitPanelOpen,\n isToolsOpen,\n loseToolsFocus,\n splitPanelDisplayed,\n splitPanelPosition,\n splitPanelRefs,\n splitPanelToggle,\n tools,\n toolsHide,\n toolsRefs,\n toolsWidth,\n } = useAppLayoutInternals();\n\n const hasSplitPanel = getSplitPanelStatus(splitPanelDisplayed, splitPanelPosition);\n const hasToolsForm = getToolsFormStatus(hasSplitPanel, isMobile, isSplitPanelOpen, isToolsOpen, toolsHide);\n const hasToolsFormPersistence = getToolsFormPersistence(hasSplitPanel, isSplitPanelOpen, isToolsOpen, toolsHide);\n const isUnfocusable = hasDrawerViewportOverlay && !isToolsOpen;\n\n /**\n * If the drawers property is defined the Tools and SplitPanel will be mounted and rendered\n * by the Drawers component.\n */\n if ((toolsHide && !hasSplitPanel) || drawers) {\n return null;\n }\n\n return (\n <Transition in={isToolsOpen ?? false}>\n {(state, transitionEventsRef) => (\n <div\n className={clsx(styles['tools-container'], {\n [styles['disable-body-scroll']]: disableBodyScroll,\n [styles.unfocusable]: isUnfocusable,\n [testutilStyles['drawer-closed']]: !isToolsOpen,\n })}\n style={{\n [customCssProps.toolsAnimationStartingOpacity]: `${hasSplitPanel && isSplitPanelOpen ? 1 : 0}`,\n // Overwrite the default tools width (depends on breakpoints) only when the `toolsWidth` property has been set.\n [customCssProps.toolsWidth]: hasDefaultToolsWidth ? '' : `${toolsWidth}px`,\n }}\n onBlur={e => {\n if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n loseToolsFocus();\n }\n }}\n >\n {children}\n\n {!toolsHide && (\n <aside\n aria-hidden={!isToolsOpen ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(\n styles.tools,\n {\n [styles.animating]: state === 'entering',\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n [styles['is-tools-open']]: isToolsOpen,\n },\n testutilStyles.tools\n )}\n ref={state !== 'exiting' ? transitionEventsRef : undefined}\n >\n <div className={clsx(styles['animated-content'])}>\n <div className={clsx(styles['hide-tools'])}>\n <InternalButton\n ariaLabel={ariaLabels?.toolsClose ?? undefined}\n iconName={isMobile ? 'close' : 'angle-right'}\n onClick={() => handleToolsClick(false)}\n variant=\"icon\"\n formAction=\"none\"\n className={testutilStyles['tools-close']}\n ref={toolsRefs.close}\n />\n </div>\n\n {tools}\n </div>\n </aside>\n )}\n\n {!isMobile && (\n <aside\n aria-hidden={!hasToolsForm ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(styles['show-tools'], {\n [styles.animating]: state === 'exiting',\n [styles['has-tools-form']]: hasToolsForm,\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n })}\n ref={state === 'exiting' ? transitionEventsRef : undefined}\n >\n {!toolsHide && (\n <TriggerButton\n ariaLabel={ariaLabels?.toolsToggle}\n iconName=\"status-info\"\n onClick={() => handleToolsClick(!isToolsOpen)}\n selected={hasSplitPanel && isToolsOpen}\n className={testutilStyles['tools-toggle']}\n ref={toolsRefs.toggle}\n />\n )}\n\n {hasSplitPanel && splitPanelToggle.displayed && (\n <TriggerButton\n ariaLabel={splitPanelToggle.ariaLabel}\n iconName=\"view-vertical\"\n onClick={() => handleSplitPanelClick()}\n selected={hasSplitPanel && isSplitPanelOpen}\n className={splitPanelStyles['open-button']}\n ref={splitPanelRefs.toggle}\n />\n )}\n </aside>\n )}\n </div>\n )}\n </Transition>\n );\n}\n\n/**\n * Determine the default state of the Tools component. Mobile viewports should be\n * closed by default under all circumstances. If the toolsOpen prop has not been\n * set then it should be closed as well. Otherwise, default to the toolsOpen prop.\n */\nexport function getToolsDefaultState(isMobile: boolean, stateFromProps?: boolean) {\n let isToolsOpen;\n\n if (isMobile || stateFromProps === undefined) {\n isToolsOpen = false;\n } else {\n isToolsOpen = stateFromProps;\n }\n\n return isToolsOpen;\n}\n\n/**\n * This simple function returns the presence of the split panel as a child of the\n * Tools component. It must exist and be in side position.\n */\nfunction getSplitPanelStatus(splitPanelDisplayed: boolean, splitPanelPosition: string) {\n return splitPanelDisplayed && splitPanelPosition === 'side' ? true : false;\n}\n\n/**\n * By default the Tools form is styled as display: none; This behavior should\n * be unchanged in mobile viewports where the Tools form is always suppressed.\n * In large viewports, however the Tools form and its corresponding buttons\n * should be present in the UI under the below circumstances.\n */\nfunction getToolsFormStatus(\n hasSplitPanel: boolean,\n isMobile: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsForm = false;\n\n if (!isMobile) {\n // Both the Split Panel and Tools button are needed\n if (hasSplitPanel && !toolsHide) {\n hasToolsForm = true;\n }\n\n // The Split Panel button is needed\n if (hasSplitPanel && !isSplitPanelOpen && toolsHide) {\n hasToolsForm = true;\n }\n\n // The Tools button is needed\n if (!hasSplitPanel && !toolsHide && !isToolsOpen) {\n hasToolsForm = true;\n }\n }\n\n return hasToolsForm;\n}\n\n/**\n * Under two scenarios the Tools form that contains the triggers\n * for the Tools content and the Split Panel may be persistent\n * in the UI (as opposed to disappearing when one of the drawers\n * is open). This will also add a white background as opposed to the\n * default transparent background. The buttons will present and in a\n * selected / not selected state.\n */\nfunction getToolsFormPersistence(\n hasSplitPanel: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsFormPersistence = false;\n\n // Both Tools and Split Panel exist and one or both is open\n if (hasSplitPanel && !toolsHide && (isSplitPanelOpen || isToolsOpen)) {\n hasToolsFormPersistence = true;\n }\n\n return hasToolsFormPersistence;\n}\n"]}
@@ -1,6 +1,6 @@
1
1
 
2
2
  export var PACKAGE_SOURCE = 'components';
3
- export var PACKAGE_VERSION = '3.0.0 (9d598e6)';
3
+ export var PACKAGE_VERSION = '3.0.0 (7bf7790)';
4
4
  export var THEME = 'open-source-visual-refresh';
5
5
  export var ALWAYS_VISUAL_REFRESH = true;
6
6
 
@@ -1,3 +1,3 @@
1
1
  {
2
- "commit": "9d598e695592cf3cedfdbf29547d77a21a8c4ce8"
2
+ "commit": "7bf7790b6fc8a0d9a81ba5779df51f783da094f2"
3
3
  }
package/package.json CHANGED
@@ -109,7 +109,7 @@
109
109
  "./internal/base-component/index.js",
110
110
  "./internal/base-component/styles.css.js"
111
111
  ],
112
- "version": "3.0.257",
112
+ "version": "3.0.259",
113
113
  "repository": {
114
114
  "type": "git",
115
115
  "url": "https://github.com/cloudscape-design/components.git"
@@ -1,23 +1,23 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "body-cell": "awsui_body-cell_c6tup_1tfsn_93",
5
- "body-cell-wrap": "awsui_body-cell-wrap_c6tup_1tfsn_102",
6
- "is-visual-refresh": "awsui_is-visual-refresh_c6tup_1tfsn_114",
7
- "has-striped-rows": "awsui_has-striped-rows_c6tup_1tfsn_126",
8
- "body-cell-edit-active": "awsui_body-cell-edit-active_c6tup_1tfsn_129",
9
- "body-cell-editable": "awsui_body-cell-editable_c6tup_1tfsn_129",
10
- "has-selection": "awsui_has-selection_c6tup_1tfsn_135",
11
- "body-cell-first-row": "awsui_body-cell-first-row_c6tup_1tfsn_141",
12
- "body-cell-last-row": "awsui_body-cell-last-row_c6tup_1tfsn_144",
13
- "body-cell-selected": "awsui_body-cell-selected_c6tup_1tfsn_144",
14
- "has-footer": "awsui_has-footer_c6tup_1tfsn_144",
15
- "body-cell-shaded": "awsui_body-cell-shaded_c6tup_1tfsn_154",
16
- "body-cell-next-selected": "awsui_body-cell-next-selected_c6tup_1tfsn_176",
17
- "body-cell-prev-selected": "awsui_body-cell-prev-selected_c6tup_1tfsn_180",
18
- "body-cell-editor": "awsui_body-cell-editor_c6tup_1tfsn_204",
19
- "body-cell-editor-form": "awsui_body-cell-editor-form_c6tup_1tfsn_226",
20
- "body-cell-editor-row": "awsui_body-cell-editor-row_c6tup_1tfsn_235",
21
- "body-cell-editor-controls": "awsui_body-cell-editor-controls_c6tup_1tfsn_245"
4
+ "body-cell": "awsui_body-cell_c6tup_8svdc_93",
5
+ "body-cell-wrap": "awsui_body-cell-wrap_c6tup_8svdc_102",
6
+ "is-visual-refresh": "awsui_is-visual-refresh_c6tup_8svdc_114",
7
+ "has-striped-rows": "awsui_has-striped-rows_c6tup_8svdc_126",
8
+ "body-cell-edit-active": "awsui_body-cell-edit-active_c6tup_8svdc_129",
9
+ "body-cell-editable": "awsui_body-cell-editable_c6tup_8svdc_129",
10
+ "has-selection": "awsui_has-selection_c6tup_8svdc_135",
11
+ "body-cell-first-row": "awsui_body-cell-first-row_c6tup_8svdc_141",
12
+ "body-cell-last-row": "awsui_body-cell-last-row_c6tup_8svdc_144",
13
+ "body-cell-selected": "awsui_body-cell-selected_c6tup_8svdc_144",
14
+ "has-footer": "awsui_has-footer_c6tup_8svdc_144",
15
+ "body-cell-shaded": "awsui_body-cell-shaded_c6tup_8svdc_154",
16
+ "body-cell-next-selected": "awsui_body-cell-next-selected_c6tup_8svdc_176",
17
+ "body-cell-prev-selected": "awsui_body-cell-prev-selected_c6tup_8svdc_180",
18
+ "body-cell-editor": "awsui_body-cell-editor_c6tup_8svdc_204",
19
+ "body-cell-editor-form": "awsui_body-cell-editor-form_c6tup_8svdc_226",
20
+ "body-cell-editor-row": "awsui_body-cell-editor-row_c6tup_8svdc_235",
21
+ "body-cell-editor-controls": "awsui_body-cell-editor-controls_c6tup_8svdc_245"
22
22
  };
23
23
 
@@ -90,7 +90,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
90
90
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
91
91
  SPDX-License-Identifier: Apache-2.0
92
92
  */
93
- .awsui_body-cell_c6tup_1tfsn_93:not(#\9) {
93
+ .awsui_body-cell_c6tup_8svdc_93:not(#\9) {
94
94
  box-sizing: border-box;
95
95
  padding: var(--space-scaled-xs-6859qs, 8px) var(--space-scaled-l-t03y3z, 20px) calc(
96
96
  var(--space-scaled-xs-6859qs, 8px) + (var(--border-item-width-qbbbsa, 2px) - var(--border-divider-list-width-hacikr, 1px))
@@ -99,19 +99,19 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
99
99
  word-wrap: break-word;
100
100
  border-bottom: var(--border-divider-list-width-hacikr, 1px) solid var(--color-border-divider-default-7s2wjw, #e9ebed);
101
101
  }
102
- .awsui_body-cell_c6tup_1tfsn_93:not(#\9):not(.awsui_body-cell-wrap_c6tup_1tfsn_102) {
102
+ .awsui_body-cell_c6tup_8svdc_93:not(#\9):not(.awsui_body-cell-wrap_c6tup_8svdc_102) {
103
103
  white-space: nowrap;
104
104
  overflow: hidden;
105
105
  text-overflow: ellipsis;
106
106
  }
107
- .awsui_body-cell_c6tup_1tfsn_93:not(#\9):first-child {
107
+ .awsui_body-cell_c6tup_8svdc_93:not(#\9):first-child {
108
108
  border-left: var(--border-item-width-qbbbsa, 2px) solid transparent;
109
109
  }
110
- .awsui_body-cell_c6tup_1tfsn_93:not(#\9):last-child {
110
+ .awsui_body-cell_c6tup_8svdc_93:not(#\9):last-child {
111
111
  border-right: var(--border-item-width-qbbbsa, 2px) solid transparent;
112
112
  padding-right: calc(var(--space-l-4vl6xu, 20px) - var(--border-item-width-qbbbsa, 2px));
113
113
  }
114
- .awsui_body-cell_c6tup_1tfsn_93.awsui_is-visual-refresh_c6tup_1tfsn_114:not(#\9):first-child {
114
+ .awsui_body-cell_c6tup_8svdc_93.awsui_is-visual-refresh_c6tup_8svdc_114:not(#\9):first-child {
115
115
  /*
116
116
  Striped rows requires additional left padding because the
117
117
  shaded background makes the child content appear too close
@@ -123,85 +123,85 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
123
123
  that the placeholder border would consume.
124
124
  */
125
125
  }
126
- .awsui_body-cell_c6tup_1tfsn_93.awsui_is-visual-refresh_c6tup_1tfsn_114:not(#\9):first-child:not(.awsui_has-striped-rows_c6tup_1tfsn_126) {
126
+ .awsui_body-cell_c6tup_8svdc_93.awsui_is-visual-refresh_c6tup_8svdc_114:not(#\9):first-child:not(.awsui_has-striped-rows_c6tup_8svdc_126) {
127
127
  padding-left: var(--space-xxxs-k2w98v, 2px);
128
128
  }
129
- .awsui_body-cell_c6tup_1tfsn_93.awsui_is-visual-refresh_c6tup_1tfsn_114:not(#\9):first-child:not(.awsui_has-striped-rows_c6tup_1tfsn_126):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129).awsui_body-cell-editable_c6tup_1tfsn_129:hover {
129
+ .awsui_body-cell_c6tup_8svdc_93.awsui_is-visual-refresh_c6tup_8svdc_114:not(#\9):first-child:not(.awsui_has-striped-rows_c6tup_8svdc_126):not(.awsui_body-cell-edit-active_c6tup_8svdc_129).awsui_body-cell-editable_c6tup_8svdc_129:hover {
130
130
  padding-left: calc(var(--space-xxxs-k2w98v, 2px) + var(--border-divider-list-width-hacikr, 1px));
131
131
  }
132
- .awsui_body-cell_c6tup_1tfsn_93.awsui_is-visual-refresh_c6tup_1tfsn_114:not(#\9):first-child:first-child.awsui_has-striped-rows_c6tup_1tfsn_126 {
132
+ .awsui_body-cell_c6tup_8svdc_93.awsui_is-visual-refresh_c6tup_8svdc_114:not(#\9):first-child:first-child.awsui_has-striped-rows_c6tup_8svdc_126 {
133
133
  padding-left: var(--space-xxs-ynfts5, 4px);
134
134
  }
135
- .awsui_body-cell_c6tup_1tfsn_93.awsui_is-visual-refresh_c6tup_1tfsn_114:not(#\9):first-child:not(.awsui_has-selection_c6tup_1tfsn_135):not(.awsui_body-cell-editable_c6tup_1tfsn_129) {
135
+ .awsui_body-cell_c6tup_8svdc_93.awsui_is-visual-refresh_c6tup_8svdc_114:not(#\9):first-child:not(.awsui_has-selection_c6tup_8svdc_135):not(.awsui_body-cell-editable_c6tup_8svdc_129) {
136
136
  border-left: none;
137
137
  }
138
- .awsui_body-cell_c6tup_1tfsn_93:not(#\9):first-child:not(.awsui_is-visual-refresh_c6tup_1tfsn_114) {
138
+ .awsui_body-cell_c6tup_8svdc_93:not(#\9):first-child:not(.awsui_is-visual-refresh_c6tup_8svdc_114) {
139
139
  padding-left: calc(var(--space-l-4vl6xu, 20px) - var(--border-item-width-qbbbsa, 2px));
140
140
  }
141
- .awsui_body-cell-first-row_c6tup_1tfsn_141:not(#\9) {
141
+ .awsui_body-cell-first-row_c6tup_8svdc_141:not(#\9) {
142
142
  border-top: var(--border-item-width-qbbbsa, 2px) solid transparent;
143
143
  }
144
- .awsui_body-cell-last-row_c6tup_1tfsn_144:not(#\9):not(.awsui_body-cell-selected_c6tup_1tfsn_144):not(.awsui_has-footer_c6tup_1tfsn_144) {
144
+ .awsui_body-cell-last-row_c6tup_8svdc_144:not(#\9):not(.awsui_body-cell-selected_c6tup_8svdc_144):not(.awsui_has-footer_c6tup_8svdc_144) {
145
145
  border-bottom: var(--border-item-width-qbbbsa, 2px) solid transparent;
146
146
  }
147
- .awsui_body-cell-last-row_c6tup_1tfsn_144:not(#\9):not(.awsui_body-cell-selected_c6tup_1tfsn_144).awsui_has-footer_c6tup_1tfsn_144 {
147
+ .awsui_body-cell-last-row_c6tup_8svdc_144:not(#\9):not(.awsui_body-cell-selected_c6tup_8svdc_144).awsui_has-footer_c6tup_8svdc_144 {
148
148
  /*
149
149
  Add a bottom border to the body cells of the last row as a separator between the
150
150
  table and the footer
151
151
  */
152
152
  border-bottom: var(--border-divider-section-width-4wm2it, 2px) solid var(--color-border-divider-default-7s2wjw, #e9ebed);
153
153
  }
154
- .awsui_body-cell-shaded_c6tup_1tfsn_154:not(#\9) {
154
+ .awsui_body-cell-shaded_c6tup_8svdc_154:not(#\9) {
155
155
  background: var(--color-background-cell-shaded-26ubfj, #f8f8f8);
156
156
  }
157
- .awsui_body-cell-selected_c6tup_1tfsn_144:not(#\9) {
157
+ .awsui_body-cell-selected_c6tup_8svdc_144:not(#\9) {
158
158
  background-color: var(--color-background-item-selected-ebt4bi, #f2f8fd);
159
159
  border-top: var(--border-item-width-qbbbsa, 2px) solid var(--color-border-item-selected-ppkssz, #0972d3);
160
160
  border-bottom: var(--border-item-width-qbbbsa, 2px) solid var(--color-border-item-selected-ppkssz, #0972d3);
161
161
  padding-bottom: var(--space-scaled-xs-6859qs, 8px);
162
162
  }
163
- .awsui_body-cell-selected_c6tup_1tfsn_144:not(#\9):first-child {
163
+ .awsui_body-cell-selected_c6tup_8svdc_144:not(#\9):first-child {
164
164
  border-left: var(--border-item-width-qbbbsa, 2px) solid var(--color-border-item-selected-ppkssz, #0972d3);
165
165
  border-radius: var(--border-radius-item-u2ibpi, 8px) 0 0 var(--border-radius-item-u2ibpi, 8px);
166
166
  }
167
- .awsui_body-cell-selected_c6tup_1tfsn_144:not(#\9):last-child {
167
+ .awsui_body-cell-selected_c6tup_8svdc_144:not(#\9):last-child {
168
168
  border-right: var(--border-item-width-qbbbsa, 2px) solid var(--color-border-item-selected-ppkssz, #0972d3);
169
169
  border-radius: 0 var(--border-radius-item-u2ibpi, 8px) var(--border-radius-item-u2ibpi, 8px) 0;
170
170
  }
171
- .awsui_body-cell-selected_c6tup_1tfsn_144:not(#\9):not(:first-child) {
171
+ .awsui_body-cell-selected_c6tup_8svdc_144:not(#\9):not(:first-child) {
172
172
  padding-top: calc(
173
173
  var(--space-scaled-xs-6859qs, 8px) + (var(--border-item-width-qbbbsa, 2px) - var(--border-divider-list-width-hacikr, 1px))
174
174
  );
175
175
  }
176
- .awsui_body-cell_c6tup_1tfsn_93:not(#\9):not(.awsui_body-cell-selected_c6tup_1tfsn_144).awsui_body-cell-next-selected_c6tup_1tfsn_176 {
176
+ .awsui_body-cell_c6tup_8svdc_93:not(#\9):not(.awsui_body-cell-selected_c6tup_8svdc_144).awsui_body-cell-next-selected_c6tup_8svdc_176 {
177
177
  border-bottom: 0;
178
178
  padding-bottom: calc(var(--space-scaled-xs-6859qs, 8px) + var(--border-divider-list-width-hacikr, 1px));
179
179
  }
180
- .awsui_body-cell-selected_c6tup_1tfsn_144.awsui_body-cell-prev-selected_c6tup_1tfsn_180:not(#\9) {
180
+ .awsui_body-cell-selected_c6tup_8svdc_144.awsui_body-cell-prev-selected_c6tup_8svdc_180:not(#\9) {
181
181
  padding-top: calc(
182
182
  var(--space-scaled-xs-6859qs, 8px) + (var(--border-item-width-qbbbsa, 2px) - var(--border-divider-list-width-hacikr, 1px))
183
183
  );
184
184
  border-top: var(--border-divider-list-width-hacikr, 1px) solid var(--color-border-item-placeholder-jgzhnb, #0972d3);
185
185
  }
186
- .awsui_body-cell-selected_c6tup_1tfsn_144.awsui_body-cell-next-selected_c6tup_1tfsn_176:not(#\9) {
186
+ .awsui_body-cell-selected_c6tup_8svdc_144.awsui_body-cell-next-selected_c6tup_8svdc_176:not(#\9) {
187
187
  border-bottom-width: var(--border-divider-list-width-hacikr, 1px);
188
188
  }
189
- .awsui_body-cell-selected_c6tup_1tfsn_144.awsui_body-cell-next-selected_c6tup_1tfsn_176:not(#\9):first-child {
189
+ .awsui_body-cell-selected_c6tup_8svdc_144.awsui_body-cell-next-selected_c6tup_8svdc_176:not(#\9):first-child {
190
190
  border-bottom-left-radius: 0;
191
191
  }
192
- .awsui_body-cell-selected_c6tup_1tfsn_144.awsui_body-cell-next-selected_c6tup_1tfsn_176:not(#\9):last-child {
192
+ .awsui_body-cell-selected_c6tup_8svdc_144.awsui_body-cell-next-selected_c6tup_8svdc_176:not(#\9):last-child {
193
193
  border-bottom-right-radius: 0;
194
194
  }
195
- .awsui_body-cell-selected_c6tup_1tfsn_144.awsui_body-cell-prev-selected_c6tup_1tfsn_180:not(#\9):first-child {
195
+ .awsui_body-cell-selected_c6tup_8svdc_144.awsui_body-cell-prev-selected_c6tup_8svdc_180:not(#\9):first-child {
196
196
  border-top-left-radius: 0;
197
197
  }
198
- .awsui_body-cell-selected_c6tup_1tfsn_144.awsui_body-cell-prev-selected_c6tup_1tfsn_180:not(#\9):last-child {
198
+ .awsui_body-cell-selected_c6tup_8svdc_144.awsui_body-cell-prev-selected_c6tup_8svdc_180:not(#\9):last-child {
199
199
  border-top-right-radius: 0;
200
200
  }
201
- .awsui_body-cell-selected_c6tup_1tfsn_144:not(#\9):not(.awsui_body-cell-prev-selected_c6tup_1tfsn_180) {
201
+ .awsui_body-cell-selected_c6tup_8svdc_144:not(#\9):not(.awsui_body-cell-prev-selected_c6tup_8svdc_180) {
202
202
  padding-top: var(--space-scaled-xs-6859qs, 8px);
203
203
  }
204
- .awsui_body-cell-editor_c6tup_1tfsn_204:not(#\9) {
204
+ .awsui_body-cell-editor_c6tup_8svdc_204:not(#\9) {
205
205
  top: 0;
206
206
  right: 0;
207
207
  bottom: 0;
@@ -217,45 +217,67 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
217
217
  padding-right: calc(var(--space-xs-rsr2qu, 8px) + var(--space-xxs-ynfts5, 4px));
218
218
  color: var(--color-text-button-normal-default-u8647m, #0972d3);
219
219
  }
220
- .awsui_body-cell-editor_c6tup_1tfsn_204:not(#\9):hover {
220
+ .awsui_body-cell-editor_c6tup_8svdc_204:not(#\9):hover {
221
221
  color: var(--color-text-button-normal-hover-kxmvcc, #033160);
222
222
  }
223
- .awsui_body-cell-editor_c6tup_1tfsn_204:not(#\9):active {
223
+ .awsui_body-cell-editor_c6tup_8svdc_204:not(#\9):active {
224
224
  color: var(--color-text-button-normal-active-6obrzh, #033160);
225
225
  }
226
- .awsui_body-cell-editor-form_c6tup_1tfsn_226:not(#\9) {
226
+ .awsui_body-cell-editor-form_c6tup_8svdc_226:not(#\9) {
227
227
  margin: calc(-1 * var(--space-xs-rsr2qu, 8px)) calc(-1.5 * var(--space-xs-rsr2qu, 8px));
228
228
  }
229
- .awsui_is-visual-refresh_c6tup_1tfsn_114.awsui_body-cell_c6tup_1tfsn_93:not(#\9):first-child.awsui_has-striped-rows_c6tup_1tfsn_126 > .awsui_body-cell-editor-form_c6tup_1tfsn_226 {
229
+ .awsui_is-visual-refresh_c6tup_8svdc_114.awsui_body-cell_c6tup_8svdc_93:not(#\9):first-child.awsui_has-striped-rows_c6tup_8svdc_126 > .awsui_body-cell-editor-form_c6tup_8svdc_226 {
230
230
  margin-left: calc(-1 * var(--space-xxs-ynfts5, 4px));
231
231
  }
232
- .awsui_is-visual-refresh_c6tup_1tfsn_114.awsui_body-cell_c6tup_1tfsn_93:not(#\9):first-child:not(.awsui_has-striped-rows_c6tup_1tfsn_126) > .awsui_body-cell-editor-form_c6tup_1tfsn_226 {
232
+ .awsui_is-visual-refresh_c6tup_8svdc_114.awsui_body-cell_c6tup_8svdc_93:not(#\9):first-child:not(.awsui_has-striped-rows_c6tup_8svdc_126) > .awsui_body-cell-editor-form_c6tup_8svdc_226 {
233
233
  margin-left: calc(-1 * var(--space-xxxs-k2w98v, 2px));
234
234
  }
235
- .awsui_body-cell-editor-row_c6tup_1tfsn_235:not(#\9) {
235
+ .awsui_body-cell-editor-row_c6tup_8svdc_235:not(#\9) {
236
236
  display: flex;
237
237
  flex-flow: row nowrap;
238
238
  align-items: center;
239
239
  justify-content: space-between;
240
240
  column-gap: var(--space-xxs-ynfts5, 4px);
241
241
  }
242
- .awsui_body-cell-editor-row_c6tup_1tfsn_235 > :not(#\9):not(:last-child) {
242
+ .awsui_body-cell-editor-row_c6tup_8svdc_235 > :not(#\9):not(:last-child) {
243
243
  flex-grow: 1;
244
244
  }
245
- .awsui_body-cell-editor-controls_c6tup_1tfsn_245:not(#\9) {
245
+ .awsui_body-cell-editor-controls_c6tup_8svdc_245:not(#\9) {
246
246
  flex-shrink: 0;
247
247
  }
248
- .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9) {
248
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9) {
249
249
  position: relative;
250
250
  cursor: pointer;
251
251
  }
252
- .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129.awsui_body-cell-edit-active_c6tup_1tfsn_129:not(#\9) {
252
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129.awsui_body-cell-edit-active_c6tup_8svdc_129:not(#\9) {
253
253
  overflow: visible;
254
254
  }
255
- .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129) > .awsui_body-cell-editor_c6tup_1tfsn_204 {
255
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129) > .awsui_body-cell-editor_c6tup_8svdc_204 {
256
256
  opacity: 0;
257
257
  }
258
- .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):hover {
258
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):focus-within {
259
+ padding-right: calc(var(--space-scaled-l-t03y3z, 20px) + var(--space-l-4vl6xu, 20px));
260
+ position: relative;
261
+ }
262
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):focus-within > .awsui_body-cell-editor_c6tup_8svdc_204 {
263
+ opacity: 1;
264
+ }
265
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):focus-within {
266
+ outline: 2px dotted transparent;
267
+ outline-offset: calc(calc(-1 * var(--space-scaled-xxs-95dhkm, 4px)) - 1px);
268
+ }
269
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):focus-within::before {
270
+ content: " ";
271
+ display: block;
272
+ position: absolute;
273
+ left: calc(-1 * calc(-1 * var(--space-scaled-xxs-95dhkm, 4px)));
274
+ top: calc(-1 * calc(-1 * var(--space-scaled-xxs-95dhkm, 4px)));
275
+ width: calc(100% + 2 * calc(-1 * var(--space-scaled-xxs-95dhkm, 4px)));
276
+ height: calc(100% + 2 * calc(-1 * var(--space-scaled-xxs-95dhkm, 4px)));
277
+ border-radius: var(--border-radius-control-default-focus-ring-7661kz, 4px);
278
+ box-shadow: 0 0 0 2px var(--color-border-item-focused-ap3b6s, #0972d3);
279
+ }
280
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):hover {
259
281
  position: relative;
260
282
  background-color: var(--color-background-dropdown-item-hover-mqsxkv, #f4f4f4);
261
283
  border: var(--border-divider-list-width-hacikr, 1px) solid var(--color-border-control-default-m3lmsh, #7d8998);
@@ -263,57 +285,35 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
263
285
  right: calc(-1 * var(--border-divider-list-width-hacikr, 1px));
264
286
  padding-right: calc(var(--space-scaled-l-t03y3z, 20px) + var(--space-l-4vl6xu, 20px));
265
287
  }
266
- .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):hover > .awsui_body-cell-editor_c6tup_1tfsn_204 {
288
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):hover > .awsui_body-cell-editor_c6tup_8svdc_204 {
267
289
  opacity: 1;
268
290
  }
269
- .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):hover:first-child {
291
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):hover:first-child {
270
292
  left: 0;
271
293
  right: 0;
272
294
  }
273
- .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):hover > .awsui_body-cell-editor_c6tup_1tfsn_204 {
295
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):hover > .awsui_body-cell-editor_c6tup_8svdc_204 {
274
296
  padding-right: calc(var(--space-xs-rsr2qu, 8px) + var(--space-xxs-ynfts5, 4px) - (2 * var(--border-divider-list-width-hacikr, 1px)));
275
297
  }
276
- .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):hover.awsui_body-cell-last-row_c6tup_1tfsn_144.awsui_body-cell-selected_c6tup_1tfsn_144, .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):hover.awsui_body-cell-next-selected_c6tup_1tfsn_176 {
298
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):hover.awsui_body-cell-last-row_c6tup_8svdc_144.awsui_body-cell-selected_c6tup_8svdc_144, .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):hover.awsui_body-cell-next-selected_c6tup_8svdc_176 {
277
299
  padding-top: calc(var(--space-scaled-xs-6859qs, 8px) - calc(var(--border-divider-list-width-hacikr, 1px) / 2));
278
300
  padding-bottom: calc(var(--space-scaled-xs-6859qs, 8px) - calc(var(--border-divider-list-width-hacikr, 1px) / 2));
279
301
  }
280
- .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):hover.awsui_body-cell-last-row_c6tup_1tfsn_144:not(.awsui_body-cell-selected_c6tup_1tfsn_144) {
302
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):hover.awsui_body-cell-last-row_c6tup_8svdc_144:not(.awsui_body-cell-selected_c6tup_8svdc_144) {
281
303
  padding-top: calc(var(--space-scaled-xs-6859qs, 8px) - calc(var(--border-divider-list-width-hacikr, 1px)));
282
304
  }
283
- .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):hover.awsui_body-cell-first-row_c6tup_1tfsn_141:not(.awsui_body-cell-selected_c6tup_1tfsn_144) {
305
+ .awsui_body-cell_c6tup_8svdc_93.awsui_body-cell-editable_c6tup_8svdc_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):hover.awsui_body-cell-first-row_c6tup_8svdc_141:not(.awsui_body-cell-selected_c6tup_8svdc_144) {
284
306
  padding-top: calc(var(--space-scaled-xs-6859qs, 8px) - calc(var(--border-divider-list-width-hacikr, 1px)));
285
307
  padding-bottom: calc(var(--space-scaled-xs-6859qs, 8px) - calc(var(--border-divider-list-width-hacikr, 1px)));
286
308
  }
287
- body[data-awsui-focus-visible=true] .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):focus-within {
288
- padding-right: calc(var(--space-scaled-l-t03y3z, 20px) + var(--space-l-4vl6xu, 20px));
289
- position: relative;
290
- }
291
- body[data-awsui-focus-visible=true] .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):focus-within > .awsui_body-cell-editor_c6tup_1tfsn_204 {
292
- opacity: 1;
293
- }
294
- body[data-awsui-focus-visible=true] .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):focus-within {
295
- outline: 2px dotted transparent;
296
- outline-offset: calc(calc(-1 * var(--space-scaled-xxs-95dhkm, 4px)) - 1px);
297
- }
298
- body[data-awsui-focus-visible=true] .awsui_body-cell_c6tup_1tfsn_93.awsui_body-cell-editable_c6tup_1tfsn_129:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):focus-within::before {
299
- content: " ";
300
- display: block;
301
- position: absolute;
302
- left: calc(-1 * calc(-1 * var(--space-scaled-xxs-95dhkm, 4px)));
303
- top: calc(-1 * calc(-1 * var(--space-scaled-xxs-95dhkm, 4px)));
304
- width: calc(100% + 2 * calc(-1 * var(--space-scaled-xxs-95dhkm, 4px)));
305
- height: calc(100% + 2 * calc(-1 * var(--space-scaled-xxs-95dhkm, 4px)));
306
- border-radius: var(--border-radius-control-default-focus-ring-7661kz, 4px);
307
- box-shadow: 0 0 0 2px var(--color-border-item-focused-ap3b6s, #0972d3);
308
- }
309
- .awsui_body-cell-editable_c6tup_1tfsn_129.awsui_is-visual-refresh_c6tup_1tfsn_114:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):hover:first-child {
309
+ .awsui_body-cell-editable_c6tup_8svdc_129.awsui_is-visual-refresh_c6tup_8svdc_114:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):hover:first-child {
310
310
  border-top-left-radius: var(--border-radius-control-default-focus-ring-7661kz, 4px);
311
311
  border-bottom-left-radius: var(--border-radius-control-default-focus-ring-7661kz, 4px);
312
312
  }
313
- .awsui_body-cell-editable_c6tup_1tfsn_129.awsui_is-visual-refresh_c6tup_1tfsn_114:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):hover:last-child {
313
+ .awsui_body-cell-editable_c6tup_8svdc_129.awsui_is-visual-refresh_c6tup_8svdc_114:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):hover:last-child {
314
314
  border-top-right-radius: var(--border-radius-control-default-focus-ring-7661kz, 4px);
315
315
  border-bottom-right-radius: var(--border-radius-control-default-focus-ring-7661kz, 4px);
316
316
  }
317
- .awsui_body-cell-editable_c6tup_1tfsn_129.awsui_is-visual-refresh_c6tup_1tfsn_114:not(#\9):not(.awsui_body-cell-edit-active_c6tup_1tfsn_129):hover.awsui_body-cell-first-row_c6tup_1tfsn_141 > .awsui_body-cell-editor_c6tup_1tfsn_204 {
317
+ .awsui_body-cell-editable_c6tup_8svdc_129.awsui_is-visual-refresh_c6tup_8svdc_114:not(#\9):not(.awsui_body-cell-edit-active_c6tup_8svdc_129):hover.awsui_body-cell-first-row_c6tup_8svdc_141 > .awsui_body-cell-editor_c6tup_8svdc_204 {
318
318
  padding-top: var(--border-divider-list-width-hacikr, 1px);
319
319
  }