openstack-uicore-foundation/lib/components/mui/drag-n-drop-list.js

ui reactjs components for openstack marketing site

!function(e,r){"object"==typeof exports&&"object"==typeof module?module.exports=r():"function"==typeof define&&define.amd?define("openstack-uicore-foundation",[],r):"object"==typeof exports?exports["openstack-uicore-foundation"]=r():e["openstack-uicore-foundation"]=r()}(this,(()=>(()=>{"use strict";var e={};(()=>{e.n=r=>{var t=r&&r.__esModule?()=>r.default:()=>r;return e.d(t,{a:t}),t}})(),(()=>{e.d=(r,t)=>{for(var n in t)e.o(t,n)&&!e.o(r,n)&&Object.defineProperty(r,n,{enumerable:!0,get:t[n]})}})(),(()=>{e.o=(e,r)=>Object.prototype.hasOwnProperty.call(e,r)})(),(()=>{e.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}})();var r={};e.r(r),e.d(r,{default:()=>v});const t=require("@babel/runtime/helpers/defineProperty");var n=e.n(t);const o=require("react");var i=e.n(o);const s=require("prop-types");var c=e.n(s);const a=require("@dnd-kit/core"),d=require("@dnd-kit/sortable"),u=require("@mui/material"),p=require("@dnd-kit/utilities");function f(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}function l(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?f(Object(t),!0).forEach((function(r){n()(e,r,t[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):f(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}const b=({id:e,item:r,index:t,renderItem:n})=>{const{attributes:o,listeners:s,setNodeRef:c,transform:a,transition:f,isDragging:b}=(0,d.useSortable)({id:e});return i().createElement(u.Box,{ref:c,style:{transform:p.CSS.Transform.toString(a),transition:[f,"background 0.2s ease"].filter(Boolean).join(", "),zIndex:b?1:"auto",position:"relative"},sx:{background:b?"#f0f0f0":"inherit"}},n(r,t,{isDragging:b,dragHandleProps:l(l({},s),o)}))};b.propTypes={id:c().string.isRequired,item:c().object.isRequired,index:c().number,renderItem:c().func.isRequired};const y=b;function O(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}function m(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?O(Object(t),!0).forEach((function(r){n()(e,r,t[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):O(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}const g=(e,r,t)=>void 0!==e[t]&&null!==e[t]?String(e[t]):`new-${r}`,j=({items:e,onReorder:r,renderItem:t,idKey:n="id",updateOrderKey:o="order"})=>{const s=(0,a.useSensors)((0,a.useSensor)(a.PointerSensor),(0,a.useSensor)(a.KeyboardSensor,{coordinateGetter:d.sortableKeyboardCoordinates}));return i().createElement(a.DndContext,{sensors:s,collisionDetection:a.closestCenter,onDragEnd:({active:t,over:i})=>{if(!i||t.id===i.id)return;const s=e.findIndex(((e,r)=>g(e,r,n)===t.id)),c=e.findIndex(((e,r)=>g(e,r,n)===i.id));if(-1===s||-1===c)return;const a=(0,d.arrayMove)(e,s,c).map(((e,r)=>m(m({},e),{},{[o]:r+1})));r(a,{active:t,over:i})}},i().createElement(d.SortableContext,{items:e.map(((e,r)=>g(e,r,n))),strategy:d.verticalListSortingStrategy},i().createElement(u.Box,{sx:{width:"100%"}},e.map(((e,r)=>i().createElement(y,{key:g(e,r,n),id:g(e,r,n),item:e,index:r,renderItem:t}))))))};j.propTypes={items:c().array.isRequired,onReorder:c().func.isRequired,renderItem:c().func.isRequired,idKey:c().string,updateOrderKey:c().string};const v=j;return r})()));
//# sourceMappingURL=drag-n-drop-list.js.map