@jbpark/ui-kit 5.2.0 → 5.3.0

package/dist/components/atoms/select.mjs

@@ -1,8 +1,7 @@
 import { cn } from "../../utils.mjs";
 import { select_exports } from "../../core/select.mjs";
-import React from "react";
+import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-
 //#region src/components/atoms/select.tsx
 const { Select: Core, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue } = select_exports;
 const isGroup = (option) => {
@@ -24,7 +23,7 @@ const Select = ({ className, placeholder, options, onChange, ...props }) => {
 		}, option.value)) })]
 	});
 };
-
 //#endregion
 export { Select as default };
+
 //# sourceMappingURL=select.mjs.map

package/dist/components/atoms/select.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"select.mjs","names":["select"],"sources":["../../../src/components/atoms/select.tsx"],"sourcesContent":["import React from 'react';\n\nimport { select } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst {\n  Select: Core,\n  SelectContent,\n  SelectGroup,\n  SelectItem,\n  SelectLabel,\n  SelectTrigger,\n  SelectValue,\n} = select;\n\ninterface Option {\n  label: React.ReactNode;\n  value: string;\n}\n\ninterface OptionGroup {\n  label: React.ReactNode;\n  options: Option[];\n}\n\nconst isGroup = (option: Option | OptionGroup): option is OptionGroup => {\n  return 'options' in option && Array.isArray(option.options);\n};\n\nexport interface Props extends Omit<\n  React.ComponentProps<typeof Core>,\n  'onValueChange'\n> {\n  placeholder?: string;\n  className?: string;\n  options?: (Option | OptionGroup)[];\n  onChange?: (value: string) => void;\n}\n\nconst Select = ({\n  className,\n  placeholder,\n  options,\n  onChange,\n  ...props\n}: Props) => {\n  return (\n    <Core onValueChange={onChange} {...props}>\n      <SelectTrigger className={cn('w-full max-w-48', className)}>\n        <SelectValue placeholder={placeholder} />\n      </SelectTrigger>\n      <SelectContent>\n        {options?.map((option, index) =>\n          isGroup(option) ? (\n            <SelectGroup key={index}>\n              <SelectLabel>{option.label}</SelectLabel>\n              {option.options.map(item => (\n                <SelectItem key={item.value} value={item.value}>\n                  {item.label}\n                </SelectItem>\n              ))}\n            </SelectGroup>\n          ) : (\n            <SelectItem key={option.value} value={option.value}>\n              {option.label}\n            </SelectItem>\n          ),\n        )}\n      </SelectContent>\n    </Core>\n  );\n};\n\nexport default Select;\n"],"mappings":";;;;;;AAKA,MAAM,EACJ,QAAQ,MACR,eACA,aACA,YACA,aACA,eACA,gBACEA;AAYJ,MAAM,WAAW,WAAwD;AACvE,QAAO,aAAa,UAAU,MAAM,QAAQ,OAAO,QAAQ;;AAa7D,MAAM,UAAU,EACd,WACA,aACA,SACA,UACA,GAAG,YACQ;AACX,QACE,qBAAC;EAAK,eAAe;EAAU,GAAI;aACjC,oBAAC;GAAc,WAAW,GAAG,mBAAmB,UAAU;aACxD,oBAAC,eAAyB,cAAe;IAC3B,EAChB,oBAAC,2BACE,SAAS,KAAK,QAAQ,UACrB,QAAQ,OAAO,GACb,qBAAC,0BACC,oBAAC,yBAAa,OAAO,QAAoB,EACxC,OAAO,QAAQ,KAAI,SAClB,oBAAC;GAA4B,OAAO,KAAK;aACtC,KAAK;KADS,KAAK,MAET,CACb,KANc,MAOJ,GAEd,oBAAC;GAA8B,OAAO,OAAO;aAC1C,OAAO;KADO,OAAO,MAEX,CAEhB,GACa;GACX"}
+{"version":3,"file":"select.mjs","names":["select"],"sources":["../../../src/components/atoms/select.tsx"],"sourcesContent":["import React from 'react';\n\nimport { select } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst {\n  Select: Core,\n  SelectContent,\n  SelectGroup,\n  SelectItem,\n  SelectLabel,\n  SelectTrigger,\n  SelectValue,\n} = select;\n\ninterface Option {\n  label: React.ReactNode;\n  value: string;\n}\n\ninterface OptionGroup {\n  label: React.ReactNode;\n  options: Option[];\n}\n\nconst isGroup = (option: Option | OptionGroup): option is OptionGroup => {\n  return 'options' in option && Array.isArray(option.options);\n};\n\nexport interface Props extends Omit<\n  React.ComponentProps<typeof Core>,\n  'onValueChange'\n> {\n  placeholder?: string;\n  className?: string;\n  options?: (Option | OptionGroup)[];\n  onChange?: (value: string) => void;\n}\n\nconst Select = ({\n  className,\n  placeholder,\n  options,\n  onChange,\n  ...props\n}: Props) => {\n  return (\n    <Core onValueChange={onChange} {...props}>\n      <SelectTrigger className={cn('w-full max-w-48', className)}>\n        <SelectValue placeholder={placeholder} />\n      </SelectTrigger>\n      <SelectContent>\n        {options?.map((option, index) =>\n          isGroup(option) ? (\n            <SelectGroup key={index}>\n              <SelectLabel>{option.label}</SelectLabel>\n              {option.options.map(item => (\n                <SelectItem key={item.value} value={item.value}>\n                  {item.label}\n                </SelectItem>\n              ))}\n            </SelectGroup>\n          ) : (\n            <SelectItem key={option.value} value={option.value}>\n              {option.label}\n            </SelectItem>\n          ),\n        )}\n      </SelectContent>\n    </Core>\n  );\n};\n\nexport default Select;\n"],"mappings":";;;;;AAKA,MAAM,EACJ,QAAQ,MACR,eACA,aACA,YACA,aACA,eACA,gBACEA;AAYJ,MAAM,WAAW,WAAwD;CACvE,OAAO,aAAa,UAAU,MAAM,QAAQ,OAAO,OAAO;AAC5D;AAYA,MAAM,UAAU,EACd,WACA,aACA,SACA,UACA,GAAG,YACQ;CACX,OACE,qBAAC,MAAD;EAAM,eAAe;EAAU,GAAI;EAAnC,UAAA,CACE,oBAAC,eAAD;GAAe,WAAW,GAAG,mBAAmB,SAAS;GACvD,UAAA,oBAAC,aAAD,EAA0B,YAAc,CAAA;EAC3B,CAAA,GACf,oBAAC,eAAD,EAAA,UACG,SAAS,KAAK,QAAQ,UACrB,QAAQ,MAAM,IACZ,qBAAC,aAAD,EAAA,UAAA,CACE,oBAAC,aAAD,EAAA,UAAc,OAAO,MAAmB,CAAA,GACvC,OAAO,QAAQ,KAAI,SAClB,oBAAC,YAAD;GAA6B,OAAO,KAAK;GACtC,UAAA,KAAK;EACI,GAFK,KAAK,KAEV,CACb,CACU,EAAA,GAPK,KAOL,IAEb,oBAAC,YAAD;GAA+B,OAAO,OAAO;GAC1C,UAAA,OAAO;EACE,GAFK,OAAO,KAEZ,CAEhB,EACa,CAAA,CACX;;AAEV"}

package/dist/components/atoms/skeleton/button.d.mts

@@ -1,11 +1,6 @@
 import { Props } from "./skeleton.mjs";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-
 //#region src/components/atoms/skeleton/button.d.ts
-declare const Button: ({
-  classNames,
-  ...props
-}: Props) => react_jsx_runtime0.JSX.Element;
+declare const Button: ({ classNames, ...props }: Props) => import("react").JSX.Element;
 //#endregion
-export { Button };
+export { Button as default };
 //# sourceMappingURL=button.d.mts.map

package/dist/components/atoms/skeleton/button.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.mts","names":[],"sources":["../../../../src/components/atoms/skeleton/button.tsx"],"mappings":";;;;cAIM,MAAA;EAAU,UAAA;EAAA,GAAA;AAAA,GAA0B,KAAA,KAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"button.d.mts","names":[],"sources":["../../../../src/components/atoms/skeleton/button.tsx"],"mappings":";;cAIM,WAAU,eAAA,SAA0B,0BAAa,IAAA"}

package/dist/components/atoms/skeleton/button.mjs

@@ -1,7 +1,6 @@
 import { cn } from "../../../utils.mjs";
 import Skeleton from "./skeleton.mjs";
 import { jsx } from "react/jsx-runtime";
-
 //#region src/components/atoms/skeleton/button.tsx
 const Button = ({ classNames, ...props }) => {
 	return /* @__PURE__ */ jsx(Skeleton, {
@@ -12,7 +11,7 @@ const Button = ({ classNames, ...props }) => {
 		}
 	});
 };
-
 //#endregion
 export { Button as default };
+
 //# sourceMappingURL=button.mjs.map

package/dist/components/atoms/skeleton/button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"button.mjs","names":[],"sources":["../../../../src/components/atoms/skeleton/button.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nimport Skeleton, { type Props as SkeletonProps } from './skeleton';\n\nconst Button = ({ classNames, ...props }: SkeletonProps) => {\n  return (\n    <Skeleton\n      {...props}\n      classNames={{\n        ...classNames,\n        item: cn(\n          'h-9 w-15',\n          'rounded-2xl',\n          classNames?.item,\n          //\n        ),\n      }}\n    />\n  );\n};\nexport default Button;\n"],"mappings":";;;;;AAIA,MAAM,UAAU,EAAE,YAAY,GAAG,YAA2B;AAC1D,QACE,oBAAC;EACC,GAAI;EACJ,YAAY;GACV,GAAG;GACH,MAAM,GACJ,YACA,eACA,YAAY,KAEb;GACF;GACD"}
+{"version":3,"file":"button.mjs","names":[],"sources":["../../../../src/components/atoms/skeleton/button.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nimport Skeleton, { type Props as SkeletonProps } from './skeleton';\n\nconst Button = ({ classNames, ...props }: SkeletonProps) => {\n  return (\n    <Skeleton\n      {...props}\n      classNames={{\n        ...classNames,\n        item: cn(\n          'h-9 w-15',\n          'rounded-2xl',\n          classNames?.item,\n          //\n        ),\n      }}\n    />\n  );\n};\nexport default Button;\n"],"mappings":";;;;AAIA,MAAM,UAAU,EAAE,YAAY,GAAG,YAA2B;CAC1D,OACE,oBAAC,UAAD;EACE,GAAI;EACJ,YAAY;GACV,GAAG;GACH,MAAM,GACJ,YACA,eACA,YAAY,IAEd;EACF;CACD,CAAA;AAEL"}

package/dist/components/atoms/skeleton/index.d.mts

@@ -1,7 +1,6 @@
-import { Props, Skeleton as Skeleton$1 } from "./skeleton.mjs";
-import { Button } from "./button.mjs";
-import { Node } from "./node.mjs";
-
+import Skeleton$1, { Props } from "./skeleton.mjs";
+import Button from "./button.mjs";
+import Node from "./node.mjs";
 //#region src/components/atoms/skeleton/index.d.ts
 type SkeletonComponent = typeof Skeleton$1 & {
   Button: typeof Button;
@@ -9,5 +8,5 @@ type SkeletonComponent = typeof Skeleton$1 & {
 };
 declare const Skeleton: SkeletonComponent;
 //#endregion
-export { Skeleton };
+export { Button, Node, Skeleton as default };
 //# sourceMappingURL=index.d.mts.map

package/dist/components/atoms/skeleton/index.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.mts","names":[],"sources":["../../../../src/components/atoms/skeleton/index.ts"],"mappings":";;;;;KAIK,iBAAA,UAA2B,UAAA;EAC9B,MAAA,SAAe,MAAA;EACf,IAAA,SAAa,IAAA;AAAA;AAAA,cAGT,QAAA,EAA2B,iBAAA"}
+{"version":3,"file":"index.d.mts","names":[],"sources":["../../../../src/components/atoms/skeleton/index.ts"],"mappings":";;;;KAIK,2BAA2B;EAC9B,eAAe;EACf,aAAa;;cAGT,UAA2B"}

package/dist/components/atoms/skeleton/index.mjs

@@ -1,12 +1,11 @@
 import Skeleton$1 from "./skeleton.mjs";
 import Button from "./button.mjs";
 import Node from "./node.mjs";
-
 //#region src/components/atoms/skeleton/index.ts
 const Skeleton = Skeleton$1;
 Skeleton.Button = Button;
 Skeleton.Node = Node;
-
 //#endregion
-export { Skeleton as default };
+export { Button, Node, Skeleton as default };
+
 //# sourceMappingURL=index.mjs.map

package/dist/components/atoms/skeleton/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["SkeletonImpl"],"sources":["../../../../src/components/atoms/skeleton/index.ts"],"sourcesContent":["import Button from './button';\nimport Node from './node';\nimport SkeletonImpl, { type Props } from './skeleton';\n\ntype SkeletonComponent = typeof SkeletonImpl & {\n  Button: typeof Button;\n  Node: typeof Node;\n};\n\nconst Skeleton = SkeletonImpl as SkeletonComponent;\n\nSkeleton.Button = Button;\nSkeleton.Node = Node;\n\nexport { Button, Node };\nexport default Skeleton;\nexport type { Props };\n"],"mappings":";;;;;AASA,MAAM,WAAWA;AAEjB,SAAS,SAAS;AAClB,SAAS,OAAO"}
+{"version":3,"file":"index.mjs","names":["SkeletonImpl"],"sources":["../../../../src/components/atoms/skeleton/index.ts"],"sourcesContent":["import Button from './button';\nimport Node from './node';\nimport SkeletonImpl, { type Props } from './skeleton';\n\ntype SkeletonComponent = typeof SkeletonImpl & {\n  Button: typeof Button;\n  Node: typeof Node;\n};\n\nconst Skeleton = SkeletonImpl as SkeletonComponent;\n\nSkeleton.Button = Button;\nSkeleton.Node = Node;\n\nexport { Button, Node };\nexport default Skeleton;\nexport type { Props };\n"],"mappings":";;;;AASA,MAAM,WAAWA;AAEjB,SAAS,SAAS;AAClB,SAAS,OAAO"}

package/dist/components/atoms/skeleton/node.d.mts

@@ -1,11 +1,6 @@
 import { Props } from "./skeleton.mjs";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-
 //#region src/components/atoms/skeleton/node.d.ts
-declare const Node: ({
-  classNames,
-  ...props
-}: Props) => react_jsx_runtime0.JSX.Element;
+declare const Node: ({ classNames, ...props }: Props) => import("react").JSX.Element;
 //#endregion
-export { Node };
+export { Node as default };
 //# sourceMappingURL=node.d.mts.map

package/dist/components/atoms/skeleton/node.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"node.d.mts","names":[],"sources":["../../../../src/components/atoms/skeleton/node.tsx"],"mappings":";;;;cAIM,IAAA;EAAQ,UAAA;EAAA,GAAA;AAAA,GAA0B,KAAA,KAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"node.d.mts","names":[],"sources":["../../../../src/components/atoms/skeleton/node.tsx"],"mappings":";;cAIM,SAAQ,eAAA,SAA0B,0BAAa,IAAA"}

package/dist/components/atoms/skeleton/node.mjs

@@ -1,7 +1,6 @@
 import { cn } from "../../../utils.mjs";
 import Skeleton from "./skeleton.mjs";
 import { jsx } from "react/jsx-runtime";
-
 //#region src/components/atoms/skeleton/node.tsx
 const Node = ({ classNames, ...props }) => {
 	return /* @__PURE__ */ jsx(Skeleton, {
@@ -13,7 +12,7 @@ const Node = ({ classNames, ...props }) => {
 		}
 	});
 };
-
 //#endregion
 export { Node as default };
+
 //# sourceMappingURL=node.mjs.map

package/dist/components/atoms/skeleton/node.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"node.mjs","names":[],"sources":["../../../../src/components/atoms/skeleton/node.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nimport Skeleton, { type Props as SkeletonProps } from './skeleton';\n\nconst Node = ({ classNames, ...props }: SkeletonProps) => {\n  return (\n    <Skeleton\n      {...props}\n      avatar={false}\n      classNames={{\n        ...classNames,\n        item: cn(\n          'h-50 w-full min-w-80',\n          'rounded-3xl',\n          classNames?.item,\n          //\n        ),\n      }}\n    />\n  );\n};\nexport default Node;\n"],"mappings":";;;;;AAIA,MAAM,QAAQ,EAAE,YAAY,GAAG,YAA2B;AACxD,QACE,oBAAC;EACC,GAAI;EACJ,QAAQ;EACR,YAAY;GACV,GAAG;GACH,MAAM,GACJ,wBACA,eACA,YAAY,KAEb;GACF;GACD"}
+{"version":3,"file":"node.mjs","names":[],"sources":["../../../../src/components/atoms/skeleton/node.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nimport Skeleton, { type Props as SkeletonProps } from './skeleton';\n\nconst Node = ({ classNames, ...props }: SkeletonProps) => {\n  return (\n    <Skeleton\n      {...props}\n      avatar={false}\n      classNames={{\n        ...classNames,\n        item: cn(\n          'h-50 w-full min-w-80',\n          'rounded-3xl',\n          classNames?.item,\n          //\n        ),\n      }}\n    />\n  );\n};\nexport default Node;\n"],"mappings":";;;;AAIA,MAAM,QAAQ,EAAE,YAAY,GAAG,YAA2B;CACxD,OACE,oBAAC,UAAD;EACE,GAAI;EACJ,QAAQ;EACR,YAAY;GACV,GAAG;GACH,MAAM,GACJ,wBACA,eACA,YAAY,IAEd;EACF;CACD,CAAA;AAEL"}

package/dist/components/atoms/skeleton/skeleton.d.mts

@@ -1,6 +1,3 @@
-import * as react from "react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-
 //#region src/components/atoms/skeleton/skeleton.d.ts
 interface Props extends React.ComponentPropsWithoutRef<'div'> {
   active?: boolean;
@@ -18,22 +15,7 @@ interface Props extends React.ComponentPropsWithoutRef<'div'> {
     item?: string;
   };
 }
-declare const Skeleton: ({
-  active,
-  loading,
-  avatar,
-  size,
-  direction,
-  count,
-  gap,
-  className,
-  classNames,
-  style,
-  width,
-  height,
-  children,
-  ...props
-}: Props) => string | number | bigint | boolean | Iterable<react.ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<react.ReactNode> | null | undefined> | react_jsx_runtime0.JSX.Element | null;
+declare const Skeleton: ({ active, loading, avatar, size, direction, count, gap, className, classNames, style, width, height, children, ...props }: Props) => string | number | bigint | boolean | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("react").JSX.Element | null;
 //#endregion
-export { Props, Skeleton };
+export { Props, Skeleton as default };
 //# sourceMappingURL=skeleton.d.mts.map

package/dist/components/atoms/skeleton/skeleton.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.d.mts","names":[],"sources":["../../../../src/components/atoms/skeleton/skeleton.tsx"],"mappings":";;;;UAYiB,KAAA,SAAc,KAAA,CAAM,wBAAA;EACnC,MAAA;EACA,OAAA;EACA,MAAA;EACA,IAAA;EACA,KAAA;EACA,GAAA;EACA,SAAA;EACA,KAAA;EACA,MAAA;EACA,UAAA;IACE,OAAA;IACA,MAAA;IACA,IAAA;EAAA;AAAA;AAAA,cAUE,QAAA;EAAY,MAAA;EAAA,OAAA;EAAA,MAAA;EAAA,IAAA;EAAA,SAAA;EAAA,KAAA;EAAA,GAAA;EAAA,SAAA;EAAA,UAAA;EAAA,KAAA;EAAA,KAAA;EAAA,MAAA;EAAA,QAAA;EAAA,GAAA;AAAA,GAef,KAAA,0CAAK,QAAA,CAAA,KAAA,CAAA,SAAA,IAAA,OAAA,sCAAA,KAAA,CAAA,WAAA,GAAA,KAAA,CAAA,YAAA,mBAAA,KAAA,CAAA,qBAAA,SAAA,QAAA,CAAA,KAAA,CAAA,SAAA,wBAAA,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"skeleton.d.mts","names":[],"sources":["../../../../src/components/atoms/skeleton/skeleton.tsx"],"mappings":";UAYiB,cAAc,MAAM;EACnC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;IACE;IACA;IACA;;;cAUE,aAAY,QAAA,SAAA,QAAA,MAAA,WAAA,OAAA,KAAA,WAAA,YAAA,OAAA,OAAA,QAAA,aAAA,SAef,+CAAK,yBAAA,aAAA,6DAAA,8BAAA,+CAAA,8BAAA,yBAAA,iDAAA,IAAA"}

package/dist/components/atoms/skeleton/skeleton.mjs

@@ -1,10 +1,8 @@
-'use client';
-
+"use client";
 import { cn } from "../../../utils.mjs";
 import { DEFAULT_LOCALE, useConfig } from "../../../providers/config/context.mjs";
 import { skeleton_exports } from "../../../core/skeleton.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
-
 //#region src/components/atoms/skeleton/skeleton.tsx
 const { Skeleton: Core } = skeleton_exports;
 const getValueAtIndex = (value, index) => {
@@ -41,7 +39,7 @@ const Skeleton = ({ active = true, loading = true, avatar, size = "default", dir
 		})]
 	});
 };
-
 //#endregion
 export { Skeleton as default };
+
 //# sourceMappingURL=skeleton.mjs.map

package/dist/components/atoms/skeleton/skeleton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.mjs","names":["skeleton"],"sources":["../../../../src/components/atoms/skeleton/skeleton.tsx"],"sourcesContent":["'use client';\n\nimport { skeleton } from '@repo/ui/core';\nimport { DEFAULT_LOCALE, useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nconst { Skeleton: Core } = skeleton;\n\nconst getValueAtIndex = <T,>(value: T | T[], index: number) => {\n  return Array.isArray(value) ? (value[index] ?? value[0]) : value;\n};\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {\n  active?: boolean;\n  loading?: boolean;\n  avatar?: boolean;\n  size?: 'default' | 'small' | 'large';\n  count?: number;\n  gap?: number;\n  direction?: 'horizontal' | 'vertical';\n  width?: string | number | (string | number)[];\n  height?: string | number | (string | number)[];\n  classNames?: {\n    wrapper?: string;\n    avatar?: string;\n    item?: string;\n  };\n}\n\nconst SIZES = {\n  small: 'w-48 h-4',\n  default: 'w-60 h-6',\n  large: 'w-72 h-8',\n};\n\nconst Skeleton = ({\n  active = true,\n  loading = true,\n  avatar,\n  size = 'default',\n  direction = 'vertical',\n  count = 1,\n  gap = 6,\n  className,\n  classNames = {},\n  style,\n  width,\n  height,\n  children,\n  ...props\n}: Props) => {\n  const { locale } = useConfig();\n\n  // Not wrapping `children` here (unlike Spin's overlay mode) — Skeleton\n  // is meant to swap in arbitrary real content once loading finishes,\n  // which can include elements with strict parent requirements (e.g. a\n  // `<tr>`), so adding a wrapper div could produce invalid markup.\n  // `className`/`style`/rest props only ever describe the skeleton's own\n  // placeholder markup, so there's nothing for them to apply to here.\n  if (!loading) {\n    return children ?? null;\n  }\n\n  return (\n    <div\n      role=\"status\"\n      aria-label={locale.loading ?? DEFAULT_LOCALE.loading}\n      className={cn('flex items-center gap-3', className)}\n      style={style}\n      {...props}\n    >\n      {avatar && (\n        <Core\n          className={cn(\n            'h-12 w-12',\n            'rounded-xl',\n            !active && 'animate-none',\n            classNames.avatar,\n          )}\n        />\n      )}\n      <div\n        className={cn(\n          'flex grow',\n          direction === 'vertical' && 'flex-col',\n          classNames.wrapper,\n        )}\n        style={{\n          gap,\n        }}\n      >\n        {Array.from({ length: count }).map((_, index) => {\n          const itemWidth = getValueAtIndex(width, index);\n          const itemHeight = getValueAtIndex(height, index);\n\n          return (\n            <Core\n              key={index}\n              className={cn(\n                'rounded-md',\n                !active && 'animate-none',\n                SIZES[size],\n                classNames.item,\n                //\n              )}\n              style={{\n                width: itemWidth,\n                height: itemHeight,\n              }}\n            />\n          );\n        })}\n      </div>\n    </div>\n  );\n};\n\nexport default Skeleton;\n"],"mappings":";;;;;;;;AAMA,MAAM,EAAE,UAAU,SAASA;AAE3B,MAAM,mBAAuB,OAAgB,UAAkB;AAC7D,QAAO,MAAM,QAAQ,MAAM,GAAI,MAAM,UAAU,MAAM,KAAM;;AAoB7D,MAAM,QAAQ;CACZ,OAAO;CACP,SAAS;CACT,OAAO;CACR;AAED,MAAM,YAAY,EAChB,SAAS,MACT,UAAU,MACV,QACA,OAAO,WACP,YAAY,YACZ,QAAQ,GACR,MAAM,GACN,WACA,aAAa,EAAE,EACf,OACA,OACA,QACA,UACA,GAAG,YACQ;CACX,MAAM,EAAE,WAAW,WAAW;AAQ9B,KAAI,CAAC,QACH,QAAO,YAAY;AAGrB,QACE,qBAAC;EACC,MAAK;EACL,cAAY,OAAO,WAAW,eAAe;EAC7C,WAAW,GAAG,2BAA2B,UAAU;EAC5C;EACP,GAAI;aAEH,UACC,oBAAC,QACC,WAAW,GACT,aACA,cACA,CAAC,UAAU,gBACX,WAAW,OACZ,GACD,EAEJ,oBAAC;GACC,WAAW,GACT,aACA,cAAc,cAAc,YAC5B,WAAW,QACZ;GACD,OAAO,EACL,KACD;aAEA,MAAM,KAAK,EAAE,QAAQ,OAAO,CAAC,CAAC,KAAK,GAAG,UAAU;IAC/C,MAAM,YAAY,gBAAgB,OAAO,MAAM;IAC/C,MAAM,aAAa,gBAAgB,QAAQ,MAAM;AAEjD,WACE,oBAAC;KAEC,WAAW,GACT,cACA,CAAC,UAAU,gBACX,MAAM,OACN,WAAW,KAEZ;KACD,OAAO;MACL,OAAO;MACP,QAAQ;MACT;OAXI,MAYL;KAEJ;IACE;GACF"}
+{"version":3,"file":"skeleton.mjs","names":["skeleton"],"sources":["../../../../src/components/atoms/skeleton/skeleton.tsx"],"sourcesContent":["'use client';\n\nimport { skeleton } from '@repo/ui/core';\nimport { DEFAULT_LOCALE, useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nconst { Skeleton: Core } = skeleton;\n\nconst getValueAtIndex = <T,>(value: T | T[], index: number) => {\n  return Array.isArray(value) ? (value[index] ?? value[0]) : value;\n};\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {\n  active?: boolean;\n  loading?: boolean;\n  avatar?: boolean;\n  size?: 'default' | 'small' | 'large';\n  count?: number;\n  gap?: number;\n  direction?: 'horizontal' | 'vertical';\n  width?: string | number | (string | number)[];\n  height?: string | number | (string | number)[];\n  classNames?: {\n    wrapper?: string;\n    avatar?: string;\n    item?: string;\n  };\n}\n\nconst SIZES = {\n  small: 'w-48 h-4',\n  default: 'w-60 h-6',\n  large: 'w-72 h-8',\n};\n\nconst Skeleton = ({\n  active = true,\n  loading = true,\n  avatar,\n  size = 'default',\n  direction = 'vertical',\n  count = 1,\n  gap = 6,\n  className,\n  classNames = {},\n  style,\n  width,\n  height,\n  children,\n  ...props\n}: Props) => {\n  const { locale } = useConfig();\n\n  // Not wrapping `children` here (unlike Spin's overlay mode) — Skeleton\n  // is meant to swap in arbitrary real content once loading finishes,\n  // which can include elements with strict parent requirements (e.g. a\n  // `<tr>`), so adding a wrapper div could produce invalid markup.\n  // `className`/`style`/rest props only ever describe the skeleton's own\n  // placeholder markup, so there's nothing for them to apply to here.\n  if (!loading) {\n    return children ?? null;\n  }\n\n  return (\n    <div\n      role=\"status\"\n      aria-label={locale.loading ?? DEFAULT_LOCALE.loading}\n      className={cn('flex items-center gap-3', className)}\n      style={style}\n      {...props}\n    >\n      {avatar && (\n        <Core\n          className={cn(\n            'h-12 w-12',\n            'rounded-xl',\n            !active && 'animate-none',\n            classNames.avatar,\n          )}\n        />\n      )}\n      <div\n        className={cn(\n          'flex grow',\n          direction === 'vertical' && 'flex-col',\n          classNames.wrapper,\n        )}\n        style={{\n          gap,\n        }}\n      >\n        {Array.from({ length: count }).map((_, index) => {\n          const itemWidth = getValueAtIndex(width, index);\n          const itemHeight = getValueAtIndex(height, index);\n\n          return (\n            <Core\n              key={index}\n              className={cn(\n                'rounded-md',\n                !active && 'animate-none',\n                SIZES[size],\n                classNames.item,\n                //\n              )}\n              style={{\n                width: itemWidth,\n                height: itemHeight,\n              }}\n            />\n          );\n        })}\n      </div>\n    </div>\n  );\n};\n\nexport default Skeleton;\n"],"mappings":";;;;;;AAMA,MAAM,EAAE,UAAU,SAASA;AAE3B,MAAM,mBAAuB,OAAgB,UAAkB;CAC7D,OAAO,MAAM,QAAQ,KAAK,IAAK,MAAM,UAAU,MAAM,KAAM;AAC7D;AAmBA,MAAM,QAAQ;CACZ,OAAO;CACP,SAAS;CACT,OAAO;AACT;AAEA,MAAM,YAAY,EAChB,SAAS,MACT,UAAU,MACV,QACA,OAAO,WACP,YAAY,YACZ,QAAQ,GACR,MAAM,GACN,WACA,aAAa,CAAC,GACd,OACA,OACA,QACA,UACA,GAAG,YACQ;CACX,MAAM,EAAE,WAAW,UAAU;CAQ7B,IAAI,CAAC,SACH,OAAO,YAAY;CAGrB,OACE,qBAAC,OAAD;EACE,MAAK;EACL,cAAY,OAAO,WAAW,eAAe;EAC7C,WAAW,GAAG,2BAA2B,SAAS;EAC3C;EACP,GAAI;EALN,UAAA,CAOG,UACC,oBAAC,MAAD,EACE,WAAW,GACT,aACA,cACA,CAAC,UAAU,gBACX,WAAW,MACb,EACD,CAAA,GAEH,oBAAC,OAAD;GACE,WAAW,GACT,aACA,cAAc,cAAc,YAC5B,WAAW,OACb;GACA,OAAO,EACL,IACF;GAEC,UAAA,MAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,CAAC,CAAC,KAAK,GAAG,UAAU;IAC/C,MAAM,YAAY,gBAAgB,OAAO,KAAK;IAC9C,MAAM,aAAa,gBAAgB,QAAQ,KAAK;IAEhD,OACE,oBAAC,MAAD;KAEE,WAAW,GACT,cACA,CAAC,UAAU,gBACX,MAAM,OACN,WAAW,IAEb;KACA,OAAO;MACL,OAAO;MACP,QAAQ;KACV;IACD,GAZM,KAYN;GAEL,CAAC;EACE,CAAA,CACF;;AAET"}

package/dist/components/atoms/spin.d.mts

@@ -1,16 +1,8 @@
-import * as react from "react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-
 //#region src/components/atoms/spin.d.ts
 interface Props extends React.ComponentPropsWithoutRef<'div'> {
   spinning?: boolean;
 }
-declare const Spin: ({
-  spinning,
-  className,
-  children,
-  ...props
-}: Props) => string | number | bigint | true | Iterable<react.ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<react.ReactNode> | null | undefined> | react_jsx_runtime0.JSX.Element | null;
+declare const Spin: ({ spinning, className, children, ...props }: Props) => string | number | bigint | true | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("react").JSX.Element | null;
 //#endregion
-export { Spin };
+export { Props, Spin as default };
 //# sourceMappingURL=spin.d.mts.map

package/dist/components/atoms/spin.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"spin.d.mts","names":[],"sources":["../../../src/components/atoms/spin.tsx"],"mappings":";;;;UAOiB,KAAA,SAAc,KAAA,CAAM,wBAAA;EACnC,QAAA;AAAA;AAAA,cAGI,IAAA;EAAQ,QAAA;EAAA,SAAA;EAAA,QAAA;EAAA,GAAA;AAAA,GAA6C,KAAA,uCAAK,QAAA,CAAA,KAAA,CAAA,SAAA,IAAA,OAAA,sCAAA,KAAA,CAAA,WAAA,GAAA,KAAA,CAAA,YAAA,mBAAA,KAAA,CAAA,qBAAA,SAAA,QAAA,CAAA,KAAA,CAAA,SAAA,wBAAA,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"spin.d.mts","names":[],"sources":["../../../src/components/atoms/spin.tsx"],"mappings":";UAOiB,cAAc,MAAM;EACnC;;cAGI,SAAQ,UAAA,WAAA,aAAA,SAA6C,4CAAK,yBAAA,aAAA,6DAAA,8BAAA,+CAAA,8BAAA,yBAAA,iDAAA,IAAA"}

package/dist/components/atoms/spin.mjs

@@ -1,10 +1,8 @@
-'use client';
-
+"use client";
 import { cn } from "../../utils.mjs";
 import { DEFAULT_LOCALE, useConfig } from "../../providers/config/context.mjs";
 import { Loader2 } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
-
 //#region src/components/atoms/spin.tsx
 const Spin = ({ spinning, className, children, ...props }) => {
 	const { locale } = useConfig();
@@ -34,7 +32,7 @@ const Spin = ({ spinning, className, children, ...props }) => {
 		})]
 	});
 };
-
 //#endregion
 export { Spin as default };
+
 //# sourceMappingURL=spin.mjs.map

package/dist/components/atoms/spin.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"spin.mjs","names":[],"sources":["../../../src/components/atoms/spin.tsx"],"sourcesContent":["'use client';\n\nimport { Loader2 } from 'lucide-react';\n\nimport { DEFAULT_LOCALE, useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {\n  spinning?: boolean;\n}\n\nconst Spin = ({ spinning, className, children, ...props }: Props) => {\n  const { locale } = useConfig();\n  const loadingLabel = locale.loading ?? DEFAULT_LOCALE.loading;\n\n  // With no children there's nothing to render at all while idle — unlike\n  // the branch below, there's no wrapper for `className`/`props` to land\n  // on regardless, so returning null here isn't the same bug.\n  if (!children) {\n    if (!spinning) {\n      return null;\n    }\n\n    return (\n      <div\n        role=\"status\"\n        aria-label={loadingLabel}\n        className={cn('flex h-full items-center justify-center', className)}\n        {...props}\n      >\n        <Loader2 className=\"animate-spin\" />\n      </div>\n    );\n  }\n\n  // Idle: return children as-is rather than inserting a wrapper div, same\n  // policy Skeleton follows and for the same reason — a wrapper here could\n  // produce invalid markup (e.g. inside a <tr>/<li>) or break flex/grid\n  // child layout. className/props only ever describe the spinning overlay\n  // below, so there's nothing for them to apply to while idle.\n  if (!spinning) {\n    return children;\n  }\n\n  return (\n    <div className={cn('relative', className)} {...props}>\n      <div className=\"pointer-events-none opacity-50\">{children}</div>\n      <div\n        role=\"status\"\n        aria-label={loadingLabel}\n        className=\"absolute inset-0 flex items-center justify-center\"\n      >\n        <Loader2 className=\"animate-spin\" />\n      </div>\n    </div>\n  );\n};\n\nexport default Spin;\n"],"mappings":";;;;;;;;AAWA,MAAM,QAAQ,EAAE,UAAU,WAAW,UAAU,GAAG,YAAmB;CACnE,MAAM,EAAE,WAAW,WAAW;CAC9B,MAAM,eAAe,OAAO,WAAW,eAAe;AAKtD,KAAI,CAAC,UAAU;AACb,MAAI,CAAC,SACH,QAAO;AAGT,SACE,oBAAC;GACC,MAAK;GACL,cAAY;GACZ,WAAW,GAAG,2CAA2C,UAAU;GACnE,GAAI;aAEJ,oBAAC,WAAQ,WAAU,iBAAiB;IAChC;;AASV,KAAI,CAAC,SACH,QAAO;AAGT,QACE,qBAAC;EAAI,WAAW,GAAG,YAAY,UAAU;EAAE,GAAI;aAC7C,oBAAC;GAAI,WAAU;GAAkC;IAAe,EAChE,oBAAC;GACC,MAAK;GACL,cAAY;GACZ,WAAU;aAEV,oBAAC,WAAQ,WAAU,iBAAiB;IAChC;GACF"}
+{"version":3,"file":"spin.mjs","names":[],"sources":["../../../src/components/atoms/spin.tsx"],"sourcesContent":["'use client';\n\nimport { Loader2 } from 'lucide-react';\n\nimport { DEFAULT_LOCALE, useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {\n  spinning?: boolean;\n}\n\nconst Spin = ({ spinning, className, children, ...props }: Props) => {\n  const { locale } = useConfig();\n  const loadingLabel = locale.loading ?? DEFAULT_LOCALE.loading;\n\n  // With no children there's nothing to render at all while idle — unlike\n  // the branch below, there's no wrapper for `className`/`props` to land\n  // on regardless, so returning null here isn't the same bug.\n  if (!children) {\n    if (!spinning) {\n      return null;\n    }\n\n    return (\n      <div\n        role=\"status\"\n        aria-label={loadingLabel}\n        className={cn('flex h-full items-center justify-center', className)}\n        {...props}\n      >\n        <Loader2 className=\"animate-spin\" />\n      </div>\n    );\n  }\n\n  // Idle: return children as-is rather than inserting a wrapper div, same\n  // policy Skeleton follows and for the same reason — a wrapper here could\n  // produce invalid markup (e.g. inside a <tr>/<li>) or break flex/grid\n  // child layout. className/props only ever describe the spinning overlay\n  // below, so there's nothing for them to apply to while idle.\n  if (!spinning) {\n    return children;\n  }\n\n  return (\n    <div className={cn('relative', className)} {...props}>\n      <div className=\"pointer-events-none opacity-50\">{children}</div>\n      <div\n        role=\"status\"\n        aria-label={loadingLabel}\n        className=\"absolute inset-0 flex items-center justify-center\"\n      >\n        <Loader2 className=\"animate-spin\" />\n      </div>\n    </div>\n  );\n};\n\nexport default Spin;\n"],"mappings":";;;;;;AAWA,MAAM,QAAQ,EAAE,UAAU,WAAW,UAAU,GAAG,YAAmB;CACnE,MAAM,EAAE,WAAW,UAAU;CAC7B,MAAM,eAAe,OAAO,WAAW,eAAe;CAKtD,IAAI,CAAC,UAAU;EACb,IAAI,CAAC,UACH,OAAO;EAGT,OACE,oBAAC,OAAD;GACE,MAAK;GACL,cAAY;GACZ,WAAW,GAAG,2CAA2C,SAAS;GAClE,GAAI;GAEJ,UAAA,oBAAC,SAAD,EAAS,WAAU,eAAgB,CAAA;EAChC,CAAA;CAET;CAOA,IAAI,CAAC,UACH,OAAO;CAGT,OACE,qBAAC,OAAD;EAAK,WAAW,GAAG,YAAY,SAAS;EAAG,GAAI;EAA/C,UAAA,CACE,oBAAC,OAAD;GAAK,WAAU;GAAkC;EAAc,CAAA,GAC/D,oBAAC,OAAD;GACE,MAAK;GACL,cAAY;GACZ,WAAU;GAEV,UAAA,oBAAC,SAAD,EAAS,WAAU,eAAgB,CAAA;EAChC,CAAA,CACF;;AAET"}

package/dist/components/atoms/switch.d.mts

@@ -1,5 +1,3 @@
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-
 //#region src/components/atoms/switch.d.ts
 interface Props extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onChange'> {
   classNames?: {
@@ -14,17 +12,7 @@ interface Props extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onChange
   checkedChildren?: React.ReactNode;
   unCheckedChildren?: React.ReactNode;
 }
-declare const Switch: ({
-  className,
-  classNames,
-  size,
-  defaultChecked,
-  checked: _checked,
-  onChange: _onChange,
-  checkedChildren,
-  unCheckedChildren,
-  ...props
-}: Props) => react_jsx_runtime0.JSX.Element;
+declare const Switch: ({ className, classNames, size, defaultChecked, checked: _checked, onChange: _onChange, checkedChildren, unCheckedChildren, ...props }: Props) => import("react").JSX.Element;
 //#endregion
-export { Switch };
+export { Props, Switch as default };
 //# sourceMappingURL=switch.d.mts.map

package/dist/components/atoms/switch.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"switch.d.mts","names":[],"sources":["../../../src/components/atoms/switch.tsx"],"mappings":";;;UAgCiB,KAAA,SAAc,IAAA,CAC7B,KAAA,CAAM,wBAAA;EAGN,UAAA;IACE,KAAA;IACA,MAAA;EAAA;EAEF,IAAA;EACA,cAAA;EACA,OAAA;EACA,QAAA;EACA,QAAA,IAAY,OAAA;EACZ,eAAA,GAAkB,KAAA,CAAM,SAAA;EACxB,iBAAA,GAAoB,KAAA,CAAM,SAAA;AAAA;AAAA,cAGtB,MAAA;EAAU,SAAA;EAAA,UAAA;EAAA,IAAA;EAAA,cAAA;EAAA,OAAA,EAAA,QAAA;EAAA,QAAA,EAAA,SAAA;EAAA,eAAA;EAAA,iBAAA;EAAA,GAAA;AAAA,GAUb,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"switch.d.mts","names":[],"sources":["../../../src/components/atoms/switch.tsx"],"mappings":";UAgCiB,cAAc,KAC7B,MAAM;EAGN;IACE;IACA;;EAEF;EACA;EACA;EACA;EACA,YAAY;EACZ,kBAAkB,MAAM;EACxB,oBAAoB,MAAM;;cAGtB,WAAU,WAAA,YAAA,MAAA,gBAAA,SAAA,UAAA,UAAA,WAAA,iBAAA,sBAAA,SAUb,0BAAK,IAAA"}

package/dist/components/atoms/switch.mjs

@@ -1,10 +1,8 @@
-'use client';
-
+"use client";
 import { cn } from "../../utils.mjs";
 import { switch_exports } from "../../core/switch.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useControllableState } from "@jbpark/use-hooks";
-
 //#region src/components/atoms/switch.tsx
 const { Switch: Core } = switch_exports;
 const sizeConfig = {
@@ -57,7 +55,7 @@ const Switch = ({ className, classNames, size = "medium", defaultChecked, checke
 		})
 	});
 };
-
 //#endregion
 export { Switch as default };
+
 //# sourceMappingURL=switch.mjs.map

package/dist/components/atoms/switch.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"switch.mjs","names":["switchComponent"],"sources":["../../../src/components/atoms/switch.tsx"],"sourcesContent":["'use client';\n\nimport { useControllableState } from '@jbpark/use-hooks';\n\nimport { switchComponent } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst { Switch: Core } = switchComponent;\n\nconst sizeConfig = {\n  medium: {\n    core: 'default' as const,\n    track: 'h-8! w-12!',\n    handle: 'size-6!',\n    handleChecked:\n      'data-[state=unchecked]:left-0.5 data-[state=checked]:left-[calc(100%-26px)]',\n    fontSize: 'text-xs',\n    marginChecked: 'mr-7 ml-2',\n    marginUnchecked: 'mr-2 ml-7',\n  },\n  small: {\n    core: 'sm' as const,\n    track: 'h-6! w-10!',\n    handle: 'size-5!',\n    handleChecked:\n      'data-[state=unchecked]:left-0.5 data-[state=checked]:left-[calc(100%-22px)]',\n    fontSize: 'text-[10px]',\n    marginChecked: 'mr-6 ml-1.5',\n    marginUnchecked: 'mr-1.5 ml-6',\n  },\n};\n\nexport interface Props extends Omit<\n  React.ComponentPropsWithoutRef<'button'>,\n  'onChange'\n> {\n  classNames?: {\n    track?: string;\n    handle?: string;\n  };\n  size?: 'small' | 'medium';\n  defaultChecked?: boolean;\n  checked?: boolean;\n  disabled?: boolean;\n  onChange?: (checked: boolean) => void;\n  checkedChildren?: React.ReactNode;\n  unCheckedChildren?: React.ReactNode;\n}\n\nconst Switch = ({\n  className,\n  classNames,\n  size = 'medium',\n  defaultChecked,\n  checked: _checked,\n  onChange: _onChange = () => {},\n  checkedChildren,\n  unCheckedChildren,\n  ...props\n}: Props) => {\n  const [checked, onChange] = useControllableState<boolean>({\n    value: _checked,\n    defaultValue: defaultChecked ?? false,\n    onChange: _onChange,\n  });\n\n  const hasChildren = !!(checkedChildren || unCheckedChildren);\n  const config = sizeConfig[size];\n\n  return (\n    <Core\n      checked={checked}\n      size={config.core}\n      className={cn(\n        'relative',\n        config.track,\n        hasChildren && 'w-auto! overflow-hidden',\n        className,\n        classNames?.track,\n        //\n      )}\n      handleClassName={cn(\n        config.handle,\n        '!absolute top-1/2 !-translate-y-1/2 !translate-x-0',\n        'transition-[left] duration-200 will-change-[left]',\n        config.handleChecked,\n        classNames?.handle,\n        //\n      )}\n      onCheckedChange={checked => {\n        onChange(checked);\n      }}\n      {...props}\n    >\n      {hasChildren && (\n        <span\n          className={cn(\n            `grid leading-none text-white transition-[margin] duration-200\n            will-change-[margin]`,\n            config.fontSize,\n            checked ? config.marginChecked : config.marginUnchecked,\n            //\n          )}\n        >\n          <span\n            className={cn(\n              'col-start-1 row-start-1 transition-opacity duration-200',\n              checked ? 'opacity-100' : 'opacity-0',\n            )}\n          >\n            {checkedChildren}\n          </span>\n          <span\n            className={cn(\n              'col-start-1 row-start-1 transition-opacity duration-200',\n              checked ? 'opacity-0' : 'opacity-100',\n            )}\n          >\n            {unCheckedChildren}\n          </span>\n        </span>\n      )}\n    </Core>\n  );\n};\n\nexport default Switch;\n"],"mappings":";;;;;;;;AAOA,MAAM,EAAE,QAAQ,SAASA;AAEzB,MAAM,aAAa;CACjB,QAAQ;EACN,MAAM;EACN,OAAO;EACP,QAAQ;EACR,eACE;EACF,UAAU;EACV,eAAe;EACf,iBAAiB;EAClB;CACD,OAAO;EACL,MAAM;EACN,OAAO;EACP,QAAQ;EACR,eACE;EACF,UAAU;EACV,eAAe;EACf,iBAAiB;EAClB;CACF;AAmBD,MAAM,UAAU,EACd,WACA,YACA,OAAO,UACP,gBACA,SAAS,UACT,UAAU,kBAAkB,IAC5B,iBACA,mBACA,GAAG,YACQ;CACX,MAAM,CAAC,SAAS,YAAY,qBAA8B;EACxD,OAAO;EACP,cAAc,kBAAkB;EAChC,UAAU;EACX,CAAC;CAEF,MAAM,cAAc,CAAC,EAAE,mBAAmB;CAC1C,MAAM,SAAS,WAAW;AAE1B,QACE,oBAAC;EACU;EACT,MAAM,OAAO;EACb,WAAW,GACT,YACA,OAAO,OACP,eAAe,2BACf,WACA,YAAY,MAEb;EACD,iBAAiB,GACf,OAAO,QACP,sDACA,qDACA,OAAO,eACP,YAAY,OAEb;EACD,kBAAiB,YAAW;AAC1B,YAAS,QAAQ;;EAEnB,GAAI;YAEH,eACC,qBAAC;GACC,WAAW,GACT;mCAEA,OAAO,UACP,UAAU,OAAO,gBAAgB,OAAO,gBAEzC;cAED,oBAAC;IACC,WAAW,GACT,2DACA,UAAU,gBAAgB,YAC3B;cAEA;KACI,EACP,oBAAC;IACC,WAAW,GACT,2DACA,UAAU,cAAc,cACzB;cAEA;KACI;IACF;GAEJ"}
+{"version":3,"file":"switch.mjs","names":["switchComponent"],"sources":["../../../src/components/atoms/switch.tsx"],"sourcesContent":["'use client';\n\nimport { useControllableState } from '@jbpark/use-hooks';\n\nimport { switchComponent } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst { Switch: Core } = switchComponent;\n\nconst sizeConfig = {\n  medium: {\n    core: 'default' as const,\n    track: 'h-8! w-12!',\n    handle: 'size-6!',\n    handleChecked:\n      'data-[state=unchecked]:left-0.5 data-[state=checked]:left-[calc(100%-26px)]',\n    fontSize: 'text-xs',\n    marginChecked: 'mr-7 ml-2',\n    marginUnchecked: 'mr-2 ml-7',\n  },\n  small: {\n    core: 'sm' as const,\n    track: 'h-6! w-10!',\n    handle: 'size-5!',\n    handleChecked:\n      'data-[state=unchecked]:left-0.5 data-[state=checked]:left-[calc(100%-22px)]',\n    fontSize: 'text-[10px]',\n    marginChecked: 'mr-6 ml-1.5',\n    marginUnchecked: 'mr-1.5 ml-6',\n  },\n};\n\nexport interface Props extends Omit<\n  React.ComponentPropsWithoutRef<'button'>,\n  'onChange'\n> {\n  classNames?: {\n    track?: string;\n    handle?: string;\n  };\n  size?: 'small' | 'medium';\n  defaultChecked?: boolean;\n  checked?: boolean;\n  disabled?: boolean;\n  onChange?: (checked: boolean) => void;\n  checkedChildren?: React.ReactNode;\n  unCheckedChildren?: React.ReactNode;\n}\n\nconst Switch = ({\n  className,\n  classNames,\n  size = 'medium',\n  defaultChecked,\n  checked: _checked,\n  onChange: _onChange = () => {},\n  checkedChildren,\n  unCheckedChildren,\n  ...props\n}: Props) => {\n  const [checked, onChange] = useControllableState<boolean>({\n    value: _checked,\n    defaultValue: defaultChecked ?? false,\n    onChange: _onChange,\n  });\n\n  const hasChildren = !!(checkedChildren || unCheckedChildren);\n  const config = sizeConfig[size];\n\n  return (\n    <Core\n      checked={checked}\n      size={config.core}\n      className={cn(\n        'relative',\n        config.track,\n        hasChildren && 'w-auto! overflow-hidden',\n        className,\n        classNames?.track,\n        //\n      )}\n      handleClassName={cn(\n        config.handle,\n        '!absolute top-1/2 !-translate-y-1/2 !translate-x-0',\n        'transition-[left] duration-200 will-change-[left]',\n        config.handleChecked,\n        classNames?.handle,\n        //\n      )}\n      onCheckedChange={checked => {\n        onChange(checked);\n      }}\n      {...props}\n    >\n      {hasChildren && (\n        <span\n          className={cn(\n            `grid leading-none text-white transition-[margin] duration-200\n            will-change-[margin]`,\n            config.fontSize,\n            checked ? config.marginChecked : config.marginUnchecked,\n            //\n          )}\n        >\n          <span\n            className={cn(\n              'col-start-1 row-start-1 transition-opacity duration-200',\n              checked ? 'opacity-100' : 'opacity-0',\n            )}\n          >\n            {checkedChildren}\n          </span>\n          <span\n            className={cn(\n              'col-start-1 row-start-1 transition-opacity duration-200',\n              checked ? 'opacity-0' : 'opacity-100',\n            )}\n          >\n            {unCheckedChildren}\n          </span>\n        </span>\n      )}\n    </Core>\n  );\n};\n\nexport default Switch;\n"],"mappings":";;;;;;AAOA,MAAM,EAAE,QAAQ,SAASA;AAEzB,MAAM,aAAa;CACjB,QAAQ;EACN,MAAM;EACN,OAAO;EACP,QAAQ;EACR,eACE;EACF,UAAU;EACV,eAAe;EACf,iBAAiB;CACnB;CACA,OAAO;EACL,MAAM;EACN,OAAO;EACP,QAAQ;EACR,eACE;EACF,UAAU;EACV,eAAe;EACf,iBAAiB;CACnB;AACF;AAmBA,MAAM,UAAU,EACd,WACA,YACA,OAAO,UACP,gBACA,SAAS,UACT,UAAU,kBAAkB,CAAC,GAC7B,iBACA,mBACA,GAAG,YACQ;CACX,MAAM,CAAC,SAAS,YAAY,qBAA8B;EACxD,OAAO;EACP,cAAc,kBAAkB;EAChC,UAAU;CACZ,CAAC;CAED,MAAM,cAAc,CAAC,EAAE,mBAAmB;CAC1C,MAAM,SAAS,WAAW;CAE1B,OACE,oBAAC,MAAD;EACW;EACT,MAAM,OAAO;EACb,WAAW,GACT,YACA,OAAO,OACP,eAAe,2BACf,WACA,YAAY,KAEd;EACA,iBAAiB,GACf,OAAO,QACP,sDACA,qDACA,OAAO,eACP,YAAY,MAEd;EACA,kBAAiB,YAAW;GAC1B,SAAS,OAAO;EAClB;EACA,GAAI;EAEH,UAAA,eACC,qBAAC,QAAD;GACE,WAAW,GACT;mCAEA,OAAO,UACP,UAAU,OAAO,gBAAgB,OAAO,eAE1C;GAPF,UAAA,CASE,oBAAC,QAAD;IACE,WAAW,GACT,2DACA,UAAU,gBAAgB,WAC5B;IAEC,UAAA;GACG,CAAA,GACN,oBAAC,QAAD;IACE,WAAW,GACT,2DACA,UAAU,cAAc,aAC1B;IAEC,UAAA;GACG,CAAA,CACF;;CAEJ,CAAA;AAEV"}

package/dist/components/atoms/typography/link.d.mts

@@ -1,14 +1,6 @@
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-
 //#region src/components/atoms/typography/link.d.ts
 interface Props extends React.ComponentPropsWithoutRef<'a'> {}
-declare const Link: ({
-  children,
-  className,
-  target,
-  rel,
-  ...props
-}: Props) => react_jsx_runtime0.JSX.Element;
+declare const Link: ({ children, className, target, rel, ...props }: Props) => import("react").JSX.Element;
 //#endregion
-export { Link };
+export { Props, Link as default };
 //# sourceMappingURL=link.d.mts.map

package/dist/components/atoms/typography/link.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"link.d.mts","names":[],"sources":["../../../../src/components/atoms/typography/link.tsx"],"mappings":";;;UAEiB,KAAA,SAAc,KAAA,CAAM,wBAAA;AAAA,cAE/B,IAAA;EAAQ,QAAA;EAAA,SAAA;EAAA,MAAA;EAAA,GAAA;EAAA,GAAA;AAAA,GAAgD,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"link.d.mts","names":[],"sources":["../../../../src/components/atoms/typography/link.tsx"],"mappings":";UAEiB,cAAc,MAAM;cAE/B,SAAQ,UAAA,WAAA,QAAA,QAAA,SAAgD,0BAAK,IAAA"}

package/dist/components/atoms/typography/link.mjs

@@ -1,6 +1,5 @@
 import { cn } from "../../../utils.mjs";
 import { jsx } from "react/jsx-runtime";
-
 //#region src/components/atoms/typography/link.tsx
 const Link = ({ children, className, target, rel, ...props }) => {
 	return /* @__PURE__ */ jsx("a", {
@@ -11,7 +10,7 @@ const Link = ({ children, className, target, rel, ...props }) => {
 		children
 	});
 };
-
 //#endregion
 export { Link as default };
+
 //# sourceMappingURL=link.mjs.map

package/dist/components/atoms/typography/link.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"link.mjs","names":[],"sources":["../../../../src/components/atoms/typography/link.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'a'> {}\n\nconst Link = ({ children, className, target, rel, ...props }: Props) => {\n  return (\n    <a\n      className={cn(\n        'underline-offset-1 hover:underline',\n        className,\n        //\n      )}\n      target={target}\n      rel={rel ?? (target === '_blank' ? 'noopener noreferrer' : undefined)}\n      {...props}\n    >\n      {children}\n    </a>\n  );\n};\n\nexport default Link;\n"],"mappings":";;;;AAIA,MAAM,QAAQ,EAAE,UAAU,WAAW,QAAQ,KAAK,GAAG,YAAmB;AACtE,QACE,oBAAC;EACC,WAAW,GACT,sCACA,UAED;EACO;EACR,KAAK,QAAQ,WAAW,WAAW,wBAAwB;EAC3D,GAAI;EAEH;GACC"}
+{"version":3,"file":"link.mjs","names":[],"sources":["../../../../src/components/atoms/typography/link.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'a'> {}\n\nconst Link = ({ children, className, target, rel, ...props }: Props) => {\n  return (\n    <a\n      className={cn(\n        'underline-offset-1 hover:underline',\n        className,\n        //\n      )}\n      target={target}\n      rel={rel ?? (target === '_blank' ? 'noopener noreferrer' : undefined)}\n      {...props}\n    >\n      {children}\n    </a>\n  );\n};\n\nexport default Link;\n"],"mappings":";;;AAIA,MAAM,QAAQ,EAAE,UAAU,WAAW,QAAQ,KAAK,GAAG,YAAmB;CACtE,OACE,oBAAC,KAAD;EACE,WAAW,GACT,sCACA,SAEF;EACQ;EACR,KAAK,QAAQ,WAAW,WAAW,wBAAwB,KAAA;EAC3D,GAAI;EAEH;CACA,CAAA;AAEP"}

package/dist/components/atoms/typography/paragraph.d.mts

@@ -1,12 +1,6 @@
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-
 //#region src/components/atoms/typography/paragraph.d.ts
 interface Props extends React.ComponentPropsWithoutRef<'p'> {}
-declare const Paragraph: ({
-  children,
-  className,
-  ...props
-}: Props) => react_jsx_runtime0.JSX.Element;
+declare const Paragraph: ({ children, className, ...props }: Props) => import("react").JSX.Element;
 //#endregion
-export { Paragraph };
+export { Props, Paragraph as default };
 //# sourceMappingURL=paragraph.d.mts.map

package/dist/components/atoms/typography/paragraph.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"paragraph.d.mts","names":[],"sources":["../../../../src/components/atoms/typography/paragraph.tsx"],"mappings":";;;UAEiB,KAAA,SAAc,KAAA,CAAM,wBAAA;AAAA,cAE/B,SAAA;EAAa,QAAA;EAAA,SAAA;EAAA,GAAA;AAAA,GAAmC,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"paragraph.d.mts","names":[],"sources":["../../../../src/components/atoms/typography/paragraph.tsx"],"mappings":";UAEiB,cAAc,MAAM;cAE/B,cAAa,UAAA,cAAA,SAAmC,0BAAK,IAAA"}

package/dist/components/atoms/typography/paragraph.mjs

@@ -1,6 +1,5 @@
 import { cn } from "../../../utils.mjs";
 import { jsx } from "react/jsx-runtime";
-
 //#region src/components/atoms/typography/paragraph.tsx
 const Paragraph = ({ children, className, ...props }) => {
 	return /* @__PURE__ */ jsx("p", {
@@ -9,7 +8,7 @@ const Paragraph = ({ children, className, ...props }) => {
 		children
 	});
 };
-
 //#endregion
 export { Paragraph as default };
+
 //# sourceMappingURL=paragraph.mjs.map

package/dist/components/atoms/typography/paragraph.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"paragraph.mjs","names":[],"sources":["../../../../src/components/atoms/typography/paragraph.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'p'> {}\n\nconst Paragraph = ({ children, className, ...props }: Props) => {\n  return (\n    <p\n      {...props}\n      className={cn(\n        className,\n        //\n      )}\n    >\n      {children}\n    </p>\n  );\n};\n\nexport default Paragraph;\n"],"mappings":";;;;AAIA,MAAM,aAAa,EAAE,UAAU,WAAW,GAAG,YAAmB;AAC9D,QACE,oBAAC;EACC,GAAI;EACJ,WAAW,GACT,UAED;EAEA;GACC"}
+{"version":3,"file":"paragraph.mjs","names":[],"sources":["../../../../src/components/atoms/typography/paragraph.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'p'> {}\n\nconst Paragraph = ({ children, className, ...props }: Props) => {\n  return (\n    <p\n      {...props}\n      className={cn(\n        className,\n        //\n      )}\n    >\n      {children}\n    </p>\n  );\n};\n\nexport default Paragraph;\n"],"mappings":";;;AAIA,MAAM,aAAa,EAAE,UAAU,WAAW,GAAG,YAAmB;CAC9D,OACE,oBAAC,KAAD;EACE,GAAI;EACJ,WAAW,GACT,SAEF;EAEC;CACA,CAAA;AAEP"}

package/dist/components/atoms/typography/text.d.mts

@@ -1,17 +1,9 @@
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-
 //#region src/components/atoms/typography/text.d.ts
 interface Props extends React.ComponentPropsWithoutRef<'span'> {
   underline?: boolean;
   strong?: boolean;
 }
-declare const Text: ({
-  children,
-  underline,
-  strong,
-  className,
-  ...props
-}: Props) => react_jsx_runtime0.JSX.Element;
+declare const Text: ({ children, underline, strong, className, ...props }: Props) => import("react").JSX.Element;
 //#endregion
-export { Text };
+export { Props, Text as default };
 //# sourceMappingURL=text.d.mts.map

package/dist/components/atoms/typography/text.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"text.d.mts","names":[],"sources":["../../../../src/components/atoms/typography/text.tsx"],"mappings":";;;UAEiB,KAAA,SAAc,KAAA,CAAM,wBAAA;EACnC,SAAA;EACA,MAAA;AAAA;AAAA,cAGI,IAAA;EAAQ,QAAA;EAAA,SAAA;EAAA,MAAA;EAAA,SAAA;EAAA,GAAA;AAAA,GAAsD,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"text.d.mts","names":[],"sources":["../../../../src/components/atoms/typography/text.tsx"],"mappings":";UAEiB,cAAc,MAAM;EACnC;EACA;;cAGI,SAAQ,UAAA,WAAA,QAAA,cAAA,SAAsD,0BAAK,IAAA"}

package/dist/components/atoms/typography/text.mjs

@@ -1,6 +1,5 @@
 import { cn } from "../../../utils.mjs";
 import { jsx } from "react/jsx-runtime";
-
 //#region src/components/atoms/typography/text.tsx
 const Text = ({ children, underline, strong, className, ...props }) => {
 	return /* @__PURE__ */ jsx("span", {
@@ -9,7 +8,7 @@ const Text = ({ children, underline, strong, className, ...props }) => {
 		children
 	});
 };
-
 //#endregion
 export { Text as default };
+
 //# sourceMappingURL=text.mjs.map

package/dist/components/atoms/typography/text.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"text.mjs","names":[],"sources":["../../../../src/components/atoms/typography/text.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'span'> {\n  underline?: boolean;\n  strong?: boolean;\n}\n\nconst Text = ({ children, underline, strong, className, ...props }: Props) => {\n  return (\n    <span\n      className={cn(underline && 'underline', strong && 'font-bold', className)}\n      {...props}\n    >\n      {children}\n    </span>\n  );\n};\n\nexport default Text;\n"],"mappings":";;;;AAOA,MAAM,QAAQ,EAAE,UAAU,WAAW,QAAQ,WAAW,GAAG,YAAmB;AAC5E,QACE,oBAAC;EACC,WAAW,GAAG,aAAa,aAAa,UAAU,aAAa,UAAU;EACzE,GAAI;EAEH;GACI"}
+{"version":3,"file":"text.mjs","names":[],"sources":["../../../../src/components/atoms/typography/text.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'span'> {\n  underline?: boolean;\n  strong?: boolean;\n}\n\nconst Text = ({ children, underline, strong, className, ...props }: Props) => {\n  return (\n    <span\n      className={cn(underline && 'underline', strong && 'font-bold', className)}\n      {...props}\n    >\n      {children}\n    </span>\n  );\n};\n\nexport default Text;\n"],"mappings":";;;AAOA,MAAM,QAAQ,EAAE,UAAU,WAAW,QAAQ,WAAW,GAAG,YAAmB;CAC5E,OACE,oBAAC,QAAD;EACE,WAAW,GAAG,aAAa,aAAa,UAAU,aAAa,SAAS;EACxE,GAAI;EAEH;CACG,CAAA;AAEV"}

package/dist/components/atoms/typography/title.d.mts

@@ -1,15 +1,8 @@
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-
 //#region src/components/atoms/typography/title.d.ts
 interface Props extends React.ComponentPropsWithoutRef<'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'> {
   level?: 1 | 2 | 3 | 4 | 5 | 6;
 }
-declare const Title: ({
-  children,
-  level,
-  className,
-  ...props
-}: Props) => react_jsx_runtime0.JSX.Element;
+declare const Title: ({ children, level, className, ...props }: Props) => import("react").JSX.Element;
 //#endregion
-export { Title };
+export { Props, Title as default };
 //# sourceMappingURL=title.d.mts.map

package/dist/components/atoms/typography/title.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"title.d.mts","names":[],"sources":["../../../../src/components/atoms/typography/title.tsx"],"mappings":";;;UAEiB,KAAA,SAAc,KAAA,CAAM,wBAAA;EAGnC,KAAA;AAAA;AAAA,cAiBI,KAAA;EAAS,QAAA;EAAA,KAAA;EAAA,SAAA;EAAA,GAAA;AAAA,GAA8C,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"title.d.mts","names":[],"sources":["../../../../src/components/atoms/typography/title.tsx"],"mappings":";UAEiB,cAAc,MAAM;EAGnC;;cAiBI,UAAS,UAAA,OAAA,cAAA,SAA8C,0BAAK,IAAA"}

package/dist/components/atoms/typography/title.mjs

@@ -1,6 +1,5 @@
 import { cn } from "../../../utils.mjs";
 import { jsx } from "react/jsx-runtime";
-
 //#region src/components/atoms/typography/title.tsx
 const styles = {
 	h1: "text-4xl sm:text-5xl lg:text-6xl",
@@ -18,7 +17,7 @@ const Title = ({ children, level = 1, className, ...props }) => {
 		children
 	});
 };
-
 //#endregion
 export { Title as default };
+
 //# sourceMappingURL=title.mjs.map

package/dist/components/atoms/typography/title.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"title.mjs","names":[],"sources":["../../../../src/components/atoms/typography/title.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<\n  'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n> {\n  level?: 1 | 2 | 3 | 4 | 5 | 6;\n}\n\ntype ElementType = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\n// Scale up at wider breakpoints instead of a single fixed size — the desktop\n// size stays the same as before, but narrow/mobile viewports now get a\n// smaller starting size instead of always rendering at the full desktop size.\nconst styles: Record<string, string> = {\n  h1: 'text-4xl sm:text-5xl lg:text-6xl',\n  h2: 'text-3xl sm:text-4xl lg:text-5xl',\n  h3: 'text-2xl sm:text-3xl lg:text-4xl',\n  h4: 'text-xl sm:text-2xl lg:text-3xl',\n  h5: 'text-lg sm:text-xl lg:text-2xl',\n  h6: 'text-base sm:text-lg lg:text-xl',\n};\n\nconst Title = ({ children, level = 1, className, ...props }: Props) => {\n  const Element: ElementType = level < 1 || level > 6 ? 'h1' : `h${level}`;\n\n  return (\n    <Element\n      className={cn('leading-snug font-bold', styles[Element], className)}\n      {...props}\n    >\n      {children}\n    </Element>\n  );\n};\n\nexport default Title;\n"],"mappings":";;;;AAaA,MAAM,SAAiC;CACrC,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAED,MAAM,SAAS,EAAE,UAAU,QAAQ,GAAG,WAAW,GAAG,YAAmB;CACrE,MAAM,UAAuB,QAAQ,KAAK,QAAQ,IAAI,OAAO,IAAI;AAEjE,QACE,oBAAC;EACC,WAAW,GAAG,0BAA0B,OAAO,UAAU,UAAU;EACnE,GAAI;EAEH;GACO"}
+{"version":3,"file":"title.mjs","names":[],"sources":["../../../../src/components/atoms/typography/title.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<\n  'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n> {\n  level?: 1 | 2 | 3 | 4 | 5 | 6;\n}\n\ntype ElementType = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\n// Scale up at wider breakpoints instead of a single fixed size — the desktop\n// size stays the same as before, but narrow/mobile viewports now get a\n// smaller starting size instead of always rendering at the full desktop size.\nconst styles: Record<string, string> = {\n  h1: 'text-4xl sm:text-5xl lg:text-6xl',\n  h2: 'text-3xl sm:text-4xl lg:text-5xl',\n  h3: 'text-2xl sm:text-3xl lg:text-4xl',\n  h4: 'text-xl sm:text-2xl lg:text-3xl',\n  h5: 'text-lg sm:text-xl lg:text-2xl',\n  h6: 'text-base sm:text-lg lg:text-xl',\n};\n\nconst Title = ({ children, level = 1, className, ...props }: Props) => {\n  const Element: ElementType = level < 1 || level > 6 ? 'h1' : `h${level}`;\n\n  return (\n    <Element\n      className={cn('leading-snug font-bold', styles[Element], className)}\n      {...props}\n    >\n      {children}\n    </Element>\n  );\n};\n\nexport default Title;\n"],"mappings":";;;AAaA,MAAM,SAAiC;CACrC,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,MAAM,SAAS,EAAE,UAAU,QAAQ,GAAG,WAAW,GAAG,YAAmB;CACrE,MAAM,UAAuB,QAAQ,KAAK,QAAQ,IAAI,OAAO,IAAI;CAEjE,OACE,oBAAC,SAAD;EACE,WAAW,GAAG,0BAA0B,OAAO,UAAU,SAAS;EAClE,GAAI;EAEH;CACM,CAAA;AAEb"}