@cloudscape-design/board-components 3.0.68 → 3.0.69

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 (54) hide show
  1. package/board/interfaces.js.map +1 -1
  2. package/board/internal.js +3 -3
  3. package/board/internal.js.map +1 -1
  4. package/board/placeholder.js +1 -1
  5. package/board/placeholder.js.map +1 -1
  6. package/board/transition.js +1 -1
  7. package/board/transition.js.map +1 -1
  8. package/board-item/header.js +0 -2
  9. package/board-item/header.js.map +1 -1
  10. package/board-item/internal.js +2 -2
  11. package/board-item/internal.js.map +1 -1
  12. package/internal/base-component/use-base-component.d.ts +1 -1
  13. package/internal/base-component/use-base-component.js.map +1 -1
  14. package/internal/base-component/use-telemetry.js.map +1 -1
  15. package/internal/base-component/use-visual-refresh.js.map +1 -1
  16. package/internal/dnd-controller/__mocks__/controller.js.map +1 -1
  17. package/internal/dnd-controller/controller.js +1 -1
  18. package/internal/dnd-controller/controller.js.map +1 -1
  19. package/internal/drag-handle/index.js +2 -2
  20. package/internal/drag-handle/index.js.map +1 -1
  21. package/internal/environment.js +1 -1
  22. package/internal/environment.json +1 -1
  23. package/internal/global-drag-state-styles/index.js.map +1 -1
  24. package/internal/grid/grid.js +2 -2
  25. package/internal/grid/grid.js.map +1 -1
  26. package/internal/grid/interfaces.js.map +1 -1
  27. package/internal/grid/item.js.map +1 -1
  28. package/internal/handle/index.js +1 -1
  29. package/internal/handle/index.js.map +1 -1
  30. package/internal/item-container/index.d.ts +1 -1
  31. package/internal/item-container/index.js +4 -4
  32. package/internal/item-container/index.js.map +1 -1
  33. package/internal/layout-engine/engine-step.js +1 -1
  34. package/internal/layout-engine/engine-step.js.map +1 -1
  35. package/internal/live-region/index.js.map +1 -1
  36. package/internal/manifest.json +1 -1
  37. package/internal/resize-handle/index.js +1 -3
  38. package/internal/resize-handle/index.js.map +1 -1
  39. package/internal/screenreader-only/index.js.map +1 -1
  40. package/internal/utils/coordinates.js.map +1 -1
  41. package/internal/utils/use-auto-scroll.js.map +1 -1
  42. package/items-palette/internal.js +1 -1
  43. package/items-palette/internal.js.map +1 -1
  44. package/package.json +1 -1
  45. package/test-utils/dom/board/index.js +1 -1
  46. package/test-utils/dom/board/index.js.map +1 -1
  47. package/test-utils/dom/board-item/index.js.map +1 -1
  48. package/test-utils/dom/items-palette/index.js +1 -1
  49. package/test-utils/dom/items-palette/index.js.map +1 -1
  50. package/test-utils/dom/palette-item/index.js.map +1 -1
  51. package/test-utils/selectors/board/index.js +1 -1
  52. package/test-utils/selectors/board/index.js.map +1 -1
  53. package/test-utils/selectors/items-palette/index.js +1 -1
  54. package/test-utils/selectors/items-palette/index.js.map +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/global-drag-state-styles/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAmB,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACpF,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,SAAS,WAAW,CAAC,KAAY;IAC/B,MAAM,IAAI,KAAK,CAAC,oBAAoB,GAAG,KAAK,CAAC,CAAC;AAChD,CAAC;AAED,SAAS,KAAK,CAAC,EAAE,SAAS,EAAE,eAAe,EAAmB;IAC5D,QAAQ,SAAS,EAAE;QACjB,KAAK,QAAQ,CAAC;QACd,KAAK,SAAS;YACZ,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC,CAAC;YACxD,MAAM;QACR,KAAK,QAAQ;YACX,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,CAAC;YAC1D,MAAM;QACR;YACE,oEAAoE;YACpE,WAAW,CAAC,SAAS,CAAC,CAAC;KAC1B;IAED,IAAI,eAAe,KAAK,SAAS,EAAE;QACjC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,CAAC;KAC1D;AACH,CAAC;AAED,SAAS,QAAQ;IACf,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,kBAAkB,CAAC,EAAE,MAAM,CAAC,oBAAoB,CAAC,EAAE,MAAM,CAAC,mBAAmB,CAAC,CAAC,CAAC;AACxH,CAAC;AAED,MAAM,UAAU,wBAAwB;IACtC,mBAAmB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IACpC,mBAAmB,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;IACzC,mBAAmB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;AAC1C,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { DragAndDropData, useDragSubscription } from \"../dnd-controller/controller\";\nimport styles from \"./styles.css.js\";\n\nfunction assertNever(value: never) {\n throw new Error(\"Unexpected value: \" + value);\n}\n\nfunction setup({ operation, interactionType }: DragAndDropData) {\n switch (operation) {\n case \"insert\":\n case \"reorder\":\n document.body.classList.add(styles[\"show-grab-cursor\"]);\n break;\n case \"resize\":\n document.body.classList.add(styles[\"show-resize-cursor\"]);\n break;\n default:\n // there will be a type error if not all operation types are handled\n assertNever(operation);\n }\n\n if (interactionType === \"pointer\") {\n document.body.classList.add(styles[\"disable-selection\"]);\n }\n}\n\nfunction teardown() {\n document.body.classList.remove(styles[\"show-grab-cursor\"], styles[\"show-resize-cursor\"], styles[\"disable-selection\"]);\n}\n\nexport function useGlobalDragStateStyles() {\n useDragSubscription(\"start\", setup);\n useDragSubscription(\"discard\", teardown);\n useDragSubscription(\"submit\", teardown);\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/global-drag-state-styles/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAmB,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAEpF,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,SAAS,WAAW,CAAC,KAAY;IAC/B,MAAM,IAAI,KAAK,CAAC,oBAAoB,GAAG,KAAK,CAAC,CAAC;AAChD,CAAC;AAED,SAAS,KAAK,CAAC,EAAE,SAAS,EAAE,eAAe,EAAmB;IAC5D,QAAQ,SAAS,EAAE;QACjB,KAAK,QAAQ,CAAC;QACd,KAAK,SAAS;YACZ,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC,CAAC;YACxD,MAAM;QACR,KAAK,QAAQ;YACX,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,CAAC;YAC1D,MAAM;QACR;YACE,oEAAoE;YACpE,WAAW,CAAC,SAAS,CAAC,CAAC;KAC1B;IAED,IAAI,eAAe,KAAK,SAAS,EAAE;QACjC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,CAAC;KAC1D;AACH,CAAC;AAED,SAAS,QAAQ;IACf,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,kBAAkB,CAAC,EAAE,MAAM,CAAC,oBAAoB,CAAC,EAAE,MAAM,CAAC,mBAAmB,CAAC,CAAC,CAAC;AACxH,CAAC;AAED,MAAM,UAAU,wBAAwB;IACtC,mBAAmB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IACpC,mBAAmB,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;IACzC,mBAAmB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;AAC1C,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { DragAndDropData, useDragSubscription } from \"../dnd-controller/controller\";\n\nimport styles from \"./styles.css.js\";\n\nfunction assertNever(value: never) {\n throw new Error(\"Unexpected value: \" + value);\n}\n\nfunction setup({ operation, interactionType }: DragAndDropData) {\n switch (operation) {\n case \"insert\":\n case \"reorder\":\n document.body.classList.add(styles[\"show-grab-cursor\"]);\n break;\n case \"resize\":\n document.body.classList.add(styles[\"show-resize-cursor\"]);\n break;\n default:\n // there will be a type error if not all operation types are handled\n assertNever(operation);\n }\n\n if (interactionType === \"pointer\") {\n document.body.classList.add(styles[\"disable-selection\"]);\n }\n}\n\nfunction teardown() {\n document.body.classList.remove(styles[\"show-grab-cursor\"], styles[\"show-resize-cursor\"], styles[\"disable-selection\"]);\n}\n\nexport function useGlobalDragStateStyles() {\n useDragSubscription(\"start\", setup);\n useDragSubscription(\"discard\", teardown);\n useDragSubscription(\"submit\", teardown);\n}\n"]}
@@ -1,10 +1,10 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
3
  // SPDX-License-Identifier: Apache-2.0
4
+ import { Children, useRef } from "react";
5
+ import clsx from "clsx";
4
6
  import { useContainerQuery } from "@cloudscape-design/component-toolkit";
5
7
  import { useDensityMode } from "@cloudscape-design/component-toolkit/internal";
6
- import clsx from "clsx";
7
- import { Children, useRef } from "react";
8
8
  import { useMergeRefs } from "../utils/use-merge-refs";
9
9
  import { zipTwoArrays } from "../utils/zip-arrays";
10
10
  import GridItem from "./item";
@@ -1 +1 @@
1
- {"version":3,"file":"grid.js","sourceRoot":"","sources":["../../../../src/internal/grid/grid.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 { useContainerQuery } from \"@cloudscape-design/component-toolkit\";\nimport { useDensityMode } from \"@cloudscape-design/component-toolkit/internal\";\nimport clsx from \"clsx\";\nimport { Children, useRef } from \"react\";\nimport { useMergeRefs } from \"../utils/use-merge-refs\";\nimport { zipTwoArrays } from \"../utils/zip-arrays\";\n\nimport { GridProps } from \"./interfaces\";\nimport GridItem from \"./item\";\nimport styles from \"./styles.css.js\";\n\n/* Matches grid gap in CSS. */\nconst GRID_GAP = {\n comfortable: 20,\n compact: 16,\n};\n\n/* Matches grid-auto-rows in CSS. */\nconst ROWSPAN_HEIGHT = {\n comfortable: 96,\n compact: 76,\n};\n\nexport default function Grid({ layout, children: render, columns, isRtl }: GridProps) {\n const gridRef = useRef<HTMLDivElement>(null);\n const [gridWidth, containerQueryRef] = useContainerQuery((entry) => entry.contentBoxWidth, []);\n const densityMode = useDensityMode(gridRef);\n const gridGap = GRID_GAP[densityMode];\n const rowspanHeight = ROWSPAN_HEIGHT[densityMode];\n\n // The below getters translate relative grid units into size/offset values in pixels.\n const getWidth = (colspan: number) => {\n colspan = Math.min(columns, colspan);\n const cellWidth = ((gridWidth || 0) - (columns - 1) * gridGap) / columns;\n return colspan * cellWidth + (colspan - 1) * gridGap;\n };\n const getHeight = (rowspan: number) => rowspan * rowspanHeight + (rowspan - 1) * gridGap;\n const getColOffset = (x: number) => {\n const offset = getWidth(x) + gridGap;\n return !isRtl?.() ? offset : -offset;\n };\n const getRowOffset = (y: number) => getHeight(y) + gridGap;\n\n const gridContext = { getWidth, getHeight, getColOffset, getRowOffset };\n const children = render?.(gridContext);\n\n const zipped = zipTwoArrays(layout, Children.toArray(children));\n\n const ref = useMergeRefs(gridRef, containerQueryRef);\n return (\n <div ref={ref} className={clsx(styles.grid, styles[`grid-${densityMode}`], styles[`columns-${columns}`])}>\n {zipped.map(([item, children]) => (\n <GridItem key={item.id} item={item}>\n {children}\n </GridItem>\n ))}\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"grid.js","sourceRoot":"","sources":["../../../../src/internal/grid/grid.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 { Children, useRef } from \"react\";\nimport clsx from \"clsx\";\n\nimport { useContainerQuery } from \"@cloudscape-design/component-toolkit\";\nimport { useDensityMode } from \"@cloudscape-design/component-toolkit/internal\";\n\nimport { useMergeRefs } from \"../utils/use-merge-refs\";\nimport { zipTwoArrays } from \"../utils/zip-arrays\";\nimport { GridProps } from \"./interfaces\";\nimport GridItem from \"./item\";\n\nimport styles from \"./styles.css.js\";\n\n/* Matches grid gap in CSS. */\nconst GRID_GAP = {\n comfortable: 20,\n compact: 16,\n};\n\n/* Matches grid-auto-rows in CSS. */\nconst ROWSPAN_HEIGHT = {\n comfortable: 96,\n compact: 76,\n};\n\nexport default function Grid({ layout, children: render, columns, isRtl }: GridProps) {\n const gridRef = useRef<HTMLDivElement>(null);\n const [gridWidth, containerQueryRef] = useContainerQuery((entry) => entry.contentBoxWidth, []);\n const densityMode = useDensityMode(gridRef);\n const gridGap = GRID_GAP[densityMode];\n const rowspanHeight = ROWSPAN_HEIGHT[densityMode];\n\n // The below getters translate relative grid units into size/offset values in pixels.\n const getWidth = (colspan: number) => {\n colspan = Math.min(columns, colspan);\n const cellWidth = ((gridWidth || 0) - (columns - 1) * gridGap) / columns;\n return colspan * cellWidth + (colspan - 1) * gridGap;\n };\n const getHeight = (rowspan: number) => rowspan * rowspanHeight + (rowspan - 1) * gridGap;\n const getColOffset = (x: number) => {\n const offset = getWidth(x) + gridGap;\n return !isRtl?.() ? offset : -offset;\n };\n const getRowOffset = (y: number) => getHeight(y) + gridGap;\n\n const gridContext = { getWidth, getHeight, getColOffset, getRowOffset };\n const children = render?.(gridContext);\n\n const zipped = zipTwoArrays(layout, Children.toArray(children));\n\n const ref = useMergeRefs(gridRef, containerQueryRef);\n return (\n <div ref={ref} className={clsx(styles.grid, styles[`grid-${densityMode}`], styles[`columns-${columns}`])}>\n {zipped.map(([item, children]) => (\n <GridItem key={item.id} item={item}>\n {children}\n </GridItem>\n ))}\n </div>\n );\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../src/internal/grid/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 { ReactNode } from \"react\";\nimport { GridLayoutItem } from \"../interfaces\";\n\nexport interface GridProps {\n layout: GridLayoutItem[];\n columns: number;\n children?: (context: GridContext) => ReactNode;\n isRtl?: () => boolean;\n}\n\nexport interface GridContext {\n getWidth: (colspan: number) => number;\n getHeight: (rowspan: number) => number;\n getColOffset: (x: number) => number;\n getRowOffset: (y: number) => number;\n}\n"]}
1
+ {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../src/internal/grid/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 { ReactNode } from \"react\";\n\nimport { GridLayoutItem } from \"../interfaces\";\n\nexport interface GridProps {\n layout: GridLayoutItem[];\n columns: number;\n children?: (context: GridContext) => ReactNode;\n isRtl?: () => boolean;\n}\n\nexport interface GridContext {\n getWidth: (colspan: number) => number;\n getHeight: (rowspan: number) => number;\n getColOffset: (x: number) => number;\n getRowOffset: (y: number) => number;\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"item.js","sourceRoot":"","sources":["../../../../src/internal/grid/item.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAa,IAAI,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAOrC,MAAM,QAAQ,GAAG,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAiB,EAAE,EAAE;IACrD,gHAAgH;IAChH,OAAO,CACL,cACE,SAAS,EAAE,MAAM,CAAC,UAAU,EAC5B,KAAK,EAAE;YACL,YAAY,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC;YACxB,UAAU,EAAE,QAAQ,IAAI,CAAC,MAAM,EAAE;YACjC,eAAe,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC;YAC3B,aAAa,EAAE,QAAQ,IAAI,CAAC,KAAK,EAAE;SACpC,YAEA,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,IAAI,CAAC,QAAQ,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { ReactNode, memo } from \"react\";\nimport { GridLayoutItem } from \"../interfaces\";\nimport styles from \"./styles.css.js\";\n\nexport interface GridItemProps {\n item: GridLayoutItem;\n children?: ReactNode;\n}\n\nconst GridItem = ({ children, item }: GridItemProps) => {\n // Grid row start can not be set as part of a CSS class names, since we have a potentially infinite height grid.\n return (\n <div\n className={styles.grid__item}\n style={{\n gridRowStart: item.y + 1,\n gridRowEnd: `span ${item.height}`,\n gridColumnStart: item.x + 1,\n gridColumnEnd: `span ${item.width}`,\n }}\n >\n {children}\n </div>\n );\n};\n\nexport default memo(GridItem);\n"]}
1
+ {"version":3,"file":"item.js","sourceRoot":"","sources":["../../../../src/internal/grid/item.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,IAAI,EAAa,MAAM,OAAO,CAAC;AAIxC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAOrC,MAAM,QAAQ,GAAG,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAiB,EAAE,EAAE;IACrD,gHAAgH;IAChH,OAAO,CACL,cACE,SAAS,EAAE,MAAM,CAAC,UAAU,EAC5B,KAAK,EAAE;YACL,YAAY,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC;YACxB,UAAU,EAAE,QAAQ,IAAI,CAAC,MAAM,EAAE;YACjC,eAAe,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC;YAC3B,aAAa,EAAE,QAAQ,IAAI,CAAC,KAAK,EAAE;SACpC,YAEA,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,IAAI,CAAC,QAAQ,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { memo, ReactNode } from \"react\";\n\nimport { GridLayoutItem } from \"../interfaces\";\n\nimport styles from \"./styles.css.js\";\n\nexport interface GridItemProps {\n item: GridLayoutItem;\n children?: ReactNode;\n}\n\nconst GridItem = ({ children, item }: GridItemProps) => {\n // Grid row start can not be set as part of a CSS class names, since we have a potentially infinite height grid.\n return (\n <div\n className={styles.grid__item}\n style={{\n gridRowStart: item.y + 1,\n gridRowEnd: `span ${item.height}`,\n gridColumnStart: item.x + 1,\n gridColumnEnd: `span ${item.width}`,\n }}\n >\n {children}\n </div>\n );\n};\n\nexport default memo(GridItem);\n"]}
@@ -1,8 +1,8 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
3
  // SPDX-License-Identifier: Apache-2.0
4
- import clsx from "clsx";
5
4
  import { forwardRef } from "react";
5
+ import clsx from "clsx";
6
6
  import styles from "./styles.css.js";
7
7
  function Handle(props, ref) {
8
8
  function handlePointerDown(event) {
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/handle/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAoD,UAAU,EAAE,MAAM,OAAO,CAAC;AACrF,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,SAAS,MAAM,CAAC,KAA8C,EAAE,GAAoC;IAClG,SAAS,iBAAiB,CAAC,KAAsC;;QAC/D,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;YACtB,OAAO;SACR;QACD,MAAA,KAAK,CAAC,aAAa,sDAAG,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,OAAO,CACL,oBAAY,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE,GAAG,EAAE,GAAG,GAAI,CACnH,CAAC;AACJ,CAAC;AAED,eAAe,UAAU,CAAC,MAAM,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from \"clsx\";\nimport { ButtonHTMLAttributes, ForwardedRef, PointerEvent, forwardRef } from \"react\";\nimport styles from \"./styles.css.js\";\n\nfunction Handle(props: ButtonHTMLAttributes<HTMLButtonElement>, ref: ForwardedRef<HTMLButtonElement>) {\n function handlePointerDown(event: PointerEvent<HTMLButtonElement>) {\n if (event.button !== 0) {\n return;\n }\n props.onPointerDown?.(event);\n }\n\n return (\n <button {...props} onPointerDown={handlePointerDown} className={clsx(styles.handle, props.className)} ref={ref} />\n );\n}\n\nexport default forwardRef(Handle);\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/handle/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAsC,UAAU,EAAgB,MAAM,OAAO,CAAC;AACrF,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,SAAS,MAAM,CAAC,KAA8C,EAAE,GAAoC;IAClG,SAAS,iBAAiB,CAAC,KAAsC;;QAC/D,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;YACtB,OAAO;SACR;QACD,MAAA,KAAK,CAAC,aAAa,sDAAG,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,OAAO,CACL,oBAAY,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE,GAAG,EAAE,GAAG,GAAI,CACnH,CAAC;AACJ,CAAC;AAED,eAAe,UAAU,CAAC,MAAM,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { ButtonHTMLAttributes, ForwardedRef, forwardRef, PointerEvent } from \"react\";\nimport clsx from \"clsx\";\n\nimport styles from \"./styles.css.js\";\n\nfunction Handle(props: ButtonHTMLAttributes<HTMLButtonElement>, ref: ForwardedRef<HTMLButtonElement>) {\n function handlePointerDown(event: PointerEvent<HTMLButtonElement>) {\n if (event.button !== 0) {\n return;\n }\n props.onPointerDown?.(event);\n }\n\n return (\n <button {...props} onPointerDown={handlePointerDown} className={clsx(styles.handle, props.className)} ref={ref} />\n );\n}\n\nexport default forwardRef(Handle);\n"]}
@@ -1,4 +1,4 @@
1
- import { KeyboardEvent, ReactNode, PointerEvent as ReactPointerEvent, RefObject } from "react";
1
+ import { KeyboardEvent, PointerEvent as ReactPointerEvent, ReactNode, RefObject } from "react";
2
2
  import { DropTargetContext } from "../dnd-controller/controller";
3
3
  import { BoardItemDefinitionBase, Direction, Transform } from "../interfaces";
4
4
  export interface ItemContainerRef {
@@ -1,12 +1,12 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
3
  // SPDX-License-Identifier: Apache-2.0
4
- import { getLogicalBoundingClientRect, getLogicalClientX } from "@cloudscape-design/component-toolkit/internal";
5
- import { CSS as CSSUtil } from "@dnd-kit/utilities";
6
- import clsx from "clsx";
7
4
  import { createContext, forwardRef, useContext, useEffect, useImperativeHandle, useRef, useState, } from "react";
8
5
  import { createPortal } from "react-dom";
9
- import { useDragSubscription, useDraggable, } from "../dnd-controller/controller";
6
+ import { CSS as CSSUtil } from "@dnd-kit/utilities";
7
+ import clsx from "clsx";
8
+ import { getLogicalBoundingClientRect, getLogicalClientX } from "@cloudscape-design/component-toolkit/internal";
9
+ import { useDraggable, useDragSubscription, } from "../dnd-controller/controller";
10
10
  import { Coordinates } from "../utils/coordinates";
11
11
  import { getNormalizedElementRect } from "../utils/screen";
12
12
  import { throttle } from "../utils/throttle";
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/item-container/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 { getLogicalBoundingClientRect, getLogicalClientX } from \"@cloudscape-design/component-toolkit/internal\";\nimport { CSS as CSSUtil } from \"@dnd-kit/utilities\";\nimport clsx from \"clsx\";\nimport {\n CSSProperties,\n KeyboardEvent,\n ReactNode,\n PointerEvent as ReactPointerEvent,\n Ref,\n RefObject,\n createContext,\n forwardRef,\n useContext,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport {\n DragAndDropData,\n DropTargetContext,\n InteractionType,\n Operation,\n useDragSubscription,\n useDraggable,\n} from \"../dnd-controller/controller\";\nimport { BoardItemDefinitionBase, Direction, ItemId, Transform } from \"../interfaces\";\nimport { Coordinates } from \"../utils/coordinates\";\nimport { getNormalizedElementRect } from \"../utils/screen\";\n\nimport { throttle } from \"../utils/throttle\";\nimport { getCollisionRect } from \"./get-collision-rect\";\nimport { getNextDroppable } from \"./get-next-droppable\";\nimport styles from \"./styles.css.js\";\n\nexport interface ItemContainerRef {\n focusDragHandle(): void;\n}\n\ninterface ItemContextType {\n isActive: boolean;\n dragHandle: {\n ref: RefObject<HTMLButtonElement>;\n onPointerDown(event: ReactPointerEvent): void;\n onKeyDown(event: KeyboardEvent): void;\n isActive: boolean;\n };\n resizeHandle: null | {\n onPointerDown(event: ReactPointerEvent): void;\n onKeyDown(event: KeyboardEvent): void;\n isActive: boolean;\n };\n}\n\nexport const ItemContext = createContext<ItemContextType | null>(null);\n\nexport function useItemContext() {\n const ctx = useContext(ItemContext);\n if (!ctx) {\n throw new Error(\"Unable to find BoardItem context.\");\n }\n return ctx;\n}\n\ninterface Transition {\n itemId: ItemId;\n operation: Operation;\n interactionType: InteractionType;\n sizeTransform: null | { width: number; height: number };\n positionTransform: null | { x: number; y: number };\n hasDropTarget?: boolean;\n}\n\n/**\n * Defines item's parameters and its relation with the layout.\n *\n * `item` - the unique board item base object to be used in d&d context.\n * `placed` - specifies if the item already belongs to the board.\n * `acquired` - specifies if the item is essentially a copy temporarily acquired by a droppable but not submitted yet.\n * `inTransition` - specifies if the item is currently being moved.\n * `transform` - specifies if the item's position needs to be altered.\n * `getItemSize` - item size getter that takes droppable context as argument.\n * `onKeyMove` - a callback that fires when arrow keys are pressed in drag- or resize handle.\n */\nexport interface ItemContainerProps {\n item: BoardItemDefinitionBase<unknown>;\n placed: boolean;\n acquired: boolean;\n inTransition: boolean;\n transform: Transform | undefined;\n getItemSize: (context: null | DropTargetContext) => {\n width: number;\n minWidth: number;\n maxWidth: number;\n height: number;\n minHeight: number;\n maxHeight: number;\n };\n onKeyMove?(direction: Direction): void;\n children: (hasDropTarget: boolean) => ReactNode;\n isRtl: () => boolean;\n}\n\nexport const ItemContainer = forwardRef(ItemContainerComponent);\n\nfunction ItemContainerComponent(\n { item, placed, acquired, inTransition, transform, getItemSize, onKeyMove, children, isRtl }: ItemContainerProps,\n ref: Ref<ItemContainerRef>,\n) {\n const originalSizeRef = useRef({ width: 0, height: 0 });\n const pointerOffsetRef = useRef(new Coordinates({ x: 0, y: 0 }));\n const pointerBoundariesRef = useRef<null | Coordinates>(null);\n const [transition, setTransition] = useState<null | Transition>(null);\n const [isHidden, setIsHidden] = useState(false);\n const muteEventsRef = useRef(false);\n const itemRef = useRef<HTMLDivElement>(null);\n const draggableApi = useDraggable({\n draggableItem: item,\n getCollisionRect: (operation, coordinates, dropTarget) => {\n const sizeOverride = operation === \"insert\" && dropTarget ? getItemSize(dropTarget) : null;\n return getCollisionRect(operation, itemRef.current!, coordinates, sizeOverride);\n },\n });\n\n function updateTransition({\n operation,\n interactionType,\n draggableItem,\n collisionRect,\n coordinates,\n dropTarget,\n }: DragAndDropData) {\n if (item.id === draggableItem.id) {\n const [width, height] = [collisionRect.right - collisionRect.left, collisionRect.bottom - collisionRect.top];\n const pointerOffset = pointerOffsetRef.current;\n\n if (operation === \"resize\") {\n setTransition({\n operation,\n interactionType,\n itemId: draggableItem.id,\n sizeTransform: {\n width: Math.max(getItemSize(null).minWidth, Math.min(getItemSize(null).maxWidth, width - pointerOffset.x)),\n height: Math.max(getItemSize(null).minHeight, height - pointerOffset.y),\n },\n positionTransform: null,\n });\n } else if (operation === \"insert\" || operation === \"reorder\") {\n setTransition({\n operation,\n interactionType,\n itemId: draggableItem.id,\n sizeTransform: dropTarget ? getItemSize(dropTarget) : originalSizeRef.current,\n positionTransform: { x: coordinates.x - pointerOffset.x, y: coordinates.y - pointerOffset.y },\n hasDropTarget: !!dropTarget,\n });\n }\n }\n }\n\n useDragSubscription(\"start\", (detail) => updateTransition(detail));\n useDragSubscription(\"update\", (detail) => updateTransition(detail));\n useDragSubscription(\"submit\", () => {\n setTransition(null);\n setIsHidden(false);\n muteEventsRef.current = false;\n });\n useDragSubscription(\"discard\", () => {\n setTransition(null);\n setIsHidden(false);\n muteEventsRef.current = false;\n });\n\n // During the transition listen to pointer move and pointer up events to update/submit transition.\n const transitionInteractionType = transition?.interactionType ?? null;\n const transitionItemId = transition?.itemId ?? null;\n useEffect(() => {\n const onPointerMove = throttle((event: PointerEvent) => {\n const coordinates = Coordinates.fromEvent(event, { isRtl: isRtl() });\n draggableApi.updateTransition(\n new Coordinates({\n x: Math.max(coordinates.x, pointerBoundariesRef.current?.x ?? Number.NEGATIVE_INFINITY),\n y: Math.max(coordinates.y, pointerBoundariesRef.current?.y ?? Number.NEGATIVE_INFINITY),\n }),\n );\n }, 10);\n const onPointerUp = () => {\n onPointerMove.cancel();\n draggableApi.submitTransition();\n };\n\n if (transitionInteractionType === \"pointer\" && transitionItemId === item.id) {\n window.addEventListener(\"pointermove\", onPointerMove);\n window.addEventListener(\"pointerup\", onPointerUp);\n }\n return () => {\n window.removeEventListener(\"pointermove\", onPointerMove);\n window.removeEventListener(\"pointerup\", onPointerUp);\n };\n // draggableApi is not expected to change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [item.id, transitionInteractionType, transitionItemId]);\n\n useEffect(() => {\n if (transitionInteractionType === \"keyboard\" && transitionItemId === item.id) {\n const onPointerDown = () => draggableApi.submitTransition();\n window.addEventListener(\"pointerdown\", onPointerDown, true);\n return () => {\n window.removeEventListener(\"pointerdown\", onPointerDown, true);\n };\n }\n // draggableApi is not expected to change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [item.id, transitionInteractionType, transitionItemId]);\n\n function onKeyboardTransitionToggle(operation: \"drag\" | \"resize\") {\n // The acquired item is a copy and does not have the transition state.\n // However, pressing \"Space\" or \"Enter\" on the acquired item must submit the active transition.\n if (acquired) {\n return draggableApi.submitTransition();\n }\n\n // Create new transition if missing.\n if (!transition) {\n const rect = getNormalizedElementRect(itemRef.current!);\n const coordinates = new Coordinates({\n x: operation === \"drag\" ? rect.left : rect.right,\n y: operation === \"drag\" ? rect.top : rect.bottom,\n });\n\n if (operation === \"drag\" && !placed) {\n draggableApi.start(\"insert\", \"keyboard\", coordinates);\n } else if (operation === \"drag\") {\n draggableApi.start(\"reorder\", \"keyboard\", coordinates);\n } else {\n draggableApi.start(\"resize\", \"keyboard\", coordinates);\n }\n }\n // Submit a transition if existing.\n else {\n draggableApi.submitTransition();\n }\n }\n\n function handleInsert(direction: Direction) {\n // Find the closest droppable (in the direction) to the item.\n const droppables = draggableApi.getDroppables();\n const nextDroppable = getNextDroppable({\n draggableElement: itemRef.current!,\n droppables,\n direction,\n isRtl: isRtl(),\n });\n\n if (!nextDroppable) {\n // TODO: add announcement\n // Context: the keyboard insertion only works when there is some droppable area in the specified direction.\n // That means that only some arrow keys might work which is confusing for a screen-reader user.\n // Alternatively, we can consider a multi-step insertion where the user would first explicitly select the desired board.\n return;\n }\n\n // Notify the respective droppable of the intention to insert the item in it.\n draggableApi.acquire(nextDroppable, () => children(true));\n setIsHidden(true);\n muteEventsRef.current = true;\n }\n\n function onHandleKeyDown(operation: \"drag\" | \"resize\", event: KeyboardEvent) {\n const canInsert = transition && operation === \"drag\" && !placed;\n const canNavigate = transition || operation === \"drag\";\n\n // The insert is handled by the item and the navigation is delegated to the containing layout.\n const move = (direction: Direction) => {\n if (canInsert) {\n handleInsert(direction);\n } else if (canNavigate) {\n onKeyMove?.(direction);\n }\n };\n\n const discard = () => {\n if (transition || acquired) {\n draggableApi.discardTransition();\n }\n };\n\n switch (event.key) {\n case \"ArrowUp\":\n return move(\"up\");\n case \"ArrowDown\":\n return move(\"down\");\n case \"ArrowLeft\":\n return move(\"left\");\n case \"ArrowRight\":\n return move(\"right\");\n case \" \":\n case \"Enter\":\n return onKeyboardTransitionToggle(operation);\n case \"Escape\":\n return discard();\n }\n }\n\n function onBlur() {\n // When drag- or resize handle on palette or board item loses focus the transition must be submitted with two exceptions:\n // 1. If the last interaction is not \"keyboard\" (the user clicked on another handle issuing a new transition);\n // 2. If the item is acquired by the board (in that case the focus moves to the board item which is expected, palette item is hidden and all events handlers must be muted).\n if (transition && transition.interactionType === \"keyboard\" && !muteEventsRef.current) {\n draggableApi.submitTransition();\n }\n }\n\n function onDragHandlePointerDown(event: ReactPointerEvent) {\n // Calculate the offset between item's top-left corner and the pointer landing position.\n const rect = getLogicalBoundingClientRect(itemRef.current!);\n const clientX = getLogicalClientX(event, isRtl());\n const clientY = event.clientY;\n pointerOffsetRef.current = new Coordinates({\n x: clientX - rect.insetInlineStart,\n y: clientY - rect.insetBlockStart,\n });\n originalSizeRef.current = { width: rect.inlineSize, height: rect.blockSize };\n pointerBoundariesRef.current = null;\n\n draggableApi.start(!placed ? \"insert\" : \"reorder\", \"pointer\", Coordinates.fromEvent(event, { isRtl: isRtl() }));\n }\n\n function onDragHandleKeyDown(event: KeyboardEvent) {\n onHandleKeyDown(\"drag\", event);\n }\n\n function onResizeHandlePointerDown(event: ReactPointerEvent) {\n // Calculate the offset between item's bottom-right corner and the pointer landing position.\n const rect = getLogicalBoundingClientRect(itemRef.current!);\n const clientX = getLogicalClientX(event, isRtl());\n const clientY = event.clientY;\n pointerOffsetRef.current = new Coordinates({ x: clientX - rect.insetInlineEnd, y: clientY - rect.insetBlockEnd });\n originalSizeRef.current = { width: rect.inlineSize, height: rect.blockSize };\n\n // Calculate boundaries below which the cursor cannot move.\n const minWidth = getItemSize(null).minWidth;\n const minHeight = getItemSize(null).minHeight;\n pointerBoundariesRef.current = new Coordinates({\n x: clientX - rect.inlineSize + minWidth,\n y: clientY - rect.blockSize + minHeight,\n });\n\n draggableApi.start(\"resize\", \"pointer\", Coordinates.fromEvent(event, { isRtl: isRtl() }));\n }\n\n function onResizeHandleKeyDown(event: KeyboardEvent) {\n onHandleKeyDown(\"resize\", event);\n }\n\n const itemTransitionStyle: CSSProperties = {};\n const itemTransitionClassNames: string[] = [];\n\n if (inTransition) {\n itemTransitionClassNames.push(styles.inTransition);\n }\n\n if (transition && transition.interactionType === \"pointer\") {\n // Adjust the dragged/resized item to the pointer's location.\n itemTransitionClassNames.push(transition.operation === \"resize\" ? styles.resized : styles.dragged);\n itemTransitionStyle.insetInlineStart = transition.positionTransform?.x;\n itemTransitionStyle.insetBlockStart = transition.positionTransform?.y;\n itemTransitionStyle.inlineSize = transition.sizeTransform?.width;\n itemTransitionStyle.blockSize = transition.sizeTransform?.height;\n itemTransitionStyle.pointerEvents = \"none\";\n }\n\n if (isHidden) {\n itemTransitionClassNames.push(styles.hidden);\n }\n\n if (transform) {\n // The moved items positions are altered with CSS transform.\n if (transform.type === \"move\") {\n itemTransitionClassNames.push(styles.transformed);\n itemTransitionStyle.transform = CSSUtil.Transform.toString({\n x: transform.x,\n y: transform.y,\n scaleX: 1,\n scaleY: 1,\n });\n itemTransitionStyle.width = transform.width + \"px\";\n itemTransitionStyle.height = transform.height + \"px\";\n }\n // The item is removed from the DOM after animations play.\n // During the animations the removed item is hidden with styles.\n if (transform.type === \"remove\") {\n itemTransitionClassNames.push(styles.removed);\n }\n }\n\n const dragHandleRef = useRef<HTMLButtonElement>(null);\n useImperativeHandle(ref, () => ({\n focusDragHandle: () => dragHandleRef.current?.focus(),\n }));\n\n const isActive = (!!transition && !isHidden) || !!acquired;\n const shouldUsePortal = transition?.operation === \"insert\" && transition?.interactionType === \"pointer\";\n const childrenRef = useRef<ReactNode>(null);\n if (!inTransition || isActive) {\n childrenRef.current = children(!!transition?.hasDropTarget);\n }\n\n const content = (\n <div\n ref={itemRef}\n className={clsx(styles.root, ...itemTransitionClassNames)}\n style={itemTransitionStyle}\n data-item-id={item.id}\n onBlur={onBlur}\n >\n <ItemContext.Provider\n value={{\n isActive,\n dragHandle: {\n ref: dragHandleRef,\n onPointerDown: onDragHandlePointerDown,\n onKeyDown: onDragHandleKeyDown,\n isActive: isActive && transition?.operation === \"reorder\",\n },\n resizeHandle: placed\n ? {\n onPointerDown: onResizeHandlePointerDown,\n onKeyDown: onResizeHandleKeyDown,\n isActive: isActive && transition?.operation === \"resize\",\n }\n : null,\n }}\n >\n {childrenRef.current}\n </ItemContext.Provider>\n </div>\n );\n\n return shouldUsePortal ? <div>{createPortal(content, document.body)}</div> : content;\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/item-container/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 {\n createContext,\n CSSProperties,\n forwardRef,\n KeyboardEvent,\n PointerEvent as ReactPointerEvent,\n ReactNode,\n Ref,\n RefObject,\n useContext,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { CSS as CSSUtil } from \"@dnd-kit/utilities\";\nimport clsx from \"clsx\";\n\nimport { getLogicalBoundingClientRect, getLogicalClientX } from \"@cloudscape-design/component-toolkit/internal\";\n\nimport {\n DragAndDropData,\n DropTargetContext,\n InteractionType,\n Operation,\n useDraggable,\n useDragSubscription,\n} from \"../dnd-controller/controller\";\nimport { BoardItemDefinitionBase, Direction, ItemId, Transform } from \"../interfaces\";\nimport { Coordinates } from \"../utils/coordinates\";\nimport { getNormalizedElementRect } from \"../utils/screen\";\nimport { throttle } from \"../utils/throttle\";\nimport { getCollisionRect } from \"./get-collision-rect\";\nimport { getNextDroppable } from \"./get-next-droppable\";\n\nimport styles from \"./styles.css.js\";\n\nexport interface ItemContainerRef {\n focusDragHandle(): void;\n}\n\ninterface ItemContextType {\n isActive: boolean;\n dragHandle: {\n ref: RefObject<HTMLButtonElement>;\n onPointerDown(event: ReactPointerEvent): void;\n onKeyDown(event: KeyboardEvent): void;\n isActive: boolean;\n };\n resizeHandle: null | {\n onPointerDown(event: ReactPointerEvent): void;\n onKeyDown(event: KeyboardEvent): void;\n isActive: boolean;\n };\n}\n\nexport const ItemContext = createContext<ItemContextType | null>(null);\n\nexport function useItemContext() {\n const ctx = useContext(ItemContext);\n if (!ctx) {\n throw new Error(\"Unable to find BoardItem context.\");\n }\n return ctx;\n}\n\ninterface Transition {\n itemId: ItemId;\n operation: Operation;\n interactionType: InteractionType;\n sizeTransform: null | { width: number; height: number };\n positionTransform: null | { x: number; y: number };\n hasDropTarget?: boolean;\n}\n\n/**\n * Defines item's parameters and its relation with the layout.\n *\n * `item` - the unique board item base object to be used in d&d context.\n * `placed` - specifies if the item already belongs to the board.\n * `acquired` - specifies if the item is essentially a copy temporarily acquired by a droppable but not submitted yet.\n * `inTransition` - specifies if the item is currently being moved.\n * `transform` - specifies if the item's position needs to be altered.\n * `getItemSize` - item size getter that takes droppable context as argument.\n * `onKeyMove` - a callback that fires when arrow keys are pressed in drag- or resize handle.\n */\nexport interface ItemContainerProps {\n item: BoardItemDefinitionBase<unknown>;\n placed: boolean;\n acquired: boolean;\n inTransition: boolean;\n transform: Transform | undefined;\n getItemSize: (context: null | DropTargetContext) => {\n width: number;\n minWidth: number;\n maxWidth: number;\n height: number;\n minHeight: number;\n maxHeight: number;\n };\n onKeyMove?(direction: Direction): void;\n children: (hasDropTarget: boolean) => ReactNode;\n isRtl: () => boolean;\n}\n\nexport const ItemContainer = forwardRef(ItemContainerComponent);\n\nfunction ItemContainerComponent(\n { item, placed, acquired, inTransition, transform, getItemSize, onKeyMove, children, isRtl }: ItemContainerProps,\n ref: Ref<ItemContainerRef>,\n) {\n const originalSizeRef = useRef({ width: 0, height: 0 });\n const pointerOffsetRef = useRef(new Coordinates({ x: 0, y: 0 }));\n const pointerBoundariesRef = useRef<null | Coordinates>(null);\n const [transition, setTransition] = useState<null | Transition>(null);\n const [isHidden, setIsHidden] = useState(false);\n const muteEventsRef = useRef(false);\n const itemRef = useRef<HTMLDivElement>(null);\n const draggableApi = useDraggable({\n draggableItem: item,\n getCollisionRect: (operation, coordinates, dropTarget) => {\n const sizeOverride = operation === \"insert\" && dropTarget ? getItemSize(dropTarget) : null;\n return getCollisionRect(operation, itemRef.current!, coordinates, sizeOverride);\n },\n });\n\n function updateTransition({\n operation,\n interactionType,\n draggableItem,\n collisionRect,\n coordinates,\n dropTarget,\n }: DragAndDropData) {\n if (item.id === draggableItem.id) {\n const [width, height] = [collisionRect.right - collisionRect.left, collisionRect.bottom - collisionRect.top];\n const pointerOffset = pointerOffsetRef.current;\n\n if (operation === \"resize\") {\n setTransition({\n operation,\n interactionType,\n itemId: draggableItem.id,\n sizeTransform: {\n width: Math.max(getItemSize(null).minWidth, Math.min(getItemSize(null).maxWidth, width - pointerOffset.x)),\n height: Math.max(getItemSize(null).minHeight, height - pointerOffset.y),\n },\n positionTransform: null,\n });\n } else if (operation === \"insert\" || operation === \"reorder\") {\n setTransition({\n operation,\n interactionType,\n itemId: draggableItem.id,\n sizeTransform: dropTarget ? getItemSize(dropTarget) : originalSizeRef.current,\n positionTransform: { x: coordinates.x - pointerOffset.x, y: coordinates.y - pointerOffset.y },\n hasDropTarget: !!dropTarget,\n });\n }\n }\n }\n\n useDragSubscription(\"start\", (detail) => updateTransition(detail));\n useDragSubscription(\"update\", (detail) => updateTransition(detail));\n useDragSubscription(\"submit\", () => {\n setTransition(null);\n setIsHidden(false);\n muteEventsRef.current = false;\n });\n useDragSubscription(\"discard\", () => {\n setTransition(null);\n setIsHidden(false);\n muteEventsRef.current = false;\n });\n\n // During the transition listen to pointer move and pointer up events to update/submit transition.\n const transitionInteractionType = transition?.interactionType ?? null;\n const transitionItemId = transition?.itemId ?? null;\n useEffect(() => {\n const onPointerMove = throttle((event: PointerEvent) => {\n const coordinates = Coordinates.fromEvent(event, { isRtl: isRtl() });\n draggableApi.updateTransition(\n new Coordinates({\n x: Math.max(coordinates.x, pointerBoundariesRef.current?.x ?? Number.NEGATIVE_INFINITY),\n y: Math.max(coordinates.y, pointerBoundariesRef.current?.y ?? Number.NEGATIVE_INFINITY),\n }),\n );\n }, 10);\n const onPointerUp = () => {\n onPointerMove.cancel();\n draggableApi.submitTransition();\n };\n\n if (transitionInteractionType === \"pointer\" && transitionItemId === item.id) {\n window.addEventListener(\"pointermove\", onPointerMove);\n window.addEventListener(\"pointerup\", onPointerUp);\n }\n return () => {\n window.removeEventListener(\"pointermove\", onPointerMove);\n window.removeEventListener(\"pointerup\", onPointerUp);\n };\n // draggableApi is not expected to change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [item.id, transitionInteractionType, transitionItemId]);\n\n useEffect(() => {\n if (transitionInteractionType === \"keyboard\" && transitionItemId === item.id) {\n const onPointerDown = () => draggableApi.submitTransition();\n window.addEventListener(\"pointerdown\", onPointerDown, true);\n return () => {\n window.removeEventListener(\"pointerdown\", onPointerDown, true);\n };\n }\n // draggableApi is not expected to change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [item.id, transitionInteractionType, transitionItemId]);\n\n function onKeyboardTransitionToggle(operation: \"drag\" | \"resize\") {\n // The acquired item is a copy and does not have the transition state.\n // However, pressing \"Space\" or \"Enter\" on the acquired item must submit the active transition.\n if (acquired) {\n return draggableApi.submitTransition();\n }\n\n // Create new transition if missing.\n if (!transition) {\n const rect = getNormalizedElementRect(itemRef.current!);\n const coordinates = new Coordinates({\n x: operation === \"drag\" ? rect.left : rect.right,\n y: operation === \"drag\" ? rect.top : rect.bottom,\n });\n\n if (operation === \"drag\" && !placed) {\n draggableApi.start(\"insert\", \"keyboard\", coordinates);\n } else if (operation === \"drag\") {\n draggableApi.start(\"reorder\", \"keyboard\", coordinates);\n } else {\n draggableApi.start(\"resize\", \"keyboard\", coordinates);\n }\n }\n // Submit a transition if existing.\n else {\n draggableApi.submitTransition();\n }\n }\n\n function handleInsert(direction: Direction) {\n // Find the closest droppable (in the direction) to the item.\n const droppables = draggableApi.getDroppables();\n const nextDroppable = getNextDroppable({\n draggableElement: itemRef.current!,\n droppables,\n direction,\n isRtl: isRtl(),\n });\n\n if (!nextDroppable) {\n // TODO: add announcement\n // Context: the keyboard insertion only works when there is some droppable area in the specified direction.\n // That means that only some arrow keys might work which is confusing for a screen-reader user.\n // Alternatively, we can consider a multi-step insertion where the user would first explicitly select the desired board.\n return;\n }\n\n // Notify the respective droppable of the intention to insert the item in it.\n draggableApi.acquire(nextDroppable, () => children(true));\n setIsHidden(true);\n muteEventsRef.current = true;\n }\n\n function onHandleKeyDown(operation: \"drag\" | \"resize\", event: KeyboardEvent) {\n const canInsert = transition && operation === \"drag\" && !placed;\n const canNavigate = transition || operation === \"drag\";\n\n // The insert is handled by the item and the navigation is delegated to the containing layout.\n const move = (direction: Direction) => {\n if (canInsert) {\n handleInsert(direction);\n } else if (canNavigate) {\n onKeyMove?.(direction);\n }\n };\n\n const discard = () => {\n if (transition || acquired) {\n draggableApi.discardTransition();\n }\n };\n\n switch (event.key) {\n case \"ArrowUp\":\n return move(\"up\");\n case \"ArrowDown\":\n return move(\"down\");\n case \"ArrowLeft\":\n return move(\"left\");\n case \"ArrowRight\":\n return move(\"right\");\n case \" \":\n case \"Enter\":\n return onKeyboardTransitionToggle(operation);\n case \"Escape\":\n return discard();\n }\n }\n\n function onBlur() {\n // When drag- or resize handle on palette or board item loses focus the transition must be submitted with two exceptions:\n // 1. If the last interaction is not \"keyboard\" (the user clicked on another handle issuing a new transition);\n // 2. If the item is acquired by the board (in that case the focus moves to the board item which is expected, palette item is hidden and all events handlers must be muted).\n if (transition && transition.interactionType === \"keyboard\" && !muteEventsRef.current) {\n draggableApi.submitTransition();\n }\n }\n\n function onDragHandlePointerDown(event: ReactPointerEvent) {\n // Calculate the offset between item's top-left corner and the pointer landing position.\n const rect = getLogicalBoundingClientRect(itemRef.current!);\n const clientX = getLogicalClientX(event, isRtl());\n const clientY = event.clientY;\n pointerOffsetRef.current = new Coordinates({\n x: clientX - rect.insetInlineStart,\n y: clientY - rect.insetBlockStart,\n });\n originalSizeRef.current = { width: rect.inlineSize, height: rect.blockSize };\n pointerBoundariesRef.current = null;\n\n draggableApi.start(!placed ? \"insert\" : \"reorder\", \"pointer\", Coordinates.fromEvent(event, { isRtl: isRtl() }));\n }\n\n function onDragHandleKeyDown(event: KeyboardEvent) {\n onHandleKeyDown(\"drag\", event);\n }\n\n function onResizeHandlePointerDown(event: ReactPointerEvent) {\n // Calculate the offset between item's bottom-right corner and the pointer landing position.\n const rect = getLogicalBoundingClientRect(itemRef.current!);\n const clientX = getLogicalClientX(event, isRtl());\n const clientY = event.clientY;\n pointerOffsetRef.current = new Coordinates({ x: clientX - rect.insetInlineEnd, y: clientY - rect.insetBlockEnd });\n originalSizeRef.current = { width: rect.inlineSize, height: rect.blockSize };\n\n // Calculate boundaries below which the cursor cannot move.\n const minWidth = getItemSize(null).minWidth;\n const minHeight = getItemSize(null).minHeight;\n pointerBoundariesRef.current = new Coordinates({\n x: clientX - rect.inlineSize + minWidth,\n y: clientY - rect.blockSize + minHeight,\n });\n\n draggableApi.start(\"resize\", \"pointer\", Coordinates.fromEvent(event, { isRtl: isRtl() }));\n }\n\n function onResizeHandleKeyDown(event: KeyboardEvent) {\n onHandleKeyDown(\"resize\", event);\n }\n\n const itemTransitionStyle: CSSProperties = {};\n const itemTransitionClassNames: string[] = [];\n\n if (inTransition) {\n itemTransitionClassNames.push(styles.inTransition);\n }\n\n if (transition && transition.interactionType === \"pointer\") {\n // Adjust the dragged/resized item to the pointer's location.\n itemTransitionClassNames.push(transition.operation === \"resize\" ? styles.resized : styles.dragged);\n itemTransitionStyle.insetInlineStart = transition.positionTransform?.x;\n itemTransitionStyle.insetBlockStart = transition.positionTransform?.y;\n itemTransitionStyle.inlineSize = transition.sizeTransform?.width;\n itemTransitionStyle.blockSize = transition.sizeTransform?.height;\n itemTransitionStyle.pointerEvents = \"none\";\n }\n\n if (isHidden) {\n itemTransitionClassNames.push(styles.hidden);\n }\n\n if (transform) {\n // The moved items positions are altered with CSS transform.\n if (transform.type === \"move\") {\n itemTransitionClassNames.push(styles.transformed);\n itemTransitionStyle.transform = CSSUtil.Transform.toString({\n x: transform.x,\n y: transform.y,\n scaleX: 1,\n scaleY: 1,\n });\n itemTransitionStyle.width = transform.width + \"px\";\n itemTransitionStyle.height = transform.height + \"px\";\n }\n // The item is removed from the DOM after animations play.\n // During the animations the removed item is hidden with styles.\n if (transform.type === \"remove\") {\n itemTransitionClassNames.push(styles.removed);\n }\n }\n\n const dragHandleRef = useRef<HTMLButtonElement>(null);\n useImperativeHandle(ref, () => ({\n focusDragHandle: () => dragHandleRef.current?.focus(),\n }));\n\n const isActive = (!!transition && !isHidden) || !!acquired;\n const shouldUsePortal = transition?.operation === \"insert\" && transition?.interactionType === \"pointer\";\n const childrenRef = useRef<ReactNode>(null);\n if (!inTransition || isActive) {\n childrenRef.current = children(!!transition?.hasDropTarget);\n }\n\n const content = (\n <div\n ref={itemRef}\n className={clsx(styles.root, ...itemTransitionClassNames)}\n style={itemTransitionStyle}\n data-item-id={item.id}\n onBlur={onBlur}\n >\n <ItemContext.Provider\n value={{\n isActive,\n dragHandle: {\n ref: dragHandleRef,\n onPointerDown: onDragHandlePointerDown,\n onKeyDown: onDragHandleKeyDown,\n isActive: isActive && transition?.operation === \"reorder\",\n },\n resizeHandle: placed\n ? {\n onPointerDown: onResizeHandlePointerDown,\n onKeyDown: onResizeHandleKeyDown,\n isActive: isActive && transition?.operation === \"resize\",\n }\n : null,\n }}\n >\n {childrenRef.current}\n </ItemContext.Provider>\n </div>\n );\n\n return shouldUsePortal ? <div>{createPortal(content, document.body)}</div> : content;\n}\n"]}
@@ -1,7 +1,7 @@
1
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
2
  // SPDX-License-Identifier: Apache-2.0
3
3
  import { Position } from "../utils/position";
4
- import { MoveSolutionState, findNextSolutions } from "./engine-solution";
4
+ import { findNextSolutions, MoveSolutionState } from "./engine-solution";
5
5
  import { checkItemsIntersection, sortGridItems } from "./utils";
6
6
  import { createMove } from "./utils";
7
7
  // The solutions can't be searched for infinitely in case the algorithm can't converge.
@@ -1 +1 @@
1
- {"version":3,"file":"engine-step.js","sourceRoot":"","sources":["../../../../src/internal/layout-engine/engine-step.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 { Position } from \"../utils/position\";\nimport { MoveSolution, MoveSolutionState, findNextSolutions } from \"./engine-solution\";\nimport { Conflicts, LayoutEngineState } from \"./engine-state\";\nimport { ReadonlyLayoutEngineGrid } from \"./grid\";\nimport { CommittedMove } from \"./interfaces\";\nimport { checkItemsIntersection, sortGridItems } from \"./utils\";\nimport { createMove } from \"./utils\";\n\n// The solutions can't be searched for infinitely in case the algorithm can't converge.\n// The safety counter ensures there is going to be user feedback within reasonable time.\nconst MAX_SOLUTION_DEPTH = 100;\n\n// At any given step only a few best solutions are taken to ensure faster convergence.\n// The larger the number the better chance the most optimal solution is found for the given priorities\n// at a cost of more computations made.\nconst NUM_BEST_SOLUTIONS = 5;\n\n/**\n * The function takes the current layout state (item placements from the previous steps and all moves done so far)\n * and a user command increment that describes an item transition by one cell in some direction.\n * The function finds overlapping elements and resolves all overlaps if possible (always possible when no conflicts).\n * The result in an updated state (new item placements, additional moves, and item conflicts if any).\n */\nexport function resolveOverlaps(layoutState: LayoutEngineState, userMove: CommittedMove): LayoutEngineState {\n // For better UX the layout engine is optimized for item swaps.\n // The swapping is only preferred for the user-controlled item and it can only happen when the item overlaps another\n // item past its midpoint. When the overlap is not enough, the underlying item is considered a conflict and it is not\n // allowed to move anywhere. The user command cannot be committed at this step.\n const conflicts = findConflicts(layoutState.grid, layoutState.conflicts, userMove);\n\n // The user moves are always applied as is. When the user-controlled item overlaps with other items and there is\n // no conflict, the type=\"OVERLAP\" moves are performed to settle the grid so that no items overlap with one another.\n // For this type of move multiple solutions are often available. To ensure the best result all solutions are tried\n // and a score is given to each. The solution with the minimal score wins.\n // The process stars from the initial state and the user move. The initial score and the user move score are 0.\n const initialState = new MoveSolutionState(layoutState.grid, layoutState.moves, conflicts);\n const initialSolution: MoveSolution = [initialState, userMove];\n\n // All solutions are guaranteed to have unique move sequences but different move sequences can produce the same result.\n // As it is never expected for one item to be moved over to the same location twice the combination of the item ID,\n // item position, and solution score can uniquely represent the solution.\n // For earlier moves taking a solution from the cache can prevent hundreds of subsequent computations.\n const solutionsCache = new Map<string, MoveSolution>();\n const createCacheKey = ([state, move]: MoveSolution) =>\n `${move.itemId} ${move.x}:${move.y}:${state.score + move.score}`;\n\n let moveSolutions: MoveSolution[] = [initialSolution];\n let bestSolution: null | MoveSolutionState = null;\n let convergenceCounter = MAX_SOLUTION_DEPTH;\n\n // The resolution process continues until there is at least one reasonable solution left.\n // The repetitive, dead-end, and expensive (compared to the best so far) solutions are excluded\n // so that eventually no more variants to try remain.\n // The convergence safety counter ensures the logical errors to not cause an infinite loop.\n while (moveSolutions.length > 0) {\n let nextSolutions: MoveSolution[] = [];\n\n for (let solutionIndex = 0; solutionIndex < Math.min(NUM_BEST_SOLUTIONS, moveSolutions.length); solutionIndex++) {\n const [solutionState, solutionMove] = moveSolutions[solutionIndex];\n\n // Discard the solution before performing the move if its next score is already above the best score found so far.\n if (bestSolution && solutionState.score + solutionMove.score >= bestSolution.score) {\n continue;\n }\n\n // Perform the move by mutating the solution's state: grid, moves, score, etc.\n makeMove(solutionState, solutionMove);\n\n // If no overlaps are left the solution is considered valid and the best so far.\n // The next solutions having the same or higher score will be discarded.\n if (solutionState.overlaps.size === 0) {\n bestSolution = solutionState;\n }\n // Otherwise, the next set of solutions will be considered. There can be up to four solutions per overlap\n // (by the number of possible directions to move).\n else {\n for (const nextSolution of findNextSolutions(solutionState)) {\n const solutionKey = createCacheKey(nextSolution);\n const cachedSolution = solutionsCache.get(solutionKey);\n if (!cachedSolution) {\n nextSolutions.push(nextSolution);\n solutionsCache.set(solutionKey, nextSolution);\n }\n }\n }\n }\n\n // The solutions are ordered by the total score so that the best (so far) solutions are considered first.\n moveSolutions = nextSolutions.sort((s1, s2) => s1[0].score + s1[1].score - (s2[0].score + s2[1].score));\n nextSolutions = [];\n\n // Reaching the convergence counter might indicate an issue with the algorithm as ideally it should converge faster.\n // However, that does not necessarily mean the logical problem and no exception should be thrown.\n // Instead, the current best solution if available applies or a simple solution is offered instead.\n convergenceCounter--;\n if (convergenceCounter <= 0) {\n break;\n }\n }\n\n // If there are conflicts it might not be possible to find a solution as the items are not allowed to\n // overlap with the conflicts. In that case the initial state (with the user move applied) is returned.\n // The user can move the item further to resolve the conflicts which will also unblock the overlaps resolution.\n // Also, the solution might not be found due to the engine constraints. For example, the convergence number might\n // be reached before any solution is found or the number of best solutions constraint can filter the only possible\n // solutions away. In that case the simple solution is returned with all overlapping items pushed to the bottom.\n if (!bestSolution) {\n bestSolution = initialState.conflicts ? initialState : resolveOverlapsDown(initialState);\n }\n\n // After each step unless there are conflicts the type=\"FLOAT\" moves are performed on all items\n // but the user controlled one that can be moved to the top without overlapping with other items.\n return bestSolution.conflicts ? bestSolution : refloatGrid(bestSolution, userMove);\n}\n\n// Resolves overlaps the simple way by pushing all overlapping items to the bottom until none is left.\nfunction resolveOverlapsDown(state: MoveSolutionState): MoveSolutionState {\n // Move overlapping items to the bottom until resolved. Repeat until no overlaps left.\n // This solution always converges because there is always free space at the bottom by design.\n while (state.overlaps.size > 0) {\n const overlaps = sortGridItems([...state.overlaps].map(([overlapId]) => state.grid.getItem(overlapId)));\n for (const overlap of overlaps) {\n let y = overlap.y + 1;\n while (state.grid.getOverlaps({ ...overlap, y }).length > 0) {\n y++;\n }\n makeMove(state, createMove(\"OVERLAP\", overlap, new Position({ x: overlap.x, y })));\n }\n }\n return state;\n}\n\n// Find items that can \"float\" to the top and apply the necessary moves.\nfunction refloatGrid(layoutState: LayoutEngineState, userMove?: CommittedMove): LayoutEngineState {\n const state = new MoveSolutionState(layoutState.grid, layoutState.moves, layoutState.conflicts);\n\n function makeRefloat() {\n let needAnotherRefloat = false;\n\n for (const item of state.grid.items) {\n // The active item is skipped until the operation is committed.\n if (item.id === userMove?.itemId) {\n continue;\n }\n\n let y = item.y - 1;\n let move: null | CommittedMove = null;\n while (y >= 0) {\n const moveAttempt = createMove(\"FLOAT\", item, new Position({ x: item.x, y }));\n if (state.grid.getOverlaps({ id: item.id, ...moveAttempt }).length > 0) {\n break;\n }\n y--;\n move = moveAttempt;\n }\n if (move) {\n makeMove(state, move);\n needAnotherRefloat = true;\n }\n }\n\n if (needAnotherRefloat) {\n makeRefloat();\n }\n }\n\n makeRefloat();\n\n return state;\n}\n\n// Finds items that cannot be resolved at the current step as of being partially overlapped by the user-move item.\nfunction findConflicts(\n grid: ReadonlyLayoutEngineGrid,\n previousConflicts: null | Conflicts,\n userMove: CommittedMove,\n): null | Conflicts {\n // The conflicts are only defined for MOVE command type to make swaps possible.\n if (userMove.type !== \"MOVE\") {\n return null;\n }\n // Using existing conflict direction if available so that conflicting items would swap consistently.\n // If only the current direction is considered the multi-item conflicts become difficult to comprehend.\n const direction = previousConflicts?.direction ?? userMove.direction;\n // Conflicts are partial overlaps. When the item is overlapped fully (considering the direction) it is\n // no longer treated as conflict.\n const overlaps = grid.getOverlaps({ ...userMove, id: userMove.itemId });\n const conflicts = overlaps.filter((overlap) => {\n switch (direction) {\n case \"left\":\n return overlap.x < userMove.x;\n case \"right\":\n return overlap.x + overlap.width - 1 > userMove.x + userMove.width - 1;\n case \"up\":\n return overlap.y < userMove.y;\n case \"down\":\n return overlap.y + overlap.height - 1 > userMove.y + userMove.height - 1;\n }\n });\n if (conflicts.length > 0) {\n return { direction, items: new Set(conflicts.map((item) => item.id)) };\n }\n return null;\n}\n\n// Applies given move to the solution state by updating the grid, moves, overlaps, and score.\nfunction makeMove(state: MoveSolutionState, nextMove: CommittedMove): void {\n updateGridWithMove(state, nextMove);\n updateOverlaps(state, nextMove);\n state.moves.push(nextMove);\n state.score += nextMove.score;\n}\n\nfunction updateGridWithMove({ grid }: MoveSolutionState, move: CommittedMove): void {\n switch (move.type) {\n case \"MOVE\":\n case \"OVERLAP\":\n case \"FLOAT\":\n return grid.move(move.itemId, move.x, move.y);\n case \"INSERT\":\n return grid.insert({ id: move.itemId, ...move });\n case \"REMOVE\":\n return grid.remove(move.itemId);\n case \"RESIZE\":\n return grid.resize(move.itemId, move.width, move.height);\n }\n}\n\nfunction updateOverlaps(state: MoveSolutionState, move: CommittedMove) {\n // Find and assign items that will overlap with the moved item after the move is performed\n // unless the overlapping items are considered as conflicts.\n for (const newOverlap of state.grid.getOverlaps({ ...move, id: move.itemId })) {\n if (!state.conflicts?.items.has(newOverlap.id)) {\n state.overlaps.set(newOverlap.id, move.itemId);\n }\n }\n // Remove no longer valid overlaps after the move is performed.\n for (const [overlapId, overlapIssuerId] of state.overlaps) {\n if (!checkItemsIntersection(state.grid.getItem(overlapId), state.grid.getItem(overlapIssuerId))) {\n state.overlaps.delete(overlapId);\n }\n }\n}\n"]}
1
+ {"version":3,"file":"engine-step.js","sourceRoot":"","sources":["../../../../src/internal/layout-engine/engine-step.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 { Position } from \"../utils/position\";\nimport { findNextSolutions, MoveSolution, MoveSolutionState } from \"./engine-solution\";\nimport { Conflicts, LayoutEngineState } from \"./engine-state\";\nimport { ReadonlyLayoutEngineGrid } from \"./grid\";\nimport { CommittedMove } from \"./interfaces\";\nimport { checkItemsIntersection, sortGridItems } from \"./utils\";\nimport { createMove } from \"./utils\";\n\n// The solutions can't be searched for infinitely in case the algorithm can't converge.\n// The safety counter ensures there is going to be user feedback within reasonable time.\nconst MAX_SOLUTION_DEPTH = 100;\n\n// At any given step only a few best solutions are taken to ensure faster convergence.\n// The larger the number the better chance the most optimal solution is found for the given priorities\n// at a cost of more computations made.\nconst NUM_BEST_SOLUTIONS = 5;\n\n/**\n * The function takes the current layout state (item placements from the previous steps and all moves done so far)\n * and a user command increment that describes an item transition by one cell in some direction.\n * The function finds overlapping elements and resolves all overlaps if possible (always possible when no conflicts).\n * The result in an updated state (new item placements, additional moves, and item conflicts if any).\n */\nexport function resolveOverlaps(layoutState: LayoutEngineState, userMove: CommittedMove): LayoutEngineState {\n // For better UX the layout engine is optimized for item swaps.\n // The swapping is only preferred for the user-controlled item and it can only happen when the item overlaps another\n // item past its midpoint. When the overlap is not enough, the underlying item is considered a conflict and it is not\n // allowed to move anywhere. The user command cannot be committed at this step.\n const conflicts = findConflicts(layoutState.grid, layoutState.conflicts, userMove);\n\n // The user moves are always applied as is. When the user-controlled item overlaps with other items and there is\n // no conflict, the type=\"OVERLAP\" moves are performed to settle the grid so that no items overlap with one another.\n // For this type of move multiple solutions are often available. To ensure the best result all solutions are tried\n // and a score is given to each. The solution with the minimal score wins.\n // The process stars from the initial state and the user move. The initial score and the user move score are 0.\n const initialState = new MoveSolutionState(layoutState.grid, layoutState.moves, conflicts);\n const initialSolution: MoveSolution = [initialState, userMove];\n\n // All solutions are guaranteed to have unique move sequences but different move sequences can produce the same result.\n // As it is never expected for one item to be moved over to the same location twice the combination of the item ID,\n // item position, and solution score can uniquely represent the solution.\n // For earlier moves taking a solution from the cache can prevent hundreds of subsequent computations.\n const solutionsCache = new Map<string, MoveSolution>();\n const createCacheKey = ([state, move]: MoveSolution) =>\n `${move.itemId} ${move.x}:${move.y}:${state.score + move.score}`;\n\n let moveSolutions: MoveSolution[] = [initialSolution];\n let bestSolution: null | MoveSolutionState = null;\n let convergenceCounter = MAX_SOLUTION_DEPTH;\n\n // The resolution process continues until there is at least one reasonable solution left.\n // The repetitive, dead-end, and expensive (compared to the best so far) solutions are excluded\n // so that eventually no more variants to try remain.\n // The convergence safety counter ensures the logical errors to not cause an infinite loop.\n while (moveSolutions.length > 0) {\n let nextSolutions: MoveSolution[] = [];\n\n for (let solutionIndex = 0; solutionIndex < Math.min(NUM_BEST_SOLUTIONS, moveSolutions.length); solutionIndex++) {\n const [solutionState, solutionMove] = moveSolutions[solutionIndex];\n\n // Discard the solution before performing the move if its next score is already above the best score found so far.\n if (bestSolution && solutionState.score + solutionMove.score >= bestSolution.score) {\n continue;\n }\n\n // Perform the move by mutating the solution's state: grid, moves, score, etc.\n makeMove(solutionState, solutionMove);\n\n // If no overlaps are left the solution is considered valid and the best so far.\n // The next solutions having the same or higher score will be discarded.\n if (solutionState.overlaps.size === 0) {\n bestSolution = solutionState;\n }\n // Otherwise, the next set of solutions will be considered. There can be up to four solutions per overlap\n // (by the number of possible directions to move).\n else {\n for (const nextSolution of findNextSolutions(solutionState)) {\n const solutionKey = createCacheKey(nextSolution);\n const cachedSolution = solutionsCache.get(solutionKey);\n if (!cachedSolution) {\n nextSolutions.push(nextSolution);\n solutionsCache.set(solutionKey, nextSolution);\n }\n }\n }\n }\n\n // The solutions are ordered by the total score so that the best (so far) solutions are considered first.\n moveSolutions = nextSolutions.sort((s1, s2) => s1[0].score + s1[1].score - (s2[0].score + s2[1].score));\n nextSolutions = [];\n\n // Reaching the convergence counter might indicate an issue with the algorithm as ideally it should converge faster.\n // However, that does not necessarily mean the logical problem and no exception should be thrown.\n // Instead, the current best solution if available applies or a simple solution is offered instead.\n convergenceCounter--;\n if (convergenceCounter <= 0) {\n break;\n }\n }\n\n // If there are conflicts it might not be possible to find a solution as the items are not allowed to\n // overlap with the conflicts. In that case the initial state (with the user move applied) is returned.\n // The user can move the item further to resolve the conflicts which will also unblock the overlaps resolution.\n // Also, the solution might not be found due to the engine constraints. For example, the convergence number might\n // be reached before any solution is found or the number of best solutions constraint can filter the only possible\n // solutions away. In that case the simple solution is returned with all overlapping items pushed to the bottom.\n if (!bestSolution) {\n bestSolution = initialState.conflicts ? initialState : resolveOverlapsDown(initialState);\n }\n\n // After each step unless there are conflicts the type=\"FLOAT\" moves are performed on all items\n // but the user controlled one that can be moved to the top without overlapping with other items.\n return bestSolution.conflicts ? bestSolution : refloatGrid(bestSolution, userMove);\n}\n\n// Resolves overlaps the simple way by pushing all overlapping items to the bottom until none is left.\nfunction resolveOverlapsDown(state: MoveSolutionState): MoveSolutionState {\n // Move overlapping items to the bottom until resolved. Repeat until no overlaps left.\n // This solution always converges because there is always free space at the bottom by design.\n while (state.overlaps.size > 0) {\n const overlaps = sortGridItems([...state.overlaps].map(([overlapId]) => state.grid.getItem(overlapId)));\n for (const overlap of overlaps) {\n let y = overlap.y + 1;\n while (state.grid.getOverlaps({ ...overlap, y }).length > 0) {\n y++;\n }\n makeMove(state, createMove(\"OVERLAP\", overlap, new Position({ x: overlap.x, y })));\n }\n }\n return state;\n}\n\n// Find items that can \"float\" to the top and apply the necessary moves.\nfunction refloatGrid(layoutState: LayoutEngineState, userMove?: CommittedMove): LayoutEngineState {\n const state = new MoveSolutionState(layoutState.grid, layoutState.moves, layoutState.conflicts);\n\n function makeRefloat() {\n let needAnotherRefloat = false;\n\n for (const item of state.grid.items) {\n // The active item is skipped until the operation is committed.\n if (item.id === userMove?.itemId) {\n continue;\n }\n\n let y = item.y - 1;\n let move: null | CommittedMove = null;\n while (y >= 0) {\n const moveAttempt = createMove(\"FLOAT\", item, new Position({ x: item.x, y }));\n if (state.grid.getOverlaps({ id: item.id, ...moveAttempt }).length > 0) {\n break;\n }\n y--;\n move = moveAttempt;\n }\n if (move) {\n makeMove(state, move);\n needAnotherRefloat = true;\n }\n }\n\n if (needAnotherRefloat) {\n makeRefloat();\n }\n }\n\n makeRefloat();\n\n return state;\n}\n\n// Finds items that cannot be resolved at the current step as of being partially overlapped by the user-move item.\nfunction findConflicts(\n grid: ReadonlyLayoutEngineGrid,\n previousConflicts: null | Conflicts,\n userMove: CommittedMove,\n): null | Conflicts {\n // The conflicts are only defined for MOVE command type to make swaps possible.\n if (userMove.type !== \"MOVE\") {\n return null;\n }\n // Using existing conflict direction if available so that conflicting items would swap consistently.\n // If only the current direction is considered the multi-item conflicts become difficult to comprehend.\n const direction = previousConflicts?.direction ?? userMove.direction;\n // Conflicts are partial overlaps. When the item is overlapped fully (considering the direction) it is\n // no longer treated as conflict.\n const overlaps = grid.getOverlaps({ ...userMove, id: userMove.itemId });\n const conflicts = overlaps.filter((overlap) => {\n switch (direction) {\n case \"left\":\n return overlap.x < userMove.x;\n case \"right\":\n return overlap.x + overlap.width - 1 > userMove.x + userMove.width - 1;\n case \"up\":\n return overlap.y < userMove.y;\n case \"down\":\n return overlap.y + overlap.height - 1 > userMove.y + userMove.height - 1;\n }\n });\n if (conflicts.length > 0) {\n return { direction, items: new Set(conflicts.map((item) => item.id)) };\n }\n return null;\n}\n\n// Applies given move to the solution state by updating the grid, moves, overlaps, and score.\nfunction makeMove(state: MoveSolutionState, nextMove: CommittedMove): void {\n updateGridWithMove(state, nextMove);\n updateOverlaps(state, nextMove);\n state.moves.push(nextMove);\n state.score += nextMove.score;\n}\n\nfunction updateGridWithMove({ grid }: MoveSolutionState, move: CommittedMove): void {\n switch (move.type) {\n case \"MOVE\":\n case \"OVERLAP\":\n case \"FLOAT\":\n return grid.move(move.itemId, move.x, move.y);\n case \"INSERT\":\n return grid.insert({ id: move.itemId, ...move });\n case \"REMOVE\":\n return grid.remove(move.itemId);\n case \"RESIZE\":\n return grid.resize(move.itemId, move.width, move.height);\n }\n}\n\nfunction updateOverlaps(state: MoveSolutionState, move: CommittedMove) {\n // Find and assign items that will overlap with the moved item after the move is performed\n // unless the overlapping items are considered as conflicts.\n for (const newOverlap of state.grid.getOverlaps({ ...move, id: move.itemId })) {\n if (!state.conflicts?.items.has(newOverlap.id)) {\n state.overlaps.set(newOverlap.id, move.itemId);\n }\n }\n // Remove no longer valid overlaps after the move is performed.\n for (const [overlapId, overlapIssuerId] of state.overlaps) {\n if (!checkItemsIntersection(state.grid.getItem(overlapId), state.grid.getItem(overlapIssuerId))) {\n state.overlaps.delete(overlapId);\n }\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/live-region/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,gBAA2C,MAAM,sBAAsB,CAAC;AAW/E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,eAAe,IAAI,CAAC,UAAU,CAAC,CAAC;AAEhC,SAAS,UAAU,CAAC,EAAE,SAAS,GAAG,KAAK,EAAE,KAAK,GAAG,EAAE,EAAE,OAAO,GAAG,KAAK,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAmB;IAC7G,MAAM,SAAS,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAC;IAChD,MAAM,SAAS,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAC;IAEhD;;;;;;;;MAQE;IACF,SAAS,CAAC,GAAG,EAAE;QACb,SAAS,gBAAgB;YACvB,IAAI,SAAS,CAAC,OAAO,IAAI,SAAS,CAAC,OAAO,EAAE;gBAC1C,MAAM,aAAa,GAAG,gBAAgB,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;gBAC1D,MAAM,aAAa,GAAG,gBAAgB,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;gBAC1D,IAAI,aAAa,KAAK,aAAa,EAAE;oBACnC,gEAAgE;oBAChE,2DAA2D;oBAC3D,sDAAsD;oBACtD,SAAS,CAAC,OAAO,CAAC,SAAS,GAAG,aAAa,CAAC;iBAC7C;aACF;QACH,CAAC;QAED,IAAI,SAA+C,CAAC;QACpD,IAAI,KAAK,EAAE;YACT,SAAS,GAAG,UAAU,CAAC,gBAAgB,EAAE,KAAK,CAAC,CAAC;SACjD;aAAM;YACL,gBAAgB,EAAE,CAAC;SACpB;QAED,OAAO,GAAG,EAAE;YACV,IAAI,SAAS,EAAE;gBACb,YAAY,CAAC,SAAS,CAAC,CAAC;aACzB;QACH,CAAC,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,OAAO,CACL,8BACG,OAAO,IAAI,eAAM,GAAG,EAAE,SAAS,YAAG,QAAQ,GAAQ,EAEnD,MAAC,gBAAgB,OAAK,SAAS,EAAE,SAAS,EAAE,SAAS,CAAC,SAAS,aAC5D,CAAC,OAAO,IAAI,CACX,eAAM,GAAG,EAAE,SAAS,iBAAc,MAAM,YACrC,QAAQ,GACJ,CACR,EAED,eAAM,GAAG,EAAE,SAAS,iBAAc,MAAM,eAAY,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,QAAQ,GAAS,IAC9E,IAClB,CACJ,CAAC;AACJ,CAAC;AAED,oGAAoG;AACpG,oGAAoG;AACpG,0FAA0F;AAC1F,SAAS,gBAAgB,CAAC,IAAiB;IACzC,OAAO,CAAC,IAAI,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC;AAC5D,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { memo, useEffect, useRef } from \"react\";\nimport ScreenreaderOnly, { ScreenreaderOnlyProps } from \"../screenreader-only\";\n\n// The code is copied from https://github.com/cloudscape-design/components/blob/main/src/internal/components/live-region/index.tsx\n\nexport interface LiveRegionProps extends ScreenreaderOnlyProps {\n assertive?: boolean;\n delay?: number;\n visible?: boolean;\n children: React.ReactNode;\n}\n\n/**\n * The live region is hidden in the layout, but visible for screen readers.\n * It's purpose it to announce changes e.g. when custom navigation logic is used.\n *\n * The way live region works differently in different browsers and screen readers and\n * it is recommended to manually test every new implementation.\n *\n * If you notice there are different words being merged together,\n * check if there are text nodes not being wrapped in elements, like:\n * <LiveRegion>\n * {title}\n * <span><Details /></span>\n * </LiveRegion>\n *\n * To fix, wrap \"title\" in an element:\n * <LiveRegion>\n * <span>{title}</span>\n * <span><Details /></span>\n * </LiveRegion>\n *\n * Or create a single text node if possible:\n * <LiveRegion>\n * {`${title} ${details}`}\n * </LiveRegion>\n *\n * The live region is always atomic, because non-atomic regions can be treated by screen readers\n * differently and produce unexpected results. To imitate non-atomic announcements simply use\n * multiple live regions:\n * <>\n * <LiveRegion>{title}</LiveRegion>\n * <LiveRegion><Details /></LiveRegion>\n * </>\n */\nexport default memo(LiveRegion);\n\nfunction LiveRegion({ assertive = false, delay = 10, visible = false, children, ...restProps }: LiveRegionProps) {\n const sourceRef = useRef<HTMLSpanElement>(null);\n const targetRef = useRef<HTMLSpanElement>(null);\n\n /*\n When React state changes, React often produces too many DOM updates, causing NVDA to\n issue many announcements for the same logical event (See https://github.com/nvaccess/nvda/issues/7996).\n The code below imitates a debouncing, scheduling a callback every time new React state\n update is detected. When a callback resolves, it copies content from a muted element\n to the live region, which is recognized by screen readers as an update.\n If the use case requires no announcement to be ignored, use delay = 0, but ensure it\n does not impact the performance. If it does, prefer using a string as children prop.\n */\n useEffect(() => {\n function updateLiveRegion() {\n if (targetRef.current && sourceRef.current) {\n const sourceContent = extractInnerText(sourceRef.current);\n const targetContent = extractInnerText(targetRef.current);\n if (targetContent !== sourceContent) {\n // The aria-atomic does not work properly in Voice Over, causing\n // certain parts of the content to be ignored. To fix that,\n // we assign the source text content as a single node.\n targetRef.current.innerText = sourceContent;\n }\n }\n }\n\n let timeoutId: null | ReturnType<typeof setTimeout>;\n if (delay) {\n timeoutId = setTimeout(updateLiveRegion, delay);\n } else {\n updateLiveRegion();\n }\n\n return () => {\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n };\n });\n\n return (\n <>\n {visible && <span ref={sourceRef}>{children}</span>}\n\n <ScreenreaderOnly {...restProps} className={restProps.className}>\n {!visible && (\n <span ref={sourceRef} aria-hidden=\"true\">\n {children}\n </span>\n )}\n\n <span ref={targetRef} aria-atomic=\"true\" aria-live={assertive ? \"assertive\" : \"polite\"}></span>\n </ScreenreaderOnly>\n </>\n );\n}\n\n// This only extracts text content from the node including all its children which is enough for now.\n// To make it more powerful, it is possible to create a more sophisticated extractor with respect to\n// ARIA properties to ignore aria-hidden nodes and read ARIA labels from the live content.\nfunction extractInnerText(node: HTMLElement) {\n return (node.innerText || \"\").replace(/\\s+/g, \" \").trim();\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/live-region/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEhD,OAAO,gBAA2C,MAAM,sBAAsB,CAAC;AAW/E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,eAAe,IAAI,CAAC,UAAU,CAAC,CAAC;AAEhC,SAAS,UAAU,CAAC,EAAE,SAAS,GAAG,KAAK,EAAE,KAAK,GAAG,EAAE,EAAE,OAAO,GAAG,KAAK,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAmB;IAC7G,MAAM,SAAS,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAC;IAChD,MAAM,SAAS,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAC;IAEhD;;;;;;;;MAQE;IACF,SAAS,CAAC,GAAG,EAAE;QACb,SAAS,gBAAgB;YACvB,IAAI,SAAS,CAAC,OAAO,IAAI,SAAS,CAAC,OAAO,EAAE;gBAC1C,MAAM,aAAa,GAAG,gBAAgB,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;gBAC1D,MAAM,aAAa,GAAG,gBAAgB,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;gBAC1D,IAAI,aAAa,KAAK,aAAa,EAAE;oBACnC,gEAAgE;oBAChE,2DAA2D;oBAC3D,sDAAsD;oBACtD,SAAS,CAAC,OAAO,CAAC,SAAS,GAAG,aAAa,CAAC;iBAC7C;aACF;QACH,CAAC;QAED,IAAI,SAA+C,CAAC;QACpD,IAAI,KAAK,EAAE;YACT,SAAS,GAAG,UAAU,CAAC,gBAAgB,EAAE,KAAK,CAAC,CAAC;SACjD;aAAM;YACL,gBAAgB,EAAE,CAAC;SACpB;QAED,OAAO,GAAG,EAAE;YACV,IAAI,SAAS,EAAE;gBACb,YAAY,CAAC,SAAS,CAAC,CAAC;aACzB;QACH,CAAC,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,OAAO,CACL,8BACG,OAAO,IAAI,eAAM,GAAG,EAAE,SAAS,YAAG,QAAQ,GAAQ,EAEnD,MAAC,gBAAgB,OAAK,SAAS,EAAE,SAAS,EAAE,SAAS,CAAC,SAAS,aAC5D,CAAC,OAAO,IAAI,CACX,eAAM,GAAG,EAAE,SAAS,iBAAc,MAAM,YACrC,QAAQ,GACJ,CACR,EAED,eAAM,GAAG,EAAE,SAAS,iBAAc,MAAM,eAAY,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,QAAQ,GAAS,IAC9E,IAClB,CACJ,CAAC;AACJ,CAAC;AAED,oGAAoG;AACpG,oGAAoG;AACpG,0FAA0F;AAC1F,SAAS,gBAAgB,CAAC,IAAiB;IACzC,OAAO,CAAC,IAAI,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC;AAC5D,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { memo, useEffect, useRef } from \"react\";\n\nimport ScreenreaderOnly, { ScreenreaderOnlyProps } from \"../screenreader-only\";\n\n// The code is copied from https://github.com/cloudscape-design/components/blob/main/src/internal/components/live-region/index.tsx\n\nexport interface LiveRegionProps extends ScreenreaderOnlyProps {\n assertive?: boolean;\n delay?: number;\n visible?: boolean;\n children: React.ReactNode;\n}\n\n/**\n * The live region is hidden in the layout, but visible for screen readers.\n * It's purpose it to announce changes e.g. when custom navigation logic is used.\n *\n * The way live region works differently in different browsers and screen readers and\n * it is recommended to manually test every new implementation.\n *\n * If you notice there are different words being merged together,\n * check if there are text nodes not being wrapped in elements, like:\n * <LiveRegion>\n * {title}\n * <span><Details /></span>\n * </LiveRegion>\n *\n * To fix, wrap \"title\" in an element:\n * <LiveRegion>\n * <span>{title}</span>\n * <span><Details /></span>\n * </LiveRegion>\n *\n * Or create a single text node if possible:\n * <LiveRegion>\n * {`${title} ${details}`}\n * </LiveRegion>\n *\n * The live region is always atomic, because non-atomic regions can be treated by screen readers\n * differently and produce unexpected results. To imitate non-atomic announcements simply use\n * multiple live regions:\n * <>\n * <LiveRegion>{title}</LiveRegion>\n * <LiveRegion><Details /></LiveRegion>\n * </>\n */\nexport default memo(LiveRegion);\n\nfunction LiveRegion({ assertive = false, delay = 10, visible = false, children, ...restProps }: LiveRegionProps) {\n const sourceRef = useRef<HTMLSpanElement>(null);\n const targetRef = useRef<HTMLSpanElement>(null);\n\n /*\n When React state changes, React often produces too many DOM updates, causing NVDA to\n issue many announcements for the same logical event (See https://github.com/nvaccess/nvda/issues/7996).\n The code below imitates a debouncing, scheduling a callback every time new React state\n update is detected. When a callback resolves, it copies content from a muted element\n to the live region, which is recognized by screen readers as an update.\n If the use case requires no announcement to be ignored, use delay = 0, but ensure it\n does not impact the performance. If it does, prefer using a string as children prop.\n */\n useEffect(() => {\n function updateLiveRegion() {\n if (targetRef.current && sourceRef.current) {\n const sourceContent = extractInnerText(sourceRef.current);\n const targetContent = extractInnerText(targetRef.current);\n if (targetContent !== sourceContent) {\n // The aria-atomic does not work properly in Voice Over, causing\n // certain parts of the content to be ignored. To fix that,\n // we assign the source text content as a single node.\n targetRef.current.innerText = sourceContent;\n }\n }\n }\n\n let timeoutId: null | ReturnType<typeof setTimeout>;\n if (delay) {\n timeoutId = setTimeout(updateLiveRegion, delay);\n } else {\n updateLiveRegion();\n }\n\n return () => {\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n };\n });\n\n return (\n <>\n {visible && <span ref={sourceRef}>{children}</span>}\n\n <ScreenreaderOnly {...restProps} className={restProps.className}>\n {!visible && (\n <span ref={sourceRef} aria-hidden=\"true\">\n {children}\n </span>\n )}\n\n <span ref={targetRef} aria-atomic=\"true\" aria-live={assertive ? \"assertive\" : \"polite\"}></span>\n </ScreenreaderOnly>\n </>\n );\n}\n\n// This only extracts text content from the node including all its children which is enough for now.\n// To make it more powerful, it is possible to create a more sophisticated extractor with respect to\n// ARIA properties to ignore aria-hidden nodes and read ARIA labels from the live content.\nfunction extractInnerText(node: HTMLElement) {\n return (node.innerText || \"\").replace(/\\s+/g, \" \").trim();\n}\n"]}
@@ -1,3 +1,3 @@
1
1
  {
2
- "commit": "bd7f894fb0abe3feb2451f7160fdfeaaa7e341da"
2
+ "commit": "5456d842666ee8e889c08db7d351a449102e86c6"
3
3
  }
@@ -1,8 +1,6 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
- // SPDX-License-Identifier: Apache-2.0
4
- import Icon from "@cloudscape-design/components/icon";
5
2
  import clsx from "clsx";
3
+ import Icon from "@cloudscape-design/components/icon";
6
4
  import Handle from "../handle";
7
5
  import styles from "./styles.css.js";
8
6
  export default function ResizeHandle({ ariaLabelledBy, ariaDescribedBy, onPointerDown, onKeyDown, isActive, }) {
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/resize-handle/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,oCAAoC,CAAC;AACtD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAUrC,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,cAAc,EACd,eAAe,EACf,aAAa,EACb,SAAS,EACT,QAAQ,GACU;IAClB,OAAO,CACL,KAAC,MAAM,IACL,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,QAAQ,IAAI,MAAM,CAAC,MAAM,CAAC,qBACxC,cAAc,sBACb,eAAe,EACjC,aAAa,EAAE,aAAa,EAC5B,SAAS,EAAE,SAAS,YAEpB,KAAC,IAAI,IAAC,IAAI,EAAC,aAAa,GAAG,GACpB,CACV,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport Icon from \"@cloudscape-design/components/icon\";\nimport clsx from \"clsx\";\nimport { KeyboardEvent, PointerEvent } from \"react\";\nimport Handle from \"../handle\";\nimport styles from \"./styles.css.js\";\n\nexport interface ResizeHandleProps {\n ariaLabelledBy: string;\n ariaDescribedBy: string;\n onPointerDown: (event: PointerEvent) => void;\n onKeyDown: (event: KeyboardEvent) => void;\n isActive: boolean;\n}\n\nexport default function ResizeHandle({\n ariaLabelledBy,\n ariaDescribedBy,\n onPointerDown,\n onKeyDown,\n isActive,\n}: ResizeHandleProps) {\n return (\n <Handle\n className={clsx(styles.handle, isActive && styles.active)}\n aria-labelledby={ariaLabelledBy}\n aria-describedby={ariaDescribedBy}\n onPointerDown={onPointerDown}\n onKeyDown={onKeyDown}\n >\n <Icon name=\"resize-area\" />\n </Handle>\n );\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/resize-handle/index.tsx"],"names":[],"mappings":";AAGA,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,IAAI,MAAM,oCAAoC,CAAC;AAEtD,OAAO,MAAM,MAAM,WAAW,CAAC;AAE/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAUrC,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,cAAc,EACd,eAAe,EACf,aAAa,EACb,SAAS,EACT,QAAQ,GACU;IAClB,OAAO,CACL,KAAC,MAAM,IACL,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,QAAQ,IAAI,MAAM,CAAC,MAAM,CAAC,qBACxC,cAAc,sBACb,eAAe,EACjC,aAAa,EAAE,aAAa,EAC5B,SAAS,EAAE,SAAS,YAEpB,KAAC,IAAI,IAAC,IAAI,EAAC,aAAa,GAAG,GACpB,CACV,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { KeyboardEvent, PointerEvent } from \"react\";\nimport clsx from \"clsx\";\n\nimport Icon from \"@cloudscape-design/components/icon\";\n\nimport Handle from \"../handle\";\n\nimport styles from \"./styles.css.js\";\n\nexport interface ResizeHandleProps {\n ariaLabelledBy: string;\n ariaDescribedBy: string;\n onPointerDown: (event: PointerEvent) => void;\n onKeyDown: (event: KeyboardEvent) => void;\n isActive: boolean;\n}\n\nexport default function ResizeHandle({\n ariaLabelledBy,\n ariaDescribedBy,\n onPointerDown,\n onKeyDown,\n isActive,\n}: ResizeHandleProps) {\n return (\n <Handle\n className={clsx(styles.handle, isActive && styles.active)}\n aria-labelledby={ariaLabelledBy}\n aria-describedby={ariaDescribedBy}\n onPointerDown={onPointerDown}\n onKeyDown={onKeyDown}\n >\n <Icon name=\"resize-area\" />\n </Handle>\n );\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/screenreader-only/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,wIAAwI;AAExI,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAQrC;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,KAA4B;IACnE,OAAO,kBAAU,KAAK,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC,GAAI,CAAC;AAC5E,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\n// The code is copied from https://github.com/cloudscape-design/components/blob/main/src/internal/components/screenreader-only/index.tsx\n\nimport clsx from \"clsx\";\nimport styles from \"./styles.css.js\";\n\nexport interface ScreenreaderOnlyProps {\n id?: string;\n className?: string;\n children: React.ReactNode;\n}\n\n/**\n * Makes content now shown on a screen but still announced by screen-reader users.\n * The component is suitable when the aria-label cannot be used, e.g. to avoid elements being announced as \"blank\".\n *\n * To exclude screenreader-only content use `:not(.${screenreaderOnlyStyles.root})` selector, for example:\n *\n * ```\n * import screenreaderOnlyStyles from '~internal/components/screenreader-only/styles.css.js'\n *\n * let visibleContent = wrapper.find(`${styles.label}`).find(`:not(.${screenreaderOnlyStyles.root})`).getElement().textContent\n *\n * let screenreaderContent = wrapper.find(`${styles.label}`).find(`.${screenreaderOnlyStyles.root}`).getElement().textContent\n * ```\n */\nexport default function ScreenreaderOnly(props: ScreenreaderOnlyProps) {\n return <span {...props} className={clsx(styles.root, props.className)} />;\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/screenreader-only/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,wIAAwI;AAExI,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAQrC;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,KAA4B;IACnE,OAAO,kBAAU,KAAK,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC,GAAI,CAAC;AAC5E,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\n// The code is copied from https://github.com/cloudscape-design/components/blob/main/src/internal/components/screenreader-only/index.tsx\n\nimport clsx from \"clsx\";\n\nimport styles from \"./styles.css.js\";\n\nexport interface ScreenreaderOnlyProps {\n id?: string;\n className?: string;\n children: React.ReactNode;\n}\n\n/**\n * Makes content now shown on a screen but still announced by screen-reader users.\n * The component is suitable when the aria-label cannot be used, e.g. to avoid elements being announced as \"blank\".\n *\n * To exclude screenreader-only content use `:not(.${screenreaderOnlyStyles.root})` selector, for example:\n *\n * ```\n * import screenreaderOnlyStyles from '~internal/components/screenreader-only/styles.css.js'\n *\n * let visibleContent = wrapper.find(`${styles.label}`).find(`:not(.${screenreaderOnlyStyles.root})`).getElement().textContent\n *\n * let screenreaderContent = wrapper.find(`${styles.label}`).find(`.${screenreaderOnlyStyles.root}`).getElement().textContent\n * ```\n */\nexport default function ScreenreaderOnly(props: ScreenreaderOnlyProps) {\n return <span {...props} className={clsx(styles.root, props.className)} />;\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"coordinates.js","sourceRoot":"","sources":["../../../../src/internal/utils/coordinates.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAGlF,MAAM,OAAO,WAAW;IAOtB,MAAM,CAAC,SAAS,CAAC,KAAgD,EAAE,EAAE,KAAK,EAAsB;QAC9F,MAAM,OAAO,GAAG,iBAAiB,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;QAChD,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC;QAC9B,OAAO,IAAI,WAAW,CAAC,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC;IACrD,CAAC;IAED,MAAM,CAAC,YAAY,CAAC,OAAoB,EAAE,KAAkB;QAC1D,OAAO,IAAI,WAAW,CAAC;YACrB,CAAC,EAAE,OAAO,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC;YAC1D,CAAC,EAAE,OAAO,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC;SAC3D,CAAC,CAAC;IACL,CAAC;IAED,YAAY,EAAE,CAAC,EAAE,CAAC,EAA4B;QAnBrC,WAAM,GAAG,aAAa,CAAC;QAGvB,YAAO,GAAG,MAAM,CAAC,OAAO,CAAC;QACzB,YAAO,GAAG,MAAM,CAAC,OAAO,CAAC;QAgBhC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;QACX,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;IACb,CAAC;CACF","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { getLogicalClientX } from \"@cloudscape-design/component-toolkit/internal\";\nimport { PointerEvent as ReactPointerEvent } from \"react\";\n\nexport class Coordinates {\n readonly __type = \"Coordinates\";\n readonly x: number;\n readonly y: number;\n readonly scrollX = window.scrollX;\n readonly scrollY = window.scrollY;\n\n static fromEvent(event: PointerEvent | ReactPointerEvent<unknown>, { isRtl }: { isRtl: boolean }): Coordinates {\n const clientX = getLogicalClientX(event, isRtl);\n const clientY = event.clientY;\n return new Coordinates({ x: clientX, y: clientY });\n }\n\n static cursorOffset(current: Coordinates, start: Coordinates): Coordinates {\n return new Coordinates({\n x: current.x - start.x + (current.scrollX - start.scrollX),\n y: current.y - start.y + (current.scrollY - start.scrollY),\n });\n }\n\n constructor({ x, y }: { x: number; y: number }) {\n this.x = x;\n this.y = y;\n }\n}\n"]}
1
+ {"version":3,"file":"coordinates.js","sourceRoot":"","sources":["../../../../src/internal/utils/coordinates.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAItC,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAElF,MAAM,OAAO,WAAW;IAOtB,MAAM,CAAC,SAAS,CAAC,KAAgD,EAAE,EAAE,KAAK,EAAsB;QAC9F,MAAM,OAAO,GAAG,iBAAiB,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;QAChD,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC;QAC9B,OAAO,IAAI,WAAW,CAAC,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC;IACrD,CAAC;IAED,MAAM,CAAC,YAAY,CAAC,OAAoB,EAAE,KAAkB;QAC1D,OAAO,IAAI,WAAW,CAAC;YACrB,CAAC,EAAE,OAAO,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC;YAC1D,CAAC,EAAE,OAAO,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC;SAC3D,CAAC,CAAC;IACL,CAAC;IAED,YAAY,EAAE,CAAC,EAAE,CAAC,EAA4B;QAnBrC,WAAM,GAAG,aAAa,CAAC;QAGvB,YAAO,GAAG,MAAM,CAAC,OAAO,CAAC;QACzB,YAAO,GAAG,MAAM,CAAC,OAAO,CAAC;QAgBhC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;QACX,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;IACb,CAAC;CACF","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { PointerEvent as ReactPointerEvent } from \"react\";\n\nimport { getLogicalClientX } from \"@cloudscape-design/component-toolkit/internal\";\n\nexport class Coordinates {\n readonly __type = \"Coordinates\";\n readonly x: number;\n readonly y: number;\n readonly scrollX = window.scrollX;\n readonly scrollY = window.scrollY;\n\n static fromEvent(event: PointerEvent | ReactPointerEvent<unknown>, { isRtl }: { isRtl: boolean }): Coordinates {\n const clientX = getLogicalClientX(event, isRtl);\n const clientY = event.clientY;\n return new Coordinates({ x: clientX, y: clientY });\n }\n\n static cursorOffset(current: Coordinates, start: Coordinates): Coordinates {\n return new Coordinates({\n x: current.x - start.x + (current.scrollX - start.scrollX),\n y: current.y - start.y + (current.scrollY - start.scrollY),\n });\n }\n\n constructor({ x, y }: { x: number; y: number }) {\n this.x = x;\n this.y = y;\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"use-auto-scroll.js","sourceRoot":"","sources":["../../../../src/internal/utils/use-auto-scroll.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAE5D,MAAM,UAAU,aAAa;IAC3B,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAyB,MAAM,CAAC,CAAC;IACzF,MAAM,sBAAsB,GAAG,MAAM,CAAuC,IAAI,CAAC,CAAC;IAClF,MAAM,kBAAkB,GAAG,kBAAkB,EAAE,CAAC;IAEhD,gFAAgF;IAChF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,gBAAgB,KAAK,MAAM,EAAE;YAC/B,OAAO;SACR;QACD,MAAM,SAAS,GAAG,gBAAgB,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAErD,IAAI,KAAoC,CAAC;QAEzC,SAAS,UAAU;YACjB,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE;gBACtB,MAAM,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,SAAS,GAAG,CAAC,EAAE,CAAC,CAAC;gBACxC,UAAU,EAAE,CAAC;YACf,CAAC,EAAE,EAAE,CAAC,CAAC;QACT,CAAC;QACD,UAAU,EAAE,CAAC;QAEb,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,MAAM,aAAa,GAAG,WAAW,CAAC,CAAC,KAAmB,EAAE,EAAE;QACxD,MAAM,gBAAgB,GAAG,EAAE,CAAC;QAC5B,IAAI,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC,WAAW,GAAG,gBAAgB,EAAE;YACzD,mBAAmB,CAAC,MAAM,CAAC,CAAC;SAC7B;aAAM,IAAI,KAAK,CAAC,OAAO,GAAG,gBAAgB,EAAE;YAC3C,mBAAmB,CAAC,IAAI,CAAC,CAAC;SAC3B;aAAM;YACL,mBAAmB,CAAC,MAAM,CAAC,CAAC;SAC7B;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE;QACnC,mBAAmB,CAAC,MAAM,CAAC,CAAC;IAC9B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,uBAAuB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC/C,IAAI,kBAAkB,EAAE,KAAK,SAAS,EAAE;YACtC,MAAM,CAAC,gBAAgB,CAAC,aAAa,EAAE,aAAa,CAAC,CAAC;YACtD,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;SACnD;IACH,CAAC,EAAE,CAAC,kBAAkB,EAAE,aAAa,EAAE,WAAW,CAAC,CAAC,CAAC;IAErD,MAAM,0BAA0B,GAAG,WAAW,CAAC,GAAG,EAAE;QAClD,MAAM,CAAC,mBAAmB,CAAC,aAAa,EAAE,aAAa,CAAC,CAAC;QACzD,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;IACvD,CAAC,EAAE,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC,CAAC;IAEjC,MAAM,mCAAmC,GAAG,WAAW,CACrD,CAAC,KAAa,EAAE,EAAE;QAChB,sBAAsB,CAAC,OAAO,IAAI,YAAY,CAAC,sBAAsB,CAAC,OAAO,CAAC,CAAC;QAE/E,MAAM,wBAAwB,GAAG,QAAQ,CAAC,aAAa,CAAC;QAExD,sBAAsB,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;;YAC/C,IACE,QAAQ,CAAC,aAAa;gBACtB,QAAQ,CAAC,aAAa,KAAK,wBAAwB;gBACnD,kBAAkB,EAAE,KAAK,UAAU,EACnC;gBACA,MAAA,MAAA,QAAQ,CAAC,aAAa,EAAC,cAAc,mDAAG,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;aACnF;QACH,CAAC,EAAE,KAAK,CAAC,CAAC;IACZ,CAAC,EACD,CAAC,kBAAkB,CAAC,CACrB,CAAC;IAEF,OAAO,EAAE,uBAAuB,EAAE,0BAA0B,EAAE,mCAAmC,EAAE,CAAC;AACtG,CAAC","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"]}
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\";\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"]}
@@ -1,9 +1,9 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
3
  // SPDX-License-Identifier: Apache-2.0
4
+ import { useRef, useState } from "react";
4
5
  import { getIsRtl } from "@cloudscape-design/component-toolkit/internal";
5
6
  import SpaceBetween from "@cloudscape-design/components/space-between";
6
- import { useRef, useState } from "react";
7
7
  import { getDataAttributes } from "../internal/base-component/get-data-attributes";
8
8
  import { useDragSubscription } from "../internal/dnd-controller/controller";
9
9
  import { ItemContainer } from "../internal/item-container";
@@ -1 +1 @@
1
- {"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 { 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 { 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 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"]}
1
+ {"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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cloudscape-design/board-components",
3
- "version": "3.0.68",
3
+ "version": "3.0.69",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "https://github.com/cloudscape-design/board-components.git"
@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
4
4
  // SPDX-License-Identifier: Apache-2.0
5
5
  const dom_1 = require("@cloudscape-design/test-utils-core/dom");
6
- const styles_selectors_js_1 = require("../../../board/styles.selectors.js");
7
6
  const board_item_1 = require("../board-item");
7
+ const styles_selectors_js_1 = require("../../../board/styles.selectors.js");
8
8
  class BoardWrapper extends dom_1.ComponentWrapper {
9
9
  findItemById(itemId) {
10
10
  return (0, dom_1.createWrapper)().findComponent(`[data-item-id="${itemId}"]`, board_item_1.default);
@@ -1 +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"}
1
+ {"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"}
@@ -1 +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"}
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;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"}