vue-toastflow 1.0.8 → 1.0.9
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/README.md +13 -3
- package/dist/toastflow.es.js +427 -415
- package/dist/toastflow.umd.js +1 -1
- package/dist/vue-toastflow.css +1 -1
- package/package.json +2 -2
- package/src/components/Toast.vue +21 -2
package/README.md
CHANGED
|
@@ -5,6 +5,13 @@
|
|
|
5
5
|
</p>
|
|
6
6
|
|
|
7
7
|
<h1 align="center">Toastflow</h1>
|
|
8
|
+
<p align="center">
|
|
9
|
+
<a href="https://javascriptweekly.com/issues/765" target="_blank">
|
|
10
|
+
📰 Featured in JavaScript Weekly
|
|
11
|
+
</a> · <a href="https://www.reddit.com/r/vuejs/comments/1pgfoey/tired_of_vue_toast_libraries_so_i_built_my_own/" target="_blank">
|
|
12
|
+
🔥 Trending on Reddit (/r/vuejs)
|
|
13
|
+
</a>
|
|
14
|
+
</p>
|
|
8
15
|
<p align="center">
|
|
9
16
|
Framework-agnostic toast engine with a Vue 3 renderer. Typed core, smooth stack animations, CSS-first theming, and full control over layout and behavior.
|
|
10
17
|
</p>
|
|
@@ -67,7 +74,8 @@ you can render it your way while keeping predictable behaviors.
|
|
|
67
74
|
- [toastflow-core](https://www.npmjs.com/package/toastflow-core): typed, framework-agnostic toast store.
|
|
68
75
|
- [vue-toastflow](https://www.npmjs.com/package/vue-toastflow): Vue 3 renderer with `<ToastContainer />`, a
|
|
69
76
|
global `toast` helper, defaults, and icons.
|
|
70
|
-
- [playground-vue](https://github.com/adrianjanocko/toastflow/blob/main/packages/playground/vue): Vite + Vue demo
|
|
77
|
+
- [playground-vue](https://github.com/adrianjanocko/toastflow/blob/main/packages/playground/vue): Vite + Vue demo
|
|
78
|
+
playground for manual testing.
|
|
71
79
|
|
|
72
80
|
## Built with
|
|
73
81
|
|
|
@@ -203,7 +211,8 @@ toast.info({
|
|
|
203
211
|
|
|
204
212
|
## Configuration
|
|
205
213
|
|
|
206
|
-
Pass any [types.ts](https://github.com/adrianjanocko/toastflow/blob/main/packages/core/src/types.ts) fields
|
|
214
|
+
Pass any [types.ts](https://github.com/adrianjanocko/toastflow/blob/main/packages/core/src/types.ts) fields
|
|
215
|
+
to `createToastflow`; per-toast options override them:
|
|
207
216
|
|
|
208
217
|
- `position`: "top-right" (default), "top-left", "top-center", "bottom-*"
|
|
209
218
|
- `duration`: `5000` ms by default; `Infinity` or `0` disables auto-dismiss (progress bar auto-hides when disabled)
|
|
@@ -220,7 +229,8 @@ Pass any [types.ts](https://github.com/adrianjanocko/toastflow/blob/main/package
|
|
|
220
229
|
|
|
221
230
|
## Theming
|
|
222
231
|
|
|
223
|
-
- CSS variables live in [styles.css](https://github.com/adrianjanocko/toastflow/blob/main/packages/vue/src/styles.css)
|
|
232
|
+
- CSS variables live in [styles.css](https://github.com/adrianjanocko/toastflow/blob/main/packages/vue/src/styles.css)
|
|
233
|
+
and are auto-imported with the Vue package.
|
|
224
234
|
- Key
|
|
225
235
|
variables: `--tf-toast-bg`, `--tf-toast-color`, `--tf-toast-border-color`, `--tf-toast-radius`, `--tf-toast-padding`, `--tf-toast-icon-size`, `--tf-toast-progress-height`,
|
|
226
236
|
plus per-type colors like `--success-bg` and `--error-text`.
|