vue-toastflow 1.2.0-beta.2 → 1.2.0-beta.3

package/README.md

@@ -1,72 +1,74 @@
-<p align="center">
-  <img src="../../assets/banner.png" alt="Toastflow" width="100%" />
-</p>
-
-<h1 align="center">🟢 vue-toastflow</h1>
-
-<p align="center">
-  <strong>Vue 3 renderer for Toastflow</strong> — components, programmatic API, and beautiful defaults.
-</p>
-
-<p align="center">
-  <a href="https://www.npmjs.com/package/vue-toastflow"><img src="https://img.shields.io/npm/v/vue-toastflow?color=43b883&style=flat-square" alt="npm version" /></a>
-  <a href="https://www.npmjs.com/package/vue-toastflow"><img src="https://img.shields.io/npm/dm/vue-toastflow?style=flat-square" alt="npm downloads" /></a>
-  <a href="../../LICENSE"><img src="https://img.shields.io/github/license/adrianjanocko/toastflow?style=flat-square" alt="License" /></a>
-</p>
-
-<p align="center">
-  <a href="https://docs.toastflow.top/">📖 Docs</a> · <a href="https://toastflow.top/">🎮 Playground</a> · <a href="https://docs.toastflow.top/comparisons/overview">⚔️ Comparisons</a>
-</p>
-
----
-
-> 💚 Using **Nuxt**? Install [`nuxt-toastflow`](https://www.npmjs.com/package/nuxt-toastflow) instead — it wraps this package with auto-imports and SSR support.
-
-## 📦 What's Included
-
-|     | Feature                                                  |
-| :-: | :------------------------------------------------------- |
-| 🔌  | `createToastflow` plugin                                 |
-| 🎯  | `toast` programmatic API                                 |
-| 🧱  | `<ToastContainer />` · `<Toast />` · `<ToastProgress />` |
-| 🎨  | Default styles and icon components                       |
-
-## 🚀 Quick Start
-
-**1. Install**
-
-```bash
-pnpm add vue-toastflow
-```
-
-**2. Register the plugin**
-
-```ts
-// main.ts
-import { createApp } from "vue";
-import App from "./App.vue";
-import { createToastflow } from "vue-toastflow";
-
-createApp(App).use(createToastflow()).mount("#app");
-```
-
-**3. Use it ✨**
-
-```vue
-<!-- App.vue -->
-<script setup lang="ts">
-import { ToastContainer, toast } from "vue-toastflow";
-
-toast.success({ title: "Saved", description: "Your changes are live." });
-</script>
-
-<template>
-  <ToastContainer />
-</template>
-```
-
-> 💡 See the full [Getting Started](https://docs.toastflow.top/guide/getting-started) guide for theming, slots, events, and more.
-
-## 📄 License
-
-[MIT](../../LICENSE) — made with ❤️ by [@adrianjanocko](https://github.com/adrianjanocko)
+<p align="center">
+  <img src="../../assets/banner.png" alt="Toastflow" width="100%" />
+</p>
+
+<h1 align="center">🟢 vue-toastflow</h1>
+
+<p align="center">
+  <strong>Vue 3 renderer for Toastflow</strong> — components, programmatic API, and beautiful defaults.
+</p>
+
+<p align="center">
+  <a href="https://www.npmjs.com/package/vue-toastflow"><img src="https://img.shields.io/npm/v/vue-toastflow?color=43b883&style=flat-square" alt="npm version" /></a>
+  <a href="https://www.npmjs.com/package/vue-toastflow"><img src="https://img.shields.io/npm/dm/vue-toastflow?style=flat-square" alt="npm downloads" /></a>
+  <a href="../../LICENSE"><img src="https://img.shields.io/github/license/adrianjanocko/toastflow?style=flat-square" alt="License" /></a>
+</p>
+
+<p align="center">
+  <a href="https://www.toastflow.top/docs">📖 Docs</a> · <a href="https://www.toastflow.top/">🎮 Playground</a> · <a href="https://www.toastflow.top/docs/more/comparisons">⚔️ Comparisons</a>
+</p>
+
+---
+
+> 💚 Using **Nuxt**? Install [`nuxt-toastflow`](https://www.npmjs.com/package/nuxt-toastflow) instead — it wraps this package with auto-imports and SSR support.
+
+> `createToastflow()` injects Toastflow's default CSS by default. Pass `createToastflow(config, { css: false })` to disable that and import `vue-toastflow/styles.css` manually only when you want the shipped styles.
+
+## 📦 What's Included
+
+|     | Feature                                                  |
+| :-: | :------------------------------------------------------- |
+| 🔌  | `createToastflow` plugin                                 |
+| 🎯  | `toast` programmatic API                                 |
+| 🧱  | `<ToastContainer />` · `<Toast />` · `<ToastProgress />` |
+| 🎨  | Default styles and icon components                       |
+
+## 🚀 Quick Start
+
+**1. Install**
+
+```bash
+pnpm add vue-toastflow
+```
+
+**2. Register the plugin**
+
+```ts
+// main.ts
+import { createApp } from "vue";
+import App from "./App.vue";
+import { createToastflow } from "vue-toastflow";
+
+createApp(App).use(createToastflow()).mount("#app");
+```
+
+**3. Use it ✨**
+
+```vue
+<!-- App.vue -->
+<script setup lang="ts">
+import { ToastContainer, toast } from "vue-toastflow";
+
+toast.success({ title: "Saved", description: "Your changes are live." });
+</script>
+
+<template>
+  <ToastContainer />
+</template>
+```
+
+> 💡 See the full [Vue Quick Start](https://www.toastflow.top/docs/vue/quick-start) guide for theming, slots, events, and more.
+
+## 📄 License
+
+[MIT](../../LICENSE) — made with ❤️ by [@adrianjanocko](https://github.com/adrianjanocko)

package/dist/src/components/Toast.vue.d.mts

@@ -0,0 +1,50 @@
+import { ToastInstance, ToastStandaloneInstance } from 'toastflow-core';
+type __VLS_Props = {
+    toast: ToastStandaloneInstance | ToastInstance;
+    progressResetKey?: number;
+    duplicateKey?: number;
+    updateKey?: number;
+    bumpAnimationClass?: string;
+    clearAllAnimationClass?: string;
+    updateAnimationClass?: string;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        icon?(_: {
+            toast: ToastInstance;
+        }): any;
+        default?(_: {
+            toast: ToastInstance;
+        }): any;
+        'created-at'?(_: {
+            toast: ToastInstance;
+            formatted: string;
+        }): any;
+        'created-at'?(_: {
+            toast: ToastInstance;
+            formatted: string;
+        }): any;
+        progress?(_: {
+            toast: ToastInstance;
+        }): any;
+        'close-icon'?(_: {
+            toast: ToastInstance;
+        }): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    dismiss: (id: string) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onDismiss?: ((id: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/src/components/ToastButtonsGroup.vue.d.mts

@@ -0,0 +1,8 @@
+import { ToastButton } from 'toastflow-core';
+type __VLS_Props = {
+    buttons: ToastButton[];
+    classes: Array<string | undefined>;
+    onButtonClick: (button: ToastButton, event: MouseEvent) => void;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/dist/src/components/ToastContainer.vue.d.mts

@@ -0,0 +1,28 @@
+import { ToastId, ToastInstance } from 'toastflow-core';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {
+            toast: ToastInstance;
+            progressResetKey: number | undefined;
+            duplicateKey: number | undefined;
+            updateKey: number | undefined;
+            bumpAnimationClass: string | undefined;
+            clearAllAnimationClass: string | undefined;
+            updateAnimationClass: string | undefined;
+            dismiss: (id: ToastId) => void;
+            ui: import('..').ToastUI;
+        }): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/src/components/ToastContainer.vue.d.ts

@@ -1,17 +1,17 @@
 import { ToastId, ToastInstance } from 'toastflow-core';
-declare function handleDismiss(id: ToastId): void;
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: {
         default?(_: {
             toast: ToastInstance;
-            progressResetKey: number;
-            duplicateKey: number;
-            updateKey: number;
+            progressResetKey: number | undefined;
+            duplicateKey: number | undefined;
+            updateKey: number | undefined;
             bumpAnimationClass: string | undefined;
             clearAllAnimationClass: string | undefined;
             updateAnimationClass: string | undefined;
-            dismiss: typeof handleDismiss;
+            dismiss: (id: ToastId) => void;
+            ui: import('..').ToastUI;
         }): any;
     };
     refs: {};

package/dist/src/components/ToastProgress.vue.d.mts

@@ -0,0 +1,13 @@
+import { ToastProgressAlignment, ToastType } from 'toastflow-core';
+type ToastSlotProps = Record<string, unknown>;
+type __VLS_Props = {
+    type?: ToastType;
+    progressAlignment?: ToastProgressAlignment;
+    trackProps?: ToastSlotProps;
+    barProps?: ToastSlotProps;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    type: ToastType;
+    progressAlignment: ToastProgressAlignment;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/dist/src/components/ToastProgress.vue.d.ts

@@ -1,9 +1,13 @@
 import { ToastProgressAlignment, ToastType } from 'toastflow-core';
+type ToastSlotProps = Record<string, unknown>;
 type __VLS_Props = {
-    type: ToastType;
+    type?: ToastType;
     progressAlignment?: ToastProgressAlignment;
+    trackProps?: ToastSlotProps;
+    barProps?: ToastSlotProps;
 };
 declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    type: ToastType;
     progressAlignment: ToastProgressAlignment;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 export default _default;

package/dist/src/components/ToastSlotProvider.vue.d.mts

@@ -0,0 +1,38 @@
+import { ToastId, ToastInstance, ToastStandaloneInstance } from 'toastflow-core';
+type __VLS_Props = {
+    toast: ToastStandaloneInstance | ToastInstance;
+    progressResetKey?: number;
+    duplicateKey?: number;
+    updateKey?: number;
+    bumpAnimationClass?: string;
+    clearAllAnimationClass?: string;
+    updateAnimationClass?: string;
+};
+declare function dismiss(id: ToastId): void;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {
+            toast: ToastInstance;
+            progressResetKey: number | undefined;
+            duplicateKey: number | undefined;
+            updateKey: number | undefined;
+            bumpAnimationClass: string | undefined;
+            clearAllAnimationClass: string | undefined;
+            updateAnimationClass: string | undefined;
+            dismiss: typeof dismiss;
+            ui: import('..').ToastUI;
+        }): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/src/components/ToastSlotProvider.vue.d.ts

@@ -0,0 +1,38 @@
+import { ToastId, ToastInstance, ToastStandaloneInstance } from 'toastflow-core';
+type __VLS_Props = {
+    toast: ToastStandaloneInstance | ToastInstance;
+    progressResetKey?: number;
+    duplicateKey?: number;
+    updateKey?: number;
+    bumpAnimationClass?: string;
+    clearAllAnimationClass?: string;
+    updateAnimationClass?: string;
+};
+declare function dismiss(id: ToastId): void;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {
+            toast: ToastInstance;
+            progressResetKey: number | undefined;
+            duplicateKey: number | undefined;
+            updateKey: number | undefined;
+            bumpAnimationClass: string | undefined;
+            clearAllAnimationClass: string | undefined;
+            updateAnimationClass: string | undefined;
+            dismiss: typeof dismiss;
+            ui: import('..').ToastUI;
+        }): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/src/components/icons/ArrowPath.vue.d.mts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, SVGSVGElement>;
+export default _default;

package/dist/src/components/icons/Bell.vue.d.mts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, SVGSVGElement>;
+export default _default;

package/dist/src/components/icons/CheckCircle.vue.d.mts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, SVGSVGElement>;
+export default _default;

package/dist/src/components/icons/InfoCircle.vue.d.mts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, SVGSVGElement>;
+export default _default;

package/dist/src/components/icons/QuestionMarkCircle.vue.d.mts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, SVGSVGElement>;
+export default _default;

package/dist/src/components/icons/XCircle.vue.d.mts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, SVGSVGElement>;
+export default _default;

package/dist/src/components/icons/XMark.vue.d.mts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, SVGSVGElement>;
+export default _default;

package/dist/src/index.d.mts

@@ -0,0 +1,14 @@
+export * from 'toastflow-core';
+export * from './plugin';
+export * from './toast';
+export type { ToastUI } from './toast-ui';
+export { default as ToastContainer } from './components/ToastContainer.vue';
+export { default as Toast } from './components/Toast.vue';
+export { default as ToastProgress } from './components/ToastProgress.vue';
+export { default as ArrowPath } from './components/icons/ArrowPath.vue';
+export { default as Bell } from './components/icons/Bell.vue';
+export { default as CheckCircle } from './components/icons/CheckCircle.vue';
+export { default as InfoCircle } from './components/icons/InfoCircle.vue';
+export { default as QuestionMarkCircle } from './components/icons/QuestionMarkCircle.vue';
+export { default as XCircle } from './components/icons/XCircle.vue';
+export { default as XMark } from './components/icons/XMark.vue';

package/dist/src/index.d.ts

@@ -1,6 +1,7 @@
 export * from 'toastflow-core';
 export * from './plugin';
 export * from './toast';
+export type { ToastUI } from './toast-ui';
 export { default as ToastContainer } from './components/ToastContainer.vue';
 export { default as Toast } from './components/Toast.vue';
 export { default as ToastProgress } from './components/ToastProgress.vue';

package/dist/src/plugin.d.mts

@@ -0,0 +1,7 @@
+import { Plugin } from 'vue';
+import { ToastConfig } from 'toastflow-core';
+export interface ToastflowPluginOptions {
+    css?: boolean;
+}
+export declare function injectToastflowStyles(): void;
+export declare function createToastflow(config?: Partial<ToastConfig>, options?: ToastflowPluginOptions): Plugin;

package/dist/src/plugin.d.ts

@@ -1,3 +1,7 @@
 import { Plugin } from 'vue';
 import { ToastConfig } from 'toastflow-core';
-export declare function createToastflow(config?: Partial<ToastConfig>): Plugin;
+export interface ToastflowPluginOptions {
+    css?: boolean;
+}
+export declare function injectToastflowStyles(): void;
+export declare function createToastflow(config?: Partial<ToastConfig>, options?: ToastflowPluginOptions): Plugin;

package/dist/src/symbols.d.mts

@@ -0,0 +1,3 @@
+import { InjectionKey } from 'vue';
+import { ToastStore } from 'toastflow-core';
+export declare const toastStoreKey: InjectionKey<ToastStore>;

package/dist/src/toast-ui.d.mts

@@ -0,0 +1,159 @@
+import { Component, CSSProperties, ComputedRef, Ref } from 'vue';
+import { ToastButton, ToastId, ToastInstance, ToastStandaloneInstance, ToastStore, ToastType } from 'toastflow-core';
+type ToastSlotProps = Record<string, unknown>;
+type ToastButtonsPlacement = "left" | "right" | "top" | "bottom";
+export interface ToastUI {
+    wrapperProps: ToastSlotProps;
+    rootProps: ToastSlotProps;
+    closeProps: ToastSlotProps;
+    getWrapperProps: (props?: ToastSlotProps) => ToastSlotProps;
+    getRootProps: (props?: ToastSlotProps) => ToastSlotProps;
+    getCloseProps: (props?: ToastSlotProps) => ToastSlotProps;
+    getButtonProps: (button: ToastButton, props?: ToastSlotProps) => ToastSlotProps;
+    actions: {
+        dismiss: () => void;
+        pause: () => void;
+        resume: () => void;
+        onClick: (event: MouseEvent) => void;
+        onCloseClick: () => void;
+        onButtonClick: (button: ToastButton, event: MouseEvent) => void;
+        onMouseEnter: () => void;
+        onMouseLeave: () => void;
+        onPointerDown: (event: PointerEvent) => void;
+        onPointerMove: (event: PointerEvent) => void;
+        onPointerUp: (event: PointerEvent) => void;
+        onPointerCancel: (event: PointerEvent) => void;
+    };
+    a11y: {
+        role: string;
+        ariaLive: string;
+        titleLabel: string;
+        descriptionLabel: string;
+        toastLabel: string;
+        createdAtLabel: string;
+    };
+    state: {
+        isHovered: boolean;
+        isBumped: boolean;
+        isUpdated: boolean;
+        isSwipeEnabled: boolean;
+    };
+    classes: {
+        wrapper: string;
+        root: Array<string | false | undefined>;
+        accent: string;
+        icon: string;
+        close: string;
+        buttons: Array<string | undefined>;
+    };
+    styles: {
+        wrapper: CSSProperties;
+        root: CSSProperties;
+        progress: CSSProperties;
+    };
+    icon: {
+        show: boolean;
+        component: Component;
+        wrapperProps: ToastSlotProps;
+        componentProps: ToastSlotProps;
+    };
+    createdAt: {
+        show: boolean;
+        inline: boolean;
+        floating: boolean;
+        formatted: string;
+        ariaLabel: string;
+    };
+    buttons: {
+        items: ToastButton[];
+        has: boolean;
+        placement: ToastButtonsPlacement;
+        groupProps: ToastSlotProps;
+        getGroupProps: (props?: ToastSlotProps) => ToastSlotProps;
+    };
+    progress: {
+        show: boolean;
+        key: number;
+        wrapperProps: ToastSlotProps;
+        trackProps: ToastSlotProps;
+        barProps: ToastSlotProps;
+        getWrapperProps: (props?: ToastSlotProps) => ToastSlotProps;
+        getTrackProps: (props?: ToastSlotProps) => ToastSlotProps;
+        getBarProps: (props?: ToastSlotProps) => ToastSlotProps;
+        componentProps: {
+            key: number;
+            type: ToastType;
+            progressAlignment: ToastInstance["progressAlignment"];
+        };
+    };
+    layout: {
+        hasOutsideButtons: boolean;
+        showMetaLeft: boolean;
+        showMetaRight: boolean;
+        showMetaTop: boolean;
+        showMetaBottom: boolean;
+    };
+}
+interface UseToastUIOptions {
+    toast: Ref<ToastStandaloneInstance | ToastInstance>;
+    store: ToastStore;
+    progressResetKey?: Ref<number | undefined>;
+    duplicateKey?: Ref<number | undefined>;
+    updateKey?: Ref<number | undefined>;
+    onDismiss?: (id: ToastId) => void;
+    bumpAnimationClass?: Ref<string | undefined>;
+    clearAllAnimationClass?: Ref<string | undefined>;
+    updateAnimationClass?: Ref<string | undefined>;
+}
+export declare function useToastUI({ toast: toastProp, store, progressResetKey, duplicateKey, updateKey, onDismiss, bumpAnimationClass, clearAllAnimationClass, updateAnimationClass, }: UseToastUIOptions): {
+    toast: ComputedRef<ToastInstance>;
+    accentClass: ComputedRef<string>;
+    iconWrapperClass: ComputedRef<string>;
+    closeWrapperClass: ComputedRef<string>;
+    defaultIconComponent: ComputedRef<Component>;
+    role: ComputedRef<"alert" | "status">;
+    ariaLive: ComputedRef<"assertive" | "polite">;
+    hasCreatedAt: ComputedRef<boolean>;
+    createdAtText: ComputedRef<string>;
+    createdAtAriaLabel: ComputedRef<string>;
+    titleAriaLabel: ComputedRef<string>;
+    descriptionAriaLabel: ComputedRef<string>;
+    toastAriaLabel: ComputedRef<string>;
+    duration: ComputedRef<number | undefined>;
+    progressStyle: ComputedRef<CSSProperties>;
+    showProgressBar: ComputedRef<boolean>;
+    progressKeyLocal: Ref<number, number>;
+    isBumped: Ref<boolean, boolean>;
+    isUpdated: Ref<boolean, boolean>;
+    isHovered: Ref<boolean, boolean>;
+    handleMouseEnter: () => void;
+    handleMouseLeave: () => void;
+    handlePointerDown: (event: PointerEvent) => void;
+    handlePointerMove: (event: PointerEvent) => void;
+    handlePointerUp: (event: PointerEvent) => void;
+    handlePointerCancel: (event: PointerEvent) => void;
+    isSwipeEnabled: ComputedRef<boolean>;
+    swipeStyle: ComputedRef<CSSProperties>;
+    handleClick: (event: MouseEvent) => void;
+    handleCloseClick: () => void;
+    dismissCurrent: () => void;
+    pause: () => void;
+    resume: () => void;
+    hasButtons: ComputedRef<boolean>;
+    buttons: ComputedRef<ToastButton[]>;
+    buttonsPlacement: ComputedRef<ToastButtonsPlacement>;
+    buttonsClasses: ComputedRef<(string | undefined)[]>;
+    buttonsVarsStyle: ComputedRef<CSSProperties>;
+    handleButtonClick: (button: ToastButton, event: MouseEvent) => void;
+    toastStyle: ComputedRef<CSSProperties>;
+    showIconElement: ComputedRef<boolean>;
+    showMetaLeft: ComputedRef<boolean>;
+    showMetaRight: ComputedRef<boolean>;
+    showMetaTop: ComputedRef<boolean>;
+    showMetaBottom: ComputedRef<boolean>;
+    hasOutsideButtons: ComputedRef<boolean>;
+    showInlineCreatedAt: ComputedRef<boolean>;
+    showFloatingCreatedAt: ComputedRef<boolean>;
+    ui: ComputedRef<ToastUI>;
+};
+export {};