@figurosity/consumer-three-dimension-tool 0.8.0 → 0.9.0

package/dist/consumer-three-dimension-tool.js

@@ -1,44 +1,44 @@
-(function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.appendChild(document.createTextNode(".tool-reset-button .qbtn{color:#333;font-weight:700}:has(>.frozen-overlay){position:relative}.frozen-overlay{position:absolute;z-index:10;top:0;left:0;bottom:0;right:0}.debug-color{max-width:100px}.debug-color .swatch{height:20px;width:20px;border-radius:10px;border:1px solid #333}.debug-color .label{font-weight:700}.debug-value span{margin-top:2px;min-width:60px;font-size:11px}.debug-vector{min-width:130px}.debug-vector>div{font-size:10px}.debug-vector>div>span{min-width:20px;font-weight:700}.debug-boolean .indicator{margin-top:6px;margin-right:4px;height:10px;width:10px;border-radius:10px;border:1px solid #333;display:inline-block;background:red}.debug-boolean .indicator.on{background:#adff2f}.debug3D{position:absolute;z-index:14400;top:20px;left:40px;padding:20px;border:1px solid #ccc;border-radius:10px;background-color:#ffffffb3}.debug3D .color-square{display:inline-block;height:15px;width:15px;margin-bottom:-3px;border:1px dotted black}.three-dimension-tool{position:fixed;top:0;left:0;right:0;bottom:0;z-index:100}.three-dimension-tool .tres{width:100%;height:100vh}")),document.head.appendChild(o)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
-import { watch as j, ref as pe, nextTick as ls, onUnmounted as Ut, computed as C, onMounted as $t, openBlock as at, createElementBlock as cs, createCommentVNode as wt, createElementVNode as us, onBeforeMount as ds, defineComponent as V, h as d, withDirectives as ps, vShow as ms, inject as Ze, useModel as fs, onBeforeUnmount as hs, createBlock as vt, unref as bt, withCtx as yt, createVNode as gs, mergeModels as vs } from "vue";
-import { Platform as Ct, useQuasar as bs, QBtn as qt, QSeparator as ve } from "quasar";
-import { CBaseButton as me, CColorPickerPopup as ys, CExpansion as Ve, CToggle as Ht, CSlider as We, CBaseButtons as Jt, CDraggableDrawer as De, CDraggableDrawers as Ss, CToolPage as xs } from "@figurosity/consumer-controls";
-import { defineStore as Ye, storeToRefs as N, getActivePinia as ws } from "pinia";
-import * as I from "three";
+(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".tool-reset-button .qbtn{color:var(--grey-800);font-weight:700}:has(>.frozen-overlay){position:relative}.frozen-overlay{position:absolute;z-index:10;top:0;left:0;bottom:0;right:0}.debug-color{max-width:100px}.debug-color .swatch{height:20px;width:20px;border-radius:10px;border:1px solid var(--grey-800)}.debug-color .label{font-weight:700}.debug-value span{margin-top:2px;min-width:60px;font-size:11px}.debug-vector{min-width:130px}.debug-vector>div{font-size:10px}.debug-vector>div>span{min-width:20px;font-weight:700}.debug-boolean .indicator{margin-top:6px;margin-right:4px;height:10px;width:10px;border-radius:10px;border:1px solid var(--grey-800);display:inline-block;background:red}.debug-boolean .indicator.on{background:#adff2f}.debug3D{position:absolute;z-index:14400;top:20px;left:40px;padding:20px;border:1px solid var(--grey-400);border-radius:10px;background-color:#ffffffb3}.debug3D .color-square{display:inline-block;height:15px;width:15px;margin-bottom:-3px;border:1px dotted black}.three-dimension-tool{position:fixed;top:0;left:0;right:0;bottom:0;z-index:100}.three-dimension-tool .tres{width:100%;height:100vh}")),document.head.appendChild(e)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
+import { watch as G, ref as he, nextTick as cs, onUnmounted as Ut, computed as C, onMounted as $t, openBlock as at, createElementBlock as us, createCommentVNode as wt, createElementVNode as ds, onBeforeMount as ps, defineComponent as V, h as d, withDirectives as ms, vShow as fs, inject as Ze, useModel as hs, onBeforeUnmount as gs, createBlock as vt, unref as bt, withCtx as yt, createVNode as vs, mergeModels as bs } from "vue";
+import { Platform as Ct, useQuasar as ys, QBtn as qt, QSeparator as ye } from "quasar";
+import { CBaseButton as ie, CColorPickerPopup as Ss, CExpansion as Ve, CToggle as Ht, CSlider as We, CBaseButtons as Jt, CDraggableDrawer as Te, CDraggableDrawers as xs, CToolPage as ws } from "@figurosity/consumer-controls";
+import { defineStore as Ye, storeToRefs as O, getActivePinia as Cs } from "pinia";
+import * as k from "three";
 import Qe from "lodash.isequal";
-import { DEFAULT as lt, SKINS as xe, COLORS as oe, GRID as we, LIGHTS as de, RELATED as Ce, getConfig as Cs, useDynamicImages as Es } from "@figurosity/toolbox";
+import { DEFAULT as lt, SKINS as ee, COLORS as ne, GRID as Ce, LIGHTS as fe, RELATED as Ee, getConfig as Es, useDynamicImages as ks } from "@figurosity/toolbox";
 import "three/examples/jsm/loaders/RGBELoader.js";
 import { RoomEnvironment as Is } from "three/examples/jsm/environments/RoomEnvironment.js";
-import { OrbitControls as Ds } from "three/examples/jsm/controls/OrbitControls.js";
-import { mergeVertices as Rt, mergeGeometries as ks } from "three/examples/jsm/utils/BufferGeometryUtils.js";
-import { RoundedBoxGeometry as Ts } from "three/examples/jsm/geometries/RoundedBoxGeometry.js";
-import { GLTFLoader as Ms } from "three/examples/jsm/loaders/GLTFLoader.js";
+import { OrbitControls as Ts } from "three/examples/jsm/controls/OrbitControls.js";
+import { mergeVertices as Rt, mergeGeometries as Ds } from "three/examples/jsm/utils/BufferGeometryUtils.js";
+import { RoundedBoxGeometry as Ms } from "three/examples/jsm/geometries/RoundedBoxGeometry.js";
+import { GLTFLoader as Bs } from "three/examples/jsm/loaders/GLTFLoader.js";
 import { DRACOLoader as As } from "three/examples/jsm/loaders/DRACOLoader.js";
-const Bs = "tool:switched", zs = "pose:viewed", Ps = "skin:changed", St = new I.Vector3(), Vt = (e) => {
-  const t = new I.Box3().setFromObject(e);
+const zs = "tool:switched", Ps = "pose:viewed", Ls = "skin:changed", St = new k.Vector3(), Vt = (e) => {
+  const t = new k.Box3().setFromObject(e);
   console.log("box", t);
-  const s = t.getSize(new I.Vector3()), n = new I.Vector3(
+  const s = t.getSize(new k.Vector3()), o = new k.Vector3(
     (t.min.x + t.max.x) / 2,
     (t.min.y + t.max.y) / 2,
     (t.min.z + t.max.z) / 2
   );
-  console.log("center", n);
-  let r = t.min.y;
-  return console.log("bottom", r), Math.abs(r) < -0.01 && (r = Ls(e)), console.log("bottom", r), {
+  console.log("center", o);
+  let n = t.min.y;
+  return console.log("bottom", n), Math.abs(n) < -0.01 && (n = Rs(e)), console.log("bottom", n), {
     box: t,
     size: s,
-    center: n,
-    bottom: r,
+    center: o,
+    bottom: n,
     top: t.max.y
   };
-}, Ls = (e) => {
+}, Rs = (e) => {
   let t = 1 / 0;
   return e.updateMatrixWorld(!0), e.traverse((s) => {
-    var r, i;
+    var n, i;
     if (!s.isMesh) return;
-    const n = (i = (r = s.geometry) == null ? void 0 : r.attributes) == null ? void 0 : i.position;
-    if (n)
-      for (let o = 0; o < n.count; o++)
-        St.fromBufferAttribute(n, o), St.applyMatrix4(s.matrixWorld), t = Math.min(t, St.y);
+    const o = (i = (n = s.geometry) == null ? void 0 : n.attributes) == null ? void 0 : i.position;
+    if (o)
+      for (let r = 0; r < o.count; r++)
+        St.fromBufferAttribute(o, r), St.applyMatrix4(s.matrixWorld), t = Math.min(t, St.y);
   }), t;
 }, Kt = (e) => ({
   box: {
@@ -65,7 +65,7 @@ const Bs = "tool:switched", zs = "pose:viewed", Ps = "skin:changed", St = new I.
   },
   bottom: e.bottom,
   top: e.top
-}), Wt = "smooth", Rs = (e) => ({
+}), Wt = "smooth", Vs = (e) => ({
   id: e.id,
   uuid: e.uuid ?? null,
   basePoseId: e.basePoseId ?? null,
@@ -77,21 +77,21 @@ const Bs = "tool:switched", zs = "pose:viewed", Ps = "skin:changed", St = new I.
   poseId: e.poseId ?? null,
   url: e.glbPathWebp || e.glbPath || null,
   bounds: e.bounds ?? null
-}), fe = Ye("3d-glbs", {
+}), ae = Ye("3d-glbs", {
   state: () => ({
     models: {}
   }),
   getters: {
     selectedId() {
-      return M().selected;
+      return T().selected;
     },
     poseId(e) {
-      var s, n;
-      const t = M().selected;
-      return (n = (s = e.models) == null ? void 0 : s[t]) == null ? void 0 : n.poseId;
+      var s, o;
+      const t = T().selected;
+      return (o = (s = e.models) == null ? void 0 : s[t]) == null ? void 0 : o.poseId;
     },
     model(e) {
-      const t = M().selected;
+      const t = T().selected;
       return t && e.models[t] ? e.models[t] : null;
     },
     url() {
@@ -105,25 +105,25 @@ const Bs = "tool:switched", zs = "pose:viewed", Ps = "skin:changed", St = new I.
   },
   actions: {
     setBounds(e) {
-      const t = M().selected;
+      const t = T().selected;
       this.models[t] && (this.models[t].bounds = Kt(e));
     },
     setSubjectsFromResponse(e) {
-      var n;
-      const t = ((n = e == null ? void 0 : e.entities) == null ? void 0 : n.glb) || {}, s = {};
-      return Object.keys(t).forEach((r) => {
-        s[r] = Rs(t[r]);
+      var o;
+      const t = ((o = e == null ? void 0 : e.entities) == null ? void 0 : o.glb) || {}, s = {};
+      return Object.keys(t).forEach((n) => {
+        s[n] = Vs(t[n]);
       }), this.models = { ...this.models, ...s }, this.selectDefaultGlbId(e);
     },
     // Picks the GLB id whose skin slug matches DEFAULT_SKIN_SLUG, falls
     // back to result.glb[0], or null when no GLBs are available.
     selectDefaultGlbId(e) {
-      var o, c, a;
-      const t = Array.isArray((o = e == null ? void 0 : e.result) == null ? void 0 : o.glb) ? e.result.glb : [];
+      var r, c, a;
+      const t = Array.isArray((r = e == null ? void 0 : e.result) == null ? void 0 : r.glb) ? e.result.glb : [];
       if (t.length === 0) return null;
-      const s = ((c = e == null ? void 0 : e.entities) == null ? void 0 : c.skins) || {}, n = ((a = e == null ? void 0 : e.entities) == null ? void 0 : a.glb) || {}, i = t.find((u) => {
+      const s = ((c = e == null ? void 0 : e.entities) == null ? void 0 : c.skins) || {}, o = ((a = e == null ? void 0 : e.entities) == null ? void 0 : a.glb) || {}, i = t.find((u) => {
         var P, w;
-        const p = (P = n[u]) == null ? void 0 : P.skinId;
+        const p = (P = o[u]) == null ? void 0 : P.skinId;
         return p != null && ((w = s[p]) == null ? void 0 : w.slug) === Wt;
       }) ?? t[0];
       return typeof i == "string" ? parseInt(i, 10) : i;
@@ -134,15 +134,15 @@ function et(e) {
   const t = e.startsWith("#") ? e.slice(1) : e;
   return parseInt(t, 16);
 }
-function ue(e) {
+function me(e) {
   return `#${e.toString(16).padStart(6, "0")}`;
 }
 const tt = ({
   storeId: e,
   defaultValues: t = {},
   state: s = {},
-  getters: n = {},
-  actions: r = {},
+  getters: o = {},
+  actions: n = {},
   keyBy: i = "selected"
 }) => Ye(e, {
   state: () => ({
@@ -161,78 +161,78 @@ const tt = ({
   }),
   getters: {
     keyId() {
-      return M()[i];
+      return T()[i];
     },
-    model(o) {
-      return o.models[M()[i]];
+    model(r) {
+      return r.models[T()[i]];
     },
-    exists(o) {
-      return typeof o.models[M()[i]] < "u";
+    exists(r) {
+      return typeof r.models[T()[i]] < "u";
     },
-    selectedModel(o) {
-      return o.models[M()[i]] ?? null;
+    selectedModel(r) {
+      return r.models[T()[i]] ?? null;
     },
     mergedModel() {
       return { ...t, ...this.selectedModel ?? {} };
     },
-    propertyById(o) {
-      return (c, a, u = null) => o.models[c] && a in o.models[c] ? o.models[c][a] : u;
+    propertyById(r) {
+      return (c, a, u = null) => r.models[c] && a in r.models[c] ? r.models[c][a] : u;
     },
     propertyChangedById() {
-      return (o, c) => this.propertyById(o, c) !== t[c];
+      return (r, c) => this.propertyById(r, c) !== t[c];
     },
-    propertyChanged(o) {
-      const c = M()[i];
-      return (a) => o.models[c] ? this.propertyById(c, a) !== t[a] : !1;
+    propertyChanged(r) {
+      const c = T()[i];
+      return (a) => r.models[c] ? this.propertyById(c, a) !== t[a] : !1;
     },
     property() {
-      const o = M()[i];
-      return (c, a = t[c]) => this.propertyById(o, c, a);
+      const r = T()[i];
+      return (c, a = t[c]) => this.propertyById(r, c, a);
     },
-    ...n
+    ...o
   },
   actions: {
-    initModel(o) {
-      o != null && (typeof this.models[o] < "u" || this.$patch((c) => {
-        c.models[o] = { ...t };
+    initModel(r) {
+      r != null && (typeof this.models[r] < "u" || this.$patch((c) => {
+        c.models[r] = { ...t };
       }));
     },
     ensureSelectedModel() {
-      const o = M()[i];
-      return o == null ? null : (this.models[o] || (this.models[o] = { ...t }), this.models[o]);
+      const r = T()[i];
+      return r == null ? null : (this.models[r] || (this.models[r] = { ...t }), this.models[r]);
     },
-    setPropertyById(o, c, a) {
-      o != null && (this.models[o] || this.initModel(o), this.$patch({
+    setPropertyById(r, c, a) {
+      r != null && (this.models[r] || this.initModel(r), this.$patch({
         models: {
-          [o]: { ...this.models[o], [c]: a }
+          [r]: { ...this.models[r], [c]: a }
         }
       }));
     },
-    setProperty(o, c) {
-      const a = M()[i];
+    setProperty(r, c) {
+      const a = T()[i];
       a != null && (this.models[a] || this.initModel(a), this.$patch({
         models: {
-          [a]: { ...this.models[a], [o]: c }
+          [a]: { ...this.models[a], [r]: c }
         }
       }));
     },
-    patchSelected(o) {
+    patchSelected(r) {
       const c = this.ensureSelectedModel();
-      c && Object.assign(c, o);
+      c && Object.assign(c, r);
     },
     reset() {
-      const o = M()[i];
-      o != null && this.$patch((c) => {
-        c.models[o] = { ...t };
+      const r = T()[i];
+      r != null && this.$patch((c) => {
+        c.models[r] = { ...t };
       });
     },
-    resetProperty(o) {
-      const c = M()[i];
+    resetProperty(r) {
+      const c = T()[i];
       c != null && this.models[c] && this.$patch({
         models: {
           [c]: {
             ...this.models[c],
-            [o]: t[o]
+            [r]: t[r]
           }
         }
       });
@@ -243,29 +243,29 @@ const tt = ({
     // Returns null when there's no active bucket so the caller can omit
     // the slot from the payload rather than encode a stale snapshot.
     snapshot() {
-      const o = M()[i];
-      return o == null || !this.models[o] ? null : JSON.parse(JSON.stringify(this.models[o]));
+      const r = T()[i];
+      return r == null || !this.models[r] ? null : JSON.parse(JSON.stringify(this.models[r]));
     },
     // Apply a snapshot from the save+freeze payload back onto the
     // active bucket. Missing keys fall through to defaultValues; the
     // caller passes the same shape `snapshot()` produced.
-    restore(o) {
-      if (o == null || typeof o != "object") return;
-      const c = M()[i];
+    restore(r) {
+      if (r == null || typeof r != "object") return;
+      const c = T()[i];
       if (c == null) return;
-      const a = JSON.parse(JSON.stringify(o));
+      const a = JSON.parse(JSON.stringify(r));
       this.$patch((u) => {
         u.models[c] = { ...t, ...a }, u.framed && (u.framed[c] = !0), u.applyRevision = (u.applyRevision || 0) + 1;
       });
     },
-    ...r
+    ...n
   }
 }), Xt = {
   visible: !0,
   opacity: 1,
   color: 16711422,
   texture: "none"
-}, Vs = {
+}, Fs = {
   changed() {
     return this.exists ? !Qe(this.mergedModel, Xt) : !1;
   },
@@ -273,7 +273,7 @@ const tt = ({
     return this.property("color");
   },
   colorHex() {
-    return ue(this.property("color"));
+    return me(this.property("color"));
   },
   opacity() {
     return this.property("opacity");
@@ -284,7 +284,7 @@ const tt = ({
   visible() {
     return this.property("visible");
   }
-}, Fs = {
+}, _s = {
   init() {
     this.initModel(this.keyId);
   },
@@ -304,29 +304,29 @@ const tt = ({
   storeId: "3d-ground",
   defaultValues: Xt,
   state: { offset: -0.75 },
-  getters: Vs,
-  actions: Fs,
+  getters: Fs,
+  actions: _s,
   keyBy: "basePoseId"
-}), _s = {
+}), js = {
   color: 16777215,
   visible: !0,
   debug: !1,
   shadow: !0,
   visualization: !0
-}, Pe = 0, se = 1, Et = 1.25, It = 3, ot = (e, t, s) => Math.max(t, Math.min(s, e)), Gs = 1.25, Le = (e = {}) => ({ ..._s, ...e }), ze = {
+}, Pe = 0, oe = 1, Et = 1.25, kt = 3, ot = (e, t, s) => Math.max(t, Math.min(s, e)), Gs = 1.25, Le = (e = {}) => ({ ...js, ...e }), ze = {
   advanced: !1,
   move: !1,
   position: { x: 0, y: 0, z: 1.5 },
   quaternion: { x: 0, y: 0, z: 0, w: 1 },
   target: { x: 0, y: 0, z: 0 }
-}, Ft = ["advanced", "move"], nt = (e = {}) => ({ ...ze, ...e }), js = {
-  ambientScale: se,
-  userScale: se
-}, rt = (e = {}) => ({ ...js, ...e }), xt = () => ({
+}, Ft = ["advanced", "move"], nt = (e = {}) => ({ ...ze, ...e }), Os = {
+  ambientScale: oe,
+  userScale: oe
+}, rt = (e = {}) => ({ ...Os, ...e }), xt = () => ({
   key: Le(),
   fill: Le({ shadow: !0 }),
   back: Le({ shadow: !0 })
-}), he = Ye("3d-lights", {
+}), ge = Ye("3d-lights", {
   state: () => ({
     lights: {},
     options: {},
@@ -351,10 +351,10 @@ const tt = ({
   }),
   getters: {
     bpId() {
-      return M().basePoseId;
+      return T().basePoseId;
     },
     skinId() {
-      return M().selected;
+      return T().selected;
     },
     // The reset button reflects "user has tweaked something on the
     // active skin." Toggles + rig are per-basePose; sliders are
@@ -364,10 +364,10 @@ const tt = ({
     // toggles + the active skin's slider values count.
     changed(e) {
       const t = e.options[this.bpId];
-      if (t && Ft.some((n) => !Qe(t[n], ze[n])))
+      if (t && Ft.some((o) => !Qe(t[o], ze[o])))
         return !0;
       const s = e.scales[this.skinId];
-      return !!(s && (s.ambientScale !== se || s.userScale !== se));
+      return !!(s && (s.ambientScale !== oe || s.userScale !== oe));
     },
     // Has frameToBounds + syncToStore landed on this basePose's
     // lights rig? Set by markFramed() from the bounds watcher in
@@ -390,13 +390,13 @@ const tt = ({
     // above the new AMBIENT_SCALE_MAX / USER_SCALE_MAX.
     ambientScale(e) {
       var s;
-      const t = ((s = e.scales[this.skinId]) == null ? void 0 : s.ambientScale) ?? se;
+      const t = ((s = e.scales[this.skinId]) == null ? void 0 : s.ambientScale) ?? oe;
       return ot(t, Pe, Et);
     },
     userScale(e) {
       var s;
-      const t = ((s = e.scales[this.skinId]) == null ? void 0 : s.userScale) ?? se;
-      return ot(t, Pe, It);
+      const t = ((s = e.scales[this.skinId]) == null ? void 0 : s.userScale) ?? oe;
+      return ot(t, Pe, kt);
     },
     position(e) {
       var t;
@@ -415,15 +415,15 @@ const tt = ({
       return (t = e.options[this.bpId]) == null ? void 0 : t.radius;
     },
     property(e) {
-      return (t, s = null, n = null) => {
-        const r = e.lights[this.bpId];
-        return !r || !r[t] || !(s in r[t]) ? n : r[t][s];
+      return (t, s = null, o = null) => {
+        const n = e.lights[this.bpId];
+        return !n || !n[t] || !(s in n[t]) ? o : n[t][s];
       };
     },
     colorHex(e) {
       return (t) => {
         const s = e.lights[this.bpId];
-        return !s || !s[t] ? "#ffffff" : ue(s[t].color);
+        return !s || !s[t] ? "#ffffff" : me(s[t].color);
       };
     },
     lightKeys(e) {
@@ -437,7 +437,7 @@ const tt = ({
     reset() {
       const e = this.bpId, t = this.skinId;
       if (e == null) return;
-      this.options[e] || (this.options[e] = nt()), Ft.forEach((n) => this.options[e][n] = ze[n]), t != null && (this.scales[t] || (this.scales[t] = rt()), this.scales[t].ambientScale = se, this.scales[t].userScale = se);
+      this.options[e] || (this.options[e] = nt()), Ft.forEach((o) => this.options[e][o] = ze[o]), t != null && (this.scales[t] || (this.scales[t] = rt()), this.scales[t].ambientScale = oe, this.scales[t].userScale = oe);
       const s = this.seeds[t];
       s ? this.lights[e] = {
         key: { ...s.key },
@@ -453,13 +453,13 @@ const tt = ({
     // survives subsequent skin swaps within the same basePose.
     // scales[skinId] is per-skin and warmed once per skin.
     seedFromRecipe(e, t) {
-      const s = ((t == null ? void 0 : t.spotIntensity) ?? 1) * Gs, n = (t == null ? void 0 : t.ambientIntensity) ?? 0, r = (t == null ? void 0 : t.envIntensity) ?? 1;
+      const s = ((t == null ? void 0 : t.spotIntensity) ?? 1) * Gs, o = (t == null ? void 0 : t.ambientIntensity) ?? 0, n = (t == null ? void 0 : t.envIntensity) ?? 1;
       this.seeds[e] = {
         key: Le({ intensity: s }),
         fill: Le({ intensity: s, shadow: !0 }),
         back: Le({ intensity: s, shadow: !0 }),
-        ambient: { intensity: n },
-        env: { intensity: r }
+        ambient: { intensity: o },
+        env: { intensity: n }
       }, e != null && !this.scales[e] && (this.scales[e] = rt());
       const i = this.bpId;
       i != null && (this.lights[i] || (this.lights[i] = xt()), this.options[i] || (this.options[i] = nt()));
@@ -503,11 +503,11 @@ const tt = ({
         return;
       }
       s.advanced = !1;
-      const n = this.lights[t];
-      if (!n) return;
-      const r = n.key;
+      const o = this.lights[t];
+      if (!o) return;
+      const n = o.key;
       this.collection.forEach((i) => {
-        i !== "key" && (n[i].color = r.color);
+        i !== "key" && (o[i].color = n.color);
       });
     },
     setColorHex(e, t) {
@@ -515,23 +515,23 @@ const tt = ({
       this.initLights();
       const s = this.bpId;
       if (s == null) return;
-      const n = this.lights[s];
-      if (!n) return;
-      const r = et(t);
+      const o = this.lights[s];
+      if (!o) return;
+      const n = et(t);
       if (((i = this.options[s]) == null ? void 0 : i.advanced) === !0) {
-        n[e].color = r;
+        o[e].color = n;
         return;
       }
-      this.collection.forEach((o) => {
-        n[o].color = r;
+      this.collection.forEach((r) => {
+        o[r].color = n;
       });
     },
     setProperty(e, t, s) {
       this.initLights();
-      const n = this.bpId;
-      if (n == null) return;
-      const r = this.lights[n];
-      r && (r[e][t] = s);
+      const o = this.bpId;
+      if (o == null) return;
+      const n = this.lights[o];
+      n && (n[e][t] = s);
     },
     setAmbientScale(e) {
       this.initLights();
@@ -541,7 +541,7 @@ const tt = ({
     setUserScale(e) {
       this.initLights();
       const t = this.ensureSelectedScales();
-      t && (t.userScale = ot(e, Pe, It));
+      t && (t.userScale = ot(e, Pe, kt));
     },
     initLights() {
       const e = this.bpId, t = this.skinId;
@@ -565,8 +565,8 @@ const tt = ({
     snapshot() {
       const e = this.bpId, t = this.skinId;
       if (e == null) return null;
-      const s = this.lights[e] ? JSON.parse(JSON.stringify(this.lights[e])) : null, n = this.options[e] ? JSON.parse(JSON.stringify(this.options[e])) : null, r = t != null && this.scales[t] ? JSON.parse(JSON.stringify(this.scales[t])) : null;
-      return !s && !n && !r ? null : { lights: s, options: n, scales: r };
+      const s = this.lights[e] ? JSON.parse(JSON.stringify(this.lights[e])) : null, o = this.options[e] ? JSON.parse(JSON.stringify(this.options[e])) : null, n = t != null && this.scales[t] ? JSON.parse(JSON.stringify(this.scales[t])) : null;
+      return !s && !o && !n ? null : { lights: s, options: o, scales: n };
     },
     restore(e) {
       if (e == null || typeof e != "object") return;
@@ -579,7 +579,7 @@ const tt = ({
   quaternion: { x: -0.12993279108591813, y: 0, z: 0, w: 0.9915228034698058 },
   target: { x: 0, y: 0, z: 0 },
   radius: 1.5
-}, Os = {
+}, Ns = {
   changed() {
     return this.exists ? !Qe(this.mergedModel, Zt) : !1;
   },
@@ -607,7 +607,7 @@ const tt = ({
   radius() {
     return this.mergedModel.radius;
   }
-}, Ns = {
+}, Us = {
   initControls() {
     this.initModel(this.keyId);
   },
@@ -631,19 +631,19 @@ const tt = ({
   storeId: "3d-controls",
   defaultValues: Zt,
   state: { framed: {} },
-  getters: Os,
-  actions: Ns,
+  getters: Ns,
+  actions: Us,
   keyBy: "basePoseId"
-}), Us = {
+}), $s = {
   color: 16711422
-}, $s = {
+}, qs = {
   changed() {
     return this.propertyChanged("color");
   },
   colorHex() {
-    return ue(this.property("color"));
+    return me(this.property("color"));
   }
-}, qs = {
+}, Hs = {
   init() {
     this.initModel(this.keyId);
   },
@@ -652,9 +652,9 @@ const tt = ({
   }
 }, mt = tt({
   storeId: "3d-scene",
-  defaultValues: Us,
-  getters: $s,
-  actions: qs,
+  defaultValues: $s,
+  getters: qs,
+  actions: Hs,
   keyBy: "basePoseId"
 }), Yt = {
   show: !1,
@@ -667,7 +667,7 @@ const tt = ({
   divisions: 6,
   opacity: 0.5,
   size: 2
-}, Hs = {
+}, Js = {
   changed() {
     return !Qe(this.mergedModel, Yt);
   },
@@ -683,17 +683,17 @@ const tt = ({
   divisions() {
     return this.property("divisions");
   }
-}, Js = {
+}, Ks = {
   init() {
     this.initModel(this.keyId);
   }
-}, ke = tt({
+}, ve = tt({
   storeId: "3d-grid",
   defaultValues: Yt,
-  getters: Hs,
-  actions: Js,
+  getters: Js,
+  actions: Ks,
   keyBy: "basePoseId"
-}), Ks = [
+}), Ws = [
   "#141111",
   "#3E251E",
   "#633C30",
@@ -734,154 +734,154 @@ const tt = ({
   "#BDACA8",
   "#DACDC9",
   "#E5E4E3"
-], Dt = "background", kt = "subject", Tt = "ground", Qt = {
-  [kt]: 16711422,
-  [Dt]: 16777215,
-  [Tt]: 12961221
-}, Ws = {
+], It = "background", Tt = "subject", Dt = "ground", Qt = {
+  [Tt]: 16711422,
+  [It]: 16777215,
+  [Dt]: 12961221
+}, Xs = {
   changed() {
     return this.exists ? !Qe(this.mergedModel, Qt) : !1;
   },
   subjectHex() {
-    return ue(this.property(kt));
+    return me(this.property(Tt));
   },
   groundHex() {
-    return ue(this.property(Tt));
+    return me(this.property(Dt));
   },
   backgroundHex() {
-    return ue(this.property(Dt));
+    return me(this.property(It));
   },
   getHexColor() {
-    return (e) => ue(this.property(e, "#F0F0F0"));
+    return (e) => me(this.property(e, "#F0F0F0"));
   }
-}, Xs = {
+}, Zs = {
   setHexColor(e, t) {
     this.setProperty(e, et(t));
   },
   setSubjectHex(e) {
-    this.setHexColor(kt, e);
+    this.setHexColor(Tt, e);
   },
   setGroundHex(e) {
-    this.setHexColor(Tt, e);
+    this.setHexColor(Dt, e);
   },
   setBackgroundHex(e) {
-    this.setHexColor(Dt, e);
+    this.setHexColor(It, e);
   }
 }, Mt = tt({
   storeId: "3d-colors",
   defaultValues: Qt,
-  state: { palette: Ks },
-  getters: Ws,
-  actions: Xs,
+  state: { palette: Ws },
+  getters: Xs,
+  actions: Zs,
   keyBy: "basePoseId"
 });
-let ee = null, Ge = null;
+let te = null, je = null;
 const Re = () => {
-  const e = M(), { aspect: t, width: s, height: n } = N(e), r = (c = { x: 0, y: 0.8, z: 1.5 }) => (console.debug("useCamera init"), ee ? (console.debug("view camera already inited"), ee) : (ee = new I.PerspectiveCamera(75, t.value, 0.1, 100), e.loaded.camera = !0, ee)), i = () => {
-    if (ee)
-      return ee;
+  const e = T(), { aspect: t, width: s, height: o } = O(e), n = (c = { x: 0, y: 0.8, z: 1.5 }) => (console.debug("useCamera init"), te ? (console.debug("view camera already inited"), te) : (te = new k.PerspectiveCamera(75, t.value, 0.1, 100), e.loaded.camera = !0, te)), i = () => {
+    if (te)
+      return te;
   };
-  return Ge = j(
+  return je = G(
     () => t.value,
     (c) => {
-      if (!ee) {
-        r();
+      if (!te) {
+        n();
         return;
       }
-      ee.aspect = c, ee.updateProjectionMatrix();
+      te.aspect = c, te.updateProjectionMatrix();
     }
   ), {
-    init: r,
+    init: n,
     getCamera: i,
     dispose: () => {
-      Ge == null || Ge(), Ge = null, ee = null;
+      je == null || je(), je = null, te = null;
     }
   };
 };
-let W = null, be = null, ye = null, je = null;
+let W = null, Se = null, xe = null, Ge = null;
 const Ie = () => {
-  const e = mt(), t = M(), { colorHex: s } = N(e), n = () => (console.debug("useScene init"), W ? (console.debug("scene already inited"), W) : (W = new I.Scene(), i(s.value), t.loaded.scene = !0, W)), r = () => {
+  const e = mt(), t = T(), { colorHex: s } = O(e), o = () => (console.debug("useScene init"), W ? (console.debug("scene already inited"), W) : (W = new k.Scene(), i(s.value), t.loaded.scene = !0, W)), n = () => {
     if (W)
       return W;
   }, i = (a) => {
     if (!W) throw new Error("Scene has not been initialized");
-    W.background = new I.Color(a);
-  }, o = (a) => {
+    W.background = new k.Color(a);
+  }, r = (a) => {
     if (!W) throw new Error("Scene has not been initialized");
     if (!a) throw new Error("Renderer required to build environment");
-    be || (ye = new I.PMREMGenerator(a), ye.compileEquirectangularShader(), be = ye.fromScene(new Is(), 0.04).texture, W.environment = be);
+    Se || (xe = new k.PMREMGenerator(a), xe.compileEquirectangularShader(), Se = xe.fromScene(new Is(), 0.04).texture, W.environment = Se);
   };
-  return je = j(
+  return Ge = G(
     () => s.value,
     (a) => i(a)
   ), {
-    init: n,
-    get: r,
+    init: o,
+    get: n,
     dispose: () => {
-      t.loaded.scene = !1, je == null || je(), je = null, W && (W.traverse((a) => {
+      t.loaded.scene = !1, Ge == null || Ge(), Ge = null, W && (W.traverse((a) => {
         var u, p;
         a.isMesh && ((u = a.geometry) == null || u.dispose(), Array.isArray(a.material) ? a.material.forEach((P) => P == null ? void 0 : P.dispose()) : (p = a.material) == null || p.dispose());
-      }), W.clear(), W = null, be == null || be.dispose(), ye == null || ye.dispose(), be = null, ye = null);
+      }), W.clear(), W = null, Se == null || Se.dispose(), xe == null || xe.dispose(), Se = null, xe = null);
     },
     setBackgroundColor: i,
-    setEnvironment: o
+    setEnvironment: r
   };
 };
-let L = null, Oe = null, Ne = null;
+let R = null, Oe = null, Ne = null;
 const Xe = () => {
-  const e = M(), { get: t } = Ie(), { getCamera: s } = Re(), { width: n, height: r, subjectLoaded: i } = N(e);
-  function o(w) {
-    return console.debug("useRenderer init"), L ? (console.debug("renderer already inited"), L) : (L = new I.WebGLRenderer({ antialias: !0, alpha: !0, preserveDrawingBuffer: !0 }), L.setSize(n.value, r.value), L.toneMapping = I.ACESFilmicToneMapping, L.toneMappingExposure = 0.8, L.shadowMap.enabled = !0, L.shadowMap.type = I.PCFSoftShadowMap, L.outputColorSpace = I.SRGBColorSpace, w && w.appendChild(L.domElement), e.loaded.renderer = !0, L);
+  const e = T(), { get: t } = Ie(), { getCamera: s } = Re(), { width: o, height: n, subjectLoaded: i } = O(e);
+  function r(w) {
+    return console.debug("useRenderer init"), R ? (console.debug("renderer already inited"), R) : (R = new k.WebGLRenderer({ antialias: !0, alpha: !0, preserveDrawingBuffer: !0 }), R.setSize(o.value, n.value), R.toneMapping = k.ACESFilmicToneMapping, R.toneMappingExposure = 0.8, R.shadowMap.enabled = !0, R.shadowMap.type = k.PCFSoftShadowMap, R.outputColorSpace = k.SRGBColorSpace, w && w.appendChild(R.domElement), e.loaded.renderer = !0, R);
   }
   const c = () => {
-    if (!L) throw new Error("Renderer has not been initialized");
-    return L;
+    if (!R) throw new Error("Renderer has not been initialized");
+    return R;
   }, a = (w) => {
-    L && (L.toneMappingExposure = w);
+    R && (R.toneMappingExposure = w);
   }, u = () => {
     const w = t(), m = s();
-    !w || !m || L.render(w, m);
+    !w || !m || R.render(w, m);
   };
   async function p({ size: w = 1024, format: m = "jpeg", quality: g = 0.85 } = {}) {
-    if (!L) throw new Error("Renderer has not been initialized");
+    if (!R) throw new Error("Renderer has not been initialized");
     const y = t(), x = s();
     if (!y || !x) throw new Error("Scene or camera not ready");
-    const v = L.getSize(new I.Vector2()), k = L.getPixelRatio(), R = x.aspect;
+    const b = R.getSize(new k.Vector2()), D = R.getPixelRatio(), L = x.aspect;
     try {
-      L.setPixelRatio(1), L.setSize(w, w, !1), x.aspect = 1, x.updateProjectionMatrix(), L.render(y, x);
+      R.setPixelRatio(1), R.setSize(w, w, !1), x.aspect = 1, x.updateProjectionMatrix(), R.render(y, x);
       const F = m === "png" ? "image/png" : "image/jpeg";
-      return await new Promise(($, K) => {
-        L.domElement.toBlob(
-          (b) => b ? $(b) : K(new Error("toBlob returned null")),
+      return await new Promise((N, K) => {
+        R.domElement.toBlob(
+          (v) => v ? N(v) : K(new Error("toBlob returned null")),
           F,
           m === "jpeg" ? g : void 0
         );
       });
     } finally {
-      L.setPixelRatio(k), L.setSize(v.x, v.y, !1), x.aspect = R, x.updateProjectionMatrix(), L.render(y, x);
+      R.setPixelRatio(D), R.setSize(b.x, b.y, !1), x.aspect = L, x.updateProjectionMatrix(), R.render(y, x);
     }
   }
-  Oe = j(
-    () => [n.value, r.value],
+  Oe = G(
+    () => [o.value, n.value],
     ([w, m]) => {
-      !w || !m || !L || L.setSize(w, m);
+      !w || !m || !R || R.setSize(w, m);
     }
-  ), Ne = j(
+  ), Ne = G(
     () => i.value,
     () => u()
   );
   function P() {
-    console.debug("renderer disposed"), e.loaded.renderer = !1, Oe == null || Oe(), Ne == null || Ne(), Oe = null, Ne = null, L && (L.domElement.parentElement && L.domElement.parentElement.removeChild(L.domElement), L.dispose(), L = null);
+    console.debug("renderer disposed"), e.loaded.renderer = !1, Oe == null || Oe(), Ne == null || Ne(), Oe = null, Ne = null, R && (R.domElement.parentElement && R.domElement.parentElement.removeChild(R.domElement), R.dispose(), R = null);
   }
   return {
-    init: o,
+    init: r,
     get: c,
     dispose: P,
     render: u,
     setExposure: a,
     captureSnapshot: p
   };
-}, M = Ye("3d", {
+}, T = Ye("3d", {
   state: () => ({
     // models: {},
     selected: null,
@@ -913,9 +913,9 @@ const Xe = () => {
   }),
   getters: {
     active(e) {
-      var s, n;
-      const t = Ct.is.mobile ? lt : xe;
-      return ((n = (s = this.models) == null ? void 0 : s[e.selected]) == null ? void 0 : n.active) || t;
+      var s, o;
+      const t = Ct.is.mobile ? lt : ee;
+      return ((o = (s = this.models) == null ? void 0 : s[e.selected]) == null ? void 0 : o.active) || t;
     },
     aspect(e) {
       return e.height > 0 ? e.width / e.height : 0;
@@ -955,18 +955,18 @@ const Xe = () => {
     },
     setFromResponse(e) {
       var u, p, P;
-      const t = Mt(), s = pt(), n = ke(), r = Fe(), i = he(), o = mt(), a = fe().setSubjectsFromResponse(e);
+      const t = Mt(), s = pt(), o = ve(), n = Fe(), i = ge(), r = mt(), a = ae().setSubjectsFromResponse(e);
       if (this.setUuid = ((u = e == null ? void 0 : e.result) == null ? void 0 : u.setUuid) ?? null, this.basePoseId = ((p = e == null ? void 0 : e.result) == null ? void 0 : p.basePoseId) ?? null, a == null) {
         this.selected = null;
         return;
       }
-      this.selected = a, t.initModel(this.basePoseId), i.initLights(), r.init(), s.initControls(), n.init(), o.init(), this.models[a] || (this.models[a] = {}), (P = this.models[a]) != null && P.active || (this.models[a].active = Ct.is.mobile ? lt : xe);
+      this.selected = a, t.initModel(this.basePoseId), i.initLights(), n.init(), s.initControls(), o.init(), r.init(), this.models[a] || (this.models[a] = {}), (P = this.models[a]) != null && P.active || (this.models[a].active = Ct.is.mobile ? lt : ee);
     }
   }
 });
 let Q = null;
 const ct = () => {
-  const e = pe(!1), t = pe({
+  const e = he(!1), t = he({
     mode: null,
     camera: null,
     // camera (or your lights-camera)
@@ -975,71 +975,71 @@ const ct = () => {
   }), s = (m, g = {}) => {
     if (console.debug("useOrbitControlsBase init"), Q)
       return console.debug("controls already inited"), Q;
-    const y = new I.Object3D();
-    return Q = new Ds(y, m.domElement), r(g), Q;
-  }, n = () => {
+    const y = new k.Object3D();
+    return Q = new Ts(y, m.domElement), n(g), Q;
+  }, o = () => {
     if (!Q) throw new Error("OrbitControls not initialized");
     return Q;
-  }, r = (m = {}) => {
-    const g = n();
+  }, n = (m = {}) => {
+    const g = o();
     g.enableDamping = m.enableDamping ?? !0, g.dampingFactor = m.dampingFactor ?? 0.5, g.rotateSpeed = m.rotateSpeed ?? 0.2, g.enableZoom = m.enableZoom ?? !0, g.minDistance = m.minDistance ?? 0.5, g.maxDistance = m.maxDistance ?? 6, g.panSpeed = m.panSpeed ?? 1;
   }, i = ({ mode: m, camera: g, store: y, options: x }) => {
-    const v = n();
+    const b = o();
     if (!g) throw new Error(`setMode(${m}): camera is required`);
     if (!y) throw new Error(`setMode(${m}): store is required`);
-    v.object = g, r(x), t.value = { mode: m, camera: g, store: y }, a(), v.update();
-  }, o = () => {
+    b.object = g, n(x), t.value = { mode: m, camera: g, store: y }, a(), b.update();
+  }, r = () => {
     Q && Q.update();
   }, c = () => {
-    const m = n(), { camera: g, store: y } = t.value;
+    const m = o(), { camera: g, store: y } = t.value;
     !g || !y || e.value || (y.setPosition({ ...g.position }), y.setQuaternion({ ...g.quaternion }), y.setTarget({ ...m.target }), y.setRadius(g.position.distanceTo(m.target)));
   }, a = () => {
-    const m = n(), { camera: g, store: y } = t.value;
+    const m = o(), { camera: g, store: y } = t.value;
     if (!g || !y) return;
     e.value = !0;
-    const { position: x, quaternion: v, target: k, radius: R } = y;
-    m.target.set(k.x, k.y, k.z);
-    const F = new I.Vector3(
-      x.x - k.x,
-      x.y - k.y,
-      x.z - k.z
+    const { position: x, quaternion: b, target: D, radius: L } = y;
+    m.target.set(D.x, D.y, D.z);
+    const F = new k.Vector3(
+      x.x - D.x,
+      x.y - D.y,
+      x.z - D.z
     ).normalize();
-    g.position.copy(m.target).add(F.multiplyScalar(R)), g.quaternion.set(
-      v.x,
-      v.y,
-      v.z,
-      v.w
+    g.position.copy(m.target).add(F.multiplyScalar(L)), g.quaternion.set(
+      b.x,
+      b.y,
+      b.z,
+      b.w
     ), m.update(), e.value = !1;
   }, u = 0, p = 0.1;
   return {
     init: s,
-    get: n,
+    get: o,
     setMode: i,
-    update: o,
+    update: r,
     syncToStore: c,
     applyFromStore: a,
     frameToBounds: (m, g = 1.75) => {
-      const y = n(), { camera: x } = t.value;
+      const y = o(), { camera: x } = t.value;
       if (!x || !m) return;
-      const v = new I.Vector3(
+      const b = new k.Vector3(
         m.center.x,
         m.center.y + m.size.y * u,
         m.center.z
       );
       console.log("bounds", m);
-      const k = Math.max(m.size.x, m.size.y, m.size.z), R = I.MathUtils.degToRad(x.fov);
-      let F = k / 2 / Math.tan(R / 2) * g;
-      y.target.copy(v), x.position.set(
-        v.x,
-        v.y + m.size.y * p,
-        v.z + F
+      const D = Math.max(m.size.x, m.size.y, m.size.z), L = k.MathUtils.degToRad(x.fov);
+      let F = D / 2 / Math.tan(L / 2) * g;
+      y.target.copy(b), x.position.set(
+        b.x,
+        b.y + m.size.y * p,
+        b.z + F
       ), x.near = F / 100, x.far = F * 100, x.updateProjectionMatrix(), y.update();
     },
     dispose: () => {
       console.debug("controls disposed"), Q && (Q.dispose(), Q = null, t.value = { mode: null, camera: null, store: null });
     }
   };
-}, At = () => {
+}, Bt = () => {
   const { getCamera: e } = Re(), t = pt(), s = ct();
   return {
     activate: () => {
@@ -1058,7 +1058,7 @@ const ct = () => {
     syncToStore: s.syncToStore,
     applyFromStore: s.applyFromStore
   };
-}, Zs = {
+}, Ys = {
   asphalt: {
     ao: "ao.jpg",
     color: "color.jpg",
@@ -1094,98 +1094,98 @@ const ct = () => {
     repeat: 100
   }
 };
-let A = null, Ue = null, $e = null, qe = null;
+let B = null, Ue = null, $e = null, qe = null;
 const _t = () => {
   const e = Fe(), { get: t } = Ie(), { getCamera: s } = Re(), {
-    visible: n,
-    color: r,
+    visible: o,
+    color: n,
     texture: i,
-    offset: o
-  } = N(e), c = () => {
-    if (console.debug("useGround init"), A)
-      return console.debug("ground already inited"), A;
-    const g = t(), y = new I.PlaneGeometry(100, 100), x = new I.Color(r.value || 16777215), v = new I.MeshStandardMaterial({
+    offset: r
+  } = O(e), c = () => {
+    if (console.debug("useGround init"), B)
+      return console.debug("ground already inited"), B;
+    const g = t(), y = new k.PlaneGeometry(100, 100), x = new k.Color(n.value || 16777215), b = new k.MeshStandardMaterial({
       color: x,
       // Default to white
-      side: I.DoubleSide,
+      side: k.DoubleSide,
       roughness: 0.4,
       metalness: 0.3,
       emissive: x,
       emissiveIntensity: 0.05
       // tweak 0.1–0.6
     });
-    return A = new I.Mesh(y, v), A.rotation.x = -Math.PI / 2, A.receiveShadow = !0, A.visible = n.value, g.add(A), Ue = j(
-      () => n.value,
+    return B = new k.Mesh(y, b), B.rotation.x = -Math.PI / 2, B.receiveShadow = !0, B.visible = o.value, g.add(B), Ue = G(
+      () => o.value,
       () => a()
-    ), $e = j(
-      () => r.value,
-      (k) => w(k)
-    ), qe = j(
+    ), $e = G(
+      () => n.value,
+      (D) => w(D)
+    ), qe = G(
       () => i.value,
-      (k) => p(k)
-    ), A;
+      (D) => p(D)
+    ), B;
   };
   function a() {
-    if (s().position.y < A.position.y) {
-      A.visible = !1;
+    if (s().position.y < B.position.y) {
+      B.visible = !1;
       return;
     }
-    A.visible = n.value;
+    B.visible = o.value;
   }
   function u(g, y = 1, x = 1) {
-    return new I.TextureLoader().load(g, (R) => {
-      R.wrapS = I.RepeatWrapping, R.wrapT = I.RepeatWrapping, R.repeat.set(y, x), R.needsUpdate = !0;
+    return new k.TextureLoader().load(g, (L) => {
+      L.wrapS = k.RepeatWrapping, L.wrapT = k.RepeatWrapping, L.repeat.set(y, x), L.needsUpdate = !0;
     });
   }
   const p = (g) => {
-    if (!A) throw new Error("Ground has not been initialized");
-    const y = Zs[g];
+    if (!B) throw new Error("Ground has not been initialized");
+    const y = Ys[g];
     if (!y)
-      A.material.map = null, A.material.normalMap = null, A.material.displacementMap = null, A.material.roughnessMap = null, A.material.aoMap = null, A.material.metalnessMap = null, A.material.needsUpdate = !0;
+      B.material.map = null, B.material.normalMap = null, B.material.displacementMap = null, B.material.roughnessMap = null, B.material.aoMap = null, B.material.metalnessMap = null, B.material.needsUpdate = !0;
     else {
-      const x = `https://static.figurosity.com/3d/textures/${g}/`, v = y.repeat;
-      A.material.map = u(
+      const x = `https://static.figurosity.com/3d/textures/${g}/`, b = y.repeat;
+      B.material.map = u(
         `${x}${y.color}`,
-        v,
-        v
-      ), A.material.normalMap = u(
+        b,
+        b
+      ), B.material.normalMap = u(
         `${x}${y.normal}`,
-        v,
-        v
-      ), A.material.displacementMap = u(
+        b,
+        b
+      ), B.material.displacementMap = u(
         `${x}${y.displacement}`,
-        v,
-        v
-      ), A.material.roughnessMap = u(
+        b,
+        b
+      ), B.material.roughnessMap = u(
         `${x}${y.roughness}`,
-        v,
-        v
-      ), A.material.aoMap = u(
+        b,
+        b
+      ), B.material.aoMap = u(
         `${x}${y.ao}`,
-        v,
-        v
-      ), y.metalness && (A.material.metalnessMap = u(
+        b,
+        b
+      ), y.metalness && (B.material.metalnessMap = u(
         `${x}${y.metalness}`,
-        v,
-        v
-      )), A.material.displacementScale = 0.1, A.material.displacementBias = -0.05, A.material.needsUpdate = !0;
+        b,
+        b
+      )), B.material.displacementScale = 0.1, B.material.displacementBias = -0.05, B.material.needsUpdate = !0;
     }
-    A.position.y = o.value, A.geometry.computeBoundingBox(), A.geometry.computeVertexNormals();
+    B.position.y = r.value, B.geometry.computeBoundingBox(), B.geometry.computeVertexNormals();
   }, P = () => {
-    if (!A) throw new Error("Ground has not been initialized");
-    return A;
+    if (!B) throw new Error("Ground has not been initialized");
+    return B;
   }, w = (g) => {
-    if (!A) throw new Error("Ground has not been initialized");
-    A.material.color.set(g);
+    if (!B) throw new Error("Ground has not been initialized");
+    B.material.color.set(g);
   };
   return { init: c, get: P, setColor: w, updateVisibility: a, dispose: () => {
     var y, x;
-    if (Ue == null || Ue(), $e == null || $e(), qe == null || qe(), Ue = null, $e = null, qe = null, !A) return;
+    if (Ue == null || Ue(), $e == null || $e(), qe == null || qe(), Ue = null, $e = null, qe = null, !B) return;
     const g = t();
-    g == null || g.remove(A), (y = A.geometry) == null || y.dispose(), Array.isArray(A.material) ? A.material.forEach((v) => v == null ? void 0 : v.dispose()) : (x = A.material) == null || x.dispose(), A = null;
+    g == null || g.remove(B), (y = B.geometry) == null || y.dispose(), Array.isArray(B.material) ? B.material.forEach((b) => b == null ? void 0 : b.dispose()) : (x = B.material) == null || x.dispose(), B = null;
   } };
-}, Ys = (e, t = 16711422) => {
-  const s = new Ts(0.1, 0.1, 0.1, 6, 0.01), n = 0.1, r = 0.05, i = new I.ConeGeometry(r, n, 32);
+}, Qs = (e, t = 16711422) => {
+  const s = new Ms(0.1, 0.1, 0.1, 6, 0.01), o = 0.1, n = 0.05, i = new k.ConeGeometry(n, o, 32);
   s.index || s.setIndex(
     Array.from(
       { length: s.attributes.position.count },
@@ -1196,157 +1196,157 @@ const _t = () => {
       { length: i.attributes.position.count },
       (u, p) => p
     )
-  ), i.rotateX(-Math.PI / 2), i.translate(0, 0, n / 2), Rt(s), Rt(i);
-  const o = ks([s, i]), c = new I.MeshBasicMaterial({
+  ), i.rotateX(-Math.PI / 2), i.translate(0, 0, o / 2), Rt(s), Rt(i);
+  const r = Ds([s, i]), c = new k.MeshBasicMaterial({
     color: t,
     transparent: !0,
     opacity: 0.8
-  }), a = new I.Mesh(o, c);
+  }), a = new k.Mesh(r, c);
   if (a.position.set(0, 0, 0), a.rotateX(Math.PI), e && e.target) {
-    const u = new I.Vector3();
+    const u = new k.Vector3();
     e.target.getWorldPosition(u), a.lookAt(u);
   }
   return a.position.copy(e.position), a;
 };
-let it = {}, ne = {}, q = {}, ie = {}, Te = null, ae = null, Me = [], Ae = /* @__PURE__ */ new Map();
+let it = {}, re = {}, H = {}, ce = {}, De = null, ue = null, Me = [], Be = /* @__PURE__ */ new Map();
 const ut = () => {
-  const e = M(), t = he(), s = fe();
-  pe(!1);
-  const { subjectLoaded: n, width: r, height: i, selected: o, basePoseId: c } = N(e), { debug: a, collection: u, advancedMode: p, move: P } = N(t), { get: w } = Ie(), m = t.property, g = () => {
-    if (ae)
-      return console.warn("lights camera already inited"), ae;
+  const e = T(), t = ge(), s = ae();
+  he(!1);
+  const { subjectLoaded: o, width: n, height: i, selected: r, basePoseId: c } = O(e), { debug: a, collection: u, advancedMode: p, move: P } = O(t), { get: w } = Ie(), m = t.property, g = () => {
+    if (ue)
+      return console.warn("lights camera already inited"), ue;
     const S = w();
-    return Te = v(), ae = k(), u.value.forEach((l) => {
-      const f = l === "key" ? ae : S, { group: T, light: D, visualization: E } = R(l, f);
-      q[l] = D, it[l] = T, ie[l] = E, q[l].castShadow = !0, q[l].angle = Math.PI / 4, q[l].penumbra = 0.5, q[l].shadow.camera.near = 0.5, q[l].shadow.camera.far = 12, q[l].shadow.focus = 0.9, q[l].shadow.mapSize.set(4096, 4096), q[l].shadow.bias = -2e-4, q[l].shadow.normalBias = 0.02, q[l].shadow.radius = 2, q[l].shadow.camera.updateProjectionMatrix();
-    }), G(), Y(), ae;
+    return De = b(), ue = D(), u.value.forEach((l) => {
+      const f = l === "key" ? ue : S, { group: M, light: I, visualization: E } = L(l, f);
+      H[l] = I, it[l] = M, ce[l] = E, H[l].castShadow = !0, H[l].angle = Math.PI / 4, H[l].penumbra = 0.5, H[l].shadow.camera.near = 0.5, H[l].shadow.camera.far = 12, H[l].shadow.focus = 0.9, H[l].shadow.mapSize.set(4096, 4096), H[l].shadow.bias = -2e-4, H[l].shadow.normalBias = 0.02, H[l].shadow.radius = 2, H[l].shadow.camera.updateProjectionMatrix();
+    }), j(), Y(), ue;
   }, y = () => {
-    if (!ae)
+    if (!ue)
       throw new Error("Light camera not initialized.");
-    return ae;
+    return ue;
   }, x = (S) => {
-    S && (Object.values(q).forEach((l) => l == null ? void 0 : l.color.set(S)), Object.values(ie).forEach((l) => {
+    S && (Object.values(H).forEach((l) => l == null ? void 0 : l.color.set(S)), Object.values(ce).forEach((l) => {
       var f;
       return (f = l == null ? void 0 : l.material) == null ? void 0 : f.color.set(S);
     }));
-  }, v = () => {
-    const S = w(), l = new I.AmbientLight(16777215, 0.2);
+  }, b = () => {
+    const S = w(), l = new k.AmbientLight(16777215, 0.2);
     return S.add(l), l;
-  }, k = () => {
-    const S = w(), l = new I.PerspectiveCamera(
+  }, D = () => {
+    const S = w(), l = new k.PerspectiveCamera(
       75,
-      r.value / i.value,
+      n.value / i.value,
       0.1,
       100
     );
     return l.position.set(0, 0, 1.5), S.add(l), l;
   };
-  function R(S, l = null) {
-    const f = w(), T = new I.Group(), D = new I.SpotLight(
+  function L(S, l = null) {
+    const f = w(), M = new k.Group(), I = new k.SpotLight(
       m(S, "color"),
       m(S, "intensity")
     );
-    D.position.set(0, 0, 0), $(), D.target.position.set(0, 1, 0), D.target.updateMatrixWorld(), f.add(D.target), T.add(D);
-    const E = Ys(
-      D,
+    I.position.set(0, 0, 0), N(), I.target.position.set(0, 1, 0), I.target.updateMatrixWorld(), f.add(I.target), M.add(I);
+    const E = Qs(
+      I,
       m(S, "visualizationColor")
-    ), O = t.isVisible(S);
-    return E.visible = O, T.add(E), l.add(T), { group: T, light: D, visualization: E };
+    ), U = t.isVisible(S);
+    return E.visible = U, M.add(E), l.add(M), { group: M, light: I, visualization: E };
   }
   const F = () => {
-    $(), K(), b();
-  }, $ = () => {
+    N(), K(), v();
+  }, N = () => {
     if (!t.lights[c.value]) return;
-    const l = t.seeds[o.value], f = t.ambientScale, T = t.userScale;
-    if (Te && (l != null && l.ambient) && (Te.intensity = l.ambient.intensity * f), l != null && l.env) {
-      const D = w();
-      D && (D.environmentIntensity = l.env.intensity * f);
+    const l = t.seeds[r.value], f = t.ambientScale, M = t.userScale;
+    if (De && (l != null && l.ambient) && (De.intensity = l.ambient.intensity * f), l != null && l.env) {
+      const I = w();
+      I && (I.environmentIntensity = l.env.intensity * f);
     }
-    u.value.forEach((D) => {
-      const E = q[D];
+    u.value.forEach((I) => {
+      const E = H[I];
       if (!E) return;
-      const O = m(D, "color"), ge = m(D, "visible"), J = m(D, "shadow") || !1;
-      if (O && E.color.set(O), E.visible = ge, l != null && l[D] && (E.intensity = l[D].intensity * T), E.castShadow = J, J) {
-        const re = m(D, "shadowSettings", {});
+      const U = m(I, "color"), be = m(I, "visible"), J = m(I, "shadow") || !1;
+      if (U && E.color.set(U), E.visible = be, l != null && l[I] && (E.intensity = l[I].intensity * M), E.castShadow = J, J) {
+        const le = m(I, "shadowSettings", {});
         E.shadow.mapSize.set(
-          re.width || 1024,
-          re.height || 1024
-        ), E.shadow.camera.near = re.near || 0.5, E.shadow.camera.far = re.far || 50, E.shadow.needsUpdate = !0;
+          le.width || 1024,
+          le.height || 1024
+        ), E.shadow.camera.near = le.near || 0.5, E.shadow.camera.far = le.far || 50, E.shadow.needsUpdate = !0;
       }
     });
   }, K = () => {
     t.lights[c.value] && u.value.forEach((l) => {
-      if (!ie[l]) return console.warn(`${l} does not exist`);
+      if (!ce[l]) return console.warn(`${l} does not exist`);
       const f = t.isVisible(l);
-      ie[l].visible = f, ie[l].material.color.set(m(l, "color"));
+      ce[l].visible = f, ce[l].material.color.set(m(l, "color"));
     });
-  }, b = () => {
+  }, v = () => {
     t.lights[c.value] && u.value.forEach((l) => {
       const f = m(l, "debug") || a.value;
-      !ne[l] && f && (ne[l] = h(l, q[l]), q[l].add(ne[l])), ne[l] && !f && (ne[l] = B(ne[l]));
+      !re[l] && f && (re[l] = h(l, H[l]), H[l].add(re[l])), re[l] && !f && (re[l] = A(re[l]));
     });
   }, h = (S, l) => {
-    const f = w(), T = new I.SpotLightHelper(
+    const f = w(), M = new k.SpotLightHelper(
       l,
       m(S, "visualizationColor")
     );
-    return f.add(T), T;
-  }, B = (S) => {
+    return f.add(M), M;
+  }, A = (S) => {
     const l = w();
     if (!(!l || !S))
       return l.remove(S), S.dispose(), S = null, S;
-  }, G = () => {
+  }, j = () => {
     const S = y();
     if (!s.bounds) return;
-    const f = t.target, T = new I.Vector3(f.x, f.y, f.z), D = new I.Vector3().subVectors(T, S.position).normalize(), E = new I.Vector3(
-      D.x,
+    const f = t.target, M = new k.Vector3(f.x, f.y, f.z), I = new k.Vector3().subVectors(M, S.position).normalize(), E = new k.Vector3(
+      I.x,
       0,
-      D.z
-    ).normalize(), O = new I.Vector3(
+      I.z
+    ).normalize(), U = new k.Vector3(
       -E.z,
       0,
       E.x
-    ), J = 2 * S.position.distanceTo(T) / Math.sqrt(3), re = 1, _e = T.clone().add(O.clone().multiplyScalar(-J / re)).add(D.clone().multiplyScalar(Math.sqrt(3) * J / 2)), as = T.clone().add(O.clone().multiplyScalar(J / re)).add(D.clone().multiplyScalar(Math.sqrt(3) * J / 2));
-    it.fill.position.copy(_e), it.back.position.copy(as), u.value.forEach((ht) => {
+    ), J = 2 * S.position.distanceTo(M) / Math.sqrt(3), le = 1, _e = M.clone().add(U.clone().multiplyScalar(-J / le)).add(I.clone().multiplyScalar(Math.sqrt(3) * J / 2)), ls = M.clone().add(U.clone().multiplyScalar(J / le)).add(I.clone().multiplyScalar(Math.sqrt(3) * J / 2));
+    it.fill.position.copy(_e), it.back.position.copy(ls), u.value.forEach((ht) => {
       var Pt, st, Lt;
-      const gt = q[ht];
-      gt.shadow.needsUpdate = !0, gt.target.position.copy(T), gt.target.updateMatrixWorld(), (Pt = ie[ht]) == null || Pt.lookAt(T), (Lt = (st = ne[ht]) == null ? void 0 : st.update) == null || Lt.call(st);
+      const gt = H[ht];
+      gt.shadow.needsUpdate = !0, gt.target.position.copy(M), gt.target.updateMatrixWorld(), (Pt = ce[ht]) == null || Pt.lookAt(M), (Lt = (st = re[ht]) == null ? void 0 : st.update) == null || Lt.call(st);
     });
   }, z = (S) => {
     const l = `watcher-${S}`;
-    if (Ae.has(l)) return;
-    const f = j(
+    if (Be.has(l)) return;
+    const f = G(
       () => [t.lights[S], t.options[S]],
       F,
       { deep: !0 }
     );
-    Ae.set(l, f);
-  }, U = (S) => {
-    const l = `watcher-${S}`, f = Ae.get(l);
-    f && (f(), Ae.delete(l));
+    Be.set(l, f);
+  }, $ = (S) => {
+    const l = `watcher-${S}`, f = Be.get(l);
+    f && (f(), Be.delete(l));
   }, Y = () => {
     Me.push(
-      j(
-        () => [p.value, o.value, P.value],
+      G(
+        () => [p.value, r.value, P.value],
         () => F()
       )
     ), Me.push(
-      j(
+      G(
         () => [t.ambientScale, t.userScale],
         () => F()
       )
     ), Me.push(
-      j(
-        () => n.value,
+      G(
+        () => o.value,
         (S) => {
-          S === !0 && G();
+          S === !0 && j();
         }
       )
     ), Me.push(
-      j(
+      G(
         () => c.value,
         (S, l) => {
-          l && U(l), S != null && (z(S), ls(F));
+          l && $(l), S != null && (z(S), cs(F));
         },
         { immediate: !0 }
       )
@@ -1354,20 +1354,20 @@ const ut = () => {
   };
   return {
     init: g,
-    updatePosition: G,
+    updatePosition: j,
     getCamera: y,
     dispose: () => {
       const S = w();
-      S && (Me.forEach((l) => l()), Me = [], Ae.forEach((l) => l()), Ae.clear(), Object.values(q).forEach((l) => S.remove(l)), Object.values(ne).forEach((l) => S.remove(l)), Object.values(ie).forEach((l) => {
-        var f, T, D, E;
-        S.remove(l), (T = (f = l.geometry) == null ? void 0 : f.dispose) == null || T.call(f), (E = (D = l.material) == null ? void 0 : D.dispose) == null || E.call(D);
-      }), Te && S.remove(Te), it = {}, ne = {}, q = {}, ie = {}, Te = null, ae = null);
+      S && (Me.forEach((l) => l()), Me = [], Be.forEach((l) => l()), Be.clear(), Object.values(H).forEach((l) => S.remove(l)), Object.values(re).forEach((l) => S.remove(l)), Object.values(ce).forEach((l) => {
+        var f, M, I, E;
+        S.remove(l), (M = (f = l.geometry) == null ? void 0 : f.dispose) == null || M.call(f), (E = (I = l.material) == null ? void 0 : I.dispose) == null || E.call(I);
+      }), De && S.remove(De), it = {}, re = {}, H = {}, ce = {}, De = null, ue = null);
     },
     applyColorPreview: x,
     applyFromStore: F
   };
-}, Qs = 0.4, eo = 0.25, Bt = () => {
-  const e = he(), t = ct(), { getCamera: s } = ut();
+}, eo = 0.4, to = 0.25, At = () => {
+  const e = ge(), t = ct(), { getCamera: s } = ut();
   return {
     activate: () => {
       t.setMode({
@@ -1385,45 +1385,45 @@ const ut = () => {
         }
       });
     },
-    frameToBounds: (i, o = 1.75) => {
+    frameToBounds: (i, r = 1.75) => {
       if (!i) return;
-      const c = t.get(), a = s(), u = new I.Vector3(
+      const c = t.get(), a = s(), u = new k.Vector3(
         i.center.x,
-        i.center.y + i.size.y * Qs,
+        i.center.y + i.size.y * eo,
         i.center.z
-      ), p = Math.max(i.size.x, i.size.y, i.size.z), P = I.MathUtils.degToRad(a.fov), w = p / 2 / Math.tan(P / 2) * o;
-      c.target.copy(u), a.position.set(u.x, u.y + i.size.y * eo, u.z + w), a.near = w / 100, a.far = w * 100, a.updateProjectionMatrix(), c.update();
+      ), p = Math.max(i.size.x, i.size.y, i.size.z), P = k.MathUtils.degToRad(a.fov), w = p / 2 / Math.tan(P / 2) * r;
+      c.target.copy(u), a.position.set(u.x, u.y + i.size.y * to, u.z + w), a.near = w / 100, a.far = w * 100, a.updateProjectionMatrix(), c.update();
     },
     syncToStore: t.syncToStore,
     applyFromStore: t.applyFromStore
   };
 };
-let le = null;
-const to = () => {
+let de = null;
+const so = () => {
   const e = () => {
-    const s = M();
-    return le = new I.LoadingManager(), le.onStart = function(n) {
-      s.loading.active = !0, s.loading.url = n, s.loading.percent = 0;
-    }, le.onError = () => {
+    const s = T();
+    return de = new k.LoadingManager(), de.onStart = function(o) {
+      s.loading.active = !0, s.loading.url = o, s.loading.percent = 0;
+    }, de.onError = () => {
       s.loading.active = !1, s.loading.url = null;
-    }, le.onLoad = function() {
+    }, de.onLoad = function() {
       s.loading.active = !1, s.loading.url = null, s.loading.percent = 100;
-    }, le.onProgress = function(n, r, i) {
-      s.loading.percent = Math.round(r / i * 100);
-    }, le;
+    }, de.onProgress = function(o, n, i) {
+      s.loading.percent = Math.round(n / i * 100);
+    }, de;
   };
-  return { get: () => (le || e(), le) };
-}, so = /hair|lash|brow|eye|cornea|sclera|iris|pupil|tear|teeth|tongue|mouth|gum|lip|nail/i, oo = (e, t, s = {}) => {
-  const { removeSpecular: n = !1, removeShininess: r = !1 } = s;
+  return { get: () => (de || e(), de) };
+}, oo = /hair|lash|brow|eye|cornea|sclera|iris|pupil|tear|teeth|tongue|mouth|gum|lip|nail/i, no = (e, t, s = {}) => {
+  const { removeSpecular: o = !1, removeShininess: n = !1 } = s;
   e && e.traverse((i) => {
     if (!i.isMesh) return;
     (Array.isArray(i.material) ? i.material : [i.material]).forEach((c) => {
       if (!c) return;
       const a = `${i.name} ${c.name || ""}`;
-      so.test(a) || (c.color && c.color.set(t), n && c.specular && c.specular.set(0), r && typeof c.shininess == "number" && (c.shininess = 0), c.needsUpdate = !0);
+      oo.test(a) || (c.color && c.color.set(t), o && c.specular && c.specular.set(0), n && typeof c.shininess == "number" && (c.shininess = 0), c.needsUpdate = !0);
     });
   });
-}, no = 1, ro = "https://www.gstatic.com/draco/v1/decoders/", dt = {
+}, ro = 1, io = "https://www.gstatic.com/draco/v1/decoders/", dt = {
   roughnessFloor: 0.85,
   metalness: null,
   envMapIntensity: null,
@@ -1432,7 +1432,7 @@ const to = () => {
   ambientIntensity: 0.2,
   spotIntensity: 1,
   envIntensity: 1
-}, io = {
+}, ao = {
   nude: { ...dt },
   // Smooth ships with no texture maps — pure-white sculpting reference.
   // All "detail" has to come from form-revealing shading on the
@@ -1460,194 +1460,194 @@ const to = () => {
     envIntensity: 1
   }
 };
-let Se = null, ce = null, Be, Gt = 0, te = dt;
-const jt = () => {
-  const { get: e } = to(), t = fe(), s = M(), n = Fe(), r = Mt(), { selected: i } = N(s), { url: o } = N(t), { subjectHex: c } = N(r), { offset: a } = N(n), { getCamera: u } = Re(), { get: p } = Ie(), { render: P } = Xe(), w = (v) => {
-    const { setExposure: k } = Xe(), R = he(), F = ++Gt;
+let we = null, pe = null, Ae, jt = 0, se = dt;
+const Gt = () => {
+  const { get: e } = so(), t = ae(), s = T(), o = Fe(), n = Mt(), { selected: i } = O(s), { url: r } = O(t), { subjectHex: c } = O(n), { offset: a } = O(o), { getCamera: u } = Re(), { get: p } = Ie(), { render: P } = Xe(), w = (b) => {
+    const { setExposure: D } = Xe(), L = ge(), F = ++jt;
     s.subjectLoaded = !1, m();
-    const $ = e();
-    ce || (ce = new As($), ce.setDecoderPath(ro));
-    const K = new Ms($);
-    K.setDRACOLoader(ce), K.setWithCredentials(!0), K.manager.setURLModifier((b) => b), K.load(v, (b) => {
+    const N = e();
+    pe || (pe = new As(N), pe.setDecoderPath(io));
+    const K = new Bs(N);
+    K.setDRACOLoader(pe), K.setWithCredentials(!0), K.manager.setURLModifier((v) => v), K.load(b, (v) => {
       var S;
-      const h = b == null ? void 0 : b.scene;
-      if (F !== Gt) {
+      const h = v == null ? void 0 : v.scene;
+      if (F !== jt) {
         h == null || h.traverse((l) => {
-          var T;
+          var M;
           if (!l.isMesh) return;
-          (T = l.geometry) == null || T.dispose();
+          (M = l.geometry) == null || M.dispose();
           const f = l.material;
-          Array.isArray(f) ? f.forEach((D) => D == null ? void 0 : D.dispose()) : f == null || f.dispose();
+          Array.isArray(f) ? f.forEach((I) => I == null ? void 0 : I.dispose()) : f == null || f.dispose();
         });
         return;
       }
       if (!h)
         return;
-      Se = h, te = io[(S = t.model) == null ? void 0 : S.slug] || dt, k(te.exposure), R.seedFromRecipe(s.selected, te);
-      const B = p(), G = u(), z = new I.Group();
+      we = h, se = ao[(S = t.model) == null ? void 0 : S.slug] || dt, D(se.exposure), L.seedFromRecipe(s.selected, se);
+      const A = p(), j = u(), z = new k.Group();
       z.name = "GLBSubject", z.add(h);
-      const U = /brow|lash/i;
+      const $ = /brow|lash/i;
       h.traverse((l) => {
         if (!l.isMesh) return;
         l.castShadow = !0, l.receiveShadow = !0;
-        const f = Array.isArray(l.material) ? l.material : [l.material], T = `${l.name} ${f.map((E) => E == null ? void 0 : E.name).join(" ")}`, D = U.test(T);
+        const f = Array.isArray(l.material) ? l.material : [l.material], M = `${l.name} ${f.map((E) => E == null ? void 0 : E.name).join(" ")}`, I = $.test(M);
         f.forEach((E) => {
-          E && (te.roughnessFloor !== null && typeof E.roughness == "number" && (E.roughness = Math.max(
+          E && (se.roughnessFloor !== null && typeof E.roughness == "number" && (E.roughness = Math.max(
             E.roughness,
-            te.roughnessFloor
-          )), te.metalness !== null && typeof E.metalness == "number" && (E.metalness = te.metalness), te.envMapIntensity !== null && typeof E.envMapIntensity == "number" && (E.envMapIntensity = te.envMapIntensity), E.transparent && D && (E.alphaTest = 0.2, E.depthWrite = !0), E.needsUpdate = !0);
+            se.roughnessFloor
+          )), se.metalness !== null && typeof E.metalness == "number" && (E.metalness = se.metalness), se.envMapIntensity !== null && typeof E.envMapIntensity == "number" && (E.envMapIntensity = se.envMapIntensity), E.transparent && I && (E.alphaTest = 0.2, E.depthWrite = !0), E.needsUpdate = !0);
         });
-      }), te.applyTint && oo(h, c.value), h.scale.setScalar(no), h.updateMatrixWorld(!0);
+      }), se.applyTint && no(h, c.value), h.scale.setScalar(ro), h.updateMatrixWorld(!0);
       const Y = Vt(h);
-      z.position.y -= Y.bottom, z.updateMatrixWorld(!0), B.add(z), Se = z;
-      const X = Vt(z);
-      t.setBounds(X), P(B, G), s.subjectLoaded = !0;
+      z.position.y -= Y.bottom, z.updateMatrixWorld(!0), A.add(z), we = z;
+      const Z = Vt(z);
+      t.setBounds(Z), P(A, j), s.subjectLoaded = !0;
     });
   }, m = () => {
-    if (!Se) return;
-    p().remove(Se), Se.traverse((k) => {
+    if (!we) return;
+    p().remove(we), we.traverse((D) => {
       var F;
-      if (!k.isMesh) return;
-      (F = k.geometry) == null || F.dispose();
-      const R = k.material;
-      Array.isArray(R) ? R.forEach(($) => $ == null ? void 0 : $.dispose()) : R == null || R.dispose();
-    }), Se = null, s.subjectLoaded = !1;
-  }, g = () => Se, y = () => {
-    if (Be) {
+      if (!D.isMesh) return;
+      (F = D.geometry) == null || F.dispose();
+      const L = D.material;
+      Array.isArray(L) ? L.forEach((N) => N == null ? void 0 : N.dispose()) : L == null || L.dispose();
+    }), we = null, s.subjectLoaded = !1;
+  }, g = () => we, y = () => {
+    if (Ae) {
       console.warn("useGLB.init() called more than once");
       return;
     }
-    Be = j(
+    Ae = G(
       () => i.value,
-      (v, k) => {
-        !v || v === k || o.value && w(o.value);
+      (b, D) => {
+        !b || b === D || r.value && w(r.value);
       },
       { immediate: !0 }
     );
   }, x = () => {
-    Be == null || Be(), Be = null, m(), ce == null || ce.dispose(), ce = null;
+    Ae == null || Ae(), Ae = null, m(), pe == null || pe.dispose(), pe = null;
   };
   return Ut(() => {
     x();
   }), { init: y, get: g, dispose: x };
-}, ao = (e, t, s = 500) => {
-  const n = e.material;
-  n.transparent = !0;
-  const r = n.opacity, i = performance.now(), o = (c) => {
-    const a = c - i, u = Math.min(a / s, 1), p = r + (t - r) * u;
-    n.opacity = p, u < 1 && requestAnimationFrame(o);
+}, lo = (e, t, s = 500) => {
+  const o = e.material;
+  o.transparent = !0;
+  const n = o.opacity, i = performance.now(), r = (c) => {
+    const a = c - i, u = Math.min(a / s, 1), p = n + (t - n) * u;
+    o.opacity = p, u < 1 && requestAnimationFrame(r);
   };
-  requestAnimationFrame(o);
-}, lo = 34815;
+  requestAnimationFrame(r);
+}, co = 34815;
 let _ = null, He = null, Je = null, Ke = null;
 const Ot = () => {
-  const e = ke(), t = Fe(), s = fe(), { show: n, divisions: r, size: i, opacity: o } = N(e), { offset: c } = N(t), { bounds: a } = N(s), { get: u } = Ie(), p = () => {
-    const b = k(lo), h = b, { positions: B, colors: G } = P({
+  const e = ve(), t = Fe(), s = ae(), { show: o, divisions: n, size: i, opacity: r } = O(e), { offset: c } = O(t), { bounds: a } = O(s), { get: u } = Ie(), p = () => {
+    const v = D(co), h = v, { positions: A, colors: j } = P({
       size: i.value,
-      divisions: r.value,
-      color: b,
+      divisions: n.value,
+      color: v,
       centerColor: h
-    }), z = w(B, G), U = m(o.value);
-    return new I.LineSegments(z, U);
-  }, P = ({ size: b, divisions: h, color: B, centerColor: G }) => {
-    const z = b / 2, U = b / h, Y = [], X = [], S = Math.floor(h / 2), l = (f, T, D, E) => {
-      Y.push(f, T, D);
-      const O = E ? G : B;
-      X.push(O.r, O.g, O.b);
+    }), z = w(A, j), $ = m(r.value);
+    return new k.LineSegments(z, $);
+  }, P = ({ size: v, divisions: h, color: A, centerColor: j }) => {
+    const z = v / 2, $ = v / h, Y = [], Z = [], S = Math.floor(h / 2), l = (f, M, I, E) => {
+      Y.push(f, M, I);
+      const U = E ? j : A;
+      Z.push(U.r, U.g, U.b);
     };
     for (let f = 0; f <= h; f++) {
-      const T = -z + f * U, D = f === S;
+      const M = -z + f * $, I = f === S;
       for (let E = 0; E <= h; E++) {
-        const O = -z + E * U, J = D || E === S;
-        l(-z, T, O, J), l(+z, T, O, J);
+        const U = -z + E * $, J = I || E === S;
+        l(-z, M, U, J), l(+z, M, U, J);
       }
     }
     for (let f = 0; f <= h; f++) {
-      const T = -z + f * U, D = f === S;
+      const M = -z + f * $, I = f === S;
       for (let E = 0; E <= h; E++) {
-        const O = -z + E * U, J = D || E === S;
-        l(T, -z, O, J), l(T, +z, O, J);
+        const U = -z + E * $, J = I || E === S;
+        l(M, -z, U, J), l(M, +z, U, J);
       }
     }
     for (let f = 0; f <= h; f++) {
-      const T = -z + f * U, D = f === S;
+      const M = -z + f * $, I = f === S;
       for (let E = 0; E <= h; E++) {
-        const O = -z + E * U, J = D || E === S;
-        l(T, O, -z, J), l(T, O, +z, J);
+        const U = -z + E * $, J = I || E === S;
+        l(M, U, -z, J), l(M, U, +z, J);
       }
     }
-    return { positions: Y, colors: X };
-  }, w = (b, h) => {
-    const B = new I.BufferGeometry();
-    return B.setAttribute(
+    return { positions: Y, colors: Z };
+  }, w = (v, h) => {
+    const A = new k.BufferGeometry();
+    return A.setAttribute(
       "position",
-      new I.Float32BufferAttribute(b, 3)
-    ), B.setAttribute("color", new I.Float32BufferAttribute(h, 3)), B;
-  }, m = (b) => new I.LineBasicMaterial({
+      new k.Float32BufferAttribute(v, 3)
+    ), A.setAttribute("color", new k.Float32BufferAttribute(h, 3)), A;
+  }, m = (v) => new k.LineBasicMaterial({
     transparent: !0,
-    opacity: b,
+    opacity: v,
     depthWrite: !1,
-    blending: I.NormalBlending,
+    blending: k.NormalBlending,
     vertexColors: !0
   }), g = () => {
-    _ && v(n.value);
+    _ && b(o.value);
   }, y = () => {
-    const b = u();
-    _ = p(), $(), b.add(_), x(0);
-  }, x = (b) => {
-    _ && (_.material.transparent = !0, b = n.value ? b : 0, _.material.opacity = b);
-  }, v = (b) => {
-    const h = b ? o.value : 0;
-    ao(_, h, 500);
-  }, k = (b) => ({
-    r: (b >> 16 & 255) / 255,
-    g: (b >> 8 & 255) / 255,
-    b: (b & 255) / 255
-  }), R = (b, h) => {
+    const v = u();
+    _ = p(), N(), v.add(_), x(0);
+  }, x = (v) => {
+    _ && (_.material.transparent = !0, v = o.value ? v : 0, _.material.opacity = v);
+  }, b = (v) => {
+    const h = v ? r.value : 0;
+    lo(_, h, 500);
+  }, D = (v) => ({
+    r: (v >> 16 & 255) / 255,
+    g: (v >> 8 & 255) / 255,
+    b: (v & 255) / 255
+  }), L = (v, h) => {
     if (!_) return;
-    const B = k(b), G = k(h), z = _.geometry.attributes.color, U = _.geometry.attributes.position, Y = U.count, X = i.value / 2, S = i.value / r.value, l = Math.floor(r.value / 2);
+    const A = D(v), j = D(h), z = _.geometry.attributes.color, $ = _.geometry.attributes.position, Y = $.count, Z = i.value / 2, S = i.value / n.value, l = Math.floor(n.value / 2);
     for (let f = 0; f < Y; f++) {
-      const T = U.getX(f), D = U.getY(f), E = U.getZ(f), O = Math.round((T + X) / S), ge = Math.round((D + X) / S), J = Math.round((E + X) / S), _e = O === l || ge === l || J === l ? B : G;
+      const M = $.getX(f), I = $.getY(f), E = $.getZ(f), U = Math.round((M + Z) / S), be = Math.round((I + Z) / S), J = Math.round((E + Z) / S), _e = U === l || be === l || J === l ? A : j;
       z.setXYZ(f, _e.r, _e.g, _e.b);
     }
     z.needsUpdate = !0;
   }, F = () => {
-    const b = u();
-    _ && (b.remove(_), _.geometry.dispose(), _.material.dispose(), _ = null), _ = p(), $(), b.add(_);
-  }, $ = () => {
+    const v = u();
+    _ && (v.remove(_), _.geometry.dispose(), _.material.dispose(), _ = null), _ = p(), N(), v.add(_);
+  }, N = () => {
     var h;
-    const b = ((h = a.value) == null ? void 0 : h.bottom) || 0;
-    _.position.set(0, b + i.value / 2 + 7e-3, 0);
+    const v = ((h = a.value) == null ? void 0 : h.bottom) || 0;
+    _.position.set(0, v + i.value / 2 + 7e-3, 0);
   };
-  return He = j(
-    () => [i.value, r.value],
-    ([b, h], [B, G]) => {
-      b === B && h === G || (F(), g());
+  return He = G(
+    () => [i.value, n.value],
+    ([v, h], [A, j]) => {
+      v === A && h === j || (F(), g());
     },
     { flush: "post" }
-  ), Je = j(
-    () => n.value,
+  ), Je = G(
+    () => o.value,
     () => {
       g();
     },
     { flush: "post" }
-  ), Ke = j(
-    () => o.value,
-    (b) => {
-      x(b);
+  ), Ke = G(
+    () => r.value,
+    (v) => {
+      x(v);
     },
     { flush: "post" }
   ), {
     init: y,
-    showHideGrid: v,
-    updateGridColors: R,
+    showHideGrid: b,
+    updateGridColors: L,
     dispose: () => {
-      var h, B;
-      const b = u();
-      He == null || He(), Je == null || Je(), Ke == null || Ke(), He = null, Je = null, Ke = null, _ && (b.remove(_), (h = _.geometry) == null || h.dispose(), Array.isArray(_.material) ? _.material.forEach((G) => G == null ? void 0 : G.dispose()) : (B = _.material) == null || B.dispose(), _ = null);
+      var h, A;
+      const v = u();
+      He == null || He(), Je == null || Je(), Ke == null || Ke(), He = null, Je = null, Ke = null, _ && (v.remove(_), (h = _.geometry) == null || h.dispose(), Array.isArray(_.material) ? _.material.forEach((j) => j == null ? void 0 : j.dispose()) : (A = _.material) == null || A.dispose(), _ = null);
     }
   };
-}, co = { class: "three-dimension-tool" }, uo = ["data-id"], po = /* @__PURE__ */ Object.assign({
+}, uo = { class: "three-dimension-tool" }, po = ["data-id"], mo = /* @__PURE__ */ Object.assign({
   name: "ThreeDimensionTool",
   slug: "three-dimension-tool",
   inheritAttrs: !1
@@ -1659,94 +1659,94 @@ const Ot = () => {
   setup(e) {
     const t = e;
     let s = null;
-    const n = C(() => Number(t.id)), r = M(), i = pt(), o = he(), c = fe(), { move: a } = N(o), { isFrozen: u } = N(r), p = pe(null), P = pe(!1);
+    const o = C(() => Number(t.id)), n = T(), i = pt(), r = ge(), c = ae(), { move: a } = O(r), { isFrozen: u } = O(n), p = he(null), P = he(!1);
     let w, m, g;
-    const y = ct(), x = At(), v = Bt(), { init: k, setEnvironment: R } = Ie(), { init: F } = Xe(), { init: $ } = Re(), { init: K, updateVisibility: b } = _t(), { init: h, updatePosition: B } = ut(), { init: G } = jt(), { init: z } = Ot(), U = () => {
+    const y = ct(), x = Bt(), b = At(), { init: D, setEnvironment: L } = Ie(), { init: F } = Xe(), { init: N } = Re(), { init: K, updateVisibility: v } = _t(), { init: h, updatePosition: A } = ut(), { init: j } = Gt(), { init: z } = Ot(), $ = () => {
       if (!p.value || P.value) {
         console.warn("Canvas element not found");
         return;
       }
-      P.value = !0, g = k(), m = F(p.value), R(m), G(), w = $(), h(), z(), K(), y.init(m), Y();
+      P.value = !0, g = D(), m = F(p.value), L(m), j(), w = N(), h(), z(), K(), y.init(m), Y();
     }, Y = () => {
-      P.value && (a.value !== s && (s = a.value, a.value ? v.activate() : x.activate()), y.update(), a.value ? (B(), v.syncToStore()) : x.syncToStore(), b(), m.render(g, w), requestAnimationFrame(Y));
-    }, X = () => {
+      P.value && (a.value !== s && (s = a.value, a.value ? b.activate() : x.activate()), y.update(), a.value ? (A(), b.syncToStore()) : x.syncToStore(), v(), m.render(g, w), requestAnimationFrame(Y));
+    }, Z = () => {
       if (p.value) {
         const l = window.innerWidth, f = window.innerHeight;
-        r.$patch({ width: l, height: f }), p.value.style.height = f + "px";
+        n.$patch({ width: l, height: f }), p.value.style.height = f + "px";
       }
     }, S = () => {
-      u.value && r.pokeFreeze();
+      u.value && n.pokeFreeze();
     };
-    return j(u, (l) => {
-      var T;
-      const f = (T = y.get) == null ? void 0 : T.call(y);
+    return G(u, (l) => {
+      var M;
+      const f = (M = y.get) == null ? void 0 : M.call(y);
       f && (f.enabled = !l);
-    }), j(
-      () => [i.applyRevision, o.applyRevision],
+    }), G(
+      () => [i.applyRevision, r.applyRevision],
       () => {
-        P.value && (v.activate(), B(), x.activate());
+        P.value && (b.activate(), A(), x.activate());
       }
     ), $t(() => {
       var l;
-      console.log("onMounted", p.value), U(), window.addEventListener("resize", X), X(), (l = p.value) == null || l.addEventListener("pointerdown", S, !0);
-    }), j(
+      console.log("onMounted", p.value), $(), window.addEventListener("resize", Z), Z(), (l = p.value) == null || l.addEventListener("pointerdown", S, !0);
+    }), G(
       () => c.bounds,
       (l) => {
-        l && (v.activate(), o.hasRig || (v.frameToBounds(l), v.syncToStore(), o.markFramed()), x.activate(), i.hasRig || (x.frameToBounds(l), x.syncToStore(), i.markFramed()));
+        l && (b.activate(), r.hasRig || (b.frameToBounds(l), b.syncToStore(), r.markFramed()), x.activate(), i.hasRig || (x.frameToBounds(l), x.syncToStore(), i.markFramed()));
       }
-    ), j(
-      () => r.subjectLoaded,
+    ), G(
+      () => n.subjectLoaded,
       (l) => {
         if (!l) return;
         const f = c.bounds;
         if (!f) return;
         i.hasRig || (y.frameToBounds(f), i.markFramed());
-        const T = y.get();
-        T.update(), T.saveState();
+        const M = y.get();
+        M.update(), M.saveState();
       }
     ), Ut(() => {
       var l;
-      console.debug("ThreeDimensionTool unMounted"), window.removeEventListener("resize", this), (l = p.value) == null || l.removeEventListener("pointerdown", S, !0), P.value = !1, jt().dispose(), Ot().dispose(), _t().dispose(), ut().dispose(), ct().dispose(), Re().dispose(), Ie().dispose(), Xe().dispose();
-    }), (l, f) => (at(), cs("div", co, [
+      console.debug("ThreeDimensionTool unMounted"), window.removeEventListener("resize", this), (l = p.value) == null || l.removeEventListener("pointerdown", S, !0), P.value = !1, Gt().dispose(), Ot().dispose(), _t().dispose(), ut().dispose(), ct().dispose(), Re().dispose(), Ie().dispose(), Xe().dispose();
+    }), (l, f) => (at(), us("div", uo, [
       wt("", !0),
-      us("div", {
+      ds("div", {
         class: "tres",
         ref_key: "tres",
         ref: p,
-        "data-id": n.value
-      }, null, 8, uo)
+        "data-id": o.value
+      }, null, 8, po)
     ]));
   }
-}), Nt = /* @__PURE__ */ Object.assign({ "../i18n/en-US/index.js": () => import("./index-CwHAnjEe.js") }), H = (e = "../i18n") => {
-  const t = bs(), s = pe({}), n = C(() => t.lang.isoName || "en-US"), r = async () => {
-    const i = `${e}/${n.value}/index.js`;
+}), Nt = /* @__PURE__ */ Object.assign({ "../i18n/en-US/index.js": () => import("./index-CwHAnjEe.js") }), q = (e = "../i18n") => {
+  const t = ys(), s = he({}), o = C(() => t.lang.isoName || "en-US"), n = async () => {
+    const i = `${e}/${o.value}/index.js`;
     if (Nt[i])
       try {
-        const o = await Nt[i]();
-        o.default && Object.assign(s.value, o.default);
-      } catch (o) {
-        console.error(`Error loading i18n for ${n.value}`, o);
+        const r = await Nt[i]();
+        r.default && Object.assign(s.value, r.default);
+      } catch (r) {
+        console.error(`Error loading i18n for ${o.value}`, r);
       }
     else
       console.error(`Module not found: ${i}`);
   };
-  return j(
-    () => n.value,
+  return G(
+    () => o.value,
     () => {
-      r();
+      n();
     },
     { immediate: !0 }
-  ), ds(() => {
-    r();
+  ), ps(() => {
+    n();
   }), { lang: s };
-}, Ee = 26, Z = ({ tab: e = oe, store: t, options: s = [] }) => {
-  const n = ws(), r = M(n), i = C({
-    get: () => r.isExpanded(s),
+}, ke = 26, X = ({ tab: e = ne, store: t, options: s = [] }) => {
+  const o = Cs(), n = T(o), i = C({
+    get: () => n.isExpanded(s),
     set: (a) => {
-      a && r.setActive(e);
+      a && n.setActive(e);
     }
-  }), o = C(() => t && t.changed);
-  return { click: () => r.setActive(e), expanded: i, selected: o };
+  }), r = C(() => t && t.changed);
+  return { click: () => n.setActive(e), expanded: i, selected: r };
 }, zt = V({
   name: "ToolResetButton",
   props: {
@@ -1755,45 +1755,45 @@ const Ot = () => {
   },
   emits: ["click"],
   setup(e, { slots: t, emit: s }) {
-    function n() {
+    function o() {
       s("click");
     }
-    function r() {
+    function n() {
       const i = {
         label: e.label,
         class: "full-width",
         flat: !0,
-        onClick: n,
+        onClick: o,
         disable: e.disable
       };
       return d("div", { class: "tool-reset-button q-pa-md" }, d(qt, i));
     }
-    return () => r();
+    return () => n();
   }
 }), ft = V({
   name: "FrozenOverlay",
   setup() {
-    const e = M(), { isFrozen: t } = N(e);
+    const e = T(), { isFrozen: t } = O(e);
     function s() {
-      return ps(d("div", {
+      return ms(d("div", {
         class: "frozen-overlay",
         onClick: () => e.pokeFreeze()
-      }, []), [[ms, t.value]]);
+      }, []), [[fs, t.value]]);
     }
     return () => s();
   }
 }), es = V({
   name: "TdColorsSection",
   setup(e, { slots: t, emit: s }) {
-    const { lang: n } = H(), r = M(), i = mt(), o = Fe(), { active: c } = N(r), a = pe(!1), u = pe(!1), p = C(
+    const { lang: o } = q(), n = T(), i = mt(), r = Fe(), { active: c } = O(n), a = he(!1), u = he(!1), p = C(
       () => {
-        var b;
-        return (b = n.value.td) == null ? void 0 : b.components.colors.items.background;
+        var v;
+        return (v = o.value.td) == null ? void 0 : v.components.colors.items.background;
       }
     ), P = C(
       () => {
-        var b;
-        return (b = n.value.td) == null ? void 0 : b.components.colors.items.ground;
+        var v;
+        return (v = o.value.td) == null ? void 0 : v.components.colors.items.ground;
       }
     ), w = C(() => ({
       key: p.value,
@@ -1809,39 +1809,39 @@ const Ot = () => {
       type: "none",
       icon: "f_ground",
       size: "sm",
-      color: o.colorHex,
+      color: r.colorHex,
       onClick: () => u.value = !0
     })), g = C({
       get: () => u.value || a.value,
-      set: (b) => u.value = a.value = !1
+      set: (v) => u.value = a.value = !1
     }), y = C({
-      get: () => u.value ? o.colorHex : i.colorHex,
-      set: (b) => {
+      get: () => u.value ? r.colorHex : i.colorHex,
+      set: (v) => {
         if (u.value) {
-          o.setColorHex(b);
+          r.setColorHex(v);
           return;
         }
-        i.setColorHex(b);
+        i.setColorHex(v);
       }
     }), x = C(() => ({
       class: "td-colors-tool q-pa-xs row justify-center items-center q-gutter-md",
       style: g.value ? "display: none" : ""
-    })), v = C(() => ({
+    })), b = C(() => ({
       modelValue: y.value,
-      "onUpdate:modelValue": (b) => y.value = b,
+      "onUpdate:modelValue": (v) => y.value = v,
       show: g.value,
-      "onUpdate:show": (b) => g.value = b,
-      label: k.value
-    })), k = C(() => u.value ? P.value : p.value), R = () => {
-      i.reset(), o.reset();
-    }, F = C(() => o.changed || i.changed), $ = C(() => ({
+      "onUpdate:show": (v) => g.value = v,
+      label: D.value
+    })), D = C(() => u.value ? P.value : p.value), L = () => {
+      i.reset(), r.reset();
+    }, F = C(() => r.changed || i.changed), N = C(() => ({
       label: "Reset Colors",
-      onClick: R,
+      onClick: L,
       style: g.value ? "display: none" : "",
       disable: !F.value
     }));
-    j(c, (b) => {
-      b !== oe && (g.value = !1);
+    G(c, (v) => {
+      v !== ne && (g.value = !1);
     });
     function K() {
       return d("div", {
@@ -1849,16 +1849,16 @@ const Ot = () => {
       }, [
         d(ft),
         d("div", x.value, [
-          d(me, w.value),
-          d(me, m.value)
+          d(ie, w.value),
+          d(ie, m.value)
         ]),
-        d(zt, $.value),
-        d(ys, v.value)
+        d(zt, N.value),
+        d(Ss, b.value)
       ]);
     }
     return () => K();
   }
-}), mo = V({
+}), fo = V({
   name: "TdColorsExpansion",
   props: {
     modelValue: { type: Number, default: 0 },
@@ -1867,13 +1867,13 @@ const Ot = () => {
   },
   emits: ["click", "update:modelValue"],
   setup(e, { slots: t, emit: s }) {
-    const { lang: n } = H(), r = Mt(), { expanded: i, selected: o } = Z({
-      store: r,
-      options: oe,
-      tab: oe
+    const { lang: o } = q(), n = Mt(), { expanded: i, selected: r } = X({
+      store: n,
+      options: ne,
+      tab: ne
     }), c = C(() => {
       var u;
-      return (u = n.value.td) == null ? void 0 : u.components.colors.title;
+      return (u = o.value.td) == null ? void 0 : u.components.colors.title;
     });
     C({
       get: () => e.modelValue,
@@ -1886,7 +1886,7 @@ const Ot = () => {
         modelValue: i.value,
         "onUpdate:modelValue": (p) => i.value = p,
         label: c.value,
-        selected: o.value,
+        selected: r.value,
         icon: "f_palette"
       };
       return d(Ve, u, () => d(es));
@@ -1896,27 +1896,27 @@ const Ot = () => {
 }), ts = V({
   name: "TdGridSection",
   setup(e, { slots: t, emit: s }) {
-    const { lang: n } = H(), r = ke(), i = C(
+    const { lang: o } = q(), n = ve(), i = C(
       () => {
         var w, m;
-        return o.value ? ((w = n.value.td) == null ? void 0 : w.components.grid.toggle.off) || "" : ((m = n.value.td) == null ? void 0 : m.components.grid.toggle.on) || "";
+        return r.value ? ((w = o.value.td) == null ? void 0 : w.components.grid.toggle.off) || "" : ((m = o.value.td) == null ? void 0 : m.components.grid.toggle.on) || "";
       }
-    ), o = C({
-      get: () => r.show,
-      set: (w) => r.setProperty("show", w)
+    ), r = C({
+      get: () => n.show,
+      set: (w) => n.setProperty("show", w)
     }), c = C({
-      get: () => r.opacity,
-      set: (w) => r.setProperty("opacity", w)
+      get: () => n.opacity,
+      set: (w) => n.setProperty("opacity", w)
     }), a = C({
-      get: () => r.size,
-      set: (w) => r.setProperty("size", w)
+      get: () => n.size,
+      set: (w) => n.setProperty("size", w)
     }), u = C({
-      get: () => r.divisions,
-      set: (w) => r.setProperty("divisions", w)
+      get: () => n.divisions,
+      set: (w) => n.setProperty("divisions", w)
     }), p = C(() => ({
       label: "Reset Grid",
-      disable: !r.changed,
-      onClick: r.reset
+      disable: !n.changed,
+      onClick: n.reset
     }));
     function P() {
       const w = {
@@ -1924,8 +1924,8 @@ const Ot = () => {
       }, m = {
         access: "grd",
         // drawer: !props.noIcons,
-        modelValue: o.value,
-        "onUpdate:modelValue": (k) => o.value = k,
+        modelValue: r.value,
+        "onUpdate:modelValue": (D) => r.value = D,
         label: i.value
         // dark: props.dark,
         // disable: props.disable,
@@ -1938,7 +1938,7 @@ const Ot = () => {
         max: 100,
         initial: 50,
         modelValue: c.value * 100,
-        "onUpdate:modelValue": (k) => c.value = k / 100
+        "onUpdate:modelValue": (D) => c.value = D / 100
       }, y = {
         title: "Size",
         icon: "f_size",
@@ -1946,7 +1946,7 @@ const Ot = () => {
         max: 300,
         initial: 200,
         modelValue: a.value * 100,
-        "onUpdate:modelValue": (k) => a.value = k / 100
+        "onUpdate:modelValue": (D) => a.value = D / 100
       }, x = {
         title: "Number of lines",
         icon: "f_grid",
@@ -1956,13 +1956,13 @@ const Ot = () => {
         step: 2,
         initial: 6,
         modelValue: u.value,
-        "onUpdate:modelValue": (k) => u.value = k
-      }, v = [d(ft), d(Ht, m)];
-      return o.value && (v.push(d(We, y)), v.push(d(We, x)), v.push(d(We, g)), v.push(d(zt, p.value))), d("div", w, v);
+        "onUpdate:modelValue": (D) => u.value = D
+      }, b = [d(ft), d(Ht, m)];
+      return r.value && (b.push(d(We, y)), b.push(d(We, x)), b.push(d(We, g)), b.push(d(zt, p.value))), d("div", w, b);
     }
     return () => P();
   }
-}), fo = V({
+}), ho = V({
   name: "TdGridExpansion",
   props: {
     modelValue: { type: Number, default: 0 },
@@ -1971,13 +1971,13 @@ const Ot = () => {
   },
   emits: ["click", "update:modelValue"],
   setup(e, { slots: t, emit: s }) {
-    const { lang: n } = H(), r = ke(), { expanded: i, selected: o } = Z({
-      store: r,
-      options: we,
-      tab: we
+    const { lang: o } = q(), n = ve(), { expanded: i, selected: r } = X({
+      store: n,
+      options: Ce,
+      tab: Ce
     }), c = C(() => {
       var u;
-      return (u = n.value.td) == null ? void 0 : u.components.grid.title;
+      return (u = o.value.td) == null ? void 0 : u.components.grid.title;
     });
     C({
       get: () => e.modelValue,
@@ -1990,7 +1990,7 @@ const Ot = () => {
         modelValue: i.value,
         "onUpdate:modelValue": (p) => i.value = p,
         label: c.value,
-        selected: o.value,
+        selected: r.value,
         icon: "f_grid"
       };
       return d(Ve, u, () => d(ts));
@@ -2006,13 +2006,13 @@ const Ot = () => {
   },
   emits: ["click", "update:modelValue"],
   setup() {
-    const { lang: e } = H(), t = he(), s = M(), n = fe(), r = ut(), i = Bt(), o = At(), { active: c } = N(s), a = C({
+    const { lang: e } = q(), t = ge(), s = T(), o = ae(), n = ut(), i = At(), r = Bt(), { active: c } = O(s), a = C({
       get: () => t.move,
       set: (h) => t.setMove(h)
     }), u = C(
       () => {
-        var h, B;
-        return t.move ? ((h = e.value.td) == null ? void 0 : h.components.lights.toggles.position.off) || "" : ((B = e.value.td) == null ? void 0 : B.components.lights.toggles.position.on) || "";
+        var h, A;
+        return t.move ? ((h = e.value.td) == null ? void 0 : h.components.lights.toggles.position.off) || "" : ((A = e.value.td) == null ? void 0 : A.components.lights.toggles.position.on) || "";
       }
     ), p = C(() => ({
       modelValue: a.value,
@@ -2028,37 +2028,37 @@ const Ot = () => {
         var h;
         return ((h = e.value.td) == null ? void 0 : h.components.lights.userIntensity) || "";
       }
-    ), m = 0, g = 50, y = 100, x = (h, B, G) => ({
-      toSlider: (z) => z <= B ? m + (z - h) / (B - h) * (g - m) : g + (z - B) / (G - B) * (y - g),
-      fromSlider: (z) => z <= g ? h + (z - m) / (g - m) * (B - h) : B + (z - g) / (y - g) * (G - B)
-    }), v = x(
+    ), m = 0, g = 50, y = 100, x = (h, A, j) => ({
+      toSlider: (z) => z <= A ? m + (z - h) / (A - h) * (g - m) : g + (z - A) / (j - A) * (y - g),
+      fromSlider: (z) => z <= g ? h + (z - m) / (g - m) * (A - h) : A + (z - g) / (y - g) * (j - A)
+    }), b = x(
       Pe,
-      se,
+      oe,
       Et
-    ), k = x(
+    ), D = x(
       Pe,
-      se,
-      It
-    ), R = (h, B, G, z) => ({
+      oe,
+      kt
+    ), L = (h, A, j, z) => ({
       title: h,
       icon: "f_brightness",
       min: m,
       max: y,
-      modelValue: B.toSlider(G),
-      "onUpdate:modelValue": (U) => {
-        z(B.fromSlider(U));
+      modelValue: A.toSlider(j),
+      "onUpdate:modelValue": ($) => {
+        z(A.fromSlider($));
       }
     }), F = C(
-      () => R(
+      () => L(
         P.value,
-        v,
+        b,
         t.ambientScale,
         (h) => t.setAmbientScale(h)
       )
-    ), $ = C(
-      () => R(
+    ), N = C(
+      () => L(
         w.value,
-        k,
+        D,
         t.userScale,
         (h) => t.setUserScale(h)
       )
@@ -2066,30 +2066,30 @@ const Ot = () => {
       label: "Reset Lights",
       disable: !t.changed,
       onClick: () => {
-        var B;
+        var A;
         t.reset();
-        const h = n.bounds;
-        h && (i.activate(), i.frameToBounds(h), i.syncToStore(), o.activate()), (B = r.applyFromStore) == null || B.call(r);
+        const h = o.bounds;
+        h && (i.activate(), i.frameToBounds(h), i.syncToStore(), r.activate()), (A = n.applyFromStore) == null || A.call(n);
       }
     }));
-    j(c, (h) => {
-      h !== de && (a.value = !1);
+    G(c, (h) => {
+      h !== fe && (a.value = !1);
     });
-    function b() {
+    function v() {
       const h = {
         class: "td-lights-tool"
-      }, B = [
+      }, A = [
         d(ft),
         d(Ht, p.value),
         d(We, F.value),
-        d(We, $.value),
+        d(We, N.value),
         d(zt, K.value)
       ];
-      return d("div", h, B);
+      return d("div", h, A);
     }
-    return () => b();
+    return () => v();
   }
-}), ho = V({
+}), go = V({
   name: "TdLightExpansion",
   props: {
     modelValue: { type: Number, default: 0 },
@@ -2098,13 +2098,13 @@ const Ot = () => {
   },
   emits: ["click", "update:modelValue"],
   setup(e, { slots: t, emit: s }) {
-    const { lang: n } = H(), r = he(), { expanded: i, selected: o } = Z({
-      store: r,
-      options: de,
-      tab: de
+    const { lang: o } = q(), n = ge(), { expanded: i, selected: r } = X({
+      store: n,
+      options: fe,
+      tab: fe
     }), c = C(() => {
       var u;
-      return (u = n.value.td) == null ? void 0 : u.components.lights.title;
+      return (u = o.value.td) == null ? void 0 : u.components.lights.title;
     });
     C({
       get: () => e.modelValue,
@@ -2117,7 +2117,7 @@ const Ot = () => {
         modelValue: i.value,
         "onUpdate:modelValue": (p) => i.value = p,
         label: c.value,
-        selected: o.value,
+        selected: r.value,
         icon: "f_bulb_light"
       };
       return d(Ve, u, () => d(ss));
@@ -2129,29 +2129,29 @@ const Ot = () => {
   setup() {
     const e = Symbol.for("RelatedSection"), t = Ze(e);
     function s() {
-      const n = {
+      const o = {
         class: "td-related-section q-mx-lg q-my-sm"
-      }, r = [];
-      return t && r.push(d(t)), d("div", n, r);
+      }, n = [];
+      return t && n.push(d(t)), d("div", o, n);
     }
     return () => s();
   }
-}), go = V({
+}), vo = V({
   name: "TdRelatedExpansion",
   setup(e, { slots: t, emit: s }) {
-    const { expanded: n } = Z({
-      options: Ce,
-      tab: Ce
-    }), r = C(() => "Related");
+    const { expanded: o } = X({
+      options: Ee,
+      tab: Ee
+    }), n = C(() => "Related");
     function i() {
-      const o = {
+      const r = {
         class: "td-related-expansion",
-        modelValue: n.value,
-        "onUpdate:modelValue": (c) => n.value = c,
-        label: r.value,
+        modelValue: o.value,
+        "onUpdate:modelValue": (c) => o.value = c,
+        label: n.value,
         icon: "f_related"
       };
-      return d(Ve, o, () => d(os));
+      return d(Ve, r, () => d(os));
     }
     return () => i();
   }
@@ -2166,53 +2166,53 @@ const Ot = () => {
     }
     return () => s();
   }
-}), vo = V({
+}), bo = V({
   name: "TdSavedExpansion",
   setup() {
-    const { expanded: e } = Z({
-      options: Ee,
-      tab: Ee
+    const { expanded: e } = X({
+      options: ke,
+      tab: ke
     }), t = C(() => "Saved");
     function s() {
-      const n = {
+      const o = {
         class: "td-saved-expansion",
         modelValue: e.value,
-        "onUpdate:modelValue": (r) => e.value = r,
+        "onUpdate:modelValue": (n) => e.value = n,
         label: t.value,
         icon: "f_save"
       };
-      return d(Ve, n, () => d(ns));
+      return d(Ve, o, () => d(ns));
     }
     return () => s();
   }
 });
-function bo() {
-  const { freeServer: e, paidServer: t } = Cs();
-  return Es({ freeServer: e, paidServer: t });
+function yo() {
+  const { freeServer: e, paidServer: t } = Es();
+  return ks({ freeServer: e, paidServer: t });
 }
-const yo = Symbol.for("activity-tracking"), So = ["nude", "muscle", "smooth"];
-function xo() {
-  const e = M(), t = fe(), s = Ze(yo, null), { getThumbnail: n } = bo();
+const So = Symbol.for("activity-tracking"), xo = ["nude", "muscle", "smooth"];
+function wo() {
+  const e = T(), t = ae(), s = Ze(So, null), { getThumbnail: o } = yo();
   return { skins: C(() => {
-    const i = e.setUuid, o = e.selected, c = {};
+    const i = e.setUuid, r = e.selected, c = {};
     return Object.values(t.models).forEach((a) => {
       !(a != null && a.slug) || c[a.slug] || (c[a.slug] = a);
-    }), So.filter((a) => c[a]).map((a) => {
+    }), xo.filter((a) => c[a]).map((a) => {
       const u = c[a];
       return {
         id: u.id,
         slug: a,
         name: a,
-        imageUrl: i ? n({ type: "sets", uuid: i, image: a }) : null,
-        selected: u.id === o,
+        imageUrl: i ? o({ type: "sets", uuid: i, image: a }) : null,
+        selected: u.id === r,
         click: () => {
-          e.selected = u.id, s == null || s.trackEvent(Ps, { value: a });
+          e.selected = u.id, s == null || s.trackEvent(Ls, { value: a });
         }
       };
     });
   }) };
 }
-const wo = V({
+const Co = V({
   name: "TdSkinButton",
   props: {
     id: { type: Number, required: !0 },
@@ -2228,8 +2228,8 @@ const wo = V({
       margin: "3px",
       marginBottom: e.size === "sm" ? "40px" : "30px"
     }));
-    function n() {
-      const r = {
+    function o() {
+      const n = {
         class: `td-${e.slug}-button td-skin-button`,
         key: e.id,
         label: e.label,
@@ -2241,63 +2241,63 @@ const wo = V({
         selected: e.selected,
         onClick: () => t("click")
       };
-      return d(me, r);
+      return d(ie, n);
     }
-    return () => n();
+    return () => o();
   }
 }), rs = V({
   name: "TdSkinsSection",
   props: { size: { type: String, default: "sm" } },
   setup(e) {
-    const { skins: t } = xo(), { lang: s } = H();
-    function n() {
-      const r = [d(ft)];
+    const { skins: t } = wo(), { lang: s } = q();
+    function o() {
+      const n = [d(ft)];
       return t.value.forEach((i) => {
-        var o, c;
-        r.push(
-          d(wo, {
+        var r, c;
+        n.push(
+          d(Co, {
             id: i.id,
             slug: i.slug,
-            label: ((c = (o = s.value.td) == null ? void 0 : o.components.skins.items) == null ? void 0 : c[i.slug]) ?? i.slug,
+            label: ((c = (r = s.value.td) == null ? void 0 : r.components.skins.items) == null ? void 0 : c[i.slug]) ?? i.slug,
             image: i.imageUrl,
             selected: i.selected,
             size: e.size,
             onClick: i.click
           })
         );
-      }), d(Jt, {}, () => r);
+      }), d(Jt, {}, () => n);
     }
-    return () => n();
+    return () => o();
   }
-}), Co = V({
+}), Eo = V({
   name: "TdSkinsExpansion",
   setup() {
-    const { lang: e } = H(), t = fe(), { expanded: s } = Z({
-      options: xe,
-      tab: xe
-    }), n = C(() => {
+    const { lang: e } = q(), t = ae(), { expanded: s } = X({
+      options: ee,
+      tab: ee
+    }), o = C(() => {
       var c;
-      const o = (c = t.model) == null ? void 0 : c.slug;
-      return !!o && o !== Wt;
-    }), r = C(() => {
-      var o;
-      return (o = e.value.td) == null ? void 0 : o.components.skins.title;
+      const r = (c = t.model) == null ? void 0 : c.slug;
+      return !!r && r !== Wt;
+    }), n = C(() => {
+      var r;
+      return (r = e.value.td) == null ? void 0 : r.components.skins.title;
     });
     function i() {
-      const o = {
+      const r = {
         class: "td-skins-expansion",
         "data-cy": "td-skins-expansion",
         modelValue: s.value,
         "onUpdate:modelValue": (c) => s.value = c,
-        label: r.value,
-        selected: n.value,
+        label: n.value,
+        selected: o.value,
         icon: "f_shirt"
       };
-      return d(Ve, o, () => d(rs, { size: "sm", class: "q-py-sm" }));
+      return d(Ve, r, () => d(rs, { size: "sm", class: "q-py-sm" }));
     }
     return () => i();
   }
-}), Eo = V({
+}), is = V({
   name: "TdButtons",
   props: {
     modelValue: { type: Number, default: 0 },
@@ -2309,167 +2309,169 @@ const wo = V({
     }
   },
   emits: ["click", "update:modelValue"],
-  setup(e, { slots: t, emit: s }) {
-    const n = At(), r = Bt(), i = pt(), o = Fe(), c = he(), a = mt(), { changed: u } = N(i), { changed: p } = N(o), { changed: P } = N(c), { changed: w } = N(a), m = C(() => !(u.value || p.value || P.value || w.value));
-    function g() {
-      i.reset(), o.reset(), c.reset(), a.reset(), n.applyFromStore(), r.applyFromStore();
-    }
-    const y = (v) => v.preventDefault();
+  setup(e, { emit: t }) {
+    const s = Bt(), o = At(), n = pt(), i = ae(), r = ve(), c = Fe(), a = ge(), u = mt(), { changed: p } = O(n), { changed: P } = O(r), { changed: w } = O(c), { changed: m } = O(a), { changed: g } = O(u), y = C(() => !(p.value || P.value || w.value || m.value || g.value));
     function x() {
-      const k = {
-        style: C(() => e.fixed ? "position: fixed;bottom: 0; left: 0; right: 0;border-top: 1px solid var(--grey-300)" : ""),
-        class: "row justify-center items-center q-pa-md"
-      }, R = {
+      n.reset(), r.reset(), c.reset(), a.reset(), u.reset();
+      const L = i.bounds;
+      L ? (o.activate(), o.frameToBounds(L), o.syncToStore(), s.activate(), s.frameToBounds(L), s.syncToStore()) : (s.applyFromStore(), o.applyFromStore());
+    }
+    const b = (L) => L.preventDefault();
+    function D() {
+      const F = {
+        style: e.fixed ? "position: fixed;bottom: 0; left: 0; right: 0;border-top: 1px solid var(--grey-300)" : "",
+        class: e.fixed ? "row justify-center items-center q-pa-md glass-background" : "row justify-center items-center q-pa-md"
+      }, N = {
         class: "td-reset-button",
         label: "Reset All",
-        onClick: g,
-        onKeyup: y,
+        onClick: x,
+        onKeyup: b,
         rounded: !0,
         unelevated: !0,
         outline: !0,
-        disable: m.value
+        disable: y.value
       };
-      return d("div", k, [d(qt, R)]);
+      return d("div", F, [d(qt, N)]);
     }
-    return () => x();
+    return () => D();
   }
-}), is = V({
+}), as = V({
   name: "TdPoseButtonsSection",
   setup() {
     const e = Symbol.for("PoseButtonsSection"), t = Ze(e, null);
     function s() {
-      const n = {
+      const o = {
         class: "td-pose-buttons-section"
-      }, r = [];
-      return t && r.push(d(t)), d("div", n, r);
+      }, n = [];
+      return t && n.push(d(t)), d("div", o, n);
     }
     return () => s();
   }
-}), Io = V({
+}), ko = V({
   name: "TdExpansions",
   setup(e, { slots: t, emit: s }) {
-    function n() {
+    function o() {
       return d("div", {
         class: "td-expansions",
         onClick: (i) => i.stopPropagation(),
         style: "padding-bottom: 60px; position: relative "
       }, [
-        d(is),
-        d(ve),
-        d(Co),
-        d(ve),
-        d(mo),
-        d(ve),
+        d(as),
+        d(ye),
+        d(Eo),
+        d(ye),
         d(fo),
-        d(ve),
+        d(ye),
         d(ho),
-        d(ve),
+        d(ye),
+        d(go),
+        d(ye),
         // h(TsGridExpansion),
         // h(QSeparator),
         // h(TsAdjustmentExpansion),
-        d(go),
-        d(ve),
         d(vo),
-        d(ve),
+        d(ye),
+        d(bo),
+        d(ye),
         // h('div', {}, store.loading.percent),
-        d(Eo)
+        d(is)
       ]);
     }
-    return () => n();
+    return () => o();
   }
-}), Do = V({
+}), Io = V({
   name: "TdColorsButton",
   props: { size: String },
   setup(e, {}) {
-    const t = ke(), s = M(), n = C(() => (s == null ? void 0 : s.hasAccess("grd")) || !1), { lang: r } = H(), i = C(() => {
+    const t = ve(), s = T(), o = C(() => (s == null ? void 0 : s.hasAccess("grd")) || !1), { lang: n } = q(), i = C(() => {
       var p;
-      return (p = r.value.td) == null ? void 0 : p.controls.colors.iconTitle;
-    }), { click: o, selected: c } = Z({
+      return (p = n.value.td) == null ? void 0 : p.controls.colors.iconTitle;
+    }), { click: r, selected: c } = X({
       store: t,
-      options: oe,
-      tab: oe
+      options: ne,
+      tab: ne
     });
     function a(p) {
       return s.block(p);
     }
     function u() {
       const p = {
-        hasAccess: n.value,
+        hasAccess: o.value,
         selected: c.value,
-        onClick: o,
+        onClick: r,
         onBlockAccess: a,
         size: e.size,
-        "data-id": oe,
+        "data-id": ne,
         name: "colors",
         type: "none",
         icon: "f_palette",
         label: i.value
       };
-      return d(me, p, () => []);
+      return d(ie, p, () => []);
     }
     return () => u();
   }
-}), ko = V({
+}), To = V({
   name: "TdGridButton",
   props: { size: String },
   setup(e, {}) {
-    const t = ke(), s = M(), n = C(() => (s == null ? void 0 : s.hasAccess("grd")) || !1), { lang: r } = H(), i = C(() => {
+    const t = ve(), s = T(), o = C(() => (s == null ? void 0 : s.hasAccess("grd")) || !1), { lang: n } = q(), i = C(() => {
       var p;
-      return (p = r.value.td) == null ? void 0 : p.controls.grid.iconTitle;
-    }), { click: o, selected: c } = Z({
+      return (p = n.value.td) == null ? void 0 : p.controls.grid.iconTitle;
+    }), { click: r, selected: c } = X({
       store: t,
-      options: we,
-      tab: we
+      options: Ce,
+      tab: Ce
     });
     function a(p) {
       return s.block(p);
     }
     function u() {
       const p = {
-        hasAccess: n.value,
+        hasAccess: o.value,
         selected: c.value,
-        onClick: o,
+        onClick: r,
         onBlockAccess: a,
         size: e.size,
-        "data-id": we,
+        "data-id": Ce,
         name: "grid",
         type: "none",
         icon: "f_grid",
         label: i.value
       };
-      return d(me, p, () => []);
+      return d(ie, p, () => []);
     }
     return () => u();
   }
-}), To = V({
+}), Do = V({
   name: "TdLightsButton",
   props: { size: String },
   setup(e, {}) {
-    const t = ke(), s = M(), n = C(() => (s == null ? void 0 : s.hasAccess("grd")) || !1), { lang: r } = H(), i = C(() => {
+    const t = ve(), s = T(), o = C(() => (s == null ? void 0 : s.hasAccess("grd")) || !1), { lang: n } = q(), i = C(() => {
       var p;
-      return (p = r.value.td) == null ? void 0 : p.controls.lights.iconTitle;
-    }), { click: o, selected: c } = Z({
+      return (p = n.value.td) == null ? void 0 : p.controls.lights.iconTitle;
+    }), { click: r, selected: c } = X({
       store: t,
-      options: de,
-      tab: de
+      options: fe,
+      tab: fe
     });
     function a(p) {
       return s.block(p);
     }
     function u() {
       const p = {
-        hasAccess: n.value,
+        hasAccess: o.value,
         selected: c.value,
-        onClick: o,
+        onClick: r,
         onBlockAccess: a,
         size: e.size,
-        "data-id": de,
+        "data-id": fe,
         name: "lights",
         type: "none",
         icon: "f_bulb_light",
         label: i.value
       };
-      return d(me, p, () => []);
+      return d(ie, p, () => []);
     }
     return () => u();
   }
@@ -2477,232 +2479,264 @@ const wo = V({
   name: "TsAdjustmentsButton",
   props: { size: String },
   setup(e, {}) {
-    const t = M(), { lang: s } = H(), n = C(() => {
+    const t = T(), { lang: s } = q(), o = C(() => {
       var a;
       return (a = s.value.td) == null ? void 0 : a.controls.related.iconTitle;
-    }), { click: r, selected: i } = Z({
-      options: Ce,
-      tab: Ce
+    }), { click: n, selected: i } = X({
+      options: Ee,
+      tab: Ee
     });
-    function o(a) {
+    function r(a) {
       return t.block(a);
     }
     function c() {
       const a = {
         hasAccess: !0,
         selected: i.value,
-        onClick: r,
-        onBlockAccess: o,
-        "data-id": Ce,
+        onClick: n,
+        onBlockAccess: r,
+        "data-id": Ee,
         size: e.size,
         name: "related",
         icon: "f_related",
         type: "none",
-        label: n.value
+        label: o.value
       };
-      return d(me, a, () => []);
+      return d(ie, a, () => []);
     }
     return () => c();
   }
-}), Ao = V({
+}), Bo = V({
   name: "TdSavedButton",
   props: { size: String },
   setup(e) {
-    const t = M(), { lang: s } = H(), n = C(
+    const t = T(), { lang: s } = q(), o = C(
       () => {
         var a, u;
         return ((u = (a = s.value.td) == null ? void 0 : a.controls.saved) == null ? void 0 : u.iconTitle) || "Saved";
       }
-    ), { click: r, selected: i } = Z({
-      options: Ee,
-      tab: Ee
+    ), { click: n, selected: i } = X({
+      options: ke,
+      tab: ke
     });
-    function o(a) {
+    function r(a) {
       return t.block(a);
     }
     function c() {
       const a = {
         hasAccess: !0,
         selected: i.value,
-        onClick: r,
-        onBlockAccess: o,
-        "data-id": Ee,
+        onClick: n,
+        onBlockAccess: r,
+        "data-id": ke,
         size: e.size,
         name: "saved",
         icon: "f_save",
         type: "none",
-        label: n.value
+        label: o.value
       };
-      return d(me, a, () => []);
+      return d(ie, a, () => []);
     }
     return () => c();
   }
-}), Bo = V({
+}), Ao = V({
+  name: "TdSkinsButton",
+  props: { size: String },
+  setup(e) {
+    const t = T(), { lang: s } = q(), o = C(() => {
+      var a;
+      return (a = s.value.td) == null ? void 0 : a.controls.skins.iconTitle;
+    }), { click: n, selected: i } = X({
+      options: ee,
+      tab: ee
+    });
+    function r(a) {
+      return t.block(a);
+    }
+    function c() {
+      const a = {
+        hasAccess: !0,
+        selected: i.value,
+        onClick: n,
+        onBlockAccess: r,
+        "data-id": ee,
+        size: e.size,
+        name: "skins",
+        icon: "f_shirt",
+        type: "none",
+        label: o.value
+      };
+      return d(ie, a, () => []);
+    }
+    return () => c();
+  }
+}), zo = V({
   name: "TdDefaultDrawer",
   props: {},
   emits: ["click"],
   setup() {
-    const e = M(), t = "q-ma-xs";
-    function s(n) {
+    const e = T(), t = "q-ma-xs";
+    function s(o) {
       return {
         class: t,
-        size: "sm",
-        onClick: () => e.setActive(n)
+        size: "xs",
+        onClick: () => e.setActive(o)
       };
     }
     return () => d(
-      De,
+      Te,
       { name: lt },
       {
         default: () => d(Jt, {}, () => [
-          d(Do, s(oe)),
-          d(ko, s(we)),
-          d(To, s(de)),
-          d(Mo, s(Ce)),
-          d(Ao, s(Ee))
+          d(Ao, s(ee)),
+          d(Io, s(ne)),
+          d(To, s(Ce)),
+          d(Do, s(fe)),
+          d(Mo, s(Ee)),
+          d(Bo, s(ke))
         ]),
-        secondary: () => d(is)
+        secondary: () => [d(as), d(is, { fixed: !1 })]
       }
     );
   }
-}), zo = V({
+}), Po = V({
   name: "TdGridDrawer",
   setup(e, { slots: t, emit: s }) {
-    const { lang: n } = H(), r = C(() => {
-      var o;
-      return (o = n.value.td) == null ? void 0 : o.controls.grid.title;
+    const { lang: o } = q(), n = C(() => {
+      var r;
+      return (r = o.value.td) == null ? void 0 : r.controls.grid.title;
     });
     function i() {
-      const o = {
+      const r = {
         class: "td-grid-drawer",
-        name: we,
-        label: r.value
+        name: Ce,
+        label: n.value
       };
-      return d(De, o, () => d(ts));
+      return d(Te, r, () => d(ts));
     }
     return () => i();
   }
-}), Po = V({
+}), Lo = V({
   name: "TdRelatedDrawer",
   setup(e, { slots: t, emit: s }) {
-    const { lang: n } = H(), r = C(() => {
-      var o;
-      return (o = n.value.td) == null ? void 0 : o.controls.related.title;
+    const { lang: o } = q(), n = C(() => {
+      var r;
+      return (r = o.value.td) == null ? void 0 : r.controls.related.title;
     });
     function i() {
-      const o = {
+      const r = {
         class: "td-related-drawer",
-        name: Ce,
-        label: r.value
+        name: Ee,
+        label: n.value
       };
-      return d(De, o, () => d(os));
+      return d(Te, r, () => d(os));
     }
     return () => i();
   }
-}), Lo = V({
+}), Ro = V({
   name: "TdSavedDrawer",
   setup() {
-    const { lang: e } = H(), t = C(() => {
-      var n, r;
-      return ((r = (n = e.value.td) == null ? void 0 : n.controls.saved) == null ? void 0 : r.title) || "Saved";
+    const { lang: e } = q(), t = C(() => {
+      var o, n;
+      return ((n = (o = e.value.td) == null ? void 0 : o.controls.saved) == null ? void 0 : n.title) || "Saved";
     });
     function s() {
-      const n = {
+      const o = {
         class: "td-saved-drawer",
-        name: Ee,
+        name: ke,
         label: t.value
       };
-      return d(De, n, () => d(ns));
+      return d(Te, o, () => d(ns));
     }
     return () => s();
   }
-}), Ro = V({
+}), Vo = V({
   name: "TdLightsDrawer",
   setup(e, { slots: t, emit: s }) {
-    const { lang: n } = H(), r = C(() => {
-      var o;
-      return (o = n.value.td) == null ? void 0 : o.controls.lights.title;
+    const { lang: o } = q(), n = C(() => {
+      var r;
+      return (r = o.value.td) == null ? void 0 : r.controls.lights.title;
     });
     function i() {
-      const o = {
+      const r = {
         class: "td-lights-drawer",
-        name: de,
-        label: r.value
+        name: fe,
+        label: n.value
       };
-      return d(De, o, () => d(ss));
+      return d(Te, r, () => d(ss));
     }
     return () => i();
   }
-}), Vo = V({
+}), Fo = V({
   name: "TdLightsDrawer",
   setup(e, { slots: t, emit: s }) {
-    const { lang: n } = H(), r = C(() => {
-      var o;
-      return (o = n.value.td) == null ? void 0 : o.controls.colors.title;
+    const { lang: o } = q(), n = C(() => {
+      var r;
+      return (r = o.value.td) == null ? void 0 : r.controls.colors.title;
     });
     function i() {
-      const o = {
+      const r = {
         class: "td-colors-drawer",
-        name: oe,
-        label: r.value
+        name: ne,
+        label: n.value
       };
-      return d(De, o, () => d(es));
+      return d(Te, r, () => d(es));
     }
     return () => i();
   }
-}), Fo = V({
+}), _o = V({
   name: "TdSkinsDrawer",
   setup() {
-    const { lang: e } = H(), { expanded: t } = Z({
-      options: xe,
-      tab: xe
+    const { lang: e } = q(), { expanded: t } = X({
+      options: ee,
+      tab: ee
     }), s = C(() => {
-      var r;
-      return (r = e.value.td) == null ? void 0 : r.controls.skins.title;
+      var n;
+      return (n = e.value.td) == null ? void 0 : n.controls.skins.title;
     });
-    function n() {
-      const r = {
+    function o() {
+      const n = {
         class: "td-skins-drawer",
-        name: xe,
+        name: ee,
         label: s.value,
         modelValue: t.value,
         "onUpdate:modelValue": (i) => t.value = i
       };
-      return d(De, r, () => d(rs));
+      return d(Te, n, () => d(rs));
     }
-    return () => n();
+    return () => o();
   }
-}), _o = V({
+}), jo = V({
   name: "TsDrawers",
   setup(e, { slots: t, emit: s }) {
-    const n = M(), r = C({
-      get: () => n.active,
-      set: (o) => n.setActive(o)
+    const o = T(), n = C({
+      get: () => o.active,
+      set: (r) => o.setActive(r)
     });
     function i() {
-      const o = {
-        modelValue: r.value,
-        "onUpdate:modelValue": (c) => r.value = c
+      const r = {
+        modelValue: n.value,
+        "onUpdate:modelValue": (c) => n.value = c
       };
-      return d(Ss, o, () => [
-        d(Bo),
-        d(Fo),
-        d(Ro),
-        d(Vo),
+      return d(xs, r, () => [
         d(zo),
+        d(_o),
+        d(Vo),
+        d(Fo),
         d(Po),
-        d(Lo)
+        d(Lo),
+        d(Ro)
       ]);
     }
     return () => i();
   }
-}), Qo = /* @__PURE__ */ Object.assign({
+}), en = /* @__PURE__ */ Object.assign({
   name: "TdPage",
   slug: "td-page",
   inheritAttrs: !1
 }, {
   __name: "TdPage",
-  props: /* @__PURE__ */ vs({
+  props: /* @__PURE__ */ bs({
     id: Number
   }, {
     miniState: { type: Boolean },
@@ -2710,36 +2744,36 @@ const wo = V({
   }),
   emits: ["update:miniState"],
   setup(e) {
-    const t = e, s = Symbol.for("activity-tracking"), n = M(), r = Ze(s, null), i = C(() => Number(t.id)), o = fs(e, "miniState"), c = (a) => {
-      a && (r == null || r.trackEvent(zs, {
-        glb_id: n.selected || null,
+    const t = e, s = Symbol.for("activity-tracking"), o = T(), n = Ze(s, null), i = C(() => Number(t.id)), r = hs(e, "miniState"), c = (a) => {
+      a && (n == null || n.trackEvent(Ps, {
+        glb_id: o.selected || null,
         base_pose_id: a
       }));
     };
     return $t(async () => {
-      r && (await r.beginExplore(), r.trackEvent(Bs, { from: null, to: "3d" }), n.basePoseId && (r.beginSegment(String(n.basePoseId)), c(n.basePoseId)));
-    }), j(
-      () => n.basePoseId,
+      n && (await n.beginExplore(), n.trackEvent(zs, { from: null, to: "3d" }), o.basePoseId && (n.beginSegment(String(o.basePoseId)), c(o.basePoseId)));
+    }), G(
+      () => o.basePoseId,
       (a, u) => {
-        !a || a === u || (r == null || r.beginSegment(String(a)), c(a));
+        !a || a === u || (n == null || n.beginSegment(String(a)), c(a));
       }
-    ), hs(() => {
-      n.setActive(Ct.is.mobile ? lt : oe), r == null || r.end();
-    }), (a, u) => (at(), vt(bt(xs), {
+    ), gs(() => {
+      o.setActive(Ct.is.mobile ? lt : ne), n == null || n.end();
+    }), (a, u) => (at(), vt(bt(ws), {
       class: "three-dimension-page",
-      miniState: o.value,
-      "onUpdate:miniState": u[0] || (u[0] = (p) => o.value = p),
+      miniState: r.value,
+      "onUpdate:miniState": u[0] || (u[0] = (p) => r.value = p),
       "no-drawer-padding": !0,
       title: "3D Viewer"
     }, {
       toolDrawer: yt(() => [
-        a.$q.platform.is.mobile ? wt("", !0) : (at(), vt(bt(Io), { key: 0 }))
+        a.$q.platform.is.mobile ? wt("", !0) : (at(), vt(bt(ko), { key: 0 }))
       ]),
       bottomDrawer: yt(() => [
-        a.$q.platform.is.mobile ? (at(), vt(bt(_o), { key: 0 })) : wt("", !0)
+        a.$q.platform.is.mobile ? (at(), vt(bt(jo), { key: 0 })) : wt("", !0)
       ]),
       default: yt(() => [
-        gs(po, { id: i.value }, null, 8, ["id"])
+        vs(mo, { id: i.value }, null, 8, ["id"])
       ]),
       _: 1
     }, 8, ["miniState"]));
@@ -2785,7 +2819,7 @@ const wo = V({
   "#BDACA8",
   "#DACDC9",
   "#E5E4E3"
-], en = Ye("3d-fbxs", {
+], tn = Ye("3d-fbxs", {
   state: () => ({
     models: {},
     loadingUrl: null,
@@ -2793,20 +2827,20 @@ const wo = V({
   }),
   getters: {
     changed(e) {
-      var n, r, i, o, c;
-      const s = M().selected;
-      return console.log("fbx model", (n = e.models) == null ? void 0 : n[s]), (i = (r = e.models) == null ? void 0 : r[s]) != null && i.color ? ((c = (o = e.models) == null ? void 0 : o[s]) == null ? void 0 : c.color) !== 16777215 : !1;
+      var o, n, i, r, c;
+      const s = T().selected;
+      return console.log("fbx model", (o = e.models) == null ? void 0 : o[s]), (i = (n = e.models) == null ? void 0 : n[s]) != null && i.color ? ((c = (r = e.models) == null ? void 0 : r[s]) == null ? void 0 : c.color) !== 16777215 : !1;
     },
     selectedId() {
-      return M().selected;
+      return T().selected;
     },
     poseId(e) {
-      var n, r;
-      const s = M().selected;
-      return (r = (n = e.models) == null ? void 0 : n[s]) == null ? void 0 : r.poseId;
+      var o, n;
+      const s = T().selected;
+      return (n = (o = e.models) == null ? void 0 : o[s]) == null ? void 0 : n.poseId;
     },
     model(e) {
-      const s = M().selected;
+      const s = T().selected;
       return s && e.models[s] ? e.models[s] : null;
     },
     url() {
@@ -2823,16 +2857,16 @@ const wo = V({
     },
     colorHex() {
       var e;
-      return (e = this.model) != null && e.color ? ue(this.model.color) : "#fefefe";
+      return (e = this.model) != null && e.color ? me(this.model.color) : "#fefefe";
     }
   },
   actions: {
     resetColor() {
-      const t = M().selected;
+      const t = T().selected;
       this.models[t].color = 16777215;
     },
     setBounds(e) {
-      const s = M().selected;
+      const s = T().selected;
       this.models[s].bounds = Kt(e);
     },
     setSubjectsFromResponse(e) {
@@ -2840,20 +2874,20 @@ const wo = V({
       this.models = { ...this.models, ...t };
     },
     setColorHex(e) {
-      const s = M().selected;
+      const s = T().selected;
       this.models[s].color = et(e);
     }
   }
 });
 export {
-  Qo as TdPage,
-  M as use3dStore,
+  en as TdPage,
+  T as use3dStore,
   Mt as useColorsStore,
   pt as useControlsStore,
-  en as useFBXStore,
-  fe as useGLBStore,
-  ke as useGridStore,
+  tn as useFBXStore,
+  ae as useGLBStore,
+  ve as useGridStore,
   Fe as useGroundStore,
-  he as useLightsStore,
+  ge as useLightsStore,
   mt as useSceneStore
 };