npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.297 → 3.0.299 - Mend

@cloudscape-design/components-themeable 3.0.297 → 3.0.299

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (63) hide show

package/lib/internal/template/app-layout/visual-refresh/styles.selectors.js CHANGED Viewed

@@ -2,77 +2,77 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "appbar": "awsui_appbar_hyvsj_b3czl_93",
-  "appbar-nav": "awsui_appbar-nav_hyvsj_b3czl_117",
-  "breadcrumbs": "awsui_breadcrumbs_hyvsj_b3czl_121",
-  "appbar-tools": "awsui_appbar-tools_hyvsj_b3czl_125",
-  "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_hyvsj_b3czl_126",
-  "has-breadcrumbs": "awsui_has-breadcrumbs_hyvsj_b3czl_167",
-  "has-notifications-content": "awsui_has-notifications-content_hyvsj_b3czl_175",
-  "has-header": "awsui_has-header_hyvsj_b3czl_181",
-  "has-dynamic-overlap-height": "awsui_has-dynamic-overlap-height_hyvsj_b3czl_181",
-  "content-type-wizard": "awsui_content-type-wizard_hyvsj_b3czl_182",
-  "content-type-cards": "awsui_content-type-cards_hyvsj_b3czl_185",
-  "content-type-table": "awsui_content-type-table_hyvsj_b3czl_186",
-  "has-sticky-background": "awsui_has-sticky-background_hyvsj_b3czl_189",
-  "background": "awsui_background_hyvsj_b3czl_224",
-  "notifications-appbar-header": "awsui_notifications-appbar-header_hyvsj_b3czl_227",
-  "sticky-notifications": "awsui_sticky-notifications_hyvsj_b3czl_240",
-  "overlap": "awsui_overlap_hyvsj_b3czl_246",
-  "drawers-container": "awsui_drawers-container_hyvsj_b3czl_274",
-  "has-open-drawer": "awsui_has-open-drawer_hyvsj_b3czl_286",
-  "disable-body-scroll": "awsui_disable-body-scroll_hyvsj_b3czl_320",
-  "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_hyvsj_b3czl_325",
-  "has-multiple-triggers": "awsui_has-multiple-triggers_hyvsj_b3czl_343",
-  "drawers-trigger-content": "awsui_drawers-trigger-content_hyvsj_b3czl_375",
-  "drawers-trigger": "awsui_drawers-trigger_hyvsj_b3czl_375",
-  "drawer": "awsui_drawer_hyvsj_b3czl_126",
-  "drawer-close-button": "awsui_drawer-close-button_hyvsj_b3czl_426",
-  "drawer-content": "awsui_drawer-content_hyvsj_b3czl_431",
-  "is-drawer-open": "awsui_is-drawer-open_hyvsj_b3czl_436",
-  "content": "awsui_content_hyvsj_b3czl_182",
-  "layout": "awsui_layout_hyvsj_b3czl_534",
-  "has-max-content-width": "awsui_has-max-content-width_hyvsj_b3czl_618",
-  "content-type-dashboard": "awsui_content-type-dashboard_hyvsj_b3czl_633",
-  "is-overlap-disabled": "awsui_is-overlap-disabled_hyvsj_b3czl_660",
-  "has-sticky-notifications": "awsui_has-sticky-notifications_hyvsj_b3czl_667",
-  "has-split-panel": "awsui_has-split-panel_hyvsj_b3czl_681",
-  "split-panel-position-bottom": "awsui_split-panel-position-bottom_hyvsj_b3czl_681",
-  "has-content-gap-left": "awsui_has-content-gap-left_hyvsj_b3czl_693",
-  "has-content-gap-right": "awsui_has-content-gap-right_hyvsj_b3czl_696",
-  "block-body-scroll": "awsui_block-body-scroll_hyvsj_b3czl_711",
-  "container": "awsui_container_hyvsj_b3czl_719",
-  "disable-content-paddings": "awsui_disable-content-paddings_hyvsj_b3czl_745",
-  "is-navigation-open": "awsui_is-navigation-open_hyvsj_b3czl_750",
-  "is-tools-open": "awsui_is-tools-open_hyvsj_b3czl_753",
-  "is-split-panel-open": "awsui_is-split-panel-open_hyvsj_b3czl_753",
-  "split-panel-position-side": "awsui_split-panel-position-side_hyvsj_b3czl_753",
-  "content-type-default": "awsui_content-type-default_hyvsj_b3czl_773",
-  "content-type-form": "awsui_content-type-form_hyvsj_b3czl_773",
-  "unfocusable": "awsui_unfocusable_hyvsj_b3czl_814",
-  "navigation-container": "awsui_navigation-container_hyvsj_b3czl_824",
-  "show-navigation": "awsui_show-navigation_hyvsj_b3czl_868",
-  "animating": "awsui_animating_hyvsj_b3czl_890",
-  "showButtons": "awsui_showButtons_hyvsj_b3czl_1",
-  "navigation": "awsui_navigation_hyvsj_b3czl_824",
-  "openNavigation": "awsui_openNavigation_hyvsj_b3czl_1",
-  "animated-content": "awsui_animated-content_hyvsj_b3czl_951",
-  "hide-navigation": "awsui_hide-navigation_hyvsj_b3czl_960",
-  "notifications": "awsui_notifications_hyvsj_b3czl_227",
-  "split-panel-bottom": "awsui_split-panel-bottom_hyvsj_b3czl_1027",
-  "position-bottom": "awsui_position-bottom_hyvsj_b3czl_1073",
-  "openSplitPanelBottom": "awsui_openSplitPanelBottom_hyvsj_b3czl_1",
-  "split-panel-side": "awsui_split-panel-side_hyvsj_b3czl_1102",
-  "position-side": "awsui_position-side_hyvsj_b3czl_1130",
-  "openSplitPanelSide": "awsui_openSplitPanelSide_hyvsj_b3czl_1",
-  "tools-container": "awsui_tools-container_hyvsj_b3czl_1167",
-  "tools": "awsui_tools_hyvsj_b3czl_1167",
-  "openTools": "awsui_openTools_hyvsj_b3czl_1",
-  "has-tools-form-persistence": "awsui_has-tools-form-persistence_hyvsj_b3czl_1261",
-  "hide-tools": "awsui_hide-tools_hyvsj_b3czl_1271",
-  "show-tools": "awsui_show-tools_hyvsj_b3czl_1283",
-  "has-tools-form": "awsui_has-tools-form_hyvsj_b3czl_1261",
-  "trigger": "awsui_trigger_hyvsj_b3czl_1350",
-  "selected": "awsui_selected_hyvsj_b3czl_1389"
+  "appbar": "awsui_appbar_hyvsj_ict63_93",
+  "appbar-nav": "awsui_appbar-nav_hyvsj_ict63_117",
+  "breadcrumbs": "awsui_breadcrumbs_hyvsj_ict63_121",
+  "appbar-tools": "awsui_appbar-tools_hyvsj_ict63_125",
+  "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_hyvsj_ict63_126",
+  "has-breadcrumbs": "awsui_has-breadcrumbs_hyvsj_ict63_167",
+  "has-notifications-content": "awsui_has-notifications-content_hyvsj_ict63_175",
+  "has-header": "awsui_has-header_hyvsj_ict63_181",
+  "has-dynamic-overlap-height": "awsui_has-dynamic-overlap-height_hyvsj_ict63_181",
+  "content-type-wizard": "awsui_content-type-wizard_hyvsj_ict63_182",
+  "content-type-cards": "awsui_content-type-cards_hyvsj_ict63_185",
+  "content-type-table": "awsui_content-type-table_hyvsj_ict63_186",
+  "has-sticky-background": "awsui_has-sticky-background_hyvsj_ict63_189",
+  "background": "awsui_background_hyvsj_ict63_224",
+  "notifications-appbar-header": "awsui_notifications-appbar-header_hyvsj_ict63_227",
+  "sticky-notifications": "awsui_sticky-notifications_hyvsj_ict63_240",
+  "overlap": "awsui_overlap_hyvsj_ict63_246",
+  "drawers-container": "awsui_drawers-container_hyvsj_ict63_274",
+  "has-open-drawer": "awsui_has-open-drawer_hyvsj_ict63_286",
+  "disable-body-scroll": "awsui_disable-body-scroll_hyvsj_ict63_320",
+  "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_hyvsj_ict63_325",
+  "has-multiple-triggers": "awsui_has-multiple-triggers_hyvsj_ict63_343",
+  "drawers-trigger-content": "awsui_drawers-trigger-content_hyvsj_ict63_375",
+  "drawers-trigger": "awsui_drawers-trigger_hyvsj_ict63_375",
+  "drawer": "awsui_drawer_hyvsj_ict63_126",
+  "drawer-close-button": "awsui_drawer-close-button_hyvsj_ict63_426",
+  "drawer-content": "awsui_drawer-content_hyvsj_ict63_431",
+  "is-drawer-open": "awsui_is-drawer-open_hyvsj_ict63_436",
+  "content": "awsui_content_hyvsj_ict63_182",
+  "layout": "awsui_layout_hyvsj_ict63_534",
+  "has-max-content-width": "awsui_has-max-content-width_hyvsj_ict63_618",
+  "content-type-dashboard": "awsui_content-type-dashboard_hyvsj_ict63_633",
+  "is-overlap-disabled": "awsui_is-overlap-disabled_hyvsj_ict63_660",
+  "has-sticky-notifications": "awsui_has-sticky-notifications_hyvsj_ict63_667",
+  "has-split-panel": "awsui_has-split-panel_hyvsj_ict63_681",
+  "split-panel-position-bottom": "awsui_split-panel-position-bottom_hyvsj_ict63_681",
+  "has-content-gap-left": "awsui_has-content-gap-left_hyvsj_ict63_693",
+  "has-content-gap-right": "awsui_has-content-gap-right_hyvsj_ict63_696",
+  "block-body-scroll": "awsui_block-body-scroll_hyvsj_ict63_711",
+  "container": "awsui_container_hyvsj_ict63_719",
+  "disable-content-paddings": "awsui_disable-content-paddings_hyvsj_ict63_745",
+  "is-navigation-open": "awsui_is-navigation-open_hyvsj_ict63_750",
+  "is-tools-open": "awsui_is-tools-open_hyvsj_ict63_753",
+  "is-split-panel-open": "awsui_is-split-panel-open_hyvsj_ict63_753",
+  "split-panel-position-side": "awsui_split-panel-position-side_hyvsj_ict63_753",
+  "content-type-default": "awsui_content-type-default_hyvsj_ict63_773",
+  "content-type-form": "awsui_content-type-form_hyvsj_ict63_773",
+  "unfocusable": "awsui_unfocusable_hyvsj_ict63_814",
+  "navigation-container": "awsui_navigation-container_hyvsj_ict63_824",
+  "show-navigation": "awsui_show-navigation_hyvsj_ict63_868",
+  "animating": "awsui_animating_hyvsj_ict63_890",
+  "showButtons": "awsui_showButtons_hyvsj_ict63_1",
+  "navigation": "awsui_navigation_hyvsj_ict63_824",
+  "openNavigation": "awsui_openNavigation_hyvsj_ict63_1",
+  "animated-content": "awsui_animated-content_hyvsj_ict63_951",
+  "hide-navigation": "awsui_hide-navigation_hyvsj_ict63_960",
+  "notifications": "awsui_notifications_hyvsj_ict63_227",
+  "split-panel-bottom": "awsui_split-panel-bottom_hyvsj_ict63_1027",
+  "position-bottom": "awsui_position-bottom_hyvsj_ict63_1073",
+  "openSplitPanelBottom": "awsui_openSplitPanelBottom_hyvsj_ict63_1",
+  "split-panel-side": "awsui_split-panel-side_hyvsj_ict63_1102",
+  "position-side": "awsui_position-side_hyvsj_ict63_1130",
+  "openSplitPanelSide": "awsui_openSplitPanelSide_hyvsj_ict63_1",
+  "tools-container": "awsui_tools-container_hyvsj_ict63_1167",
+  "tools": "awsui_tools_hyvsj_ict63_1167",
+  "openTools": "awsui_openTools_hyvsj_ict63_1",
+  "has-tools-form-persistence": "awsui_has-tools-form-persistence_hyvsj_ict63_1261",
+  "hide-tools": "awsui_hide-tools_hyvsj_ict63_1271",
+  "show-tools": "awsui_show-tools_hyvsj_ict63_1283",
+  "has-tools-form": "awsui_has-tools-form_hyvsj_ict63_1261",
+  "trigger": "awsui_trigger_hyvsj_ict63_1350",
+  "selected": "awsui_selected_hyvsj_ict63_1389"
 };

package/lib/internal/template/app-layout/visual-refresh/tools.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tools.d.ts","sourceRoot":"lib/default/","sources":["app-layout/visual-refresh/tools.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,UAAU,UAAU;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAAE,QAAQ,EAAE,EAAE,UAAU,~~sBAiIrD~~;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,QAAQ,EAAE,OAAO,EAAE,cAAc,CAAC,EAAE,OAAO,WAU/E"}
1	+ {"version":3,"file":"tools.d.ts","sourceRoot":"lib/default/","sources":["app-layout/visual-refresh/tools.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,UAAU,UAAU;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAAE,QAAQ,EAAE,EAAE,UAAU,sBAmIrD;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,QAAQ,EAAE,OAAO,EAAE,cAAc,CAAC,EAAE,OAAO,WAU/E"}

package/lib/internal/template/app-layout/visual-refresh/tools.js CHANGED Viewed

@@ -19,8 +19,8 @@ import customCssProps from '../../internal/generated/custom-css-properties';
  * split panel in large viewports;
  */
 export default function Tools({ children }) {
-    const { ariaLabels, disableBodyScroll, drawers, handleSplitPanelClick, handleToolsClick, hasDefaultToolsWidth, hasDrawerViewportOverlay, isMobile, isSplitPanelOpen, isToolsOpen, loseToolsFocus, splitPanelDisplayed, splitPanelPosition, splitPanelRefs, splitPanelToggle, tools, toolsHide, toolsRefs, toolsWidth, } = useAppLayoutInternals();
-    const hasSplitPanel = getSplitPanelStatus(splitPanelDisplayed, splitPanelPosition);
+    const { ariaLabels, disableBodyScroll, drawers, handleSplitPanelClick, handleToolsClick, hasDefaultToolsWidth, hasDrawerViewportOverlay, isMobile, isSplitPanelOpen, isToolsOpen, loseToolsFocus, splitPanel, splitPanelDisplayed, splitPanelPosition, splitPanelRefs, splitPanelToggle, tools, toolsHide, toolsRefs, toolsWidth, } = useAppLayoutInternals();
+    const hasSplitPanel = !!splitPanel && getSplitPanelStatus(splitPanelDisplayed, splitPanelPosition);
     const hasToolsForm = getToolsFormStatus(hasSplitPanel, isMobile, isSplitPanelOpen, isToolsOpen, toolsHide);
     const hasToolsFormPersistence = getToolsFormPersistence(hasSplitPanel, isSplitPanelOpen, isToolsOpen, toolsHide);
     const isUnfocusable = hasDrawerViewportOverlay && !isToolsOpen;
@@ -60,7 +60,7 @@ export default function Tools({ children }) {
                     [styles.animating]: state === 'exiting',
                     [styles['has-tools-form']]: hasToolsForm,
                     [styles['has-tools-form-persistence']]: hasToolsFormPersistence,
-                }), ref: state === 'exiting' ? transitionEventsRef : undefined },
+                }), ref: state === 'exiting' ? transitionEventsRef : undefined, "data-testid": "side-split-panel-drawer" },
                 !toolsHide && (React.createElement(TriggerButton, { ariaLabel: ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.toolsToggle, iconName: "status-info", onClick: () => handleToolsClick(!isToolsOpen), selected: hasSplitPanel && isToolsOpen, className: testutilStyles['tools-toggle'], ref: toolsRefs.toggle })),
                 hasSplitPanel && splitPanelToggle.displayed && (React.createElement(TriggerButton, { ariaLabel: splitPanelToggle.ariaLabel, iconName: "view-vertical", onClick: () => handleSplitPanelClick(), selected: hasSplitPanel && isSplitPanelOpen, className: splitPanelStyles['open-button'], ref: splitPanelRefs.toggle }))))));
     }));

package/lib/internal/template/app-layout/visual-refresh/tools.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tools.js","sourceRoot":"lib/default/","sources":["app-layout/visual-refresh/tools.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport { InternalButton } from '../../button/internal';\nimport { useAppLayoutInternals } from './context';\nimport TriggerButton from './trigger-button';\nimport styles from './styles.css.js';\nimport splitPanelStyles from '../../split-panel/styles.css.js';\nimport testutilStyles from '../test-classes/styles.css.js';\nimport { Transition } from '../../internal/components/transition';\nimport customCssProps from '../../internal/generated/custom-css-properties';\n\ninterface ToolsProps {\n children: React.ReactNode;\n}\n\n/*\n The Tools component consists of the following elements:\n * the container, or root element, that sits as a direct child to the Layout grid definition;\n * the split panel, which exists only if there is a split panel in side position;\n * the tools, or drawer, that contains the hide tools form and the children passed through the API;\n * the show tools form that contains the triggers for both the drawer and the\n * split panel in large viewports;\n /\nexport default function Tools({ children }: ToolsProps) {\n const {\n ariaLabels,\n disableBodyScroll,\n drawers,\n handleSplitPanelClick,\n handleToolsClick,\n hasDefaultToolsWidth,\n hasDrawerViewportOverlay,\n isMobile,\n isSplitPanelOpen,\n isToolsOpen,\n loseToolsFocus,\n splitPanelDisplayed,\n splitPanelPosition,\n splitPanelRefs,\n splitPanelToggle,\n tools,\n toolsHide,\n toolsRefs,\n toolsWidth,\n } = useAppLayoutInternals();\n\n const hasSplitPanel = getSplitPanelStatus(splitPanelDisplayed, splitPanelPosition);\n const hasToolsForm = getToolsFormStatus(hasSplitPanel, isMobile, isSplitPanelOpen, isToolsOpen, toolsHide);\n const hasToolsFormPersistence = getToolsFormPersistence(hasSplitPanel, isSplitPanelOpen, isToolsOpen, toolsHide);\n const isUnfocusable = hasDrawerViewportOverlay && !isToolsOpen;\n\n /\n If the drawers property is defined the Tools and SplitPanel will be mounted and rendered\n * by the Drawers component.\n /\n if ((toolsHide && !hasSplitPanel) \|\| drawers) {\n return null;\n }\n\n return (\n <Transition in={isToolsOpen ?? false}>\n {(state, transitionEventsRef) => (\n <div\n className={clsx(styles['tools-container'], {\n [styles['disable-body-scroll']]: disableBodyScroll,\n [styles.unfocusable]: isUnfocusable,\n [testutilStyles['drawer-closed']]: !isToolsOpen,\n })}\n style={{\n [customCssProps.toolsAnimationStartingOpacity]: `${hasSplitPanel && isSplitPanelOpen ? 1 : 0}`,\n // Overwrite the default tools width (depends on breakpoints) only when the `toolsWidth` property has been set.\n [customCssProps.toolsWidth]: hasDefaultToolsWidth ? '' : `${toolsWidth}px`,\n }}\n onBlur={e => {\n if (!e.relatedTarget \|\| !e.currentTarget.contains(e.relatedTarget)) {\n loseToolsFocus();\n }\n }}\n >\n {children}\n\n {!toolsHide && (\n <aside\n aria-hidden={!isToolsOpen ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(\n styles.tools,\n {\n [styles.animating]: state === 'entering',\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n [styles['is-tools-open']]: isToolsOpen,\n },\n testutilStyles.tools\n )}\n ref={state !== 'exiting' ? transitionEventsRef : undefined}\n >\n <div className={clsx(styles['animated-content'])}>\n <div className={clsx(styles['hide-tools'])}>\n <InternalButton\n ariaLabel={ariaLabels?.toolsClose ?? undefined}\n iconName={isMobile ? 'close' : 'angle-right'}\n onClick={() => handleToolsClick(false)}\n variant=\"icon\"\n formAction=\"none\"\n className={testutilStyles['tools-close']}\n ref={toolsRefs.close}\n />\n </div>\n\n {tools}\n </div>\n </aside>\n )}\n\n {!isMobile && (\n <aside\n aria-hidden={!hasToolsForm ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(styles['show-tools'], {\n [styles.animating]: state === 'exiting',\n [styles['has-tools-form']]: hasToolsForm,\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n })}\n ref={state === 'exiting' ? transitionEventsRef : undefined}\n >\n {!toolsHide && (\n <TriggerButton\n ariaLabel={ariaLabels?.toolsToggle}\n iconName=\"status-info\"\n onClick={() => handleToolsClick(!isToolsOpen)}\n selected={hasSplitPanel && isToolsOpen}\n className={testutilStyles['tools-toggle']}\n ref={toolsRefs.toggle}\n />\n )}\n\n {hasSplitPanel && splitPanelToggle.displayed && (\n <TriggerButton\n ariaLabel={splitPanelToggle.ariaLabel}\n iconName=\"view-vertical\"\n onClick={() => handleSplitPanelClick()}\n selected={hasSplitPanel && isSplitPanelOpen}\n className={splitPanelStyles['open-button']}\n ref={splitPanelRefs.toggle}\n />\n )}\n </aside>\n )}\n </div>\n )}\n </Transition>\n );\n}\n\n/\n Determine the default state of the Tools component. Mobile viewports should be\n * closed by default under all circumstances. If the toolsOpen prop has not been\n * set then it should be closed as well. Otherwise, default to the toolsOpen prop.\n /\nexport function getToolsDefaultState(isMobile: boolean, stateFromProps?: boolean) {\n let isToolsOpen;\n\n if (isMobile \|\| stateFromProps === undefined) {\n isToolsOpen = false;\n } else {\n isToolsOpen = stateFromProps;\n }\n\n return isToolsOpen;\n}\n\n/\n This simple function returns the presence of the split panel as a child of the\n * Tools component. It must exist and be in side position.\n /\nfunction getSplitPanelStatus(splitPanelDisplayed: boolean, splitPanelPosition: string) {\n return splitPanelDisplayed && splitPanelPosition === 'side' ? true : false;\n}\n\n/\n By default the Tools form is styled as display: none; This behavior should\n * be unchanged in mobile viewports where the Tools form is always suppressed.\n * In large viewports, however the Tools form and its corresponding buttons\n * should be present in the UI under the below circumstances.\n /\nfunction getToolsFormStatus(\n hasSplitPanel: boolean,\n isMobile: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsForm = false;\n\n if (!isMobile) {\n // Both the Split Panel and Tools button are needed\n if (hasSplitPanel && !toolsHide) {\n hasToolsForm = true;\n }\n\n // The Split Panel button is needed\n if (hasSplitPanel && !isSplitPanelOpen && toolsHide) {\n hasToolsForm = true;\n }\n\n // The Tools button is needed\n if (!hasSplitPanel && !toolsHide && !isToolsOpen) {\n hasToolsForm = true;\n }\n }\n\n return hasToolsForm;\n}\n\n/\n Under two scenarios the Tools form that contains the triggers\n * for the Tools content and the Split Panel may be persistent\n * in the UI (as opposed to disappearing when one of the drawers\n * is open). This will also add a white background as opposed to the\n * default transparent background. The buttons will present and in a\n * selected / not selected state.\n */\nfunction getToolsFormPersistence(\n hasSplitPanel: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsFormPersistence = false;\n\n // Both Tools and Split Panel exist and one or both is open\n if (hasSplitPanel && !toolsHide && (isSplitPanelOpen \|\| isToolsOpen)) {\n hasToolsFormPersistence = true;\n }\n\n return hasToolsFormPersistence;\n}\n"]}
1	+ {"version":3,"file":"tools.js","sourceRoot":"lib/default/","sources":["app-layout/visual-refresh/tools.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport { InternalButton } from '../../button/internal';\nimport { useAppLayoutInternals } from './context';\nimport TriggerButton from './trigger-button';\nimport styles from './styles.css.js';\nimport splitPanelStyles from '../../split-panel/styles.css.js';\nimport testutilStyles from '../test-classes/styles.css.js';\nimport { Transition } from '../../internal/components/transition';\nimport customCssProps from '../../internal/generated/custom-css-properties';\n\ninterface ToolsProps {\n children: React.ReactNode;\n}\n\n/*\n The Tools component consists of the following elements:\n * the container, or root element, that sits as a direct child to the Layout grid definition;\n * the split panel, which exists only if there is a split panel in side position;\n * the tools, or drawer, that contains the hide tools form and the children passed through the API;\n * the show tools form that contains the triggers for both the drawer and the\n * split panel in large viewports;\n /\nexport default function Tools({ children }: ToolsProps) {\n const {\n ariaLabels,\n disableBodyScroll,\n drawers,\n handleSplitPanelClick,\n handleToolsClick,\n hasDefaultToolsWidth,\n hasDrawerViewportOverlay,\n isMobile,\n isSplitPanelOpen,\n isToolsOpen,\n loseToolsFocus,\n splitPanel,\n splitPanelDisplayed,\n splitPanelPosition,\n splitPanelRefs,\n splitPanelToggle,\n tools,\n toolsHide,\n toolsRefs,\n toolsWidth,\n } = useAppLayoutInternals();\n\n const hasSplitPanel = !!splitPanel && getSplitPanelStatus(splitPanelDisplayed, splitPanelPosition);\n const hasToolsForm = getToolsFormStatus(hasSplitPanel, isMobile, isSplitPanelOpen, isToolsOpen, toolsHide);\n const hasToolsFormPersistence = getToolsFormPersistence(hasSplitPanel, isSplitPanelOpen, isToolsOpen, toolsHide);\n const isUnfocusable = hasDrawerViewportOverlay && !isToolsOpen;\n\n /\n If the drawers property is defined the Tools and SplitPanel will be mounted and rendered\n * by the Drawers component.\n /\n if ((toolsHide && !hasSplitPanel) \|\| drawers) {\n return null;\n }\n\n return (\n <Transition in={isToolsOpen ?? false}>\n {(state, transitionEventsRef) => (\n <div\n className={clsx(styles['tools-container'], {\n [styles['disable-body-scroll']]: disableBodyScroll,\n [styles.unfocusable]: isUnfocusable,\n [testutilStyles['drawer-closed']]: !isToolsOpen,\n })}\n style={{\n [customCssProps.toolsAnimationStartingOpacity]: `${hasSplitPanel && isSplitPanelOpen ? 1 : 0}`,\n // Overwrite the default tools width (depends on breakpoints) only when the `toolsWidth` property has been set.\n [customCssProps.toolsWidth]: hasDefaultToolsWidth ? '' : `${toolsWidth}px`,\n }}\n onBlur={e => {\n if (!e.relatedTarget \|\| !e.currentTarget.contains(e.relatedTarget)) {\n loseToolsFocus();\n }\n }}\n >\n {children}\n\n {!toolsHide && (\n <aside\n aria-hidden={!isToolsOpen ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(\n styles.tools,\n {\n [styles.animating]: state === 'entering',\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n [styles['is-tools-open']]: isToolsOpen,\n },\n testutilStyles.tools\n )}\n ref={state !== 'exiting' ? transitionEventsRef : undefined}\n >\n <div className={clsx(styles['animated-content'])}>\n <div className={clsx(styles['hide-tools'])}>\n <InternalButton\n ariaLabel={ariaLabels?.toolsClose ?? undefined}\n iconName={isMobile ? 'close' : 'angle-right'}\n onClick={() => handleToolsClick(false)}\n variant=\"icon\"\n formAction=\"none\"\n className={testutilStyles['tools-close']}\n ref={toolsRefs.close}\n />\n </div>\n\n {tools}\n </div>\n </aside>\n )}\n\n {!isMobile && (\n <aside\n aria-hidden={!hasToolsForm ? true : false}\n aria-label={ariaLabels?.tools ?? undefined}\n className={clsx(styles['show-tools'], {\n [styles.animating]: state === 'exiting',\n [styles['has-tools-form']]: hasToolsForm,\n [styles['has-tools-form-persistence']]: hasToolsFormPersistence,\n })}\n ref={state === 'exiting' ? transitionEventsRef : undefined}\n data-testid=\"side-split-panel-drawer\"\n >\n {!toolsHide && (\n <TriggerButton\n ariaLabel={ariaLabels?.toolsToggle}\n iconName=\"status-info\"\n onClick={() => handleToolsClick(!isToolsOpen)}\n selected={hasSplitPanel && isToolsOpen}\n className={testutilStyles['tools-toggle']}\n ref={toolsRefs.toggle}\n />\n )}\n\n {hasSplitPanel && splitPanelToggle.displayed && (\n <TriggerButton\n ariaLabel={splitPanelToggle.ariaLabel}\n iconName=\"view-vertical\"\n onClick={() => handleSplitPanelClick()}\n selected={hasSplitPanel && isSplitPanelOpen}\n className={splitPanelStyles['open-button']}\n ref={splitPanelRefs.toggle}\n />\n )}\n </aside>\n )}\n </div>\n )}\n </Transition>\n );\n}\n\n/\n Determine the default state of the Tools component. Mobile viewports should be\n * closed by default under all circumstances. If the toolsOpen prop has not been\n * set then it should be closed as well. Otherwise, default to the toolsOpen prop.\n /\nexport function getToolsDefaultState(isMobile: boolean, stateFromProps?: boolean) {\n let isToolsOpen;\n\n if (isMobile \|\| stateFromProps === undefined) {\n isToolsOpen = false;\n } else {\n isToolsOpen = stateFromProps;\n }\n\n return isToolsOpen;\n}\n\n/\n This simple function returns the presence of the split panel as a child of the\n * Tools component. It must exist and be in side position.\n /\nfunction getSplitPanelStatus(splitPanelDisplayed: boolean, splitPanelPosition: string) {\n return splitPanelDisplayed && splitPanelPosition === 'side' ? true : false;\n}\n\n/\n By default the Tools form is styled as display: none; This behavior should\n * be unchanged in mobile viewports where the Tools form is always suppressed.\n * In large viewports, however the Tools form and its corresponding buttons\n * should be present in the UI under the below circumstances.\n /\nfunction getToolsFormStatus(\n hasSplitPanel: boolean,\n isMobile: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsForm = false;\n\n if (!isMobile) {\n // Both the Split Panel and Tools button are needed\n if (hasSplitPanel && !toolsHide) {\n hasToolsForm = true;\n }\n\n // The Split Panel button is needed\n if (hasSplitPanel && !isSplitPanelOpen && toolsHide) {\n hasToolsForm = true;\n }\n\n // The Tools button is needed\n if (!hasSplitPanel && !toolsHide && !isToolsOpen) {\n hasToolsForm = true;\n }\n }\n\n return hasToolsForm;\n}\n\n/\n Under two scenarios the Tools form that contains the triggers\n * for the Tools content and the Split Panel may be persistent\n * in the UI (as opposed to disappearing when one of the drawers\n * is open). This will also add a white background as opposed to the\n * default transparent background. The buttons will present and in a\n * selected / not selected state.\n */\nfunction getToolsFormPersistence(\n hasSplitPanel: boolean,\n isSplitPanelOpen?: boolean,\n isToolsOpen?: boolean,\n toolsHide?: boolean\n) {\n let hasToolsFormPersistence = false;\n\n // Both Tools and Split Panel exist and one or both is open\n if (hasSplitPanel && !toolsHide && (isSplitPanelOpen \|\| isToolsOpen)) {\n hasToolsFormPersistence = true;\n }\n\n return hasToolsFormPersistence;\n}\n"]}

package/lib/internal/template/cards/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["cards/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAsB/D,OAAO,EAAE,UAAU,EAAE,CAAC;AAEtB,QAAA,MAAM,KAAK,~~qBAuIc~~,CAAC;AAE1B,eAAe,KAAK,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["cards/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAsB/D,OAAO,EAAE,UAAU,EAAE,CAAC;AAEtB,QAAA,MAAM,KAAK,qBA+Ic,CAAC;AAE1B,eAAe,KAAK,CAAC"}

package/lib/internal/template/cards/index.js CHANGED Viewed

@@ -24,7 +24,7 @@ import useMouseDownTarget from '../internal/hooks/use-mouse-down-target';
 import { useMobile } from '../internal/hooks/use-mobile';
 import { supportsStickyPosition } from '../internal/utils/dom';
 const Cards = React.forwardRef(function (_a, ref) {
-    var { items = [], cardDefinition, cardsPerRow = [], header, filter, pagination, preferences, empty, loading, loadingText, trackBy, selectedItems, selectionType, isItemDisabled, onSelectionChange, ariaLabels, visibleSections, stickyHeader, stickyHeaderVerticalOffset, variant = 'container' } = _a, rest = __rest(_a, ["items", "cardDefinition", "cardsPerRow", "header", "filter", "pagination", "preferences", "empty", "loading", "loadingText", "trackBy", "selectedItems", "selectionType", "isItemDisabled", "onSelectionChange", "ariaLabels", "visibleSections", "stickyHeader", "stickyHeaderVerticalOffset", "variant"]);
+    var { items = [], cardDefinition, cardsPerRow = [], header, filter, pagination, preferences, empty, loading, loadingText, trackBy, selectedItems, selectionType, isItemDisabled, onSelectionChange, ariaLabels, visibleSections, stickyHeader, stickyHeaderVerticalOffset, variant = 'container', renderAriaLive, firstIndex, totalItemsCount } = _a, rest = __rest(_a, ["items", "cardDefinition", "cardsPerRow", "header", "filter", "pagination", "preferences", "empty", "loading", "loadingText", "trackBy", "selectedItems", "selectionType", "isItemDisabled", "onSelectionChange", "ariaLabels", "visibleSections", "stickyHeader", "stickyHeaderVerticalOffset", "variant", "renderAriaLive", "firstIndex", "totalItemsCount"]);
     const { __internalRootRef } = useBaseComponent('Cards');
     const baseProps = getBaseProps(rest);
     const isRefresh = useVisualRefresh();
@@ -77,7 +77,9 @@ const Cards = React.forwardRef(function (_a, ref) {
     return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.root), ref: mergedRef }),
         React.createElement(InternalContainer, { header: hasToolsHeader && (React.createElement("div", { className: clsx(styles.header, isRefresh && styles['header-refresh'], styles[`header-variant-${computedVariant}`]) },
                 React.createElement(ToolsHeader, { header: header, filter: filter, pagination: pagination, preferences: preferences }))), disableContentPaddings: true, disableHeaderPaddings: computedVariant === 'full-page', variant: computedVariant === 'container' ? 'cards' : computedVariant, __stickyHeader: stickyHeader, __stickyOffset: stickyHeaderVerticalOffset, __headerRef: headerRef, __headerId: cardsHeaderId, __darkHeader: computedVariant === 'full-page' },
-            React.createElement("div", { className: clsx(hasToolsHeader && styles['has-header']) }, status !== null && status !== void 0 ? status : (React.createElement(CardsList, { items: items, cardDefinition: cardDefinition, trackBy: trackBy, selectionType: selectionType, columns: columns, isItemSelected: isItemSelected, getItemSelectionProps: getItemSelectionProps, visibleSections: visibleSections, updateShiftToggle: updateShiftToggle, onFocus: onCardFocus, ariaLabel: ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.cardsLabel, ariaLabelledby: (ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.cardsLabel) ? undefined : cardsHeaderId }))))));
+            React.createElement("div", { className: clsx(hasToolsHeader && styles['has-header']) },
+                !!renderAriaLive && !!firstIndex && (React.createElement(LiveRegion, null,
+                    React.createElement("span", null, renderAriaLive({ totalItemsCount, firstIndex, lastIndex: firstIndex + items.length - 1 })))), status !== null && status !== void 0 ? status : (React.createElement(CardsList, { items: items, cardDefinition: cardDefinition, trackBy: trackBy, selectionType: selectionType, columns: columns, isItemSelected: isItemSelected, getItemSelectionProps: getItemSelectionProps, visibleSections: visibleSections, updateShiftToggle: updateShiftToggle, onFocus: onCardFocus, ariaLabel: ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.cardsLabel, ariaLabelledby: (ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.cardsLabel) ? undefined : cardsHeaderId }))))));
 });
 export default Cards;
 const CardsList = ({ items, cardDefinition, trackBy, selectionType, columns, isItemSelected, getItemSelectionProps, visibleSections, updateShiftToggle, onFocus, ariaLabelledby, ariaLabel, }) => {

package/lib/internal/template/cards/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["cards/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { FocusEventHandler, useImperativeHandle, useRef } from 'react';\nimport { CardsForwardRefType, CardsProps } from './interfaces';\nimport styles from './styles.css.js';\nimport { getCardsPerRow } from './cards-layout-helper';\nimport { getBaseProps } from '../internal/base-component';\nimport { useContainerQuery } from '../internal/hooks/container-queries/use-container-query';\nimport ToolsHeader from '../table/tools-header';\nimport { getItemKey } from '../table/utils';\nimport { focusMarkers, useFocusMove, useSelection } from '../table/use-selection';\nimport SelectionControl, { SelectionControlProps } from '../table/selection-control';\nimport InternalContainer from '../container/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport stickyScrolling from '../table/sticky-scrolling';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport LiveRegion from '../internal/components/live-region';\nimport useMouseDownTarget from '../internal/hooks/use-mouse-down-target';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { supportsStickyPosition } from '../internal/utils/dom';\n\nexport { CardsProps };\n\nconst Cards = React.forwardRef(function <T = any>(\n {\n items = [],\n cardDefinition,\n cardsPerRow = [],\n header,\n filter,\n pagination,\n preferences,\n empty,\n loading,\n loadingText,\n trackBy,\n selectedItems,\n selectionType,\n isItemDisabled,\n onSelectionChange,\n ariaLabels,\n visibleSections,\n stickyHeader,\n stickyHeaderVerticalOffset,\n variant = 'container',\n ...rest\n }: CardsProps<T>,\n ref: React.Ref<CardsProps.Ref>\n) {\n const { __internalRootRef } = useBaseComponent('Cards');\n const baseProps = getBaseProps(rest);\n const isRefresh = useVisualRefresh();\n const computedVariant = isRefresh ? variant : 'container';\n\n const instanceUniqueId = useUniqueId('cards');\n const cardsId = baseProps?.id \|\| instanceUniqueId;\n const cardsHeaderId = header ? `${cardsId}-header` : undefined;\n\n const [columns, measureRef] = useContainerQuery<number>(\n ({ width }) => getCardsPerRow(width, cardsPerRow),\n [cardsPerRow]\n );\n const refObject = useRef(null);\n const mergedRef = useMergeRefs(measureRef, refObject, __internalRootRef);\n const getMouseDownTarget = useMouseDownTarget();\n\n const { isItemSelected, getItemSelectionProps, updateShiftToggle } = useSelection({\n items,\n trackBy,\n selectedItems,\n selectionType,\n isItemDisabled,\n onSelectionChange,\n ariaLabels,\n });\n const hasToolsHeader = header \|\| filter \|\| pagination \|\| preferences;\n const headerRef = useRef<HTMLDivElement>(null);\n const isMobile = useMobile();\n const { scrollToTop, scrollToItem } = stickyScrolling(refObject, headerRef);\n stickyHeader = supportsStickyPosition() && !isMobile && stickyHeader;\n const onCardFocus: FocusEventHandler<HTMLElement> = event => {\n // When an element inside card receives focus we want to adjust the scroll.\n // However, that behavior is unwanted when the focus is received as result of a click\n // as it causes the click to never reach the target element.\n if (stickyHeader && !event.currentTarget.contains(getMouseDownTarget())) {\n scrollToItem(event.currentTarget);\n }\n };\n useImperativeHandle(\n ref,\n () => ({\n scrollToTop: () => {\n if (stickyHeader) {\n scrollToTop();\n }\n },\n }),\n [stickyHeader, scrollToTop]\n );\n let status;\n if (loading) {\n status = (\n <div className={styles.loading}>\n <InternalStatusIndicator type=\"loading\">\n <LiveRegion visible={true}>{loadingText}</LiveRegion>\n </InternalStatusIndicator>\n </div>\n );\n } else if (empty && !items.length) {\n status = <div className={styles.empty}>{empty}</div>;\n }\n\n return (\n <div {...baseProps} className={clsx(baseProps.className, styles.root)} ref={mergedRef}>\n <InternalContainer\n header={\n hasToolsHeader && (\n <div\n className={clsx(\n styles.header,\n isRefresh && styles['header-refresh'],\n styles[`header-variant-${computedVariant}`]\n )}\n >\n <ToolsHeader header={header} filter={filter} pagination={pagination} preferences={preferences} />\n </div>\n )\n }\n disableContentPaddings={true}\n disableHeaderPaddings={computedVariant === 'full-page'}\n variant={computedVariant === 'container' ? 'cards' : computedVariant}\n __stickyHeader={stickyHeader}\n __stickyOffset={stickyHeaderVerticalOffset}\n __headerRef={headerRef}\n __headerId={cardsHeaderId}\n __darkHeader={computedVariant === 'full-page'}\n >\n <div className={clsx(hasToolsHeader && styles['has-header'])}>\n {status ?? (\n <CardsList\n items={items}\n cardDefinition={cardDefinition}\n trackBy={trackBy}\n selectionType={selectionType}\n columns={columns}\n isItemSelected={isItemSelected}\n getItemSelectionProps={getItemSelectionProps}\n visibleSections={visibleSections}\n updateShiftToggle={updateShiftToggle}\n onFocus={onCardFocus}\n ariaLabel={ariaLabels?.cardsLabel}\n ariaLabelledby={ariaLabels?.cardsLabel ? undefined : cardsHeaderId}\n />\n )}\n </div>\n </InternalContainer>\n </div>\n );\n}) as CardsForwardRefType;\n\nexport default Cards;\n\nconst CardsList = <T,>({\n items,\n cardDefinition,\n trackBy,\n selectionType,\n columns,\n isItemSelected,\n getItemSelectionProps,\n visibleSections,\n updateShiftToggle,\n onFocus,\n ariaLabelledby,\n ariaLabel,\n}: Pick<CardsProps<T>, 'items' \| 'cardDefinition' \| 'trackBy' \| 'selectionType' \| 'visibleSections'> & {\n columns: number \| null;\n isItemSelected: (item: T) => boolean;\n getItemSelectionProps: (item: T) => SelectionControlProps;\n updateShiftToggle: (state: boolean) => void;\n onFocus: FocusEventHandler<HTMLElement>;\n ariaLabel?: string;\n ariaLabelledby?: string;\n ariaDescribedby?: string;\n}) => {\n const selectable = !!selectionType;\n\n const { moveFocusDown, moveFocusUp } = useFocusMove(selectionType, items.length);\n\n let visibleSectionsDefinition = cardDefinition.sections \|\| [];\n visibleSectionsDefinition = visibleSections\n ? visibleSectionsDefinition.filter(\n (section: CardsProps.SectionDefinition<T>) => section.id && visibleSections.indexOf(section.id) !== -1\n )\n : visibleSectionsDefinition;\n\n let listRole: 'group' \| undefined = undefined;\n let listItemRole: 'presentation' \| undefined = undefined;\n\n if (selectable) {\n listRole = 'group';\n listItemRole = 'presentation';\n }\n\n return (\n <ol\n className={clsx(styles.list, styles[`list-grid-${columns \|\| 1}`])}\n role={listRole}\n aria-labelledby={ariaLabelledby}\n aria-label={ariaLabel}\n {...(focusMarkers && focusMarkers.root)}\n >\n {items.map((item, index) => (\n <li\n className={clsx(styles.card, {\n [styles['card-selectable']]: selectable,\n [styles['card-selected']]: selectable && isItemSelected(item),\n })}\n key={getItemKey(trackBy, item, index)}\n onFocus={onFocus}\n {...(focusMarkers && focusMarkers.item)}\n role={listItemRole}\n >\n <div className={styles['card-inner']}>\n <div className={styles['card-header']}>\n <div className={styles['card-header-inner']}>\n {cardDefinition.header ? cardDefinition.header(item) : ''}\n </div>\n {selectable && (\n <div className={styles['selection-control']}>\n <SelectionControl\n onFocusDown={moveFocusDown}\n onFocusUp={moveFocusUp}\n onShiftToggle={updateShiftToggle}\n {...getItemSelectionProps(item)}\n />\n </div>\n )}\n </div>\n {visibleSectionsDefinition.map(({ width = 100, header, content, id }, index) => (\n <div key={id \|\| index} className={styles.section} style={{ width: `${width}%` }}>\n {header ? <div className={styles['section-header']}>{header}</div> : ''}\n {content ? <div className={styles['section-content']}>{content(item)}</div> : ''}\n </div>\n ))}\n </div>\n </li>\n ))}\n </ol>\n );\n};\n\napplyDisplayName(Cards, 'Cards');\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["cards/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { FocusEventHandler, useImperativeHandle, useRef } from 'react';\nimport { CardsForwardRefType, CardsProps } from './interfaces';\nimport styles from './styles.css.js';\nimport { getCardsPerRow } from './cards-layout-helper';\nimport { getBaseProps } from '../internal/base-component';\nimport { useContainerQuery } from '../internal/hooks/container-queries/use-container-query';\nimport ToolsHeader from '../table/tools-header';\nimport { getItemKey } from '../table/utils';\nimport { focusMarkers, useFocusMove, useSelection } from '../table/use-selection';\nimport SelectionControl, { SelectionControlProps } from '../table/selection-control';\nimport InternalContainer from '../container/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport stickyScrolling from '../table/sticky-scrolling';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport LiveRegion from '../internal/components/live-region';\nimport useMouseDownTarget from '../internal/hooks/use-mouse-down-target';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { supportsStickyPosition } from '../internal/utils/dom';\n\nexport { CardsProps };\n\nconst Cards = React.forwardRef(function <T = any>(\n {\n items = [],\n cardDefinition,\n cardsPerRow = [],\n header,\n filter,\n pagination,\n preferences,\n empty,\n loading,\n loadingText,\n trackBy,\n selectedItems,\n selectionType,\n isItemDisabled,\n onSelectionChange,\n ariaLabels,\n visibleSections,\n stickyHeader,\n stickyHeaderVerticalOffset,\n variant = 'container',\n renderAriaLive,\n firstIndex,\n totalItemsCount,\n ...rest\n }: CardsProps<T>,\n ref: React.Ref<CardsProps.Ref>\n) {\n const { __internalRootRef } = useBaseComponent('Cards');\n const baseProps = getBaseProps(rest);\n const isRefresh = useVisualRefresh();\n const computedVariant = isRefresh ? variant : 'container';\n\n const instanceUniqueId = useUniqueId('cards');\n const cardsId = baseProps?.id \|\| instanceUniqueId;\n const cardsHeaderId = header ? `${cardsId}-header` : undefined;\n\n const [columns, measureRef] = useContainerQuery<number>(\n ({ width }) => getCardsPerRow(width, cardsPerRow),\n [cardsPerRow]\n );\n const refObject = useRef(null);\n const mergedRef = useMergeRefs(measureRef, refObject, __internalRootRef);\n const getMouseDownTarget = useMouseDownTarget();\n\n const { isItemSelected, getItemSelectionProps, updateShiftToggle } = useSelection({\n items,\n trackBy,\n selectedItems,\n selectionType,\n isItemDisabled,\n onSelectionChange,\n ariaLabels,\n });\n const hasToolsHeader = header \|\| filter \|\| pagination \|\| preferences;\n const headerRef = useRef<HTMLDivElement>(null);\n const isMobile = useMobile();\n const { scrollToTop, scrollToItem } = stickyScrolling(refObject, headerRef);\n stickyHeader = supportsStickyPosition() && !isMobile && stickyHeader;\n const onCardFocus: FocusEventHandler<HTMLElement> = event => {\n // When an element inside card receives focus we want to adjust the scroll.\n // However, that behavior is unwanted when the focus is received as result of a click\n // as it causes the click to never reach the target element.\n if (stickyHeader && !event.currentTarget.contains(getMouseDownTarget())) {\n scrollToItem(event.currentTarget);\n }\n };\n useImperativeHandle(\n ref,\n () => ({\n scrollToTop: () => {\n if (stickyHeader) {\n scrollToTop();\n }\n },\n }),\n [stickyHeader, scrollToTop]\n );\n let status;\n if (loading) {\n status = (\n <div className={styles.loading}>\n <InternalStatusIndicator type=\"loading\">\n <LiveRegion visible={true}>{loadingText}</LiveRegion>\n </InternalStatusIndicator>\n </div>\n );\n } else if (empty && !items.length) {\n status = <div className={styles.empty}>{empty}</div>;\n }\n\n return (\n <div {...baseProps} className={clsx(baseProps.className, styles.root)} ref={mergedRef}>\n <InternalContainer\n header={\n hasToolsHeader && (\n <div\n className={clsx(\n styles.header,\n isRefresh && styles['header-refresh'],\n styles[`header-variant-${computedVariant}`]\n )}\n >\n <ToolsHeader header={header} filter={filter} pagination={pagination} preferences={preferences} />\n </div>\n )\n }\n disableContentPaddings={true}\n disableHeaderPaddings={computedVariant === 'full-page'}\n variant={computedVariant === 'container' ? 'cards' : computedVariant}\n __stickyHeader={stickyHeader}\n __stickyOffset={stickyHeaderVerticalOffset}\n __headerRef={headerRef}\n __headerId={cardsHeaderId}\n __darkHeader={computedVariant === 'full-page'}\n >\n <div className={clsx(hasToolsHeader && styles['has-header'])}>\n {!!renderAriaLive && !!firstIndex && (\n <LiveRegion>\n <span>{renderAriaLive({ totalItemsCount, firstIndex, lastIndex: firstIndex + items.length - 1 })}</span>\n </LiveRegion>\n )}\n {status ?? (\n <CardsList\n items={items}\n cardDefinition={cardDefinition}\n trackBy={trackBy}\n selectionType={selectionType}\n columns={columns}\n isItemSelected={isItemSelected}\n getItemSelectionProps={getItemSelectionProps}\n visibleSections={visibleSections}\n updateShiftToggle={updateShiftToggle}\n onFocus={onCardFocus}\n ariaLabel={ariaLabels?.cardsLabel}\n ariaLabelledby={ariaLabels?.cardsLabel ? undefined : cardsHeaderId}\n />\n )}\n </div>\n </InternalContainer>\n </div>\n );\n}) as CardsForwardRefType;\n\nexport default Cards;\n\nconst CardsList = <T,>({\n items,\n cardDefinition,\n trackBy,\n selectionType,\n columns,\n isItemSelected,\n getItemSelectionProps,\n visibleSections,\n updateShiftToggle,\n onFocus,\n ariaLabelledby,\n ariaLabel,\n}: Pick<CardsProps<T>, 'items' \| 'cardDefinition' \| 'trackBy' \| 'selectionType' \| 'visibleSections'> & {\n columns: number \| null;\n isItemSelected: (item: T) => boolean;\n getItemSelectionProps: (item: T) => SelectionControlProps;\n updateShiftToggle: (state: boolean) => void;\n onFocus: FocusEventHandler<HTMLElement>;\n ariaLabel?: string;\n ariaLabelledby?: string;\n ariaDescribedby?: string;\n}) => {\n const selectable = !!selectionType;\n\n const { moveFocusDown, moveFocusUp } = useFocusMove(selectionType, items.length);\n\n let visibleSectionsDefinition = cardDefinition.sections \|\| [];\n visibleSectionsDefinition = visibleSections\n ? visibleSectionsDefinition.filter(\n (section: CardsProps.SectionDefinition<T>) => section.id && visibleSections.indexOf(section.id) !== -1\n )\n : visibleSectionsDefinition;\n\n let listRole: 'group' \| undefined = undefined;\n let listItemRole: 'presentation' \| undefined = undefined;\n\n if (selectable) {\n listRole = 'group';\n listItemRole = 'presentation';\n }\n\n return (\n <ol\n className={clsx(styles.list, styles[`list-grid-${columns \|\| 1}`])}\n role={listRole}\n aria-labelledby={ariaLabelledby}\n aria-label={ariaLabel}\n {...(focusMarkers && focusMarkers.root)}\n >\n {items.map((item, index) => (\n <li\n className={clsx(styles.card, {\n [styles['card-selectable']]: selectable,\n [styles['card-selected']]: selectable && isItemSelected(item),\n })}\n key={getItemKey(trackBy, item, index)}\n onFocus={onFocus}\n {...(focusMarkers && focusMarkers.item)}\n role={listItemRole}\n >\n <div className={styles['card-inner']}>\n <div className={styles['card-header']}>\n <div className={styles['card-header-inner']}>\n {cardDefinition.header ? cardDefinition.header(item) : ''}\n </div>\n {selectable && (\n <div className={styles['selection-control']}>\n <SelectionControl\n onFocusDown={moveFocusDown}\n onFocusUp={moveFocusUp}\n onShiftToggle={updateShiftToggle}\n {...getItemSelectionProps(item)}\n />\n </div>\n )}\n </div>\n {visibleSectionsDefinition.map(({ width = 100, header, content, id }, index) => (\n <div key={id \|\| index} className={styles.section} style={{ width: `${width}%` }}>\n {header ? <div className={styles['section-header']}>{header}</div> : ''}\n {content ? <div className={styles['section-content']}>{content(item)}</div> : ''}\n </div>\n ))}\n </div>\n </li>\n ))}\n </ol>\n );\n};\n\napplyDisplayName(Cards, 'Cards');\n"]}

package/lib/internal/template/cards/interfaces.d.ts CHANGED Viewed

@@ -161,6 +161,21 @@ export interface CardsProps<T = any> extends BaseComponentProps {
      * need to position the sticky header below other fixed position elements on the page.
      */
     stickyHeaderVerticalOffset?: number;
+    /**
+     * Use this property to inform screen readers how many cards there are.
+     * It specifies the total number of cards.
+     * If there is an unknown total number of cards, leave this property undefined.   */
+    totalItemsCount?: number;
+    /**
+     *  Use this property to inform screen readers which range of cards is currently displayed.
+     *  It specifies the index (1-based) of the first card.
+     *  If the cards list has no pagination, leave this property undefined.   */
+    firstIndex?: number;
+    /**
+     * Use this function to announce page changes to screen reader users.
+     * Requires the properties firstIndex and totalItemsCount to be set correctly.
+     */
+    renderAriaLive?: (data: CardsProps.LiveAnnouncement) => string;
     /**
      * Specify a cards variant with one of the following:
      * * `container` - Use this variant to have the cards displayed as a container.
@@ -199,6 +214,11 @@ export declare namespace CardsProps {
         selectionGroupLabel: string;
         cardsLabel?: string;
     }
+    interface LiveAnnouncement {
+        totalItemsCount?: number;
+        firstIndex: number;
+        lastIndex: number;
+    }
     interface Ref {
         /**
          * When the sticky header is enabled, calling this function scrolls cards's

package/lib/internal/template/cards/interfaces.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"interfaces.d.ts","sourceRoot":"lib/default/","sources":["cards/interfaces.tsx"],"names":[],"mappings":"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~~IACD~~,UAAiB,GAAG;QAClB;;;WAGG;QACH,WAAW,IAAI,IAAI,CAAC;KACrB;CACF"}
1	+ {"version":3,"file":"interfaces.d.ts","sourceRoot":"lib/default/","sources":["cards/interfaces.tsx"],"names":[],"mappings":"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"}

package/lib/internal/template/cards/interfaces.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"interfaces.js","sourceRoot":"lib/default/","sources":["cards/interfaces.tsx"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\n\n/\n HACK: Cast the component to a named parametrized interface.\n \n This lets us use React.forwardRef and still let the component have type\n * parameters, and the naming convention lets the documenter know that this is\n * a forwardRef-wrapped component.\n \n We don't need to expose this type to customers because it's just a simple\n * function type.\n /\nexport interface CardsForwardRefType {\n <T>(props: CardsProps<T> & { ref?: React.Ref<CardsProps.Ref> }): JSX.Element;\n}\n\nexport interface CardsProps<T = any> extends BaseComponentProps {\n /\n Displayed only when the list of items is empty.\n /\n empty?: React.ReactNode;\n\n /\n Heading element of the table container. Use the [header component](/components/header/).\n /\n header?: React.ReactNode;\n\n /\n Use this slot to add filtering controls to the component.\n /\n filter?: React.ReactNode;\n\n /\n Use this slot to add the [pagination component](/components/pagination/) to the component.\n /\n pagination?: React.ReactNode;\n\n /\n Use this slot to add [collection preferences](/components/collection-preferences/) to the component.\n /\n preferences?: React.ReactNode;\n\n /\n Specifies the items that serve as data source for a card.\n \n The `cardDefinition` property handles the display of this data.\n /\n items: ReadonlyArray<T>;\n\n /\n Renders the cards in a loading state. We recommend that you also set a `loadingText`.\n /\n loading?: boolean;\n\n /\n Specifies the text to display when in loading state.\n /\n loadingText?: string;\n\n /\n Defines what to display in each card. It has the following properties:\n * * `header` ((item) => ReactNode) - Responsible for displaying the card header. You receive the current item as an argument.\n * Use `fontSize=\"heading-m\"` on [link](/components/link/) components inside card header.\n * * `sections` (array) - Responsible for displaying the card content. Cards can have many sections in their\n * body. Each entry in the array is responsible for displaying a section. An entry has the following properties:\n * * `id`: (string) - A unique identifier for the section. The property is used as a [keys](https://reactjs.org/docs/lists-and-keys.html#keys)\n * source for React rendering, and to match entries in the `visibleSections` property (if it's defined).\n * * `header`: (ReactNode) - Responsible for displaying the section header.\n * * `content`: ((item) => ReactNode) - Responsible for displaying the section content. You receive the current item as an argument.\n * * `width`: (number) - Specifies the width of the card section in percent. Use this to display multiple sections in\n * the same row. The default value is 100%.\n \n All of the above properties are optional.\n /\n cardDefinition: CardsProps.CardDefinition<T>;\n /\n Determines the number of cards per row for any interval of container width.\n * It's an array whose entries are objects containing the following:\n * - `cards` (number) - Specifies the number of cards per row.\n * - `minWidth` (number) - Specifies the minimum container width (in pixels) for which this configuration object should apply.\n \n For example, with this configuration:\n * ```\n * [{\n * cards: 1\n * }, {\n * minWidth: 500,\n * cards: 2\n * }, {\n * minWidth: 800,\n * cards: 3\n * }]\n * ```\n \n the cards component displays:\n * * 1 card per row when the container width is below 500px.\n * * 2 cards per row when the container width is between 500px and 799px.\n * * 3 cards per row when the container width is 800px or wider.\n \n The number of cards per row can't be greater than 20.\n \n Default value:\n * ```\n * [{\n * cards: 1\n * }, {\n * minWidth: 768,\n * cards: 2\n * }, {\n * minWidth: 992,\n * cards: 3\n * }, {\n * minWidth: 1200,\n * cards: 4\n * }, {\n * minWidth: 1400,\n * cards: 5\n * }, {\n * minWidth: 1920,\n * cards: 6\n * }]\n * ```\n /\n cardsPerRow?: ReadonlyArray<CardsProps.CardsLayout>;\n /\n Specifies the property inside items that uniquely identifies them.\n * When it's set, it's used to provide [keys for React](https://reactjs.org/docs/lists-and-keys.html#keys)\n * for performance optimizations.\n \n It's also used for connecting `items` and `selectedItems` values when they don't reference the same object.\n /\n trackBy?: CardsProps.TrackBy<T>;\n /\n Specifies the selection mode. It can be either `single` or `multi`.\n /\n selectionType?: CardsProps.SelectionType;\n /\n Specifies the list of selected items.\n /\n selectedItems?: ReadonlyArray<T>;\n /\n Determines which items are disabled. If an item is disabled, users can't select it.\n /\n isItemDisabled?: CardsProps.IsItemDisabled<T>;\n /\n Adds labels to the selection components (checkboxes and radio buttons) as follows:\n * * `itemSelectionLabel` ((SelectionState, Item) => string) - Determines the label for an item.\n * * `selectionGroupLabel` (string) - Specifies the label for the group selection control.\n * * `cardsLabel` (string) - Provides alternative text for the cards list.\n * By default the contents of the `header` are used.\n \n You can use the first arguments of type `SelectionState` to access the current selection\n * state of the component (for example, the `selectedItems` list). The label function for individual\n * items also receives the corresponding `Item` object. You can use the group label to\n * add a meaningful description to the whole selection.\n /\n ariaLabels?: CardsProps.AriaLabels<T>;\n /\n Specifies an array containing the `id` of each visible section. If not set, all sections are displayed.\n \n Use it in conjunction with the visible content preference of the [collection preferences](/components/collection-preferences/) component.\n \n The order of `id`s doesn't influence the order of display of sections, which is controlled by the `cardDefinition` property.\n /\n visibleSections?: ReadonlyArray<string>;\n /\n Called when a user interaction causes a change in the list of selected items.\n * The event `detail` contains the current list of `selectedItems`.\n /\n onSelectionChange?: NonCancelableEventHandler<CardsProps.SelectionChangeDetail<T>>;\n /\n If set to true, the cards header remains visible when the user scrolls down.\n /\n stickyHeader?: boolean;\n /\n Optionally provide a vertical offset (in pixels) for the sticky header, for example if you\n * need to position the sticky header below other fixed position elements on the page.\n /\n stickyHeaderVerticalOffset?: number;\n\n /\n Specify a cards variant with one of the following:\n * * `container` - Use this variant to have the cards displayed as a container.\n * * `full-page` – Use this variant when cards are the entire content of a page. Full page variants\n * implement the high contrast header and content behavior automatically.\n * @visualrefresh `full-page` variant\n /\n variant?: 'container' \| 'full-page';\n}\n\nexport namespace CardsProps {\n export interface CardDefinition<T> {\n header?(item: T): React.ReactNode;\n sections?: ReadonlyArray<SectionDefinition<T>>;\n }\n\n export interface SectionDefinition<T> {\n id?: string;\n header?: React.ReactNode;\n content?(item: T): React.ReactNode;\n width?: number;\n }\n\n export interface CardsLayout {\n cards: number;\n minWidth?: number;\n }\n\n export type TrackBy<T> = string \| ((item: T) => string);\n\n export type SelectionType = 'single' \| 'multi';\n\n export interface SelectionState<T> {\n selectedItems: ReadonlyArray<T>;\n }\n\n export interface SelectionChangeDetail<T> {\n selectedItems: T[];\n }\n\n export type IsItemDisabled<T> = (item: T) => boolean;\n\n export interface AriaLabels<T> {\n itemSelectionLabel: (data: CardsProps.SelectionState<T>, row: T) => string;\n selectionGroupLabel: string;\n cardsLabel?: string;\n }\n export interface Ref {\n /\n When the sticky header is enabled, calling this function scrolls cards's\n * scroll parent up to reveal the first card or row of cards.\n */\n scrollToTop(): void;\n }\n}\n"]}
1	+ {"version":3,"file":"interfaces.js","sourceRoot":"lib/default/","sources":["cards/interfaces.tsx"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\n\n/\n HACK: Cast the component to a named parametrized interface.\n \n This lets us use React.forwardRef and still let the component have type\n * parameters, and the naming convention lets the documenter know that this is\n * a forwardRef-wrapped component.\n \n We don't need to expose this type to customers because it's just a simple\n * function type.\n /\nexport interface CardsForwardRefType {\n <T>(props: CardsProps<T> & { ref?: React.Ref<CardsProps.Ref> }): JSX.Element;\n}\n\nexport interface CardsProps<T = any> extends BaseComponentProps {\n /\n Displayed only when the list of items is empty.\n /\n empty?: React.ReactNode;\n\n /\n Heading element of the table container. Use the [header component](/components/header/).\n /\n header?: React.ReactNode;\n\n /\n Use this slot to add filtering controls to the component.\n /\n filter?: React.ReactNode;\n\n /\n Use this slot to add the [pagination component](/components/pagination/) to the component.\n /\n pagination?: React.ReactNode;\n\n /\n Use this slot to add [collection preferences](/components/collection-preferences/) to the component.\n /\n preferences?: React.ReactNode;\n\n /\n Specifies the items that serve as data source for a card.\n \n The `cardDefinition` property handles the display of this data.\n /\n items: ReadonlyArray<T>;\n\n /\n Renders the cards in a loading state. We recommend that you also set a `loadingText`.\n /\n loading?: boolean;\n\n /\n Specifies the text to display when in loading state.\n /\n loadingText?: string;\n\n /\n Defines what to display in each card. It has the following properties:\n * * `header` ((item) => ReactNode) - Responsible for displaying the card header. You receive the current item as an argument.\n * Use `fontSize=\"heading-m\"` on [link](/components/link/) components inside card header.\n * * `sections` (array) - Responsible for displaying the card content. Cards can have many sections in their\n * body. Each entry in the array is responsible for displaying a section. An entry has the following properties:\n * * `id`: (string) - A unique identifier for the section. The property is used as a [keys](https://reactjs.org/docs/lists-and-keys.html#keys)\n * source for React rendering, and to match entries in the `visibleSections` property (if it's defined).\n * * `header`: (ReactNode) - Responsible for displaying the section header.\n * * `content`: ((item) => ReactNode) - Responsible for displaying the section content. You receive the current item as an argument.\n * * `width`: (number) - Specifies the width of the card section in percent. Use this to display multiple sections in\n * the same row. The default value is 100%.\n \n All of the above properties are optional.\n /\n cardDefinition: CardsProps.CardDefinition<T>;\n /\n Determines the number of cards per row for any interval of container width.\n * It's an array whose entries are objects containing the following:\n * - `cards` (number) - Specifies the number of cards per row.\n * - `minWidth` (number) - Specifies the minimum container width (in pixels) for which this configuration object should apply.\n \n For example, with this configuration:\n * ```\n * [{\n * cards: 1\n * }, {\n * minWidth: 500,\n * cards: 2\n * }, {\n * minWidth: 800,\n * cards: 3\n * }]\n * ```\n \n the cards component displays:\n * * 1 card per row when the container width is below 500px.\n * * 2 cards per row when the container width is between 500px and 799px.\n * * 3 cards per row when the container width is 800px or wider.\n \n The number of cards per row can't be greater than 20.\n \n Default value:\n * ```\n * [{\n * cards: 1\n * }, {\n * minWidth: 768,\n * cards: 2\n * }, {\n * minWidth: 992,\n * cards: 3\n * }, {\n * minWidth: 1200,\n * cards: 4\n * }, {\n * minWidth: 1400,\n * cards: 5\n * }, {\n * minWidth: 1920,\n * cards: 6\n * }]\n * ```\n /\n cardsPerRow?: ReadonlyArray<CardsProps.CardsLayout>;\n /\n Specifies the property inside items that uniquely identifies them.\n * When it's set, it's used to provide [keys for React](https://reactjs.org/docs/lists-and-keys.html#keys)\n * for performance optimizations.\n \n It's also used for connecting `items` and `selectedItems` values when they don't reference the same object.\n /\n trackBy?: CardsProps.TrackBy<T>;\n /\n Specifies the selection mode. It can be either `single` or `multi`.\n /\n selectionType?: CardsProps.SelectionType;\n /\n Specifies the list of selected items.\n /\n selectedItems?: ReadonlyArray<T>;\n /\n Determines which items are disabled. If an item is disabled, users can't select it.\n /\n isItemDisabled?: CardsProps.IsItemDisabled<T>;\n /\n Adds labels to the selection components (checkboxes and radio buttons) as follows:\n * * `itemSelectionLabel` ((SelectionState, Item) => string) - Determines the label for an item.\n * * `selectionGroupLabel` (string) - Specifies the label for the group selection control.\n * * `cardsLabel` (string) - Provides alternative text for the cards list.\n * By default the contents of the `header` are used.\n \n You can use the first arguments of type `SelectionState` to access the current selection\n * state of the component (for example, the `selectedItems` list). The label function for individual\n * items also receives the corresponding `Item` object. You can use the group label to\n * add a meaningful description to the whole selection.\n /\n ariaLabels?: CardsProps.AriaLabels<T>;\n /\n Specifies an array containing the `id` of each visible section. If not set, all sections are displayed.\n \n Use it in conjunction with the visible content preference of the [collection preferences](/components/collection-preferences/) component.\n \n The order of `id`s doesn't influence the order of display of sections, which is controlled by the `cardDefinition` property.\n /\n visibleSections?: ReadonlyArray<string>;\n /\n Called when a user interaction causes a change in the list of selected items.\n * The event `detail` contains the current list of `selectedItems`.\n /\n onSelectionChange?: NonCancelableEventHandler<CardsProps.SelectionChangeDetail<T>>;\n /\n If set to true, the cards header remains visible when the user scrolls down.\n /\n stickyHeader?: boolean;\n /\n Optionally provide a vertical offset (in pixels) for the sticky header, for example if you\n * need to position the sticky header below other fixed position elements on the page.\n /\n stickyHeaderVerticalOffset?: number;\n\n /\n Use this property to inform screen readers how many cards there are.\n * It specifies the total number of cards.\n * If there is an unknown total number of cards, leave this property undefined. /\n totalItemsCount?: number;\n /\n Use this property to inform screen readers which range of cards is currently displayed.\n * It specifies the index (1-based) of the first card.\n * If the cards list has no pagination, leave this property undefined. /\n firstIndex?: number;\n /\n Use this function to announce page changes to screen reader users.\n * Requires the properties firstIndex and totalItemsCount to be set correctly.\n /\n renderAriaLive?: (data: CardsProps.LiveAnnouncement) => string;\n\n /\n Specify a cards variant with one of the following:\n * * `container` - Use this variant to have the cards displayed as a container.\n * * `full-page` – Use this variant when cards are the entire content of a page. Full page variants\n * implement the high contrast header and content behavior automatically.\n * @visualrefresh `full-page` variant\n /\n variant?: 'container' \| 'full-page';\n}\n\nexport namespace CardsProps {\n export interface CardDefinition<T> {\n header?(item: T): React.ReactNode;\n sections?: ReadonlyArray<SectionDefinition<T>>;\n }\n\n export interface SectionDefinition<T> {\n id?: string;\n header?: React.ReactNode;\n content?(item: T): React.ReactNode;\n width?: number;\n }\n\n export interface CardsLayout {\n cards: number;\n minWidth?: number;\n }\n\n export type TrackBy<T> = string \| ((item: T) => string);\n\n export type SelectionType = 'single' \| 'multi';\n\n export interface SelectionState<T> {\n selectedItems: ReadonlyArray<T>;\n }\n\n export interface SelectionChangeDetail<T> {\n selectedItems: T[];\n }\n\n export type IsItemDisabled<T> = (item: T) => boolean;\n\n export interface AriaLabels<T> {\n itemSelectionLabel: (data: CardsProps.SelectionState<T>, row: T) => string;\n selectionGroupLabel: string;\n cardsLabel?: string;\n }\n\n export interface LiveAnnouncement {\n totalItemsCount?: number;\n firstIndex: number;\n lastIndex: number;\n }\n\n export interface Ref {\n /\n When the sticky header is enabled, calling this function scrolls cards's\n * scroll parent up to reveal the first card or row of cards.\n */\n scrollToTop(): void;\n }\n}\n"]}

package/lib/internal/template/flashbar/styles.css.js CHANGED Viewed

@@ -1,50 +1,50 @@
     import './styles.scoped.css';
     export default {
-  "flash-with-motion": "awsui_flash-with-motion_1q84n_1va6q_93",
-  "enter": "awsui_enter_1q84n_1va6q_93",
-  "flash-body": "awsui_flash-body_1q84n_1va6q_107",
-  "flash-message": "awsui_flash-message_1q84n_1va6q_107",
-  "flash-header": "awsui_flash-header_1q84n_1va6q_107",
-  "flash-content": "awsui_flash-content_1q84n_1va6q_108",
-  "action-button-wrapper": "awsui_action-button-wrapper_1q84n_1va6q_109",
-  "dismiss-button-wrapper": "awsui_dismiss-button-wrapper_1q84n_1va6q_110",
-  "flash-icon": "awsui_flash-icon_1q84n_1va6q_133",
-  "entering": "awsui_entering_1q84n_1va6q_146",
-  "entered": "awsui_entered_1q84n_1va6q_167",
-  "exiting": "awsui_exiting_1q84n_1va6q_272",
-  "stack": "awsui_stack_1q84n_1va6q_294",
-  "animation-running": "awsui_animation-running_1q84n_1va6q_294",
-  "item": "awsui_item_1q84n_1va6q_294",
-  "flash-list-item": "awsui_flash-list-item_1q84n_1va6q_295",
-  "notification-bar": "awsui_notification-bar_1q84n_1va6q_296",
-  "collapsed": "awsui_collapsed_1q84n_1va6q_316",
-  "animation-ready": "awsui_animation-ready_1q84n_1va6q_316",
-  "expanded-only": "awsui_expanded-only_1q84n_1va6q_316",
-  "expanded": "awsui_expanded_1q84n_1va6q_316",
-  "flash": "awsui_flash_1q84n_1va6q_93",
-  "collapsible": "awsui_collapsible_1q84n_1va6q_380",
-  "short-list": "awsui_short-list_1q84n_1va6q_386",
-  "visual-refresh": "awsui_visual-refresh_1q84n_1va6q_386",
-  "status": "awsui_status_1q84n_1va6q_603",
-  "header": "awsui_header_1q84n_1va6q_603",
-  "item-count": "awsui_item-count_1q84n_1va6q_604",
-  "button": "awsui_button_1q84n_1va6q_605",
-  "type-count": "awsui_type-count_1q84n_1va6q_640",
-  "count-number": "awsui_count-number_1q84n_1va6q_640",
-  "icon": "awsui_icon_1q84n_1va6q_674",
-  "floating": "awsui_floating_1q84n_1va6q_712",
-  "flashbar": "awsui_flashbar_1q84n_1va6q_720",
-  "flash-refresh": "awsui_flash-refresh_1q84n_1va6q_766",
-  "flash-list": "awsui_flash-list_1q84n_1va6q_295",
-  "flash-focus-container": "awsui_flash-focus-container_1q84n_1va6q_785",
-  "flash-text": "awsui_flash-text_1q84n_1va6q_812",
-  "dismiss-button": "awsui_dismiss-button_1q84n_1va6q_110",
-  "breakpoint-default": "awsui_breakpoint-default_1q84n_1va6q_853",
-  "action-button": "awsui_action-button_1q84n_1va6q_109",
-  "flash-type-success": "awsui_flash-type-success_1q84n_1va6q_866",
-  "flash-type-error": "awsui_flash-type-error_1q84n_1va6q_870",
-  "flash-type-warning": "awsui_flash-type-warning_1q84n_1va6q_874",
-  "flash-type-info": "awsui_flash-type-info_1q84n_1va6q_878"
+  "flash-with-motion": "awsui_flash-with-motion_1q84n_1tzdq_93",
+  "enter": "awsui_enter_1q84n_1tzdq_93",
+  "flash-body": "awsui_flash-body_1q84n_1tzdq_107",
+  "flash-message": "awsui_flash-message_1q84n_1tzdq_107",
+  "flash-header": "awsui_flash-header_1q84n_1tzdq_107",
+  "flash-content": "awsui_flash-content_1q84n_1tzdq_108",
+  "action-button-wrapper": "awsui_action-button-wrapper_1q84n_1tzdq_109",
+  "dismiss-button-wrapper": "awsui_dismiss-button-wrapper_1q84n_1tzdq_110",
+  "flash-icon": "awsui_flash-icon_1q84n_1tzdq_133",
+  "entering": "awsui_entering_1q84n_1tzdq_146",
+  "entered": "awsui_entered_1q84n_1tzdq_167",
+  "exiting": "awsui_exiting_1q84n_1tzdq_272",
+  "stack": "awsui_stack_1q84n_1tzdq_294",
+  "animation-running": "awsui_animation-running_1q84n_1tzdq_294",
+  "item": "awsui_item_1q84n_1tzdq_294",
+  "flash-list-item": "awsui_flash-list-item_1q84n_1tzdq_295",
+  "notification-bar": "awsui_notification-bar_1q84n_1tzdq_296",
+  "collapsed": "awsui_collapsed_1q84n_1tzdq_316",
+  "animation-ready": "awsui_animation-ready_1q84n_1tzdq_316",
+  "expanded-only": "awsui_expanded-only_1q84n_1tzdq_316",
+  "expanded": "awsui_expanded_1q84n_1tzdq_316",
+  "flash": "awsui_flash_1q84n_1tzdq_93",
+  "collapsible": "awsui_collapsible_1q84n_1tzdq_380",
+  "short-list": "awsui_short-list_1q84n_1tzdq_386",
+  "visual-refresh": "awsui_visual-refresh_1q84n_1tzdq_386",
+  "status": "awsui_status_1q84n_1tzdq_603",
+  "header": "awsui_header_1q84n_1tzdq_603",
+  "item-count": "awsui_item-count_1q84n_1tzdq_604",
+  "button": "awsui_button_1q84n_1tzdq_605",
+  "type-count": "awsui_type-count_1q84n_1tzdq_640",
+  "count-number": "awsui_count-number_1q84n_1tzdq_640",
+  "icon": "awsui_icon_1q84n_1tzdq_674",
+  "floating": "awsui_floating_1q84n_1tzdq_712",
+  "flashbar": "awsui_flashbar_1q84n_1tzdq_720",
+  "flash-refresh": "awsui_flash-refresh_1q84n_1tzdq_766",
+  "flash-list": "awsui_flash-list_1q84n_1tzdq_295",
+  "flash-focus-container": "awsui_flash-focus-container_1q84n_1tzdq_785",
+  "flash-text": "awsui_flash-text_1q84n_1tzdq_812",
+  "dismiss-button": "awsui_dismiss-button_1q84n_1tzdq_110",
+  "breakpoint-default": "awsui_breakpoint-default_1q84n_1tzdq_853",
+  "action-button": "awsui_action-button_1q84n_1tzdq_109",
+  "flash-type-success": "awsui_flash-type-success_1q84n_1tzdq_866",
+  "flash-type-error": "awsui_flash-type-error_1q84n_1tzdq_870",
+  "flash-type-warning": "awsui_flash-type-warning_1q84n_1tzdq_874",
+  "flash-type-info": "awsui_flash-type-info_1q84n_1tzdq_878"
 };