@studiometa/js-toolkit 2.12.1 → 3.0.0-alpha.10

package/decorators/withScrolledInView/utils.cjs

@@ -1,99 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// packages/js-toolkit/decorators/withScrolledInView/utils.ts
-var utils_exports = {};
-__export(utils_exports, {
-  getEdgeWithOffset: () => getEdgeWithOffset,
-  getEdges: () => getEdges,
-  normalizeOffset: () => normalizeOffset,
-  parseNamedOffset: () => parseNamedOffset
-});
-module.exports = __toCommonJS(utils_exports);
-var import_utils = require("../../utils/index.cjs");
-var units = {
-  px: "px",
-  vh: "vh",
-  vw: "vw",
-  vmin: "vmin",
-  vmax: "vmax",
-  percent: "%"
-};
-var namedOffsets = {
-  start: 0,
-  center: 0.5,
-  end: 1
-};
-function normalizeOffset(offsets) {
-  return offsets.split("/").map((offset) => offset.trim().split(" ").slice(0, 2));
-}
-function parseNamedOffset(offset) {
-  if ((0, import_utils.isNumber)(offset)) {
-    return offset;
-  }
-  if ((0, import_utils.isNumber)(namedOffsets[offset])) {
-    return namedOffsets[offset];
-  }
-  if ((0, import_utils.isNumber)(Number(offset))) {
-    return Number(offset);
-  }
-  if ((0, import_utils.isString)(offset) && (0, import_utils.endsWith)(offset, units.percent)) {
-    return Number.parseFloat(offset) / 100;
-  }
-  return offset;
-}
-function getEdgeWithOffset(start, size, offset) {
-  if ((0, import_utils.isNumber)(offset)) {
-    return start + size * offset;
-  }
-  const parsedNamedOffset = parseNamedOffset(offset);
-  if ((0, import_utils.isNumber)(parsedNamedOffset)) {
-    return start + size * parsedNamedOffset;
-  }
-  if ((0, import_utils.isString)(parsedNamedOffset)) {
-    const parsedOffset = Number.parseFloat(parsedNamedOffset);
-    if ((0, import_utils.endsWith)(parsedNamedOffset, units.px)) {
-      return start + parsedOffset;
-    }
-    if ((0, import_utils.endsWith)(parsedNamedOffset, units.vh)) {
-      return start + parsedOffset * window.innerHeight / 100;
-    }
-    if ((0, import_utils.endsWith)(parsedNamedOffset, units.vw)) {
-      return start + parsedOffset * window.innerWidth / 100;
-    }
-    if ((0, import_utils.endsWith)(parsedNamedOffset, units.vmin)) {
-      return start + parsedOffset * Math.min(window.innerWidth, window.innerHeight) / 100;
-    }
-    if ((0, import_utils.endsWith)(parsedNamedOffset, units.vmax)) {
-      return start + parsedOffset * Math.max(window.innerWidth, window.innerHeight) / 100;
-    }
-  }
-  return start;
-}
-function getEdges(axis, targetSizes, containerSizes, offset) {
-  const sizeKey = axis === "x" ? "width" : "height";
-  const targetStart = getEdgeWithOffset(targetSizes[axis], targetSizes[sizeKey], offset[0][0]);
-  const containerStart = getEdgeWithOffset(0, containerSizes[sizeKey], offset[0][1]);
-  const targetEnd = getEdgeWithOffset(targetSizes[axis], targetSizes[sizeKey], offset[1][0]);
-  const containerEnd = getEdgeWithOffset(0, containerSizes[sizeKey], offset[1][1]);
-  const start = targetStart - containerStart;
-  const end = targetEnd - containerEnd;
-  return [start, end];
-}
-if (module.exports.default) module.exports = module.exports.default;
-//# sourceMappingURL=utils.cjs.map

package/decorators/withScrolledInView/utils.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../packages/js-toolkit/decorators/withScrolledInView/utils.ts"],
-  "sourcesContent": ["import { isNumber, isString, endsWith } from '../../utils/index.js';\nimport type { NormalizedOffset } from './types.js';\n\nconst units = {\n  px: 'px',\n  vh: 'vh',\n  vw: 'vw',\n  vmin: 'vmin',\n  vmax: 'vmax',\n  percent: '%',\n};\n\nconst namedOffsets = {\n  start: 0,\n  center: 0.5,\n  end: 1,\n};\n\n/**\n * Normalize offset input.\n */\nexport function normalizeOffset(offsets: string): NormalizedOffset {\n  return offsets\n    .split('/')\n    .map((offset) => offset.trim().split(' ').slice(0, 2)) as NormalizedOffset;\n}\n\n/**\n * Parse the given offset.\n */\nexport function parseNamedOffset(offset: string | number): string | number {\n  if (isNumber(offset)) {\n    return offset;\n  }\n\n  if (isNumber(namedOffsets[offset])) {\n    return namedOffsets[offset];\n  }\n\n  if (isNumber(Number(offset))) {\n    return Number(offset);\n  }\n\n  if (isString(offset) && endsWith(offset, units.percent)) {\n    return Number.parseFloat(offset) / 100;\n  }\n\n  return offset;\n}\n\n/**\n * Get an edge value given a start, size and offset value.\n */\nexport function getEdgeWithOffset(start: number, size: number, offset: string | number): number {\n  if (isNumber(offset)) {\n    return start + size * offset;\n  }\n\n  const parsedNamedOffset = parseNamedOffset(offset);\n  if (isNumber(parsedNamedOffset)) {\n    return start + size * parsedNamedOffset;\n  }\n\n  if (isString(parsedNamedOffset)) {\n    const parsedOffset = Number.parseFloat(parsedNamedOffset);\n\n    if (endsWith(parsedNamedOffset, units.px)) {\n      return start + parsedOffset;\n    }\n\n    if (endsWith(parsedNamedOffset, units.vh)) {\n      return start + (parsedOffset * window.innerHeight) / 100;\n    }\n\n    if (endsWith(parsedNamedOffset, units.vw)) {\n      return start + (parsedOffset * window.innerWidth) / 100;\n    }\n\n    if (endsWith(parsedNamedOffset, units.vmin)) {\n      return start + (parsedOffset * Math.min(window.innerWidth, window.innerHeight)) / 100;\n    }\n\n    if (endsWith(parsedNamedOffset, units.vmax)) {\n      return start + (parsedOffset * Math.max(window.innerWidth, window.innerHeight)) / 100;\n    }\n  }\n\n  return start;\n}\n\n/**\n * Get starting and ending edges for a given axis, a target sizings, a container sizings and their offset.\n */\nexport function getEdges(axis: 'x' | 'y', targetSizes, containerSizes, offset): [number, number] {\n  const sizeKey = axis === 'x' ? 'width' : 'height';\n  const targetStart = getEdgeWithOffset(targetSizes[axis], targetSizes[sizeKey], offset[0][0]);\n  const containerStart = getEdgeWithOffset(0, containerSizes[sizeKey], offset[0][1]);\n  const targetEnd = getEdgeWithOffset(targetSizes[axis], targetSizes[sizeKey], offset[1][0]);\n  const containerEnd = getEdgeWithOffset(0, containerSizes[sizeKey], offset[1][1]);\n  const start = targetStart - containerStart;\n  const end = targetEnd - containerEnd;\n\n  return [start, end];\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA6C;AAG7C,IAAM,QAAQ;AAAA,EACZ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,MAAM;AAAA,EACN,SAAS;AACX;AAEA,IAAM,eAAe;AAAA,EACnB,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,KAAK;AACP;AAKO,SAAS,gBAAgB,SAAmC;AACjE,SAAO,QACJ,MAAM,GAAG,EACT,IAAI,CAAC,WAAW,OAAO,KAAK,EAAE,MAAM,GAAG,EAAE,MAAM,GAAG,CAAC,CAAC;AACzD;AAKO,SAAS,iBAAiB,QAA0C;AACzE,UAAI,uBAAS,MAAM,GAAG;AACpB,WAAO;AAAA,EACT;AAEA,UAAI,uBAAS,aAAa,MAAM,CAAC,GAAG;AAClC,WAAO,aAAa,MAAM;AAAA,EAC5B;AAEA,UAAI,uBAAS,OAAO,MAAM,CAAC,GAAG;AAC5B,WAAO,OAAO,MAAM;AAAA,EACtB;AAEA,UAAI,uBAAS,MAAM,SAAK,uBAAS,QAAQ,MAAM,OAAO,GAAG;AACvD,WAAO,OAAO,WAAW,MAAM,IAAI;AAAA,EACrC;AAEA,SAAO;AACT;AAKO,SAAS,kBAAkB,OAAe,MAAc,QAAiC;AAC9F,UAAI,uBAAS,MAAM,GAAG;AACpB,WAAO,QAAQ,OAAO;AAAA,EACxB;AAEA,QAAM,oBAAoB,iBAAiB,MAAM;AACjD,UAAI,uBAAS,iBAAiB,GAAG;AAC/B,WAAO,QAAQ,OAAO;AAAA,EACxB;AAEA,UAAI,uBAAS,iBAAiB,GAAG;AAC/B,UAAM,eAAe,OAAO,WAAW,iBAAiB;AAExD,YAAI,uBAAS,mBAAmB,MAAM,EAAE,GAAG;AACzC,aAAO,QAAQ;AAAA,IACjB;AAEA,YAAI,uBAAS,mBAAmB,MAAM,EAAE,GAAG;AACzC,aAAO,QAAS,eAAe,OAAO,cAAe;AAAA,IACvD;AAEA,YAAI,uBAAS,mBAAmB,MAAM,EAAE,GAAG;AACzC,aAAO,QAAS,eAAe,OAAO,aAAc;AAAA,IACtD;AAEA,YAAI,uBAAS,mBAAmB,MAAM,IAAI,GAAG;AAC3C,aAAO,QAAS,eAAe,KAAK,IAAI,OAAO,YAAY,OAAO,WAAW,IAAK;AAAA,IACpF;AAEA,YAAI,uBAAS,mBAAmB,MAAM,IAAI,GAAG;AAC3C,aAAO,QAAS,eAAe,KAAK,IAAI,OAAO,YAAY,OAAO,WAAW,IAAK;AAAA,IACpF;AAAA,EACF;AAEA,SAAO;AACT;AAKO,SAAS,SAAS,MAAiB,aAAa,gBAAgB,QAA0B;AAC/F,QAAM,UAAU,SAAS,MAAM,UAAU;AACzC,QAAM,cAAc,kBAAkB,YAAY,IAAI,GAAG,YAAY,OAAO,GAAG,OAAO,CAAC,EAAE,CAAC,CAAC;AAC3F,QAAM,iBAAiB,kBAAkB,GAAG,eAAe,OAAO,GAAG,OAAO,CAAC,EAAE,CAAC,CAAC;AACjF,QAAM,YAAY,kBAAkB,YAAY,IAAI,GAAG,YAAY,OAAO,GAAG,OAAO,CAAC,EAAE,CAAC,CAAC;AACzF,QAAM,eAAe,kBAAkB,GAAG,eAAe,OAAO,GAAG,OAAO,CAAC,EAAE,CAAC,CAAC;AAC/E,QAAM,QAAQ,cAAc;AAC5B,QAAM,MAAM,YAAY;AAExB,SAAO,CAAC,OAAO,GAAG;AACpB;",
-  "names": []
-}

package/decorators/withScrolledInView/withScrolledInView.cjs

@@ -1,249 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// packages/js-toolkit/decorators/withScrolledInView/withScrolledInView.ts
-var withScrolledInView_exports = {};
-__export(withScrolledInView_exports, {
-  withScrolledInView: () => withScrolledInView
-});
-module.exports = __toCommonJS(withScrolledInView_exports);
-var import_withMountWhenInView = require("../withMountWhenInView.cjs");
-var import_utils = require("../../utils/index.cjs");
-var import_utils2 = require("./utils.cjs");
-var scheduler = (0, import_utils.useScheduler)(["update", "render"]);
-function updateProgress(props, axis, progressKey, currentKey) {
-  props[progressKey][axis] = props.start[axis] === props.end[axis] ? 0 : (0, import_utils.clamp01)(
-    (props[currentKey][axis] - props.start[axis]) / (props.end[axis] - props.start[axis])
-  );
-}
-function updateProps(props, dampFactor, dampPrecision, axis = "x") {
-  props.current[axis] = (0, import_utils.clamp)(
-    axis === "x" ? window.pageXOffset : window.pageYOffset,
-    props.start[axis],
-    props.end[axis]
-  );
-  props.dampedCurrent[axis] = (0, import_utils.damp)(
-    props.current[axis],
-    props.dampedCurrent[axis],
-    dampFactor,
-    dampPrecision
-  );
-  updateProgress(props, axis, "progress", "current");
-  updateProgress(props, axis, "dampedProgress", "dampedCurrent");
-}
-function withScrolledInView(BaseClass, options = {}) {
-  class WithScrolledInView extends (0, import_withMountWhenInView.withMountWhenInView)(
-    BaseClass,
-    options
-  ) {
-    /**
-     * Config.
-     */
-    static config = {
-      name: `${BaseClass.config.name}WithMountWhenInView`,
-      emits: ["scrolledInView"],
-      options: {
-        dampFactor: {
-          type: Number,
-          default: 0.1
-        },
-        dampPrecision: {
-          type: Number,
-          default: 1e-3
-        },
-        offset: {
-          type: String,
-          default: "start end / end start"
-        }
-      }
-    };
-    __props = {
-      start: {
-        x: 0,
-        y: 0
-      },
-      end: {
-        x: 0,
-        y: 0
-      },
-      current: {
-        x: 0,
-        y: 0
-      },
-      dampedCurrent: {
-        x: 0,
-        y: 0
-      },
-      progress: {
-        x: 0,
-        y: 0
-      },
-      dampedProgress: {
-        x: 0,
-        y: 0
-      }
-    };
-    shouldEvaluateProps = true;
-    get props() {
-      if (this.shouldEvaluateProps) {
-        this.shouldEvaluateProps = false;
-        const targetSizes = options.useOffsetSizes ? (0, import_utils.getOffsetSizes)(this.$el) : this.$el.getBoundingClientRect();
-        targetSizes.y += window.pageYOffset;
-        targetSizes.x += window.pageXOffset;
-        const containerSizes = {
-          x: 0,
-          y: 0,
-          height: window.innerHeight,
-          width: window.innerWidth
-        };
-        const offset = (0, import_utils2.normalizeOffset)(this.$options.offset);
-        const [yStart, yEnd] = (0, import_utils2.getEdges)("y", targetSizes, containerSizes, offset);
-        const yCurrent = (0, import_utils.clamp)(window.pageYOffset, yStart, yEnd);
-        const yProgress = yStart === yEnd ? 0 : (0, import_utils.clamp01)((yCurrent - yStart) / (yEnd - yStart));
-        const [xStart, xEnd] = (0, import_utils2.getEdges)("x", targetSizes, containerSizes, offset);
-        const xCurrent = (0, import_utils.clamp)(window.pageXOffset, xStart, xEnd);
-        const xProgress = xStart === xEnd ? 0 : (0, import_utils.clamp01)((xCurrent - xStart) / (xEnd - xStart));
-        this.__props.start.x = xStart;
-        this.__props.start.y = yStart;
-        this.__props.end.x = xEnd;
-        this.__props.end.y = yEnd;
-        this.__props.current.x = xCurrent;
-        this.__props.current.y = yCurrent;
-        this.__props.dampedCurrent.x = xCurrent;
-        this.__props.dampedCurrent.y = yCurrent;
-        this.__props.progress.x = xProgress;
-        this.__props.progress.y = yProgress;
-        this.__props.dampedProgress.x = xProgress;
-        this.__props.dampedProgress.y = yProgress;
-      }
-      return this.__props;
-    }
-    /**
-     * Factor used for the `dampedProgress` props.
-     *
-     * @deprecated
-     * @todo v3 delete in favor of option API
-     */
-    dampFactor = null;
-    /**
-     * Precision for the `dampedProgress` props.
-     *
-     * @deprecated
-     * @todo v3 delete in favor of option API
-     */
-    dampPrecision = null;
-    /**
-     * Bind listeners.
-     */
-    constructor(element) {
-      super(element);
-      const render = () => {
-        scheduler.update(() => {
-          const renderFn = this.__callMethod("scrolledInView", this.props);
-          if ((0, import_utils.isFunction)(renderFn)) {
-            scheduler.render(() => {
-              renderFn(this.__props);
-            });
-          }
-        });
-      };
-      const delegate = {
-        handleEvent(event) {
-          delegate[event.type](event.detail[0]);
-        },
-        resized: () => {
-          this.shouldEvaluateProps = true;
-          render();
-        },
-        scrolled: (props) => {
-          if (!this.$services.has("ticked") && props.changed.y || props.changed.x) {
-            this.$services.enable("ticked");
-          }
-        },
-        ticked: () => {
-          const dampFactor = this.dampFactor ?? this.$options.dampFactor;
-          const dampPrecision = this.dampPrecision ?? this.$options.dampPrecision;
-          updateProps(this.__props, dampFactor, dampPrecision, "x");
-          updateProps(this.__props, dampFactor, dampPrecision, "y");
-          if (this.__props.dampedCurrent.x === this.__props.current.x && this.__props.dampedCurrent.y === this.__props.current.y) {
-            this.$services.disable("ticked");
-          }
-          render();
-        }
-      };
-      this.$on("before-mounted", () => {
-        this.$on("resized", delegate);
-        this.$on("scrolled", delegate);
-        this.$on("ticked", delegate);
-      });
-      this.$on("destroyed", () => {
-        this.$off("resized", delegate);
-        this.$off("scrolled", delegate);
-        this.$off("ticked", delegate);
-        this.__props.dampedCurrent.x = this.__props.current.x;
-        this.__props.dampedCurrent.y = this.__props.current.y;
-        this.__props.dampedProgress.x = this.__props.progress.x;
-        this.__props.dampedProgress.y = this.__props.progress.y;
-        render();
-      });
-    }
-    /**
-     * Mounted hook.
-     */
-    mounted() {
-      if ((0, import_utils.isFunction)(super.mounted)) {
-        super.mounted();
-      }
-    }
-    /**
-     * Resized hook.
-     */
-    resized(props) {
-      if ((0, import_utils.isFunction)(super.resized)) {
-        super.resized(props);
-      }
-    }
-    /**
-     * Scrolled hook.
-     */
-    scrolled(props) {
-      if ((0, import_utils.isFunction)(super.scrolled)) {
-        super.scrolled(props);
-      }
-    }
-    /**
-     * Ticked hook.
-     */
-    ticked(props) {
-      if ((0, import_utils.isFunction)(super.ticked)) {
-        super.ticked(props);
-      }
-    }
-    /**
-     * Destroyed hook.
-     */
-    destroyed() {
-      if ((0, import_utils.isFunction)(super.destroyed)) {
-        super.destroyed();
-      }
-    }
-  }
-  return WithScrolledInView;
-}
-if (module.exports.default) module.exports = module.exports.default;
-//# sourceMappingURL=withScrolledInView.cjs.map

package/decorators/withScrolledInView/withScrolledInView.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../packages/js-toolkit/decorators/withScrolledInView/withScrolledInView.ts"],
-  "sourcesContent": ["import type { BaseInterface, BaseDecorator } from '../../Base/types.js';\nimport type { Base, BaseProps, BaseConfig } from '../../Base/index.js';\nimport type {\n  RafServiceProps,\n  ScrollServiceProps,\n  ResizeServiceProps,\n} from '../../services/index.js';\nimport { withMountWhenInView } from '../withMountWhenInView.js';\nimport {\n  damp,\n  clamp,\n  clamp01,\n  getOffsetSizes,\n  isFunction,\n  useScheduler,\n} from '../../utils/index.js';\nimport { normalizeOffset, getEdges } from './utils.js';\n\nconst scheduler = useScheduler(['update', 'render']);\n\nexport interface WithScrolledInViewProps extends BaseProps {\n  $options: {\n    dampFactor: number;\n    dampPrecision: number;\n    offset: string;\n  };\n}\n\nexport type ScrollInViewProps = {\n  start: {\n    x: number;\n    y: number;\n  };\n  end: {\n    x: number;\n    y: number;\n  };\n  current: {\n    x: number;\n    y: number;\n  };\n  dampedCurrent: {\n    x: number;\n    y: number;\n  };\n  progress: {\n    x: number;\n    y: number;\n  };\n  dampedProgress: {\n    x: number;\n    y: number;\n  };\n};\n\nexport type WithScrolledInViewOptions = IntersectionObserverInit & {\n  useOffsetSizes?: boolean;\n};\n\nfunction updateProgress(\n  props: ScrollInViewProps,\n  axis: 'x' | 'y',\n  progressKey: 'progress' | 'dampedProgress',\n  currentKey: 'current' | 'dampedCurrent',\n) {\n  props[progressKey][axis] =\n    props.start[axis] === props.end[axis]\n      ? 0\n      : clamp01(\n          (props[currentKey][axis] - props.start[axis]) / (props.end[axis] - props.start[axis]),\n        );\n}\n\n/**\n * Update props on tick.\n */\nfunction updateProps(\n  props: ScrollInViewProps,\n  dampFactor: number,\n  dampPrecision: number,\n  axis: 'x' | 'y' = 'x',\n): void {\n  props.current[axis] = clamp(\n    axis === 'x' ? window.pageXOffset : window.pageYOffset,\n    props.start[axis],\n    props.end[axis],\n  );\n  props.dampedCurrent[axis] = damp(\n    props.current[axis],\n    props.dampedCurrent[axis],\n    dampFactor,\n    dampPrecision,\n  );\n  updateProgress(props, axis, 'progress', 'current');\n  updateProgress(props, axis, 'dampedProgress', 'dampedCurrent');\n}\n\nexport interface WithScrolledInViewInterface extends BaseInterface {\n  /**\n   * @type {ScrollInViewProps}\n   */\n  readonly props: ScrollInViewProps;\n  dampFactor?: number;\n  dampPrecision?: number;\n  mounted(): void;\n  resized(props: ResizeServiceProps): void;\n  scrolled(props: ScrollServiceProps): void;\n  ticked(props: RafServiceProps): void;\n  destroyed(): void;\n}\n\n/**\n * Add scrolled in view capabilities to a component.\n */\nexport function withScrolledInView<S extends Base = Base>(\n  BaseClass: typeof Base,\n  options: WithScrolledInViewOptions = {},\n): BaseDecorator<WithScrolledInViewInterface, S, WithScrolledInViewProps> {\n  /**\n   * Class.\n   */\n  class WithScrolledInView<T extends BaseProps = BaseProps> extends withMountWhenInView(\n    BaseClass,\n    options,\n  )<T & WithScrolledInViewProps> {\n    /**\n     * Config.\n     */\n    static config: BaseConfig = {\n      name: `${BaseClass.config.name}WithMountWhenInView`,\n      emits: ['scrolledInView'],\n      options: {\n        dampFactor: {\n          type: Number,\n          default: 0.1,\n        },\n        dampPrecision: {\n          type: Number,\n          default: 0.001,\n        },\n        offset: {\n          type: String,\n          default: 'start end / end start',\n        },\n      },\n    };\n\n    __props: ScrollInViewProps = {\n      start: {\n        x: 0,\n        y: 0,\n      },\n      end: {\n        x: 0,\n        y: 0,\n      },\n      current: {\n        x: 0,\n        y: 0,\n      },\n      dampedCurrent: {\n        x: 0,\n        y: 0,\n      },\n      progress: {\n        x: 0,\n        y: 0,\n      },\n      dampedProgress: {\n        x: 0,\n        y: 0,\n      },\n    };\n\n    shouldEvaluateProps = true;\n\n    get props() {\n      if (this.shouldEvaluateProps) {\n        this.shouldEvaluateProps = false;\n        const targetSizes = options.useOffsetSizes\n          ? getOffsetSizes(this.$el)\n          : this.$el.getBoundingClientRect();\n\n        targetSizes.y += window.pageYOffset;\n        targetSizes.x += window.pageXOffset;\n\n        const containerSizes = {\n          x: 0,\n          y: 0,\n          height: window.innerHeight,\n          width: window.innerWidth,\n        };\n\n        const offset = normalizeOffset(this.$options.offset);\n\n        // Y axis\n        const [yStart, yEnd] = getEdges('y', targetSizes, containerSizes, offset);\n        const yCurrent = clamp(window.pageYOffset, yStart, yEnd);\n        const yProgress = yStart === yEnd ? 0 : clamp01((yCurrent - yStart) / (yEnd - yStart));\n        // X axis\n        const [xStart, xEnd] = getEdges('x', targetSizes, containerSizes, offset);\n        const xCurrent = clamp(window.pageXOffset, xStart, xEnd);\n        const xProgress = xStart === xEnd ? 0 : clamp01((xCurrent - xStart) / (xEnd - xStart));\n\n        this.__props.start.x = xStart;\n        this.__props.start.y = yStart;\n        this.__props.end.x = xEnd;\n        this.__props.end.y = yEnd;\n        this.__props.current.x = xCurrent;\n        this.__props.current.y = yCurrent;\n        this.__props.dampedCurrent.x = xCurrent;\n        this.__props.dampedCurrent.y = yCurrent;\n        this.__props.progress.x = xProgress;\n        this.__props.progress.y = yProgress;\n        this.__props.dampedProgress.x = xProgress;\n        this.__props.dampedProgress.y = yProgress;\n      }\n\n      return this.__props;\n    }\n\n    /**\n     * Factor used for the `dampedProgress` props.\n     *\n     * @deprecated\n     * @todo v3 delete in favor of option API\n     */\n    dampFactor?: number = null;\n\n    /**\n     * Precision for the `dampedProgress` props.\n     *\n     * @deprecated\n     * @todo v3 delete in favor of option API\n     */\n    dampPrecision?: number = null;\n\n    /**\n     * Bind listeners.\n     */\n    constructor(element: HTMLElement) {\n      super(element);\n\n      const render = () => {\n        scheduler.update(() => {\n          // @ts-ignore\n          const renderFn = this.__callMethod('scrolledInView', this.props);\n          if (isFunction(renderFn)) {\n            scheduler.render(() => {\n              renderFn(this.__props);\n            });\n          }\n        });\n      };\n\n      const delegate = {\n        handleEvent(event) {\n          delegate[event.type](event.detail[0]);\n        },\n        resized: () => {\n          this.shouldEvaluateProps = true;\n          render();\n        },\n        scrolled: (props) => {\n          if ((!this.$services.has('ticked') && props.changed.y) || props.changed.x) {\n            this.$services.enable('ticked');\n          }\n        },\n        ticked: () => {\n          const dampFactor = this.dampFactor ?? this.$options.dampFactor;\n          const dampPrecision = this.dampPrecision ?? this.$options.dampPrecision;\n          updateProps(this.__props, dampFactor, dampPrecision, 'x');\n          updateProps(this.__props, dampFactor, dampPrecision, 'y');\n\n          if (\n            this.__props.dampedCurrent.x === this.__props.current.x &&\n            this.__props.dampedCurrent.y === this.__props.current.y\n          ) {\n            this.$services.disable('ticked');\n          }\n\n          render();\n        },\n      };\n\n      this.$on('before-mounted', () => {\n        this.$on('resized', delegate);\n        this.$on('scrolled', delegate);\n        this.$on('ticked', delegate);\n      });\n\n      this.$on('destroyed', () => {\n        this.$off('resized', delegate);\n        this.$off('scrolled', delegate);\n        this.$off('ticked', delegate);\n\n        // Clamp damped values to their final value and trigger one last render on destroy\n        this.__props.dampedCurrent.x = this.__props.current.x;\n        this.__props.dampedCurrent.y = this.__props.current.y;\n        this.__props.dampedProgress.x = this.__props.progress.x;\n        this.__props.dampedProgress.y = this.__props.progress.y;\n        render();\n      });\n    }\n\n    /**\n     * Mounted hook.\n     */\n    mounted() {\n      // @ts-ignore\n      if (isFunction(super.mounted)) {\n        // @ts-ignore\n        super.mounted();\n      }\n    }\n\n    /**\n     * Resized hook.\n     */\n    resized(props: ResizeServiceProps) {\n      // @ts-ignore\n      if (isFunction(super.resized)) {\n        // @ts-ignore\n        super.resized(props);\n      }\n    }\n\n    /**\n     * Scrolled hook.\n     */\n    scrolled(props: ScrollServiceProps) {\n      // @ts-ignore\n      if (isFunction(super.scrolled)) {\n        // @ts-ignore\n        super.scrolled(props);\n      }\n    }\n\n    /**\n     * Ticked hook.\n     */\n    ticked(props: RafServiceProps) {\n      // @ts-ignore\n      if (isFunction(super.ticked)) {\n        // @ts-ignore\n        super.ticked(props);\n      }\n    }\n\n    /**\n     * Destroyed hook.\n     */\n    destroyed() {\n      // @ts-ignore\n      if (isFunction(super.destroyed)) {\n        // @ts-ignore\n        super.destroyed();\n      }\n    }\n  }\n\n  // @ts-ignore\n  return WithScrolledInView;\n}\n"],
-  "mappings": "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",
-  "names": ["import_utils"]
-}

package/decorators/withVue2.cjs

@@ -1,68 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// packages/js-toolkit/decorators/withVue2.ts
-var withVue2_exports = {};
-__export(withVue2_exports, {
-  withVue2: () => withVue2
-});
-module.exports = __toCommonJS(withVue2_exports);
-var import_utils = require("../utils/index.cjs");
-function withVue2(BaseClass, VueCtor) {
-  class WithVue2 extends BaseClass {
-    static config = {
-      ...BaseClass.config,
-      name: `${BaseClass.config.name}WithVue`,
-      refs: [...BaseClass.config?.refs ?? [], "vue"]
-    };
-    $vue;
-    /**
-     * Vue app configuration.
-     */
-    static vueConfig;
-    constructor(element) {
-      super(element);
-      const vueConfig = this.vueConfig ?? this.constructor.vueConfig;
-      if (!vueConfig) {
-        if (import_utils.isDev) {
-          throw new Error("[withVue] You must define a `vueConfig` object.");
-        }
-        return;
-      }
-      if (!(0, import_utils.isFunction)(vueConfig.render)) {
-        if (import_utils.isDev) {
-          throw new Error("[withVue] You must define a `render` function in vueConfig.");
-        }
-        return;
-      }
-      this.$vue = new VueCtor(vueConfig);
-      this.$on("mounted", () => {
-        if (!(this.$refs.vue instanceof HTMLElement)) {
-          throw new Error("[withVue] The `vue` refs must be a single HTMLElement.");
-        }
-        this.$vue.$mount(this.$refs.vue);
-      });
-      this.$on("destroyed", () => {
-        this.$vue.$destroy();
-      });
-    }
-  }
-  return WithVue2;
-}
-if (module.exports.default) module.exports = module.exports.default;
-//# sourceMappingURL=withVue2.cjs.map

package/decorators/withVue2.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../packages/js-toolkit/decorators/withVue2.ts"],
-  "sourcesContent": ["import type Vue from 'vue';\nimport type { ComponentOptions, VueConstructor } from 'vue';\nimport type { BaseDecorator, BaseInterface } from '../Base/types.js';\nimport type { Base, BaseConfig, BaseProps } from '../Base/index.js';\nimport { isDev, isFunction } from '../utils/index.js';\n\nexport interface WithVue2Props extends BaseProps {\n  $refs: {\n    vue: HTMLElement;\n  };\n}\n\nexport interface WithVue2Interface extends BaseInterface {\n  $vue: Vue;\n}\n\n/**\n * withVue decorator.\n */\nexport function withVue2<S extends Base, T extends Vue = Vue>(\n  BaseClass: typeof Base,\n  VueCtor: VueConstructor,\n): BaseDecorator<WithVue2Interface, S, WithVue2Props> {\n  type VueConfig = ComponentOptions<T> & {\n    render: ComponentOptions<T>['render'];\n  };\n\n  /**\n   * Class.\n   */\n  class WithVue2 extends BaseClass {\n    static config: BaseConfig = {\n      ...BaseClass.config,\n      name: `${BaseClass.config.name}WithVue`,\n      refs: [...(BaseClass.config?.refs ?? []), 'vue'],\n    };\n\n    $vue: Vue;\n\n    /**\n     * Vue app configuration.\n     */\n    static vueConfig: VueConfig;\n\n    constructor(element: HTMLElement) {\n      super(element);\n\n      // @ts-ignore\n      const vueConfig: VueConfig = this.vueConfig ?? this.constructor.vueConfig;\n\n      if (!vueConfig) {\n        if (isDev) {\n          throw new Error('[withVue] You must define a `vueConfig` object.');\n        }\n        return;\n      }\n\n      if (!isFunction(vueConfig.render)) {\n        if (isDev) {\n          throw new Error('[withVue] You must define a `render` function in vueConfig.');\n        }\n        return;\n      }\n\n      this.$vue = new VueCtor(vueConfig);\n\n      this.$on('mounted', () => {\n        if (!(this.$refs.vue instanceof HTMLElement)) {\n          throw new Error('[withVue] The `vue` refs must be a single HTMLElement.');\n        }\n\n        this.$vue.$mount(this.$refs.vue);\n      });\n\n      this.$on('destroyed', () => {\n        this.$vue.$destroy();\n      });\n    }\n  }\n\n  // @ts-ignore\n  return WithVue2;\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,mBAAkC;AAe3B,SAAS,SACd,WACA,SACoD;AAAA,EAQpD,MAAM,iBAAiB,UAAU;AAAA,IAC/B,OAAO,SAAqB;AAAA,MAC1B,GAAG,UAAU;AAAA,MACb,MAAM,GAAG,UAAU,OAAO,IAAI;AAAA,MAC9B,MAAM,CAAC,GAAI,UAAU,QAAQ,QAAQ,CAAC,GAAI,KAAK;AAAA,IACjD;AAAA,IAEA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAO;AAAA,IAEP,YAAY,SAAsB;AAChC,YAAM,OAAO;AAGb,YAAM,YAAuB,KAAK,aAAa,KAAK,YAAY;AAEhE,UAAI,CAAC,WAAW;AACd,YAAI,oBAAO;AACT,gBAAM,IAAI,MAAM,iDAAiD;AAAA,QACnE;AACA;AAAA,MACF;AAEA,UAAI,KAAC,yBAAW,UAAU,MAAM,GAAG;AACjC,YAAI,oBAAO;AACT,gBAAM,IAAI,MAAM,6DAA6D;AAAA,QAC/E;AACA;AAAA,MACF;AAEA,WAAK,OAAO,IAAI,QAAQ,SAAS;AAEjC,WAAK,IAAI,WAAW,MAAM;AACxB,YAAI,EAAE,KAAK,MAAM,eAAe,cAAc;AAC5C,gBAAM,IAAI,MAAM,wDAAwD;AAAA,QAC1E;AAEA,aAAK,KAAK,OAAO,KAAK,MAAM,GAAG;AAAA,MACjC,CAAC;AAED,WAAK,IAAI,aAAa,MAAM;AAC1B,aAAK,KAAK,SAAS;AAAA,MACrB,CAAC;AAAA,IACH;AAAA,EACF;AAGA,SAAO;AACT;",
-  "names": []
-}

package/decorators/withVue2.d.ts

@@ -1,16 +0,0 @@
-import type Vue from 'vue';
-import type { VueConstructor } from 'vue';
-import type { BaseDecorator, BaseInterface } from '../Base/types.js';
-import type { Base, BaseProps } from '../Base/index.js';
-export interface WithVue2Props extends BaseProps {
-    $refs: {
-        vue: HTMLElement;
-    };
-}
-export interface WithVue2Interface extends BaseInterface {
-    $vue: Vue;
-}
-/**
- * withVue decorator.
- */
-export declare function withVue2<S extends Base, T extends Vue = Vue>(BaseClass: typeof Base, VueCtor: VueConstructor): BaseDecorator<WithVue2Interface, S, WithVue2Props>;

package/decorators/withVue2.js

@@ -1,46 +0,0 @@
-import { isDev, isFunction } from "../utils/index.js";
-function withVue2(BaseClass, VueCtor) {
-  class WithVue2 extends BaseClass {
-    static config = {
-      ...BaseClass.config,
-      name: `${BaseClass.config.name}WithVue`,
-      refs: [...BaseClass.config?.refs ?? [], "vue"]
-    };
-    $vue;
-    /**
-     * Vue app configuration.
-     */
-    static vueConfig;
-    constructor(element) {
-      super(element);
-      const vueConfig = this.vueConfig ?? this.constructor.vueConfig;
-      if (!vueConfig) {
-        if (isDev) {
-          throw new Error("[withVue] You must define a `vueConfig` object.");
-        }
-        return;
-      }
-      if (!isFunction(vueConfig.render)) {
-        if (isDev) {
-          throw new Error("[withVue] You must define a `render` function in vueConfig.");
-        }
-        return;
-      }
-      this.$vue = new VueCtor(vueConfig);
-      this.$on("mounted", () => {
-        if (!(this.$refs.vue instanceof HTMLElement)) {
-          throw new Error("[withVue] The `vue` refs must be a single HTMLElement.");
-        }
-        this.$vue.$mount(this.$refs.vue);
-      });
-      this.$on("destroyed", () => {
-        this.$vue.$destroy();
-      });
-    }
-  }
-  return WithVue2;
-}
-export {
-  withVue2
-};
-//# sourceMappingURL=withVue2.js.map

package/decorators/withVue2.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../packages/js-toolkit/decorators/withVue2.ts"],
-  "sourcesContent": ["import type Vue from 'vue';\nimport type { ComponentOptions, VueConstructor } from 'vue';\nimport type { BaseDecorator, BaseInterface } from '../Base/types.js';\nimport type { Base, BaseConfig, BaseProps } from '../Base/index.js';\nimport { isDev, isFunction } from '../utils/index.js';\n\nexport interface WithVue2Props extends BaseProps {\n  $refs: {\n    vue: HTMLElement;\n  };\n}\n\nexport interface WithVue2Interface extends BaseInterface {\n  $vue: Vue;\n}\n\n/**\n * withVue decorator.\n */\nexport function withVue2<S extends Base, T extends Vue = Vue>(\n  BaseClass: typeof Base,\n  VueCtor: VueConstructor,\n): BaseDecorator<WithVue2Interface, S, WithVue2Props> {\n  type VueConfig = ComponentOptions<T> & {\n    render: ComponentOptions<T>['render'];\n  };\n\n  /**\n   * Class.\n   */\n  class WithVue2 extends BaseClass {\n    static config: BaseConfig = {\n      ...BaseClass.config,\n      name: `${BaseClass.config.name}WithVue`,\n      refs: [...(BaseClass.config?.refs ?? []), 'vue'],\n    };\n\n    $vue: Vue;\n\n    /**\n     * Vue app configuration.\n     */\n    static vueConfig: VueConfig;\n\n    constructor(element: HTMLElement) {\n      super(element);\n\n      // @ts-ignore\n      const vueConfig: VueConfig = this.vueConfig ?? this.constructor.vueConfig;\n\n      if (!vueConfig) {\n        if (isDev) {\n          throw new Error('[withVue] You must define a `vueConfig` object.');\n        }\n        return;\n      }\n\n      if (!isFunction(vueConfig.render)) {\n        if (isDev) {\n          throw new Error('[withVue] You must define a `render` function in vueConfig.');\n        }\n        return;\n      }\n\n      this.$vue = new VueCtor(vueConfig);\n\n      this.$on('mounted', () => {\n        if (!(this.$refs.vue instanceof HTMLElement)) {\n          throw new Error('[withVue] The `vue` refs must be a single HTMLElement.');\n        }\n\n        this.$vue.$mount(this.$refs.vue);\n      });\n\n      this.$on('destroyed', () => {\n        this.$vue.$destroy();\n      });\n    }\n  }\n\n  // @ts-ignore\n  return WithVue2;\n}\n"],
-  "mappings": "AAIA,SAAS,OAAO,kBAAkB;AAe3B,SAAS,SACd,WACA,SACoD;AAAA,EAQpD,MAAM,iBAAiB,UAAU;AAAA,IAC/B,OAAO,SAAqB;AAAA,MAC1B,GAAG,UAAU;AAAA,MACb,MAAM,GAAG,UAAU,OAAO,IAAI;AAAA,MAC9B,MAAM,CAAC,GAAI,UAAU,QAAQ,QAAQ,CAAC,GAAI,KAAK;AAAA,IACjD;AAAA,IAEA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAO;AAAA,IAEP,YAAY,SAAsB;AAChC,YAAM,OAAO;AAGb,YAAM,YAAuB,KAAK,aAAa,KAAK,YAAY;AAEhE,UAAI,CAAC,WAAW;AACd,YAAI,OAAO;AACT,gBAAM,IAAI,MAAM,iDAAiD;AAAA,QACnE;AACA;AAAA,MACF;AAEA,UAAI,CAAC,WAAW,UAAU,MAAM,GAAG;AACjC,YAAI,OAAO;AACT,gBAAM,IAAI,MAAM,6DAA6D;AAAA,QAC/E;AACA;AAAA,MACF;AAEA,WAAK,OAAO,IAAI,QAAQ,SAAS;AAEjC,WAAK,IAAI,WAAW,MAAM;AACxB,YAAI,EAAE,KAAK,MAAM,eAAe,cAAc;AAC5C,gBAAM,IAAI,MAAM,wDAAwD;AAAA,QAC1E;AAEA,aAAK,KAAK,OAAO,KAAK,MAAM,GAAG;AAAA,MACjC,CAAC;AAED,WAAK,IAAI,aAAa,MAAM;AAC1B,aAAK,KAAK,SAAS;AAAA,MACrB,CAAC;AAAA,IACH;AAAA,EACF;AAGA,SAAO;AACT;",
-  "names": []
-}

package/helpers/createApp.cjs

@@ -1,58 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// packages/js-toolkit/helpers/createApp.ts
-var createApp_exports = {};
-__export(createApp_exports, {
-  default: () => createApp
-});
-module.exports = __toCommonJS(createApp_exports);
-var import_features = require("../Base/features.cjs");
-var import_utils = require("../utils/index.cjs");
-function createApp(App, rootElement = document.body) {
-  let app;
-  const options = rootElement instanceof HTMLElement ? { root: rootElement, features: void 0 } : { root: document.body, ...rootElement };
-  if ((0, import_utils.isDefined)(options.features)) {
-    for (const [feature, value] of Object.entries(options.features)) {
-      import_features.features.set(feature, value);
-    }
-  }
-  function init() {
-    app = new App(options.root).$mount();
-    return app;
-  }
-  let p;
-  if (import_features.features.get("asyncChildren")) {
-    p = Promise.resolve(init());
-  } else {
-    p = new Promise((resolve) => {
-      if (document.readyState === "complete") {
-        resolve(init());
-      } else {
-        document.addEventListener("readystatechange", () => {
-          if (document.readyState === "complete") {
-            resolve(init());
-          }
-        });
-      }
-    });
-  }
-  return () => p;
-}
-if (module.exports.default) module.exports = module.exports.default;
-//# sourceMappingURL=createApp.cjs.map

package/helpers/createApp.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../packages/js-toolkit/helpers/createApp.ts"],
-  "sourcesContent": ["import type { Base, BaseConstructor, BaseProps } from '../Base/index.js';\nimport type { Features } from '../Base/features.js';\nimport { features } from '../Base/features.js';\nimport { isDefined } from '../utils/index.js';\n\nexport type CreateAppOptions = {\n  root: HTMLElement;\n  features: Features;\n};\n\n/**\n * Instantiate and mount the given component on the given root element when the page has been loaded\n * and return a function to use the app instance when it is ready.\n */\nexport default function createApp<S extends BaseConstructor<Base>, T extends BaseProps = BaseProps>(\n  App: S,\n  rootElement: HTMLElement | Partial<CreateAppOptions> = document.body,\n): () => Promise<S & Base<T>> {\n  let app: S & Base<T>;\n  const options =\n    rootElement instanceof HTMLElement\n      ? { root: rootElement, features: undefined }\n      : { root: document.body, ...rootElement };\n\n  if (isDefined(options.features)) {\n    for (const [feature, value] of Object.entries(options.features as Features)) {\n      features.set(feature as keyof Features, value);\n    }\n  }\n\n  function init() {\n    app = (new App(options.root) as S & Base<T>).$mount();\n    return app;\n  }\n\n  let p: Promise<S & Base<T>>;\n\n  if (features.get('asyncChildren')) {\n    p = Promise.resolve(init());\n  } else {\n    p = new Promise<S & Base<T>>((resolve) => {\n      if (document.readyState === 'complete') {\n        resolve(init());\n      } else {\n        document.addEventListener('readystatechange', () => {\n          if (document.readyState === 'complete') {\n            resolve(init());\n          }\n        });\n      }\n    });\n  }\n\n  return () => p;\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,sBAAyB;AACzB,mBAA0B;AAWX,SAAR,UACL,KACA,cAAuD,SAAS,MACpC;AAC5B,MAAI;AACJ,QAAM,UACJ,uBAAuB,cACnB,EAAE,MAAM,aAAa,UAAU,OAAU,IACzC,EAAE,MAAM,SAAS,MAAM,GAAG,YAAY;AAE5C,UAAI,wBAAU,QAAQ,QAAQ,GAAG;AAC/B,eAAW,CAAC,SAAS,KAAK,KAAK,OAAO,QAAQ,QAAQ,QAAoB,GAAG;AAC3E,+BAAS,IAAI,SAA2B,KAAK;AAAA,IAC/C;AAAA,EACF;AAEA,WAAS,OAAO;AACd,UAAO,IAAI,IAAI,QAAQ,IAAI,EAAkB,OAAO;AACpD,WAAO;AAAA,EACT;AAEA,MAAI;AAEJ,MAAI,yBAAS,IAAI,eAAe,GAAG;AACjC,QAAI,QAAQ,QAAQ,KAAK,CAAC;AAAA,EAC5B,OAAO;AACL,QAAI,IAAI,QAAqB,CAAC,YAAY;AACxC,UAAI,SAAS,eAAe,YAAY;AACtC,gBAAQ,KAAK,CAAC;AAAA,MAChB,OAAO;AACL,iBAAS,iBAAiB,oBAAoB,MAAM;AAClD,cAAI,SAAS,eAAe,YAAY;AACtC,oBAAQ,KAAK,CAAC;AAAA,UAChB;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF,CAAC;AAAA,EACH;AAEA,SAAO,MAAM;AACf;",
-  "names": []
-}