@cloudscape-design/board-components 3.0.115 → 3.0.117

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 (15) hide show
  1. package/board/internal.js +3 -3
  2. package/board/internal.js.map +1 -1
  3. package/internal/environment.js +1 -1
  4. package/internal/environment.json +1 -1
  5. package/internal/generated/theming/index.cjs +14 -0
  6. package/internal/generated/theming/index.cjs.d.ts +63 -0
  7. package/internal/generated/theming/index.d.ts +63 -0
  8. package/internal/generated/theming/index.js +14 -0
  9. package/internal/item-container/index.js +44 -21
  10. package/internal/item-container/index.js.map +1 -1
  11. package/internal/manifest.json +1 -1
  12. package/internal/utils/use-auto-scroll.d.ts +16 -5
  13. package/internal/utils/use-auto-scroll.js +62 -50
  14. package/internal/utils/use-auto-scroll.js.map +1 -1
  15. package/package.json +1 -1
package/board/internal.js CHANGED
@@ -115,7 +115,7 @@ export function InternalBoard({ items, renderItem, onItemsChange, empty, i18nStr
115
115
  draggableRect: collisionRect,
116
116
  collisionIds: interactionType === "pointer" && isElementOverBoard(collisionRect) ? collisionIds : [],
117
117
  });
118
- autoScrollHandlers.addPointerEventHandlers();
118
+ autoScrollHandlers.run();
119
119
  });
120
120
  useDragSubscription("update", ({ interactionType, collisionIds, positionOffset, collisionRect }) => {
121
121
  dispatch({
@@ -127,7 +127,7 @@ export function InternalBoard({ items, renderItem, onItemsChange, empty, i18nStr
127
127
  });
128
128
  useDragSubscription("submit", () => {
129
129
  dispatch({ type: "submit" });
130
- autoScrollHandlers.removePointerEventHandlers();
130
+ autoScrollHandlers.stop();
131
131
  if (!transition) {
132
132
  throw new Error("Invariant violation: no transition.");
133
133
  }
@@ -147,7 +147,7 @@ export function InternalBoard({ items, renderItem, onItemsChange, empty, i18nStr
147
147
  });
148
148
  useDragSubscription("discard", () => {
149
149
  dispatch({ type: "discard" });
150
- autoScrollHandlers.removePointerEventHandlers();
150
+ autoScrollHandlers.stop();
151
151
  });
152
152
  useDragSubscription("acquire", ({ droppableId, draggableItem, renderAcquiredItem }) => {
153
153
  const placeholder = placeholdersLayout.items.find((it) => it.id === droppableId);
package/board/internal.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/board/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 { ReactNode, useEffect, useRef } from \"react\";\nimport { usePrevious } from \"@dnd-kit/utilities\";\nimport clsx from \"clsx\";\n\nimport { getIsRtl, useMergeRefs } from \"@cloudscape-design/component-toolkit/internal\";\n\nimport { getDataAttributes } from \"../internal/base-component/get-data-attributes\";\nimport { InternalBaseComponentProps } from \"../internal/base-component/use-base-component\";\nimport { useContainerColumns } from \"../internal/breakpoints\";\nimport { TRANSITION_DURATION_MS } from \"../internal/constants\";\nimport { useDragSubscription } from \"../internal/dnd-controller/controller\";\nimport { useGlobalDragStateStyles } from \"../internal/global-drag-state-styles\";\nimport Grid from \"../internal/grid\";\nimport { BoardItemDefinition, BoardItemDefinitionBase, Direction, ItemId, Rect } from \"../internal/interfaces\";\nimport { ItemContainer, ItemContainerRef } from \"../internal/item-container\";\nimport LiveRegion from \"../internal/live-region\";\nimport {\n createPlaceholdersLayout,\n getDefaultColumnSpan,\n getDefaultRowSpan,\n getMinColumnSpan,\n getMinRowSpan,\n interpretItems,\n} from \"../internal/utils/layout\";\nimport { Position } from \"../internal/utils/position\";\nimport { useAutoScroll } from \"../internal/utils/use-auto-scroll\";\nimport { BoardProps } from \"./interfaces\";\nimport Placeholder from \"./placeholder\";\nimport { selectTransitionRows, useTransition } from \"./transition\";\nimport { announcementToString } from \"./utils/announcements\";\nimport { createTransforms } from \"./utils/create-transforms\";\nimport { createItemsChangeEvent } from \"./utils/events\";\n\nimport styles from \"./styles.css.js\";\n\nexport function InternalBoard<D>({\n items,\n renderItem,\n onItemsChange,\n empty,\n i18nStrings,\n __internalRootRef,\n ...rest\n}: BoardProps<D> & InternalBaseComponentProps) {\n const containerAccessRef = useRef<HTMLDivElement>(null);\n const [currentColumns, containerQueryRef] = useContainerColumns();\n const containerRef = useMergeRefs(containerAccessRef, containerQueryRef);\n const itemContainerRef = useRef<{ [id: ItemId]: ItemContainerRef }>({});\n\n const isRtl = () => getIsRtl(containerAccessRef.current);\n\n useGlobalDragStateStyles();\n\n const autoScrollHandlers = useAutoScroll();\n\n const [transitionState, dispatch] = useTransition<D>({ isRtl });\n const transition = transitionState.transition;\n const removeTransition = transitionState.removeTransition;\n const transitionAnnouncement = transitionState.announcement;\n const acquiredItem = transition?.acquiredItem ?? null;\n const acquiredItemElement = transition?.acquiredItemElement;\n\n // Using cached columns from transition to ensure no unexpected changes in the process.\n const columns = transition ? transition.itemsLayout.columns : currentColumns;\n\n // Use previous items while remove transition is in progress.\n items = removeTransition?.items ?? items;\n\n // The acquired item is the one being inserting at the moment but not submitted yet.\n // It needs to be included to the layout to be a part of layout shifts and rendering.\n items = acquiredItem ? [...items, acquiredItem] : items;\n const itemsLayout = interpretItems(items, columns);\n\n const layoutItemById = new Map(itemsLayout.items.map((item) => [item.id, item]));\n const layoutItemIndexById = new Map(itemsLayout.items.map((item, index) => [item.id, index]));\n\n // Items and layout items must maintain the same order visually, in the DOM and in the data\n // to ensure on-change events and tab order work as expected.\n items = [...items].sort((a, b) => (layoutItemIndexById.get(a.id) ?? -1) - (layoutItemIndexById.get(b.id) ?? -1));\n\n // When an item gets acquired or removed the focus needs to be dispatched on the next render.\n const focusNextRenderIdRef = useRef<null | ItemId>(null);\n useEffect(() => {\n const focusTarget = focusNextRenderIdRef.current;\n if (focusTarget) {\n itemContainerRef.current[focusTarget].focusDragHandle();\n }\n focusNextRenderIdRef.current = null;\n });\n\n // Submit scheduled removal after a delay to let animations play.\n useEffect(() => {\n if (!removeTransition) {\n return;\n }\n\n const timeoutId = setTimeout(() => {\n dispatch({ type: \"submit\" });\n\n const removedItemIndex = items.findIndex((it) => it.id === removeTransition.removedItem.id);\n const nextIndexToFocus = removedItemIndex !== items.length - 1 ? removedItemIndex : items.length - 2;\n const newItems = createItemsChangeEvent(items, removeTransition.layoutShift);\n const itemIdToFocus = newItems.detail.items[nextIndexToFocus]?.id;\n\n if (itemIdToFocus) {\n itemContainerRef.current[itemIdToFocus].focusDragHandle();\n }\n onItemsChange(newItems);\n }, TRANSITION_DURATION_MS);\n\n return () => clearTimeout(timeoutId);\n }, [removeTransition, items, onItemsChange]);\n\n // When item is inserting with the keyboard it keeps rendering by the palette and upon submission\n // it starts rendering by the board. This transitions might lead to the focus being lost from the item's drag handle.\n // The below code refocuses the drag handle when detecting the acquired item is no longer used.\n const acquiredItemId = usePrevious(acquiredItem?.id);\n const previousAcquiredItemElement = usePrevious(acquiredItemElement);\n useEffect(() => {\n if (acquiredItemId && previousAcquiredItemElement && !acquiredItemElement) {\n itemContainerRef.current[acquiredItemId]?.focusDragHandle();\n }\n }, [acquiredItemId, previousAcquiredItemElement, acquiredItemElement]);\n\n const rows = selectTransitionRows(transitionState) || itemsLayout.rows;\n const placeholdersLayout = createPlaceholdersLayout(rows, itemsLayout.columns);\n\n function isElementOverBoard(rect: Rect) {\n const board = containerAccessRef.current!;\n const boardContains = (target: null | Element) => board === target || board.contains(target);\n const left = !isRtl() ? rect.left : document.documentElement.clientWidth - rect.left;\n const right = !isRtl() ? rect.right : document.documentElement.clientWidth - rect.right;\n const { top, bottom } = rect;\n return (\n boardContains(document.elementFromPoint(left, top)) ||\n boardContains(document.elementFromPoint(right, top)) ||\n boardContains(document.elementFromPoint(right, bottom)) ||\n boardContains(document.elementFromPoint(left, bottom))\n );\n }\n\n useDragSubscription(\"start\", ({ operation, interactionType, draggableItem, collisionRect, collisionIds }) => {\n dispatch({\n type: \"init\",\n operation,\n interactionType,\n itemsLayout,\n // TODO: resolve any\n // The code only works assuming the board can take any draggable.\n // If draggables can be of different types a check of some sort is required here.\n draggableItem: draggableItem as BoardItemDefinitionBase<any>,\n draggableRect: collisionRect,\n collisionIds: interactionType === \"pointer\" && isElementOverBoard(collisionRect) ? collisionIds : [],\n });\n\n autoScrollHandlers.addPointerEventHandlers();\n });\n\n useDragSubscription(\"update\", ({ interactionType, collisionIds, positionOffset, collisionRect }) => {\n dispatch({\n type: \"update-with-pointer\",\n collisionIds: interactionType === \"pointer\" && isElementOverBoard(collisionRect) ? collisionIds : [],\n positionOffset,\n draggableRect: collisionRect,\n });\n });\n\n useDragSubscription(\"submit\", () => {\n dispatch({ type: \"submit\" });\n\n autoScrollHandlers.removePointerEventHandlers();\n\n if (!transition) {\n throw new Error(\"Invariant violation: no transition.\");\n }\n if (\n !transition.layoutShift ||\n transition.layoutShift.conflicts.length > 0 ||\n transition.layoutShift.moves.length === 0\n ) {\n return null;\n }\n\n // Commit new layout for insert case.\n if (transition.operation === \"insert\") {\n onItemsChange(createItemsChangeEvent([...items, transition.draggableItem], transition.layoutShift));\n }\n // Commit new layout for reorder/resize case.\n else {\n onItemsChange(createItemsChangeEvent(items, transition.layoutShift));\n }\n });\n\n useDragSubscription(\"discard\", () => {\n dispatch({ type: \"discard\" });\n\n autoScrollHandlers.removePointerEventHandlers();\n });\n\n useDragSubscription(\"acquire\", ({ droppableId, draggableItem, renderAcquiredItem }) => {\n const placeholder = placeholdersLayout.items.find((it) => it.id === droppableId);\n\n // If missing then it does not belong to this board.\n if (!placeholder) {\n return;\n }\n\n dispatch({\n type: \"acquire-item\",\n position: new Position({ x: placeholder.x, y: placeholder.y }),\n layoutElement: containerAccessRef.current!,\n acquiredItemElement: renderAcquiredItem(),\n });\n focusNextRenderIdRef.current = draggableItem.id;\n });\n\n const removeItemAction = (removedItem: BoardItemDefinition<D>) => {\n dispatch({ type: \"init-remove\", items, itemsLayout, removedItem });\n };\n\n function onItemMove(direction: Direction) {\n if (transition) {\n dispatch({ type: \"update-with-keyboard\", direction });\n autoScrollHandlers.scheduleActiveElementScrollIntoView(TRANSITION_DURATION_MS);\n }\n }\n\n const announcement = transitionAnnouncement\n ? announcementToString(transitionAnnouncement, items, i18nStrings, itemsLayout.columns)\n : \"\";\n\n return (\n <div ref={__internalRootRef} {...getDataAttributes(rest)}>\n <div ref={containerRef} className={clsx(styles.root, { [styles.empty]: rows === 0 })}>\n {rows > 0 ? (\n <Grid\n isRtl={isRtl}\n columns={itemsLayout.columns}\n layout={[...placeholdersLayout.items, ...itemsLayout.items]}\n >\n {(gridContext) => {\n const layoutShift = transition?.layoutShift ?? removeTransition?.layoutShift;\n const transforms = layoutShift ? createTransforms(itemsLayout, layoutShift.moves, gridContext) : {};\n\n // Exclude drag target from transforms.\n if (transition && transition.interactionType === \"pointer\") {\n delete transforms[transition.draggableItem.id];\n }\n\n const children: ReactNode[] = [];\n\n /* Placeholders are rendered even when there is no transition to support the first collisions check. */\n placeholdersLayout.items.forEach((placeholder) =>\n children.push(\n <Placeholder\n key={placeholder.id}\n id={placeholder.id}\n state={transition ? (transition.collisionIds?.has(placeholder.id) ? \"hover\" : \"active\") : \"default\"}\n gridContext={gridContext}\n columns={itemsLayout.columns}\n />,\n ),\n );\n\n items.forEach((item) => {\n const layoutItem = layoutItemById.get(item.id);\n const isResizing = transition?.operation === \"resize\" && transition?.draggableItem.id === item.id;\n\n const itemSize = layoutItem ?? {\n width: getDefaultColumnSpan(item, itemsLayout.columns),\n height: getDefaultRowSpan(item),\n };\n\n const itemMaxSize =\n isResizing && layoutItem ? { width: itemsLayout.columns - layoutItem.x, height: 999 } : itemSize;\n\n children.push(\n <ItemContainer\n key={item.id}\n ref={(elem) => {\n if (elem) {\n itemContainerRef.current[item.id] = elem;\n } else {\n delete itemContainerRef.current[item.id];\n }\n }}\n item={item}\n transform={transforms[item.id]}\n inTransition={!!transition || !!removeTransition}\n placed={item.id !== acquiredItem?.id}\n acquired={item.id === acquiredItem?.id}\n getItemSize={() => ({\n width: gridContext.getWidth(itemSize.width),\n minWidth: gridContext.getWidth(getMinColumnSpan(item, itemsLayout.columns)),\n maxWidth: gridContext.getWidth(itemMaxSize.width),\n height: gridContext.getHeight(itemSize.height),\n minHeight: gridContext.getHeight(getMinRowSpan(item)),\n maxHeight: gridContext.getHeight(itemMaxSize.height),\n })}\n onKeyMove={onItemMove}\n isRtl={isRtl}\n >\n {item.id === acquiredItem?.id && acquiredItemElement\n ? () => acquiredItemElement\n : () => renderItem(item, { removeItem: () => removeItemAction(item) })}\n </ItemContainer>,\n );\n });\n\n return children;\n }}\n </Grid>\n ) : (\n empty\n )}\n </div>\n\n <LiveRegion>{announcement}</LiveRegion>\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/board/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 { ReactNode, useEffect, useRef } from \"react\";\nimport { usePrevious } from \"@dnd-kit/utilities\";\nimport clsx from \"clsx\";\n\nimport { getIsRtl, useMergeRefs } from \"@cloudscape-design/component-toolkit/internal\";\n\nimport { getDataAttributes } from \"../internal/base-component/get-data-attributes\";\nimport { InternalBaseComponentProps } from \"../internal/base-component/use-base-component\";\nimport { useContainerColumns } from \"../internal/breakpoints\";\nimport { TRANSITION_DURATION_MS } from \"../internal/constants\";\nimport { useDragSubscription } from \"../internal/dnd-controller/controller\";\nimport { useGlobalDragStateStyles } from \"../internal/global-drag-state-styles\";\nimport Grid from \"../internal/grid\";\nimport { BoardItemDefinition, BoardItemDefinitionBase, Direction, ItemId, Rect } from \"../internal/interfaces\";\nimport { ItemContainer, ItemContainerRef } from \"../internal/item-container\";\nimport LiveRegion from \"../internal/live-region\";\nimport {\n createPlaceholdersLayout,\n getDefaultColumnSpan,\n getDefaultRowSpan,\n getMinColumnSpan,\n getMinRowSpan,\n interpretItems,\n} from \"../internal/utils/layout\";\nimport { Position } from \"../internal/utils/position\";\nimport { useAutoScroll } from \"../internal/utils/use-auto-scroll\";\nimport { BoardProps } from \"./interfaces\";\nimport Placeholder from \"./placeholder\";\nimport { selectTransitionRows, useTransition } from \"./transition\";\nimport { announcementToString } from \"./utils/announcements\";\nimport { createTransforms } from \"./utils/create-transforms\";\nimport { createItemsChangeEvent } from \"./utils/events\";\n\nimport styles from \"./styles.css.js\";\n\nexport function InternalBoard<D>({\n items,\n renderItem,\n onItemsChange,\n empty,\n i18nStrings,\n __internalRootRef,\n ...rest\n}: BoardProps<D> & InternalBaseComponentProps) {\n const containerAccessRef = useRef<HTMLDivElement>(null);\n const [currentColumns, containerQueryRef] = useContainerColumns();\n const containerRef = useMergeRefs(containerAccessRef, containerQueryRef);\n const itemContainerRef = useRef<{ [id: ItemId]: ItemContainerRef }>({});\n\n const isRtl = () => getIsRtl(containerAccessRef.current);\n\n useGlobalDragStateStyles();\n\n const autoScrollHandlers = useAutoScroll();\n\n const [transitionState, dispatch] = useTransition<D>({ isRtl });\n const transition = transitionState.transition;\n const removeTransition = transitionState.removeTransition;\n const transitionAnnouncement = transitionState.announcement;\n const acquiredItem = transition?.acquiredItem ?? null;\n const acquiredItemElement = transition?.acquiredItemElement;\n\n // Using cached columns from transition to ensure no unexpected changes in the process.\n const columns = transition ? transition.itemsLayout.columns : currentColumns;\n\n // Use previous items while remove transition is in progress.\n items = removeTransition?.items ?? items;\n\n // The acquired item is the one being inserting at the moment but not submitted yet.\n // It needs to be included to the layout to be a part of layout shifts and rendering.\n items = acquiredItem ? [...items, acquiredItem] : items;\n const itemsLayout = interpretItems(items, columns);\n\n const layoutItemById = new Map(itemsLayout.items.map((item) => [item.id, item]));\n const layoutItemIndexById = new Map(itemsLayout.items.map((item, index) => [item.id, index]));\n\n // Items and layout items must maintain the same order visually, in the DOM and in the data\n // to ensure on-change events and tab order work as expected.\n items = [...items].sort((a, b) => (layoutItemIndexById.get(a.id) ?? -1) - (layoutItemIndexById.get(b.id) ?? -1));\n\n // When an item gets acquired or removed the focus needs to be dispatched on the next render.\n const focusNextRenderIdRef = useRef<null | ItemId>(null);\n useEffect(() => {\n const focusTarget = focusNextRenderIdRef.current;\n if (focusTarget) {\n itemContainerRef.current[focusTarget].focusDragHandle();\n }\n focusNextRenderIdRef.current = null;\n });\n\n // Submit scheduled removal after a delay to let animations play.\n useEffect(() => {\n if (!removeTransition) {\n return;\n }\n\n const timeoutId = setTimeout(() => {\n dispatch({ type: \"submit\" });\n\n const removedItemIndex = items.findIndex((it) => it.id === removeTransition.removedItem.id);\n const nextIndexToFocus = removedItemIndex !== items.length - 1 ? removedItemIndex : items.length - 2;\n const newItems = createItemsChangeEvent(items, removeTransition.layoutShift);\n const itemIdToFocus = newItems.detail.items[nextIndexToFocus]?.id;\n\n if (itemIdToFocus) {\n itemContainerRef.current[itemIdToFocus].focusDragHandle();\n }\n onItemsChange(newItems);\n }, TRANSITION_DURATION_MS);\n\n return () => clearTimeout(timeoutId);\n }, [removeTransition, items, onItemsChange]);\n\n // When item is inserting with the keyboard it keeps rendering by the palette and upon submission\n // it starts rendering by the board. This transitions might lead to the focus being lost from the item's drag handle.\n // The below code refocuses the drag handle when detecting the acquired item is no longer used.\n const acquiredItemId = usePrevious(acquiredItem?.id);\n const previousAcquiredItemElement = usePrevious(acquiredItemElement);\n useEffect(() => {\n if (acquiredItemId && previousAcquiredItemElement && !acquiredItemElement) {\n itemContainerRef.current[acquiredItemId]?.focusDragHandle();\n }\n }, [acquiredItemId, previousAcquiredItemElement, acquiredItemElement]);\n\n const rows = selectTransitionRows(transitionState) || itemsLayout.rows;\n const placeholdersLayout = createPlaceholdersLayout(rows, itemsLayout.columns);\n\n function isElementOverBoard(rect: Rect) {\n const board = containerAccessRef.current!;\n const boardContains = (target: null | Element) => board === target || board.contains(target);\n const left = !isRtl() ? rect.left : document.documentElement.clientWidth - rect.left;\n const right = !isRtl() ? rect.right : document.documentElement.clientWidth - rect.right;\n const { top, bottom } = rect;\n return (\n boardContains(document.elementFromPoint(left, top)) ||\n boardContains(document.elementFromPoint(right, top)) ||\n boardContains(document.elementFromPoint(right, bottom)) ||\n boardContains(document.elementFromPoint(left, bottom))\n );\n }\n\n useDragSubscription(\"start\", ({ operation, interactionType, draggableItem, collisionRect, collisionIds }) => {\n dispatch({\n type: \"init\",\n operation,\n interactionType,\n itemsLayout,\n // TODO: resolve any\n // The code only works assuming the board can take any draggable.\n // If draggables can be of different types a check of some sort is required here.\n draggableItem: draggableItem as BoardItemDefinitionBase<any>,\n draggableRect: collisionRect,\n collisionIds: interactionType === \"pointer\" && isElementOverBoard(collisionRect) ? collisionIds : [],\n });\n\n autoScrollHandlers.run();\n });\n\n useDragSubscription(\"update\", ({ interactionType, collisionIds, positionOffset, collisionRect }) => {\n dispatch({\n type: \"update-with-pointer\",\n collisionIds: interactionType === \"pointer\" && isElementOverBoard(collisionRect) ? collisionIds : [],\n positionOffset,\n draggableRect: collisionRect,\n });\n });\n\n useDragSubscription(\"submit\", () => {\n dispatch({ type: \"submit\" });\n\n autoScrollHandlers.stop();\n\n if (!transition) {\n throw new Error(\"Invariant violation: no transition.\");\n }\n if (\n !transition.layoutShift ||\n transition.layoutShift.conflicts.length > 0 ||\n transition.layoutShift.moves.length === 0\n ) {\n return null;\n }\n\n // Commit new layout for insert case.\n if (transition.operation === \"insert\") {\n onItemsChange(createItemsChangeEvent([...items, transition.draggableItem], transition.layoutShift));\n }\n // Commit new layout for reorder/resize case.\n else {\n onItemsChange(createItemsChangeEvent(items, transition.layoutShift));\n }\n });\n\n useDragSubscription(\"discard\", () => {\n dispatch({ type: \"discard\" });\n\n autoScrollHandlers.stop();\n });\n\n useDragSubscription(\"acquire\", ({ droppableId, draggableItem, renderAcquiredItem }) => {\n const placeholder = placeholdersLayout.items.find((it) => it.id === droppableId);\n\n // If missing then it does not belong to this board.\n if (!placeholder) {\n return;\n }\n\n dispatch({\n type: \"acquire-item\",\n position: new Position({ x: placeholder.x, y: placeholder.y }),\n layoutElement: containerAccessRef.current!,\n acquiredItemElement: renderAcquiredItem(),\n });\n focusNextRenderIdRef.current = draggableItem.id;\n });\n\n const removeItemAction = (removedItem: BoardItemDefinition<D>) => {\n dispatch({ type: \"init-remove\", items, itemsLayout, removedItem });\n };\n\n function onItemMove(direction: Direction) {\n if (transition) {\n dispatch({ type: \"update-with-keyboard\", direction });\n autoScrollHandlers.scheduleActiveElementScrollIntoView(TRANSITION_DURATION_MS);\n }\n }\n\n const announcement = transitionAnnouncement\n ? announcementToString(transitionAnnouncement, items, i18nStrings, itemsLayout.columns)\n : \"\";\n\n return (\n <div ref={__internalRootRef} {...getDataAttributes(rest)}>\n <div ref={containerRef} className={clsx(styles.root, { [styles.empty]: rows === 0 })}>\n {rows > 0 ? (\n <Grid\n isRtl={isRtl}\n columns={itemsLayout.columns}\n layout={[...placeholdersLayout.items, ...itemsLayout.items]}\n >\n {(gridContext) => {\n const layoutShift = transition?.layoutShift ?? removeTransition?.layoutShift;\n const transforms = layoutShift ? createTransforms(itemsLayout, layoutShift.moves, gridContext) : {};\n\n // Exclude drag target from transforms.\n if (transition && transition.interactionType === \"pointer\") {\n delete transforms[transition.draggableItem.id];\n }\n\n const children: ReactNode[] = [];\n\n /* Placeholders are rendered even when there is no transition to support the first collisions check. */\n placeholdersLayout.items.forEach((placeholder) =>\n children.push(\n <Placeholder\n key={placeholder.id}\n id={placeholder.id}\n state={transition ? (transition.collisionIds?.has(placeholder.id) ? \"hover\" : \"active\") : \"default\"}\n gridContext={gridContext}\n columns={itemsLayout.columns}\n />,\n ),\n );\n\n items.forEach((item) => {\n const layoutItem = layoutItemById.get(item.id);\n const isResizing = transition?.operation === \"resize\" && transition?.draggableItem.id === item.id;\n\n const itemSize = layoutItem ?? {\n width: getDefaultColumnSpan(item, itemsLayout.columns),\n height: getDefaultRowSpan(item),\n };\n\n const itemMaxSize =\n isResizing && layoutItem ? { width: itemsLayout.columns - layoutItem.x, height: 999 } : itemSize;\n\n children.push(\n <ItemContainer\n key={item.id}\n ref={(elem) => {\n if (elem) {\n itemContainerRef.current[item.id] = elem;\n } else {\n delete itemContainerRef.current[item.id];\n }\n }}\n item={item}\n transform={transforms[item.id]}\n inTransition={!!transition || !!removeTransition}\n placed={item.id !== acquiredItem?.id}\n acquired={item.id === acquiredItem?.id}\n getItemSize={() => ({\n width: gridContext.getWidth(itemSize.width),\n minWidth: gridContext.getWidth(getMinColumnSpan(item, itemsLayout.columns)),\n maxWidth: gridContext.getWidth(itemMaxSize.width),\n height: gridContext.getHeight(itemSize.height),\n minHeight: gridContext.getHeight(getMinRowSpan(item)),\n maxHeight: gridContext.getHeight(itemMaxSize.height),\n })}\n onKeyMove={onItemMove}\n isRtl={isRtl}\n >\n {item.id === acquiredItem?.id && acquiredItemElement\n ? () => acquiredItemElement\n : () => renderItem(item, { removeItem: () => removeItemAction(item) })}\n </ItemContainer>,\n );\n });\n\n return children;\n }}\n </Grid>\n ) : (\n empty\n )}\n </div>\n\n <LiveRegion>{announcement}</LiveRegion>\n </div>\n );\n}\n"]}
package/internal/environment.js CHANGED
@@ -1,5 +1,5 @@
1
1
  export var PACKAGE_SOURCE = "board-components";
2
- export var PACKAGE_VERSION = "3.0.0 (8ff00c05)";
2
+ export var PACKAGE_VERSION = "3.0.0 (a61290b0)";
3
3
  export var THEME = "open-source-visual-refresh";
4
4
  export var ALWAYS_VISUAL_REFRESH = true;
5
5
  export var SYSTEM = "console";
package/internal/environment.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "PACKAGE_SOURCE": "board-components",
3
- "PACKAGE_VERSION": "3.0.0 (8ff00c05)",
3
+ "PACKAGE_VERSION": "3.0.0 (a61290b0)",
4
4
  "THEME": "open-source-visual-refresh",
5
5
  "ALWAYS_VISUAL_REFRESH": true,
6
6
  "SYSTEM": "console"
package/internal/generated/theming/index.cjs CHANGED
@@ -10614,6 +10614,12 @@ module.exports.preset = {
10614
10614
  "colorTextStatusSuccess",
10615
10615
  "colorTextStatusWarning",
10616
10616
  "colorTextTopNavigationTitle",
10617
+ "colorDropzoneBackgroundDefault",
10618
+ "colorDropzoneBackgroundHover",
10619
+ "colorDropzoneTextDefault",
10620
+ "colorDropzoneTextHover",
10621
+ "colorDropzoneBorderDefault",
10622
+ "colorDropzoneBorderHover",
10617
10623
  "fontFamilyBase",
10618
10624
  "fontFamilyMonospace",
10619
10625
  "fontSizeBodyM",
@@ -10646,6 +10652,7 @@ module.exports.preset = {
10646
10652
  "borderRadiusControlCircularFocusRing",
10647
10653
  "borderRadiusControlDefaultFocusRing",
10648
10654
  "borderRadiusDropdown",
10655
+ "borderRadiusDropzone",
10649
10656
  "borderRadiusFlashbar",
10650
10657
  "borderRadiusItem",
10651
10658
  "borderRadiusInput",
@@ -10969,6 +10976,12 @@ module.exports.preset = {
10969
10976
  "colorBoardPlaceholderHover",
10970
10977
  "colorDragPlaceholderActive",
10971
10978
  "colorDragPlaceholderHover",
10979
+ "colorDropzoneBackgroundDefault",
10980
+ "colorDropzoneBackgroundHover",
10981
+ "colorDropzoneTextDefault",
10982
+ "colorDropzoneTextHover",
10983
+ "colorDropzoneBorderDefault",
10984
+ "colorDropzoneBorderHover",
10972
10985
  "fontFamilyBase",
10973
10986
  "fontFamilyMonospace",
10974
10987
  "fontSizeBodyM",
@@ -11001,6 +11014,7 @@ module.exports.preset = {
11001
11014
  "borderRadiusControlCircularFocusRing",
11002
11015
  "borderRadiusControlDefaultFocusRing",
11003
11016
  "borderRadiusDropdown",
11017
+ "borderRadiusDropzone",
11004
11018
  "borderRadiusFlashbar",
11005
11019
  "borderRadiusItem",
11006
11020
  "borderRadiusInput",
package/internal/generated/theming/index.cjs.d.ts CHANGED
@@ -211,6 +211,12 @@ export declare interface TypedOverride {
211
211
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
212
212
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
213
213
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
214
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
215
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
216
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
217
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
218
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
219
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
214
220
  fontFamilyBase?: GlobalValue;
215
221
  fontFamilyMonospace?: GlobalValue;
216
222
  fontSizeBodyM?: GlobalValue;
@@ -243,6 +249,7 @@ export declare interface TypedOverride {
243
249
  borderRadiusControlCircularFocusRing?: GlobalValue;
244
250
  borderRadiusControlDefaultFocusRing?: GlobalValue;
245
251
  borderRadiusDropdown?: GlobalValue;
252
+ borderRadiusDropzone?: GlobalValue;
246
253
  borderRadiusFlashbar?: GlobalValue;
247
254
  borderRadiusItem?: GlobalValue;
248
255
  borderRadiusInput?: GlobalValue;
@@ -470,6 +477,12 @@ export declare interface TypedOverride {
470
477
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
471
478
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
472
479
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
480
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
481
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
482
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
483
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
484
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
485
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
473
486
  fontFamilyBase?: GlobalValue;
474
487
  fontFamilyMonospace?: GlobalValue;
475
488
  fontSizeBodyM?: GlobalValue;
@@ -502,6 +515,7 @@ export declare interface TypedOverride {
502
515
  borderRadiusControlCircularFocusRing?: GlobalValue;
503
516
  borderRadiusControlDefaultFocusRing?: GlobalValue;
504
517
  borderRadiusDropdown?: GlobalValue;
518
+ borderRadiusDropzone?: GlobalValue;
505
519
  borderRadiusFlashbar?: GlobalValue;
506
520
  borderRadiusItem?: GlobalValue;
507
521
  borderRadiusInput?: GlobalValue;
@@ -729,6 +743,12 @@ export declare interface TypedOverride {
729
743
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
730
744
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
731
745
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
746
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
747
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
748
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
749
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
750
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
751
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
732
752
  fontFamilyBase?: GlobalValue;
733
753
  fontFamilyMonospace?: GlobalValue;
734
754
  fontSizeBodyM?: GlobalValue;
@@ -761,6 +781,7 @@ export declare interface TypedOverride {
761
781
  borderRadiusControlCircularFocusRing?: GlobalValue;
762
782
  borderRadiusControlDefaultFocusRing?: GlobalValue;
763
783
  borderRadiusDropdown?: GlobalValue;
784
+ borderRadiusDropzone?: GlobalValue;
764
785
  borderRadiusFlashbar?: GlobalValue;
765
786
  borderRadiusItem?: GlobalValue;
766
787
  borderRadiusInput?: GlobalValue;
@@ -988,6 +1009,12 @@ export declare interface TypedOverride {
988
1009
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
989
1010
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
990
1011
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1012
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1013
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1014
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1015
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1016
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1017
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
991
1018
  fontFamilyBase?: GlobalValue;
992
1019
  fontFamilyMonospace?: GlobalValue;
993
1020
  fontSizeBodyM?: GlobalValue;
@@ -1020,6 +1047,7 @@ export declare interface TypedOverride {
1020
1047
  borderRadiusControlCircularFocusRing?: GlobalValue;
1021
1048
  borderRadiusControlDefaultFocusRing?: GlobalValue;
1022
1049
  borderRadiusDropdown?: GlobalValue;
1050
+ borderRadiusDropzone?: GlobalValue;
1023
1051
  borderRadiusFlashbar?: GlobalValue;
1024
1052
  borderRadiusItem?: GlobalValue;
1025
1053
  borderRadiusInput?: GlobalValue;
@@ -1247,6 +1275,12 @@ export declare interface TypedOverride {
1247
1275
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1248
1276
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1249
1277
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1278
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1279
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1280
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1281
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1282
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1283
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1250
1284
  fontFamilyBase?: GlobalValue;
1251
1285
  fontFamilyMonospace?: GlobalValue;
1252
1286
  fontSizeBodyM?: GlobalValue;
@@ -1279,6 +1313,7 @@ export declare interface TypedOverride {
1279
1313
  borderRadiusControlCircularFocusRing?: GlobalValue;
1280
1314
  borderRadiusControlDefaultFocusRing?: GlobalValue;
1281
1315
  borderRadiusDropdown?: GlobalValue;
1316
+ borderRadiusDropzone?: GlobalValue;
1282
1317
  borderRadiusFlashbar?: GlobalValue;
1283
1318
  borderRadiusItem?: GlobalValue;
1284
1319
  borderRadiusInput?: GlobalValue;
@@ -1506,6 +1541,12 @@ export declare interface TypedOverride {
1506
1541
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1507
1542
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1508
1543
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1544
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1545
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1546
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1547
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1548
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1549
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1509
1550
  fontFamilyBase?: GlobalValue;
1510
1551
  fontFamilyMonospace?: GlobalValue;
1511
1552
  fontSizeBodyM?: GlobalValue;
@@ -1538,6 +1579,7 @@ export declare interface TypedOverride {
1538
1579
  borderRadiusControlCircularFocusRing?: GlobalValue;
1539
1580
  borderRadiusControlDefaultFocusRing?: GlobalValue;
1540
1581
  borderRadiusDropdown?: GlobalValue;
1582
+ borderRadiusDropzone?: GlobalValue;
1541
1583
  borderRadiusFlashbar?: GlobalValue;
1542
1584
  borderRadiusItem?: GlobalValue;
1543
1585
  borderRadiusInput?: GlobalValue;
@@ -1765,6 +1807,12 @@ export declare interface TypedOverride {
1765
1807
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1766
1808
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1767
1809
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1810
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1811
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1812
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1813
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1814
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1815
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1768
1816
  fontFamilyBase?: GlobalValue;
1769
1817
  fontFamilyMonospace?: GlobalValue;
1770
1818
  fontSizeBodyM?: GlobalValue;
@@ -1797,6 +1845,7 @@ export declare interface TypedOverride {
1797
1845
  borderRadiusControlCircularFocusRing?: GlobalValue;
1798
1846
  borderRadiusControlDefaultFocusRing?: GlobalValue;
1799
1847
  borderRadiusDropdown?: GlobalValue;
1848
+ borderRadiusDropzone?: GlobalValue;
1800
1849
  borderRadiusFlashbar?: GlobalValue;
1801
1850
  borderRadiusItem?: GlobalValue;
1802
1851
  borderRadiusInput?: GlobalValue;
@@ -2024,6 +2073,12 @@ export declare interface TypedOverride {
2024
2073
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2025
2074
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2026
2075
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2076
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2077
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2078
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2079
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2080
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2081
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2027
2082
  fontFamilyBase?: GlobalValue;
2028
2083
  fontFamilyMonospace?: GlobalValue;
2029
2084
  fontSizeBodyM?: GlobalValue;
@@ -2056,6 +2111,7 @@ export declare interface TypedOverride {
2056
2111
  borderRadiusControlCircularFocusRing?: GlobalValue;
2057
2112
  borderRadiusControlDefaultFocusRing?: GlobalValue;
2058
2113
  borderRadiusDropdown?: GlobalValue;
2114
+ borderRadiusDropzone?: GlobalValue;
2059
2115
  borderRadiusFlashbar?: GlobalValue;
2060
2116
  borderRadiusItem?: GlobalValue;
2061
2117
  borderRadiusInput?: GlobalValue;
@@ -2283,6 +2339,12 @@ export declare interface TypedOverride {
2283
2339
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2284
2340
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2285
2341
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2342
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2343
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2344
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2345
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2346
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2347
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2286
2348
  fontFamilyBase?: GlobalValue;
2287
2349
  fontFamilyMonospace?: GlobalValue;
2288
2350
  fontSizeBodyM?: GlobalValue;
@@ -2315,6 +2377,7 @@ export declare interface TypedOverride {
2315
2377
  borderRadiusControlCircularFocusRing?: GlobalValue;
2316
2378
  borderRadiusControlDefaultFocusRing?: GlobalValue;
2317
2379
  borderRadiusDropdown?: GlobalValue;
2380
+ borderRadiusDropzone?: GlobalValue;
2318
2381
  borderRadiusFlashbar?: GlobalValue;
2319
2382
  borderRadiusItem?: GlobalValue;
2320
2383
  borderRadiusInput?: GlobalValue;
package/internal/generated/theming/index.d.ts CHANGED
@@ -211,6 +211,12 @@ export declare interface TypedOverride {
211
211
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
212
212
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
213
213
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
214
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
215
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
216
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
217
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
218
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
219
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
214
220
  fontFamilyBase?: GlobalValue;
215
221
  fontFamilyMonospace?: GlobalValue;
216
222
  fontSizeBodyM?: GlobalValue;
@@ -243,6 +249,7 @@ export declare interface TypedOverride {
243
249
  borderRadiusControlCircularFocusRing?: GlobalValue;
244
250
  borderRadiusControlDefaultFocusRing?: GlobalValue;
245
251
  borderRadiusDropdown?: GlobalValue;
252
+ borderRadiusDropzone?: GlobalValue;
246
253
  borderRadiusFlashbar?: GlobalValue;
247
254
  borderRadiusItem?: GlobalValue;
248
255
  borderRadiusInput?: GlobalValue;
@@ -470,6 +477,12 @@ export declare interface TypedOverride {
470
477
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
471
478
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
472
479
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
480
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
481
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
482
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
483
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
484
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
485
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
473
486
  fontFamilyBase?: GlobalValue;
474
487
  fontFamilyMonospace?: GlobalValue;
475
488
  fontSizeBodyM?: GlobalValue;
@@ -502,6 +515,7 @@ export declare interface TypedOverride {
502
515
  borderRadiusControlCircularFocusRing?: GlobalValue;
503
516
  borderRadiusControlDefaultFocusRing?: GlobalValue;
504
517
  borderRadiusDropdown?: GlobalValue;
518
+ borderRadiusDropzone?: GlobalValue;
505
519
  borderRadiusFlashbar?: GlobalValue;
506
520
  borderRadiusItem?: GlobalValue;
507
521
  borderRadiusInput?: GlobalValue;
@@ -729,6 +743,12 @@ export declare interface TypedOverride {
729
743
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
730
744
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
731
745
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
746
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
747
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
748
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
749
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
750
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
751
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
732
752
  fontFamilyBase?: GlobalValue;
733
753
  fontFamilyMonospace?: GlobalValue;
734
754
  fontSizeBodyM?: GlobalValue;
@@ -761,6 +781,7 @@ export declare interface TypedOverride {
761
781
  borderRadiusControlCircularFocusRing?: GlobalValue;
762
782
  borderRadiusControlDefaultFocusRing?: GlobalValue;
763
783
  borderRadiusDropdown?: GlobalValue;
784
+ borderRadiusDropzone?: GlobalValue;
764
785
  borderRadiusFlashbar?: GlobalValue;
765
786
  borderRadiusItem?: GlobalValue;
766
787
  borderRadiusInput?: GlobalValue;
@@ -988,6 +1009,12 @@ export declare interface TypedOverride {
988
1009
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
989
1010
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
990
1011
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1012
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1013
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1014
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1015
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1016
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1017
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
991
1018
  fontFamilyBase?: GlobalValue;
992
1019
  fontFamilyMonospace?: GlobalValue;
993
1020
  fontSizeBodyM?: GlobalValue;
@@ -1020,6 +1047,7 @@ export declare interface TypedOverride {
1020
1047
  borderRadiusControlCircularFocusRing?: GlobalValue;
1021
1048
  borderRadiusControlDefaultFocusRing?: GlobalValue;
1022
1049
  borderRadiusDropdown?: GlobalValue;
1050
+ borderRadiusDropzone?: GlobalValue;
1023
1051
  borderRadiusFlashbar?: GlobalValue;
1024
1052
  borderRadiusItem?: GlobalValue;
1025
1053
  borderRadiusInput?: GlobalValue;
@@ -1247,6 +1275,12 @@ export declare interface TypedOverride {
1247
1275
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1248
1276
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1249
1277
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1278
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1279
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1280
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1281
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1282
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1283
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1250
1284
  fontFamilyBase?: GlobalValue;
1251
1285
  fontFamilyMonospace?: GlobalValue;
1252
1286
  fontSizeBodyM?: GlobalValue;
@@ -1279,6 +1313,7 @@ export declare interface TypedOverride {
1279
1313
  borderRadiusControlCircularFocusRing?: GlobalValue;
1280
1314
  borderRadiusControlDefaultFocusRing?: GlobalValue;
1281
1315
  borderRadiusDropdown?: GlobalValue;
1316
+ borderRadiusDropzone?: GlobalValue;
1282
1317
  borderRadiusFlashbar?: GlobalValue;
1283
1318
  borderRadiusItem?: GlobalValue;
1284
1319
  borderRadiusInput?: GlobalValue;
@@ -1506,6 +1541,12 @@ export declare interface TypedOverride {
1506
1541
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1507
1542
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1508
1543
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1544
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1545
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1546
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1547
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1548
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1549
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1509
1550
  fontFamilyBase?: GlobalValue;
1510
1551
  fontFamilyMonospace?: GlobalValue;
1511
1552
  fontSizeBodyM?: GlobalValue;
@@ -1538,6 +1579,7 @@ export declare interface TypedOverride {
1538
1579
  borderRadiusControlCircularFocusRing?: GlobalValue;
1539
1580
  borderRadiusControlDefaultFocusRing?: GlobalValue;
1540
1581
  borderRadiusDropdown?: GlobalValue;
1582
+ borderRadiusDropzone?: GlobalValue;
1541
1583
  borderRadiusFlashbar?: GlobalValue;
1542
1584
  borderRadiusItem?: GlobalValue;
1543
1585
  borderRadiusInput?: GlobalValue;
@@ -1765,6 +1807,12 @@ export declare interface TypedOverride {
1765
1807
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1766
1808
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1767
1809
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1810
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1811
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1812
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1813
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1814
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1815
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
1768
1816
  fontFamilyBase?: GlobalValue;
1769
1817
  fontFamilyMonospace?: GlobalValue;
1770
1818
  fontSizeBodyM?: GlobalValue;
@@ -1797,6 +1845,7 @@ export declare interface TypedOverride {
1797
1845
  borderRadiusControlCircularFocusRing?: GlobalValue;
1798
1846
  borderRadiusControlDefaultFocusRing?: GlobalValue;
1799
1847
  borderRadiusDropdown?: GlobalValue;
1848
+ borderRadiusDropzone?: GlobalValue;
1800
1849
  borderRadiusFlashbar?: GlobalValue;
1801
1850
  borderRadiusItem?: GlobalValue;
1802
1851
  borderRadiusInput?: GlobalValue;
@@ -2024,6 +2073,12 @@ export declare interface TypedOverride {
2024
2073
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2025
2074
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2026
2075
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2076
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2077
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2078
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2079
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2080
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2081
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2027
2082
  fontFamilyBase?: GlobalValue;
2028
2083
  fontFamilyMonospace?: GlobalValue;
2029
2084
  fontSizeBodyM?: GlobalValue;
@@ -2056,6 +2111,7 @@ export declare interface TypedOverride {
2056
2111
  borderRadiusControlCircularFocusRing?: GlobalValue;
2057
2112
  borderRadiusControlDefaultFocusRing?: GlobalValue;
2058
2113
  borderRadiusDropdown?: GlobalValue;
2114
+ borderRadiusDropzone?: GlobalValue;
2059
2115
  borderRadiusFlashbar?: GlobalValue;
2060
2116
  borderRadiusItem?: GlobalValue;
2061
2117
  borderRadiusInput?: GlobalValue;
@@ -2283,6 +2339,12 @@ export declare interface TypedOverride {
2283
2339
  colorTextStatusSuccess?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2284
2340
  colorTextStatusWarning?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2285
2341
  colorTextTopNavigationTitle?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2342
+ colorDropzoneBackgroundDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2343
+ colorDropzoneBackgroundHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2344
+ colorDropzoneTextDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2345
+ colorDropzoneTextHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2346
+ colorDropzoneBorderDefault?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2347
+ colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
2286
2348
  fontFamilyBase?: GlobalValue;
2287
2349
  fontFamilyMonospace?: GlobalValue;
2288
2350
  fontSizeBodyM?: GlobalValue;
@@ -2315,6 +2377,7 @@ export declare interface TypedOverride {
2315
2377
  borderRadiusControlCircularFocusRing?: GlobalValue;
2316
2378
  borderRadiusControlDefaultFocusRing?: GlobalValue;
2317
2379
  borderRadiusDropdown?: GlobalValue;
2380
+ borderRadiusDropzone?: GlobalValue;
2318
2381
  borderRadiusFlashbar?: GlobalValue;
2319
2382
  borderRadiusItem?: GlobalValue;
2320
2383
  borderRadiusInput?: GlobalValue;
package/internal/generated/theming/index.js CHANGED
@@ -10614,6 +10614,12 @@ export var preset = {
10614
10614
  "colorTextStatusSuccess",
10615
10615
  "colorTextStatusWarning",
10616
10616
  "colorTextTopNavigationTitle",
10617
+ "colorDropzoneBackgroundDefault",
10618
+ "colorDropzoneBackgroundHover",
10619
+ "colorDropzoneTextDefault",
10620
+ "colorDropzoneTextHover",
10621
+ "colorDropzoneBorderDefault",
10622
+ "colorDropzoneBorderHover",
10617
10623
  "fontFamilyBase",
10618
10624
  "fontFamilyMonospace",
10619
10625
  "fontSizeBodyM",
@@ -10646,6 +10652,7 @@ export var preset = {
10646
10652
  "borderRadiusControlCircularFocusRing",
10647
10653
  "borderRadiusControlDefaultFocusRing",
10648
10654
  "borderRadiusDropdown",
10655
+ "borderRadiusDropzone",
10649
10656
  "borderRadiusFlashbar",
10650
10657
  "borderRadiusItem",
10651
10658
  "borderRadiusInput",
@@ -10969,6 +10976,12 @@ export var preset = {
10969
10976
  "colorBoardPlaceholderHover",
10970
10977
  "colorDragPlaceholderActive",
10971
10978
  "colorDragPlaceholderHover",
10979
+ "colorDropzoneBackgroundDefault",
10980
+ "colorDropzoneBackgroundHover",
10981
+ "colorDropzoneTextDefault",
10982
+ "colorDropzoneTextHover",
10983
+ "colorDropzoneBorderDefault",
10984
+ "colorDropzoneBorderHover",
10972
10985
  "fontFamilyBase",
10973
10986
  "fontFamilyMonospace",
10974
10987
  "fontSizeBodyM",
@@ -11001,6 +11014,7 @@ export var preset = {
11001
11014
  "borderRadiusControlCircularFocusRing",
11002
11015
  "borderRadiusControlDefaultFocusRing",
11003
11016
  "borderRadiusDropdown",
11017
+ "borderRadiusDropzone",
11004
11018
  "borderRadiusFlashbar",
11005
11019
  "borderRadiusItem",
11006
11020
  "borderRadiusInput",
package/internal/item-container/index.js CHANGED
@@ -5,7 +5,7 @@ import { createContext, forwardRef, useContext, useImperativeHandle, useRef, use
5
5
  import { createPortal } from "react-dom";
6
6
  import { CSS as CSSUtil } from "@dnd-kit/utilities";
7
7
  import clsx from "clsx";
8
- import { getLogicalBoundingClientRect } from "@cloudscape-design/component-toolkit/internal";
8
+ import { createSingletonHandler, getLogicalBoundingClientRect } from "@cloudscape-design/component-toolkit/internal";
9
9
  import { useInternalDragHandleInteractionState, } from "@cloudscape-design/components/internal/do-not-use/drag-handle";
10
10
  import { useDraggable, useDragSubscription, } from "../dnd-controller/controller";
11
11
  import { Coordinates } from "../utils/coordinates";
@@ -29,6 +29,15 @@ export const ItemContainer = forwardRef(ItemContainerComponent);
29
29
  // a drag. A little allowance is needed for usability reasons, but this number
30
30
  // isn't set in stone.
31
31
  export const CLICK_DRAG_THRESHOLD = 3;
32
+ // We use singleton helper to avoid creating event listeners per each board item.
33
+ const usePointerEventListeners = createSingletonHandler((setEvent) => {
34
+ const handleGlobalPointerMove = (event) => setEvent({ type: "move", event });
35
+ const handleGlobalPointerUp = (event) => setEvent({ type: "up", event });
36
+ const controller = new AbortController();
37
+ window.addEventListener("pointermove", handleGlobalPointerMove, { signal: controller.signal });
38
+ window.addEventListener("pointerup", handleGlobalPointerUp, { signal: controller.signal });
39
+ return () => controller.abort();
40
+ });
32
41
  function ItemContainerComponent({ item, placed, acquired, inTransition, transform, getItemSize, onKeyMove, children, isRtl }, ref) {
33
42
  var _a, _b, _c, _d;
34
43
  const originalSizeRef = useRef({ width: 0, height: 0 });
@@ -38,6 +47,8 @@ function ItemContainerComponent({ item, placed, acquired, inTransition, transfor
38
47
  const [isHidden, setIsHidden] = useState(false);
39
48
  const muteEventsRef = useRef(false);
40
49
  const itemRef = useRef(null);
50
+ // Keeps the starting position of active pointer-based d&d transition.
51
+ // If undefined - it means the pointer-based d&d is not engaged.
41
52
  const initialPointerDownPosition = useRef();
42
53
  const draggableApi = useDraggable({
43
54
  draggableItem: item,
@@ -144,6 +155,13 @@ function ItemContainerComponent({ item, placed, acquired, inTransition, transfor
144
155
  }
145
156
  }
146
157
  function onHandleKeyDown(operation, event) {
158
+ // We do not expect keyboard input when pointer-based d&d is performed.
159
+ // Upon receiving any, we discard the current transition immediately.
160
+ if (transition && initialPointerDownPosition.current) {
161
+ initialPointerDownPosition.current = undefined;
162
+ draggableApi.discardTransition();
163
+ return;
164
+ }
147
165
  const discard = () => {
148
166
  if (transition || acquired) {
149
167
  draggableApi.discardTransition();
@@ -170,24 +188,13 @@ function ItemContainerComponent({ item, placed, acquired, inTransition, transfor
170
188
  // 1. If the last interaction is not "keyboard" (the user clicked on another handle issuing a new transition);
171
189
  // 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).
172
190
  selectedHook.current.processBlur();
173
- initialPointerDownPosition.current = undefined;
174
191
  if (acquired || (transition && transition.interactionType === "keyboard" && !muteEventsRef.current)) {
192
+ initialPointerDownPosition.current = undefined;
175
193
  draggableApi.submitTransition();
176
194
  }
177
195
  }
178
- function handleGlobalPointerMove(event) {
179
- if (hasPointerMovedBeyondThreshold(event, initialPointerDownPosition.current)) {
180
- selectedHook.current.processPointerMove(event);
181
- }
182
- }
183
- function handleGlobalPointerUp(event) {
184
- selectedHook.current.processPointerUp(event);
185
- initialPointerDownPosition.current = undefined;
186
- // Clean up global listeners after interaction ends
187
- window.removeEventListener("pointermove", handleGlobalPointerMove);
188
- window.removeEventListener("pointerup", handleGlobalPointerUp);
189
- }
190
- function onDragHandlePointerDown(event, operation) {
196
+ // Pointer-down handler, added to each drag- and resize handle.
197
+ function onHandlePointerDown(event, operation) {
191
198
  // Prevent UI issues when right-clicking: in such a case the OS context menu will be shown and
192
199
  // the board while the board-item is active. Because of the context menu under the pointer,
193
200
  // onPointerUp is not called anymore. In such a case the board item would stuck in onPointerUp.
@@ -202,10 +209,25 @@ function ItemContainerComponent({ item, placed, acquired, inTransition, transfor
202
209
  selectedHook.current = resizeInteractionHook;
203
210
  }
204
211
  selectedHook.current.processPointerDown(event.nativeEvent);
205
- // If pointerdown is on our button, start listening for global move and up
206
- window.addEventListener("pointermove", handleGlobalPointerMove);
207
- window.addEventListener("pointerup", handleGlobalPointerUp);
208
212
  }
213
+ // Global pointer-move and pointer-up handlers.
214
+ usePointerEventListeners(({ type, event }) => {
215
+ switch (type) {
216
+ case "move": {
217
+ if (hasPointerMovedBeyondThreshold(event, initialPointerDownPosition.current)) {
218
+ selectedHook.current.processPointerMove(event);
219
+ }
220
+ break;
221
+ }
222
+ case "up": {
223
+ if (initialPointerDownPosition.current) {
224
+ selectedHook.current.processPointerUp(event);
225
+ }
226
+ initialPointerDownPosition.current = undefined;
227
+ break;
228
+ }
229
+ }
230
+ });
209
231
  function handlePointerInteractionStart(event, operation) {
210
232
  const currentItemElement = itemRef.current;
211
233
  if (!currentItemElement) {
@@ -290,9 +312,10 @@ function ItemContainerComponent({ item, placed, acquired, inTransition, transfor
290
312
  onDndEndAction: () => transition && draggableApi.submitTransition(),
291
313
  onUapActionStartAction: () => handleIncrementalTransition("resize"),
292
314
  };
315
+ // When d&d is active, either drag- or resize hook should be used.
316
+ // We determine the correct one in the onHandlePointerDown handler, and store it to the selectedHook ref.
293
317
  const dragInteractionHook = useInternalDragHandleInteractionState(dragHookProps);
294
318
  const resizeInteractionHook = useInternalDragHandleInteractionState(resizeHookProps);
295
- // We use a ref to the hook for the handle which is currently active. Distinguishment is managed in the handle button's onPointerDown callback.
296
319
  const selectedHook = useRef(dragInteractionHook);
297
320
  const isActive = (!!transition && !isHidden) || !!acquired;
298
321
  const shouldUsePortal = (transition === null || transition === void 0 ? void 0 : transition.operation) === "insert" &&
@@ -307,7 +330,7 @@ function ItemContainerComponent({ item, placed, acquired, inTransition, transfor
307
330
  isHidden,
308
331
  dragHandle: {
309
332
  ref: dragHandleRef,
310
- onPointerDown: (e) => onDragHandlePointerDown(e, "drag"),
333
+ onPointerDown: (e) => onHandlePointerDown(e, "drag"),
311
334
  onKeyDown: (event) => onHandleKeyDown("drag", event),
312
335
  activeState: determineHandleActiveState({
313
336
  isHandleActive: isActive,
@@ -320,7 +343,7 @@ function ItemContainerComponent({ item, placed, acquired, inTransition, transfor
320
343
  },
321
344
  resizeHandle: placed
322
345
  ? {
323
- onPointerDown: (e) => onDragHandlePointerDown(e, "resize"),
346
+ onPointerDown: (e) => onHandlePointerDown(e, "resize"),
324
347
  onKeyDown: (event) => onHandleKeyDown("resize", event),
325
348
  activeState: determineHandleActiveState({
326
349
  isHandleActive: isActive,
package/internal/item-container/index.js.map CHANGED
@@ -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 {\n createContext,\n CSSProperties,\n forwardRef,\n KeyboardEvent,\n PointerEvent as ReactPointerEvent,\n ReactNode,\n Ref,\n RefObject,\n useContext,\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 } from \"@cloudscape-design/component-toolkit/internal\";\nimport {\n useInternalDragHandleInteractionState,\n UseInternalDragHandleInteractionStateProps,\n} from \"@cloudscape-design/components/internal/do-not-use/drag-handle\";\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\";\nimport {\n calculateInitialPointerData,\n determineHandleActiveState,\n getDndOperationType,\n hasPointerMovedBeyondThreshold,\n} from \"./utils\";\n\nimport styles from \"./styles.css.js\";\n\nexport interface ItemContainerRef {\n focusDragHandle(): void;\n}\n\nexport type HandleActiveState = null | \"pointer\" | \"uap\";\n\ninterface ItemContextType {\n /**\n * Flag indicating if a drag or resize interaction is currently active.\n */\n isActive: boolean;\n /**\n * Flag indicating if the item is currently hidden.\n * (When a board item is moved from the palette to the board and the transition is not submitted)\n */\n isHidden: boolean;\n dragHandle: {\n /**\n * Ref to the drag button. Used to focus the drag handle when moving an item\n * from the palette to the board via keyboard or UAP actions.\n */\n ref: RefObject<HTMLDivElement>;\n /**\n * Listen to pointerDown events on the drag handle.\n * Used to start a transition and attach global event handlers.\n */\n onPointerDown(event: ReactPointerEvent): void;\n /**\n * Listen to keyDown events on the drag handle.\n */\n onKeyDown(event: KeyboardEvent): void;\n /**\n * Indicating if drag handle is active.\n */\n activeState: HandleActiveState;\n /**\n * Listen to UAP direction button clicks.\n */\n onDirectionClick(direction: KeyboardEvent[\"key\"], operation: HandleOperation): void;\n /**\n * Flag indicating if the UAP buttons should be shown. E.g. when a item is moved from\n * the palette via keyboard or UAP to the board.\n */\n initialShowButtons?: boolean;\n };\n resizeHandle: null | {\n /**\n * Listen to pointerDown events on the drag handle.\n * Used to start a transition and attach global event handlers.\n */\n onPointerDown(event: ReactPointerEvent): void;\n /**\n * Listen to keyDown events on the drag handle.\n */\n onKeyDown(event: KeyboardEvent): void;\n /**\n * Indicating if resize handle is active.\n */\n activeState: HandleActiveState;\n /**\n * Listen to UAP direction button clicks.\n */\n onDirectionClick(direction: KeyboardEvent[\"key\"], operation: HandleOperation): void;\n };\n}\n\nexport interface 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\nexport type HandleOperation = \"drag\" | \"resize\";\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\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\n onKeyMove?(direction: Direction): void;\n\n children: (hasDropTarget: boolean) => ReactNode;\n isRtl: () => boolean;\n}\n\nexport const ItemContainer = forwardRef(ItemContainerComponent);\n\n// The amount of distance after pointer down that the cursor is allowed to\n// jitter for a subsequent mouseup to still register as a \"press\" instead of\n// a drag. A little allowance is needed for usability reasons, but this number\n// isn't set in stone.\nexport const CLICK_DRAG_THRESHOLD = 3;\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 initialPointerDownPosition = useRef<{ x: number; y: number } | undefined>();\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 // Handles incremental transition logic shared between different keyboard and UAP interactions.\n function handleIncrementalTransition(operation: HandleOperation, submitExisting = false) {\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 // Submit existing transition if requested and one exists\n if (submitExisting && transition) {\n return draggableApi.submitTransition();\n }\n\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\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 handleDirectionalMovement(direction: Direction, operation: HandleOperation) {\n const canInsert = transition && operation === \"drag\" && !placed;\n const canNavigate = transition || operation === \"drag\";\n if (canInsert) {\n handleInsert(direction);\n } else if (canNavigate) {\n onKeyMove?.(direction);\n }\n }\n\n function onHandleKeyDown(operation: HandleOperation, event: KeyboardEvent) {\n const discard = () => {\n if (transition || acquired) {\n draggableApi.discardTransition();\n }\n };\n\n switch (event.key) {\n case \"ArrowUp\":\n return handleDirectionalMovement(\"up\", operation);\n case \"ArrowDown\":\n return handleDirectionalMovement(\"down\", operation);\n case \"ArrowLeft\":\n return handleDirectionalMovement(\"left\", operation);\n case \"ArrowRight\":\n return handleDirectionalMovement(\"right\", operation);\n case \" \":\n case \"Enter\":\n return handleIncrementalTransition(operation, true);\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 selectedHook.current.processBlur();\n initialPointerDownPosition.current = undefined;\n if (acquired || (transition && transition.interactionType === \"keyboard\" && !muteEventsRef.current)) {\n draggableApi.submitTransition();\n }\n }\n\n function handleGlobalPointerMove(event: PointerEvent) {\n if (hasPointerMovedBeyondThreshold(event, initialPointerDownPosition.current)) {\n selectedHook.current.processPointerMove(event);\n }\n }\n\n function handleGlobalPointerUp(event: PointerEvent) {\n selectedHook.current.processPointerUp(event);\n initialPointerDownPosition.current = undefined;\n // Clean up global listeners after interaction ends\n window.removeEventListener(\"pointermove\", handleGlobalPointerMove);\n window.removeEventListener(\"pointerup\", handleGlobalPointerUp);\n }\n\n function onDragHandlePointerDown(event: ReactPointerEvent, operation: HandleOperation) {\n // Prevent UI issues when right-clicking: in such a case the OS context menu will be shown and\n // the board while the board-item is active. Because of the context menu under the pointer,\n // onPointerUp is not called anymore. In such a case the board item would stuck in onPointerUp.\n if (event.button !== 0) {\n return;\n }\n initialPointerDownPosition.current = { x: event.clientX, y: event.clientY };\n\n if (operation === \"drag\") {\n selectedHook.current = dragInteractionHook;\n } else {\n selectedHook.current = resizeInteractionHook;\n }\n selectedHook.current.processPointerDown(event.nativeEvent);\n\n // If pointerdown is on our button, start listening for global move and up\n window.addEventListener(\"pointermove\", handleGlobalPointerMove);\n window.addEventListener(\"pointerup\", handleGlobalPointerUp);\n }\n\n function handlePointerInteractionStart(event: PointerEvent, operation: \"drag\" | \"resize\") {\n const currentItemElement = itemRef.current;\n if (!currentItemElement) {\n console.warn(\"ItemContainer: itemRef.current is not available on interaction start.\");\n return;\n }\n\n const rect = getLogicalBoundingClientRect(currentItemElement);\n originalSizeRef.current = { width: rect.inlineSize, height: rect.blockSize };\n\n const { pointerOffset, pointerBoundaries } = calculateInitialPointerData({\n event,\n operation,\n rect,\n getMinSize: () => getItemSize(null),\n isRtl: isRtl(),\n });\n pointerOffsetRef.current = pointerOffset;\n pointerBoundariesRef.current = pointerBoundaries;\n\n const dndOperation = getDndOperationType(operation, placed);\n const startCoordinates = Coordinates.fromEvent(event, { isRtl: isRtl() });\n draggableApi.start(dndOperation, \"pointer\", startCoordinates);\n }\n\n const onHandleDndTransitionActive = 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) as (event: PointerEvent) => void;\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<HTMLDivElement>(null);\n useImperativeHandle(ref, () => ({\n focusDragHandle: () => {\n return dragHandleRef.current?.focus();\n },\n }));\n\n const dragHookProps: UseInternalDragHandleInteractionStateProps = {\n onDndStartAction: (event) => handlePointerInteractionStart(event, \"drag\"),\n onDndActiveAction: onHandleDndTransitionActive,\n onDndEndAction: () => transition && draggableApi.submitTransition(),\n onUapActionStartAction: () => handleIncrementalTransition(\"drag\"),\n };\n const resizeHookProps: UseInternalDragHandleInteractionStateProps = {\n onDndStartAction: (event) => handlePointerInteractionStart(event, \"resize\"),\n onDndActiveAction: onHandleDndTransitionActive,\n onDndEndAction: () => transition && draggableApi.submitTransition(),\n onUapActionStartAction: () => handleIncrementalTransition(\"resize\"),\n };\n const dragInteractionHook = useInternalDragHandleInteractionState(dragHookProps);\n const resizeInteractionHook = useInternalDragHandleInteractionState(resizeHookProps);\n // We use a ref to the hook for the handle which is currently active. Distinguishment is managed in the handle button's onPointerDown callback.\n const selectedHook = useRef(dragInteractionHook);\n\n const isActive = (!!transition && !isHidden) || !!acquired;\n const shouldUsePortal =\n transition?.operation === \"insert\" &&\n transition?.interactionType === \"pointer\" &&\n selectedHook.current.interaction.value === \"dnd-active\";\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 isHidden,\n dragHandle: {\n ref: dragHandleRef,\n onPointerDown: (e) => onDragHandlePointerDown(e, \"drag\"),\n onKeyDown: (event: KeyboardEvent) => onHandleKeyDown(\"drag\", event),\n activeState: determineHandleActiveState({\n isHandleActive: isActive,\n currentTransition: transition,\n interactionHookValue: dragInteractionHook.interaction.value,\n targetOperation: \"reorder\",\n }),\n onDirectionClick: handleDirectionalMovement,\n initialShowButtons:\n dragInteractionHook.interaction.value === \"uap-action-start\" || (inTransition && acquired),\n },\n resizeHandle: placed\n ? {\n onPointerDown: (e) => onDragHandlePointerDown(e, \"resize\"),\n onKeyDown: (event: KeyboardEvent) => onHandleKeyDown(\"resize\", event),\n activeState: determineHandleActiveState({\n isHandleActive: isActive,\n currentTransition: transition,\n interactionHookValue: resizeInteractionHook.interaction.value,\n targetOperation: \"resize\",\n }),\n onDirectionClick: handleDirectionalMovement,\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 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 { createSingletonHandler, getLogicalBoundingClientRect } from \"@cloudscape-design/component-toolkit/internal\";\nimport {\n useInternalDragHandleInteractionState,\n UseInternalDragHandleInteractionStateProps,\n} from \"@cloudscape-design/components/internal/do-not-use/drag-handle\";\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\";\nimport {\n calculateInitialPointerData,\n determineHandleActiveState,\n getDndOperationType,\n hasPointerMovedBeyondThreshold,\n} from \"./utils\";\n\nimport styles from \"./styles.css.js\";\n\nexport interface ItemContainerRef {\n focusDragHandle(): void;\n}\n\nexport type HandleActiveState = null | \"pointer\" | \"uap\";\n\ninterface ItemContextType {\n /**\n * Flag indicating if a drag or resize interaction is currently active.\n */\n isActive: boolean;\n /**\n * Flag indicating if the item is currently hidden.\n * (When a board item is moved from the palette to the board and the transition is not submitted)\n */\n isHidden: boolean;\n dragHandle: {\n /**\n * Ref to the drag button. Used to focus the drag handle when moving an item\n * from the palette to the board via keyboard or UAP actions.\n */\n ref: RefObject<HTMLDivElement>;\n /**\n * Listen to pointerDown events on the drag handle.\n * Used to start a transition and attach global event handlers.\n */\n onPointerDown(event: ReactPointerEvent): void;\n /**\n * Listen to keyDown events on the drag handle.\n */\n onKeyDown(event: KeyboardEvent): void;\n /**\n * Indicating if drag handle is active.\n */\n activeState: HandleActiveState;\n /**\n * Listen to UAP direction button clicks.\n */\n onDirectionClick(direction: KeyboardEvent[\"key\"], operation: HandleOperation): void;\n /**\n * Flag indicating if the UAP buttons should be shown. E.g. when a item is moved from\n * the palette via keyboard or UAP to the board.\n */\n initialShowButtons?: boolean;\n };\n resizeHandle: null | {\n /**\n * Listen to pointerDown events on the drag handle.\n * Used to start a transition and attach global event handlers.\n */\n onPointerDown(event: ReactPointerEvent): void;\n /**\n * Listen to keyDown events on the drag handle.\n */\n onKeyDown(event: KeyboardEvent): void;\n /**\n * Indicating if resize handle is active.\n */\n activeState: HandleActiveState;\n /**\n * Listen to UAP direction button clicks.\n */\n onDirectionClick(direction: KeyboardEvent[\"key\"], operation: HandleOperation): void;\n };\n}\n\nexport interface 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\nexport type HandleOperation = \"drag\" | \"resize\";\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\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\n onKeyMove?(direction: Direction): void;\n\n children: (hasDropTarget: boolean) => ReactNode;\n isRtl: () => boolean;\n}\n\nexport const ItemContainer = forwardRef(ItemContainerComponent);\n\n// The amount of distance after pointer down that the cursor is allowed to\n// jitter for a subsequent mouseup to still register as a \"press\" instead of\n// a drag. A little allowance is needed for usability reasons, but this number\n// isn't set in stone.\nexport const CLICK_DRAG_THRESHOLD = 3;\n\n// We use singleton helper to avoid creating event listeners per each board item.\nconst usePointerEventListeners = createSingletonHandler<\n { type: \"move\"; event: PointerEvent } | { type: \"up\"; event: PointerEvent }\n>((setEvent) => {\n const handleGlobalPointerMove = (event: PointerEvent) => setEvent({ type: \"move\", event });\n const handleGlobalPointerUp = (event: PointerEvent) => setEvent({ type: \"up\", event });\n const controller = new AbortController();\n window.addEventListener(\"pointermove\", handleGlobalPointerMove, { signal: controller.signal });\n window.addEventListener(\"pointerup\", handleGlobalPointerUp, { signal: controller.signal });\n return () => controller.abort();\n});\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 // Keeps the starting position of active pointer-based d&d transition.\n // If undefined - it means the pointer-based d&d is not engaged.\n const initialPointerDownPosition = useRef<{ x: number; y: number } | undefined>();\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 // Handles incremental transition logic shared between different keyboard and UAP interactions.\n function handleIncrementalTransition(operation: HandleOperation, submitExisting = false) {\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 // Submit existing transition if requested and one exists\n if (submitExisting && transition) {\n return draggableApi.submitTransition();\n }\n\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\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 handleDirectionalMovement(direction: Direction, operation: HandleOperation) {\n const canInsert = transition && operation === \"drag\" && !placed;\n const canNavigate = transition || operation === \"drag\";\n if (canInsert) {\n handleInsert(direction);\n } else if (canNavigate) {\n onKeyMove?.(direction);\n }\n }\n\n function onHandleKeyDown(operation: HandleOperation, event: KeyboardEvent) {\n // We do not expect keyboard input when pointer-based d&d is performed.\n // Upon receiving any, we discard the current transition immediately.\n if (transition && initialPointerDownPosition.current) {\n initialPointerDownPosition.current = undefined;\n draggableApi.discardTransition();\n return;\n }\n\n const discard = () => {\n if (transition || acquired) {\n draggableApi.discardTransition();\n }\n };\n switch (event.key) {\n case \"ArrowUp\":\n return handleDirectionalMovement(\"up\", operation);\n case \"ArrowDown\":\n return handleDirectionalMovement(\"down\", operation);\n case \"ArrowLeft\":\n return handleDirectionalMovement(\"left\", operation);\n case \"ArrowRight\":\n return handleDirectionalMovement(\"right\", operation);\n case \" \":\n case \"Enter\":\n return handleIncrementalTransition(operation, true);\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 selectedHook.current.processBlur();\n\n if (acquired || (transition && transition.interactionType === \"keyboard\" && !muteEventsRef.current)) {\n initialPointerDownPosition.current = undefined;\n draggableApi.submitTransition();\n }\n }\n\n // Pointer-down handler, added to each drag- and resize handle.\n function onHandlePointerDown(event: ReactPointerEvent, operation: HandleOperation) {\n // Prevent UI issues when right-clicking: in such a case the OS context menu will be shown and\n // the board while the board-item is active. Because of the context menu under the pointer,\n // onPointerUp is not called anymore. In such a case the board item would stuck in onPointerUp.\n if (event.button !== 0) {\n return;\n }\n initialPointerDownPosition.current = { x: event.clientX, y: event.clientY };\n\n if (operation === \"drag\") {\n selectedHook.current = dragInteractionHook;\n } else {\n selectedHook.current = resizeInteractionHook;\n }\n selectedHook.current.processPointerDown(event.nativeEvent);\n }\n // Global pointer-move and pointer-up handlers.\n usePointerEventListeners(({ type, event }) => {\n switch (type) {\n case \"move\": {\n if (hasPointerMovedBeyondThreshold(event, initialPointerDownPosition.current)) {\n selectedHook.current.processPointerMove(event);\n }\n break;\n }\n case \"up\": {\n if (initialPointerDownPosition.current) {\n selectedHook.current.processPointerUp(event);\n }\n initialPointerDownPosition.current = undefined;\n break;\n }\n }\n });\n\n function handlePointerInteractionStart(event: PointerEvent, operation: \"drag\" | \"resize\") {\n const currentItemElement = itemRef.current;\n if (!currentItemElement) {\n console.warn(\"ItemContainer: itemRef.current is not available on interaction start.\");\n return;\n }\n\n const rect = getLogicalBoundingClientRect(currentItemElement);\n originalSizeRef.current = { width: rect.inlineSize, height: rect.blockSize };\n\n const { pointerOffset, pointerBoundaries } = calculateInitialPointerData({\n event,\n operation,\n rect,\n getMinSize: () => getItemSize(null),\n isRtl: isRtl(),\n });\n pointerOffsetRef.current = pointerOffset;\n pointerBoundariesRef.current = pointerBoundaries;\n\n const dndOperation = getDndOperationType(operation, placed);\n const startCoordinates = Coordinates.fromEvent(event, { isRtl: isRtl() });\n draggableApi.start(dndOperation, \"pointer\", startCoordinates);\n }\n\n const onHandleDndTransitionActive = 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) as (event: PointerEvent) => void;\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<HTMLDivElement>(null);\n useImperativeHandle(ref, () => ({\n focusDragHandle: () => {\n return dragHandleRef.current?.focus();\n },\n }));\n\n const dragHookProps: UseInternalDragHandleInteractionStateProps = {\n onDndStartAction: (event) => handlePointerInteractionStart(event, \"drag\"),\n onDndActiveAction: onHandleDndTransitionActive,\n onDndEndAction: () => transition && draggableApi.submitTransition(),\n onUapActionStartAction: () => handleIncrementalTransition(\"drag\"),\n };\n const resizeHookProps: UseInternalDragHandleInteractionStateProps = {\n onDndStartAction: (event) => handlePointerInteractionStart(event, \"resize\"),\n onDndActiveAction: onHandleDndTransitionActive,\n onDndEndAction: () => transition && draggableApi.submitTransition(),\n onUapActionStartAction: () => handleIncrementalTransition(\"resize\"),\n };\n\n // When d&d is active, either drag- or resize hook should be used.\n // We determine the correct one in the onHandlePointerDown handler, and store it to the selectedHook ref.\n const dragInteractionHook = useInternalDragHandleInteractionState(dragHookProps);\n const resizeInteractionHook = useInternalDragHandleInteractionState(resizeHookProps);\n const selectedHook = useRef(dragInteractionHook);\n\n const isActive = (!!transition && !isHidden) || !!acquired;\n const shouldUsePortal =\n transition?.operation === \"insert\" &&\n transition?.interactionType === \"pointer\" &&\n selectedHook.current.interaction.value === \"dnd-active\";\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 isHidden,\n dragHandle: {\n ref: dragHandleRef,\n onPointerDown: (e) => onHandlePointerDown(e, \"drag\"),\n onKeyDown: (event: KeyboardEvent) => onHandleKeyDown(\"drag\", event),\n activeState: determineHandleActiveState({\n isHandleActive: isActive,\n currentTransition: transition,\n interactionHookValue: dragInteractionHook.interaction.value,\n targetOperation: \"reorder\",\n }),\n onDirectionClick: handleDirectionalMovement,\n initialShowButtons:\n dragInteractionHook.interaction.value === \"uap-action-start\" || (inTransition && acquired),\n },\n resizeHandle: placed\n ? {\n onPointerDown: (e) => onHandlePointerDown(e, \"resize\"),\n onKeyDown: (event: KeyboardEvent) => onHandleKeyDown(\"resize\", event),\n activeState: determineHandleActiveState({\n isHandleActive: isActive,\n currentTransition: transition,\n interactionHookValue: resizeInteractionHook.interaction.value,\n targetOperation: \"resize\",\n }),\n onDirectionClick: handleDirectionalMovement,\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/manifest.json CHANGED
@@ -1,3 +1,3 @@
1
1
  {
2
- "commit": "8ff00c05e8c806e6f6501b6160cd79f15d94b0e6"
2
+ "commit": "a61290b027cd2de2e208e647435581783056f6e4"
3
3
  }
package/internal/utils/use-auto-scroll.d.ts CHANGED
@@ -1,5 +1,16 @@
1
- export declare function useAutoScroll(): {
2
- addPointerEventHandlers: () => void;
3
- removePointerEventHandlers: () => void;
4
- scheduleActiveElementScrollIntoView: (delay: number) => void;
5
- };
1
+ export declare function useAutoScroll(): AutoScrollController;
2
+ declare class AutoScrollController {
3
+ private getLastInteraction;
4
+ private active;
5
+ private direction;
6
+ private timeout;
7
+ constructor(getLastInteraction: () => "pointer" | "keyboard");
8
+ init(): () => void;
9
+ run(): void;
10
+ stop(): void;
11
+ scheduleActiveElementScrollIntoView(delay: number): void;
12
+ private onPointerMove;
13
+ private onPointerUp;
14
+ private scrollRepeat;
15
+ }
16
+ export {};
package/internal/utils/use-auto-scroll.js CHANGED
@@ -1,64 +1,76 @@
1
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
2
  // SPDX-License-Identifier: Apache-2.0
3
- import { useCallback, useEffect, useRef, useState } from "react";
3
+ import { useEffect, useRef } from "react";
4
4
  import { useLastInteraction } from "./use-last-interaction";
5
+ const AUTO_SCROLL_INCREMENT = 5;
6
+ const AUTO_SCROLL_MARGIN = 50;
7
+ const AUTO_SCROLL_DELAY = 10;
5
8
  export function useAutoScroll() {
6
- const [activeAutoScroll, setActiveAutoScroll] = useState("none");
7
- const scrollIntoViewTimerRef = useRef(null);
8
9
  const getLastInteraction = useLastInteraction();
9
- // Scroll window repeatedly if activeAutoScroll="up" or activeAutoScroll="down".
10
- useEffect(() => {
11
- if (activeAutoScroll === "none") {
12
- return;
13
- }
14
- const direction = activeAutoScroll === "up" ? -1 : 1;
15
- let timer;
16
- function scrollLoop() {
17
- timer = setTimeout(() => {
18
- window.scrollBy({ top: direction * 5 });
19
- scrollLoop();
20
- }, 10);
21
- }
22
- scrollLoop();
23
- return () => clearTimeout(timer);
24
- }, [activeAutoScroll]);
25
- const onPointerMove = useCallback((event) => {
26
- const autoScrollMargin = 50;
27
- if (event.clientY > window.innerHeight - autoScrollMargin) {
28
- setActiveAutoScroll("down");
29
- }
30
- else if (event.clientY < autoScrollMargin) {
31
- setActiveAutoScroll("up");
32
- }
33
- else {
34
- setActiveAutoScroll("none");
35
- }
36
- }, []);
37
- const onPointerUp = useCallback(() => {
38
- setActiveAutoScroll("none");
39
- }, []);
40
- const addPointerEventHandlers = useCallback(() => {
41
- if (getLastInteraction() === "pointer") {
42
- window.addEventListener("pointermove", onPointerMove);
43
- window.addEventListener("pointerup", onPointerUp);
44
- }
45
- }, [getLastInteraction, onPointerMove, onPointerUp]);
46
- const removePointerEventHandlers = useCallback(() => {
47
- window.removeEventListener("pointermove", onPointerMove);
48
- window.removeEventListener("pointerup", onPointerUp);
49
- }, [onPointerMove, onPointerUp]);
50
- const scheduleActiveElementScrollIntoView = useCallback((delay) => {
51
- scrollIntoViewTimerRef.current && clearTimeout(scrollIntoViewTimerRef.current);
10
+ const scrollControllerRef = useRef(new AutoScrollController(getLastInteraction));
11
+ useEffect(() => scrollControllerRef.current.init(), []);
12
+ return scrollControllerRef.current;
13
+ }
14
+ class AutoScrollController {
15
+ constructor(getLastInteraction) {
16
+ this.active = false;
17
+ this.direction = 0;
18
+ this.timeout = setTimeout(() => { }, 0);
19
+ this.onPointerMove = (event) => {
20
+ if (!this.active) {
21
+ return;
22
+ }
23
+ if (event.clientY > window.innerHeight - AUTO_SCROLL_MARGIN) {
24
+ this.direction = 1;
25
+ }
26
+ else if (event.clientY < AUTO_SCROLL_MARGIN) {
27
+ this.direction = -1;
28
+ }
29
+ else {
30
+ this.direction = 0;
31
+ }
32
+ };
33
+ this.onPointerUp = () => {
34
+ this.direction = 0;
35
+ };
36
+ this.getLastInteraction = getLastInteraction;
37
+ }
38
+ init() {
39
+ this.scrollRepeat();
40
+ window.addEventListener("pointermove", this.onPointerMove);
41
+ window.addEventListener("pointerup", this.onPointerUp);
42
+ return () => {
43
+ clearTimeout(this.timeout);
44
+ window.removeEventListener("pointermove", this.onPointerMove);
45
+ window.removeEventListener("pointerup", this.onPointerUp);
46
+ };
47
+ }
48
+ run() {
49
+ this.active = true;
50
+ }
51
+ stop() {
52
+ this.active = false;
53
+ }
54
+ scheduleActiveElementScrollIntoView(delay) {
55
+ clearTimeout(this.timeout);
52
56
  const activeElementBeforeDelay = document.activeElement;
53
- scrollIntoViewTimerRef.current = setTimeout(() => {
57
+ this.timeout = setTimeout(() => {
54
58
  var _a, _b;
55
59
  if (document.activeElement &&
56
60
  document.activeElement === activeElementBeforeDelay &&
57
- getLastInteraction() === "keyboard") {
61
+ this.getLastInteraction() === "keyboard") {
58
62
  (_b = (_a = document.activeElement).scrollIntoView) === null || _b === void 0 ? void 0 : _b.call(_a, { behavior: "smooth", block: "nearest" });
59
63
  }
64
+ this.scrollRepeat();
60
65
  }, delay);
61
- }, [getLastInteraction]);
62
- return { addPointerEventHandlers, removePointerEventHandlers, scheduleActiveElementScrollIntoView };
66
+ }
67
+ scrollRepeat() {
68
+ this.timeout = setTimeout(() => {
69
+ if (this.active && this.direction !== 0) {
70
+ window.scrollBy({ top: this.direction * AUTO_SCROLL_INCREMENT });
71
+ }
72
+ this.scrollRepeat();
73
+ }, AUTO_SCROLL_DELAY);
74
+ }
63
75
  }
64
76
  //# sourceMappingURL=use-auto-scroll.js.map
package/internal/utils/use-auto-scroll.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"use-auto-scroll.js","sourceRoot":"","sources":["../../../../src/internal/utils/use-auto-scroll.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useCallback, useEffect, useRef, useState } from \"react\";\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
+ {"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 { useEffect, useRef } from \"react\";\n\nimport { useLastInteraction } from \"./use-last-interaction\";\nconst AUTO_SCROLL_INCREMENT = 5;\nconst AUTO_SCROLL_MARGIN = 50;\nconst AUTO_SCROLL_DELAY = 10;\n\nexport function useAutoScroll() {\n const getLastInteraction = useLastInteraction();\n const scrollControllerRef = useRef(new AutoScrollController(getLastInteraction));\n useEffect(() => scrollControllerRef.current.init(), []);\n return scrollControllerRef.current;\n}\n\nclass AutoScrollController {\n private getLastInteraction: () => \"pointer\" | \"keyboard\";\n private active = false;\n private direction: 0 | -1 | 1 = 0;\n private timeout = setTimeout(() => {}, 0);\n\n constructor(getLastInteraction: () => \"pointer\" | \"keyboard\") {\n this.getLastInteraction = getLastInteraction;\n }\n\n public init() {\n this.scrollRepeat();\n window.addEventListener(\"pointermove\", this.onPointerMove);\n window.addEventListener(\"pointerup\", this.onPointerUp);\n return () => {\n clearTimeout(this.timeout);\n window.removeEventListener(\"pointermove\", this.onPointerMove);\n window.removeEventListener(\"pointerup\", this.onPointerUp);\n };\n }\n\n public run() {\n this.active = true;\n }\n\n public stop() {\n this.active = false;\n }\n\n public scheduleActiveElementScrollIntoView(delay: number) {\n clearTimeout(this.timeout);\n\n const activeElementBeforeDelay = document.activeElement;\n this.timeout = setTimeout(() => {\n if (\n document.activeElement &&\n document.activeElement === activeElementBeforeDelay &&\n this.getLastInteraction() === \"keyboard\"\n ) {\n document.activeElement.scrollIntoView?.({ behavior: \"smooth\", block: \"nearest\" });\n }\n this.scrollRepeat();\n }, delay);\n }\n\n private onPointerMove = (event: PointerEvent) => {\n if (!this.active) {\n return;\n }\n if (event.clientY > window.innerHeight - AUTO_SCROLL_MARGIN) {\n this.direction = 1;\n } else if (event.clientY < AUTO_SCROLL_MARGIN) {\n this.direction = -1;\n } else {\n this.direction = 0;\n }\n };\n\n private onPointerUp = () => {\n this.direction = 0;\n };\n\n private scrollRepeat() {\n this.timeout = setTimeout(() => {\n if (this.active && this.direction !== 0) {\n window.scrollBy({ top: this.direction * AUTO_SCROLL_INCREMENT });\n }\n this.scrollRepeat();\n }, AUTO_SCROLL_DELAY);\n }\n}\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cloudscape-design/board-components",
3
- "version": "3.0.115",
3
+ "version": "3.0.117",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "https://github.com/cloudscape-design/board-components.git"