@virtualdisplay.io/client 4.0.0-alpha.27 → 4.0.0-alpha.29

package/dist/virtualdisplay.client.es.js

@@ -17,79 +17,79 @@ const c = {
   SYNC: "sync",
   SELECTABLE: "selectable",
   APP_RESOLVED: "app_resolved"
-}, F = "main", te = {
+}, L = "main", et = {
   FOCUS: "focus",
   UNFOCUS: "unfocus"
-}, Ie = {
+}, It = {
   FOCUSED: "focused"
-}, Le = {
+}, Ot = {
   /** Behaves exactly like an unpriced combination: no price, no button. */
   HIDDEN: "hidden"
-}, Oe = new Set(Object.values(c));
-function Ne(n) {
+}, Lt = new Set(Object.values(c));
+function Mt(n) {
   if (typeof n != "object" || n === null)
     return !1;
-  const e = n;
-  return typeof e.target == "string" ? !1 : typeof e.type == "string" && Oe.has(e.type);
+  const t = n;
+  return typeof t.target == "string" ? !1 : typeof t.type == "string" && Lt.has(t.type);
 }
-function Me(n) {
-  const e = S(n);
-  return e !== null && e.type === c.HANDSHAKE;
+function Nt(n) {
+  const t = w(n);
+  return t !== null && t.type === c.HANDSHAKE;
 }
-function ze(n) {
-  const e = S(n);
-  return e !== null && e.type === c.SESSION && typeof e.sessionId == "string";
+function zt(n) {
+  const t = w(n);
+  return t !== null && t.type === c.SESSION && typeof t.sessionId == "string";
 }
-function Pe(n) {
-  const e = S(n);
-  return e !== null && e.type === c.APP_RESOLVED && typeof e.appType == "string" && e.appType !== "" && typeof e.name == "string";
+function Pt(n) {
+  const t = w(n);
+  return t !== null && t.type === c.APP_RESOLVED && typeof t.appType == "string" && t.appType !== "" && typeof t.name == "string";
 }
-function Fe(n) {
-  const e = S(n);
-  return e !== null && e.type === c.MUTATION && typeof e.instance == "string" && e.instance !== "" && Array.isArray(e.results);
+function Ft(n) {
+  const t = w(n);
+  return t !== null && t.type === c.MUTATION && typeof t.instance == "string" && t.instance !== "" && Array.isArray(t.results);
 }
-function De(n) {
-  const e = S(n);
-  return e !== null && e.type === c.SNAPSHOT && ("data" in e || "error" in e);
+function Dt(n) {
+  const t = w(n);
+  return t !== null && t.type === c.SNAPSHOT && ("data" in t || "error" in t);
 }
-function $e(n) {
-  const e = S(n);
-  return e !== null && e.type === c.CAMERA && Array.isArray(e.transforms);
+function $t(n) {
+  const t = w(n);
+  return t !== null && t.type === c.CAMERA && Array.isArray(t.transforms);
 }
-function Ue(n) {
-  const e = S(n);
-  return e !== null && e.type === c.MAPPING && typeof e.instance == "string" && e.instance !== "" && Array.isArray(e.attributes);
+function Bt(n) {
+  const t = w(n);
+  return t !== null && t.type === c.MAPPING && typeof t.instance == "string" && t.instance !== "" && Array.isArray(t.attributes);
 }
-function Be(n) {
-  const e = S(n);
-  return e !== null && e.type === c.LOADING_INDICATOR && typeof e.progress == "number";
+function Ut(n) {
+  const t = w(n);
+  return t !== null && t.type === c.LOADING_INDICATOR && typeof t.progress == "number";
 }
-function Ve(n) {
-  const e = S(n);
-  return e !== null && e.type === c.SYNC && typeof e.connected == "boolean";
+function Vt(n) {
+  const t = w(n);
+  return t !== null && t.type === c.SYNC && typeof t.connected == "boolean";
 }
-function je(n) {
-  const e = S(n);
-  return e !== null && e.type === c.SELECTABLE && typeof e.instance == "string" && e.instance !== "" && Array.isArray(e.attributes);
+function jt(n) {
+  const t = w(n);
+  return t !== null && t.type === c.SELECTABLE && typeof t.instance == "string" && t.instance !== "" && Array.isArray(t.attributes);
 }
-function He(n) {
-  const e = S(n);
-  return e !== null && e.type === c.CONFIG && typeof e.viewerSettings == "object";
+function Ht(n) {
+  const t = w(n);
+  return t !== null && t.type === c.CONFIG && typeof t.viewerSettings == "object";
 }
-function qe(n) {
-  const e = S(n);
-  return e !== null && e.type === c.FOCUS && typeof e.instance == "string" && e.instance !== "" && typeof e.state == "string";
+function qt(n) {
+  const t = w(n);
+  return t !== null && t.type === c.FOCUS && typeof t.instance == "string" && t.instance !== "" && typeof t.state == "string";
 }
-function Ge(n) {
-  const e = S(n);
-  return e !== null && e.type === c.PRICING && typeof e.instance == "string" && e.instance !== "" && typeof e.pricing == "object" && e.pricing !== null;
+function Gt(n) {
+  const t = w(n);
+  return t !== null && t.type === c.PRICING && typeof t.instance == "string" && t.instance !== "" && typeof t.pricing == "object" && t.pricing !== null;
 }
-function S(n) {
+function w(n) {
   return typeof n != "object" || n === null ? null : n;
 }
-class ne {
-  constructor(e) {
-    this.processor = e;
+class nt {
+  constructor(t) {
+    this.processor = t;
   }
   processor;
   pending = [];
@@ -97,12 +97,12 @@ class ne {
   /**
    * Add a message — processed immediately if ready, queued otherwise
    */
-  enqueue(e) {
+  enqueue(t) {
     if (this.isReady) {
-      this.processor(e);
+      this.processor(t);
       return;
     }
-    this.pending.push(e);
+    this.pending.push(t);
   }
   /**
    * Mark as ready and flush all pending messages
@@ -110,10 +110,10 @@ class ne {
   markReady() {
     if (this.isReady || (this.isReady = !0, this.pending.length === 0))
       return;
-    const e = [...this.pending];
+    const t = [...this.pending];
     this.pending.length = 0;
-    for (const t of e)
-      this.processor(t);
+    for (const e of t)
+      this.processor(e);
   }
   get ready() {
     return this.isReady;
@@ -124,8 +124,8 @@ class ne {
   /**
    * Check if a message of a specific type is pending
    */
-  hasPending(e) {
-    return this.pending.some((t) => t.type === e);
+  hasPending(t) {
+    return this.pending.some((e) => e.type === t);
   }
   /**
    * Clear all pending messages
@@ -134,9 +134,9 @@ class ne {
     this.pending.length = 0;
   }
 }
-class Ze {
-  constructor(e, t) {
-    this.getTarget = e, this.sourceId = `vd-${Math.random().toString(36).slice(2, 8)}`, this.targetOrigin = "*", this.isValid = t?.isValid ?? Ne, this.publisher = new ne((i) => this.post(i)), this.consumer = new ne((i) => this.routeToHandler(i)), t?.bufferIncoming !== !0 && this.consumer.markReady();
+class Zt {
+  constructor(t, e) {
+    this.getTarget = t, this.sourceId = `vd-${Math.random().toString(36).slice(2, 8)}`, this.targetOrigin = "*", this.isValid = e?.isValid ?? Mt, this.publisher = new nt((i) => this.post(i)), this.consumer = new nt((i) => this.routeToHandler(i)), e?.bufferIncoming !== !0 && this.consumer.markReady();
   }
   getTarget;
   handlers = /* @__PURE__ */ new Map();
@@ -149,34 +149,32 @@ class Ze {
   /**
    * Register a handler for a specific message type
    */
-  on(e, t) {
-    this.handlers.set(e, t);
+  on(t, e) {
+    this.handlers.set(t, e);
   }
   /**
    * Update the target origin for outgoing postMessage calls.
    * Use when the target origin is discovered at runtime (e.g. from the first incoming message).
    */
-  setTargetOrigin(e) {
-    this.targetOrigin = e;
+  setTargetOrigin(t) {
+    this.targetOrigin = t;
   }
   /**
    * Send a message to the target window
    * Queued until markReady() is called
    */
-  send(e) {
-    this.publisher.enqueue(e);
+  send(t) {
+    this.publisher.enqueue(t);
   }
+  // For a transport that delivers messages some way other than the iframe
+  // channel this messenger listens on, such as the viewer's live sync channel,
+  // and needs them to land exactly where a postMessage would.
   /**
-   * Feed a message through the same routing path as one that just arrived via
-   * postMessage, without an actual postMessage round-trip: still validated
-   * against `isValid`, and still respects the consumer queue's buffering. For
-   * a transport that delivers messages some
-   * other way than the iframe channel this messenger already listens on (the
-   * viewer engine's SSE-sourced live sync channel, ar-session-handoff) and
-   * needs them to land exactly where a postMessage would.
+   * Route a message as if it had arrived by postMessage, without the round trip.
+   * Still validated against `isValid` and still subject to the consumer queue.
    */
-  receive(e) {
-    this.isValid(e) && this.consumer.enqueue(e);
+  receive(t) {
+    this.isValid(t) && this.consumer.enqueue(t);
   }
   /**
    * Enable sending and flush queued outgoing messages
@@ -194,22 +192,22 @@ class Ze {
   /**
    * Check if an incoming message of a specific type is pending in the consumer buffer
    */
-  consumerHasPending(e) {
-    return this.consumer.hasPending(e);
+  consumerHasPending(t) {
+    return this.consumer.hasPending(t);
   }
   /**
    * Start listening for incoming messages
    */
   start() {
-    this.listener === null && (this.listener = (e) => {
-      const { data: t } = e;
-      if (!this.isValid(t) || t._source === this.sourceId)
+    this.listener === null && (this.listener = (t) => {
+      const { data: e } = t;
+      if (!this.isValid(e) || e._source === this.sourceId)
         return;
       const i = this.getTarget();
-      if (i !== null && e.source !== null && e.source !== i)
+      if (i !== null && t.source !== null && t.source !== i)
         return;
-      const s = t;
-      this.consumer.enqueue(s);
+      const o = e;
+      this.consumer.enqueue(o);
     }, window.addEventListener("message", this.listener));
   }
   /**
@@ -218,38 +216,38 @@ class Ze {
   destroy() {
     this.listener !== null && (window.removeEventListener("message", this.listener), this.listener = null), this.publisher.clear(), this.consumer.clear(), this.handlers.clear();
   }
-  post(e) {
-    const t = this.getTarget();
-    t !== null && t.postMessage({ ...e, _source: this.sourceId }, this.targetOrigin);
+  post(t) {
+    const e = this.getTarget();
+    e !== null && e.postMessage({ ...t, _source: this.sourceId }, this.targetOrigin);
   }
-  routeToHandler(e) {
-    const t = this.handlers.get(e.type);
-    if (t === void 0)
+  routeToHandler(t) {
+    const e = this.handlers.get(t.type);
+    if (e === void 0)
       return;
-    const i = t(e);
-    i instanceof Promise && i.catch((s) => {
-      const o = s instanceof Error ? s.message : String(s);
-      console.error(`Virtualdisplay: error handling ${e.type}: ${o}`);
+    const i = e(t);
+    i instanceof Promise && i.catch((o) => {
+      const s = o instanceof Error ? o.message : String(o);
+      console.error(`Virtualdisplay: error handling ${t.type}: ${s}`);
     });
   }
 }
-class We {
-  constructor(e, t) {
-    this.send = e, this.instance = t;
+class Wt {
+  constructor(t, e) {
+    this.send = t, this.instance = e;
   }
   send;
   instance;
-  setEnabled(e) {
+  setEnabled(t) {
     this.send({
       type: c.ANNOTATION_TOGGLE,
       instance: this.instance,
-      enabled: e
+      enabled: t
     });
   }
 }
-class Ye {
-  constructor(e, t) {
-    this.value = e, this.attribute = t;
+class Qt {
+  constructor(t, e) {
+    this.value = t, this.attribute = e;
   }
   value;
   attribute;
@@ -257,8 +255,8 @@ class Ye {
   get isSelected() {
     return this.isSelectedValue;
   }
-  setSelected(e) {
-    this.isSelectedValue = e;
+  setSelected(t) {
+    this.isSelectedValue = t;
   }
 }
 const A = {
@@ -269,286 +267,286 @@ const A = {
   INVALID_PARAMETER: "INVALID_PARAMETER",
   SNAPSHOT_FAILED: "SNAPSHOT_FAILED"
 };
-class g extends Error {
+class y extends Error {
   code;
-  constructor(e, t) {
-    super(e), this.name = "VirtualdisplayError", this.code = t;
+  constructor(t, e) {
+    super(t), this.name = "VirtualdisplayError", this.code = e;
   }
-  static valueNotFound(e, t) {
-    return new g(
-      `Value "${t}" not found for attribute "${e}"`,
+  static valueNotFound(t, e) {
+    return new y(
+      `Value "${e}" not found for attribute "${t}"`,
       A.VALUE_NOT_FOUND
     );
   }
-  static parentNotFound(e) {
-    return new g(
-      `Parent element not found: ${e}`,
+  static parentNotFound(t) {
+    return new y(
+      `Parent element not found: ${t}`,
       A.PARENT_NOT_FOUND
     );
   }
-  static invalidParameter(e) {
-    return new g(e, A.INVALID_PARAMETER);
+  static invalidParameter(t) {
+    return new y(t, A.INVALID_PARAMETER);
   }
 }
-class Qe {
+class Yt {
   name;
   defaultValue;
   values;
   onSelect;
   onChangeCallback;
-  constructor(e) {
-    this.name = e.name, this.defaultValue = e.defaultValue, this.onSelect = e.onSelect, this.values = this.createValues(e.values);
+  constructor(t) {
+    this.name = t.name, this.defaultValue = t.defaultValue, this.onSelect = t.onSelect, this.values = this.createValues(t.values);
   }
   /**
    * Select a value for this attribute
    * @throws {VirtualdisplayError} When value not found
    */
-  select(e) {
-    if (!this.values.has(e))
-      throw g.valueNotFound(this.name, e);
-    this.onSelect(this.name, e);
+  select(t) {
+    if (!this.values.has(t))
+      throw y.valueNotFound(this.name, t);
+    this.onSelect(this.name, t);
   }
   getValues() {
     return Array.from(this.values.values());
   }
-  getValue(e) {
-    return this.values.get(e);
+  getValue(t) {
+    return this.values.get(t);
   }
   /** The currently selected value, or undefined before any selection lands. */
   get selected() {
-    for (const e of this.values.values())
-      if (e.isSelected)
-        return e.value;
+    for (const t of this.values.values())
+      if (t.isSelected)
+        return t.value;
   }
   /**
    * Register callback that fires when selection changes
    * Receives the newly selected AttributeValue
    */
-  onChange(e) {
-    this.onChangeCallback = e;
+  onChange(t) {
+    this.onChangeCallback = t;
   }
   /**
    * Update selection state from server mutation result
    * Direct value comparison - no source/target translation
    */
-  handleResult(e) {
-    let t;
+  handleResult(t) {
+    let e;
     for (const i of this.values.values()) {
-      const s = i.value === e;
-      i.setSelected(s), s && (t = i);
+      const o = i.value === t;
+      i.setSelected(o), o && (e = i);
     }
-    t !== void 0 && this.onChangeCallback !== void 0 && this.onChangeCallback(t);
+    e !== void 0 && this.onChangeCallback !== void 0 && this.onChangeCallback(e);
   }
-  createValues(e) {
-    const t = /* @__PURE__ */ new Map();
-    for (const i of e) {
-      const s = new Ye(i, this.name);
-      i === this.defaultValue && s.setSelected(!0), t.set(i, s);
+  createValues(t) {
+    const e = /* @__PURE__ */ new Map();
+    for (const i of t) {
+      const o = new Qt(i, this.name);
+      i === this.defaultValue && o.setSelected(!0), e.set(i, o);
     }
-    return t;
+    return e;
   }
 }
-class Ke {
+class Kt {
   attributes = /* @__PURE__ */ new Map();
-  constructor(e, t, i) {
-    for (const s of e) {
-      const o = this.buildOptions(s, t);
-      this.attributes.set(s.name, new Qe(o));
+  constructor(t, e, i) {
+    for (const o of t) {
+      const s = this.buildOptions(o, e);
+      this.attributes.set(o.name, new Yt(s));
     }
     this.onMutationFailed = i;
   }
   onMutationFailed;
-  get(e) {
-    return this.attributes.get(e);
+  get(t) {
+    return this.attributes.get(t);
   }
   /** The current selection as attribute name→value pairs, skipping unset attributes. */
   getSelection() {
-    const e = {};
-    for (const [t, i] of this.attributes) {
-      const s = i.selected;
-      s !== void 0 && (e[t] = s);
+    const t = {};
+    for (const [e, i] of this.attributes) {
+      const o = i.selected;
+      o !== void 0 && (t[e] = o);
     }
-    return e;
+    return t;
   }
-  handleResults(e) {
-    for (const t of e) {
-      if (!t.success) {
-        this.onMutationFailed?.(t.name, t.value);
+  handleResults(t) {
+    for (const e of t) {
+      if (!e.success) {
+        this.onMutationFailed?.(e.name, e.value);
         continue;
       }
-      this.get(t.name)?.handleResult(t.value);
+      this.get(e.name)?.handleResult(e.value);
     }
   }
-  buildOptions(e, t) {
+  buildOptions(t, e) {
     const i = {
-      name: e.name,
-      values: e.values,
-      onSelect: (s, o) => {
-        t([{ name: s, value: o }], !1);
+      name: t.name,
+      values: t.values,
+      onSelect: (o, s) => {
+        e([{ name: o, value: s }], !1);
       }
     };
-    return e.defaultValue !== void 0 ? { ...i, defaultValue: e.defaultValue } : i;
+    return t.defaultValue !== void 0 ? { ...i, defaultValue: t.defaultValue } : i;
   }
 }
-const N = 4096, D = 16384, Xe = [1024, 256, 64], Je = 20, Y = ["timestamp", "level", "msg", "service", "trace_id", "span_id"];
-function et(n) {
-  const e = new Date(n.timestamp).toLocaleTimeString("en-GB", { hour12: !1 }), t = n.level.toUpperCase().padEnd(5), i = n.trace_id?.slice(0, 8) ?? "--------", s = n.msg, o = Object.entries(n).filter(([r]) => !Y.includes(r)).map(([r, a]) => `${r}=${L(a, N).line}`).join(" ");
-  return `${e} ${t} [${i}] ${s}${o ? " " + o : ""}`;
+const N = 4096, D = 16384, Xt = [1024, 256, 64], Jt = 20, Q = ["timestamp", "level", "msg", "service", "trace_id", "span_id"];
+function te(n) {
+  const t = new Date(n.timestamp).toLocaleTimeString("en-GB", { hour12: !1 }), e = n.level.toUpperCase().padEnd(5), i = n.trace_id?.slice(0, 8) ?? "--------", o = n.msg, s = Object.entries(n).filter(([r]) => !Q.includes(r)).map(([r, a]) => `${r}=${O(a, N).line}`).join(" ");
+  return `${t} ${e} [${i}] ${o}${s ? " " + s : ""}`;
 }
-function tt(n) {
-  for (const s of [N, ...Xe]) {
-    const { line: o, truncated: r } = L(n, s);
+function ee(n) {
+  for (const o of [N, ...Xt]) {
+    const { line: s, truncated: r } = O(n, o);
     if (!r) {
-      if (o.length <= D)
-        return o;
+      if (s.length <= D)
+        return s;
       continue;
     }
-    const { line: a } = L({ ...n, log_truncated: !0 }, s);
+    const { line: a } = O({ ...n, log_truncated: !0 }, o);
     if (a.length <= D)
       return a;
   }
-  const e = Object.keys(n).filter((s) => !Y.includes(s)), t = { ...it(n, Y), log_truncated: !0, log_dropped_count: e.length }, i = L({ ...t, log_dropped_attrs: e.slice(0, Je) }, N);
-  return i.line.length <= D ? i.line : L(t, N).line;
+  const t = Object.keys(n).filter((o) => !Q.includes(o)), e = { ...ie(n, Q), log_truncated: !0, log_dropped_count: t.length }, i = O({ ...e, log_dropped_attrs: t.slice(0, Jt) }, N);
+  return i.line.length <= D ? i.line : O(e, N).line;
 }
-function L(n, e) {
-  const t = [];
+function O(n, t) {
+  const e = [];
   let i = !1;
   return { line: JSON.stringify(n, function(r, a) {
     if (typeof a == "string")
-      return a.length > e && (i = !0), nt(a, e);
+      return a.length > t && (i = !0), ne(a, t);
     if (typeof a == "bigint")
       return a.toString();
     if (typeof a != "object" || a === null)
       return a;
-    for (; t.length > 0 && t.at(-1) !== this; )
-      t.pop();
-    return t.includes(a) ? "[Circular]" : (t.push(a), a);
+    for (; e.length > 0 && e.at(-1) !== this; )
+      e.pop();
+    return e.includes(a) ? "[Circular]" : (e.push(a), a);
   }), truncated: i };
 }
-function nt(n, e) {
-  return n.length <= e ? n : `${n.slice(0, e)}...[truncated ${n.length - e} chars]`;
+function ne(n, t) {
+  return n.length <= t ? n : `${n.slice(0, t)}...[truncated ${n.length - t} chars]`;
 }
-function it(n, e) {
-  const t = {};
-  for (const i of e)
-    n[i] !== void 0 && (t[i] = n[i]);
-  return t;
+function ie(n, t) {
+  const e = {};
+  for (const i of t)
+    n[i] !== void 0 && (e[i] = n[i]);
+  return e;
 }
-function st(n, e) {
-  const t = e ? et(n) : tt(n);
-  n.level === "error" ? console.error(t) : n.level === "warn" ? console.warn(t) : console.log(t);
+function oe(n, t) {
+  const e = t ? te(n) : ee(n);
+  n.level === "error" ? console.error(e) : n.level === "warn" ? console.warn(e) : console.log(e);
 }
-function fe(n, e = 0) {
-  const t = {
+function ft(n, t = 0) {
+  const e = {
     name: n.name,
     message: n.message
   };
-  n.stack !== void 0 && (t.stack = n.stack);
+  n.stack !== void 0 && (e.stack = n.stack);
   for (const i of Object.getOwnPropertyNames(n)) {
     if (i === "name" || i === "message" || i === "stack" || i === "cause")
       continue;
-    const s = n[i];
-    s !== void 0 && (t[i] = s);
+    const o = n[i];
+    o !== void 0 && (e[i] = o);
   }
-  return n.cause !== void 0 && n.cause !== null && (t.cause = n.cause instanceof Error && e < 5 ? fe(n.cause, e + 1) : String(n.cause)), t;
+  return n.cause !== void 0 && n.cause !== null && (e.cause = n.cause instanceof Error && t < 5 ? ft(n.cause, t + 1) : String(n.cause)), e;
 }
-function ot(n) {
-  const e = {};
-  for (const [t, i] of Object.entries(n))
-    e[t] = i instanceof Error ? fe(i) : i;
-  return e;
+function se(n) {
+  const t = {};
+  for (const [e, i] of Object.entries(n))
+    t[e] = i instanceof Error ? ft(i) : i;
+  return t;
 }
-function rt() {
+function re() {
   return /* @__PURE__ */ new Date();
 }
-function at(n) {
+function ae(n) {
   return n.toISOString();
 }
-function ge() {
+function gt() {
   return typeof navigator > "u" ? "" : navigator.userAgent;
 }
-function lt() {
+function le() {
   return typeof navigator > "u" ? !1 : navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1;
 }
-function ct() {
-  return /iPhone|iPad|iPod/i.test(ge()) || lt();
+function ce() {
+  return /iPhone|iPad|iPod/i.test(gt()) || le();
 }
-function ut() {
-  return /Android/i.test(ge());
+function de() {
+  return /Android/i.test(gt());
 }
-function dt() {
-  return ct() || ut();
+function ue() {
+  return ce() || de();
 }
-class ht {
-  constructor(e) {
-    this.config = e;
+class he {
+  constructor(t) {
+    this.config = t;
   }
   config;
   /**
    * Log at specified level with optional attributes.
    */
-  log(e, t, i = {}) {
-    const s = this.config.traceProvider?.() ?? {}, o = {
-      timestamp: at(rt()),
-      level: e,
-      msg: t,
+  log(t, e, i = {}) {
+    const o = this.config.traceProvider?.() ?? {}, s = {
+      timestamp: ae(re()),
+      level: t,
+      msg: e,
       service: this.config.service,
-      ...s,
-      ...ot(i)
+      ...o,
+      ...se(i)
     };
-    st(o, this.config.isDev);
+    oe(s, this.config.isDev);
   }
   /**
    * Log at DEBUG level (development only).
    */
-  debug(e, t) {
-    this.config.isDev && this.log("debug", e, t);
+  debug(t, e) {
+    this.config.isDev && this.log("debug", t, e);
   }
   /**
    * Log at INFO level.
    */
-  info(e, t) {
-    this.log("info", e, t);
+  info(t, e) {
+    this.log("info", t, e);
   }
   /**
    * Log at WARN level.
    */
-  warn(e, t) {
-    this.log("warn", e, t);
+  warn(t, e) {
+    this.log("warn", t, e);
   }
   /**
    * Log at ERROR level.
    */
-  error(e, t) {
-    this.log("error", e, t);
+  error(t, e) {
+    this.log("error", t, e);
   }
 }
-function be(n, e) {
-  const t = e?.isDev !== void 0 ? e.isDev : typeof process < "u" ? process.env.NODE_ENV !== "production" : !0;
-  return new ht({ service: n, isDev: t, traceProvider: e?.traceProvider });
+function bt(n, t) {
+  const e = t?.isDev !== void 0 ? t.isDev : typeof process < "u" ? process.env.NODE_ENV !== "production" : !0;
+  return new he({ service: n, isDev: e, traceProvider: t?.traceProvider });
 }
-function O(n) {
+function M(n) {
   if (n !== void 0)
     return typeof n == "object" && n !== null && !Array.isArray(n) && !(n instanceof Error) ? n : n instanceof Error ? { error: n.message } : { value: n };
 }
-function ve(n) {
+function vt(n) {
   return {
-    debug: (e, t) => n.debug(e, O(t)),
-    info: (e, t) => n.info(e, O(t)),
-    warn: (e, t) => n.warn(e, O(t)),
-    error: (e, t) => n.error(e, O(t))
+    debug: (t, e) => n.debug(t, M(e)),
+    info: (t, e) => n.info(t, M(e)),
+    warn: (t, e) => n.warn(t, M(e)),
+    error: (t, e) => n.error(t, M(e))
   };
 }
-let ye = !1, C = ve(be("client", { isDev: !1 }));
-function mt() {
-  ye = !0, C = ve(be("client", { isDev: !0 }));
+let yt = !1, k = vt(bt("client", { isDev: !1 }));
+function pe() {
+  yt = !0, k = vt(bt("client", { isDev: !0 }));
 }
-function gs() {
-  return ye;
+function Co() {
+  return yt;
 }
-class pt {
-  constructor(e, t, i) {
-    this.send = e, this.instance = t, this.onMutationFailed = i;
+class me {
+  constructor(t, e, i) {
+    this.send = t, this.instance = e, this.onMutationFailed = i;
   }
   send;
   instance;
@@ -558,25 +556,25 @@ class pt {
   /**
    * Handle incoming MAPPING message from server
    */
-  handleMappingReceived(e) {
-    C.debug("Initializing from server mapping", {
-      attributeCount: e.attributes.length
-    }), this.registry = new Ke(
-      e.attributes,
-      (t, i) => this.sendMutation(t, i),
+  handleMappingReceived(t) {
+    k.debug("Initializing from server mapping", {
+      attributeCount: t.attributes.length
+    }), this.registry = new Kt(
+      t.attributes,
+      (e, i) => this.sendMutation(e, i),
       this.onMutationFailed
     ), this.replayPendingCallbacks();
   }
-  handleMutationResult(e) {
-    this.registry?.handleResults(e.results);
+  handleMutationResult(t) {
+    this.registry?.handleResults(t.results);
   }
   /**
    * Select a value for an attribute - sends mutation to server.
    * Can be called before the mapping arrives — the mutation is sent immediately
    * and the messenger's publisher queue holds it until the iframe is ready.
    */
-  select(e, t) {
-    this.sendMutation([{ name: e, value: t }], !1);
+  select(t, e) {
+    this.sendMutation([{ name: t, value: e }], !1);
   }
   /**
    * A drag's intermediate step (parametric dimensions): the viewer applies it
@@ -586,79 +584,79 @@ class pt {
    * `select()` staying the whole choice API is the spec's own evidence the
    * shape is right, and no integrator has asked for live-follow yet.
    */
-  selectTransient(e, t) {
-    this.sendMutation([{ name: e, value: t }], !1, !0);
+  selectTransient(t, e) {
+    this.sendMutation([{ name: t, value: e }], !1, !0);
   }
-  getValues(e) {
-    return this.registry?.get(e)?.getValues() ?? [];
+  getValues(t) {
+    return this.registry?.get(t)?.getValues() ?? [];
   }
-  getValue(e, t) {
-    return this.registry?.get(e)?.getValue(t);
+  getValue(t, e) {
+    return this.registry?.get(t)?.getValue(e);
   }
   /**
    * Register onChange callback for an attribute.
    * Buffers the callback if the mapping hasn't arrived yet.
    */
-  onChange(e, t) {
+  onChange(t, e) {
     if (this.registry === void 0) {
-      this.pendingCallbacks.push({ name: e, callback: t });
+      this.pendingCallbacks.push({ name: t, callback: e });
       return;
     }
-    const i = this.registry.get(e);
+    const i = this.registry.get(t);
     if (i === void 0) {
-      C.warn(`onChange: attribute "${e}" not found — callback will not fire`);
+      k.warn(`onChange: attribute "${t}" not found — callback will not fire`);
       return;
     }
-    i.onChange(t);
+    i.onChange(e);
   }
-  getAttribute(e) {
-    return this.registry?.get(e);
+  getAttribute(t) {
+    return this.registry?.get(t);
   }
   /** The current selection as attribute name→value pairs, empty before the mapping arrives. */
   getSelection() {
     return this.registry?.getSelection() ?? {};
   }
-  sendMutation(e, t, i = !1) {
-    const s = {
+  sendMutation(t, e, i = !1) {
+    const o = {
       type: c.MUTATION,
       instance: this.instance,
-      mutations: e,
-      isInitial: t,
+      mutations: t,
+      isInitial: e,
       ...i && { transient: !0 }
     };
-    this.send(s);
+    this.send(o);
   }
   replayPendingCallbacks() {
-    for (const { name: e, callback: t } of this.pendingCallbacks) {
-      const i = this.registry?.get(e);
-      i === void 0 && C.warn(`onChange: attribute "${e}" not found — buffered callback will not fire`), i?.onChange(t);
+    for (const { name: t, callback: e } of this.pendingCallbacks) {
+      const i = this.registry?.get(t);
+      i === void 0 && k.warn(`onChange: attribute "${t}" not found — buffered callback will not fire`), i?.onChange(e);
     }
     this.pendingCallbacks.length = 0;
   }
 }
-class ft {
+class fe {
   snapshot;
   callbacks = [];
-  handleSnapshot(e) {
-    this.snapshot = e.attributes;
-    for (const t of this.callbacks)
-      t(e.attributes);
+  handleSnapshot(t) {
+    this.snapshot = t.attributes;
+    for (const e of this.callbacks)
+      e(t.attributes);
   }
-  onChange(e) {
-    this.callbacks.push(e), this.snapshot !== void 0 && e(this.snapshot);
+  onChange(t) {
+    this.callbacks.push(t), this.snapshot !== void 0 && t(this.snapshot);
   }
   /** The selectable values for one attribute, or null when unrestricted. */
-  selectableFor(e) {
-    return this.snapshot?.find((i) => i.name === e)?.selectable ?? null;
+  selectableFor(t) {
+    return this.snapshot?.find((i) => i.name === t)?.selectable ?? null;
   }
   /** The latest snapshot; empty before the viewer has reported anything. */
   get current() {
     return this.snapshot ?? [];
   }
 }
-let gt = class {
-  constructor(e) {
-    this.send = e;
+let ge = class {
+  constructor(t) {
+    this.send = t;
   }
   send;
   commands = [];
@@ -667,24 +665,24 @@ let gt = class {
    * @param degrees - Absolute rotation in degrees (0 = front view)
    * @throws VirtualdisplayError if value is not a finite number
    */
-  rotate(e) {
-    return this.validateFiniteNumber(e, "rotate"), this.commands.push({ action: "rotate", value: e }), this;
+  rotate(t) {
+    return this.validateFiniteNumber(t, "rotate"), this.commands.push({ action: "rotate", value: t }), this;
   }
   /**
    * Tilt camera vertically
    * @param degrees - Absolute tilt in degrees (0 = top view, 90 = horizontal)
    * @throws VirtualdisplayError if value is not a finite number
    */
-  tilt(e) {
-    return this.validateFiniteNumber(e, "tilt"), this.commands.push({ action: "tilt", value: e }), this;
+  tilt(t) {
+    return this.validateFiniteNumber(t, "tilt"), this.commands.push({ action: "tilt", value: t }), this;
   }
   /**
    * Zoom camera
    * @param percentage - Zoom percentage (100 = normal, >100 = zoom in, <100 = zoom out)
    * @throws VirtualdisplayError if value is not a finite number
    */
-  zoom(e) {
-    return this.validateFiniteNumber(e, "zoom"), this.commands.push({ action: "zoom", value: e }), this;
+  zoom(t) {
+    return this.validateFiniteNumber(t, "zoom"), this.commands.push({ action: "zoom", value: t }), this;
   }
   /**
    * Execute accumulated camera commands
@@ -692,19 +690,19 @@ let gt = class {
    */
   set() {
     if (this.commands.length === 0)
-      throw g.invalidParameter(
+      throw y.invalidParameter(
         "No camera commands to execute. Call rotate(), tilt(), or zoom() before set()."
       );
-    const e = {
+    const t = {
       type: c.CAMERA,
       commands: this.commands
     };
-    this.send(e), this.commands = [];
+    this.send(t), this.commands = [];
   }
-  validateFiniteNumber(e, t) {
-    if (!Number.isFinite(e))
-      throw g.invalidParameter(
-        `${t}() requires a finite number, got ${String(e)}`
+  validateFiniteNumber(t, e) {
+    if (!Number.isFinite(t))
+      throw y.invalidParameter(
+        `${e}() requires a finite number, got ${String(t)}`
       );
   }
   /**
@@ -712,14 +710,14 @@ let gt = class {
    * This is not chainable and executes immediately
    */
   reset() {
-    const e = {
+    const t = {
       type: c.CAMERA,
       commands: [{ action: "reset" }]
     };
-    this.send(e);
+    this.send(t);
   }
 };
-class bt {
+class be {
   state;
   limitsState;
   changeCallbacks = [];
@@ -753,8 +751,8 @@ class bt {
    * Also fires when limits are applied via applyLimits() so components
    * can re-evaluate disabled states without a separate callback.
    */
-  onChange(e) {
-    this.changeCallbacks.push(e);
+  onChange(t) {
+    this.changeCallbacks.push(t);
   }
   /**
    * Current camera movement limits (set from CONFIG message).
@@ -767,62 +765,62 @@ class bt {
    * Apply camera limits received from the server CONFIG message.
    * Fires onChange callbacks so button disabled states update immediately.
    */
-  applyLimits(e) {
-    this.limitsState = e;
-    const t = { rotation: this.rotation, tilt: this.tilt, zoom: this.zoom };
+  applyLimits(t) {
+    this.limitsState = t;
+    const e = { rotation: this.rotation, tilt: this.tilt, zoom: this.zoom };
     for (const i of this.changeCallbacks)
-      i(t);
+      i(e);
   }
   /**
    * Handle incoming camera position message from server
    */
-  handlePositionUpdate(e) {
-    this.update(e.transforms);
+  handlePositionUpdate(t) {
+    this.update(t.transforms);
   }
   /**
    * Update camera position from server transforms
    */
-  update(e) {
-    let t = !1;
-    for (const i of e)
+  update(t) {
+    let e = !1;
+    for (const i of t)
       switch (i.type) {
         case "rotation":
-          this.state.rotation = i.value, t = !0;
+          this.state.rotation = i.value, e = !0;
           break;
         case "tilt":
-          this.state.tilt = i.value, t = !0;
+          this.state.tilt = i.value, e = !0;
           break;
         case "zoom":
-          this.state.zoom = i.value, t = !0;
+          this.state.zoom = i.value, e = !0;
           break;
       }
-    if (t) {
+    if (e) {
       const i = {
         rotation: this.rotation,
         tilt: this.tilt,
         zoom: this.zoom
       };
-      for (const s of this.changeCallbacks)
-        s(i);
+      for (const o of this.changeCallbacks)
+        o(i);
     }
   }
 }
-function vt(n, e) {
-  const t = n.filter((o) => yt(o, e));
-  if (t.length === 0)
+function ve(n, t) {
+  const e = n.filter((s) => ye(s, t));
+  if (e.length === 0)
     return;
-  const i = Math.max(...t.map(ie)), s = t.filter((o) => ie(o) === i);
-  return s.length === 1 ? s[0] : void 0;
+  const i = Math.max(...e.map(it)), o = e.filter((s) => it(s) === i);
+  return o.length === 1 ? o[0] : void 0;
 }
-function yt(n, e) {
-  return Object.entries(n.attributes).every(([t, i]) => e[t] === i);
+function ye(n, t) {
+  return Object.entries(n.attributes).every(([e, i]) => t[e] === i);
 }
-function ie(n) {
+function it(n) {
   return Object.keys(n.attributes).length;
 }
-class St {
-  constructor(e, t) {
-    this.dispatchChange = e, this.dispatchSubmit = t;
+class we {
+  constructor(t, e) {
+    this.dispatchChange = t, this.dispatchSubmit = e;
   }
   dispatchChange;
   dispatchSubmit;
@@ -847,9 +845,9 @@ class St {
    * it says, so the CTA does not render.
    */
   get buttonLabel() {
-    const e = this.pricing?.buttonLabel;
-    if (e != null && e !== "")
-      return e;
+    const t = this.pricing?.buttonLabel;
+    if (t != null && t !== "")
+      return t;
     if (this.submitDefaultLabel !== void 0 && this.submitDefaultLabel !== "")
       return this.submitDefaultLabel;
   }
@@ -874,16 +872,16 @@ class St {
    * Subscribe to configuration changes. Fires after every selection change with
    * the resolved configuration, including undefined when nothing matches.
    */
-  onChange(e) {
-    this.changeCallbacks.push(e);
+  onChange(t) {
+    this.changeCallbacks.push(t);
   }
   /**
    * Register the submit handler the CTA hands the configuration to. Registering
    * one is what switches the button on (capability driven). `defaultLabel` fills
    * in when the customer authored no button label.
    */
-  onSubmit(e, t) {
-    this.submitCallback = e, this.submitDefaultLabel = t?.defaultLabel, this.notifyRender();
+  onSubmit(t, e) {
+    this.submitCallback = t, this.submitDefaultLabel = e?.defaultLabel, this.notifyRender();
   }
   /**
    * Subscribe the built-in UI to re-render the price + CTA. Fires on every
@@ -891,10 +889,10 @@ class St {
    * on without a configuration change). Separate from `onChange`, which stays the
    * host-facing, mutation-driven contract. Returns a disposer.
    */
-  onRender(e) {
-    return this.renderCallbacks.push(e), () => {
-      const t = this.renderCallbacks.indexOf(e);
-      t !== -1 && this.renderCallbacks.splice(t, 1);
+  onRender(t) {
+    return this.renderCallbacks.push(t), () => {
+      const e = this.renderCallbacks.indexOf(t);
+      e !== -1 && this.renderCallbacks.splice(e, 1);
     };
   }
   /**
@@ -906,44 +904,44 @@ class St {
   async submit() {
     if (!this.submittable)
       return;
-    const e = this.resolved !== void 0 ? { attributes: this.resolved.attributes, reference: this.resolved.reference } : { attributes: { ...this.selection }, reference: "" };
-    this.dispatchSubmit(e), await this.submitCallback?.(e);
+    const t = this.resolved !== void 0 ? { attributes: this.resolved.attributes, reference: this.resolved.reference } : { attributes: { ...this.selection }, reference: "" };
+    this.dispatchSubmit(t), await this.submitCallback?.(t);
   }
   /** Called by the client when a PRICING message arrives from the viewer. */
-  handlePricingReceived(e) {
-    this.pricing = e, this.recompute();
+  handlePricingReceived(t) {
+    this.pricing = t, this.recompute();
   }
   /** Called by the client after every mutation result, with the full selection. */
-  handleSelectionChanged(e) {
-    this.selection = e, this.recompute();
+  handleSelectionChanged(t) {
+    this.selection = t, this.recompute();
   }
   recompute() {
     this.resolved = this.resolve();
-    for (const e of this.changeCallbacks)
-      e(this.resolved);
+    for (const t of this.changeCallbacks)
+      t(this.resolved);
     this.dispatchChange(this.resolved), this.notifyRender();
   }
   notifyRender() {
-    for (const e of this.renderCallbacks)
-      e();
+    for (const t of this.renderCallbacks)
+      t();
   }
   resolve() {
     if (this.pricing === void 0)
       return;
-    const e = vt(this.pricing.rules, this.selection);
-    if (!(e === void 0 || e.availability === Le.HIDDEN))
+    const t = ve(this.pricing.rules, this.selection);
+    if (!(t === void 0 || t.availability === Ot.HIDDEN))
       return {
         attributes: { ...this.selection },
-        reference: e.reference,
-        price: e.priceCents,
+        reference: t.reference,
+        price: t.priceCents,
         currency: this.pricing.currency,
-        availability: e.availability
+        availability: t.availability
       };
   }
 }
-class wt {
-  constructor(e, t, i) {
-    this.send = e, this.dispatch = t, this.instance = i;
+class Se {
+  constructor(t, e, i) {
+    this.send = t, this.dispatch = e, this.instance = i;
   }
   send;
   dispatch;
@@ -959,41 +957,41 @@ class wt {
    * Focus a component by name. Sends a focus message to the viewer.
    * @throws VirtualdisplayError if component is not a non-empty string
    */
-  set(e) {
-    if (typeof e != "string" || e.length === 0)
-      throw g.invalidParameter(
-        `set() requires a non-empty component name, got ${String(e)}`
+  set(t) {
+    if (typeof t != "string" || t.length === 0)
+      throw y.invalidParameter(
+        `set() requires a non-empty component name, got ${String(t)}`
       );
     this.send({
       type: c.FOCUS,
       instance: this.instance,
-      action: te.FOCUS,
-      component: e
+      action: et.FOCUS,
+      component: t
     });
   }
   /** Return to the overview — unfocus the current component. */
   clear() {
-    this.send({ type: c.FOCUS, instance: this.instance, action: te.UNFOCUS });
+    this.send({ type: c.FOCUS, instance: this.instance, action: et.UNFOCUS });
   }
   /**
    * Subscribe to focus changes. The callback fires with the focus state when a
    * component is focused, and with null when returning to overview.
    */
-  onChange(e) {
-    this.changeCallbacks.push(e);
+  onChange(t) {
+    this.changeCallbacks.push(t);
   }
   /** Called by the client when a FocusStateMessage is received from the viewer. */
-  handleStateReceived(e) {
-    e.state === Ie.FOCUSED && e.component !== void 0 ? (this.focused = e.component, this.attributes = e.attributes ?? []) : (this.focused = null, this.attributes = []);
-    const t = this.focused !== null ? { component: this.focused, attributes: this.attributes } : null;
+  handleStateReceived(t) {
+    t.state === It.FOCUSED && t.component !== void 0 ? (this.focused = t.component, this.attributes = t.attributes ?? []) : (this.focused = null, this.attributes = []);
+    const e = this.focused !== null ? { component: this.focused, attributes: this.attributes } : null;
     for (const i of this.changeCallbacks)
-      i(t);
-    this.dispatch(t);
+      i(e);
+    this.dispatch(e);
   }
 }
-class Ct {
-  constructor(e) {
-    this.filename = e;
+class ke {
+  constructor(t) {
+    this.filename = t;
   }
   filename;
   developedCallbacks = /* @__PURE__ */ new Set();
@@ -1008,8 +1006,8 @@ class Ct {
    * @param callback Function to call with photo data
    * @returns This Photo instance for chaining
    */
-  onDeveloped(e) {
-    return this.developed && this.photoData !== null ? (e(this.photoData), this) : (this.developedCallbacks.add(e), this);
+  onDeveloped(t) {
+    return this.developed && this.photoData !== null ? (t(this.photoData), this) : (this.developedCallbacks.add(t), this);
   }
   /**
    * Register a callback for when the photo capture fails
@@ -1017,8 +1015,8 @@ class Ct {
    * @param callback Function to call with error
    * @returns This Photo instance for chaining
    */
-  onError(e) {
-    return this.errorCallbacks.add(e), this;
+  onError(t) {
+    return this.errorCallbacks.add(t), this;
   }
   /**
    * Get the filename for this photo
@@ -1030,24 +1028,24 @@ class Ct {
    * Mark the photo as developed and notify all callbacks
    * This method is called by Snapshot when the photo data arrives from the server
    */
-  develop(e) {
-    this.developed || this.failed || (this.photoData = e, this.developed = !0, this.developedCallbacks.forEach((t) => {
-      t(this.photoData);
+  develop(t) {
+    this.developed || this.failed || (this.photoData = t, this.developed = !0, this.developedCallbacks.forEach((e) => {
+      e(this.photoData);
     }), this.developedCallbacks.clear(), this.errorCallbacks.clear());
   }
   /**
    * Mark the photo as failed and notify error callbacks
    */
-  fail(e) {
-    this.developed || this.failed || (this.failed = !0, this.errorCallbacks.forEach((t) => {
-      t(e);
+  fail(t) {
+    this.developed || this.failed || (this.failed = !0, this.errorCallbacks.forEach((e) => {
+      e(t);
     }), this.developedCallbacks.clear(), this.errorCallbacks.clear());
   }
 }
-const se = 3e4;
-class kt {
-  constructor(e) {
-    this.send = e;
+const ot = 3e4;
+class Ce {
+  constructor(t) {
+    this.send = t;
   }
   send;
   validExtensions = [".png"];
@@ -1059,39 +1057,39 @@ class kt {
    * @returns Photo object for registering callbacks
    * @throws VirtualdisplayError if filename is invalid
    */
-  take(e) {
-    this.validateFilename(e), C.debug("Taking snapshot", { filename: e });
-    const t = new Ct(e), i = setTimeout(() => {
-      this.pendingPhotos.delete(e), C.warn("Snapshot timed out", { filename: e }), t.fail(new g(
-        `Snapshot timed out: the viewer did not respond within ${se}ms`,
+  take(t) {
+    this.validateFilename(t), k.debug("Taking snapshot", { filename: t });
+    const e = new ke(t), i = setTimeout(() => {
+      this.pendingPhotos.delete(t), k.warn("Snapshot timed out", { filename: t }), e.fail(new y(
+        `Snapshot timed out: the viewer did not respond within ${ot}ms`,
         A.SNAPSHOT_FAILED
       ));
-    }, se);
-    return this.pendingPhotos.set(e, { photo: t, timeout: i }), this.send({
+    }, ot);
+    return this.pendingPhotos.set(t, { photo: e, timeout: i }), this.send({
       type: c.SNAPSHOT,
-      filename: e
-    }), t;
+      filename: t
+    }), e;
   }
   /**
    * Handle incoming snapshot result from server
    * Matches the message to a pending photo by filename, then develops or fails it
    */
-  handleSnapshotResult(e) {
-    const t = this.pendingPhotos.get(e.filename);
-    if (t === void 0) {
-      C.warn("No pending photo found for filename", {
-        filename: e.filename,
+  handleSnapshotResult(t) {
+    const e = this.pendingPhotos.get(t.filename);
+    if (e === void 0) {
+      k.warn("No pending photo found for filename", {
+        filename: t.filename,
         pendingFilenames: Array.from(this.pendingPhotos.keys())
       });
       return;
     }
-    clearTimeout(t.timeout), this.pendingPhotos.delete(e.filename);
-    const { photo: i } = t;
-    if (e.error !== void 0) {
-      i.fail(new g(e.error, A.SNAPSHOT_FAILED));
+    clearTimeout(e.timeout), this.pendingPhotos.delete(t.filename);
+    const { photo: i } = e;
+    if (t.error !== void 0) {
+      i.fail(new y(t.error, A.SNAPSHOT_FAILED));
       return;
     }
-    e.data !== void 0 && i.develop({ filename: e.filename, data: e.data });
+    t.data !== void 0 && i.develop({ filename: t.filename, data: t.data });
   }
   /**
    * Fail any pending photos and forget them. Called from client destroy
@@ -1101,664 +1099,688 @@ class kt {
   clear() {
     if (this.pendingPhotos.size === 0)
       return;
-    const e = new g(
+    const t = new y(
       "Client destroyed before snapshot completed",
       A.SNAPSHOT_FAILED
     );
-    for (const { photo: t, timeout: i } of this.pendingPhotos.values())
-      clearTimeout(i), t.fail(e);
+    for (const { photo: e, timeout: i } of this.pendingPhotos.values())
+      clearTimeout(i), e.fail(t);
     this.pendingPhotos.clear();
   }
   /**
    * Validate filename has a valid image extension
    */
-  validateFilename(e) {
-    if (e === "" || typeof e != "string")
-      throw new g(
+  validateFilename(t) {
+    if (t === "" || typeof t != "string")
+      throw new y(
         "Filename must be a non-empty string",
         A.INVALID_PARAMETER
       );
     if (!this.validExtensions.some(
-      (i) => e.toLowerCase().endsWith(i)
+      (i) => t.toLowerCase().endsWith(i)
     ))
-      throw new g(
-        `Invalid filename: "${e}". Filename must end with one of: ${this.validExtensions.join(", ")}`,
+      throw new y(
+        `Invalid filename: "${t}". Filename must end with one of: ${this.validExtensions.join(", ")}`,
         A.INVALID_PARAMETER
       );
-    if (e.includes("..") || e.includes("/") || e.includes("\\"))
-      throw new g(
+    if (t.includes("..") || t.includes("/") || t.includes("\\"))
+      throw new y(
         'Filename cannot contain path separators or ".."',
         A.INVALID_PARAMETER
       );
   }
 }
-class _t {
+class _e {
   container = null;
-  attach(e) {
-    this.container = e;
+  attach(t) {
+    this.container = t;
   }
-  dispatch(e, t, i = !1) {
-    const s = new CustomEvent(e, { detail: t, cancelable: i });
-    return this.container?.dispatchEvent(s), s;
+  dispatch(t, e, i = !1) {
+    const o = new CustomEvent(t, { detail: e, cancelable: i });
+    return this.container?.dispatchEvent(o), o;
   }
-  on(e, t) {
-    const i = (s) => {
-      const o = s, r = { ...o.detail, preventDefault: () => {
-        o.preventDefault();
+  on(t, e) {
+    const i = (o) => {
+      const s = o, r = { ...s.detail, preventDefault: () => {
+        s.preventDefault();
       } };
-      t(r);
+      e(r);
     };
-    return this.container?.addEventListener(e, i), () => {
-      this.container?.removeEventListener(e, i);
+    return this.container?.addEventListener(t, i), () => {
+      this.container?.removeEventListener(t, i);
     };
   }
 }
-const At = {}, Et = "en", Se = (
+const Ae = {}, Ee = "en", wt = (
   /** @type {const} */
   ["en", "nl", "de"]
 ), X = [
   "baseLocale"
-], oe = [], Q = typeof window > "u";
+], st = [], Y = typeof window > "u";
 globalThis.__paraglide = /** @type {any} */
 globalThis.__paraglide ?? {};
 globalThis.__paraglide.ssr = /** @type {any} */
 globalThis.__paraglide.ssr ?? {};
-let re = !1, m = () => {
+let rt = !1, p = () => {
   let n = X;
-  !Q && typeof window < "u" && window.location?.href && (n = Ce(window.location.href));
-  const e = xt(n);
-  if (e)
-    return re || (re = !0, we(e, { reload: !1 })), e;
+  !Y && typeof window < "u" && window.location?.href && (n = kt(window.location.href));
+  const t = xe(n);
+  if (t)
+    return rt || (rt = !0, St(t, { reload: !1 })), t;
   throw new Error("No locale found. Read the docs https://paraglidejs.com/errors#no-locale-found");
 };
-function xt(n, e) {
-  let t;
+function xe(n, t) {
+  let e;
   for (const i of n) {
     if (i === "baseLocale")
-      t = Et;
-    else if (ke(i) && M.has(i)) {
-      const o = M.get(i);
-      if (o) {
-        const r = o.getLocale();
+      e = Ee;
+    else if (Ct(i) && z.has(i)) {
+      const s = z.get(i);
+      if (s) {
+        const r = s.getLocale();
         if (r instanceof Promise)
           continue;
         if (r !== void 0)
-          return It(r);
+          return Ie(r);
       }
     }
-    const s = J(t);
-    if (s)
-      return s;
+    const o = J(e);
+    if (o)
+      return o;
   }
 }
-const Tt = (n) => {
+const Te = (n) => {
   window.location.reload();
 };
-let we = (n, e) => {
-  const t = {
+let St = (n, t) => {
+  const e = {
     reload: !0,
-    ...e
+    ...t
   };
   let i;
   try {
-    i = m();
+    i = p();
   } catch {
   }
-  const s = [];
-  let o = X;
-  !Q && typeof window < "u" && window.location?.href && (o = Ce(window.location.href));
-  for (const a of o)
-    if (a !== "baseLocale" && ke(a) && M.has(a)) {
-      const u = M.get(a);
-      if (u) {
-        let d = u.setLocale(n);
-        d instanceof Promise && (d = d.catch((f) => {
+  const o = [];
+  let s = X;
+  !Y && typeof window < "u" && window.location?.href && (s = kt(window.location.href));
+  for (const a of s)
+    if (a !== "baseLocale" && Ct(a) && z.has(a)) {
+      const d = z.get(a);
+      if (d) {
+        let u = d.setLocale(n);
+        u instanceof Promise && (u = u.catch((f) => {
           throw new Error(`Custom strategy "${a}" setLocale failed.`, {
             cause: f
           });
-        }), s.push(d));
+        }), o.push(u));
       }
     }
   const r = () => {
-    !Q && t.reload && window.location && n !== i && Tt();
+    !Y && e.reload && window.location && n !== i && Te();
   };
-  if (s.length)
-    return Promise.all(s).then(() => {
+  if (o.length)
+    return Promise.all(o).then(() => {
       r();
     });
   r();
-}, Rt = () => typeof window < "u" ? window.location.origin : "http://fallback.com";
+}, Re = () => typeof window < "u" ? window.location.origin : "http://fallback.com";
 function J(n) {
   if (typeof n != "string")
     return;
-  const e = n.toLowerCase();
-  for (const t of Se)
-    if (t.toLowerCase() === e)
-      return t;
+  const t = n.toLowerCase();
+  for (const e of wt)
+    if (e.toLowerCase() === t)
+      return e;
 }
-function It(n) {
-  const e = J(n);
-  if (e)
-    return e;
-  throw new Error(`Invalid locale: ${n}. Expected one of: ${Se.join(", ")}`);
+function Ie(n) {
+  const t = J(n);
+  if (t)
+    return t;
+  throw new Error(`Invalid locale: ${n}. Expected one of: ${wt.join(", ")}`);
 }
-function Lt(n) {
-  return Ot(n);
+function Oe(n) {
+  return Le(n);
 }
-function Ot(n) {
-  const e = typeof n == "string" ? new URL(n, Rt()) : new URL(n), t = e.pathname.split("/").filter(Boolean);
-  return t.length > 0 && J(t[0]) && (e.pathname = "/" + t.slice(1).join("/")), e;
+function Le(n) {
+  const t = typeof n == "string" ? new URL(n, Re()) : new URL(n), e = t.pathname.split("/").filter(Boolean);
+  return e.length > 0 && J(e[0]) && (t.pathname = "/" + e.slice(1).join("/")), t;
 }
-let ae, le;
-function Nt(n) {
-  if (oe.length === 0)
+let at, lt;
+function Me(n) {
+  if (st.length === 0)
     return;
-  const e = typeof n == "string" ? n : n.href;
-  if (ae === e)
-    return le;
-  const t = new URL(e, "http://example.com"), i = Lt(t), s = i.href === t.href ? [t] : [t, i];
-  let o;
-  for (const r of s) {
-    for (const a of oe)
-      if (new At(a.match, r.href).exec(r.href)) {
-        o = a;
+  const t = typeof n == "string" ? n : n.href;
+  if (at === t)
+    return lt;
+  const e = new URL(t, "http://example.com"), i = Oe(e), o = i.href === e.href ? [e] : [e, i];
+  let s;
+  for (const r of o) {
+    for (const a of st)
+      if (new Ae(a.match, r.href).exec(r.href)) {
+        s = a;
         break;
       }
-    if (o)
+    if (s)
       break;
   }
-  return ae = e, le = o, o;
+  return at = t, lt = s, s;
 }
-function Ce(n) {
-  const e = Nt(n);
-  return e && e.exclude !== !0 && Array.isArray(e.strategy) ? e.strategy : X;
+function kt(n) {
+  const t = Me(n);
+  return t && t.exclude !== !0 && Array.isArray(t.strategy) ? t.strategy : X;
 }
-const M = /* @__PURE__ */ new Map();
-function ke(n) {
+const z = /* @__PURE__ */ new Map();
+function Ct(n) {
   return typeof n == "string" && /^custom-[A-Za-z0-9_-]+$/.test(n);
 }
-const Mt = (
+const Ne = (
   /** @type {(inputs: Controls_Ar_Buttonlabel1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Activate AR"
   )
-), zt = (
+), ze = (
   /** @type {(inputs: Controls_Ar_Buttonlabel1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "AR activeren"
   )
-), Pt = (
+), Pe = (
   /** @type {(inputs: Controls_Ar_Buttonlabel1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "AR aktivieren"
   )
-), Ft = (
+), Fe = (
   /** @type {((inputs?: Controls_Ar_Buttonlabel1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Ar_Buttonlabel1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? zt() : t === "de" ? Pt() : Mt();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? ze() : e === "de" ? Pe() : Ne();
   })
-), Dt = (
+), De = (
   /** @type {(inputs: Controls_Qr_Modaltitle1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Scan to view in AR"
   )
-), $t = (
+), $e = (
   /** @type {(inputs: Controls_Qr_Modaltitle1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Scan om in AR te bekijken"
   )
-), Ut = (
+), Be = (
   /** @type {(inputs: Controls_Qr_Modaltitle1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Scannen für AR-Ansicht"
   )
-), Bt = (
+), Ue = (
   /** @type {((inputs?: Controls_Qr_Modaltitle1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Qr_Modaltitle1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? $t() : t === "de" ? Ut() : Dt();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? $e() : e === "de" ? Be() : De();
   })
-), Vt = (
+), Ve = (
   /** @type {(inputs: Controls_Qr_Modaldescription1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Use your smartphone camera to scan this QR code"
   )
-), jt = (
+), je = (
   /** @type {(inputs: Controls_Qr_Modaldescription1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Gebruik de camera van je smartphone om deze QR-code te scannen"
   )
-), Ht = (
+), He = (
   /** @type {(inputs: Controls_Qr_Modaldescription1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Verwende die Kamera deines Smartphones, um diesen QR-Code zu scannen"
   )
-), qt = (
+), qe = (
   /** @type {((inputs?: Controls_Qr_Modaldescription1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Qr_Modaldescription1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? jt() : t === "de" ? Ht() : Vt();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? je() : e === "de" ? He() : Ve();
   })
-), Gt = (
+), Ge = (
   /** @type {(inputs: Controls_Qr_Modalinstructions1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Your phone will open the 3D model in AR mode."
   )
-), Zt = (
+), Ze = (
   /** @type {(inputs: Controls_Qr_Modalinstructions1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Je telefoon opent het 3D-model in AR-modus."
   )
-), Wt = (
+), We = (
   /** @type {(inputs: Controls_Qr_Modalinstructions1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Dein Telefon öffnet das 3D-Modell im AR-Modus."
   )
-), Yt = (
+), Qe = (
   /** @type {((inputs?: Controls_Qr_Modalinstructions1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Qr_Modalinstructions1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? Zt() : t === "de" ? Wt() : Gt();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? Ze() : e === "de" ? We() : Ge();
   })
-), Qt = (
+), Ye = (
   /** @type {(inputs: Controls_Qr_Closebutton1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Close"
   )
-), Kt = (
+), Ke = (
   /** @type {(inputs: Controls_Qr_Closebutton1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Sluiten"
   )
-), Xt = (
+), Xe = (
   /** @type {(inputs: Controls_Qr_Closebutton1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Schließen"
   )
-), Jt = (
+), Je = (
   /** @type {((inputs?: Controls_Qr_Closebutton1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Qr_Closebutton1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? Kt() : t === "de" ? Xt() : Qt();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? Ke() : e === "de" ? Xe() : Ye();
   })
+), tn = (
+  /** @type {(inputs: Controls_Annotations_Buttonlabel1Inputs) => LocalizedString} */
+  () => (
+    /** @type {LocalizedString} */
+    "Annotations"
+  )
 ), en = (
+  /** @type {(inputs: Controls_Annotations_Buttonlabel1Inputs) => LocalizedString} */
+  () => (
+    /** @type {LocalizedString} */
+    "Annotaties"
+  )
+), nn = (
+  /** @type {(inputs: Controls_Annotations_Buttonlabel1Inputs) => LocalizedString} */
+  () => (
+    /** @type {LocalizedString} */
+    "Anmerkungen"
+  )
+), on = (
+  /** @type {((inputs?: Controls_Annotations_Buttonlabel1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Annotations_Buttonlabel1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? en() : e === "de" ? nn() : tn();
+  })
+), sn = (
   /** @type {(inputs: Controls_Fullscreen_Buttonlabel1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Fullscreen"
   )
-), tn = (
+), rn = (
   /** @type {(inputs: Controls_Fullscreen_Buttonlabel1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Volledig scherm"
   )
-), nn = (
+), an = (
   /** @type {(inputs: Controls_Fullscreen_Buttonlabel1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Vollbild"
   )
-), sn = (
+), ln = (
   /** @type {((inputs?: Controls_Fullscreen_Buttonlabel1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Fullscreen_Buttonlabel1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? tn() : t === "de" ? nn() : en();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? rn() : e === "de" ? an() : sn();
   })
-), on = (
+), cn = (
   /** @type {(inputs: Loading_Downloadingshort1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Downloading"
   )
-), rn = (
+), dn = (
   /** @type {(inputs: Loading_Downloadingshort1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Downloaden"
   )
-), an = (
+), un = (
   /** @type {(inputs: Loading_Downloadingshort1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Herunterladen"
   )
-), ln = (
+), hn = (
   /** @type {((inputs?: Loading_Downloadingshort1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Loading_Downloadingshort1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? rn() : t === "de" ? an() : on();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? dn() : e === "de" ? un() : cn();
   })
-), cn = (
+), pn = (
   /** @type {(inputs: Controls_Screenshot_Buttonlabel1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Screenshot"
   )
-), un = (
+), mn = (
   /** @type {(inputs: Controls_Screenshot_Buttonlabel1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Screenshot"
   )
-), dn = (
+), fn = (
   /** @type {(inputs: Controls_Screenshot_Buttonlabel1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Screenshot"
   )
-), hn = (
+), gn = (
   /** @type {((inputs?: Controls_Screenshot_Buttonlabel1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Screenshot_Buttonlabel1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? un() : t === "de" ? dn() : cn();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? mn() : e === "de" ? fn() : pn();
   })
-), mn = (
+), bn = (
   /** @type {(inputs: Controls_Configurator_OpenInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Configure"
   )
-), pn = (
+), vn = (
   /** @type {(inputs: Controls_Configurator_OpenInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Configureren"
   )
-), fn = (
+), yn = (
   /** @type {(inputs: Controls_Configurator_OpenInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Konfigurieren"
   )
-), gn = (
+), wn = (
   /** @type {((inputs?: Controls_Configurator_OpenInputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Configurator_OpenInputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? pn() : t === "de" ? fn() : mn();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? vn() : e === "de" ? yn() : bn();
   })
-), bn = (
+), Sn = (
   /** @type {(inputs: Controls_Configurator_CloseInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Close"
   )
-), vn = (
+), kn = (
   /** @type {(inputs: Controls_Configurator_CloseInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Sluiten"
   )
-), yn = (
+), Cn = (
   /** @type {(inputs: Controls_Configurator_CloseInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Schließen"
   )
-), Sn = (
+), _n = (
   /** @type {((inputs?: Controls_Configurator_CloseInputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Configurator_CloseInputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? vn() : t === "de" ? yn() : bn();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? kn() : e === "de" ? Cn() : Sn();
   })
-), wn = (
+), An = (
   /** @type {(inputs: Controls_Camera_ResetInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Reset camera"
   )
-), Cn = (
+), En = (
   /** @type {(inputs: Controls_Camera_ResetInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Camera resetten"
   )
-), kn = (
+), xn = (
   /** @type {(inputs: Controls_Camera_ResetInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Kamera zurücksetzen"
   )
-), _n = (
+), Tn = (
   /** @type {((inputs?: Controls_Camera_ResetInputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Camera_ResetInputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? Cn() : t === "de" ? kn() : wn();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? En() : e === "de" ? xn() : An();
   })
-), An = (
+), Rn = (
   /** @type {(inputs: Controls_Camera_Zoomin1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Zoom in"
   )
-), En = (
+), In = (
   /** @type {(inputs: Controls_Camera_Zoomin1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Inzoomen"
   )
-), xn = (
+), On = (
   /** @type {(inputs: Controls_Camera_Zoomin1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Hineinzoomen"
   )
-), Tn = (
+), Ln = (
   /** @type {((inputs?: Controls_Camera_Zoomin1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Camera_Zoomin1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? En() : t === "de" ? xn() : An();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? In() : e === "de" ? On() : Rn();
   })
-), Rn = (
+), Mn = (
   /** @type {(inputs: Controls_Camera_Zoomout1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Zoom out"
   )
-), In = (
+), Nn = (
   /** @type {(inputs: Controls_Camera_Zoomout1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Uitzoomen"
   )
-), Ln = (
+), zn = (
   /** @type {(inputs: Controls_Camera_Zoomout1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Herauszoomen"
   )
-), On = (
+), Pn = (
   /** @type {((inputs?: Controls_Camera_Zoomout1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Camera_Zoomout1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? In() : t === "de" ? Ln() : Rn();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? Nn() : e === "de" ? zn() : Mn();
   })
-), Nn = (
+), Fn = (
   /** @type {(inputs: Controls_Camera_Rotateleft1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Rotate left"
   )
-), Mn = (
+), Dn = (
   /** @type {(inputs: Controls_Camera_Rotateleft1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Naar links draaien"
   )
-), zn = (
+), $n = (
   /** @type {(inputs: Controls_Camera_Rotateleft1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Nach links drehen"
   )
-), Pn = (
+), Bn = (
   /** @type {((inputs?: Controls_Camera_Rotateleft1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Camera_Rotateleft1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? Mn() : t === "de" ? zn() : Nn();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? Dn() : e === "de" ? $n() : Fn();
   })
-), Fn = (
+), Un = (
   /** @type {(inputs: Controls_Camera_Rotateright1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Rotate right"
   )
-), Dn = (
+), Vn = (
   /** @type {(inputs: Controls_Camera_Rotateright1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Naar rechts draaien"
   )
-), $n = (
+), jn = (
   /** @type {(inputs: Controls_Camera_Rotateright1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Nach rechts drehen"
   )
-), Un = (
+), Hn = (
   /** @type {((inputs?: Controls_Camera_Rotateright1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Camera_Rotateright1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? Dn() : t === "de" ? $n() : Fn();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? Vn() : e === "de" ? jn() : Un();
   })
-), Bn = (
+), qn = (
   /** @type {(inputs: Controls_Camera_Tiltup1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Tilt up"
   )
-), Vn = (
+), Gn = (
   /** @type {(inputs: Controls_Camera_Tiltup1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Omhoog kantelen"
   )
-), jn = (
+), Zn = (
   /** @type {(inputs: Controls_Camera_Tiltup1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Nach oben kippen"
   )
-), Hn = (
+), Wn = (
   /** @type {((inputs?: Controls_Camera_Tiltup1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Camera_Tiltup1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? Vn() : t === "de" ? jn() : Bn();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? Gn() : e === "de" ? Zn() : qn();
   })
-), qn = (
+), Qn = (
   /** @type {(inputs: Controls_Camera_Tiltdown1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Tilt down"
   )
-), Gn = (
+), Yn = (
   /** @type {(inputs: Controls_Camera_Tiltdown1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Omlaag kantelen"
   )
-), Zn = (
+), Kn = (
   /** @type {(inputs: Controls_Camera_Tiltdown1Inputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Nach unten kippen"
   )
-), Wn = (
+), Xn = (
   /** @type {((inputs?: Controls_Camera_Tiltdown1Inputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Controls_Camera_Tiltdown1Inputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? Gn() : t === "de" ? Zn() : qn();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? Yn() : e === "de" ? Kn() : Qn();
   })
-), Yn = (
+), Jn = (
   /** @type {(inputs: Commerce_Submit_BusyInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Working…"
   )
-), Qn = (
+), ti = (
   /** @type {(inputs: Commerce_Submit_BusyInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Bezig…"
   )
-), Kn = (
+), ei = (
   /** @type {(inputs: Commerce_Submit_BusyInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Läuft…"
   )
-), Xn = (
+), ni = (
   /** @type {((inputs?: Commerce_Submit_BusyInputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Commerce_Submit_BusyInputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? Qn() : t === "de" ? Kn() : Yn();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? ti() : e === "de" ? ei() : Jn();
   })
-), Jn = (
+), ii = (
   /** @type {(inputs: Commerce_Submit_SuccessInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Done"
   )
-), ei = (
+), oi = (
   /** @type {(inputs: Commerce_Submit_SuccessInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Gelukt"
   )
-), ti = (
+), si = (
   /** @type {(inputs: Commerce_Submit_SuccessInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Fertig"
   )
-), ni = (
+), ri = (
   /** @type {((inputs?: Commerce_Submit_SuccessInputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Commerce_Submit_SuccessInputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? ei() : t === "de" ? ti() : Jn();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? oi() : e === "de" ? si() : ii();
   })
-), ii = (
+), ai = (
   /** @type {(inputs: Commerce_Submit_FailedInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Failed"
   )
-), si = (
+), li = (
   /** @type {(inputs: Commerce_Submit_FailedInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Mislukt"
   )
-), oi = (
+), ci = (
   /** @type {(inputs: Commerce_Submit_FailedInputs) => LocalizedString} */
   () => (
     /** @type {LocalizedString} */
     "Fehlgeschlagen"
   )
-), ri = (
+), di = (
   /** @type {((inputs?: Commerce_Submit_FailedInputs, options?: { locale?: "en" | "nl" | "de" }) => LocalizedString) & import('../runtime.js').MessageMetadata<Commerce_Submit_FailedInputs, { locale?: "en" | "nl" | "de" }, {}>} */
-  ((n = {}, e = {}) => {
-    const t = e.locale ?? m();
-    return t === "nl" ? si() : t === "de" ? oi() : ii();
+  ((n = {}, t = {}) => {
+    const e = t.locale ?? p();
+    return e === "nl" ? li() : e === "de" ? ci() : ai();
   })
 );
-const ai = {
+const ui = {
   xmlns: "http://www.w3.org/2000/svg",
   width: 24,
   height: 24,
@@ -1769,22 +1791,22 @@ const ai = {
   "stroke-linecap": "round",
   "stroke-linejoin": "round"
 };
-const _e = ([n, e, t]) => {
+const _t = ([n, t, e]) => {
   const i = document.createElementNS("http://www.w3.org/2000/svg", n);
-  return Object.keys(e).forEach((s) => {
-    i.setAttribute(s, String(e[s]));
-  }), t?.length && t.forEach((s) => {
-    const o = _e(s);
-    i.appendChild(o);
+  return Object.keys(t).forEach((o) => {
+    i.setAttribute(o, String(t[o]));
+  }), e?.length && e.forEach((o) => {
+    const s = _t(o);
+    i.appendChild(s);
   }), i;
-}, Ae = (n, e = {}) => {
+}, At = (n, t = {}) => {
   const i = {
-    ...ai,
-    ...e
+    ...ui,
+    ...t
   };
-  return _e(["svg", i, n]);
+  return _t(["svg", i, n]);
 };
-const li = [
+const hi = [
   [
     "path",
     {
@@ -1794,7 +1816,7 @@ const li = [
   ["path", { d: "m3.3 7 8.7 5 8.7-5" }],
   ["path", { d: "M12 22V12" }]
 ];
-const ci = [
+const pi = [
   [
     "path",
     {
@@ -1803,27 +1825,48 @@ const ci = [
   ],
   ["circle", { cx: "12", cy: "13", r: "3" }]
 ];
-const Ee = [["path", { d: "m6 9 6 6 6-6" }]];
-const ui = [["path", { d: "m15 18-6-6 6-6" }]];
-const di = [["path", { d: "m9 18 6-6-6-6" }]];
-const hi = [["path", { d: "m18 15-6-6-6 6" }]];
-const mi = [
+const Et = [["path", { d: "m6 9 6 6 6-6" }]];
+const mi = [["path", { d: "m15 18-6-6 6-6" }]];
+const fi = [["path", { d: "m9 18 6-6-6-6" }]];
+const gi = [["path", { d: "m18 15-6-6-6 6" }]];
+const bi = [
+  ["path", { d: "M12.75 7.09a3 3 0 0 1 2.16 2.16" }],
+  [
+    "path",
+    {
+      d: "M17.072 17.072c-1.634 2.17-3.527 3.912-4.471 4.727a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 1.432-4.568"
+    }
+  ],
+  ["path", { d: "m2 2 20 20" }],
+  ["path", { d: "M8.475 2.818A8 8 0 0 1 20 10c0 1.183-.31 2.377-.81 3.533" }],
+  ["path", { d: "M9.13 9.13a3 3 0 0 0 3.74 3.74" }]
+];
+const vi = [
+  [
+    "path",
+    {
+      d: "M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"
+    }
+  ],
+  ["circle", { cx: "12", cy: "10", r: "3" }]
+];
+const yi = [
   ["path", { d: "M15 3h6v6" }],
   ["path", { d: "m21 3-7 7" }],
   ["path", { d: "m3 21 7-7" }],
   ["path", { d: "M9 21H3v-6" }]
 ];
-const pi = [
+const wi = [
   ["path", { d: "m14 10 7-7" }],
   ["path", { d: "M20 10h-6V4" }],
   ["path", { d: "m3 21 7-7" }],
   ["path", { d: "M4 14h6v6" }]
 ];
-const fi = [
+const Si = [
   ["path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }],
   ["path", { d: "M3 3v5h5" }]
 ];
-const gi = [
+const ki = [
   ["path", { d: "M10 5H3" }],
   ["path", { d: "M12 19H3" }],
   ["path", { d: "M14 3v4" }],
@@ -1834,50 +1877,52 @@ const gi = [
   ["path", { d: "M8 10v4" }],
   ["path", { d: "M8 12H3" }]
 ];
-const bi = [
+const Ci = [
   ["path", { d: "M18 6 6 18" }],
   ["path", { d: "m6 6 12 12" }]
 ];
-const vi = [
+const _i = [
   ["circle", { cx: "11", cy: "11", r: "8" }],
   ["line", { x1: "21", x2: "16.65", y1: "21", y2: "16.65" }],
   ["line", { x1: "11", x2: "11", y1: "8", y2: "14" }],
   ["line", { x1: "8", x2: "14", y1: "11", y2: "11" }]
 ];
-const yi = [
+const Ai = [
   ["circle", { cx: "11", cy: "11", r: "8" }],
   ["line", { x1: "21", x2: "16.65", y1: "21", y2: "16.65" }],
   ["line", { x1: "8", x2: "14", y1: "11", y2: "11" }]
 ];
-function y(n, { size: e = 20, strokeWidth: t = 1.75 } = {}) {
-  return Ae(n, { width: e, height: e, "stroke-width": t });
-}
-const b = {
-  ar: (n) => y(li, n),
-  fullscreen: (n) => y(mi, n),
-  exitFullscreen: (n) => y(pi, n),
-  screenshot: (n) => y(ci, n),
-  tiltUp: (n) => y(hi, n),
-  tiltDown: (n) => y(Ee, n),
-  rotateLeft: (n) => y(ui, n),
-  rotateRight: (n) => y(di, n),
-  zoomIn: (n) => y(vi, n),
-  zoomOut: (n) => y(yi, n),
-  reset: (n) => y(fi, n),
-  configurator: (n) => y(gi, n),
-  close: (n) => y(bi, n)
+function b(n, { size: t = 20, strokeWidth: e = 1.75 } = {}) {
+  return At(n, { width: t, height: t, "stroke-width": e });
+}
+const g = {
+  ar: (n) => b(hi, n),
+  annotations: (n) => b(vi, n),
+  annotationsOff: (n) => b(bi, n),
+  fullscreen: (n) => b(yi, n),
+  exitFullscreen: (n) => b(wi, n),
+  screenshot: (n) => b(pi, n),
+  tiltUp: (n) => b(gi, n),
+  tiltDown: (n) => b(Et, n),
+  rotateLeft: (n) => b(mi, n),
+  rotateRight: (n) => b(fi, n),
+  zoomIn: (n) => b(_i, n),
+  zoomOut: (n) => b(Ai, n),
+  reset: (n) => b(Si, n),
+  configurator: (n) => b(ki, n),
+  close: (n) => b(Ci, n)
 };
 class v {
   element;
-  constructor({ variant: e = "default", size: t = "default", label: i, icon: s, onClick: o, disabled: r = !1 } = {}) {
-    this.element = document.createElement("button"), this.element.className = `ui-btn ui-btn--${e} ui-btn--size-${t}`, i !== void 0 && (this.element.setAttribute("aria-label", i), this.element.title = i), s !== void 0 ? this.element.appendChild(s) : i !== void 0 && (this.element.textContent = i), o && this.element.addEventListener("click", o), this.element.disabled = r;
+  constructor({ variant: t = "default", size: e = "default", label: i, icon: o, onClick: s, disabled: r = !1 } = {}) {
+    this.element = document.createElement("button"), this.element.className = `ui-btn ui-btn--${t} ui-btn--size-${e}`, i !== void 0 && (this.element.setAttribute("aria-label", i), this.element.title = i), o !== void 0 ? this.element.appendChild(o) : i !== void 0 && (this.element.textContent = i), s && this.element.addEventListener("click", s), this.element.disabled = r;
   }
-  setIcon(e) {
-    const t = this.element.querySelector("svg");
-    t !== null ? t.replaceWith(e) : this.element.appendChild(e);
+  setIcon(t) {
+    const e = this.element.querySelector("svg");
+    e !== null ? e.replaceWith(t) : this.element.appendChild(t);
   }
 }
-const p = {
+const m = {
   semantic: {
     // eslint-disable-next-line vd-custom/enforce-error-codes -- This is a hex color, not an error code
     error: "#dc2626"
@@ -1911,11 +1956,11 @@ const p = {
   // 32px
   9: "2.25rem"
 };
-class Si {
+class Ei {
   element;
   constructor() {
     this.element = document.createElement("div"), Object.assign(this.element.style, {
-      background: p.white,
+      background: m.white,
       borderRadius: l[3],
       padding: l[6],
       boxShadow: `0 ${l[2]} ${l[8]} oklch(0% 0 0 / 20%)`,
@@ -1924,25 +1969,25 @@ class Si {
     });
   }
 }
-class wi {
-  constructor(e = {}) {
-    this.options = e, this.card = new Si(), this.backdrop = this.createBackdrop(), this.backdrop.appendChild(this.card.element);
+class xi {
+  constructor(t = {}) {
+    this.options = t, this.card = new Ei(), this.backdrop = this.createBackdrop(), this.backdrop.appendChild(this.card.element);
   }
   options;
   card;
   backdrop;
   keyHandler = null;
   open() {
-    document.body.appendChild(this.backdrop), this.keyHandler = (e) => {
-      e.key === "Escape" && this.close();
+    document.body.appendChild(this.backdrop), this.keyHandler = (t) => {
+      t.key === "Escape" && this.close();
     }, document.addEventListener("keydown", this.keyHandler);
   }
   close() {
     this.backdrop.remove(), this.keyHandler !== null && (document.removeEventListener("keydown", this.keyHandler), this.keyHandler = null), this.options.onClose?.();
   }
   createBackdrop() {
-    const e = document.createElement("div");
-    return Object.assign(e.style, {
+    const t = document.createElement("div");
+    return Object.assign(t.style, {
       position: "fixed",
       inset: l[0],
       background: "oklch(0% 0 0 / 50%)",
@@ -1950,75 +1995,75 @@ class wi {
       display: "flex",
       alignItems: "center",
       justifyContent: "center"
-    }), e.addEventListener("click", (t) => {
-      t.target === e && this.close();
-    }), e;
+    }), t.addEventListener("click", (e) => {
+      e.target === t && this.close();
+    }), t;
   }
 }
-class Ci {
+class Ti {
   element;
   selectCallback = null;
-  constructor(e, t, i) {
+  constructor(t, e, i) {
     this.element = document.createElement("div"), this.element.className = "ui-toggle-group";
-    for (let s = 0; s < e.length; s++) {
-      const o = e[s], r = document.createElement("button");
-      r.className = "ui-toggle-group-item", r.dataset.value = o, r.textContent = i?.[s] ?? o, r.dataset.state = o === t ? "on" : "off", r.setAttribute("aria-pressed", o === t ? "true" : "false"), r.addEventListener("click", () => {
-        this.selectCallback?.(o);
+    for (let o = 0; o < t.length; o++) {
+      const s = t[o], r = document.createElement("button");
+      r.className = "ui-toggle-group-item", r.dataset.value = s, r.textContent = i?.[o] ?? s, r.dataset.state = s === e ? "on" : "off", r.setAttribute("aria-pressed", s === e ? "true" : "false"), r.addEventListener("click", () => {
+        this.selectCallback?.(s);
       }), this.element.appendChild(r);
     }
   }
-  setSelected(e) {
-    for (const t of this.element.querySelectorAll(".ui-toggle-group-item")) {
-      const i = t.dataset.value === e;
-      t.dataset.state = i ? "on" : "off", t.setAttribute("aria-pressed", i ? "true" : "false");
+  setSelected(t) {
+    for (const e of this.element.querySelectorAll(".ui-toggle-group-item")) {
+      const i = e.dataset.value === t;
+      e.dataset.state = i ? "on" : "off", e.setAttribute("aria-pressed", i ? "true" : "false");
     }
   }
-  onSelect(e) {
-    this.selectCallback = e;
+  onSelect(t) {
+    this.selectCallback = t;
   }
   /**
    * Enable only the given values; null lifts every restriction. A disabled
    * value stays visible (the buyer sees the option exists) but cannot be
    * picked: the selectable snapshot's "not in the list = grey".
    */
-  setEnabled(e) {
-    for (const t of this.element.querySelectorAll(".ui-toggle-group-item")) {
-      const i = e === null || e.includes(t.dataset.value ?? "");
-      t.disabled = !i, t.setAttribute("aria-disabled", i ? "false" : "true");
+  setEnabled(t) {
+    for (const e of this.element.querySelectorAll(".ui-toggle-group-item")) {
+      const i = t === null || t.includes(e.dataset.value ?? "");
+      e.disabled = !i, e.setAttribute("aria-disabled", i ? "false" : "true");
     }
   }
 }
-class ki {
+class Ri {
   element;
   select;
-  constructor(e, t, i, s, o) {
-    this.select = document.createElement("select"), this.select.className = "ui-native-select", this.select.dataset.name = e, this.select.setAttribute("aria-label", i);
+  constructor(t, e, i, o, s) {
+    this.select = document.createElement("select"), this.select.className = "ui-native-select", this.select.dataset.name = t, this.select.setAttribute("aria-label", i);
     const r = document.createElement("option");
     r.value = "", r.disabled = !0, r.textContent = i, this.select.appendChild(r);
     let a = !1;
-    for (let d = 0; d < t.length; d++) {
-      const f = t[d], h = document.createElement("option");
-      h.value = f, h.textContent = o?.[d] ?? f, f === s && (h.selected = !0, a = !0), this.select.appendChild(h);
+    for (let u = 0; u < e.length; u++) {
+      const f = e[u], h = document.createElement("option");
+      h.value = f, h.textContent = s?.[u] ?? f, f === o && (h.selected = !0, a = !0), this.select.appendChild(h);
     }
     a || (r.selected = !0);
-    const u = Ae(Ee, { width: 16, height: 16, "stroke-width": 2 });
-    u.classList.add("ui-native-select-icon"), this.element = document.createElement("div"), this.element.className = "ui-native-select-wrap", this.element.appendChild(this.select), this.element.appendChild(u);
+    const d = At(Et, { width: 16, height: 16, "stroke-width": 2 });
+    d.classList.add("ui-native-select-icon"), this.element = document.createElement("div"), this.element.className = "ui-native-select-wrap", this.element.appendChild(this.select), this.element.appendChild(d);
   }
-  setSelected(e) {
-    this.select.value = e;
+  setSelected(t) {
+    this.select.value = t;
   }
-  onSelect(e) {
+  onSelect(t) {
     this.select.addEventListener("change", () => {
-      e(this.select.value);
+      t(this.select.value);
     });
   }
   /** Enable only the given values; null lifts every restriction (see ToggleGroup.setEnabled). */
-  setEnabled(e) {
-    for (const t of this.select.options)
-      t.value !== "" && (t.disabled = e !== null && !e.includes(t.value));
+  setEnabled(t) {
+    for (const e of this.select.options)
+      e.value !== "" && (e.disabled = t !== null && !t.includes(e.value));
   }
 }
-class _i {
+class Ii {
   element;
   input;
   valueText;
@@ -2026,64 +2071,64 @@ class _i {
   options;
   selectCallback = null;
   settleCallback = null;
-  constructor(e, t) {
-    if (e.length === 0)
+  constructor(t, e) {
+    if (t.length === 0)
       throw new Error("Virtualdisplay: Slider needs at least one value");
-    this.values = e, this.options = t, this.input = document.createElement("input"), this.input.type = "range", this.input.className = "ui-slider-input", this.input.min = "0", this.input.max = String(e.length - 1), this.input.step = "1", this.input.setAttribute("aria-label", t.label), this.valueText = document.createElement("span"), this.valueText.className = "ui-slider-value", this.valueText.setAttribute("aria-hidden", "true");
+    this.values = t, this.options = e, this.input = document.createElement("input"), this.input.type = "range", this.input.className = "ui-slider-input", this.input.min = "0", this.input.max = String(t.length - 1), this.input.step = "1", this.input.setAttribute("aria-label", e.label), this.valueText = document.createElement("span"), this.valueText.className = "ui-slider-value", this.valueText.setAttribute("aria-hidden", "true");
     const i = document.createElement("div");
     i.className = "ui-slider-track", i.appendChild(this.input), i.appendChild(this.buildEnds()), this.element = document.createElement("div"), this.element.className = "ui-slider", this.element.appendChild(i), this.element.appendChild(this.valueText);
-    const s = t.initialSelected === void 0 ? 0 : e.indexOf(t.initialSelected);
-    this.applyIndex(s === -1 ? 0 : s), this.listen();
+    const o = e.initialSelected === void 0 ? 0 : t.indexOf(e.initialSelected);
+    this.applyIndex(o === -1 ? 0 : o), this.listen();
   }
-  setSelected(e) {
-    const t = this.values.indexOf(e);
-    t !== -1 && this.applyIndex(t);
+  setSelected(t) {
+    const e = this.values.indexOf(t);
+    e !== -1 && this.applyIndex(e);
   }
   /** Fires on every step a drag or keypress crosses, with the value it lands on. */
-  onSelect(e) {
-    this.selectCallback = e;
+  onSelect(t) {
+    this.selectCallback = t;
   }
   /** Fires once per interaction, when the value commits (drag released, key released). */
-  onSettle(e) {
-    this.settleCallback = e;
+  onSettle(t) {
+    this.settleCallback = t;
   }
   listen() {
     this.input.addEventListener("input", () => {
-      const e = this.values[this.currentIndex];
-      e !== void 0 && (this.applyIndex(this.currentIndex), this.selectCallback?.(e));
+      const t = this.values[this.currentIndex];
+      t !== void 0 && (this.applyIndex(this.currentIndex), this.selectCallback?.(t));
     }), this.input.addEventListener("change", () => {
-      const e = this.values[this.currentIndex];
-      e !== void 0 && this.settleCallback?.(e);
+      const t = this.values[this.currentIndex];
+      t !== void 0 && this.settleCallback?.(t);
     });
   }
   get currentIndex() {
     return Number(this.input.value);
   }
-  applyIndex(e) {
-    this.input.value = String(e);
-    const t = this.displayAt(e);
-    this.valueText.textContent = t, this.input.setAttribute("aria-valuetext", t);
-    const i = this.values.length === 1 ? 100 : e / (this.values.length - 1) * 100;
+  applyIndex(t) {
+    this.input.value = String(t);
+    const e = this.displayAt(t);
+    this.valueText.textContent = e, this.input.setAttribute("aria-valuetext", e);
+    const i = this.values.length === 1 ? 100 : t / (this.values.length - 1) * 100;
     this.element.style.setProperty("--ui-slider-pct", `${i}%`);
   }
   buildEnds() {
-    const e = document.createElement("div");
-    e.className = "ui-slider-ends", e.setAttribute("aria-hidden", "true");
-    for (const t of [0, this.values.length - 1]) {
+    const t = document.createElement("div");
+    t.className = "ui-slider-ends", t.setAttribute("aria-hidden", "true");
+    for (const e of [0, this.values.length - 1]) {
       const i = document.createElement("span");
-      i.textContent = this.labelAt(t), e.appendChild(i);
+      i.textContent = this.labelAt(e), t.appendChild(i);
     }
-    return e;
+    return t;
   }
-  labelAt(e) {
-    return this.options.labels?.[e] ?? this.values[e] ?? "";
+  labelAt(t) {
+    return this.options.labels?.[t] ?? this.values[t] ?? "";
   }
-  displayAt(e) {
-    const t = this.labelAt(e);
-    return this.options.unit === void 0 ? t : `${t} ${this.options.unit}`;
+  displayAt(t) {
+    const e = this.labelAt(t);
+    return this.options.unit === void 0 ? e : `${e} ${this.options.unit}`;
   }
 }
-const w = {
+const S = {
   fontFamily: {
     sans: ["Mona Sans", "ui-sans-serif", "system-ui", "sans-serif", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"]
   },
@@ -2100,7 +2145,7 @@ const w = {
     medium: "500",
     semibold: "600"
   }
-}, x = w.fontFamily.sans.join(", "), Ai = `
+}, x = S.fontFamily.sans.join(", "), Oi = `
   --primary: oklch(5% 0 0);
   --primary-foreground: oklch(100% 0 0);
   --secondary: oklch(92% 0 0);
@@ -2113,8 +2158,8 @@ const w = {
   --accent: oklch(92% 0 0);
   --accent-foreground: oklch(5% 0 0);
   --muted-foreground: oklch(44% 0 0);
-`, Ei = `
-:root { ${Ai} }
+`, Li = `
+:root { ${Oi} }
 
 /* ── Button ──────────────────────────────────────────────── */
 .ui-btn {
@@ -2386,6 +2431,11 @@ const w = {
   border: 1px solid var(--border);
   border-radius: var(--radius);
   padding: 0.75rem 1rem;
+  /* The popup is absolutely positioned inside the ~28px marker anchor, so
+     without an explicit width it shrink-to-fits against that anchor and
+     collapses to one word per line. max-content sizes it by its own text,
+     capped below. */
+  inline-size: max-content;
   max-inline-size: 15rem;
   box-shadow: 0 4px 6px oklch(5% 0 0 / 8%), 0 2px 4px oklch(5% 0 0 / 6%);
   pointer-events: auto;
@@ -2393,6 +2443,13 @@ const w = {
 }
 .vd-annotation-popup:focus { outline: none; }
 
+/* Flipped below the marker when the popup would clip the container's top
+   edge; the layer positions it at open time and on the render cadence. */
+.vd-annotation-popup--below {
+  inset-block-end: auto;
+  inset-block-start: calc(100% + 0.5rem);
+}
+
 .vd-annotation-popup-close {
   position: absolute;
   inset-block-start: 0.375rem;
@@ -2429,9 +2486,12 @@ const w = {
   }
 }
 
+/* Opacity only: the layer sets the popup's transform inline to clamp it
+   inside the container, and a keyframe animating transform would override
+   that for its duration and make the popup jump at the end. */
 @keyframes vd-popup-in {
-  from { opacity: 0; transform: translateX(-50%) translateY(4px); }
-  to { opacity: 1; transform: translateX(-50%) translateY(0); }
+  from { opacity: 0; }
+  to { opacity: 1; }
 }
 
 .vd-annotation-popup-title {
@@ -2484,114 +2544,114 @@ const w = {
   50% { opacity: 0.55; }
 }
 `;
-let ce = !1;
-function xe() {
-  if (ce || typeof document > "u")
+let ct = !1;
+function xt() {
+  if (ct || typeof document > "u")
     return;
-  ce = !0;
+  ct = !0;
   const n = document.createElement("style");
-  n.id = "vd-ui-vanilla", n.textContent = Ei, document.head.appendChild(n);
+  n.id = "vd-ui-vanilla", n.textContent = Li, document.head.appendChild(n);
 }
-const xi = w.fontFamily.sans.join(", ");
-class Ti {
+const Mi = S.fontFamily.sans.join(", ");
+class Ni {
   qrLib = null;
   dialog = null;
   qrSlot = null;
   /** Open the modal immediately, with a loading placeholder in the QR slot. */
   show() {
-    this.hide(), xe(), this.dialog = new wi({ onClose: () => {
+    this.hide(), xt(), this.dialog = new xi({ onClose: () => {
       this.dialog = null, this.qrSlot = null;
     } }), Object.assign(this.dialog.card.element.style, {
       display: "flex",
       flexDirection: "column",
       alignItems: "center",
       gap: l[3],
-      fontFamily: xi
-    }), this.dialog.card.element.appendChild(this.createText(Bt(), {
-      fontSize: w.fontSize.base,
-      fontWeight: w.fontWeight.semibold,
-      color: p.neutral[900]
-    })), this.dialog.card.element.appendChild(this.createText(qt(), {
-      fontSize: w.fontSize.sm,
-      color: p.neutral[600]
-    })), this.qrSlot = this.createQrSlot(), this.dialog.card.element.appendChild(this.qrSlot), this.dialog.card.element.appendChild(this.createText(Yt(), {
-      fontSize: w.fontSize.xs,
-      color: p.neutral[500]
+      fontFamily: Mi
+    }), this.dialog.card.element.appendChild(this.createText(Ue(), {
+      fontSize: S.fontSize.base,
+      fontWeight: S.fontWeight.semibold,
+      color: m.neutral[900]
+    })), this.dialog.card.element.appendChild(this.createText(qe(), {
+      fontSize: S.fontSize.sm,
+      color: m.neutral[600]
+    })), this.qrSlot = this.createQrSlot(), this.dialog.card.element.appendChild(this.qrSlot), this.dialog.card.element.appendChild(this.createText(Qe(), {
+      fontSize: S.fontSize.xs,
+      color: m.neutral[500]
     }));
-    const e = new v({
+    const t = new v({
       variant: "outline",
-      label: Jt(),
+      label: Je(),
       onClick: () => {
         this.hide();
       }
     });
-    this.dialog.card.element.appendChild(e.element), this.dialog.open();
+    this.dialog.card.element.appendChild(t.element), this.dialog.open();
   }
   /**
    * Render the QR for `url` into the open modal's slot, replacing the loading
    * placeholder. Resolves `true` once the QR is actually on screen; `false`
    * when the modal was closed before it could render (nothing reopens).
    */
-  async update(e) {
+  async update(t) {
     this.qrLib ??= await import("./browser-ey6Iih3j.js").then((i) => i.b);
-    const t = await this.qrLib.toDataURL(e, {
+    const e = await this.qrLib.toDataURL(t, {
       width: 256,
       margin: 4,
       errorCorrectionLevel: "M",
-      color: { dark: p.black, light: p.white }
+      color: { dark: m.black, light: m.white }
     });
-    return this.qrSlot === null ? !1 : (this.qrSlot.classList.remove("ui-qr-slot--loading"), this.qrSlot.replaceChildren(this.createQrImage(t)), !0);
+    return this.qrSlot === null ? !1 : (this.qrSlot.classList.remove("ui-qr-slot--loading"), this.qrSlot.replaceChildren(this.createQrImage(e)), !0);
   }
   hide() {
     this.dialog?.close(), this.dialog = null, this.qrSlot = null;
   }
-  createText(e, t) {
+  createText(t, e) {
     const i = document.createElement("p");
-    return i.textContent = e, Object.assign(i.style, { margin: "0", textAlign: "center", ...t }), i;
+    return i.textContent = t, Object.assign(i.style, { margin: "0", textAlign: "center", ...e }), i;
   }
   createQrSlot() {
-    const e = document.createElement("div");
-    return e.className = "ui-qr-slot ui-qr-slot--loading", e;
+    const t = document.createElement("div");
+    return t.className = "ui-qr-slot ui-qr-slot--loading", t;
   }
-  createQrImage(e) {
-    const t = document.createElement("img");
-    return t.src = e, t.alt = "QR code", t;
+  createQrImage(t) {
+    const e = document.createElement("img");
+    return e.src = t, e.alt = "QR code", e;
   }
 }
-function ue(n) {
-  const e = Math.max(0, Math.min(1, n));
-  return e * e * (3 - 2 * e);
+function dt(n) {
+  const t = Math.max(0, Math.min(1, n));
+  return t * t * (3 - 2 * t);
 }
-function Ri(n, e, t, i, s, o) {
-  const [r, a, u] = n, d = Math.cos(e), f = Math.sin(e), h = d * r + f * u, E = -f * r + d * u, _ = Math.cos(t), k = Math.sin(t), I = _ * a - k * E, P = k * a + _ * E, ee = 0.55;
-  return [i + h * o * ee, s - I * o * ee, P];
+function zi(n, t, e, i, o, s) {
+  const [r, a, d] = n, u = Math.cos(t), f = Math.sin(t), h = u * r + f * d, E = -f * r + u * d, _ = Math.cos(e), C = Math.sin(e), I = _ * a - C * E, F = C * a + _ * E, tt = 0.55;
+  return [i + h * s * tt, o - I * s * tt, F];
 }
-function Ii(n, e, t) {
-  n.beginPath(), n.moveTo(e[0], e[1]), n.lineTo(t[0], t[1]), n.strokeStyle = "#000", n.lineWidth = 2, n.stroke();
+function Pi(n, t, e) {
+  n.beginPath(), n.moveTo(t[0], t[1]), n.lineTo(e[0], e[1]), n.strokeStyle = "#000", n.lineWidth = 2, n.stroke();
 }
-function Li(n, e, t, i, s) {
-  const o = e(t), r = e(i), a = [
-    o[0] + (r[0] - o[0]) * s,
-    o[1] + (r[1] - o[1]) * s,
-    o[2]
+function Fi(n, t, e, i, o) {
+  const s = t(e), r = t(i), a = [
+    s[0] + (r[0] - s[0]) * o,
+    s[1] + (r[1] - s[1]) * o,
+    s[2]
   ];
-  Ii(n, o, a);
+  Pi(n, s, a);
 }
-const $ = [-1, -1, 1], U = [1, -1, 1], B = [1, -1, -1], V = [-1, -1, -1], j = [-1, 1, 1], H = [1, 1, 1], q = [1, 1, -1], G = [-1, 1, -1], de = [
-  [$, U],
-  [U, B],
-  [B, V],
+const $ = [-1, -1, 1], B = [1, -1, 1], U = [1, -1, -1], V = [-1, -1, -1], j = [-1, 1, 1], H = [1, 1, 1], q = [1, 1, -1], G = [-1, 1, -1], ut = [
+  [$, B],
+  [B, U],
+  [U, V],
   [V, $],
   [$, j],
-  [U, H],
-  [B, q],
+  [B, H],
+  [U, q],
   [V, G],
   [j, H],
   [H, q],
   [q, G],
   [G, j]
-], Oi = 400, he = '-apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif';
-function Ni() {
+], Di = 400, ht = '-apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif';
+function $i() {
   const n = document.createElement("div");
   Object.assign(n.style, {
     position: "absolute",
@@ -2605,15 +2665,15 @@ function Ni() {
     opacity: "0",
     transition: "opacity 0.3s ease-in-out"
   });
-  const e = document.createElement("canvas");
-  Object.assign(e.style, {
+  const t = document.createElement("canvas");
+  Object.assign(t.style, {
     width: "100%",
     height: "100%",
     position: "absolute",
     inset: "0"
   });
-  const t = document.createElement("div");
-  Object.assign(t.style, {
+  const e = document.createElement("div");
+  Object.assign(e.style, {
     position: "absolute",
     top: "56%",
     left: "0",
@@ -2627,16 +2687,16 @@ function Ni() {
     fontWeight: "400",
     color: "#000",
     fontVariantNumeric: "tabular-nums",
-    fontFamily: he
+    fontFamily: ht
   });
-  const s = document.createElement("span");
-  return Object.assign(s.style, {
+  const o = document.createElement("span");
+  return Object.assign(o.style, {
     fontSize: "13px",
     color: "#000",
-    fontFamily: he
-  }), s.textContent = ln(), t.appendChild(i), t.appendChild(s), n.appendChild(e), n.appendChild(t), { overlay: n, canvas: e, pctEl: i, phaseEl: s };
+    fontFamily: ht
+  }), o.textContent = hn(), e.appendChild(i), e.appendChild(o), n.appendChild(t), n.appendChild(e), { overlay: n, canvas: t, pctEl: i, phaseEl: o };
 }
-class Mi {
+class Bi {
   overlay;
   canvas;
   ctx;
@@ -2647,28 +2707,28 @@ class Mi {
   startTime;
   hidden = !1;
   visible = !1;
-  constructor(e, t = {}) {
+  constructor(t, e = {}) {
     this.startTime = performance.now();
-    const i = Ni();
-    this.overlay = i.overlay, this.canvas = i.canvas, this.pctEl = i.pctEl, this.phaseEl = i.phaseEl, e.appendChild(this.overlay), this.ctx = this.canvas.getContext("2d"), this.ctx !== null && (this.sizeCanvas(), this.tick());
-    const s = t.showDelay ?? Oi;
+    const i = $i();
+    this.overlay = i.overlay, this.canvas = i.canvas, this.pctEl = i.pctEl, this.phaseEl = i.phaseEl, t.appendChild(this.overlay), this.ctx = this.canvas.getContext("2d"), this.ctx !== null && (this.sizeCanvas(), this.tick());
+    const o = e.showDelay ?? Di;
     this.showTimerId = setTimeout(() => {
       this.reveal();
-    }, s);
+    }, o);
   }
-  updateProgress(e, t) {
-    this.hidden || (this.pctEl.textContent = `${Math.round(e)}%`, this.phaseEl.textContent = t !== "" ? ` · ${t}` : "");
+  updateProgress(t, e) {
+    this.hidden || (this.pctEl.textContent = `${Math.round(t)}%`, this.phaseEl.textContent = e !== "" ? ` · ${e}` : "");
   }
   /**
    * Show an error state — stops animation and displays the error message.
    * The overlay stays visible so the user knows something went wrong.
    */
-  showError(e) {
+  showError(t) {
     if (this.hidden = !1, this.animationId !== null && (cancelAnimationFrame(this.animationId), this.animationId = null), this.ctx !== null) {
-      const t = Math.min(devicePixelRatio, 2), i = this.canvas.width / t, s = this.canvas.height / t;
-      this.ctx.fillStyle = "#fff", this.ctx.fillRect(0, 0, i * t, s * t);
+      const e = Math.min(devicePixelRatio, 2), i = this.canvas.width / e, o = this.canvas.height / e;
+      this.ctx.fillStyle = "#fff", this.ctx.fillRect(0, 0, i * e, o * e);
     }
-    this.pctEl.textContent = "", this.phaseEl.textContent = e, this.phaseEl.style.color = "#b91c1c", this.reveal();
+    this.pctEl.textContent = "", this.phaseEl.textContent = t, this.phaseEl.style.color = "#b91c1c", this.reveal();
   }
   hide() {
     if (!this.hidden) {
@@ -2695,8 +2755,8 @@ class Mi {
   sizeCanvas() {
     if (this.ctx === null)
       return;
-    const e = Math.min(devicePixelRatio, 2), t = this.overlay.clientWidth || 440, i = this.overlay.clientHeight || 360;
-    this.canvas.width = t * e, this.canvas.height = i * e, this.ctx.scale(e, e), this.ctx.lineCap = "round", this.ctx.lineJoin = "round";
+    const t = Math.min(devicePixelRatio, 2), e = this.overlay.clientWidth || 440, i = this.overlay.clientHeight || 360;
+    this.canvas.width = e * t, this.canvas.height = i * t, this.ctx.scale(t, t), this.ctx.lineCap = "round", this.ctx.lineJoin = "round";
   }
   tick = () => {
     this.hidden || (this.drawFrame(), this.animationId = requestAnimationFrame(this.tick));
@@ -2704,24 +2764,24 @@ class Mi {
   drawFrame() {
     if (this.ctx === null)
       return;
-    const e = this.canvas.width / Math.min(devicePixelRatio, 2), t = this.canvas.height / Math.min(devicePixelRatio, 2), i = (performance.now() - this.startTime) / 1e3;
-    this.ctx.fillStyle = "#fff", this.ctx.fillRect(0, 0, e, t);
-    const s = e / 2, o = t * 0.44, r = Math.min(e, t) * 0.08, a = 0.785, u = 0.615, d = (k) => Ri(k, a, u, s, o, r), f = 6, h = i % f / f, E = de.length;
+    const t = this.canvas.width / Math.min(devicePixelRatio, 2), e = this.canvas.height / Math.min(devicePixelRatio, 2), i = (performance.now() - this.startTime) / 1e3;
+    this.ctx.fillStyle = "#fff", this.ctx.fillRect(0, 0, t, e);
+    const o = t / 2, s = e * 0.44, r = Math.min(t, e) * 0.08, a = 0.785, d = 0.615, u = (C) => zi(C, a, d, o, s, r), f = 6, h = i % f / f, E = ut.length;
     let _;
-    h < 0.35 ? _ = ue(h / 0.35) * E : h < 0.55 ? _ = E : h < 0.9 ? _ = (1 - ue((h - 0.55) / 0.35)) * E : _ = 0, this.ctx.shadowBlur = 5, this.ctx.shadowColor = "rgba(30,30,30,0.08)";
-    for (let k = 0; k < E && !(k >= _); k++) {
-      const I = de[k];
+    h < 0.35 ? _ = dt(h / 0.35) * E : h < 0.55 ? _ = E : h < 0.9 ? _ = (1 - dt((h - 0.55) / 0.35)) * E : _ = 0, this.ctx.shadowBlur = 5, this.ctx.shadowColor = "rgba(30,30,30,0.08)";
+    for (let C = 0; C < E && !(C >= _); C++) {
+      const I = ut[C];
       if (I === void 0)
         continue;
-      const P = Math.min(1, _ - k);
-      Li(this.ctx, d, I[0], I[1], P);
+      const F = Math.min(1, _ - C);
+      Fi(this.ctx, u, I[0], I[1], F);
     }
     this.ctx.shadowBlur = 0;
   }
 }
-class zi {
-  constructor(e) {
-    this.options = e, this.element = document.createElement("div"), Object.assign(this.element.style, { display: "flex", gap: "0.375rem" }), this.onFullscreenChange = () => {
+class Ui {
+  constructor(t) {
+    this.options = t, this.element = document.createElement("div"), Object.assign(this.element.style, { display: "flex", gap: "0.375rem" }), this.onFullscreenChange = () => {
       this.setFullscreenIcon(document.fullscreenElement !== null);
     }, document.addEventListener("fullscreenchange", this.onFullscreenChange);
   }
@@ -2729,158 +2789,182 @@ class zi {
   element;
   arBtn = null;
   fullscreenBtn = null;
+  annotationsBtn = null;
+  /**
+   * Whether markers are currently shown, as this control believes it. Seeded
+   * from the mode when the button first renders, then owned by the clicks:
+   * the toggle channel has no return leg, so the button is the state holder.
+   */
+  annotationsShown = !1;
   onFullscreenChange;
-  setFullscreenIcon(e) {
-    this.fullscreenBtn !== null && this.fullscreenBtn.setIcon(e ? b.exitFullscreen() : b.fullscreen());
+  setFullscreenIcon(t) {
+    this.fullscreenBtn !== null && this.fullscreenBtn.setIcon(t ? g.exitFullscreen() : g.fullscreen());
   }
-  syncButton(e, t, i) {
-    if (t && e === null) {
-      const s = i();
-      return this.element.appendChild(s.element), s;
+  syncButton(t, e, i) {
+    if (e && t === null) {
+      const o = i();
+      return this.element.appendChild(o.element), o;
     }
-    return !t && e !== null ? (e.element.remove(), null) : e;
+    return !e && t !== null ? (t.element.remove(), null) : t;
   }
-  applySettings(e) {
-    this.arBtn = this.syncButton(this.arBtn, e.ar !== !1 && this.options.onAr !== void 0, () => new v({
+  applySettings(t) {
+    this.arBtn = this.syncButton(this.arBtn, t.ar !== !1 && this.options.onAr !== void 0, () => new v({
       variant: "outline",
       size: "icon",
-      label: Ft(),
-      icon: b.ar(),
+      label: Fe(),
+      icon: g.ar(),
       onClick: () => {
         this.options.onAr?.();
       }
-    })), this.fullscreenBtn = this.syncButton(this.fullscreenBtn, e.fullscreen !== !1 && this.options.onFullscreen !== void 0, () => new v({
+    })), this.fullscreenBtn = this.syncButton(this.fullscreenBtn, t.fullscreen !== !1 && this.options.onFullscreen !== void 0, () => new v({
       variant: "outline",
       size: "icon",
-      label: sn(),
-      icon: b.fullscreen(),
+      label: ln(),
+      icon: g.fullscreen(),
       onClick: () => {
         this.options.onFullscreen?.();
       }
     }));
+    const e = t.annotations === "toggle-shown" || t.annotations === "toggle-hidden";
+    this.annotationsBtn = this.syncButton(this.annotationsBtn, e && this.options.onAnnotationsToggle !== void 0, () => {
+      this.annotationsShown = t.annotations === "toggle-shown";
+      const i = new v({
+        variant: "outline",
+        size: "icon",
+        label: on(),
+        icon: this.annotationsShown ? g.annotations() : g.annotationsOff(),
+        onClick: () => {
+          this.flipAnnotations();
+        }
+      });
+      return i.element.setAttribute("aria-pressed", String(this.annotationsShown)), i;
+    });
+  }
+  flipAnnotations() {
+    this.annotationsShown = !this.annotationsShown, this.annotationsBtn?.element.setAttribute("aria-pressed", String(this.annotationsShown)), this.annotationsBtn?.setIcon(this.annotationsShown ? g.annotations() : g.annotationsOff()), this.options.onAnnotationsToggle?.(this.annotationsShown);
   }
   destroy() {
     document.removeEventListener("fullscreenchange", this.onFullscreenChange);
   }
 }
 const R = 0.5;
-class z {
+class P {
   element;
-  constructor(e, t) {
+  constructor(t, e) {
     this.element = Object.assign(document.createElement("div"), { className: "vd-camera-controls" });
     const i = {
-      targetRotation: t.rotation,
-      targetTilt: t.tilt,
-      targetZoom: t.zoom,
+      targetRotation: e.rotation,
+      targetTilt: e.tilt,
+      targetZoom: e.zoom,
       thetaOffset: 0
-    }, s = Pi(e, t, i);
-    t.onChange((o) => {
-      i.targetRotation = o.rotation - i.thetaOffset, i.targetTilt = o.tilt, i.targetZoom = o.zoom, Fi(s, t, o);
-    }), this.element.appendChild(z.buildZoom(s.zoomOut, s.zoomIn)), this.element.appendChild(z.buildDpad(s.tiltUp, s.rotateLeft, s.reset, s.rotateRight, s.tiltDown));
+    }, o = Vi(t, e, i);
+    e.onChange((s) => {
+      i.targetRotation = s.rotation - i.thetaOffset, i.targetTilt = s.tilt, i.targetZoom = s.zoom, ji(o, e, s);
+    }), this.element.appendChild(P.buildZoom(o.zoomOut, o.zoomIn)), this.element.appendChild(P.buildDpad(o.tiltUp, o.rotateLeft, o.reset, o.rotateRight, o.tiltDown));
   }
-  static buildZoom(e, t) {
+  static buildZoom(t, e) {
     const i = document.createElement("div");
-    return i.className = "vd-zoom", i.appendChild(e.element), i.appendChild(t.element), i;
+    return i.className = "vd-zoom", i.appendChild(t.element), i.appendChild(e.element), i;
   }
-  static buildDpad(e, t, i, s, o) {
+  static buildDpad(t, e, i, o, s) {
     const r = document.createElement("div");
     r.className = "vd-dpad";
-    for (const [a, u] of [
-      [e, "up"],
-      [t, "left"],
+    for (const [a, d] of [
+      [t, "up"],
+      [e, "left"],
       [i, "center"],
-      [s, "right"],
-      [o, "down"]
+      [o, "right"],
+      [s, "down"]
     ])
-      a.element.classList.add(`vd-dpad-${u}`), r.appendChild(a.element);
+      a.element.classList.add(`vd-dpad-${d}`), r.appendChild(a.element);
     return r;
   }
 }
-function Pi(n, e, t) {
-  const i = (r) => Math.max(e.limits?.minZoom ?? 1, Math.min(e.limits?.maxZoom ?? 1 / 0, r)), s = (r) => {
-    const a = e.limits?.minRotate, u = e.limits?.maxRotate;
-    return a !== void 0 || u !== void 0 ? Math.max(a ?? -1 / 0, Math.min(u ?? 1 / 0, r)) : r;
-  }, o = (r) => {
-    const a = e.limits?.minTilt, u = e.limits?.maxTilt;
-    if (a !== void 0 || u !== void 0) {
-      t.targetTilt = Math.max(a ?? 0, Math.min(u ?? 180, t.targetTilt + r)), n.tilt(t.targetTilt).set();
+function Vi(n, t, e) {
+  const i = (r) => Math.max(t.limits?.minZoom ?? 1, Math.min(t.limits?.maxZoom ?? 1 / 0, r)), o = (r) => {
+    const a = t.limits?.minRotate, d = t.limits?.maxRotate;
+    return a !== void 0 || d !== void 0 ? Math.max(a ?? -1 / 0, Math.min(d ?? 1 / 0, r)) : r;
+  }, s = (r) => {
+    const a = t.limits?.minTilt, d = t.limits?.maxTilt;
+    if (a !== void 0 || d !== void 0) {
+      e.targetTilt = Math.max(a ?? 0, Math.min(d ?? 180, e.targetTilt + r)), n.tilt(e.targetTilt).set();
       return;
     }
-    const d = t.targetTilt + r;
-    d > 180 || d < 0 ? (t.targetTilt = d > 180 ? 360 - d : -d, t.thetaOffset = (t.thetaOffset + 180) % 360, n.tilt(t.targetTilt).rotate(t.targetRotation + t.thetaOffset).set()) : (t.targetTilt = d, n.tilt(t.targetTilt).set());
+    const u = e.targetTilt + r;
+    u > 180 || u < 0 ? (e.targetTilt = u > 180 ? 360 - u : -u, e.thetaOffset = (e.thetaOffset + 180) % 360, n.tilt(e.targetTilt).rotate(e.targetRotation + e.thetaOffset).set()) : (e.targetTilt = u, n.tilt(e.targetTilt).set());
   };
   return {
-    zoomOut: new v({ variant: "outline", size: "icon", label: On(), icon: b.zoomOut(), onClick: () => {
-      t.targetZoom = i(t.targetZoom - 10), n.zoom(t.targetZoom).set();
+    zoomOut: new v({ variant: "outline", size: "icon", label: Pn(), icon: g.zoomOut(), onClick: () => {
+      e.targetZoom = i(e.targetZoom - 10), n.zoom(e.targetZoom).set();
     } }),
-    zoomIn: new v({ variant: "outline", size: "icon", label: Tn(), icon: b.zoomIn(), onClick: () => {
-      t.targetZoom = i(t.targetZoom + 10), n.zoom(t.targetZoom).set();
+    zoomIn: new v({ variant: "outline", size: "icon", label: Ln(), icon: g.zoomIn(), onClick: () => {
+      e.targetZoom = i(e.targetZoom + 10), n.zoom(e.targetZoom).set();
     } }),
-    tiltUp: new v({ variant: "outline", size: "icon", label: Hn(), icon: b.tiltUp(), onClick: () => {
-      o(-15);
+    tiltUp: new v({ variant: "outline", size: "icon", label: Wn(), icon: g.tiltUp(), onClick: () => {
+      s(-15);
     } }),
-    rotateLeft: new v({ variant: "outline", size: "icon", label: Pn(), icon: b.rotateLeft(), onClick: () => {
-      t.targetRotation = s(t.targetRotation - 15), n.rotate(t.targetRotation + t.thetaOffset).set();
+    rotateLeft: new v({ variant: "outline", size: "icon", label: Bn(), icon: g.rotateLeft(), onClick: () => {
+      e.targetRotation = o(e.targetRotation - 15), n.rotate(e.targetRotation + e.thetaOffset).set();
     } }),
-    reset: new v({ variant: "outline", size: "icon", label: _n(), icon: b.reset(), onClick: () => {
-      t.thetaOffset = 0, n.reset();
+    reset: new v({ variant: "outline", size: "icon", label: Tn(), icon: g.reset(), onClick: () => {
+      e.thetaOffset = 0, n.reset();
     } }),
-    rotateRight: new v({ variant: "outline", size: "icon", label: Un(), icon: b.rotateRight(), onClick: () => {
-      t.targetRotation = s(t.targetRotation + 15), n.rotate(t.targetRotation + t.thetaOffset).set();
+    rotateRight: new v({ variant: "outline", size: "icon", label: Hn(), icon: g.rotateRight(), onClick: () => {
+      e.targetRotation = o(e.targetRotation + 15), n.rotate(e.targetRotation + e.thetaOffset).set();
     } }),
-    tiltDown: new v({ variant: "outline", size: "icon", label: Wn(), icon: b.tiltDown(), onClick: () => {
-      o(15);
+    tiltDown: new v({ variant: "outline", size: "icon", label: Xn(), icon: g.tiltDown(), onClick: () => {
+      s(15);
     } })
   };
 }
-function Fi(n, e, t) {
-  const i = e.limits;
-  i !== void 0 && (n.zoomOut.element.disabled = i.minZoom !== void 0 && t.zoom <= i.minZoom + R, n.zoomIn.element.disabled = i.maxZoom !== void 0 && t.zoom >= i.maxZoom - R, n.tiltUp.element.disabled = i.minTilt !== void 0 && t.tilt <= i.minTilt + R, n.tiltDown.element.disabled = i.maxTilt !== void 0 && t.tilt >= i.maxTilt - R, n.rotateLeft.element.disabled = i.minRotate !== void 0 && t.rotation <= i.minRotate + R, n.rotateRight.element.disabled = i.maxRotate !== void 0 && t.rotation >= i.maxRotate - R);
+function ji(n, t, e) {
+  const i = t.limits;
+  i !== void 0 && (n.zoomOut.element.disabled = i.minZoom !== void 0 && e.zoom <= i.minZoom + R, n.zoomIn.element.disabled = i.maxZoom !== void 0 && e.zoom >= i.maxZoom - R, n.tiltUp.element.disabled = i.minTilt !== void 0 && e.tilt <= i.minTilt + R, n.tiltDown.element.disabled = i.maxTilt !== void 0 && e.tilt >= i.maxTilt - R, n.rotateLeft.element.disabled = i.minRotate !== void 0 && e.rotation <= i.minRotate + R, n.rotateRight.element.disabled = i.maxRotate !== void 0 && e.rotation >= i.maxRotate - R);
 }
 const T = {
-  /** Attribute selection requested (cancelable). `detail`: `{ attribute, value }`. */
-  SELECT: "ui:select",
-  /** Attribute selection applied. `detail`: `{ attribute, value }`. */
-  SELECTED: "ui:selected",
+  /** Attribute selection requested (cancelable, does not bubble). `detail`: `{ attribute, value }`. */
+  SELECT: "vd:select",
+  /** Attribute selection applied (does not bubble). `detail`: `{ attribute, value }`. */
+  SELECTED: "vd:selected",
   /** Focus changed (bubbles). `detail`: `{ component, attributes }`, or `null` for the overview. */
   FOCUS_CHANGE: "vd:focus-change",
   /** Resolved configuration changed (bubbles). `detail`: the resolved configuration, or `null` when nothing matches. */
   CONFIGURATION_CHANGE: "vd:configuration-change",
   /** Configuration submitted (bubbles). `detail`: the resolved configuration handed to the host. */
   CONFIGURATION_SUBMIT: "vd:configuration-submit"
-}, Te = {
+}, Tt = {
   mm: 1,
   cm: 10,
   m: 1e3,
   in: 25.4
-}, me = 3;
-function Di(n) {
-  const e = n.stepMm / Te[n.displayUnit];
-  for (let t = 0; t <= me; t++) {
-    const i = e * 10 ** t;
+}, pt = 3;
+function Hi(n) {
+  const t = n.stepMm / Tt[n.displayUnit];
+  for (let e = 0; e <= pt; e++) {
+    const i = t * 10 ** e;
     if (Math.abs(i - Math.round(i)) < 1e-9)
-      return t;
+      return e;
   }
-  return me;
+  return pt;
 }
-function $i(n, e, t) {
-  const i = Di(e), s = n / Te[e.displayUnit];
-  return new Intl.NumberFormat(t, {
+function qi(n, t, e) {
+  const i = Hi(t), o = n / Tt[t.displayUnit];
+  return new Intl.NumberFormat(e, {
     minimumFractionDigits: i,
     maximumFractionDigits: i
-  }).format(s);
+  }).format(o);
 }
-function Ui(n, e, t, i, s, o, r) {
-  const a = m(), u = n.values.map((h) => $i(Number(h), e, a)), d = n.values.find((h) => t.getValue(n.name, h)?.isSelected === !0) ?? n.defaultValue, f = new _i(n.values, {
+function Gi(n, t, e, i, o, s, r) {
+  const a = p(), d = n.values.map((h) => qi(Number(h), t, a)), u = n.values.find((h) => e.getValue(n.name, h)?.isSelected === !0) ?? n.defaultValue, f = new Ii(n.values, {
     label: n.name,
-    labels: u,
-    unit: e.displayUnit,
-    ...d !== void 0 && { initialSelected: d }
+    labels: d,
+    unit: t.displayUnit,
+    ...u !== void 0 && { initialSelected: u }
   });
   return f.onSelect((h) => {
-    s(n.name, h);
+    o(n.name, h);
   }), f.onSettle((h) => {
-    i.dispatch(T.SELECT, { attribute: n.name, value: h }, !0).defaultPrevented || o(n.name, h);
+    i.dispatch(T.SELECT, { attribute: n.name, value: h }, !0).defaultPrevented || s(n.name, h);
   }), r(n.name, (h) => {
     f.setSelected(h.value), i.dispatch(T.SELECTED, { attribute: n.name, value: h.value });
   }), {
@@ -2894,49 +2978,49 @@ function Ui(n, e, t, i, s, o, r) {
     }
   };
 }
-const Bi = 5;
-let Vi = 0;
+const Zi = 5;
+let Wi = 0;
 function K(n) {
-  const e = n.replace(/([A-Z])/g, " $1").trim();
-  return e.charAt(0).toUpperCase() + e.slice(1).toLowerCase();
+  const t = n.replace(/([A-Z])/g, " $1").trim();
+  return t.charAt(0).toUpperCase() + t.slice(1).toLowerCase();
 }
-function ji(n, e, t, i, s, o) {
+function Qi(n, t, e, i, o, s) {
   const r = document.createElement("div");
   r.className = "vd-attribute", r.dataset.name = n.name;
   const a = document.createElement("span");
-  a.className = "vd-attribute-label", a.textContent = K(n.name), a.id = `vd-attribute-label-${Vi++}`, r.appendChild(a), r.setAttribute("role", "group"), r.setAttribute("aria-labelledby", a.id);
-  const u = (f) => {
+  a.className = "vd-attribute-label", a.textContent = K(n.name), a.id = `vd-attribute-label-${Wi++}`, r.appendChild(a), r.setAttribute("role", "group"), r.setAttribute("aria-labelledby", a.id);
+  const d = (f) => {
     r.style.display = f ? "none" : "";
-  }, d = n.dimension !== void 0 ? Ui(
+  }, u = n.dimension !== void 0 ? Gi(
     n,
     n.dimension,
-    e,
     t,
-    s,
+    e,
+    o,
     i,
-    o
-  ) : Hi(n, e, t, i, o);
-  return r.appendChild(d.element), { element: r, setSelectable: d.setSelectable, setHidden: u };
-}
-function Hi(n, e, t, i, s) {
-  const o = n.values.find(
-    (u) => e.getValue(n.name, u)?.isSelected === !0
-  ), r = n.values.map(K), a = n.values.length <= Bi ? new Ci(n.values, o, r) : new ki(n.name, n.values, K(n.name), o, r);
-  return a.onSelect((u) => {
-    t.dispatch(T.SELECT, { attribute: n.name, value: u }, !0).defaultPrevented || i(n.name, u);
-  }), s(n.name, (u) => {
-    a.setSelected(u.value), t.dispatch(T.SELECTED, { attribute: n.name, value: u.value });
+    s
+  ) : Yi(n, t, e, i, s);
+  return r.appendChild(u.element), { element: r, setSelectable: u.setSelectable, setHidden: d };
+}
+function Yi(n, t, e, i, o) {
+  const s = n.values.find(
+    (d) => t.getValue(n.name, d)?.isSelected === !0
+  ), r = n.values.map(K), a = n.values.length <= Zi ? new Ti(n.values, s, r) : new Ri(n.name, n.values, K(n.name), s, r);
+  return a.onSelect((d) => {
+    e.dispatch(T.SELECT, { attribute: n.name, value: d }, !0).defaultPrevented || i(n.name, d);
+  }), o(n.name, (d) => {
+    a.setSelected(d.value), e.dispatch(T.SELECTED, { attribute: n.name, value: d.value });
   }), {
     element: a.element,
-    setSelectable: (u) => {
-      a.setEnabled(u);
+    setSelectable: (d) => {
+      a.setEnabled(d);
     }
   };
 }
-const qi = 80, Gi = 2500;
-class Zi {
-  constructor(e, t = Gi) {
-    this.configuration = e, this.resetMs = t, this.element = document.createElement("div"), this.element.className = "vd-commerce vd-hidden";
+const Ki = 80, Xi = 2500;
+class Ji {
+  constructor(t, e = Xi) {
+    this.configuration = t, this.resetMs = e, this.element = document.createElement("div"), this.element.className = "vd-commerce vd-hidden";
     const i = document.createElement("div");
     i.className = "vd-commerce-price", this.priceEl = document.createElement("span"), this.priceEl.className = "vd-price", this.vatEl = document.createElement("span"), this.vatEl.className = "vd-vat", i.append(this.priceEl, this.vatEl), this.button = new v({ variant: "default", onClick: () => {
       this.handleSubmit();
@@ -2956,30 +3040,30 @@ class Zi {
   /** Re-render from the facade. Called on every resolve and on submit-handler registration. */
   update() {
     this.renderPrice(this.configuration.current), this.renderButton();
-    const e = this.configuration.current !== void 0 || this.configuration.submitEnabled;
-    this.element.classList.toggle("vd-hidden", !e);
+    const t = this.configuration.current !== void 0 || this.configuration.submitEnabled;
+    this.element.classList.toggle("vd-hidden", !t);
   }
   destroy() {
     this.unsubscribe(), this.resetTimer !== void 0 && clearTimeout(this.resetTimer), this.element.remove();
   }
-  renderPrice(e) {
-    if (e === void 0) {
+  renderPrice(t) {
+    if (t === void 0) {
       this.priceEl.textContent = "", this.vatEl.textContent = "";
       return;
     }
-    this.priceEl.textContent = Wi(e.price, e.currency), this.vatEl.textContent = pe(this.configuration.vatDisplay);
+    this.priceEl.textContent = to(t.price, t.currency), this.vatEl.textContent = mt(this.configuration.vatDisplay);
   }
   renderButton() {
-    const e = this.configuration.submitEnabled;
-    this.button.element.classList.toggle("vd-hidden", !e), e && this.state === "idle" && this.setButtonText(pe(this.configuration.buttonLabel));
+    const t = this.configuration.submitEnabled;
+    this.button.element.classList.toggle("vd-hidden", !t), t && this.state === "idle" && this.setButtonText(mt(this.configuration.buttonLabel));
   }
   async handleSubmit() {
     if (this.state !== "busy") {
-      this.setState("busy", Xn());
+      this.setState("busy", ni());
       try {
-        await this.configuration.submit(), this.setState("success", ni());
+        await this.configuration.submit(), this.setState("success", ri());
       } catch {
-        this.setState("failed", ri());
+        this.setState("failed", di());
       }
       this.scheduleReset();
     }
@@ -2989,43 +3073,43 @@ class Zi {
       this.state = "idle", this.update();
     }, this.resetMs);
   }
-  setState(e, t) {
-    this.state = e, this.element.dataset.submit = e, this.button.element.disabled = e === "busy", this.setButtonText(t);
+  setState(t, e) {
+    this.state = t, this.element.dataset.submit = t, this.button.element.disabled = t === "busy", this.setButtonText(e);
   }
-  setButtonText(e) {
-    this.button.element.textContent = e, this.button.element.setAttribute("aria-label", e);
+  setButtonText(t) {
+    this.button.element.textContent = t, this.button.element.setAttribute("aria-label", t);
   }
 }
-function pe(n) {
-  return (n ?? "").slice(0, qi);
+function mt(n) {
+  return (n ?? "").slice(0, Ki);
 }
-function Wi(n, e) {
+function to(n, t) {
   try {
-    const t = new Intl.NumberFormat(m(), { style: "currency", currency: e }), i = t.resolvedOptions().maximumFractionDigits ?? 2;
-    return t.format(n / 10 ** i);
+    const e = new Intl.NumberFormat(p(), { style: "currency", currency: t }), i = e.resolvedOptions().maximumFractionDigits ?? 2;
+    return e.format(n / 10 ** i);
   } catch {
-    return `${e} ${(n / 100).toFixed(2)}`;
+    return `${t} ${(n / 100).toFixed(2)}`;
   }
 }
-class Re {
+class Rt {
   slot = null;
   panel = null;
-  attach(e, t) {
-    this.panel = t, t.style.display = "none", this.slot = document.createElement("div"), this.slot.className = "vd-slot-bottom-left", this.slot.appendChild(t), e.appendChild(this.slot);
+  attach(t, e) {
+    this.panel = e, e.style.display = "none", this.slot = document.createElement("div"), this.slot.className = "vd-slot-bottom-left", this.slot.appendChild(e), t.appendChild(this.slot);
   }
-  setVisible(e) {
-    this.panel !== null && (this.panel.style.display = e ? "flex" : "none");
+  setVisible(t) {
+    this.panel !== null && (this.panel.style.display = t ? "flex" : "none");
   }
   destroy() {
     this.slot?.remove(), this.slot = null, this.panel = null;
   }
 }
-const Yi = 572;
-class Qi {
+const eo = 572;
+class no {
   /** @param actionBarSlot The shared corner slot the AR/fullscreen buttons live in — the
    * "open configurator" toggle joins them there instead of floating as its own overlay. */
-  constructor(e) {
-    this.actionBarSlot = e;
+  constructor(t) {
+    this.actionBarSlot = t;
   }
   actionBarSlot;
   element = null;
@@ -3037,71 +3121,71 @@ class Qi {
   collapsible = !1;
   expanded = !0;
   visible = !1;
-  attach(e, t) {
-    this.container = e, t.classList.add("vd-attributes-sidebar"), this.closeButton = new v({
+  attach(t, e) {
+    this.container = t, e.classList.add("vd-attributes-sidebar"), this.closeButton = new v({
       variant: "ghost",
       size: "icon-sm",
-      label: Sn(),
-      icon: b.close({ size: 18 }),
+      label: _n(),
+      icon: g.close({ size: 18 }),
       onClick: () => {
         this.expanded = !1, this.render();
       }
     });
     const i = document.createElement("div");
-    i.className = "vd-sidebar-header", i.appendChild(this.closeButton.element), this.body = document.createElement("div"), this.body.className = "vd-sidebar-body", this.body.appendChild(t), this.element = document.createElement("div"), this.element.className = "vd-sidebar vd-hidden", this.element.append(i, this.body), e.appendChild(this.element), this.openButton = new v({
+    i.className = "vd-sidebar-header", i.appendChild(this.closeButton.element), this.body = document.createElement("div"), this.body.className = "vd-sidebar-body", this.body.appendChild(e), this.element = document.createElement("div"), this.element.className = "vd-sidebar vd-hidden", this.element.append(i, this.body), t.appendChild(this.element), this.openButton = new v({
       variant: "outline",
       size: "icon",
-      label: gn(),
-      icon: b.configurator({ size: 18 }),
+      label: wn(),
+      icon: g.configurator({ size: 18 }),
       onClick: () => {
         this.expanded = !0, this.render();
       }
     }), this.openButton.element.classList.add("vd-configurator-toggle", "vd-hidden"), this.actionBarSlot.appendChild(this.openButton.element), this.observe();
   }
-  setVisible(e) {
-    this.visible = e, this.render();
+  setVisible(t) {
+    this.visible = t, this.render();
   }
   destroy() {
     this.observer?.disconnect(), this.observer = null, this.openButton?.element.remove(), this.element?.remove(), this.container?.classList.remove("vd-layout-sidebar-right", "vd-layout-sidebar-permanent"), this.container = null;
   }
   observe() {
-    typeof ResizeObserver > "u" || this.container === null || (this.observer = new ResizeObserver((e) => {
-      const t = e[0]?.contentRect.width ?? 0;
-      this.setCollapsible(t > 0 && t < Yi);
+    typeof ResizeObserver > "u" || this.container === null || (this.observer = new ResizeObserver((t) => {
+      const e = t[0]?.contentRect.width ?? 0;
+      this.setCollapsible(e > 0 && e < eo);
     }), this.observer.observe(this.container));
   }
-  setCollapsible(e) {
-    e !== this.collapsible && (this.collapsible = e, this.expanded = !e, this.render());
+  setCollapsible(t) {
+    t !== this.collapsible && (this.collapsible = t, this.expanded = !t, this.render());
   }
   render() {
     if (this.element === null || this.openButton === null || this.closeButton === null || this.container === null)
       return;
-    const e = this.visible && this.expanded, t = this.visible && !this.expanded;
-    this.element.classList.toggle("vd-hidden", !this.visible), this.element.classList.toggle("vd-sidebar-collapsed", t), this.openButton.element.classList.toggle("vd-hidden", !t), this.closeButton.element.style.display = this.collapsible ? "" : "none", this.container.classList.toggle("vd-layout-sidebar-right", e), this.container.classList.toggle("vd-layout-sidebar-permanent", e && !this.collapsible);
+    const t = this.visible && this.expanded, e = this.visible && !this.expanded;
+    this.element.classList.toggle("vd-hidden", !this.visible), this.element.classList.toggle("vd-sidebar-collapsed", e), this.openButton.element.classList.toggle("vd-hidden", !e), this.closeButton.element.style.display = this.collapsible ? "" : "none", this.container.classList.toggle("vd-layout-sidebar-right", t), this.container.classList.toggle("vd-layout-sidebar-permanent", t && !this.collapsible);
   }
 }
-class Ki {
-  attach(e, t) {
+class io {
+  attach(t, e) {
   }
-  setVisible(e) {
+  setVisible(t) {
   }
   destroy() {
   }
 }
-const Xi = {
-  "inframe-bottom-left": () => new Re(),
-  "sidebar-right": (n) => new Qi(n),
-  hidden: () => new Ki()
+const oo = {
+  "inframe-bottom-left": () => new Rt(),
+  "sidebar-right": (n) => new no(n),
+  hidden: () => new io()
 };
-function Ji(n, e) {
-  return (Xi[n ?? ""] ?? (() => new Re()))(e);
+function so(n, t) {
+  return (oo[n ?? ""] ?? (() => new Rt()))(t);
 }
-const Z = w.fontFamily.sans.join(", "), W = `
+const Z = S.fontFamily.sans.join(", "), W = `
   position: absolute;
   display: flex;
   z-index: 10;
   transition: inset-inline-end 0.18s ease;
-`, es = `
+`, ro = `
 /* Override browser's default black fullscreen backdrop */
 .vd-container:fullscreen {
   background: oklch(100% 0 0);
@@ -3139,7 +3223,7 @@ const Z = w.fontFamily.sans.join(", "), W = `
   display: flex;
   flex-direction: column;
   gap: ${l[1]};
-  background: color-mix(in oklch, ${p.white} 85%, transparent);
+  background: color-mix(in oklch, ${m.white} 85%, transparent);
   backdrop-filter: blur(8px);
   border-radius: ${l[2]};
   padding: ${l[2]};
@@ -3167,12 +3251,12 @@ const Z = w.fontFamily.sans.join(", "), W = `
   display: flex;
   flex-direction: column;
   gap: ${l[3]};
-  background: color-mix(in oklch, ${p.white} 85%, transparent);
+  background: color-mix(in oklch, ${m.white} 85%, transparent);
   backdrop-filter: blur(8px);
-  border: 1px solid color-mix(in oklch, ${p.neutral[900]} 8%, transparent);
+  border: 1px solid color-mix(in oklch, ${m.neutral[900]} 8%, transparent);
   border-radius: ${l[3]};
   padding: ${l[3]};
-  box-shadow: 0 ${l[1]} ${l[4]} color-mix(in oklch, ${p.neutral[900]} 6%, transparent);
+  box-shadow: 0 ${l[1]} ${l[4]} color-mix(in oklch, ${m.neutral[900]} 6%, transparent);
   font-family: ${Z};
 }
 
@@ -3184,9 +3268,9 @@ const Z = w.fontFamily.sans.join(", "), W = `
 
 /* Micro-label: recedes so the controls lead. */
 .vd-attribute-label {
-  font-size: ${w.fontSize.xs};
-  font-weight: ${w.fontWeight.medium};
-  color: ${p.neutral[500]};
+  font-size: ${S.fontSize.xs};
+  font-weight: ${S.fontWeight.medium};
+  color: ${m.neutral[500]};
   text-transform: uppercase;
   letter-spacing: 0.05em;
   font-family: ${Z};
@@ -3225,10 +3309,10 @@ const Z = w.fontFamily.sans.join(", "), W = `
   z-index: 11;
   display: flex;
   flex-direction: column;
-  background: color-mix(in oklch, ${p.white} 90%, transparent);
+  background: color-mix(in oklch, ${m.white} 90%, transparent);
   backdrop-filter: blur(10px);
-  border-inline-start: 1px solid color-mix(in oklch, ${p.neutral[900]} 8%, transparent);
-  box-shadow: -${l[1]} 0 ${l[4]} color-mix(in oklch, ${p.neutral[900]} 5%, transparent);
+  border-inline-start: 1px solid color-mix(in oklch, ${m.neutral[900]} 8%, transparent);
+  box-shadow: -${l[1]} 0 ${l[4]} color-mix(in oklch, ${m.neutral[900]} 5%, transparent);
 }
 
 @media (prefers-reduced-motion: no-preference) {
@@ -3270,7 +3354,7 @@ const Z = w.fontFamily.sans.join(", "), W = `
   flex-direction: column;
   gap: ${l[2]};
   padding-block-start: ${l[3]};
-  border-block-start: 1px solid color-mix(in oklch, ${p.neutral[900]} 8%, transparent);
+  border-block-start: 1px solid color-mix(in oklch, ${m.neutral[900]} 8%, transparent);
   font-family: ${Z};
 }
 
@@ -3281,14 +3365,14 @@ const Z = w.fontFamily.sans.join(", "), W = `
 }
 
 .vd-price {
-  font-size: ${w.fontSize.lg};
-  font-weight: ${w.fontWeight.semibold};
-  color: ${p.neutral[900]};
+  font-size: ${S.fontSize.lg};
+  font-weight: ${S.fontWeight.semibold};
+  color: ${m.neutral[900]};
 }
 
 .vd-vat {
-  font-size: ${w.fontSize.xs};
-  color: ${p.neutral[500]};
+  font-size: ${S.fontSize.xs};
+  color: ${m.neutral[500]};
 }
 
 .vd-cta {
@@ -3298,23 +3382,23 @@ const Z = w.fontFamily.sans.join(", "), W = `
 
 /* Failed submit is the one place red belongs: a clear, recoverable error state. */
 .vd-commerce[data-submit="failed"] .vd-cta {
-  background: ${p.semantic.error};
-  border-color: ${p.semantic.error};
-  color: ${p.white};
+  background: ${m.semantic.error};
+  border-color: ${m.semantic.error};
+  color: ${m.white};
 }
 
 `;
-function ts() {
-  if (xe(), document.getElementById("vd-styles") !== null)
+function ao() {
+  if (xt(), document.getElementById("vd-styles") !== null)
     return;
   const n = document.createElement("style");
-  n.id = "vd-styles", n.textContent = es, document.head.appendChild(n);
+  n.id = "vd-styles", n.textContent = ro, document.head.appendChild(n);
 }
-function ns(n, e) {
-  const t = document.createElement("a");
-  t.href = `data:image/png;base64,${n}`, t.download = e, t.click();
+function lo(n, t) {
+  const e = document.createElement("a");
+  e.href = `data:image/png;base64,${n}`, e.download = t, e.click();
 }
-class is {
+class co {
   options;
   settings = {};
   container = null;
@@ -3330,11 +3414,11 @@ class is {
   lastSelectable = null;
   layout = null;
   commerce = null;
-  constructor(e) {
-    this.options = e;
+  constructor(t) {
+    this.options = t;
   }
-  attach(e) {
-    ts(), this.container = e, this.loading = new Mi(e), this.slots.topRight = this.createSlot(e, "vd-slot-top-right"), this.slots.bottomRight = this.createSlot(e, "vd-slot-bottom-right");
+  attach(t) {
+    ao(), this.container = t, this.loading = new Bi(t), this.slots.topRight = this.createSlot(t, "vd-slot-top-right"), this.slots.bottomRight = this.createSlot(t, "vd-slot-bottom-right");
   }
   onReady() {
     this.loading?.hide(), this.loading = null, this.mountToolbar(), this.cameraControls !== null && (this.cameraControls.element.style.display = "flex"), this.layout?.setVisible(!0);
@@ -3342,44 +3426,45 @@ class is {
   mountToolbar() {
     if (this.actionBar !== null || this.slots.bottomRight === null || this.container === null)
       return;
-    const e = typeof this.container.requestFullscreen == "function";
-    this.actionBar = new zi({
+    const t = typeof this.container.requestFullscreen == "function";
+    this.actionBar = new Ui({
       onAr: this.options.onAr,
-      onFullscreen: e ? () => {
+      onFullscreen: t ? () => {
         this.toggleFullscreen();
-      } : void 0
+      } : void 0,
+      onAnnotationsToggle: this.options.onAnnotationsToggle
     }), this.actionBar.applySettings(this.settings), this.slots.bottomRight.appendChild(this.actionBar.element), this.syncScreenshotButton(), this.placeScreenshotButton();
   }
   toggleFullscreen() {
     this.container !== null && (document.fullscreenElement !== null ? document.exitFullscreen() : (this.options.onFullscreenEnter?.(), this.container.requestFullscreen()));
   }
-  updateProgress(e, t) {
-    this.loading?.updateProgress(e, t);
+  updateProgress(t, e) {
+    this.loading?.updateProgress(t, e);
   }
-  showError(e) {
-    this.loading?.showError(e);
+  showError(t) {
+    this.loading?.showError(t);
   }
-  applyViewerSettings(e) {
-    this.settings = e, e.language !== void 0 && we(e.language, { reload: !1 }), this.syncScreenshotButton(), this.actionBar?.applySettings(e), this.cameraControls !== null && (this.cameraControls.element.style.display = e.cameraControls === !0 ? "flex" : "none"), this.placeScreenshotButton();
+  applyViewerSettings(t) {
+    this.settings = t, t.language !== void 0 && St(t.language, { reload: !1 }), this.syncScreenshotButton(), this.actionBar?.applySettings(t), this.cameraControls !== null && (this.cameraControls.element.style.display = t.cameraControls === !0 ? "flex" : "none"), this.placeScreenshotButton();
   }
-  renderAttributeControls(e, t) {
-    if (!(this.container === null || this.slots.topRight === null || this.slots.bottomRight === null) && (this.cameraControls?.element.remove(), this.cameraControls = null, this.teardownConfigurator(), this.settings.cameraControls === !0 && (this.cameraControls = new z(
+  renderAttributeControls(t, e) {
+    if (!(this.container === null || this.slots.topRight === null || this.slots.bottomRight === null) && (this.cameraControls?.element.remove(), this.cameraControls = null, this.teardownConfigurator(), this.settings.cameraControls === !0 && (this.cameraControls = new P(
       this.options.cameraApi,
       this.options.cameraPositionApi
-    ), this.cameraControls.element.style.display = "none", this.slots.topRight.appendChild(this.cameraControls.element)), this.placeScreenshotButton(), t.length !== 0)) {
+    ), this.cameraControls.element.style.display = "none", this.slots.topRight.appendChild(this.cameraControls.element)), this.placeScreenshotButton(), e.length !== 0)) {
       this.attributes = document.createElement("div"), this.attributes.className = "vd-attributes", this.groupHandles = /* @__PURE__ */ new Map();
-      for (const i of t) {
-        const s = ji(
+      for (const i of e) {
+        const o = Qi(
           i,
-          e,
+          t,
           this.options.eventBus,
           this.options.onSelect,
           this.options.onSelectTransient,
           this.options.onSubscribe
         );
-        this.groupHandles.set(i.name, s), this.attributes.appendChild(s.element);
+        this.groupHandles.set(i.name, o), this.attributes.appendChild(o.element);
       }
-      this.commerce = new Zi(this.options.configuration), this.attributes.appendChild(this.commerce.element), this.layout = Ji(
+      this.commerce = new Ji(this.options.configuration), this.attributes.appendChild(this.commerce.element), this.layout = so(
         this.settings.configuratorLayout,
         this.slots.bottomRight
       ), this.layout.attach(this.container, this.attributes), this.lastSelectable !== null && this.applySelectable(this.lastSelectable);
@@ -3391,11 +3476,11 @@ class is {
    * does not name are unrestricted. The interface renders, it never knows
    * the exclusion rules (kiesbaarheid live, binding-studio task 17).
    */
-  applySelectable(e) {
-    this.lastSelectable = e;
-    for (const [t, i] of this.groupHandles) {
-      const s = e.find((o) => o.name === t);
-      i.setSelectable(s?.selectable ?? null), i.setHidden(s?.hidden === !0);
+  applySelectable(t) {
+    this.lastSelectable = t;
+    for (const [e, i] of this.groupHandles) {
+      const o = t.find((s) => s.name === e);
+      i.setSelectable(o?.selectable ?? null), i.setHidden(o?.hidden === !0);
     }
   }
   get viewerSettings() {
@@ -3407,70 +3492,70 @@ class is {
   }
   destroy() {
     this.loading?.destroy(), this.screenshotBtn?.element.remove(), this.actionBar?.destroy(), this.actionBar?.element.remove(), this.cameraControls?.element.remove(), this.teardownConfigurator();
-    for (const e of Object.values(this.slots))
-      e?.remove();
+    for (const t of Object.values(this.slots))
+      t?.remove();
     this.container = null;
   }
-  createSlot(e, t) {
+  createSlot(t, e) {
     const i = document.createElement("div");
-    return i.className = t, e.appendChild(i), i;
+    return i.className = e, t.appendChild(i), i;
   }
   syncScreenshotButton() {
-    const e = this.settings.screenshot === !0;
-    e && this.screenshotBtn === null && (this.screenshotBtn = new v({
+    const t = this.settings.screenshot === !0;
+    t && this.screenshotBtn === null && (this.screenshotBtn = new v({
       variant: "outline",
       size: "icon",
-      label: hn(),
-      icon: b.screenshot(),
+      label: gn(),
+      icon: g.screenshot(),
       onClick: () => {
-        this.options.snapshotApi.take("snapshot.png").onDeveloped(({ data: t, filename: i }) => {
-          ns(t, i);
+        this.options.snapshotApi.take("snapshot.png").onDeveloped(({ data: e, filename: i }) => {
+          lo(e, i);
         });
       }
-    })), !e && this.screenshotBtn !== null && (this.screenshotBtn.element.remove(), this.screenshotBtn = null);
+    })), !t && this.screenshotBtn !== null && (this.screenshotBtn.element.remove(), this.screenshotBtn = null);
   }
   placeScreenshotButton() {
     this.screenshotBtn === null || this.slots.topRight === null || (this.cameraControls !== null ? this.cameraControls.element.appendChild(this.screenshotBtn.element) : this.slots.topRight.appendChild(this.screenshotBtn.element));
   }
 }
-const ss = {};
-class os {
+const uo = {};
+class ho {
   defaultServer = "https://server.virtualdisplay.io";
   options;
   serverHost;
   extraParams;
-  constructor(e, t, i) {
-    this.options = e, this.serverHost = t, this.extraParams = i;
+  constructor(t, e, i) {
+    this.options = t, this.serverHost = e, this.extraParams = i;
   }
   /**
    * Create container and iframe, attach to parent element
    */
   create() {
-    const e = this.createContainer(), t = this.createIframe();
-    return e.appendChild(t), this.attachToParent(e), { container: e, iframe: t };
+    const t = this.createContainer(), e = this.createIframe();
+    return t.appendChild(e), this.attachToParent(t), { container: t, iframe: e };
   }
   createContainer() {
-    const e = document.createElement("div");
-    return e.className = "vd-container", Object.assign(e.style, {
+    const t = document.createElement("div");
+    return t.className = "vd-container", Object.assign(t.style, {
       position: "relative",
       width: "100%",
       height: "100%",
       overflow: "hidden"
-    }), e;
+    }), t;
   }
   createIframe() {
-    const e = document.createElement("iframe");
-    return e.src = this.buildUrl(), e.setAttribute("allow", "xr-spatial-tracking; fullscreen"), e;
+    const t = document.createElement("iframe");
+    return t.src = this.buildUrl(), t.setAttribute("allow", "xr-spatial-tracking; fullscreen"), t;
   }
-  attachToParent(e) {
-    this.getParentElement().appendChild(e);
+  attachToParent(t) {
+    this.getParentElement().appendChild(t);
   }
   buildUrl() {
-    const e = this.getServerUrl(), t = new URL(e);
-    this.setAddressParams(t), this.options.language !== void 0 && t.searchParams.set("language", this.options.language), this.options.session !== void 0 && t.searchParams.set("session", this.options.session), this.options.debug === !0 && t.searchParams.set("debug", "true"), this.options.traceparent !== void 0 && t.searchParams.set("traceparent", this.options.traceparent);
-    for (const [i, s] of Object.entries(this.extraParams ?? {}))
-      t.searchParams.set(i, s);
-    return t.toString();
+    const t = this.getServerUrl(), e = new URL(t);
+    this.setAddressParams(e), this.options.language !== void 0 && e.searchParams.set("language", this.options.language), this.options.session !== void 0 && e.searchParams.set("session", this.options.session), this.options.debug === !0 && e.searchParams.set("debug", "true"), this.options.traceparent !== void 0 && e.searchParams.set("traceparent", this.options.traceparent);
+    for (const [i, o] of Object.entries(this.extraParams ?? {}))
+      e.searchParams.set(i, o);
+    return e.toString();
   }
   /**
    * Put the address form on the URL. `app` names an app row; the
@@ -3478,70 +3563,70 @@ class os {
    * given, `app` wins and the pair is ignored with a warning, so adding `app`
    * to an existing integration is additive rather than a swap.
    */
-  setAddressParams(e) {
+  setAddressParams(t) {
     if (this.options.app === void 0) {
-      e.searchParams.set("license", this.options.license), e.searchParams.set("model", this.options.model);
+      t.searchParams.set("license", this.options.license), t.searchParams.set("model", this.options.model);
       return;
     }
-    e.searchParams.set("app", this.options.app), (this.options.license !== void 0 || this.options.model !== void 0) && C.warn("Both `app` and `license`/`model` were supplied: `app` wins, the pair was ignored");
+    t.searchParams.set("app", this.options.app), (this.options.license !== void 0 || this.options.model !== void 0) && k.warn("Both `app` and `license`/`model` were supplied: `app` wins, the pair was ignored");
   }
   getServerUrl() {
     if (this.serverHost !== void 0)
       return this.serverHost;
-    if (ss?.VITE_VIRTUALDISPLAY_SERVER_HOST === void 0)
+    if (uo?.VITE_VIRTUALDISPLAY_SERVER_HOST === void 0)
       return this.defaultServer;
   }
   getParentElement() {
     if (typeof this.options.parent != "string")
       return this.options.parent;
-    const e = document.querySelector(this.options.parent);
-    if (e === null)
-      throw g.parentNotFound(this.options.parent);
-    return e;
+    const t = document.querySelector(this.options.parent);
+    if (t === null)
+      throw y.parentNotFound(this.options.parent);
+    return t;
   }
 }
-function rs(n) {
-  const { messenger: e } = n;
-  e.on(c.HANDSHAKE, (t) => {
-    Me(t) && (C.info("Server handshake received, flushing publisher queue"), e.markReady());
-  }), e.on(c.SESSION, (t) => {
-    ze(t) && n.onSession(t.sessionId);
-  }), e.on(c.MUTATION, (t) => {
-    Fe(t) && (n.attributes.handleMutationResult(t), n.configuration.handleSelectionChanged(n.attributes.getSelection()));
-  }), e.on(c.SNAPSHOT, (t) => {
-    De(t) && n.snapshot.handleSnapshotResult(t);
-  }), e.on(c.CAMERA, (t) => {
-    $e(t) && n.cameraPosition.handlePositionUpdate(t);
-  }), e.on(c.LOADING_INDICATOR, (t) => {
-    Be(t) && (t.error !== void 0 ? n.ui.showError(t.error) : n.ui.updateProgress(t.progress, t.phase));
-  }), e.on(c.CONFIG, (t) => {
-    He(t) && n.applyConfig(t);
-  }), e.on(c.MAPPING, (t) => {
-    Ue(t) && (n.attributes.handleMappingReceived(t), n.configuration.handleSelectionChanged(n.attributes.getSelection()), n.ui.renderAttributeControls(n.attributes, t.attributes), n.readyStateTracker.handleMappingReceived());
-  }), as(n);
-}
-function as(n) {
-  const { messenger: e } = n;
-  e.on(c.FOCUS, (t) => {
-    qe(t) && n.focus.handleStateReceived(t);
-  }), e.on(c.PRICING, (t) => {
-    Ge(t) && n.configuration.handlePricingReceived(t.pricing);
-  }), e.on(c.SYNC, (t) => {
-    Ve(t) && n.onSync(t.connected);
-  }), e.on(c.SELECTABLE, (t) => {
-    je(t) && (n.selectable.handleSnapshot(t), n.ui.applySelectable(t.attributes));
-  }), e.on(c.APP_RESOLVED, (t) => {
-    Pe(t) && n.onAppResolved(t);
+function po(n) {
+  const { messenger: t } = n;
+  t.on(c.HANDSHAKE, (e) => {
+    Nt(e) && (k.info("Server handshake received, flushing publisher queue"), t.markReady());
+  }), t.on(c.SESSION, (e) => {
+    zt(e) && n.onSession(e.sessionId);
+  }), t.on(c.MUTATION, (e) => {
+    Ft(e) && (n.attributes.handleMutationResult(e), n.configuration.handleSelectionChanged(n.attributes.getSelection()));
+  }), t.on(c.SNAPSHOT, (e) => {
+    Dt(e) && n.snapshot.handleSnapshotResult(e);
+  }), t.on(c.CAMERA, (e) => {
+    $t(e) && n.cameraPosition.handlePositionUpdate(e);
+  }), t.on(c.LOADING_INDICATOR, (e) => {
+    Ut(e) && (e.error !== void 0 ? n.ui.showError(e.error) : n.ui.updateProgress(e.progress, e.phase));
+  }), t.on(c.CONFIG, (e) => {
+    Ht(e) && n.applyConfig(e);
+  }), t.on(c.MAPPING, (e) => {
+    Bt(e) && (n.attributes.handleMappingReceived(e), n.configuration.handleSelectionChanged(n.attributes.getSelection()), n.ui.renderAttributeControls(n.attributes, e.attributes), n.readyStateTracker.handleMappingReceived());
+  }), mo(n);
+}
+function mo(n) {
+  const { messenger: t } = n;
+  t.on(c.FOCUS, (e) => {
+    qt(e) && n.focus.handleStateReceived(e);
+  }), t.on(c.PRICING, (e) => {
+    Gt(e) && n.configuration.handlePricingReceived(e.pricing);
+  }), t.on(c.SYNC, (e) => {
+    Vt(e) && n.onSync(e.connected);
+  }), t.on(c.SELECTABLE, (e) => {
+    jt(e) && (n.selectable.handleSnapshot(e), n.ui.applySelectable(e.attributes));
+  }), t.on(c.APP_RESOLVED, (e) => {
+    Pt(e) && n.onAppResolved(e);
   });
 }
-class ls {
+class fo {
   ready = !1;
   onReady;
-  constructor(e) {
-    this.onReady = e;
+  constructor(t) {
+    this.onReady = t;
   }
   handleMappingReceived() {
-    this.ready || (this.ready = !0, C.info("Mapping received from server, client is now ready"), this.onReady?.());
+    this.ready || (this.ready = !0, k.info("Mapping received from server, client is now ready"), this.onReady?.());
   }
   get isReady() {
     return this.ready;
@@ -3550,13 +3635,13 @@ class ls {
     this.ready = !1;
   }
 }
-function cs(n) {
+function go(n) {
   if (n === void 0)
     return;
-  const { annotations: e, ...t } = n;
-  return e === void 0 ? t : e === !0 ? { ...t, annotations: "show" } : e === !1 ? { ...t, annotations: "hide" } : { ...t, annotations: e };
+  const { annotations: t, ...e } = n;
+  return t === void 0 ? e : t === !0 ? { ...e, annotations: "show" } : t === !1 ? { ...e, annotations: "hide" } : { ...e, annotations: t };
 }
-class us {
+class bo {
   attributes;
   selectableState;
   readyStateTracker;
@@ -3572,9 +3657,9 @@ class us {
   options;
   serverHost;
   iframeParams;
-  /** The composed AR flow, or undefined in builds without one (the studio). */
+  /** The composed AR flow, or undefined in a build that composes none. */
   arActivation;
-  /** The composed sync tracker, or undefined in builds without one (the studio). */
+  /** The composed sync tracker, or undefined in a build that composes none. */
   syncTracker;
   iframe;
   container;
@@ -3585,56 +3670,72 @@ class us {
   /** Which app the viewer resolved, once reported (APP_RESOLVED). */
   resolvedApp;
   appResolvedCallbacks = [];
-  constructor(e, t) {
-    this.options = e;
-    const i = t ?? {};
-    this.serverHost = i.serverHost, this.iframeParams = i.iframeParams, this.initializeLogging(), this.messenger = new Ze(
+  constructor(t, e) {
+    this.options = t;
+    const i = e ?? {};
+    this.serverHost = i.serverHost, this.iframeParams = i.iframeParams, this.initializeLogging(), this.messenger = new Zt(
       () => this.iframe?.contentWindow ?? null,
       i.messengerOptions
     );
-    const s = (o) => {
-      this.messenger.send(o);
+    const o = (s) => {
+      this.messenger.send(s);
     };
-    this.attributes = new pt(s, F, (o, r) => {
-      this.notifyMutationFailed(o, r);
-    }), this.selectableState = new ft(), this.snapshotApi = new kt(s), this.annotationsApi = new We(s, F), this.cameraApi = new gt(s), this.cameraPositionApi = new bt(), this.focusApi = new wt(s, (o) => {
-      this.dispatchFocusChange(o);
-    }, F), this.configurationApi = new St(
-      (o) => {
-        this.dispatchConfigurationChange(o);
+    this.attributes = new me(o, L, (s, r) => {
+      this.notifyMutationFailed(s, r);
+    }), this.selectableState = new fe(), this.snapshotApi = new Ce(o), this.annotationsApi = new Wt(o, L), this.cameraApi = new ge(o), this.cameraPositionApi = new be(), this.focusApi = new Se(o, (s) => {
+      this.dispatchFocusChange(s);
+    }, L), this.configurationApi = new we(
+      (s) => {
+        this.dispatchConfigurationChange(s);
       },
-      (o) => {
-        this.dispatchConfigurationSubmit(o);
+      (s) => {
+        this.dispatchConfigurationSubmit(s);
       }
-    ), this.eventBus = new _t(), this.arActivation = i.createArActivation?.(s), this.syncTracker = i.createSyncTracker?.(), this.readyStateTracker = new ls(() => {
+    ), this.eventBus = new _e(), this.arActivation = i.createArActivation?.(o), this.syncTracker = i.createSyncTracker?.(), this.readyStateTracker = new fo(() => {
       this.notifyReady();
-    }), this.ui = this.createStandardInterface(), this.wireIncomingMessages(), i.registerHandlers?.(this.messenger, s), this.messenger.start(), this.createAndConnectIframe();
+    }), this.ui = this.createStandardInterface(), this.wireIncomingMessages(), i.registerHandlers?.(this.messenger, o), this.messenger.start(), this.createAndConnectIframe();
   }
   /** The configurator UI, every callback bridging it to the facade that owns the action. */
   createStandardInterface() {
-    const e = this.arActivation;
-    return new is({
+    const t = this.arActivation;
+    return new co({
       snapshotApi: this.snapshotApi,
       cameraApi: this.cameraApi,
       cameraPositionApi: this.cameraPositionApi,
       eventBus: this.eventBus,
       configuration: this.configurationApi,
-      onSelect: (t, i) => this.attributes.select(t, i),
-      onSelectTransient: (t, i) => this.attributes.selectTransient(t, i),
-      onSubscribe: (t, i) => this.attributes.onChange(t, i),
-      ...e !== void 0 && {
+      onSelect: (e, i) => this.attributes.select(e, i),
+      onSelectTransient: (e, i) => this.attributes.selectTransient(e, i),
+      onSubscribe: (e, i) => this.attributes.onChange(e, i),
+      ...t !== void 0 && {
         onAr: () => {
-          e.activate();
+          t.activate();
         }
       },
       onFullscreenEnter: () => {
         this.trackFullscreen();
+      },
+      onAnnotationsToggle: (e) => {
+        this.sendControlAnnotationToggle(e);
       }
     });
   }
+  // The visible toggle composes its message here because it is the one sender
+  // allowed to stamp `origin: 'control'`: the viewer only counts
+  // control-originated flips as Shopper use. The public `client.annotations`
+  // facade stays origin-less on purpose. One send per member instance once
+  // composition lands; today the host is the only one.
+  sendControlAnnotationToggle(t) {
+    this.messenger.send({
+      type: c.ANNOTATION_TOGGLE,
+      instance: L,
+      enabled: t,
+      origin: "control"
+    });
+  }
   /** Wire the inbound viewer protocol to the facades. */
   wireIncomingMessages() {
-    rs({
+    po({
       messenger: this.messenger,
       attributes: this.attributes,
       selectable: this.selectableState,
@@ -3644,176 +3745,173 @@ class us {
       focus: this.focusApi,
       ui: this.ui,
       readyStateTracker: this.readyStateTracker,
-      applyConfig: (e) => {
-        this.handleConfig(e);
+      applyConfig: (t) => {
+        this.handleConfig(t);
       },
-      onSession: (e) => {
-        this.handleSession(e);
+      onSession: (t) => {
+        this.handleSession(t);
       },
-      onSync: (e) => {
-        this.syncTracker?.handleSync(e);
+      onSync: (t) => {
+        this.syncTracker?.handleSync(t);
       },
-      onAppResolved: (e) => {
+      onAppResolved: (t) => {
         this.handleAppResolved({
-          appType: e.appType,
-          name: e.name,
-          ...e.slug !== void 0 && { slug: e.slug },
-          ...e.submit !== void 0 && { submit: e.submit }
+          appType: t.appType,
+          name: t.name,
+          ...t.slug !== void 0 && { slug: t.slug },
+          ...t.submit !== void 0 && { submit: t.submit }
         });
       }
     });
   }
   /** Store the resolved app and notify every registered `onAppResolved` callback. */
-  handleAppResolved(e) {
-    this.resolvedApp = e;
-    for (const t of this.appResolvedCallbacks)
-      t(e);
+  handleAppResolved(t) {
+    this.resolvedApp = t;
+    for (const e of this.appResolvedCallbacks)
+      e(t);
   }
   /** Store the tracking session id and hand it to the AR flow, which waits on it for the QR. */
-  handleSession(e) {
-    this.viewerSessionId = e, this.arActivation?.onSession(e);
+  handleSession(t) {
+    this.viewerSessionId = t, this.arActivation?.onSession(t);
   }
   /** Forward a failed mutation to every registered `onMutationFailed` callback. */
-  notifyMutationFailed(e, t) {
+  notifyMutationFailed(t, e) {
     for (const i of this.mutationFailedCallbacks)
-      i({ attribute: e, value: t });
+      i({ attribute: t, value: e });
   }
   /** Flush the queued `onReady` callbacks once, then let the standard interface know. */
   notifyReady() {
-    const e = this.readyCallbacks;
+    const t = this.readyCallbacks;
     this.readyCallbacks = [];
-    for (const t of e)
-      t(this);
+    for (const e of t)
+      e(this);
     this.ui.onReady();
   }
   /**
    * Dispatch a bubbling `vd:focus-change` event on the container so a page can
    * react to focus without registering an `onChange` callback.
    */
-  dispatchFocusChange(e) {
+  dispatchFocusChange(t) {
     this.container?.dispatchEvent(
-      new CustomEvent(T.FOCUS_CHANGE, { detail: e, bubbles: !0 })
+      new CustomEvent(T.FOCUS_CHANGE, { detail: t, bubbles: !0 })
     );
   }
   /**
    * Dispatch a bubbling `vd:configuration-change` event on the container so a
    * page or tag manager can react to price changes without a client callback.
    */
-  dispatchConfigurationChange(e) {
+  dispatchConfigurationChange(t) {
     this.container?.dispatchEvent(
-      new CustomEvent(T.CONFIGURATION_CHANGE, { detail: e ?? null, bubbles: !0 })
+      new CustomEvent(T.CONFIGURATION_CHANGE, { detail: t ?? null, bubbles: !0 })
     );
   }
   /** Dispatch a bubbling `vd:configuration-submit` event when the CTA is used. */
-  dispatchConfigurationSubmit(e) {
+  dispatchConfigurationSubmit(t) {
     this.container?.dispatchEvent(
-      new CustomEvent(T.CONFIGURATION_SUBMIT, { detail: e, bubbles: !0 })
+      new CustomEvent(T.CONFIGURATION_SUBMIT, { detail: t, bubbles: !0 })
     );
   }
-  handleConfig(e) {
-    const t = e.viewerSettings, i = cs(this.options.viewerSettings);
-    if (t !== void 0 || i !== void 0) {
-      const s = i !== void 0 ? { ...t ?? {}, ...i } : t;
-      if (i !== void 0 && t !== void 0) {
-        const o = Object.entries(i).filter(([r, a]) => t[r] !== a).map(
-          ([r, a]) => `${r} (metadata: ${t[r] ?? "undefined"}, override: ${a})`
+  handleConfig(t) {
+    const e = t.viewerSettings, i = go(this.options.viewerSettings);
+    if (e !== void 0 || i !== void 0) {
+      const o = i !== void 0 ? { ...e ?? {}, ...i } : e;
+      if (i !== void 0 && e !== void 0) {
+        const s = Object.entries(i).filter(([r, a]) => e[r] !== a).map(
+          ([r, a]) => `${r} (metadata: ${e[r] ?? "undefined"}, override: ${a})`
         );
-        o.length > 0 && C.warn(`Viewer settings override active: ${o.join(", ")}`);
+        s.length > 0 && k.warn(`Viewer settings override active: ${s.join(", ")}`);
       }
-      this.ui.applyViewerSettings(s), this.echoAnnotationsDifference(t?.annotations, s.annotations);
+      this.ui.applyViewerSettings(o), this.echoAnnotationsDifference(e?.annotations, o.annotations);
     }
-    this.cameraPositionApi.applyLimits(e.cameraLimits);
+    this.cameraPositionApi.applyLimits(t.cameraLimits);
   }
+  // The viewer already applied the announced mode itself, so speaking up when
+  // the merged mode matches would toggle it back and forth for nothing. A boot
+  // without overrides therefore sends no toggle at all.
   /**
-   * The difference echo: the viewer already applied the app-config mode
-   * itself, so the client only speaks up when the merged mode (config plus
-   * integrator override) differs from what CONFIG announced, in either
-   * direction. Equal modes echo nothing, so a boot without overrides sends
-   * no toggle at all.
+   * Tell the viewer about the annotation mode only when the merged mode differs
+   * from the one it announced.
    */
-  echoAnnotationsDifference(e, t) {
-    t === void 0 || t === e || this.annotationsApi.setEnabled(t === "show" || t === "toggle-shown");
+  echoAnnotationsDifference(t, e) {
+    e === void 0 || e === t || this.annotationsApi.setEnabled(e === "show" || e === "toggle-shown");
   }
   /** Tell the viewer the user entered fullscreen, so it records the engagement. */
   trackFullscreen() {
     this.messenger.send({ type: c.FULLSCREEN });
   }
   initializeLogging() {
-    this.options.debug === !0 && mt(), C.info("Initializing Virtualdisplay client", {
+    this.options.debug === !0 && pe(), k.info("Initializing Virtualdisplay client", {
       ...this.options.app === void 0 ? { model: this.options.model } : { app: this.options.app }
     });
   }
   createAndConnectIframe() {
-    const t = new os(this.options, this.serverHost, this.iframeParams).create();
-    this.container = t.container, this.iframe = t.iframe, this.eventBus.attach(this.container), this.ui.attach(this.container);
+    const e = new ho(this.options, this.serverHost, this.iframeParams).create();
+    this.container = e.container, this.iframe = e.iframe, this.eventBus.attach(this.container), this.ui.attach(this.container);
     try {
       const i = new URL(this.iframe.src).origin;
       this.messenger.setTargetOrigin(i);
     } catch {
     }
   }
-  select(e, t) {
-    this.attributes.select(e, t);
+  select(t, e) {
+    this.attributes.select(t, e);
   }
-  getValues(e) {
-    return this.attributes.getValues(e);
+  getValues(t) {
+    return this.attributes.getValues(t);
   }
-  getValue(e, t) {
-    return this.attributes.getValue(e, t);
+  getValue(t, e) {
+    return this.attributes.getValue(t, e);
   }
-  onChange(e, t) {
-    this.attributes.onChange(e, t);
+  onChange(t, e) {
+    this.attributes.onChange(t, e);
   }
-  getAttribute(e) {
-    return this.attributes.getAttribute(e);
+  getAttribute(t) {
+    return this.attributes.getAttribute(t);
   }
   get isReady() {
     return this.readyStateTracker.isReady;
   }
-  onReady(e) {
+  onReady(t) {
     if (this.readyStateTracker.isReady) {
-      e(this);
+      t(this);
       return;
     }
-    this.readyCallbacks.push(e);
+    this.readyCallbacks.push(t);
   }
-  onMutationFailed(e) {
-    this.mutationFailedCallbacks.push(e);
+  onMutationFailed(t) {
+    this.mutationFailedCallbacks.push(t);
   }
   /**
-   * Subscribe to the viewer's selectability snapshots (kiesbaarheid live):
-   * per attribute, which values the buyer can pick right now. Fires with the
-   * current snapshot immediately when one already arrived. A model without
-   * exclusions never sends one: everything stays selectable and this never
-   * fires.
+   * Subscribe to which values can be picked right now, per attribute. Fires
+   * immediately when a snapshot already arrived. A model with no exclusions
+   * never sends one, so this never fires and everything stays selectable.
    */
-  onSelectableChange(e) {
-    this.selectableState.onChange(e);
+  onSelectableChange(t) {
+    this.selectableState.onChange(t);
   }
   /**
    * Subscribe to which app this viewer resolved (type, name, public submit
    * settings). Reported once by the viewer after its resolve; fires immediately
    * when the report already arrived, so registration order does not matter.
    */
-  onAppResolved(e) {
-    this.appResolvedCallbacks.push(e), this.resolvedApp !== void 0 && e(this.resolvedApp);
+  onAppResolved(t) {
+    this.appResolvedCallbacks.push(t), this.resolvedApp !== void 0 && t(this.resolvedApp);
   }
   /** The selectable values for one attribute right now, or null when unrestricted. */
-  getSelectable(e) {
-    return this.selectableState.selectableFor(e);
+  getSelectable(t) {
+    return this.selectableState.selectableFor(t);
   }
+  // Exists for a host page that hides the built-in button and owns its own AR
+  // affordance: without this it would have no way into the same flow.
   /**
-   * Trigger the composed AR flow directly (ar-session-handoff task 035): a host
-   * page that hides the built-in corner button (`viewerSettings.ar = false`,
-   * e.g. the AR landing, which owns a single custom AR affordance) still needs
-   * an entry point to the same flow that button would have called. A no-op
-   * where no AR flow is composed (the studio client has none).
+   * Start the AR flow directly, as the built-in AR button would. Does nothing
+   * when `viewerSettings.ar` is off or the build composes no AR flow.
    */
   activateAr() {
     this.arActivation?.activate();
   }
-  on(e, t) {
-    this.eventBus.on(e, t);
+  on(t, e) {
+    this.eventBus.on(t, e);
   }
   get annotations() {
     return this.annotationsApi;
@@ -3844,15 +3942,15 @@ class us {
     this.readyStateTracker.clear(), this.readyCallbacks = [], this.mutationFailedCallbacks.length = 0, this.snapshotApi.clear(), this.messenger.destroy(), this.arActivation?.destroy(), this.ui.destroy(), this.container?.parentElement !== null && this.container?.parentElement !== void 0 && this.container.parentElement.removeChild(this.container), this.container = void 0, this.iframe = void 0;
   }
 }
-const ds = "ar.virtualdisplay.io";
-function hs(n) {
-  const e = new URL(`https://${ds}/go`);
-  return n.sessionId !== void 0 ? e.searchParams.set("session", n.sessionId) : n.app !== void 0 ? e.searchParams.set("app", n.app) : n.license !== void 0 && n.model !== void 0 && (e.searchParams.set("license", n.license), e.searchParams.set("model", n.model)), e.toString();
+const vo = "ar.virtualdisplay.io";
+function yo(n) {
+  const t = new URL(`https://${vo}/go`);
+  return n.sessionId !== void 0 ? t.searchParams.set("session", n.sessionId) : n.app !== void 0 ? t.searchParams.set("app", n.app) : n.license !== void 0 && n.model !== void 0 && (t.searchParams.set("license", n.license), t.searchParams.set("model", n.model)), t.toString();
 }
-const ms = 1500;
-class ps {
+const wo = 1500;
+class So {
   options;
-  qrModal = new Ti();
+  qrModal = new Ni();
   /** The viewer's tracking session id, once the engine announces it (SESSION). */
   sessionId;
   /** Callbacks waiting on the SESSION message, resolved (or timed out) exactly once each. */
@@ -3861,20 +3959,20 @@ class ps {
   pendingTimers = /* @__PURE__ */ new Set();
   /** Set on destroy: an in-flight hand-off must not re-mount the modal or send QR_SHOWN. */
   destroyed = !1;
-  constructor(e) {
-    this.options = e;
+  constructor(t) {
+    this.options = t;
   }
   /** Store the engine-announced tracking session id and resolve anyone waiting on it. */
-  onSession(e) {
-    this.sessionId = e;
-    const t = this.waiters;
+  onSession(t) {
+    this.sessionId = t;
+    const e = this.waiters;
     this.waiters = [];
-    for (const i of t)
-      i(e);
+    for (const i of e)
+      i(t);
   }
   /** The AR button handler: mobile activates AR in the engine, desktop shows the hand-off QR. */
   activate() {
-    if (dt()) {
+    if (ue()) {
       this.options.send({ type: c.AR_ACTIVATE });
       return;
     }
@@ -3882,8 +3980,8 @@ class ps {
   }
   destroy() {
     this.destroyed = !0;
-    for (const e of this.pendingTimers)
-      clearTimeout(e);
+    for (const t of this.pendingTimers)
+      clearTimeout(t);
     this.pendingTimers.clear(), this.waiters = [], this.qrModal.hide();
   }
   /**
@@ -3895,15 +3993,15 @@ class ps {
    */
   async showQrCode() {
     this.qrModal.show();
-    const e = await this.waitForSessionId();
+    const t = await this.waitForSessionId();
     if (this.destroyed)
       return;
-    const t = hs({
-      sessionId: e,
+    const e = yo({
+      sessionId: t,
       app: this.options.app,
       license: this.options.license,
       model: this.options.model
-    }), i = await this.qrModal.update(t);
+    }), i = await this.qrModal.update(e);
     if (this.destroyed) {
       this.qrModal.hide();
       return;
@@ -3917,61 +4015,61 @@ class ps {
    * rather than encoding a wrong one.
    */
   waitForSessionId() {
-    return this.sessionId !== void 0 ? Promise.resolve(this.sessionId) : new Promise((e) => {
-      const t = setTimeout(() => {
-        this.pendingTimers.delete(t), e(void 0);
-      }, ms);
-      this.pendingTimers.add(t), this.waiters.push((i) => {
-        this.pendingTimers.delete(t), clearTimeout(t), e(i);
+    return this.sessionId !== void 0 ? Promise.resolve(this.sessionId) : new Promise((t) => {
+      const e = setTimeout(() => {
+        this.pendingTimers.delete(e), t(void 0);
+      }, wo);
+      this.pendingTimers.add(e), this.waiters.push((i) => {
+        this.pendingTimers.delete(e), clearTimeout(e), t(i);
       });
     });
   }
 }
-class fs {
+class ko {
   callbacks = [];
   lastKnown;
-  handleSync(e) {
-    this.lastKnown = e;
-    for (const t of this.callbacks)
-      t(e);
+  handleSync(t) {
+    this.lastKnown = t;
+    for (const e of this.callbacks)
+      e(t);
   }
-  onChange(e) {
-    this.callbacks.push(e), this.lastKnown !== void 0 && e(this.lastKnown);
+  onChange(t) {
+    this.callbacks.push(t), this.lastKnown !== void 0 && t(this.lastKnown);
   }
 }
-class vs extends us {
+class Ao extends bo {
   syncStatusTracker;
-  constructor(e) {
-    const t = new fs();
-    super(e, {
-      createArActivation: (i) => new ps({
-        app: e.app,
-        license: e.license,
-        model: e.model,
+  constructor(t) {
+    const e = new ko();
+    super(t, {
+      createArActivation: (i) => new So({
+        app: t.app,
+        license: t.license,
+        model: t.model,
         send: i
       }),
-      createSyncTracker: () => t
-    }), this.syncStatusTracker = t;
+      createSyncTracker: () => e
+    }), this.syncStatusTracker = e;
   }
   /** Subscribe to the live sync channel's connection state (ar-session-handoff). Latest-wins, no buffering. */
-  onSyncChange(e) {
-    this.syncStatusTracker.onChange(e);
+  onSyncChange(t) {
+    this.syncStatusTracker.onChange(t);
   }
 }
 export {
-  We as Annotations,
-  Qe as Attribute,
-  Ye as AttributeValue,
-  gt as Camera,
-  St as Configuration,
+  Wt as Annotations,
+  Yt as Attribute,
+  Qt as AttributeValue,
+  ge as Camera,
+  we as Configuration,
   A as ERROR_CODES,
-  wt as Focus,
-  Ct as Photo,
-  kt as Snapshot,
+  Se as Focus,
+  ke as Photo,
+  Ce as Snapshot,
   T as VD_EVENTS,
-  vs as VirtualdisplayClient,
-  g as VirtualdisplayError,
-  mt as enableDebugMode,
-  gs as isDebugMode,
-  C as logger
+  Ao as VirtualdisplayClient,
+  y as VirtualdisplayError,
+  pe as enableDebugMode,
+  Co as isDebugMode,
+  k as logger
 };