UNPKG

@react-querybuilder/dnd

Version:

Drag-and-drop-enabled version of react-querybuilder (DnD-library-agnostic)

2 lines 8.75 kB
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./dndLogic-Bisek_7m.js"),t=require("./shadowQuery-ChTvVD1v.js"),n=require("./dnd-kit-BT7tvxz7.js"),r=require("./pragmatic-dnd-BzgnHYON.js"),i=require("./react-dnd-toiD3-hw.js");let a=require("react");a=e.c(a);let o=require("react-querybuilder");const s=e=>typeof e==`object`&&!!e&&`DndProvider`in e&&`useRuleDnD`in e&&`useRuleGroupDnD`in e&&`useInlineCombinatorDnD`in e,c=e=>e.getAttribute(`data-rule-id`)??e.getAttribute(`data-testid`)??null,l=e=>{let t=new Map;return{captureFirst:n=>{t=new Map;let r=n.querySelectorAll(e);for(let e of r){let n=c(e);n&&t.set(n,e.getBoundingClientRect())}},playLast:n=>{let r=n.querySelectorAll(e);for(let e of r){let n=c(e);if(!n)continue;let r=t.get(n);if(!r)continue;let i=e.getBoundingClientRect(),a=r.left-i.left,o=r.top-i.top;if(a===0&&o===0)continue;let s=e;s.style.transform=`translate(${a}px, ${o}px)`,s.style.transition=`none`,requestAnimationFrame(()=>{s.style.transition=`transform 150ms ease`,s.style.transform=``;let e=()=>{s.style.transition=``,s.removeEventListener(`transitionend`,e)};s.addEventListener(`transitionend`,e)})}t=new Map}}},{rule:u,ruleGroup:d,combinatorSelector:f}=o.defaultControlElements,p=(0,a.createContext)({baseControls:{rule:u,ruleGroup:d,combinatorSelector:f}}),m=({component:e,...n})=>{let{adapter:r,canDrop:i,copyModeModifierKey:s,copyModeAfterHoverMs:c,groupModeModifierKey:l,groupModeAfterHoverMs:u}=(0,a.useContext)(p),{dragPreviewState:d}=(0,a.useContext)(t.r),f=d!==null,{dropRef:m,dropMonitorId:h,isOver:g}=r.useInlineCombinatorDnD({path:n.path,schema:n.schema,rules:n.rules,canDrop:i,copyModeModifierKey:s??`alt`,copyModeAfterHoverMs:c,groupModeModifierKey:l??`ctrl`,groupModeAfterHoverMs:u}),_=f?!1:g,v=[n.schema.suppressStandardClassnames||o.standardClassnames.betweenRules,_&&!n.schema.classNames.dndOver||!1,_&&!n.schema.suppressStandardClassnames&&o.standardClassnames.dndOver||!1].filter(e=>typeof e==`string`).join(` `);return a.createElement(`div`,{key:`dnd`,ref:m,className:v,"data-dropmonitorid":h,"data-testid":o.TestID.inlineCombinator},a.createElement(e,{...n,testID:o.TestID.combinators}))},h=e=>{let n=(0,a.useContext)(p),{dragPreviewState:r}=(0,a.useContext)(t.r),{adapter:i,canDrop:o,copyModeModifierKey:s,copyModeAfterHoverMs:c,groupModeModifierKey:l,groupModeAfterHoverMs:u,hideDefaultDragPreview:d,onRuleDrop:f}=n,m=!!e.parentDisabled||!!e.disabled,h=i.useRuleDnD({path:e.path,disabled:m,schema:e.schema,actions:e.actions,rule:e.rule,canDrop:o,copyModeModifierKey:s??`alt`,copyModeAfterHoverMs:c,groupModeModifierKey:l??`ctrl`,groupModeAfterHoverMs:u,hideDefaultDragPreview:d,onRuleDrop:f}),g=r?{...h,isDragging:!1,isOver:!1,dropNotAllowed:!1}:h,{rule:_}=n.baseControls;return a.createElement(p.Provider,{value:n},a.createElement(_,{...e,...g}))},g=e=>{let n=(0,a.useContext)(p),{dragPreviewState:r}=(0,a.useContext)(t.r),{adapter:i,canDrop:o,baseControls:{ruleGroup:s},copyModeModifierKey:c,copyModeAfterHoverMs:l,groupModeModifierKey:u,groupModeAfterHoverMs:d,hideDefaultDragPreview:f,onRuleDrop:m}=n,h=(0,a.useMemo)(()=>{if(e.path.length===0&&r){let t=r.shadowQuery;return{...e,ruleGroup:t,rules:t.rules}}return e},[e,r]),g=i.useRuleGroupDnD({disabled:!!h.parentDisabled||!!h.disabled,path:h.path,schema:h.schema,actions:h.actions,ruleGroup:h.ruleGroup,canDrop:o,copyModeModifierKey:c??`alt`,copyModeAfterHoverMs:l,groupModeModifierKey:u??`ctrl`,groupModeAfterHoverMs:d,hideDefaultDragPreview:f,onRuleDrop:m}),_=r?{...g,isDragging:!1,isOver:!1,dropNotAllowed:!1}:g;return a.createElement(s,{...h,..._})},_=e=>{let{controlClassnames:t,controlElements:n,debugMode:r,enableDragAndDrop:i,enableMountQueryChange:s,translations:c}=e,l=(0,o.useMergedContext)({controlClassnames:t,controlElements:n,debugMode:r,enableDragAndDrop:i??!0,enableMountQueryChange:s,translations:c??{}}),{enableDragAndDrop:u}=l,d=b(e.dnd),f=u&&d?`dnd`:`no-dnd`,p=(0,a.useMemo)(()=>({...l,enableDragAndDrop:!1,debugMode:r}),[l,r]),m=(0,a.useMemo)(()=>({...l,enableDragAndDrop:u,debugMode:r}),[l,r,u]);if(!u||!d)return a.createElement(o.QueryBuilderContext.Provider,{key:f,value:p},e.children);let{DndProvider:h}=d;return a.createElement(h,{key:f,debugMode:r,updateWhileDragging:e.updateWhileDragging,copyModeAfterHoverMs:e.copyModeAfterHoverMs,groupModeAfterHoverMs:e.groupModeAfterHoverMs},a.createElement(o.QueryBuilderContext.Provider,{key:f,value:m},a.createElement(v,{dnd:d,canDrop:e.canDrop,copyModeModifierKey:e.copyModeModifierKey,copyModeAfterHoverMs:e.copyModeAfterHoverMs,groupModeModifierKey:e.groupModeModifierKey,groupModeAfterHoverMs:e.groupModeAfterHoverMs,hideDefaultDragPreview:e.hideDefaultDragPreview,updateWhileDragging:e.updateWhileDragging,onDragMove:e.onDragMove,onRuleDrop:e.onRuleDrop},e.children)))},v=e=>{let t=(0,a.useContext)(o.QueryBuilderContext),n=(0,a.useContext)(p),r=b(e.dnd)??n.adapter,i=(0,o.preferAnyProp)(void 0,e.copyModeModifierKey,n.copyModeModifierKey),s=(0,o.preferAnyProp)(void 0,e.groupModeModifierKey,n.groupModeModifierKey),c=(0,o.preferAnyProp)(void 0,e.copyModeAfterHoverMs,n.copyModeAfterHoverMs),l=(0,o.preferAnyProp)(void 0,e.groupModeAfterHoverMs,n.groupModeAfterHoverMs),u=(0,o.preferProp)(!0,e.enableDragAndDrop,t.enableDragAndDrop),d=(0,o.preferProp)(!1,e.debugMode,t.debugMode),f=(0,o.preferProp)(!1,e.hideDefaultDragPreview,n.hideDefaultDragPreview),_=(0,o.preferAnyProp)(void 0,e.canDrop,n.canDrop),v=(0,o.preferProp)(!1,e.updateWhileDragging,n.updateWhileDragging),y=(0,o.preferAnyProp)(void 0,e.onDragMove,n.onDragMove),x=(0,o.preferAnyProp)(void 0,e.onRuleDrop,n.onRuleDrop),S=u&&r?`dnd`:`no-dnd`,C=(0,a.useMemo)(()=>({rule:e.controlElements?.rule??t.controlElements?.rule??n.baseControls.rule,ruleGroup:e.controlElements?.ruleGroup??t.controlElements?.ruleGroup??n.baseControls.ruleGroup,combinatorSelector:e.controlElements?.combinatorSelector??t.controlElements?.combinatorSelector??n.baseControls.combinatorSelector}),[e.controlElements?.combinatorSelector,e.controlElements?.rule,e.controlElements?.ruleGroup,t.controlElements?.combinatorSelector,t.controlElements?.rule,t.controlElements?.ruleGroup,n.baseControls.combinatorSelector,n.baseControls.rule,n.baseControls.ruleGroup]),w=(0,a.useMemo)(()=>({...t,enableDragAndDrop:u,debugMode:d,controlElements:{...t.controlElements,ruleGroup:g,rule:h,inlineCombinator:m}}),[d,u,t]),T=(0,a.useMemo)(()=>({baseControls:C,canDrop:_,copyModeModifierKey:i,copyModeAfterHoverMs:c,groupModeModifierKey:s,groupModeAfterHoverMs:l,hideDefaultDragPreview:f,updateWhileDragging:v,onDragMove:y,onRuleDrop:x,adapter:r}),[C,_,i,c,s,l,f,v,y,x,r]),E=(0,a.useMemo)(()=>({...t,enableDragAndDrop:!1,debugMode:d}),[t,d]);return!u||!r?a.createElement(o.QueryBuilderContext.Provider,{key:S,value:E},e.children):a.createElement(o.QueryBuilderContext.Provider,{key:S,value:w},a.createElement(p.Provider,{value:T},e.children))};let y=!1;const b=e=>{let t=e&&s(e)?e:null,n=(0,a.useMemo)(()=>e&&!s(e)?i.t(e):null,[e]),r=x(t!==null||n!==null);return t??n??r},x=e=>{let[t,n]=(0,a.useState)(null);return(0,a.useEffect)(()=>{if(e)return;let r=!1;return t||(async()=>{let[e,t,a]=await Promise.all([``,`-html5-backend`,`-touch-backend`].map(e=>import(`react-dnd${e}`).catch(()=>null)));if(!r)if(e){let r;if(t&&(!a||a&&!i.n()))r={...e,...t,...a,ReactDndBackend:t.HTML5Backend};else if(a)r={...e,...a,...t,ReactDndBackend:a.TouchBackend};else return;n(()=>i.t(r))}else process.env.NODE_ENV!==`production`&&!y&&(console.error(o.messages.errorEnabledDndWithoutReactDnD),y=!0)})(),()=>{r=!0}},[t,e]),e?null:t},S=e=>{let[t,n]=(0,a.useState)(e??null);return(0,a.useEffect)(()=>{let e=!1;return t||(async()=>{let[t,r,a]=await Promise.all([``,`-html5-backend`,`-touch-backend`].map(e=>import(`react-dnd${e}`).catch(()=>null)));e||(t?r&&(!a||a&&!i.n())?n(()=>({...t,...r,...a,ReactDndBackend:r.HTML5Backend})):a&&n(()=>({...t,...a,...r,ReactDndBackend:a.TouchBackend})):process.env.NODE_ENV!==`production`&&!y&&(console.error(o.messages.errorEnabledDndWithoutReactDnD),y=!0))})(),()=>{e=!0}},[t]),t&&!t.ReactDndBackend&&(t.ReactDndBackend=i.n()?t.TouchBackend??t.HTML5Backend:t.HTML5Backend??t.TouchBackend),t},C=()=>{let{dragPreviewState:e}=(0,a.useContext)(t.r);return e?.shadowQuery};exports.DragPreviewContext=t.r,exports.InlineCombinatorDnD=m,exports.QueryBuilderDnD=_,exports.QueryBuilderDndWithoutProvider=v,exports.RuleDnD=h,exports.RuleGroupDnD=g,exports.computeDestinationFromQuadrant=t.t,exports.computeShadowQuery=t.n,exports.createDndKitAdapter=n.t,exports.createFlipAnimator=l,exports.createPragmaticDndAdapter=r.t,exports.createReactDnDAdapter=i.t,exports.getQuadrant=r.n,exports.isDndAdapter=s,exports.useReactDnD=S,exports.useShadowQuery=C; //# sourceMappingURL=react-querybuilder_dnd.cjs.production.js.map