urfu-ui-kit-react 2.1.7-next.4 → 2.1.7-next.5

package/dist/components/SearchSelect/SearchSelect.js

@@ -1,233 +1,233 @@
-import { jsx as l, jsxs as h } from "react/jsx-runtime";
-import { getFieldAccessibility$u as Ee } from "../../shared/fieldAccessibility.js";
-import { useState as Ke, useRef as _, useEffect as k, useMemo as Pe } from "react";
+import { jsx as o, jsxs as O } from "react/jsx-runtime";
+import { getFieldAccessibility$u as Ae } from "../../shared/fieldAccessibility.js";
+import { useState as Fe, useRef as I, useEffect as z, useMemo as He } from "react";
 /* empty css                 */
-import { createPortal as Ae } from "react-dom";
+import { createPortal as Be } from "react-dom";
 /* empty css                  */
 /* empty css                 */
-import { useSelectEngine$u as Fe } from "../../hooks/useSelectEngine.js";
-import { isSameOptionValue$u as He, getOptionKeys$u as Be } from "../../shared/optionValue.js";
-import { getPopupTransitionStyle$u as U } from "../../shared/popupTransition.js";
-import { useFlippedPlacement$u as Ge } from "./useFlippedPlacement.js";
-import { SearchSelectOption$u as Me } from "./SearchSelectOption.js";
-import { isCompact$u as We, sizeClassName$u as Ye } from "../../shared/size.js";
-import { getPortalScopeProps$u as qe } from "../../shared/uiKitDefaults.js";
-import { resolveValidation$u as Je } from "../../vanilla/core/validation.js";
-const ot = ({
-  "aria-label": I,
-  "aria-labelledby": C,
-  "aria-describedby": V,
-  title: v = "",
-  required: z = !1,
-  options: R,
-  styleSelectContainer: ee,
-  styleTitle: te,
-  styleSelect: ce,
-  lineUp: S = !1,
-  rowGap: se = 4,
-  columnGap: ie = 20,
-  placeholder: re = "Не выбрано",
+import { useSelectEngine$u as Ge } from "../../hooks/useSelectEngine.js";
+import { isSameOptionValue$u as Me, getOptionKeys$u as We } from "../../shared/optionValue.js";
+import { getPopupTransitionStyle$u as C } from "../../shared/popupTransition.js";
+import { useFlippedPlacement$u as Ye } from "./useFlippedPlacement.js";
+import { SearchSelectOption$u as qe } from "./SearchSelectOption.js";
+import { isCompact$u as Je, sizeClassName$u as Qe } from "../../shared/size.js";
+import { getUiKitPrefix$u as r, kitClasses$u as V, kitCls$u as n, getPortalScopeProps$u as Ue } from "../../shared/uiKitDefaults.js";
+import { resolveValidation$u as Xe } from "../../vanilla/core/validation.js";
+const dt = ({
+  "aria-label": ee,
+  "aria-labelledby": te,
+  "aria-describedby": ce,
+  title: g = "",
+  required: R = !1,
+  options: T,
+  styleSelectContainer: se,
+  styleTitle: ie,
+  styleSelect: re,
+  lineUp: $ = !1,
+  rowGap: le = 4,
+  columnGap: oe = 20,
+  placeholder: ae = "Не выбрано",
   value: t,
-  isClearable: le = !1,
-  onChange: f,
-  className: oe,
-  tableView: T = !1,
-  size: $,
-  validationText: ae = "Заполните поле",
-  validationOn: D,
-  error: ne,
-  absoluteValidationText: de,
-  disabled: n,
-  portalOn: pe,
-  onInputChange: u,
-  loading: x,
-  inputValue: y,
+  isClearable: ne = !1,
+  onChange: b,
+  className: de,
+  tableView: D = !1,
+  size: K,
+  validationText: pe = "Заполните поле",
+  validationOn: L,
+  error: fe,
+  absoluteValidationText: me,
+  disabled: p,
+  portalOn: be,
+  onInputChange: S,
+  loading: h,
+  inputValue: v,
   onInputValueChange: c,
-  emptyOptionsText: fe = "Ничего не найдено",
-  id: me
+  emptyOptionsText: xe = "Ничего не найдено",
+  id: ye
 }) => {
-  const m = We($, T), L = Ye($, T), O = Je({ error: ne, validationOn: D, validationText: ae }), [g, b] = Ke(""), E = _(!1), a = typeof y == "string" && typeof c == "function", o = g && !a ? R.filter((e) => (e.label ?? "").toLowerCase().includes((a ? y : g).toLowerCase())) : R, K = o.findIndex((e) => He(e == null ? void 0 : e.value, t == null ? void 0 : t.value)), d = Fe({
-    optionsLength: o.length,
-    initialIndex: Math.max(0, K),
-    selectedIndex: K,
-    disabled: n,
-    portalOn: pe,
-    loading: x,
-    id: me,
-    idPrefix: "u-search-select",
+  const x = Je(K, D), P = Qe(K, D), w = Xe({ error: fe, validationOn: L, validationText: pe }), [j, y] = Fe(""), E = I(!1), d = typeof v == "string" && typeof c == "function", a = j && !d ? T.filter((e) => (e.label ?? "").toLowerCase().includes((d ? v : j).toLowerCase())) : T, A = a.findIndex((e) => Me(e == null ? void 0 : e.value, t == null ? void 0 : t.value)), f = Ge({
+    optionsLength: a.length,
+    initialIndex: Math.max(0, A),
+    selectedIndex: A,
+    disabled: p,
+    portalOn: be,
+    loading: h,
+    id: ye,
+    idPrefix: n("search-select"),
     // Под полем, а не в 30 пикселях от его верха: прежняя постоянная
     // подходила только компактному полю и накрывала обычное.
     getPortalPosition: (e) => ({ x: e.x, y: e.y + 60 + e.height + e.scrollY }),
     onSelectByIndex: (e) => {
-      const r = o[e];
-      r && M.current(r);
+      const l = a[e];
+      l && Y.current(l);
     }
   }), {
     isOpen: s,
-    blockRef: P,
-    portalOptionsRef: A,
-    optionsListRef: F,
-    listboxId: p,
-    activeDescendantId: be,
-    activeIndex: xe,
-    hoveredIndex: ye,
-    setHoveredIndex: ue,
-    handleKeyDown: he,
-    shouldRenderPortal: ve,
-    portalStatus: Se,
-    shouldRenderLocal: Oe,
-    localStatus: ge,
-    isAnimated: H,
-    portalWidth: we,
-    anchor: je,
-    usePortal: w
-  } = d, i = d.portalPosition, Ne = Ee(p, v, z, O, {
-    "aria-label": I,
-    "aria-labelledby": C,
-    "aria-describedby": V
-  }), B = d.close, G = (e) => typeof e == "number" ? `calc(${e} * var(--u-preset-unit, 1px))` : String(e), M = _(() => {
-  }), { flippedTop: ke, flippedUp: ze } = Ge({
+    blockRef: F,
+    portalOptionsRef: H,
+    optionsListRef: B,
+    listboxId: m,
+    activeDescendantId: he,
+    activeIndex: ve,
+    hoveredIndex: Se,
+    setHoveredIndex: Oe,
+    handleKeyDown: ge,
+    shouldRenderPortal: $e,
+    portalStatus: we,
+    shouldRenderLocal: je,
+    localStatus: ke,
+    isAnimated: G,
+    portalWidth: Ne,
+    anchor: ue,
+    usePortal: k
+  } = f, i = f.portalPosition, ze = Ae(m, g, R, w, {
+    "aria-label": ee,
+    "aria-labelledby": te,
+    "aria-describedby": ce
+  }), M = f.close, W = (e) => typeof e == "number" ? `calc(${e} * var(--${r()}-preset-unit, 1px))` : String(e), Y = I(() => {
+  }), { flippedTop: Re, flippedUp: Te } = Ye({
     isOpen: s,
-    portalOn: w,
-    anchor: je,
-    blockRef: P,
-    portalOptionsRef: A,
-    optionsListRef: F,
-    dependencies: [i == null ? void 0 : i.x, i == null ? void 0 : i.y, o.length, x]
+    portalOn: k,
+    anchor: ue,
+    blockRef: F,
+    portalOptionsRef: H,
+    optionsListRef: B,
+    dependencies: [i == null ? void 0 : i.x, i == null ? void 0 : i.y, a.length, h]
   });
-  k(() => {
-    t && Object.keys(t).length == 0 && b("");
-  }, [t]), k(() => {
-    t != null && t.label && Object.keys(t).length && !s && b(t.label);
+  z(() => {
+    t && Object.keys(t).length == 0 && y("");
+  }, [t]), z(() => {
+    t != null && t.label && Object.keys(t).length && !s && y(t.label);
   }, [s, t]);
-  const j = a ? y : g, Re = (e) => {
-    n || (s || d.open(e.currentTarget), a ? c && c(e.target.value) : b(e.target.value), u && u(e.target.value));
-  }, N = !!(t && typeof t == "object" && t.value !== void 0 && String(t.value).length > 0), W = t != null && t.label && Object.keys(t).length ? t.label : "", Y = !s && !j ? W : "";
-  k(() => {
+  const N = d ? v : j, De = (e) => {
+    p || (s || f.open(e.currentTarget), d ? c && c(e.target.value) : y(e.target.value), S && S(e.target.value));
+  }, u = !!(t && typeof t == "object" && t.value !== void 0 && String(t.value).length > 0), q = t != null && t.label && Object.keys(t).length ? t.label : "", J = !s && !N ? q : "";
+  z(() => {
     const e = E.current;
-    E.current = s, e && !s && a && N && y.length > 0 && (c == null || c(""));
-  }, [s, a, N, y, c]);
-  const Te = () => {
-    n || (f == null || f(null), a ? c == null || c("") : b(""), u && u(""), B());
-  }, q = (e) => {
-    e.preventDefault(), e.stopPropagation(), Te();
-  }, J = (e) => {
-    f == null || f(e), B(), a ? c == null || c("") : b(e.label ?? "");
-  }, $e = Pe(() => Be(o), [o]);
-  M.current = J;
-  const Q = le && !n && N, De = Q ? m ? "calc(44 * var(--u-unit, 1px))" : "calc(64 * var(--u-unit, 1px))" : m ? "calc(28 * var(--u-unit, 1px))" : "calc(40 * var(--u-unit, 1px))", X = /* @__PURE__ */ l("div", { className: "u-selectbox-empty-text", children: fe }), Z = (e, r) => /* @__PURE__ */ l(
-    Me,
+    E.current = s, e && !s && d && u && v.length > 0 && (c == null || c(""));
+  }, [s, d, u, v, c]);
+  const Ke = () => {
+    p || (b == null || b(null), d ? c == null || c("") : y(""), S && S(""), M());
+  }, Q = (e) => {
+    e.preventDefault(), e.stopPropagation(), Ke();
+  }, U = (e) => {
+    b == null || b(e), M(), d ? c == null || c("") : y(e.label ?? "");
+  }, Le = He(() => We(a), [a]);
+  Y.current = U;
+  const X = ne && !p && u, Pe = X ? x ? "calc(44 * var(--u-unit, 1px))" : "calc(64 * var(--u-unit, 1px))" : x ? "calc(28 * var(--u-unit, 1px))" : "calc(40 * var(--u-unit, 1px))", Z = /* @__PURE__ */ o("div", { className: n("selectbox-empty-text"), children: xe }), _ = (e, l) => /* @__PURE__ */ o(
+    qe,
     {
       option: e,
-      index: r,
-      listboxId: p,
+      index: l,
+      listboxId: m,
       selectedValue: t == null ? void 0 : t.value,
-      isActive: ye === r || xe === r,
-      tableView: m,
-      onSelect: J,
-      onHover: ue
+      isActive: Se === l || ve === l,
+      tableView: x,
+      onSelect: U,
+      onHover: Oe
     },
-    $e[r]
-  ), Le = /* @__PURE__ */ l(
+    Le[l]
+  ), Ee = /* @__PURE__ */ o(
     "input",
     {
-      className: s ? "u-selectbox-select u-selectbox-select-open" : "u-selectbox-select",
+      className: s ? V("selectbox-select", "selectbox-select-open") : n("selectbox-select"),
       role: "combobox",
-      ...Ne,
+      ...ze,
       "aria-expanded": s,
       "aria-haspopup": "listbox",
-      "aria-controls": p,
+      "aria-controls": m,
       "aria-autocomplete": "list",
-      "aria-activedescendant": be,
+      "aria-activedescendant": he,
       onClick: (e) => {
-        j.length > 0 && (a ? c && c("") : b("")), !n && s && e.currentTarget.blur(), d.toggle(e.currentTarget);
+        N.length > 0 && (d ? c && c("") : y("")), !p && s && e.currentTarget.blur(), f.toggle(e.currentTarget);
       },
       style: Object.assign(
-        m ? {
-          height: "var(--u-compact-height)",
-          fontSize: "var(--u-compact-font-size)",
+        x ? {
+          height: `var(--${r()}-compact-height)`,
+          fontSize: `var(--${r()}-compact-font-size)`,
           lineHeight: 1,
-          padding: "var(--u-compact-padding)",
+          padding: `var(--${r()}-compact-padding)`,
           borderRadius: "calc(8 * var(--u-unit, 1px))"
         } : {},
-        { paddingRight: De },
-        D && { border: "1px solid var(--u-color-error, #EF302B)" }
+        { paddingRight: Pe },
+        L && { border: `1px solid var(--${r()}-color-error, #EF302B)` }
       ),
       type: "text",
-      disabled: n,
-      value: j || Y,
+      disabled: p,
+      value: N || J,
       onFocus: (e) => {
-        Y && e.currentTarget.select();
+        J && e.currentTarget.select();
       },
-      onChange: Re,
-      onKeyDown: he,
-      placeholder: W || re
+      onChange: De,
+      onKeyDown: ge,
+      placeholder: q || ae
     }
   );
-  return /* @__PURE__ */ h("div", { className: `u-react-select-container${L ? ` ${L}` : ""} ${oe ?? ""}`, style: { position: "relative" }, children: [
-    /* @__PURE__ */ h(
+  return /* @__PURE__ */ O("div", { className: `${r()}-react-select-container${P ? ` ${P}` : ""} ${de ?? ""}`, style: { position: "relative" }, children: [
+    /* @__PURE__ */ O(
       "div",
       {
         style: Object.assign(
           {
             display: "flex",
-            flexDirection: S ? "row" : "column",
-            rowGap: S ? null : G(se),
-            columnGap: S ? G(ie) : null
+            flexDirection: $ ? "row" : "column",
+            rowGap: $ ? null : W(le),
+            columnGap: $ ? W(oe) : null
           },
-          ee
+          se
         ),
         children: [
-          v && /* @__PURE__ */ l(
+          g && /* @__PURE__ */ o(
             "div",
             {
-              id: `${p}-label`,
-              className: `${z ? "u-required" : ""} u-react-select-title`,
+              id: `${m}-label`,
+              className: `${R ? n("required") : ""} ${r()}-react-select-title`,
               style: Object.assign(
                 {
-                  color: "var(--u-field-title-color, #545454)",
-                  fontSize: "var(--u-field-label-size-main, calc(14 * var(--u-unit, 1px)))"
+                  color: `var(--${r()}-field-title-color, #545454)`,
+                  fontSize: `var(--${r()}-field-label-size-main, calc(14 * var(--u-unit, 1px)))`
                 },
-                te
+                ie
               ),
-              children: v
+              children: g
             }
           ),
-          /* @__PURE__ */ h(
+          /* @__PURE__ */ O(
             "div",
             {
-              className: `u-selectbox${n ? " u-selectbox-disabled" : ""} u-react-select`,
-              ref: P,
+              className: `${r()}-selectbox${p ? ` ${r()}-selectbox-disabled` : ""} ${r()}-react-select`,
+              ref: F,
               style: Object.assign(
                 {
                   width: "100%"
                 },
-                ce
+                re
               ),
               children: [
-                /* @__PURE__ */ h("div", { style: { position: "relative", width: "100%" }, children: [
-                  Le,
-                  Q ? /* @__PURE__ */ l(
+                /* @__PURE__ */ O("div", { style: { position: "relative", width: "100%" }, children: [
+                  Ee,
+                  X ? /* @__PURE__ */ o(
                     "div",
                     {
                       role: "button",
                       tabIndex: -1,
-                      className: "u-selectbox-select-icon-cross",
+                      className: n("selectbox-select-icon-cross"),
                       "aria-label": "Очистить",
-                      onClick: q,
+                      onClick: Q,
                       onKeyDown: (e) => {
-                        (e.key === "Enter" || e.key === " ") && q(e);
+                        (e.key === "Enter" || e.key === " ") && Q(e);
                       },
                       style: Object.assign(
                         { zIndex: 2, cursor: "pointer" },
-                        m ? { right: "calc(28 * var(--u-unit, 1px))" } : {}
+                        x ? { right: "calc(28 * var(--u-unit, 1px))" } : {}
                       )
                     }
                   ) : null,
-                  /* @__PURE__ */ l(
+                  /* @__PURE__ */ o(
                     "i",
                     {
-                      className: "u-selectbox-select-icon-arrow",
+                      className: n("selectbox-select-icon-arrow"),
                       "aria-hidden": "true",
                       style: Object.assign(
                         { pointerEvents: "none" },
@@ -235,65 +235,65 @@ const ot = ({
                           transform: "rotate(180deg)",
                           top: "calc(50% - calc(4 * var(--u-unit, 1px)))"
                         } : {},
-                        m ? { right: "calc(8 * var(--u-unit, 1px))" } : {}
+                        x ? { right: "calc(8 * var(--u-unit, 1px))" } : {}
                       )
                     }
                   )
                 ] }),
-                s && x ? /* @__PURE__ */ l(
+                s && h ? /* @__PURE__ */ o(
                   "div",
                   {
-                    className: "u-selectbox-options",
+                    className: n("selectbox-options"),
                     style: { textAlign: "center", padding: "calc(16 * var(--u-unit, 1px))", display: "block" },
-                    children: /* @__PURE__ */ l("span", { className: "u-selectbox-loading", children: "Загрузка..." })
+                    children: /* @__PURE__ */ o("span", { className: n("selectbox-loading"), children: "Загрузка..." })
                   }
                 ) : null,
-                !x && w && ve && i && Ae(
-                  /* @__PURE__ */ l(
+                !h && k && $e && i && Be(
+                  /* @__PURE__ */ o(
                     "div",
                     {
-                      ref: A,
-                      ...qe(),
-                      id: p,
+                      ref: H,
+                      ...Ue(),
+                      id: m,
                       role: "listbox",
-                      className: "u-selectbox-options",
+                      className: n("selectbox-options"),
                       style: Object.assign(
                         {
-                          width: we,
+                          width: Ne,
                           left: i == null ? void 0 : i.x,
-                          top: ke ?? (i == null ? void 0 : i.y) - 60,
+                          top: Re ?? (i == null ? void 0 : i.y) - 60,
                           opacity: 1,
                           visibility: "visible",
                           height: "fit-content",
                           // Переменная, чтобы список внутри модалки можно было
                           // поднять над ней, не трогая код потребителя.
-                          zIndex: "var(--u-select-popup-z, 10010)",
+                          zIndex: `var(--${r()}-select-popup-z, 10010)`,
                           display: "block"
                         },
-                        d.optionsStyle,
-                        U(Se, H)
+                        f.optionsStyle,
+                        C(we, G)
                       ),
-                      children: o.length > 0 ? o.map((e, r) => Z(e, r)) : X
+                      children: a.length > 0 ? a.map((e, l) => _(e, l)) : Z
                     }
                   ),
                   document.body
                 ),
-                !x && !w && Oe ? /* @__PURE__ */ l(
+                !h && !k && je ? /* @__PURE__ */ o(
                   "div",
                   {
-                    ref: F,
-                    id: p,
+                    ref: B,
+                    id: m,
                     role: "listbox",
-                    className: ze ? "u-selectbox-options u-selectbox-options-up" : "u-selectbox-options",
+                    className: Te ? V("selectbox-options", "selectbox-options-up") : n("selectbox-options"),
                     style: Object.assign(
                       {},
                       // см. Select: без своего `display` переход срывается на кадре,
                       // когда vanilla уже спрятала список, а узел ещё нужен
                       { display: "block" },
-                      d.optionsStyle,
-                      U(ge, H)
+                      f.optionsStyle,
+                      C(ke, G)
                     ),
-                    children: o.length > 0 ? o.map((e, r) => Z(e, r)) : X
+                    children: a.length > 0 ? a.map((e, l) => _(e, l)) : Z
                   }
                 ) : null
               ]
@@ -302,7 +302,7 @@ const ot = ({
         ]
       }
     ),
-    O.showText && /* @__PURE__ */ l("h5", { id: `${p}-error`, className: "h5 clr-red-main", style: de ? { position: "absolute", bottom: "calc(-20 * var(--u-unit, 1px))" } : { position: "relative", marginTop: "calc(4 * var(--u-unit, 1px))" }, children: O.text })
+    w.showText && /* @__PURE__ */ o("h5", { id: `${m}-error`, className: "h5 clr-red-main", style: me ? { position: "absolute", bottom: "calc(-20 * var(--u-unit, 1px))" } : { position: "relative", marginTop: "calc(4 * var(--u-unit, 1px))" }, children: w.text })
   ] });
 };
-export { ot as SearchSelect$u };
+export { dt as SearchSelect$u };

package/dist/components/SearchSelect/SearchSelectOption.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SearchSelectOption.d.ts","sourceRoot":"","sources":["../../../src/components/SearchSelect/SearchSelectOption.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAE7D,KAAK,KAAK,GAAG;IACT,MAAM,EAAE,gBAAgB,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,oFAAoF;IACpF,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAChC,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC7C,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,GAAI,sFAShC,KAAK,4CAmCP,CAAC"}
+{"version":3,"file":"SearchSelectOption.d.ts","sourceRoot":"","sources":["../../../src/components/SearchSelect/SearchSelectOption.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAG7D,KAAK,KAAK,GAAG;IACT,MAAM,EAAE,gBAAgB,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,oFAAoF;IACpF,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAChC,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC7C,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,GAAI,sFAShC,KAAK,4CAmCP,CAAC"}

package/dist/components/SearchSelect/SearchSelectOption.js

@@ -1,36 +1,37 @@
-import { jsx as u } from "react/jsx-runtime";
-import { OPTION_STATE_COLORS$u as r } from "../../shared/optionStateColors.js";
-import { isSameOptionValue$u as m } from "../../shared/optionValue.js";
-const O = ({
+import { jsx as g } from "react/jsx-runtime";
+import { OPTION_STATE_COLORS$u as i } from "../../shared/optionStateColors.js";
+import { isSameOptionValue$u as p } from "../../shared/optionValue.js";
+import { getUiKitPrefix$u as t, kitCls$u as u } from "../../shared/uiKitDefaults.js";
+const k = ({
   option: e,
   index: o,
   listboxId: c,
-  selectedValue: i,
-  isActive: l,
-  tableView: n,
-  onSelect: s,
+  selectedValue: l,
+  isActive: n,
+  tableView: s,
+  onSelect: d,
   onHover: a
 }) => {
-  const t = m(i, e == null ? void 0 : e.value);
-  return /* @__PURE__ */ u(
+  const r = p(l, e == null ? void 0 : e.value);
+  return /* @__PURE__ */ g(
     "div",
     {
-      className: "u-selectbox-option",
+      className: u("selectbox-option"),
       "data-option-index": o,
       id: `${c}-option-${o}`,
       role: "option",
-      "aria-selected": t,
-      onClick: (d) => {
-        d.stopPropagation(), s(e);
+      "aria-selected": r,
+      onClick: (m) => {
+        m.stopPropagation(), d(e);
       },
       style: Object.assign(
-        n ? {
-          minHeight: "var(--u-compact-height)",
-          fontSize: "var(--u-compact-font-size)",
+        s ? {
+          minHeight: `var(--${t()}-compact-height)`,
+          fontSize: `var(--${t()}-compact-font-size)`,
           lineHeight: 1,
-          padding: "var(--u-compact-padding)"
+          padding: `var(--${t()}-compact-padding)`
         } : {},
-        t ? { backgroundColor: r.selectedBackground } : l ? { backgroundColor: r.hoveredBackground } : {}
+        r ? { backgroundColor: i.selectedBackground } : n ? { backgroundColor: i.hoveredBackground } : {}
       ),
       onMouseEnter: () => a(o),
       onMouseLeave: () => a(null),
@@ -38,4 +39,4 @@ const O = ({
     }
   );
 };
-export { O as SearchSelectOption$u };
+export { k as SearchSelectOption$u };

package/dist/components/Select/MobileOptionSheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MobileOptionSheet.d.ts","sourceRoot":"","sources":["../../../src/components/Select/MobileOptionSheet.tsx"],"names":[],"mappings":"AAQA,OAAO,kEAAkE,CAAC;AA4B1E,KAAK,WAAW,GAAG;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,KAAK,sBAAsB,CAAC,CAAC,SAAS,WAAW,IAAI;IACjD,MAAM,EAAE,OAAO,CAAC;IAChB,4DAA4D;IAC5D,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,CAAC,EAAE,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,OAAO,CAAC;IACnC,qGAAqG;IACrG,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,IAAI,CAAC;IAC9B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,+EAA+E;IAC/E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6FAA6F;IAC7F,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,WAAW,EAAE,EACrD,MAAM,EACN,KAAK,EACL,OAAO,EACP,QAAgB,EAChB,UAAU,EACV,QAAQ,EACR,OAAO,EACP,UAAkB,EAClB,cAAc,EACd,OAAe,GAClB,EAAE,sBAAsB,CAAC,CAAC,CAAC,2CAgH3B"}
+{"version":3,"file":"MobileOptionSheet.d.ts","sourceRoot":"","sources":["../../../src/components/Select/MobileOptionSheet.tsx"],"names":[],"mappings":"AAQA,OAAO,kEAAkE,CAAC;AA6B1E,KAAK,WAAW,GAAG;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,KAAK,sBAAsB,CAAC,CAAC,SAAS,WAAW,IAAI;IACjD,MAAM,EAAE,OAAO,CAAC;IAChB,4DAA4D;IAC5D,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,CAAC,EAAE,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,OAAO,CAAC;IACnC,qGAAqG;IACrG,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,IAAI,CAAC;IAC9B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,+EAA+E;IAC/E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6FAA6F;IAC7F,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,WAAW,EAAE,EACrD,MAAM,EACN,KAAK,EACL,OAAO,EACP,QAAgB,EAChB,UAAU,EACV,QAAQ,EACR,OAAO,EACP,UAAkB,EAClB,cAAc,EACd,OAAe,GAClB,EAAE,sBAAsB,CAAC,CAAC,CAAC,2CAgH3B"}