@cryptlex/web-components 6.6.28 → 6.6.30

package/dist/components/avatar.d.ts

@@ -2,6 +2,7 @@ interface InitialString {
     initials: string[2];
 }
 export interface AvatarProps extends Omit<React.ComponentProps<'div'>, 'children'>, InitialString {
+    size?: 'sm' | 'lg';
 }
-export declare function Avatar({ className, initials, ...props }: AvatarProps): import("react/jsx-runtime").JSX.Element;
+export declare function Avatar({ className, initials, size, ...props }: AvatarProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/avatar.js

@@ -1,2 +1,2 @@
-import{jsx as t}from"react/jsx-runtime";import{classNames as r}from"../utilities/theme.js";import"clsx";function d({className:e,initials:n,...o}){return t("div",{className:r("relative body-sm font-mono font-bold flex items-center leading-none justify-center bg-accent text-accent-foreground select-none size-input shrink-0 overflow-hidden rounded-md",e),...o,children:n})}export{d as Avatar};
+import{jsx as s}from"react/jsx-runtime";import{classNames as r}from"../utilities/theme.js";import"clsx";const i={sm:"size-icon",lg:"size-input"};function m({className:e,initials:n,size:o="lg",...t}){return s("div",{className:r("relative body-sm font-mono font-bold flex items-center leading-none justify-center bg-accent text-accent-foreground select-none shrink-0 overflow-hidden rounded-full",e,i[o]),...t,children:n})}export{m as Avatar};
 //# sourceMappingURL=avatar.js.map

package/dist/components/avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.js","sources":["../../lib/components/avatar.tsx"],"sourcesContent":["import { classNames } from '../utilities/theme';\n\ninterface InitialString {\n    initials: string[2];\n}\nexport interface AvatarProps extends Omit<React.ComponentProps<'div'>, 'children'>, InitialString {}\nexport function Avatar({ className, initials, ...props }: AvatarProps) {\n    return (\n        <div\n            className={classNames(\n                'relative body-sm font-mono font-bold flex items-center leading-none justify-center bg-accent text-accent-foreground select-none size-input shrink-0 overflow-hidden rounded-md',\n                className\n            )}\n            {...props}\n        >\n            {initials}\n        </div>\n    );\n}\n"],"names":["Avatar","className","initials","props","jsx","classNames"],"mappings":"wGAMO,SAASA,EAAO,CAAE,UAAAC,EAAW,SAAAC,EAAU,GAAGC,GAAsB,CACnE,OACIC,EAAC,MAAA,CACG,UAAWC,EACP,iLACAJ,CAAA,EAEH,GAAGE,EAEH,SAAAD,CAAA,CAAA,CAGb"}
+{"version":3,"file":"avatar.js","sources":["../../lib/components/avatar.tsx"],"sourcesContent":["import { classNames } from '../utilities/theme';\n\ninterface InitialString {\n    initials: string[2];\n}\nconst sizeClasses = {\n    sm: 'size-icon',\n    lg: 'size-input',\n};\nexport interface AvatarProps extends Omit<React.ComponentProps<'div'>, 'children'>, InitialString {\n    size?: 'sm' | 'lg';\n}\nexport function Avatar({ className, initials, size = 'lg', ...props }: AvatarProps) {\n    return (\n        <div\n            className={classNames(\n                'relative body-sm font-mono font-bold flex items-center leading-none justify-center bg-accent text-accent-foreground select-none shrink-0 overflow-hidden rounded-full',\n                className,\n                sizeClasses[size]\n            )}\n            {...props}\n        >\n            {initials}\n        </div>\n    );\n}\n"],"names":["sizeClasses","Avatar","className","initials","size","props","jsx","classNames"],"mappings":"wGAKA,MAAMA,EAAc,CAChB,GAAI,YACJ,GAAI,YACR,EAIO,SAASC,EAAO,CAAE,UAAAC,EAAW,SAAAC,EAAU,KAAAC,EAAO,KAAM,GAAGC,GAAsB,CAChF,OACIC,EAAC,MAAA,CACG,UAAWC,EACP,wKACAL,EACAF,EAAYI,CAAI,CAAA,EAEnB,GAAGC,EAEH,SAAAF,CAAA,CAAA,CAGb"}

package/dist/components/breadcrumbs.js

@@ -1,2 +1,2 @@
-import{jsx as n,jsxs as t}from"react/jsx-runtime";import{Link as i,composeRenderProps as o}from"react-aria-components";import{classNames as s}from"../utilities/theme.js";import{IcSlash as c,IcMoreHorizontal as m}from"./icons.js";import"clsx";import"react";function b({className:e,...r}){return n("nav",{children:n("ol",{className:s("flex list-none flex-wrap items-center gap-1 break-words",e),...r})})}function x({className:e,...r}){return n("li",{className:s("flex gap-1 items-center",e),...r})}function h({className:e,...r}){return n(i,{className:o(e,a=>s("btn btn-link p-0 text-sm",a)),...r})}function B({children:e,className:r,...a}){return n("span",{role:"presentation","aria-hidden":"true",className:s("opacity-70",r),...a,children:e||n(c,{className:"size-2"})})}function k({className:e,...r}){return t("span",{role:"presentation","aria-hidden":"true",className:s("flex size-input items-center justify-center",e),...r,children:[n(m,{className:"size-icon"}),n("span",{className:"sr-only",children:"More"})]})}export{k as BreadcrumbEllipsis,x as BreadcrumbItem,h as BreadcrumbLink,B as BreadcrumbSeparator,b as Breadcrumbs};
+import{jsx as n,jsxs as t}from"react/jsx-runtime";import{Link as i,composeRenderProps as o}from"react-aria-components";import{classNames as s}from"../utilities/theme.js";import{IcRight as c,IcMoreHorizontal as m}from"./icons.js";import"clsx";import"react";function x({className:e,...r}){return n("nav",{children:n("ol",{className:s("flex list-none flex-wrap items-center gap-1 break-words",e),...r})})}function b({className:e,...r}){return n("li",{className:s("flex gap-1 items-center",e),...r})}function h({className:e,...r}){return n(i,{className:o(e,a=>s("btn p-0 text-sm",a)),...r})}function B({children:e,className:r,...a}){return n("span",{role:"presentation","aria-hidden":"true",className:s("opacity-70",r),...a,children:e||n(c,{className:"size-icon"})})}function z({className:e,...r}){return t("span",{role:"presentation","aria-hidden":"true",className:s("flex size-input items-center justify-center",e),...r,children:[n(m,{className:"size-icon"}),n("span",{className:"sr-only",children:"More"})]})}export{z as BreadcrumbEllipsis,b as BreadcrumbItem,h as BreadcrumbLink,B as BreadcrumbSeparator,x as Breadcrumbs};
 //# sourceMappingURL=breadcrumbs.js.map

package/dist/components/breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumbs.js","sources":["../../lib/components/breadcrumbs.tsx"],"sourcesContent":["import { Link as AriaLink, LinkProps as AriaLinkProps, composeRenderProps } from 'react-aria-components';\nimport { classNames } from '../utilities/theme';\nimport { IcMoreHorizontal, IcSlash } from './icons';\n\nexport function Breadcrumbs({ className, ...props }: React.ComponentProps<'ol'>) {\n    return (\n        <nav>\n            <ol\n                className={classNames('flex list-none flex-wrap items-center gap-1 break-words', className)}\n                {...props}\n            />\n        </nav>\n    );\n}\n\nexport function BreadcrumbItem({ className, ...props }: React.ComponentProps<'li'>) {\n    return <li className={classNames('flex gap-1 items-center', className)} {...props} />;\n}\n\nexport function BreadcrumbLink({ className, ...props }: AriaLinkProps) {\n    return (\n        <AriaLink\n            className={composeRenderProps(className, className => classNames('btn btn-link p-0 text-sm', className))}\n            {...props}\n        />\n    );\n}\n\nexport function BreadcrumbSeparator({ children, className, ...props }: React.ComponentProps<'span'>) {\n    return (\n        <span role=\"presentation\" aria-hidden=\"true\" className={classNames('opacity-70', className)} {...props}>\n            {children || <IcSlash className=\"size-2\" />}\n        </span>\n    );\n}\n\nexport function BreadcrumbEllipsis({ className, ...props }: React.ComponentProps<'span'>) {\n    return (\n        <span\n            role=\"presentation\"\n            aria-hidden=\"true\"\n            className={classNames('flex size-input items-center justify-center', className)}\n            {...props}\n        >\n            <IcMoreHorizontal className=\"size-icon\" />\n            <span className=\"sr-only\">More</span>\n        </span>\n    );\n}\n"],"names":["Breadcrumbs","className","props","jsx","classNames","BreadcrumbItem","BreadcrumbLink","AriaLink","composeRenderProps","BreadcrumbSeparator","children","IcSlash","BreadcrumbEllipsis","jsxs","IcMoreHorizontal"],"mappings":"gQAIO,SAASA,EAAY,CAAE,UAAAC,EAAW,GAAGC,GAAqC,CAC7E,SACK,MAAA,CACG,SAAAC,EAAC,KAAA,CACG,UAAWC,EAAW,0DAA2DH,CAAS,EACzF,GAAGC,CAAA,CAAA,EAEZ,CAER,CAEO,SAASG,EAAe,CAAE,UAAAJ,EAAW,GAAGC,GAAqC,CAChF,OAAOC,EAAC,MAAG,UAAWC,EAAW,0BAA2BH,CAAS,EAAI,GAAGC,EAAO,CACvF,CAEO,SAASI,EAAe,CAAE,UAAAL,EAAW,GAAGC,GAAwB,CACnE,OACIC,EAACI,EAAA,CACG,UAAWC,EAAmBP,EAAWA,GAAaG,EAAW,2BAA4BH,CAAS,CAAC,EACtG,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASO,EAAoB,CAAE,SAAAC,EAAU,UAAAT,EAAW,GAAGC,GAAuC,CACjG,SACK,OAAA,CAAK,KAAK,eAAe,cAAY,OAAO,UAAWE,EAAW,aAAcH,CAAS,EAAI,GAAGC,EAC5F,SAAAQ,KAAaC,EAAA,CAAQ,UAAU,SAAS,EAC7C,CAER,CAEO,SAASC,EAAmB,CAAE,UAAAX,EAAW,GAAGC,GAAuC,CACtF,OACIW,EAAC,OAAA,CACG,KAAK,eACL,cAAY,OACZ,UAAWT,EAAW,8CAA+CH,CAAS,EAC7E,GAAGC,EAEJ,SAAA,CAAAC,EAACW,EAAA,CAAiB,UAAU,WAAA,CAAY,EACxCX,EAAC,OAAA,CAAK,UAAU,UAAU,SAAA,MAAA,CAAI,CAAA,CAAA,CAAA,CAG1C"}
+{"version":3,"file":"breadcrumbs.js","sources":["../../lib/components/breadcrumbs.tsx"],"sourcesContent":["import { Link as AriaLink, LinkProps as AriaLinkProps, composeRenderProps } from 'react-aria-components';\nimport { classNames } from '../utilities/theme';\nimport { IcMoreHorizontal, IcRight } from './icons';\n\nexport function Breadcrumbs({ className, ...props }: React.ComponentProps<'ol'>) {\n    return (\n        <nav>\n            <ol\n                className={classNames('flex list-none flex-wrap items-center gap-1 break-words', className)}\n                {...props}\n            />\n        </nav>\n    );\n}\n\nexport function BreadcrumbItem({ className, ...props }: React.ComponentProps<'li'>) {\n    return <li className={classNames('flex gap-1 items-center', className)} {...props} />;\n}\n\nexport function BreadcrumbLink({ className, ...props }: AriaLinkProps) {\n    return (\n        <AriaLink\n            className={composeRenderProps(className, className => classNames('btn p-0 text-sm', className))}\n            {...props}\n        />\n    );\n}\n\nexport function BreadcrumbSeparator({ children, className, ...props }: React.ComponentProps<'span'>) {\n    return (\n        <span role=\"presentation\" aria-hidden=\"true\" className={classNames('opacity-70', className)} {...props}>\n            {children || <IcRight className=\"size-icon\" />}\n        </span>\n    );\n}\n\nexport function BreadcrumbEllipsis({ className, ...props }: React.ComponentProps<'span'>) {\n    return (\n        <span\n            role=\"presentation\"\n            aria-hidden=\"true\"\n            className={classNames('flex size-input items-center justify-center', className)}\n            {...props}\n        >\n            <IcMoreHorizontal className=\"size-icon\" />\n            <span className=\"sr-only\">More</span>\n        </span>\n    );\n}\n"],"names":["Breadcrumbs","className","props","jsx","classNames","BreadcrumbItem","BreadcrumbLink","AriaLink","composeRenderProps","BreadcrumbSeparator","children","IcRight","BreadcrumbEllipsis","jsxs","IcMoreHorizontal"],"mappings":"gQAIO,SAASA,EAAY,CAAE,UAAAC,EAAW,GAAGC,GAAqC,CAC7E,SACK,MAAA,CACG,SAAAC,EAAC,KAAA,CACG,UAAWC,EAAW,0DAA2DH,CAAS,EACzF,GAAGC,CAAA,CAAA,EAEZ,CAER,CAEO,SAASG,EAAe,CAAE,UAAAJ,EAAW,GAAGC,GAAqC,CAChF,OAAOC,EAAC,MAAG,UAAWC,EAAW,0BAA2BH,CAAS,EAAI,GAAGC,EAAO,CACvF,CAEO,SAASI,EAAe,CAAE,UAAAL,EAAW,GAAGC,GAAwB,CACnE,OACIC,EAACI,EAAA,CACG,UAAWC,EAAmBP,EAAWA,GAAaG,EAAW,kBAAmBH,CAAS,CAAC,EAC7F,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASO,EAAoB,CAAE,SAAAC,EAAU,UAAAT,EAAW,GAAGC,GAAuC,CACjG,SACK,OAAA,CAAK,KAAK,eAAe,cAAY,OAAO,UAAWE,EAAW,aAAcH,CAAS,EAAI,GAAGC,EAC5F,SAAAQ,KAAaC,EAAA,CAAQ,UAAU,YAAY,EAChD,CAER,CAEO,SAASC,EAAmB,CAAE,UAAAX,EAAW,GAAGC,GAAuC,CACtF,OACIW,EAAC,OAAA,CACG,KAAK,eACL,cAAY,OACZ,UAAWT,EAAW,8CAA+CH,CAAS,EAC7E,GAAGC,EAEJ,SAAA,CAAAC,EAACW,EAAA,CAAiB,UAAU,WAAA,CAAY,EACxCX,EAAC,OAAA,CAAK,UAAU,UAAU,SAAA,MAAA,CAAI,CAAA,CAAA,CAAA,CAG1C"}

package/dist/components/checkbox.d.ts

@@ -3,8 +3,9 @@ import { FormFieldProps } from './form';
 export declare const CheckboxGroup: (props: import('react-aria-components').CheckboxGroupProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement | null;
 type CheckboxProps = AriaCheckboxProps & FormFieldProps & {
     variant?: 'checkbox' | 'switch';
+    size?: 'sm' | 'lg';
 };
-export declare function Checkbox({ className, label, description, errorMessage, requiredIndicator, variant, ...props }: Omit<CheckboxProps, 'children'>): import("react/jsx-runtime").JSX.Element;
+export declare function Checkbox({ className, label, description, errorMessage, requiredIndicator, variant, size, ...props }: Omit<CheckboxProps, 'children'>): import("react/jsx-runtime").JSX.Element;
 export type TfCheckboxProps = Omit<React.ComponentProps<typeof Checkbox>, 'onChange' | 'onBlur' | 'isChecked'>;
 export declare function TfCheckbox({ ...props }: TfCheckboxProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/checkbox.js

@@ -1,2 +1,2 @@
-"use client";import{jsx as e,Fragment as k,jsxs as v}from"react/jsx-runtime";import{useId as C}from"react";import{Checkbox as y,composeRenderProps as l,CheckboxGroup as N}from"react-aria-components";import{useFieldContext as I}from"../utilities/form-context.js";import{classNames as r}from"../utilities/theme.js";import{FormField as w,labelVariants as B}from"./form.js";import{IcMinus as F,IcCheck as j}from"./icons.js";import"@tanstack/react-form";import"clsx";import"class-variance-authority";import"./card.js";const i="group-data-[disabled]/checkbox:cursor-not-allowed group-data-[disabled]/checkbox:opacity-50",a="group-data-[invalid]/checkbox:border-destructive",u="focus:outline-none focus-visible:outline-none",b="group-data-[selected]/checkbox:bg-primary",S="relative shrink-0 h-6 w-11 rounded-full border border-input bg-elevation-1 transition-colors duration-200",z="absolute top-1/2 -translate-y-1/2 left-0.5 h-5 w-5 rounded-full bg-background border border-input transition-transform duration-200",D="flex size-input shrink-0 items-center bg-elevation-1 rounded-full justify-center border border-input text-current ring-offset-background",J=N;function G({className:o,label:t,description:m,errorMessage:h,requiredIndicator:p,variant:x="checkbox",...c}){const g=C(),d=c.id||g,f=x==="switch";return e("div",{className:"group form-field",children:e(w,{label:t,description:m,errorMessage:h,requiredIndicator:p,htmlFor:d,children:e(y,{className:l(o,n=>r("group/checkbox cursor-pointer relative focus-ring flex items-center gap-x-2 disabled-muted",B,n)),id:d,...c,children:l(e(k,{}),(n,s)=>f?e("div",{className:r(S,b,i,a,"group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive",u),children:e("div",{className:r(z,"group-data-[selected]/checkbox:translate-x-4.5",i,a)})}):e("div",{className:r(D,"group-data-[indeterminate]/checkbox:bg-primary",b,"group-data-[indeterminate]/checkbox:text-primary-foreground group-data-[selected]/checkbox:text-primary-foreground",i,a,"group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:text-destructive-foreground",u),children:v("span",{className:"flex items-center justify-center",children:[s.isIndeterminate&&e(F,{className:"size-icon"}),!s.isIndeterminate&&s.isSelected&&e(j,{className:"size-icon"})]})}))})})})}function L({...o}){const t=I({disabled:o.isDisabled});return e(G,{requiredIndicator:t.isRequired,isSelected:t.state.value,isDisabled:t.isSubmitting||o.isDisabled,onChange:()=>t.handleChange(!t.state.value),onBlur:t.handleBlur,...o})}export{G as Checkbox,J as CheckboxGroup,L as TfCheckbox};
+"use client";import{jsx as e,Fragment as v,jsxs as C}from"react/jsx-runtime";import{useId as y}from"react";import{Checkbox as N,composeRenderProps as l,CheckboxGroup as I}from"react-aria-components";import{useFieldContext as w}from"../utilities/form-context.js";import{classNames as r}from"../utilities/theme.js";import{FormField as z,labelVariants as B}from"./form.js";import{IcMinus as F,IcCheck as j}from"./icons.js";import"@tanstack/react-form";import"clsx";import"class-variance-authority";import"./card.js";const i="group-data-[disabled]/checkbox:cursor-not-allowed group-data-[disabled]/checkbox:opacity-50",a="group-data-[invalid]/checkbox:border-destructive",u="focus:outline-none focus-visible:outline-none",b="group-data-[selected]/checkbox:bg-primary",S="relative shrink-0 h-6 w-11 rounded-full border border-input bg-elevation-1 transition-colors duration-200",D="absolute top-1/2 -translate-y-1/2 left-0.5 h-5 w-5 rounded-full bg-background border border-input transition-transform duration-200",G="flex shrink-0 items-center bg-elevation-1 rounded-md justify-center border border-input text-current ring-offset-background",R={sm:"size-icon",lg:"size-input"},O=I;function q({className:o,label:t,description:m,errorMessage:h,requiredIndicator:g,variant:p="checkbox",size:x="lg",...c}){const f=y(),n=c.id||f,k=p==="switch";return e("div",{className:"group form-field",children:e(z,{label:t,description:m,errorMessage:h,requiredIndicator:g,htmlFor:n,children:e(N,{className:l(o,d=>r("group/checkbox cursor-pointer relative focus-ring flex items-center gap-x-2 disabled-muted",B,d)),id:n,...c,children:l(e(v,{}),(d,s)=>k?e("div",{className:r(S,b,i,a,"group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive",u),children:e("div",{className:r(D,"group-data-[selected]/checkbox:translate-x-4.5",i,a)})}):e("div",{className:r(G,"group-data-[indeterminate]/checkbox:bg-primary",b,"group-data-[indeterminate]/checkbox:text-primary-foreground group-data-[selected]/checkbox:text-primary-foreground",i,a,"group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:text-destructive-foreground",u,R[x]),children:C("span",{className:"flex items-center justify-center",children:[s.isIndeterminate&&e(F,{className:"size-icon"}),!s.isIndeterminate&&s.isSelected&&e(j,{className:"size-icon"})]})}))})})})}function P({...o}){const t=w({disabled:o.isDisabled});return e(q,{requiredIndicator:t.isRequired,isSelected:t.state.value,isDisabled:t.isSubmitting||o.isDisabled,onChange:()=>t.handleChange(!t.state.value),onBlur:t.handleBlur,...o})}export{q as Checkbox,O as CheckboxGroup,P as TfCheckbox};
 //# sourceMappingURL=checkbox.js.map

package/dist/components/checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.js","sources":["../../lib/components/checkbox.tsx"],"sourcesContent":["'use client';\nimport { useId } from 'react';\nimport {\n    Checkbox as AriaCheckbox,\n    CheckboxGroup as AriaCheckboxGroup,\n    composeRenderProps,\n    type CheckboxProps as AriaCheckboxProps,\n} from 'react-aria-components';\n\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { FormField, labelVariants, type FormFieldProps } from './form';\nimport { IcCheck, IcMinus } from './icons';\n\nconst disabledClasses = 'group-data-[disabled]/checkbox:cursor-not-allowed group-data-[disabled]/checkbox:opacity-50';\nconst invalidBorderClasses = 'group-data-[invalid]/checkbox:border-destructive';\nconst focusResetClasses = 'focus:outline-none focus-visible:outline-none';\nconst selectedPrimaryClasses = 'group-data-[selected]/checkbox:bg-primary';\n\nconst switchBaseClasses =\n    'relative shrink-0 h-6 w-11 rounded-full border border-input bg-elevation-1 transition-colors duration-200';\nconst switchKnobClasses =\n    'absolute top-1/2 -translate-y-1/2 left-0.5 h-5 w-5 rounded-full bg-background border border-input transition-transform duration-200';\n\nconst checkboxBaseClasses =\n    'flex size-input shrink-0 items-center bg-elevation-1 rounded-full justify-center border border-input text-current ring-offset-background';\n\nexport const CheckboxGroup = AriaCheckboxGroup;\ntype CheckboxProps = AriaCheckboxProps &\n    FormFieldProps & {\n        variant?: 'checkbox' | 'switch';\n    };\nexport function Checkbox({\n    className,\n    label,\n    description,\n    errorMessage,\n    requiredIndicator,\n    variant = 'checkbox',\n    ...props\n}: Omit<CheckboxProps, 'children'>) {\n    const generatedId = useId();\n    const fieldId = props.id || generatedId;\n    const isSwitch = variant === 'switch';\n    return (\n        <div className=\"group form-field\">\n            <FormField\n                {...{\n                    label,\n                    description,\n                    errorMessage,\n                    requiredIndicator,\n                    htmlFor: fieldId,\n                }}\n            >\n                <AriaCheckbox\n                    className={composeRenderProps(className, className =>\n                        classNames(\n                            'group/checkbox cursor-pointer relative focus-ring flex items-center gap-x-2 disabled-muted',\n                            labelVariants,\n                            className\n                        )\n                    )}\n                    id={fieldId}\n                    {...props}\n                >\n                    {composeRenderProps(<></>, (_, renderProps) => {\n                        if (isSwitch) {\n                            return (\n                                <div\n                                    className={classNames(\n                                        switchBaseClasses,\n                                        selectedPrimaryClasses,\n                                        disabledClasses,\n                                        invalidBorderClasses,\n                                        'group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive',\n                                        focusResetClasses\n                                    )}\n                                >\n                                    <div\n                                        className={classNames(\n                                            switchKnobClasses,\n                                            'group-data-[selected]/checkbox:translate-x-4.5',\n                                            disabledClasses,\n                                            invalidBorderClasses\n                                        )}\n                                    />\n                                </div>\n                            );\n                        }\n\n                        return (\n                            <div\n                                className={classNames(\n                                    checkboxBaseClasses,\n                                    'group-data-[indeterminate]/checkbox:bg-primary',\n                                    selectedPrimaryClasses,\n                                    'group-data-[indeterminate]/checkbox:text-primary-foreground group-data-[selected]/checkbox:text-primary-foreground',\n                                    disabledClasses,\n                                    invalidBorderClasses,\n                                    'group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:text-destructive-foreground',\n                                    focusResetClasses\n                                )}\n                            >\n                                <span className=\"flex items-center justify-center\">\n                                    {renderProps.isIndeterminate && <IcMinus className=\"size-icon\" />}\n                                    {!renderProps.isIndeterminate && renderProps.isSelected && (\n                                        <IcCheck className=\"size-icon\" />\n                                    )}\n                                </span>\n                            </div>\n                        );\n                    })}\n                </AriaCheckbox>\n            </FormField>\n        </div>\n    );\n}\n\nexport type TfCheckboxProps = Omit<React.ComponentProps<typeof Checkbox>, 'onChange' | 'onBlur' | 'isChecked'>;\nexport function TfCheckbox({ ...props }: TfCheckboxProps) {\n    const field = useFieldContext<boolean>({ disabled: props.isDisabled });\n    return (\n        <Checkbox\n            requiredIndicator={field.isRequired}\n            isSelected={field.state.value}\n            isDisabled={field.isSubmitting || props.isDisabled}\n            onChange={() => field.handleChange(!field.state.value)}\n            onBlur={field.handleBlur}\n            {...props}\n        />\n    );\n}\n"],"names":["disabledClasses","invalidBorderClasses","focusResetClasses","selectedPrimaryClasses","switchBaseClasses","switchKnobClasses","checkboxBaseClasses","CheckboxGroup","AriaCheckboxGroup","Checkbox","className","label","description","errorMessage","requiredIndicator","variant","props","generatedId","useId","fieldId","isSwitch","jsx","FormField","AriaCheckbox","composeRenderProps","classNames","labelVariants","Fragment","_","renderProps","jsxs","IcMinus","IcCheck","TfCheckbox","field","useFieldContext"],"mappings":"igBAcA,MAAMA,EAAkB,8FAClBC,EAAuB,mDACvBC,EAAoB,gDACpBC,EAAyB,4CAEzBC,EACF,4GACEC,EACF,sIAEEC,EACF,2IAESC,EAAgBC,EAKtB,SAASC,EAAS,CACrB,UAAAC,EACA,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,kBAAAC,EACA,QAAAC,EAAU,WACV,GAAGC,CACP,EAAoC,CAChC,MAAMC,EAAcC,EAAA,EACdC,EAAUH,EAAM,IAAMC,EACtBG,EAAWL,IAAY,SAC7B,OACIM,EAAC,MAAA,CAAI,UAAU,mBACX,SAAAA,EAACC,EAAA,CAEO,MAAAX,EACA,YAAAC,EACA,aAAAC,EACA,kBAAAC,EACA,QAASK,EAGb,SAAAE,EAACE,EAAA,CACG,UAAWC,EAAmBd,EAAWA,GACrCe,EACI,6FACAC,EACAhB,CAAA,CACJ,EAEJ,GAAIS,EACH,GAAGH,EAEH,SAAAQ,EAAmBH,EAAAM,EAAA,CAAA,CAAE,EAAK,CAACC,EAAGC,IACvBT,EAEIC,EAAC,MAAA,CACG,UAAWI,EACPrB,EACAD,EACAH,EACAC,EACA,8EACAC,CAAA,EAGJ,SAAAmB,EAAC,MAAA,CACG,UAAWI,EACPpB,EACA,iDACAL,EACAC,CAAA,CACJ,CAAA,CACJ,CAAA,EAMRoB,EAAC,MAAA,CACG,UAAWI,EACPnB,EACA,iDACAH,EACA,qHACAH,EACAC,EACA,uKACAC,CAAA,EAGJ,SAAA4B,EAAC,OAAA,CAAK,UAAU,mCACX,SAAA,CAAAD,EAAY,iBAAmBR,EAACU,EAAA,CAAQ,UAAU,YAAY,EAC9D,CAACF,EAAY,iBAAmBA,EAAY,YACzCR,EAACW,EAAA,CAAQ,UAAU,WAAA,CAAY,CAAA,CAAA,CAEvC,CAAA,CAAA,CAGX,CAAA,CAAA,CACL,CAAA,EAER,CAER,CAGO,SAASC,EAAW,CAAE,GAAGjB,GAA0B,CACtD,MAAMkB,EAAQC,EAAyB,CAAE,SAAUnB,EAAM,WAAY,EACrE,OACIK,EAACZ,EAAA,CACG,kBAAmByB,EAAM,WACzB,WAAYA,EAAM,MAAM,MACxB,WAAYA,EAAM,cAAgBlB,EAAM,WACxC,SAAU,IAAMkB,EAAM,aAAa,CAACA,EAAM,MAAM,KAAK,EACrD,OAAQA,EAAM,WACb,GAAGlB,CAAA,CAAA,CAGhB"}
+{"version":3,"file":"checkbox.js","sources":["../../lib/components/checkbox.tsx"],"sourcesContent":["'use client';\nimport { useId } from 'react';\nimport {\n    Checkbox as AriaCheckbox,\n    CheckboxGroup as AriaCheckboxGroup,\n    composeRenderProps,\n    type CheckboxProps as AriaCheckboxProps,\n} from 'react-aria-components';\n\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { FormField, labelVariants, type FormFieldProps } from './form';\nimport { IcCheck, IcMinus } from './icons';\n\nconst disabledClasses = 'group-data-[disabled]/checkbox:cursor-not-allowed group-data-[disabled]/checkbox:opacity-50';\nconst invalidBorderClasses = 'group-data-[invalid]/checkbox:border-destructive';\nconst focusResetClasses = 'focus:outline-none focus-visible:outline-none';\nconst selectedPrimaryClasses = 'group-data-[selected]/checkbox:bg-primary';\n\nconst switchBaseClasses =\n    'relative shrink-0 h-6 w-11 rounded-full border border-input bg-elevation-1 transition-colors duration-200';\nconst switchKnobClasses =\n    'absolute top-1/2 -translate-y-1/2 left-0.5 h-5 w-5 rounded-full bg-background border border-input transition-transform duration-200';\n\nconst checkboxBaseClasses =\n    'flex shrink-0 items-center bg-elevation-1 rounded-md justify-center border border-input text-current ring-offset-background';\n\nconst sizeClasses = {\n    sm: 'size-icon',\n    lg: 'size-input',\n};\nexport const CheckboxGroup = AriaCheckboxGroup;\ntype CheckboxProps = AriaCheckboxProps &\n    FormFieldProps & {\n        variant?: 'checkbox' | 'switch';\n        size?: 'sm' | 'lg';\n    };\nexport function Checkbox({\n    className,\n    label,\n    description,\n    errorMessage,\n    requiredIndicator,\n    variant = 'checkbox',\n    size = 'lg',\n    ...props\n}: Omit<CheckboxProps, 'children'>) {\n    const generatedId = useId();\n    const fieldId = props.id || generatedId;\n    const isSwitch = variant === 'switch';\n    return (\n        <div className=\"group form-field\">\n            <FormField\n                {...{\n                    label,\n                    description,\n                    errorMessage,\n                    requiredIndicator,\n                    htmlFor: fieldId,\n                }}\n            >\n                <AriaCheckbox\n                    className={composeRenderProps(className, className =>\n                        classNames(\n                            'group/checkbox cursor-pointer relative focus-ring flex items-center gap-x-2 disabled-muted',\n                            labelVariants,\n                            className\n                        )\n                    )}\n                    id={fieldId}\n                    {...props}\n                >\n                    {composeRenderProps(<></>, (_, renderProps) => {\n                        if (isSwitch) {\n                            return (\n                                <div\n                                    className={classNames(\n                                        switchBaseClasses,\n                                        selectedPrimaryClasses,\n                                        disabledClasses,\n                                        invalidBorderClasses,\n                                        'group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive',\n                                        focusResetClasses\n                                    )}\n                                >\n                                    <div\n                                        className={classNames(\n                                            switchKnobClasses,\n                                            'group-data-[selected]/checkbox:translate-x-4.5',\n                                            disabledClasses,\n                                            invalidBorderClasses\n                                        )}\n                                    />\n                                </div>\n                            );\n                        }\n\n                        return (\n                            <div\n                                className={classNames(\n                                    checkboxBaseClasses,\n                                    'group-data-[indeterminate]/checkbox:bg-primary',\n                                    selectedPrimaryClasses,\n                                    'group-data-[indeterminate]/checkbox:text-primary-foreground group-data-[selected]/checkbox:text-primary-foreground',\n                                    disabledClasses,\n                                    invalidBorderClasses,\n                                    'group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:text-destructive-foreground',\n                                    focusResetClasses,\n                                    sizeClasses[size]\n                                )}\n                            >\n                                <span className=\"flex items-center justify-center\">\n                                    {renderProps.isIndeterminate && <IcMinus className=\"size-icon\" />}\n                                    {!renderProps.isIndeterminate && renderProps.isSelected && (\n                                        <IcCheck className=\"size-icon\" />\n                                    )}\n                                </span>\n                            </div>\n                        );\n                    })}\n                </AriaCheckbox>\n            </FormField>\n        </div>\n    );\n}\n\nexport type TfCheckboxProps = Omit<React.ComponentProps<typeof Checkbox>, 'onChange' | 'onBlur' | 'isChecked'>;\nexport function TfCheckbox({ ...props }: TfCheckboxProps) {\n    const field = useFieldContext<boolean>({ disabled: props.isDisabled });\n    return (\n        <Checkbox\n            requiredIndicator={field.isRequired}\n            isSelected={field.state.value}\n            isDisabled={field.isSubmitting || props.isDisabled}\n            onChange={() => field.handleChange(!field.state.value)}\n            onBlur={field.handleBlur}\n            {...props}\n        />\n    );\n}\n"],"names":["disabledClasses","invalidBorderClasses","focusResetClasses","selectedPrimaryClasses","switchBaseClasses","switchKnobClasses","checkboxBaseClasses","sizeClasses","CheckboxGroup","AriaCheckboxGroup","Checkbox","className","label","description","errorMessage","requiredIndicator","variant","size","props","generatedId","useId","fieldId","isSwitch","jsx","FormField","AriaCheckbox","composeRenderProps","classNames","labelVariants","Fragment","_","renderProps","jsxs","IcMinus","IcCheck","TfCheckbox","field","useFieldContext"],"mappings":"igBAcA,MAAMA,EAAkB,8FAClBC,EAAuB,mDACvBC,EAAoB,gDACpBC,EAAyB,4CAEzBC,EACF,4GACEC,EACF,sIAEEC,EACF,8HAEEC,EAAc,CAChB,GAAI,YACJ,GAAI,YACR,EACaC,EAAgBC,EAMtB,SAASC,EAAS,CACrB,UAAAC,EACA,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,kBAAAC,EACA,QAAAC,EAAU,WACV,KAAAC,EAAO,KACP,GAAGC,CACP,EAAoC,CAChC,MAAMC,EAAcC,EAAA,EACdC,EAAUH,EAAM,IAAMC,EACtBG,EAAWN,IAAY,SAC7B,OACIO,EAAC,MAAA,CAAI,UAAU,mBACX,SAAAA,EAACC,EAAA,CAEO,MAAAZ,EACA,YAAAC,EACA,aAAAC,EACA,kBAAAC,EACA,QAASM,EAGb,SAAAE,EAACE,EAAA,CACG,UAAWC,EAAmBf,EAAWA,GACrCgB,EACI,6FACAC,EACAjB,CAAA,CACJ,EAEJ,GAAIU,EACH,GAAGH,EAEH,SAAAQ,EAAmBH,EAAAM,EAAA,CAAA,CAAE,EAAK,CAACC,EAAGC,IACvBT,EAEIC,EAAC,MAAA,CACG,UAAWI,EACPvB,EACAD,EACAH,EACAC,EACA,8EACAC,CAAA,EAGJ,SAAAqB,EAAC,MAAA,CACG,UAAWI,EACPtB,EACA,iDACAL,EACAC,CAAA,CACJ,CAAA,CACJ,CAAA,EAMRsB,EAAC,MAAA,CACG,UAAWI,EACPrB,EACA,iDACAH,EACA,qHACAH,EACAC,EACA,uKACAC,EACAK,EAAYU,CAAI,CAAA,EAGpB,SAAAe,EAAC,OAAA,CAAK,UAAU,mCACX,SAAA,CAAAD,EAAY,iBAAmBR,EAACU,EAAA,CAAQ,UAAU,YAAY,EAC9D,CAACF,EAAY,iBAAmBA,EAAY,YACzCR,EAACW,EAAA,CAAQ,UAAU,WAAA,CAAY,CAAA,CAAA,CAEvC,CAAA,CAAA,CAGX,CAAA,CAAA,CACL,CAAA,EAER,CAER,CAGO,SAASC,EAAW,CAAE,GAAGjB,GAA0B,CACtD,MAAMkB,EAAQC,EAAyB,CAAE,SAAUnB,EAAM,WAAY,EACrE,OACIK,EAACb,EAAA,CACG,kBAAmB0B,EAAM,WACzB,WAAYA,EAAM,MAAM,MACxB,WAAYA,EAAM,cAAgBlB,EAAM,WACxC,SAAU,IAAMkB,EAAM,aAAa,CAACA,EAAM,MAAM,KAAK,EACrD,OAAQA,EAAM,WACb,GAAGlB,CAAA,CAAA,CAGhB"}