@ark-ui/react 0.0.0-rc-20230101180921 → 0.0.0-rc-20230102115543

package/dist/index.cjs

@@ -162,6 +162,14 @@ const tagsInputField = require('./tags-input/tags-input-field.cjs');
 const tagsInputLabel = require('./tags-input/tags-input-label.cjs');
 const tagsInput$1 = require('@zag-js/tags-input');
 const useTagsInput = require('./tags-input/use-tags-input.cjs');
+const toast = require('./toast/toast.cjs');
+const toastCloseTrigger = require('./toast/toast-close-trigger.cjs');
+const toastDescription = require('./toast/toast-description.cjs');
+const toastGroup = require('./toast/toast-group.cjs');
+const toastPlacements = require('./toast/toast-placements.cjs');
+const toastProvider = require('./toast/toast-provider.cjs');
+const toastTitle = require('./toast/toast-title.cjs');
+const toast$1 = require('@zag-js/toast');
 const tooltip = require('./tooltip/tooltip.cjs');
 const tooltip$1 = require('@zag-js/tooltip');
 const tooltipArrow = require('./tooltip/tooltip-arrow.cjs');
@@ -394,6 +402,18 @@ Object.defineProperty(exports, 'tagsInputAnatomy', {
 	get: () => tagsInput$1.anatomy
 });
 exports.useTagsInput = useTagsInput.useTagsInput;
+exports.Toast = toast.Toast;
+exports.ToastCloseTrigger = toastCloseTrigger.ToastCloseTrigger;
+exports.ToastDescription = toastDescription.ToastDescription;
+exports.ToastGroup = toastGroup.ToastGroup;
+exports.ToastPlacements = toastPlacements.ToastPlacements;
+exports.ToastProvider = toastProvider.ToastProvider;
+exports.useToast = toastProvider.useToast;
+exports.ToastTitle = toastTitle.ToastTitle;
+Object.defineProperty(exports, 'toastAnatomy', {
+	enumerable: true,
+	get: () => toast$1.anatomy
+});
 exports.Tooltip = tooltip.Tooltip;
 Object.defineProperty(exports, 'tooltipAnatomy', {
 	enumerable: true,

package/dist/index.d.ts

@@ -18,4 +18,5 @@ export * from './select';
 export * from './slider';
 export * from './tabs';
 export * from './tags-input';
+export * from './toast';
 export * from './tooltip';

package/dist/index.mjs

@@ -158,6 +158,14 @@ export { TagsInputField } from './tags-input/tags-input-field.mjs';
 export { TagsInputLabel } from './tags-input/tags-input-label.mjs';
 export { anatomy as tagsInputAnatomy } from '@zag-js/tags-input';
 export { useTagsInput } from './tags-input/use-tags-input.mjs';
+export { Toast } from './toast/toast.mjs';
+export { ToastCloseTrigger } from './toast/toast-close-trigger.mjs';
+export { ToastDescription } from './toast/toast-description.mjs';
+export { ToastGroup } from './toast/toast-group.mjs';
+export { ToastPlacements } from './toast/toast-placements.mjs';
+export { ToastProvider, useToast } from './toast/toast-provider.mjs';
+export { ToastTitle } from './toast/toast-title.mjs';
+export { anatomy as toastAnatomy } from '@zag-js/toast';
 export { Tooltip } from './tooltip/tooltip.mjs';
 export { anatomy as tooltipAnatomy } from '@zag-js/tooltip';
 export { TooltipArrow } from './tooltip/tooltip-arrow.mjs';

package/dist/toast/index.d.ts

@@ -0,0 +1,8 @@
+export { Toast, type ToastProps } from './toast';
+export { ToastCloseTrigger, type ToastCloseTriggerProps } from './toast-close-trigger';
+export { ToastDescription, type ToastDescriptionProps } from './toast-description';
+export { ToastGroup, type ToastGroupProps } from './toast-group';
+export { ToastPlacements, type ToastPlacementsProps } from './toast-placements';
+export { ToastProvider, useToast, type ToastProviderProps } from './toast-provider';
+export { ToastTitle, type ToastTitleProps } from './toast-title';
+export { toastAnatomy } from './toast.anatomy';

package/dist/toast/toast-close-trigger.cjs

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const React = require('react');
+const toastItemContext = require('./toast-item-context.cjs');
+
+const ToastCloseTrigger = (props) => {
+  const { closeTriggerProps } = toastItemContext.useToastItemContext();
+  const onlyChild = React.Children.only(props.children);
+  return React.cloneElement(onlyChild, closeTriggerProps);
+};
+
+exports.ToastCloseTrigger = ToastCloseTrigger;

package/dist/toast/toast-close-trigger.d.ts

@@ -0,0 +1,5 @@
+import type { JSXElementConstructor, ReactElement } from 'react';
+export declare type ToastCloseTriggerProps = {
+    children: ReactElement;
+};
+export declare const ToastCloseTrigger: (props: ToastCloseTriggerProps) => ReactElement<any, string | JSXElementConstructor<any>>;

package/dist/toast/toast-close-trigger.mjs

@@ -0,0 +1,10 @@
+import { Children, cloneElement } from 'react';
+import { useToastItemContext } from './toast-item-context.mjs';
+
+const ToastCloseTrigger = (props) => {
+  const { closeTriggerProps } = useToastItemContext();
+  const onlyChild = Children.only(props.children);
+  return cloneElement(onlyChild, closeTriggerProps);
+};
+
+export { ToastCloseTrigger };

package/dist/toast/toast-description.cjs

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react = require('@polymorphic-factory/react');
+const react$1 = require('@zag-js/react');
+const factory = require('../factory.cjs');
+const toastItemContext = require('./toast-item-context.cjs');
+
+const ToastDescription = react.forwardRef((props, ref) => {
+  const { descriptionProps, description } = toastItemContext.useToastItemContext();
+  const mergedProps = react$1.mergeProps(descriptionProps, props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.p, { ...mergedProps, ref, children: description });
+});
+
+exports.ToastDescription = ToastDescription;

package/dist/toast/toast-description.d.ts

@@ -0,0 +1,4 @@
+import type { ComponentWithAs } from '@polymorphic-factory/react';
+import { HTMLArkProps } from '../factory';
+export declare type ToastDescriptionProps = HTMLArkProps<'p'>;
+export declare const ToastDescription: ComponentWithAs<"p", ToastDescriptionProps>;

package/dist/toast/toast-description.mjs

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from '@polymorphic-factory/react';
+import { mergeProps } from '@zag-js/react';
+import { ark } from '../factory.mjs';
+import { useToastItemContext } from './toast-item-context.mjs';
+
+const ToastDescription = forwardRef((props, ref) => {
+  const { descriptionProps, description } = useToastItemContext();
+  const mergedProps = mergeProps(descriptionProps, props);
+  return /* @__PURE__ */ jsx(ark.p, { ...mergedProps, ref, children: description });
+});
+
+export { ToastDescription };

package/dist/toast/toast-group.cjs

@@ -0,0 +1,20 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react = require('@polymorphic-factory/react');
+const react$1 = require('@zag-js/react');
+const factory = require('../factory.cjs');
+const runIfFn = require('../run-if-fn.cjs');
+const toastProvider = require('./toast-provider.cjs');
+
+const ToastGroup = react.forwardRef((props, ref) => {
+  const { children, placement, ...divProps } = props;
+  const { toastsByPlacement, getGroupProps } = toastProvider.useToast();
+  const mergedProps = react$1.mergeProps(getGroupProps({ placement }), divProps);
+  const view = runIfFn.runIfFn(children, toastsByPlacement[placement] ?? []);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref, children: /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: view }) });
+});
+
+exports.ToastGroup = ToastGroup;

package/dist/toast/toast-group.d.ts

@@ -0,0 +1,10 @@
+import type { ComponentWithAs } from '@polymorphic-factory/react';
+import type { Placement, Service } from '@zag-js/toast';
+import type { ReactNode } from 'react';
+import { HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+export declare type ToastGroupProps = Assign<HTMLArkProps<'div'>, {
+    placement: Placement;
+    children: ReactNode | ((toasts: Service[]) => ReactNode);
+}>;
+export declare const ToastGroup: ComponentWithAs<"div", ToastGroupProps>;

package/dist/toast/toast-group.mjs

@@ -0,0 +1,16 @@
+import { jsx, Fragment } from 'react/jsx-runtime';
+import { forwardRef } from '@polymorphic-factory/react';
+import { mergeProps } from '@zag-js/react';
+import { ark } from '../factory.mjs';
+import { runIfFn } from '../run-if-fn.mjs';
+import { useToast } from './toast-provider.mjs';
+
+const ToastGroup = forwardRef((props, ref) => {
+  const { children, placement, ...divProps } = props;
+  const { toastsByPlacement, getGroupProps } = useToast();
+  const mergedProps = mergeProps(getGroupProps({ placement }), divProps);
+  const view = runIfFn(children, toastsByPlacement[placement] ?? []);
+  return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref, children: /* @__PURE__ */ jsx(Fragment, { children: view }) });
+});
+
+export { ToastGroup };

package/dist/toast/toast-item-context.cjs

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const createContext = require('../create-context.cjs');
+
+const [ToastItemProvider, useToastItemContext] = createContext.createContext({
+  name: "ToastItemContext",
+  hookName: "useToastItemContext",
+  providerName: "<ToastItemProvider />"
+});
+
+exports.ToastItemProvider = ToastItemProvider;
+exports.useToastItemContext = useToastItemContext;

package/dist/toast/toast-item-context.d.ts

@@ -0,0 +1,37 @@
+import type { Type, Placement } from '@zag-js/toast/dist/toast.types';
+import type { Provider, HTMLAttributes, DetailedHTMLProps, ButtonHTMLAttributes } from 'react';
+import type { UseToastItemReturn } from './use-toast-item';
+export declare type ToastItemContext = UseToastItemReturn;
+export declare const ToastItemProvider: Provider<{
+    type: Type;
+    title: string | undefined;
+    description: string | undefined;
+    placement: Placement;
+    isVisible: boolean;
+    isPaused: boolean;
+    isRtl: boolean;
+    pause(): void;
+    resume(): void;
+    dismiss(): void;
+    rootProps: HTMLAttributes<HTMLElement>;
+    titleProps: HTMLAttributes<HTMLElement>;
+    descriptionProps: HTMLAttributes<HTMLElement>;
+    closeTriggerProps: DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;
+    render(): any;
+}>, useToastItemContext: () => {
+    type: Type;
+    title: string | undefined;
+    description: string | undefined;
+    placement: Placement;
+    isVisible: boolean;
+    isPaused: boolean;
+    isRtl: boolean;
+    pause(): void;
+    resume(): void;
+    dismiss(): void;
+    rootProps: HTMLAttributes<HTMLElement>;
+    titleProps: HTMLAttributes<HTMLElement>;
+    descriptionProps: HTMLAttributes<HTMLElement>;
+    closeTriggerProps: DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;
+    render(): any;
+};

package/dist/toast/toast-item-context.mjs

@@ -0,0 +1,9 @@
+import { createContext } from '../create-context.mjs';
+
+const [ToastItemProvider, useToastItemContext] = createContext({
+  name: "ToastItemContext",
+  hookName: "useToastItemContext",
+  providerName: "<ToastItemProvider />"
+});
+
+export { ToastItemProvider, useToastItemContext };

package/dist/toast/toast-placements.cjs

@@ -0,0 +1,16 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const runIfFn = require('../run-if-fn.cjs');
+const toastProvider = require('./toast-provider.cjs');
+
+const ToastPlacements = (props) => {
+  const { children } = props;
+  const { toastsByPlacement } = toastProvider.useToast();
+  const view = runIfFn.runIfFn(children, Object.keys(toastsByPlacement));
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: view });
+};
+
+exports.ToastPlacements = ToastPlacements;

package/dist/toast/toast-placements.d.ts

@@ -0,0 +1,6 @@
+import type { Placement } from '@zag-js/toast';
+import type { ReactNode } from 'react';
+export declare type ToastPlacementsProps = {
+    children: (placements: Placement[]) => ReactNode;
+};
+export declare const ToastPlacements: (props: ToastPlacementsProps) => JSX.Element;

package/dist/toast/toast-placements.mjs

@@ -0,0 +1,12 @@
+import { jsx, Fragment } from 'react/jsx-runtime';
+import { runIfFn } from '../run-if-fn.mjs';
+import { useToast } from './toast-provider.mjs';
+
+const ToastPlacements = (props) => {
+  const { children } = props;
+  const { toastsByPlacement } = useToast();
+  const view = runIfFn(children, Object.keys(toastsByPlacement));
+  return /* @__PURE__ */ jsx(Fragment, { children: view });
+};
+
+export { ToastPlacements };

package/dist/toast/toast-provider.cjs

@@ -0,0 +1,40 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react = require('@zag-js/react');
+const toast = require('@zag-js/toast');
+const React = require('react');
+const createContext = require('../create-context.cjs');
+
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
+  if (e) {
+    for (const k in e) {
+      if (k !== 'default') {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+const toast__namespace = /*#__PURE__*/_interopNamespaceDefault(toast);
+
+const [ToastContextProvider, useToast] = createContext.createContext();
+const ToastProvider = (props) => {
+  const { children, ...restProps } = props;
+  const [state, send] = react.useMachine(toast__namespace.group.machine({ id: React.useId(), ...restProps }));
+  const api = toast__namespace.group.connect(state, send, react.normalizeProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(ToastContextProvider, { value: api, children });
+};
+
+exports.ToastContextProvider = ToastContextProvider;
+exports.ToastProvider = ToastProvider;
+exports.useToast = useToast;

package/dist/toast/toast-provider.d.ts

@@ -0,0 +1,54 @@
+import type { PromiseOptions, GroupProps } from '@zag-js/toast/dist/toast.types';
+import * as toast from '@zag-js/toast';
+import type { Provider, PropsWithChildren } from 'react';
+import type { Optional } from '../types';
+declare type GroupPublicContext = Parameters<typeof toast['group']['machine']>[0];
+export declare type ToastContext = ReturnType<typeof toast['group']['connect']>;
+export declare const ToastContextProvider: Provider<{
+    count: number;
+    toasts: toast.Service[];
+    toastsByPlacement: Partial<Record<toast.Placement, toast.Service[]>>;
+    isVisible(id: string): boolean;
+    create(options: Partial<toast.ToastOptions>): string | undefined;
+    upsert(options: Partial<toast.ToastOptions>): string | undefined;
+    dismiss(id?: string | undefined): void;
+    remove(id?: string | undefined): void;
+    dismissByPlacement(placement: toast.Placement): void;
+    update(id: string, options: Partial<toast.ToastOptions>): string | undefined;
+    loading(options: Partial<toast.ToastOptions>): string | undefined;
+    success(options: Partial<toast.ToastOptions>): string | undefined;
+    error(options: Partial<toast.ToastOptions>): string | undefined;
+    promise<T_1>(promise: Promise<T_1>, options: PromiseOptions<T_1>, shared?: Partial<toast.ToastOptions> | undefined): Promise<T_1>;
+    pause(id?: string | undefined): void;
+    resume(id?: string | undefined): void;
+    getGroupProps(options: GroupProps): {
+        [x: string]: any;
+    };
+    createPortal(): HTMLElement;
+    subscribe(fn: (toasts: any) => void): () => void;
+}>, useToast: () => {
+    count: number;
+    toasts: toast.Service[];
+    toastsByPlacement: Partial<Record<toast.Placement, toast.Service[]>>;
+    isVisible(id: string): boolean;
+    create(options: Partial<toast.ToastOptions>): string | undefined;
+    upsert(options: Partial<toast.ToastOptions>): string | undefined;
+    dismiss(id?: string | undefined): void;
+    remove(id?: string | undefined): void;
+    dismissByPlacement(placement: toast.Placement): void;
+    update(id: string, options: Partial<toast.ToastOptions>): string | undefined;
+    loading(options: Partial<toast.ToastOptions>): string | undefined;
+    success(options: Partial<toast.ToastOptions>): string | undefined;
+    error(options: Partial<toast.ToastOptions>): string | undefined;
+    promise<T_1>(promise: Promise<T_1>, options: PromiseOptions<T_1>, shared?: Partial<toast.ToastOptions> | undefined): Promise<T_1>;
+    pause(id?: string | undefined): void;
+    resume(id?: string | undefined): void;
+    getGroupProps(options: GroupProps): {
+        [x: string]: any;
+    };
+    createPortal(): HTMLElement;
+    subscribe(fn: (toasts: any) => void): () => void;
+};
+export declare type ToastProviderProps = PropsWithChildren & Optional<GroupPublicContext, 'id'>;
+export declare const ToastProvider: (props: ToastProviderProps) => JSX.Element;
+export {};

package/dist/toast/toast-provider.mjs

@@ -0,0 +1,15 @@
+import { jsx } from 'react/jsx-runtime';
+import { useMachine, normalizeProps } from '@zag-js/react';
+import * as toast from '@zag-js/toast';
+import { useId } from 'react';
+import { createContext } from '../create-context.mjs';
+
+const [ToastContextProvider, useToast] = createContext();
+const ToastProvider = (props) => {
+  const { children, ...restProps } = props;
+  const [state, send] = useMachine(toast.group.machine({ id: useId(), ...restProps }));
+  const api = toast.group.connect(state, send, normalizeProps);
+  return /* @__PURE__ */ jsx(ToastContextProvider, { value: api, children });
+};
+
+export { ToastContextProvider, ToastProvider, useToast };

package/dist/toast/toast-title.cjs

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react = require('@polymorphic-factory/react');
+const react$1 = require('@zag-js/react');
+const factory = require('../factory.cjs');
+const toastItemContext = require('./toast-item-context.cjs');
+
+const ToastTitle = react.forwardRef((props, ref) => {
+  const { titleProps, title } = toastItemContext.useToastItemContext();
+  const mergedProps = react$1.mergeProps(titleProps, props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.h3, { ...mergedProps, ref, children: title });
+});
+
+exports.ToastTitle = ToastTitle;

package/dist/toast/toast-title.d.ts

@@ -0,0 +1,4 @@
+import type { ComponentWithAs } from '@polymorphic-factory/react';
+import { HTMLArkProps } from '../factory';
+export declare type ToastTitleProps = HTMLArkProps<'h3'>;
+export declare const ToastTitle: ComponentWithAs<"h3", ToastTitleProps>;

package/dist/toast/toast-title.mjs

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from '@polymorphic-factory/react';
+import { mergeProps } from '@zag-js/react';
+import { ark } from '../factory.mjs';
+import { useToastItemContext } from './toast-item-context.mjs';
+
+const ToastTitle = forwardRef((props, ref) => {
+  const { titleProps, title } = useToastItemContext();
+  const mergedProps = mergeProps(titleProps, props);
+  return /* @__PURE__ */ jsx(ark.h3, { ...mergedProps, ref, children: title });
+});
+
+export { ToastTitle };

package/dist/toast/toast.anatomy.d.ts

@@ -0,0 +1 @@
+export { anatomy as toastAnatomy } from '@zag-js/toast';

package/dist/toast/toast.cjs

@@ -0,0 +1,20 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react = require('@polymorphic-factory/react');
+const react$1 = require('@zag-js/react');
+const createSplitProps = require('../create-split-props.cjs');
+const factory = require('../factory.cjs');
+const toastItemContext = require('./toast-item-context.cjs');
+const useToastItem = require('./use-toast-item.cjs');
+
+const Toast = react.forwardRef((props, ref) => {
+  const [useToastItemProps, divProps] = createSplitProps.createSplitProps()(props, ["toast"]);
+  const api = useToastItem.useToastItem(useToastItemProps);
+  const mergedProps = react$1.mergeProps(api.rootProps, divProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(toastItemContext.ToastItemProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
+});
+
+exports.Toast = Toast;

package/dist/toast/toast.d.ts

@@ -0,0 +1,6 @@
+import type { ComponentWithAs } from '@polymorphic-factory/react';
+import { HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { UseToastItemProps } from './use-toast-item';
+export declare type ToastProps = Assign<HTMLArkProps<'div'>, UseToastItemProps>;
+export declare const Toast: ComponentWithAs<"div", ToastProps>;

package/dist/toast/toast.mjs

@@ -0,0 +1,16 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from '@polymorphic-factory/react';
+import { mergeProps } from '@zag-js/react';
+import { createSplitProps } from '../create-split-props.mjs';
+import { ark } from '../factory.mjs';
+import { ToastItemProvider } from './toast-item-context.mjs';
+import { useToastItem } from './use-toast-item.mjs';
+
+const Toast = forwardRef((props, ref) => {
+  const [useToastItemProps, divProps] = createSplitProps()(props, ["toast"]);
+  const api = useToastItem(useToastItemProps);
+  const mergedProps = mergeProps(api.rootProps, divProps);
+  return /* @__PURE__ */ jsx(ToastItemProvider, { value: api, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
+});
+
+export { Toast };

package/dist/toast/use-toast-item.cjs

@@ -0,0 +1,32 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const react = require('@zag-js/react');
+const toast = require('@zag-js/toast');
+
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
+  if (e) {
+    for (const k in e) {
+      if (k !== 'default') {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+const toast__namespace = /*#__PURE__*/_interopNamespaceDefault(toast);
+
+const useToastItem = (props) => {
+  const [state, send] = react.useActor(props.toast);
+  return toast__namespace.connect(state, send, react.normalizeProps);
+};
+
+exports.useToastItem = useToastItem;

package/dist/toast/use-toast-item.d.ts

@@ -0,0 +1,23 @@
+import type { HTMLAttributes, DetailedHTMLProps, ButtonHTMLAttributes } from 'react';
+import * as toast from '@zag-js/toast';
+export declare type UseToastItemProps = {
+    toast: toast.Service;
+};
+export declare type UseToastItemReturn = ReturnType<typeof useToastItem>;
+export declare const useToastItem: (props: UseToastItemProps) => {
+    type: toast.Type;
+    title: string | undefined;
+    description: string | undefined;
+    placement: toast.Placement;
+    isVisible: boolean;
+    isPaused: boolean;
+    isRtl: boolean;
+    pause(): void;
+    resume(): void;
+    dismiss(): void;
+    rootProps: HTMLAttributes<HTMLElement>;
+    titleProps: HTMLAttributes<HTMLElement>;
+    descriptionProps: HTMLAttributes<HTMLElement>;
+    closeTriggerProps: DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;
+    render(): any;
+};

package/dist/toast/use-toast-item.mjs

@@ -0,0 +1,9 @@
+import { useActor, normalizeProps } from '@zag-js/react';
+import * as toast from '@zag-js/toast';
+
+const useToastItem = (props) => {
+  const [state, send] = useActor(props.toast);
+  return toast.connect(state, send, normalizeProps);
+};
+
+export { useToastItem };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ark-ui/react",
-  "version": "0.0.0-rc-20230101180921",
+  "version": "0.0.0-rc-20230102115543",
   "description": "",
   "keywords": [],
   "homepage": "https://github.com/chakra-ui/ark#readme",