stofli-ui/dist/components/checkbox/index.js

Biblioteca moderna de componentes UI para React con Tailwind CSS y Framer Motion

'use client';
"use strict";var e=require("react/jsx-runtime"),r=require("react"),a=require("framer-motion"),d=require("clsx"),i=require("tailwind-merge");function n(){for(var e=[],r=0;r<arguments.length;r++)e[r]=arguments[r];return i.twMerge(d.clsx(e))}module.exports=function(d){var i=d.checked,t=d.defaultChecked,o=void 0!==t&&t,l=d.disabled,c=void 0!==l&&l,s=d.required,b=void 0!==s&&s,u=d.label,h=d.name,g=d.value,k=d.size,m=void 0===k?"md":k,v=d.variant,p=void 0===v?"default":v,x=d.className,f=void 0===x?"":x,w=d.wrapperClassName,y=void 0===w?"":w,z=d.checkboxClassName,j=void 0===z?"":z,N=d.labelClassName,q=void 0===N?"":N,C=d.onChange,L=d.radius,O=void 0===L?"md":L,D=d.id,I=d.ariaLabel,M=d.ariaDescribedBy,B=d.errorMessage,E=r.useId(),F="checkbox-".concat(E.replace(/:/g,"")),K=D||F,P="".concat(K,"-error"),S=r.useState(void 0===i?o:i),T=S[0],W=S[1];r.useEffect((function(){void 0!==i&&W(i)}),[i]);var A=function(){if(!c){var e=!T;void 0===i&&W(e),null==C||C(e)}},G=n("inline-flex items-center",!c&&"cursor-pointer",y),H=n({sm:"h-4 w-4",md:"h-5 w-5",lg:"h-6 w-6"}[m],"border-2",{none:"rounded-none",sm:"rounded-[0.25rem]",md:"rounded-[0.375rem]",full:"rounded-full"}[O],"flex items-center justify-center","focus-visible:ring-2 focus-visible:ring-offset-2",T?{default:"bg-zinc-400 dark:bg-zinc-800 border-zinc-400 dark:border-zinc-800 text-neutral-50 dark:text-neutral-200",primary:"bg-blue-400 dark:bg-blue-800 border-blue-400 dark:border-blue-800 text-white ring-2 ring-blue-100 dark:ring-blue-900/20",secondary:"bg-purple-400 dark:bg-purple-800 border-purple-400 dark:border-purple-800 text-white ring-2 ring-purple-100 dark:ring-purple-900/20",success:"bg-green-400 dark:bg-green-800 border-green-400 dark:border-green-800 text-white ring-2 ring-green-100 dark:ring-green-900/20",warning:"bg-amber-400 dark:bg-amber-800 border-amber-400 dark:border-amber-800 text-white ring-2 ring-amber-100 dark:ring-amber-900/20",danger:"bg-red-400 dark:bg-red-800 border-red-400 dark:border-red-800 text-white ring-2 ring-red-100 dark:ring-red-900/20"}[p]:{default:"border-zinc-400 dark:border-zinc-800 bg-white dark:bg-zinc-900 hover:border-zinc-800 dark:hover:border-zinc-600",primary:"border-blue-400 dark:border-blue-800 bg-white dark:bg-zinc-900 hover:border-blue-600 dark:hover:border-blue-500",secondary:"border-purple-400 dark:border-purple-800 bg-white dark:bg-zinc-900 hover:border-purple-600 dark:hover:border-purple-500",success:"border-green-400 dark:border-green-800 bg-white dark:bg-zinc-900 hover:border-green-600 dark:hover:border-green-500",warning:"border-amber-400 dark:border-amber-800 bg-white dark:bg-zinc-900 hover:border-amber-600 dark:hover:border-amber-500",danger:"border-red-400 dark:border-red-800 bg-white dark:bg-zinc-900 hover:border-red-600 dark:hover:border-red-500"}[p],c&&"cursor-not-allowed opacity-50",B&&"border-red-500 dark:border-red-400",j),J=n("ml-2",{sm:"text-sm",md:"text-base",lg:"text-lg"}[m],c?"text-neutral-400 dark:text-neutral-600":"text-neutral-900 dark:text-neutral-100",q),Q=n("w-[80%] h-[80%]","default"===p?"text-white dark:text-neutral-200":"text-white",f);return e.jsxs("div",{className:G,onClick:A,onKeyDown:function(e){" "!==e.key&&"Enter"!==e.key||(e.preventDefault(),A())},role:"checkbox","aria-checked":T,tabIndex:c?-1:0,"aria-disabled":c,"aria-required":b,"aria-label":I||u,"aria-describedby":n(B?P:null,M),"aria-invalid":!!B,children:[e.jsxs("div",{className:"relative",role:"presentation",children:[e.jsx("input",{type:"checkbox",id:K,className:"sr-only",checked:T,disabled:c,required:b,name:h,value:g,onChange:function(e){if(!c){var r=e.target.checked;void 0===i&&W(r),null==C||C(r)}},tabIndex:-1}),e.jsx(a.motion.div,{className:H,variants:{checked:{scale:[1,1.1,1],transition:{duration:.2,ease:[.4,0,.2,1]}},unchecked:{scale:1,transition:{duration:.2,ease:[.4,0,.2,1]}}},initial:"unchecked",animate:T?"checked":"unchecked",whileTap:c?void 0:{scale:.95},role:"presentation",children:e.jsx(a.motion.svg,{className:Q,viewBox:"0 0 24 24","aria-hidden":"true",children:e.jsx(a.motion.path,{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:4,d:"M4 12l5 5L20 7",variants:{checked:{pathLength:1,opacity:1,transition:{pathLength:{duration:.2,ease:"easeOut"},opacity:{duration:.15,ease:"easeOut"}}},unchecked:{pathLength:0,opacity:0,transition:{pathLength:{duration:.2,ease:"easeOut",delay:.05},opacity:{duration:.2,ease:"easeOut"}}}},initial:"unchecked",animate:T?"checked":"unchecked"})})})]}),u&&e.jsxs("label",{htmlFor:K,className:J,onClick:function(e){return e.stopPropagation()},children:[u,b&&e.jsx("span",{className:"text-red-500 ml-0.5","aria-hidden":"true",children:"*"}),b&&e.jsx("span",{className:"sr-only",children:"(requerido)"})]}),B&&e.jsx("div",{id:P,role:"alert",className:"text-red-500 dark:text-red-400 text-sm mt-1",children:B})]})};
//# sourceMappingURL=index.js.map