@vuu-ui/vuu-utils 0.13.16 → 0.13.18

package/cjs/node_modules/@dnd-kit/dom/index.js

@@ -2,8 +2,8 @@
 
 var index = require('../abstract/index.js');
 var utilities = require('./utilities.js');
-var index$2 = require('../state/dist/index.js');
-var index$1 = require('../geometry/dist/index.js');
+var index$1 = require('../state/dist/index.js');
+var index$2 = require('../geometry/dist/index.js');
 var index$3 = require('../collision/dist/index.js');
 var signalsCore = require('../../@preact/signals-core/dist/signals-core.js');
 
@@ -303,7 +303,7 @@ var Cursor = class extends index.Plugin {
   constructor(manager, options) {
     super(manager, options);
     this.manager = manager;
-    const doc = index$2.computed(
+    const doc = index$1.computed(
       () => {
         var _a4;
         return utilities.getDocument((_a4 = this.manager.dragOperation.source) == null ? void 0 : _a4.element);
@@ -469,7 +469,7 @@ function isTableRow(element) {
 // src/core/plugins/feedback/Feedback.ts
 var styleSheetRegistry = /* @__PURE__ */ new Map();
 var _overlay_dec, _a, _init, _overlay, _Feedback_instances, render_fn, injectStyles_fn;
-var _Feedback = class _Feedback extends (_a = index.Plugin, _overlay_dec = [index$2.reactive], _a) {
+var _Feedback = class _Feedback extends (_a = index.Plugin, _overlay_dec = [index$1.reactive], _a) {
   constructor(manager, options) {
     super(manager, options);
     __privateAdd(this, _Feedback_instances);
@@ -525,7 +525,6 @@ render_fn = function() {
     x: elementFrameTransform.scaleX / frameTransform.scaleX,
     y: elementFrameTransform.scaleY / frameTransform.scaleY
   };
-  let cleanup;
   let { width, height, top, left } = shape;
   if (crossFrame) {
     width = width / scaleDelta.x;
@@ -750,48 +749,6 @@ render_fn = function() {
       subtree: true
     });
   }
-  const cleanupEffect = signalsCore.effect(() => {
-    var _a5;
-    const { transform: transform2, status: status2 } = dragOperation;
-    if (!transform2.x && !transform2.y && !state.current.translate) {
-      return;
-    }
-    if (status2.dragging) {
-      const initialTranslate2 = (_a5 = initial.translate) != null ? _a5 : { x: 0, y: 0 };
-      const translate2 = {
-        x: transform2.x / frameTransform.scaleX + initialTranslate2.x,
-        y: transform2.y / frameTransform.scaleY + initialTranslate2.y
-      };
-      const previousTranslate = state.current.translate;
-      const modifiers = signalsCore.untracked(() => dragOperation.modifiers);
-      const currentShape = signalsCore.untracked(() => {
-        var _a6;
-        return (_a6 = dragOperation.shape) == null ? void 0 : _a6.current;
-      });
-      const translateTransition = isKeyboardOperation ? "250ms cubic-bezier(0.25, 1, 0.5, 1)" : "0ms linear";
-      styles.set(
-        {
-          transition: `${transition}, translate ${translateTransition}`,
-          translate: `${translate2.x}px ${translate2.y}px 0`
-        },
-        CSS_PREFIX
-      );
-      elementMutationObserver == null ? void 0 : elementMutationObserver.takeRecords();
-      if (currentShape && currentShape !== initialShape && previousTranslate && !modifiers.length) {
-        const delta2 = index$1.Point.delta(translate2, previousTranslate);
-        dragOperation.shape = index$1.Rectangle.from(
-          currentShape.boundingRectangle
-        ).translate(
-          // Need to take into account frame transform when optimistically updating shape
-          delta2.x * frameTransform.scaleX,
-          delta2.y * frameTransform.scaleY
-        );
-      } else {
-        dragOperation.shape = new utilities.DOMRectangle(feedbackElement);
-      }
-      state.current.translate = translate2;
-    }
-  });
   const id = (_c3 = manager.dragOperation.source) == null ? void 0 : _c3.id;
   const restoreFocus = () => {
     var _a5;
@@ -804,8 +761,7 @@ render_fn = function() {
       element2.focus();
     }
   };
-  let dropEffectCleanup;
-  cleanup = () => {
+  const cleanup = () => {
     elementMutationObserver == null ? void 0 : elementMutationObserver.disconnect();
     documentMutationObserver == null ? void 0 : documentMutationObserver.disconnect();
     resizeObserver.disconnect();
@@ -825,95 +781,140 @@ render_fn = function() {
       placeholder.replaceWith(feedbackElement);
     }
     placeholder == null ? void 0 : placeholder.remove();
-    cleanupEffect();
-    dropEffectCleanup == null ? void 0 : dropEffectCleanup();
   };
-  dropEffectCleanup = signalsCore.effect(() => {
-    if (dragOperation.status.dropped) {
-      queueMicrotask(() => dropEffectCleanup == null ? void 0 : dropEffectCleanup());
-      const onComplete = cleanup;
-      cleanup = void 0;
-      source.status = "dropping";
-      let translate2 = state.current.translate;
-      const moved = translate2 != null;
-      if (!translate2 && element !== feedbackElement) {
-        translate2 = {
-          x: 0,
-          y: 0
-        };
-      }
-      if (!translate2) {
-        onComplete == null ? void 0 : onComplete();
+  const cleanupEffects = index$1.effects(
+    // Update transform on move
+    () => {
+      var _a5;
+      const { transform: transform2, status: status2 } = dragOperation;
+      if (!transform2.x && !transform2.y && !state.current.translate) {
         return;
       }
-      const dropAnimation = () => {
-        var _a5, _b3;
-        {
-          utilities.showPopover(feedbackElement);
-          const [, animation] = (_a5 = utilities.getFinalKeyframe(
-            feedbackElement,
-            (keyframe) => "translate" in keyframe
-          )) != null ? _a5 : [];
-          animation == null ? void 0 : animation.pause();
-          const target = placeholder != null ? placeholder : element;
-          const options2 = {
-            frameTransform: isSameFrame(feedbackElement, target) ? null : void 0
-          };
-          const current = new utilities.DOMRectangle(feedbackElement, options2);
-          const currentTranslate = (_b3 = utilities.parseTranslate(utilities.getComputedStyles(feedbackElement).translate)) != null ? _b3 : translate2;
-          const final = new utilities.DOMRectangle(target, options2);
-          const delta2 = index$1.Rectangle.delta(current, final, source.alignment);
-          const finalTranslate = {
-            x: currentTranslate.x - delta2.x,
-            y: currentTranslate.y - delta2.y
+      if (status2.dragging) {
+        const initialTranslate2 = (_a5 = initial.translate) != null ? _a5 : { x: 0, y: 0 };
+        const translate2 = {
+          x: transform2.x / frameTransform.scaleX + initialTranslate2.x,
+          y: transform2.y / frameTransform.scaleY + initialTranslate2.y
+        };
+        const previousTranslate = state.current.translate;
+        const modifiers = signalsCore.untracked(() => dragOperation.modifiers);
+        const currentShape = signalsCore.untracked(() => {
+          var _a6;
+          return (_a6 = dragOperation.shape) == null ? void 0 : _a6.current;
+        });
+        const translateTransition = isKeyboardOperation ? "250ms cubic-bezier(0.25, 1, 0.5, 1)" : "0ms linear";
+        styles.set(
+          {
+            transition: `${transition}, translate ${translateTransition}`,
+            translate: `${translate2.x}px ${translate2.y}px 0`
+          },
+          CSS_PREFIX
+        );
+        elementMutationObserver == null ? void 0 : elementMutationObserver.takeRecords();
+        if (currentShape && currentShape !== initialShape && previousTranslate && !modifiers.length) {
+          const delta2 = index$2.Point.delta(translate2, previousTranslate);
+          dragOperation.shape = index$2.Rectangle.from(
+            currentShape.boundingRectangle
+          ).translate(
+            // Need to take into account frame transform when optimistically updating shape
+            delta2.x * frameTransform.scaleX,
+            delta2.y * frameTransform.scaleY
+          );
+        } else {
+          dragOperation.shape = new utilities.DOMRectangle(feedbackElement);
+        }
+        state.current.translate = translate2;
+      }
+    },
+    // Drop animation
+    function() {
+      if (dragOperation.status.dropped) {
+        this.dispose();
+        source.status = "dropping";
+        let translate2 = state.current.translate;
+        const moved = translate2 != null;
+        if (!translate2 && element !== feedbackElement) {
+          translate2 = {
+            x: 0,
+            y: 0
           };
-          const heightKeyframes = Math.round(current.intrinsicHeight) !== Math.round(final.intrinsicHeight) ? {
-            minHeight: [
-              `${current.intrinsicHeight}px`,
-              `${final.intrinsicHeight}px`
-            ],
-            maxHeight: [
-              `${current.intrinsicHeight}px`,
-              `${final.intrinsicHeight}px`
-            ]
-          } : {};
-          const widthKeyframes = Math.round(current.intrinsicWidth) !== Math.round(final.intrinsicWidth) ? {
-            minWidth: [
-              `${current.intrinsicWidth}px`,
-              `${final.intrinsicWidth}px`
-            ],
-            maxWidth: [
-              `${current.intrinsicWidth}px`,
-              `${final.intrinsicWidth}px`
-            ]
-          } : {};
-          styles.set({ transition }, CSS_PREFIX);
-          feedbackElement.setAttribute(DROPPING_ATTRIBUTE, "");
-          elementMutationObserver == null ? void 0 : elementMutationObserver.takeRecords();
-          utilities.animateTransform({
-            element: feedbackElement,
-            keyframes: __spreadProps(__spreadValues(__spreadValues({}, heightKeyframes), widthKeyframes), {
-              translate: [
-                `${currentTranslate.x}px ${currentTranslate.y}px 0`,
-                `${finalTranslate.x}px ${finalTranslate.y}px 0`
-              ]
-            }),
-            options: {
-              duration: moved || feedbackElement !== element ? 250 : 0,
-              easing: "ease"
-            }
-          }).then(() => {
-            feedbackElement.removeAttribute(DROPPING_ATTRIBUTE);
-            animation == null ? void 0 : animation.finish();
-            onComplete == null ? void 0 : onComplete();
-            requestAnimationFrame(restoreFocus);
-          });
         }
-      };
-      manager.renderer.rendering.then(dropAnimation);
+        if (!translate2) {
+          cleanup();
+          return;
+        }
+        const dropAnimation = () => {
+          var _a5, _b3;
+          {
+            utilities.showPopover(feedbackElement);
+            const [, animation] = (_a5 = utilities.getFinalKeyframe(
+              feedbackElement,
+              (keyframe) => "translate" in keyframe
+            )) != null ? _a5 : [];
+            animation == null ? void 0 : animation.pause();
+            const target = placeholder != null ? placeholder : element;
+            const options2 = {
+              frameTransform: isSameFrame(feedbackElement, target) ? null : void 0
+            };
+            const current = new utilities.DOMRectangle(feedbackElement, options2);
+            const currentTranslate = (_b3 = utilities.parseTranslate(utilities.getComputedStyles(feedbackElement).translate)) != null ? _b3 : translate2;
+            const final = new utilities.DOMRectangle(target, options2);
+            const delta2 = index$2.Rectangle.delta(current, final, source.alignment);
+            const finalTranslate = {
+              x: currentTranslate.x - delta2.x,
+              y: currentTranslate.y - delta2.y
+            };
+            const heightKeyframes = Math.round(current.intrinsicHeight) !== Math.round(final.intrinsicHeight) ? {
+              minHeight: [
+                `${current.intrinsicHeight}px`,
+                `${final.intrinsicHeight}px`
+              ],
+              maxHeight: [
+                `${current.intrinsicHeight}px`,
+                `${final.intrinsicHeight}px`
+              ]
+            } : {};
+            const widthKeyframes = Math.round(current.intrinsicWidth) !== Math.round(final.intrinsicWidth) ? {
+              minWidth: [
+                `${current.intrinsicWidth}px`,
+                `${final.intrinsicWidth}px`
+              ],
+              maxWidth: [
+                `${current.intrinsicWidth}px`,
+                `${final.intrinsicWidth}px`
+              ]
+            } : {};
+            styles.set({ transition }, CSS_PREFIX);
+            feedbackElement.setAttribute(DROPPING_ATTRIBUTE, "");
+            elementMutationObserver == null ? void 0 : elementMutationObserver.takeRecords();
+            utilities.animateTransform({
+              element: feedbackElement,
+              keyframes: __spreadProps(__spreadValues(__spreadValues({}, heightKeyframes), widthKeyframes), {
+                translate: [
+                  `${currentTranslate.x}px ${currentTranslate.y}px 0`,
+                  `${finalTranslate.x}px ${finalTranslate.y}px 0`
+                ]
+              }),
+              options: {
+                duration: moved || feedbackElement !== element ? 250 : 0,
+                easing: "ease"
+              }
+            }).then(() => {
+              feedbackElement.removeAttribute(DROPPING_ATTRIBUTE);
+              animation == null ? void 0 : animation.finish();
+              cleanup();
+              requestAnimationFrame(restoreFocus);
+            });
+          }
+        };
+        manager.renderer.rendering.then(dropAnimation);
+      }
     }
-  });
-  return () => cleanup == null ? void 0 : cleanup();
+  );
+  return () => {
+    cleanup();
+    cleanupEffects();
+  };
 };
 injectStyles_fn = function() {
   var _a4, _b2;
@@ -959,7 +960,7 @@ var Feedback = _Feedback;
 var LOCKED = true;
 var UNLOCKED = false;
 var _dec, _a2, _dec2, _b, _init2, __b, __a;
-_b = (_dec2 = [index$2.reactive], utilities.ScrollDirection.Forward), _a2 = (_dec = [index$2.reactive], utilities.ScrollDirection.Reverse);
+_b = (_dec2 = [index$1.reactive], utilities.ScrollDirection.Forward), _a2 = (_dec = [index$1.reactive], utilities.ScrollDirection.Reverse);
 var ScrollLock = class {
   constructor() {
     __privateAdd(this, __b, __runInitializers(_init2, 8, this, LOCKED)), __runInitializers(_init2, 11, this);
@@ -1020,7 +1021,7 @@ var ScrollIntentTracker = class extends index.Plugin {
         };
         const intent = scrollIntent.peek();
         signalsCore.batch(() => {
-          for (const axis of index$1.Axes) {
+          for (const axis of index$2.Axes) {
             for (const direction of DIRECTIONS) {
               if (directions[axis] === direction) {
                 intent[axis].unlock(direction);
@@ -1043,7 +1044,7 @@ function getDirection(a, b) {
 
 // src/core/plugins/scrolling/Scroller.ts
 var _autoScrolling_dec, _a3, _init3, _autoScrolling, _meta, _scroll;
-var Scroller = class extends (_a3 = index.CorePlugin, _autoScrolling_dec = [index$2.reactive], _a3) {
+var Scroller = class extends (_a3 = index.CorePlugin, _autoScrolling_dec = [index$1.reactive], _a3) {
   constructor(manager) {
     super(manager);
     __privateAdd(this, _autoScrolling, __runInitializers(_init3, 8, this, false)), __runInitializers(_init3, 11, this);
@@ -1087,7 +1088,7 @@ var Scroller = class extends (_a3 = index.CorePlugin, _autoScrolling_dec = [inde
               intent
             );
             if (scrollIntent) {
-              for (const axis of index$1.Axes) {
+              for (const axis of index$2.Axes) {
                 if (scrollIntent[axis].isLocked(direction[axis])) {
                   speed[axis] = 0;
                   direction[axis] = 0;
@@ -1123,7 +1124,7 @@ var Scroller = class extends (_a3 = index.CorePlugin, _autoScrolling_dec = [inde
     };
     let previousElementFromPoint = null;
     let previousScrollableElements = null;
-    const elementFromPoint = index$2.computed(() => {
+    const elementFromPoint = index$1.computed(() => {
       const { position, source } = manager.dragOperation;
       if (!position) {
         return null;
@@ -1137,7 +1138,7 @@ var Scroller = class extends (_a3 = index.CorePlugin, _autoScrolling_dec = [inde
       }
       return element != null ? element : previousElementFromPoint;
     });
-    const scrollableElements = index$2.computed(() => {
+    const scrollableElements = index$1.computed(() => {
       const element = elementFromPoint.value;
       const { documentElement } = utilities.getDocument(element);
       if (!element || element === documentElement) {
@@ -1163,7 +1164,7 @@ var Scroller = class extends (_a3 = index.CorePlugin, _autoScrolling_dec = [inde
       }
       previousScrollableElements = null;
       return null;
-    }, index$2.deepEqual);
+    }, index$1.deepEqual);
     this.getScrollableElements = () => {
       return scrollableElements.value;
     };
@@ -1679,15 +1680,15 @@ var _PointerSensor = class _PointerSensor extends index.Sensor {
     const constraints = this.activationConstraints(event, source);
     const { distance, delay } = constraints != null ? constraints : {};
     if (distance) {
-      if (distance.tolerance != null && index$1.exceedsDistance(delta, distance.tolerance)) {
+      if (distance.tolerance != null && index$2.exceedsDistance(delta, distance.tolerance)) {
         return this.handleCancel(event);
       }
-      if (index$1.exceedsDistance(delta, distance.value)) {
+      if (index$2.exceedsDistance(delta, distance.value)) {
         return this.handleStart(source, event);
       }
     }
     if (delay) {
-      if (index$1.exceedsDistance(delta, delay.tolerance)) {
+      if (index$2.exceedsDistance(delta, delay.tolerance)) {
         return this.handleCancel(event);
       }
     }
@@ -1826,11 +1827,11 @@ var DragDropManager = class extends index.DragDropManager {
   }
 };
 var _feedback_dec, _element_dec, _handle_dec, _c, _init4, _handle, _element, _feedback;
-var Draggable = class extends (_c = index.Draggable, _handle_dec = [index$2.reactive], _element_dec = [index$2.reactive], _feedback_dec = [index$2.reactive], _c) {
+var Draggable = class extends (_c = index.Draggable, _handle_dec = [index$1.reactive], _element_dec = [index$1.reactive], _feedback_dec = [index$1.reactive], _c) {
   constructor(_a4, manager) {
     var _b2 = _a4, {
       element,
-      effects = () => [],
+      effects: effects2 = () => [],
       handle,
       feedback = "default"
     } = _b2, input = __objRest(_b2, [
@@ -1842,7 +1843,7 @@ var Draggable = class extends (_c = index.Draggable, _handle_dec = [index$2.reac
     super(
       __spreadValues({
         effects: () => [
-          ...effects(),
+          ...effects2(),
           () => {
             var _a5, _b3;
             const { manager: manager2 } = this;
@@ -1881,9 +1882,9 @@ __decorateElement(_init4, 4, "element", _element_dec, Draggable, _element);
 __decorateElement(_init4, 4, "feedback", _feedback_dec, Draggable, _feedback);
 __decoratorMetadata(_init4, Draggable);
 var _proxy_dec, _element_dec2, _c2, _init5, _element2, _d, element_get, element_set, _Droppable_instances, _proxy;
-var Droppable = class extends (_c2 = index.Droppable, _element_dec2 = [index$2.reactive], _proxy_dec = [index$2.reactive], _c2) {
+var Droppable = class extends (_c2 = index.Droppable, _element_dec2 = [index$1.reactive], _proxy_dec = [index$1.reactive], _c2) {
   constructor(_a4, manager) {
-    var _b2 = _a4, { element, effects = () => [] } = _b2, input = __objRest(_b2, ["element", "effects"]);
+    var _b2 = _a4, { element, effects: effects2 = () => [] } = _b2, input = __objRest(_b2, ["element", "effects"]);
     const { collisionDetector = index$3.defaultCollisionDetection } = input;
     const updateShape = (boundingClientRect) => {
       const { manager: manager2, element: element2 } = this;
@@ -1905,7 +1906,7 @@ var Droppable = class extends (_c2 = index.Droppable, _element_dec2 = [index$2.r
       __spreadProps(__spreadValues({}, input), {
         collisionDetector,
         effects: () => [
-          ...effects(),
+          ...effects2(),
           () => {
             const { element: element2, manager: manager2 } = this;
             if (!manager2) return;