react-table-dnd 2.0.6 → 2.0.8

package/README.md

@@ -51,14 +51,14 @@
 npm install react-table-dnd
 ```
 
-Then import the required CSS once in your app (e.g. `main.tsx` / `index.js`):
+> Requires `react` and `react-dom` >= 18.0.0
+
+Then import the styles once in your app entry (e.g. `main.tsx`):
 
 ```js
-import 'react-table-dnd/dist/react-table-dnd.css'
+import 'react-table-dnd/styles'
 ```
 
-> Requires `react` and `react-dom` >= 18.0.0
-
 ## Quick Start
 
 ```jsx

package/dist/index.cjs.js

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));let c=require(`react`);c=s(c);let l=require(`react/jsx-runtime`),u=require(`react-dom`),d=require(`classnames`);d=s(d);var f=({children:e,className:t})=>(0,l.jsx)(`div`,{"data-flexitable-root":``,className:t??``,children:e}),p=(0,c.createContext)(null),m=e=>{let t=(0,c.useContext)(p);if(!t)throw Error(`useTableStore must be used within TableProvider`);return(0,c.useSyncExternalStore)(t.subscribe,()=>e(t.getState()))},h=()=>{let e=(0,c.useContext)(p);if(!e)throw Error(`useTableDispatch must be used within TableProvider`);return e.dispatch},g=()=>{let e=(0,c.useContext)(p);if(!e)throw Error(`useTable must be used within a TableProvider`);return{state:(0,c.useSyncExternalStore)(e.subscribe,e.getState),dispatch:e.dispatch}};function _(e,t){let n=t,r=new Set;return{getState:()=>n,dispatch(t){n=e(n,t),r.forEach(e=>e())},subscribe(e){return r.add(e),()=>{r.delete(e)}}}}var v=30,y=e=>{let{headerRef:t,bodyRef:n}=e,r=(0,c.useRef)(null),i=(0,c.useRef)(t),a=(0,c.useRef)(!1),o=(0,c.useRef)(!1),s=(0,c.useRef)(0),l=(0,c.useRef)(null),u=(0,c.useRef)({x:0,y:0}),d=(0,c.useRef)(null),f=(0,c.useCallback)(e=>{d.current=e},[]),p=(0,c.useCallback)(()=>{o.current=!1,a.current=!1,l.current!==null&&(cancelAnimationFrame(l.current),l.current=null)},[]),m=(0,c.useCallback)((e,t,n)=>{let c=n===`vertical`,f=c?o:a;if(!f.current)return;let p=d.current;if(p){let e=u.current;if(c){let t=e.y<p.top+v,n=e.y>p.bottom-v;if(!t&&!n){f.current=!1;return}}else{let t=e.x<p.left+v,n=e.x>p.right-v;if(!t&&!n){f.current=!1;return}}}let m=c?t.scrollHeight-t.clientHeight:t.scrollWidth-t.clientWidth;if(c)t.scrollTop+=e;else{t.scrollLeft+=e;let n=i.current;n?.current&&(n.current.scrollLeft=t.scrollLeft)}let h=c?t.scrollTop:t.scrollLeft;if(h>=m||h<=0){f.current=!1;return}s.current+=e/1e3,l.current=requestAnimationFrame(()=>r.current?.(e+s.current,t,n))},[]);return(0,c.useEffect)(()=>{r.current=m},[m]),{startAutoScroll:(0,c.useCallback)((e,t,n)=>{let r=n===`vertical`?o:a;r.current||(r.current=!0,s.current=0,l.current=requestAnimationFrame(()=>m(e,t,n)))},[m]),stopAutoScroll:p,setContainerRect:f,isAutoScrollingVertical:o,isAutoScrollingHorizontal:a,pointerRef:u,BodyScrollHandle:(0,c.useCallback)(e=>{t?.current&&e.currentTarget&&(t.current.scrollLeft=e.currentTarget.scrollLeft)},[t]),HeaderScrollHandle:(0,c.useCallback)(e=>{n?.current&&e.currentTarget&&(n.current.scrollLeft=e.currentTarget.scrollLeft)},[n])}},b=300,x=8,S=.92,C=.5;function w(e,t,n,r){let i=(0,c.useRef)(null),a=(0,c.useRef)({x:0,y:0}),o=(0,c.useRef)(null),s=(0,c.useRef)(!1),l=(0,c.useRef)(null),u=(0,c.useRef)(null),d=(0,c.useCallback)(()=>{u.current!==null&&(cancelAnimationFrame(u.current),u.current=null)},[]),f=(0,c.useCallback)(()=>{i.current&&=(clearTimeout(i.current),null),o.current=null,l.current&&=(l.current(),null)},[]);return{touchStart:(0,c.useCallback)(c=>{if(c.target===c.currentTarget)return;let p=c.target,m=!1;for(;p&&!(p.dataset?.contextid||p.dataset?.disabled===`true`);){if(p.dataset?.id){m=!0;break}p=p.parentNode}if(!m)return;d(),f(),s.current=!0,window.getSelection()?.removeAllRanges();let h=c.touches[0];a.current={x:h.clientX,y:h.clientY},o.current=c;let g=e.tableRef?.current;if(!g)return;let _=!1,v=!1,y=h.clientY,w=h.clientX,T=0,E=0,D=Date.now(),O=e=>e.preventDefault();document.addEventListener(`selectstart`,O);let k=(t=>{let n=e.bodyRef?.current,r=t;for(;r&&r!==n;){let e=window.getComputedStyle(r),t=e.overflowY,n=e.overflowX,i=(t===`auto`||t===`scroll`)&&r.scrollHeight>r.clientHeight,a=(n===`auto`||n===`scroll`)&&r.scrollWidth>r.clientWidth;if(i||a)return r;r=r.parentElement}return n??document.body})(c.target),A=t=>{t.preventDefault();let n=t.touches[0],s=Date.now(),c=Math.max(s-D,1);if(D=s,v){let t=n.clientY-y,r=n.clientX-w;if(k){let n=e.bodyRef?.current,i=t>0&&k.scrollTop<=0,a=t<0&&k.scrollTop+k.clientHeight>=k.scrollHeight-1,o=r>0&&k.scrollLeft<=0,s=r<0&&k.scrollLeft+k.clientWidth>=k.scrollWidth-1,c=i||a,l=o||s;k===n?(k.scrollTop-=t,k.scrollLeft-=r):(l||(k.scrollLeft-=r),c||(k.scrollTop-=t),n&&(c&&(n.scrollTop-=t),l&&(n.scrollLeft-=r)))}T=-t/c*16,E=-r/c*16,y=n.clientY,w=n.clientX}else if(_)r(n.clientX,n.clientY);else{let e=n.clientX-a.current.x,t=n.clientY-a.current.y;(Math.abs(e)>x||Math.abs(t)>x)&&(i.current&&=(clearTimeout(i.current),null),o.current=null,v=!0,y=n.clientY,w=n.clientX,T=0,E=0,D=Date.now())}},j=()=>{if(_)M(),n();else{if(f(),v&&k&&(Math.abs(T)>C||Math.abs(E)>C)){let e=k,t=()=>{T*=S,E*=S,e.scrollTop+=T,e.scrollLeft+=E,Math.abs(T)>C||Math.abs(E)>C?u.current=requestAnimationFrame(t):u.current=null};u.current=requestAnimationFrame(t)}setTimeout(()=>{s.current=!1},400)}},M=()=>{g.removeEventListener(`touchmove`,A),g.removeEventListener(`touchend`,j),g.removeEventListener(`touchcancel`,j),document.removeEventListener(`selectstart`,O),l.current=null};g.addEventListener(`touchmove`,A,{passive:!1}),g.addEventListener(`touchend`,j,!1),g.addEventListener(`touchcancel`,j,!1),l.current=M,i.current=setTimeout(()=>{i.current=null,_=!0;let e=o.current;o.current=null,e&&t(e,h.clientX,h.clientY)},b)},[t,n,r,f,d,e.tableRef?.current,e.bodyRef?.current]),cancelLongPress:f,isTouchActiveRef:s}}var T=`transform 450ms cubic-bezier(0.2, 0, 0, 1)`,E=(e,t,n,r)=>{let i=(0,c.useRef)({width:0,height:0}),a=(0,c.useRef)(null),o=(0,c.useRef)(new Set),s=(0,c.useRef)(new Set),l=(0,c.useRef)(new Map),u=(0,c.useCallback)((t,n,r,a)=>{let o=e.placeholderRef?.current;if(!o||!t){o&&(o.style.display=`none`);return}let s=i.current,c=t.getBoundingClientRect(),l=e.tableRef?.current?.getBoundingClientRect(),u=(n??0)<(r??0);o.style.display=`block`,a===`row`?(o.style.top=`${u?c.top+c.height-s.height:c.top}px`,o.style.left=`${l?.left??c.left}px`,o.style.width=`${l?.width??c.width}px`,o.style.height=`${s.height}px`):(o.style.top=`${l?.top??c.top}px`,o.style.left=`${u?c.left+c.width-s.width:c.left}px`,o.style.width=`${s.width}px`,o.style.height=`${l?.height??c.height}px`)},[e.placeholderRef,e.tableRef]);return{applyShiftTransforms:(0,c.useCallback)((e,c,d)=>{if(e===null||c===null)return;let f=i.current,p=a.current,m=p===null,h=m?-1/0:Math.min(p,c,e)-1,g=m?1/0:Math.max(p,c,e)+1,_=null,v=(d===`row`?t.current:n.current).get(c);v&&(_=v.outer),u(_,e,c,d);let y=(t,n,r)=>{let i=(t,i,a)=>{let s=``;t>e&&t<=c?s=`translate${n}(-${r}px)`:t<e&&t>=c&&(s=`translate${n}(${r}px)`),a.style.transform=s,a.style.transition=t===e?`none`:T,s&&o.current.add(a),t===c?i.setAttribute(`data-drop-target`,`true`):i.removeAttribute(`data-drop-target`)};if(m)for(let[e,{outer:n,inner:r}]of t)i(e,n,r);else for(let e=h;e<=g;e++){let n=t.get(e);n&&i(e,n.outer,n.inner)}};if(d===`row`)y(t.current,`Y`,f.height);else if(d===`column`){y(n.current,`X`,f.width);let t=r.current,i=l.current,a=(t,n,r)=>{let a=``;t>e&&t<=c?a=`translateX(-${f.width}px)`:t<e&&t>=c&&(a=`translateX(${f.width}px)`);for(let e of n)i.get(e)!==a&&(e.style.transform=a,r&&(e.style.transition=T),i.set(e,a),a&&s.current.add(e))};if(m)for(let[e,n]of t)a(e,n,!0);else for(let e=h;e<=g;e++){let n=t.get(e);n&&a(e,n,!1)}}a.current=c},[u,t,n,r]),clearShiftTransforms:(0,c.useCallback)(()=>{let t=e.placeholderRef?.current;t&&(t.style.display=`none`);for(let e of o.current){e.style.transition=`none`,e.style.transform=``;let t=e.parentElement;t&&t.removeAttribute(`data-drop-target`)}o.current.clear();for(let e of s.current)e.style.transition=`none`,e.style.transform=``;s.current.clear(),l.current.clear(),a.current=null},[e.placeholderRef]),prevTargetIndexRef:a,draggedSizeRef:i}},D=e=>{let t=(0,c.useRef)(new Map),n=(0,c.useRef)(new Map),r=(0,c.useRef)(new Map),i=(0,c.useRef)(!1),a=(0,c.useCallback)(()=>{t.current.clear(),n.current.clear(),r.current.clear()},[]),o=(0,c.useCallback)(e=>{t.current.clear();let n=e.querySelectorAll(`.draggable[data-type="row"]`);for(let e=0;e<n.length;e++){let r=n[e],i=r.dataset.index;if(i===void 0)continue;let a=r.firstElementChild;a&&t.current.set(+i,{outer:r,inner:a})}},[]),s=(0,c.useCallback)(e=>{n.current.clear();let t=e.querySelectorAll(`.draggable[data-type="column"]`);for(let e=0;e<t.length;e++){let r=t[e],i=r.dataset.index;if(i===void 0)continue;let a=r.firstElementChild;a&&n.current.set(+i,{outer:r,inner:a})}},[]),l=(0,c.useCallback)(e=>{r.current.clear();let t=e.querySelectorAll(`.td[data-col-index]`);for(let e=0;e<t.length;e++){let n=t[e],i=+n.dataset.colIndex;r.current.has(i)||r.current.set(i,[]),r.current.get(i).push(n)}},[]);return{rowIndexMapRef:t,colIndexMapRef:n,cellIndexMapRef:r,mapStaleRef:i,buildMaps:(0,c.useCallback)((t,n)=>{if(a(),n){if(t===`row`)o(n);else if(t===`column`){let t=e.headerRef?.current;t&&s(t),l(n)}}},[e.headerRef,a,o,s,l]),rebuildRowMap:(0,c.useCallback)(e=>{i.current=!1,o(e)},[o]),rebuildColumnMaps:(0,c.useCallback)((e,t)=>{i.current=!1,t&&s(t),l(e)},[s,l]),checkStaleness:(0,c.useCallback)(()=>{if(!i.current){if(t.current.size>0){let e=t.current.values().next().value;if(e&&!e.outer.isConnected){i.current=!0;return}}if(n.current.size>0){let e=n.current.values().next().value;e&&!e.outer.isConnected&&(i.current=!0)}}},[]),clearMaps:a}},O=(e,t)=>{let n=e,r=0,i=t.length-1;for(;r<i;){let e=Math.floor((r+i)/2),a=t[e];if(a.itemTop<=n&&n<=a.itemBottom)return n<a.itemTop+a.height/2?+a.index:+a.index+1;n<a.itemTop?i=e-1:r=e+1}return+t[r].index},k=(e,t)=>{let n=e,r=0,i=t.length-1;for(;r<i;){let e=Math.floor((r+i)/2),a=t[e];if(a.itemLeft<=n&&n<=a.itemRight)return n<a.itemLeft+a.width/2?+a.index:+a.index+1;n<a.itemLeft?i=e-1:r=e+1}return+t[r].index};function A(e,t,n){let r=n.getBoundingClientRect();return e>r.left+n.clientWidth||t>r.top+n.clientHeight}var j=(e,t,n)=>{let r=Number(e);return t!==void 0&&r<t||n!==void 0&&r>n},M=(e,t)=>{let n=(0,c.useRef)(null),r=(0,c.useRef)(null),i=(0,c.useCallback)(()=>{let n=e.bodyRef?.current;if(!n)return null;let r=n.scrollTop,i=n.getBoundingClientRect().top,a=n.querySelectorAll(`.draggable[data-type="row"]`),o=[];for(let e=0;e<a.length;e++){let t=a[e];if(t.dataset.index===void 0)continue;let n=t.getBoundingClientRect(),s=n.top-i+r;o.push({height:n.height,itemTop:s,itemBottom:s+n.height,index:t.dataset.index})}let{start:s,end:c}=t.rowDragRange;return(s||c)&&(o=o.filter(e=>(!s||+e.index>=s)&&(!c||+e.index<=c))),o},[e.bodyRef,t.rowDragRange]),a=(0,c.useCallback)(()=>{let n=e.headerRef?.current;if(!n||!n.children[0])return null;let r=Array.from(n.children[0].children).map(e=>{let t=e.getBoundingClientRect();return{left:t.left,width:t.width,itemLeft:t.left,itemRight:t.left+t.width,index:e.dataset.index}}).filter(e=>e.index!==void 0),{start:i,end:a}=t.columnDragRange??{};return(i!==void 0||a!==void 0)&&(r=r.filter(e=>{let t=+e.index;return(i===void 0||t>=i)&&(a===void 0||t<=a)})),r},[e.headerRef,t.columnDragRange]);return{computeRowItems:i,computeColumnItems:a,resolveDropIndex:(0,c.useCallback)((e,t,r,o,s,c,l)=>{let u;if(r===`row`){if(u=n.current,u||(u=i(),n.current=u),u&&u.length>0)return O(t-c.y+l.height/2-o.top+s,u)}else if(u=n.current,u||(u=a(),n.current=u),u&&u.length>0)return k(e-c.x+l.width/2,u);return 0},[i,a]),cachedItemsRef:n,cachedContainerRef:r}},N=200,P=30,F=5;function ee(e){let t=e,n=!1;for(;t;){if(t.dataset?.dragHandle===`true`&&(n=!0),t.dataset?.contextid||t.dataset?.disabled===`true`)return null;if(t.dataset?.id)return{element:t,foundHandle:n};t=t.parentNode}return null}var I=(e,t,n,r,i,a)=>{let{startAutoScroll:o,stopAutoScroll:s,setContainerRect:l,pointerRef:d,isAutoScrollingVertical:f,isAutoScrollingHorizontal:p}=y(e),m=D(e),{rowIndexMapRef:h,colIndexMapRef:g,cellIndexMapRef:_,mapStaleRef:v}=m,{applyShiftTransforms:b,clearShiftTransforms:x,prevTargetIndexRef:S,draggedSizeRef:C}=E(e,h,g,_),T=M(e,i),{resolveDropIndex:O,cachedItemsRef:k,cachedContainerRef:j}=T,I=(0,c.useRef)(null),L=(0,c.useRef)({x:0,y:0}),R=(0,c.useRef)(null),z=(0,c.useRef)(null),B=(0,c.useRef)(!1),V=(0,c.useRef)(!1),H=(0,c.useRef)(null),U=(0,c.useRef)(null),W=(0,c.useRef)([]),G=(0,c.useCallback)((t,r,i)=>{let a=ee(t.target);if(!a)return;let{element:o,foundHandle:s}=a;if(!s&&o.querySelector(`[data-drag-handle]`))return;let c=o.dataset.id,u=+o.dataset.index,f=o.dataset.type;I.current=f??null,R.current=u,z.current=null,H.current=null,W.current=[],S.current=null,B.current=!1;let p=f===`row`?e.bodyRef?.current?.scrollLeft??0:0,h=o.getBoundingClientRect();C.current={width:h.width,height:h.height};let g={x:r-h.left-p,y:i-h.top};L.current=g,d.current={x:r,y:i};let _={x:h.left+p,y:h.top};k.current=f===`row`?T.computeRowItems():T.computeColumnItems();let v=e.bodyRef?.current;v&&(j.current=v.getBoundingClientRect(),l(j.current)),m.buildMaps(f,v??null);let y=e.tableRef?.current;y&&(y.style.touchAction=`none`);let b=o.firstElementChild;b&&(b.style.opacity=`0`,b.style.pointerEvents=`none`,b.style.zIndex=`2`,b.style.cursor=`-webkit-grabbing`),U.current=b;let x=e.cloneRef?.current;if(x){if(x.innerHTML=``,x.style.transform=`translate(${_.x}px, ${_.y}px)`,V.current=(v?.querySelector(`[data-type="row"]`))?.style.position===`absolute`,f===`row`){let e=o.firstElementChild?.firstElementChild;e&&x.appendChild(e.cloneNode(!0))}else if(f===`column`&&v){let e=String(u),t=o.querySelector(`.th`);if(t){let e=document.createElement(`div`);e.style.flexShrink=`0`,e.style.order=`-1`,e.appendChild(t.cloneNode(!0)),x.appendChild(e)}let n=document.createElement(`div`);n.style.flex=`1`;let r=document.createElement(`div`);r.className=`rbody`,r.style.height=`${v.scrollHeight}px`,r.style.position=`relative`,v.querySelectorAll(`[data-type="row"]`).forEach(t=>{let n=t.cloneNode(!0);if(V.current){let t=n.querySelector(`.tr`);if(t){let n=t.querySelector(`[data-col-index="${e}"]`);for(;t.firstChild;)t.removeChild(t.firstChild);n&&t.appendChild(n)}}else n.querySelectorAll(`[data-col-index]`).forEach(t=>{t.getAttribute(`data-col-index`)!==e&&t.remove()});r.appendChild(n)}),n.appendChild(r),V.current?(n.style.overflow=`auto`,n.style.scrollbarWidth=`none`,n.className=`clone-body-strip`):n.style.overflow=`hidden`,x.appendChild(n),H.current=n,W.current=[],v.querySelectorAll(`[data-col-index="${e}"]`).forEach(e=>{e.style.opacity=`0`,W.current.push(e)})}}n({type:`dragStart`,value:{rect:{draggedItemHeight:h.height,draggedItemWidth:h.width},dragged:{initial:g,translate:_,draggedID:c??null,isDragging:!0,sourceIndex:u},dragType:f??null,tableDimensions:{height:(e.tableRef?.current?.offsetHeight??0)-(v?v.offsetHeight-v.clientHeight:0),width:(e.tableRef?.current?.offsetWidth??0)-(v?v.offsetWidth-v.clientWidth:0)}}});let w=v?.scrollLeft??0,E=v?.scrollTop??0;requestAnimationFrame(()=>{let t=e.cloneRef?.current;t&&(f===`row`?t.scrollLeft=w:H.current&&(H.current.scrollTop=E))})},[n,e,d,l,T,m,k,j,C,S]),K=(0,c.useCallback)((t,r,i,o,s)=>{let c=e.cloneRef?.current;c&&(c.style.visibility=`hidden`),U.current&&=(U.current.style.opacity=``,U.current.style.pointerEvents=``,U.current.style.zIndex=``,U.current.style.cursor=``,null),W.current.forEach(e=>{e.style.opacity=``}),W.current=[];let l=e.tableRef?.current;l&&(l.style.touchAction=``),(0,u.flushSync)(()=>{a&&t!==null&&r!==null&&(i===`row`||i===`column`)&&a({sourceIndex:t,targetIndex:r,dragType:i}),n({type:`dragEnd`,value:{targetIndex:r,sourceIndex:t}})}),x();let d=e.bodyRef?.current;d&&(d.scrollTop=o,d.scrollLeft=s,requestAnimationFrame(()=>{d.scrollTop=o,d.scrollLeft=s}))},[n,e.bodyRef,e.cloneRef,e.tableRef,x,a]),q=(0,c.useCallback)(()=>{if(B.current)return;B.current=!0,X(),setTimeout(()=>{Z.current=!1},400);let t=z.current,n=R.current,r=I.current,i=e.bodyRef?.current,a=i?.scrollTop??0,o=i?.scrollLeft??0;k.current=null,j.current=null,s(),I.current=null,R.current=null,z.current=null;let c=e.cloneRef?.current,l=e.placeholderRef?.current;if(c&&l&&l.style.display!==`none`){let e=parseFloat(l.style.left)||0,i=parseFloat(l.style.top)||0;c.style.transition=`transform ${N}ms cubic-bezier(0.2, 0, 0, 1)`,c.style.transform=`translate(${e}px, ${i}px)`,setTimeout(()=>K(n,t,r,a,o),N)}else K(n,t,r,a,o)},[s,e.bodyRef,e.placeholderRef,e.cloneRef,K]),J=(0,c.useRef)(()=>{}),{touchStart:Y,cancelLongPress:X,isTouchActiveRef:Z}=w(e,G,q,(e,t)=>J.current(e,t)),te=(0,c.useCallback)(e=>{e.button===0&&e.target!==e.currentTarget&&(Z.current||A(e.clientX,e.clientY,e.target)||G(e,e.clientX,e.clientY))},[G,Z]),Q=(0,c.useCallback)((t,n)=>{if(B.current)return;let i=L.current;d.current.x=t,d.current.y=n;let a=e.bodyRef?.current;if(!a)return;let c=j.current;(!c||v.current)&&(c=a.getBoundingClientRect(),j.current=c);let l=a.scrollLeft,u=a.scrollTop,h=e.cloneRef?.current;h&&(h.style.transform=`translate(${t-i.x}px, ${n-i.y}px)`,I.current===`row`?h.scrollLeft=l:H.current&&(H.current.scrollTop=u));let g=I.current||r;if(V.current&&m.checkStaleness(),v.current&&(k.current=null,z.current=null,S.current=null,V.current?g===`row`?m.rebuildRowMap(a):m.rebuildColumnMaps(a,e.headerRef?.current??null):v.current=!1),g===`row`)if(n<c.top+P)o(-F,a,`vertical`),v.current=!0;else if(n>c.bottom-P)o(F,a,`vertical`),v.current=!0;else{let t=f.current;s(),t&&requestAnimationFrame(()=>{let t=e.bodyRef?.current;if(!t)return;V.current&&m.rebuildRowMap(t),k.current=null;let n=t.getBoundingClientRect();j.current=n;let r=O(d.current.x,d.current.y,`row`,n,t.scrollTop,L.current,C.current);z.current=r,S.current=null,b(R.current,r,`row`)})}else if(t<c.left+P)o(-F,a,`horizontal`),v.current=!0;else if(t>c.right-P)o(F,a,`horizontal`),v.current=!0;else{let t=p.current;s(),t&&requestAnimationFrame(()=>{let t=e.bodyRef?.current;if(!t)return;V.current&&m.rebuildColumnMaps(t,e.headerRef?.current??null),k.current=null;let n=t.getBoundingClientRect();j.current=n;let r=O(d.current.x,d.current.y,`column`,n,t.scrollTop,L.current,C.current);z.current=r,S.current=null,b(R.current,r,`column`)})}let _=O(t,n,g,c,u,i,C.current);_!==z.current&&(z.current=_,requestAnimationFrame(()=>b(R.current,_,g)))},[d,e.bodyRef,e.cloneRef,e.headerRef,r,o,s,f,p,m,O,b,k,j,v,S,C]);J.current=Q;let $=(0,c.useCallback)(()=>{X(),k.current=null,j.current=null;let t=e.cloneRef?.current;t&&(t.style.visibility=`hidden`);let r=e.tableRef?.current;r&&(r.style.touchAction=``),n({type:`dragEnd`,value:{targetIndex:null,sourceIndex:null}}),s(),x(),I.current=null,R.current=null,z.current=null},[X,k,j,e.cloneRef,e.tableRef,n,s,x]);return(0,c.useLayoutEffect)(()=>{if(!t.isDragging){x();let t=e.cloneRef?.current;t&&(t.style.transition=``,t.style.transform=`translate(0px, 0px)`,t.style.visibility=``,t.scrollLeft=0,t.innerHTML=``)}},[t.isDragging,x,e.cloneRef]),(0,c.useEffect)(()=>{if(!t.isDragging)return;let e=0,n=0,r=!1,i=t=>{e=t.clientX,n=t.clientY,r||(r=!0,requestAnimationFrame(()=>{r=!1,Q(e,n)}))},a=()=>q(),o=e=>{e.key===`Escape`&&$()};return window.addEventListener(`pointermove`,i),window.addEventListener(`pointerup`,a),window.addEventListener(`pointercancel`,a),window.addEventListener(`keydown`,o),()=>{window.removeEventListener(`pointermove`,i),window.removeEventListener(`pointerup`,a),window.removeEventListener(`pointercancel`,a),window.removeEventListener(`keydown`,o)}},[t.isDragging,Q,q,$]),{dragStart:te,touchStart:Y}},L={columnDragRange:{start:void 0,end:void 0},rowDragRange:{start:void 0,end:void 0},defaultSizing:50};function R(e,t){switch(t.type){case`setDragged`:return{...e,dragged:{...e.dragged,...t.value}};case`setDragType`:return{...e,dragType:t.value};case`setTableDimensions`:return{...e,tableDimensions:t.value};case`setRef`:return{...e,refs:{...e.refs,[t.refName]:t.value}};case`setBodyScrollBarWidth`:return{...e,bodyScrollBarWidth:t.value};case`setWidths`:return{...e,widths:t.value};case`setColumnIds`:return{...e,columnIds:t.value};case`setOptions`:return{...e,options:{...e.options,...t.value}};case`dragStart`:return{...e,rect:t.value.rect,dragged:{...e.dragged,...t.value.dragged},dragType:t.value.dragType,tableDimensions:t.value.tableDimensions};case`dragEnd`:return{...e,dragged:{initial:{x:0,y:0},translate:{x:0,y:0},isDragging:!1,draggedID:null,targetIndex:t.value?.targetIndex??null,sourceIndex:t.value?.sourceIndex??null},dragType:null,rect:{draggedItemWidth:0,draggedItemHeight:0}};default:throw Error(`Unhandled action`)}}var z={dragged:{initial:{x:0,y:0},translate:{x:0,y:0},isDragging:!1,draggedID:null,targetIndex:null,sourceIndex:null},dragType:null,rect:{draggedItemWidth:0,draggedItemHeight:0},tableDimensions:{height:0,width:0},refs:{tableRef:{current:null},bodyRef:{current:null},headerRef:{current:null},cloneRef:{current:null},placeholderRef:{current:null}},bodyScrollBarWidth:0,options:L,widths:[],columnIds:[]},B={position:`relative`,display:`flex`,flexFlow:`column`},V={position:`fixed`,pointerEvents:`none`,zIndex:3,top:0,left:0,display:`none`},H=(0,c.forwardRef)(({children:e,className:t,style:n,options:r,onDragEnd:i,renderPlaceholder:a},o)=>{let s=(0,c.useRef)(null),u=(0,c.useRef)(null),d=(0,c.useRef)(null);(0,c.useImperativeHandle)(o,()=>s.current,[]);let[m]=(0,c.useState)(()=>_(R,z)),h=(0,c.useSyncExternalStore)(m.subscribe,m.getState),g=m.dispatch;(0,c.useEffect)(()=>{g({type:`setRef`,refName:`tableRef`,value:s}),g({type:`setRef`,refName:`cloneRef`,value:u}),g({type:`setRef`,refName:`placeholderRef`,value:d})},[s,g]),(0,c.useEffect)(()=>{let e=()=>{s.current&&g({type:`setTableDimensions`,value:{height:s.current.offsetHeight,width:s.current.offsetWidth}})};return e(),window.addEventListener(`resize`,e),()=>{window.removeEventListener(`resize`,e)}},[s,g]),(0,c.useEffect)(()=>{r&&g({type:`setOptions`,value:r})},[r,g]);let{dragStart:v,touchStart:y}=I(h.refs,h.dragged,g,h.dragType,h.options,i),b=(0,c.useMemo)(()=>({position:`fixed`,zIndex:`5`,pointerEvents:`none`,top:0,left:0,display:`flex`,flexDirection:`column`,height:h.dragType===`row`?h.rect.draggedItemHeight:`${h.tableDimensions.height}px`,width:h.dragType===`column`?`${h.rect.draggedItemWidth}px`:`${h.tableDimensions.width}px`,overflow:`scroll`,scrollbarWidth:`none`,boxShadow:h.dragged.isDragging?`0 0 10px 0 rgba(0, 0, 0, 0.1)`:`none`}),[h.dragType,h.dragged.isDragging,h.rect.draggedItemHeight,h.rect.draggedItemWidth,h.tableDimensions.height,h.tableDimensions.width]);return(0,l.jsx)(p.Provider,{value:m,children:(0,l.jsxs)(f,{className:h.dragged.isDragging?`is-dragging`:``,children:[(0,l.jsx)(`div`,{id:`portalroot`,style:{...b,visibility:h.dragged.isDragging?`visible`:`hidden`},ref:u}),(0,l.jsx)(`div`,{ref:d,style:V,children:a?a():(0,l.jsx)(`div`,{style:{width:`100%`,height:`100%`}})}),(0,l.jsx)(`div`,{"data-contextid":`context`,ref:s,onMouseDown:v,onTouchStart:y,style:{...B,...n},className:`table ${t??``}`,children:e})]})})});H.displayName=`TableProvider`;var U=(0,c.forwardRef)(({children:e,style:t,className:n},r)=>{let i=(0,c.useRef)(null),a=r||i,o=m(e=>e.bodyScrollBarWidth),s=m(e=>e.dragged.isDragging),u=m(e=>e.refs),d=h(),f=(0,c.useCallback)(e=>`current`in e?e.current:null,[]);(0,c.useEffect)(()=>{i.current&&d({type:`setRef`,refName:`headerRef`,value:i})},[d]);let{HeaderScrollHandle:p}=y(u),g={display:`flex`,flex:`1 0 auto`},_=(0,c.useMemo)(()=>({overflowX:`scroll`,overflowY:`clip`,scrollbarWidth:`none`,display:`flex`,paddingRight:`${o}px`,userSelect:s?`none`:`auto`,...t}),[o,s,t]);return(0,c.useLayoutEffect)(()=>{let e=f(a);e&&d({type:`setWidths`,value:Array.from(e.querySelectorAll(`.th`)).map(e=>{let t=e.getAttribute(`data-width`);return t?parseInt(t,10):0})})},[e,d,f,a]),(0,c.useLayoutEffect)(()=>{let e=f(a);e&&d({type:`setColumnIds`,value:Array.from(e.querySelectorAll(`.draggable`)).map(e=>e.getAttribute(`data-id`)||``)})},[e,d,f,a]),(0,l.jsx)(`div`,{className:`header ${n??``}`,children:(0,l.jsx)(`div`,{className:`thead`,style:_,"data-droppableid":`header`,onScroll:p,ref:a,children:(0,l.jsx)(`div`,{style:g,className:`tr`,children:e})})})});U.displayName=`TableHeader`;var W=(0,c.memo)(({children:e,id:t,index:n,type:r,styles:i={}})=>{let a=m(e=>e.options.rowDragRange),o=m(e=>e.options.columnDragRange),s=(0,c.useMemo)(()=>r===`row`?j(n,a.start,a.end):j(n,o.start,o.end),[n,o.end,o.start,a.end,a.start,r]),u=(0,c.useRef)(null),d=(0,c.useRef)(null),f=(0,c.useMemo)(()=>({cursor:s?`auto`:`-webkit-grab`,display:`flex`}),[s]);return(0,c.useEffect)(()=>{!d.current||!u.current||(d.current.querySelector(`[data-drag-handle]`)?d.current.style.cursor=`auto`:s||(u.current.style.touchAction=`none`))},[e,s]),(0,l.jsx)(`div`,{ref:u,className:`draggable`,"data-id":t,"data-index":n,"data-type":r,"data-disabled":s?`true`:`false`,style:i,children:(0,l.jsx)(`div`,{ref:d,style:f,children:e})})});W.displayName=`Draggable`;var G=(0,c.memo)(({children:e,style:t,className:n,...r})=>{let i=m(e=>e.options.defaultSizing),{width:a,flex:o,...s}=t??{},u=(0,c.useMemo)(()=>a===void 0?i:typeof a==`number`?a:parseFloat(String(a))||i,[a,i]),d=(0,c.useMemo)(()=>({width:`${u}px`,flex:o===void 0?`${u} 0 auto`:o,boxSizing:`border-box`}),[u,o]);return(0,l.jsx)(W,{...r,styles:d,type:`column`,children:(0,l.jsx)(`div`,{className:`th ${n??``}`,"data-width":u,style:{width:`100%`,...s,boxSizing:`border-box`},children:e})})});G.displayName=`ColumnCell`;var K={display:`flex`,overflow:`hidden`,flex:1},q=(0,c.forwardRef)(({children:e,style:t,className:n},r)=>{let i=(0,c.useRef)(null);(0,c.useImperativeHandle)(r,()=>i.current,[]);let a=m(e=>e.dragged.isDragging),o=m(e=>e.refs),s=h();(0,c.useEffect)(()=>{s({type:`setRef`,refName:`bodyRef`,value:i})},[s,i]);let{BodyScrollHandle:u}=y(o),d=(0,c.useMemo)(()=>({overflowX:`auto`,overflowY:`auto`,flex:1,userSelect:a?`none`:`auto`,...t}),[a,t]);return(0,c.useLayoutEffect)(()=>{if(i.current){let e=i.current.clientWidth;s({type:`setBodyScrollBarWidth`,value:i.current.offsetWidth-e})}},[s,i]),(0,l.jsx)(`div`,{className:`body ${n??``}`,style:K,children:(0,l.jsx)(`div`,{className:`ibody`,style:d,"data-droppableid":`body`,onScroll:u,ref:i,children:e})})}),J={display:`flex`,flex:`1 0 auto`,minHeight:`24px`},Y=(0,c.memo)(({children:e,style:t,className:n,...r})=>{let i=(0,c.useMemo)(()=>t?{...J,...t}:J,[t]),a=(0,d.default)(`tr`,n);return(0,l.jsx)(W,{...r,type:`row`,children:(0,l.jsx)(`div`,{className:a,style:i,children:e})})});Y.displayName=`BodyRow`;var X=(0,c.memo)(({children:e,style:t,className:n,...r})=>{let{index:i}=r,a=m(e=>e.widths),o=m(e=>e.options.defaultSizing),s=(0,c.useMemo)(()=>a[i]??o,[a,i,o]),u=(0,c.useMemo)(()=>({display:`inline-flex`,width:`${s}px`,flex:`${s} 0 auto`,...t,boxSizing:`border-box`}),[s,t]);return(0,l.jsx)(`div`,{className:`td ${n??``}`,style:u,"data-col-index":i,children:e})});X.displayName=`RowCell`;var Z=(0,c.memo)(({children:e,className:t,style:n})=>(0,l.jsx)(`div`,{"data-drag-handle":`true`,className:t,style:{cursor:`-webkit-grab`,touchAction:`none`,display:`inline-flex`,alignItems:`center`,...n},children:e}));Z.displayName=`DragHandle`,exports.BodyRow=Y,exports.ColumnCell=G,exports.DragHandle=Z,exports.RowCell=X,exports.TableBody=q,exports.TableContainer=H,exports.TableHeader=U,exports.useTable=g,exports.useTableDispatch=h,exports.useTableStore=m;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));let c=require(`react`);c=s(c);let l=require(`react/jsx-runtime`),u=require(`react-dom`),d=require(`classnames`);d=s(d);var f=({children:e,className:t})=>(0,l.jsx)(`div`,{"data-flexitable-root":``,className:t??``,children:e}),p=(0,c.createContext)(null),m=e=>{let t=(0,c.useContext)(p);if(!t)throw Error(`useTableStore must be used within TableProvider`);return(0,c.useSyncExternalStore)(t.subscribe,()=>e(t.getState()))},h=()=>{let e=(0,c.useContext)(p);if(!e)throw Error(`useTableDispatch must be used within TableProvider`);return e.dispatch},g=()=>{let e=(0,c.useContext)(p);if(!e)throw Error(`useTable must be used within a TableProvider`);return{state:(0,c.useSyncExternalStore)(e.subscribe,e.getState),dispatch:e.dispatch}};function _(e,t){let n=t,r=new Set;return{getState:()=>n,dispatch(t){n=e(n,t),r.forEach(e=>e())},subscribe(e){return r.add(e),()=>{r.delete(e)}}}}var v=30,y=e=>{let{headerRef:t,bodyRef:n}=e,r=(0,c.useRef)(null),i=(0,c.useRef)(t),a=(0,c.useRef)(!1),o=(0,c.useRef)(!1),s=(0,c.useRef)(0),l=(0,c.useRef)(null),u=(0,c.useRef)({x:0,y:0}),d=(0,c.useRef)(null),f=(0,c.useCallback)(e=>{d.current=e},[]),p=(0,c.useCallback)(()=>{o.current=!1,a.current=!1,l.current!==null&&(cancelAnimationFrame(l.current),l.current=null)},[]),m=(0,c.useCallback)((e,t,n)=>{let c=n===`vertical`,f=c?o:a;if(!f.current)return;let p=d.current;if(p){let e=u.current;if(c){let t=e.y<p.top+v,n=e.y>p.bottom-v;if(!t&&!n){f.current=!1;return}}else{let t=e.x<p.left+v,n=e.x>p.right-v;if(!t&&!n){f.current=!1;return}}}let m=c?t.scrollHeight-t.clientHeight:t.scrollWidth-t.clientWidth;if(c)t.scrollTop+=e;else{t.scrollLeft+=e;let n=i.current;n?.current&&(n.current.scrollLeft=t.scrollLeft)}let h=c?t.scrollTop:t.scrollLeft;if(h>=m||h<=0){f.current=!1;return}s.current+=e/1e3,l.current=requestAnimationFrame(()=>r.current?.(e+s.current,t,n))},[]);return(0,c.useEffect)(()=>{r.current=m},[m]),{startAutoScroll:(0,c.useCallback)((e,t,n)=>{let r=n===`vertical`?o:a;r.current||(r.current=!0,s.current=0,l.current=requestAnimationFrame(()=>m(e,t,n)))},[m]),stopAutoScroll:p,setContainerRect:f,isAutoScrollingVertical:o,isAutoScrollingHorizontal:a,pointerRef:u,BodyScrollHandle:(0,c.useCallback)(e=>{t?.current&&e.currentTarget&&(t.current.scrollLeft=e.currentTarget.scrollLeft)},[t]),HeaderScrollHandle:(0,c.useCallback)(e=>{n?.current&&e.currentTarget&&(n.current.scrollLeft=e.currentTarget.scrollLeft)},[n])}},b=300,x=8,S=.92,C=.5;function w(e,t,n,r){let i=(0,c.useRef)(null),a=(0,c.useRef)({x:0,y:0}),o=(0,c.useRef)(null),s=(0,c.useRef)(!1),l=(0,c.useRef)(null),u=(0,c.useRef)(null),d=(0,c.useCallback)(()=>{u.current!==null&&(cancelAnimationFrame(u.current),u.current=null)},[]),f=(0,c.useCallback)(()=>{i.current&&=(clearTimeout(i.current),null),o.current=null,l.current&&=(l.current(),null)},[]);return{touchStart:(0,c.useCallback)(c=>{if(c.target===c.currentTarget)return;let p=c.target,m=!1;for(;p&&!(p.dataset?.contextid||p.dataset?.disabled===`true`);){if(p.dataset?.id){m=!0;break}p=p.parentNode}if(!m)return;d(),f(),s.current=!0,window.getSelection()?.removeAllRanges();let h=c.touches[0];a.current={x:h.clientX,y:h.clientY},o.current=c;let g=e.tableRef?.current;if(!g)return;let _=!1,v=!1,y=h.clientY,w=h.clientX,T=0,E=0,D=Date.now(),O=e=>e.preventDefault();document.addEventListener(`selectstart`,O);let k=(t=>{let n=e.bodyRef?.current,r=t;for(;r&&r!==n;){let e=window.getComputedStyle(r),t=e.overflowY,n=e.overflowX,i=(t===`auto`||t===`scroll`)&&r.scrollHeight>r.clientHeight,a=(n===`auto`||n===`scroll`)&&r.scrollWidth>r.clientWidth;if(i||a)return r;r=r.parentElement}return n??document.body})(c.target),A=t=>{t.preventDefault();let n=t.touches[0],s=Date.now(),c=Math.max(s-D,1);if(D=s,v){let t=n.clientY-y,r=n.clientX-w;if(k){let n=e.bodyRef?.current,i=t>0&&k.scrollTop<=0,a=t<0&&k.scrollTop+k.clientHeight>=k.scrollHeight-1,o=r>0&&k.scrollLeft<=0,s=r<0&&k.scrollLeft+k.clientWidth>=k.scrollWidth-1,c=i||a,l=o||s;k===n?(k.scrollTop-=t,k.scrollLeft-=r):(l||(k.scrollLeft-=r),c||(k.scrollTop-=t),n&&(c&&(n.scrollTop-=t),l&&(n.scrollLeft-=r)))}T=-t/c*16,E=-r/c*16,y=n.clientY,w=n.clientX}else if(_)r(n.clientX,n.clientY);else{let e=n.clientX-a.current.x,t=n.clientY-a.current.y;(Math.abs(e)>x||Math.abs(t)>x)&&(i.current&&=(clearTimeout(i.current),null),o.current=null,v=!0,y=n.clientY,w=n.clientX,T=0,E=0,D=Date.now())}},j=()=>{if(_)M(),n();else{if(f(),v&&k&&(Math.abs(T)>C||Math.abs(E)>C)){let e=k,t=()=>{T*=S,E*=S,e.scrollTop+=T,e.scrollLeft+=E,Math.abs(T)>C||Math.abs(E)>C?u.current=requestAnimationFrame(t):u.current=null};u.current=requestAnimationFrame(t)}setTimeout(()=>{s.current=!1},400)}},M=()=>{g.removeEventListener(`touchmove`,A),g.removeEventListener(`touchend`,j),g.removeEventListener(`touchcancel`,j),document.removeEventListener(`selectstart`,O),l.current=null};g.addEventListener(`touchmove`,A,{passive:!1}),g.addEventListener(`touchend`,j,!1),g.addEventListener(`touchcancel`,j,!1),l.current=M,i.current=setTimeout(()=>{i.current=null,_=!0;let e=o.current;o.current=null,e&&t(e,h.clientX,h.clientY)},b)},[t,n,r,f,d,e.tableRef?.current,e.bodyRef?.current]),cancelLongPress:f,isTouchActiveRef:s}}var T=`transform 450ms cubic-bezier(0.2, 0, 0, 1)`,E=`transform 150ms cubic-bezier(0.2, 0, 0, 1)`,D=()=>typeof window<`u`&&window.matchMedia(`(prefers-reduced-motion: reduce)`).matches,O=(e,t,n,r)=>{let i=(0,c.useRef)({width:0,height:0}),a=(0,c.useRef)(null),o=(0,c.useRef)(new Set),s=(0,c.useRef)(new Set),l=(0,c.useRef)(new Map),u=(0,c.useCallback)((t,n,r,a)=>{let o=e.placeholderRef?.current;if(!o||!t){o&&(o.style.display=`none`);return}let s=i.current,c=t.getBoundingClientRect(),l=e.tableRef?.current?.getBoundingClientRect(),u=e.bodyRef?.current,d=u?u.offsetWidth-u.clientWidth:0,f=u?u.offsetHeight-u.clientHeight:0,p=(n??0)<(r??0),m=o.style.display===`none`,h=parseFloat(o.style.top)||0,g=parseFloat(o.style.left)||0;if(o.style.transition=``,o.style.transform=``,o.style.display=`block`,a===`row`?(o.style.top=`${p?c.top+c.height-s.height:c.top}px`,o.style.left=`${l?.left??c.left}px`,o.style.width=`${(l?.width??c.width)-d}px`,o.style.height=`${s.height}px`):(o.style.top=`${l?.top??c.top}px`,o.style.left=`${p?c.left+c.width-s.width:c.left}px`,o.style.width=`${s.width}px`,o.style.height=`${(l?.height??c.height)-f}px`),!m&&!D()){let e=g-(parseFloat(o.style.left)||0),t=h-(parseFloat(o.style.top)||0);(e!==0||t!==0)&&(o.style.transform=`translate(${e}px, ${t}px)`,o.offsetHeight,o.style.transition=E,o.style.transform=`translate(0, 0)`)}},[e.placeholderRef,e.tableRef,e.bodyRef]);return{applyShiftTransforms:(0,c.useCallback)((e,c,d)=>{if(e===null||c===null)return;let f=i.current,p=a.current,m=p===null,h=m?-1/0:Math.min(p,c,e)-1,g=m?1/0:Math.max(p,c,e)+1,_=null,v=(d===`row`?t.current:n.current).get(c);v&&(_=v.outer),u(_,e,c,d);let y=(t,n,r)=>{let i=(t,i,a)=>{let s=``;t>e&&t<=c?s=`translate${n}(-${r}px)`:t<e&&t>=c&&(s=`translate${n}(${r}px)`),a.style.transform=s,a.style.transition=t===e||D()?`none`:T,s&&o.current.add(a),t===c?i.setAttribute(`data-drop-target`,`true`):i.removeAttribute(`data-drop-target`)};if(m)for(let[e,{outer:n,inner:r}]of t)i(e,n,r);else for(let e=h;e<=g;e++){let n=t.get(e);n&&i(e,n.outer,n.inner)}};if(d===`row`)y(t.current,`Y`,f.height);else if(d===`column`){y(n.current,`X`,f.width);let t=r.current,i=l.current,a=(t,n,r)=>{let a=``;t>e&&t<=c?a=`translateX(-${f.width}px)`:t<e&&t>=c&&(a=`translateX(${f.width}px)`);for(let e of n)i.get(e)!==a&&(e.style.transform=a,r&&(e.style.transition=D()?`none`:T),i.set(e,a),a&&s.current.add(e))};if(m)for(let[e,n]of t)a(e,n,!0);else for(let e=h;e<=g;e++){let n=t.get(e);n&&a(e,n,!1)}}a.current=c},[u,t,n,r]),clearShiftTransforms:(0,c.useCallback)(()=>{let t=e.placeholderRef?.current;t&&(t.style.display=`none`);for(let e of o.current){e.style.transition=`none`,e.style.transform=``;let t=e.parentElement;t&&t.removeAttribute(`data-drop-target`)}o.current.clear();for(let e of s.current)e.style.transition=`none`,e.style.transform=``;s.current.clear(),l.current.clear(),a.current=null},[e.placeholderRef]),prevTargetIndexRef:a,draggedSizeRef:i}},k=e=>{let t=(0,c.useRef)(new Map),n=(0,c.useRef)(new Map),r=(0,c.useRef)(new Map),i=(0,c.useRef)(!1),a=(0,c.useCallback)(()=>{t.current.clear(),n.current.clear(),r.current.clear()},[]),o=(0,c.useCallback)(e=>{t.current.clear();let n=e.querySelectorAll(`.draggable[data-type="row"]`);for(let e=0;e<n.length;e++){let r=n[e],i=r.dataset.index;if(i===void 0)continue;let a=r.firstElementChild;a&&t.current.set(+i,{outer:r,inner:a})}},[]),s=(0,c.useCallback)(e=>{n.current.clear();let t=e.querySelectorAll(`.draggable[data-type="column"]`);for(let e=0;e<t.length;e++){let r=t[e],i=r.dataset.index;if(i===void 0)continue;let a=r.firstElementChild;a&&n.current.set(+i,{outer:r,inner:a})}},[]),l=(0,c.useCallback)(e=>{r.current.clear();let t=e.querySelectorAll(`.td[data-col-index]`);for(let e=0;e<t.length;e++){let n=t[e],i=+n.dataset.colIndex;r.current.has(i)||r.current.set(i,[]),r.current.get(i).push(n)}},[]);return{rowIndexMapRef:t,colIndexMapRef:n,cellIndexMapRef:r,mapStaleRef:i,buildMaps:(0,c.useCallback)((t,n)=>{if(a(),n){if(t===`row`)o(n);else if(t===`column`){let t=e.headerRef?.current;t&&s(t),l(n)}}},[e.headerRef,a,o,s,l]),rebuildRowMap:(0,c.useCallback)(e=>{i.current=!1,o(e)},[o]),rebuildColumnMaps:(0,c.useCallback)((e,t)=>{i.current=!1,t&&s(t),l(e)},[s,l]),checkStaleness:(0,c.useCallback)(()=>{if(!i.current){if(t.current.size>0){let e=t.current.values().next().value;if(e&&!e.outer.isConnected){i.current=!0;return}}if(n.current.size>0){let e=n.current.values().next().value;e&&!e.outer.isConnected&&(i.current=!0)}}},[]),clearMaps:a}},A=(e,t)=>{let n=e,r=0,i=t.length-1;for(;r<i;){let e=Math.floor((r+i)/2),a=t[e];if(a.itemTop<=n&&n<=a.itemBottom)return n<a.itemTop+a.height/2?+a.index:+a.index+1;n<a.itemTop?i=e-1:r=e+1}return+t[r].index},j=(e,t)=>{let n=e,r=0,i=t.length-1;for(;r<i;){let e=Math.floor((r+i)/2),a=t[e];if(a.itemLeft<=n&&n<=a.itemRight)return n<a.itemLeft+a.width/2?+a.index:+a.index+1;n<a.itemLeft?i=e-1:r=e+1}return+t[r].index};function M(e,t,n){let r=n.getBoundingClientRect();return e>r.left+n.clientWidth||t>r.top+n.clientHeight}var N=(e,t,n)=>{let r=Number(e);return t!==void 0&&r<t||n!==void 0&&r>n},ee=(e,t)=>{let n=(0,c.useRef)(null),r=(0,c.useRef)(null),i=(0,c.useCallback)(()=>{let n=e.bodyRef?.current;if(!n)return null;let r=n.scrollTop,i=n.getBoundingClientRect().top,a=n.querySelectorAll(`.draggable[data-type="row"]`),o=[];for(let e=0;e<a.length;e++){let t=a[e];if(t.dataset.index===void 0)continue;let n=t.getBoundingClientRect(),s=n.top-i+r;o.push({height:n.height,itemTop:s,itemBottom:s+n.height,index:t.dataset.index})}let{start:s,end:c}=t.rowDragRange;return(s||c)&&(o=o.filter(e=>(!s||+e.index>=s)&&(!c||+e.index<=c))),o},[e.bodyRef,t.rowDragRange]),a=(0,c.useCallback)(()=>{let n=e.headerRef?.current;if(!n||!n.children[0])return null;let r=Array.from(n.children[0].children).map(e=>{let t=e.getBoundingClientRect();return{left:t.left,width:t.width,itemLeft:t.left,itemRight:t.left+t.width,index:e.dataset.index}}).filter(e=>e.index!==void 0),{start:i,end:a}=t.columnDragRange??{};return(i!==void 0||a!==void 0)&&(r=r.filter(e=>{let t=+e.index;return(i===void 0||t>=i)&&(a===void 0||t<=a)})),r},[e.headerRef,t.columnDragRange]);return{computeRowItems:i,computeColumnItems:a,resolveDropIndex:(0,c.useCallback)((e,t,r,o,s,c,l)=>{let u;if(r===`row`){if(u=n.current,u||(u=i(),n.current=u),u&&u.length>0)return A(t-c.y+l.height/2-o.top+s,u)}else if(u=n.current,u||(u=a(),n.current=u),u&&u.length>0)return j(e-c.x+l.width/2,u);return 0},[i,a]),cachedItemsRef:n,cachedContainerRef:r}},P=200,F=30,I=5;function te(e){let t=e,n=!1;for(;t;){if(t.dataset?.dragHandle===`true`&&(n=!0),t.dataset?.contextid||t.dataset?.disabled===`true`)return null;if(t.dataset?.id)return{element:t,foundHandle:n};t=t.parentNode}return null}var L=(e,t,n,r,i,a)=>{let{startAutoScroll:o,stopAutoScroll:s,setContainerRect:l,pointerRef:d,isAutoScrollingVertical:f,isAutoScrollingHorizontal:p}=y(e),m=k(e),{rowIndexMapRef:h,colIndexMapRef:g,cellIndexMapRef:_,mapStaleRef:v}=m,{applyShiftTransforms:b,clearShiftTransforms:x,prevTargetIndexRef:S,draggedSizeRef:C}=O(e,h,g,_),T=ee(e,i),{resolveDropIndex:E,cachedItemsRef:D,cachedContainerRef:A}=T,j=(0,c.useRef)(null),N=(0,c.useRef)({x:0,y:0}),L=(0,c.useRef)(null),R=(0,c.useRef)(null),z=(0,c.useRef)(!1),B=(0,c.useRef)(!1),V=(0,c.useRef)(null),H=(0,c.useRef)(null),U=(0,c.useRef)([]),W=(0,c.useCallback)((t,r,i)=>{let a=te(t.target);if(!a)return;let{element:o,foundHandle:s}=a;if(!s&&o.querySelector(`[data-drag-handle]`))return;let c=o.dataset.id,u=+o.dataset.index,f=o.dataset.type;j.current=f??null,L.current=u,R.current=null,V.current=null,U.current=[],S.current=null,z.current=!1;let p=f===`row`?e.bodyRef?.current?.scrollLeft??0:0,h=o.getBoundingClientRect();C.current={width:h.width,height:h.height};let g={x:r-h.left-p,y:i-h.top};N.current=g,d.current={x:r,y:i};let _={x:h.left+p,y:h.top};D.current=f===`row`?T.computeRowItems():T.computeColumnItems();let v=e.bodyRef?.current;v&&(A.current=v.getBoundingClientRect(),l(A.current)),m.buildMaps(f,v??null);let y=e.tableRef?.current;y&&(y.style.touchAction=`none`);let b=o.firstElementChild;b&&(b.style.opacity=`0`,b.style.pointerEvents=`none`,b.style.zIndex=`2`,b.style.cursor=`-webkit-grabbing`),H.current=b;let x=e.cloneRef?.current;if(x){if(x.innerHTML=``,x.style.transform=`translate(${_.x}px, ${_.y}px)`,B.current=(v?.querySelector(`[data-type="row"]`))?.style.position===`absolute`,f===`row`){let e=o.firstElementChild?.firstElementChild;e&&x.appendChild(e.cloneNode(!0))}else if(f===`column`&&v){let e=String(u),t=o.querySelector(`.th`);if(t){let e=document.createElement(`div`);e.style.flexShrink=`0`,e.style.order=`-1`,e.appendChild(t.cloneNode(!0)),x.appendChild(e)}let n=document.createElement(`div`);n.style.flex=`1`;let r=document.createElement(`div`);r.className=`rbody`,r.style.height=`${v.scrollHeight}px`,r.style.position=`relative`,v.querySelectorAll(`[data-type="row"]`).forEach(t=>{let n=t.cloneNode(!0);if(B.current){let t=n.querySelector(`.tr`);if(t){let n=t.querySelector(`[data-col-index="${e}"]`);for(;t.firstChild;)t.removeChild(t.firstChild);n&&t.appendChild(n)}}else n.querySelectorAll(`[data-col-index]`).forEach(t=>{t.getAttribute(`data-col-index`)!==e&&t.remove()});r.appendChild(n)}),n.appendChild(r),B.current?(n.style.overflow=`auto`,n.style.scrollbarWidth=`none`,n.className=`clone-body-strip`):n.style.overflow=`hidden`,x.appendChild(n),V.current=n,U.current=[],v.querySelectorAll(`[data-col-index="${e}"]`).forEach(e=>{e.style.opacity=`0`,U.current.push(e)})}}n({type:`dragStart`,value:{rect:{draggedItemHeight:h.height,draggedItemWidth:h.width},dragged:{initial:g,translate:_,draggedID:c??null,isDragging:!0,sourceIndex:u},dragType:f??null,tableDimensions:{height:(e.tableRef?.current?.offsetHeight??0)-(v?v.offsetHeight-v.clientHeight:0),width:(e.tableRef?.current?.offsetWidth??0)-(v?v.offsetWidth-v.clientWidth:0)}}});let w=v?.scrollLeft??0,E=v?.scrollTop??0;requestAnimationFrame(()=>{let t=e.cloneRef?.current;t&&(f===`row`?t.scrollLeft=w:V.current&&(V.current.scrollTop=E))})},[n,e,d,l,T,m,D,A,C,S]),G=(0,c.useCallback)((t,r,i,o,s)=>{let c=e.cloneRef?.current;c&&(c.style.visibility=`hidden`),H.current&&=(H.current.style.opacity=``,H.current.style.pointerEvents=``,H.current.style.zIndex=``,H.current.style.cursor=``,null),U.current.forEach(e=>{e.style.opacity=``}),U.current=[];let l=e.tableRef?.current;l&&(l.style.touchAction=``),(0,u.flushSync)(()=>{a&&t!==null&&r!==null&&(i===`row`||i===`column`)&&a({sourceIndex:t,targetIndex:r,dragType:i}),n({type:`dragEnd`,value:{targetIndex:r,sourceIndex:t}})}),x();let d=e.bodyRef?.current;d&&(d.scrollTop=o,d.scrollLeft=s,requestAnimationFrame(()=>{d.scrollTop=o,d.scrollLeft=s}))},[n,e.bodyRef,e.cloneRef,e.tableRef,x,a]),K=(0,c.useCallback)(()=>{if(z.current)return;z.current=!0,Y(),setTimeout(()=>{X.current=!1},400);let t=R.current,n=L.current,r=j.current,i=e.bodyRef?.current,a=i?.scrollTop??0,o=i?.scrollLeft??0;D.current=null,A.current=null,s(),j.current=null,L.current=null,R.current=null;let c=e.cloneRef?.current,l=e.placeholderRef?.current;if(c&&l&&l.style.display!==`none`){let e=parseFloat(l.style.left)||0,i=parseFloat(l.style.top)||0;c.style.transition=`transform ${P}ms cubic-bezier(0.2, 0, 0, 1)`,c.style.transform=`translate(${e}px, ${i}px)`,setTimeout(()=>G(n,t,r,a,o),P)}else G(n,t,r,a,o)},[s,e.bodyRef,e.placeholderRef,e.cloneRef,G]),q=(0,c.useRef)(()=>{}),{touchStart:J,cancelLongPress:Y,isTouchActiveRef:X}=w(e,W,K,(e,t)=>q.current(e,t)),Z=(0,c.useCallback)(e=>{e.button===0&&e.target!==e.currentTarget&&(X.current||M(e.clientX,e.clientY,e.target)||W(e,e.clientX,e.clientY))},[W,X]),Q=(0,c.useCallback)((t,n)=>{if(z.current)return;let i=N.current;d.current.x=t,d.current.y=n;let a=e.bodyRef?.current;if(!a)return;let c=A.current;(!c||v.current)&&(c=a.getBoundingClientRect(),A.current=c);let l=a.scrollLeft,u=a.scrollTop,h=e.cloneRef?.current;h&&(h.style.transform=`translate(${t-i.x}px, ${n-i.y}px)`,j.current===`row`?h.scrollLeft=l:V.current&&(V.current.scrollTop=u));let g=j.current||r;if(B.current&&m.checkStaleness(),v.current&&(D.current=null,R.current=null,S.current=null,B.current?g===`row`?m.rebuildRowMap(a):m.rebuildColumnMaps(a,e.headerRef?.current??null):v.current=!1),g===`row`)if(n<c.top+F)o(-I,a,`vertical`),v.current=!0;else if(n>c.bottom-F)o(I,a,`vertical`),v.current=!0;else{let t=f.current;s(),t&&requestAnimationFrame(()=>{let t=e.bodyRef?.current;if(!t)return;B.current&&m.rebuildRowMap(t),D.current=null;let n=t.getBoundingClientRect();A.current=n;let r=E(d.current.x,d.current.y,`row`,n,t.scrollTop,N.current,C.current);R.current=r,S.current=null,b(L.current,r,`row`)})}else if(t<c.left+F)o(-I,a,`horizontal`),v.current=!0;else if(t>c.right-F)o(I,a,`horizontal`),v.current=!0;else{let t=p.current;s(),t&&requestAnimationFrame(()=>{let t=e.bodyRef?.current;if(!t)return;B.current&&m.rebuildColumnMaps(t,e.headerRef?.current??null),D.current=null;let n=t.getBoundingClientRect();A.current=n;let r=E(d.current.x,d.current.y,`column`,n,t.scrollTop,N.current,C.current);R.current=r,S.current=null,b(L.current,r,`column`)})}let _=E(t,n,g,c,u,i,C.current);_!==R.current&&(R.current=_,requestAnimationFrame(()=>b(L.current,_,g)))},[d,e.bodyRef,e.cloneRef,e.headerRef,r,o,s,f,p,m,E,b,D,A,v,S,C]);q.current=Q;let $=(0,c.useCallback)(()=>{Y(),D.current=null,A.current=null;let t=e.cloneRef?.current;t&&(t.style.visibility=`hidden`);let r=e.tableRef?.current;r&&(r.style.touchAction=``),n({type:`dragEnd`,value:{targetIndex:null,sourceIndex:null}}),s(),x(),j.current=null,L.current=null,R.current=null},[Y,D,A,e.cloneRef,e.tableRef,n,s,x]);return(0,c.useLayoutEffect)(()=>{if(!t.isDragging){x();let t=e.cloneRef?.current;t&&(t.style.transition=``,t.style.transform=`translate(0px, 0px)`,t.style.visibility=``,t.scrollLeft=0,t.innerHTML=``)}},[t.isDragging,x,e.cloneRef]),(0,c.useEffect)(()=>{if(!t.isDragging)return;let e=0,n=0,r=!1,i=t=>{e=t.clientX,n=t.clientY,r||(r=!0,requestAnimationFrame(()=>{r=!1,Q(e,n)}))},a=()=>K(),o=e=>{e.key===`Escape`&&$()};return window.addEventListener(`pointermove`,i),window.addEventListener(`pointerup`,a),window.addEventListener(`pointercancel`,a),window.addEventListener(`keydown`,o),()=>{window.removeEventListener(`pointermove`,i),window.removeEventListener(`pointerup`,a),window.removeEventListener(`pointercancel`,a),window.removeEventListener(`keydown`,o)}},[t.isDragging,Q,K,$]),{dragStart:Z,touchStart:J}},R={columnDragRange:{start:void 0,end:void 0},rowDragRange:{start:void 0,end:void 0},defaultSizing:50};function z(e,t){switch(t.type){case`setDragged`:return{...e,dragged:{...e.dragged,...t.value}};case`setDragType`:return{...e,dragType:t.value};case`setTableDimensions`:return{...e,tableDimensions:t.value};case`setRef`:return{...e,refs:{...e.refs,[t.refName]:t.value}};case`setBodyScrollBarWidth`:return{...e,bodyScrollBarWidth:t.value};case`setWidths`:return{...e,widths:t.value};case`setColumnIds`:return{...e,columnIds:t.value};case`setOptions`:return{...e,options:{...e.options,...t.value}};case`dragStart`:return{...e,rect:t.value.rect,dragged:{...e.dragged,...t.value.dragged},dragType:t.value.dragType,tableDimensions:t.value.tableDimensions};case`dragEnd`:return{...e,dragged:{initial:{x:0,y:0},translate:{x:0,y:0},isDragging:!1,draggedID:null,targetIndex:t.value?.targetIndex??null,sourceIndex:t.value?.sourceIndex??null},dragType:null,rect:{draggedItemWidth:0,draggedItemHeight:0}};default:throw Error(`Unhandled action`)}}var B={dragged:{initial:{x:0,y:0},translate:{x:0,y:0},isDragging:!1,draggedID:null,targetIndex:null,sourceIndex:null},dragType:null,rect:{draggedItemWidth:0,draggedItemHeight:0},tableDimensions:{height:0,width:0},refs:{tableRef:{current:null},bodyRef:{current:null},headerRef:{current:null},cloneRef:{current:null},placeholderRef:{current:null}},bodyScrollBarWidth:0,options:R,widths:[],columnIds:[]},V={position:`relative`,display:`flex`,flexFlow:`column`},H={position:`fixed`,pointerEvents:`none`,zIndex:3,top:0,left:0,display:`none`},U=(0,c.forwardRef)(({children:e,className:t,style:n,options:r,onDragEnd:i,renderPlaceholder:a},o)=>{let s=(0,c.useRef)(null),u=(0,c.useRef)(null),d=(0,c.useRef)(null);(0,c.useImperativeHandle)(o,()=>s.current,[]);let[m]=(0,c.useState)(()=>_(z,B)),h=(0,c.useSyncExternalStore)(m.subscribe,m.getState),g=m.dispatch;(0,c.useEffect)(()=>{g({type:`setRef`,refName:`tableRef`,value:s}),g({type:`setRef`,refName:`cloneRef`,value:u}),g({type:`setRef`,refName:`placeholderRef`,value:d})},[s,g]),(0,c.useEffect)(()=>{let e=()=>{s.current&&g({type:`setTableDimensions`,value:{height:s.current.offsetHeight,width:s.current.offsetWidth}})};return e(),window.addEventListener(`resize`,e),()=>{window.removeEventListener(`resize`,e)}},[s,g]),(0,c.useEffect)(()=>{r&&g({type:`setOptions`,value:r})},[r,g]);let{dragStart:v,touchStart:y}=L(h.refs,h.dragged,g,h.dragType,h.options,i),b=(0,c.useMemo)(()=>({position:`fixed`,zIndex:`5`,pointerEvents:`none`,top:0,left:0,display:`flex`,flexDirection:`column`,height:h.dragType===`row`?h.rect.draggedItemHeight:`${h.tableDimensions.height}px`,width:h.dragType===`column`?`${h.rect.draggedItemWidth}px`:`${h.tableDimensions.width}px`,overflow:`scroll`,scrollbarWidth:`none`,boxShadow:h.dragged.isDragging?`0 0 10px 0 rgba(0, 0, 0, 0.1)`:`none`}),[h.dragType,h.dragged.isDragging,h.rect.draggedItemHeight,h.rect.draggedItemWidth,h.tableDimensions.height,h.tableDimensions.width]);return(0,l.jsx)(p.Provider,{value:m,children:(0,l.jsxs)(f,{className:h.dragged.isDragging?`is-dragging`:``,children:[(0,l.jsx)(`div`,{id:`portalroot`,style:{...b,visibility:h.dragged.isDragging?`visible`:`hidden`},ref:u}),(0,l.jsx)(`div`,{ref:d,style:H,children:a?a():(0,l.jsx)(`div`,{style:{width:`100%`,height:`100%`}})}),(0,l.jsx)(`div`,{"data-contextid":`context`,ref:s,onMouseDown:v,onTouchStart:y,style:{...V,...n},className:`table ${t??``}`,children:e})]})})});U.displayName=`TableProvider`;var W=(0,c.forwardRef)(({children:e,style:t,className:n},r)=>{let i=(0,c.useRef)(null),a=r||i,o=m(e=>e.bodyScrollBarWidth),s=m(e=>e.dragged.isDragging),u=m(e=>e.refs),d=h(),f=(0,c.useCallback)(e=>`current`in e?e.current:null,[]);(0,c.useEffect)(()=>{i.current&&d({type:`setRef`,refName:`headerRef`,value:i})},[d]);let{HeaderScrollHandle:p}=y(u),g={display:`flex`,flex:`1 0 auto`},_=(0,c.useMemo)(()=>({overflowX:`scroll`,overflowY:`clip`,scrollbarWidth:`none`,display:`flex`,paddingRight:`${o}px`,userSelect:s?`none`:`auto`,...t}),[o,s,t]);return(0,c.useLayoutEffect)(()=>{let e=f(a);e&&d({type:`setWidths`,value:Array.from(e.querySelectorAll(`.th`)).map(e=>{let t=e.getAttribute(`data-width`);return t?parseInt(t,10):0})})},[e,d,f,a]),(0,c.useLayoutEffect)(()=>{let e=f(a);e&&d({type:`setColumnIds`,value:Array.from(e.querySelectorAll(`.draggable`)).map(e=>e.getAttribute(`data-id`)||``)})},[e,d,f,a]),(0,l.jsx)(`div`,{className:`header ${n??``}`,children:(0,l.jsx)(`div`,{className:`thead`,style:_,"data-droppableid":`header`,onScroll:p,ref:a,children:(0,l.jsx)(`div`,{style:g,className:`tr`,children:e})})})});W.displayName=`TableHeader`;var G=(0,c.memo)(({children:e,id:t,index:n,type:r,styles:i={}})=>{let a=m(e=>e.options.rowDragRange),o=m(e=>e.options.columnDragRange),s=(0,c.useMemo)(()=>r===`row`?N(n,a.start,a.end):N(n,o.start,o.end),[n,o.end,o.start,a.end,a.start,r]),u=(0,c.useRef)(null),d=(0,c.useRef)(null),f=(0,c.useMemo)(()=>({cursor:s?`auto`:`-webkit-grab`,display:`flex`}),[s]);return(0,c.useEffect)(()=>{!d.current||!u.current||(d.current.querySelector(`[data-drag-handle]`)?d.current.style.cursor=`auto`:s||(u.current.style.touchAction=`none`))},[e,s]),(0,l.jsx)(`div`,{ref:u,className:`draggable`,"data-id":t,"data-index":n,"data-type":r,"data-disabled":s?`true`:`false`,style:i,children:(0,l.jsx)(`div`,{ref:d,style:f,children:e})})});G.displayName=`Draggable`;var K=(0,c.memo)(({children:e,style:t,className:n,...r})=>{let i=m(e=>e.options.defaultSizing),{width:a,flex:o,...s}=t??{},u=(0,c.useMemo)(()=>a===void 0?i:typeof a==`number`?a:parseFloat(String(a))||i,[a,i]),d=(0,c.useMemo)(()=>({width:`${u}px`,flex:o===void 0?`${u} 0 auto`:o,boxSizing:`border-box`}),[u,o]);return(0,l.jsx)(G,{...r,styles:d,type:`column`,children:(0,l.jsx)(`div`,{className:`th ${n??``}`,"data-width":u,style:{width:`100%`,...s,boxSizing:`border-box`},children:e})})});K.displayName=`ColumnCell`;var q={display:`flex`,overflow:`hidden`,flex:1},J=(0,c.forwardRef)(({children:e,style:t,className:n},r)=>{let i=(0,c.useRef)(null);(0,c.useImperativeHandle)(r,()=>i.current,[]);let a=m(e=>e.dragged.isDragging),o=m(e=>e.refs),s=h();(0,c.useEffect)(()=>{s({type:`setRef`,refName:`bodyRef`,value:i})},[s,i]);let{BodyScrollHandle:u}=y(o),d=(0,c.useMemo)(()=>({overflowX:`auto`,overflowY:`auto`,flex:1,userSelect:a?`none`:`auto`,...t}),[a,t]);return(0,c.useLayoutEffect)(()=>{if(i.current){let e=i.current.clientWidth;s({type:`setBodyScrollBarWidth`,value:i.current.offsetWidth-e})}},[s,i]),(0,l.jsx)(`div`,{className:`body ${n??``}`,style:q,children:(0,l.jsx)(`div`,{className:`ibody`,style:d,"data-droppableid":`body`,onScroll:u,ref:i,children:e})})}),Y={display:`flex`,flex:`1 0 auto`,minHeight:`24px`},X=(0,c.memo)(({children:e,style:t,className:n,...r})=>{let i=(0,c.useMemo)(()=>t?{...Y,...t}:Y,[t]),a=(0,d.default)(`tr`,n);return(0,l.jsx)(G,{...r,type:`row`,children:(0,l.jsx)(`div`,{className:a,style:i,children:e})})});X.displayName=`BodyRow`;var Z=(0,c.memo)(({children:e,style:t,className:n,...r})=>{let{index:i}=r,a=m(e=>e.widths),o=m(e=>e.options.defaultSizing),s=(0,c.useMemo)(()=>a[i]??o,[a,i,o]),u=(0,c.useMemo)(()=>({display:`inline-flex`,width:`${s}px`,flex:`${s} 0 auto`,...t,boxSizing:`border-box`}),[s,t]);return(0,l.jsx)(`div`,{className:`td ${n??``}`,style:u,"data-col-index":i,children:e})});Z.displayName=`RowCell`;var Q=(0,c.memo)(({children:e,className:t,style:n})=>(0,l.jsx)(`div`,{"data-drag-handle":`true`,className:t,style:{cursor:`-webkit-grab`,touchAction:`none`,display:`inline-flex`,alignItems:`center`,...n},children:e}));Q.displayName=`DragHandle`,exports.BodyRow=X,exports.ColumnCell=K,exports.DragHandle=Q,exports.RowCell=Z,exports.TableBody=J,exports.TableContainer=U,exports.TableHeader=W,exports.useTable=g,exports.useTableDispatch=h,exports.useTableStore=m;

package/dist/index.es.js

@@ -193,7 +193,7 @@ function O(e, t, n, i) {
 }
 //#endregion
 //#region src/hooks/useShiftTransforms.ts
-var k = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", A = (e, t, n, i) => {
+var k = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", A = "transform 150ms cubic-bezier(0.2, 0, 0, 1)", j = () => typeof window < "u" && window.matchMedia("(prefers-reduced-motion: reduce)").matches, M = (e, t, n, i) => {
 	let a = l({
 		width: 0,
 		height: 0
@@ -203,9 +203,16 @@ var k = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", A = (e, t, n, i) => {
 			o && (o.style.display = "none");
 			return;
 		}
-		let s = a.current, c = t.getBoundingClientRect(), l = e.tableRef?.current?.getBoundingClientRect(), u = (n ?? 0) < (r ?? 0);
-		o.style.display = "block", i === "row" ? (o.style.top = `${u ? c.top + c.height - s.height : c.top}px`, o.style.left = `${l?.left ?? c.left}px`, o.style.width = `${l?.width ?? c.width}px`, o.style.height = `${s.height}px`) : (o.style.top = `${l?.top ?? c.top}px`, o.style.left = `${u ? c.left + c.width - s.width : c.left}px`, o.style.width = `${s.width}px`, o.style.height = `${l?.height ?? c.height}px`);
-	}, [e.placeholderRef, e.tableRef]);
+		let s = a.current, c = t.getBoundingClientRect(), l = e.tableRef?.current?.getBoundingClientRect(), u = e.bodyRef?.current, d = u ? u.offsetWidth - u.clientWidth : 0, f = u ? u.offsetHeight - u.clientHeight : 0, p = (n ?? 0) < (r ?? 0), m = o.style.display === "none", h = parseFloat(o.style.top) || 0, g = parseFloat(o.style.left) || 0;
+		if (o.style.transition = "", o.style.transform = "", o.style.display = "block", i === "row" ? (o.style.top = `${p ? c.top + c.height - s.height : c.top}px`, o.style.left = `${l?.left ?? c.left}px`, o.style.width = `${(l?.width ?? c.width) - d}px`, o.style.height = `${s.height}px`) : (o.style.top = `${l?.top ?? c.top}px`, o.style.left = `${p ? c.left + c.width - s.width : c.left}px`, o.style.width = `${s.width}px`, o.style.height = `${(l?.height ?? c.height) - f}px`), !m && !j()) {
+			let e = g - (parseFloat(o.style.left) || 0), t = h - (parseFloat(o.style.top) || 0);
+			(e !== 0 || t !== 0) && (o.style.transform = `translate(${e}px, ${t}px)`, o.offsetHeight, o.style.transition = A, o.style.transform = "translate(0, 0)");
+		}
+	}, [
+		e.placeholderRef,
+		e.tableRef,
+		e.bodyRef
+	]);
 	return {
 		applyShiftTransforms: r((e, r, l) => {
 			if (e === null || r === null) return;
@@ -214,7 +221,7 @@ var k = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", A = (e, t, n, i) => {
 			let y = (t, n, i) => {
 				let a = (t, a, o) => {
 					let c = "";
-					t > e && t <= r ? c = `translate${n}(-${i}px)` : t < e && t >= r && (c = `translate${n}(${i}px)`), o.style.transform = c, o.style.transition = t === e ? "none" : k, c && s.current.add(o), t === r ? a.setAttribute("data-drop-target", "true") : a.removeAttribute("data-drop-target");
+					t > e && t <= r ? c = `translate${n}(-${i}px)` : t < e && t >= r && (c = `translate${n}(${i}px)`), o.style.transform = c, o.style.transition = t === e || j() ? "none" : k, c && s.current.add(o), t === r ? a.setAttribute("data-drop-target", "true") : a.removeAttribute("data-drop-target");
 				};
 				if (m) for (let [e, { outer: n, inner: r }] of t) a(e, n, r);
 				else for (let e = h; e <= g; e++) {
@@ -228,7 +235,7 @@ var k = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", A = (e, t, n, i) => {
 				let t = i.current, a = u.current, o = (t, n, i) => {
 					let o = "";
 					t > e && t <= r ? o = `translateX(-${f.width}px)` : t < e && t >= r && (o = `translateX(${f.width}px)`);
-					for (let e of n) a.get(e) !== o && (e.style.transform = o, i && (e.style.transition = k), a.set(e, o), o && c.current.add(e));
+					for (let e of n) a.get(e) !== o && (e.style.transform = o, i && (e.style.transition = j() ? "none" : k), a.set(e, o), o && c.current.add(e));
 				};
 				if (m) for (let [e, n] of t) o(e, n, !0);
 				else for (let e = h; e <= g; e++) {
@@ -258,7 +265,7 @@ var k = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", A = (e, t, n, i) => {
 		prevTargetIndexRef: o,
 		draggedSizeRef: a
 	};
-}, j = (e) => {
+}, ee = (e) => {
 	let t = l(/* @__PURE__ */ new Map()), n = l(/* @__PURE__ */ new Map()), i = l(/* @__PURE__ */ new Map()), a = l(!1), o = r(() => {
 		t.current.clear(), n.current.clear(), i.current.clear();
 	}, []), s = r((e) => {
@@ -336,7 +343,7 @@ var k = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", A = (e, t, n, i) => {
 		}, []),
 		clearMaps: o
 	};
-}, M = (e, t) => {
+}, N = (e, t) => {
 	let n = e, r = 0, i = t.length - 1;
 	for (; r < i;) {
 		let e = Math.floor((r + i) / 2), a = t[e];
@@ -344,7 +351,7 @@ var k = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", A = (e, t, n, i) => {
 		n < a.itemTop ? i = e - 1 : r = e + 1;
 	}
 	return +t[r].index;
-}, N = (e, t) => {
+}, P = (e, t) => {
 	let n = e, r = 0, i = t.length - 1;
 	for (; r < i;) {
 		let e = Math.floor((r + i) / 2), a = t[e];
@@ -353,14 +360,14 @@ var k = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", A = (e, t, n, i) => {
 	}
 	return +t[r].index;
 };
-function ee(e, t, n) {
+function te(e, t, n) {
 	let r = n.getBoundingClientRect();
 	return e > r.left + n.clientWidth || t > r.top + n.clientHeight;
 }
-var P = (e, t, n) => {
+var F = (e, t, n) => {
 	let r = Number(e);
 	return t !== void 0 && r < t || n !== void 0 && r > n;
-}, te = (e, t) => {
+}, ne = (e, t) => {
 	let n = l(null), i = l(null), a = r(() => {
 		let n = e.bodyRef?.current;
 		if (!n) return null;
@@ -402,14 +409,14 @@ var P = (e, t, n) => {
 		resolveDropIndex: r((e, t, r, i, s, c, l) => {
 			let u;
 			if (r === "row") {
-				if (u = n.current, u || (u = a(), n.current = u), u && u.length > 0) return M(t - c.y + l.height / 2 - i.top + s, u);
-			} else if (u = n.current, u || (u = o(), n.current = u), u && u.length > 0) return N(e - c.x + l.width / 2, u);
+				if (u = n.current, u || (u = a(), n.current = u), u && u.length > 0) return N(t - c.y + l.height / 2 - i.top + s, u);
+			} else if (u = n.current, u || (u = o(), n.current = u), u && u.length > 0) return P(e - c.x + l.width / 2, u);
 			return 0;
 		}, [a, o]),
 		cachedItemsRef: n,
 		cachedContainerRef: i
 	};
-}, ne = 200, F = 30, I = 5;
+}, I = 200, L = 30, R = 5;
 function re(e) {
 	let t = e, n = !1;
 	for (; t;) {
@@ -422,17 +429,17 @@ function re(e) {
 	}
 	return null;
 }
-var L = (e, t, n, i, o, c) => {
-	let { startAutoScroll: u, stopAutoScroll: d, setContainerRect: f, pointerRef: p, isAutoScrollingVertical: h, isAutoScrollingHorizontal: g } = C(e), _ = j(e), { rowIndexMapRef: v, colIndexMapRef: y, cellIndexMapRef: b, mapStaleRef: x } = _, { applyShiftTransforms: S, clearShiftTransforms: w, prevTargetIndexRef: T, draggedSizeRef: E } = A(e, v, y, b), D = te(e, o), { resolveDropIndex: k, cachedItemsRef: M, cachedContainerRef: N } = D, P = l(null), L = l({
+var z = (e, t, n, i, o, c) => {
+	let { startAutoScroll: u, stopAutoScroll: d, setContainerRect: f, pointerRef: p, isAutoScrollingVertical: h, isAutoScrollingHorizontal: g } = C(e), _ = ee(e), { rowIndexMapRef: v, colIndexMapRef: y, cellIndexMapRef: b, mapStaleRef: x } = _, { applyShiftTransforms: S, clearShiftTransforms: w, prevTargetIndexRef: T, draggedSizeRef: E } = M(e, v, y, b), D = ne(e, o), { resolveDropIndex: k, cachedItemsRef: A, cachedContainerRef: j } = D, N = l(null), P = l({
 		x: 0,
 		y: 0
-	}), R = l(null), z = l(null), B = l(!1), V = l(!1), H = l(null), U = l(null), W = l([]), G = r((t, r, i) => {
+	}), F = l(null), z = l(null), B = l(!1), V = l(!1), H = l(null), U = l(null), W = l([]), G = r((t, r, i) => {
 		let a = re(t.target);
 		if (!a) return;
 		let { element: o, foundHandle: s } = a;
 		if (!s && o.querySelector("[data-drag-handle]")) return;
 		let c = o.dataset.id, l = +o.dataset.index, u = o.dataset.type;
-		P.current = u ?? null, R.current = l, z.current = null, H.current = null, W.current = [], T.current = null, B.current = !1;
+		N.current = u ?? null, F.current = l, z.current = null, H.current = null, W.current = [], T.current = null, B.current = !1;
 		let d = u === "row" ? e.bodyRef?.current?.scrollLeft ?? 0 : 0, m = o.getBoundingClientRect();
 		E.current = {
 			width: m.width,
@@ -442,7 +449,7 @@ var L = (e, t, n, i, o, c) => {
 			x: r - m.left - d,
 			y: i - m.top
 		};
-		L.current = h, p.current = {
+		P.current = h, p.current = {
 			x: r,
 			y: i
 		};
@@ -450,9 +457,9 @@ var L = (e, t, n, i, o, c) => {
 			x: m.left + d,
 			y: m.top
 		};
-		M.current = u === "row" ? D.computeRowItems() : D.computeColumnItems();
+		A.current = u === "row" ? D.computeRowItems() : D.computeColumnItems();
 		let v = e.bodyRef?.current;
-		v && (N.current = v.getBoundingClientRect(), f(N.current)), _.buildMaps(u, v ?? null);
+		v && (j.current = v.getBoundingClientRect(), f(j.current)), _.buildMaps(u, v ?? null);
 		let y = e.tableRef?.current;
 		y && (y.style.touchAction = "none");
 		let b = o.firstElementChild;
@@ -522,8 +529,8 @@ var L = (e, t, n, i, o, c) => {
 		f,
 		D,
 		_,
-		M,
-		N,
+		A,
+		j,
 		E,
 		T
 	]), K = r((t, r, i, a, o) => {
@@ -558,15 +565,15 @@ var L = (e, t, n, i, o, c) => {
 		c
 	]), q = r(() => {
 		if (B.current) return;
-		B.current = !0, X(), setTimeout(() => {
-			Z.current = !1;
+		B.current = !0, Y(), setTimeout(() => {
+			X.current = !1;
 		}, 400);
-		let t = z.current, n = R.current, r = P.current, i = e.bodyRef?.current, a = i?.scrollTop ?? 0, o = i?.scrollLeft ?? 0;
-		M.current = null, N.current = null, d(), P.current = null, R.current = null, z.current = null;
+		let t = z.current, n = F.current, r = N.current, i = e.bodyRef?.current, a = i?.scrollTop ?? 0, o = i?.scrollLeft ?? 0;
+		A.current = null, j.current = null, d(), N.current = null, F.current = null, z.current = null;
 		let s = e.cloneRef?.current, c = e.placeholderRef?.current;
 		if (s && c && c.style.display !== "none") {
 			let e = parseFloat(c.style.left) || 0, i = parseFloat(c.style.top) || 0;
-			s.style.transition = `transform ${ne}ms cubic-bezier(0.2, 0, 0, 1)`, s.style.transform = `translate(${e}px, ${i}px)`, setTimeout(() => K(n, t, r, a, o), ne);
+			s.style.transition = `transform ${I}ms cubic-bezier(0.2, 0, 0, 1)`, s.style.transform = `translate(${e}px, ${i}px)`, setTimeout(() => K(n, t, r, a, o), I);
 		} else K(n, t, r, a, o);
 	}, [
 		d,
@@ -574,49 +581,49 @@ var L = (e, t, n, i, o, c) => {
 		e.placeholderRef,
 		e.cloneRef,
 		K
-	]), J = l(() => {}), { touchStart: Y, cancelLongPress: X, isTouchActiveRef: Z } = O(e, G, q, (e, t) => J.current(e, t)), Q = r((e) => {
-		e.button === 0 && e.target !== e.currentTarget && (Z.current || ee(e.clientX, e.clientY, e.target) || G(e, e.clientX, e.clientY));
-	}, [G, Z]), $ = r((t, n) => {
+	]), J = l(() => {}), { touchStart: ie, cancelLongPress: Y, isTouchActiveRef: X } = O(e, G, q, (e, t) => J.current(e, t)), Z = r((e) => {
+		e.button === 0 && e.target !== e.currentTarget && (X.current || te(e.clientX, e.clientY, e.target) || G(e, e.clientX, e.clientY));
+	}, [G, X]), Q = r((t, n) => {
 		if (B.current) return;
-		let r = L.current;
+		let r = P.current;
 		p.current.x = t, p.current.y = n;
 		let a = e.bodyRef?.current;
 		if (!a) return;
-		let o = N.current;
-		(!o || x.current) && (o = a.getBoundingClientRect(), N.current = o);
+		let o = j.current;
+		(!o || x.current) && (o = a.getBoundingClientRect(), j.current = o);
 		let s = a.scrollLeft, c = a.scrollTop, l = e.cloneRef?.current;
-		l && (l.style.transform = `translate(${t - r.x}px, ${n - r.y}px)`, P.current === "row" ? l.scrollLeft = s : H.current && (H.current.scrollTop = c));
-		let f = P.current || i;
-		if (V.current && _.checkStaleness(), x.current && (M.current = null, z.current = null, T.current = null, V.current ? f === "row" ? _.rebuildRowMap(a) : _.rebuildColumnMaps(a, e.headerRef?.current ?? null) : x.current = !1), f === "row") if (n < o.top + F) u(-I, a, "vertical"), x.current = !0;
-		else if (n > o.bottom - F) u(I, a, "vertical"), x.current = !0;
+		l && (l.style.transform = `translate(${t - r.x}px, ${n - r.y}px)`, N.current === "row" ? l.scrollLeft = s : H.current && (H.current.scrollTop = c));
+		let f = N.current || i;
+		if (V.current && _.checkStaleness(), x.current && (A.current = null, z.current = null, T.current = null, V.current ? f === "row" ? _.rebuildRowMap(a) : _.rebuildColumnMaps(a, e.headerRef?.current ?? null) : x.current = !1), f === "row") if (n < o.top + L) u(-R, a, "vertical"), x.current = !0;
+		else if (n > o.bottom - L) u(R, a, "vertical"), x.current = !0;
 		else {
 			let t = h.current;
 			d(), t && requestAnimationFrame(() => {
 				let t = e.bodyRef?.current;
 				if (!t) return;
-				V.current && _.rebuildRowMap(t), M.current = null;
+				V.current && _.rebuildRowMap(t), A.current = null;
 				let n = t.getBoundingClientRect();
-				N.current = n;
-				let r = k(p.current.x, p.current.y, "row", n, t.scrollTop, L.current, E.current);
-				z.current = r, T.current = null, S(R.current, r, "row");
+				j.current = n;
+				let r = k(p.current.x, p.current.y, "row", n, t.scrollTop, P.current, E.current);
+				z.current = r, T.current = null, S(F.current, r, "row");
 			});
 		}
-		else if (t < o.left + F) u(-I, a, "horizontal"), x.current = !0;
-		else if (t > o.right - F) u(I, a, "horizontal"), x.current = !0;
+		else if (t < o.left + L) u(-R, a, "horizontal"), x.current = !0;
+		else if (t > o.right - L) u(R, a, "horizontal"), x.current = !0;
 		else {
 			let t = g.current;
 			d(), t && requestAnimationFrame(() => {
 				let t = e.bodyRef?.current;
 				if (!t) return;
-				V.current && _.rebuildColumnMaps(t, e.headerRef?.current ?? null), M.current = null;
+				V.current && _.rebuildColumnMaps(t, e.headerRef?.current ?? null), A.current = null;
 				let n = t.getBoundingClientRect();
-				N.current = n;
-				let r = k(p.current.x, p.current.y, "column", n, t.scrollTop, L.current, E.current);
-				z.current = r, T.current = null, S(R.current, r, "column");
+				j.current = n;
+				let r = k(p.current.x, p.current.y, "column", n, t.scrollTop, P.current, E.current);
+				z.current = r, T.current = null, S(F.current, r, "column");
 			});
 		}
 		let m = k(t, n, f, o, c, r, E.current);
-		m !== z.current && (z.current = m, requestAnimationFrame(() => S(R.current, m, f)));
+		m !== z.current && (z.current = m, requestAnimationFrame(() => S(F.current, m, f)));
 	}, [
 		p,
 		e.bodyRef,
@@ -630,15 +637,15 @@ var L = (e, t, n, i, o, c) => {
 		_,
 		k,
 		S,
-		M,
-		N,
+		A,
+		j,
 		x,
 		T,
 		E
 	]);
-	J.current = $;
-	let ie = r(() => {
-		X(), M.current = null, N.current = null;
+	J.current = Q;
+	let $ = r(() => {
+		Y(), A.current = null, j.current = null;
 		let t = e.cloneRef?.current;
 		t && (t.style.visibility = "hidden");
 		let r = e.tableRef?.current;
@@ -648,11 +655,11 @@ var L = (e, t, n, i, o, c) => {
 				targetIndex: null,
 				sourceIndex: null
 			}
-		}), d(), w(), P.current = null, R.current = null, z.current = null;
+		}), d(), w(), N.current = null, F.current = null, z.current = null;
 	}, [
-		X,
-		M,
-		N,
+		Y,
+		A,
+		j,
 		e.cloneRef,
 		e.tableRef,
 		n,
@@ -673,24 +680,24 @@ var L = (e, t, n, i, o, c) => {
 		if (!t.isDragging) return;
 		let e = 0, n = 0, r = !1, i = (t) => {
 			e = t.clientX, n = t.clientY, r || (r = !0, requestAnimationFrame(() => {
-				r = !1, $(e, n);
+				r = !1, Q(e, n);
 			}));
 		}, a = () => q(), o = (e) => {
-			e.key === "Escape" && ie();
+			e.key === "Escape" && $();
 		};
 		return window.addEventListener("pointermove", i), window.addEventListener("pointerup", a), window.addEventListener("pointercancel", a), window.addEventListener("keydown", o), () => {
 			window.removeEventListener("pointermove", i), window.removeEventListener("pointerup", a), window.removeEventListener("pointercancel", a), window.removeEventListener("keydown", o);
 		};
 	}, [
 		t.isDragging,
-		$,
+		Q,
 		q,
-		ie
+		$
 	]), {
-		dragStart: Q,
-		touchStart: Y
+		dragStart: Z,
+		touchStart: ie
 	};
-}, R = {
+}, B = {
 	columnDragRange: {
 		start: void 0,
 		end: void 0
@@ -701,7 +708,7 @@ var L = (e, t, n, i, o, c) => {
 	},
 	defaultSizing: 50
 };
-function z(e, t) {
+function V(e, t) {
 	switch (t.type) {
 		case "setDragged": return {
 			...e,
@@ -779,7 +786,7 @@ function z(e, t) {
 		default: throw Error("Unhandled action");
 	}
 }
-var B = {
+var H = {
 	dragged: {
 		initial: {
 			x: 0,
@@ -811,24 +818,24 @@ var B = {
 		placeholderRef: { current: null }
 	},
 	bodyScrollBarWidth: 0,
-	options: R,
+	options: B,
 	widths: [],
 	columnIds: []
-}, V = {
+}, U = {
 	position: "relative",
 	display: "flex",
 	flexFlow: "column"
-}, H = {
+}, W = {
 	position: "fixed",
 	pointerEvents: "none",
 	zIndex: 3,
 	top: 0,
 	left: 0,
 	display: "none"
-}, U = t(({ children: e, className: t, style: n, options: r, onDragEnd: i, renderPlaceholder: s }, m) => {
+}, G = t(({ children: e, className: t, style: n, options: r, onDragEnd: i, renderPlaceholder: s }, m) => {
 	let h = l(null), v = l(null), y = l(null);
 	o(m, () => h.current, []);
-	let [b] = u(() => x(z, B)), S = d(b.subscribe, b.getState), C = b.dispatch;
+	let [b] = u(() => x(V, H)), S = d(b.subscribe, b.getState), C = b.dispatch;
 	a(() => {
 		C({
 			type: "setRef",
@@ -862,7 +869,7 @@ var B = {
 			value: r
 		});
 	}, [r, C]);
-	let { dragStart: w, touchStart: T } = L(S.refs, S.dragged, C, S.dragType, S.options, i), E = c(() => ({
+	let { dragStart: w, touchStart: T } = z(S.refs, S.dragged, C, S.dragType, S.options, i), E = c(() => ({
 		position: "fixed",
 		zIndex: "5",
 		pointerEvents: "none",
@@ -898,7 +905,7 @@ var B = {
 				}),
 				/* @__PURE__ */ f("div", {
 					ref: y,
-					style: H,
+					style: W,
 					children: s ? s() : /* @__PURE__ */ f("div", { style: {
 						width: "100%",
 						height: "100%"
@@ -910,7 +917,7 @@ var B = {
 					onMouseDown: w,
 					onTouchStart: T,
 					style: {
-						...V,
+						...U,
 						...n
 					},
 					className: `table ${t ?? ""}`,
@@ -920,10 +927,10 @@ var B = {
 		})
 	});
 });
-U.displayName = "TableProvider";
+G.displayName = "TableProvider";
 //#endregion
 //#region src/Components/TableHeader.tsx
-var W = t(({ children: e, style: t, className: n }, i) => {
+var K = t(({ children: e, style: t, className: n }, i) => {
 	let o = l(null), u = i || o, d = v((e) => e.bodyScrollBarWidth), p = v((e) => e.dragged.isDragging), m = v((e) => e.refs), h = y(), g = r((e) => "current" in e ? e.current : null, []);
 	a(() => {
 		o.current && h({
@@ -989,11 +996,11 @@ var W = t(({ children: e, style: t, className: n }, i) => {
 		})
 	});
 });
-W.displayName = "TableHeader";
+K.displayName = "TableHeader";
 //#endregion
 //#region src/Components/Draggable.tsx
-var G = n(({ children: e, id: t, index: n, type: r, styles: i = {} }) => {
-	let o = v((e) => e.options.rowDragRange), s = v((e) => e.options.columnDragRange), u = c(() => r === "row" ? P(n, o.start, o.end) : P(n, s.start, s.end), [
+var q = n(({ children: e, id: t, index: n, type: r, styles: i = {} }) => {
+	let o = v((e) => e.options.rowDragRange), s = v((e) => e.options.columnDragRange), u = c(() => r === "row" ? F(n, o.start, o.end) : F(n, s.start, s.end), [
 		n,
 		s.end,
 		s.start,
@@ -1021,16 +1028,16 @@ var G = n(({ children: e, id: t, index: n, type: r, styles: i = {} }) => {
 		})
 	});
 });
-G.displayName = "Draggable";
+q.displayName = "Draggable";
 //#endregion
 //#region src/Components/ColumnCell.tsx
-var K = n(({ children: e, style: t, className: n, ...r }) => {
+var J = n(({ children: e, style: t, className: n, ...r }) => {
 	let i = v((e) => e.options.defaultSizing), { width: a, flex: o, ...s } = t ?? {}, l = c(() => a === void 0 ? i : typeof a == "number" ? a : parseFloat(String(a)) || i, [a, i]), u = c(() => ({
 		width: `${l}px`,
 		flex: o === void 0 ? `${l} 0 auto` : o,
 		boxSizing: "border-box"
 	}), [l, o]);
-	return /* @__PURE__ */ f(G, {
+	return /* @__PURE__ */ f(q, {
 		...r,
 		styles: u,
 		type: "column",
@@ -1046,14 +1053,14 @@ var K = n(({ children: e, style: t, className: n, ...r }) => {
 		})
 	});
 });
-K.displayName = "ColumnCell";
+J.displayName = "ColumnCell";
 //#endregion
 //#region src/Components/TableBody.tsx
-var q = {
+var ie = {
 	display: "flex",
 	overflow: "hidden",
 	flex: 1
-}, J = t(({ children: e, style: t, className: n }, r) => {
+}, Y = t(({ children: e, style: t, className: n }, r) => {
 	let i = l(null);
 	o(r, () => i.current, []);
 	let u = v((e) => e.dragged.isDragging), d = v((e) => e.refs), p = y();
@@ -1081,7 +1088,7 @@ var q = {
 		}
 	}, [p, i]), /* @__PURE__ */ f("div", {
 		className: `body ${n ?? ""}`,
-		style: q,
+		style: ie,
 		children: /* @__PURE__ */ f("div", {
 			className: "ibody",
 			style: h,
@@ -1091,16 +1098,16 @@ var q = {
 			children: e
 		})
 	});
-}), Y = {
+}), X = {
 	display: "flex",
 	flex: "1 0 auto",
 	minHeight: "24px"
-}, X = n(({ children: e, style: t, className: n, ...r }) => {
+}, Z = n(({ children: e, style: t, className: n, ...r }) => {
 	let i = c(() => t ? {
-		...Y,
+		...X,
 		...t
-	} : Y, [t]), a = h("tr", n);
-	return /* @__PURE__ */ f(G, {
+	} : X, [t]), a = h("tr", n);
+	return /* @__PURE__ */ f(q, {
 		...r,
 		type: "row",
 		children: /* @__PURE__ */ f("div", {
@@ -1110,10 +1117,10 @@ var q = {
 		})
 	});
 });
-X.displayName = "BodyRow";
+Z.displayName = "BodyRow";
 //#endregion
 //#region src/Components/RowCell.tsx
-var Z = n(({ children: e, style: t, className: n, ...r }) => {
+var Q = n(({ children: e, style: t, className: n, ...r }) => {
 	let { index: i } = r, a = v((e) => e.widths), o = v((e) => e.options.defaultSizing), s = c(() => a[i] ?? o, [
 		a,
 		i,
@@ -1132,10 +1139,10 @@ var Z = n(({ children: e, style: t, className: n, ...r }) => {
 		children: e
 	});
 });
-Z.displayName = "RowCell";
+Q.displayName = "RowCell";
 //#endregion
 //#region src/Components/DragHandle.tsx
-var Q = n(({ children: e, className: t, style: n }) => /* @__PURE__ */ f("div", {
+var $ = n(({ children: e, className: t, style: n }) => /* @__PURE__ */ f("div", {
 	"data-drag-handle": "true",
 	className: t,
 	style: {
@@ -1147,6 +1154,6 @@ var Q = n(({ children: e, className: t, style: n }) => /* @__PURE__ */ f("div",
 	},
 	children: e
 }));
-Q.displayName = "DragHandle";
+$.displayName = "DragHandle";
 //#endregion
-export { X as BodyRow, K as ColumnCell, Q as DragHandle, Z as RowCell, J as TableBody, U as TableContainer, W as TableHeader, b as useTable, y as useTableDispatch, v as useTableStore };
+export { Z as BodyRow, J as ColumnCell, $ as DragHandle, Q as RowCell, Y as TableBody, G as TableContainer, K as TableHeader, b as useTable, y as useTableDispatch, v as useTableStore };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-table-dnd",
-  "version": "2.0.6",
+  "version": "2.0.8",
   "type": "module",
   "description": "Sortable table with draggable rows and columns",
   "main": "dist/index.cjs.js",
@@ -13,7 +13,8 @@
       "require": "./dist/index.cjs.js",
       "types": "./dist/index.d.ts"
     },
-    "./styles": "./dist/react-table-dnd.css"
+    "./styles": "./dist/react-table-dnd.css",
+    "./dist/react-table-dnd.css": "./dist/react-table-dnd.css"
   },
   "sideEffects": [
     "**/*.css"