@cloudscape-design/components-themeable 3.0.834 → 3.0.836
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/lib/internal/manifest.json +1 -1
- package/lib/internal/scss/app-layout/drawer/styles.scss +5 -0
- package/lib/internal/scss/app-layout/visual-refresh/drawers.scss +1 -0
- package/lib/internal/scss/app-layout/visual-refresh/navigation.scss +6 -0
- package/lib/internal/scss/app-layout/visual-refresh-toolbar/drawer/styles.scss +3 -4
- package/lib/internal/scss/app-layout/visual-refresh-toolbar/navigation/styles.scss +6 -0
- package/lib/internal/template/app-layout/drawer/index.d.ts.map +1 -1
- package/lib/internal/template/app-layout/drawer/index.js +3 -1
- package/lib/internal/template/app-layout/drawer/index.js.map +1 -1
- package/lib/internal/template/app-layout/drawer/styles.css.js +14 -13
- package/lib/internal/template/app-layout/drawer/styles.scoped.css +26 -21
- package/lib/internal/template/app-layout/drawer/styles.selectors.js +14 -13
- package/lib/internal/template/app-layout/split-panel/provider.d.ts +1 -0
- package/lib/internal/template/app-layout/split-panel/provider.d.ts.map +1 -1
- package/lib/internal/template/app-layout/split-panel/provider.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh/navigation.js +1 -1
- package/lib/internal/template/app-layout/visual-refresh/navigation.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh/styles.css.js +86 -85
- package/lib/internal/template/app-layout/visual-refresh/styles.scoped.css +168 -162
- package/lib/internal/template/app-layout/visual-refresh/styles.selectors.js +86 -85
- package/lib/internal/template/app-layout/visual-refresh-toolbar/compute-layout.d.ts +4 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/compute-layout.d.ts.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/compute-layout.js +4 -2
- package/lib/internal/template/app-layout/visual-refresh-toolbar/compute-layout.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-drawer.d.ts +2 -7
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-drawer.d.ts.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-drawer.js +7 -6
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-drawer.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/local-drawer.d.ts.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/local-drawer.js +8 -6
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/local-drawer.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.css.js +10 -10
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.scoped.css +12 -14
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.selectors.js +10 -10
- package/lib/internal/template/app-layout/visual-refresh-toolbar/index.d.ts.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/index.js +6 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/index.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/interfaces.d.ts +8 -4
- package/lib/internal/template/app-layout/visual-refresh-toolbar/interfaces.d.ts.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/interfaces.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/index.js +5 -5
- package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/index.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/styles.css.js +5 -4
- package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/styles.scoped.css +10 -5
- package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/styles.selectors.js +5 -4
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/index.d.ts +1 -0
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/index.d.ts.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/index.js +2 -2
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/index.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/split-panel/index.d.ts +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/split-panel/index.d.ts.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/split-panel/index.js +7 -7
- package/lib/internal/template/app-layout/visual-refresh-toolbar/split-panel/index.js.map +1 -1
- package/lib/internal/template/internal/context/split-panel-context.d.ts +1 -0
- package/lib/internal/template/internal/context/split-panel-context.d.ts.map +1 -1
- package/lib/internal/template/internal/context/split-panel-context.js.map +1 -1
- package/lib/internal/template/internal/environment.js +1 -1
- package/lib/internal/template/internal/environment.json +1 -1
- package/lib/internal/template/split-panel/bottom.d.ts.map +1 -1
- package/lib/internal/template/split-panel/bottom.js +3 -2
- package/lib/internal/template/split-panel/bottom.js.map +1 -1
- package/lib/internal/template/split-panel/side.d.ts.map +1 -1
- package/lib/internal/template/split-panel/side.js +3 -2
- package/lib/internal/template/split-panel/side.js.map +1 -1
- package/package.json +1 -1
|
@@ -12,7 +12,7 @@ export interface AppLayoutSplitPanelDrawerBottomImplementationProps {
|
|
|
12
12
|
splitPanelInternals: SplitPanelProviderProps;
|
|
13
13
|
children: React.ReactNode;
|
|
14
14
|
}
|
|
15
|
-
export declare function AppLayoutSplitPanelDrawerBottomImplementation({ children, splitPanelInternals, }: AppLayoutSplitPanelDrawerBottomImplementationProps): JSX.Element;
|
|
15
|
+
export declare function AppLayoutSplitPanelDrawerBottomImplementation({ children, splitPanelInternals, appLayoutInternals, }: AppLayoutSplitPanelDrawerBottomImplementationProps): JSX.Element;
|
|
16
16
|
export declare const createWidgetizedAppLayoutSplitPanelDrawerSide: (Loader?: typeof AppLayoutSplitPanelDrawerSideImplementation | undefined) => typeof AppLayoutSplitPanelDrawerSideImplementation;
|
|
17
17
|
export declare const createWidgetizedAppLayoutSplitPanelDrawerBottom: (Loader?: typeof AppLayoutSplitPanelDrawerBottomImplementation | undefined) => typeof AppLayoutSplitPanelDrawerBottomImplementation;
|
|
18
18
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/split-panel/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAsB,uBAAuB,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/split-panel/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAsB,uBAAuB,EAAE,MAAM,mBAAmB,CAAC;AAEhF,OAAO,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAInD,UAAU,gDAAgD;IACxD,kBAAkB,EAAE,kBAAkB,CAAC;IACvC,mBAAmB,EAAE,uBAAuB,CAAC;IAC7C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,2CAA2C,CAAC,EAC1D,QAAQ,EACR,kBAAkB,EAClB,mBAAmB,GACpB,EAAE,gDAAgD,eAkBlD;AAED,MAAM,WAAW,kDAAkD;IACjE,kBAAkB,EAAE,kBAAkB,CAAC;IACvC,mBAAmB,EAAE,uBAAuB,CAAC;IAC7C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,6CAA6C,CAAC,EAC5D,QAAQ,EACR,mBAAmB,EACnB,kBAAkB,GACnB,EAAE,kDAAkD,eAMpD;AAED,eAAO,MAAM,6CAA6C,iIAEzD,CAAC;AAEF,eAAO,MAAM,+CAA+C,qIAE3D,CAAC"}
|
|
@@ -3,19 +3,19 @@
|
|
|
3
3
|
import React from 'react';
|
|
4
4
|
import { createWidgetizedComponent } from '../../../internal/widgets';
|
|
5
5
|
import { SplitPanelProvider } from '../../split-panel';
|
|
6
|
+
import { getDrawerStyles } from '../compute-layout';
|
|
6
7
|
import styles from './styles.css.js';
|
|
7
8
|
export function AppLayoutSplitPanelDrawerSideImplementation({ children, appLayoutInternals, splitPanelInternals, }) {
|
|
8
|
-
|
|
9
|
-
const {
|
|
10
|
-
|
|
11
|
-
return (React.createElement(SplitPanelProvider, Object.assign({}, splitPanelInternals),
|
|
9
|
+
const { splitPanelControlId, placement, verticalOffsets, isMobile, splitPanelAnimationDisabled } = appLayoutInternals;
|
|
10
|
+
const { drawerTopOffset, drawerHeight } = getDrawerStyles(verticalOffsets, isMobile, placement);
|
|
11
|
+
return (React.createElement(SplitPanelProvider, Object.assign({}, splitPanelInternals, { animationDisabled: splitPanelAnimationDisabled }),
|
|
12
12
|
React.createElement("section", { id: splitPanelControlId, className: styles['split-panel-side'], style: {
|
|
13
|
-
blockSize:
|
|
13
|
+
blockSize: drawerHeight,
|
|
14
14
|
insetBlockStart: drawerTopOffset,
|
|
15
15
|
} }, children)));
|
|
16
16
|
}
|
|
17
|
-
export function AppLayoutSplitPanelDrawerBottomImplementation({ children, splitPanelInternals, }) {
|
|
18
|
-
return React.createElement(SplitPanelProvider, Object.assign({}, splitPanelInternals), children);
|
|
17
|
+
export function AppLayoutSplitPanelDrawerBottomImplementation({ children, splitPanelInternals, appLayoutInternals, }) {
|
|
18
|
+
return (React.createElement(SplitPanelProvider, Object.assign({}, splitPanelInternals, { animationDisabled: appLayoutInternals.splitPanelAnimationDisabled }), children));
|
|
19
19
|
}
|
|
20
20
|
export const createWidgetizedAppLayoutSplitPanelDrawerSide = createWidgetizedComponent(AppLayoutSplitPanelDrawerSideImplementation);
|
|
21
21
|
export const createWidgetizedAppLayoutSplitPanelDrawerBottom = createWidgetizedComponent(AppLayoutSplitPanelDrawerBottomImplementation);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/split-panel/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAA2B,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/split-panel/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAA2B,MAAM,mBAAmB,CAAC;AAChF,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGpD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAQrC,MAAM,UAAU,2CAA2C,CAAC,EAC1D,QAAQ,EACR,kBAAkB,EAClB,mBAAmB,GAC8B;IACjD,MAAM,EAAE,mBAAmB,EAAE,SAAS,EAAE,eAAe,EAAE,QAAQ,EAAE,2BAA2B,EAAE,GAAG,kBAAkB,CAAC;IACtH,MAAM,EAAE,eAAe,EAAE,YAAY,EAAE,GAAG,eAAe,CAAC,eAAe,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;IAEhG,OAAO,CACL,oBAAC,kBAAkB,oBAAK,mBAAmB,IAAE,iBAAiB,EAAE,2BAA2B;QACzF,iCACE,EAAE,EAAE,mBAAmB,EACvB,SAAS,EAAE,MAAM,CAAC,kBAAkB,CAAC,EACrC,KAAK,EAAE;gBACL,SAAS,EAAE,YAAY;gBACvB,eAAe,EAAE,eAAe;aACjC,IAEA,QAAQ,CACD,CACS,CACtB,CAAC;AACJ,CAAC;AAQD,MAAM,UAAU,6CAA6C,CAAC,EAC5D,QAAQ,EACR,mBAAmB,EACnB,kBAAkB,GACiC;IACnD,OAAO,CACL,oBAAC,kBAAkB,oBAAK,mBAAmB,IAAE,iBAAiB,EAAE,kBAAkB,CAAC,2BAA2B,KAC3G,QAAQ,CACU,CACtB,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,6CAA6C,GAAG,yBAAyB,CACpF,2CAA2C,CAC5C,CAAC;AAEF,MAAM,CAAC,MAAM,+CAA+C,GAAG,yBAAyB,CACtF,6CAA6C,CAC9C,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { createWidgetizedComponent } from '../../../internal/widgets';\nimport { SplitPanelProvider, SplitPanelProviderProps } from '../../split-panel';\nimport { getDrawerStyles } from '../compute-layout';\nimport { AppLayoutInternals } from '../interfaces';\n\nimport styles from './styles.css.js';\n\ninterface AppLayoutSplitPanelDrawerSideImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n splitPanelInternals: SplitPanelProviderProps;\n children: React.ReactNode;\n}\n\nexport function AppLayoutSplitPanelDrawerSideImplementation({\n children,\n appLayoutInternals,\n splitPanelInternals,\n}: AppLayoutSplitPanelDrawerSideImplementationProps) {\n const { splitPanelControlId, placement, verticalOffsets, isMobile, splitPanelAnimationDisabled } = appLayoutInternals;\n const { drawerTopOffset, drawerHeight } = getDrawerStyles(verticalOffsets, isMobile, placement);\n\n return (\n <SplitPanelProvider {...splitPanelInternals} animationDisabled={splitPanelAnimationDisabled}>\n <section\n id={splitPanelControlId}\n className={styles['split-panel-side']}\n style={{\n blockSize: drawerHeight,\n insetBlockStart: drawerTopOffset,\n }}\n >\n {children}\n </section>\n </SplitPanelProvider>\n );\n}\n\nexport interface AppLayoutSplitPanelDrawerBottomImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n splitPanelInternals: SplitPanelProviderProps;\n children: React.ReactNode;\n}\n\nexport function AppLayoutSplitPanelDrawerBottomImplementation({\n children,\n splitPanelInternals,\n appLayoutInternals,\n}: AppLayoutSplitPanelDrawerBottomImplementationProps) {\n return (\n <SplitPanelProvider {...splitPanelInternals} animationDisabled={appLayoutInternals.splitPanelAnimationDisabled}>\n {children}\n </SplitPanelProvider>\n );\n}\n\nexport const createWidgetizedAppLayoutSplitPanelDrawerSide = createWidgetizedComponent(\n AppLayoutSplitPanelDrawerSideImplementation\n);\n\nexport const createWidgetizedAppLayoutSplitPanelDrawerBottom = createWidgetizedComponent(\n AppLayoutSplitPanelDrawerBottomImplementation\n);\n"]}
|
|
@@ -30,6 +30,7 @@ export interface SplitPanelContextBaseProps {
|
|
|
30
30
|
}
|
|
31
31
|
export interface SplitPanelContextProps extends SplitPanelContextBaseProps {
|
|
32
32
|
relativeSize: number;
|
|
33
|
+
animationDisabled?: boolean;
|
|
33
34
|
}
|
|
34
35
|
export declare const SplitPanelContextProvider: React.Provider<SplitPanelContextProps | null>;
|
|
35
36
|
export declare function useSplitPanelContext(): SplitPanelContextProps;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"split-panel-context.d.ts","sourceRoot":"","sources":["../../../../src/internal/context/split-panel-context.ts"],"names":[],"mappings":"AAEA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAE,0BAA0B,EAAE,MAAM,sDAAsD,CAAC;AAElG,MAAM,WAAW,yBAAyB;IACxC,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;CAC/B;AAED,MAAM,WAAW,0BAA0B;IACzC,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,MAAM,GAAG,QAAQ,CAAC;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,kBAAkB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACzC,sBAAsB,CAAC,EAAE;QACvB,SAAS,EAAE,OAAO,CAAC;QACnB,WAAW,EAAE,OAAO,CAAC;KACtB,CAAC;IACF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,mBAAmB,EAAE,CAAC,MAAM,EAAE;QAAE,QAAQ,EAAE,MAAM,GAAG,QAAQ,CAAA;KAAE,KAAK,IAAI,CAAC;IACvE,kBAAkB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,mBAAmB,EAAE,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACjE,IAAI,EAAE,0BAA0B,CAAC;CAClC;AAED,MAAM,WAAW,sBAAuB,SAAQ,0BAA0B;IACxE,YAAY,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"split-panel-context.d.ts","sourceRoot":"","sources":["../../../../src/internal/context/split-panel-context.ts"],"names":[],"mappings":"AAEA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAE,0BAA0B,EAAE,MAAM,sDAAsD,CAAC;AAElG,MAAM,WAAW,yBAAyB;IACxC,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;CAC/B;AAED,MAAM,WAAW,0BAA0B;IACzC,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,MAAM,GAAG,QAAQ,CAAC;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,kBAAkB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACzC,sBAAsB,CAAC,EAAE;QACvB,SAAS,EAAE,OAAO,CAAC;QACnB,WAAW,EAAE,OAAO,CAAC;KACtB,CAAC;IACF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,mBAAmB,EAAE,CAAC,MAAM,EAAE;QAAE,QAAQ,EAAE,MAAM,GAAG,QAAQ,CAAA;KAAE,KAAK,IAAI,CAAC;IACvE,kBAAkB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,mBAAmB,EAAE,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACjE,IAAI,EAAE,0BAA0B,CAAC;CAClC;AAED,MAAM,WAAW,sBAAuB,SAAQ,0BAA0B;IACxE,YAAY,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAID,eAAO,MAAM,yBAAyB,+CAA6B,CAAC;AAEpE,wBAAgB,oBAAoB,2BAMnC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"split-panel-context.js","sourceRoot":"","sources":["../../../../src/internal/context/split-panel-context.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAc,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"split-panel-context.js","sourceRoot":"","sources":["../../../../src/internal/context/split-panel-context.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAc,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAqCzD,MAAM,iBAAiB,GAAG,aAAa,CAAgC,IAAI,CAAC,CAAC;AAE7E,MAAM,CAAC,MAAM,yBAAyB,GAAG,iBAAiB,CAAC,QAAQ,CAAC;AAEpE,MAAM,UAAU,oBAAoB;IAClC,MAAM,GAAG,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IAC1C,IAAI,CAAC,GAAG,EAAE;QACR,MAAM,IAAI,KAAK,CAAC,gDAAgD,CAAC,CAAC;KACnE;IACD,OAAO,GAAG,CAAC;AACb,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { createContext, useContext } from 'react';\n\nimport { SplitPanelFocusControlRefs } from '../../app-layout/utils/use-split-panel-focus-control';\n\nexport interface SplitPanelSideToggleProps {\n displayed: boolean;\n ariaLabel: string | undefined;\n}\n\nexport interface SplitPanelContextBaseProps {\n topOffset: number;\n bottomOffset: number;\n leftOffset: number;\n rightOffset: number;\n position: 'side' | 'bottom';\n size: number;\n disableContentPaddings?: boolean;\n contentWidthStyles?: React.CSSProperties;\n contentWrapperPaddings?: {\n closedNav: boolean;\n closedTools: boolean;\n };\n isOpen?: boolean;\n isForcedPosition: boolean;\n onResize: (newSize: number) => void;\n onToggle: () => void;\n onPreferencesChange: (detail: { position: 'side' | 'bottom' }) => void;\n reportHeaderHeight: (pixels: number) => void;\n setSplitPanelToggle: (config: SplitPanelSideToggleProps) => void;\n refs: SplitPanelFocusControlRefs;\n}\n\nexport interface SplitPanelContextProps extends SplitPanelContextBaseProps {\n relativeSize: number;\n animationDisabled?: boolean;\n}\n\nconst SplitPanelContext = createContext<SplitPanelContextProps | null>(null);\n\nexport const SplitPanelContextProvider = SplitPanelContext.Provider;\n\nexport function useSplitPanelContext() {\n const ctx = useContext(SplitPanelContext);\n if (!ctx) {\n throw new Error('Split panel can only be used inside app layout');\n }\n return ctx;\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bottom.d.ts","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AASjD,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAMtD,UAAU,4BAA6B,SAAQ,sBAAsB;IACnE,iBAAiB,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAAC;CACpD;AAED,wBAAgB,uBAAuB,CAAC,EACtC,SAAS,EACT,MAAM,EACN,aAAa,EACb,UAAU,EACV,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,QAAQ,GACT,EAAE,4BAA4B,
|
|
1
|
+
{"version":3,"file":"bottom.d.ts","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AASjD,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAMtD,UAAU,4BAA6B,SAAQ,sBAAsB;IACnE,iBAAiB,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAAC;CACpD;AAED,wBAAgB,uBAAuB,CAAC,EACtC,SAAS,EACT,MAAM,EACN,aAAa,EACb,UAAU,EACV,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,QAAQ,GACT,EAAE,4BAA4B,eA8D9B"}
|
|
@@ -13,7 +13,7 @@ import testUtilStyles from './test-classes/styles.css.js';
|
|
|
13
13
|
export function SplitPanelContentBottom({ baseProps, isOpen, splitPanelRef, cappedSize, header, resizeHandle, children, appLayoutMaxWidth, panelHeaderId, onToggle, }) {
|
|
14
14
|
const isRefresh = useVisualRefresh();
|
|
15
15
|
const isToolbar = useAppLayoutToolbarEnabled();
|
|
16
|
-
const { bottomOffset, leftOffset, rightOffset, disableContentPaddings, contentWrapperPaddings, reportHeaderHeight } = useSplitPanelContext();
|
|
16
|
+
const { bottomOffset, leftOffset, rightOffset, disableContentPaddings, contentWrapperPaddings, reportHeaderHeight, animationDisabled, } = useSplitPanelContext();
|
|
17
17
|
const isMobile = useMobile();
|
|
18
18
|
const headerRef = useRef(null);
|
|
19
19
|
useResizeObserver(headerRef, entry => reportHeaderHeight(entry.borderBoxHeight));
|
|
@@ -27,7 +27,8 @@ export function SplitPanelContentBottom({ baseProps, isOpen, splitPanelRef, capp
|
|
|
27
27
|
[styles['pane-bottom-content-nav-padding']]: contentWrapperPaddings === null || contentWrapperPaddings === void 0 ? void 0 : contentWrapperPaddings.closedNav,
|
|
28
28
|
[styles['pane-bottom-content-tools-padding']]: contentWrapperPaddings === null || contentWrapperPaddings === void 0 ? void 0 : contentWrapperPaddings.closedTools,
|
|
29
29
|
});
|
|
30
|
-
return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.drawer, styles['position-bottom'], testUtilStyles.root,
|
|
30
|
+
return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.drawer, styles['position-bottom'], testUtilStyles.root, {
|
|
31
|
+
[sharedStyles['with-motion-vertical']]: !animationDisabled,
|
|
31
32
|
[testUtilStyles['open-position-bottom']]: isOpen,
|
|
32
33
|
[styles['drawer-closed']]: !isOpen,
|
|
33
34
|
[styles['drawer-mobile']]: isMobile,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bottom.js","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAElF,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,oBAAoB,EAAE,MAAM,yCAAyC,CAAC;AAC/E,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAGrE,OAAO,YAAY,MAAM,oCAAoC,CAAC;AAC9D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,cAAc,MAAM,8BAA8B,CAAC;AAM1D,MAAM,UAAU,uBAAuB,CAAC,EACtC,SAAS,EACT,MAAM,EACN,aAAa,EACb,UAAU,EACV,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,QAAQ,GACqB;IAC7B,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IACrC,MAAM,SAAS,GAAG,0BAA0B,EAAE,CAAC;IAC/C,MAAM,
|
|
1
|
+
{"version":3,"file":"bottom.js","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { SplitPanelContentProps } from './interfaces';\n\nimport sharedStyles from '../app-layout/resize/styles.css.js';\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\ninterface SplitPanelContentBottomProps extends SplitPanelContentProps {\n appLayoutMaxWidth: React.CSSProperties | undefined;\n}\n\nexport function SplitPanelContentBottom({\n baseProps,\n isOpen,\n splitPanelRef,\n cappedSize,\n header,\n resizeHandle,\n children,\n appLayoutMaxWidth,\n panelHeaderId,\n onToggle,\n}: SplitPanelContentBottomProps) {\n const isRefresh = useVisualRefresh();\n const isToolbar = useAppLayoutToolbarEnabled();\n const {\n bottomOffset,\n leftOffset,\n rightOffset,\n disableContentPaddings,\n contentWrapperPaddings,\n reportHeaderHeight,\n animationDisabled,\n } = useSplitPanelContext();\n const isMobile = useMobile();\n\n const headerRef = useRef<HTMLDivElement>(null);\n useResizeObserver(headerRef, entry => reportHeaderHeight(entry.borderBoxHeight));\n useEffect(() => {\n // report empty height when unmounting the panel\n return () => reportHeaderHeight(0);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const centeredMaxWidthClasses = clsx({\n [styles['pane-bottom-center-align']]: isRefresh,\n [styles['pane-bottom-content-nav-padding']]: contentWrapperPaddings?.closedNav,\n [styles['pane-bottom-content-tools-padding']]: contentWrapperPaddings?.closedTools,\n });\n\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.drawer, styles['position-bottom'], testUtilStyles.root, {\n [sharedStyles['with-motion-vertical']]: !animationDisabled,\n [testUtilStyles['open-position-bottom']]: isOpen,\n [styles['drawer-closed']]: !isOpen,\n [styles['drawer-mobile']]: isMobile,\n [styles['drawer-disable-content-paddings']]: disableContentPaddings,\n [styles.refresh]: isRefresh,\n [styles['with-toolbar']]: isToolbar,\n })}\n onClick={() => !isOpen && onToggle()}\n style={{\n insetBlockEnd: bottomOffset,\n insetInlineStart: leftOffset,\n insetInlineEnd: rightOffset,\n blockSize: isOpen ? cappedSize : isToolbar ? '0px' : undefined,\n }}\n ref={splitPanelRef}\n >\n {isOpen && <div className={styles['slider-wrapper-bottom']}>{resizeHandle}</div>}\n <div className={styles['drawer-content-bottom']} aria-labelledby={panelHeaderId} role=\"region\">\n <div className={clsx(styles['pane-header-wrapper-bottom'], centeredMaxWidthClasses)} ref={headerRef}>\n {header}\n </div>\n <div className={clsx(styles['content-bottom'], centeredMaxWidthClasses)} aria-hidden={!isOpen}>\n <div className={clsx({ [styles['content-bottom-max-width']]: isRefresh })} style={appLayoutMaxWidth}>\n {children}\n </div>\n </div>\n </div>\n </div>\n );\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"side.d.ts","sourceRoot":"","sources":["../../../src/split-panel/side.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAInD,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAMtD,UAAU,0BAA2B,SAAQ,sBAAsB;IACjE,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;CAC7C;AAED,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,SAAS,EACT,aAAa,EACb,SAAS,EACT,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,UAAU,EACV,mBAAmB,EACnB,aAAa,EACb,QAAQ,GACT,EAAE,0BAA0B,
|
|
1
|
+
{"version":3,"file":"side.d.ts","sourceRoot":"","sources":["../../../src/split-panel/side.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAInD,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAMtD,UAAU,0BAA2B,SAAQ,sBAAsB;IACjE,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;CAC7C;AAED,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,SAAS,EACT,aAAa,EACb,SAAS,EACT,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,UAAU,EACV,mBAAmB,EACnB,aAAa,EACb,QAAQ,GACT,EAAE,0BAA0B,eAwD5B"}
|
|
@@ -10,10 +10,11 @@ import sharedStyles from '../app-layout/resize/styles.css.js';
|
|
|
10
10
|
import styles from './styles.css.js';
|
|
11
11
|
import testUtilStyles from './test-classes/styles.css.js';
|
|
12
12
|
export function SplitPanelContentSide({ style, baseProps, splitPanelRef, toggleRef, header, children, resizeHandle, isOpen, cappedSize, openButtonAriaLabel, panelHeaderId, onToggle, }) {
|
|
13
|
-
const { topOffset, bottomOffset } = useSplitPanelContext();
|
|
13
|
+
const { topOffset, bottomOffset, animationDisabled } = useSplitPanelContext();
|
|
14
14
|
const isRefresh = useVisualRefresh();
|
|
15
15
|
const isToolbar = useAppLayoutToolbarEnabled();
|
|
16
|
-
return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.drawer, styles['position-side'], testUtilStyles.root,
|
|
16
|
+
return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.drawer, styles['position-side'], testUtilStyles.root, {
|
|
17
|
+
[sharedStyles['with-motion-horizontal']]: !animationDisabled,
|
|
17
18
|
[testUtilStyles['open-position-side']]: isOpen,
|
|
18
19
|
[styles['drawer-closed']]: !isOpen,
|
|
19
20
|
[styles['with-toolbar']]: isToolbar,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"side.js","sourceRoot":"","sources":["../../../src/split-panel/side.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAE/E,OAAO,cAAc,MAAM,oBAAoB,CAAC;AAChD,OAAO,EAAE,oBAAoB,EAAE,MAAM,yCAAyC,CAAC;AAC/E,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAGrE,OAAO,YAAY,MAAM,oCAAoC,CAAC;AAC9D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,cAAc,MAAM,8BAA8B,CAAC;AAO1D,MAAM,UAAU,qBAAqB,CAAC,EACpC,KAAK,EACL,SAAS,EACT,aAAa,EACb,SAAS,EACT,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,UAAU,EACV,mBAAmB,EACnB,aAAa,EACb,QAAQ,GACmB;IAC3B,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,oBAAoB,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"side.js","sourceRoot":"","sources":["../../../src/split-panel/side.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { ButtonProps } from '../button/interfaces';\nimport InternalButton from '../button/internal';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { SplitPanelContentProps } from './interfaces';\n\nimport sharedStyles from '../app-layout/resize/styles.css.js';\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\ninterface SplitPanelContentSideProps extends SplitPanelContentProps {\n openButtonAriaLabel?: string;\n toggleRef: React.RefObject<ButtonProps.Ref>;\n}\n\nexport function SplitPanelContentSide({\n style,\n baseProps,\n splitPanelRef,\n toggleRef,\n header,\n children,\n resizeHandle,\n isOpen,\n cappedSize,\n openButtonAriaLabel,\n panelHeaderId,\n onToggle,\n}: SplitPanelContentSideProps) {\n const { topOffset, bottomOffset, animationDisabled } = useSplitPanelContext();\n const isRefresh = useVisualRefresh();\n const isToolbar = useAppLayoutToolbarEnabled();\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.drawer, styles['position-side'], testUtilStyles.root, {\n [sharedStyles['with-motion-horizontal']]: !animationDisabled,\n [testUtilStyles['open-position-side']]: isOpen,\n [styles['drawer-closed']]: !isOpen,\n [styles['with-toolbar']]: isToolbar,\n [styles.refresh]: isRefresh,\n })}\n style={{\n width: isOpen ? cappedSize : isRefresh ? '0px' : undefined,\n maxWidth: isRefresh ? '100%' : undefined,\n ...style,\n }}\n ref={splitPanelRef}\n >\n <div\n className={styles['drawer-content-side']}\n style={{\n top: topOffset,\n bottom: bottomOffset,\n }}\n onClick={() => !isOpen && onToggle()}\n aria-labelledby={panelHeaderId}\n role=\"region\"\n >\n {isOpen ? (\n <div className={clsx(styles['slider-wrapper-side'], isToolbar && styles['with-toolbar'])}>{resizeHandle}</div>\n ) : (\n <InternalButton\n className={clsx(testUtilStyles['open-button'], styles['open-button-side'])}\n iconName=\"angle-left\"\n variant=\"icon\"\n formAction=\"none\"\n ariaLabel={openButtonAriaLabel}\n ariaExpanded={isOpen}\n //toggleRef should only be assigned when there is no other trigger-buttons\n ref={isRefresh || isToolbar ? null : toggleRef}\n />\n )}\n <div\n className={clsx(styles['content-side'], isToolbar && styles['with-toolbar'])}\n aria-hidden={!isOpen}\n style={{ width: isToolbar ? cappedSize : '0px' }} // to prevent text wrapping upon entering\n >\n <div className={styles['pane-header-wrapper-side']}>{header}</div>\n <div className={styles['pane-content-wrapper-side']}>{children}</div>\n </div>\n </div>\n </div>\n );\n}\n"]}
|