react-table-dnd 2.0.0 → 2.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -51,7 +51,7 @@
51
51
  npm install react-table-dnd
52
52
  ```
53
53
 
54
- > Requires `react` and `react-dom` >= 17.0.0
54
+ > Requires `react` and `react-dom` >= 18.0.0
55
55
 
56
56
  ## Quick Start
57
57
 
package/dist/index.cjs.js CHANGED
@@ -1 +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,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports),s=(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},c=(n,r,a)=>(a=n==null?{}:e(i(n)),s(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));let l=require(`react`);l=c(l);let u=require(`react/jsx-runtime`),d=require(`react-dom`),f=require(`classnames`);f=c(f);var p=({children:e,className:t})=>(0,u.jsx)(`div`,{"data-flexitable-root":``,className:t??``,children:e}),m=o((e=>{var t=require(`react`);function n(e,t){return e===t&&(e!==0||1/e==1/t)||e!==e&&t!==t}var r=typeof Object.is==`function`?Object.is:n,i=t.useState,a=t.useEffect,o=t.useLayoutEffect,s=t.useDebugValue;function c(e,t){var n=t(),r=i({inst:{value:n,getSnapshot:t}}),c=r[0].inst,u=r[1];return o(function(){c.value=n,c.getSnapshot=t,l(c)&&u({inst:c})},[e,n,t]),a(function(){return l(c)&&u({inst:c}),e(function(){l(c)&&u({inst:c})})},[e]),s(n),n}function l(e){var t=e.getSnapshot;e=e.value;try{var n=t();return!r(e,n)}catch{return!0}}function u(e,t){return t()}var d=typeof window>`u`||window.document===void 0||window.document.createElement===void 0?u:c;e.useSyncExternalStore=t.useSyncExternalStore===void 0?d:t.useSyncExternalStore})),h=o((e=>{process.env.NODE_ENV!==`production`&&(function(){function t(e,t){return e===t&&(e!==0||1/e==1/t)||e!==e&&t!==t}function n(e,t){d||a.startTransition===void 0||(d=!0,console.error(`You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release.`));var n=t();if(!f){var i=t();o(n,i)||(console.error(`The result of getSnapshot should be cached to avoid an infinite loop`),f=!0)}i=s({inst:{value:n,getSnapshot:t}});var p=i[0].inst,m=i[1];return l(function(){p.value=n,p.getSnapshot=t,r(p)&&m({inst:p})},[e,n,t]),c(function(){return r(p)&&m({inst:p}),e(function(){r(p)&&m({inst:p})})},[e]),u(n),n}function r(e){var t=e.getSnapshot;e=e.value;try{var n=t();return!o(e,n)}catch{return!0}}function i(e,t){return t()}typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<`u`&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart==`function`&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());var a=require(`react`),o=typeof Object.is==`function`?Object.is:t,s=a.useState,c=a.useEffect,l=a.useLayoutEffect,u=a.useDebugValue,d=!1,f=!1,p=typeof window>`u`||window.document===void 0||window.document.createElement===void 0?i:n;e.useSyncExternalStore=a.useSyncExternalStore===void 0?p:a.useSyncExternalStore,typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<`u`&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop==`function`&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error())})()})),g=o(((e,t)=>{process.env.NODE_ENV===`production`?t.exports=m():t.exports=h()}))(),_=(0,l.createContext)(null),v=e=>{let t=(0,l.useContext)(_);if(!t)throw Error(`useTableStore must be used within TableProvider`);return(0,g.useSyncExternalStore)(t.subscribe,()=>e(t.getState()))},y=()=>{let e=(0,l.useContext)(_);if(!e)throw Error(`useTableDispatch must be used within TableProvider`);return e.dispatch},b=()=>{let e=(0,l.useContext)(_);if(!e)throw Error(`useTable must be used within a TableProvider`);return{state:(0,g.useSyncExternalStore)(e.subscribe,e.getState),dispatch:e.dispatch}};function x(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 S=30,C=e=>{let{headerRef:t,bodyRef:n}=e,r=(0,l.useRef)(null),i=(0,l.useRef)(t),a=(0,l.useRef)(!1),o=(0,l.useRef)(!1),s=(0,l.useRef)(0),c=(0,l.useRef)(null),u=(0,l.useRef)({x:0,y:0}),d=(0,l.useRef)(null),f=(0,l.useCallback)(e=>{d.current=e},[]),p=(0,l.useCallback)(()=>{o.current=!1,a.current=!1,c.current!==null&&(cancelAnimationFrame(c.current),c.current=null)},[]),m=(0,l.useCallback)((e,t,n)=>{let l=n===`vertical`,f=l?o:a;if(!f.current)return;let p=d.current;if(p){let e=u.current;if(l){let t=e.y<p.top+S,n=e.y>p.bottom-S;if(!t&&!n){f.current=!1;return}}else{let t=e.x<p.left+S,n=e.x>p.right-S;if(!t&&!n){f.current=!1;return}}}let m=l?t.scrollHeight-t.clientHeight:t.scrollWidth-t.clientWidth;if(l)t.scrollTop+=e;else{t.scrollLeft+=e;let n=i.current;n?.current&&(n.current.scrollLeft=t.scrollLeft)}let h=l?t.scrollTop:t.scrollLeft;if(h>=m||h<=0){f.current=!1;return}s.current+=e/1e3,c.current=requestAnimationFrame(()=>r.current?.(e+s.current,t,n))},[]);return(0,l.useEffect)(()=>{r.current=m},[m]),{startAutoScroll:(0,l.useCallback)((e,t,n)=>{let r=n===`vertical`?o:a;r.current||(r.current=!0,s.current=0,c.current=requestAnimationFrame(()=>m(e,t,n)))},[m]),stopAutoScroll:p,setContainerRect:f,isAutoScrollingVertical:o,isAutoScrollingHorizontal:a,pointerRef:u,BodyScrollHandle:(0,l.useCallback)(e=>{t?.current&&e.currentTarget&&(t.current.scrollLeft=e.currentTarget.scrollLeft)},[t]),HeaderScrollHandle:(0,l.useCallback)(e=>{n?.current&&e.currentTarget&&(n.current.scrollLeft=e.currentTarget.scrollLeft)},[n])}},w=300,T=8,E=.92,D=.5;function O(e,t,n,r){let i=(0,l.useRef)(null),a=(0,l.useRef)({x:0,y:0}),o=(0,l.useRef)(null),s=(0,l.useRef)(!1),c=(0,l.useRef)(null),u=(0,l.useRef)(null),d=(0,l.useCallback)(()=>{u.current!==null&&(cancelAnimationFrame(u.current),u.current=null)},[]),f=(0,l.useCallback)(()=>{i.current&&=(clearTimeout(i.current),null),o.current=null,c.current&&=(c.current(),null)},[]);return{touchStart:(0,l.useCallback)(l=>{if(l.target===l.currentTarget)return;let p=l.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=l.touches[0];a.current={x:h.clientX,y:h.clientY},o.current=l;let g=e.tableRef?.current;if(!g)return;let _=!1,v=!1,y=h.clientY,b=h.clientX,x=0,S=0,C=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})(l.target),A=t=>{t.preventDefault();let n=t.touches[0],s=Date.now(),c=Math.max(s-C,1);if(C=s,v){let t=n.clientY-y,r=n.clientX-b;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)))}x=-t/c*16,S=-r/c*16,y=n.clientY,b=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)>T||Math.abs(t)>T)&&(i.current&&=(clearTimeout(i.current),null),o.current=null,v=!0,y=n.clientY,b=n.clientX,x=0,S=0,C=Date.now())}},j=()=>{if(_)M(),n();else{if(f(),v&&k&&(Math.abs(x)>D||Math.abs(S)>D)){let e=k,t=()=>{x*=E,S*=E,e.scrollTop+=x,e.scrollLeft+=S,Math.abs(x)>D||Math.abs(S)>D?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),c.current=null};g.addEventListener(`touchmove`,A,{passive:!1}),g.addEventListener(`touchend`,j,!1),g.addEventListener(`touchcancel`,j,!1),c.current=M,i.current=setTimeout(()=>{i.current=null,_=!0;let e=o.current;o.current=null,e&&t(e,h.clientX,h.clientY)},w)},[t,n,r,f,d,e.tableRef?.current,e.bodyRef?.current]),cancelLongPress:f,isTouchActiveRef:s}}var k=`transform 450ms cubic-bezier(0.2, 0, 0, 1)`,A=(e,t,n,r)=>{let i=(0,l.useRef)({width:0,height:0}),a=(0,l.useRef)(null),o=(0,l.useRef)(new Set),s=(0,l.useRef)(new Set),c=(0,l.useRef)(new Map),u=(0,l.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,l.useCallback)((e,l,d)=>{if(e===null||l===null)return;let f=i.current,p=a.current,m=p===null,h=m?-1/0:Math.min(p,l,e)-1,g=m?1/0:Math.max(p,l,e)+1,_=null,v=(d===`row`?t.current:n.current).get(l);v&&(_=v.outer),u(_,e,l,d);let y=(t,n,r)=>{let i=(t,i,a)=>{let s=``;t>e&&t<=l?s=`translate${n}(-${r}px)`:t<e&&t>=l&&(s=`translate${n}(${r}px)`),a.style.transform=s,a.style.transition=t===e?`none`:k,s&&o.current.add(a),t===l?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=c.current,a=(t,n,r)=>{let a=``;t>e&&t<=l?a=`translateX(-${f.width}px)`:t<e&&t>=l&&(a=`translateX(${f.width}px)`);for(let e of n)i.get(e)!==a&&(e.style.transform=a,r&&(e.style.transition=k),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=l},[u,t,n,r]),clearShiftTransforms:(0,l.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(),c.current.clear(),a.current=null},[e.placeholderRef]),prevTargetIndexRef:a,draggedSizeRef:i}},j=e=>{let t=(0,l.useRef)(new Map),n=(0,l.useRef)(new Map),r=(0,l.useRef)(new Map),i=(0,l.useRef)(!1),a=(0,l.useCallback)(()=>{t.current.clear(),n.current.clear(),r.current.clear()},[]),o=(0,l.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,l.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})}},[]),c=(0,l.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,l.useCallback)((t,n)=>{if(a(),n){if(t===`row`)o(n);else if(t===`column`){let t=e.headerRef?.current;t&&s(t),c(n)}}},[e.headerRef,a,o,s,c]),rebuildRowMap:(0,l.useCallback)(e=>{i.current=!1,o(e)},[o]),rebuildColumnMaps:(0,l.useCallback)((e,t)=>{i.current=!1,t&&s(t),c(e)},[s,c]),checkStaleness:(0,l.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}},M=(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},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];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 ee(e,t,n){let r=n.getBoundingClientRect();return e>r.left+n.clientWidth||t>r.top+n.clientHeight}var P=(e,t,n)=>{let r=Number(e);return t!==void 0&&r<t||n!==void 0&&r>n},te=(e,t)=>{let n=(0,l.useRef)(null),r=(0,l.useRef)(null),i=(0,l.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,l.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,l.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 M(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 N(e-c.x+l.width/2,u);return 0},[i,a]),cachedItemsRef:n,cachedContainerRef:r}},F=200,I=30,L=5;function ne(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 R=(e,t,n,r,i,a)=>{let{startAutoScroll:o,stopAutoScroll:s,setContainerRect:c,pointerRef:u,isAutoScrollingVertical:f,isAutoScrollingHorizontal:p}=C(e),m=j(e),{rowIndexMapRef:h,colIndexMapRef:g,cellIndexMapRef:_,mapStaleRef:v}=m,{applyShiftTransforms:y,clearShiftTransforms:b,prevTargetIndexRef:x,draggedSizeRef:S}=A(e,h,g,_),w=te(e,i),{resolveDropIndex:T,cachedItemsRef:E,cachedContainerRef:D}=w,k=(0,l.useRef)(null),M=(0,l.useRef)({x:0,y:0}),N=(0,l.useRef)(null),P=(0,l.useRef)(null),R=(0,l.useRef)(!1),z=(0,l.useRef)(!1),B=(0,l.useRef)(null),V=(0,l.useRef)(null),H=(0,l.useRef)([]),U=(0,l.useCallback)((t,r,i)=>{let a=ne(t.target);if(!a)return;let{element:o,foundHandle:s}=a;if(!s&&o.querySelector(`[data-drag-handle]`))return;let l=o.dataset.id,d=+o.dataset.index,f=o.dataset.type;k.current=f??null,N.current=d,P.current=null,B.current=null,H.current=[],x.current=null,R.current=!1;let p=f===`row`?e.bodyRef?.current?.scrollLeft??0:0,h=o.getBoundingClientRect();S.current={width:h.width,height:h.height};let g={x:r-h.left-p,y:i-h.top};M.current=g,u.current={x:r,y:i};let _={x:h.left+p,y:h.top};E.current=f===`row`?w.computeRowItems():w.computeColumnItems();let v=e.bodyRef?.current;v&&(D.current=v.getBoundingClientRect(),c(D.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`),V.current=b;let C=e.cloneRef?.current;if(C){if(C.innerHTML=``,C.style.transform=`translate(${_.x}px, ${_.y}px)`,z.current=(v?.querySelector(`[data-type="row"]`))?.style.position===`absolute`,f===`row`){let e=o.firstElementChild?.firstElementChild;e&&C.appendChild(e.cloneNode(!0))}else if(f===`column`&&v){let e=String(d),t=o.querySelector(`.th`);if(t){let e=document.createElement(`div`);e.style.flexShrink=`0`,e.style.order=`-1`,e.appendChild(t.cloneNode(!0)),C.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(z.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),z.current?(n.style.overflow=`auto`,n.style.scrollbarWidth=`none`,n.className=`clone-body-strip`):n.style.overflow=`hidden`,C.appendChild(n),B.current=n,H.current=[],v.querySelectorAll(`[data-col-index="${e}"]`).forEach(e=>{e.style.opacity=`0`,H.current.push(e)})}}n({type:`dragStart`,value:{rect:{draggedItemHeight:h.height,draggedItemWidth:h.width},dragged:{initial:g,translate:_,draggedID:l??null,isDragging:!0,sourceIndex:d},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 T=v?.scrollLeft??0,O=v?.scrollTop??0;requestAnimationFrame(()=>{let t=e.cloneRef?.current;t&&(f===`row`?t.scrollLeft=T:B.current&&(B.current.scrollTop=O))})},[n,e,u,c,w,m,E,D,S,x]),W=(0,l.useCallback)((t,r,i,o,s)=>{let c=e.cloneRef?.current;c&&(c.style.visibility=`hidden`),V.current&&=(V.current.style.opacity=``,V.current.style.pointerEvents=``,V.current.style.zIndex=``,V.current.style.cursor=``,null),H.current.forEach(e=>{e.style.opacity=``}),H.current=[];let l=e.tableRef?.current;l&&(l.style.touchAction=``),(0,d.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}})}),b();let u=e.bodyRef?.current;u&&(u.scrollTop=o,u.scrollLeft=s,requestAnimationFrame(()=>{u.scrollTop=o,u.scrollLeft=s}))},[n,e.bodyRef,e.cloneRef,e.tableRef,b,a]),G=(0,l.useCallback)(()=>{if(R.current)return;R.current=!0,J(),setTimeout(()=>{Y.current=!1},400);let t=P.current,n=N.current,r=k.current,i=e.bodyRef?.current,a=i?.scrollTop??0,o=i?.scrollLeft??0;E.current=null,D.current=null,s(),k.current=null,N.current=null,P.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 ${F}ms cubic-bezier(0.2, 0, 0, 1)`,c.style.transform=`translate(${e}px, ${i}px)`,setTimeout(()=>W(n,t,r,a,o),F)}else W(n,t,r,a,o)},[s,e.bodyRef,e.placeholderRef,e.cloneRef,W]),K=(0,l.useRef)(()=>{}),{touchStart:q,cancelLongPress:J,isTouchActiveRef:Y}=O(e,U,G,(e,t)=>K.current(e,t)),X=(0,l.useCallback)(e=>{e.button===0&&e.target!==e.currentTarget&&(Y.current||ee(e.clientX,e.clientY,e.target)||U(e,e.clientX,e.clientY))},[U,Y]),Z=(0,l.useCallback)((t,n)=>{if(R.current)return;let i=M.current;u.current.x=t,u.current.y=n;let a=e.bodyRef?.current;if(!a)return;let c=D.current;(!c||v.current)&&(c=a.getBoundingClientRect(),D.current=c);let l=a.scrollLeft,d=a.scrollTop,h=e.cloneRef?.current;h&&(h.style.transform=`translate(${t-i.x}px, ${n-i.y}px)`,k.current===`row`?h.scrollLeft=l:B.current&&(B.current.scrollTop=d));let g=k.current||r;if(z.current&&m.checkStaleness(),v.current&&(E.current=null,P.current=null,x.current=null,z.current?g===`row`?m.rebuildRowMap(a):m.rebuildColumnMaps(a,e.headerRef?.current??null):v.current=!1),g===`row`)if(n<c.top+I)o(-L,a,`vertical`),v.current=!0;else if(n>c.bottom-I)o(L,a,`vertical`),v.current=!0;else{let t=f.current;s(),t&&requestAnimationFrame(()=>{let t=e.bodyRef?.current;if(!t)return;z.current&&m.rebuildRowMap(t),E.current=null;let n=t.getBoundingClientRect();D.current=n;let r=T(u.current.x,u.current.y,`row`,n,t.scrollTop,M.current,S.current);P.current=r,x.current=null,y(N.current,r,`row`)})}else if(t<c.left+I)o(-L,a,`horizontal`),v.current=!0;else if(t>c.right-I)o(L,a,`horizontal`),v.current=!0;else{let t=p.current;s(),t&&requestAnimationFrame(()=>{let t=e.bodyRef?.current;if(!t)return;z.current&&m.rebuildColumnMaps(t,e.headerRef?.current??null),E.current=null;let n=t.getBoundingClientRect();D.current=n;let r=T(u.current.x,u.current.y,`column`,n,t.scrollTop,M.current,S.current);P.current=r,x.current=null,y(N.current,r,`column`)})}let _=T(t,n,g,c,d,i,S.current);_!==P.current&&(P.current=_,requestAnimationFrame(()=>y(N.current,_,g)))},[u,e.bodyRef,e.cloneRef,e.headerRef,r,o,s,f,p,m,T,y,E,D,v,x,S]);K.current=Z;let Q=(0,l.useCallback)(()=>{J(),E.current=null,D.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(),b(),k.current=null,N.current=null,P.current=null},[J,E,D,e.cloneRef,e.tableRef,n,s,b]);return(0,l.useLayoutEffect)(()=>{if(!t.isDragging){b();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,b,e.cloneRef]),(0,l.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,Z(e,n)}))},a=()=>G(),o=e=>{e.key===`Escape`&&Q()};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,Z,G,Q]),{dragStart:X,touchStart:q}},z={columnDragRange:{start:void 0,end:void 0},rowDragRange:{start:void 0,end:void 0},defaultSizing:50};function B(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 V={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:z,widths:[],columnIds:[]},H={position:`relative`,display:`flex`,flexFlow:`column`},U={position:`fixed`,pointerEvents:`none`,zIndex:3,top:0,left:0,display:`none`},W=(0,l.forwardRef)(({children:e,className:t,style:n,options:r,onDragEnd:i,renderPlaceholder:a},o)=>{let s=(0,l.useRef)(null),c=(0,l.useRef)(null),d=(0,l.useRef)(null);(0,l.useImperativeHandle)(o,()=>s.current,[]);let[f]=(0,l.useState)(()=>x(B,V)),m=(0,g.useSyncExternalStore)(f.subscribe,f.getState),h=f.dispatch;(0,l.useEffect)(()=>{h({type:`setRef`,refName:`tableRef`,value:s}),h({type:`setRef`,refName:`cloneRef`,value:c}),h({type:`setRef`,refName:`placeholderRef`,value:d})},[s,h]),(0,l.useEffect)(()=>{let e=()=>{s.current&&h({type:`setTableDimensions`,value:{height:s.current.offsetHeight,width:s.current.offsetWidth}})};return e(),window.addEventListener(`resize`,e),()=>{window.removeEventListener(`resize`,e)}},[s,h]),(0,l.useEffect)(()=>{r&&h({type:`setOptions`,value:r})},[r,h]);let{dragStart:v,touchStart:y}=R(m.refs,m.dragged,h,m.dragType,m.options,i),b=(0,l.useMemo)(()=>({position:`fixed`,zIndex:`5`,pointerEvents:`none`,top:0,left:0,display:`flex`,flexDirection:`column`,height:m.dragType===`row`?m.rect.draggedItemHeight:`${m.tableDimensions.height}px`,width:m.dragType===`column`?`${m.rect.draggedItemWidth}px`:`${m.tableDimensions.width}px`,overflow:`scroll`,scrollbarWidth:`none`,boxShadow:m.dragged.isDragging?`0 0 10px 0 rgba(0, 0, 0, 0.1)`:`none`}),[m.dragType,m.dragged.isDragging,m.rect.draggedItemHeight,m.rect.draggedItemWidth,m.tableDimensions.height,m.tableDimensions.width]);return(0,u.jsx)(_.Provider,{value:f,children:(0,u.jsxs)(p,{className:m.dragged.isDragging?`is-dragging`:``,children:[(0,u.jsx)(`div`,{id:`portalroot`,style:{...b,visibility:m.dragged.isDragging?`visible`:`hidden`},ref:c}),(0,u.jsx)(`div`,{ref:d,style:U,children:a?a():(0,u.jsx)(`div`,{style:{width:`100%`,height:`100%`}})}),(0,u.jsx)(`div`,{"data-contextid":`context`,ref:s,onMouseDown:v,onTouchStart:y,style:{...H,...n},className:`table ${t??``}`,children:e})]})})});W.displayName=`TableProvider`;var G=(0,l.forwardRef)(({children:e,style:t,className:n},r)=>{let i=(0,l.useRef)(null),a=r||i,o=v(e=>e.bodyScrollBarWidth),s=v(e=>e.dragged.isDragging),c=v(e=>e.refs),d=y(),f=(0,l.useCallback)(e=>`current`in e?e.current:null,[]);(0,l.useEffect)(()=>{i.current&&d({type:`setRef`,refName:`headerRef`,value:i})},[d]);let{HeaderScrollHandle:p}=C(c),m={display:`flex`,flex:`1 0 auto`},h=(0,l.useMemo)(()=>({overflowX:`scroll`,overflowY:`clip`,scrollbarWidth:`none`,display:`flex`,paddingRight:`${o}px`,userSelect:s?`none`:`auto`,...t}),[o,s,t]);return(0,l.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,l.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,u.jsx)(`div`,{className:`header ${n??``}`,children:(0,u.jsx)(`div`,{className:`thead`,style:h,"data-droppableid":`header`,onScroll:p,ref:a,children:(0,u.jsx)(`div`,{style:m,className:`tr`,children:e})})})});G.displayName=`TableHeader`;var K=(0,l.memo)(({children:e,id:t,index:n,type:r,styles:i={}})=>{let a=v(e=>e.options.rowDragRange),o=v(e=>e.options.columnDragRange),s=(0,l.useMemo)(()=>r===`row`?P(n,a.start,a.end):P(n,o.start,o.end),[n,o.end,o.start,a.end,a.start,r]),c=(0,l.useRef)(null),d=(0,l.useMemo)(()=>({cursor:s?`auto`:`-webkit-grab`,display:`flex`}),[s]);return(0,l.useEffect)(()=>{c.current&&c.current.querySelector(`[data-drag-handle]`)&&(c.current.style.cursor=`auto`)},[e,s]),(0,u.jsx)(`div`,{className:`draggable`,"data-id":t,"data-index":n,"data-type":r,"data-disabled":s?`true`:`false`,style:i,children:(0,u.jsx)(`div`,{ref:c,style:d,children:e})})});K.displayName=`Draggable`;var q=(0,l.memo)(({children:e,style:t,className:n,...r})=>{let i=v(e=>e.options.defaultSizing),{width:a,flex:o,...s}=t??{},c=(0,l.useMemo)(()=>a===void 0?i:typeof a==`number`?a:parseFloat(String(a))||i,[a,i]),d=(0,l.useMemo)(()=>({width:`${c}px`,flex:o===void 0?`${c} 0 auto`:o}),[c,o]);return(0,u.jsx)(K,{...r,styles:d,type:`column`,children:(0,u.jsx)(`div`,{className:`th ${n??``}`,"data-width":c,style:{width:`100%`,...s},children:e})})});q.displayName=`ColumnCell`;var J={display:`flex`,overflow:`hidden`,flex:1},Y=(0,l.forwardRef)(({children:e,style:t,className:n},r)=>{let i=(0,l.useRef)(null);(0,l.useImperativeHandle)(r,()=>i.current,[]);let a=v(e=>e.dragged.isDragging),o=v(e=>e.refs),s=y();(0,l.useEffect)(()=>{s({type:`setRef`,refName:`bodyRef`,value:i})},[s,i]);let{BodyScrollHandle:c}=C(o),d=(0,l.useMemo)(()=>({overflowX:`auto`,overflowY:`auto`,flex:1,userSelect:a?`none`:`auto`,...t}),[a,t]);return(0,l.useEffect)(()=>{if(i.current){let e=i.current.clientWidth;s({type:`setBodyScrollBarWidth`,value:i.current.offsetWidth-e})}},[s,i]),(0,u.jsx)(`div`,{className:`body ${n??``}`,style:J,children:(0,u.jsx)(`div`,{className:`ibody`,style:d,"data-droppableid":`body`,onScroll:c,ref:i,children:e})})}),X={display:`flex`,flex:`1 0 auto`,minHeight:`24px`},Z=(0,l.memo)(({children:e,style:t,className:n,...r})=>{let i=(0,l.useMemo)(()=>t?{...X,...t}:X,[t]),a=(0,f.default)(`tr`,n);return(0,u.jsx)(K,{...r,type:`row`,children:(0,u.jsx)(`div`,{className:a,style:i,children:e})})});Z.displayName=`BodyRow`;var Q=(0,l.memo)(({children:e,style:t,className:n,...r})=>{let{index:i}=r,a=v(e=>e.widths),o=v(e=>e.options.defaultSizing),s=(0,l.useMemo)(()=>a[i]??o,[a,i,o]),c=(0,l.useMemo)(()=>({display:`inline-flex`,width:`${s}px`,flex:`${s} 0 auto`,...t}),[s,t]);return(0,u.jsx)(`div`,{className:`td ${n??``}`,style:c,"data-col-index":i,children:e})});Q.displayName=`RowCell`;var $=(0,l.memo)(({children:e,className:t,style:n})=>(0,u.jsx)(`div`,{"data-drag-handle":`true`,className:t,style:{cursor:`-webkit-grab`,display:`inline-flex`,alignItems:`center`,...n},children:e}));$.displayName=`DragHandle`,exports.BodyRow=Z,exports.ColumnCell=q,exports.DragHandle=$,exports.RowCell=Q,exports.TableBody=Y,exports.TableContainer=W,exports.TableHeader=G,exports.useTable=b,exports.useTableDispatch=y,exports.useTableStore=v;
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.useMemo)(()=>({cursor:s?`auto`:`-webkit-grab`,display:`flex`}),[s]);return(0,c.useEffect)(()=>{u.current&&u.current.querySelector(`[data-drag-handle]`)&&(u.current.style.cursor=`auto`)},[e,s]),(0,l.jsx)(`div`,{className:`draggable`,"data-id":t,"data-index":n,"data-type":r,"data-disabled":s?`true`:`false`,style:i,children:(0,l.jsx)(`div`,{ref:u,style:d,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}),[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},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.useEffect)(()=>{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}),[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`,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;
package/dist/index.es.js CHANGED
@@ -1,120 +1,31 @@
1
- import { createContext as e, forwardRef as t, memo as n, useCallback as r, useContext as i, useEffect as a, useImperativeHandle as o, useLayoutEffect as s, useMemo as c, useRef as l, useState as u } from "react";
2
- import { jsx as d, jsxs as f } from "react/jsx-runtime";
3
- import { flushSync as p } from "react-dom";
4
- import m from "classnames";
5
- //#region \0rolldown/runtime.js
6
- var h = (e, t) => () => (t || e((t = { exports: {} }).exports, t), t.exports), g = /* @__PURE__ */ ((e) => typeof require < "u" ? require : typeof Proxy < "u" ? new Proxy(e, { get: (e, t) => (typeof require < "u" ? require : e)[t] }) : e)(function(e) {
7
- if (typeof require < "u") return require.apply(this, arguments);
8
- throw Error("Calling `require` for \"" + e + "\" in an environment that doesn't expose the `require` function. See https://rolldown.rs/in-depth/bundling-cjs#require-external-modules for more details.");
9
- }), _ = ({ children: e, className: t }) => /* @__PURE__ */ d("div", {
1
+ import { createContext as e, forwardRef as t, memo as n, useCallback as r, useContext as i, useEffect as a, useImperativeHandle as o, useLayoutEffect as s, useMemo as c, useRef as l, useState as u, useSyncExternalStore as d } from "react";
2
+ import { jsx as f, jsxs as p } from "react/jsx-runtime";
3
+ import { flushSync as m } from "react-dom";
4
+ import h from "classnames";
5
+ //#region src/Components/TableContainer/styles.tsx
6
+ var g = ({ children: e, className: t }) => /* @__PURE__ */ f("div", {
10
7
  "data-flexitable-root": "",
11
8
  className: t ?? "",
12
9
  children: e
13
- }), v = /* @__PURE__ */ h(((e) => {
14
- var t = g("react");
15
- function n(e, t) {
16
- return e === t && (e !== 0 || 1 / e == 1 / t) || e !== e && t !== t;
17
- }
18
- var r = typeof Object.is == "function" ? Object.is : n, i = t.useState, a = t.useEffect, o = t.useLayoutEffect, s = t.useDebugValue;
19
- function c(e, t) {
20
- var n = t(), r = i({ inst: {
21
- value: n,
22
- getSnapshot: t
23
- } }), c = r[0].inst, u = r[1];
24
- return o(function() {
25
- c.value = n, c.getSnapshot = t, l(c) && u({ inst: c });
26
- }, [
27
- e,
28
- n,
29
- t
30
- ]), a(function() {
31
- return l(c) && u({ inst: c }), e(function() {
32
- l(c) && u({ inst: c });
33
- });
34
- }, [e]), s(n), n;
35
- }
36
- function l(e) {
37
- var t = e.getSnapshot;
38
- e = e.value;
39
- try {
40
- var n = t();
41
- return !r(e, n);
42
- } catch {
43
- return !0;
44
- }
45
- }
46
- function u(e, t) {
47
- return t();
48
- }
49
- var d = typeof window > "u" || window.document === void 0 || window.document.createElement === void 0 ? u : c;
50
- e.useSyncExternalStore = t.useSyncExternalStore === void 0 ? d : t.useSyncExternalStore;
51
- })), y = /* @__PURE__ */ h(((e) => {
52
- process.env.NODE_ENV !== "production" && (function() {
53
- function t(e, t) {
54
- return e === t && (e !== 0 || 1 / e == 1 / t) || e !== e && t !== t;
55
- }
56
- function n(e, t) {
57
- d || a.startTransition === void 0 || (d = !0, console.error("You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release."));
58
- var n = t();
59
- if (!f) {
60
- var i = t();
61
- o(n, i) || (console.error("The result of getSnapshot should be cached to avoid an infinite loop"), f = !0);
62
- }
63
- i = s({ inst: {
64
- value: n,
65
- getSnapshot: t
66
- } });
67
- var p = i[0].inst, m = i[1];
68
- return l(function() {
69
- p.value = n, p.getSnapshot = t, r(p) && m({ inst: p });
70
- }, [
71
- e,
72
- n,
73
- t
74
- ]), c(function() {
75
- return r(p) && m({ inst: p }), e(function() {
76
- r(p) && m({ inst: p });
77
- });
78
- }, [e]), u(n), n;
79
- }
80
- function r(e) {
81
- var t = e.getSnapshot;
82
- e = e.value;
83
- try {
84
- var n = t();
85
- return !o(e, n);
86
- } catch {
87
- return !0;
88
- }
89
- }
90
- function i(e, t) {
91
- return t();
92
- }
93
- typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
94
- var a = g("react"), o = typeof Object.is == "function" ? Object.is : t, s = a.useState, c = a.useEffect, l = a.useLayoutEffect, u = a.useDebugValue, d = !1, f = !1, p = typeof window > "u" || window.document === void 0 || window.document.createElement === void 0 ? i : n;
95
- e.useSyncExternalStore = a.useSyncExternalStore === void 0 ? p : a.useSyncExternalStore, typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
96
- })();
97
- })), b = (/* @__PURE__ */ h(((e, t) => {
98
- process.env.NODE_ENV === "production" ? t.exports = v() : t.exports = y();
99
- })))(), x = e(null), S = (e) => {
100
- let t = i(x);
10
+ }), _ = e(null), v = (e) => {
11
+ let t = i(_);
101
12
  if (!t) throw Error("useTableStore must be used within TableProvider");
102
- return (0, b.useSyncExternalStore)(t.subscribe, () => e(t.getState()));
103
- }, C = () => {
104
- let e = i(x);
13
+ return d(t.subscribe, () => e(t.getState()));
14
+ }, y = () => {
15
+ let e = i(_);
105
16
  if (!e) throw Error("useTableDispatch must be used within TableProvider");
106
17
  return e.dispatch;
107
- }, w = () => {
108
- let e = i(x);
18
+ }, b = () => {
19
+ let e = i(_);
109
20
  if (!e) throw Error("useTable must be used within a TableProvider");
110
21
  return {
111
- state: (0, b.useSyncExternalStore)(e.subscribe, e.getState),
22
+ state: d(e.subscribe, e.getState),
112
23
  dispatch: e.dispatch
113
24
  };
114
25
  };
115
26
  //#endregion
116
27
  //#region src/Components/TableContainer/store.ts
117
- function T(e, t) {
28
+ function x(e, t) {
118
29
  let n = t, r = /* @__PURE__ */ new Set();
119
30
  return {
120
31
  getState: () => n,
@@ -130,7 +41,7 @@ function T(e, t) {
130
41
  }
131
42
  //#endregion
132
43
  //#region src/hooks/useAutoScroll.ts
133
- var E = 30, D = (e) => {
44
+ var S = 30, C = (e) => {
134
45
  let { headerRef: t, bodyRef: n } = e, i = l(null), o = l(t), s = l(!1), c = l(!1), u = l(0), d = l(null), f = l({
135
46
  x: 0,
136
47
  y: 0
@@ -145,13 +56,13 @@ var E = 30, D = (e) => {
145
56
  if (l) {
146
57
  let e = f.current;
147
58
  if (r) {
148
- let t = e.y < l.top + E, n = e.y > l.bottom - E;
59
+ let t = e.y < l.top + S, n = e.y > l.bottom - S;
149
60
  if (!t && !n) {
150
61
  a.current = !1;
151
62
  return;
152
63
  }
153
64
  } else {
154
- let t = e.x < l.left + E, n = e.x > l.right - E;
65
+ let t = e.x < l.left + S, n = e.x > l.right - S;
155
66
  if (!t && !n) {
156
67
  a.current = !1;
157
68
  return;
@@ -191,8 +102,8 @@ var E = 30, D = (e) => {
191
102
  n?.current && e.currentTarget && (n.current.scrollLeft = e.currentTarget.scrollLeft);
192
103
  }, [n])
193
104
  };
194
- }, O = 300, k = 8, A = .92, j = .5;
195
- function M(e, t, n, i) {
105
+ }, w = 300, T = 8, E = .92, D = .5;
106
+ function O(e, t, n, i) {
196
107
  let a = l(null), o = l({
197
108
  x: 0,
198
109
  y: 0
@@ -221,9 +132,9 @@ function M(e, t, n, i) {
221
132
  }, s.current = r;
222
133
  let g = e.tableRef?.current;
223
134
  if (!g) return;
224
- let _ = !1, v = !1, y = h.clientY, b = h.clientX, x = 0, S = 0, C = Date.now(), w = (e) => e.preventDefault();
225
- document.addEventListener("selectstart", w);
226
- let T = ((t) => {
135
+ let _ = !1, v = !1, y = h.clientY, b = h.clientX, x = 0, S = 0, C = Date.now(), O = (e) => e.preventDefault();
136
+ document.addEventListener("selectstart", O);
137
+ let k = ((t) => {
227
138
  let n = e.bodyRef?.current, r = t;
228
139
  for (; r && r !== n;) {
229
140
  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;
@@ -231,27 +142,27 @@ function M(e, t, n, i) {
231
142
  r = r.parentElement;
232
143
  }
233
144
  return n ?? document.body;
234
- })(r.target), E = (t) => {
145
+ })(r.target), A = (t) => {
235
146
  t.preventDefault();
236
147
  let n = t.touches[0], r = Date.now(), c = Math.max(r - C, 1);
237
148
  if (C = r, v) {
238
149
  let t = n.clientY - y, r = n.clientX - b;
239
- if (T) {
240
- let n = e.bodyRef?.current, i = t > 0 && T.scrollTop <= 0, a = t < 0 && T.scrollTop + T.clientHeight >= T.scrollHeight - 1, o = r > 0 && T.scrollLeft <= 0, s = r < 0 && T.scrollLeft + T.clientWidth >= T.scrollWidth - 1, c = i || a, l = o || s;
241
- T === n ? (T.scrollTop -= t, T.scrollLeft -= r) : (l || (T.scrollLeft -= r), c || (T.scrollTop -= t), n && (c && (n.scrollTop -= t), l && (n.scrollLeft -= r)));
150
+ if (k) {
151
+ 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;
152
+ 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)));
242
153
  }
243
154
  x = -t / c * 16, S = -r / c * 16, y = n.clientY, b = n.clientX;
244
155
  } else if (_) i(n.clientX, n.clientY);
245
156
  else {
246
157
  let e = n.clientX - o.current.x, t = n.clientY - o.current.y;
247
- (Math.abs(e) > k || Math.abs(t) > k) && (a.current &&= (clearTimeout(a.current), null), s.current = null, v = !0, y = n.clientY, b = n.clientX, x = 0, S = 0, C = Date.now());
158
+ (Math.abs(e) > T || Math.abs(t) > T) && (a.current &&= (clearTimeout(a.current), null), s.current = null, v = !0, y = n.clientY, b = n.clientX, x = 0, S = 0, C = Date.now());
248
159
  }
249
- }, D = () => {
160
+ }, j = () => {
250
161
  if (_) M(), n();
251
162
  else {
252
- if (p(), v && T && (Math.abs(x) > j || Math.abs(S) > j)) {
253
- let e = T, t = () => {
254
- x *= A, S *= A, e.scrollTop += x, e.scrollLeft += S, Math.abs(x) > j || Math.abs(S) > j ? d.current = requestAnimationFrame(t) : d.current = null;
163
+ if (p(), v && k && (Math.abs(x) > D || Math.abs(S) > D)) {
164
+ let e = k, t = () => {
165
+ x *= E, S *= E, e.scrollTop += x, e.scrollLeft += S, Math.abs(x) > D || Math.abs(S) > D ? d.current = requestAnimationFrame(t) : d.current = null;
255
166
  };
256
167
  d.current = requestAnimationFrame(t);
257
168
  }
@@ -260,13 +171,13 @@ function M(e, t, n, i) {
260
171
  }, 400);
261
172
  }
262
173
  }, M = () => {
263
- g.removeEventListener("touchmove", E), g.removeEventListener("touchend", D), g.removeEventListener("touchcancel", D), document.removeEventListener("selectstart", w), u.current = null;
174
+ g.removeEventListener("touchmove", A), g.removeEventListener("touchend", j), g.removeEventListener("touchcancel", j), document.removeEventListener("selectstart", O), u.current = null;
264
175
  };
265
- g.addEventListener("touchmove", E, { passive: !1 }), g.addEventListener("touchend", D, !1), g.addEventListener("touchcancel", D, !1), u.current = M, a.current = setTimeout(() => {
176
+ g.addEventListener("touchmove", A, { passive: !1 }), g.addEventListener("touchend", j, !1), g.addEventListener("touchcancel", j, !1), u.current = M, a.current = setTimeout(() => {
266
177
  a.current = null, _ = !0;
267
178
  let e = s.current;
268
179
  s.current = null, e && t(e, h.clientX, h.clientY);
269
- }, O);
180
+ }, w);
270
181
  }, [
271
182
  t,
272
183
  n,
@@ -282,7 +193,7 @@ function M(e, t, n, i) {
282
193
  }
283
194
  //#endregion
284
195
  //#region src/hooks/useShiftTransforms.ts
285
- var N = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", ee = (e, t, n, i) => {
196
+ var k = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", A = (e, t, n, i) => {
286
197
  let a = l({
287
198
  width: 0,
288
199
  height: 0
@@ -303,7 +214,7 @@ var N = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", ee = (e, t, n, i) => {
303
214
  let y = (t, n, i) => {
304
215
  let a = (t, a, o) => {
305
216
  let c = "";
306
- 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" : N, c && s.current.add(o), t === r ? a.setAttribute("data-drop-target", "true") : a.removeAttribute("data-drop-target");
217
+ 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");
307
218
  };
308
219
  if (m) for (let [e, { outer: n, inner: r }] of t) a(e, n, r);
309
220
  else for (let e = h; e <= g; e++) {
@@ -317,7 +228,7 @@ var N = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", ee = (e, t, n, i) => {
317
228
  let t = i.current, a = u.current, o = (t, n, i) => {
318
229
  let o = "";
319
230
  t > e && t <= r ? o = `translateX(-${f.width}px)` : t < e && t >= r && (o = `translateX(${f.width}px)`);
320
- for (let e of n) a.get(e) !== o && (e.style.transform = o, i && (e.style.transition = N), a.set(e, o), o && c.current.add(e));
231
+ 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));
321
232
  };
322
233
  if (m) for (let [e, n] of t) o(e, n, !0);
323
234
  else for (let e = h; e <= g; e++) {
@@ -347,7 +258,7 @@ var N = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", ee = (e, t, n, i) => {
347
258
  prevTargetIndexRef: o,
348
259
  draggedSizeRef: a
349
260
  };
350
- }, te = (e) => {
261
+ }, j = (e) => {
351
262
  let t = l(/* @__PURE__ */ new Map()), n = l(/* @__PURE__ */ new Map()), i = l(/* @__PURE__ */ new Map()), a = l(!1), o = r(() => {
352
263
  t.current.clear(), n.current.clear(), i.current.clear();
353
264
  }, []), s = r((e) => {
@@ -425,7 +336,7 @@ var N = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", ee = (e, t, n, i) => {
425
336
  }, []),
426
337
  clearMaps: o
427
338
  };
428
- }, P = (e, t) => {
339
+ }, M = (e, t) => {
429
340
  let n = e, r = 0, i = t.length - 1;
430
341
  for (; r < i;) {
431
342
  let e = Math.floor((r + i) / 2), a = t[e];
@@ -433,7 +344,7 @@ var N = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", ee = (e, t, n, i) => {
433
344
  n < a.itemTop ? i = e - 1 : r = e + 1;
434
345
  }
435
346
  return +t[r].index;
436
- }, F = (e, t) => {
347
+ }, N = (e, t) => {
437
348
  let n = e, r = 0, i = t.length - 1;
438
349
  for (; r < i;) {
439
350
  let e = Math.floor((r + i) / 2), a = t[e];
@@ -442,14 +353,14 @@ var N = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", ee = (e, t, n, i) => {
442
353
  }
443
354
  return +t[r].index;
444
355
  };
445
- function ne(e, t, n) {
356
+ function ee(e, t, n) {
446
357
  let r = n.getBoundingClientRect();
447
358
  return e > r.left + n.clientWidth || t > r.top + n.clientHeight;
448
359
  }
449
- var I = (e, t, n) => {
360
+ var P = (e, t, n) => {
450
361
  let r = Number(e);
451
362
  return t !== void 0 && r < t || n !== void 0 && r > n;
452
- }, re = (e, t) => {
363
+ }, te = (e, t) => {
453
364
  let n = l(null), i = l(null), a = r(() => {
454
365
  let n = e.bodyRef?.current;
455
366
  if (!n) return null;
@@ -491,15 +402,15 @@ var I = (e, t, n) => {
491
402
  resolveDropIndex: r((e, t, r, i, s, c, l) => {
492
403
  let u;
493
404
  if (r === "row") {
494
- if (u = n.current, u || (u = a(), n.current = u), u && u.length > 0) return P(t - c.y + l.height / 2 - i.top + s, u);
495
- } else if (u = n.current, u || (u = o(), n.current = u), u && u.length > 0) return F(e - c.x + l.width / 2, u);
405
+ 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);
406
+ } else if (u = n.current, u || (u = o(), n.current = u), u && u.length > 0) return N(e - c.x + l.width / 2, u);
496
407
  return 0;
497
408
  }, [a, o]),
498
409
  cachedItemsRef: n,
499
410
  cachedContainerRef: i
500
411
  };
501
- }, L = 200, R = 30, z = 5;
502
- function ie(e) {
412
+ }, ne = 200, F = 30, I = 5;
413
+ function re(e) {
503
414
  let t = e, n = !1;
504
415
  for (; t;) {
505
416
  if (t.dataset?.dragHandle === "true" && (n = !0), t.dataset?.contextid || t.dataset?.disabled === "true") return null;
@@ -511,44 +422,44 @@ function ie(e) {
511
422
  }
512
423
  return null;
513
424
  }
514
- var B = (e, t, n, i, o, c) => {
515
- let { startAutoScroll: u, stopAutoScroll: d, setContainerRect: f, pointerRef: m, isAutoScrollingVertical: h, isAutoScrollingHorizontal: g } = D(e), _ = te(e), { rowIndexMapRef: v, colIndexMapRef: y, cellIndexMapRef: b, mapStaleRef: x } = _, { applyShiftTransforms: S, clearShiftTransforms: C, prevTargetIndexRef: w, draggedSizeRef: T } = ee(e, v, y, b), E = re(e, o), { resolveDropIndex: O, cachedItemsRef: k, cachedContainerRef: A } = E, j = l(null), N = l({
425
+ var L = (e, t, n, i, o, c) => {
426
+ 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({
516
427
  x: 0,
517
428
  y: 0
518
- }), P = l(null), F = l(null), I = l(!1), B = l(!1), V = l(null), H = l(null), U = l([]), W = r((t, r, i) => {
519
- let a = ie(t.target);
429
+ }), 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) => {
430
+ let a = re(t.target);
520
431
  if (!a) return;
521
432
  let { element: o, foundHandle: s } = a;
522
433
  if (!s && o.querySelector("[data-drag-handle]")) return;
523
434
  let c = o.dataset.id, l = +o.dataset.index, u = o.dataset.type;
524
- j.current = u ?? null, P.current = l, F.current = null, V.current = null, U.current = [], w.current = null, I.current = !1;
525
- let d = u === "row" ? e.bodyRef?.current?.scrollLeft ?? 0 : 0, p = o.getBoundingClientRect();
526
- T.current = {
527
- width: p.width,
528
- height: p.height
435
+ P.current = u ?? null, R.current = l, z.current = null, H.current = null, W.current = [], T.current = null, B.current = !1;
436
+ let d = u === "row" ? e.bodyRef?.current?.scrollLeft ?? 0 : 0, m = o.getBoundingClientRect();
437
+ E.current = {
438
+ width: m.width,
439
+ height: m.height
529
440
  };
530
441
  let h = {
531
- x: r - p.left - d,
532
- y: i - p.top
442
+ x: r - m.left - d,
443
+ y: i - m.top
533
444
  };
534
- N.current = h, m.current = {
445
+ L.current = h, p.current = {
535
446
  x: r,
536
447
  y: i
537
448
  };
538
449
  let g = {
539
- x: p.left + d,
540
- y: p.top
450
+ x: m.left + d,
451
+ y: m.top
541
452
  };
542
- k.current = u === "row" ? E.computeRowItems() : E.computeColumnItems();
453
+ M.current = u === "row" ? D.computeRowItems() : D.computeColumnItems();
543
454
  let v = e.bodyRef?.current;
544
- v && (A.current = v.getBoundingClientRect(), f(A.current)), _.buildMaps(u, v ?? null);
455
+ v && (N.current = v.getBoundingClientRect(), f(N.current)), _.buildMaps(u, v ?? null);
545
456
  let y = e.tableRef?.current;
546
457
  y && (y.style.touchAction = "none");
547
458
  let b = o.firstElementChild;
548
- b && (b.style.opacity = "0", b.style.pointerEvents = "none", b.style.zIndex = "2", b.style.cursor = "-webkit-grabbing"), H.current = b;
459
+ b && (b.style.opacity = "0", b.style.pointerEvents = "none", b.style.zIndex = "2", b.style.cursor = "-webkit-grabbing"), U.current = b;
549
460
  let x = e.cloneRef?.current;
550
461
  if (x) {
551
- if (x.innerHTML = "", x.style.transform = `translate(${g.x}px, ${g.y}px)`, B.current = (v?.querySelector("[data-type=\"row\"]"))?.style.position === "absolute", u === "row") {
462
+ if (x.innerHTML = "", x.style.transform = `translate(${g.x}px, ${g.y}px)`, V.current = (v?.querySelector("[data-type=\"row\"]"))?.style.position === "absolute", u === "row") {
552
463
  let e = o.firstElementChild?.firstElementChild;
553
464
  e && x.appendChild(e.cloneNode(!0));
554
465
  } else if (u === "column" && v) {
@@ -562,7 +473,7 @@ var B = (e, t, n, i, o, c) => {
562
473
  let r = document.createElement("div");
563
474
  r.className = "rbody", r.style.height = `${v.scrollHeight}px`, r.style.position = "relative", v.querySelectorAll("[data-type=\"row\"]").forEach((t) => {
564
475
  let n = t.cloneNode(!0);
565
- if (B.current) {
476
+ if (V.current) {
566
477
  let t = n.querySelector(".tr");
567
478
  if (t) {
568
479
  let n = t.querySelector(`[data-col-index="${e}"]`);
@@ -573,8 +484,8 @@ var B = (e, t, n, i, o, c) => {
573
484
  t.getAttribute("data-col-index") !== e && t.remove();
574
485
  });
575
486
  r.appendChild(n);
576
- }), 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) => {
577
- e.style.opacity = "0", U.current.push(e);
487
+ }), 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) => {
488
+ e.style.opacity = "0", W.current.push(e);
578
489
  });
579
490
  }
580
491
  }
@@ -582,8 +493,8 @@ var B = (e, t, n, i, o, c) => {
582
493
  type: "dragStart",
583
494
  value: {
584
495
  rect: {
585
- draggedItemHeight: p.height,
586
- draggedItemWidth: p.width
496
+ draggedItemHeight: m.height,
497
+ draggedItemWidth: m.width
587
498
  },
588
499
  dragged: {
589
500
  initial: h,
@@ -602,26 +513,26 @@ var B = (e, t, n, i, o, c) => {
602
513
  let S = v?.scrollLeft ?? 0, C = v?.scrollTop ?? 0;
603
514
  requestAnimationFrame(() => {
604
515
  let t = e.cloneRef?.current;
605
- t && (u === "row" ? t.scrollLeft = S : V.current && (V.current.scrollTop = C));
516
+ t && (u === "row" ? t.scrollLeft = S : H.current && (H.current.scrollTop = C));
606
517
  });
607
518
  }, [
608
519
  n,
609
520
  e,
610
- m,
521
+ p,
611
522
  f,
612
- E,
523
+ D,
613
524
  _,
614
- k,
615
- A,
616
- T,
617
- w
618
- ]), G = r((t, r, i, a, o) => {
525
+ M,
526
+ N,
527
+ E,
528
+ T
529
+ ]), K = r((t, r, i, a, o) => {
619
530
  let s = e.cloneRef?.current;
620
- s && (s.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) => {
531
+ s && (s.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) => {
621
532
  e.style.opacity = "";
622
- }), U.current = [];
533
+ }), W.current = [];
623
534
  let l = e.tableRef?.current;
624
- l && (l.style.touchAction = ""), p(() => {
535
+ l && (l.style.touchAction = ""), m(() => {
625
536
  c && t !== null && r !== null && (i === "row" || i === "column") && c({
626
537
  sourceIndex: t,
627
538
  targetIndex: r,
@@ -633,7 +544,7 @@ var B = (e, t, n, i, o, c) => {
633
544
  sourceIndex: t
634
545
  }
635
546
  });
636
- }), C();
547
+ }), w();
637
548
  let u = e.bodyRef?.current;
638
549
  u && (u.scrollTop = a, u.scrollLeft = o, requestAnimationFrame(() => {
639
550
  u.scrollTop = a, u.scrollLeft = o;
@@ -643,71 +554,71 @@ var B = (e, t, n, i, o, c) => {
643
554
  e.bodyRef,
644
555
  e.cloneRef,
645
556
  e.tableRef,
646
- C,
557
+ w,
647
558
  c
648
- ]), K = r(() => {
649
- if (I.current) return;
650
- I.current = !0, Y(), setTimeout(() => {
651
- X.current = !1;
559
+ ]), q = r(() => {
560
+ if (B.current) return;
561
+ B.current = !0, X(), setTimeout(() => {
562
+ Z.current = !1;
652
563
  }, 400);
653
- let t = F.current, n = P.current, r = j.current, i = e.bodyRef?.current, a = i?.scrollTop ?? 0, o = i?.scrollLeft ?? 0;
654
- k.current = null, A.current = null, d(), j.current = null, P.current = null, F.current = null;
564
+ let t = z.current, n = R.current, r = P.current, i = e.bodyRef?.current, a = i?.scrollTop ?? 0, o = i?.scrollLeft ?? 0;
565
+ M.current = null, N.current = null, d(), P.current = null, R.current = null, z.current = null;
655
566
  let s = e.cloneRef?.current, c = e.placeholderRef?.current;
656
567
  if (s && c && c.style.display !== "none") {
657
568
  let e = parseFloat(c.style.left) || 0, i = parseFloat(c.style.top) || 0;
658
- s.style.transition = `transform ${L}ms cubic-bezier(0.2, 0, 0, 1)`, s.style.transform = `translate(${e}px, ${i}px)`, setTimeout(() => G(n, t, r, a, o), L);
659
- } else G(n, t, r, a, o);
569
+ 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);
570
+ } else K(n, t, r, a, o);
660
571
  }, [
661
572
  d,
662
573
  e.bodyRef,
663
574
  e.placeholderRef,
664
575
  e.cloneRef,
665
- G
666
- ]), q = l(() => {}), { touchStart: J, cancelLongPress: Y, isTouchActiveRef: X } = M(e, W, K, (e, t) => q.current(e, t)), Z = r((e) => {
667
- e.button === 0 && e.target !== e.currentTarget && (X.current || ne(e.clientX, e.clientY, e.target) || W(e, e.clientX, e.clientY));
668
- }, [W, X]), Q = r((t, n) => {
669
- if (I.current) return;
670
- let r = N.current;
671
- m.current.x = t, m.current.y = n;
576
+ K
577
+ ]), J = l(() => {}), { touchStart: Y, cancelLongPress: X, isTouchActiveRef: Z } = O(e, G, q, (e, t) => J.current(e, t)), Q = r((e) => {
578
+ e.button === 0 && e.target !== e.currentTarget && (Z.current || ee(e.clientX, e.clientY, e.target) || G(e, e.clientX, e.clientY));
579
+ }, [G, Z]), $ = r((t, n) => {
580
+ if (B.current) return;
581
+ let r = L.current;
582
+ p.current.x = t, p.current.y = n;
672
583
  let a = e.bodyRef?.current;
673
584
  if (!a) return;
674
- let o = A.current;
675
- (!o || x.current) && (o = a.getBoundingClientRect(), A.current = o);
585
+ let o = N.current;
586
+ (!o || x.current) && (o = a.getBoundingClientRect(), N.current = o);
676
587
  let s = a.scrollLeft, c = a.scrollTop, l = e.cloneRef?.current;
677
- l && (l.style.transform = `translate(${t - r.x}px, ${n - r.y}px)`, j.current === "row" ? l.scrollLeft = s : V.current && (V.current.scrollTop = c));
678
- let f = j.current || i;
679
- if (B.current && _.checkStaleness(), x.current && (k.current = null, F.current = null, w.current = null, B.current ? f === "row" ? _.rebuildRowMap(a) : _.rebuildColumnMaps(a, e.headerRef?.current ?? null) : x.current = !1), f === "row") if (n < o.top + R) u(-z, a, "vertical"), x.current = !0;
680
- else if (n > o.bottom - R) u(z, a, "vertical"), x.current = !0;
588
+ 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));
589
+ let f = P.current || i;
590
+ 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;
591
+ else if (n > o.bottom - F) u(I, a, "vertical"), x.current = !0;
681
592
  else {
682
593
  let t = h.current;
683
594
  d(), t && requestAnimationFrame(() => {
684
595
  let t = e.bodyRef?.current;
685
596
  if (!t) return;
686
- B.current && _.rebuildRowMap(t), k.current = null;
597
+ V.current && _.rebuildRowMap(t), M.current = null;
687
598
  let n = t.getBoundingClientRect();
688
- A.current = n;
689
- let r = O(m.current.x, m.current.y, "row", n, t.scrollTop, N.current, T.current);
690
- F.current = r, w.current = null, S(P.current, r, "row");
599
+ N.current = n;
600
+ let r = k(p.current.x, p.current.y, "row", n, t.scrollTop, L.current, E.current);
601
+ z.current = r, T.current = null, S(R.current, r, "row");
691
602
  });
692
603
  }
693
- else if (t < o.left + R) u(-z, a, "horizontal"), x.current = !0;
694
- else if (t > o.right - R) u(z, a, "horizontal"), x.current = !0;
604
+ else if (t < o.left + F) u(-I, a, "horizontal"), x.current = !0;
605
+ else if (t > o.right - F) u(I, a, "horizontal"), x.current = !0;
695
606
  else {
696
607
  let t = g.current;
697
608
  d(), t && requestAnimationFrame(() => {
698
609
  let t = e.bodyRef?.current;
699
610
  if (!t) return;
700
- B.current && _.rebuildColumnMaps(t, e.headerRef?.current ?? null), k.current = null;
611
+ V.current && _.rebuildColumnMaps(t, e.headerRef?.current ?? null), M.current = null;
701
612
  let n = t.getBoundingClientRect();
702
- A.current = n;
703
- let r = O(m.current.x, m.current.y, "column", n, t.scrollTop, N.current, T.current);
704
- F.current = r, w.current = null, S(P.current, r, "column");
613
+ N.current = n;
614
+ let r = k(p.current.x, p.current.y, "column", n, t.scrollTop, L.current, E.current);
615
+ z.current = r, T.current = null, S(R.current, r, "column");
705
616
  });
706
617
  }
707
- let p = O(t, n, f, o, c, r, T.current);
708
- p !== F.current && (F.current = p, requestAnimationFrame(() => S(P.current, p, f)));
618
+ let m = k(t, n, f, o, c, r, E.current);
619
+ m !== z.current && (z.current = m, requestAnimationFrame(() => S(R.current, m, f)));
709
620
  }, [
710
- m,
621
+ p,
711
622
  e.bodyRef,
712
623
  e.cloneRef,
713
624
  e.headerRef,
@@ -717,17 +628,17 @@ var B = (e, t, n, i, o, c) => {
717
628
  h,
718
629
  g,
719
630
  _,
720
- O,
721
- S,
722
631
  k,
723
- A,
632
+ S,
633
+ M,
634
+ N,
724
635
  x,
725
- w,
726
- T
636
+ T,
637
+ E
727
638
  ]);
728
- q.current = Q;
729
- let $ = r(() => {
730
- Y(), k.current = null, A.current = null;
639
+ J.current = $;
640
+ let ie = r(() => {
641
+ X(), M.current = null, N.current = null;
731
642
  let t = e.cloneRef?.current;
732
643
  t && (t.style.visibility = "hidden");
733
644
  let r = e.tableRef?.current;
@@ -737,49 +648,49 @@ var B = (e, t, n, i, o, c) => {
737
648
  targetIndex: null,
738
649
  sourceIndex: null
739
650
  }
740
- }), d(), C(), j.current = null, P.current = null, F.current = null;
651
+ }), d(), w(), P.current = null, R.current = null, z.current = null;
741
652
  }, [
742
- Y,
743
- k,
744
- A,
653
+ X,
654
+ M,
655
+ N,
745
656
  e.cloneRef,
746
657
  e.tableRef,
747
658
  n,
748
659
  d,
749
- C
660
+ w
750
661
  ]);
751
662
  return s(() => {
752
663
  if (!t.isDragging) {
753
- C();
664
+ w();
754
665
  let t = e.cloneRef?.current;
755
666
  t && (t.style.transition = "", t.style.transform = "translate(0px, 0px)", t.style.visibility = "", t.scrollLeft = 0, t.innerHTML = "");
756
667
  }
757
668
  }, [
758
669
  t.isDragging,
759
- C,
670
+ w,
760
671
  e.cloneRef
761
672
  ]), a(() => {
762
673
  if (!t.isDragging) return;
763
674
  let e = 0, n = 0, r = !1, i = (t) => {
764
675
  e = t.clientX, n = t.clientY, r || (r = !0, requestAnimationFrame(() => {
765
- r = !1, Q(e, n);
676
+ r = !1, $(e, n);
766
677
  }));
767
- }, a = () => K(), o = (e) => {
768
- e.key === "Escape" && $();
678
+ }, a = () => q(), o = (e) => {
679
+ e.key === "Escape" && ie();
769
680
  };
770
681
  return window.addEventListener("pointermove", i), window.addEventListener("pointerup", a), window.addEventListener("pointercancel", a), window.addEventListener("keydown", o), () => {
771
682
  window.removeEventListener("pointermove", i), window.removeEventListener("pointerup", a), window.removeEventListener("pointercancel", a), window.removeEventListener("keydown", o);
772
683
  };
773
684
  }, [
774
685
  t.isDragging,
775
- Q,
776
- K,
777
- $
686
+ $,
687
+ q,
688
+ ie
778
689
  ]), {
779
- dragStart: Z,
780
- touchStart: J
690
+ dragStart: Q,
691
+ touchStart: Y
781
692
  };
782
- }, V = {
693
+ }, R = {
783
694
  columnDragRange: {
784
695
  start: void 0,
785
696
  end: void 0
@@ -790,7 +701,7 @@ var B = (e, t, n, i, o, c) => {
790
701
  },
791
702
  defaultSizing: 50
792
703
  };
793
- function H(e, t) {
704
+ function z(e, t) {
794
705
  switch (t.type) {
795
706
  case "setDragged": return {
796
707
  ...e,
@@ -868,7 +779,7 @@ function H(e, t) {
868
779
  default: throw Error("Unhandled action");
869
780
  }
870
781
  }
871
- var U = {
782
+ var B = {
872
783
  dragged: {
873
784
  initial: {
874
785
  x: 0,
@@ -900,58 +811,58 @@ var U = {
900
811
  placeholderRef: { current: null }
901
812
  },
902
813
  bodyScrollBarWidth: 0,
903
- options: V,
814
+ options: R,
904
815
  widths: [],
905
816
  columnIds: []
906
- }, W = {
817
+ }, V = {
907
818
  position: "relative",
908
819
  display: "flex",
909
820
  flexFlow: "column"
910
- }, G = {
821
+ }, H = {
911
822
  position: "fixed",
912
823
  pointerEvents: "none",
913
824
  zIndex: 3,
914
825
  top: 0,
915
826
  left: 0,
916
827
  display: "none"
917
- }, K = t(({ children: e, className: t, style: n, options: r, onDragEnd: i, renderPlaceholder: s }, p) => {
918
- let m = l(null), h = l(null), g = l(null);
919
- o(p, () => m.current, []);
920
- let [v] = u(() => T(H, U)), y = (0, b.useSyncExternalStore)(v.subscribe, v.getState), S = v.dispatch;
828
+ }, U = t(({ children: e, className: t, style: n, options: r, onDragEnd: i, renderPlaceholder: s }, m) => {
829
+ let h = l(null), v = l(null), y = l(null);
830
+ o(m, () => h.current, []);
831
+ let [b] = u(() => x(z, B)), S = d(b.subscribe, b.getState), C = b.dispatch;
921
832
  a(() => {
922
- S({
833
+ C({
923
834
  type: "setRef",
924
835
  refName: "tableRef",
925
- value: m
926
- }), S({
836
+ value: h
837
+ }), C({
927
838
  type: "setRef",
928
839
  refName: "cloneRef",
929
- value: h
930
- }), S({
840
+ value: v
841
+ }), C({
931
842
  type: "setRef",
932
843
  refName: "placeholderRef",
933
- value: g
844
+ value: y
934
845
  });
935
- }, [m, S]), a(() => {
846
+ }, [h, C]), a(() => {
936
847
  let e = () => {
937
- m.current && S({
848
+ h.current && C({
938
849
  type: "setTableDimensions",
939
850
  value: {
940
- height: m.current.offsetHeight,
941
- width: m.current.offsetWidth
851
+ height: h.current.offsetHeight,
852
+ width: h.current.offsetWidth
942
853
  }
943
854
  });
944
855
  };
945
856
  return e(), window.addEventListener("resize", e), () => {
946
857
  window.removeEventListener("resize", e);
947
858
  };
948
- }, [m, S]), a(() => {
949
- r && S({
859
+ }, [h, C]), a(() => {
860
+ r && C({
950
861
  type: "setOptions",
951
862
  value: r
952
863
  });
953
- }, [r, S]);
954
- let { dragStart: C, touchStart: w } = B(y.refs, y.dragged, S, y.dragType, y.options, i), E = c(() => ({
864
+ }, [r, C]);
865
+ let { dragStart: w, touchStart: T } = L(S.refs, S.dragged, C, S.dragType, S.options, i), E = c(() => ({
955
866
  position: "fixed",
956
867
  zIndex: "5",
957
868
  pointerEvents: "none",
@@ -959,47 +870,47 @@ var U = {
959
870
  left: 0,
960
871
  display: "flex",
961
872
  flexDirection: "column",
962
- height: y.dragType === "row" ? y.rect.draggedItemHeight : `${y.tableDimensions.height}px`,
963
- width: y.dragType === "column" ? `${y.rect.draggedItemWidth}px` : `${y.tableDimensions.width}px`,
873
+ height: S.dragType === "row" ? S.rect.draggedItemHeight : `${S.tableDimensions.height}px`,
874
+ width: S.dragType === "column" ? `${S.rect.draggedItemWidth}px` : `${S.tableDimensions.width}px`,
964
875
  overflow: "scroll",
965
876
  scrollbarWidth: "none",
966
- boxShadow: y.dragged.isDragging ? "0 0 10px 0 rgba(0, 0, 0, 0.1)" : "none"
877
+ boxShadow: S.dragged.isDragging ? "0 0 10px 0 rgba(0, 0, 0, 0.1)" : "none"
967
878
  }), [
968
- y.dragType,
969
- y.dragged.isDragging,
970
- y.rect.draggedItemHeight,
971
- y.rect.draggedItemWidth,
972
- y.tableDimensions.height,
973
- y.tableDimensions.width
879
+ S.dragType,
880
+ S.dragged.isDragging,
881
+ S.rect.draggedItemHeight,
882
+ S.rect.draggedItemWidth,
883
+ S.tableDimensions.height,
884
+ S.tableDimensions.width
974
885
  ]);
975
- return /* @__PURE__ */ d(x.Provider, {
976
- value: v,
977
- children: /* @__PURE__ */ f(_, {
978
- className: y.dragged.isDragging ? "is-dragging" : "",
886
+ return /* @__PURE__ */ f(_.Provider, {
887
+ value: b,
888
+ children: /* @__PURE__ */ p(g, {
889
+ className: S.dragged.isDragging ? "is-dragging" : "",
979
890
  children: [
980
- /* @__PURE__ */ d("div", {
891
+ /* @__PURE__ */ f("div", {
981
892
  id: "portalroot",
982
893
  style: {
983
894
  ...E,
984
- visibility: y.dragged.isDragging ? "visible" : "hidden"
895
+ visibility: S.dragged.isDragging ? "visible" : "hidden"
985
896
  },
986
- ref: h
897
+ ref: v
987
898
  }),
988
- /* @__PURE__ */ d("div", {
989
- ref: g,
990
- style: G,
991
- children: s ? s() : /* @__PURE__ */ d("div", { style: {
899
+ /* @__PURE__ */ f("div", {
900
+ ref: y,
901
+ style: H,
902
+ children: s ? s() : /* @__PURE__ */ f("div", { style: {
992
903
  width: "100%",
993
904
  height: "100%"
994
905
  } })
995
906
  }),
996
- /* @__PURE__ */ d("div", {
907
+ /* @__PURE__ */ f("div", {
997
908
  "data-contextid": "context",
998
- ref: m,
999
- onMouseDown: C,
1000
- onTouchStart: w,
909
+ ref: h,
910
+ onMouseDown: w,
911
+ onTouchStart: T,
1001
912
  style: {
1002
- ...W,
913
+ ...V,
1003
914
  ...n
1004
915
  },
1005
916
  className: `table ${t ?? ""}`,
@@ -1009,11 +920,11 @@ var U = {
1009
920
  })
1010
921
  });
1011
922
  });
1012
- K.displayName = "TableProvider";
923
+ U.displayName = "TableProvider";
1013
924
  //#endregion
1014
925
  //#region src/Components/TableHeader.tsx
1015
- var q = t(({ children: e, style: t, className: n }, i) => {
1016
- let o = l(null), u = i || o, f = S((e) => e.bodyScrollBarWidth), p = S((e) => e.dragged.isDragging), m = S((e) => e.refs), h = C(), g = r((e) => "current" in e ? e.current : null, []);
926
+ var W = t(({ children: e, style: t, className: n }, i) => {
927
+ 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, []);
1017
928
  a(() => {
1018
929
  o.current && h({
1019
930
  type: "setRef",
@@ -1021,19 +932,19 @@ var q = t(({ children: e, style: t, className: n }, i) => {
1021
932
  value: o
1022
933
  });
1023
934
  }, [h]);
1024
- let { HeaderScrollHandle: _ } = D(m), v = {
935
+ let { HeaderScrollHandle: _ } = C(m), b = {
1025
936
  display: "flex",
1026
937
  flex: "1 0 auto"
1027
- }, y = c(() => ({
938
+ }, x = c(() => ({
1028
939
  overflowX: "scroll",
1029
940
  overflowY: "clip",
1030
941
  scrollbarWidth: "none",
1031
942
  display: "flex",
1032
- paddingRight: `${f}px`,
943
+ paddingRight: `${d}px`,
1033
944
  userSelect: p ? "none" : "auto",
1034
945
  ...t
1035
946
  }), [
1036
- f,
947
+ d,
1037
948
  p,
1038
949
  t
1039
950
  ]);
@@ -1062,66 +973,66 @@ var q = t(({ children: e, style: t, className: n }, i) => {
1062
973
  h,
1063
974
  g,
1064
975
  u
1065
- ]), /* @__PURE__ */ d("div", {
976
+ ]), /* @__PURE__ */ f("div", {
1066
977
  className: `header ${n ?? ""}`,
1067
- children: /* @__PURE__ */ d("div", {
978
+ children: /* @__PURE__ */ f("div", {
1068
979
  className: "thead",
1069
- style: y,
980
+ style: x,
1070
981
  "data-droppableid": "header",
1071
982
  onScroll: _,
1072
983
  ref: u,
1073
- children: /* @__PURE__ */ d("div", {
1074
- style: v,
984
+ children: /* @__PURE__ */ f("div", {
985
+ style: b,
1075
986
  className: "tr",
1076
987
  children: e
1077
988
  })
1078
989
  })
1079
990
  });
1080
991
  });
1081
- q.displayName = "TableHeader";
992
+ W.displayName = "TableHeader";
1082
993
  //#endregion
1083
994
  //#region src/Components/Draggable.tsx
1084
- var J = n(({ children: e, id: t, index: n, type: r, styles: i = {} }) => {
1085
- let o = S((e) => e.options.rowDragRange), s = S((e) => e.options.columnDragRange), u = c(() => r === "row" ? I(n, o.start, o.end) : I(n, s.start, s.end), [
995
+ var G = n(({ children: e, id: t, index: n, type: r, styles: i = {} }) => {
996
+ 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), [
1086
997
  n,
1087
998
  s.end,
1088
999
  s.start,
1089
1000
  o.end,
1090
1001
  o.start,
1091
1002
  r
1092
- ]), f = l(null), p = c(() => ({
1003
+ ]), d = l(null), p = c(() => ({
1093
1004
  cursor: u ? "auto" : "-webkit-grab",
1094
1005
  display: "flex"
1095
1006
  }), [u]);
1096
1007
  return a(() => {
1097
- f.current && f.current.querySelector("[data-drag-handle]") && (f.current.style.cursor = "auto");
1098
- }, [e, u]), /* @__PURE__ */ d("div", {
1008
+ d.current && d.current.querySelector("[data-drag-handle]") && (d.current.style.cursor = "auto");
1009
+ }, [e, u]), /* @__PURE__ */ f("div", {
1099
1010
  className: "draggable",
1100
1011
  "data-id": t,
1101
1012
  "data-index": n,
1102
1013
  "data-type": r,
1103
1014
  "data-disabled": u ? "true" : "false",
1104
1015
  style: i,
1105
- children: /* @__PURE__ */ d("div", {
1106
- ref: f,
1016
+ children: /* @__PURE__ */ f("div", {
1017
+ ref: d,
1107
1018
  style: p,
1108
1019
  children: e
1109
1020
  })
1110
1021
  });
1111
1022
  });
1112
- J.displayName = "Draggable";
1023
+ G.displayName = "Draggable";
1113
1024
  //#endregion
1114
1025
  //#region src/Components/ColumnCell.tsx
1115
- var Y = n(({ children: e, style: t, className: n, ...r }) => {
1116
- let i = S((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(() => ({
1026
+ var K = n(({ children: e, style: t, className: n, ...r }) => {
1027
+ 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(() => ({
1117
1028
  width: `${l}px`,
1118
1029
  flex: o === void 0 ? `${l} 0 auto` : o
1119
1030
  }), [l, o]);
1120
- return /* @__PURE__ */ d(J, {
1031
+ return /* @__PURE__ */ f(G, {
1121
1032
  ...r,
1122
1033
  styles: u,
1123
1034
  type: "column",
1124
- children: /* @__PURE__ */ d("div", {
1035
+ children: /* @__PURE__ */ f("div", {
1125
1036
  className: `th ${n ?? ""}`,
1126
1037
  "data-width": l,
1127
1038
  style: {
@@ -1132,25 +1043,25 @@ var Y = n(({ children: e, style: t, className: n, ...r }) => {
1132
1043
  })
1133
1044
  });
1134
1045
  });
1135
- Y.displayName = "ColumnCell";
1046
+ K.displayName = "ColumnCell";
1136
1047
  //#endregion
1137
1048
  //#region src/Components/TableBody.tsx
1138
- var X = {
1049
+ var q = {
1139
1050
  display: "flex",
1140
1051
  overflow: "hidden",
1141
1052
  flex: 1
1142
- }, Z = t(({ children: e, style: t, className: n }, r) => {
1053
+ }, J = t(({ children: e, style: t, className: n }, r) => {
1143
1054
  let i = l(null);
1144
1055
  o(r, () => i.current, []);
1145
- let s = S((e) => e.dragged.isDragging), u = S((e) => e.refs), f = C();
1056
+ let s = v((e) => e.dragged.isDragging), u = v((e) => e.refs), d = y();
1146
1057
  a(() => {
1147
- f({
1058
+ d({
1148
1059
  type: "setRef",
1149
1060
  refName: "bodyRef",
1150
1061
  value: i
1151
1062
  });
1152
- }, [f, i]);
1153
- let { BodyScrollHandle: p } = D(u), m = c(() => ({
1063
+ }, [d, i]);
1064
+ let { BodyScrollHandle: p } = C(u), m = c(() => ({
1154
1065
  overflowX: "auto",
1155
1066
  overflowY: "auto",
1156
1067
  flex: 1,
@@ -1160,15 +1071,15 @@ var X = {
1160
1071
  return a(() => {
1161
1072
  if (i.current) {
1162
1073
  let e = i.current.clientWidth;
1163
- f({
1074
+ d({
1164
1075
  type: "setBodyScrollBarWidth",
1165
1076
  value: i.current.offsetWidth - e
1166
1077
  });
1167
1078
  }
1168
- }, [f, i]), /* @__PURE__ */ d("div", {
1079
+ }, [d, i]), /* @__PURE__ */ f("div", {
1169
1080
  className: `body ${n ?? ""}`,
1170
- style: X,
1171
- children: /* @__PURE__ */ d("div", {
1081
+ style: q,
1082
+ children: /* @__PURE__ */ f("div", {
1172
1083
  className: "ibody",
1173
1084
  style: m,
1174
1085
  "data-droppableid": "body",
@@ -1177,30 +1088,30 @@ var X = {
1177
1088
  children: e
1178
1089
  })
1179
1090
  });
1180
- }), Q = {
1091
+ }), Y = {
1181
1092
  display: "flex",
1182
1093
  flex: "1 0 auto",
1183
1094
  minHeight: "24px"
1184
- }, $ = n(({ children: e, style: t, className: n, ...r }) => {
1095
+ }, X = n(({ children: e, style: t, className: n, ...r }) => {
1185
1096
  let i = c(() => t ? {
1186
- ...Q,
1097
+ ...Y,
1187
1098
  ...t
1188
- } : Q, [t]), a = m("tr", n);
1189
- return /* @__PURE__ */ d(J, {
1099
+ } : Y, [t]), a = h("tr", n);
1100
+ return /* @__PURE__ */ f(G, {
1190
1101
  ...r,
1191
1102
  type: "row",
1192
- children: /* @__PURE__ */ d("div", {
1103
+ children: /* @__PURE__ */ f("div", {
1193
1104
  className: a,
1194
1105
  style: i,
1195
1106
  children: e
1196
1107
  })
1197
1108
  });
1198
1109
  });
1199
- $.displayName = "BodyRow";
1110
+ X.displayName = "BodyRow";
1200
1111
  //#endregion
1201
1112
  //#region src/Components/RowCell.tsx
1202
- var ae = n(({ children: e, style: t, className: n, ...r }) => {
1203
- let { index: i } = r, a = S((e) => e.widths), o = S((e) => e.options.defaultSizing), s = c(() => a[i] ?? o, [
1113
+ var Z = n(({ children: e, style: t, className: n, ...r }) => {
1114
+ let { index: i } = r, a = v((e) => e.widths), o = v((e) => e.options.defaultSizing), s = c(() => a[i] ?? o, [
1204
1115
  a,
1205
1116
  i,
1206
1117
  o
@@ -1210,17 +1121,17 @@ var ae = n(({ children: e, style: t, className: n, ...r }) => {
1210
1121
  flex: `${s} 0 auto`,
1211
1122
  ...t
1212
1123
  }), [s, t]);
1213
- return /* @__PURE__ */ d("div", {
1124
+ return /* @__PURE__ */ f("div", {
1214
1125
  className: `td ${n ?? ""}`,
1215
1126
  style: l,
1216
1127
  "data-col-index": i,
1217
1128
  children: e
1218
1129
  });
1219
1130
  });
1220
- ae.displayName = "RowCell";
1131
+ Z.displayName = "RowCell";
1221
1132
  //#endregion
1222
1133
  //#region src/Components/DragHandle.tsx
1223
- var oe = n(({ children: e, className: t, style: n }) => /* @__PURE__ */ d("div", {
1134
+ var Q = n(({ children: e, className: t, style: n }) => /* @__PURE__ */ f("div", {
1224
1135
  "data-drag-handle": "true",
1225
1136
  className: t,
1226
1137
  style: {
@@ -1231,6 +1142,6 @@ var oe = n(({ children: e, className: t, style: n }) => /* @__PURE__ */ d("div",
1231
1142
  },
1232
1143
  children: e
1233
1144
  }));
1234
- oe.displayName = "DragHandle";
1145
+ Q.displayName = "DragHandle";
1235
1146
  //#endregion
1236
- export { $ as BodyRow, Y as ColumnCell, oe as DragHandle, ae as RowCell, Z as TableBody, K as TableContainer, q as TableHeader, w as useTable, C as useTableDispatch, S as useTableStore };
1147
+ 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 };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-table-dnd",
3
- "version": "2.0.0",
3
+ "version": "2.0.2",
4
4
  "type": "module",
5
5
  "description": "Sortable table with draggable rows and columns",
6
6
  "main": "dist/index.cjs.js",
@@ -49,12 +49,11 @@
49
49
  },
50
50
  "homepage": "https://samiodeh1337.github.io/react-table-dnd/",
51
51
  "peerDependencies": {
52
- "react": ">=17.0.0",
53
- "react-dom": ">=17.0.0"
52
+ "react": ">=18.0.0",
53
+ "react-dom": ">=18.0.0"
54
54
  },
55
55
  "dependencies": {
56
- "classnames": "^2.5.1",
57
- "use-sync-external-store": "^1.6.0"
56
+ "classnames": "^2.5.1"
58
57
  },
59
58
  "devDependencies": {
60
59
  "styled-components": "^6.3.11",
@@ -63,7 +62,6 @@
63
62
  "@types/node": "^24.12.0",
64
63
  "@types/react": "^19.2.14",
65
64
  "@types/react-dom": "^19.2.3",
66
- "@types/use-sync-external-store": "^1.5.0",
67
65
  "@vitejs/plugin-react": "^6.0.0",
68
66
  "eslint": "^9.39.4",
69
67
  "eslint-config-prettier": "^10.1.8",