mokona-ui 0.0.2 → 0.0.4

package/dist/checkbox.cjs

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkCRA2KDNM_cjs = require('./chunk-CRA2KDNM.cjs');
+var chunkSMECLPW7_cjs = require('./chunk-SMECLPW7.cjs');
 require('./chunk-L7BCDC6S.cjs');
 require('./chunk-ZTSGHON6.cjs');
 
@@ -8,7 +8,7 @@ require('./chunk-ZTSGHON6.cjs');
 
 Object.defineProperty(exports, "Checkbox", {
   enumerable: true,
-  get: function () { return chunkCRA2KDNM_cjs.Checkbox; }
+  get: function () { return chunkSMECLPW7_cjs.Checkbox; }
 });
 //# sourceMappingURL=checkbox.cjs.map
 //# sourceMappingURL=checkbox.cjs.map

package/dist/checkbox.d.cts

@@ -3,6 +3,7 @@ import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 
 interface CheckboxProps extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root> {
     label?: string;
+    size?: "sm" | "md" | "lg";
 }
 declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLButtonElement>>;
 

package/dist/checkbox.d.ts

@@ -3,6 +3,7 @@ import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 
 interface CheckboxProps extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root> {
     label?: string;
+    size?: "sm" | "md" | "lg";
 }
 declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLButtonElement>>;
 

package/dist/checkbox.js

@@ -1,4 +1,4 @@
-export { Checkbox } from './chunk-OAO2RJEQ.js';
+export { Checkbox } from './chunk-ZPXMR5XU.js';
 import './chunk-NANYEKL2.js';
 import './chunk-6H52OI5L.js';
 //# sourceMappingURL=checkbox.js.map

package/dist/{chunk-L2APIKHP.cjs → chunk-6D6M5W6J.cjs}

@@ -28,20 +28,26 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 var SwitchPrimitive__namespace = /*#__PURE__*/_interopNamespace(SwitchPrimitive);
 var Label__namespace = /*#__PURE__*/_interopNamespace(Label);
 
+var sizeMap = {
+  sm: { track: "h-6 w-10", thumb: "h-4 w-4 data-[state=checked]:translate-x-5", label: "text-[14px]", description: "text-[12px]" },
+  md: { track: "h-7 w-12", thumb: "h-5 w-5 data-[state=checked]:translate-x-6", label: "text-[16px]", description: "text-[13px]" },
+  lg: { track: "h-8 w-14", thumb: "h-6 w-6 data-[state=checked]:translate-x-7", label: "text-[18px]", description: "text-[14px]" }
+};
 var Toggle = React__namespace.forwardRef((_a, ref) => {
-  var _b = _a, { className, label, description, id } = _b, props = chunkZTSGHON6_cjs.__objRest(_b, ["className", "label", "description", "id"]);
+  var _b = _a, { className, label, description, size = "md", id } = _b, props = chunkZTSGHON6_cjs.__objRest(_b, ["className", "label", "description", "size", "id"]);
   const toggleId = id != null ? id : React__namespace.useId();
+  const { track, thumb, label: labelSize, description: descriptionSize } = sizeMap[size];
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-4 w-full", children: [
     (label || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-0.5", children: [
       label && /* @__PURE__ */ jsxRuntime.jsx(
         Label__namespace.Root,
         {
           htmlFor: toggleId,
-          className: "text-[16px] font-medium text-[var(--color-foreground)] cursor-pointer select-none",
+          className: chunkZTSGHON6_cjs.cn(labelSize, "font-medium text-[var(--color-foreground)] cursor-pointer select-none"),
           children: label
         }
       ),
-      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13px] text-[var(--color-muted-foreground)]", children: description })
+      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: chunkZTSGHON6_cjs.cn(descriptionSize, "text-[var(--color-muted-foreground)]"), children: description })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx(
       SwitchPrimitive__namespace.Root,
@@ -49,7 +55,8 @@ var Toggle = React__namespace.forwardRef((_a, ref) => {
         ref,
         id: toggleId,
         className: chunkZTSGHON6_cjs.cn(
-          "relative inline-flex h-7 w-12 shrink-0 cursor-pointer rounded-full",
+          track,
+          "relative inline-flex shrink-0 cursor-pointer rounded-full",
           "bg-[var(--color-gray-300)]",
           "transition-colors duration-200 ease-in-out",
           "data-[state=checked]:bg-[var(--color-primary)]",
@@ -62,10 +69,10 @@ var Toggle = React__namespace.forwardRef((_a, ref) => {
           SwitchPrimitive__namespace.Thumb,
           {
             className: chunkZTSGHON6_cjs.cn(
-              "pointer-events-none block h-5 w-5 rounded-full bg-white shadow-md",
+              thumb,
+              "pointer-events-none block rounded-full bg-white shadow-md",
               "transition-transform duration-200 ease-in-out",
-              "translate-x-1",
-              "data-[state=checked]:translate-x-6"
+              "translate-x-1"
             )
           }
         )
@@ -76,5 +83,5 @@ var Toggle = React__namespace.forwardRef((_a, ref) => {
 Toggle.displayName = "Toggle";
 
 exports.Toggle = Toggle;
-//# sourceMappingURL=chunk-L2APIKHP.cjs.map
-//# sourceMappingURL=chunk-L2APIKHP.cjs.map
+//# sourceMappingURL=chunk-6D6M5W6J.cjs.map
+//# sourceMappingURL=chunk-6D6M5W6J.cjs.map

package/dist/chunk-6D6M5W6J.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Toggle/Toggle.tsx"],"names":["React","__objRest","jsxs","jsx","Label","cn","SwitchPrimitive","__spreadProps","__spreadValues"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,IAAM,OAAA,GAAU;AAAA,EACd,EAAA,EAAI,EAAE,KAAA,EAAO,UAAA,EAAY,OAAO,4CAAA,EAA8C,KAAA,EAAO,aAAA,EAAe,WAAA,EAAa,aAAA,EAAc;AAAA,EAC/H,EAAA,EAAI,EAAE,KAAA,EAAO,UAAA,EAAY,OAAO,4CAAA,EAA8C,KAAA,EAAO,aAAA,EAAe,WAAA,EAAa,aAAA,EAAc;AAAA,EAC/H,EAAA,EAAI,EAAE,KAAA,EAAO,UAAA,EAAY,OAAO,4CAAA,EAA8C,KAAA,EAAO,aAAA,EAAe,WAAA,EAAa,aAAA;AACnH,CAAA;AAEA,IAAM,MAAA,GAAeA,gBAAA,CAAA,UAAA,CAGnB,CAAC,EAAA,EAA8D,GAAA,KAAQ;AAAtE,EAAA,IAAA,EAAA,GAAA,EAAA,EAAE,EAAA,SAAA,EAAW,KAAA,EAAO,WAAA,EAAa,IAAA,GAAO,MAAM,EAAA,EArBjD,GAqBG,EAAA,EAAqD,KAAA,GAAAC,2BAAA,CAArD,EAAA,EAAqD,CAAnD,WAAA,EAAW,OAAA,EAAO,eAAa,MAAA,EAAa,IAAA,CAAA,CAAA;AAC/C,EAAA,MAAM,QAAA,GAAW,kBAAYD,gBAAA,CAAA,KAAA,EAAM;AACnC,EAAA,MAAM,EAAE,OAAO,KAAA,EAAO,KAAA,EAAO,WAAW,WAAA,EAAa,eAAA,EAAgB,GAAI,OAAA,CAAQ,IAAI,CAAA;AAErF,EAAA,uBACEE,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gDAAA,EACX,QAAA,EAAA;AAAA,IAAA,CAAA,KAAA,IAAS,WAAA,qBACTA,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,uBAAA,EACZ,QAAA,EAAA;AAAA,MAAA,KAAA,oBACCC,cAAA;AAAA,QAAOC,gBAAA,CAAA,IAAA;AAAA,QAAN;AAAA,UACC,OAAA,EAAS,QAAA;AAAA,UACT,SAAA,EAAWC,oBAAA,CAAG,SAAA,EAAW,uEAAuE,CAAA;AAAA,UAE/F,QAAA,EAAA;AAAA;AAAA,OACH;AAAA,MAED,WAAA,mCACE,GAAA,EAAA,EAAE,SAAA,EAAWA,qBAAG,eAAA,EAAiB,sCAAsC,GAAI,QAAA,EAAA,WAAA,EAAY;AAAA,KAAA,EAE5F,CAAA;AAAA,oBAEFF,cAAA;AAAA,MAAiBG,0BAAA,CAAA,IAAA;AAAA,MAAhBC,+BAAA,CAAAC,gCAAA,CAAA;AAAA,QACC,GAAA;AAAA,QACA,EAAA,EAAI,QAAA;AAAA,QACJ,SAAA,EAAWH,oBAAA;AAAA,UACT,KAAA;AAAA,UACA,2DAAA;AAAA,UACA,4BAAA;AAAA,UACA,4CAAA;AAAA,UACA,gDAAA;AAAA,UACA,uHAAA;AAAA,UACA,iDAAA;AAAA,UACA;AAAA;AACF,OAAA,EACI,KAAA,CAAA,EAbL;AAAA,QAeC,QAAA,kBAAAF,cAAA;AAAA,UAAiBG,0BAAA,CAAA,KAAA;AAAA,UAAhB;AAAA,YACC,SAAA,EAAWD,oBAAA;AAAA,cACT,KAAA;AAAA,cACA,2DAAA;AAAA,cACA,+CAAA;AAAA,cACA;AAAA;AACF;AAAA;AACF,OAAA;AAAA;AACF,GAAA,EACF,CAAA;AAEJ,CAAC;AACD,MAAA,CAAO,WAAA,GAAc,QAAA","file":"chunk-6D6M5W6J.cjs","sourcesContent":["import * as React from \"react\";\r\nimport * as SwitchPrimitive from \"@radix-ui/react-switch\";\r\nimport * as Label from \"@radix-ui/react-label\";\r\nimport { cn } from \"../../utils/cn\";\r\n\r\nexport interface ToggleProps\r\n  extends React.ComponentPropsWithoutRef<typeof SwitchPrimitive.Root> {\r\n  label?: string;\r\n  description?: string;\r\n  size?: \"sm\" | \"md\" | \"lg\";\r\n}\r\n\r\nconst sizeMap = {\r\n  sm: { track: \"h-6 w-10\", thumb: \"h-4 w-4 data-[state=checked]:translate-x-5\", label: \"text-[14px]\", description: \"text-[12px]\" },\r\n  md: { track: \"h-7 w-12\", thumb: \"h-5 w-5 data-[state=checked]:translate-x-6\", label: \"text-[16px]\", description: \"text-[13px]\" },\r\n  lg: { track: \"h-8 w-14\", thumb: \"h-6 w-6 data-[state=checked]:translate-x-7\", label: \"text-[18px]\", description: \"text-[14px]\" },\r\n};\r\n\r\nconst Toggle = React.forwardRef<\r\n  React.ElementRef<typeof SwitchPrimitive.Root>,\r\n  ToggleProps\r\n>(({ className, label, description, size = \"md\", id, ...props }, ref) => {\r\n  const toggleId = id ?? React.useId();\r\n  const { track, thumb, label: labelSize, description: descriptionSize } = sizeMap[size];\r\n\r\n  return (\r\n    <div className=\"flex items-center justify-between gap-4 w-full\">\r\n      {(label || description) && (\r\n        <div className=\"flex flex-col gap-0.5\">\r\n          {label && (\r\n            <Label.Root\r\n              htmlFor={toggleId}\r\n              className={cn(labelSize, \"font-medium text-[var(--color-foreground)] cursor-pointer select-none\")}\r\n            >\r\n              {label}\r\n            </Label.Root>\r\n          )}\r\n          {description && (\r\n            <p className={cn(descriptionSize, \"text-[var(--color-muted-foreground)]\")}>{description}</p>\r\n          )}\r\n        </div>\r\n      )}\r\n      <SwitchPrimitive.Root\r\n        ref={ref}\r\n        id={toggleId}\r\n        className={cn(\r\n          track,\r\n          \"relative inline-flex shrink-0 cursor-pointer rounded-full\",\r\n          \"bg-[var(--color-gray-300)]\",\r\n          \"transition-colors duration-200 ease-in-out\",\r\n          \"data-[state=checked]:bg-[var(--color-primary)]\",\r\n          \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-primary)] focus-visible:ring-offset-2\",\r\n          \"disabled:opacity-40 disabled:cursor-not-allowed\",\r\n          className\r\n        )}\r\n        {...props}\r\n      >\r\n        <SwitchPrimitive.Thumb\r\n          className={cn(\r\n            thumb,\r\n            \"pointer-events-none block rounded-full bg-white shadow-md\",\r\n            \"transition-transform duration-200 ease-in-out\",\r\n            \"translate-x-1\"\r\n          )}\r\n        />\r\n      </SwitchPrimitive.Root>\r\n    </div>\r\n  );\r\n});\r\nToggle.displayName = \"Toggle\";\r\n\r\nexport { Toggle };\r\n"]}

package/dist/{chunk-PD3FA355.cjs → chunk-AIBO33KA.cjs}

@@ -26,8 +26,13 @@ function _interopNamespace(e) {
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 var RadioGroupPrimitive__namespace = /*#__PURE__*/_interopNamespace(RadioGroupPrimitive);
 
+var sizeMap = {
+  sm: { dot: "h-4 w-4", indicator: "w-2 h-2", label: "text-[14px]", description: "text-[12px]" },
+  md: { dot: "h-5 w-5", indicator: "w-2.5 h-2.5", label: "text-[16px]", description: "text-[13px]" },
+  lg: { dot: "h-6 w-6", indicator: "w-3 h-3", label: "text-[18px]", description: "text-[14px]" }
+};
 var RadioGroup = React__namespace.forwardRef((_a, ref) => {
-  var _b = _a, { className, items, orientation = "vertical" } = _b, props = chunkZTSGHON6_cjs.__objRest(_b, ["className", "items", "orientation"]);
+  var _b = _a, { className, items, orientation = "vertical", size = "md" } = _b, props = chunkZTSGHON6_cjs.__objRest(_b, ["className", "items", "orientation", "size"]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     RadioGroupPrimitive__namespace.Root,
     chunkZTSGHON6_cjs.__spreadProps(chunkZTSGHON6_cjs.__spreadValues({
@@ -38,13 +43,14 @@ var RadioGroup = React__namespace.forwardRef((_a, ref) => {
         className
       )
     }, props), {
-      children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(RadioItem, { item }, item.value))
+      children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(RadioItem, { item, size }, item.value))
     })
   );
 });
 RadioGroup.displayName = "RadioGroup";
-function RadioItem({ item }) {
+function RadioItem({ item, size }) {
   const id = React__namespace.useId();
+  const { dot, indicator, label: labelSize, description: descriptionSize } = sizeMap[size];
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkZTSGHON6_cjs.cn("flex items-start gap-2.5", item.disabled && "opacity-40"), children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       RadioGroupPrimitive__namespace.Item,
@@ -53,22 +59,23 @@ function RadioItem({ item }) {
         value: item.value,
         disabled: item.disabled,
         className: chunkZTSGHON6_cjs.cn(
-          "mt-0.5 h-5 w-5 shrink-0 rounded-full border-2 border-[var(--color-border)]",
+          dot,
+          "mt-0.5 shrink-0 rounded-full border-2 border-[var(--color-border)]",
           "transition-colors duration-150",
           "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-primary)] focus-visible:ring-offset-2",
           "data-[state=checked]:border-[var(--color-primary)]",
           "disabled:cursor-not-allowed"
         ),
-        children: /* @__PURE__ */ jsxRuntime.jsx(RadioGroupPrimitive__namespace.Indicator, { className: "flex items-center justify-center w-full h-full relative", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2.5 h-2.5 rounded-full bg-[var(--color-primary)]" }) })
+        children: /* @__PURE__ */ jsxRuntime.jsx(RadioGroupPrimitive__namespace.Indicator, { className: "flex items-center justify-center w-full h-full relative", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkZTSGHON6_cjs.cn(indicator, "rounded-full bg-[var(--color-primary)]") }) })
       }
     ),
     /* @__PURE__ */ jsxRuntime.jsxs("label", { htmlFor: id, className: "flex flex-col gap-0.5 cursor-pointer select-none", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[16px] text-[var(--color-foreground)]", children: item.label }),
-      item.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] text-[var(--color-muted-foreground)]", children: item.description })
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: chunkZTSGHON6_cjs.cn(labelSize, "text-[var(--color-foreground)]"), children: item.label }),
+      item.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: chunkZTSGHON6_cjs.cn(descriptionSize, "text-[var(--color-muted-foreground)]"), children: item.description })
     ] })
   ] });
 }
 
 exports.RadioGroup = RadioGroup;
-//# sourceMappingURL=chunk-PD3FA355.cjs.map
-//# sourceMappingURL=chunk-PD3FA355.cjs.map
+//# sourceMappingURL=chunk-AIBO33KA.cjs.map
+//# sourceMappingURL=chunk-AIBO33KA.cjs.map

package/dist/chunk-AIBO33KA.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Radio/Radio.tsx"],"names":["React","__objRest","jsx","RadioGroupPrimitive","__spreadProps","__spreadValues","cn","jsxs"],"mappings":"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","file":"chunk-AIBO33KA.cjs","sourcesContent":["import * as React from \"react\";\r\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\r\nimport { cn } from \"../../utils/cn\";\r\n\r\nexport interface RadioItem {\r\n  value: string;\r\n  label: string;\r\n  description?: string;\r\n  disabled?: boolean;\r\n}\r\n\r\nexport interface RadioGroupProps\r\n  extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root> {\r\n  items: RadioItem[];\r\n  orientation?: \"horizontal\" | \"vertical\";\r\n  size?: \"sm\" | \"md\" | \"lg\";\r\n}\r\n\r\nconst sizeMap = {\r\n  sm: { dot: \"h-4 w-4\", indicator: \"w-2 h-2\", label: \"text-[14px]\", description: \"text-[12px]\" },\r\n  md: { dot: \"h-5 w-5\", indicator: \"w-2.5 h-2.5\", label: \"text-[16px]\", description: \"text-[13px]\" },\r\n  lg: { dot: \"h-6 w-6\", indicator: \"w-3 h-3\", label: \"text-[18px]\", description: \"text-[14px]\" },\r\n};\r\n\r\nconst RadioGroup = React.forwardRef<\r\n  React.ElementRef<typeof RadioGroupPrimitive.Root>,\r\n  RadioGroupProps\r\n>(({ className, items, orientation = \"vertical\", size = \"md\", ...props }, ref) => (\r\n  <RadioGroupPrimitive.Root\r\n    ref={ref}\r\n    className={cn(\r\n      \"flex gap-3\",\r\n      orientation === \"vertical\" ? \"flex-col\" : \"flex-row flex-wrap\",\r\n      className\r\n    )}\r\n    {...props}\r\n  >\r\n    {items.map((item) => (\r\n      <RadioItem key={item.value} item={item} size={size} />\r\n    ))}\r\n  </RadioGroupPrimitive.Root>\r\n));\r\nRadioGroup.displayName = \"RadioGroup\";\r\n\r\nfunction RadioItem({ item, size }: { item: RadioItem; size: \"sm\" | \"md\" | \"lg\" }) {\r\n  const id = React.useId();\r\n  const { dot, indicator, label: labelSize, description: descriptionSize } = sizeMap[size];\r\n\r\n  return (\r\n    <div className={cn(\"flex items-start gap-2.5\", item.disabled && \"opacity-40\")}>\r\n      <RadioGroupPrimitive.Item\r\n        id={id}\r\n        value={item.value}\r\n        disabled={item.disabled}\r\n        className={cn(\r\n          dot,\r\n          \"mt-0.5 shrink-0 rounded-full border-2 border-[var(--color-border)]\",\r\n          \"transition-colors duration-150\",\r\n          \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-primary)] focus-visible:ring-offset-2\",\r\n          \"data-[state=checked]:border-[var(--color-primary)]\",\r\n          \"disabled:cursor-not-allowed\"\r\n        )}\r\n      >\r\n        <RadioGroupPrimitive.Indicator className=\"flex items-center justify-center w-full h-full relative\">\r\n          <div className={cn(indicator, \"rounded-full bg-[var(--color-primary)]\")} />\r\n        </RadioGroupPrimitive.Indicator>\r\n      </RadioGroupPrimitive.Item>\r\n      <label htmlFor={id} className=\"flex flex-col gap-0.5 cursor-pointer select-none\">\r\n        <span className={cn(labelSize, \"text-[var(--color-foreground)]\")}>{item.label}</span>\r\n        {item.description && (\r\n          <span className={cn(descriptionSize, \"text-[var(--color-muted-foreground)]\")}>{item.description}</span>\r\n        )}\r\n      </label>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport { RadioGroup };\r\n"]}

package/dist/{chunk-IYAD7T57.js → chunk-DIFJ2S2S.js}

@@ -3,8 +3,13 @@ import * as React from 'react';
 import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
+var sizeMap = {
+  sm: { dot: "h-4 w-4", indicator: "w-2 h-2", label: "text-[14px]", description: "text-[12px]" },
+  md: { dot: "h-5 w-5", indicator: "w-2.5 h-2.5", label: "text-[16px]", description: "text-[13px]" },
+  lg: { dot: "h-6 w-6", indicator: "w-3 h-3", label: "text-[18px]", description: "text-[14px]" }
+};
 var RadioGroup = React.forwardRef((_a, ref) => {
-  var _b = _a, { className, items, orientation = "vertical" } = _b, props = __objRest(_b, ["className", "items", "orientation"]);
+  var _b = _a, { className, items, orientation = "vertical", size = "md" } = _b, props = __objRest(_b, ["className", "items", "orientation", "size"]);
   return /* @__PURE__ */ jsx(
     RadioGroupPrimitive.Root,
     __spreadProps(__spreadValues({
@@ -15,13 +20,14 @@ var RadioGroup = React.forwardRef((_a, ref) => {
         className
       )
     }, props), {
-      children: items.map((item) => /* @__PURE__ */ jsx(RadioItem, { item }, item.value))
+      children: items.map((item) => /* @__PURE__ */ jsx(RadioItem, { item, size }, item.value))
     })
   );
 });
 RadioGroup.displayName = "RadioGroup";
-function RadioItem({ item }) {
+function RadioItem({ item, size }) {
   const id = React.useId();
+  const { dot, indicator, label: labelSize, description: descriptionSize } = sizeMap[size];
   return /* @__PURE__ */ jsxs("div", { className: cn("flex items-start gap-2.5", item.disabled && "opacity-40"), children: [
     /* @__PURE__ */ jsx(
       RadioGroupPrimitive.Item,
@@ -30,22 +36,23 @@ function RadioItem({ item }) {
         value: item.value,
         disabled: item.disabled,
         className: cn(
-          "mt-0.5 h-5 w-5 shrink-0 rounded-full border-2 border-[var(--color-border)]",
+          dot,
+          "mt-0.5 shrink-0 rounded-full border-2 border-[var(--color-border)]",
           "transition-colors duration-150",
           "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-primary)] focus-visible:ring-offset-2",
           "data-[state=checked]:border-[var(--color-primary)]",
           "disabled:cursor-not-allowed"
         ),
-        children: /* @__PURE__ */ jsx(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center w-full h-full relative", children: /* @__PURE__ */ jsx("div", { className: "w-2.5 h-2.5 rounded-full bg-[var(--color-primary)]" }) })
+        children: /* @__PURE__ */ jsx(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center w-full h-full relative", children: /* @__PURE__ */ jsx("div", { className: cn(indicator, "rounded-full bg-[var(--color-primary)]") }) })
       }
     ),
     /* @__PURE__ */ jsxs("label", { htmlFor: id, className: "flex flex-col gap-0.5 cursor-pointer select-none", children: [
-      /* @__PURE__ */ jsx("span", { className: "text-[16px] text-[var(--color-foreground)]", children: item.label }),
-      item.description && /* @__PURE__ */ jsx("span", { className: "text-[13px] text-[var(--color-muted-foreground)]", children: item.description })
+      /* @__PURE__ */ jsx("span", { className: cn(labelSize, "text-[var(--color-foreground)]"), children: item.label }),
+      item.description && /* @__PURE__ */ jsx("span", { className: cn(descriptionSize, "text-[var(--color-muted-foreground)]"), children: item.description })
     ] })
   ] });
 }
 
 export { RadioGroup };
-//# sourceMappingURL=chunk-IYAD7T57.js.map
-//# sourceMappingURL=chunk-IYAD7T57.js.map
+//# sourceMappingURL=chunk-DIFJ2S2S.js.map
+//# sourceMappingURL=chunk-DIFJ2S2S.js.map

package/dist/chunk-DIFJ2S2S.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Radio/Radio.tsx"],"names":[],"mappings":"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","file":"chunk-DIFJ2S2S.js","sourcesContent":["import * as React from \"react\";\r\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\r\nimport { cn } from \"../../utils/cn\";\r\n\r\nexport interface RadioItem {\r\n  value: string;\r\n  label: string;\r\n  description?: string;\r\n  disabled?: boolean;\r\n}\r\n\r\nexport interface RadioGroupProps\r\n  extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root> {\r\n  items: RadioItem[];\r\n  orientation?: \"horizontal\" | \"vertical\";\r\n  size?: \"sm\" | \"md\" | \"lg\";\r\n}\r\n\r\nconst sizeMap = {\r\n  sm: { dot: \"h-4 w-4\", indicator: \"w-2 h-2\", label: \"text-[14px]\", description: \"text-[12px]\" },\r\n  md: { dot: \"h-5 w-5\", indicator: \"w-2.5 h-2.5\", label: \"text-[16px]\", description: \"text-[13px]\" },\r\n  lg: { dot: \"h-6 w-6\", indicator: \"w-3 h-3\", label: \"text-[18px]\", description: \"text-[14px]\" },\r\n};\r\n\r\nconst RadioGroup = React.forwardRef<\r\n  React.ElementRef<typeof RadioGroupPrimitive.Root>,\r\n  RadioGroupProps\r\n>(({ className, items, orientation = \"vertical\", size = \"md\", ...props }, ref) => (\r\n  <RadioGroupPrimitive.Root\r\n    ref={ref}\r\n    className={cn(\r\n      \"flex gap-3\",\r\n      orientation === \"vertical\" ? \"flex-col\" : \"flex-row flex-wrap\",\r\n      className\r\n    )}\r\n    {...props}\r\n  >\r\n    {items.map((item) => (\r\n      <RadioItem key={item.value} item={item} size={size} />\r\n    ))}\r\n  </RadioGroupPrimitive.Root>\r\n));\r\nRadioGroup.displayName = \"RadioGroup\";\r\n\r\nfunction RadioItem({ item, size }: { item: RadioItem; size: \"sm\" | \"md\" | \"lg\" }) {\r\n  const id = React.useId();\r\n  const { dot, indicator, label: labelSize, description: descriptionSize } = sizeMap[size];\r\n\r\n  return (\r\n    <div className={cn(\"flex items-start gap-2.5\", item.disabled && \"opacity-40\")}>\r\n      <RadioGroupPrimitive.Item\r\n        id={id}\r\n        value={item.value}\r\n        disabled={item.disabled}\r\n        className={cn(\r\n          dot,\r\n          \"mt-0.5 shrink-0 rounded-full border-2 border-[var(--color-border)]\",\r\n          \"transition-colors duration-150\",\r\n          \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-primary)] focus-visible:ring-offset-2\",\r\n          \"data-[state=checked]:border-[var(--color-primary)]\",\r\n          \"disabled:cursor-not-allowed\"\r\n        )}\r\n      >\r\n        <RadioGroupPrimitive.Indicator className=\"flex items-center justify-center w-full h-full relative\">\r\n          <div className={cn(indicator, \"rounded-full bg-[var(--color-primary)]\")} />\r\n        </RadioGroupPrimitive.Indicator>\r\n      </RadioGroupPrimitive.Item>\r\n      <label htmlFor={id} className=\"flex flex-col gap-0.5 cursor-pointer select-none\">\r\n        <span className={cn(labelSize, \"text-[var(--color-foreground)]\")}>{item.label}</span>\r\n        {item.description && (\r\n          <span className={cn(descriptionSize, \"text-[var(--color-muted-foreground)]\")}>{item.description}</span>\r\n        )}\r\n      </label>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport { RadioGroup };\r\n"]}

package/dist/{chunk-CQQEMZCN.js → chunk-I47PN4D6.js}

@@ -1,11 +1,36 @@
 import { __objRest, __spreadValues, cn } from './chunk-6H52OI5L.js';
 import * as React from 'react';
 import * as Label from '@radix-ui/react-label';
+import { cva } from 'class-variance-authority';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
+var textFieldVariants = cva(
+  [
+    "w-full rounded-xl",
+    "text-[var(--color-foreground)]",
+    "bg-[var(--color-muted)] outline-none",
+    "border-2 border-transparent",
+    "placeholder:text-[var(--color-muted-foreground)]",
+    "transition-colors duration-150",
+    "focus:border-[var(--color-primary)] focus:bg-[var(--color-background)]",
+    "disabled:opacity-40 disabled:cursor-not-allowed"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-9 px-3 text-[14px]",
+        md: "h-12 px-4 text-[16px]",
+        lg: "h-14 px-4 text-[16px]"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
 var TextField = React.forwardRef(
   (_a, ref) => {
-    var _b = _a, { className, label, helperText, errorMessage, isError, id } = _b, props = __objRest(_b, ["className", "label", "helperText", "errorMessage", "isError", "id"]);
+    var _b = _a, { className, label, helperText, errorMessage, isError, size, id } = _b, props = __objRest(_b, ["className", "label", "helperText", "errorMessage", "isError", "size", "id"]);
     const generatedId = React.useId();
     const inputId = id != null ? id : generatedId;
     const hasError = isError || !!errorMessage;
@@ -24,14 +49,7 @@ var TextField = React.forwardRef(
           ref,
           id: inputId,
           className: cn(
-            "w-full h-12 px-4 rounded-xl",
-            "text-[16px] text-[var(--color-foreground)]",
-            "bg-[var(--color-muted)] outline-none",
-            "border-2 border-transparent",
-            "placeholder:text-[var(--color-muted-foreground)]",
-            "transition-colors duration-150",
-            "focus:border-[var(--color-primary)] focus:bg-[var(--color-background)]",
-            "disabled:opacity-40 disabled:cursor-not-allowed",
+            textFieldVariants({ size }),
             hasError && "border-[var(--color-negative)] bg-[var(--color-background)]",
             className
           ),
@@ -61,6 +79,6 @@ var TextField = React.forwardRef(
 );
 TextField.displayName = "TextField";
 
-export { TextField };
-//# sourceMappingURL=chunk-CQQEMZCN.js.map
-//# sourceMappingURL=chunk-CQQEMZCN.js.map
+export { TextField, textFieldVariants };
+//# sourceMappingURL=chunk-I47PN4D6.js.map
+//# sourceMappingURL=chunk-I47PN4D6.js.map

package/dist/chunk-I47PN4D6.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TextField/TextField.tsx"],"names":[],"mappings":";;;;;;AAKA,IAAM,iBAAA,GAAoB,GAAA;AAAA,EACxB;AAAA,IACE,mBAAA;AAAA,IACA,gCAAA;AAAA,IACA,sCAAA;AAAA,IACA,6BAAA;AAAA,IACA,kDAAA;AAAA,IACA,gCAAA;AAAA,IACA,wEAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,sBAAA;AAAA,QACJ,EAAA,EAAI,uBAAA;AAAA,QACJ,EAAA,EAAI;AAAA;AACN,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,IAAA,EAAM;AAAA;AACR;AAEJ;AAWA,IAAM,SAAA,GAAkB,KAAA,CAAA,UAAA;AAAA,EACtB,CAAC,IAA6E,GAAA,KAAQ;AAArF,IAAA,IAAA,EAAA,GAAA,EAAA,EAAE,aAAW,KAAA,EAAO,UAAA,EAAY,YAAA,EAAc,OAAA,EAAS,MAAM,EAAA,EAxChE,GAwCG,EAAA,EAAoE,KAAA,GAAA,SAAA,CAApE,IAAoE,CAAlE,WAAA,EAAW,SAAO,YAAA,EAAY,cAAA,EAAc,WAAS,MAAA,EAAM,IAAA,CAAA,CAAA;AAC5D,IAAA,MAAM,cAAoB,KAAA,CAAA,KAAA,EAAM;AAChC,IAAA,MAAM,UAAU,EAAA,IAAA,IAAA,GAAA,EAAA,GAAM,WAAA;AACtB,IAAA,MAAM,QAAA,GAAW,OAAA,IAAW,CAAC,CAAC,YAAA;AAE9B,IAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,8BAAA,EACZ,QAAA,EAAA;AAAA,MAAA,KAAA,oBACC,GAAA;AAAA,QAAO,KAAA,CAAA,IAAA;AAAA,QAAN;AAAA,UACC,OAAA,EAAS,OAAA;AAAA,UACT,SAAA,EAAU,0DAAA;AAAA,UAET,QAAA,EAAA;AAAA;AAAA,OACH;AAAA,sBAEF,GAAA;AAAA,QAAC,OAAA;AAAA,QAAA,cAAA,CAAA;AAAA,UACC,GAAA;AAAA,UACA,EAAA,EAAI,OAAA;AAAA,UACJ,SAAA,EAAW,EAAA;AAAA,YACT,iBAAA,CAAkB,EAAE,IAAA,EAAM,CAAA;AAAA,YAC1B,QAAA,IAAY,6DAAA;AAAA,YACZ;AAAA,WACF;AAAA,UACA,cAAA,EAAc,QAAA;AAAA,UACd,kBAAA,EACE,WAAW,CAAA,EAAG,OAAO,WAAW,UAAA,GAAa,CAAA,EAAG,OAAO,CAAA,OAAA,CAAA,GAAY;AAAA,SAAA,EAEjE,KAAA;AAAA,OACN;AAAA,MACC,YAAY,YAAA,oBACX,GAAA;AAAA,QAAC,GAAA;AAAA,QAAA;AAAA,UACC,EAAA,EAAI,GAAG,OAAO,CAAA,MAAA,CAAA;AAAA,UACd,SAAA,EAAU,0CAAA;AAAA,UACV,IAAA,EAAK,OAAA;AAAA,UAEJ,QAAA,EAAA;AAAA;AAAA,OACH;AAAA,MAED,CAAC,YAAY,UAAA,oBACZ,GAAA;AAAA,QAAC,GAAA;AAAA,QAAA;AAAA,UACC,EAAA,EAAI,GAAG,OAAO,CAAA,OAAA,CAAA;AAAA,UACd,SAAA,EAAU,kDAAA;AAAA,UAET,QAAA,EAAA;AAAA;AAAA;AACH,KAAA,EAEJ,CAAA;AAAA,EAEJ;AACF;AACA,SAAA,CAAU,WAAA,GAAc,WAAA","file":"chunk-I47PN4D6.js","sourcesContent":["import * as React from \"react\";\r\nimport * as Label from \"@radix-ui/react-label\";\r\nimport { cva, type VariantProps } from \"class-variance-authority\";\r\nimport { cn } from \"../../utils/cn\";\r\n\r\nconst textFieldVariants = cva(\r\n  [\r\n    \"w-full rounded-xl\",\r\n    \"text-[var(--color-foreground)]\",\r\n    \"bg-[var(--color-muted)] outline-none\",\r\n    \"border-2 border-transparent\",\r\n    \"placeholder:text-[var(--color-muted-foreground)]\",\r\n    \"transition-colors duration-150\",\r\n    \"focus:border-[var(--color-primary)] focus:bg-[var(--color-background)]\",\r\n    \"disabled:opacity-40 disabled:cursor-not-allowed\",\r\n  ],\r\n  {\r\n    variants: {\r\n      size: {\r\n        sm: \"h-9 px-3 text-[14px]\",\r\n        md: \"h-12 px-4 text-[16px]\",\r\n        lg: \"h-14 px-4 text-[16px]\",\r\n      },\r\n    },\r\n    defaultVariants: {\r\n      size: \"md\",\r\n    },\r\n  }\r\n);\r\n\r\nexport interface TextFieldProps\r\n  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, \"size\">,\r\n    VariantProps<typeof textFieldVariants> {\r\n  label?: string;\r\n  helperText?: string;\r\n  errorMessage?: string;\r\n  isError?: boolean;\r\n}\r\n\r\nconst TextField = React.forwardRef<HTMLInputElement, TextFieldProps>(\r\n  ({ className, label, helperText, errorMessage, isError, size, id, ...props }, ref) => {\r\n    const generatedId = React.useId();\r\n    const inputId = id ?? generatedId;\r\n    const hasError = isError || !!errorMessage;\r\n\r\n    return (\r\n      <div className=\"flex flex-col gap-1.5 w-full\">\r\n        {label && (\r\n          <Label.Root\r\n            htmlFor={inputId}\r\n            className=\"text-[14px] font-semibold text-[var(--color-foreground)]\"\r\n          >\r\n            {label}\r\n          </Label.Root>\r\n        )}\r\n        <input\r\n          ref={ref}\r\n          id={inputId}\r\n          className={cn(\r\n            textFieldVariants({ size }),\r\n            hasError && \"border-[var(--color-negative)] bg-[var(--color-background)]\",\r\n            className\r\n          )}\r\n          aria-invalid={hasError}\r\n          aria-describedby={\r\n            hasError ? `${inputId}-error` : helperText ? `${inputId}-helper` : undefined\r\n          }\r\n          {...props}\r\n        />\r\n        {hasError && errorMessage && (\r\n          <p\r\n            id={`${inputId}-error`}\r\n            className=\"text-[12px] text-[var(--color-negative)]\"\r\n            role=\"alert\"\r\n          >\r\n            {errorMessage}\r\n          </p>\r\n        )}\r\n        {!hasError && helperText && (\r\n          <p\r\n            id={`${inputId}-helper`}\r\n            className=\"text-[12px] text-[var(--color-muted-foreground)]\"\r\n          >\r\n            {helperText}\r\n          </p>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n);\r\nTextField.displayName = \"TextField\";\r\n\r\nexport { TextField, textFieldVariants };\r\n"]}

package/dist/{chunk-MTZI5BWA.js → chunk-JOQ5BHWT.js}

@@ -1,23 +1,29 @@
-import { __objRest, __spreadProps, __spreadValues, cn } from './chunk-6H52OI5L.js';
+import { __objRest, cn, __spreadProps, __spreadValues } from './chunk-6H52OI5L.js';
 import * as React from 'react';
 import * as SwitchPrimitive from '@radix-ui/react-switch';
 import * as Label from '@radix-ui/react-label';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
+var sizeMap = {
+  sm: { track: "h-6 w-10", thumb: "h-4 w-4 data-[state=checked]:translate-x-5", label: "text-[14px]", description: "text-[12px]" },
+  md: { track: "h-7 w-12", thumb: "h-5 w-5 data-[state=checked]:translate-x-6", label: "text-[16px]", description: "text-[13px]" },
+  lg: { track: "h-8 w-14", thumb: "h-6 w-6 data-[state=checked]:translate-x-7", label: "text-[18px]", description: "text-[14px]" }
+};
 var Toggle = React.forwardRef((_a, ref) => {
-  var _b = _a, { className, label, description, id } = _b, props = __objRest(_b, ["className", "label", "description", "id"]);
+  var _b = _a, { className, label, description, size = "md", id } = _b, props = __objRest(_b, ["className", "label", "description", "size", "id"]);
   const toggleId = id != null ? id : React.useId();
+  const { track, thumb, label: labelSize, description: descriptionSize } = sizeMap[size];
   return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4 w-full", children: [
     (label || description) && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
       label && /* @__PURE__ */ jsx(
         Label.Root,
         {
           htmlFor: toggleId,
-          className: "text-[16px] font-medium text-[var(--color-foreground)] cursor-pointer select-none",
+          className: cn(labelSize, "font-medium text-[var(--color-foreground)] cursor-pointer select-none"),
           children: label
         }
       ),
-      description && /* @__PURE__ */ jsx("p", { className: "text-[13px] text-[var(--color-muted-foreground)]", children: description })
+      description && /* @__PURE__ */ jsx("p", { className: cn(descriptionSize, "text-[var(--color-muted-foreground)]"), children: description })
     ] }),
     /* @__PURE__ */ jsx(
       SwitchPrimitive.Root,
@@ -25,7 +31,8 @@ var Toggle = React.forwardRef((_a, ref) => {
         ref,
         id: toggleId,
         className: cn(
-          "relative inline-flex h-7 w-12 shrink-0 cursor-pointer rounded-full",
+          track,
+          "relative inline-flex shrink-0 cursor-pointer rounded-full",
           "bg-[var(--color-gray-300)]",
           "transition-colors duration-200 ease-in-out",
           "data-[state=checked]:bg-[var(--color-primary)]",
@@ -38,10 +45,10 @@ var Toggle = React.forwardRef((_a, ref) => {
           SwitchPrimitive.Thumb,
           {
             className: cn(
-              "pointer-events-none block h-5 w-5 rounded-full bg-white shadow-md",
+              thumb,
+              "pointer-events-none block rounded-full bg-white shadow-md",
               "transition-transform duration-200 ease-in-out",
-              "translate-x-1",
-              "data-[state=checked]:translate-x-6"
+              "translate-x-1"
             )
           }
         )
@@ -52,5 +59,5 @@ var Toggle = React.forwardRef((_a, ref) => {
 Toggle.displayName = "Toggle";
 
 export { Toggle };
-//# sourceMappingURL=chunk-MTZI5BWA.js.map
-//# sourceMappingURL=chunk-MTZI5BWA.js.map
+//# sourceMappingURL=chunk-JOQ5BHWT.js.map
+//# sourceMappingURL=chunk-JOQ5BHWT.js.map

package/dist/chunk-JOQ5BHWT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Toggle/Toggle.tsx"],"names":[],"mappings":";;;;;;AAYA,IAAM,OAAA,GAAU;AAAA,EACd,EAAA,EAAI,EAAE,KAAA,EAAO,UAAA,EAAY,OAAO,4CAAA,EAA8C,KAAA,EAAO,aAAA,EAAe,WAAA,EAAa,aAAA,EAAc;AAAA,EAC/H,EAAA,EAAI,EAAE,KAAA,EAAO,UAAA,EAAY,OAAO,4CAAA,EAA8C,KAAA,EAAO,aAAA,EAAe,WAAA,EAAa,aAAA,EAAc;AAAA,EAC/H,EAAA,EAAI,EAAE,KAAA,EAAO,UAAA,EAAY,OAAO,4CAAA,EAA8C,KAAA,EAAO,aAAA,EAAe,WAAA,EAAa,aAAA;AACnH,CAAA;AAEA,IAAM,MAAA,GAAe,KAAA,CAAA,UAAA,CAGnB,CAAC,EAAA,EAA8D,GAAA,KAAQ;AAAtE,EAAA,IAAA,EAAA,GAAA,EAAA,EAAE,EAAA,SAAA,EAAW,KAAA,EAAO,WAAA,EAAa,IAAA,GAAO,MAAM,EAAA,EArBjD,GAqBG,EAAA,EAAqD,KAAA,GAAA,SAAA,CAArD,EAAA,EAAqD,CAAnD,WAAA,EAAW,OAAA,EAAO,eAAa,MAAA,EAAa,IAAA,CAAA,CAAA;AAC/C,EAAA,MAAM,QAAA,GAAW,kBAAY,KAAA,CAAA,KAAA,EAAM;AACnC,EAAA,MAAM,EAAE,OAAO,KAAA,EAAO,KAAA,EAAO,WAAW,WAAA,EAAa,eAAA,EAAgB,GAAI,OAAA,CAAQ,IAAI,CAAA;AAErF,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gDAAA,EACX,QAAA,EAAA;AAAA,IAAA,CAAA,KAAA,IAAS,WAAA,qBACT,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,uBAAA,EACZ,QAAA,EAAA;AAAA,MAAA,KAAA,oBACC,GAAA;AAAA,QAAO,KAAA,CAAA,IAAA;AAAA,QAAN;AAAA,UACC,OAAA,EAAS,QAAA;AAAA,UACT,SAAA,EAAW,EAAA,CAAG,SAAA,EAAW,uEAAuE,CAAA;AAAA,UAE/F,QAAA,EAAA;AAAA;AAAA,OACH;AAAA,MAED,WAAA,wBACE,GAAA,EAAA,EAAE,SAAA,EAAW,GAAG,eAAA,EAAiB,sCAAsC,GAAI,QAAA,EAAA,WAAA,EAAY;AAAA,KAAA,EAE5F,CAAA;AAAA,oBAEF,GAAA;AAAA,MAAiB,eAAA,CAAA,IAAA;AAAA,MAAhB,aAAA,CAAA,cAAA,CAAA;AAAA,QACC,GAAA;AAAA,QACA,EAAA,EAAI,QAAA;AAAA,QACJ,SAAA,EAAW,EAAA;AAAA,UACT,KAAA;AAAA,UACA,2DAAA;AAAA,UACA,4BAAA;AAAA,UACA,4CAAA;AAAA,UACA,gDAAA;AAAA,UACA,uHAAA;AAAA,UACA,iDAAA;AAAA,UACA;AAAA;AACF,OAAA,EACI,KAAA,CAAA,EAbL;AAAA,QAeC,QAAA,kBAAA,GAAA;AAAA,UAAiB,eAAA,CAAA,KAAA;AAAA,UAAhB;AAAA,YACC,SAAA,EAAW,EAAA;AAAA,cACT,KAAA;AAAA,cACA,2DAAA;AAAA,cACA,+CAAA;AAAA,cACA;AAAA;AACF;AAAA;AACF,OAAA;AAAA;AACF,GAAA,EACF,CAAA;AAEJ,CAAC;AACD,MAAA,CAAO,WAAA,GAAc,QAAA","file":"chunk-JOQ5BHWT.js","sourcesContent":["import * as React from \"react\";\r\nimport * as SwitchPrimitive from \"@radix-ui/react-switch\";\r\nimport * as Label from \"@radix-ui/react-label\";\r\nimport { cn } from \"../../utils/cn\";\r\n\r\nexport interface ToggleProps\r\n  extends React.ComponentPropsWithoutRef<typeof SwitchPrimitive.Root> {\r\n  label?: string;\r\n  description?: string;\r\n  size?: \"sm\" | \"md\" | \"lg\";\r\n}\r\n\r\nconst sizeMap = {\r\n  sm: { track: \"h-6 w-10\", thumb: \"h-4 w-4 data-[state=checked]:translate-x-5\", label: \"text-[14px]\", description: \"text-[12px]\" },\r\n  md: { track: \"h-7 w-12\", thumb: \"h-5 w-5 data-[state=checked]:translate-x-6\", label: \"text-[16px]\", description: \"text-[13px]\" },\r\n  lg: { track: \"h-8 w-14\", thumb: \"h-6 w-6 data-[state=checked]:translate-x-7\", label: \"text-[18px]\", description: \"text-[14px]\" },\r\n};\r\n\r\nconst Toggle = React.forwardRef<\r\n  React.ElementRef<typeof SwitchPrimitive.Root>,\r\n  ToggleProps\r\n>(({ className, label, description, size = \"md\", id, ...props }, ref) => {\r\n  const toggleId = id ?? React.useId();\r\n  const { track, thumb, label: labelSize, description: descriptionSize } = sizeMap[size];\r\n\r\n  return (\r\n    <div className=\"flex items-center justify-between gap-4 w-full\">\r\n      {(label || description) && (\r\n        <div className=\"flex flex-col gap-0.5\">\r\n          {label && (\r\n            <Label.Root\r\n              htmlFor={toggleId}\r\n              className={cn(labelSize, \"font-medium text-[var(--color-foreground)] cursor-pointer select-none\")}\r\n            >\r\n              {label}\r\n            </Label.Root>\r\n          )}\r\n          {description && (\r\n            <p className={cn(descriptionSize, \"text-[var(--color-muted-foreground)]\")}>{description}</p>\r\n          )}\r\n        </div>\r\n      )}\r\n      <SwitchPrimitive.Root\r\n        ref={ref}\r\n        id={toggleId}\r\n        className={cn(\r\n          track,\r\n          \"relative inline-flex shrink-0 cursor-pointer rounded-full\",\r\n          \"bg-[var(--color-gray-300)]\",\r\n          \"transition-colors duration-200 ease-in-out\",\r\n          \"data-[state=checked]:bg-[var(--color-primary)]\",\r\n          \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-primary)] focus-visible:ring-offset-2\",\r\n          \"disabled:opacity-40 disabled:cursor-not-allowed\",\r\n          className\r\n        )}\r\n        {...props}\r\n      >\r\n        <SwitchPrimitive.Thumb\r\n          className={cn(\r\n            thumb,\r\n            \"pointer-events-none block rounded-full bg-white shadow-md\",\r\n            \"transition-transform duration-200 ease-in-out\",\r\n            \"translate-x-1\"\r\n          )}\r\n        />\r\n      </SwitchPrimitive.Root>\r\n    </div>\r\n  );\r\n});\r\nToggle.displayName = \"Toggle\";\r\n\r\nexport { Toggle };\r\n"]}

package/dist/{chunk-CRA2KDNM.cjs → chunk-SMECLPW7.cjs}

@@ -29,10 +29,16 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 var CheckboxPrimitive__namespace = /*#__PURE__*/_interopNamespace(CheckboxPrimitive);
 var Label__namespace = /*#__PURE__*/_interopNamespace(Label);
 
+var sizeMap = {
+  sm: { box: "h-4 w-4", check: { width: 9, height: 6 }, label: "text-[14px]" },
+  md: { box: "h-5 w-5", check: { width: 11, height: 8 }, label: "text-[16px]" },
+  lg: { box: "h-6 w-6", check: { width: 13, height: 10 }, label: "text-[18px]" }
+};
 var Checkbox = React__namespace.forwardRef((_a, ref) => {
-  var _b = _a, { className, label, id } = _b, props = chunkZTSGHON6_cjs.__objRest(_b, ["className", "label", "id"]);
+  var _b = _a, { className, label, size = "md", id } = _b, props = chunkZTSGHON6_cjs.__objRest(_b, ["className", "label", "size", "id"]);
   const generatedId = React__namespace.useId();
   const checkboxId = id != null ? id : generatedId;
+  const { box, check, label: labelSize } = sizeMap[size];
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2.5", children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       CheckboxPrimitive__namespace.Root,
@@ -40,7 +46,8 @@ var Checkbox = React__namespace.forwardRef((_a, ref) => {
         ref,
         id: checkboxId,
         className: chunkZTSGHON6_cjs.cn(
-          "h-5 w-5 rounded-md shrink-0",
+          box,
+          "rounded-md shrink-0",
           "border-2 border-[var(--color-border)]",
           "bg-[var(--color-background)]",
           "transition-colors duration-150",
@@ -53,8 +60,8 @@ var Checkbox = React__namespace.forwardRef((_a, ref) => {
         children: /* @__PURE__ */ jsxRuntime.jsx(CheckboxPrimitive__namespace.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(chunkL7BCDC6S_cjs.LazyMotion, { features: chunkL7BCDC6S_cjs.domAnimation, children: /* @__PURE__ */ jsxRuntime.jsx(
           chunkL7BCDC6S_cjs.m.svg,
           {
-            width: "11",
-            height: "8",
+            width: check.width,
+            height: check.height,
             viewBox: "0 0 11 8",
             fill: "none",
             initial: { pathLength: 0, opacity: 0 },
@@ -78,7 +85,7 @@ var Checkbox = React__namespace.forwardRef((_a, ref) => {
       Label__namespace.Root,
       {
         htmlFor: checkboxId,
-        className: "text-[16px] text-[var(--color-foreground)] cursor-pointer select-none",
+        className: chunkZTSGHON6_cjs.cn(labelSize, "text-[var(--color-foreground)] cursor-pointer select-none"),
         children: label
       }
     )
@@ -87,5 +94,5 @@ var Checkbox = React__namespace.forwardRef((_a, ref) => {
 Checkbox.displayName = "Checkbox";
 
 exports.Checkbox = Checkbox;
-//# sourceMappingURL=chunk-CRA2KDNM.cjs.map
-//# sourceMappingURL=chunk-CRA2KDNM.cjs.map
+//# sourceMappingURL=chunk-SMECLPW7.cjs.map
+//# sourceMappingURL=chunk-SMECLPW7.cjs.map

package/dist/chunk-SMECLPW7.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Checkbox/Checkbox.tsx"],"names":["React","__objRest","jsxs","jsx","CheckboxPrimitive","__spreadProps","__spreadValues","cn","LazyMotion","domAnimation","m","Label"],"mappings":"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","file":"chunk-SMECLPW7.cjs","sourcesContent":["import * as React from \"react\";\r\nimport * as CheckboxPrimitive from \"@radix-ui/react-checkbox\";\r\nimport * as Label from \"@radix-ui/react-label\";\r\nimport { m, LazyMotion, domAnimation } from \"../../utils/motion\";\r\nimport { cn } from \"../../utils/cn\";\r\n\r\nexport interface CheckboxProps\r\n  extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root> {\r\n  label?: string;\r\n  size?: \"sm\" | \"md\" | \"lg\";\r\n}\r\n\r\nconst sizeMap = {\r\n  sm: { box: \"h-4 w-4\", check: { width: 9, height: 6 }, label: \"text-[14px]\" },\r\n  md: { box: \"h-5 w-5\", check: { width: 11, height: 8 }, label: \"text-[16px]\" },\r\n  lg: { box: \"h-6 w-6\", check: { width: 13, height: 10 }, label: \"text-[18px]\" },\r\n};\r\n\r\nconst Checkbox = React.forwardRef<\r\n  React.ElementRef<typeof CheckboxPrimitive.Root>,\r\n  CheckboxProps\r\n>(({ className, label, size = \"md\", id, ...props }, ref) => {\r\n  const generatedId = React.useId();\r\n  const checkboxId = id ?? generatedId;\r\n  const { box, check, label: labelSize } = sizeMap[size];\r\n\r\n  return (\r\n    <div className=\"flex items-center gap-2.5\">\r\n      <CheckboxPrimitive.Root\r\n        ref={ref}\r\n        id={checkboxId}\r\n        className={cn(\r\n          box,\r\n          \"rounded-md shrink-0\",\r\n          \"border-2 border-[var(--color-border)]\",\r\n          \"bg-[var(--color-background)]\",\r\n          \"transition-colors duration-150\",\r\n          \"data-[state=checked]:bg-[var(--color-primary)] data-[state=checked]:border-[var(--color-primary)]\",\r\n          \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-primary)] focus-visible:ring-offset-2\",\r\n          \"disabled:opacity-40 disabled:cursor-not-allowed\",\r\n          className\r\n        )}\r\n        {...props}\r\n      >\r\n        <CheckboxPrimitive.Indicator className=\"flex items-center justify-center\">\r\n          <LazyMotion features={domAnimation}>\r\n            <m.svg\r\n              width={check.width}\r\n              height={check.height}\r\n              viewBox=\"0 0 11 8\"\r\n              fill=\"none\"\r\n              initial={{ pathLength: 0, opacity: 0 }}\r\n              animate={{ pathLength: 1, opacity: 1 }}\r\n              transition={{ duration: 0.2, ease: \"easeOut\" }}\r\n            >\r\n              <m.path\r\n                d=\"M1 3.5L4 6.5L10 1\"\r\n                stroke=\"white\"\r\n                strokeWidth=\"1.8\"\r\n                strokeLinecap=\"round\"\r\n                strokeLinejoin=\"round\"\r\n              />\r\n            </m.svg>\r\n          </LazyMotion>\r\n        </CheckboxPrimitive.Indicator>\r\n      </CheckboxPrimitive.Root>\r\n      {label && (\r\n        <Label.Root\r\n          htmlFor={checkboxId}\r\n          className={cn(labelSize, \"text-[var(--color-foreground)] cursor-pointer select-none\")}\r\n        >\r\n          {label}\r\n        </Label.Root>\r\n      )}\r\n    </div>\r\n  );\r\n});\r\nCheckbox.displayName = \"Checkbox\";\r\n\r\nexport { Checkbox };\r\n"]}

package/dist/{chunk-OAO2RJEQ.js → chunk-ZPXMR5XU.js}

@@ -5,10 +5,16 @@ import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import * as Label from '@radix-ui/react-label';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
+var sizeMap = {
+  sm: { box: "h-4 w-4", check: { width: 9, height: 6 }, label: "text-[14px]" },
+  md: { box: "h-5 w-5", check: { width: 11, height: 8 }, label: "text-[16px]" },
+  lg: { box: "h-6 w-6", check: { width: 13, height: 10 }, label: "text-[18px]" }
+};
 var Checkbox = React.forwardRef((_a, ref) => {
-  var _b = _a, { className, label, id } = _b, props = __objRest(_b, ["className", "label", "id"]);
+  var _b = _a, { className, label, size = "md", id } = _b, props = __objRest(_b, ["className", "label", "size", "id"]);
   const generatedId = React.useId();
   const checkboxId = id != null ? id : generatedId;
+  const { box, check, label: labelSize } = sizeMap[size];
   return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5", children: [
     /* @__PURE__ */ jsx(
       CheckboxPrimitive.Root,
@@ -16,7 +22,8 @@ var Checkbox = React.forwardRef((_a, ref) => {
         ref,
         id: checkboxId,
         className: cn(
-          "h-5 w-5 rounded-md shrink-0",
+          box,
+          "rounded-md shrink-0",
           "border-2 border-[var(--color-border)]",
           "bg-[var(--color-background)]",
           "transition-colors duration-150",
@@ -29,8 +36,8 @@ var Checkbox = React.forwardRef((_a, ref) => {
         children: /* @__PURE__ */ jsx(CheckboxPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx(LazyMotion, { features: domAnimation, children: /* @__PURE__ */ jsx(
           m.svg,
           {
-            width: "11",
-            height: "8",
+            width: check.width,
+            height: check.height,
             viewBox: "0 0 11 8",
             fill: "none",
             initial: { pathLength: 0, opacity: 0 },
@@ -54,7 +61,7 @@ var Checkbox = React.forwardRef((_a, ref) => {
       Label.Root,
       {
         htmlFor: checkboxId,
-        className: "text-[16px] text-[var(--color-foreground)] cursor-pointer select-none",
+        className: cn(labelSize, "text-[var(--color-foreground)] cursor-pointer select-none"),
         children: label
       }
     )
@@ -63,5 +70,5 @@ var Checkbox = React.forwardRef((_a, ref) => {
 Checkbox.displayName = "Checkbox";
 
 export { Checkbox };
-//# sourceMappingURL=chunk-OAO2RJEQ.js.map
-//# sourceMappingURL=chunk-OAO2RJEQ.js.map
+//# sourceMappingURL=chunk-ZPXMR5XU.js.map
+//# sourceMappingURL=chunk-ZPXMR5XU.js.map

package/dist/chunk-ZPXMR5XU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"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","file":"chunk-ZPXMR5XU.js","sourcesContent":["import * as React from \"react\";\r\nimport * as CheckboxPrimitive from \"@radix-ui/react-checkbox\";\r\nimport * as Label from \"@radix-ui/react-label\";\r\nimport { m, LazyMotion, domAnimation } from \"../../utils/motion\";\r\nimport { cn } from \"../../utils/cn\";\r\n\r\nexport interface CheckboxProps\r\n  extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root> {\r\n  label?: string;\r\n  size?: \"sm\" | \"md\" | \"lg\";\r\n}\r\n\r\nconst sizeMap = {\r\n  sm: { box: \"h-4 w-4\", check: { width: 9, height: 6 }, label: \"text-[14px]\" },\r\n  md: { box: \"h-5 w-5\", check: { width: 11, height: 8 }, label: \"text-[16px]\" },\r\n  lg: { box: \"h-6 w-6\", check: { width: 13, height: 10 }, label: \"text-[18px]\" },\r\n};\r\n\r\nconst Checkbox = React.forwardRef<\r\n  React.ElementRef<typeof CheckboxPrimitive.Root>,\r\n  CheckboxProps\r\n>(({ className, label, size = \"md\", id, ...props }, ref) => {\r\n  const generatedId = React.useId();\r\n  const checkboxId = id ?? generatedId;\r\n  const { box, check, label: labelSize } = sizeMap[size];\r\n\r\n  return (\r\n    <div className=\"flex items-center gap-2.5\">\r\n      <CheckboxPrimitive.Root\r\n        ref={ref}\r\n        id={checkboxId}\r\n        className={cn(\r\n          box,\r\n          \"rounded-md shrink-0\",\r\n          \"border-2 border-[var(--color-border)]\",\r\n          \"bg-[var(--color-background)]\",\r\n          \"transition-colors duration-150\",\r\n          \"data-[state=checked]:bg-[var(--color-primary)] data-[state=checked]:border-[var(--color-primary)]\",\r\n          \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-primary)] focus-visible:ring-offset-2\",\r\n          \"disabled:opacity-40 disabled:cursor-not-allowed\",\r\n          className\r\n        )}\r\n        {...props}\r\n      >\r\n        <CheckboxPrimitive.Indicator className=\"flex items-center justify-center\">\r\n          <LazyMotion features={domAnimation}>\r\n            <m.svg\r\n              width={check.width}\r\n              height={check.height}\r\n              viewBox=\"0 0 11 8\"\r\n              fill=\"none\"\r\n              initial={{ pathLength: 0, opacity: 0 }}\r\n              animate={{ pathLength: 1, opacity: 1 }}\r\n              transition={{ duration: 0.2, ease: \"easeOut\" }}\r\n            >\r\n              <m.path\r\n                d=\"M1 3.5L4 6.5L10 1\"\r\n                stroke=\"white\"\r\n                strokeWidth=\"1.8\"\r\n                strokeLinecap=\"round\"\r\n                strokeLinejoin=\"round\"\r\n              />\r\n            </m.svg>\r\n          </LazyMotion>\r\n        </CheckboxPrimitive.Indicator>\r\n      </CheckboxPrimitive.Root>\r\n      {label && (\r\n        <Label.Root\r\n          htmlFor={checkboxId}\r\n          className={cn(labelSize, \"text-[var(--color-foreground)] cursor-pointer select-none\")}\r\n        >\r\n          {label}\r\n        </Label.Root>\r\n      )}\r\n    </div>\r\n  );\r\n});\r\nCheckbox.displayName = \"Checkbox\";\r\n\r\nexport { Checkbox };\r\n"]}