@milaboratories/uikit 2.2.90 → 2.2.91

package/dist/composition/useQuery.js

@@ -0,0 +1,30 @@
+import { reactive as s } from "vue";
+import { debounce as n } from "../lib/util/helpers/dist/index.js";
+function c(o) {
+  const r = s({
+    isLoading: !1,
+    result: void 0,
+    error: void 0,
+    async run(...e) {
+      this.isLoading = !0, this.error = void 0;
+      try {
+        this.result = await o(...e);
+      } catch (i) {
+        this.error = i;
+      } finally {
+        this.isLoading = !1;
+      }
+    },
+    debounce(e, i = 1e3) {
+      return n(() => {
+        const t = e();
+        this.run(...t).catch(console.error);
+      }, i);
+    }
+  });
+  return r.run = r.run.bind(r), r;
+}
+export {
+  c as useQuery
+};
+//# sourceMappingURL=useQuery.js.map

package/dist/composition/useQuery.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useQuery.js","sources":["../../src/composition/useQuery.ts"],"sourcesContent":["import { reactive } from 'vue';\nimport { debounce } from '@milaboratories/helpers';\n\nexport function useQuery<P extends unknown[], R>(fn: (...args: P) => Promise<R>) {\n  const self = reactive({\n    isLoading: false,\n    result: undefined as R | undefined,\n    error: undefined as unknown,\n    async run(...args: P) {\n      this.isLoading = true;\n      this.error = undefined;\n      try {\n        this.result = await fn(...args);\n      } catch (err: unknown) {\n        this.error = err;\n      } finally {\n        this.isLoading = false;\n      }\n    },\n    debounce(cb: () => P, dt = 1000) {\n      return debounce(() => {\n        const args = cb();\n        this.run(...args).catch(console.error);\n      }, dt);\n    },\n  });\n\n  self.run = self.run.bind(self);\n\n  return self;\n}\n"],"names":["useQuery","fn","self","reactive","args","err","cb","dt","debounce"],"mappings":";;AAGO,SAASA,EAAiCC,GAAgC;AAC/E,QAAMC,IAAOC,EAAS;AAAA,IACpB,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,MAAM,OAAOC,GAAS;AACpB,WAAK,YAAY,IACjB,KAAK,QAAQ;AACT,UAAA;AACF,aAAK,SAAS,MAAMH,EAAG,GAAGG,CAAI;AAAA,eACvBC,GAAc;AACrB,aAAK,QAAQA;AAAA,MAAA,UACb;AACA,aAAK,YAAY;AAAA,MAAA;AAAA,IAErB;AAAA,IACA,SAASC,GAAaC,IAAK,KAAM;AAC/B,aAAOC,EAAS,MAAM;AACpB,cAAMJ,IAAOE,EAAG;AAChB,aAAK,IAAI,GAAGF,CAAI,EAAE,MAAM,QAAQ,KAAK;AAAA,SACpCG,CAAE;AAAA,IAAA;AAAA,EACP,CACD;AAED,SAAAL,EAAK,MAAMA,EAAK,IAAI,KAAKA,CAAI,GAEtBA;AACT;"}

package/dist/composition/useResizeObserver.d.ts

@@ -0,0 +1,3 @@
+import { MaybeRef } from '../types';
+export declare function useResizeObserver<T extends HTMLElement>(target: MaybeRef<T | undefined>, cb: (el?: T | undefined) => void): void;
+//# sourceMappingURL=useResizeObserver.d.ts.map

package/dist/composition/useResizeObserver.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useResizeObserver.d.ts","sourceRoot":"","sources":["../../src/composition/useResizeObserver.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAEzC,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,WAAW,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC,GAAG,SAAS,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,SAAS,KAAK,IAAI,QAYzH"}

package/dist/composition/useResizeObserver.js

@@ -0,0 +1,19 @@
+import { onUnmounted as m, unref as e } from "vue";
+import { tapIf as i } from "../helpers/functions.js";
+import { onChanged as s } from "./utils.js";
+import { stopResizeObserving as t, startResizeObserving as f } from "../global/resizeObserver.js";
+function z(r, n) {
+  s(() => {
+    i(e(r), (o) => {
+      f(o, () => n(o));
+    });
+  }), m(() => {
+    i(e(r), (o) => {
+      t(o);
+    });
+  });
+}
+export {
+  z as useResizeObserver
+};
+//# sourceMappingURL=useResizeObserver.js.map

package/dist/composition/useResizeObserver.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useResizeObserver.js","sources":["../../src/composition/useResizeObserver.ts"],"sourcesContent":["import { onUnmounted, unref } from 'vue';\nimport { tapIf } from '../helpers/functions';\nimport { onChanged } from './utils';\nimport { startResizeObserving, stopResizeObserving } from '../global/resizeObserver';\nimport type { MaybeRef } from '../types';\n\nexport function useResizeObserver<T extends HTMLElement>(target: MaybeRef<T | undefined>, cb: (el?: T | undefined) => void) {\n  onChanged(() => {\n    tapIf(unref(target), (el) => {\n      startResizeObserving(el, () => cb(el));\n    });\n  });\n\n  onUnmounted(() => {\n    tapIf(unref(target), (el) => {\n      stopResizeObserving(el);\n    });\n  });\n}\n"],"names":["useResizeObserver","target","cb","onChanged","tapIf","unref","el","startResizeObserving","onUnmounted","stopResizeObserving"],"mappings":";;;;AAMgB,SAAAA,EAAyCC,GAAiCC,GAAkC;AAC1H,EAAAC,EAAU,MAAM;AACd,IAAAC,EAAMC,EAAMJ,CAAM,GAAG,CAACK,MAAO;AAC3B,MAAAC,EAAqBD,GAAI,MAAMJ,EAAGI,CAAE,CAAC;AAAA,IAAA,CACtC;AAAA,EAAA,CACF,GAEDE,EAAY,MAAM;AAChB,IAAAJ,EAAMC,EAAMJ,CAAM,GAAG,CAACK,MAAO;AAC3B,MAAAG,EAAoBH,CAAE;AAAA,IAAA,CACvB;AAAA,EAAA,CACF;AACH;"}

package/dist/composition/useRipple.d.ts

@@ -0,0 +1,3 @@
+import { Ref } from 'vue';
+export declare function useRipple(el: Ref<HTMLElement | undefined>): void;
+//# sourceMappingURL=useRipple.d.ts.map

package/dist/composition/useRipple.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRipple.d.ts","sourceRoot":"","sources":["../../src/composition/useRipple.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAG/B,wBAAgB,SAAS,CAAC,EAAE,EAAE,GAAG,CAAC,WAAW,GAAG,SAAS,CAAC,QAyBzD"}

package/dist/composition/useRipple.js

@@ -0,0 +1,17 @@
+import { onMounted as o } from "vue";
+function a(c) {
+  function p(e) {
+    const t = e.currentTarget, i = document.createElement("span"), l = Math.max(t.clientWidth, t.clientHeight), n = l / 2;
+    i.style.width = i.style.height = `${l}px`, i.style.left = `${e.clientX - t.offsetLeft - n}px`, i.style.top = `${e.clientY - t.offsetTop - n}px`, i.classList.add("ripple");
+    const s = t.getElementsByClassName("ripple")[0];
+    s && s.remove(), t.appendChild(i);
+  }
+  o(() => {
+    var e;
+    (e = c.value) == null || e.addEventListener("click", p);
+  });
+}
+export {
+  a as useRipple
+};
+//# sourceMappingURL=useRipple.js.map

package/dist/composition/useRipple.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRipple.js","sources":["../../src/composition/useRipple.ts"],"sourcesContent":["import type { Ref } from 'vue';\nimport { onMounted } from 'vue';\n\nexport function useRipple(el: Ref<HTMLElement | undefined>) {\n  function createRipple(event: MouseEvent) {\n    const button = event.currentTarget as HTMLButtonElement;\n\n    const circle = document.createElement('span');\n    const diameter = Math.max(button.clientWidth, button.clientHeight);\n    const radius = diameter / 2;\n\n    circle.style.width = circle.style.height = `${diameter}px`;\n    circle.style.left = `${event.clientX - button.offsetLeft - radius}px`;\n    circle.style.top = `${event.clientY - button.offsetTop - radius}px`;\n    circle.classList.add('ripple');\n\n    const ripple = button.getElementsByClassName('ripple')[0];\n\n    if (ripple) {\n      ripple.remove();\n    }\n\n    button.appendChild(circle);\n  }\n\n  onMounted(() => {\n    el.value?.addEventListener('click', createRipple);\n  });\n}\n"],"names":["useRipple","el","createRipple","event","button","circle","diameter","radius","ripple","onMounted","_a"],"mappings":";AAGO,SAASA,EAAUC,GAAkC;AAC1D,WAASC,EAAaC,GAAmB;AACvC,UAAMC,IAASD,EAAM,eAEfE,IAAS,SAAS,cAAc,MAAM,GACtCC,IAAW,KAAK,IAAIF,EAAO,aAAaA,EAAO,YAAY,GAC3DG,IAASD,IAAW;AAE1B,IAAAD,EAAO,MAAM,QAAQA,EAAO,MAAM,SAAS,GAAGC,CAAQ,MACtDD,EAAO,MAAM,OAAO,GAAGF,EAAM,UAAUC,EAAO,aAAaG,CAAM,MACjEF,EAAO,MAAM,MAAM,GAAGF,EAAM,UAAUC,EAAO,YAAYG,CAAM,MACxDF,EAAA,UAAU,IAAI,QAAQ;AAE7B,UAAMG,IAASJ,EAAO,uBAAuB,QAAQ,EAAE,CAAC;AAExD,IAAII,KACFA,EAAO,OAAO,GAGhBJ,EAAO,YAAYC,CAAM;AAAA,EAAA;AAG3B,EAAAI,EAAU,MAAM;;AACX,KAAAC,IAAAT,EAAA,UAAA,QAAAS,EAAO,iBAAiB,SAASR;AAAA,EAAY,CACjD;AACH;"}

package/dist/composition/useScroll.d.ts

@@ -0,0 +1,3 @@
+import { Ref } from 'vue';
+export declare function useScroll($el: Ref<HTMLElement | undefined>, fadeHeight?: number | null, fadeWidth?: number | null): void;
+//# sourceMappingURL=useScroll.d.ts.map

package/dist/composition/useScroll.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useScroll.d.ts","sourceRoot":"","sources":["../../src/composition/useScroll.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAAa,MAAM,KAAK,CAAC;AAI1C,wBAAgB,SAAS,CAAC,GAAG,EAAE,GAAG,CAAC,WAAW,GAAG,SAAS,CAAC,EAAE,UAAU,GAAE,MAAM,GAAG,IAAW,EAAE,SAAS,GAAE,MAAM,GAAG,IAAW,QAkE7H"}

package/dist/composition/useScroll.js

@@ -0,0 +1,44 @@
+import { onMounted as y } from "vue";
+import { useEventListener as p } from "./useEventListener.js";
+import { requestTick as b } from "../helpers/utils.js";
+function S(m, s = null, e = null) {
+  function f(t) {
+    const { scrollTop: o, scrollHeight: n, clientHeight: r } = t;
+    if (!(n > r) || !s)
+      return null;
+    const c = n - o - r, l = o > s ? s : 0, i = c > s ? r - s - l : r;
+    return `linear-gradient(
+        to bottom,
+        transparent,
+        black ${l}px,
+        black ${i}px,
+        transparent 100%
+      )`;
+  }
+  function k(t) {
+    const { scrollLeft: o, scrollWidth: n, clientWidth: r } = t;
+    if (!(n > r) || !e)
+      return null;
+    const c = n - o - r, l = o > e ? e : 0, i = c > e ? r - e - l : r;
+    return `linear-gradient(
+        to right,
+        transparent,
+        black ${l}px,
+        black ${i}px,
+        transparent 100%
+      )`;
+  }
+  function a() {
+    const t = m.value;
+    if (!t)
+      return;
+    const o = [f(t), k(t)].filter((n) => n !== null);
+    t.style.setProperty("-webkit-mask-image", o.join(",")), t.style.setProperty("mask-image", o.join(",")), o.length > 1 && (t.style.setProperty("-webkit-mask-composite", "source-in"), t.style.setProperty("mask-composite", "source-in"));
+  }
+  const u = b(a);
+  y(a), p(window, "scroll", u, !0), p(window, "resize", u, !0);
+}
+export {
+  S as useScroll
+};
+//# sourceMappingURL=useScroll.js.map

package/dist/composition/useScroll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useScroll.js","sources":["../../src/composition/useScroll.ts"],"sourcesContent":["import { type Ref, onMounted } from 'vue';\nimport { useEventListener } from './useEventListener';\nimport { requestTick } from '../helpers/utils';\n\nexport function useScroll($el: Ref<HTMLElement | undefined>, fadeHeight: number | null = null, fadeWidth: number | null = null) {\n  function getYMask(el: HTMLElement) {\n    const { scrollTop, scrollHeight, clientHeight } = el;\n\n    const hasScroll = scrollHeight > clientHeight;\n\n    if (!hasScroll || !fadeHeight) {\n      return null;\n    }\n\n    const scrollBottom = scrollHeight - scrollTop - clientHeight;\n    const offsetTop = scrollTop > fadeHeight ? fadeHeight : 0;\n    const offsetBottom = scrollBottom > fadeHeight ? clientHeight - fadeHeight - offsetTop : clientHeight;\n\n    return `linear-gradient(\n        to bottom,\n        transparent,\n        black ${offsetTop}px,\n        black ${offsetBottom}px,\n        transparent 100%\n      )`;\n  }\n\n  function getXMask(el: HTMLElement) {\n    const { scrollLeft, scrollWidth, clientWidth } = el;\n\n    const hasScroll = scrollWidth > clientWidth;\n\n    if (!hasScroll || !fadeWidth) {\n      return null;\n    }\n\n    const scrollRight = scrollWidth - scrollLeft - clientWidth;\n    const offsetLeft = scrollLeft > fadeWidth ? fadeWidth : 0;\n    const offsetRight = scrollRight > fadeWidth ? clientWidth - fadeWidth - offsetLeft : clientWidth;\n\n    return `linear-gradient(\n        to right,\n        transparent,\n        black ${offsetLeft}px,\n        black ${offsetRight}px,\n        transparent 100%\n      )`;\n  }\n\n  function update() {\n    const el = $el.value;\n\n    if (!el) {\n      return;\n    }\n\n    const masks = [getYMask(el), getXMask(el)].filter((m) => m !== null);\n    el.style.setProperty('-webkit-mask-image', masks.join(','));\n    el.style.setProperty('mask-image', masks.join(','));\n    if (masks.length > 1) {\n      el.style.setProperty('-webkit-mask-composite', 'source-in');\n      el.style.setProperty('mask-composite', 'source-in');\n    }\n  }\n\n  const handle = requestTick(update);\n\n  onMounted(update);\n  useEventListener(window, 'scroll', handle, true);\n  useEventListener(window, 'resize', handle, true);\n}\n"],"names":["useScroll","$el","fadeHeight","fadeWidth","getYMask","el","scrollTop","scrollHeight","clientHeight","scrollBottom","offsetTop","offsetBottom","getXMask","scrollLeft","scrollWidth","clientWidth","scrollRight","offsetLeft","offsetRight","update","masks","m","handle","requestTick","onMounted","useEventListener"],"mappings":";;;AAIO,SAASA,EAAUC,GAAmCC,IAA4B,MAAMC,IAA2B,MAAM;AAC9H,WAASC,EAASC,GAAiB;AACjC,UAAM,EAAE,WAAAC,GAAW,cAAAC,GAAc,cAAAC,EAAiB,IAAAH;AAI9C,QAAA,EAFcE,IAAeC,MAEf,CAACN;AACV,aAAA;AAGH,UAAAO,IAAeF,IAAeD,IAAYE,GAC1CE,IAAYJ,IAAYJ,IAAaA,IAAa,GAClDS,IAAeF,IAAeP,IAAaM,IAAeN,IAAaQ,IAAYF;AAElF,WAAA;AAAA;AAAA;AAAA,gBAGKE,CAAS;AAAA,gBACTC,CAAY;AAAA;AAAA;AAAA,EAAA;AAK1B,WAASC,EAASP,GAAiB;AACjC,UAAM,EAAE,YAAAQ,GAAY,aAAAC,GAAa,aAAAC,EAAgB,IAAAV;AAI7C,QAAA,EAFcS,IAAcC,MAEd,CAACZ;AACV,aAAA;AAGH,UAAAa,IAAcF,IAAcD,IAAaE,GACzCE,IAAaJ,IAAaV,IAAYA,IAAY,GAClDe,IAAcF,IAAcb,IAAYY,IAAcZ,IAAYc,IAAaF;AAE9E,WAAA;AAAA;AAAA;AAAA,gBAGKE,CAAU;AAAA,gBACVC,CAAW;AAAA;AAAA;AAAA,EAAA;AAKzB,WAASC,IAAS;AAChB,UAAMd,IAAKJ,EAAI;AAEf,QAAI,CAACI;AACH;AAGF,UAAMe,IAAQ,CAAChB,EAASC,CAAE,GAAGO,EAASP,CAAE,CAAC,EAAE,OAAO,CAACgB,MAAMA,MAAM,IAAI;AACnE,IAAAhB,EAAG,MAAM,YAAY,sBAAsBe,EAAM,KAAK,GAAG,CAAC,GAC1Df,EAAG,MAAM,YAAY,cAAce,EAAM,KAAK,GAAG,CAAC,GAC9CA,EAAM,SAAS,MACdf,EAAA,MAAM,YAAY,0BAA0B,WAAW,GACvDA,EAAA,MAAM,YAAY,kBAAkB,WAAW;AAAA,EACpD;AAGI,QAAAiB,IAASC,EAAYJ,CAAM;AAEjC,EAAAK,EAAUL,CAAM,GACCM,EAAA,QAAQ,UAAUH,GAAQ,EAAI,GAC9BG,EAAA,QAAQ,UAAUH,GAAQ,EAAI;AACjD;"}

package/dist/composition/useSliderBreakpoints.d.ts

@@ -0,0 +1,7 @@
+import { ComputedRef } from 'vue';
+export declare const useSliderBreakpoints: (props: ComputedRef<{
+    min: number;
+    max: number;
+    step: number;
+}>) => ComputedRef<number[]>;
+//# sourceMappingURL=useSliderBreakpoints.d.ts.map

package/dist/composition/useSliderBreakpoints.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSliderBreakpoints.d.ts","sourceRoot":"","sources":["../../src/composition/useSliderBreakpoints.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,KAAK,CAAC;AAEvC,eAAO,MAAM,oBAAoB,UAAW,WAAW,CAAC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC,0BAalG,CAAC"}

package/dist/composition/useSliderBreakpoints.js

@@ -0,0 +1,16 @@
+import { clamp as u } from "../helpers/math.js";
+import { computed as c } from "vue";
+const i = (s) => c(() => {
+  const r = [100], { min: t, max: e, step: p } = s.value;
+  let o = t;
+  for (; o < e; ) {
+    o += p;
+    const n = (1 - (u(o, t, e) - t) / (e - t)) * 100;
+    r.push(n);
+  }
+  return r;
+});
+export {
+  i as useSliderBreakpoints
+};
+//# sourceMappingURL=useSliderBreakpoints.js.map

package/dist/composition/useSliderBreakpoints.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSliderBreakpoints.js","sources":["../../src/composition/useSliderBreakpoints.ts"],"sourcesContent":["import { clamp } from '../helpers/math';\nimport type { ComputedRef } from 'vue';\nimport { computed } from 'vue';\nexport const useSliderBreakpoints = (props: ComputedRef<{ min: number; max: number; step: number }>) => {\n  return computed(() => {\n    const result: number[] = [100];\n    const { min, max, step } = props.value;\n    let start = min;\n    while (start < max) {\n      start += step;\n      const posValue = (clamp(start, min, max) - min) / (max - min);\n      const percent = (1 - posValue) * 100;\n      result.push(percent);\n    }\n    return result;\n  });\n};\n"],"names":["useSliderBreakpoints","props","computed","result","min","max","step","start","percent","clamp"],"mappings":";;AAGa,MAAAA,IAAuB,CAACC,MAC5BC,EAAS,MAAM;AACd,QAAAC,IAAmB,CAAC,GAAG,GACvB,EAAE,KAAAC,GAAK,KAAAC,GAAK,MAAAC,MAASL,EAAM;AACjC,MAAIM,IAAQH;AACZ,SAAOG,IAAQF,KAAK;AACT,IAAAE,KAAAD;AAEH,UAAAE,KAAW,KADCC,EAAMF,GAAOH,GAAKC,CAAG,IAAID,MAAQC,IAAMD,MACxB;AACjC,IAAAD,EAAO,KAAKK,CAAO;AAAA,EAAA;AAEd,SAAAL;AAAA,CACR;"}

package/dist/composition/useSortable.d.ts

@@ -0,0 +1,10 @@
+import { Ref } from 'vue';
+export type SortableSettings = {
+    onChange: (indices: number[]) => void;
+    handle?: string;
+    shakeBuffer?: number;
+    reorderDelay?: number;
+    transitionDelay?: string;
+};
+export declare function useSortable(listRef: Ref<HTMLElement | undefined>, settings: SortableSettings): void;
+//# sourceMappingURL=useSortable.d.ts.map

package/dist/composition/useSortable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSortable.d.ts","sourceRoot":"","sources":["../../src/composition/useSortable.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAW/B,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAqBF,wBAAgB,WAAW,CAAC,OAAO,EAAE,GAAG,CAAC,WAAW,GAAG,SAAS,CAAC,EAAE,QAAQ,EAAE,gBAAgB,QA6M5F"}

package/dist/composition/useSortable.js

@@ -0,0 +1,118 @@
+import { computed as _, watchEffect as D } from "vue";
+import { useEventListener as E } from "./useEventListener.js";
+const l = {
+  item: "sortable__item",
+  animate: "sortable__animate"
+}, f = (a) => a.getBoundingClientRect().y, L = (a) => {
+  const { y: c, height: e } = a.getBoundingClientRect();
+  return c + Math.ceil(e / 2);
+}, S = (a) => {
+  const { y: c, height: e } = a.getBoundingClientRect();
+  return c + e;
+};
+function M(a, c) {
+  const e = {
+    item: void 0,
+    options() {
+      var t;
+      return [...((t = a.value) == null ? void 0 : t.children) ?? []];
+    }
+  }, p = _(() => e.options()), y = c.shakeBuffer ?? 10, w = c.reorderDelay ?? 100;
+  function v(t) {
+    const n = c.handle ? this.querySelector(c.handle) : null;
+    n && (n && !n.contains(t.target) || (this.classList.remove(l.animate), this.classList.add(l.item), e.item = {
+      el: this,
+      y: t.y,
+      dy: 0,
+      orderChanged: !1
+    }));
+  }
+  function C(t) {
+    const n = e.options();
+    return n.slice(0, n.indexOf(t));
+  }
+  function b(t) {
+    const n = e.options();
+    return n.slice(n.indexOf(t) + 1);
+  }
+  function B(t, n) {
+    const i = e.options().filter((s) => s !== n), r = i.indexOf(t);
+    return i.splice(r, 0, n), i;
+  }
+  function A(t, n) {
+    const i = e.options().filter((s) => s !== n), r = i.indexOf(t);
+    return i.splice(r + 1, 0, n), i;
+  }
+  function O(t, n) {
+    t.dy = n - t.y, t.el.style.setProperty("transform", `translateY(${t.dy}px)`);
+  }
+  function g(t) {
+    var x;
+    if (!e.item)
+      return;
+    const { el: n } = e.item;
+    if (!n.isConnected) {
+      e.item = void 0;
+      return;
+    }
+    const i = t.map((o) => f(o)), r = f(n);
+    (x = a.value) == null || x.replaceChildren(...t);
+    const s = f(n), u = t.map((o) => f(o)), m = [];
+    for (let o = 0; o < u.length; o++) {
+      const h = t[o];
+      if (h === e.item.el)
+        continue;
+      const P = u[o], Y = i[o] - P;
+      h.style.transform = `translateY(${Y}px)`, m.push(h);
+    }
+    const d = s - r;
+    e.item.y = e.item.y + d, e.item.dy = e.item.dy - d, e.item.orderChanged = !0, e.item.el.style.setProperty("transform", `translateY(${e.item.dy}px)`), m.forEach((o) => o.classList.remove(l.animate)), requestAnimationFrame(function() {
+      m.forEach((o) => {
+        o.classList.add(l.animate), o.style.transform = "", o.addEventListener("transitionend", () => {
+          o.classList.remove(l.animate);
+        });
+      });
+    });
+  }
+  E(window, "mousemove", (t) => {
+    if (!e.item)
+      return;
+    const { el: n } = e.item;
+    O(e.item, t.y);
+    const i = f(e.item.el), r = S(e.item.el), s = C(n), u = b(n);
+    s.forEach((m) => {
+      const d = L(m);
+      i + y < d && g(B(m, n));
+    }), u.forEach((m) => {
+      const d = L(m);
+      r - y > d && g(A(m, n));
+    });
+  }), E(window, "mouseup", () => {
+    if (!e.item)
+      return;
+    const { el: t, orderChanged: n } = e.item;
+    t.classList.add(l.animate), t.style.removeProperty("transform"), t.addEventListener("transitionend", () => {
+      t.classList.remove(l.animate, l.item);
+    }), setTimeout(() => {
+      if (!n)
+        return;
+      const i = e.options().map((s) => Number(s.getAttribute("data-index"))), r = a.value;
+      if (r) {
+        for (const s of e.options())
+          r.removeChild(s);
+        p.value.forEach((s) => {
+          r.appendChild(s);
+        });
+      }
+      c.onChange(i);
+    }, w), e.item = void 0;
+  }), D(() => {
+    p.value.forEach((t, n) => {
+      t.removeEventListener("mousedown", v), t.addEventListener("mousedown", v), t.setAttribute("data-index", String(n));
+    });
+  });
+}
+export {
+  M as useSortable
+};
+//# sourceMappingURL=useSortable.js.map

package/dist/composition/useSortable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSortable.js","sources":["../../src/composition/useSortable.ts"],"sourcesContent":["import type { Ref } from 'vue';\nimport { computed, watchEffect } from 'vue';\nimport { useEventListener } from './useEventListener';\n\ntype SortableItem = {\n  el: HTMLElement;\n  y: number;\n  dy: number;\n  orderChanged: boolean;\n};\n\nexport type SortableSettings = {\n  onChange: (indices: number[]) => void;\n  handle?: string;\n  shakeBuffer?: number;\n  reorderDelay?: number;\n  transitionDelay?: string;\n};\n\nconst classes = {\n  item: 'sortable__item',\n  animate: 'sortable__animate',\n};\n\nconst getOffset = (el: HTMLElement) => {\n  return el.getBoundingClientRect().y;\n};\n\nconst getMiddle = (el: HTMLElement) => {\n  const { y, height } = el.getBoundingClientRect();\n  return y + Math.ceil(height / 2);\n};\n\nconst getBottom = (el: HTMLElement) => {\n  const { y, height } = el.getBoundingClientRect();\n  return y + height;\n};\n\nexport function useSortable(listRef: Ref<HTMLElement | undefined>, settings: SortableSettings) {\n  const state = {\n    item: undefined as SortableItem | undefined,\n    options() {\n      return [...(listRef.value?.children ?? [])] as HTMLElement[];\n    },\n  };\n\n  const optionsRef = computed(() => {\n    return state.options();\n  });\n\n  const shakeBuffer = settings.shakeBuffer ?? 10;\n\n  const reorderDelay = settings.reorderDelay ?? 100;\n\n  function mouseDown(this: HTMLElement, e: { y: number; target: EventTarget | null }) {\n    const handle = settings.handle ? this.querySelector(settings.handle) : null;\n\n    if (!handle) {\n      return;\n    }\n\n    if (handle && !handle.contains(e.target as HTMLElement)) {\n      return;\n    }\n\n    this.classList.remove(classes.animate);\n    this.classList.add(classes.item);\n\n    state.item = {\n      el: this,\n      y: e.y,\n      dy: 0,\n      orderChanged: false,\n    };\n  }\n\n  function elementsBefore(el: HTMLElement) {\n    const options = state.options();\n    return options.slice(0, options.indexOf(el));\n  }\n\n  function elementsAfter(el: HTMLElement) {\n    const children = state.options();\n    return children.slice(children.indexOf(el) + 1);\n  }\n\n  function insertBefore(before: HTMLElement, el: HTMLElement) {\n    const children = state.options().filter((e) => e !== el);\n    const index = children.indexOf(before);\n    children.splice(index, 0, el);\n    return children;\n  }\n\n  function insertAfter(after: HTMLElement, el: HTMLElement) {\n    const children = state.options().filter((e) => e !== el);\n    const index = children.indexOf(after);\n    children.splice(index + 1, 0, el);\n    return children;\n  }\n\n  function updatePosition(item: SortableItem, y: number) {\n    item.dy = y - item.y;\n    item.el.style.setProperty('transform', `translateY(${item.dy}px)`);\n  }\n\n  function changeOrder(reordered: HTMLElement[]) {\n    if (!state.item) {\n      return;\n    }\n\n    const { el } = state.item;\n\n    if (!el.isConnected) {\n      state.item = undefined;\n      return;\n    }\n\n    const oldPositions = reordered.map((e) => getOffset(e));\n\n    const y1 = getOffset(el);\n    listRef.value?.replaceChildren(...reordered);\n    const y2 = getOffset(el);\n\n    const newPositions = reordered.map((e) => getOffset(e));\n\n    const toAnimate: HTMLElement[] = [];\n\n    for (let i = 0; i < newPositions.length; i++) {\n      const option = reordered[i];\n\n      if (option === state.item.el) {\n        continue;\n      }\n\n      const newY = newPositions[i];\n\n      const oldY = oldPositions[i];\n\n      const invert = oldY - newY;\n\n      option.style.transform = `translateY(${invert}px)`;\n\n      toAnimate.push(option);\n    }\n\n    const dy = y2 - y1;\n\n    state.item.y = state.item.y + dy;\n    state.item.dy = state.item.dy - dy;\n    state.item.orderChanged = true;\n    state.item.el.style.setProperty('transform', `translateY(${state.item.dy}px)`);\n\n    toAnimate.forEach((o) => o.classList.remove(classes.animate));\n\n    requestAnimationFrame(function () {\n      toAnimate.forEach((option) => {\n        option.classList.add(classes.animate);\n        option.style.transform = '';\n        option.addEventListener('transitionend', () => {\n          option.classList.remove(classes.animate);\n        });\n      });\n    });\n  }\n\n  useEventListener(window, 'mousemove', (e: { y: number }) => {\n    if (!state.item) {\n      return;\n    }\n\n    const { el } = state.item;\n\n    updatePosition(state.item, e.y);\n\n    const upper = getOffset(state.item.el);\n    const bottom = getBottom(state.item.el);\n\n    const before = elementsBefore(el);\n    const after = elementsAfter(el);\n\n    before.forEach((e) => {\n      const y = getMiddle(e);\n\n      if (upper + shakeBuffer < y) {\n        changeOrder(insertBefore(e, el));\n      }\n    });\n\n    after.forEach((e) => {\n      const y = getMiddle(e);\n\n      if (bottom - shakeBuffer > y) {\n        changeOrder(insertAfter(e, el));\n      }\n    });\n  });\n\n  useEventListener(window, 'mouseup', () => {\n    if (!state.item) {\n      return;\n    }\n\n    const { el, orderChanged } = state.item;\n\n    el.classList.add(classes.animate);\n    el.style.removeProperty('transform');\n\n    el.addEventListener('transitionend', () => {\n      el.classList.remove(classes.animate, classes.item);\n    });\n\n    setTimeout(() => {\n      if (!orderChanged) {\n        return;\n      }\n\n      const newIndices = state.options().map((o) => Number(o.getAttribute('data-index')));\n\n      const list = listRef.value;\n\n      if (list) {\n        for (const child of state.options()) {\n          list.removeChild(child);\n        }\n\n        optionsRef.value.forEach((child) => {\n          list.appendChild(child);\n        });\n      }\n\n      settings.onChange(newIndices);\n    }, reorderDelay);\n\n    state.item = undefined;\n  });\n\n  watchEffect(() => {\n    optionsRef.value.forEach((child, i) => {\n      child.removeEventListener('mousedown', mouseDown);\n      child.addEventListener('mousedown', mouseDown);\n      child.setAttribute('data-index', String(i));\n    });\n  });\n}\n"],"names":["classes","getOffset","el","getMiddle","y","height","getBottom","useSortable","listRef","settings","state","_a","optionsRef","computed","shakeBuffer","reorderDelay","mouseDown","e","handle","elementsBefore","options","elementsAfter","children","insertBefore","before","index","insertAfter","after","updatePosition","item","changeOrder","reordered","oldPositions","y1","y2","newPositions","toAnimate","i","option","newY","invert","dy","useEventListener","upper","bottom","orderChanged","newIndices","o","list","child","watchEffect"],"mappings":"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"}

package/dist/composition/useSortable2.d.ts

@@ -0,0 +1,19 @@
+import { Ref } from 'vue';
+export type SortableSettings = {
+    onChange: (indices: number[]) => void;
+    handle?: string;
+    shakeBuffer?: number;
+    reorderDelay?: number;
+    transitionDelay?: string;
+};
+/**
+ * Description: Scroll support has been added to the container where sorting takes place.
+ * Some functionality duplicates the behavior of useScrollable.
+ *
+ * Purpose: To enable automatic scrolling when dragging items beyond the visible area of the container.
+ * Future Plan:
+ * - Verify the behavior of the new scrolling functionality within blocks and text elements.
+ * - Merge the current implementation with useScrollable to eliminate code duplication and create a unified scrolling solution.
+ */
+export declare function useSortable2(listRef: Ref<HTMLElement | undefined>, settings: SortableSettings): void;
+//# sourceMappingURL=useSortable2.d.ts.map

package/dist/composition/useSortable2.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSortable2.d.ts","sourceRoot":"","sources":["../../src/composition/useSortable2.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAY/B,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAqBF;;;;;;;;GAQG;AACH,wBAAgB,YAAY,CAAC,OAAO,EAAE,GAAG,CAAC,WAAW,GAAG,SAAS,CAAC,EAAE,QAAQ,EAAE,gBAAgB,QAyO7F"}

package/dist/composition/useSortable2.js

@@ -0,0 +1,136 @@
+import { watch as P, computed as D, watchEffect as _ } from "vue";
+import { useEventListener as T } from "./useEventListener.js";
+const m = {
+  item: "sortable__item",
+  animate: "sortable__animate"
+}, p = (o) => o.getBoundingClientRect().y, x = (o) => {
+  const { y: u, height: n } = o.getBoundingClientRect();
+  return u + Math.ceil(n / 2);
+}, $ = (o) => {
+  const { y: u, height: n } = o.getBoundingClientRect();
+  return u + n;
+};
+function F(o, u) {
+  const n = {
+    item: void 0,
+    options() {
+      var t;
+      return [...((t = o.value) == null ? void 0 : t.children) ?? []];
+    }
+  };
+  let v = 0;
+  P(() => o.value, () => {
+    setTimeout(() => {
+      o.value && (o.value.scrollTop = v);
+    }, 0);
+  });
+  const y = D(() => n.options()), g = u.shakeBuffer ?? 10, E = u.reorderDelay ?? 100;
+  function C(t) {
+    var i;
+    const e = u.handle ? this.querySelector(u.handle) : null;
+    e && (e && !e.contains(t.target) || (this.classList.remove(m.animate), this.classList.add(m.item), n.item = {
+      el: this,
+      y: t.y,
+      dy: 0,
+      initialScrollTop: ((i = o.value) == null ? void 0 : i.scrollTop) || 0,
+      orderChanged: !1
+    }));
+  }
+  function L(t) {
+    const e = n.options();
+    return e.slice(0, e.indexOf(t));
+  }
+  function B(t) {
+    const e = n.options();
+    return e.slice(e.indexOf(t) + 1);
+  }
+  function Y(t, e) {
+    const i = n.options().filter((s) => s !== e), a = i.indexOf(t);
+    return i.splice(a, 0, e), i;
+  }
+  function b(t, e) {
+    const i = n.options().filter((s) => s !== e), a = i.indexOf(t);
+    return i.splice(a + 1, 0, e), i;
+  }
+  function S(t, e) {
+    var s;
+    const a = (((s = o.value) == null ? void 0 : s.scrollTop) || 0) - (t.initialScrollTop || 0);
+    t.dy = e - t.y + a, t.el.style.setProperty("transform", `translateY(${t.dy}px)`);
+  }
+  function w(t) {
+    var f;
+    if (!n.item)
+      return;
+    const { el: e } = n.item;
+    if (!e.isConnected) {
+      n.item = void 0;
+      return;
+    }
+    const i = t.map((r) => p(r)), a = p(e);
+    (f = o.value) == null || f.replaceChildren(...t);
+    const s = p(e), l = t.map((r) => p(r)), c = [];
+    for (let r = 0; r < l.length; r++) {
+      const h = t[r];
+      if (h === n.item.el)
+        continue;
+      const A = l[r], O = i[r] - A;
+      h.style.transform = `translateY(${O}px)`, c.push(h);
+    }
+    const d = s - a;
+    n.item.y = n.item.y + d, n.item.dy = n.item.dy - d, n.item.orderChanged = !0, n.item.el.style.setProperty("transform", `translateY(${n.item.dy}px)`), c.forEach((r) => r.classList.remove(m.animate)), requestAnimationFrame(function() {
+      c.forEach((r) => {
+        r.classList.add(m.animate), r.style.transform = "", r.addEventListener("transitionend", () => {
+          r.classList.remove(m.animate);
+        });
+      });
+    });
+  }
+  T(window, "mousemove", (t) => {
+    if (!n.item)
+      return;
+    const { el: e } = n.item;
+    S(n.item, t.y);
+    const i = p(n.item.el), a = $(n.item.el), s = L(e), l = B(e);
+    if (s.forEach((c) => {
+      const d = x(c);
+      i + g < d && w(Y(c, e));
+    }), l.forEach((c) => {
+      const d = x(c);
+      a - g > d && w(b(c, e));
+    }), o.value) {
+      const c = o.value.getBoundingClientRect(), d = c.top + e.getBoundingClientRect().height / 2;
+      t.clientY < d && (o.value.scrollTop += t.clientY - d);
+      const f = c.bottom - e.getBoundingClientRect().height / 2;
+      t.clientY > f && (o.value.scrollTop += t.clientY - f);
+    }
+  }), T(window, "mouseup", () => {
+    var i;
+    if (!n.item)
+      return;
+    v = ((i = o.value) == null ? void 0 : i.scrollTop) || 0;
+    const { el: t, orderChanged: e } = n.item;
+    t.classList.add(m.animate), t.style.removeProperty("transform"), t.addEventListener("transitionend", () => {
+      t.classList.remove(m.animate, m.item);
+    }), setTimeout(() => {
+      if (!e)
+        return;
+      const a = n.options().map((l) => Number(l.getAttribute("data-index"))), s = o.value;
+      if (s) {
+        for (const l of n.options())
+          s.removeChild(l);
+        y.value.forEach((l) => {
+          s.appendChild(l);
+        });
+      }
+      u.onChange(a);
+    }, E), n.item = void 0;
+  }), _(() => {
+    y.value.forEach((t, e) => {
+      t.removeEventListener("mousedown", C), t.addEventListener("mousedown", C), t.setAttribute("data-index", String(e));
+    });
+  });
+}
+export {
+  F as useSortable2
+};
+//# sourceMappingURL=useSortable2.js.map

package/dist/composition/useSortable2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSortable2.js","sources":["../../src/composition/useSortable2.ts"],"sourcesContent":["import type { Ref } from 'vue';\nimport { computed, watch, watchEffect } from 'vue';\nimport { useEventListener } from './useEventListener';\n\ntype SortableItem = {\n  el: HTMLElement;\n  y: number;\n  dy: number;\n  orderChanged: boolean;\n  initialScrollTop: number;\n};\n\nexport type SortableSettings = {\n  onChange: (indices: number[]) => void;\n  handle?: string;\n  shakeBuffer?: number;\n  reorderDelay?: number;\n  transitionDelay?: string;\n};\n\nconst classes = {\n  item: 'sortable__item',\n  animate: 'sortable__animate',\n};\n\nconst getOffset = (el: HTMLElement) => {\n  return el.getBoundingClientRect().y;\n};\n\nconst getMiddle = (el: HTMLElement) => {\n  const { y, height } = el.getBoundingClientRect();\n  return y + Math.ceil(height / 2);\n};\n\nconst getBottom = (el: HTMLElement) => {\n  const { y, height } = el.getBoundingClientRect();\n  return y + height;\n};\n\n/**\n * Description: Scroll support has been added to the container where sorting takes place.\n * Some functionality duplicates the behavior of useScrollable.\n *\n * Purpose: To enable automatic scrolling when dragging items beyond the visible area of the container.\n * Future Plan:\n * - Verify the behavior of the new scrolling functionality within blocks and text elements.\n * - Merge the current implementation with useScrollable to eliminate code duplication and create a unified scrolling solution.\n */\nexport function useSortable2(listRef: Ref<HTMLElement | undefined>, settings: SortableSettings) {\n  const state = {\n    item: undefined as SortableItem | undefined,\n    options() {\n      return [...(listRef.value?.children ?? [])] as HTMLElement[];\n    },\n  };\n  let oldScrollTop = 0;\n\n  watch(() => listRef.value, () => {\n    setTimeout(() => {\n      if (listRef.value) {\n        listRef.value.scrollTop = oldScrollTop;\n      }\n    }, 0);\n  });\n\n  const optionsRef = computed(() => {\n    return state.options();\n  });\n\n  const shakeBuffer = settings.shakeBuffer ?? 10;\n\n  const reorderDelay = settings.reorderDelay ?? 100;\n\n  function mouseDown(this: HTMLElement, e: { y: number; target: EventTarget | null }) {\n    const handle = settings.handle ? this.querySelector(settings.handle) : null;\n\n    if (!handle) {\n      return;\n    }\n\n    if (handle && !handle.contains(e.target as HTMLElement)) {\n      return;\n    }\n\n    this.classList.remove(classes.animate);\n    this.classList.add(classes.item);\n\n    state.item = {\n      el: this,\n      y: e.y,\n      dy: 0,\n      initialScrollTop: listRef.value?.scrollTop || 0,\n      orderChanged: false,\n    };\n  }\n\n  function elementsBefore(el: HTMLElement) {\n    const options = state.options();\n    return options.slice(0, options.indexOf(el));\n  }\n\n  function elementsAfter(el: HTMLElement) {\n    const children = state.options();\n    return children.slice(children.indexOf(el) + 1);\n  }\n\n  function insertBefore(before: HTMLElement, el: HTMLElement) {\n    const children = state.options().filter((e) => e !== el);\n    const index = children.indexOf(before);\n    children.splice(index, 0, el);\n    return children;\n  }\n\n  function insertAfter(after: HTMLElement, el: HTMLElement) {\n    const children = state.options().filter((e) => e !== el);\n    const index = children.indexOf(after);\n    children.splice(index + 1, 0, el);\n    return children;\n  }\n\n  function updatePosition(item: SortableItem, y: number) {\n    const currentScrollTop = listRef.value?.scrollTop || 0;\n    const scrollDiff = currentScrollTop - (item.initialScrollTop || 0);\n    item.dy = y - item.y + scrollDiff;\n    item.el.style.setProperty('transform', `translateY(${item.dy}px)`);\n  }\n\n  function changeOrder(reordered: HTMLElement[]) {\n    if (!state.item) {\n      return;\n    }\n\n    const { el } = state.item;\n\n    if (!el.isConnected) {\n      state.item = undefined;\n      return;\n    }\n\n    const oldPositions = reordered.map((e) => getOffset(e));\n\n    const y1 = getOffset(el);\n    listRef.value?.replaceChildren(...reordered);\n    const y2 = getOffset(el);\n\n    const newPositions = reordered.map((e) => getOffset(e));\n\n    const toAnimate: HTMLElement[] = [];\n\n    for (let i = 0; i < newPositions.length; i++) {\n      const option = reordered[i];\n\n      if (option === state.item.el) {\n        continue;\n      }\n\n      const newY = newPositions[i];\n\n      const oldY = oldPositions[i];\n\n      const invert = oldY - newY;\n\n      option.style.transform = `translateY(${invert}px)`;\n\n      toAnimate.push(option);\n    }\n\n    const dy = y2 - y1;\n\n    state.item.y = state.item.y + dy;\n    state.item.dy = state.item.dy - dy;\n    state.item.orderChanged = true;\n    state.item.el.style.setProperty('transform', `translateY(${state.item.dy}px)`);\n\n    toAnimate.forEach((o) => o.classList.remove(classes.animate));\n\n    requestAnimationFrame(function () {\n      toAnimate.forEach((option) => {\n        option.classList.add(classes.animate);\n        option.style.transform = '';\n        option.addEventListener('transitionend', () => {\n          option.classList.remove(classes.animate);\n        });\n      });\n    });\n  }\n\n  useEventListener(window, 'mousemove', (e: { y: number }) => {\n    if (!state.item) {\n      return;\n    }\n\n    const { el } = state.item;\n\n    updatePosition(state.item, e.y);\n\n    const upper = getOffset(state.item.el);\n    const bottom = getBottom(state.item.el);\n\n    const before = elementsBefore(el);\n    const after = elementsAfter(el);\n\n    before.forEach((e) => {\n      const y = getMiddle(e);\n\n      if (upper + shakeBuffer < y) {\n        changeOrder(insertBefore(e, el));\n      }\n    });\n\n    after.forEach((e) => {\n      const y = getMiddle(e);\n\n      if (bottom - shakeBuffer > y) {\n        changeOrder(insertAfter(e, el));\n      }\n    });\n\n    if (listRef.value) {\n      const rect = listRef.value.getBoundingClientRect();\n\n      const deltaUp = rect.top + el.getBoundingClientRect().height / 2;\n      if ((e as MouseEvent).clientY < deltaUp) {\n        listRef.value.scrollTop += (e as MouseEvent).clientY - deltaUp;\n      }\n\n      const deltaDown = rect.bottom - el.getBoundingClientRect().height / 2;\n      if ((e as MouseEvent).clientY > deltaDown) {\n        listRef.value.scrollTop += (e as MouseEvent).clientY - deltaDown;\n      }\n    }\n  });\n\n  useEventListener(window, 'mouseup', () => {\n    if (!state.item) {\n      return;\n    }\n\n    oldScrollTop = listRef.value?.scrollTop || 0;\n\n    const { el, orderChanged } = state.item;\n\n    el.classList.add(classes.animate);\n    el.style.removeProperty('transform');\n\n    el.addEventListener('transitionend', () => {\n      el.classList.remove(classes.animate, classes.item);\n    });\n\n    setTimeout(() => {\n      if (!orderChanged) {\n        return;\n      }\n\n      const newIndices = state.options().map((o) => Number(o.getAttribute('data-index')));\n\n      const list = listRef.value;\n\n      if (list) {\n        for (const child of state.options()) {\n          list.removeChild(child);\n        }\n\n        optionsRef.value.forEach((child) => {\n          list.appendChild(child);\n        });\n      }\n\n      settings.onChange(newIndices);\n    }, reorderDelay);\n\n    state.item = undefined;\n  });\n\n  watchEffect(() => {\n    optionsRef.value.forEach((child, i) => {\n      child.removeEventListener('mousedown', mouseDown);\n      child.addEventListener('mousedown', mouseDown);\n      child.setAttribute('data-index', String(i));\n    });\n  });\n}\n"],"names":["classes","getOffset","el","getMiddle","y","height","getBottom","useSortable2","listRef","settings","state","_a","oldScrollTop","watch","optionsRef","computed","shakeBuffer","reorderDelay","mouseDown","e","handle","elementsBefore","options","elementsAfter","children","insertBefore","before","index","insertAfter","after","updatePosition","item","scrollDiff","changeOrder","reordered","oldPositions","y1","y2","newPositions","toAnimate","i","option","newY","invert","dy","o","useEventListener","upper","bottom","rect","deltaUp","deltaDown","orderChanged","newIndices","list","child","watchEffect"],"mappings":";;AAoBA,MAAMA,IAAU;AAAA,EACd,MAAM;AAAA,EACN,SAAS;AACX,GAEMC,IAAY,CAACC,MACVA,EAAG,wBAAwB,GAG9BC,IAAY,CAACD,MAAoB;AACrC,QAAM,EAAE,GAAAE,GAAG,QAAAC,MAAWH,EAAG,sBAAsB;AAC/C,SAAOE,IAAI,KAAK,KAAKC,IAAS,CAAC;AACjC,GAEMC,IAAY,CAACJ,MAAoB;AACrC,QAAM,EAAE,GAAAE,GAAG,QAAAC,MAAWH,EAAG,sBAAsB;AAC/C,SAAOE,IAAIC;AACb;AAWgB,SAAAE,EAAaC,GAAuCC,GAA4B;AAC9F,QAAMC,IAAQ;AAAA,IACZ,MAAM;AAAA,IACN,UAAU;;AACR,aAAO,CAAC,KAAIC,IAAAH,EAAQ,UAAR,gBAAAG,EAAe,aAAY,CAAA,CAAG;AAAA,IAAA;AAAA,EAE9C;AACA,MAAIC,IAAe;AAEb,EAAAC,EAAA,MAAML,EAAQ,OAAO,MAAM;AAC/B,eAAW,MAAM;AACf,MAAIA,EAAQ,UACVA,EAAQ,MAAM,YAAYI;AAAA,OAE3B,CAAC;AAAA,EAAA,CACL;AAEK,QAAAE,IAAaC,EAAS,MACnBL,EAAM,QAAQ,CACtB,GAEKM,IAAcP,EAAS,eAAe,IAEtCQ,IAAeR,EAAS,gBAAgB;AAE9C,WAASS,EAA6BC,GAA8C;;AAClF,UAAMC,IAASX,EAAS,SAAS,KAAK,cAAcA,EAAS,MAAM,IAAI;AAEvE,IAAKW,MAIDA,KAAU,CAACA,EAAO,SAASD,EAAE,MAAqB,MAIjD,KAAA,UAAU,OAAOnB,EAAQ,OAAO,GAChC,KAAA,UAAU,IAAIA,EAAQ,IAAI,GAE/BU,EAAM,OAAO;AAAA,MACX,IAAI;AAAA,MACJ,GAAGS,EAAE;AAAA,MACL,IAAI;AAAA,MACJ,oBAAkBR,IAAAH,EAAQ,UAAR,gBAAAG,EAAe,cAAa;AAAA,MAC9C,cAAc;AAAA,IAChB;AAAA,EAAA;AAGF,WAASU,EAAenB,GAAiB;AACjC,UAAAoB,IAAUZ,EAAM,QAAQ;AAC9B,WAAOY,EAAQ,MAAM,GAAGA,EAAQ,QAAQpB,CAAE,CAAC;AAAA,EAAA;AAG7C,WAASqB,EAAcrB,GAAiB;AAChC,UAAAsB,IAAWd,EAAM,QAAQ;AAC/B,WAAOc,EAAS,MAAMA,EAAS,QAAQtB,CAAE,IAAI,CAAC;AAAA,EAAA;AAGvC,WAAAuB,EAAaC,GAAqBxB,GAAiB;AACpD,UAAAsB,IAAWd,EAAM,QAAQ,EAAE,OAAO,CAACS,MAAMA,MAAMjB,CAAE,GACjDyB,IAAQH,EAAS,QAAQE,CAAM;AAC5B,WAAAF,EAAA,OAAOG,GAAO,GAAGzB,CAAE,GACrBsB;AAAA,EAAA;AAGA,WAAAI,EAAYC,GAAoB3B,GAAiB;AAClD,UAAAsB,IAAWd,EAAM,QAAQ,EAAE,OAAO,CAACS,MAAMA,MAAMjB,CAAE,GACjDyB,IAAQH,EAAS,QAAQK,CAAK;AACpC,WAAAL,EAAS,OAAOG,IAAQ,GAAG,GAAGzB,CAAE,GACzBsB;AAAA,EAAA;AAGA,WAAAM,EAAeC,GAAoB3B,GAAW;;AAE/C,UAAA4B,OADmBrB,IAAAH,EAAQ,UAAR,gBAAAG,EAAe,cAAa,MACdoB,EAAK,oBAAoB;AAC3D,IAAAA,EAAA,KAAK3B,IAAI2B,EAAK,IAAIC,GACvBD,EAAK,GAAG,MAAM,YAAY,aAAa,cAAcA,EAAK,EAAE,KAAK;AAAA,EAAA;AAGnE,WAASE,EAAYC,GAA0B;;AACzC,QAAA,CAACxB,EAAM;AACT;AAGI,UAAA,EAAE,IAAAR,MAAOQ,EAAM;AAEjB,QAAA,CAACR,EAAG,aAAa;AACnB,MAAAQ,EAAM,OAAO;AACb;AAAA,IAAA;AAGF,UAAMyB,IAAeD,EAAU,IAAI,CAACf,MAAMlB,EAAUkB,CAAC,CAAC,GAEhDiB,IAAKnC,EAAUC,CAAE;AACf,KAAAS,IAAAH,EAAA,UAAA,QAAAG,EAAO,gBAAgB,GAAGuB;AAC5B,UAAAG,IAAKpC,EAAUC,CAAE,GAEjBoC,IAAeJ,EAAU,IAAI,CAACf,MAAMlB,EAAUkB,CAAC,CAAC,GAEhDoB,IAA2B,CAAC;AAElC,aAASC,IAAI,GAAGA,IAAIF,EAAa,QAAQE,KAAK;AACtC,YAAAC,IAASP,EAAUM,CAAC;AAEtB,UAAAC,MAAW/B,EAAM,KAAK;AACxB;AAGI,YAAAgC,IAAOJ,EAAaE,CAAC,GAIrBG,IAFOR,EAAaK,CAAC,IAELE;AAEf,MAAAD,EAAA,MAAM,YAAY,cAAcE,CAAM,OAE7CJ,EAAU,KAAKE,CAAM;AAAA,IAAA;AAGvB,UAAMG,IAAKP,IAAKD;AAEhB,IAAA1B,EAAM,KAAK,IAAIA,EAAM,KAAK,IAAIkC,GAC9BlC,EAAM,KAAK,KAAKA,EAAM,KAAK,KAAKkC,GAChClC,EAAM,KAAK,eAAe,IACpBA,EAAA,KAAK,GAAG,MAAM,YAAY,aAAa,cAAcA,EAAM,KAAK,EAAE,KAAK,GAEnE6B,EAAA,QAAQ,CAACM,MAAMA,EAAE,UAAU,OAAO7C,EAAQ,OAAO,CAAC,GAE5D,sBAAsB,WAAY;AACtB,MAAAuC,EAAA,QAAQ,CAACE,MAAW;AACrB,QAAAA,EAAA,UAAU,IAAIzC,EAAQ,OAAO,GACpCyC,EAAO,MAAM,YAAY,IAClBA,EAAA,iBAAiB,iBAAiB,MAAM;AACtC,UAAAA,EAAA,UAAU,OAAOzC,EAAQ,OAAO;AAAA,QAAA,CACxC;AAAA,MAAA,CACF;AAAA,IAAA,CACF;AAAA,EAAA;AAGc,EAAA8C,EAAA,QAAQ,aAAa,CAAC3B,MAAqB;AACtD,QAAA,CAACT,EAAM;AACT;AAGI,UAAA,EAAE,IAAAR,MAAOQ,EAAM;AAEN,IAAAoB,EAAApB,EAAM,MAAMS,EAAE,CAAC;AAE9B,UAAM4B,IAAQ9C,EAAUS,EAAM,KAAK,EAAE,GAC/BsC,IAAS1C,EAAUI,EAAM,KAAK,EAAE,GAEhCgB,IAASL,EAAenB,CAAE,GAC1B2B,IAAQN,EAAcrB,CAAE;AAkB9B,QAhBOwB,EAAA,QAAQ,CAACP,MAAM;AACd,YAAAf,IAAID,EAAUgB,CAAC;AAEjB,MAAA4B,IAAQ/B,IAAcZ,KACZ6B,EAAAR,EAAaN,GAAGjB,CAAE,CAAC;AAAA,IACjC,CACD,GAEK2B,EAAA,QAAQ,CAACV,MAAM;AACb,YAAAf,IAAID,EAAUgB,CAAC;AAEjB,MAAA6B,IAAShC,IAAcZ,KACb6B,EAAAL,EAAYT,GAAGjB,CAAE,CAAC;AAAA,IAChC,CACD,GAEGM,EAAQ,OAAO;AACX,YAAAyC,IAAOzC,EAAQ,MAAM,sBAAsB,GAE3C0C,IAAUD,EAAK,MAAM/C,EAAG,sBAAA,EAAwB,SAAS;AAC1D,MAAAiB,EAAiB,UAAU+B,MACtB1C,EAAA,MAAM,aAAcW,EAAiB,UAAU+B;AAGzD,YAAMC,IAAYF,EAAK,SAAS/C,EAAG,sBAAA,EAAwB,SAAS;AAC/D,MAAAiB,EAAiB,UAAUgC,MACtB3C,EAAA,MAAM,aAAcW,EAAiB,UAAUgC;AAAA,IACzD;AAAA,EACF,CACD,GAEgBL,EAAA,QAAQ,WAAW,MAAM;;AACpC,QAAA,CAACpC,EAAM;AACT;AAGa,IAAAE,MAAAD,IAAAH,EAAQ,UAAR,gBAAAG,EAAe,cAAa;AAE3C,UAAM,EAAE,IAAAT,GAAI,cAAAkD,EAAa,IAAI1C,EAAM;AAEhC,IAAAR,EAAA,UAAU,IAAIF,EAAQ,OAAO,GAC7BE,EAAA,MAAM,eAAe,WAAW,GAEhCA,EAAA,iBAAiB,iBAAiB,MAAM;AACzC,MAAAA,EAAG,UAAU,OAAOF,EAAQ,SAASA,EAAQ,IAAI;AAAA,IAAA,CAClD,GAED,WAAW,MAAM;AACf,UAAI,CAACoD;AACH;AAGF,YAAMC,IAAa3C,EAAM,QAAQ,EAAE,IAAI,CAACmC,MAAM,OAAOA,EAAE,aAAa,YAAY,CAAC,CAAC,GAE5ES,IAAO9C,EAAQ;AAErB,UAAI8C,GAAM;AACG,mBAAAC,KAAS7C,EAAM;AACxB,UAAA4C,EAAK,YAAYC,CAAK;AAGb,QAAAzC,EAAA,MAAM,QAAQ,CAACyC,MAAU;AAClC,UAAAD,EAAK,YAAYC,CAAK;AAAA,QAAA,CACvB;AAAA,MAAA;AAGH,MAAA9C,EAAS,SAAS4C,CAAU;AAAA,OAC3BpC,CAAY,GAEfP,EAAM,OAAO;AAAA,EAAA,CACd,GAED8C,EAAY,MAAM;AAChB,IAAA1C,EAAW,MAAM,QAAQ,CAACyC,GAAOf,MAAM;AAC/B,MAAAe,EAAA,oBAAoB,aAAarC,CAAS,GAC1CqC,EAAA,iBAAiB,aAAarC,CAAS,GAC7CqC,EAAM,aAAa,cAAc,OAAOf,CAAC,CAAC;AAAA,IAAA,CAC3C;AAAA,EAAA,CACF;AACH;"}

package/dist/composition/useTheme.d.ts

@@ -0,0 +1,5 @@
+type Theme = 'light' | 'dark';
+type Callback = (mode: Theme) => void;
+export declare function useTheme(_cb?: Callback): readonly [import('vue').ComputedRef<Theme>, () => void];
+export {};
+//# sourceMappingURL=useTheme.d.ts.map

package/dist/composition/useTheme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTheme.d.ts","sourceRoot":"","sources":["../../src/composition/useTheme.ts"],"names":[],"mappings":"AAIA,KAAK,KAAK,GAAG,OAAO,GAAG,MAAM,CAAC;AAE9B,KAAK,QAAQ,GAAG,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC;AAetC,wBAAgB,QAAQ,CAAC,GAAG,CAAC,EAAE,QAAQ,2DA2BtC"}

package/dist/composition/useTheme.js

@@ -0,0 +1,27 @@
+import { ref as m, computed as h, watch as l, unref as s, onMounted as u, onUnmounted as c } from "vue";
+import { toList as w, mapIterable as f } from "../helpers/iterators.js";
+import { useLocalStorage as v } from "./useLocalStorage.js";
+const r = /* @__PURE__ */ new Set();
+window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", (e) => {
+  w(f(r.values(), (t) => t(e.matches ? "dark" : "light")));
+});
+const g = window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light", d = m(g), o = v("theme");
+function T(e) {
+  const t = h(() => o.value ? o.value : d.value), n = (a) => {
+    d.value = a, e == null || e(a);
+  };
+  function i() {
+    o.value = t.value === "light" ? "dark" : (t.value === "dark", "light");
+  }
+  return l(t, (a) => {
+    e == null || e(s(a));
+  }), u(() => {
+    r.add(n);
+  }), c(() => {
+    r.delete(n);
+  }), [t, i];
+}
+export {
+  T as useTheme
+};
+//# sourceMappingURL=useTheme.js.map

package/dist/composition/useTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTheme.js","sources":["../../src/composition/useTheme.ts"],"sourcesContent":["import { computed, onMounted, onUnmounted, ref, unref, watch } from 'vue';\nimport { mapIterable, toList } from '../helpers/iterators';\nimport { useLocalStorage } from './useLocalStorage';\n\ntype Theme = 'light' | 'dark';\n\ntype Callback = (mode: Theme) => void;\n\nconst cm = new Set<Callback>();\n\nif (window.matchMedia) {\n  window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e) => {\n    toList(mapIterable(cm.values(), (cb) => cb(e.matches ? 'dark' : 'light')));\n  });\n}\n\nconst init = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';\n\nconst browserTheme = ref<Theme>(init);\nconst savedTheme = useLocalStorage<Theme>('theme');\n\nexport function useTheme(_cb?: Callback) {\n  const theme = computed<Theme>(() => {\n    return savedTheme.value ? savedTheme.value : browserTheme.value;\n  });\n\n  const cb = (theme: Theme) => {\n    browserTheme.value = theme;\n    _cb?.(theme);\n  };\n\n  function toggleTheme() {\n    savedTheme.value = theme.value === 'light' ? 'dark' : theme.value === 'dark' ? 'light' : 'light';\n  }\n\n  watch(theme, (v) => {\n    _cb?.(unref(v));\n  });\n\n  onMounted(() => {\n    cm.add(cb);\n  });\n\n  onUnmounted(() => {\n    cm.delete(cb);\n  });\n\n  return [theme, toggleTheme] as const;\n}\n"],"names":["cm","toList","mapIterable","cb","init","browserTheme","ref","savedTheme","useLocalStorage","useTheme","_cb","theme","computed","toggleTheme","watch","v","unref","onMounted","onUnmounted"],"mappings":";;;AAQA,MAAMA,wBAAS,IAAc;AAEzB,OAAO,cACT,OAAO,WAAW,8BAA8B,EAAE,iBAAiB,UAAU,CAAC,MAAM;AAClF,EAAAC,EAAOC,EAAYF,EAAG,OAAO,GAAG,CAACG,MAAOA,EAAG,EAAE,UAAU,SAAS,OAAO,CAAC,CAAC;AAAA,CAC1E;AAGH,MAAMC,IAAO,OAAO,cAAc,OAAO,WAAW,8BAA8B,EAAE,UAAU,SAAS,SAEjGC,IAAeC,EAAWF,CAAI,GAC9BG,IAAaC,EAAuB,OAAO;AAE1C,SAASC,EAASC,GAAgB;AACjC,QAAAC,IAAQC,EAAgB,MACrBL,EAAW,QAAQA,EAAW,QAAQF,EAAa,KAC3D,GAEKF,IAAK,CAACQ,MAAiB;AAC3B,IAAAN,EAAa,QAAQM,GACrBD,KAAA,QAAAA,EAAMC;AAAAA,EACR;AAEA,WAASE,IAAc;AACV,IAAAN,EAAA,QAAQI,EAAM,UAAU,UAAU,UAASA,EAAM,UAAU,QAAS;AAAA,EAAU;AAGrF,SAAAG,EAAAH,GAAO,CAACI,MAAM;AACZ,IAAAL,KAAA,QAAAA,EAAAM,EAAMD,CAAC;AAAA,EAAC,CACf,GAEDE,EAAU,MAAM;AACd,IAAAjB,EAAG,IAAIG,CAAE;AAAA,EAAA,CACV,GAEDe,EAAY,MAAM;AAChB,IAAAlB,EAAG,OAAOG,CAAE;AAAA,EAAA,CACb,GAEM,CAACQ,GAAOE,CAAW;AAC5B;"}