stofli-ui
Version:
Biblioteca moderna de componentes UI para React con Tailwind CSS y Framer Motion
4 lines (3 loc) • 7.58 kB
JavaScript
'use client';
"use strict";var e=require("react/jsx-runtime"),r=require("react"),i=require("framer-motion"),a=require("clsx"),t=require("tailwind-merge");function o(e,r,i){if(i||2===arguments.length)for(var a,t=0,o=r.length;t<o;t++)!a&&t in r||(a||(a=Array.prototype.slice.call(r,0,t)),a[t]=r[t]);return e.concat(a||Array.prototype.slice.call(r))}function l(){for(var e=[],r=0;r<arguments.length;r++)e[r]=arguments[r];return t.twMerge(a.clsx(e))}"function"==typeof SuppressedError&&SuppressedError;module.exports=function(a){var t=a.checked,n=void 0!==t&&t,c=a.onChange,s=a.disabled,d=void 0!==s&&s,b=a.size,g=void 0===b?"md":b,v=a.variant,p=void 0===v?"default":v,u=a.label,h=a.labelPosition,f=void 0===h?"right":h,x=a.required,k=void 0!==x&&x,m=a.name,w=a.className,y=void 0===w?"":w,z=a.circleClassName,C=void 0===z?"":z,N=a.activeCircleClassName,j=void 0===N?"":N,B=a.inactiveCircleClassName,S=void 0===B?"":B,q=a.labelClassName,H=void 0===q?"":q,L=a.wrapperClassName,X=void 0===L?"":L,W=a.activeWrapperClassName,E=void 0===W?"":W,A=a.inactiveWrapperClassName,I=void 0===A?"":A,F=a.iconClassName,M=void 0===F?"":F,P=a.id,T=a.icon,D=void 0!==T&&T,G=a.iconType,J=void 0===G?"check":G,K=a.ariaLabel,O=a.description,Q=a.descriptionId,R=r.useState(n),U=R[0],V=R[1],Y=r.useId(),Z=P||"switch-".concat(Y.replace(/:/g,"")),$=Q||(O?"desc-".concat(Z):void 0);r.useEffect((function(){V(n)}),[n]);var _,ee={sm:{wrapper:"h-4 w-7",circle:"h-3 w-3",iconSize:"h-2 w-2",label:"text-sm",padding:"px-0.5",translateX:{on:"14px",off:"0px"},top:"top-[2px]"},md:{wrapper:"h-5 w-10",circle:"h-4 w-4",iconSize:"h-2.5 w-2.5",label:"text-base",padding:"px-0.5",translateX:{on:"20px",off:"0px"},top:"top-[2px]"},lg:{wrapper:"h-7 w-14",circle:"h-6 w-6",iconSize:"h-3.5 w-3.5",label:"text-lg",padding:"px-0.5",translateX:{on:"28px",off:"0px"},top:"top-[2px]"}},re={default:{bg:"bg-zinc-200 dark:bg-zinc-800",activeBg:"bg-zinc-600 dark:bg-zinc-400",circle:"bg-white dark:bg-zinc-200",activeCircle:"bg-white dark:bg-white",icon:"text-neutral-700 dark:text-neutral-800",hover:"hover:border-zinc-300 dark:hover:border-zinc-600",activeHover:"hover:bg-zinc-700 dark:hover:bg-zinc-500",label:"text-neutral-900 dark:text-neutral-100"},primary:{bg:"bg-blue-200 dark:bg-blue-950",activeBg:"bg-blue-500 dark:bg-blue-500",circle:"bg-white dark:bg-zinc-200",activeCircle:"bg-white dark:bg-white",icon:"text-blue-600 dark:text-blue-600",hover:"hover:border-blue-300 dark:hover:border-blue-700",activeHover:"hover:bg-blue-600 dark:hover:bg-blue-600",label:"text-blue-600 dark:text-blue-300"},secondary:{bg:"bg-purple-200 dark:bg-purple-950",activeBg:"bg-purple-500 dark:bg-purple-500",circle:"bg-white dark:bg-zinc-200",activeCircle:"bg-white dark:bg-white",icon:"text-purple-600 dark:text-purple-600",hover:"hover:border-purple-300 dark:hover:border-purple-700",activeHover:"hover:bg-purple-600 dark:hover:bg-purple-600",label:"text-purple-600 dark:text-purple-300"},success:{bg:"bg-green-200 dark:bg-green-950",activeBg:"bg-green-500 dark:bg-green-500",circle:"bg-white dark:bg-zinc-200",activeCircle:"bg-white dark:bg-white",icon:"text-green-600 dark:text-green-600",hover:"hover:border-green-300 dark:hover:border-green-700",activeHover:"hover:bg-green-600 dark:hover:bg-green-600",label:"text-green-600 dark:text-green-300"},warning:{bg:"bg-amber-200 dark:bg-amber-950",activeBg:"bg-amber-500 dark:bg-amber-500",circle:"bg-white dark:bg-zinc-200",activeCircle:"bg-white dark:bg-white",icon:"text-amber-600 dark:text-amber-600",hover:"hover:border-amber-300 dark:hover:border-amber-700",activeHover:"hover:bg-amber-600 dark:hover:bg-amber-600",label:"text-amber-600 dark:text-amber-300"},danger:{bg:"bg-red-200 dark:bg-red-950",activeBg:"bg-red-500 dark:bg-red-500",circle:"bg-white dark:bg-zinc-200",activeCircle:"bg-white dark:bg-white",icon:"text-red-600 dark:text-red-600",hover:"hover:border-red-300 dark:hover:border-red-700",activeHover:"hover:bg-red-600 dark:hover:bg-red-600",label:"text-red-600 dark:text-red-300"}},ie=function(){if(!d){var e=!U;V(e),null==c||c(e)}};return e.jsxs("div",{className:l("flex items-center gap-2","left"===f?"flex-row-reverse":"flex-row",y),children:[u&&e.jsxs("label",{htmlFor:Z,className:l(ee[g].label,re[p].label,d?"opacity-50 cursor-not-allowed":"cursor-pointer",H),children:[u,k&&e.jsx("span",{className:"text-red-500 ml-1",children:"*"})]}),e.jsxs("div",{className:l("relative inline-flex flex-shrink-0 items-center",X),children:[e.jsx("input",{type:"checkbox",role:"switch",id:Z,name:m,className:l("sr-only peer",{sm:"focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-offset-white dark:focus-visible:ring-offset-zinc-900",md:"focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-zinc-900",lg:"focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-zinc-900"}[g],{default:"focus-visible:ring-zinc-500 dark:focus-visible:ring-zinc-400",primary:"focus-visible:ring-blue-500 dark:focus-visible:ring-blue-400",secondary:"focus-visible:ring-purple-500 dark:focus-visible:ring-purple-400",success:"focus-visible:ring-green-500 dark:focus-visible:ring-green-400",warning:"focus-visible:ring-amber-500 dark:focus-visible:ring-amber-400",danger:"focus-visible:ring-red-500 dark:focus-visible:ring-red-400"}[p]),checked:U,onChange:ie,disabled:d,required:k,"aria-checked":U,"aria-label":u?void 0:K,"aria-labelledby":u?Z:void 0,"aria-describedby":$}),e.jsxs("div",{className:(_=[ee[g].wrapper,ee[g].padding,"rounded-full",d?"opacity-50 cursor-not-allowed":"cursor-pointer","transition-all duration-300 ease-out relative overflow-hidden"],U?E?l.apply(void 0,o(o([],_,!1),[E],!1)):l.apply(void 0,o(o([],_,!1),[re[p].activeBg,!d&&re[p].activeHover,X],!1)):I?l.apply(void 0,o(o([],_,!1),[I],!1)):l.apply(void 0,o(o([],_,!1),[re[p].bg,!d&&re[p].hover,X],!1))),onClick:ie,"aria-hidden":"true",children:[!E&&!I&&e.jsx(i.motion.div,{className:l("absolute inset-0",re[p].activeBg),initial:{opacity:0},animate:{opacity:U?1:0},transition:{duration:.3,ease:[.4,0,.2,1]},"aria-hidden":"true"}),e.jsx(i.motion.div,{className:function(){var e=[ee[g].circle,"rounded-full shadow-md flex items-center justify-center z-10","absolute left-0.5",ee[g].top];return U?j?l.apply(void 0,o(o([],e,!1),[C,j],!1)):l.apply(void 0,o(o([],e,!1),[re[p].activeCircle,C],!1)):S?l.apply(void 0,o(o([],e,!1),[C,S],!1)):l.apply(void 0,o(o([],e,!1),[re[p].circle,C],!1))}(),initial:!1,animate:{x:U?ee[g].translateX.on:ee[g].translateX.off},transition:{type:"spring",stiffness:500,damping:30},"aria-hidden":"true",children:D&&"none"!==J?"check"===J?e.jsx(i.motion.svg,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round",className:l(ee[g].iconSize,U?re[p].icon:"text-transparent",M),initial:{opacity:0,scale:0},animate:{opacity:U?1:0,scale:U?1:0},transition:{duration:.3,ease:[.4,0,.2,1]},children:e.jsx("polyline",{points:"20 6 9 17 4 12"})}):e.jsxs(i.motion.svg,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round",className:l(ee[g].iconSize,U?"text-transparent":re[p].icon,M),initial:{opacity:0,scale:0},animate:{opacity:U?0:1,scale:U?0:1},transition:{duration:.3,ease:[.4,0,.2,1]},children:[e.jsx("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),e.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]}):null})]})]}),O&&e.jsx("div",{id:$,className:"sr-only",children:O})]})};
//# sourceMappingURL=index.js.map