@rpcbase/ui 0.176.0 → 0.177.0

package/dist/index18.js

@@ -1,7 +1,7 @@
-import { j as f } from "./index28.js";
+import { j as f } from "./index27.js";
 import { Check as ue, ChevronDown as oe, ChevronUp as ae } from "lucide-react";
-import * as n from "react";
-import { DismissableLayerBranch as fe } from "./index29.js";
+import * as r from "react";
+import { DismissableLayerBranch as fe } from "./index28.js";
 import { createPortal as de } from "react-dom";
 import { IMaskInput as me } from "react-imask";
 import pe, { InputMask as he } from "imask";
@@ -16,46 +16,46 @@ function Z(m) {
 function ye(m) {
   const d = m.trim();
   if (!d) return null;
-  const r = /^(\d{1,2}):(\d{2})$/.exec(d);
-  if (!r)
+  const n = /^(\d{1,2}):(\d{2})$/.exec(d);
+  if (!n)
     return null;
-  const i = Number(r[1]), o = Number(r[2]);
+  const i = Number(n[1]), o = Number(n[2]);
   return !Number.isFinite(i) || !Number.isFinite(o) || i < 0 || i > 23 || o < 0 || o > 59 ? null : `${Z(i)}:${Z(o)}`;
 }
 function Q(m, d) {
-  const r = ye(m);
-  if (!r) return null;
-  const i = d.find((o) => o.value === r);
-  return B(i) ? { parsed: r, selectableValue: r } : { parsed: r, selectableValue: null };
+  const n = ye(m);
+  if (!n) return null;
+  const i = d.find((o) => o.value === n);
+  return B(i) ? { parsed: n, selectableValue: n } : { parsed: n, selectableValue: null };
 }
 function U(m) {
   const d = /^(\d{2}):(\d{2})$/.exec(m);
   if (!d)
     return null;
-  const r = Number(d[1]), i = Number(d[2]);
-  return !Number.isFinite(r) || !Number.isFinite(i) ? null : r * 60 + i;
+  const n = Number(d[1]), i = Number(d[2]);
+  return !Number.isFinite(n) || !Number.isFinite(i) ? null : n * 60 + i;
 }
 function B(m) {
   return m ? !m.disabled : !1;
 }
 function re(m, d) {
-  let r = null, i = Number.POSITIVE_INFINITY, o = Number.NEGATIVE_INFINITY;
+  let n = null, i = Number.POSITIVE_INFINITY, o = Number.NEGATIVE_INFINITY;
   for (const v of d) {
     if (!B(v)) continue;
     const g = U(v.value);
     if (g == null) continue;
     const N = Math.abs(g - m);
-    (N < i || N === i && g > o) && (r = v, i = N, o = g);
+    (N < i || N === i && g > o) && (n = v, i = N, o = g);
   }
-  return r;
+  return n;
 }
 function ne({
   direction: m,
   viewportRef: d,
-  speed: r = 400,
+  speed: n = 400,
   className: i
 }) {
-  const [o, v] = n.useState(!0), g = n.useRef(void 0), N = n.useRef(void 0), p = n.useRef(!1), h = n.useCallback(() => {
+  const [o, v] = r.useState(!0), g = r.useRef(void 0), N = r.useRef(void 0), p = r.useRef(!1), h = r.useCallback(() => {
     const y = d.current;
     if (!y) {
       v(!0);
@@ -68,7 +68,7 @@ function ne({
     }
     v(m === "up" ? !F : !D);
   }, [m, d]);
-  n.useEffect(() => {
+  r.useEffect(() => {
     const y = d.current;
     if (!y) return;
     h();
@@ -81,9 +81,9 @@ function ne({
       y.removeEventListener("scroll", x), M.disconnect(), w.disconnect();
     };
   }, [d, h]);
-  const I = n.useCallback(() => {
+  const I = r.useCallback(() => {
     g.current && (cancelAnimationFrame(g.current), g.current = void 0), p.current = !1, N.current = void 0;
-  }, []), A = n.useCallback(
+  }, []), C = r.useCallback(
     (y) => {
       const x = d.current;
       if (!x || o || !p.current) {
@@ -91,22 +91,22 @@ function ne({
         return;
       }
       N.current || (N.current = y);
-      const b = y - N.current, M = r * b / 1e3;
+      const b = y - N.current, M = n * b / 1e3;
       if (M < 0.1) {
-        g.current = requestAnimationFrame(A);
+        g.current = requestAnimationFrame(C);
         return;
       }
       const w = x.scrollTop, F = x.scrollHeight - x.clientHeight;
       let D;
       m === "up" ? D = Math.max(0, w - M) : D = Math.min(F, w + M), x.scrollTop = D, N.current = y;
       const R = 1;
-      (m === "up" ? D > R : D < F - R) && Math.abs(D - w) > 0.01 ? g.current = requestAnimationFrame(A) : (I(), setTimeout(h, 16));
+      (m === "up" ? D > R : D < F - R) && Math.abs(D - w) > 0.01 ? g.current = requestAnimationFrame(C) : (I(), setTimeout(h, 16));
     },
-    [h, m, o, r, I, d]
-  ), V = n.useCallback(() => {
-    o || !d.current || p.current || (p.current = !0, N.current = void 0, g.current = requestAnimationFrame(A));
-  }, [o, A, d]);
-  return n.useEffect(() => I, [I]), /* @__PURE__ */ f.jsx(
+    [h, m, o, n, I, d]
+  ), V = r.useCallback(() => {
+    o || !d.current || p.current || (p.current = !0, N.current = void 0, g.current = requestAnimationFrame(C));
+  }, [o, C, d]);
+  return r.useEffect(() => I, [I]), /* @__PURE__ */ f.jsx(
     "div",
     {
       className: q(
@@ -130,7 +130,7 @@ function ne({
 function se({
   id: m,
   value: d,
-  onChange: r,
+  onChange: n,
   onValueUpdate: i,
   options: o,
   placeholder: v = "Select time",
@@ -139,132 +139,122 @@ function se({
   disabled: p,
   readOnly: h,
   open: I,
-  onOpenChange: A,
+  onOpenChange: C,
   triggerTestId: V,
   contentTestId: y,
   isHydrated: x
 }) {
-  const b = n.useId(), M = m ?? `hours-picker-${b}`, w = n.useRef(null), F = n.useRef(null), D = n.useRef(null), R = n.useRef(!1), [L, W] = n.useState(null), j = n.useRef(null), _ = n.useRef(null), z = n.useRef(null), [t, c] = n.useState(() => ({
+  const b = r.useId(), M = m ?? `hours-picker-${b}`, w = r.useRef(null), F = r.useRef(null), D = r.useRef(null), R = r.useRef(!1), [L, W] = r.useState(null), j = r.useRef(null), _ = r.useRef(null), z = r.useRef(null), [t, l] = r.useState(() => ({
     left: 0,
     top: 0,
     width: 0
-  })), [k, S] = n.useState(!1), u = I ?? k, H = A ?? S, X = typeof window > "u" ? n.useEffect : n.useLayoutEffect;
-  n.useEffect(() => {
+  })), [k, S] = r.useState(!1), u = I ?? k, H = C ?? S, X = typeof window > "u" ? r.useEffect : r.useLayoutEffect;
+  r.useEffect(() => {
     if (!u || p || h)
       return;
     const e = w.current;
     e instanceof HTMLInputElement && (typeof document < "u" && document.activeElement === e || e.focus({ preventScroll: !0 }));
   }, [p, u, h]);
-  const $ = n.useCallback((e) => {
+  const $ = r.useCallback((e) => {
     D.current = e, W(e);
-  }, []), ie = n.useCallback(() => {
+  }, []), ie = r.useCallback(() => {
     R.current = !0;
   }, []);
-  n.useEffect(() => {
+  r.useEffect(() => {
     if (!u) return;
-    const e = o.find((l) => l.value === d);
+    const e = o.find((c) => c.value === d);
     if (e && B(e)) {
       $(e.value);
       return;
     }
-    const s = o.find((l) => B(l));
+    const s = o.find((c) => B(c));
     $(s?.value ?? null);
   }, [u, o, $, d]);
-  const le = n.useCallback(
+  const ce = r.useCallback(
     (e) => {
       if (e === null) {
-        if (i) {
-          i(null);
-          return;
-        }
-        r(null);
+        i && i(null);
         return;
       }
-      const s = o.find((l) => l.value === e);
-      if (B(s)) {
-        if (i) {
-          i(e);
-          return;
-        }
-        r(e);
-      }
+      const s = o.find((c) => c.value === e);
+      B(s) && i && i(e);
     },
-    [r, i, o]
-  ), ee = n.useCallback(
+    [i, o]
+  ), ee = r.useCallback(
     (e) => {
       if (e === null) {
-        i && i(null), r(null);
+        i && i(null), n(null);
         return;
       }
-      const s = o.find((l) => l.value === e);
-      B(s) && (i && i(e), r(e));
+      const s = o.find((c) => c.value === e);
+      B(s) && (i && i(e), n(e));
     },
-    [r, i, o]
+    [n, i, o]
   );
-  n.useEffect(() => {
+  r.useEffect(() => {
     if (!u) return;
     const e = (s) => {
-      const l = s.target;
-      if (!(l instanceof Node))
+      const c = s.target;
+      if (!(c instanceof Node))
         return;
       const a = j.current;
-      !a || a.contains(l) || _.current?.contains(l) || H(!1);
+      !a || a.contains(c) || _.current?.contains(c) || H(!1);
     };
     return document.addEventListener("pointerdown", e, !0), () => {
       document.removeEventListener("pointerdown", e, !0);
     };
-  }, [u, H]), n.useEffect(() => {
+  }, [u, H]), r.useEffect(() => {
     if (!u)
       return;
     const e = _.current;
     if (!e)
       return;
-    const s = (l) => {
+    const s = (c) => {
       const a = z.current;
       if (!a)
         return;
-      const E = l.deltaY;
+      const E = c.deltaY;
       if (E === 0)
         return;
-      const C = Math.max(0, a.scrollHeight - a.clientHeight), T = a.scrollTop <= 0, G = a.scrollTop >= C, O = l.target;
+      const A = Math.max(0, a.scrollHeight - a.clientHeight), T = a.scrollTop <= 0, G = a.scrollTop >= A, O = c.target;
       if (O instanceof Node && a.contains(O)) {
-        (E < 0 && T || E > 0 && G) && l.preventDefault();
+        (E < 0 && T || E > 0 && G) && c.preventDefault();
         return;
       }
-      l.preventDefault();
-      const K = Math.min(C, Math.max(0, a.scrollTop + E));
+      c.preventDefault();
+      const K = Math.min(A, Math.max(0, a.scrollTop + E));
       a.scrollTop = K;
     };
     return e.addEventListener("wheel", s, { passive: !1 }), () => {
       e.removeEventListener("wheel", s);
     };
-  }, [u]), n.useEffect(() => {
-    if (!u || I !== void 0 && !A || typeof window > "u" || !("IntersectionObserver" in window))
+  }, [u]), r.useEffect(() => {
+    if (!u || I !== void 0 && !C || typeof window > "u" || !("IntersectionObserver" in window))
       return;
     const e = w.current;
     if (!(e instanceof HTMLElement))
       return;
     let s = !0;
-    const l = new IntersectionObserver((a) => {
+    const c = new IntersectionObserver((a) => {
       if (!s)
         return;
       const E = a[0];
       E && !E.isIntersecting && H(!1);
     });
-    return l.observe(e), () => {
-      s = !1, l.disconnect();
+    return c.observe(e), () => {
+      s = !1, c.disconnect();
     };
-  }, [A, u, I, H]);
-  const Y = n.useCallback(() => {
+  }, [C, u, I, H]);
+  const Y = r.useCallback(() => {
     if (typeof window > "u") return;
     const e = w.current, s = _.current;
     if (!(e instanceof HTMLElement) || !s) return;
-    const l = e.getBoundingClientRect(), a = s.offsetHeight, E = window.innerWidth ?? 0, C = window.innerHeight ?? 0, T = 8, G = l.width;
-    let O = l.left;
+    const c = e.getBoundingClientRect(), a = s.offsetHeight, E = window.innerWidth ?? 0, A = window.innerHeight ?? 0, T = 8, G = c.width;
+    let O = c.left;
     O + G > E - T && (O = Math.max(T, E - G - T)), O < T && (O = T);
-    let P = l.bottom + T;
-    const K = P + a > C - T, J = l.top - a - T;
-    K && J >= T && (P = J), P < T && (P = T), P + a > C - T && (P = Math.max(T, C - a - T)), c({ left: O, top: P, width: G });
+    let P = c.bottom + T;
+    const K = P + a > A - T, J = c.top - a - T;
+    K && J >= T && (P = J), P < T && (P = T), P + a > A - T && (P = Math.max(T, A - a - T)), l({ left: O, top: P, width: G });
   }, []);
   return X(() => {
     if (!u || p || typeof window > "u") return;
@@ -273,11 +263,11 @@ function se({
     return window.addEventListener("scroll", Y, !0), window.addEventListener("resize", Y), () => {
       window.cancelAnimationFrame(e), window.removeEventListener("scroll", Y, !0), window.removeEventListener("resize", Y);
     };
-  }, [p, u, Y]), n.useEffect(() => {
+  }, [p, u, Y]), r.useEffect(() => {
     if (!u) return;
     const e = z.current;
     if (!e) return;
-    const l = requestAnimationFrame(() => {
+    const c = requestAnimationFrame(() => {
       const a = e.querySelector('[role="option"][data-state="checked"]');
       if (a instanceof HTMLElement) {
         const K = a.offsetTop - 8, J = a.offsetTop + a.offsetHeight + 8;
@@ -285,38 +275,38 @@ function se({
           e.scrollTop = Math.max(0, K);
           return;
         }
-        const ce = e.scrollTop + e.clientHeight;
-        J > ce && (e.scrollTop = Math.max(0, J - e.clientHeight));
+        const le = e.scrollTop + e.clientHeight;
+        J > le && (e.scrollTop = Math.max(0, J - e.clientHeight));
         return;
       }
       const E = Array.from(e.querySelectorAll('[role="option"]'));
       if (!E.length) return;
-      let C, T;
+      let A, T;
       for (const P of E) {
         if (!P.hasAttribute("data-disabled")) {
-          C = P;
+          A = P;
           break;
         }
         T = P;
       }
-      if (!C) return;
-      const O = Math.max(0, (T || C).offsetTop - 8);
+      if (!A) return;
+      const O = Math.max(0, (T || A).offsetTop - 8);
       e.scrollTop = O;
     });
-    return () => cancelAnimationFrame(l);
-  }, [u, o]), n.useEffect(() => {
+    return () => cancelAnimationFrame(c);
+  }, [u, o]), r.useEffect(() => {
     if (!u || !L || !R.current) return;
     const e = z.current;
     if (!e) return;
     const s = e.querySelector(`[role="option"][data-value="${L}"]`);
     if (!(s instanceof HTMLElement)) return;
-    const l = 8, a = s.offsetTop - l, E = s.offsetTop + s.offsetHeight + l;
+    const c = 8, a = s.offsetTop - c, E = s.offsetTop + s.offsetHeight + c;
     if (a < e.scrollTop) {
       e.scrollTop = Math.max(0, a);
       return;
     }
-    const C = e.scrollTop + e.clientHeight;
-    E > C && (e.scrollTop = Math.max(0, E - e.clientHeight));
+    const A = e.scrollTop + e.clientHeight;
+    E > A && (e.scrollTop = Math.max(0, E - e.clientHeight));
   }, [L, u]), /* @__PURE__ */ f.jsx(
     "div",
     {
@@ -330,7 +320,7 @@ function se({
             id: M,
             placeholder: v,
             value: d,
-            onValueUpdate: le,
+            onValueUpdate: ce,
             onCommit: ee,
             options: o,
             disabled: p,
@@ -380,14 +370,14 @@ function se({
                     role: "listbox",
                     className: "max-h-64 overflow-y-auto p-1 [overscroll-behavior:contain] [scrollbar-width:none] [-ms-overflow-style:none] [&::-webkit-scrollbar]:hidden",
                     children: o.map((s) => {
-                      const l = s.value === d;
+                      const c = s.value === d;
                       return /* @__PURE__ */ f.jsxs(
                         "div",
                         {
                           role: "option",
-                          "aria-selected": l,
+                          "aria-selected": c,
                           "data-value": s.value,
-                          "data-state": l ? "checked" : "unchecked",
+                          "data-state": c ? "checked" : "unchecked",
                           "data-disabled": s.disabled ? "" : void 0,
                           className: q(
                             "relative flex w-full select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none cursor-pointer",
@@ -407,7 +397,7 @@ function se({
                             R.current && a.movementX === 0 && a.movementY === 0 || (R.current = !1, $(s.value));
                           },
                           children: [
-                            /* @__PURE__ */ f.jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: l ? /* @__PURE__ */ f.jsx(ue, { "aria-hidden": !0, className: "h-4 w-4" }) : null }),
+                            /* @__PURE__ */ f.jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: c ? /* @__PURE__ */ f.jsx(ue, { "aria-hidden": !0, className: "h-4 w-4" }) : null }),
                             /* @__PURE__ */ f.jsxs("div", { className: "flex flex-col", children: [
                               /* @__PURE__ */ f.jsx("span", { children: s.label }),
                               s.description != null ? /* @__PURE__ */ f.jsx("span", { "data-slot": "description", className: "text-xs text-muted-foreground", children: s.description }) : null
@@ -439,7 +429,7 @@ se.displayName = "HourPickerInput";
 function Te({
   id: m,
   value: d,
-  onChange: r,
+  onChange: n,
   onValueUpdate: i,
   options: o,
   placeholder: v = "Select time",
@@ -448,16 +438,16 @@ function Te({
   disabled: p,
   open: h,
   onOpenChange: I,
-  triggerTestId: A,
+  triggerTestId: C,
   contentTestId: V,
   isHydrated: y
 }) {
-  const x = n.useCallback(
+  const x = r.useCallback(
     (b) => {
       const M = o.find((w) => w.value === b);
-      B(M) && (i && i(b), r(b));
+      B(M) && (i && i(b), n(b));
     },
-    [r, i, o]
+    [n, i, o]
   );
   return /* @__PURE__ */ f.jsx("div", { "data-slot": "hours-picker-field", className: q("w-[150px]", g), children: /* @__PURE__ */ f.jsxs(
     ve,
@@ -472,7 +462,7 @@ function Te({
           be,
           {
             id: m,
-            "data-testid": A,
+            "data-testid": C,
             "data-hydrated": y ? "true" : void 0,
             className: q(
               "transition-colors hover:bg-accent hover:text-accent-foreground",
@@ -515,7 +505,7 @@ Se.displayName = "HourPickerField";
 function Ee({
   id: m,
   placeholder: d,
-  value: r,
+  value: n,
   onValueUpdate: i,
   onCommit: o,
   options: v,
@@ -524,7 +514,7 @@ function Ee({
   open: p,
   setOpen: h,
   inputClassName: I,
-  triggerTestId: A,
+  triggerTestId: C,
   isHydrated: V,
   highlightedValueRef: y,
   setHighlightedValue: x,
@@ -532,16 +522,16 @@ function Ee({
   inputRef: M,
   setDraftValueRef: w
 }) {
-  const F = n.useRef(!1), D = n.useRef(!1), R = n.useRef(!1), L = n.useRef(null), [W, j] = n.useState(() => r || "");
-  n.useEffect(() => (w.current = (t) => {
+  const F = r.useRef(!1), D = r.useRef(!1), R = r.useRef(!1), L = r.useRef(null), [W, j] = r.useState(() => n || "");
+  r.useEffect(() => (w.current = (t) => {
     j(t);
   }, () => {
     w.current = null;
   }), [w]);
-  const _ = n.useCallback(
+  const _ = r.useCallback(
     (t) => {
-      const c = y.current ?? r ?? "";
-      let k = v.findIndex((S) => S.value === c);
+      const l = y.current ?? n ?? "";
+      let k = v.findIndex((S) => S.value === l);
       k === -1 && (k = t === 1 ? -1 : v.length);
       for (let S = k + t; S >= 0 && S < v.length; S += t) {
         const u = v[S];
@@ -551,11 +541,11 @@ function Ee({
         }
       }
     },
-    [y, i, v, x, r]
+    [y, i, v, x, n]
   );
-  n.useEffect(() => {
-    F.current || j(r || "");
-  }, [r]);
+  r.useEffect(() => {
+    F.current || j(n || "");
+  }, [n]);
   const z = q(
     "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 pr-10 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
     "transition-colors group-hover:bg-accent group-hover:text-accent-foreground",
@@ -569,7 +559,7 @@ function Ee({
       me,
       {
         id: m,
-        "data-testid": A,
+        "data-testid": C,
         "data-hydrated": V ? "true" : void 0,
         type: "text",
         disabled: g,
@@ -580,30 +570,30 @@ function Ee({
           { mask: "00:00", lazy: !0 },
           { mask: "0:00", lazy: !0 }
         ],
-        dispatch: (t, c) => {
-          const k = (c.value + t).replace(/\D/g, "");
-          if (k.length <= 2 || k.length >= 4) return c.compiledMasks[0];
+        dispatch: (t, l) => {
+          const k = (l.value + t).replace(/\D/g, "");
+          if (k.length <= 2 || k.length >= 4) return l.compiledMasks[0];
           const S = Z(Number(k.slice(0, 2)));
-          return v.some((H) => H.value.startsWith(`${S}:`)) ? c.compiledMasks[0] : c.compiledMasks[1];
+          return v.some((H) => H.value.startsWith(`${S}:`)) ? l.compiledMasks[0] : l.compiledMasks[1];
         },
         placeholder: d,
         value: W,
         className: z,
         onAccept: (t) => {
-          const c = typeof t == "string" ? t : String(t ?? "");
-          j(c), c.replace(/\D/g, "").length === 0 && r && o(null);
+          const l = typeof t == "string" ? t : String(t ?? "");
+          j(l), l.replace(/\D/g, "").length === 0 && n && o(null);
         },
         onComplete: (t) => {
-          const c = typeof t == "string" ? t : String(t ?? "");
-          if (L.current === c) {
+          const l = typeof t == "string" ? t : String(t ?? "");
+          if (L.current === l) {
             L.current = null;
             return;
           }
-          const k = Q(c, v);
+          const k = Q(l, v);
           if (!k)
             return;
           if (k.selectableValue) {
-            if (x(k.selectableValue), j(k.selectableValue), r === k.selectableValue)
+            if (x(k.selectableValue), j(k.selectableValue), n === k.selectableValue)
               return;
             o(k.selectableValue);
             return;
@@ -645,8 +635,8 @@ function Ee({
             }
             if (t.key === "Enter") {
               b();
-              const c = Q(W, v);
-              if (!c) {
+              const l = Q(W, v);
+              if (!l) {
                 if (!p || W.trim() !== "")
                   return;
                 const u = v.find((X) => X.value === y.current), H = (B(u) ? u?.value : void 0) ?? v.find((X) => B(X))?.value;
@@ -655,11 +645,11 @@ function Ee({
                 t.preventDefault(), x(H), j(H), o(H), h(!1);
                 return;
               }
-              if (c.selectableValue) {
-                t.preventDefault(), x(c.selectableValue), j(c.selectableValue), o(c.selectableValue), h(!1);
+              if (l.selectableValue) {
+                t.preventDefault(), x(l.selectableValue), j(l.selectableValue), o(l.selectableValue), h(!1);
                 return;
               }
-              const k = U(c.parsed);
+              const k = U(l.parsed);
               if (k == null)
                 return;
               const S = re(k, v);
@@ -671,8 +661,8 @@ function Ee({
           }
         },
         onFocus: (t) => {
-          const c = !D.current || !R.current;
-          if (D.current = !1, R.current = !1, F.current = !0, c) {
+          const l = !D.current || !R.current;
+          if (D.current = !1, R.current = !1, F.current = !0, l) {
             const k = t.currentTarget;
             requestAnimationFrame(() => k.select());
           }
@@ -682,19 +672,19 @@ function Ee({
           F.current = !1;
           const t = W.trim();
           if (!t) {
-            j(r || "");
+            j(n || "");
             return;
           }
-          const c = Q(t, v);
-          if (!c) {
-            j(r || "");
+          const l = Q(t, v);
+          if (!l) {
+            j(n || "");
             return;
           }
-          if (!c.selectableValue) {
-            j(r || "");
+          if (!l.selectableValue) {
+            j(n || "");
             return;
           }
-          j(c.selectableValue), r !== c.selectableValue && o(c.selectableValue);
+          j(l.selectableValue), n !== l.selectableValue && o(l.selectableValue);
         }
       }
     ),