@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.
- package/app-layout/visual-refresh/drawers.d.ts.map +1 -1
- package/app-layout/visual-refresh/drawers.js +2 -1
- package/app-layout/visual-refresh/drawers.js.map +1 -1
- package/app-layout/visual-refresh/navigation.d.ts.map +1 -1
- package/app-layout/visual-refresh/navigation.js +3 -2
- package/app-layout/visual-refresh/navigation.js.map +1 -1
- package/app-layout/visual-refresh/styles.css.js +71 -71
- package/app-layout/visual-refresh/styles.scoped.css +213 -185
- package/app-layout/visual-refresh/styles.selectors.js +71 -71
- package/app-layout/visual-refresh/tools.d.ts.map +1 -1
- package/app-layout/visual-refresh/tools.js +3 -2
- package/app-layout/visual-refresh/tools.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/manifest.json +1 -1
- package/package.json +1 -1
- package/table/body-cell/styles.css.js +18 -18
- package/table/body-cell/styles.scoped.css +70 -70
- package/table/body-cell/styles.selectors.js +18 -18
|
@@ -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": "
|
|
6
|
-
"appbar-nav": "awsui_appbar-
|
|
7
|
-
"breadcrumbs": "
|
|
8
|
-
"appbar-tools": "awsui_appbar-
|
|
9
|
-
"drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-
|
|
10
|
-
"has-breadcrumbs": "awsui_has-
|
|
11
|
-
"has-notifications-content": "awsui_has-notifications-
|
|
12
|
-
"has-header": "awsui_has-
|
|
13
|
-
"has-dynamic-overlap-height": "awsui_has-dynamic-overlap-
|
|
14
|
-
"content-type-wizard": "awsui_content-type-
|
|
15
|
-
"content-type-cards": "awsui_content-type-
|
|
16
|
-
"content-type-table": "awsui_content-type-
|
|
17
|
-
"has-sticky-background": "awsui_has-sticky-
|
|
18
|
-
"background": "
|
|
19
|
-
"notifications-appbar-header": "awsui_notifications-appbar-
|
|
20
|
-
"sticky-notifications": "awsui_sticky-
|
|
21
|
-
"overlap": "
|
|
22
|
-
"drawers-container": "awsui_drawers-
|
|
23
|
-
"has-open-drawer": "awsui_has-open-
|
|
24
|
-
"
|
|
25
|
-
"
|
|
26
|
-
"
|
|
27
|
-
"
|
|
28
|
-
"drawer
|
|
29
|
-
"drawer-
|
|
30
|
-
"
|
|
31
|
-
"
|
|
32
|
-
"
|
|
33
|
-
"
|
|
34
|
-
"content-
|
|
35
|
-
"
|
|
36
|
-
"
|
|
37
|
-
"has-sticky-notifications": "awsui_has-sticky-
|
|
38
|
-
"has-split-panel": "awsui_has-split-
|
|
39
|
-
"split-panel-position-bottom": "awsui_split-panel-position-
|
|
40
|
-
"has-content-gap-left": "awsui_has-content-gap-
|
|
41
|
-
"has-content-gap-right": "awsui_has-content-gap-
|
|
42
|
-
"block-body-scroll": "awsui_block-body-
|
|
43
|
-
"container": "
|
|
44
|
-
"disable-content-paddings": "awsui_disable-content-
|
|
45
|
-
"is-navigation-open": "awsui_is-navigation-
|
|
46
|
-
"is-tools-open": "awsui_is-tools-
|
|
47
|
-
"is-split-panel-open": "awsui_is-split-panel-
|
|
48
|
-
"split-panel-position-side": "awsui_split-panel-position-
|
|
49
|
-
"content-type-default": "awsui_content-type-
|
|
50
|
-
"content-type-form": "awsui_content-type-
|
|
51
|
-
"unfocusable": "
|
|
52
|
-
"navigation-container": "awsui_navigation-
|
|
53
|
-
"show-navigation": "awsui_show-
|
|
54
|
-
"animating": "
|
|
55
|
-
"showButtons": "
|
|
56
|
-
"navigation": "
|
|
57
|
-
"openNavigation": "
|
|
58
|
-
"animated-content": "awsui_animated-
|
|
59
|
-
"hide-navigation": "awsui_hide-
|
|
60
|
-
"notifications": "
|
|
61
|
-
"split-panel-bottom": "awsui_split-panel-
|
|
62
|
-
"position-bottom": "awsui_position-
|
|
63
|
-
"openSplitPanelBottom": "
|
|
64
|
-
"split-panel-side": "awsui_split-panel-
|
|
65
|
-
"position-side": "awsui_position-
|
|
66
|
-
"openSplitPanelSide": "
|
|
67
|
-
"tools-container": "awsui_tools-
|
|
68
|
-
"tools": "
|
|
69
|
-
"openTools": "
|
|
70
|
-
"has-tools-form-persistence": "awsui_has-tools-form-
|
|
71
|
-
"hide-tools": "awsui_hide-
|
|
72
|
-
"show-tools": "awsui_show-
|
|
73
|
-
"has-tools-form": "awsui_has-tools-
|
|
74
|
-
"trigger": "
|
|
75
|
-
"selected": "
|
|
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,
|
|
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
|
-
[
|
|
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"]}
|
package/internal/environment.js
CHANGED
package/internal/manifest.json
CHANGED
package/package.json
CHANGED
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"body-cell": "awsui_body-
|
|
5
|
-
"body-cell-wrap": "awsui_body-cell-
|
|
6
|
-
"is-visual-refresh": "awsui_is-visual-
|
|
7
|
-
"has-striped-rows": "awsui_has-striped-
|
|
8
|
-
"body-cell-edit-active": "awsui_body-cell-edit-
|
|
9
|
-
"body-cell-editable": "awsui_body-cell-
|
|
10
|
-
"has-selection": "awsui_has-
|
|
11
|
-
"body-cell-first-row": "awsui_body-cell-first-
|
|
12
|
-
"body-cell-last-row": "awsui_body-cell-last-
|
|
13
|
-
"body-cell-selected": "awsui_body-cell-
|
|
14
|
-
"has-footer": "awsui_has-
|
|
15
|
-
"body-cell-shaded": "awsui_body-cell-
|
|
16
|
-
"body-cell-next-selected": "awsui_body-cell-next-
|
|
17
|
-
"body-cell-prev-selected": "awsui_body-cell-prev-
|
|
18
|
-
"body-cell-editor": "awsui_body-cell-
|
|
19
|
-
"body-cell-editor-form": "awsui_body-cell-editor-
|
|
20
|
-
"body-cell-editor-row": "awsui_body-cell-editor-
|
|
21
|
-
"body-cell-editor-controls": "awsui_body-cell-editor-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
245
|
+
.awsui_body-cell-editor-controls_c6tup_8svdc_245:not(#\9) {
|
|
246
246
|
flex-shrink: 0;
|
|
247
247
|
}
|
|
248
|
-
.awsui_body-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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
|
-
|
|
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-
|
|
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-
|
|
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
|
}
|