@dartcom/ui-kit 2.7.0 → 2.7.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/drag-list/drag-list.js +3 -3
- package/dist/cjs/components/drag-list/drag-list.js.map +1 -1
- package/dist/cjs/components/drag-list/draggable/draggable.js +1 -0
- package/dist/cjs/components/drag-list/draggable/draggable.js.map +1 -1
- package/dist/esm/components/drag-list/drag-list.js +1 -1
- package/dist/esm/components/drag-list/drag-list.js.map +1 -1
- package/dist/esm/components/drag-list/draggable/draggable.js +1 -1
- package/dist/esm/components/drag-list/draggable/draggable.js.map +1 -1
- package/dist/esm/types/components/drag-list/drag-list.d.ts +1 -1
- package/dist/esm/types/components/drag-list/drag-list.d.ts.map +1 -1
- package/dist/esm/types/components/drag-list/drag-list.stories.d.ts.map +1 -1
- package/dist/esm/types/components/drag-list/draggable/draggable.d.ts.map +1 -1
- package/dist/esm/types/components/drag-list/draggable/types.d.ts +2 -2
- package/dist/esm/types/components/drag-list/draggable/types.d.ts.map +1 -1
- package/dist/esm/types/components/drag-list/types.d.ts +2 -2
- package/dist/esm/types/components/drag-list/types.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -8,7 +8,7 @@ var sortable_esm = require('../../node_modules/@dnd-kit/sortable/dist/sortable.e
|
|
|
8
8
|
var list = require('../list/list.js');
|
|
9
9
|
var draggable = require('./draggable/draggable.js');
|
|
10
10
|
|
|
11
|
-
function DragList({ items, getItem, getId, onDragEnd, sx, draggableSx, }) {
|
|
11
|
+
function DragList({ items, getItem, getId, onDragEnd, sx, title, draggableSx, }) {
|
|
12
12
|
const sensors = core_esm.useSensors(core_esm.useSensor(core_esm.PointerSensor, {
|
|
13
13
|
activationConstraint: {
|
|
14
14
|
distance: 8,
|
|
@@ -20,9 +20,9 @@ function DragList({ items, getItem, getId, onDragEnd, sx, draggableSx, }) {
|
|
|
20
20
|
const newIndex = items.findIndex((item) => getId(item) === over?.id);
|
|
21
21
|
const newItems = sortable_esm.arrayMove(items, oldIndex, newIndex);
|
|
22
22
|
onDragEnd(newItems);
|
|
23
|
-
}, children: jsxRuntime.jsx(sortable_esm.SortableContext, { items: items.map(getId), strategy: sortable_esm.verticalListSortingStrategy, children: jsxRuntime.jsx(list["default"], { items: items, sx: sx, getKey: getId, getContent: (item) => {
|
|
23
|
+
}, children: jsxRuntime.jsx(sortable_esm.SortableContext, { items: items.map(getId), strategy: sortable_esm.verticalListSortingStrategy, children: jsxRuntime.jsx(list["default"], { items: items, sx: sx, title: title, getKey: getId, getContent: (item, index) => {
|
|
24
24
|
const id = getId(item);
|
|
25
|
-
return (jsxRuntime.jsx(draggable["default"], { id: id, sx: draggableSx, children: getItem(item) }, id));
|
|
25
|
+
return (jsxRuntime.jsx(draggable["default"], { id: id, sx: draggableSx, children: getItem(item, index) }, id));
|
|
26
26
|
} }) }) }));
|
|
27
27
|
}
|
|
28
28
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drag-list.js","sources":["../../../../src/components/drag-list/drag-list.tsx"],"sourcesContent":["import {\r\n closestCenter,\r\n DndContext,\r\n PointerSensor,\r\n useSensor,\r\n useSensors,\r\n} from '@dnd-kit/core';\r\nimport {\r\n arrayMove,\r\n SortableContext,\r\n verticalListSortingStrategy,\r\n} from '@dnd-kit/sortable';\r\n\r\nimport { List } from '../list';\r\n\r\nimport Draggable from './draggable';\r\nimport { DragListProps } from './types';\r\n\r\nfunction DragList<T>({\r\n items,\r\n getItem,\r\n getId,\r\n onDragEnd,\r\n sx,\r\n draggableSx,\r\n}: DragListProps<T>) {\r\n const sensors = useSensors(\r\n useSensor(PointerSensor, {\r\n activationConstraint: {\r\n distance: 8,\r\n },\r\n }),\r\n );\r\n\r\n return (\r\n <DndContext\r\n sensors={sensors}\r\n collisionDetection={closestCenter}\r\n onDragEnd={(event) => {\r\n const { active, over } = event;\r\n\r\n const oldIndex = items.findIndex((item) => getId(item) === active.id);\r\n const newIndex = items.findIndex((item) => getId(item) === over?.id);\r\n\r\n const newItems = arrayMove(items, oldIndex, newIndex);\r\n\r\n onDragEnd(newItems);\r\n }}>\r\n <SortableContext\r\n items={items.map(getId)}\r\n strategy={verticalListSortingStrategy}>\r\n <List\r\n items={items}\r\n sx={sx}\r\n getKey={getId}\r\n getContent={(item) => {\r\n const id = getId(item);\r\n\r\n return (\r\n <Draggable key={id} id={id} sx={draggableSx}>\r\n {getItem(item)}\r\n </Draggable>\r\n );\r\n }}\r\n />\r\n </SortableContext>\r\n </DndContext>\r\n );\r\n}\r\n\r\nexport default DragList;\r\n"],"names":["useSensors","useSensor","PointerSensor","_jsx","DndContext","closestCenter","arrayMove","SortableContext","verticalListSortingStrategy","List","Draggable"],"mappings":";;;;;;;;;;AAkBA,SAAS,QAAQ,CAAI,EACnB,KAAK,EACL,OAAO,EACP,KAAK,EACL,SAAS,EACT,EAAE,EACF,WAAW,GACM,EAAA;AACjB,IAAA,MAAM,OAAO,GAAGA,mBAAU,CACxBC,kBAAS,CAACC,sBAAa,EAAE;AACvB,QAAA,oBAAoB,EAAE;AACpB,YAAA,QAAQ,EAAE,CAAC;AACZ,SAAA;AACF,KAAA,CAAC,CACH,CAAC;AAEF,IAAA,QACEC,cAAC,CAAAC,mBAAU,EACT,EAAA,OAAO,EAAE,OAAO,EAChB,kBAAkB,EAAEC,sBAAa,EACjC,SAAS,EAAE,CAAC,KAAK,KAAI;AACnB,YAAA,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;YAE/B,MAAM,QAAQ,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,IAAI,KAAK,KAAK,CAAC,IAAI,CAAC,KAAK,MAAM,CAAC,EAAE,CAAC,CAAC;YACtE,MAAM,QAAQ,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,IAAI,KAAK,KAAK,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE,EAAE,CAAC,CAAC;YAErE,MAAM,QAAQ,GAAGC,sBAAS,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;YAEtD,SAAS,CAAC,QAAQ,CAAC,CAAC;AACtB,SAAC,YACDH,cAAC,CAAAI,4BAAe,
|
|
1
|
+
{"version":3,"file":"drag-list.js","sources":["../../../../src/components/drag-list/drag-list.tsx"],"sourcesContent":["import {\r\n closestCenter,\r\n DndContext,\r\n PointerSensor,\r\n useSensor,\r\n useSensors,\r\n} from '@dnd-kit/core';\r\nimport {\r\n arrayMove,\r\n SortableContext,\r\n verticalListSortingStrategy,\r\n} from '@dnd-kit/sortable';\r\n\r\nimport { List } from '../list';\r\n\r\nimport Draggable from './draggable';\r\nimport { DragListProps } from './types';\r\n\r\nfunction DragList<T>({\r\n items,\r\n getItem,\r\n getId,\r\n onDragEnd,\r\n sx,\r\n title,\r\n draggableSx,\r\n}: DragListProps<T>) {\r\n const sensors = useSensors(\r\n useSensor(PointerSensor, {\r\n activationConstraint: {\r\n distance: 8,\r\n },\r\n }),\r\n );\r\n\r\n return (\r\n <DndContext\r\n sensors={sensors}\r\n collisionDetection={closestCenter}\r\n onDragEnd={(event) => {\r\n const { active, over } = event;\r\n\r\n const oldIndex = items.findIndex((item) => getId(item) === active.id);\r\n const newIndex = items.findIndex((item) => getId(item) === over?.id);\r\n\r\n const newItems = arrayMove(items, oldIndex, newIndex);\r\n\r\n onDragEnd(newItems);\r\n }}>\r\n <SortableContext\r\n items={items.map(getId)}\r\n strategy={verticalListSortingStrategy}>\r\n <List\r\n items={items}\r\n sx={sx}\r\n title={title}\r\n getKey={getId}\r\n getContent={(item, index) => {\r\n const id = getId(item);\r\n\r\n return (\r\n <Draggable key={id} id={id} sx={draggableSx}>\r\n {getItem(item, index)}\r\n </Draggable>\r\n );\r\n }}\r\n />\r\n </SortableContext>\r\n </DndContext>\r\n );\r\n}\r\n\r\nexport default DragList;\r\n"],"names":["useSensors","useSensor","PointerSensor","_jsx","DndContext","closestCenter","arrayMove","SortableContext","verticalListSortingStrategy","List","Draggable"],"mappings":";;;;;;;;;;AAkBA,SAAS,QAAQ,CAAI,EACnB,KAAK,EACL,OAAO,EACP,KAAK,EACL,SAAS,EACT,EAAE,EACF,KAAK,EACL,WAAW,GACM,EAAA;AACjB,IAAA,MAAM,OAAO,GAAGA,mBAAU,CACxBC,kBAAS,CAACC,sBAAa,EAAE;AACvB,QAAA,oBAAoB,EAAE;AACpB,YAAA,QAAQ,EAAE,CAAC;AACZ,SAAA;AACF,KAAA,CAAC,CACH,CAAC;AAEF,IAAA,QACEC,cAAC,CAAAC,mBAAU,EACT,EAAA,OAAO,EAAE,OAAO,EAChB,kBAAkB,EAAEC,sBAAa,EACjC,SAAS,EAAE,CAAC,KAAK,KAAI;AACnB,YAAA,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;YAE/B,MAAM,QAAQ,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,IAAI,KAAK,KAAK,CAAC,IAAI,CAAC,KAAK,MAAM,CAAC,EAAE,CAAC,CAAC;YACtE,MAAM,QAAQ,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,IAAI,KAAK,KAAK,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE,EAAE,CAAC,CAAC;YAErE,MAAM,QAAQ,GAAGC,sBAAS,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;YAEtD,SAAS,CAAC,QAAQ,CAAC,CAAC;AACtB,SAAC,YACDH,cAAC,CAAAI,4BAAe,IACd,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,EACvB,QAAQ,EAAEC,wCAA2B,EACrC,QAAA,EAAAL,cAAA,CAACM,eAAI,EACH,EAAA,KAAK,EAAE,KAAK,EACZ,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,KAAK,EACb,UAAU,EAAE,CAAC,IAAI,EAAE,KAAK,KAAI;AAC1B,oBAAA,MAAM,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC;oBAEvB,QACEN,eAACO,oBAAS,EAAA,EAAU,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,WAAW,YACxC,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC,EADP,EAAA,EAAE,CAEN,EACZ;AACJ,iBAAC,EACD,CAAA,EAAA,CACc,EACP,CAAA,EACb;AACJ;;;;"}
|
|
@@ -25,6 +25,7 @@ const Draggable = ({ id, sx, children, }) => {
|
|
|
25
25
|
...(isDragging ? sx?.dragging : {}),
|
|
26
26
|
transform: utilities_esm.CSS.Translate.toString(transform),
|
|
27
27
|
transition,
|
|
28
|
+
cursor: 'pointer',
|
|
28
29
|
};
|
|
29
30
|
return (jsxRuntime.jsx(Box["default"], { ref: setNodeRef, style: style, ...listeners, ...attributes, children: children }));
|
|
30
31
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"draggable.js","sources":["../../../../../src/components/drag-list/draggable/draggable.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { useDraggable } from '@dnd-kit/core';\r\nimport { useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable';\r\nimport { CSS } from '@dnd-kit/utilities';\r\nimport { Box } from '@mui/material';\r\n\r\nimport { DraggableProps } from './types';\r\n\r\nconst Draggable: React.FC<React.PropsWithChildren<DraggableProps>> = ({\r\n id,\r\n sx,\r\n children,\r\n}) => {\r\n const { isDragging } = useDraggable({\r\n id,\r\n });\r\n\r\n const { attributes, listeners, setNodeRef, transform, transition } =\r\n useSortable({\r\n id,\r\n strategy: verticalListSortingStrategy,\r\n transition: {\r\n duration: 300,\r\n easing: 'cubic-bezier(0.25, 1, 0.5, 1)',\r\n },\r\n });\r\n\r\n const style
|
|
1
|
+
{"version":3,"file":"draggable.js","sources":["../../../../../src/components/drag-list/draggable/draggable.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { useDraggable } from '@dnd-kit/core';\r\nimport { useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable';\r\nimport { CSS } from '@dnd-kit/utilities';\r\nimport { Box } from '@mui/material';\r\n\r\nimport { DraggableProps } from './types';\r\n\r\nconst Draggable: React.FC<React.PropsWithChildren<DraggableProps>> = ({\r\n id,\r\n sx,\r\n children,\r\n}) => {\r\n const { isDragging } = useDraggable({\r\n id,\r\n });\r\n\r\n const { attributes, listeners, setNodeRef, transform, transition } =\r\n useSortable({\r\n id,\r\n strategy: verticalListSortingStrategy,\r\n transition: {\r\n duration: 300,\r\n easing: 'cubic-bezier(0.25, 1, 0.5, 1)',\r\n },\r\n });\r\n\r\n const style = {\r\n ...sx?.default,\r\n ...(isDragging ? sx?.dragging : {}),\r\n transform: CSS.Translate.toString(transform),\r\n transition,\r\n cursor: 'pointer',\r\n } as React.CSSProperties;\r\n\r\n return (\r\n <Box ref={setNodeRef} style={style} {...listeners} {...attributes}>\r\n {children}\r\n </Box>\r\n );\r\n};\r\n\r\nexport default Draggable;\r\n"],"names":["useDraggable","useSortable","verticalListSortingStrategy","CSS","_jsx","Box"],"mappings":";;;;;;;;;;AAQM,MAAA,SAAS,GAAsD,CAAC,EACpE,EAAE,EACF,EAAE,EACF,QAAQ,GACT,KAAI;AACH,IAAA,MAAM,EAAE,UAAU,EAAE,GAAGA,qBAAY,CAAC;QAClC,EAAE;AACH,KAAA,CAAC,CAAC;AAEH,IAAA,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,GAChEC,wBAAW,CAAC;QACV,EAAE;AACF,QAAA,QAAQ,EAAEC,wCAA2B;AACrC,QAAA,UAAU,EAAE;AACV,YAAA,QAAQ,EAAE,GAAG;AACb,YAAA,MAAM,EAAE,+BAA+B;AACxC,SAAA;AACF,KAAA,CAAC,CAAC;AAEL,IAAA,MAAM,KAAK,GAAG;QACZ,GAAG,EAAE,EAAE,OAAO;AACd,QAAA,IAAI,UAAU,GAAG,EAAE,EAAE,QAAQ,GAAG,EAAE,CAAC;QACnC,SAAS,EAAEC,iBAAG,CAAC,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC;QAC5C,UAAU;AACV,QAAA,MAAM,EAAE,SAAS;KACK,CAAC;AAEzB,IAAA,QACEC,cAAC,CAAAC,cAAG,IAAC,GAAG,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,EAAA,GAAM,SAAS,EAAM,GAAA,UAAU,YAC9D,QAAQ,EAAA,CACL,EACN;AACJ;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as t}from"react/jsx-runtime";import{useSensors as e,useSensor as
|
|
1
|
+
import{jsx as t}from"react/jsx-runtime";import{useSensors as e,useSensor as i,DndContext as o,closestCenter as r,PointerSensor as n}from"../../node_modules/@dnd-kit/core/dist/core.esm.js";import{arrayMove as s,SortableContext as d,verticalListSortingStrategy as a}from"../../node_modules/@dnd-kit/sortable/dist/sortable.esm.js";import m from"../list/list.js";import l from"./draggable/draggable.js";function c({items:c,getItem:g,getId:f,onDragEnd:x,sx:p,title:u,draggableSx:b}){const j=e(i(n,{activationConstraint:{distance:8}}));return t(o,{sensors:j,collisionDetection:r,onDragEnd:t=>{const{active:e,over:i}=t,o=c.findIndex(t=>f(t)===e.id),r=c.findIndex(t=>f(t)===i?.id),n=s(c,o,r);x(n)},children:t(d,{items:c.map(f),strategy:a,children:t(m,{items:c,sx:p,title:u,getKey:f,getContent:(e,i)=>{const o=f(e);return t(l,{id:o,sx:b,children:g(e,i)},o)}})})})}export{c as default};
|
|
2
2
|
//# sourceMappingURL=drag-list.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drag-list.js","sources":["../../../../src/components/drag-list/drag-list.tsx"],"sourcesContent":["import {\r\n closestCenter,\r\n DndContext,\r\n PointerSensor,\r\n useSensor,\r\n useSensors,\r\n} from '@dnd-kit/core';\r\nimport {\r\n arrayMove,\r\n SortableContext,\r\n verticalListSortingStrategy,\r\n} from '@dnd-kit/sortable';\r\n\r\nimport { List } from '../list';\r\n\r\nimport Draggable from './draggable';\r\nimport { DragListProps } from './types';\r\n\r\nfunction DragList<T>({\r\n items,\r\n getItem,\r\n getId,\r\n onDragEnd,\r\n sx,\r\n draggableSx,\r\n}: DragListProps<T>) {\r\n const sensors = useSensors(\r\n useSensor(PointerSensor, {\r\n activationConstraint: {\r\n distance: 8,\r\n },\r\n }),\r\n );\r\n\r\n return (\r\n <DndContext\r\n sensors={sensors}\r\n collisionDetection={closestCenter}\r\n onDragEnd={(event) => {\r\n const { active, over } = event;\r\n\r\n const oldIndex = items.findIndex((item) => getId(item) === active.id);\r\n const newIndex = items.findIndex((item) => getId(item) === over?.id);\r\n\r\n const newItems = arrayMove(items, oldIndex, newIndex);\r\n\r\n onDragEnd(newItems);\r\n }}>\r\n <SortableContext\r\n items={items.map(getId)}\r\n strategy={verticalListSortingStrategy}>\r\n <List\r\n items={items}\r\n sx={sx}\r\n getKey={getId}\r\n getContent={(item) => {\r\n const id = getId(item);\r\n\r\n return (\r\n <Draggable key={id} id={id} sx={draggableSx}>\r\n {getItem(item)}\r\n </Draggable>\r\n );\r\n }}\r\n />\r\n </SortableContext>\r\n </DndContext>\r\n );\r\n}\r\n\r\nexport default DragList;\r\n"],"names":["DragList","items","getItem","getId","onDragEnd","sx","draggableSx","sensors","useSensors","useSensor","PointerSensor","activationConstraint","distance","_jsx","DndContext","collisionDetection","closestCenter","event","active","over","oldIndex","findIndex","item","id","newIndex","newItems","arrayMove","SortableContext","map","strategy","verticalListSortingStrategy","children","List","getKey","getContent","Draggable"],"mappings":"+YAkBA,SAASA,GAAYC,MACnBA,EAAKC,QACLA,EAAOC,MACPA,EAAKC,UACLA,EAASC,GACTA,EAAEC,
|
|
1
|
+
{"version":3,"file":"drag-list.js","sources":["../../../../src/components/drag-list/drag-list.tsx"],"sourcesContent":["import {\r\n closestCenter,\r\n DndContext,\r\n PointerSensor,\r\n useSensor,\r\n useSensors,\r\n} from '@dnd-kit/core';\r\nimport {\r\n arrayMove,\r\n SortableContext,\r\n verticalListSortingStrategy,\r\n} from '@dnd-kit/sortable';\r\n\r\nimport { List } from '../list';\r\n\r\nimport Draggable from './draggable';\r\nimport { DragListProps } from './types';\r\n\r\nfunction DragList<T>({\r\n items,\r\n getItem,\r\n getId,\r\n onDragEnd,\r\n sx,\r\n title,\r\n draggableSx,\r\n}: DragListProps<T>) {\r\n const sensors = useSensors(\r\n useSensor(PointerSensor, {\r\n activationConstraint: {\r\n distance: 8,\r\n },\r\n }),\r\n );\r\n\r\n return (\r\n <DndContext\r\n sensors={sensors}\r\n collisionDetection={closestCenter}\r\n onDragEnd={(event) => {\r\n const { active, over } = event;\r\n\r\n const oldIndex = items.findIndex((item) => getId(item) === active.id);\r\n const newIndex = items.findIndex((item) => getId(item) === over?.id);\r\n\r\n const newItems = arrayMove(items, oldIndex, newIndex);\r\n\r\n onDragEnd(newItems);\r\n }}>\r\n <SortableContext\r\n items={items.map(getId)}\r\n strategy={verticalListSortingStrategy}>\r\n <List\r\n items={items}\r\n sx={sx}\r\n title={title}\r\n getKey={getId}\r\n getContent={(item, index) => {\r\n const id = getId(item);\r\n\r\n return (\r\n <Draggable key={id} id={id} sx={draggableSx}>\r\n {getItem(item, index)}\r\n </Draggable>\r\n );\r\n }}\r\n />\r\n </SortableContext>\r\n </DndContext>\r\n );\r\n}\r\n\r\nexport default DragList;\r\n"],"names":["DragList","items","getItem","getId","onDragEnd","sx","title","draggableSx","sensors","useSensors","useSensor","PointerSensor","activationConstraint","distance","_jsx","DndContext","collisionDetection","closestCenter","event","active","over","oldIndex","findIndex","item","id","newIndex","newItems","arrayMove","SortableContext","map","strategy","verticalListSortingStrategy","children","List","getKey","getContent","index","Draggable"],"mappings":"+YAkBA,SAASA,GAAYC,MACnBA,EAAKC,QACLA,EAAOC,MACPA,EAAKC,UACLA,EAASC,GACTA,EAAEC,MACFA,EAAKC,YACLA,IAEA,MAAMC,EAAUC,EACdC,EAAUC,EAAe,CACvBC,qBAAsB,CACpBC,SAAU,MAKhB,OACEC,EAACC,EACC,CAAAP,QAASA,EACTQ,mBAAoBC,EACpBb,UAAYc,IACV,MAAMC,OAAEA,EAAMC,KAAEA,GAASF,EAEnBG,EAAWpB,EAAMqB,UAAWC,GAASpB,EAAMoB,KAAUJ,EAAOK,IAC5DC,EAAWxB,EAAMqB,UAAWC,GAASpB,EAAMoB,KAAUH,GAAMI,IAE3DE,EAAWC,EAAU1B,EAAOoB,EAAUI,GAE5CrB,EAAUsB,aAEZZ,EAACc,GACC3B,MAAOA,EAAM4B,IAAI1B,GACjB2B,SAAUC,EACVC,SAAAlB,EAACmB,EACC,CAAAhC,MAAOA,EACPI,GAAIA,EACJC,MAAOA,EACP4B,OAAQ/B,EACRgC,WAAY,CAACZ,EAAMa,KACjB,MAAMZ,EAAKrB,EAAMoB,GAEjB,OACET,EAACuB,EAAS,CAAUb,GAAIA,EAAInB,GAAIE,WAC7BL,EAAQqB,EAAMa,IADDZ,SAS9B"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as t}from"react/jsx-runtime";import{useDraggable as i}from"../../../node_modules/@dnd-kit/core/dist/core.esm.js";import{useSortable as
|
|
1
|
+
import{jsx as t}from"react/jsx-runtime";import{useDraggable as i}from"../../../node_modules/@dnd-kit/core/dist/core.esm.js";import{useSortable as r,verticalListSortingStrategy as e}from"../../../node_modules/@dnd-kit/sortable/dist/sortable.esm.js";import{CSS as s}from"../../../node_modules/@dnd-kit/utilities/dist/utilities.esm.js";import o from"../../../node_modules/@mui/material/esm/Box/Box.js";const n=({id:n,sx:d,children:m})=>{const{isDragging:a}=i({id:n}),{attributes:l,listeners:u,setNodeRef:f,transform:c,transition:g}=r({id:n,strategy:e,transition:{duration:300,easing:"cubic-bezier(0.25, 1, 0.5, 1)"}}),p={...d?.default,...a?d?.dragging:{},transform:s.Translate.toString(c),transition:g,cursor:"pointer"};return t(o,{ref:f,style:p,...u,...l,children:m})};export{n as default};
|
|
2
2
|
//# sourceMappingURL=draggable.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"draggable.js","sources":["../../../../../src/components/drag-list/draggable/draggable.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { useDraggable } from '@dnd-kit/core';\r\nimport { useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable';\r\nimport { CSS } from '@dnd-kit/utilities';\r\nimport { Box } from '@mui/material';\r\n\r\nimport { DraggableProps } from './types';\r\n\r\nconst Draggable: React.FC<React.PropsWithChildren<DraggableProps>> = ({\r\n id,\r\n sx,\r\n children,\r\n}) => {\r\n const { isDragging } = useDraggable({\r\n id,\r\n });\r\n\r\n const { attributes, listeners, setNodeRef, transform, transition } =\r\n useSortable({\r\n id,\r\n strategy: verticalListSortingStrategy,\r\n transition: {\r\n duration: 300,\r\n easing: 'cubic-bezier(0.25, 1, 0.5, 1)',\r\n },\r\n });\r\n\r\n const style
|
|
1
|
+
{"version":3,"file":"draggable.js","sources":["../../../../../src/components/drag-list/draggable/draggable.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { useDraggable } from '@dnd-kit/core';\r\nimport { useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable';\r\nimport { CSS } from '@dnd-kit/utilities';\r\nimport { Box } from '@mui/material';\r\n\r\nimport { DraggableProps } from './types';\r\n\r\nconst Draggable: React.FC<React.PropsWithChildren<DraggableProps>> = ({\r\n id,\r\n sx,\r\n children,\r\n}) => {\r\n const { isDragging } = useDraggable({\r\n id,\r\n });\r\n\r\n const { attributes, listeners, setNodeRef, transform, transition } =\r\n useSortable({\r\n id,\r\n strategy: verticalListSortingStrategy,\r\n transition: {\r\n duration: 300,\r\n easing: 'cubic-bezier(0.25, 1, 0.5, 1)',\r\n },\r\n });\r\n\r\n const style = {\r\n ...sx?.default,\r\n ...(isDragging ? sx?.dragging : {}),\r\n transform: CSS.Translate.toString(transform),\r\n transition,\r\n cursor: 'pointer',\r\n } as React.CSSProperties;\r\n\r\n return (\r\n <Box ref={setNodeRef} style={style} {...listeners} {...attributes}>\r\n {children}\r\n </Box>\r\n );\r\n};\r\n\r\nexport default Draggable;\r\n"],"names":["Draggable","id","sx","children","isDragging","useDraggable","attributes","listeners","setNodeRef","transform","transition","useSortable","strategy","verticalListSortingStrategy","duration","easing","style","default","dragging","CSS","Translate","toString","cursor","_jsx","Box","ref"],"mappings":"+YAQM,MAAAA,EAA+D,EACnEC,KACAC,KACAC,eAEA,MAAMC,WAAEA,GAAeC,EAAa,CAClCJ,QAGIK,WAAEA,EAAUC,UAAEA,EAASC,WAAEA,EAAUC,UAAEA,EAASC,WAAEA,GACpDC,EAAY,CACVV,KACAW,SAAUC,EACVH,WAAY,CACVI,SAAU,IACVC,OAAQ,mCAIRC,EAAQ,IACTd,GAAIe,WACHb,EAAaF,GAAIgB,SAAW,GAChCT,UAAWU,EAAIC,UAAUC,SAASZ,GAClCC,aACAY,OAAQ,WAGV,OACEC,EAACC,GAAIC,IAAKjB,EAAYQ,MAAOA,KAAWT,KAAeD,WACpDH"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { DragListProps } from './types';
|
|
2
|
-
declare function DragList<T>({ items, getItem, getId, onDragEnd, sx, draggableSx, }: DragListProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
declare function DragList<T>({ items, getItem, getId, onDragEnd, sx, title, draggableSx, }: DragListProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
export default DragList;
|
|
4
4
|
//# sourceMappingURL=drag-list.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drag-list.d.ts","sourceRoot":"","sources":["../../../../../src/components/drag-list/drag-list.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAExC,iBAAS,QAAQ,CAAC,CAAC,EAAE,EACnB,KAAK,EACL,OAAO,EACP,KAAK,EACL,SAAS,EACT,EAAE,EACF,WAAW,GACZ,EAAE,aAAa,CAAC,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"drag-list.d.ts","sourceRoot":"","sources":["../../../../../src/components/drag-list/drag-list.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAExC,iBAAS,QAAQ,CAAC,CAAC,EAAE,EACnB,KAAK,EACL,OAAO,EACP,KAAK,EACL,SAAS,EACT,EAAE,EACF,KAAK,EACL,WAAW,GACZ,EAAE,aAAa,CAAC,CAAC,CAAC,2CA4ClB;AAED,eAAe,QAAQ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drag-list.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/drag-list/drag-list.stories.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"drag-list.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/drag-list/drag-list.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAOvD,OAAO,EAAE,QAAQ,EAAE,MAAM,GAAG,CAAC;AAE7B,KAAK,aAAa,GAAG,OAAO,QAAQ,CAAC;AAErC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,aAAa,CAG7B,CAAC;AAEF,KAAK,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAC;AAmBrC,eAAO,MAAM,IAAI,EAAE,KAmClB,CAAC;AAEF,eAAe,IAAI,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"draggable.d.ts","sourceRoot":"","sources":["../../../../../../src/components/drag-list/draggable/draggable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,
|
|
1
|
+
{"version":3,"file":"draggable.d.ts","sourceRoot":"","sources":["../../../../../../src/components/drag-list/draggable/draggable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAgChE,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
|
@@ -3,8 +3,8 @@ import { StringOrNumber } from '@/types';
|
|
|
3
3
|
export type DraggableProps = {
|
|
4
4
|
id: StringOrNumber;
|
|
5
5
|
sx?: {
|
|
6
|
-
default?:
|
|
7
|
-
dragging?:
|
|
6
|
+
default?: SxProps;
|
|
7
|
+
dragging?: SxProps;
|
|
8
8
|
};
|
|
9
9
|
};
|
|
10
10
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../src/components/drag-list/draggable/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAExC,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,MAAM,cAAc,GAAG;IAC3B,EAAE,EAAE,cAAc,CAAC;IAEnB,EAAE,CAAC,EAAE;QACH,OAAO,CAAC,EAAE,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../src/components/drag-list/draggable/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAExC,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,MAAM,cAAc,GAAG;IAC3B,EAAE,EAAE,cAAc,CAAC;IAEnB,EAAE,CAAC,EAAE;QACH,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACpB,CAAC;CACH,CAAC"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { StringOrNumber } from '@/types';
|
|
2
2
|
import { List } from '../list';
|
|
3
3
|
import Draggable from './draggable';
|
|
4
|
-
export type DragListProps<T> = Pick<React.ComponentProps<typeof List>, 'sx'> & {
|
|
4
|
+
export type DragListProps<T> = Pick<React.ComponentProps<typeof List>, 'sx' | 'title'> & {
|
|
5
5
|
items: T[];
|
|
6
|
-
getItem: (item: T) => React.ReactNode;
|
|
6
|
+
getItem: (item: T, index: number) => React.ReactNode;
|
|
7
7
|
getId: (item: T) => StringOrNumber;
|
|
8
8
|
onDragEnd: (items: T[]) => void;
|
|
9
9
|
draggableSx?: React.ComponentProps<typeof Draggable>['sx'];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/components/drag-list/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE/B,OAAO,SAAS,MAAM,aAAa,CAAC;AAEpC,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI,IAAI,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/components/drag-list/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE/B,OAAO,SAAS,MAAM,aAAa,CAAC;AAEpC,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI,IAAI,CACjC,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,EACjC,IAAI,GAAG,OAAO,CACf,GAAG;IACF,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,OAAO,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;IAErD,KAAK,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,cAAc,CAAC;IACnC,SAAS,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC;IAEhC,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,CAAC,IAAI,CAAC,CAAC;CAC5D,CAAC"}
|