@cloudscape-design/components 3.0.822 → 3.0.823
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/drawer/index.d.ts.map +1 -1
- package/app-layout/drawer/index.js +3 -1
- package/app-layout/drawer/index.js.map +1 -1
- package/app-layout/drawer/styles.css.js +14 -13
- package/app-layout/drawer/styles.scoped.css +26 -21
- package/app-layout/drawer/styles.selectors.js +14 -13
- package/app-layout/visual-refresh/navigation.js +1 -1
- package/app-layout/visual-refresh/navigation.js.map +1 -1
- package/app-layout/visual-refresh/styles.css.js +86 -85
- package/app-layout/visual-refresh/styles.scoped.css +168 -162
- package/app-layout/visual-refresh/styles.selectors.js +86 -85
- package/app-layout/visual-refresh-toolbar/compute-layout.d.ts +4 -1
- package/app-layout/visual-refresh-toolbar/compute-layout.d.ts.map +1 -1
- package/app-layout/visual-refresh-toolbar/compute-layout.js +4 -2
- package/app-layout/visual-refresh-toolbar/compute-layout.js.map +1 -1
- package/app-layout/visual-refresh-toolbar/drawer/global-drawer.d.ts.map +1 -1
- package/app-layout/visual-refresh-toolbar/drawer/global-drawer.js +5 -5
- package/app-layout/visual-refresh-toolbar/drawer/global-drawer.js.map +1 -1
- package/app-layout/visual-refresh-toolbar/drawer/local-drawer.d.ts.map +1 -1
- package/app-layout/visual-refresh-toolbar/drawer/local-drawer.js +5 -5
- package/app-layout/visual-refresh-toolbar/drawer/local-drawer.js.map +1 -1
- package/app-layout/visual-refresh-toolbar/drawer/styles.css.js +10 -10
- package/app-layout/visual-refresh-toolbar/drawer/styles.scoped.css +12 -14
- package/app-layout/visual-refresh-toolbar/drawer/styles.selectors.js +10 -10
- package/app-layout/visual-refresh-toolbar/navigation/index.js +5 -5
- package/app-layout/visual-refresh-toolbar/navigation/index.js.map +1 -1
- package/app-layout/visual-refresh-toolbar/navigation/styles.css.js +5 -4
- package/app-layout/visual-refresh-toolbar/navigation/styles.scoped.css +10 -5
- package/app-layout/visual-refresh-toolbar/navigation/styles.selectors.js +5 -4
- package/app-layout/visual-refresh-toolbar/split-panel/index.d.ts.map +1 -1
- package/app-layout/visual-refresh-toolbar/split-panel/index.js +4 -4
- package/app-layout/visual-refresh-toolbar/split-panel/index.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/environment.json +1 -1
- package/internal/manifest.json +1 -1
- package/package.json +1 -1
|
@@ -2,90 +2,91 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"background": "
|
|
6
|
-
"scrolling-background": "awsui_scrolling-
|
|
7
|
-
"breadcrumbs": "
|
|
8
|
-
"drawers-container": "awsui_drawers-
|
|
9
|
-
"has-open-drawer": "awsui_has-open-
|
|
10
|
-
"disable-body-scroll": "awsui_disable-body-
|
|
11
|
-
"drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-
|
|
12
|
-
"has-multiple-triggers": "awsui_has-multiple-
|
|
13
|
-
"drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-
|
|
14
|
-
"drawers-trigger-content": "awsui_drawers-trigger-
|
|
15
|
-
"drawers-trigger-overflow": "awsui_drawers-trigger-
|
|
16
|
-
"drawers-trigger": "awsui_drawers-
|
|
17
|
-
"drawer": "
|
|
18
|
-
"drawer-content-container": "awsui_drawer-content-
|
|
19
|
-
"drawer-close-button": "awsui_drawer-close-
|
|
20
|
-
"drawer-content": "awsui_drawer-
|
|
21
|
-
"drawer-content-hidden": "awsui_drawer-content-
|
|
22
|
-
"drawer-slider": "awsui_drawer-
|
|
23
|
-
"is-drawer-open": "awsui_is-drawer-
|
|
24
|
-
"content": "
|
|
25
|
-
"layout": "
|
|
26
|
-
"has-max-content-width": "awsui_has-max-content-
|
|
27
|
-
"content-type-dashboard": "awsui_content-type-
|
|
28
|
-
"content-type-table": "awsui_content-type-
|
|
29
|
-
"content-type-cards": "awsui_content-type-
|
|
30
|
-
"is-overlap-disabled": "awsui_is-overlap-
|
|
31
|
-
"is-hide-mobile-toolbar": "awsui_is-hide-mobile-
|
|
32
|
-
"has-content-gap-left": "awsui_has-content-gap-
|
|
33
|
-
"has-content-gap-right": "awsui_has-content-gap-
|
|
34
|
-
"has-breadcrumbs": "awsui_has-
|
|
35
|
-
"content-first-child-header": "awsui_content-first-child-
|
|
36
|
-
"content-first-child-notifications": "awsui_content-first-child-
|
|
37
|
-
"has-header": "awsui_has-
|
|
38
|
-
"content-first-child-main": "awsui_content-first-child-
|
|
39
|
-
"disable-content-paddings": "awsui_disable-content-
|
|
40
|
-
"has-left-toggles-gutter": "awsui_has-left-toggles-
|
|
41
|
-
"has-right-toggles-gutter": "awsui_has-right-toggles-
|
|
42
|
-
"has-split-panel": "awsui_has-split-
|
|
43
|
-
"split-panel-position-bottom": "awsui_split-panel-position-
|
|
44
|
-
"block-body-scroll": "awsui_block-body-
|
|
45
|
-
"unfocusable": "
|
|
46
|
-
"container": "
|
|
47
|
-
"is-navigation-open": "awsui_is-navigation-
|
|
48
|
-
"is-tools-open": "awsui_is-tools-
|
|
49
|
-
"is-split-panel-open": "awsui_is-split-panel-
|
|
50
|
-
"split-panel-position-side": "awsui_split-panel-position-
|
|
51
|
-
"has-active-drawer": "awsui_has-active-
|
|
52
|
-
"mobile-toolbar": "awsui_mobile-
|
|
53
|
-
"remove-high-contrast-header": "awsui_remove-high-contrast-
|
|
54
|
-
"mobile-toolbar-nav": "awsui_mobile-toolbar-
|
|
55
|
-
"mobile-toolbar-breadcrumbs": "awsui_mobile-toolbar-
|
|
56
|
-
"mobile-toolbar-tools": "awsui_mobile-toolbar-
|
|
57
|
-
"navigation-container": "awsui_navigation-
|
|
58
|
-
"show-navigation": "awsui_show-
|
|
59
|
-
"animating": "
|
|
60
|
-
"showButtons": "
|
|
61
|
-
"navigation": "
|
|
62
|
-
"openNavigation": "
|
|
63
|
-
"animated-content": "awsui_animated-
|
|
64
|
-
"
|
|
65
|
-
"
|
|
66
|
-
"
|
|
67
|
-
"
|
|
68
|
-
"
|
|
69
|
-
"
|
|
70
|
-
"
|
|
71
|
-
"
|
|
72
|
-
"
|
|
73
|
-
"
|
|
74
|
-
"
|
|
75
|
-
"tools": "
|
|
76
|
-
"
|
|
77
|
-
"
|
|
78
|
-
"
|
|
79
|
-
"
|
|
80
|
-
"
|
|
81
|
-
"
|
|
82
|
-
"trigger-
|
|
83
|
-
"trigger": "
|
|
84
|
-
"
|
|
85
|
-
"
|
|
86
|
-
"
|
|
87
|
-
"trigger-wrapper
|
|
88
|
-
"
|
|
89
|
-
"
|
|
5
|
+
"background": "awsui_background_hyvsj_17ek5_145",
|
|
6
|
+
"scrolling-background": "awsui_scrolling-background_hyvsj_17ek5_148",
|
|
7
|
+
"breadcrumbs": "awsui_breadcrumbs_hyvsj_17ek5_159",
|
|
8
|
+
"drawers-container": "awsui_drawers-container_hyvsj_17ek5_172",
|
|
9
|
+
"has-open-drawer": "awsui_has-open-drawer_hyvsj_17ek5_183",
|
|
10
|
+
"disable-body-scroll": "awsui_disable-body-scroll_hyvsj_17ek5_204",
|
|
11
|
+
"drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_hyvsj_17ek5_209",
|
|
12
|
+
"has-multiple-triggers": "awsui_has-multiple-triggers_hyvsj_17ek5_250",
|
|
13
|
+
"drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_hyvsj_17ek5_260",
|
|
14
|
+
"drawers-trigger-content": "awsui_drawers-trigger-content_hyvsj_17ek5_265",
|
|
15
|
+
"drawers-trigger-overflow": "awsui_drawers-trigger-overflow_hyvsj_17ek5_279",
|
|
16
|
+
"drawers-trigger": "awsui_drawers-trigger_hyvsj_17ek5_265",
|
|
17
|
+
"drawer": "awsui_drawer_hyvsj_17ek5_172",
|
|
18
|
+
"drawer-content-container": "awsui_drawer-content-container_hyvsj_17ek5_310",
|
|
19
|
+
"drawer-close-button": "awsui_drawer-close-button_hyvsj_17ek5_319",
|
|
20
|
+
"drawer-content": "awsui_drawer-content_hyvsj_17ek5_310",
|
|
21
|
+
"drawer-content-hidden": "awsui_drawer-content-hidden_hyvsj_17ek5_328",
|
|
22
|
+
"drawer-slider": "awsui_drawer-slider_hyvsj_17ek5_331",
|
|
23
|
+
"is-drawer-open": "awsui_is-drawer-open_hyvsj_17ek5_338",
|
|
24
|
+
"content": "awsui_content_hyvsj_17ek5_364",
|
|
25
|
+
"layout": "awsui_layout_hyvsj_17ek5_389",
|
|
26
|
+
"has-max-content-width": "awsui_has-max-content-width_hyvsj_17ek5_461",
|
|
27
|
+
"content-type-dashboard": "awsui_content-type-dashboard_hyvsj_17ek5_476",
|
|
28
|
+
"content-type-table": "awsui_content-type-table_hyvsj_17ek5_490",
|
|
29
|
+
"content-type-cards": "awsui_content-type-cards_hyvsj_17ek5_490",
|
|
30
|
+
"is-overlap-disabled": "awsui_is-overlap-disabled_hyvsj_17ek5_496",
|
|
31
|
+
"is-hide-mobile-toolbar": "awsui_is-hide-mobile-toolbar_hyvsj_17ek5_499",
|
|
32
|
+
"has-content-gap-left": "awsui_has-content-gap-left_hyvsj_17ek5_513",
|
|
33
|
+
"has-content-gap-right": "awsui_has-content-gap-right_hyvsj_17ek5_516",
|
|
34
|
+
"has-breadcrumbs": "awsui_has-breadcrumbs_hyvsj_17ek5_526",
|
|
35
|
+
"content-first-child-header": "awsui_content-first-child-header_hyvsj_17ek5_529",
|
|
36
|
+
"content-first-child-notifications": "awsui_content-first-child-notifications_hyvsj_17ek5_529",
|
|
37
|
+
"has-header": "awsui_has-header_hyvsj_17ek5_529",
|
|
38
|
+
"content-first-child-main": "awsui_content-first-child-main_hyvsj_17ek5_544",
|
|
39
|
+
"disable-content-paddings": "awsui_disable-content-paddings_hyvsj_17ek5_544",
|
|
40
|
+
"has-left-toggles-gutter": "awsui_has-left-toggles-gutter_hyvsj_17ek5_564",
|
|
41
|
+
"has-right-toggles-gutter": "awsui_has-right-toggles-gutter_hyvsj_17ek5_567",
|
|
42
|
+
"has-split-panel": "awsui_has-split-panel_hyvsj_17ek5_587",
|
|
43
|
+
"split-panel-position-bottom": "awsui_split-panel-position-bottom_hyvsj_17ek5_587",
|
|
44
|
+
"block-body-scroll": "awsui_block-body-scroll_hyvsj_17ek5_595",
|
|
45
|
+
"unfocusable": "awsui_unfocusable_hyvsj_17ek5_600",
|
|
46
|
+
"container": "awsui_container_hyvsj_17ek5_610",
|
|
47
|
+
"is-navigation-open": "awsui_is-navigation-open_hyvsj_17ek5_636",
|
|
48
|
+
"is-tools-open": "awsui_is-tools-open_hyvsj_17ek5_639",
|
|
49
|
+
"is-split-panel-open": "awsui_is-split-panel-open_hyvsj_17ek5_639",
|
|
50
|
+
"split-panel-position-side": "awsui_split-panel-position-side_hyvsj_17ek5_639",
|
|
51
|
+
"has-active-drawer": "awsui_has-active-drawer_hyvsj_17ek5_639",
|
|
52
|
+
"mobile-toolbar": "awsui_mobile-toolbar_hyvsj_17ek5_652",
|
|
53
|
+
"remove-high-contrast-header": "awsui_remove-high-contrast-header_hyvsj_17ek5_669",
|
|
54
|
+
"mobile-toolbar-nav": "awsui_mobile-toolbar-nav_hyvsj_17ek5_673",
|
|
55
|
+
"mobile-toolbar-breadcrumbs": "awsui_mobile-toolbar-breadcrumbs_hyvsj_17ek5_677",
|
|
56
|
+
"mobile-toolbar-tools": "awsui_mobile-toolbar-tools_hyvsj_17ek5_681",
|
|
57
|
+
"navigation-container": "awsui_navigation-container_hyvsj_17ek5_690",
|
|
58
|
+
"show-navigation": "awsui_show-navigation_hyvsj_17ek5_728",
|
|
59
|
+
"animating": "awsui_animating_hyvsj_17ek5_751",
|
|
60
|
+
"showButtons": "awsui_showButtons_hyvsj_17ek5_1",
|
|
61
|
+
"navigation": "awsui_navigation_hyvsj_17ek5_690",
|
|
62
|
+
"openNavigation": "awsui_openNavigation_hyvsj_17ek5_1",
|
|
63
|
+
"animated-content": "awsui_animated-content_hyvsj_17ek5_815",
|
|
64
|
+
"content-container": "awsui_content-container_hyvsj_17ek5_818",
|
|
65
|
+
"hide-navigation": "awsui_hide-navigation_hyvsj_17ek5_827",
|
|
66
|
+
"notifications": "awsui_notifications_hyvsj_17ek5_837",
|
|
67
|
+
"has-notification-content": "awsui_has-notification-content_hyvsj_17ek5_842",
|
|
68
|
+
"sticky-notifications": "awsui_sticky-notifications_hyvsj_17ek5_846",
|
|
69
|
+
"high-contrast": "awsui_high-contrast_hyvsj_17ek5_851",
|
|
70
|
+
"split-panel-bottom": "awsui_split-panel-bottom_hyvsj_17ek5_869",
|
|
71
|
+
"position-bottom": "awsui_position-bottom_hyvsj_17ek5_916",
|
|
72
|
+
"openSplitPanelBottom": "awsui_openSplitPanelBottom_hyvsj_17ek5_1",
|
|
73
|
+
"split-panel-side": "awsui_split-panel-side_hyvsj_17ek5_945",
|
|
74
|
+
"position-side": "awsui_position-side_hyvsj_17ek5_958",
|
|
75
|
+
"tools-container": "awsui_tools-container_hyvsj_17ek5_980",
|
|
76
|
+
"tools": "awsui_tools_hyvsj_17ek5_980",
|
|
77
|
+
"openTools": "awsui_openTools_hyvsj_17ek5_1",
|
|
78
|
+
"has-tools-form-persistence": "awsui_has-tools-form-persistence_hyvsj_17ek5_1069",
|
|
79
|
+
"hide-tools": "awsui_hide-tools_hyvsj_17ek5_1079",
|
|
80
|
+
"show-tools": "awsui_show-tools_hyvsj_17ek5_1091",
|
|
81
|
+
"has-tools-form": "awsui_has-tools-form_hyvsj_17ek5_1069",
|
|
82
|
+
"trigger-button-styles": "awsui_trigger-button-styles_hyvsj_17ek5_1174",
|
|
83
|
+
"trigger-badge-wrapper": "awsui_trigger-badge-wrapper_hyvsj_17ek5_1190",
|
|
84
|
+
"trigger": "awsui_trigger_hyvsj_17ek5_1174",
|
|
85
|
+
"selected": "awsui_selected_hyvsj_17ek5_1242",
|
|
86
|
+
"badge": "awsui_badge_hyvsj_17ek5_1262",
|
|
87
|
+
"trigger-wrapper": "awsui_trigger-wrapper_hyvsj_17ek5_1266",
|
|
88
|
+
"trigger-wrapper-tooltip-visible": "awsui_trigger-wrapper-tooltip-visible_hyvsj_17ek5_1277",
|
|
89
|
+
"dot": "awsui_dot_hyvsj_17ek5_1281",
|
|
90
|
+
"trigger-tooltip": "awsui_trigger-tooltip_hyvsj_17ek5_1294"
|
|
90
91
|
};
|
|
91
92
|
|
|
@@ -36,6 +36,9 @@ export interface VerticalLayoutOutput {
|
|
|
36
36
|
drawers: number;
|
|
37
37
|
}
|
|
38
38
|
export declare function computeVerticalLayout({ topOffset, hasVisibleToolbar, toolbarHeight, stickyNotifications, notificationsHeight, }: VerticalLayoutInput): VerticalLayoutOutput;
|
|
39
|
-
export declare function
|
|
39
|
+
export declare function getDrawerStyles(verticalOffsets: VerticalLayoutOutput, isMobile: boolean, placement: AppLayoutPropsWithDefaults['placement']): {
|
|
40
|
+
drawerTopOffset: number;
|
|
41
|
+
drawerHeight: string;
|
|
42
|
+
};
|
|
40
43
|
export {};
|
|
41
44
|
//# sourceMappingURL=compute-layout.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compute-layout.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh-toolbar/compute-layout.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,0BAA0B,EAAE,MAAM,eAAe,CAAC;AAG3D,UAAU,qBAAqB;IAC7B,cAAc,EAAE,OAAO,CAAC;IACxB,eAAe,EAAE,MAAM,CAAC;IACxB,SAAS,EAAE,0BAA0B,CAAC,WAAW,CAAC,CAAC;IACnD,eAAe,EAAE,MAAM,CAAC;IACxB,gBAAgB,EAAE,MAAM,CAAC;IACzB,cAAc,EAAE,OAAO,CAAC;IACxB,kBAAkB,EAAE,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAC;IAClD,cAAc,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,OAAO,CAAC;IAClB,wBAAwB,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAClD;AAED,eAAO,MAAM,eAAe,QAAS,CAAC;AAEtC,wBAAgB,uBAAuB,CAAC,EACtC,cAAc,EACd,eAAe,EACf,SAAS,EACT,eAAe,EACf,gBAAgB,EAChB,cAAc,EACd,kBAAkB,EAClB,cAAc,EACd,QAAQ,EACR,wBAAwB,GACzB,EAAE,qBAAqB;;;;;;;;;EAwCvB;AAED,UAAU,mBAAmB;IAC3B,SAAS,EAAE,MAAM,CAAC;IAClB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,aAAa,EAAE,MAAM,CAAC;IACtB,mBAAmB,EAAE,OAAO,CAAC;IAC7B,mBAAmB,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,MAAM,CAAC;IAChB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,qBAAqB,CAAC,EACpC,SAAS,EACT,iBAAiB,EACjB,aAAa,EACb,mBAAmB,EACnB,mBAAmB,GACpB,EAAE,mBAAmB,GAAG,oBAAoB,CAe5C;AAED,wBAAgB,
|
|
1
|
+
{"version":3,"file":"compute-layout.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh-toolbar/compute-layout.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,0BAA0B,EAAE,MAAM,eAAe,CAAC;AAG3D,UAAU,qBAAqB;IAC7B,cAAc,EAAE,OAAO,CAAC;IACxB,eAAe,EAAE,MAAM,CAAC;IACxB,SAAS,EAAE,0BAA0B,CAAC,WAAW,CAAC,CAAC;IACnD,eAAe,EAAE,MAAM,CAAC;IACxB,gBAAgB,EAAE,MAAM,CAAC;IACzB,cAAc,EAAE,OAAO,CAAC;IACxB,kBAAkB,EAAE,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAC;IAClD,cAAc,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,OAAO,CAAC;IAClB,wBAAwB,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAClD;AAED,eAAO,MAAM,eAAe,QAAS,CAAC;AAEtC,wBAAgB,uBAAuB,CAAC,EACtC,cAAc,EACd,eAAe,EACf,SAAS,EACT,eAAe,EACf,gBAAgB,EAChB,cAAc,EACd,kBAAkB,EAClB,cAAc,EACd,QAAQ,EACR,wBAAwB,GACzB,EAAE,qBAAqB;;;;;;;;;EAwCvB;AAED,UAAU,mBAAmB;IAC3B,SAAS,EAAE,MAAM,CAAC;IAClB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,aAAa,EAAE,MAAM,CAAC;IACtB,mBAAmB,EAAE,OAAO,CAAC;IAC7B,mBAAmB,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,MAAM,CAAC;IAChB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,qBAAqB,CAAC,EACpC,SAAS,EACT,iBAAiB,EACjB,aAAa,EACb,mBAAmB,EACnB,mBAAmB,GACpB,EAAE,mBAAmB,GAAG,oBAAoB,CAe5C;AAED,wBAAgB,eAAe,CAC7B,eAAe,EAAE,oBAAoB,EACrC,QAAQ,EAAE,OAAO,EACjB,SAAS,EAAE,0BAA0B,CAAC,WAAW,CAAC,GACjD;IACD,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,MAAM,CAAC;CACtB,CAIA"}
|
|
@@ -44,8 +44,10 @@ export function computeVerticalLayout({ topOffset, hasVisibleToolbar, toolbarHei
|
|
|
44
44
|
}
|
|
45
45
|
return { toolbar, notifications, header, drawers };
|
|
46
46
|
}
|
|
47
|
-
export function
|
|
47
|
+
export function getDrawerStyles(verticalOffsets, isMobile, placement) {
|
|
48
48
|
var _a;
|
|
49
|
-
|
|
49
|
+
const drawerTopOffset = isMobile ? verticalOffsets.toolbar : (_a = verticalOffsets.drawers) !== null && _a !== void 0 ? _a : placement.insetBlockStart;
|
|
50
|
+
const drawerHeight = `calc(100vh - ${drawerTopOffset}px - ${placement.insetBlockEnd}px)`;
|
|
51
|
+
return { drawerTopOffset, drawerHeight };
|
|
50
52
|
}
|
|
51
53
|
//# sourceMappingURL=compute-layout.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compute-layout.js","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh-toolbar/compute-layout.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAGtC,OAAO,EAAE,6BAA6B,EAAE,MAAM,kCAAkC,CAAC;AAejF,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,GAAG,EAAE,CAAC,CAAC,WAAW;AAElD,MAAM,UAAU,uBAAuB,CAAC,EACtC,cAAc,EACd,eAAe,EACf,SAAS,EACT,eAAe,EACf,gBAAgB,EAChB,cAAc,EACd,kBAAkB,EAClB,cAAc,EACd,QAAQ,EACR,wBAAwB,GACF;IACtB,MAAM,qBAAqB,GAAG,cAAc,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;IAEnE,IAAI,uBAAuB,GAAG,IAAI,CAAC,GAAG,CACpC,CAAC,EACD,SAAS,CAAC,UAAU,GAAG,eAAe,GAAG,eAAe,GAAG,qBAAqB,CACjF,CAAC;IACF,MAAM,4BAA4B,GAAG,MAAM,CAAC,MAAM,CAAC,wBAAwB,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE,CAAC,GAAG,GAAG,IAAI,EAAE,CAAC,CAAC,CAAC;IAElH,MAAM,kBAAkB,GAAG,uBAAuB,GAAG,gBAAgB,CAAC;IACtE,MAAM,wBAAwB,GAAG,6BAA6B,CAAC,EAAE,QAAQ,EAAE,kBAAkB,EAAE,CAAC,CAAC;IACjG,MAAM,0BAA0B,GAAG,wBAAwB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,kBAAkB,aAAlB,kBAAkB,cAAlB,kBAAkB,GAAI,QAAQ,CAAC;IACxG,MAAM,kBAAkB,GAAG,0BAA0B,KAAK,MAAM,IAAI,cAAc,CAAC,CAAC,CAAC,cAAc,aAAd,cAAc,cAAd,cAAc,GAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAC7G,MAAM,iBAAiB,GAAG,IAAI,CAAC,GAAG,CAAC,uBAAuB,GAAG,4BAA4B,GAAG,gBAAgB,EAAE,CAAC,CAAC,CAAC;IACjH,uBAAuB,IAAI,kBAAkB,CAAC;IAC9C,MAAM,aAAa,GAAG,uBAAuB,GAAG,4BAA4B,CAAC;IAC7E,MAAM,qBAAqB,GAA2B,MAAM,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC,MAAM,CAChG,CAAC,GAAG,EAAE,QAAQ,EAAE,EAAE;QAChB,uCACK,GAAG,KACN,CAAC,QAAQ,CAAC,EACR,uBAAuB;gBACvB,gBAAgB;gBAChB,4BAA4B;gBAC5B,wBAAwB,CAAC,QAAQ,CAAC,IACpC;IACJ,CAAC,EACD,EAAE,CACH,CAAC;IAEF,OAAO;QACL,kBAAkB,EAAE,0BAA0B;QAC9C,wBAAwB;QACxB,kBAAkB;QAClB,iBAAiB;QACjB,aAAa;QACb,qBAAqB;QACrB,4BAA4B;QAC5B,uBAAuB;KACxB,CAAC;AACJ,CAAC;AAiBD,MAAM,UAAU,qBAAqB,CAAC,EACpC,SAAS,EACT,iBAAiB,EACjB,aAAa,EACb,mBAAmB,EACnB,mBAAmB,GACC;IACpB,MAAM,OAAO,GAAG,SAAS,CAAC;IAC1B,IAAI,aAAa,GAAG,SAAS,CAAC;IAC9B,IAAI,OAAO,GAAG,SAAS,CAAC;IAExB,IAAI,iBAAiB,EAAE;QACrB,aAAa,IAAI,aAAa,CAAC;QAC/B,OAAO,IAAI,aAAa,CAAC;KAC1B;IACD,IAAI,MAAM,GAAG,aAAa,CAAC;IAC3B,IAAI,mBAAmB,EAAE;QACvB,MAAM,IAAI,mBAAmB,CAAC;KAC/B;IAED,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC;AACrD,CAAC;AAED,MAAM,UAAU,
|
|
1
|
+
{"version":3,"file":"compute-layout.js","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh-toolbar/compute-layout.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { AppLayoutPropsWithDefaults } from '../interfaces';\nimport { checkSplitPanelForcedPosition } from '../split-panel/split-panel-utils';\n\ninterface HorizontalLayoutInput {\n navigationOpen: boolean;\n navigationWidth: number;\n placement: AppLayoutPropsWithDefaults['placement'];\n minContentWidth: number;\n activeDrawerSize: number;\n splitPanelOpen: boolean;\n splitPanelPosition: 'side' | 'bottom' | undefined;\n splitPanelSize: number;\n isMobile: boolean;\n activeGlobalDrawersSizes: Record<string, number>;\n}\n\nexport const CONTENT_PADDING = 2 * 24; // space-xl\n\nexport function computeHorizontalLayout({\n navigationOpen,\n navigationWidth,\n placement,\n minContentWidth,\n activeDrawerSize,\n splitPanelOpen,\n splitPanelPosition,\n splitPanelSize,\n isMobile,\n activeGlobalDrawersSizes,\n}: HorizontalLayoutInput) {\n const activeNavigationWidth = navigationOpen ? navigationWidth : 0;\n\n let resizableSpaceAvailable = Math.max(\n 0,\n placement.inlineSize - minContentWidth - CONTENT_PADDING - activeNavigationWidth\n );\n const totalActiveGlobalDrawersSize = Object.values(activeGlobalDrawersSizes).reduce((acc, size) => acc + size, 0);\n\n const splitPanelMaxWidth = resizableSpaceAvailable - activeDrawerSize;\n const splitPanelForcedPosition = checkSplitPanelForcedPosition({ isMobile, splitPanelMaxWidth });\n const resolvedSplitPanelPosition = splitPanelForcedPosition ? 'bottom' : splitPanelPosition ?? 'bottom';\n const sideSplitPanelSize = resolvedSplitPanelPosition === 'side' && splitPanelOpen ? splitPanelSize ?? 0 : 0;\n const maxSplitPanelSize = Math.max(resizableSpaceAvailable - totalActiveGlobalDrawersSize - activeDrawerSize, 0);\n resizableSpaceAvailable -= sideSplitPanelSize;\n const maxDrawerSize = resizableSpaceAvailable - totalActiveGlobalDrawersSize;\n const maxGlobalDrawersSizes: Record<string, number> = Object.keys(activeGlobalDrawersSizes).reduce(\n (acc, drawerId) => {\n return {\n ...acc,\n [drawerId]:\n resizableSpaceAvailable -\n activeDrawerSize -\n totalActiveGlobalDrawersSize +\n activeGlobalDrawersSizes[drawerId],\n };\n },\n {}\n );\n\n return {\n splitPanelPosition: resolvedSplitPanelPosition,\n splitPanelForcedPosition,\n sideSplitPanelSize,\n maxSplitPanelSize,\n maxDrawerSize,\n maxGlobalDrawersSizes,\n totalActiveGlobalDrawersSize,\n resizableSpaceAvailable,\n };\n}\n\ninterface VerticalLayoutInput {\n topOffset: number;\n hasVisibleToolbar: boolean;\n toolbarHeight: number;\n stickyNotifications: boolean;\n notificationsHeight: number;\n}\n\nexport interface VerticalLayoutOutput {\n toolbar: number;\n notifications: number;\n header: number;\n drawers: number;\n}\n\nexport function computeVerticalLayout({\n topOffset,\n hasVisibleToolbar,\n toolbarHeight,\n stickyNotifications,\n notificationsHeight,\n}: VerticalLayoutInput): VerticalLayoutOutput {\n const toolbar = topOffset;\n let notifications = topOffset;\n let drawers = topOffset;\n\n if (hasVisibleToolbar) {\n notifications += toolbarHeight;\n drawers += toolbarHeight;\n }\n let header = notifications;\n if (stickyNotifications) {\n header += notificationsHeight;\n }\n\n return { toolbar, notifications, header, drawers };\n}\n\nexport function getDrawerStyles(\n verticalOffsets: VerticalLayoutOutput,\n isMobile: boolean,\n placement: AppLayoutPropsWithDefaults['placement']\n): {\n drawerTopOffset: number;\n drawerHeight: string;\n} {\n const drawerTopOffset = isMobile ? verticalOffsets.toolbar : verticalOffsets.drawers ?? placement.insetBlockStart;\n const drawerHeight = `calc(100vh - ${drawerTopOffset}px - ${placement.insetBlockEnd}px)`;\n return { drawerTopOffset, drawerHeight };\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"global-drawer.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/global-drawer.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAGrE,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAOnD,UAAU,wCAAwC;IAChD,kBAAkB,EAAE,kBAAkB,CAAC;IACvC,IAAI,EAAE,OAAO,CAAC;IACd,kBAAkB,EACd,CAAC,cAAc,CAAC,MAAM,GAAG;QAAE,MAAM,CAAC,EAAE,yBAAyB,CAAC;QAAC,MAAM,CAAC,EAAE,yBAAyB,CAAA;KAAE,CAAC,GACpG,SAAS,CAAC;CACf;AAED,iBAAS,mCAAmC,CAAC,EAC3C,kBAAkB,EAClB,IAAI,EACJ,kBAAkB,GACnB,EAAE,wCAAwC,
|
|
1
|
+
{"version":3,"file":"global-drawer.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/global-drawer.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAGrE,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAOnD,UAAU,wCAAwC;IAChD,kBAAkB,EAAE,kBAAkB,CAAC;IACvC,IAAI,EAAE,OAAO,CAAC;IACd,kBAAkB,EACd,CAAC,cAAc,CAAC,MAAM,GAAG;QAAE,MAAM,CAAC,EAAE,yBAAyB,CAAC;QAAC,MAAM,CAAC,EAAE,yBAAyB,CAAA;KAAE,CAAC,GACpG,SAAS,CAAC;CACf;AAED,iBAAS,mCAAmC,CAAC,EAC3C,kBAAkB,EAClB,IAAI,EACJ,kBAAkB,GACnB,EAAE,wCAAwC,eAyH1C;AAED,eAAe,mCAAmC,CAAC"}
|
|
@@ -7,7 +7,7 @@ import { InternalButton } from '../../../button/internal';
|
|
|
7
7
|
import PanelResizeHandle from '../../../internal/components/panel-resize-handle';
|
|
8
8
|
import customCssProps from '../../../internal/generated/custom-css-properties';
|
|
9
9
|
import { getLimitedValue } from '../../../split-panel/utils/size-utils';
|
|
10
|
-
import {
|
|
10
|
+
import { getDrawerStyles } from '../compute-layout';
|
|
11
11
|
import { useResize } from './use-resize';
|
|
12
12
|
import sharedStyles from '../../resize/styles.css.js';
|
|
13
13
|
import testutilStyles from '../../test-classes/styles.css.js';
|
|
@@ -21,7 +21,7 @@ function AppLayoutGlobalDrawerImplementation({ appLayoutInternals, show, activeG
|
|
|
21
21
|
closeButton: activeGlobalDrawer ? (_b = activeGlobalDrawer.ariaLabels) === null || _b === void 0 ? void 0 : _b.closeButton : ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.toolsClose,
|
|
22
22
|
content: activeGlobalDrawer ? (_c = activeGlobalDrawer.ariaLabels) === null || _c === void 0 ? void 0 : _c.drawerName : ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.tools,
|
|
23
23
|
};
|
|
24
|
-
const
|
|
24
|
+
const { drawerTopOffset, drawerHeight } = getDrawerStyles(verticalOffsets, isMobile, placement);
|
|
25
25
|
const activeDrawerSize = (_d = (activeDrawerId ? activeGlobalDrawersSizes[activeDrawerId] : 0)) !== null && _d !== void 0 ? _d : 0;
|
|
26
26
|
const minDrawerSize = (_e = (activeDrawerId ? minGlobalDrawersSizes[activeDrawerId] : 0)) !== null && _e !== void 0 ? _e : 0;
|
|
27
27
|
const maxDrawerSize = (_f = (activeDrawerId ? maxGlobalDrawersSizes[activeDrawerId] : 0)) !== null && _f !== void 0 ? _f : 0;
|
|
@@ -55,17 +55,17 @@ function AppLayoutGlobalDrawerImplementation({ appLayoutInternals, show, activeG
|
|
|
55
55
|
if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {
|
|
56
56
|
globalDrawersFocusControl.loseFocus();
|
|
57
57
|
}
|
|
58
|
-
}, style: Object.assign({ blockSize:
|
|
58
|
+
}, style: Object.assign({ blockSize: drawerHeight, insetBlockStart: drawerTopOffset }, (!isMobile && {
|
|
59
59
|
[customCssProps.drawerSize]: `${['entering', 'entered'].includes(state) ? size : 0}px`,
|
|
60
60
|
})), "data-testid": `awsui-app-layout-drawer-${activeDrawerId}` },
|
|
61
61
|
!isMobile && (activeGlobalDrawer === null || activeGlobalDrawer === void 0 ? void 0 : activeGlobalDrawer.resizable) && (React.createElement("div", { className: styles['drawer-slider'] },
|
|
62
62
|
React.createElement(PanelResizeHandle, { ref: refs === null || refs === void 0 ? void 0 : refs.slider, position: "side", className: testutilStyles['drawers-slider'], ariaLabel: (_a = activeGlobalDrawer === null || activeGlobalDrawer === void 0 ? void 0 : activeGlobalDrawer.ariaLabels) === null || _a === void 0 ? void 0 : _a.resizeHandle, ariaValuenow: resizeProps.relativeSize, onKeyDown: resizeProps.onKeyDown, onPointerDown: resizeProps.onPointerDown }))),
|
|
63
|
-
React.createElement("div", { className: clsx(styles['drawer-content-container'], sharedStyles['with-motion-horizontal']) },
|
|
63
|
+
React.createElement("div", { className: clsx(styles['drawer-content-container'], sharedStyles['with-motion-horizontal']), "data-testid": `awsui-app-layout-drawer-content-${activeDrawerId}` },
|
|
64
64
|
React.createElement("div", { className: clsx(styles['drawer-close-button']) },
|
|
65
65
|
React.createElement(InternalButton, { ariaLabel: computedAriaLabels.closeButton, className: clsx({
|
|
66
66
|
[testutilStyles['active-drawer-close-button']]: activeDrawerId,
|
|
67
67
|
}), formAction: "none", iconName: isMobile ? 'close' : 'angle-right', onClick: () => onActiveGlobalDrawersChange(activeDrawerId), ref: refs === null || refs === void 0 ? void 0 : refs.close, variant: "icon" })),
|
|
68
|
-
React.createElement("div", { className: styles['drawer-content'] }, activeGlobalDrawer === null || activeGlobalDrawer === void 0 ? void 0 : activeGlobalDrawer.content))));
|
|
68
|
+
React.createElement("div", { className: styles['drawer-content'], style: { blockSize: drawerHeight } }, activeGlobalDrawer === null || activeGlobalDrawer === void 0 ? void 0 : activeGlobalDrawer.content))));
|
|
69
69
|
}));
|
|
70
70
|
}
|
|
71
71
|
export default AppLayoutGlobalDrawerImplementation;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"global-drawer.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/global-drawer.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, { useRef } from 'react';\nimport { Transition } from 'react-transition-group';\nimport clsx from 'clsx';\n\nimport { InternalButton } from '../../../button/internal';\nimport PanelResizeHandle from '../../../internal/components/panel-resize-handle';\nimport { NonCancelableEventHandler } from '../../../internal/events';\nimport customCssProps from '../../../internal/generated/custom-css-properties';\nimport { getLimitedValue } from '../../../split-panel/utils/size-utils';\nimport { AppLayoutProps } from '../../interfaces';\nimport { getDrawerTopOffset } from '../compute-layout';\nimport { AppLayoutInternals } from '../interfaces';\nimport { useResize } from './use-resize';\n\nimport sharedStyles from '../../resize/styles.css.js';\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\ninterface AppLayoutGlobalDrawerImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n show: boolean;\n activeGlobalDrawer:\n | (AppLayoutProps.Drawer & { onShow?: NonCancelableEventHandler; onHide?: NonCancelableEventHandler })\n | undefined;\n}\n\nfunction AppLayoutGlobalDrawerImplementation({\n appLayoutInternals,\n show,\n activeGlobalDrawer,\n}: AppLayoutGlobalDrawerImplementationProps) {\n const {\n ariaLabels,\n globalDrawersFocusControl,\n isMobile,\n placement,\n onActiveGlobalDrawersChange,\n onActiveDrawerResize,\n minGlobalDrawersSizes,\n maxGlobalDrawersSizes,\n activeGlobalDrawersSizes,\n verticalOffsets,\n drawersOpenQueue,\n } = appLayoutInternals;\n const drawerRef = useRef<HTMLDivElement>(null);\n const activeDrawerId = activeGlobalDrawer?.id ?? '';\n\n const computedAriaLabels = {\n closeButton: activeGlobalDrawer ? activeGlobalDrawer.ariaLabels?.closeButton : ariaLabels?.toolsClose,\n content: activeGlobalDrawer ? activeGlobalDrawer.ariaLabels?.drawerName : ariaLabels?.tools,\n };\n\n const drawersTopOffset = getDrawerTopOffset(verticalOffsets, isMobile, placement);\n const activeDrawerSize = (activeDrawerId ? activeGlobalDrawersSizes[activeDrawerId] : 0) ?? 0;\n const minDrawerSize = (activeDrawerId ? minGlobalDrawersSizes[activeDrawerId] : 0) ?? 0;\n const maxDrawerSize = (activeDrawerId ? maxGlobalDrawersSizes[activeDrawerId] : 0) ?? 0;\n const refs = globalDrawersFocusControl.refs[activeDrawerId];\n const resizeProps = useResize({\n currentWidth: activeDrawerSize,\n minWidth: minDrawerSize,\n maxWidth: maxDrawerSize,\n panelRef: drawerRef,\n handleRef: refs?.slider,\n onResize: size => onActiveDrawerResize({ id: activeDrawerId!, size }),\n });\n const size = getLimitedValue(minDrawerSize, activeDrawerSize, maxDrawerSize);\n const lastOpenedDrawerId = drawersOpenQueue.length ? drawersOpenQueue[0] : null;\n const hasTriggerButton = !!activeGlobalDrawer?.trigger;\n\n return (\n <Transition nodeRef={drawerRef} in={show} appear={show} timeout={0}>\n {state => {\n return (\n <aside\n id={activeDrawerId}\n aria-hidden={!show}\n aria-label={computedAriaLabels.content}\n className={clsx(\n styles.drawer,\n styles['drawer-global'],\n styles[state],\n sharedStyles['with-motion-horizontal'],\n {\n [styles['drawer-hidden']]: !show,\n [styles['last-opened']]: lastOpenedDrawerId === activeDrawerId,\n [testutilStyles['active-drawer']]: show,\n }\n )}\n ref={drawerRef}\n onBlur={e => {\n // Drawers with trigger buttons follow this restore focus logic:\n // If a previously focused element exists, restore focus on it; otherwise, focus on the associated trigger button.\n // This function resets the previously focused element.\n // If the drawer has no trigger button and loses focus on the previously focused element, it defaults to document.body,\n // which ideally should never happen.\n if (!hasTriggerButton) {\n return;\n }\n\n if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n globalDrawersFocusControl.loseFocus();\n }\n }}\n style={{\n blockSize: `calc(100vh - ${drawersTopOffset}px - ${placement.insetBlockEnd}px)`,\n insetBlockStart: drawersTopOffset,\n ...(!isMobile && {\n [customCssProps.drawerSize]: `${['entering', 'entered'].includes(state) ? size : 0}px`,\n }),\n }}\n data-testid={`awsui-app-layout-drawer-${activeDrawerId}`}\n >\n {!isMobile && activeGlobalDrawer?.resizable && (\n <div className={styles['drawer-slider']}>\n <PanelResizeHandle\n ref={refs?.slider}\n position=\"side\"\n className={testutilStyles['drawers-slider']}\n ariaLabel={activeGlobalDrawer?.ariaLabels?.resizeHandle}\n ariaValuenow={resizeProps.relativeSize}\n onKeyDown={resizeProps.onKeyDown}\n onPointerDown={resizeProps.onPointerDown}\n />\n </div>\n )}\n <div className={clsx(styles['drawer-content-container'], sharedStyles['with-motion-horizontal'])}>\n <div className={clsx(styles['drawer-close-button'])}>\n <InternalButton\n ariaLabel={computedAriaLabels.closeButton}\n className={clsx({\n [testutilStyles['active-drawer-close-button']]: activeDrawerId,\n })}\n formAction=\"none\"\n iconName={isMobile ? 'close' : 'angle-right'}\n onClick={() => onActiveGlobalDrawersChange(activeDrawerId)}\n ref={refs?.close}\n variant=\"icon\"\n />\n </div>\n <div className={styles['drawer-content']}>{activeGlobalDrawer?.content}</div>\n </div>\n </aside>\n );\n }}\n </Transition>\n );\n}\n\nexport default AppLayoutGlobalDrawerImplementation;\n"]}
|
|
1
|
+
{"version":3,"file":"global-drawer.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/global-drawer.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, { useRef } from 'react';\nimport { Transition } from 'react-transition-group';\nimport clsx from 'clsx';\n\nimport { InternalButton } from '../../../button/internal';\nimport PanelResizeHandle from '../../../internal/components/panel-resize-handle';\nimport { NonCancelableEventHandler } from '../../../internal/events';\nimport customCssProps from '../../../internal/generated/custom-css-properties';\nimport { getLimitedValue } from '../../../split-panel/utils/size-utils';\nimport { AppLayoutProps } from '../../interfaces';\nimport { getDrawerStyles } from '../compute-layout';\nimport { AppLayoutInternals } from '../interfaces';\nimport { useResize } from './use-resize';\n\nimport sharedStyles from '../../resize/styles.css.js';\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\ninterface AppLayoutGlobalDrawerImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n show: boolean;\n activeGlobalDrawer:\n | (AppLayoutProps.Drawer & { onShow?: NonCancelableEventHandler; onHide?: NonCancelableEventHandler })\n | undefined;\n}\n\nfunction AppLayoutGlobalDrawerImplementation({\n appLayoutInternals,\n show,\n activeGlobalDrawer,\n}: AppLayoutGlobalDrawerImplementationProps) {\n const {\n ariaLabels,\n globalDrawersFocusControl,\n isMobile,\n placement,\n onActiveGlobalDrawersChange,\n onActiveDrawerResize,\n minGlobalDrawersSizes,\n maxGlobalDrawersSizes,\n activeGlobalDrawersSizes,\n verticalOffsets,\n drawersOpenQueue,\n } = appLayoutInternals;\n const drawerRef = useRef<HTMLDivElement>(null);\n const activeDrawerId = activeGlobalDrawer?.id ?? '';\n\n const computedAriaLabels = {\n closeButton: activeGlobalDrawer ? activeGlobalDrawer.ariaLabels?.closeButton : ariaLabels?.toolsClose,\n content: activeGlobalDrawer ? activeGlobalDrawer.ariaLabels?.drawerName : ariaLabels?.tools,\n };\n\n const { drawerTopOffset, drawerHeight } = getDrawerStyles(verticalOffsets, isMobile, placement);\n const activeDrawerSize = (activeDrawerId ? activeGlobalDrawersSizes[activeDrawerId] : 0) ?? 0;\n const minDrawerSize = (activeDrawerId ? minGlobalDrawersSizes[activeDrawerId] : 0) ?? 0;\n const maxDrawerSize = (activeDrawerId ? maxGlobalDrawersSizes[activeDrawerId] : 0) ?? 0;\n const refs = globalDrawersFocusControl.refs[activeDrawerId];\n const resizeProps = useResize({\n currentWidth: activeDrawerSize,\n minWidth: minDrawerSize,\n maxWidth: maxDrawerSize,\n panelRef: drawerRef,\n handleRef: refs?.slider,\n onResize: size => onActiveDrawerResize({ id: activeDrawerId!, size }),\n });\n const size = getLimitedValue(minDrawerSize, activeDrawerSize, maxDrawerSize);\n const lastOpenedDrawerId = drawersOpenQueue.length ? drawersOpenQueue[0] : null;\n const hasTriggerButton = !!activeGlobalDrawer?.trigger;\n\n return (\n <Transition nodeRef={drawerRef} in={show} appear={show} timeout={0}>\n {state => {\n return (\n <aside\n id={activeDrawerId}\n aria-hidden={!show}\n aria-label={computedAriaLabels.content}\n className={clsx(\n styles.drawer,\n styles['drawer-global'],\n styles[state],\n sharedStyles['with-motion-horizontal'],\n {\n [styles['drawer-hidden']]: !show,\n [styles['last-opened']]: lastOpenedDrawerId === activeDrawerId,\n [testutilStyles['active-drawer']]: show,\n }\n )}\n ref={drawerRef}\n onBlur={e => {\n // Drawers with trigger buttons follow this restore focus logic:\n // If a previously focused element exists, restore focus on it; otherwise, focus on the associated trigger button.\n // This function resets the previously focused element.\n // If the drawer has no trigger button and loses focus on the previously focused element, it defaults to document.body,\n // which ideally should never happen.\n if (!hasTriggerButton) {\n return;\n }\n\n if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n globalDrawersFocusControl.loseFocus();\n }\n }}\n style={{\n blockSize: drawerHeight,\n insetBlockStart: drawerTopOffset,\n ...(!isMobile && {\n [customCssProps.drawerSize]: `${['entering', 'entered'].includes(state) ? size : 0}px`,\n }),\n }}\n data-testid={`awsui-app-layout-drawer-${activeDrawerId}`}\n >\n {!isMobile && activeGlobalDrawer?.resizable && (\n <div className={styles['drawer-slider']}>\n <PanelResizeHandle\n ref={refs?.slider}\n position=\"side\"\n className={testutilStyles['drawers-slider']}\n ariaLabel={activeGlobalDrawer?.ariaLabels?.resizeHandle}\n ariaValuenow={resizeProps.relativeSize}\n onKeyDown={resizeProps.onKeyDown}\n onPointerDown={resizeProps.onPointerDown}\n />\n </div>\n )}\n <div\n className={clsx(styles['drawer-content-container'], sharedStyles['with-motion-horizontal'])}\n data-testid={`awsui-app-layout-drawer-content-${activeDrawerId}`}\n >\n <div className={clsx(styles['drawer-close-button'])}>\n <InternalButton\n ariaLabel={computedAriaLabels.closeButton}\n className={clsx({\n [testutilStyles['active-drawer-close-button']]: activeDrawerId,\n })}\n formAction=\"none\"\n iconName={isMobile ? 'close' : 'angle-right'}\n onClick={() => onActiveGlobalDrawersChange(activeDrawerId)}\n ref={refs?.close}\n variant=\"icon\"\n />\n </div>\n <div className={styles['drawer-content']} style={{ blockSize: drawerHeight }}>\n {activeGlobalDrawer?.content}\n </div>\n </div>\n </aside>\n );\n }}\n </Transition>\n );\n}\n\nexport default AppLayoutGlobalDrawerImplementation;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"local-drawer.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/local-drawer.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAOnD,UAAU,kCAAkC;IAC1C,kBAAkB,EAAE,kBAAkB,CAAC;CACxC;AAED,wBAAgB,6BAA6B,CAAC,EAAE,kBAAkB,EAAE,EAAE,kCAAkC,
|
|
1
|
+
{"version":3,"file":"local-drawer.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/local-drawer.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAOnD,UAAU,kCAAkC;IAC1C,kBAAkB,EAAE,kBAAkB,CAAC;CACxC;AAED,wBAAgB,6BAA6B,CAAC,EAAE,kBAAkB,EAAE,EAAE,kCAAkC,eAuHvG;AAED,eAAO,MAAM,+BAA+B,qGAA2D,CAAC"}
|
|
@@ -9,7 +9,7 @@ import customCssProps from '../../../internal/generated/custom-css-properties';
|
|
|
9
9
|
import { createWidgetizedComponent } from '../../../internal/widgets';
|
|
10
10
|
import { getLimitedValue } from '../../../split-panel/utils/size-utils';
|
|
11
11
|
import { TOOLS_DRAWER_ID } from '../../utils/use-drawers';
|
|
12
|
-
import {
|
|
12
|
+
import { getDrawerStyles } from '../compute-layout';
|
|
13
13
|
import { useResize } from './use-resize';
|
|
14
14
|
import sharedStyles from '../../resize/styles.css.js';
|
|
15
15
|
import testutilStyles from '../../test-classes/styles.css.js';
|
|
@@ -23,7 +23,7 @@ export function AppLayoutDrawerImplementation({ appLayoutInternals }) {
|
|
|
23
23
|
closeButton: activeDrawer ? (_a = activeDrawer.ariaLabels) === null || _a === void 0 ? void 0 : _a.closeButton : ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.toolsClose,
|
|
24
24
|
content: activeDrawer ? (_b = activeDrawer.ariaLabels) === null || _b === void 0 ? void 0 : _b.drawerName : ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.tools,
|
|
25
25
|
};
|
|
26
|
-
const
|
|
26
|
+
const { drawerTopOffset, drawerHeight } = getDrawerStyles(verticalOffsets, isMobile, placement);
|
|
27
27
|
const toolsOnlyMode = drawers.length === 1 && drawers[0].id === TOOLS_DRAWER_ID;
|
|
28
28
|
const isToolsDrawer = (activeDrawer === null || activeDrawer === void 0 ? void 0 : activeDrawer.id) === TOOLS_DRAWER_ID || toolsOnlyMode;
|
|
29
29
|
const toolsContent = (_c = drawers === null || drawers === void 0 ? void 0 : drawers.find(drawer => drawer.id === TOOLS_DRAWER_ID)) === null || _c === void 0 ? void 0 : _c.content;
|
|
@@ -52,7 +52,7 @@ export function AppLayoutDrawerImplementation({ appLayoutInternals }) {
|
|
|
52
52
|
if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {
|
|
53
53
|
drawersFocusControl.loseFocus();
|
|
54
54
|
}
|
|
55
|
-
}, style: Object.assign({ blockSize:
|
|
55
|
+
}, style: Object.assign({ blockSize: drawerHeight, insetBlockStart: drawerTopOffset }, (!isMobile &&
|
|
56
56
|
!isLegacyDrawer && {
|
|
57
57
|
[customCssProps.drawerSize]: `${['entering', 'entered'].includes(state) ? size : 0}px`,
|
|
58
58
|
})), "data-testid": `awsui-app-layout-drawer-${activeDrawerId}` },
|
|
@@ -64,8 +64,8 @@ export function AppLayoutDrawerImplementation({ appLayoutInternals }) {
|
|
|
64
64
|
[testutilStyles['active-drawer-close-button']]: !isToolsDrawer && activeDrawerId,
|
|
65
65
|
[testutilStyles['tools-close']]: isToolsDrawer,
|
|
66
66
|
}), formAction: "none", iconName: isMobile ? 'close' : 'angle-right', onClick: () => onActiveDrawerChange(null), ref: drawersFocusControl.refs.close, variant: "icon" })),
|
|
67
|
-
React.createElement("div", { className: clsx(styles['drawer-content'], activeDrawerId !== TOOLS_DRAWER_ID && styles['drawer-content-hidden']) }, toolsContent),
|
|
68
|
-
activeDrawerId !== TOOLS_DRAWER_ID && (React.createElement("div", { className: styles['drawer-content'] }, activeDrawer === null || activeDrawer === void 0 ? void 0 : activeDrawer.content)))));
|
|
67
|
+
React.createElement("div", { className: clsx(styles['drawer-content'], activeDrawerId !== TOOLS_DRAWER_ID && styles['drawer-content-hidden']), style: { blockSize: drawerHeight } }, toolsContent),
|
|
68
|
+
activeDrawerId !== TOOLS_DRAWER_ID && (React.createElement("div", { className: styles['drawer-content'], style: { blockSize: drawerHeight } }, activeDrawer === null || activeDrawer === void 0 ? void 0 : activeDrawer.content)))));
|
|
69
69
|
}));
|
|
70
70
|
}
|
|
71
71
|
export const createWidgetizedAppLayoutDrawer = createWidgetizedComponent(AppLayoutDrawerImplementation);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"local-drawer.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/local-drawer.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, { useRef } from 'react';\nimport { Transition } from 'react-transition-group';\nimport clsx from 'clsx';\n\nimport { InternalButton } from '../../../button/internal';\nimport PanelResizeHandle from '../../../internal/components/panel-resize-handle';\nimport customCssProps from '../../../internal/generated/custom-css-properties';\nimport { createWidgetizedComponent } from '../../../internal/widgets';\nimport { getLimitedValue } from '../../../split-panel/utils/size-utils';\nimport { TOOLS_DRAWER_ID } from '../../utils/use-drawers';\nimport { getDrawerTopOffset } from '../compute-layout';\nimport { AppLayoutInternals } from '../interfaces';\nimport { useResize } from './use-resize';\n\nimport sharedStyles from '../../resize/styles.css.js';\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\ninterface AppLayoutDrawerImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n}\n\nexport function AppLayoutDrawerImplementation({ appLayoutInternals }: AppLayoutDrawerImplementationProps) {\n const {\n activeDrawer,\n minDrawerSize,\n activeDrawerSize,\n maxDrawerSize,\n ariaLabels,\n drawers,\n drawersFocusControl,\n isMobile,\n placement,\n verticalOffsets,\n drawersOpenQueue,\n onActiveDrawerChange,\n onActiveDrawerResize,\n } = appLayoutInternals;\n const drawerRef = useRef<HTMLDivElement>(null);\n const activeDrawerId = activeDrawer?.id;\n\n const computedAriaLabels = {\n closeButton: activeDrawer ? activeDrawer.ariaLabels?.closeButton : ariaLabels?.toolsClose,\n content: activeDrawer ? activeDrawer.ariaLabels?.drawerName : ariaLabels?.tools,\n };\n\n const drawersTopOffset = getDrawerTopOffset(verticalOffsets, isMobile, placement);\n const toolsOnlyMode = drawers.length === 1 && drawers[0].id === TOOLS_DRAWER_ID;\n const isToolsDrawer = activeDrawer?.id === TOOLS_DRAWER_ID || toolsOnlyMode;\n const toolsContent = drawers?.find(drawer => drawer.id === TOOLS_DRAWER_ID)?.content;\n const resizeProps = useResize({\n currentWidth: activeDrawerSize,\n minWidth: minDrawerSize,\n maxWidth: maxDrawerSize,\n panelRef: drawerRef,\n handleRef: drawersFocusControl.refs.slider,\n onResize: size => onActiveDrawerResize({ id: activeDrawerId!, size }),\n });\n // temporary handle a situation when app-layout is old, but this component come as a widget\n const isLegacyDrawer = drawersOpenQueue === undefined;\n const size = getLimitedValue(minDrawerSize, activeDrawerSize, maxDrawerSize);\n const lastOpenedDrawerId = drawersOpenQueue?.length ? drawersOpenQueue[0] : activeDrawerId;\n\n return (\n <Transition nodeRef={drawerRef} in={!!activeDrawer} appear={true} timeout={0}>\n {state => (\n <aside\n id={activeDrawerId}\n aria-hidden={!activeDrawer}\n aria-label={computedAriaLabels.content}\n className={clsx(styles.drawer, sharedStyles['with-motion-horizontal'], {\n [styles['last-opened']]: lastOpenedDrawerId === activeDrawerId,\n [styles.legacy]: isLegacyDrawer,\n [testutilStyles['active-drawer']]: !toolsOnlyMode && activeDrawerId,\n [testutilStyles.tools]: isToolsDrawer,\n [styles['drawer-hidden']]: !activeDrawer,\n [testutilStyles['drawer-closed']]: !activeDrawer,\n })}\n ref={drawerRef}\n onBlur={e => {\n if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n drawersFocusControl.loseFocus();\n }\n }}\n style={{\n blockSize: `calc(100vh - ${drawersTopOffset}px - ${placement.insetBlockEnd}px)`,\n insetBlockStart: drawersTopOffset,\n ...(!isMobile &&\n !isLegacyDrawer && {\n [customCssProps.drawerSize]: `${['entering', 'entered'].includes(state) ? size : 0}px`,\n }),\n }}\n data-testid={`awsui-app-layout-drawer-${activeDrawerId}`}\n >\n {!isMobile && activeDrawer?.resizable && (\n <div className={styles['drawer-slider']}>\n <PanelResizeHandle\n ref={drawersFocusControl.refs.slider}\n position=\"side\"\n className={testutilStyles['drawers-slider']}\n ariaLabel={activeDrawer?.ariaLabels?.resizeHandle}\n ariaValuenow={resizeProps.relativeSize}\n onKeyDown={resizeProps.onKeyDown}\n onPointerDown={resizeProps.onPointerDown}\n />\n </div>\n )}\n <div className={clsx(styles['drawer-content-container'], sharedStyles['with-motion-horizontal'])}>\n <div className={clsx(styles['drawer-close-button'])}>\n <InternalButton\n ariaLabel={computedAriaLabels.closeButton}\n className={clsx({\n [testutilStyles['active-drawer-close-button']]: !isToolsDrawer && activeDrawerId,\n [testutilStyles['tools-close']]: isToolsDrawer,\n })}\n formAction=\"none\"\n iconName={isMobile ? 'close' : 'angle-right'}\n onClick={() => onActiveDrawerChange(null)}\n ref={drawersFocusControl.refs.close}\n variant=\"icon\"\n />\n </div>\n <div\n className={clsx(\n styles['drawer-content'],\n activeDrawerId !== TOOLS_DRAWER_ID && styles['drawer-content-hidden']\n )}\n >\n {toolsContent}\n </div>\n {activeDrawerId !== TOOLS_DRAWER_ID && (\n <div className={styles['drawer-content']}>{activeDrawer?.content}</div>\n )}\n </div>\n </aside>\n )}\n </Transition>\n );\n}\n\nexport const createWidgetizedAppLayoutDrawer = createWidgetizedComponent(AppLayoutDrawerImplementation);\n"]}
|
|
1
|
+
{"version":3,"file":"local-drawer.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/local-drawer.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, { useRef } from 'react';\nimport { Transition } from 'react-transition-group';\nimport clsx from 'clsx';\n\nimport { InternalButton } from '../../../button/internal';\nimport PanelResizeHandle from '../../../internal/components/panel-resize-handle';\nimport customCssProps from '../../../internal/generated/custom-css-properties';\nimport { createWidgetizedComponent } from '../../../internal/widgets';\nimport { getLimitedValue } from '../../../split-panel/utils/size-utils';\nimport { TOOLS_DRAWER_ID } from '../../utils/use-drawers';\nimport { getDrawerStyles } from '../compute-layout';\nimport { AppLayoutInternals } from '../interfaces';\nimport { useResize } from './use-resize';\n\nimport sharedStyles from '../../resize/styles.css.js';\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\ninterface AppLayoutDrawerImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n}\n\nexport function AppLayoutDrawerImplementation({ appLayoutInternals }: AppLayoutDrawerImplementationProps) {\n const {\n activeDrawer,\n minDrawerSize,\n activeDrawerSize,\n maxDrawerSize,\n ariaLabels,\n drawers,\n drawersFocusControl,\n isMobile,\n placement,\n verticalOffsets,\n drawersOpenQueue,\n onActiveDrawerChange,\n onActiveDrawerResize,\n } = appLayoutInternals;\n const drawerRef = useRef<HTMLDivElement>(null);\n const activeDrawerId = activeDrawer?.id;\n\n const computedAriaLabels = {\n closeButton: activeDrawer ? activeDrawer.ariaLabels?.closeButton : ariaLabels?.toolsClose,\n content: activeDrawer ? activeDrawer.ariaLabels?.drawerName : ariaLabels?.tools,\n };\n\n const { drawerTopOffset, drawerHeight } = getDrawerStyles(verticalOffsets, isMobile, placement);\n const toolsOnlyMode = drawers.length === 1 && drawers[0].id === TOOLS_DRAWER_ID;\n const isToolsDrawer = activeDrawer?.id === TOOLS_DRAWER_ID || toolsOnlyMode;\n const toolsContent = drawers?.find(drawer => drawer.id === TOOLS_DRAWER_ID)?.content;\n const resizeProps = useResize({\n currentWidth: activeDrawerSize,\n minWidth: minDrawerSize,\n maxWidth: maxDrawerSize,\n panelRef: drawerRef,\n handleRef: drawersFocusControl.refs.slider,\n onResize: size => onActiveDrawerResize({ id: activeDrawerId!, size }),\n });\n // temporary handle a situation when app-layout is old, but this component come as a widget\n const isLegacyDrawer = drawersOpenQueue === undefined;\n const size = getLimitedValue(minDrawerSize, activeDrawerSize, maxDrawerSize);\n const lastOpenedDrawerId = drawersOpenQueue?.length ? drawersOpenQueue[0] : activeDrawerId;\n\n return (\n <Transition nodeRef={drawerRef} in={!!activeDrawer} appear={true} timeout={0}>\n {state => (\n <aside\n id={activeDrawerId}\n aria-hidden={!activeDrawer}\n aria-label={computedAriaLabels.content}\n className={clsx(styles.drawer, sharedStyles['with-motion-horizontal'], {\n [styles['last-opened']]: lastOpenedDrawerId === activeDrawerId,\n [styles.legacy]: isLegacyDrawer,\n [testutilStyles['active-drawer']]: !toolsOnlyMode && activeDrawerId,\n [testutilStyles.tools]: isToolsDrawer,\n [styles['drawer-hidden']]: !activeDrawer,\n [testutilStyles['drawer-closed']]: !activeDrawer,\n })}\n ref={drawerRef}\n onBlur={e => {\n if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n drawersFocusControl.loseFocus();\n }\n }}\n style={{\n blockSize: drawerHeight,\n insetBlockStart: drawerTopOffset,\n ...(!isMobile &&\n !isLegacyDrawer && {\n [customCssProps.drawerSize]: `${['entering', 'entered'].includes(state) ? size : 0}px`,\n }),\n }}\n data-testid={`awsui-app-layout-drawer-${activeDrawerId}`}\n >\n {!isMobile && activeDrawer?.resizable && (\n <div className={styles['drawer-slider']}>\n <PanelResizeHandle\n ref={drawersFocusControl.refs.slider}\n position=\"side\"\n className={testutilStyles['drawers-slider']}\n ariaLabel={activeDrawer?.ariaLabels?.resizeHandle}\n ariaValuenow={resizeProps.relativeSize}\n onKeyDown={resizeProps.onKeyDown}\n onPointerDown={resizeProps.onPointerDown}\n />\n </div>\n )}\n <div className={clsx(styles['drawer-content-container'], sharedStyles['with-motion-horizontal'])}>\n <div className={clsx(styles['drawer-close-button'])}>\n <InternalButton\n ariaLabel={computedAriaLabels.closeButton}\n className={clsx({\n [testutilStyles['active-drawer-close-button']]: !isToolsDrawer && activeDrawerId,\n [testutilStyles['tools-close']]: isToolsDrawer,\n })}\n formAction=\"none\"\n iconName={isMobile ? 'close' : 'angle-right'}\n onClick={() => onActiveDrawerChange(null)}\n ref={drawersFocusControl.refs.close}\n variant=\"icon\"\n />\n </div>\n <div\n className={clsx(\n styles['drawer-content'],\n activeDrawerId !== TOOLS_DRAWER_ID && styles['drawer-content-hidden']\n )}\n style={{ blockSize: drawerHeight }}\n >\n {toolsContent}\n </div>\n {activeDrawerId !== TOOLS_DRAWER_ID && (\n <div className={styles['drawer-content']} style={{ blockSize: drawerHeight }}>\n {activeDrawer?.content}\n </div>\n )}\n </div>\n </aside>\n )}\n </Transition>\n );\n}\n\nexport const createWidgetizedAppLayoutDrawer = createWidgetizedComponent(AppLayoutDrawerImplementation);\n"]}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"drawer": "
|
|
5
|
-
"legacy": "
|
|
6
|
-
"last-opened": "awsui_last-
|
|
7
|
-
"drawer-global": "awsui_drawer-
|
|
8
|
-
"drawer-hidden": "awsui_drawer-
|
|
9
|
-
"drawer-content-container": "awsui_drawer-content-
|
|
10
|
-
"drawer-close-button": "awsui_drawer-close-
|
|
11
|
-
"drawer-content": "awsui_drawer-
|
|
12
|
-
"drawer-content-hidden": "awsui_drawer-content-
|
|
13
|
-
"drawer-slider": "awsui_drawer-
|
|
4
|
+
"drawer": "awsui_drawer_12i0j_1rytq_185",
|
|
5
|
+
"legacy": "awsui_legacy_12i0j_1rytq_200",
|
|
6
|
+
"last-opened": "awsui_last-opened_12i0j_1rytq_208",
|
|
7
|
+
"drawer-global": "awsui_drawer-global_12i0j_1rytq_213",
|
|
8
|
+
"drawer-hidden": "awsui_drawer-hidden_12i0j_1rytq_217",
|
|
9
|
+
"drawer-content-container": "awsui_drawer-content-container_12i0j_1rytq_220",
|
|
10
|
+
"drawer-close-button": "awsui_drawer-close-button_12i0j_1rytq_228",
|
|
11
|
+
"drawer-content": "awsui_drawer-content_12i0j_1rytq_220",
|
|
12
|
+
"drawer-content-hidden": "awsui_drawer-content-hidden_12i0j_1rytq_238",
|
|
13
|
+
"drawer-slider": "awsui_drawer-slider_12i0j_1rytq_241"
|
|
14
14
|
};
|
|
15
15
|
|
|
@@ -182,7 +182,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
182
182
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
183
183
|
SPDX-License-Identifier: Apache-2.0
|
|
184
184
|
*/
|
|
185
|
-
.
|
|
185
|
+
.awsui_drawer_12i0j_1rytq_185:not(#\9) {
|
|
186
186
|
position: sticky;
|
|
187
187
|
z-index: 830;
|
|
188
188
|
background-color: var(--color-background-container-content-z79u4u, #ffffff);
|
|
@@ -197,30 +197,27 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
197
197
|
word-wrap: break-word;
|
|
198
198
|
}
|
|
199
199
|
@media (min-width: 689px) {
|
|
200
|
-
.
|
|
200
|
+
.awsui_drawer_12i0j_1rytq_185:not(#\9):not(.awsui_legacy_12i0j_1rytq_200) {
|
|
201
201
|
border-inline-start: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-layout-hrw5xj, #b4b4bb);
|
|
202
202
|
}
|
|
203
203
|
}
|
|
204
204
|
@media (max-width: 688px) {
|
|
205
|
-
.
|
|
205
|
+
.awsui_drawer_12i0j_1rytq_185:not(#\9) {
|
|
206
206
|
inline-size: 100%;
|
|
207
207
|
}
|
|
208
|
-
.
|
|
208
|
+
.awsui_drawer_12i0j_1rytq_185.awsui_last-opened_12i0j_1rytq_208:not(#\9) {
|
|
209
209
|
z-index: 1001;
|
|
210
210
|
}
|
|
211
211
|
}
|
|
212
212
|
@media (max-width: 688px) {
|
|
213
|
-
.
|
|
213
|
+
.awsui_drawer_12i0j_1rytq_185.awsui_drawer-global_12i0j_1rytq_213:not(#\9):not(.awsui_last-opened_12i0j_1rytq_208) {
|
|
214
214
|
display: none;
|
|
215
215
|
}
|
|
216
|
-
.awsui_drawer_12i0j_qyp9i_185.awsui_drawer-global_12i0j_qyp9i_213.awsui_last-opened_12i0j_qyp9i_208:not(#\9) {
|
|
217
|
-
display: block;
|
|
218
|
-
}
|
|
219
216
|
}
|
|
220
|
-
.
|
|
217
|
+
.awsui_drawer_12i0j_1rytq_185.awsui_drawer-hidden_12i0j_1rytq_217:not(#\9) {
|
|
221
218
|
display: none;
|
|
222
219
|
}
|
|
223
|
-
.
|
|
220
|
+
.awsui_drawer_12i0j_1rytq_185 > .awsui_drawer-content-container_12i0j_1rytq_220:not(#\9) {
|
|
224
221
|
grid-column: 1/span 2;
|
|
225
222
|
grid-row: 1;
|
|
226
223
|
display: grid;
|
|
@@ -228,19 +225,20 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
228
225
|
grid-template-rows: 14px auto 1fr;
|
|
229
226
|
overflow-y: auto;
|
|
230
227
|
}
|
|
231
|
-
.
|
|
228
|
+
.awsui_drawer_12i0j_1rytq_185 > .awsui_drawer-content-container_12i0j_1rytq_220 > .awsui_drawer-close-button_12i0j_1rytq_228:not(#\9) {
|
|
232
229
|
grid-column: 3;
|
|
233
230
|
grid-row: 2;
|
|
234
231
|
z-index: 1;
|
|
232
|
+
align-self: start;
|
|
235
233
|
}
|
|
236
|
-
.
|
|
234
|
+
.awsui_drawer_12i0j_1rytq_185 > .awsui_drawer-content-container_12i0j_1rytq_220 > .awsui_drawer-content_12i0j_1rytq_220:not(#\9) {
|
|
237
235
|
grid-column: 1/span 4;
|
|
238
236
|
grid-row: 1/span 2;
|
|
239
237
|
}
|
|
240
|
-
.
|
|
238
|
+
.awsui_drawer_12i0j_1rytq_185 > .awsui_drawer-content-container_12i0j_1rytq_220 > .awsui_drawer-content_12i0j_1rytq_220.awsui_drawer-content-hidden_12i0j_1rytq_238:not(#\9) {
|
|
241
239
|
display: none;
|
|
242
240
|
}
|
|
243
|
-
.
|
|
241
|
+
.awsui_drawer_12i0j_1rytq_185 > .awsui_drawer-slider_12i0j_1rytq_241:not(#\9) {
|
|
244
242
|
grid-column: 1;
|
|
245
243
|
grid-row: 1;
|
|
246
244
|
block-size: 100%;
|
|
@@ -2,15 +2,15 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"drawer": "
|
|
6
|
-
"legacy": "
|
|
7
|
-
"last-opened": "awsui_last-
|
|
8
|
-
"drawer-global": "awsui_drawer-
|
|
9
|
-
"drawer-hidden": "awsui_drawer-
|
|
10
|
-
"drawer-content-container": "awsui_drawer-content-
|
|
11
|
-
"drawer-close-button": "awsui_drawer-close-
|
|
12
|
-
"drawer-content": "awsui_drawer-
|
|
13
|
-
"drawer-content-hidden": "awsui_drawer-content-
|
|
14
|
-
"drawer-slider": "awsui_drawer-
|
|
5
|
+
"drawer": "awsui_drawer_12i0j_1rytq_185",
|
|
6
|
+
"legacy": "awsui_legacy_12i0j_1rytq_200",
|
|
7
|
+
"last-opened": "awsui_last-opened_12i0j_1rytq_208",
|
|
8
|
+
"drawer-global": "awsui_drawer-global_12i0j_1rytq_213",
|
|
9
|
+
"drawer-hidden": "awsui_drawer-hidden_12i0j_1rytq_217",
|
|
10
|
+
"drawer-content-container": "awsui_drawer-content-container_12i0j_1rytq_220",
|
|
11
|
+
"drawer-close-button": "awsui_drawer-close-button_12i0j_1rytq_228",
|
|
12
|
+
"drawer-content": "awsui_drawer-content_12i0j_1rytq_220",
|
|
13
|
+
"drawer-content-hidden": "awsui_drawer-content-hidden_12i0j_1rytq_238",
|
|
14
|
+
"drawer-slider": "awsui_drawer-slider_12i0j_1rytq_241"
|
|
15
15
|
};
|
|
16
16
|
|