@cloudscape-design/board-components 3.0.67 → 3.0.69

package/internal/utils/use-auto-scroll.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-auto-scroll.js","sourceRoot":"","sources":["../../../../src/internal/utils/use-auto-scroll.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport { useLastInteraction } from \"./use-last-interaction\";\n\nexport function useAutoScroll() {\n  const [activeAutoScroll, setActiveAutoScroll] = useState<\"up\" | \"down\" | \"none\">(\"none\");\n  const scrollIntoViewTimerRef = useRef<null | ReturnType<typeof setTimeout>>(null);\n  const getLastInteraction = useLastInteraction();\n\n  // Scroll window repeatedly if activeAutoScroll=\"up\" or activeAutoScroll=\"down\".\n  useEffect(() => {\n    if (activeAutoScroll === \"none\") {\n      return;\n    }\n    const direction = activeAutoScroll === \"up\" ? -1 : 1;\n\n    let timer: ReturnType<typeof setTimeout>;\n\n    function scrollLoop() {\n      timer = setTimeout(() => {\n        window.scrollBy({ top: direction * 5 });\n        scrollLoop();\n      }, 10);\n    }\n    scrollLoop();\n\n    return () => clearTimeout(timer);\n  }, [activeAutoScroll]);\n\n  const onPointerMove = useCallback((event: PointerEvent) => {\n    const autoScrollMargin = 50;\n    if (event.clientY > window.innerHeight - autoScrollMargin) {\n      setActiveAutoScroll(\"down\");\n    } else if (event.clientY < autoScrollMargin) {\n      setActiveAutoScroll(\"up\");\n    } else {\n      setActiveAutoScroll(\"none\");\n    }\n  }, []);\n\n  const onPointerUp = useCallback(() => {\n    setActiveAutoScroll(\"none\");\n  }, []);\n\n  const addPointerEventHandlers = useCallback(() => {\n    if (getLastInteraction() === \"pointer\") {\n      window.addEventListener(\"pointermove\", onPointerMove);\n      window.addEventListener(\"pointerup\", onPointerUp);\n    }\n  }, [getLastInteraction, onPointerMove, onPointerUp]);\n\n  const removePointerEventHandlers = useCallback(() => {\n    window.removeEventListener(\"pointermove\", onPointerMove);\n    window.removeEventListener(\"pointerup\", onPointerUp);\n  }, [onPointerMove, onPointerUp]);\n\n  const scheduleActiveElementScrollIntoView = useCallback(\n    (delay: number) => {\n      scrollIntoViewTimerRef.current && clearTimeout(scrollIntoViewTimerRef.current);\n\n      const activeElementBeforeDelay = document.activeElement;\n\n      scrollIntoViewTimerRef.current = setTimeout(() => {\n        if (\n          document.activeElement &&\n          document.activeElement === activeElementBeforeDelay &&\n          getLastInteraction() === \"keyboard\"\n        ) {\n          document.activeElement.scrollIntoView?.({ behavior: \"smooth\", block: \"nearest\" });\n        }\n      }, delay);\n    },\n    [getLastInteraction],\n  );\n\n  return { addPointerEventHandlers, removePointerEventHandlers, scheduleActiveElementScrollIntoView };\n}\n"]}
+{"version":3,"file":"use-auto-scroll.js","sourceRoot":"","sources":["../../../../src/internal/utils/use-auto-scroll.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useCallback, useEffect, useRef, useState } from \"react\";\n\nimport { useLastInteraction } from \"./use-last-interaction\";\n\nexport function useAutoScroll() {\n  const [activeAutoScroll, setActiveAutoScroll] = useState<\"up\" | \"down\" | \"none\">(\"none\");\n  const scrollIntoViewTimerRef = useRef<null | ReturnType<typeof setTimeout>>(null);\n  const getLastInteraction = useLastInteraction();\n\n  // Scroll window repeatedly if activeAutoScroll=\"up\" or activeAutoScroll=\"down\".\n  useEffect(() => {\n    if (activeAutoScroll === \"none\") {\n      return;\n    }\n    const direction = activeAutoScroll === \"up\" ? -1 : 1;\n\n    let timer: ReturnType<typeof setTimeout>;\n\n    function scrollLoop() {\n      timer = setTimeout(() => {\n        window.scrollBy({ top: direction * 5 });\n        scrollLoop();\n      }, 10);\n    }\n    scrollLoop();\n\n    return () => clearTimeout(timer);\n  }, [activeAutoScroll]);\n\n  const onPointerMove = useCallback((event: PointerEvent) => {\n    const autoScrollMargin = 50;\n    if (event.clientY > window.innerHeight - autoScrollMargin) {\n      setActiveAutoScroll(\"down\");\n    } else if (event.clientY < autoScrollMargin) {\n      setActiveAutoScroll(\"up\");\n    } else {\n      setActiveAutoScroll(\"none\");\n    }\n  }, []);\n\n  const onPointerUp = useCallback(() => {\n    setActiveAutoScroll(\"none\");\n  }, []);\n\n  const addPointerEventHandlers = useCallback(() => {\n    if (getLastInteraction() === \"pointer\") {\n      window.addEventListener(\"pointermove\", onPointerMove);\n      window.addEventListener(\"pointerup\", onPointerUp);\n    }\n  }, [getLastInteraction, onPointerMove, onPointerUp]);\n\n  const removePointerEventHandlers = useCallback(() => {\n    window.removeEventListener(\"pointermove\", onPointerMove);\n    window.removeEventListener(\"pointerup\", onPointerUp);\n  }, [onPointerMove, onPointerUp]);\n\n  const scheduleActiveElementScrollIntoView = useCallback(\n    (delay: number) => {\n      scrollIntoViewTimerRef.current && clearTimeout(scrollIntoViewTimerRef.current);\n\n      const activeElementBeforeDelay = document.activeElement;\n\n      scrollIntoViewTimerRef.current = setTimeout(() => {\n        if (\n          document.activeElement &&\n          document.activeElement === activeElementBeforeDelay &&\n          getLastInteraction() === \"keyboard\"\n        ) {\n          document.activeElement.scrollIntoView?.({ behavior: \"smooth\", block: \"nearest\" });\n        }\n      }, delay);\n    },\n    [getLastInteraction],\n  );\n\n  return { addPointerEventHandlers, removePointerEventHandlers, scheduleActiveElementScrollIntoView };\n}\n"]}

package/items-palette/interfaces.d.ts

@@ -26,11 +26,6 @@ export interface ItemsPaletteProps<D = DataFallbackType> {
      * Live announcements:
      * * `liveAnnouncementDndStarted` (string) - live announcement string to indicate start of DnD.
      * * `liveAnnouncementDndDiscarded` (string) - live announcement string to indicate discard of DnD.
-     *
-     * Navigation labels:
-     * * `navigationAriaLabel` (string) - the ARIA label for the accessible board navigation element.
-     * * `navigationAriaDescription` (string, optional) - the ARIA description for the accessible board navigation element.
-     * * `navigationItemAriaLabel(null | BoardProps.Item<D>): string` - the function to create the ARIA label for a navigation board item.
      */
     i18nStrings: ItemsPaletteProps.I18nStrings<D>;
 }
@@ -42,8 +37,11 @@ export declare namespace ItemsPaletteProps {
     interface I18nStrings<D> {
         liveAnnouncementDndStarted: string;
         liveAnnouncementDndDiscarded: string;
+        /** @deprecated Has no effect. */
         navigationAriaLabel: string;
+        /** @deprecated Has no effect. */
         navigationAriaDescription?: string;
+        /** @deprecated Has no effect. */
         navigationItemAriaLabel: (item: ItemsPaletteProps.Item<D>) => string;
     }
 }

package/items-palette/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/items-palette/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { BoardItemDefinitionBase, DataFallbackType } from \"../internal/interfaces\";\n\n/*\n  Note:\n  The component does not provide handling of items state (loading, error, loaded).\n  It is the responsibility of the client to control it and provide the necessary\n  ARIA-live announcements.\n*/\n\nexport interface ItemsPaletteProps<D = DataFallbackType> {\n  /**\n   * Specifies the items displayed in the palette. The content of each item is controlled by the `renderItem` property.\n   *\n   * The ItemsPaletteProps.Item includes:\n   * * `id` (string) - the unique item identifier. The IDs of any two items in a page must be different.\n   * * `definition.minRowSpan` (number, optional) - the minimal number of rows the item is allowed to take. It can't be less than two. Defaults to two.\n   * * `definition.minColumnSpan` (number, optional) - the minimal number of columns the item is allowed to take (in a 4 column layout). It can't be less than one. Defaults to one.\n   * * `definition.defaultRowSpan` (number) - the number or rows the item will take when inserted to the board. It can't be less than `definition.minRowSpan`.\n   * * `definition.defaultColumnSpan` (number) - the number or columns the item will take (in a 4 column layout) when inserted to the board. It can't be less than `definition.minColumnSpan`.\n   * * `data` (D) - optional item data which can include the specific configurations of an item, such as its title.\n   */\n  items: ReadonlyArray<ItemsPaletteProps.Item<D>>;\n\n  /**\n   * Specifies a function to render content for a palette item. The return value must include board item component.\n   *\n   * The function takes the item and its associated context (ItemsPaletteProps.ItemContext) that include:\n   * * `showPreview` (boolean) - a flag that indicates if the item's content needs to be rendered in preview mode.\n   */\n  renderItem: (item: ItemsPaletteProps.Item<D>, context: ItemsPaletteProps.ItemContext) => JSX.Element;\n\n  /**\n   * An object containing all the necessary localized strings required by the component.\n   *\n   * Live announcements:\n   * * `liveAnnouncementDndStarted` (string) - live announcement string to indicate start of DnD.\n   * * `liveAnnouncementDndDiscarded` (string) - live announcement string to indicate discard of DnD.\n   *\n   * Navigation labels:\n   * * `navigationAriaLabel` (string) - the ARIA label for the accessible board navigation element.\n   * * `navigationAriaDescription` (string, optional) - the ARIA description for the accessible board navigation element.\n   * * `navigationItemAriaLabel(null | BoardProps.Item<D>): string` - the function to create the ARIA label for a navigation board item.\n   */\n  i18nStrings: ItemsPaletteProps.I18nStrings<D>;\n}\n\nexport namespace ItemsPaletteProps {\n  export type Item<D = DataFallbackType> = BoardItemDefinitionBase<D>;\n\n  export interface ItemContext {\n    showPreview: boolean;\n  }\n\n  export interface I18nStrings<D> {\n    liveAnnouncementDndStarted: string;\n    liveAnnouncementDndDiscarded: string;\n    navigationAriaLabel: string;\n    navigationAriaDescription?: string;\n    navigationItemAriaLabel: (item: ItemsPaletteProps.Item<D>) => string;\n  }\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/items-palette/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { BoardItemDefinitionBase, DataFallbackType } from \"../internal/interfaces\";\n\n/*\n  Note:\n  The component does not provide handling of items state (loading, error, loaded).\n  It is the responsibility of the client to control it and provide the necessary\n  ARIA-live announcements.\n*/\n\nexport interface ItemsPaletteProps<D = DataFallbackType> {\n  /**\n   * Specifies the items displayed in the palette. The content of each item is controlled by the `renderItem` property.\n   *\n   * The ItemsPaletteProps.Item includes:\n   * * `id` (string) - the unique item identifier. The IDs of any two items in a page must be different.\n   * * `definition.minRowSpan` (number, optional) - the minimal number of rows the item is allowed to take. It can't be less than two. Defaults to two.\n   * * `definition.minColumnSpan` (number, optional) - the minimal number of columns the item is allowed to take (in a 4 column layout). It can't be less than one. Defaults to one.\n   * * `definition.defaultRowSpan` (number) - the number or rows the item will take when inserted to the board. It can't be less than `definition.minRowSpan`.\n   * * `definition.defaultColumnSpan` (number) - the number or columns the item will take (in a 4 column layout) when inserted to the board. It can't be less than `definition.minColumnSpan`.\n   * * `data` (D) - optional item data which can include the specific configurations of an item, such as its title.\n   */\n  items: ReadonlyArray<ItemsPaletteProps.Item<D>>;\n\n  /**\n   * Specifies a function to render content for a palette item. The return value must include board item component.\n   *\n   * The function takes the item and its associated context (ItemsPaletteProps.ItemContext) that include:\n   * * `showPreview` (boolean) - a flag that indicates if the item's content needs to be rendered in preview mode.\n   */\n  renderItem: (item: ItemsPaletteProps.Item<D>, context: ItemsPaletteProps.ItemContext) => JSX.Element;\n\n  /**\n   * An object containing all the necessary localized strings required by the component.\n   *\n   * Live announcements:\n   * * `liveAnnouncementDndStarted` (string) - live announcement string to indicate start of DnD.\n   * * `liveAnnouncementDndDiscarded` (string) - live announcement string to indicate discard of DnD.\n   */\n  i18nStrings: ItemsPaletteProps.I18nStrings<D>;\n}\n\nexport namespace ItemsPaletteProps {\n  export type Item<D = DataFallbackType> = BoardItemDefinitionBase<D>;\n\n  export interface ItemContext {\n    showPreview: boolean;\n  }\n\n  export interface I18nStrings<D> {\n    liveAnnouncementDndStarted: string;\n    liveAnnouncementDndDiscarded: string;\n    /** @deprecated Has no effect. */\n    navigationAriaLabel: string;\n    /** @deprecated Has no effect. */\n    navigationAriaDescription?: string;\n    /** @deprecated Has no effect. */\n    navigationItemAriaLabel: (item: ItemsPaletteProps.Item<D>) => string;\n  }\n}\n"]}

package/items-palette/internal.js

@@ -1,14 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
+import { useRef, useState } from "react";
 import { getIsRtl } from "@cloudscape-design/component-toolkit/internal";
 import SpaceBetween from "@cloudscape-design/components/space-between";
-import { useRef, useState } from "react";
 import { getDataAttributes } from "../internal/base-component/get-data-attributes";
 import { useDragSubscription } from "../internal/dnd-controller/controller";
 import { ItemContainer } from "../internal/item-container";
 import LiveRegion from "../internal/live-region";
-import { ScreenReaderGridNavigation } from "../internal/screenreader-grid-navigation";
 import styles from "./styles.css.js";
 export function InternalItemsPalette({ items, renderItem, i18nStrings, __internalRootRef, ...rest }) {
     const paletteRef = useRef(null);
@@ -16,9 +15,6 @@ export function InternalItemsPalette({ items, renderItem, i18nStrings, __interna
     const [dropState, setDropState] = useState();
     const [announcement, setAnnouncement] = useState("");
     const isRtl = () => getIsRtl(paletteRef.current);
-    function focusItem(itemId) {
-        itemContainerRef.current[itemId].focusDragHandle();
-    }
     useDragSubscription("start", ({ draggableItem: { id } }) => {
         setDropState({ id });
         // Announce only if the target item belongs to the palette.
@@ -52,12 +48,7 @@ export function InternalItemsPalette({ items, renderItem, i18nStrings, __interna
             setDropState(undefined);
         }
     });
-    const itemsLayout = {
-        items: items.map((it, index) => ({ id: it.id, x: 0, y: index, width: 1, height: 1 })),
-        columns: 1,
-        rows: items.length,
-    };
-    return (_jsxs("div", { ref: __internalRootRef, ...getDataAttributes(rest), children: [_jsx(ScreenReaderGridNavigation, { items: items, itemsLayout: itemsLayout, ariaLabel: i18nStrings.navigationAriaLabel, ariaDescription: i18nStrings.navigationAriaDescription, itemAriaLabel: (item) => i18nStrings.navigationItemAriaLabel(item), onActivateItem: focusItem }), _jsx("div", { ref: paletteRef, className: styles.root, children: _jsx(SpaceBetween, { size: "l", children: items.map((item) => (_jsx(ItemContainer, { ref: (elem) => {
+    return (_jsxs("div", { ref: __internalRootRef, ...getDataAttributes(rest), children: [_jsx("div", { ref: paletteRef, className: styles.root, children: _jsx(SpaceBetween, { size: "l", children: items.map((item) => (_jsx(ItemContainer, { ref: (elem) => {
                             if (elem) {
                                 itemContainerRef.current[item.id] = elem;
                             }

package/items-palette/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/items-palette/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,+CAA+C,CAAC;AACzE,OAAO,YAAY,MAAM,6CAA6C,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gDAAgD,CAAC;AAEnF,OAAO,EAAE,mBAAmB,EAAE,MAAM,uCAAuC,CAAC;AAE5E,OAAO,EAAE,aAAa,EAAoB,MAAM,4BAA4B,CAAC;AAC7E,OAAO,UAAU,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,0BAA0B,EAAE,MAAM,0CAA0C,CAAC;AAEtF,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,UAAU,oBAAoB,CAAI,EACtC,KAAK,EACL,UAAU,EACV,WAAW,EACX,iBAAiB,EACjB,GAAG,IAAI,EAC2C;IAClD,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAChD,MAAM,gBAAgB,GAAG,MAAM,CAAqC,EAAE,CAAC,CAAC;IACxE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,EAAkB,CAAC;IAC7D,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAErD,MAAM,KAAK,GAAG,GAAG,EAAE,CAAC,QAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;IAEjD,SAAS,SAAS,CAAC,MAAc;QAC/B,gBAAgB,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,eAAe,EAAE,CAAC;IACrD,CAAC;IAED,mBAAmB,CAAC,OAAO,EAAE,CAAC,EAAE,aAAa,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE;QACzD,YAAY,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;QAErB,2DAA2D;QAC3D,IAAI,KAAK,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE;YACpC,eAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,CAAC;SACzD;aAAM;YACL,eAAe,CAAC,EAAE,CAAC,CAAC;SACrB;IACH,CAAC,CAAC,CAAC;IAEH,mBAAmB,CAAC,QAAQ,EAAE,CAAC,EAAE,aAAa,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE;QAC1D,YAAY,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;IACvB,CAAC,CAAC,CAAC;IAEH,mBAAmB,CAAC,QAAQ,EAAE,GAAG,EAAE;QACjC,YAAY,CAAC,SAAS,CAAC,CAAC;QAExB,2DAA2D;QAC3D,IAAI,SAAS,IAAI,KAAK,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,SAAS,CAAC,EAAE,CAAC,EAAE;YAC3D,eAAe,CAAC,WAAW,CAAC,4BAA4B,CAAC,CAAC;SAC3D;IACH,CAAC,CAAC,CAAC;IAEH,mBAAmB,CAAC,SAAS,EAAE,GAAG,EAAE;QAClC,YAAY,CAAC,SAAS,CAAC,CAAC;QAExB,2DAA2D;QAC3D,IAAI,KAAK,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,MAAK,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,EAAE,CAAA,CAAC,EAAE;YAC/C,eAAe,CAAC,WAAW,CAAC,4BAA4B,CAAC,CAAC;SAC3D;IACH,CAAC,CAAC,CAAC;IAEH,mBAAmB,CAAC,SAAS,EAAE,CAAC,EAAE,aAAa,EAAE,EAAE,EAAE;QACnD,yDAAyD;QACzD,IAAI,KAAK,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,aAAa,CAAC,EAAE,CAAC,EAAE;YAClD,YAAY,CAAC,SAAS,CAAC,CAAC;SACzB;IACH,CAAC,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG;QAClB,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC;QACrF,OAAO,EAAE,CAAC;QACV,IAAI,EAAE,KAAK,CAAC,MAAM;KACnB,CAAC;IAEF,OAAO,CACL,eAAK,GAAG,EAAE,iBAAiB,KAAM,iBAAiB,CAAC,IAAI,CAAC,aACtD,KAAC,0BAA0B,IACzB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,WAAW,CAAC,mBAAmB,EAC1C,eAAe,EAAE,WAAW,CAAC,yBAAyB,EACtD,aAAa,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,WAAW,CAAC,uBAAuB,CAAC,IAAK,CAAC,EACnE,cAAc,EAAE,SAAS,GACzB,EAEF,cAAK,GAAG,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,CAAC,IAAI,YAC1C,KAAC,YAAY,IAAC,IAAI,EAAC,GAAG,YACnB,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACnB,KAAC,aAAa,IACZ,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE;4BACZ,IAAI,IAAI,EAAE;gCACR,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC;6BAC1C;iCAAM;gCACL,OAAO,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;6BAC1C;wBACH,CAAC,EAED,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,KAAK,EACb,QAAQ,EAAE,KAAK,EACf,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,KAAK,EACnB,WAAW,EAAE,CAAC,WAAW,EAAE,EAAE;4BAC3B,IAAI,CAAC,WAAW,EAAE;gCAChB,MAAM,IAAI,KAAK,CAAC,2EAA2E,CAAC,CAAC;6BAC9F;4BACD,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,WAAW,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;4BAClD,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC;wBACnG,CAAC,EACD,KAAK,EAAE,KAAK,YAEX,CAAC,aAAa,EAAE,EAAE,CAAC,UAAU,CAAC,IAAI,EAAE,EAAE,WAAW,EAAE,aAAa,EAAE,CAAC,IAf/D,IAAI,CAAC,EAAE,CAgBE,CACjB,CAAC,GACW,GACX,EAEN,KAAC,UAAU,cAAE,YAAY,GAAc,IACnC,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { getIsRtl } from \"@cloudscape-design/component-toolkit/internal\";\nimport SpaceBetween from \"@cloudscape-design/components/space-between\";\nimport { useRef, useState } from \"react\";\nimport { getDataAttributes } from \"../internal/base-component/get-data-attributes\";\nimport { InternalBaseComponentProps } from \"../internal/base-component/use-base-component\";\nimport { useDragSubscription } from \"../internal/dnd-controller/controller\";\nimport { ItemId } from \"../internal/interfaces\";\nimport { ItemContainer, ItemContainerRef } from \"../internal/item-container\";\nimport LiveRegion from \"../internal/live-region\";\nimport { ScreenReaderGridNavigation } from \"../internal/screenreader-grid-navigation\";\nimport { ItemsPaletteProps } from \"./interfaces\";\nimport styles from \"./styles.css.js\";\n\nexport function InternalItemsPalette<D>({\n  items,\n  renderItem,\n  i18nStrings,\n  __internalRootRef,\n  ...rest\n}: ItemsPaletteProps<D> & InternalBaseComponentProps) {\n  const paletteRef = useRef<HTMLDivElement>(null);\n  const itemContainerRef = useRef<{ [id: ItemId]: ItemContainerRef }>({});\n  const [dropState, setDropState] = useState<{ id: string }>();\n  const [announcement, setAnnouncement] = useState(\"\");\n\n  const isRtl = () => getIsRtl(paletteRef.current);\n\n  function focusItem(itemId: ItemId) {\n    itemContainerRef.current[itemId].focusDragHandle();\n  }\n\n  useDragSubscription(\"start\", ({ draggableItem: { id } }) => {\n    setDropState({ id });\n\n    // Announce only if the target item belongs to the palette.\n    if (items.some((it) => it.id === id)) {\n      setAnnouncement(i18nStrings.liveAnnouncementDndStarted);\n    } else {\n      setAnnouncement(\"\");\n    }\n  });\n\n  useDragSubscription(\"update\", ({ draggableItem: { id } }) => {\n    setDropState({ id });\n  });\n\n  useDragSubscription(\"submit\", () => {\n    setDropState(undefined);\n\n    // Announce only if the target item belongs to the palette.\n    if (dropState && items.some((it) => it.id === dropState.id)) {\n      setAnnouncement(i18nStrings.liveAnnouncementDndDiscarded);\n    }\n  });\n\n  useDragSubscription(\"discard\", () => {\n    setDropState(undefined);\n\n    // Announce only if the target item belongs to the palette.\n    if (items.some((it) => it.id === dropState?.id)) {\n      setAnnouncement(i18nStrings.liveAnnouncementDndDiscarded);\n    }\n  });\n\n  useDragSubscription(\"acquire\", ({ draggableItem }) => {\n    // \"Disconnect\" target item from the palette if borrowed.\n    if (items.some((it) => it.id === draggableItem.id)) {\n      setDropState(undefined);\n    }\n  });\n\n  const itemsLayout = {\n    items: items.map((it, index) => ({ id: it.id, x: 0, y: index, width: 1, height: 1 })),\n    columns: 1,\n    rows: items.length,\n  };\n\n  return (\n    <div ref={__internalRootRef} {...getDataAttributes(rest)}>\n      <ScreenReaderGridNavigation\n        items={items}\n        itemsLayout={itemsLayout}\n        ariaLabel={i18nStrings.navigationAriaLabel}\n        ariaDescription={i18nStrings.navigationAriaDescription}\n        itemAriaLabel={(item) => i18nStrings.navigationItemAriaLabel(item!)}\n        onActivateItem={focusItem}\n      />\n\n      <div ref={paletteRef} className={styles.root}>\n        <SpaceBetween size=\"l\">\n          {items.map((item) => (\n            <ItemContainer\n              ref={(elem) => {\n                if (elem) {\n                  itemContainerRef.current[item.id] = elem;\n                } else {\n                  delete itemContainerRef.current[item.id];\n                }\n              }}\n              key={item.id}\n              item={item}\n              placed={false}\n              acquired={false}\n              transform={undefined}\n              inTransition={false}\n              getItemSize={(dropContext) => {\n                if (!dropContext) {\n                  throw new Error(\"Invariant violation: cannot query palette item size with no drop context.\");\n                }\n                const { width, height } = dropContext.scale(item);\n                return { width, minWidth: width, maxWidth: width, height, minHeight: height, maxHeight: height };\n              }}\n              isRtl={isRtl}\n            >\n              {(hasDropTarget) => renderItem(item, { showPreview: hasDropTarget })}\n            </ItemContainer>\n          ))}\n        </SpaceBetween>\n      </div>\n\n      <LiveRegion>{announcement}</LiveRegion>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/items-palette/internal.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 { useRef, useState } from \"react\";\n\nimport { getIsRtl } from \"@cloudscape-design/component-toolkit/internal\";\nimport SpaceBetween from \"@cloudscape-design/components/space-between\";\n\nimport { getDataAttributes } from \"../internal/base-component/get-data-attributes\";\nimport { InternalBaseComponentProps } from \"../internal/base-component/use-base-component\";\nimport { useDragSubscription } from \"../internal/dnd-controller/controller\";\nimport { ItemId } from \"../internal/interfaces\";\nimport { ItemContainer, ItemContainerRef } from \"../internal/item-container\";\nimport LiveRegion from \"../internal/live-region\";\nimport { ItemsPaletteProps } from \"./interfaces\";\n\nimport styles from \"./styles.css.js\";\n\nexport function InternalItemsPalette<D>({\n  items,\n  renderItem,\n  i18nStrings,\n  __internalRootRef,\n  ...rest\n}: ItemsPaletteProps<D> & InternalBaseComponentProps) {\n  const paletteRef = useRef<HTMLDivElement>(null);\n  const itemContainerRef = useRef<{ [id: ItemId]: ItemContainerRef }>({});\n  const [dropState, setDropState] = useState<{ id: string }>();\n  const [announcement, setAnnouncement] = useState(\"\");\n\n  const isRtl = () => getIsRtl(paletteRef.current);\n\n  useDragSubscription(\"start\", ({ draggableItem: { id } }) => {\n    setDropState({ id });\n\n    // Announce only if the target item belongs to the palette.\n    if (items.some((it) => it.id === id)) {\n      setAnnouncement(i18nStrings.liveAnnouncementDndStarted);\n    } else {\n      setAnnouncement(\"\");\n    }\n  });\n\n  useDragSubscription(\"update\", ({ draggableItem: { id } }) => {\n    setDropState({ id });\n  });\n\n  useDragSubscription(\"submit\", () => {\n    setDropState(undefined);\n\n    // Announce only if the target item belongs to the palette.\n    if (dropState && items.some((it) => it.id === dropState.id)) {\n      setAnnouncement(i18nStrings.liveAnnouncementDndDiscarded);\n    }\n  });\n\n  useDragSubscription(\"discard\", () => {\n    setDropState(undefined);\n\n    // Announce only if the target item belongs to the palette.\n    if (items.some((it) => it.id === dropState?.id)) {\n      setAnnouncement(i18nStrings.liveAnnouncementDndDiscarded);\n    }\n  });\n\n  useDragSubscription(\"acquire\", ({ draggableItem }) => {\n    // \"Disconnect\" target item from the palette if borrowed.\n    if (items.some((it) => it.id === draggableItem.id)) {\n      setDropState(undefined);\n    }\n  });\n\n  return (\n    <div ref={__internalRootRef} {...getDataAttributes(rest)}>\n      <div ref={paletteRef} className={styles.root}>\n        <SpaceBetween size=\"l\">\n          {items.map((item) => (\n            <ItemContainer\n              ref={(elem) => {\n                if (elem) {\n                  itemContainerRef.current[item.id] = elem;\n                } else {\n                  delete itemContainerRef.current[item.id];\n                }\n              }}\n              key={item.id}\n              item={item}\n              placed={false}\n              acquired={false}\n              transform={undefined}\n              inTransition={false}\n              getItemSize={(dropContext) => {\n                if (!dropContext) {\n                  throw new Error(\"Invariant violation: cannot query palette item size with no drop context.\");\n                }\n                const { width, height } = dropContext.scale(item);\n                return { width, minWidth: width, maxWidth: width, height, minHeight: height, maxHeight: height };\n              }}\n              isRtl={isRtl}\n            >\n              {(hasDropTarget) => renderItem(item, { showPreview: hasDropTarget })}\n            </ItemContainer>\n          ))}\n        </SpaceBetween>\n      </div>\n\n      <LiveRegion>{announcement}</LiveRegion>\n    </div>\n  );\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudscape-design/board-components",
-  "version": "3.0.67",
+  "version": "3.0.69",
   "repository": {
     "type": "git",
     "url": "https://github.com/cloudscape-design/board-components.git"

package/test-utils/dom/board/index.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 const dom_1 = require("@cloudscape-design/test-utils-core/dom");
-const styles_selectors_js_1 = require("../../../board/styles.selectors.js");
 const board_item_1 = require("../board-item");
+const styles_selectors_js_1 = require("../../../board/styles.selectors.js");
 class BoardWrapper extends dom_1.ComponentWrapper {
     findItemById(itemId) {
         return (0, dom_1.createWrapper)().findComponent(`[data-item-id="${itemId}"]`, board_item_1.default);

package/test-utils/dom/board/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/board/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,gEAAyF;AACzF,4EAA6D;AAC7D,8CAA6C;AAE7C,MAAqB,YAAa,SAAQ,sBAAgB;IAGxD,YAAY,CAAC,MAAc;QACzB,OAAO,IAAA,mBAAa,GAAE,CAAC,aAAa,CAAC,kBAAkB,MAAM,IAAI,EAAE,oBAAgB,CAAC,CAAC;IACvF,CAAC;;AALH,+BAMC;AALQ,yBAAY,GAAW,6BAAW,CAAC,IAAI,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/board/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,gEAAyF;AAEzF,8CAA6C;AAE7C,4EAA6D;AAE7D,MAAqB,YAAa,SAAQ,sBAAgB;IAGxD,YAAY,CAAC,MAAc;QACzB,OAAO,IAAA,mBAAa,GAAE,CAAC,aAAa,CAAC,kBAAkB,MAAM,IAAI,EAAE,oBAAgB,CAAC,CAAC;IACvF,CAAC;;AALH,+BAMC;AALQ,yBAAY,GAAW,6BAAW,CAAC,IAAI,CAAC"}

package/test-utils/dom/board-item/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/board-item/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,sEAA6E;AAC7E,gEAA0E;AAC1E,iFAAiE;AACjE,2FAAiF;AACjF,6FAAqF;AAErF,MAAqB,gBAAiB,SAAQ,sBAAgB;IAG5D,cAAc;QACZ,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAgB,CAAC,MAAM,CAAE,CAAC;IACxD,CAAC;IAED,gBAAgB;QACd,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAkB,CAAC,MAAM,CAAE,CAAC;IAC1D,CAAC;IAED,YAAY;QACV,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAU,CAAC,QAAQ,CAAC,CAAC;IACnD,CAAC;IAED,kDAAkD;IAElD,UAAU;QACR,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAU,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAC5D,CAAC;IAED,WAAW;QACT,OAAO,IAAA,aAAiB,EAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,aAAa,EAAG,CAAC,WAAW,EAAE,CAAC;IAC7E,CAAC;IAED,UAAU;QACR,OAAO,IAAA,aAAiB,EAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,aAAa,EAAG,CAAC,UAAU,EAAE,CAAC;IAC5E,CAAC;;AA3BH,mCA4BC;AA3BQ,6BAAY,GAAW,6BAAU,CAAC,IAAI,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/board-item/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,sEAA6E;AAC7E,gEAA0E;AAE1E,iFAAiE;AACjE,2FAAiF;AACjF,6FAAqF;AAErF,MAAqB,gBAAiB,SAAQ,sBAAgB;IAG5D,cAAc;QACZ,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAgB,CAAC,MAAM,CAAE,CAAC;IACxD,CAAC;IAED,gBAAgB;QACd,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAkB,CAAC,MAAM,CAAE,CAAC;IAC1D,CAAC;IAED,YAAY;QACV,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAU,CAAC,QAAQ,CAAC,CAAC;IACnD,CAAC;IAED,kDAAkD;IAElD,UAAU;QACR,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAU,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAC5D,CAAC;IAED,WAAW;QACT,OAAO,IAAA,aAAiB,EAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,aAAa,EAAG,CAAC,WAAW,EAAE,CAAC;IAC7E,CAAC;IAED,UAAU;QACR,OAAO,IAAA,aAAiB,EAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,aAAa,EAAG,CAAC,UAAU,EAAE,CAAC;IAC5E,CAAC;;AA3BH,mCA4BC;AA3BQ,6BAAY,GAAW,6BAAU,CAAC,IAAI,CAAC"}

package/test-utils/dom/items-palette/index.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 const dom_1 = require("@cloudscape-design/test-utils-core/dom");
-const styles_selectors_js_1 = require("../../../items-palette/styles.selectors.js");
 const palette_item_1 = require("../palette-item");
+const styles_selectors_js_1 = require("../../../items-palette/styles.selectors.js");
 class ItemsPaletteWrapper extends dom_1.ComponentWrapper {
     findItems() {
         return this.findAllByClassName(palette_item_1.default.rootSelector).map((wrapper) => new palette_item_1.default(wrapper.getElement()));

package/test-utils/dom/items-palette/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/items-palette/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,gEAA0E;AAC1E,oFAAuE;AACvE,kDAAiD;AAEjD,MAAqB,mBAAoB,SAAQ,sBAAgB;IAG/D,SAAS;QACP,OAAO,IAAI,CAAC,kBAAkB,CAAC,sBAAkB,CAAC,YAAY,CAAC,CAAC,GAAG,CACjE,CAAC,OAAO,EAAE,EAAE,CAAC,IAAI,sBAAkB,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC,CAC1D,CAAC;IACJ,CAAC;IAED,YAAY,CAAC,MAAc;QACzB,OAAO,IAAI,CAAC,aAAa,CAAC,kBAAkB,MAAM,IAAI,EAAE,sBAAkB,CAAC,CAAC;IAC9E,CAAC;;AAXH,sCAYC;AAXQ,gCAAY,GAAW,6BAAa,CAAC,IAAI,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/items-palette/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,gEAA0E;AAE1E,kDAAiD;AAEjD,oFAAuE;AAEvE,MAAqB,mBAAoB,SAAQ,sBAAgB;IAG/D,SAAS;QACP,OAAO,IAAI,CAAC,kBAAkB,CAAC,sBAAkB,CAAC,YAAY,CAAC,CAAC,GAAG,CACjE,CAAC,OAAO,EAAE,EAAE,CAAC,IAAI,sBAAkB,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC,CAC1D,CAAC;IACJ,CAAC;IAED,YAAY,CAAC,MAAc;QACzB,OAAO,IAAI,CAAC,aAAa,CAAC,kBAAkB,MAAM,IAAI,EAAE,sBAAkB,CAAC,CAAC;IAC9E,CAAC;;AAXH,sCAYC;AAXQ,gCAAY,GAAW,6BAAa,CAAC,IAAI,CAAC"}

package/test-utils/dom/palette-item/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/palette-item/index.ts"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;;AAEtC,gEAA0E;AAC1E,iFAAiE;AACjE,2FAAiF;AAEjF,MAAqB,kBAAmB,SAAQ,sBAAgB;IAG9D,cAAc;QACZ,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAgB,CAAC,MAAM,CAAE,CAAC;IACxD,CAAC;;AALH,qCAMC;AALQ,+BAAY,GAAW,6BAAU,CAAC,IAAI,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/palette-item/index.ts"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;;AAEtC,gEAA0E;AAE1E,iFAAiE;AACjE,2FAAiF;AAEjF,MAAqB,kBAAmB,SAAQ,sBAAgB;IAG9D,cAAc;QACZ,OAAO,IAAI,CAAC,eAAe,CAAC,6BAAgB,CAAC,MAAM,CAAE,CAAC;IACxD,CAAC;;AALH,qCAMC;AALQ,+BAAY,GAAW,6BAAU,CAAC,IAAI,CAAC"}

package/test-utils/selectors/board/index.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 const selectors_1 = require("@cloudscape-design/test-utils-core/selectors");
-const styles_selectors_js_1 = require("../../../board/styles.selectors.js");
 const board_item_1 = require("../board-item");
+const styles_selectors_js_1 = require("../../../board/styles.selectors.js");
 class BoardWrapper extends selectors_1.ComponentWrapper {
     findItemById(itemId) {
         return (0, selectors_1.createWrapper)().findComponent(`[data-item-id="${itemId}"]`, board_item_1.default);

package/test-utils/selectors/board/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/board/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,4EAA+F;AAC/F,4EAA6D;AAC7D,8CAA6C;AAC7C,MAAqB,YAAa,SAAQ,4BAAgB;IAExD,YAAY,CAAC,MAAc;QACzB,OAAO,IAAA,yBAAa,GAAE,CAAC,aAAa,CAAC,kBAAkB,MAAM,IAAI,EAAE,oBAAgB,CAAC,CAAC;IACvF,CAAC;;AAJH,+BAKC;AAJQ,yBAAY,GAAW,6BAAW,CAAC,IAAI,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/board/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,4EAA+F;AAC/F,8CAA6C;AAC7C,4EAA6D;AAC7D,MAAqB,YAAa,SAAQ,4BAAgB;IAExD,YAAY,CAAC,MAAc;QACzB,OAAO,IAAA,yBAAa,GAAE,CAAC,aAAa,CAAC,kBAAkB,MAAM,IAAI,EAAE,oBAAgB,CAAC,CAAC;IACvF,CAAC;;AAJH,+BAKC;AAJQ,yBAAY,GAAW,6BAAW,CAAC,IAAI,CAAC"}

package/test-utils/selectors/items-palette/index.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 const selectors_1 = require("@cloudscape-design/test-utils-core/selectors");
-const styles_selectors_js_1 = require("../../../items-palette/styles.selectors.js");
 const palette_item_1 = require("../palette-item");
+const styles_selectors_js_1 = require("../../../items-palette/styles.selectors.js");
 class ItemsPaletteWrapper extends selectors_1.ComponentWrapper {
     findItems() {
         return this.findAllByClassName(palette_item_1.default.rootSelector).map(wrapper => new palette_item_1.default(wrapper.getElement()));

package/test-utils/selectors/items-palette/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/items-palette/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,4EAAgF;AAChF,oFAAuE;AACvE,kDAAiD;AACjD,MAAqB,mBAAoB,SAAQ,4BAAgB;IAE/D,SAAS;QACP,OAAO,IAAI,CAAC,kBAAkB,CAAC,sBAAkB,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,sBAAkB,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC;IAC/H,CAAC;IACD,YAAY,CAAC,MAAc;QACzB,OAAO,IAAI,CAAC,aAAa,CAAC,kBAAkB,MAAM,IAAI,EAAE,sBAAkB,CAAC,CAAC;IAC9E,CAAC;;AAPH,sCAQC;AAPQ,gCAAY,GAAW,6BAAa,CAAC,IAAI,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/items-palette/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,4EAAgF;AAChF,kDAAiD;AACjD,oFAAuE;AACvE,MAAqB,mBAAoB,SAAQ,4BAAgB;IAE/D,SAAS;QACP,OAAO,IAAI,CAAC,kBAAkB,CAAC,sBAAkB,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,sBAAkB,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC;IAC/H,CAAC;IACD,YAAY,CAAC,MAAc;QACzB,OAAO,IAAI,CAAC,aAAa,CAAC,kBAAkB,MAAM,IAAI,EAAE,sBAAkB,CAAC,CAAC;IAC9E,CAAC;;AAPH,sCAQC;AAPQ,gCAAY,GAAW,6BAAa,CAAC,IAAI,CAAC"}

package/internal/screenreader-grid-navigation/index.d.ts

@@ -1,22 +0,0 @@
-/// <reference types="react" />
-import { GridLayout, ItemId } from "../interfaces";
-export interface ScreenReaderGridNavigationProps<Item> {
-    items: readonly Item[];
-    itemsLayout: GridLayout;
-    ariaLabel: string;
-    ariaDescription?: string;
-    itemAriaLabel: (item: null | Item) => string;
-    onActivateItem: (itemId: ItemId) => void;
-}
-/**
- * The component provides a native screen-reader grid navigation for board items.
- * A separate navigation component is used because the navigation requires a table or table-like
- * DOM structure while the board uses CSS grid.
- *
- * The screen-reader navigation component is hidden and don't have a tab stop, however, it can be focused
- * programmatically or with a screen-reader. When focused with a screen-reader the component becomes visible
- * so that it can be clicked (e.g. the VO can imitate clicks on the elements under VO cursor with VO+Space).
- */
-export declare function ScreenReaderGridNavigation<Item extends {
-    id: string;
-}>({ items, itemsLayout, ariaLabel, ariaDescription, itemAriaLabel, onActivateItem, }: ScreenReaderGridNavigationProps<Item>): JSX.Element;

package/internal/screenreader-grid-navigation/index.js

@@ -1,43 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
-// SPDX-License-Identifier: Apache-2.0
-import { useId, useMemo, useState } from "react";
-import ScreenreaderOnly from "../screenreader-only";
-import styles from "./styles.css.js";
-/**
- * The component provides a native screen-reader grid navigation for board items.
- * A separate navigation component is used because the navigation requires a table or table-like
- * DOM structure while the board uses CSS grid.
- *
- * The screen-reader navigation component is hidden and don't have a tab stop, however, it can be focused
- * programmatically or with a screen-reader. When focused with a screen-reader the component becomes visible
- * so that it can be clicked (e.g. the VO can imitate clicks on the elements under VO cursor with VO+Space).
- */
-export function ScreenReaderGridNavigation({ items, itemsLayout, ariaLabel, ariaDescription, itemAriaLabel, onActivateItem, }) {
-    const [isNavigationFocused, setIsNavigationFocused] = useState(false);
-    const className = isNavigationFocused
-        ? styles["screen-reader-navigation-visible"]
-        : styles["screen-reader-navigation-hidden"];
-    const tableId = useId();
-    const navigationDescriptionId = useId();
-    const getItem = useMemo(() => {
-        const itemById = new Map(items.map((it) => [it.id, it]));
-        return (id) => { var _a; return (id ? (_a = itemById.get(id)) !== null && _a !== void 0 ? _a : null : null); };
-    }, [items]);
-    const layout = [];
-    function makeNewRow() {
-        layout.push([...Array(itemsLayout.columns)].map(() => null));
-    }
-    for (const item of itemsLayout.items) {
-        for (let y = item.y; y < item.y + item.height; y++) {
-            while (layout.length <= y) {
-                makeNewRow();
-            }
-            for (let x = item.x; x < item.x + item.width; x++) {
-                layout[y][x] = item.id;
-            }
-        }
-    }
-    return (_jsxs("div", { role: "navigation", "aria-labelledby": tableId, "aria-describedby": ariaDescription ? navigationDescriptionId : undefined, className: className, children: [_jsx("table", { id: tableId, role: "grid", "aria-label": ariaLabel, "aria-describedby": ariaDescription ? navigationDescriptionId : undefined, children: _jsx("tbody", { children: layout.map((row, rowIndex) => (_jsx("tr", { role: "row", children: row.map((itemId, cellIndex) => (_jsx("td", { role: "gridcell", children: itemId ? (_jsx("button", { tabIndex: -1, onClick: () => itemId && onActivateItem(itemId), onFocus: () => setIsNavigationFocused(true), onBlur: () => setIsNavigationFocused(false), children: itemAriaLabel(getItem(itemId)) })) : (itemAriaLabel(getItem(itemId))) }, cellIndex))) }, rowIndex))) }) }), ariaDescription && _jsx(ScreenreaderOnly, { id: navigationDescriptionId, children: ariaDescription })] }));
-}
-//# sourceMappingURL=index.js.map

package/internal/screenreader-grid-navigation/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/screenreader-grid-navigation/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\n\nimport { useId, useMemo, useState } from \"react\";\nimport { GridLayout, ItemId } from \"../interfaces\";\nimport ScreenreaderOnly from \"../screenreader-only\";\n\nimport styles from \"./styles.css.js\";\n\nexport interface ScreenReaderGridNavigationProps<Item> {\n  items: readonly Item[];\n  itemsLayout: GridLayout;\n  ariaLabel: string;\n  ariaDescription?: string;\n  itemAriaLabel: (item: null | Item) => string;\n  onActivateItem: (itemId: ItemId) => void;\n}\n\n/**\n * The component provides a native screen-reader grid navigation for board items.\n * A separate navigation component is used because the navigation requires a table or table-like\n * DOM structure while the board uses CSS grid.\n *\n * The screen-reader navigation component is hidden and don't have a tab stop, however, it can be focused\n * programmatically or with a screen-reader. When focused with a screen-reader the component becomes visible\n * so that it can be clicked (e.g. the VO can imitate clicks on the elements under VO cursor with VO+Space).\n */\nexport function ScreenReaderGridNavigation<Item extends { id: string }>({\n  items,\n  itemsLayout,\n  ariaLabel,\n  ariaDescription,\n  itemAriaLabel,\n  onActivateItem,\n}: ScreenReaderGridNavigationProps<Item>) {\n  const [isNavigationFocused, setIsNavigationFocused] = useState(false);\n  const className = isNavigationFocused\n    ? styles[\"screen-reader-navigation-visible\"]\n    : styles[\"screen-reader-navigation-hidden\"];\n\n  const tableId = useId();\n  const navigationDescriptionId = useId();\n\n  const getItem = useMemo(() => {\n    const itemById = new Map(items.map((it) => [it.id, it]));\n    return (id: null | ItemId) => (id ? itemById.get(id) ?? null : null);\n  }, [items]);\n\n  const layout: (null | ItemId)[][] = [];\n\n  function makeNewRow() {\n    layout.push([...Array(itemsLayout.columns)].map(() => null));\n  }\n\n  for (const item of itemsLayout.items) {\n    for (let y = item.y; y < item.y + item.height; y++) {\n      while (layout.length <= y) {\n        makeNewRow();\n      }\n      for (let x = item.x; x < item.x + item.width; x++) {\n        layout[y][x] = item.id;\n      }\n    }\n  }\n\n  return (\n    <div\n      role=\"navigation\"\n      aria-labelledby={tableId}\n      aria-describedby={ariaDescription ? navigationDescriptionId : undefined}\n      className={className}\n    >\n      <table\n        id={tableId}\n        role=\"grid\"\n        aria-label={ariaLabel}\n        aria-describedby={ariaDescription ? navigationDescriptionId : undefined}\n      >\n        <tbody>\n          {layout.map((row, rowIndex) => (\n            <tr role=\"row\" key={rowIndex}>\n              {row.map((itemId, cellIndex) => (\n                <td role=\"gridcell\" key={cellIndex}>\n                  {itemId ? (\n                    <button\n                      tabIndex={-1}\n                      onClick={() => itemId && onActivateItem(itemId)}\n                      onFocus={() => setIsNavigationFocused(true)}\n                      onBlur={() => setIsNavigationFocused(false)}\n                    >\n                      {itemAriaLabel(getItem(itemId))}\n                    </button>\n                  ) : (\n                    itemAriaLabel(getItem(itemId))\n                  )}\n                </td>\n              ))}\n            </tr>\n          ))}\n        </tbody>\n      </table>\n\n      {ariaDescription && <ScreenreaderOnly id={navigationDescriptionId}>{ariaDescription}</ScreenreaderOnly>}\n    </div>\n  );\n}\n"]}

package/internal/screenreader-grid-navigation/styles.css.js

@@ -1,7 +0,0 @@
-
-    import './styles.scoped.css';
-    export default {
-  "screen-reader-navigation-hidden": "awsui_screen-reader-navigation-hidden_1wuib_1u63w_1",
-  "screen-reader-navigation-visible": "awsui_screen-reader-navigation-visible_1wuib_1u63w_6"
-};
-  

package/internal/screenreader-grid-navigation/styles.scoped.css

@@ -1,13 +0,0 @@
-.awsui_screen-reader-navigation-hidden_1wuib_1u63w_1:not(#\9) {
-  position: absolute !important;
-  clip-path: circle(0);
-}
-
-.awsui_screen-reader-navigation-visible_1wuib_1u63w_6:not(#\9) {
-  position: fixed;
-  background: white;
-  padding-block: 8px;
-  padding-inline: 8px;
-  border: 1px solid black;
-  z-index: 10001;
-}

package/internal/screenreader-grid-navigation/styles.selectors.js

@@ -1,8 +0,0 @@
-
-    // es-module interop with Babel and Typescript
-    Object.defineProperty(exports, "__esModule", { value: true });
-    module.exports.default = {
-  "screen-reader-navigation-hidden": "awsui_screen-reader-navigation-hidden_1wuib_1u63w_1",
-  "screen-reader-navigation-visible": "awsui_screen-reader-navigation-visible_1wuib_1u63w_6"
-};
-