@contember/react-repeater-dnd-kit 2.1.0-rc.1 → 2.1.0-rc.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.
Files changed (12) hide show
  1. package/dist/development/src/components/RepeaterSortableDragOverlay.cjs +21 -6
  2. package/dist/development/src/components/RepeaterSortableDragOverlay.cjs.map +1 -1
  3. package/dist/development/src/components/RepeaterSortableDragOverlay.js +22 -7
  4. package/dist/development/src/components/RepeaterSortableDragOverlay.js.map +1 -1
  5. package/dist/production/src/components/RepeaterSortableDragOverlay.cjs +8 -1
  6. package/dist/production/src/components/RepeaterSortableDragOverlay.cjs.map +1 -1
  7. package/dist/production/src/components/RepeaterSortableDragOverlay.js +9 -2
  8. package/dist/production/src/components/RepeaterSortableDragOverlay.js.map +1 -1
  9. package/dist/types/components/RepeaterSortableDragOverlay.d.ts.map +1 -1
  10. package/dist/types/tsconfig.tsbuildinfo +1 -1
  11. package/package.json +1 -1
  12. package/src/components/RepeaterSortableDragOverlay.tsx +20 -3
package/dist/development/src/components/RepeaterSortableDragOverlay.cjs CHANGED
@@ -4,6 +4,7 @@ const jsxDevRuntime = require("react/jsx-dev-runtime");
4
4
  const contexts = require("../contexts.cjs");
5
5
  const reactPortal = require("@radix-ui/react-portal");
6
6
  const core = require("@dnd-kit/core");
7
+ const sortable = require("@dnd-kit/sortable");
7
8
  const reactBinding = require("@contember/react-binding");
8
9
  const reactRepeater = require("@contember/react-repeater");
9
10
  const RepeaterSortableDragOverlay = ({ children }) => {
@@ -12,25 +13,39 @@ const RepeaterSortableDragOverlay = ({ children }) => {
12
13
  if (!activeItem) {
13
14
  return null;
14
15
  }
15
- return /* @__PURE__ */ jsxDevRuntime.jsxDEV(reactPortal.Portal, { children: /* @__PURE__ */ jsxDevRuntime.jsxDEV(core.DragOverlay, { children: /* @__PURE__ */ jsxDevRuntime.jsxDEV(reactBinding.AccessorTree, { state: accessorTreeState, children: /* @__PURE__ */ jsxDevRuntime.jsxDEV(reactBinding.Entity, { accessor: activeItem, children: /* @__PURE__ */ jsxDevRuntime.jsxDEV(reactRepeater.RepeaterCurrentEntityContext.Provider, { value: activeItem, children }, void 0, false, {
16
+ return /* @__PURE__ */ jsxDevRuntime.jsxDEV(reactPortal.Portal, { children: /* @__PURE__ */ jsxDevRuntime.jsxDEV(core.DragOverlay, { children: /* @__PURE__ */ jsxDevRuntime.jsxDEV(reactBinding.AccessorTree, { state: accessorTreeState, children: /* @__PURE__ */ jsxDevRuntime.jsxDEV(reactBinding.Entity, { accessor: activeItem, children: /* @__PURE__ */ jsxDevRuntime.jsxDEV(reactRepeater.RepeaterCurrentEntityContext.Provider, { value: activeItem, children: /* @__PURE__ */ jsxDevRuntime.jsxDEV(RepeaterSortableDragOverlayItemContext, { activeItem, children }, void 0, false, {
16
17
  fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
17
- lineNumber: 24,
18
+ lineNumber: 26,
19
+ columnNumber: 8
20
+ }, void 0) }, void 0, false, {
21
+ fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
22
+ lineNumber: 25,
18
23
  columnNumber: 7
19
24
  }, void 0) }, void 0, false, {
20
25
  fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
21
- lineNumber: 23,
26
+ lineNumber: 24,
22
27
  columnNumber: 6
23
28
  }, void 0) }, void 0, false, {
24
29
  fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
25
- lineNumber: 22,
30
+ lineNumber: 23,
26
31
  columnNumber: 5
27
32
  }, void 0) }, void 0, false, {
28
33
  fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
29
- lineNumber: 21,
34
+ lineNumber: 22,
30
35
  columnNumber: 4
31
36
  }, void 0) }, void 0, false, {
32
37
  fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
33
- lineNumber: 20,
38
+ lineNumber: 21,
39
+ columnNumber: 3
40
+ }, void 0);
41
+ };
42
+ const RepeaterSortableDragOverlayItemContext = ({ activeItem, children }) => {
43
+ const sortable$1 = sortable.useSortable({
44
+ id: activeItem.id
45
+ });
46
+ return /* @__PURE__ */ jsxDevRuntime.jsxDEV(contexts.RepeaterSortableItemContext.Provider, { value: sortable$1, children }, void 0, false, {
47
+ fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
48
+ lineNumber: 45,
34
49
  columnNumber: 3
35
50
  }, void 0);
36
51
  };
package/dist/development/src/components/RepeaterSortableDragOverlay.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"RepeaterSortableDragOverlay.cjs","sources":["../../../../../packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx"],"sourcesContent":["import React, { ReactNode } from 'react'\nimport { useRepeaterActiveEntity } from '../contexts'\nimport { Portal } from '@radix-ui/react-portal'\nimport { DragOverlay } from '@dnd-kit/core'\nimport { AccessorTree, Entity, useAccessorTreeState } from '@contember/react-binding'\nimport { RepeaterCurrentEntityContext } from '@contember/react-repeater'\n\n/**\n * Component for rendering the repeater item being dragged.\n */\nexport const RepeaterSortableDragOverlay = ({ children }: {\n\tchildren: ReactNode\n}) => {\n\tconst activeItem = useRepeaterActiveEntity()\n\tconst accessorTreeState = useAccessorTreeState()\n\tif (!activeItem) {\n\t\treturn null\n\t}\n\treturn (\n\t\t<Portal>\n\t\t\t<DragOverlay>\n\t\t\t\t<AccessorTree state={accessorTreeState}>\n\t\t\t\t\t<Entity accessor={activeItem}>\n\t\t\t\t\t\t<RepeaterCurrentEntityContext.Provider value={activeItem}>\n\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t</RepeaterCurrentEntityContext.Provider>\n\t\t\t\t\t</Entity>\n\t\t\t\t</AccessorTree>\n\t\t\t</DragOverlay>\n\t\t</Portal>\n\t)\n}\n"],"names":["useRepeaterActiveEntity","useAccessorTreeState","Portal","jsxDEV","DragOverlay","AccessorTree","Entity","RepeaterCurrentEntityContext","this"],"mappings":";;;;;;;;AAUO,MAAM,8BAA8B,CAAC,EAAE,eAExC;AACL,QAAM,aAAaA,SAAAA,wBAAA;AACnB,QAAM,oBAAoBC,aAAAA,qBAAA;AAC1B,MAAI,CAAC,YAAY;AAChB,WAAO;AAAA,EACR;AACA,8CACEC,YAAAA,QAAA,EACA,UAAAC,8BAAAA,OAACC,KAAAA,eACA,UAAAD,8BAAAA,OAACE,aAAAA,cAAA,EAAa,OAAO,mBACpB,UAAAF,8BAAAA,OAACG,aAAAA,QAAA,EAAO,UAAU,YACjB,UAAAH,8BAAAA,OAACI,cAAAA,6BAA6B,UAA7B,EAAsC,OAAO,YAC5C,SAAA,GADF,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAC,MAEA,EAAA,GAHD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAIA,EAAA,GALD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAMA,EAAA,GAPD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAQA,EAAA,GATD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAUA;AAEF;;"}
1
+ {"version":3,"file":"RepeaterSortableDragOverlay.cjs","sources":["../../../../../packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx"],"sourcesContent":["import React, { ReactNode } from 'react'\nimport { RepeaterSortableItemContext, useRepeaterActiveEntity } from '../contexts'\nimport { Portal } from '@radix-ui/react-portal'\nimport { DragOverlay } from '@dnd-kit/core'\nimport { useSortable } from '@dnd-kit/sortable'\nimport { AccessorTree, Entity, EntityAccessor, useAccessorTreeState } from '@contember/react-binding'\nimport { RepeaterCurrentEntityContext } from '@contember/react-repeater'\n\n/**\n * Component for rendering the repeater item being dragged.\n */\nexport const RepeaterSortableDragOverlay = ({ children }: {\n\tchildren: ReactNode\n}) => {\n\tconst activeItem = useRepeaterActiveEntity()\n\tconst accessorTreeState = useAccessorTreeState()\n\tif (!activeItem) {\n\t\treturn null\n\t}\n\treturn (\n\t\t<Portal>\n\t\t\t<DragOverlay>\n\t\t\t\t<AccessorTree state={accessorTreeState}>\n\t\t\t\t\t<Entity accessor={activeItem}>\n\t\t\t\t\t\t<RepeaterCurrentEntityContext.Provider value={activeItem}>\n\t\t\t\t\t\t\t<RepeaterSortableDragOverlayItemContext activeItem={activeItem}>\n\t\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t\t</RepeaterSortableDragOverlayItemContext>\n\t\t\t\t\t\t</RepeaterCurrentEntityContext.Provider>\n\t\t\t\t\t</Entity>\n\t\t\t\t</AccessorTree>\n\t\t\t</DragOverlay>\n\t\t</Portal>\n\t)\n}\n\nconst RepeaterSortableDragOverlayItemContext = ({ activeItem, children }: {\n\tactiveItem: EntityAccessor\n\tchildren: ReactNode\n}) => {\n\tconst sortable = useSortable({\n\t\tid: activeItem.id,\n\t})\n\treturn (\n\t\t<RepeaterSortableItemContext.Provider value={sortable}>\n\t\t\t{children}\n\t\t</RepeaterSortableItemContext.Provider>\n\t)\n}\n"],"names":["useRepeaterActiveEntity","useAccessorTreeState","jsxDEV","Portal","DragOverlay","AccessorTree","Entity","RepeaterCurrentEntityContext","this","sortable","useSortable","RepeaterSortableItemContext"],"mappings":";;;;;;;;;AAWO,MAAM,8BAA8B,CAAC,EAAE,eAExC;AACL,QAAM,aAAaA,SAAAA,wBAAA;AACnB,QAAM,oBAAoBC,aAAAA,qBAAA;AAC1B,MAAI,CAAC,YAAY;AAChB,WAAO;AAAA,EACR;AACA,SACCC,8BAAAA,OAACC,YAAAA,UACA,UAAAD,8BAAAA,OAACE,KAAAA,aAAA,EACA,+CAACC,aAAAA,cAAA,EAAa,OAAO,mBACpB,UAAAH,8BAAAA,OAACI,qBAAA,EAAO,UAAU,YACjB,UAAAJ,8BAAAA,OAACK,cAAAA,6BAA6B,UAA7B,EAAsC,OAAO,YAC7C,UAAAL,8BAAAA,OAAC,wCAAA,EAAuC,YACtC,SAAA,GADF,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAM,MAEA,EAAA,GAHD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAIA,EAAA,GALD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAMA,EAAA,GAPD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAQA,EAAA,GATD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAUA,EAAA,GAXD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAYA;AAEF;AAEA,MAAM,yCAAyC,CAAC,EAAE,YAAY,eAGxD;AACL,QAAMC,aAAWC,SAAAA,YAAY;AAAA,IAC5B,IAAI,WAAW;AAAA,EAAA,CACf;AACD,8CACEC,qCAA4B,UAA5B,EAAqC,OAAOF,YAC3C,SAAA,GADF,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAD,MAEA;AAEF;;"}
package/dist/development/src/components/RepeaterSortableDragOverlay.js CHANGED
@@ -1,7 +1,8 @@
1
1
  import { jsxDEV } from "react/jsx-dev-runtime";
2
- import { useRepeaterActiveEntity } from "../contexts.js";
2
+ import { useRepeaterActiveEntity, RepeaterSortableItemContext } from "../contexts.js";
3
3
  import { Portal } from "@radix-ui/react-portal";
4
4
  import { DragOverlay } from "@dnd-kit/core";
5
+ import { useSortable } from "@dnd-kit/sortable";
5
6
  import { useAccessorTreeState, AccessorTree, Entity } from "@contember/react-binding";
6
7
  import { RepeaterCurrentEntityContext } from "@contember/react-repeater";
7
8
  const RepeaterSortableDragOverlay = ({ children }) => {
@@ -10,25 +11,39 @@ const RepeaterSortableDragOverlay = ({ children }) => {
10
11
  if (!activeItem) {
11
12
  return null;
12
13
  }
13
- return /* @__PURE__ */ jsxDEV(Portal, { children: /* @__PURE__ */ jsxDEV(DragOverlay, { children: /* @__PURE__ */ jsxDEV(AccessorTree, { state: accessorTreeState, children: /* @__PURE__ */ jsxDEV(Entity, { accessor: activeItem, children: /* @__PURE__ */ jsxDEV(RepeaterCurrentEntityContext.Provider, { value: activeItem, children }, void 0, false, {
14
+ return /* @__PURE__ */ jsxDEV(Portal, { children: /* @__PURE__ */ jsxDEV(DragOverlay, { children: /* @__PURE__ */ jsxDEV(AccessorTree, { state: accessorTreeState, children: /* @__PURE__ */ jsxDEV(Entity, { accessor: activeItem, children: /* @__PURE__ */ jsxDEV(RepeaterCurrentEntityContext.Provider, { value: activeItem, children: /* @__PURE__ */ jsxDEV(RepeaterSortableDragOverlayItemContext, { activeItem, children }, void 0, false, {
14
15
  fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
15
- lineNumber: 24,
16
+ lineNumber: 26,
17
+ columnNumber: 8
18
+ }, void 0) }, void 0, false, {
19
+ fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
20
+ lineNumber: 25,
16
21
  columnNumber: 7
17
22
  }, void 0) }, void 0, false, {
18
23
  fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
19
- lineNumber: 23,
24
+ lineNumber: 24,
20
25
  columnNumber: 6
21
26
  }, void 0) }, void 0, false, {
22
27
  fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
23
- lineNumber: 22,
28
+ lineNumber: 23,
24
29
  columnNumber: 5
25
30
  }, void 0) }, void 0, false, {
26
31
  fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
27
- lineNumber: 21,
32
+ lineNumber: 22,
28
33
  columnNumber: 4
29
34
  }, void 0) }, void 0, false, {
30
35
  fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
31
- lineNumber: 20,
36
+ lineNumber: 21,
37
+ columnNumber: 3
38
+ }, void 0);
39
+ };
40
+ const RepeaterSortableDragOverlayItemContext = ({ activeItem, children }) => {
41
+ const sortable = useSortable({
42
+ id: activeItem.id
43
+ });
44
+ return /* @__PURE__ */ jsxDEV(RepeaterSortableItemContext.Provider, { value: sortable, children }, void 0, false, {
45
+ fileName: "/home/runner/work/contember/contember/packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx",
46
+ lineNumber: 45,
32
47
  columnNumber: 3
33
48
  }, void 0);
34
49
  };
package/dist/development/src/components/RepeaterSortableDragOverlay.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"RepeaterSortableDragOverlay.js","sources":["../../../../../packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx"],"sourcesContent":["import React, { ReactNode } from 'react'\nimport { useRepeaterActiveEntity } from '../contexts'\nimport { Portal } from '@radix-ui/react-portal'\nimport { DragOverlay } from '@dnd-kit/core'\nimport { AccessorTree, Entity, useAccessorTreeState } from '@contember/react-binding'\nimport { RepeaterCurrentEntityContext } from '@contember/react-repeater'\n\n/**\n * Component for rendering the repeater item being dragged.\n */\nexport const RepeaterSortableDragOverlay = ({ children }: {\n\tchildren: ReactNode\n}) => {\n\tconst activeItem = useRepeaterActiveEntity()\n\tconst accessorTreeState = useAccessorTreeState()\n\tif (!activeItem) {\n\t\treturn null\n\t}\n\treturn (\n\t\t<Portal>\n\t\t\t<DragOverlay>\n\t\t\t\t<AccessorTree state={accessorTreeState}>\n\t\t\t\t\t<Entity accessor={activeItem}>\n\t\t\t\t\t\t<RepeaterCurrentEntityContext.Provider value={activeItem}>\n\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t</RepeaterCurrentEntityContext.Provider>\n\t\t\t\t\t</Entity>\n\t\t\t\t</AccessorTree>\n\t\t\t</DragOverlay>\n\t\t</Portal>\n\t)\n}\n"],"names":["this"],"mappings":";;;;;;AAUO,MAAM,8BAA8B,CAAC,EAAE,eAExC;AACL,QAAM,aAAa,wBAAA;AACnB,QAAM,oBAAoB,qBAAA;AAC1B,MAAI,CAAC,YAAY;AAChB,WAAO;AAAA,EACR;AACA,gCACE,QAAA,EACA,UAAA,uBAAC,eACA,UAAA,uBAAC,cAAA,EAAa,OAAO,mBACpB,UAAA,uBAAC,QAAA,EAAO,UAAU,YACjB,UAAA,uBAAC,6BAA6B,UAA7B,EAAsC,OAAO,YAC5C,SAAA,GADF,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAEA,EAAA,GAHD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAIA,EAAA,GALD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAMA,EAAA,GAPD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAQA,EAAA,GATD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAUA;AAEF;"}
1
+ {"version":3,"file":"RepeaterSortableDragOverlay.js","sources":["../../../../../packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx"],"sourcesContent":["import React, { ReactNode } from 'react'\nimport { RepeaterSortableItemContext, useRepeaterActiveEntity } from '../contexts'\nimport { Portal } from '@radix-ui/react-portal'\nimport { DragOverlay } from '@dnd-kit/core'\nimport { useSortable } from '@dnd-kit/sortable'\nimport { AccessorTree, Entity, EntityAccessor, useAccessorTreeState } from '@contember/react-binding'\nimport { RepeaterCurrentEntityContext } from '@contember/react-repeater'\n\n/**\n * Component for rendering the repeater item being dragged.\n */\nexport const RepeaterSortableDragOverlay = ({ children }: {\n\tchildren: ReactNode\n}) => {\n\tconst activeItem = useRepeaterActiveEntity()\n\tconst accessorTreeState = useAccessorTreeState()\n\tif (!activeItem) {\n\t\treturn null\n\t}\n\treturn (\n\t\t<Portal>\n\t\t\t<DragOverlay>\n\t\t\t\t<AccessorTree state={accessorTreeState}>\n\t\t\t\t\t<Entity accessor={activeItem}>\n\t\t\t\t\t\t<RepeaterCurrentEntityContext.Provider value={activeItem}>\n\t\t\t\t\t\t\t<RepeaterSortableDragOverlayItemContext activeItem={activeItem}>\n\t\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t\t</RepeaterSortableDragOverlayItemContext>\n\t\t\t\t\t\t</RepeaterCurrentEntityContext.Provider>\n\t\t\t\t\t</Entity>\n\t\t\t\t</AccessorTree>\n\t\t\t</DragOverlay>\n\t\t</Portal>\n\t)\n}\n\nconst RepeaterSortableDragOverlayItemContext = ({ activeItem, children }: {\n\tactiveItem: EntityAccessor\n\tchildren: ReactNode\n}) => {\n\tconst sortable = useSortable({\n\t\tid: activeItem.id,\n\t})\n\treturn (\n\t\t<RepeaterSortableItemContext.Provider value={sortable}>\n\t\t\t{children}\n\t\t</RepeaterSortableItemContext.Provider>\n\t)\n}\n"],"names":["this"],"mappings":";;;;;;;AAWO,MAAM,8BAA8B,CAAC,EAAE,eAExC;AACL,QAAM,aAAa,wBAAA;AACnB,QAAM,oBAAoB,qBAAA;AAC1B,MAAI,CAAC,YAAY;AAChB,WAAO;AAAA,EACR;AACA,SACC,uBAAC,UACA,UAAA,uBAAC,aAAA,EACA,iCAAC,cAAA,EAAa,OAAO,mBACpB,UAAA,uBAAC,QAAA,EAAO,UAAU,YACjB,UAAA,uBAAC,6BAA6B,UAA7B,EAAsC,OAAO,YAC7C,UAAA,uBAAC,wCAAA,EAAuC,YACtC,SAAA,GADF,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAEA,EAAA,GAHD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAIA,EAAA,GALD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAMA,EAAA,GAPD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAQA,EAAA,GATD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAUA,EAAA,GAXD,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAYA;AAEF;AAEA,MAAM,yCAAyC,CAAC,EAAE,YAAY,eAGxD;AACL,QAAM,WAAW,YAAY;AAAA,IAC5B,IAAI,WAAW;AAAA,EAAA,CACf;AACD,gCACE,4BAA4B,UAA5B,EAAqC,OAAO,UAC3C,SAAA,GADF,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAEA;AAEF;"}
package/dist/production/src/components/RepeaterSortableDragOverlay.cjs CHANGED
@@ -4,6 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
4
4
  const contexts = require("../contexts.cjs");
5
5
  const reactPortal = require("@radix-ui/react-portal");
6
6
  const core = require("@dnd-kit/core");
7
+ const sortable = require("@dnd-kit/sortable");
7
8
  const reactBinding = require("@contember/react-binding");
8
9
  const reactRepeater = require("@contember/react-repeater");
9
10
  const RepeaterSortableDragOverlay = ({ children }) => {
@@ -12,7 +13,13 @@ const RepeaterSortableDragOverlay = ({ children }) => {
12
13
  if (!activeItem) {
13
14
  return null;
14
15
  }
15
- return /* @__PURE__ */ jsxRuntime.jsx(reactPortal.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(core.DragOverlay, { children: /* @__PURE__ */ jsxRuntime.jsx(reactBinding.AccessorTree, { state: accessorTreeState, children: /* @__PURE__ */ jsxRuntime.jsx(reactBinding.Entity, { accessor: activeItem, children: /* @__PURE__ */ jsxRuntime.jsx(reactRepeater.RepeaterCurrentEntityContext.Provider, { value: activeItem, children }) }) }) }) });
16
+ return /* @__PURE__ */ jsxRuntime.jsx(reactPortal.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(core.DragOverlay, { children: /* @__PURE__ */ jsxRuntime.jsx(reactBinding.AccessorTree, { state: accessorTreeState, children: /* @__PURE__ */ jsxRuntime.jsx(reactBinding.Entity, { accessor: activeItem, children: /* @__PURE__ */ jsxRuntime.jsx(reactRepeater.RepeaterCurrentEntityContext.Provider, { value: activeItem, children: /* @__PURE__ */ jsxRuntime.jsx(RepeaterSortableDragOverlayItemContext, { activeItem, children }) }) }) }) }) });
17
+ };
18
+ const RepeaterSortableDragOverlayItemContext = ({ activeItem, children }) => {
19
+ const sortable$1 = sortable.useSortable({
20
+ id: activeItem.id
21
+ });
22
+ return /* @__PURE__ */ jsxRuntime.jsx(contexts.RepeaterSortableItemContext.Provider, { value: sortable$1, children });
16
23
  };
17
24
  exports.RepeaterSortableDragOverlay = RepeaterSortableDragOverlay;
18
25
  //# sourceMappingURL=RepeaterSortableDragOverlay.cjs.map
package/dist/production/src/components/RepeaterSortableDragOverlay.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"RepeaterSortableDragOverlay.cjs","sources":["../../../../../packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx"],"sourcesContent":["import React, { ReactNode } from 'react'\nimport { useRepeaterActiveEntity } from '../contexts'\nimport { Portal } from '@radix-ui/react-portal'\nimport { DragOverlay } from '@dnd-kit/core'\nimport { AccessorTree, Entity, useAccessorTreeState } from '@contember/react-binding'\nimport { RepeaterCurrentEntityContext } from '@contember/react-repeater'\n\n/**\n * Component for rendering the repeater item being dragged.\n */\nexport const RepeaterSortableDragOverlay = ({ children }: {\n\tchildren: ReactNode\n}) => {\n\tconst activeItem = useRepeaterActiveEntity()\n\tconst accessorTreeState = useAccessorTreeState()\n\tif (!activeItem) {\n\t\treturn null\n\t}\n\treturn (\n\t\t<Portal>\n\t\t\t<DragOverlay>\n\t\t\t\t<AccessorTree state={accessorTreeState}>\n\t\t\t\t\t<Entity accessor={activeItem}>\n\t\t\t\t\t\t<RepeaterCurrentEntityContext.Provider value={activeItem}>\n\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t</RepeaterCurrentEntityContext.Provider>\n\t\t\t\t\t</Entity>\n\t\t\t\t</AccessorTree>\n\t\t\t</DragOverlay>\n\t\t</Portal>\n\t)\n}\n"],"names":["useRepeaterActiveEntity","useAccessorTreeState","jsx","Portal","DragOverlay","AccessorTree","Entity","RepeaterCurrentEntityContext"],"mappings":";;;;;;;;AAUO,MAAM,8BAA8B,CAAC,EAAE,eAExC;AACL,QAAM,aAAaA,SAAAA,wBAAA;AACnB,QAAM,oBAAoBC,aAAAA,qBAAA;AAC1B,MAAI,CAAC,YAAY;AAChB,WAAO;AAAA,EACR;AACA,SACCC,2BAAAA,IAACC,YAAAA,UACA,UAAAD,2BAAAA,IAACE,KAAAA,aAAA,EACA,yCAACC,aAAAA,cAAA,EAAa,OAAO,mBACpB,UAAAH,2BAAAA,IAACI,aAAAA,QAAA,EAAO,UAAU,YACjB,UAAAJ,2BAAAA,IAACK,cAAAA,6BAA6B,UAA7B,EAAsC,OAAO,YAC5C,SAAA,CACF,EAAA,CACD,EAAA,CACD,EAAA,CACD,EAAA,CACD;AAEF;;"}
1
+ {"version":3,"file":"RepeaterSortableDragOverlay.cjs","sources":["../../../../../packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx"],"sourcesContent":["import React, { ReactNode } from 'react'\nimport { RepeaterSortableItemContext, useRepeaterActiveEntity } from '../contexts'\nimport { Portal } from '@radix-ui/react-portal'\nimport { DragOverlay } from '@dnd-kit/core'\nimport { useSortable } from '@dnd-kit/sortable'\nimport { AccessorTree, Entity, EntityAccessor, useAccessorTreeState } from '@contember/react-binding'\nimport { RepeaterCurrentEntityContext } from '@contember/react-repeater'\n\n/**\n * Component for rendering the repeater item being dragged.\n */\nexport const RepeaterSortableDragOverlay = ({ children }: {\n\tchildren: ReactNode\n}) => {\n\tconst activeItem = useRepeaterActiveEntity()\n\tconst accessorTreeState = useAccessorTreeState()\n\tif (!activeItem) {\n\t\treturn null\n\t}\n\treturn (\n\t\t<Portal>\n\t\t\t<DragOverlay>\n\t\t\t\t<AccessorTree state={accessorTreeState}>\n\t\t\t\t\t<Entity accessor={activeItem}>\n\t\t\t\t\t\t<RepeaterCurrentEntityContext.Provider value={activeItem}>\n\t\t\t\t\t\t\t<RepeaterSortableDragOverlayItemContext activeItem={activeItem}>\n\t\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t\t</RepeaterSortableDragOverlayItemContext>\n\t\t\t\t\t\t</RepeaterCurrentEntityContext.Provider>\n\t\t\t\t\t</Entity>\n\t\t\t\t</AccessorTree>\n\t\t\t</DragOverlay>\n\t\t</Portal>\n\t)\n}\n\nconst RepeaterSortableDragOverlayItemContext = ({ activeItem, children }: {\n\tactiveItem: EntityAccessor\n\tchildren: ReactNode\n}) => {\n\tconst sortable = useSortable({\n\t\tid: activeItem.id,\n\t})\n\treturn (\n\t\t<RepeaterSortableItemContext.Provider value={sortable}>\n\t\t\t{children}\n\t\t</RepeaterSortableItemContext.Provider>\n\t)\n}\n"],"names":["useRepeaterActiveEntity","useAccessorTreeState","jsx","Portal","DragOverlay","AccessorTree","Entity","RepeaterCurrentEntityContext","sortable","useSortable","RepeaterSortableItemContext"],"mappings":";;;;;;;;;AAWO,MAAM,8BAA8B,CAAC,EAAE,eAExC;AACL,QAAM,aAAaA,SAAAA,wBAAA;AACnB,QAAM,oBAAoBC,aAAAA,qBAAA;AAC1B,MAAI,CAAC,YAAY;AAChB,WAAO;AAAA,EACR;AACA,SACCC,2BAAAA,IAACC,YAAAA,QAAA,EACA,UAAAD,2BAAAA,IAACE,KAAAA,aAAA,EACA,UAAAF,2BAAAA,IAACG,aAAAA,cAAA,EAAa,OAAO,mBACpB,UAAAH,2BAAAA,IAACI,aAAAA,QAAA,EAAO,UAAU,YACjB,UAAAJ,2BAAAA,IAACK,cAAAA,6BAA6B,UAA7B,EAAsC,OAAO,YAC7C,UAAAL,2BAAAA,IAAC,wCAAA,EAAuC,YACtC,UACF,EAAA,CACD,EAAA,CACD,EAAA,CACD,EAAA,CACD,GACD;AAEF;AAEA,MAAM,yCAAyC,CAAC,EAAE,YAAY,eAGxD;AACL,QAAMM,aAAWC,SAAAA,YAAY;AAAA,IAC5B,IAAI,WAAW;AAAA,EAAA,CACf;AACD,wCACEC,SAAAA,4BAA4B,UAA5B,EAAqC,OAAOF,YAC3C,UACF;AAEF;;"}
package/dist/production/src/components/RepeaterSortableDragOverlay.js CHANGED
@@ -1,7 +1,8 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
- import { useRepeaterActiveEntity } from "../contexts.js";
2
+ import { useRepeaterActiveEntity, RepeaterSortableItemContext } from "../contexts.js";
3
3
  import { Portal } from "@radix-ui/react-portal";
4
4
  import { DragOverlay } from "@dnd-kit/core";
5
+ import { useSortable } from "@dnd-kit/sortable";
5
6
  import { useAccessorTreeState, AccessorTree, Entity } from "@contember/react-binding";
6
7
  import { RepeaterCurrentEntityContext } from "@contember/react-repeater";
7
8
  const RepeaterSortableDragOverlay = ({ children }) => {
@@ -10,7 +11,13 @@ const RepeaterSortableDragOverlay = ({ children }) => {
10
11
  if (!activeItem) {
11
12
  return null;
12
13
  }
13
- return /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(DragOverlay, { children: /* @__PURE__ */ jsx(AccessorTree, { state: accessorTreeState, children: /* @__PURE__ */ jsx(Entity, { accessor: activeItem, children: /* @__PURE__ */ jsx(RepeaterCurrentEntityContext.Provider, { value: activeItem, children }) }) }) }) });
14
+ return /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(DragOverlay, { children: /* @__PURE__ */ jsx(AccessorTree, { state: accessorTreeState, children: /* @__PURE__ */ jsx(Entity, { accessor: activeItem, children: /* @__PURE__ */ jsx(RepeaterCurrentEntityContext.Provider, { value: activeItem, children: /* @__PURE__ */ jsx(RepeaterSortableDragOverlayItemContext, { activeItem, children }) }) }) }) }) });
15
+ };
16
+ const RepeaterSortableDragOverlayItemContext = ({ activeItem, children }) => {
17
+ const sortable = useSortable({
18
+ id: activeItem.id
19
+ });
20
+ return /* @__PURE__ */ jsx(RepeaterSortableItemContext.Provider, { value: sortable, children });
14
21
  };
15
22
  export {
16
23
  RepeaterSortableDragOverlay
package/dist/production/src/components/RepeaterSortableDragOverlay.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"RepeaterSortableDragOverlay.js","sources":["../../../../../packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx"],"sourcesContent":["import React, { ReactNode } from 'react'\nimport { useRepeaterActiveEntity } from '../contexts'\nimport { Portal } from '@radix-ui/react-portal'\nimport { DragOverlay } from '@dnd-kit/core'\nimport { AccessorTree, Entity, useAccessorTreeState } from '@contember/react-binding'\nimport { RepeaterCurrentEntityContext } from '@contember/react-repeater'\n\n/**\n * Component for rendering the repeater item being dragged.\n */\nexport const RepeaterSortableDragOverlay = ({ children }: {\n\tchildren: ReactNode\n}) => {\n\tconst activeItem = useRepeaterActiveEntity()\n\tconst accessorTreeState = useAccessorTreeState()\n\tif (!activeItem) {\n\t\treturn null\n\t}\n\treturn (\n\t\t<Portal>\n\t\t\t<DragOverlay>\n\t\t\t\t<AccessorTree state={accessorTreeState}>\n\t\t\t\t\t<Entity accessor={activeItem}>\n\t\t\t\t\t\t<RepeaterCurrentEntityContext.Provider value={activeItem}>\n\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t</RepeaterCurrentEntityContext.Provider>\n\t\t\t\t\t</Entity>\n\t\t\t\t</AccessorTree>\n\t\t\t</DragOverlay>\n\t\t</Portal>\n\t)\n}\n"],"names":[],"mappings":";;;;;;AAUO,MAAM,8BAA8B,CAAC,EAAE,eAExC;AACL,QAAM,aAAa,wBAAA;AACnB,QAAM,oBAAoB,qBAAA;AAC1B,MAAI,CAAC,YAAY;AAChB,WAAO;AAAA,EACR;AACA,SACC,oBAAC,UACA,UAAA,oBAAC,aAAA,EACA,8BAAC,cAAA,EAAa,OAAO,mBACpB,UAAA,oBAAC,QAAA,EAAO,UAAU,YACjB,UAAA,oBAAC,6BAA6B,UAA7B,EAAsC,OAAO,YAC5C,SAAA,CACF,EAAA,CACD,EAAA,CACD,EAAA,CACD,EAAA,CACD;AAEF;"}
1
+ {"version":3,"file":"RepeaterSortableDragOverlay.js","sources":["../../../../../packages/react-repeater-dnd-kit/src/components/RepeaterSortableDragOverlay.tsx"],"sourcesContent":["import React, { ReactNode } from 'react'\nimport { RepeaterSortableItemContext, useRepeaterActiveEntity } from '../contexts'\nimport { Portal } from '@radix-ui/react-portal'\nimport { DragOverlay } from '@dnd-kit/core'\nimport { useSortable } from '@dnd-kit/sortable'\nimport { AccessorTree, Entity, EntityAccessor, useAccessorTreeState } from '@contember/react-binding'\nimport { RepeaterCurrentEntityContext } from '@contember/react-repeater'\n\n/**\n * Component for rendering the repeater item being dragged.\n */\nexport const RepeaterSortableDragOverlay = ({ children }: {\n\tchildren: ReactNode\n}) => {\n\tconst activeItem = useRepeaterActiveEntity()\n\tconst accessorTreeState = useAccessorTreeState()\n\tif (!activeItem) {\n\t\treturn null\n\t}\n\treturn (\n\t\t<Portal>\n\t\t\t<DragOverlay>\n\t\t\t\t<AccessorTree state={accessorTreeState}>\n\t\t\t\t\t<Entity accessor={activeItem}>\n\t\t\t\t\t\t<RepeaterCurrentEntityContext.Provider value={activeItem}>\n\t\t\t\t\t\t\t<RepeaterSortableDragOverlayItemContext activeItem={activeItem}>\n\t\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t\t</RepeaterSortableDragOverlayItemContext>\n\t\t\t\t\t\t</RepeaterCurrentEntityContext.Provider>\n\t\t\t\t\t</Entity>\n\t\t\t\t</AccessorTree>\n\t\t\t</DragOverlay>\n\t\t</Portal>\n\t)\n}\n\nconst RepeaterSortableDragOverlayItemContext = ({ activeItem, children }: {\n\tactiveItem: EntityAccessor\n\tchildren: ReactNode\n}) => {\n\tconst sortable = useSortable({\n\t\tid: activeItem.id,\n\t})\n\treturn (\n\t\t<RepeaterSortableItemContext.Provider value={sortable}>\n\t\t\t{children}\n\t\t</RepeaterSortableItemContext.Provider>\n\t)\n}\n"],"names":[],"mappings":";;;;;;;AAWO,MAAM,8BAA8B,CAAC,EAAE,eAExC;AACL,QAAM,aAAa,wBAAA;AACnB,QAAM,oBAAoB,qBAAA;AAC1B,MAAI,CAAC,YAAY;AAChB,WAAO;AAAA,EACR;AACA,SACC,oBAAC,QAAA,EACA,UAAA,oBAAC,aAAA,EACA,UAAA,oBAAC,cAAA,EAAa,OAAO,mBACpB,UAAA,oBAAC,QAAA,EAAO,UAAU,YACjB,UAAA,oBAAC,6BAA6B,UAA7B,EAAsC,OAAO,YAC7C,UAAA,oBAAC,wCAAA,EAAuC,YACtC,UACF,EAAA,CACD,EAAA,CACD,EAAA,CACD,EAAA,CACD,GACD;AAEF;AAEA,MAAM,yCAAyC,CAAC,EAAE,YAAY,eAGxD;AACL,QAAM,WAAW,YAAY;AAAA,IAC5B,IAAI,WAAW;AAAA,EAAA,CACf;AACD,6BACE,4BAA4B,UAA5B,EAAqC,OAAO,UAC3C,UACF;AAEF;"}
package/dist/types/components/RepeaterSortableDragOverlay.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"RepeaterSortableDragOverlay.d.ts","sourceRoot":"","sources":["../../../src/components/RepeaterSortableDragOverlay.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAOxC;;GAEG;AACH,eAAO,MAAM,2BAA2B,GAAI,cAAc;IACzD,QAAQ,EAAE,SAAS,CAAA;CACnB,mDAmBA,CAAA"}
1
+ {"version":3,"file":"RepeaterSortableDragOverlay.d.ts","sourceRoot":"","sources":["../../../src/components/RepeaterSortableDragOverlay.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAQxC;;GAEG;AACH,eAAO,MAAM,2BAA2B,GAAI,cAAc;IACzD,QAAQ,EAAE,SAAS,CAAA;CACnB,mDAqBA,CAAA"}