@tresjs/leches 0.1.0

package/dist/tresleches.js

@@ -0,0 +1,1199 @@
+/**
+ * name: @tresjs/leches
+ * version: v0.1.0
+ * (c) 2023
+ * description: Tasty GUI for Vue controls 🍰
+ * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
+ */
+import { unref as z, getCurrentScope as st, onScopeDispose as it, toRef as nt, readonly as rt, customRef as ot, ref as w, defineComponent as C, computed as v, reactive as W, h as ht, watch as E, inject as at, isReactive as lt, toRefs as ct, isRef as F, openBlock as g, createElementBlock as b, createElementVNode as d, toDisplayString as $, normalizeClass as q, withDirectives as ut, vShow as yt, normalizeStyle as xt, Fragment as L, renderList as B, createCommentVNode as U, createBlock as k, withCtx as _t } from "vue";
+import { useStorage as dt, isClient as mt, useDraggable as gt, useMouse as V, useWindowSize as ft } from "@vueuse/core";
+function K(i) {
+  return st() ? (it(i), !0) : !1;
+}
+function I(i) {
+  return typeof i == "function" ? i() : z(i);
+}
+const G = typeof window < "u", J = () => {
+}, Y = /* @__PURE__ */ pt();
+function pt() {
+  var i;
+  return G && ((i = window == null ? void 0 : window.navigator) == null ? void 0 : i.userAgent) && /* @__PURE__ */ /iP(ad|hone|od)/.test(window.navigator.userAgent);
+}
+function zt(...i) {
+  if (i.length !== 1)
+    return nt(...i);
+  const t = i[0];
+  return typeof t == "function" ? rt(ot(() => ({ get: t, set: J }))) : w(t);
+}
+function Mt(i) {
+  var t;
+  const e = I(i);
+  return (t = e == null ? void 0 : e.$el) != null ? t : e;
+}
+const wt = G ? window : void 0;
+function bt(...i) {
+  let t, e, s, n;
+  if (typeof i[0] == "string" || Array.isArray(i[0]) ? ([e, s, n] = i, t = wt) : [t, e, s, n] = i, !t)
+    return J;
+  Array.isArray(e) || (e = [e]), Array.isArray(s) || (s = [s]);
+  const r = [], a = () => {
+    r.forEach((l) => l()), r.length = 0;
+  }, h = (l, o, x, c) => (l.addEventListener(o, x, c), () => l.removeEventListener(o, x, c)), y = E(
+    () => [Mt(t), I(n)],
+    ([l, o]) => {
+      a(), l && r.push(
+        ...e.flatMap((x) => s.map((c) => h(l, x, c, o)))
+      );
+    },
+    { immediate: !0, flush: "post" }
+  ), u = () => {
+    y(), a();
+  };
+  return K(u), u;
+}
+var vt = Object.defineProperty, Ct = Object.defineProperties, St = Object.getOwnPropertyDescriptors, H = Object.getOwnPropertySymbols, kt = Object.prototype.hasOwnProperty, $t = Object.prototype.propertyIsEnumerable, O = (i, t, e) => t in i ? vt(i, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[t] = e, Et = (i, t) => {
+  for (var e in t || (t = {}))
+    kt.call(t, e) && O(i, e, t[e]);
+  if (H)
+    for (var e of H(t))
+      $t.call(t, e) && O(i, e, t[e]);
+  return i;
+}, At = (i, t) => Ct(i, St(t));
+const It = /* @__PURE__ */ C({
+  name: "UseDraggable",
+  props: [
+    "storageKey",
+    "storageType",
+    "initialValue",
+    "exact",
+    "preventDefault",
+    "stopPropagation",
+    "pointerTypes",
+    "as",
+    "handle",
+    "axis"
+  ],
+  setup(i, { slots: t }) {
+    const e = w(), s = v(() => {
+      var y;
+      return (y = i.handle) != null ? y : e.value;
+    }), n = i.storageKey && dt(
+      i.storageKey,
+      I(i.initialValue) || { x: 0, y: 0 },
+      mt ? i.storageType === "session" ? sessionStorage : localStorage : void 0
+    ), r = n || i.initialValue || { x: 0, y: 0 }, a = (y) => {
+      n && (n.value.x = y.x, n.value.y = y.y);
+    }, h = W(gt(e, At(Et({}, i), {
+      handle: s,
+      initialValue: r,
+      onEnd: a
+    })));
+    return () => {
+      if (t.default)
+        return ht(i.as || "div", { ref: e, style: `touch-action:none;${h.style}` }, t.default(h));
+    };
+  }
+});
+function tt(i) {
+  const t = window.getComputedStyle(i);
+  if (t.overflowX === "scroll" || t.overflowY === "scroll" || t.overflowX === "auto" && i.clientHeight < i.scrollHeight || t.overflowY === "auto" && i.clientWidth < i.scrollWidth)
+    return !0;
+  {
+    const e = i.parentNode;
+    return !e || e.tagName === "BODY" ? !1 : tt(e);
+  }
+}
+function Tt(i) {
+  const t = i || window.event, e = t.target;
+  return tt(e) ? !1 : t.touches.length > 1 ? !0 : (t.preventDefault && t.preventDefault(), !1);
+}
+function qt(i, t = !1) {
+  const e = w(t);
+  let s = null, n;
+  E(zt(i), (h) => {
+    if (h) {
+      const y = h;
+      n = y.style.overflow, e.value && (y.style.overflow = "hidden");
+    }
+  }, {
+    immediate: !0
+  });
+  const r = () => {
+    const h = I(i);
+    !h || e.value || (Y && (s = bt(
+      h,
+      "touchmove",
+      (y) => {
+        Tt(y);
+      },
+      { passive: !1 }
+    )), h.style.overflow = "hidden", e.value = !0);
+  }, a = () => {
+    const h = I(i);
+    !h || !e.value || (Y && (s == null || s()), h.style.overflow = n, e.value = !1);
+  };
+  return K(a), v({
+    get() {
+      return e.value;
+    },
+    set(h) {
+      h ? r() : a();
+    }
+  });
+}
+function Dt() {
+  let i = !1;
+  const t = w(!1);
+  return (e, s) => {
+    if (t.value = s.value, i)
+      return;
+    i = !0;
+    const n = qt(e, s.value);
+    E(t, (r) => n.value = r);
+  };
+}
+Dt();
+const Pt = Symbol("CONTROLS_CONTEXT_KEY"), j = W({
+  controls: []
+});
+function jt() {
+  return j;
+}
+function Q(i) {
+  return Object.entries(i).map(([t, e]) => !F(e) && e.value ? {
+    ...e,
+    label: e.label || t,
+    value: e.value,
+    type: typeof e.value.value,
+    visible: !0
+  } : {
+    label: e.label || t,
+    value: e,
+    type: F(e) ? typeof e.value : typeof e,
+    visible: !0
+  });
+}
+function Se(i) {
+  const t = at(Pt, {});
+  let e = [];
+  if (typeof i != "string")
+    if (lt(i)) {
+      const s = ct(i);
+      e = Q(s);
+    } else
+      e = Q(i);
+  return j.controls = [...j.controls, ...e], t;
+}
+/**
+ * @license
+ * Copyright 2010-2023 Three.js Authors
+ * SPDX-License-Identifier: MIT
+ */
+const et = "152";
+function X(i, t, e) {
+  return Math.max(t, Math.min(e, i));
+}
+class D {
+  constructor(t = 0, e = 0) {
+    D.prototype.isVector2 = !0, this.x = t, this.y = e;
+  }
+  get width() {
+    return this.x;
+  }
+  set width(t) {
+    this.x = t;
+  }
+  get height() {
+    return this.y;
+  }
+  set height(t) {
+    this.y = t;
+  }
+  set(t, e) {
+    return this.x = t, this.y = e, this;
+  }
+  setScalar(t) {
+    return this.x = t, this.y = t, this;
+  }
+  setX(t) {
+    return this.x = t, this;
+  }
+  setY(t) {
+    return this.y = t, this;
+  }
+  setComponent(t, e) {
+    switch (t) {
+      case 0:
+        this.x = e;
+        break;
+      case 1:
+        this.y = e;
+        break;
+      default:
+        throw new Error("index is out of range: " + t);
+    }
+    return this;
+  }
+  getComponent(t) {
+    switch (t) {
+      case 0:
+        return this.x;
+      case 1:
+        return this.y;
+      default:
+        throw new Error("index is out of range: " + t);
+    }
+  }
+  clone() {
+    return new this.constructor(this.x, this.y);
+  }
+  copy(t) {
+    return this.x = t.x, this.y = t.y, this;
+  }
+  add(t) {
+    return this.x += t.x, this.y += t.y, this;
+  }
+  addScalar(t) {
+    return this.x += t, this.y += t, this;
+  }
+  addVectors(t, e) {
+    return this.x = t.x + e.x, this.y = t.y + e.y, this;
+  }
+  addScaledVector(t, e) {
+    return this.x += t.x * e, this.y += t.y * e, this;
+  }
+  sub(t) {
+    return this.x -= t.x, this.y -= t.y, this;
+  }
+  subScalar(t) {
+    return this.x -= t, this.y -= t, this;
+  }
+  subVectors(t, e) {
+    return this.x = t.x - e.x, this.y = t.y - e.y, this;
+  }
+  multiply(t) {
+    return this.x *= t.x, this.y *= t.y, this;
+  }
+  multiplyScalar(t) {
+    return this.x *= t, this.y *= t, this;
+  }
+  divide(t) {
+    return this.x /= t.x, this.y /= t.y, this;
+  }
+  divideScalar(t) {
+    return this.multiplyScalar(1 / t);
+  }
+  applyMatrix3(t) {
+    const e = this.x, s = this.y, n = t.elements;
+    return this.x = n[0] * e + n[3] * s + n[6], this.y = n[1] * e + n[4] * s + n[7], this;
+  }
+  min(t) {
+    return this.x = Math.min(this.x, t.x), this.y = Math.min(this.y, t.y), this;
+  }
+  max(t) {
+    return this.x = Math.max(this.x, t.x), this.y = Math.max(this.y, t.y), this;
+  }
+  clamp(t, e) {
+    return this.x = Math.max(t.x, Math.min(e.x, this.x)), this.y = Math.max(t.y, Math.min(e.y, this.y)), this;
+  }
+  clampScalar(t, e) {
+    return this.x = Math.max(t, Math.min(e, this.x)), this.y = Math.max(t, Math.min(e, this.y)), this;
+  }
+  clampLength(t, e) {
+    const s = this.length();
+    return this.divideScalar(s || 1).multiplyScalar(Math.max(t, Math.min(e, s)));
+  }
+  floor() {
+    return this.x = Math.floor(this.x), this.y = Math.floor(this.y), this;
+  }
+  ceil() {
+    return this.x = Math.ceil(this.x), this.y = Math.ceil(this.y), this;
+  }
+  round() {
+    return this.x = Math.round(this.x), this.y = Math.round(this.y), this;
+  }
+  roundToZero() {
+    return this.x = this.x < 0 ? Math.ceil(this.x) : Math.floor(this.x), this.y = this.y < 0 ? Math.ceil(this.y) : Math.floor(this.y), this;
+  }
+  negate() {
+    return this.x = -this.x, this.y = -this.y, this;
+  }
+  dot(t) {
+    return this.x * t.x + this.y * t.y;
+  }
+  cross(t) {
+    return this.x * t.y - this.y * t.x;
+  }
+  lengthSq() {
+    return this.x * this.x + this.y * this.y;
+  }
+  length() {
+    return Math.sqrt(this.x * this.x + this.y * this.y);
+  }
+  manhattanLength() {
+    return Math.abs(this.x) + Math.abs(this.y);
+  }
+  normalize() {
+    return this.divideScalar(this.length() || 1);
+  }
+  angle() {
+    return Math.atan2(-this.y, -this.x) + Math.PI;
+  }
+  angleTo(t) {
+    const e = Math.sqrt(this.lengthSq() * t.lengthSq());
+    if (e === 0)
+      return Math.PI / 2;
+    const s = this.dot(t) / e;
+    return Math.acos(X(s, -1, 1));
+  }
+  distanceTo(t) {
+    return Math.sqrt(this.distanceToSquared(t));
+  }
+  distanceToSquared(t) {
+    const e = this.x - t.x, s = this.y - t.y;
+    return e * e + s * s;
+  }
+  manhattanDistanceTo(t) {
+    return Math.abs(this.x - t.x) + Math.abs(this.y - t.y);
+  }
+  setLength(t) {
+    return this.normalize().multiplyScalar(t);
+  }
+  lerp(t, e) {
+    return this.x += (t.x - this.x) * e, this.y += (t.y - this.y) * e, this;
+  }
+  lerpVectors(t, e, s) {
+    return this.x = t.x + (e.x - t.x) * s, this.y = t.y + (e.y - t.y) * s, this;
+  }
+  equals(t) {
+    return t.x === this.x && t.y === this.y;
+  }
+  fromArray(t, e = 0) {
+    return this.x = t[e], this.y = t[e + 1], this;
+  }
+  toArray(t = [], e = 0) {
+    return t[e] = this.x, t[e + 1] = this.y, t;
+  }
+  fromBufferAttribute(t, e) {
+    return this.x = t.getX(e), this.y = t.getY(e), this;
+  }
+  rotateAround(t, e) {
+    const s = Math.cos(e), n = Math.sin(e), r = this.x - t.x, a = this.y - t.y;
+    return this.x = r * s - a * n + t.x, this.y = r * n + a * s + t.y, this;
+  }
+  random() {
+    return this.x = Math.random(), this.y = Math.random(), this;
+  }
+  *[Symbol.iterator]() {
+    yield this.x, yield this.y;
+  }
+}
+class Lt {
+  constructor(t = 0, e = 0, s = 0, n = 1) {
+    this.isQuaternion = !0, this._x = t, this._y = e, this._z = s, this._w = n;
+  }
+  static slerpFlat(t, e, s, n, r, a, h) {
+    let y = s[n + 0], u = s[n + 1], l = s[n + 2], o = s[n + 3];
+    const x = r[a + 0], c = r[a + 1], _ = r[a + 2], f = r[a + 3];
+    if (h === 0) {
+      t[e + 0] = y, t[e + 1] = u, t[e + 2] = l, t[e + 3] = o;
+      return;
+    }
+    if (h === 1) {
+      t[e + 0] = x, t[e + 1] = c, t[e + 2] = _, t[e + 3] = f;
+      return;
+    }
+    if (o !== f || y !== x || u !== c || l !== _) {
+      let p = 1 - h;
+      const m = y * x + u * c + l * _ + o * f, M = m >= 0 ? 1 : -1, N = 1 - m * m;
+      if (N > Number.EPSILON) {
+        const S = Math.sqrt(N), R = Math.atan2(S, m * M);
+        p = Math.sin(p * R) / S, h = Math.sin(h * R) / S;
+      }
+      const T = h * M;
+      if (y = y * p + x * T, u = u * p + c * T, l = l * p + _ * T, o = o * p + f * T, p === 1 - h) {
+        const S = 1 / Math.sqrt(y * y + u * u + l * l + o * o);
+        y *= S, u *= S, l *= S, o *= S;
+      }
+    }
+    t[e] = y, t[e + 1] = u, t[e + 2] = l, t[e + 3] = o;
+  }
+  static multiplyQuaternionsFlat(t, e, s, n, r, a) {
+    const h = s[n], y = s[n + 1], u = s[n + 2], l = s[n + 3], o = r[a], x = r[a + 1], c = r[a + 2], _ = r[a + 3];
+    return t[e] = h * _ + l * o + y * c - u * x, t[e + 1] = y * _ + l * x + u * o - h * c, t[e + 2] = u * _ + l * c + h * x - y * o, t[e + 3] = l * _ - h * o - y * x - u * c, t;
+  }
+  get x() {
+    return this._x;
+  }
+  set x(t) {
+    this._x = t, this._onChangeCallback();
+  }
+  get y() {
+    return this._y;
+  }
+  set y(t) {
+    this._y = t, this._onChangeCallback();
+  }
+  get z() {
+    return this._z;
+  }
+  set z(t) {
+    this._z = t, this._onChangeCallback();
+  }
+  get w() {
+    return this._w;
+  }
+  set w(t) {
+    this._w = t, this._onChangeCallback();
+  }
+  set(t, e, s, n) {
+    return this._x = t, this._y = e, this._z = s, this._w = n, this._onChangeCallback(), this;
+  }
+  clone() {
+    return new this.constructor(this._x, this._y, this._z, this._w);
+  }
+  copy(t) {
+    return this._x = t.x, this._y = t.y, this._z = t.z, this._w = t.w, this._onChangeCallback(), this;
+  }
+  setFromEuler(t, e) {
+    const s = t._x, n = t._y, r = t._z, a = t._order, h = Math.cos, y = Math.sin, u = h(s / 2), l = h(n / 2), o = h(r / 2), x = y(s / 2), c = y(n / 2), _ = y(r / 2);
+    switch (a) {
+      case "XYZ":
+        this._x = x * l * o + u * c * _, this._y = u * c * o - x * l * _, this._z = u * l * _ + x * c * o, this._w = u * l * o - x * c * _;
+        break;
+      case "YXZ":
+        this._x = x * l * o + u * c * _, this._y = u * c * o - x * l * _, this._z = u * l * _ - x * c * o, this._w = u * l * o + x * c * _;
+        break;
+      case "ZXY":
+        this._x = x * l * o - u * c * _, this._y = u * c * o + x * l * _, this._z = u * l * _ + x * c * o, this._w = u * l * o - x * c * _;
+        break;
+      case "ZYX":
+        this._x = x * l * o - u * c * _, this._y = u * c * o + x * l * _, this._z = u * l * _ - x * c * o, this._w = u * l * o + x * c * _;
+        break;
+      case "YZX":
+        this._x = x * l * o + u * c * _, this._y = u * c * o + x * l * _, this._z = u * l * _ - x * c * o, this._w = u * l * o - x * c * _;
+        break;
+      case "XZY":
+        this._x = x * l * o - u * c * _, this._y = u * c * o - x * l * _, this._z = u * l * _ + x * c * o, this._w = u * l * o + x * c * _;
+        break;
+      default:
+        console.warn("THREE.Quaternion: .setFromEuler() encountered an unknown order: " + a);
+    }
+    return e !== !1 && this._onChangeCallback(), this;
+  }
+  setFromAxisAngle(t, e) {
+    const s = e / 2, n = Math.sin(s);
+    return this._x = t.x * n, this._y = t.y * n, this._z = t.z * n, this._w = Math.cos(s), this._onChangeCallback(), this;
+  }
+  setFromRotationMatrix(t) {
+    const e = t.elements, s = e[0], n = e[4], r = e[8], a = e[1], h = e[5], y = e[9], u = e[2], l = e[6], o = e[10], x = s + h + o;
+    if (x > 0) {
+      const c = 0.5 / Math.sqrt(x + 1);
+      this._w = 0.25 / c, this._x = (l - y) * c, this._y = (r - u) * c, this._z = (a - n) * c;
+    } else if (s > h && s > o) {
+      const c = 2 * Math.sqrt(1 + s - h - o);
+      this._w = (l - y) / c, this._x = 0.25 * c, this._y = (n + a) / c, this._z = (r + u) / c;
+    } else if (h > o) {
+      const c = 2 * Math.sqrt(1 + h - s - o);
+      this._w = (r - u) / c, this._x = (n + a) / c, this._y = 0.25 * c, this._z = (y + l) / c;
+    } else {
+      const c = 2 * Math.sqrt(1 + o - s - h);
+      this._w = (a - n) / c, this._x = (r + u) / c, this._y = (y + l) / c, this._z = 0.25 * c;
+    }
+    return this._onChangeCallback(), this;
+  }
+  setFromUnitVectors(t, e) {
+    let s = t.dot(e) + 1;
+    return s < Number.EPSILON ? (s = 0, Math.abs(t.x) > Math.abs(t.z) ? (this._x = -t.y, this._y = t.x, this._z = 0, this._w = s) : (this._x = 0, this._y = -t.z, this._z = t.y, this._w = s)) : (this._x = t.y * e.z - t.z * e.y, this._y = t.z * e.x - t.x * e.z, this._z = t.x * e.y - t.y * e.x, this._w = s), this.normalize();
+  }
+  angleTo(t) {
+    return 2 * Math.acos(Math.abs(X(this.dot(t), -1, 1)));
+  }
+  rotateTowards(t, e) {
+    const s = this.angleTo(t);
+    if (s === 0)
+      return this;
+    const n = Math.min(1, e / s);
+    return this.slerp(t, n), this;
+  }
+  identity() {
+    return this.set(0, 0, 0, 1);
+  }
+  invert() {
+    return this.conjugate();
+  }
+  conjugate() {
+    return this._x *= -1, this._y *= -1, this._z *= -1, this._onChangeCallback(), this;
+  }
+  dot(t) {
+    return this._x * t._x + this._y * t._y + this._z * t._z + this._w * t._w;
+  }
+  lengthSq() {
+    return this._x * this._x + this._y * this._y + this._z * this._z + this._w * this._w;
+  }
+  length() {
+    return Math.sqrt(this._x * this._x + this._y * this._y + this._z * this._z + this._w * this._w);
+  }
+  normalize() {
+    let t = this.length();
+    return t === 0 ? (this._x = 0, this._y = 0, this._z = 0, this._w = 1) : (t = 1 / t, this._x = this._x * t, this._y = this._y * t, this._z = this._z * t, this._w = this._w * t), this._onChangeCallback(), this;
+  }
+  multiply(t) {
+    return this.multiplyQuaternions(this, t);
+  }
+  premultiply(t) {
+    return this.multiplyQuaternions(t, this);
+  }
+  multiplyQuaternions(t, e) {
+    const s = t._x, n = t._y, r = t._z, a = t._w, h = e._x, y = e._y, u = e._z, l = e._w;
+    return this._x = s * l + a * h + n * u - r * y, this._y = n * l + a * y + r * h - s * u, this._z = r * l + a * u + s * y - n * h, this._w = a * l - s * h - n * y - r * u, this._onChangeCallback(), this;
+  }
+  slerp(t, e) {
+    if (e === 0)
+      return this;
+    if (e === 1)
+      return this.copy(t);
+    const s = this._x, n = this._y, r = this._z, a = this._w;
+    let h = a * t._w + s * t._x + n * t._y + r * t._z;
+    if (h < 0 ? (this._w = -t._w, this._x = -t._x, this._y = -t._y, this._z = -t._z, h = -h) : this.copy(t), h >= 1)
+      return this._w = a, this._x = s, this._y = n, this._z = r, this;
+    const y = 1 - h * h;
+    if (y <= Number.EPSILON) {
+      const c = 1 - e;
+      return this._w = c * a + e * this._w, this._x = c * s + e * this._x, this._y = c * n + e * this._y, this._z = c * r + e * this._z, this.normalize(), this._onChangeCallback(), this;
+    }
+    const u = Math.sqrt(y), l = Math.atan2(u, h), o = Math.sin((1 - e) * l) / u, x = Math.sin(e * l) / u;
+    return this._w = a * o + this._w * x, this._x = s * o + this._x * x, this._y = n * o + this._y * x, this._z = r * o + this._z * x, this._onChangeCallback(), this;
+  }
+  slerpQuaternions(t, e, s) {
+    return this.copy(t).slerp(e, s);
+  }
+  random() {
+    const t = Math.random(), e = Math.sqrt(1 - t), s = Math.sqrt(t), n = 2 * Math.PI * Math.random(), r = 2 * Math.PI * Math.random();
+    return this.set(
+      e * Math.cos(n),
+      s * Math.sin(r),
+      s * Math.cos(r),
+      e * Math.sin(n)
+    );
+  }
+  equals(t) {
+    return t._x === this._x && t._y === this._y && t._z === this._z && t._w === this._w;
+  }
+  fromArray(t, e = 0) {
+    return this._x = t[e], this._y = t[e + 1], this._z = t[e + 2], this._w = t[e + 3], this._onChangeCallback(), this;
+  }
+  toArray(t = [], e = 0) {
+    return t[e] = this._x, t[e + 1] = this._y, t[e + 2] = this._z, t[e + 3] = this._w, t;
+  }
+  fromBufferAttribute(t, e) {
+    return this._x = t.getX(e), this._y = t.getY(e), this._z = t.getZ(e), this._w = t.getW(e), this;
+  }
+  toJSON() {
+    return this.toArray();
+  }
+  _onChange(t) {
+    return this._onChangeCallback = t, this;
+  }
+  _onChangeCallback() {
+  }
+  *[Symbol.iterator]() {
+    yield this._x, yield this._y, yield this._z, yield this._w;
+  }
+}
+class A {
+  constructor(t = 0, e = 0, s = 0) {
+    A.prototype.isVector3 = !0, this.x = t, this.y = e, this.z = s;
+  }
+  set(t, e, s) {
+    return s === void 0 && (s = this.z), this.x = t, this.y = e, this.z = s, this;
+  }
+  setScalar(t) {
+    return this.x = t, this.y = t, this.z = t, this;
+  }
+  setX(t) {
+    return this.x = t, this;
+  }
+  setY(t) {
+    return this.y = t, this;
+  }
+  setZ(t) {
+    return this.z = t, this;
+  }
+  setComponent(t, e) {
+    switch (t) {
+      case 0:
+        this.x = e;
+        break;
+      case 1:
+        this.y = e;
+        break;
+      case 2:
+        this.z = e;
+        break;
+      default:
+        throw new Error("index is out of range: " + t);
+    }
+    return this;
+  }
+  getComponent(t) {
+    switch (t) {
+      case 0:
+        return this.x;
+      case 1:
+        return this.y;
+      case 2:
+        return this.z;
+      default:
+        throw new Error("index is out of range: " + t);
+    }
+  }
+  clone() {
+    return new this.constructor(this.x, this.y, this.z);
+  }
+  copy(t) {
+    return this.x = t.x, this.y = t.y, this.z = t.z, this;
+  }
+  add(t) {
+    return this.x += t.x, this.y += t.y, this.z += t.z, this;
+  }
+  addScalar(t) {
+    return this.x += t, this.y += t, this.z += t, this;
+  }
+  addVectors(t, e) {
+    return this.x = t.x + e.x, this.y = t.y + e.y, this.z = t.z + e.z, this;
+  }
+  addScaledVector(t, e) {
+    return this.x += t.x * e, this.y += t.y * e, this.z += t.z * e, this;
+  }
+  sub(t) {
+    return this.x -= t.x, this.y -= t.y, this.z -= t.z, this;
+  }
+  subScalar(t) {
+    return this.x -= t, this.y -= t, this.z -= t, this;
+  }
+  subVectors(t, e) {
+    return this.x = t.x - e.x, this.y = t.y - e.y, this.z = t.z - e.z, this;
+  }
+  multiply(t) {
+    return this.x *= t.x, this.y *= t.y, this.z *= t.z, this;
+  }
+  multiplyScalar(t) {
+    return this.x *= t, this.y *= t, this.z *= t, this;
+  }
+  multiplyVectors(t, e) {
+    return this.x = t.x * e.x, this.y = t.y * e.y, this.z = t.z * e.z, this;
+  }
+  applyEuler(t) {
+    return this.applyQuaternion(Z.setFromEuler(t));
+  }
+  applyAxisAngle(t, e) {
+    return this.applyQuaternion(Z.setFromAxisAngle(t, e));
+  }
+  applyMatrix3(t) {
+    const e = this.x, s = this.y, n = this.z, r = t.elements;
+    return this.x = r[0] * e + r[3] * s + r[6] * n, this.y = r[1] * e + r[4] * s + r[7] * n, this.z = r[2] * e + r[5] * s + r[8] * n, this;
+  }
+  applyNormalMatrix(t) {
+    return this.applyMatrix3(t).normalize();
+  }
+  applyMatrix4(t) {
+    const e = this.x, s = this.y, n = this.z, r = t.elements, a = 1 / (r[3] * e + r[7] * s + r[11] * n + r[15]);
+    return this.x = (r[0] * e + r[4] * s + r[8] * n + r[12]) * a, this.y = (r[1] * e + r[5] * s + r[9] * n + r[13]) * a, this.z = (r[2] * e + r[6] * s + r[10] * n + r[14]) * a, this;
+  }
+  applyQuaternion(t) {
+    const e = this.x, s = this.y, n = this.z, r = t.x, a = t.y, h = t.z, y = t.w, u = y * e + a * n - h * s, l = y * s + h * e - r * n, o = y * n + r * s - a * e, x = -r * e - a * s - h * n;
+    return this.x = u * y + x * -r + l * -h - o * -a, this.y = l * y + x * -a + o * -r - u * -h, this.z = o * y + x * -h + u * -a - l * -r, this;
+  }
+  project(t) {
+    return this.applyMatrix4(t.matrixWorldInverse).applyMatrix4(t.projectionMatrix);
+  }
+  unproject(t) {
+    return this.applyMatrix4(t.projectionMatrixInverse).applyMatrix4(t.matrixWorld);
+  }
+  transformDirection(t) {
+    const e = this.x, s = this.y, n = this.z, r = t.elements;
+    return this.x = r[0] * e + r[4] * s + r[8] * n, this.y = r[1] * e + r[5] * s + r[9] * n, this.z = r[2] * e + r[6] * s + r[10] * n, this.normalize();
+  }
+  divide(t) {
+    return this.x /= t.x, this.y /= t.y, this.z /= t.z, this;
+  }
+  divideScalar(t) {
+    return this.multiplyScalar(1 / t);
+  }
+  min(t) {
+    return this.x = Math.min(this.x, t.x), this.y = Math.min(this.y, t.y), this.z = Math.min(this.z, t.z), this;
+  }
+  max(t) {
+    return this.x = Math.max(this.x, t.x), this.y = Math.max(this.y, t.y), this.z = Math.max(this.z, t.z), this;
+  }
+  clamp(t, e) {
+    return this.x = Math.max(t.x, Math.min(e.x, this.x)), this.y = Math.max(t.y, Math.min(e.y, this.y)), this.z = Math.max(t.z, Math.min(e.z, this.z)), this;
+  }
+  clampScalar(t, e) {
+    return this.x = Math.max(t, Math.min(e, this.x)), this.y = Math.max(t, Math.min(e, this.y)), this.z = Math.max(t, Math.min(e, this.z)), this;
+  }
+  clampLength(t, e) {
+    const s = this.length();
+    return this.divideScalar(s || 1).multiplyScalar(Math.max(t, Math.min(e, s)));
+  }
+  floor() {
+    return this.x = Math.floor(this.x), this.y = Math.floor(this.y), this.z = Math.floor(this.z), this;
+  }
+  ceil() {
+    return this.x = Math.ceil(this.x), this.y = Math.ceil(this.y), this.z = Math.ceil(this.z), this;
+  }
+  round() {
+    return this.x = Math.round(this.x), this.y = Math.round(this.y), this.z = Math.round(this.z), this;
+  }
+  roundToZero() {
+    return this.x = this.x < 0 ? Math.ceil(this.x) : Math.floor(this.x), this.y = this.y < 0 ? Math.ceil(this.y) : Math.floor(this.y), this.z = this.z < 0 ? Math.ceil(this.z) : Math.floor(this.z), this;
+  }
+  negate() {
+    return this.x = -this.x, this.y = -this.y, this.z = -this.z, this;
+  }
+  dot(t) {
+    return this.x * t.x + this.y * t.y + this.z * t.z;
+  }
+  // TODO lengthSquared?
+  lengthSq() {
+    return this.x * this.x + this.y * this.y + this.z * this.z;
+  }
+  length() {
+    return Math.sqrt(this.x * this.x + this.y * this.y + this.z * this.z);
+  }
+  manhattanLength() {
+    return Math.abs(this.x) + Math.abs(this.y) + Math.abs(this.z);
+  }
+  normalize() {
+    return this.divideScalar(this.length() || 1);
+  }
+  setLength(t) {
+    return this.normalize().multiplyScalar(t);
+  }
+  lerp(t, e) {
+    return this.x += (t.x - this.x) * e, this.y += (t.y - this.y) * e, this.z += (t.z - this.z) * e, this;
+  }
+  lerpVectors(t, e, s) {
+    return this.x = t.x + (e.x - t.x) * s, this.y = t.y + (e.y - t.y) * s, this.z = t.z + (e.z - t.z) * s, this;
+  }
+  cross(t) {
+    return this.crossVectors(this, t);
+  }
+  crossVectors(t, e) {
+    const s = t.x, n = t.y, r = t.z, a = e.x, h = e.y, y = e.z;
+    return this.x = n * y - r * h, this.y = r * a - s * y, this.z = s * h - n * a, this;
+  }
+  projectOnVector(t) {
+    const e = t.lengthSq();
+    if (e === 0)
+      return this.set(0, 0, 0);
+    const s = t.dot(this) / e;
+    return this.copy(t).multiplyScalar(s);
+  }
+  projectOnPlane(t) {
+    return P.copy(this).projectOnVector(t), this.sub(P);
+  }
+  reflect(t) {
+    return this.sub(P.copy(t).multiplyScalar(2 * this.dot(t)));
+  }
+  angleTo(t) {
+    const e = Math.sqrt(this.lengthSq() * t.lengthSq());
+    if (e === 0)
+      return Math.PI / 2;
+    const s = this.dot(t) / e;
+    return Math.acos(X(s, -1, 1));
+  }
+  distanceTo(t) {
+    return Math.sqrt(this.distanceToSquared(t));
+  }
+  distanceToSquared(t) {
+    const e = this.x - t.x, s = this.y - t.y, n = this.z - t.z;
+    return e * e + s * s + n * n;
+  }
+  manhattanDistanceTo(t) {
+    return Math.abs(this.x - t.x) + Math.abs(this.y - t.y) + Math.abs(this.z - t.z);
+  }
+  setFromSpherical(t) {
+    return this.setFromSphericalCoords(t.radius, t.phi, t.theta);
+  }
+  setFromSphericalCoords(t, e, s) {
+    const n = Math.sin(e) * t;
+    return this.x = n * Math.sin(s), this.y = Math.cos(e) * t, this.z = n * Math.cos(s), this;
+  }
+  setFromCylindrical(t) {
+    return this.setFromCylindricalCoords(t.radius, t.theta, t.y);
+  }
+  setFromCylindricalCoords(t, e, s) {
+    return this.x = t * Math.sin(e), this.y = s, this.z = t * Math.cos(e), this;
+  }
+  setFromMatrixPosition(t) {
+    const e = t.elements;
+    return this.x = e[12], this.y = e[13], this.z = e[14], this;
+  }
+  setFromMatrixScale(t) {
+    const e = this.setFromMatrixColumn(t, 0).length(), s = this.setFromMatrixColumn(t, 1).length(), n = this.setFromMatrixColumn(t, 2).length();
+    return this.x = e, this.y = s, this.z = n, this;
+  }
+  setFromMatrixColumn(t, e) {
+    return this.fromArray(t.elements, e * 4);
+  }
+  setFromMatrix3Column(t, e) {
+    return this.fromArray(t.elements, e * 3);
+  }
+  setFromEuler(t) {
+    return this.x = t._x, this.y = t._y, this.z = t._z, this;
+  }
+  setFromColor(t) {
+    return this.x = t.r, this.y = t.g, this.z = t.b, this;
+  }
+  equals(t) {
+    return t.x === this.x && t.y === this.y && t.z === this.z;
+  }
+  fromArray(t, e = 0) {
+    return this.x = t[e], this.y = t[e + 1], this.z = t[e + 2], this;
+  }
+  toArray(t = [], e = 0) {
+    return t[e] = this.x, t[e + 1] = this.y, t[e + 2] = this.z, t;
+  }
+  fromBufferAttribute(t, e) {
+    return this.x = t.getX(e), this.y = t.getY(e), this.z = t.getZ(e), this;
+  }
+  random() {
+    return this.x = Math.random(), this.y = Math.random(), this.z = Math.random(), this;
+  }
+  randomDirection() {
+    const t = (Math.random() - 0.5) * 2, e = Math.random() * Math.PI * 2, s = Math.sqrt(1 - t ** 2);
+    return this.x = s * Math.cos(e), this.y = s * Math.sin(e), this.z = t, this;
+  }
+  *[Symbol.iterator]() {
+    yield this.x, yield this.y, yield this.z;
+  }
+}
+const P = /* @__PURE__ */ new A(), Z = /* @__PURE__ */ new Lt();
+typeof __THREE_DEVTOOLS__ < "u" && __THREE_DEVTOOLS__.dispatchEvent(new CustomEvent("register", { detail: {
+  revision: et
+} }));
+typeof window < "u" && (window.__THREE__ ? console.warn("WARNING: Multiple instances of Three.js being imported.") : window.__THREE__ = et);
+const Vt = { class: "flex justify-between gap-4 items-center mb-2" }, Xt = { class: "text-gray-500 w-1/3" }, Nt = ["value", "min", "max", "step"], Rt = /* @__PURE__ */ C({
+  __name: "NumberControl",
+  props: {
+    label: null,
+    control: null
+  },
+  emits: ["change"],
+  setup(i, { emit: t }) {
+    const e = i;
+    function s(l) {
+      const { target: o } = l;
+      t("change", o.valueAsNumber);
+    }
+    const n = V(), r = w(0), a = w(!1), h = (l) => {
+      r.value = l.clientX, a.value = !0;
+    }, y = () => {
+      a.value = !1;
+    }, u = (l) => Math.floor(Math.abs(l) / 10);
+    return E(n.x, (l) => {
+      if (a.value) {
+        const o = l - r.value, x = u(o);
+        o > 0 ? t("change", e.control.value + 1 + x) : o < 0 && t("change", e.control.value - 1 + x), e.control.min !== void 0 && e.control.value < e.control.min && t("change", e.control.min), e.control.max !== void 0 && e.control.value > e.control.max && t("change", e.control.max), r.value = l;
+      }
+    }), (l, o) => (g(), b("div", Vt, [
+      d("label", Xt, $(i.label), 1),
+      d("input", {
+        value: i.control.value,
+        class: q(["p-2 w-1/3 rounded text-right text-xs text-gray-400 bg-gray-100 focus:border-gray-200 outline-none border-none font-sans", { "cursor-ew-resize": a.value }]),
+        type: "number",
+        min: i.control.min,
+        max: i.control.max,
+        step: i.control.step,
+        onInput: s,
+        onMousedown: h,
+        onMouseup: y
+      }, null, 42, Nt)
+    ]));
+  }
+}), Ft = { class: "flex justify-between gap-4 items-center mb-2 min-h-32px" }, Yt = { class: "text-gray-500 w-1/3" }, Ht = ["value"], Ot = /* @__PURE__ */ C({
+  __name: "TextControl",
+  props: {
+    label: null,
+    control: null
+  },
+  emits: ["change"],
+  setup(i, { emit: t }) {
+    function e(s) {
+      t("change", s);
+    }
+    return (s, n) => (g(), b("div", Ft, [
+      d("label", Yt, $(i.label), 1),
+      d("input", {
+        value: i.control.value,
+        type: "string",
+        class: "p-2 w-2/3 rounded text-right text-xs text-gray-400 bg-gray-100 focus:border-gray-200 outline-none border-none font-sans",
+        onChange: e
+      }, null, 40, Ht)
+    ]));
+  }
+}), Qt = { class: "flex justify-start gap-2 items-center mb-2 min-h-32px" }, Zt = { class: "text-gray-500 w-1/3" }, Wt = ["id", "checked"], Bt = ["for"], Ut = { class: "i-ic:baseline-check text-light" }, Kt = /* @__PURE__ */ C({
+  __name: "BooleanControl",
+  props: {
+    label: null,
+    control: null
+  },
+  emits: ["change"],
+  setup(i, { emit: t }) {
+    function e(s) {
+      const { target: n } = s;
+      t("change", n.checked);
+    }
+    return (s, n) => (g(), b("div", Qt, [
+      d("label", Zt, $(i.label), 1),
+      d("input", {
+        id: i.control.label,
+        checked: i.control.value,
+        class: "hidden",
+        type: "checkbox",
+        onInput: e
+      }, null, 40, Wt),
+      d("label", {
+        for: i.control.label,
+        class: "inline-flex items-center cursor-pointer"
+      }, [
+        d("span", {
+          class: q([{ "bg-dark-500": i.control.value, "bg-gray-200": !i.control.value }, "w-4 h-4 flex justify-center items-center rounded border border-gray-300 mr-2 transition-colors duration-200"])
+        }, [
+          ut(d("i", Ut, null, 512), [
+            [yt, i.control.value]
+          ])
+        ], 2)
+      ], 8, Bt)
+    ]));
+  }
+}), Gt = { class: "relative flex justify-between gap-4 items-center mb-2" }, Jt = { class: "text-gray-500 w-1/3" }, te = ["value", "min", "max", "step"], ee = ["value", "min", "max", "step"], se = /* @__PURE__ */ C({
+  __name: "SliderControl",
+  props: {
+    label: null,
+    control: null
+  },
+  emits: ["change"],
+  setup(i, { emit: t }) {
+    const e = i;
+    function s(o) {
+      const { target: x } = o;
+      t("change", x.valueAsNumber);
+    }
+    const n = v(() => ({
+      backgroundImage: `linear-gradient(to right, #333 0% ${100 * (e.control.value - (e.control.min || 0)) / ((e.control.max || 100) - (e.control.min || 0))}%, #e2e2e2 0%)`
+    })), r = V(), a = w(0), h = w(!1), y = (o) => {
+      a.value = o.clientX, h.value = !0;
+    }, u = () => {
+      h.value = !1;
+    }, l = (o) => Math.floor(Math.abs(o) / 10);
+    return E(r.x, (o) => {
+      if (h.value) {
+        const x = o - a.value, c = l(x);
+        x > 0 ? t("change", e.control.value + 1 + c) : x < 0 && t("change", e.control.value - 1 + c), e.control.min !== void 0 && e.control.value < e.control.min && t("change", e.control.min), e.control.max !== void 0 && e.control.value > e.control.max && t("change", e.control.max), a.value = o;
+      }
+    }), (o, x) => (g(), b("div", Gt, [
+      d("label", Jt, $(i.label), 1),
+      d("input", {
+        value: i.control.value,
+        class: "w-1/2 h-0.75 bg-dark-200 rounded-full appearance-none",
+        style: xt(z(n)),
+        type: "range",
+        min: i.control.min,
+        max: i.control.max,
+        step: i.control.step,
+        onInput: s
+      }, null, 44, te),
+      d("input", {
+        value: i.control.value,
+        class: q(["p-2 w-1/4 rounded text-right text-xs text-gray-400 bg-gray-100 focus:border-gray-200 outline-none border-none font-sans", { "cursor-ew-resize": h.value }]),
+        type: "number",
+        min: i.control.min,
+        max: i.control.max,
+        step: i.control.step,
+        onInput: s,
+        onMousedown: y,
+        onMouseup: u
+      }, null, 42, ee)
+    ]));
+  }
+});
+const ie = (i, t) => {
+  const e = i.__vccOpts || i;
+  for (const [s, n] of t)
+    e[s] = n;
+  return e;
+}, ne = /* @__PURE__ */ ie(se, [["__scopeId", "data-v-546d47fc"]]), re = { class: "flex justify-between gap-4 items-center mb-2" }, oe = { class: "text-gray-500 w-1/3" }, he = ["value"], ae = ["value"], le = /* @__PURE__ */ C({
+  __name: "ColorControl",
+  props: {
+    label: null,
+    control: null
+  },
+  emits: ["change"],
+  setup(i, { emit: t }) {
+    function e(s) {
+      const { target: n } = s;
+      t("change", n.value);
+    }
+    return (s, n) => (g(), b("div", re, [
+      d("label", oe, $(i.label), 1),
+      d("input", {
+        value: i.control.value,
+        type: "color",
+        onInput: e
+      }, null, 40, he),
+      d("input", {
+        value: i.control.value,
+        class: "p-2 w-2/3 rounded text-right text-xs text-gray-400 bg-gray-100 focus:border-gray-200 outline-none border-none font-sans",
+        type: "text",
+        onInput: e
+      }, null, 40, ae)
+    ]));
+  }
+});
+function ce(i) {
+  return typeof i == "number" ? [i, i, i] : i instanceof A ? [i.x, i.y, i.z] : i;
+}
+const ue = { class: "flex justify-between gap-2 items-center mb-2" }, ye = { class: "text-gray-500 w-1/3" }, xe = { class: "w-2/3 flex justify-between gap-1" }, _e = {
+  key: 0,
+  class: "font-bold px-0.5 py-1 text-0.65rem text-gray-300"
+}, de = ["value", "onInput", "onMousedown", "onMouseup"], me = /* @__PURE__ */ C({
+  __name: "VectorControl",
+  props: {
+    label: null,
+    control: null
+  },
+  emits: ["change"],
+  setup(i, { emit: t }) {
+    const e = i, s = V(), n = w(0), r = w(!1), a = w(0), h = (_, f) => {
+      a.value = f, n.value = _.clientX, r.value = !0;
+    }, y = (_, f) => {
+      a.value = f, r.value = !1;
+    }, u = (_) => Math.floor(Math.abs(_) / 10), l = v(() => ce(e.control.value)), o = v(() => Object.keys(e.control.value)), x = v(() => e.control.value instanceof D || e.control.value instanceof A);
+    function c(_, f) {
+      const { value: p } = e.control, { target: m } = _;
+      a.value = f, p[x.value ? o.value[a.value] : a.value] = parseInt(m.value, 10), t("change", p);
+    }
+    return E(s.x, (_) => {
+      if (r.value) {
+        const f = _ - n.value, p = u(f), { value: m } = e.control, M = x.value ? o.value[a.value] : a.value;
+        f > 0 ? m[M] += 1 + p : f < 0 && (m[M] -= 1 + p), e.control.min !== void 0 && m < e.control.min && (m[M] = e.control.min), e.control.max !== void 0 && m > e.control.max && (m[M] = e.control.max), t("change", m), n.value = _;
+      }
+    }), (_, f) => (g(), b("div", ue, [
+      d("label", ye, $(i.label), 1),
+      d("div", xe, [
+        (g(!0), b(L, null, B(z(l), (p, m) => (g(), b("div", {
+          key: i.label + m,
+          class: "flex items-center w-1/3 bg-gray-100 rounded"
+        }, [
+          z(o)[m] && z(x) ? (g(), b("span", _e, $(z(o)[m]), 1)) : U("", !0),
+          d("input", {
+            type: "text",
+            class: q(["w-full pl-0 p-1 text-right text-0.65rem text-gray-400 bg-transparent focus:border-gray-200 outline-none border-none font-sans", { "cursor-ew-resize": r.value }]),
+            value: z(l)[m].toFixed(2),
+            onInput: (M) => c(M, m),
+            onMousedown: (M) => h(M, m),
+            onMouseup: (M) => y(M, m)
+          }, null, 42, de)
+        ]))), 128))
+      ])
+    ]));
+  }
+}), ge = /* @__PURE__ */ C({
+  __name: "ControlInput",
+  props: {
+    control: null
+  },
+  emits: ["change"],
+  setup(i, { emit: t }) {
+    const e = i, s = v(
+      () => e.control.type === "number" && (e.control.step || e.control.max || e.control.min)
+    ), n = v(() => {
+      const h = /^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$|^0x([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/;
+      return e.control.type === "color" || h.test(e.control.value);
+    }), r = v(
+      () => e.control.value instanceof Array || e.control.value instanceof D || e.control.value instanceof A
+    );
+    function a(h) {
+      t("change", h);
+    }
+    return (h, y) => i.control.visible ? (g(), b(L, { key: 0 }, [
+      z(n) ? (g(), k(le, {
+        key: 0,
+        label: i.control.label,
+        control: i.control,
+        onChange: a
+      }, null, 8, ["label", "control"])) : z(r) ? (g(), k(me, {
+        key: 1,
+        label: i.control.label,
+        control: i.control,
+        onChange: a
+      }, null, 8, ["label", "control"])) : i.control.type === "boolean" ? (g(), k(Kt, {
+        key: 2,
+        label: i.control.label,
+        control: i.control,
+        onChange: a
+      }, null, 8, ["label", "control"])) : z(s) ? z(s) ? (g(), k(ne, {
+        key: 4,
+        label: i.control.label,
+        control: i.control,
+        onChange: a
+      }, null, 8, ["label", "control"])) : (g(), k(Ot, {
+        key: 5,
+        label: i.control.label,
+        control: i.control,
+        onChange: a
+      }, null, 8, ["label", "control"])) : (g(), k(Rt, {
+        key: 3,
+        label: i.control.label,
+        control: i.control,
+        onChange: a
+      }, null, 8, ["label", "control"]))
+    ], 64)) : U("", !0);
+  }
+}), fe = { class: "bg-white shadow-xl rounded border-4 border-solid border-black" }, pe = /* @__PURE__ */ d("i", { class: "h-4 w-4 p-1.5 flex items-center line-height-0 rounded-full bg-gray-100 text-xs" }, "🍰", -1), ze = /* @__PURE__ */ d("div", null, [
+  /* @__PURE__ */ d("i", { class: "i-ic-baseline-drag-indicator" }),
+  /* @__PURE__ */ d("i", { class: "i-ic-baseline-drag-indicator" }),
+  /* @__PURE__ */ d("i", { class: "i-ic-baseline-drag-indicator" })
+], -1), Me = /* @__PURE__ */ d("div", null, null, -1), we = [
+  pe,
+  ze,
+  Me
+], be = { class: "p-4" }, ke = /* @__PURE__ */ C({
+  __name: "TresLeches",
+  setup(i) {
+    const { width: t } = ft(), e = 280, s = w(null), n = jt();
+    function r(a, h) {
+      h.value = a;
+    }
+    return (a, h) => (g(), k(z(It), {
+      "initial-value": { x: z(t) - e - 20, y: 10 },
+      class: "fixed select-none z-24 w-280px font-sans text-xs",
+      handle: s.value
+    }, {
+      default: _t(() => [
+        d("div", fe, [
+          d("header", {
+            ref_key: "handle",
+            ref: s,
+            class: "relative cursor-grabbing p-4 flex justify-between text-gray-200 relative"
+          }, we, 512),
+          d("div", be, [
+            (g(!0), b(L, null, B(z(n).controls, (y) => (g(), k(ge, {
+              key: y.label,
+              control: y,
+              onChange: (u) => r(u, y)
+            }, null, 8, ["control", "onChange"]))), 128))
+          ])
+        ])
+      ]),
+      _: 1
+    }, 8, ["initial-value", "handle"]));
+  }
+});
+export {
+  ke as TresLeches,
+  Se as useControls
+};