@zag-js/toast 0.16.0 → 0.17.0

package/src/toast-group.connect.ts

@@ -4,43 +4,34 @@ import { runIfFn, uuid } from "@zag-js/utils"
 import { parts } from "./toast.anatomy"
 import { dom } from "./toast.dom"
 import type {
+  GroupMachineApi,
   GroupMachineContext,
   GroupProps,
   GroupSend,
   GroupState,
+  Options,
   Placement,
   PromiseOptions,
-  Toaster,
-  Options,
 } from "./toast.types"
 import { getGroupPlacementStyle, getToastsByPlacement } from "./toast.utils"
 
-export let toaster = {} as Toaster
+export let toaster = {} as GroupMachineApi
 
-export function groupConnect<T extends PropTypes>(state: GroupState, send: GroupSend, normalize: NormalizeProps<T>) {
+export function groupConnect<T extends PropTypes>(
+  state: GroupState,
+  send: GroupSend,
+  normalize: NormalizeProps<T>,
+): GroupMachineApi<T> {
+  //
   const group = {
-    /**
-     * The total number of toasts
-     */
     count: state.context.count,
-    /**
-     * The active toasts
-     */
     toasts: state.context.toasts,
-    /**
-     * The active toasts by placement
-     */
     toastsByPlacement: getToastsByPlacement(state.context.toasts),
-    /**
-     * Returns whether the toast id is visible
-     */
     isVisible(id: string) {
       if (!state.context.toasts.length) return false
       return !!state.context.toasts.find((toast) => toast.id == id)
     },
-    /**
-     * Function to create a toast.
-     */
+
     create(options: Options) {
       const uid = `toast:${uuid()}`
       const id = options.id ? options.id : uid
@@ -50,9 +41,7 @@ export function groupConnect<T extends PropTypes>(state: GroupState, send: Group
 
       return id
     },
-    /**
-     * Function to create or update a toast.
-     */
+
     upsert(options: Options) {
       const { id } = options
       const isVisible = id ? group.isVisible(id) : false
@@ -62,10 +51,7 @@ export function groupConnect<T extends PropTypes>(state: GroupState, send: Group
         return group.create(options)
       }
     },
-    /**
-     * Function to dismiss a toast by id.
-     * If no id is provided, all toasts will be dismissed.
-     */
+
     dismiss(id?: string) {
       if (id == null) {
         send("DISMISS_ALL")
@@ -73,10 +59,7 @@ export function groupConnect<T extends PropTypes>(state: GroupState, send: Group
         send({ type: "DISMISS_TOAST", id })
       }
     },
-    /**
-     * Function to remove a toast by id.
-     * If no id is provided, all toasts will be removed.
-     */
+
     remove(id?: string) {
       if (id == null) {
         send("REMOVE_ALL")
@@ -84,49 +67,35 @@ export function groupConnect<T extends PropTypes>(state: GroupState, send: Group
         send({ type: "REMOVE_TOAST", id })
       }
     },
-    /**
-     * Function to dismiss all toasts by placement.
-     */
+
     dismissByPlacement(placement: Placement) {
       const toasts = group.toastsByPlacement[placement]
       if (toasts) {
         toasts.forEach((toast) => group.dismiss(toast.id))
       }
     },
-    /**
-     * Function to update a toast's options by id.
-     */
+
     update(id: string, options: Options) {
       if (!group.isVisible(id)) return
       send({ type: "UPDATE_TOAST", id, toast: options })
       return id
     },
-    /**
-     * Function to create a loading toast.
-     */
+
     loading(options: Options) {
       options.type = "loading"
       return group.upsert(options)
     },
-    /**
-     * Function to create a success toast.
-     */
+
     success(options: Options) {
       options.type = "success"
       return group.upsert(options)
     },
-    /**
-     * Function to create an error toast.
-     */
+
     error(options: Options) {
       options.type = "error"
       return group.upsert(options)
     },
-    /**
-     * Function to create a toast from a promise.
-     * - When the promise resolves, the toast will be updated with the success options.
-     * - When the promise rejects, the toast will be updated with the error options.
-     */
+
     promise<T>(promise: Promise<T>, options: PromiseOptions<T>, shared: Options = {}) {
       const id = group.loading({ ...shared, ...options.loading })
 
@@ -142,9 +111,7 @@ export function groupConnect<T extends PropTypes>(state: GroupState, send: Group
 
       return promise
     },
-    /**
-     * Function to pause a toast by id.
-     */
+
     pause(id?: string) {
       if (id == null) {
         send("PAUSE_ALL")
@@ -152,9 +119,7 @@ export function groupConnect<T extends PropTypes>(state: GroupState, send: Group
         send({ type: "PAUSE_TOAST", id })
       }
     },
-    /**
-     * Function to resume a toast by id.
-     */
+
     resume(id?: string) {
       if (id == null) {
         send("RESUME_ALL")

package/src/toast.connect.ts

@@ -1,9 +1,9 @@
 import type { NormalizeProps, PropTypes } from "@zag-js/types"
 import { parts } from "./toast.anatomy"
 import { dom } from "./toast.dom"
-import type { PublicApi, Send, State } from "./toast.types"
+import type { MachineApi, Send, State } from "./toast.types"
 
-export function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): PublicApi<T> {
+export function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {
   const isVisible = state.hasTag("visible")
   const isPaused = state.hasTag("paused")
 

package/src/toast.types.ts

@@ -142,7 +142,120 @@ type GroupPublicContext = SharedContext &
     offsets: string | Record<"left" | "right" | "bottom" | "top", string>
   }
 
-export type PublicApi<T extends PropTypes = PropTypes> = {
+export type UserDefinedGroupContext = RequiredBy<GroupPublicContext, "id">
+
+type GroupComputedContext = Readonly<{
+  /**
+   * @computed
+   * The total number of toasts in the group
+   */
+  count: number
+}>
+
+type GroupPrivateContext = Context<{
+  /**
+   * @internal
+   * The child toast machines (spawned by the toast group)
+   */
+  toasts: Service[]
+}>
+
+export type GroupMachineContext = GroupPublicContext & GroupComputedContext & GroupPrivateContext
+
+export type GroupState = S.State<GroupMachineContext>
+
+export type GroupSend = (event: S.Event<S.AnyEventObject>) => void
+
+type MaybeFunction<Value, Args> = Value | ((arg: Args) => Value)
+
+export type PromiseOptions<Value> = {
+  loading: ToastOptions
+  success: MaybeFunction<ToastOptions, Value>
+  error: MaybeFunction<ToastOptions, Error>
+}
+
+export type GroupProps = {
+  placement: Placement
+  label?: string
+}
+
+export type GroupMachineApi<T extends PropTypes = PropTypes> = {
+  /**
+   * The total number of toasts
+   */
+  count: number
+  /**
+   * The active toasts
+   */
+  toasts: Service[]
+  /**
+   * The active toasts by placement
+   */
+  toastsByPlacement: Partial<Record<Placement, Service[]>>
+  /**
+   * Returns whether the toast id is visible
+   */
+  isVisible(id: string): boolean
+  /**
+   * Function to create a toast.
+   */
+  create(options: Options): string | undefined
+  /**
+   * Function to create or update a toast.
+   */
+  upsert(options: Options): string | undefined
+  /**
+   * Function to update a toast's options by id.
+   */
+  update(id: string, options: Options): void
+  /**
+   * Function to create a success toast.
+   */
+  success(options: Options): string | undefined
+  /**
+   * Function to create an error toast.
+   */
+  error(options: Options): string | undefined
+  /**
+   * Function to create a loading toast.
+   */
+  loading(options: Options): string | undefined
+  /**
+   * Function to resume a toast by id.
+   */
+  resume(id?: string | undefined): void
+  /**
+   * Function to pause a toast by id.
+   */
+  pause(id?: string | undefined): void
+  /**
+   * Function to dismiss a toast by id.
+   * If no id is provided, all toasts will be dismissed.
+   */
+  dismiss(id?: string | undefined): void
+  /**
+   * Function to dismiss all toasts by placement.
+   */
+  dismissByPlacement(placement: Placement): void
+  /**
+   * Function to remove a toast by id.
+   * If no id is provided, all toasts will be removed.
+   */
+  remove(id?: string | undefined): void
+  /**
+   * Function to create a toast from a promise.
+   * - When the promise resolves, the toast will be updated with the success options.
+   * - When the promise rejects, the toast will be updated with the error options.
+   */
+  promise<T>(promise: Promise<T>, options: PromiseOptions<T>, shared?: ToastOptions): Promise<T>
+  /**
+   * Function to subscribe to the toast group.
+   */
+  subscribe(callback: (toasts: Service[]) => void): VoidFunction
+  getGroupProps(options: GroupProps): T["element"]
+}
+
+export type MachineApi<T extends PropTypes = PropTypes> = {
   /**
    * The type of the toast.
    */
@@ -192,53 +305,3 @@ export type PublicApi<T extends PropTypes = PropTypes> = {
   descriptionProps: T["element"]
   closeTriggerProps: T["button"]
 }
-
-export type UserDefinedGroupContext = RequiredBy<GroupPublicContext, "id">
-
-type GroupComputedContext = Readonly<{
-  /**
-   * @computed
-   * The total number of toasts in the group
-   */
-  readonly count: number
-}>
-
-type GroupPrivateContext = Context<{
-  /**
-   * @internal
-   * The child toast machines (spawned by the toast group)
-   */
-  toasts: Service[]
-}>
-
-export type GroupMachineContext = GroupPublicContext & GroupComputedContext & GroupPrivateContext
-
-export type GroupState = S.State<GroupMachineContext>
-
-export type GroupSend = (event: S.Event<S.AnyEventObject>) => void
-
-type MaybeFunction<Value, Args> = Value | ((arg: Args) => Value)
-
-export type PromiseOptions<Value> = {
-  loading: ToastOptions
-  success: MaybeFunction<ToastOptions, Value>
-  error: MaybeFunction<ToastOptions, Error>
-}
-
-export type GroupProps = {
-  placement: Placement
-  label?: string
-}
-
-export type Toaster = {
-  count: number
-  isVisible(id: string): boolean
-  upsert(options: ToastOptions): string | undefined
-  create(options: ToastOptions): string | undefined
-  success(options: ToastOptions): string | undefined
-  error(options: ToastOptions): string | undefined
-  loading(options: ToastOptions): string | undefined
-  dismiss(id?: string | undefined): void
-  remove(id?: string | undefined): void
-  promise<T>(promise: Promise<T>, options: PromiseOptions<T>, shared?: ToastOptions): Promise<T>
-}