@dnd-kit/solid 0.2.3

package/sortable.js

@@ -0,0 +1,98 @@
+import { defaultSortableTransition, Sortable } from '@dnd-kit/dom/sortable';
+export { isSortable } from '@dnd-kit/dom/sortable';
+import { batch } from '@dnd-kit/state';
+import { createSignal, createEffect, on } from 'solid-js';
+import { useDeepSignal } from '@dnd-kit/solid/hooks';
+import { useInstance } from '@dnd-kit/solid';
+
+// src/sortable/useSortable.ts
+function useSortable(input) {
+  const transition = {
+    ...defaultSortableTransition,
+    ...input.transition
+  };
+  const sortable = useInstance((manager) => {
+    return new Sortable(
+      {
+        ...input,
+        register: false,
+        transition,
+        element: input.element,
+        handle: input.handle,
+        target: input.target
+      },
+      manager
+    );
+  });
+  const trackedSortable = useDeepSignal(() => sortable);
+  const [element, setElement] = createSignal(
+    input.element
+  );
+  const [handle, setHandle] = createSignal(input.handle);
+  const [source, setSource] = createSignal(input.source);
+  const [target, setTarget] = createSignal(input.target);
+  createEffect(() => {
+    const el = element();
+    if (el) sortable.element = el;
+    const h = handle();
+    if (h) sortable.handle = h;
+    const s = source();
+    if (s) sortable.source = s;
+    const t = target();
+    if (t) sortable.target = t;
+    sortable.id = input.id;
+    sortable.disabled = input.disabled ?? false;
+    sortable.feedback = input.feedback ?? "default";
+    sortable.alignment = input.alignment;
+    sortable.modifiers = input.modifiers;
+    sortable.sensors = input.sensors;
+    sortable.accept = input.accept;
+    sortable.type = input.type;
+    sortable.collisionPriority = input.collisionPriority;
+    sortable.transition = input.transition ? { ...defaultSortableTransition, ...input.transition } : defaultSortableTransition;
+    if (input.collisionDetector) {
+      sortable.collisionDetector = input.collisionDetector;
+    }
+    if (input.data) {
+      sortable.data = input.data;
+    }
+  });
+  createEffect(
+    on(
+      () => [input.group, input.index],
+      () => {
+        batch(() => {
+          sortable.group = input.group;
+          sortable.index = input.index;
+        });
+      }
+    )
+  );
+  createEffect(
+    on(
+      () => input.index,
+      () => {
+        if (sortable.manager?.dragOperation.status.idle && sortable.transition?.idle) {
+          sortable.refreshShape();
+        }
+      }
+    )
+  );
+  return {
+    get sortable() {
+      return sortable;
+    },
+    isDragging: () => trackedSortable().isDragging,
+    isDropping: () => trackedSortable().isDropping,
+    isDragSource: () => trackedSortable().isDragSource,
+    isDropTarget: () => trackedSortable().isDropTarget,
+    ref: setElement,
+    handleRef: setHandle,
+    sourceRef: setSource,
+    targetRef: setTarget
+  };
+}
+
+export { useSortable };
+//# sourceMappingURL=sortable.js.map
+//# sourceMappingURL=sortable.js.map

package/utilities.cjs

@@ -0,0 +1,43 @@
+'use strict';
+
+// src/utilities/saveElementPosition.ts
+function createSaveElementPosition() {
+  let savedPosition = null;
+  const savePosition = (source) => {
+    const element = source.element;
+    const id = source.id;
+    const prevElement = element.previousElementSibling;
+    const nextElement = element.nextElementSibling;
+    const parentElement = element.parentElement;
+    savedPosition = {
+      id,
+      element,
+      prevElement: prevElement === element ? null : prevElement,
+      nextElement: nextElement === element ? null : nextElement,
+      parentElement
+    };
+  };
+  const restorePosition = (element) => {
+    if (!savedPosition) return;
+    const { prevElement, nextElement, parentElement } = savedPosition;
+    if (prevElement && element.previousElementSibling !== prevElement) {
+      prevElement.insertAdjacentElement("afterend", element);
+    } else if (nextElement && element.nextElementSibling !== nextElement) {
+      nextElement.insertAdjacentElement("beforebegin", element);
+    } else if (!prevElement && !nextElement && parentElement) {
+      parentElement.appendChild(element);
+    }
+  };
+  const clearPosition = () => {
+    savedPosition = null;
+  };
+  return {
+    savePosition,
+    clearPosition,
+    restorePosition
+  };
+}
+
+exports.createSaveElementPosition = createSaveElementPosition;
+//# sourceMappingURL=utilities.cjs.map
+//# sourceMappingURL=utilities.cjs.map

package/utilities.d.ts

@@ -0,0 +1,9 @@
+import { Draggable } from '@dnd-kit/dom';
+
+declare function createSaveElementPosition(): {
+    savePosition: (source: Draggable) => void;
+    clearPosition: () => void;
+    restorePosition: (element: Element) => void;
+};
+
+export { createSaveElementPosition };

package/utilities.js

@@ -0,0 +1,41 @@
+// src/utilities/saveElementPosition.ts
+function createSaveElementPosition() {
+  let savedPosition = null;
+  const savePosition = (source) => {
+    const element = source.element;
+    const id = source.id;
+    const prevElement = element.previousElementSibling;
+    const nextElement = element.nextElementSibling;
+    const parentElement = element.parentElement;
+    savedPosition = {
+      id,
+      element,
+      prevElement: prevElement === element ? null : prevElement,
+      nextElement: nextElement === element ? null : nextElement,
+      parentElement
+    };
+  };
+  const restorePosition = (element) => {
+    if (!savedPosition) return;
+    const { prevElement, nextElement, parentElement } = savedPosition;
+    if (prevElement && element.previousElementSibling !== prevElement) {
+      prevElement.insertAdjacentElement("afterend", element);
+    } else if (nextElement && element.nextElementSibling !== nextElement) {
+      nextElement.insertAdjacentElement("beforebegin", element);
+    } else if (!prevElement && !nextElement && parentElement) {
+      parentElement.appendChild(element);
+    }
+  };
+  const clearPosition = () => {
+    savedPosition = null;
+  };
+  return {
+    savePosition,
+    clearPosition,
+    restorePosition
+  };
+}
+
+export { createSaveElementPosition };
+//# sourceMappingURL=utilities.js.map
+//# sourceMappingURL=utilities.js.map