stofli-ui
Version:
Biblioteca moderna de componentes UI para React con Tailwind CSS y Framer Motion
4 lines (3 loc) • 6.72 kB
JavaScript
'use client';
import{jsx as e,jsxs as r}from"react/jsx-runtime";import t,{useState as o,useRef as n,useCallback as i,useEffect as a,useId as d,useContext as s}from"react";import{X as c}from"lucide-react";import{AnimatePresence as l,motion as u}from"framer-motion";import{clsx as m}from"clsx";import{twMerge as f}from"tailwind-merge";var v=function(){return v=Object.assign||function(e){for(var r,t=1,o=arguments.length;t<o;t++)for(var n in r=arguments[t])Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n]);return e},v.apply(this,arguments)};function b(e,r,t){if(t||2===arguments.length)for(var o,n=0,i=r.length;n<i;n++)!o&&n in r||(o||(o=Array.prototype.slice.call(r,0,n)),o[n]=r[n]);return e.concat(o||Array.prototype.slice.call(r))}function p(){for(var e=[],r=0;r<arguments.length;r++)e[r]=arguments[r];return f(m(e))}"function"==typeof SuppressedError&&SuppressedError;var h=function(t){var d=t.open,s=t.defaultOpen,m=void 0!==s&&s,f=t.onOpenChange,v=t.title,b=t.description,h=t.variant,g=void 0===h?"default":h,k=t.position,x=void 0===k?"bottom-right":k,y=t.duration,w=void 0===y?5e3:y,N=t.showCloseButton,E=void 0===N||N,C=t.className,I=void 0===C?"":C,z=t.children,T=t.icon,L=t.containerClassName,O=void 0===L?"":L,P=t.toastClassName,j=void 0===P?"":P,S=t.titleClassName,A=void 0===S?"":S,B=t.descriptionClassName,F=void 0===B?"":B,V=t.iconContainerClassName,Y=void 0===V?"":V,_=t.contentClassName,D=void 0===_?"":_,H=t.closeButtonClassName,K=void 0===H?"":H,W=t.role,q=void 0===W?"status":W,G=t.important,J=void 0!==G&&G,M=o(m),Q=M[0],R=M[1],U=o(!1),X=U[0],Z=U[1],$=n(null),ee=i((function(){R(!1),null==f||f(!1)}),[f]);a((function(){void 0!==d&&R(d)}),[d]),a((function(){return Z(!0),function(){return Z(!1)}}),[]),a((function(){if(Q&&w!==Number.POSITIVE_INFINITY){var e,r=function(){e=setTimeout((function(){ee()}),w)};r();var t=function(){return clearTimeout(e)},o=function(){return r()},n=function(){return clearTimeout(e)},i=function(){return r()},a=$.current;return a&&(a.addEventListener("focus",t,!0),a.addEventListener("blur",o,!0),a.addEventListener("mouseenter",n),a.addEventListener("mouseleave",i)),function(){clearTimeout(e),a&&(a.removeEventListener("focus",t,!0),a.removeEventListener("blur",o,!0),a.removeEventListener("mouseenter",n),a.removeEventListener("mouseleave",i))}}}),[Q,w,ee]);var re,te=i((function(e){"Escape"===e.key&&ee()}),[ee]),oe={hidden:{opacity:0,y:x.includes("top")?-20:20,scale:.9},visible:{opacity:1,y:0,scale:1,transition:{duration:.3,ease:"easeOut"}},exit:{opacity:0,y:x.includes("top")?-20:20,scale:.9,transition:{duration:.2,ease:"easeIn"}}};return X?e(l,{children:Q&&e(u.div,{className:O||p("max-w-sm",I),initial:"hidden",animate:"visible",exit:"exit",variants:oe,ref:$,tabIndex:0,role:q,"aria-atomic":"true","aria-live":J?"assertive":"polite","aria-label":(re=v||"","".concat({default:"",primary:"Información: ",secondary:"Nota: ",success:"Éxito: ",warning:"Advertencia: ",danger:"Error: "}[g]).concat(re)),onKeyDown:te,children:e("div",{className:p("rounded-lg border px-4 py-3 shadow-lg",j?"":{default:"bg-gradient-to-r from-zinc-200 to-zinc-300 dark:from-zinc-800/90 dark:to-zinc-700/90 text-neutral-800 dark:text-neutral-100 border border-zinc-300 dark:border-zinc-700/50 backdrop-blur-sm shadow-sm",primary:"bg-gradient-to-r from-blue-400 to-blue-500 dark:from-blue-800/90 dark:to-blue-700/90 text-white dark:text-blue-50 border border-blue-400 dark:border-blue-700/50 backdrop-blur-sm shadow-sm",secondary:"bg-gradient-to-r from-purple-400 to-purple-500 dark:from-purple-800/90 dark:to-purple-700/90 text-white dark:text-purple-50 border border-purple-400 dark:border-purple-700/50 backdrop-blur-sm shadow-sm",success:"bg-gradient-to-r from-green-400 to-green-500 dark:from-green-800/90 dark:to-green-700/90 text-white dark:text-green-50 border border-green-400 dark:border-green-700/50 backdrop-blur-sm shadow-sm",warning:"bg-gradient-to-r from-amber-400 to-amber-500 dark:from-amber-800/90 dark:to-amber-700/90 text-white dark:text-amber-50 border border-amber-400 dark:border-amber-700/50 backdrop-blur-sm shadow-sm",danger:"bg-gradient-to-r from-red-400 to-red-500 dark:from-red-800/90 dark:to-red-700/90 text-white dark:text-red-50 border border-red-400 dark:border-red-700/50 backdrop-blur-sm shadow-sm"}[g],j),children:r("div",{className:p("flex items-start gap-3"),children:[T&&e("div",{className:p("shrink-0 mt-0.5",Y),"aria-hidden":"true",children:T}),r("div",{className:p("flex-1 mr-2",D),children:[v&&e("h4",{className:p("font-medium mb-1",A),children:v}),b&&e("p",{className:p("text-sm opacity-90",F),children:b}),z]}),E&&e("button",{onClick:ee,className:p("shrink-0 opacity-70 hover:opacity-100 transition-opacity p-1 rounded-full","hover:bg-white/20","focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-white","dark:focus-visible:ring-offset-zinc-900 focus-visible:ring-zinc-500","dark:focus-visible:ring-zinc-400 outline-none",K),"aria-label":"Cerrar",children:e(c,{className:"h-4 w-4"})})]})})})}):null},g=t.createContext(void 0),k=function(t){var n=t.children,i=t.containerClassName,s=o([]),c=s[0],l=s[1],u=d(),m=function(e){l(e?function(r){return r.filter((function(r){return r.id!==e}))}:[])},f={};c.forEach((function(e){var r=e.position||"bottom-right";f[r]||(f[r]=[]),f[r].push(e)}));var k={"top-left":"top-4 left-4","top-right":"top-4 right-4","bottom-left":"bottom-4 left-4","bottom-right":"bottom-4 right-4","top-center":"top-4 left-1/2 -translate-x-1/2","bottom-center":"bottom-4 left-1/2 -translate-x-1/2"};return a((function(){var e=function(e){if("Escape"===e.key&&c.length>0){var r=c[c.length-1].id;m(r)}};return document.addEventListener("keydown",e),function(){return document.removeEventListener("keydown",e)}}),[c]),r(g.Provider,{value:{open:function(e){var r="toast-".concat(u,"-").concat(c.length),t=e.role||"status";if(e.role||"danger"!==e.variant&&"warning"!==e.variant||(t="alert"),l((function(o){return b(b([],o,!0),[v(v({},e),{id:r,open:!0,role:t})],!1)})),e.duration!==Number.POSITIVE_INFINITY){var o=e.duration||5e3;setTimeout((function(){m(r)}),o)}},close:m},children:[n,Object.entries(f).map((function(r){var t=r[0],o=r[1],n=t.startsWith("bottom")?b([],o,!0).reverse():o;return e("div",{className:p("fixed z-50 flex flex-col gap-2",k[t],i),style:{maxHeight:"100vh",overflow:"hidden"},children:n.map((function(r,t){return e("div",{className:"relative",style:{zIndex:n.length-t},children:e(h,v({},r,{onOpenChange:function(){return m(r.id)},className:"shadow-lg"}))},r.id)}))},t)}))]})},x=function(){var e=s(g);if(void 0===e)throw new Error("useToast debe usarse dentro de un ToastProvider");return e};export{h as Toast,k as ToastProvider,x as useToast};
//# sourceMappingURL=index.esm.js.map