From ea4193e6482da4bbc697071ded91f4bf3959d529 Mon Sep 17 00:00:00 2001
From: Driss Chelouati
Date: Mon, 26 Sep 2022 23:27:03 +0100
Subject: [PATCH 01/16] feat: add basic nav [wip], add hero [wip]
---
.eslintrc | 1 +
playground/app.vue | 263 +-----
playground/assets/img/logo.svg | 18 +
playground/assets/img/mountains.svg | 764 ++++++++++++++++++
playground/components/Hero.vue | 58 ++
playground/components/Navigation.vue | 136 ++++
playground/composables/useDarkmode.ts | 32 +
.../composables/useWindowScrollFixed.ts | 16 +
playground/nuxt.config.ts | 9 +
playground/pages/api.vue | 3 +
playground/pages/index.vue | 269 ++++++
11 files changed, 1312 insertions(+), 257 deletions(-)
create mode 100644 playground/assets/img/logo.svg
create mode 100644 playground/assets/img/mountains.svg
create mode 100644 playground/components/Hero.vue
create mode 100644 playground/components/Navigation.vue
create mode 100644 playground/composables/useDarkmode.ts
create mode 100644 playground/composables/useWindowScrollFixed.ts
create mode 100644 playground/pages/api.vue
create mode 100644 playground/pages/index.vue
diff --git a/.eslintrc b/.eslintrc
index adaea51..0facac4 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -20,6 +20,7 @@
"error",
{ "whitelist": ["^ninja-(.*)$"] }
],
+ "tailwindcss/classnames-order": "off",
"prettier-vue/prettier": [
"error",
{
diff --git a/playground/app.vue b/playground/app.vue
index 3c207aa..0a7dc7f 100644
--- a/playground/app.vue
+++ b/playground/app.vue
@@ -1,264 +1,13 @@
-
-
-
Nuxt module playground!
-
- show basic toast
-
-
- show custom toast
-
-
- show advanced toast
-
-
- clear advanced toasts
-
-
- clear all toast
-
+
+
+
\ No newline at end of file
diff --git a/playground/assets/img/logo.svg b/playground/assets/img/logo.svg
new file mode 100644
index 0000000..a95788d
--- /dev/null
+++ b/playground/assets/img/logo.svg
@@ -0,0 +1,18 @@
+
+
+
+
+
+
+
+
+
+
diff --git a/playground/assets/img/mountains.svg b/playground/assets/img/mountains.svg
new file mode 100644
index 0000000..66b7caf
--- /dev/null
+++ b/playground/assets/img/mountains.svg
@@ -0,0 +1,764 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/playground/components/Hero.vue b/playground/components/Hero.vue
new file mode 100644
index 0000000..69335c7
--- /dev/null
+++ b/playground/components/Hero.vue
@@ -0,0 +1,58 @@
+
+
+
+
+
+
+
+ Nuxt 3 Ready
+
+
+
Headless Nuxt 3 toaster module
+
+
+
+
+
+
+
+
+
+
+
diff --git a/playground/components/Navigation.vue b/playground/components/Navigation.vue
new file mode 100644
index 0000000..84582a0
--- /dev/null
+++ b/playground/components/Navigation.vue
@@ -0,0 +1,136 @@
+
+
+
+
+
+
+
+
+
Nuxt Toaster
+
+
+
+ Examples
+ API docs
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ toggleDark()" + />
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/playground/composables/useDarkmode.ts b/playground/composables/useDarkmode.ts
new file mode 100644
index 0000000..1068e1e
--- /dev/null
+++ b/playground/composables/useDarkmode.ts
@@ -0,0 +1,32 @@
+import {
+ createSharedComposable,
+ usePreferredDark,
+ useToggle
+} from '@vueuse/core'
+
+const sharedDarkmode = createSharedComposable(() => {
+ const preferredDark = usePreferredDark()
+ const colorSchema = useCookie<'light' | 'dark' | undefined>('color-schema', {
+ default: () => undefined
+ })
+
+ const isDark = computed({
+ get() {
+ return colorSchema.value
+ ? colorSchema.value === 'dark'
+ : preferredDark.value
+ },
+ set(v: boolean) {
+ colorSchema.value = v ? 'dark' : 'light'
+ }
+ })
+
+ const toggleDark = useToggle(isDark)
+
+ return {
+ isDark,
+ toggleDark
+ }
+})
+
+export const useDarkmode = () => sharedDarkmode()
diff --git a/playground/composables/useWindowScrollFixed.ts b/playground/composables/useWindowScrollFixed.ts
new file mode 100644
index 0000000..fe4e019
--- /dev/null
+++ b/playground/composables/useWindowScrollFixed.ts
@@ -0,0 +1,16 @@
+import { useWindowScroll } from '@vueuse/core'
+
+export function useWindowScrollFixed() {
+ const { x, y } = useWindowScroll()
+
+ onMounted(() => {
+ x.value = 0
+ y.value = 0
+ nextTick(() => {
+ x.value = window.pageXOffset
+ y.value = window.pageYOffset
+ })
+ })
+
+ return { x, y }
+}
diff --git a/playground/nuxt.config.ts b/playground/nuxt.config.ts
index 338f593..a03d0db 100644
--- a/playground/nuxt.config.ts
+++ b/playground/nuxt.config.ts
@@ -6,6 +6,15 @@ export default defineNuxtConfig({
toaster: {},
app: {
head: {
+ link: [
+ //
+ { rel: 'preconnect', href: 'https://fonts.googleapis.com' },
+ { rel: 'preconnect', href: 'https://fonts.gstatic.com' },
+ {
+ rel: 'stylesheet',
+ href: 'https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900?family=Elsie+Swash+Caps:wght@400;900&display=swap'
+ }
+ ],
script: [
{
src: 'https://cdn.tailwindcss.com'
diff --git a/playground/pages/api.vue b/playground/pages/api.vue
new file mode 100644
index 0000000..2e3d649
--- /dev/null
+++ b/playground/pages/api.vue
@@ -0,0 +1,3 @@
+
+ API page
+
\ No newline at end of file
diff --git a/playground/pages/index.vue b/playground/pages/index.vue
new file mode 100644
index 0000000..cddaa7d
--- /dev/null
+++ b/playground/pages/index.vue
@@ -0,0 +1,269 @@
+
+
+
+
+
+
+
Nuxt module playground!
+
+ show basic toast
+
+
+ show custom toast
+
+
+ show advanced toast
+
+
+ clear advanced toasts
+
+
+ clear all toast
+
+
+
+
+
+
From ac27b6875577141122a2f1e74107133303249ed5 Mon Sep 17 00:00:00 2001
From: Driss Chelouati
Date: Tue, 27 Sep 2022 11:06:13 +0100
Subject: [PATCH 02/16] feat: polish navigation, add toast UI examples for hero
---
.npmrc | 2 +
package.json | 2 +-
playground/app.vue | 6 +-
playground/assets/img/logo-text.svg | 12 +
playground/assets/img/logo.svg | 15 +-
playground/components/Hero.vue | 41 +++-
playground/components/Navigation.vue | 6 +-
playground/components/toast/ActionButtons.vue | 18 ++
.../components/toast/IconSoloDanger.vue | 40 ++++
playground/components/toast/IconSuccess.vue | 17 ++
playground/components/toast/LabelInfo.vue | 19 ++
playground/components/toast/LabelSuccess.vue | 23 ++
.../components/toast/UserReplyClose.vue | 34 +++
pnpm-lock.yaml | 216 +++++++++---------
14 files changed, 326 insertions(+), 125 deletions(-)
create mode 100644 .npmrc
create mode 100644 playground/assets/img/logo-text.svg
create mode 100644 playground/components/toast/ActionButtons.vue
create mode 100644 playground/components/toast/IconSoloDanger.vue
create mode 100644 playground/components/toast/IconSuccess.vue
create mode 100644 playground/components/toast/LabelInfo.vue
create mode 100644 playground/components/toast/LabelSuccess.vue
create mode 100644 playground/components/toast/UserReplyClose.vue
diff --git a/.npmrc b/.npmrc
new file mode 100644
index 0000000..cfe5d6d
--- /dev/null
+++ b/.npmrc
@@ -0,0 +1,2 @@
+strict-peer-dependencies=false
+shamefully-hoist=true
\ No newline at end of file
diff --git a/package.json b/package.json
index 2604753..5eb4e9c 100644
--- a/package.json
+++ b/package.json
@@ -32,7 +32,7 @@
"@antfu/eslint-config": "^0.27.0",
"@nuxt/module-builder": "latest",
"@nuxt/schema": "^3.0.0-rc.11",
- "eslint": "8.23.1",
+ "eslint": "8.24.0",
"eslint-config-prettier": "8.5.0",
"eslint-plugin-prettier-vue": "4.2.0",
"eslint-plugin-tailwindcss": "3.6.1",
diff --git a/playground/app.vue b/playground/app.vue
index 0a7dc7f..e10d7b3 100644
--- a/playground/app.vue
+++ b/playground/app.vue
@@ -1,5 +1,9 @@
+
+
-
+
diff --git a/playground/assets/img/logo-text.svg b/playground/assets/img/logo-text.svg
new file mode 100644
index 0000000..269b4d7
--- /dev/null
+++ b/playground/assets/img/logo-text.svg
@@ -0,0 +1,12 @@
+
+
+
+
+
+
+
+
diff --git a/playground/assets/img/logo.svg b/playground/assets/img/logo.svg
index a95788d..dab18ad 100644
--- a/playground/assets/img/logo.svg
+++ b/playground/assets/img/logo.svg
@@ -6,13 +6,20 @@
.st0{fill:#6E8EE6;}
.st1{fill:#5277CC;}
.st2{fill:#B8C6F2;}
+ .st3{fill:#EBF1FF;}
-
-
+
+
+
+
+
+
diff --git a/playground/components/Hero.vue b/playground/components/Hero.vue
index 69335c7..ff95453 100644
--- a/playground/components/Hero.vue
+++ b/playground/components/Hero.vue
@@ -3,11 +3,33 @@
class="min-h-screen w-full overflow-hidden bg-stone-100 dark:bg-stone-900"
>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
+
Nuxt 3 Ready
-
Headless Nuxt 3 toaster module
+
+ 🔔 A simple toaster (notifier) handler
+ for Nuxt.js
+
-
+
diff --git a/playground/components/Navigation.vue b/playground/components/Navigation.vue
index 84582a0..6154c7a 100644
--- a/playground/components/Navigation.vue
+++ b/playground/components/Navigation.vue
@@ -13,14 +13,14 @@ const isChecked = ref(false)
diff --git a/playground/components/toast/ActionButtons.vue b/playground/components/toast/ActionButtons.vue
new file mode 100644
index 0000000..2e6676d
--- /dev/null
+++ b/playground/components/toast/ActionButtons.vue
@@ -0,0 +1,18 @@
+
+
+
+ Dismiss
+
+
+ Accept
+
+
+
\ No newline at end of file
diff --git a/playground/components/toast/IconSoloDanger.vue b/playground/components/toast/IconSoloDanger.vue
new file mode 100644
index 0000000..20690f2
--- /dev/null
+++ b/playground/components/toast/IconSoloDanger.vue
@@ -0,0 +1,40 @@
+
+
+
+
+ Fire alert
+ Get out of here fast!
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/toast/IconSuccess.vue b/playground/components/toast/IconSuccess.vue
new file mode 100644
index 0000000..f5deda5
--- /dev/null
+++ b/playground/components/toast/IconSuccess.vue
@@ -0,0 +1,17 @@
+
+
+
+
Your changes were saved!
+
+
\ No newline at end of file
diff --git a/playground/components/toast/LabelInfo.vue b/playground/components/toast/LabelInfo.vue
new file mode 100644
index 0000000..dc8ebaf
--- /dev/null
+++ b/playground/components/toast/LabelInfo.vue
@@ -0,0 +1,19 @@
+
+
+
+
+ Your changes were saved!
+
+
+
\ No newline at end of file
diff --git a/playground/components/toast/LabelSuccess.vue b/playground/components/toast/LabelSuccess.vue
new file mode 100644
index 0000000..7737f5c
--- /dev/null
+++ b/playground/components/toast/LabelSuccess.vue
@@ -0,0 +1,23 @@
+
+
+
+
+ Nuxt has been installed!
+
+
+
\ No newline at end of file
diff --git a/playground/components/toast/UserReplyClose.vue b/playground/components/toast/UserReplyClose.vue
new file mode 100644
index 0000000..ea83536
--- /dev/null
+++ b/playground/components/toast/UserReplyClose.vue
@@ -0,0 +1,34 @@
+
+
+
+
+
+
+ Clark E.
+ Replied to your post
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index c9d2553..b605b73 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -7,7 +7,7 @@ specifiers:
'@nuxt/schema': ^3.0.0-rc.11
'@vueuse/core': ^9.2.0
defu: ^6.1.0
- eslint: 8.23.1
+ eslint: 8.24.0
eslint-config-prettier: 8.5.0
eslint-plugin-prettier-vue: 4.2.0
eslint-plugin-tailwindcss: 3.6.1
@@ -21,15 +21,15 @@ dependencies:
defu: 6.1.0
devDependencies:
- '@antfu/eslint-config': 0.27.0_eslint@8.23.1
+ '@antfu/eslint-config': 0.27.0_eslint@8.24.0
'@nuxt/module-builder': 0.1.7
'@nuxt/schema': 3.0.0-rc.11
- eslint: 8.23.1
- eslint-config-prettier: 8.5.0_eslint@8.23.1
+ eslint: 8.24.0
+ eslint-config-prettier: 8.5.0_eslint@8.24.0
eslint-plugin-prettier-vue: 4.2.0
eslint-plugin-tailwindcss: 3.6.1
- eslint-plugin-vuejs-accessibility: 1.2.0_eslint@8.23.1
- nuxt: 3.0.0-rc.11_eslint@8.23.1
+ eslint-plugin-vuejs-accessibility: 1.2.0_eslint@8.24.0
+ nuxt: 3.0.0-rc.11_eslint@8.24.0
standard-version: 9.5.0
packages:
@@ -41,22 +41,22 @@ packages:
'@jridgewell/gen-mapping': 0.1.1
'@jridgewell/trace-mapping': 0.3.15
- /@antfu/eslint-config-basic/0.27.0_cxqatnnjiq7ozd2bkspxnuicdq:
+ /@antfu/eslint-config-basic/0.27.0_2azyxy5wfmd73v3pbt5rvmgcsm:
resolution: {integrity: sha512-QgQVCiNiV9ZF7h09uBqTHctHDfVqJGIIpe0ZHCicLvUv233nAYeu4adAr53buhKrxDeoalozSs2ePiDiCyceTg==}
peerDependencies:
eslint: '>=7.4.0'
dependencies:
- eslint: 8.23.1
- eslint-plugin-antfu: 0.27.0_eslint@8.23.1
- eslint-plugin-eslint-comments: 3.2.0_eslint@8.23.1
+ eslint: 8.24.0
+ eslint-plugin-antfu: 0.27.0_eslint@8.24.0
+ eslint-plugin-eslint-comments: 3.2.0_eslint@8.24.0
eslint-plugin-html: 7.1.0
- eslint-plugin-import: 2.26.0_cxqatnnjiq7ozd2bkspxnuicdq
- eslint-plugin-jsonc: 2.4.0_eslint@8.23.1
- eslint-plugin-markdown: 3.0.0_eslint@8.23.1
- eslint-plugin-n: 15.3.0_eslint@8.23.1
- eslint-plugin-promise: 6.0.1_eslint@8.23.1
- eslint-plugin-unicorn: 43.0.2_eslint@8.23.1
- eslint-plugin-yml: 1.2.0_eslint@8.23.1
+ eslint-plugin-import: 2.26.0_2azyxy5wfmd73v3pbt5rvmgcsm
+ eslint-plugin-jsonc: 2.4.0_eslint@8.24.0
+ eslint-plugin-markdown: 3.0.0_eslint@8.24.0
+ eslint-plugin-n: 15.3.0_eslint@8.24.0
+ eslint-plugin-promise: 6.0.1_eslint@8.24.0
+ eslint-plugin-unicorn: 43.0.2_eslint@8.24.0
+ eslint-plugin-yml: 1.2.0_eslint@8.24.0
jsonc-eslint-parser: 2.1.0
yaml-eslint-parser: 1.1.0
transitivePeerDependencies:
@@ -67,30 +67,30 @@ packages:
- typescript
dev: true
- /@antfu/eslint-config-ts/0.27.0_eslint@8.23.1:
+ /@antfu/eslint-config-ts/0.27.0_eslint@8.24.0:
resolution: {integrity: sha512-h/ai9xe65lXtsUiSBRAvfcN47fqn5uGHcCA5c0LoBRX6fVFHk06BbPWMlSJRtqmc3uBTmv3gU8SrnWwrycnKag==}
peerDependencies:
eslint: '>=7.4.0'
typescript: '>=3.9'
dependencies:
- '@antfu/eslint-config-basic': 0.27.0_cxqatnnjiq7ozd2bkspxnuicdq
- '@typescript-eslint/eslint-plugin': 5.38.0_cxqatnnjiq7ozd2bkspxnuicdq
- '@typescript-eslint/parser': 5.38.0_eslint@8.23.1
- eslint: 8.23.1
+ '@antfu/eslint-config-basic': 0.27.0_2azyxy5wfmd73v3pbt5rvmgcsm
+ '@typescript-eslint/eslint-plugin': 5.38.0_2azyxy5wfmd73v3pbt5rvmgcsm
+ '@typescript-eslint/parser': 5.38.0_eslint@8.24.0
+ eslint: 8.24.0
transitivePeerDependencies:
- eslint-import-resolver-typescript
- eslint-import-resolver-webpack
- supports-color
dev: true
- /@antfu/eslint-config-vue/0.27.0_eslint@8.23.1:
+ /@antfu/eslint-config-vue/0.27.0_eslint@8.24.0:
resolution: {integrity: sha512-Iw4GY4rXK1dPxzIl35bOwPE1vn6E5Wm8uljqdpQYQpTX1j6el7Yo30bpanCogWRcdPSMWKcS7GVlHjV47QB59w==}
peerDependencies:
eslint: '>=7.4.0'
dependencies:
- '@antfu/eslint-config-ts': 0.27.0_eslint@8.23.1
- eslint: 8.23.1
- eslint-plugin-vue: 9.5.1_eslint@8.23.1
+ '@antfu/eslint-config-ts': 0.27.0_eslint@8.24.0
+ eslint: 8.24.0
+ eslint-plugin-vue: 9.5.1_eslint@8.24.0
transitivePeerDependencies:
- eslint-import-resolver-typescript
- eslint-import-resolver-webpack
@@ -98,24 +98,24 @@ packages:
- typescript
dev: true
- /@antfu/eslint-config/0.27.0_eslint@8.23.1:
+ /@antfu/eslint-config/0.27.0_eslint@8.24.0:
resolution: {integrity: sha512-xM1In6/ueNyKxxWO86jd7a9IdKby66lZVT/fE8k2RlP+X0xe5/DTTQfwLbVvnRpn77jCPIhEjNKVWxDO/DUEIg==}
peerDependencies:
eslint: '>=7.4.0'
dependencies:
- '@antfu/eslint-config-vue': 0.27.0_eslint@8.23.1
- '@typescript-eslint/eslint-plugin': 5.38.0_cxqatnnjiq7ozd2bkspxnuicdq
- '@typescript-eslint/parser': 5.38.0_eslint@8.23.1
- eslint: 8.23.1
- eslint-plugin-eslint-comments: 3.2.0_eslint@8.23.1
+ '@antfu/eslint-config-vue': 0.27.0_eslint@8.24.0
+ '@typescript-eslint/eslint-plugin': 5.38.0_2azyxy5wfmd73v3pbt5rvmgcsm
+ '@typescript-eslint/parser': 5.38.0_eslint@8.24.0
+ eslint: 8.24.0
+ eslint-plugin-eslint-comments: 3.2.0_eslint@8.24.0
eslint-plugin-html: 7.1.0
- eslint-plugin-import: 2.26.0_cxqatnnjiq7ozd2bkspxnuicdq
- eslint-plugin-jsonc: 2.4.0_eslint@8.23.1
- eslint-plugin-n: 15.3.0_eslint@8.23.1
- eslint-plugin-promise: 6.0.1_eslint@8.23.1
- eslint-plugin-unicorn: 43.0.2_eslint@8.23.1
- eslint-plugin-vue: 9.5.1_eslint@8.23.1
- eslint-plugin-yml: 1.2.0_eslint@8.23.1
+ eslint-plugin-import: 2.26.0_2azyxy5wfmd73v3pbt5rvmgcsm
+ eslint-plugin-jsonc: 2.4.0_eslint@8.24.0
+ eslint-plugin-n: 15.3.0_eslint@8.24.0
+ eslint-plugin-promise: 6.0.1_eslint@8.24.0
+ eslint-plugin-unicorn: 43.0.2_eslint@8.24.0
+ eslint-plugin-vue: 9.5.1_eslint@8.24.0
+ eslint-plugin-yml: 1.2.0_eslint@8.24.0
jsonc-eslint-parser: 2.1.0
yaml-eslint-parser: 1.1.0
transitivePeerDependencies:
@@ -453,8 +453,8 @@ packages:
- supports-color
dev: true
- /@humanwhocodes/config-array/0.10.4:
- resolution: {integrity: sha512-mXAIHxZT3Vcpg83opl1wGlVZ9xydbfZO3r5YfRSH6Gpp2J/PfdBP0wbDa2sO6/qRbcalpoevVyW6A/fI6LfeMw==}
+ /@humanwhocodes/config-array/0.10.5:
+ resolution: {integrity: sha512-XVVDtp+dVvRxMoxSiSfasYaG02VEe1qH5cKgMQJWhol6HwzbcqoCMJi8dAGoYAO57jhUyhI6cWuRiTcRaDaYug==}
engines: {node: '>=10.10.0'}
dependencies:
'@humanwhocodes/object-schema': 1.2.1
@@ -723,7 +723,7 @@ packages:
resolution: {integrity: sha512-oFjUfn9r9U4vNljd5uU08+6M3mF6OSxZfCrfqJQaN5TtqVTcZmZFzOZ4H866Lq+Eaugv/Vte225kuaZCB3FR/g==}
dev: true
- /@nuxt/vite-builder/3.0.0-rc.11_eslint@8.23.1+vue@3.2.39:
+ /@nuxt/vite-builder/3.0.0-rc.11_eslint@8.24.0+vue@3.2.39:
resolution: {integrity: sha512-WkQ+/cfdIf5XVZea8xD+ciLXpmQkNu8d5p16WJSp10hEhj3Vt/cQ8OkXDVHGGRML+NsDL0bQXDeg3PcM/bw94w==}
engines: {node: ^14.16.0 || ^16.11.0 || ^17.0.0 || ^18.0.0}
peerDependencies:
@@ -760,7 +760,7 @@ packages:
unplugin: 0.9.5_yrghuvd3zkjqr2aqvquijs2oqu
vite: 3.1.3
vite-node: 0.23.4
- vite-plugin-checker: 0.5.1_eslint@8.23.1+vite@3.1.3
+ vite-plugin-checker: 0.5.1_eslint@8.24.0+vite@3.1.3
vue: 3.2.39
vue-bundle-renderer: 0.4.3
transitivePeerDependencies:
@@ -969,7 +969,7 @@ packages:
resolution: {integrity: sha512-w7hEHXnPMEZ+4nGKl/KDRVpxkwYxYExuHOYXyzIzCDzEZ9ZCGMAewulr9IqJu2LR4N37fcnb1XVeuZ09qgOxhA==}
dev: false
- /@typescript-eslint/eslint-plugin/5.38.0_cxqatnnjiq7ozd2bkspxnuicdq:
+ /@typescript-eslint/eslint-plugin/5.38.0_2azyxy5wfmd73v3pbt5rvmgcsm:
resolution: {integrity: sha512-GgHi/GNuUbTOeoJiEANi0oI6fF3gBQc3bGFYj40nnAPCbhrtEDf2rjBmefFadweBmO1Du1YovHeDP2h5JLhtTQ==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies:
@@ -980,12 +980,12 @@ packages:
typescript:
optional: true
dependencies:
- '@typescript-eslint/parser': 5.38.0_eslint@8.23.1
+ '@typescript-eslint/parser': 5.38.0_eslint@8.24.0
'@typescript-eslint/scope-manager': 5.38.0
- '@typescript-eslint/type-utils': 5.38.0_eslint@8.23.1
- '@typescript-eslint/utils': 5.38.0_eslint@8.23.1
+ '@typescript-eslint/type-utils': 5.38.0_eslint@8.24.0
+ '@typescript-eslint/utils': 5.38.0_eslint@8.24.0
debug: 4.3.4
- eslint: 8.23.1
+ eslint: 8.24.0
ignore: 5.2.0
regexpp: 3.2.0
semver: 7.3.7
@@ -994,7 +994,7 @@ packages:
- supports-color
dev: true
- /@typescript-eslint/parser/5.38.0_eslint@8.23.1:
+ /@typescript-eslint/parser/5.38.0_eslint@8.24.0:
resolution: {integrity: sha512-/F63giJGLDr0ms1Cr8utDAxP2SPiglaD6V+pCOcG35P2jCqdfR7uuEhz1GIC3oy4hkUF8xA1XSXmd9hOh/a5EA==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies:
@@ -1008,7 +1008,7 @@ packages:
'@typescript-eslint/types': 5.38.0
'@typescript-eslint/typescript-estree': 5.38.0
debug: 4.3.4
- eslint: 8.23.1
+ eslint: 8.24.0
transitivePeerDependencies:
- supports-color
dev: true
@@ -1021,7 +1021,7 @@ packages:
'@typescript-eslint/visitor-keys': 5.38.0
dev: true
- /@typescript-eslint/type-utils/5.38.0_eslint@8.23.1:
+ /@typescript-eslint/type-utils/5.38.0_eslint@8.24.0:
resolution: {integrity: sha512-iZq5USgybUcj/lfnbuelJ0j3K9dbs1I3RICAJY9NZZpDgBYXmuUlYQGzftpQA9wC8cKgtS6DASTvF3HrXwwozA==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies:
@@ -1032,9 +1032,9 @@ packages:
optional: true
dependencies:
'@typescript-eslint/typescript-estree': 5.38.0
- '@typescript-eslint/utils': 5.38.0_eslint@8.23.1
+ '@typescript-eslint/utils': 5.38.0_eslint@8.24.0
debug: 4.3.4
- eslint: 8.23.1
+ eslint: 8.24.0
tsutils: 3.21.0
transitivePeerDependencies:
- supports-color
@@ -1065,7 +1065,7 @@ packages:
- supports-color
dev: true
- /@typescript-eslint/utils/5.38.0_eslint@8.23.1:
+ /@typescript-eslint/utils/5.38.0_eslint@8.24.0:
resolution: {integrity: sha512-6sdeYaBgk9Fh7N2unEXGz+D+som2QCQGPAf1SxrkEr+Z32gMreQ0rparXTNGRRfYUWk/JzbGdcM8NSSd6oqnTA==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies:
@@ -1075,9 +1075,9 @@ packages:
'@typescript-eslint/scope-manager': 5.38.0
'@typescript-eslint/types': 5.38.0
'@typescript-eslint/typescript-estree': 5.38.0
- eslint: 8.23.1
+ eslint: 8.24.0
eslint-scope: 5.1.1
- eslint-utils: 3.0.0_eslint@8.23.1
+ eslint-utils: 3.0.0_eslint@8.24.0
transitivePeerDependencies:
- supports-color
- typescript
@@ -1882,7 +1882,7 @@ packages:
dev: true
/concat-map/0.0.1:
- resolution: {integrity: sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=}
+ resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
dev: true
/concat-stream/2.0.0:
@@ -2476,7 +2476,7 @@ packages:
dev: true
/ee-first/1.1.1:
- resolution: {integrity: sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0=}
+ resolution: {integrity: sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==}
dev: true
/electron-to-chromium/1.4.256:
@@ -3041,13 +3041,13 @@ packages:
resolution: {integrity: sha512-/veY75JbMK4j1yjvuUxuVsiS/hr/4iHs9FTT6cgTexxdE0Ly/glccBAkloH/DofkjRbZU3bnoj38mOmhkZ0lHw==}
engines: {node: '>=12'}
- /eslint-config-prettier/8.5.0_eslint@8.23.1:
+ /eslint-config-prettier/8.5.0_eslint@8.24.0:
resolution: {integrity: sha512-obmWKLUNCnhtQRKc+tmnYuQl0pFU1ibYJQ5BGhTVB08bHe9wC8qUeG7c08dj9XX+AuPj1YSGSQIHl1pnDHZR0Q==}
hasBin: true
peerDependencies:
eslint: '>=7.0.0'
dependencies:
- eslint: 8.23.1
+ eslint: 8.24.0
dev: true
/eslint-import-resolver-node/0.3.6:
@@ -3059,7 +3059,7 @@ packages:
- supports-color
dev: true
- /eslint-module-utils/2.7.4_p4kveujfv4nmzmj4mix5hvnxlm:
+ /eslint-module-utils/2.7.4_p4qznrk3s64lneh234w7tfu7j4:
resolution: {integrity: sha512-j4GT+rqzCoRKHwURX7pddtIPGySnX9Si/cgMI5ztrcqOPtk5dDEeZ34CQVPphnqkJytlc97Vuk05Um2mJ3gEQA==}
engines: {node: '>=4'}
peerDependencies:
@@ -3080,43 +3080,43 @@ packages:
eslint-import-resolver-webpack:
optional: true
dependencies:
- '@typescript-eslint/parser': 5.38.0_eslint@8.23.1
+ '@typescript-eslint/parser': 5.38.0_eslint@8.24.0
debug: 3.2.7
- eslint: 8.23.1
+ eslint: 8.24.0
eslint-import-resolver-node: 0.3.6
transitivePeerDependencies:
- supports-color
dev: true
- /eslint-plugin-antfu/0.27.0_eslint@8.23.1:
+ /eslint-plugin-antfu/0.27.0_eslint@8.24.0:
resolution: {integrity: sha512-xjNfATHonE3Do2igOlhwjfL2tlaGnm1EgbsLLkHgdk30oIvJU4bLNxF6wXIuaCdjqmwWIqF6smJbX2YhtaEC4w==}
dependencies:
- '@typescript-eslint/utils': 5.38.0_eslint@8.23.1
+ '@typescript-eslint/utils': 5.38.0_eslint@8.24.0
transitivePeerDependencies:
- eslint
- supports-color
- typescript
dev: true
- /eslint-plugin-es/4.1.0_eslint@8.23.1:
+ /eslint-plugin-es/4.1.0_eslint@8.24.0:
resolution: {integrity: sha512-GILhQTnjYE2WorX5Jyi5i4dz5ALWxBIdQECVQavL6s7cI76IZTDWleTHkxz/QT3kvcs2QlGHvKLYsSlPOlPXnQ==}
engines: {node: '>=8.10.0'}
peerDependencies:
eslint: '>=4.19.1'
dependencies:
- eslint: 8.23.1
+ eslint: 8.24.0
eslint-utils: 2.1.0
regexpp: 3.2.0
dev: true
- /eslint-plugin-eslint-comments/3.2.0_eslint@8.23.1:
+ /eslint-plugin-eslint-comments/3.2.0_eslint@8.24.0:
resolution: {integrity: sha512-0jkOl0hfojIHHmEHgmNdqv4fmh7300NdpA9FFpF7zaoLvB/QeXOGNLIo86oAveJFrfB1p05kC8hpEMHM8DwWVQ==}
engines: {node: '>=6.5.0'}
peerDependencies:
eslint: '>=4.19.1'
dependencies:
escape-string-regexp: 1.0.5
- eslint: 8.23.1
+ eslint: 8.24.0
ignore: 5.2.0
dev: true
@@ -3126,7 +3126,7 @@ packages:
htmlparser2: 8.0.1
dev: true
- /eslint-plugin-import/2.26.0_cxqatnnjiq7ozd2bkspxnuicdq:
+ /eslint-plugin-import/2.26.0_2azyxy5wfmd73v3pbt5rvmgcsm:
resolution: {integrity: sha512-hYfi3FXaM8WPLf4S1cikh/r4IxnO6zrhZbEGz2b660EJRbuxgpDS5gkCuYgGWg2xxh2rBuIr4Pvhve/7c31koA==}
engines: {node: '>=4'}
peerDependencies:
@@ -3136,14 +3136,14 @@ packages:
'@typescript-eslint/parser':
optional: true
dependencies:
- '@typescript-eslint/parser': 5.38.0_eslint@8.23.1
+ '@typescript-eslint/parser': 5.38.0_eslint@8.24.0
array-includes: 3.1.5
array.prototype.flat: 1.3.0
debug: 2.6.9
doctrine: 2.1.0
- eslint: 8.23.1
+ eslint: 8.24.0
eslint-import-resolver-node: 0.3.6
- eslint-module-utils: 2.7.4_p4kveujfv4nmzmj4mix5hvnxlm
+ eslint-module-utils: 2.7.4_p4qznrk3s64lneh234w7tfu7j4
has: 1.0.3
is-core-module: 2.10.0
is-glob: 4.0.3
@@ -3157,40 +3157,40 @@ packages:
- supports-color
dev: true
- /eslint-plugin-jsonc/2.4.0_eslint@8.23.1:
+ /eslint-plugin-jsonc/2.4.0_eslint@8.24.0:
resolution: {integrity: sha512-YXy5PjyUL9gFYal6pYijd8P6EmpeWskv7PVhB9Py/AwKPn+hwnQHcIzQILiLfxztfhtWiRIUSzoLe/JThZgSUw==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies:
eslint: '>=6.0.0'
dependencies:
- eslint: 8.23.1
- eslint-utils: 3.0.0_eslint@8.23.1
+ eslint: 8.24.0
+ eslint-utils: 3.0.0_eslint@8.24.0
jsonc-eslint-parser: 2.1.0
natural-compare: 1.4.0
dev: true
- /eslint-plugin-markdown/3.0.0_eslint@8.23.1:
+ /eslint-plugin-markdown/3.0.0_eslint@8.24.0:
resolution: {integrity: sha512-hRs5RUJGbeHDLfS7ELanT0e29Ocyssf/7kBM+p7KluY5AwngGkDf8Oyu4658/NZSGTTq05FZeWbkxXtbVyHPwg==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies:
eslint: ^6.0.0 || ^7.0.0 || ^8.0.0
dependencies:
- eslint: 8.23.1
+ eslint: 8.24.0
mdast-util-from-markdown: 0.8.5
transitivePeerDependencies:
- supports-color
dev: true
- /eslint-plugin-n/15.3.0_eslint@8.23.1:
+ /eslint-plugin-n/15.3.0_eslint@8.24.0:
resolution: {integrity: sha512-IyzPnEWHypCWasDpxeJnim60jhlumbmq0pubL6IOcnk8u2y53s5QfT8JnXy7skjHJ44yWHRb11PLtDHuu1kg/Q==}
engines: {node: '>=12.22.0'}
peerDependencies:
eslint: '>=7.0.0'
dependencies:
builtins: 5.0.1
- eslint: 8.23.1
- eslint-plugin-es: 4.1.0_eslint@8.23.1
- eslint-utils: 3.0.0_eslint@8.23.1
+ eslint: 8.24.0
+ eslint-plugin-es: 4.1.0_eslint@8.24.0
+ eslint-utils: 3.0.0_eslint@8.24.0
ignore: 5.2.0
is-core-module: 2.10.0
minimatch: 3.1.2
@@ -3208,13 +3208,13 @@ packages:
prettier-linter-helpers: 1.0.0
dev: true
- /eslint-plugin-promise/6.0.1_eslint@8.23.1:
+ /eslint-plugin-promise/6.0.1_eslint@8.24.0:
resolution: {integrity: sha512-uM4Tgo5u3UWQiroOyDEsYcVMOo7re3zmno0IZmB5auxoaQNIceAbXEkSt8RNrKtaYehARHG06pYK6K1JhtP0Zw==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies:
eslint: ^7.0.0 || ^8.0.0
dependencies:
- eslint: 8.23.1
+ eslint: 8.24.0
dev: true
/eslint-plugin-tailwindcss/3.6.1:
@@ -3228,7 +3228,7 @@ packages:
- ts-node
dev: true
- /eslint-plugin-unicorn/43.0.2_eslint@8.23.1:
+ /eslint-plugin-unicorn/43.0.2_eslint@8.24.0:
resolution: {integrity: sha512-DtqZ5mf/GMlfWoz1abIjq5jZfaFuHzGBZYIeuJfEoKKGWRHr2JiJR+ea+BF7Wx2N1PPRoT/2fwgiK1NnmNE3Hg==}
engines: {node: '>=14.18'}
peerDependencies:
@@ -3237,8 +3237,8 @@ packages:
'@babel/helper-validator-identifier': 7.19.1
ci-info: 3.4.0
clean-regexp: 1.0.0
- eslint: 8.23.1
- eslint-utils: 3.0.0_eslint@8.23.1
+ eslint: 8.24.0
+ eslint-utils: 3.0.0_eslint@8.24.0
esquery: 1.4.0
indent-string: 4.0.0
is-builtin-module: 3.2.0
@@ -3251,45 +3251,45 @@ packages:
strip-indent: 3.0.0
dev: true
- /eslint-plugin-vue/9.5.1_eslint@8.23.1:
+ /eslint-plugin-vue/9.5.1_eslint@8.24.0:
resolution: {integrity: sha512-Y0sL2RY7Xc9S8kNih9lbwHIDmewUg9bfas6WSzsOWRgDXhIHKxRBZYNAnVcXBFfE+bMWHUA5GLChl7TcTYUI8w==}
engines: {node: ^14.17.0 || >=16.0.0}
peerDependencies:
eslint: ^6.2.0 || ^7.0.0 || ^8.0.0
dependencies:
- eslint: 8.23.1
- eslint-utils: 3.0.0_eslint@8.23.1
+ eslint: 8.24.0
+ eslint-utils: 3.0.0_eslint@8.24.0
natural-compare: 1.4.0
nth-check: 2.1.1
postcss-selector-parser: 6.0.10
semver: 7.3.7
- vue-eslint-parser: 9.1.0_eslint@8.23.1
+ vue-eslint-parser: 9.1.0_eslint@8.24.0
xml-name-validator: 4.0.0
transitivePeerDependencies:
- supports-color
dev: true
- /eslint-plugin-vuejs-accessibility/1.2.0_eslint@8.23.1:
+ /eslint-plugin-vuejs-accessibility/1.2.0_eslint@8.24.0:
resolution: {integrity: sha512-wF7kT22lS2VOmIpDeI65bnFFKFgESEEpI+CWKr43mdfDRywA4sCk7cKhtZsvfbPOtKO0GDlnpFxZbOIGsFn7IQ==}
peerDependencies:
eslint: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
dependencies:
aria-query: 5.0.2
emoji-regex: 10.1.0
- eslint: 8.23.1
- vue-eslint-parser: 9.1.0_eslint@8.23.1
+ eslint: 8.24.0
+ vue-eslint-parser: 9.1.0_eslint@8.24.0
transitivePeerDependencies:
- supports-color
dev: true
- /eslint-plugin-yml/1.2.0_eslint@8.23.1:
+ /eslint-plugin-yml/1.2.0_eslint@8.24.0:
resolution: {integrity: sha512-v0jAU/F5SJg28zkpxwGpY04eGZMWFP6os8u2qaEAIRjSH2GqrNl0yBR5+sMHLU/026kAduxVbvLSqmT3Mu3O0g==}
engines: {node: ^14.17.0 || >=16.0.0}
peerDependencies:
eslint: '>=6.0.0'
dependencies:
debug: 4.3.4
- eslint: 8.23.1
+ eslint: 8.24.0
lodash: 4.17.21
natural-compare: 1.4.0
yaml-eslint-parser: 1.1.0
@@ -3320,13 +3320,13 @@ packages:
eslint-visitor-keys: 1.3.0
dev: true
- /eslint-utils/3.0.0_eslint@8.23.1:
+ /eslint-utils/3.0.0_eslint@8.24.0:
resolution: {integrity: sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA==}
engines: {node: ^10.0.0 || ^12.0.0 || >= 14.0.0}
peerDependencies:
eslint: '>=5'
dependencies:
- eslint: 8.23.1
+ eslint: 8.24.0
eslint-visitor-keys: 2.1.0
dev: true
@@ -3345,13 +3345,13 @@ packages:
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
dev: true
- /eslint/8.23.1:
- resolution: {integrity: sha512-w7C1IXCc6fNqjpuYd0yPlcTKKmHlHHktRkzmBPZ+7cvNBQuiNjx0xaMTjAJGCafJhQkrFJooREv0CtrVzmHwqg==}
+ /eslint/8.24.0:
+ resolution: {integrity: sha512-dWFaPhGhTAiPcCgm3f6LI2MBWbogMnTJzFBbhXVRQDJPkr9pGZvVjlVfXd+vyDcWPA2Ic9L2AXPIQM0+vk/cSQ==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
hasBin: true
dependencies:
'@eslint/eslintrc': 1.3.2
- '@humanwhocodes/config-array': 0.10.4
+ '@humanwhocodes/config-array': 0.10.5
'@humanwhocodes/gitignore-to-minimatch': 1.0.2
'@humanwhocodes/module-importer': 1.0.1
ajv: 6.12.6
@@ -3361,7 +3361,7 @@ packages:
doctrine: 3.0.0
escape-string-regexp: 4.0.0
eslint-scope: 7.1.1
- eslint-utils: 3.0.0_eslint@8.23.1
+ eslint-utils: 3.0.0_eslint@8.24.0
eslint-visitor-keys: 3.3.0
espree: 9.4.0
esquery: 1.4.0
@@ -5081,7 +5081,7 @@ packages:
fsevents: 2.3.2
dev: true
- /nuxt/3.0.0-rc.11_eslint@8.23.1:
+ /nuxt/3.0.0-rc.11_eslint@8.24.0:
resolution: {integrity: sha512-I0wyxPHnUoJBWoROKUx91PLKaAFZ/TsxSpcm3/jn/Ysq2RGU5Q3o9AzqT0YcXW4rgH35QPFvGpqopU9X0vS7Qw==}
engines: {node: ^14.16.0 || ^16.11.0 || ^17.0.0 || ^18.0.0}
hasBin: true
@@ -5091,7 +5091,7 @@ packages:
'@nuxt/schema': 3.0.0-rc.11
'@nuxt/telemetry': 2.1.5
'@nuxt/ui-templates': 0.4.0
- '@nuxt/vite-builder': 3.0.0-rc.11_eslint@8.23.1+vue@3.2.39
+ '@nuxt/vite-builder': 3.0.0-rc.11_eslint@8.24.0+vue@3.2.39
'@vue/reactivity': 3.2.39
'@vue/shared': 3.2.39
'@vueuse/head': 0.7.12_vue@3.2.39
@@ -7092,7 +7092,7 @@ packages:
- terser
dev: true
- /vite-plugin-checker/0.5.1_eslint@8.23.1+vite@3.1.3:
+ /vite-plugin-checker/0.5.1_eslint@8.24.0+vite@3.1.3:
resolution: {integrity: sha512-NFiO1PyK9yGuaeSnJ7Whw9fnxLc1AlELnZoyFURnauBYhbIkx9n+PmIXxSFUuC9iFyACtbJQUAEuQi6yHs2Adg==}
engines: {node: '>=14.16'}
peerDependencies:
@@ -7116,7 +7116,7 @@ packages:
chalk: 4.1.2
chokidar: 3.5.3
commander: 8.3.0
- eslint: 8.23.1
+ eslint: 8.24.0
fast-glob: 3.2.12
lodash.debounce: 4.0.8
lodash.pick: 4.4.0
@@ -7235,14 +7235,14 @@ packages:
resolution: {integrity: sha512-RutnB7X8c5hjq39NceArgXg28WZtZpGc3+J16ljMiYnFhKvd8hITxSWQSQ5bvldxMDU6gG5mkxl1MTQLXckVSQ==}
dev: true
- /vue-eslint-parser/9.1.0_eslint@8.23.1:
+ /vue-eslint-parser/9.1.0_eslint@8.24.0:
resolution: {integrity: sha512-NGn/iQy8/Wb7RrRa4aRkokyCZfOUWk19OP5HP6JEozQFX5AoS/t+Z0ZN7FY4LlmWc4FNI922V7cvX28zctN8dQ==}
engines: {node: ^14.17.0 || >=16.0.0}
peerDependencies:
eslint: '>=6.0.0'
dependencies:
debug: 4.3.4
- eslint: 8.23.1
+ eslint: 8.24.0
eslint-scope: 7.1.1
eslint-visitor-keys: 3.3.0
espree: 9.4.0
From c02578b45b9ed3bfab86b08085d896337870751e Mon Sep 17 00:00:00 2001
From: Driss Chelouati
Date: Tue, 27 Sep 2022 14:07:39 +0100
Subject: [PATCH 03/16] feat: add tailwind module to playground, fix layout
colors and styles
---
.eslintrc | 8 +-
package.json | 1 +
playground/assets/css/main.css | 3 +
playground/components/Hero.vue | 44 +-
playground/components/Navigation.vue | 75 ++-
playground/components/toast/ActionButtons.vue | 6 +-
.../components/toast/IconSoloDanger.vue | 11 +-
playground/components/toast/IconSuccess.vue | 8 +-
playground/components/toast/LabelInfo.vue | 8 +-
playground/components/toast/LabelSuccess.vue | 6 +-
.../components/toast/UserReplyClose.vue | 11 +-
playground/nuxt.config.ts | 15 +-
playground/tailwind.config.ts | 111 ++++
pnpm-lock.yaml | 562 ++++++++++++++++++
14 files changed, 805 insertions(+), 64 deletions(-)
create mode 100644 playground/assets/css/main.css
create mode 100644 playground/tailwind.config.ts
diff --git a/.eslintrc b/.eslintrc
index 0facac4..3504587 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -13,13 +13,11 @@
"rules": {
"no-console": "off",
"no-debugger": "off",
+ "prefer-arrow-callback": "off",
"vue/script-setup-uses-vars": "error",
"vue/multi-word-component-names": "off",
"vue/define-macros-order": "off",
- "tailwindcss/no-custom-classname": [
- "error",
- { "whitelist": ["^ninja-(.*)$"] }
- ],
+ "tailwindcss/no-custom-classname": "off",
"tailwindcss/classnames-order": "off",
"prettier-vue/prettier": [
"error",
@@ -27,7 +25,7 @@
"printWidth": 80,
"singleQuote": true,
"semi": false,
- "trailingComma": "none"
+ // "trailingComma": "none"
}
]
}
diff --git a/package.json b/package.json
index 5eb4e9c..5744edc 100644
--- a/package.json
+++ b/package.json
@@ -32,6 +32,7 @@
"@antfu/eslint-config": "^0.27.0",
"@nuxt/module-builder": "latest",
"@nuxt/schema": "^3.0.0-rc.11",
+ "@nuxtjs/tailwindcss": "^5.3.3",
"eslint": "8.24.0",
"eslint-config-prettier": "8.5.0",
"eslint-plugin-prettier-vue": "4.2.0",
diff --git a/playground/assets/css/main.css b/playground/assets/css/main.css
new file mode 100644
index 0000000..bd6213e
--- /dev/null
+++ b/playground/assets/css/main.css
@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
\ No newline at end of file
diff --git a/playground/components/Hero.vue b/playground/components/Hero.vue
index ff95453..52e2d5a 100644
--- a/playground/components/Hero.vue
+++ b/playground/components/Hero.vue
@@ -1,28 +1,40 @@
-
+
-
+
-
+
-
+
-
+
-
+
@@ -35,26 +47,32 @@
>Nuxt 3 Ready
-
+
🔔 A simple toaster (notifier) handler
for Nuxt.js
-
+
-
+
Copy
diff --git a/playground/components/Navigation.vue b/playground/components/Navigation.vue
index 6154c7a..0df3174 100644
--- a/playground/components/Navigation.vue
+++ b/playground/components/Navigation.vue
@@ -14,23 +14,66 @@ const isChecked = ref(false)
-
-
+
+
-
-
-
Examples
-
API docs
+
+
+ Examples
+ API docs
-
+
-
+
toggleDark()" />
Dismiss
Accept
diff --git a/playground/components/toast/IconSoloDanger.vue b/playground/components/toast/IconSoloDanger.vue
index 20690f2..d35fcc8 100644
--- a/playground/components/toast/IconSoloDanger.vue
+++ b/playground/components/toast/IconSoloDanger.vue
@@ -1,6 +1,6 @@
- Fire alert
- Get out of here fast!
+ Fire alert
+ Get out of here fast!
-
Your changes were saved!
+
Your changes were saved!
\ No newline at end of file
diff --git a/playground/components/toast/LabelInfo.vue b/playground/components/toast/LabelInfo.vue
index dc8ebaf..b4d21d6 100644
--- a/playground/components/toast/LabelInfo.vue
+++ b/playground/components/toast/LabelInfo.vue
@@ -1,9 +1,9 @@
- Your changes were saved!
+ Your changes were saved!
\ No newline at end of file
diff --git a/playground/components/toast/LabelSuccess.vue b/playground/components/toast/LabelSuccess.vue
index 7737f5c..dbe516d 100644
--- a/playground/components/toast/LabelSuccess.vue
+++ b/playground/components/toast/LabelSuccess.vue
@@ -3,7 +3,7 @@
class="w-full flex items-center rounded-xl bg-white dark:bg-stone-800 shadow-xl shadow-stone-300/10 dark:shadow-stone-800/10 overflow-hidden"
>
- Nuxt has been installed!
+ Nuxt has been installed!
\ No newline at end of file
diff --git a/playground/components/toast/UserReplyClose.vue b/playground/components/toast/UserReplyClose.vue
index ea83536..82082c1 100644
--- a/playground/components/toast/UserReplyClose.vue
+++ b/playground/components/toast/UserReplyClose.vue
@@ -1,6 +1,6 @@
- Clark E.
- Replied to your post
+ Clark E.
+ Replied to your post
=16}
+ peerDependencies:
+ postcss: ^8.2
+ postcss-selector-parser: ^6.0.10
+ dependencies:
+ postcss: 8.4.16
+ postcss-selector-parser: 6.0.10
+ dev: true
+
/@esbuild/android-arm/0.15.8:
resolution: {integrity: sha512-CyEWALmn+no/lbgbAJsbuuhT8s2J19EJGHkeyAwjbFJMrj80KJ9zuYsoAvidPTU7BgBf87r/sgae8Tw0dbOc4Q==}
engines: {node: '>=12'}
@@ -525,6 +538,19 @@ packages:
'@jridgewell/resolve-uri': 3.1.0
'@jridgewell/sourcemap-codec': 1.4.14
+ /@koa/router/9.4.0:
+ resolution: {integrity: sha512-dOOXgzqaDoHu5qqMEPLKEgLz5CeIA7q8+1W62mCvFVCOqeC71UoTGJ4u1xUSOpIl2J1x2pqrNULkFteUeZW3/A==}
+ engines: {node: '>= 8.0.0'}
+ dependencies:
+ debug: 4.3.4
+ http-errors: 1.8.1
+ koa-compose: 4.1.0
+ methods: 1.1.2
+ path-to-regexp: 6.2.1
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
/@mapbox/node-pre-gyp/1.0.10:
resolution: {integrity: sha512-4ySo4CjzStuprMwk35H5pPbkymjv1SF3jGLj6rAHp/xT/RF7TL7bd9CTm1xDY49K2qF7jmR/g7k+SkLETP6opA==}
hasBin: true
@@ -644,6 +670,21 @@ packages:
- supports-color
dev: true
+ /@nuxt/postcss8/1.1.3:
+ resolution: {integrity: sha512-CdHtErhvQwueNZPBOmlAAKrNCK7aIpZDYhtS7TzXlSgPHHox1g3cSlf+Ke9oB/8t4mNNjdB+prclme2ibuCOEA==}
+ dependencies:
+ autoprefixer: 10.4.11_postcss@8.4.16
+ css-loader: 5.2.7
+ defu: 3.2.2
+ postcss: 8.4.16
+ postcss-import: 13.0.0_postcss@8.4.16
+ postcss-loader: 4.3.0_postcss@8.4.16
+ postcss-url: 10.1.3_postcss@8.4.16
+ semver: 7.3.7
+ transitivePeerDependencies:
+ - webpack
+ dev: true
+
/@nuxt/schema/3.0.0-rc.11:
resolution: {integrity: sha512-EIBYQeBxJ+JZ8RjPRGaXM9+vtWMHQ4HsqZIw5a+p6hqRLGf53fHANT4vjMQZA4fAYBnJZJI7dB/OXkfyb/kikA==}
engines: {node: ^14.16.0 || ^16.11.0 || ^17.0.0 || ^18.0.0}
@@ -776,6 +817,31 @@ packages:
- webpack
dev: true
+ /@nuxtjs/tailwindcss/5.3.3:
+ resolution: {integrity: sha512-1YyDcOJuZue3PtTX7c58FEIieAy0utpRa6s9nJ4BVE/UloRG2mDw4ch7s9O4afdsHiib5e7uxNfY1ZZGKupqaw==}
+ dependencies:
+ '@nuxt/kit': 3.0.0-rc.11
+ '@nuxt/postcss8': 1.1.3
+ autoprefixer: 10.4.11_postcss@8.4.16
+ chalk: 5.0.1
+ clear-module: 4.1.2
+ consola: 2.15.3
+ defu: 6.1.0
+ postcss: 8.4.16
+ postcss-custom-properties: 12.1.9_postcss@8.4.16
+ postcss-nesting: 10.2.0_postcss@8.4.16
+ tailwind-config-viewer: 1.7.2_tailwindcss@3.1.8
+ tailwindcss: 3.1.8
+ ufo: 0.8.5
+ transitivePeerDependencies:
+ - esbuild
+ - rollup
+ - supports-color
+ - ts-node
+ - vite
+ - webpack
+ dev: true
+
/@rollup/plugin-alias/3.1.9_rollup@2.79.0:
resolution: {integrity: sha512-QI5fsEvm9bDzt32k39wpOwZhVzRcL5ydcffUHMyLVaVaLeC70I8TJZ17F1z1eMoLu4E/UOcH9BWVkKpIKdrfiw==}
engines: {node: '>=8.0.0'}
@@ -955,6 +1021,10 @@ packages:
resolution: {integrity: sha512-Gj7cI7z+98M282Tqmp2K5EIsoouUEzbBJhQQzDE3jSIRk6r9gsz0oUokqIUR4u1R3dMHo0pDHM7sNOHyhulypw==}
dev: true
+ /@types/parse-json/4.0.0:
+ resolution: {integrity: sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==}
+ dev: true
+
/@types/resolve/1.17.1:
resolution: {integrity: sha512-yy7HuzQhj0dhGpD8RLXSZWEkLsV9ibvxvi6EiJ3bkqLAO1RGo0WbkWQiwpRlSFymTJRz0d3k5LM3kkx8ArDbLw==}
dependencies:
@@ -1320,6 +1390,14 @@ packages:
resolution: {integrity: sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==}
dev: true
+ /accepts/1.3.8:
+ resolution: {integrity: sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==}
+ engines: {node: '>= 0.6'}
+ dependencies:
+ mime-types: 2.1.35
+ negotiator: 0.6.3
+ dev: true
+
/acorn-jsx/5.3.2_acorn@8.8.0:
resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==}
peerDependencies:
@@ -1365,6 +1443,14 @@ packages:
- supports-color
dev: true
+ /ajv-keywords/3.5.2_ajv@6.12.6:
+ resolution: {integrity: sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==}
+ peerDependencies:
+ ajv: ^6.9.1
+ dependencies:
+ ajv: 6.12.6
+ dev: true
+
/ajv/6.12.6:
resolution: {integrity: sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==}
dependencies:
@@ -1520,10 +1606,21 @@ packages:
resolution: {integrity: sha512-tLRNUXati5MFePdAk8dw7Qt7DpxPB60ofAgn8WRhW6a2rcimZnYBP9oxHiv0OHy+Wz7kPMG+t4LGdt31+4EmGg==}
dev: true
+ /async/2.6.4:
+ resolution: {integrity: sha512-mzo5dfJYwAn29PeiJ0zvwTo04zj8HDJj0Mn8TD7sno7q12prdbnasKJHhkm2c1LgrhlJ0teaea8860oxi51mGA==}
+ dependencies:
+ lodash: 4.17.21
+ dev: true
+
/async/3.2.4:
resolution: {integrity: sha512-iAB+JbDEGXhyIUavoDl9WP/Jj106Kz9DEn1DPgYw5ruDn0e3Wgi3sKFm55sASdGBNOQB8F59d9qQ7deqrHA8wQ==}
dev: true
+ /at-least-node/1.0.0:
+ resolution: {integrity: sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg==}
+ engines: {node: '>= 4.0.0'}
+ dev: true
+
/autoprefixer/10.4.11_postcss@8.4.16:
resolution: {integrity: sha512-5lHp6DgRodxlBLSkzHOTcufWFflH1ewfy2hvFQyjrblBFlP/0Yh4O/Wrg4ow8WRlN3AAUFFLAQwX8hTptzqVHg==}
engines: {node: ^10 || ^12 || >=14}
@@ -1548,6 +1645,10 @@ packages:
resolution: {integrity: sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==}
dev: true
+ /big.js/5.2.2:
+ resolution: {integrity: sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==}
+ dev: true
+
/binary-extensions/2.2.0:
resolution: {integrity: sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==}
engines: {node: '>=8'}
@@ -1652,6 +1753,14 @@ packages:
pkg-types: 0.3.5
rc9: 1.2.2
+ /cache-content-type/1.0.1:
+ resolution: {integrity: sha512-IKufZ1o4Ut42YUrZSo8+qnMTrFuKkvyoLXUywKz9GJ5BrhOFGhLdkx9sG4KAnVvbY6kEcSFjLQul+DVmBm2bgA==}
+ engines: {node: '>= 6.0.0'}
+ dependencies:
+ mime-types: 2.1.35
+ ylru: 1.3.2
+ dev: true
+
/call-bind/1.0.2:
resolution: {integrity: sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA==}
dependencies:
@@ -1770,6 +1879,14 @@ packages:
escape-string-regexp: 1.0.5
dev: true
+ /clear-module/4.1.2:
+ resolution: {integrity: sha512-LWAxzHqdHsAZlPlEyJ2Poz6AIs384mPeqLVCru2p0BrP9G/kVGuhNyZYClLO6cXlnuJjzC8xtsJIuMjKqLXoAw==}
+ engines: {node: '>=8'}
+ dependencies:
+ parent-module: 2.0.0
+ resolve-from: 5.0.0
+ dev: true
+
/cli-cursor/4.0.0:
resolution: {integrity: sha512-VGtlMu3x/4DOtIUwEkRezxUZ2lBacNJCHash0N0WeZDBS+7Ux1dm3XWAgWYxLJFMMdOeXMHXorshEFhbMSGelg==}
engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
@@ -1814,6 +1931,11 @@ packages:
engines: {node: '>=0.10.0'}
dev: true
+ /co/4.6.0:
+ resolution: {integrity: sha512-QVb0dM5HvG+uaxitm8wONl7jltx8dqhfU33DcqtOZcLSVIKSDDLDi7+0LbAKiyI8hD9u42m2YxXSkMGWThaecQ==}
+ engines: {iojs: '>= 1.0.0', node: '>= 0.12.0'}
+ dev: true
+
/color-convert/1.9.3:
resolution: {integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==}
dependencies:
@@ -1850,6 +1972,11 @@ packages:
resolution: {integrity: sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==}
dev: true
+ /commander/6.2.1:
+ resolution: {integrity: sha512-U7VdrJFnJgo4xjrHpTzu0yrHPGImdsmD95ZlgYSEajAn2JKzDhDTPG9kBTefmObL2w/ngeZnilk+OV9CG3d7UA==}
+ engines: {node: '>= 6'}
+ dev: true
+
/commander/7.2.0:
resolution: {integrity: sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==}
engines: {node: '>= 10'}
@@ -1902,6 +2029,18 @@ packages:
resolution: {integrity: sha512-ty/fTekppD2fIwRvnZAVdeOiGd1c7YXEixbgJTNzqcxJWKQnjJ/V1bNEEE6hygpM3WjwHFUVK6HTjWSzV4a8sQ==}
dev: true
+ /content-disposition/0.5.4:
+ resolution: {integrity: sha512-FveZTNuGw04cxlAiWbzi6zTAL/lhehaWbTtgluJh4/E95DqMwTmha3KZN1aAWA8cFIhHzMZUvLevkw5Rqk+tSQ==}
+ engines: {node: '>= 0.6'}
+ dependencies:
+ safe-buffer: 5.2.1
+ dev: true
+
+ /content-type/1.0.4:
+ resolution: {integrity: sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA==}
+ engines: {node: '>= 0.6'}
+ dev: true
+
/conventional-changelog-angular/5.0.13:
resolution: {integrity: sha512-i/gipMxs7s8L/QeuavPF2hLnJgH6pEZAttySB6aiQLWcX3puWDL3ACVmvBhJGxnAy52Qc15ua26BufY6KpmrVA==}
engines: {node: '>=10'}
@@ -2076,9 +2215,28 @@ packages:
resolution: {integrity: sha512-RyZrFi6PNpBFbIaQjXDlFIhFVqV42QeKSZX1yQIl6ihImq6vcHNGMtqQ/QzY3RMPuYSkvsRwtnt5M9NeYxKt0g==}
dev: true
+ /cookies/0.8.0:
+ resolution: {integrity: sha512-8aPsApQfebXnuI+537McwYsDtjVxGm8gTIzQI3FDW6t5t/DAhERxtnbEPN/8RX+uZthoz4eCOgloXaE5cYyNow==}
+ engines: {node: '>= 0.8'}
+ dependencies:
+ depd: 2.0.0
+ keygrip: 1.1.0
+ dev: true
+
/core-util-is/1.0.3:
resolution: {integrity: sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==}
+ /cosmiconfig/7.0.1:
+ resolution: {integrity: sha512-a1YWNUV2HwGimB7dU2s1wUMurNKjpx60HxBB6xUM8Re+2s1g1IIfJvFR0/iCF+XHdE0GMTKTuLR32UQff4TEyQ==}
+ engines: {node: '>=10'}
+ dependencies:
+ '@types/parse-json': 4.0.0
+ import-fresh: 3.3.0
+ parse-json: 5.2.0
+ path-type: 4.0.0
+ yaml: 1.10.2
+ dev: true
+
/crc-32/1.2.2:
resolution: {integrity: sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ==}
engines: {node: '>=0.8'}
@@ -2114,6 +2272,24 @@ packages:
postcss: 8.4.16
dev: true
+ /css-loader/5.2.7:
+ resolution: {integrity: sha512-Q7mOvpBNBG7YrVGMxRxcBJZFL75o+cH2abNASdibkj/fffYD8qWbInZrD0S9ccI6vZclF3DsHE7njGlLtaHbhg==}
+ engines: {node: '>= 10.13.0'}
+ peerDependencies:
+ webpack: ^4.27.0 || ^5.0.0
+ dependencies:
+ icss-utils: 5.1.0_postcss@8.4.16
+ loader-utils: 2.0.2
+ postcss: 8.4.16
+ postcss-modules-extract-imports: 3.0.0_postcss@8.4.16
+ postcss-modules-local-by-default: 4.0.0_postcss@8.4.16
+ postcss-modules-scope: 3.0.0_postcss@8.4.16
+ postcss-modules-values: 4.0.0_postcss@8.4.16
+ postcss-value-parser: 4.2.0
+ schema-utils: 3.1.1
+ semver: 7.3.7
+ dev: true
+
/css-select/4.3.0:
resolution: {integrity: sha512-wPpOYtnsVontu2mODhA19JrqWxNsfdatRKd64kmpRbQgh1KtItko5sTnEpPdpSaJszTOhEMlF/RPz28qj4HqhQ==}
dependencies:
@@ -2277,6 +2453,10 @@ packages:
engines: {node: '>=0.10.0'}
dev: true
+ /deep-equal/1.0.1:
+ resolution: {integrity: sha512-bHtC0iYvWhyaTzvV3CZgPeZQqCOBGyGsVV7v4eevpdkLHfiSrXUdBG+qAuSz4RI70sszvjQ1QSZ98An1yNwpSw==}
+ dev: true
+
/deep-is/0.1.4:
resolution: {integrity: sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==}
dev: true
@@ -2309,6 +2489,10 @@ packages:
resolution: {integrity: sha512-Y2caI5+ZwS5c3RiNDJ6u53VhQHv+hHKwhkI1iHvceKUHw9Df6EK2zRLfjejRgMuCuxK7PfSWIMwWecceVvThjQ==}
dev: true
+ /defu/3.2.2:
+ resolution: {integrity: sha512-8UWj5lNv7HD+kB0e9w77Z7TdQlbUYDVWqITLHNqFIn6khrNHv5WQo38Dcm1f6HeNyZf0U7UbPf6WeZDSdCzGDQ==}
+ dev: true
+
/defu/5.0.1:
resolution: {integrity: sha512-EPS1carKg+dkEVy3qNTqIdp2qV7mUP08nIsupfwQpz++slCVRw7qbQyWvSTig+kFPwz2XXp5/kIIkH+CwrJKkQ==}
dev: true
@@ -2325,6 +2509,11 @@ packages:
engines: {node: '>=0.10'}
dev: true
+ /depd/1.1.2:
+ resolution: {integrity: sha512-7emPTl6Dpo6JRXOXjLRxck+FlLRX5847cLKEn00PLAgc3g2hTZZgr+e4c2v6QpSmLeFP3n5yUo7ft6avBK/5jQ==}
+ engines: {node: '>= 0.6'}
+ dev: true
+
/depd/2.0.0:
resolution: {integrity: sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==}
engines: {node: '>= 0.8'}
@@ -2494,6 +2683,11 @@ packages:
resolution: {integrity: sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==}
dev: true
+ /emojis-list/3.0.0:
+ resolution: {integrity: sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==}
+ engines: {node: '>= 4'}
+ dev: true
+
/encodeurl/1.0.2:
resolution: {integrity: sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w==}
engines: {node: '>= 0.8'}
@@ -3643,6 +3837,16 @@ packages:
universalify: 2.0.0
dev: true
+ /fs-extra/9.1.0:
+ resolution: {integrity: sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==}
+ engines: {node: '>=10'}
+ dependencies:
+ at-least-node: 1.0.0
+ graceful-fs: 4.2.10
+ jsonfile: 6.1.0
+ universalify: 2.0.0
+ dev: true
+
/fs-memo/1.2.0:
resolution: {integrity: sha512-YEexkCpL4j03jn5SxaMHqcO6IuWuqm8JFUYhyCep7Ao89JIYmB8xoKhK7zXXJ9cCaNXpyNH5L3QtAmoxjoHW2w==}
dev: true
@@ -3982,6 +4186,35 @@ packages:
entities: 4.4.0
dev: true
+ /http-assert/1.5.0:
+ resolution: {integrity: sha512-uPpH7OKX4H25hBmU6G1jWNaqJGpTXxey+YOUizJUAgu0AjLUeC8D73hTrhvDS5D+GJN1DN1+hhc/eF/wpxtp0w==}
+ engines: {node: '>= 0.8'}
+ dependencies:
+ deep-equal: 1.0.1
+ http-errors: 1.8.1
+ dev: true
+
+ /http-errors/1.6.3:
+ resolution: {integrity: sha512-lks+lVC8dgGyh97jxvxeYTWQFvh4uw4yC12gVl63Cg30sjPX4wuGcdkICVXDAESr6OJGjqGA8Iz5mkeN6zlD7A==}
+ engines: {node: '>= 0.6'}
+ dependencies:
+ depd: 1.1.2
+ inherits: 2.0.3
+ setprototypeof: 1.1.0
+ statuses: 1.5.0
+ dev: true
+
+ /http-errors/1.8.1:
+ resolution: {integrity: sha512-Kpk9Sm7NmI+RHhnj6OIWDI1d6fIoFAtFt9RLaTMRlg/8w49juAStsrBgp0Dp4OdxdVbRIeKhtCUvoi/RuAhO4g==}
+ engines: {node: '>= 0.6'}
+ dependencies:
+ depd: 1.1.2
+ inherits: 2.0.4
+ setprototypeof: 1.2.0
+ statuses: 1.5.0
+ toidentifier: 1.0.1
+ dev: true
+
/http-errors/2.0.0:
resolution: {integrity: sha512-FtwrG/euBzaEjYeRqOgly7G0qviiXoJWnvEH2Z1plBdXgbyjv34pHTSb9zoeHMyDy33+DWy5Wt9Wo+TURtOYSQ==}
engines: {node: '>= 0.8'}
@@ -4031,6 +4264,15 @@ packages:
safer-buffer: 2.1.2
dev: true
+ /icss-utils/5.1.0_postcss@8.4.16:
+ resolution: {integrity: sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==}
+ engines: {node: ^10 || ^12 || >= 14}
+ peerDependencies:
+ postcss: ^8.1.0
+ dependencies:
+ postcss: 8.4.16
+ dev: true
+
/ieee754/1.2.1:
resolution: {integrity: sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==}
dev: true
@@ -4064,6 +4306,10 @@ packages:
wrappy: 1.0.2
dev: true
+ /inherits/2.0.3:
+ resolution: {integrity: sha512-x00IRNXNy63jwGkJmzPigoySHbaqpNuzKbBOmzK+g2OdZpQ9w+sxCN+VSB3ja7IAge2OP2qpfxTjeNcyjmW1uw==}
+ dev: true
+
/inherits/2.0.4:
resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==}
@@ -4208,6 +4454,13 @@ packages:
engines: {node: '>=8'}
dev: true
+ /is-generator-function/1.0.10:
+ resolution: {integrity: sha512-jsEjy9l3yiXEQ+PsXdmBwEPcOxaXWLspKdplFUVI9vq1iZgIekeC0L167qeu86czQaxed3q/Uzuw0swL0irL8A==}
+ engines: {node: '>= 0.4'}
+ dependencies:
+ has-tostringtag: 1.0.0
+ dev: true
+
/is-glob/4.0.3:
resolution: {integrity: sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==}
engines: {node: '>=0.10.0'}
@@ -4434,6 +4687,13 @@ packages:
engines: {'0': node >= 0.2.0}
dev: true
+ /keygrip/1.1.0:
+ resolution: {integrity: sha512-iYSchDJ+liQ8iwbSI2QqsQOvqv58eJCEanyJPJi+Khyu8smkcKSFUCbPwzFcL7YVtZ6eONjqRX/38caJ7QjRAQ==}
+ engines: {node: '>= 0.6'}
+ dependencies:
+ tsscmp: 1.0.6
+ dev: true
+
/kind-of/6.0.3:
resolution: {integrity: sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==}
engines: {node: '>=0.10.0'}
@@ -4447,6 +4707,70 @@ packages:
/knitwork/0.1.2:
resolution: {integrity: sha512-2ekmY2S/VB3YGVhrIFadyJQpkjMFSf48tsXCnA+kjs4FEQIT+5FLyOF0No/X58z/2E/VaMyeJfukRoVT4gMsfQ==}
+ /koa-compose/4.1.0:
+ resolution: {integrity: sha512-8ODW8TrDuMYvXRwra/Kh7/rJo9BtOfPc6qO8eAfC80CnCvSjSl0bkRM24X6/XBBEyj0v1nRUQ1LyOy3dbqOWXw==}
+ dev: true
+
+ /koa-convert/2.0.0:
+ resolution: {integrity: sha512-asOvN6bFlSnxewce2e/DK3p4tltyfC4VM7ZwuTuepI7dEQVcvpyFuBcEARu1+Hxg8DIwytce2n7jrZtRlPrARA==}
+ engines: {node: '>= 10'}
+ dependencies:
+ co: 4.6.0
+ koa-compose: 4.1.0
+ dev: true
+
+ /koa-send/5.0.1:
+ resolution: {integrity: sha512-tmcyQ/wXXuxpDxyNXv5yNNkdAMdFRqwtegBXUaowiQzUKqJehttS0x2j0eOZDQAyloAth5w6wwBImnFzkUz3pQ==}
+ engines: {node: '>= 8'}
+ dependencies:
+ debug: 4.3.4
+ http-errors: 1.8.1
+ resolve-path: 1.4.0
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
+ /koa-static/5.0.0:
+ resolution: {integrity: sha512-UqyYyH5YEXaJrf9S8E23GoJFQZXkBVJ9zYYMPGz919MSX1KuvAcycIuS0ci150HCoPf4XQVhQ84Qf8xRPWxFaQ==}
+ engines: {node: '>= 7.6.0'}
+ dependencies:
+ debug: 3.2.7
+ koa-send: 5.0.1
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
+ /koa/2.13.4:
+ resolution: {integrity: sha512-43zkIKubNbnrULWlHdN5h1g3SEKXOEzoAlRsHOTFpnlDu8JlAOZSMJBLULusuXRequboiwJcj5vtYXKB3k7+2g==}
+ engines: {node: ^4.8.4 || ^6.10.1 || ^7.10.1 || >= 8.1.4}
+ dependencies:
+ accepts: 1.3.8
+ cache-content-type: 1.0.1
+ content-disposition: 0.5.4
+ content-type: 1.0.4
+ cookies: 0.8.0
+ debug: 4.3.4
+ delegates: 1.0.0
+ depd: 2.0.0
+ destroy: 1.2.0
+ encodeurl: 1.0.2
+ escape-html: 1.0.3
+ fresh: 0.5.2
+ http-assert: 1.5.0
+ http-errors: 1.8.1
+ is-generator-function: 1.0.10
+ koa-compose: 4.1.0
+ koa-convert: 2.0.0
+ on-finished: 2.4.1
+ only: 0.0.2
+ parseurl: 1.3.3
+ statuses: 1.5.0
+ type-is: 1.6.18
+ vary: 1.1.2
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
/lazystream/1.0.1:
resolution: {integrity: sha512-b94GiNHQNy6JNTrt5w6zNyffMrNkXZb3KTkCZJb2V1xaEGCk093vkZ2jk3tpaeP33/OiXC+WvK9AxUebnf5nbw==}
engines: {node: '>= 0.6.3'}
@@ -4506,6 +4830,15 @@ packages:
strip-bom: 3.0.0
dev: true
+ /loader-utils/2.0.2:
+ resolution: {integrity: sha512-TM57VeHptv569d/GKh6TAYdzKblwDNiumOdkFnejjD0XwTH87K90w3O7AiJRqdQoXygvi1VQTJTLGhJl7WqA7A==}
+ engines: {node: '>=8.9.0'}
+ dependencies:
+ big.js: 5.2.2
+ emojis-list: 3.0.0
+ json5: 2.2.1
+ dev: true
+
/local-pkg/0.4.2:
resolution: {integrity: sha512-mlERgSPrbxU3BP4qBqAvvwlgW4MTg78iwJdGGnv7kibKjWcJksrG3t6LB5lXI93wXRDvG4NpUgJFmTG4T6rdrg==}
engines: {node: '>=14'}
@@ -4669,6 +5002,11 @@ packages:
resolution: {integrity: sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==}
dev: true
+ /media-typer/0.3.0:
+ resolution: {integrity: sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==}
+ engines: {node: '>= 0.6'}
+ dev: true
+
/memory-fs/0.5.0:
resolution: {integrity: sha512-jA0rdU5KoQMC0e6ppoNRtpp6vjFq6+NY7r8hywnC7V+1Xj/MtHwGIbB1QaK/dunyjWteJzmkpd7ooeWg10T7GA==}
engines: {node: '>=4.3.0 <5.0.0 || >=5.10'}
@@ -4701,6 +5039,11 @@ packages:
resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
engines: {node: '>= 8'}
+ /methods/1.1.2:
+ resolution: {integrity: sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w==}
+ engines: {node: '>= 0.6'}
+ dev: true
+
/micromark/2.11.4:
resolution: {integrity: sha512-+WoovN/ppKolQOFIAajxi7Lu9kInbPxFuTBVEavFcL8eAfVstoc5MocPmqBeAdBOJV00uaVjegzH4+MA0DN/uA==}
dependencies:
@@ -4717,6 +5060,18 @@ packages:
braces: 3.0.2
picomatch: 2.3.1
+ /mime-db/1.52.0:
+ resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==}
+ engines: {node: '>= 0.6'}
+ dev: true
+
+ /mime-types/2.1.35:
+ resolution: {integrity: sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==}
+ engines: {node: '>= 0.6'}
+ dependencies:
+ mime-db: 1.52.0
+ dev: true
+
/mime/1.6.0:
resolution: {integrity: sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==}
engines: {node: '>=4'}
@@ -4890,6 +5245,11 @@ packages:
resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
dev: true
+ /negotiator/0.6.3:
+ resolution: {integrity: sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==}
+ engines: {node: '>= 0.6'}
+ dev: true
+
/neo-async/2.6.2:
resolution: {integrity: sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==}
dev: true
@@ -5218,6 +5578,18 @@ packages:
mimic-fn: 2.1.0
dev: true
+ /only/0.0.2:
+ resolution: {integrity: sha512-Fvw+Jemq5fjjyWz6CpKx6w9s7xxqo3+JCyM0WXWeCSOboZ8ABkyvP8ID4CZuChA/wxSx+XSJmdOm8rGVyJ1hdQ==}
+ dev: true
+
+ /open/7.4.2:
+ resolution: {integrity: sha512-MVHddDVweXZF3awtlAS+6pgKLlm/JgxZ90+/NBurBoQctVOOB/zDdVjcyPzQ+0laDGbsWgrRkflI65sQeOgT9Q==}
+ engines: {node: '>=8'}
+ dependencies:
+ is-docker: 2.2.1
+ is-wsl: 2.2.0
+ dev: true
+
/open/8.4.0:
resolution: {integrity: sha512-XgFPPM+B28FtCCgSb9I+s9szOC1vZRSwgWsRUA5ylIxRTgKozqjOCrVOqGsYABPYK5qnfqClxZTFBa8PKt2v6Q==}
engines: {node: '>=12'}
@@ -5325,6 +5697,13 @@ packages:
callsites: 3.1.0
dev: true
+ /parent-module/2.0.0:
+ resolution: {integrity: sha512-uo0Z9JJeWzv8BG+tRcapBKNJ0dro9cLyczGzulS6EfeyAdeC9sbojtW6XwvYxJkEne9En+J2XEl4zyglVeIwFg==}
+ engines: {node: '>=8'}
+ dependencies:
+ callsites: 3.1.0
+ dev: true
+
/parse-entities/2.0.0:
resolution: {integrity: sha512-kkywGpCcRYhqQIchaWqZ875wzpS/bMKhz5HnN3p7wveJTkTtyAB/AlnS0f8DFSqYW1T82t6yEAkEcB+A1I3MbQ==}
dependencies:
@@ -5403,6 +5782,10 @@ packages:
resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
dev: true
+ /path-to-regexp/6.2.1:
+ resolution: {integrity: sha512-JLyh7xT1kizaEvcaXOQwOc2/Yhw6KZOvPf1S8401UyLk86CU79LN3vl7ztXGm/pZ+YjoyAJ4rxmHwbkBXJX+yw==}
+ dev: true
+
/path-type/3.0.0:
resolution: {integrity: sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==}
engines: {node: '>=4'}
@@ -5454,6 +5837,17 @@ packages:
engines: {node: '>=4'}
dev: true
+ /portfinder/1.0.32:
+ resolution: {integrity: sha512-on2ZJVVDXRADWE6jnQaX0ioEylzgBpQk8r55NE4wjXW1ZxO+BgDlY6DXwj20i0V8eB4SenDQ00WEaxfiIQPcxg==}
+ engines: {node: '>= 0.12.0'}
+ dependencies:
+ async: 2.6.4
+ debug: 3.2.7
+ mkdirp: 0.5.6
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
/postcss-calc/8.2.4_postcss@8.4.16:
resolution: {integrity: sha512-SmWMSJmB8MRnnULldx0lQIyhSNvuDl9HfrZkaqqE/WHAhToYsAvDq+yAsA/kIyINDszOp3Rh0GFoNuH5Ypsm3Q==}
peerDependencies:
@@ -5488,6 +5882,16 @@ packages:
postcss-value-parser: 4.2.0
dev: true
+ /postcss-custom-properties/12.1.9_postcss@8.4.16:
+ resolution: {integrity: sha512-/E7PRvK8DAVljBbeWrcEQJPG72jaImxF3vvCNFwv9cC8CzigVoNIpeyfnJzphnN3Fd8/auBf5wvkw6W9MfmTyg==}
+ engines: {node: ^12 || ^14 || >=16}
+ peerDependencies:
+ postcss: ^8.2
+ dependencies:
+ postcss: 8.4.16
+ postcss-value-parser: 4.2.0
+ dev: true
+
/postcss-discard-comments/5.1.2_postcss@8.4.16:
resolution: {integrity: sha512-+L8208OVbHVF2UQf1iDmRcbdjJkuBF6IS29yBDSiWUIzpYaAhtNl6JYnYm12FnkeCwQqF5LeklOu6rAqgfBZqQ==}
engines: {node: ^10 || ^12 || >=14.0}
@@ -5529,6 +5933,18 @@ packages:
dependencies:
enhanced-resolve: 4.5.0
+ /postcss-import/13.0.0_postcss@8.4.16:
+ resolution: {integrity: sha512-LPUbm3ytpYopwQQjqgUH4S3EM/Gb9QsaSPP/5vnoi+oKVy3/mIk2sc0Paqw7RL57GpScm9MdIMUypw2znWiBpg==}
+ engines: {node: '>=10.0.0'}
+ peerDependencies:
+ postcss: ^8.0.0
+ dependencies:
+ postcss: 8.4.16
+ postcss-value-parser: 4.2.0
+ read-cache: 1.0.0
+ resolve: 1.22.1
+ dev: true
+
/postcss-import/14.1.0_postcss@8.4.16:
resolution: {integrity: sha512-flwI+Vgm4SElObFVPpTIT7SU7R3qk2L7PyduMcokiaVKuWv9d/U+Gm/QAd8NDLuykTWTkcrjOeD2Pp1rMeBTGw==}
engines: {node: '>=10.0.0'}
@@ -5580,6 +5996,21 @@ packages:
yaml: 1.10.2
dev: true
+ /postcss-loader/4.3.0_postcss@8.4.16:
+ resolution: {integrity: sha512-M/dSoIiNDOo8Rk0mUqoj4kpGq91gcxCfb9PoyZVdZ76/AuhxylHDYZblNE8o+EQ9AMSASeMFEKxZf5aU6wlx1Q==}
+ engines: {node: '>= 10.13.0'}
+ peerDependencies:
+ postcss: ^7.0.0 || ^8.0.1
+ webpack: ^4.0.0 || ^5.0.0
+ dependencies:
+ cosmiconfig: 7.0.1
+ klona: 2.0.5
+ loader-utils: 2.0.2
+ postcss: 8.4.16
+ schema-utils: 3.1.1
+ semver: 7.3.7
+ dev: true
+
/postcss-merge-longhand/5.1.6_postcss@8.4.16:
resolution: {integrity: sha512-6C/UGF/3T5OE2CEbOuX7iNO63dnvqhGZeUnKkDeifebY0XqkkvrctYSZurpNE902LDf2yKwwPFgotnfSoPhQiw==}
engines: {node: ^10 || ^12 || >=14.0}
@@ -5648,6 +6079,47 @@ packages:
postcss-selector-parser: 6.0.10
dev: true
+ /postcss-modules-extract-imports/3.0.0_postcss@8.4.16:
+ resolution: {integrity: sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==}
+ engines: {node: ^10 || ^12 || >= 14}
+ peerDependencies:
+ postcss: ^8.1.0
+ dependencies:
+ postcss: 8.4.16
+ dev: true
+
+ /postcss-modules-local-by-default/4.0.0_postcss@8.4.16:
+ resolution: {integrity: sha512-sT7ihtmGSF9yhm6ggikHdV0hlziDTX7oFoXtuVWeDd3hHObNkcHRo9V3yg7vCAY7cONyxJC/XXCmmiHHcvX7bQ==}
+ engines: {node: ^10 || ^12 || >= 14}
+ peerDependencies:
+ postcss: ^8.1.0
+ dependencies:
+ icss-utils: 5.1.0_postcss@8.4.16
+ postcss: 8.4.16
+ postcss-selector-parser: 6.0.10
+ postcss-value-parser: 4.2.0
+ dev: true
+
+ /postcss-modules-scope/3.0.0_postcss@8.4.16:
+ resolution: {integrity: sha512-hncihwFA2yPath8oZ15PZqvWGkWf+XUfQgUGamS4LqoP1anQLOsOJw0vr7J7IwLpoY9fatA2qiGUGmuZL0Iqlg==}
+ engines: {node: ^10 || ^12 || >= 14}
+ peerDependencies:
+ postcss: ^8.1.0
+ dependencies:
+ postcss: 8.4.16
+ postcss-selector-parser: 6.0.10
+ dev: true
+
+ /postcss-modules-values/4.0.0_postcss@8.4.16:
+ resolution: {integrity: sha512-RDxHkAiEGI78gS2ofyvCsu7iycRv7oqw5xMWn9iMoR0N/7mf9D50ecQqUo5BZ9Zh2vH4bCUR/ktCqbB9m8vJjQ==}
+ engines: {node: ^10 || ^12 || >= 14}
+ peerDependencies:
+ postcss: ^8.1.0
+ dependencies:
+ icss-utils: 5.1.0_postcss@8.4.16
+ postcss: 8.4.16
+ dev: true
+
/postcss-nested/5.0.6_postcss@8.4.16:
resolution: {integrity: sha512-rKqm2Fk0KbA8Vt3AdGN0FB9OBOMDVajMG6ZCf/GoHgdxUJ4sBFp0A/uMIRm+MJUdo33YXEtjqIz8u7DAp8B7DA==}
engines: {node: '>=12.0'}
@@ -5658,6 +6130,17 @@ packages:
postcss-selector-parser: 6.0.10
dev: true
+ /postcss-nesting/10.2.0_postcss@8.4.16:
+ resolution: {integrity: sha512-EwMkYchxiDiKUhlJGzWsD9b2zvq/r2SSubcRrgP+jujMXFzqvANLt16lJANC+5uZ6hjI7lpRmI6O8JIl+8l1KA==}
+ engines: {node: ^12 || ^14 || >=16}
+ peerDependencies:
+ postcss: ^8.2
+ dependencies:
+ '@csstools/selector-specificity': 2.0.2_pnx64jze6bptzcedy5bidi3zdi
+ postcss: 8.4.16
+ postcss-selector-parser: 6.0.10
+ dev: true
+
/postcss-normalize-charset/5.1.0_postcss@8.4.16:
resolution: {integrity: sha512-mSgUJ+pd/ldRGVx26p2wz9dNZ7ji6Pn8VWBajMXFf8jk7vUoSrZ2lt/wZR7DtlZYKesmZI680qjr2CeFF2fbUg==}
engines: {node: ^10 || ^12 || >=14.0}
@@ -6032,6 +6515,16 @@ packages:
engines: {node: '>=8'}
dev: true
+ /replace-in-file/6.3.5:
+ resolution: {integrity: sha512-arB9d3ENdKva2fxRnSjwBEXfK1npgyci7ZZuwysgAp7ORjHSyxz6oqIjTEv8R0Ydl4Ll7uOAZXL4vbkhGIizCg==}
+ engines: {node: '>=10'}
+ hasBin: true
+ dependencies:
+ chalk: 4.1.2
+ glob: 7.2.3
+ yargs: 17.5.1
+ dev: true
+
/require-directory/2.1.1:
resolution: {integrity: sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==}
engines: {node: '>=0.10.0'}
@@ -6051,6 +6544,14 @@ packages:
engines: {node: '>=8'}
dev: true
+ /resolve-path/1.4.0:
+ resolution: {integrity: sha512-i1xevIst/Qa+nA9olDxLWnLk8YZbi8R/7JPbCMcgyWaFR6bKWaexgJgEB5oc2PKMjYdrHynyz0NY+if+H98t1w==}
+ engines: {node: '>= 0.8'}
+ dependencies:
+ http-errors: 1.6.3
+ path-is-absolute: 1.0.1
+ dev: true
+
/resolve/1.22.1:
resolution: {integrity: sha512-nBpuuYuY5jFsli/JIs1oldw6fOQCBioohqWZg/2hiaOybXOft4lonv85uDOKXdf8rhyK159cxU5cDcK/NKk8zw==}
hasBin: true
@@ -6202,6 +6703,15 @@ packages:
resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
dev: true
+ /schema-utils/3.1.1:
+ resolution: {integrity: sha512-Y5PQxS4ITlC+EahLuXaY86TXfR7Dc5lw294alXOq86JAHCihAIZfqv8nNCWvaEJvaC51uN9hbLGeV0cFBdH+Fw==}
+ engines: {node: '>= 10.13.0'}
+ dependencies:
+ '@types/json-schema': 7.0.11
+ ajv: 6.12.6
+ ajv-keywords: 3.5.2_ajv@6.12.6
+ dev: true
+
/scule/0.2.1:
resolution: {integrity: sha512-M9gnWtn3J0W+UhJOHmBxBTwv8mZCan5i1Himp60t6vvZcor0wr+IM0URKmIglsWJ7bRujNAVVN77fp+uZaWoKg==}
dev: true
@@ -6281,6 +6791,10 @@ packages:
resolution: {integrity: sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==}
dev: true
+ /setprototypeof/1.1.0:
+ resolution: {integrity: sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ==}
+ dev: true
+
/setprototypeof/1.2.0:
resolution: {integrity: sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==}
dev: true
@@ -6407,6 +6921,11 @@ packages:
yargs: 16.2.0
dev: true
+ /statuses/1.5.0:
+ resolution: {integrity: sha512-OpZ3zP+jT1PI7I8nemJX4AKmAX070ZkYPVWV/AaKTJl+tXCTGyVdC1a4SL8RUQYEwk/f34ZX8UTykN68FwrqAA==}
+ engines: {node: '>= 0.6'}
+ dev: true
+
/statuses/2.0.1:
resolution: {integrity: sha512-RwNA9Z/7PrK06rYLIzFMlaF+l73iwpzsqRIFgbMLbTcLD6cOao82TaWefPXQvB2fOC4AjuYSEndS7N/mTCbkdQ==}
engines: {node: '>= 0.8'}
@@ -6552,6 +7071,26 @@ packages:
stable: 0.1.8
dev: true
+ /tailwind-config-viewer/1.7.2_tailwindcss@3.1.8:
+ resolution: {integrity: sha512-3JJCeAAlvG+i/EBj+tQb0x4weo30QjdSAo4hlcnVbtD+CkpzHi/UwU9InbPMcYH+ESActoa2kCyjpLEyjEkn0Q==}
+ engines: {node: '>=8'}
+ hasBin: true
+ peerDependencies:
+ tailwindcss: 1 || 2 || 2.0.1-compat || 3
+ dependencies:
+ '@koa/router': 9.4.0
+ commander: 6.2.1
+ fs-extra: 9.1.0
+ koa: 2.13.4
+ koa-static: 5.0.0
+ open: 7.4.2
+ portfinder: 1.0.32
+ replace-in-file: 6.3.5
+ tailwindcss: 3.1.8
+ transitivePeerDependencies:
+ - supports-color
+ dev: true
+
/tailwindcss/3.1.8:
resolution: {integrity: sha512-YSneUCZSFDYMwk+TGq8qYFdCA3yfBRdBlS7txSq0LUmzyeqRe3a8fBQzbz9M3WS/iFT4BNf/nmw9mEzrnSaC0g==}
engines: {node: '>=12.13.0'}
@@ -6716,6 +7255,11 @@ packages:
resolution: {integrity: sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==}
dev: true
+ /tsscmp/1.0.6:
+ resolution: {integrity: sha512-LxhtAkPDTkVCMQjt2h6eBVY28KCjikZqZfMcC15YBeNjkgUpdCfBu5HoiOTDu86v6smE8yOjyEktJ8hlbANHQA==}
+ engines: {node: '>=0.6.x'}
+ dev: true
+
/tsutils/3.21.0:
resolution: {integrity: sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA==}
engines: {node: '>= 6'}
@@ -6767,6 +7311,14 @@ packages:
engines: {node: '>=12.20'}
dev: true
+ /type-is/1.6.18:
+ resolution: {integrity: sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==}
+ engines: {node: '>= 0.6'}
+ dependencies:
+ media-typer: 0.3.0
+ mime-types: 2.1.35
+ dev: true
+
/typedarray/0.0.6:
resolution: {integrity: sha512-/aCDEGatGvZ2BIk+HmLf4ifCJFwvKFNb9/JeZPMulfgFracn9QFcAf5GO8B/mweUjSoblS5In0cWhqpfs/5PQA==}
dev: true
@@ -7075,6 +7627,11 @@ packages:
spdx-expression-parse: 3.0.1
dev: true
+ /vary/1.1.2:
+ resolution: {integrity: sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==}
+ engines: {node: '>= 0.8'}
+ dev: true
+
/vite-node/0.23.4:
resolution: {integrity: sha512-8VuDGwTWIvwPYcbw8ZycMlwAwqCmqZfLdFrDK75+o+6bWYpede58k6AAXN9ioU+icW82V4u1MzkxLVhhIoQ9xA==}
engines: {node: '>=v14.16.0'}
@@ -7451,6 +8008,11 @@ packages:
yargs-parser: 21.1.1
dev: true
+ /ylru/1.3.2:
+ resolution: {integrity: sha512-RXRJzMiK6U2ye0BlGGZnmpwJDPgakn6aNQ0A7gHRbD4I0uvK4TW6UqkK1V0pp9jskjJBAXd3dRrbzWkqJ+6cxA==}
+ engines: {node: '>= 4.0.0'}
+ dev: true
+
/yocto-queue/0.1.0:
resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}
engines: {node: '>=10'}
From dc9f536cb0727b99ccb73acf5c83da27e9ee493b Mon Sep 17 00:00:00 2001
From: Driss Chelouati
Date: Tue, 27 Sep 2022 15:56:40 +0100
Subject: [PATCH 04/16] fix: fix clickables accessibility
---
playground/app.config.ts | 4 +--
playground/assets/css/main.css | 2 ++
.../assets/css/modules/accessibility.css | 9 ++++++
playground/components/Hero.vue | 6 ++--
playground/components/Navigation.vue | 28 +++++++++++--------
playground/components/toast/ActionButtons.vue | 4 +--
.../components/toast/IconSoloDanger.vue | 2 +-
.../components/toast/UserReplyClose.vue | 2 +-
playground/nuxt.config.ts | 1 +
9 files changed, 37 insertions(+), 21 deletions(-)
create mode 100644 playground/assets/css/modules/accessibility.css
diff --git a/playground/app.config.ts b/playground/app.config.ts
index e4a5047..f67c448 100644
--- a/playground/app.config.ts
+++ b/playground/app.config.ts
@@ -1,5 +1,5 @@
export default defineAppConfig({
toaster: {
- maxToasts: 10
- }
+ maxToasts: 10,
+ },
})
diff --git a/playground/assets/css/main.css b/playground/assets/css/main.css
index bd6213e..deaa318 100644
--- a/playground/assets/css/main.css
+++ b/playground/assets/css/main.css
@@ -1,3 +1,5 @@
+@import './modules/accessibility.css';
+
@tailwind base;
@tailwind components;
@tailwind utilities;
\ No newline at end of file
diff --git a/playground/assets/css/modules/accessibility.css b/playground/assets/css/modules/accessibility.css
new file mode 100644
index 0000000..b1a0666
--- /dev/null
+++ b/playground/assets/css/modules/accessibility.css
@@ -0,0 +1,9 @@
+@layer utilities {
+ .tw-accessibility {
+ @apply outline-none focus-visible:outline-none focus-visible:outline-dashed focus-visible:outline-muted-300 dark:focus-visible:outline-muted-600 focus-visible:outline-offset-2;
+ }
+
+ .tw-accessibility-static {
+ @apply outline-dashed outline-muted-300 dark:outline-muted-600 outline-offset-2;
+ }
+}
diff --git a/playground/components/Hero.vue b/playground/components/Hero.vue
index 52e2d5a..d1d2a2c 100644
--- a/playground/components/Hero.vue
+++ b/playground/components/Hero.vue
@@ -65,7 +65,7 @@
>
@@ -82,9 +82,9 @@
- Copy
+ Try Me
diff --git a/playground/components/Navigation.vue b/playground/components/Navigation.vue
index 0df3174..52a3cfa 100644
--- a/playground/components/Navigation.vue
+++ b/playground/components/Navigation.vue
@@ -22,16 +22,18 @@ const isChecked = ref(false)
-
-
+
+
+
+
Examples
API docs
Date: Tue, 27 Sep 2022 22:13:19 +0100
Subject: [PATCH 05/16] feat: add installation instructions
---
package.json | 4 +
playground/components/Section.vue | 9 ++
playground/components/content/BasicUsage.vue | 41 +++++++
playground/components/content/GetStarted.vue | 114 ++++++++++++++++++
playground/components/content/Setup.vue | 37 ++++++
playground/components/doc/Code.vue | 100 ++++++++++++++++
playground/components/shims.d.ts | 1 +
playground/pages/index.vue | 116 ++++++++++++-------
pnpm-lock.yaml | 25 ++++
9 files changed, 403 insertions(+), 44 deletions(-)
create mode 100644 playground/components/Section.vue
create mode 100644 playground/components/content/BasicUsage.vue
create mode 100644 playground/components/content/GetStarted.vue
create mode 100644 playground/components/content/Setup.vue
create mode 100644 playground/components/doc/Code.vue
create mode 100644 playground/components/shims.d.ts
diff --git a/package.json b/package.json
index 5744edc..63cb2ff 100644
--- a/package.json
+++ b/package.json
@@ -33,12 +33,16 @@
"@nuxt/module-builder": "latest",
"@nuxt/schema": "^3.0.0-rc.11",
"@nuxtjs/tailwindcss": "^5.3.3",
+ "@types/prismjs": "^1.26.0",
"eslint": "8.24.0",
"eslint-config-prettier": "8.5.0",
"eslint-plugin-prettier-vue": "4.2.0",
"eslint-plugin-tailwindcss": "3.6.1",
"eslint-plugin-vuejs-accessibility": "1.2.0",
"nuxt": "^3.0.0-rc.11",
+ "prism-theme-vars": "0.2.3",
+ "prismjs": "1.28.0",
+ "vue-prism-component": "2.0.0",
"standard-version": "^9.5.0"
}
}
diff --git a/playground/components/Section.vue b/playground/components/Section.vue
new file mode 100644
index 0000000..59106cb
--- /dev/null
+++ b/playground/components/Section.vue
@@ -0,0 +1,9 @@
+
+
+
\ No newline at end of file
diff --git a/playground/components/content/BasicUsage.vue b/playground/components/content/BasicUsage.vue
new file mode 100644
index 0000000..d80f520
--- /dev/null
+++ b/playground/components/content/BasicUsage.vue
@@ -0,0 +1,41 @@
+
+
+
+
+
+
+
+
+
+ Once you've added @cssninja/nuxt-toaster
to your
+ project, you can immediately start showing toasts. Please note that
+ toasts will be unstyled. Jump to the
+ theming section
+ for more details.
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/content/GetStarted.vue b/playground/components/content/GetStarted.vue
new file mode 100644
index 0000000..9ba69dc
--- /dev/null
+++ b/playground/components/content/GetStarted.vue
@@ -0,0 +1,114 @@
+
+
+
+
+
+
+
+
+
+ Nuxt Toaster is a simple toaster (notifier) handler for Nuxt.js,
+ served as a nuxt module.Start by adding
+ @cssninja/nuxt-toaster
as a dependency of your project.
+
+
+
+
+
+
+
+
+
+
Unstyled by default
+
+
+
+
+
+
+
+
+
+
Render any component as a toast
+
+
+
+
+
+
+
+
+
+
Fully customizable
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/content/Setup.vue b/playground/components/content/Setup.vue
new file mode 100644
index 0000000..544a18c
--- /dev/null
+++ b/playground/components/content/Setup.vue
@@ -0,0 +1,37 @@
+
+
+
+
+
+
+
+
+
+
+ To setup the module in your Nuxt project, add
+ @cssninja/nuxt-toaster
to the modules section of your
+ nuxt.config.js
or nuxt.config.ts
file.
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/doc/Code.vue b/playground/components/doc/Code.vue
new file mode 100644
index 0000000..9c2871f
--- /dev/null
+++ b/playground/components/doc/Code.vue
@@ -0,0 +1,100 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
{{
+ props.file
+ }}
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/shims.d.ts b/playground/components/shims.d.ts
new file mode 100644
index 0000000..572d476
--- /dev/null
+++ b/playground/components/shims.d.ts
@@ -0,0 +1 @@
+declare module 'vue-prism-component'
\ No newline at end of file
diff --git a/playground/pages/index.vue b/playground/pages/index.vue
index cddaa7d..ec5d91b 100644
--- a/playground/pages/index.vue
+++ b/playground/pages/index.vue
@@ -17,10 +17,10 @@ function showCustomToast() {
$nt.show({
content: () =>
h(CustomToast, {
- message: `Hello ${i} from Nuxt module playground!`
+ message: `Hello ${i} from Nuxt module playground!`,
}),
transition: {
- name: 'fadeOut'
+ name: 'fadeOut',
},
maxToasts: 5,
theme: {
@@ -33,10 +33,10 @@ function showCustomToast() {
'flex',
'flex-col-reverse',
'items-start',
- 'gap-2'
+ 'gap-2',
].join(' '),
- wrapperClass: 'pointer-events-auto cursor-pointer'
- }
+ wrapperClass: 'pointer-events-auto cursor-pointer',
+ },
})
}
@@ -45,7 +45,7 @@ async function showAdvancedToast() {
const toast = await $nt.show({
content: () =>
h(AdvancedToast, {
- message: `Hello ${i} from Nuxt module playground!`
+ message: `Hello ${i} from Nuxt module playground!`,
}),
dismissible: false,
maxToasts: 1,
@@ -59,7 +59,7 @@ async function showAdvancedToast() {
'flex',
'flex-col',
'items-end',
- 'gap-2'
+ 'gap-2',
].join(' '),
wrapperClass: [
'pointer-events-auto',
@@ -69,8 +69,8 @@ async function showAdvancedToast() {
'focus:outline',
'focus:outline-2',
'focus-within:outline',
- 'focus-within:outline-2'
- ].join(' ')
+ 'focus-within:outline-2',
+ ].join(' '),
},
transition: {
enterActiveClass: 'transition duration-300 ease-out',
@@ -78,8 +78,8 @@ async function showAdvancedToast() {
enterToClass: 'transform translate-x-0 opacity-100',
leaveActiveClass: 'transition duration-300 ease-in',
leaveFromClass: 'transform translate-x-0 opacity-100',
- leaveToClass: 'transform translate-x-full opacity-0'
- }
+ leaveToClass: 'transform translate-x-full opacity-0',
+ },
})
toast.el.focus()
@@ -90,44 +90,72 @@ function clearAllToast() {
function clearTopLeftToast() {
$nt.clear('nt-container-top-left')
}
+
+const demoCode = `
+# Using pnpm
+pnpm add -D @cssninja/nuxt-toaster
+
+# Using yarn
+pnpm add -D @cssninja/nuxt-toaster
+
+# Using npm
+npm install --save-dev @cssninja/nuxt-toaster
+`
+
+const demoCode2 = `
+export default defineNuxtConfig({
+ modules: [
+ '@cssninja/nuxt-toaster'
+ ]
+})
+`
-
-
Nuxt module playground!
-
- show basic toast
-
-
- show custom toast
-
-
- show advanced toast
-
-
- clear advanced toasts
-
-
- clear all toast
-
-
+
+
+
+
+
+
+
+
+
+
Nuxt module playground!
+
+ show basic toast
+
+
+ show custom toast
+
+
+ show advanced toast
+
+
+ clear advanced toasts
+
+
+ clear all toast
+
+
+
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 404ea6d..b48b6b5 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -6,6 +6,7 @@ specifiers:
'@nuxt/module-builder': latest
'@nuxt/schema': ^3.0.0-rc.11
'@nuxtjs/tailwindcss': ^5.3.3
+ '@types/prismjs': ^1.26.0
'@vueuse/core': ^9.2.0
defu: ^6.1.0
eslint: 8.24.0
@@ -14,7 +15,10 @@ specifiers:
eslint-plugin-tailwindcss: 3.6.1
eslint-plugin-vuejs-accessibility: 1.2.0
nuxt: ^3.0.0-rc.11
+ prism-theme-vars: 0.2.3
+ prismjs: 1.28.0
standard-version: ^9.5.0
+ vue-prism-component: 2.0.0
dependencies:
'@nuxt/kit': 3.0.0-rc.11
@@ -26,13 +30,17 @@ devDependencies:
'@nuxt/module-builder': 0.1.7
'@nuxt/schema': 3.0.0-rc.11
'@nuxtjs/tailwindcss': 5.3.3
+ '@types/prismjs': 1.26.0
eslint: 8.24.0
eslint-config-prettier: 8.5.0_eslint@8.24.0
eslint-plugin-prettier-vue: 4.2.0
eslint-plugin-tailwindcss: 3.6.1
eslint-plugin-vuejs-accessibility: 1.2.0_eslint@8.24.0
nuxt: 3.0.0-rc.11_eslint@8.24.0
+ prism-theme-vars: 0.2.3
+ prismjs: 1.28.0
standard-version: 9.5.0
+ vue-prism-component: 2.0.0
packages:
@@ -1025,6 +1033,10 @@ packages:
resolution: {integrity: sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==}
dev: true
+ /@types/prismjs/1.26.0:
+ resolution: {integrity: sha512-ZTaqn/qSqUuAq1YwvOFQfVW1AR/oQJlLSZVustdjwI+GZ8kr0MSHBj0tsXPW1EqHubx50gtBEjbPGsdZwQwCjQ==}
+ dev: true
+
/@types/resolve/1.17.1:
resolution: {integrity: sha512-yy7HuzQhj0dhGpD8RLXSZWEkLsV9ibvxvi6EiJ3bkqLAO1RGo0WbkWQiwpRlSFymTJRz0d3k5LM3kkx8ArDbLw==}
dependencies:
@@ -6347,6 +6359,15 @@ packages:
engines: {node: ^14.13.1 || >=16.0.0}
dev: true
+ /prism-theme-vars/0.2.3:
+ resolution: {integrity: sha512-lpRg8GWfxu38m4rZwjrvOxeHlmL4tERhe9sTjrC47HMu6uCEch3bLUQVNlISoEq9Z24g5Xm+B7AKdyiKSevktg==}
+ dev: true
+
+ /prismjs/1.28.0:
+ resolution: {integrity: sha512-8aaXdYvl1F7iC7Xm1spqSaY/OJBpYW3v+KJ+F17iYxvdc8sfjW194COK5wVhMZX45tGteiBQgdvD/nhxcRwylw==}
+ engines: {node: '>=6'}
+ dev: true
+
/process-nextick-args/2.0.1:
resolution: {integrity: sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==}
@@ -7810,6 +7831,10 @@ packages:
- supports-color
dev: true
+ /vue-prism-component/2.0.0:
+ resolution: {integrity: sha512-1ofrL+GCZOv4HqtX5W3EgkhSAgadSeuD8FDTXbwhLy8kS+28RCR8t2S5VTeM9U/peAaXLBpSgRt3J25ao8KTeg==}
+ dev: true
+
/vue-router/4.1.5_vue@3.2.39:
resolution: {integrity: sha512-IsvoF5D2GQ/EGTs/Th4NQms9gd2NSqV+yylxIyp/OYp8xOwxmU8Kj/74E9DTSYAyH5LX7idVUngN3JSj1X4xcQ==}
peerDependencies:
From 641dda3cd740c36f868e4cb45cf269a78138a111 Mon Sep 17 00:00:00 2001
From: Driss Chelouati
Date: Wed, 28 Sep 2022 13:01:49 +0100
Subject: [PATCH 06/16] feat: add CSS example, add philosophy
---
playground/assets/css/main.css | 1 +
playground/assets/css/modules/nt.css | 193 +++++++++
playground/assets/examples/index.ts | 33 ++
playground/components/Hero.vue | 5 +-
playground/components/Section.vue | 2 +-
playground/components/content/Anatomy.vue | 131 ++++++
.../components/content/ExamplePlain.vue | 373 ++++++++++++++++++
playground/components/content/GetStarted.vue | 2 +-
playground/components/doc/Code.vue | 2 +-
playground/components/mockup/Basic.vue | 98 +++++
playground/pages/index.vue | 4 +
11 files changed, 839 insertions(+), 5 deletions(-)
create mode 100644 playground/assets/css/modules/nt.css
create mode 100644 playground/assets/examples/index.ts
create mode 100644 playground/components/content/Anatomy.vue
create mode 100644 playground/components/content/ExamplePlain.vue
create mode 100644 playground/components/mockup/Basic.vue
diff --git a/playground/assets/css/main.css b/playground/assets/css/main.css
index deaa318..95e9847 100644
--- a/playground/assets/css/main.css
+++ b/playground/assets/css/main.css
@@ -1,4 +1,5 @@
@import './modules/accessibility.css';
+@import './modules/nt.css';
@tailwind base;
@tailwind components;
diff --git a/playground/assets/css/modules/nt.css b/playground/assets/css/modules/nt.css
new file mode 100644
index 0000000..949870b
--- /dev/null
+++ b/playground/assets/css/modules/nt.css
@@ -0,0 +1,193 @@
+/* ==========================================================================
+Variables
+========================================================================== */
+
+:root {
+ --nt-bg: #fff;
+ --nt-color: #1f2630;
+ --nt-bg-success: #18c78a;
+ --nt-color-success: #fff;
+ --nt-bg-info: #1f94ed;
+ --nt-color-info: #fff;
+ --nt-bg-warning: #edac1f;
+ --nt-color-warning: #fff;
+ --nt-bg-danger: #ed1f4c;
+ --nt-color-danger: #fff;
+ --nt-shadow: 0 0 1rem rgba(0, 0, 0, 0.1);
+}
+
+/* ==========================================================================
+Base
+========================================================================== */
+
+#nt-container {
+ /* make container fit the screen */
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ overflow: hidden;
+ z-index: 100;
+ pointer-events: none;
+
+ /* position the toasts using flexbox */
+ display: flex;
+
+ /**
+ * position all toasts in bottom of the screen
+ * - use "flex-direction: column;" to position in top screen
+ */
+ flex-direction: column-reverse;
+
+ /**
+ * align all toasts to the center
+ * - use "align-items: start" to aling to the left
+ * - use "align-items: end" to aling to the right
+ */
+ align-items: center;
+
+ /* add some space between toasts and screen */
+ padding: 2rem;
+ gap: 1rem;
+}
+
+#nt-container [role='alert'] {
+ /* allow toasts to be interactive */
+ pointer-events: auto;
+
+ /* add styles to toasts */
+ font-size: 0.9rem;
+ padding: 1rem;
+ border-radius: 0.5rem;
+ background-color: var(--nt-bg);
+ box-shadow: var(--nt-shadow);
+ cursor: pointer;
+}
+
+/* ==========================================================================
+Colors
+========================================================================== */
+
+#nt-container .nt-success {
+ background-color: var(--nt-bg-success);
+ color: var(--nt-color-success);
+}
+
+#nt-container .nt-info {
+ background-color: var(--nt-bg-info);
+ color: var(--nt-color-info);
+}
+
+#nt-container .nt-warning {
+ background-color: var(--nt-bg-warning);
+ color: var(--nt-color-warning);
+}
+
+#nt-container .nt-danger {
+ background-color: var(--nt-bg-danger);
+ color: var(--nt-color-danger);
+}
+
+/* ==========================================================================
+Position
+========================================================================== */
+
+/* Top right position */
+#nt-container.nt-top-right {
+ flex-direction: column;
+ align-items: flex-end;
+}
+
+/* Top center position */
+#nt-container.nt-top-center {
+ flex-direction: column;
+ align-items: center;
+}
+
+/* Top left position */
+#nt-container.nt-top-left {
+ flex-direction: column;
+ align-items: flex-start;
+}
+
+/* Bottom right position */
+#nt-container.nt-bottom-right {
+ align-items: flex-end;
+}
+
+/* Bottom center position */
+#nt-container.nt-bottom-center {
+ align-items: center;
+}
+
+/* Bottom left position */
+#nt-container.nt-bottom-left {
+ align-items: flex-start;
+}
+
+/* ==========================================================================
+Transitions
+========================================================================== */
+
+.nt-enter-active {
+ transition: all 0.3s ease-out;
+}
+
+#nt-container.nt-bottom-right .nt-enter-from,
+#nt-container.nt-bottom-left .nt-enter-from,
+#nt-container.nt-bottom-center .nt-enter-from {
+ transform: translateY(0.5rem);
+ opacity: 0;
+}
+
+#nt-container.nt-top-right .nt-enter-from,
+#nt-container.nt-top-left .nt-enter-from,
+#nt-container.nt-top-center .nt-enter-from {
+ transform: translateY(-0.5rem);
+ opacity: 0;
+}
+
+.nt-enter-to {
+ transform: translateY(0);
+ opacity: 1;
+}
+
+.nt-leave-active {
+ transition: all 0.3s ease-in;
+}
+
+.nt-leave-from {
+ transform: translateY(0);
+ opacity: 1;
+}
+
+#nt-container.nt-bottom-right .nt-leave-to,
+#nt-container.nt-bottom-left .nt-leave-to,
+#nt-container.nt-bottom-center .nt-enter-to {
+ transform: translateY(0.5rem);
+ opacity: 0;
+}
+
+#nt-container.nt-top-right .nt-leave-to,
+#nt-container.nt-top-left .nt-leave-to,
+#nt-container.nt-top-center .nt-enter-to {
+ transform: translateY(-0.5rem);
+ opacity: 0;
+}
+
+/* ==========================================================================
+Responsive
+========================================================================== */
+
+@media (max-width: 767px) {
+ #nt-container {
+ /* fit toasts to screen on mobile */
+ padding: 0;
+ }
+
+ #nt-container [role='alert'] {
+ width: 100%;
+ border-radius: 0;
+ }
+}
diff --git a/playground/assets/examples/index.ts b/playground/assets/examples/index.ts
new file mode 100644
index 0000000..e598aa5
--- /dev/null
+++ b/playground/assets/examples/index.ts
@@ -0,0 +1,33 @@
+export const plainExample = `
+
+
+
+`
diff --git a/playground/components/Hero.vue b/playground/components/Hero.vue
index d1d2a2c..3955a07 100644
--- a/playground/components/Hero.vue
+++ b/playground/components/Hero.vue
@@ -42,8 +42,9 @@
-
-
+ Nuxt 3 Ready
diff --git a/playground/components/Section.vue b/playground/components/Section.vue
index 59106cb..73cd210 100644
--- a/playground/components/Section.vue
+++ b/playground/components/Section.vue
@@ -1,6 +1,6 @@
diff --git a/playground/components/content/Anatomy.vue b/playground/components/content/Anatomy.vue
new file mode 100644
index 0000000..db4cac0
--- /dev/null
+++ b/playground/components/content/Anatomy.vue
@@ -0,0 +1,131 @@
+
+
+
+
+
+
+
+
+ With the rising of abstracted UI libraries like
+ Tailwind CSS , a
+ lot of developers realised they don't want to be forced in some UI
+ choices anymore. Nuxt Toaster does exactly that, it ships unstyled and
+ without a UI.
+
+
+
+
+ This behavior allows any developer to create his own set of toasts
+ without having to look the same from a project to another. Nuxt
+ Toaster provides
+ Theming options
+ as well as Tailwind and plain CSS based
+ examples .
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Toast icon
+
+
+
+
+
Nuxt has been installed!
+
+
+ Toast content
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/content/ExamplePlain.vue b/playground/components/content/ExamplePlain.vue
new file mode 100644
index 0000000..8ab46b5
--- /dev/null
+++ b/playground/components/content/ExamplePlain.vue
@@ -0,0 +1,373 @@
+
+
+
+
+
+
+
+
+
+
+
+
+ Nuxt Toaster provides a basic CSS stylesheet that you can import in
+ your project if you need prebuilt styles. Hit the invite button below
+ to start popping toasts.
+
+
+
+
+
+
+
+
+
+
+
+ Customize
+
+
+ Code sample
+
+
+
+
+
+
+
+
+
+ Play with the available options to customize content,
+ positionning, duration and toast colors.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Duration (ms)
+
+
+
+
+
+
+
+
+ There are more options to customize, take look at the
+ API docs
+ section.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/content/GetStarted.vue b/playground/components/content/GetStarted.vue
index 9ba69dc..f6a6e12 100644
--- a/playground/components/content/GetStarted.vue
+++ b/playground/components/content/GetStarted.vue
@@ -13,7 +13,7 @@ npm install --save-dev @cssninja/nuxt-toaster
-
+
-
+
+
+
+
+
+
+
+
+
+
+
+
+ Clarke D.
+
+
+ Software Engineer
+
+
+
+
+ Invite
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/pages/index.vue b/playground/pages/index.vue
index ec5d91b..842d92e 100644
--- a/playground/pages/index.vue
+++ b/playground/pages/index.vue
@@ -121,6 +121,10 @@ export default defineNuxtConfig({
+
+
+
+
Nuxt module playground!
From d636cd1f5a42138549818ebdcca5e304cd073664 Mon Sep 17 00:00:00 2001
From: Driss Chelouati
Date: Wed, 28 Sep 2022 13:10:05 +0100
Subject: [PATCH 07/16] fix: dark mode colors
---
.../components/content/ExamplePlain.vue | 30 +++++++++----------
1 file changed, 15 insertions(+), 15 deletions(-)
diff --git a/playground/components/content/ExamplePlain.vue b/playground/components/content/ExamplePlain.vue
index 8ab46b5..1af329c 100644
--- a/playground/components/content/ExamplePlain.vue
+++ b/playground/components/content/ExamplePlain.vue
@@ -17,10 +17,10 @@ const duration = 3000
-
+
Nuxt Toaster provides a basic CSS stylesheet that you can import in
your project if you need prebuilt styles. Hit the invite button below
to start popping toasts.
@@ -122,7 +122,7 @@ const duration = 3000
:class="
positionY === 'top'
? 'border-primary-500 bg-primary-500/10 text-primary-500'
- : 'text-muted-500 bg-white border-muted-200'
+ : 'text-muted-500 dark:text-muted-400 bg-white dark:bg-muted-800 border-muted-200 dark:border-muted-700'
"
>
Top
@@ -141,7 +141,7 @@ const duration = 3000
:class="
positionY === 'bottom'
? 'border-primary-500 bg-primary-500/10 text-primary-500'
- : 'text-muted-500 bg-white border-muted-200'
+ : 'text-muted-500 dark:text-muted-400 bg-white dark:bg-muted-800 border-muted-200 dark:border-muted-700'
"
>
Bottom
@@ -169,7 +169,7 @@ const duration = 3000
:class="
positionX === 'right'
? 'border-primary-500 bg-primary-500/10 text-primary-500'
- : 'text-muted-500 bg-white border-muted-200'
+ : 'text-muted-500 dark:text-muted-400 bg-white dark:bg-muted-800 border-muted-200 dark:border-muted-700'
"
>
Right
@@ -188,7 +188,7 @@ const duration = 3000
:class="
positionX === 'center'
? 'border-primary-500 bg-primary-500/10 text-primary-500'
- : 'text-muted-500 bg-white border-muted-200'
+ : 'text-muted-500 dark:text-muted-400 bg-white dark:bg-muted-800 border-muted-200 dark:border-muted-700'
"
>
Center
@@ -207,7 +207,7 @@ const duration = 3000
:class="
positionX === 'left'
? 'border-primary-500 bg-primary-500/10 text-primary-500'
- : 'text-muted-500 bg-white border-muted-200'
+ : 'text-muted-500 dark:text-muted-400 bg-white dark:bg-muted-800 border-muted-200 dark:border-muted-700'
"
>
Left
@@ -235,7 +235,7 @@ const duration = 3000
:class="
color === 'default'
? 'border-primary-500 bg-primary-500/10 text-primary-500'
- : 'text-muted-500 bg-white border-muted-200'
+ : 'text-muted-500 dark:text-muted-400 bg-white dark:bg-muted-800 border-muted-200 dark:border-muted-700'
"
>
Default
@@ -254,7 +254,7 @@ const duration = 3000
:class="
color === 'success'
? 'border-primary-500 bg-primary-500/10 text-primary-500'
- : 'text-muted-500 bg-white border-muted-200'
+ : 'text-muted-500 dark:text-muted-400 bg-white dark:bg-muted-800 border-muted-200 dark:border-muted-700'
"
>
Success
@@ -273,7 +273,7 @@ const duration = 3000
:class="
color === 'info'
? 'border-primary-500 bg-primary-500/10 text-primary-500'
- : 'text-muted-500 bg-white border-muted-200'
+ : 'text-muted-500 dark:text-muted-400 bg-white dark:bg-muted-800 border-muted-200 dark:border-muted-700'
"
>
Info
@@ -292,7 +292,7 @@ const duration = 3000
:class="
color === 'warning'
? 'border-primary-500 bg-primary-500/10 text-primary-500'
- : 'text-muted-500 bg-white border-muted-200'
+ : 'text-muted-500 dark:text-muted-400 bg-white dark:bg-muted-800 border-muted-200 dark:border-muted-700'
"
>
Warning
@@ -311,7 +311,7 @@ const duration = 3000
:class="
color === 'danger'
? 'border-primary-500 bg-primary-500/10 text-primary-500'
- : 'text-muted-500 bg-white border-muted-200'
+ : 'text-muted-500 dark:text-muted-400 bg-white dark:bg-muted-800 border-muted-200 dark:border-muted-700'
"
>
Danger
@@ -329,7 +329,7 @@ const duration = 3000
@@ -344,7 +344,7 @@ const duration = 3000
From e0f429a4548de0f82f573faf30eed0a2eed28cd3 Mon Sep 17 00:00:00 2001
From: Driss Chelouati
Date: Wed, 28 Sep 2022 15:52:00 +0100
Subject: [PATCH 08/16] feat: add custom example
---
playground/assets/examples/index.ts | 49 ++++
playground/components/content/Anatomy.vue | 8 +-
.../components/content/ExampleCustom.vue | 269 ++++++++++++++++++
.../components/content/ExamplePlain.vue | 6 +-
playground/components/doc/Code.vue | 11 +-
playground/components/mockup/Custom.vue | 116 ++++++++
playground/components/toast/Custom.vue | 50 ++++
playground/pages/index.vue | 2 +
8 files changed, 506 insertions(+), 5 deletions(-)
create mode 100644 playground/components/content/ExampleCustom.vue
create mode 100644 playground/components/mockup/Custom.vue
create mode 100644 playground/components/toast/Custom.vue
diff --git a/playground/assets/examples/index.ts b/playground/assets/examples/index.ts
index e598aa5..0b2953c 100644
--- a/playground/assets/examples/index.ts
+++ b/playground/assets/examples/index.ts
@@ -31,3 +31,52 @@ export const plainExample = `
}
`
+
+export const customExample = `
+
+`
diff --git a/playground/components/content/Anatomy.vue b/playground/components/content/Anatomy.vue
index db4cac0..caf04ba 100644
--- a/playground/components/content/Anatomy.vue
+++ b/playground/components/content/Anatomy.vue
@@ -40,7 +40,7 @@
class="group cursor-pointer relative w-full h-[380px] xs:h-[300px] flex items-center justify-center mx-auto"
>
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Nuxt Toaster can render other vue components as toasts. Create a
+ component, style it like you want and you're ready to pass it to Nuxt
+ toaster. The following example uses
+ Tailwind CSS .
+
+
+
+
+
+
+
+
+
+
+
+ Customize
+
+
+ Code sample
+
+
+
+
+
+
+
+
+
+ Play with the available options to customize content,
+ positionning, duration and toast colors.
+
+
+
+
+
+
+
+
+
+
+
+
+ Duration (ms)
+
+
+
+
+
+
+
+
+ There are more options to customize, take look at the
+ API docs
+ section.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/content/ExamplePlain.vue b/playground/components/content/ExamplePlain.vue
index 1af329c..5350e22 100644
--- a/playground/components/content/ExamplePlain.vue
+++ b/playground/components/content/ExamplePlain.vue
@@ -14,7 +14,9 @@ const duration = 3000
-
+
diff --git a/playground/components/doc/Code.vue b/playground/components/doc/Code.vue
index eb5b388..aaa843e 100644
--- a/playground/components/doc/Code.vue
+++ b/playground/components/doc/Code.vue
@@ -10,6 +10,7 @@ export interface DocCodeProps {
code: string
language?: string
file?: string
+ scrollable?: boolean
}
const props = withDefaults(defineProps
(), {
@@ -40,7 +41,10 @@ const props = withDefaults(defineProps(), {
props.file
}}
-
@@ -96,5 +100,10 @@ const props = withDefaults(defineProps
(), {
:deep(pre.language-javascript) {
color: #7eb6f6 !important;
}
+
+:deep(.scrollable pre[class*='language-']) {
+ max-height: 280px;
+ overflow-y: auto;
+}
\ No newline at end of file
diff --git a/playground/components/mockup/Custom.vue b/playground/components/mockup/Custom.vue
new file mode 100644
index 0000000..c189ba5
--- /dev/null
+++ b/playground/components/mockup/Custom.vue
@@ -0,0 +1,116 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Anna L.
+
+
Sales Manager
+
+
+
+ Poke
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/toast/Custom.vue b/playground/components/toast/Custom.vue
new file mode 100644
index 0000000..ffe4a3e
--- /dev/null
+++ b/playground/components/toast/Custom.vue
@@ -0,0 +1,50 @@
+
+
+
+
+
+
+ {{ props.title }}
+ {{ props.message }}
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/pages/index.vue b/playground/pages/index.vue
index 842d92e..06f5fcf 100644
--- a/playground/pages/index.vue
+++ b/playground/pages/index.vue
@@ -125,6 +125,8 @@ export default defineNuxtConfig({
+
+
Nuxt module playground!
From 1ec4bf6bca2b9e1a11b5027cfec8c38d37bf988d Mon Sep 17 00:00:00 2001
From: Driss Chelouati
Date: Wed, 28 Sep 2022 15:55:42 +0100
Subject: [PATCH 09/16] fix: custom example positionning
---
playground/components/mockup/Custom.vue | 10 ++++++++--
1 file changed, 8 insertions(+), 2 deletions(-)
diff --git a/playground/components/mockup/Custom.vue b/playground/components/mockup/Custom.vue
index c189ba5..394ee26 100644
--- a/playground/components/mockup/Custom.vue
+++ b/playground/components/mockup/Custom.vue
@@ -52,11 +52,17 @@ function showCustomToast() {
},
transition: {
enterActiveClass: 'transition-all duration-300 ease-out',
- enterFromClass: 'transform translate-y-1 opacity-0',
+ enterFromClass:
+ props.positionY === 'top'
+ ? 'transform -translate-y-1 opacity-0'
+ : 'transform translate-y-1 opacity-0',
enterToClass: 'transform translate-y-0 opacity-100',
leaveActiveClass: 'transition duration-300 ease-in',
leaveFromClass: 'transform translate-y-0 opacity-100',
- leaveToClass: 'transform translate-y-1 opacity-0',
+ leaveToClass:
+ props.positionY === 'top'
+ ? 'transform -translate-y-1 opacity-0'
+ : 'transform translate-y-1 opacity-0',
},
})
}
From 9a630a786910267f49e38403f2c10ee99300c47e Mon Sep 17 00:00:00 2001
From: Driss Chelouati
Date: Wed, 28 Sep 2022 22:02:56 +0100
Subject: [PATCH 10/16] feat: add advanced example, add footer
---
playground/app.vue | 1 +
playground/assets/examples/index.ts | 58 +++
playground/assets/img/cssninja.svg | 68 ++++
playground/components/AdvancedToast.vue | 2 +-
playground/components/Footer.vue | 61 +++
playground/components/content/Design.vue | 49 +++
.../components/content/ExampleAdvanced.vue | 360 ++++++++++++++++++
.../components/content/ExampleCustom.vue | 86 +++++
playground/components/mockup/Advanced.vue | 187 +++++++++
playground/components/mockup/Custom.vue | 6 +
playground/components/toast/ActionButtons.vue | 4 +-
playground/components/toast/Advanced.vue | 123 ++++++
playground/components/toast/Custom.vue | 4 +-
playground/components/toast/LabelInfo.vue | 2 +-
playground/nuxt.config.ts | 7 +
playground/pages/index.vue | 285 +-------------
16 files changed, 1015 insertions(+), 288 deletions(-)
create mode 100644 playground/assets/img/cssninja.svg
create mode 100644 playground/components/Footer.vue
create mode 100644 playground/components/content/Design.vue
create mode 100644 playground/components/content/ExampleAdvanced.vue
create mode 100644 playground/components/mockup/Advanced.vue
create mode 100644 playground/components/toast/Advanced.vue
diff --git a/playground/app.vue b/playground/app.vue
index e10d7b3..3ea7619 100644
--- a/playground/app.vue
+++ b/playground/app.vue
@@ -6,6 +6,7 @@ const { isDark } = useDarkmode()
+
diff --git a/playground/assets/examples/index.ts b/playground/assets/examples/index.ts
index 0b2953c..794a190 100644
--- a/playground/assets/examples/index.ts
+++ b/playground/assets/examples/index.ts
@@ -80,3 +80,61 @@ export const customExample = `
}
`
+
+export const advancedExample = `
+
+`
diff --git a/playground/assets/img/cssninja.svg b/playground/assets/img/cssninja.svg
new file mode 100644
index 0000000..ede37ab
--- /dev/null
+++ b/playground/assets/img/cssninja.svg
@@ -0,0 +1,68 @@
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/playground/components/AdvancedToast.vue b/playground/components/AdvancedToast.vue
index 92eb32a..6cc825f 100644
--- a/playground/components/AdvancedToast.vue
+++ b/playground/components/AdvancedToast.vue
@@ -15,7 +15,7 @@ const { percent, closeIn, endAt } = useNinjaToasterProgress()
diff --git a/playground/components/Footer.vue b/playground/components/Footer.vue
new file mode 100644
index 0000000..6840c1b
--- /dev/null
+++ b/playground/components/Footer.vue
@@ -0,0 +1,61 @@
+
+
+
+
+
+
+ Made with
+
+
+
+
+ by
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/content/Design.vue b/playground/components/content/Design.vue
new file mode 100644
index 0000000..ff9718f
--- /dev/null
+++ b/playground/components/content/Design.vue
@@ -0,0 +1,49 @@
+
+
+
+
+
+ Custom Experience
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/content/ExampleAdvanced.vue b/playground/components/content/ExampleAdvanced.vue
new file mode 100644
index 0000000..2d70eeb
--- /dev/null
+++ b/playground/components/content/ExampleAdvanced.vue
@@ -0,0 +1,360 @@
+
+
+
+
+
+
+
+
+
+
+
+
+ Nuxt Toaster can render completely custom UI elements. It extends the
+ Toast's role and lets it act like a popup or a dialog. The following
+ example uses
+ Tailwind CSS .
+
+
+
+
+
+
+
+
+
+
+
+ Customize
+
+
+ Code sample
+
+
+
+
+
+
+
+
+
+ Play with the available options to customize content,
+ positionning, duration and toast colors.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Duration (ms)
+
+
+
+
+
+
+
+
+ There are more options to customize, take look at the
+ API docs
+ section.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/content/ExampleCustom.vue b/playground/components/content/ExampleCustom.vue
index 073ee94..5ecd035 100644
--- a/playground/components/content/ExampleCustom.vue
+++ b/playground/components/content/ExampleCustom.vue
@@ -5,6 +5,7 @@ const activeTab = ref('tab-1')
const positionY = ref('top')
const positionX = ref('right')
+const color = ref('info')
const message = ref('You just poked Anna!')
const duration = 3000
@@ -48,6 +49,7 @@ const duration = 3000
@@ -215,6 +217,90 @@ const duration = 3000
+
+
diff --git a/playground/components/mockup/Advanced.vue b/playground/components/mockup/Advanced.vue
new file mode 100644
index 0000000..2ea76e4
--- /dev/null
+++ b/playground/components/mockup/Advanced.vue
@@ -0,0 +1,187 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Jerry K.
+
+
Scrum Master
+
+
+
+ Hire
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/mockup/Custom.vue b/playground/components/mockup/Custom.vue
index 394ee26..18f9b7f 100644
--- a/playground/components/mockup/Custom.vue
+++ b/playground/components/mockup/Custom.vue
@@ -8,6 +8,7 @@ export interface CustomProps {
positionX?: string
message?: string
duration?: number
+ color?: string
}
const props = withDefaults(defineProps(), {
@@ -15,6 +16,7 @@ const props = withDefaults(defineProps(), {
positionX: 'right',
message: '',
duration: 5000,
+ color: 'info',
})
const { $nt } = useNuxtApp()
@@ -46,6 +48,10 @@ function showCustomToast() {
props.positionX === 'left' ? 'items-start' : '',
props.positionX === 'center' ? 'items-center' : '',
props.positionX === 'right' ? 'items-end' : '',
+ props.color === 'info' ? 'text-sky-500' : '',
+ props.color === 'success' ? 'text-teal-500' : '',
+ props.color === 'warning' ? 'text-yellow-500' : '',
+ props.color === 'danger' ? 'text-rose-500' : '',
'gap-2',
].join(' '),
wrapperClass: 'w-full md:max-w-xs pointer-events-auto cursor-pointer',
diff --git a/playground/components/toast/ActionButtons.vue b/playground/components/toast/ActionButtons.vue
index 7e8be7e..896a88c 100644
--- a/playground/components/toast/ActionButtons.vue
+++ b/playground/components/toast/ActionButtons.vue
@@ -4,13 +4,13 @@
>
Dismiss
Accept
diff --git a/playground/components/toast/Advanced.vue b/playground/components/toast/Advanced.vue
new file mode 100644
index 0000000..6b23e35
--- /dev/null
+++ b/playground/components/toast/Advanced.vue
@@ -0,0 +1,123 @@
+
+
+
+
+
+
+
+
+
+
Jerry K.
+
Scrum Master
+
+
+
+ Jerry is a talented Scrum Master looking for new opportunities.
+
+
+
+
+ View Profile
+
+
+ Hire Now
+
+
+
+
+
+
+ See some code behind it
+
+
+
+
+
+
+
+
+ This closes the toast
+
+
+
+
+
+ {{ props.message }}
+
+
+
+
+
+
+
Duration
+
{{ { percent, closeIn, endAt } }}
+
+
+
+
+
+ Back to toast content
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/toast/Custom.vue b/playground/components/toast/Custom.vue
index ffe4a3e..69d5ce5 100644
--- a/playground/components/toast/Custom.vue
+++ b/playground/components/toast/Custom.vue
@@ -7,10 +7,10 @@ const props = defineProps<{
@@ -127,177 +17,8 @@ export default defineNuxtConfig({
-
-
-
Nuxt module playground!
-
- show basic toast
-
-
- show custom toast
-
-
- show advanced toast
-
-
- clear advanced toasts
-
-
- clear all toast
-
-
-
+
+
+
-
-
From 973bf192e8ca075dcdeb32544a639d5121f2e9e6 Mon Sep 17 00:00:00 2001
From: Driss Chelouati
Date: Wed, 28 Sep 2022 22:51:04 +0100
Subject: [PATCH 11/16] feat: add end section
---
package.json | 1 +
playground/components/Navigation.vue | 10 +++--
playground/components/content/Anatomy.vue | 16 +++++---
playground/components/content/Design.vue | 28 +++++++++++++-
playground/components/toast/IconDanger.vue | 29 +++++++++++++++
playground/components/toast/LabelWarning.vue | 26 +++++++++++++
playground/components/toast/UserLikeClose.vue | 37 +++++++++++++++++++
playground/pages/index.vue | 2 +-
pnpm-lock.yaml | 12 ++++++
9 files changed, 148 insertions(+), 13 deletions(-)
create mode 100644 playground/components/toast/IconDanger.vue
create mode 100644 playground/components/toast/LabelWarning.vue
create mode 100644 playground/components/toast/UserLikeClose.vue
diff --git a/package.json b/package.json
index 63cb2ff..c9cd497 100644
--- a/package.json
+++ b/package.json
@@ -43,6 +43,7 @@
"prism-theme-vars": "0.2.3",
"prismjs": "1.28.0",
"vue-prism-component": "2.0.0",
+ "vue-scrollto": "^2.20.0",
"standard-version": "^9.5.0"
}
}
diff --git a/playground/components/Navigation.vue b/playground/components/Navigation.vue
index 52a3cfa..820f3ff 100644
--- a/playground/components/Navigation.vue
+++ b/playground/components/Navigation.vue
@@ -1,4 +1,5 @@
@@ -61,10 +63,10 @@ const isChecked = ref(false)
@@ -46,11 +55,6 @@
v-for="index in 144"
:key="index"
class="border border-muted-200 dark:border-muted-800"
- :class="[
- //index <= 12 && 'border-t-0',
- //index >= 133 && 'border-b-0',
- //index === 0 && '!border-l-0',
- ]"
>
diff --git a/playground/components/content/Design.vue b/playground/components/content/Design.vue
index ff9718f..2aa1c50 100644
--- a/playground/components/content/Design.vue
+++ b/playground/components/content/Design.vue
@@ -14,14 +14,23 @@
-
+
+
+
+
+ Get started with the docs
+
\ No newline at end of file
diff --git a/playground/components/toast/IconDanger.vue b/playground/components/toast/IconDanger.vue
new file mode 100644
index 0000000..42c7647
--- /dev/null
+++ b/playground/components/toast/IconDanger.vue
@@ -0,0 +1,29 @@
+
+
+
+
Something went wrong!
+
+
\ No newline at end of file
diff --git a/playground/components/toast/LabelWarning.vue b/playground/components/toast/LabelWarning.vue
new file mode 100644
index 0000000..1406608
--- /dev/null
+++ b/playground/components/toast/LabelWarning.vue
@@ -0,0 +1,26 @@
+
+
+
+
+ Power level is critical!
+
+
+
\ No newline at end of file
diff --git a/playground/components/toast/UserLikeClose.vue b/playground/components/toast/UserLikeClose.vue
new file mode 100644
index 0000000..133486c
--- /dev/null
+++ b/playground/components/toast/UserLikeClose.vue
@@ -0,0 +1,37 @@
+
+
+
+
+
+
+ Aaron S.
+ Liked your reply
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/playground/pages/index.vue b/playground/pages/index.vue
index 0cd9762..718875d 100644
--- a/playground/pages/index.vue
+++ b/playground/pages/index.vue
@@ -13,7 +13,7 @@
-
+
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index b48b6b5..3041585 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -19,6 +19,7 @@ specifiers:
prismjs: 1.28.0
standard-version: ^9.5.0
vue-prism-component: 2.0.0
+ vue-scrollto: ^2.20.0
dependencies:
'@nuxt/kit': 3.0.0-rc.11
@@ -41,6 +42,7 @@ devDependencies:
prismjs: 1.28.0
standard-version: 9.5.0
vue-prism-component: 2.0.0
+ vue-scrollto: 2.20.0
packages:
@@ -1657,6 +1659,10 @@ packages:
resolution: {integrity: sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==}
dev: true
+ /bezier-easing/2.1.0:
+ resolution: {integrity: sha512-gbIqZ/eslnUFC1tjEvtz0sgx+xTK20wDnYMIA27VA04R7w6xxXQPZDbibjA9DTWZRA2CXtwHykkVzlCaAJAZig==}
+ dev: true
+
/big.js/5.2.2:
resolution: {integrity: sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==}
dev: true
@@ -7844,6 +7850,12 @@ packages:
vue: 3.2.39
dev: true
+ /vue-scrollto/2.20.0:
+ resolution: {integrity: sha512-7i+AGKJTThZnMEkhIPgrZjyAX+fXV7/rGdg+CV283uZZwCxwiMXaBLTmIc5RTA4uwGnT+E6eJle3mXQfM2OD3A==}
+ dependencies:
+ bezier-easing: 2.1.0
+ dev: true
+
/vue/3.2.39:
resolution: {integrity: sha512-tRkguhRTw9NmIPXhzk21YFBqXHT2t+6C6wPOgQ50fcFVWnPdetmRqbmySRHznrYjX2E47u0cGlKGcxKZJ38R/g==}
dependencies:
From 9b5d35477f997722e8164343538d418380f2312b Mon Sep 17 00:00:00 2001
From: Driss Chelouati
Date: Thu, 29 Sep 2022 02:21:08 +0100
Subject: [PATCH 12/16] feat: add hero random toasts
---
playground/assets/css/main.css | 1 +
playground/assets/css/modules/nt.css | 2 +
playground/assets/css/modules/utilities.css | 5 ++
playground/components/Hero.vue | 58 ++++++++++++++++++-
.../components/content/ExamplePlain.vue | 14 ++---
5 files changed, 72 insertions(+), 8 deletions(-)
create mode 100644 playground/assets/css/modules/utilities.css
diff --git a/playground/assets/css/main.css b/playground/assets/css/main.css
index 95e9847..d56011e 100644
--- a/playground/assets/css/main.css
+++ b/playground/assets/css/main.css
@@ -1,3 +1,4 @@
+@import './modules/utilities.css';
@import './modules/accessibility.css';
@import './modules/nt.css';
diff --git a/playground/assets/css/modules/nt.css b/playground/assets/css/modules/nt.css
index 949870b..4296f83 100644
--- a/playground/assets/css/modules/nt.css
+++ b/playground/assets/css/modules/nt.css
@@ -27,6 +27,8 @@ Base
left: 0;
right: 0;
bottom: 0;
+ width: 100%;
+ height: 100%;
overflow: hidden;
z-index: 100;
pointer-events: none;
diff --git a/playground/assets/css/modules/utilities.css b/playground/assets/css/modules/utilities.css
new file mode 100644
index 0000000..4a3f593
--- /dev/null
+++ b/playground/assets/css/modules/utilities.css
@@ -0,0 +1,5 @@
+@layer utilities {
+ .button-loading {
+ @apply relative !text-transparent after:absolute after:h-5 after:w-5 after:rounded-full after:border-[0.20rem] after:border-slate-300 after:border-t-gray-100 after:opacity-90 after:animate-spin;
+ }
+}
diff --git a/playground/components/Hero.vue b/playground/components/Hero.vue
index 3955a07..4afcef8 100644
--- a/playground/components/Hero.vue
+++ b/playground/components/Hero.vue
@@ -1,3 +1,53 @@
+
+
Try Me
diff --git a/playground/components/content/ExamplePlain.vue b/playground/components/content/ExamplePlain.vue
index 5350e22..c444b6a 100644
--- a/playground/components/content/ExamplePlain.vue
+++ b/playground/components/content/ExamplePlain.vue
@@ -3,7 +3,7 @@ import { plainExample } from '@/assets/examples'
const activeTab = ref('tab-1')
-const positionY = ref('top')
+const positionY = ref('bottom')
const positionX = ref('right')
const color = ref('default')
const message = ref('You invited Clarke!')
@@ -163,18 +163,18 @@ const duration = 3000
v-model="positionX"
type="radio"
name="x_position"
- value="right"
+ value="left"
class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer z-10"
/>
- Right
+ Left
@@ -201,18 +201,18 @@ const duration = 3000
v-model="positionX"
type="radio"
name="x_position"
- value="left"
+ value="right"
class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer z-10"
/>
- Left
+ Right
From 743aa67371a18835ded503ebaab2392e2943bda3 Mon Sep 17 00:00:00 2001
From: Driss Chelouati
Date: Thu, 29 Sep 2022 09:48:57 +0100
Subject: [PATCH 13/16] fix: example buttons
---
.../components/content/ExampleAdvanced.vue | 48 +++++++++----------
.../components/content/ExampleCustom.vue | 48 +++++++++----------
.../components/content/ExamplePlain.vue | 40 ++++++++--------
3 files changed, 68 insertions(+), 68 deletions(-)
diff --git a/playground/components/content/ExampleAdvanced.vue b/playground/components/content/ExampleAdvanced.vue
index 2d70eeb..6361d6c 100644
--- a/playground/components/content/ExampleAdvanced.vue
+++ b/playground/components/content/ExampleAdvanced.vue
@@ -121,10 +121,10 @@ const duration = 3000
type="radio"
name="y_position"
value="top"
- class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer z-10"
+ class="peer absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer z-10"
/>
- Right
+ Left
@@ -187,10 +187,10 @@ const duration = 3000
type="radio"
name="x_position"
value="center"
- class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer z-10"
+ class="peer absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer z-10"
/>
- Left
+ Right
@@ -234,10 +234,10 @@ const duration = 3000
type="radio"
name="t_color"
value="success"
- class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer z-10"
+ class="peer absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer z-10"
/>
- Right
+ Left
@@ -182,10 +182,10 @@ const duration = 3000
type="radio"
name="x_position"
value="center"
- class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer z-10"
+ class="peer absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer z-10"
/>
- Left
+ Right
@@ -229,10 +229,10 @@ const duration = 3000
type="radio"
name="t_color"
value="success"
- class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer z-10"
+ class="peer absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer z-10"
/>
@@ -44,6 +46,77 @@ const scrollTo = VueScrollTo.scrollTo
+
+
+
+
+
+ Unstyled
+
+
+ CSS Styled
+
+
+ Custom UI
+
+
+
+
+
+ Nuxt Toaster is a toast engine, meaning that it primarily delivers
+ unstyled toast elements. Styling is done separatly
+ via CSS and / or theming options.
+
+
+ If you need basic styles Nuxt Toaster provides prebuilt
+ CSS presets that you can import into your project to
+ enable a basic set of styles.
+
+
+ As a rendering engine Nuxt Toaster can render external components that
+ can also receive data and properties from the toast container itself.
+
+
+
+
-
+
+
+
+
Nuxt has been installed!
+
+
+ Unstyled content
+
+
+
+
+
+
+
+
+
Nuxt has been installed!
+
+
+ Styled content
+
+
+
+
+
+
@@ -135,5 +253,39 @@ const scrollTo = VueScrollTo.scrollTo
+
+
+
+
+
+
+
+
+
+
+ Important note
+
+
+ Please keep in mind that Nuxt Toaster is a
+ toast rendering engine and not a classic toasting
+ library that ships with prebuilt styles. Styles presets and custom
+ examples are provided for inspiration, so you can build you own.
+
+
+
+
\ No newline at end of file
diff --git a/playground/components/mockup/Advanced.vue b/playground/components/mockup/Advanced.vue
index 2ea76e4..3a92889 100644
--- a/playground/components/mockup/Advanced.vue
+++ b/playground/components/mockup/Advanced.vue
@@ -22,57 +22,6 @@ const props = withDefaults(defineProps
(), {
const { $nt } = useNuxtApp()
let i = 0
-/* function showCustomToast() {
- i++
- $nt.show({
- content: () =>
- h(ToastCustom, {
- title: 'Hi there',
- message: `You just poked Anna!`,
- }),
- duration: props.duration,
- maxToasts: 5,
- theme: {
- containerId: 'nt-container-custom',
- containerClass: [
- 'fixed',
- 'top-0',
- 'inset-0',
- 'h-full',
- 'w-full',
- 'pointer-events-none',
- 'md:p-4',
- 'flex',
- 'z-[100]',
- props.positionY === 'top' ? 'flex-col' : 'flex-col-reverse',
- props.positionX === 'left' ? 'items-start' : '',
- props.positionX === 'center' ? 'items-center' : '',
- props.positionX === 'right' ? 'items-end' : '',
- props.color === 'info' ? 'text-sky-500' : '',
- props.color === 'success' ? 'text-teal-500' : '',
- props.color === 'warning' ? 'text-yellow-500' : '',
- props.color === 'danger' ? 'text-rose-500' : '',
- 'gap-2',
- ].join(' '),
- wrapperClass: 'w-full md:max-w-xs pointer-events-auto cursor-pointer',
- },
- transition: {
- enterActiveClass: 'transition-all duration-300 ease-out',
- enterFromClass:
- props.positionY === 'top'
- ? 'transform -translate-y-1 opacity-0'
- : 'transform translate-y-1 opacity-0',
- enterToClass: 'transform translate-y-0 opacity-100',
- leaveActiveClass: 'transition duration-300 ease-in',
- leaveFromClass: 'transform translate-y-0 opacity-100',
- leaveToClass:
- props.positionY === 'top'
- ? 'transform -translate-y-1 opacity-0'
- : 'transform translate-y-1 opacity-0',
- },
- })
-} */
-
async function showAdvancedToast() {
i++
const toast = await $nt.show({
@@ -135,7 +84,7 @@ async function showAdvancedToast() {
-
diff --git a/playground/components/mockup/Basic.vue b/playground/components/mockup/Basic.vue
index e198584..14b1e8d 100644
--- a/playground/components/mockup/Basic.vue
+++ b/playground/components/mockup/Basic.vue
@@ -44,7 +44,7 @@ function showBasicToast() {
-
diff --git a/playground/components/mockup/Custom.vue b/playground/components/mockup/Custom.vue
index 18f9b7f..7e40052 100644
--- a/playground/components/mockup/Custom.vue
+++ b/playground/components/mockup/Custom.vue
@@ -76,7 +76,7 @@ function showCustomToast() {
-
diff --git a/playground/pages/api.vue b/playground/pages/api.vue
index 2e3d649..9d5d0b1 100644
--- a/playground/pages/api.vue
+++ b/playground/pages/api.vue
@@ -1,3 +1,10 @@
+
+
- API page
+
\ No newline at end of file
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 3041585..1bf4fbe 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -20,6 +20,7 @@ specifiers:
standard-version: ^9.5.0
vue-prism-component: 2.0.0
vue-scrollto: ^2.20.0
+ vue3-markdown-it: ^1.0.10
dependencies:
'@nuxt/kit': 3.0.0-rc.11
@@ -43,6 +44,7 @@ devDependencies:
standard-version: 9.5.0
vue-prism-component: 2.0.0
vue-scrollto: 2.20.0
+ vue3-markdown-it: 1.0.10
packages:
@@ -2733,6 +2735,10 @@ packages:
tapable: 2.2.1
dev: true
+ /entities/2.1.0:
+ resolution: {integrity: sha512-hCx1oky9PFrJ611mf0ifBLBRW8lUUVRlFolb5gWRfIELabBlbp9xZvrqZLZAs+NxFnbfQoeGd8wDkygjg7U85w==}
+ dev: true
+
/entities/2.2.0:
resolution: {integrity: sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==}
dev: true
@@ -4175,6 +4181,11 @@ packages:
/hash-sum/2.0.0:
resolution: {integrity: sha512-WdZTbAByD+pHfl/g9QSsBIIwy8IT+EsPiKDs0KNX+zSHhdDLFKdZu0BQHljvO+0QI/BasbMSUa8wYNCZTvhslg==}
+ /highlight.js/11.6.0:
+ resolution: {integrity: sha512-ig1eqDzJaB0pqEvlPVIpSSyMaO92bH1N2rJpLMN/nX396wTpDA4Eq0uK+7I/2XG17pFaaKE0kjV/XPeGt7Evjw==}
+ engines: {node: '>=12.0.0'}
+ dev: true
+
/hookable/5.3.0:
resolution: {integrity: sha512-4gTA2q08HT8G32uIW7Jpro3rSXgT2ZTM8R6+r7H7joq90eZlqFPPTvHD6w8WZUohIrbXbDperL96ilb6dkNxNw==}
dev: true
@@ -4813,6 +4824,12 @@ packages:
resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==}
dev: true
+ /linkify-it/3.0.3:
+ resolution: {integrity: sha512-ynTsyrFSdE5oZ/O9GEf00kPngmOfVwazR5GKDq6EYfhlpFug3J2zybX56a2PRRpc9P+FuSoGNAwjlbDs9jJBPQ==}
+ dependencies:
+ uc.micro: 1.0.6
+ dev: true
+
/listhen/0.2.15:
resolution: {integrity: sha512-F/IWj/aJLeokHAIVY+l3JoWRUnbRaf2F0cr+Ybc1YyozMA/yP0C2nf3c0Oi7vAbFvtfiwfWWfP7bIrQc/u5L1A==}
dependencies:
@@ -4910,6 +4927,10 @@ packages:
resolution: {integrity: sha512-C5N2Z3DgnnKr0LOpv/hKCgKdb7ZZwafIrsesve6lmzvZIRZRGaZ/l6Q8+2W7NaT+ZwO3fFlSCzCzrDCFdJfZ4g==}
dev: true
+ /lodash.flow/3.5.0:
+ resolution: {integrity: sha512-ff3BX/tSioo+XojX4MOsOMhJw0nZoUEF011LX8g8d3gvjVbxd89cCio4BCXronjxcTUIJUoqKEUA+n4CqvvRPw==}
+ dev: true
+
/lodash.isarguments/3.1.0:
resolution: {integrity: sha512-chi4NHZlZqZD18a0imDHnZPrDeBbTtVN7GXMwuGdRH9qotxAjYs3aVLKc7zNOG9eddR5Ksd8rvFEBc9SsggPpg==}
dev: true
@@ -5000,6 +5021,73 @@ packages:
engines: {node: '>=8'}
dev: true
+ /markdown-it-abbr/1.0.4:
+ resolution: {integrity: sha512-ZeA4Z4SaBbYysZap5iZcxKmlPL6bYA8grqhzJIHB1ikn7njnzaP8uwbtuXc4YXD5LicI4/2Xmc0VwmSiFV04gg==}
+ dev: true
+
+ /markdown-it-anchor/8.6.5_markdown-it@12.3.2:
+ resolution: {integrity: sha512-PI1qEHHkTNWT+X6Ip9w+paonfIQ+QZP9sCeMYi47oqhH+EsW8CrJ8J7CzV19QVOj6il8ATGbK2nTECj22ZHGvQ==}
+ peerDependencies:
+ '@types/markdown-it': '*'
+ markdown-it: '*'
+ dependencies:
+ markdown-it: 12.3.2
+ dev: true
+
+ /markdown-it-deflist/2.1.0:
+ resolution: {integrity: sha512-3OuqoRUlSxJiuQYu0cWTLHNhhq2xtoSFqsZK8plANg91+RJQU1ziQ6lA2LzmFAEes18uPBsHZpcX6We5l76Nzg==}
+ dev: true
+
+ /markdown-it-emoji/2.0.2:
+ resolution: {integrity: sha512-zLftSaNrKuYl0kR5zm4gxXjHaOI3FAOEaloKmRA5hijmJZvSjmxcokOLlzycb/HXlUFWzXqpIEoyEMCE4i9MvQ==}
+ dev: true
+
+ /markdown-it-footnote/3.0.3:
+ resolution: {integrity: sha512-YZMSuCGVZAjzKMn+xqIco9d1cLGxbELHZ9do/TSYVzraooV8ypsppKNmUJ0fVH5ljkCInQAtFpm8Rb3eXSrt5w==}
+ dev: true
+
+ /markdown-it-highlightjs/3.6.0:
+ resolution: {integrity: sha512-ex+Lq3cVkprh0GpGwFyc53A/rqY6GGzopPCG1xMsf8Ya3XtGC8Uw9tChN1rWbpyDae7tBBhVHVcMM29h4Btamw==}
+ dependencies:
+ highlight.js: 11.6.0
+ lodash.flow: 3.5.0
+ dev: true
+
+ /markdown-it-ins/3.0.1:
+ resolution: {integrity: sha512-32SSfZqSzqyAmmQ4SHvhxbFqSzPDqsZgMHDwxqPzp+v+t8RsmqsBZRG+RfRQskJko9PfKC2/oxyOs4Yg/CfiRw==}
+ dev: true
+
+ /markdown-it-mark/3.0.1:
+ resolution: {integrity: sha512-HyxjAu6BRsdt6Xcv6TKVQnkz/E70TdGXEFHRYBGLncRE9lBFwDNLVtFojKxjJWgJ+5XxUwLaHXy+2sGBbDn+4A==}
+ dev: true
+
+ /markdown-it-sub/1.0.0:
+ resolution: {integrity: sha512-z2Rm/LzEE1wzwTSDrI+FlPEveAAbgdAdPhdWarq/ZGJrGW/uCQbKAnhoCsE4hAbc3SEym26+W2z/VQB0cQiA9Q==}
+ dev: true
+
+ /markdown-it-sup/1.0.0:
+ resolution: {integrity: sha512-E32m0nV9iyhRR7CrhnzL5msqic7rL1juWre6TQNxsnApg7Uf+F97JOKxUijg5YwXz86lZ0mqfOnutoryyNdntQ==}
+ dev: true
+
+ /markdown-it-task-lists/2.1.1:
+ resolution: {integrity: sha512-TxFAc76Jnhb2OUu+n3yz9RMu4CwGfaT788br6HhEDlvWfdeJcLUsxk1Hgw2yJio0OXsxv7pyIPmvECY7bMbluA==}
+ dev: true
+
+ /markdown-it-toc-done-right/4.2.0:
+ resolution: {integrity: sha512-UB/IbzjWazwTlNAX0pvWNlJS8NKsOQ4syrXZQ/C72j+jirrsjVRT627lCaylrKJFBQWfRsPmIVQie8x38DEhAQ==}
+ dev: true
+
+ /markdown-it/12.3.2:
+ resolution: {integrity: sha512-TchMembfxfNVpHkbtriWltGWc+m3xszaRD0CZup7GFFhzIgQqxIfn3eGj1yZpfuflzPvfkt611B2Q/Bsk1YnGg==}
+ hasBin: true
+ dependencies:
+ argparse: 2.0.1
+ entities: 2.1.0
+ linkify-it: 3.0.3
+ mdurl: 1.0.1
+ uc.micro: 1.0.6
+ dev: true
+
/mdast-util-from-markdown/0.8.5:
resolution: {integrity: sha512-2hkTXtYYnr+NubD/g6KGBS/0mFmBcifAsI0yIWRiRo0PjVs6SSOSOdtzbp6kSGnShDN6G5aWZpKQ2lWRy27mWQ==}
dependencies:
@@ -5020,6 +5108,10 @@ packages:
resolution: {integrity: sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==}
dev: true
+ /mdurl/1.0.1:
+ resolution: {integrity: sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g==}
+ dev: true
+
/media-typer/0.3.0:
resolution: {integrity: sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==}
engines: {node: '>= 0.6'}
@@ -7356,6 +7448,10 @@ packages:
hasBin: true
dev: true
+ /uc.micro/1.0.6:
+ resolution: {integrity: sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA==}
+ dev: true
+
/ufo/0.8.5:
resolution: {integrity: sha512-e4+UtA5IRO+ha6hYklwj6r7BjiGMxS0O+UaSg9HbaTefg4kMkzj4tXzEBajRR+wkxf+golgAWKzLbytCUDMJAA==}
@@ -7866,6 +7962,26 @@ packages:
'@vue/shared': 3.2.39
dev: true
+ /vue3-markdown-it/1.0.10:
+ resolution: {integrity: sha512-mTvHu0zl7jrh7ojgaZ+tTpCLiS4CVg4bTgTu4KGhw/cRRY5YgIG8QgFAPu6kCzSW6Znc9a52Beb6hFvF4hSMkQ==}
+ dependencies:
+ markdown-it: 12.3.2
+ markdown-it-abbr: 1.0.4
+ markdown-it-anchor: 8.6.5_markdown-it@12.3.2
+ markdown-it-deflist: 2.1.0
+ markdown-it-emoji: 2.0.2
+ markdown-it-footnote: 3.0.3
+ markdown-it-highlightjs: 3.6.0
+ markdown-it-ins: 3.0.1
+ markdown-it-mark: 3.0.1
+ markdown-it-sub: 1.0.0
+ markdown-it-sup: 1.0.0
+ markdown-it-task-lists: 2.1.1
+ markdown-it-toc-done-right: 4.2.0
+ transitivePeerDependencies:
+ - '@types/markdown-it'
+ dev: true
+
/wcwidth/1.0.1:
resolution: {integrity: sha512-XHPEwS0q6TaxcvG85+8EYkbiCux2XtWG2mkc47Ng2A77BQu9+DqIOJldST4HgPkuea7dvKSj5VgX3P1d4rW8Tg==}
dependencies:
From 3a72849f1039787299d885ac29142b493fe730df Mon Sep 17 00:00:00 2001
From: Driss Chelouati
Date: Thu, 29 Sep 2022 14:12:20 +0100
Subject: [PATCH 15/16] fix: fix default unstyled toast not showing
---
playground/components/content/Anatomy.vue | 6 +++---
1 file changed, 3 insertions(+), 3 deletions(-)
diff --git a/playground/components/content/Anatomy.vue b/playground/components/content/Anatomy.vue
index 8e5ae22..603633c 100644
--- a/playground/components/content/Anatomy.vue
+++ b/playground/components/content/Anatomy.vue
@@ -2,7 +2,7 @@
import VueScrollTo from 'vue-scrollto'
const scrollTo = VueScrollTo.scrollTo
-const activeTab = ref('custom')
+const activeTab = ref('unstyled')
@@ -103,7 +103,7 @@ const activeTab = ref('custom')
v-else-if="activeTab === 'styled'"
class="text-sm text-muted-500 dark:text-muted-400"
>
- If you need basic styles Nuxt Toaster provides prebuilt
+ If you need basic styling, Nuxt Toaster provides prebuilt
CSS presets that you can import into your project to
enable a basic set of styles.
@@ -256,7 +256,7 @@ const activeTab = ref('custom')
Date: Thu, 29 Sep 2022 14:17:45 +0100
Subject: [PATCH 16/16] fix: typos
---
playground/components/content/Anatomy.vue | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/playground/components/content/Anatomy.vue b/playground/components/content/Anatomy.vue
index 603633c..18126e7 100644
--- a/playground/components/content/Anatomy.vue
+++ b/playground/components/content/Anatomy.vue
@@ -96,7 +96,7 @@ const activeTab = ref('unstyled')
class="text-sm text-muted-500 dark:text-muted-400"
>
Nuxt Toaster is a toast engine, meaning that it primarily delivers
- unstyled toast elements. Styling is done separatly
+ unstyled toast elements. Styling is done separately
via CSS and / or theming options.
toast rendering engine and not a classic toasting
library that ships with prebuilt styles. Styles presets and custom
- examples are provided for inspiration, so you can build you own.
+ examples are provided for inspiration, so you can build your own.