@glob-ui/toast 0.0.0-stage → 0.2.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Kevin Martínez E
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,17 @@
-# Temporary Holding Version
+# @glob-ui/toast
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Short, timed messages. Call `toast()` from anywhere, and mount `<Toaster />` once.
+
+## Install
+
+```bash
+pnpm add @glob-ui/toast
+```
+
+## Documentation
+
+Full docs, examples and the accessibility table: [Toast](https://github.com/kevin-martineze/GlobUI/tree/main/apps/docs/content/docs/components/toast.mdx).
+
+## License
+
+MIT. See [LICENSE](./LICENSE).

package/dist/index.d.mts

@@ -0,0 +1,20 @@
+export { ToastAction, ToastContent, ToastData, ToastExtraOptions, ToastOptions, ToastSettings, ToastVariant, toast } from './store.mjs';
+import * as react from 'react';
+
+type ToasterPosition = "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
+interface ToasterProps {
+    position?: ToasterPosition;
+    /** Toasts on screen at once. The rest wait in a queue. */
+    max?: number;
+    /** Accessible name of each toast's close button. */
+    closeLabel?: string;
+    /** Accessible name of the notification list. */
+    label?: string;
+    className?: string;
+}
+declare function Toaster({ position, max, closeLabel, label, className, }: ToasterProps): react.ReactPortal | null;
+declare namespace Toaster {
+    var displayName: string;
+}
+
+export { Toaster, type ToasterPosition, type ToasterProps };

package/dist/index.d.ts

@@ -0,0 +1,20 @@
+export { ToastAction, ToastContent, ToastData, ToastExtraOptions, ToastOptions, ToastSettings, ToastVariant, toast } from './store.js';
+import * as react from 'react';
+
+type ToasterPosition = "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
+interface ToasterProps {
+    position?: ToasterPosition;
+    /** Toasts on screen at once. The rest wait in a queue. */
+    max?: number;
+    /** Accessible name of each toast's close button. */
+    closeLabel?: string;
+    /** Accessible name of the notification list. */
+    label?: string;
+    className?: string;
+}
+declare function Toaster({ position, max, closeLabel, label, className, }: ToasterProps): react.ReactPortal | null;
+declare namespace Toaster {
+    var displayName: string;
+}
+
+export { Toaster, type ToasterPosition, type ToasterProps };

package/dist/index.js

@@ -0,0 +1,34 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  Toaster: () => import_toaster.Toaster,
+  toast: () => import_store.toast
+});
+module.exports = __toCommonJS(src_exports);
+var import_store = require("./store.js");
+var import_toaster = require("./toaster.js");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Toaster,
+  toast
+});
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["// No \"use client\" here: `toast()` stays callable from server code (as a no-op).\n// The Toaster is a separate client module; see tsup.config.ts.\nexport { toast } from \"./store\"\nexport type { ToastOptions, ToastExtraOptions, ToastSettings, ToastContent, ToastAction, ToastVariant, ToastData } from \"./store\"\nexport { Toaster } from \"./toaster\"\nexport type { ToasterProps, ToasterPosition } from \"./toaster\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAsB;AAEtB,qBAAwB;","names":[]}

package/dist/index.mjs

@@ -0,0 +1,8 @@
+// src/index.ts
+import { toast } from "./store.mjs";
+import { Toaster } from "./toaster.mjs";
+export {
+  Toaster,
+  toast
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["// No \"use client\" here: `toast()` stays callable from server code (as a no-op).\n// The Toaster is a separate client module; see tsup.config.ts.\nexport { toast } from \"./store\"\nexport type { ToastOptions, ToastExtraOptions, ToastSettings, ToastContent, ToastAction, ToastVariant, ToastData } from \"./store\"\nexport { Toaster } from \"./toaster\"\nexport type { ToasterProps, ToasterPosition } from \"./toaster\"\n"],"mappings":";AAEA,SAAS,aAAa;AAEtB,SAAS,eAAe;","names":[]}

package/dist/store.d.mts

@@ -0,0 +1,71 @@
+type ToastVariant = "default" | "success" | "warning" | "danger" | "info";
+interface ToastAction {
+    label: React.ReactNode;
+    /** Call `event.preventDefault()` to keep the toast open after the click. */
+    onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;
+}
+interface ToastSettings {
+    /** Reuse an id to update a toast in place instead of adding a new one. */
+    id?: string;
+    variant?: ToastVariant;
+    /** Time on screen in ms. `Infinity` keeps it until dismissed. Default 5000. */
+    duration?: number;
+    action?: ToastAction;
+}
+/** A toast needs a title, a description, or both. */
+type ToastContent = {
+    title: React.ReactNode;
+    description?: React.ReactNode;
+} | {
+    title?: React.ReactNode;
+    description: React.ReactNode;
+};
+/** Options for `toast(options)`. */
+type ToastOptions = ToastSettings & ToastContent;
+/** Options for `toast(title, options)`: everything except the title. */
+type ToastExtraOptions = ToastSettings & {
+    description?: React.ReactNode;
+};
+interface ToastData extends ToastSettings {
+    id: string;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    variant: ToastVariant;
+    duration: number;
+    /** Increments on every update, so timers restart. */
+    version: number;
+    /** Playing the exit animation; removed shortly after. */
+    leaving: boolean;
+}
+/** Matches the exit transition in the Toaster. */
+declare const EXIT_MS = 200;
+declare function subscribe(listener: () => void): () => void;
+declare function getSnapshot(): ToastData[];
+declare function getServerSnapshot(): ToastData[];
+declare function dismiss(id?: string): void;
+declare function show(title: string, opts?: ToastExtraOptions): string;
+declare function show(opts: ToastOptions): string;
+interface VariantShortcut {
+    (title: string, opts?: Omit<ToastExtraOptions, "variant">): string;
+    (opts: Omit<ToastSettings, "variant"> & ToastContent): string;
+}
+/**
+ * Shows a toast and returns its id. Needs a mounted `<Toaster />` to be visible.
+ * Safe to call anywhere; on the server it does nothing.
+ */
+declare const toast: typeof show & {
+    success: VariantShortcut;
+    error: VariantShortcut;
+    warning: VariantShortcut;
+    info: VariantShortcut;
+    /** Dismisses one toast, or all of them without an id. */
+    dismiss: typeof dismiss;
+};
+/** @internal Used by the Toaster. */
+declare const toastStore: {
+    subscribe: typeof subscribe;
+    getSnapshot: typeof getSnapshot;
+    getServerSnapshot: typeof getServerSnapshot;
+};
+
+export { EXIT_MS, type ToastAction, type ToastContent, type ToastData, type ToastExtraOptions, type ToastOptions, type ToastSettings, type ToastVariant, getServerSnapshot, getSnapshot, subscribe, toast, toastStore };

package/dist/store.d.ts

@@ -0,0 +1,71 @@
+type ToastVariant = "default" | "success" | "warning" | "danger" | "info";
+interface ToastAction {
+    label: React.ReactNode;
+    /** Call `event.preventDefault()` to keep the toast open after the click. */
+    onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;
+}
+interface ToastSettings {
+    /** Reuse an id to update a toast in place instead of adding a new one. */
+    id?: string;
+    variant?: ToastVariant;
+    /** Time on screen in ms. `Infinity` keeps it until dismissed. Default 5000. */
+    duration?: number;
+    action?: ToastAction;
+}
+/** A toast needs a title, a description, or both. */
+type ToastContent = {
+    title: React.ReactNode;
+    description?: React.ReactNode;
+} | {
+    title?: React.ReactNode;
+    description: React.ReactNode;
+};
+/** Options for `toast(options)`. */
+type ToastOptions = ToastSettings & ToastContent;
+/** Options for `toast(title, options)`: everything except the title. */
+type ToastExtraOptions = ToastSettings & {
+    description?: React.ReactNode;
+};
+interface ToastData extends ToastSettings {
+    id: string;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    variant: ToastVariant;
+    duration: number;
+    /** Increments on every update, so timers restart. */
+    version: number;
+    /** Playing the exit animation; removed shortly after. */
+    leaving: boolean;
+}
+/** Matches the exit transition in the Toaster. */
+declare const EXIT_MS = 200;
+declare function subscribe(listener: () => void): () => void;
+declare function getSnapshot(): ToastData[];
+declare function getServerSnapshot(): ToastData[];
+declare function dismiss(id?: string): void;
+declare function show(title: string, opts?: ToastExtraOptions): string;
+declare function show(opts: ToastOptions): string;
+interface VariantShortcut {
+    (title: string, opts?: Omit<ToastExtraOptions, "variant">): string;
+    (opts: Omit<ToastSettings, "variant"> & ToastContent): string;
+}
+/**
+ * Shows a toast and returns its id. Needs a mounted `<Toaster />` to be visible.
+ * Safe to call anywhere; on the server it does nothing.
+ */
+declare const toast: typeof show & {
+    success: VariantShortcut;
+    error: VariantShortcut;
+    warning: VariantShortcut;
+    info: VariantShortcut;
+    /** Dismisses one toast, or all of them without an id. */
+    dismiss: typeof dismiss;
+};
+/** @internal Used by the Toaster. */
+declare const toastStore: {
+    subscribe: typeof subscribe;
+    getSnapshot: typeof getSnapshot;
+    getServerSnapshot: typeof getServerSnapshot;
+};
+
+export { EXIT_MS, type ToastAction, type ToastContent, type ToastData, type ToastExtraOptions, type ToastOptions, type ToastSettings, type ToastVariant, getServerSnapshot, getSnapshot, subscribe, toast, toastStore };

package/dist/store.js

@@ -0,0 +1,115 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/store.ts
+var store_exports = {};
+__export(store_exports, {
+  EXIT_MS: () => EXIT_MS,
+  getServerSnapshot: () => getServerSnapshot,
+  getSnapshot: () => getSnapshot,
+  subscribe: () => subscribe,
+  toast: () => toast,
+  toastStore: () => toastStore
+});
+module.exports = __toCommonJS(store_exports);
+var DEFAULT_DURATION = 5e3;
+var EXIT_MS = 200;
+var toasts = [];
+var listeners = /* @__PURE__ */ new Set();
+var EMPTY = [];
+var counter = 0;
+function setToasts(next) {
+  toasts = next;
+  for (const listener of listeners) listener();
+}
+function subscribe(listener) {
+  listeners.add(listener);
+  return () => {
+    listeners.delete(listener);
+  };
+}
+function getSnapshot() {
+  return toasts;
+}
+function getServerSnapshot() {
+  return EMPTY;
+}
+function dismiss(id) {
+  if (typeof window === "undefined") return;
+  const targets = toasts.filter((t) => !t.leaving && (id === void 0 || t.id === id));
+  if (targets.length === 0) return;
+  const ids = new Set(targets.map((t) => t.id));
+  setToasts(toasts.map((t) => ids.has(t.id) ? __spreadProps(__spreadValues({}, t), { leaving: true }) : t));
+  setTimeout(() => {
+    setToasts(toasts.filter((t) => !(ids.has(t.id) && t.leaving)));
+  }, EXIT_MS);
+}
+function show(titleOrOpts, extra) {
+  var _a, _b, _c, _d, _e, _f;
+  const opts = typeof titleOrOpts === "string" ? __spreadProps(__spreadValues({}, extra), { title: titleOrOpts }) : titleOrOpts;
+  const id = (_a = opts.id) != null ? _a : `glob-toast-${++counter}`;
+  if (typeof window === "undefined") return id;
+  const existing = toasts.find((t) => t.id === id);
+  const data = __spreadProps(__spreadValues(__spreadValues({}, existing), opts), {
+    id,
+    variant: (_c = (_b = opts.variant) != null ? _b : existing == null ? void 0 : existing.variant) != null ? _c : "default",
+    duration: (_e = (_d = opts.duration) != null ? _d : existing == null ? void 0 : existing.duration) != null ? _e : DEFAULT_DURATION,
+    version: ((_f = existing == null ? void 0 : existing.version) != null ? _f : 0) + 1,
+    leaving: false
+  });
+  setToasts(existing ? toasts.map((t) => t.id === id ? data : t) : [...toasts, data]);
+  return id;
+}
+var variantShortcut = (variant) => ((titleOrOpts, extra) => typeof titleOrOpts === "string" ? show(titleOrOpts, __spreadProps(__spreadValues({}, extra), { variant })) : show(__spreadProps(__spreadValues({}, titleOrOpts), { variant })));
+var toast = Object.assign(show, {
+  success: variantShortcut("success"),
+  error: variantShortcut("danger"),
+  warning: variantShortcut("warning"),
+  info: variantShortcut("info"),
+  /** Dismisses one toast, or all of them without an id. */
+  dismiss
+});
+var toastStore = { subscribe, getSnapshot, getServerSnapshot };
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  EXIT_MS,
+  getServerSnapshot,
+  getSnapshot,
+  subscribe,
+  toast,
+  toastStore
+});
+//# sourceMappingURL=store.js.map

package/dist/store.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/store.ts"],"sourcesContent":["// Module-level toast store. No React state and no \"use client\": `toast()` can be imported anywhere.\n// On the server it is a no-op, because module state there is shared by every request.\n\nexport type ToastVariant = \"default\" | \"success\" | \"warning\" | \"danger\" | \"info\"\n\nexport interface ToastAction {\n  label: React.ReactNode\n  /** Call `event.preventDefault()` to keep the toast open after the click. */\n  onClick: (event: React.MouseEvent<HTMLButtonElement>) => void\n}\n\nexport interface ToastSettings {\n  /** Reuse an id to update a toast in place instead of adding a new one. */\n  id?: string\n  variant?: ToastVariant\n  /** Time on screen in ms. `Infinity` keeps it until dismissed. Default 5000. */\n  duration?: number\n  action?: ToastAction\n}\n\n/** A toast needs a title, a description, or both. */\nexport type ToastContent =\n  | { title: React.ReactNode; description?: React.ReactNode }\n  | { title?: React.ReactNode; description: React.ReactNode }\n\n/** Options for `toast(options)`. */\nexport type ToastOptions = ToastSettings & ToastContent\n\n/** Options for `toast(title, options)`: everything except the title. */\nexport type ToastExtraOptions = ToastSettings & { description?: React.ReactNode }\n\nexport interface ToastData extends ToastSettings {\n  id: string\n  title?: React.ReactNode\n  description?: React.ReactNode\n  variant: ToastVariant\n  duration: number\n  /** Increments on every update, so timers restart. */\n  version: number\n  /** Playing the exit animation; removed shortly after. */\n  leaving: boolean\n}\n\nconst DEFAULT_DURATION = 5000\n/** Matches the exit transition in the Toaster. */\nexport const EXIT_MS = 200\n\nlet toasts: ToastData[] = []\nconst listeners = new Set<() => void>()\nconst EMPTY: ToastData[] = []\nlet counter = 0\n\nfunction setToasts(next: ToastData[]) {\n  toasts = next\n  for (const listener of listeners) listener()\n}\n\nexport function subscribe(listener: () => void) {\n  listeners.add(listener)\n  return () => {\n    listeners.delete(listener)\n  }\n}\n\nexport function getSnapshot() {\n  return toasts\n}\n\nexport function getServerSnapshot() {\n  return EMPTY\n}\n\nfunction dismiss(id?: string) {\n  if (typeof window === \"undefined\") return\n  const targets = toasts.filter((t) => !t.leaving && (id === undefined || t.id === id))\n  if (targets.length === 0) return\n  const ids = new Set(targets.map((t) => t.id))\n  setToasts(toasts.map((t) => (ids.has(t.id) ? { ...t, leaving: true } : t)))\n  setTimeout(() => {\n    // Skip toasts that were revived by an update with the same id meanwhile.\n    setToasts(toasts.filter((t) => !(ids.has(t.id) && t.leaving)))\n  }, EXIT_MS)\n}\n\nfunction show(title: string, opts?: ToastExtraOptions): string\nfunction show(opts: ToastOptions): string\nfunction show(titleOrOpts: string | ToastOptions, extra?: ToastExtraOptions): string {\n  const opts: ToastSettings & { title?: React.ReactNode; description?: React.ReactNode } =\n    typeof titleOrOpts === \"string\" ? { ...extra, title: titleOrOpts } : titleOrOpts\n  const id = opts.id ?? `glob-toast-${++counter}`\n  if (typeof window === \"undefined\") return id\n\n  const existing = toasts.find((t) => t.id === id)\n  const data: ToastData = {\n    ...existing,\n    ...opts,\n    id,\n    variant: opts.variant ?? existing?.variant ?? \"default\",\n    duration: opts.duration ?? existing?.duration ?? DEFAULT_DURATION,\n    version: (existing?.version ?? 0) + 1,\n    leaving: false,\n  }\n  setToasts(existing ? toasts.map((t) => (t.id === id ? data : t)) : [...toasts, data])\n  return id\n}\n\ninterface VariantShortcut {\n  (title: string, opts?: Omit<ToastExtraOptions, \"variant\">): string\n  (opts: Omit<ToastSettings, \"variant\"> & ToastContent): string\n}\n\nconst variantShortcut = (variant: ToastVariant): VariantShortcut =>\n  ((titleOrOpts: string | ToastOptions, extra?: ToastExtraOptions) =>\n    typeof titleOrOpts === \"string\"\n      ? show(titleOrOpts, { ...extra, variant })\n      : show({ ...titleOrOpts, variant })) as VariantShortcut\n\n/**\n * Shows a toast and returns its id. Needs a mounted `<Toaster />` to be visible.\n * Safe to call anywhere; on the server it does nothing.\n */\nexport const toast = Object.assign(show, {\n  success: variantShortcut(\"success\"),\n  error: variantShortcut(\"danger\"),\n  warning: variantShortcut(\"warning\"),\n  info: variantShortcut(\"info\"),\n  /** Dismisses one toast, or all of them without an id. */\n  dismiss,\n})\n\n/** @internal Used by the Toaster. */\nexport const toastStore = { subscribe, getSnapshot, getServerSnapshot }\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA2CA,IAAM,mBAAmB;AAElB,IAAM,UAAU;AAEvB,IAAI,SAAsB,CAAC;AAC3B,IAAM,YAAY,oBAAI,IAAgB;AACtC,IAAM,QAAqB,CAAC;AAC5B,IAAI,UAAU;AAEd,SAAS,UAAU,MAAmB;AACpC,WAAS;AACT,aAAW,YAAY,UAAW,UAAS;AAC7C;AAEO,SAAS,UAAU,UAAsB;AAC9C,YAAU,IAAI,QAAQ;AACtB,SAAO,MAAM;AACX,cAAU,OAAO,QAAQ;AAAA,EAC3B;AACF;AAEO,SAAS,cAAc;AAC5B,SAAO;AACT;AAEO,SAAS,oBAAoB;AAClC,SAAO;AACT;AAEA,SAAS,QAAQ,IAAa;AAC5B,MAAI,OAAO,WAAW,YAAa;AACnC,QAAM,UAAU,OAAO,OAAO,CAAC,MAAM,CAAC,EAAE,YAAY,OAAO,UAAa,EAAE,OAAO,GAAG;AACpF,MAAI,QAAQ,WAAW,EAAG;AAC1B,QAAM,MAAM,IAAI,IAAI,QAAQ,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC;AAC5C,YAAU,OAAO,IAAI,CAAC,MAAO,IAAI,IAAI,EAAE,EAAE,IAAI,iCAAK,IAAL,EAAQ,SAAS,KAAK,KAAI,CAAE,CAAC;AAC1E,aAAW,MAAM;AAEf,cAAU,OAAO,OAAO,CAAC,MAAM,EAAE,IAAI,IAAI,EAAE,EAAE,KAAK,EAAE,QAAQ,CAAC;AAAA,EAC/D,GAAG,OAAO;AACZ;AAIA,SAAS,KAAK,aAAoC,OAAmC;AAtFrF;AAuFE,QAAM,OACJ,OAAO,gBAAgB,WAAW,iCAAK,QAAL,EAAY,OAAO,YAAY,KAAI;AACvE,QAAM,MAAK,UAAK,OAAL,YAAW,cAAc,EAAE,OAAO;AAC7C,MAAI,OAAO,WAAW,YAAa,QAAO;AAE1C,QAAM,WAAW,OAAO,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE;AAC/C,QAAM,OAAkB,gDACnB,WACA,OAFmB;AAAA,IAGtB;AAAA,IACA,UAAS,gBAAK,YAAL,YAAgB,qCAAU,YAA1B,YAAqC;AAAA,IAC9C,WAAU,gBAAK,aAAL,YAAiB,qCAAU,aAA3B,YAAuC;AAAA,IACjD,WAAU,0CAAU,YAAV,YAAqB,KAAK;AAAA,IACpC,SAAS;AAAA,EACX;AACA,YAAU,WAAW,OAAO,IAAI,CAAC,MAAO,EAAE,OAAO,KAAK,OAAO,CAAE,IAAI,CAAC,GAAG,QAAQ,IAAI,CAAC;AACpF,SAAO;AACT;AAOA,IAAM,kBAAkB,CAAC,aACtB,CAAC,aAAoC,UACpC,OAAO,gBAAgB,WACnB,KAAK,aAAa,iCAAK,QAAL,EAAY,QAAQ,EAAC,IACvC,KAAK,iCAAK,cAAL,EAAkB,QAAQ,EAAC;AAMjC,IAAM,QAAQ,OAAO,OAAO,MAAM;AAAA,EACvC,SAAS,gBAAgB,SAAS;AAAA,EAClC,OAAO,gBAAgB,QAAQ;AAAA,EAC/B,SAAS,gBAAgB,SAAS;AAAA,EAClC,MAAM,gBAAgB,MAAM;AAAA;AAAA,EAE5B;AACF,CAAC;AAGM,IAAM,aAAa,EAAE,WAAW,aAAa,kBAAkB;","names":[]}

package/dist/store.mjs

@@ -0,0 +1,88 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+
+// src/store.ts
+var DEFAULT_DURATION = 5e3;
+var EXIT_MS = 200;
+var toasts = [];
+var listeners = /* @__PURE__ */ new Set();
+var EMPTY = [];
+var counter = 0;
+function setToasts(next) {
+  toasts = next;
+  for (const listener of listeners) listener();
+}
+function subscribe(listener) {
+  listeners.add(listener);
+  return () => {
+    listeners.delete(listener);
+  };
+}
+function getSnapshot() {
+  return toasts;
+}
+function getServerSnapshot() {
+  return EMPTY;
+}
+function dismiss(id) {
+  if (typeof window === "undefined") return;
+  const targets = toasts.filter((t) => !t.leaving && (id === void 0 || t.id === id));
+  if (targets.length === 0) return;
+  const ids = new Set(targets.map((t) => t.id));
+  setToasts(toasts.map((t) => ids.has(t.id) ? __spreadProps(__spreadValues({}, t), { leaving: true }) : t));
+  setTimeout(() => {
+    setToasts(toasts.filter((t) => !(ids.has(t.id) && t.leaving)));
+  }, EXIT_MS);
+}
+function show(titleOrOpts, extra) {
+  var _a, _b, _c, _d, _e, _f;
+  const opts = typeof titleOrOpts === "string" ? __spreadProps(__spreadValues({}, extra), { title: titleOrOpts }) : titleOrOpts;
+  const id = (_a = opts.id) != null ? _a : `glob-toast-${++counter}`;
+  if (typeof window === "undefined") return id;
+  const existing = toasts.find((t) => t.id === id);
+  const data = __spreadProps(__spreadValues(__spreadValues({}, existing), opts), {
+    id,
+    variant: (_c = (_b = opts.variant) != null ? _b : existing == null ? void 0 : existing.variant) != null ? _c : "default",
+    duration: (_e = (_d = opts.duration) != null ? _d : existing == null ? void 0 : existing.duration) != null ? _e : DEFAULT_DURATION,
+    version: ((_f = existing == null ? void 0 : existing.version) != null ? _f : 0) + 1,
+    leaving: false
+  });
+  setToasts(existing ? toasts.map((t) => t.id === id ? data : t) : [...toasts, data]);
+  return id;
+}
+var variantShortcut = (variant) => ((titleOrOpts, extra) => typeof titleOrOpts === "string" ? show(titleOrOpts, __spreadProps(__spreadValues({}, extra), { variant })) : show(__spreadProps(__spreadValues({}, titleOrOpts), { variant })));
+var toast = Object.assign(show, {
+  success: variantShortcut("success"),
+  error: variantShortcut("danger"),
+  warning: variantShortcut("warning"),
+  info: variantShortcut("info"),
+  /** Dismisses one toast, or all of them without an id. */
+  dismiss
+});
+var toastStore = { subscribe, getSnapshot, getServerSnapshot };
+export {
+  EXIT_MS,
+  getServerSnapshot,
+  getSnapshot,
+  subscribe,
+  toast,
+  toastStore
+};
+//# sourceMappingURL=store.mjs.map

package/dist/store.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/store.ts"],"sourcesContent":["// Module-level toast store. No React state and no \"use client\": `toast()` can be imported anywhere.\n// On the server it is a no-op, because module state there is shared by every request.\n\nexport type ToastVariant = \"default\" | \"success\" | \"warning\" | \"danger\" | \"info\"\n\nexport interface ToastAction {\n  label: React.ReactNode\n  /** Call `event.preventDefault()` to keep the toast open after the click. */\n  onClick: (event: React.MouseEvent<HTMLButtonElement>) => void\n}\n\nexport interface ToastSettings {\n  /** Reuse an id to update a toast in place instead of adding a new one. */\n  id?: string\n  variant?: ToastVariant\n  /** Time on screen in ms. `Infinity` keeps it until dismissed. Default 5000. */\n  duration?: number\n  action?: ToastAction\n}\n\n/** A toast needs a title, a description, or both. */\nexport type ToastContent =\n  | { title: React.ReactNode; description?: React.ReactNode }\n  | { title?: React.ReactNode; description: React.ReactNode }\n\n/** Options for `toast(options)`. */\nexport type ToastOptions = ToastSettings & ToastContent\n\n/** Options for `toast(title, options)`: everything except the title. */\nexport type ToastExtraOptions = ToastSettings & { description?: React.ReactNode }\n\nexport interface ToastData extends ToastSettings {\n  id: string\n  title?: React.ReactNode\n  description?: React.ReactNode\n  variant: ToastVariant\n  duration: number\n  /** Increments on every update, so timers restart. */\n  version: number\n  /** Playing the exit animation; removed shortly after. */\n  leaving: boolean\n}\n\nconst DEFAULT_DURATION = 5000\n/** Matches the exit transition in the Toaster. */\nexport const EXIT_MS = 200\n\nlet toasts: ToastData[] = []\nconst listeners = new Set<() => void>()\nconst EMPTY: ToastData[] = []\nlet counter = 0\n\nfunction setToasts(next: ToastData[]) {\n  toasts = next\n  for (const listener of listeners) listener()\n}\n\nexport function subscribe(listener: () => void) {\n  listeners.add(listener)\n  return () => {\n    listeners.delete(listener)\n  }\n}\n\nexport function getSnapshot() {\n  return toasts\n}\n\nexport function getServerSnapshot() {\n  return EMPTY\n}\n\nfunction dismiss(id?: string) {\n  if (typeof window === \"undefined\") return\n  const targets = toasts.filter((t) => !t.leaving && (id === undefined || t.id === id))\n  if (targets.length === 0) return\n  const ids = new Set(targets.map((t) => t.id))\n  setToasts(toasts.map((t) => (ids.has(t.id) ? { ...t, leaving: true } : t)))\n  setTimeout(() => {\n    // Skip toasts that were revived by an update with the same id meanwhile.\n    setToasts(toasts.filter((t) => !(ids.has(t.id) && t.leaving)))\n  }, EXIT_MS)\n}\n\nfunction show(title: string, opts?: ToastExtraOptions): string\nfunction show(opts: ToastOptions): string\nfunction show(titleOrOpts: string | ToastOptions, extra?: ToastExtraOptions): string {\n  const opts: ToastSettings & { title?: React.ReactNode; description?: React.ReactNode } =\n    typeof titleOrOpts === \"string\" ? { ...extra, title: titleOrOpts } : titleOrOpts\n  const id = opts.id ?? `glob-toast-${++counter}`\n  if (typeof window === \"undefined\") return id\n\n  const existing = toasts.find((t) => t.id === id)\n  const data: ToastData = {\n    ...existing,\n    ...opts,\n    id,\n    variant: opts.variant ?? existing?.variant ?? \"default\",\n    duration: opts.duration ?? existing?.duration ?? DEFAULT_DURATION,\n    version: (existing?.version ?? 0) + 1,\n    leaving: false,\n  }\n  setToasts(existing ? toasts.map((t) => (t.id === id ? data : t)) : [...toasts, data])\n  return id\n}\n\ninterface VariantShortcut {\n  (title: string, opts?: Omit<ToastExtraOptions, \"variant\">): string\n  (opts: Omit<ToastSettings, \"variant\"> & ToastContent): string\n}\n\nconst variantShortcut = (variant: ToastVariant): VariantShortcut =>\n  ((titleOrOpts: string | ToastOptions, extra?: ToastExtraOptions) =>\n    typeof titleOrOpts === \"string\"\n      ? show(titleOrOpts, { ...extra, variant })\n      : show({ ...titleOrOpts, variant })) as VariantShortcut\n\n/**\n * Shows a toast and returns its id. Needs a mounted `<Toaster />` to be visible.\n * Safe to call anywhere; on the server it does nothing.\n */\nexport const toast = Object.assign(show, {\n  success: variantShortcut(\"success\"),\n  error: variantShortcut(\"danger\"),\n  warning: variantShortcut(\"warning\"),\n  info: variantShortcut(\"info\"),\n  /** Dismisses one toast, or all of them without an id. */\n  dismiss,\n})\n\n/** @internal Used by the Toaster. */\nexport const toastStore = { subscribe, getSnapshot, getServerSnapshot }\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA2CA,IAAM,mBAAmB;AAElB,IAAM,UAAU;AAEvB,IAAI,SAAsB,CAAC;AAC3B,IAAM,YAAY,oBAAI,IAAgB;AACtC,IAAM,QAAqB,CAAC;AAC5B,IAAI,UAAU;AAEd,SAAS,UAAU,MAAmB;AACpC,WAAS;AACT,aAAW,YAAY,UAAW,UAAS;AAC7C;AAEO,SAAS,UAAU,UAAsB;AAC9C,YAAU,IAAI,QAAQ;AACtB,SAAO,MAAM;AACX,cAAU,OAAO,QAAQ;AAAA,EAC3B;AACF;AAEO,SAAS,cAAc;AAC5B,SAAO;AACT;AAEO,SAAS,oBAAoB;AAClC,SAAO;AACT;AAEA,SAAS,QAAQ,IAAa;AAC5B,MAAI,OAAO,WAAW,YAAa;AACnC,QAAM,UAAU,OAAO,OAAO,CAAC,MAAM,CAAC,EAAE,YAAY,OAAO,UAAa,EAAE,OAAO,GAAG;AACpF,MAAI,QAAQ,WAAW,EAAG;AAC1B,QAAM,MAAM,IAAI,IAAI,QAAQ,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC;AAC5C,YAAU,OAAO,IAAI,CAAC,MAAO,IAAI,IAAI,EAAE,EAAE,IAAI,iCAAK,IAAL,EAAQ,SAAS,KAAK,KAAI,CAAE,CAAC;AAC1E,aAAW,MAAM;AAEf,cAAU,OAAO,OAAO,CAAC,MAAM,EAAE,IAAI,IAAI,EAAE,EAAE,KAAK,EAAE,QAAQ,CAAC;AAAA,EAC/D,GAAG,OAAO;AACZ;AAIA,SAAS,KAAK,aAAoC,OAAmC;AAtFrF;AAuFE,QAAM,OACJ,OAAO,gBAAgB,WAAW,iCAAK,QAAL,EAAY,OAAO,YAAY,KAAI;AACvE,QAAM,MAAK,UAAK,OAAL,YAAW,cAAc,EAAE,OAAO;AAC7C,MAAI,OAAO,WAAW,YAAa,QAAO;AAE1C,QAAM,WAAW,OAAO,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE;AAC/C,QAAM,OAAkB,gDACnB,WACA,OAFmB;AAAA,IAGtB;AAAA,IACA,UAAS,gBAAK,YAAL,YAAgB,qCAAU,YAA1B,YAAqC;AAAA,IAC9C,WAAU,gBAAK,aAAL,YAAiB,qCAAU,aAA3B,YAAuC;AAAA,IACjD,WAAU,0CAAU,YAAV,YAAqB,KAAK;AAAA,IACpC,SAAS;AAAA,EACX;AACA,YAAU,WAAW,OAAO,IAAI,CAAC,MAAO,EAAE,OAAO,KAAK,OAAO,CAAE,IAAI,CAAC,GAAG,QAAQ,IAAI,CAAC;AACpF,SAAO;AACT;AAOA,IAAM,kBAAkB,CAAC,aACtB,CAAC,aAAoC,UACpC,OAAO,gBAAgB,WACnB,KAAK,aAAa,iCAAK,QAAL,EAAY,QAAQ,EAAC,IACvC,KAAK,iCAAK,cAAL,EAAkB,QAAQ,EAAC;AAMjC,IAAM,QAAQ,OAAO,OAAO,MAAM;AAAA,EACvC,SAAS,gBAAgB,SAAS;AAAA,EAClC,OAAO,gBAAgB,QAAQ;AAAA,EAC/B,SAAS,gBAAgB,SAAS;AAAA,EAClC,MAAM,gBAAgB,MAAM;AAAA;AAAA,EAE5B;AACF,CAAC;AAGM,IAAM,aAAa,EAAE,WAAW,aAAa,kBAAkB;","names":[]}

package/dist/toaster.js

@@ -0,0 +1,276 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/toaster.tsx
+var toaster_exports = {};
+__export(toaster_exports, {
+  Toaster: () => Toaster
+});
+module.exports = __toCommonJS(toaster_exports);
+var import_react = require("react");
+var import_react_dom = require("react-dom");
+var import_utils = require("@glob-ui/utils");
+var import_alert = require("@glob-ui/alert");
+var import_store = require("./store.js");
+var import_jsx_runtime = require("react/jsx-runtime");
+var positionClasses = {
+  "top-left": "top-0 left-0",
+  "top-center": "top-0 left-1/2 -translate-x-1/2",
+  "top-right": "top-0 right-0",
+  "bottom-left": "bottom-0 left-0",
+  "bottom-center": "bottom-0 left-1/2 -translate-x-1/2",
+  "bottom-right": "bottom-0 right-0"
+};
+var isUrgent = (t) => t.variant === "warning" || t.variant === "danger";
+function isPopoverOpen(el) {
+  try {
+    return el.matches(":popover-open");
+  } catch (e) {
+    return false;
+  }
+}
+function topModalDialog() {
+  var _a;
+  const modals = document.querySelectorAll("dialog:modal");
+  return (_a = modals[modals.length - 1]) != null ? _a : null;
+}
+var subscribeNothing = () => () => {
+};
+var subscribeVisibility = (cb) => {
+  document.addEventListener("visibilitychange", cb);
+  return () => document.removeEventListener("visibilitychange", cb);
+};
+function Toaster({
+  position = "bottom-right",
+  max = 3,
+  closeLabel = "Close notification",
+  label = "Notifications",
+  className
+}) {
+  const toasts = (0, import_react.useSyncExternalStore)(import_store.toastStore.subscribe, import_store.toastStore.getSnapshot, import_store.toastStore.getServerSnapshot);
+  const hidden = (0, import_react.useSyncExternalStore)(subscribeVisibility, () => document.hidden, () => false);
+  const hydrated = (0, import_react.useSyncExternalStore)(subscribeNothing, () => true, () => false);
+  const [hovered, setHovered] = (0, import_react.useState)(false);
+  const [focusWithin, setFocusWithin] = (0, import_react.useState)(false);
+  const [host] = (0, import_react.useState)(() => {
+    if (typeof document === "undefined") return null;
+    const el = document.createElement("div");
+    el.dataset.globToaster = "";
+    el.style.display = "contents";
+    return el;
+  });
+  const containerRef = (0, import_react.useRef)(null);
+  const shownIds = (0, import_react.useRef)(/* @__PURE__ */ new Set());
+  const visible = (0, import_react.useMemo)(() => toasts.slice(0, max), [toasts, max]);
+  const active = visible.length > 0;
+  const paused = hovered || focusWithin || hidden;
+  (0, import_react.useLayoutEffect)(() => {
+    if (!host) return;
+    document.body.appendChild(host);
+    return () => host.remove();
+  }, [host]);
+  (0, import_react.useLayoutEffect)(() => {
+    const container = containerRef.current;
+    if (!host || !container) return;
+    const newIds = visible.filter((t) => !shownIds.current.has(t.id));
+    shownIds.current = new Set(visible.map((t) => t.id));
+    placeHost(host, container, visible.length > 0, newIds.length > 0);
+  }, [host, hydrated, visible]);
+  (0, import_react.useLayoutEffect)(() => {
+    const container = containerRef.current;
+    if (!host || !container || !active) return;
+    const observer = new MutationObserver((records) => {
+      if (host.isConnected && !records.some(involvesDialog)) return;
+      placeHost(host, container, true, false);
+    });
+    observer.observe(document.body, { subtree: true, childList: true, attributes: true, attributeFilter: ["open"] });
+    return () => observer.disconnect();
+  }, [host, hydrated, active]);
+  const regionText = (urgent) => visible.filter((t) => !t.leaving && isUrgent(t) === urgent).map((t) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+    t.title,
+    " ",
+    t.description
+  ] }, `${t.id}:${t.version}`));
+  const content = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { role: "status", "aria-live": "polite", "aria-atomic": "false", className: "sr-only", children: regionText(false) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { role: "alert", "aria-live": "assertive", "aria-atomic": "false", className: "sr-only", children: regionText(true) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "section",
+      {
+        ref: containerRef,
+        popover: "manual",
+        "aria-label": label,
+        className: (0, import_utils.cn)(
+          // Reset the UA popover box. The container itself ignores the pointer; toasts do not.
+          "pointer-events-none fixed inset-auto m-0 w-full max-w-sm overflow-visible border-0 bg-transparent p-4",
+          "transition-[display,overlay] transition-discrete duration-200",
+          positionClasses[position],
+          className
+        ),
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "ol",
+          {
+            className: "pointer-events-auto flex flex-col gap-2",
+            onPointerEnter: () => setHovered(true),
+            onPointerLeave: () => setHovered(false),
+            onFocus: () => setFocusWithin(true),
+            onBlur: (e) => {
+              if (!e.currentTarget.contains(e.relatedTarget)) setFocusWithin(false);
+            },
+            children: visible.map((t) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              ToastItem,
+              {
+                toast: t,
+                paused,
+                closeLabel,
+                fromTop: position.startsWith("top"),
+                onFocusLost: () => setFocusWithin(false)
+              },
+              t.id
+            ))
+          }
+        )
+      }
+    )
+  ] });
+  return host && hydrated ? (0, import_react_dom.createPortal)(content, host) : null;
+}
+Toaster.displayName = "Toaster";
+function placeHost(host, container, hasToasts, promote) {
+  var _a;
+  const target = (_a = topModalDialog()) != null ? _a : document.body;
+  let moved = false;
+  if (host.parentElement !== target) {
+    target.appendChild(host);
+    moved = true;
+  }
+  if (!hasToasts) {
+    if (isPopoverOpen(container)) container.hidePopover();
+    return;
+  }
+  if (!isPopoverOpen(container)) {
+    container.showPopover();
+  } else if (promote && !moved && hasOtherTopLayer(container)) {
+    container.hidePopover();
+    container.showPopover();
+  }
+}
+var containsDialog = (node) => node.nodeName === "DIALOG" || node instanceof Element && node.querySelector("dialog") !== null;
+function involvesDialog(record) {
+  if (record.type === "attributes") return record.target.nodeName === "DIALOG";
+  return Array.from(record.addedNodes).some(containsDialog) || Array.from(record.removedNodes).some(containsDialog);
+}
+function hasOtherTopLayer(container) {
+  if (document.querySelector("dialog:modal")) return true;
+  try {
+    return Array.from(document.querySelectorAll(":popover-open")).some((el) => el !== container);
+  } catch (e) {
+    return false;
+  }
+}
+function ToastItem({ toast: t, paused, closeLabel, fromTop, onFocusLost }) {
+  const liRef = (0, import_react.useRef)(null);
+  const remaining = (0, import_react.useRef)(t.duration);
+  const onFocusLostRef = (0, import_react.useRef)(onFocusLost);
+  (0, import_react.useEffect)(() => {
+    onFocusLostRef.current = onFocusLost;
+  });
+  (0, import_react.useLayoutEffect)(() => {
+    const li = liRef.current;
+    return () => {
+      var _a, _b, _c;
+      if (!li || !li.contains(document.activeElement)) return;
+      const keyboard = li.querySelector(":focus-visible") !== null;
+      const next = Array.from((_b = (_a = li.parentElement) == null ? void 0 : _a.children) != null ? _b : []).find((el) => el !== li && !el.hasAttribute("data-leaving"));
+      const target = next == null ? void 0 : next.querySelector("button[aria-label]");
+      if (keyboard && target) {
+        target.focus();
+        return;
+      }
+      ;
+      (_c = document.activeElement) == null ? void 0 : _c.blur();
+      onFocusLostRef.current();
+    };
+  }, []);
+  const version = (0, import_react.useRef)(t.version);
+  (0, import_react.useEffect)(() => {
+    if (version.current !== t.version) {
+      version.current = t.version;
+      remaining.current = t.duration;
+    }
+    if (paused || t.leaving || !Number.isFinite(t.duration)) return;
+    const start = Date.now();
+    const timer = setTimeout(() => import_store.toast.dismiss(t.id), remaining.current);
+    return () => {
+      clearTimeout(timer);
+      remaining.current -= Date.now() - start;
+    };
+  }, [paused, t.id, t.version, t.duration, t.leaving]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "li",
+    {
+      ref: liRef,
+      "data-leaving": t.leaving || void 0,
+      className: (0, import_utils.cn)(
+        // Same colours as Alert; no role here, the live regions above announce it.
+        (0, import_alert.alertVariants)({ variant: t.variant }),
+        "items-start pr-10 shadow-glob-md",
+        "transition-[opacity,translate] transition-discrete duration-200 ease-out",
+        fromTop ? "starting:-translate-y-2" : "starting:translate-y-2",
+        "starting:opacity-0 data-leaving:opacity-0 motion-reduce:transition-none"
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_alert.AlertIcon, { variant: t.variant }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [
+          t.title != null && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "font-medium leading-5", children: t.title }),
+          t.description != null && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "leading-5 text-glob-text-secondary", children: t.description }),
+          t.action && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              type: "button",
+              onClick: (e) => {
+                var _a;
+                (_a = t.action) == null ? void 0 : _a.onClick(e);
+                if (!e.defaultPrevented) import_store.toast.dismiss(t.id);
+              },
+              className: "mt-1 self-start rounded-glob-sm border border-glob-border bg-glob-surface px-2 py-1 text-xs font-medium text-glob-text hover:bg-glob-surface-hover focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-glob-ring",
+              children: t.action.label
+            }
+          )
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "button",
+          {
+            type: "button",
+            "aria-label": closeLabel,
+            onClick: () => import_store.toast.dismiss(t.id),
+            className: "absolute right-2 top-2 flex h-6 w-6 items-center justify-center rounded-glob-sm text-glob-text-secondary hover:bg-glob-surface-hover hover:text-glob-text focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-glob-ring",
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", className: "h-3.5 w-3.5", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M18 6L6 18M6 6l12 12" }) })
+          }
+        )
+      ]
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Toaster
+});
+//# sourceMappingURL=toaster.js.map

package/dist/toaster.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/toaster.tsx"],"sourcesContent":["\"use client\"\n\nimport { useEffect, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from \"react\"\nimport { createPortal } from \"react-dom\"\nimport { cn } from \"@glob-ui/utils\"\nimport { AlertIcon, alertVariants } from \"@glob-ui/alert\"\nimport { toast, toastStore, type ToastData } from \"./store\"\n\nexport type ToasterPosition = \"top-left\" | \"top-center\" | \"top-right\" | \"bottom-left\" | \"bottom-center\" | \"bottom-right\"\n\nexport interface ToasterProps {\n  position?: ToasterPosition\n  /** Toasts on screen at once. The rest wait in a queue. */\n  max?: number\n  /** Accessible name of each toast's close button. */\n  closeLabel?: string\n  /** Accessible name of the notification list. */\n  label?: string\n  className?: string\n}\n\nconst positionClasses: Record<ToasterPosition, string> = {\n  \"top-left\": \"top-0 left-0\",\n  \"top-center\": \"top-0 left-1/2 -translate-x-1/2\",\n  \"top-right\": \"top-0 right-0\",\n  \"bottom-left\": \"bottom-0 left-0\",\n  \"bottom-center\": \"bottom-0 left-1/2 -translate-x-1/2\",\n  \"bottom-right\": \"bottom-0 right-0\",\n}\n\nconst isUrgent = (t: ToastData) => t.variant === \"warning\" || t.variant === \"danger\"\n\nfunction isPopoverOpen(el: HTMLElement) {\n  try {\n    return el.matches(\":popover-open\")\n  } catch {\n    return false\n  }\n}\n\n/** Topmost open modal dialog. Everything outside it is inert, so toasts must live inside it. */\nfunction topModalDialog() {\n  const modals = document.querySelectorAll<HTMLDialogElement>(\"dialog:modal\")\n  return modals[modals.length - 1] ?? null\n}\n\nconst subscribeNothing = () => () => {}\n\nconst subscribeVisibility = (cb: () => void) => {\n  document.addEventListener(\"visibilitychange\", cb)\n  return () => document.removeEventListener(\"visibilitychange\", cb)\n}\n\nfunction Toaster({\n  position = \"bottom-right\",\n  max = 3,\n  closeLabel = \"Close notification\",\n  label = \"Notifications\",\n  className,\n}: ToasterProps) {\n  const toasts = useSyncExternalStore(toastStore.subscribe, toastStore.getSnapshot, toastStore.getServerSnapshot)\n  const hidden = useSyncExternalStore(subscribeVisibility, () => document.hidden, () => false)\n  // False during SSR and hydration, true after: the server HTML has no toaster markup to match.\n  const hydrated = useSyncExternalStore(subscribeNothing, () => true, () => false)\n  const [hovered, setHovered] = useState(false)\n  const [focusWithin, setFocusWithin] = useState(false)\n  // A host node we move between <body> and the topmost modal dialog. React only owns its children.\n  // Null on the server. The portal is rendered only after hydration (see `hydrated`).\n  const [host] = useState(() => {\n    if (typeof document === \"undefined\") return null\n    const el = document.createElement(\"div\")\n    el.dataset.globToaster = \"\"\n    el.style.display = \"contents\"\n    return el\n  })\n  const containerRef = useRef<HTMLElement>(null)\n  const shownIds = useRef(new Set<string>())\n\n  const visible = useMemo(() => toasts.slice(0, max), [toasts, max])\n  const active = visible.length > 0\n  const paused = hovered || focusWithin || hidden\n\n  useLayoutEffect(() => {\n    if (!host) return\n    document.body.appendChild(host)\n    return () => host.remove()\n  }, [host])\n\n  // Keep the host where it is not inert, and the container above other top-layer elements.\n  // Runs when the visible toasts change; promotes the container when new ones arrive.\n  useLayoutEffect(() => {\n    const container = containerRef.current\n    if (!host || !container) return\n    const newIds = visible.filter((t) => !shownIds.current.has(t.id))\n    shownIds.current = new Set(visible.map((t) => t.id))\n    placeHost(host, container, visible.length > 0, newIds.length > 0)\n  }, [host, hydrated, visible])\n\n  // Dialogs opening, closing or unmounting change where the host must be. Only watched while\n  // toasts are on screen; with none, nothing observes the document.\n  useLayoutEffect(() => {\n    const container = containerRef.current\n    if (!host || !container || !active) return\n    const observer = new MutationObserver((records) => {\n      if (host.isConnected && !records.some(involvesDialog)) return\n      placeHost(host, container, true, false)\n    })\n    observer.observe(document.body, { subtree: true, childList: true, attributes: true, attributeFilter: [\"open\"] })\n    return () => observer.disconnect()\n  }, [host, hydrated, active])\n\n  const regionText = (urgent: boolean) =>\n    visible\n      .filter((t) => !t.leaving && isUrgent(t) === urgent)\n      .map((t) => (\n        <div key={`${t.id}:${t.version}`}>\n          {t.title} {t.description}\n        </div>\n      ))\n\n  const content = (\n    <>\n      {/* Always mounted so screen readers track them before the first toast arrives. */}\n      <div role=\"status\" aria-live=\"polite\" aria-atomic=\"false\" className=\"sr-only\">\n        {regionText(false)}\n      </div>\n      <div role=\"alert\" aria-live=\"assertive\" aria-atomic=\"false\" className=\"sr-only\">\n        {regionText(true)}\n      </div>\n      <section\n        ref={containerRef}\n        popover=\"manual\"\n        aria-label={label}\n        className={cn(\n          // Reset the UA popover box. The container itself ignores the pointer; toasts do not.\n          \"pointer-events-none fixed inset-auto m-0 w-full max-w-sm overflow-visible border-0 bg-transparent p-4\",\n          \"transition-[display,overlay] transition-discrete duration-200\",\n          positionClasses[position],\n          className\n        )}\n      >\n        <ol\n          className=\"pointer-events-auto flex flex-col gap-2\"\n          onPointerEnter={() => setHovered(true)}\n          onPointerLeave={() => setHovered(false)}\n          onFocus={() => setFocusWithin(true)}\n          onBlur={(e) => {\n            if (!e.currentTarget.contains(e.relatedTarget as Node | null)) setFocusWithin(false)\n          }}\n        >\n          {visible.map((t) => (\n            <ToastItem\n              key={t.id}\n              toast={t}\n              paused={paused}\n              closeLabel={closeLabel}\n              fromTop={position.startsWith(\"top\")}\n              onFocusLost={() => setFocusWithin(false)}\n            />\n          ))}\n        </ol>\n      </section>\n    </>\n  )\n\n  return host && hydrated ? createPortal(content, host) : null\n}\nToaster.displayName = \"Toaster\"\n\n/** Moves the host next to the topmost modal dialog (or body) and shows or hides the container. */\nfunction placeHost(host: HTMLElement, container: HTMLElement, hasToasts: boolean, promote: boolean) {\n  const target = topModalDialog() ?? document.body\n  let moved = false\n  if (host.parentElement !== target) {\n    // Moving a shown popover out of the document hides it; it is shown again below.\n    target.appendChild(host)\n    moved = true\n  }\n  if (!hasToasts) {\n    if (isPopoverOpen(container)) container.hidePopover()\n    return\n  }\n  if (!isPopoverOpen(container)) {\n    container.showPopover()\n  } else if (promote && !moved && hasOtherTopLayer(container)) {\n    // Showing again puts the container last in the top layer, so it paints above menus and dialogs.\n    container.hidePopover()\n    container.showPopover()\n  }\n}\n\nconst containsDialog = (node: Node) =>\n  node.nodeName === \"DIALOG\" || (node instanceof Element && node.querySelector(\"dialog\") !== null)\n\n/** True when a mutation record opened/closed, added or removed a dialog. */\nfunction involvesDialog(record: MutationRecord) {\n  if (record.type === \"attributes\") return record.target.nodeName === \"DIALOG\"\n  return Array.from(record.addedNodes).some(containsDialog) || Array.from(record.removedNodes).some(containsDialog)\n}\n\nfunction hasOtherTopLayer(container: HTMLElement) {\n  if (document.querySelector(\"dialog:modal\")) return true\n  try {\n    return Array.from(document.querySelectorAll(\":popover-open\")).some((el) => el !== container)\n  } catch {\n    return false\n  }\n}\n\ninterface ToastItemProps {\n  toast: ToastData\n  paused: boolean\n  closeLabel: string\n  fromTop: boolean\n  /** The focused toast was removed and no other toast could take focus. */\n  onFocusLost: () => void\n}\n\nfunction ToastItem({ toast: t, paused, closeLabel, fromTop, onFocusLost }: ToastItemProps) {\n  const liRef = useRef<HTMLLIElement>(null)\n  const remaining = useRef(t.duration)\n  const onFocusLostRef = useRef(onFocusLost)\n  useEffect(() => {\n    onFocusLostRef.current = onFocusLost\n  })\n\n  // Removing a focused element fires no blur, so the list would stay \"focused\" (and paused) forever.\n  // Runs before React detaches the node. Keyboard users get focus on the next toast; after a\n  // mouse click focus is simply released, so the remaining toasts keep their timers.\n  useLayoutEffect(() => {\n    const li = liRef.current\n    return () => {\n      if (!li || !li.contains(document.activeElement)) return\n      const keyboard = li.querySelector(\":focus-visible\") !== null\n      const next = Array.from(li.parentElement?.children ?? []).find((el) => el !== li && !el.hasAttribute(\"data-leaving\"))\n      const target = next?.querySelector<HTMLElement>(\"button[aria-label]\")\n      if (keyboard && target) {\n        target.focus()\n        return\n      }\n      ;(document.activeElement as HTMLElement | null)?.blur()\n      onFocusLostRef.current()\n    }\n  }, [])\n  const version = useRef(t.version)\n\n  // Auto-dismiss. Pausing keeps the time left; an update restarts it.\n  useEffect(() => {\n    if (version.current !== t.version) {\n      version.current = t.version\n      remaining.current = t.duration\n    }\n    if (paused || t.leaving || !Number.isFinite(t.duration)) return\n    const start = Date.now()\n    const timer = setTimeout(() => toast.dismiss(t.id), remaining.current)\n    return () => {\n      clearTimeout(timer)\n      remaining.current -= Date.now() - start\n    }\n  }, [paused, t.id, t.version, t.duration, t.leaving])\n\n  return (\n    <li\n      ref={liRef}\n      data-leaving={t.leaving || undefined}\n      className={cn(\n        // Same colours as Alert; no role here, the live regions above announce it.\n        alertVariants({ variant: t.variant }),\n        \"items-start pr-10 shadow-glob-md\",\n        \"transition-[opacity,translate] transition-discrete duration-200 ease-out\",\n        fromTop ? \"starting:-translate-y-2\" : \"starting:translate-y-2\",\n        \"starting:opacity-0 data-leaving:opacity-0 motion-reduce:transition-none\"\n      )}\n    >\n      <AlertIcon variant={t.variant} />\n      <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n        {t.title != null && <div className=\"font-medium leading-5\">{t.title}</div>}\n        {t.description != null && <div className=\"leading-5 text-glob-text-secondary\">{t.description}</div>}\n        {t.action && (\n          <button\n            type=\"button\"\n            onClick={(e) => {\n              t.action?.onClick(e)\n              if (!e.defaultPrevented) toast.dismiss(t.id)\n            }}\n            className=\"mt-1 self-start rounded-glob-sm border border-glob-border bg-glob-surface px-2 py-1 text-xs font-medium text-glob-text hover:bg-glob-surface-hover focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-glob-ring\"\n          >\n            {t.action.label}\n          </button>\n        )}\n      </div>\n      <button\n        type=\"button\"\n        aria-label={closeLabel}\n        onClick={() => toast.dismiss(t.id)}\n        className=\"absolute right-2 top-2 flex h-6 w-6 items-center justify-center rounded-glob-sm text-glob-text-secondary hover:bg-glob-surface-hover hover:text-glob-text focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-glob-ring\"\n      >\n        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" className=\"h-3.5 w-3.5\" aria-hidden=\"true\">\n          <path d=\"M18 6L6 18M6 6l12 12\" />\n        </svg>\n      </button>\n    </li>\n  )\n}\n\nexport { Toaster }\n"],"mappings":"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","names":[]}

package/dist/toaster.mjs

@@ -0,0 +1,252 @@
+"use client";
+
+// src/toaster.tsx
+import { useEffect, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
+import { createPortal } from "react-dom";
+import { cn } from "@glob-ui/utils";
+import { AlertIcon, alertVariants } from "@glob-ui/alert";
+import { toast, toastStore } from "./store.mjs";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var positionClasses = {
+  "top-left": "top-0 left-0",
+  "top-center": "top-0 left-1/2 -translate-x-1/2",
+  "top-right": "top-0 right-0",
+  "bottom-left": "bottom-0 left-0",
+  "bottom-center": "bottom-0 left-1/2 -translate-x-1/2",
+  "bottom-right": "bottom-0 right-0"
+};
+var isUrgent = (t) => t.variant === "warning" || t.variant === "danger";
+function isPopoverOpen(el) {
+  try {
+    return el.matches(":popover-open");
+  } catch (e) {
+    return false;
+  }
+}
+function topModalDialog() {
+  var _a;
+  const modals = document.querySelectorAll("dialog:modal");
+  return (_a = modals[modals.length - 1]) != null ? _a : null;
+}
+var subscribeNothing = () => () => {
+};
+var subscribeVisibility = (cb) => {
+  document.addEventListener("visibilitychange", cb);
+  return () => document.removeEventListener("visibilitychange", cb);
+};
+function Toaster({
+  position = "bottom-right",
+  max = 3,
+  closeLabel = "Close notification",
+  label = "Notifications",
+  className
+}) {
+  const toasts = useSyncExternalStore(toastStore.subscribe, toastStore.getSnapshot, toastStore.getServerSnapshot);
+  const hidden = useSyncExternalStore(subscribeVisibility, () => document.hidden, () => false);
+  const hydrated = useSyncExternalStore(subscribeNothing, () => true, () => false);
+  const [hovered, setHovered] = useState(false);
+  const [focusWithin, setFocusWithin] = useState(false);
+  const [host] = useState(() => {
+    if (typeof document === "undefined") return null;
+    const el = document.createElement("div");
+    el.dataset.globToaster = "";
+    el.style.display = "contents";
+    return el;
+  });
+  const containerRef = useRef(null);
+  const shownIds = useRef(/* @__PURE__ */ new Set());
+  const visible = useMemo(() => toasts.slice(0, max), [toasts, max]);
+  const active = visible.length > 0;
+  const paused = hovered || focusWithin || hidden;
+  useLayoutEffect(() => {
+    if (!host) return;
+    document.body.appendChild(host);
+    return () => host.remove();
+  }, [host]);
+  useLayoutEffect(() => {
+    const container = containerRef.current;
+    if (!host || !container) return;
+    const newIds = visible.filter((t) => !shownIds.current.has(t.id));
+    shownIds.current = new Set(visible.map((t) => t.id));
+    placeHost(host, container, visible.length > 0, newIds.length > 0);
+  }, [host, hydrated, visible]);
+  useLayoutEffect(() => {
+    const container = containerRef.current;
+    if (!host || !container || !active) return;
+    const observer = new MutationObserver((records) => {
+      if (host.isConnected && !records.some(involvesDialog)) return;
+      placeHost(host, container, true, false);
+    });
+    observer.observe(document.body, { subtree: true, childList: true, attributes: true, attributeFilter: ["open"] });
+    return () => observer.disconnect();
+  }, [host, hydrated, active]);
+  const regionText = (urgent) => visible.filter((t) => !t.leaving && isUrgent(t) === urgent).map((t) => /* @__PURE__ */ jsxs("div", { children: [
+    t.title,
+    " ",
+    t.description
+  ] }, `${t.id}:${t.version}`));
+  const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { role: "status", "aria-live": "polite", "aria-atomic": "false", className: "sr-only", children: regionText(false) }),
+    /* @__PURE__ */ jsx("div", { role: "alert", "aria-live": "assertive", "aria-atomic": "false", className: "sr-only", children: regionText(true) }),
+    /* @__PURE__ */ jsx(
+      "section",
+      {
+        ref: containerRef,
+        popover: "manual",
+        "aria-label": label,
+        className: cn(
+          // Reset the UA popover box. The container itself ignores the pointer; toasts do not.
+          "pointer-events-none fixed inset-auto m-0 w-full max-w-sm overflow-visible border-0 bg-transparent p-4",
+          "transition-[display,overlay] transition-discrete duration-200",
+          positionClasses[position],
+          className
+        ),
+        children: /* @__PURE__ */ jsx(
+          "ol",
+          {
+            className: "pointer-events-auto flex flex-col gap-2",
+            onPointerEnter: () => setHovered(true),
+            onPointerLeave: () => setHovered(false),
+            onFocus: () => setFocusWithin(true),
+            onBlur: (e) => {
+              if (!e.currentTarget.contains(e.relatedTarget)) setFocusWithin(false);
+            },
+            children: visible.map((t) => /* @__PURE__ */ jsx(
+              ToastItem,
+              {
+                toast: t,
+                paused,
+                closeLabel,
+                fromTop: position.startsWith("top"),
+                onFocusLost: () => setFocusWithin(false)
+              },
+              t.id
+            ))
+          }
+        )
+      }
+    )
+  ] });
+  return host && hydrated ? createPortal(content, host) : null;
+}
+Toaster.displayName = "Toaster";
+function placeHost(host, container, hasToasts, promote) {
+  var _a;
+  const target = (_a = topModalDialog()) != null ? _a : document.body;
+  let moved = false;
+  if (host.parentElement !== target) {
+    target.appendChild(host);
+    moved = true;
+  }
+  if (!hasToasts) {
+    if (isPopoverOpen(container)) container.hidePopover();
+    return;
+  }
+  if (!isPopoverOpen(container)) {
+    container.showPopover();
+  } else if (promote && !moved && hasOtherTopLayer(container)) {
+    container.hidePopover();
+    container.showPopover();
+  }
+}
+var containsDialog = (node) => node.nodeName === "DIALOG" || node instanceof Element && node.querySelector("dialog") !== null;
+function involvesDialog(record) {
+  if (record.type === "attributes") return record.target.nodeName === "DIALOG";
+  return Array.from(record.addedNodes).some(containsDialog) || Array.from(record.removedNodes).some(containsDialog);
+}
+function hasOtherTopLayer(container) {
+  if (document.querySelector("dialog:modal")) return true;
+  try {
+    return Array.from(document.querySelectorAll(":popover-open")).some((el) => el !== container);
+  } catch (e) {
+    return false;
+  }
+}
+function ToastItem({ toast: t, paused, closeLabel, fromTop, onFocusLost }) {
+  const liRef = useRef(null);
+  const remaining = useRef(t.duration);
+  const onFocusLostRef = useRef(onFocusLost);
+  useEffect(() => {
+    onFocusLostRef.current = onFocusLost;
+  });
+  useLayoutEffect(() => {
+    const li = liRef.current;
+    return () => {
+      var _a, _b, _c;
+      if (!li || !li.contains(document.activeElement)) return;
+      const keyboard = li.querySelector(":focus-visible") !== null;
+      const next = Array.from((_b = (_a = li.parentElement) == null ? void 0 : _a.children) != null ? _b : []).find((el) => el !== li && !el.hasAttribute("data-leaving"));
+      const target = next == null ? void 0 : next.querySelector("button[aria-label]");
+      if (keyboard && target) {
+        target.focus();
+        return;
+      }
+      ;
+      (_c = document.activeElement) == null ? void 0 : _c.blur();
+      onFocusLostRef.current();
+    };
+  }, []);
+  const version = useRef(t.version);
+  useEffect(() => {
+    if (version.current !== t.version) {
+      version.current = t.version;
+      remaining.current = t.duration;
+    }
+    if (paused || t.leaving || !Number.isFinite(t.duration)) return;
+    const start = Date.now();
+    const timer = setTimeout(() => toast.dismiss(t.id), remaining.current);
+    return () => {
+      clearTimeout(timer);
+      remaining.current -= Date.now() - start;
+    };
+  }, [paused, t.id, t.version, t.duration, t.leaving]);
+  return /* @__PURE__ */ jsxs(
+    "li",
+    {
+      ref: liRef,
+      "data-leaving": t.leaving || void 0,
+      className: cn(
+        // Same colours as Alert; no role here, the live regions above announce it.
+        alertVariants({ variant: t.variant }),
+        "items-start pr-10 shadow-glob-md",
+        "transition-[opacity,translate] transition-discrete duration-200 ease-out",
+        fromTop ? "starting:-translate-y-2" : "starting:translate-y-2",
+        "starting:opacity-0 data-leaving:opacity-0 motion-reduce:transition-none"
+      ),
+      children: [
+        /* @__PURE__ */ jsx(AlertIcon, { variant: t.variant }),
+        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [
+          t.title != null && /* @__PURE__ */ jsx("div", { className: "font-medium leading-5", children: t.title }),
+          t.description != null && /* @__PURE__ */ jsx("div", { className: "leading-5 text-glob-text-secondary", children: t.description }),
+          t.action && /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: (e) => {
+                var _a;
+                (_a = t.action) == null ? void 0 : _a.onClick(e);
+                if (!e.defaultPrevented) toast.dismiss(t.id);
+              },
+              className: "mt-1 self-start rounded-glob-sm border border-glob-border bg-glob-surface px-2 py-1 text-xs font-medium text-glob-text hover:bg-glob-surface-hover focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-glob-ring",
+              children: t.action.label
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "aria-label": closeLabel,
+            onClick: () => toast.dismiss(t.id),
+            className: "absolute right-2 top-2 flex h-6 w-6 items-center justify-center rounded-glob-sm text-glob-text-secondary hover:bg-glob-surface-hover hover:text-glob-text focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-glob-ring",
+            children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", className: "h-3.5 w-3.5", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M18 6L6 18M6 6l12 12" }) })
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  Toaster
+};
+//# sourceMappingURL=toaster.mjs.map

package/dist/toaster.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/toaster.tsx"],"sourcesContent":["\"use client\"\n\nimport { useEffect, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from \"react\"\nimport { createPortal } from \"react-dom\"\nimport { cn } from \"@glob-ui/utils\"\nimport { AlertIcon, alertVariants } from \"@glob-ui/alert\"\nimport { toast, toastStore, type ToastData } from \"./store\"\n\nexport type ToasterPosition = \"top-left\" | \"top-center\" | \"top-right\" | \"bottom-left\" | \"bottom-center\" | \"bottom-right\"\n\nexport interface ToasterProps {\n  position?: ToasterPosition\n  /** Toasts on screen at once. The rest wait in a queue. */\n  max?: number\n  /** Accessible name of each toast's close button. */\n  closeLabel?: string\n  /** Accessible name of the notification list. */\n  label?: string\n  className?: string\n}\n\nconst positionClasses: Record<ToasterPosition, string> = {\n  \"top-left\": \"top-0 left-0\",\n  \"top-center\": \"top-0 left-1/2 -translate-x-1/2\",\n  \"top-right\": \"top-0 right-0\",\n  \"bottom-left\": \"bottom-0 left-0\",\n  \"bottom-center\": \"bottom-0 left-1/2 -translate-x-1/2\",\n  \"bottom-right\": \"bottom-0 right-0\",\n}\n\nconst isUrgent = (t: ToastData) => t.variant === \"warning\" || t.variant === \"danger\"\n\nfunction isPopoverOpen(el: HTMLElement) {\n  try {\n    return el.matches(\":popover-open\")\n  } catch {\n    return false\n  }\n}\n\n/** Topmost open modal dialog. Everything outside it is inert, so toasts must live inside it. */\nfunction topModalDialog() {\n  const modals = document.querySelectorAll<HTMLDialogElement>(\"dialog:modal\")\n  return modals[modals.length - 1] ?? null\n}\n\nconst subscribeNothing = () => () => {}\n\nconst subscribeVisibility = (cb: () => void) => {\n  document.addEventListener(\"visibilitychange\", cb)\n  return () => document.removeEventListener(\"visibilitychange\", cb)\n}\n\nfunction Toaster({\n  position = \"bottom-right\",\n  max = 3,\n  closeLabel = \"Close notification\",\n  label = \"Notifications\",\n  className,\n}: ToasterProps) {\n  const toasts = useSyncExternalStore(toastStore.subscribe, toastStore.getSnapshot, toastStore.getServerSnapshot)\n  const hidden = useSyncExternalStore(subscribeVisibility, () => document.hidden, () => false)\n  // False during SSR and hydration, true after: the server HTML has no toaster markup to match.\n  const hydrated = useSyncExternalStore(subscribeNothing, () => true, () => false)\n  const [hovered, setHovered] = useState(false)\n  const [focusWithin, setFocusWithin] = useState(false)\n  // A host node we move between <body> and the topmost modal dialog. React only owns its children.\n  // Null on the server. The portal is rendered only after hydration (see `hydrated`).\n  const [host] = useState(() => {\n    if (typeof document === \"undefined\") return null\n    const el = document.createElement(\"div\")\n    el.dataset.globToaster = \"\"\n    el.style.display = \"contents\"\n    return el\n  })\n  const containerRef = useRef<HTMLElement>(null)\n  const shownIds = useRef(new Set<string>())\n\n  const visible = useMemo(() => toasts.slice(0, max), [toasts, max])\n  const active = visible.length > 0\n  const paused = hovered || focusWithin || hidden\n\n  useLayoutEffect(() => {\n    if (!host) return\n    document.body.appendChild(host)\n    return () => host.remove()\n  }, [host])\n\n  // Keep the host where it is not inert, and the container above other top-layer elements.\n  // Runs when the visible toasts change; promotes the container when new ones arrive.\n  useLayoutEffect(() => {\n    const container = containerRef.current\n    if (!host || !container) return\n    const newIds = visible.filter((t) => !shownIds.current.has(t.id))\n    shownIds.current = new Set(visible.map((t) => t.id))\n    placeHost(host, container, visible.length > 0, newIds.length > 0)\n  }, [host, hydrated, visible])\n\n  // Dialogs opening, closing or unmounting change where the host must be. Only watched while\n  // toasts are on screen; with none, nothing observes the document.\n  useLayoutEffect(() => {\n    const container = containerRef.current\n    if (!host || !container || !active) return\n    const observer = new MutationObserver((records) => {\n      if (host.isConnected && !records.some(involvesDialog)) return\n      placeHost(host, container, true, false)\n    })\n    observer.observe(document.body, { subtree: true, childList: true, attributes: true, attributeFilter: [\"open\"] })\n    return () => observer.disconnect()\n  }, [host, hydrated, active])\n\n  const regionText = (urgent: boolean) =>\n    visible\n      .filter((t) => !t.leaving && isUrgent(t) === urgent)\n      .map((t) => (\n        <div key={`${t.id}:${t.version}`}>\n          {t.title} {t.description}\n        </div>\n      ))\n\n  const content = (\n    <>\n      {/* Always mounted so screen readers track them before the first toast arrives. */}\n      <div role=\"status\" aria-live=\"polite\" aria-atomic=\"false\" className=\"sr-only\">\n        {regionText(false)}\n      </div>\n      <div role=\"alert\" aria-live=\"assertive\" aria-atomic=\"false\" className=\"sr-only\">\n        {regionText(true)}\n      </div>\n      <section\n        ref={containerRef}\n        popover=\"manual\"\n        aria-label={label}\n        className={cn(\n          // Reset the UA popover box. The container itself ignores the pointer; toasts do not.\n          \"pointer-events-none fixed inset-auto m-0 w-full max-w-sm overflow-visible border-0 bg-transparent p-4\",\n          \"transition-[display,overlay] transition-discrete duration-200\",\n          positionClasses[position],\n          className\n        )}\n      >\n        <ol\n          className=\"pointer-events-auto flex flex-col gap-2\"\n          onPointerEnter={() => setHovered(true)}\n          onPointerLeave={() => setHovered(false)}\n          onFocus={() => setFocusWithin(true)}\n          onBlur={(e) => {\n            if (!e.currentTarget.contains(e.relatedTarget as Node | null)) setFocusWithin(false)\n          }}\n        >\n          {visible.map((t) => (\n            <ToastItem\n              key={t.id}\n              toast={t}\n              paused={paused}\n              closeLabel={closeLabel}\n              fromTop={position.startsWith(\"top\")}\n              onFocusLost={() => setFocusWithin(false)}\n            />\n          ))}\n        </ol>\n      </section>\n    </>\n  )\n\n  return host && hydrated ? createPortal(content, host) : null\n}\nToaster.displayName = \"Toaster\"\n\n/** Moves the host next to the topmost modal dialog (or body) and shows or hides the container. */\nfunction placeHost(host: HTMLElement, container: HTMLElement, hasToasts: boolean, promote: boolean) {\n  const target = topModalDialog() ?? document.body\n  let moved = false\n  if (host.parentElement !== target) {\n    // Moving a shown popover out of the document hides it; it is shown again below.\n    target.appendChild(host)\n    moved = true\n  }\n  if (!hasToasts) {\n    if (isPopoverOpen(container)) container.hidePopover()\n    return\n  }\n  if (!isPopoverOpen(container)) {\n    container.showPopover()\n  } else if (promote && !moved && hasOtherTopLayer(container)) {\n    // Showing again puts the container last in the top layer, so it paints above menus and dialogs.\n    container.hidePopover()\n    container.showPopover()\n  }\n}\n\nconst containsDialog = (node: Node) =>\n  node.nodeName === \"DIALOG\" || (node instanceof Element && node.querySelector(\"dialog\") !== null)\n\n/** True when a mutation record opened/closed, added or removed a dialog. */\nfunction involvesDialog(record: MutationRecord) {\n  if (record.type === \"attributes\") return record.target.nodeName === \"DIALOG\"\n  return Array.from(record.addedNodes).some(containsDialog) || Array.from(record.removedNodes).some(containsDialog)\n}\n\nfunction hasOtherTopLayer(container: HTMLElement) {\n  if (document.querySelector(\"dialog:modal\")) return true\n  try {\n    return Array.from(document.querySelectorAll(\":popover-open\")).some((el) => el !== container)\n  } catch {\n    return false\n  }\n}\n\ninterface ToastItemProps {\n  toast: ToastData\n  paused: boolean\n  closeLabel: string\n  fromTop: boolean\n  /** The focused toast was removed and no other toast could take focus. */\n  onFocusLost: () => void\n}\n\nfunction ToastItem({ toast: t, paused, closeLabel, fromTop, onFocusLost }: ToastItemProps) {\n  const liRef = useRef<HTMLLIElement>(null)\n  const remaining = useRef(t.duration)\n  const onFocusLostRef = useRef(onFocusLost)\n  useEffect(() => {\n    onFocusLostRef.current = onFocusLost\n  })\n\n  // Removing a focused element fires no blur, so the list would stay \"focused\" (and paused) forever.\n  // Runs before React detaches the node. Keyboard users get focus on the next toast; after a\n  // mouse click focus is simply released, so the remaining toasts keep their timers.\n  useLayoutEffect(() => {\n    const li = liRef.current\n    return () => {\n      if (!li || !li.contains(document.activeElement)) return\n      const keyboard = li.querySelector(\":focus-visible\") !== null\n      const next = Array.from(li.parentElement?.children ?? []).find((el) => el !== li && !el.hasAttribute(\"data-leaving\"))\n      const target = next?.querySelector<HTMLElement>(\"button[aria-label]\")\n      if (keyboard && target) {\n        target.focus()\n        return\n      }\n      ;(document.activeElement as HTMLElement | null)?.blur()\n      onFocusLostRef.current()\n    }\n  }, [])\n  const version = useRef(t.version)\n\n  // Auto-dismiss. Pausing keeps the time left; an update restarts it.\n  useEffect(() => {\n    if (version.current !== t.version) {\n      version.current = t.version\n      remaining.current = t.duration\n    }\n    if (paused || t.leaving || !Number.isFinite(t.duration)) return\n    const start = Date.now()\n    const timer = setTimeout(() => toast.dismiss(t.id), remaining.current)\n    return () => {\n      clearTimeout(timer)\n      remaining.current -= Date.now() - start\n    }\n  }, [paused, t.id, t.version, t.duration, t.leaving])\n\n  return (\n    <li\n      ref={liRef}\n      data-leaving={t.leaving || undefined}\n      className={cn(\n        // Same colours as Alert; no role here, the live regions above announce it.\n        alertVariants({ variant: t.variant }),\n        \"items-start pr-10 shadow-glob-md\",\n        \"transition-[opacity,translate] transition-discrete duration-200 ease-out\",\n        fromTop ? \"starting:-translate-y-2\" : \"starting:translate-y-2\",\n        \"starting:opacity-0 data-leaving:opacity-0 motion-reduce:transition-none\"\n      )}\n    >\n      <AlertIcon variant={t.variant} />\n      <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n        {t.title != null && <div className=\"font-medium leading-5\">{t.title}</div>}\n        {t.description != null && <div className=\"leading-5 text-glob-text-secondary\">{t.description}</div>}\n        {t.action && (\n          <button\n            type=\"button\"\n            onClick={(e) => {\n              t.action?.onClick(e)\n              if (!e.defaultPrevented) toast.dismiss(t.id)\n            }}\n            className=\"mt-1 self-start rounded-glob-sm border border-glob-border bg-glob-surface px-2 py-1 text-xs font-medium text-glob-text hover:bg-glob-surface-hover focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-glob-ring\"\n          >\n            {t.action.label}\n          </button>\n        )}\n      </div>\n      <button\n        type=\"button\"\n        aria-label={closeLabel}\n        onClick={() => toast.dismiss(t.id)}\n        className=\"absolute right-2 top-2 flex h-6 w-6 items-center justify-center rounded-glob-sm text-glob-text-secondary hover:bg-glob-surface-hover hover:text-glob-text focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-glob-ring\"\n      >\n        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" className=\"h-3.5 w-3.5\" aria-hidden=\"true\">\n          <path d=\"M18 6L6 18M6 6l12 12\" />\n        </svg>\n      </button>\n    </li>\n  )\n}\n\nexport { Toaster }\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,6 +1,69 @@
 {
   "name": "@glob-ui/toast",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.2.0",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.mts",
+        "default": "./dist/index.mjs"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      }
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist/",
+    "LICENSE",
+    "README.md"
+  ],
+  "peerDependencies": {
+    "react": "^19",
+    "react-dom": "^19"
+  },
+  "dependencies": {
+    "@glob-ui/alert": "0.2.0",
+    "@glob-ui/utils": "0.2.0"
+  },
+  "devDependencies": {
+    "tsup": "^8.5.1"
+  },
+  "description": "Short, timed messages. Call `toast()` from anywhere, and mount `<Toaster />` once.",
+  "keywords": [
+    "react",
+    "glob-ui",
+    "components",
+    "accessible",
+    "tailwind",
+    "toast"
+  ],
+  "license": "MIT",
+  "author": "Kevin Martínez E",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/kevin-martineze/GlobUI.git",
+    "directory": "packages/toast"
+  },
+  "homepage": "https://github.com/kevin-martineze/GlobUI#readme",
+  "bugs": {
+    "url": "https://github.com/kevin-martineze/GlobUI/issues"
+  },
+  "publishConfig": {
+    "access": "public",
+    "provenance": true
+  },
+  "sideEffects": false,
+  "type": "commonjs",
+  "engines": {
+    "node": ">=18.18"
+  },
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch --no-clean"
+  }
 }