@dynatrace/strato-components 3.6.0 → 3.7.1

package/esm/tables/DataTable/features/ColumnOrder/ColumnOrderDragAndDropContext.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/tables/DataTable/features/ColumnOrder/ColumnOrderDragAndDropContext.tsx"],
-  "sourcesContent": ["import {\n  type Active,\n  DndContext as DragAndDropContext,\n  type DragOverEvent,\n  DragOverlay,\n  MouseSensor,\n  type Over,\n  TouchSensor,\n  useSensor,\n  useSensors,\n} from '@dnd-kit/core';\nimport clsx from 'clsx';\nimport {\n  type JSX,\n  type ReactNode,\n  type RefObject,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport {\n  createHeaderPlaceholder,\n  createRestrictColumnDragAndDrop,\n  customCollisionDetection,\n  getCustomScrollSpeed,\n  getDraggableAreaBounds,\n  getDraggedHeaderElement,\n  indicateInsertPosition,\n  SCROLL_PROXIMITY_ZONE,\n  unpinnedHeaderFilter,\n  updateColumnOrderOnDragEnd,\n} from './column-order-dnd-utils.js';\nimport * as styles from './ColumnOrder.sty.js';\nimport { getDataTableBorderWidth } from '../../../utils/data-table-border-width.js';\nimport { useDataTable } from '../../contexts/DataTableContext.js';\nimport type { Column } from '../../hooks/useTable/types.js';\n\nconst DRAGGED_HEADER_DEFAULT_WIDTH = 100;\nconst DRAGGED_HEADER_DEFAULT_HEIGHT = 37;\n\nexport function ColumnOrderDragAndDropContext({\n  children,\n}: Readonly<{\n  children: ReactNode;\n}>): JSX.Element {\n  const table = useDataTable();\n  const totalHeaderHeight = table.getTotalHeaderHeight();\n  const visualVariantOptions = table.getVisualVariantOptions();\n  const containedVariant = visualVariantOptions.contained;\n  const hasSubHeaders = table.getHeaderGroups().length > 1;\n  const verticalDividers =\n    visualVariantOptions.verticalDividers || hasSubHeaders;\n  const isColumnPinningEnabled = table.options.enableColumnPinning;\n  const pinnedColumns = table.getState().columnPinning;\n\n  const virtualizationContainer = table.getRowVirtualizationContainer();\n  const [dragOverlayContent, setDragOverlayContent] =\n    useState<RefObject<HTMLDivElement> | null>(null);\n  // relevant only if column pinning is enabled\n  const pinnedDraggableAreaBoundsRef = useRef<\n    ReturnType<typeof getDraggableAreaBounds>\n  >({ left: undefined, right: undefined });\n  const [draggedHeaderSize, setDraggedHeaderSize] = useState<{\n    width: number;\n    height: number;\n  }>({\n    width: DRAGGED_HEADER_DEFAULT_WIDTH,\n    height: DRAGGED_HEADER_DEFAULT_HEIGHT,\n  });\n\n  const sensors = useSensors(\n    useSensor(MouseSensor, {}),\n    useSensor(TouchSensor, {}),\n  );\n\n  const restrictColumnDragAndDrop = useMemo(\n    () =>\n      createRestrictColumnDragAndDrop(\n        totalHeaderHeight,\n        containedVariant,\n        pinnedColumns,\n        hasSubHeaders,\n        virtualizationContainer,\n      ),\n    [\n      totalHeaderHeight,\n      virtualizationContainer,\n      containedVariant,\n      pinnedColumns,\n      hasSubHeaders,\n    ],\n  );\n\n  const placeholderElement = useRef<HTMLElement | null>(null);\n\n  // Since we disable autoScroll when column pinning is enabled, we drive scrolling from\n  // a continuous RAF(requestAnimationFrame) loop. Using a ref prevents scroll updates from causing re-renders.\n  const scrollFrameRef = useRef<number | null>(null);\n\n  // Track raw pointer position to determine scroll direction.\n  // Using a pointermove listener (rather than dnd-kit's `delta`) is necessary\n  // because dnd-kit adds scroll compensation to `delta.x` as the container\n  // scrolls, which would cause the right-scroll zone to never exit.\n  // relevant only if column pinning is enabled\n  const pointerXRef = useRef<number>(0);\n  const trackPointerXRef = useRef<((e: PointerEvent) => void) | null>(null);\n  // hold the parent header DOM element when dragging a child column so the scroll loop\n  // can check whether the parent is already fully visible and there's no need for scrolling\n  const parentHeaderElementRef = useRef<HTMLElement | null>(null);\n\n  const stopScrollLoop = useCallback(() => {\n    if (scrollFrameRef.current !== null) {\n      cancelAnimationFrame(scrollFrameRef.current);\n      scrollFrameRef.current = null;\n    }\n  }, []);\n\n  const startScrollLoop = useCallback(() => {\n    if (scrollFrameRef.current !== null) {\n      return;\n    }\n\n    const loop = () => {\n      if (!virtualizationContainer) {\n        scrollFrameRef.current = null;\n        return;\n      }\n\n      // Read pointer position fresh every frame. RAF callbacks always run after\n      // all pending input events (including pointermove) have been processed,\n      // so pointerXRef.current is guaranteed to hold the latest position here.\n      const mouseX = pointerXRef.current;\n      const containerRect = virtualizationContainer.getBoundingClientRect();\n      const rightBound =\n        pinnedDraggableAreaBoundsRef.current.right ?? containerRect.right;\n      const leftBound =\n        pinnedDraggableAreaBoundsRef.current.left ?? containerRect.left;\n\n      // Positive penetration means the cursor has entered the proximity zone.\n      // Zero or negative means it is safely away from that boundary.\n      const rightPenetration = mouseX - (rightBound - SCROLL_PROXIMITY_ZONE);\n      const leftPenetration = leftBound + SCROLL_PROXIMITY_ZONE - mouseX;\n\n      const { scrollLeft, scrollWidth, clientWidth } = virtualizationContainer;\n\n      // When a child column is being dragged, scrolling should be capped only until the parent header becomes fully visible.\n      // if the parent is already fully visible, skip scrolling entirely.\n      let maxScrollRight = Infinity;\n      let maxScrollLeft = Infinity;\n\n      const parentEl = parentHeaderElementRef.current;\n      if (parentEl) {\n        const parentRect = parentEl.getBoundingClientRect();\n\n        // many pixels the parent overflows past the right / left bound.\n        maxScrollRight = Math.max(0, parentRect.right - rightBound);\n        maxScrollLeft = Math.max(0, leftBound - parentRect.left);\n      }\n\n      if (rightPenetration > 0 && leftPenetration <= 0) {\n        // Scale speed linearly from MIN at zone entry to MAX at the boundary.\n        const scrollSpeed = getCustomScrollSpeed(rightPenetration);\n\n        const canScrollRight = scrollLeft < scrollWidth - clientWidth;\n        if (canScrollRight && maxScrollRight > 0) {\n          // the RAF loop keeps scheduling the next frame as long as maxScrollRight > speed. Same for right scroll.\n          virtualizationContainer.scrollLeft += Math.min(\n            scrollSpeed,\n            Math.ceil(maxScrollRight),\n          );\n        }\n      } else if (leftPenetration > 0 && rightPenetration <= 0) {\n        const scrollSpeed = getCustomScrollSpeed(leftPenetration);\n\n        const canScrollLeft = scrollLeft > 0;\n        if (canScrollLeft && maxScrollLeft > 0) {\n          virtualizationContainer.scrollLeft -= Math.min(\n            scrollSpeed,\n            Math.ceil(maxScrollLeft),\n          );\n        }\n      }\n\n      scrollFrameRef.current = requestAnimationFrame(loop);\n    };\n\n    scrollFrameRef.current = requestAnimationFrame(loop);\n  }, [virtualizationContainer]);\n\n  const cleanupDragState = useCallback(() => {\n    stopScrollLoop();\n    parentHeaderElementRef.current = null;\n    if (trackPointerXRef.current) {\n      window.removeEventListener('pointermove', trackPointerXRef.current);\n      trackPointerXRef.current = null;\n    }\n  }, [stopScrollLoop]);\n\n  const handleDragStart = ({ active }: { active: Active }) => {\n    const draggedColumn = active.data.current?.column as Column<\n      unknown,\n      unknown\n    >;\n\n    // Read bounds fresh from the DOM on every drag start event so they always reflect\n    // the current scroll position and are never stale from an earlier render.\n    if (isColumnPinningEnabled) {\n      pinnedDraggableAreaBoundsRef.current = getDraggableAreaBounds(\n        pinnedColumns,\n        virtualizationContainer,\n        hasSubHeaders ? 1 : 0,\n      );\n\n      // Start tracking raw pointer position for scroll zone detection.\n      trackPointerXRef.current = (e: PointerEvent) => {\n        pointerXRef.current = e.clientX;\n      };\n      window.addEventListener('pointermove', trackPointerXRef.current, {\n        passive: true,\n      });\n      // If the dragged column is a child, store its parent header element so\n      // the scroll loop can cap scrolling to keep the parent fully visible.\n      if (draggedColumn.parent) {\n        const parentId = draggedColumn.parent.id;\n        parentHeaderElementRef.current =\n          virtualizationContainer?.querySelector<HTMLElement>(\n            `[role=\"columnheader\"][data-header-row=\"0\"][data-columnid=${CSS.escape(\n              parentId,\n            )}]${unpinnedHeaderFilter}`,\n          ) ?? null;\n      }\n\n      // Start the RAF loop immediately so proximity-zone entry is detected on\n      // every frame regardless of when onDragMove fires relative to pointermove.\n      startScrollLoop();\n    }\n\n    table.setDraggedHeaderColumn(draggedColumn);\n    setDraggedHeaderSize(table.getHeaderSize(active.id as string));\n    setDragOverlayContent(active.data.current?.portalRef);\n\n    // In order to make sure the header size does not change when the header\n    // is portalled out, we create a placeholder element in the header in order\n    // to preserve the grid layout\n    const { headerGroupElement, draggedHeaderElement } =\n      getDraggedHeaderElement(String(active.id), virtualizationContainer);\n\n    if (\n      headerGroupElement === null ||\n      !(headerGroupElement instanceof HTMLElement)\n    ) {\n      return;\n    }\n\n    if (\n      draggedHeaderElement === null ||\n      !(draggedHeaderElement instanceof HTMLElement)\n    ) {\n      return;\n    }\n\n    // Extract the position of the dragged element and its size in order\n    // to position the placeholder.\n    const { gridArea } = draggedHeaderElement.style;\n    const { width, height } = draggedHeaderElement.getBoundingClientRect();\n    if (!gridArea) {\n      return;\n    }\n\n    const verticalDividerOptions =\n      verticalDividers && !draggedColumn.getIsFirstVisibleUnpinnedColumn()\n        ? {\n            isParentColumn:\n              draggedHeaderElement.getAttribute('data-header-row') === '0',\n            heightOffset:\n              headerGroupElement.offsetHeight -\n              draggedHeaderElement.offsetHeight,\n          }\n        : undefined;\n\n    placeholderElement.current = createHeaderPlaceholder(\n      gridArea,\n      width,\n      height,\n      verticalDividerOptions,\n    );\n    headerGroupElement.appendChild(placeholderElement.current);\n  };\n\n  const handleDragOver = (event: DragOverEvent) => {\n    indicateInsertPosition(event, virtualizationContainer);\n  };\n\n  const handleDragEnd = ({\n    active,\n    over,\n  }: {\n    active: Active;\n    over: Over | null;\n  }) => {\n    setDragOverlayContent(null);\n    cleanupDragState();\n    updateColumnOrderOnDragEnd({\n      active,\n      over,\n      table,\n      virtualizationContainer,\n    });\n    // with nested headers, removing the placeholder element too early could lead to wrong header measurements\n    // therefore, the placeholder is removed just before the next repaint\n    requestAnimationFrame(() => {\n      placeholderElement.current?.remove();\n    });\n  };\n\n  // Clean up the RAF scroll loop and the global pointermove listener if\n  // the component unmounts during an active drag (e.g. the table is removed\n  // from the DOM), since handleDragEnd would never fire in that case.\n  useEffect(() => {\n    return () => {\n      cleanupDragState();\n      placeholderElement.current?.remove();\n    };\n  }, [stopScrollLoop, cleanupDragState]);\n\n  return (\n    <DragAndDropContext\n      sensors={sensors}\n      collisionDetection={customCollisionDetection}\n      modifiers={[restrictColumnDragAndDrop]}\n      autoScroll={!isColumnPinningEnabled}\n      accessibility={{ container: table.getRowVirtualizationContainer() }}\n      onDragStart={handleDragStart}\n      onDragOver={handleDragOver}\n      onDragEnd={handleDragEnd}\n    >\n      {\n        // We need to portal the drag and drop overlay to escape CSS transforms on ancestor elements.\n        // This ensures transforms on parent containers don't affect the position of the drag overlay.\n        createPortal(\n          <DragOverlay\n            data-drag-overlay\n            dropAnimation={null}\n            className={clsx(styles.columnDndOverlay)}\n            style={{\n              // the observed header size includes a border which we don't want in the overlay\n              height: draggedHeaderSize.height - getDataTableBorderWidth(),\n              width: draggedHeaderSize.width,\n            }}\n          >\n            <div ref={dragOverlayContent} />\n          </DragOverlay>,\n          document.body,\n        )\n      }\n      {children}\n    </DragAndDropContext>\n  );\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n  type Active,\n  DndContext as DragAndDropContext,\n  type DragOverEvent,\n  DragOverlay,\n  MouseSensor,\n  type Over,\n  TouchSensor,\n  useSensor,\n  useSensors,\n} from '@dnd-kit/core';\nimport type { RowData, Column } from '@tanstack/react-table';\nimport clsx from 'clsx';\nimport {\n  type JSX,\n  type ReactNode,\n  type RefObject,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport {\n  createHeaderPlaceholder,\n  createRestrictColumnDragAndDrop,\n  customCollisionDetection,\n  getCustomScrollSpeed,\n  getDraggableAreaBounds,\n  getDraggedHeaderElement,\n  indicateInsertPosition,\n  SCROLL_PROXIMITY_ZONE,\n  unpinnedHeaderFilter,\n  updateColumnOrderOnDragEnd,\n} from './column-order-dnd-utils.js';\nimport * as styles from './ColumnOrder.sty.js';\nimport { getDataTableBorderWidth } from '../../../utils/data-table-border-width.js';\nimport { useDataTable } from '../../contexts/DataTableContext.js';\nimport type { TDataTableFeatures } from '../types/features.types.js';\n\nconst DRAGGED_HEADER_DEFAULT_WIDTH = 100;\nconst DRAGGED_HEADER_DEFAULT_HEIGHT = 37;\n\nexport function ColumnOrderDragAndDropContext<TData extends RowData>({\n  children,\n}: Readonly<{\n  children: ReactNode;\n}>): JSX.Element {\n  const table = useDataTable();\n  const totalHeaderHeight = table.getTotalHeaderHeight();\n  const visualVariantConfig = table.atoms.visualVariantConfig?.get();\n  const containedVariant = visualVariantConfig.contained;\n  const hasSubHeaders = table.getHeaderGroups().length > 1;\n  const verticalDividers =\n    visualVariantConfig.verticalDividers || hasSubHeaders;\n  const pinnedColumns = table.atoms.columnPinning?.get();\n\n  const virtualizationContainer = table.getRowVirtualizationContainer();\n  const [dragOverlayContent, setDragOverlayContent] =\n    useState<RefObject<HTMLDivElement> | null>(null);\n  const pinnedDraggableAreaBoundsRef = useRef<\n    ReturnType<typeof getDraggableAreaBounds>\n  >({ left: undefined, right: undefined });\n  const [draggedHeaderSize, setDraggedHeaderSize] = useState<{\n    width: number;\n    height: number;\n  }>({\n    width: DRAGGED_HEADER_DEFAULT_WIDTH,\n    height: DRAGGED_HEADER_DEFAULT_HEIGHT,\n  });\n\n  const sensors = useSensors(\n    useSensor(MouseSensor, {}),\n    useSensor(TouchSensor, {}),\n  );\n\n  const restrictColumnDragAndDrop = useMemo(\n    () =>\n      createRestrictColumnDragAndDrop(\n        totalHeaderHeight,\n        containedVariant,\n        pinnedColumns ?? { left: [], right: [] },\n        hasSubHeaders,\n        virtualizationContainer,\n      ),\n    [\n      totalHeaderHeight,\n      virtualizationContainer,\n      containedVariant,\n      pinnedColumns,\n      hasSubHeaders,\n    ],\n  );\n\n  const placeholderElement = useRef<HTMLElement | null>(null);\n\n  // We drive scrolling from a continuous RAF (requestAnimationFrame) loop instead of\n  // dnd-kit's built-in autoScroll. Using a ref prevents scroll updates from causing re-renders.\n  const scrollFrameRef = useRef<number | null>(null);\n\n  // Track raw pointer position to determine scroll direction.\n  // Using a pointermove listener (rather than dnd-kit's `delta`) is necessary\n  // because dnd-kit adds scroll compensation to `delta.x` as the container\n  // scrolls, which would cause the right-scroll zone to never exit.\n  const pointerXRef = useRef<number>(0);\n  const trackPointerXRef = useRef<((e: PointerEvent) => void) | null>(null);\n  // hold the parent header DOM element when dragging a child column so the scroll loop\n  // can check whether the parent is already fully visible and there's no need for scrolling\n  const parentHeaderElementRef = useRef<HTMLElement | null>(null);\n\n  const stopScrollLoop = useCallback(() => {\n    if (scrollFrameRef.current !== null) {\n      cancelAnimationFrame(scrollFrameRef.current);\n      scrollFrameRef.current = null;\n    }\n  }, []);\n\n  const startScrollLoop = useCallback(() => {\n    if (scrollFrameRef.current !== null) {\n      return;\n    }\n\n    const loop = () => {\n      if (!virtualizationContainer) {\n        scrollFrameRef.current = null;\n        return;\n      }\n\n      // Read pointer position fresh every frame. RAF callbacks always run after\n      // all pending input events (including pointermove) have been processed,\n      // so pointerXRef.current is guaranteed to hold the latest position here.\n      const mouseX = pointerXRef.current;\n      const containerRect = virtualizationContainer.getBoundingClientRect();\n      const rightBound =\n        pinnedDraggableAreaBoundsRef.current.right ?? containerRect.right;\n      const leftBound =\n        pinnedDraggableAreaBoundsRef.current.left ?? containerRect.left;\n\n      // Positive penetration means the cursor has entered the proximity zone.\n      // Zero or negative means it is safely away from that boundary.\n      const rightPenetration = mouseX - (rightBound - SCROLL_PROXIMITY_ZONE);\n      const leftPenetration = leftBound + SCROLL_PROXIMITY_ZONE - mouseX;\n\n      const { scrollLeft, scrollWidth, clientWidth } = virtualizationContainer;\n\n      // When a child column is being dragged, scrolling should be capped only until the parent header becomes fully visible.\n      // if the parent is already fully visible, skip scrolling entirely.\n      let maxScrollRight = Infinity;\n      let maxScrollLeft = Infinity;\n\n      const parentEl = parentHeaderElementRef.current;\n      if (parentEl) {\n        const parentRect = parentEl.getBoundingClientRect();\n\n        // many pixels the parent overflows past the right / left bound.\n        maxScrollRight = Math.max(0, parentRect.right - rightBound);\n        maxScrollLeft = Math.max(0, leftBound - parentRect.left);\n      }\n\n      if (rightPenetration > 0 && leftPenetration <= 0) {\n        // Scale speed linearly from MIN at zone entry to MAX at the boundary.\n        const scrollSpeed = getCustomScrollSpeed(rightPenetration);\n\n        const canScrollRight = scrollLeft < scrollWidth - clientWidth;\n        if (canScrollRight && maxScrollRight > 0) {\n          // the RAF loop keeps scheduling the next frame as long as maxScrollRight > speed. Same for right scroll.\n          virtualizationContainer.scrollLeft += Math.min(\n            scrollSpeed,\n            Math.ceil(maxScrollRight),\n          );\n        }\n      } else if (leftPenetration > 0 && rightPenetration <= 0) {\n        const scrollSpeed = getCustomScrollSpeed(leftPenetration);\n\n        const canScrollLeft = scrollLeft > 0;\n        if (canScrollLeft && maxScrollLeft > 0) {\n          virtualizationContainer.scrollLeft -= Math.min(\n            scrollSpeed,\n            Math.ceil(maxScrollLeft),\n          );\n        }\n      }\n\n      scrollFrameRef.current = requestAnimationFrame(loop);\n    };\n\n    scrollFrameRef.current = requestAnimationFrame(loop);\n  }, [virtualizationContainer]);\n\n  const cleanupDragState = useCallback(() => {\n    stopScrollLoop();\n    parentHeaderElementRef.current = null;\n    if (trackPointerXRef.current) {\n      window.removeEventListener('pointermove', trackPointerXRef.current);\n      trackPointerXRef.current = null;\n    }\n  }, [stopScrollLoop]);\n\n  const handleDragStart = ({ active }: { active: Active }) => {\n    const draggedColumn = active.data.current?.column as Column<\n      TDataTableFeatures,\n      TData\n    >;\n\n    // Browsers can scroll the page when initiating a native drag. Capture the current\n    // scroll position and restore it in the next frame to cancel any unintended jump.\n    const pageScrollY = window.scrollY;\n    requestAnimationFrame(() => {\n      if (window.scrollY !== pageScrollY) {\n        window.scrollTo(window.scrollX, pageScrollY);\n      }\n    });\n\n    // Read bounds fresh from the DOM on every drag start event so they always reflect\n    // the current scroll position and are never stale from an earlier render.\n    pinnedDraggableAreaBoundsRef.current = getDraggableAreaBounds(\n      pinnedColumns,\n      virtualizationContainer,\n      hasSubHeaders ? 1 : 0,\n    );\n\n    // Start tracking raw pointer position for scroll zone detection.\n    trackPointerXRef.current = (e: PointerEvent) => {\n      pointerXRef.current = e.clientX;\n    };\n    window.addEventListener('pointermove', trackPointerXRef.current, {\n      passive: true,\n    });\n    // If the dragged column is a child, store its parent header element so\n    // the scroll loop can cap scrolling to keep the parent fully visible.\n    if (draggedColumn.parent) {\n      const parentId = draggedColumn.parent.id;\n      parentHeaderElementRef.current =\n        virtualizationContainer?.querySelector<HTMLElement>(\n          `[role=\"columnheader\"][data-header-row=\"0\"][data-columnid=${CSS.escape(\n            parentId,\n          )}]${unpinnedHeaderFilter}`,\n        ) ?? null;\n    }\n\n    // Start the RAF loop immediately so proximity-zone entry is detected on\n    // every frame regardless of when onDragMove fires relative to pointermove.\n    startScrollLoop();\n\n    table.setDraggedHeaderColumn(draggedColumn);\n    setDraggedHeaderSize(table.getHeaderSize(active.id as string));\n    setDragOverlayContent(active.data.current?.portalRef);\n\n    // In order to make sure the header size does not change when the header\n    // is portalled out, we create a placeholder element in the header in order\n    // to preserve the grid layout\n    const { headerGroupElement, draggedHeaderElement } =\n      getDraggedHeaderElement(String(active.id), virtualizationContainer);\n\n    if (\n      headerGroupElement === null ||\n      !(headerGroupElement instanceof HTMLElement)\n    ) {\n      return;\n    }\n\n    if (\n      draggedHeaderElement === null ||\n      !(draggedHeaderElement instanceof HTMLElement)\n    ) {\n      return;\n    }\n\n    // Extract the position of the dragged element and its size in order\n    // to position the placeholder.\n    const { gridArea } = draggedHeaderElement.style;\n    const { width, height } = draggedHeaderElement.getBoundingClientRect();\n    if (!gridArea) {\n      return;\n    }\n\n    const verticalDividerOptions =\n      verticalDividers && !draggedColumn.getIsFirstVisibleUnpinnedColumn()\n        ? {\n            isParentColumn:\n              draggedHeaderElement.getAttribute('data-header-row') === '0',\n            heightOffset:\n              headerGroupElement.offsetHeight -\n              draggedHeaderElement.offsetHeight,\n          }\n        : undefined;\n\n    placeholderElement.current = createHeaderPlaceholder(\n      gridArea,\n      width,\n      height,\n      verticalDividerOptions,\n    );\n    headerGroupElement.appendChild(placeholderElement.current);\n  };\n\n  const handleDragOver = (event: DragOverEvent) => {\n    indicateInsertPosition(event, virtualizationContainer);\n  };\n\n  const handleDragEnd = ({\n    active,\n    over,\n  }: {\n    active: Active;\n    over: Over | null;\n  }) => {\n    setDragOverlayContent(null);\n    cleanupDragState();\n    updateColumnOrderOnDragEnd({\n      active,\n      over,\n      table,\n      virtualizationContainer,\n    });\n    // with nested headers, removing the placeholder element too early could lead to wrong header measurements\n    // therefore, the placeholder is removed just before the next repaint\n    requestAnimationFrame(() => {\n      placeholderElement.current?.remove();\n    });\n  };\n\n  // Clean up the RAF scroll loop and the global pointermove listener if\n  // the component unmounts during an active drag (e.g. the table is removed\n  // from the DOM), since handleDragEnd would never fire in that case.\n  useEffect(() => {\n    return () => {\n      cleanupDragState();\n      placeholderElement.current?.remove();\n    };\n  }, [stopScrollLoop, cleanupDragState]);\n\n  return (\n    <DragAndDropContext\n      sensors={sensors}\n      collisionDetection={customCollisionDetection}\n      modifiers={[restrictColumnDragAndDrop]}\n      autoScroll={false}\n      accessibility={{ container: table.getRowVirtualizationContainer() }}\n      onDragStart={handleDragStart}\n      onDragOver={handleDragOver}\n      onDragEnd={handleDragEnd}\n    >\n      {\n        // We need to portal the drag and drop overlay to escape CSS transforms on ancestor elements.\n        // This ensures transforms on parent containers don't affect the position of the drag overlay.\n        createPortal(\n          <DragOverlay\n            data-drag-overlay\n            dropAnimation={null}\n            className={clsx(styles.columnDndOverlay)}\n            style={{\n              // the observed header size includes a border which we don't want in the overlay\n              height: draggedHeaderSize.height - getDataTableBorderWidth(),\n              width: draggedHeaderSize.width,\n            }}\n          >\n            <div ref={dragOverlayContent} />\n          </DragOverlay>,\n          document.body,\n        )\n      }\n      {children}\n    </DragAndDropContext>\n  );\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/tables/DataTable/features/ColumnOrder/column-order-dnd-utils.js

@@ -20,12 +20,8 @@ function isDragMotion(touchMove, touchStart) {
   const touchMoveX = touchMove.touches[0].clientX;
   return Math.abs(touchMoveX - touchStartX) > TOUCH_DRAG_MOTION_THRESHOLD;
 }
-const updateColumnOrderOnDragEnd = ({
-  active,
-  over,
-  table,
-  virtualizationContainer
-}) => {
+function updateColumnOrderOnDragEnd(config) {
+  const { active, over, virtualizationContainer } = config;
   if (over === null || active.data.current === void 0 || over.data.current === void 0 || virtualizationContainer === void 0) {
     return;
   }
@@ -38,7 +34,7 @@ const updateColumnOrderOnDragEnd = ({
   const overChildColumnIds = overColumn.columns.map((child) => child.id);
   const overChildColumnsCount = overChildColumnIds.length;
   if (activeParentColumnId === overParentColumnId) {
-    const columnOrder = table.getState().columnOrder;
+    const columnOrder = config.table.atoms.columnOrder?.get() ?? [];
     const moveCount = Math.max(activeChildColumnsCount, 1);
     const activeColumnIndex = columnOrder.findIndex((columnId) => {
       const id = activeChildColumnsCount === 0 ? activeColumn.id : (
@@ -58,11 +54,11 @@ const updateColumnOrderOnDragEnd = ({
     const movedColumns = newColumnOrder.splice(activeColumnIndex, moveCount);
     const toIndex = overColumnIndex > activeColumnIndex ? overColumnIndex - (moveCount - 1) : overColumnIndex;
     newColumnOrder.splice(toIndex, 0, ...movedColumns);
-    table.setColumnOrder(newColumnOrder);
+    config.table.setColumnOrder(newColumnOrder);
   }
-  table.setDraggedHeaderColumn(void 0);
+  config.table.setDraggedHeaderColumn(null);
   removeInsertPositionIndicator(lastStyledCells, virtualizationContainer, true);
-};
+}
 const getCustomScrollSpeed = (scrollZoneDepth) => {
   return Math.round(
     MIN_SCROLL_SPEED + Math.min(scrollZoneDepth, SCROLL_PROXIMITY_ZONE) / SCROLL_PROXIMITY_ZONE * (MAX_SCROLL_SPEED - MIN_SCROLL_SPEED)
@@ -91,7 +87,9 @@ function indicateInsertPosition(event, virtualizationContainer) {
   const activeColumnIndex = event.active.data.current?.columnIndex;
   const overColumnId = event.over.id;
   const overColumnIndex = event.over.data.current?.columnIndex;
-  const overColumnChildren = (event.over.data.current?.column).getVisibleLeafColumns().filter((child) => !child.getIsPinned());
+  const overColumnChildren = (event.over.data.current?.column).getVisibleLeafColumns().filter(
+    (child) => !child.getIsPinned()
+  );
   const overFirstChildId = overColumnChildren.at(0)?.id;
   const overLastChildId = overColumnChildren.at(-1)?.id;
   if (activeColumnIndex < overColumnIndex) {

package/esm/tables/DataTable/features/ColumnOrder/column-order-dnd-utils.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/tables/DataTable/features/ColumnOrder/column-order-dnd-utils.ts"],
-  "sourcesContent": ["import {\n  type Active,\n  type ClientRect,\n  type CollisionDescriptor,\n  type CollisionDetection,\n  type DragOverEvent,\n  type DroppableContainer,\n  type Modifier,\n  type Over,\n} from '@dnd-kit/core';\nimport type { ColumnPinningState } from '@tanstack/react-table';\nimport { TouchEvent } from 'react';\n\nimport Spacings from '@dynatrace/strato-design-tokens/spacings';\n\nimport * as styles from './ColumnOrder.sty.js';\nimport { getDataTableBorderWidth } from '../../../utils/data-table-border-width.js';\nimport {\n  DATA_TABLE_DEFAULT_MIN_COLUMN_WIDTH,\n  DATA_TABLE_DND_PLACEHOLDER_DIVIDER_CSS_VAR,\n  DATA_TABLE_HORIZONTAL_DIVIDER_HEIGHT,\n} from '../../constants.js';\nimport type {\n  Column,\n  DragAndDropTransform,\n  Table,\n} from '../../hooks/useTable/types.js';\n\n//#region DragAndDrop\n\n// DOM Query for filtering out pinned parent headers\nexport const unpinnedHeaderFilter =\n  ':not([data-headerid*=\"left\"]):not([data-headerid*=\"right\"])';\n// Pixels from the pinned-column boundary at which custom auto-scroll begins.\nexport const SCROLL_PROXIMITY_ZONE = 10;\n/** Offset for column drag-and-drop collision detection (px). */\nconst COLUMN_DND_COLLISION_OFFSET = DATA_TABLE_DEFAULT_MIN_COLUMN_WIDTH / 2 - 1;\n/** Number of pixels above which a touch move event is considered a drag motion. */\nconst TOUCH_DRAG_MOTION_THRESHOLD = 5;\n// Min custom scroll speed (px/frame) applied at the edge of the proximity zone. Start slow, then speed up to max scroll speed.\nconst MIN_SCROLL_SPEED = 3;\n// Max custom scroll speed (px/frame) applied when fully past the boundary. 15 feels smooth, anything above feels too fast and anything below feels too slow.\nconst MAX_SCROLL_SPEED = 15;\n\n/**\n * Determines if the touch interaction is a drag motion.\n *\n * @param touchMove - The current touch move event.\n * @param touchStart - The preceding touch start event.\n * @returns A boolean indicating whether the touch move event is considered a drag motion.\n * @internal\n */\nexport function isDragMotion(\n  touchMove: TouchEvent,\n  touchStart?: TouchEvent,\n): boolean {\n  const touchStartX = touchStart?.touches[0].clientX;\n  if (touchStartX === undefined) {\n    return false;\n  }\n  const touchMoveX = touchMove.touches[0].clientX;\n  return Math.abs(touchMoveX - touchStartX) > TOUCH_DRAG_MOTION_THRESHOLD;\n}\n\n/**\n * Updates the column order state based on the active and over columns.\n *\n * @param active - The actively dragged item.\n * @param over - The droppable item which the active item is currently dragged over.\n * @param table - The table instance.\n * @param virtualizationContainer - The table's virtualization container.\n * @internal\n */\nexport const updateColumnOrderOnDragEnd = ({\n  active,\n  over,\n  table,\n  virtualizationContainer,\n}: {\n  active: Active;\n  over: Over | null;\n  table: Table<unknown>;\n  virtualizationContainer?: HTMLDivElement;\n}): void => {\n  if (\n    over === null ||\n    active.data.current === undefined ||\n    over.data.current === undefined ||\n    virtualizationContainer === undefined\n  ) {\n    return;\n  }\n\n  const activeColumn = active.data.current.column as Column<unknown, unknown>;\n  const activeChildColumnIds = activeColumn.columns.map((child) => child.id);\n  const activeChildColumnsCount = activeChildColumnIds.length;\n  const activeParentColumnId = activeColumn.parent?.id;\n\n  const overColumn = over.data.current.column as Column<unknown, unknown>;\n  const overParentColumnId = over.data.current?.column?.parent?.id;\n  const overChildColumnIds = overColumn.columns.map((child) => child.id);\n  const overChildColumnsCount = overChildColumnIds.length;\n\n  // move columns if both columns have the same parent or no parent\n  if (activeParentColumnId === overParentColumnId) {\n    const columnOrder = table.getState().columnOrder;\n    const moveCount = Math.max(activeChildColumnsCount, 1);\n\n    // get the active and over columns' indexes in the unmodified column order to consider hidden columns during reordering\n    const activeColumnIndex = columnOrder.findIndex((columnId) => {\n      const id =\n        activeChildColumnsCount === 0\n          ? activeColumn.id\n          : // get the index of the first child column if the active column is a parent\n            activeColumn.getLeafColumns()[0].id;\n\n      return columnId === id;\n    });\n    const overColumnIndex = columnOrder.findIndex((columnId) => {\n      const id =\n        overChildColumnsCount === 0\n          ? overColumn.id\n          : // get the index of the first child column if the active column is a parent\n            overColumn.getLeafColumns()[0].id;\n      return columnId === id;\n    });\n\n    // update column order\n    const newColumnOrder = [...columnOrder];\n    const movedColumns = newColumnOrder.splice(activeColumnIndex, moveCount);\n    // if moving more than one column to the right, toIndex needs to be adjusted since more than one column were spliced from the array\n    const toIndex =\n      overColumnIndex > activeColumnIndex\n        ? overColumnIndex - (moveCount - 1)\n        : overColumnIndex;\n\n    newColumnOrder.splice(toIndex, 0, ...movedColumns);\n    table.setColumnOrder(newColumnOrder);\n  }\n\n  table.setDraggedHeaderColumn(undefined);\n  removeInsertPositionIndicator(lastStyledCells, virtualizationContainer, true);\n};\n\n/**\n * Gets the speed for the custom auto scroll used for when column pinning is enabled.\n *\n * @param scrollZoneDepth - the mouse pointer position when penetrating the area where auto scroll should kick in\n *\n * @returns scroll speed measured in pixels per frame, a number between MIN_SCROLL_SPEED and MAX_SCROLL_SPEED\n * @internal\n */\nexport const getCustomScrollSpeed = (scrollZoneDepth: number): number => {\n  return Math.round(\n    MIN_SCROLL_SPEED +\n      (Math.min(scrollZoneDepth, SCROLL_PROXIMITY_ZONE) /\n        SCROLL_PROXIMITY_ZONE) *\n        (MAX_SCROLL_SPEED - MIN_SCROLL_SPEED),\n  );\n};\n\n/**\n * Creates a temporary DOM element that is temporarily inserted into the header group\n * during a drag operation to preserve the CSS grid layout when the dragged header cell is portalled out\n * of its original position.\n *\n * @param gridArea - dragged element's position in the grid\n * @param width - dragged element's width\n * @param height - dragged element's height\n * @param verticalDividerOptions - optional config for the vertical divider styling on the placeholder\n *\n * @internal\n */\nexport const createHeaderPlaceholder = (\n  gridArea: string,\n  width: number,\n  height: number,\n  verticalDividerOptions?: {\n    isParentColumn: boolean;\n    heightOffset: number;\n  },\n): HTMLDivElement => {\n  const placeholder = document.createElement('div');\n  placeholder.style.gridArea = gridArea;\n  placeholder.style.width = `${width}px`;\n  placeholder.style.height = `${height}px`;\n\n  if (verticalDividerOptions) {\n    const { isParentColumn, heightOffset } = verticalDividerOptions;\n    placeholder.classList.add(styles.verticalDividers);\n    placeholder.style.setProperty(\n      DATA_TABLE_DND_PLACEHOLDER_DIVIDER_CSS_VAR,\n      !isParentColumn && heightOffset !== 0\n        ? `${heightOffset}px`\n        : Spacings.Size4,\n    );\n  }\n\n  return placeholder;\n};\n\n//#endregion DragAndDrop\n\n//#region PositionIndicator\n// save the cells that last received the indicator styles to be able to remove them again\nconst lastStyledCells = new Set<HTMLElement>();\n\n/**\n * Transforms columns left/right to make space for the column which is currently being dragged (\"active\" column).\n *\n * @param event - contains \"active\" (column being dragged) and \"over\" columns (column where the active column is currently dragged over).\n * @param virtualizationContainer - The table's virtualization container.\n * @internal\n */\nexport function indicateInsertPosition(\n  event: DragOverEvent,\n  virtualizationContainer?: HTMLDivElement,\n): void {\n  if (virtualizationContainer === undefined || !event.active || !event.over) {\n    return;\n  }\n\n  const activeColumnIndex = event.active.data.current?.columnIndex;\n  const overColumnId = event.over.id as string;\n  const overColumnIndex = event.over.data.current?.columnIndex;\n\n  // If the over column is a parent, we also need to render the indicator for the first/last unpinned child\n  // depending on whether the active column is moved left or right\n  const overColumnChildren = (\n    event.over.data.current?.column as Column<unknown, unknown>\n  )\n    .getVisibleLeafColumns()\n    .filter((child) => !child.getIsPinned());\n\n  const overFirstChildId = overColumnChildren.at(0)?.id;\n  const overLastChildId = overColumnChildren.at(-1)?.id;\n\n  if (activeColumnIndex < overColumnIndex) {\n    // move right\n    const overChildColumnId =\n      overLastChildId !== overColumnId ? overLastChildId : undefined;\n    renderInsertPositionIndicator(\n      virtualizationContainer,\n      overColumnId,\n      overChildColumnId,\n      'right',\n    );\n  } else if (activeColumnIndex > overColumnIndex) {\n    // move left\n    const overChildColumnId =\n      overFirstChildId !== overColumnId ? overFirstChildId : undefined;\n    renderInsertPositionIndicator(\n      virtualizationContainer,\n      overColumnId,\n      overChildColumnId,\n      'left',\n    );\n  } else {\n    removeInsertPositionIndicator(lastStyledCells);\n  }\n}\n\n/**\n * Renders an indicator at the position where the column will be inserted.\n */\nfunction renderInsertPositionIndicator(\n  virtualizationContainer: HTMLDivElement,\n  columnId: string,\n  childColumnId: string | undefined,\n  position: 'left' | 'right',\n): void {\n  const overCell = getHeaderCell(virtualizationContainer, columnId);\n  if (overCell === null) {\n    return;\n  }\n\n  const overChildColumnCell = getHeaderCell(\n    virtualizationContainer,\n    childColumnId,\n  );\n\n  // remove previous styles\n  removeInsertPositionIndicator(lastStyledCells);\n  // hide resize handles so they don't overlap the indicators\n  const resizeHandles = getResizeHandles(virtualizationContainer);\n  for (const resizeHandle of resizeHandles) {\n    resizeHandle.style.display = 'none';\n  }\n\n  // add indicator after element\n  addPositionIndicatorStyle(overCell, position);\n  lastStyledCells.add(overCell);\n\n  // add indicator also to child column if there is one\n  if (overChildColumnCell) {\n    addPositionIndicatorStyle(overChildColumnCell, position);\n    lastStyledCells.add(overChildColumnCell);\n  }\n}\n\nfunction addPositionIndicatorStyle(\n  elem: HTMLElement,\n  position: 'left' | 'right',\n): void {\n  elem.classList.add(\n    styles.insertPositionIndicator.classNames.base,\n    styles.insertPositionIndicator.classNames.variants.left[\n      position === 'left' ? 'true' : 'false'\n    ],\n  );\n}\n\n/**\n * Removes the insert position indicator from the specified cells.\n */\nfunction removeInsertPositionIndicator(\n  cells: Set<HTMLElement>,\n  virtualizationContainer: HTMLDivElement | undefined = undefined,\n  displayResizeHandles: boolean = false,\n): void {\n  if (cells.size <= 0) {\n    return;\n  }\n\n  if (displayResizeHandles && virtualizationContainer) {\n    const resizeHandles = getResizeHandles(virtualizationContainer);\n    for (const resizeHandle of resizeHandles) {\n      resizeHandle.style.removeProperty('display');\n    }\n  }\n\n  for (const cell of cells) {\n    cell.classList.remove(\n      styles.insertPositionIndicator.classNames.base,\n      styles.insertPositionIndicator.classNames.variants.left.true,\n      styles.insertPositionIndicator.classNames.variants.left.false,\n    );\n    lastStyledCells.delete(cell);\n  }\n}\n\n/**\n * Gets all cells with the given column id.\n * @param virtualizationContainer - The table's virtualization container.\n * @param columnId - id of the column (matches against `data-columnid`).\n * @returns matching cells.\n */\nfunction getHeaderCell(\n  virtualizationContainer: HTMLDivElement,\n  columnId?: string,\n): HTMLElement | null {\n  if (columnId === undefined) {\n    return null;\n  }\n\n  return virtualizationContainer.querySelector<HTMLElement>(\n    `[role=\"columnheader\"][data-headerid=${CSS.escape(\n      columnId,\n    )}], [role='columnheader'][data-columnid=\"${CSS.escape(columnId)}\"]`,\n  );\n}\n\n/**\n * Gets all resize handles in the table.\n * @param virtualizationContainer - The table's virtualization container.\n * @returns matching elements.\n */\nfunction getResizeHandles(\n  virtualizationContainer: HTMLDivElement,\n): HTMLElement[] {\n  const resizeHandles = virtualizationContainer.querySelectorAll<HTMLElement>(\n    '[data-trigger=\"resize\"]',\n  );\n  return Array.from(resizeHandles);\n}\n\n//#endregion PositionIndicator\n\n//#region CollisionDetection\n/**\n * Check if a given point is contained within a bounding rectangle\n */\nfunction isPointWithinRectX(pointX: number, rect: ClientRect): boolean {\n  return rect.left <= pointX && pointX <= rect.right;\n}\n\n/**\n * Custom collision detection algorithm for column order drag and drop.\n * Determines the closest droppable target within the X-axis based on the dragging direction.\n *\n * @param param0 - Object containing the droppable containers, the droppable rects, the collision rect and\n *                 the active element, which are needed for the collision detection.\n * @returns An array of collision descriptors, sorted by the distance to the dragged column, or an empty array if none is found.\n */\nconst closestTargetWithinX: CollisionDetection = ({\n  droppableContainers,\n  droppableRects,\n  active,\n  collisionRect,\n}): CollisionDescriptor[] => {\n  const initialRect = active.rect.current.initial;\n\n  if (initialRect === null) {\n    return [];\n  }\n\n  const collisions: CollisionDescriptor[] = [];\n\n  // To make this work for varying column widths, depending on the dragging direction\n  // we take either the left or the right of the dragged column to check for collisions\n  // (minus a small offset, so the columns have to overlap a bit, before they would be swapped)\n  const isDraggingLeft = collisionRect.left < initialRect.left;\n  // min column width is 30px, to ensure the offset is in the left/right half: 30 / 2 - 1 = 14\n  const collisionRectX = isDraggingLeft\n    ? collisionRect.left + COLUMN_DND_COLLISION_OFFSET\n    : collisionRect.right - COLUMN_DND_COLLISION_OFFSET;\n\n  for (const droppableContainer of droppableContainers) {\n    const { id } = droppableContainer;\n    const rect = droppableRects.get(id);\n\n    if (rect === undefined) {\n      continue;\n    }\n\n    if (isPointWithinRectX(collisionRectX, rect)) {\n      // return the container that the active rect is dragged over\n      return [\n        {\n          id,\n          data: { droppableContainer, value: 0 },\n        },\n      ];\n    }\n\n    // in case the dragged column's collisionRectX is not directly within any of the droppable containers\n    // (e.g. when dragging over the scrollbar) we need to find the closest one. Therefore, we calculate\n    // the distance between the droppable container's top/bottom and the collisionRectX coordinate.\n    const droppableContainerX = isDraggingLeft ? rect.left : rect.right;\n    const distance = Math.abs(collisionRectX - droppableContainerX);\n    collisions.push({ id, data: { droppableContainer, value: distance } });\n  }\n\n  return collisions.sort((a, b) => a.data.value - b.data.value);\n};\n\n/**\n * Custom collision detection function that filters droppable containers based on the type of column being dragged,\n * and then applies the custom closestCenterWithinX algorithm on the filtered targets.\n *\n * @param active - The actively dragged item.\n * @param droppableContainers - The list of all droppable containers.\n * @param rest - Additional collision detection parameters.\n * @internal\n */\nexport const customCollisionDetection: CollisionDetection = ({\n  active,\n  droppableContainers,\n  ...rest\n}): CollisionDescriptor[] => {\n  if (active.data.current === undefined) {\n    return [];\n  }\n\n  const activeParentColumnId = active.data.current?.column?.parent?.id;\n  let validTargets: DroppableContainer[];\n\n  // Filter droppable containers based on the type of column being dragged\n  if (activeParentColumnId === undefined) {\n    // Filter out child columns\n    validTargets = droppableContainers.filter((target) => {\n      const targetIsChildColumn =\n        target.data.current?.column?.parent !== undefined;\n      return !targetIsChildColumn;\n    });\n  } else {\n    // Only consider sibling child columns\n    validTargets = droppableContainers.filter((target) => {\n      const targetParentColumnId = target.data.current?.column?.parent?.id;\n      return targetParentColumnId === activeParentColumnId; // Only siblings are valid\n    });\n  }\n\n  // Filter builtin, pinned columns, and pinned parent header fragments, as they are not valid drop targets.\n  // When a parent column has some children pinned, tanstack-table creates separate header objects\n  // per pinning group (e.g. \"right_0_col-0_col-0-c\"). These fragments should not be valid drop targets.\n  validTargets = validTargets.filter((target) => {\n    const id = String(target.id);\n    if (id.startsWith('left_') || id.startsWith('right_')) {\n      return false;\n    }\n\n    const column = target.data.current?.column as\n      | Column<unknown, unknown>\n      | undefined;\n\n    if (!column) {\n      return false;\n    }\n\n    if (column.columnDef.meta?.builtin === true) {\n      return false;\n    }\n\n    // A parent column that still has unpinned children is a valid drop target\n    const childColumns = column?.columns ?? [];\n    if (childColumns.length > 0) {\n      return childColumns.some((child) => !child.getIsPinned());\n    }\n\n    return !column.getIsPinned();\n  });\n\n  // Apply closestCenterWithinX on filtered targets and cast to the expected type\n  return closestTargetWithinX({\n    active,\n    droppableContainers: validTargets,\n    ...rest,\n  }) as CollisionDescriptor[];\n};\n//#endregion CollisionDetection\n\n//#region Modifiers\n/**\n * Retrieves the left and right bounds of a column header.\n *\n * @param columnId -\n * @param virtualizationContainer - table's virtualization container.\n * @param rowIndex - Header row to query. Defaults to 0 (parent header).\n * @param centerOnly - Exclude pinned headers if true. Relevant for parents whose children span\n * multiple pinning groups, where we only need the center fragment's bounds.\n */\nfunction getHeaderBounds(\n  columnId: string,\n  virtualizationContainer: HTMLDivElement,\n  rowIndex: 0 | 1 = 0,\n  centerOnly: boolean = false,\n): {\n  left?: number;\n  right?: number;\n  height?: number;\n} {\n  const element = virtualizationContainer.querySelector<HTMLElement>(\n    `[role=\"columnheader\"][data-header-row=\"${rowIndex}\"][data-columnId=${CSS.escape(\n      columnId,\n    )}]${centerOnly ? unpinnedHeaderFilter : ''}`,\n  );\n\n  if (element) {\n    const { left, right, height } = element.getBoundingClientRect();\n    return { left, right, height };\n  }\n\n  return {\n    left: undefined,\n    right: undefined,\n    height: undefined,\n  };\n}\n\n/**\n * Get table bounds based on table variant, header height and virtualization container\n * @returns A custom dnd kit modifier.\n */\nconst getTableBounds = (\n  containedVariant: boolean,\n  virtualizationContainer: HTMLDivElement,\n  totalHeaderHeight: number,\n): {\n  left?: number;\n  right?: number;\n  top?: number;\n  bottom?: number;\n} => {\n  const parentRect = virtualizationContainer.getBoundingClientRect();\n\n  return {\n    left: containedVariant\n      ? parentRect.left + getDataTableBorderWidth()\n      : parentRect.left,\n    right: containedVariant\n      ? parentRect.right - getDataTableBorderWidth()\n      : parentRect.right,\n    top: containedVariant\n      ? parentRect.top + getDataTableBorderWidth()\n      : parentRect.top,\n    bottom: parentRect.bottom - totalHeaderHeight,\n  };\n};\n\n/**\n * Retrieves the left and right bounds of a draggable area when there are pinned columns\n * @internal\n */\nexport function getDraggableAreaBounds(\n  pinnedColumns: ColumnPinningState,\n  virtualizationContainer?: HTMLDivElement,\n  rowIndex: 0 | 1 = 0,\n): { left: number | undefined; right: number | undefined } {\n  let left: number | undefined;\n  let right: number | undefined;\n\n  const leftPinnedColumns = pinnedColumns.left;\n  const rightPinnedColumns = pinnedColumns.right;\n\n  if (virtualizationContainer) {\n    if (leftPinnedColumns?.length) {\n      const lastLeftPinnedColumn =\n        leftPinnedColumns[leftPinnedColumns.length - 1];\n\n      // left bound should be the right position of the last column pinned to the left\n      left = getHeaderBounds(\n        lastLeftPinnedColumn,\n        virtualizationContainer,\n        rowIndex,\n      ).right;\n    }\n\n    // right bound should be the left position of the first column pinned to the right\n    if (rightPinnedColumns?.length) {\n      right = getHeaderBounds(\n        rightPinnedColumns[0],\n        virtualizationContainer,\n        rowIndex,\n      ).left;\n    }\n  }\n\n  return { left, right };\n}\n\n/**\n * Gets the header element that is being dragged.\n * @internal\n */\nexport function getDraggedHeaderElement(\n  headerId: string,\n  virtualizationContainer?: HTMLDivElement,\n): {\n  headerGroupElement: Element | null;\n  draggedHeaderElement: Element | null | undefined;\n} {\n  if (!virtualizationContainer) {\n    return { headerGroupElement: null, draggedHeaderElement: null };\n  }\n\n  const headerGroupElement =\n    virtualizationContainer.querySelector('[role=\"rowgroup\"]');\n\n  const draggedHeaderElement = headerGroupElement?.querySelector(\n    `[data-headerid=\"${CSS.escape(headerId)}\"]`,\n  );\n\n  return { headerGroupElement, draggedHeaderElement };\n}\n\n/**\n * Restricts the horizontal movement of an element within the specified bounds.\n *\n * @param transform - Transform values of the currently dragged element\n * @param rect - The bounding rectangle of the element being transformed.\n * @param tableBounds - The bounds within which the element should be restricted.\n * @returns The updated transform object with restricted x value.\n * @internal\n */\nexport function restrictToTableBounds(\n  transform: DragAndDropTransform,\n  rect: ClientRect,\n  tableBounds: {\n    left?: number;\n    right?: number;\n    top?: number;\n    bottom?: number;\n  },\n): DragAndDropTransform {\n  const value = {\n    ...transform,\n  };\n\n  // horizontal restriction (only apply if bound is defined)\n  if (typeof tableBounds.left === 'number') {\n    if (rect.left + transform.x <= tableBounds.left) {\n      value.x = tableBounds.left - rect.left;\n    }\n  }\n\n  if (typeof tableBounds.right === 'number') {\n    if (rect.right + transform.x >= tableBounds.right) {\n      value.x = tableBounds.right - rect.right;\n    }\n  }\n\n  // vertical restriction (only apply if bound is defined)\n  if (typeof tableBounds.top === 'number') {\n    if (rect.top + transform.y <= tableBounds.top) {\n      value.y = tableBounds.top - rect.top;\n    }\n  }\n\n  if (typeof tableBounds.bottom === 'number') {\n    if (rect.bottom + transform.y >= tableBounds.bottom) {\n      value.y = tableBounds.bottom - rect.bottom;\n    }\n  }\n\n  return value;\n}\n\n/**\n * Creates a custom modifier to restrict drag and drop for column ordering.\n * This function ensures that columns cannot be dragged outside the table container,\n * and that child columns cannot be dragged past their parent.\n * If the dragging element would be moved past the desired bounds, the movement\n * coordinates will be manually adjusted accordingly.\n *\n * @param totalHeaderHeight - The height of the table header that is subtracted from the table height.\n * @param containedVariant - Whether the table has the `contained` variant set.\n * @param pinnedColumns - pinned columns state.\n * @param hasSubHeaders - Whether the table has nested columns.\n * @param virtualizationContainer - The table's virtualization container.\n * @returns A custom dnd kit modifier.\n * @internal\n */\nexport const createRestrictColumnDragAndDrop = (\n  totalHeaderHeight: number,\n  containedVariant: boolean,\n  pinnedColumns: ColumnPinningState,\n  hasSubHeaders: boolean,\n  virtualizationContainer?: HTMLDivElement,\n): Modifier => {\n  return ({ transform, active, draggingNodeRect }) => {\n    if (!draggingNodeRect || virtualizationContainer === undefined) {\n      return transform;\n    }\n\n    const activeColumnParentId = active?.data.current?.column?.parent?.id;\n    const hasChildColumns =\n      activeColumnParentId === undefined &&\n      active?.data.current?.column?.columns.length > 0;\n    const isChildColumn = activeColumnParentId !== undefined;\n    const hasPinnedColumns = !!(\n      pinnedColumns.left?.length ?? pinnedColumns.right?.length\n    );\n    const headerRowIndex = hasSubHeaders ? 1 : 0;\n\n    const tableBounds = getTableBounds(\n      containedVariant,\n      virtualizationContainer,\n      totalHeaderHeight,\n    );\n\n    let leftPinnedAreaBound: number | undefined,\n      rightPinnedAreaBound: number | undefined;\n\n    if (hasPinnedColumns) {\n      const { left, right } = getDraggableAreaBounds(\n        pinnedColumns,\n        virtualizationContainer,\n        headerRowIndex,\n      );\n\n      leftPinnedAreaBound = left;\n      rightPinnedAreaBound = right;\n      tableBounds.left = left ?? tableBounds.left;\n      tableBounds.right = right ?? tableBounds.right;\n    }\n\n    /**\n     * Update table bounds for parent/nested columns\n     */\n    const updateTableBounds = (\n      left?: number,\n      right?: number,\n      height?: number,\n    ): void => {\n      // This check is necessary because the height of nested headers is smaller than the total header height\n      if (height !== undefined && tableBounds) {\n        const horizontalDividerHeight = hasChildColumns\n          ? DATA_TABLE_HORIZONTAL_DIVIDER_HEIGHT\n          : 0;\n        // Ensure bottom is defined before incrementing to satisfy TypeScript\n        tableBounds.bottom =\n          (tableBounds.bottom ?? 0) + height + horizontalDividerHeight;\n      }\n\n      if (isChildColumn && left !== undefined && right !== undefined) {\n        tableBounds.left = Math.max(left, leftPinnedAreaBound ?? left);\n        tableBounds.right = Math.min(right, rightPinnedAreaBound ?? right);\n      }\n    };\n\n    // If this is a parent or child column, the vertical/horizontal bounds need to be adjusted\n    if (hasChildColumns || isChildColumn) {\n      const activeColumnId = active?.data.current?.column?.id;\n      const columnIdForMeasuringHeaderBounds = hasChildColumns\n        ? activeColumnId\n        : activeColumnParentId;\n\n      const { left, right, height } = getHeaderBounds(\n        columnIdForMeasuringHeaderBounds,\n        virtualizationContainer,\n        0,\n        isChildColumn && hasPinnedColumns,\n      );\n\n      // If this is a parent or child column, vertical dragging should be restricted to the bottom of the table.\n      // for child columns, horizontal dragging should be restricted to the parent header\n      updateTableBounds(left, right, height);\n    }\n\n    return restrictToTableBounds(transform, draggingNodeRect, tableBounds);\n  };\n};\n//#endregion Modifiers\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n  type Active,\n  type ClientRect,\n  type CollisionDescriptor,\n  type CollisionDetection,\n  type DragOverEvent,\n  type DroppableContainer,\n  type Modifier,\n  type Over,\n} from '@dnd-kit/core';\nimport type {\n  ColumnPinningState,\n  TableFeatures,\n  Column,\n  RowData,\n  ReactTable,\n} from '@tanstack/react-table';\nimport { TouchEvent } from 'react';\n\nimport Spacings from '@dynatrace/strato-design-tokens/spacings';\n\nimport * as styles from './ColumnOrder.sty.js';\nimport { getDataTableBorderWidth } from '../../../utils/data-table-border-width.js';\nimport {\n  DATA_TABLE_DEFAULT_MIN_COLUMN_WIDTH,\n  DATA_TABLE_DND_PLACEHOLDER_DIVIDER_CSS_VAR,\n  DATA_TABLE_HORIZONTAL_DIVIDER_HEIGHT,\n} from '../../constants.js';\nimport type { DragAndDropTransform } from '../types/dnd.types.js';\nimport type { TDataTableFeatures } from '../types/features.types.js';\n\n//#region DragAndDrop\n\n// DOM Query for filtering out pinned parent headers\nexport const unpinnedHeaderFilter =\n  ':not([data-headerid*=\"left\"]):not([data-headerid*=\"right\"])';\n// Pixels from the scroll boundary at which custom auto-scroll begins.\nexport const SCROLL_PROXIMITY_ZONE = 10;\n/** Offset for column drag-and-drop collision detection (px). */\nconst COLUMN_DND_COLLISION_OFFSET = DATA_TABLE_DEFAULT_MIN_COLUMN_WIDTH / 2 - 1;\n/** Number of pixels above which a touch move event is considered a drag motion. */\nconst TOUCH_DRAG_MOTION_THRESHOLD = 5;\n// Min custom scroll speed (px/frame) applied at the edge of the proximity zone. Start slow, then speed up to max scroll speed.\nconst MIN_SCROLL_SPEED = 3;\n// Max custom scroll speed (px/frame) applied when fully past the boundary. 15 feels smooth, anything above feels too fast and anything below feels too slow.\nconst MAX_SCROLL_SPEED = 15;\n\n/**\n * Determines if the touch interaction is a drag motion.\n *\n * @param touchMove - The current touch move event.\n * @param touchStart - The preceding touch start event.\n * @returns A boolean indicating whether the touch move event is considered a drag motion.\n * @internal\n */\nexport function isDragMotion(\n  touchMove: TouchEvent,\n  touchStart?: TouchEvent,\n): boolean {\n  const touchStartX = touchStart?.touches[0].clientX;\n  if (touchStartX === undefined) {\n    return false;\n  }\n  const touchMoveX = touchMove.touches[0].clientX;\n  return Math.abs(touchMoveX - touchStartX) > TOUCH_DRAG_MOTION_THRESHOLD;\n}\n\n/**\n * Updates the column order state based on the active and over columns.\n *\n * @param active - The actively dragged item.\n * @param over - The droppable item which the active item is currently dragged over.\n * @param table - The table instance.\n * @param virtualizationContainer - The table's virtualization container.\n * @internal\n */\nexport function updateColumnOrderOnDragEnd(config: {\n  active: Active;\n  over: Over | null;\n  table: ReactTable<TDataTableFeatures, RowData>;\n  virtualizationContainer?: HTMLDivElement;\n}): void {\n  const { active, over, virtualizationContainer } = config;\n  if (\n    over === null ||\n    active.data.current === undefined ||\n    over.data.current === undefined ||\n    virtualizationContainer === undefined\n  ) {\n    return;\n  }\n\n  const activeColumn = active.data.current.column as Column<\n    TDataTableFeatures,\n    RowData\n  >;\n  const activeChildColumnIds = activeColumn.columns.map((child) => child.id);\n  const activeChildColumnsCount = activeChildColumnIds.length;\n  const activeParentColumnId = activeColumn.parent?.id;\n\n  const overColumn = over.data.current.column as Column<\n    TDataTableFeatures,\n    RowData\n  >;\n  const overParentColumnId = over.data.current?.column?.parent?.id;\n  const overChildColumnIds = overColumn.columns.map((child) => child.id);\n  const overChildColumnsCount = overChildColumnIds.length;\n\n  // move columns if both columns have the same parent or no parent\n  if (activeParentColumnId === overParentColumnId) {\n    const columnOrder = config.table.atoms.columnOrder?.get() ?? [];\n    const moveCount = Math.max(activeChildColumnsCount, 1);\n\n    // get the active and over columns' indexes in the unmodified column order to consider hidden columns during reordering\n    const activeColumnIndex = columnOrder.findIndex((columnId) => {\n      const id =\n        activeChildColumnsCount === 0\n          ? activeColumn.id\n          : // get the index of the first child column if the active column is a parent\n            activeColumn.getLeafColumns()[0].id;\n\n      return columnId === id;\n    });\n    const overColumnIndex = columnOrder.findIndex((columnId) => {\n      const id =\n        overChildColumnsCount === 0\n          ? overColumn.id\n          : // get the index of the first child column if the active column is a parent\n            overColumn.getLeafColumns()[0].id;\n      return columnId === id;\n    });\n\n    // update column order\n    const newColumnOrder = [...columnOrder];\n    const movedColumns = newColumnOrder.splice(activeColumnIndex, moveCount);\n    // if moving more than one column to the right, toIndex needs to be adjusted since more than one column were spliced from the array\n    const toIndex =\n      overColumnIndex > activeColumnIndex\n        ? overColumnIndex - (moveCount - 1)\n        : overColumnIndex;\n\n    newColumnOrder.splice(toIndex, 0, ...movedColumns);\n    config.table.setColumnOrder(newColumnOrder);\n  }\n\n  config.table.setDraggedHeaderColumn(null);\n  removeInsertPositionIndicator(lastStyledCells, virtualizationContainer, true);\n}\n\n/**\n * Gets the speed for the custom auto scroll.\n *\n * @param scrollZoneDepth - the mouse pointer position when penetrating the area where auto scroll should kick in\n *\n * @returns scroll speed measured in pixels per frame, a number between MIN_SCROLL_SPEED and MAX_SCROLL_SPEED\n * @internal\n */\nexport const getCustomScrollSpeed = (scrollZoneDepth: number): number => {\n  return Math.round(\n    MIN_SCROLL_SPEED +\n      (Math.min(scrollZoneDepth, SCROLL_PROXIMITY_ZONE) /\n        SCROLL_PROXIMITY_ZONE) *\n        (MAX_SCROLL_SPEED - MIN_SCROLL_SPEED),\n  );\n};\n\n/**\n * Creates a temporary DOM element that is temporarily inserted into the header group\n * during a drag operation to preserve the CSS grid layout when the dragged header cell is portalled out\n * of its original position.\n *\n * @param gridArea - dragged element's position in the grid\n * @param width - dragged element's width\n * @param height - dragged element's height\n * @param verticalDividerOptions - optional config for the vertical divider styling on the placeholder\n *\n * @internal\n */\nexport const createHeaderPlaceholder = (\n  gridArea: string,\n  width: number,\n  height: number,\n  verticalDividerOptions?: {\n    isParentColumn: boolean;\n    heightOffset: number;\n  },\n): HTMLDivElement => {\n  const placeholder = document.createElement('div');\n  placeholder.style.gridArea = gridArea;\n  placeholder.style.width = `${width}px`;\n  placeholder.style.height = `${height}px`;\n\n  if (verticalDividerOptions) {\n    const { isParentColumn, heightOffset } = verticalDividerOptions;\n    placeholder.classList.add(styles.verticalDividers);\n    placeholder.style.setProperty(\n      DATA_TABLE_DND_PLACEHOLDER_DIVIDER_CSS_VAR,\n      !isParentColumn && heightOffset !== 0\n        ? `${heightOffset}px`\n        : Spacings.Size4,\n    );\n  }\n\n  return placeholder;\n};\n\n//#endregion DragAndDrop\n\n//#region PositionIndicator\n// save the cells that last received the indicator styles to be able to remove them again\nconst lastStyledCells = new Set<HTMLElement>();\n\n/**\n * Transforms columns left/right to make space for the column which is currently being dragged (\"active\" column).\n *\n * @param event - contains \"active\" (column being dragged) and \"over\" columns (column where the active column is currently dragged over).\n * @param virtualizationContainer - The table's virtualization container.\n * @internal\n */\nexport function indicateInsertPosition<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>(event: DragOverEvent, virtualizationContainer?: HTMLDivElement): void {\n  if (virtualizationContainer === undefined || !event.active || !event.over) {\n    return;\n  }\n\n  const activeColumnIndex = event.active.data.current?.columnIndex;\n  const overColumnId = event.over.id as string;\n  const overColumnIndex = event.over.data.current?.columnIndex;\n\n  // If the over column is a parent, we also need to render the indicator for the first/last unpinned child\n  // depending on whether the active column is moved left or right\n  const overColumnChildren = (\n    event.over.data.current?.column as Column<TFeatures, TData>\n  )\n    .getVisibleLeafColumns()\n    .filter(\n      (child) =>\n        !(\n          child as unknown as Column<TDataTableFeatures, RowData>\n        ).getIsPinned(),\n    );\n  const overFirstChildId = overColumnChildren.at(0)?.id;\n  const overLastChildId = overColumnChildren.at(-1)?.id;\n\n  if (activeColumnIndex < overColumnIndex) {\n    // move right\n    const overChildColumnId =\n      overLastChildId !== overColumnId ? overLastChildId : undefined;\n    renderInsertPositionIndicator(\n      virtualizationContainer,\n      overColumnId,\n      overChildColumnId,\n      'right',\n    );\n  } else if (activeColumnIndex > overColumnIndex) {\n    // move left\n    const overChildColumnId =\n      overFirstChildId !== overColumnId ? overFirstChildId : undefined;\n    renderInsertPositionIndicator(\n      virtualizationContainer,\n      overColumnId,\n      overChildColumnId,\n      'left',\n    );\n  } else {\n    removeInsertPositionIndicator(lastStyledCells);\n  }\n}\n\n/**\n * Renders an indicator at the position where the column will be inserted.\n */\nfunction renderInsertPositionIndicator(\n  virtualizationContainer: HTMLDivElement,\n  columnId: string,\n  childColumnId: string | undefined,\n  position: 'left' | 'right',\n): void {\n  const overCell = getHeaderCell(virtualizationContainer, columnId);\n  if (overCell === null) {\n    return;\n  }\n\n  const overChildColumnCell = getHeaderCell(\n    virtualizationContainer,\n    childColumnId,\n  );\n\n  // remove previous styles\n  removeInsertPositionIndicator(lastStyledCells);\n  // hide resize handles so they don't overlap the indicators\n  const resizeHandles = getResizeHandles(virtualizationContainer);\n  for (const resizeHandle of resizeHandles) {\n    resizeHandle.style.display = 'none';\n  }\n\n  // add indicator after element\n  addPositionIndicatorStyle(overCell, position);\n  lastStyledCells.add(overCell);\n\n  // add indicator also to child column if there is one\n  if (overChildColumnCell) {\n    addPositionIndicatorStyle(overChildColumnCell, position);\n    lastStyledCells.add(overChildColumnCell);\n  }\n}\n\nfunction addPositionIndicatorStyle(\n  elem: HTMLElement,\n  position: 'left' | 'right',\n): void {\n  elem.classList.add(\n    styles.insertPositionIndicator.classNames.base,\n    styles.insertPositionIndicator.classNames.variants.left[\n      position === 'left' ? 'true' : 'false'\n    ],\n  );\n}\n\n/**\n * Removes the insert position indicator from the specified cells.\n */\nfunction removeInsertPositionIndicator(\n  cells: Set<HTMLElement>,\n  virtualizationContainer: HTMLDivElement | undefined = undefined,\n  displayResizeHandles: boolean = false,\n): void {\n  if (cells.size <= 0) {\n    return;\n  }\n\n  if (displayResizeHandles && virtualizationContainer) {\n    const resizeHandles = getResizeHandles(virtualizationContainer);\n    for (const resizeHandle of resizeHandles) {\n      resizeHandle.style.removeProperty('display');\n    }\n  }\n\n  for (const cell of cells) {\n    cell.classList.remove(\n      styles.insertPositionIndicator.classNames.base,\n      styles.insertPositionIndicator.classNames.variants.left.true,\n      styles.insertPositionIndicator.classNames.variants.left.false,\n    );\n    lastStyledCells.delete(cell);\n  }\n}\n\n/**\n * Gets all cells with the given column id.\n * @param virtualizationContainer - The table's virtualization container.\n * @param columnId - id of the column (matches against `data-columnid`).\n * @returns matching cells.\n */\nfunction getHeaderCell(\n  virtualizationContainer: HTMLDivElement,\n  columnId?: string,\n): HTMLElement | null {\n  if (columnId === undefined) {\n    return null;\n  }\n\n  return virtualizationContainer.querySelector<HTMLElement>(\n    `[role=\"columnheader\"][data-headerid=${CSS.escape(\n      columnId,\n    )}], [role='columnheader'][data-columnid=\"${CSS.escape(columnId)}\"]`,\n  );\n}\n\n/**\n * Gets all resize handles in the table.\n * @param virtualizationContainer - The table's virtualization container.\n * @returns matching elements.\n */\nfunction getResizeHandles(\n  virtualizationContainer: HTMLDivElement,\n): HTMLElement[] {\n  const resizeHandles = virtualizationContainer.querySelectorAll<HTMLElement>(\n    '[data-trigger=\"resize\"]',\n  );\n  return Array.from(resizeHandles);\n}\n\n//#endregion PositionIndicator\n\n//#region CollisionDetection\n/**\n * Check if a given point is contained within a bounding rectangle\n */\nfunction isPointWithinRectX(pointX: number, rect: ClientRect): boolean {\n  return rect.left <= pointX && pointX <= rect.right;\n}\n\n/**\n * Custom collision detection algorithm for column order drag and drop.\n * Determines the closest droppable target within the X-axis based on the dragging direction.\n *\n * @param param0 - Object containing the droppable containers, the droppable rects, the collision rect and\n *                 the active element, which are needed for the collision detection.\n * @returns An array of collision descriptors, sorted by the distance to the dragged column, or an empty array if none is found.\n */\nconst closestTargetWithinX: CollisionDetection = ({\n  droppableContainers,\n  droppableRects,\n  active,\n  collisionRect,\n}): CollisionDescriptor[] => {\n  const initialRect = active.rect.current.initial;\n\n  if (initialRect === null) {\n    return [];\n  }\n\n  const collisions: CollisionDescriptor[] = [];\n\n  // To make this work for varying column widths, depending on the dragging direction\n  // we take either the left or the right of the dragged column to check for collisions\n  // (minus a small offset, so the columns have to overlap a bit, before they would be swapped)\n  const isDraggingLeft = collisionRect.left < initialRect.left;\n  // min column width is 30px, to ensure the offset is in the left/right half: 30 / 2 - 1 = 14\n  const collisionRectX = isDraggingLeft\n    ? collisionRect.left + COLUMN_DND_COLLISION_OFFSET\n    : collisionRect.right - COLUMN_DND_COLLISION_OFFSET;\n\n  for (const droppableContainer of droppableContainers) {\n    const { id } = droppableContainer;\n    const rect = droppableRects.get(id);\n\n    if (rect === undefined) {\n      continue;\n    }\n\n    if (isPointWithinRectX(collisionRectX, rect)) {\n      // return the container that the active rect is dragged over\n      return [\n        {\n          id,\n          data: { droppableContainer, value: 0 },\n        },\n      ];\n    }\n\n    // in case the dragged column's collisionRectX is not directly within any of the droppable containers\n    // (e.g. when dragging over the scrollbar) we need to find the closest one. Therefore, we calculate\n    // the distance between the droppable container's top/bottom and the collisionRectX coordinate.\n    const droppableContainerX = isDraggingLeft ? rect.left : rect.right;\n    const distance = Math.abs(collisionRectX - droppableContainerX);\n    collisions.push({ id, data: { droppableContainer, value: distance } });\n  }\n\n  return collisions.sort((a, b) => a.data.value - b.data.value);\n};\n\n/**\n * Custom collision detection function that filters droppable containers based on the type of column being dragged,\n * and then applies the custom closestCenterWithinX algorithm on the filtered targets.\n *\n * @param active - The actively dragged item.\n * @param droppableContainers - The list of all droppable containers.\n * @param rest - Additional collision detection parameters.\n * @internal\n */\nexport const customCollisionDetection: CollisionDetection = ({\n  active,\n  droppableContainers,\n  ...rest\n}): CollisionDescriptor[] => {\n  if (active.data.current === undefined) {\n    return [];\n  }\n\n  const activeParentColumnId = active.data.current?.column?.parent?.id;\n  let validTargets: DroppableContainer[];\n\n  // Filter droppable containers based on the type of column being dragged\n  if (activeParentColumnId === undefined) {\n    // Filter out child columns\n    validTargets = droppableContainers.filter((target) => {\n      const targetIsChildColumn =\n        target.data.current?.column?.parent !== undefined;\n      return !targetIsChildColumn;\n    });\n  } else {\n    // Only consider sibling child columns\n    validTargets = droppableContainers.filter((target) => {\n      const targetParentColumnId = target.data.current?.column?.parent?.id;\n      return targetParentColumnId === activeParentColumnId; // Only siblings are valid\n    });\n  }\n\n  // Filter builtin, pinned columns, and pinned parent header fragments, as they are not valid drop targets.\n  // When a parent column has some children pinned, tanstack-table creates separate header objects\n  // per pinning group (e.g. \"right_0_col-0_col-0-c\"). These fragments should not be valid drop targets.\n  validTargets = validTargets.filter((target) => {\n    const id = String(target.id);\n    if (id.startsWith('left_') || id.startsWith('right_')) {\n      return false;\n    }\n\n    const column = target.data.current?.column as\n      | Column<TDataTableFeatures, RowData>\n      | undefined;\n\n    if (!column) {\n      return false;\n    }\n\n    if (column.columnDef.meta?.builtin === true) {\n      return false;\n    }\n\n    // A parent column that still has unpinned children is a valid drop target\n    const childColumns = column?.columns ?? [];\n    if (childColumns.length > 0) {\n      return childColumns.some((child) => !child.getIsPinned());\n    }\n\n    return !column.getIsPinned();\n  });\n\n  // Apply closestCenterWithinX on filtered targets and cast to the expected type\n  return closestTargetWithinX({\n    active,\n    droppableContainers: validTargets,\n    ...rest,\n  }) as CollisionDescriptor[];\n};\n//#endregion CollisionDetection\n\n//#region Modifiers\n/**\n * Retrieves the left and right bounds of a column header.\n *\n * @param columnId -\n * @param virtualizationContainer - table's virtualization container.\n * @param rowIndex - Header row to query. Defaults to 0 (parent header).\n * @param centerOnly - Exclude pinned headers if true. Relevant for parents whose children span\n * multiple pinning groups, where we only need the center fragment's bounds.\n */\nfunction getHeaderBounds(\n  columnId: string,\n  virtualizationContainer: HTMLDivElement,\n  rowIndex: 0 | 1 = 0,\n  centerOnly: boolean = false,\n): {\n  left?: number;\n  right?: number;\n  height?: number;\n} {\n  const element = virtualizationContainer.querySelector<HTMLElement>(\n    `[role=\"columnheader\"][data-header-row=\"${rowIndex}\"][data-columnId=${CSS.escape(\n      columnId,\n    )}]${centerOnly ? unpinnedHeaderFilter : ''}`,\n  );\n\n  if (element) {\n    const { left, right, height } = element.getBoundingClientRect();\n    return { left, right, height };\n  }\n\n  return {\n    left: undefined,\n    right: undefined,\n    height: undefined,\n  };\n}\n\n/**\n * Get table bounds based on table variant, header height and virtualization container\n * @returns A custom dnd kit modifier.\n */\nconst getTableBounds = (\n  containedVariant: boolean,\n  virtualizationContainer: HTMLDivElement,\n  totalHeaderHeight: number,\n): {\n  left?: number;\n  right?: number;\n  top?: number;\n  bottom?: number;\n} => {\n  const parentRect = virtualizationContainer.getBoundingClientRect();\n\n  return {\n    left: containedVariant\n      ? parentRect.left + getDataTableBorderWidth()\n      : parentRect.left,\n    right: containedVariant\n      ? parentRect.right - getDataTableBorderWidth()\n      : parentRect.right,\n    top: containedVariant\n      ? parentRect.top + getDataTableBorderWidth()\n      : parentRect.top,\n    bottom: parentRect.bottom - totalHeaderHeight,\n  };\n};\n\n/**\n * Retrieves the left and right bounds of the draggable area, constrained by any pinned columns\n * @internal\n */\nexport function getDraggableAreaBounds(\n  pinnedColumns: ColumnPinningState,\n  virtualizationContainer?: HTMLDivElement,\n  rowIndex: 0 | 1 = 0,\n): { left: number | undefined; right: number | undefined } {\n  let left: number | undefined;\n  let right: number | undefined;\n\n  const leftPinnedColumns = pinnedColumns.left;\n  const rightPinnedColumns = pinnedColumns.right;\n\n  if (virtualizationContainer) {\n    if (leftPinnedColumns?.length) {\n      const lastLeftPinnedColumn =\n        leftPinnedColumns[leftPinnedColumns.length - 1];\n\n      // left bound should be the right position of the last column pinned to the left\n      left = getHeaderBounds(\n        lastLeftPinnedColumn,\n        virtualizationContainer,\n        rowIndex,\n      ).right;\n    }\n\n    // right bound should be the left position of the first column pinned to the right\n    if (rightPinnedColumns?.length) {\n      right = getHeaderBounds(\n        rightPinnedColumns[0],\n        virtualizationContainer,\n        rowIndex,\n      ).left;\n    }\n  }\n\n  return { left, right };\n}\n\n/**\n * Gets the header element that is being dragged.\n * @internal\n */\nexport function getDraggedHeaderElement(\n  headerId: string,\n  virtualizationContainer?: HTMLDivElement,\n): {\n  headerGroupElement: Element | null;\n  draggedHeaderElement: Element | null | undefined;\n} {\n  if (!virtualizationContainer) {\n    return { headerGroupElement: null, draggedHeaderElement: null };\n  }\n\n  const headerGroupElement =\n    virtualizationContainer.querySelector('[role=\"rowgroup\"]');\n\n  const draggedHeaderElement = headerGroupElement?.querySelector(\n    `[data-headerid=\"${CSS.escape(headerId)}\"]`,\n  );\n\n  return { headerGroupElement, draggedHeaderElement };\n}\n\n/**\n * Restricts the horizontal movement of an element within the specified bounds.\n *\n * @param transform - Transform values of the currently dragged element\n * @param rect - The bounding rectangle of the element being transformed.\n * @param tableBounds - The bounds within which the element should be restricted.\n * @returns The updated transform object with restricted x value.\n * @internal\n */\nexport function restrictToTableBounds(\n  transform: DragAndDropTransform,\n  rect: ClientRect,\n  tableBounds: {\n    left?: number;\n    right?: number;\n    top?: number;\n    bottom?: number;\n  },\n): DragAndDropTransform {\n  const value = {\n    ...transform,\n  };\n\n  // horizontal restriction (only apply if bound is defined)\n  if (typeof tableBounds.left === 'number') {\n    if (rect.left + transform.x <= tableBounds.left) {\n      value.x = tableBounds.left - rect.left;\n    }\n  }\n\n  if (typeof tableBounds.right === 'number') {\n    if (rect.right + transform.x >= tableBounds.right) {\n      value.x = tableBounds.right - rect.right;\n    }\n  }\n\n  // vertical restriction (only apply if bound is defined)\n  if (typeof tableBounds.top === 'number') {\n    if (rect.top + transform.y <= tableBounds.top) {\n      value.y = tableBounds.top - rect.top;\n    }\n  }\n\n  if (typeof tableBounds.bottom === 'number') {\n    if (rect.bottom + transform.y >= tableBounds.bottom) {\n      value.y = tableBounds.bottom - rect.bottom;\n    }\n  }\n\n  return value;\n}\n\n/**\n * Creates a custom modifier to restrict drag and drop for column ordering.\n * This function ensures that columns cannot be dragged outside the table container,\n * and that child columns cannot be dragged past their parent.\n * If the dragging element would be moved past the desired bounds, the movement\n * coordinates will be manually adjusted accordingly.\n *\n * @param totalHeaderHeight - The height of the table header that is subtracted from the table height.\n * @param containedVariant - Whether the table has the `contained` variant set.\n * @param pinnedColumns - pinned columns state.\n * @param hasSubHeaders - Whether the table has nested columns.\n * @param virtualizationContainer - The table's virtualization container.\n * @returns A custom dnd kit modifier.\n * @internal\n */\nexport const createRestrictColumnDragAndDrop = (\n  totalHeaderHeight: number,\n  containedVariant: boolean,\n  pinnedColumns: ColumnPinningState,\n  hasSubHeaders: boolean,\n  virtualizationContainer?: HTMLDivElement,\n): Modifier => {\n  return ({ transform, active, draggingNodeRect }) => {\n    if (!draggingNodeRect || virtualizationContainer === undefined) {\n      return transform;\n    }\n\n    const activeColumnParentId = active?.data.current?.column?.parent?.id;\n    const hasChildColumns =\n      activeColumnParentId === undefined &&\n      active?.data.current?.column?.columns.length > 0;\n    const isChildColumn = activeColumnParentId !== undefined;\n    const hasPinnedColumns = !!(\n      pinnedColumns.left?.length ?? pinnedColumns.right?.length\n    );\n    const headerRowIndex = hasSubHeaders ? 1 : 0;\n\n    const tableBounds = getTableBounds(\n      containedVariant,\n      virtualizationContainer,\n      totalHeaderHeight,\n    );\n\n    let leftPinnedAreaBound: number | undefined,\n      rightPinnedAreaBound: number | undefined;\n\n    if (hasPinnedColumns) {\n      const { left, right } = getDraggableAreaBounds(\n        pinnedColumns,\n        virtualizationContainer,\n        headerRowIndex,\n      );\n\n      leftPinnedAreaBound = left;\n      rightPinnedAreaBound = right;\n      tableBounds.left = left ?? tableBounds.left;\n      tableBounds.right = right ?? tableBounds.right;\n    }\n\n    /**\n     * Update table bounds for parent/nested columns\n     */\n    const updateTableBounds = (\n      left?: number,\n      right?: number,\n      height?: number,\n    ): void => {\n      // This check is necessary because the height of nested headers is smaller than the total header height\n      if (height !== undefined && tableBounds) {\n        const horizontalDividerHeight = hasChildColumns\n          ? DATA_TABLE_HORIZONTAL_DIVIDER_HEIGHT\n          : 0;\n        // Ensure bottom is defined before incrementing to satisfy TypeScript\n        tableBounds.bottom =\n          (tableBounds.bottom ?? 0) + height + horizontalDividerHeight;\n      }\n\n      if (isChildColumn && left !== undefined && right !== undefined) {\n        tableBounds.left = Math.max(left, leftPinnedAreaBound ?? left);\n        tableBounds.right = Math.min(right, rightPinnedAreaBound ?? right);\n      }\n    };\n\n    // If this is a parent or child column, the vertical/horizontal bounds need to be adjusted\n    if (hasChildColumns || isChildColumn) {\n      const activeColumnId = active?.data.current?.column?.id;\n      const columnIdForMeasuringHeaderBounds = hasChildColumns\n        ? activeColumnId\n        : activeColumnParentId;\n\n      const { left, right, height } = getHeaderBounds(\n        columnIdForMeasuringHeaderBounds,\n        virtualizationContainer,\n        0,\n        isChildColumn && hasPinnedColumns,\n      );\n\n      // If this is a parent or child column, vertical dragging should be restricted to the bottom of the table.\n      // for child columns, horizontal dragging should be restricted to the parent header\n      updateTableBounds(left, right, height);\n    }\n\n    return restrictToTableBounds(transform, draggingNodeRect, tableBounds);\n  };\n};\n//#endregion Modifiers\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/tables/DataTable/features/ColumnOrder/column-order-utils.js

@@ -48,10 +48,14 @@ function isColumnFullyPinnedOrHidden(column, columnsPinned) {
     return false;
   }
   if (!column.parent?.columns.length) {
-    return getIsColumnPinned(column.id, columnsPinned) || !column.getIsVisible();
+    return getIsColumnPinned(column.id, columnsPinned) || !// Requires a cast here to access the column visibility feature method, since the generic type
+    // of the column doesn't necessarily include the column visibility feature.
+    column.getIsVisible();
   }
   return column?.parent.columns.every(
-    (col) => getIsColumnPinned(col.id, columnsPinned) || !col.getIsVisible()
+    (col) => getIsColumnPinned(col.id, columnsPinned) || !// Requires a cast here to access the column visibility feature method, since the generic type
+    // of the column doesn't necessarily include the column visibility feature.
+    col.getIsVisible()
   );
 }
 const getNewColumnOrder = (currentColumnOrder, startIndex, targetIndex, moveCount = 1) => {
@@ -72,7 +76,9 @@ function moveNestedColumnLeft(column, leafColumns, columnOrder, columnsPinned) {
   while (targetIndex >= 0) {
     const targetColumnId = columnOrder[targetIndex];
     const targetColumn = leafColumns.find((col) => col.id === targetColumnId);
-    if (targetColumn && !getIsColumnPinned(targetColumn.id, columnsPinned) && targetColumn.getIsVisible()) {
+    if (targetColumn && !getIsColumnPinned(targetColumn.id, columnsPinned) && // Requires a cast here to access the column visibility feature method, since the generic type
+    // of the column doesn't necessarily include the column visibility feature.
+    targetColumn.getIsVisible()) {
       break;
     }
     targetIndex--;
@@ -118,7 +124,9 @@ function moveNestedColumnRight(column, leafColumns, columnOrder, columnsPinned)
   while (targetIndex < columnOrder.length) {
     const targetColumnId = columnOrder[targetIndex];
     const targetColumn = leafColumns.find((col) => col.id === targetColumnId);
-    if (targetColumn && !getIsColumnPinned(targetColumn.id, columnsPinned) && targetColumn.getIsVisible()) {
+    if (targetColumn && !getIsColumnPinned(targetColumn.id, columnsPinned) && // Requires a cast here to access the column visibility feature method, since the generic type
+    // of the column doesn't necessarily include the column visibility feature.
+    targetColumn.getIsVisible()) {
       break;
     }
     targetIndex++;

package/esm/tables/DataTable/features/ColumnOrder/column-order-utils.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/tables/DataTable/features/ColumnOrder/column-order-utils.ts"],
-  "sourcesContent": ["import type {\n  ColumnOrderState,\n  ColumnPinningState,\n} from '@tanstack/react-table';\n\nimport type { Column, Table } from '../../hooks/useTable/types.js';\nimport type { DataTableRowData } from '../../public.api.js';\nimport { getIsColumnPinned } from '../ColumnPinning/column-pinning-utils.js';\n\n/**\n * Utility function to check if a column can be moved to the left.\n *\n * @param column - the column to be re-ordered\n * @param columnsToCompare - columns to compare against when re-ordering\n * @returns true if the column can be moved left, false if it's already at the leftmost position\n */\nexport function canMoveColumnLeft<TData extends DataTableRowData, TValue>(\n  column: Column<TData, TValue>,\n  columnsToCompare: Column<TData, unknown>[],\n): boolean {\n  let columnId: string | undefined = column.id;\n\n  // For nested columns, we need to find the first leaf column\n  // in the comparison list to determine if the entire group can move left\n  if (column.columns.length > 0) {\n    columnId = columnsToCompare.find(\n      (leafColumn) =>\n        leafColumn.id === column.id || leafColumn.parent?.id === column.id,\n    )?.id;\n  }\n\n  // Column can move left if it's not already at the first position\n  return columnsToCompare.at(0)?.id !== columnId;\n}\n\n/**\n * Utility function to check if a column can be moved to the right.\n *\n * @param column - the column to be re-ordered\n * @param columnsToCompare - columns to compare against when re-ordering\n * @returns true if the column can be moved right, false if it's already at the rightmost position\n */\nexport function canMoveColumnRight<TData extends DataTableRowData, TValue>(\n  column: Column<TData, TValue>,\n  columnsToCompare: Column<TData, unknown>[],\n): boolean {\n  let columnId: string | undefined = column.id;\n\n  // For nested columns, we need to find the last leaf column\n  // in the comparison list to determine if the entire group can move right\n  if (column.columns.length > 0) {\n    columnId = columnsToCompare.findLast(\n      (leafColumn) =>\n        leafColumn.id === column.id || leafColumn.parent?.id === column.id,\n    )?.id;\n  }\n\n  // Column can move right if it's not already at the last position\n  return columnsToCompare?.at(-1)?.id !== columnId;\n}\n\n/**\n * Returns the index of the given column in the provided column order.\n *\n * For nested column, returns the index of the *first* child column.\n */\nfunction getFirstColumnIndex<TData, TValue>(\n  column: Column<TData, TValue>,\n  columnOrder: string[],\n): number {\n  if (column.columns.length) {\n    // find index of first child in current column order\n    return columnOrder.findIndex((columnId) =>\n      column.columns.some((column) => column.id === columnId),\n    );\n  }\n  // standalone column\n  return columnOrder.indexOf(column.id);\n}\n\n/**\n * Returns the last index of the given column in the provided column order.\n *\n * For nested column, returns the index of the *last* child column.\n */\nfunction getLastColumnIndex<TData, TValue>(\n  column: Column<TData, TValue>,\n  columnOrder: string[],\n): number {\n  if (column.columns.length) {\n    // find index of last child in current column order\n    return columnOrder.findLastIndex((columnId) =>\n      column.columns.some((column) => column.id === columnId),\n    );\n  }\n  // standalone column (for the standalone column the first index is also the last index)\n  return columnOrder.indexOf(column.id);\n}\n\n/**\n * Finds a column by ID in the provided list of columns.\n */\nfunction findColumnById<TData extends DataTableRowData, TValue>(\n  columnId: string,\n  columns: Column<TData, TValue>[],\n): Column<TData, TValue> | undefined {\n  return columns.find((c) => c.id === columnId);\n}\n\n/**\n * Returns the number of columns to move based on whether the column has child columns.\n */\nfunction getColumnsToMoveCount<TData, TValue>(\n  column: Column<TData, TValue>,\n): number {\n  return (\n    // for nested columns, move all child columns together\n    (column.columns.length || // for standalone columns, move only itself\n    1)\n  );\n}\n\n/**\n * Returns true, if the given column is pinned.\n * For nested column, returns true if all children are pinned or hidden.\n */\nfunction isColumnFullyPinnedOrHidden<TData>(\n  column: Column<TData, unknown> | undefined,\n  columnsPinned: ColumnPinningState,\n): boolean {\n  if (!column) {\n    return false;\n  }\n  if (!column.parent?.columns.length) {\n    return (\n      getIsColumnPinned(column.id, columnsPinned) || !column.getIsVisible()\n    );\n  }\n\n  // nested column is only an invalid target, if all its siblings are pinned\n  return column?.parent.columns.every(\n    (col) => getIsColumnPinned(col.id, columnsPinned) || !col.getIsVisible(),\n  );\n}\n\n/**\n * Retrieves new column order for moving a column left or right.\n *\n * @param currentColumnOrder - current column order\n * @param startIndex - current column index where the move starts\n * @param targetIndex - target index where the moved columns should be inserted\n * @param moveCount - how many columns to move based on column children\n */\nconst getNewColumnOrder = (\n  currentColumnOrder: string[],\n  startIndex: number,\n  targetIndex: number,\n  moveCount: number = 1,\n): string[] => {\n  // Extract the column(s) that should be moved\n  const newColumnOrder = [...currentColumnOrder];\n  const columnsToMove = newColumnOrder.splice(startIndex, moveCount);\n  // Insert the column(s) at the new position\n  newColumnOrder.splice(targetIndex, 0, ...columnsToMove);\n\n  return newColumnOrder;\n};\n\n/**\n * Gets the relevant columns to compare against when moving a column.\n */\nexport function getColumnsToCompareForMove<TData, TValue>(\n  table: Table<TData>,\n  column: Column<TData, TValue>,\n): Column<TData, unknown>[] {\n  if (column.columns.length > 0 || !column.parent) {\n    // For parent columns or standalone columns, use all center visible leaf columns\n    return table.getCenterVisibleLeafColumnsWithoutBuiltIn();\n  }\n  // For child columns, use only their siblings (= visible leaf columns within the parent)\n  return column.parent.getCenterVisibleLeafColumns();\n}\n\n/**\n * Moves a nested child column one position to the left within its parent group.\n * Skips pinned and hidden columns when determining the target position.\n */\nfunction moveNestedColumnLeft<TData, TValue>(\n  column: Column<TData, TValue>,\n  leafColumns: Column<TData, unknown>[],\n  columnOrder: string[],\n  columnsPinned: ColumnPinningState,\n): string[] {\n  const columnIndex = columnOrder.indexOf(column.id);\n  let targetIndex = columnIndex - 1;\n\n  while (targetIndex >= 0) {\n    const targetColumnId = columnOrder[targetIndex];\n    const targetColumn = leafColumns.find((col) => col.id === targetColumnId);\n\n    if (\n      targetColumn &&\n      !getIsColumnPinned(targetColumn.id, columnsPinned) &&\n      targetColumn.getIsVisible()\n    ) {\n      // Found a valid target position\n      break;\n    }\n\n    // skip pinned and hidden columns\n    targetIndex--;\n  }\n\n  return getNewColumnOrder(columnOrder, columnIndex, targetIndex);\n}\n\n/**\n * Moves the current column one position to the left and updates the table state.\n *\n * Depending on whether the column is a nested column or a standalone column,\n * whether its neighboring columns are pinned, hidden, or nested,\n * we need to consider different scenarios to calculate the new column order correctly.\n *\n * CASE1: Column itself is a nested child column.\n *  - Constraint1: Can only move within the parent group.\n *  - Constraint2: Skip pinned siblings.\n *  - Constraint3: Skip hidden siblings.\n *\n * CASE2: Column is a standalone column or a parent column.\n *  - Constraint1: Skip entire nested columns as a whole.\n *  - Constraint2: Skip pinned columns.\n *  - Constraint3: Skip hidden columns.\n */\nexport function moveColumnLeft<TData, TValue>(\n  column: Column<TData, TValue>,\n  currentColumnOrder: ColumnOrderState,\n  columnsPinned: ColumnPinningState,\n  leafColumns: Column<TData, unknown>[],\n): string[] {\n  // CASE1: Column itself is a nested child column.\n  if (column.parent) {\n    const newColumnOrder = moveNestedColumnLeft(\n      column,\n      leafColumns,\n      currentColumnOrder,\n      columnsPinned,\n    );\n    return newColumnOrder;\n  }\n\n  // CASE2: Column is a standalone column or a parent column.\n  const columnIndex = getFirstColumnIndex(column, currentColumnOrder);\n\n  // target is one position to the left\n  let currentTargetIndex = columnIndex - 1;\n\n  // we can't move past the first position\n  while (currentTargetIndex > 0) {\n    const currentTargetId = currentColumnOrder[currentTargetIndex];\n    const currentTargetColumn = findColumnById(currentTargetId, leafColumns);\n\n    // Constraint1: Skip nested columns as a whole.\n    if (currentTargetColumn?.parent) {\n      currentTargetIndex -= currentTargetColumn.parent.columns.length - 1;\n    }\n\n    // Constraint2: Skip pinned or hidden columns.\n    // For nested columns, skip if *entire group* is pinned or hidden.\n    if (isColumnFullyPinnedOrHidden(currentTargetColumn, columnsPinned)) {\n      currentTargetIndex--;\n      continue;\n    }\n\n    break; // found valid target\n  }\n\n  const columnsToMove = getColumnsToMoveCount(column);\n  const newColumnOrder = getNewColumnOrder(\n    currentColumnOrder,\n    columnIndex,\n    currentTargetIndex,\n    columnsToMove,\n  );\n\n  return newColumnOrder;\n}\n\n/**\n * Moves a nested child column one position to the right within its parent group.\n * Skips pinned and hidden columns when determining the target position.\n */\nfunction moveNestedColumnRight<TData, TValue>(\n  column: Column<TData, TValue>,\n  leafColumns: Column<TData, unknown>[],\n  columnOrder: ColumnOrderState,\n  columnsPinned: ColumnPinningState,\n): string[] {\n  const columnIndex = columnOrder.indexOf(column.id);\n  let targetIndex = columnIndex + 1;\n\n  while (targetIndex < columnOrder.length) {\n    const targetColumnId = columnOrder[targetIndex];\n    const targetColumn = leafColumns.find((col) => col.id === targetColumnId);\n\n    if (\n      targetColumn &&\n      !getIsColumnPinned(targetColumn.id, columnsPinned) &&\n      targetColumn.getIsVisible()\n    ) {\n      // Found a valid target position\n      break;\n    }\n\n    // skip pinned and hidden columns\n    targetIndex++;\n  }\n\n  return getNewColumnOrder(columnOrder, columnIndex, targetIndex);\n}\n\n/**\n * Moves the current column one position to the right and returns the new column order.\n *\n * Depending on whether the column is a nested column or a standalone column,\n * whether its neighboring columns are pinned, hidden, or nested,\n * we need to consider different scenarios to calculate the new column order correctly.\n *a\n * CASE1: Column itself is a nested child column.\n *  - Constraint1: Can only move within the parent group.\n *  - Constraint2: Skip pinned siblings.\n *  - Constraint3: Skip hidden siblings.\n *\n * CASE2: Column is a standalone column or a parent column.\n *  - Constraint1: Skip entire nested columns as a whole.\n *  - Constraint2: Skip pinned columns.\n *  - Constraint3: Skip hidden columns.\n */\nexport function moveColumnRight<TData, TValue>(\n  column: Column<TData, TValue>,\n  currentColumnOrder: ColumnOrderState,\n  columnsPinned: ColumnPinningState,\n  leafColumns: Column<TData, unknown>[],\n): string[] {\n  // CASE1: Column itself is a nested child column.\n  if (column.parent) {\n    const newColumnOrder = moveNestedColumnRight(\n      column,\n      leafColumns,\n      currentColumnOrder,\n      columnsPinned,\n    );\n\n    return newColumnOrder;\n  }\n\n  // CASE2: Column is a standalone column or a parent column.\n  const columnIndex = getLastColumnIndex(column, currentColumnOrder);\n\n  // target is one position to the right\n  let currentTargetIndex = columnIndex + 1;\n\n  // we can't move past the last position\n  while (currentTargetIndex < currentColumnOrder.length - 1) {\n    const currentTargetId = currentColumnOrder[currentTargetIndex];\n    const currentTargetColumn = findColumnById(currentTargetId, leafColumns);\n\n    // Constraint1: Skip nested columns as a whole.\n    if (currentTargetColumn?.parent) {\n      currentTargetIndex += currentTargetColumn.parent.columns.length - 1;\n    }\n\n    // Constraint2: Skip pinned or hiddden columns.\n    // For nested columns, skip if *entire group* is pinned or hidden.\n    if (isColumnFullyPinnedOrHidden(currentTargetColumn, columnsPinned)) {\n      // skip pinned columns\n      currentTargetIndex++;\n      continue;\n    }\n\n    break; // found valid target\n  }\n\n  const hasChildren = column.columns.length > 0;\n  const startIndex = hasChildren\n    ? // We used the last child index as start index,\n      // so we need to adjust it to the first child index here.\n      columnIndex - (column.columns.length - 1)\n    : columnIndex;\n  const targetIndex = hasChildren\n    ? // We used the last child to calculate the target index,\n      // so we need to adjust it here.\n      currentTargetIndex - (column.columns.length - 1)\n    : currentTargetIndex;\n  const columnsToMove = getColumnsToMoveCount(column);\n  const newColumnOrder = getNewColumnOrder(\n    currentColumnOrder,\n    startIndex,\n    targetIndex,\n    columnsToMove,\n  );\n\n  return newColumnOrder;\n}\n"],
-  "mappings": "AAOA,SAAS,yBAAyB;AAS3B,SAAS,kBACd,QACA,kBACS;AACT,MAAI,WAA+B,OAAO;AAI1C,MAAI,OAAO,QAAQ,SAAS,GAAG;AAC7B,eAAW,iBAAiB;AAAA,MAC1B,CAAC,eACC,WAAW,OAAO,OAAO,MAAM,WAAW,QAAQ,OAAO,OAAO;AAAA,IACpE,GAAG;AAAA,EACL;AAGA,SAAO,iBAAiB,GAAG,CAAC,GAAG,OAAO;AACxC;AASO,SAAS,mBACd,QACA,kBACS;AACT,MAAI,WAA+B,OAAO;AAI1C,MAAI,OAAO,QAAQ,SAAS,GAAG;AAC7B,eAAW,iBAAiB;AAAA,MAC1B,CAAC,eACC,WAAW,OAAO,OAAO,MAAM,WAAW,QAAQ,OAAO,OAAO;AAAA,IACpE,GAAG;AAAA,EACL;AAGA,SAAO,kBAAkB,GAAG,EAAE,GAAG,OAAO;AAC1C;AAOA,SAAS,oBACP,QACA,aACQ;AACR,MAAI,OAAO,QAAQ,QAAQ;AAEzB,WAAO,YAAY;AAAA,MAAU,CAAC,aAC5B,OAAO,QAAQ,KAAK,CAACA,YAAWA,QAAO,OAAO,QAAQ;AAAA,IACxD;AAAA,EACF;AAEA,SAAO,YAAY,QAAQ,OAAO,EAAE;AACtC;AAOA,SAAS,mBACP,QACA,aACQ;AACR,MAAI,OAAO,QAAQ,QAAQ;AAEzB,WAAO,YAAY;AAAA,MAAc,CAAC,aAChC,OAAO,QAAQ,KAAK,CAACA,YAAWA,QAAO,OAAO,QAAQ;AAAA,IACxD;AAAA,EACF;AAEA,SAAO,YAAY,QAAQ,OAAO,EAAE;AACtC;AAKA,SAAS,eACP,UACA,SACmC;AACnC,SAAO,QAAQ,KAAK,CAAC,MAAM,EAAE,OAAO,QAAQ;AAC9C;AAKA,SAAS,sBACP,QACQ;AACR;AAAA;AAAA,IAEG,OAAO,QAAQ;AAAA,IAChB;AAAA;AAEJ;AAMA,SAAS,4BACP,QACA,eACS;AACT,MAAI,CAAC,QAAQ;AACX,WAAO;AAAA,EACT;AACA,MAAI,CAAC,OAAO,QAAQ,QAAQ,QAAQ;AAClC,WACE,kBAAkB,OAAO,IAAI,aAAa,KAAK,CAAC,OAAO,aAAa;AAAA,EAExE;AAGA,SAAO,QAAQ,OAAO,QAAQ;AAAA,IAC5B,CAAC,QAAQ,kBAAkB,IAAI,IAAI,aAAa,KAAK,CAAC,IAAI,aAAa;AAAA,EACzE;AACF;AAUA,MAAM,oBAAoB,CACxB,oBACA,YACA,aACA,YAAoB,MACP;AAEb,QAAM,iBAAiB,CAAC,GAAG,kBAAkB;AAC7C,QAAM,gBAAgB,eAAe,OAAO,YAAY,SAAS;AAEjE,iBAAe,OAAO,aAAa,GAAG,GAAG,aAAa;AAEtD,SAAO;AACT;AAKO,SAAS,2BACd,OACA,QAC0B;AAC1B,MAAI,OAAO,QAAQ,SAAS,KAAK,CAAC,OAAO,QAAQ;AAE/C,WAAO,MAAM,0CAA0C;AAAA,EACzD;AAEA,SAAO,OAAO,OAAO,4BAA4B;AACnD;AAMA,SAAS,qBACP,QACA,aACA,aACA,eACU;AACV,QAAM,cAAc,YAAY,QAAQ,OAAO,EAAE;AACjD,MAAI,cAAc,cAAc;AAEhC,SAAO,eAAe,GAAG;AACvB,UAAM,iBAAiB,YAAY,WAAW;AAC9C,UAAM,eAAe,YAAY,KAAK,CAAC,QAAQ,IAAI,OAAO,cAAc;AAExE,QACE,gBACA,CAAC,kBAAkB,aAAa,IAAI,aAAa,KACjD,aAAa,aAAa,GAC1B;AAEA;AAAA,IACF;AAGA;AAAA,EACF;AAEA,SAAO,kBAAkB,aAAa,aAAa,WAAW;AAChE;AAmBO,SAAS,eACd,QACA,oBACA,eACA,aACU;AAEV,MAAI,OAAO,QAAQ;AACjB,UAAMC,kBAAiB;AAAA,MACrB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AACA,WAAOA;AAAA,EACT;AAGA,QAAM,cAAc,oBAAoB,QAAQ,kBAAkB;AAGlE,MAAI,qBAAqB,cAAc;AAGvC,SAAO,qBAAqB,GAAG;AAC7B,UAAM,kBAAkB,mBAAmB,kBAAkB;AAC7D,UAAM,sBAAsB,eAAe,iBAAiB,WAAW;AAGvE,QAAI,qBAAqB,QAAQ;AAC/B,4BAAsB,oBAAoB,OAAO,QAAQ,SAAS;AAAA,IACpE;AAIA,QAAI,4BAA4B,qBAAqB,aAAa,GAAG;AACnE;AACA;AAAA,IACF;AAEA;AAAA,EACF;AAEA,QAAM,gBAAgB,sBAAsB,MAAM;AAClD,QAAM,iBAAiB;AAAA,IACrB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,SAAO;AACT;AAMA,SAAS,sBACP,QACA,aACA,aACA,eACU;AACV,QAAM,cAAc,YAAY,QAAQ,OAAO,EAAE;AACjD,MAAI,cAAc,cAAc;AAEhC,SAAO,cAAc,YAAY,QAAQ;AACvC,UAAM,iBAAiB,YAAY,WAAW;AAC9C,UAAM,eAAe,YAAY,KAAK,CAAC,QAAQ,IAAI,OAAO,cAAc;AAExE,QACE,gBACA,CAAC,kBAAkB,aAAa,IAAI,aAAa,KACjD,aAAa,aAAa,GAC1B;AAEA;AAAA,IACF;AAGA;AAAA,EACF;AAEA,SAAO,kBAAkB,aAAa,aAAa,WAAW;AAChE;AAmBO,SAAS,gBACd,QACA,oBACA,eACA,aACU;AAEV,MAAI,OAAO,QAAQ;AACjB,UAAMA,kBAAiB;AAAA,MACrB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAEA,WAAOA;AAAA,EACT;AAGA,QAAM,cAAc,mBAAmB,QAAQ,kBAAkB;AAGjE,MAAI,qBAAqB,cAAc;AAGvC,SAAO,qBAAqB,mBAAmB,SAAS,GAAG;AACzD,UAAM,kBAAkB,mBAAmB,kBAAkB;AAC7D,UAAM,sBAAsB,eAAe,iBAAiB,WAAW;AAGvE,QAAI,qBAAqB,QAAQ;AAC/B,4BAAsB,oBAAoB,OAAO,QAAQ,SAAS;AAAA,IACpE;AAIA,QAAI,4BAA4B,qBAAqB,aAAa,GAAG;AAEnE;AACA;AAAA,IACF;AAEA;AAAA,EACF;AAEA,QAAM,cAAc,OAAO,QAAQ,SAAS;AAC5C,QAAM,aAAa;AAAA;AAAA;AAAA,IAGf,eAAe,OAAO,QAAQ,SAAS;AAAA,MACvC;AACJ,QAAM,cAAc;AAAA;AAAA;AAAA,IAGhB,sBAAsB,OAAO,QAAQ,SAAS;AAAA,MAC9C;AACJ,QAAM,gBAAgB,sBAAsB,MAAM;AAClD,QAAM,iBAAiB;AAAA,IACrB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,SAAO;AACT;",
+  "sourcesContent": ["import {\n  columnVisibilityFeature,\n  type CellData,\n  type Column_Internal,\n  type ColumnOrderState,\n  type ColumnPinningState,\n  type RowData,\n  type Table_Internal,\n  type TableFeatures,\n} from '@tanstack/react-table';\n\nimport { getIsColumnPinned } from '../ColumnPinning/column-pinning-utils.js';\n\n/**\n * Utility function to check if a column can be moved to the left.\n *\n * @param column - the column to be re-ordered\n * @param columnsToCompare - columns to compare against when re-ordering\n * @returns true if the column can be moved left, false if it's already at the leftmost position\n */\nexport function canMoveColumnLeft<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(\n  column: Column_Internal<TFeatures, TData, TValue>,\n  columnsToCompare: Array<Column_Internal<TFeatures, TData, TValue>>,\n): boolean {\n  let columnId: string | undefined = column.id;\n\n  // For nested columns, we need to find the first leaf column\n  // in the comparison list to determine if the entire group can move left\n  if (column.columns.length > 0) {\n    columnId = columnsToCompare.find(\n      (leafColumn) =>\n        leafColumn.id === column.id || leafColumn.parent?.id === column.id,\n    )?.id;\n  }\n\n  // Column can move left if it's not already at the first position\n  return columnsToCompare.at(0)?.id !== columnId;\n}\n\n/**\n * Utility function to check if a column can be moved to the right.\n *\n * @param column - the column to be re-ordered\n * @param columnsToCompare - columns to compare against when re-ordering\n * @returns true if the column can be moved right, false if it's already at the rightmost position\n */\nexport function canMoveColumnRight<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(\n  column: Column_Internal<TFeatures, TData, TValue>,\n  columnsToCompare: Array<Column_Internal<TFeatures, TData, TValue>>,\n): boolean {\n  let columnId: string | undefined = column.id;\n\n  // For nested columns, we need to find the last leaf column\n  // in the comparison list to determine if the entire group can move right\n  if (column.columns.length > 0) {\n    columnId = columnsToCompare.findLast(\n      (leafColumn) =>\n        leafColumn.id === column.id || leafColumn.parent?.id === column.id,\n    )?.id;\n  }\n\n  // Column can move right if it's not already at the last position\n  return columnsToCompare?.at(-1)?.id !== columnId;\n}\n\n/**\n * Returns the index of the given column in the provided column order.\n *\n * For nested column, returns the index of the *first* child column.\n */\nfunction getFirstColumnIndex<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(\n  column: Column_Internal<TFeatures, TData, TValue>,\n  columnOrder: string[],\n): number {\n  if (column.columns.length) {\n    // find index of first child in current column order\n    return columnOrder.findIndex((columnId) =>\n      column.columns.some((column) => column.id === columnId),\n    );\n  }\n  // standalone column\n  return columnOrder.indexOf(column.id);\n}\n\n/**\n * Returns the last index of the given column in the provided column order.\n *\n * For nested column, returns the index of the *last* child column.\n */\nfunction getLastColumnIndex<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(\n  column: Column_Internal<TFeatures, TData, TValue>,\n  columnOrder: string[],\n): number {\n  if (column.columns.length) {\n    // find index of last child in current column order\n    return columnOrder.findLastIndex((columnId) =>\n      column.columns.some((column) => column.id === columnId),\n    );\n  }\n  // standalone column (for the standalone column the first index is also the last index)\n  return columnOrder.indexOf(column.id);\n}\n\n/**\n * Finds a column by ID in the provided list of columns.\n */\nfunction findColumnById<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(\n  columnId: string,\n  columns: Column_Internal<TFeatures, TData, TValue>[],\n): Column_Internal<TFeatures, TData, TValue> | undefined {\n  return columns.find((c) => c.id === columnId);\n}\n\n/**\n * Returns the number of columns to move based on whether the column has child columns.\n */\nfunction getColumnsToMoveCount<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(column: Column_Internal<TFeatures, TData, TValue>): number {\n  return (\n    // for nested columns, move all child columns together\n    column.columns.length || // for standalone columns, move only itself\n    1\n  );\n}\n\n/**\n * Returns true, if the given column is pinned.\n * For nested column, returns true if all children are pinned or hidden.\n */\nfunction isColumnFullyPinnedOrHidden<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(\n  column: Column_Internal<TFeatures, TData, TValue> | undefined,\n  columnsPinned: ColumnPinningState,\n): boolean {\n  if (!column) {\n    return false;\n  }\n\n  if (!column.parent?.columns.length) {\n    return (\n      getIsColumnPinned(column.id, columnsPinned) ||\n      !(\n        // Requires a cast here to access the column visibility feature method, since the generic type\n        // of the column doesn't necessarily include the column visibility feature.\n        (\n          column as unknown as Column_Internal<\n            {\n              columnVisibilityFeature: typeof columnVisibilityFeature;\n            },\n            TData\n          >\n        ).getIsVisible()\n      )\n    );\n  }\n\n  // nested column is only an invalid target, if all its siblings are pinned\n  return column?.parent.columns.every(\n    (col) =>\n      getIsColumnPinned(col.id, columnsPinned) ||\n      !(\n        // Requires a cast here to access the column visibility feature method, since the generic type\n        // of the column doesn't necessarily include the column visibility feature.\n        (\n          col as unknown as Column_Internal<\n            {\n              columnVisibilityFeature: typeof columnVisibilityFeature;\n            },\n            TData\n          >\n        ).getIsVisible()\n      ),\n  );\n}\n\n/**\n * Retrieves new column order for moving a column left or right.\n *\n * @param currentColumnOrder - current column order\n * @param startIndex - current column index where the move starts\n * @param targetIndex - target index where the moved columns should be inserted\n * @param moveCount - how many columns to move based on column children\n */\nconst getNewColumnOrder = (\n  currentColumnOrder: string[],\n  startIndex: number,\n  targetIndex: number,\n  moveCount: number = 1,\n): string[] => {\n  // Extract the column(s) that should be moved\n  const newColumnOrder = [...currentColumnOrder];\n  const columnsToMove = newColumnOrder.splice(startIndex, moveCount);\n  // Insert the column(s) at the new position\n  newColumnOrder.splice(targetIndex, 0, ...columnsToMove);\n\n  return newColumnOrder;\n};\n\n/**\n * Gets the relevant columns to compare against when moving a column.\n */\nexport function getColumnsToCompareForMove<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(\n  table: Table_Internal<TFeatures, TData>,\n  column: Column_Internal<TFeatures, TData, TValue>,\n): Array<Column_Internal<TFeatures, TData, TValue>> {\n  if (column.columns.length > 0 || !column.parent) {\n    // For parent columns or standalone columns, use all center visible leaf columns\n    // Safe cast as we only need to align the piped generic types\n    return table.getCenterVisibleLeafColumnsWithoutBuiltIn() as Array<\n      Column_Internal<TFeatures, TData, TValue>\n    >;\n  }\n  // For child columns, use only their siblings (= visible leaf columns within the parent)\n  // Safe cast as we only need to align the piped generic types\n  return column.parent.getCenterVisibleLeafColumns() as Array<\n    Column_Internal<TFeatures, TData, TValue>\n  >;\n}\n\n/**\n * Moves a nested child column one position to the left within its parent group.\n * Skips pinned and hidden columns when determining the target position.\n */\nfunction moveNestedColumnLeft<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(\n  column: Column_Internal<TFeatures, TData, TValue>,\n  leafColumns: Array<Column_Internal<TFeatures, TData, TValue>>,\n  columnOrder: string[],\n  columnsPinned: ColumnPinningState,\n): string[] {\n  const columnIndex = columnOrder.indexOf(column.id);\n  let targetIndex = columnIndex - 1;\n\n  while (targetIndex >= 0) {\n    const targetColumnId = columnOrder[targetIndex];\n    const targetColumn = leafColumns.find((col) => col.id === targetColumnId);\n\n    if (\n      targetColumn &&\n      !getIsColumnPinned(targetColumn.id, columnsPinned) &&\n      // Requires a cast here to access the column visibility feature method, since the generic type\n      // of the column doesn't necessarily include the column visibility feature.\n      (\n        targetColumn as unknown as Column_Internal<\n          {\n            columnVisibilityFeature: typeof columnVisibilityFeature;\n          },\n          TData\n        >\n      ).getIsVisible()\n    ) {\n      // Found a valid target position\n      break;\n    }\n\n    // skip pinned and hidden columns\n    targetIndex--;\n  }\n\n  return getNewColumnOrder(columnOrder, columnIndex, targetIndex);\n}\n\n/**\n * Moves the current column one position to the left and updates the table state.\n *\n * Depending on whether the column is a nested column or a standalone column,\n * whether its neighboring columns are pinned, hidden, or nested,\n * we need to consider different scenarios to calculate the new column order correctly.\n *\n * CASE1: Column itself is a nested child column.\n *  - Constraint1: Can only move within the parent group.\n *  - Constraint2: Skip pinned siblings.\n *  - Constraint3: Skip hidden siblings.\n *\n * CASE2: Column is a standalone column or a parent column.\n *  - Constraint1: Skip entire nested columns as a whole.\n *  - Constraint2: Skip pinned columns.\n *  - Constraint3: Skip hidden columns.\n */\nexport function moveColumnLeft<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(\n  column: Column_Internal<TFeatures, TData, TValue>,\n  currentColumnOrder: ColumnOrderState,\n  columnsPinned: ColumnPinningState,\n  leafColumns: Array<Column_Internal<TFeatures, TData, TValue>>,\n): string[] {\n  // CASE1: Column itself is a nested child column.\n  if (column.parent) {\n    const newColumnOrder = moveNestedColumnLeft(\n      column,\n      leafColumns,\n      currentColumnOrder,\n      columnsPinned,\n    );\n    return newColumnOrder;\n  }\n\n  // CASE2: Column is a standalone column or a parent column.\n  const columnIndex = getFirstColumnIndex(column, currentColumnOrder);\n\n  // target is one position to the left\n  let currentTargetIndex = columnIndex - 1;\n\n  // we can't move past the first position\n  while (currentTargetIndex > 0) {\n    const currentTargetId = currentColumnOrder[currentTargetIndex];\n    const currentTargetColumn = findColumnById(currentTargetId, leafColumns);\n\n    // Constraint1: Skip nested columns as a whole.\n    if (currentTargetColumn?.parent) {\n      currentTargetIndex -= currentTargetColumn.parent.columns.length - 1;\n    }\n\n    // Constraint2: Skip pinned or hidden columns.\n    // For nested columns, skip if *entire group* is pinned or hidden.\n    if (isColumnFullyPinnedOrHidden(currentTargetColumn, columnsPinned)) {\n      currentTargetIndex--;\n      continue;\n    }\n\n    break; // found valid target\n  }\n\n  const columnsToMove = getColumnsToMoveCount(column);\n  const newColumnOrder = getNewColumnOrder(\n    currentColumnOrder,\n    columnIndex,\n    currentTargetIndex,\n    columnsToMove,\n  );\n\n  return newColumnOrder;\n}\n\n/**\n * Moves a nested child column one position to the right within its parent group.\n * Skips pinned and hidden columns when determining the target position.\n */\nfunction moveNestedColumnRight<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(\n  column: Column_Internal<TFeatures, TData, TValue>,\n  leafColumns: Array<Column_Internal<TFeatures, TData, TValue>>,\n  columnOrder: ColumnOrderState,\n  columnsPinned: ColumnPinningState,\n): string[] {\n  const columnIndex = columnOrder.indexOf(column.id);\n  let targetIndex = columnIndex + 1;\n\n  while (targetIndex < columnOrder.length) {\n    const targetColumnId = columnOrder[targetIndex];\n    const targetColumn = leafColumns.find((col) => col.id === targetColumnId);\n\n    if (\n      targetColumn &&\n      !getIsColumnPinned(targetColumn.id, columnsPinned) &&\n      // Requires a cast here to access the column visibility feature method, since the generic type\n      // of the column doesn't necessarily include the column visibility feature.\n      (\n        targetColumn as unknown as Column_Internal<\n          {\n            columnVisibilityFeature: typeof columnVisibilityFeature;\n          },\n          TData\n        >\n      ).getIsVisible()\n    ) {\n      // Found a valid target position\n      break;\n    }\n\n    // skip pinned and hidden columns\n    targetIndex++;\n  }\n\n  return getNewColumnOrder(columnOrder, columnIndex, targetIndex);\n}\n\n/**\n * Moves the current column one position to the right and returns the new column order.\n *\n * Depending on whether the column is a nested column or a standalone column,\n * whether its neighboring columns are pinned, hidden, or nested,\n * we need to consider different scenarios to calculate the new column order correctly.\n *\n * CASE1: Column itself is a nested child column.\n *  - Constraint1: Can only move within the parent group.\n *  - Constraint2: Skip pinned siblings.\n *  - Constraint3: Skip hidden siblings.\n *\n * CASE2: Column is a standalone column or a parent column.\n *  - Constraint1: Skip entire nested columns as a whole.\n *  - Constraint2: Skip pinned columns.\n *  - Constraint3: Skip hidden columns.\n */\nexport function moveColumnRight<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n  TValue extends CellData = CellData,\n>(\n  column: Column_Internal<TFeatures, TData, TValue>,\n  currentColumnOrder: ColumnOrderState,\n  columnsPinned: ColumnPinningState,\n  leafColumns: Array<Column_Internal<TFeatures, TData, TValue>>,\n): string[] {\n  // CASE1: Column itself is a nested child column.\n  if (column.parent) {\n    const newColumnOrder = moveNestedColumnRight(\n      column,\n      leafColumns,\n      currentColumnOrder,\n      columnsPinned,\n    );\n\n    return newColumnOrder;\n  }\n\n  // CASE2: Column is a standalone column or a parent column.\n  const columnIndex = getLastColumnIndex(column, currentColumnOrder);\n\n  // target is one position to the right\n  let currentTargetIndex = columnIndex + 1;\n\n  // we can't move past the last position\n  while (currentTargetIndex < currentColumnOrder.length - 1) {\n    const currentTargetId = currentColumnOrder[currentTargetIndex];\n    const currentTargetColumn = findColumnById(currentTargetId, leafColumns);\n\n    // Constraint1: Skip nested columns as a whole.\n    if (currentTargetColumn?.parent) {\n      currentTargetIndex += currentTargetColumn.parent.columns.length - 1;\n    }\n\n    // Constraint2: Skip pinned or hiddden columns.\n    // For nested columns, skip if *entire group* is pinned or hidden.\n    if (isColumnFullyPinnedOrHidden(currentTargetColumn, columnsPinned)) {\n      // skip pinned columns\n      currentTargetIndex++;\n      continue;\n    }\n\n    break; // found valid target\n  }\n\n  const hasChildren = column.columns.length > 0;\n  const startIndex = hasChildren\n    ? // We used the last child index as start index,\n      // so we need to adjust it to the first child index here.\n      columnIndex - (column.columns.length - 1)\n    : columnIndex;\n  const targetIndex = hasChildren\n    ? // We used the last child to calculate the target index,\n      // so we need to adjust it here.\n      currentTargetIndex - (column.columns.length - 1)\n    : currentTargetIndex;\n  const columnsToMove = getColumnsToMoveCount(column);\n  const newColumnOrder = getNewColumnOrder(\n    currentColumnOrder,\n    startIndex,\n    targetIndex,\n    columnsToMove,\n  );\n\n  return newColumnOrder;\n}\n"],
+  "mappings": "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",
   "names": ["column", "newColumnOrder"]
 }

package/esm/tables/DataTable/features/ColumnOrder/column-order-validation.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/tables/DataTable/features/ColumnOrder/column-order-validation.ts"],
-  "sourcesContent": ["import { devLog } from '../../../../core/utils/logging.js';\nimport { isDataTableGroupColumnDef } from '../../hooks/useColumns.js';\nimport type {\n  DataTableColumnDef,\n  DataTableGroupColumnDef,\n} from '../../public.api.js';\n\n/**\n * Extracts the column order as specified in a column definition.\n * Also saves all encountered column groups an array.\n *\n * @param columns - column definition\n * @returns extracted column order and column groups\n */\nexport function extractColumnOrderAndGroups<T>(\n  columns: DataTableColumnDef<T>[],\n): {\n  columnOrder: string[];\n  columnGroups: string[][];\n} {\n  const columnGroups: string[][] = [];\n  const columnOrder = columns.flatMap((column: DataTableColumnDef<T>) => {\n    if (isDataTableGroupColumnDef(column)) {\n      const leafColumnsIds = (\n        column as DataTableGroupColumnDef<T, unknown>\n      ).columns?.map((column) => column.id);\n      leafColumnsIds && columnGroups?.push(leafColumnsIds);\n      return leafColumnsIds || [];\n    }\n    return column.id;\n  });\n  return { columnOrder, columnGroups };\n}\n\n/**\n * Validates a passed column order. Removes duplicated and invalid ids, adds missing ids\n * and ensures child columns with the same parent are placed next to each other.\n *\n * @param columnOrder - column order to validate\n * @param columnOrderFromDefinition - column order as defined in the column definition (valid)\n * @param columnGroups - array of all column groups, each group is an arry of ids\n * @returns corrected, valid column order or null if the order was already valid\n */\nexport function validateColumnOrder(\n  columnOrder: string[],\n  columnOrderFromDefinition: string[],\n  columnGroups: string[][],\n): string[] | null {\n  const _columnOrderFromDefinition = [...columnOrderFromDefinition];\n  const _columnGroups = [...columnGroups];\n  let validColumnOrder = [...columnOrder];\n  let isInvalid = false;\n\n  // check for duplicate ids and remove them\n  const columnOrderDuplicatesRemoved = Array.from(new Set(columnOrder));\n\n  const defaultColumnOrderSet = new Set(_columnOrderFromDefinition);\n  const columnOrderSet = new Set(columnOrderDuplicatesRemoved);\n\n  if (validColumnOrder.length !== columnOrderDuplicatesRemoved.length) {\n    isInvalid = true;\n    validColumnOrder = columnOrderDuplicatesRemoved;\n    devLog(\n      'The specified column order contains duplicate values. These have been removed.',\n    );\n  }\n\n  // check for invalid ids that don't exist in the column definition and remove them\n  validColumnOrder = validColumnOrder.filter((columnId) =>\n    defaultColumnOrderSet.has(columnId),\n  );\n\n  if (validColumnOrder.length !== columnOrderDuplicatesRemoved.length) {\n    isInvalid = true;\n    devLog(\n      \"The specified column order contains ids that don't exist in the column definition. These have been removed.\",\n    );\n  }\n\n  // check for column ids that are missing in the column order and add them\n  const missingIds = _columnOrderFromDefinition.filter(\n    (columnId) => !columnOrderSet.has(columnId),\n  );\n  validColumnOrder.push(...missingIds);\n\n  if (missingIds.length > 0) {\n    isInvalid = true;\n    devLog(\n      'The specified column order does not contain all column ids. Missing columns have been appended at the end.',\n    );\n  }\n\n  // ensure columns with the same parent are not separated in the column order\n  _columnGroups.forEach(([...siblingColumnIds]) => {\n    // find the index of the first occurrence of a sibling's id in the valid column order\n    const firstChildIndex = validColumnOrder.findIndex((columnId) => {\n      const columnIndex = siblingColumnIds.indexOf(columnId);\n      if (columnIndex !== -1) {\n        // remove first child from sibling array as it will remain in this position\n        siblingColumnIds.splice(columnIndex, 1);\n        return true;\n      }\n      return false;\n    });\n\n    const areSiblingsAdjacent = [...validColumnOrder]\n      .splice(firstChildIndex + 1, siblingColumnIds.length)\n      .every((columnId) => {\n        return siblingColumnIds.includes(columnId);\n      });\n\n    if (!areSiblingsAdjacent) {\n      isInvalid = true;\n      devLog(\n        'The specified column order is invalid, child columns with the same parent must be next to each other. The order has been corrected.',\n      );\n\n      const extractedColumnIds: string[] = [];\n      // extract all sibling column ids except the first one\n      validColumnOrder = validColumnOrder.filter((columnId) => {\n        if (siblingColumnIds.includes(columnId)) {\n          extractedColumnIds.push(columnId);\n          return false;\n        }\n        return true;\n      });\n\n      validColumnOrder.splice(firstChildIndex + 1, 0, ...extractedColumnIds);\n    }\n  });\n\n  return isInvalid ? validColumnOrder : null;\n}\n"],
-  "mappings": "AAAA,SAAS,cAAc;AACvB,SAAS,iCAAiC;AAanC,SAAS,4BACd,SAIA;AACA,QAAM,eAA2B,CAAC;AAClC,QAAM,cAAc,QAAQ,QAAQ,CAAC,WAAkC;AACrE,QAAI,0BAA0B,MAAM,GAAG;AACrC,YAAM,iBACJ,OACA,SAAS,IAAI,CAACA,YAAWA,QAAO,EAAE;AACpC,wBAAkB,cAAc,KAAK,cAAc;AACnD,aAAO,kBAAkB,CAAC;AAAA,IAC5B;AACA,WAAO,OAAO;AAAA,EAChB,CAAC;AACD,SAAO,EAAE,aAAa,aAAa;AACrC;AAWO,SAAS,oBACd,aACA,2BACA,cACiB;AACjB,QAAM,6BAA6B,CAAC,GAAG,yBAAyB;AAChE,QAAM,gBAAgB,CAAC,GAAG,YAAY;AACtC,MAAI,mBAAmB,CAAC,GAAG,WAAW;AACtC,MAAI,YAAY;AAGhB,QAAM,+BAA+B,MAAM,KAAK,IAAI,IAAI,WAAW,CAAC;AAEpE,QAAM,wBAAwB,IAAI,IAAI,0BAA0B;AAChE,QAAM,iBAAiB,IAAI,IAAI,4BAA4B;AAE3D,MAAI,iBAAiB,WAAW,6BAA6B,QAAQ;AACnE,gBAAY;AACZ,uBAAmB;AACnB;AAAA,MACE;AAAA,IACF;AAAA,EACF;AAGA,qBAAmB,iBAAiB;AAAA,IAAO,CAAC,aAC1C,sBAAsB,IAAI,QAAQ;AAAA,EACpC;AAEA,MAAI,iBAAiB,WAAW,6BAA6B,QAAQ;AACnE,gBAAY;AACZ;AAAA,MACE;AAAA,IACF;AAAA,EACF;AAGA,QAAM,aAAa,2BAA2B;AAAA,IAC5C,CAAC,aAAa,CAAC,eAAe,IAAI,QAAQ;AAAA,EAC5C;AACA,mBAAiB,KAAK,GAAG,UAAU;AAEnC,MAAI,WAAW,SAAS,GAAG;AACzB,gBAAY;AACZ;AAAA,MACE;AAAA,IACF;AAAA,EACF;AAGA,gBAAc,QAAQ,CAAC,CAAI,mBAAgB,MAAM;AAE/C,UAAM,kBAAkB,iBAAiB,UAAU,CAAC,aAAa;AAC/D,YAAM,cAAc,iBAAiB,QAAQ,QAAQ;AACrD,UAAI,gBAAgB,IAAI;AAEtB,yBAAiB,OAAO,aAAa,CAAC;AACtC,eAAO;AAAA,MACT;AACA,aAAO;AAAA,IACT,CAAC;AAED,UAAM,sBAAsB,CAAC,GAAG,gBAAgB,EAC7C,OAAO,kBAAkB,GAAG,iBAAiB,MAAM,EACnD,MAAM,CAAC,aAAa;AACnB,aAAO,iBAAiB,SAAS,QAAQ;AAAA,IAC3C,CAAC;AAEH,QAAI,CAAC,qBAAqB;AACxB,kBAAY;AACZ;AAAA,QACE;AAAA,MACF;AAEA,YAAM,qBAA+B,CAAC;AAEtC,yBAAmB,iBAAiB,OAAO,CAAC,aAAa;AACvD,YAAI,iBAAiB,SAAS,QAAQ,GAAG;AACvC,6BAAmB,KAAK,QAAQ;AAChC,iBAAO;AAAA,QACT;AACA,eAAO;AAAA,MACT,CAAC;AAED,uBAAiB,OAAO,kBAAkB,GAAG,GAAG,GAAG,kBAAkB;AAAA,IACvE;AAAA,EACF,CAAC;AAED,SAAO,YAAY,mBAAmB;AACxC;",
+  "sourcesContent": ["import { devLog } from '../../../../core/utils/logging.js';\nimport { isDataTableGroupColumnDef } from '../../hooks/useColumns.js';\nimport type {\n  DataTableColumnDef,\n  DataTableGroupColumnDef,\n  DataTableRowData,\n} from '../../public.api.js';\n\n/**\n * Extracts the column order as specified in a column definition.\n * Also saves all encountered column groups an array.\n *\n * @param columns - column definition\n * @returns extracted column order and column groups\n */\nexport function extractColumnOrderAndGroups<TData extends DataTableRowData>(\n  columns: DataTableColumnDef<TData>[],\n): {\n  columnOrder: string[];\n  columnGroups: string[][];\n} {\n  const columnGroups: string[][] = [];\n  const columnOrder = columns.flatMap((column: DataTableColumnDef<TData>) => {\n    if (isDataTableGroupColumnDef(column)) {\n      const leafColumnsIds = (\n        column as DataTableGroupColumnDef<TData, unknown>\n      ).columns?.map((column) => column.id);\n      leafColumnsIds && columnGroups?.push(leafColumnsIds);\n      return leafColumnsIds || [];\n    }\n    return column.id;\n  });\n  return { columnOrder, columnGroups };\n}\n\n/**\n * Validates a passed column order. Removes duplicated and invalid ids, adds missing ids\n * and ensures child columns with the same parent are placed next to each other.\n *\n * @param columnOrder - column order to validate\n * @param columnOrderFromDefinition - column order as defined in the column definition (valid)\n * @param columnGroups - array of all column groups, each group is an arry of ids\n * @returns corrected, valid column order or null if the order was already valid\n */\nexport function validateColumnOrder(\n  columnOrder: string[],\n  columnOrderFromDefinition: string[],\n  columnGroups: string[][],\n): string[] | null {\n  const _columnOrderFromDefinition = [...columnOrderFromDefinition];\n  const _columnGroups = [...columnGroups];\n  let validColumnOrder = [...columnOrder];\n  let isInvalid = false;\n\n  // check for duplicate ids and remove them\n  const columnOrderDuplicatesRemoved = Array.from(new Set(columnOrder));\n\n  const defaultColumnOrderSet = new Set(_columnOrderFromDefinition);\n  const columnOrderSet = new Set(columnOrderDuplicatesRemoved);\n\n  if (validColumnOrder.length !== columnOrderDuplicatesRemoved.length) {\n    isInvalid = true;\n    validColumnOrder = columnOrderDuplicatesRemoved;\n    devLog(\n      'The specified column order contains duplicate values. These have been removed.',\n    );\n  }\n\n  // check for invalid ids that don't exist in the column definition and remove them\n  validColumnOrder = validColumnOrder.filter((columnId) =>\n    defaultColumnOrderSet.has(columnId),\n  );\n\n  if (validColumnOrder.length !== columnOrderDuplicatesRemoved.length) {\n    isInvalid = true;\n    devLog(\n      \"The specified column order contains ids that don't exist in the column definition. These have been removed.\",\n    );\n  }\n\n  // check for column ids that are missing in the column order and add them\n  const missingIds = _columnOrderFromDefinition.filter(\n    (columnId) => !columnOrderSet.has(columnId),\n  );\n  validColumnOrder.push(...missingIds);\n\n  if (missingIds.length > 0) {\n    isInvalid = true;\n    devLog(\n      'The specified column order does not contain all column ids. Missing columns have been appended at the end.',\n    );\n  }\n\n  // ensure columns with the same parent are not separated in the column order\n  _columnGroups.forEach(([...siblingColumnIds]) => {\n    // find the index of the first occurrence of a sibling's id in the valid column order\n    const firstChildIndex = validColumnOrder.findIndex((columnId) => {\n      const columnIndex = siblingColumnIds.indexOf(columnId);\n      if (columnIndex !== -1) {\n        // remove first child from sibling array as it will remain in this position\n        siblingColumnIds.splice(columnIndex, 1);\n        return true;\n      }\n      return false;\n    });\n\n    const areSiblingsAdjacent = [...validColumnOrder]\n      .splice(firstChildIndex + 1, siblingColumnIds.length)\n      .every((columnId) => {\n        return siblingColumnIds.includes(columnId);\n      });\n\n    if (!areSiblingsAdjacent) {\n      isInvalid = true;\n      devLog(\n        'The specified column order is invalid, child columns with the same parent must be next to each other. The order has been corrected.',\n      );\n\n      const extractedColumnIds: string[] = [];\n      // extract all sibling column ids except the first one\n      validColumnOrder = validColumnOrder.filter((columnId) => {\n        if (siblingColumnIds.includes(columnId)) {\n          extractedColumnIds.push(columnId);\n          return false;\n        }\n        return true;\n      });\n\n      validColumnOrder.splice(firstChildIndex + 1, 0, ...extractedColumnIds);\n    }\n  });\n\n  return isInvalid ? validColumnOrder : null;\n}\n"],
+  "mappings": "AAAA,SAAS,cAAc;AACvB,SAAS,iCAAiC;AAcnC,SAAS,4BACd,SAIA;AACA,QAAM,eAA2B,CAAC;AAClC,QAAM,cAAc,QAAQ,QAAQ,CAAC,WAAsC;AACzE,QAAI,0BAA0B,MAAM,GAAG;AACrC,YAAM,iBACJ,OACA,SAAS,IAAI,CAACA,YAAWA,QAAO,EAAE;AACpC,wBAAkB,cAAc,KAAK,cAAc;AACnD,aAAO,kBAAkB,CAAC;AAAA,IAC5B;AACA,WAAO,OAAO;AAAA,EAChB,CAAC;AACD,SAAO,EAAE,aAAa,aAAa;AACrC;AAWO,SAAS,oBACd,aACA,2BACA,cACiB;AACjB,QAAM,6BAA6B,CAAC,GAAG,yBAAyB;AAChE,QAAM,gBAAgB,CAAC,GAAG,YAAY;AACtC,MAAI,mBAAmB,CAAC,GAAG,WAAW;AACtC,MAAI,YAAY;AAGhB,QAAM,+BAA+B,MAAM,KAAK,IAAI,IAAI,WAAW,CAAC;AAEpE,QAAM,wBAAwB,IAAI,IAAI,0BAA0B;AAChE,QAAM,iBAAiB,IAAI,IAAI,4BAA4B;AAE3D,MAAI,iBAAiB,WAAW,6BAA6B,QAAQ;AACnE,gBAAY;AACZ,uBAAmB;AACnB;AAAA,MACE;AAAA,IACF;AAAA,EACF;AAGA,qBAAmB,iBAAiB;AAAA,IAAO,CAAC,aAC1C,sBAAsB,IAAI,QAAQ;AAAA,EACpC;AAEA,MAAI,iBAAiB,WAAW,6BAA6B,QAAQ;AACnE,gBAAY;AACZ;AAAA,MACE;AAAA,IACF;AAAA,EACF;AAGA,QAAM,aAAa,2BAA2B;AAAA,IAC5C,CAAC,aAAa,CAAC,eAAe,IAAI,QAAQ;AAAA,EAC5C;AACA,mBAAiB,KAAK,GAAG,UAAU;AAEnC,MAAI,WAAW,SAAS,GAAG;AACzB,gBAAY;AACZ;AAAA,MACE;AAAA,IACF;AAAA,EACF;AAGA,gBAAc,QAAQ,CAAC,CAAI,mBAAgB,MAAM;AAE/C,UAAM,kBAAkB,iBAAiB,UAAU,CAAC,aAAa;AAC/D,YAAM,cAAc,iBAAiB,QAAQ,QAAQ;AACrD,UAAI,gBAAgB,IAAI;AAEtB,yBAAiB,OAAO,aAAa,CAAC;AACtC,eAAO;AAAA,MACT;AACA,aAAO;AAAA,IACT,CAAC;AAED,UAAM,sBAAsB,CAAC,GAAG,gBAAgB,EAC7C,OAAO,kBAAkB,GAAG,iBAAiB,MAAM,EACnD,MAAM,CAAC,aAAa;AACnB,aAAO,iBAAiB,SAAS,QAAQ;AAAA,IAC3C,CAAC;AAEH,QAAI,CAAC,qBAAqB;AACxB,kBAAY;AACZ;AAAA,QACE;AAAA,MACF;AAEA,YAAM,qBAA+B,CAAC;AAEtC,yBAAmB,iBAAiB,OAAO,CAAC,aAAa;AACvD,YAAI,iBAAiB,SAAS,QAAQ,GAAG;AACvC,6BAAmB,KAAK,QAAQ;AAChC,iBAAO;AAAA,QACT;AACA,eAAO;AAAA,MACT,CAAC;AAED,uBAAiB,OAAO,kBAAkB,GAAG,GAAG,GAAG,kBAAkB;AAAA,IACvE;AAAA,EACF,CAAC;AAED,SAAO,YAAY,mBAAmB;AACxC;",
   "names": ["column"]
 }

package/esm/tables/DataTable/features/ColumnOrder/useColumnOrder.js

@@ -0,0 +1,81 @@
+import {
+  functionalUpdate
+} from "@tanstack/react-table";
+import { isEqual } from "lodash-es";
+import { useCallback, useLayoutEffect, useRef } from "react";
+import {
+  extractColumnOrderAndGroups,
+  validateColumnOrder
+} from "./column-order-validation.js";
+import { useCallbackRef } from "../../../../core/hooks/useCallbackRef.js";
+import { useControllableState } from "../../../../core/hooks/useControllableState.js";
+function useColumnOrder(props, options) {
+  options.enableColumnOrdering = false;
+  const { columnOrder: columnOrderFromDefinition, columnGroups } = extractColumnOrderAndGroups(props.columns);
+  const lastValidColumnOrder = useRef(
+    columnOrderFromDefinition
+  );
+  const lastColumnOrderFromDefinition = useRef(
+    columnOrderFromDefinition
+  );
+  const [columnOrder, setColumnOrder] = useControllableState({
+    value: props.columnOrder,
+    // if no order was specified, initialize with column definition order
+    defaultValue: props.defaultColumnOrder || columnOrderFromDefinition
+  });
+  const onColumnOrderChangeProp = useCallbackRef(props.onColumnOrderChange);
+  const onColumnOrderChangeCallback = useCallback(
+    (updater, trigger = "user") => {
+      const nextState = functionalUpdate(
+        updater,
+        options.state?.columnOrder ?? columnOrder
+      );
+      if (!isEqual(nextState, columnOrder)) {
+        setColumnOrder(nextState);
+        if (trigger !== "internal") {
+          onColumnOrderChangeProp(nextState, trigger);
+        }
+      }
+    },
+    [setColumnOrder, onColumnOrderChangeProp, columnOrder, options]
+  );
+  useLayoutEffect(() => {
+    if (!props.columnOrdering) {
+      return;
+    }
+    if (props.columnOrder === void 0 && !isEqual(lastColumnOrderFromDefinition.current, columnOrderFromDefinition)) {
+      lastColumnOrderFromDefinition.current = columnOrderFromDefinition;
+      setColumnOrder(columnOrderFromDefinition);
+      onColumnOrderChangeProp(columnOrderFromDefinition, "internal");
+      return;
+    }
+    if (!isEqual(columnOrder, lastValidColumnOrder.current)) {
+      const validColumnOrder = validateColumnOrder(
+        columnOrder,
+        columnOrderFromDefinition,
+        columnGroups
+      );
+      if (validColumnOrder === null) {
+        lastValidColumnOrder.current = columnOrder;
+      } else {
+        lastValidColumnOrder.current = validColumnOrder;
+        setColumnOrder(validColumnOrder);
+        onColumnOrderChangeProp(validColumnOrder, "internal");
+      }
+    }
+  });
+  if (!props.columnOrdering) {
+    return;
+  }
+  options.enableColumnOrdering = true;
+  options.state = {
+    ...options.state,
+    columnOrder
+  };
+  options.onColumnOrderChange = onColumnOrderChangeCallback;
+  options.originalColumnOrder = props.defaultColumnOrder ?? lastValidColumnOrder.current;
+}
+export {
+  useColumnOrder
+};
+//# sourceMappingURL=useColumnOrder.js.map