edytor 1.0.0-rc.2 → 1.0.0

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop-auto-scroll/over-element/try-scroll.js

@@ -0,0 +1,183 @@
+import { getInternalConfig } from '../shared/configuration.js';
+import { markAndGetEngagement } from '../shared/engagement-history.js';
+import { selector } from './data-attributes.js';
+import { getScrollBy } from './get-scroll-by.js';
+function isScrollingAvailable(value) {
+  return Boolean(value.top || value.left);
+}
+function tryScrollElements({
+  target,
+  input,
+  source,
+  findEntry,
+  timeSinceLastFrame,
+  available = {
+    top: true,
+    left: true
+  }
+}) {
+  var _container$getConfigu, _container$getAllowed, _container$getAllowed2;
+  // we cannot do any more scrolling
+  if (!isScrollingAvailable(available)) {
+    return available;
+  }
+
+  // run out of parents to search
+  if (!target) {
+    return available;
+  }
+  const element = target.closest(selector);
+
+  // cannot find any more scroll containers
+  if (!element) {
+    return available;
+  }
+  const container = findEntry(element);
+
+  // cannot find registration, this is bad.
+  // fail and just exit
+  if (!container) {
+    return available;
+  }
+  function continueSearchUp() {
+    var _element$parentElemen;
+    return tryScrollElements({
+      target: (_element$parentElemen = element === null || element === void 0 ? void 0 : element.parentElement) !== null && _element$parentElemen !== void 0 ? _element$parentElemen : null,
+      findEntry,
+      source,
+      timeSinceLastFrame,
+      input,
+      available
+    });
+  }
+  const feedback = {
+    input,
+    source,
+    element
+  };
+
+  // Engagement is not marked if scrolling is explicitly not allowed
+  if (container.canScroll && !container.canScroll(feedback)) {
+    return continueSearchUp();
+  }
+
+  // Marking engagement even if no edges are scrollable.
+  // We are marking engagement as soon as the element is scrolled over
+  const engagement = markAndGetEngagement(element);
+  const config = getInternalConfig((_container$getConfigu = container.getConfiguration) === null || _container$getConfigu === void 0 ? void 0 : _container$getConfigu.call(container, feedback));
+  const allowedAxis = (_container$getAllowed = (_container$getAllowed2 = container.getAllowedAxis) === null || _container$getAllowed2 === void 0 ? void 0 : _container$getAllowed2.call(container, feedback)) !== null && _container$getAllowed !== void 0 ? _container$getAllowed : 'all';
+  const scrollBy = getScrollBy({
+    element,
+    engagement,
+    input,
+    timeSinceLastFrame,
+    allowedAxis,
+    config
+  });
+
+  // Only allow scrolling in directions that have not already been used
+  const scroll = {
+    top: 0,
+    left: 0
+  };
+  if (available.top && scrollBy.top !== 0) {
+    scroll.top = scrollBy.top;
+    // can no longer scroll on the top after this
+    available.top = false;
+  }
+  if (available.left && scrollBy.left !== 0) {
+    scroll.left = scrollBy.left;
+    // can no longer scroll on the left after this
+    available.left = false;
+  }
+
+  // Only scroll if there is something to scroll
+  if (scroll.top !== 0 || scroll.left !== 0) {
+    element.scrollBy(scroll);
+  }
+  return continueSearchUp();
+}
+function tryScrollWindow({
+  input,
+  timeSinceLastFrame,
+  available,
+  source,
+  entries
+}) {
+  const element = document.documentElement;
+  const feedback = {
+    input,
+    source,
+    element
+  };
+  for (const entry of entries) {
+    var _entry$getConfigurati, _entry$getAllowedAxis, _entry$getAllowedAxis2;
+    // this entry is not allowing scrolling, we need to look for another
+    if (entry.canScroll && !entry.canScroll(feedback)) {
+      continue;
+    }
+
+    // Note: if we had an event for when the user is leaving a tab
+    // we _could_ conceptually reset the engagement
+    const engagement = markAndGetEngagement(element);
+    const config = getInternalConfig((_entry$getConfigurati = entry.getConfiguration) === null || _entry$getConfigurati === void 0 ? void 0 : _entry$getConfigurati.call(entry, feedback));
+    const allowedAxis = (_entry$getAllowedAxis = (_entry$getAllowedAxis2 = entry.getAllowedAxis) === null || _entry$getAllowedAxis2 === void 0 ? void 0 : _entry$getAllowedAxis2.call(entry, feedback)) !== null && _entry$getAllowedAxis !== void 0 ? _entry$getAllowedAxis : 'all';
+    const scrollBy = getScrollBy({
+      element,
+      engagement,
+      input,
+      config,
+      allowedAxis,
+      getRect: element => DOMRect.fromRect({
+        y: 0,
+        x: 0,
+        width: element.clientWidth,
+        height: element.clientHeight
+      }),
+      timeSinceLastFrame
+    });
+    const scroll = {
+      top: available.top ? scrollBy.top : 0,
+      left: available.left ? scrollBy.left : 0
+    };
+
+    // only trigger a scroll if we are actually scrolling
+    if (scroll.top !== 0 || scroll.left !== 0) {
+      element.scrollBy(scroll);
+    }
+
+    // We only want the window to scroll once
+    break;
+  }
+}
+export function tryScroll({
+  input,
+  findEntry,
+  timeSinceLastFrame,
+  source,
+  getWindowScrollEntries,
+  underUsersPointer
+}) {
+  // We are matching browser behaviour and scrolling inner elements
+  // before outer ones. So we try to scroll scroller containers before
+  // the window.
+  const remainder = tryScrollElements({
+    target: underUsersPointer,
+    timeSinceLastFrame,
+    input,
+    source,
+    findEntry
+  });
+
+  // Check if we can do any window scrolling
+  if (!isScrollingAvailable(remainder)) {
+    return;
+  }
+  tryScrollWindow({
+    input,
+    source,
+    entries: getWindowScrollEntries(),
+    timeSinceLastFrame,
+    available: remainder
+  });
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop-auto-scroll/shared/axis.js

@@ -0,0 +1,22 @@
+const vertical = {
+  start: 'top',
+  end: 'bottom',
+  point: 'y',
+  size: 'height'
+};
+const horizontal = {
+  start: 'left',
+  end: 'right',
+  point: 'x',
+  size: 'width'
+};
+export const axisLookup = {
+  vertical: {
+    mainAxis: vertical,
+    crossAxis: horizontal
+  },
+  horizontal: {
+    mainAxis: horizontal,
+    crossAxis: vertical
+  }
+};

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop-auto-scroll/shared/can-scroll-on-edge.js

@@ -0,0 +1,17 @@
+export const canScrollOnEdge = {
+  // Notes:
+  //
+  // 🌏 Chrome 115.0: uses fractional units for `scrollLeft` and `scrollTop`
+  //    (and fractional units don't reach true integer maximum when zoomed in / out)
+  // 🍎 Safari 16.5.2: no fractional units
+  // 🦊 Firefox 115.0: no fractional units
+
+  // we have some scroll we can move backwards into
+  top: element => element.scrollTop > 0,
+  // We have some scroll we can move forward into
+  right: element => Math.ceil(element.scrollLeft) + element.clientWidth < element.scrollWidth,
+  // We have some scroll we can move forwards into
+  bottom: element => Math.ceil(element.scrollTop) + element.clientHeight < element.scrollHeight,
+  // we have some scroll we can move back into.
+  left: element => element.scrollLeft > 0
+};

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop-auto-scroll/shared/configuration.js

@@ -0,0 +1,49 @@
+const baseConfig = {
+  startHitboxAtPercentageRemainingOfElement: {
+    top: 0.25,
+    right: 0.25,
+    bottom: 0.25,
+    left: 0.25
+  },
+  maxScrollAtPercentageRemainingOfHitbox: {
+    top: 0.5,
+    right: 0.5,
+    bottom: 0.5,
+    left: 0.5
+  },
+  timeDampeningDurationMs: 400,
+  // Too big and it's too easy to trigger auto scrolling
+  // Too small and it's too hard 😅
+  maxMainAxisHitboxSize: 180
+};
+
+/** What the max scroll should be per second. Using "per second" rather than "per frame"
+ * as we want a consistent scroll speed regardless of frame rate.
+ *
+ *
+ * I explored trying to make the max scroll speed dynamic based on particular factors.
+ * However, it ended up being difficult to find a _perfect_ formula.
+ *
+ * Likely the perfect answer would involve:
+ * - the size of the scrollable element
+ * - the size of the scrollable element relative to the screen size
+ * - the size of the drag preview
+ * - the size of elements being scrolled in scrollable elements (expensive and difficult to compute)
+ */
+const maxPixelScrollPerSecond = {
+  // What the value would be if we were scrolling at 15px per frame at 60fps.
+  // This is the default as it works well for most experiences.
+  // In certain scenarios though it can feel a bit slow.
+  standard: 15 * 60,
+  // What the value would be if we were scrolling at 25px per frame at 60fps.
+  // This is not the default as it feels too fast for a lot of experiences.
+  fast: 25 * 60
+};
+export function getInternalConfig(provided) {
+  var _provided$maxScrollSp;
+  return {
+    ...baseConfig,
+    // only allowing limited control over the config at this stage
+    maxPixelScrollPerSecond: maxPixelScrollPerSecond[(_provided$maxScrollSp = provided === null || provided === void 0 ? void 0 : provided.maxScrollSpeed) !== null && _provided$maxScrollSp !== void 0 ? _provided$maxScrollSp : 'standard']
+  };
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop-auto-scroll/shared/edges.js

@@ -0,0 +1,9 @@
+export const edges = ['top', 'right', 'bottom', 'left'];
+
+// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
+export const edgeAxisLookup = {
+  top: 'vertical',
+  right: 'horizontal',
+  bottom: 'vertical',
+  left: 'horizontal'
+};

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop-auto-scroll/shared/engagement-history.js

@@ -0,0 +1,43 @@
+const ledger = new Map();
+const requested = new Set();
+export function markAndGetEngagement(element) {
+  markEngagement(element);
+  const entry = ledger.get(element);
+  if (entry) {
+    return entry;
+  }
+  const fresh = {
+    timeOfEngagementStart: Date.now()
+  };
+  ledger.set(element, fresh);
+  return fresh;
+}
+
+// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
+export function markEngagement(element) {
+  requested.add(element);
+}
+
+// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
+export function clearUnusedEngagements(fn) {
+  // make sure previous engagement requests don't linger
+  requested.clear();
+
+  // perform the required work
+  fn();
+
+  // if engagements where not requested, purge it
+  ledger.forEach((_, element) => {
+    if (!requested.has(element)) {
+      ledger.delete(element);
+    }
+  });
+
+  // cleaning up after ourselves
+  requested.clear();
+}
+
+// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
+export function clearEngagementHistory() {
+  ledger.clear();
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop-auto-scroll/shared/get-over-element-hitbox.js

@@ -0,0 +1,50 @@
+import { axisLookup } from './axis.js';
+import { mainAxisSideLookup } from './side.js';
+function makeGetHitbox({
+  edge,
+  axis
+}) {
+  return function hitbox({
+    clientRect,
+    config
+  }) {
+    const {
+      mainAxis,
+      crossAxis
+    } = axisLookup[axis];
+    const side = mainAxisSideLookup[edge];
+    const mainAxisHitboxSize = Math.min(
+    // scale the size of the hitbox down for smaller elements
+    config.startHitboxAtPercentageRemainingOfElement[edge] * clientRect[mainAxis.size],
+    // Don't let the hitbox grow too big for big elements
+    config.maxMainAxisHitboxSize);
+    return DOMRect.fromRect({
+      [mainAxis.point]: side === 'start' ?
+      // begin from the start edge and grow inwards
+      clientRect[mainAxis.point] :
+      // begin from inside the end edge and grow towards the end edge
+      clientRect[mainAxis.point] + clientRect[mainAxis.size] - mainAxisHitboxSize,
+      [crossAxis.point]: clientRect[crossAxis.point],
+      [mainAxis.size]: mainAxisHitboxSize,
+      [crossAxis.size]: clientRect[crossAxis.size]
+    });
+  };
+}
+export const getOverElementHitbox = {
+  top: makeGetHitbox({
+    axis: 'vertical',
+    edge: 'top'
+  }),
+  right: makeGetHitbox({
+    axis: 'horizontal',
+    edge: 'right'
+  }),
+  bottom: makeGetHitbox({
+    axis: 'vertical',
+    edge: 'bottom'
+  }),
+  left: makeGetHitbox({
+    axis: 'horizontal',
+    edge: 'left'
+  })
+};

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop-auto-scroll/shared/get-percentage-in-range.js

@@ -0,0 +1,19 @@
+export function getPercentageInRange({
+  startOfRange,
+  endOfRange,
+  value
+}) {
+  // checking inputs
+  const isValid = startOfRange < endOfRange;
+  if (!isValid) {
+    return 0;
+  }
+  if (value < startOfRange) {
+    return 0;
+  }
+  if (value > endOfRange) {
+    return 1;
+  }
+  const range = endOfRange - startOfRange;
+  return (value - startOfRange) / range;
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop-auto-scroll/shared/get-scroll-change.js

@@ -0,0 +1,106 @@
+import { axisLookup } from './axis.js';
+import { getPercentageInRange } from './get-percentage-in-range.js';
+import { mainAxisSideLookup } from './side.js';
+
+// We want a consistent scroll speed across devices, regardless of framerate
+function getMaxScrollChange({
+  timeSinceLastFrame,
+  config
+}) {
+  const targetScrollPerMs = config.maxPixelScrollPerSecond / 1000;
+
+  // Adjusting out target scroll rate to match the frame rate of the target device
+  // This will pull the scroll speed down on high frame rate devices
+  // so we get a consistent visual scroll speed regardless of device.
+  const proposed = Math.ceil(targetScrollPerMs * timeSinceLastFrame);
+
+  // If lots of time as passed since that last frame (such on lower frame rate devices)
+  // we don't want the scroll speed to be too fast, otherwise it can feel jumpy
+  // We are capping the scroll speed at what it would be if we were hitting 60fps
+  const maximum = config.maxPixelScrollPerSecond / 60;
+  return Math.min(proposed, maximum);
+}
+function getDistanceDampening({
+  client,
+  axis,
+  edge,
+  hitbox,
+  config
+}) {
+  const {
+    mainAxis
+  } = axisLookup[axis];
+  const side = mainAxisSideLookup[edge];
+
+  // We want to hit the max speed before the edge of the hitbox
+  const maxSpeedBuffer = hitbox[mainAxis.size] * config.maxScrollAtPercentageRemainingOfHitbox[edge];
+  if (side === 'end') {
+    return getPercentageInRange({
+      startOfRange: hitbox[mainAxis.start],
+      endOfRange: hitbox[mainAxis.end] - maxSpeedBuffer,
+      value: client[mainAxis.point]
+    });
+  }
+
+  // Moving towards start edge
+
+  const raw = getPercentageInRange({
+    startOfRange: hitbox[mainAxis.start] + maxSpeedBuffer,
+    endOfRange: hitbox[mainAxis.end],
+    value: client[mainAxis.point]
+  });
+  // When moving near start edge
+  // - the 'end' edge is where we start scrolling
+  // - the 'start' edge is where we reach max speed
+  // So we need to invert the percentage when moving backwards
+  return 1 - raw;
+}
+export function getScrollChange({
+  client,
+  timeSinceLastFrame,
+  engagement,
+  axis,
+  hitbox,
+  edge,
+  isDistanceDampeningEnabled,
+  config
+}) {
+  // We have two forms of speed dampening:
+  // 1. 🗺️ Distance
+  // The closer you are to a hitbox edge, the faster the scroll speed will be
+  // 2. ⏱️ Time
+  // When first entering a scroll container we want to dampening all scrolling
+  // This is to prevent super fast auto scrolling when first entering into
+  // a scroll container, or when lifting in a scroll container
+
+  const maxScroll = getMaxScrollChange({
+    timeSinceLastFrame,
+    config
+  });
+  const percentageDistanceDampening = isDistanceDampeningEnabled ? getDistanceDampening({
+    client,
+    edge,
+    hitbox,
+    axis,
+    config
+  }) : 1;
+
+  // Dampen speed by time
+  const percentageThroughTimeDampening = getPercentageInRange({
+    startOfRange: engagement.timeOfEngagementStart,
+    endOfRange: engagement.timeOfEngagementStart + config.timeDampeningDurationMs,
+    value: Date.now()
+  });
+
+  // Calculate how much of the max scroll we should apply based on dampening
+  const percentageOfMaxScroll = percentageDistanceDampening * percentageThroughTimeDampening;
+
+  // We _could_ ease this update (`Math.pow(percentageOfMaxSpeed, 2)`)
+  // But linear is feeling really good
+  // Always scrolling by at least one pixel, otherwise the scroll does nothing
+  const scroll = Math.max(maxScroll * percentageOfMaxScroll, 1);
+  const side = mainAxisSideLookup[edge];
+
+  // When moving backwards, we will be scrolling backwards
+  return side === 'end' ? scroll : -1 * scroll;
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop-auto-scroll/shared/is-axis-allowed.js

@@ -0,0 +1,3 @@
+export function isAxisAllowed(axis, allowedAxis) {
+  return allowedAxis === 'all' || axis === allowedAxis;
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop-auto-scroll/shared/is-within.js

@@ -0,0 +1,11 @@
+export function isWithin({
+  client,
+  clientRect
+}) {
+  return (
+    // is within horizontal bounds
+    client.x >= clientRect.x && client.x <= clientRect.x + clientRect.width &&
+    // is within vertical bounds
+    client.y >= clientRect.y && client.y <= clientRect.y + clientRect.height
+  );
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop-auto-scroll/shared/scheduler.js

@@ -0,0 +1,104 @@
+import { getElementFromPointWithoutHoneypot } from '../../pragmatic-drag-and-drop/honey-pot-fix/get-element-from-point-without-honey-pot.js';
+import { clearEngagementHistory, clearUnusedEngagements } from './engagement-history.js';
+// We keep this map so that "over element" scrolling and "overflow" scrolling
+// can leverage the same scheduler.
+// The 'monitor' is the key for looking up schedulers
+const schedulers = new Map();
+export function getScheduler(monitor) {
+  const scheduler = schedulers.get(monitor);
+  if (scheduler) {
+    // @ts-expect-error: I don't know how to link the DragType generic between the key and the value when the
+    // monitor itself is the key
+    return scheduler;
+  }
+  const created = makeScheduler(monitor);
+  schedulers.set(monitor, created);
+  return created;
+}
+function makeScheduler(monitor) {
+  let state = {
+    type: 'idle'
+  };
+  const callbacks = [];
+  function loop(timeLastFrameFinished) {
+    if (state.type !== 'running') {
+      return;
+    }
+    const timeSinceLastFrame = timeLastFrameFinished - state.timeLastFrameFinished;
+    const {
+      latestArgs
+    } = state;
+
+    // A common starting lookup point for determining
+    // which auto scroller should be used, and what should be scrolled.
+    const underUsersPointer = getElementFromPointWithoutHoneypot({
+      x: latestArgs.location.current.input.clientX,
+      y: latestArgs.location.current.input.clientY
+    });
+    clearUnusedEngagements(() => {
+      callbacks.forEach(onFrame => onFrame({
+        underUsersPointer,
+        latestArgs,
+        timeSinceLastFrame
+      }));
+    });
+    state.timeLastFrameFinished = timeLastFrameFinished;
+    state.frameId = requestAnimationFrame(loop);
+  }
+  function reset() {
+    if (state.type === 'idle') {
+      return;
+    }
+    cancelAnimationFrame(state.frameId);
+    clearEngagementHistory();
+    state = {
+      type: 'idle'
+    };
+  }
+  function start(args) {
+    if (state.type !== 'idle') {
+      return;
+    }
+    state = {
+      // Waiting a frame so we can accurately determine `timeSinceLastFrame`.
+      type: 'initializing',
+      latestArgs: args,
+      frameId: requestAnimationFrame(timeLastFrameFinished => {
+        if (state.type !== 'initializing') {
+          return;
+        }
+        state = {
+          type: 'running',
+          timeLastFrameFinished,
+          latestArgs: state.latestArgs,
+          frameId: requestAnimationFrame(loop)
+        };
+      })
+    };
+  }
+
+  // this module might have been imported after a drag has started
+  // We are starting the auto scroller if we get an update event and
+  // the auto scroller has not started yet
+  function update(args) {
+    if (state.type === 'idle') {
+      start(args);
+      return;
+    }
+    state.latestArgs = args;
+  }
+
+  // Not exposing a way to stop listening
+  monitor({
+    onDragStart: start,
+    onDropTargetChange: update,
+    onDrag: update,
+    onDrop: reset
+  });
+  const api = {
+    onFrame(fn) {
+      callbacks.push(fn);
+    }
+  };
+  return api;
+}

package/dist/dnd/vendor/pragmatic/pragmatic-drag-and-drop-auto-scroll/shared/side.js

@@ -0,0 +1,6 @@
+export const mainAxisSideLookup = {
+  top: 'start',
+  right: 'end',
+  bottom: 'end',
+  left: 'start'
+};

package/dist/dnd/vendor/pragmatic/raf-schd/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2021 Alex Reardon
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/dnd/vendor/pragmatic/raf-schd/raf-schd.esm.js

@@ -0,0 +1,34 @@
+var rafSchd = function rafSchd(fn) {
+  var lastArgs = [];
+  var frameId = null;
+
+  var wrapperFn = function wrapperFn() {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    lastArgs = args;
+
+    if (frameId) {
+      return;
+    }
+
+    frameId = requestAnimationFrame(function () {
+      frameId = null;
+      fn.apply(void 0, lastArgs);
+    });
+  };
+
+  wrapperFn.cancel = function () {
+    if (!frameId) {
+      return;
+    }
+
+    cancelAnimationFrame(frameId);
+    frameId = null;
+  };
+
+  return wrapperFn;
+};
+
+export default rafSchd;