ics-ui-kit 0.1.0-alpha.9 → 0.1.0

package/dist/components/stepper/components/stepper-trigger/StepperTrigger.d.ts

@@ -0,0 +1,4 @@
+export interface StepperTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    asChild?: boolean;
+}
+export declare function StepperTrigger({ asChild, className, children, ...props }: StepperTriggerProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/stepper/index.d.ts

@@ -0,0 +1,9 @@
+export { Stepper, type StepperProps } from './Stepper';
+export { useStepper, StepperContext } from './StepperContext';
+export { StepperItem, type StepperItemProps } from './components/stepper-item/StepperItem';
+export { StepItemContext, useStepItem } from './components/stepper-item/StepperItemContext';
+export { StepperIndicator, type StepperIndicatorProps } from './components/stepper-indicator/StepperIndicator';
+export { StepperTitle } from './components/stepper-title/StepperTitle';
+export { StepperTrigger, type StepperTriggerProps } from './components/stepper-trigger/StepperTrigger';
+export { StepperSeparator } from './stepper-separator/StepperSeparator';
+export { StepperDescription } from './components/stepper-description/StepperDescription';

package/dist/components/stepper/stepper-separator/StepperSeparator.d.ts

@@ -0,0 +1 @@
+export declare function StepperSeparator({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;

package/dist/components/stepper.d.ts

@@ -0,0 +1,2 @@
+export * from './stepper/index'
+export {}

package/dist/components/stepper.js

@@ -0,0 +1,145 @@
+import { jsx as a, jsxs as y, Fragment as w } from "react/jsx-runtime";
+import * as m from "react";
+import { createContext as g, useContext as S } from "react";
+import { T as c } from "../index-BVqs-uqP.js";
+import { I as f } from "../Icon-DH3ev9GK.js";
+import { C as I } from "../check-CeyaOoZv.js";
+import { L as N } from "../loader-circle-D1YXTEGq.js";
+import { S as z } from "../index-BtQfgaSF.js";
+const b = g(void 0), x = () => {
+  const t = S(b);
+  if (!t)
+    throw new Error("useStepper must be used within a Stepper");
+  return t;
+}, C = c({
+  base: "group/stepper inline-flex data-[orientation=horizontal]:w-full data-[orientation=horizontal]:flex-row data-[orientation=vertical]:flex-col"
+});
+function H({
+  defaultValue: t = 0,
+  value: e,
+  onValueChange: o,
+  orientation: s = "horizontal",
+  className: i,
+  ...n
+}) {
+  const [p, r] = m.useState(t), l = m.useCallback(
+    (u) => {
+      e === void 0 && r(u), o?.(u);
+    },
+    [e, o]
+  ), d = e ?? p;
+  return /* @__PURE__ */ a(
+    b.Provider,
+    {
+      value: {
+        activeStep: d,
+        setActiveStep: l,
+        orientation: s
+      },
+      children: /* @__PURE__ */ a(
+        "div",
+        {
+          "data-slot": "stepper",
+          className: C({ className: i }),
+          "data-orientation": s,
+          ...n
+        }
+      )
+    }
+  );
+}
+const v = g(void 0), h = () => {
+  const t = S(v);
+  if (!t)
+    throw new Error("useStepItem must be used within a StepperItem");
+  return t;
+}, k = c({
+  base: "group/step flex items-center group-data-[orientation=horizontal]/stepper:flex-row group-data-[orientation=vertical]/stepper:flex-col"
+});
+function J({
+  step: t,
+  completed: e = !1,
+  disabled: o = !1,
+  loading: s = !1,
+  className: i,
+  children: n,
+  ...p
+}) {
+  const { activeStep: r } = x(), l = e || t < r ? "completed" : r === t ? "active" : "inactive", d = s && t === r;
+  return /* @__PURE__ */ a(v.Provider, { value: { step: t, state: l, isDisabled: o, isLoading: d }, children: /* @__PURE__ */ a(
+    "div",
+    {
+      "data-slot": "stepper-item",
+      className: k({ className: i }),
+      "data-state": l,
+      ...d ? { "data-loading": !0 } : {},
+      ...p,
+      children: n
+    }
+  ) });
+}
+const T = c({
+  slots: {
+    indicator: "relative flex size-6 shrink-0 items-center justify-center rounded-full bg-secondary-border text-xs font-medium text-muted data-[state=active]:bg-primary-accent data-[state=completed]:bg-primary-accent data-[state=active]:text-primary-bg data-[state=completed]:text-primary-bg",
+    step: "group-data-loading/step:scale-0 group-data-loading/step:opacity-0 group-data-loading/step:transition-none transition-all group-data-[state=completed]/step:scale-0 group-data-[state=completed]/step:opacity-0",
+    check: "absolute scale-0 opacity-0 transition-all group-data-[state=completed]/step:scale-100 group-data-[state=completed]/step:opacity-100",
+    loader: "absolute transition-all"
+  }
+});
+function K({ asChild: t = !1, className: e, children: o, ...s }) {
+  const { state: i, step: n, isLoading: p } = h(), r = T();
+  return /* @__PURE__ */ a("span", { "data-slot": "stepper-indicator", className: r.indicator({ className: e }), "data-state": i, ...s, children: t ? o : /* @__PURE__ */ y(w, { children: [
+    /* @__PURE__ */ a("span", { className: r.step(), children: n }),
+    /* @__PURE__ */ a(f, { icon: I, className: r.check(), "aria-hidden": "true" }),
+    p && /* @__PURE__ */ a("span", { className: r.loader(), children: /* @__PURE__ */ a(f, { icon: N, className: "animate-spin", "aria-hidden": "true" }) })
+  ] }) });
+}
+const D = c({
+  base: "text-sm font-medium text-primary-fg"
+});
+function M({ className: t, ...e }) {
+  return /* @__PURE__ */ a("h3", { "data-slot": "stepper-title", className: D({ className: t }), ...e });
+}
+const L = c({
+  base: "inline-flex items-center gap-3 rounded-full outline-none focus-visible:z-10 focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50"
+});
+function O({ asChild: t = !1, className: e, children: o, ...s }) {
+  const { setActiveStep: i } = x(), { step: n, isDisabled: p } = h();
+  return t ? /* @__PURE__ */ a(t ? z : "span", { "data-slot": "stepper-trigger", className: e, children: o }) : /* @__PURE__ */ a(
+    "button",
+    {
+      "data-slot": "stepper-trigger",
+      className: L({ className: e }),
+      onClick: () => i(n),
+      disabled: p,
+      ...s,
+      children: o
+    }
+  );
+}
+const j = c({
+  base: "m-0.5 bg-secondary-border group-data-[orientation=horizontal]/stepper:h-0.5 group-data-[orientation=vertical]/stepper:h-12 group-data-[orientation=horizontal]/stepper:w-full group-data-[orientation=vertical]/stepper:w-0.5 group-data-[orientation=horizontal]/stepper:flex-1 group-data-[state=completed]/step:bg-primary"
+});
+function Q({ className: t, ...e }) {
+  return /* @__PURE__ */ a("div", { "data-slot": "stepper-separator", className: j({ className: t }), ...e });
+}
+const A = c({
+  base: "text-sm text-muted"
+});
+function U({ className: t, ...e }) {
+  return /* @__PURE__ */ a("p", { "data-slot": "stepper-description", className: A({ className: t }), ...e });
+}
+export {
+  v as StepItemContext,
+  H as Stepper,
+  b as StepperContext,
+  U as StepperDescription,
+  K as StepperIndicator,
+  J as StepperItem,
+  Q as StepperSeparator,
+  M as StepperTitle,
+  O as StepperTrigger,
+  h as useStepItem,
+  x as useStepper
+};
+//# sourceMappingURL=stepper.js.map

package/dist/components/stepper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stepper.js","sources":["../../src/components/stepper/StepperContext.tsx","../../src/components/stepper/Stepper.tsx","../../src/components/stepper/components/stepper-item/StepperItemContext.tsx","../../src/components/stepper/components/stepper-item/StepperItem.tsx","../../src/components/stepper/components/stepper-indicator/StepperIndicator.tsx","../../src/components/stepper/components/stepper-title/StepperTitle.tsx","../../src/components/stepper/components/stepper-trigger/StepperTrigger.tsx","../../src/components/stepper/stepper-separator/StepperSeparator.tsx","../../src/components/stepper/components/stepper-description/StepperDescription.tsx"],"sourcesContent":["import { createContext, useContext } from \"react\";\r\n\r\ntype StepperContextValue = {\r\n\tactiveStep: number;\r\n\tsetActiveStep: (step: number) => void;\r\n\torientation: \"horizontal\" | \"vertical\";\r\n};\r\n\r\nexport const StepperContext = createContext<StepperContextValue | undefined>(undefined);\r\n\r\nexport const useStepper = () => {\r\n\tconst context = useContext(StepperContext);\r\n\tif (!context) {\r\n\t\tthrow new Error(\"useStepper must be used within a Stepper\");\r\n\t}\r\n\treturn context;\r\n};\r\n","import * as React from \"react\";\r\nimport { StepperContext } from \"@/components/stepper/StepperContext\";\r\nimport { tv } from \"tailwind-variants\";\r\n\r\nexport interface StepperProps extends React.HTMLAttributes<HTMLDivElement> {\r\n\tdefaultValue?: number;\r\n\tvalue?: number;\r\n\tonValueChange?: (value: number) => void;\r\n\torientation?: \"horizontal\" | \"vertical\";\r\n}\r\n\r\nconst stepperStyles = tv({\r\n\tbase: \"group/stepper inline-flex data-[orientation=horizontal]:w-full data-[orientation=horizontal]:flex-row data-[orientation=vertical]:flex-col\"\r\n});\r\n\r\nexport function Stepper({\r\n\tdefaultValue = 0,\r\n\tvalue,\r\n\tonValueChange,\r\n\torientation = \"horizontal\",\r\n\tclassName,\r\n\t...props\r\n}: StepperProps) {\r\n\tconst [activeStep, setInternalStep] = React.useState(defaultValue);\r\n\r\n\tconst setActiveStep = React.useCallback(\r\n\t\t(step: number) => {\r\n\t\t\tif (value === undefined) {\r\n\t\t\t\tsetInternalStep(step);\r\n\t\t\t}\r\n\t\t\tonValueChange?.(step);\r\n\t\t},\r\n\t\t[value, onValueChange]\r\n\t);\r\n\r\n\tconst currentStep = value ?? activeStep;\r\n\r\n\treturn (\r\n\t\t<StepperContext.Provider\r\n\t\t\tvalue={{\r\n\t\t\t\tactiveStep: currentStep,\r\n\t\t\t\tsetActiveStep,\r\n\t\t\t\torientation\r\n\t\t\t}}\r\n\t\t>\r\n\t\t\t<div\r\n\t\t\t\tdata-slot=\"stepper\"\r\n\t\t\t\tclassName={stepperStyles({ className })}\r\n\t\t\t\tdata-orientation={orientation}\r\n\t\t\t\t{...props}\r\n\t\t\t/>\r\n\t\t</StepperContext.Provider>\r\n\t);\r\n}\r\n","import { createContext, useContext } from \"react\";\r\n\r\ntype StepItemContextValue = {\r\n\tstep: number;\r\n\tstate: StepState;\r\n\tisDisabled: boolean;\r\n\tisLoading: boolean;\r\n};\r\n\r\nexport type StepState = \"active\" | \"completed\" | \"inactive\" | \"loading\";\r\n\r\nexport const StepItemContext = createContext<StepItemContextValue | undefined>(undefined);\r\n\r\nexport const useStepItem = () => {\r\n\tconst context = useContext(StepItemContext);\r\n\tif (!context) {\r\n\t\tthrow new Error(\"useStepItem must be used within a StepperItem\");\r\n\t}\r\n\treturn context;\r\n};\r\n","import { StepItemContext, StepState } from \"@/components/stepper/components/stepper-item/StepperItemContext\";\r\nimport { useStepper } from \"@/components/stepper/StepperContext\";\r\nimport { tv } from \"tailwind-variants\";\r\n\r\nexport interface StepperItemProps extends React.HTMLAttributes<HTMLDivElement> {\r\n\tstep: number;\r\n\tcompleted?: boolean;\r\n\tdisabled?: boolean;\r\n\tloading?: boolean;\r\n}\r\n\r\nconst stepperItemStyles = tv({\r\n\tbase: \"group/step flex items-center group-data-[orientation=horizontal]/stepper:flex-row group-data-[orientation=vertical]/stepper:flex-col\"\r\n});\r\n\r\nexport function StepperItem({\r\n\tstep,\r\n\tcompleted = false,\r\n\tdisabled = false,\r\n\tloading = false,\r\n\tclassName,\r\n\tchildren,\r\n\t...props\r\n}: StepperItemProps) {\r\n\tconst { activeStep } = useStepper();\r\n\r\n\tconst state: StepState = completed || step < activeStep ? \"completed\" : activeStep === step ? \"active\" : \"inactive\";\r\n\r\n\tconst isLoading = loading && step === activeStep;\r\n\r\n\treturn (\r\n\t\t<StepItemContext.Provider value={{ step, state, isDisabled: disabled, isLoading }}>\r\n\t\t\t<div\r\n\t\t\t\tdata-slot=\"stepper-item\"\r\n\t\t\t\tclassName={stepperItemStyles({ className })}\r\n\t\t\t\tdata-state={state}\r\n\t\t\t\t{...(isLoading ? { \"data-loading\": true } : {})}\r\n\t\t\t\t{...props}\r\n\t\t\t>\r\n\t\t\t\t{children}\r\n\t\t\t</div>\r\n\t\t</StepItemContext.Provider>\r\n\t);\r\n}\r\n","import { Icon } from \"@/components/icon\";\r\nimport { useStepItem } from \"@/components/stepper/components/stepper-item/StepperItemContext\";\r\nimport { CheckIcon, LoaderCircleIcon } from \"lucide-react\";\r\nimport { tv } from \"tailwind-variants\";\r\n\r\nexport interface StepperIndicatorProps extends React.HTMLAttributes<HTMLDivElement> {\r\n\tasChild?: boolean;\r\n}\r\n\r\nconst stepperIndicatorStyles = tv({\r\n\tslots: {\r\n\t\tindicator:\r\n\t\t\t\"relative flex size-6 shrink-0 items-center justify-center rounded-full bg-secondary-border text-xs font-medium text-muted data-[state=active]:bg-primary-accent data-[state=completed]:bg-primary-accent data-[state=active]:text-primary-bg data-[state=completed]:text-primary-bg\",\r\n\t\tstep: \"group-data-loading/step:scale-0 group-data-loading/step:opacity-0 group-data-loading/step:transition-none transition-all group-data-[state=completed]/step:scale-0 group-data-[state=completed]/step:opacity-0\",\r\n\t\tcheck: \"absolute scale-0 opacity-0 transition-all group-data-[state=completed]/step:scale-100 group-data-[state=completed]/step:opacity-100\",\r\n\t\tloader: \"absolute transition-all\"\r\n\t}\r\n});\r\n\r\nexport function StepperIndicator({ asChild = false, className, children, ...props }: StepperIndicatorProps) {\r\n\tconst { state, step, isLoading } = useStepItem();\r\n\tconst styles = stepperIndicatorStyles();\r\n\r\n\treturn (\r\n\t\t<span data-slot=\"stepper-indicator\" className={styles.indicator({ className })} data-state={state} {...props}>\r\n\t\t\t{asChild ? (\r\n\t\t\t\tchildren\r\n\t\t\t) : (\r\n\t\t\t\t<>\r\n\t\t\t\t\t<span className={styles.step()}>{step}</span>\r\n\t\t\t\t\t<Icon icon={CheckIcon} className={styles.check()} aria-hidden=\"true\" />\r\n\t\t\t\t\t{isLoading && (\r\n\t\t\t\t\t\t<span className={styles.loader()}>\r\n\t\t\t\t\t\t\t<Icon icon={LoaderCircleIcon} className=\"animate-spin\" aria-hidden=\"true\" />\r\n\t\t\t\t\t\t</span>\r\n\t\t\t\t\t)}\r\n\t\t\t\t</>\r\n\t\t\t)}\r\n\t\t</span>\r\n\t);\r\n}\r\n","import { tv } from \"tailwind-variants\";\r\n\r\nconst stepperTitleStyles = tv({\r\n\tbase: \"text-sm font-medium text-primary-fg\"\r\n});\r\n\r\nexport function StepperTitle({ className, ...props }: React.HTMLAttributes<HTMLHeadingElement>) {\r\n\treturn <h3 data-slot=\"stepper-title\" className={stepperTitleStyles({ className })} {...props} />;\r\n}\r\n","import { useStepItem } from \"@/components/stepper/components/stepper-item/StepperItemContext\";\r\nimport { useStepper } from \"@/components/stepper/StepperContext\";\r\nimport { Slot } from \"@radix-ui/react-slot\";\r\nimport { tv } from \"tailwind-variants\";\r\n\r\nexport interface StepperTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n\tasChild?: boolean;\r\n}\r\n\r\nconst stepperTriggerStyles = tv({\r\n\tbase: \"inline-flex items-center gap-3 rounded-full outline-none focus-visible:z-10 focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50\"\r\n});\r\n\r\nexport function StepperTrigger({ asChild = false, className, children, ...props }: StepperTriggerProps) {\r\n\tconst { setActiveStep } = useStepper();\r\n\tconst { step, isDisabled } = useStepItem();\r\n\r\n\tif (asChild) {\r\n\t\tconst Comp = asChild ? Slot : \"span\";\r\n\t\treturn (\r\n\t\t\t<Comp data-slot=\"stepper-trigger\" className={className}>\r\n\t\t\t\t{children}\r\n\t\t\t</Comp>\r\n\t\t);\r\n\t}\r\n\r\n\treturn (\r\n\t\t<button\r\n\t\t\tdata-slot=\"stepper-trigger\"\r\n\t\t\tclassName={stepperTriggerStyles({ className })}\r\n\t\t\tonClick={() => setActiveStep(step)}\r\n\t\t\tdisabled={isDisabled}\r\n\t\t\t{...props}\r\n\t\t>\r\n\t\t\t{children}\r\n\t\t</button>\r\n\t);\r\n}\r\n","import { tv } from \"tailwind-variants\";\r\n\r\nconst stepperSeparatorStyles = tv({\r\n\tbase: \"m-0.5 bg-secondary-border group-data-[orientation=horizontal]/stepper:h-0.5 group-data-[orientation=vertical]/stepper:h-12 group-data-[orientation=horizontal]/stepper:w-full group-data-[orientation=vertical]/stepper:w-0.5 group-data-[orientation=horizontal]/stepper:flex-1 group-data-[state=completed]/step:bg-primary\"\r\n});\r\n\r\nexport function StepperSeparator({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\r\n\treturn <div data-slot=\"stepper-separator\" className={stepperSeparatorStyles({ className })} {...props} />;\r\n}\r\n","import { tv } from \"tailwind-variants\";\r\n\r\nconst stepperDescriptionStyles = tv({\r\n\tbase: \"text-sm text-muted\"\r\n});\r\n\r\nexport function StepperDescription({ className, ...props }: React.HTMLAttributes<HTMLParagraphElement>) {\r\n\treturn <p data-slot=\"stepper-description\" className={stepperDescriptionStyles({ className })} {...props} />;\r\n}\r\n"],"names":["StepperContext","createContext","useStepper","context","useContext","stepperStyles","tv","Stepper","defaultValue","value","onValueChange","orientation","className","props","activeStep","setInternalStep","React","setActiveStep","step","currentStep","jsx","StepItemContext","useStepItem","stepperItemStyles","StepperItem","completed","disabled","loading","children","state","isLoading","stepperIndicatorStyles","StepperIndicator","asChild","styles","jsxs","Fragment","Icon","CheckIcon","LoaderCircleIcon","stepperTitleStyles","StepperTitle","stepperTriggerStyles","StepperTrigger","isDisabled","Slot","stepperSeparatorStyles","StepperSeparator","stepperDescriptionStyles","StepperDescription"],"mappings":";;;;;;;;AAQa,MAAAA,IAAiBC,EAA+C,MAAS,GAEzEC,IAAa,MAAM;AACzB,QAAAC,IAAUC,EAAWJ,CAAc;AACzC,MAAI,CAACG;AACE,UAAA,IAAI,MAAM,0CAA0C;AAEpD,SAAAA;AACR,GCLME,IAAgBC,EAAG;AAAA,EACxB,MAAM;AACP,CAAC;AAEM,SAASC,EAAQ;AAAA,EACvB,cAAAC,IAAe;AAAA,EACf,OAAAC;AAAA,EACA,eAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,WAAAC;AAAA,EACA,GAAGC;AACJ,GAAiB;AAChB,QAAM,CAACC,GAAYC,CAAe,IAAIC,EAAM,SAASR,CAAY,GAE3DS,IAAgBD,EAAM;AAAA,IAC3B,CAACE,MAAiB;AACjB,MAAIT,MAAU,UACbM,EAAgBG,CAAI,GAErBR,IAAgBQ,CAAI;AAAA,IACrB;AAAA,IACA,CAACT,GAAOC,CAAa;AAAA,EACtB,GAEMS,IAAcV,KAASK;AAG5B,SAAA,gBAAAM;AAAA,IAACpB,EAAe;AAAA,IAAf;AAAA,MACA,OAAO;AAAA,QACN,YAAYmB;AAAA,QACZ,eAAAF;AAAA,QACA,aAAAN;AAAA,MACD;AAAA,MAEA,UAAA,gBAAAS;AAAA,QAAC;AAAA,QAAA;AAAA,UACA,aAAU;AAAA,UACV,WAAWf,EAAc,EAAE,WAAAO,GAAW;AAAA,UACtC,oBAAkBD;AAAA,UACjB,GAAGE;AAAA,QAAA;AAAA,MAAA;AAAA,IACL;AAAA,EACD;AAEF;AC1Ca,MAAAQ,IAAkBpB,EAAgD,MAAS,GAE3EqB,IAAc,MAAM;AAC1B,QAAAnB,IAAUC,EAAWiB,CAAe;AAC1C,MAAI,CAAClB;AACE,UAAA,IAAI,MAAM,+CAA+C;AAEzD,SAAAA;AACR,GCRMoB,IAAoBjB,EAAG;AAAA,EAC5B,MAAM;AACP,CAAC;AAEM,SAASkB,EAAY;AAAA,EAC3B,MAAAN;AAAA,EACA,WAAAO,IAAY;AAAA,EACZ,UAAAC,IAAW;AAAA,EACX,SAAAC,IAAU;AAAA,EACV,WAAAf;AAAA,EACA,UAAAgB;AAAA,EACA,GAAGf;AACJ,GAAqB;AACd,QAAA,EAAE,YAAAC,EAAW,IAAIZ,EAAW,GAE5B2B,IAAmBJ,KAAaP,IAAOJ,IAAa,cAAcA,MAAeI,IAAO,WAAW,YAEnGY,IAAYH,KAAWT,MAASJ;AAGrC,SAAA,gBAAAM,EAACC,EAAgB,UAAhB,EAAyB,OAAO,EAAE,MAAAH,GAAM,OAAAW,GAAO,YAAYH,GAAU,WAAAI,EACrE,GAAA,UAAA,gBAAAV;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWG,EAAkB,EAAE,WAAAX,GAAW;AAAA,MAC1C,cAAYiB;AAAA,MACX,GAAIC,IAAY,EAAE,gBAAgB,OAAS,CAAC;AAAA,MAC5C,GAAGjB;AAAA,MAEH,UAAAe;AAAA,IAAA;AAAA,EAAA,GAEH;AAEF;AClCA,MAAMG,IAAyBzB,EAAG;AAAA,EACjC,OAAO;AAAA,IACN,WACC;AAAA,IACD,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,EAAA;AAEV,CAAC;AAEe,SAAA0B,EAAiB,EAAE,SAAAC,IAAU,IAAO,WAAArB,GAAW,UAAAgB,GAAU,GAAGf,KAAgC;AAC3G,QAAM,EAAE,OAAAgB,GAAO,MAAAX,GAAM,WAAAY,EAAA,IAAcR,EAAY,GACzCY,IAASH,EAAuB;AAEtC,2BACE,QAAK,EAAA,aAAU,qBAAoB,WAAWG,EAAO,UAAU,EAAE,WAAAtB,EAAW,CAAA,GAAG,cAAYiB,GAAQ,GAAGhB,GACrG,UAAAoB,IACAL,IAGC,gBAAAO,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAhB,EAAC,QAAK,EAAA,WAAWc,EAAO,QAAS,UAAKhB,GAAA;AAAA,IACtC,gBAAAE,EAACiB,KAAK,MAAMC,GAAW,WAAWJ,EAAO,MAAS,GAAA,eAAY,QAAO;AAAA,IACpEJ,KACA,gBAAAV,EAAC,QAAK,EAAA,WAAWc,EAAO,OAAO,GAC9B,UAAC,gBAAAd,EAAAiB,GAAA,EAAK,MAAME,GAAkB,WAAU,gBAAe,eAAY,QAAO,EAC3E,CAAA;AAAA,EAAA,EAAA,CAEF,EAEF,CAAA;AAEF;ACtCA,MAAMC,IAAqBlC,EAAG;AAAA,EAC7B,MAAM;AACP,CAAC;AAEM,SAASmC,EAAa,EAAE,WAAA7B,GAAW,GAAGC,KAAmD;AACxF,SAAA,gBAAAO,EAAC,MAAG,EAAA,aAAU,iBAAgB,WAAWoB,EAAmB,EAAE,WAAA5B,EAAU,CAAC,GAAI,GAAGC,EAAO,CAAA;AAC/F;ACCA,MAAM6B,IAAuBpC,EAAG;AAAA,EAC/B,MAAM;AACP,CAAC;AAEe,SAAAqC,EAAe,EAAE,SAAAV,IAAU,IAAO,WAAArB,GAAW,UAAAgB,GAAU,GAAGf,KAA8B;AACjG,QAAA,EAAE,eAAAI,EAAc,IAAIf,EAAW,GAC/B,EAAE,MAAAgB,GAAM,YAAA0B,EAAW,IAAItB,EAAY;AAEzC,SAAIW,IAGD,gBAAAb,EAFWa,IAAUY,IAAO,QAE5B,EAAK,aAAU,mBAAkB,WAAAjC,GAChC,UAAAgB,GACF,IAKD,gBAAAR;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWsB,EAAqB,EAAE,WAAA9B,GAAW;AAAA,MAC7C,SAAS,MAAMK,EAAcC,CAAI;AAAA,MACjC,UAAU0B;AAAA,MACT,GAAG/B;AAAA,MAEH,UAAAe;AAAA,IAAA;AAAA,EACF;AAEF;ACnCA,MAAMkB,IAAyBxC,EAAG;AAAA,EACjC,MAAM;AACP,CAAC;AAEM,SAASyC,EAAiB,EAAE,WAAAnC,GAAW,GAAGC,KAA+C;AACxF,SAAA,gBAAAO,EAAC,OAAI,EAAA,aAAU,qBAAoB,WAAW0B,EAAuB,EAAE,WAAAlC,EAAU,CAAC,GAAI,GAAGC,EAAO,CAAA;AACxG;ACNA,MAAMmC,IAA2B1C,EAAG;AAAA,EACnC,MAAM;AACP,CAAC;AAEM,SAAS2C,EAAmB,EAAE,WAAArC,GAAW,GAAGC,KAAqD;AAChG,SAAA,gBAAAO,EAAC,KAAE,EAAA,aAAU,uBAAsB,WAAW4B,EAAyB,EAAE,WAAApC,EAAU,CAAC,GAAI,GAAGC,EAAO,CAAA;AAC1G;"}

package/dist/components/switch/Switch.d.ts

@@ -1,183 +1,8 @@
-import { VariantProps, TVReturnType } from 'tailwind-variants';
-import { TVConfig } from 'tailwind-variants/dist/config.js';
 import * as React from "react";
 import * as SwitchPrimitives from "@radix-ui/react-switch";
-/**
- * Варианты стилей для компонента Switch
- */
-declare const switchStyles: TVReturnType<{
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}, {
-    root: string[];
-    thumb: string;
-}, undefined, TVConfig<{
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}, {
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}>, {
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}, {
-    root: string[];
-    thumb: string;
-}, TVReturnType<{
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}, {
-    root: string[];
-    thumb: string;
-}, undefined, TVConfig<{
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}, {
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}>, unknown, unknown, undefined>>;
-export type SwitchProps = React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root> & VariantProps<typeof switchStyles>;
-declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchProps & React.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps< TVReturnType<{
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}, {
-    root: string[];
-    thumb: string;
-}, undefined, TVConfig<{
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}, {
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}>, {
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}, {
-    root: string[];
-    thumb: string;
-}, TVReturnType<{
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}, {
-    root: string[];
-    thumb: string;
-}, undefined, TVConfig<{
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}, {
-    size: {
-        sm: {
-            root: string;
-            thumb: string;
-        };
-        md: {
-            root: string;
-            thumb: string;
-        };
-    };
-}>, unknown, unknown, undefined>>> & React.RefAttributes<HTMLButtonElement>>;
+export interface SwitchVariants {
+    size?: "sm" | "md";
+}
+export type SwitchProps = React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root> & SwitchVariants;
+declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchProps & React.RefAttributes<HTMLButtonElement>, "ref"> & SwitchVariants & React.RefAttributes<HTMLButtonElement>>;
 export { Switch };

package/dist/components/switch/Switch.stories.d.ts

@@ -1,97 +1,9 @@
 import { StoryObj } from '@storybook/react';
-import { Switch } from './Switch';
+import { Switch, SwitchVariants } from './Switch';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 import { SwitchProps } from '@radix-ui/react-switch';
-import { VariantProps, TVReturnType } from 'tailwind-variants';
-import { TVConfig } from 'tailwind-variants/dist/config.js';
 declare const meta: {
-    component: ForwardRefExoticComponent<Omit< SwitchProps & RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<TVReturnType<{
-        size: {
-            sm: {
-                root: string;
-                thumb: string;
-            };
-            md: {
-                root: string;
-                thumb: string;
-            };
-        };
-    }, {
-        root: string[];
-        thumb: string;
-    }, undefined, TVConfig<{
-        size: {
-            sm: {
-                root: string;
-                thumb: string;
-            };
-            md: {
-                root: string;
-                thumb: string;
-            };
-        };
-    }, {
-        size: {
-            sm: {
-                root: string;
-                thumb: string;
-            };
-            md: {
-                root: string;
-                thumb: string;
-            };
-        };
-    }>, {
-        size: {
-            sm: {
-                root: string;
-                thumb: string;
-            };
-            md: {
-                root: string;
-                thumb: string;
-            };
-        };
-    }, {
-        root: string[];
-        thumb: string;
-    }, TVReturnType<{
-        size: {
-            sm: {
-                root: string;
-                thumb: string;
-            };
-            md: {
-                root: string;
-                thumb: string;
-            };
-        };
-    }, {
-        root: string[];
-        thumb: string;
-    }, undefined, TVConfig<{
-        size: {
-            sm: {
-                root: string;
-                thumb: string;
-            };
-            md: {
-                root: string;
-                thumb: string;
-            };
-        };
-    }, {
-        size: {
-            sm: {
-                root: string;
-                thumb: string;
-            };
-            md: {
-                root: string;
-                thumb: string;
-            };
-        };
-    }>, unknown, unknown, undefined>>> & RefAttributes<HTMLButtonElement>>;
+    component: ForwardRefExoticComponent<Omit< SwitchProps & RefAttributes<HTMLButtonElement>, "ref"> & SwitchVariants & RefAttributes<HTMLButtonElement>>;
     parameters: {
         layout: string;
         controls: {