edytor 1.0.0-rc.3 → 2.0.0

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop/make-adapter/make-drop-target.js

@@ -0,0 +1,288 @@
+import { combine } from '../public-utils/combine.js';
+import { once } from '../public-utils/once.js';
+import { addAttribute } from '../util/add-attribute.js';
+function copyReverse(array) {
+  return array.slice(0).reverse();
+}
+export function makeDropTarget({
+  typeKey,
+  defaultDropEffect
+}) {
+  const registry = new WeakMap();
+  const dropTargetDataAtt = `data-drop-target-for-${typeKey}`;
+  const dropTargetSelector = `[${dropTargetDataAtt}]`;
+  function addToRegistry(args) {
+    registry.set(args.element, args);
+    return () => registry.delete(args.element);
+  }
+  function dropTargetForConsumers(args) {
+    // Guardrail: warn if the draggable element is already registered
+    if (process.env.NODE_ENV !== 'production') {
+      const existing = registry.get(args.element);
+      if (existing) {
+        // eslint-disable-next-line no-console
+        console.warn(`You have already registered a [${typeKey}] dropTarget on the same element`, {
+          existing,
+          proposed: args
+        });
+      }
+      if (args.element instanceof HTMLIFrameElement) {
+        // eslint-disable-next-line no-console
+        console.warn(`
+            We recommend not registering <iframe> elements as drop targets
+            as it can result in some strange browser event ordering.
+          `
+        // Removing newlines and excessive whitespace
+        .replace(/\s{2,}/g, ' ').trim());
+      }
+    }
+    const cleanup = combine(addAttribute(args.element, {
+      attribute: dropTargetDataAtt,
+      value: 'true'
+    }), addToRegistry(args));
+
+    // Wrapping in `once` to prevent unexpected side effects if consumers call
+    // the clean up function multiple times.
+    return once(cleanup);
+  }
+  function getActualDropTargets({
+    source,
+    target,
+    input,
+    result = []
+  }) {
+    var _args$getData, _args$getData2, _args$getDropEffect, _args$getDropEffect2;
+    if (target == null) {
+      return result;
+    }
+    if (!(target instanceof Element)) {
+      // For "text-selection" drags, the original `target`
+      // is not an `Element`, so we need to start looking from
+      // the parent element
+      if (target instanceof Node) {
+        return getActualDropTargets({
+          source,
+          target: target.parentElement,
+          input,
+          result
+        });
+      }
+
+      // not sure what we are working with,
+      // so we can exit.
+      return result;
+    }
+    const closest = target.closest(dropTargetSelector);
+
+    // Cannot find anything else
+    if (closest == null) {
+      return result;
+    }
+    const args = registry.get(closest);
+
+    // error: something had a dropTargetSelector but we could not
+    // find a match. For now, failing silently
+    if (args == null) {
+      return result;
+    }
+    const feedback = {
+      input,
+      source,
+      element: args.element
+    };
+
+    // if dropping is not allowed, skip this drop target
+    // and continue looking up the DOM tree
+    if (args.canDrop && !args.canDrop(feedback)) {
+      return getActualDropTargets({
+        source,
+        target: args.element.parentElement,
+        input,
+        result
+      });
+    }
+
+    // calculate our new record
+    const data = (_args$getData = (_args$getData2 = args.getData) === null || _args$getData2 === void 0 ? void 0 : _args$getData2.call(args, feedback)) !== null && _args$getData !== void 0 ? _args$getData : {};
+    const dropEffect = (_args$getDropEffect = (_args$getDropEffect2 = args.getDropEffect) === null || _args$getDropEffect2 === void 0 ? void 0 : _args$getDropEffect2.call(args, feedback)) !== null && _args$getDropEffect !== void 0 ? _args$getDropEffect : defaultDropEffect;
+    const record = {
+      data,
+      element: args.element,
+      dropEffect,
+      // we are collecting _actual_ drop targets, so these are
+      // being applied _not_ due to stickiness
+      isActiveDueToStickiness: false
+    };
+    return getActualDropTargets({
+      source,
+      target: args.element.parentElement,
+      input,
+      // Using bubble ordering. Same ordering as `event.getPath()`
+      result: [...result, record]
+    });
+  }
+  function notifyCurrent({
+    eventName,
+    payload
+  }) {
+    for (const record of payload.location.current.dropTargets) {
+      var _entry$eventName;
+      const entry = registry.get(record.element);
+      const args = {
+        ...payload,
+        self: record
+      };
+      entry === null || entry === void 0 ? void 0 : (_entry$eventName = entry[eventName]) === null || _entry$eventName === void 0 ? void 0 : _entry$eventName.call(entry,
+      // I cannot seem to get the types right here.
+      // TS doesn't seem to like that one event can need `nativeSetDragImage`
+      // @ts-expect-error
+      args);
+    }
+  }
+  const actions = {
+    onGenerateDragPreview: notifyCurrent,
+    onDrag: notifyCurrent,
+    onDragStart: notifyCurrent,
+    onDrop: notifyCurrent,
+    onDropTargetChange: ({
+      payload
+    }) => {
+      const isCurrent = new Set(payload.location.current.dropTargets.map(record => record.element));
+      const visited = new Set();
+      for (const record of payload.location.previous.dropTargets) {
+        var _entry$onDropTargetCh;
+        visited.add(record.element);
+        const entry = registry.get(record.element);
+        const isOver = isCurrent.has(record.element);
+        const args = {
+          ...payload,
+          self: record
+        };
+        entry === null || entry === void 0 ? void 0 : (_entry$onDropTargetCh = entry.onDropTargetChange) === null || _entry$onDropTargetCh === void 0 ? void 0 : _entry$onDropTargetCh.call(entry, args);
+
+        // if we cannot find the drop target in the current array, then it has been left
+        if (!isOver) {
+          var _entry$onDragLeave;
+          entry === null || entry === void 0 ? void 0 : (_entry$onDragLeave = entry.onDragLeave) === null || _entry$onDragLeave === void 0 ? void 0 : _entry$onDragLeave.call(entry, args);
+        }
+      }
+      for (const record of payload.location.current.dropTargets) {
+        var _entry$onDropTargetCh2, _entry$onDragEnter;
+        // already published an update to this drop target
+        if (visited.has(record.element)) {
+          continue;
+        }
+        // at this point we have a new drop target that is being entered into
+        const args = {
+          ...payload,
+          self: record
+        };
+        const entry = registry.get(record.element);
+        entry === null || entry === void 0 ? void 0 : (_entry$onDropTargetCh2 = entry.onDropTargetChange) === null || _entry$onDropTargetCh2 === void 0 ? void 0 : _entry$onDropTargetCh2.call(entry, args);
+        entry === null || entry === void 0 ? void 0 : (_entry$onDragEnter = entry.onDragEnter) === null || _entry$onDragEnter === void 0 ? void 0 : _entry$onDragEnter.call(entry, args);
+      }
+    }
+  };
+  function dispatchEvent(args) {
+    actions[args.eventName](args);
+  }
+  function getIsOver({
+    source,
+    target,
+    input,
+    current
+  }) {
+    const actual = getActualDropTargets({
+      source,
+      target,
+      input
+    });
+
+    // stickiness is only relevant when we have less
+    // drop targets than we did before
+    if (actual.length >= current.length) {
+      return actual;
+    }
+
+    // less 'actual' drop targets than before,
+    // we need to see if 'stickiness' applies
+
+    // An old drop target will continue to be dropped on if:
+    // 1. it has the same parent
+    // 2. nothing exists in it's previous index
+
+    const lastCaptureOrdered = copyReverse(current);
+    const actualCaptureOrdered = copyReverse(actual);
+    const resultCaptureOrdered = [];
+    for (let index = 0; index < lastCaptureOrdered.length; index++) {
+      var _argsForLast$getIsSti;
+      const last = lastCaptureOrdered[index];
+      const fresh = actualCaptureOrdered[index];
+
+      // if a record is in the new index -> use that
+      // it will have the latest data + dropEffect
+      if (fresh != null) {
+        resultCaptureOrdered.push(fresh);
+        continue;
+      }
+
+      // At this point we have no drop target in the old spot
+      // Check to see if we can use a previous sticky drop target
+
+      // The "parent" is the one inside of `resultCaptureOrdered`
+      // (the parent might be a drop target that was sticky)
+      const parent = resultCaptureOrdered[index - 1];
+      const lastParent = lastCaptureOrdered[index - 1];
+
+      // Stickiness is based on parent relationships, so if the parent relationship has change
+      // then we can stop our search
+      if ((parent === null || parent === void 0 ? void 0 : parent.element) !== (lastParent === null || lastParent === void 0 ? void 0 : lastParent.element)) {
+        break;
+      }
+
+      // We need to check whether the old drop target can still be dropped on
+
+      const argsForLast = registry.get(last.element);
+
+      // We cannot drop on a drop target that is no longer mounted
+      if (!argsForLast) {
+        break;
+      }
+      const feedback = {
+        input,
+        source,
+        element: argsForLast.element
+      };
+
+      // We cannot drop on a drop target that no longer allows being dropped on
+      if (argsForLast.canDrop && !argsForLast.canDrop(feedback)) {
+        break;
+      }
+
+      // We cannot drop on a drop target that is no longer sticky
+      if (!((_argsForLast$getIsSti = argsForLast.getIsSticky) !== null && _argsForLast$getIsSti !== void 0 && _argsForLast$getIsSti.call(argsForLast, feedback))) {
+        break;
+      }
+
+      // Note: intentionally not recollecting `getData()` or `getDropEffect()`
+      // Previous values for `data` and `dropEffect` will be borrowed
+      // This is to prevent things like the 'closest edge' changing when
+      // no longer over a drop target.
+      // We could change our mind on this behaviour in the future
+
+      resultCaptureOrdered.push({
+        ...last,
+        // making it clear to consumers this drop target is active due to stickiness
+        isActiveDueToStickiness: true
+      });
+    }
+
+    // return bubble ordered result
+    return copyReverse(resultCaptureOrdered);
+  }
+  return {
+    dropTargetForConsumers,
+    getIsOver,
+    dispatchEvent
+  };
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop/make-adapter/make-monitor.js

@@ -0,0 +1,85 @@
+import { once } from '../public-utils/once.js';
+export function makeMonitor() {
+  const registry = new Set();
+  let dragging = null;
+  function tryAddToActive(monitor) {
+    if (!dragging) {
+      return;
+    }
+    // Monitor is allowed to monitor events if:
+    // 1. It has no `canMonitor` function (default is that a monitor can listen to everything)
+    // 2. `canMonitor` returns true
+    if (!monitor.canMonitor || monitor.canMonitor(dragging.canMonitorArgs)) {
+      dragging.active.add(monitor);
+    }
+  }
+  function monitorForConsumers(args) {
+    // We are giving each `args` a new reference so that you
+    // can create multiple monitors with the same `args`.
+    const entry = {
+      ...args
+    };
+    registry.add(entry);
+
+    // if there is an active drag we need to see if this new monitor is relevant
+    tryAddToActive(entry);
+    function cleanup() {
+      registry.delete(entry);
+
+      // We need to stop publishing events during a drag to this monitor!
+      if (dragging) {
+        dragging.active.delete(entry);
+      }
+    }
+
+    // Wrapping in `once` to prevent unexpected side effects if consumers call
+    // the clean up function multiple times.
+    return once(cleanup);
+  }
+  function dispatchEvent({
+    eventName,
+    payload
+  }) {
+    if (eventName === 'onGenerateDragPreview') {
+      dragging = {
+        canMonitorArgs: {
+          initial: payload.location.initial,
+          source: payload.source
+        },
+        active: new Set()
+      };
+      for (const monitor of registry) {
+        tryAddToActive(monitor);
+      }
+    }
+
+    // This should never happen.
+    if (!dragging) {
+      return;
+    }
+
+    // Creating an array from the set _before_ iterating
+    // This is so that monitors added during the current event will not be called.
+    // This behaviour matches native EventTargets where an event listener
+    // cannot add another event listener during an active event to the same
+    // event target in the same event (for us we have a single global event target)
+    const active = Array.from(dragging.active);
+    for (const monitor of active) {
+      // A monitor can be removed by another monitor during an event.
+      // We need to check that the monitor is still registered before calling it
+      if (dragging.active.has(monitor)) {
+        var _monitor$eventName;
+        // @ts-expect-error: I cannot get this type working!
+        (_monitor$eventName = monitor[eventName]) === null || _monitor$eventName === void 0 ? void 0 : _monitor$eventName.call(monitor, payload);
+      }
+    }
+    if (eventName === 'onDrop') {
+      dragging.active.clear();
+      dragging = null;
+    }
+  }
+  return {
+    dispatchEvent,
+    monitorForConsumers
+  };
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop/public-utils/combine.js

@@ -0,0 +1,6 @@
+/** Create a new combined function that will call all the provided functions */
+export function combine(...fns) {
+  return function cleanup() {
+    fns.forEach(fn => fn());
+  };
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop/public-utils/element/custom-native-drag-preview/set-custom-native-drag-preview.d.ts

@@ -0,0 +1,36 @@
+import { type ElementEventPayloadMap } from '../../../adapter/element-adapter.js';
+import type { GetOffsetFn } from './types.js';
+/** A function to remove the element that has been added to the `container`.
+ * @example () => root.unmount()
+ */
+type CleanupFn = () => void;
+/** A function that will render a preview element into a `container` `HTMLElement` */
+type RenderFn = ({ container, }: {
+    /** The `HTMLElement` that you need to render your preview element into.
+  `container` will be appended to the `document.body` and will be removed
+  after your `CleanupFn` is called
+  */
+    container: HTMLElement;
+}) => CleanupFn | void;
+/** This function provides the ability to mount an element for it to be used as the native drag preview
+ *
+ * @example
+ * draggable({
+ *  onGenerateDragPreview: ({ nativeSetDragImage }) => {
+ *    setCustomNativeDragPreview({
+ *      render: ({ container }) => {
+ *        const root = createRoot(container);
+ *        root.render(<Preview item={item} />);
+ *        return () => root.unmount();
+ *      },
+ *      nativeSetDragImage,
+ *    });
+ *    },
+ * });
+ */
+export declare function setCustomNativeDragPreview({ render, nativeSetDragImage, getOffset, }: {
+    getOffset?: GetOffsetFn;
+    render: RenderFn;
+    nativeSetDragImage: ElementEventPayloadMap['onGenerateDragPreview']['nativeSetDragImage'];
+}): void;
+export {};

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop/public-utils/element/custom-native-drag-preview/set-custom-native-drag-preview.js

@@ -0,0 +1,153 @@
+import { monitorForElements } from '../../../adapter/element-adapter.js';
+import { isSafari } from '../../../util/is-safari.js';
+import { maxZIndex } from '../../../util/max-z-index.js';
+import { popoverResetUserAgentStyles } from '../../../util/popover-reset-styles.js';
+import { supportsPopover } from '../../../util/supports-popover.js';
+
+/** A function to remove the element that has been added to the `container`.
+ * @example () => root.unmount()
+ */
+
+/** A function that will render a preview element into a `container` `HTMLElement` */
+
+/** By default we use the build in values for the native drag preview: {x: 0, y: 0} */
+function defaultOffset() {
+  return {
+    x: 0,
+    y: 0
+  };
+}
+
+/** This function provides the ability to mount an element for it to be used as the native drag preview
+ *
+ * @example
+ * draggable({
+ *  onGenerateDragPreview: ({ nativeSetDragImage }) => {
+ *    setCustomNativeDragPreview({
+ *      render: ({ container }) => {
+ *        const root = createRoot(container);
+ *        root.render(<Preview item={item} />);
+ *        return () => root.unmount();
+ *      },
+ *      nativeSetDragImage,
+ *    });
+ *    },
+ * });
+ */
+export function setCustomNativeDragPreview({
+  render,
+  nativeSetDragImage,
+  getOffset = defaultOffset
+}) {
+  const container = document.createElement('div');
+
+  // Using popover="manual" to place the element in the browser's top layer.
+  // This ensures the drag preview container is visually on top of everything else,
+  // including elements using z-index and other stacking contexts.
+  // "manual" means no light dismiss — we manage the lifecycle ourselves.
+  // This element is only created for a single frame for the browser to take a
+  // photo of it, and then it is destroyed.
+  // Falls back to position:fixed + maxZIndex when the popover API is not available.
+  // Note: the popover attribute must be set before the element is in the DOM.
+  // `.showPopover()` is called further below after the element is appended to the body.
+  if (supportsPopover()) {
+    container.setAttribute('popover', 'manual');
+  }
+  Object.assign(container.style, {
+    // Ensuring we don't cause reflow when adding the element to the page
+    // Using `position:fixed` rather than `position:absolute` so we are
+    // positioned on the current viewport.
+    // `position:fixed` also creates a new stacking context, so we don't need to do that here
+    position: 'fixed',
+    ...(supportsPopover() ?
+    // needs to come first as it has 'inset: unset' which
+    // needs to be overridden by our top / left values
+    popoverResetUserAgentStyles : {
+      // Fallback: using maximum possible z-index so that this element
+      // will always be on top of other positioned content.
+      zIndex: maxZIndex
+    }),
+    // According to `mdn`, the element can be offscreen:
+    // https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/setDragImage#imgelement
+    //
+    // However, that  information does not appear in the specs:
+    // https://html.spec.whatwg.org/multipage/dnd.html#dom-datatransfer-setdragimage-dev
+    //
+    // If the element is _completely_ offscreen, Safari@17.1 will cancel the drag
+    top: 0,
+    left: 0,
+    // Avoiding any additional events caused by the new element (being super safe)
+    pointerEvents: 'none'
+  });
+  document.body.append(container);
+
+  // `.showPopover()` must be called after the element is in the DOM.
+  if (supportsPopover()) {
+    container.showPopover();
+  }
+  const unmount = render({
+    container
+  });
+
+  /**
+   * Some frameworks (eg `react`) don't render into the container until the next microtask.
+   * - This will run before the browser takes it's picture of the element
+   * - This will run before the animation frame that removes `container`.
+   * */
+
+  queueMicrotask(() => {
+    const previewOffset = getOffset({
+      container
+    });
+
+    /**
+     * **Problem**
+     * On `Safari@17.1` if a drag preview element has some opacity,
+     * Safari will include elements behind the drag preview element
+     * in the drag preview.
+     * Bug: https://bugs.webkit.org/show_bug.cgi?id=266025
+     *
+     * **Fix**
+     * We push the drag preview so it is _almost_ completely offscreen so that
+     * there won't be any elements behind the drag preview element.
+     * If the element is _completely_ offscreen, then the drag is cancelled by Safari.
+     *
+     * Using `-0.0001` so that any potential "see through" on the drag preview element
+     * is effectively invisible 👻
+     *
+     * **Unsuccessful alternatives**
+     * Setting a background color (eg "white") on the `container`
+     * → Wrecks the opacity of the drag preview element
+     *
+     * Adding a parent element of the `container` with a background color (eg "white")
+     * → Wrecks the opacity of the drag preview element
+     */
+    /**
+     * Update: this bug fix is no longer needed in `Safari@26.4` (and maybe earlier)
+     * We can remove it in a future release
+     */
+    if (isSafari()) {
+      const rect = container.getBoundingClientRect();
+
+      // We cannot apply this fix if nothing has been rendered into the `container`
+      if (rect.width === 0) {
+        return;
+      }
+      container.style.left = `-${rect.width - 0.0001}px`;
+    }
+    nativeSetDragImage === null || nativeSetDragImage === void 0 ? void 0 : nativeSetDragImage(container, previewOffset.x, previewOffset.y);
+  });
+  function cleanup() {
+    // No need to call `.hidePopover()`.
+    // Removing the element from the DOM dismisses the popover
+    unbindMonitor();
+    unmount === null || unmount === void 0 ? void 0 : unmount();
+    document.body.removeChild(container);
+  }
+  const unbindMonitor = monitorForElements({
+    // Remove portal in the dragstart event so that the user will never see it
+    onDragStart: cleanup,
+    // Backup: remove portal when the drop finishes (this would be an error case)
+    onDrop: cleanup
+  });
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop/public-utils/element/custom-native-drag-preview/types.d.ts

@@ -0,0 +1,16 @@
+import type { Position } from '../../../internal-types.js';
+/** A function that will push the position of native drag preview.
+ *
+ * `{x: 0, y: 0}` represents having the users pointer user the top left corner of the drag preview.
+ *
+ * @example
+ * `const rect = container.getBoundingClientRect()`
+ *
+ * - `{x: 0, y: 0}` → top left of the `container` will be under the users pointer **(default)**
+ * - `{x: rect.width, y: 0}` → top right of the `container` will be under the users pointer
+ * - `{x: rect.width, y: rect.height}` → bottom right of the `container` will be under the users pointer
+ * - `{x: 0, y: rect.height}`→  bottom left of the `container` will be under the users pointer
+ */
+export type GetOffsetFn = (args: {
+    container: HTMLElement;
+}) => Position;

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop/public-utils/once.js

@@ -0,0 +1,13 @@
+/** Provide a function that you only ever want to be called a single time */
+export function once(fn) {
+  let cache = null;
+  return function wrapped(...args) {
+    if (!cache) {
+      const result = fn.apply(this, args);
+      cache = {
+        result: result
+      };
+    }
+    return cache.result;
+  };
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop/util/add-attribute.js

@@ -0,0 +1,7 @@
+export function addAttribute(element, {
+  attribute,
+  value
+}) {
+  element.setAttribute(attribute, value);
+  return () => element.removeAttribute(attribute);
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop/util/android.js

@@ -0,0 +1,10 @@
+import { once } from '../public-utils/once.js';
+
+// Using `once` as the value won't change in a browser
+
+export const isAndroid = once(function isAndroid() {
+  return navigator.userAgent.toLocaleLowerCase().includes('android');
+});
+
+// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
+export const androidFallbackText = 'pdnd:android-fallback';