@alfadocs/ui-kit-debug 0.1.8 → 0.1.9

package/dist/_chunks/{tooth-scheme.agent-BlDyu-Gx.js → tooth-scheme.agent-CWrQBjJM.js}

@@ -1,8 +1,8 @@
-import { jsx as i, jsxs as $ } from "react/jsx-runtime";
-import { forwardRef as mt, useId as pt, useMemo as Z, useState as G, useEffect as et, useRef as gt, useCallback as q, useImperativeHandle as vt } from "react";
-import * as E from "@radix-ui/react-tooltip";
+import { jsx as i, jsxs as S } from "react/jsx-runtime";
+import { forwardRef as pt, useId as gt, useMemo as Z, useState as G, useEffect as nt, useRef as vt, useCallback as U, useImperativeHandle as xt } from "react";
+import * as D from "@radix-ui/react-tooltip";
 import { c as M } from "./index-D2ZczOXr.js";
-import { useTranslation as ot } from "react-i18next";
+import { useTranslation as ct } from "react-i18next";
 const X = [
   // upper
   "18",
@@ -62,17 +62,17 @@ const X = [
   "74",
   "75"
 ];
-function xt(n) {
+function wt(n) {
   return n <= 2 ? "incisor" : n === 3 ? "canine" : n <= 5 ? "premolar" : "molar";
 }
-function wt(n) {
+function yt(n) {
   return n <= 2 ? "incisor" : n === 3 ? "canine" : "molar";
 }
-function yt(n, e) {
+function bt(n, e) {
   const r = (n - 1) % 4 + 1;
   return `${r === 1 ? "UR" : r === 2 ? "UL" : r === 3 ? "LL" : "LR"}${e}`;
 }
-function bt(n, e) {
+function Ct(n, e) {
   switch (n) {
     case 1:
       return String(1 + (8 - e));
@@ -86,7 +86,7 @@ function bt(n, e) {
       return "";
   }
 }
-function Ct(n, e) {
+function Tt(n, e) {
   const r = "ABCDEFGHIJKLMNOPQRST";
   let a = -1;
   switch (n) {
@@ -107,35 +107,35 @@ function Ct(n, e) {
   }
   return a >= 0 ? r[a] : "";
 }
-function Tt(n) {
-  const e = Number(n[0]), r = Number(n[1]), a = e >= 5, O = a ? wt(r) : xt(r), b = e === 1 || e === 2 || e === 5 || e === 6 ? "upper" : "lower", u = e === 1 || e === 4 || e === 5 || e === 8 ? "right" : "left", g = a ? Ct(e, r) : bt(e, r), N = yt(e, r);
+function kt(n) {
+  const e = Number(n[0]), r = Number(n[1]), a = e >= 5, h = a ? yt(r) : wt(r), N = e === 1 || e === 2 || e === 5 || e === 6 ? "upper" : "lower", w = e === 1 || e === 4 || e === 5 || e === 8 ? "right" : "left", u = a ? Tt(e, r) : Ct(e, r), v = bt(e, r);
   return {
     fdi: n,
-    universal: g,
-    palmer: N,
+    universal: u,
+    palmer: v,
     quadrant: e,
     positionInQuadrant: r,
-    anatomy: O,
-    arch: b,
-    side: u,
+    anatomy: h,
+    arch: N,
+    side: w,
     dentition: a ? "primary" : "permanent"
   };
 }
-const y = [
+const b = [
   ...X,
   ...J
-].reduce((n, e) => (n[e] = Tt(e), n), {}), kt = Object.fromEntries(
-  Object.entries(y).map(([n, e]) => [n, e.universal])
-), Lt = Object.fromEntries(
-  Object.entries(y).map(([n, e]) => [n, e.palmer])
-), Ot = {
+].reduce((n, e) => (n[e] = kt(e), n), {}), Lt = Object.fromEntries(
+  Object.entries(b).map(([n, e]) => [n, e.universal])
+), Ot = Object.fromEntries(
+  Object.entries(b).map(([n, e]) => [n, e.palmer])
+), It = {
   caries: "--destructive",
   filled: "--info",
   crowned: "--warning",
   missing: "--muted-foreground",
   implant: "--accent",
   rootCanal: "--primary"
-}, S = {
+}, $ = {
   caries: "var(--destructive)",
   filled: "var(--info)",
   crowned: "var(--warning)",
@@ -176,55 +176,55 @@ const y = [
     path: "M4 4 C4 2 6 0 8 0 L24 0 C26 0 28 2 28 4 L30 44 C30 47 28 50 24 50 L8 50 C4 50 2 47 2 44 Z",
     innerPath: "M6 32 L26 32 M16 22 L16 42"
   }
-}, j = 4, nt = 24, L = 4;
-function It(n) {
+}, _ = 4, rt = 24, O = 4;
+function St(n) {
   const e = n === "primary" ? J : n === "mixed" ? [...X, ...J] : X, r = [], a = [];
-  for (const h of e)
-    y[h].arch === "upper" ? r.push(h) : a.push(h);
-  const O = 50, b = Math.max(r.length, a.length);
-  function u(h, f) {
-    const V = h.reduce((w, v) => {
-      const x = K[y[v].anatomy];
-      return w + x.width + j;
-    }, 0), U = h.length > 0 ? V - j : 0;
+  for (const o of e)
+    b[o].arch === "upper" ? r.push(o) : a.push(o);
+  const h = 50, N = Math.max(r.length, a.length);
+  function w(o, p) {
+    const E = o.reduce((g, y) => {
+      const x = K[b[y].anatomy];
+      return g + x.width + _;
+    }, 0), q = o.length > 0 ? E - _ : 0;
     let C = ((function() {
-      return (r.length >= a.length ? r : a).reduce((_, A) => {
-        const H = K[y[A].anatomy];
-        return _ + H.width + j;
-      }, 0) - j;
-    })() - U) / 2;
-    return h.map((w) => {
-      const v = y[w], x = K[v.anatomy], _ = {
-        fdi: w,
-        meta: v,
+      return (r.length >= a.length ? r : a).reduce((T, V) => {
+        const R = K[b[V].anatomy];
+        return T + R.width + _;
+      }, 0) - _;
+    })() - q) / 2;
+    return o.map((g) => {
+      const y = b[g], x = K[y.anatomy], T = {
+        fdi: g,
+        meta: y,
         shape: x,
         x: C,
-        y: f
+        y: p
       };
-      return C += x.width + j, _;
+      return C += x.width + _, T;
     });
   }
-  const g = u(r, 0), N = u(a, O + nt), W = Math.max(
-    g.reduce((h, f) => Math.max(h, f.x + f.shape.width), 0),
-    N.reduce((h, f) => Math.max(h, f.x + f.shape.width), 0)
-  ), z = W > 0 ? W : b * 30, c = O * 2 + nt;
-  return { teeth: [...g, ...N], width: z, height: c };
+  const u = w(r, 0), v = w(a, h + rt), j = Math.max(
+    u.reduce((o, p) => Math.max(o, p.x + p.shape.width), 0),
+    v.reduce((o, p) => Math.max(o, p.x + p.shape.width), 0)
+  ), H = j > 0 ? j : N * 30, F = h * 2 + rt;
+  return { teeth: [...u, ...v], width: H, height: F };
 }
-function rt(n, e) {
+function at(n, e) {
   switch (e) {
     case "universal":
-      return kt[n] ?? n;
-    case "palmer":
       return Lt[n] ?? n;
+    case "palmer":
+      return Ot[n] ?? n;
     case "fdi":
     default:
       return n;
   }
 }
-function zt() {
+function Vt() {
   return {};
 }
-function at(n) {
+function st(n) {
   const e = {};
   for (const [r, a] of Object.entries(n))
     !a || a.length === 0 || (e[r] = { conditions: a, surfaces: [] });
@@ -237,37 +237,37 @@ const $t = M(
     "ds:gap-[var(--spacing-sm)]",
     "ds:bg-[var(--background)] ds:text-[var(--foreground)]"
   ].join(" ")
-), St = M(
+), Mt = M(
   [
     "ds:block ds:max-w-full ds:h-auto",
     "ds:text-[var(--foreground)]"
   ].join(" ")
-), Mt = M(
+), Nt = M(
   [
     "ds:group ds:cursor-pointer",
     "ds:focus:outline-none",
     "ds:transition-[fill,stroke,opacity] ds:duration-[var(--animation-duration)]",
     "ds:motion-reduce:transition-none"
   ].join(" ")
-), Nt = M(
+), Rt = M(
   [
     "ds:flex ds:flex-wrap ds:items-center",
     "ds:gap-[var(--spacing-sm)]",
     "type-meta ds:text-[var(--muted-foreground)]"
   ].join(" ")
-), Rt = M(
+), At = M(
   [
     "ds:inline-flex ds:items-center",
     "ds:gap-[var(--spacing-xs)]"
   ].join(" ")
-), At = M(
+), Dt = M(
   [
     "ds:inline-block",
     "ds:inline-size-[0.75rem] ds:block-size-[0.75rem]",
     "ds:rounded-[var(--radius-xs)]",
     "ds:border ds:border-[color:var(--border)]"
   ].join(" ")
-), Dt = M(
+), Pt = M(
   [
     "ds:sr-only"
   ].join(" ")
@@ -275,18 +275,18 @@ const $t = M(
 function Q(n) {
   return n.value !== void 0;
 }
-function st() {
+function it() {
   return { conditions: [], surfaces: [] };
 }
-function it(n) {
+function ot(n) {
   return !n || n.length === 0 ? ["caries"] : [];
 }
 function Et(n) {
   return n.replace(/[^a-zA-Z0-9-_]/g, "");
 }
-function Pt({ idPrefix: n }) {
+function _t({ idPrefix: n }) {
   const e = (r) => `${n}-${r}`;
-  return /* @__PURE__ */ $("defs", { children: [
+  return /* @__PURE__ */ S("defs", { children: [
     /* @__PURE__ */ i(
       "pattern",
       {
@@ -302,7 +302,7 @@ function Pt({ idPrefix: n }) {
             y1: "0",
             x2: "0",
             y2: "6",
-            stroke: S.caries,
+            stroke: $.caries,
             strokeWidth: "2"
           }
         )
@@ -315,7 +315,7 @@ function Pt({ idPrefix: n }) {
         patternUnits: "userSpaceOnUse",
         width: "5",
         height: "5",
-        children: /* @__PURE__ */ i("circle", { cx: "2.5", cy: "2.5", r: "1", fill: S.filled })
+        children: /* @__PURE__ */ i("circle", { cx: "2.5", cy: "2.5", r: "1", fill: $.filled })
       }
     ),
     /* @__PURE__ */ i(
@@ -329,7 +329,7 @@ function Pt({ idPrefix: n }) {
           "path",
           {
             d: "M0 0 L6 6 M6 0 L0 6",
-            stroke: S.crowned,
+            stroke: $.crowned,
             strokeWidth: "1"
           }
         )
@@ -349,7 +349,7 @@ function Pt({ idPrefix: n }) {
             y1: "0",
             x2: "1",
             y2: "4",
-            stroke: S.implant,
+            stroke: $.implant,
             strokeWidth: "1"
           }
         )
@@ -369,7 +369,7 @@ function Pt({ idPrefix: n }) {
             y1: "1",
             x2: "4",
             y2: "1",
-            stroke: S.rootCanal,
+            stroke: $.rootCanal,
             strokeWidth: "1"
           }
         )
@@ -377,7 +377,7 @@ function Pt({ idPrefix: n }) {
     )
   ] });
 }
-const _t = [
+const jt = [
   "caries",
   "filled",
   "crowned",
@@ -385,22 +385,22 @@ const _t = [
   "implant",
   "rootCanal"
 ];
-function jt({ idPrefix: n }) {
-  const { t: e } = ot();
+function Wt({ idPrefix: n }) {
+  const { t: e } = ct();
   return /* @__PURE__ */ i(
     "ul",
     {
-      className: Nt(),
+      className: Rt(),
       "data-testid": "tooth-scheme-legend",
       "aria-label": e("toothScheme.legendLabel"),
-      children: _t.map((r) => /* @__PURE__ */ $("li", { className: Rt(), children: [
+      children: jt.map((r) => /* @__PURE__ */ S("li", { className: At(), children: [
         /* @__PURE__ */ i(
           "span",
           {
-            className: At(),
+            className: Dt(),
             "aria-hidden": "true",
             "data-condition": r,
-            "data-token": Ot[r],
+            "data-token": It[r],
             "data-testid": `tooth-scheme-legend-swatch-${r}`
           }
         ),
@@ -409,78 +409,79 @@ function jt({ idPrefix: n }) {
     }
   );
 }
-const Wt = mt(
+const Ut = pt(
   ({
-    dentition: n = "permanent",
-    numbering: e = "fdi",
-    mode: r = "interactive",
-    value: a,
-    defaultValue: O,
-    onChange: b,
+    id: n,
+    dentition: e = "permanent",
+    numbering: r = "fdi",
+    mode: a = "interactive",
+    value: h,
+    defaultValue: N,
+    onChange: w,
     onSelect: u,
-    conditions: g,
-    ariaLabel: N,
-    className: W
-  }, z) => {
-    const { t: c } = ot(), h = pt(), f = Z(
-      () => `ts-${Et(h)}`,
-      [h]
-    ), [V, U] = G(() => a !== void 0 ? a : O !== void 0 ? O : g ? at(g) : {}), m = Q({ value: a }) ? a : V;
-    et(() => {
-      Q({ value: a }) || g !== void 0 && U(at(g));
-    }, [g, a]);
-    const R = Z(() => It(n), [n]), C = Z(
-      () => R.teeth.map((t) => t.fdi),
-      [R]
-    ), w = C[0], [v, x] = G(w);
-    et(() => {
-      (!v || !C.includes(v)) && x(w);
-    }, [w, v, C]);
-    const [_, A] = G(""), H = gt(null), F = q(
+    conditions: v,
+    ariaLabel: j,
+    className: H
+  }, F) => {
+    const { t: o } = ct(), p = gt(), E = Z(
+      () => `ts-${Et(p)}`,
+      [p]
+    ), [q, z] = G(() => h !== void 0 ? h : N !== void 0 ? N : v ? st(v) : {}), f = Q({ value: h }) ? h : q;
+    nt(() => {
+      Q({ value: h }) || v !== void 0 && z(st(v));
+    }, [v, h]);
+    const C = Z(() => St(e), [e]), g = Z(
+      () => C.teeth.map((t) => t.fdi),
+      [C]
+    ), y = g[0], [x, T] = G(y);
+    nt(() => {
+      (!x || !g.includes(x)) && T(y);
+    }, [y, x, g]);
+    const [V, R] = G(""), Y = vt(null), W = U(
       (t) => {
-        Q({ value: a }) || U(t), b == null || b(t);
+        Q({ value: h }) || z(t), w == null || w(t);
       },
-      [b, a]
-    ), T = q((t) => {
-      const o = H.current;
-      if (!o) return;
-      const s = o.querySelector(`g[data-fdi="${t}"]`);
-      s && (s.focus(), x(t));
+      [w, h]
+    ), k = U((t) => {
+      const c = Y.current;
+      if (!c) return;
+      const s = c.querySelector(`g[data-fdi="${t}"]`);
+      s && (s.focus(), T(t));
     }, []);
-    vt(
-      z,
+    xt(
+      F,
       () => ({
         focusTooth: (t) => {
-          T(t);
+          k(t);
         },
-        getChart: () => m
+        getChart: () => f
       }),
-      [m, T]
+      [f, k]
     );
-    const ct = q(
-      (t, o) => {
-        var D;
-        if (r !== "interactive") return;
-        const s = y[o];
+    const dt = U(
+      (t, c) => {
+        var A;
+        if (a !== "interactive") return;
+        const s = b[c];
         if (!s) return;
-        const d = C, I = d.indexOf(o);
+        const d = g, I = d.indexOf(c);
         switch (t.key) {
           case "ArrowRight": {
             t.preventDefault();
             const l = Math.min(d.length - 1, I + 1);
-            T(d[l]);
+            k(d[l]);
             return;
           }
           case "ArrowLeft": {
             t.preventDefault();
             const l = Math.max(0, I - 1);
-            T(d[l]);
+            k(d[l]);
             return;
           }
           case "ArrowUp":
           case "ArrowDown": {
             t.preventDefault();
-            const p = {
+            const m = {
               1: 4,
               4: 1,
               2: 3,
@@ -490,101 +491,102 @@ const Wt = mt(
               6: 7,
               7: 6
             }[s.quadrant];
-            if (!p) return;
-            const k = `${p}${s.positionInQuadrant}`;
-            d.includes(k) && T(k);
+            if (!m) return;
+            const L = `${m}${s.positionInQuadrant}`;
+            d.includes(L) && k(L);
             return;
           }
           case "Home": {
             t.preventDefault();
             const l = d.filter(
-              (p) => y[p].quadrant === s.quadrant
+              (m) => b[m].quadrant === s.quadrant
             );
-            l.length > 0 && T(l[0]);
+            l.length > 0 && k(l[0]);
             return;
           }
           case "End": {
             t.preventDefault();
             const l = d.filter(
-              (p) => y[p].quadrant === s.quadrant
+              (m) => b[m].quadrant === s.quadrant
             );
-            l.length > 0 && T(l[l.length - 1]);
+            l.length > 0 && k(l[l.length - 1]);
             return;
           }
           case " ":
           case "Enter": {
             t.preventDefault();
-            const l = (D = m[o]) == null ? void 0 : D.conditions, p = it(l), k = { ...m };
-            p.length === 0 ? (delete k[o], A(c("toothScheme.deselected", { id: o }))) : (k[o] = {
-              ...m[o] ?? st(),
-              conditions: p
-            }, A(
-              c("toothScheme.selected", {
-                id: o,
-                conditions: p.map((B) => c(`toothScheme.condition.${B}`)).join(", ")
+            const l = (A = f[c]) == null ? void 0 : A.conditions, m = ot(l), L = { ...f };
+            m.length === 0 ? (delete L[c], R(o("toothScheme.deselected", { id: c }))) : (L[c] = {
+              ...f[c] ?? it(),
+              conditions: m
+            }, R(
+              o("toothScheme.selected", {
+                id: c,
+                conditions: m.map((B) => o(`toothScheme.condition.${B}`)).join(", ")
               })
-            )), F(k), u == null || u(o);
+            )), W(L), u == null || u(c);
             return;
           }
           default:
             return;
         }
       },
-      [m, F, T, r, u, c, C]
-    ), dt = q(
+      [f, W, k, a, u, o, g]
+    ), lt = U(
       (t) => {
         var I;
-        if (r !== "interactive") return;
-        x(t);
-        const o = (I = m[t]) == null ? void 0 : I.conditions, s = it(o), d = { ...m };
-        s.length === 0 ? (delete d[t], A(c("toothScheme.deselected", { id: t }))) : (d[t] = {
-          ...m[t] ?? st(),
+        if (a !== "interactive") return;
+        T(t);
+        const c = (I = f[t]) == null ? void 0 : I.conditions, s = ot(c), d = { ...f };
+        s.length === 0 ? (delete d[t], R(o("toothScheme.deselected", { id: t }))) : (d[t] = {
+          ...f[t] ?? it(),
           conditions: s
-        }, A(
-          c("toothScheme.selected", {
+        }, R(
+          o("toothScheme.selected", {
             id: t,
-            conditions: s.map((D) => c(`toothScheme.condition.${D}`)).join(", ")
+            conditions: s.map((A) => o(`toothScheme.condition.${A}`)).join(", ")
           })
-        )), F(d), u == null || u(t);
+        )), W(d), u == null || u(t);
       },
-      [m, F, r, u, c]
-    ), lt = R.width + 4, ht = R.height + 4, Y = N ?? c("toothScheme.ariaLabel");
-    return /* @__PURE__ */ i(E.Provider, { delayDuration: 200, children: /* @__PURE__ */ $(
+      [f, W, a, u, o]
+    ), ht = C.width + 4, ut = C.height + 4, tt = j ?? o("toothScheme.ariaLabel");
+    return /* @__PURE__ */ i(D.Provider, { delayDuration: 200, children: /* @__PURE__ */ S(
       "div",
       {
         role: "region",
-        "aria-label": Y,
-        className: [$t(), W].filter(Boolean).join(" "),
+        "aria-label": tt,
+        className: [$t(), H].filter(Boolean).join(" "),
         "data-component": "tooth-scheme",
+        "data-component-id": n,
         "data-testid": "tooth-scheme-root",
-        "data-dentition": n,
-        "data-numbering": e,
-        "data-mode": r,
+        "data-dentition": e,
+        "data-numbering": r,
+        "data-mode": a,
         children: [
-          /* @__PURE__ */ $(
+          /* @__PURE__ */ S(
             "svg",
             {
-              ref: H,
-              viewBox: `0 0 ${lt} ${ht}`,
-              className: St(),
+              ref: Y,
+              viewBox: `0 0 ${ht} ${ut}`,
+              className: Mt(),
               role: "group",
-              "aria-label": Y,
+              "aria-label": tt,
               "data-testid": "tooth-scheme-svg",
               focusable: "false",
               xmlns: "http://www.w3.org/2000/svg",
               children: [
-                /* @__PURE__ */ i(Pt, { idPrefix: f }),
-                R.teeth.map((t) => {
-                  var tt;
-                  const o = m[t.fdi], s = (tt = o == null ? void 0 : o.conditions) == null ? void 0 : tt[0], d = c(
+                /* @__PURE__ */ i(_t, { idPrefix: E }),
+                C.teeth.map((t) => {
+                  var et;
+                  const c = f[t.fdi], s = (et = c == null ? void 0 : c.conditions) == null ? void 0 : et[0], d = o(
                     `toothScheme.anatomy.${t.meta.anatomy}`
-                  ), I = s ? `, ${c(`toothScheme.condition.${s}`)}` : "", D = c("toothScheme.toothLabel", {
-                    id: rt(t.fdi, e),
+                  ), I = s ? `, ${o(`toothScheme.condition.${s}`)}` : "", A = o("toothScheme.toothLabel", {
+                    id: at(t.fdi, r),
                     anatomy: d,
                     conditionSuffix: I
-                  }), l = r === "interactive" ? t.fdi === v ? 0 : -1 : void 0, p = s && s !== "missing" ? `url(#${f}-${P[s]})` : "var(--muted)", k = s && s !== "missing" ? S[s] : "var(--border)", B = s ? `${d} · ${c(`toothScheme.condition.${s}`)}` : d, ut = rt(t.fdi, e);
-                  return /* @__PURE__ */ $(E.Root, { children: [
-                    /* @__PURE__ */ i(E.Trigger, { asChild: !0, children: /* @__PURE__ */ $(
+                  }), l = a === "interactive" ? t.fdi === x ? 0 : -1 : void 0, m = s && s !== "missing" ? `url(#${E}-${P[s]})` : "var(--muted)", L = s && s !== "missing" ? $[s] : "var(--border)", B = s ? `${d} · ${o(`toothScheme.condition.${s}`)}` : d, ft = at(t.fdi, r);
+                  return /* @__PURE__ */ S(D.Root, { children: [
+                    /* @__PURE__ */ i(D.Trigger, { asChild: !0, children: /* @__PURE__ */ S(
                       "g",
                       {
                         "data-fdi": t.fdi,
@@ -596,21 +598,21 @@ const Wt = mt(
                         "data-testid": `tooth-${t.fdi}`,
                         transform: `translate(${t.x}, ${t.y})`,
                         tabIndex: l,
-                        role: r === "interactive" ? "button" : void 0,
-                        "aria-label": D,
-                        "aria-pressed": r === "interactive" ? s !== void 0 : void 0,
-                        className: Mt(),
-                        onClick: r === "interactive" ? () => dt(t.fdi) : void 0,
-                        onFocus: () => x(t.fdi),
-                        onKeyDown: (ft) => ct(ft, t.fdi),
+                        role: a === "interactive" ? "button" : void 0,
+                        "aria-label": A,
+                        "aria-pressed": a === "interactive" ? s !== void 0 : void 0,
+                        className: Nt(),
+                        onClick: a === "interactive" ? () => lt(t.fdi) : void 0,
+                        onFocus: () => T(t.fdi),
+                        onKeyDown: (mt) => dt(mt, t.fdi),
                         children: [
                           /* @__PURE__ */ i(
                             "rect",
                             {
-                              x: -L,
-                              y: -L,
-                              width: t.shape.width + L * 2,
-                              height: t.shape.height + L * 2,
+                              x: -O,
+                              y: -O,
+                              width: t.shape.width + O * 2,
+                              height: t.shape.height + O * 2,
                               fill: "transparent"
                             }
                           ),
@@ -618,8 +620,8 @@ const Wt = mt(
                             "path",
                             {
                               d: t.shape.path,
-                              fill: p,
-                              stroke: k,
+                              fill: m,
+                              stroke: L,
                               strokeWidth: "1.5",
                               vectorEffect: "non-scaling-stroke"
                             }
@@ -637,10 +639,10 @@ const Wt = mt(
                           /* @__PURE__ */ i(
                             "rect",
                             {
-                              x: -L,
-                              y: -L,
-                              width: t.shape.width + L * 2,
-                              height: t.shape.height + L * 2,
+                              x: -O,
+                              y: -O,
+                              width: t.shape.width + O * 2,
+                              height: t.shape.height + O * 2,
                               fill: "none",
                               stroke: "var(--ring)",
                               strokeWidth: "var(--focus-ring-width)",
@@ -658,7 +660,7 @@ const Wt = mt(
                             "path",
                             {
                               d: `M2 2 L${t.shape.width - 2} ${t.shape.height - 2} M${t.shape.width - 2} 2 L2 ${t.shape.height - 2}`,
-                              stroke: S.missing,
+                              stroke: $.missing,
                               strokeWidth: "2",
                               fill: "none"
                             }
@@ -673,21 +675,21 @@ const Wt = mt(
                               fill: "var(--muted-foreground)",
                               className: "ds:select-none",
                               "aria-hidden": "true",
-                              children: ut
+                              children: ft
                             }
                           )
                         ]
                       }
                     ) }),
-                    /* @__PURE__ */ i(E.Portal, { children: /* @__PURE__ */ $(
-                      E.Content,
+                    /* @__PURE__ */ i(D.Portal, { children: /* @__PURE__ */ S(
+                      D.Content,
                       {
                         side: "top",
                         sideOffset: 6,
                         className: "ds:z-[var(--z-tooltip)] ds:rounded-[var(--radius-sm)] ds:bg-[var(--foreground)] ds:text-[var(--background)] ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)] ds:pt-[calc(var(--spacing-xs)/2)] ds:pb-[calc(var(--spacing-xs)/2)] ds:text-[length:var(--font-size-xs)]",
                         children: [
                           B,
-                          /* @__PURE__ */ i(E.Arrow, { className: "ds:fill-[var(--foreground)]" })
+                          /* @__PURE__ */ i(D.Arrow, { className: "ds:fill-[var(--foreground)]" })
                         ]
                       }
                     ) })
@@ -696,15 +698,15 @@ const Wt = mt(
               ]
             }
           ),
-          /* @__PURE__ */ i(jt, { idPrefix: f }),
+          /* @__PURE__ */ i(Wt, { idPrefix: E }),
           /* @__PURE__ */ i(
             "div",
             {
-              className: Dt(),
+              className: Pt(),
               "aria-live": "polite",
               "aria-atomic": "true",
               "data-testid": "tooth-scheme-live",
-              children: _
+              children: V
             }
           )
         ]
@@ -712,8 +714,8 @@ const Wt = mt(
     ) });
   }
 );
-Wt.displayName = "ToothScheme";
-const Vt = {
+Ut.displayName = "ToothScheme";
+const Bt = {
   id: "tooth-scheme",
   capabilities: ["pick"],
   state: {
@@ -735,6 +737,11 @@ const Vt = {
   },
   domHooks: {
     root: { attr: "data-component", value: "tooth-scheme" },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    },
     item: {
       attr: "data-fdi",
       description: 'Each rendered tooth `<g>` carries its FDI id as `data-fdi`. Tests still use `data-testid="tooth-<fdi>"` separately.'
@@ -742,21 +749,21 @@ const Vt = {
   }
 };
 export {
-  S as C,
-  y as F,
+  $ as C,
+  b as F,
   X as P,
   K as T,
   P as a,
-  Ot as b,
-  Lt as c,
-  kt as d,
+  It as b,
+  Ot as c,
+  Lt as d,
   J as e,
-  Wt as f,
-  at as g,
-  zt as h,
-  It as i,
-  rt as l,
+  Ut as f,
+  st as g,
+  Vt as h,
+  St as i,
+  at as l,
   $t as r,
-  Vt as t
+  Bt as t
 };
-//# sourceMappingURL=tooth-scheme.agent-BlDyu-Gx.js.map
+//# sourceMappingURL=tooth-scheme.agent-CWrQBjJM.js.map