@cloudscape-design/board-components 3.0.60 → 3.0.61

package/internal/drag-handle/styles.css.js

@@ -1,7 +1,7 @@
 
     import './styles.scoped.css';
     export default {
-  "handle": "awsui_handle_umbhe_1bn34_1",
-  "active": "awsui_active_umbhe_1bn34_9"
+  "handle": "awsui_handle_umbhe_1vpmb_1",
+  "active": "awsui_active_umbhe_1vpmb_9"
 };
   

package/internal/drag-handle/styles.scoped.css

@@ -1,30 +1,30 @@
-.awsui_handle_umbhe_1bn34_1:not(#\9) {
+.awsui_handle_umbhe_1vpmb_1:not(#\9) {
   cursor: grab;
 }
 
-.awsui_handle_umbhe_1bn34_1:not(#\9):active {
+.awsui_handle_umbhe_1vpmb_1:not(#\9):active {
   cursor: grabbing;
 }
 
-.awsui_handle_umbhe_1bn34_1:not(#\9):not(.awsui_active_umbhe_1bn34_9):focus-visible {
+.awsui_handle_umbhe_1vpmb_1:not(#\9):not(.awsui_active_umbhe_1vpmb_9):focus-visible {
   position: relative;
   box-sizing: border-box;
   outline: 2px dotted transparent;
   outline-offset: 3px;
 }
-.awsui_handle_umbhe_1bn34_1:not(#\9):not(.awsui_active_umbhe_1bn34_9):focus-visible::before {
+.awsui_handle_umbhe_1vpmb_1:not(#\9):not(.awsui_active_umbhe_1vpmb_9):focus-visible::before {
   content: " ";
   display: block;
   position: absolute;
   box-sizing: border-box;
-  left: calc(-1 * 4px);
-  top: calc(-1 * 4px);
-  width: calc(100% + 2 * 4px);
-  height: calc(100% + 2 * 4px);
+  inset-inline-start: calc(-1 * 4px);
+  inset-block-start: calc(-1 * 4px);
+  inline-size: calc(100% + 2 * 4px);
+  block-size: calc(100% + 2 * 4px);
   border-radius: var(--border-radius-control-default-focus-ring-u8zbsz, 4px);
   border: 2px solid var(--color-border-item-focused-b2ntyl, #0972d3);
 }
 
-.awsui_active_umbhe_1bn34_9:not(#\9) {
+.awsui_active_umbhe_1vpmb_9:not(#\9) {
   outline: none;
 }

package/internal/drag-handle/styles.selectors.js

@@ -2,7 +2,7 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "handle": "awsui_handle_umbhe_1bn34_1",
-  "active": "awsui_active_umbhe_1bn34_9"
+  "handle": "awsui_handle_umbhe_1vpmb_1",
+  "active": "awsui_active_umbhe_1vpmb_9"
 };
   

package/internal/environment.js

@@ -1,4 +1,4 @@
 export var PACKAGE_SOURCE = "board-components";
-export var PACKAGE_VERSION = "3.0.0 (ebd35331)";
+export var PACKAGE_VERSION = "3.0.0 (b6e83249)";
 export var THEME = "open-source-visual-refresh";
 export var ALWAYS_VISUAL_REFRESH = true;

package/internal/environment.json

@@ -1,6 +1,6 @@
 {
   "PACKAGE_SOURCE": "board-components",
-  "PACKAGE_VERSION": "3.0.0 (ebd35331)",
+  "PACKAGE_VERSION": "3.0.0 (b6e83249)",
   "THEME": "open-source-visual-refresh",
   "ALWAYS_VISUAL_REFRESH": true
 }

package/internal/global-drag-state-styles/styles.css.js

@@ -1,8 +1,8 @@
 
     import './styles.scoped.css';
     export default {
-  "show-grab-cursor": "awsui_show-grab-cursor_1fgk7_1nqmi_1",
-  "show-resize-cursor": "awsui_show-resize-cursor_1fgk7_1nqmi_5",
-  "disable-selection": "awsui_disable-selection_1fgk7_1nqmi_9"
+  "show-grab-cursor": "awsui_show-grab-cursor_1fgk7_to1u8_1",
+  "show-resize-cursor": "awsui_show-resize-cursor_1fgk7_to1u8_5",
+  "disable-selection": "awsui_disable-selection_1fgk7_to1u8_12"
 };
   

package/internal/global-drag-state-styles/styles.scoped.css

@@ -1,12 +1,15 @@
-.awsui_show-grab-cursor_1fgk7_1nqmi_1 *:not(#\9) {
+.awsui_show-grab-cursor_1fgk7_to1u8_1 *:not(#\9) {
   cursor: grabbing;
 }
 
-.awsui_show-resize-cursor_1fgk7_1nqmi_5 *:not(#\9) {
+.awsui_show-resize-cursor_1fgk7_to1u8_5 *:not(#\9) {
   cursor: nwse-resize;
 }
+.awsui_show-resize-cursor_1fgk7_to1u8_5 *:not(#\9):dir(rtl) {
+  cursor: nesw-resize;
+}
 
-.awsui_disable-selection_1fgk7_1nqmi_9 *:not(#\9) {
+.awsui_disable-selection_1fgk7_to1u8_12 *:not(#\9) {
   -webkit-user-select: none;
           user-select: none;
 }

package/internal/global-drag-state-styles/styles.selectors.js

@@ -2,8 +2,8 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "show-grab-cursor": "awsui_show-grab-cursor_1fgk7_1nqmi_1",
-  "show-resize-cursor": "awsui_show-resize-cursor_1fgk7_1nqmi_5",
-  "disable-selection": "awsui_disable-selection_1fgk7_1nqmi_9"
+  "show-grab-cursor": "awsui_show-grab-cursor_1fgk7_to1u8_1",
+  "show-resize-cursor": "awsui_show-resize-cursor_1fgk7_to1u8_5",
+  "disable-selection": "awsui_disable-selection_1fgk7_to1u8_12"
 };
   

package/internal/grid/grid.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
 import { GridProps } from "./interfaces";
-export default function Grid({ layout, children: render, columns }: GridProps): JSX.Element;
+export default function Grid({ layout, children: render, columns, isRtl }: GridProps): JSX.Element;

package/internal/grid/grid.js

@@ -19,7 +19,7 @@ const ROWSPAN_HEIGHT = {
     comfortable: 96,
     compact: 76,
 };
-export default function Grid({ layout, children: render, columns }) {
+export default function Grid({ layout, children: render, columns, isRtl }) {
     const gridRef = useRef(null);
     const [gridWidth, containerQueryRef] = useContainerQuery((entry) => entry.contentBoxWidth, []);
     const densityMode = useDensityMode(gridRef);
@@ -32,7 +32,10 @@ export default function Grid({ layout, children: render, columns }) {
         return colspan * cellWidth + (colspan - 1) * gridGap;
     };
     const getHeight = (rowspan) => rowspan * rowspanHeight + (rowspan - 1) * gridGap;
-    const getColOffset = (x) => getWidth(x) + gridGap;
+    const getColOffset = (x) => {
+        const offset = getWidth(x) + gridGap;
+        return !(isRtl === null || isRtl === void 0 ? void 0 : isRtl()) ? offset : -offset;
+    };
     const getRowOffset = (y) => getHeight(y) + gridGap;
     const gridContext = { getWidth, getHeight, getColOffset, getRowOffset };
     const children = render === null || render === void 0 ? void 0 : render(gridContext);

package/internal/grid/grid.js.map

@@ -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 }: 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) => getWidth(x) + gridGap;\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"]}
+{"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"]}

package/internal/grid/interfaces.d.ts

@@ -4,6 +4,7 @@ export interface GridProps {
     layout: GridLayoutItem[];
     columns: number;
     children?: (context: GridContext) => ReactNode;
+    isRtl?: () => boolean;
 }
 export interface GridContext {
     getWidth: (colspan: number) => number;

package/internal/grid/interfaces.js.map

@@ -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}\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"]}
+{"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"]}

package/internal/handle/styles.css.js

@@ -1,6 +1,6 @@
 
     import './styles.scoped.css';
     export default {
-  "handle": "awsui_handle_cc1pu_y0i9t_1"
+  "handle": "awsui_handle_cc1pu_1avwz_1"
 };
   

package/internal/handle/styles.scoped.css

@@ -1,11 +1,12 @@
-.awsui_handle_cc1pu_y0i9t_1:not(#\9) {
+.awsui_handle_cc1pu_1avwz_1:not(#\9) {
   -webkit-appearance: none;
           appearance: none;
   background: transparent;
   border: none;
-  padding: var(--space-scaled-xxs-7597g1, 4px);
+  padding-block: var(--space-scaled-xxs-7597g1, 4px);
+  padding-inline: var(--space-scaled-xxs-7597g1, 4px);
   color: var(--color-text-interactive-default-lnx6lk, #414d5c);
 }
-.awsui_handle_cc1pu_y0i9t_1:not(#\9):hover {
+.awsui_handle_cc1pu_1avwz_1:not(#\9):hover {
   color: var(--color-text-interactive-hover-mj8add, #000716);
 }

package/internal/handle/styles.selectors.js

@@ -2,6 +2,6 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "handle": "awsui_handle_cc1pu_y0i9t_1"
+  "handle": "awsui_handle_cc1pu_1avwz_1"
 };
   

package/internal/item-container/get-next-droppable.d.ts

@@ -4,4 +4,9 @@ import { Direction, ItemId } from "../interfaces";
  * Finds closest droppable to provided draggable element and direction.
  * Returns null if there is no droppable in the given direction.
  */
-export declare function getNextDroppable(draggableElement: HTMLElement, droppables: readonly [ItemId, Droppable][], direction: Direction): null | ItemId;
+export declare function getNextDroppable({ draggableElement, droppables, direction, isRtl, }: {
+    draggableElement: HTMLElement;
+    droppables: readonly [ItemId, Droppable][];
+    direction: Direction;
+    isRtl: boolean;
+}): null | ItemId;

package/internal/item-container/get-next-droppable.js

@@ -6,11 +6,16 @@ import { getNormalizedElementRect } from "../utils/screen";
  * Finds closest droppable to provided draggable element and direction.
  * Returns null if there is no droppable in the given direction.
  */
-export function getNextDroppable(draggableElement, droppables, direction) {
+export function getNextDroppable({ draggableElement, droppables, direction, isRtl, }) {
     var _a;
     const draggableRect = getNormalizedElementRect(draggableElement);
     const sources = new Map(droppables.map(([id, d]) => [getNormalizedElementRect(d.element), id]));
-    const closest = getClosestNeighbor(draggableRect, [...sources.keys()], direction);
+    const closest = getClosestNeighbor({
+        target: draggableRect,
+        sources: [...sources.keys()],
+        direction,
+        isRtl,
+    });
     return (_a = sources.get(closest)) !== null && _a !== void 0 ? _a : null;
 }
 //# sourceMappingURL=get-next-droppable.js.map

package/internal/item-container/get-next-droppable.js.map

@@ -1 +1 @@
-{"version":3,"file":"get-next-droppable.js","sourceRoot":"","sources":["../../../../src/internal/item-container/get-next-droppable.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAItC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AACpD,OAAO,EAAE,wBAAwB,EAAE,MAAM,iBAAiB,CAAC;AAE3D;;;GAGG;AACH,MAAM,UAAU,gBAAgB,CAC9B,gBAA6B,EAC7B,UAA0C,EAC1C,SAAoB;;IAEpB,MAAM,aAAa,GAAG,wBAAwB,CAAC,gBAAgB,CAAC,CAAC;IACjE,MAAM,OAAO,GAAG,IAAI,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;IAChG,MAAM,OAAO,GAAG,kBAAkB,CAAC,aAAa,EAAE,CAAC,GAAG,OAAO,CAAC,IAAI,EAAE,CAAC,EAAE,SAAS,CAAC,CAAC;IAClF,OAAO,MAAA,OAAO,CAAC,GAAG,CAAC,OAAkB,CAAC,mCAAI,IAAI,CAAC;AACjD,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { Droppable } from \"../dnd-controller/controller\";\nimport { Direction, ItemId } from \"../interfaces\";\nimport { getClosestNeighbor } from \"../utils/rects\";\nimport { getNormalizedElementRect } from \"../utils/screen\";\n\n/**\n * Finds closest droppable to provided draggable element and direction.\n * Returns null if there is no droppable in the given direction.\n */\nexport function getNextDroppable(\n  draggableElement: HTMLElement,\n  droppables: readonly [ItemId, Droppable][],\n  direction: Direction,\n): null | ItemId {\n  const draggableRect = getNormalizedElementRect(draggableElement);\n  const sources = new Map(droppables.map(([id, d]) => [getNormalizedElementRect(d.element), id]));\n  const closest = getClosestNeighbor(draggableRect, [...sources.keys()], direction);\n  return sources.get(closest as DOMRect) ?? null;\n}\n"]}
+{"version":3,"file":"get-next-droppable.js","sourceRoot":"","sources":["../../../../src/internal/item-container/get-next-droppable.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAItC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AACpD,OAAO,EAAE,wBAAwB,EAAE,MAAM,iBAAiB,CAAC;AAE3D;;;GAGG;AACH,MAAM,UAAU,gBAAgB,CAAC,EAC/B,gBAAgB,EAChB,UAAU,EACV,SAAS,EACT,KAAK,GAMN;;IACC,MAAM,aAAa,GAAG,wBAAwB,CAAC,gBAAgB,CAAC,CAAC;IACjE,MAAM,OAAO,GAAG,IAAI,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;IAChG,MAAM,OAAO,GAAG,kBAAkB,CAAC;QACjC,MAAM,EAAE,aAAa;QACrB,OAAO,EAAE,CAAC,GAAG,OAAO,CAAC,IAAI,EAAE,CAAC;QAC5B,SAAS;QACT,KAAK;KACN,CAAC,CAAC;IACH,OAAO,MAAA,OAAO,CAAC,GAAG,CAAC,OAAkB,CAAC,mCAAI,IAAI,CAAC;AACjD,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { Droppable } from \"../dnd-controller/controller\";\nimport { Direction, ItemId } from \"../interfaces\";\nimport { getClosestNeighbor } from \"../utils/rects\";\nimport { getNormalizedElementRect } from \"../utils/screen\";\n\n/**\n * Finds closest droppable to provided draggable element and direction.\n * Returns null if there is no droppable in the given direction.\n */\nexport function getNextDroppable({\n  draggableElement,\n  droppables,\n  direction,\n  isRtl,\n}: {\n  draggableElement: HTMLElement;\n  droppables: readonly [ItemId, Droppable][];\n  direction: Direction;\n  isRtl: boolean;\n}): null | ItemId {\n  const draggableRect = getNormalizedElementRect(draggableElement);\n  const sources = new Map(droppables.map(([id, d]) => [getNormalizedElementRect(d.element), id]));\n  const closest = getClosestNeighbor({\n    target: draggableRect,\n    sources: [...sources.keys()],\n    direction,\n    isRtl,\n  });\n  return sources.get(closest as DOMRect) ?? null;\n}\n"]}

package/internal/item-container/index.d.ts

@@ -47,6 +47,7 @@ export interface ItemContainerProps {
     };
     onKeyMove?(direction: Direction): void;
     children: (hasDropTarget: boolean) => ReactNode;
+    isRtl: () => boolean;
 }
 export declare const ItemContainer: import("react").ForwardRefExoticComponent<ItemContainerProps & import("react").RefAttributes<ItemContainerRef>>;
 export {};

package/internal/item-container/index.js

@@ -7,7 +7,7 @@ import { createContext, forwardRef, useContext, useEffect, useImperativeHandle,
 import { createPortal } from "react-dom";
 import { useDragSubscription, useDraggable, } from "../dnd-controller/controller";
 import { Coordinates } from "../utils/coordinates";
-import { getNormalizedElementRect } from "../utils/screen";
+import { getLogicalBoundingClientRect, getLogicalClientX, getNormalizedElementRect } from "../utils/screen";
 import { throttle } from "../utils/throttle";
 import { getCollisionRect } from "./get-collision-rect";
 import { getNextDroppable } from "./get-next-droppable";
@@ -21,7 +21,7 @@ export function useItemContext() {
     return ctx;
 }
 export const ItemContainer = forwardRef(ItemContainerComponent);
-function ItemContainerComponent({ item, placed, acquired, inTransition, transform, getItemSize, onKeyMove, children }, ref) {
+function ItemContainerComponent({ item, placed, acquired, inTransition, transform, getItemSize, onKeyMove, children, isRtl }, ref) {
     var _a, _b, _c, _d, _e, _f;
     const originalSizeRef = useRef({ width: 0, height: 0 });
     const pointerOffsetRef = useRef(new Coordinates({ x: 0, y: 0 }));
@@ -83,7 +83,7 @@ function ItemContainerComponent({ item, placed, acquired, inTransition, transfor
     useEffect(() => {
         const onPointerMove = throttle((event) => {
             var _a, _b, _c, _d;
-            const coordinates = Coordinates.fromEvent(event);
+            const coordinates = Coordinates.fromEvent(event, { isRtl: isRtl() });
             draggableApi.updateTransition(new Coordinates({
                 x: Math.max(coordinates.x, (_b = (_a = pointerBoundariesRef.current) === null || _a === void 0 ? void 0 : _a.x) !== null && _b !== void 0 ? _b : Number.NEGATIVE_INFINITY),
                 y: Math.max(coordinates.y, (_d = (_c = pointerBoundariesRef.current) === null || _c === void 0 ? void 0 : _c.y) !== null && _d !== void 0 ? _d : Number.NEGATIVE_INFINITY),
@@ -146,7 +146,12 @@ function ItemContainerComponent({ item, placed, acquired, inTransition, transfor
     function handleInsert(direction) {
         // Find the closest droppable (in the direction) to the item.
         const droppables = draggableApi.getDroppables();
-        const nextDroppable = getNextDroppable(itemRef.current, droppables, direction);
+        const nextDroppable = getNextDroppable({
+            draggableElement: itemRef.current,
+            droppables,
+            direction,
+            isRtl: isRtl(),
+        });
         if (!nextDroppable) {
             // TODO: add announcement
             // Context: the keyboard insertion only works when there is some droppable area in the specified direction.
@@ -202,28 +207,35 @@ function ItemContainerComponent({ item, placed, acquired, inTransition, transfor
     }
     function onDragHandlePointerDown(event) {
         // Calculate the offset between item's top-left corner and the pointer landing position.
-        const rect = itemRef.current.getBoundingClientRect();
-        pointerOffsetRef.current = new Coordinates({ x: event.clientX - rect.left, y: event.clientY - rect.top });
-        originalSizeRef.current = { width: rect.width, height: rect.height };
+        const rect = getLogicalBoundingClientRect(itemRef.current);
+        const clientX = getLogicalClientX(event, isRtl());
+        const clientY = event.clientY;
+        pointerOffsetRef.current = new Coordinates({
+            x: clientX - rect.insetInlineStart,
+            y: clientY - rect.insetBlockStart,
+        });
+        originalSizeRef.current = { width: rect.inlineSize, height: rect.blockSize };
         pointerBoundariesRef.current = null;
-        draggableApi.start(!placed ? "insert" : "reorder", "pointer", Coordinates.fromEvent(event));
+        draggableApi.start(!placed ? "insert" : "reorder", "pointer", Coordinates.fromEvent(event, { isRtl: isRtl() }));
     }
     function onDragHandleKeyDown(event) {
         onHandleKeyDown("drag", event);
     }
     function onResizeHandlePointerDown(event) {
         // Calculate the offset between item's bottom-right corner and the pointer landing position.
-        const rect = itemRef.current.getBoundingClientRect();
-        pointerOffsetRef.current = new Coordinates({ x: event.clientX - rect.right, y: event.clientY - rect.bottom });
-        originalSizeRef.current = { width: rect.width, height: rect.height };
+        const rect = getLogicalBoundingClientRect(itemRef.current);
+        const clientX = getLogicalClientX(event, isRtl());
+        const clientY = event.clientY;
+        pointerOffsetRef.current = new Coordinates({ x: clientX - rect.insetInlineEnd, y: clientY - rect.insetBlockEnd });
+        originalSizeRef.current = { width: rect.inlineSize, height: rect.blockSize };
         // Calculate boundaries below which the cursor cannot move.
         const minWidth = getItemSize(null).minWidth;
         const minHeight = getItemSize(null).minHeight;
         pointerBoundariesRef.current = new Coordinates({
-            x: event.clientX - rect.width + minWidth,
-            y: event.clientY - rect.height + minHeight,
+            x: clientX - rect.inlineSize + minWidth,
+            y: clientY - rect.blockSize + minHeight,
         });
-        draggableApi.start("resize", "pointer", Coordinates.fromEvent(event));
+        draggableApi.start("resize", "pointer", Coordinates.fromEvent(event, { isRtl: isRtl() }));
     }
     function onResizeHandleKeyDown(event) {
         onHandleKeyDown("resize", event);
@@ -236,10 +248,10 @@ function ItemContainerComponent({ item, placed, acquired, inTransition, transfor
     if (transition && transition.interactionType === "pointer") {
         // Adjust the dragged/resized item to the pointer's location.
         itemTransitionClassNames.push(transition.operation === "resize" ? styles.resized : styles.dragged);
-        itemTransitionStyle.left = (_c = transition.positionTransform) === null || _c === void 0 ? void 0 : _c.x;
-        itemTransitionStyle.top = (_d = transition.positionTransform) === null || _d === void 0 ? void 0 : _d.y;
-        itemTransitionStyle.width = (_e = transition.sizeTransform) === null || _e === void 0 ? void 0 : _e.width;
-        itemTransitionStyle.height = (_f = transition.sizeTransform) === null || _f === void 0 ? void 0 : _f.height;
+        itemTransitionStyle.insetInlineStart = (_c = transition.positionTransform) === null || _c === void 0 ? void 0 : _c.x;
+        itemTransitionStyle.insetBlockStart = (_d = transition.positionTransform) === null || _d === void 0 ? void 0 : _d.y;
+        itemTransitionStyle.inlineSize = (_e = transition.sizeTransform) === null || _e === void 0 ? void 0 : _e.width;
+        itemTransitionStyle.blockSize = (_f = transition.sizeTransform) === null || _f === void 0 ? void 0 : _f.height;
         itemTransitionStyle.pointerEvents = "none";
     }
     if (isHidden) {

package/internal/item-container/index.js.map

@@ -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 { 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\";\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}\n\nexport const ItemContainer = forwardRef(ItemContainerComponent);\n\nfunction ItemContainerComponent(\n  { item, placed, acquired, inTransition, transform, getItemSize, onKeyMove, children }: 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);\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(itemRef.current!, droppables, direction);\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 = itemRef.current!.getBoundingClientRect();\n    pointerOffsetRef.current = new Coordinates({ x: event.clientX - rect.left, y: event.clientY - rect.top });\n    originalSizeRef.current = { width: rect.width, height: rect.height };\n    pointerBoundariesRef.current = null;\n\n    draggableApi.start(!placed ? \"insert\" : \"reorder\", \"pointer\", Coordinates.fromEvent(event));\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 = itemRef.current!.getBoundingClientRect();\n    pointerOffsetRef.current = new Coordinates({ x: event.clientX - rect.right, y: event.clientY - rect.bottom });\n    originalSizeRef.current = { width: rect.width, height: rect.height };\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: event.clientX - rect.width + minWidth,\n      y: event.clientY - rect.height + minHeight,\n    });\n\n    draggableApi.start(\"resize\", \"pointer\", Coordinates.fromEvent(event));\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.left = transition.positionTransform?.x;\n    itemTransitionStyle.top = transition.positionTransform?.y;\n    itemTransitionStyle.width = transition.sizeTransform?.width;\n    itemTransitionStyle.height = 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"]}
+{"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 { 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 { getLogicalBoundingClientRect, getLogicalClientX, getNormalizedElementRect } from \"../utils/screen\";\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"]}

package/internal/item-container/styles.css.js

@@ -1,12 +1,12 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_lljvd_1jk2l_1",
-  "inTransition": "awsui_inTransition_lljvd_1jk2l_7",
-  "transformed": "awsui_transformed_lljvd_1jk2l_12",
-  "removed": "awsui_removed_lljvd_1jk2l_17",
-  "dragged": "awsui_dragged_lljvd_1jk2l_21",
-  "resized": "awsui_resized_lljvd_1jk2l_26",
-  "hidden": "awsui_hidden_lljvd_1jk2l_31"
+  "root": "awsui_root_lljvd_bapad_1",
+  "inTransition": "awsui_inTransition_lljvd_bapad_7",
+  "transformed": "awsui_transformed_lljvd_bapad_12",
+  "removed": "awsui_removed_lljvd_bapad_17",
+  "dragged": "awsui_dragged_lljvd_bapad_21",
+  "resized": "awsui_resized_lljvd_bapad_26",
+  "hidden": "awsui_hidden_lljvd_bapad_31"
 };
   

package/internal/item-container/styles.scoped.css

@@ -1,33 +1,33 @@
-.awsui_root_lljvd_1jk2l_1:not(#\9) {
+.awsui_root_lljvd_bapad_1:not(#\9) {
   touch-action: none;
   position: relative;
-  height: 100%;
+  block-size: 100%;
 }
 
-.awsui_inTransition_lljvd_1jk2l_7:not(#\9) {
+.awsui_inTransition_lljvd_bapad_7:not(#\9) {
   transition: transform 200ms;
   transition-timing-function: ease;
 }
 
-.awsui_transformed_lljvd_1jk2l_12:not(#\9) {
+.awsui_transformed_lljvd_bapad_12:not(#\9) {
   position: absolute;
   z-index: 1;
 }
 
-.awsui_removed_lljvd_1jk2l_17:not(#\9) {
+.awsui_removed_lljvd_bapad_17:not(#\9) {
   display: none;
 }
 
-.awsui_dragged_lljvd_1jk2l_21:not(#\9) {
+.awsui_dragged_lljvd_bapad_21:not(#\9) {
   z-index: 2000;
   position: fixed;
 }
 
-.awsui_resized_lljvd_1jk2l_26:not(#\9) {
+.awsui_resized_lljvd_bapad_26:not(#\9) {
   z-index: 2000;
   position: absolute;
 }
 
-.awsui_hidden_lljvd_1jk2l_31:not(#\9) {
+.awsui_hidden_lljvd_bapad_31:not(#\9) {
   display: none;
 }

package/internal/item-container/styles.selectors.js

@@ -2,12 +2,12 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_lljvd_1jk2l_1",
-  "inTransition": "awsui_inTransition_lljvd_1jk2l_7",
-  "transformed": "awsui_transformed_lljvd_1jk2l_12",
-  "removed": "awsui_removed_lljvd_1jk2l_17",
-  "dragged": "awsui_dragged_lljvd_1jk2l_21",
-  "resized": "awsui_resized_lljvd_1jk2l_26",
-  "hidden": "awsui_hidden_lljvd_1jk2l_31"
+  "root": "awsui_root_lljvd_bapad_1",
+  "inTransition": "awsui_inTransition_lljvd_bapad_7",
+  "transformed": "awsui_transformed_lljvd_bapad_12",
+  "removed": "awsui_removed_lljvd_bapad_17",
+  "dragged": "awsui_dragged_lljvd_bapad_21",
+  "resized": "awsui_resized_lljvd_bapad_26",
+  "hidden": "awsui_hidden_lljvd_bapad_31"
 };
   

package/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "ebd353313c119ec86d3b4667729aa3753fda3bd2"
+  "commit": "b6e83249cceeb769c4283e011bfc1e8658c69f51"
 }