@react-querybuilder/dnd
Version:
Drag-and-drop-enabled version of react-querybuilder (DnD-library-agnostic)
2 lines • 8.83 kB
JavaScript
const e=require("./dndLogic-Bisek_7m.js"),t=require("./shadowQuery-ChTvVD1v.js");let n=require("react");n=e.c(n);const r=(e,t)=>{let n=e.getBoundingClientRect(),r=n.height/4;return t<n.top+r?`upper`:t>n.bottom-r?`lower`:null},i=(0,n.createContext)({activeDragItem:null,timerCopyMode:!1,timerGroupMode:!1}),a=(e,t,n)=>`drag-${e}-${n}-${t.join(`_`)}`,o=(e,t,n)=>`drop-${e}-${n}-${t.join(`_`)}`,s=s=>{let{draggable:c,dropTargetForElements:l,monitorForElements:u,combine:d}=s;return{DndProvider:({children:a,updateWhileDragging:o,copyModeAfterHoverMs:s,groupModeAfterHoverMs:c})=>{let[l,d]=(0,n.useState)(null),f=(0,n.useRef)(null),p=(0,n.useRef)(null),[m,h]=(0,n.useState)(!1),[g,_]=(0,n.useState)(!1),v=(0,n.useRef)(!1),y=(0,n.useRef)(!1),b=(0,n.useRef)(null),x=(0,n.useRef)(null),S=(0,n.useRef)(null),C=(0,n.useCallback)(()=>{b.current!==null&&(clearTimeout(b.current),b.current=null),x.current!==null&&(clearTimeout(x.current),x.current=null),v.current=!1,y.current=!1,h(!1),_(!1),S.current=null},[]),w=(0,n.useCallback)(e=>{S.current!==e&&(C(),S.current=e,s&&s>0&&(b.current=setTimeout(()=>{v.current=!0,h(!0),b.current=null},s)),c&&c>0&&(x.current=setTimeout(()=>{y.current=!0,_(!0),x.current=null},c)))},[C,s,c]),[T,E]=(0,n.useState)(null),D=(0,n.useRef)(null),O=(0,n.useRef)(void 0),k=(0,n.useRef)(null),A=(0,n.useCallback)((n,r,i)=>{let a=D.current;if(!a||!o)return;let s=k.current;if(s&&s.quadrant===i&&s.targetType===r&&s.targetPath.length===n.length&&s.targetPath.every((e,t)=>e===n[t]))return;k.current={targetPath:n,targetType:r,quadrant:i};let c=v.current||e.s(a.dropEffect===`copy`?`alt`:``)?`copy`:`move`,l=y.current||e.s(`ctrl`),u=t.n({originalQuery:a.originalQuery,draggedItem:f.current,draggedPath:a.draggedPath,targetPath:n,targetType:r,quadrant:i,dropEffect:c,groupItems:l});if(u){let e={...a,shadowQuery:u.shadowQuery,previewPath:u.previewPath,dropEffect:c,groupItems:l};D.current=e,E(e),O.current?.({draggedItem:f.current,shadowQuery:u.shadowQuery,originalQuery:a.originalQuery,previewPath:u.previewPath})}},[o]),j=(0,n.useCallback)(()=>{let e=D.current;if(!e)return;let t=p.current;t&&e.shadowQuery!==e.originalQuery&&t.dispatchQuery(e.shadowQuery),p.current=null,D.current=null,k.current=null,E(null)},[]),M=(0,n.useCallback)(()=>{p.current=null,D.current=null,k.current=null,E(null)},[]);(0,n.useEffect)(()=>{let t=u({onDragStart({source:t}){let n=t.data;if(n.__rqbPath&&n.__rqbSchema){let t=e.a(n.__rqbPath,n.__rqbSchema);if(f.current=t,d(t),o){let e=n.__rqbSchema;p.current=e;let t=e.getQuery(),r={shadowQuery:t,originalQuery:t,draggedPath:n.__rqbPath,previewPath:n.__rqbPath,dropEffect:`move`,groupItems:!1,qbId:e.qbId};D.current=r,E(r)}}},onDrag({location:e}){let t=e.current.dropTargets;if(t.length>0){let e=t[0],n=e.data.__rqbType,r=e.data.__rqbPath;n&&r&&w(`${n}-${r.join(`_`)}`)}else C();if(!o||!D.current||t.length===0)return;let n=t[0],i=n.data.__rqbType,a=n.data.__rqbPath;if(!i||!a)return;let s=i===`ruleGroup`?`upper`:r(n.element,e.current.input.clientY);if(!s)return;let c=f.current;if(!c)return;let l=n.data.__rqbValidate;l&&!l(c)||A(a,i,s)},onDrop({source:t,location:n}){let r=f.current,i=t.data,a=n.current.dropTargets,s=v.current,c=y.current;if(C(),o&&D.current)a.length>0?j():M();else if(r&&a.length>0){let t=a[0].data,n=t.__rqbValidate;if(n?.(r)){let n=t.__rqbGetDropResult,a=n?.();e.o({item:r,dropResult:a,schema:i.__rqbSchema,actions:i.__rqbActions,copyModeModifierKey:i.__rqbCopyModeModifierKey,groupModeModifierKey:i.__rqbGroupModeModifierKey,copyModeOverride:s,groupModeOverride:c,onRuleDrop:i.__rqbOnRuleDrop})}}f.current=null,d(null)}});return()=>{t(),C()}},[o,j,M,A,w,C]);let N=(0,n.useMemo)(()=>({activeDragItem:l,timerCopyMode:m,timerGroupMode:g}),[l,m,g]),P=(0,n.useMemo)(()=>({dragPreviewState:T,updatePreviewPosition:A,commitDrag:j,cancelDrag:M}),[T,A,j,M]);return n.createElement(i.Provider,{value:N},n.createElement(t.r.Provider,{value:P},a))},useRuleDnD:t=>{let{activeDragItem:r,timerCopyMode:s,timerGroupMode:u}=(0,n.useContext)(i),f=(0,n.useRef)(null),p=(0,n.useRef)(null),[m,h]=(0,n.useState)(!1),[g,_]=(0,n.useState)(!1),v=a(`rule`,t.path,t.schema.qbId),y=o(`rule`,t.path,t.schema.qbId),b=(0,n.useRef)(t);b.current=t,(0,n.useEffect)(()=>{let t=f.current,n=p.current;if(!(!t||!n))return d(c({element:t,dragHandle:n,canDrag:()=>!b.current.disabled,getInitialData:()=>({__rqbPath:b.current.path,__rqbSchema:b.current.schema,__rqbActions:b.current.actions,__rqbCopyModeModifierKey:b.current.copyModeModifierKey,__rqbGroupModeModifierKey:b.current.groupModeModifierKey,__rqbOnRuleDrop:b.current.onRuleDrop}),onDragStart:()=>h(!0),onDrop:()=>h(!1)}),l({element:t,getData:()=>({__rqbType:`rule`,__rqbPath:b.current.path,__rqbValidate:t=>{let n=b.current;return e.r({dragging:t,path:n.path,schema:n.schema,canDrop:n.canDrop,groupModeModifierKey:n.groupModeModifierKey,disabled:n.disabled,rule:n.rule})},__rqbGetDropResult:()=>{let t=b.current;return e.t({type:`rule`,path:t.path,schema:t.schema,copyModeModifierKey:t.copyModeModifierKey,groupModeModifierKey:t.groupModeModifierKey})}}),onDragEnter:()=>_(!0),onDragLeave:()=>_(!1),onDrop:()=>_(!1)}))},[t.path,t.schema.qbId,t.disabled]);let x=g&&!!r&&e.r({dragging:r,path:t.path,schema:t.schema,canDrop:t.canDrop,groupModeModifierKey:t.groupModeModifierKey,disabled:t.disabled,rule:t.rule}),S=g&&x,C=g&&!x;return{isDragging:m,dragMonitorId:v,isOver:S,dropMonitorId:y,dndRef:(0,n.useCallback)(e=>{f.current=e},[]),dragRef:(0,n.useCallback)(e=>{p.current=e},[]),dropEffect:s||e.s(t.copyModeModifierKey)?`copy`:`move`,groupItems:u||e.s(t.groupModeModifierKey),dropNotAllowed:C}},useRuleGroupDnD:t=>{let{activeDragItem:r,timerCopyMode:s,timerGroupMode:u}=(0,n.useContext)(i),d=(0,n.useRef)(null),f=(0,n.useRef)(null),p=(0,n.useRef)(null),[m,h]=(0,n.useState)(!1),[g,_]=(0,n.useState)(!1),v=t.disabled||t.path.length===0,y=a(`ruleGroup`,t.path,t.schema.qbId),b=o(`ruleGroup`,t.path,t.schema.qbId),x=(0,n.useRef)(t);x.current=t,(0,n.useEffect)(()=>{let e=d.current,t=f.current;if(!(!e||!t||v))return c({element:e,dragHandle:t,canDrag:()=>!x.current.disabled&&x.current.path.length>0,getInitialData:()=>({__rqbPath:x.current.path,__rqbSchema:x.current.schema,__rqbActions:x.current.actions,__rqbCopyModeModifierKey:x.current.copyModeModifierKey,__rqbGroupModeModifierKey:x.current.groupModeModifierKey,__rqbOnRuleDrop:x.current.onRuleDrop}),onDragStart:()=>h(!0),onDrop:()=>h(!1)})},[v,t.path,t.schema.qbId]),(0,n.useEffect)(()=>{let t=p.current;if(t)return l({element:t,getData:()=>({__rqbType:`ruleGroup`,__rqbPath:x.current.path,__rqbValidate:t=>{let n=x.current;return e.i({dragging:t,path:n.path,schema:n.schema,canDrop:n.canDrop,disabled:n.disabled,ruleGroup:n.ruleGroup})},__rqbGetDropResult:()=>{let t=x.current;return e.t({type:`ruleGroup`,path:t.path,schema:t.schema,copyModeModifierKey:t.copyModeModifierKey,groupModeModifierKey:t.groupModeModifierKey})}}),onDragEnter:()=>_(!0),onDragLeave:()=>_(!1),onDrop:()=>_(!1)})},[t.path,t.schema.qbId,t.disabled]);let S=g&&!!r&&e.i({dragging:r,path:t.path,schema:t.schema,canDrop:t.canDrop,disabled:t.disabled,ruleGroup:t.ruleGroup}),C=g&&S,w=g&&!S,T=(0,n.useCallback)(e=>{d.current=e},[]),E=(0,n.useCallback)(e=>{p.current=e},[]);return{isDragging:m,dragMonitorId:y,isOver:C,dropMonitorId:b,previewRef:T,dragRef:(0,n.useCallback)(e=>{f.current=e},[]),dropRef:E,dropEffect:s||e.s(t.copyModeModifierKey)?`copy`:`move`,groupItems:u||e.s(t.groupModeModifierKey),dropNotAllowed:w}},useInlineCombinatorDnD:r=>{let{activeDragItem:a,timerCopyMode:s}=(0,n.useContext)(i),{dragPreviewState:c}=(0,n.useContext)(t.r),u=(0,n.useRef)(null),[d,f]=(0,n.useState)(!1),p=o(`inlineCombinator`,r.path,r.schema.qbId),m=c!==null,h=(r.rules??[])[r.path.at(-1)-1],g=(0,n.useRef)(r);g.current=r,(0,n.useEffect)(()=>{let t=u.current;if(!(!t||m))return l({element:t,getData:()=>({__rqbType:`inlineCombinator`,__rqbValidate:t=>{let n=g.current,r=(n.rules??[])[n.path.at(-1)-1];return e.n({dragging:t,path:n.path,schema:n.schema,canDrop:n.canDrop,groupModeModifierKey:n.groupModeModifierKey,hoveringItem:r})},__rqbGetDropResult:()=>{let t=g.current;return e.t({type:`inlineCombinator`,path:t.path,schema:t.schema,copyModeModifierKey:t.copyModeModifierKey,groupModeModifierKey:t.groupModeModifierKey})}}),onDragEnter:()=>f(!0),onDragLeave:()=>f(!1),onDrop:()=>f(!1)})},[r.path,r.schema.qbId,m]);let _=!m&&d&&!!a&&e.n({dragging:a,path:r.path,schema:r.schema,canDrop:r.canDrop,groupModeModifierKey:r.groupModeModifierKey,hoveringItem:h}),v=d&&_,y=!m&&d&&!_;return{dropRef:(0,n.useCallback)(e=>{u.current=e},[]),dropMonitorId:p,isOver:v,dropEffect:s||e.s(r.copyModeModifierKey)?`copy`:`move`,dropNotAllowed:y}}}};Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return s}});
//# sourceMappingURL=pragmatic-dnd-BzgnHYON.js.map