@soft-toast/vue 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +31 -0
- package/README.md +210 -0
- package/dist/animations/gsapConfig.d.ts +42 -0
- package/dist/animations/gsapConfig.d.ts.map +1 -0
- package/dist/composables/useFlash.d.ts +41 -0
- package/dist/composables/useFlash.d.ts.map +1 -0
- package/dist/composables/useFlash.test.d.ts +2 -0
- package/dist/composables/useFlash.test.d.ts.map +1 -0
- package/dist/composables/useToast.d.ts +53 -0
- package/dist/composables/useToast.d.ts.map +1 -0
- package/dist/composables/useToast.test.d.ts +2 -0
- package/dist/composables/useToast.test.d.ts.map +1 -0
- package/dist/exports.test.d.ts +2 -0
- package/dist/exports.test.d.ts.map +1 -0
- package/dist/icons.d.ts +2 -0
- package/dist/icons.d.ts.map +1 -0
- package/dist/index.d.ts +8 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +2100 -0
- package/dist/plugin.d.ts +7 -0
- package/dist/plugin.d.ts.map +1 -0
- package/dist/stores/toastStore.d.ts +25 -0
- package/dist/stores/toastStore.d.ts.map +1 -0
- package/dist/stores/toastStore.test.d.ts +2 -0
- package/dist/stores/toastStore.test.d.ts.map +1 -0
- package/dist/style.css +1 -0
- package/dist/types/index.d.ts +107 -0
- package/dist/types/index.d.ts.map +1 -0
- package/dist/utils/sound.d.ts +9 -0
- package/dist/utils/sound.d.ts.map +1 -0
- package/package.json +70 -0
- package/src/animations/gsapConfig.ts +303 -0
- package/src/components/ToastContainer.vue +36 -0
- package/src/components/ToastIcon.vue +33 -0
- package/src/components/ToastItem.vue +342 -0
- package/src/components/ToastProgress.vue +50 -0
- package/src/components/ToastRegion.vue +381 -0
- package/src/composables/useFlash.test.ts +164 -0
- package/src/composables/useFlash.ts +118 -0
- package/src/composables/useToast.test.ts +230 -0
- package/src/composables/useToast.ts +95 -0
- package/src/exports.test.ts +72 -0
- package/src/icons.ts +38 -0
- package/src/index.ts +25 -0
- package/src/plugin.ts +85 -0
- package/src/stores/toastStore.test.ts +129 -0
- package/src/stores/toastStore.ts +288 -0
- package/src/styles/toast.css +353 -0
- package/src/styles/variables.css +83 -0
- package/src/types/index.ts +115 -0
- package/src/utils/sound.ts +140 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 vue-soft-toast
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
|
22
|
+
|
|
23
|
+
---
|
|
24
|
+
|
|
25
|
+
Third-Party Dependencies:
|
|
26
|
+
|
|
27
|
+
This software uses GSAP (GreenSock Animation Platform), which is licensed under
|
|
28
|
+
the GSAP Standard No-Charge License. See https://greensock.com/standard-license/
|
|
29
|
+
for details. GSAP is free to use in most commercial and non-commercial websites.
|
|
30
|
+
Certain use cases may require a paid license. Please verify your use case
|
|
31
|
+
complies with GSAP's licensing terms.
|
package/README.md
ADDED
|
@@ -0,0 +1,210 @@
|
|
|
1
|
+
# @soft-toast/vue
|
|
2
|
+
|
|
3
|
+
A toast notification library for Vue 3 with soft motion, compact defaults, and flexible customization.
|
|
4
|
+
|
|
5
|
+
## Features
|
|
6
|
+
|
|
7
|
+
- **Fluid Motion**: Smooth enter, exit, stack, and swipe interactions.
|
|
8
|
+
- **Stacked Layout**: Toasts stay compact, readable, and easy to scan.
|
|
9
|
+
- **Position Options**: 11 positions including corners, edges, and center.
|
|
10
|
+
- **Motion Presets**: Choose from `smooth`, `bouncy`, `subtle`, or `snappy` presets.
|
|
11
|
+
- **Rich Content**: Supports titles, descriptions, action buttons, progress bars, and custom icons.
|
|
12
|
+
- **Promise Handling**: Built-in support for async operations with loading states.
|
|
13
|
+
- **Swipe to Dismiss**: Touch gesture support for mobile devices.
|
|
14
|
+
- **TypeScript**: Built with TypeScript for type safety.
|
|
15
|
+
|
|
16
|
+
## Compatibility
|
|
17
|
+
|
|
18
|
+
| Package | Framework | Supported versions |
|
|
19
|
+
| ------------------ | --------- | ------------------- |
|
|
20
|
+
| `@soft-toast/vue` | Vue | Vue 3.3+ |
|
|
21
|
+
| `@soft-toast/nuxt` | Nuxt | Nuxt 3.x / Nuxt 4.x |
|
|
22
|
+
|
|
23
|
+
## Installation
|
|
24
|
+
|
|
25
|
+
### Vue 3
|
|
26
|
+
|
|
27
|
+
```bash
|
|
28
|
+
npm install @soft-toast/vue
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
Package manager equivalents:
|
|
32
|
+
|
|
33
|
+
```bash
|
|
34
|
+
pnpm add @soft-toast/vue
|
|
35
|
+
yarn add @soft-toast/vue
|
|
36
|
+
bun add @soft-toast/vue
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
Register the Vue plugin in `main.ts` or `main.js`:
|
|
40
|
+
|
|
41
|
+
```typescript
|
|
42
|
+
import { createApp } from "vue";
|
|
43
|
+
import App from "./App.vue";
|
|
44
|
+
import { SoftToastPlugin } from "@soft-toast/vue";
|
|
45
|
+
import "@soft-toast/vue/dist/style.css";
|
|
46
|
+
|
|
47
|
+
const app = createApp(App);
|
|
48
|
+
|
|
49
|
+
app.use(SoftToastPlugin, {
|
|
50
|
+
position: "top-right",
|
|
51
|
+
duration: 4000,
|
|
52
|
+
closeButton: true,
|
|
53
|
+
showProgress: true,
|
|
54
|
+
});
|
|
55
|
+
|
|
56
|
+
app.mount("#app");
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
### Nuxt 3 / Nuxt 4
|
|
60
|
+
|
|
61
|
+
For Nuxt apps, install the companion module:
|
|
62
|
+
|
|
63
|
+
```bash
|
|
64
|
+
npm install @soft-toast/nuxt
|
|
65
|
+
```
|
|
66
|
+
|
|
67
|
+
Package manager equivalents:
|
|
68
|
+
|
|
69
|
+
```bash
|
|
70
|
+
pnpm add @soft-toast/nuxt
|
|
71
|
+
yarn add @soft-toast/nuxt
|
|
72
|
+
bun add @soft-toast/nuxt
|
|
73
|
+
```
|
|
74
|
+
|
|
75
|
+
Add it to `nuxt.config.ts`:
|
|
76
|
+
|
|
77
|
+
```typescript
|
|
78
|
+
export default defineNuxtConfig({
|
|
79
|
+
modules: ["@soft-toast/nuxt"],
|
|
80
|
+
});
|
|
81
|
+
```
|
|
82
|
+
|
|
83
|
+
`softToast` is optional. Add it only when you want to override global defaults:
|
|
84
|
+
|
|
85
|
+
```typescript
|
|
86
|
+
export default defineNuxtConfig({
|
|
87
|
+
modules: ["@soft-toast/nuxt"],
|
|
88
|
+
softToast: {
|
|
89
|
+
closeButton: true,
|
|
90
|
+
showProgress: true,
|
|
91
|
+
},
|
|
92
|
+
});
|
|
93
|
+
```
|
|
94
|
+
|
|
95
|
+
## Quick Start
|
|
96
|
+
|
|
97
|
+
Use it anywhere in your Vue or Nuxt components:
|
|
98
|
+
|
|
99
|
+
```vue
|
|
100
|
+
<script setup>
|
|
101
|
+
import { useToast } from "@soft-toast/vue";
|
|
102
|
+
|
|
103
|
+
const toast = useToast();
|
|
104
|
+
|
|
105
|
+
const showToast = () => {
|
|
106
|
+
toast.success("Profile saved!", {
|
|
107
|
+
description: "Your changes have been successfully saved.",
|
|
108
|
+
position: "top-right",
|
|
109
|
+
duration: 2500,
|
|
110
|
+
closeButton: true,
|
|
111
|
+
showProgress: true,
|
|
112
|
+
});
|
|
113
|
+
};
|
|
114
|
+
</script>
|
|
115
|
+
|
|
116
|
+
<template>
|
|
117
|
+
<button @click="showToast">Save Profile</button>
|
|
118
|
+
</template>
|
|
119
|
+
```
|
|
120
|
+
|
|
121
|
+
The plugin options are global defaults. You can override them per toast when a page needs different behavior:
|
|
122
|
+
|
|
123
|
+
```typescript
|
|
124
|
+
toast.warning("File moved to trash", {
|
|
125
|
+
description: "You can restore it from the activity log.",
|
|
126
|
+
position: "bottom-right",
|
|
127
|
+
duration: Infinity,
|
|
128
|
+
closeButton: "top-left",
|
|
129
|
+
showProgress: false,
|
|
130
|
+
});
|
|
131
|
+
```
|
|
132
|
+
|
|
133
|
+
## API Overview
|
|
134
|
+
|
|
135
|
+
### `toast[type](title, options)`
|
|
136
|
+
|
|
137
|
+
Available types: `default`, `success`, `error`, `warning`, `info`, `promise`.
|
|
138
|
+
|
|
139
|
+
**Example:**
|
|
140
|
+
|
|
141
|
+
```typescript
|
|
142
|
+
toast.error("Network Error", {
|
|
143
|
+
description: "Failed to connect to the server.",
|
|
144
|
+
duration: 6000,
|
|
145
|
+
action: {
|
|
146
|
+
label: "Retry",
|
|
147
|
+
onClick: () => retryConnection(),
|
|
148
|
+
},
|
|
149
|
+
});
|
|
150
|
+
```
|
|
151
|
+
|
|
152
|
+
### Options
|
|
153
|
+
|
|
154
|
+
| Property | Type | Default | Description |
|
|
155
|
+
| --------------- | ---------------------------------------------- | ------------- | -------------------------------------------------------------- |
|
|
156
|
+
| `position` | `ToastPosition` | `'top-right'` | Position on screen (e.g. `'top'`, `'bottom-left'`, `'center'`) |
|
|
157
|
+
| `duration` | `number` | `4000` | Auto-close delay in ms (`Infinity` disables auto-close) |
|
|
158
|
+
| `preset` | `'smooth' \| 'bouncy' \| 'subtle' \| 'snappy'` | `'smooth'` | Motion style |
|
|
159
|
+
| `description` | `string \| VNode` | `undefined` | Secondary text below the title |
|
|
160
|
+
| `action` | `ToastAction \| ToastAction[]` | `undefined` | Interactive button config (`label`, `onClick`) |
|
|
161
|
+
| `showProgress` | `boolean` | `false` | Shows a decreasing progress bar |
|
|
162
|
+
| `closeButton` | `boolean \| 'top-left' \| 'top-right'` | `false` | Shows a dismiss button for this toast |
|
|
163
|
+
| `showTimestamp` | `boolean` | `false` | Shows the time the toast was created |
|
|
164
|
+
| `icon` | `string \| VNode \| Component` | `undefined` | Custom icon string (Iconify `line-md` support) or Component |
|
|
165
|
+
|
|
166
|
+
## Icons & Customization
|
|
167
|
+
|
|
168
|
+
Supports **Iconify** icons and custom Vue components.
|
|
169
|
+
|
|
170
|
+
```typescript
|
|
171
|
+
// 1. Using Iconify icon string
|
|
172
|
+
toast.success("Awesome!", { icon: "line-md:star" });
|
|
173
|
+
|
|
174
|
+
// 2. Using a Custom Vue Component
|
|
175
|
+
import MyIcon from "./MyIcon.vue";
|
|
176
|
+
toast.info("Custom Icon", { icon: MyIcon });
|
|
177
|
+
```
|
|
178
|
+
|
|
179
|
+
## Slot Architecture
|
|
180
|
+
|
|
181
|
+
`@soft-toast/vue` provides customization slots for `<SoftToastContainer>`.
|
|
182
|
+
|
|
183
|
+
Available slots: `#icon`, `#title`, `#description`, `#action`, `#close-button`.
|
|
184
|
+
|
|
185
|
+
```vue
|
|
186
|
+
<SoftToastContainer>
|
|
187
|
+
<!-- Override the close button -->
|
|
188
|
+
<template #close-button="{ dismiss }">
|
|
189
|
+
<button @click="dismiss" class="my-custom-close-btn">Close</button>
|
|
190
|
+
</template>
|
|
191
|
+
|
|
192
|
+
<!-- Override the action button -->
|
|
193
|
+
<template #action="{ toast, execute }">
|
|
194
|
+
<button @click="execute" class="my-custom-action-btn">
|
|
195
|
+
{{ toast.action.label }}
|
|
196
|
+
</button>
|
|
197
|
+
</template>
|
|
198
|
+
</SoftToastContainer>
|
|
199
|
+
```
|
|
200
|
+
|
|
201
|
+
## Positions
|
|
202
|
+
|
|
203
|
+
11 available positions:
|
|
204
|
+
`top-left`, `top-center`, `top-right`, `bottom-left`, `bottom-center`, `bottom-right`, `top`, `bottom`, `left`, `right`, `center`.
|
|
205
|
+
|
|
206
|
+
## License
|
|
207
|
+
|
|
208
|
+
MIT License.
|
|
209
|
+
|
|
210
|
+
> **Note on GSAP:** This library uses [GSAP](https://greensock.com/gsap/) for animations. GSAP is subject to its own [Standard No-Charge License](https://greensock.com/standard-license/).
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { AnimationPreset } from '../types';
|
|
2
|
+
export declare const presetConfigs: Record<AnimationPreset, {
|
|
3
|
+
ease: string;
|
|
4
|
+
elasticEase: string;
|
|
5
|
+
duration: number;
|
|
6
|
+
}>;
|
|
7
|
+
export declare const createElasticEase: (bounce: number) => string;
|
|
8
|
+
export declare const landingAnimation: (element: HTMLElement, options?: {
|
|
9
|
+
preset?: AnimationPreset;
|
|
10
|
+
bounce?: number;
|
|
11
|
+
spring?: boolean;
|
|
12
|
+
direction?: "up" | "down";
|
|
13
|
+
}) => gsap.core.Timeline;
|
|
14
|
+
export declare const morphAnimation: (element: HTMLElement, options?: {
|
|
15
|
+
preset?: AnimationPreset;
|
|
16
|
+
bounce?: number;
|
|
17
|
+
spring?: boolean;
|
|
18
|
+
}) => gsap.core.Timeline;
|
|
19
|
+
export declare const exitAnimation: (element: HTMLElement) => gsap.core.Tween;
|
|
20
|
+
export declare const swipeExitAnimation: (element: HTMLElement, toX: number) => gsap.core.Tween;
|
|
21
|
+
export declare const swipeSnapBack: (element: HTMLElement) => gsap.core.Tween;
|
|
22
|
+
export declare const expandAnimation: (element: HTMLElement) => gsap.core.Tween;
|
|
23
|
+
export declare const collapseAnimation: (element: HTMLElement) => gsap.core.Tween;
|
|
24
|
+
export declare const positionAnimation: (element: HTMLElement, options: {
|
|
25
|
+
index: number;
|
|
26
|
+
expanded: boolean;
|
|
27
|
+
preset?: AnimationPreset;
|
|
28
|
+
bounce?: number;
|
|
29
|
+
spring?: boolean;
|
|
30
|
+
direction?: "up" | "down";
|
|
31
|
+
expandedOffset?: number;
|
|
32
|
+
liftPx?: number;
|
|
33
|
+
scaleStep?: number;
|
|
34
|
+
opacityStep?: number;
|
|
35
|
+
maxVisible?: number;
|
|
36
|
+
reposition?: boolean;
|
|
37
|
+
}) => gsap.core.Tween;
|
|
38
|
+
export declare const progressAnimation: (element: HTMLElement, duration: number, onComplete?: () => void) => gsap.core.Tween;
|
|
39
|
+
export declare const pauseAnimation: (animation: gsap.core.Tween | gsap.core.Timeline) => gsap.core.Tween | gsap.core.Timeline;
|
|
40
|
+
export declare const resumeAnimation: (animation: gsap.core.Tween | gsap.core.Timeline) => gsap.core.Tween | gsap.core.Timeline;
|
|
41
|
+
export declare const killAnimations: (element: HTMLElement) => void;
|
|
42
|
+
//# sourceMappingURL=gsapConfig.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"gsapConfig.d.ts","sourceRoot":"","sources":["../../src/animations/gsapConfig.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE/C,eAAO,MAAM,aAAa,EAAE,MAAM,CAAC,eAAe,EAAE;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAE,CAqB1G,CAAA;AAQD,eAAO,MAAM,iBAAiB,GAAI,QAAQ,MAAM,WAI/C,CAAA;AAwCD,eAAO,MAAM,gBAAgB,GAC3B,SAAS,WAAW,EACpB,UAAS;IACP,MAAM,CAAC,EAAE,eAAe,CAAA;IACxB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAA;CACrB,uBAyCP,CAAA;AAGD,eAAO,MAAM,cAAc,GACzB,SAAS,WAAW,EACpB,UAAS;IAAE,MAAM,CAAC,EAAE,eAAe,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,OAAO,CAAA;CAAO,uBAoB9E,CAAA;AAGD,eAAO,MAAM,aAAa,GACxB,SAAS,WAAW,oBAUrB,CAAA;AAGD,eAAO,MAAM,kBAAkB,GAC7B,SAAS,WAAW,EACpB,KAAK,MAAM,oBAUZ,CAAA;AAGD,eAAO,MAAM,aAAa,GAAI,SAAS,WAAW,oBASjD,CAAA;AAED,eAAO,MAAM,eAAe,GAAI,SAAS,WAAW,oBACqB,CAAA;AAEzE,eAAO,MAAM,iBAAiB,GAAI,SAAS,WAAW,oBACa,CAAA;AAKnE,eAAO,MAAM,iBAAiB,GAC5B,SAAS,WAAW,EACpB,SAAS;IACP,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,OAAO,CAAA;IACjB,MAAM,CAAC,EAAE,eAAe,CAAA;IACxB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAA;IACzB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB,oBAmEF,CAAA;AAED,eAAO,MAAM,iBAAiB,GAC5B,SAAS,WAAW,EACpB,UAAU,MAAM,EAChB,aAAa,MAAM,IAAI,oBAKtB,CAAA;AAEH,eAAO,MAAM,cAAc,GAAI,WAAW,IAAI,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,yCAC3D,CAAA;AAEnB,eAAO,MAAM,eAAe,GAAI,WAAW,IAAI,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,yCAC7D,CAAA;AAElB,eAAO,MAAM,cAAc,GAAI,SAAS,WAAW,SACvB,CAAA"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { ToastOptions } from '../types';
|
|
2
|
+
/**
|
|
3
|
+
* Queue a flash toast to show on the NEXT page load / route change.
|
|
4
|
+
* Flash items expire after 30 seconds to avoid stale messages.
|
|
5
|
+
*/
|
|
6
|
+
export declare const queueFlash: (title: string, options?: Partial<Omit<ToastOptions, "id">>) => void;
|
|
7
|
+
/**
|
|
8
|
+
* Consume all pending flash messages and show them as toasts.
|
|
9
|
+
* Call this in onMounted() of your layout or App.vue.
|
|
10
|
+
* Returns the number of flashes shown.
|
|
11
|
+
*/
|
|
12
|
+
export declare const consumeFlashes: () => number;
|
|
13
|
+
/**
|
|
14
|
+
* Check if there are pending flashes without consuming them.
|
|
15
|
+
*/
|
|
16
|
+
export declare const hasPendingFlashes: () => boolean;
|
|
17
|
+
/**
|
|
18
|
+
* useFlash() — composable for components and route guards.
|
|
19
|
+
*
|
|
20
|
+
* @example
|
|
21
|
+
* // In a page component:
|
|
22
|
+
* const { flash } = useFlash()
|
|
23
|
+
* const save = async () => {
|
|
24
|
+
* await api.save()
|
|
25
|
+
* flash('Changes saved!', { type: 'success' })
|
|
26
|
+
* router.push('/home')
|
|
27
|
+
* }
|
|
28
|
+
*
|
|
29
|
+
* // In App.vue or layout:
|
|
30
|
+
* const { showPendingFlashes } = useFlash()
|
|
31
|
+
* onMounted(showPendingFlashes)
|
|
32
|
+
*/
|
|
33
|
+
export declare const useFlash: () => {
|
|
34
|
+
/** Queue a toast that will appear on the next page/route */
|
|
35
|
+
flash: (title: string, options?: Partial<Omit<ToastOptions, "id">>) => void;
|
|
36
|
+
/** Show all pending flashes now — call in onMounted */
|
|
37
|
+
showPendingFlashes: () => number;
|
|
38
|
+
/** True if there are flashes waiting to be shown */
|
|
39
|
+
hasPending: () => boolean;
|
|
40
|
+
};
|
|
41
|
+
//# sourceMappingURL=useFlash.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useFlash.d.ts","sourceRoot":"","sources":["../../src/composables/useFlash.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAiC5C;;;GAGG;AACH,eAAO,MAAM,UAAU,GACrB,OAAO,MAAM,EACb,UAAS,OAAO,CAAC,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,CAAM,KAC9C,IAMF,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,cAAc,QAAO,MAYjC,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,iBAAiB,QAAO,OAEpC,CAAA;AAID;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,QAAQ;IACnB,4DAA4D;mBAvDrD,MAAM,YACJ,OAAO,CAAC,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC,KACzC,IAAI;IAuDL,uDAAuD;8BA1CvB,MAAM;IA4CtC,oDAAoD;sBA3BjB,OAAO;CA6B1C,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useFlash.test.d.ts","sourceRoot":"","sources":["../../src/composables/useFlash.test.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { ToastOptions, ToastPromiseMessages } from '../types';
|
|
2
|
+
export declare const useToast: () => {
|
|
3
|
+
default: (title: string, options?: Omit<ToastOptions, "type" | "title">) => string;
|
|
4
|
+
success: (title: string, options?: Omit<ToastOptions, "type" | "title">) => string;
|
|
5
|
+
error: (title: string, options?: Omit<ToastOptions, "type" | "title">) => string;
|
|
6
|
+
warning: (title: string, options?: Omit<ToastOptions, "type" | "title">) => string;
|
|
7
|
+
info: (title: string, options?: Omit<ToastOptions, "type" | "title">) => string;
|
|
8
|
+
loading: (title: string, options?: Omit<ToastOptions, "type" | "title">) => string;
|
|
9
|
+
promise: <T>(promiseFn: Promise<T>, messages: ToastPromiseMessages, options?: Omit<ToastOptions, "type" | "promise" | "promiseMessages">) => Promise<T>;
|
|
10
|
+
custom: (options: ToastOptions) => string;
|
|
11
|
+
update: (id: string, options: Partial<ToastOptions>) => void;
|
|
12
|
+
dismiss: (id?: string) => void;
|
|
13
|
+
dismissAll: () => void;
|
|
14
|
+
pause: (id: string) => void;
|
|
15
|
+
resume: (id: string) => void;
|
|
16
|
+
/**
|
|
17
|
+
* Queue a toast that will be shown on the next page load / route navigation.
|
|
18
|
+
* Perfect for the "submit → redirect → show success" pattern.
|
|
19
|
+
*
|
|
20
|
+
* @example
|
|
21
|
+
* const { flash } = useToast()
|
|
22
|
+
* await api.save()
|
|
23
|
+
* flash('Saved!', { type: 'success' })
|
|
24
|
+
* router.push('/dashboard')
|
|
25
|
+
*/
|
|
26
|
+
flash: (title: string, options?: Partial<Omit<ToastOptions, "id">>) => void;
|
|
27
|
+
/**
|
|
28
|
+
* Show any toasts that were queued with flash() before a page navigation.
|
|
29
|
+
* Call this in onMounted() of your root layout or App.vue.
|
|
30
|
+
*/
|
|
31
|
+
showFlashes: () => number;
|
|
32
|
+
/** Check if there are pending flash messages without consuming them. */
|
|
33
|
+
hasFlashes: () => boolean;
|
|
34
|
+
};
|
|
35
|
+
export declare const toast: {
|
|
36
|
+
default: (title: string, options?: Omit<ToastOptions, "type" | "title">) => string;
|
|
37
|
+
success: (title: string, options?: Omit<ToastOptions, "type" | "title">) => string;
|
|
38
|
+
error: (title: string, options?: Omit<ToastOptions, "type" | "title">) => string;
|
|
39
|
+
warning: (title: string, options?: Omit<ToastOptions, "type" | "title">) => string;
|
|
40
|
+
info: (title: string, options?: Omit<ToastOptions, "type" | "title">) => string;
|
|
41
|
+
loading: (title: string, options?: Omit<ToastOptions, "type" | "title">) => string;
|
|
42
|
+
promise: <T>(promiseFn: Promise<T>, messages: ToastPromiseMessages, options?: Omit<ToastOptions, "type" | "promise" | "promiseMessages">) => Promise<T>;
|
|
43
|
+
custom: (options: ToastOptions) => string;
|
|
44
|
+
update: (id: string, options: Partial<ToastOptions>) => void;
|
|
45
|
+
dismiss: (id?: string) => void;
|
|
46
|
+
dismissAll: () => void;
|
|
47
|
+
pause: (id: string) => void;
|
|
48
|
+
resume: (id: string) => void;
|
|
49
|
+
flash: (title: string, options?: Partial<Omit<ToastOptions, "id">>) => void;
|
|
50
|
+
showFlashes: () => number;
|
|
51
|
+
hasFlashes: () => boolean;
|
|
52
|
+
};
|
|
53
|
+
//# sourceMappingURL=useToast.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useToast.d.ts","sourceRoot":"","sources":["../../src/composables/useToast.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAA;AAMlE,eAAO,MAAM,QAAQ;qBACF,MAAM,YAAY,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC;qBAGtD,MAAM,YAAY,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC;mBAGxD,MAAM,YAAY,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC;qBAGpD,MAAM,YAAY,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC;kBAGzD,MAAM,YAAY,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC;qBAGnD,MAAM,YAAY,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC;cAG7D,CAAC,aACE,OAAO,CAAC,CAAC,CAAC,YACX,oBAAoB,YACpB,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,SAAS,GAAG,iBAAiB,CAAC,KACnE,OAAO,CAAC,CAAC,CAAC;sBAEK,YAAY;iBAEjB,MAAM,WAAW,OAAO,CAAC,YAAY,CAAC;mBAEpC,MAAM;;gBAGT,MAAM;iBACL,MAAM;IAEnB;;;;;;;;;OASG;mBACY,MAAM,YAAW,OAAO,CAAC,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC;IAGjE;;;OAGG;;IAGH,wEAAwE;;CAExE,CAAA;AAIF,eAAO,MAAM,KAAK;qBACC,MAAM,YAAY,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC;qBAEtD,MAAM,YAAY,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC;mBAExD,MAAM,YAAY,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC;qBAEpD,MAAM,YAAY,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC;kBAEzD,MAAM,YAAY,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC;qBAEnD,MAAM,YAAY,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC;cAE7D,CAAC,aACE,OAAO,CAAC,CAAC,CAAC,YACX,oBAAoB,YACpB,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,SAAS,GAAG,iBAAiB,CAAC,KACnE,OAAO,CAAC,CAAC,CAAC;sBACK,YAAY;iBACjB,MAAM,WAAW,OAAO,CAAC,YAAY,CAAC;mBACpC,MAAM;;gBAET,MAAM;iBACL,MAAM;mBACJ,MAAM,YAAW,OAAO,CAAC,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC;;;CAIlE,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useToast.test.d.ts","sourceRoot":"","sources":["../../src/composables/useToast.test.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"exports.test.d.ts","sourceRoot":"","sources":["../src/exports.test.ts"],"names":[],"mappings":""}
|
package/dist/icons.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../src/icons.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,kBAAkB,YA4B9B,CAAC"}
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export { SoftToastPlugin, getToastOptions } from './plugin';
|
|
2
|
+
export { useToast, toast } from './composables/useToast';
|
|
3
|
+
export { useFlash, queueFlash, consumeFlashes, hasPendingFlashes } from './composables/useFlash';
|
|
4
|
+
export { toastStore } from './stores/toastStore';
|
|
5
|
+
export { default as ToastContainer } from './components/ToastContainer.vue';
|
|
6
|
+
export { default as ToastItem } from './components/ToastItem.vue';
|
|
7
|
+
export type { Toast, ToastType, ToastPosition, ToastOptions, ToastAction, ToastPromiseMessages, ToastClassNames, ToastContainerProps, ToastPluginOptions, AnimationPreset, QueueOverflow } from './types';
|
|
8
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAC3D,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAA;AACxD,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAChG,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;AAGhD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,iCAAiC,CAAA;AAC3E,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,4BAA4B,CAAA;AAGjE,YAAY,EACV,KAAK,EACL,SAAS,EACT,aAAa,EACb,YAAY,EACZ,WAAW,EACX,oBAAoB,EACpB,eAAe,EACf,mBAAmB,EACnB,kBAAkB,EAClB,eAAe,EACf,aAAa,EACd,MAAM,SAAS,CAAA"}
|