@konstructio/ui 0.1.2-alpha.75 → 0.1.2-alpha.77

package/dist/components/Select/Select.js

@@ -1,71 +1,58 @@
-import { jsx as r, jsxs as v } from "react/jsx-runtime";
-import { forwardRef as N, useMemo as O } from "react";
-import { cn as a } from "../../utils/index.js";
-import { i as g } from "../../AdditionalOptions-C2FDVZhu.js";
-import { SelectProvider as j } from "./contexts/select.provider.js";
-import { Wrapper as k } from "./components/Wrapper.js";
-const W = N(
-  ({
-    error: e,
-    errorClassName: m,
-    helperText: l,
+import { jsx as k, jsxs as w } from "react/jsx-runtime";
+import { c as R } from "../../compiler-runtime-DA41awpA.js";
+import { forwardRef as T } from "react";
+import { cn as j } from "../../utils/index.js";
+import { i as W } from "../../AdditionalOptions-DiXvUzhu.js";
+import { Wrapper as y } from "./components/Wrapper.js";
+import { SelectProvider as B } from "./contexts/select.provider.js";
+const D = T((N, O) => {
+  const e = R.c(45);
+  let i, t, a, o, n, m, p, r, s, f, l, c;
+  e[0] !== N ? ({
+    error: t,
+    errorClassName: a,
+    helperText: o,
     helperTextClassName: n,
-    highlightSearch: o,
+    highlightSearch: m,
     mainWrapperClassName: p,
-    name: s,
+    name: r,
     value: c,
-    options: t,
-    onChange: d,
-    onBlur: i,
-    ...f
-  }, x) => {
-    const u = O(() => t.length ? g(t.at(0)) ? t.flatMap((h) => h.options) : t : [], [t]);
-    return /* @__PURE__ */ r(
-      j,
-      {
-        highlightSearch: o,
-        name: s,
-        value: c,
-        options: u,
-        onBlur: i,
-        onChange: d,
-        children: /* @__PURE__ */ v("div", { className: a("relative w-full", p), children: [
-          /* @__PURE__ */ r(
-            k,
-            {
-              error: e,
-              name: s,
-              ref: x,
-              onBlur: i,
-              groupedOptions: t,
-              ...f
-            }
-          ),
-          e ? /* @__PURE__ */ r(
-            "span",
-            {
-              className: a(
-                "text-xs text-red-700 dark:text-red-400",
-                m
-              ),
-              children: e
-            }
-          ) : null,
-          !e && l ? /* @__PURE__ */ r(
-            "span",
-            {
-              className: a(
-                "text-xs text-slate-600 dark:text-slate-200",
-                n
-              ),
-              children: l
-            }
-          ) : null
-        ] })
-      }
-    );
+    options: l,
+    onChange: f,
+    onBlur: s,
+    ...i
+  } = N, e[0] = N, e[1] = i, e[2] = t, e[3] = a, e[4] = o, e[5] = n, e[6] = m, e[7] = p, e[8] = r, e[9] = s, e[10] = f, e[11] = l, e[12] = c) : (i = e[1], t = e[2], a = e[3], o = e[4], n = e[5], m = e[6], p = e[7], r = e[8], s = e[9], f = e[10], l = e[11], c = e[12]);
+  let _;
+  e: {
+    if (!l.length) {
+      let S;
+      e[13] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (S = [], e[13] = S) : S = e[13], _ = S;
+      break e;
+    }
+    let C;
+    e[14] !== l ? (C = W(l.at(0)) ? l.flatMap(E) : l, e[14] = l, e[15] = C) : C = e[15], _ = C;
   }
-);
+  const b = _;
+  let d;
+  e[16] !== p ? (d = j("relative w-full", p), e[16] = p, e[17] = d) : d = e[17];
+  let x;
+  e[18] !== i || e[19] !== t || e[20] !== r || e[21] !== s || e[22] !== l || e[23] !== O ? (x = /* @__PURE__ */ k(y, { error: t, name: r, ref: O, onBlur: s, groupedOptions: l, ...i }), e[18] = i, e[19] = t, e[20] = r, e[21] = s, e[22] = l, e[23] = O, e[24] = x) : x = e[24];
+  let h;
+  e[25] !== t || e[26] !== a ? (h = t ? /* @__PURE__ */ k("span", { className: j("text-xs text-red-700 dark:text-red-400", a), children: t }) : null, e[25] = t, e[26] = a, e[27] = h) : h = e[27];
+  let u;
+  e[28] !== t || e[29] !== o || e[30] !== n ? (u = !t && o ? /* @__PURE__ */ k("span", { className: j("text-xs text-slate-600 dark:text-slate-200", n), children: o }) : null, e[28] = t, e[29] = o, e[30] = n, e[31] = u) : u = e[31];
+  let g;
+  e[32] !== d || e[33] !== x || e[34] !== h || e[35] !== u ? (g = /* @__PURE__ */ w("div", { className: d, children: [
+    x,
+    h,
+    u
+  ] }), e[32] = d, e[33] = x, e[34] = h, e[35] = u, e[36] = g) : g = e[36];
+  let v;
+  return e[37] !== b || e[38] !== m || e[39] !== r || e[40] !== s || e[41] !== f || e[42] !== g || e[43] !== c ? (v = /* @__PURE__ */ k(B, { highlightSearch: m, name: r, value: c, options: b, onBlur: s, onChange: f, children: g }), e[37] = b, e[38] = m, e[39] = r, e[40] = s, e[41] = f, e[42] = g, e[43] = c, e[44] = v) : v = e[44], v;
+});
+function E(N) {
+  return N.options;
+}
 export {
-  W as Select
+  D as Select
 };

package/dist/components/Select/Select.types.d.ts

@@ -89,7 +89,7 @@ type OnChangeFn = (params: {
  *
  * @see {@link https://konstructio.github.io/konstruct-ui/?path=/docs/components-select--docs Storybook}
  */
-export type SelectProps = VariantProps<typeof selectVariants> & Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> & {
+export type Props = VariantProps<typeof selectVariants> & Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> & {
     additionalOptions?: ReactNode[] | string[] | AdditionalOptionGroup[];
     className?: string;
     disabled?: boolean;
@@ -135,4 +135,6 @@ export type SelectProps = VariantProps<typeof selectVariants> & Omit<InputHTMLAt
     isInfiniteScrollEnabled?: false | undefined;
     onFetchMoreOptions?: never;
 });
+/** @deprecated Use Props instead */
+export type SelectProps = Props;
 export {};

package/dist/components/Select/Select.variants.js

@@ -1,73 +1,20 @@
 import { c as e } from "../../index-D29mdTf5.js";
-const a = e(
-  [
-    "group",
-    "border",
-    "cursor-pointer",
-    "ease-in-out",
-    "flex",
-    "items-center",
-    "justify-between",
-    "px-3",
-    "py-1",
-    "relative",
-    "rounded",
-    "transition-all",
-    "w-full",
-    "outline-none",
-    "h-10",
-    "border-gray-200",
-    "focus-visible:bg-zinc-50",
-    "aria-expanded:border-aurora-500",
-    "aria-expanded:text-aurora-500",
-    "kubefirst:aria-expanded:border-kubefirst-primary",
-    "kubefirst:aria-expanded:text-kubefirst-secondary",
-    "dark:border-metal-700",
-    "dark:focus-visible:bg-metal-800",
-    "dark:bg-metal-800"
-  ],
-  {
-    variants: {
-      hasError: {
-        true: [
-          "aria-expanded:border-red-600",
-          "aria-expanded:text-red-600",
-          "kubefirst:border-red-600",
-          "kubefirst:text-red-600",
-          "dark:border-red-500"
-        ],
-        false: ""
-      },
-      disabled: {
-        true: ["cursor-default", "bg-gray-100", "dark:bg-metal-700/80"],
-        false: []
-      }
+const a = e(["group", "border", "cursor-pointer", "ease-in-out", "flex", "items-center", "justify-between", "px-3", "py-1", "relative", "rounded", "transition-all", "w-full", "outline-none", "h-10", "border-gray-200", "focus-visible:bg-zinc-50", "aria-expanded:border-aurora-500", "aria-expanded:text-aurora-500", "kubefirst:aria-expanded:border-kubefirst-primary", "kubefirst:aria-expanded:text-kubefirst-secondary", "dark:border-metal-700", "dark:focus-visible:bg-metal-800", "dark:bg-metal-800"], {
+  variants: {
+    hasError: {
+      true: ["aria-expanded:border-red-600", "aria-expanded:text-red-600", "kubefirst:border-red-600", "kubefirst:text-red-600", "dark:border-red-500"],
+      false: ""
     },
-    defaultVariants: {
-      hasError: !1,
-      disabled: !1
+    disabled: {
+      true: ["cursor-default", "bg-gray-100", "dark:bg-metal-700/80"],
+      false: []
     }
+  },
+  defaultVariants: {
+    hasError: !1,
+    disabled: !1
   }
-), t = e([
-  "flex-1",
-  "bg-transparent",
-  "border-none",
-  "outline-none",
-  "text-metal-700",
-  "text-sm",
-  "capitalize",
-  "placeholder:text-sm",
-  "placeholder:normal-case",
-  "placeholder:select-none",
-  "dark:placeholder:text-metal-400",
-  "dark:text-metal-50"
-]), d = e([
-  "cursor-pointer",
-  "text-sm",
-  "leading-5",
-  "tracking-[0.1px]",
-  "dark:text-metal-50"
-]);
+}), t = e(["flex-1", "bg-transparent", "border-none", "outline-none", "text-metal-700", "text-sm", "capitalize", "placeholder:text-sm", "placeholder:normal-case", "placeholder:select-none", "dark:placeholder:text-metal-400", "dark:text-metal-50"]), d = e(["cursor-pointer", "text-sm", "leading-5", "tracking-[0.1px]", "dark:text-metal-50"]);
 export {
   t as inputVariants,
   d as labelVariants,

package/dist/components/Select/components/AdditionalOptions/AdditionalOptions.js

@@ -1,11 +1,12 @@
 import "react/jsx-runtime";
+import "../../../../compiler-runtime-DA41awpA.js";
 import "../../../../index-BvoZGpli.js";
 import "react";
 import "../../../../utils/index.js";
-import { A as s } from "../../../../AdditionalOptions-C2FDVZhu.js";
+import { A } from "../../../../AdditionalOptions-DiXvUzhu.js";
 import "../List/List.variants.js";
 import "./AdditionalOptions.variants.js";
 import "../../contexts/select.hook.js";
 export {
-  s as AdditionalOptions
+  A as AdditionalOptions
 };

package/dist/components/Select/components/AdditionalOptions/AdditionalOptions.types.d.ts

@@ -1,4 +1,4 @@
-import { SelectProps } from '../../Select.types';
+import { Props as SelectProps } from '../../Select.types';
 export type Props = {
     additionalOptions?: SelectProps['additionalOptions'];
 };

package/dist/components/Select/components/AdditionalOptions/AdditionalOptions.variants.js

@@ -1,26 +1,5 @@
 import { cn as e } from "../../../../utils/index.js";
-const o = e(
-  "flex",
-  "min-h-10",
-  "py-2",
-  "px-6",
-  "w-full",
-  "h-full",
-  "gap-1",
-  "items-center",
-  "text-sm",
-  "[&>svg]:-ml-1",
-  "[&>svg]:w-3.5",
-  "[&>svg]:h-3.5",
-  "[&>svg]:shrink-0",
-  "cursor-pointer",
-  "select-none",
-  "hover:bg-gray-50",
-  "hover:dark:bg-metal-700",
-  "focus:outline-0",
-  "text-blue-600",
-  "dark:text-aurora-500"
-);
+const o = e("flex", "min-h-10", "py-2", "px-6", "w-full", "h-full", "gap-1", "items-center", "text-sm", "[&>svg]:-ml-1", "[&>svg]:w-3.5", "[&>svg]:h-3.5", "[&>svg]:shrink-0", "cursor-pointer", "select-none", "hover:bg-gray-50", "hover:dark:bg-metal-700", "focus:outline-0", "text-blue-600", "dark:text-aurora-500");
 export {
   o as additionalOptionSlotClassName
 };

package/dist/components/Select/components/EmptyList.js

@@ -1,5 +1,10 @@
-import { jsx as t } from "react/jsx-runtime";
-const i = () => /* @__PURE__ */ t("div", { children: "EmptyList" });
+import { jsx as o } from "react/jsx-runtime";
+import { c as r } from "../../../compiler-runtime-DA41awpA.js";
+const c = () => {
+  const e = r.c(1);
+  let t;
+  return e[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t = /* @__PURE__ */ o("div", { children: "EmptyList" }), e[0] = t) : t = e[0], t;
+};
 export {
-  i as EmptyList
+  c as EmptyList
 };

package/dist/components/Select/components/List/List.js

@@ -4,181 +4,102 @@ import { forwardRef as W, useRef as I, useState as Y, useImperativeHandle as $,
 import { Loading as te } from "../../../Loading/Loading.js";
 import { cn as s } from "../../../../utils/index.js";
 import { useNavigationUlList as re } from "../../hooks/useNavigationList.js";
-import { A as oe, i as ne } from "../../../../AdditionalOptions-C2FDVZhu.js";
+import { A as oe, i as ne } from "../../../../AdditionalOptions-DiXvUzhu.js";
 import { ListItem as g } from "../ListItem/ListItem.js";
 import { listGroupLabelVariants as se, listVariants as ie } from "./List.variants.js";
 import { DEFAULT_LIST_SIZE as ae } from "../../constants/pagination.js";
 import { ITEM_HEIGHT_PX as le } from "../../constants/list.js";
 import { useSelectContext as ce } from "../../contexts/select.hook.js";
-const xe = W(
-  ({
-    additionalOptions: O,
-    className: P,
-    groupedOptions: l,
-    inputRef: c,
-    isLoading: _,
-    itemClassName: u,
-    name: j,
-    searchable: f = !1,
-    listItemSecondRowClassName: p,
-    wrapperInputRef: A,
-    isInfiniteScrollEnabled: h,
-    noOptionsText: F,
-    onFetchMoreOptions: L,
-    visibleItems: E
-  }, M) => {
-    const m = I(null), b = I(null), [v, k] = Y(!1), {
-      canContinueFetching: d,
-      canFilter: y,
-      isOpen: S,
-      isTyping: G,
-      options: T,
-      page: w,
-      searchTerm: n,
-      setCanContinueFetching: U,
-      setOptions: V,
-      setPage: q
-    } = ce(), z = E !== void 0 ? { maxHeight: E * le } : void 0;
-    $(M, () => m.current, [m]);
-    const i = l.length > 0 && ne(l[0]), x = f && y ? T.filter((e) => {
-      const t = n.toLowerCase();
-      return (typeof e.label == "string" ? e.label.toLowerCase() : "").includes(t);
-    }) : T, C = N(() => {
-      if (!i)
-        return [];
-      const e = l;
-      if (!f || !y || !n)
-        return e;
-      const t = n.toLowerCase();
-      return e.map((r) => ({
-        ...r,
-        options: r.options.filter(
-          (a) => a.label.toLowerCase().includes(t)
-        )
-      })).filter((r) => r.options.length > 0);
-    }, [i, l, f, y, n]), D = i ? C.flatMap((e) => e.options) : x;
-    re({
-      ulRef: m,
-      wrapperInputRef: A,
-      searchable: f,
-      filteredOptions: D
-    });
-    const X = x.filter(
-      (e, t, r) => t === r.findIndex((a) => a.value === e.value)
-    ), Z = i ? C.length === 0 : x.length === 0, B = N(
-      () => Q(async (e) => {
-        const [t] = e;
-        if (t.isIntersecting && !v && L && d)
-          try {
-            k(!0);
-            const r = w + 1, { data: a, hasMore: J } = await L({
-              page: r,
-              pageSize: ae,
-              termOfSearch: n
-            });
-            q(r), U(J), V((K) => [...K, ...a]);
-          } catch {
-            console.error("Error fetching more options");
-          } finally {
-            k(!1);
-          }
-      }, 100),
-      [v, L, n, w]
-    );
-    return R(() => {
-      if (h && d && b.current && !G) {
-        const e = new IntersectionObserver(B, {
-          threshold: 0.1
+const xe = W(({
+  additionalOptions: O,
+  className: P,
+  groupedOptions: l,
+  inputRef: c,
+  isLoading: j,
+  itemClassName: u,
+  name: A,
+  searchable: f = !1,
+  listItemSecondRowClassName: p,
+  wrapperInputRef: M,
+  isInfiniteScrollEnabled: h,
+  noOptionsText: F,
+  onFetchMoreOptions: L,
+  visibleItems: E
+}, S) => {
+  const m = I(null), b = I(null), [v, k] = Y(!1), {
+    canContinueFetching: d,
+    canFilter: y,
+    isOpen: U,
+    isTyping: G,
+    options: T,
+    page: w,
+    searchTerm: n,
+    setCanContinueFetching: V,
+    setOptions: _,
+    setPage: q
+  } = ce(), z = E !== void 0 ? {
+    maxHeight: E * le
+  } : void 0;
+  $(S, () => m.current, [m]);
+  const i = l.length > 0 && ne(l[0]), x = f && y ? T.filter((e) => {
+    const t = n.toLowerCase();
+    return (typeof e.label == "string" ? e.label.toLowerCase() : "").includes(t);
+  }) : T, C = N(() => {
+    if (!i)
+      return [];
+    const e = l;
+    if (!f || !y || !n)
+      return e;
+    const t = n.toLowerCase();
+    return e.map((r) => ({
+      ...r,
+      options: r.options.filter((a) => a.label.toLowerCase().includes(t))
+    })).filter((r) => r.options.length > 0);
+  }, [i, l, f, y, n]), D = i ? C.flatMap((e) => e.options) : x;
+  re({
+    ulRef: m,
+    wrapperInputRef: M,
+    searchable: f,
+    filteredOptions: D
+  });
+  const X = x.filter((e, t, r) => t === r.findIndex((a) => a.value === e.value)), Z = i ? C.length === 0 : x.length === 0, B = N(() => Q(async (e) => {
+    const [t] = e;
+    if (t.isIntersecting && !v && L && d)
+      try {
+        k(!0);
+        const r = w + 1, {
+          data: a,
+          hasMore: J
+        } = await L({
+          page: r,
+          pageSize: ae,
+          termOfSearch: n
         });
-        return e.observe(b.current), () => e.disconnect();
+        q(r), V(J), _((K) => [...K, ...a]);
+      } catch {
+        console.error("Error fetching more options");
+      } finally {
+        k(!1);
       }
-    }, [
-      h,
-      d,
-      v,
-      G,
-      w
-    ]), /* @__PURE__ */ H(
-      "ul",
-      {
-        ref: m,
-        title: j,
-        role: "listbox",
-        className: s(ie({ className: P })),
-        style: z,
-        "data-state": S ? "open" : "closed",
-        children: [
-          _ ? /* @__PURE__ */ o(
-            g,
-            {
-              className: s("select-none", u),
-              isClickable: !1,
-              inputRef: c,
-              value: "Loading...",
-              label: "Loading...",
-              listItemSecondRowClassName: p
-            }
-          ) : Z ? /* @__PURE__ */ o(
-            g,
-            {
-              isEmpty: !0,
-              className: s("select-none", u),
-              isClickable: !1,
-              inputRef: c,
-              value: F ?? "",
-              label: F ?? "No options",
-              listItemSecondRowClassName: p
-            }
-          ) : i ? C.map((e) => /* @__PURE__ */ H(ee, { children: [
-            /* @__PURE__ */ o(
-              "li",
-              {
-                role: "presentation",
-                "aria-hidden": "true",
-                "data-action": "true",
-                className: s(se()),
-                children: e.groupLabel
-              }
-            ),
-            e.options.map((t) => /* @__PURE__ */ o(
-              g,
-              {
-                className: s("select-none", u),
-                isClickable: !0,
-                inputRef: c,
-                listItemSecondRowClassName: p,
-                ...t
-              },
-              t.value
-            ))
-          ] }, e.groupLabel)) : X.map((e) => /* @__PURE__ */ o(
-            g,
-            {
-              className: s("select-none", u),
-              isClickable: !0,
-              inputRef: c,
-              listItemSecondRowClassName: p,
-              ...e
-            },
-            e.value
-          )),
-          h && d && /* @__PURE__ */ o(
-            "li",
-            {
-              ref: b,
-              role: "option",
-              "data-action": "true",
-              className: "flex items-center justify-center py-3",
-              onClick: (e) => e.stopPropagation(),
-              children: /* @__PURE__ */ o(te, { className: "w-4 h-4 text-aurora-500 select-none" })
-            }
-          ),
-          /* @__PURE__ */ o(oe, { additionalOptions: O })
-        ]
-      }
-    );
-  }
-);
+  }, 100), [v, L, n, w]);
+  return R(() => {
+    if (h && d && b.current && !G) {
+      const e = new IntersectionObserver(B, {
+        threshold: 0.1
+      });
+      return e.observe(b.current), () => e.disconnect();
+    }
+  }, [h, d, v, G, w]), /* @__PURE__ */ H("ul", { ref: m, title: A, role: "listbox", className: s(ie({
+    className: P
+  })), style: z, "data-state": U ? "open" : "closed", children: [
+    j ? /* @__PURE__ */ o(g, { className: s("select-none", u), isClickable: !1, inputRef: c, value: "Loading...", label: "Loading...", listItemSecondRowClassName: p }) : Z ? /* @__PURE__ */ o(g, { isEmpty: !0, className: s("select-none", u), isClickable: !1, inputRef: c, value: F ?? "", label: F ?? "No options", listItemSecondRowClassName: p }) : i ? C.map((e) => /* @__PURE__ */ H(ee, { children: [
+      /* @__PURE__ */ o("li", { role: "presentation", "aria-hidden": "true", "data-action": "true", className: s(se()), children: e.groupLabel }),
+      e.options.map((t) => /* @__PURE__ */ o(g, { className: s("select-none", u), isClickable: !0, inputRef: c, listItemSecondRowClassName: p, ...t }, t.value))
+    ] }, e.groupLabel)) : X.map((e) => /* @__PURE__ */ o(g, { className: s("select-none", u), isClickable: !0, inputRef: c, listItemSecondRowClassName: p, ...e }, e.value)),
+    h && d && /* @__PURE__ */ o("li", { ref: b, role: "option", "data-action": "true", className: "flex items-center justify-center py-3", onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ o(te, { className: "w-4 h-4 text-aurora-500 select-none" }) }),
+    /* @__PURE__ */ o(oe, { additionalOptions: O })
+  ] });
+});
 export {
   xe as List
 };

package/dist/components/Select/components/List/List.types.d.ts

@@ -1,5 +1,5 @@
 import { ComponentRef, RefObject } from 'react';
-import { SelectProps } from '../../Select.types';
+import { Props as SelectProps } from '../../Select.types';
 export type ListProps = Pick<SelectProps, 'name' | 'options' | 'theme' | 'additionalOptions'> & {
     className?: string;
     groupedOptions: SelectProps['options'];

package/dist/components/Select/components/List/List.variants.js

@@ -1,45 +1,5 @@
 import { c as t } from "../../../../index-D29mdTf5.js";
-const r = t([
-  "flex",
-  "items-center",
-  "h-8",
-  "px-6",
-  "py-1.5",
-  "text-[11px]",
-  "font-medium",
-  "uppercase",
-  "tracking-[0.25px]",
-  "text-metal-50",
-  "pointer-events-none",
-  "select-none",
-  "cursor-default"
-]), a = t([
-  "scrollbar",
-  "absolute",
-  "bg-white",
-  "border",
-  "flex-col",
-  "mt-1",
-  "overflow-hidden",
-  "rounded",
-  "shadow-2xs",
-  "top-full",
-  "w-full",
-  "z-10",
-  "max-h-44",
-  "overflow-y-auto",
-  "border-gray-200",
-  "text-zinc-700",
-  "animate-in",
-  "fade-in-50",
-  "zoom-in-95",
-  "duration-200",
-  "dark:bg-metal-800",
-  "dark:border-metal-700",
-  "dark:text-metal-50",
-  "[&>li:first-child]:mt-2",
-  "[&>li:last-child]:mb-2"
-]);
+const r = t(["flex", "items-center", "h-8", "px-6", "py-1.5", "text-[11px]", "font-medium", "uppercase", "tracking-[0.25px]", "text-metal-50", "pointer-events-none", "select-none", "cursor-default"]), a = t(["scrollbar", "absolute", "bg-white", "border", "flex-col", "mt-1", "overflow-hidden", "rounded", "shadow-2xs", "top-full", "w-full", "z-10", "max-h-44", "overflow-y-auto", "border-gray-200", "text-zinc-700", "animate-in", "fade-in-50", "zoom-in-95", "duration-200", "dark:bg-metal-800", "dark:border-metal-700", "dark:text-metal-50", "[&>li:first-child]:mt-2", "[&>li:last-child]:mb-2"]);
 export {
   r as listGroupLabelVariants,
   a as listVariants