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

package/dist/components/SearchSelect/SearchSelect.js

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