@vuu-ui/vuu-ui-controls 0.8.63 → 0.8.65

package/cjs/drag-drop/useDragDrop.js

@@ -471,6 +471,11 @@ const useDragDrop = ({
             terminateDrag();
           }
         });
+      } else {
+        setDraggableStatus((status) => ({
+          ...status,
+          draggable: void 0
+        }));
       }
     }
   }, [containerRef, itemQuery, settlingItem, terminateDrag]);

package/cjs/drag-drop/useDragDrop.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDragDrop.js","sources":["../../src/drag-drop/useDragDrop.tsx"],"sourcesContent":["import { dispatchCustomEvent } from \"@vuu-ui/vuu-utils\";\nimport {\n  MouseEventHandler,\n  useCallback,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useDragDropProvider } from \"./DragDropProvider\";\nimport { DragDropState } from \"./DragDropState\";\nimport {\n  DragDropHook,\n  DropHandler,\n  InternalDragDropProps,\n  InternalDragHookResult,\n  MouseOffset,\n  MousePosition,\n} from \"./dragDropTypes\";\nimport { Draggable } from \"./Draggable\";\nimport {\n  cloneElement,\n  constrainRect,\n  dimensions,\n  getScrollableContainer,\n  isContainerScrollable,\n  NOT_OVERFLOWED,\n} from \"./drop-target-utils\";\nimport { ScrollStopHandler, useAutoScroll } from \"./useAutoScroll\";\nimport { useDragDropCopy, NULL_DROP_OPTIONS } from \"./useDragDropCopy\";\nimport { useDragDropIndicator } from \"./useDragDropIndicator\";\nimport { useDragDropNaturalMovement } from \"./useDragDropNaturalMovement\";\nimport { ResumeDragHandler } from \"./useGlobalDragDrop\";\nimport { isOverflowElement } from \"../utils\";\n\nconst NULL_DRAG_DROP_RESULT = {\n  beginDrag: () => undefined,\n  drag: () => undefined,\n  draggableRef: { current: null },\n  drop: () => NULL_DROP_OPTIONS,\n  isDragging: false,\n  isScrolling: false,\n  handleScrollStart: () => undefined,\n  handleScrollStop: () => undefined,\n  revealOverflowedItems: false,\n};\n\ntype DraggableStatus = {\n  draggable?: JSX.Element;\n  draggedItemIndex: number;\n  isDragging: boolean;\n};\n\ntype DragBoundary = {\n  start: number;\n  end: number;\n  contraStart: number;\n  contraEnd: number;\n};\n\nconst UNBOUNDED: DragBoundary = {\n  start: 0,\n  end: 1000,\n  contraStart: 0,\n  contraEnd: 1000,\n};\n\ntype InternalHook = (props: InternalDragDropProps) => InternalDragHookResult;\nconst noDragDrop: InternalHook = () => NULL_DRAG_DROP_RESULT;\nconst dragThreshold = 3;\n\nconst getDraggableElement = (\n  el: EventTarget | null,\n  query: string\n): HTMLElement => (el as HTMLElement)?.closest(query) as HTMLElement;\n\nconst getLastElement = (\n  container: HTMLElement,\n  itemQuery: string\n): [HTMLElement, boolean] => {\n  const fullItemQuery = `:is(${itemQuery}${NOT_OVERFLOWED},.vuuOverflowContainer-OverflowIndicator)`;\n  const childElements = Array.from(container.querySelectorAll(fullItemQuery));\n  const lastElement = childElements.pop() as HTMLElement;\n  return [lastElement, isOverflowElement(lastElement)];\n};\n\nexport const useDragDrop: DragDropHook = ({\n  allowDragDrop,\n  containerRef,\n  draggableClassName,\n  getDragPayload,\n  id,\n  itemQuery = \"*\",\n  onDragStart,\n  onDrop,\n  onDropSettle,\n  orientation,\n  scrollingContainerRef,\n  ...dragDropProps\n}) => {\n  const dragBoundaries = useRef<DragBoundary>({\n    start: 0,\n    end: 0,\n    contraStart: 0,\n    contraEnd: 0,\n  });\n  const [draggableStatus, setDraggableStatus] = useState<DraggableStatus>({\n    draggable: undefined,\n    draggedItemIndex: -1,\n    isDragging: false,\n  });\n\n  const dragDropStateRef = useRef<DragDropState | null>(null);\n  const mouseDownTimer = useRef<number | null>(null);\n  /** do we actually have scrollable content  */\n  const isScrollableRef = useRef(false);\n\n  /** save this on mousedown. We cannot rely on the target of mousemove being same element*/\n  const mousedownElementRef = useRef<HTMLElement | null>(null);\n\n  /** current mouse position */\n  const mousePosRef = useRef<MouseOffset>({ x: 0, y: 0 });\n  /** mouse position when mousedown initiated drag */\n  const startPosRef = useRef<MouseOffset>({ x: 0, y: 0 });\n  /** references the dragged Item during its final 'settling' phase post drop  */\n  const settlingItemRef = useRef<HTMLElement | null>(null);\n  /** the container which will scroll if content overflows  */\n  const scrollableContainerRef = useRef<HTMLElement | null>(null);\n  const dropPosRef = useRef(-1);\n  const dropIndexRef = useRef(-1);\n\n  const handleScrollStopRef = useRef<ScrollStopHandler>();\n\n  const {\n    isDragSource,\n    isDropTarget,\n    onDragOut,\n    onEndOfDragOperation,\n    register,\n  } = useDragDropProvider(id);\n\n  type NativeMouseHandler = (evt: MouseEvent) => void;\n  /** refs for drag handlers to avoid circular dependency issues  */\n  const dragMouseMoveHandlerRef = useRef<NativeMouseHandler>();\n  const dragMouseUpHandlerRef = useRef<NativeMouseHandler>();\n\n  const attachDragHandlers = useCallback(() => {\n    const { current: dragMove } = dragMouseMoveHandlerRef;\n    const { current: dragUp } = dragMouseUpHandlerRef;\n    if (dragMove && dragUp) {\n      // prettier-ignore\n      document.addEventListener(\"mousemove\", dragMove, false);\n      document.addEventListener(\"mouseup\", dragUp, false);\n    }\n  }, []);\n  const removeDragHandlers = useCallback(() => {\n    const { current: dragMove } = dragMouseMoveHandlerRef;\n    const { current: dragUp } = dragMouseUpHandlerRef;\n    if (dragMove && dragUp) {\n      // prettier-ignore\n      document.removeEventListener(\"mousemove\", dragMove, false);\n      document.removeEventListener(\"mouseup\", dragUp, false);\n    }\n  }, []);\n\n  /**\n   * Establish the boundaries for the current drag operation. When dragging along\n   * a single axis (eg list items within a list, tabs within a tabstrip), constrain\n   * valid drag positions to the confines of the container. A sharp drag away from\n   * the primary drag axis is interpreted as a request to drag an item out of the\n   * container. This will be allowed if configured appropriately.\n   */\n  const setDragBoundaries = useCallback(\n    (containerRect: DOMRect, draggableRect: DOMRect) => {\n      const { current: container } = containerRef;\n      if (container) {\n        const [lastElement, lastItemIsOverflowIndicator] = getLastElement(\n          container,\n          itemQuery\n        );\n        const { CONTRA, CONTRA_END, DIMENSION, END, START } =\n          dimensions(orientation);\n\n        const draggableSize = draggableRect[DIMENSION];\n        const { [START]: lastItemStart, [END]: lastItemEnd } =\n          lastElement.getBoundingClientRect();\n\n        dragBoundaries.current.start = containerRect[START];\n        dragBoundaries.current.end = lastItemIsOverflowIndicator\n          ? Math.max(lastItemStart, containerRect.right - draggableSize)\n          : isScrollableRef.current\n          ? containerRect[START] + containerRect[DIMENSION] - draggableSize\n          : lastItemEnd - draggableSize;\n        dragBoundaries.current.contraStart = containerRect[CONTRA];\n        dragBoundaries.current.contraEnd = containerRect[CONTRA_END];\n      }\n    },\n    [containerRef, itemQuery, orientation]\n  );\n\n  const terminateDrag = useCallback(() => {\n    const { current: settlingItem } = settlingItemRef;\n    settlingItemRef.current = null;\n\n    const { current: toIndex } = dropIndexRef;\n    const droppedItem = containerRef.current?.querySelector(\n      `${itemQuery}[data-index=\"${toIndex}\"]`\n    );\n    if (droppedItem) {\n      droppedItem.classList.remove(\"vuuDropTarget-settling\");\n    }\n    dropIndexRef.current = -1;\n    onDropSettle?.(toIndex);\n    setDraggableStatus((status) => ({\n      ...status,\n      draggable: undefined,\n    }));\n\n    if (settlingItem) {\n      dispatchCustomEvent(settlingItem, \"vuu-dropped\");\n    }\n  }, [containerRef, itemQuery, onDropSettle]);\n\n  const getScrollDirection = useCallback(\n    (mousePos: number) => {\n      if (scrollableContainerRef.current && dragDropStateRef.current) {\n        const { mouseOffset } = dragDropStateRef.current;\n\n        const { POS, SCROLL_POS, SCROLL_SIZE, CLIENT_SIZE } =\n          dimensions(orientation);\n        const {\n          [SCROLL_POS]: scrollPos,\n          [SCROLL_SIZE]: scrollSize,\n          [CLIENT_SIZE]: clientSize,\n        } = scrollableContainerRef.current;\n\n        const maxScroll = scrollSize - clientSize;\n        const canScrollFwd = scrollPos < maxScroll;\n        const viewportEnd = dragBoundaries.current.end;\n        const bwd =\n          scrollPos > 0 &&\n          mousePos - mouseOffset[POS] <= dragBoundaries.current.start;\n        const fwd = canScrollFwd && mousePos - mouseOffset[POS] >= viewportEnd;\n\n        return bwd ? \"bwd\" : fwd ? \"fwd\" : \"\";\n      }\n    },\n    [scrollableContainerRef, orientation]\n  );\n\n  const useDragDropHook: InternalHook =\n    allowDragDrop === true || allowDragDrop === \"natural-movement\"\n      ? useDragDropNaturalMovement\n      : allowDragDrop === \"drop-indicator\"\n      ? useDragDropIndicator\n      : allowDragDrop === \"drag-copy\"\n      ? useDragDropCopy\n      : noDragDrop;\n\n  const onScrollingStopped = useCallback(\n    (scrollDirection: \"fwd\" | \"bwd\", scrollPos: number, atEnd: boolean) => {\n      handleScrollStopRef.current?.(scrollDirection, scrollPos, atEnd);\n    },\n    []\n  );\n\n  const { isScrolling, startScrolling, stopScrolling } = useAutoScroll({\n    containerRef: scrollableContainerRef,\n    onScrollingStopped,\n    orientation,\n  });\n\n  const handleDrop = useCallback<DropHandler>(\n    (options) => {\n      //TODO why do we need both this and dropIndexRef ?\n      dropPosRef.current = options.toIndex;\n      if (options.isExternal) {\n        onDrop?.({\n          ...options,\n          payload: dragDropStateRef.current?.payload,\n        });\n      } else {\n        onDrop?.(options);\n      }\n      dropIndexRef.current = options.toIndex;\n      if (id) {\n        onEndOfDragOperation?.(id);\n      }\n      dragDropStateRef.current = null;\n    },\n    [id, onDrop, onEndOfDragOperation]\n  );\n\n  const {\n    beginDrag,\n    drag,\n    drop,\n    handleScrollStart,\n    handleScrollStop,\n    releaseDrag,\n    ...dragResult\n  } = useDragDropHook({\n    ...dragDropProps,\n    containerRef,\n    isDragSource,\n    isDropTarget,\n    itemQuery,\n    orientation,\n  });\n  // To avoid circular ref between hooks\n  handleScrollStopRef.current = handleScrollStop;\n\n  const dragHandedOvertoProvider = useCallback(\n    (dragDistance: number, clientContraPos: number) => {\n      const { CONTRA_POS } = dimensions(orientation);\n      const lastClientContraPos = mousePosRef.current[CONTRA_POS];\n\n      const dragOutDistance = isDragSource\n        ? Math.abs(lastClientContraPos - clientContraPos)\n        : 0;\n\n      if (allowDragDrop === true && !isDragSource && !isDropTarget) {\n        //This is a simple internal drag\n        return false;\n      }\n\n      // If isDropTarget is false, there are configured dropTargets in context\n      // but this is not one, so drag will be handed straight over to DragProvider\n      // (global drag). If isDropTarget is undefined, we have no DragProvider\n      // so we are dealing with a simple local drag drop operation.\n      const handoverToProvider =\n        isDropTarget === false || dragOutDistance - dragDistance > 5;\n\n      if (dragDropStateRef.current && handoverToProvider) {\n        if (onDragOut?.(id as string, dragDropStateRef.current)) {\n          // TODO create a cleanup function\n          removeDragHandlers();\n          releaseDrag?.();\n          dragDropStateRef.current = null;\n        }\n        // remove the drag boundaries\n        dragBoundaries.current = UNBOUNDED;\n        return true;\n      }\n    },\n    [\n      allowDragDrop,\n      id,\n      isDragSource,\n      isDropTarget,\n      onDragOut,\n      orientation,\n      releaseDrag,\n      removeDragHandlers,\n    ]\n  );\n\n  const dragMouseMoveHandler = useCallback(\n    (evt: MouseEvent) => {\n      const { CLIENT_POS, CONTRA_CLIENT_POS, POS } = dimensions(orientation);\n      const { clientX, clientY } = evt;\n      const { [CLIENT_POS]: clientPos, [CONTRA_CLIENT_POS]: clientContraPos } =\n        evt;\n      const lastClientPos = mousePosRef.current[POS];\n      const dragDistance = Math.abs(lastClientPos - clientPos);\n      const { current: dragDropState } = dragDropStateRef;\n      const { current: boundary } = dragBoundaries;\n\n      if (dragHandedOvertoProvider(dragDistance, clientContraPos)) {\n        return;\n      }\n\n      mousePosRef.current.x = clientX;\n      mousePosRef.current.y = clientY;\n\n      if (dragDropState) {\n        const { draggableElement, mouseOffset } = dragDropState;\n\n        if (dragBoundaries.current === UNBOUNDED && draggableElement) {\n          const dragPosX = mousePosRef.current.x - mouseOffset.x;\n          const dragPosY = mousePosRef.current.y - mouseOffset.y;\n          draggableElement.style.top = `${dragPosY}px`;\n          draggableElement.style.left = `${dragPosX}px`;\n        } else if (dragDistance > 0 && draggableElement) {\n          const mouseMoveDirection = lastClientPos < clientPos ? \"fwd\" : \"bwd\";\n          const scrollDirection = getScrollDirection(clientPos);\n          const dragPos = mousePosRef.current[POS] - mouseOffset[POS];\n          const START = orientation === \"horizontal\" ? \"left\" : \"top\";\n\n          if (\n            scrollDirection &&\n            isScrollableRef.current &&\n            !isScrolling.current\n          ) {\n            handleScrollStart?.(scrollDirection);\n            startScrolling(scrollDirection, 1);\n\n            if (scrollDirection === \"fwd\") {\n              draggableElement.style[START] = `${boundary.end}px`;\n            } else {\n              draggableElement.style[START] = `${boundary.start}px`;\n            }\n          } else if (!scrollDirection && isScrolling.current) {\n            stopScrolling();\n          }\n\n          if (!isScrolling.current) {\n            const renderDragPos = Math.round(\n              Math.max(boundary.start, Math.min(boundary.end, dragPos))\n            );\n            draggableElement.style[START] = `${renderDragPos}px`;\n            drag(renderDragPos, mouseMoveDirection);\n          }\n        }\n      }\n    },\n    [\n      drag,\n      dragHandedOvertoProvider,\n      getScrollDirection,\n      handleScrollStart,\n      isScrolling,\n      orientation,\n      startScrolling,\n      stopScrolling,\n    ]\n  );\n  const dragMouseUpHandler = useCallback(() => {\n    removeDragHandlers();\n    if (dragDropStateRef.current) {\n      settlingItemRef.current = dragDropStateRef.current.draggableElement;\n    }\n    const dropOptions = drop();\n    handleDrop(dropOptions);\n\n    setDraggableStatus((status) => ({\n      ...status,\n      draggedItemIndex: -1,\n      isDragging: false,\n    }));\n    // TODO clear the dragDropState\n  }, [drop, handleDrop, removeDragHandlers]);\n\n  dragMouseMoveHandlerRef.current = dragMouseMoveHandler;\n  dragMouseUpHandlerRef.current = dragMouseUpHandler;\n\n  const resumeDrag = useCallback<ResumeDragHandler>(\n    (dragDropState: DragDropState) => {\n      dragDropStateRef.current = dragDropState;\n      // Note this is using the draggable element rather than the original draggedElement\n      const { draggableElement, mouseOffset } = dragDropState;\n      const { current: container } = containerRef;\n\n      if (container && draggableElement) {\n        const containerRect = container.getBoundingClientRect();\n        const draggableRect = draggableElement.getBoundingClientRect();\n        setDragBoundaries(containerRect, draggableRect);\n\n        mousePosRef.current.x = draggableRect.left + mouseOffset.x;\n        mousePosRef.current.y = draggableRect.top + mouseOffset.y;\n\n        // why doesn't this work if we use the initialDragEement\n        beginDrag(draggableElement);\n\n        attachDragHandlers();\n\n        return true;\n      } else {\n        return false;\n      }\n    },\n    [attachDragHandlers, beginDrag, containerRef, setDragBoundaries]\n  );\n\n  const dragStart = useCallback(\n    (mousePosition: MousePosition) => {\n      const { current: container } = containerRef;\n      const { current: target } = mousedownElementRef;\n      const dragElement = getDraggableElement(target, itemQuery);\n      const scrollableContainer =\n        scrollingContainerRef?.current ??\n        getScrollableContainer(container, itemQuery);\n      if (container && scrollableContainer && dragElement) {\n        isScrollableRef.current = isContainerScrollable(\n          scrollableContainer,\n          orientation\n        );\n        scrollableContainerRef.current = scrollableContainer;\n\n        const containerRect = scrollableContainer.getBoundingClientRect();\n        const draggableRect = dragElement.getBoundingClientRect();\n\n        const dragDropState = (dragDropStateRef.current = new DragDropState(\n          mousePosition,\n          dragElement\n        ));\n\n        setDragBoundaries(containerRect, draggableRect);\n\n        beginDrag(dragElement);\n\n        const {\n          dataset: { index = \"-1\" },\n        } = dragElement;\n\n        setDraggableStatus({\n          isDragging: true,\n          draggable: (\n            <Draggable\n              element={cloneElement(dragElement)}\n              onDropped={terminateDrag}\n              onTransitionEnd={terminateDrag}\n              ref={dragDropState.setDraggable}\n              style={constrainRect(draggableRect, containerRect)}\n              wrapperClassName={draggableClassName}\n            />\n          ),\n          draggedItemIndex: parseInt(index),\n        });\n\n        onDragStart?.(dragDropState);\n        attachDragHandlers();\n\n        mousedownElementRef.current = null;\n      }\n    },\n    [\n      attachDragHandlers,\n      beginDrag,\n      containerRef,\n      draggableClassName,\n      itemQuery,\n      onDragStart,\n      orientation,\n      scrollingContainerRef,\n      setDragBoundaries,\n      terminateDrag,\n    ]\n  );\n\n  const preDragMouseMoveHandler = useCallback(\n    (evt: MouseEvent) => {\n      const { current: mouseDownPosition } = startPosRef;\n      const { CLIENT_POS, POS } = dimensions(orientation);\n      const { [CLIENT_POS]: clientPos } = evt;\n      const mouseMoveDistance = Math.abs(clientPos - mouseDownPosition[POS]);\n      if (mouseMoveDistance > dragThreshold && containerRef.current) {\n        if (mouseDownTimer.current) {\n          window.clearTimeout(mouseDownTimer.current);\n          mouseDownTimer.current = null;\n        }\n        document.removeEventListener(\"mousemove\", preDragMouseMoveHandler);\n        document.removeEventListener(\"mouseup\", preDragMouseUpHandler, false);\n\n        const mousePosition = {\n          clientX: mouseDownPosition.x,\n          clientY: mouseDownPosition.y,\n        };\n        dragStart(mousePosition);\n      }\n    },\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [containerRef, beginDrag, orientation]\n  );\n\n  const preDragMouseUpHandler = useCallback(() => {\n    if (mouseDownTimer.current) {\n      window.clearTimeout(mouseDownTimer.current);\n      mouseDownTimer.current = null;\n    }\n    document.removeEventListener(\"mousemove\", preDragMouseMoveHandler, false);\n    document.removeEventListener(\"mouseup\", preDragMouseUpHandler, false);\n  }, [preDragMouseMoveHandler]);\n\n  const mouseDownHandler: MouseEventHandler = useCallback(\n    (evt) => {\n      if (evt.button !== 0) {\n        return;\n      }\n      // TODO runtime check here for valid drop targets ?\n      const { current: container } = containerRef;\n      // We don't want to prevent other handlers on this element from working\n      // but we do want to stop a drag drop being initiated on a bubbled event.\n      evt.stopPropagation();\n      if (container && !evt.defaultPrevented) {\n        const { clientX, clientY } = evt;\n        mousePosRef.current.x = startPosRef.current.x = clientX;\n        mousePosRef.current.y = startPosRef.current.y = clientY;\n        mousedownElementRef.current = evt.target as HTMLElement;\n\n        const mousePosition = {\n          clientX,\n          clientY,\n        };\n\n        document.addEventListener(\"mousemove\", preDragMouseMoveHandler, false);\n        document.addEventListener(\"mouseup\", preDragMouseUpHandler, false);\n\n        evt.persist();\n\n        mouseDownTimer.current = window.setTimeout(() => {\n          document.removeEventListener(\n            \"mousemove\",\n            preDragMouseMoveHandler,\n            false\n          );\n          document.removeEventListener(\"mouseup\", preDragMouseUpHandler, false);\n          dragStart(mousePosition);\n        }, 500);\n      }\n    },\n    [containerRef, dragStart, preDragMouseMoveHandler, preDragMouseUpHandler]\n  );\n\n  const { current: settlingItem } = settlingItemRef;\n  useLayoutEffect(() => {\n    if (settlingItem && containerRef.current) {\n      const dropPos = dropPosRef.current;\n      const droppedItem = containerRef.current.querySelector(\n        `${itemQuery}[data-index=\"${dropPos}\"]`\n      );\n      if (droppedItem) {\n        droppedItem.classList.add(\"vuuDropTarget-settling\");\n        requestAnimationFrame(() => {\n          const { top: targetTop, left: targetLeft } =\n            droppedItem.getBoundingClientRect();\n          // If the droppedItem is already exactly in the drop position, we can just\n          // terminate the drag here and now. Most likely, though, it is out by a few\n          // pixels. We animate the dragged item into the final resting place before\n          // terminating the drag.\n          const style = getComputedStyle(settlingItem);\n          const currentLeft = parseInt(style.getPropertyValue(\"left\"));\n          const currentTop = parseInt(style.getPropertyValue(\"top\"));\n          if (currentLeft !== targetLeft || currentTop !== targetTop) {\n            settlingItem.classList.add(\"vuuDraggable-settling\");\n            settlingItem.style.top = `${targetTop}px`;\n            settlingItem.style.left = `${targetLeft}px`;\n          } else {\n            terminateDrag();\n          }\n        });\n      }\n      // settlingItemRef.current = null;\n    }\n  }, [containerRef, itemQuery, settlingItem, terminateDrag]);\n\n  useEffect(() => {\n    if (id && (isDragSource || isDropTarget)) {\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      //@ts-ignore TODO drah drop WIP\n      register(id, allowDragDrop === \"drop-only\" ? false : resumeDrag, onDrop);\n    }\n  }, [\n    allowDragDrop,\n    id,\n    isDragSource,\n    isDropTarget,\n    onDrop,\n    register,\n    resumeDrag,\n  ]);\n\n  return {\n    ...dragResult,\n    ...draggableStatus,\n    isScrolling,\n    onMouseDown:\n      allowDragDrop && allowDragDrop !== \"drop-only\"\n        ? mouseDownHandler\n        : undefined,\n  };\n};\n"],"names":["NULL_DROP_OPTIONS","NOT_OVERFLOWED","isOverflowElement","useRef","useState","useDragDropProvider","useCallback","dimensions","settlingItem","dispatchCustomEvent","useDragDropNaturalMovement","useDragDropIndicator","useDragDropCopy","useAutoScroll","getScrollableContainer","isContainerScrollable","DragDropState","jsx","Draggable","cloneElement","constrainRect","useLayoutEffect","useEffect"],"mappings":"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"}
+{"version":3,"file":"useDragDrop.js","sources":["../../src/drag-drop/useDragDrop.tsx"],"sourcesContent":["import { dispatchCustomEvent } from \"@vuu-ui/vuu-utils\";\nimport {\n  MouseEventHandler,\n  useCallback,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useDragDropProvider } from \"./DragDropProvider\";\nimport { DragDropState } from \"./DragDropState\";\nimport {\n  DragDropHook,\n  DropHandler,\n  InternalDragDropProps,\n  InternalDragHookResult,\n  MouseOffset,\n  MousePosition,\n} from \"./dragDropTypes\";\nimport { Draggable } from \"./Draggable\";\nimport {\n  cloneElement,\n  constrainRect,\n  dimensions,\n  getScrollableContainer,\n  isContainerScrollable,\n  NOT_OVERFLOWED,\n} from \"./drop-target-utils\";\nimport { ScrollStopHandler, useAutoScroll } from \"./useAutoScroll\";\nimport { useDragDropCopy, NULL_DROP_OPTIONS } from \"./useDragDropCopy\";\nimport { useDragDropIndicator } from \"./useDragDropIndicator\";\nimport { useDragDropNaturalMovement } from \"./useDragDropNaturalMovement\";\nimport { ResumeDragHandler } from \"./useGlobalDragDrop\";\nimport { isOverflowElement } from \"../utils\";\n\nconst NULL_DRAG_DROP_RESULT = {\n  beginDrag: () => undefined,\n  drag: () => undefined,\n  draggableRef: { current: null },\n  drop: () => NULL_DROP_OPTIONS,\n  isDragging: false,\n  isScrolling: false,\n  handleScrollStart: () => undefined,\n  handleScrollStop: () => undefined,\n  revealOverflowedItems: false,\n};\n\ntype DraggableStatus = {\n  draggable?: JSX.Element;\n  draggedItemIndex: number;\n  isDragging: boolean;\n};\n\ntype DragBoundary = {\n  start: number;\n  end: number;\n  contraStart: number;\n  contraEnd: number;\n};\n\nconst UNBOUNDED: DragBoundary = {\n  start: 0,\n  end: 1000,\n  contraStart: 0,\n  contraEnd: 1000,\n};\n\ntype InternalHook = (props: InternalDragDropProps) => InternalDragHookResult;\nconst noDragDrop: InternalHook = () => NULL_DRAG_DROP_RESULT;\nconst dragThreshold = 3;\n\nconst getDraggableElement = (\n  el: EventTarget | null,\n  query: string\n): HTMLElement => (el as HTMLElement)?.closest(query) as HTMLElement;\n\nconst getLastElement = (\n  container: HTMLElement,\n  itemQuery: string\n): [HTMLElement, boolean] => {\n  const fullItemQuery = `:is(${itemQuery}${NOT_OVERFLOWED},.vuuOverflowContainer-OverflowIndicator)`;\n  const childElements = Array.from(container.querySelectorAll(fullItemQuery));\n  const lastElement = childElements.pop() as HTMLElement;\n  return [lastElement, isOverflowElement(lastElement)];\n};\n\nexport const useDragDrop: DragDropHook = ({\n  allowDragDrop,\n  containerRef,\n  draggableClassName,\n  getDragPayload,\n  id,\n  itemQuery = \"*\",\n  onDragStart,\n  onDrop,\n  onDropSettle,\n  orientation,\n  scrollingContainerRef,\n  ...dragDropProps\n}) => {\n  const dragBoundaries = useRef<DragBoundary>({\n    start: 0,\n    end: 0,\n    contraStart: 0,\n    contraEnd: 0,\n  });\n  const [draggableStatus, setDraggableStatus] = useState<DraggableStatus>({\n    draggable: undefined,\n    draggedItemIndex: -1,\n    isDragging: false,\n  });\n\n  const dragDropStateRef = useRef<DragDropState | null>(null);\n  const mouseDownTimer = useRef<number | null>(null);\n  /** do we actually have scrollable content  */\n  const isScrollableRef = useRef(false);\n\n  /** save this on mousedown. We cannot rely on the target of mousemove being same element*/\n  const mousedownElementRef = useRef<HTMLElement | null>(null);\n\n  /** current mouse position */\n  const mousePosRef = useRef<MouseOffset>({ x: 0, y: 0 });\n  /** mouse position when mousedown initiated drag */\n  const startPosRef = useRef<MouseOffset>({ x: 0, y: 0 });\n  /** references the dragged Item during its final 'settling' phase post drop  */\n  const settlingItemRef = useRef<HTMLElement | null>(null);\n  /** the container which will scroll if content overflows  */\n  const scrollableContainerRef = useRef<HTMLElement | null>(null);\n  const dropPosRef = useRef(-1);\n  const dropIndexRef = useRef(-1);\n\n  const handleScrollStopRef = useRef<ScrollStopHandler>();\n\n  const {\n    isDragSource,\n    isDropTarget,\n    onDragOut,\n    onEndOfDragOperation,\n    register,\n  } = useDragDropProvider(id);\n\n  type NativeMouseHandler = (evt: MouseEvent) => void;\n  /** refs for drag handlers to avoid circular dependency issues  */\n  const dragMouseMoveHandlerRef = useRef<NativeMouseHandler>();\n  const dragMouseUpHandlerRef = useRef<NativeMouseHandler>();\n\n  const attachDragHandlers = useCallback(() => {\n    const { current: dragMove } = dragMouseMoveHandlerRef;\n    const { current: dragUp } = dragMouseUpHandlerRef;\n    if (dragMove && dragUp) {\n      // prettier-ignore\n      document.addEventListener(\"mousemove\", dragMove, false);\n      document.addEventListener(\"mouseup\", dragUp, false);\n    }\n  }, []);\n  const removeDragHandlers = useCallback(() => {\n    const { current: dragMove } = dragMouseMoveHandlerRef;\n    const { current: dragUp } = dragMouseUpHandlerRef;\n    if (dragMove && dragUp) {\n      // prettier-ignore\n      document.removeEventListener(\"mousemove\", dragMove, false);\n      document.removeEventListener(\"mouseup\", dragUp, false);\n    }\n  }, []);\n\n  /**\n   * Establish the boundaries for the current drag operation. When dragging along\n   * a single axis (eg list items within a list, tabs within a tabstrip), constrain\n   * valid drag positions to the confines of the container. A sharp drag away from\n   * the primary drag axis is interpreted as a request to drag an item out of the\n   * container. This will be allowed if configured appropriately.\n   */\n  const setDragBoundaries = useCallback(\n    (containerRect: DOMRect, draggableRect: DOMRect) => {\n      const { current: container } = containerRef;\n      if (container) {\n        const [lastElement, lastItemIsOverflowIndicator] = getLastElement(\n          container,\n          itemQuery\n        );\n        const { CONTRA, CONTRA_END, DIMENSION, END, START } =\n          dimensions(orientation);\n\n        const draggableSize = draggableRect[DIMENSION];\n        const { [START]: lastItemStart, [END]: lastItemEnd } =\n          lastElement.getBoundingClientRect();\n\n        dragBoundaries.current.start = containerRect[START];\n        dragBoundaries.current.end = lastItemIsOverflowIndicator\n          ? Math.max(lastItemStart, containerRect.right - draggableSize)\n          : isScrollableRef.current\n          ? containerRect[START] + containerRect[DIMENSION] - draggableSize\n          : lastItemEnd - draggableSize;\n        dragBoundaries.current.contraStart = containerRect[CONTRA];\n        dragBoundaries.current.contraEnd = containerRect[CONTRA_END];\n      }\n    },\n    [containerRef, itemQuery, orientation]\n  );\n\n  const terminateDrag = useCallback(() => {\n    const { current: settlingItem } = settlingItemRef;\n    settlingItemRef.current = null;\n\n    const { current: toIndex } = dropIndexRef;\n    const droppedItem = containerRef.current?.querySelector(\n      `${itemQuery}[data-index=\"${toIndex}\"]`\n    );\n    if (droppedItem) {\n      droppedItem.classList.remove(\"vuuDropTarget-settling\");\n    }\n    dropIndexRef.current = -1;\n    onDropSettle?.(toIndex);\n    setDraggableStatus((status) => ({\n      ...status,\n      draggable: undefined,\n    }));\n\n    if (settlingItem) {\n      dispatchCustomEvent(settlingItem, \"vuu-dropped\");\n    }\n  }, [containerRef, itemQuery, onDropSettle]);\n\n  const getScrollDirection = useCallback(\n    (mousePos: number) => {\n      if (scrollableContainerRef.current && dragDropStateRef.current) {\n        const { mouseOffset } = dragDropStateRef.current;\n\n        const { POS, SCROLL_POS, SCROLL_SIZE, CLIENT_SIZE } =\n          dimensions(orientation);\n        const {\n          [SCROLL_POS]: scrollPos,\n          [SCROLL_SIZE]: scrollSize,\n          [CLIENT_SIZE]: clientSize,\n        } = scrollableContainerRef.current;\n\n        const maxScroll = scrollSize - clientSize;\n        const canScrollFwd = scrollPos < maxScroll;\n        const viewportEnd = dragBoundaries.current.end;\n        const bwd =\n          scrollPos > 0 &&\n          mousePos - mouseOffset[POS] <= dragBoundaries.current.start;\n        const fwd = canScrollFwd && mousePos - mouseOffset[POS] >= viewportEnd;\n\n        return bwd ? \"bwd\" : fwd ? \"fwd\" : \"\";\n      }\n    },\n    [scrollableContainerRef, orientation]\n  );\n\n  const useDragDropHook: InternalHook =\n    allowDragDrop === true || allowDragDrop === \"natural-movement\"\n      ? useDragDropNaturalMovement\n      : allowDragDrop === \"drop-indicator\"\n      ? useDragDropIndicator\n      : allowDragDrop === \"drag-copy\"\n      ? useDragDropCopy\n      : noDragDrop;\n\n  const onScrollingStopped = useCallback(\n    (scrollDirection: \"fwd\" | \"bwd\", scrollPos: number, atEnd: boolean) => {\n      handleScrollStopRef.current?.(scrollDirection, scrollPos, atEnd);\n    },\n    []\n  );\n\n  const { isScrolling, startScrolling, stopScrolling } = useAutoScroll({\n    containerRef: scrollableContainerRef,\n    onScrollingStopped,\n    orientation,\n  });\n\n  const handleDrop = useCallback<DropHandler>(\n    (options) => {\n      //TODO why do we need both this and dropIndexRef ?\n      dropPosRef.current = options.toIndex;\n      if (options.isExternal) {\n        onDrop?.({\n          ...options,\n          payload: dragDropStateRef.current?.payload,\n        });\n      } else {\n        onDrop?.(options);\n      }\n      dropIndexRef.current = options.toIndex;\n      if (id) {\n        onEndOfDragOperation?.(id);\n      }\n      dragDropStateRef.current = null;\n    },\n    [id, onDrop, onEndOfDragOperation]\n  );\n\n  const {\n    beginDrag,\n    drag,\n    drop,\n    handleScrollStart,\n    handleScrollStop,\n    releaseDrag,\n    ...dragResult\n  } = useDragDropHook({\n    ...dragDropProps,\n    containerRef,\n    isDragSource,\n    isDropTarget,\n    itemQuery,\n    orientation,\n  });\n  // To avoid circular ref between hooks\n  handleScrollStopRef.current = handleScrollStop;\n\n  const dragHandedOvertoProvider = useCallback(\n    (dragDistance: number, clientContraPos: number) => {\n      const { CONTRA_POS } = dimensions(orientation);\n      const lastClientContraPos = mousePosRef.current[CONTRA_POS];\n\n      const dragOutDistance = isDragSource\n        ? Math.abs(lastClientContraPos - clientContraPos)\n        : 0;\n\n      if (allowDragDrop === true && !isDragSource && !isDropTarget) {\n        //This is a simple internal drag\n        return false;\n      }\n\n      // If isDropTarget is false, there are configured dropTargets in context\n      // but this is not one, so drag will be handed straight over to DragProvider\n      // (global drag). If isDropTarget is undefined, we have no DragProvider\n      // so we are dealing with a simple local drag drop operation.\n      const handoverToProvider =\n        isDropTarget === false || dragOutDistance - dragDistance > 5;\n\n      if (dragDropStateRef.current && handoverToProvider) {\n        if (onDragOut?.(id as string, dragDropStateRef.current)) {\n          // TODO create a cleanup function\n          removeDragHandlers();\n          releaseDrag?.();\n          dragDropStateRef.current = null;\n        }\n        // remove the drag boundaries\n        dragBoundaries.current = UNBOUNDED;\n        return true;\n      }\n    },\n    [\n      allowDragDrop,\n      id,\n      isDragSource,\n      isDropTarget,\n      onDragOut,\n      orientation,\n      releaseDrag,\n      removeDragHandlers,\n    ]\n  );\n\n  const dragMouseMoveHandler = useCallback(\n    (evt: MouseEvent) => {\n      const { CLIENT_POS, CONTRA_CLIENT_POS, POS } = dimensions(orientation);\n      const { clientX, clientY } = evt;\n      const { [CLIENT_POS]: clientPos, [CONTRA_CLIENT_POS]: clientContraPos } =\n        evt;\n      const lastClientPos = mousePosRef.current[POS];\n      const dragDistance = Math.abs(lastClientPos - clientPos);\n      const { current: dragDropState } = dragDropStateRef;\n      const { current: boundary } = dragBoundaries;\n\n      if (dragHandedOvertoProvider(dragDistance, clientContraPos)) {\n        return;\n      }\n\n      mousePosRef.current.x = clientX;\n      mousePosRef.current.y = clientY;\n\n      if (dragDropState) {\n        const { draggableElement, mouseOffset } = dragDropState;\n\n        if (dragBoundaries.current === UNBOUNDED && draggableElement) {\n          const dragPosX = mousePosRef.current.x - mouseOffset.x;\n          const dragPosY = mousePosRef.current.y - mouseOffset.y;\n          draggableElement.style.top = `${dragPosY}px`;\n          draggableElement.style.left = `${dragPosX}px`;\n        } else if (dragDistance > 0 && draggableElement) {\n          const mouseMoveDirection = lastClientPos < clientPos ? \"fwd\" : \"bwd\";\n          const scrollDirection = getScrollDirection(clientPos);\n          const dragPos = mousePosRef.current[POS] - mouseOffset[POS];\n          const START = orientation === \"horizontal\" ? \"left\" : \"top\";\n\n          if (\n            scrollDirection &&\n            isScrollableRef.current &&\n            !isScrolling.current\n          ) {\n            handleScrollStart?.(scrollDirection);\n            startScrolling(scrollDirection, 1);\n\n            if (scrollDirection === \"fwd\") {\n              draggableElement.style[START] = `${boundary.end}px`;\n            } else {\n              draggableElement.style[START] = `${boundary.start}px`;\n            }\n          } else if (!scrollDirection && isScrolling.current) {\n            stopScrolling();\n          }\n\n          if (!isScrolling.current) {\n            const renderDragPos = Math.round(\n              Math.max(boundary.start, Math.min(boundary.end, dragPos))\n            );\n            draggableElement.style[START] = `${renderDragPos}px`;\n            drag(renderDragPos, mouseMoveDirection);\n          }\n        }\n      }\n    },\n    [\n      drag,\n      dragHandedOvertoProvider,\n      getScrollDirection,\n      handleScrollStart,\n      isScrolling,\n      orientation,\n      startScrolling,\n      stopScrolling,\n    ]\n  );\n  const dragMouseUpHandler = useCallback(() => {\n    removeDragHandlers();\n    if (dragDropStateRef.current) {\n      settlingItemRef.current = dragDropStateRef.current.draggableElement;\n    }\n    const dropOptions = drop();\n    handleDrop(dropOptions);\n\n    setDraggableStatus((status) => ({\n      ...status,\n      draggedItemIndex: -1,\n      isDragging: false,\n    }));\n    // TODO clear the dragDropState\n  }, [drop, handleDrop, removeDragHandlers]);\n\n  dragMouseMoveHandlerRef.current = dragMouseMoveHandler;\n  dragMouseUpHandlerRef.current = dragMouseUpHandler;\n\n  const resumeDrag = useCallback<ResumeDragHandler>(\n    (dragDropState: DragDropState) => {\n      dragDropStateRef.current = dragDropState;\n      // Note this is using the draggable element rather than the original draggedElement\n      const { draggableElement, mouseOffset } = dragDropState;\n      const { current: container } = containerRef;\n\n      if (container && draggableElement) {\n        const containerRect = container.getBoundingClientRect();\n        const draggableRect = draggableElement.getBoundingClientRect();\n        setDragBoundaries(containerRect, draggableRect);\n\n        mousePosRef.current.x = draggableRect.left + mouseOffset.x;\n        mousePosRef.current.y = draggableRect.top + mouseOffset.y;\n\n        // why doesn't this work if we use the initialDragEement\n        beginDrag(draggableElement);\n\n        attachDragHandlers();\n\n        return true;\n      } else {\n        return false;\n      }\n    },\n    [attachDragHandlers, beginDrag, containerRef, setDragBoundaries]\n  );\n\n  const dragStart = useCallback(\n    (mousePosition: MousePosition) => {\n      const { current: container } = containerRef;\n      const { current: target } = mousedownElementRef;\n      const dragElement = getDraggableElement(target, itemQuery);\n      const scrollableContainer =\n        scrollingContainerRef?.current ??\n        getScrollableContainer(container, itemQuery);\n      if (container && scrollableContainer && dragElement) {\n        isScrollableRef.current = isContainerScrollable(\n          scrollableContainer,\n          orientation\n        );\n        scrollableContainerRef.current = scrollableContainer;\n\n        const containerRect = scrollableContainer.getBoundingClientRect();\n        const draggableRect = dragElement.getBoundingClientRect();\n\n        const dragDropState = (dragDropStateRef.current = new DragDropState(\n          mousePosition,\n          dragElement\n        ));\n\n        setDragBoundaries(containerRect, draggableRect);\n\n        beginDrag(dragElement);\n\n        const {\n          dataset: { index = \"-1\" },\n        } = dragElement;\n\n        setDraggableStatus({\n          isDragging: true,\n          draggable: (\n            <Draggable\n              element={cloneElement(dragElement)}\n              onDropped={terminateDrag}\n              onTransitionEnd={terminateDrag}\n              ref={dragDropState.setDraggable}\n              style={constrainRect(draggableRect, containerRect)}\n              wrapperClassName={draggableClassName}\n            />\n          ),\n          draggedItemIndex: parseInt(index),\n        });\n\n        onDragStart?.(dragDropState);\n        attachDragHandlers();\n\n        mousedownElementRef.current = null;\n      }\n    },\n    [\n      attachDragHandlers,\n      beginDrag,\n      containerRef,\n      draggableClassName,\n      itemQuery,\n      onDragStart,\n      orientation,\n      scrollingContainerRef,\n      setDragBoundaries,\n      terminateDrag,\n    ]\n  );\n\n  const preDragMouseMoveHandler = useCallback(\n    (evt: MouseEvent) => {\n      const { current: mouseDownPosition } = startPosRef;\n      const { CLIENT_POS, POS } = dimensions(orientation);\n      const { [CLIENT_POS]: clientPos } = evt;\n      const mouseMoveDistance = Math.abs(clientPos - mouseDownPosition[POS]);\n      if (mouseMoveDistance > dragThreshold && containerRef.current) {\n        if (mouseDownTimer.current) {\n          window.clearTimeout(mouseDownTimer.current);\n          mouseDownTimer.current = null;\n        }\n        document.removeEventListener(\"mousemove\", preDragMouseMoveHandler);\n        document.removeEventListener(\"mouseup\", preDragMouseUpHandler, false);\n\n        const mousePosition = {\n          clientX: mouseDownPosition.x,\n          clientY: mouseDownPosition.y,\n        };\n        dragStart(mousePosition);\n      }\n    },\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [containerRef, beginDrag, orientation]\n  );\n\n  const preDragMouseUpHandler = useCallback(() => {\n    if (mouseDownTimer.current) {\n      window.clearTimeout(mouseDownTimer.current);\n      mouseDownTimer.current = null;\n    }\n    document.removeEventListener(\"mousemove\", preDragMouseMoveHandler, false);\n    document.removeEventListener(\"mouseup\", preDragMouseUpHandler, false);\n  }, [preDragMouseMoveHandler]);\n\n  const mouseDownHandler: MouseEventHandler = useCallback(\n    (evt) => {\n      if (evt.button !== 0) {\n        return;\n      }\n      // TODO runtime check here for valid drop targets ?\n      const { current: container } = containerRef;\n      // We don't want to prevent other handlers on this element from working\n      // but we do want to stop a drag drop being initiated on a bubbled event.\n      evt.stopPropagation();\n      if (container && !evt.defaultPrevented) {\n        const { clientX, clientY } = evt;\n        mousePosRef.current.x = startPosRef.current.x = clientX;\n        mousePosRef.current.y = startPosRef.current.y = clientY;\n        mousedownElementRef.current = evt.target as HTMLElement;\n\n        const mousePosition = {\n          clientX,\n          clientY,\n        };\n\n        document.addEventListener(\"mousemove\", preDragMouseMoveHandler, false);\n        document.addEventListener(\"mouseup\", preDragMouseUpHandler, false);\n\n        evt.persist();\n\n        mouseDownTimer.current = window.setTimeout(() => {\n          document.removeEventListener(\n            \"mousemove\",\n            preDragMouseMoveHandler,\n            false\n          );\n          document.removeEventListener(\"mouseup\", preDragMouseUpHandler, false);\n          dragStart(mousePosition);\n        }, 500);\n      }\n    },\n    [containerRef, dragStart, preDragMouseMoveHandler, preDragMouseUpHandler]\n  );\n\n  const { current: settlingItem } = settlingItemRef;\n  useLayoutEffect(() => {\n    if (settlingItem && containerRef.current) {\n      const dropPos = dropPosRef.current;\n      const droppedItem = containerRef.current.querySelector(\n        `${itemQuery}[data-index=\"${dropPos}\"]`\n      );\n\n      if (droppedItem) {\n        droppedItem.classList.add(\"vuuDropTarget-settling\");\n        requestAnimationFrame(() => {\n          const { top: targetTop, left: targetLeft } =\n            droppedItem.getBoundingClientRect();\n          // If the droppedItem is already exactly in the drop position, we can just\n          // terminate the drag here and now. Most likely, though, it is out by a few\n          // pixels. We animate the dragged item into the final resting place before\n          // terminating the drag.\n          const style = getComputedStyle(settlingItem);\n          const currentLeft = parseInt(style.getPropertyValue(\"left\"));\n          const currentTop = parseInt(style.getPropertyValue(\"top\"));\n          if (currentLeft !== targetLeft || currentTop !== targetTop) {\n            settlingItem.classList.add(\"vuuDraggable-settling\");\n            settlingItem.style.top = `${targetTop}px`;\n            settlingItem.style.left = `${targetLeft}px`;\n          } else {\n            terminateDrag();\n          }\n        });\n      } else {\n        // didn't find the dragged item. This is currently happening\n        // because of a quirk with last item when scrolling has taken\n        //  place. Take no chances, make sure we don't keep an orphaned draggable\n        setDraggableStatus((status) => ({\n          ...status,\n          draggable: undefined,\n        }));\n      }\n    }\n  }, [containerRef, itemQuery, settlingItem, terminateDrag]);\n\n  useEffect(() => {\n    if (id && (isDragSource || isDropTarget)) {\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      //@ts-ignore TODO drah drop WIP\n      register(id, allowDragDrop === \"drop-only\" ? false : resumeDrag, onDrop);\n    }\n  }, [\n    allowDragDrop,\n    id,\n    isDragSource,\n    isDropTarget,\n    onDrop,\n    register,\n    resumeDrag,\n  ]);\n\n  return {\n    ...dragResult,\n    ...draggableStatus,\n    isScrolling,\n    onMouseDown:\n      allowDragDrop && allowDragDrop !== \"drop-only\"\n        ? mouseDownHandler\n        : undefined,\n  };\n};\n"],"names":["NULL_DROP_OPTIONS","NOT_OVERFLOWED","isOverflowElement","useRef","useState","useDragDropProvider","useCallback","dimensions","settlingItem","dispatchCustomEvent","useDragDropNaturalMovement","useDragDropIndicator","useDragDropCopy","useAutoScroll","getScrollableContainer","isContainerScrollable","DragDropState","jsx","Draggable","cloneElement","constrainRect","useLayoutEffect","useEffect"],"mappings":"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"}

package/cjs/drag-drop/useDragDropNaturalMovement.js

@@ -243,7 +243,8 @@ const useDragDropNaturalMovement = ({
     }
     dragPosition.direction = void 0;
     dragPosition.insertionPosition = -1;
-    const toIndex = overflowMenuShowingRef.current ? -1 : fromIndex < insertionPosition ? insertionPosition - 1 : insertionPosition;
+    const isLastItem = indexOfDraggedItem === dropTargets.length - 1;
+    const toIndex = overflowMenuShowingRef.current ? -1 : fromIndex < insertionPosition && !isLastItem ? insertionPosition - 1 : insertionPosition;
     return { fromIndex, toIndex, isExternal };
   }, [clearSpacers]);
   const releaseDrag = React.useCallback(() => {

package/cjs/drag-drop/useDragDropNaturalMovement.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDragDropNaturalMovement.js","sources":["../../src/drag-drop/useDragDropNaturalMovement.tsx"],"sourcesContent":["import { useCallback, useMemo, useRef, useState } from \"react\";\n\nimport {\n  Direction,\n  DropOptions,\n  InternalDragDropProps,\n  InternalDragHookResult,\n  ViewportRange,\n} from \"./dragDropTypes\";\nimport { useDragDisplacers } from \"./useDragDisplacers\";\nimport { dispatchMouseEvent } from \"@vuu-ui/vuu-utils\";\nimport {\n  dimensions,\n  getIndexOfDraggedItem,\n  getItemParentContainer,\n  getNextDropTarget,\n  MeasuredDropTarget,\n  measureDropTargets,\n  NOT_HIDDEN,\n  NOT_OVERFLOWED,\n} from \"./drop-target-utils\";\n\ntype DragPosition = {\n  direction?: Direction;\n  insertionPosition: number;\n};\n\nexport const useDragDropNaturalMovement = ({\n  containerRef,\n  orientation = \"horizontal\",\n  itemQuery = \"*\",\n  selected,\n  viewportRange,\n}: InternalDragDropProps): InternalDragHookResult => {\n  const dragPositionRef = useRef<DragPosition>({\n    direction: undefined,\n    insertionPosition: -1,\n  });\n  const isScrollable = useRef(false);\n  /** current position of dragged element */\n  const dragPosRef = useRef<number>(-1);\n  const measuredDropTargets = useRef<MeasuredDropTarget[]>([]);\n  const overflowMenuShowingRef = useRef(false);\n\n  const [showOverflow, setShowOverflow] = useState(false);\n\n  const { clearSpacers, displaceItem, displaceLastItem, setTerminalSpacer } =\n    useDragDisplacers(orientation);\n\n  const draggedItemRef = useRef<MeasuredDropTarget>();\n  const fullItemQuery = `:is(${itemQuery}${NOT_OVERFLOWED}${NOT_HIDDEN},.vuuOverflowContainer-OverflowIndicator)`;\n\n  const indexOf = (dropTarget: MeasuredDropTarget) =>\n    measuredDropTargets.current.findIndex((d) => d.id === dropTarget.id);\n\n  // Shouldn't need this - but viewportRange is always stale in stopScrolling. Checked all dependencies\n  // look ok. Something to do with setTimeout / scrollHandler ?\n  const rangeRef = useRef<ViewportRange>();\n  rangeRef.current = viewportRange;\n\n  const handleScrollStart = useCallback(\n    (scrollDirection: \"fwd\" | \"bwd\") => {\n      const itemContainer = getItemParentContainer(\n        containerRef.current,\n        itemQuery\n      );\n      const { current: draggedItem } = draggedItemRef;\n\n      // When we start scrolling, insert a spacer at the start of end of the collection.\n      // This is what we will need if user scrolls right to end and it will give the correct\n      // scrollHeight. Ig user stops scrolling before start/end we will reposition the\n      // spacer(s) appropriately\n      if (itemContainer && draggedItem) {\n        setTerminalSpacer(\n          itemContainer,\n          scrollDirection === \"fwd\" ? \"end\" : \"start\",\n          draggedItem.size\n        );\n      }\n    },\n    [containerRef, itemQuery, setTerminalSpacer]\n  );\n\n  const handleScrollStop = useCallback(\n    (scrollDirection: \"fwd\" | \"bwd\") => {\n      const { current: container } = containerRef;\n      const { current: draggedItem } = draggedItemRef;\n      const { current: dragPosition } = dragPositionRef;\n      if (container && draggedItem) {\n        const dropTargets = (measuredDropTargets.current = measureDropTargets(\n          container,\n          orientation,\n          fullItemQuery,\n          rangeRef.current\n        ));\n\n        const dropTargetAtBoundary =\n          scrollDirection === \"fwd\" ? dropTargets.at(-1) : dropTargets.at(0);\n\n        if (dropTargetAtBoundary) {\n          const { mid, end, size, start } = dropTargetAtBoundary;\n          if (scrollDirection === \"fwd\") {\n            const draggedDropTarget = {\n              ...draggedItem,\n              start: Math.round(start + size),\n              mid: Math.round(mid + size),\n              end: Math.round(end + size),\n            };\n            dropTargets.push(draggedDropTarget);\n            dragPosition.insertionPosition = dropTargetAtBoundary.index + 1;\n          } else {\n            const draggedDropTarget = {\n              ...draggedItem,\n              start: Math.round(start - size),\n              mid: Math.round(mid - size),\n              end: Math.round(end - size),\n            };\n            dropTargets.unshift(draggedDropTarget);\n            dragPosition.insertionPosition = 0;\n          }\n        }\n      }\n    },\n    [containerRef, fullItemQuery, orientation]\n  );\n\n  const beginDrag = useCallback(\n    (dragElement: HTMLElement) => {\n      if (\n        //TODO need a different check for selected\n        dragElement.ariaSelected &&\n        Array.isArray(selected) &&\n        selected.length > 1\n      ) {\n        console.log(\"its a selected element, and we have a multi select\");\n      }\n      const { current: container } = containerRef;\n      const { current: dragPosition } = dragPositionRef;\n\n      if (container && dragElement) {\n        const internalDrag = container.contains(dragElement);\n        const { SCROLL_SIZE, CLIENT_SIZE } = dimensions(orientation);\n        const { id: draggedItemId } = dragElement;\n        const { [SCROLL_SIZE]: scrollSize, [CLIENT_SIZE]: clientSize } =\n          container;\n        isScrollable.current = scrollSize > clientSize;\n        const dropTargets = (measuredDropTargets.current = measureDropTargets(\n          container,\n          orientation,\n          fullItemQuery,\n          viewportRange,\n          draggedItemId\n        ));\n\n        if (internalDrag) {\n          const indexOfDraggedItem = getIndexOfDraggedItem(dropTargets);\n          const draggedItem = dropTargets[indexOfDraggedItem];\n          if (draggedItem && container) {\n            draggedItemRef.current = draggedItem;\n            const displaceFunction = draggedItem.isLast\n              ? displaceLastItem\n              : displaceItem;\n\n            // This should return the insertion position of dragged item\n            // which depends on both dro[Target and direction]\n            dragPosition.insertionPosition = displaceFunction(\n              dropTargets,\n              draggedItem,\n              draggedItem.size,\n              false,\n              \"static\"\n            );\n          }\n        } else {\n          // prettier-ignore\n          const { top: dragPos, height: size } = dragElement.getBoundingClientRect();\n          // prettier-ignore\n          const dropTarget = getNextDropTarget( dropTargets, dragPos, size, \"fwd\");\n          const index = dropTargets.indexOf(dropTarget);\n          const { start, end, mid } = dropTarget;\n\n          // need to compute the correct position of this\n          // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n          // @ts-ignore\n          const draggedItem = (draggedItemRef.current = {\n            end,\n            mid,\n            start,\n            isDraggedItem: true,\n            isExternal: true,\n            size,\n          });\n\n          const indexOfDropTarget = dropTargets.indexOf(dropTarget);\n          // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n          // @ts-ignore\n          dropTargets.splice(indexOfDropTarget, 0, draggedItem);\n          for (let i = index + 1; i < dropTargets.length; i++) {\n            const target = dropTargets[i];\n            target.mid += size;\n            target.end += size;\n            target.start += size;\n          }\n\n          const displaceFunction = dropTarget.isLast\n            ? displaceLastItem\n            : displaceItem;\n\n          displaceFunction(\n            dropTargets,\n            dropTarget,\n            dropTarget.size,\n            true,\n            \"static\"\n          );\n        }\n      }\n    },\n    [\n      containerRef,\n      displaceItem,\n      displaceLastItem,\n      fullItemQuery,\n      orientation,\n      selected,\n      viewportRange,\n    ]\n  );\n\n  const [showPopup, hidePopup] = useMemo(() => {\n    let popupShowing = false;\n    const show = (dropTarget: MeasuredDropTarget) => {\n      if (!popupShowing) {\n        popupShowing = true;\n        const button = dropTarget.element.querySelector(\n          \".vuuPopupMenu\"\n        ) as HTMLElement;\n        if (button) {\n          dispatchMouseEvent(button, \"click\");\n        }\n      }\n    };\n\n    const hide = (dropTarget: MeasuredDropTarget) => {\n      if (popupShowing) {\n        popupShowing = false;\n        const button = dropTarget.element.querySelector(\n          \".vuuPopupMenu\"\n        ) as HTMLElement;\n        if (button) {\n          dispatchMouseEvent(button, \"click\");\n        }\n      }\n    };\n\n    return [show, hide];\n  }, []);\n\n  const drag = useCallback(\n    (dragPos: number, mouseMoveDirection: \"fwd\" | \"bwd\") => {\n      const { current: draggedItem } = draggedItemRef;\n      const { current: dragPosition } = dragPositionRef;\n\n      if (draggedItem) {\n        if (containerRef.current) {\n          dragPosRef.current = dragPos;\n\n          const { current: dropTargets } = measuredDropTargets;\n          const nextDropTarget = getNextDropTarget(\n            dropTargets,\n            dragPos,\n            draggedItem.size,\n            mouseMoveDirection\n          );\n\n          if (nextDropTarget && !nextDropTarget.isDraggedItem) {\n            if (nextDropTarget.isOverflowIndicator) {\n              // Does this belong in here or can we abstract it out\n              setShowOverflow((overflowMenuShowingRef.current = true));\n              showPopup(nextDropTarget);\n            } else {\n              const { size } = draggedItem;\n              const targetIndex = indexOf(nextDropTarget);\n\n              const displaceFunc =\n                targetIndex === dropTargets.length - 1\n                  ? displaceLastItem\n                  : displaceItem;\n\n              dragPosition.insertionPosition = displaceFunc(\n                dropTargets,\n                nextDropTarget,\n                size,\n                true,\n                mouseMoveDirection\n              );\n\n              const overflowIndicator = dropTargets.at(\n                -1\n              ) as MeasuredDropTarget;\n              hidePopup(overflowIndicator);\n              setShowOverflow((overflowMenuShowingRef.current = false));\n            }\n          }\n          dragPosition.direction = mouseMoveDirection;\n        }\n      }\n    },\n    [containerRef, displaceItem, displaceLastItem, hidePopup, showPopup]\n  );\n\n  const drop = useCallback((): DropOptions => {\n    clearSpacers();\n    const { current: dropTargets } = measuredDropTargets;\n    const { current: dragPosition } = dragPositionRef;\n    const indexOfDraggedItem = getIndexOfDraggedItem(dropTargets);\n    const draggedItem = dropTargets[indexOfDraggedItem];\n    const { insertionPosition } = dragPosition;\n    const { index: fromIndex, isExternal } = draggedItem;\n\n    if (overflowMenuShowingRef.current) {\n      setShowOverflow(false);\n    }\n\n    dragPosition.direction = undefined;\n    dragPosition.insertionPosition = -1;\n\n    const toIndex = overflowMenuShowingRef.current\n      ? -1\n      : fromIndex < insertionPosition\n      ? insertionPosition - 1\n      : insertionPosition;\n\n    return { fromIndex, toIndex, isExternal };\n  }, [clearSpacers]);\n\n  const releaseDrag = useCallback(() => {\n    clearSpacers(true);\n  }, [clearSpacers]);\n\n  return {\n    beginDrag,\n    drag,\n    drop,\n    handleScrollStart,\n    handleScrollStop,\n    releaseDrag,\n    revealOverflowedItems: showOverflow,\n  };\n};\n"],"names":["useRef","useState","useDragDisplacers","NOT_OVERFLOWED","NOT_HIDDEN","useCallback","getItemParentContainer","measureDropTargets","dimensions","getIndexOfDraggedItem","getNextDropTarget","useMemo","dispatchMouseEvent"],"mappings":";;;;;;;AA2BO,MAAM,6BAA6B,CAAC;AAAA,EACzC,YAAA;AAAA,EACA,WAAc,GAAA,YAAA;AAAA,EACd,SAAY,GAAA,GAAA;AAAA,EACZ,QAAA;AAAA,EACA,aAAA;AACF,CAAqD,KAAA;AACnD,EAAA,MAAM,kBAAkBA,YAAqB,CAAA;AAAA,IAC3C,SAAW,EAAA,KAAA,CAAA;AAAA,IACX,iBAAmB,EAAA,CAAA,CAAA;AAAA,GACpB,CAAA,CAAA;AACD,EAAM,MAAA,YAAA,GAAeA,aAAO,KAAK,CAAA,CAAA;AAEjC,EAAM,MAAA,UAAA,GAAaA,aAAe,CAAE,CAAA,CAAA,CAAA;AACpC,EAAM,MAAA,mBAAA,GAAsBA,YAA6B,CAAA,EAAE,CAAA,CAAA;AAC3D,EAAM,MAAA,sBAAA,GAAyBA,aAAO,KAAK,CAAA,CAAA;AAE3C,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAIC,eAAS,KAAK,CAAA,CAAA;AAEtD,EAAA,MAAM,EAAE,YAAc,EAAA,YAAA,EAAc,kBAAkB,iBAAkB,EAAA,GACtEC,oCAAkB,WAAW,CAAA,CAAA;AAE/B,EAAA,MAAM,iBAAiBF,YAA2B,EAAA,CAAA;AAClD,EAAA,MAAM,gBAAgB,CAAO,IAAA,EAAA,SAAS,CAAG,EAAAG,8BAAc,GAAGC,0BAAU,CAAA,yCAAA,CAAA,CAAA;AAEpE,EAAM,MAAA,OAAA,GAAU,CAAC,UAAA,KACf,mBAAoB,CAAA,OAAA,CAAQ,SAAU,CAAA,CAAC,CAAM,KAAA,CAAA,CAAE,EAAO,KAAA,UAAA,CAAW,EAAE,CAAA,CAAA;AAIrE,EAAA,MAAM,WAAWJ,YAAsB,EAAA,CAAA;AACvC,EAAA,QAAA,CAAS,OAAU,GAAA,aAAA,CAAA;AAEnB,EAAA,MAAM,iBAAoB,GAAAK,iBAAA;AAAA,IACxB,CAAC,eAAmC,KAAA;AAClC,MAAA,MAAM,aAAgB,GAAAC,sCAAA;AAAA,QACpB,YAAa,CAAA,OAAA;AAAA,QACb,SAAA;AAAA,OACF,CAAA;AACA,MAAM,MAAA,EAAE,OAAS,EAAA,WAAA,EAAgB,GAAA,cAAA,CAAA;AAMjC,MAAA,IAAI,iBAAiB,WAAa,EAAA;AAChC,QAAA,iBAAA;AAAA,UACE,aAAA;AAAA,UACA,eAAA,KAAoB,QAAQ,KAAQ,GAAA,OAAA;AAAA,UACpC,WAAY,CAAA,IAAA;AAAA,SACd,CAAA;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,YAAc,EAAA,SAAA,EAAW,iBAAiB,CAAA;AAAA,GAC7C,CAAA;AAEA,EAAA,MAAM,gBAAmB,GAAAD,iBAAA;AAAA,IACvB,CAAC,eAAmC,KAAA;AAClC,MAAM,MAAA,EAAE,OAAS,EAAA,SAAA,EAAc,GAAA,YAAA,CAAA;AAC/B,MAAM,MAAA,EAAE,OAAS,EAAA,WAAA,EAAgB,GAAA,cAAA,CAAA;AACjC,MAAM,MAAA,EAAE,OAAS,EAAA,YAAA,EAAiB,GAAA,eAAA,CAAA;AAClC,MAAA,IAAI,aAAa,WAAa,EAAA;AAC5B,QAAM,MAAA,WAAA,GAAe,oBAAoB,OAAU,GAAAE,kCAAA;AAAA,UACjD,SAAA;AAAA,UACA,WAAA;AAAA,UACA,aAAA;AAAA,UACA,QAAS,CAAA,OAAA;AAAA,SACX,CAAA;AAEA,QAAM,MAAA,oBAAA,GACJ,oBAAoB,KAAQ,GAAA,WAAA,CAAY,GAAG,CAAE,CAAA,CAAA,GAAI,WAAY,CAAA,EAAA,CAAG,CAAC,CAAA,CAAA;AAEnE,QAAA,IAAI,oBAAsB,EAAA;AACxB,UAAA,MAAM,EAAE,GAAA,EAAK,GAAK,EAAA,IAAA,EAAM,OAAU,GAAA,oBAAA,CAAA;AAClC,UAAA,IAAI,oBAAoB,KAAO,EAAA;AAC7B,YAAA,MAAM,iBAAoB,GAAA;AAAA,cACxB,GAAG,WAAA;AAAA,cACH,KAAO,EAAA,IAAA,CAAK,KAAM,CAAA,KAAA,GAAQ,IAAI,CAAA;AAAA,cAC9B,GAAK,EAAA,IAAA,CAAK,KAAM,CAAA,GAAA,GAAM,IAAI,CAAA;AAAA,cAC1B,GAAK,EAAA,IAAA,CAAK,KAAM,CAAA,GAAA,GAAM,IAAI,CAAA;AAAA,aAC5B,CAAA;AACA,YAAA,WAAA,CAAY,KAAK,iBAAiB,CAAA,CAAA;AAClC,YAAa,YAAA,CAAA,iBAAA,GAAoB,qBAAqB,KAAQ,GAAA,CAAA,CAAA;AAAA,WACzD,MAAA;AACL,YAAA,MAAM,iBAAoB,GAAA;AAAA,cACxB,GAAG,WAAA;AAAA,cACH,KAAO,EAAA,IAAA,CAAK,KAAM,CAAA,KAAA,GAAQ,IAAI,CAAA;AAAA,cAC9B,GAAK,EAAA,IAAA,CAAK,KAAM,CAAA,GAAA,GAAM,IAAI,CAAA;AAAA,cAC1B,GAAK,EAAA,IAAA,CAAK,KAAM,CAAA,GAAA,GAAM,IAAI,CAAA;AAAA,aAC5B,CAAA;AACA,YAAA,WAAA,CAAY,QAAQ,iBAAiB,CAAA,CAAA;AACrC,YAAA,YAAA,CAAa,iBAAoB,GAAA,CAAA,CAAA;AAAA,WACnC;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,YAAc,EAAA,aAAA,EAAe,WAAW,CAAA;AAAA,GAC3C,CAAA;AAEA,EAAA,MAAM,SAAY,GAAAF,iBAAA;AAAA,IAChB,CAAC,WAA6B,KAAA;AAC5B,MAAA;AAAA;AAAA,QAEE,YAAY,YACZ,IAAA,KAAA,CAAM,QAAQ,QAAQ,CAAA,IACtB,SAAS,MAAS,GAAA,CAAA;AAAA,QAClB;AACA,QAAA,OAAA,CAAQ,IAAI,oDAAoD,CAAA,CAAA;AAAA,OAClE;AACA,MAAM,MAAA,EAAE,OAAS,EAAA,SAAA,EAAc,GAAA,YAAA,CAAA;AAC/B,MAAM,MAAA,EAAE,OAAS,EAAA,YAAA,EAAiB,GAAA,eAAA,CAAA;AAElC,MAAA,IAAI,aAAa,WAAa,EAAA;AAC5B,QAAM,MAAA,YAAA,GAAe,SAAU,CAAA,QAAA,CAAS,WAAW,CAAA,CAAA;AACnD,QAAA,MAAM,EAAE,WAAA,EAAa,WAAY,EAAA,GAAIG,2BAAW,WAAW,CAAA,CAAA;AAC3D,QAAM,MAAA,EAAE,EAAI,EAAA,aAAA,EAAkB,GAAA,WAAA,CAAA;AAC9B,QAAM,MAAA,EAAE,CAAC,WAAW,GAAG,YAAY,CAAC,WAAW,GAAG,UAAA,EAChD,GAAA,SAAA,CAAA;AACF,QAAA,YAAA,CAAa,UAAU,UAAa,GAAA,UAAA,CAAA;AACpC,QAAM,MAAA,WAAA,GAAe,oBAAoB,OAAU,GAAAD,kCAAA;AAAA,UACjD,SAAA;AAAA,UACA,WAAA;AAAA,UACA,aAAA;AAAA,UACA,aAAA;AAAA,UACA,aAAA;AAAA,SACF,CAAA;AAEA,QAAA,IAAI,YAAc,EAAA;AAChB,UAAM,MAAA,kBAAA,GAAqBE,sCAAsB,WAAW,CAAA,CAAA;AAC5D,UAAM,MAAA,WAAA,GAAc,YAAY,kBAAkB,CAAA,CAAA;AAClD,UAAA,IAAI,eAAe,SAAW,EAAA;AAC5B,YAAA,cAAA,CAAe,OAAU,GAAA,WAAA,CAAA;AACzB,YAAM,MAAA,gBAAA,GAAmB,WAAY,CAAA,MAAA,GACjC,gBACA,GAAA,YAAA,CAAA;AAIJ,YAAA,YAAA,CAAa,iBAAoB,GAAA,gBAAA;AAAA,cAC/B,WAAA;AAAA,cACA,WAAA;AAAA,cACA,WAAY,CAAA,IAAA;AAAA,cACZ,KAAA;AAAA,cACA,QAAA;AAAA,aACF,CAAA;AAAA,WACF;AAAA,SACK,MAAA;AAEL,UAAA,MAAM,EAAE,GAAK,EAAA,OAAA,EAAS,QAAQ,IAAK,EAAA,GAAI,YAAY,qBAAsB,EAAA,CAAA;AAEzE,UAAA,MAAM,UAAa,GAAAC,iCAAA,CAAmB,WAAa,EAAA,OAAA,EAAS,MAAM,KAAK,CAAA,CAAA;AACvE,UAAM,MAAA,KAAA,GAAQ,WAAY,CAAA,OAAA,CAAQ,UAAU,CAAA,CAAA;AAC5C,UAAA,MAAM,EAAE,KAAA,EAAO,GAAK,EAAA,GAAA,EAAQ,GAAA,UAAA,CAAA;AAK5B,UAAM,MAAA,WAAA,GAAe,eAAe,OAAU,GAAA;AAAA,YAC5C,GAAA;AAAA,YACA,GAAA;AAAA,YACA,KAAA;AAAA,YACA,aAAe,EAAA,IAAA;AAAA,YACf,UAAY,EAAA,IAAA;AAAA,YACZ,IAAA;AAAA,WACF,CAAA;AAEA,UAAM,MAAA,iBAAA,GAAoB,WAAY,CAAA,OAAA,CAAQ,UAAU,CAAA,CAAA;AAGxD,UAAY,WAAA,CAAA,MAAA,CAAO,iBAAmB,EAAA,CAAA,EAAG,WAAW,CAAA,CAAA;AACpD,UAAA,KAAA,IAAS,IAAI,KAAQ,GAAA,CAAA,EAAG,CAAI,GAAA,WAAA,CAAY,QAAQ,CAAK,EAAA,EAAA;AACnD,YAAM,MAAA,MAAA,GAAS,YAAY,CAAC,CAAA,CAAA;AAC5B,YAAA,MAAA,CAAO,GAAO,IAAA,IAAA,CAAA;AACd,YAAA,MAAA,CAAO,GAAO,IAAA,IAAA,CAAA;AACd,YAAA,MAAA,CAAO,KAAS,IAAA,IAAA,CAAA;AAAA,WAClB;AAEA,UAAM,MAAA,gBAAA,GAAmB,UAAW,CAAA,MAAA,GAChC,gBACA,GAAA,YAAA,CAAA;AAEJ,UAAA,gBAAA;AAAA,YACE,WAAA;AAAA,YACA,UAAA;AAAA,YACA,UAAW,CAAA,IAAA;AAAA,YACX,IAAA;AAAA,YACA,QAAA;AAAA,WACF,CAAA;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAAA,IACA;AAAA,MACE,YAAA;AAAA,MACA,YAAA;AAAA,MACA,gBAAA;AAAA,MACA,aAAA;AAAA,MACA,WAAA;AAAA,MACA,QAAA;AAAA,MACA,aAAA;AAAA,KACF;AAAA,GACF,CAAA;AAEA,EAAA,MAAM,CAAC,SAAA,EAAW,SAAS,CAAA,GAAIC,cAAQ,MAAM;AAC3C,IAAA,IAAI,YAAe,GAAA,KAAA,CAAA;AACnB,IAAM,MAAA,IAAA,GAAO,CAAC,UAAmC,KAAA;AAC/C,MAAA,IAAI,CAAC,YAAc,EAAA;AACjB,QAAe,YAAA,GAAA,IAAA,CAAA;AACf,QAAM,MAAA,MAAA,GAAS,WAAW,OAAQ,CAAA,aAAA;AAAA,UAChC,eAAA;AAAA,SACF,CAAA;AACA,QAAA,IAAI,MAAQ,EAAA;AACV,UAAAC,2BAAA,CAAmB,QAAQ,OAAO,CAAA,CAAA;AAAA,SACpC;AAAA,OACF;AAAA,KACF,CAAA;AAEA,IAAM,MAAA,IAAA,GAAO,CAAC,UAAmC,KAAA;AAC/C,MAAA,IAAI,YAAc,EAAA;AAChB,QAAe,YAAA,GAAA,KAAA,CAAA;AACf,QAAM,MAAA,MAAA,GAAS,WAAW,OAAQ,CAAA,aAAA;AAAA,UAChC,eAAA;AAAA,SACF,CAAA;AACA,QAAA,IAAI,MAAQ,EAAA;AACV,UAAAA,2BAAA,CAAmB,QAAQ,OAAO,CAAA,CAAA;AAAA,SACpC;AAAA,OACF;AAAA,KACF,CAAA;AAEA,IAAO,OAAA,CAAC,MAAM,IAAI,CAAA,CAAA;AAAA,GACpB,EAAG,EAAE,CAAA,CAAA;AAEL,EAAA,MAAM,IAAO,GAAAP,iBAAA;AAAA,IACX,CAAC,SAAiB,kBAAsC,KAAA;AACtD,MAAM,MAAA,EAAE,OAAS,EAAA,WAAA,EAAgB,GAAA,cAAA,CAAA;AACjC,MAAM,MAAA,EAAE,OAAS,EAAA,YAAA,EAAiB,GAAA,eAAA,CAAA;AAElC,MAAA,IAAI,WAAa,EAAA;AACf,QAAA,IAAI,aAAa,OAAS,EAAA;AACxB,UAAA,UAAA,CAAW,OAAU,GAAA,OAAA,CAAA;AAErB,UAAM,MAAA,EAAE,OAAS,EAAA,WAAA,EAAgB,GAAA,mBAAA,CAAA;AACjC,UAAA,MAAM,cAAiB,GAAAK,iCAAA;AAAA,YACrB,WAAA;AAAA,YACA,OAAA;AAAA,YACA,WAAY,CAAA,IAAA;AAAA,YACZ,kBAAA;AAAA,WACF,CAAA;AAEA,UAAI,IAAA,cAAA,IAAkB,CAAC,cAAA,CAAe,aAAe,EAAA;AACnD,YAAA,IAAI,eAAe,mBAAqB,EAAA;AAEtC,cAAiB,eAAA,CAAA,sBAAA,CAAuB,UAAU,IAAK,CAAA,CAAA;AACvD,cAAA,SAAA,CAAU,cAAc,CAAA,CAAA;AAAA,aACnB,MAAA;AACL,cAAM,MAAA,EAAE,MAAS,GAAA,WAAA,CAAA;AACjB,cAAM,MAAA,WAAA,GAAc,QAAQ,cAAc,CAAA,CAAA;AAE1C,cAAA,MAAM,YACJ,GAAA,WAAA,KAAgB,WAAY,CAAA,MAAA,GAAS,IACjC,gBACA,GAAA,YAAA,CAAA;AAEN,cAAA,YAAA,CAAa,iBAAoB,GAAA,YAAA;AAAA,gBAC/B,WAAA;AAAA,gBACA,cAAA;AAAA,gBACA,IAAA;AAAA,gBACA,IAAA;AAAA,gBACA,kBAAA;AAAA,eACF,CAAA;AAEA,cAAA,MAAM,oBAAoB,WAAY,CAAA,EAAA;AAAA,gBACpC,CAAA,CAAA;AAAA,eACF,CAAA;AACA,cAAA,SAAA,CAAU,iBAAiB,CAAA,CAAA;AAC3B,cAAiB,eAAA,CAAA,sBAAA,CAAuB,UAAU,KAAM,CAAA,CAAA;AAAA,aAC1D;AAAA,WACF;AACA,UAAA,YAAA,CAAa,SAAY,GAAA,kBAAA,CAAA;AAAA,SAC3B;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,YAAA,EAAc,YAAc,EAAA,gBAAA,EAAkB,WAAW,SAAS,CAAA;AAAA,GACrE,CAAA;AAEA,EAAM,MAAA,IAAA,GAAOL,kBAAY,MAAmB;AAC1C,IAAa,YAAA,EAAA,CAAA;AACb,IAAM,MAAA,EAAE,OAAS,EAAA,WAAA,EAAgB,GAAA,mBAAA,CAAA;AACjC,IAAM,MAAA,EAAE,OAAS,EAAA,YAAA,EAAiB,GAAA,eAAA,CAAA;AAClC,IAAM,MAAA,kBAAA,GAAqBI,sCAAsB,WAAW,CAAA,CAAA;AAC5D,IAAM,MAAA,WAAA,GAAc,YAAY,kBAAkB,CAAA,CAAA;AAClD,IAAM,MAAA,EAAE,mBAAsB,GAAA,YAAA,CAAA;AAC9B,IAAA,MAAM,EAAE,KAAA,EAAO,SAAW,EAAA,UAAA,EAAe,GAAA,WAAA,CAAA;AAEzC,IAAA,IAAI,uBAAuB,OAAS,EAAA;AAClC,MAAA,eAAA,CAAgB,KAAK,CAAA,CAAA;AAAA,KACvB;AAEA,IAAA,YAAA,CAAa,SAAY,GAAA,KAAA,CAAA,CAAA;AACzB,IAAA,YAAA,CAAa,iBAAoB,GAAA,CAAA,CAAA,CAAA;AAEjC,IAAA,MAAM,UAAU,sBAAuB,CAAA,OAAA,GACnC,KACA,SAAY,GAAA,iBAAA,GACZ,oBAAoB,CACpB,GAAA,iBAAA,CAAA;AAEJ,IAAO,OAAA,EAAE,SAAW,EAAA,OAAA,EAAS,UAAW,EAAA,CAAA;AAAA,GAC1C,EAAG,CAAC,YAAY,CAAC,CAAA,CAAA;AAEjB,EAAM,MAAA,WAAA,GAAcJ,kBAAY,MAAM;AACpC,IAAA,YAAA,CAAa,IAAI,CAAA,CAAA;AAAA,GACnB,EAAG,CAAC,YAAY,CAAC,CAAA,CAAA;AAEjB,EAAO,OAAA;AAAA,IACL,SAAA;AAAA,IACA,IAAA;AAAA,IACA,IAAA;AAAA,IACA,iBAAA;AAAA,IACA,gBAAA;AAAA,IACA,WAAA;AAAA,IACA,qBAAuB,EAAA,YAAA;AAAA,GACzB,CAAA;AACF;;;;"}
+{"version":3,"file":"useDragDropNaturalMovement.js","sources":["../../src/drag-drop/useDragDropNaturalMovement.tsx"],"sourcesContent":["import { useCallback, useMemo, useRef, useState } from \"react\";\n\nimport {\n  Direction,\n  DropOptions,\n  InternalDragDropProps,\n  InternalDragHookResult,\n  ViewportRange,\n} from \"./dragDropTypes\";\nimport { useDragDisplacers } from \"./useDragDisplacers\";\nimport { dispatchMouseEvent } from \"@vuu-ui/vuu-utils\";\nimport {\n  dimensions,\n  getIndexOfDraggedItem,\n  getItemParentContainer,\n  getNextDropTarget,\n  MeasuredDropTarget,\n  measureDropTargets,\n  NOT_HIDDEN,\n  NOT_OVERFLOWED,\n} from \"./drop-target-utils\";\n\ntype DragPosition = {\n  direction?: Direction;\n  insertionPosition: number;\n};\n\nexport const useDragDropNaturalMovement = ({\n  containerRef,\n  orientation = \"horizontal\",\n  itemQuery = \"*\",\n  selected,\n  viewportRange,\n}: InternalDragDropProps): InternalDragHookResult => {\n  const dragPositionRef = useRef<DragPosition>({\n    direction: undefined,\n    insertionPosition: -1,\n  });\n  const isScrollable = useRef(false);\n  /** current position of dragged element */\n  const dragPosRef = useRef<number>(-1);\n  const measuredDropTargets = useRef<MeasuredDropTarget[]>([]);\n  const overflowMenuShowingRef = useRef(false);\n\n  const [showOverflow, setShowOverflow] = useState(false);\n\n  const { clearSpacers, displaceItem, displaceLastItem, setTerminalSpacer } =\n    useDragDisplacers(orientation);\n\n  const draggedItemRef = useRef<MeasuredDropTarget>();\n  const fullItemQuery = `:is(${itemQuery}${NOT_OVERFLOWED}${NOT_HIDDEN},.vuuOverflowContainer-OverflowIndicator)`;\n\n  const indexOf = (dropTarget: MeasuredDropTarget) =>\n    measuredDropTargets.current.findIndex((d) => d.id === dropTarget.id);\n\n  // Shouldn't need this - but viewportRange is always stale in stopScrolling. Checked all dependencies\n  // look ok. Something to do with setTimeout / scrollHandler ?\n  const rangeRef = useRef<ViewportRange>();\n  rangeRef.current = viewportRange;\n\n  const handleScrollStart = useCallback(\n    (scrollDirection: \"fwd\" | \"bwd\") => {\n      const itemContainer = getItemParentContainer(\n        containerRef.current,\n        itemQuery\n      );\n      const { current: draggedItem } = draggedItemRef;\n\n      // When we start scrolling, insert a spacer at the start of end of the collection.\n      // This is what we will need if user scrolls right to end and it will give the correct\n      // scrollHeight. Ig user stops scrolling before start/end we will reposition the\n      // spacer(s) appropriately\n      if (itemContainer && draggedItem) {\n        setTerminalSpacer(\n          itemContainer,\n          scrollDirection === \"fwd\" ? \"end\" : \"start\",\n          draggedItem.size\n        );\n      }\n    },\n    [containerRef, itemQuery, setTerminalSpacer]\n  );\n\n  const handleScrollStop = useCallback(\n    (scrollDirection: \"fwd\" | \"bwd\") => {\n      const { current: container } = containerRef;\n      const { current: draggedItem } = draggedItemRef;\n      const { current: dragPosition } = dragPositionRef;\n      if (container && draggedItem) {\n        const dropTargets = (measuredDropTargets.current = measureDropTargets(\n          container,\n          orientation,\n          fullItemQuery,\n          rangeRef.current\n        ));\n\n        const dropTargetAtBoundary =\n          scrollDirection === \"fwd\" ? dropTargets.at(-1) : dropTargets.at(0);\n\n        if (dropTargetAtBoundary) {\n          const { mid, end, size, start } = dropTargetAtBoundary;\n          if (scrollDirection === \"fwd\") {\n            const draggedDropTarget = {\n              ...draggedItem,\n              start: Math.round(start + size),\n              mid: Math.round(mid + size),\n              end: Math.round(end + size),\n            };\n            dropTargets.push(draggedDropTarget);\n            dragPosition.insertionPosition = dropTargetAtBoundary.index + 1;\n          } else {\n            const draggedDropTarget = {\n              ...draggedItem,\n              start: Math.round(start - size),\n              mid: Math.round(mid - size),\n              end: Math.round(end - size),\n            };\n            dropTargets.unshift(draggedDropTarget);\n            dragPosition.insertionPosition = 0;\n          }\n        }\n      }\n    },\n    [containerRef, fullItemQuery, orientation]\n  );\n\n  const beginDrag = useCallback(\n    (dragElement: HTMLElement) => {\n      if (\n        //TODO need a different check for selected\n        dragElement.ariaSelected &&\n        Array.isArray(selected) &&\n        selected.length > 1\n      ) {\n        console.log(\"its a selected element, and we have a multi select\");\n      }\n      const { current: container } = containerRef;\n      const { current: dragPosition } = dragPositionRef;\n\n      if (container && dragElement) {\n        const internalDrag = container.contains(dragElement);\n        const { SCROLL_SIZE, CLIENT_SIZE } = dimensions(orientation);\n        const { id: draggedItemId } = dragElement;\n        const { [SCROLL_SIZE]: scrollSize, [CLIENT_SIZE]: clientSize } =\n          container;\n        isScrollable.current = scrollSize > clientSize;\n        const dropTargets = (measuredDropTargets.current = measureDropTargets(\n          container,\n          orientation,\n          fullItemQuery,\n          viewportRange,\n          draggedItemId\n        ));\n\n        if (internalDrag) {\n          const indexOfDraggedItem = getIndexOfDraggedItem(dropTargets);\n          const draggedItem = dropTargets[indexOfDraggedItem];\n          if (draggedItem && container) {\n            draggedItemRef.current = draggedItem;\n            const displaceFunction = draggedItem.isLast\n              ? displaceLastItem\n              : displaceItem;\n\n            // This should return the insertion position of dragged item\n            // which depends on both dro[Target and direction]\n            dragPosition.insertionPosition = displaceFunction(\n              dropTargets,\n              draggedItem,\n              draggedItem.size,\n              false,\n              \"static\"\n            );\n          }\n        } else {\n          // prettier-ignore\n          const { top: dragPos, height: size } = dragElement.getBoundingClientRect();\n          // prettier-ignore\n          const dropTarget = getNextDropTarget( dropTargets, dragPos, size, \"fwd\");\n          const index = dropTargets.indexOf(dropTarget);\n          const { start, end, mid } = dropTarget;\n\n          // need to compute the correct position of this\n          // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n          // @ts-ignore\n          const draggedItem = (draggedItemRef.current = {\n            end,\n            mid,\n            start,\n            isDraggedItem: true,\n            isExternal: true,\n            size,\n          });\n\n          const indexOfDropTarget = dropTargets.indexOf(dropTarget);\n          // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n          // @ts-ignore\n          dropTargets.splice(indexOfDropTarget, 0, draggedItem);\n          for (let i = index + 1; i < dropTargets.length; i++) {\n            const target = dropTargets[i];\n            target.mid += size;\n            target.end += size;\n            target.start += size;\n          }\n\n          const displaceFunction = dropTarget.isLast\n            ? displaceLastItem\n            : displaceItem;\n\n          displaceFunction(\n            dropTargets,\n            dropTarget,\n            dropTarget.size,\n            true,\n            \"static\"\n          );\n        }\n      }\n    },\n    [\n      containerRef,\n      displaceItem,\n      displaceLastItem,\n      fullItemQuery,\n      orientation,\n      selected,\n      viewportRange,\n    ]\n  );\n\n  const [showPopup, hidePopup] = useMemo(() => {\n    let popupShowing = false;\n    const show = (dropTarget: MeasuredDropTarget) => {\n      if (!popupShowing) {\n        popupShowing = true;\n        const button = dropTarget.element.querySelector(\n          \".vuuPopupMenu\"\n        ) as HTMLElement;\n        if (button) {\n          dispatchMouseEvent(button, \"click\");\n        }\n      }\n    };\n\n    const hide = (dropTarget: MeasuredDropTarget) => {\n      if (popupShowing) {\n        popupShowing = false;\n        const button = dropTarget.element.querySelector(\n          \".vuuPopupMenu\"\n        ) as HTMLElement;\n        if (button) {\n          dispatchMouseEvent(button, \"click\");\n        }\n      }\n    };\n\n    return [show, hide];\n  }, []);\n\n  const drag = useCallback(\n    (dragPos: number, mouseMoveDirection: \"fwd\" | \"bwd\") => {\n      const { current: draggedItem } = draggedItemRef;\n      const { current: dragPosition } = dragPositionRef;\n\n      if (draggedItem) {\n        if (containerRef.current) {\n          dragPosRef.current = dragPos;\n\n          const { current: dropTargets } = measuredDropTargets;\n          const nextDropTarget = getNextDropTarget(\n            dropTargets,\n            dragPos,\n            draggedItem.size,\n            mouseMoveDirection\n          );\n\n          if (nextDropTarget && !nextDropTarget.isDraggedItem) {\n            if (nextDropTarget.isOverflowIndicator) {\n              // Does this belong in here or can we abstract it out\n              setShowOverflow((overflowMenuShowingRef.current = true));\n              showPopup(nextDropTarget);\n            } else {\n              const { size } = draggedItem;\n              const targetIndex = indexOf(nextDropTarget);\n\n              const displaceFunc =\n                targetIndex === dropTargets.length - 1\n                  ? displaceLastItem\n                  : displaceItem;\n\n              dragPosition.insertionPosition = displaceFunc(\n                dropTargets,\n                nextDropTarget,\n                size,\n                true,\n                mouseMoveDirection\n              );\n\n              const overflowIndicator = dropTargets.at(\n                -1\n              ) as MeasuredDropTarget;\n              hidePopup(overflowIndicator);\n              setShowOverflow((overflowMenuShowingRef.current = false));\n            }\n          }\n          dragPosition.direction = mouseMoveDirection;\n        }\n      }\n    },\n    [containerRef, displaceItem, displaceLastItem, hidePopup, showPopup]\n  );\n\n  const drop = useCallback((): DropOptions => {\n    clearSpacers();\n    const { current: dropTargets } = measuredDropTargets;\n    const { current: dragPosition } = dragPositionRef;\n    const indexOfDraggedItem = getIndexOfDraggedItem(dropTargets);\n    const draggedItem = dropTargets[indexOfDraggedItem];\n    const { insertionPosition } = dragPosition;\n    const { index: fromIndex, isExternal } = draggedItem;\n\n    if (overflowMenuShowingRef.current) {\n      setShowOverflow(false);\n    }\n\n    dragPosition.direction = undefined;\n    dragPosition.insertionPosition = -1;\n\n    const isLastItem = indexOfDraggedItem === dropTargets.length - 1;\n    const toIndex = overflowMenuShowingRef.current\n      ? -1\n      : fromIndex < insertionPosition && !isLastItem\n      ? insertionPosition - 1\n      : insertionPosition;\n\n    return { fromIndex, toIndex, isExternal };\n  }, [clearSpacers]);\n\n  const releaseDrag = useCallback(() => {\n    clearSpacers(true);\n  }, [clearSpacers]);\n\n  return {\n    beginDrag,\n    drag,\n    drop,\n    handleScrollStart,\n    handleScrollStop,\n    releaseDrag,\n    revealOverflowedItems: showOverflow,\n  };\n};\n"],"names":["useRef","useState","useDragDisplacers","NOT_OVERFLOWED","NOT_HIDDEN","useCallback","getItemParentContainer","measureDropTargets","dimensions","getIndexOfDraggedItem","getNextDropTarget","useMemo","dispatchMouseEvent"],"mappings":";;;;;;;AA2BO,MAAM,6BAA6B,CAAC;AAAA,EACzC,YAAA;AAAA,EACA,WAAc,GAAA,YAAA;AAAA,EACd,SAAY,GAAA,GAAA;AAAA,EACZ,QAAA;AAAA,EACA,aAAA;AACF,CAAqD,KAAA;AACnD,EAAA,MAAM,kBAAkBA,YAAqB,CAAA;AAAA,IAC3C,SAAW,EAAA,KAAA,CAAA;AAAA,IACX,iBAAmB,EAAA,CAAA,CAAA;AAAA,GACpB,CAAA,CAAA;AACD,EAAM,MAAA,YAAA,GAAeA,aAAO,KAAK,CAAA,CAAA;AAEjC,EAAM,MAAA,UAAA,GAAaA,aAAe,CAAE,CAAA,CAAA,CAAA;AACpC,EAAM,MAAA,mBAAA,GAAsBA,YAA6B,CAAA,EAAE,CAAA,CAAA;AAC3D,EAAM,MAAA,sBAAA,GAAyBA,aAAO,KAAK,CAAA,CAAA;AAE3C,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAIC,eAAS,KAAK,CAAA,CAAA;AAEtD,EAAA,MAAM,EAAE,YAAc,EAAA,YAAA,EAAc,kBAAkB,iBAAkB,EAAA,GACtEC,oCAAkB,WAAW,CAAA,CAAA;AAE/B,EAAA,MAAM,iBAAiBF,YAA2B,EAAA,CAAA;AAClD,EAAA,MAAM,gBAAgB,CAAO,IAAA,EAAA,SAAS,CAAG,EAAAG,8BAAc,GAAGC,0BAAU,CAAA,yCAAA,CAAA,CAAA;AAEpE,EAAM,MAAA,OAAA,GAAU,CAAC,UAAA,KACf,mBAAoB,CAAA,OAAA,CAAQ,SAAU,CAAA,CAAC,CAAM,KAAA,CAAA,CAAE,EAAO,KAAA,UAAA,CAAW,EAAE,CAAA,CAAA;AAIrE,EAAA,MAAM,WAAWJ,YAAsB,EAAA,CAAA;AACvC,EAAA,QAAA,CAAS,OAAU,GAAA,aAAA,CAAA;AAEnB,EAAA,MAAM,iBAAoB,GAAAK,iBAAA;AAAA,IACxB,CAAC,eAAmC,KAAA;AAClC,MAAA,MAAM,aAAgB,GAAAC,sCAAA;AAAA,QACpB,YAAa,CAAA,OAAA;AAAA,QACb,SAAA;AAAA,OACF,CAAA;AACA,MAAM,MAAA,EAAE,OAAS,EAAA,WAAA,EAAgB,GAAA,cAAA,CAAA;AAMjC,MAAA,IAAI,iBAAiB,WAAa,EAAA;AAChC,QAAA,iBAAA;AAAA,UACE,aAAA;AAAA,UACA,eAAA,KAAoB,QAAQ,KAAQ,GAAA,OAAA;AAAA,UACpC,WAAY,CAAA,IAAA;AAAA,SACd,CAAA;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,YAAc,EAAA,SAAA,EAAW,iBAAiB,CAAA;AAAA,GAC7C,CAAA;AAEA,EAAA,MAAM,gBAAmB,GAAAD,iBAAA;AAAA,IACvB,CAAC,eAAmC,KAAA;AAClC,MAAM,MAAA,EAAE,OAAS,EAAA,SAAA,EAAc,GAAA,YAAA,CAAA;AAC/B,MAAM,MAAA,EAAE,OAAS,EAAA,WAAA,EAAgB,GAAA,cAAA,CAAA;AACjC,MAAM,MAAA,EAAE,OAAS,EAAA,YAAA,EAAiB,GAAA,eAAA,CAAA;AAClC,MAAA,IAAI,aAAa,WAAa,EAAA;AAC5B,QAAM,MAAA,WAAA,GAAe,oBAAoB,OAAU,GAAAE,kCAAA;AAAA,UACjD,SAAA;AAAA,UACA,WAAA;AAAA,UACA,aAAA;AAAA,UACA,QAAS,CAAA,OAAA;AAAA,SACX,CAAA;AAEA,QAAM,MAAA,oBAAA,GACJ,oBAAoB,KAAQ,GAAA,WAAA,CAAY,GAAG,CAAE,CAAA,CAAA,GAAI,WAAY,CAAA,EAAA,CAAG,CAAC,CAAA,CAAA;AAEnE,QAAA,IAAI,oBAAsB,EAAA;AACxB,UAAA,MAAM,EAAE,GAAA,EAAK,GAAK,EAAA,IAAA,EAAM,OAAU,GAAA,oBAAA,CAAA;AAClC,UAAA,IAAI,oBAAoB,KAAO,EAAA;AAC7B,YAAA,MAAM,iBAAoB,GAAA;AAAA,cACxB,GAAG,WAAA;AAAA,cACH,KAAO,EAAA,IAAA,CAAK,KAAM,CAAA,KAAA,GAAQ,IAAI,CAAA;AAAA,cAC9B,GAAK,EAAA,IAAA,CAAK,KAAM,CAAA,GAAA,GAAM,IAAI,CAAA;AAAA,cAC1B,GAAK,EAAA,IAAA,CAAK,KAAM,CAAA,GAAA,GAAM,IAAI,CAAA;AAAA,aAC5B,CAAA;AACA,YAAA,WAAA,CAAY,KAAK,iBAAiB,CAAA,CAAA;AAClC,YAAa,YAAA,CAAA,iBAAA,GAAoB,qBAAqB,KAAQ,GAAA,CAAA,CAAA;AAAA,WACzD,MAAA;AACL,YAAA,MAAM,iBAAoB,GAAA;AAAA,cACxB,GAAG,WAAA;AAAA,cACH,KAAO,EAAA,IAAA,CAAK,KAAM,CAAA,KAAA,GAAQ,IAAI,CAAA;AAAA,cAC9B,GAAK,EAAA,IAAA,CAAK,KAAM,CAAA,GAAA,GAAM,IAAI,CAAA;AAAA,cAC1B,GAAK,EAAA,IAAA,CAAK,KAAM,CAAA,GAAA,GAAM,IAAI,CAAA;AAAA,aAC5B,CAAA;AACA,YAAA,WAAA,CAAY,QAAQ,iBAAiB,CAAA,CAAA;AACrC,YAAA,YAAA,CAAa,iBAAoB,GAAA,CAAA,CAAA;AAAA,WACnC;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,YAAc,EAAA,aAAA,EAAe,WAAW,CAAA;AAAA,GAC3C,CAAA;AAEA,EAAA,MAAM,SAAY,GAAAF,iBAAA;AAAA,IAChB,CAAC,WAA6B,KAAA;AAC5B,MAAA;AAAA;AAAA,QAEE,YAAY,YACZ,IAAA,KAAA,CAAM,QAAQ,QAAQ,CAAA,IACtB,SAAS,MAAS,GAAA,CAAA;AAAA,QAClB;AACA,QAAA,OAAA,CAAQ,IAAI,oDAAoD,CAAA,CAAA;AAAA,OAClE;AACA,MAAM,MAAA,EAAE,OAAS,EAAA,SAAA,EAAc,GAAA,YAAA,CAAA;AAC/B,MAAM,MAAA,EAAE,OAAS,EAAA,YAAA,EAAiB,GAAA,eAAA,CAAA;AAElC,MAAA,IAAI,aAAa,WAAa,EAAA;AAC5B,QAAM,MAAA,YAAA,GAAe,SAAU,CAAA,QAAA,CAAS,WAAW,CAAA,CAAA;AACnD,QAAA,MAAM,EAAE,WAAA,EAAa,WAAY,EAAA,GAAIG,2BAAW,WAAW,CAAA,CAAA;AAC3D,QAAM,MAAA,EAAE,EAAI,EAAA,aAAA,EAAkB,GAAA,WAAA,CAAA;AAC9B,QAAM,MAAA,EAAE,CAAC,WAAW,GAAG,YAAY,CAAC,WAAW,GAAG,UAAA,EAChD,GAAA,SAAA,CAAA;AACF,QAAA,YAAA,CAAa,UAAU,UAAa,GAAA,UAAA,CAAA;AACpC,QAAM,MAAA,WAAA,GAAe,oBAAoB,OAAU,GAAAD,kCAAA;AAAA,UACjD,SAAA;AAAA,UACA,WAAA;AAAA,UACA,aAAA;AAAA,UACA,aAAA;AAAA,UACA,aAAA;AAAA,SACF,CAAA;AAEA,QAAA,IAAI,YAAc,EAAA;AAChB,UAAM,MAAA,kBAAA,GAAqBE,sCAAsB,WAAW,CAAA,CAAA;AAC5D,UAAM,MAAA,WAAA,GAAc,YAAY,kBAAkB,CAAA,CAAA;AAClD,UAAA,IAAI,eAAe,SAAW,EAAA;AAC5B,YAAA,cAAA,CAAe,OAAU,GAAA,WAAA,CAAA;AACzB,YAAM,MAAA,gBAAA,GAAmB,WAAY,CAAA,MAAA,GACjC,gBACA,GAAA,YAAA,CAAA;AAIJ,YAAA,YAAA,CAAa,iBAAoB,GAAA,gBAAA;AAAA,cAC/B,WAAA;AAAA,cACA,WAAA;AAAA,cACA,WAAY,CAAA,IAAA;AAAA,cACZ,KAAA;AAAA,cACA,QAAA;AAAA,aACF,CAAA;AAAA,WACF;AAAA,SACK,MAAA;AAEL,UAAA,MAAM,EAAE,GAAK,EAAA,OAAA,EAAS,QAAQ,IAAK,EAAA,GAAI,YAAY,qBAAsB,EAAA,CAAA;AAEzE,UAAA,MAAM,UAAa,GAAAC,iCAAA,CAAmB,WAAa,EAAA,OAAA,EAAS,MAAM,KAAK,CAAA,CAAA;AACvE,UAAM,MAAA,KAAA,GAAQ,WAAY,CAAA,OAAA,CAAQ,UAAU,CAAA,CAAA;AAC5C,UAAA,MAAM,EAAE,KAAA,EAAO,GAAK,EAAA,GAAA,EAAQ,GAAA,UAAA,CAAA;AAK5B,UAAM,MAAA,WAAA,GAAe,eAAe,OAAU,GAAA;AAAA,YAC5C,GAAA;AAAA,YACA,GAAA;AAAA,YACA,KAAA;AAAA,YACA,aAAe,EAAA,IAAA;AAAA,YACf,UAAY,EAAA,IAAA;AAAA,YACZ,IAAA;AAAA,WACF,CAAA;AAEA,UAAM,MAAA,iBAAA,GAAoB,WAAY,CAAA,OAAA,CAAQ,UAAU,CAAA,CAAA;AAGxD,UAAY,WAAA,CAAA,MAAA,CAAO,iBAAmB,EAAA,CAAA,EAAG,WAAW,CAAA,CAAA;AACpD,UAAA,KAAA,IAAS,IAAI,KAAQ,GAAA,CAAA,EAAG,CAAI,GAAA,WAAA,CAAY,QAAQ,CAAK,EAAA,EAAA;AACnD,YAAM,MAAA,MAAA,GAAS,YAAY,CAAC,CAAA,CAAA;AAC5B,YAAA,MAAA,CAAO,GAAO,IAAA,IAAA,CAAA;AACd,YAAA,MAAA,CAAO,GAAO,IAAA,IAAA,CAAA;AACd,YAAA,MAAA,CAAO,KAAS,IAAA,IAAA,CAAA;AAAA,WAClB;AAEA,UAAM,MAAA,gBAAA,GAAmB,UAAW,CAAA,MAAA,GAChC,gBACA,GAAA,YAAA,CAAA;AAEJ,UAAA,gBAAA;AAAA,YACE,WAAA;AAAA,YACA,UAAA;AAAA,YACA,UAAW,CAAA,IAAA;AAAA,YACX,IAAA;AAAA,YACA,QAAA;AAAA,WACF,CAAA;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAAA,IACA;AAAA,MACE,YAAA;AAAA,MACA,YAAA;AAAA,MACA,gBAAA;AAAA,MACA,aAAA;AAAA,MACA,WAAA;AAAA,MACA,QAAA;AAAA,MACA,aAAA;AAAA,KACF;AAAA,GACF,CAAA;AAEA,EAAA,MAAM,CAAC,SAAA,EAAW,SAAS,CAAA,GAAIC,cAAQ,MAAM;AAC3C,IAAA,IAAI,YAAe,GAAA,KAAA,CAAA;AACnB,IAAM,MAAA,IAAA,GAAO,CAAC,UAAmC,KAAA;AAC/C,MAAA,IAAI,CAAC,YAAc,EAAA;AACjB,QAAe,YAAA,GAAA,IAAA,CAAA;AACf,QAAM,MAAA,MAAA,GAAS,WAAW,OAAQ,CAAA,aAAA;AAAA,UAChC,eAAA;AAAA,SACF,CAAA;AACA,QAAA,IAAI,MAAQ,EAAA;AACV,UAAAC,2BAAA,CAAmB,QAAQ,OAAO,CAAA,CAAA;AAAA,SACpC;AAAA,OACF;AAAA,KACF,CAAA;AAEA,IAAM,MAAA,IAAA,GAAO,CAAC,UAAmC,KAAA;AAC/C,MAAA,IAAI,YAAc,EAAA;AAChB,QAAe,YAAA,GAAA,KAAA,CAAA;AACf,QAAM,MAAA,MAAA,GAAS,WAAW,OAAQ,CAAA,aAAA;AAAA,UAChC,eAAA;AAAA,SACF,CAAA;AACA,QAAA,IAAI,MAAQ,EAAA;AACV,UAAAA,2BAAA,CAAmB,QAAQ,OAAO,CAAA,CAAA;AAAA,SACpC;AAAA,OACF;AAAA,KACF,CAAA;AAEA,IAAO,OAAA,CAAC,MAAM,IAAI,CAAA,CAAA;AAAA,GACpB,EAAG,EAAE,CAAA,CAAA;AAEL,EAAA,MAAM,IAAO,GAAAP,iBAAA;AAAA,IACX,CAAC,SAAiB,kBAAsC,KAAA;AACtD,MAAM,MAAA,EAAE,OAAS,EAAA,WAAA,EAAgB,GAAA,cAAA,CAAA;AACjC,MAAM,MAAA,EAAE,OAAS,EAAA,YAAA,EAAiB,GAAA,eAAA,CAAA;AAElC,MAAA,IAAI,WAAa,EAAA;AACf,QAAA,IAAI,aAAa,OAAS,EAAA;AACxB,UAAA,UAAA,CAAW,OAAU,GAAA,OAAA,CAAA;AAErB,UAAM,MAAA,EAAE,OAAS,EAAA,WAAA,EAAgB,GAAA,mBAAA,CAAA;AACjC,UAAA,MAAM,cAAiB,GAAAK,iCAAA;AAAA,YACrB,WAAA;AAAA,YACA,OAAA;AAAA,YACA,WAAY,CAAA,IAAA;AAAA,YACZ,kBAAA;AAAA,WACF,CAAA;AAEA,UAAI,IAAA,cAAA,IAAkB,CAAC,cAAA,CAAe,aAAe,EAAA;AACnD,YAAA,IAAI,eAAe,mBAAqB,EAAA;AAEtC,cAAiB,eAAA,CAAA,sBAAA,CAAuB,UAAU,IAAK,CAAA,CAAA;AACvD,cAAA,SAAA,CAAU,cAAc,CAAA,CAAA;AAAA,aACnB,MAAA;AACL,cAAM,MAAA,EAAE,MAAS,GAAA,WAAA,CAAA;AACjB,cAAM,MAAA,WAAA,GAAc,QAAQ,cAAc,CAAA,CAAA;AAE1C,cAAA,MAAM,YACJ,GAAA,WAAA,KAAgB,WAAY,CAAA,MAAA,GAAS,IACjC,gBACA,GAAA,YAAA,CAAA;AAEN,cAAA,YAAA,CAAa,iBAAoB,GAAA,YAAA;AAAA,gBAC/B,WAAA;AAAA,gBACA,cAAA;AAAA,gBACA,IAAA;AAAA,gBACA,IAAA;AAAA,gBACA,kBAAA;AAAA,eACF,CAAA;AAEA,cAAA,MAAM,oBAAoB,WAAY,CAAA,EAAA;AAAA,gBACpC,CAAA,CAAA;AAAA,eACF,CAAA;AACA,cAAA,SAAA,CAAU,iBAAiB,CAAA,CAAA;AAC3B,cAAiB,eAAA,CAAA,sBAAA,CAAuB,UAAU,KAAM,CAAA,CAAA;AAAA,aAC1D;AAAA,WACF;AACA,UAAA,YAAA,CAAa,SAAY,GAAA,kBAAA,CAAA;AAAA,SAC3B;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,YAAA,EAAc,YAAc,EAAA,gBAAA,EAAkB,WAAW,SAAS,CAAA;AAAA,GACrE,CAAA;AAEA,EAAM,MAAA,IAAA,GAAOL,kBAAY,MAAmB;AAC1C,IAAa,YAAA,EAAA,CAAA;AACb,IAAM,MAAA,EAAE,OAAS,EAAA,WAAA,EAAgB,GAAA,mBAAA,CAAA;AACjC,IAAM,MAAA,EAAE,OAAS,EAAA,YAAA,EAAiB,GAAA,eAAA,CAAA;AAClC,IAAM,MAAA,kBAAA,GAAqBI,sCAAsB,WAAW,CAAA,CAAA;AAC5D,IAAM,MAAA,WAAA,GAAc,YAAY,kBAAkB,CAAA,CAAA;AAClD,IAAM,MAAA,EAAE,mBAAsB,GAAA,YAAA,CAAA;AAC9B,IAAA,MAAM,EAAE,KAAA,EAAO,SAAW,EAAA,UAAA,EAAe,GAAA,WAAA,CAAA;AAEzC,IAAA,IAAI,uBAAuB,OAAS,EAAA;AAClC,MAAA,eAAA,CAAgB,KAAK,CAAA,CAAA;AAAA,KACvB;AAEA,IAAA,YAAA,CAAa,SAAY,GAAA,KAAA,CAAA,CAAA;AACzB,IAAA,YAAA,CAAa,iBAAoB,GAAA,CAAA,CAAA,CAAA;AAEjC,IAAM,MAAA,UAAA,GAAa,kBAAuB,KAAA,WAAA,CAAY,MAAS,GAAA,CAAA,CAAA;AAC/D,IAAM,MAAA,OAAA,GAAU,uBAAuB,OACnC,GAAA,CAAA,CAAA,GACA,YAAY,iBAAqB,IAAA,CAAC,UAClC,GAAA,iBAAA,GAAoB,CACpB,GAAA,iBAAA,CAAA;AAEJ,IAAO,OAAA,EAAE,SAAW,EAAA,OAAA,EAAS,UAAW,EAAA,CAAA;AAAA,GAC1C,EAAG,CAAC,YAAY,CAAC,CAAA,CAAA;AAEjB,EAAM,MAAA,WAAA,GAAcJ,kBAAY,MAAM;AACpC,IAAA,YAAA,CAAa,IAAI,CAAA,CAAA;AAAA,GACnB,EAAG,CAAC,YAAY,CAAC,CAAA,CAAA;AAEjB,EAAO,OAAA;AAAA,IACL,SAAA;AAAA,IACA,IAAA;AAAA,IACA,IAAA;AAAA,IACA,iBAAA;AAAA,IACA,gBAAA;AAAA,IACA,WAAA;AAAA,IACA,qBAAuB,EAAA,YAAA;AAAA,GACzB,CAAA;AACF;;;;"}

package/cjs/dropdown-base/useClickAway.js

@@ -32,7 +32,6 @@ const useClickAway = ({
   React.useEffect(() => {
     const [clickHandler, escapeKeyHandler] = isOpen ? [
       (evt) => {
-        console.log("click away");
         const targetElement = evt.target;
         if (!popperRef.current?.contains(targetElement) && !rootRef.current?.contains(targetElement)) {
           if (!targetWithinSubPopup(popperRef.current, targetElement)) {

package/cjs/dropdown-base/useClickAway.js.map

@@ -1 +1 @@
-{"version":3,"file":"useClickAway.js","sources":["../../src/dropdown-base/useClickAway.ts"],"sourcesContent":["import { queryClosest } from \"@vuu-ui/vuu-utils\";\nimport { RefObject, useEffect, useRef } from \"react\";\nimport { CloseReason } from \"./dropdownTypes\";\n\nexport type ClickawayHook = (props: {\n  popperRef: RefObject<HTMLElement>;\n  rootRef: RefObject<HTMLElement>;\n  isOpen: boolean;\n  onClose: (reason: CloseReason) => void;\n}) => void;\n\ntype MouseEventHandler = (e: MouseEvent) => void;\ntype KeyboardEventHandler = (e: KeyboardEvent) => void;\n\nconst NO_HANDLERS: [MouseEventHandler?, KeyboardEventHandler?] = [];\n\nexport const targetWithinSubPopup = (\n  source: HTMLElement | null,\n  target: HTMLElement\n) => {\n  if (source === null) {\n    return false;\n  }\n\n  const sourcePortal = queryClosest(source, \".vuuPortal\");\n  const targetPortal = queryClosest(target, \".vuuPortal\");\n\n  if (sourcePortal && targetPortal) {\n    // If we have two portals, this can only be a popup launched from a popup.\n    // There will be a relationship, described by aria attributes.\n    const targetWithId = targetPortal.querySelector(\"[id]\");\n    const targetOwner = sourcePortal.querySelector(\n      `[aria-owns=\"${targetWithId?.id}\"]`\n    );\n    return targetOwner !== null;\n  }\n\n  return false;\n};\n\nexport const useClickAway: ClickawayHook = ({\n  popperRef,\n  rootRef,\n  isOpen,\n  onClose,\n}) => {\n  //TODO usePropBackedRef\n  const openRef = useRef(isOpen);\n  useEffect(() => {\n    openRef.current = isOpen;\n  }, [isOpen]);\n\n  useEffect(() => {\n    const [clickHandler, escapeKeyHandler] = isOpen\n      ? [\n          (evt: MouseEvent) => {\n            console.log(\"click away\");\n            const targetElement = evt.target as HTMLElement;\n            if (\n              !popperRef.current?.contains(targetElement) &&\n              !rootRef.current?.contains(targetElement)\n            ) {\n              if (!targetWithinSubPopup(popperRef.current, targetElement)) {\n                onClose(\"click-away\");\n              }\n            }\n          },\n          (e: KeyboardEvent) => {\n            if (e.key === \"Escape\") {\n              if (openRef.current) {\n                onClose(\"Escape\");\n                e.stopPropagation();\n              }\n            }\n          },\n        ]\n      : NO_HANDLERS;\n\n    if (clickHandler && escapeKeyHandler) {\n      document.body.addEventListener(\"mousedown\", clickHandler, true);\n      document.body.addEventListener(\"keydown\", escapeKeyHandler, true);\n    }\n\n    return () => {\n      if (clickHandler && escapeKeyHandler) {\n        document.body.removeEventListener(\"mousedown\", clickHandler, true);\n        document.body.removeEventListener(\"keydown\", escapeKeyHandler, true);\n      }\n    };\n  }, [isOpen, onClose, popperRef, rootRef]);\n};\n"],"names":["queryClosest","useRef","useEffect"],"mappings":";;;;;AAcA,MAAM,cAA2D,EAAC,CAAA;AAErD,MAAA,oBAAA,GAAuB,CAClC,MAAA,EACA,MACG,KAAA;AACH,EAAA,IAAI,WAAW,IAAM,EAAA;AACnB,IAAO,OAAA,KAAA,CAAA;AAAA,GACT;AAEA,EAAM,MAAA,YAAA,GAAeA,qBAAa,CAAA,MAAA,EAAQ,YAAY,CAAA,CAAA;AACtD,EAAM,MAAA,YAAA,GAAeA,qBAAa,CAAA,MAAA,EAAQ,YAAY,CAAA,CAAA;AAEtD,EAAA,IAAI,gBAAgB,YAAc,EAAA;AAGhC,IAAM,MAAA,YAAA,GAAe,YAAa,CAAA,aAAA,CAAc,MAAM,CAAA,CAAA;AACtD,IAAA,MAAM,cAAc,YAAa,CAAA,aAAA;AAAA,MAC/B,CAAA,YAAA,EAAe,cAAc,EAAE,CAAA,EAAA,CAAA;AAAA,KACjC,CAAA;AACA,IAAA,OAAO,WAAgB,KAAA,IAAA,CAAA;AAAA,GACzB;AAEA,EAAO,OAAA,KAAA,CAAA;AACT,EAAA;AAEO,MAAM,eAA8B,CAAC;AAAA,EAC1C,SAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AACF,CAAM,KAAA;AAEJ,EAAM,MAAA,OAAA,GAAUC,aAAO,MAAM,CAAA,CAAA;AAC7B,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,OAAA,CAAQ,OAAU,GAAA,MAAA,CAAA;AAAA,GACpB,EAAG,CAAC,MAAM,CAAC,CAAA,CAAA;AAEX,EAAAA,eAAA,CAAU,MAAM;AACd,IAAA,MAAM,CAAC,YAAA,EAAc,gBAAgB,CAAA,GAAI,MACrC,GAAA;AAAA,MACE,CAAC,GAAoB,KAAA;AACnB,QAAA,OAAA,CAAQ,IAAI,YAAY,CAAA,CAAA;AACxB,QAAA,MAAM,gBAAgB,GAAI,CAAA,MAAA,CAAA;AAC1B,QACE,IAAA,CAAC,SAAU,CAAA,OAAA,EAAS,QAAS,CAAA,aAAa,CAC1C,IAAA,CAAC,OAAQ,CAAA,OAAA,EAAS,QAAS,CAAA,aAAa,CACxC,EAAA;AACA,UAAA,IAAI,CAAC,oBAAA,CAAqB,SAAU,CAAA,OAAA,EAAS,aAAa,CAAG,EAAA;AAC3D,YAAA,OAAA,CAAQ,YAAY,CAAA,CAAA;AAAA,WACtB;AAAA,SACF;AAAA,OACF;AAAA,MACA,CAAC,CAAqB,KAAA;AACpB,QAAI,IAAA,CAAA,CAAE,QAAQ,QAAU,EAAA;AACtB,UAAA,IAAI,QAAQ,OAAS,EAAA;AACnB,YAAA,OAAA,CAAQ,QAAQ,CAAA,CAAA;AAChB,YAAA,CAAA,CAAE,eAAgB,EAAA,CAAA;AAAA,WACpB;AAAA,SACF;AAAA,OACF;AAAA,KAEF,GAAA,WAAA,CAAA;AAEJ,IAAA,IAAI,gBAAgB,gBAAkB,EAAA;AACpC,MAAA,QAAA,CAAS,IAAK,CAAA,gBAAA,CAAiB,WAAa,EAAA,YAAA,EAAc,IAAI,CAAA,CAAA;AAC9D,MAAA,QAAA,CAAS,IAAK,CAAA,gBAAA,CAAiB,SAAW,EAAA,gBAAA,EAAkB,IAAI,CAAA,CAAA;AAAA,KAClE;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,gBAAgB,gBAAkB,EAAA;AACpC,QAAA,QAAA,CAAS,IAAK,CAAA,mBAAA,CAAoB,WAAa,EAAA,YAAA,EAAc,IAAI,CAAA,CAAA;AACjE,QAAA,QAAA,CAAS,IAAK,CAAA,mBAAA,CAAoB,SAAW,EAAA,gBAAA,EAAkB,IAAI,CAAA,CAAA;AAAA,OACrE;AAAA,KACF,CAAA;AAAA,KACC,CAAC,MAAA,EAAQ,OAAS,EAAA,SAAA,EAAW,OAAO,CAAC,CAAA,CAAA;AAC1C;;;;;"}
+{"version":3,"file":"useClickAway.js","sources":["../../src/dropdown-base/useClickAway.ts"],"sourcesContent":["import { queryClosest } from \"@vuu-ui/vuu-utils\";\nimport { RefObject, useEffect, useRef } from \"react\";\nimport { CloseReason } from \"./dropdownTypes\";\n\nexport type ClickawayHook = (props: {\n  popperRef: RefObject<HTMLElement>;\n  rootRef: RefObject<HTMLElement>;\n  isOpen: boolean;\n  onClose: (reason: CloseReason) => void;\n}) => void;\n\ntype MouseEventHandler = (e: MouseEvent) => void;\ntype KeyboardEventHandler = (e: KeyboardEvent) => void;\n\nconst NO_HANDLERS: [MouseEventHandler?, KeyboardEventHandler?] = [];\n\nexport const targetWithinSubPopup = (\n  source: HTMLElement | null,\n  target: HTMLElement\n) => {\n  if (source === null) {\n    return false;\n  }\n\n  const sourcePortal = queryClosest(source, \".vuuPortal\");\n  const targetPortal = queryClosest(target, \".vuuPortal\");\n\n  if (sourcePortal && targetPortal) {\n    // If we have two portals, this can only be a popup launched from a popup.\n    // There will be a relationship, described by aria attributes.\n    const targetWithId = targetPortal.querySelector(\"[id]\");\n    const targetOwner = sourcePortal.querySelector(\n      `[aria-owns=\"${targetWithId?.id}\"]`\n    );\n    return targetOwner !== null;\n  }\n\n  return false;\n};\n\nexport const useClickAway: ClickawayHook = ({\n  popperRef,\n  rootRef,\n  isOpen,\n  onClose,\n}) => {\n  //TODO usePropBackedRef\n  const openRef = useRef(isOpen);\n  useEffect(() => {\n    openRef.current = isOpen;\n  }, [isOpen]);\n\n  useEffect(() => {\n    const [clickHandler, escapeKeyHandler] = isOpen\n      ? [\n          (evt: MouseEvent) => {\n            const targetElement = evt.target as HTMLElement;\n            if (\n              !popperRef.current?.contains(targetElement) &&\n              !rootRef.current?.contains(targetElement)\n            ) {\n              if (!targetWithinSubPopup(popperRef.current, targetElement)) {\n                onClose(\"click-away\");\n              }\n            }\n          },\n          (e: KeyboardEvent) => {\n            if (e.key === \"Escape\") {\n              if (openRef.current) {\n                onClose(\"Escape\");\n                e.stopPropagation();\n              }\n            }\n          },\n        ]\n      : NO_HANDLERS;\n\n    if (clickHandler && escapeKeyHandler) {\n      document.body.addEventListener(\"mousedown\", clickHandler, true);\n      document.body.addEventListener(\"keydown\", escapeKeyHandler, true);\n    }\n\n    return () => {\n      if (clickHandler && escapeKeyHandler) {\n        document.body.removeEventListener(\"mousedown\", clickHandler, true);\n        document.body.removeEventListener(\"keydown\", escapeKeyHandler, true);\n      }\n    };\n  }, [isOpen, onClose, popperRef, rootRef]);\n};\n"],"names":["queryClosest","useRef","useEffect"],"mappings":";;;;;AAcA,MAAM,cAA2D,EAAC,CAAA;AAErD,MAAA,oBAAA,GAAuB,CAClC,MAAA,EACA,MACG,KAAA;AACH,EAAA,IAAI,WAAW,IAAM,EAAA;AACnB,IAAO,OAAA,KAAA,CAAA;AAAA,GACT;AAEA,EAAM,MAAA,YAAA,GAAeA,qBAAa,CAAA,MAAA,EAAQ,YAAY,CAAA,CAAA;AACtD,EAAM,MAAA,YAAA,GAAeA,qBAAa,CAAA,MAAA,EAAQ,YAAY,CAAA,CAAA;AAEtD,EAAA,IAAI,gBAAgB,YAAc,EAAA;AAGhC,IAAM,MAAA,YAAA,GAAe,YAAa,CAAA,aAAA,CAAc,MAAM,CAAA,CAAA;AACtD,IAAA,MAAM,cAAc,YAAa,CAAA,aAAA;AAAA,MAC/B,CAAA,YAAA,EAAe,cAAc,EAAE,CAAA,EAAA,CAAA;AAAA,KACjC,CAAA;AACA,IAAA,OAAO,WAAgB,KAAA,IAAA,CAAA;AAAA,GACzB;AAEA,EAAO,OAAA,KAAA,CAAA;AACT,EAAA;AAEO,MAAM,eAA8B,CAAC;AAAA,EAC1C,SAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AACF,CAAM,KAAA;AAEJ,EAAM,MAAA,OAAA,GAAUC,aAAO,MAAM,CAAA,CAAA;AAC7B,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,OAAA,CAAQ,OAAU,GAAA,MAAA,CAAA;AAAA,GACpB,EAAG,CAAC,MAAM,CAAC,CAAA,CAAA;AAEX,EAAAA,eAAA,CAAU,MAAM;AACd,IAAA,MAAM,CAAC,YAAA,EAAc,gBAAgB,CAAA,GAAI,MACrC,GAAA;AAAA,MACE,CAAC,GAAoB,KAAA;AACnB,QAAA,MAAM,gBAAgB,GAAI,CAAA,MAAA,CAAA;AAC1B,QACE,IAAA,CAAC,SAAU,CAAA,OAAA,EAAS,QAAS,CAAA,aAAa,CAC1C,IAAA,CAAC,OAAQ,CAAA,OAAA,EAAS,QAAS,CAAA,aAAa,CACxC,EAAA;AACA,UAAA,IAAI,CAAC,oBAAA,CAAqB,SAAU,CAAA,OAAA,EAAS,aAAa,CAAG,EAAA;AAC3D,YAAA,OAAA,CAAQ,YAAY,CAAA,CAAA;AAAA,WACtB;AAAA,SACF;AAAA,OACF;AAAA,MACA,CAAC,CAAqB,KAAA;AACpB,QAAI,IAAA,CAAA,CAAE,QAAQ,QAAU,EAAA;AACtB,UAAA,IAAI,QAAQ,OAAS,EAAA;AACnB,YAAA,OAAA,CAAQ,QAAQ,CAAA,CAAA;AAChB,YAAA,CAAA,CAAE,eAAgB,EAAA,CAAA;AAAA,WACpB;AAAA,SACF;AAAA,OACF;AAAA,KAEF,GAAA,WAAA,CAAA;AAEJ,IAAA,IAAI,gBAAgB,gBAAkB,EAAA;AACpC,MAAA,QAAA,CAAS,IAAK,CAAA,gBAAA,CAAiB,WAAa,EAAA,YAAA,EAAc,IAAI,CAAA,CAAA;AAC9D,MAAA,QAAA,CAAS,IAAK,CAAA,gBAAA,CAAiB,SAAW,EAAA,gBAAA,EAAkB,IAAI,CAAA,CAAA;AAAA,KAClE;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,gBAAgB,gBAAkB,EAAA;AACpC,QAAA,QAAA,CAAS,IAAK,CAAA,mBAAA,CAAoB,WAAa,EAAA,YAAA,EAAc,IAAI,CAAA,CAAA;AACjE,QAAA,QAAA,CAAS,IAAK,CAAA,mBAAA,CAAoB,SAAW,EAAA,gBAAA,EAAkB,IAAI,CAAA,CAAA;AAAA,OACrE;AAAA,KACF,CAAA;AAAA,KACC,CAAC,MAAA,EAAQ,OAAS,EAAA,SAAA,EAAW,OAAO,CAAC,CAAA,CAAA;AAC1C;;;;;"}

package/cjs/editable-label/EditableLabel.js

@@ -70,31 +70,37 @@ const EditableLabel = React.forwardRef(function EditableLabel2({
     }),
     [beginEdit]
   );
-  const exitEditMode = ({
-    cancelEdit = false,
-    allowDeactivation = false
-  } = {}) => {
-    setEditing(false);
-    const originalValue = initialValue.current;
-    if (originalValue !== value) {
-      if (cancelEdit) {
-        setValue(originalValue);
+  const exitEditMode = React.useCallback(
+    ({ cancelEdit = false, allowDeactivation = false } = {}) => {
+      setEditing(false);
+      const originalValue = initialValue.current;
+      if (cancelEdit || originalValue === value) {
+        if (originalValue !== value) {
+          setValue(originalValue);
+        }
+        onExitEditMode?.(
+          originalValue,
+          originalValue,
+          allowDeactivation,
+          cancelEdit
+        );
       } else {
         initialValue.current = value;
+        onExitEditMode?.(originalValue, value, allowDeactivation, cancelEdit);
       }
-    }
-    onExitEditMode && onExitEditMode(originalValue, value, allowDeactivation, cancelEdit);
-  };
+    },
+    [onExitEditMode, setEditing, setValue, value]
+  );
   const handleChange = (evt) => {
     const { value: value2 } = evt.target;
     setValue(value2);
     onChange && onChange(value2);
   };
-  const handleBlur = () => {
-    if (editingRef.current) {
+  const handleBlur = React.useCallback(() => {
+    if (editing || editingRef.current) {
       exitEditMode({ allowDeactivation: true });
     }
-  };
+  }, [editing, exitEditMode]);
   const handleKeyDown = (evt) => {
     if (editing && evt.key === "Enter") {
       evt.stopPropagation();

package/cjs/editable-label/EditableLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditableLabel.js","sources":["../../src/editable-label/EditableLabel.tsx"],"sourcesContent":["import cx from \"clsx\";\nimport {\n  ChangeEvent,\n  KeyboardEvent,\n  useCallback,\n  useLayoutEffect,\n  forwardRef,\n  ForwardedRef,\n  ReactElement,\n  useRef,\n  HTMLAttributes,\n  useImperativeHandle,\n} from \"react\";\nimport { Input, useControlled } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport editableLabelCss from \"./EditableLabel.css\";\n\nconst classBase = \"vuuEditableLabel\";\n\nexport type ExitEditModeHandler = (\n  originalLabel: string | undefined,\n  editedLabel: string | undefined,\n  allowDeactivation?: boolean,\n  editCancelled?: boolean\n) => void;\n\nexport interface EditAPI {\n  beginEdit: () => void;\n}\n\nexport const NullEditAPI: EditAPI = {\n  beginEdit: () => undefined,\n};\n\nexport interface EditableLabelProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  className?: string;\n  defaultEditing?: boolean;\n  defaultValue?: string;\n  editLabelApiRef?: ForwardedRef<EditAPI>;\n  editing?: boolean;\n  onEnterEditMode: () => void;\n  onChange?: (value: string) => void;\n  onExitEditMode: ExitEditModeHandler;\n  defaultIsEditing?: boolean;\n  value?: string;\n}\n\nexport const EditableLabel = forwardRef(function EditableLabel(\n  {\n    className: classNameProp,\n    defaultEditing,\n    defaultValue,\n    editLabelApiRef,\n    editing: editingProp,\n    onChange,\n    onEnterEditMode,\n    onExitEditMode,\n    value: valueProp,\n    ...restProps\n  }: EditableLabelProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n): ReactElement<EditableLabelProps> {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-editable-label\",\n    css: editableLabelCss,\n    window: targetWindow,\n  });\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const editingRef = useRef<boolean>(false);\n\n  const [value, setValue] = useControlled({\n    controlled: valueProp,\n    default: defaultValue ?? \"\",\n    name: \"EditableLabel\",\n    state: \"value\",\n  });\n\n  const [editing, _setEditing] = useControlled({\n    controlled: editingProp,\n    default: defaultEditing ?? false,\n    name: \"EditableLabel\",\n    state: \"editing\",\n  });\n\n  const setEditing = useCallback(\n    (value: boolean) => {\n      _setEditing((editingRef.current = value));\n    },\n    [_setEditing]\n  );\n\n  const initialValue = useRef(value);\n\n  useLayoutEffect(() => {\n    if (editing) {\n      if (inputRef.current !== null) {\n        inputRef.current.select();\n        inputRef.current.focus();\n      }\n    }\n  }, [editing, inputRef]);\n\n  const beginEdit = useCallback(() => {\n    setEditing(true);\n    onEnterEditMode?.();\n  }, [onEnterEditMode, setEditing]);\n\n  useImperativeHandle(\n    editLabelApiRef,\n    () => ({\n      beginEdit,\n    }),\n    [beginEdit]\n  );\n\n  const exitEditMode = ({\n    cancelEdit = false,\n    allowDeactivation = false,\n  } = {}) => {\n    setEditing(false);\n    const originalValue = initialValue.current;\n    if (originalValue !== value) {\n      if (cancelEdit) {\n        setValue(originalValue);\n      } else {\n        initialValue.current = value;\n      }\n    }\n    onExitEditMode &&\n      onExitEditMode(originalValue, value, allowDeactivation, cancelEdit);\n  };\n\n  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {\n    const { value } = evt.target;\n    setValue(value);\n    onChange && onChange(value);\n  };\n\n  // We need the ref here as the blur fires before setEditing has taken effect,\n  // so we get a double call to exitEditMode if edit is cancelled.\n  const handleBlur = () => {\n    if (editingRef.current) {\n      exitEditMode({ allowDeactivation: true });\n    }\n  };\n\n  const handleKeyDown = (evt: KeyboardEvent<HTMLInputElement>) => {\n    if (editing && evt.key === \"Enter\") {\n      evt.stopPropagation();\n      // we are likely to lose focus as a consequence of user response\n      // to exitEdit transition, don't want it to trigger another\n      //shouldn't we call setEditing here in case we are in uncontrolled mode ?\n      exitEditMode();\n    } else if (evt.key === \"ArrowRight\" || evt.key === \"ArrowLeft\") {\n      evt.stopPropagation();\n    } else if (evt.key === \"Escape\") {\n      exitEditMode({ cancelEdit: true });\n    }\n  };\n\n  const className = cx(classBase, classNameProp, {\n    [`${classBase}-editing`]: editing,\n  });\n  return (\n    <div\n      {...restProps}\n      className={className}\n      data-text={value}\n      ref={forwardedRef}\n    >\n      {editing ? (\n        <Input\n          inputProps={{ className: `${classBase}-input`, spellCheck: false }}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          inputRef={inputRef}\n          style={{ padding: 0 }}\n          textAlign=\"left\"\n          variant=\"secondary\"\n        />\n      ) : (\n        <span className={`${classBase}-label`}>{value}</span>\n      )}\n    </div>\n  );\n});\n"],"names":["forwardRef","EditableLabel","useWindow","useComponentCssInjection","editableLabelCss","useRef","useControlled","useCallback","value","useLayoutEffect","useImperativeHandle","jsx","Input"],"mappings":"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"}
+{"version":3,"file":"EditableLabel.js","sources":["../../src/editable-label/EditableLabel.tsx"],"sourcesContent":["import cx from \"clsx\";\nimport {\n  ChangeEvent,\n  KeyboardEvent,\n  useCallback,\n  useLayoutEffect,\n  forwardRef,\n  ForwardedRef,\n  ReactElement,\n  useRef,\n  HTMLAttributes,\n  useImperativeHandle,\n} from \"react\";\nimport { Input, useControlled } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport editableLabelCss from \"./EditableLabel.css\";\n\nconst classBase = \"vuuEditableLabel\";\n\nexport type ExitEditModeHandler = (\n  originalLabel: string | undefined,\n  editedLabel: string | undefined,\n  allowDeactivation?: boolean,\n  editCancelled?: boolean\n) => void;\n\nexport interface EditAPI {\n  beginEdit: () => void;\n}\n\nexport const NullEditAPI: EditAPI = {\n  beginEdit: () => undefined,\n};\n\nexport interface EditableLabelProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  className?: string;\n  defaultEditing?: boolean;\n  defaultValue?: string;\n  editLabelApiRef?: ForwardedRef<EditAPI>;\n  editing?: boolean;\n  onEnterEditMode: () => void;\n  onChange?: (value: string) => void;\n  onExitEditMode: ExitEditModeHandler;\n  defaultIsEditing?: boolean;\n  value?: string;\n}\n\nexport const EditableLabel = forwardRef(function EditableLabel(\n  {\n    className: classNameProp,\n    defaultEditing,\n    defaultValue,\n    editLabelApiRef,\n    editing: editingProp,\n    onChange,\n    onEnterEditMode,\n    onExitEditMode,\n    value: valueProp,\n    ...restProps\n  }: EditableLabelProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n): ReactElement<EditableLabelProps> {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-editable-label\",\n    css: editableLabelCss,\n    window: targetWindow,\n  });\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const editingRef = useRef<boolean>(false);\n\n  const [value, setValue] = useControlled({\n    controlled: valueProp,\n    default: defaultValue ?? \"\",\n    name: \"EditableLabel\",\n    state: \"value\",\n  });\n\n  const [editing, _setEditing] = useControlled({\n    controlled: editingProp,\n    default: defaultEditing ?? false,\n    name: \"EditableLabel\",\n    state: \"editing\",\n  });\n\n  const setEditing = useCallback(\n    (value: boolean) => {\n      _setEditing((editingRef.current = value));\n    },\n    [_setEditing]\n  );\n\n  const initialValue = useRef(value);\n\n  useLayoutEffect(() => {\n    if (editing) {\n      if (inputRef.current !== null) {\n        inputRef.current.select();\n        inputRef.current.focus();\n      }\n    }\n  }, [editing, inputRef]);\n\n  const beginEdit = useCallback(() => {\n    setEditing(true);\n    onEnterEditMode?.();\n  }, [onEnterEditMode, setEditing]);\n\n  useImperativeHandle(\n    editLabelApiRef,\n    () => ({\n      beginEdit,\n    }),\n    [beginEdit]\n  );\n\n  const exitEditMode = useCallback(\n    ({ cancelEdit = false, allowDeactivation = false } = {}) => {\n      setEditing(false);\n      const originalValue = initialValue.current;\n      if (cancelEdit || originalValue === value) {\n        if (originalValue !== value) {\n          setValue(originalValue);\n        }\n        onExitEditMode?.(\n          originalValue,\n          originalValue,\n          allowDeactivation,\n          cancelEdit\n        );\n      } else {\n        initialValue.current = value;\n        onExitEditMode?.(originalValue, value, allowDeactivation, cancelEdit);\n      }\n    },\n    [onExitEditMode, setEditing, setValue, value]\n  );\n\n  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {\n    const { value } = evt.target;\n    setValue(value);\n    onChange && onChange(value);\n  };\n\n  // We need the ref here as the blur fires before setEditing has taken effect,\n  // so we get a double call to exitEditMode if edit is cancelled.\n  const handleBlur = useCallback(() => {\n    if (editing || editingRef.current) {\n      exitEditMode({ allowDeactivation: true });\n    }\n  }, [editing, exitEditMode]);\n\n  const handleKeyDown = (evt: KeyboardEvent<HTMLInputElement>) => {\n    if (editing && evt.key === \"Enter\") {\n      evt.stopPropagation();\n      // we are likely to lose focus as a consequence of user response\n      // to exitEdit transition, don't want it to trigger another\n      //shouldn't we call setEditing here in case we are in uncontrolled mode ?\n      exitEditMode();\n    } else if (evt.key === \"ArrowRight\" || evt.key === \"ArrowLeft\") {\n      evt.stopPropagation();\n    } else if (evt.key === \"Escape\") {\n      exitEditMode({ cancelEdit: true });\n    }\n  };\n\n  const className = cx(classBase, classNameProp, {\n    [`${classBase}-editing`]: editing,\n  });\n  return (\n    <div\n      {...restProps}\n      className={className}\n      data-text={value}\n      ref={forwardedRef}\n    >\n      {editing ? (\n        <Input\n          inputProps={{ className: `${classBase}-input`, spellCheck: false }}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          inputRef={inputRef}\n          style={{ padding: 0 }}\n          textAlign=\"left\"\n          variant=\"secondary\"\n        />\n      ) : (\n        <span className={`${classBase}-label`}>{value}</span>\n      )}\n    </div>\n  );\n});\n"],"names":["forwardRef","EditableLabel","useWindow","useComponentCssInjection","editableLabelCss","useRef","useControlled","useCallback","value","useLayoutEffect","useImperativeHandle","jsx","Input"],"mappings":"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"}

package/cjs/tabstrip/Tab.js

@@ -105,6 +105,7 @@ const Tab = React.forwardRef(function Tab2({
     {
       ...props,
       "aria-controls": ariaControls,
+      "aria-label": label,
       "aria-selected": selected,
       className: cx(classBase, className, {
         [`${classBase}-closeable`]: closeable,

package/cjs/tabstrip/Tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.js","sources":["../../src/tabstrip/Tab.tsx"],"sourcesContent":["// TODO close button needs to be a button. Hence tab needs to include 2 buttons\nimport { MenuActionHandler } from \"@vuu-ui/vuu-data-types\";\nimport { useForkRef } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n  FocusEvent,\n  ForwardedRef,\n  forwardRef,\n  KeyboardEvent,\n  MouseEvent,\n  ReactElement,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { EditableLabel, EditableLabelProps } from \"../editable-label\";\nimport { TabMenu } from \"./TabMenu\";\nimport { TabProps } from \"./TabsTypes\";\n\nimport tabCss from \"./Tab.css\";\n\nconst classBase = \"vuuTab\";\n\nconst noop = () => undefined;\n\nexport const Tab = forwardRef(function Tab(\n  {\n    ariaControls,\n    children,\n    className,\n    closeable = false,\n    dragging,\n    editable = false,\n    editing,\n    focusVisible,\n    index = -1,\n    label,\n    location,\n    onClick,\n    onClose,\n    onEnterEditMode = noop,\n    onExitEditMode = noop,\n    onFocus: onFocusProp,\n    onKeyUp,\n    onMenuAction,\n    onMenuClose,\n    orientation,\n    selected,\n    showMenuButton = closeable || editable || Boolean(location),\n    tabIndex,\n    ...props\n  }: TabProps,\n  ref: ForwardedRef<HTMLDivElement>\n): ReactElement<TabProps> {\n  if (showMenuButton && typeof onMenuAction !== \"function\") {\n    throw Error(\"Tab onMenuAction must be provided if showMenuButton is set\");\n  }\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-tabstrip-tab\",\n    css: tabCss,\n    window: targetWindow,\n  });\n\n  const rootRef = useRef<HTMLDivElement>(null);\n  const editableRef = useRef<HTMLDivElement>(null);\n  const setForkRef = useForkRef(ref, rootRef);\n  const handleClick = useCallback(\n    (e: MouseEvent<HTMLElement>) => {\n      if (!editing) {\n        e.preventDefault();\n        onClick?.(e, index);\n      }\n    },\n    [editing, index, onClick]\n  );\n\n  const handleOnExitEditMode: EditableLabelProps[\"onExitEditMode\"] = (\n    originalValue = \"\",\n    editedValue = \"\",\n    allowDeactivation = true\n  ) => onExitEditMode(originalValue, editedValue, allowDeactivation, index);\n\n  const handleKeyUp = (e: KeyboardEvent) => {\n    switch (e.key) {\n      case \"Backspace\":\n      case \"Delete\":\n        if (closeable) {\n          e.stopPropagation();\n          onClose && onClose(index);\n        }\n        break;\n      default:\n        onKeyUp && onKeyUp(e, index);\n    }\n  };\n\n  const getLabel = () => {\n    if (editable) {\n      return (\n        <EditableLabel\n          editing={editing}\n          defaultValue={label}\n          // Create a fresh instance after each edit, so it can be uncontrolled ...\n          key={label}\n          onEnterEditMode={onEnterEditMode}\n          onExitEditMode={handleOnExitEditMode}\n          ref={editableRef}\n        />\n      );\n    } else {\n      return label;\n    }\n  };\n\n  const handleFocus = (evt: FocusEvent<HTMLElement>) => {\n    if (editableRef.current) {\n      const editable = editableRef.current as HTMLElement;\n      const input = editable.querySelector(\n        \".vuuEditableLabel-input\"\n      ) as HTMLInputElement;\n      input?.focus();\n    }\n    onFocusProp?.(evt);\n  };\n\n  return (\n    <div\n      {...props}\n      aria-controls={ariaControls}\n      aria-selected={selected}\n      className={cx(classBase, className, {\n        [`${classBase}-closeable`]: closeable,\n        \"vuuDraggable-dragAway\": dragging,\n        [`${classBase}-editing`]: editing,\n        [`${classBase}-selected`]: selected || undefined,\n        [`${classBase}-vertical`]: orientation === \"vertical\",\n        [`vuuFocusVisible`]: focusVisible,\n      })}\n      onClick={handleClick}\n      onFocus={handleFocus}\n      onKeyUp={handleKeyUp}\n      ref={setForkRef}\n      role=\"tab\"\n      tabIndex={tabIndex}\n    >\n      <div className={`${classBase}-main`}>\n        <span\n          className={`${classBase}-text`}\n          // data-text is important, it determines the width of the tab. A pseudo\n          // element assigns data-text as content. This is styled as selected tab\n          // text. That means width of tab always corresponds to its selected state,\n          // so tabs do not change size when selected (ie when the text is bolded).\n          // Do not include if we have editable content, EditableLabel will determine\n          // the width\n          data-text={editable ? undefined : label}\n        >\n          {children ?? getLabel()}\n        </span>\n      </div>\n      {showMenuButton ? (\n        <TabMenu\n          allowClose={closeable}\n          allowRename={editable}\n          controlledComponentId={ariaControls}\n          controlledComponentTitle={label}\n          location={location}\n          onMenuAction={onMenuAction as MenuActionHandler}\n          onMenuClose={onMenuClose}\n          index={index}\n        />\n      ) : null}\n    </div>\n  );\n});\n"],"names":["forwardRef","Tab","useWindow","useComponentCssInjection","tabCss","useRef","useForkRef","useCallback","jsx","EditableLabel","editable","jsxs","TabMenu"],"mappings":";;;;;;;;;;;;AAsBA,MAAM,SAAY,GAAA,QAAA,CAAA;AAElB,MAAM,OAAO,MAAM,KAAA,CAAA,CAAA;AAEN,MAAA,GAAA,GAAMA,gBAAW,CAAA,SAASC,IACrC,CAAA;AAAA,EACE,YAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAY,GAAA,KAAA;AAAA,EACZ,QAAA;AAAA,EACA,QAAW,GAAA,KAAA;AAAA,EACX,OAAA;AAAA,EACA,YAAA;AAAA,EACA,KAAQ,GAAA,CAAA,CAAA;AAAA,EACR,KAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,eAAkB,GAAA,IAAA;AAAA,EAClB,cAAiB,GAAA,IAAA;AAAA,EACjB,OAAS,EAAA,WAAA;AAAA,EACT,OAAA;AAAA,EACA,YAAA;AAAA,EACA,WAAA;AAAA,EACA,WAAA;AAAA,EACA,QAAA;AAAA,EACA,cAAiB,GAAA,SAAA,IAAa,QAAY,IAAA,OAAA,CAAQ,QAAQ,CAAA;AAAA,EAC1D,QAAA;AAAA,EACA,GAAG,KAAA;AACL,CAAA,EACA,GACwB,EAAA;AACxB,EAAI,IAAA,cAAA,IAAkB,OAAO,YAAA,KAAiB,UAAY,EAAA;AACxD,IAAA,MAAM,MAAM,4DAA4D,CAAA,CAAA;AAAA,GAC1E;AAEA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAC,KAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,OAAA,GAAUC,aAAuB,IAAI,CAAA,CAAA;AAC3C,EAAM,MAAA,WAAA,GAAcA,aAAuB,IAAI,CAAA,CAAA;AAC/C,EAAM,MAAA,UAAA,GAAaC,eAAW,CAAA,GAAA,EAAK,OAAO,CAAA,CAAA;AAC1C,EAAA,MAAM,WAAc,GAAAC,iBAAA;AAAA,IAClB,CAAC,CAA+B,KAAA;AAC9B,MAAA,IAAI,CAAC,OAAS,EAAA;AACZ,QAAA,CAAA,CAAE,cAAe,EAAA,CAAA;AACjB,QAAA,OAAA,GAAU,GAAG,KAAK,CAAA,CAAA;AAAA,OACpB;AAAA,KACF;AAAA,IACA,CAAC,OAAS,EAAA,KAAA,EAAO,OAAO,CAAA;AAAA,GAC1B,CAAA;AAEA,EAAA,MAAM,oBAA6D,GAAA,CACjE,aAAgB,GAAA,EAAA,EAChB,WAAc,GAAA,EAAA,EACd,iBAAoB,GAAA,IAAA,KACjB,cAAe,CAAA,aAAA,EAAe,WAAa,EAAA,iBAAA,EAAmB,KAAK,CAAA,CAAA;AAExE,EAAM,MAAA,WAAA,GAAc,CAAC,CAAqB,KAAA;AACxC,IAAA,QAAQ,EAAE,GAAK;AAAA,MACb,KAAK,WAAA,CAAA;AAAA,MACL,KAAK,QAAA;AACH,QAAA,IAAI,SAAW,EAAA;AACb,UAAA,CAAA,CAAE,eAAgB,EAAA,CAAA;AAClB,UAAA,OAAA,IAAW,QAAQ,KAAK,CAAA,CAAA;AAAA,SAC1B;AACA,QAAA,MAAA;AAAA,MACF;AACE,QAAW,OAAA,IAAA,OAAA,CAAQ,GAAG,KAAK,CAAA,CAAA;AAAA,KAC/B;AAAA,GACF,CAAA;AAEA,EAAA,MAAM,WAAW,MAAM;AACrB,IAAA,IAAI,QAAU,EAAA;AACZ,MACE,uBAAAC,cAAA;AAAA,QAACC,2BAAA;AAAA,QAAA;AAAA,UACC,OAAA;AAAA,UACA,YAAc,EAAA,KAAA;AAAA,UAGd,eAAA;AAAA,UACA,cAAgB,EAAA,oBAAA;AAAA,UAChB,GAAK,EAAA,WAAA;AAAA,SAAA;AAAA,QAHA,KAAA;AAAA,OAIP,CAAA;AAAA,KAEG,MAAA;AACL,MAAO,OAAA,KAAA,CAAA;AAAA,KACT;AAAA,GACF,CAAA;AAEA,EAAM,MAAA,WAAA,GAAc,CAAC,GAAiC,KAAA;AACpD,IAAA,IAAI,YAAY,OAAS,EAAA;AACvB,MAAA,MAAMC,YAAW,WAAY,CAAA,OAAA,CAAA;AAC7B,MAAA,MAAM,QAAQA,SAAS,CAAA,aAAA;AAAA,QACrB,yBAAA;AAAA,OACF,CAAA;AACA,MAAA,KAAA,EAAO,KAAM,EAAA,CAAA;AAAA,KACf;AACA,IAAA,WAAA,GAAc,GAAG,CAAA,CAAA;AAAA,GACnB,CAAA;AAEA,EACE,uBAAAC,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,KAAA;AAAA,MACJ,eAAe,EAAA,YAAA;AAAA,MACf,eAAe,EAAA,QAAA;AAAA,MACf,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,SAAW,EAAA;AAAA,QAClC,CAAC,CAAA,EAAG,SAAS,CAAA,UAAA,CAAY,GAAG,SAAA;AAAA,QAC5B,uBAAyB,EAAA,QAAA;AAAA,QACzB,CAAC,CAAA,EAAG,SAAS,CAAA,QAAA,CAAU,GAAG,OAAA;AAAA,QAC1B,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG,QAAY,IAAA,KAAA,CAAA;AAAA,QACvC,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG,WAAgB,KAAA,UAAA;AAAA,QAC3C,CAAC,iBAAiB,GAAG,YAAA;AAAA,OACtB,CAAA;AAAA,MACD,OAAS,EAAA,WAAA;AAAA,MACT,OAAS,EAAA,WAAA;AAAA,MACT,OAAS,EAAA,WAAA;AAAA,MACT,GAAK,EAAA,UAAA;AAAA,MACL,IAAK,EAAA,KAAA;AAAA,MACL,QAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAAH,cAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,CAC1B,KAAA,CAAA,EAAA,QAAA,kBAAAA,cAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,GAAG,SAAS,CAAA,KAAA,CAAA;AAAA,YAOvB,WAAA,EAAW,WAAW,KAAY,CAAA,GAAA,KAAA;AAAA,YAEjC,sBAAY,QAAS,EAAA;AAAA,WAAA;AAAA,SAE1B,EAAA,CAAA;AAAA,QACC,cACC,mBAAAA,cAAA;AAAA,UAACI,eAAA;AAAA,UAAA;AAAA,YACC,UAAY,EAAA,SAAA;AAAA,YACZ,WAAa,EAAA,QAAA;AAAA,YACb,qBAAuB,EAAA,YAAA;AAAA,YACvB,wBAA0B,EAAA,KAAA;AAAA,YAC1B,QAAA;AAAA,YACA,YAAA;AAAA,YACA,WAAA;AAAA,YACA,KAAA;AAAA,WAAA;AAAA,SAEA,GAAA,IAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GACN,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Tab.js","sources":["../../src/tabstrip/Tab.tsx"],"sourcesContent":["// TODO close button needs to be a button. Hence tab needs to include 2 buttons\nimport { MenuActionHandler } from \"@vuu-ui/vuu-data-types\";\nimport { useForkRef } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n  FocusEvent,\n  ForwardedRef,\n  forwardRef,\n  KeyboardEvent,\n  MouseEvent,\n  ReactElement,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { EditableLabel, EditableLabelProps } from \"../editable-label\";\nimport { TabMenu } from \"./TabMenu\";\nimport { TabProps } from \"./TabsTypes\";\n\nimport tabCss from \"./Tab.css\";\n\nconst classBase = \"vuuTab\";\n\nconst noop = () => undefined;\n\nexport const Tab = forwardRef(function Tab(\n  {\n    ariaControls,\n    children,\n    className,\n    closeable = false,\n    dragging,\n    editable = false,\n    editing,\n    focusVisible,\n    index = -1,\n    label,\n    location,\n    onClick,\n    onClose,\n    onEnterEditMode = noop,\n    onExitEditMode = noop,\n    onFocus: onFocusProp,\n    onKeyUp,\n    onMenuAction,\n    onMenuClose,\n    orientation,\n    selected,\n    showMenuButton = closeable || editable || Boolean(location),\n    tabIndex,\n    ...props\n  }: TabProps,\n  ref: ForwardedRef<HTMLDivElement>\n): ReactElement<TabProps> {\n  if (showMenuButton && typeof onMenuAction !== \"function\") {\n    throw Error(\"Tab onMenuAction must be provided if showMenuButton is set\");\n  }\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-tabstrip-tab\",\n    css: tabCss,\n    window: targetWindow,\n  });\n\n  const rootRef = useRef<HTMLDivElement>(null);\n  const editableRef = useRef<HTMLDivElement>(null);\n  const setForkRef = useForkRef(ref, rootRef);\n  const handleClick = useCallback(\n    (e: MouseEvent<HTMLElement>) => {\n      if (!editing) {\n        e.preventDefault();\n        onClick?.(e, index);\n      }\n    },\n    [editing, index, onClick]\n  );\n\n  const handleOnExitEditMode: EditableLabelProps[\"onExitEditMode\"] = (\n    originalValue = \"\",\n    editedValue = \"\",\n    allowDeactivation = true\n  ) => onExitEditMode(originalValue, editedValue, allowDeactivation, index);\n\n  const handleKeyUp = (e: KeyboardEvent) => {\n    switch (e.key) {\n      case \"Backspace\":\n      case \"Delete\":\n        if (closeable) {\n          e.stopPropagation();\n          onClose && onClose(index);\n        }\n        break;\n      default:\n        onKeyUp && onKeyUp(e, index);\n    }\n  };\n\n  const getLabel = () => {\n    if (editable) {\n      return (\n        <EditableLabel\n          editing={editing}\n          defaultValue={label}\n          // Create a fresh instance after each edit, so it can be uncontrolled ...\n          key={label}\n          onEnterEditMode={onEnterEditMode}\n          onExitEditMode={handleOnExitEditMode}\n          ref={editableRef}\n        />\n      );\n    } else {\n      return label;\n    }\n  };\n\n  const handleFocus = (evt: FocusEvent<HTMLElement>) => {\n    if (editableRef.current) {\n      const editable = editableRef.current as HTMLElement;\n      const input = editable.querySelector(\n        \".vuuEditableLabel-input\"\n      ) as HTMLInputElement;\n      input?.focus();\n    }\n    onFocusProp?.(evt);\n  };\n\n  return (\n    <div\n      {...props}\n      aria-controls={ariaControls}\n      aria-label={label}\n      aria-selected={selected}\n      className={cx(classBase, className, {\n        [`${classBase}-closeable`]: closeable,\n        \"vuuDraggable-dragAway\": dragging,\n        [`${classBase}-editing`]: editing,\n        [`${classBase}-selected`]: selected || undefined,\n        [`${classBase}-vertical`]: orientation === \"vertical\",\n        [`vuuFocusVisible`]: focusVisible,\n      })}\n      onClick={handleClick}\n      onFocus={handleFocus}\n      onKeyUp={handleKeyUp}\n      ref={setForkRef}\n      role=\"tab\"\n      tabIndex={tabIndex}\n    >\n      <div className={`${classBase}-main`}>\n        <span\n          className={`${classBase}-text`}\n          // data-text is important, it determines the width of the tab. A pseudo\n          // element assigns data-text as content. This is styled as selected tab\n          // text. That means width of tab always corresponds to its selected state,\n          // so tabs do not change size when selected (ie when the text is bolded).\n          // Do not include if we have editable content, EditableLabel will determine\n          // the width\n          data-text={editable ? undefined : label}\n        >\n          {children ?? getLabel()}\n        </span>\n      </div>\n      {showMenuButton ? (\n        <TabMenu\n          allowClose={closeable}\n          allowRename={editable}\n          controlledComponentId={ariaControls}\n          controlledComponentTitle={label}\n          location={location}\n          onMenuAction={onMenuAction as MenuActionHandler}\n          onMenuClose={onMenuClose}\n          index={index}\n        />\n      ) : null}\n    </div>\n  );\n});\n"],"names":["forwardRef","Tab","useWindow","useComponentCssInjection","tabCss","useRef","useForkRef","useCallback","jsx","EditableLabel","editable","jsxs","TabMenu"],"mappings":"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"}

package/cjs/tabstrip/Tabstrip.js

@@ -45,10 +45,11 @@ const Tabstrip = ({
   const rootRef = React.useRef(null);
   const {
     activeTabIndex,
-    focusVisible,
     containerStyle,
+    focusVisible,
     draggedItemIndex,
     onClickAddTab,
+    interactedTabState,
     tabProps,
     ...tabstripHook
   } = useTabstrip.useTabstrip({
@@ -89,6 +90,7 @@ const Tabstrip = ({
         "data-overflow-priority": selected ? "1" : void 0,
         dragging: draggedItemIndex === index,
         editable,
+        editing: interactedTabState?.index === index,
         focusVisible: focusVisible === index,
         id: tabId,
         index,
@@ -128,6 +130,7 @@ const Tabstrip = ({
       tabProps,
       tabClassName,
       draggedItemIndex,
+      interactedTabState,
       focusVisible,
       location
     ]

package/cjs/tabstrip/Tabstrip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabstrip.js","sources":["../../src/tabstrip/Tabstrip.tsx"],"sourcesContent":["import { asReactElements, useId } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport React, { useMemo, useRef } from \"react\";\nimport { TabProps, TabstripProps } from \"./TabsTypes\";\nimport { useTabstrip } from \"./useTabstrip\";\nimport { IconButton } from \"../icon-button\";\nimport { OverflowContainer } from \"../overflow-container\";\n\nimport tabstripCss from \"./Tabstrip.css\";\n\nconst classBase = \"vuuTabstrip\";\n\nexport const Tabstrip = ({\n  activeTabIndex: activeTabIndexProp,\n  allowAddTab,\n  allowCloseTab,\n  allowDragDrop = false,\n  allowRenameTab = false,\n  animateSelectionThumb = false,\n  children,\n  className: classNameProp,\n  id: idProp,\n  keyBoardActivation = \"manual\",\n  location,\n  onActiveChange,\n  onAddTab,\n  onCloseTab,\n  onExitEditMode,\n  onMoveTab,\n  orientation = \"horizontal\",\n  showTabMenuButton,\n  style: styleProp,\n  tabClassName,\n  variant = \"secondary\",\n  ...htmlAttributes\n}: TabstripProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-tabstrip\",\n    css: tabstripCss,\n    window: targetWindow,\n  });\n\n  const rootRef = useRef<HTMLDivElement>(null);\n  const {\n    activeTabIndex,\n    focusVisible,\n    containerStyle,\n    draggedItemIndex,\n    onClickAddTab,\n    tabProps,\n    ...tabstripHook\n  } = useTabstrip({\n    activeTabIndex: activeTabIndexProp,\n    allowDragDrop,\n    animateSelectionThumb,\n    containerRef: rootRef,\n    keyBoardActivation,\n    onActiveChange,\n    onAddTab,\n    onCloseTab,\n    onExitEditMode,\n    onMoveTab,\n    orientation,\n  });\n  const id = useId(idProp);\n  const className = cx(classBase, classNameProp);\n  const style =\n    styleProp || containerStyle\n      ? {\n          ...styleProp,\n          ...containerStyle,\n        }\n      : undefined;\n\n  const tabs = useMemo(\n    () =>\n      asReactElements(children)\n        .map((child, index) => {\n          const {\n            id: tabId = `${id}-tab-${index}`,\n            className,\n            closeable = allowCloseTab,\n            editable = allowRenameTab,\n            location: tabLocation,\n            showMenuButton = showTabMenuButton,\n          } = child.props;\n          const selected = index === activeTabIndex;\n          return React.cloneElement(child, {\n            ...tabProps,\n            ...tabstripHook.navigationProps,\n            className: cx(className, tabClassName),\n            closeable,\n            \"data-overflow-priority\": selected ? \"1\" : undefined,\n            dragging: draggedItemIndex === index,\n            editable,\n            focusVisible: focusVisible === index,\n            id: tabId,\n            index,\n            key: index,\n            location: cx(location, tabLocation),\n            selected,\n            showMenuButton,\n            tabIndex: selected ? 0 : -1,\n          } as Partial<TabProps>);\n        })\n        .concat(\n          allowAddTab ? (\n            <IconButton\n              {...tabstripHook.navigationProps}\n              aria-label=\"Create Tab\"\n              className={`${classBase}-addTabButton`}\n              data-embedded\n              icon=\"add\"\n              data-overflow-priority=\"1\"\n              key=\"addButton\"\n              onClick={onClickAddTab}\n              variant=\"secondary\"\n              tabIndex={-1}\n            />\n          ) : (\n            []\n          )\n        ),\n    [\n      children,\n      allowAddTab,\n      tabstripHook.navigationProps,\n      onClickAddTab,\n      id,\n      allowCloseTab,\n      allowRenameTab,\n      showTabMenuButton,\n      activeTabIndex,\n      tabProps,\n      tabClassName,\n      draggedItemIndex,\n      focusVisible,\n      location,\n    ]\n  );\n\n  return (\n    <>\n      <OverflowContainer\n        {...htmlAttributes}\n        {...tabstripHook.containerProps}\n        className={cx(className, `${classBase}-${variant}`)}\n        id={id}\n        orientation={orientation}\n        overflowIcon=\"more-horiz\"\n        ref={rootRef}\n        style={style}\n        role=\"tablist\"\n      >\n        {tabs}\n      </OverflowContainer>\n      {tabstripHook.draggable}\n    </>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","tabstripCss","useRef","useTabstrip","useId","useMemo","asReactElements","className","createElement","IconButton","jsxs","Fragment","jsx","OverflowContainer"],"mappings":"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"}
+{"version":3,"file":"Tabstrip.js","sources":["../../src/tabstrip/Tabstrip.tsx"],"sourcesContent":["import { asReactElements, useId } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport React, { useMemo, useRef } from \"react\";\nimport { TabProps, TabstripProps } from \"./TabsTypes\";\nimport { useTabstrip } from \"./useTabstrip\";\nimport { IconButton } from \"../icon-button\";\nimport { OverflowContainer } from \"../overflow-container\";\n\nimport tabstripCss from \"./Tabstrip.css\";\n\nconst classBase = \"vuuTabstrip\";\n\nexport const Tabstrip = ({\n  activeTabIndex: activeTabIndexProp,\n  allowAddTab,\n  allowCloseTab,\n  allowDragDrop = false,\n  allowRenameTab = false,\n  animateSelectionThumb = false,\n  children,\n  className: classNameProp,\n  id: idProp,\n  keyBoardActivation = \"manual\",\n  location,\n  onActiveChange,\n  onAddTab,\n  onCloseTab,\n  onExitEditMode,\n  onMoveTab,\n  orientation = \"horizontal\",\n  showTabMenuButton,\n  style: styleProp,\n  tabClassName,\n  variant = \"secondary\",\n  ...htmlAttributes\n}: TabstripProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-tabstrip\",\n    css: tabstripCss,\n    window: targetWindow,\n  });\n\n  const rootRef = useRef<HTMLDivElement>(null);\n  const {\n    activeTabIndex,\n    containerStyle,\n    focusVisible,\n    draggedItemIndex,\n    onClickAddTab,\n    interactedTabState,\n    tabProps,\n    ...tabstripHook\n  } = useTabstrip({\n    activeTabIndex: activeTabIndexProp,\n    allowDragDrop,\n    animateSelectionThumb,\n    containerRef: rootRef,\n    keyBoardActivation,\n    onActiveChange,\n    onAddTab,\n    onCloseTab,\n    onExitEditMode,\n    onMoveTab,\n    orientation,\n  });\n  const id = useId(idProp);\n  const className = cx(classBase, classNameProp);\n  const style =\n    styleProp || containerStyle\n      ? {\n          ...styleProp,\n          ...containerStyle,\n        }\n      : undefined;\n\n  const tabs = useMemo(\n    () =>\n      asReactElements(children)\n        .map((child, index) => {\n          const {\n            id: tabId = `${id}-tab-${index}`,\n            className,\n            closeable = allowCloseTab,\n            editable = allowRenameTab,\n            location: tabLocation,\n            showMenuButton = showTabMenuButton,\n          } = child.props;\n          const selected = index === activeTabIndex;\n          return React.cloneElement(child, {\n            ...tabProps,\n            ...tabstripHook.navigationProps,\n            className: cx(className, tabClassName),\n            closeable,\n            \"data-overflow-priority\": selected ? \"1\" : undefined,\n            dragging: draggedItemIndex === index,\n            editable,\n            editing: interactedTabState?.index === index,\n            focusVisible: focusVisible === index,\n            id: tabId,\n            index,\n            key: index,\n            location: cx(location, tabLocation),\n            selected,\n            showMenuButton,\n            tabIndex: selected ? 0 : -1,\n          } as Partial<TabProps>);\n        })\n        .concat(\n          allowAddTab ? (\n            <IconButton\n              {...tabstripHook.navigationProps}\n              aria-label=\"Create Tab\"\n              className={`${classBase}-addTabButton`}\n              data-embedded\n              icon=\"add\"\n              data-overflow-priority=\"1\"\n              key=\"addButton\"\n              onClick={onClickAddTab}\n              variant=\"secondary\"\n              tabIndex={-1}\n            />\n          ) : (\n            []\n          )\n        ),\n    [\n      children,\n      allowAddTab,\n      tabstripHook.navigationProps,\n      onClickAddTab,\n      id,\n      allowCloseTab,\n      allowRenameTab,\n      showTabMenuButton,\n      activeTabIndex,\n      tabProps,\n      tabClassName,\n      draggedItemIndex,\n      interactedTabState,\n      focusVisible,\n      location,\n    ]\n  );\n\n  return (\n    <>\n      <OverflowContainer\n        {...htmlAttributes}\n        {...tabstripHook.containerProps}\n        className={cx(className, `${classBase}-${variant}`)}\n        id={id}\n        orientation={orientation}\n        overflowIcon=\"more-horiz\"\n        ref={rootRef}\n        style={style}\n        role=\"tablist\"\n      >\n        {tabs}\n      </OverflowContainer>\n      {tabstripHook.draggable}\n    </>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","tabstripCss","useRef","useTabstrip","useId","useMemo","asReactElements","className","createElement","IconButton","jsxs","Fragment","jsx","OverflowContainer"],"mappings":"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"}