@oliasoft-open-source/react-ui-library 4.0.2 → 4.1.1
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/dist/global.css +42 -42
- package/dist/index.js +19 -17
- package/dist/index.js.map +1 -1
- package/dist/storybook/assets/{Color-6VNJS4EI-cc076a6a.js → Color-6VNJS4EI-c3a2d76e.js} +1 -1
- package/dist/storybook/assets/{DocsRenderer-NNNQARDV-b8f76c20.js → DocsRenderer-NNNQARDV-31e744fe.js} +1 -1
- package/dist/storybook/assets/{WithTooltip-4HIR6TLV-aefe5c63.js → WithTooltip-4HIR6TLV-38f9c111.js} +1 -1
- package/dist/storybook/assets/{afe.stories-eaf9f11f.js → afe.stories-89061486.js} +1 -1
- package/dist/storybook/assets/{blowout.stories-63cf2545.js → blowout.stories-2af165bb.js} +1 -1
- package/dist/storybook/assets/{button.stories-c908b4ea.js → button.stories-531033a8.js} +1 -1
- package/dist/storybook/assets/{buttons-and-links-a41d0e6b.js → buttons-and-links-7523bf96.js} +1 -1
- package/dist/storybook/assets/{casing-loads.stories-c16da9e1.js → casing-loads.stories-384d70b8.js} +1 -1
- package/dist/storybook/assets/{cell.stories-81179245.js → cell.stories-afcab7a9.js} +1 -1
- package/dist/storybook/assets/{chunk-HLWAVYOI-09dac8f9.js → chunk-HLWAVYOI-5d05e9c3.js} +1 -1
- package/dist/storybook/assets/{color-514a4e1c.js → color-97d59863.js} +1 -1
- package/dist/storybook/assets/column.stories-ae7588c5.js +88 -0
- package/dist/storybook/assets/{drawer.stories-5d8ccdcf.js → drawer.stories-89a4e1bb.js} +1 -1
- package/dist/storybook/assets/{file-input.stories-2a24f6df.js → file-input.stories-0e546123.js} +1 -1
- package/dist/storybook/assets/{flex-89b67483.js → flex-47732c42.js} +1 -1
- package/dist/storybook/assets/{flex.stories-47905073.js → flex.stories-9d4c08a1.js} +1 -1
- package/dist/storybook/assets/{footer.stories-96796f2a.js → footer.stories-c7a547fd.js} +1 -1
- package/dist/storybook/assets/{form.stories-7c50280c.js → form.stories-ac7f7763.js} +1 -1
- package/dist/storybook/assets/{formation.stories-882c55ee.js → formation.stories-645bdebe.js} +1 -1
- package/dist/storybook/assets/{formatter-SWP5E3XI-01a177c2.js → formatter-SWP5E3XI-abd3b9cc.js} +1 -1
- package/dist/storybook/assets/{heading.stories-d9839a93.js → heading.stories-869d41ea.js} +1 -1
- package/dist/storybook/assets/{icon.stories-57557baa.js → icon.stories-fca93dba.js} +1 -1
- package/dist/storybook/assets/{iframe-b3e4c19a.js → iframe-32ec4dc2.js} +1 -1
- package/dist/storybook/assets/{index-b0ab8379.js → index-3765b62e.js} +4 -4
- package/dist/storybook/assets/{input-validation-b453c1a5.js → input-validation-1d8f5289.js} +1 -1
- package/dist/storybook/assets/{inputs-eb14ae12.js → inputs-f9ffdce9.js} +1 -1
- package/dist/storybook/assets/{layout-forms-bc07a75c.js → layout-forms-acacc694.js} +1 -1
- package/dist/storybook/assets/{layout-general-f721d56b.js → layout-general-1fa5a92e.js} +1 -1
- package/dist/storybook/assets/{list.stories-cf0fc376.js → list.stories-0f30d0b5.js} +1 -1
- package/dist/storybook/assets/{list.stories-data-6032afdc.js → list.stories-data-390b28e1.js} +1 -1
- package/dist/storybook/assets/{menu.stories-6fb9a962.js → menu.stories-7a422ddf.js} +1 -1
- package/dist/storybook/assets/{menu.stories-data-008d45f0.js → menu.stories-data-38257c11.js} +1 -1
- package/dist/storybook/assets/{padding-and-spacing-39dcf112.js → padding-and-spacing-149fe3e1.js} +1 -1
- package/dist/storybook/assets/{popover.stories-39e3ddc9.js → popover.stories-f6387397.js} +1 -1
- package/dist/storybook/assets/{preview-7d179775.js → preview-8a24eadd.js} +1 -1
- package/dist/storybook/assets/preview-f9940f47.js +1 -0
- package/dist/storybook/assets/{projects.stories-288f11da.js → projects.stories-9d6e0a4c.js} +1 -1
- package/dist/storybook/assets/{reservoirs.stories-673e9f2d.js → reservoirs.stories-35779380.js} +1 -1
- package/dist/storybook/assets/{row-2397cf9f.js → row-2299f0e7.js} +2 -2
- package/dist/storybook/assets/{row.stories-97e19848.js → row.stories-c8bc5a6e.js} +1 -1
- package/dist/storybook/assets/{side-bar.stories-196426b4.js → side-bar.stories-e9280e56.js} +1 -1
- package/dist/storybook/assets/{site.stories-4f075003.js → site.stories-e9c1c143.js} +1 -1
- package/dist/storybook/assets/{spacer.stories-3b68701f.js → spacer.stories-97086558.js} +1 -1
- package/dist/storybook/assets/{syntaxhighlighter-NMPM6SWI-53ee3739.js → syntaxhighlighter-NMPM6SWI-2e122bf9.js} +1 -1
- package/dist/storybook/assets/{table.stories-09d9aea9.js → table.stories-3eaf0522.js} +1 -1
- package/dist/storybook/assets/{table.stories-data-5ad14f16.js → table.stories-data-aefdf55f.js} +1 -1
- package/dist/storybook/assets/{textarea-51869bed.js → textarea-54dd1c9a.js} +1 -1
- package/dist/storybook/assets/{textarea.stories-08906cd1.js → textarea.stories-4b85aa60.js} +1 -1
- package/dist/storybook/assets/{title.stories-8be95533.js → title.stories-16838f04.js} +1 -1
- package/dist/storybook/assets/{tooltip.test-case.stories-67a4d3dc.js → tooltip.test-case.stories-ef78bd26.js} +1 -1
- package/dist/storybook/assets/{tree.stories-b5e23d09.js → tree.stories-590bdd69.js} +1 -1
- package/dist/storybook/iframe.html +1 -1
- package/dist/storybook/index.json +1 -1
- package/dist/storybook/project.json +1 -1
- package/dist/storybook/stories.json +1 -1
- package/package.json +1 -1
- package/dist/storybook/assets/column.stories-720f6311.js +0 -79
- package/dist/storybook/assets/preview-2c802f9f.js +0 -1
|
@@ -3,7 +3,7 @@ import{j as _}from"./jsx-runtime-f961835c.js";import{r as m,R as N,g as Pu}from"
|
|
|
3
3
|
This might be unsupported in the future, please specify 'id' explicitely for every backend.`);else throw new Error("You must specify an 'id' property in your Backend entry: ".concat(JSON.stringify(a),`
|
|
4
4
|
see this guide: https://github.com/louisbrunner/dnd-multi-backend/tree/master/packages/react-dnd-multi-backend#migrating-from-5xx`));if(R(this,Z)[c])throw new Error(`You must specify a unique 'id' property in your Backend entry:
|
|
5
5
|
`.concat(JSON.stringify(a)," (conflicts with: ").concat(JSON.stringify(R(this,Z)[c]),")"));return{id:c,instance:l,preview:(s=a.preview)!==null&&s!==void 0?s:!1,transition:a.transition,skipDispatchOnTransition:(u=a.skipDispatchOnTransition)!==null&&u!==void 0?u:!1}}}),ae(this,"setup",()=>{if(!(typeof window>"u")){if(Xe.isSetUp)throw new Error("Cannot have two MultiBackends at the same time.");Xe.isSetUp=!0,R(this,Vo).call(this,window),R(this,Z)[R(this,K)].instance.setup()}}),ae(this,"teardown",()=>{typeof window>"u"||(Xe.isSetUp=!1,R(this,No).call(this,window),R(this,Z)[R(this,K)].instance.teardown())}),ae(this,"connectDragSource",(i,o,a)=>R(this,Xt).call(this,"connectDragSource",i,o,a)),ae(this,"connectDragPreview",(i,o,a)=>R(this,Xt).call(this,"connectDragPreview",i,o,a)),ae(this,"connectDropTarget",(i,o,a)=>R(this,Xt).call(this,"connectDropTarget",i,o,a)),ae(this,"profile",()=>R(this,Z)[R(this,K)].instance.profile()),ae(this,"previewEnabled",()=>R(this,Z)[R(this,K)].preview),ae(this,"previewsList",()=>R(this,Yt)),ae(this,"backendsList",()=>R(this,ye)),ne(this,Vo,{writable:!0,value:i=>{R(this,ye).forEach(o=>{o.transition&&i.addEventListener(o.transition.event,R(this,Jr))})}}),ne(this,No,{writable:!0,value:i=>{R(this,ye).forEach(o=>{o.transition&&i.removeEventListener(o.transition.event,R(this,Jr))})}}),ne(this,Jr,{writable:!0,value:i=>{const o=R(this,K);if(R(this,ye).some(s=>s.id!==R(this,K)&&s.transition&&s.transition.check(i)?(He(this,K,s.id),!0):!1),R(this,K)!==o){var a;R(this,Z)[o].instance.teardown(),Object.keys(R(this,Re)).forEach(c=>{const d=R(this,Re)[c];d.unsubscribe(),d.unsubscribe=R(this,Qr).call(this,d.func,...d.args)}),R(this,Yt).backendChanged(this);const s=R(this,Z)[R(this,K)];if(s.instance.setup(),s.skipDispatchOnTransition)return;const u=i.constructor,l=new u(i.type,i);(a=i.target)===null||a===void 0||a.dispatchEvent(l)}}}),ne(this,Qr,{writable:!0,value:(i,o,a,s)=>R(this,Z)[R(this,K)].instance[i](o,a,s)}),ne(this,Xt,{writable:!0,value:(i,o,a,s)=>{const u="".concat(i,"_").concat(o),l=R(this,Qr).call(this,i,o,a,s);return R(this,Re)[u]={func:i,args:[o,a,s],unsubscribe:l},()=>{R(this,Re)[u].unsubscribe(),delete R(this,Re)[u]}}}),!n||!n.backends||n.backends.length<1)throw new Error(`You must specify at least one Backend, if you are coming from 2.x.x (or don't understand this error)
|
|
6
|
-
see this guide: https://github.com/louisbrunner/dnd-multi-backend/tree/master/packages/react-dnd-multi-backend#migrating-from-2xx`);He(this,Yt,new ig),He(this,Z,{}),He(this,ye,[]),n.backends.forEach(i=>{const o=R(this,Lo).call(this,t,r,i);R(this,Z)[o.id]=o,R(this,ye).push(o)}),He(this,K,R(this,ye)[0].id),He(this,Re,{})}}ae(Xe,"isSetUp",!1);const ug=(e,t,r)=>new Xe(e,t,r),Tu=(e,t)=>({event:e,check:t}),lg=Tu("touchstart",e=>{const t=e;return t.touches!==null&&t.touches!==void 0}),cg=Tu("pointerdown",e=>e.pointerType=="mouse");var Ee;(function(e){e.mouse="mouse",e.touch="touch",e.keyboard="keyboard"})(Ee||(Ee={}));class dg{get delay(){var t;return(t=this.args.delay)!==null&&t!==void 0?t:0}get scrollAngleRanges(){return this.args.scrollAngleRanges}get getDropTargetElementsAtPoint(){return this.args.getDropTargetElementsAtPoint}get ignoreContextMenu(){var t;return(t=this.args.ignoreContextMenu)!==null&&t!==void 0?t:!1}get enableHoverOutsideTarget(){var t;return(t=this.args.enableHoverOutsideTarget)!==null&&t!==void 0?t:!1}get enableKeyboardEvents(){var t;return(t=this.args.enableKeyboardEvents)!==null&&t!==void 0?t:!1}get enableMouseEvents(){var t;return(t=this.args.enableMouseEvents)!==null&&t!==void 0?t:!1}get enableTouchEvents(){var t;return(t=this.args.enableTouchEvents)!==null&&t!==void 0?t:!0}get touchSlop(){return this.args.touchSlop||0}get delayTouchStart(){var t,r,n,i;return(i=(n=(t=this.args)===null||t===void 0?void 0:t.delayTouchStart)!==null&&n!==void 0?n:(r=this.args)===null||r===void 0?void 0:r.delay)!==null&&i!==void 0?i:0}get delayMouseStart(){var t,r,n,i;return(i=(n=(t=this.args)===null||t===void 0?void 0:t.delayMouseStart)!==null&&n!==void 0?n:(r=this.args)===null||r===void 0?void 0:r.delay)!==null&&i!==void 0?i:0}get window(){if(this.context&&this.context.window)return this.context.window;if(typeof window<"u")return window}get document(){var t;if(!((t=this.context)===null||t===void 0)&&t.document)return this.context.document;if(this.window)return this.window.document}get rootElement(){var t;return((t=this.args)===null||t===void 0?void 0:t.rootElement)||this.document}constructor(t,r){this.args=t,this.context=r}}function fg(e,t,r,n){return Math.sqrt(Math.pow(Math.abs(r-e),2)+Math.pow(Math.abs(n-t),2))}function hg(e,t,r,n,i){if(!i)return!1;const o=Math.atan2(n-t,r-e)*180/Math.PI+180;for(let a=0;a<i.length;++a){const s=i[a];if(s&&(s.start==null||o>=s.start)&&(s.end==null||o<=s.end))return!0}return!1}const vg={Left:1,Right:2,Center:4},pg={Left:0,Center:1,Right:2};function en(e){return e.button===void 0||e.button===pg.Left}function gg(e){return e.buttons===void 0||(e.buttons&vg.Left)===0}function Su(e){return!!e.targetTouches}const mg=1;function yg(e){const t=e.nodeType===mg?e:e.parentElement;if(!t)return;const{top:r,left:n}=t.getBoundingClientRect();return{x:n,y:r}}function bg(e,t){if(e.targetTouches.length===1)return gr(e.targetTouches[0]);if(t&&e.touches.length===1&&e.touches[0].target===t.target)return gr(e.touches[0])}function gr(e,t){return Su(e)?bg(e,t):{x:e.clientX,y:e.clientY}}const _o=(()=>{let e=!1;try{addEventListener("test",()=>{},Object.defineProperty({},"passive",{get(){return e=!0,!0}}))}catch{}return e})(),it={[Ee.mouse]:{start:"mousedown",move:"mousemove",end:"mouseup",contextmenu:"contextmenu"},[Ee.touch]:{start:"touchstart",move:"touchmove",end:"touchend"},[Ee.keyboard]:{keydown:"keydown"}};class St{profile(){var t;return{sourceNodes:this.sourceNodes.size,sourcePreviewNodes:this.sourcePreviewNodes.size,sourcePreviewNodeOptions:this.sourcePreviewNodeOptions.size,targetNodes:this.targetNodes.size,dragOverTargetIds:((t=this.dragOverTargetIds)===null||t===void 0?void 0:t.length)||0}}get document(){return this.options.document}setup(){const t=this.options.rootElement;t&&(P(!St.isSetUp,"Cannot have two Touch backends at the same time."),St.isSetUp=!0,this.addEventListener(t,"start",this.getTopMoveStartHandler()),this.addEventListener(t,"start",this.handleTopMoveStartCapture,!0),this.addEventListener(t,"move",this.handleTopMove),this.addEventListener(t,"move",this.handleTopMoveCapture,!0),this.addEventListener(t,"end",this.handleTopMoveEndCapture,!0),this.options.enableMouseEvents&&!this.options.ignoreContextMenu&&this.addEventListener(t,"contextmenu",this.handleTopMoveEndCapture),this.options.enableKeyboardEvents&&this.addEventListener(t,"keydown",this.handleCancelOnEscape,!0))}teardown(){const t=this.options.rootElement;t&&(St.isSetUp=!1,this._mouseClientOffset={},this.removeEventListener(t,"start",this.handleTopMoveStartCapture,!0),this.removeEventListener(t,"start",this.handleTopMoveStart),this.removeEventListener(t,"move",this.handleTopMoveCapture,!0),this.removeEventListener(t,"move",this.handleTopMove),this.removeEventListener(t,"end",this.handleTopMoveEndCapture,!0),this.options.enableMouseEvents&&!this.options.ignoreContextMenu&&this.removeEventListener(t,"contextmenu",this.handleTopMoveEndCapture),this.options.enableKeyboardEvents&&this.removeEventListener(t,"keydown",this.handleCancelOnEscape,!0),this.uninstallSourceNodeRemovalObserver())}addEventListener(t,r,n,i=!1){const o=_o?{capture:i,passive:!1}:i;this.listenerTypes.forEach(function(a){const s=it[a][r];s&&t.addEventListener(s,n,o)})}removeEventListener(t,r,n,i=!1){const o=_o?{capture:i,passive:!1}:i;this.listenerTypes.forEach(function(a){const s=it[a][r];s&&t.removeEventListener(s,n,o)})}connectDragSource(t,r){const n=this.handleMoveStart.bind(this,t);return this.sourceNodes.set(t,r),this.addEventListener(r,"start",n),()=>{this.sourceNodes.delete(t),this.removeEventListener(r,"start",n)}}connectDragPreview(t,r,n){return this.sourcePreviewNodeOptions.set(t,n),this.sourcePreviewNodes.set(t,r),()=>{this.sourcePreviewNodes.delete(t),this.sourcePreviewNodeOptions.delete(t)}}connectDropTarget(t,r){const n=this.options.rootElement;if(!this.document||!n)return()=>{};const i=o=>{if(!this.document||!n||!this.monitor.isDragging())return;let a;switch(o.type){case it.mouse.move:a={x:o.clientX,y:o.clientY};break;case it.touch.move:var s,u;a={x:((s=o.touches[0])===null||s===void 0?void 0:s.clientX)||0,y:((u=o.touches[0])===null||u===void 0?void 0:u.clientY)||0};break}const l=a!=null?this.document.elementFromPoint(a.x,a.y):void 0,c=l&&r.contains(l);if(l===r||c)return this.handleMove(o,t)};return this.addEventListener(this.document.body,"move",i),this.targetNodes.set(t,r),()=>{this.document&&(this.targetNodes.delete(t),this.removeEventListener(this.document.body,"move",i))}}getTopMoveStartHandler(){return!this.options.delayTouchStart&&!this.options.delayMouseStart?this.handleTopMoveStart:this.handleTopMoveStartDelay}installSourceNodeRemovalObserver(t){this.uninstallSourceNodeRemovalObserver(),this.draggedSourceNode=t,this.draggedSourceNodeRemovalObserver=new MutationObserver(()=>{t&&!t.parentElement&&(this.resurrectSourceNode(),this.uninstallSourceNodeRemovalObserver())}),!(!t||!t.parentElement)&&this.draggedSourceNodeRemovalObserver.observe(t.parentElement,{childList:!0})}resurrectSourceNode(){this.document&&this.draggedSourceNode&&(this.draggedSourceNode.style.display="none",this.draggedSourceNode.removeAttribute("data-reactid"),this.document.body.appendChild(this.draggedSourceNode))}uninstallSourceNodeRemovalObserver(){this.draggedSourceNodeRemovalObserver&&this.draggedSourceNodeRemovalObserver.disconnect(),this.draggedSourceNodeRemovalObserver=void 0,this.draggedSourceNode=void 0}constructor(t,r,n){this.getSourceClientOffset=i=>{const o=this.sourceNodes.get(i);return o&&yg(o)},this.handleTopMoveStartCapture=i=>{en(i)&&(this.moveStartSourceIds=[])},this.handleMoveStart=i=>{Array.isArray(this.moveStartSourceIds)&&this.moveStartSourceIds.unshift(i)},this.handleTopMoveStart=i=>{if(!en(i))return;const o=gr(i);o&&(Su(i)&&(this.lastTargetTouchFallback=i.targetTouches[0]),this._mouseClientOffset=o),this.waitingForDelay=!1},this.handleTopMoveStartDelay=i=>{if(!en(i))return;const o=i.type===it.touch.start?this.options.delayTouchStart:this.options.delayMouseStart;this.timeout=setTimeout(this.handleTopMoveStart.bind(this,i),o),this.waitingForDelay=!0},this.handleTopMoveCapture=()=>{this.dragOverTargetIds=[]},this.handleMove=(i,o)=>{this.dragOverTargetIds&&this.dragOverTargetIds.unshift(o)},this.handleTopMove=i=>{if(this.timeout&&clearTimeout(this.timeout),!this.document||this.waitingForDelay)return;const{moveStartSourceIds:o,dragOverTargetIds:a}=this,s=this.options.enableHoverOutsideTarget,u=gr(i,this.lastTargetTouchFallback);if(!u)return;if(this._isScrolling||!this.monitor.isDragging()&&hg(this._mouseClientOffset.x||0,this._mouseClientOffset.y||0,u.x,u.y,this.options.scrollAngleRanges)){this._isScrolling=!0;return}if(!this.monitor.isDragging()&&this._mouseClientOffset.hasOwnProperty("x")&&o&&fg(this._mouseClientOffset.x||0,this._mouseClientOffset.y||0,u.x,u.y)>(this.options.touchSlop?this.options.touchSlop:0)&&(this.moveStartSourceIds=void 0,this.actions.beginDrag(o,{clientOffset:this._mouseClientOffset,getSourceClientOffset:this.getSourceClientOffset,publishSource:!1})),!this.monitor.isDragging())return;const l=this.sourceNodes.get(this.monitor.getSourceId());this.installSourceNodeRemovalObserver(l),this.actions.publishDragSource(),i.cancelable&&i.preventDefault();const c=(a||[]).map(v=>this.targetNodes.get(v)).filter(v=>!!v),d=this.options.getDropTargetElementsAtPoint?this.options.getDropTargetElementsAtPoint(u.x,u.y,c):this.document.elementsFromPoint(u.x,u.y),h=[];for(const v in d){if(!d.hasOwnProperty(v))continue;let p=d[v];for(p!=null&&h.push(p);p;)p=p.parentElement,p&&h.indexOf(p)===-1&&h.push(p)}const f=h.filter(v=>c.indexOf(v)>-1).map(v=>this._getDropTargetId(v)).filter(v=>!!v).filter((v,p,g)=>g.indexOf(v)===p);if(s)for(const v in this.targetNodes){const p=this.targetNodes.get(v);if(l&&p&&p.contains(l)&&f.indexOf(v)===-1){f.unshift(v);break}}f.reverse(),this.actions.hover(f,{clientOffset:u})},this._getDropTargetId=i=>{const o=this.targetNodes.keys();let a=o.next();for(;a.done===!1;){const s=a.value;if(i===this.targetNodes.get(s))return s;a=o.next()}},this.handleTopMoveEndCapture=i=>{if(this._isScrolling=!1,this.lastTargetTouchFallback=void 0,!!gg(i)){if(!this.monitor.isDragging()||this.monitor.didDrop()){this.moveStartSourceIds=void 0;return}i.cancelable&&i.preventDefault(),this._mouseClientOffset={},this.uninstallSourceNodeRemovalObserver(),this.actions.drop(),this.actions.endDrag()}},this.handleCancelOnEscape=i=>{i.key==="Escape"&&this.monitor.isDragging()&&(this._mouseClientOffset={},this.uninstallSourceNodeRemovalObserver(),this.actions.endDrag())},this.options=new dg(n,r),this.actions=t.getActions(),this.monitor=t.getMonitor(),this.sourceNodes=new Map,this.sourcePreviewNodes=new Map,this.sourcePreviewNodeOptions=new Map,this.targetNodes=new Map,this.listenerTypes=[],this._mouseClientOffset={},this._isScrolling=!1,this.options.enableMouseEvents&&this.listenerTypes.push(Ee.mouse),this.options.enableTouchEvents&&this.listenerTypes.push(Ee.touch),this.options.enableKeyboardEvents&&this.listenerTypes.push(Ee.keyboard)}}const Tg=function(t,r={},n={}){return new St(t,r,n)};var Q=function(){return Q=Object.assign||function(t){for(var r,n=1,i=arguments.length;n<i;n++){r=arguments[n];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(t[o]=r[o])}return t},Q.apply(this,arguments)};function q(e,t,r){if(r||arguments.length===2)for(var n=0,i=t.length,o;n<i;n++)(o||!(n in t))&&(o||(o=Array.prototype.slice.call(t,0,n)),o[n]=t[n]);return e.concat(o||Array.prototype.slice.call(t))}function Sg(e){var t=e.isVisible,r=e.ease,n=r===void 0?"easeIn":r,i=e.duration,o=e.variants,a=o===void 0?{open:{opacity:1,height:"auto"},close:{opacity:0,height:0}}:o,s=e.children,u=Yp({polyfill:hd}),l=u[0],c=u[1].height,d=m.useState(t),h=d[0],f=d[1],v=m.useState(t),p=v[0],g=v[1],y=m.useState(!1),b=y[0],T=y[1],D=function(){T(!1),t||f(!1)};return m.useEffect(function(){T(!0),t?f(!0):g(!1)},[t]),m.useEffect(function(){h&&g(!0)},[c]),N.createElement(Wp.div,{style:b?{overflow:"hidden"}:void 0,onAnimationComplete:D,initial:p?"open":"close",animate:p?"open":"close",inherit:!1,variants:a,transition:{ease:n,duration:Dg(c,i)}},N.createElement("div",{ref:l},h&&s))}function Dg(e,t){if(t)return t;if(!e)return 0;var r=e/36;return Math.round((4+10*Math.pow(r,.25)+r/5)*10)/1500}var wg=function(e,t){return e.text>t.text?1:e.text<t.text?-1:0},ot=function(e,t){return e.find(function(r){return r.id===t})},Du=function(e,t,r){if(r===0)return!1;var n=e.find(function(i){return i.id===r});return n===void 0?!1:n.parent===t?!0:Du(e,t,n.parent)},ai=function(e){return e.id!==void 0&&e.parent!==void 0&&e.text!==void 0},Ce=function(e,t,r){var n=r.tree,i=r.rootId,o=r.canDrop;if(e===null){if(t===i)return!0;var a=n.find(function(c){return c.id===t});return!!(a&&a.droppable)}else{var s=ai(e)?e.id:null;if(o){var u=o(s,t);if(u!==void 0)return u}if(s===t)return!1;var l=n.find(function(d){return d.id===s}),a=n.find(function(d){return d.id===t});return l===void 0||s===null?t===i||!!(a!=null&&a.droppable):a===void 0?l.parent!==0:l.parent===t||!a.droppable?!1:!Du(n,s,t)}},Eg=function(e,t,r){return e.map(function(n){return n.id===t?Q(Q({},n),{parent:r}):n})},wu=function(e,t,r){if(r===0)return 0;var n=e.filter(function(i){return i.parent===t});return n[r]?e.findIndex(function(i){return i.id===n[r].id}):e.findIndex(function(i){return i.id===n[r-1].id})+1},Cg=function(e,t){return e.findIndex(function(r){return r.id===t})},Eu=function(e,t,r,n){var i=Cg(e,t),o=wu(e,r,n);return o=o>i?o-1:o,[i,o]},Og=function(e,t,r){var n=t<0?e.length+t:t;if(n>=0&&n<e.length){var i=r<0?e.length+r:r,o=e.splice(t,1)[0];e.splice(i,0,o)}},xg=function(e,t,r,n){var i=Eu(e,t,r,n),o=i[0],a=i[1],s=q([],e,!0);return Og(s,o,a),s.map(function(u){return u.id===t?Q(Q({},u),{parent:r}):u})},Ig=function(e,t){var r=e.getBoundingClientRect(),n=r.top+r.height/2;return t>n?"down":"up"},On=function(e,t){var r="",n=0;return e.forEach(function(i,o){var a,s=Ig(i,((a=t.getClientOffset())===null||a===void 0?void 0:a.y)||0);r===""?r=s:r!==s&&(r=s,n=o),o===e.length-1&&s==="down"&&(n=o+1)}),n},Fo=function(e,t,r){var n=t.closest('[role="list"]'),i=n==null?void 0:n.querySelectorAll(':scope > [role="listitem"]');return i?On(i,r):null},Pg=function(e,t,r){var n=e.getBoundingClientRect(),i=r.dropTargetOffset,o=n.top+i,a=n.bottom-i;return t>a?"lower":t<o?"upper":"middle"},xn=function(e,t,r,n){var i;if(!t)return null;if(e===null){var o=t.querySelectorAll(':scope > [role="listitem"]');return{id:n.rootId,index:On(o,r)}}var a=r.getItem(),s=t.querySelector('[role="list"]'),u=Pg(t,((i=r.getClientOffset())===null||i===void 0?void 0:i.y)||0,n);if(s){if(u==="upper")if(Ce(a,e.parent,n)){var l=Fo(e,t,r);return l===null?null:{id:e.parent,index:l}}else return{id:e.id,index:0};var o=s.querySelectorAll(':scope > [role="listitem"]');return{id:e.id,index:On(o,r)}}else{if(u==="middle")return{id:e.id,index:0};if(Ce(a,e.parent,n)){var l=Fo(e,t,r);return l===null?null:{id:e.parent,index:l}}return null}},Rg=function(e){return e===void 0&&(e={}),{backends:[{id:"html5",backend:Wc,options:e.html5,transition:cg},{id:"touch",backend:Tg,options:e.touch||{enableMouseEvents:!0},preview:!0,transition:lg}]}},or=function(e,t){return e.some(function(r){return r.parent===t})},Cu=m.createContext({}),Mg=function(e){var t=Bg(e.tree,e.initialOpen),r=t[0],n=t[1],i=n.handleToggle,o=n.handleCloseAll,a=n.handleOpenAll,s=n.handleOpen,u=n.handleClose;m.useImperativeHandle(e.treeRef,function(){return{open:function(f){return s(f,e.onChangeOpen)},close:function(f){return u(f,e.onChangeOpen)},openAll:function(){return a(e.onChangeOpen)},closeAll:function(){return o(e.onChangeOpen)}}});var l=ge().getMonitor(),c=e.canDrop,d=e.canDrag,h=Q(Q({extraAcceptTypes:[],listComponent:"ul",listItemComponent:"li",placeholderComponent:"li",sort:!0,insertDroppableFirst:!0,enableAnimateExpand:!1,dropTargetOffset:0,initialOpen:!1},e),{openIds:r,onDrop:function(f,v,p){if(f){var g={dragSourceId:f.id,dropTargetId:v,dragSource:f,dropTarget:ot(e.tree,v),monitor:l},y=e.tree;if(ot(y,f.id)||(y=q(q([],y,!0),[f],!1)),e.sort===!1){var b=Eu(y,f.id,v,p),T=b[1];g.destinationIndex=T,g.relativeIndex=p,e.onDrop(xg(y,f.id,v,p),g);return}e.onDrop(Eg(y,f.id,v),g)}else{var g={dropTargetId:v,dropTarget:ot(e.tree,v),monitor:l};e.sort===!1&&(g.destinationIndex=wu(e.tree,v,p),g.relativeIndex=p),e.onDrop(e.tree,g)}},canDrop:c?function(f,v){return c(e.tree,{dragSourceId:f??void 0,dropTargetId:v,dragSource:l.getItem(),dropTarget:ot(e.tree,v),monitor:l})}:void 0,canDrag:d?function(f){return d(ot(e.tree,f))}:void 0,onToggle:function(f){return i(f,e.onChangeOpen)}});return N.createElement(Cu.Provider,{value:h},e.children)},Ou=m.createContext({}),Ag={isLock:!1},Lg=function(e){var t=m.useState(Ag.isLock),r=t[0],n=t[1];return N.createElement(Ou.Provider,{value:{isLock:r,lock:function(){return n(!0)},unlock:function(){return n(!1)}}},e.children)},Lt=m.createContext({}),Kt={dropTargetId:void 0,index:void 0},Vg=function(e){var t=m.useState(Kt.dropTargetId),r=t[0],n=t[1],i=m.useState(Kt.index),o=i[0],a=i[1],s=function(l,c){n(l),a(c)},u=function(){n(Kt.dropTargetId),a(Kt.index)};return N.createElement(Lt.Provider,{value:{dropTargetId:r,index:o,showPlaceholder:s,hidePlaceholder:u}},e.children)},Ng=function(e){return N.createElement(Mg,Q({},e),N.createElement(Lg,null,N.createElement(Vg,null,e.children)))},_g=function(e){var t=m.useContext(Ou);m.useEffect(function(){if(e.current){var r=e.current,n=function(c){var d=c.target;(d instanceof HTMLInputElement||d instanceof HTMLTextAreaElement)&&t.lock()},i=function(c){var d=c.target;(d instanceof HTMLInputElement||d instanceof HTMLTextAreaElement)&&t.unlock()},o=function(c){return n(c)},a=function(c){return i(c)},s=function(c){return n(c)},u=function(c){return i(c)},l=new MutationObserver(function(){document.activeElement===document.body&&t.unlock()});return l.observe(r,{subtree:!0,childList:!0}),r.addEventListener("mouseover",o),r.addEventListener("mouseout",a),r.addEventListener("focusin",s),r.addEventListener("focusout",u),function(){l.disconnect(),r.removeEventListener("mouseover",o),r.removeEventListener("mouseout",a),r.removeEventListener("focusin",s),r.removeEventListener("focusout",u)}}},[e,t]),m.useEffect(function(){var r;(r=e.current)===null||r===void 0||r.setAttribute("draggable",t.isLock?"false":"true")},[e,t.isLock])},Mr={TREE_ITEM:Symbol()},xu=null,Iu=function(e){var t=e.target;if(t instanceof HTMLElement){var r=t.closest('[role="listitem"]');e.currentTarget===r&&(xu=r)}},jo=function(e){return Iu(e)},ko=function(e){return Iu(e)},Fg=function(e,t){var r=Oe();m.useEffect(function(){var s=t.current;return s==null||s.addEventListener("dragstart",jo),s==null||s.addEventListener("touchstart",ko,{passive:!0}),function(){s==null||s.removeEventListener("dragstart",jo),s==null||s.removeEventListener("touchstart",ko)}},[t]);var n=wc({type:Mr.TREE_ITEM,item:function(s){var u=Q({ref:t},e);return r.onDragStart&&r.onDragStart(u,s),u},end:function(s,u){var l=s;r.onDragEnd&&r.onDragEnd(l,u)},canDrag:function(){var s=r.canDrag;return xu!==t.current?!1:s?s(e.id):!0},collect:function(s){return{isDragging:s.isDragging()}}}),i=n[0].isDragging,o=n[1],a=n[2];return[i,o,a]},jg=function(e){var t=Oe(),r=m.useContext(Lt),n=Ra({accept:q([Mr.TREE_ITEM],t.extraAcceptTypes,!0),drop:function(u,l){var c=t.rootId,d=t.onDrop,h=r.dropTargetId,f=r.index;l.isOver({shallow:!0})&&h!==void 0&&f!==void 0&&d(ai(u)?u:null,c,f),r.hidePlaceholder()},canDrop:function(u,l){var c=t.rootId;return l.isOver({shallow:!0})?u===void 0?!1:Ce(u,c,t):!1},hover:function(u,l){if(l.isOver({shallow:!0})){var c=t.rootId,d=r.dropTargetId,h=r.index,f=r.showPlaceholder,v=r.hidePlaceholder,p=xn(null,e.current,l,t);if(p===null||!Ce(u,c,t)){v();return}(p.id!==d||p.index!==h)&&f(p.id,p.index)}},collect:function(u){var l=u.getItem();return{isOver:u.isOver({shallow:!0})&&u.canDrop(),dragSource:l}}}),i=n[0],o=i.isOver,a=i.dragSource,s=n[1];return[o,a,s]},kg=function(e,t){var r=Oe(),n=m.useContext(Lt),i=Ra({accept:q([Mr.TREE_ITEM],r.extraAcceptTypes,!0),drop:function(l,c){var d=n.dropTargetId,h=n.index;c.isOver({shallow:!0})&&d!==void 0&&h!==void 0&&r.onDrop(ai(l)?l:null,d,h),n.hidePlaceholder()},canDrop:function(l,c){if(c.isOver({shallow:!0})){var d=xn(e,t.current,c,r);return d===null?!1:Ce(l,d.id,r)}return!1},hover:function(l,c){if(c.isOver({shallow:!0})){var d=n.dropTargetId,h=n.index,f=n.showPlaceholder,v=n.hidePlaceholder,p=xn(e,t.current,c,r);if(p===null||!Ce(l,p.id,r)){v();return}(p.id!==d||p.index!==h)&&f(p.id,p.index)}},collect:function(l){var c=l.getItem();return{isOver:l.isOver({shallow:!0})&&l.canDrop(),dragSource:c}}}),o=i[0],a=o.isOver,s=o.dragSource,u=i[1];return[a,s,u]},Bg=function(e,t){var r=m.useMemo(function(){return t===!0?e.filter(function(d){return or(e,d.id)}).map(function(d){return d.id}):Array.isArray(t)?t:[]},[t]),n=m.useState(r),i=n[0],o=n[1];m.useEffect(function(){return o(r)},[t]);var a=function(d,h){var f=i.includes(d)?i.filter(function(v){return v!==d}):q(q([],i,!0),[d],!1);o(f),h&&h(f)},s=function(d){o([]),d&&d([])},u=function(d){var h=e.filter(function(f){return or(e,f.id)}).map(function(f){return f.id});o(h),d&&d(h)},l=function(d,h){var f=[];if(Array.isArray(d)){var v=e.filter(function(p){return d.includes(p.id)&&or(e,p.id)});f=q(q([],i,!0),v.map(function(p){return p.id}),!0).filter(function(p,g,y){return y.indexOf(p)===g})}else f=i.includes(d)?i:q(q([],i,!0),[d],!1);o(f),h&&h(f)},c=function(d,h){var f=i.filter(function(v){return Array.isArray(d)?!d.includes(v):v!==d});o(f),h&&h(f)};return[i,{handleToggle:a,handleCloseAll:s,handleOpenAll:u,handleOpen:l,handleClose:c}]},Hg=function(){return Ec(function(e){var t=e.getItemType();return{item:e.getItem(),clientOffset:e.getClientOffset(),isDragging:e.isDragging()&&t===Mr.TREE_ITEM}})},Oe=function(){var e=m.useContext(Cu);if(!e)throw new Error("useTreeContext must be used under TreeProvider");return e},zg=function(e,t){var r=Oe(),n=r.rootId,i=r.rootProps,o=r.classes,a=(o==null?void 0:o.container)||"";return t&&(o!=null&&o.dropTarget)&&(a="".concat(a," ").concat(o.dropTarget)),e===n&&(o!=null&&o.root)&&(a="".concat(a," ").concat(o.root)),e===n&&(i!=null&&i.className)&&(a="".concat(a," ").concat(i.className)),a=a.trim(),a},Ug=function(e,t,r){t.current?r(t):r(e),m.useEffect(function(){t.current?r(t):r(e)},[t.current])},$g=function(e){var t=Oe(),r=m.useContext(Lt),n=m.useRef(null),i=m.useRef(null),o=t.tree.find(function(A){return A.id===e.id}),a=t.openIds,s=t.classes,u=t.enableAnimateExpand,l=a.includes(e.id),c=Fg(o,n),d=c[0],h=c[1],f=c[2],v=kg(o,n),p=v[0],g=v[1],y=v[2];Ug(n,i,h),Ce(g,e.id,t)&&y(n),m.useEffect(function(){t.dragPreviewRender?f(qc(),{captureDraggingState:!0}):i.current&&f(n)},[f,t.dragPreviewRender]),_g(n);var b=function(){return t.onToggle(o.id)},T=t.listItemComponent,D=(s==null?void 0:s.listItem)||"";p&&(s!=null&&s.dropTarget)&&(D="".concat(D," ").concat(s.dropTarget)),d&&(s!=null&&s.draggingSource)&&(D="".concat(D," ").concat(s.draggingSource));var w=t.canDrag?t.canDrag(e.id):!0,x=r.dropTargetId===e.id,M={depth:e.depth,isOpen:l,isDragging:d,isDropTarget:x,draggable:w,hasChild:or(t.tree,e.id),containerRef:n,handleRef:i,onToggle:b};return N.createElement(T,{ref:n,className:D,role:"listitem"},t.render(o,M),u&&M.hasChild&&N.createElement(Sg,{isVisible:l},N.createElement(In,{parentId:e.id,depth:e.depth+1})),!u&&M.hasChild&&l&&N.createElement(In,{parentId:e.id,depth:e.depth+1}))},Bo=function(e){var t=Oe(),r=t.placeholderRender,n=t.placeholderComponent,i=t.classes,o=m.useContext(Lt),a=ge(),s=a.getMonitor(),u=s.getItem();if(!r||!u)return null;var l=e.dropTargetId===o.dropTargetId&&(e.index===o.index||e.index===void 0&&e.listCount===o.index);return l?N.createElement(n,{className:(i==null?void 0:i.placeholder)||""},r(u,{depth:e.depth})):null},In=function(e){var t=Oe(),r=m.useRef(null),n=t.tree.filter(function(p){return p.parent===e.parentId}),i=n,o=typeof t.sort=="function"?t.sort:wg;if(t.insertDroppableFirst){var a=n.filter(function(p){return p.droppable}),s=n.filter(function(p){return!p.droppable});t.sort===!1?i=q(q([],a,!0),s,!0):(a=a.sort(o),s=s.sort(o),i=q(q([],a,!0),s,!0))}else t.sort!==!1&&(i=n.sort(o));var u=jg(r),l=u[0],c=u[1],d=u[2];e.parentId===t.rootId&&Ce(c,t.rootId,t)&&d(r);var h=zg(e.parentId,l),f=t.rootProps||{},v=t.listComponent;return N.createElement(v,Q({ref:r,role:"list"},f,{className:h}),i.map(function(p,g){return N.createElement(N.Fragment,{key:p.id},N.createElement(Bo,{depth:e.depth,listCount:i.length,dropTargetId:e.parentId,index:g}),N.createElement($g,{id:p.id,depth:e.depth}))}),N.createElement(Bo,{depth:e.depth,listCount:i.length,dropTargetId:e.parentId}))},qg={height:"100%",left:0,pointerEvents:"none",position:"fixed",top:0,width:"100%",zIndex:100},Wg=function(e){var t=e.clientOffset;if(!t)return{};var r=t.x,n=t.y,i="translate(".concat(r,"px, ").concat(n,"px)");return{pointerEvents:"none",transform:i}},Gg=function(){var e=Oe(),t=Hg(),r=t.isDragging,n=t.clientOffset;return!r||!n?null:N.createElement("div",{style:qg},N.createElement("div",{style:Wg(t)},e.dragPreviewRender&&e.dragPreviewRender(t)))};function Yg(e,t){return N.createElement(Ng,Q({},e,{treeRef:t}),e.dragPreviewRender&&N.createElement(Gg,null),N.createElement(In,{parentId:e.rootId,depth:0}))}var Xg=m.forwardRef(Yg);const Kg="_tree_1lv9u_1",Zg="_toggle_1lv9u_4",Jg="_dropTarget_1lv9u_11",Qg="_draggingSource_1lv9u_14",em="_placeholderContainer_1lv9u_17",tm="_placeholder_1lv9u_17",$e={tree:Kg,toggle:Zg,dropTarget:Jg,draggingSource:Qg,placeholderContainer:em,placeholder:tm},Pn=({node:e,depth:t,isOpen:r,onToggle:n,hasChild:i,draggable:o,icons:a})=>{const{id:s,data:u}=e,{active:l,testId:c,onClick:d,actions:h=[]}=u,f=v=>{v.stopPropagation(),n(s)};return _.jsx("div",{className:Vu(fe.item,fe.action,l?fe.active:"",t>0?fe.indented:""),style:{marginInlineStart:t*24},"data-testid":c,onClick:v=>{d&&d(v)},children:_.jsxs("div",{className:fe.itemHeader,children:[i&&_.jsx("div",{className:$e.toggle,children:_.jsx(ya,{basic:!0,colored:r?!0:Nu.MUTED,small:!0,round:!0,icon:r?(a==null?void 0:a.collapse)||Lr.COLLAPSE:(a==null?void 0:a.expand)||Lr.EXPAND,onClick:f})}),o&&_.jsx("div",{className:fe.drag,children:_.jsx(Ru,{icon:Lr.DRAG})}),_.jsx(_u,{item:u}),_.jsx("div",{className:fe.right,children:_.jsx("div",{className:fe.actions,children:_.jsx(ju,{actions:h})})})]})})};try{Pn.displayName="TreeItem",Pn.__docgenInfo={description:"",displayName:"TreeItem",props:{node:{defaultValue:null,description:"",name:"node",required:!0,type:{name:"NodeModel<any>"}},depth:{defaultValue:null,description:"",name:"depth",required:!0,type:{name:"number"}},isOpen:{defaultValue:null,description:"",name:"isOpen",required:!0,type:{name:"boolean"}},onToggle:{defaultValue:null,description:"",name:"onToggle",required:!0,type:{name:"(id: TStringOrNumber) => void"}},hasChild:{defaultValue:null,description:"",name:"hasChild",required:!0,type:{name:"boolean"}},draggable:{defaultValue:null,description:"",name:"draggable",required:!1,type:{name:"boolean"}},icons:{defaultValue:null,description:"",name:"icons",required:!1,type:{name:"{ expand: ReactNode; collapse: ReactNode; }"}}}}}catch{}const Rn=({depth:e})=>_.jsx("div",{className:$e.placeholder,style:{left:e*24}});try{Rn.displayName="TreePlaceholder",Rn.__docgenInfo={description:"",displayName:"TreePlaceholder",props:{depth:{defaultValue:null,description:"",name:"depth",required:!0,type:{name:"number"}}}}}catch{}const Je=({list:e,draggable:t=!1,onListReorder:r,onChangeOpen:n,testId:i,isInitialOpen:o=!1,treeRef:a,itemHasChild:s,onItemToggle:u,icons:l})=>{var f;const c=v=>{if(r){const p=v.map(({id:g,parent:y,droppable:b,data:T})=>({id:g,parent:y,droppable:b,...T}));r(p)}},d=v=>{n&&n(v)},h=(f=e==null?void 0:e.items)==null?void 0:f.map(({id:v,droppable:p,parent:g,name:y,...b})=>({id:v,text:y,droppable:p,parent:g,data:{name:y,...b}}));return _.jsxs("div",{"data-testid":i,children:[e.name&&!e.noHeader&&_.jsx(Fu,{name:e.name,actions:e.actions}),_.jsx("div",{className:fe.list,children:_.jsx(rc,{backend:ug,options:Rg(),context:window,children:_.jsx(Xg,{ref:a,tree:h,sort:!1,insertDroppableFirst:!1,canDrag:()=>t,canDrop:(v,{dragSource:p,dropTargetId:g})=>{if((p==null?void 0:p.parent)===g)return!0},rootId:0,render:(v,{depth:p,isOpen:g,onToggle:y,hasChild:b})=>_.jsx(Pn,{hasChild:s?s(v):b,node:v,depth:p,isOpen:g,onToggle:()=>{u==null||u(v,!g),y()},draggable:t,icons:l}),onDrop:c,onChangeOpen:d,dropTargetOffset:5,placeholderRender:(v,{depth:p})=>_.jsx(Rn,{depth:p}),placeholderComponent:"div",listComponent:"div",listItemComponent:"div",classes:{root:$e.tree,draggingSource:$e.draggingSource,dropTarget:$e.dropTarget,placeholder:$e.placeholderContainer},initialOpen:o})})})]})};try{Je.displayName="Tree",Je.__docgenInfo={description:"",displayName:"Tree",props:{list:{defaultValue:null,description:"",name:"list",required:!0,type:{name:"ITreeListProps"}},draggable:{defaultValue:{value:"false"},description:"",name:"draggable",required:!1,type:{name:"boolean"}},onListReorder:{defaultValue:null,description:"",name:"onListReorder",required:!1,type:{name:"((newList: any[]) => void)"}},onChangeOpen:{defaultValue:null,description:"",name:"onChangeOpen",required:!1,type:{name:"((id: TStringOrNumber[]) => void)"}},testId:{defaultValue:null,description:"",name:"testId",required:!1,type:{name:"string"}},isInitialOpen:{defaultValue:{value:"false"},description:"",name:"isInitialOpen",required:!1,type:{name:"boolean | string[] | number[]"}},treeRef:{defaultValue:null,description:"",name:"treeRef",required:!1,type:{name:"RefObject<any>"}},itemHasChild:{defaultValue:null,description:"",name:"itemHasChild",required:!1,type:{name:"((node: NodeModel<any>) => boolean)"}},onItemToggle:{defaultValue:null,description:"",name:"onItemToggle",required:!1,type:{name:"((node: NodeModel<any>, isOpen: boolean) => void)"}},icons:{defaultValue:null,description:"",name:"icons",required:!1,type:{name:"{ expand: ReactNode; collapse: ReactNode; }"}}}}}catch{}const Ne={name:"Animals",items:[{id:1,parent:0,droppable:!0,name:"Mammals",onClick:()=>console.log("Test")},{id:2,parent:1,droppable:!0,name:"Cats"},{id:3,parent:1,droppable:!0,name:"Dogs"},{id:4,parent:0,droppable:!0,name:"Amphibians"},{id:5,parent:4,droppable:!0,name:"Frogs"},{id:6,parent:0,droppable:!0,name:"Reptiles",active:!0}]},rm={...Ne,header:{actions:[{label:"Add",primary:!0,icon:"add",onClick:()=>{}}]},items:Ne.items.map(e=>({...e,actions:[{label:"Delete",icon:"delete",onClick:()=>{}}]}))},nm={...Ne,items:Ne.items.map(e=>({...e,droppable:e.parent===0,details:e.parent===0?"Droppable":"Not droppable"}))},im={...Ne,items:Ne.items.map(e=>({...e,parent:0,droppable:!1}))},Vm={title:"Basic/Tree",component:Je,args:{list:Ne}},xe=e=>_.jsx(Je,{...e}),Zt=xe.bind({}),at=xe.bind({});at.args={list:rm};const st=xe.bind({});st.args={draggable:!0};const qe=xe.bind({});qe.args={draggable:!0,list:nm};qe.parameters={docs:{description:{story:"Use the `droppable` prop to specify which items can have other items dropped into them."}}};const ut=xe.bind({});ut.args={draggable:!0,list:im};const lt=xe.bind({});lt.args={isInitialOpen:!0};const ct=xe.bind({});ct.args={onChangeOpen:e=>console.log("onChangeOpen here",e)};const Jt=()=>{const[e,t]=m.useState([{id:1,parent:0,droppable:!0,name:"Mammals"},{id:2,parent:1,droppable:!0,name:"Cats"},{id:3,parent:1,droppable:!0,name:"Dogs"},{id:4,parent:0,droppable:!0,name:"Amphibians"},{id:5,parent:4,droppable:!0,name:"Frogs"},{id:6,parent:0,droppable:!0,name:"Reptiles"}]),r=()=>{const i={id:Math.max(...e.map(o=>o.id))+1,parent:0,droppable:!0,name:"New Item"};t([i].concat(e))},n={name:"Animals",actions:[{label:"Add",primary:!0,icon:"add",onClick:()=>r()}],items:e};return _.jsx(Je,{list:n,draggable:!0,onListReorder:t})},om=[{id:1,parent:0,droppable:!0,name:"Mammals",onClick:()=>console.log("Test")},{id:4,parent:0,droppable:!0,name:"Amphibians"},{id:6,parent:0,droppable:!0,name:"Reptiles",active:!0}],am=[{id:2,parent:1,droppable:!0,name:"Cats"},{id:3,parent:1,droppable:!0,name:"Dogs"},{id:5,parent:4,droppable:!0,name:"Frogs"}],Qt=()=>{const[e,t]=m.useState(om),[r,n]=m.useState({}),i=m.useRef(0);m.useEffect(()=>()=>clearTimeout(i.current),[]);const o=l=>l.parent===0,a=m.useCallback((l,c)=>{n(d=>({...d,[l.id]:{isOpen:c,isLoading:c}})),c&&(console.log("Loading"),i.current=window.setTimeout(()=>{console.log("Loaded"),t(d=>d.filter(h=>h.parent!==l.id).concat(am.filter(h=>h.parent===l.id))),n(d=>({...d,[l.id]:{isOpen:c,isLoading:!1}}))},1e3))},[]),s=m.useMemo(()=>Object.keys(r).filter(l=>r[+l].isOpen).map(l=>{const c=r[+l];return{id:`${l}_extra`,parent:+l,name:c.isLoading?_.jsx(Bu,{muted:!0,children:"Loading..."}):_.jsx(ya,{label:"Load more...",onClick:()=>console.log(`Load more for parent ${l}`)})}}),[r]),u={name:"Animals",items:e.concat(s)};return _.jsx(Je,{list:u,itemHasChild:o,onItemToggle:a})},dt=xe.bind({});dt.args={icons:{expand:_.jsx(Mu,{}),collapse:_.jsx(Au,{})}};var Ho,zo,Uo;Zt.parameters={...Zt.parameters,docs:{...(Ho=Zt.parameters)==null?void 0:Ho.docs,source:{originalSource:`args => <Tree
|
|
6
|
+
see this guide: https://github.com/louisbrunner/dnd-multi-backend/tree/master/packages/react-dnd-multi-backend#migrating-from-2xx`);He(this,Yt,new ig),He(this,Z,{}),He(this,ye,[]),n.backends.forEach(i=>{const o=R(this,Lo).call(this,t,r,i);R(this,Z)[o.id]=o,R(this,ye).push(o)}),He(this,K,R(this,ye)[0].id),He(this,Re,{})}}ae(Xe,"isSetUp",!1);const ug=(e,t,r)=>new Xe(e,t,r),Tu=(e,t)=>({event:e,check:t}),lg=Tu("touchstart",e=>{const t=e;return t.touches!==null&&t.touches!==void 0}),cg=Tu("pointerdown",e=>e.pointerType=="mouse");var Ee;(function(e){e.mouse="mouse",e.touch="touch",e.keyboard="keyboard"})(Ee||(Ee={}));class dg{get delay(){var t;return(t=this.args.delay)!==null&&t!==void 0?t:0}get scrollAngleRanges(){return this.args.scrollAngleRanges}get getDropTargetElementsAtPoint(){return this.args.getDropTargetElementsAtPoint}get ignoreContextMenu(){var t;return(t=this.args.ignoreContextMenu)!==null&&t!==void 0?t:!1}get enableHoverOutsideTarget(){var t;return(t=this.args.enableHoverOutsideTarget)!==null&&t!==void 0?t:!1}get enableKeyboardEvents(){var t;return(t=this.args.enableKeyboardEvents)!==null&&t!==void 0?t:!1}get enableMouseEvents(){var t;return(t=this.args.enableMouseEvents)!==null&&t!==void 0?t:!1}get enableTouchEvents(){var t;return(t=this.args.enableTouchEvents)!==null&&t!==void 0?t:!0}get touchSlop(){return this.args.touchSlop||0}get delayTouchStart(){var t,r,n,i;return(i=(n=(t=this.args)===null||t===void 0?void 0:t.delayTouchStart)!==null&&n!==void 0?n:(r=this.args)===null||r===void 0?void 0:r.delay)!==null&&i!==void 0?i:0}get delayMouseStart(){var t,r,n,i;return(i=(n=(t=this.args)===null||t===void 0?void 0:t.delayMouseStart)!==null&&n!==void 0?n:(r=this.args)===null||r===void 0?void 0:r.delay)!==null&&i!==void 0?i:0}get window(){if(this.context&&this.context.window)return this.context.window;if(typeof window<"u")return window}get document(){var t;if(!((t=this.context)===null||t===void 0)&&t.document)return this.context.document;if(this.window)return this.window.document}get rootElement(){var t;return((t=this.args)===null||t===void 0?void 0:t.rootElement)||this.document}constructor(t,r){this.args=t,this.context=r}}function fg(e,t,r,n){return Math.sqrt(Math.pow(Math.abs(r-e),2)+Math.pow(Math.abs(n-t),2))}function hg(e,t,r,n,i){if(!i)return!1;const o=Math.atan2(n-t,r-e)*180/Math.PI+180;for(let a=0;a<i.length;++a){const s=i[a];if(s&&(s.start==null||o>=s.start)&&(s.end==null||o<=s.end))return!0}return!1}const vg={Left:1,Right:2,Center:4},pg={Left:0,Center:1,Right:2};function en(e){return e.button===void 0||e.button===pg.Left}function gg(e){return e.buttons===void 0||(e.buttons&vg.Left)===0}function Su(e){return!!e.targetTouches}const mg=1;function yg(e){const t=e.nodeType===mg?e:e.parentElement;if(!t)return;const{top:r,left:n}=t.getBoundingClientRect();return{x:n,y:r}}function bg(e,t){if(e.targetTouches.length===1)return gr(e.targetTouches[0]);if(t&&e.touches.length===1&&e.touches[0].target===t.target)return gr(e.touches[0])}function gr(e,t){return Su(e)?bg(e,t):{x:e.clientX,y:e.clientY}}const _o=(()=>{let e=!1;try{addEventListener("test",()=>{},Object.defineProperty({},"passive",{get(){return e=!0,!0}}))}catch{}return e})(),it={[Ee.mouse]:{start:"mousedown",move:"mousemove",end:"mouseup",contextmenu:"contextmenu"},[Ee.touch]:{start:"touchstart",move:"touchmove",end:"touchend"},[Ee.keyboard]:{keydown:"keydown"}};class St{profile(){var t;return{sourceNodes:this.sourceNodes.size,sourcePreviewNodes:this.sourcePreviewNodes.size,sourcePreviewNodeOptions:this.sourcePreviewNodeOptions.size,targetNodes:this.targetNodes.size,dragOverTargetIds:((t=this.dragOverTargetIds)===null||t===void 0?void 0:t.length)||0}}get document(){return this.options.document}setup(){const t=this.options.rootElement;t&&(P(!St.isSetUp,"Cannot have two Touch backends at the same time."),St.isSetUp=!0,this.addEventListener(t,"start",this.getTopMoveStartHandler()),this.addEventListener(t,"start",this.handleTopMoveStartCapture,!0),this.addEventListener(t,"move",this.handleTopMove),this.addEventListener(t,"move",this.handleTopMoveCapture,!0),this.addEventListener(t,"end",this.handleTopMoveEndCapture,!0),this.options.enableMouseEvents&&!this.options.ignoreContextMenu&&this.addEventListener(t,"contextmenu",this.handleTopMoveEndCapture),this.options.enableKeyboardEvents&&this.addEventListener(t,"keydown",this.handleCancelOnEscape,!0))}teardown(){const t=this.options.rootElement;t&&(St.isSetUp=!1,this._mouseClientOffset={},this.removeEventListener(t,"start",this.handleTopMoveStartCapture,!0),this.removeEventListener(t,"start",this.handleTopMoveStart),this.removeEventListener(t,"move",this.handleTopMoveCapture,!0),this.removeEventListener(t,"move",this.handleTopMove),this.removeEventListener(t,"end",this.handleTopMoveEndCapture,!0),this.options.enableMouseEvents&&!this.options.ignoreContextMenu&&this.removeEventListener(t,"contextmenu",this.handleTopMoveEndCapture),this.options.enableKeyboardEvents&&this.removeEventListener(t,"keydown",this.handleCancelOnEscape,!0),this.uninstallSourceNodeRemovalObserver())}addEventListener(t,r,n,i=!1){const o=_o?{capture:i,passive:!1}:i;this.listenerTypes.forEach(function(a){const s=it[a][r];s&&t.addEventListener(s,n,o)})}removeEventListener(t,r,n,i=!1){const o=_o?{capture:i,passive:!1}:i;this.listenerTypes.forEach(function(a){const s=it[a][r];s&&t.removeEventListener(s,n,o)})}connectDragSource(t,r){const n=this.handleMoveStart.bind(this,t);return this.sourceNodes.set(t,r),this.addEventListener(r,"start",n),()=>{this.sourceNodes.delete(t),this.removeEventListener(r,"start",n)}}connectDragPreview(t,r,n){return this.sourcePreviewNodeOptions.set(t,n),this.sourcePreviewNodes.set(t,r),()=>{this.sourcePreviewNodes.delete(t),this.sourcePreviewNodeOptions.delete(t)}}connectDropTarget(t,r){const n=this.options.rootElement;if(!this.document||!n)return()=>{};const i=o=>{if(!this.document||!n||!this.monitor.isDragging())return;let a;switch(o.type){case it.mouse.move:a={x:o.clientX,y:o.clientY};break;case it.touch.move:var s,u;a={x:((s=o.touches[0])===null||s===void 0?void 0:s.clientX)||0,y:((u=o.touches[0])===null||u===void 0?void 0:u.clientY)||0};break}const l=a!=null?this.document.elementFromPoint(a.x,a.y):void 0,c=l&&r.contains(l);if(l===r||c)return this.handleMove(o,t)};return this.addEventListener(this.document.body,"move",i),this.targetNodes.set(t,r),()=>{this.document&&(this.targetNodes.delete(t),this.removeEventListener(this.document.body,"move",i))}}getTopMoveStartHandler(){return!this.options.delayTouchStart&&!this.options.delayMouseStart?this.handleTopMoveStart:this.handleTopMoveStartDelay}installSourceNodeRemovalObserver(t){this.uninstallSourceNodeRemovalObserver(),this.draggedSourceNode=t,this.draggedSourceNodeRemovalObserver=new MutationObserver(()=>{t&&!t.parentElement&&(this.resurrectSourceNode(),this.uninstallSourceNodeRemovalObserver())}),!(!t||!t.parentElement)&&this.draggedSourceNodeRemovalObserver.observe(t.parentElement,{childList:!0})}resurrectSourceNode(){this.document&&this.draggedSourceNode&&(this.draggedSourceNode.style.display="none",this.draggedSourceNode.removeAttribute("data-reactid"),this.document.body.appendChild(this.draggedSourceNode))}uninstallSourceNodeRemovalObserver(){this.draggedSourceNodeRemovalObserver&&this.draggedSourceNodeRemovalObserver.disconnect(),this.draggedSourceNodeRemovalObserver=void 0,this.draggedSourceNode=void 0}constructor(t,r,n){this.getSourceClientOffset=i=>{const o=this.sourceNodes.get(i);return o&&yg(o)},this.handleTopMoveStartCapture=i=>{en(i)&&(this.moveStartSourceIds=[])},this.handleMoveStart=i=>{Array.isArray(this.moveStartSourceIds)&&this.moveStartSourceIds.unshift(i)},this.handleTopMoveStart=i=>{if(!en(i))return;const o=gr(i);o&&(Su(i)&&(this.lastTargetTouchFallback=i.targetTouches[0]),this._mouseClientOffset=o),this.waitingForDelay=!1},this.handleTopMoveStartDelay=i=>{if(!en(i))return;const o=i.type===it.touch.start?this.options.delayTouchStart:this.options.delayMouseStart;this.timeout=setTimeout(this.handleTopMoveStart.bind(this,i),o),this.waitingForDelay=!0},this.handleTopMoveCapture=()=>{this.dragOverTargetIds=[]},this.handleMove=(i,o)=>{this.dragOverTargetIds&&this.dragOverTargetIds.unshift(o)},this.handleTopMove=i=>{if(this.timeout&&clearTimeout(this.timeout),!this.document||this.waitingForDelay)return;const{moveStartSourceIds:o,dragOverTargetIds:a}=this,s=this.options.enableHoverOutsideTarget,u=gr(i,this.lastTargetTouchFallback);if(!u)return;if(this._isScrolling||!this.monitor.isDragging()&&hg(this._mouseClientOffset.x||0,this._mouseClientOffset.y||0,u.x,u.y,this.options.scrollAngleRanges)){this._isScrolling=!0;return}if(!this.monitor.isDragging()&&this._mouseClientOffset.hasOwnProperty("x")&&o&&fg(this._mouseClientOffset.x||0,this._mouseClientOffset.y||0,u.x,u.y)>(this.options.touchSlop?this.options.touchSlop:0)&&(this.moveStartSourceIds=void 0,this.actions.beginDrag(o,{clientOffset:this._mouseClientOffset,getSourceClientOffset:this.getSourceClientOffset,publishSource:!1})),!this.monitor.isDragging())return;const l=this.sourceNodes.get(this.monitor.getSourceId());this.installSourceNodeRemovalObserver(l),this.actions.publishDragSource(),i.cancelable&&i.preventDefault();const c=(a||[]).map(v=>this.targetNodes.get(v)).filter(v=>!!v),d=this.options.getDropTargetElementsAtPoint?this.options.getDropTargetElementsAtPoint(u.x,u.y,c):this.document.elementsFromPoint(u.x,u.y),h=[];for(const v in d){if(!d.hasOwnProperty(v))continue;let p=d[v];for(p!=null&&h.push(p);p;)p=p.parentElement,p&&h.indexOf(p)===-1&&h.push(p)}const f=h.filter(v=>c.indexOf(v)>-1).map(v=>this._getDropTargetId(v)).filter(v=>!!v).filter((v,p,g)=>g.indexOf(v)===p);if(s)for(const v in this.targetNodes){const p=this.targetNodes.get(v);if(l&&p&&p.contains(l)&&f.indexOf(v)===-1){f.unshift(v);break}}f.reverse(),this.actions.hover(f,{clientOffset:u})},this._getDropTargetId=i=>{const o=this.targetNodes.keys();let a=o.next();for(;a.done===!1;){const s=a.value;if(i===this.targetNodes.get(s))return s;a=o.next()}},this.handleTopMoveEndCapture=i=>{if(this._isScrolling=!1,this.lastTargetTouchFallback=void 0,!!gg(i)){if(!this.monitor.isDragging()||this.monitor.didDrop()){this.moveStartSourceIds=void 0;return}i.cancelable&&i.preventDefault(),this._mouseClientOffset={},this.uninstallSourceNodeRemovalObserver(),this.actions.drop(),this.actions.endDrag()}},this.handleCancelOnEscape=i=>{i.key==="Escape"&&this.monitor.isDragging()&&(this._mouseClientOffset={},this.uninstallSourceNodeRemovalObserver(),this.actions.endDrag())},this.options=new dg(n,r),this.actions=t.getActions(),this.monitor=t.getMonitor(),this.sourceNodes=new Map,this.sourcePreviewNodes=new Map,this.sourcePreviewNodeOptions=new Map,this.targetNodes=new Map,this.listenerTypes=[],this._mouseClientOffset={},this._isScrolling=!1,this.options.enableMouseEvents&&this.listenerTypes.push(Ee.mouse),this.options.enableTouchEvents&&this.listenerTypes.push(Ee.touch),this.options.enableKeyboardEvents&&this.listenerTypes.push(Ee.keyboard)}}const Tg=function(t,r={},n={}){return new St(t,r,n)};var Q=function(){return Q=Object.assign||function(t){for(var r,n=1,i=arguments.length;n<i;n++){r=arguments[n];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(t[o]=r[o])}return t},Q.apply(this,arguments)};function q(e,t,r){if(r||arguments.length===2)for(var n=0,i=t.length,o;n<i;n++)(o||!(n in t))&&(o||(o=Array.prototype.slice.call(t,0,n)),o[n]=t[n]);return e.concat(o||Array.prototype.slice.call(t))}function Sg(e){var t=e.isVisible,r=e.ease,n=r===void 0?"easeIn":r,i=e.duration,o=e.variants,a=o===void 0?{open:{opacity:1,height:"auto"},close:{opacity:0,height:0}}:o,s=e.children,u=Yp({polyfill:hd}),l=u[0],c=u[1].height,d=m.useState(t),h=d[0],f=d[1],v=m.useState(t),p=v[0],g=v[1],y=m.useState(!1),b=y[0],T=y[1],D=function(){T(!1),t||f(!1)};return m.useEffect(function(){T(!0),t?f(!0):g(!1)},[t]),m.useEffect(function(){h&&g(!0)},[c]),N.createElement(Wp.div,{style:b?{overflow:"hidden"}:void 0,onAnimationComplete:D,initial:p?"open":"close",animate:p?"open":"close",inherit:!1,variants:a,transition:{ease:n,duration:Dg(c,i)}},N.createElement("div",{ref:l},h&&s))}function Dg(e,t){if(t)return t;if(!e)return 0;var r=e/36;return Math.round((4+10*Math.pow(r,.25)+r/5)*10)/1500}var wg=function(e,t){return e.text>t.text?1:e.text<t.text?-1:0},ot=function(e,t){return e.find(function(r){return r.id===t})},Du=function(e,t,r){if(r===0)return!1;var n=e.find(function(i){return i.id===r});return n===void 0?!1:n.parent===t?!0:Du(e,t,n.parent)},ai=function(e){return e.id!==void 0&&e.parent!==void 0&&e.text!==void 0},Ce=function(e,t,r){var n=r.tree,i=r.rootId,o=r.canDrop;if(e===null){if(t===i)return!0;var a=n.find(function(c){return c.id===t});return!!(a&&a.droppable)}else{var s=ai(e)?e.id:null;if(o){var u=o(s,t);if(u!==void 0)return u}if(s===t)return!1;var l=n.find(function(d){return d.id===s}),a=n.find(function(d){return d.id===t});return l===void 0||s===null?t===i||!!(a!=null&&a.droppable):a===void 0?l.parent!==0:l.parent===t||!a.droppable?!1:!Du(n,s,t)}},Eg=function(e,t,r){return e.map(function(n){return n.id===t?Q(Q({},n),{parent:r}):n})},wu=function(e,t,r){if(r===0)return 0;var n=e.filter(function(i){return i.parent===t});return n[r]?e.findIndex(function(i){return i.id===n[r].id}):e.findIndex(function(i){return i.id===n[r-1].id})+1},Cg=function(e,t){return e.findIndex(function(r){return r.id===t})},Eu=function(e,t,r,n){var i=Cg(e,t),o=wu(e,r,n);return o=o>i?o-1:o,[i,o]},Og=function(e,t,r){var n=t<0?e.length+t:t;if(n>=0&&n<e.length){var i=r<0?e.length+r:r,o=e.splice(t,1)[0];e.splice(i,0,o)}},xg=function(e,t,r,n){var i=Eu(e,t,r,n),o=i[0],a=i[1],s=q([],e,!0);return Og(s,o,a),s.map(function(u){return u.id===t?Q(Q({},u),{parent:r}):u})},Ig=function(e,t){var r=e.getBoundingClientRect(),n=r.top+r.height/2;return t>n?"down":"up"},On=function(e,t){var r="",n=0;return e.forEach(function(i,o){var a,s=Ig(i,((a=t.getClientOffset())===null||a===void 0?void 0:a.y)||0);r===""?r=s:r!==s&&(r=s,n=o),o===e.length-1&&s==="down"&&(n=o+1)}),n},Fo=function(e,t,r){var n=t.closest('[role="list"]'),i=n==null?void 0:n.querySelectorAll(':scope > [role="listitem"]');return i?On(i,r):null},Pg=function(e,t,r){var n=e.getBoundingClientRect(),i=r.dropTargetOffset,o=n.top+i,a=n.bottom-i;return t>a?"lower":t<o?"upper":"middle"},xn=function(e,t,r,n){var i;if(!t)return null;if(e===null){var o=t.querySelectorAll(':scope > [role="listitem"]');return{id:n.rootId,index:On(o,r)}}var a=r.getItem(),s=t.querySelector('[role="list"]'),u=Pg(t,((i=r.getClientOffset())===null||i===void 0?void 0:i.y)||0,n);if(s){if(u==="upper")if(Ce(a,e.parent,n)){var l=Fo(e,t,r);return l===null?null:{id:e.parent,index:l}}else return{id:e.id,index:0};var o=s.querySelectorAll(':scope > [role="listitem"]');return{id:e.id,index:On(o,r)}}else{if(u==="middle")return{id:e.id,index:0};if(Ce(a,e.parent,n)){var l=Fo(e,t,r);return l===null?null:{id:e.parent,index:l}}return null}},Rg=function(e){return e===void 0&&(e={}),{backends:[{id:"html5",backend:Wc,options:e.html5,transition:cg},{id:"touch",backend:Tg,options:e.touch||{enableMouseEvents:!0},preview:!0,transition:lg}]}},or=function(e,t){return e.some(function(r){return r.parent===t})},Cu=m.createContext({}),Mg=function(e){var t=Bg(e.tree,e.initialOpen),r=t[0],n=t[1],i=n.handleToggle,o=n.handleCloseAll,a=n.handleOpenAll,s=n.handleOpen,u=n.handleClose;m.useImperativeHandle(e.treeRef,function(){return{open:function(f){return s(f,e.onChangeOpen)},close:function(f){return u(f,e.onChangeOpen)},openAll:function(){return a(e.onChangeOpen)},closeAll:function(){return o(e.onChangeOpen)}}});var l=ge().getMonitor(),c=e.canDrop,d=e.canDrag,h=Q(Q({extraAcceptTypes:[],listComponent:"ul",listItemComponent:"li",placeholderComponent:"li",sort:!0,insertDroppableFirst:!0,enableAnimateExpand:!1,dropTargetOffset:0,initialOpen:!1},e),{openIds:r,onDrop:function(f,v,p){if(f){var g={dragSourceId:f.id,dropTargetId:v,dragSource:f,dropTarget:ot(e.tree,v),monitor:l},y=e.tree;if(ot(y,f.id)||(y=q(q([],y,!0),[f],!1)),e.sort===!1){var b=Eu(y,f.id,v,p),T=b[1];g.destinationIndex=T,g.relativeIndex=p,e.onDrop(xg(y,f.id,v,p),g);return}e.onDrop(Eg(y,f.id,v),g)}else{var g={dropTargetId:v,dropTarget:ot(e.tree,v),monitor:l};e.sort===!1&&(g.destinationIndex=wu(e.tree,v,p),g.relativeIndex=p),e.onDrop(e.tree,g)}},canDrop:c?function(f,v){return c(e.tree,{dragSourceId:f??void 0,dropTargetId:v,dragSource:l.getItem(),dropTarget:ot(e.tree,v),monitor:l})}:void 0,canDrag:d?function(f){return d(ot(e.tree,f))}:void 0,onToggle:function(f){return i(f,e.onChangeOpen)}});return N.createElement(Cu.Provider,{value:h},e.children)},Ou=m.createContext({}),Ag={isLock:!1},Lg=function(e){var t=m.useState(Ag.isLock),r=t[0],n=t[1];return N.createElement(Ou.Provider,{value:{isLock:r,lock:function(){return n(!0)},unlock:function(){return n(!1)}}},e.children)},Lt=m.createContext({}),Kt={dropTargetId:void 0,index:void 0},Vg=function(e){var t=m.useState(Kt.dropTargetId),r=t[0],n=t[1],i=m.useState(Kt.index),o=i[0],a=i[1],s=function(l,c){n(l),a(c)},u=function(){n(Kt.dropTargetId),a(Kt.index)};return N.createElement(Lt.Provider,{value:{dropTargetId:r,index:o,showPlaceholder:s,hidePlaceholder:u}},e.children)},Ng=function(e){return N.createElement(Mg,Q({},e),N.createElement(Lg,null,N.createElement(Vg,null,e.children)))},_g=function(e){var t=m.useContext(Ou);m.useEffect(function(){if(e.current){var r=e.current,n=function(c){var d=c.target;(d instanceof HTMLInputElement||d instanceof HTMLTextAreaElement)&&t.lock()},i=function(c){var d=c.target;(d instanceof HTMLInputElement||d instanceof HTMLTextAreaElement)&&t.unlock()},o=function(c){return n(c)},a=function(c){return i(c)},s=function(c){return n(c)},u=function(c){return i(c)},l=new MutationObserver(function(){document.activeElement===document.body&&t.unlock()});return l.observe(r,{subtree:!0,childList:!0}),r.addEventListener("mouseover",o),r.addEventListener("mouseout",a),r.addEventListener("focusin",s),r.addEventListener("focusout",u),function(){l.disconnect(),r.removeEventListener("mouseover",o),r.removeEventListener("mouseout",a),r.removeEventListener("focusin",s),r.removeEventListener("focusout",u)}}},[e,t]),m.useEffect(function(){var r;(r=e.current)===null||r===void 0||r.setAttribute("draggable",t.isLock?"false":"true")},[e,t.isLock])},Mr={TREE_ITEM:Symbol()},xu=null,Iu=function(e){var t=e.target;if(t instanceof HTMLElement){var r=t.closest('[role="listitem"]');e.currentTarget===r&&(xu=r)}},jo=function(e){return Iu(e)},ko=function(e){return Iu(e)},Fg=function(e,t){var r=Oe();m.useEffect(function(){var s=t.current;return s==null||s.addEventListener("dragstart",jo),s==null||s.addEventListener("touchstart",ko,{passive:!0}),function(){s==null||s.removeEventListener("dragstart",jo),s==null||s.removeEventListener("touchstart",ko)}},[t]);var n=wc({type:Mr.TREE_ITEM,item:function(s){var u=Q({ref:t},e);return r.onDragStart&&r.onDragStart(u,s),u},end:function(s,u){var l=s;r.onDragEnd&&r.onDragEnd(l,u)},canDrag:function(){var s=r.canDrag;return xu!==t.current?!1:s?s(e.id):!0},collect:function(s){return{isDragging:s.isDragging()}}}),i=n[0].isDragging,o=n[1],a=n[2];return[i,o,a]},jg=function(e){var t=Oe(),r=m.useContext(Lt),n=Ra({accept:q([Mr.TREE_ITEM],t.extraAcceptTypes,!0),drop:function(u,l){var c=t.rootId,d=t.onDrop,h=r.dropTargetId,f=r.index;l.isOver({shallow:!0})&&h!==void 0&&f!==void 0&&d(ai(u)?u:null,c,f),r.hidePlaceholder()},canDrop:function(u,l){var c=t.rootId;return l.isOver({shallow:!0})?u===void 0?!1:Ce(u,c,t):!1},hover:function(u,l){if(l.isOver({shallow:!0})){var c=t.rootId,d=r.dropTargetId,h=r.index,f=r.showPlaceholder,v=r.hidePlaceholder,p=xn(null,e.current,l,t);if(p===null||!Ce(u,c,t)){v();return}(p.id!==d||p.index!==h)&&f(p.id,p.index)}},collect:function(u){var l=u.getItem();return{isOver:u.isOver({shallow:!0})&&u.canDrop(),dragSource:l}}}),i=n[0],o=i.isOver,a=i.dragSource,s=n[1];return[o,a,s]},kg=function(e,t){var r=Oe(),n=m.useContext(Lt),i=Ra({accept:q([Mr.TREE_ITEM],r.extraAcceptTypes,!0),drop:function(l,c){var d=n.dropTargetId,h=n.index;c.isOver({shallow:!0})&&d!==void 0&&h!==void 0&&r.onDrop(ai(l)?l:null,d,h),n.hidePlaceholder()},canDrop:function(l,c){if(c.isOver({shallow:!0})){var d=xn(e,t.current,c,r);return d===null?!1:Ce(l,d.id,r)}return!1},hover:function(l,c){if(c.isOver({shallow:!0})){var d=n.dropTargetId,h=n.index,f=n.showPlaceholder,v=n.hidePlaceholder,p=xn(e,t.current,c,r);if(p===null||!Ce(l,p.id,r)){v();return}(p.id!==d||p.index!==h)&&f(p.id,p.index)}},collect:function(l){var c=l.getItem();return{isOver:l.isOver({shallow:!0})&&l.canDrop(),dragSource:c}}}),o=i[0],a=o.isOver,s=o.dragSource,u=i[1];return[a,s,u]},Bg=function(e,t){var r=m.useMemo(function(){return t===!0?e.filter(function(d){return or(e,d.id)}).map(function(d){return d.id}):Array.isArray(t)?t:[]},[t]),n=m.useState(r),i=n[0],o=n[1];m.useEffect(function(){return o(r)},[t]);var a=function(d,h){var f=i.includes(d)?i.filter(function(v){return v!==d}):q(q([],i,!0),[d],!1);o(f),h&&h(f)},s=function(d){o([]),d&&d([])},u=function(d){var h=e.filter(function(f){return or(e,f.id)}).map(function(f){return f.id});o(h),d&&d(h)},l=function(d,h){var f=[];if(Array.isArray(d)){var v=e.filter(function(p){return d.includes(p.id)&&or(e,p.id)});f=q(q([],i,!0),v.map(function(p){return p.id}),!0).filter(function(p,g,y){return y.indexOf(p)===g})}else f=i.includes(d)?i:q(q([],i,!0),[d],!1);o(f),h&&h(f)},c=function(d,h){var f=i.filter(function(v){return Array.isArray(d)?!d.includes(v):v!==d});o(f),h&&h(f)};return[i,{handleToggle:a,handleCloseAll:s,handleOpenAll:u,handleOpen:l,handleClose:c}]},Hg=function(){return Ec(function(e){var t=e.getItemType();return{item:e.getItem(),clientOffset:e.getClientOffset(),isDragging:e.isDragging()&&t===Mr.TREE_ITEM}})},Oe=function(){var e=m.useContext(Cu);if(!e)throw new Error("useTreeContext must be used under TreeProvider");return e},zg=function(e,t){var r=Oe(),n=r.rootId,i=r.rootProps,o=r.classes,a=(o==null?void 0:o.container)||"";return t&&(o!=null&&o.dropTarget)&&(a="".concat(a," ").concat(o.dropTarget)),e===n&&(o!=null&&o.root)&&(a="".concat(a," ").concat(o.root)),e===n&&(i!=null&&i.className)&&(a="".concat(a," ").concat(i.className)),a=a.trim(),a},Ug=function(e,t,r){t.current?r(t):r(e),m.useEffect(function(){t.current?r(t):r(e)},[t.current])},$g=function(e){var t=Oe(),r=m.useContext(Lt),n=m.useRef(null),i=m.useRef(null),o=t.tree.find(function(A){return A.id===e.id}),a=t.openIds,s=t.classes,u=t.enableAnimateExpand,l=a.includes(e.id),c=Fg(o,n),d=c[0],h=c[1],f=c[2],v=kg(o,n),p=v[0],g=v[1],y=v[2];Ug(n,i,h),Ce(g,e.id,t)&&y(n),m.useEffect(function(){t.dragPreviewRender?f(qc(),{captureDraggingState:!0}):i.current&&f(n)},[f,t.dragPreviewRender]),_g(n);var b=function(){return t.onToggle(o.id)},T=t.listItemComponent,D=(s==null?void 0:s.listItem)||"";p&&(s!=null&&s.dropTarget)&&(D="".concat(D," ").concat(s.dropTarget)),d&&(s!=null&&s.draggingSource)&&(D="".concat(D," ").concat(s.draggingSource));var w=t.canDrag?t.canDrag(e.id):!0,x=r.dropTargetId===e.id,M={depth:e.depth,isOpen:l,isDragging:d,isDropTarget:x,draggable:w,hasChild:or(t.tree,e.id),containerRef:n,handleRef:i,onToggle:b};return N.createElement(T,{ref:n,className:D,role:"listitem"},t.render(o,M),u&&M.hasChild&&N.createElement(Sg,{isVisible:l},N.createElement(In,{parentId:e.id,depth:e.depth+1})),!u&&M.hasChild&&l&&N.createElement(In,{parentId:e.id,depth:e.depth+1}))},Bo=function(e){var t=Oe(),r=t.placeholderRender,n=t.placeholderComponent,i=t.classes,o=m.useContext(Lt),a=ge(),s=a.getMonitor(),u=s.getItem();if(!r||!u)return null;var l=e.dropTargetId===o.dropTargetId&&(e.index===o.index||e.index===void 0&&e.listCount===o.index);return l?N.createElement(n,{className:(i==null?void 0:i.placeholder)||""},r(u,{depth:e.depth})):null},In=function(e){var t=Oe(),r=m.useRef(null),n=t.tree.filter(function(p){return p.parent===e.parentId}),i=n,o=typeof t.sort=="function"?t.sort:wg;if(t.insertDroppableFirst){var a=n.filter(function(p){return p.droppable}),s=n.filter(function(p){return!p.droppable});t.sort===!1?i=q(q([],a,!0),s,!0):(a=a.sort(o),s=s.sort(o),i=q(q([],a,!0),s,!0))}else t.sort!==!1&&(i=n.sort(o));var u=jg(r),l=u[0],c=u[1],d=u[2];e.parentId===t.rootId&&Ce(c,t.rootId,t)&&d(r);var h=zg(e.parentId,l),f=t.rootProps||{},v=t.listComponent;return N.createElement(v,Q({ref:r,role:"list"},f,{className:h}),i.map(function(p,g){return N.createElement(N.Fragment,{key:p.id},N.createElement(Bo,{depth:e.depth,listCount:i.length,dropTargetId:e.parentId,index:g}),N.createElement($g,{id:p.id,depth:e.depth}))}),N.createElement(Bo,{depth:e.depth,listCount:i.length,dropTargetId:e.parentId}))},qg={height:"100%",left:0,pointerEvents:"none",position:"fixed",top:0,width:"100%",zIndex:100},Wg=function(e){var t=e.clientOffset;if(!t)return{};var r=t.x,n=t.y,i="translate(".concat(r,"px, ").concat(n,"px)");return{pointerEvents:"none",transform:i}},Gg=function(){var e=Oe(),t=Hg(),r=t.isDragging,n=t.clientOffset;return!r||!n?null:N.createElement("div",{style:qg},N.createElement("div",{style:Wg(t)},e.dragPreviewRender&&e.dragPreviewRender(t)))};function Yg(e,t){return N.createElement(Ng,Q({},e,{treeRef:t}),e.dragPreviewRender&&N.createElement(Gg,null),N.createElement(In,{parentId:e.rootId,depth:0}))}var Xg=m.forwardRef(Yg);const Kg="_tree_1lv9u_1",Zg="_toggle_1lv9u_4",Jg="_dropTarget_1lv9u_11",Qg="_draggingSource_1lv9u_14",em="_placeholderContainer_1lv9u_17",tm="_placeholder_1lv9u_17",$e={tree:Kg,toggle:Zg,dropTarget:Jg,draggingSource:Qg,placeholderContainer:em,placeholder:tm},Pn=({node:e,depth:t,isOpen:r,onToggle:n,hasChild:i,draggable:o,icons:a})=>{const{id:s,data:u}=e,{active:l,testId:c,onClick:d,actions:h=[]}=u,f=v=>{v.stopPropagation(),n(s)};return _.jsx("div",{className:Vu(fe.item,fe.action,l?fe.active:"",t>0?fe.indented:""),style:{marginInlineStart:t*24},"data-testid":c,onClick:v=>{d?d(v):i&&f(v)},children:_.jsxs("div",{className:fe.itemHeader,children:[i&&_.jsx("div",{className:$e.toggle,children:_.jsx(ya,{basic:!0,colored:r?!0:Nu.MUTED,small:!0,round:!0,icon:r?(a==null?void 0:a.collapse)||Lr.COLLAPSE:(a==null?void 0:a.expand)||Lr.EXPAND,onClick:f})}),o&&_.jsx("div",{className:fe.drag,children:_.jsx(Ru,{icon:Lr.DRAG})}),_.jsx(_u,{item:u}),_.jsx("div",{className:fe.right,children:_.jsx("div",{className:fe.actions,children:_.jsx(ju,{actions:h})})})]})})};try{Pn.displayName="TreeItem",Pn.__docgenInfo={description:"",displayName:"TreeItem",props:{node:{defaultValue:null,description:"",name:"node",required:!0,type:{name:"NodeModel<any>"}},depth:{defaultValue:null,description:"",name:"depth",required:!0,type:{name:"number"}},isOpen:{defaultValue:null,description:"",name:"isOpen",required:!0,type:{name:"boolean"}},onToggle:{defaultValue:null,description:"",name:"onToggle",required:!0,type:{name:"(id: TStringOrNumber) => void"}},hasChild:{defaultValue:null,description:"",name:"hasChild",required:!0,type:{name:"boolean"}},draggable:{defaultValue:null,description:"",name:"draggable",required:!1,type:{name:"boolean"}},icons:{defaultValue:null,description:"",name:"icons",required:!1,type:{name:"{ expand: ReactNode; collapse: ReactNode; }"}}}}}catch{}const Rn=({depth:e})=>_.jsx("div",{className:$e.placeholder,style:{left:e*24}});try{Rn.displayName="TreePlaceholder",Rn.__docgenInfo={description:"",displayName:"TreePlaceholder",props:{depth:{defaultValue:null,description:"",name:"depth",required:!0,type:{name:"number"}}}}}catch{}const Je=({list:e,draggable:t=!1,onListReorder:r,onChangeOpen:n,testId:i,isInitialOpen:o=!1,treeRef:a,itemHasChild:s,onItemToggle:u,icons:l})=>{var f;const c=v=>{if(r){const p=v.map(({id:g,parent:y,droppable:b,data:T})=>({id:g,parent:y,droppable:b,...T}));r(p)}},d=v=>{n&&n(v)},h=(f=e==null?void 0:e.items)==null?void 0:f.map(({id:v,droppable:p,parent:g,name:y,...b})=>({id:v,text:y,droppable:p,parent:g,data:{name:y,...b}}));return _.jsxs("div",{"data-testid":i,children:[e.name&&!e.noHeader&&_.jsx(Fu,{name:e.name,actions:e.actions}),_.jsx("div",{className:fe.list,children:_.jsx(rc,{backend:ug,options:Rg(),context:window,children:_.jsx(Xg,{ref:a,tree:h,sort:!1,insertDroppableFirst:!1,canDrag:()=>t,canDrop:(v,{dragSource:p,dropTargetId:g})=>{if((p==null?void 0:p.parent)===g)return!0},rootId:0,render:(v,{depth:p,isOpen:g,onToggle:y,hasChild:b})=>_.jsx(Pn,{hasChild:s?s(v):b,node:v,depth:p,isOpen:g,onToggle:()=>{u==null||u(v,!g),y()},draggable:t,icons:l}),onDrop:c,onChangeOpen:d,dropTargetOffset:5,placeholderRender:(v,{depth:p})=>_.jsx(Rn,{depth:p}),placeholderComponent:"div",listComponent:"div",listItemComponent:"div",classes:{root:$e.tree,draggingSource:$e.draggingSource,dropTarget:$e.dropTarget,placeholder:$e.placeholderContainer},initialOpen:o})})})]})};try{Je.displayName="Tree",Je.__docgenInfo={description:"",displayName:"Tree",props:{list:{defaultValue:null,description:"",name:"list",required:!0,type:{name:"ITreeListProps"}},draggable:{defaultValue:{value:"false"},description:"",name:"draggable",required:!1,type:{name:"boolean"}},onListReorder:{defaultValue:null,description:"",name:"onListReorder",required:!1,type:{name:"((newList: any[]) => void)"}},onChangeOpen:{defaultValue:null,description:"",name:"onChangeOpen",required:!1,type:{name:"((id: TStringOrNumber[]) => void)"}},testId:{defaultValue:null,description:"",name:"testId",required:!1,type:{name:"string"}},isInitialOpen:{defaultValue:{value:"false"},description:"",name:"isInitialOpen",required:!1,type:{name:"boolean | string[] | number[]"}},treeRef:{defaultValue:null,description:"",name:"treeRef",required:!1,type:{name:"RefObject<any>"}},itemHasChild:{defaultValue:null,description:"",name:"itemHasChild",required:!1,type:{name:"((node: NodeModel<any>) => boolean)"}},onItemToggle:{defaultValue:null,description:"",name:"onItemToggle",required:!1,type:{name:"((node: NodeModel<any>, isOpen: boolean) => void)"}},icons:{defaultValue:null,description:"",name:"icons",required:!1,type:{name:"{ expand: ReactNode; collapse: ReactNode; }"}}}}}catch{}const Ne={name:"Animals",items:[{id:1,parent:0,droppable:!0,name:"Mammals",onClick:()=>console.log("Test")},{id:2,parent:1,droppable:!0,name:"Cats"},{id:3,parent:1,droppable:!0,name:"Dogs"},{id:4,parent:0,droppable:!0,name:"Amphibians"},{id:5,parent:4,droppable:!0,name:"Frogs"},{id:6,parent:0,droppable:!0,name:"Reptiles",active:!0}]},rm={...Ne,header:{actions:[{label:"Add",primary:!0,icon:"add",onClick:()=>{}}]},items:Ne.items.map(e=>({...e,actions:[{label:"Delete",icon:"delete",onClick:()=>{}}]}))},nm={...Ne,items:Ne.items.map(e=>({...e,droppable:e.parent===0,details:e.parent===0?"Droppable":"Not droppable"}))},im={...Ne,items:Ne.items.map(e=>({...e,parent:0,droppable:!1}))},Vm={title:"Basic/Tree",component:Je,args:{list:Ne}},xe=e=>_.jsx(Je,{...e}),Zt=xe.bind({}),at=xe.bind({});at.args={list:rm};const st=xe.bind({});st.args={draggable:!0};const qe=xe.bind({});qe.args={draggable:!0,list:nm};qe.parameters={docs:{description:{story:"Use the `droppable` prop to specify which items can have other items dropped into them."}}};const ut=xe.bind({});ut.args={draggable:!0,list:im};const lt=xe.bind({});lt.args={isInitialOpen:!0};const ct=xe.bind({});ct.args={onChangeOpen:e=>console.log("onChangeOpen here",e)};const Jt=()=>{const[e,t]=m.useState([{id:1,parent:0,droppable:!0,name:"Mammals"},{id:2,parent:1,droppable:!0,name:"Cats"},{id:3,parent:1,droppable:!0,name:"Dogs"},{id:4,parent:0,droppable:!0,name:"Amphibians"},{id:5,parent:4,droppable:!0,name:"Frogs"},{id:6,parent:0,droppable:!0,name:"Reptiles"}]),r=()=>{const i={id:Math.max(...e.map(o=>o.id))+1,parent:0,droppable:!0,name:"New Item"};t([i].concat(e))},n={name:"Animals",actions:[{label:"Add",primary:!0,icon:"add",onClick:()=>r()}],items:e};return _.jsx(Je,{list:n,draggable:!0,onListReorder:t})},om=[{id:1,parent:0,droppable:!0,name:"Mammals",onClick:()=>console.log("Test")},{id:4,parent:0,droppable:!0,name:"Amphibians"},{id:6,parent:0,droppable:!0,name:"Reptiles",active:!0}],am=[{id:2,parent:1,droppable:!0,name:"Cats"},{id:3,parent:1,droppable:!0,name:"Dogs"},{id:5,parent:4,droppable:!0,name:"Frogs"}],Qt=()=>{const[e,t]=m.useState(om),[r,n]=m.useState({}),i=m.useRef(0);m.useEffect(()=>()=>clearTimeout(i.current),[]);const o=l=>l.parent===0,a=m.useCallback((l,c)=>{n(d=>({...d,[l.id]:{isOpen:c,isLoading:c}})),c&&(console.log("Loading"),i.current=window.setTimeout(()=>{console.log("Loaded"),t(d=>d.filter(h=>h.parent!==l.id).concat(am.filter(h=>h.parent===l.id))),n(d=>({...d,[l.id]:{isOpen:c,isLoading:!1}}))},1e3))},[]),s=m.useMemo(()=>Object.keys(r).filter(l=>r[+l].isOpen).map(l=>{const c=r[+l];return{id:`${l}_extra`,parent:+l,name:c.isLoading?_.jsx(Bu,{muted:!0,children:"Loading..."}):_.jsx(ya,{label:"Load more...",onClick:()=>console.log(`Load more for parent ${l}`)})}}),[r]),u={name:"Animals",items:e.concat(s)};return _.jsx(Je,{list:u,itemHasChild:o,onItemToggle:a})},dt=xe.bind({});dt.args={icons:{expand:_.jsx(Mu,{}),collapse:_.jsx(Au,{})}};var Ho,zo,Uo;Zt.parameters={...Zt.parameters,docs:{...(Ho=Zt.parameters)==null?void 0:Ho.docs,source:{originalSource:`args => <Tree
|
|
7
7
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
8
8
|
{...args} />`,...(Uo=(zo=Zt.parameters)==null?void 0:zo.docs)==null?void 0:Uo.source}}};var $o,qo,Wo;at.parameters={...at.parameters,docs:{...($o=at.parameters)==null?void 0:$o.docs,source:{originalSource:`args => <Tree
|
|
9
9
|
// eslint-disable-next-line react/jsx-props-no-spreading
|