Niklas/shadcn-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs: adding dark-mode setup page (#384)

Browse Source
This commit is contained in:
Saeid Zareie 2024-03-07 16:33:49 +03:30 committed by GitHub
parent b516995e15
commit e817da4b8b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
11 changed files with 425 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
apps/www/.vitepress/theme/config/docs.ts
View File

@ -68,6 +68,11 @@ export const docsConfig: DocsConfig = {
href: '/docs/theming', href: '/docs/theming',
items: [], items: [],
}, },
{
title: 'Dark Mode',
href: '/docs/dark-mode',
items: [],
},
{ {
title: 'CLI', title: 'CLI',
href: '/docs/cli', href: '/docs/cli',

1
apps/www/.vitepress/theme/index.ts
View File

@ -1,4 +1,3 @@
/* eslint-disable vue/component-definition-name-casing */
// https://vitepress.dev/guide/custom-theme // https://vitepress.dev/guide/custom-theme
import Layout from './layout/MainLayout.vue' import Layout from './layout/MainLayout.vue'
import DocsLayout from './layout/DocsLayout.vue' import DocsLayout from './layout/DocsLayout.vue'

13
apps/www/package.json
View File

@ -30,25 +30,26 @@
"embla-carousel": "^8.0.0", "embla-carousel": "^8.0.0",
"embla-carousel-autoplay": "^8.0.0", "embla-carousel-autoplay": "^8.0.0",
"embla-carousel-vue": "^8.0.0", "embla-carousel-vue": "^8.0.0",
"lucide-vue-next": "^0.276.0", "lucide-vue-next": "^0.350.0",
"radix-vue": "^1.5.0", "radix-vue": "^1.5.0",
"tailwindcss-animate": "^1.0.7", "tailwindcss-animate": "^1.0.7",
"v-calendar": "^3.1.2", "v-calendar": "^3.1.2",
"vaul-vue": "^0.1.0", "vaul-vue": "^0.1.0",
"vee-validate": "4.12.5", "vee-validate": "4.12.5",
"vue": "^3.4.21", "vue": "^3.4.21",
"vue-sonner": "^1.1.1", "vue-sonner": "^1.1.2",
"vue-wrap-balancer": "^1.1.3", "vue-wrap-balancer": "^1.1.3",
"zod": "^3.22.4" "zod": "^3.22.4"
}, },
"devDependencies": { "devDependencies": {
"@iconify-json/radix-icons": "^1.1.14", "@iconify-json/radix-icons": "^1.1.14",
"@iconify-json/simple-icons": "^1.1.94",
"@iconify-json/tabler": "^1.1.106", "@iconify-json/tabler": "^1.1.106",
"@iconify/json": "^2.2.189", "@iconify/json": "^2.2.189",
"@iconify/vue": "^4.1.1", "@iconify/vue": "^4.1.1",
"@shikijs/transformers": "^1.1.7", "@shikijs/transformers": "^1.1.7",
"@types/lodash.template": "^4.5.3", "@types/lodash.template": "^4.5.3",
"@types/node": "^20.11.24", "@types/node": "^20.11.25",
"@vitejs/plugin-vue": "^5.0.4", "@vitejs/plugin-vue": "^5.0.4",
"@vitejs/plugin-vue-jsx": "^3.1.0", "@vitejs/plugin-vue-jsx": "^3.1.0",
"@vue/compiler-core": "^3.4.21", "@vue/compiler-core": "^3.4.21",
@ -63,10 +64,10 @@
"tailwind-merge": "^2.2.1", "tailwind-merge": "^2.2.1",
"tailwindcss": "^3.4.1", "tailwindcss": "^3.4.1",
"tsx": "^4.7.1", "tsx": "^4.7.1",
"typescript": "^5.3.3", "typescript": "^5.4.2",
"unplugin-icons": "^0.18.5", "unplugin-icons": "^0.18.5",
"vite": "^5.1.5", "vite": "^5.1.5",
"vitepress": "^1.0.0-rc.44", "vitepress": "^1.0.0-rc.45",
"vue-tsc": "^2.0.5" "vue-tsc": "^2.0.6"
} }
} }

39
apps/www/src/content/docs/dark-mode.md Normal file
View File

@ -0,0 +1,39 @@
---
title: Dark Mode
description: Adding dark mode to your site.
---
<script setup>
import { useData } from 'vitepress'
const { isDark } = useData()
import ViteIcon from '~icons/simple-icons/vite'
import NuxtIcon from '~icons/simple-icons/nuxtdotjs'
import AstroIcon from '~icons/simple-icons/astro'
</script>
<div class="grid gap-4 mt-8 sm:grid-cols-2 sm:gap-6 not-docs">
<LinkedCard href="/docs/dark-mode/vite">
<ViteIcon class="w-10 h-10" />
<p class="mt-2 font-medium">Vite</p>
</LinkedCard>
<LinkedCard href="/docs/dark-mode/nuxt">
<NuxtIcon class="w-10 h-10" />
<p class="mt-2 font-medium">Nuxt</p>
</LinkedCard>
<LinkedCard href="/docs/dark-mode/vitepress">
<svg width="48" height="48" viewBox="0 0 48 48" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M5.03628 7.87818C4.75336 5.83955 6.15592 3.95466 8.16899 3.66815L33.6838 0.0367403C35.6969 -0.24977 37.5581 1.1706 37.841 3.20923L42.9637 40.1218C43.2466 42.1604 41.8441 44.0453 39.831 44.3319L14.3162 47.9633C12.3031 48.2498 10.4419 46.8294 10.159 44.7908L5.03628 7.87818Z" />
<path d="M6.85877 7.6188C6.71731 6.59948 7.41859 5.65703 8.42512 5.51378L33.9399 1.88237C34.9465 1.73911 35.8771 2.4493 36.0186 3.46861L41.1412 40.3812C41.2827 41.4005 40.5814 42.343 39.5749 42.4862L14.0601 46.1176C13.0535 46.2609 12.1229 45.5507 11.9814 44.5314L6.85877 7.6188Z" class="fill-background"/>
<path d="M33.1857 14.9195L25.8505 34.1576C25.6991 34.5547 25.1763 34.63 24.9177 34.2919L12.3343 17.8339C12.0526 17.4655 12.3217 16.9339 12.7806 16.9524L22.9053 17.3607C22.9698 17.3633 23.0344 17.3541 23.0956 17.3337L32.5088 14.1992C32.9431 14.0546 33.3503 14.4878 33.1857 14.9195Z" />
<path d="M27.0251 12.5756L19.9352 15.0427C19.8187 15.0832 19.7444 15.1986 19.7546 15.3231L20.3916 23.063C20.4066 23.2453 20.5904 23.3628 20.7588 23.2977L22.7226 22.5392C22.9064 22.4682 23.1021 22.6138 23.0905 22.8128L22.9102 25.8903C22.8982 26.0974 23.1093 26.2436 23.295 26.1567L24.4948 25.5953C24.6808 25.5084 24.892 25.6549 24.8795 25.8624L24.5855 30.6979C24.5671 31.0004 24.9759 31.1067 25.1013 30.8321L25.185 30.6487L29.4298 17.8014C29.5008 17.5863 29.2968 17.3809 29.0847 17.454L27.0519 18.1547C26.8609 18.2205 26.6675 18.0586 26.6954 17.8561L27.3823 12.8739C27.4103 12.6712 27.2163 12.5091 27.0251 12.5756Z" class="stroke-background"/>
</svg>
<p class="mt-2 font-medium">Vitepress</p>
</LinkedCard>
<LinkedCard href="/docs/dark-mode/astro">
<AstroIcon class="w-10 h-10" />
<p class="mt-2 font-medium">Astro</p>
</LinkedCard>
</div>

116
apps/www/src/content/docs/dark-mode/astro.md Normal file
View File

@ -0,0 +1,116 @@
---
title: Astro
description: Adding dark mode to your astro app.
---
## Dark mode
<Steps>
### Create an inline theme script
```astro title="src/pages/index.astro"
---
import '../styles/globals.css'
---
<script is:inline>
const getThemePreference = () => {
if (typeof localStorage !== 'undefined' && localStorage.getItem('theme')) {
return localStorage.getItem('theme');
}
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
};
const isDark = getThemePreference() === 'dark';
document.documentElement.classList[isDark ? 'add' : 'remove']('dark');
if (typeof localStorage !== 'undefined') {
const observer = new MutationObserver(() => {
const isDark = document.documentElement.classList.contains('dark');
localStorage.setItem('theme', isDark ? 'dark' : 'light');
});
observer.observe(document.documentElement, { attributes: true, attributeFilter: ['class'] });
}
</script>
<html lang="en">
<body>
<h1>Astro</h1>
</body>
</html>
</script>
```
### Install Dependencies
```bash
npm install @vueuse/core
```
Optional, to include icons for theme button.
```bash
npm install -D @iconify/vue @iconify-json/radix-icons
```
### Add a mode toggle
Place a mode toggle on your site to toggle between light and dark mode.
We're using [`useColorMode`](https://vueuse.org/core/usecolormode/) from [`@vueuse/core`](https://vueuse.org/core/).
> Reactive color mode (dark / light / customs) with auto data persistence.
```vue
<script setup lang="ts">
import { useColorMode } from '@vueuse/core'
import { Icon } from '@iconify/vue'
import { Button } from '@/components/ui/button'
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@/components/ui/dropdown-menu'
const mode = useColorMode()
</script>
<template>
<DropdownMenu>
<DropdownMenuTrigger as-child>
<Button variant="outline">
<Icon icon="radix-icons:moon" class="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
<Icon icon="radix-icons:sun" class="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
<span class="sr-only">Toggle theme</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuItem @click="mode = 'light'">
Light
</DropdownMenuItem>
<DropdownMenuItem @click="mode = 'dark'">
Dark
</DropdownMenuItem>
<DropdownMenuItem @click="mode = 'auto'">
System
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</template>
```
### Display the mode toggle
Place a mode toggle on your site to toggle between light and dark mode.
```astro title="src/pages/index.astro"
---
import '../styles/globals.css'
import { ModeToggle } from '@/components/ModeToggle.vue';
---
<!-- Inline script -->
<html lang="en">
<body>
<h1>Astro</h1>
<ModeToggle client:load />
</body>
</html>
```
</Steps>

74
apps/www/src/content/docs/dark-mode/nuxt.md Normal file
View File

@ -0,0 +1,74 @@
---
title: Nuxt
description: Adding dark mode to your nuxt app.
---
## Dark mode
<Steps>
### Install Dependencies
```bash
npm install -D @nuxtjs/color-mode
```
Then, add `@nuxtjs/color-mode` to the modules section of your `nuxt.config.ts`
```ts
export default defineNuxtConfig({
modules: [
'@nuxtjs/tailwindcss',
'@nuxtjs/color-mode'
],
colorMode: {
classSuffix: ''
}
})
```
Optional, to include icons for theme button.
```bash
npm install -D @iconify/vue @iconify-json/radix-icons
```
### Add a mode toggle
Place a mode toggle on your site to toggle between light and dark mode.
We're using [`useColorMode`](https://color-mode.nuxtjs.org/#usage) from [`Nuxt Color Mode`](https://color-mode.nuxtjs.org/).
```vue
<script setup lang="ts">
import { Icon } from '@iconify/vue'
import { Button } from '@/components/ui/button'
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@/components/ui/dropdown-menu'
const colorMode = useColorMode()
</script>
<template>
<DropdownMenu>
<DropdownMenuTrigger as-child>
<Button variant="outline">
<Icon icon="radix-icons:moon" class="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
<Icon icon="radix-icons:sun" class="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
<span class="sr-only">Toggle theme</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuItem @click="colorMode.preference = 'light'">
Light
</DropdownMenuItem>
<DropdownMenuItem @click="colorMode.preference = 'dark'">
Dark
</DropdownMenuItem>
<DropdownMenuItem @click="colorMode.preference = 'system'">
System
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</template>
```
</Steps>

62
apps/www/src/content/docs/dark-mode/vite.md Normal file
View File

@ -0,0 +1,62 @@
---
title: Vite
description: Adding dark mode to your vite app.
---
## Dark mode
<Steps>
### Install Dependencies
```bash
npm install @vueuse/core
```
Optional, to include icons for theme button.
```bash
npm install -D @iconify/vue @iconify-json/radix-icons
```
### Add a mode toggle
Place a mode toggle on your site to toggle between light and dark mode.
We're using [`useColorMode`](https://vueuse.org/core/usecolormode/) from [`@vueuse/core`](https://vueuse.org/core/).
> Reactive color mode (dark / light / customs) with auto data persistence.
```vue
<script setup lang="ts">
import { useColorMode } from '@vueuse/core'
import { Icon } from '@iconify/vue'
import { Button } from '@/components/ui/button'
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@/components/ui/dropdown-menu'
const mode = useColorMode()
</script>
<template>
<DropdownMenu>
<DropdownMenuTrigger as-child>
<Button variant="outline">
<Icon icon="radix-icons:moon" class="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
<Icon icon="radix-icons:sun" class="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
<span class="sr-only">Toggle theme</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuItem @click="mode = 'light'">
Light
</DropdownMenuItem>
<DropdownMenuItem @click="mode = 'dark'">
Dark
</DropdownMenuItem>
<DropdownMenuItem @click="mode = 'auto'">
System
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</template>
```
</Steps>

47
apps/www/src/content/docs/dark-mode/vitepress.md Normal file
View File

@ -0,0 +1,47 @@
---
title: Vitepress
description: Adding dark mode to your vitepress app.
---
## Dark mode
<Steps>
### Install Dependencies
```bash
npm install @vueuse/core
```
Optional, to include icons for theme button.
```bash
npm install -D @iconify/vue @iconify-json/radix-icons
```
### Add a mode toggle
Place a mode toggle on your site to toggle between light and dark mode.
We're using [`useToggle`](https://vueuse.org/shared/useToggle/) from [`@vueuse/core`](https://vueuse.org/core/).
> A boolean switcher with utility functions.
```vue
<script setup lang="ts">
import { useData } from 'vitepress'
import { useToggle } from '@vueuse/core'
import { Button } from '@/lib/registry/default/ui/button'
const { frontmatter, isDark } = useData()
const toggleDark = useToggle(isDark)
</script>
<template>
<Button variant="outline">
<Icon icon="radix-icons:moon" class="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
<Icon icon="radix-icons:sun" class="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
<span class="sr-only">Toggle theme</span>
</Button>
</template>
```
</Steps>

11
apps/www/src/content/docs/installation/vite.md
View File

@ -21,8 +21,6 @@ npm create vite@latest my-vue-app -- --template vue-ts
Install `tailwindcss` and its peer dependencies, then generate your `tailwind.config.js` and configure `postcss` plugins Install `tailwindcss` and its peer dependencies, then generate your `tailwind.config.js` and configure `postcss` plugins
<TabsMarkdown> <TabsMarkdown>
<TabMarkdown title="vite.config"> <TabMarkdown title="vite.config">
@ -59,7 +57,6 @@ Install `tailwindcss` and its peer dependencies, then generate your `tailwind.co
</TabMarkdown> </TabMarkdown>
<TabMarkdown title="postcss.config.js"> <TabMarkdown title="postcss.config.js">
```bash ```bash
@ -80,7 +77,6 @@ Install `tailwindcss` and its peer dependencies, then generate your `tailwind.co
</TabMarkdown> </TabMarkdown>
</TabsMarkdown> </TabsMarkdown>
### Edit tsconfig.json ### Edit tsconfig.json
Add the code below to the compilerOptions of your tsconfig.json so your app can resolve paths without error Add the code below to the compilerOptions of your tsconfig.json so your app can resolve paths without error
@ -107,11 +103,14 @@ Add the code below to the vite.config.ts so your app can resolve paths without e
npm i -D @types/node npm i -D @types/node
``` ```
```typescript {12-16} ```typescript {15-19}
import path from "path" import path from "path"
import vue from "@vitejs/plugin-vue" import vue from "@vitejs/plugin-vue"
import { defineConfig } from "vite" import { defineConfig } from "vite"
import tailwind from "tailwindcss"
import autoprefixer from "autoprefixer"
export default defineConfig({ export default defineConfig({
css: { css: {
postcss: { postcss: {
@ -148,7 +147,7 @@ Where is your global CSS file? › › src/index.css
Do you want to use CSS variables for colors? › no / yes Do you want to use CSS variables for colors? › no / yes
Where is your tailwind.config.js located? › tailwind.config.js Where is your tailwind.config.js located? › tailwind.config.js
Configure the import alias for components: › @/components Configure the import alias for components: › @/components
Configure the import alias for utils: › @/lib/utils Configure the import alias for utils: › @/lib/utils
``` ```
### That's it ### That's it

6
apps/www/tsconfig.json
View File

@ -2,15 +2,15 @@
"extends": "@vue/tsconfig/tsconfig.dom.json", "extends": "@vue/tsconfig/tsconfig.dom.json",
"compilerOptions": { "compilerOptions": {
"lib": ["ESNext", "DOM", "DOM.Iterable"], "lib": ["ESNext", "DOM", "DOM.Iterable"],
"moduleResolution": "Node",
"baseUrl": ".", "baseUrl": ".",
"moduleResolution": "Node",
"paths": { "paths": {
"@/*": ["./src/*"] "@/*": ["./src/*"]
}, },
"types": ["unplugin-icons/types/vue", "node"], "types": ["unplugin-icons/types/vue", "node"],
"declaration": false, "declaration": false,
"sourceMap": true, "outDir": "dist",
"outDir": "dist" "sourceMap": true
}, },
"include": ["src", ".vitepress/**/*.vue", "scripts/build-registry.ts", ".vitepress/**/*.mts", ".vitepress/**/*.vue", "src/lib/**/*"], "include": ["src", ".vitepress/**/*.vue", "scripts/build-registry.ts", ".vitepress/**/*.mts", ".vitepress/**/*.vue", "src/lib/**/*"],
"exclude": ["node_modules"] "exclude": ["node_modules"]

139
pnpm-lock.yaml
View File

@ -87,8 +87,8 @@ importers:
specifier: ^8.0.0 specifier: ^8.0.0
version: 8.0.0(vue@3.4.21) version: 8.0.0(vue@3.4.21)
lucide-vue-next: lucide-vue-next:
specifier: ^0.276.0 specifier: ^0.350.0
version: 0.276.0(vue@3.4.21) version: 0.350.0(vue@3.4.21)
radix-vue: radix-vue:
specifier: ^1.5.0 specifier: ^1.5.0
version: 1.5.0(vue@3.4.21) version: 1.5.0(vue@3.4.21)
@ -100,16 +100,16 @@ importers:
version: 3.1.2(@popperjs/core@2.11.8)(vue@3.4.21) version: 3.1.2(@popperjs/core@2.11.8)(vue@3.4.21)
vaul-vue: vaul-vue:
specifier: ^0.1.0 specifier: ^0.1.0
version: 0.1.0(typescript@5.3.3) version: 0.1.0(typescript@5.4.2)
vee-validate: vee-validate:
specifier: 4.12.5 specifier: 4.12.5
version: 4.12.5(vue@3.4.21) version: 4.12.5(vue@3.4.21)
vue: vue:
specifier: ^3.4.21 specifier: ^3.4.21
version: 3.4.21(typescript@5.3.3) version: 3.4.21(typescript@5.4.2)
vue-sonner: vue-sonner:
specifier: ^1.1.1 specifier: ^1.1.2
version: 1.1.1 version: 1.1.2
vue-wrap-balancer: vue-wrap-balancer:
specifier: ^1.1.3 specifier: ^1.1.3
version: 1.1.3(vue@3.4.21) version: 1.1.3(vue@3.4.21)
@ -120,6 +120,9 @@ importers:
'@iconify-json/radix-icons': '@iconify-json/radix-icons':
specifier: ^1.1.14 specifier: ^1.1.14
version: 1.1.14 version: 1.1.14
'@iconify-json/simple-icons':
specifier: ^1.1.94
version: 1.1.94
'@iconify-json/tabler': '@iconify-json/tabler':
specifier: ^1.1.106 specifier: ^1.1.106
version: 1.1.106 version: 1.1.106
@ -136,8 +139,8 @@ importers:
specifier: ^4.5.3 specifier: ^4.5.3
version: 4.5.3 version: 4.5.3
'@types/node': '@types/node':
specifier: ^20.11.24 specifier: ^20.11.25
version: 20.11.24 version: 20.11.25
'@vitejs/plugin-vue': '@vitejs/plugin-vue':
specifier: ^5.0.4 specifier: ^5.0.4
version: 5.0.4(vite@5.1.5)(vue@3.4.21) version: 5.0.4(vite@5.1.5)(vue@3.4.21)
@ -181,20 +184,20 @@ importers:
specifier: ^4.7.1 specifier: ^4.7.1
version: 4.7.1 version: 4.7.1
typescript: typescript:
specifier: ^5.3.3 specifier: ^5.4.2
version: 5.3.3 version: 5.4.2
unplugin-icons: unplugin-icons:
specifier: ^0.18.5 specifier: ^0.18.5
version: 0.18.5(@vue/compiler-sfc@3.4.21) version: 0.18.5(@vue/compiler-sfc@3.4.21)
vite: vite:
specifier: ^5.1.5 specifier: ^5.1.5
version: 5.1.5(@types/node@20.11.24) version: 5.1.5(@types/node@20.11.25)
vitepress: vitepress:
specifier: ^1.0.0-rc.44 specifier: ^1.0.0-rc.45
version: 1.0.0-rc.44(@algolia/client-search@4.22.1)(@types/node@20.11.24)(postcss@8.4.35)(search-insights@2.13.0)(typescript@5.3.3) version: 1.0.0-rc.45(@algolia/client-search@4.22.1)(@types/node@20.11.25)(postcss@8.4.35)(search-insights@2.13.0)(typescript@5.4.2)
vue-tsc: vue-tsc:
specifier: ^2.0.5 specifier: ^2.0.6
version: 2.0.5(typescript@5.3.3) version: 2.0.6(typescript@5.4.2)
packages/cli: packages/cli:
dependencies: dependencies:
@ -2093,6 +2096,12 @@ packages:
'@iconify/types': 2.0.0 '@iconify/types': 2.0.0
dev: true dev: true
/@iconify-json/simple-icons@1.1.94:
resolution: {integrity: sha512-2UwwbEJeZ/aMpACG/dZoOhNszKFO+IjcRCbYB+lMqd+6fA5ewykRy63IP8//UdviazOPamGJ/XbNBJH/o1YFdQ==}
dependencies:
'@iconify/types': 2.0.0
dev: true
/@iconify-json/tabler@1.1.106: /@iconify-json/tabler@1.1.106:
resolution: {integrity: sha512-TcGGQ2nDhb2OmKsMPk3SuNxf259Rjirbvkz3gX1C8fexJmSWqR8AsH98/VMbK7VVYb2L2FIfX3QJxKpJvXEryw==} resolution: {integrity: sha512-TcGGQ2nDhb2OmKsMPk3SuNxf259Rjirbvkz3gX1C8fexJmSWqR8AsH98/VMbK7VVYb2L2FIfX3QJxKpJvXEryw==}
dependencies: dependencies:
@ -2130,7 +2139,7 @@ packages:
vue: '>=3' vue: '>=3'
dependencies: dependencies:
'@iconify/types': 2.0.0 '@iconify/types': 2.0.0
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
dev: true dev: true
/@internationalized/date@3.5.2: /@internationalized/date@3.5.2:
@ -3048,7 +3057,7 @@ packages:
peerDependencies: peerDependencies:
vue: '>= 3' vue: '>= 3'
dependencies: dependencies:
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
dev: false dev: false
/@rollup/plugin-alias@5.1.0(rollup@3.29.4): /@rollup/plugin-alias@5.1.0(rollup@3.29.4):
@ -3551,7 +3560,7 @@ packages:
vue: ^3.2.33 vue: ^3.2.33
dependencies: dependencies:
'@tanstack/table-core': 8.13.2 '@tanstack/table-core': 8.13.2
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
dev: false dev: false
/@trysound/sax@0.2.0: /@trysound/sax@0.2.0:
@ -4456,7 +4465,7 @@ packages:
vue: ^3 vue: ^3
dependencies: dependencies:
'@unovis/ts': 1.3.5 '@unovis/ts': 1.3.5
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
dev: false dev: false
/@vee-validate/zod@4.12.5(vue@3.4.21): /@vee-validate/zod@4.12.5(vue@3.4.21):
@ -4500,8 +4509,8 @@ packages:
'@babel/core': 7.23.9 '@babel/core': 7.23.9
'@babel/plugin-transform-typescript': 7.23.6(@babel/core@7.23.9) '@babel/plugin-transform-typescript': 7.23.6(@babel/core@7.23.9)
'@vue/babel-plugin-jsx': 1.2.1(@babel/core@7.23.9) '@vue/babel-plugin-jsx': 1.2.1(@babel/core@7.23.9)
vite: 5.1.5(@types/node@20.11.24) vite: 5.1.5(@types/node@20.11.25)
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
transitivePeerDependencies: transitivePeerDependencies:
- supports-color - supports-color
dev: true dev: true
@ -4513,8 +4522,8 @@ packages:
vite: ^5.0.0 vite: ^5.0.0
vue: ^3.2.25 vue: ^3.2.25
dependencies: dependencies:
vite: 5.1.5(@types/node@20.11.24) vite: 5.1.5(@types/node@20.11.25)
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
dev: true dev: true
/@vitest/expect@0.33.0: /@vitest/expect@0.33.0:
@ -4616,22 +4625,22 @@ packages:
pretty-format: 29.7.0 pretty-format: 29.7.0
dev: true dev: true
/@volar/language-core@2.1.1: /@volar/language-core@2.1.2:
resolution: {integrity: sha512-oVbZcj97+5zlowkHMSJMt3aaAFuFyhXeXoOEHcqGECxFvw1TPCNnMM9vxhqNpoiNeWKHvggoq9WCk/HzJHtP8A==} resolution: {integrity: sha512-5qsDp0Gf6fE09UWCeK7bkVn6NxMwC9OqFWQkMMkeej8h8XjyABPdRygC2RCrqDrfVdGijqlMQeXs6yRS+vfZYA==}
dependencies: dependencies:
'@volar/source-map': 2.1.1 '@volar/source-map': 2.1.2
dev: true dev: true
/@volar/source-map@2.1.1: /@volar/source-map@2.1.2:
resolution: {integrity: sha512-OOtxrEWB2eZ+tnCy5JwDkcCPGlN3+ioNNzkywXE9k4XA7p4cN36frR7QPAOksvd7RXKUGHzSjq6XrYnTPa4z4Q==} resolution: {integrity: sha512-yFJqsuLm1OaWrsz9E3yd3bJcYIlHqdZ8MbmIoZLrAzMYQDcoF26/INIhgziEXSdyHc8xd7rd/tJdSnUyh0gH4Q==}
dependencies: dependencies:
muggle-string: 0.4.1 muggle-string: 0.4.1
dev: true dev: true
/@volar/typescript@2.1.1: /@volar/typescript@2.1.2:
resolution: {integrity: sha512-5K41AWvFZCMMKZCx8bbFvbkyiKHr0s9k8P0M1FVXLX/9HYHzK5C9B8cX4uhATSehAytFIRnR4fTXVQtWp/Yzag==} resolution: {integrity: sha512-lhTancZqamvaLvoz0u/uth8dpudENNt2LFZOWCw9JZiX14xRFhdhfzmphiCRb7am9E6qAJSbdS/gMt1utXAoHQ==}
dependencies: dependencies:
'@volar/language-core': 2.1.1 '@volar/language-core': 2.1.2
path-browserify: 1.0.1 path-browserify: 1.0.1
dev: true dev: true
@ -4831,21 +4840,21 @@ packages:
rfdc: 1.3.1 rfdc: 1.3.1
dev: true dev: true
/@vue/language-core@2.0.5(typescript@5.3.3): /@vue/language-core@2.0.6(typescript@5.4.2):
resolution: {integrity: sha512-knGXuQqhDSO7QJr8LFklsiWa23N2ikehkdVxtc9UKgnyqsnusughS2Tkg7VN8Hqed35X0B52Z+OGI5OrT/8uxQ==} resolution: {integrity: sha512-UzqU12tzf9XLqRO3TiWPwRNpP4fyUzE6MAfOQWQNZ4jy6a30ARRUpmODDKq6O8C4goMc2AlPqTmjOHPjHkilSg==}
peerDependencies: peerDependencies:
typescript: '*' typescript: '*'
peerDependenciesMeta: peerDependenciesMeta:
typescript: typescript:
optional: true optional: true
dependencies: dependencies:
'@volar/language-core': 2.1.1 '@volar/language-core': 2.1.2
'@vue/compiler-dom': 3.4.21 '@vue/compiler-dom': 3.4.21
'@vue/shared': 3.4.21 '@vue/shared': 3.4.21
computeds: 0.0.1 computeds: 0.0.1
minimatch: 9.0.3 minimatch: 9.0.3
path-browserify: 1.0.1 path-browserify: 1.0.1
typescript: 5.3.3 typescript: 5.4.2
vue-template-compiler: 2.7.16 vue-template-compiler: 2.7.16
dev: true dev: true
@ -6881,7 +6890,7 @@ packages:
dependencies: dependencies:
embla-carousel: 8.0.0 embla-carousel: 8.0.0
embla-carousel-reactive-utils: 8.0.0(embla-carousel@8.0.0) embla-carousel-reactive-utils: 8.0.0(embla-carousel@8.0.0)
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
dev: false dev: false
/embla-carousel@8.0.0: /embla-carousel@8.0.0:
@ -9227,12 +9236,12 @@ packages:
dependencies: dependencies:
yallist: 4.0.0 yallist: 4.0.0
/lucide-vue-next@0.276.0(vue@3.4.21): /lucide-vue-next@0.350.0(vue@3.4.21):
resolution: {integrity: sha512-yQmIaTbVjG2TMwFQr98Biva99I+eDcMh0wPepJsDajk2d2lio9VGBsKhIUtAUPYwqnsvVg2+dSYsyvX21BJ5yw==} resolution: {integrity: sha512-dVMoSGQfkrgWdHug4tRXeiCfytxnmbLQdlprFlEe9GGT92rbCypak4k0xNR46MPN9UZbd1yCjCeNeVTFb7PJdQ==}
peerDependencies: peerDependencies:
vue: '>=3.0.1' vue: '>=3.0.1'
dependencies: dependencies:
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
dev: false dev: false
/lz-string@1.5.0: /lz-string@1.5.0:
@ -12593,6 +12602,7 @@ packages:
resolution: {integrity: sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==} resolution: {integrity: sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==}
engines: {node: '>=14.17'} engines: {node: '>=14.17'}
hasBin: true hasBin: true
dev: true
/typescript@5.4.2: /typescript@5.4.2:
resolution: {integrity: sha512-+2/g0Fds1ERlP6JsakQQDXjZdZMM+rqpamFZJEKh4kwTIn3iDkgKtby0CeNd5ATNZ4Ry1ax15TMx0W2V+miizQ==} resolution: {integrity: sha512-+2/g0Fds1ERlP6JsakQQDXjZdZMM+rqpamFZJEKh4kwTIn3iDkgKtby0CeNd5ATNZ4Ry1ax15TMx0W2V+miizQ==}
@ -13012,7 +13022,7 @@ packages:
date-fns: 2.30.0 date-fns: 2.30.0
date-fns-tz: 2.0.0(date-fns@2.30.0) date-fns-tz: 2.0.0(date-fns@2.30.0)
lodash: 4.17.21 lodash: 4.17.21
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
vue-screen-utils: 1.0.0-beta.13(vue@3.4.21) vue-screen-utils: 1.0.0-beta.13(vue@3.4.21)
dev: false dev: false
@ -13035,12 +13045,12 @@ packages:
builtins: 5.0.1 builtins: 5.0.1
dev: true dev: true
/vaul-vue@0.1.0(typescript@5.3.3): /vaul-vue@0.1.0(typescript@5.4.2):
resolution: {integrity: sha512-3PYWMbN3cSdsciv3fzewskxZFnX61PYq1uNsbvizXDo/8sN4SMrWkYDqWaPdTD3GTEm6wpx7j5flRLg7A5ZXbQ==} resolution: {integrity: sha512-3PYWMbN3cSdsciv3fzewskxZFnX61PYq1uNsbvizXDo/8sN4SMrWkYDqWaPdTD3GTEm6wpx7j5flRLg7A5ZXbQ==}
dependencies: dependencies:
'@vueuse/core': 10.9.0(vue@3.4.21) '@vueuse/core': 10.9.0(vue@3.4.21)
radix-vue: 1.5.0(vue@3.4.21) radix-vue: 1.5.0(vue@3.4.21)
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
transitivePeerDependencies: transitivePeerDependencies:
- '@vue/composition-api' - '@vue/composition-api'
- typescript - typescript
@ -13053,7 +13063,7 @@ packages:
dependencies: dependencies:
'@vue/devtools-api': 6.5.1 '@vue/devtools-api': 6.5.1
type-fest: 4.10.2 type-fest: 4.10.2
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
dev: false dev: false
/vite-node@0.33.0(@types/node@20.11.25): /vite-node@0.33.0(@types/node@20.11.25):
@ -13341,8 +13351,8 @@ packages:
fsevents: 2.3.3 fsevents: 2.3.3
dev: true dev: true
/vitepress@1.0.0-rc.44(@algolia/client-search@4.22.1)(@types/node@20.11.24)(postcss@8.4.35)(search-insights@2.13.0)(typescript@5.3.3): /vitepress@1.0.0-rc.45(@algolia/client-search@4.22.1)(@types/node@20.11.25)(postcss@8.4.35)(search-insights@2.13.0)(typescript@5.4.2):
resolution: {integrity: sha512-tO5taxGI7fSpBK1D8zrZTyJJERlyU9nnt0jHSt3fywfq3VKn977Hg0wUuTkEmwXlFYwuW26+6+3xorf4nD3XvA==} resolution: {integrity: sha512-/OiYsu5UKpQKA2c0BAZkfyywjfauDjvXyv6Mo4Ra57m5n4Bxg1HgUGoth1CLH2vwUbR/BHvDA9zOM0RDvgeSVQ==}
hasBin: true hasBin: true
peerDependencies: peerDependencies:
markdown-it-mathjax3: ^4.3.2 markdown-it-mathjax3: ^4.3.2
@ -13367,8 +13377,8 @@ packages:
minisearch: 6.3.0 minisearch: 6.3.0
postcss: 8.4.35 postcss: 8.4.35
shiki: 1.1.7 shiki: 1.1.7
vite: 5.1.5(@types/node@20.11.24) vite: 5.1.5(@types/node@20.11.25)
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
transitivePeerDependencies: transitivePeerDependencies:
- '@algolia/client-search' - '@algolia/client-search'
- '@types/node' - '@types/node'
@ -13616,7 +13626,7 @@ packages:
'@vue/composition-api': '@vue/composition-api':
optional: true optional: true
dependencies: dependencies:
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
/vue-devtools-stub@0.1.0: /vue-devtools-stub@0.1.0:
resolution: {integrity: sha512-RutnB7X8c5hjq39NceArgXg28WZtZpGc3+J16ljMiYnFhKvd8hITxSWQSQ5bvldxMDU6gG5mkxl1MTQLXckVSQ==} resolution: {integrity: sha512-RutnB7X8c5hjq39NceArgXg28WZtZpGc3+J16ljMiYnFhKvd8hITxSWQSQ5bvldxMDU6gG5mkxl1MTQLXckVSQ==}
@ -13654,11 +13664,11 @@ packages:
peerDependencies: peerDependencies:
vue: ^3.2.0 vue: ^3.2.0
dependencies: dependencies:
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
dev: false dev: false
/vue-sonner@1.1.1: /vue-sonner@1.1.2:
resolution: {integrity: sha512-TYuqPLNACSU5QG2EuN59Ho/uQylezKxpiZ3TOa1jP9WpyWLSb3lMH9LU/jmJY4hOvXsvOFtl3Q1QUaJ0yA+FSQ==} resolution: {integrity: sha512-yg4f5s0a3oiiI7cNvO0Dajux1Y7s04lxww3vnQtnwQawJ3KqaKA9RIRMdI9wGTosRGIOwgYFniFRGl4+IuKPZw==}
dev: false dev: false
/vue-template-compiler@2.7.16: /vue-template-compiler@2.7.16:
@ -13668,16 +13678,16 @@ packages:
he: 1.2.0 he: 1.2.0
dev: true dev: true
/vue-tsc@2.0.5(typescript@5.3.3): /vue-tsc@2.0.6(typescript@5.4.2):
resolution: {integrity: sha512-e8WCgOVTrbmC04XPnI+IpaMTFYKaTm5s/MXFcvxO1l9kxzn+9FpGNVrBSlQE8VpTJaJg4kaBK1nj3NC20VJzjw==} resolution: {integrity: sha512-kK50W4XqQL34vHRkxlRWLicrT6+F9xfgCgJ4KSmCHcytKzc1u3c94XXgI+CjmhOSxyw0krpExF7Obo7y4+0dVQ==}
hasBin: true hasBin: true
peerDependencies: peerDependencies:
typescript: '*' typescript: '*'
dependencies: dependencies:
'@volar/typescript': 2.1.1 '@volar/typescript': 2.1.2
'@vue/language-core': 2.0.5(typescript@5.3.3) '@vue/language-core': 2.0.6(typescript@5.4.2)
semver: 7.6.0 semver: 7.6.0
typescript: 5.3.3 typescript: 5.4.2
dev: true dev: true
/vue-wrap-balancer@1.1.3(vue@3.4.21): /vue-wrap-balancer@1.1.3(vue@3.4.21):
@ -13686,24 +13696,9 @@ packages:
vue: ^3.3.0 vue: ^3.3.0
dependencies: dependencies:
nanoid: 3.3.7 nanoid: 3.3.7
vue: 3.4.21(typescript@5.3.3) vue: 3.4.21(typescript@5.4.2)
dev: false dev: false
/vue@3.4.21(typescript@5.3.3):
resolution: {integrity: sha512-5hjyV/jLEIKD/jYl4cavMcnzKwjMKohureP8ejn3hhEjwhWIhWeuzL2kJAjzl/WyVsgPY56Sy4Z40C3lVshxXA==}
peerDependencies:
typescript: '*'
peerDependenciesMeta:
typescript:
optional: true
dependencies:
'@vue/compiler-dom': 3.4.21
'@vue/compiler-sfc': 3.4.21
'@vue/runtime-dom': 3.4.21
'@vue/server-renderer': 3.4.21(vue@3.4.21)
'@vue/shared': 3.4.21
typescript: 5.3.3
/vue@3.4.21(typescript@5.4.2): /vue@3.4.21(typescript@5.4.2):
resolution: {integrity: sha512-5hjyV/jLEIKD/jYl4cavMcnzKwjMKohureP8ejn3hhEjwhWIhWeuzL2kJAjzl/WyVsgPY56Sy4Z40C3lVshxXA==} resolution: {integrity: sha512-5hjyV/jLEIKD/jYl4cavMcnzKwjMKohureP8ejn3hhEjwhWIhWeuzL2kJAjzl/WyVsgPY56Sy4Z40C3lVshxXA==}
peerDependencies: peerDependencies: