@cryptlex/web-components 6.6.62 → 6.6.64

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as e,Fragment as y,jsxs as w}from"react/jsx-runtime";import{useId as F}from"react";import{Checkbox as I,composeRenderProps as g,CheckboxGroup as B}from"react-aria-components";import{useFieldContext as S}from"../utilities/form-context.js";import{classNames as s}from"../utilities/theme.js";import{labelVariants as z,FormField as j}from"./form.js";import{IcMinus as D,IcCheck as G}from"./icons.js";import"@tanstack/react-form";import"clsx";import"class-variance-authority";import"./card.js";import"@icons-pack/react-simple-icons";const c="group-data-[disabled]/checkbox:cursor-not-allowed group-data-[disabled]/checkbox:opacity-50",a="group-data-[invalid]/checkbox:border-destructive",p="focus:outline-none focus-visible:outline-none",x="group-data-[selected]/checkbox:bg-primary",R="relative shrink-0 h-6 w-11 rounded-full border border-input bg-elevation-mid transition-colors duration-200",$="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",q="flex shrink-0 items-center bg-elevation-mid rounded-md justify-center border border-input text-current ring-offset-background",K={sm:"size-icon",lg:"size-input"},f={sm:"size-3",lg:"size-icon"},W=B;function T({className:o,label:t,description:d,errorMessage:n,requiredIndicator:l,variant:k="checkbox",size:r="lg",...u}){const v=F(),b=u.id||v,C=k==="switch",N=!!(t||d||n||l),m=e(I,{className:g(o,h=>s("group/checkbox cursor-pointer relative focus-ring flex items-center gap-x-2 disabled-muted",z,h)),id:b,...u,children:g(e(y,{}),(h,i)=>C?e("div",{className:s(R,x,c,a,"group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive",p),children:e("div",{className:s($,"group-data-[selected]/checkbox:translate-x-4.5",c,a)})}):w("div",{className:s(q,"group-data-[indeterminate]/checkbox:bg-primary",x,"group-data-[indeterminate]/checkbox:text-primary-foreground group-data-[selected]/checkbox:text-primary-foreground",c,a,"group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:text-destructive-foreground",p,K[r]),children:[i.isIndeterminate&&e(D,{className:f[r]}),!i.isIndeterminate&&i.isSelected&&e(G,{className:f[r]})]}))});return N?e("div",{className:"group form-field",children:e(j,{label:t,description:d,errorMessage:n,requiredIndicator:l,htmlFor:b,children:m})}):e("div",{className:"group flex",children:m})}function X({...o}){const t=S({disabled:o.isDisabled});return e(T,{requiredIndicator:t.isRequired,isSelected:t.state.value,isDisabled:t.isSubmitting||o.isDisabled,onChange:()=>t.handleChange(!t.state.value),onBlur:t.handleBlur,...o})}export{T as Checkbox,W as CheckboxGroup,X as TfCheckbox};
1
+ "use client";import{jsx as e,Fragment as y,jsxs as d}from"react/jsx-runtime";import{useId as I}from"react";import{Checkbox as w,composeRenderProps as x,CheckboxGroup as B}from"react-aria-components";import{useFieldContext as S}from"../utilities/form-context.js";import{classNames as r}from"../utilities/theme.js";import{labelVariants as z,FormField as D,FormFieldLabel as j,FormFieldDescription as G}from"./form.js";import{IcMinus as R,IcCheck as q}from"./icons.js";import"@tanstack/react-form";import"clsx";import"class-variance-authority";import"./card.js";import"@icons-pack/react-simple-icons";const n="group-data-[disabled]/checkbox:cursor-not-allowed group-data-[disabled]/checkbox:opacity-50",l="group-data-[invalid]/checkbox:border-destructive",g="focus:outline-none focus-visible:outline-none",p="group-data-[selected]/checkbox:bg-primary",$="relative shrink-0 h-6 w-11 rounded-full border border-input bg-elevation-mid transition-colors duration-200",K="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",L="flex shrink-0 items-center bg-elevation-mid rounded-md justify-center border border-input text-current ring-offset-background",T={sm:"size-icon",lg:"size-input"},f={sm:"size-3",lg:"size-icon"},Y=B;function V({className:o,label:t,description:s,errorMessage:u,requiredIndicator:k,variant:v="checkbox",size:i="sm",...m}){const C=I(),c=m.id||C,F=v==="switch",N=!!(t||s||u||k),b=e(w,{className:x(o,h=>r("group/checkbox cursor-pointer relative focus-ring flex items-center gap-x-2 disabled-muted",z,h)),id:c,...m,children:x(e(y,{}),(h,a)=>F?e("div",{className:r($,p,n,l,"group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive",g),children:e("div",{className:r(K,"group-data-[selected]/checkbox:translate-x-4.5",n,l)})}):d("div",{className:r(L,"group-data-[indeterminate]/checkbox:bg-primary",p,"group-data-[indeterminate]/checkbox:text-primary-foreground group-data-[selected]/checkbox:text-primary-foreground",n,l,"group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:text-destructive-foreground",g,T[i]),children:[a.isIndeterminate&&e(R,{className:f[i]}),!a.isIndeterminate&&a.isSelected&&e(q,{className:f[i]})]}))});return N?e("div",{className:"group form-field",children:e(D,{errorMessage:u,htmlFor:c,children:d("div",{className:"flex items-start gap-1",children:[b,d("div",{className:"flex flex-col gap-1",children:[t&&e(j,{htmlFor:c,children:t}),s&&e(G,{children:s})]})]})})}):e("div",{className:"group flex",children:b})}function Z({...o}){const t=S({disabled:o.isDisabled});return e(V,{requiredIndicator:t.isRequired,isSelected:t.state.value,isDisabled:t.isSubmitting||o.isDisabled,onChange:()=>t.handleChange(!t.state.value),onBlur:t.handleBlur,...o})}export{V as Checkbox,Y as CheckboxGroup,Z as TfCheckbox};
2
2
  //# sourceMappingURL=checkbox.js.map
@@ -1 +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-mid 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-mid rounded-md justify-center border border-input text-current ring-offset-background';\n\nconst sizeClasses = {\n sm: 'size-icon',\n lg: 'size-input',\n};\n\nconst iconSizeClasses = {\n sm: 'size-3',\n lg: 'size-icon',\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 const hasFormField = !!(label || description || errorMessage || requiredIndicator);\n const checkbox = (\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 {renderProps.isIndeterminate && <IcMinus className={iconSizeClasses[size]} />}\n {!renderProps.isIndeterminate && renderProps.isSelected && (\n <IcCheck className={iconSizeClasses[size]} />\n )}\n </div>\n );\n })}\n </AriaCheckbox>\n );\n if (!hasFormField) return <div className=\"group flex\">{checkbox}</div>;\n return (\n <div className=\"group form-field\">\n <FormField {...{ label, description, errorMessage, requiredIndicator, htmlFor: fieldId }}>\n {checkbox}\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","iconSizeClasses","CheckboxGroup","AriaCheckboxGroup","Checkbox","className","label","description","errorMessage","requiredIndicator","variant","size","props","generatedId","useId","fieldId","isSwitch","hasFormField","checkbox","jsx","AriaCheckbox","composeRenderProps","classNames","labelVariants","Fragment","_","renderProps","jsxs","IcMinus","IcCheck","FormField","TfCheckbox","field","useFieldContext"],"mappings":"wiBAcA,MAAMA,EAAkB,8FAClBC,EAAuB,mDACvBC,EAAoB,gDACpBC,EAAyB,4CAEzBC,EACF,8GACEC,EACF,sIAEEC,EACF,gIAEEC,EAAc,CAChB,GAAI,YACJ,GAAI,YACR,EAEMC,EAAkB,CACpB,GAAI,SACJ,GAAI,WACR,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,SACvBO,EAAe,CAAC,EAAEX,GAASC,GAAeC,GAAgBC,GAC1DS,EACFC,EAACC,EAAA,CACG,UAAWC,EAAmBhB,EAAWA,GACrCiB,EACI,6FACAC,EACAlB,CAAA,CACJ,EAEJ,GAAIU,EACH,GAAGH,EAEH,SAAAS,EAAmBF,EAAAK,EAAA,CAAA,CAAE,EAAK,CAACC,EAAGC,IACvBV,EAEIG,EAAC,MAAA,CACG,UAAWG,EACPzB,EACAD,EACAH,EACAC,EACA,8EACAC,CAAA,EAGJ,SAAAwB,EAAC,MAAA,CACG,UAAWG,EACPxB,EACA,iDACAL,EACAC,CAAA,CACJ,CAAA,CACJ,CAAA,EAMRiC,EAAC,MAAA,CACG,UAAWL,EACPvB,EACA,iDACAH,EACA,qHACAH,EACAC,EACA,uKACAC,EACAK,EAAYW,CAAI,CAAA,EAGnB,SAAA,CAAAe,EAAY,iBAAmBP,EAACS,EAAA,CAAQ,UAAW3B,EAAgBU,CAAI,EAAG,EAC1E,CAACe,EAAY,iBAAmBA,EAAY,cACxCG,EAAA,CAAQ,UAAW5B,EAAgBU,CAAI,CAAA,CAAG,CAAA,CAAA,CAAA,CAI1D,CAAA,CAAA,EAGT,OAAKM,IAEA,MAAA,CAAI,UAAU,mBACX,SAAAE,EAACW,GAAgB,MAAAxB,EAAO,YAAAC,EAAa,aAAAC,EAAc,kBAAAC,EAAmB,QAASM,EAC1E,WACL,EACJ,IANuB,MAAA,CAAI,UAAU,aAAc,SAAAG,EAAS,CAQpE,CAGO,SAASa,EAAW,CAAE,GAAGnB,GAA0B,CACtD,MAAMoB,EAAQC,EAAyB,CAAE,SAAUrB,EAAM,WAAY,EACrE,OACIO,EAACf,EAAA,CACG,kBAAmB4B,EAAM,WACzB,WAAYA,EAAM,MAAM,MACxB,WAAYA,EAAM,cAAgBpB,EAAM,WACxC,SAAU,IAAMoB,EAAM,aAAa,CAACA,EAAM,MAAM,KAAK,EACrD,OAAQA,EAAM,WACb,GAAGpB,CAAA,CAAA,CAGhB"}
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, FormFieldLabel, FormFieldDescription, 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-mid 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-mid rounded-md justify-center border border-input text-current ring-offset-background';\n\nconst sizeClasses = {\n sm: 'size-icon',\n lg: 'size-input',\n};\n\nconst iconSizeClasses = {\n sm: 'size-3',\n lg: 'size-icon',\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 = 'sm',\n ...props\n}: Omit<CheckboxProps, 'children'>) {\n const generatedId = useId();\n const fieldId = props.id || generatedId;\n const isSwitch = variant === 'switch';\n const hasFormField = !!(label || description || errorMessage || requiredIndicator);\n const checkbox = (\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 {renderProps.isIndeterminate && <IcMinus className={iconSizeClasses[size]} />}\n {!renderProps.isIndeterminate && renderProps.isSelected && (\n <IcCheck className={iconSizeClasses[size]} />\n )}\n </div>\n );\n })}\n </AriaCheckbox>\n );\n if (!hasFormField) return <div className=\"group flex\">{checkbox}</div>;\n return (\n <div className=\"group form-field\">\n <FormField {...{ errorMessage, htmlFor: fieldId }}>\n <div className=\"flex items-start gap-1\">\n {checkbox}\n <div className=\"flex flex-col gap-1\">\n {label && <FormFieldLabel htmlFor={fieldId}>{label}</FormFieldLabel>}\n {description && <FormFieldDescription>{description}</FormFieldDescription>}\n </div>\n </div>\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","iconSizeClasses","CheckboxGroup","AriaCheckboxGroup","Checkbox","className","label","description","errorMessage","requiredIndicator","variant","size","props","generatedId","useId","fieldId","isSwitch","hasFormField","checkbox","jsx","AriaCheckbox","composeRenderProps","classNames","labelVariants","Fragment","_","renderProps","jsxs","IcMinus","IcCheck","FormField","FormFieldLabel","FormFieldDescription","TfCheckbox","field","useFieldContext"],"mappings":"slBAcA,MAAMA,EAAkB,8FAClBC,EAAuB,mDACvBC,EAAoB,gDACpBC,EAAyB,4CAEzBC,EACF,8GACEC,EACF,sIAEEC,EACF,gIAEEC,EAAc,CAChB,GAAI,YACJ,GAAI,YACR,EAEMC,EAAkB,CACpB,GAAI,SACJ,GAAI,WACR,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,SACvBO,EAAe,CAAC,EAAEX,GAASC,GAAeC,GAAgBC,GAC1DS,EACFC,EAACC,EAAA,CACG,UAAWC,EAAmBhB,EAAWA,GACrCiB,EACI,6FACAC,EACAlB,CAAA,CACJ,EAEJ,GAAIU,EACH,GAAGH,EAEH,SAAAS,EAAmBF,EAAAK,EAAA,CAAA,CAAE,EAAK,CAACC,EAAGC,IACvBV,EAEIG,EAAC,MAAA,CACG,UAAWG,EACPzB,EACAD,EACAH,EACAC,EACA,8EACAC,CAAA,EAGJ,SAAAwB,EAAC,MAAA,CACG,UAAWG,EACPxB,EACA,iDACAL,EACAC,CAAA,CACJ,CAAA,CACJ,CAAA,EAMRiC,EAAC,MAAA,CACG,UAAWL,EACPvB,EACA,iDACAH,EACA,qHACAH,EACAC,EACA,uKACAC,EACAK,EAAYW,CAAI,CAAA,EAGnB,SAAA,CAAAe,EAAY,iBAAmBP,EAACS,EAAA,CAAQ,UAAW3B,EAAgBU,CAAI,EAAG,EAC1E,CAACe,EAAY,iBAAmBA,EAAY,cACxCG,EAAA,CAAQ,UAAW5B,EAAgBU,CAAI,CAAA,CAAG,CAAA,CAAA,CAAA,CAI1D,CAAA,CAAA,EAGT,OAAKM,EAEDE,EAAC,MAAA,CAAI,UAAU,mBACX,WAACW,EAAA,CAAgB,aAAAtB,EAAc,QAASO,EACpC,SAAAY,EAAC,MAAA,CAAI,UAAU,yBACV,SAAA,CAAAT,EACDS,EAAC,MAAA,CAAI,UAAU,sBACV,SAAA,CAAArB,GAASa,EAACY,EAAA,CAAe,QAAShB,EAAU,SAAAT,EAAM,EAClDC,GAAeY,EAACa,EAAA,CAAsB,SAAAzB,CAAA,CAAY,CAAA,CAAA,CACvD,CAAA,CAAA,CACJ,EACJ,EACJ,IAZuB,MAAA,CAAI,UAAU,aAAc,SAAAW,EAAS,CAcpE,CAGO,SAASe,EAAW,CAAE,GAAGrB,GAA0B,CACtD,MAAMsB,EAAQC,EAAyB,CAAE,SAAUvB,EAAM,WAAY,EACrE,OACIO,EAACf,EAAA,CACG,kBAAmB8B,EAAM,WACzB,WAAYA,EAAM,MAAM,MACxB,WAAYA,EAAM,cAAgBtB,EAAM,WACxC,SAAU,IAAMsB,EAAM,aAAa,CAACA,EAAM,MAAM,KAAK,EACrD,OAAQA,EAAM,WACb,GAAGtB,CAAA,CAAA,CAGhB"}
@@ -1,2 +1,2 @@
1
- "use client";import{jsxs as a,Fragment as c,jsx as r}from"react/jsx-runtime";import{cva as s}from"class-variance-authority";import{Group as u,composeRenderProps as m,Label as f,Text as p,Button as g}from"react-aria-components";import{classNames as i}from"../utilities/theme.js";import{Card as b,CardHeader as x,CardTitle as h}from"./card.js";import{IcInfo as v,IcError as F}from"./icons.js";import"clsx";import"@icons-pack/react-simple-icons";import"react";const N=s(["select-none body-sm font-medium leading-none","disabled-muted","group-data-[invalid]:text-destructive"]);function y({className:t,...e}){return r(f,{className:i(N(),t),...e})}function k({className:t,children:e,...n}){return a(p,{className:i("body-sm text-muted leading-tight",t),...n,slot:"description",children:[e,r(v,{className:"inline size-2 align-text-top ms-0.5"})]})}function w({className:t,children:e,...n}){return a("label",{role:"alert",className:i("body-sm leading-tight text-destructive duration-150 animate-in transition-transform slide-in-from-top-5 fade-in",t),...n,children:[e,r(F,{className:"inline size-2 align-text-top ms-0.5"})]})}const j=s("",{variants:{variant:{default:["relative flex w-full items-center overflow-hidden border border-input bg-elevation-mid input-dim ring-offset-background placeholder:text-muted-foreground","focus-ring","disabled-muted"],ghost:""}},defaultVariants:{variant:"default"}});function B({className:t,variant:e,...n}){return r(u,{className:m(t,o=>i(j({variant:e}),o)),...n})}function D({label:t,description:e,errorMessage:n,children:o,requiredIndicator:d,htmlFor:l}){return a(c,{children:[t&&a(y,{htmlFor:l,children:[t,d&&r("sup",{className:"text-destructive",children:"*"})]}),o,e&&r(k,{children:e}),n&&r(w,{htmlFor:l,children:n})]})}function A({className:t,...e}){return r(g,{className:m(t,n=>i("btn btn-ghost h-input px-2 -me-2",n)),...e})}function H({className:t,onSubmit:e,...n}){return r("form",{className:i(t),onSubmit:o=>{o.preventDefault(),document?.activeElement?.blur(),e?.(o)},...n})}function P({className:t,...e}){return r(b,{className:i("gap-input",t),...e})}function R({className:t,...e}){return r(x,{children:r(h,{className:i(t,"!body-base text-muted"),...e})})}function q({className:t,...e}){return r("nav",{className:i("flex items-center justify-end bg-elevation-1 sticky bottom-0 z-50 py-icon px-icon border-t",t),...e})}function J({className:t,preview:e,...n}){return a("div",{className:"flex flex-col gap-icon lg:flex-row lg:items-start",children:[r("div",{className:i("grid grid-cols-1 gap-input mt-icon my-header w-full max-w-3xl",t),...n}),e&&r("div",{className:"lg:sticky lg:top-header lg:shrink-0",children:e})]})}export{B as FieldGroup,H as Form,q as FormActionFooter,D as FormField,A as FormFieldButton,k as FormFieldDescription,w as FormFieldError,y as FormFieldLabel,J as FormLayout,P as FormSection,R as FormSectionTitle,j as fieldGroupVariants,N as labelVariants};
1
+ "use client";import{jsxs as a,Fragment as c,jsx as r}from"react/jsx-runtime";import{cva as s}from"class-variance-authority";import{Label as u,Text as f,Group as p,composeRenderProps as m,Button as g}from"react-aria-components";import{classNames as i}from"../utilities/theme.js";import{Card as b,CardHeader as x,CardTitle as h}from"./card.js";import{IcInfo as v,IcError as F}from"./icons.js";import"clsx";import"@icons-pack/react-simple-icons";import"react";const N=s(["select-none body-sm font-medium leading-none","disabled-muted","group-data-[invalid]:text-destructive"]);function y({className:t,...e}){return r(u,{className:i(N(),t),...e})}function k({className:t,children:e,...n}){return a(f,{className:i("body-sm text-muted leading-tight",t),...n,slot:"description",children:[e,r(v,{className:"inline size-2 align-text-top ms-0.5"})]})}function w({className:t,children:e,...n}){return a("label",{role:"alert",className:i("body-sm leading-tight text-destructive duration-150 animate-in transition-transform slide-in-from-top-5 fade-in",t),...n,children:[e,r(F,{className:"inline size-2 align-text-top ms-0.5"})]})}const j=s("",{variants:{variant:{default:["relative flex w-full items-center overflow-hidden border border-input bg-elevation-mid input-dim ring-offset-background placeholder:text-muted-foreground","focus-ring","disabled-muted"],ghost:""}},defaultVariants:{variant:"default"}});function B({className:t,variant:e,...n}){return r(p,{className:m(t,o=>i(j({variant:e}),o)),...n})}function D({label:t,description:e,errorMessage:n,children:o,requiredIndicator:d,htmlFor:l}){return a(c,{children:[t&&a(y,{htmlFor:l,children:[t,d&&r("sup",{className:"text-destructive",children:"*"})]}),o,e&&r(k,{children:e}),n&&r(w,{htmlFor:l,children:n})]})}function A({className:t,...e}){return r(g,{className:m(t,n=>i("btn btn-ghost h-input px-2 -me-2",n)),...e})}function H({className:t,onSubmit:e,...n}){return r("form",{className:i(t),onSubmit:o=>{o.preventDefault(),document?.activeElement?.blur(),e?.(o)},...n})}function P({className:t,...e}){return r(b,{className:i("gap-input",t),...e})}function R({className:t,...e}){return r(x,{children:r(h,{className:i(t,"!body-base text-muted"),...e})})}function q({className:t,...e}){return r("nav",{className:i("flex items-center justify-end bg-elevation-1 sticky bottom-0 z-50 py-icon px-icon border-t",t),...e})}function J({className:t,preview:e,...n}){return a("div",{className:"flex flex-col gap-icon lg:flex-row lg:items-start",children:[r("div",{className:i("grid grid-cols-1 gap-input mt-icon my-header w-full max-w-3xl",t),...n}),e&&r("div",{className:"lg:sticky lg:top-header lg:shrink-0",children:e})]})}export{B as FieldGroup,H as Form,q as FormActionFooter,D as FormField,A as FormFieldButton,k as FormFieldDescription,w as FormFieldError,y as FormFieldLabel,J as FormLayout,P as FormSection,R as FormSectionTitle,j as fieldGroupVariants,N as labelVariants};
2
2
  //# sourceMappingURL=form.js.map
@@ -0,0 +1,6 @@
1
+ import { TagGroupProps as AriaTagGroupProps, TagListProps, TagProps as AriaTagProps } from 'react-aria-components';
2
+ export interface TagGroupProps<T extends object> extends Omit<AriaTagGroupProps, 'children' | 'className'>, Pick<TagListProps<T>, 'items' | 'children' | 'renderEmptyState' | 'className'> {
3
+ }
4
+ export type TagProps = AriaTagProps;
5
+ export declare function TagGroup<T extends object>({ items, children, renderEmptyState, className, ...props }: TagGroupProps<T>): import("react/jsx-runtime").JSX.Element;
6
+ export declare function Tag({ children, className, ...props }: TagProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,2 @@
1
+ "use client";import{jsx as r,jsxs as l,Fragment as p}from"react/jsx-runtime";import{Tag as c,composeRenderProps as i,TagGroup as d,TagList as u}from"react-aria-components";import{classNames as n}from"../utilities/theme.js";import{IcRemove as f}from"./icons.js";import{Button as g}from"./button.js";import"clsx";import"@icons-pack/react-simple-icons";import"react";import"class-variance-authority";import"./loader.js";const x="body-sm rounded-md inline-flex items-center gap-1 px-2 h-input-sm cursor-default select-none border";function B({items:e,children:s,renderEmptyState:a,className:m,...o}){return r(d,{className:"flex flex-col gap-2",selectionMode:"none",...o,children:r(u,{items:e,renderEmptyState:a,className:i(m,t=>n("flex flex-wrap gap-1",t)),children:s})})}function R({children:e,className:s,...a}){return r(c,{textValue:typeof e=="string"?e:void 0,className:i(s,(o,t)=>n(x,"bg-muted/10 text-muted",t.isDisabled&&"disabled-muted cursor-not-allowed",o)),...a,children:i(e,(o,{allowsRemoving:t})=>l(p,{children:[o,t&&r(g,{slot:"remove",size:"none",variant:"ghost",className:"rounded-full p-0.5",children:r(f,{"aria-hidden":!0,className:"size-icon"})})]}))})}export{R as Tag,B as TagGroup};
2
+ //# sourceMappingURL=tag-group.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tag-group.js","sources":["../../lib/components/tag-group.tsx"],"sourcesContent":["'use client';\n\nimport {\n Tag as AriaTag,\n TagGroup as AriaTagGroup,\n TagList,\n composeRenderProps,\n type TagGroupProps as AriaTagGroupProps,\n type TagListProps,\n type TagProps as AriaTagProps,\n} from 'react-aria-components';\n\nimport { classNames } from '../utilities/theme';\nimport { IcRemove } from './icons';\nimport { Button } from './button';\n\nconst tagBase = 'body-sm rounded-md inline-flex items-center gap-1 px-2 h-input-sm cursor-default select-none border';\n\nexport interface TagGroupProps<T extends object>\n extends Omit<AriaTagGroupProps, 'children' | 'className'>,\n Pick<TagListProps<T>, 'items' | 'children' | 'renderEmptyState' | 'className'> {}\n\nexport type TagProps = AriaTagProps;\n\nexport function TagGroup<T extends object>({\n items,\n children,\n renderEmptyState,\n className,\n ...props\n}: TagGroupProps<T>) {\n return (\n <AriaTagGroup className=\"flex flex-col gap-2\" selectionMode=\"none\" {...props}>\n <TagList\n items={items}\n renderEmptyState={renderEmptyState}\n className={composeRenderProps(className, className => classNames('flex flex-wrap gap-1', className))}\n >\n {children}\n </TagList>\n </AriaTagGroup>\n );\n}\n\nexport function Tag({ children, className, ...props }: TagProps) {\n const textValue = typeof children === 'string' ? children : undefined;\n\n return (\n <AriaTag\n textValue={textValue}\n className={composeRenderProps(className, (className, renderProps) =>\n classNames(\n tagBase,\n 'bg-muted/10 text-muted',\n renderProps.isDisabled && 'disabled-muted cursor-not-allowed',\n className\n )\n )}\n {...props}\n >\n {composeRenderProps(children, (children, { allowsRemoving }) => (\n <>\n {children}\n {allowsRemoving && (\n <Button slot=\"remove\" size=\"none\" variant=\"ghost\" className=\"rounded-full p-0.5\">\n <IcRemove aria-hidden className=\"size-icon\" />\n </Button>\n )}\n </>\n ))}\n </AriaTag>\n );\n}\n"],"names":["tagBase","TagGroup","items","children","renderEmptyState","className","props","AriaTagGroup","jsx","TagList","composeRenderProps","classNames","Tag","AriaTag","renderProps","allowsRemoving","jsxs","Fragment","Button","IcRemove"],"mappings":"iaAgBA,MAAMA,EAAU,sGAQT,SAASC,EAA2B,CACvC,MAAAC,EACA,SAAAC,EACA,iBAAAC,EACA,UAAAC,EACA,GAAGC,CACP,EAAqB,CACjB,SACKC,EAAA,CAAa,UAAU,sBAAsB,cAAc,OAAQ,GAAGD,EACnE,SAAAE,EAACC,EAAA,CACG,MAAAP,EACA,iBAAAE,EACA,UAAWM,EAAmBL,EAAWA,GAAaM,EAAW,uBAAwBN,CAAS,CAAC,EAElG,SAAAF,CAAA,CAAA,EAET,CAER,CAEO,SAASS,EAAI,CAAE,SAAAT,EAAU,UAAAE,EAAW,GAAGC,GAAmB,CAG7D,OACIE,EAACK,EAAA,CACG,UAJU,OAAOV,GAAa,SAAWA,EAAW,OAKpD,UAAWO,EAAmBL,EAAW,CAACA,EAAWS,IACjDH,EACIX,EACA,yBACAc,EAAY,YAAc,oCAC1BT,CAAA,CACJ,EAEH,GAAGC,EAEH,WAAmBH,EAAU,CAACA,EAAU,CAAE,eAAAY,CAAA,IACvCC,EAAAC,EAAA,CACK,SAAA,CAAAd,EACAY,GACGP,EAACU,EAAA,CAAO,KAAK,SAAS,KAAK,OAAO,QAAQ,QAAQ,UAAU,qBACxD,SAAAV,EAACW,EAAA,CAAS,cAAW,GAAC,UAAU,YAAY,CAAA,CAChD,CAAA,EAER,CACH,CAAA,CAAA,CAGb"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cryptlex/web-components",
3
- "version": "6.6.62",
3
+ "version": "6.6.64",
4
4
  "description": "React component library for Cryptlex web applications",
5
5
  "author": "Cryptlex",
6
6
  "type": "module",