npm - @salt-ds/lab - Versions diffs - 1.0.0-alpha.48 → 1.0.0-alpha.49 - Mend

@salt-ds/lab 1.0.0-alpha.48 → 1.0.0-alpha.49

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1219) hide show

package/dist-cjs/tabs/Tabstrip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tabstrip.js","sources":["../src/tabs/Tabstrip.tsx"],"sourcesContent":["import {\n Button,\n makePrefixer,\n Tooltip,\n useIdMemo,\n useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { AddIcon, OverflowMenuIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport React, {\n ForwardedRef,\n forwardRef,\n KeyboardEvent,\n MouseEvent,\n RefObject,\n useCallback,\n useImperativeHandle,\n useRef,\n useState,\n} from \"react\";\nimport { SelectionChangeHandler } from \"../common-hooks\";\n\nimport { Dropdown } from \"../dropdown\";\nimport {\n InjectedSourceItem,\n OverflowItem,\n useOverflowLayout,\n} from \"../responsive\";\nimport { useOverflowCollectionItems } from \"../responsive/useOverflowCollectionItems\";\nimport { Tab } from \"./Tab\";\nimport { TabActivationIndicator } from \"./TabActivationIndicator\";\nimport {\n FocusAPI,\n responsiveDataAttributes,\n TabDescriptor,\n TabElement,\n TabProps,\n TabsSource,\n TabstripProps,\n} from \"./TabsTypes\";\nimport { useTabstrip } from \"./useTabstrip\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport themeTabstripCss from \"./ThemeTabstrip.css\";\nimport tabstripCss from \"./Tabstrip.css\";\n\nconst withBaseName = makePrefixer(\"saltTabstrip\");\n\nconst ADD_TAB_LABEL = \"Create Tab\";\n\n// Simple strings for tab labels are accepted as input, convert to TabDescriptors internally\nconst tabDescriptors = (\n tabs: TabsSource \| undefined\n): TabDescriptor[] \| undefined =>\n tabs &&\n tabs.map((tab: string \| TabDescriptor) =>\n typeof tab === \"string\" ? { label: tab } : tab\n );\n\nexport const Tabstrip = forwardRef(function Tabstrip(\n {\n activeTabIndex: activeTabIndexProp,\n allowDragDrop = false,\n centered = false,\n children,\n className: classNameProp,\n defaultSource,\n defaultActiveTabIndex,\n editing,\n variant,\n enableAddTab = false,\n enableCloseTab,\n enableRenameTab,\n id: idProp,\n keyBoardActivation = \"manual\",\n onAddTab,\n onActiveChange,\n onCloseTab,\n onEnterEditMode,\n onExitEditMode,\n onMouseDown,\n onMoveTab,\n orientation = \"horizontal\",\n overflowMenu: overflowMenuProp = true,\n promptForNewTabName = true,\n showActivationIndicator = true,\n source,\n title,\n ...htmlAttributes\n }: TabstripProps,\n forwardedRef: ForwardedRef<FocusAPI>\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tab-strip\",\n css: tabstripCss,\n window: targetWindow,\n });\n useComponentCssInjection({\n testId: \"salt-theme-tab-strip\",\n css: themeTabstripCss,\n window: targetWindow,\n });\n\n const root = useRef<HTMLDivElement>(null);\n // can't use forwardedRef here, can we ?\n // const setForkRef = useForkRef(root, forwardedRef);\n const activeRef = useRef<number \| null>(\n activeTabIndexProp \|\| defaultActiveTabIndex \|\| 0\n );\n\n const overflowItemsRef = useRef<OverflowItem[]>([]);\n const [showOverflowMenu, _setShowOverflowMenu] = useState(false);\n\n const setShowOverflowMenu = useCallback((value: boolean) => {\n _setShowOverflowMenu(value);\n }, []);\n\n const tabstripId = useIdMemo(idProp);\n\n const injectedItems = enableAddTab\n ? [\n {\n source: { label: \"Add Tab\", position: -1, priority: 1 },\n } as InjectedSourceItem,\n ]\n : undefined;\n\n const collectionHook = useOverflowCollectionItems({\n children,\n defaultSource: tabDescriptors(defaultSource),\n id: tabstripId,\n injectedItems,\n label: \"Tabstrip\",\n orientation,\n source: tabDescriptors(source),\n options: {\n closeable: enableCloseTab,\n editable: enableRenameTab,\n getPriority: (item, index) => {\n return index === activeRef.current ? 1 : undefined;\n },\n },\n });\n\n const childCount = useRef(React.Children.count(children));\n\n const getChildren = (): TabElement[] \| undefined => {\n if (React.Children.count(children) === 0) {\n return undefined;\n } else {\n return React.Children.toArray(children) as TabElement[];\n }\n };\n\n const [innerContainerRef, switchOverflowPriorities] = useOverflowLayout({\n collectionHook,\n disableOverflow: overflowMenuProp === false,\n id: tabstripId,\n orientation,\n label: \"Tabstrip\",\n });\n overflowItemsRef.current = collectionHook.data;\n const overflowedItems = collectionHook.data.filter((item) => item.overflowed);\n\n const tabMovedHandler = useCallback(\n (fromIndex: number, toIndex: number) => {\n onMoveTab?.(fromIndex, toIndex);\n setTimeout(() => {\n collectionHook.dispatch({\n type: \"reset\",\n });\n }, 50);\n },\n [collectionHook, onMoveTab]\n );\n\n const handleTabSelectionChange = useCallback(\n (tabIndex: number) => {\n const selectedItem = collectionHook.data[tabIndex];\n const prevSelectedItem = collectionHook.data.find(\n (item) => item.priority === 1 && !item.isOverflowIndicator\n );\n if (selectedItem && prevSelectedItem && overflowMenuProp) {\n switchOverflowPriorities(selectedItem, prevSelectedItem);\n }\n onActiveChange?.(tabIndex);\n setShowOverflowMenu(false);\n },\n [\n collectionHook.data,\n onActiveChange,\n overflowMenuProp,\n setShowOverflowMenu,\n switchOverflowPriorities,\n ]\n );\n\n const {\n activeTabIndex,\n activateTab,\n addTab,\n onMouseDown: tabstripHookMouseDown,\n ...tabstripHook\n } = useTabstrip({\n activeTabIndex: activeTabIndexProp,\n allowDragDrop,\n collectionHook,\n defaultTabs: tabDescriptors(defaultSource),\n defaultActiveTabIndex,\n editing,\n enableAddTab,\n idRoot: tabstripId,\n innerContainerRef,\n keyBoardActivation,\n onActiveChange: handleTabSelectionChange,\n onCloseTab,\n onEnterEditMode,\n onExitEditMode,\n onMoveTab: tabMovedHandler,\n orientation,\n promptForNewTabName,\n tabs: tabDescriptors(source) ?? getChildren(),\n });\n\n activeRef.current = activeTabIndex;\n\n useImperativeHandle(\n forwardedRef,\n () =>\n ({\n focus: () => {\n const { current: tabstrip } = root;\n if (tabstrip) {\n const selectedTab = tabstrip.querySelector(\n '.saltTab[aria-selected=\"true\"]'\n ) as HTMLElement;\n if (selectedTab) {\n selectedTab.focus();\n }\n }\n },\n } as FocusAPI),\n []\n );\n\n const handleAddTabClick = useCallback(() => {\n if (!collectionHook.isControlled) {\n addTab();\n }\n onAddTab?.();\n }, [collectionHook.isControlled, onAddTab, addTab]);\n\n const selectedIndex = useRef(activeTabIndex);\n const focusedTabIndex = tabstripHook.highlightedIdx;\n const handleOverflowSelectionChange: SelectionChangeHandler<OverflowItem> =\n useCallback(\n (e, tab) => {\n if (tab !== null) {\n activateTab(tab.index);\n }\n },\n [activateTab]\n );\n\n const handleKeydownOverflowMenu = useCallback(\n (e: KeyboardEvent<HTMLElement>) => {\n tabstripHook.navigationProps?.onKeyDown?.(e);\n },\n [tabstripHook.navigationProps]\n );\n\n const handleOverflowMenuOpen = useCallback(\n (open: boolean) => {\n setShowOverflowMenu(open);\n },\n [setShowOverflowMenu]\n );\n\n const handleMouseDown = useCallback(\n (evt: MouseEvent<HTMLDivElement>) => {\n onMouseDown?.(evt);\n tabstripHookMouseDown?.(evt);\n },\n [onMouseDown, tabstripHookMouseDown]\n );\n\n // shouldn't we use ref for this ?\n useIsomorphicLayoutEffect(() => {\n // We don't care about changes to overflowedItems here, the overflowObserver\n // always does the right thing. We only care about changes to selected tab\n if (selectedIndex.current !== activeTabIndex && overflowMenuProp) {\n // We might want to do this only if the selected tab is overflowed ?\n // TODO\n // resetOverflow();\n selectedIndex.current = activeTabIndex;\n }\n }, [overflowMenuProp, activeTabIndex]);\n\n useIsomorphicLayoutEffect(() => {\n if (React.Children.count(children) !== childCount.current) {\n childCount.current = React.Children.count(children);\n // TODO\n // resetOverflow();\n }\n }, [children]);\n\n useIsomorphicLayoutEffect(() => {\n if (\n activeTabIndex !== null &&\n focusedTabIndex !== activeTabIndex &&\n focusedTabIndex !== -1\n ) {\n tabstripHook.focusTab(activeTabIndex);\n }\n\n // We only want the effect to run when value changes, not every time focusedTabIndex changes.\n // It doesn't matter if focusedTabIndex is stale in between calls - it will be correct when\n // value changes.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [activeTabIndex]);\n\n const renderContent = () => {\n const content = collectionHook.data\n .filter((item) => !item.isOverflowIndicator && !item.isInjectedItem)\n .map((item: OverflowItem, index: number) => {\n // TODO sort out typoing\n const tab = item.source as unknown as TabDescriptor;\n const element = item.element as TabElement;\n\n const selected = index === activeTabIndex;\n const focusVisible = tabstripHook.focusVisible === index;\n const overflowed =\n overflowedItems.findIndex(\n (item: OverflowItem) => item.index === index\n ) !== -1;\n\n const tabIsBeingEdited = tabstripHook.editing && selected;\n const tabIndex = tabIsBeingEdited\n ? undefined\n : selected && !tabstripHook.focusIsWithinComponent\n ? 0\n : -1;\n\n const baseProps: Partial<TabProps> &\n responsiveDataAttributes & {\n ref?: RefObject<HTMLDivElement>;\n key: string \| number;\n } = {\n \"data-index\": index,\n \"data-priority\": item.priority,\n \"data-overflowed\": overflowed ? true : undefined,\n ...tabstripHook.navigationProps,\n id: item.id,\n key: index,\n onMouseDown: handleMouseDown,\n tabIndex,\n };\n\n const tabProps = {\n ...tabstripHook.tabProps,\n closeable: item.closeable,\n dragging: tabstripHook.draggedItemIndex === index,\n editable: item.editable,\n editing: tabIsBeingEdited,\n focusVisible,\n index,\n onClose: item.closeable ? tabstripHook.closeTab : undefined,\n orientation,\n selected,\n } as Partial<TabProps>;\n\n if (React.isValidElement(element)) {\n if (element.type === Tab) {\n return React.cloneElement(element, { ...baseProps, ...tabProps });\n } else {\n return React.cloneElement(element, baseProps);\n }\n } else {\n //@ts-ignore tab can only be a TabDescriptor here, but TypeScript seems to think it can be a number\n return React.createElement(Tab, {\n ...baseProps,\n ...tabProps,\n label: tab.label,\n });\n }\n });\n\n const overflowCount = overflowedItems.length;\n const draggingActiveTab = tabstripHook.draggedItemIndex === activeTabIndex;\n const showOverflow =\n (tabstripHook.revealOverflowedItems && !draggingActiveTab) \|\|\n showOverflowMenu;\n const showTooltip = tabstripHook.revealOverflowedItems && draggingActiveTab;\n const overflowIndicator = collectionHook.data.find(\n (i) => i.isOverflowIndicator\n );\n const [injectedItem] = collectionHook.data.filter((i) => i.isInjectedItem);\n\n if (overflowIndicator) {\n content.push(\n <Tooltip\n content=\"Active Tab cannot be moved into overflow list\"\n open\n disabled={!showTooltip}\n status=\"warning\"\n key=\"tooltip\"\n hideArrow\n >\n <Dropdown<OverflowItem>\n className={clsx(withBaseName(\"overflowMenu\"), {\n [withBaseName(\"overflowMenu-open\")]: showOverflow,\n })}\n ListProps={{\n className: clsx({\n [withBaseName(\"overflowMenu-dropTarget\")]:\n tabstripHook.revealOverflowedItems,\n }),\n }}\n data-overflow-indicator\n data-priority={0}\n id={overflowIndicator.id}\n isOpen={showOverflow}\n key=\"overflow\"\n onOpenChange={handleOverflowMenuOpen}\n onKeyDown={handleKeydownOverflowMenu}\n onSelectionChange={handleOverflowSelectionChange}\n placement=\"bottom-end\"\n source={overflowedItems}\n selected={null}\n triggerComponent={\n <Button\n aria-label={`Tabs overflow menu ${overflowCount} item${\n overflowCount === 1 ? \"\" : \"s\"\n }`}\n variant=\"secondary\"\n tabIndex={-1}\n >\n <OverflowMenuIcon />\n </Button>\n }\n width=\"auto\"\n />\n </Tooltip>\n );\n }\n\n if (injectedItem) {\n content.push(\n <Button\n {...tabstripHook.navigationProps}\n aria-label={ADD_TAB_LABEL}\n data-priority={injectedItem.priority}\n data-overflowed={injectedItem.overflowed}\n id={injectedItem.id}\n key=\"addButton\"\n onClick={handleAddTabClick}\n variant=\"secondary\"\n tabIndex={-1}\n >\n <AddIcon />\n </Button>\n );\n }\n\n return content;\n };\n\n const selectedTabOverflowed = overflowedItems.some(\n (item: OverflowItem) => item.index === activeTabIndex\n );\n const className = clsx(\n withBaseName(),\n withBaseName(orientation),\n classNameProp,\n {\n [withBaseName(\"centered\")]: centered,\n [withBaseName(\"draggingTab\")]: tabstripHook.isDragging,\n [withBaseName(\"tertiary\")]: variant === \"tertiary\",\n }\n );\n\n const selectedTabId =\n activeTabIndex !== null ? collectionHook.data[activeTabIndex].id : null;\n\n return (\n <div\n {...htmlAttributes}\n {...tabstripHook.containerProps}\n className={className}\n id={tabstripId}\n ref={root}\n role=\"tablist\"\n >\n <div className={withBaseName(\"inner\")} ref={innerContainerRef}>\n {renderContent()}\n </div>\n {showActivationIndicator ? (\n <TabActivationIndicator\n hideThumb={selectedTabOverflowed \|\| tabstripHook.isDragging}\n orientation={orientation}\n tabId={selectedTabId}\n />\n ) : null}\n {tabstripHook.draggable}\n </div>\n );\n});\n\nTabstrip.displayName = \"Tabstrip\";\n"],"names":["makePrefixer","forwardRef","Tabstrip","useWindow","useComponentCssInjection","tabstripCss","themeTabstripCss","useRef","useState","useCallback","useIdMemo","useOverflowCollectionItems","React","useOverflowLayout","useTabstrip","useImperativeHandle","_a","useIsomorphicLayoutEffect","item","Tab","jsx","Tooltip","Dropdown","clsx","Button","OverflowMenuIcon","createElement","AddIcon","jsxs","TabActivationIndicator"],"mappings":"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"}
1	+ {"version":3,"file":"Tabstrip.js","sources":["../src/tabs/Tabstrip.tsx"],"sourcesContent":["import {\n Button,\n Tooltip,\n makePrefixer,\n useIdMemo,\n useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { AddIcon, OverflowMenuIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport React, {\n type ForwardedRef,\n forwardRef,\n type KeyboardEvent,\n type MouseEvent,\n type RefObject,\n useCallback,\n useImperativeHandle,\n useRef,\n useState,\n} from \"react\";\nimport type { SelectionChangeHandler } from \"../common-hooks\";\n\nimport { Dropdown } from \"../dropdown\";\nimport {\n type InjectedSourceItem,\n type OverflowItem,\n useOverflowLayout,\n} from \"../responsive\";\nimport { useOverflowCollectionItems } from \"../responsive/useOverflowCollectionItems\";\nimport { Tab } from \"./Tab\";\nimport { TabActivationIndicator } from \"./TabActivationIndicator\";\nimport type {\n FocusAPI,\n TabDescriptor,\n TabElement,\n TabProps,\n TabsSource,\n TabstripProps,\n responsiveDataAttributes,\n} from \"./TabsTypes\";\nimport { useTabstrip } from \"./useTabstrip\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport tabstripCss from \"./Tabstrip.css\";\nimport themeTabstripCss from \"./ThemeTabstrip.css\";\n\nconst withBaseName = makePrefixer(\"saltTabstrip\");\n\nconst ADD_TAB_LABEL = \"Create Tab\";\n\n// Simple strings for tab labels are accepted as input, convert to TabDescriptors internally\nconst tabDescriptors = (\n tabs: TabsSource \| undefined,\n): TabDescriptor[] \| undefined =>\n tabs?.map((tab: string \| TabDescriptor) =>\n typeof tab === \"string\" ? { label: tab } : tab,\n );\n\nexport const Tabstrip = forwardRef(function Tabstrip(\n {\n activeTabIndex: activeTabIndexProp,\n allowDragDrop = false,\n centered = false,\n children,\n className: classNameProp,\n defaultSource,\n defaultActiveTabIndex,\n editing,\n variant,\n enableAddTab = false,\n enableCloseTab,\n enableRenameTab,\n id: idProp,\n keyBoardActivation = \"manual\",\n onAddTab,\n onActiveChange,\n onCloseTab,\n onEnterEditMode,\n onExitEditMode,\n onMouseDown,\n onMoveTab,\n orientation = \"horizontal\",\n overflowMenu: overflowMenuProp = true,\n promptForNewTabName = true,\n showActivationIndicator = true,\n source,\n title,\n ...htmlAttributes\n }: TabstripProps,\n forwardedRef: ForwardedRef<FocusAPI>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tab-strip\",\n css: tabstripCss,\n window: targetWindow,\n });\n useComponentCssInjection({\n testId: \"salt-theme-tab-strip\",\n css: themeTabstripCss,\n window: targetWindow,\n });\n\n const root = useRef<HTMLDivElement>(null);\n // can't use forwardedRef here, can we ?\n // const setForkRef = useForkRef(root, forwardedRef);\n const activeRef = useRef<number \| null>(\n activeTabIndexProp \|\| defaultActiveTabIndex \|\| 0,\n );\n\n const overflowItemsRef = useRef<OverflowItem[]>([]);\n const [showOverflowMenu, _setShowOverflowMenu] = useState(false);\n\n const setShowOverflowMenu = useCallback((value: boolean) => {\n _setShowOverflowMenu(value);\n }, []);\n\n const tabstripId = useIdMemo(idProp);\n\n const injectedItems = enableAddTab\n ? [\n {\n source: { label: \"Add Tab\", position: -1, priority: 1 },\n } as InjectedSourceItem,\n ]\n : undefined;\n\n const collectionHook = useOverflowCollectionItems({\n children,\n defaultSource: tabDescriptors(defaultSource),\n id: tabstripId,\n injectedItems,\n label: \"Tabstrip\",\n orientation,\n source: tabDescriptors(source),\n options: {\n closeable: enableCloseTab,\n editable: enableRenameTab,\n getPriority: (item, index) => {\n return index === activeRef.current ? 1 : undefined;\n },\n },\n });\n\n const childCount = useRef(React.Children.count(children));\n\n const getChildren = (): TabElement[] \| undefined => {\n if (React.Children.count(children) === 0) {\n return undefined;\n }\n return React.Children.toArray(children) as TabElement[];\n };\n\n const [innerContainerRef, switchOverflowPriorities] = useOverflowLayout({\n collectionHook,\n disableOverflow: overflowMenuProp === false,\n id: tabstripId,\n orientation,\n label: \"Tabstrip\",\n });\n overflowItemsRef.current = collectionHook.data;\n const overflowedItems = collectionHook.data.filter((item) => item.overflowed);\n\n const tabMovedHandler = useCallback(\n (fromIndex: number, toIndex: number) => {\n onMoveTab?.(fromIndex, toIndex);\n setTimeout(() => {\n collectionHook.dispatch({\n type: \"reset\",\n });\n }, 50);\n },\n [collectionHook, onMoveTab],\n );\n\n const handleTabSelectionChange = useCallback(\n (tabIndex: number) => {\n const selectedItem = collectionHook.data[tabIndex];\n const prevSelectedItem = collectionHook.data.find(\n (item) => item.priority === 1 && !item.isOverflowIndicator,\n );\n if (selectedItem && prevSelectedItem && overflowMenuProp) {\n switchOverflowPriorities(selectedItem, prevSelectedItem);\n }\n onActiveChange?.(tabIndex);\n setShowOverflowMenu(false);\n },\n [\n collectionHook.data,\n onActiveChange,\n overflowMenuProp,\n setShowOverflowMenu,\n switchOverflowPriorities,\n ],\n );\n\n const {\n activeTabIndex,\n activateTab,\n addTab,\n onMouseDown: tabstripHookMouseDown,\n ...tabstripHook\n } = useTabstrip({\n activeTabIndex: activeTabIndexProp,\n allowDragDrop,\n collectionHook,\n defaultTabs: tabDescriptors(defaultSource),\n defaultActiveTabIndex,\n editing,\n enableAddTab,\n idRoot: tabstripId,\n innerContainerRef,\n keyBoardActivation,\n onActiveChange: handleTabSelectionChange,\n onCloseTab,\n onEnterEditMode,\n onExitEditMode,\n onMoveTab: tabMovedHandler,\n orientation,\n promptForNewTabName,\n tabs: tabDescriptors(source) ?? getChildren(),\n });\n\n activeRef.current = activeTabIndex;\n\n useImperativeHandle(\n forwardedRef,\n () =>\n ({\n focus: () => {\n const { current: tabstrip } = root;\n if (tabstrip) {\n const selectedTab = tabstrip.querySelector(\n '.saltTab[aria-selected=\"true\"]',\n ) as HTMLElement;\n if (selectedTab) {\n selectedTab.focus();\n }\n }\n },\n }) as FocusAPI,\n [],\n );\n\n const handleAddTabClick = useCallback(() => {\n if (!collectionHook.isControlled) {\n addTab();\n }\n onAddTab?.();\n }, [collectionHook.isControlled, onAddTab, addTab]);\n\n const selectedIndex = useRef(activeTabIndex);\n const focusedTabIndex = tabstripHook.highlightedIdx;\n const handleOverflowSelectionChange: SelectionChangeHandler<OverflowItem> =\n useCallback(\n (e, tab) => {\n if (tab !== null) {\n activateTab(tab.index);\n }\n },\n [activateTab],\n );\n\n const handleKeydownOverflowMenu = useCallback(\n (e: KeyboardEvent<HTMLElement>) => {\n tabstripHook.navigationProps?.onKeyDown?.(e);\n },\n [tabstripHook.navigationProps],\n );\n\n const handleOverflowMenuOpen = useCallback(\n (open: boolean) => {\n setShowOverflowMenu(open);\n },\n [setShowOverflowMenu],\n );\n\n const handleMouseDown = useCallback(\n (evt: MouseEvent<HTMLDivElement>) => {\n onMouseDown?.(evt);\n tabstripHookMouseDown?.(evt);\n },\n [onMouseDown, tabstripHookMouseDown],\n );\n\n // shouldn't we use ref for this ?\n useIsomorphicLayoutEffect(() => {\n // We don't care about changes to overflowedItems here, the overflowObserver\n // always does the right thing. We only care about changes to selected tab\n if (selectedIndex.current !== activeTabIndex && overflowMenuProp) {\n // We might want to do this only if the selected tab is overflowed ?\n // TODO\n // resetOverflow();\n selectedIndex.current = activeTabIndex;\n }\n }, [overflowMenuProp, activeTabIndex]);\n\n useIsomorphicLayoutEffect(() => {\n if (React.Children.count(children) !== childCount.current) {\n childCount.current = React.Children.count(children);\n // TODO\n // resetOverflow();\n }\n }, [children]);\n\n /\n biome-ignore lint/correctness/useExhaustiveDependencies: We only want the effect to run when value changes, not every time focusedTabIndex changes.\n * It doesn't matter if focusedTabIndex is stale in between calls - it will be correct when value changes.\n */\n useIsomorphicLayoutEffect(() => {\n if (\n activeTabIndex !== null &&\n focusedTabIndex !== activeTabIndex &&\n focusedTabIndex !== -1\n ) {\n tabstripHook.focusTab(activeTabIndex);\n }\n }, [activeTabIndex]);\n\n const renderContent = () => {\n const content = collectionHook.data\n .filter((item) => !item.isOverflowIndicator && !item.isInjectedItem)\n .map((item: OverflowItem, index: number) => {\n // TODO sort out typoing\n const tab = item.source as unknown as TabDescriptor;\n const element = item.element as TabElement;\n\n const selected = index === activeTabIndex;\n const focusVisible = tabstripHook.focusVisible === index;\n const overflowed =\n overflowedItems.findIndex(\n (item: OverflowItem) => item.index === index,\n ) !== -1;\n\n const tabIsBeingEdited = tabstripHook.editing && selected;\n const tabIndex = tabIsBeingEdited\n ? undefined\n : selected && !tabstripHook.focusIsWithinComponent\n ? 0\n : -1;\n\n const baseProps: Partial<TabProps> &\n responsiveDataAttributes & {\n ref?: RefObject<HTMLDivElement>;\n key: string \| number;\n } = {\n \"data-index\": index,\n \"data-priority\": item.priority,\n \"data-overflowed\": overflowed ? true : undefined,\n ...tabstripHook.navigationProps,\n id: item.id,\n key: index,\n onMouseDown: handleMouseDown,\n tabIndex,\n };\n\n const tabProps = {\n ...tabstripHook.tabProps,\n closeable: item.closeable,\n dragging: tabstripHook.draggedItemIndex === index,\n editable: item.editable,\n editing: tabIsBeingEdited,\n focusVisible,\n index,\n onClose: item.closeable ? tabstripHook.closeTab : undefined,\n orientation,\n selected,\n } as Partial<TabProps>;\n\n if (React.isValidElement(element)) {\n if (element.type === Tab) {\n return React.cloneElement(element, { ...baseProps, ...tabProps });\n }\n return React.cloneElement(element, baseProps);\n }\n //@ts-ignore tab can only be a TabDescriptor here, but TypeScript seems to think it can be a number\n return React.createElement(Tab, {\n ...baseProps,\n ...tabProps,\n label: tab.label,\n });\n });\n\n const overflowCount = overflowedItems.length;\n const draggingActiveTab = tabstripHook.draggedItemIndex === activeTabIndex;\n const showOverflow =\n (tabstripHook.revealOverflowedItems && !draggingActiveTab) \|\|\n showOverflowMenu;\n const showTooltip = tabstripHook.revealOverflowedItems && draggingActiveTab;\n const overflowIndicator = collectionHook.data.find(\n (i) => i.isOverflowIndicator,\n );\n const [injectedItem] = collectionHook.data.filter((i) => i.isInjectedItem);\n\n if (overflowIndicator) {\n content.push(\n <Tooltip\n content=\"Active Tab cannot be moved into overflow list\"\n open\n disabled={!showTooltip}\n status=\"warning\"\n key=\"tooltip\"\n hideArrow\n >\n <Dropdown<OverflowItem>\n className={clsx(withBaseName(\"overflowMenu\"), {\n [withBaseName(\"overflowMenu-open\")]: showOverflow,\n })}\n ListProps={{\n className: clsx({\n [withBaseName(\"overflowMenu-dropTarget\")]:\n tabstripHook.revealOverflowedItems,\n }),\n }}\n data-overflow-indicator\n data-priority={0}\n id={overflowIndicator.id}\n isOpen={showOverflow}\n key=\"overflow\"\n onOpenChange={handleOverflowMenuOpen}\n onKeyDown={handleKeydownOverflowMenu}\n onSelectionChange={handleOverflowSelectionChange}\n placement=\"bottom-end\"\n source={overflowedItems}\n selected={null}\n triggerComponent={\n <Button\n aria-label={`Tabs overflow menu ${overflowCount} item${\n overflowCount === 1 ? \"\" : \"s\"\n }`}\n variant=\"secondary\"\n tabIndex={-1}\n >\n <OverflowMenuIcon />\n </Button>\n }\n width=\"auto\"\n />\n </Tooltip>,\n );\n }\n\n if (injectedItem) {\n content.push(\n <Button\n {...tabstripHook.navigationProps}\n aria-label={ADD_TAB_LABEL}\n data-priority={injectedItem.priority}\n data-overflowed={injectedItem.overflowed}\n id={injectedItem.id}\n key=\"addButton\"\n onClick={handleAddTabClick}\n variant=\"secondary\"\n tabIndex={-1}\n >\n <AddIcon />\n </Button>,\n );\n }\n\n return content;\n };\n\n const selectedTabOverflowed = overflowedItems.some(\n (item: OverflowItem) => item.index === activeTabIndex,\n );\n const className = clsx(\n withBaseName(),\n withBaseName(orientation),\n classNameProp,\n {\n [withBaseName(\"centered\")]: centered,\n [withBaseName(\"draggingTab\")]: tabstripHook.isDragging,\n [withBaseName(\"tertiary\")]: variant === \"tertiary\",\n },\n );\n\n const selectedTabId =\n activeTabIndex !== null ? collectionHook.data[activeTabIndex].id : null;\n\n return (\n <div\n {...htmlAttributes}\n {...tabstripHook.containerProps}\n className={className}\n id={tabstripId}\n ref={root}\n role=\"tablist\"\n >\n <div className={withBaseName(\"inner\")} ref={innerContainerRef}>\n {renderContent()}\n </div>\n {showActivationIndicator ? (\n <TabActivationIndicator\n hideThumb={selectedTabOverflowed \|\| tabstripHook.isDragging}\n orientation={orientation}\n tabId={selectedTabId}\n />\n ) : null}\n {tabstripHook.draggable}\n </div>\n );\n});\n\nTabstrip.displayName = \"Tabstrip\";\n"],"names":["makePrefixer","forwardRef","Tabstrip","useWindow","useComponentCssInjection","tabstripCss","themeTabstripCss","useRef","useState","useCallback","useIdMemo","useOverflowCollectionItems","React","useOverflowLayout","useTabstrip","useImperativeHandle","_a","useIsomorphicLayoutEffect","item","Tab","jsx","Tooltip","Dropdown","clsx","Button","OverflowMenuIcon","createElement","AddIcon","jsxs","TabActivationIndicator"],"mappings":"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"}

package/dist-cjs/tabs/drag-drop/Draggable.js CHANGED Viewed

@@ -7,9 +7,9 @@ var core = require('@salt-ds/core');
 var clsx = require('clsx');
 var React = require('react');
 var Portal = require('../../portal/Portal.js');
-var Draggable$1 = require('./Draggable.css.js');
 var styles = require('@salt-ds/styles');
 var window = require('@salt-ds/window');
+var Draggable$1 = require('./Draggable.css.js');
 const makeClassNames = (classNames) => classNames.split(" ").map((className) => `saltDraggable-${className}`);
 const Draggable = React.forwardRef(function Draggable2({ wrapperClassName, element, rect, scale = 1 }, forwardedRef) {

package/dist-cjs/tabs/drag-drop/Draggable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Draggable.js","sources":["../src/tabs/drag-drop/Draggable.tsx"],"sourcesContent":["import { useForkRef } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { ~~forwardRef,~~ MutableRefObject, useCallback } from \"react\";\nimport { ~~Rect~~ } from \"~~./dragDropTypes~~\";\nimport { ~~Portal~~ } from \"~~../../portal~~\";\n\nimport ~~draggableCss from \"./Draggable.css\";\nimport~~ { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nconst makeClassNames = (classNames: string) =>\n classNames.split(\" \").map((className) => `saltDraggable-${className}`);\nexport const Draggable = forwardRef<\n HTMLDivElement,\n { wrapperClassName: string; element: HTMLElement; rect: Rect; scale?: number }\n>(function Draggable(\n { wrapperClassName, element, rect, scale = 1 },\n forwardedRef\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-draggable\",\n css: draggableCss,\n window: targetWindow,\n });\n\n const callbackRef = useCallback(\n (el: HTMLDivElement) => {\n if (el) {\n el.innerHTML = \"\";\n el.appendChild(element);\n if (scale !== 1) {\n el.style.transform = `scale(${scale},${scale})`;\n }\n }\n },\n [element, scale]\n );\n const forkedRef = useForkRef<HTMLDivElement>(forwardedRef, callbackRef);\n\n const { left, top, width, height } = rect;\n\n return (\n <Portal>\n <div\n className={clsx(\"saltDraggable\", ...makeClassNames(wrapperClassName))}\n ref={forkedRef}\n style={{ left, top, width, height }}\n />\n </Portal>\n );\n});\n\nexport const createDragSpacer = (\n transitioning?: MutableRefObject<boolean>\n): HTMLElement => {\n const spacer = document.createElement(\"div\");\n spacer.className = \"saltDraggable-spacer\";\n if (transitioning) {\n spacer.addEventListener(\"transitionend\", () => {\n transitioning.current = false;\n });\n }\n return spacer;\n};\n"],"names":["forwardRef","Draggable","useWindow","useComponentCssInjection","draggableCss","useCallback","useForkRef","jsx","Portal","clsx"],"mappings":";;;;;;;;;;;;;AAUA,MAAM,cAAA,GAAiB,CAAC,UAAA,KACtB,UAAW,CAAA,KAAA,CAAM,GAAG,CAAA,CAAE,GAAI,CAAA,CAAC,SAAc,KAAA,CAAA,cAAA,EAAiB,SAAW,CAAA,CAAA,CAAA,CAAA;AAC1D,MAAA,SAAA,GAAYA,gBAGvB,CAAA,SAASC,UACT,CAAA,EAAE,gBAAkB,EAAA,OAAA,EAAS,IAAM,EAAA,KAAA,GAAQ,CAAE,EAAA,EAC7C,YACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAAC,WAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,WAAc,GAAAC,iBAAA;AAAA,IAClB,CAAC,EAAuB,KAAA;AACtB,MAAA,IAAI,EAAI,EAAA;AACN,QAAA,EAAA,CAAG,SAAY,GAAA,EAAA,CAAA;AACf,QAAA,EAAA,CAAG,YAAY,OAAO,CAAA,CAAA;AACtB,QAAA,IAAI,UAAU,CAAG,EAAA;AACf,UAAG,EAAA,CAAA,KAAA,CAAM,SAAY,GAAA,CAAA,MAAA,EAAS,KAAS,CAAA,CAAA,EAAA,KAAA,CAAA,CAAA,CAAA,CAAA;AAAA,SACzC;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,SAAS,KAAK,CAAA;AAAA,GACjB,CAAA;AACA,EAAM,MAAA,SAAA,GAAYC,eAA2B,CAAA,YAAA,EAAc,WAAW,CAAA,CAAA;AAEtE,EAAA,MAAM,EAAE,IAAA,EAAM,GAAK,EAAA,KAAA,EAAO,QAAW,GAAA,IAAA,CAAA;AAErC,EAAA,uBACGC,cAAA,CAAAC,aAAA,EAAA;AAAA,IACC,QAAC,kBAAAD,cAAA,CAAA,KAAA,EAAA;AAAA,MACC,WAAWE,SAAK,CAAA,eAAA,EAAiB,GAAG,cAAA,CAAe,gBAAgB,CAAC,CAAA;AAAA,MACpE,GAAK,EAAA,SAAA;AAAA,MACL,KAAO,EAAA,EAAE,IAAM,EAAA,GAAA,EAAK,OAAO,MAAO,EAAA;AAAA,KACpC,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC,EAAA;AAEY,MAAA,gBAAA,GAAmB,CAC9B,aACgB,KAAA;AAChB,EAAM,MAAA,MAAA,GAAS,QAAS,CAAA,aAAA,CAAc,KAAK,CAAA,CAAA;AAC3C,EAAA,MAAA,CAAO,SAAY,GAAA,sBAAA,CAAA;AACnB,EAAA,IAAI,aAAe,EAAA;AACjB,IAAO,MAAA,CAAA,gBAAA,CAAiB,iBAAiB,MAAM;AAC7C,MAAA,aAAA,CAAc,OAAU,GAAA,KAAA,CAAA;AAAA,KACzB,CAAA,CAAA;AAAA,GACH;AACA,EAAO,OAAA,MAAA,CAAA;AACT;;;;;"}
1	+ {"version":3,"file":"Draggable.js","sources":["../src/tabs/drag-drop/Draggable.tsx"],"sourcesContent":["import { useForkRef } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { type MutableRefObject, forwardRef, useCallback } from \"react\";\nimport { Portal } from \"../../portal\";\nimport type { Rect } from \"./dragDropTypes\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport draggableCss from \"./Draggable.css\";\n\nconst makeClassNames = (classNames: string) =>\n classNames.split(\" \").map((className) => `saltDraggable-${className}`);\nexport const Draggable = forwardRef<\n HTMLDivElement,\n { wrapperClassName: string; element: HTMLElement; rect: Rect; scale?: number }\n>(function Draggable(\n { wrapperClassName, element, rect, scale = 1 },\n forwardedRef,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-draggable\",\n css: draggableCss,\n window: targetWindow,\n });\n\n const callbackRef = useCallback(\n (el: HTMLDivElement) => {\n if (el) {\n el.innerHTML = \"\";\n el.appendChild(element);\n if (scale !== 1) {\n el.style.transform = `scale(${scale},${scale})`;\n }\n }\n },\n [element, scale],\n );\n const forkedRef = useForkRef<HTMLDivElement>(forwardedRef, callbackRef);\n\n const { left, top, width, height } = rect;\n\n return (\n <Portal>\n <div\n className={clsx(\"saltDraggable\", ...makeClassNames(wrapperClassName))}\n ref={forkedRef}\n style={{ left, top, width, height }}\n />\n </Portal>\n );\n});\n\nexport const createDragSpacer = (\n transitioning?: MutableRefObject<boolean>,\n): HTMLElement => {\n const spacer = document.createElement(\"div\");\n spacer.className = \"saltDraggable-spacer\";\n if (transitioning) {\n spacer.addEventListener(\"transitionend\", () => {\n transitioning.current = false;\n });\n }\n return spacer;\n};\n"],"names":["forwardRef","Draggable","useWindow","useComponentCssInjection","draggableCss","useCallback","useForkRef","jsx","Portal","clsx"],"mappings":";;;;;;;;;;;;;AAUA,MAAM,cAAA,GAAiB,CAAC,UAAA,KACtB,UAAW,CAAA,KAAA,CAAM,GAAG,CAAA,CAAE,GAAI,CAAA,CAAC,SAAc,KAAA,CAAA,cAAA,EAAiB,SAAW,CAAA,CAAA,CAAA,CAAA;AAC1D,MAAA,SAAA,GAAYA,gBAGvB,CAAA,SAASC,UACT,CAAA,EAAE,gBAAkB,EAAA,OAAA,EAAS,IAAM,EAAA,KAAA,GAAQ,CAAE,EAAA,EAC7C,YACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAAC,WAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,WAAc,GAAAC,iBAAA;AAAA,IAClB,CAAC,EAAuB,KAAA;AACtB,MAAA,IAAI,EAAI,EAAA;AACN,QAAA,EAAA,CAAG,SAAY,GAAA,EAAA,CAAA;AACf,QAAA,EAAA,CAAG,YAAY,OAAO,CAAA,CAAA;AACtB,QAAA,IAAI,UAAU,CAAG,EAAA;AACf,UAAG,EAAA,CAAA,KAAA,CAAM,SAAY,GAAA,CAAA,MAAA,EAAS,KAAS,CAAA,CAAA,EAAA,KAAA,CAAA,CAAA,CAAA,CAAA;AAAA,SACzC;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,SAAS,KAAK,CAAA;AAAA,GACjB,CAAA;AACA,EAAM,MAAA,SAAA,GAAYC,eAA2B,CAAA,YAAA,EAAc,WAAW,CAAA,CAAA;AAEtE,EAAA,MAAM,EAAE,IAAA,EAAM,GAAK,EAAA,KAAA,EAAO,QAAW,GAAA,IAAA,CAAA;AAErC,EAAA,uBACGC,cAAA,CAAAC,aAAA,EAAA;AAAA,IACC,QAAC,kBAAAD,cAAA,CAAA,KAAA,EAAA;AAAA,MACC,WAAWE,SAAK,CAAA,eAAA,EAAiB,GAAG,cAAA,CAAe,gBAAgB,CAAC,CAAA;AAAA,MACpE,GAAK,EAAA,SAAA;AAAA,MACL,KAAO,EAAA,EAAE,IAAM,EAAA,GAAA,EAAK,OAAO,MAAO,EAAA;AAAA,KACpC,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC,EAAA;AAEY,MAAA,gBAAA,GAAmB,CAC9B,aACgB,KAAA;AAChB,EAAM,MAAA,MAAA,GAAS,QAAS,CAAA,aAAA,CAAc,KAAK,CAAA,CAAA;AAC3C,EAAA,MAAA,CAAO,SAAY,GAAA,sBAAA,CAAA;AACnB,EAAA,IAAI,aAAe,EAAA;AACjB,IAAO,MAAA,CAAA,gBAAA,CAAiB,iBAAiB,MAAM;AAC7C,MAAA,aAAA,CAAc,OAAU,GAAA,KAAA,CAAA;AAAA,KACzB,CAAA,CAAA;AAAA,GACH;AACA,EAAO,OAAA,MAAA,CAAA;AACT;;;;;"}

package/dist-cjs/tabs/drag-drop/drag-utils.js CHANGED Viewed

@@ -12,13 +12,13 @@ const measureElementSizeAndPosition = (element, dimension = "width", includeAuto
   const { padEnd = false, padStart = false } = element.dataset;
   const style = getComputedStyle(element);
   const [start, end] = dimension === "width" ? LEFT_RIGHT : TOP_BOTTOM;
-  const marginStart = padStart && !includeAutoMargin ? 0 : parseInt(style.getPropertyValue(`margin-${start}`), 10);
-  const marginEnd = padEnd && !includeAutoMargin ? 0 : parseInt(style.getPropertyValue(`margin-${end}`), 10);
+  const marginStart = padStart && !includeAutoMargin ? 0 : Number.parseInt(style.getPropertyValue(`margin-${start}`), 10);
+  const marginEnd = padEnd && !includeAutoMargin ? 0 : Number.parseInt(style.getPropertyValue(`margin-${end}`), 10);
   let minWidth = size;
-  const flexShrink = parseInt(style.getPropertyValue("flex-shrink"), 10);
+  const flexShrink = Number.parseInt(style.getPropertyValue("flex-shrink"), 10);
   if (flexShrink > 0) {
-    const flexBasis = parseInt(style.getPropertyValue("flex-basis"), 10);
-    if (!isNaN(flexBasis) && flexBasis > 0) {
+    const flexBasis = Number.parseInt(style.getPropertyValue("flex-basis"), 10);
+    if (!Number.isNaN(flexBasis) && flexBasis > 0) {
       minWidth = flexBasis;
     }
   }
@@ -53,9 +53,8 @@ const getDraggedItem = (measuredItems) => {
   const result = measuredItems.find((item) => item.isDraggedElement);
   if (result) {
     return result;
-  } else {
-    throw Error("measuredItems do not contain a draggedElement");
   }
+  throw Error("measuredItems do not contain a draggedElement");
 };
 const moveDragItem = (measuredItems, dropTarget) => {
   const items = measuredItems.slice();
@@ -84,24 +83,24 @@ const measureDropTargets = (container, orientation, draggedItem, itemQuery) => {
   const children = Array.from(
     itemQuery ? container.querySelectorAll(itemQuery) : container.children
   );
+  let previousThreshold = null;
   for (let index = 0; index < children.length; index++) {
     const element = children[index];
     const dimension = orientation === "horizontal" ? "width" : "height";
-    let [start, size] = measureElementSizeAndPosition(element, dimension);
-    dragThresholds.push(
-      {
-        currentIndex: index,
-        dataIndex: parseInt((_a = element.dataset.index) != null ? _a : "-1"),
-        index,
-        isDraggedElement: element === draggedItem,
-        isOverflowIndicator: element.dataset.overflowIndicator === "true",
-        element,
-        start,
-        end: start + size,
-        size,
-        mid: start + size / 2
-      }
-    );
+    const [start, size] = measureElementSizeAndPosition(element, dimension);
+    previousThreshold = {
+      currentIndex: index,
+      dataIndex: Number.parseInt((_a = element.dataset.index) != null ? _a : "-1"),
+      index,
+      isDraggedElement: element === draggedItem,
+      isOverflowIndicator: element.dataset.overflowIndicator === "true",
+      element,
+      start,
+      end: start + size,
+      size,
+      mid: start + size / 2
+    };
+    dragThresholds.push(previousThreshold);
   }
   return dragThresholds;
 };
@@ -113,9 +112,11 @@ const getNextDropTarget = (dropTargets, pos, direction) => {
       const { start, mid, end } = dropTarget;
       if (pos > end) {
         continue;
-      } else if (pos > mid) {
+      }
+      if (pos > mid) {
         return dropTarget.isDraggedElement ? null : dropTarget;
-      } else if (pos > start) {
+      }
+      if (pos > start) {
         dropTarget = dropTargets[index - 1];
         return dropTarget.isDraggedElement ? null : dropTarget;
       }
@@ -126,9 +127,11 @@ const getNextDropTarget = (dropTargets, pos, direction) => {
       const { start, mid, end } = dropTarget;
       if (pos < start) {
         continue;
-      } else if (pos < mid) {
+      }
+      if (pos < mid) {
         return dropTarget.isDraggedElement ? null : dropTarget;
-      } else if (pos < end) {
+      }
+      if (pos < end) {
         dropTarget = dropTargets[Math.min(len - 1, index + 1)];
         return dropTarget.isDraggedElement ? null : dropTarget;
       }

package/dist-cjs/tabs/drag-drop/drag-utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"drag-utils.js","sources":["../src/tabs/drag-drop/drag-utils.ts"],"sourcesContent":["import { orientationType } from \"../../responsive\";\nimport { Direction, FWD } from \"./dragDropTypes\";\n\nconst LEFT_RIGHT = [\"left\", \"right\"];\nconst TOP_BOTTOM = [\"top\", \"bottom\"];\n// duplicated in repsonsive\n\nexport type MeasuredDropTarget = {\n currentIndex: number;\n dataIndex?: number;\n element: HTMLElement;\n index: number;\n isDraggedElement: boolean;\n isOverflowIndicator?: boolean;\n start: number;\n end: number;\n mid: number;\n size: number;\n};\n\nexport type targetType = {\n element: HTMLElement \| null;\n index: number;\n isLast?: boolean;\n};\n\ntype MousePosKey = keyof Pick<MouseEvent, \"clientX\" \| \"clientY\">;\ntype DOMRectKey = keyof Omit<DOMRect, \"toJSON\">;\ntype DOMRectDimensionKey = keyof Pick<DOMRect, \"width\" \| \"height\">;\ntype Dimension = keyof Pick<DOMRect, \"width\" \| \"height\">;\ntype ElementDimension = keyof Pick<\n HTMLElement,\n \| \"scrollHeight\"\n \| \"scrollWidth\"\n \| \"clientHeight\"\n \| \"clientWidth\"\n \| \"scrollTop\"\n \| \"scrollLeft\"\n>;\n\nexport const measureElementSizeAndPosition = (\n element: HTMLElement,\n dimension: Dimension = \"width\",\n includeAutoMargin = false\n) => {\n const pos = dimension === \"width\" ? \"left\" : \"top\";\n const { [dimension]: size, [pos]: position } =\n element.getBoundingClientRect();\n const { padEnd = false, padStart = false } = element.dataset;\n const style = getComputedStyle(element);\n const [start, end] = dimension === \"width\" ? LEFT_RIGHT : TOP_BOTTOM;\n const marginStart =\n padStart && !includeAutoMargin\n ? 0\n : parseInt(style.getPropertyValue(`margin-${start}`), 10);\n const marginEnd =\n padEnd && !includeAutoMargin\n ? 0\n : parseInt(style.getPropertyValue(`margin-${end}`), 10);\n\n let minWidth = size;\n const flexShrink = parseInt(style.getPropertyValue(\"flex-shrink\"), 10);\n if (flexShrink > 0) {\n const flexBasis = parseInt(style.getPropertyValue(\"flex-basis\"), 10);\n if (!isNaN(flexBasis) && flexBasis > 0) {\n minWidth = flexBasis;\n }\n }\n return [position, marginStart + minWidth + marginEnd];\n};\n\nconst DIMENSIONS = {\n horizontal: {\n CLIENT_SIZE: \"clientWidth\" as ElementDimension,\n CONTRA: \"top\" as DOMRectKey,\n CONTRA_POS: \"clientY\" as MousePosKey,\n DIMENSION: \"width\" as DOMRectDimensionKey,\n END: \"right\" as DOMRectKey,\n POS: \"clientX\" as MousePosKey,\n SCROLL_POS: \"scrollTop\" as ElementDimension,\n SCROLL_SIZE: \"scrollWidth\" as ElementDimension,\n START: \"left\" as DOMRectKey,\n },\n vertical: {\n CLIENT_SIZE: \"clientHeight\" as ElementDimension,\n CONTRA: \"left\" as DOMRectKey,\n CONTRA_POS: \"clientX\" as MousePosKey,\n DIMENSION: \"height\" as DOMRectDimensionKey,\n END: \"bottom\" as DOMRectKey,\n POS: \"clientY\" as MousePosKey,\n SCROLL_POS: \"scrollLeft\" as ElementDimension,\n SCROLL_SIZE: \"scrollHeight\" as ElementDimension,\n START: \"top\" as DOMRectKey,\n },\n};\nexport const dimensions = (orientation: orientationType) =>\n DIMENSIONS[orientation];\n\nexport const getDraggedItem = (\n measuredItems: MeasuredDropTarget[]\n): MeasuredDropTarget => {\n const result = measuredItems.find((item) => item.isDraggedElement);\n if (result) {\n return result;\n } else {\n throw Error(\"measuredItems do not contain a draggedElement\");\n }\n};\n\nexport const moveDragItem = (\n measuredItems: MeasuredDropTarget[],\n dropTarget: MeasuredDropTarget\n): MeasuredDropTarget[] => {\n const items: MeasuredDropTarget[] = measuredItems.slice();\n const draggedItem = getDraggedItem(items);\n const draggedIndex = items.indexOf(draggedItem!);\n const targetIndex = items.indexOf(dropTarget);\n\n const firstPos = Math.min(draggedIndex, targetIndex);\n const lastPos = Math.max(draggedIndex, targetIndex);\n let { start } = items[firstPos];\n\n items[draggedIndex] = { ...dropTarget };\n items[targetIndex] = { ...draggedItem };\n\n for (let i = firstPos; i <= lastPos; i++) {\n const item = items[i];\n item.currentIndex = i;\n item.start = start;\n item.end = start + item.size;\n item.mid = start + item.size / 2;\n start = item.end;\n }\n\n return items;\n};\n\nexport const isDraggedElement = (item: MeasuredDropTarget) =>\n item.isDraggedElement;\n\nexport const measureDropTargets = (\n container: HTMLElement,\n orientation: orientationType,\n draggedItem: HTMLElement,\n itemQuery?: string\n) => {\n const dragThresholds: MeasuredDropTarget[] = [];\n\n // TODO need to make sure we're including only the children we should\n const children = Array.from(\n itemQuery ? container.querySelectorAll(itemQuery) : container.children\n );\n let previousThreshold = null;\n for (let index = 0; index < children.length; index++) {\n const element = children[index] as HTMLElement;\n const dimension = orientation === \"horizontal\" ? \"width\" : \"height\";\n let [start, size] = measureElementSizeAndPosition(element, dimension);\n\n dragThresholds.push(\n (previousThreshold = {\n currentIndex: index,\n dataIndex: parseInt(element.dataset.index ?? \"-1\"),\n index,\n isDraggedElement: element === draggedItem,\n isOverflowIndicator: element.dataset.overflowIndicator === \"true\",\n element: element as HTMLElement,\n start,\n end: start + size,\n size,\n mid: start + size / 2,\n })\n );\n }\n return dragThresholds;\n};\n\nexport const getNextDropTarget = (\n dropTargets: MeasuredDropTarget[],\n pos: number,\n direction: Direction\n) => {\n const len = dropTargets.length;\n if (direction === FWD) {\n for (let index = 0; index < len; index++) {\n let dropTarget = dropTargets[index];\n const { start, mid, end } = dropTarget;\n if (pos > end) {\n continue;\n } else if (pos > mid) {\n return dropTarget.isDraggedElement ? null : dropTarget;\n } else if (pos > start) {\n dropTarget = dropTargets[index - 1];\n return dropTarget.isDraggedElement ? null : dropTarget;\n }\n }\n } else {\n for (let index = len - 1; index >= 0; index--) {\n let dropTarget = dropTargets[index];\n const { start, mid, end } = dropTarget;\n if (pos < start) {\n continue;\n } else if (pos < mid) {\n return dropTarget.isDraggedElement ? null : dropTarget;\n } else if (pos < end) {\n dropTarget = dropTargets[Math.min(len - 1, index + 1)];\n return dropTarget.isDraggedElement ? null : dropTarget;\n }\n }\n }\n return null;\n};\n"],"names":["FWD"],"mappings":"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"}
1	+ {"version":3,"file":"drag-utils.js","sources":["../src/tabs/drag-drop/drag-utils.ts"],"sourcesContent":["import type { orientationType } from \"../../responsive\";\nimport { type Direction, FWD } from \"./dragDropTypes\";\n\nconst LEFT_RIGHT = [\"left\", \"right\"];\nconst TOP_BOTTOM = [\"top\", \"bottom\"];\n// duplicated in repsonsive\n\nexport type MeasuredDropTarget = {\n currentIndex: number;\n dataIndex?: number;\n element: HTMLElement;\n index: number;\n isDraggedElement: boolean;\n isOverflowIndicator?: boolean;\n start: number;\n end: number;\n mid: number;\n size: number;\n};\n\nexport type targetType = {\n element: HTMLElement \| null;\n index: number;\n isLast?: boolean;\n};\n\ntype MousePosKey = keyof Pick<MouseEvent, \"clientX\" \| \"clientY\">;\ntype DOMRectKey = keyof Omit<DOMRect, \"toJSON\">;\ntype DOMRectDimensionKey = keyof Pick<DOMRect, \"width\" \| \"height\">;\ntype Dimension = keyof Pick<DOMRect, \"width\" \| \"height\">;\ntype ElementDimension = keyof Pick<\n HTMLElement,\n \| \"scrollHeight\"\n \| \"scrollWidth\"\n \| \"clientHeight\"\n \| \"clientWidth\"\n \| \"scrollTop\"\n \| \"scrollLeft\"\n>;\n\nexport const measureElementSizeAndPosition = (\n element: HTMLElement,\n dimension: Dimension = \"width\",\n includeAutoMargin = false,\n) => {\n const pos = dimension === \"width\" ? \"left\" : \"top\";\n const { [dimension]: size, [pos]: position } =\n element.getBoundingClientRect();\n const { padEnd = false, padStart = false } = element.dataset;\n const style = getComputedStyle(element);\n const [start, end] = dimension === \"width\" ? LEFT_RIGHT : TOP_BOTTOM;\n const marginStart =\n padStart && !includeAutoMargin\n ? 0\n : Number.parseInt(style.getPropertyValue(`margin-${start}`), 10);\n const marginEnd =\n padEnd && !includeAutoMargin\n ? 0\n : Number.parseInt(style.getPropertyValue(`margin-${end}`), 10);\n\n let minWidth = size;\n const flexShrink = Number.parseInt(style.getPropertyValue(\"flex-shrink\"), 10);\n if (flexShrink > 0) {\n const flexBasis = Number.parseInt(style.getPropertyValue(\"flex-basis\"), 10);\n if (!Number.isNaN(flexBasis) && flexBasis > 0) {\n minWidth = flexBasis;\n }\n }\n return [position, marginStart + minWidth + marginEnd];\n};\n\nconst DIMENSIONS = {\n horizontal: {\n CLIENT_SIZE: \"clientWidth\" as ElementDimension,\n CONTRA: \"top\" as DOMRectKey,\n CONTRA_POS: \"clientY\" as MousePosKey,\n DIMENSION: \"width\" as DOMRectDimensionKey,\n END: \"right\" as DOMRectKey,\n POS: \"clientX\" as MousePosKey,\n SCROLL_POS: \"scrollTop\" as ElementDimension,\n SCROLL_SIZE: \"scrollWidth\" as ElementDimension,\n START: \"left\" as DOMRectKey,\n },\n vertical: {\n CLIENT_SIZE: \"clientHeight\" as ElementDimension,\n CONTRA: \"left\" as DOMRectKey,\n CONTRA_POS: \"clientX\" as MousePosKey,\n DIMENSION: \"height\" as DOMRectDimensionKey,\n END: \"bottom\" as DOMRectKey,\n POS: \"clientY\" as MousePosKey,\n SCROLL_POS: \"scrollLeft\" as ElementDimension,\n SCROLL_SIZE: \"scrollHeight\" as ElementDimension,\n START: \"top\" as DOMRectKey,\n },\n};\nexport const dimensions = (orientation: orientationType) =>\n DIMENSIONS[orientation];\n\nexport const getDraggedItem = (\n measuredItems: MeasuredDropTarget[],\n): MeasuredDropTarget => {\n const result = measuredItems.find((item) => item.isDraggedElement);\n if (result) {\n return result;\n }\n throw Error(\"measuredItems do not contain a draggedElement\");\n};\n\nexport const moveDragItem = (\n measuredItems: MeasuredDropTarget[],\n dropTarget: MeasuredDropTarget,\n): MeasuredDropTarget[] => {\n const items: MeasuredDropTarget[] = measuredItems.slice();\n const draggedItem = getDraggedItem(items);\n const draggedIndex = items.indexOf(draggedItem!);\n const targetIndex = items.indexOf(dropTarget);\n\n const firstPos = Math.min(draggedIndex, targetIndex);\n const lastPos = Math.max(draggedIndex, targetIndex);\n let { start } = items[firstPos];\n\n items[draggedIndex] = { ...dropTarget };\n items[targetIndex] = { ...draggedItem };\n\n for (let i = firstPos; i <= lastPos; i++) {\n const item = items[i];\n item.currentIndex = i;\n item.start = start;\n item.end = start + item.size;\n item.mid = start + item.size / 2;\n start = item.end;\n }\n\n return items;\n};\n\nexport const isDraggedElement = (item: MeasuredDropTarget) =>\n item.isDraggedElement;\n\nexport const measureDropTargets = (\n container: HTMLElement,\n orientation: orientationType,\n draggedItem: HTMLElement,\n itemQuery?: string,\n) => {\n const dragThresholds: MeasuredDropTarget[] = [];\n\n // TODO need to make sure we're including only the children we should\n const children = Array.from(\n itemQuery ? container.querySelectorAll(itemQuery) : container.children,\n );\n let previousThreshold = null;\n for (let index = 0; index < children.length; index++) {\n const element = children[index] as HTMLElement;\n const dimension = orientation === \"horizontal\" ? \"width\" : \"height\";\n const [start, size] = measureElementSizeAndPosition(element, dimension);\n\n previousThreshold = {\n currentIndex: index,\n dataIndex: Number.parseInt(element.dataset.index ?? \"-1\"),\n index,\n isDraggedElement: element === draggedItem,\n isOverflowIndicator: element.dataset.overflowIndicator === \"true\",\n element: element as HTMLElement,\n start,\n end: start + size,\n size,\n mid: start + size / 2,\n };\n\n dragThresholds.push(previousThreshold);\n }\n return dragThresholds;\n};\n\nexport const getNextDropTarget = (\n dropTargets: MeasuredDropTarget[],\n pos: number,\n direction: Direction,\n) => {\n const len = dropTargets.length;\n if (direction === FWD) {\n for (let index = 0; index < len; index++) {\n let dropTarget = dropTargets[index];\n const { start, mid, end } = dropTarget;\n if (pos > end) {\n continue;\n }\n if (pos > mid) {\n return dropTarget.isDraggedElement ? null : dropTarget;\n }\n if (pos > start) {\n dropTarget = dropTargets[index - 1];\n return dropTarget.isDraggedElement ? null : dropTarget;\n }\n }\n } else {\n for (let index = len - 1; index >= 0; index--) {\n let dropTarget = dropTargets[index];\n const { start, mid, end } = dropTarget;\n if (pos < start) {\n continue;\n }\n if (pos < mid) {\n return dropTarget.isDraggedElement ? null : dropTarget;\n }\n if (pos < end) {\n dropTarget = dropTargets[Math.min(len - 1, index + 1)];\n return dropTarget.isDraggedElement ? null : dropTarget;\n }\n }\n }\n return null;\n};\n"],"names":["FWD"],"mappings":"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"}

package/dist-cjs/tabs/drag-drop/dragDropTypes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dragDropTypes.js","sources":["../src/tabs/drag-drop/dragDropTypes.ts"],"sourcesContent":["import { MouseEventHandler, RefObject } from \"react\";\n\nimport { orientationType } from \"../../responsive\";\n\nexport type dragStrategy = \"drop-indicator\" \| \"natural-movement\";\n\nexport type Direction = \"fwd\" \| \"bwd\";\nexport const FWD: Direction = \"fwd\";\nexport const BWD: Direction = \"bwd\";\n\nexport type Rect = {\n height: number;\n left: number;\n top: number;\n width: number;\n};\n\nexport type DragHookResult = {\n draggable: JSX.Element \| null;\n dropIndicator: JSX.Element \| null;\n draggedItemIndex?: number;\n isDragging: boolean;\n onMouseDown?: MouseEventHandler;\n revealOverflowedItems: boolean;\n // tabProps?: Partial<TabProps>;\n};\n\nexport type DragDropHook = (props: {\n allowDragDrop?: boolean \| dragStrategy;\n extendedDropZone?: boolean;\n onDrop: (fromIndex: number, toIndex: number) => void;\n orientation: orientationType;\n containerRef: RefObject<HTMLElement>;\n itemQuery?: string;\n}) => DragHookResult;\n"],"names":[],"mappings":";;;;AAOO,MAAM,GAAiB,GAAA;;;;"}
1	+ {"version":3,"file":"dragDropTypes.js","sources":["../src/tabs/drag-drop/dragDropTypes.ts"],"sourcesContent":["import type { MouseEventHandler, RefObject } from \"react\";\n\nimport type { orientationType } from \"../../responsive\";\n\nexport type dragStrategy = \"drop-indicator\" \| \"natural-movement\";\n\nexport type Direction = \"fwd\" \| \"bwd\";\nexport const FWD: Direction = \"fwd\";\nexport const BWD: Direction = \"bwd\";\n\nexport type Rect = {\n height: number;\n left: number;\n top: number;\n width: number;\n};\n\nexport type DragHookResult = {\n draggable: JSX.Element \| null;\n dropIndicator: JSX.Element \| null;\n draggedItemIndex?: number;\n isDragging: boolean;\n onMouseDown?: MouseEventHandler;\n revealOverflowedItems: boolean;\n // tabProps?: Partial<TabProps>;\n};\n\nexport type DragDropHook = (props: {\n allowDragDrop?: boolean \| dragStrategy;\n extendedDropZone?: boolean;\n onDrop: (fromIndex: number, toIndex: number) => void;\n orientation: orientationType;\n containerRef: RefObject<HTMLElement>;\n itemQuery?: string;\n}) => DragHookResult;\n"],"names":[],"mappings":";;;;AAOO,MAAM,GAAiB,GAAA;;;;"}

package/dist-cjs/tabs/drag-drop/useDragDrop.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDragDrop.js","sources":["../src/tabs/drag-drop/useDragDrop.ts"],"sourcesContent":["import { DragDropHook } from \"./dragDropTypes\";\nimport { useDragDropNaturalMovement } from \"./useDragDropNaturalMovement\";\n\nconst NULL_DRAG_DROP_RESULT = {\n draggable: null,\n isDragging: false,\n dropIndicator: null,\n revealOverflowedItems: false,\n};\nconst noDragDrop: DragDropHook = () => NULL_DRAG_DROP_RESULT;\n\nexport const useDragDrop: DragDropHook = ({\n allowDragDrop,\n ...dragDropProps\n}) => {\n const useDragDropHook: DragDropHook = allowDragDrop\n ? useDragDropNaturalMovement\n : noDragDrop;\n\n return useDragDropHook(dragDropProps);\n};\n"],"names":["useDragDropNaturalMovement"],"mappings":";;;;;;AAGA,MAAM,qBAAwB,GAAA;AAAA,EAC5B,SAAW,EAAA,IAAA;AAAA,EACX,UAAY,EAAA,KAAA;AAAA,EACZ,aAAe,EAAA,IAAA;AAAA,EACf,qBAAuB,EAAA,KAAA;AACzB,CAAA,CAAA;AACA,MAAM,aAA2B,MAAM,qBAAA,CAAA;AAEhC,MAAM,cAA4B,CAAC;AAAA,EACxC,aAAA;AAAA,EACG,GAAA,aAAA;AACL,CAAM,KAAA;AACJ,EAAM,MAAA,eAAA,GAAgC,gBAClCA,qDACA,GAAA,UAAA,CAAA;AAEJ,EAAA,OAAO,gBAAgB,aAAa,CAAA,CAAA;AACtC;;;;"}
1	+ {"version":3,"file":"useDragDrop.js","sources":["../src/tabs/drag-drop/useDragDrop.ts"],"sourcesContent":["import type { DragDropHook } from \"./dragDropTypes\";\nimport { useDragDropNaturalMovement } from \"./useDragDropNaturalMovement\";\n\nconst NULL_DRAG_DROP_RESULT = {\n draggable: null,\n isDragging: false,\n dropIndicator: null,\n revealOverflowedItems: false,\n};\nconst noDragDrop: DragDropHook = () => NULL_DRAG_DROP_RESULT;\n\nexport const useDragDrop: DragDropHook = ({\n allowDragDrop,\n ...dragDropProps\n}) => {\n const useDragDropHook: DragDropHook = allowDragDrop\n ? useDragDropNaturalMovement\n : noDragDrop;\n\n return useDragDropHook(dragDropProps);\n};\n"],"names":["useDragDropNaturalMovement"],"mappings":";;;;;;AAGA,MAAM,qBAAwB,GAAA;AAAA,EAC5B,SAAW,EAAA,IAAA;AAAA,EACX,UAAY,EAAA,KAAA;AAAA,EACZ,aAAe,EAAA,IAAA;AAAA,EACf,qBAAuB,EAAA,KAAA;AACzB,CAAA,CAAA;AACA,MAAM,aAA2B,MAAM,qBAAA,CAAA;AAEhC,MAAM,cAA4B,CAAC;AAAA,EACxC,aAAA;AAAA,EACG,GAAA,aAAA;AACL,CAAM,KAAA;AACJ,EAAM,MAAA,eAAA,GAAgC,gBAClCA,qDACA,GAAA,UAAA,CAAA;AAEJ,EAAA,OAAO,gBAAgB,aAAa,CAAA,CAAA;AACtC;;;;"}

package/dist-cjs/tabs/drag-drop/useDragDropNaturalMovement.js CHANGED Viewed

@@ -58,7 +58,8 @@ const useDragDropNaturalMovement = ({
           );
           if (nextDropTarget && (nextDropTarget.index !== (currentDropTarget == null ? void 0 : currentDropTarget.index) || direction !== dragDirection.current)) {
             if (nextDropTarget.isOverflowIndicator) {
-              setShowOverflow(overflowMenuShowingRef.current = true);
+              overflowMenuShowingRef.current = true;
+              setShowOverflow(true);
             } else {
               const newDropTargets = dragUtils.moveDragItem(dropTargets, nextDropTarget);
               const draggedItem2 = dragUtils.getDraggedItem(newDropTargets);
@@ -75,7 +76,8 @@ const useDragDropNaturalMovement = ({
                 displaceLastItem(displacedItem, draggedItem2.size, true);
               }
               measuredDropTargets.current = newDropTargets;
-              setShowOverflow(overflowMenuShowingRef.current = false);
+              overflowMenuShowingRef.current = false;
+              setShowOverflow(false);
             }
             dropTarget.current = nextDropTarget;
             dragDirection.current = direction;
@@ -158,8 +160,7 @@ const useDragDropNaturalMovement = ({
       dragMouseMoveHandler,
       dragMouseUpHandler,
       itemQuery,
-      orientation,
-      setIsDragging
+      orientation
     ]
   );
   const preDragMouseMoveHandler = React.useCallback(

package/dist-cjs/tabs/drag-drop/useDragDropNaturalMovement.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDragDropNaturalMovement.js","sources":["../src/tabs/drag-drop/useDragDropNaturalMovement.tsx"],"sourcesContent":["import { MouseEventHandler, useCallback, useRef, useState } from \"react\";\n\nimport { DragDropHook, Direction } from \"./dragDropTypes\";\nimport { useDragSpacers } from \"./useDragSpacers\";\n\nimport {\n dimensions,\n isDraggedElement,\n MeasuredDropTarget,\n measureDropTargets,\n moveDragItem,\n getDraggedItem,\n getNextDropTarget,\n} from \"./drag-utils\";\n\nimport { Draggable } from \"./Draggable\";\n\nconst dragThreshold = 3;\n\nexport const useDragDropNaturalMovement: DragDropHook = ({\n onDrop,\n orientation = \"horizontal\",\n containerRef,\n itemQuery = \"*\",\n}) => {\n const [showOverflow, setShowOverflow] = useState(false);\n const overflowMenuShowingRef = useRef(false);\n const [isDragging, setIsDragging] = useState(false);\n const [dragPortal, setDragPortal] = useState<JSX.Element \| null>(null);\n const draggableRef = useRef<HTMLDivElement>(null);\n const startPos = useRef(0);\n const previousPos = useRef(0);\n const mouseOffset = useRef(0);\n const mouseDownTimer = useRef<number \| null>(null);\n const dragLimits = useRef({ start: 0, end: 0 });\n const dragDirection = useRef<Direction \| undefined>();\n const dropTarget = useRef<MeasuredDropTarget \| null>(null);\n const measuredDropTargets = useRef<MeasuredDropTarget[]>([]);\n const { clearSpacers, displaceItem, displaceLastItem } = useDragSpacers();\n\n const dragMouseMoveHandler = useCallback(\n (evt: MouseEvent) => {\n const { POS } = dimensions(orientation);\n const { [POS]: clientPos } = evt;\n const { current: lastClientPos } = previousPos;\n const { current: currentDropTarget } = dropTarget;\n const { current: dropTargets } = measuredDropTargets;\n const draggedItem = getDraggedItem(dropTargets);\n\n if (Math.abs(lastClientPos - clientPos) > 0) {\n previousPos.current = clientPos;\n\n const moveDistance = clientPos - startPos.current;\n\n const pos = startPos.current - mouseOffset.current + moveDistance;\n const renderPos = Math.max(\n dragLimits.current.start,\n Math.min(dragLimits.current.end, pos)\n );\n\n if (draggableRef.current && containerRef.current) {\n // Have to redefine the following here as we're using it as a style type not a DOMRect type\n const START = orientation === \"horizontal\" ? \"left\" : \"top\";\n draggableRef.current.style[START] = `${renderPos}px`;\n\n const direction = lastClientPos < clientPos ? \"fwd\" : \"bwd\";\n const offsetPos = clientPos - mouseOffset.current;\n const leadingEdge =\n direction === \"fwd\" ? offsetPos + draggedItem.size : offsetPos;\n\n const nextDropTarget = getNextDropTarget(\n measuredDropTargets.current,\n leadingEdge,\n direction\n );\n\n if (\n nextDropTarget &&\n (nextDropTarget.index !== currentDropTarget?.index \|\|\n direction !== dragDirection.current)\n ) {\n if (nextDropTarget.isOverflowIndicator) {\n // Does this belong in here or can we abstract it out\n setShowOverflow((overflowMenuShowingRef.current = true));\n } else {\n const newDropTargets = moveDragItem(dropTargets, nextDropTarget);\n const draggedItem = getDraggedItem(newDropTargets);\n\n const nextDisplacedItem =\n newDropTargets[draggedItem.currentIndex + 1];\n if (nextDisplacedItem) {\n displaceItem(\n nextDisplacedItem,\n draggedItem.size,\n true,\n direction\n );\n } else {\n const displacedItem =\n newDropTargets[draggedItem.currentIndex - 1];\n displaceLastItem(displacedItem, draggedItem.size, true);\n }\n measuredDropTargets.current = newDropTargets;\n setShowOverflow((overflowMenuShowingRef.current = false));\n }\n\n dropTarget.current = nextDropTarget;\n dragDirection.current = direction;\n }\n }\n }\n },\n [containerRef, displaceItem, displaceLastItem, orientation]\n );\n\n const dragMouseUpHandler = useCallback(() => {\n document.removeEventListener(\"mousemove\", dragMouseMoveHandler, false);\n document.removeEventListener(\"mouseup\", dragMouseUpHandler, false);\n\n clearSpacers();\n\n const { current: dropTargets } = measuredDropTargets;\n const draggedItem = getDraggedItem(dropTargets);\n const { dataIndex = -1, index, currentIndex: toIndex } = draggedItem;\n\n const fromIndex = dataIndex !== -1 ? dataIndex : index;\n dropTarget.current = null;\n dragDirection.current = undefined;\n\n setDragPortal(null);\n\n if (overflowMenuShowingRef.current) {\n onDrop(fromIndex, -1);\n } else if (fromIndex !== toIndex) {\n onDrop(fromIndex, toIndex);\n }\n setShowOverflow(false);\n setIsDragging(false);\n }, [clearSpacers, dragMouseMoveHandler, onDrop]);\n\n const enterDraggingState = useCallback(\n (evt: MouseEvent) => {\n const { POS, START } = dimensions(orientation);\n const { [POS]: clientPos } = evt;\n\n const evtTarget = evt.target as HTMLElement;\n const dragElement = evtTarget.closest(itemQuery) as HTMLElement;\n if (dragElement) {\n // TODO this is very specific to responsive Container\n const query = `:is(${itemQuery}:not([data-overflowed=\"true\"]),[data-overflow-indicator])`;\n const dropTargets = measureDropTargets(\n containerRef.current as HTMLElement,\n orientation,\n dragElement,\n query\n );\n\n const draggedItem = dropTargets.find(isDraggedElement);\n if (draggedItem && containerRef.current) {\n measuredDropTargets.current = dropTargets;\n dropTarget.current = draggedItem;\n\n const containerRect = containerRef.current.getBoundingClientRect();\n const draggableRect = draggedItem.element.getBoundingClientRect();\n mouseOffset.current = clientPos - draggedItem.start;\n const [lastItem] = dropTargets.slice(-1);\n const lastChildEnd = lastItem.end;\n\n console.log({ lastItem });\n\n dragLimits.current.start = containerRect[START];\n dragLimits.current.end = lastItem.isOverflowIndicator\n ? Math.max(lastItem.start, containerRect.right - draggedItem.size)\n : lastChildEnd - draggedItem.size;\n\n setDragPortal(\n <Draggable\n wrapperClassName={`tabstrip-${orientation}`}\n ref={draggableRef}\n rect={draggableRect}\n element={dragElement.cloneNode(true) as HTMLElement}\n />\n );\n\n if (draggedItem !== lastItem) {\n const nextItem = dropTargets[draggedItem.index + 1];\n displaceItem(nextItem, draggedItem.size, false);\n } else {\n const displacedItem = dropTargets[draggedItem.index];\n displaceLastItem(displacedItem, draggedItem.size, false);\n }\n\n setIsDragging(true);\n }\n\n document.addEventListener(\"mousemove\", dragMouseMoveHandler, false);\n document.addEventListener(\"mouseup\", dragMouseUpHandler, false);\n }\n },\n [\n containerRef,\n displaceItem,\n displaceLastItem,\n dragMouseMoveHandler,\n dragMouseUpHandler,\n itemQuery,\n orientation,\n setIsDragging,\n ]\n );\n\n const preDragMouseMoveHandler = useCallback(\n (evt: MouseEvent) => {\n const { POS } = dimensions(orientation);\n const { [POS]: clientPos } = evt;\n const mouseMoveDistance = Math.abs(clientPos - startPos.current);\n if (mouseMoveDistance > dragThreshold && containerRef.current) {\n if (mouseDownTimer.current) {\n window.clearTimeout(mouseDownTimer.current);\n mouseDownTimer.current = null;\n }\n document.removeEventListener(\n \"mousemove\",\n preDragMouseMoveHandler,\n false\n );\n document.removeEventListener(\"mouseup\", preDragMouseUpHandler, false);\n\n enterDraggingState(evt);\n }\n },\n [containerRef, enterDraggingState, 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 (containerRef.current && !evt.defaultPrevented) {\n const { POS } = dimensions(orientation);\n const { [POS]: clientPos } = evt;\n startPos.current = clientPos;\n previousPos.current = clientPos;\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\n enterDraggingState(evt.nativeEvent);\n }, 500);\n }\n },\n [\n containerRef,\n enterDraggingState,\n orientation,\n preDragMouseMoveHandler,\n preDragMouseUpHandler,\n ]\n );\n\n const draggedItemIndex = isDragging\n ? getDraggedItem(measuredDropTargets.current).dataIndex\n : -1;\n\n return {\n draggable: dragPortal,\n dropIndicator: null,\n draggedItemIndex,\n isDragging,\n onMouseDown: mouseDownHandler,\n revealOverflowedItems: showOverflow,\n };\n};\n"],"names":["useState","useRef","useDragSpacers","useCallback","dimensions","getDraggedItem","getNextDropTarget","moveDragItem","draggedItem","measureDropTargets","isDraggedElement","jsx","Draggable"],"mappings":"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"}
1	+ {"version":3,"file":"useDragDropNaturalMovement.js","sources":["../src/tabs/drag-drop/useDragDropNaturalMovement.tsx"],"sourcesContent":["import { type MouseEventHandler, useCallback, useRef, useState } from \"react\";\n\nimport type { Direction, DragDropHook } from \"./dragDropTypes\";\nimport { useDragSpacers } from \"./useDragSpacers\";\n\nimport {\n type MeasuredDropTarget,\n dimensions,\n getDraggedItem,\n getNextDropTarget,\n isDraggedElement,\n measureDropTargets,\n moveDragItem,\n} from \"./drag-utils\";\n\nimport { Draggable } from \"./Draggable\";\n\nconst dragThreshold = 3;\n\nexport const useDragDropNaturalMovement: DragDropHook = ({\n onDrop,\n orientation = \"horizontal\",\n containerRef,\n itemQuery = \"*\",\n}) => {\n const [showOverflow, setShowOverflow] = useState(false);\n const overflowMenuShowingRef = useRef(false);\n const [isDragging, setIsDragging] = useState(false);\n const [dragPortal, setDragPortal] = useState<JSX.Element \| null>(null);\n const draggableRef = useRef<HTMLDivElement>(null);\n const startPos = useRef(0);\n const previousPos = useRef(0);\n const mouseOffset = useRef(0);\n const mouseDownTimer = useRef<number \| null>(null);\n const dragLimits = useRef({ start: 0, end: 0 });\n const dragDirection = useRef<Direction \| undefined>();\n const dropTarget = useRef<MeasuredDropTarget \| null>(null);\n const measuredDropTargets = useRef<MeasuredDropTarget[]>([]);\n const { clearSpacers, displaceItem, displaceLastItem } = useDragSpacers();\n\n const dragMouseMoveHandler = useCallback(\n (evt: MouseEvent) => {\n const { POS } = dimensions(orientation);\n const { [POS]: clientPos } = evt;\n const { current: lastClientPos } = previousPos;\n const { current: currentDropTarget } = dropTarget;\n const { current: dropTargets } = measuredDropTargets;\n const draggedItem = getDraggedItem(dropTargets);\n\n if (Math.abs(lastClientPos - clientPos) > 0) {\n previousPos.current = clientPos;\n\n const moveDistance = clientPos - startPos.current;\n\n const pos = startPos.current - mouseOffset.current + moveDistance;\n const renderPos = Math.max(\n dragLimits.current.start,\n Math.min(dragLimits.current.end, pos),\n );\n\n if (draggableRef.current && containerRef.current) {\n // Have to redefine the following here as we're using it as a style type not a DOMRect type\n const START = orientation === \"horizontal\" ? \"left\" : \"top\";\n draggableRef.current.style[START] = `${renderPos}px`;\n\n const direction = lastClientPos < clientPos ? \"fwd\" : \"bwd\";\n const offsetPos = clientPos - mouseOffset.current;\n const leadingEdge =\n direction === \"fwd\" ? offsetPos + draggedItem.size : offsetPos;\n\n const nextDropTarget = getNextDropTarget(\n measuredDropTargets.current,\n leadingEdge,\n direction,\n );\n\n if (\n nextDropTarget &&\n (nextDropTarget.index !== currentDropTarget?.index \|\|\n direction !== dragDirection.current)\n ) {\n if (nextDropTarget.isOverflowIndicator) {\n // Does this belong in here or can we abstract it out\n overflowMenuShowingRef.current = true;\n setShowOverflow(true);\n } else {\n const newDropTargets = moveDragItem(dropTargets, nextDropTarget);\n const draggedItem = getDraggedItem(newDropTargets);\n\n const nextDisplacedItem =\n newDropTargets[draggedItem.currentIndex + 1];\n if (nextDisplacedItem) {\n displaceItem(\n nextDisplacedItem,\n draggedItem.size,\n true,\n direction,\n );\n } else {\n const displacedItem =\n newDropTargets[draggedItem.currentIndex - 1];\n displaceLastItem(displacedItem, draggedItem.size, true);\n }\n measuredDropTargets.current = newDropTargets;\n overflowMenuShowingRef.current = false;\n setShowOverflow(false);\n }\n\n dropTarget.current = nextDropTarget;\n dragDirection.current = direction;\n }\n }\n }\n },\n [containerRef, displaceItem, displaceLastItem, orientation],\n );\n\n const dragMouseUpHandler = useCallback(() => {\n document.removeEventListener(\"mousemove\", dragMouseMoveHandler, false);\n document.removeEventListener(\"mouseup\", dragMouseUpHandler, false);\n\n clearSpacers();\n\n const { current: dropTargets } = measuredDropTargets;\n const draggedItem = getDraggedItem(dropTargets);\n const { dataIndex = -1, index, currentIndex: toIndex } = draggedItem;\n\n const fromIndex = dataIndex !== -1 ? dataIndex : index;\n dropTarget.current = null;\n dragDirection.current = undefined;\n\n setDragPortal(null);\n\n if (overflowMenuShowingRef.current) {\n onDrop(fromIndex, -1);\n } else if (fromIndex !== toIndex) {\n onDrop(fromIndex, toIndex);\n }\n setShowOverflow(false);\n setIsDragging(false);\n }, [clearSpacers, dragMouseMoveHandler, onDrop]);\n\n const enterDraggingState = useCallback(\n (evt: MouseEvent) => {\n const { POS, START } = dimensions(orientation);\n const { [POS]: clientPos } = evt;\n\n const evtTarget = evt.target as HTMLElement;\n const dragElement = evtTarget.closest(itemQuery) as HTMLElement;\n if (dragElement) {\n // TODO this is very specific to responsive Container\n const query = `:is(${itemQuery}:not([data-overflowed=\"true\"]),[data-overflow-indicator])`;\n const dropTargets = measureDropTargets(\n containerRef.current as HTMLElement,\n orientation,\n dragElement,\n query,\n );\n\n const draggedItem = dropTargets.find(isDraggedElement);\n if (draggedItem && containerRef.current) {\n measuredDropTargets.current = dropTargets;\n dropTarget.current = draggedItem;\n\n const containerRect = containerRef.current.getBoundingClientRect();\n const draggableRect = draggedItem.element.getBoundingClientRect();\n mouseOffset.current = clientPos - draggedItem.start;\n const [lastItem] = dropTargets.slice(-1);\n const lastChildEnd = lastItem.end;\n\n console.log({ lastItem });\n\n dragLimits.current.start = containerRect[START];\n dragLimits.current.end = lastItem.isOverflowIndicator\n ? Math.max(lastItem.start, containerRect.right - draggedItem.size)\n : lastChildEnd - draggedItem.size;\n\n setDragPortal(\n <Draggable\n wrapperClassName={`tabstrip-${orientation}`}\n ref={draggableRef}\n rect={draggableRect}\n element={dragElement.cloneNode(true) as HTMLElement}\n />,\n );\n\n if (draggedItem !== lastItem) {\n const nextItem = dropTargets[draggedItem.index + 1];\n displaceItem(nextItem, draggedItem.size, false);\n } else {\n const displacedItem = dropTargets[draggedItem.index];\n displaceLastItem(displacedItem, draggedItem.size, false);\n }\n\n setIsDragging(true);\n }\n\n document.addEventListener(\"mousemove\", dragMouseMoveHandler, false);\n document.addEventListener(\"mouseup\", dragMouseUpHandler, false);\n }\n },\n [\n containerRef,\n displaceItem,\n displaceLastItem,\n dragMouseMoveHandler,\n dragMouseUpHandler,\n itemQuery,\n orientation,\n ],\n );\n\n const preDragMouseMoveHandler = useCallback(\n (evt: MouseEvent) => {\n const { POS } = dimensions(orientation);\n const { [POS]: clientPos } = evt;\n const mouseMoveDistance = Math.abs(clientPos - startPos.current);\n if (mouseMoveDistance > dragThreshold && containerRef.current) {\n if (mouseDownTimer.current) {\n window.clearTimeout(mouseDownTimer.current);\n mouseDownTimer.current = null;\n }\n document.removeEventListener(\n \"mousemove\",\n preDragMouseMoveHandler,\n false,\n );\n document.removeEventListener(\"mouseup\", preDragMouseUpHandler, false);\n\n enterDraggingState(evt);\n }\n },\n [containerRef, enterDraggingState, 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 (containerRef.current && !evt.defaultPrevented) {\n const { POS } = dimensions(orientation);\n const { [POS]: clientPos } = evt;\n startPos.current = clientPos;\n previousPos.current = clientPos;\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\n enterDraggingState(evt.nativeEvent);\n }, 500);\n }\n },\n [\n containerRef,\n enterDraggingState,\n orientation,\n preDragMouseMoveHandler,\n preDragMouseUpHandler,\n ],\n );\n\n const draggedItemIndex = isDragging\n ? getDraggedItem(measuredDropTargets.current).dataIndex\n : -1;\n\n return {\n draggable: dragPortal,\n dropIndicator: null,\n draggedItemIndex,\n isDragging,\n onMouseDown: mouseDownHandler,\n revealOverflowedItems: showOverflow,\n };\n};\n"],"names":["useState","useRef","useDragSpacers","useCallback","dimensions","getDraggedItem","getNextDropTarget","moveDragItem","draggedItem","measureDropTargets","isDraggedElement","jsx","Draggable"],"mappings":"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"}

package/dist-cjs/tabs/drag-drop/useDragSpacers.js CHANGED Viewed

@@ -17,18 +17,21 @@ const useDragSpacers = () => {
       var _a;
       return (_a = spacer.parentElement) == null ? void 0 : _a.removeChild(spacer);
     }),
-    []
+    [spacers]
+  );
+  const animateTransition = React.useCallback(
+    (size) => {
+      const [spacer1, spacer2] = spacers;
+      animationFrame.current = requestAnimationFrame(() => {
+        transitioning.current = true;
+        spacer1.style.cssText = "width: 0px";
+        spacer2.style.cssText = `width: ${size}px`;
+        spacers[0] = spacer2;
+        spacers[1] = spacer1;
+      });
+    },
+    [spacers]
   );
-  const animateTransition = React.useCallback((size) => {
-    const [spacer1, spacer2] = spacers;
-    animationFrame.current = requestAnimationFrame(() => {
-      transitioning.current = true;
-      spacer1.style.cssText = "width: 0px";
-      spacer2.style.cssText = `width: ${size}px`;
-      spacers[0] = spacer2;
-      spacers[1] = spacer1;
-    });
-  }, []);
   const cancelAnyPendingAnimation = React.useCallback(() => {
     if (animationFrame.current) {
       cancelAnimationFrame(animationFrame.current);
@@ -36,7 +39,7 @@ const useDragSpacers = () => {
     }
   }, []);
   const displaceItem = React.useCallback(
-    (item = null, size, useTransition = false, direction) => {
+    (item, size, useTransition = false, direction) => {
       var _a, _b, _c, _d;
       if (item) {
         const [spacer1, spacer2] = spacers;
@@ -45,7 +48,7 @@ const useDragSpacers = () => {
           if (transitioning.current) {
             clearSpacers();
             spacer1.style.cssText = `width: ${size}px`;
-            spacer2.style.cssText = `width: 0px`;
+            spacer2.style.cssText = "width: 0px";
             const target = direction === "fwd" ? item.element.previousElementSibling : item.element.nextElementSibling;
             (_a = item.element.parentElement) == null ? void 0 : _a.insertBefore(spacer1, target);
             (_b = item.element.parentElement) == null ? void 0 : _b.insertBefore(spacer2, item.element);
@@ -59,7 +62,7 @@ const useDragSpacers = () => {
         }
       }
     },
-    []
+    [animateTransition, cancelAnyPendingAnimation, clearSpacers, spacers]
   );
   const displaceLastItem = React.useCallback(
     (item, size, useTransition = false) => {
@@ -70,7 +73,7 @@ const useDragSpacers = () => {
         if (transitioning.current) {
           clearSpacers();
           spacer1.style.cssText = `width: ${size}px`;
-          spacer2.style.cssText = `width: 0px`;
+          spacer2.style.cssText = "width: 0px";
           (_a = item.element.parentElement) == null ? void 0 : _a.insertBefore(
             spacer1,
             item.element.previousElementSibling
@@ -94,7 +97,7 @@ const useDragSpacers = () => {
         );
       }
     },
-    []
+    [animateTransition, cancelAnyPendingAnimation, clearSpacers, spacers]
   );
   return {
     displaceItem,

package/dist-cjs/tabs/drag-drop/useDragSpacers.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDragSpacers.js","sources":["../src/tabs/drag-drop/useDragSpacers.ts"],"sourcesContent":["import { useCallback, useMemo, useRef } from \"react\";\nimport { ~~MeasuredDropTarget~~ } from \"./~~drag-utils~~\";\nimport { ~~createDragSpacer~~ } from \"./~~Draggable~~\";\nimport { Direction } from \"./dragDropTypes\";\n\nexport const useDragSpacers = () => {\n const animationFrame = useRef(0);\n const transitioning = useRef(false);\n\n const spacers = useMemo(\n // We only need to listen for transition end on one of the spacers\n () => [createDragSpacer(transitioning), createDragSpacer()],\n []\n );\n\n const clearSpacers = useCallback(\n () =>\n spacers.forEach((spacer) => spacer.parentElement?.removeChild(spacer)),\n []\n );\n\n const animateTransition = useCallback((size: number) => {\n const [spacer1, spacer2] = spacers;\n animationFrame.current = requestAnimationFrame(() => {\n transitioning.current = true;\n spacer1.style.cssText = \"width: 0px\";\n spacer2.style.cssText = `width: ${size}px`;\n spacers[0] = spacer2;\n spacers[1] = spacer1;\n });\n }, []);\n\n const cancelAnyPendingAnimation = useCallback(() => {\n if (animationFrame.current) {\n cancelAnimationFrame(animationFrame.current);\n animationFrame.current = 0;\n }\n }, []);\n\n const displaceItem = useCallback(\n (\n item: MeasuredDropTarget \| null ~~= null~~,\n size: number,\n useTransition = false,\n direction?: Direction\n ) => {\n if (item) {\n const [spacer1, spacer2] = spacers;\n cancelAnyPendingAnimation();\n if (useTransition) {\n if (transitioning.current) {\n clearSpacers();\n\n spacer1.style.cssText = `width: ${size}px`;\n spacer2.style.cssText = `width: 0px~~`;\~~n\n const target =\n direction === \"fwd\"\n ? item.element.previousElementSibling\n : item.element.nextElementSibling;\n\n item.element.parentElement?.insertBefore(spacer1, target);\n item.element.parentElement?.insertBefore(spacer2, item.element);\n } else {\n item.element.parentElement?.insertBefore(spacer2, item.element);\n }\n animateTransition(size);\n } else {\n spacer1.style.cssText = `width: ${size}px`;\n item.element.parentElement?.insertBefore(spacer1, item.element);\n }\n }\n },\n []\n );\n const displaceLastItem = useCallback(\n (item: MeasuredDropTarget, size: number, useTransition = false) => {\n const [spacer1, spacer2] = spacers;\n cancelAnyPendingAnimation();\n if (useTransition) {\n if (transitioning.current) {\n clearSpacers();\n\n spacer1.style.cssText = `width: ${size}px`;\n spacer2.style.cssText = `width: 0px~~`;\~~n\n item.element.parentElement?.insertBefore(\n spacer1,\n item.element.previousElementSibling\n );\n item.element.parentElement?.insertBefore(\n spacer2,\n item.element.nextElementSibling\n );\n } else {\n item.element.parentElement?.insertBefore(\n spacer2,\n item.element.nextElementSibling\n );\n }\n animateTransition(size);\n } else {\n spacer1.style.cssText = `width: ${size}px`;\n item.element.parentElement?.insertBefore(\n spacer1,\n item.element.nextElementSibling\n );\n }\n },\n []\n );\n\n return {\n displaceItem,\n displaceLastItem,\n clearSpacers,\n };\n};\n"],"names":["useRef","useMemo","createDragSpacer","useCallback"],"mappings":";;;;;;;AAKO,MAAM,iBAAiB,MAAM;AAClC,EAAM,MAAA,cAAA,GAAiBA,aAAO,CAAC,CAAA,CAAA;AAC/B,EAAM,MAAA,aAAA,GAAgBA,aAAO,KAAK,CAAA,CAAA;AAElC,EAAA,MAAM,OAAU,GAAAC,aAAA;AAAA,IAEd,MAAM,CAACC,0BAAA,CAAiB,aAAa,CAAA,EAAGA,4BAAkB,CAAA;AAAA,IAC1D,EAAC;AAAA,GACH,CAAA;AAEA,EAAA,MAAM,YAAe,GAAAC,iBAAA;AAAA,IACnB,MACE,OAAA,CAAQ,OAAQ,CAAA,CAAC,MAAQ,KAAA;AAjB/B,MAAA,IAAA,EAAA,CAAA;AAiBkC,MAAO,OAAA,CAAA,EAAA,GAAA,MAAA,CAAA,aAAA,KAAP,mBAAsB,WAAY,CAAA,MAAA,CAAA,CAAA;AAAA,KAAO,CAAA;AAAA,IACvE,~~EAAC~~;AAAA,~~GACH~~,CAAA;AAEA,~~EAAM~~,~~MAAA~~,~~iBAAA~~,~~GAAoBA~~,~~iBAAY~~,~~CAAA~~,CAAC,IAAiB,KAAA;~~AACtD~~,~~IAAM~~,MAAA,CAAC,OAAS,EAAA,OAAO,CAAI,GAAA,OAAA,CAAA;AAC3B,~~IAAe~~,cAAA,CAAA,OAAA,GAAU,sBAAsB,MAAM;AACnD,~~MAAA~~,aAAA,CAAc,OAAU,GAAA,IAAA,CAAA;AACxB,~~MAAA~~,OAAA,CAAQ,MAAM,OAAU,GAAA,YAAA,CAAA;AACxB,~~MAAQ~~,OAAA,CAAA,KAAA,CAAM,UAAU,CAAU,OAAA,EAAA,IAAA,CAAA,EAAA,CAAA,CAAA;AAClC,~~MAAA~~,OAAA,CAAQ,CAAK,CAAA,GAAA,OAAA,CAAA;AACb,~~MAAA~~,OAAA,CAAQ,CAAK,CAAA,GAAA,OAAA,CAAA;AAAA,~~KACd~~,CAAA,CAAA;AAAA,~~GACH~~,~~EAAG~~,~~EAAE~~,CAAA,CAAA;~~AAEL~~,EAAM,MAAA,yBAAA,GAA4BA,kBAAY,MAAM;AAClD,IAAA,IAAI,eAAe,OAAS,EAAA;AAC1B,MAAA,oBAAA,CAAqB,eAAe,OAAO,CAAA,CAAA;AAC3C,MAAA,cAAA,CAAe,OAAU,GAAA,CAAA,CAAA;AAAA,KAC3B;AAAA,GACF,EAAG,EAAE,CAAA,CAAA;AAEL,EAAA,MAAM,YAAe,GAAAA,iBAAA;AAAA,IACnB,CACE,~~IAAkC,GAAA,~~IAAA,~~EAClC~~,IACA,EAAA,aAAA,GAAgB,OAChB,SACG,KAAA;~~AA7CT~~,MAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;~~AA8CM~~,MAAA,IAAI,IAAM,EAAA;AACR,QAAM,MAAA,CAAC,OAAS,EAAA,OAAO,CAAI,GAAA,OAAA,CAAA;AAC3B,QAA0B,yBAAA,EAAA,CAAA;AAC1B,QAAA,IAAI,aAAe,EAAA;AACjB,UAAA,IAAI,cAAc,OAAS,EAAA;AACzB,YAAa,YAAA,EAAA,CAAA;AAEb,YAAQ,OAAA,CAAA,KAAA,CAAM,UAAU,CAAU,OAAA,EAAA,IAAA,CAAA,EAAA,CAAA,CAAA;AAClC,YAAA,OAAA,CAAQ,MAAM,OAAU,GAAA,~~CAAA~~,~~UAAA,~~CAAA~~,CAAA~~;AAExB,YAAA,MAAM,SACJ,SAAc,KAAA,KAAA,GACV,KAAK,OAAQ,CAAA,sBAAA,GACb,KAAK,OAAQ,CAAA,kBAAA,CAAA;AAEnB,YAAA,CAAA,EAAA,GAAA,IAAA,CAAK,OAAQ,CAAA,aAAA,KAAb,IAA4B,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA,CAAa,OAAS,EAAA,MAAA,CAAA,CAAA;AAClD,YAAA,CAAA,EAAA,GAAA,IAAA,CAAK,OAAQ,CAAA,aAAA,KAAb,IAA4B,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA,CAAa,SAAS,IAAK,CAAA,OAAA,CAAA,CAAA;AAAA,WAClD,MAAA;AACL,YAAA,CAAA,EAAA,GAAA,IAAA,CAAK,OAAQ,CAAA,aAAA,KAAb,IAA4B,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA,CAAa,SAAS,IAAK,CAAA,OAAA,CAAA,CAAA;AAAA,WACzD;AACA,UAAA,iBAAA,CAAkB,IAAI,CAAA,CAAA;AAAA,SACjB,MAAA;AACL,UAAQ,OAAA,CAAA,KAAA,CAAM,UAAU,CAAU,OAAA,EAAA,IAAA,CAAA,EAAA,CAAA,CAAA;AAClC,UAAA,CAAA,EAAA,GAAA,IAAA,CAAK,OAAQ,CAAA,aAAA,KAAb,IAA4B,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA,CAAa,SAAS,IAAK,CAAA,OAAA,CAAA,CAAA;AAAA,SACzD;AAAA,OACF;AAAA,KACF;AAAA,IACA,~~EAAC~~;AAAA,~~GACH~~,CAAA;AACA,EAAA,MAAM,gBAAmB,GAAAA,iBAAA;AAAA,IACvB,CAAC,IAAA,EAA0B,IAAc,EAAA,aAAA,GAAgB,KAAU,KAAA;~~AA5EvE~~,MAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;~~AA6EM~~,MAAM,MAAA,CAAC,OAAS,EAAA,OAAO,CAAI,GAAA,OAAA,CAAA;AAC3B,MAA0B,yBAAA,EAAA,CAAA;AAC1B,MAAA,IAAI,aAAe,EAAA;AACjB,QAAA,IAAI,cAAc,OAAS,EAAA;AACzB,UAAa,YAAA,EAAA,CAAA;AAEb,UAAQ,OAAA,CAAA,KAAA,CAAM,UAAU,CAAU,OAAA,EAAA,IAAA,CAAA,EAAA,CAAA,CAAA;AAClC,UAAA,OAAA,CAAQ,MAAM,OAAU,GAAA,~~CAAA~~,~~UAAA,~~CAAA~~,CAAA~~;AAExB,UAAK,CAAA,EAAA,GAAA,IAAA,CAAA,OAAA,CAAQ,kBAAb,IAA4B,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA;AAAA,YAC1B,OAAA;AAAA,YACA,KAAK,OAAQ,CAAA,sBAAA;AAAA,WAAA,CAAA;AAEf,UAAK,CAAA,EAAA,GAAA,IAAA,CAAA,OAAA,CAAQ,kBAAb,IAA4B,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA;AAAA,YAC1B,OAAA;AAAA,YACA,KAAK,OAAQ,CAAA,kBAAA;AAAA,WAAA,CAAA;AAAA,SAEV,MAAA;AACL,UAAK,CAAA,EAAA,GAAA,IAAA,CAAA,OAAA,CAAQ,kBAAb,IAA4B,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA;AAAA,YAC1B,OAAA;AAAA,YACA,KAAK,OAAQ,CAAA,kBAAA;AAAA,WAAA,CAAA;AAAA,SAEjB;AACA,QAAA,iBAAA,CAAkB,IAAI,CAAA,CAAA;AAAA,OACjB,MAAA;AACL,QAAQ,OAAA,CAAA,KAAA,CAAM,UAAU,CAAU,OAAA,EAAA,IAAA,CAAA,EAAA,CAAA,CAAA;AAClC,QAAK,CAAA,EAAA,GAAA,IAAA,CAAA,OAAA,CAAQ,kBAAb,IAA4B,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA;AAAA,UAC1B,OAAA;AAAA,UACA,KAAK,OAAQ,CAAA,kBAAA;AAAA,SAAA,CAAA;AAAA,OAEjB;AAAA,KACF;AAAA,IACA,~~EAAC~~;AAAA,~~GACH~~,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,YAAA;AAAA,IACA,gBAAA;AAAA,IACA,YAAA;AAAA,GACF,CAAA;AACF;;;;"}
1	+ {"version":3,"file":"useDragSpacers.js","sources":["../src/tabs/drag-drop/useDragSpacers.ts"],"sourcesContent":["import { useCallback, useMemo, useRef } from \"react\";\nimport { createDragSpacer } from \"./Draggable\";\nimport type { MeasuredDropTarget } from \"./drag-utils\";\nimport type { Direction } from \"./dragDropTypes\";\n\nexport const useDragSpacers = () => {\n const animationFrame = useRef(0);\n const transitioning = useRef(false);\n\n const spacers = useMemo(\n // We only need to listen for transition end on one of the spacers\n () => [createDragSpacer(transitioning), createDragSpacer()],\n [],\n );\n\n const clearSpacers = useCallback(\n () =>\n spacers.forEach((spacer) => spacer.parentElement?.removeChild(spacer)),\n [spacers],\n );\n\n const animateTransition = useCallback(\n (size: number) => {\n const [spacer1, spacer2] = spacers;\n animationFrame.current = requestAnimationFrame(() => {\n transitioning.current = true;\n spacer1.style.cssText = \"width: 0px\";\n spacer2.style.cssText = `width: ${size}px`;\n spacers[0] = spacer2;\n spacers[1] = spacer1;\n });\n },\n [spacers],\n );\n\n const cancelAnyPendingAnimation = useCallback(() => {\n if (animationFrame.current) {\n cancelAnimationFrame(animationFrame.current);\n animationFrame.current = 0;\n }\n }, []);\n\n const displaceItem = useCallback(\n (\n item: MeasuredDropTarget \| null,\n size: number,\n useTransition = false,\n direction?: Direction,\n ) => {\n if (item) {\n const [spacer1, spacer2] = spacers;\n cancelAnyPendingAnimation();\n if (useTransition) {\n if (transitioning.current) {\n clearSpacers();\n\n spacer1.style.cssText = `width: ${size}px`;\n spacer2.style.cssText = \"width: 0px\";\n\n const target =\n direction === \"fwd\"\n ? item.element.previousElementSibling\n : item.element.nextElementSibling;\n\n item.element.parentElement?.insertBefore(spacer1, target);\n item.element.parentElement?.insertBefore(spacer2, item.element);\n } else {\n item.element.parentElement?.insertBefore(spacer2, item.element);\n }\n animateTransition(size);\n } else {\n spacer1.style.cssText = `width: ${size}px`;\n item.element.parentElement?.insertBefore(spacer1, item.element);\n }\n }\n },\n [animateTransition, cancelAnyPendingAnimation, clearSpacers, spacers],\n );\n const displaceLastItem = useCallback(\n (item: MeasuredDropTarget, size: number, useTransition = false) => {\n const [spacer1, spacer2] = spacers;\n cancelAnyPendingAnimation();\n if (useTransition) {\n if (transitioning.current) {\n clearSpacers();\n\n spacer1.style.cssText = `width: ${size}px`;\n spacer2.style.cssText = \"width: 0px\";\n\n item.element.parentElement?.insertBefore(\n spacer1,\n item.element.previousElementSibling,\n );\n item.element.parentElement?.insertBefore(\n spacer2,\n item.element.nextElementSibling,\n );\n } else {\n item.element.parentElement?.insertBefore(\n spacer2,\n item.element.nextElementSibling,\n );\n }\n animateTransition(size);\n } else {\n spacer1.style.cssText = `width: ${size}px`;\n item.element.parentElement?.insertBefore(\n spacer1,\n item.element.nextElementSibling,\n );\n }\n },\n [animateTransition, cancelAnyPendingAnimation, clearSpacers, spacers],\n );\n\n return {\n displaceItem,\n displaceLastItem,\n clearSpacers,\n };\n};\n"],"names":["useRef","useMemo","createDragSpacer","useCallback"],"mappings":"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"}

package/dist-cjs/tabs/useActivationIndicator.js CHANGED Viewed

@@ -50,7 +50,7 @@ function useActivationIndicator({
       }
       return {};
     },
-    [orientation, rootRef]
+    [rootRef, getTabPos]
   );
   const onResize = React.useCallback(() => {
     requestAnimationFrame(() => {
@@ -69,7 +69,8 @@ function useActivationIndicator({
         const tabEl = document.getElementById(tabId);
         const { hasChanged, ...newStyle } = createIndicatorStyle(tabEl);
         if (hasChanged) {
-          setStyle(styleRef.current = newStyle);
+          styleRef.current = newStyle;
+          setStyle(newStyle);
         }
       }, 50);
     }