@zag-js/toast 0.1.16 → 0.2.1

package/dist/index.d.ts

@@ -170,7 +170,7 @@ declare function groupConnect<T extends PropTypes>(state: GroupState, send: Grou
     subscribe(fn: (toasts: GroupMachineContext["toasts"]) => void): () => void;
 };
 
-declare function groupMachine(ctx: UserDefinedGroupContext): _zag_js_core.Machine<GroupMachineContext, _zag_js_core.StateMachine.StateSchema, _zag_js_core.StateMachine.AnyEventObject>;
+declare function groupMachine(userContext: UserDefinedGroupContext): _zag_js_core.Machine<GroupMachineContext, _zag_js_core.StateMachine.StateSchema, _zag_js_core.StateMachine.AnyEventObject>;
 
 declare function createToastMachine(options?: Options): _zag_js_core.Machine<MachineContext, MachineState, _zag_js_core.StateMachine.AnyEventObject>;
 

package/dist/index.js

@@ -34,7 +34,7 @@ var dataAttr = (guard) => {
 var MAX_Z_INDEX = 2147483647;
 var runIfFn = (v, ...a) => {
   const res = typeof v === "function" ? v(...a) : v;
-  return res ?? void 0;
+  return res != null ? res : void 0;
 };
 var cast = (v) => v;
 var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
@@ -46,22 +46,44 @@ function isWindow(value) {
   return (value == null ? void 0 : value.toString()) === "[object Window]";
 }
 function getDocument(el) {
+  var _a;
   if (isWindow(el))
     return el.document;
   if (isDocument(el))
     return el;
-  return (el == null ? void 0 : el.ownerDocument) ?? document;
+  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
 }
 function defineDomHelpers(helpers) {
   const dom2 = {
     getRootNode: (ctx) => {
-      var _a;
-      return ((_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) ?? document;
+      var _a, _b;
+      return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
     },
     getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
-    getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
+    getWin: (ctx) => {
+      var _a;
+      return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
+    },
     getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
-    getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
+    getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id),
+    createEmitter: (ctx, target) => {
+      const win = dom2.getWin(ctx);
+      return function emit(evt, detail, options) {
+        const { bubbles = true, cancelable, composed = true } = options != null ? options : {};
+        const eventName = `zag:${evt}`;
+        const init = { bubbles, cancelable, composed, detail };
+        const event = new win.CustomEvent(eventName, init);
+        target.dispatchEvent(event);
+      };
+    },
+    createListener: (target) => {
+      return function listen(evt, handler) {
+        const eventName = `zag:${evt}`;
+        const listener = (e) => handler(e);
+        target.addEventListener(eventName, listener);
+        return () => target.removeEventListener(eventName, listener);
+      };
+    }
   };
   return {
     ...dom2,
@@ -87,7 +109,7 @@ function trackDocumentVisibility(_doc, callback) {
 // ../../utilities/core/dist/index.mjs
 var runIfFn2 = (v, ...a) => {
   const res = typeof v === "function" ? v(...a) : v;
-  return res ?? void 0;
+  return res != null ? res : void 0;
 };
 var uuid = /* @__PURE__ */ (() => {
   let id = 0;
@@ -96,6 +118,15 @@ var uuid = /* @__PURE__ */ (() => {
     return id.toString(36);
   };
 })();
+var isArray = (v) => Array.isArray(v);
+var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
+function compact(obj) {
+  if (obj === void 0)
+    return obj;
+  return Object.fromEntries(
+    Object.entries(obj).filter(([, value]) => value !== void 0).map(([key, value]) => [key, isObject(value) ? compact(value) : value])
+  );
+}
 function warn(...a) {
   const m = a.length === 1 ? a[0] : a[1];
   const c = a.length === 2 ? a[0] : true;
@@ -144,7 +175,7 @@ var defaultTimeouts = {
   custom: 5e3
 };
 function getToastDuration(duration, type) {
-  return duration ?? defaultTimeouts[type];
+  return duration != null ? duration : defaultTimeouts[type];
 }
 function getGroupPlacementStyle(ctx, placement) {
   const offset = ctx.offsets;
@@ -316,8 +347,9 @@ var import_core3 = require("@zag-js/core");
 var import_core2 = require("@zag-js/core");
 var { not, and, or } = import_core2.guards;
 function createToastMachine(options = {}) {
-  const { type = "info", duration, id = "toast", placement = "bottom", removeDelay = 500, ...rest } = options;
-  const __duration = getToastDuration(duration, type);
+  const { type = "info", duration, id = "toast", placement = "bottom", removeDelay = 500, ...restProps } = options;
+  const ctx = compact(restProps);
+  const computedDuration = getToastDuration(duration, type);
   return (0, import_core2.createMachine)(
     {
       id,
@@ -326,12 +358,12 @@ function createToastMachine(options = {}) {
       context: {
         id,
         type,
-        remaining: __duration,
-        duration: __duration,
+        remaining: computedDuration,
+        duration: computedDuration,
         removeDelay,
         createdAt: Date.now(),
         placement,
-        ...rest
+        ...ctx
       },
       on: {
         UPDATE: [
@@ -400,10 +432,10 @@ function createToastMachine(options = {}) {
     },
     {
       activities: {
-        trackDocumentVisibility(ctx, _evt, { send }) {
-          if (!ctx.pauseOnPageIdle)
+        trackDocumentVisibility(ctx2, _evt, { send }) {
+          if (!ctx2.pauseOnPageIdle)
             return;
-          return trackDocumentVisibility(dom.getDoc(ctx), function(hidden) {
+          return trackDocumentVisibility(dom.getDoc(ctx2), function(hidden) {
             send(hidden ? "PAUSE" : "RESUME");
           });
         }
@@ -413,50 +445,50 @@ function createToastMachine(options = {}) {
           var _a;
           return ((_a = evt.toast) == null ? void 0 : _a.type) === "loading";
         },
-        isLoadingType: (ctx) => ctx.type === "loading",
-        hasTypeChanged: (ctx, evt) => {
+        isLoadingType: (ctx2) => ctx2.type === "loading",
+        hasTypeChanged: (ctx2, evt) => {
           var _a;
-          return ((_a = evt.toast) == null ? void 0 : _a.type) !== ctx.type;
+          return ((_a = evt.toast) == null ? void 0 : _a.type) !== ctx2.type;
         },
-        hasDurationChanged: (ctx, evt) => {
+        hasDurationChanged: (ctx2, evt) => {
           var _a;
-          return ((_a = evt.toast) == null ? void 0 : _a.duration) !== ctx.duration;
+          return ((_a = evt.toast) == null ? void 0 : _a.duration) !== ctx2.duration;
         }
       },
       delays: {
-        VISIBLE_DURATION: (ctx) => ctx.remaining,
-        REMOVE_DELAY: (ctx) => ctx.removeDelay
+        VISIBLE_DURATION: (ctx2) => ctx2.remaining,
+        REMOVE_DELAY: (ctx2) => ctx2.removeDelay
       },
       actions: {
-        setRemainingDuration(ctx) {
-          ctx.remaining -= Date.now() - ctx.createdAt;
+        setRemainingDuration(ctx2) {
+          ctx2.remaining -= Date.now() - ctx2.createdAt;
         },
-        setCreatedAt(ctx) {
-          ctx.createdAt = Date.now();
+        setCreatedAt(ctx2) {
+          ctx2.createdAt = Date.now();
         },
         notifyParentToRemove(_ctx, _evt, { self }) {
           self.sendParent({ type: "REMOVE_TOAST", id: self.id });
         },
-        invokeOnClosing(ctx) {
+        invokeOnClosing(ctx2) {
           var _a;
-          (_a = ctx.onClosing) == null ? void 0 : _a.call(ctx);
+          (_a = ctx2.onClosing) == null ? void 0 : _a.call(ctx2);
         },
-        invokeOnClose(ctx) {
+        invokeOnClose(ctx2) {
           var _a;
-          (_a = ctx.onClose) == null ? void 0 : _a.call(ctx);
+          (_a = ctx2.onClose) == null ? void 0 : _a.call(ctx2);
         },
-        invokeOnOpen(ctx) {
+        invokeOnOpen(ctx2) {
           var _a;
-          (_a = ctx.onOpen) == null ? void 0 : _a.call(ctx);
+          (_a = ctx2.onOpen) == null ? void 0 : _a.call(ctx2);
         },
-        invokeOnUpdate(ctx) {
+        invokeOnUpdate(ctx2) {
           var _a;
-          (_a = ctx.onUpdate) == null ? void 0 : _a.call(ctx);
+          (_a = ctx2.onUpdate) == null ? void 0 : _a.call(ctx2);
         },
-        setContext(ctx, evt) {
+        setContext(ctx2, evt) {
           const { duration: duration2, type: type2 } = evt.toast;
           const time = getToastDuration(duration2, type2);
-          Object.assign(ctx, { ...evt.toast, duration: time, remaining: time });
+          Object.assign(ctx2, { ...evt.toast, duration: time, remaining: time });
         }
       }
     }
@@ -464,7 +496,8 @@ function createToastMachine(options = {}) {
 }
 
 // src/toast-group.machine.ts
-function groupMachine(ctx) {
+function groupMachine(userContext) {
+  const ctx = compact(userContext);
   return (0, import_core3.createMachine)({
     id: "toaster",
     initial: "active",

package/dist/index.mjs

@@ -5,7 +5,7 @@ var dataAttr = (guard) => {
 var MAX_Z_INDEX = 2147483647;
 var runIfFn = (v, ...a) => {
   const res = typeof v === "function" ? v(...a) : v;
-  return res ?? void 0;
+  return res != null ? res : void 0;
 };
 var cast = (v) => v;
 var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
@@ -17,22 +17,44 @@ function isWindow(value) {
   return (value == null ? void 0 : value.toString()) === "[object Window]";
 }
 function getDocument(el) {
+  var _a;
   if (isWindow(el))
     return el.document;
   if (isDocument(el))
     return el;
-  return (el == null ? void 0 : el.ownerDocument) ?? document;
+  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
 }
 function defineDomHelpers(helpers) {
   const dom2 = {
     getRootNode: (ctx) => {
-      var _a;
-      return ((_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) ?? document;
+      var _a, _b;
+      return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
     },
     getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
-    getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
+    getWin: (ctx) => {
+      var _a;
+      return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
+    },
     getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
-    getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
+    getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id),
+    createEmitter: (ctx, target) => {
+      const win = dom2.getWin(ctx);
+      return function emit(evt, detail, options) {
+        const { bubbles = true, cancelable, composed = true } = options != null ? options : {};
+        const eventName = `zag:${evt}`;
+        const init = { bubbles, cancelable, composed, detail };
+        const event = new win.CustomEvent(eventName, init);
+        target.dispatchEvent(event);
+      };
+    },
+    createListener: (target) => {
+      return function listen(evt, handler) {
+        const eventName = `zag:${evt}`;
+        const listener = (e) => handler(e);
+        target.addEventListener(eventName, listener);
+        return () => target.removeEventListener(eventName, listener);
+      };
+    }
   };
   return {
     ...dom2,
@@ -58,7 +80,7 @@ function trackDocumentVisibility(_doc, callback) {
 // ../../utilities/core/dist/index.mjs
 var runIfFn2 = (v, ...a) => {
   const res = typeof v === "function" ? v(...a) : v;
-  return res ?? void 0;
+  return res != null ? res : void 0;
 };
 var uuid = /* @__PURE__ */ (() => {
   let id = 0;
@@ -67,6 +89,15 @@ var uuid = /* @__PURE__ */ (() => {
     return id.toString(36);
   };
 })();
+var isArray = (v) => Array.isArray(v);
+var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
+function compact(obj) {
+  if (obj === void 0)
+    return obj;
+  return Object.fromEntries(
+    Object.entries(obj).filter(([, value]) => value !== void 0).map(([key, value]) => [key, isObject(value) ? compact(value) : value])
+  );
+}
 function warn(...a) {
   const m = a.length === 1 ? a[0] : a[1];
   const c = a.length === 2 ? a[0] : true;
@@ -115,7 +146,7 @@ var defaultTimeouts = {
   custom: 5e3
 };
 function getToastDuration(duration, type) {
-  return duration ?? defaultTimeouts[type];
+  return duration != null ? duration : defaultTimeouts[type];
 }
 function getGroupPlacementStyle(ctx, placement) {
   const offset = ctx.offsets;
@@ -287,8 +318,9 @@ import { createMachine as createMachine2 } from "@zag-js/core";
 import { createMachine, guards } from "@zag-js/core";
 var { not, and, or } = guards;
 function createToastMachine(options = {}) {
-  const { type = "info", duration, id = "toast", placement = "bottom", removeDelay = 500, ...rest } = options;
-  const __duration = getToastDuration(duration, type);
+  const { type = "info", duration, id = "toast", placement = "bottom", removeDelay = 500, ...restProps } = options;
+  const ctx = compact(restProps);
+  const computedDuration = getToastDuration(duration, type);
   return createMachine(
     {
       id,
@@ -297,12 +329,12 @@ function createToastMachine(options = {}) {
       context: {
         id,
         type,
-        remaining: __duration,
-        duration: __duration,
+        remaining: computedDuration,
+        duration: computedDuration,
         removeDelay,
         createdAt: Date.now(),
         placement,
-        ...rest
+        ...ctx
       },
       on: {
         UPDATE: [
@@ -371,10 +403,10 @@ function createToastMachine(options = {}) {
     },
     {
       activities: {
-        trackDocumentVisibility(ctx, _evt, { send }) {
-          if (!ctx.pauseOnPageIdle)
+        trackDocumentVisibility(ctx2, _evt, { send }) {
+          if (!ctx2.pauseOnPageIdle)
             return;
-          return trackDocumentVisibility(dom.getDoc(ctx), function(hidden) {
+          return trackDocumentVisibility(dom.getDoc(ctx2), function(hidden) {
             send(hidden ? "PAUSE" : "RESUME");
           });
         }
@@ -384,50 +416,50 @@ function createToastMachine(options = {}) {
           var _a;
           return ((_a = evt.toast) == null ? void 0 : _a.type) === "loading";
         },
-        isLoadingType: (ctx) => ctx.type === "loading",
-        hasTypeChanged: (ctx, evt) => {
+        isLoadingType: (ctx2) => ctx2.type === "loading",
+        hasTypeChanged: (ctx2, evt) => {
           var _a;
-          return ((_a = evt.toast) == null ? void 0 : _a.type) !== ctx.type;
+          return ((_a = evt.toast) == null ? void 0 : _a.type) !== ctx2.type;
         },
-        hasDurationChanged: (ctx, evt) => {
+        hasDurationChanged: (ctx2, evt) => {
           var _a;
-          return ((_a = evt.toast) == null ? void 0 : _a.duration) !== ctx.duration;
+          return ((_a = evt.toast) == null ? void 0 : _a.duration) !== ctx2.duration;
         }
       },
       delays: {
-        VISIBLE_DURATION: (ctx) => ctx.remaining,
-        REMOVE_DELAY: (ctx) => ctx.removeDelay
+        VISIBLE_DURATION: (ctx2) => ctx2.remaining,
+        REMOVE_DELAY: (ctx2) => ctx2.removeDelay
       },
       actions: {
-        setRemainingDuration(ctx) {
-          ctx.remaining -= Date.now() - ctx.createdAt;
+        setRemainingDuration(ctx2) {
+          ctx2.remaining -= Date.now() - ctx2.createdAt;
         },
-        setCreatedAt(ctx) {
-          ctx.createdAt = Date.now();
+        setCreatedAt(ctx2) {
+          ctx2.createdAt = Date.now();
         },
         notifyParentToRemove(_ctx, _evt, { self }) {
           self.sendParent({ type: "REMOVE_TOAST", id: self.id });
         },
-        invokeOnClosing(ctx) {
+        invokeOnClosing(ctx2) {
           var _a;
-          (_a = ctx.onClosing) == null ? void 0 : _a.call(ctx);
+          (_a = ctx2.onClosing) == null ? void 0 : _a.call(ctx2);
         },
-        invokeOnClose(ctx) {
+        invokeOnClose(ctx2) {
           var _a;
-          (_a = ctx.onClose) == null ? void 0 : _a.call(ctx);
+          (_a = ctx2.onClose) == null ? void 0 : _a.call(ctx2);
         },
-        invokeOnOpen(ctx) {
+        invokeOnOpen(ctx2) {
           var _a;
-          (_a = ctx.onOpen) == null ? void 0 : _a.call(ctx);
+          (_a = ctx2.onOpen) == null ? void 0 : _a.call(ctx2);
         },
-        invokeOnUpdate(ctx) {
+        invokeOnUpdate(ctx2) {
           var _a;
-          (_a = ctx.onUpdate) == null ? void 0 : _a.call(ctx);
+          (_a = ctx2.onUpdate) == null ? void 0 : _a.call(ctx2);
         },
-        setContext(ctx, evt) {
+        setContext(ctx2, evt) {
           const { duration: duration2, type: type2 } = evt.toast;
           const time = getToastDuration(duration2, type2);
-          Object.assign(ctx, { ...evt.toast, duration: time, remaining: time });
+          Object.assign(ctx2, { ...evt.toast, duration: time, remaining: time });
         }
       }
     }
@@ -435,7 +467,8 @@ function createToastMachine(options = {}) {
 }
 
 // src/toast-group.machine.ts
-function groupMachine(ctx) {
+function groupMachine(userContext) {
+  const ctx = compact(userContext);
   return createMachine2({
     id: "toaster",
     initial: "active",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/toast",
-  "version": "0.1.16",
+  "version": "0.2.1",
   "description": "Core logic for the toast widget implemented as a state machine",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -29,12 +29,12 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@zag-js/core": "0.1.12",
-    "@zag-js/types": "0.2.7"
+    "@zag-js/core": "0.2.1",
+    "@zag-js/types": "0.3.0"
   },
   "devDependencies": {
-    "@zag-js/dom-utils": "0.1.13",
-    "@zag-js/utils": "0.1.6"
+    "@zag-js/dom-utils": "0.2.0",
+    "@zag-js/utils": "0.3.0"
   },
   "scripts": {
     "build-fast": "tsup src/index.ts --format=esm,cjs",