@serendie/ui 2.1.1 → 2.1.2-dev.202509020319

package/dist/components/ModalDialog/ModalDialog.js

@@ -1,14 +1,12 @@
 import { jsx as e, jsxs as t } from "react/jsx-runtime";
-import "../../styled-system/css/css.js";
-import { cx as c } from "../../styled-system/css/cx.js";
-import "../../styled-system/helpers.js";
-import { sva as g } from "../../styled-system/css/sva.js";
 import { Button as i } from "../Button/Button.js";
-import { Portal as y } from "../../node_modules/@ark-ui/react/dist/components/portal/portal.js";
-import { DialogRoot as x } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-root.js";
-import { DialogBackdrop as f } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-backdrop.js";
-import { DialogPositioner as h } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-positioner.js";
-import { DialogContent as u } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-content.js";
+import { Portal as c } from "../../node_modules/@ark-ui/react/dist/components/portal/portal.js";
+import { sva as g } from "../../styled-system/css/sva.js";
+import { DialogRoot as y } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-root.js";
+import { DialogBackdrop as x } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-backdrop.js";
+import { DialogPositioner as f } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-positioner.js";
+import { DialogContent as h } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-content.js";
+import { cx as u } from "../../styled-system/css/cx.js";
 import { DialogTitle as b } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-title.js";
 import { DialogDescription as D } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-description.js";
 import { DialogCloseTrigger as v } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-close-trigger.js";
@@ -76,7 +74,7 @@ const I = g({
       }
     }
   }
-}), P = ({
+}), R = ({
   isOpen: n,
   title: d,
   cancelButtonLabel: a,
@@ -87,9 +85,9 @@ const I = g({
   ...o
 }) => {
   const s = I(o);
-  return /* @__PURE__ */ e(x, { open: n, ...o, children: /* @__PURE__ */ t(y, { children: [
-    /* @__PURE__ */ e(f, { className: s.backdrop }),
-    /* @__PURE__ */ e(h, { children: /* @__PURE__ */ t(u, { className: c(s.content, l), children: [
+  return /* @__PURE__ */ e(y, { open: n, ...o, children: /* @__PURE__ */ t(c, { children: [
+    /* @__PURE__ */ e(x, { className: s.backdrop }),
+    /* @__PURE__ */ e(f, { children: /* @__PURE__ */ t(h, { className: u(s.content, l), children: [
       /* @__PURE__ */ t("div", { className: s.contentInner, children: [
         /* @__PURE__ */ e(b, { className: s.title, children: d }),
         /* @__PURE__ */ e(D, { className: s.description, children: p })
@@ -102,5 +100,5 @@ const I = g({
   ] }) });
 };
 export {
-  P as ModalDialog
+  R as ModalDialog
 };

package/dist/components/NotificationBadge/NotificationBadge.js

@@ -1,9 +1,7 @@
 import { jsx as e } from "react/jsx-runtime";
-import "../../styled-system/css/css.js";
+import { sva as m } from "../../styled-system/css/sva.js";
 import { cx as a } from "../../styled-system/css/cx.js";
-import "../../styled-system/helpers.js";
-import { sva as l } from "../../styled-system/css/sva.js";
-const n = l({
+const n = m({
   slots: ["root", "text"],
   base: {
     root: {
@@ -76,15 +74,15 @@ const n = l({
     variant: "primary",
     size: "medium"
   }
-}), x = ({
+}), g = ({
   count: t,
   noNumber: s,
   className: o,
-  ...m
+  ...d
 }) => {
-  const [d, r] = n.splitVariantProps(m), i = n({ noNumber: s, ...d });
+  const [l, r] = n.splitVariantProps(d), i = n({ noNumber: s, ...l });
   return s ? /* @__PURE__ */ e("div", { className: a(i.root, o), ...r }) : !t || t < 1 ? null : /* @__PURE__ */ e("div", { className: a(i.root, o), ...r, children: /* @__PURE__ */ e("span", { className: i.text, children: t > 99 ? "99+" : t }) });
 };
 export {
-  x as NotificationBadge
+  g as NotificationBadge
 };

package/dist/components/Pagination/Pagination.d.ts

@@ -1,6 +1,6 @@
 import { default as React, ComponentProps } from 'react';
 import { RecipeVariantProps } from '../../../styled-system/css';
-export declare const PaginationStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"root" | "item" | "ellipsis" | "prevTrigger" | "nextTrigger", {
+export declare const PaginationStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"item" | "root" | "ellipsis" | "prevTrigger" | "nextTrigger", {
     size: {
         medium: {
             root: {

package/dist/components/Pagination/Pagination.js

@@ -2,17 +2,15 @@ import { jsx as e, jsxs as T, Fragment as g } from "react/jsx-runtime";
 import { SerendieSymbolChevronLeft as S, SerendieSymbolChevronRight as _ } from "@serendie/symbols";
 import C, { useState as I } from "react";
 import { IconButton as m } from "../IconButton/IconButton.js";
-import "../../styled-system/css/css.js";
-import { cx as N } from "../../styled-system/css/cx.js";
-import "../../styled-system/helpers.js";
-import { sva as j } from "../../styled-system/css/sva.js";
-import { PaginationRoot as z } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-root.js";
+import { sva as N } from "../../styled-system/css/sva.js";
+import { PaginationRoot as j } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-root.js";
+import { cx as z } from "../../styled-system/css/cx.js";
 import { PaginationContext as R } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-context.js";
 import { PaginationPrevTrigger as w } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-prev-trigger.js";
 import { PaginationItem as O } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-item.js";
 import { PaginationEllipsis as W } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-ellipsis.js";
 import { PaginationNextTrigger as F } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-next-trigger.js";
-const L = j({
+const L = N({
   slots: ["root", "item", "ellipsis", "prevTrigger", "nextTrigger"],
   base: {
     root: {
@@ -86,7 +84,7 @@ const L = j({
   defaultVariants: {
     size: "medium"
   }
-}), X = C.forwardRef(
+}), Q = C.forwardRef(
   ({
     count: d,
     pageSize: c = 1,
@@ -107,10 +105,10 @@ const L = j({
       }
     };
     return /* @__PURE__ */ e(
-      z,
+      j,
       {
         ref: u,
-        className: N(i.root, y),
+        className: z(i.root, y),
         ...v,
         ...f,
         children: /* @__PURE__ */ e(R, { children: (t) => {
@@ -190,6 +188,6 @@ const L = j({
   }
 );
 export {
-  X as Pagination,
+  Q as Pagination,
   L as PaginationStyle
 };

package/dist/components/ProgressIndicator/ProgressIndicator.js

@@ -1,9 +1,7 @@
 import { jsx as e } from "react/jsx-runtime";
-import "../../styled-system/css/css.js";
-import { cx as n } from "../../styled-system/css/cx.js";
-import { cva as l } from "../../styled-system/css/cva.js";
-import "../../styled-system/helpers.js";
-const r = l({
+import { cva as n } from "../../styled-system/css/cva.js";
+import { cx as l } from "../../styled-system/css/cx.js";
+const r = n({
   base: {
     animation: "1s linear infinite spin",
     stroke: "sd.reference.color.scale.gray.400"
@@ -36,11 +34,11 @@ const r = l({
     size: "medium",
     color: "gray"
   }
-}), g = ({
+}), d = ({
   className: t,
-  ...o
+  ...s
 }) => {
-  const [i, s] = r.splitVariantProps(o), a = r(i);
+  const [o, i] = r.splitVariantProps(s), a = r(o);
   return /* @__PURE__ */ e(
     "svg",
     {
@@ -49,8 +47,8 @@ const r = l({
       viewBox: "0 0 48 48",
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg",
-      className: n(a, t),
-      ...s,
+      className: l(a, t),
+      ...i,
       children: /* @__PURE__ */ e(
         "path",
         {
@@ -62,6 +60,6 @@ const r = l({
   );
 };
 export {
-  g as ProgressIndicator,
+  d as ProgressIndicator,
   r as ProgressIndicatorStyle
 };

package/dist/components/RadioButton/RadioButton.d.ts

@@ -20,7 +20,7 @@ export declare const radioUncheckedIconCss: {
         color: string;
     };
 };
-export declare const RadioButtonStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"itemControl" | "checkedIcon" | "itemTextGroup" | "itemText" | "helperText" | "item" | "unCheckedIcon", import('../../../styled-system/types').SlotRecipeVariantRecord<"itemControl" | "checkedIcon" | "itemTextGroup" | "itemText" | "helperText" | "item" | "unCheckedIcon">>;
+export declare const RadioButtonStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"item" | "itemControl" | "checkedIcon" | "itemTextGroup" | "itemText" | "helperText" | "unCheckedIcon", import('../../../styled-system/types').SlotRecipeVariantRecord<"item" | "itemControl" | "checkedIcon" | "itemTextGroup" | "itemText" | "helperText" | "unCheckedIcon">>;
 type RadioButtonItemProps = {
     label?: string;
     helperText?: string;

package/dist/components/RadioButton/RadioButton.js

@@ -1,14 +1,13 @@
 import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { css as x } from "../../styled-system/css/css.js";
+import x from "../../assets/radioChecked.svg.js";
+import h from "../../assets/radioUnchecked.svg.js";
+import { sva as f } from "../../styled-system/css/sva.js";
 import { cx as i } from "../../styled-system/css/cx.js";
-import "../../styled-system/helpers.js";
-import { sva as h } from "../../styled-system/css/sva.js";
-import f from "../../assets/radioChecked.svg.js";
-import g from "../../assets/radioUnchecked.svg.js";
+import { css as g } from "../../styled-system/css/css.js";
 import { RadioGroupItem as I } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item.js";
 import { RadioGroupItemContext as S } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-context.js";
 import { RadioGroupItemControl as b } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-control.js";
-import { RadioGroupItemText as m } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-text.js";
+import { RadioGroupItemText as c } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-text.js";
 import { RadioGroupItemHiddenInput as C } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-hidden-input.js";
 const k = {
   flexShrink: 0,
@@ -27,7 +26,7 @@ const k = {
   _disabled: {
     color: "color-mix(in srgb, {colors.sd.system.color.component.outlineVariant}, {colors.sd.system.color.interaction.hoveredOnPrimary});"
   }
-}, c = h({
+}, m = f({
   slots: [
     "item",
     "itemControl",
@@ -75,16 +74,16 @@ const k = {
       }
     }
   }
-}), F = ({
+}), E = ({
   value: n,
   label: t,
   helperText: s,
   className: d,
   ...a
 }) => {
-  const [l, p] = c.splitVariantProps(a), o = c(l), y = i(
+  const [l, p] = m.splitVariantProps(a), o = m(l), y = i(
     o.item,
-    s && x({ alignItems: "flex-start" })
+    s && g({ alignItems: "flex-start" })
   );
   return /* @__PURE__ */ r(
     I,
@@ -93,10 +92,10 @@ const k = {
       className: i("group", y, d),
       ...p,
       children: [
-        /* @__PURE__ */ e(S, { children: (u) => /* @__PURE__ */ e(b, { className: o.itemControl, asChild: !0, children: u.checked ? /* @__PURE__ */ e(f, { className: o.checkedIcon }) : /* @__PURE__ */ e(g, { className: o.unCheckedIcon }) }) }),
+        /* @__PURE__ */ e(S, { children: (u) => /* @__PURE__ */ e(b, { className: o.itemControl, asChild: !0, children: u.checked ? /* @__PURE__ */ e(x, { className: o.checkedIcon }) : /* @__PURE__ */ e(h, { className: o.unCheckedIcon }) }) }),
         /* @__PURE__ */ r("div", { className: o.itemTextGroup, children: [
-          t && /* @__PURE__ */ e(m, { className: o.itemText, children: t }),
-          s && /* @__PURE__ */ e(m, { className: o.helperText, children: s })
+          t && /* @__PURE__ */ e(c, { className: o.itemText, children: t }),
+          s && /* @__PURE__ */ e(c, { className: o.helperText, children: s })
         ] }),
         /* @__PURE__ */ e(C, {})
       ]
@@ -104,8 +103,8 @@ const k = {
   );
 };
 export {
-  F as RadioButton,
-  c as RadioButtonStyle,
+  E as RadioButton,
+  m as RadioButtonStyle,
   R as radioCheckedIconCss,
   k as radioIconCss,
   _ as radioUncheckedIconCss

package/dist/components/Search/Search.d.ts

@@ -1,6 +1,6 @@
 import { ComboboxRootProps } from '@ark-ui/react';
 import { RecipeVariantProps } from '../../../styled-system/css';
-export declare const SearchStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"combobox" | "input" | "icon" | "control" | "comboboxItem" | "iconBox" | "closeIcon", {
+export declare const SearchStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"icon" | "input" | "combobox" | "control" | "comboboxItem" | "iconBox" | "closeIcon", {
     size: {
         medium: {
             iconBox: {

package/dist/components/Search/Search.js

@@ -1,16 +1,12 @@
-import { jsxs as e, jsx as o } from "react/jsx-runtime";
+import { jsxs as i, jsx as o } from "react/jsx-runtime";
 import { SerendieSymbolMagnifyingGlass as p, SerendieSymbolClose as g } from "@serendie/symbols";
-import "../../styled-system/css/css.js";
-import { cx as y } from "../../styled-system/css/cx.js";
-import "../../styled-system/helpers.js";
-import { sva as x } from "../../styled-system/css/sva.js";
-import "react";
-import "../../styled-system/jsx/is-valid-prop.js";
+import { createListCollection as y } from "../../node_modules/@ark-ui/react/dist/components/collection/list-collection.js";
+import { Portal as x } from "../../node_modules/@ark-ui/react/dist/components/portal/portal.js";
 import { Box as b } from "../../styled-system/jsx/box.js";
-import { createListCollection as u } from "../../node_modules/@ark-ui/react/dist/components/collection/list-collection.js";
-import { Portal as h } from "../../node_modules/@ark-ui/react/dist/components/portal/portal.js";
-import { ComboboxRoot as f } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-root.js";
-import { ComboboxControl as S } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-control.js";
+import { sva as u } from "../../styled-system/css/sva.js";
+import { ComboboxRoot as h } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-root.js";
+import { ComboboxControl as f } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-control.js";
+import { cx as S } from "../../styled-system/css/cx.js";
 import { ComboboxInput as C } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-input.js";
 import { ComboboxTrigger as w } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-trigger.js";
 import { ComboboxPositioner as I } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-positioner.js";
@@ -18,7 +14,7 @@ import { ComboboxContent as v } from "../../node_modules/@ark-ui/react/dist/comp
 import { ComboboxItemGroup as B } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-item-group.js";
 import { ComboboxItem as N } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-item.js";
 import { ComboboxItemText as _ } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-item-text.js";
-const d = x({
+const d = u({
   slots: [
     "input",
     "control",
@@ -147,13 +143,13 @@ const d = x({
   defaultVariants: {
     size: "medium"
   }
-}), U = ({
-  items: i = [],
+}), F = ({
+  items: e = [],
   ...a
 }) => {
-  const [r, l] = d.splitVariantProps(a), s = d(r), { collection: E, ...t } = l, n = u({ items: i });
-  return /* @__PURE__ */ e(
-    f,
+  const [r, l] = d.splitVariantProps(a), s = d(r), { collection: E, ...t } = l, n = y({ items: e });
+  return /* @__PURE__ */ i(
+    h,
     {
       ...t,
       collection: n,
@@ -166,12 +162,12 @@ const d = x({
         }
       },
       children: [
-        /* @__PURE__ */ e(S, { className: y(s.control, t.className), children: [
+        /* @__PURE__ */ i(f, { className: S(s.control, t.className), children: [
           /* @__PURE__ */ o("div", { className: s.iconBox, children: /* @__PURE__ */ o(p, { className: s.icon }) }),
           /* @__PURE__ */ o(C, { className: s.input }),
-          i.length > 0 && /* @__PURE__ */ o(w, { children: /* @__PURE__ */ o("div", { className: s.closeIcon, children: /* @__PURE__ */ o(g, { className: s.icon }) }) })
+          e.length > 0 && /* @__PURE__ */ o(w, { children: /* @__PURE__ */ o("div", { className: s.closeIcon, children: /* @__PURE__ */ o(g, { className: s.icon }) }) })
         ] }),
-        i.length > 0 && /* @__PURE__ */ o(h, { children: /* @__PURE__ */ o(I, { children: /* @__PURE__ */ o(v, { className: s.combobox, children: /* @__PURE__ */ o(B, { id: "framework", children: n.items.map((m, c) => /* @__PURE__ */ e(
+        e.length > 0 && /* @__PURE__ */ o(x, { children: /* @__PURE__ */ o(I, { children: /* @__PURE__ */ o(v, { className: s.combobox, children: /* @__PURE__ */ o(B, { id: "framework", children: n.items.map((m, c) => /* @__PURE__ */ i(
           N,
           {
             item: m,
@@ -194,6 +190,6 @@ const d = x({
   );
 };
 export {
-  U as Search,
+  F as Search,
   d as SearchStyle
 };

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

@@ -1,6 +1,6 @@
 import { SelectRootProps } from '@ark-ui/react';
 import { RecipeVariantProps } from '../../../styled-system/css';
-export declare const SelectStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"content" | "root" | "item" | "valueText" | "iconBox" | "trigger", {
+export declare const SelectStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"content" | "item" | "root" | "valueText" | "iconBox" | "trigger", {
     size: {
         medium: {
             root: {
@@ -56,11 +56,12 @@ type Props = {
     required?: boolean;
     invalidMessage?: string;
     items?: selectItem[];
+    collection?: SelectRootProps<selectItem>["collection"];
 };
 type selectItem = {
     label: string;
     value: string;
 };
-type SelectStyleProps = Props & SelectRootProps<selectItem> & RecipeVariantProps<typeof SelectStyle>;
+type SelectStyleProps = Props & Omit<SelectRootProps<selectItem>, "collection"> & RecipeVariantProps<typeof SelectStyle>;
 export declare const Select: React.FC<SelectStyleProps>;
 export {};

package/dist/components/Select/Select.js

@@ -1,22 +1,21 @@
 import { jsxs as i, jsx as e } from "react/jsx-runtime";
 import { SerendieSymbolChevronDown as S } from "@serendie/symbols";
-import { css as d } from "../../styled-system/css/css.js";
-import { cx as f } from "../../styled-system/css/cx.js";
-import "../../styled-system/helpers.js";
-import { sva as v } from "../../styled-system/css/sva.js";
-import { List as w } from "../List/List.js";
-import { ListItem as _ } from "../List/ListItem.js";
-import { createListCollection as C } from "../../node_modules/@ark-ui/react/dist/components/collection/list-collection.js";
-import { Portal as T } from "../../node_modules/@ark-ui/react/dist/components/portal/portal.js";
-import { SelectRoot as N } from "../../node_modules/@ark-ui/react/dist/components/select/select-root.js";
+import { List as f } from "../List/List.js";
+import { ListItem as v } from "../List/ListItem.js";
+import { createListCollection as w } from "../../node_modules/@ark-ui/react/dist/components/collection/list-collection.js";
+import { Portal as _ } from "../../node_modules/@ark-ui/react/dist/components/portal/portal.js";
+import { sva as C } from "../../styled-system/css/sva.js";
+import { SelectRoot as T } from "../../node_modules/@ark-ui/react/dist/components/select/select-root.js";
+import { cx as N } from "../../styled-system/css/cx.js";
 import { SelectLabel as z } from "../../node_modules/@ark-ui/react/dist/components/select/select-label.js";
+import { css as d } from "../../styled-system/css/css.js";
 import { SelectControl as R } from "../../node_modules/@ark-ui/react/dist/components/select/select-control.js";
 import { SelectTrigger as V } from "../../node_modules/@ark-ui/react/dist/components/select/select-trigger.js";
 import { SelectValueText as L } from "../../node_modules/@ark-ui/react/dist/components/select/select-value-text.js";
 import { SelectPositioner as P } from "../../node_modules/@ark-ui/react/dist/components/select/select-positioner.js";
 import { SelectContent as B } from "../../node_modules/@ark-ui/react/dist/components/select/select-content.js";
 import { SelectItem as I } from "../../node_modules/@ark-ui/react/dist/components/select/select-item.js";
-const n = v({
+const n = C({
   slots: ["root", "valueText", "trigger", "content", "item", "iconBox"],
   base: {
     root: {
@@ -153,7 +152,7 @@ const n = v({
   defaultVariants: {
     size: "medium"
   }
-}), M = ({
+}), $ = ({
   placeholder: c = "",
   label: r,
   required: p,
@@ -163,18 +162,18 @@ const n = v({
   items: g = [],
   ...u
 }) => {
-  const [t, x] = n.splitVariantProps(u), o = n(t), { collection: O, ...h } = x, l = C({
+  const [t, x] = n.splitVariantProps(u), o = n(t), { collection: O, ...h } = x, l = w({
     items: g,
     itemToString: (s) => s.label,
     itemToValue: (s) => s.value
   });
   return /* @__PURE__ */ i(
-    N,
+    T,
     {
       ...h,
       collection: l,
       invalid: a,
-      className: f(o.root, y),
+      className: N(o.root, y),
       positioning: {
         sameWidth: !0,
         offset: {
@@ -232,8 +231,8 @@ const n = v({
             children: m
           }
         ),
-        /* @__PURE__ */ e(T, { children: /* @__PURE__ */ e(P, { children: /* @__PURE__ */ e(B, { className: o.content, children: /* @__PURE__ */ e(w, { children: l.items.map((s, b) => /* @__PURE__ */ e(I, { item: s, children: /* @__PURE__ */ e(
-          _,
+        /* @__PURE__ */ e(_, { children: /* @__PURE__ */ e(P, { children: /* @__PURE__ */ e(B, { className: o.content, children: /* @__PURE__ */ e(f, { children: l.items.map((s, b) => /* @__PURE__ */ e(I, { item: s, children: /* @__PURE__ */ e(
+          v,
           {
             title: s.label,
             value: s.value,
@@ -246,6 +245,6 @@ const n = v({
   );
 };
 export {
-  M as Select,
+  $ as Select,
   n as SelectStyle
 };

package/dist/components/Switch/Switch.js

@@ -1,15 +1,14 @@
 import { jsxs as e, jsx as r } from "react/jsx-runtime";
 import { forwardRef as y } from "react";
-import { css as u } from "../../styled-system/css/css.js";
+import { sva as u } from "../../styled-system/css/sva.js";
+import { SwitchRoot as b } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-root.js";
 import { cx as t } from "../../styled-system/css/cx.js";
-import "../../styled-system/helpers.js";
-import { sva as b } from "../../styled-system/css/sva.js";
-import { SwitchRoot as h } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-root.js";
 import { SwitchLabel as i } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-label.js";
-import { SwitchControl as g } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-control.js";
-import { SwitchThumb as f } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-thumb.js";
-import { SwitchHiddenInput as x } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-hidden-input.js";
-const n = b({
+import { SwitchControl as h } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-control.js";
+import { SwitchThumb as g } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-thumb.js";
+import { SwitchHiddenInput as f } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-hidden-input.js";
+import { css as x } from "../../styled-system/css/css.js";
+const n = u({
   slots: ["root", "control", "thumb", "label", "textGroup", "helperText"],
   base: {
     root: {
@@ -96,17 +95,17 @@ const n = b({
       }
     }
   }
-}), G = y(
+}), F = y(
   ({ label: d, helperText: s, className: a, ...l }, m) => {
     const [c, p] = n.splitVariantProps(l), o = n(c);
     return /* @__PURE__ */ e(
-      h,
+      b,
       {
         ref: m,
         className: t(
           "group",
           o.root,
-          s && u({ alignItems: "flex-start" }),
+          s && x({ alignItems: "flex-start" }),
           a
         ),
         ...p,
@@ -115,14 +114,14 @@ const n = b({
             /* @__PURE__ */ r(i, { className: o.label, children: d }),
             s && /* @__PURE__ */ r(i, { className: o.helperText, children: s })
           ] }),
-          /* @__PURE__ */ r(g, { className: t("control", o.control), children: /* @__PURE__ */ r(f, { className: o.thumb }) }),
-          /* @__PURE__ */ r(x, {})
+          /* @__PURE__ */ r(h, { className: t("control", o.control), children: /* @__PURE__ */ r(g, { className: o.thumb }) }),
+          /* @__PURE__ */ r(f, {})
         ]
       }
     );
   }
 );
 export {
-  G as Switch,
+  F as Switch,
   n as SwitchStyle
 };

package/dist/components/Tabs/TabItem.d.ts

@@ -1,6 +1,6 @@
 import { Tabs as ArkTabs } from '@ark-ui/react';
 import { RecipeVariantProps } from '../../../styled-system/css';
-export declare const TabItemStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"dot" | "badge" | "trigger" | "badgeBox", import('../../../styled-system/types').SlotRecipeVariantRecord<"dot" | "badge" | "trigger" | "badgeBox">>;
+export declare const TabItemStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"badge" | "dot" | "trigger" | "badgeBox", import('../../../styled-system/types').SlotRecipeVariantRecord<"badge" | "dot" | "trigger" | "badgeBox">>;
 type TabItemBaseProps = {
     title: string;
     value: string;

package/dist/components/Tabs/TabItem.js

@@ -1,11 +1,9 @@
 import { jsxs as y, jsx as o } from "react/jsx-runtime";
-import "../../styled-system/css/css.js";
-import { cx as b } from "../../styled-system/css/cx.js";
-import "../../styled-system/helpers.js";
-import { sva as u } from "../../styled-system/css/sva.js";
 import { NotificationBadge as i } from "../NotificationBadge/NotificationBadge.js";
-import { TabTrigger as h } from "../../node_modules/@ark-ui/react/dist/components/tabs/tab-trigger.js";
-const l = u({
+import { sva as b } from "../../styled-system/css/sva.js";
+import { TabTrigger as u } from "../../node_modules/@ark-ui/react/dist/components/tabs/tab-trigger.js";
+import { cx as h } from "../../styled-system/css/cx.js";
+const l = b({
   slots: ["trigger", "dot", "badgeBox", "badge"],
   base: {
     trigger: {
@@ -60,7 +58,7 @@ const l = u({
       backgroundColor: "color-mix(in srgb, {colors.sd.system.color.interaction.hoveredOnPrimary}, {colors.sd.system.color.impression.negativeContainer});"
     }
   }
-}), C = ({
+}), B = ({
   title: n,
   value: a,
   disabled: r,
@@ -71,10 +69,10 @@ const l = u({
 }) => {
   const [p, g] = l.splitVariantProps(m), e = l(p), s = r ? e.badge : "";
   return /* @__PURE__ */ y(
-    h,
+    u,
     {
       value: a,
-      className: b(e.trigger, d),
+      className: h(e.trigger, d),
       disabled: r,
       ...g,
       children: [
@@ -93,6 +91,6 @@ const l = u({
   );
 };
 export {
-  C as TabItem,
+  B as TabItem,
   l as TabItemStyle
 };

package/dist/components/Tabs/Tabs.js

@@ -1,11 +1,9 @@
 import { jsx as t } from "react/jsx-runtime";
-import "../../styled-system/css/css.js";
-import { cx as n } from "../../styled-system/css/cx.js";
-import "../../styled-system/helpers.js";
-import { sva as l } from "../../styled-system/css/sva.js";
-import { TabsRoot as p } from "../../node_modules/@ark-ui/react/dist/components/tabs/tabs-root.js";
+import { sva as n } from "../../styled-system/css/sva.js";
+import { TabsRoot as l } from "../../node_modules/@ark-ui/react/dist/components/tabs/tabs-root.js";
+import { cx as p } from "../../styled-system/css/cx.js";
 import { TabList as c } from "../../node_modules/@ark-ui/react/dist/components/tabs/tab-list.js";
-const o = l({
+const o = n({
   slots: ["root", "list"],
   base: {
     root: {
@@ -19,11 +17,11 @@ const o = l({
       justifyContent: "space-around"
     }
   }
-}), g = ({ children: r, className: i, ...e }) => {
-  const [a, m] = o.splitVariantProps(e), s = o(a);
-  return /* @__PURE__ */ t(p, { className: n(s.root, i), ...m, children: /* @__PURE__ */ t(c, { className: s.list, children: r }) });
+}), u = ({ children: r, className: e, ...i }) => {
+  const [a, m] = o.splitVariantProps(i), s = o(a);
+  return /* @__PURE__ */ t(l, { className: p(s.root, e), ...m, children: /* @__PURE__ */ t(c, { className: s.list, children: r }) });
 };
 export {
-  g as Tabs,
+  u as Tabs,
   o as TabsStyle
 };