@achs/webkit
Version:
Conjunto de componentes de UI con el estilo del Sistema de Diseño ACHS (Asociación Chilena de Seguridad), para reutilizar de forma transversal en las aplicaciones web de ACHS. Construido con **React 19**, **TypeScript** y **Vite**, con soporte para las
49 lines (48 loc) • 1.69 kB
JavaScript
import { jsxs as x, jsx as a } from "react/jsx-runtime";
import { useState as N, useRef as w, useEffect as v, createContext as C, useContext as g } from "react";
import { Toast as T } from "../../components/atoms/Toast/index.mjs";
import u from "../../components/atoms/Toast/Toast.module.scss.mjs";
const f = C(void 0), b = ({ children: i }) => {
const [d, n] = N([]), r = w([]), s = (o, e) => {
const t = setTimeout(o, e);
return r.current.push(t), t;
};
v(() => () => {
r.current.forEach(clearTimeout), r.current = [];
}, []);
const m = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, c = (o) => {
n(
(e) => e.map((t) => t.id === o ? { ...t, show: !1 } : t)
), s(() => {
n((e) => e.filter((t) => t.id !== o));
}, 300);
}, h = (o) => {
const e = m(), t = o.duration ?? 5e3;
n((p) => [
...p,
{
...o,
id: e,
show: !0,
onClose: () => c(e)
// Eliminar después de la animación
}
]), t > 0 && s(() => c(e), t);
}, l = d.reduce((o, e) => {
const t = e.position || "top-right";
return o[t] = o[t] || [], o[t].push(e), o;
}, {});
return /* @__PURE__ */ x(f.Provider, { value: { showNotification: h }, children: [
i,
Object.entries(l).map(([o, e]) => /* @__PURE__ */ a("div", { className: `${u["notification-container"]} ${u[o]}`, children: e.map((t) => /* @__PURE__ */ a(T, { ...t, standalone: !1 }, t.id)) }, o))
] });
}, k = () => {
const i = g(f);
if (!i)
throw new Error("useNotificationContext must be used within a NotificationProvider");
return i;
};
export {
b as NotificationProvider,
k as useNotificationContext
};