├── .editorconfig
├── .github
    └── workflows
    │   └── deploy.yml
├── .gitignore
├── .vscode
    ├── extensions.json
    └── settings.json
├── content
    ├── .vitepress
    │   ├── config.mts
    │   └── theme
    │   │   ├── components
    │   │       ├── ActionButtons.vue
    │   │       ├── DocFooter.vue
    │   │       ├── Footer.vue
    │   │       ├── GithubCounterBtn.vue
    │   │       ├── SocialLinks.vue
    │   │       ├── SubscribeAlert.vue
    │   │       ├── SubscribeForm.vue
    │   │       └── VueThemesCallOut.vue
    │   │   ├── custom.scss
    │   │   ├── index.ts
    │   │   └── tailwind.css
    ├── changelog.md
    ├── contributing.md
    ├── index.md
    ├── pinia
    │   └── basic.md
    ├── public
    │   ├── brand-logo-small-dark.png
    │   ├── brand-logo-small-light.png
    │   ├── google6f658ffc1e5996cb.html
    │   ├── hero-image.png
    │   ├── hero.png
    │   ├── logos
    │   │   ├── android-icon-192x192.png
    │   │   ├── apple-icon-114x114.png
    │   │   ├── apple-icon-120x120.png
    │   │   ├── apple-icon-144x144.png
    │   │   ├── apple-icon-152x152.png
    │   │   ├── apple-icon-180x180.png
    │   │   ├── apple-icon-57x57.png
    │   │   ├── apple-icon-60x60.png
    │   │   ├── apple-icon-72x72.png
    │   │   ├── apple-icon-76x76.png
    │   │   ├── favicon-16x16.png
    │   │   ├── favicon-32x32.png
    │   │   ├── favicon-96x96.png
    │   │   ├── favicon.ico
    │   │   └── manifest.json
    │   ├── pinia-logo.png
    │   ├── robots.txt
    │   ├── vue-cheatsheet-logo.png
    │   ├── vue-logo.png
    │   └── vue-router-logo.png
    ├── vue-router
    │   ├── advanced.md
    │   └── basic.md
    └── vue
    │   ├── basic.md
    │   ├── built-in-components.md
    │   ├── component.md
    │   ├── composable.md
    │   ├── forms.md
    │   └── reactivity.md
├── package.json
├── pnpm-lock.yaml
├── postcss.config.js
├── readme.md
├── shims.d.ts
├── tailwind.config.js
└── tsconfig.json


/.editorconfig:
--------------------------------------------------------------------------------
 1 | # EditorConfig is awesome: https://EditorConfig.org
 2 | 
 3 | # top-most EditorConfig file
 4 | root = true
 5 | 
 6 | # Unix-style newlines with a newline ending every file
 7 | [*]
 8 | end_of_line = lf
 9 | insert_final_newline = true
10 | 
11 | # Matches multiple files with brace expansion notation
12 | # Set default charset
13 | [*.{js,py}]
14 | charset = utf-8
15 | 
16 | # 4 space indentation
17 | [*.py]
18 | indent_style = space
19 | indent_size = 4
20 | 
21 | # Tab indentation (no size specified)
22 | [Makefile]
23 | indent_style = tab
24 | 
25 | # Indentation override for all JS under lib directory
26 | [lib/**.js]
27 | indent_style = space
28 | indent_size = 2
29 | 
30 | # Matches the exact files either package.json or .travis.yml
31 | [{package.json,.travis.yml}]
32 | indent_style = space
33 | indent_size = 2


--------------------------------------------------------------------------------
/.github/workflows/deploy.yml:
--------------------------------------------------------------------------------
 1 | name: Deploy - Documentation
 2 | run-name: 🚀 Deploy
 3 | 
 4 | on:
 5 |   workflow_dispatch:
 6 |   push:
 7 |     branches:
 8 |       - main
 9 | 
10 | jobs:
11 |   deployment:
12 |     runs-on: ubuntu-latest
13 |     steps:
14 |       - name: ⚙️ Setup pnpm
15 |         uses: pnpm/action-setup@v2
16 |         with:
17 |           version: 8
18 |       
19 |       - name: ⬇️ Checkout repo
20 |         uses: actions/checkout@v3
21 |       
22 |       - name: 📦 Build
23 |         run: |
24 |           pnpm i
25 |           pnpm build
26 |           mv content/.vitepress/dist content/.vitepress/html
27 |           
28 |       - name: 🚀 Upload
29 |         uses: appleboy/scp-action@master
30 |         with:
31 |           HOST: ${{ secrets.HOST }}
32 |           USERNAME: ${{ secrets.USERNAME }}
33 |           PORT: ${{ secrets.PORT }}
34 |           KEY: ${{ secrets.SSHKEY }}
35 |           source: content/.vitepress/html
36 |           target: ${{ secrets.TARGET_DIR }}
37 |           strip_components: 3
38 |           rm: true
39 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
  1 | # Logs
  2 | logs
  3 | *.log
  4 | npm-debug.log*
  5 | yarn-debug.log*
  6 | yarn-error.log*
  7 | lerna-debug.log*
  8 | .pnpm-debug.log*
  9 | 
 10 | # Diagnostic reports (https://nodejs.org/api/report.html)
 11 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
 12 | 
 13 | # Runtime data
 14 | pids
 15 | *.pid
 16 | *.seed
 17 | *.pid.lock
 18 | 
 19 | # Directory for instrumented libs generated by jscoverage/JSCover
 20 | lib-cov
 21 | 
 22 | # Coverage directory used by tools like istanbul
 23 | coverage
 24 | *.lcov
 25 | 
 26 | # nyc test coverage
 27 | .nyc_output
 28 | 
 29 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
 30 | .grunt
 31 | 
 32 | # Bower dependency directory (https://bower.io/)
 33 | bower_components
 34 | 
 35 | # node-waf configuration
 36 | .lock-wscript
 37 | 
 38 | # Compiled binary addons (https://nodejs.org/api/addons.html)
 39 | build/Release
 40 | 
 41 | # Dependency directories
 42 | node_modules/
 43 | jspm_packages/
 44 | 
 45 | # Snowpack dependency directory (https://snowpack.dev/)
 46 | web_modules/
 47 | 
 48 | # TypeScript cache
 49 | *.tsbuildinfo
 50 | 
 51 | # Optional npm cache directory
 52 | .npm
 53 | 
 54 | # Optional eslint cache
 55 | .eslintcache
 56 | 
 57 | # Optional stylelint cache
 58 | .stylelintcache
 59 | 
 60 | # Microbundle cache
 61 | .rpt2_cache/
 62 | .rts2_cache_cjs/
 63 | .rts2_cache_es/
 64 | .rts2_cache_umd/
 65 | 
 66 | # Optional REPL history
 67 | .node_repl_history
 68 | 
 69 | # Output of 'npm pack'
 70 | *.tgz
 71 | 
 72 | # Yarn Integrity file
 73 | .yarn-integrity
 74 | 
 75 | # dotenv environment variable files
 76 | .env
 77 | .env.development.local
 78 | .env.test.local
 79 | .env.production.local
 80 | .env.local
 81 | 
 82 | # parcel-bundler cache (https://parceljs.org/)
 83 | .cache
 84 | .parcel-cache
 85 | 
 86 | # Next.js build output
 87 | .next
 88 | out
 89 | 
 90 | # Nuxt.js build / generate output
 91 | .nuxt
 92 | dist
 93 | 
 94 | # Gatsby files
 95 | .cache/
 96 | # Comment in the public line in if your project uses Gatsby and not Next.js
 97 | # https://nextjs.org/blog/next-9-1#public-directory-support
 98 | # public
 99 | 
100 | # vuepress build output
101 | .vuepress/dist
102 | 
103 | # vuepress v2.x temp and cache directory
104 | .temp
105 | .cache
106 | 
107 | # Docusaurus cache and generated files
108 | .docusaurus
109 | 
110 | # Serverless directories
111 | .serverless/
112 | 
113 | # FuseBox cache
114 | .fusebox/
115 | 
116 | # DynamoDB Local files
117 | .dynamodb/
118 | 
119 | # TernJS port file
120 | .tern-port
121 | 
122 | # Stores VSCode versions used for testing VSCode extensions
123 | .vscode-test
124 | 
125 | # yarn v2
126 | .yarn/cache
127 | .yarn/unplugged
128 | .yarn/build-state.yml
129 | .yarn/install-state.gz
130 | .pnp.*
131 | 
132 | # 👉 Custom
133 | 
134 | **/.vitepress/cache


--------------------------------------------------------------------------------
/.vscode/extensions.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "recommendations": [
 3 |         "davidanson.vscode-markdownlint",
 4 |         "editorconfig.editorconfig",
 5 |         "streetsidesoftware.code-spell-checker",
 6 |         "xabikos.javascriptsnippets",
 7 |         "dbaeumer.vscode-eslint",
 8 |         "matijao.vue-nuxt-snippets",
 9 |         "vue.volar"
10 |     ]
11 | }


--------------------------------------------------------------------------------
/.vscode/settings.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     // JSON
 3 |     "[json]": {
 4 |         "editor.defaultFormatter": "vscode.json-language-features"
 5 |     },
 6 |     "[jsonc]": {
 7 |         "editor.defaultFormatter": "vscode.json-language-features"
 8 |     },
 9 |     // Markdown
10 |     "[markdown]": {
11 |         "editor.defaultFormatter": "DavidAnson.vscode-markdownlint",
12 |         "markdown.validate.enabled": true,
13 |         "markdown.occurrencesHighlight.enabled": true,
14 |     },
15 |     "markdown.styles": [
16 |         "https://cdn.jsdelivr.net/gh/sindresorhus/github-markdown-css/github-markdown-dark.css",
17 |         "https://cdn.jsdelivr.net/gh/elegantech/github-markdown-css@transparent/github-markdown-with-transparent-background.min.css"
18 |     ],
19 |     "markdown.editor.pasteUrlAsFormattedLink.enabled": "smart",
20 |     "emmet.includeLanguages": {
21 |         "markdown": "html",
22 |     },
23 |     "commentAnchors.tagHighlights.enabled": false,
24 | }


--------------------------------------------------------------------------------
/content/.vitepress/config.mts:
--------------------------------------------------------------------------------
  1 | import { fileURLToPath, URL } from 'node:url'
  2 | import { defineConfig } from 'vitepress'
  3 | 
  4 | const isDev = process.env.NODE_ENV !== 'production'
  5 | 
  6 | const gtmConfig = {
  7 |   headScript: `<!-- Google Tag Manager -->
  8 | <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
  9 | new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
 10 | j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
 11 | 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
 12 | })(window,document,'script','dataLayer','GTM-PVB8N2Q');</script>
 13 | <!-- End Google Tag Manager -->`,
 14 |   bodyNoScript: `<!-- Google Tag Manager (noscript) -->
 15 | <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5DDHKGP"
 16 | height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
 17 | <!-- End Google Tag Manager (noscript) -->`,
 18 | }
 19 | 
 20 | // https://vitepress.dev/reference/site-config
 21 | export default defineConfig({
 22 |   lang: 'en-US',
 23 |   title: 'Vue Cheatsheet By ThemeSelection',
 24 |   lastUpdated: true,
 25 |   description: "The one and only Vue cheatsheet you need for VueJS by ThemeSelection",
 26 |   head: [
 27 |     ['link', { rel: 'icon', href: '/logos/favicon.ico' }],
 28 |     ['link', { rel: 'apple-touch-icon', href: '/logos/apple-icon-57x57.png' }],
 29 |     ['link', { rel: 'apple-touch-icon', href: '/logos/apple-icon-60x60.png' }],
 30 |     ['link', { rel: 'apple-touch-icon', href: '/logos/apple-icon-72x72.png' }],
 31 |     ['link', { rel: 'apple-touch-icon', href: '/logos/apple-icon-76x76.png' }],
 32 |     ['link', { rel: 'apple-touch-icon', href: '/logos/apple-icon-114x114.png' }],
 33 |     ['link', { rel: 'apple-touch-icon', href: '/logos/apple-icon-120x120.png' }],
 34 |     ['link', { rel: 'apple-touch-icon', href: '/logos/apple-icon-144x144.png' }],
 35 |     ['link', { rel: 'apple-touch-icon', href: '/logos/apple-icon-152x152.png' }],
 36 |     ['link', { rel: 'apple-touch-icon', href: '/logos/apple-icon-180x180.png' }],
 37 |     ['link', { rel: 'icon', href: '/logos/android-icon-192x192.png' }],
 38 |     ['link', { rel: 'icon', href: '/logos/favicon-32x32.png' }],
 39 |     ['link', { rel: 'icon', href: '/logos/favicon-96x96.png' }],
 40 |     ['link', { rel: 'icon', href: '/logos/favicon-16x16.png' }],
 41 |     ['link', { rel: 'manifest', href: '/logos/manifest.json' }],
 42 |     ['meta', { property: 'og:title', content: 'Vue Cheatsheet' }],
 43 |     ['meta', { property: 'og:description', content: 'The only VueJS cheatsheet you will ever need' }],
 44 |     ['meta', { property: 'og:image', content: 'https://ts-assets.b-cdn.net/ts-assets/vue-cheatsheet/github-banner-smm.png' }],
 45 |     ['meta', { property: 'twitter:image', content: 'https://ts-assets.b-cdn.net/ts-assets/vue-cheatsheet/github-banner-smm.png' }],
 46 |     ['meta', { property: 'twitter:title', content: 'Vue.js CheatSheet By ThemeSelection' }],
 47 |     ['meta', { property: 'twitter:description', content: 'Accelerate your vue learning & improve your skills with our comprehensive Vue 3 cheatsheet.' }],
 48 |     ['meta', { property: 'twitter:card', content: 'summary_large_image' }],
 49 |     ['meta', { property: 'twitter:site', content: '@Theme_Selection' }],
 50 |     ['meta', { property: 'twitter:creator', content: '@Theme_Selection' }],
 51 |     ['meta', { property: 'keywords', content: 'Vue 3 Cheatsheet, VueJS Cheatsheet, Vue JS Cheatsheet' }],
 52 |     ['meta', { property: 'google-site-verification', content: 'Eb4Y887SF6gMOy33YpMZEZLJuVfQHW9E3b8QjoSTDhw' }],
 53 |     ['script', { src: 'https://buttons.github.io/buttons.js' }]
 54 |   ],
 55 |   themeConfig: {
 56 |     logo: { src: '/vue-cheatsheet-logo.png', alt: 'Vue Cheatsheet' },
 57 | 
 58 |     siteTitle: 'Vue Cheatsheet',
 59 |     search: {
 60 |       provider: 'local',
 61 |       options: {
 62 |         detailedView: true,
 63 |       },
 64 |     },
 65 |     // https://vitepress.dev/reference/default-theme-config
 66 |     nav: [
 67 |       { text: 'Home', link: '/' },
 68 |       { text: 'Freebies', link: 'https://themeselection.com/item/category/freebies/' },
 69 |       { text: 'Templates', link: 'https://themeselection.com/item/category/admin-templates/' },
 70 |       { text: 'UI Kits', link: 'https://themeselection.com/item/category/ui-kits/' },
 71 |     ],
 72 | 
 73 |     sidebar: [
 74 |       {
 75 |         text: 'Introduction',
 76 |         items: [
 77 |           { text: 'Contributing', link: '/contributing' },
 78 |           { text: 'Changelog', link: '/changelog' },
 79 |         ],
 80 |       },
 81 |       {
 82 |         text: 'Vue',
 83 |         items: [
 84 |           { text: 'Basic', link: '/vue/basic.md' },
 85 |           { text: 'Reactivity', link: '/vue/reactivity' },
 86 |           { text: 'Forms', link: '/vue/forms' },
 87 |           { text: 'Component', link: '/vue/component' },
 88 |           { text: 'Composable', link: '/vue/composable' },
 89 |           { text: 'Built-in Components', link: '/vue/built-in-components' },
 90 |         ]
 91 |       },
 92 |       {
 93 |         text: 'Vue Router',
 94 |         items: [
 95 |           { text: 'Basic', link: '/vue-router/basic.md' },
 96 |           { text: 'Advanced', link: '/vue-router/advanced.md' },
 97 |         ]
 98 |       },
 99 |       {
100 |         text: 'Pinia',
101 |         items: [
102 |           { text: 'Basic', link: '/pinia/basic.md' },
103 |         ]
104 |       }
105 |     ],
106 | 
107 |     socialLinks: [
108 |       { icon: 'twitter', link: 'https://twitter.com/Theme_Selection' }
109 |     ],
110 | 
111 |     editLink: {
112 |       pattern: 'https://github.com/themeselection/vue-cheatsheet/edit/main/content/:path'
113 |     }
114 |   },
115 |   vite: {
116 |     resolve: {
117 |       alias: [
118 |         {
119 |           find: /^.*\/VPFooter\.vue$/,
120 |           replacement: fileURLToPath(
121 |             new URL('./theme/components/Footer.vue', import.meta.url)
122 |           )
123 |         }
124 |       ]
125 |     }
126 |   },
127 |   markdown: {
128 |     // ℹ️ We only enabled this in development so that we can highlight code lines by seeing line number without calculating it in our editor.
129 |     lineNumbers: false,
130 |     toc: { level: [1, 2,] },
131 | 
132 |     theme: {
133 |       light: 'github-light',
134 |       dark: 'dracula'
135 |     },
136 |     math: true,
137 |   },
138 |   transformHtml: async (code, id, ctx) => {
139 |     return code
140 |       .replace('<head>', `<head>\n${gtmConfig.headScript}`)
141 |       .replace('<body>', `<body>\n${gtmConfig.bodyNoScript}`)
142 |   }
143 | })
144 | 


--------------------------------------------------------------------------------
/content/.vitepress/theme/components/ActionButtons.vue:
--------------------------------------------------------------------------------
 1 | <script lang="ts" setup>
 2 | import { useData } from 'vitepress';
 3 | 
 4 | const { isDark } = useData()
 5 | </script>
 6 | <template>
 7 |     <div class="mt-4 flex items-center gap-x-3">
 8 |         <!-- <a data-v-0c3feb32 data-v-2270f7fa class="VPButton medium brand" href="/vue/basic.html">Let's Start</a> -->
 9 |         <a class="action-btn" href="/vue/basic.html">Let's Start</a>
10 |         <a href="https://www.producthunt.com/posts/vue-cheatsheet?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-vue&#0045;cheatsheet"
11 |             target="_blank"><img
12 |                 :src="`https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=445414&theme=${isDark ? 'dark' : 'light'}`"
13 |                 alt="Vue&#0032;CheatSheet - The&#0032;Ultimate&#0032;Vue&#0032;CheatSheet&#0032;For&#0032;Vue&#0044;&#0032;Vue&#0032;Router&#0032;&#0038;&#0032;Pinia | Product Hunt"
14 |                 style="width: auto; height: 40px;border: 1px solid #fff;border-radius: 6px;" width="auto"
15 |                 height="40" /></a>
16 |     </div>
17 | </template>
18 | 
19 | <style>
20 | .action-btn {
21 |     padding: 0.5rem 1rem;
22 |     border-radius: 0.5rem;
23 |     background-color: var(--vp-c-brand-2);
24 |     color: #fff;
25 |     font-weight: 600;
26 |     text-decoration: none;
27 |     transition: all 0.3s;
28 | }
29 | </style>
30 | 


--------------------------------------------------------------------------------
/content/.vitepress/theme/components/DocFooter.vue:
--------------------------------------------------------------------------------
 1 | <script lang="ts" setup>
 2 | import SubscribeForm from './SubscribeForm.vue';
 3 | </script>
 4 | 
 5 | <template>
 6 |     <div class="rounded-lg my-8 p-6 border border-[var(--vp-c-divider)] bg-gray-100 dark:bg-zinc-800">
 7 |         <SubscribeForm></SubscribeForm>
 8 |     </div>
 9 | </template>
10 | 


--------------------------------------------------------------------------------
/content/.vitepress/theme/components/Footer.vue:
--------------------------------------------------------------------------------
 1 | <script lang="ts" setup>
 2 | import { useData } from 'vitepress';
 3 | import { useSidebar } from 'vitepress/theme';
 4 | import SocialLinks from './SocialLinks.vue';
 5 | import SubscribeForm from './SubscribeForm.vue';
 6 | 
 7 | const { frontmatter } = useData()
 8 | const { hasSidebar } = useSidebar()
 9 | 
10 | 
11 | const firstColLinks = [
12 |     { title: 'Freebies', link: 'https://themeselection.com/item/category/download-free-admin-templates/' },
13 |     { title: 'UI Kits', link: 'https://themeselection.com/item/category/ui-kits/' },
14 |     { title: 'Blog', link: 'https://themeselection.com/blog/' },
15 | ]
16 | 
17 | const secondColLinks = [
18 |     { title: 'Vue.js Admin Templates', link: 'https://themeselection.com/item/category/vuejs-admin-templates/' },
19 |     { title: 'Nuxt.js Admin Templates', link: 'https://themeselection.com/item/category/nuxt-admin-template/' },
20 |     { title: 'Free Admin Templates', link: 'https://themeselection.com/item/category/free-admin-templates/' },
21 | ]
22 | </script>
23 | 
24 | <template>
25 |     <footer v-if="frontmatter.footer !== false" class="pt-12 bg-gray-100 dark:bg-zinc-800"
26 |         :class="{ 'hidden': hasSidebar }">
27 |         <div class="container mx-auto flex flex-wrap gap-10 lg:justify-between mb-10 px-6 sm:px-12 lg:px-16">
28 |             <div class="flex flex-col gap-4 items-start">
29 |                 <a v-for="(link, index) in firstColLinks" :key="index" target="_blank" rel="noreferrer" :href="link.link"
30 |                     class="text-gray-500 hover:text-[var(--vp-c-brand-1)] dark:text-gray-400 dark:hover:text-[var(--vp-c-brand-1)]">{{
31 |                         link.title
32 |                     }}</a>
33 |             </div>
34 |             <div class="flex flex-col items-start gap-4">
35 |                 <a v-for="(link, index) in secondColLinks" :key="index" target="_blank" rel="noreferrer" :href="link.link"
36 |                     class="text-gray-500 hover:text-[var(--vp-c-brand-1)] dark:text-gray-400 dark:hover:text-[var(--vp-c-brand-1)]">{{
37 |                         link.title
38 |                     }}</a>
39 |             </div>
40 |             <div class="col-span-2 max-w-lg">
41 |                 <SubscribeForm></SubscribeForm>
42 |                 <SocialLinks class="mt-6"></SocialLinks>
43 |             </div>
44 |         </div>
45 |         <hr class="divider">
46 |         <div
47 |             class="container mx-auto flex flex-wrap items-center justify-between border-gray-300 dark:border-zinc-700 pt-8 pb-6 gap-3 px-6 sm:px-12 lg:px-16">
48 |             <a href="https://themeselection.com/" target="_blank" class="themeselection-logo" alt="ThemeSelection"> </a>
49 |             <div class="flex items-center gap-x-1">
50 |                 <span>© 2024-Present, Made with</span>
51 |                 <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24">
52 |                     <path fill="red" fill-rule="evenodd"
53 |                         d="M12 3.942a6.351 6.351 0 0 1 4.305-1.692c1.726 0 3.374.71 4.58 1.96a6.7 6.7 0 0 1 1.865 4.652a6.7 6.7 0 0 1-1.865 4.652c-.796.825-1.591 1.67-2.39 2.518c-1.624 1.724-3.265 3.467-4.97 5.108l-.003.004a2.213 2.213 0 0 1-3.113-.069l-7.295-7.561c-2.485-2.577-2.485-6.727 0-9.303A6.328 6.328 0 0 1 12 3.942"
54 |                         clip-rule="evenodd" />
55 |                 </svg>
56 |                 <span>by <a href="https://themeselection.com/" rel="noreferrer" target="_blank"
57 |                         class="text-[var(--vp-c-brand-1)]">ThemeSelection</a></span>
58 |             </div>
59 |         </div>
60 |     </footer>
61 | </template>
62 | 
63 | <style scoped lang="scss">
64 | html {
65 | 
66 |     .themeselection-logo {
67 |         width: 192px;
68 |         height: 40px;
69 |         background-image: url('/brand-logo-small-light.png');
70 |         background-repeat: no-repeat;
71 |         background-size: contain;
72 |     }
73 | 
74 |     &.dark {
75 |         .divider {
76 |             border-color: var(--vp-c-gray-3);
77 |         }
78 | 
79 |         .themeselection-logo {
80 |             background-image: url('/brand-logo-small-dark.png');
81 |         }
82 |     }
83 | }
84 | </style>
85 | 


--------------------------------------------------------------------------------
/content/.vitepress/theme/components/GithubCounterBtn.vue:
--------------------------------------------------------------------------------
 1 | <script lang="ts" setup>
 2 | import { useData } from 'vitepress';
 3 | import GithubButton from 'vue-github-button';
 4 | 
 5 | const { isDark } = useData()
 6 | 
 7 | console.log('theme :>> ', isDark.value);
 8 | </script>
 9 | 
10 | <template>
11 |     <div class="widget">
12 |         <!-- Place this tag where you want the button to render. -->
13 |         <github-button href="https://github.com/themeselection/vue-cheatsheet"
14 |             :data-color-scheme="`no-preference: ${isDark ? 'dark' : 'light'};light: ${isDark ? 'dark' : 'light'} ; dark: ${isDark ? 'dark' : 'light'}`"
15 |             data-icon="octicon-star" data-size="large" data-show-count="true"
16 |             aria-label="Star themeselection/vue-cheatsheet on GitHub">Star</github-button>
17 |     </div>
18 | </template>
19 | 
20 | <style lang="scss">
21 | .widget {
22 |     display: block;
23 |     margin-inline-start: 0.75rem;
24 |     margin-block-start: 0.375rem;
25 | 
26 |     .social-count {
27 |         display: none;
28 |     }
29 | }
30 | </style>
31 | 


--------------------------------------------------------------------------------
/content/.vitepress/theme/components/SocialLinks.vue:
--------------------------------------------------------------------------------
 1 | <script lang="ts" setup>
 2 | 
 3 | </script>
 4 | 
 5 | <template>
 6 |     <div class="flex items-center gap-3">
 7 |         <a target="_blank" rel="noreferrer" href="https://github.com/themeselection" alt="ThemeSelection GitHub"
 8 |             class="hover:text-[var(--vp-c-brand-1)]">
 9 |             <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24">
10 |                 <g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5">
11 |                     <path
12 |                         d="M16 22.027v-2.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7a5.44 5.44 0 0 0-1.5-3.75a5.07 5.07 0 0 0-.09-3.77s-1.18-.35-3.91 1.48a13.38 13.38 0 0 0-7 0c-2.73-1.83-3.91-1.48-3.91-1.48A5.07 5.07 0 0 0 5 5.797a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7a3.37 3.37 0 0 0-.94 2.58v2.87">
13 |                     </path>
14 |                     <path d="M9 20.027c-3 .973-5.5 0-7-3"></path>
15 |                 </g>
16 |             </svg>
17 |         </a>
18 |         <a target="_blank" rel="noreferrer" href="https://twitter.com/Theme_Selection" alt="ThemeSelection Twitter"
19 |             class="hover:text-[var(--vp-c-brand-1)]">
20 |             <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24">
21 |                 <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"
22 |                     d="M23 3.01s-2.018 1.192-3.14 1.53a4.48 4.48 0 0 0-7.86 3v1a10.66 10.66 0 0 1-9-4.53s-4 9 5 13a11.64 11.64 0 0 1-7 2c9 5 20 0 20-11.5c0-.278-.028-.556-.08-.83C21.94 5.674 23 3.01 23 3.01" />
23 |             </svg>
24 |         </a>
25 |         <a target="_blank" rel="noreferrer" href="https://www.facebook.com/ThemeSelections/" alt="ThemeSelection Facebook"
26 |             class="hover:text-[var(--vp-c-brand-1)]">
27 |             <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24">
28 |                 <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"
29 |                     d="M17 2h-3a5 5 0 0 0-5 5v3H6v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
30 |             </svg>
31 |         </a>
32 |         <a target="_blank" rel="noreferrer" href="https://dribbble.com/themeselection/" alt="ThemeSelection Dribbble"
33 |             class="hover:text-[var(--vp-c-brand-1)]">
34 |             <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24">
35 |                 <g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5">
36 |                     <path d="M2 12c0 5.523 4.477 10 10 10s10-4.477 10-10S17.523 2 12 2S2 6.477 2 12" />
37 |                     <path d="M16.673 20.844C15.5 14 12.5 8 8.5 2.63" />
38 |                     <path d="M2.067 10.84C6 11 15.283 10.5 19.142 5m2.826 7.81C15.344 10.84 7.5 14 5.23 19.361" />
39 |                 </g>
40 |             </svg>
41 |         </a>
42 |     </div>
43 | </template>
44 | 


--------------------------------------------------------------------------------
/content/.vitepress/theme/components/SubscribeAlert.vue:
--------------------------------------------------------------------------------
 1 | <script lang="ts" setup>
 2 | import { ref } from 'vue';
 3 | 
 4 | const isSuccess = ref()
 5 | const params = new URLSearchParams(window.location.search)
 6 | isSuccess.value = params.get('success') === 'success'
 7 | </script>
 8 | 
 9 | <template>
10 |     <div class="mb-16 px-8 py-3 bg-emerald-500 text-white font-medium dark:bg-emerald-600 mb-12" v-if="isSuccess">
11 |         <p class="text-center">You have successfully subscribed to our newsletter
12 |         </p>
13 |     </div>
14 | </template>
15 | 


--------------------------------------------------------------------------------
/content/.vitepress/theme/components/SubscribeForm.vue:
--------------------------------------------------------------------------------
 1 | <script lang="ts" setup>
 2 | </script>
 3 | 
 4 | <template>
 5 |     <p class="font-semibold leading-7 text-lg text-[var(--vp-c-brand-1)]">Subscribe to our newsletter
 6 |     </p>
 7 |     <p class="my-4 mt-2 text-gray-500 dark:text-gray-400">A weekly latest Articles, UI Kits, Free & Premium Resources.</p>
 8 |     <form action="https://themeselection.com/mailster/subscribe" method="post" class="flex items-center gap-4">
 9 | 
10 |         <input name="_action" type="hidden" value="subscribe">
11 |         <input name="_timestamp" type="hidden" value="1706684888">
12 |         <input name="_referer" type="hidden" value="extern">
13 |         <input name="_nonce" type="hidden" value="342601d290">
14 |         <input name="formid" type="hidden" value="1">
15 |         <input type="email" required name="email"
16 |             class="py-3 px-4 block w-full bg-white dark:bg-zinc-900 border-transparent rounded-lg text-sm focus:ring-2 focus:ring-emerald-500 dark:border-transparent dark:text-gray-400 dark:focus:ring-emerald-600"
17 |             placeholder="john@mail.com" />
18 |         <button type="submit"
19 |             class="py-3 px-4 inline-flex items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-[var(--vp-c-brand-1)] focus:ring-2 focus:outline-none focus:ring-emerald-500 text-white hover:bg-emerald-700 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-emerald-600">Subscribe</button>
20 |     </form>
21 | </template>
22 | 


--------------------------------------------------------------------------------
/content/.vitepress/theme/components/VueThemesCallOut.vue:
--------------------------------------------------------------------------------
 1 | <script lang="ts" setup>
 2 | 
 3 | </script>
 4 | 
 5 | <template>
 6 |     <div class="mb-16 px-8 py-6 bg-gray-100 dark:bg-zinc-800 mb-12 text-center">
 7 |         <p>✨&nbsp; Supercharge your development process with our free & premium <a
 8 |                 href="https://themeselection.com/item/category/vuejs-admin-templates/" rel="noreferrer" target="_blank"
 9 |                 class="text-green-600 dark:text-green-300 font-medium hover:underline">Vue js admin templates</a></p>
10 |     </div>
11 | </template>
12 | 


--------------------------------------------------------------------------------
/content/.vitepress/theme/custom.scss:
--------------------------------------------------------------------------------
 1 | :root {
 2 |     --vp-c-brand-1: #42b883;
 3 |     --vp-c-brand-2: #42d392;
 4 |     --vp-c-brand-3: #35eb9a;
 5 | 
 6 |     // Hero title
 7 |     --vp-home-hero-name-color: transparent;
 8 |     --vp-home-hero-name-background: var(--vp-c-brand-2);
 9 | 
10 |     --vp-layout-max-width: 1344px;
11 |     --vp-nav-logo-height: 2.5rem;
12 | }
13 | 
14 | .VPHero {
15 |     &.VPHomeHero {
16 |         margin-top: 1.25rem;
17 |         margin-bottom: 2.25rem;
18 |     }
19 | }
20 | 
21 | .VPButton.brand {
22 |     background-color: var(--vp-c-brand-2) !important
23 | }
24 | 
25 | .VPButton {
26 |     border-radius: 0.5rem !important;
27 | }
28 | 
29 | @media (min-width: 960px) {
30 |     .tagline {
31 |         font-size: 22px !important;
32 |         opacity: 80%;
33 |     }
34 | }
35 | 
36 | .VPFeature {
37 |     background: transparent !important;
38 |     border-color: var(--vp-c-gray-3) !important;
39 | 
40 |     &:hover {
41 |         .title {
42 |             color: var(--vp-c-brand-2) !important;
43 |         }
44 | 
45 |         border-color: var(--vp-c-brand-2) !important;
46 |     }
47 | }
48 | 
49 | /* Style home logo */
50 | .VPContent.is-home .VPHomeHero .VPImage {
51 |     width: 100%;
52 |     height: auto;
53 | }
54 | 
55 | .VPContent {
56 |     .container {
57 |         max-width: 1280px !important;
58 |     }
59 | }
60 | 
61 | // Restore search bg
62 | @media (min-width: 768px) {
63 |     button.DocSearch-Button {
64 |         background-color: var(--vp-c-bg-alt);
65 |     }
66 | 
67 |     .VPHero {
68 |         &.VPHomeHero {
69 |             margin-top: 3.5rem;
70 |             margin-bottom: 2.25rem;
71 |         }
72 |     }
73 | }
74 | 
75 | // Enable below after: https://github.com/vuejs/vitepress/pull/3522
76 | .VPNav:has(~ .is-home) .title > span {
77 |   display: none;
78 | }
79 | 


--------------------------------------------------------------------------------
/content/.vitepress/theme/index.ts:
--------------------------------------------------------------------------------
 1 | import DefaultTheme from 'vitepress/theme';
 2 | import { h } from 'vue';
 3 | import ActionButtons from './components/ActionButtons.vue';
 4 | import DocFooter from './components/DocFooter.vue';
 5 | import GithubCounterBtn from './components/GithubCounterBtn.vue';
 6 | import SubscribeAlert from './components/SubscribeAlert.vue';
 7 | import HomeVueThemesCallOut from './components/VueThemesCallOut.vue';
 8 | import './custom.scss';
 9 | import './tailwind.css';
10 | 
11 | export default {
12 |     extends: DefaultTheme,
13 |     Layout() {
14 |         return h(DefaultTheme.Layout, null, {
15 |             'home-features-before': h(HomeVueThemesCallOut),
16 |             'doc-after': h(DocFooter),
17 |             'home-hero-before': h(SubscribeAlert),
18 |             'home-hero-actions-after': h(ActionButtons),
19 |             'nav-bar-content-after': h(GithubCounterBtn),
20 |         })
21 |     }
22 | }
23 | 


--------------------------------------------------------------------------------
/content/.vitepress/theme/tailwind.css:
--------------------------------------------------------------------------------
1 | @tailwind base;
2 | @tailwind components;
3 | @tailwind utilities;


--------------------------------------------------------------------------------
/content/changelog.md:
--------------------------------------------------------------------------------
1 | # Changelog
2 | 
3 | ## 2024-01-31
4 | 
5 | - Initial Release
6 | 


--------------------------------------------------------------------------------
/content/contributing.md:
--------------------------------------------------------------------------------
 1 | # Contributing
 2 | 
 3 | Great! We appreciate your willingness to contribute!
 4 | 
 5 | The following are some guidelines for contributing to the Vue cheatsheet. These guidelines are meant to provide direction, but they are not strict rules. Please use your own judgment, and feel free to suggest changes to [this document](https://github.com/themeselection/vue-cheatsheet/blob/master/src/pages/contributing.md).
 6 | 
 7 | ## Running the project locally
 8 | 
 9 | 1. We recommend [pnpm](https://pnpm.io/installation) package manager. You can download it from [here](https://pnpm.io/installation). If you don't want to use `pnpm`, you can use `npm` or `yarn` instead.
10 | 
11 | 2. Clone the project, and install the dependencies:
12 | 
13 | ```shell
14 | git clone https://github.com/themeselection/vue-cheatsheet.git
15 | cd vue-cheatsheet
16 | pnpm install
17 | ```
18 | 
19 | 3. Create a new branch:
20 | 
21 | ```shell
22 | git branch new_content
23 | git checkout new_content
24 | ```
25 | 
26 | 4. Change/upgrade/add the changes you want
27 | 5. Update the `README` if needed
28 | 6. `Add`, `commit` and `push` your changes to GitHub:
29 | 
30 | ```shell
31 | git add .
32 | git commit -m 'Your commit message'
33 | git push origin new_content
34 | ```
35 | 
36 | 7. Open a [pull request](https://github.com/themeselection/vue-cheatsheet/pulls)
37 | 
38 | ## You can
39 | 
40 | - Submit changes to the cheatsheet
41 | - Improve existing topics and examples
42 | - Add new topics or resources
43 | - Ask for new topics by creating an [Issue](https://github.com/themeselection/vue-cheatsheet/issues)
44 | - Read the issues, fork the project and do a [Pull Request](https://github.com/themeselection/vue-cheatsheet/pulls)
45 | - Report any kind of error or typo by creating an [Issue](https://github.com/themeselection/vue-cheatsheet/issues) or fix it with a [Pull Request](https://github.com/themeselection/vue-cheatsheet/pulls)
46 | 
47 | ## What you need to know
48 | 
49 | If you don't know where to start:
50 | 
51 | - [Mastering Markdown](https://guides.github.com/features/mastering-markdown/)
52 | - [Mastering Issues](https://guides.github.com/features/issues/)
53 | - [Forking Projects](https://guides.github.com/activities/forking/)
54 | - And read the rest of the [GitHub Guides](https://guides.github.com/)
55 | 


--------------------------------------------------------------------------------
/content/index.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | # https://vitepress.dev/reference/default-theme-home-page
 3 | layout: home
 4 | 
 5 | hero:
 6 |   name: "Vue Cheatsheet"
 7 |   tagline: The only VueJS cheatsheet you will ever need
 8 |   image:
 9 |     src: /hero-image.png
10 |     alt: Vue Cheatsheet
11 | 
12 | features:
13 |   - title: Vue
14 |     icon: 
15 |       src: /vue-logo.png
16 |       alt: 'Vue'
17 |     details: Accelerate your vue learning & improve your skills with our comprehensive Vue 3 cheatsheet.
18 |     link: /vue/basic
19 |   - title: Vue Router
20 |     icon: 
21 |       src: /vue-router-logo.png
22 |       alt: 'Vue Router'
23 |     details: Your Simple Guide to Vue Router, Making Routes as Easy as Following a Map.
24 |     link: /vue-router/basic
25 |   - title: Pinia
26 |     icon: 
27 |       src: /pinia-logo.png
28 |       alt: 'Pinia'
29 |     details: Your vue js cheatsheet for Pina, perfect for vue beginners and beyond.
30 |     link: /pinia/basic
31 | ---
32 | 


--------------------------------------------------------------------------------
/content/pinia/basic.md:
--------------------------------------------------------------------------------
  1 | # Pinia
  2 | 
  3 | Pinia is a store library for Vue which allows you to share a state across components.
  4 | 
  5 | ::: tip Note
  6 | We have used Composition API in this cheatsheet as it is recommended.
  7 | :::
  8 | 
  9 | ::: info In Setup Stores
 10 | 
 11 | `ref()`s become state properties.
 12 | 
 13 | `computed()`s become getters.
 14 | 
 15 | `function()`s become actions.
 16 | :::
 17 | 
 18 | ## Define Store
 19 | 
 20 | ```js
 21 | export const useCounterStore = defineStore('counter', () => {
 22 | 
 23 |   // States 
 24 |   const count = ref(0)
 25 |   const name = ref('Eduardo')
 26 | 
 27 |   // Getters
 28 |   const doubleCount = computed(() => count.value * 2)
 29 | 
 30 |   // Actions
 31 |   function increment() {
 32 |     count.value++
 33 |   }
 34 | 
 35 |   return { count, name, doubleCount, increment }
 36 | })
 37 | ```
 38 | 
 39 | ## Use store
 40 | 
 41 | ```vue
 42 | <script setup>
 43 | import { useCounterStore } from '@/stores/counter'
 44 | 
 45 | // access the `store` variable anywhere in the component ✨
 46 | const store = useCounterStore()
 47 | 
 48 | // Another way to use the store
 49 | // Destructuring from the store
 50 | 
 51 | // This will also extract refs for properties added by plugins
 52 | // but skip any action or non reactive (non ref/reactive) property
 53 | const { name, doubleCount } = storeToRefs(store)
 54 | 
 55 | // the increment action can just be destructured
 56 | const { increment } = store
 57 | 
 58 | </script>
 59 | ```
 60 | 
 61 | ## States
 62 | 
 63 | ### Define a state
 64 | 
 65 | ```js
 66 | export const useCounterStore = defineStore('counter', () => {
 67 |   // States 
 68 |   const count = ref(0) // [!code hl]
 69 | 
 70 |   return { count }
 71 | })
 72 | ```
 73 | 
 74 | ### Accessing the States
 75 | 
 76 | ```vue
 77 | <script setup>
 78 |   const store = useCounterStore()
 79 |   console.log(store.count)
 80 | </script>
 81 | ```
 82 | 
 83 | ### Resetting the States
 84 | 
 85 | In Setup Stores, you need to create your own `$reset()` method
 86 | 
 87 | ```js
 88 | export const useCounterStore = defineStore('counter', () => {
 89 |     const count = ref(0)
 90 | 
 91 |     function $reset() {
 92 |     count.value = 0
 93 |     }
 94 | })
 95 | ```
 96 | 
 97 | ### Mutating the state
 98 | 
 99 | We use `$patch` method for mutating the state.
100 | 
101 | ```vue
102 | <template>
103 |     <button @click="store.$patch({ count: 12 })">patch</button>
104 | </template>
105 | ```
106 | 
107 | ### Replacing the state
108 | 
109 | ```vue
110 | <template>
111 |     <button @click="store.$state = { count: 12 }">Replace</button>
112 | </template>
113 | ```
114 | 
115 | ### Subscribing to the state
116 | 
117 | You can watch the state and its changes through the `$subscribe()` method of a store.
118 | 
119 | ```js
120 | store.$subscribe((mutation, state) => {
121 |   // import { MutationType } from 'pinia'
122 |   mutation.type // 'direct' | 'patch object' | 'patch function'
123 |   // same as cartStore.$id
124 |   mutation.storeId // 'cart'
125 |   // only available with mutation.type === 'patch object'
126 |   mutation.payload // patch object passed to cartStore.$patch()
127 | 
128 |   // persist the whole state to the local storage whenever it changes
129 |   localStorage.setItem('counter', JSON.stringify(state))
130 | })
131 | ```
132 | 
133 | ## Store computed Properties aka Getters
134 | 
135 | Getters are exactly the equivalent of computed values for the state of a Store.
136 | 
137 | ### Define a Getter
138 | 
139 | ```js
140 | export const useCounterStore = defineStore('counter', () => {
141 | 
142 |   const count = ref(0)
143 | 
144 |   const doubleCount = computed(() => count.value * 2) // [!code hl]
145 | 
146 |   return { count, doubleCount  }
147 | })
148 | ```
149 | 
150 | ### Accessing Getters
151 | 
152 | ```js
153 | <script setup>
154 | import { useCounterStore } from './counterStore'
155 | 
156 | const store = useCounterStore()
157 | </script>
158 | 
159 | <template>
160 |   <p>Double count is {{ store.doubleCount }}</p>
161 | </template>
162 | ```
163 | 
164 | ### Accessing Other Getters
165 | 
166 | ```js
167 | export const useCounterStore = defineStore('counter', () => {
168 | 
169 |     const count = ref(0)
170 |     const doubleCount = computed(() => count.value * 2)
171 | 
172 |     const doubleCountPlusOne = computed(() => doubleCount.value + 1) // [!code hl]
173 | 
174 |     return { count, doubleCount, doubleCountPlusOne}
175 | })
176 | ```
177 | 
178 | ### Accessing Other Store Getters
179 | 
180 | ```js
181 | import { useOtherStore } from './other-store'
182 | 
183 | export const useStore = defineStore('main', {
184 | 
185 |   const otherGetter = computed(() => {
186 |         const otherStore = useOtherStore()
187 |         return state.localData + otherStore.data
188 |   })
189 | })
190 | ```
191 | 
192 | ## Store methods aka Actions
193 | 
194 | Actions are the equivalent of methods in components.
195 | 
196 | ### Defining an action
197 | 
198 | ```js
199 | export const useCounterStore = defineStore('counter', () => {
200 | 
201 |   const count = ref(0)
202 | 
203 |   function increment() { // [!code hl]
204 |     count.value++ // [!code hl]
205 |   } // [!code hl]
206 | 
207 |   return { count, increment }
208 | })
209 | ```
210 | 
211 | ### Accessing Actions
212 | 
213 | ```vue
214 | <script setup>
215 | import { useCounterStore } from '@/stores/TaskStore.js';
216 | 
217 | const counterStore = useCounterStore()
218 | </script>
219 | 
220 | <template>
221 |     <button @click="counterStore.increment">increment</button>
222 | </template>
223 | ```
224 | 
225 | ### Accessing other store actions
226 | 
227 | ```js
228 | import { useAuthStore } from './auth-store'
229 | 
230 | export const useSettingsStore = defineStore('settings', {
231 | 
232 |   const preferences = ref([])
233 |   
234 |   const fetchPreferences = () => {
235 |     const auth = useAuthStore() 
236 | 
237 |     if(auth.isAuthenticated) 
238 |       preferences = await fetchPreferences() 
239 |     else
240 |       throw new Error('User must be authenticated')
241 |   }
242 |   
243 | })
244 | ```
245 | 
246 | ## Plugin
247 | 
248 | A Pinia plugin is a function that optionally returns properties to be added to a store. It takes one optional argument, a context:
249 | 
250 | ```js
251 | export function myPiniaPlugin(context) {
252 |   context.pinia // the pinia created with `createPinia()`
253 |   context.app // the current app created with `createApp()` (Vue 3 only)
254 |   context.store // the store the plugin is augmenting
255 |   context.options // the options object defining the store passed to `defineStore()`
256 |   // ...
257 | }
258 | 
259 | pinia.use(myPiniaPlugin)
260 | ```
261 | 
262 | ```js
263 | import { markRaw } from 'vue'
264 | // adapt this based on where your router is
265 | import { router } from './router'
266 | 
267 | pinia.use(() => ({ hello: 'world' }))
268 | 
269 | pinia.use(({ store }) => {
270 |   store.router = markRaw(router)
271 | })
272 | 
273 | pinia.use(({ store }) => {
274 |   store.$subscribe(() => {
275 |     // react to store changes
276 |   })
277 |   store.$onAction(() => {
278 |     // react to store actions
279 |   })
280 | })
281 | ```
282 | 


--------------------------------------------------------------------------------
/content/public/brand-logo-small-dark.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/brand-logo-small-dark.png


--------------------------------------------------------------------------------
/content/public/brand-logo-small-light.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/brand-logo-small-light.png


--------------------------------------------------------------------------------
/content/public/google6f658ffc1e5996cb.html:
--------------------------------------------------------------------------------
1 | google-site-verification: google6f658ffc1e5996cb.html


--------------------------------------------------------------------------------
/content/public/hero-image.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/hero-image.png


--------------------------------------------------------------------------------
/content/public/hero.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/hero.png


--------------------------------------------------------------------------------
/content/public/logos/android-icon-192x192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/android-icon-192x192.png


--------------------------------------------------------------------------------
/content/public/logos/apple-icon-114x114.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/apple-icon-114x114.png


--------------------------------------------------------------------------------
/content/public/logos/apple-icon-120x120.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/apple-icon-120x120.png


--------------------------------------------------------------------------------
/content/public/logos/apple-icon-144x144.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/apple-icon-144x144.png


--------------------------------------------------------------------------------
/content/public/logos/apple-icon-152x152.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/apple-icon-152x152.png


--------------------------------------------------------------------------------
/content/public/logos/apple-icon-180x180.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/apple-icon-180x180.png


--------------------------------------------------------------------------------
/content/public/logos/apple-icon-57x57.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/apple-icon-57x57.png


--------------------------------------------------------------------------------
/content/public/logos/apple-icon-60x60.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/apple-icon-60x60.png


--------------------------------------------------------------------------------
/content/public/logos/apple-icon-72x72.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/apple-icon-72x72.png


--------------------------------------------------------------------------------
/content/public/logos/apple-icon-76x76.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/apple-icon-76x76.png


--------------------------------------------------------------------------------
/content/public/logos/favicon-16x16.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/favicon-16x16.png


--------------------------------------------------------------------------------
/content/public/logos/favicon-32x32.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/favicon-32x32.png


--------------------------------------------------------------------------------
/content/public/logos/favicon-96x96.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/favicon-96x96.png


--------------------------------------------------------------------------------
/content/public/logos/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/logos/favicon.ico


--------------------------------------------------------------------------------
/content/public/logos/manifest.json:
--------------------------------------------------------------------------------
 1 | {
 2 |  "name": "App",
 3 |  "icons": [
 4 |   {
 5 |    "src": "\/android-icon-36x36.png",
 6 |    "sizes": "36x36",
 7 |    "type": "image\/png",
 8 |    "density": "0.75"
 9 |   },
10 |   {
11 |    "src": "\/android-icon-48x48.png",
12 |    "sizes": "48x48",
13 |    "type": "image\/png",
14 |    "density": "1.0"
15 |   },
16 |   {
17 |    "src": "\/android-icon-72x72.png",
18 |    "sizes": "72x72",
19 |    "type": "image\/png",
20 |    "density": "1.5"
21 |   },
22 |   {
23 |    "src": "\/android-icon-96x96.png",
24 |    "sizes": "96x96",
25 |    "type": "image\/png",
26 |    "density": "2.0"
27 |   },
28 |   {
29 |    "src": "\/android-icon-144x144.png",
30 |    "sizes": "144x144",
31 |    "type": "image\/png",
32 |    "density": "3.0"
33 |   },
34 |   {
35 |    "src": "\/android-icon-192x192.png",
36 |    "sizes": "192x192",
37 |    "type": "image\/png",
38 |    "density": "4.0"
39 |   }
40 |  ]
41 | }


--------------------------------------------------------------------------------
/content/public/pinia-logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/pinia-logo.png


--------------------------------------------------------------------------------
/content/public/robots.txt:
--------------------------------------------------------------------------------
1 | User-agent: *
2 | Disallow:
3 | 


--------------------------------------------------------------------------------
/content/public/vue-cheatsheet-logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/vue-cheatsheet-logo.png


--------------------------------------------------------------------------------
/content/public/vue-logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/vue-logo.png


--------------------------------------------------------------------------------
/content/public/vue-router-logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themeselection/vue-cheatsheet/d36c2dc747aeabfe7cd9e462a9e2ef20f53d61c9/content/public/vue-router-logo.png


--------------------------------------------------------------------------------
/content/vue-router/advanced.md:
--------------------------------------------------------------------------------
  1 | # Advanced
  2 | 
  3 | ## Scroll Behavior
  4 | 
  5 | With client-side routing, we might want to scroll to the top on a new route, or keep the scroll position like a real page reload.
  6 | 
  7 | ```ts
  8 | const router = createRouter({
  9 |   history: createWebHashHistory(),
 10 |   routes: [...],
 11 |   scrollBehavior (to, from, savedPosition) {
 12 |     // return desired position
 13 |     return { top : 0 }
 14 | 
 15 |     // always scroll 10px above the element #main
 16 |     return { el: '#main', top: 10 }
 17 | 
 18 |     // Returning the savedPosition
 19 |     return (savePosition ? savedPosition : { top : 0 })
 20 | 
 21 |     // "scroll to anchor" behavior & "scroll behavior to smooth"
 22 |     if (to.hash)
 23 |       return { el: to.hash, behavior: 'smooth' }
 24 |     
 25 |     // Delaying the scroll
 26 |     return new Promise((resolve, reject) => {
 27 |       setTimeout(() => {
 28 |         resolve({ left: 0, top: 0 })
 29 |       }, 500)
 30 |     })
 31 |   }
 32 | })
 33 | ```
 34 | 
 35 | ## Navigation Guards & Navigation Flow
 36 | 
 37 | They are primarily used to guard navigations either by redirecting it or canceling it.
 38 | 
 39 | 1. Navigation triggered.
 40 | 2. Call `beforeRouteLeave` guards in deactivated components.
 41 | 3. Call global `beforeEach` guards.
 42 | 4. Call `beforeRouteUpdate` guards in reused components.
 43 | 5. Call `beforeEnter` in route configs.
 44 | 6. Resolve async route components.
 45 | 7. Call `beforeRouteEnter` in activated components.
 46 | 8. Call global `beforeResolve` guards.
 47 | 9. Navigation is confirmed.
 48 | 10. Call global `afterEach` hooks.
 49 | 11. DOM updates triggered.
 50 | 12. Call callbacks passed to `next` in `beforeRouteEnter` guards with instantiated instances.
 51 | 
 52 | Every guard function receives two arguments:
 53 | 
 54 | `to`: the target route location in a normalized format being navigated to.
 55 | 
 56 | `from`: the current route location in a normalized format being navigated away from.
 57 | 
 58 | ## RouterView slot
 59 | 
 60 | The RouterView component exposes a slot that can be used to render the route component
 61 | 
 62 | ```vue
 63 | <template>
 64 |   <router-view v-slot="{ Component }">
 65 |     <transition>
 66 |       <keep-alive>
 67 |         <component :is="Component" :some-prop="prop"/>
 68 |       </keep-alive>
 69 |     </transition>
 70 |   </router-view>
 71 | </template>
 72 | ```
 73 | 
 74 | ## Transitions
 75 | 
 76 | ```vue
 77 | <template>
 78 |   <RouterView v-slot="{ Component }">
 79 |     <transition name="fade">
 80 |       <component :is="Component" />
 81 |     </transition>
 82 |   </RouterView>
 83 | </template>
 84 | ```
 85 | 
 86 | ### Per-Route Transition
 87 | 
 88 | ```ts
 89 | // Apply different transitions on each route's.
 90 | 
 91 | const routes = [
 92 |   {
 93 |     path: '/custom-transition',
 94 |     component: PanelLeft,
 95 |     meta: { transition: 'slide-left' },
 96 |   },
 97 |   {
 98 |     path: '/other-transition',
 99 |     component: PanelRight,
100 |     meta: { transition: 'slide-right' },
101 |   },
102 | ]
103 | ```
104 | 
105 | ```vue
106 | <template>
107 |   <RouterView v-slot="{ Component, route }">
108 |     <!-- Use a custom transition or fallback to `fade` -->
109 |     <transition :name="route.meta.transition || 'fade'">
110 |       <component :is="Component" />
111 |     </transition>
112 |   </RouterView>
113 | </template>
114 | ```
115 | 
116 | ## Route Meta fields
117 | 
118 | Attach arbitrary information to routes like: transition names, or roles to control who can access the route, etc.
119 | 
120 | ```js
121 | const routes = [
122 |   {
123 |     path: '/posts',
124 |     component: PostsLayout,
125 |     children: [
126 |       {
127 |         path: 'new',
128 |         component: PostsNew,
129 |         // only authenticated users can create posts
130 |         meta: { requiresAuth: true },
131 |       },
132 |       {
133 |         path: ':id',
134 |         component: PostsDetail,
135 |         // anybody can read a post
136 |         meta: { requiresAuth: false },
137 |       },
138 |     ],
139 |   },
140 | ]
141 | ```
142 | 


--------------------------------------------------------------------------------
/content/vue-router/basic.md:
--------------------------------------------------------------------------------
  1 | # Vue Router
  2 | 
  3 | ## Basic Route Setup
  4 | 
  5 | ```ts
  6 | // src/route/index.ts
  7 | 
  8 | const router = createRouter({
  9 |   ...
 10 |   routes: [
 11 |     {
 12 |       path: '/',
 13 |       name: 'home', // "home" will be route name
 14 |       component: () => import('./views/HomeView.vue') // Always lazy load route components
 15 |     },
 16 |     {
 17 |       path: '/about',
 18 |       name: 'about',
 19 |       component: () => import('./views/About.vue')
 20 |     }
 21 |   ]
 22 | })
 23 | ```
 24 | 
 25 | Use `RouterView` to render the matched component for the current route, and use `RouterLink` component to create links to navigate between routes.
 26 | 
 27 | ```vue
 28 | <template>
 29 |  <nav>
 30 |    <RouterLink to="/">Home</RouterLink>
 31 | 
 32 |    <!-- Use route name via object syntax -->
 33 |    <RouterLink :to="{ name: 'about' }">About</RouterLink>
 34 |  </nav>
 35 |  <RouterView />
 36 | </template>
 37 | ```
 38 | 
 39 | ## Programmatic Navigation
 40 | 
 41 | Aside from using `<RouterLink>` to create anchor tags for declarative navigation, we can do this programmatically using the router's instance methods.
 42 | 
 43 | | Declarative        |      Programmatic      |
 44 | | ------------- | :-----------: |
 45 | | `<RouterLink :to="...">`   | `router.push(...)` |
 46 | | `<RouterLink :to="..." replace>`  | `router.replace(...)`    |
 47 | | `window.history.go(n)`  |   `router.go(1)`    |
 48 | 
 49 | The argument can be a string path, or a location descriptor object.
 50 | 
 51 | ```ts
 52 | // literal string path
 53 | router.push('/users/eduardo')
 54 | 
 55 | // object with path
 56 | router.push({ path: '/users/eduardo' })
 57 | 
 58 | // named route with params to let the router build the url
 59 | router.push({ name: 'user', params: { username: 'eduardo' } })
 60 | 
 61 | // with query, resulting in /register?plan=private
 62 | router.replace({ path: '/register', query: { plan: 'private' } })
 63 | 
 64 | // with hash, resulting in /about#team
 65 | router.replace({ path: '/about', hash: '#team' })
 66 | 
 67 | // go forward by one record, the same as router.forward()
 68 | router.go(1)
 69 | 
 70 | // go back by one record, the same as router.back()
 71 | router.go(-1)
 72 | ```
 73 | 
 74 | ## Dynamic Routing
 75 | 
 76 | Dynamic routes are used to match a series of routes with some params to be acquired. (Denoted by **colon** `:` )
 77 | 
 78 | ```ts
 79 | // src/router/index.ts
 80 | 
 81 | const router = createRouter({
 82 |   ...
 83 |   routes: [
 84 |     {
 85 |       path: '/product/:id', // [!code highlight]
 86 |       name: 'product',
 87 |       component: () => import('./views/ProductView.vue')
 88 |     }
 89 |   ]
 90 | })
 91 | ```
 92 | 
 93 | ``` vue
 94 | <!-- src/views/ProductView.vue -->
 95 | 
 96 | <script setup>
 97 |   import { useRoute } from 'vue-router'
 98 |   const products = [
 99 |       { id: 1, name: Computer },
100 |       { id: 2, name: Laptop },
101 |       ...
102 |   ]
103 | 
104 |   const route = useRoute()
105 |   const product = products.find(p => p.id === parseInt(route.params.id))
106 | </script>
107 | 
108 | <template>
109 |  <main>
110 |     <h1>{{ product.name }}</h1>
111 |  </main>
112 | </template>
113 | ```
114 | 
115 | ## Catch all / 404 Not found Route
116 | 
117 | ```ts {6,12}
118 | const router = createRouter({
119 |   ...
120 |   routes: [
121 |     // will match everything and put it under `$route.params.pathMatch`
122 |     {
123 |       path: '/:pathMatch(.*)*',
124 |       name: 'NotFound',
125 |       component: () => import('./views/NotFound.vue')  // Component
126 |     },
127 |     // will match anything starting with `/user-` and put it under `$route.params.afterUser`
128 |     {
129 |       path: '/user-:afterUser(.*)',
130 |       component: () => import('./views/UserGeneric.vue')  // Component
131 |     }
132 |   ]
133 | })
134 | ```
135 | 
136 | ## Routes' Matching Syntax
137 | 
138 | ```ts
139 | const routes = [
140 |   // matches /o/3549 or /o/books
141 |   { path: '/o/:orderId' },
142 |   
143 |   // /:orderId -> matches only numbers
144 |   { path: '/:orderId(\\d+)' },
145 | 
146 |   // /:productName -> matches anything else
147 |   { path: '/:productName' },
148 | 
149 |   // /:chapters -> matches /one, /one/two, /one/two/three, etc
150 |   { path: '/:chapters+' },
151 | 
152 |   // /:chapters -> matches /, /one, /one/two, /one/two/three, etc
153 |   { path: '/:chapters*' },
154 | 
155 |   // Sensitive and strict route options: match /users/posva but not:
156 |   // - /Users/posva because of sensitive: true
157 |   { path: '/users/:id', sensitive: true },
158 | 
159 |   // - /users/posva/ because of strict: true
160 |   { path: '/users/:id?', strict: true },
161 | 
162 |   // Optional parameters: match /users and /users/posva
163 |   { path: '/users/:userId?' },
164 | ]
165 | ```
166 | 
167 | ## Nested Routes
168 | 
169 | It is used when components that are nested with **multiple levels deep**.
170 | 
171 | ```
172 | /user/johnny/profile                     /user/johnny/posts
173 | +------------------+                  +-----------------+
174 | | User             |                  | User            |
175 | | +--------------+ |                  | +-------------+ |
176 | | | Profile      | |  +------------>  | | Posts       | |
177 | | |              | |                  | |             | |
178 | | +--------------+ |                  | +-------------+ |
179 | +------------------+                  +-----------------+
180 | ```
181 | 
182 | ```ts
183 | // src/router/index.ts
184 | 
185 | const router = createRouter({
186 |   ...
187 |   routes: [
188 |     {
189 |       path: '/product/:id',
190 |       name: 'product',
191 |       component: () => import('./views/ProductView.vue'),
192 |       children: [
193 |         {
194 |           path: 'reviews',
195 |           component: () => import('./views/ProductReviews.vue')
196 |         },
197 |         {
198 |           path: 'variations',
199 |           component: () => import('./views/ProductVariations.vue')
200 |         },
201 |       ]
202 |     }
203 |   ]
204 | })
205 | ```
206 | 
207 | ```vue
208 | <!-- src/views/Product.vue -->
209 | 
210 | <template>
211 |   <h1>{{ product.name }}</h1>
212 |   ...
213 |   <RouterView></RouterView>
214 | </template>
215 | ```
216 | 
217 | ## Named Views
218 | 
219 | ```ts
220 | // display multiple views at the same time
221 | const router = createRouter({
222 |   history: createWebHashHistory(),
223 |   routes: [
224 |     {
225 |       path: '/',
226 |       components: {
227 |         default: Home,
228 |         // short for LeftSidebar: LeftSidebar
229 |         LeftSidebar,
230 |         // they match the `name` attribute on `<router-view>`
231 |         RightSidebar,
232 |       },
233 |     },
234 |   ],
235 | })
236 | ```
237 | 
238 | ```vue
239 | <template>
240 |   <RouterView class="view left-sidebar" name="LeftSidebar"></RouterView>
241 |   <RouterView class="view main-content"></RouterView>
242 |   <RouterView class="view right-sidebar" name="RightSidebar"></RouterView>
243 | </template>
244 | ```
245 | 
246 | [Working Demo](https://codesandbox.io/p/sandbox/named-views-vue-router-4-examples-rd20l?file=%2Fsrc%2Frouter.js%3A25%2C9)
247 | 
248 | ## Redirect
249 | 
250 | Redirecting is also done in the routes configuration. To redirect from /home to /:
251 | 
252 | ```ts
253 | const router = createRouter({
254 |   ...
255 |   routes: [
256 |     {
257 |       path: '/home',
258 |       redirect: '/',
259 |     },
260 |     // targeting a named route
261 |     {
262 |       path: '/home',
263 |       redirect: { name: 'homepage' },
264 |     }
265 |   ]
266 | })
267 | ```
268 | 
269 | ## Alias
270 | 
271 | ```ts
272 | const routes = [
273 |   {
274 |     path: '/users/:id',
275 |     component: UsersByIdLayout,
276 |     children: [
277 |       /* 
278 |         this will render the UserDetails for these 3 URLs
279 |           - /users/24
280 |           - /users/24/profile
281 |           - /24 
282 |       */
283 |       { path: 'profile', component: UserDetails, alias: ['/:id', ''] },
284 |     ],
285 |   },
286 | ]
287 | ```
288 | 
289 | ::: info `Redirect` vs. `Alias`
290 | 
291 | A redirect means when the user visits `/home`, the URL will be replaced by `/`, and then matched as `/`.
292 | 
293 | An alias of `/` as `/home` means when the user visits `/home`, the URL remains `/home`, but it will be matched as if the user is visiting `/`.
294 | 
295 | :::
296 | 
297 | ## Passing Props to Route Components
298 | 
299 | ```vue
300 | <script setup lang='ts'>
301 | const User = {
302 |     // make sure to add a prop named exactly like the route param
303 |     props: ['id'],
304 |     template: '<div>User {{ id }}</div>'
305 |   }
306 |   
307 | const routes = [
308 |   // Boolean mode
309 |   { 
310 |     path: '/user/:id',
311 |     component: User,
312 |     props: true
313 |   },
314 | 
315 |   // Object mode
316 |   {
317 |     path: '/user/:id',
318 |     components: { default: User, sidebar: Sidebar },
319 |     props: { default: true, sidebar: false }
320 |   },
321 |     
322 |   // Function mode
323 |   {
324 |     path: '/search',
325 |     component: SearchUser,
326 |     props: route => ({ query: route.query.q })
327 |   }
328 | ]
329 | </script>
330 | 
331 | <!-- Via RouterView -->
332 | <template>
333 |   <RouterView v-slot="{ Component }">
334 |     <component
335 |       :is="Component"
336 |       view-prop="value"
337 |     />
338 |   </RouterView>
339 | </template>
340 | ```
341 | 


--------------------------------------------------------------------------------
/content/vue/basic.md:
--------------------------------------------------------------------------------
  1 | # Vue Basic
  2 | 
  3 | ## Data binding
  4 | 
  5 | ```vue
  6 | <script setup lang="ts">
  7 | import { ref } from 'vue'
  8 | 
  9 | const msg = ref('Hello World!')
 10 | const htmlContent = ref('<h1>In Heading Tag</h1>')
 11 | </script>
 12 | 
 13 | <template>
 14 |   <!-- Render `msg` variable -->
 15 |   <p>{{ msg }}</p>  // [!code hl]
 16 | 
 17 |   <!-- Bind HTML instead of string. Similar to `.innerHTML` -->
 18 |   <div v-html="htmlContent"></div> // [!code hl]
 19 | </template>
 20 | ```
 21 | 
 22 | ## Attribute Bindings
 23 | 
 24 | ```vue
 25 | <!-- Passing `dynamicId` as attribute -->
 26 | <div v-bind:id="dynamicId"></div>
 27 | 
 28 | <!-- `:id` is a Shorthand of `v-bind:id` -->
 29 | <div :id="dynamicId"></div>
 30 | 
 31 | <!-- It can be passed directly without specifying a value, using the same name as the attribute. -->
 32 | <div v-bind:id></div>
 33 | 
 34 | <!-- `:id` is a Shorthand of `v-bind:id` -->
 35 | <div :id></div>
 36 | ```
 37 | 
 38 | ### Event Bindings
 39 | 
 40 | ```vue
 41 | <!-- method handler -->
 42 | <button v-on:click="doThis"></button>
 43 | 
 44 | <!-- shorthand -->
 45 | <button @click="doThis"></button>
 46 | ```
 47 | 
 48 | ::: info
 49 | Furthermore, we'll exclusively use shorthand notation
 50 | :::
 51 | 
 52 | ### Boolean Attributes
 53 | 
 54 | ```vue
 55 | <script setup>
 56 | import { ref } from 'vue'
 57 | 
 58 | const isButtonDisabled = ref(true)
 59 | </script>
 60 | 
 61 | <template>
 62 |   <button :disabled="isButtonDisabled">Button</button> // [!code hl]
 63 | </template>
 64 | ```
 65 | 
 66 | ### Dynamically Binding Multiple Attributes
 67 | 
 68 | ```vue
 69 | <script setup>
 70 | const inputAttrs = {
 71 |   id: 'container',
 72 |   class: 'wrapper'
 73 | }
 74 | </script>
 75 | 
 76 | <template>
 77 |   <!-- Bind Multiple attributes by using a single variable -->
 78 |   <div v-bind="inputAttrs"></div> // [!code hl]
 79 | </template>
 80 | ```
 81 | 
 82 | ## Using JavaScript Expressions
 83 | 
 84 | ```vue
 85 | <script setup>
 86 | import { ref } from 'vue';
 87 | 
 88 | const message = ref('Hello')
 89 | const number = 5
 90 | const ok = true
 91 | const id = 'wrapper'
 92 | 
 93 | </script>
 94 | 
 95 | <template>
 96 |   <!-- Mustache can have `JavaScript Expression` -->
 97 |   {{ number + 1 }}
 98 | 
 99 |   {{ ok ? 'YES' : 'NO' }}
100 | 
101 |   {{ message.split('').reverse().join('') }}
102 | 
103 |   <div :id="`list-${id}`">JavaScript Expression</div>
104 | </template>
105 | ```
106 | 
107 | ## Directives
108 | 
109 | ![Directive-Structure](https://vuejs.org/assets/directive.7WSr6AKH.png)
110 | 
111 | ::: details Vue all Directives with their API
112 | <https://vuejs.org/api/built-in-directives.html>
113 | :::
114 | 
115 | ```vue
116 | <!-- Bind HTML instead of string. Similar to `.innerHTML` -->
117 | <div v-html="htmlContent"></div>
118 | 
119 | <!-- bind an attribute -->
120 | <img v-bind:src="imageSrc" />
121 | 
122 | <!-- conditionally displaying an element -->
123 | <h1 v-show="ok">Hello!</h1>
124 | 
125 | <!-- Conditionally rendering the element -->
126 | <div v-if="type === 'A'"> A </div>
127 | <div v-else-if="type === 'B'"> B </div>
128 | <div v-else-if="type === 'C'"> C </div>
129 | <div v-else> Not A/B/C </div>
130 | 
131 | <!-- Render element or template multiple times -->
132 | <div v-for="(item, index) in items"> {{ item }} </div>
133 | 
134 | <!-- Render the element and component once only, and skip future updates. -->
135 | <span v-once>This will never change: {{msg}}</span>
136 | 
137 | <!-- Two-way data binding: -->
138 | <input v-model="firstName" />
139 | 
140 | <!-- method handler -->
141 | <button v-on:click="doThis"></button>
142 | 
143 | <!-- `Dynamic Arguments`: They are denoted by 'square brackets' after the directive name. -->
144 | <a @[eventName]="doSomething"> ... </a>
145 | 
146 | <!-- `Modifiers`: They are special postfixes denoted by 'dot'. -->
147 | <form @submit.prevent="onSubmit"> ... </form>
148 | 
149 | <!-- `v-pre`: Skip compilation for this element and all its children. -->
150 | <span v-pre>{{ this will not be compiled }}</span>
151 | 
152 | <!-- `v-memo`: Memoize a sub-tree of the template. -->
153 | <div v-memo="[valueA, valueB]"> ... </div>
154 | 
155 | <!-- `v-cloak`: Used to hide un-compiled template until it is ready -->
156 | <div v-cloak>{{ message }}</div>
157 | ```
158 | 
159 | ::: info `v-if` vs. `v-show`
160 | `v-if`: Use when the condition is unlikely to change often.
161 | 
162 | `v-show`: Use when you need to toggle frequently.
163 | :::
164 | 
165 | ### Example: Quick review of using 'v-for' with arrays and objects
166 | 
167 | ```vue
168 | <script setup>
169 | import { ref } from 'vue'
170 | 
171 | const items = ref([{ message: 'Foo' }, { message: 'Bar' }])
172 | 
173 | const myObject = ref({
174 |   title: 'How to do lists in Vue',
175 |   author: 'John Doe',
176 |   publishedAt: '2016-04-10'
177 | })
178 | </script>
179 | 
180 | <template>
181 | <!-- Array -->
182 | <ul>
183 |   <li v-for="(item, index) in items" :key="index">
184 |     {{ index }} - {{ item.message }}
185 |   </li>
186 | </ul>
187 | 
188 | <!-- Array w/ Destructure -->
189 | <ul>
190 |   <li v-for="({ message }, index) in items" :key="index">
191 |     {{ index }} - {{ message }}
192 |   </li>
193 | </ul>
194 | 
195 | <!-- Object -->
196 | <ul>
197 |   <!-- v-for="value in myObject" -->
198 |   <!-- v-for="(value, key) in myObject" -->
199 |   <li v-for="(value, key, index) in myObject" :key="index">
200 |     {{ index }}. {{ key }}: {{ value }}
201 |   </li>
202 | </ul>
203 | </template>
204 | ```
205 | 
206 | ## Template Refs
207 | 
208 | Give access to DOM elements.
209 | 
210 | ```vue
211 | <script setup>
212 | import { ref, onMounted } from 'vue'
213 | 
214 | // declare a ref to hold the element reference
215 | // the name must match template ref value
216 | const input = ref(null)
217 | 
218 | onMounted(() => input.value.focus())
219 | </script>
220 | 
221 | <template>
222 |   <input ref="input" />
223 | </template>
224 | ```
225 | 
226 | ## Lifecycle Hooks
227 | 
228 | | Hooks           |      Descpriton                         |
229 | | :-------------: | :-------------------------------------: |
230 | | beforeCreate    | After the instance has been initialized |
231 | | created   | After the instance is created                 |
232 | | onBeforeMount   | Before mounting DOM                     |
233 | | onMounted       |   DOM can be accessed                   |
234 | | onBeforeUpdate  |   Reactive data changes                 |
235 | | onUpdated       |   DOM has been updated                  |
236 | | onBeforeUnmount |   Component still complete              |
237 | | onUnmounted     |   Teardown complete                     |
238 | 
239 | ## Event Handling
240 | 
241 | ```vue
242 | 
243 | <!-- Inline Handler -->
244 | <button v-on:click="console.log('hello')">print</button>
245 | 
246 | <!-- Method Handler -->
247 | <button v-on:click="greet">Greet</button>
248 | 
249 | <!-- use shorthand for v-on `@` -->
250 | <button @click="console.log('hello')">print</button>
251 | 
252 | <!-- Calling methods in inline handler -->
253 | <button @click="say('hello')">Say hello</button>
254 | 
255 | 
256 | <!-- Access Event Argument -->
257 | <!-- using $event special variable -->
258 | <button @click="warn('Form cannot be submitted yet.', $event)">
259 |   Submit
260 | </button>
261 | 
262 | <!-- using inline arrow function -->
263 | <button @click="(event) => warn('Form cannot be submitted yet.', event)">
264 |   Submit
265 | </button>
266 | 
267 | <!-- Event Modifiers -->
268 | <!-- the click event's propagation will be stopped -->
269 | <a @click.stop="doThis"></a>
270 | 
271 | <!-- the submit event will no longer reload the page -->
272 | <form @submit.prevent="onSubmit"></form>
273 | 
274 | <!-- modifiers can be chained -->
275 | <a @click.stop.prevent="doThat"></a>
276 | 
277 | <!-- just the modifier -->
278 | <form @submit.prevent></form>
279 | 
280 | <!-- only trigger handler if event.target is the element itself -->
281 | <!-- i.e. not from a child element -->
282 | <div @click.self="doThat">...</div>
283 | 
284 | <!-- use capture mode when adding the event listener     -->
285 | <!-- i.e. an event targeting an inner element is handled -->
286 | <!-- here before being handled by that element           -->
287 | <div @click.capture="doThis">...</div>
288 | 
289 | <!-- the click event will be triggered at most once -->
290 | <a @click.once="doThis"></a>
291 | 
292 | <!-- the scroll event's default behavior (scrolling) will happen -->
293 | <!-- immediately, instead of waiting for `onScroll` to complete  -->
294 | <!-- in case it contains `event.preventDefault()`                -->
295 | <div @scroll.passive="onScroll">...</div>
296 | ```
297 | 
298 | ### Key Modifiers
299 | 
300 | | Key Modifier | Example Usage |
301 | | ------------ | ------------- |
302 | | keyup.enter | Triggers Enter key up event |
303 | | keyup.tab | Triggers Tab key up event |
304 | | keyup.delete | Triggers Delete or Backspace key up event |
305 | | keyup.esc | Triggers Escape key up event |
306 | | keyup.space | Triggers Space key up event |
307 | | keyup.arrow-up | Triggers arrow up key up event |
308 | | keyup.arrow-down | Triggers arrow down key up event |
309 | | keyup.arrow-left | Triggers arrow left key up event |
310 | | keyup.arrow-right | Triggers arrow right key up event |
311 | 
312 | ### Mouse modifiers
313 | 
314 | | Mouse Modifier | Example Usage |
315 | | ------------ | ------------- |
316 | | mousedown.left | Triggers Mouse left click event |
317 | | mousedown.right | Triggers Mouse right click event |
318 | | mousedown.middle | Triggers Mouse middle click event |
319 | 


--------------------------------------------------------------------------------
/content/vue/built-in-components.md:
--------------------------------------------------------------------------------
  1 | # Built-in Components
  2 | 
  3 | ## Transition
  4 | 
  5 | `<Transition>` :  It can be used to apply enter and leave animations on elements or components passed to it via its default slot.
  6 | 
  7 | ![Transition Image](https://vuejs.org/assets/transition-classes.2BufuvZR.png)
  8 | 
  9 | ```vue{9-11}
 10 | <script setup>
 11 | import { ref } from 'vue'
 12 | 
 13 | const show = ref(true)
 14 | </script>
 15 | 
 16 | <template>
 17 |   <button @click="show = !show">Toggle</button>
 18 |   <Transition>
 19 |     <p v-if="show">hello</p>  // Applied fade transition
 20 |   </Transition>
 21 | </template>
 22 | 
 23 | <style>
 24 | .v-enter-active,
 25 | .v-leave-active {
 26 |   transition: opacity 0.5s ease;
 27 | }
 28 | 
 29 | .v-enter-from,
 30 | .v-leave-to {
 31 |   opacity: 0;
 32 | }
 33 | </style>
 34 | ```
 35 | 
 36 | [Try it in the Playground](https://play.vuejs.org/#eNp9UstOwzAQ/BXjCyDRBKniUtKKh3qAAyDo0ZfgblO3jm3Zm7RV1X9nHUelSKineGdnxrMb7/mjc1nbAB/xIkivHLIA2LiJMKp21iPbMw8LdmALb2t2SdRLYYSR1gSiLu2GjSPhCn0D18IUeXIhPRUItdMlAlWMFd8NojXsQWol12PBe/VF/Ao+mdmq0lDkiZYkM1+aoFD1NSGOtQO16NWkWoLWtshjYOrmfwRFfhKAyoA7HY9ZOwCD4AelRNXCTYdoKFvoEbaPbnj0GjHrSqlwx26zu8CgDHAvzCGaHr3ifk6d0CaXXjlit0lCG+pi8BuOgda4UFW2CtbQH+j4gktbO6XBv7t4dxB8lJxir6RpN68dFjdOFyZcLkGu/8FXYRsxwT88BPAtCH7sYekrwNSefr3Bls7HZm3njSb2meYnBKubmDHRnhozp9gnvC7tS/eOlKlmYbpFoJX2Q8WgkXno+ILT23o+M/pv3GE27HS0T374AbBs70k=)
 37 | 
 38 | ### Using Javascript Hooks
 39 | 
 40 | ```vue
 41 | <Transition
 42 |   @before-enter="onBeforeEnter"
 43 |   @enter="onEnter"
 44 |   @after-enter="onAfterEnter"
 45 |   @enter-cancelled="onEnterCancelled"       
 46 |   @before-leave="onBeforeLeave"
 47 |   @leave="onLeave"
 48 |   @after-leave="onAfterLeave"
 49 |   @leave-cancelled="onLeaveCancelled"
 50 | >
 51 |   <!-- ... -->
 52 | </Transition>
 53 | ```
 54 | 
 55 | ## TransitionGroup
 56 | 
 57 | `<TransitionGroup>`: It is designed for animating the insertion, removal, and order change of elements or components that are rendered in a list.
 58 | 
 59 | ```vue{5-9}
 60 | <template>
 61 |   <button @click="insert">insert at random index</button>
 62 |   <button @click="reset">reset</button>
 63 | 
 64 |   <TransitionGroup tag="ul" name="list" class="container">
 65 |     <li v-for="item in items" class="item" :key="item">
 66 |       {{ item }}
 67 |     </li>
 68 |   </TransitionGroup>
 69 | </template>
 70 | 
 71 | <style>
 72 | .list-enter-active,
 73 | .list-leave-active {
 74 |   transition: all 0.5s ease;
 75 | }
 76 | .list-enter-from,
 77 | .list-leave-to {
 78 |   opacity: 0;
 79 |   transform: translateX(30px);
 80 | }
 81 | </style>
 82 | ```
 83 | 
 84 | [Try it in the Playground](https://play.vuejs.org/#eNp9VMFu2zAM/RXCwJBkdZ10WS9eGmzriqEDthVbDwPqHjSbjtXKkmHRaYog/z5KStIka3syST0+PtKiltGnpknmHUZpNLF5KxsCi9Q100zLujEtwRJaLGEFZWtq6DG0l+lM50ZbghnSpZYkhbokrC2cQX8AZ1O4OYnhXQzjGN7HcHq7gcs1iAn7B6n9wSDTChlTMMADk7lQHSYK9YwqOIITV7fsdE7SaJDaYktcbplpgDU/p34XVCWt6XTRD6bQhakZ9/YZVq4Je2HbKJljX8YwilnK0REjVnt1W+T5bMrupHLp/1rykNf68dSTYRg8j5wdRjZKELIHMPnbEXHRjznLuj/LotB1Fk2DAYIgNMjzKHAxGYaE55O9dM713x2oB18zj2XxRn/l6TVAYsYpncoi0KJGtpW0nA25EtayyyMnITW2zOgYmENJmB+XpnVCuQ/WFDrfyXI+u+k9Pm69dTrAcunxsOK5eMKhkqGV4YE8jk6GO6Ni19KjcmbiKfzveZAFVSmcjEZvPji/QjmrKIXxqFlwwE8/cW0doyZsjwX/4jnGm6BCMcd1MBDSVkUKQikYJacWUFgMbLtcbl0OmMgEFtOIXNJjCiOvypPy1Oo0mK6lP32ncRBo+YL43qI4IstjL+UsubNG8856Pvcv6kYqbH82ThvPOw2V3BnrNA/ffIzaznUX4nmF+f0z8Tu7cLEsunL3pJ1jFm3PSLR8ycPxxe8fuGB7e1ibolOMfuXwF1qjOqcxwD7zmrLsHZxXe+lfHqln1/ZiQcgjXzflhDrkyuOziF+j81daf5I7TsY+j+fJUzyvpCpeePXCS9K0pnEvVYElX/Er5/VveiRJYe+W9/rFnZ0Ucv7CikwqFAW2zrLK0GatQpQRzMlhf7OfkDXnbzKmX7AUnSL32vFUeIW3CRtYaQxfvsMSIbpf4gk5ZMn7+xSt/gH4Zxci)
 85 | 
 86 | ## KeepAlive
 87 | 
 88 | `<KeepAlive>`: It allows us to conditionally cache component instances when dynamically switching between multiple components.
 89 | 
 90 | ::: code-group
 91 | 
 92 | ```vue{13-15} [App.vue]
 93 | <script setup>
 94 |   import { shallowRef } from 'vue'
 95 |   import CompA from './CompA.vue'
 96 |   import CompB from './CompB.vue'
 97 | 
 98 |   const current = shallowRef(CompB)
 99 | </script>
100 | 
101 | <template>
102 |   <div class="demo">
103 |     <label><input type="radio" v-model="current" :value="CompA" /> A</label>
104 |     <label><input type="radio" v-model="current" :value="CompB" /> B</label>
105 |     <KeepAlive>
106 |       <component :is="current"></component>
107 |     </KeepAlive>
108 |   </div>
109 | </template>
110 | ```
111 | 
112 | ```vue [CompA.vue]
113 | <script setup>
114 |   import { ref } from 'vue'
115 | 
116 |   const count = ref(0)
117 | </script>
118 | 
119 | <template>
120 |   <p>Current component: A</p>
121 |   <span>count: {{ count }} </span>
122 |   <button @click="count++">Increase Count</button>
123 | </template>
124 | ```
125 | 
126 | ```vue [CompB.vue]
127 | <script setup>
128 |   import { ref } from 'vue'
129 | 
130 |   const msg = ref('')
131 | </script>
132 | 
133 | <template>
134 |   <p>Current component: B</p>
135 |   <span>Message is: </span>
136 |   <input v-model="msg">
137 | </template>
138 | ```
139 | 
140 | :::
141 | 
142 | [Try it in the Playground](https://play.vuejs.org/#eNqtU01vnDAQ/SuWL5sq6VIpN0RQlyiHtOqH0h65EJglToxt+YNuhfjvHdssYbf5kKLc8Jvn8XvzhoFulFr3DmhKM1NrpiwxYJ3KS0EI65TUlgzE3FWcyz83sCUj2WrZkRXeWS04l7JTm6m0TsLJtz2mFAeUYqJ4Ui2FsaR2WoOw5GLx5EmgfihFlkSFqA0PFjrFKwtBadawntS8MuaipA10sqQBxwqvboHnGRPKWWL/KkCGrhqGFNJ/7GQDHJHpYcTSvuLOk4IJBJKcbLIktnmPnkXsWRz1/AqgNpz10VCAamRL4eeRMm9sbphnyVzb308OG2QJjgS/smQxKHoWXb2euP4v6kVI0oWIkHPy6ZVcVH45RToLTv0443OZUZXIQ7+UDMPUeRxRfagEzq2zVgryueasfvBT8KTTU5zCtag1VAZwtRDKksh8xnRYtreb7kw7WV6t3uIZ4156/gbGVC0QZtIDs3GlHncInw2rfOzIGpS1Ze363kiBrgZ/28+mU4yD/qEsQ9klxbHG/Shp+J++BMxqB2d7vL6D+uEJ/N7sPFbSnxoM6B5KOtdspVvARfTlq1/fYYffcxG1O47sF4o3YCR3XmOkFU40KHvBC2qvQzJMtL/N1c6CMHtTXqhnjoFfUkzLZ/yc9Ue55+vzcK8UIx3/AY/eq8Q=)
143 | 
144 | ## Teleport
145 | 
146 | The `<teleport>` component in Vue.js allows you to render a component's HTML in a different part of the DOM than where the component is declared.
147 | 
148 | ```vue
149 | <Teleport to="body">
150 |   <div v-if="open" class="modal">
151 |     <p>Hello from the modal!</p>
152 |     <button @click="open = false">Close</button>
153 |   </div>
154 | </Teleport>
155 | ```
156 | 
157 | ## Suspense
158 | 
159 | `<Suspense>` is a built-in component for orchestrating async dependencies in a component tree. It can render a `loading state` while waiting for multiple nested async dependencies down the component tree to be resolved.
160 | 
161 | ```vue
162 | <template>
163 |   <Suspense>
164 |     <!-- component with nested async dependencies -->
165 |     <Dashboard />
166 | 
167 |     <!-- loading state via #fallback slot -->
168 |     <template #fallback>
169 |       Loading...
170 |     </template>
171 |   </Suspense>
172 | </template>
173 | ```
174 | 
175 | ### Combining Suspense with other components
176 | 
177 | ```vue
178 | <template>
179 |   <RouterView v-slot="{ Component }">
180 |     <template v-if="Component">
181 |       <Transition mode="out-in">
182 |         <KeepAlive>
183 |           <Suspense>
184 |             <!-- main content -->
185 |             <component :is="Component"></component>
186 | 
187 |             <!-- loading state -->
188 |             <template #fallback>
189 |               Loading...
190 |             </template>
191 |           </Suspense>
192 |         </KeepAlive>
193 |       </Transition>
194 |     </template>
195 |   </RouterView>
196 | </template>
197 | ```
198 | 


--------------------------------------------------------------------------------
/content/vue/component.md:
--------------------------------------------------------------------------------
  1 | # Component
  2 | 
  3 | ## Register Component
  4 | 
  5 | ### Global Registration
  6 | 
  7 | ```ts
  8 | import MyComponent from './MyComponent.vue'
  9 | 
 10 | app.component('MyComponent', MyComponent)
 11 | 
 12 | // We can chain component method
 13 | app
 14 |   .component('ComponentA', ComponentA)
 15 |   .component('ComponentB', ComponentB)
 16 |   .component('ComponentC', ComponentC)
 17 | ```
 18 | 
 19 | Now `MyComponent` is globally available. We can use it in any component like below:
 20 | 
 21 | ```vue
 22 | <MyComponent />
 23 | ```
 24 | 
 25 | ### Local Registration
 26 | 
 27 | ```vue
 28 | <script setup>
 29 | import ComponentA from './ComponentA.vue'
 30 | </script>
 31 | 
 32 | <template>
 33 |   <ComponentA />
 34 | </template>
 35 | ```
 36 | 
 37 | ## Defining a Component
 38 | 
 39 | ### 1. SFC
 40 | 
 41 | ```vue
 42 | <script setup>
 43 | import { ref } from 'vue'
 44 | 
 45 | const count = ref(0)
 46 | </script>
 47 | 
 48 | <template>
 49 |   <button @click="count++">You clicked me {{ count }} times.</button>
 50 | </template>
 51 | ```
 52 | 
 53 | ### 2. `defineComponent`
 54 | 
 55 | ```ts
 56 | import { ref, h, defineComponent } from 'vue'
 57 | 
 58 | const Comp = defineComponent(
 59 |   (props) => {
 60 | 
 61 |     return () => {
 62 |       return h('div', props.title)
 63 |     }
 64 |   },
 65 |   {
 66 |     props: {
 67 |       title: String,
 68 |     }
 69 |   }
 70 | )
 71 | 
 72 | export default Comp
 73 | ```
 74 | 
 75 | ### 3. `defineAsyncComponent`
 76 | 
 77 | ```ts
 78 | defineAsyncComponent(() => import('@/components/TestCompo.vue'));
 79 | ```
 80 | 
 81 | ### 4. Using tsx
 82 | 
 83 | ```vue
 84 | <script setup lang="tsx">
 85 | const Foo = (props: {msg: string}) => {
 86 |   return <div> {props.msg} </div>
 87 | }
 88 | </script>
 89 | 
 90 | <template>
 91 |   <Foo :msg="message" />
 92 | </template>
 93 | 
 94 | ```
 95 | 
 96 | ::: warning Warning
 97 | If using Vite - you need `@vitejs/plugin-vue-jsx` for this
 98 | :::
 99 | 
100 | ## Props
101 | 
102 | ### Defining Props
103 | 
104 | ```vue
105 | <script setup lang="ts">
106 | // Recommended way to define props
107 | interface Props {
108 |     title: string
109 |     likes: number
110 | }
111 | defineProps<Props>()
112 | 
113 | // define props using Object
114 | defineProps({
115 |     title: String, 
116 |     id: Number
117 | })
118 | 
119 | // define props using Array
120 | defineProps(['title', 'id'])
121 | 
122 | // Extending props with existing interface 
123 | interface CustomProps extends Props {
124 |     name: string
125 | }
126 | defineProps<CustomProps>()
127 | </script>
128 | ```
129 | 
130 | ### Prop Validation
131 | 
132 | We can validate prop using its types, required parameter, validator function. We can also pass default value to the prop.
133 | 
134 | ```ts
135 | defineProps({
136 |   // Basic type check
137 |   //  (`null` and `undefined` values will allow any type)
138 |   propA: Number,
139 | 
140 |   // Multiple possible types
141 |   propB: [String, Number],
142 | 
143 |   // Required string
144 |   propC: {
145 |     type: String,
146 |     required: true
147 |   },
148 | 
149 |   // Number with a default value
150 |   propD: {
151 |     type: Number,
152 |     default: 100
153 |   },
154 | 
155 |   // Object with a default value
156 |   propE: {
157 |     type: Object,
158 |     // Object or array defaults must be returned from
159 |     // a factory function. The function receives the raw
160 |     // props received by the component as the argument.
161 |     default(rawProps) {
162 |       return { message: 'hello' }
163 |     }
164 |   },
165 | 
166 |   // Custom validator function
167 |   // All props passed as 2nd argument in 3.4+
168 |   propF: {
169 |     validator(value, props) {
170 |       // The value must match one of these strings
171 |       return ['success', 'warning', 'danger'].includes(value)
172 |     }
173 |   },
174 | 
175 |   // Function with a default value
176 |   propG: {
177 |     type: Function,
178 |     // Unlike object or array default, this is not a factory 
179 |     // function - this is a function to serve as a default value
180 |     default() {
181 |       return 'Default function'
182 |     }
183 |   },
184 | 
185 |   // If you don't pass value to prop by default it will take false.
186 |   propH: Boolean,
187 | 
188 |   // Change the default behavior of Boolean type prop.
189 |   propI: {
190 |     type: Boolean, 
191 |     default: undefined,
192 |   },
193 | 
194 | })
195 | ```
196 | 
197 | ### Binding Props
198 | 
199 | ```vue
200 | <script setup lang="ts">
201 | const propsData = {
202 |   title: 'title',
203 |   likes: 1,
204 |   views: 1000
205 | }
206 | 
207 | const id = ref(1)
208 | const title = ref('vuexy')
209 | 
210 | </script>
211 | 
212 | <template>
213 |     <!-- prop binding -->
214 |     <MyComponent :title='title'></MyComponent>
215 | 
216 |     <!-- use v-bind directive prop to bind multiple props -->
217 |     <MyComponent v-bind="propsData"></MyComponent>
218 | 
219 |     <!-- Same name shorthand (available in vue 3.4+) -->
220 |     <Post :id :title />
221 | 
222 |     <!-- Boolean Casting -->
223 | 
224 |     <!-- equivalent of passing :disabled="true" -->
225 |     <MyComponent disabled />
226 | 
227 |     <!-- equivalent of passing :disabled="false" -->
228 |     <MyComponent />
229 | </template>
230 | ```
231 | 
232 | ### Two Way binding
233 | 
234 | ```vue
235 | <script>
236 |   // two way binding with defineModel
237 |   const model = defineModel()
238 | </script>
239 | 
240 | <template>
241 |   <input v-model="model" />
242 | </template>
243 | ```
244 | 
245 | ```vue
246 | <script>
247 |   // making the v-model required
248 |   const model = defineModel({ required: true })
249 | 
250 |   // providing a default value
251 |   const model = defineModel({ default: 0 })
252 | 
253 |   // multiple v-model binding
254 |   const firstName = defineModel('firstName')
255 |   const lastName = defineModel('lastName')
256 | </script>
257 | 
258 | <template>
259 |   <input type="text" v-model="firstName" />
260 |   <input type="text" v-model="lastName" />
261 | </template>
262 | 
263 | ```
264 | 
265 | ```vue
266 | <script>
267 |   // Handling v-model modifier
268 |   const [model, modifiers] = defineModel({
269 |     set(value) {
270 |       if (modifiers.capitalize) {
271 |         return value.charAt(0).toUpperCase() + value.slice(1)
272 |       }
273 |       return value
274 |     }
275 |   })
276 | </script>
277 | 
278 | <template>
279 |   <MyComponent v-model.capitalize="myText" />
280 | </template>
281 | ```
282 | 
283 | ## Events
284 | 
285 | ### Declaring events
286 | 
287 | ```vue
288 | <script setup lang="ts">
289 | // defineEmits with typescript
290 | defineEmits<{
291 |   (e: 'change', id: number): void
292 |   (e: 'update', value: string): void
293 | }>()
294 | 
295 | // with Array
296 | defineEmits(['inFocus', 'submit'])
297 | </script>
298 | ```
299 | 
300 | ### Using Events
301 | 
302 | ```vue
303 | <!-- Emitting the events -->
304 | <button @click="$emit('someEvent')">click me</button>
305 | 
306 | <!-- Listening to events -->
307 | <MyComponent @some-event="handleEvent" />
308 | 
309 | <!-- Modifier can also be used on the event -->
310 | <MyComponent @some-event.once="callback" />
311 | 
312 | <!-- Emit event with argument -->
313 | <button @click="$emit('increaseBy', 1)">Increase by 1</button>
314 | ```
315 | 
316 | ### Event Validation
317 | 
318 | ```vue
319 | <script setup>
320 | const emit = defineEmits({
321 |   // No validation
322 |   click: null,
323 | 
324 |   // Validate submit event
325 |   submit: ({ email, password }) => {
326 |     if (email && password) {
327 |       return true
328 |     } else {
329 |       console.warn('Invalid submit event payload!')
330 |       return false
331 |     }
332 |   }
333 | })
334 | 
335 | function submitForm(email, password) {
336 |   emit('submit', { email, password })
337 | }
338 | </script>
339 | ```
340 | 
341 | ## Slots
342 | 
343 | ```vue
344 | <template>
345 |     <!-- slot -->
346 |     <button>
347 |         <slot></slot>  <!-- slot Outlet -->
348 |     </button>
349 | 
350 |     <!-- slot with fallback content -->
351 |     <button type="submit">
352 |         <slot>
353 |             Submit <!-- fallback content -->
354 |         </slot>
355 |     </button>
356 | 
357 |     <!-- Named slots -->
358 |     <div class="container">
359 |         <header>
360 |             <slot name="header"></slot>
361 |         </header>
362 |         <main> 
363 |             <slot></slot> <!-- slot without name will be considered as default slot-->
364 |         </main>
365 |         <footer>
366 |             <slot name="footer"></slot>
367 |         </footer>
368 |     </div>
369 | 
370 |     <!-- Dynamic Slot names -->
371 |      <base-layout>
372 |         <template v-slot:[dynamicSlotName]>
373 |             ...
374 |         </template>
375 | 
376 |         <!-- with shorthand -->
377 |         <template #[dynamicSlotName]>
378 |             ...
379 |         </template>
380 |     </base-layout>
381 | 
382 |     <!-- Scoped Slots -->
383 |     <MyComponent v-slot="slotProps">
384 |         {{ slotProps.text }} {{ slotProps.count }}
385 |     </MyComponent>
386 | 
387 |     <!-- Named Scoped Slots -->
388 |     <MyComponent>
389 |         <template #header="headerProps">
390 |             {{ headerProps }}
391 |         </template>
392 | 
393 |         <template #default="defaultProps">
394 |             {{ defaultProps }}
395 |         </template>
396 | 
397 |         <template #footer="footerProps">
398 |             {{ footerProps }}
399 |         </template>
400 |     </MyComponent>
401 | </template>
402 | ```
403 | 
404 | ## Provide & Inject
405 | 
406 | ![Provide and Inject](https://vuejs.org/assets/provide-inject.tIACH1Z-.png)
407 | 
408 | ::: code-group
409 | 
410 | ```vue{2,8} [Parent.vue]
411 | <script setup>
412 | import { ref, provide } from 'vue'
413 | import Child from './Child.vue'
414 | 
415 | // by providing a ref, the GrandChild
416 | // can react to changes happening here.
417 | const message = ref('hello')
418 | provide('message', message)
419 | </script>
420 | 
421 | <template>
422 |   <input v-model="message">
423 |   <Child />
424 | </template>
425 | ```
426 | 
427 | ```vue [Child.vue]
428 | <script setup>
429 | import GrandChild from './GrandChild.vue'
430 | </script>
431 | 
432 | <template>
433 |   <GrandChild />
434 | </template>
435 | ```
436 | 
437 | ```vue{2,4} [GrandChild.vue  ]
438 | <script setup>
439 | import { inject } from 'vue'
440 | 
441 | const message = inject('message')
442 | </script>
443 | 
444 | <template>
445 |   <p>
446 |     Message to grand child: {{ message }}
447 |   </p>
448 | </template>
449 | ```
450 | 
451 | :::
452 | 


--------------------------------------------------------------------------------
/content/vue/composable.md:
--------------------------------------------------------------------------------
 1 | # Composable
 2 | 
 3 | A composable is a function that leverages Vue's Composition API to encapsulate and reuse stateful logic.
 4 | 
 5 | ```ts
 6 | // mouse.ts
 7 | import { ref, onMounted, onUnmounted } from 'vue'
 8 | 
 9 | // by convention, composable function names start with "use"
10 | export function useMouse() {
11 |   // state encapsulated and managed by the composable
12 |   const x = ref(0)
13 |   const y = ref(0)
14 | 
15 |   // a composable can update its managed state over time.
16 |   function update(event) {
17 |     x.value = event.pageX
18 |     y.value = event.pageY
19 |   }
20 | 
21 |   // a composable can also hook into its owner component's
22 |   // lifecycle to setup and teardown side effects.
23 |   onMounted(() => window.addEventListener('mousemove', update))
24 |   onUnmounted(() => window.removeEventListener('mousemove', update))
25 | 
26 |   // expose managed state as return value
27 |   return { x, y }
28 | }
29 | ```
30 | 
31 | ## Convention & Best Practices
32 | 
33 | ### Naming
34 | 
35 | It is a convention to name composable functions with camelCase names that start with `use`.
36 | 
37 | Example: `useMouse()`
38 | 
39 | ### Input Arguments
40 | 
41 | ```ts
42 | import { toValue } from 'vue'
43 | 
44 | function useFeature(maybeRefOrGetter) {
45 |   // If maybeRefOrGetter is a ref or a getter,
46 |   // its normalized value will be returned.
47 |   // Otherwise, it is returned as-is.
48 |   const value = toValue(maybeRefOrGetter)
49 | }
50 | ```
51 | 
52 | ### Return values
53 | 
54 | ```ts
55 | // x and y are refs
56 | const { x, y } = useMouse()
57 | ```
58 | 


--------------------------------------------------------------------------------
/content/vue/forms.md:
--------------------------------------------------------------------------------
 1 | # Form Input Bindings
 2 | 
 3 | ## Basic form input
 4 | 
 5 | ```vue
 6 | <template>
 7 |   <!-- Text Input -->
 8 |   <input v-model="text"> {{ text }}
 9 |   
10 |   <!-- Checkbox -->
11 |   <input type="checkbox" id="checkbox" v-model="checked">
12 |   <label for="checkbox">Checked: {{ checked }}</label>
13 |   
14 |   <!-- Multi checkbox -->
15 |   <input type="checkbox" id="jack" value="Jack" v-model="checkedNames">
16 |   <label for="jack">Jack</label>
17 |   <input type="checkbox" id="john" value="John" v-model="checkedNames">
18 |   <label for="john">John</label>
19 |   <input type="checkbox" id="mike" value="Mike" v-model="checkedNames">
20 |   <label for="mike">Mike</label>
21 |   <p>Checked names: <pre>{{ checkedNames }}</pre></p>
22 |   
23 |   <!-- Radio -->
24 |   <input type="radio" id="one" value="One" v-model="picked">
25 |   <label for="one">One</label>
26 |   
27 |   <input type="radio" id="two" value="Two" v-model="picked">
28 |   <label for="two">Two</label>
29 |   
30 |   <span>Picked: {{ picked }}</span>
31 |   
32 |   <!-- Select -->
33 |   <select v-model="selected">
34 |     <option disabled value="">Please select one</option>
35 |     <option>A</option>
36 |     <option>B</option>
37 |     <option>C</option>
38 |   </select>
39 |   <span>Selected: {{ selected }}</span>
40 |   
41 |   <!-- Multi select -->
42 |   <select v-model="multiSelected" multiple style="width:100px">
43 |     <option>A</option>
44 |     <option>B</option>
45 |     <option>C</option>
46 |   </select>
47 |   <span>Selected: {{ multiSelected }}</span>
48 | </template>
49 | ```
50 | 
51 | [Try it in the Playground](https://play.vuejs.org/#eNq9VUtP4zAQ/iveXLorUcoutypEAsQBJB4CbmQPaTKlBse2bKeAqvz3nbHzRAW6Fy5tZuabxzf2jDfRsdb76wqieRTb3HDtmAVX6SSVvNTKOLZhBpasZkujSjZB6CSVqcyVtI45eHXsiAA/J2cFd6yEya/WmK8gf4aisTtTwXvTVVaCbewPk4ssf5787TCaD7wn13IQ2YKA3PXG495UVsLxu7H9AQEUN54FhsgNBQelFpkDlBiLV3+SeyJzLnXl4hmKXs1JZOtpqQoQR2lEhNMoYZtN4F7XFCv4nxKphXp97+3eNKCr54zmNGK8GMt9/KYxmMIHENkCBFsqM8KHTFDMqYy2y3Udzzzcs0PfH9Mp/bPQEi0gQDEC9jzPJFtwWTCnmFsBs3gSAZ0Zk721FbF1JipvmE67Pl1SPPafbJ/wcIkpxUORznobcX8jtrEP/gn59Ty/TKpWcpi0EXdP6h0S8ts9acmfYZD0shF3Thr8E/IbJdXtsTNJrnPUGEj6GxCGia4B6fG3vQh4PrdZwdUHJ2XI1hav5LB2HLpR6WEktxXt/RLEj0pemK/yuRf6bPPdB2mHfN4vQfzWfFZnMrnxzn5GmlVCvfGmvjFhU/SdCZtlUEK7apoiEKK040qygttsITBqWzwibgRkFocpBMGexLOAHvsmxx/oTz7Qn470SMInGHBtF55n223HLXzD7H7JerRF8Ui6FWLdmyCyL7xwq/nvgwNN++g72Y0X/IBiPOs2erQXOYvvwZI/7j9ZJfFx21A4HD5Vai7AXPuEOH8YM1STRpkQ6uXC6+ix2mv1fr626J8scp/jx40BC2aNE9DZXGYeAV8KMp/dXflXozNilyuB6E+Mt2CVqKjGADupZIFlD3C+2nP/RHP5eG/PXh1I25KiQglZe3wa4bN9+gn1vtzD/UPvl8o6qv8BvGa6DQ==)
52 | 


--------------------------------------------------------------------------------
/content/vue/reactivity.md:
--------------------------------------------------------------------------------
  1 | # Reactivity
  2 | 
  3 | ## `ref()`
  4 | 
  5 | A ref will make its value deeply reactive. This means you can expect changes to be detected even when you mutate nested objects or arrays.
  6 | 
  7 | ```ts
  8 | const count = ref(0);
  9 | 
 10 | console.log(count.value); // 0
 11 | 
 12 | count.value = 10; // Will update the DOM as well
 13 | 
 14 | console.log(count.value); // 10
 15 | ```
 16 | 
 17 | ## `reactive()`
 18 | 
 19 | Unlike a ref which wraps the inner value in a special object, reactive() makes an object itself reactive.
 20 | 
 21 | ```ts
 22 | const state = reactive({ count: 1 });
 23 | 
 24 | console.log(state); // {count: 1}
 25 | console.log(state.count); // 1
 26 | ```
 27 | 
 28 | ## `shallowRef()`
 29 | 
 30 | The inner value of a `shallowRef` is stored and exposed as-is, and will not be made deeply reactive
 31 | 
 32 | ```ts
 33 | const state = shallowRef({ count: 1 })
 34 | 
 35 | // does NOT trigger change
 36 | state.value.count = 2
 37 | 
 38 | // does trigger change
 39 | state.value = { count: 2 }
 40 | ```
 41 | 
 42 | ## Computed Property
 43 | 
 44 | ```vue
 45 | <script setup>
 46 | const value = ref(5);
 47 | 
 48 | const doubleValue = computed(() => value.value * 2); // [!code hl]
 49 | </script>
 50 | 
 51 | <template>
 52 |   <div>
 53 |     <p>Original value: {{ value }}</p>
 54 |     <p>Computed value: {{ doubleValue }}</p>
 55 |   </div>
 56 | </template>
 57 | ```
 58 | 
 59 | ## Class and Style Bindings
 60 | 
 61 | ```vue{21-24,27,30,33,36}
 62 | <script setup>
 63 | import { ref } from "vue";
 64 | 
 65 | const isActive = ref(true);
 66 | const hasError = ref(false);
 67 | 
 68 | const activeClass = ref("active");
 69 | const errorClass = ref("text-danger");
 70 | 
 71 | const activeColor = ref("red");
 72 | const fontSize = ref(30);
 73 | 
 74 | const styleObject = reactive({
 75 |   color: "red",
 76 |   fontSize: "13px",
 77 | });
 78 | </script>
 79 | 
 80 | <template>
 81 |   <!-- Class Binding -->
 82 |   <div 
 83 |     class="static"
 84 |     :class="{ active: isActive, 'text-danger': hasError }"
 85 |   ></div>
 86 | 
 87 |   <!-- Binding class using Array -->
 88 |   <div :class="[activeClass, errorClass]"></div>
 89 | 
 90 |   <!-- toggle a class in the list conditionally -->
 91 |   <div :class="[isActive ? activeClass : '', errorClass]"></div>
 92 | 
 93 |   <!-- Style Binding -->
 94 |   <div :style="{ color: activeColor, fontSize: fontSize + 'px' }"></div>
 95 | 
 96 |   <!-- Multiple Style Binding -->
 97 |   <div :style="styleObject"></div>
 98 | 
 99 |   <!-- style binding using v-bind -->
100 |   <div class='error-text'></div>
101 | </template>
102 | 
103 | <style scoped>
104 | /* dynamically bind color */
105 | .error-text{
106 |   color: v-bind(error-color)
107 | }
108 | </style>
109 | ```
110 | 
111 | ::: tip
112 | When a `<style>` tag has the scoped attribute, its CSS will apply to elements of the current component only.
113 | :::
114 | 
115 | ## Events
116 | 
117 | ```vue
118 | <button @click="addToCart"> ... </button>
119 | 
120 | <!-- Arguments can be passed -->
121 | <button @click="addToCart(product)"> ...  </button>
122 | 
123 | <!-- To prevent default behavior (e.g. page reload) -->
124 | <form @submit.prevent="addProduct"> ... </form>
125 | 
126 | <!-- Only trigger once -->
127 | <img @mouseover.once="showImage" />
128 | 
129 | <!-- Keyboard entry example -->
130 | <input @keyup.enter="submit" /> 
131 | 
132 | <!-- Call execute when `Ctrl+C` is pressed -->
133 | <input @keyup.ctrl.c="onCopy">
134 | ```
135 | 
136 | ::: details Vue all Modifiers
137 | 
138 | ------- ***Key Modifiers*** -------  
139 | 
140 | - **`.tab`**  
141 | - **`.delete`**  
142 | - **`.esc`**  
143 | - **`.space`**  
144 | - **`.up`**  
145 | - **`.down`**  
146 | - **`.left`**  
147 | - **`.right`**  
148 | - **`.ctrl`**  
149 | 
150 | ------- ***Mouse Modifiers*** -------  
151 | 
152 | - **`.left`**  
153 | - **`.right`**  
154 | - **`.middle`**  
155 | :::
156 | 
157 | ## Watchers
158 | 
159 | ```ts
160 | 
161 | // Watcher
162 | watch(myProperty, (newValue, oldValue) => {
163 |   console.log(`myProperty changed from ${oldValue} to ${newValue}`);
164 | });
165 | 
166 | // ----- By using Getter -----
167 | watch(
168 |   () => obj.count,
169 |   (count) => console.log(`count is: ${count}`)
170 | )
171 | 
172 | // ------ array of multiple sources ------
173 | watch([x, () => y.value], ([newX, newY]) => {
174 |   console.log(`x is ${newX} and y is ${newY}`)
175 | })
176 | ```
177 | 
178 | ## `WatchEffect()`
179 | 
180 | ```ts
181 | import { ref, watchEffect } from 'vue';
182 | 
183 | const site = ref('vue.org');
184 | 
185 | watchEffect(() => {
186 |   console.log(site.value);
187 | });
188 | 
189 | // Expose site for template usage
190 | const siteData = site;
191 | ```
192 | 
193 | ::: info `watch` vs. `watchEffect`
194 | **watch** and **watchEffect** are both used for reactive side effects in Vue.js.
195 | 
196 | - **`watch`**: Precisely tracks only explicitly specified data changes and triggers the callback only when those changes occur.
197 | 
198 | - **`watchEffect`**: Automatically tracks all accessed reactive properties during its execution, combining dependency tracking and side effect in one step.
199 | :::
200 | 
201 | ## Utilities
202 | 
203 | ```ts
204 | const counter = ref(true)
205 | 
206 | // isRef() -- checks if counter is ref, returns true
207 | console.log(isRef(counter))
208 | 
209 | // unRef() -- returns inner value of ref
210 | console.log(unRef(counter))
211 | 
212 | // toRef() -- returns existing refs as-is
213 | toRef(existingRef)
214 | 
215 | // creates a readonly ref that calls the getter on .value access
216 | toRef(() => props.foo)
217 | 
218 | // creates normal refs from non-function values
219 | // equivalent to ref(1)
220 | toRef(1)
221 | 
222 | // toValue() -- normalizes values / refs / getters to values
223 | toValue(1) //       --> 1
224 | toValue(ref(1)) //  --> 1
225 | toValue(() => 1) // --> 1
226 | 
227 | // toRefs() -- Converts a reactive object to object where each property of object is a ref.
228 | const state = reactive({
229 |     foo: 1,
230 |     bar: 2
231 | })
232 | 
233 | const stateAsRefs = toRefs(state)
234 | 
235 | // nextTick() -- A utility for waiting for the next DOM update flush.
236 | async function increment() {
237 |   count.value++
238 | 
239 |   // DOM not yet updated
240 |   console.log(document.getElementById('counter').textContent) // 0
241 | 
242 |   await nextTick()
243 |   // DOM is now updated
244 |   console.log(document.getElementById('counter').textContent) // 1
245 | }
246 | ```
247 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "vue-cheatsheet",
 3 |   "version": "0.0.0",
 4 |   "scripts": {
 5 |     "dev": "vitepress dev content",
 6 |     "build": "vitepress build content",
 7 |     "preview": "vitepress preview content"
 8 |   },
 9 |   "devDependencies": {
10 |     "@types/node": "^20.10.8",
11 |     "autoprefixer": "^10.4.17",
12 |     "postcss": "^8.4.33",
13 |     "sass": "^1.69.7",
14 |     "tailwindcss": "^3.4.1",
15 |     "vitepress": "1.0.0-rc.44"
16 |   },
17 |   "dependencies": {
18 |     "markdown-it-mathjax3": "^4.3.2",
19 |     "vue": "^3.4.15",
20 |     "vue-github-button": "^3.1.0"
21 |   }
22 | }


--------------------------------------------------------------------------------
/pnpm-lock.yaml:
--------------------------------------------------------------------------------
   1 | lockfileVersion: '6.0'
   2 | 
   3 | settings:
   4 |   autoInstallPeers: true
   5 |   excludeLinksFromLockfile: false
   6 | 
   7 | dependencies:
   8 |   markdown-it-mathjax3:
   9 |     specifier: ^4.3.2
  10 |     version: 4.3.2
  11 |   vue:
  12 |     specifier: ^3.4.15
  13 |     version: 3.4.15
  14 |   vue-github-button:
  15 |     specifier: ^3.1.0
  16 |     version: 3.1.0
  17 | 
  18 | devDependencies:
  19 |   '@types/node':
  20 |     specifier: ^20.10.8
  21 |     version: 20.10.8
  22 |   autoprefixer:
  23 |     specifier: ^10.4.17
  24 |     version: 10.4.17(postcss@8.4.33)
  25 |   postcss:
  26 |     specifier: ^8.4.33
  27 |     version: 8.4.33
  28 |   sass:
  29 |     specifier: ^1.69.7
  30 |     version: 1.69.7
  31 |   tailwindcss:
  32 |     specifier: ^3.4.1
  33 |     version: 3.4.1
  34 |   vitepress:
  35 |     specifier: 1.0.0-rc.44
  36 |     version: 1.0.0-rc.44(@algolia/client-search@4.22.1)(@types/node@20.10.8)(markdown-it-mathjax3@4.3.2)(postcss@8.4.33)(sass@1.69.7)(search-insights@2.13.0)
  37 | 
  38 | packages:
  39 | 
  40 |   /@algolia/autocomplete-core@1.9.3(@algolia/client-search@4.22.1)(algoliasearch@4.22.1)(search-insights@2.13.0):
  41 |     resolution: {integrity: sha512-009HdfugtGCdC4JdXUbVJClA0q0zh24yyePn+KUGk3rP7j8FEe/m5Yo/z65gn6nP/cM39PxpzqKrL7A6fP6PPw==}
  42 |     dependencies:
  43 |       '@algolia/autocomplete-plugin-algolia-insights': 1.9.3(@algolia/client-search@4.22.1)(algoliasearch@4.22.1)(search-insights@2.13.0)
  44 |       '@algolia/autocomplete-shared': 1.9.3(@algolia/client-search@4.22.1)(algoliasearch@4.22.1)
  45 |     transitivePeerDependencies:
  46 |       - '@algolia/client-search'
  47 |       - algoliasearch
  48 |       - search-insights
  49 |     dev: true
  50 | 
  51 |   /@algolia/autocomplete-plugin-algolia-insights@1.9.3(@algolia/client-search@4.22.1)(algoliasearch@4.22.1)(search-insights@2.13.0):
  52 |     resolution: {integrity: sha512-a/yTUkcO/Vyy+JffmAnTWbr4/90cLzw+CC3bRbhnULr/EM0fGNvM13oQQ14f2moLMcVDyAx/leczLlAOovhSZg==}
  53 |     peerDependencies:
  54 |       search-insights: '>= 1 < 3'
  55 |     dependencies:
  56 |       '@algolia/autocomplete-shared': 1.9.3(@algolia/client-search@4.22.1)(algoliasearch@4.22.1)
  57 |       search-insights: 2.13.0
  58 |     transitivePeerDependencies:
  59 |       - '@algolia/client-search'
  60 |       - algoliasearch
  61 |     dev: true
  62 | 
  63 |   /@algolia/autocomplete-preset-algolia@1.9.3(@algolia/client-search@4.22.1)(algoliasearch@4.22.1):
  64 |     resolution: {integrity: sha512-d4qlt6YmrLMYy95n5TB52wtNDr6EgAIPH81dvvvW8UmuWRgxEtY0NJiPwl/h95JtG2vmRM804M0DSwMCNZlzRA==}
  65 |     peerDependencies:
  66 |       '@algolia/client-search': '>= 4.9.1 < 6'
  67 |       algoliasearch: '>= 4.9.1 < 6'
  68 |     dependencies:
  69 |       '@algolia/autocomplete-shared': 1.9.3(@algolia/client-search@4.22.1)(algoliasearch@4.22.1)
  70 |       '@algolia/client-search': 4.22.1
  71 |       algoliasearch: 4.22.1
  72 |     dev: true
  73 | 
  74 |   /@algolia/autocomplete-shared@1.9.3(@algolia/client-search@4.22.1)(algoliasearch@4.22.1):
  75 |     resolution: {integrity: sha512-Wnm9E4Ye6Rl6sTTqjoymD+l8DjSTHsHboVRYrKgEt8Q7UHm9nYbqhN/i0fhUYA3OAEH7WA8x3jfpnmJm3rKvaQ==}
  76 |     peerDependencies:
  77 |       '@algolia/client-search': '>= 4.9.1 < 6'
  78 |       algoliasearch: '>= 4.9.1 < 6'
  79 |     dependencies:
  80 |       '@algolia/client-search': 4.22.1
  81 |       algoliasearch: 4.22.1
  82 |     dev: true
  83 | 
  84 |   /@algolia/cache-browser-local-storage@4.22.1:
  85 |     resolution: {integrity: sha512-Sw6IAmOCvvP6QNgY9j+Hv09mvkvEIDKjYW8ow0UDDAxSXy664RBNQk3i/0nt7gvceOJ6jGmOTimaZoY1THmU7g==}
  86 |     dependencies:
  87 |       '@algolia/cache-common': 4.22.1
  88 |     dev: true
  89 | 
  90 |   /@algolia/cache-common@4.22.1:
  91 |     resolution: {integrity: sha512-TJMBKqZNKYB9TptRRjSUtevJeQVXRmg6rk9qgFKWvOy8jhCPdyNZV1nB3SKGufzvTVbomAukFR8guu/8NRKBTA==}
  92 |     dev: true
  93 | 
  94 |   /@algolia/cache-in-memory@4.22.1:
  95 |     resolution: {integrity: sha512-ve+6Ac2LhwpufuWavM/aHjLoNz/Z/sYSgNIXsinGofWOysPilQZPUetqLj8vbvi+DHZZaYSEP9H5SRVXnpsNNw==}
  96 |     dependencies:
  97 |       '@algolia/cache-common': 4.22.1
  98 |     dev: true
  99 | 
 100 |   /@algolia/client-account@4.22.1:
 101 |     resolution: {integrity: sha512-k8m+oegM2zlns/TwZyi4YgCtyToackkOpE+xCaKCYfBfDtdGOaVZCM5YvGPtK+HGaJMIN/DoTL8asbM3NzHonw==}
 102 |     dependencies:
 103 |       '@algolia/client-common': 4.22.1
 104 |       '@algolia/client-search': 4.22.1
 105 |       '@algolia/transporter': 4.22.1
 106 |     dev: true
 107 | 
 108 |   /@algolia/client-analytics@4.22.1:
 109 |     resolution: {integrity: sha512-1ssi9pyxyQNN4a7Ji9R50nSdISIumMFDwKNuwZipB6TkauJ8J7ha/uO60sPJFqQyqvvI+px7RSNRQT3Zrvzieg==}
 110 |     dependencies:
 111 |       '@algolia/client-common': 4.22.1
 112 |       '@algolia/client-search': 4.22.1
 113 |       '@algolia/requester-common': 4.22.1
 114 |       '@algolia/transporter': 4.22.1
 115 |     dev: true
 116 | 
 117 |   /@algolia/client-common@4.22.1:
 118 |     resolution: {integrity: sha512-IvaL5v9mZtm4k4QHbBGDmU3wa/mKokmqNBqPj0K7lcR8ZDKzUorhcGp/u8PkPC/e0zoHSTvRh7TRkGX3Lm7iOQ==}
 119 |     dependencies:
 120 |       '@algolia/requester-common': 4.22.1
 121 |       '@algolia/transporter': 4.22.1
 122 |     dev: true
 123 | 
 124 |   /@algolia/client-personalization@4.22.1:
 125 |     resolution: {integrity: sha512-sl+/klQJ93+4yaqZ7ezOttMQ/nczly/3GmgZXJ1xmoewP5jmdP/X/nV5U7EHHH3hCUEHeN7X1nsIhGPVt9E1cQ==}
 126 |     dependencies:
 127 |       '@algolia/client-common': 4.22.1
 128 |       '@algolia/requester-common': 4.22.1
 129 |       '@algolia/transporter': 4.22.1
 130 |     dev: true
 131 | 
 132 |   /@algolia/client-search@4.22.1:
 133 |     resolution: {integrity: sha512-yb05NA4tNaOgx3+rOxAmFztgMTtGBi97X7PC3jyNeGiwkAjOZc2QrdZBYyIdcDLoI09N0gjtpClcackoTN0gPA==}
 134 |     dependencies:
 135 |       '@algolia/client-common': 4.22.1
 136 |       '@algolia/requester-common': 4.22.1
 137 |       '@algolia/transporter': 4.22.1
 138 |     dev: true
 139 | 
 140 |   /@algolia/logger-common@4.22.1:
 141 |     resolution: {integrity: sha512-OnTFymd2odHSO39r4DSWRFETkBufnY2iGUZNrMXpIhF5cmFE8pGoINNPzwg02QLBlGSaLqdKy0bM8S0GyqPLBg==}
 142 |     dev: true
 143 | 
 144 |   /@algolia/logger-console@4.22.1:
 145 |     resolution: {integrity: sha512-O99rcqpVPKN1RlpgD6H3khUWylU24OXlzkavUAMy6QZd1776QAcauE3oP8CmD43nbaTjBexZj2nGsBH9Tc0FVA==}
 146 |     dependencies:
 147 |       '@algolia/logger-common': 4.22.1
 148 |     dev: true
 149 | 
 150 |   /@algolia/requester-browser-xhr@4.22.1:
 151 |     resolution: {integrity: sha512-dtQGYIg6MteqT1Uay3J/0NDqD+UciHy3QgRbk7bNddOJu+p3hzjTRYESqEnoX/DpEkaNYdRHUKNylsqMpgwaEw==}
 152 |     dependencies:
 153 |       '@algolia/requester-common': 4.22.1
 154 |     dev: true
 155 | 
 156 |   /@algolia/requester-common@4.22.1:
 157 |     resolution: {integrity: sha512-dgvhSAtg2MJnR+BxrIFqlLtkLlVVhas9HgYKMk2Uxiy5m6/8HZBL40JVAMb2LovoPFs9I/EWIoFVjOrFwzn5Qg==}
 158 |     dev: true
 159 | 
 160 |   /@algolia/requester-node-http@4.22.1:
 161 |     resolution: {integrity: sha512-JfmZ3MVFQkAU+zug8H3s8rZ6h0ahHZL/SpMaSasTCGYR5EEJsCc8SI5UZ6raPN2tjxa5bxS13BRpGSBUens7EA==}
 162 |     dependencies:
 163 |       '@algolia/requester-common': 4.22.1
 164 |     dev: true
 165 | 
 166 |   /@algolia/transporter@4.22.1:
 167 |     resolution: {integrity: sha512-kzWgc2c9IdxMa3YqA6TN0NW5VrKYYW/BELIn7vnLyn+U/RFdZ4lxxt9/8yq3DKV5snvoDzzO4ClyejZRdV3lMQ==}
 168 |     dependencies:
 169 |       '@algolia/cache-common': 4.22.1
 170 |       '@algolia/logger-common': 4.22.1
 171 |       '@algolia/requester-common': 4.22.1
 172 |     dev: true
 173 | 
 174 |   /@alloc/quick-lru@5.2.0:
 175 |     resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==}
 176 |     engines: {node: '>=10'}
 177 |     dev: true
 178 | 
 179 |   /@babel/helper-string-parser@7.23.4:
 180 |     resolution: {integrity: sha512-803gmbQdqwdf4olxrX4AJyFBV/RTr3rSmOj0rKwesmzlfhYNDEs+/iOcznzpNWlJlIlTJC2QfPFcHB6DlzdVLQ==}
 181 |     engines: {node: '>=6.9.0'}
 182 | 
 183 |   /@babel/helper-validator-identifier@7.22.20:
 184 |     resolution: {integrity: sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==}
 185 |     engines: {node: '>=6.9.0'}
 186 | 
 187 |   /@babel/parser@7.23.6:
 188 |     resolution: {integrity: sha512-Z2uID7YJ7oNvAI20O9X0bblw7Qqs8Q2hFy0R9tAfnfLkp5MW0UH9eUvnDSnFwKZ0AvgS1ucqR4KzvVHgnke1VQ==}
 189 |     engines: {node: '>=6.0.0'}
 190 |     hasBin: true
 191 |     dependencies:
 192 |       '@babel/types': 7.23.6
 193 |     dev: false
 194 | 
 195 |   /@babel/parser@7.23.9:
 196 |     resolution: {integrity: sha512-9tcKgqKbs3xGJ+NtKF2ndOBBLVwPjl1SHxPQkd36r3Dlirw3xWUeGaTbqr7uGZcTaxkVNwc+03SVP7aCdWrTlA==}
 197 |     engines: {node: '>=6.0.0'}
 198 |     hasBin: true
 199 |     dependencies:
 200 |       '@babel/types': 7.23.9
 201 |     dev: true
 202 | 
 203 |   /@babel/types@7.23.6:
 204 |     resolution: {integrity: sha512-+uarb83brBzPKN38NX1MkB6vb6+mwvR6amUulqAE7ccQw1pEl+bCia9TbdG1lsnFP7lZySvUn37CHyXQdfTwzg==}
 205 |     engines: {node: '>=6.9.0'}
 206 |     dependencies:
 207 |       '@babel/helper-string-parser': 7.23.4
 208 |       '@babel/helper-validator-identifier': 7.22.20
 209 |       to-fast-properties: 2.0.0
 210 |     dev: false
 211 | 
 212 |   /@babel/types@7.23.9:
 213 |     resolution: {integrity: sha512-dQjSq/7HaSjRM43FFGnv5keM2HsxpmyV1PfaSVm0nzzjwwTmjOe6J4bC8e3+pTEIgHaHj+1ZlLThRJ2auc/w1Q==}
 214 |     engines: {node: '>=6.9.0'}
 215 |     dependencies:
 216 |       '@babel/helper-string-parser': 7.23.4
 217 |       '@babel/helper-validator-identifier': 7.22.20
 218 |       to-fast-properties: 2.0.0
 219 |     dev: true
 220 | 
 221 |   /@docsearch/css@3.5.2:
 222 |     resolution: {integrity: sha512-SPiDHaWKQZpwR2siD0KQUwlStvIAnEyK6tAE2h2Wuoq8ue9skzhlyVQ1ddzOxX6khULnAALDiR/isSF3bnuciA==}
 223 |     dev: true
 224 | 
 225 |   /@docsearch/js@3.5.2(@algolia/client-search@4.22.1)(search-insights@2.13.0):
 226 |     resolution: {integrity: sha512-p1YFTCDflk8ieHgFJYfmyHBki1D61+U9idwrLh+GQQMrBSP3DLGKpy0XUJtPjAOPltcVbqsTjiPFfH7JImjUNg==}
 227 |     dependencies:
 228 |       '@docsearch/react': 3.5.2(@algolia/client-search@4.22.1)(search-insights@2.13.0)
 229 |       preact: 10.19.5
 230 |     transitivePeerDependencies:
 231 |       - '@algolia/client-search'
 232 |       - '@types/react'
 233 |       - react
 234 |       - react-dom
 235 |       - search-insights
 236 |     dev: true
 237 | 
 238 |   /@docsearch/react@3.5.2(@algolia/client-search@4.22.1)(search-insights@2.13.0):
 239 |     resolution: {integrity: sha512-9Ahcrs5z2jq/DcAvYtvlqEBHImbm4YJI8M9y0x6Tqg598P40HTEkX7hsMcIuThI+hTFxRGZ9hll0Wygm2yEjng==}
 240 |     peerDependencies:
 241 |       '@types/react': '>= 16.8.0 < 19.0.0'
 242 |       react: '>= 16.8.0 < 19.0.0'
 243 |       react-dom: '>= 16.8.0 < 19.0.0'
 244 |       search-insights: '>= 1 < 3'
 245 |     peerDependenciesMeta:
 246 |       '@types/react':
 247 |         optional: true
 248 |       react:
 249 |         optional: true
 250 |       react-dom:
 251 |         optional: true
 252 |       search-insights:
 253 |         optional: true
 254 |     dependencies:
 255 |       '@algolia/autocomplete-core': 1.9.3(@algolia/client-search@4.22.1)(algoliasearch@4.22.1)(search-insights@2.13.0)
 256 |       '@algolia/autocomplete-preset-algolia': 1.9.3(@algolia/client-search@4.22.1)(algoliasearch@4.22.1)
 257 |       '@docsearch/css': 3.5.2
 258 |       algoliasearch: 4.22.1
 259 |       search-insights: 2.13.0
 260 |     transitivePeerDependencies:
 261 |       - '@algolia/client-search'
 262 |     dev: true
 263 | 
 264 |   /@esbuild/aix-ppc64@0.19.12:
 265 |     resolution: {integrity: sha512-bmoCYyWdEL3wDQIVbcyzRyeKLgk2WtWLTWz1ZIAZF/EGbNOwSA6ew3PftJ1PqMiOOGu0OyFMzG53L0zqIpPeNA==}
 266 |     engines: {node: '>=12'}
 267 |     cpu: [ppc64]
 268 |     os: [aix]
 269 |     requiresBuild: true
 270 |     dev: true
 271 |     optional: true
 272 | 
 273 |   /@esbuild/android-arm64@0.19.12:
 274 |     resolution: {integrity: sha512-P0UVNGIienjZv3f5zq0DP3Nt2IE/3plFzuaS96vihvD0Hd6H/q4WXUGpCxD/E8YrSXfNyRPbpTq+T8ZQioSuPA==}
 275 |     engines: {node: '>=12'}
 276 |     cpu: [arm64]
 277 |     os: [android]
 278 |     requiresBuild: true
 279 |     dev: true
 280 |     optional: true
 281 | 
 282 |   /@esbuild/android-arm@0.19.12:
 283 |     resolution: {integrity: sha512-qg/Lj1mu3CdQlDEEiWrlC4eaPZ1KztwGJ9B6J+/6G+/4ewxJg7gqj8eVYWvao1bXrqGiW2rsBZFSX3q2lcW05w==}
 284 |     engines: {node: '>=12'}
 285 |     cpu: [arm]
 286 |     os: [android]
 287 |     requiresBuild: true
 288 |     dev: true
 289 |     optional: true
 290 | 
 291 |   /@esbuild/android-x64@0.19.12:
 292 |     resolution: {integrity: sha512-3k7ZoUW6Q6YqhdhIaq/WZ7HwBpnFBlW905Fa4s4qWJyiNOgT1dOqDiVAQFwBH7gBRZr17gLrlFCRzF6jFh7Kew==}
 293 |     engines: {node: '>=12'}
 294 |     cpu: [x64]
 295 |     os: [android]
 296 |     requiresBuild: true
 297 |     dev: true
 298 |     optional: true
 299 | 
 300 |   /@esbuild/darwin-arm64@0.19.12:
 301 |     resolution: {integrity: sha512-B6IeSgZgtEzGC42jsI+YYu9Z3HKRxp8ZT3cqhvliEHovq8HSX2YX8lNocDn79gCKJXOSaEot9MVYky7AKjCs8g==}
 302 |     engines: {node: '>=12'}
 303 |     cpu: [arm64]
 304 |     os: [darwin]
 305 |     requiresBuild: true
 306 |     dev: true
 307 |     optional: true
 308 | 
 309 |   /@esbuild/darwin-x64@0.19.12:
 310 |     resolution: {integrity: sha512-hKoVkKzFiToTgn+41qGhsUJXFlIjxI/jSYeZf3ugemDYZldIXIxhvwN6erJGlX4t5h417iFuheZ7l+YVn05N3A==}
 311 |     engines: {node: '>=12'}
 312 |     cpu: [x64]
 313 |     os: [darwin]
 314 |     requiresBuild: true
 315 |     dev: true
 316 |     optional: true
 317 | 
 318 |   /@esbuild/freebsd-arm64@0.19.12:
 319 |     resolution: {integrity: sha512-4aRvFIXmwAcDBw9AueDQ2YnGmz5L6obe5kmPT8Vd+/+x/JMVKCgdcRwH6APrbpNXsPz+K653Qg8HB/oXvXVukA==}
 320 |     engines: {node: '>=12'}
 321 |     cpu: [arm64]
 322 |     os: [freebsd]
 323 |     requiresBuild: true
 324 |     dev: true
 325 |     optional: true
 326 | 
 327 |   /@esbuild/freebsd-x64@0.19.12:
 328 |     resolution: {integrity: sha512-EYoXZ4d8xtBoVN7CEwWY2IN4ho76xjYXqSXMNccFSx2lgqOG/1TBPW0yPx1bJZk94qu3tX0fycJeeQsKovA8gg==}
 329 |     engines: {node: '>=12'}
 330 |     cpu: [x64]
 331 |     os: [freebsd]
 332 |     requiresBuild: true
 333 |     dev: true
 334 |     optional: true
 335 | 
 336 |   /@esbuild/linux-arm64@0.19.12:
 337 |     resolution: {integrity: sha512-EoTjyYyLuVPfdPLsGVVVC8a0p1BFFvtpQDB/YLEhaXyf/5bczaGeN15QkR+O4S5LeJ92Tqotve7i1jn35qwvdA==}
 338 |     engines: {node: '>=12'}
 339 |     cpu: [arm64]
 340 |     os: [linux]
 341 |     requiresBuild: true
 342 |     dev: true
 343 |     optional: true
 344 | 
 345 |   /@esbuild/linux-arm@0.19.12:
 346 |     resolution: {integrity: sha512-J5jPms//KhSNv+LO1S1TX1UWp1ucM6N6XuL6ITdKWElCu8wXP72l9MM0zDTzzeikVyqFE6U8YAV9/tFyj0ti+w==}
 347 |     engines: {node: '>=12'}
 348 |     cpu: [arm]
 349 |     os: [linux]
 350 |     requiresBuild: true
 351 |     dev: true
 352 |     optional: true
 353 | 
 354 |   /@esbuild/linux-ia32@0.19.12:
 355 |     resolution: {integrity: sha512-Thsa42rrP1+UIGaWz47uydHSBOgTUnwBwNq59khgIwktK6x60Hivfbux9iNR0eHCHzOLjLMLfUMLCypBkZXMHA==}
 356 |     engines: {node: '>=12'}
 357 |     cpu: [ia32]
 358 |     os: [linux]
 359 |     requiresBuild: true
 360 |     dev: true
 361 |     optional: true
 362 | 
 363 |   /@esbuild/linux-loong64@0.19.12:
 364 |     resolution: {integrity: sha512-LiXdXA0s3IqRRjm6rV6XaWATScKAXjI4R4LoDlvO7+yQqFdlr1Bax62sRwkVvRIrwXxvtYEHHI4dm50jAXkuAA==}
 365 |     engines: {node: '>=12'}
 366 |     cpu: [loong64]
 367 |     os: [linux]
 368 |     requiresBuild: true
 369 |     dev: true
 370 |     optional: true
 371 | 
 372 |   /@esbuild/linux-mips64el@0.19.12:
 373 |     resolution: {integrity: sha512-fEnAuj5VGTanfJ07ff0gOA6IPsvrVHLVb6Lyd1g2/ed67oU1eFzL0r9WL7ZzscD+/N6i3dWumGE1Un4f7Amf+w==}
 374 |     engines: {node: '>=12'}
 375 |     cpu: [mips64el]
 376 |     os: [linux]
 377 |     requiresBuild: true
 378 |     dev: true
 379 |     optional: true
 380 | 
 381 |   /@esbuild/linux-ppc64@0.19.12:
 382 |     resolution: {integrity: sha512-nYJA2/QPimDQOh1rKWedNOe3Gfc8PabU7HT3iXWtNUbRzXS9+vgB0Fjaqr//XNbd82mCxHzik2qotuI89cfixg==}
 383 |     engines: {node: '>=12'}
 384 |     cpu: [ppc64]
 385 |     os: [linux]
 386 |     requiresBuild: true
 387 |     dev: true
 388 |     optional: true
 389 | 
 390 |   /@esbuild/linux-riscv64@0.19.12:
 391 |     resolution: {integrity: sha512-2MueBrlPQCw5dVJJpQdUYgeqIzDQgw3QtiAHUC4RBz9FXPrskyyU3VI1hw7C0BSKB9OduwSJ79FTCqtGMWqJHg==}
 392 |     engines: {node: '>=12'}
 393 |     cpu: [riscv64]
 394 |     os: [linux]
 395 |     requiresBuild: true
 396 |     dev: true
 397 |     optional: true
 398 | 
 399 |   /@esbuild/linux-s390x@0.19.12:
 400 |     resolution: {integrity: sha512-+Pil1Nv3Umes4m3AZKqA2anfhJiVmNCYkPchwFJNEJN5QxmTs1uzyy4TvmDrCRNT2ApwSari7ZIgrPeUx4UZDg==}
 401 |     engines: {node: '>=12'}
 402 |     cpu: [s390x]
 403 |     os: [linux]
 404 |     requiresBuild: true
 405 |     dev: true
 406 |     optional: true
 407 | 
 408 |   /@esbuild/linux-x64@0.19.12:
 409 |     resolution: {integrity: sha512-B71g1QpxfwBvNrfyJdVDexenDIt1CiDN1TIXLbhOw0KhJzE78KIFGX6OJ9MrtC0oOqMWf+0xop4qEU8JrJTwCg==}
 410 |     engines: {node: '>=12'}
 411 |     cpu: [x64]
 412 |     os: [linux]
 413 |     requiresBuild: true
 414 |     dev: true
 415 |     optional: true
 416 | 
 417 |   /@esbuild/netbsd-x64@0.19.12:
 418 |     resolution: {integrity: sha512-3ltjQ7n1owJgFbuC61Oj++XhtzmymoCihNFgT84UAmJnxJfm4sYCiSLTXZtE00VWYpPMYc+ZQmB6xbSdVh0JWA==}
 419 |     engines: {node: '>=12'}
 420 |     cpu: [x64]
 421 |     os: [netbsd]
 422 |     requiresBuild: true
 423 |     dev: true
 424 |     optional: true
 425 | 
 426 |   /@esbuild/openbsd-x64@0.19.12:
 427 |     resolution: {integrity: sha512-RbrfTB9SWsr0kWmb9srfF+L933uMDdu9BIzdA7os2t0TXhCRjrQyCeOt6wVxr79CKD4c+p+YhCj31HBkYcXebw==}
 428 |     engines: {node: '>=12'}
 429 |     cpu: [x64]
 430 |     os: [openbsd]
 431 |     requiresBuild: true
 432 |     dev: true
 433 |     optional: true
 434 | 
 435 |   /@esbuild/sunos-x64@0.19.12:
 436 |     resolution: {integrity: sha512-HKjJwRrW8uWtCQnQOz9qcU3mUZhTUQvi56Q8DPTLLB+DawoiQdjsYq+j+D3s9I8VFtDr+F9CjgXKKC4ss89IeA==}
 437 |     engines: {node: '>=12'}
 438 |     cpu: [x64]
 439 |     os: [sunos]
 440 |     requiresBuild: true
 441 |     dev: true
 442 |     optional: true
 443 | 
 444 |   /@esbuild/win32-arm64@0.19.12:
 445 |     resolution: {integrity: sha512-URgtR1dJnmGvX864pn1B2YUYNzjmXkuJOIqG2HdU62MVS4EHpU2946OZoTMnRUHklGtJdJZ33QfzdjGACXhn1A==}
 446 |     engines: {node: '>=12'}
 447 |     cpu: [arm64]
 448 |     os: [win32]
 449 |     requiresBuild: true
 450 |     dev: true
 451 |     optional: true
 452 | 
 453 |   /@esbuild/win32-ia32@0.19.12:
 454 |     resolution: {integrity: sha512-+ZOE6pUkMOJfmxmBZElNOx72NKpIa/HFOMGzu8fqzQJ5kgf6aTGrcJaFsNiVMH4JKpMipyK+7k0n2UXN7a8YKQ==}
 455 |     engines: {node: '>=12'}
 456 |     cpu: [ia32]
 457 |     os: [win32]
 458 |     requiresBuild: true
 459 |     dev: true
 460 |     optional: true
 461 | 
 462 |   /@esbuild/win32-x64@0.19.12:
 463 |     resolution: {integrity: sha512-T1QyPSDCyMXaO3pzBkF96E8xMkiRYbUEZADd29SyPGabqxMViNoii+NcK7eWJAEoU6RZyEm5lVSIjTmcdoB9HA==}
 464 |     engines: {node: '>=12'}
 465 |     cpu: [x64]
 466 |     os: [win32]
 467 |     requiresBuild: true
 468 |     dev: true
 469 |     optional: true
 470 | 
 471 |   /@isaacs/cliui@8.0.2:
 472 |     resolution: {integrity: sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==}
 473 |     engines: {node: '>=12'}
 474 |     dependencies:
 475 |       string-width: 5.1.2
 476 |       string-width-cjs: /string-width@4.2.3
 477 |       strip-ansi: 7.1.0
 478 |       strip-ansi-cjs: /strip-ansi@6.0.1
 479 |       wrap-ansi: 8.1.0
 480 |       wrap-ansi-cjs: /wrap-ansi@7.0.0
 481 |     dev: true
 482 | 
 483 |   /@jridgewell/gen-mapping@0.3.3:
 484 |     resolution: {integrity: sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==}
 485 |     engines: {node: '>=6.0.0'}
 486 |     dependencies:
 487 |       '@jridgewell/set-array': 1.1.2
 488 |       '@jridgewell/sourcemap-codec': 1.4.15
 489 |       '@jridgewell/trace-mapping': 0.3.22
 490 |     dev: true
 491 | 
 492 |   /@jridgewell/resolve-uri@3.1.1:
 493 |     resolution: {integrity: sha512-dSYZh7HhCDtCKm4QakX0xFpsRDqjjtZf/kjI/v3T3Nwt5r8/qz/M19F9ySyOqU94SXBmeG9ttTul+YnR4LOxFA==}
 494 |     engines: {node: '>=6.0.0'}
 495 |     dev: true
 496 | 
 497 |   /@jridgewell/set-array@1.1.2:
 498 |     resolution: {integrity: sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==}
 499 |     engines: {node: '>=6.0.0'}
 500 |     dev: true
 501 | 
 502 |   /@jridgewell/sourcemap-codec@1.4.15:
 503 |     resolution: {integrity: sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==}
 504 | 
 505 |   /@jridgewell/trace-mapping@0.3.22:
 506 |     resolution: {integrity: sha512-Wf963MzWtA2sjrNt+g18IAln9lKnlRp+K2eH4jjIoF1wYeq3aMREpG09xhlhdzS0EjwU7qmUJYangWa+151vZw==}
 507 |     dependencies:
 508 |       '@jridgewell/resolve-uri': 3.1.1
 509 |       '@jridgewell/sourcemap-codec': 1.4.15
 510 |     dev: true
 511 | 
 512 |   /@nodelib/fs.scandir@2.1.5:
 513 |     resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
 514 |     engines: {node: '>= 8'}
 515 |     dependencies:
 516 |       '@nodelib/fs.stat': 2.0.5
 517 |       run-parallel: 1.2.0
 518 |     dev: true
 519 | 
 520 |   /@nodelib/fs.stat@2.0.5:
 521 |     resolution: {integrity: sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==}
 522 |     engines: {node: '>= 8'}
 523 |     dev: true
 524 | 
 525 |   /@nodelib/fs.walk@1.2.8:
 526 |     resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
 527 |     engines: {node: '>= 8'}
 528 |     dependencies:
 529 |       '@nodelib/fs.scandir': 2.1.5
 530 |       fastq: 1.16.0
 531 |     dev: true
 532 | 
 533 |   /@pkgjs/parseargs@0.11.0:
 534 |     resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
 535 |     engines: {node: '>=14'}
 536 |     requiresBuild: true
 537 |     dev: true
 538 |     optional: true
 539 | 
 540 |   /@rollup/rollup-android-arm-eabi@4.12.0:
 541 |     resolution: {integrity: sha512-+ac02NL/2TCKRrJu2wffk1kZ+RyqxVUlbjSagNgPm94frxtr+XDL12E5Ll1enWskLrtrZ2r8L3wED1orIibV/w==}
 542 |     cpu: [arm]
 543 |     os: [android]
 544 |     requiresBuild: true
 545 |     dev: true
 546 |     optional: true
 547 | 
 548 |   /@rollup/rollup-android-arm64@4.12.0:
 549 |     resolution: {integrity: sha512-OBqcX2BMe6nvjQ0Nyp7cC90cnumt8PXmO7Dp3gfAju/6YwG0Tj74z1vKrfRz7qAv23nBcYM8BCbhrsWqO7PzQQ==}
 550 |     cpu: [arm64]
 551 |     os: [android]
 552 |     requiresBuild: true
 553 |     dev: true
 554 |     optional: true
 555 | 
 556 |   /@rollup/rollup-darwin-arm64@4.12.0:
 557 |     resolution: {integrity: sha512-X64tZd8dRE/QTrBIEs63kaOBG0b5GVEd3ccoLtyf6IdXtHdh8h+I56C2yC3PtC9Ucnv0CpNFJLqKFVgCYe0lOQ==}
 558 |     cpu: [arm64]
 559 |     os: [darwin]
 560 |     requiresBuild: true
 561 |     dev: true
 562 |     optional: true
 563 | 
 564 |   /@rollup/rollup-darwin-x64@4.12.0:
 565 |     resolution: {integrity: sha512-cc71KUZoVbUJmGP2cOuiZ9HSOP14AzBAThn3OU+9LcA1+IUqswJyR1cAJj3Mg55HbjZP6OLAIscbQsQLrpgTOg==}
 566 |     cpu: [x64]
 567 |     os: [darwin]
 568 |     requiresBuild: true
 569 |     dev: true
 570 |     optional: true
 571 | 
 572 |   /@rollup/rollup-linux-arm-gnueabihf@4.12.0:
 573 |     resolution: {integrity: sha512-a6w/Y3hyyO6GlpKL2xJ4IOh/7d+APaqLYdMf86xnczU3nurFTaVN9s9jOXQg97BE4nYm/7Ga51rjec5nfRdrvA==}
 574 |     cpu: [arm]
 575 |     os: [linux]
 576 |     requiresBuild: true
 577 |     dev: true
 578 |     optional: true
 579 | 
 580 |   /@rollup/rollup-linux-arm64-gnu@4.12.0:
 581 |     resolution: {integrity: sha512-0fZBq27b+D7Ar5CQMofVN8sggOVhEtzFUwOwPppQt0k+VR+7UHMZZY4y+64WJ06XOhBTKXtQB/Sv0NwQMXyNAA==}
 582 |     cpu: [arm64]
 583 |     os: [linux]
 584 |     requiresBuild: true
 585 |     dev: true
 586 |     optional: true
 587 | 
 588 |   /@rollup/rollup-linux-arm64-musl@4.12.0:
 589 |     resolution: {integrity: sha512-eTvzUS3hhhlgeAv6bfigekzWZjaEX9xP9HhxB0Dvrdbkk5w/b+1Sxct2ZuDxNJKzsRStSq1EaEkVSEe7A7ipgQ==}
 590 |     cpu: [arm64]
 591 |     os: [linux]
 592 |     requiresBuild: true
 593 |     dev: true
 594 |     optional: true
 595 | 
 596 |   /@rollup/rollup-linux-riscv64-gnu@4.12.0:
 597 |     resolution: {integrity: sha512-ix+qAB9qmrCRiaO71VFfY8rkiAZJL8zQRXveS27HS+pKdjwUfEhqo2+YF2oI+H/22Xsiski+qqwIBxVewLK7sw==}
 598 |     cpu: [riscv64]
 599 |     os: [linux]
 600 |     requiresBuild: true
 601 |     dev: true
 602 |     optional: true
 603 | 
 604 |   /@rollup/rollup-linux-x64-gnu@4.12.0:
 605 |     resolution: {integrity: sha512-TenQhZVOtw/3qKOPa7d+QgkeM6xY0LtwzR8OplmyL5LrgTWIXpTQg2Q2ycBf8jm+SFW2Wt/DTn1gf7nFp3ssVA==}
 606 |     cpu: [x64]
 607 |     os: [linux]
 608 |     requiresBuild: true
 609 |     dev: true
 610 |     optional: true
 611 | 
 612 |   /@rollup/rollup-linux-x64-musl@4.12.0:
 613 |     resolution: {integrity: sha512-LfFdRhNnW0zdMvdCb5FNuWlls2WbbSridJvxOvYWgSBOYZtgBfW9UGNJG//rwMqTX1xQE9BAodvMH9tAusKDUw==}
 614 |     cpu: [x64]
 615 |     os: [linux]
 616 |     requiresBuild: true
 617 |     dev: true
 618 |     optional: true
 619 | 
 620 |   /@rollup/rollup-win32-arm64-msvc@4.12.0:
 621 |     resolution: {integrity: sha512-JPDxovheWNp6d7AHCgsUlkuCKvtu3RB55iNEkaQcf0ttsDU/JZF+iQnYcQJSk/7PtT4mjjVG8N1kpwnI9SLYaw==}
 622 |     cpu: [arm64]
 623 |     os: [win32]
 624 |     requiresBuild: true
 625 |     dev: true
 626 |     optional: true
 627 | 
 628 |   /@rollup/rollup-win32-ia32-msvc@4.12.0:
 629 |     resolution: {integrity: sha512-fjtuvMWRGJn1oZacG8IPnzIV6GF2/XG+h71FKn76OYFqySXInJtseAqdprVTDTyqPxQOG9Exak5/E9Z3+EJ8ZA==}
 630 |     cpu: [ia32]
 631 |     os: [win32]
 632 |     requiresBuild: true
 633 |     dev: true
 634 |     optional: true
 635 | 
 636 |   /@rollup/rollup-win32-x64-msvc@4.12.0:
 637 |     resolution: {integrity: sha512-ZYmr5mS2wd4Dew/JjT0Fqi2NPB/ZhZ2VvPp7SmvPZb4Y1CG/LRcS6tcRo2cYU7zLK5A7cdbhWnnWmUjoI4qapg==}
 638 |     cpu: [x64]
 639 |     os: [win32]
 640 |     requiresBuild: true
 641 |     dev: true
 642 |     optional: true
 643 | 
 644 |   /@shikijs/core@1.1.5:
 645 |     resolution: {integrity: sha512-cKc5vGQ4p/4sjx48BHIO7CvLaN32vqpz5Wh7v2n+U1EezGdfX4Wms7khBctKz3iCg9yYq4sfGUc2t+JWj6EUsw==}
 646 |     dev: true
 647 | 
 648 |   /@shikijs/transformers@1.1.5:
 649 |     resolution: {integrity: sha512-ot6KWPmLuSN9nA9FAhttOXZIjKIy7cnwpNtI9aWmYN72RUaDz8eojRfMGUXsXXUxW/buvcvdZQAQldk7/pFpdw==}
 650 |     dependencies:
 651 |       shiki: 1.1.5
 652 |     dev: true
 653 | 
 654 |   /@types/estree@1.0.5:
 655 |     resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==}
 656 |     dev: true
 657 | 
 658 |   /@types/linkify-it@3.0.5:
 659 |     resolution: {integrity: sha512-yg6E+u0/+Zjva+buc3EIb+29XEg4wltq7cSmd4Uc2EE/1nUVmxyzpX6gUXD0V8jIrG0r7YeOGVIbYRkxeooCtw==}
 660 |     dev: true
 661 | 
 662 |   /@types/markdown-it@13.0.7:
 663 |     resolution: {integrity: sha512-U/CBi2YUUcTHBt5tjO2r5QV/x0Po6nsYwQU4Y04fBS6vfoImaiZ6f8bi3CjTCxBPQSO1LMyUqkByzi8AidyxfA==}
 664 |     dependencies:
 665 |       '@types/linkify-it': 3.0.5
 666 |       '@types/mdurl': 1.0.5
 667 |     dev: true
 668 | 
 669 |   /@types/mdurl@1.0.5:
 670 |     resolution: {integrity: sha512-6L6VymKTzYSrEf4Nev4Xa1LCHKrlTlYCBMTlQKFuddo1CvQcE52I0mwfOJayueUC7MJuXOeHTcIU683lzd0cUA==}
 671 |     dev: true
 672 | 
 673 |   /@types/node@20.10.8:
 674 |     resolution: {integrity: sha512-f8nQs3cLxbAFc00vEU59yf9UyGUftkPaLGfvbVOIDdx2i1b8epBqj2aNGyP19fiyXWvlmZ7qC1XLjAzw/OKIeA==}
 675 |     dependencies:
 676 |       undici-types: 5.26.5
 677 |     dev: true
 678 | 
 679 |   /@types/web-bluetooth@0.0.20:
 680 |     resolution: {integrity: sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow==}
 681 |     dev: true
 682 | 
 683 |   /@vitejs/plugin-vue@5.0.4(vite@5.1.3)(vue@3.4.19):
 684 |     resolution: {integrity: sha512-WS3hevEszI6CEVEx28F8RjTX97k3KsrcY6kvTg7+Whm5y3oYvcqzVeGCU3hxSAn4uY2CLCkeokkGKpoctccilQ==}
 685 |     engines: {node: ^18.0.0 || >=20.0.0}
 686 |     peerDependencies:
 687 |       vite: ^5.0.0
 688 |       vue: ^3.2.25
 689 |     dependencies:
 690 |       vite: 5.1.3(@types/node@20.10.8)(sass@1.69.7)
 691 |       vue: 3.4.19
 692 |     dev: true
 693 | 
 694 |   /@vue/compiler-core@3.4.15:
 695 |     resolution: {integrity: sha512-XcJQVOaxTKCnth1vCxEChteGuwG6wqnUHxAm1DO3gCz0+uXKaJNx8/digSz4dLALCy8n2lKq24jSUs8segoqIw==}
 696 |     dependencies:
 697 |       '@babel/parser': 7.23.6
 698 |       '@vue/shared': 3.4.15
 699 |       entities: 4.5.0
 700 |       estree-walker: 2.0.2
 701 |       source-map-js: 1.0.2
 702 |     dev: false
 703 | 
 704 |   /@vue/compiler-core@3.4.19:
 705 |     resolution: {integrity: sha512-gj81785z0JNzRcU0Mq98E56e4ltO1yf8k5PQ+tV/7YHnbZkrM0fyFyuttnN8ngJZjbpofWE/m4qjKBiLl8Ju4w==}
 706 |     dependencies:
 707 |       '@babel/parser': 7.23.9
 708 |       '@vue/shared': 3.4.19
 709 |       entities: 4.5.0
 710 |       estree-walker: 2.0.2
 711 |       source-map-js: 1.0.2
 712 |     dev: true
 713 | 
 714 |   /@vue/compiler-dom@3.4.15:
 715 |     resolution: {integrity: sha512-wox0aasVV74zoXyblarOM3AZQz/Z+OunYcIHe1OsGclCHt8RsRm04DObjefaI82u6XDzv+qGWZ24tIsRAIi5MQ==}
 716 |     dependencies:
 717 |       '@vue/compiler-core': 3.4.15
 718 |       '@vue/shared': 3.4.15
 719 |     dev: false
 720 | 
 721 |   /@vue/compiler-dom@3.4.19:
 722 |     resolution: {integrity: sha512-vm6+cogWrshjqEHTzIDCp72DKtea8Ry/QVpQRYoyTIg9k7QZDX6D8+HGURjtmatfgM8xgCFtJJaOlCaRYRK3QA==}
 723 |     dependencies:
 724 |       '@vue/compiler-core': 3.4.19
 725 |       '@vue/shared': 3.4.19
 726 |     dev: true
 727 | 
 728 |   /@vue/compiler-sfc@3.4.15:
 729 |     resolution: {integrity: sha512-LCn5M6QpkpFsh3GQvs2mJUOAlBQcCco8D60Bcqmf3O3w5a+KWS5GvYbrrJBkgvL1BDnTp+e8q0lXCLgHhKguBA==}
 730 |     dependencies:
 731 |       '@babel/parser': 7.23.6
 732 |       '@vue/compiler-core': 3.4.15
 733 |       '@vue/compiler-dom': 3.4.15
 734 |       '@vue/compiler-ssr': 3.4.15
 735 |       '@vue/shared': 3.4.15
 736 |       estree-walker: 2.0.2
 737 |       magic-string: 0.30.5
 738 |       postcss: 8.4.33
 739 |       source-map-js: 1.0.2
 740 |     dev: false
 741 | 
 742 |   /@vue/compiler-sfc@3.4.19:
 743 |     resolution: {integrity: sha512-LQ3U4SN0DlvV0xhr1lUsgLCYlwQfUfetyPxkKYu7dkfvx7g3ojrGAkw0AERLOKYXuAGnqFsEuytkdcComei3Yg==}
 744 |     dependencies:
 745 |       '@babel/parser': 7.23.9
 746 |       '@vue/compiler-core': 3.4.19
 747 |       '@vue/compiler-dom': 3.4.19
 748 |       '@vue/compiler-ssr': 3.4.19
 749 |       '@vue/shared': 3.4.19
 750 |       estree-walker: 2.0.2
 751 |       magic-string: 0.30.7
 752 |       postcss: 8.4.33
 753 |       source-map-js: 1.0.2
 754 |     dev: true
 755 | 
 756 |   /@vue/compiler-ssr@3.4.15:
 757 |     resolution: {integrity: sha512-1jdeQyiGznr8gjFDadVmOJqZiLNSsMa5ZgqavkPZ8O2wjHv0tVuAEsw5hTdUoUW4232vpBbL/wJhzVW/JwY1Uw==}
 758 |     dependencies:
 759 |       '@vue/compiler-dom': 3.4.15
 760 |       '@vue/shared': 3.4.15
 761 |     dev: false
 762 | 
 763 |   /@vue/compiler-ssr@3.4.19:
 764 |     resolution: {integrity: sha512-P0PLKC4+u4OMJ8sinba/5Z/iDT84uMRRlrWzadgLA69opCpI1gG4N55qDSC+dedwq2fJtzmGald05LWR5TFfLw==}
 765 |     dependencies:
 766 |       '@vue/compiler-dom': 3.4.19
 767 |       '@vue/shared': 3.4.19
 768 |     dev: true
 769 | 
 770 |   /@vue/devtools-api@7.0.15(vue@3.4.19):
 771 |     resolution: {integrity: sha512-kgEYWosDyWpS1vFSuJNNWUnHkP+VkL3Y+9mw+rf7ex41SwbYL/WdC3KXqAtjiSrEs7r/FrHmUTh0BkINJPFkbA==}
 772 |     dependencies:
 773 |       '@vue/devtools-kit': 7.0.15(vue@3.4.19)
 774 |     transitivePeerDependencies:
 775 |       - vue
 776 |     dev: true
 777 | 
 778 |   /@vue/devtools-kit@7.0.15(vue@3.4.19):
 779 |     resolution: {integrity: sha512-dT7OeCe1LUCIhHIb/yRR6Hn+XHh73r1o78onqCrxEKHdoZwBItiIeVnmJZPEUDFstIxfs+tJL231mySk3laTow==}
 780 |     peerDependencies:
 781 |       vue: ^3.0.0
 782 |     dependencies:
 783 |       '@vue/devtools-shared': 7.0.15
 784 |       hookable: 5.5.3
 785 |       mitt: 3.0.1
 786 |       perfect-debounce: 1.0.0
 787 |       speakingurl: 14.0.1
 788 |       vue: 3.4.19
 789 |     dev: true
 790 | 
 791 |   /@vue/devtools-shared@7.0.15:
 792 |     resolution: {integrity: sha512-fpfvMVvS7aDgO7x2JPFiTQ1MHcCc63/bE7yTgs278gMBybuO9b3hdiZ/k0Pw1rN+RefaU9yQiFA+5CCFc1D+6w==}
 793 |     dependencies:
 794 |       rfdc: 1.3.1
 795 |     dev: true
 796 | 
 797 |   /@vue/reactivity@3.4.15:
 798 |     resolution: {integrity: sha512-55yJh2bsff20K5O84MxSvXKPHHt17I2EomHznvFiJCAZpJTNW8IuLj1xZWMLELRhBK3kkFV/1ErZGHJfah7i7w==}
 799 |     dependencies:
 800 |       '@vue/shared': 3.4.15
 801 |     dev: false
 802 | 
 803 |   /@vue/reactivity@3.4.19:
 804 |     resolution: {integrity: sha512-+VcwrQvLZgEclGZRHx4O2XhyEEcKaBi50WbxdVItEezUf4fqRh838Ix6amWTdX0CNb/b6t3Gkz3eOebfcSt+UA==}
 805 |     dependencies:
 806 |       '@vue/shared': 3.4.19
 807 |     dev: true
 808 | 
 809 |   /@vue/runtime-core@3.4.15:
 810 |     resolution: {integrity: sha512-6E3by5m6v1AkW0McCeAyhHTw+3y17YCOKG0U0HDKDscV4Hs0kgNT5G+GCHak16jKgcCDHpI9xe5NKb8sdLCLdw==}
 811 |     dependencies:
 812 |       '@vue/reactivity': 3.4.15
 813 |       '@vue/shared': 3.4.15
 814 |     dev: false
 815 | 
 816 |   /@vue/runtime-core@3.4.19:
 817 |     resolution: {integrity: sha512-/Z3tFwOrerJB/oyutmJGoYbuoadphDcJAd5jOuJE86THNZji9pYjZroQ2NFsZkTxOq0GJbb+s2kxTYToDiyZzw==}
 818 |     dependencies:
 819 |       '@vue/reactivity': 3.4.19
 820 |       '@vue/shared': 3.4.19
 821 |     dev: true
 822 | 
 823 |   /@vue/runtime-dom@3.4.15:
 824 |     resolution: {integrity: sha512-EVW8D6vfFVq3V/yDKNPBFkZKGMFSvZrUQmx196o/v2tHKdwWdiZjYUBS+0Ez3+ohRyF8Njwy/6FH5gYJ75liUw==}
 825 |     dependencies:
 826 |       '@vue/runtime-core': 3.4.15
 827 |       '@vue/shared': 3.4.15
 828 |       csstype: 3.1.3
 829 |     dev: false
 830 | 
 831 |   /@vue/runtime-dom@3.4.19:
 832 |     resolution: {integrity: sha512-IyZzIDqfNCF0OyZOauL+F4yzjMPN2rPd8nhqPP2N1lBn3kYqJpPHHru+83Rkvo2lHz5mW+rEeIMEF9qY3PB94g==}
 833 |     dependencies:
 834 |       '@vue/runtime-core': 3.4.19
 835 |       '@vue/shared': 3.4.19
 836 |       csstype: 3.1.3
 837 |     dev: true
 838 | 
 839 |   /@vue/server-renderer@3.4.15(vue@3.4.15):
 840 |     resolution: {integrity: sha512-3HYzaidu9cHjrT+qGUuDhFYvF/j643bHC6uUN9BgM11DVy+pM6ATsG6uPBLnkwOgs7BpJABReLmpL3ZPAsUaqw==}
 841 |     peerDependencies:
 842 |       vue: 3.4.15
 843 |     dependencies:
 844 |       '@vue/compiler-ssr': 3.4.15
 845 |       '@vue/shared': 3.4.15
 846 |       vue: 3.4.15
 847 |     dev: false
 848 | 
 849 |   /@vue/server-renderer@3.4.19(vue@3.4.19):
 850 |     resolution: {integrity: sha512-eAj2p0c429RZyyhtMRnttjcSToch+kTWxFPHlzGMkR28ZbF1PDlTcmGmlDxccBuqNd9iOQ7xPRPAGgPVj+YpQw==}
 851 |     peerDependencies:
 852 |       vue: 3.4.19
 853 |     dependencies:
 854 |       '@vue/compiler-ssr': 3.4.19
 855 |       '@vue/shared': 3.4.19
 856 |       vue: 3.4.19
 857 |     dev: true
 858 | 
 859 |   /@vue/shared@3.4.15:
 860 |     resolution: {integrity: sha512-KzfPTxVaWfB+eGcGdbSf4CWdaXcGDqckoeXUh7SB3fZdEtzPCK2Vq9B/lRRL3yutax/LWITz+SwvgyOxz5V75g==}
 861 |     dev: false
 862 | 
 863 |   /@vue/shared@3.4.19:
 864 |     resolution: {integrity: sha512-/KliRRHMF6LoiThEy+4c1Z4KB/gbPrGjWwJR+crg2otgrf/egKzRaCPvJ51S5oetgsgXLfc4Rm5ZgrKHZrtMSw==}
 865 |     dev: true
 866 | 
 867 |   /@vueuse/core@10.7.2(vue@3.4.19):
 868 |     resolution: {integrity: sha512-AOyAL2rK0By62Hm+iqQn6Rbu8bfmbgaIMXcE3TSr7BdQ42wnSFlwIdPjInO62onYsEMK/yDMU8C6oGfDAtZ2qQ==}
 869 |     dependencies:
 870 |       '@types/web-bluetooth': 0.0.20
 871 |       '@vueuse/metadata': 10.7.2
 872 |       '@vueuse/shared': 10.7.2(vue@3.4.19)
 873 |       vue-demi: 0.14.7(vue@3.4.19)
 874 |     transitivePeerDependencies:
 875 |       - '@vue/composition-api'
 876 |       - vue
 877 |     dev: true
 878 | 
 879 |   /@vueuse/integrations@10.7.2(focus-trap@7.5.4)(vue@3.4.19):
 880 |     resolution: {integrity: sha512-+u3RLPFedjASs5EKPc69Ge49WNgqeMfSxFn+qrQTzblPXZg6+EFzhjarS5edj2qAf6xQ93f95TUxRwKStXj/sQ==}
 881 |     peerDependencies:
 882 |       async-validator: '*'
 883 |       axios: '*'
 884 |       change-case: '*'
 885 |       drauu: '*'
 886 |       focus-trap: '*'
 887 |       fuse.js: '*'
 888 |       idb-keyval: '*'
 889 |       jwt-decode: '*'
 890 |       nprogress: '*'
 891 |       qrcode: '*'
 892 |       sortablejs: '*'
 893 |       universal-cookie: '*'
 894 |     peerDependenciesMeta:
 895 |       async-validator:
 896 |         optional: true
 897 |       axios:
 898 |         optional: true
 899 |       change-case:
 900 |         optional: true
 901 |       drauu:
 902 |         optional: true
 903 |       focus-trap:
 904 |         optional: true
 905 |       fuse.js:
 906 |         optional: true
 907 |       idb-keyval:
 908 |         optional: true
 909 |       jwt-decode:
 910 |         optional: true
 911 |       nprogress:
 912 |         optional: true
 913 |       qrcode:
 914 |         optional: true
 915 |       sortablejs:
 916 |         optional: true
 917 |       universal-cookie:
 918 |         optional: true
 919 |     dependencies:
 920 |       '@vueuse/core': 10.7.2(vue@3.4.19)
 921 |       '@vueuse/shared': 10.7.2(vue@3.4.19)
 922 |       focus-trap: 7.5.4
 923 |       vue-demi: 0.14.7(vue@3.4.19)
 924 |     transitivePeerDependencies:
 925 |       - '@vue/composition-api'
 926 |       - vue
 927 |     dev: true
 928 | 
 929 |   /@vueuse/metadata@10.7.2:
 930 |     resolution: {integrity: sha512-kCWPb4J2KGrwLtn1eJwaJD742u1k5h6v/St5wFe8Quih90+k2a0JP8BS4Zp34XUuJqS2AxFYMb1wjUL8HfhWsQ==}
 931 |     dev: true
 932 | 
 933 |   /@vueuse/shared@10.7.2(vue@3.4.19):
 934 |     resolution: {integrity: sha512-qFbXoxS44pi2FkgFjPvF4h7c9oMDutpyBdcJdMYIMg9XyXli2meFMuaKn+UMgsClo//Th6+beeCgqweT/79BVA==}
 935 |     dependencies:
 936 |       vue-demi: 0.14.7(vue@3.4.19)
 937 |     transitivePeerDependencies:
 938 |       - '@vue/composition-api'
 939 |       - vue
 940 |     dev: true
 941 | 
 942 |   /algoliasearch@4.22.1:
 943 |     resolution: {integrity: sha512-jwydKFQJKIx9kIZ8Jm44SdpigFwRGPESaxZBaHSV0XWN2yBJAOT4mT7ppvlrpA4UGzz92pqFnVKr/kaZXrcreg==}
 944 |     dependencies:
 945 |       '@algolia/cache-browser-local-storage': 4.22.1
 946 |       '@algolia/cache-common': 4.22.1
 947 |       '@algolia/cache-in-memory': 4.22.1
 948 |       '@algolia/client-account': 4.22.1
 949 |       '@algolia/client-analytics': 4.22.1
 950 |       '@algolia/client-common': 4.22.1
 951 |       '@algolia/client-personalization': 4.22.1
 952 |       '@algolia/client-search': 4.22.1
 953 |       '@algolia/logger-common': 4.22.1
 954 |       '@algolia/logger-console': 4.22.1
 955 |       '@algolia/requester-browser-xhr': 4.22.1
 956 |       '@algolia/requester-common': 4.22.1
 957 |       '@algolia/requester-node-http': 4.22.1
 958 |       '@algolia/transporter': 4.22.1
 959 |     dev: true
 960 | 
 961 |   /ansi-colors@4.1.3:
 962 |     resolution: {integrity: sha512-/6w/C21Pm1A7aZitlI5Ni/2J6FFQN8i1Cvz3kHABAAbw93v/NlvKdVOqz7CCWz/3iv/JplRSEEZ83XION15ovw==}
 963 |     engines: {node: '>=6'}
 964 | 
 965 |   /ansi-regex@5.0.1:
 966 |     resolution: {integrity: sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==}
 967 |     engines: {node: '>=8'}
 968 |     dev: true
 969 | 
 970 |   /ansi-regex@6.0.1:
 971 |     resolution: {integrity: sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA==}
 972 |     engines: {node: '>=12'}
 973 |     dev: true
 974 | 
 975 |   /ansi-styles@4.3.0:
 976 |     resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==}
 977 |     engines: {node: '>=8'}
 978 |     dependencies:
 979 |       color-convert: 2.0.1
 980 |     dev: true
 981 | 
 982 |   /ansi-styles@6.2.1:
 983 |     resolution: {integrity: sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==}
 984 |     engines: {node: '>=12'}
 985 |     dev: true
 986 | 
 987 |   /any-promise@1.3.0:
 988 |     resolution: {integrity: sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==}
 989 |     dev: true
 990 | 
 991 |   /anymatch@3.1.3:
 992 |     resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
 993 |     engines: {node: '>= 8'}
 994 |     dependencies:
 995 |       normalize-path: 3.0.0
 996 |       picomatch: 2.3.1
 997 |     dev: true
 998 | 
 999 |   /arg@5.0.2:
1000 |     resolution: {integrity: sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==}
1001 |     dev: true
1002 | 
1003 |   /autoprefixer@10.4.17(postcss@8.4.33):
1004 |     resolution: {integrity: sha512-/cpVNRLSfhOtcGflT13P2794gVSgmPgTR+erw5ifnMLZb0UnSlkK4tquLmkd3BhA+nLo5tX8Cu0upUsGKvKbmg==}
1005 |     engines: {node: ^10 || ^12 || >=14}
1006 |     hasBin: true
1007 |     peerDependencies:
1008 |       postcss: ^8.1.0
1009 |     dependencies:
1010 |       browserslist: 4.22.2
1011 |       caniuse-lite: 1.0.30001579
1012 |       fraction.js: 4.3.7
1013 |       normalize-range: 0.1.2
1014 |       picocolors: 1.0.0
1015 |       postcss: 8.4.33
1016 |       postcss-value-parser: 4.2.0
1017 |     dev: true
1018 | 
1019 |   /balanced-match@1.0.2:
1020 |     resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
1021 |     dev: true
1022 | 
1023 |   /binary-extensions@2.2.0:
1024 |     resolution: {integrity: sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==}
1025 |     engines: {node: '>=8'}
1026 |     dev: true
1027 | 
1028 |   /boolbase@1.0.0:
1029 |     resolution: {integrity: sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==}
1030 | 
1031 |   /brace-expansion@2.0.1:
1032 |     resolution: {integrity: sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==}
1033 |     dependencies:
1034 |       balanced-match: 1.0.2
1035 |     dev: true
1036 | 
1037 |   /braces@3.0.2:
1038 |     resolution: {integrity: sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==}
1039 |     engines: {node: '>=8'}
1040 |     dependencies:
1041 |       fill-range: 7.0.1
1042 |     dev: true
1043 | 
1044 |   /browserslist@4.22.2:
1045 |     resolution: {integrity: sha512-0UgcrvQmBDvZHFGdYUehrCNIazki7/lUP3kkoi/r3YB2amZbFM9J43ZRkJTXBUZK4gmx56+Sqk9+Vs9mwZx9+A==}
1046 |     engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
1047 |     hasBin: true
1048 |     dependencies:
1049 |       caniuse-lite: 1.0.30001579
1050 |       electron-to-chromium: 1.4.643
1051 |       node-releases: 2.0.14
1052 |       update-browserslist-db: 1.0.13(browserslist@4.22.2)
1053 |     dev: true
1054 | 
1055 |   /camelcase-css@2.0.1:
1056 |     resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==}
1057 |     engines: {node: '>= 6'}
1058 |     dev: true
1059 | 
1060 |   /caniuse-lite@1.0.30001579:
1061 |     resolution: {integrity: sha512-u5AUVkixruKHJjw/pj9wISlcMpgFWzSrczLZbrqBSxukQixmg0SJ5sZTpvaFvxU0HoQKd4yoyAogyrAz9pzJnA==}
1062 |     dev: true
1063 | 
1064 |   /cheerio-select@1.6.0:
1065 |     resolution: {integrity: sha512-eq0GdBvxVFbqWgmCm7M3XGs1I8oLy/nExUnh6oLqmBditPO9AqQJrkslDpMun/hZ0yyTs8L0m85OHp4ho6Qm9g==}
1066 |     dependencies:
1067 |       css-select: 4.3.0
1068 |       css-what: 6.1.0
1069 |       domelementtype: 2.3.0
1070 |       domhandler: 4.3.1
1071 |       domutils: 2.8.0
1072 | 
1073 |   /cheerio@1.0.0-rc.10:
1074 |     resolution: {integrity: sha512-g0J0q/O6mW8z5zxQ3A8E8J1hUgp4SMOvEoW/x84OwyHKe/Zccz83PVT4y5Crcr530FV6NgmKI1qvGTKVl9XXVw==}
1075 |     engines: {node: '>= 6'}
1076 |     dependencies:
1077 |       cheerio-select: 1.6.0
1078 |       dom-serializer: 1.4.1
1079 |       domhandler: 4.3.1
1080 |       htmlparser2: 6.1.0
1081 |       parse5: 6.0.1
1082 |       parse5-htmlparser2-tree-adapter: 6.0.1
1083 |       tslib: 2.6.2
1084 | 
1085 |   /chokidar@3.5.3:
1086 |     resolution: {integrity: sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==}
1087 |     engines: {node: '>= 8.10.0'}
1088 |     dependencies:
1089 |       anymatch: 3.1.3
1090 |       braces: 3.0.2
1091 |       glob-parent: 5.1.2
1092 |       is-binary-path: 2.1.0
1093 |       is-glob: 4.0.3
1094 |       normalize-path: 3.0.0
1095 |       readdirp: 3.6.0
1096 |     optionalDependencies:
1097 |       fsevents: 2.3.3
1098 |     dev: true
1099 | 
1100 |   /color-convert@2.0.1:
1101 |     resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
1102 |     engines: {node: '>=7.0.0'}
1103 |     dependencies:
1104 |       color-name: 1.1.4
1105 |     dev: true
1106 | 
1107 |   /color-name@1.1.4:
1108 |     resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
1109 |     dev: true
1110 | 
1111 |   /commander@4.1.1:
1112 |     resolution: {integrity: sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==}
1113 |     engines: {node: '>= 6'}
1114 |     dev: true
1115 | 
1116 |   /commander@6.2.1:
1117 |     resolution: {integrity: sha512-U7VdrJFnJgo4xjrHpTzu0yrHPGImdsmD95ZlgYSEajAn2JKzDhDTPG9kBTefmObL2w/ngeZnilk+OV9CG3d7UA==}
1118 |     engines: {node: '>= 6'}
1119 | 
1120 |   /commander@9.2.0:
1121 |     resolution: {integrity: sha512-e2i4wANQiSXgnrBlIatyHtP1odfUp0BbV5Y5nEGbxtIrStkEOAAzCUirvLBNXHLr7kwLvJl6V+4V3XV9x7Wd9w==}
1122 |     engines: {node: ^12.20.0 || >=14}
1123 | 
1124 |   /cross-spawn@7.0.3:
1125 |     resolution: {integrity: sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==}
1126 |     engines: {node: '>= 8'}
1127 |     dependencies:
1128 |       path-key: 3.1.1
1129 |       shebang-command: 2.0.0
1130 |       which: 2.0.2
1131 |     dev: true
1132 | 
1133 |   /css-select@4.3.0:
1134 |     resolution: {integrity: sha512-wPpOYtnsVontu2mODhA19JrqWxNsfdatRKd64kmpRbQgh1KtItko5sTnEpPdpSaJszTOhEMlF/RPz28qj4HqhQ==}
1135 |     dependencies:
1136 |       boolbase: 1.0.0
1137 |       css-what: 6.1.0
1138 |       domhandler: 4.3.1
1139 |       domutils: 2.8.0
1140 |       nth-check: 2.1.1
1141 | 
1142 |   /css-what@6.1.0:
1143 |     resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==}
1144 |     engines: {node: '>= 6'}
1145 | 
1146 |   /cssesc@3.0.0:
1147 |     resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
1148 |     engines: {node: '>=4'}
1149 |     hasBin: true
1150 |     dev: true
1151 | 
1152 |   /csstype@3.1.3:
1153 |     resolution: {integrity: sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==}
1154 | 
1155 |   /didyoumean@1.2.2:
1156 |     resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==}
1157 |     dev: true
1158 | 
1159 |   /dlv@1.1.3:
1160 |     resolution: {integrity: sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==}
1161 |     dev: true
1162 | 
1163 |   /dom-serializer@1.4.1:
1164 |     resolution: {integrity: sha512-VHwB3KfrcOOkelEG2ZOfxqLZdfkil8PtJi4P8N2MMXucZq2yLp75ClViUlOVwyoHEDjYU433Aq+5zWP61+RGag==}
1165 |     dependencies:
1166 |       domelementtype: 2.3.0
1167 |       domhandler: 4.3.1
1168 |       entities: 2.2.0
1169 | 
1170 |   /domelementtype@2.3.0:
1171 |     resolution: {integrity: sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==}
1172 | 
1173 |   /domhandler@3.3.0:
1174 |     resolution: {integrity: sha512-J1C5rIANUbuYK+FuFL98650rihynUOEzRLxW+90bKZRWB6A1X1Tf82GxR1qAWLyfNPRvjqfip3Q5tdYlmAa9lA==}
1175 |     engines: {node: '>= 4'}
1176 |     dependencies:
1177 |       domelementtype: 2.3.0
1178 | 
1179 |   /domhandler@4.3.1:
1180 |     resolution: {integrity: sha512-GrwoxYN+uWlzO8uhUXRl0P+kHE4GtVPfYzVLcUxPL7KNdHKj66vvlhiweIHqYYXWlw+T8iLMp42Lm67ghw4WMQ==}
1181 |     engines: {node: '>= 4'}
1182 |     dependencies:
1183 |       domelementtype: 2.3.0
1184 | 
1185 |   /domutils@2.8.0:
1186 |     resolution: {integrity: sha512-w96Cjofp72M5IIhpjgobBimYEfoPjx1Vx0BSX9P30WBdZW2WIKU0T1Bd0kz2eNZ9ikjKgHbEyKx8BB6H1L3h3A==}
1187 |     dependencies:
1188 |       dom-serializer: 1.4.1
1189 |       domelementtype: 2.3.0
1190 |       domhandler: 4.3.1
1191 | 
1192 |   /eastasianwidth@0.2.0:
1193 |     resolution: {integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==}
1194 |     dev: true
1195 | 
1196 |   /electron-to-chromium@1.4.643:
1197 |     resolution: {integrity: sha512-QHscvvS7gt155PtoRC0dR2ilhL8E9LHhfTQEq1uD5AL0524rBLAwpAREFH06f87/e45B9XkR6Ki5dbhbCsVEIg==}
1198 |     dev: true
1199 | 
1200 |   /emoji-regex@8.0.0:
1201 |     resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
1202 |     dev: true
1203 | 
1204 |   /emoji-regex@9.2.2:
1205 |     resolution: {integrity: sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==}
1206 |     dev: true
1207 | 
1208 |   /entities@2.2.0:
1209 |     resolution: {integrity: sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==}
1210 | 
1211 |   /entities@4.5.0:
1212 |     resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==}
1213 |     engines: {node: '>=0.12'}
1214 | 
1215 |   /esbuild@0.19.12:
1216 |     resolution: {integrity: sha512-aARqgq8roFBj054KvQr5f1sFu0D65G+miZRCuJyJ0G13Zwx7vRar5Zhn2tkQNzIXcBrNVsv/8stehpj+GAjgbg==}
1217 |     engines: {node: '>=12'}
1218 |     hasBin: true
1219 |     requiresBuild: true
1220 |     optionalDependencies:
1221 |       '@esbuild/aix-ppc64': 0.19.12
1222 |       '@esbuild/android-arm': 0.19.12
1223 |       '@esbuild/android-arm64': 0.19.12
1224 |       '@esbuild/android-x64': 0.19.12
1225 |       '@esbuild/darwin-arm64': 0.19.12
1226 |       '@esbuild/darwin-x64': 0.19.12
1227 |       '@esbuild/freebsd-arm64': 0.19.12
1228 |       '@esbuild/freebsd-x64': 0.19.12
1229 |       '@esbuild/linux-arm': 0.19.12
1230 |       '@esbuild/linux-arm64': 0.19.12
1231 |       '@esbuild/linux-ia32': 0.19.12
1232 |       '@esbuild/linux-loong64': 0.19.12
1233 |       '@esbuild/linux-mips64el': 0.19.12
1234 |       '@esbuild/linux-ppc64': 0.19.12
1235 |       '@esbuild/linux-riscv64': 0.19.12
1236 |       '@esbuild/linux-s390x': 0.19.12
1237 |       '@esbuild/linux-x64': 0.19.12
1238 |       '@esbuild/netbsd-x64': 0.19.12
1239 |       '@esbuild/openbsd-x64': 0.19.12
1240 |       '@esbuild/sunos-x64': 0.19.12
1241 |       '@esbuild/win32-arm64': 0.19.12
1242 |       '@esbuild/win32-ia32': 0.19.12
1243 |       '@esbuild/win32-x64': 0.19.12
1244 |     dev: true
1245 | 
1246 |   /escalade@3.1.1:
1247 |     resolution: {integrity: sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==}
1248 |     engines: {node: '>=6'}
1249 |     dev: true
1250 | 
1251 |   /escape-goat@3.0.0:
1252 |     resolution: {integrity: sha512-w3PwNZJwRxlp47QGzhuEBldEqVHHhh8/tIPcl6ecf2Bou99cdAt0knihBV0Ecc7CGxYduXVBDheH1K2oADRlvw==}
1253 |     engines: {node: '>=10'}
1254 | 
1255 |   /esm@3.2.25:
1256 |     resolution: {integrity: sha512-U1suiZ2oDVWv4zPO56S0NcR5QriEahGtdN2OR6FiOG4WJvcjBVFB0qI4+eKoWFH483PKGuLuu6V8Z4T5g63UVA==}
1257 |     engines: {node: '>=6'}
1258 | 
1259 |   /estree-walker@2.0.2:
1260 |     resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==}
1261 | 
1262 |   /fast-glob@3.3.2:
1263 |     resolution: {integrity: sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==}
1264 |     engines: {node: '>=8.6.0'}
1265 |     dependencies:
1266 |       '@nodelib/fs.stat': 2.0.5
1267 |       '@nodelib/fs.walk': 1.2.8
1268 |       glob-parent: 5.1.2
1269 |       merge2: 1.4.1
1270 |       micromatch: 4.0.5
1271 |     dev: true
1272 | 
1273 |   /fastq@1.16.0:
1274 |     resolution: {integrity: sha512-ifCoaXsDrsdkWTtiNJX5uzHDsrck5TzfKKDcuFFTIrrc/BS076qgEIfoIy1VeZqViznfKiysPYTh/QeHtnIsYA==}
1275 |     dependencies:
1276 |       reusify: 1.0.4
1277 |     dev: true
1278 | 
1279 |   /fill-range@7.0.1:
1280 |     resolution: {integrity: sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==}
1281 |     engines: {node: '>=8'}
1282 |     dependencies:
1283 |       to-regex-range: 5.0.1
1284 |     dev: true
1285 | 
1286 |   /focus-trap@7.5.4:
1287 |     resolution: {integrity: sha512-N7kHdlgsO/v+iD/dMoJKtsSqs5Dz/dXZVebRgJw23LDk+jMi/974zyiOYDziY2JPp8xivq9BmUGwIJMiuSBi7w==}
1288 |     dependencies:
1289 |       tabbable: 6.2.0
1290 |     dev: true
1291 | 
1292 |   /foreground-child@3.1.1:
1293 |     resolution: {integrity: sha512-TMKDUnIte6bfb5nWv7V/caI169OHgvwjb7V4WkeUvbQQdjr5rWKqHFiKWb/fcOwB+CzBT+qbWjvj+DVwRskpIg==}
1294 |     engines: {node: '>=14'}
1295 |     dependencies:
1296 |       cross-spawn: 7.0.3
1297 |       signal-exit: 4.1.0
1298 |     dev: true
1299 | 
1300 |   /fraction.js@4.3.7:
1301 |     resolution: {integrity: sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==}
1302 |     dev: true
1303 | 
1304 |   /fsevents@2.3.3:
1305 |     resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
1306 |     engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
1307 |     os: [darwin]
1308 |     requiresBuild: true
1309 |     dev: true
1310 |     optional: true
1311 | 
1312 |   /function-bind@1.1.2:
1313 |     resolution: {integrity: sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==}
1314 |     dev: true
1315 | 
1316 |   /github-buttons@2.27.0:
1317 |     resolution: {integrity: sha512-PmfRMI2Rttg/2jDfKBeSl621sEznrsKF019SuoLdoNlO7qRUZaOyEI5Li4uW+79pVqnDtKfIEVuHTIJ5lgy64w==}
1318 |     dev: false
1319 | 
1320 |   /glob-parent@5.1.2:
1321 |     resolution: {integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==}
1322 |     engines: {node: '>= 6'}
1323 |     dependencies:
1324 |       is-glob: 4.0.3
1325 |     dev: true
1326 | 
1327 |   /glob-parent@6.0.2:
1328 |     resolution: {integrity: sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==}
1329 |     engines: {node: '>=10.13.0'}
1330 |     dependencies:
1331 |       is-glob: 4.0.3
1332 |     dev: true
1333 | 
1334 |   /glob@10.3.10:
1335 |     resolution: {integrity: sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==}
1336 |     engines: {node: '>=16 || 14 >=14.17'}
1337 |     hasBin: true
1338 |     dependencies:
1339 |       foreground-child: 3.1.1
1340 |       jackspeak: 2.3.6
1341 |       minimatch: 9.0.3
1342 |       minipass: 7.0.4
1343 |       path-scurry: 1.10.1
1344 |     dev: true
1345 | 
1346 |   /hasown@2.0.0:
1347 |     resolution: {integrity: sha512-vUptKVTpIJhcczKBbgnS+RtcuYMB8+oNzPK2/Hp3hanz8JmpATdmmgLgSaadVREkDm+e2giHwY3ZRkyjSIDDFA==}
1348 |     engines: {node: '>= 0.4'}
1349 |     dependencies:
1350 |       function-bind: 1.1.2
1351 |     dev: true
1352 | 
1353 |   /hookable@5.5.3:
1354 |     resolution: {integrity: sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ==}
1355 |     dev: true
1356 | 
1357 |   /htmlparser2@5.0.1:
1358 |     resolution: {integrity: sha512-vKZZra6CSe9qsJzh0BjBGXo8dvzNsq/oGvsjfRdOrrryfeD9UOBEEQdeoqCRmKZchF5h2zOBMQ6YuQ0uRUmdbQ==}
1359 |     dependencies:
1360 |       domelementtype: 2.3.0
1361 |       domhandler: 3.3.0
1362 |       domutils: 2.8.0
1363 |       entities: 2.2.0
1364 | 
1365 |   /htmlparser2@6.1.0:
1366 |     resolution: {integrity: sha512-gyyPk6rgonLFEDGoeRgQNaEUvdJ4ktTmmUh/h2t7s+M8oPpIPxgNACWa+6ESR57kXstwqPiCut0V8NRpcwgU7A==}
1367 |     dependencies:
1368 |       domelementtype: 2.3.0
1369 |       domhandler: 4.3.1
1370 |       domutils: 2.8.0
1371 |       entities: 2.2.0
1372 | 
1373 |   /immutable@4.3.4:
1374 |     resolution: {integrity: sha512-fsXeu4J4i6WNWSikpI88v/PcVflZz+6kMhUfIwc5SY+poQRPnaf5V7qds6SUyUN3cVxEzuCab7QIoLOQ+DQ1wA==}
1375 |     dev: true
1376 | 
1377 |   /is-binary-path@2.1.0:
1378 |     resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==}
1379 |     engines: {node: '>=8'}
1380 |     dependencies:
1381 |       binary-extensions: 2.2.0
1382 |     dev: true
1383 | 
1384 |   /is-core-module@2.13.1:
1385 |     resolution: {integrity: sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==}
1386 |     dependencies:
1387 |       hasown: 2.0.0
1388 |     dev: true
1389 | 
1390 |   /is-extglob@2.1.1:
1391 |     resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==}
1392 |     engines: {node: '>=0.10.0'}
1393 |     dev: true
1394 | 
1395 |   /is-fullwidth-code-point@3.0.0:
1396 |     resolution: {integrity: sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==}
1397 |     engines: {node: '>=8'}
1398 |     dev: true
1399 | 
1400 |   /is-glob@4.0.3:
1401 |     resolution: {integrity: sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==}
1402 |     engines: {node: '>=0.10.0'}
1403 |     dependencies:
1404 |       is-extglob: 2.1.1
1405 |     dev: true
1406 | 
1407 |   /is-number@7.0.0:
1408 |     resolution: {integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==}
1409 |     engines: {node: '>=0.12.0'}
1410 |     dev: true
1411 | 
1412 |   /isexe@2.0.0:
1413 |     resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==}
1414 |     dev: true
1415 | 
1416 |   /jackspeak@2.3.6:
1417 |     resolution: {integrity: sha512-N3yCS/NegsOBokc8GAdM8UcmfsKiSS8cipheD/nivzr700H+nsMOxJjQnvwOcRYVuFkdH0wGUvW2WbXGmrZGbQ==}
1418 |     engines: {node: '>=14'}
1419 |     dependencies:
1420 |       '@isaacs/cliui': 8.0.2
1421 |     optionalDependencies:
1422 |       '@pkgjs/parseargs': 0.11.0
1423 |     dev: true
1424 | 
1425 |   /jiti@1.21.0:
1426 |     resolution: {integrity: sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==}
1427 |     hasBin: true
1428 |     dev: true
1429 | 
1430 |   /juice@8.1.0:
1431 |     resolution: {integrity: sha512-FLzurJrx5Iv1e7CfBSZH68dC04EEvXvvVvPYB7Vx1WAuhCp1ZPIMtqxc+WTWxVkpTIC2Ach/GAv0rQbtGf6YMA==}
1432 |     engines: {node: '>=10.0.0'}
1433 |     hasBin: true
1434 |     dependencies:
1435 |       cheerio: 1.0.0-rc.10
1436 |       commander: 6.2.1
1437 |       mensch: 0.3.4
1438 |       slick: 1.12.2
1439 |       web-resource-inliner: 6.0.1
1440 |     transitivePeerDependencies:
1441 |       - encoding
1442 | 
1443 |   /lilconfig@2.1.0:
1444 |     resolution: {integrity: sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==}
1445 |     engines: {node: '>=10'}
1446 |     dev: true
1447 | 
1448 |   /lilconfig@3.0.0:
1449 |     resolution: {integrity: sha512-K2U4W2Ff5ibV7j7ydLr+zLAkIg5JJ4lPn1Ltsdt+Tz/IjQ8buJ55pZAxoP34lqIiwtF9iAvtLv3JGv7CAyAg+g==}
1450 |     engines: {node: '>=14'}
1451 |     dev: true
1452 | 
1453 |   /lines-and-columns@1.2.4:
1454 |     resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==}
1455 |     dev: true
1456 | 
1457 |   /lru-cache@10.1.0:
1458 |     resolution: {integrity: sha512-/1clY/ui8CzjKFyjdvwPWJUYKiFVXG2I2cY0ssG7h4+hwk+XOIX7ZSG9Q7TW8TW3Kp3BUSqgFWBLgL4PJ+Blag==}
1459 |     engines: {node: 14 || >=16.14}
1460 |     dev: true
1461 | 
1462 |   /magic-string@0.30.5:
1463 |     resolution: {integrity: sha512-7xlpfBaQaP/T6Vh8MO/EqXSW5En6INHEvEXQiuff7Gku0PWjU3uf6w/j9o7O+SpB5fOAkrI5HeoNgwjEO0pFsA==}
1464 |     engines: {node: '>=12'}
1465 |     dependencies:
1466 |       '@jridgewell/sourcemap-codec': 1.4.15
1467 |     dev: false
1468 | 
1469 |   /magic-string@0.30.7:
1470 |     resolution: {integrity: sha512-8vBuFF/I/+OSLRmdf2wwFCJCz+nSn0m6DPvGH1fS/KiQoSaR+sETbov0eIk9KhEKy8CYqIkIAnbohxT/4H0kuA==}
1471 |     engines: {node: '>=12'}
1472 |     dependencies:
1473 |       '@jridgewell/sourcemap-codec': 1.4.15
1474 |     dev: true
1475 | 
1476 |   /mark.js@8.11.1:
1477 |     resolution: {integrity: sha512-1I+1qpDt4idfgLQG+BNWmrqku+7/2bi5nLf4YwF8y8zXvmfiTBY3PV3ZibfrjBueCByROpuBjLLFCajqkgYoLQ==}
1478 |     dev: true
1479 | 
1480 |   /markdown-it-mathjax3@4.3.2:
1481 |     resolution: {integrity: sha512-TX3GW5NjmupgFtMJGRauioMbbkGsOXAAt1DZ/rzzYmTHqzkO1rNAdiMD4NiruurToPApn2kYy76x02QN26qr2w==}
1482 |     dependencies:
1483 |       juice: 8.1.0
1484 |       mathjax-full: 3.2.2
1485 |     transitivePeerDependencies:
1486 |       - encoding
1487 | 
1488 |   /mathjax-full@3.2.2:
1489 |     resolution: {integrity: sha512-+LfG9Fik+OuI8SLwsiR02IVdjcnRCy5MufYLi0C3TdMT56L/pjB0alMVGgoWJF8pN9Rc7FESycZB9BMNWIid5w==}
1490 |     dependencies:
1491 |       esm: 3.2.25
1492 |       mhchemparser: 4.2.1
1493 |       mj-context-menu: 0.6.1
1494 |       speech-rule-engine: 4.0.7
1495 | 
1496 |   /mensch@0.3.4:
1497 |     resolution: {integrity: sha512-IAeFvcOnV9V0Yk+bFhYR07O3yNina9ANIN5MoXBKYJ/RLYPurd2d0yw14MDhpr9/momp0WofT1bPUh3hkzdi/g==}
1498 | 
1499 |   /merge2@1.4.1:
1500 |     resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
1501 |     engines: {node: '>= 8'}
1502 |     dev: true
1503 | 
1504 |   /mhchemparser@4.2.1:
1505 |     resolution: {integrity: sha512-kYmyrCirqJf3zZ9t/0wGgRZ4/ZJw//VwaRVGA75C4nhE60vtnIzhl9J9ndkX/h6hxSN7pjg/cE0VxbnNM+bnDQ==}
1506 | 
1507 |   /micromatch@4.0.5:
1508 |     resolution: {integrity: sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==}
1509 |     engines: {node: '>=8.6'}
1510 |     dependencies:
1511 |       braces: 3.0.2
1512 |       picomatch: 2.3.1
1513 |     dev: true
1514 | 
1515 |   /mime@2.6.0:
1516 |     resolution: {integrity: sha512-USPkMeET31rOMiarsBNIHZKLGgvKc/LrjofAnBlOttf5ajRvqiRA8QsenbcooctK6d6Ts6aqZXBA+XbkKthiQg==}
1517 |     engines: {node: '>=4.0.0'}
1518 |     hasBin: true
1519 | 
1520 |   /minimatch@9.0.3:
1521 |     resolution: {integrity: sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==}
1522 |     engines: {node: '>=16 || 14 >=14.17'}
1523 |     dependencies:
1524 |       brace-expansion: 2.0.1
1525 |     dev: true
1526 | 
1527 |   /minipass@7.0.4:
1528 |     resolution: {integrity: sha512-jYofLM5Dam9279rdkWzqHozUo4ybjdZmCsDHePy5V/PbBcVMiSZR97gmAy45aqi8CK1lG2ECd356FU86avfwUQ==}
1529 |     engines: {node: '>=16 || 14 >=14.17'}
1530 |     dev: true
1531 | 
1532 |   /minisearch@6.3.0:
1533 |     resolution: {integrity: sha512-ihFnidEeU8iXzcVHy74dhkxh/dn8Dc08ERl0xwoMMGqp4+LvRSCgicb+zGqWthVokQKvCSxITlh3P08OzdTYCQ==}
1534 |     dev: true
1535 | 
1536 |   /mitt@3.0.1:
1537 |     resolution: {integrity: sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==}
1538 |     dev: true
1539 | 
1540 |   /mj-context-menu@0.6.1:
1541 |     resolution: {integrity: sha512-7NO5s6n10TIV96d4g2uDpG7ZDpIhMh0QNfGdJw/W47JswFcosz457wqz/b5sAKvl12sxINGFCn80NZHKwxQEXA==}
1542 | 
1543 |   /mz@2.7.0:
1544 |     resolution: {integrity: sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==}
1545 |     dependencies:
1546 |       any-promise: 1.3.0
1547 |       object-assign: 4.1.1
1548 |       thenify-all: 1.6.0
1549 |     dev: true
1550 | 
1551 |   /nanoid@3.3.7:
1552 |     resolution: {integrity: sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==}
1553 |     engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
1554 |     hasBin: true
1555 | 
1556 |   /node-fetch@2.7.0:
1557 |     resolution: {integrity: sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==}
1558 |     engines: {node: 4.x || >=6.0.0}
1559 |     peerDependencies:
1560 |       encoding: ^0.1.0
1561 |     peerDependenciesMeta:
1562 |       encoding:
1563 |         optional: true
1564 |     dependencies:
1565 |       whatwg-url: 5.0.0
1566 | 
1567 |   /node-releases@2.0.14:
1568 |     resolution: {integrity: sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==}
1569 |     dev: true
1570 | 
1571 |   /normalize-path@3.0.0:
1572 |     resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
1573 |     engines: {node: '>=0.10.0'}
1574 |     dev: true
1575 | 
1576 |   /normalize-range@0.1.2:
1577 |     resolution: {integrity: sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==}
1578 |     engines: {node: '>=0.10.0'}
1579 |     dev: true
1580 | 
1581 |   /nth-check@2.1.1:
1582 |     resolution: {integrity: sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==}
1583 |     dependencies:
1584 |       boolbase: 1.0.0
1585 | 
1586 |   /object-assign@4.1.1:
1587 |     resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==}
1588 |     engines: {node: '>=0.10.0'}
1589 |     dev: true
1590 | 
1591 |   /object-hash@3.0.0:
1592 |     resolution: {integrity: sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==}
1593 |     engines: {node: '>= 6'}
1594 |     dev: true
1595 | 
1596 |   /parse5-htmlparser2-tree-adapter@6.0.1:
1597 |     resolution: {integrity: sha512-qPuWvbLgvDGilKc5BoicRovlT4MtYT6JfJyBOMDsKoiT+GiuP5qyrPCnR9HcPECIJJmZh5jRndyNThnhhb/vlA==}
1598 |     dependencies:
1599 |       parse5: 6.0.1
1600 | 
1601 |   /parse5@6.0.1:
1602 |     resolution: {integrity: sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw==}
1603 | 
1604 |   /path-key@3.1.1:
1605 |     resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==}
1606 |     engines: {node: '>=8'}
1607 |     dev: true
1608 | 
1609 |   /path-parse@1.0.7:
1610 |     resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
1611 |     dev: true
1612 | 
1613 |   /path-scurry@1.10.1:
1614 |     resolution: {integrity: sha512-MkhCqzzBEpPvxxQ71Md0b1Kk51W01lrYvlMzSUaIzNsODdd7mqhiimSZlr+VegAz5Z6Vzt9Xg2ttE//XBhH3EQ==}
1615 |     engines: {node: '>=16 || 14 >=14.17'}
1616 |     dependencies:
1617 |       lru-cache: 10.1.0
1618 |       minipass: 7.0.4
1619 |     dev: true
1620 | 
1621 |   /perfect-debounce@1.0.0:
1622 |     resolution: {integrity: sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA==}
1623 |     dev: true
1624 | 
1625 |   /picocolors@1.0.0:
1626 |     resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==}
1627 | 
1628 |   /picomatch@2.3.1:
1629 |     resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
1630 |     engines: {node: '>=8.6'}
1631 |     dev: true
1632 | 
1633 |   /pify@2.3.0:
1634 |     resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
1635 |     engines: {node: '>=0.10.0'}
1636 |     dev: true
1637 | 
1638 |   /pirates@4.0.6:
1639 |     resolution: {integrity: sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==}
1640 |     engines: {node: '>= 6'}
1641 |     dev: true
1642 | 
1643 |   /postcss-import@15.1.0(postcss@8.4.33):
1644 |     resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==}
1645 |     engines: {node: '>=14.0.0'}
1646 |     peerDependencies:
1647 |       postcss: ^8.0.0
1648 |     dependencies:
1649 |       postcss: 8.4.33
1650 |       postcss-value-parser: 4.2.0
1651 |       read-cache: 1.0.0
1652 |       resolve: 1.22.8
1653 |     dev: true
1654 | 
1655 |   /postcss-js@4.0.1(postcss@8.4.33):
1656 |     resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==}
1657 |     engines: {node: ^12 || ^14 || >= 16}
1658 |     peerDependencies:
1659 |       postcss: ^8.4.21
1660 |     dependencies:
1661 |       camelcase-css: 2.0.1
1662 |       postcss: 8.4.33
1663 |     dev: true
1664 | 
1665 |   /postcss-load-config@4.0.2(postcss@8.4.33):
1666 |     resolution: {integrity: sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==}
1667 |     engines: {node: '>= 14'}
1668 |     peerDependencies:
1669 |       postcss: '>=8.0.9'
1670 |       ts-node: '>=9.0.0'
1671 |     peerDependenciesMeta:
1672 |       postcss:
1673 |         optional: true
1674 |       ts-node:
1675 |         optional: true
1676 |     dependencies:
1677 |       lilconfig: 3.0.0
1678 |       postcss: 8.4.33
1679 |       yaml: 2.3.4
1680 |     dev: true
1681 | 
1682 |   /postcss-nested@6.0.1(postcss@8.4.33):
1683 |     resolution: {integrity: sha512-mEp4xPMi5bSWiMbsgoPfcP74lsWLHkQbZc3sY+jWYd65CUwXrUaTp0fmNpa01ZcETKlIgUdFN/MpS2xZtqL9dQ==}
1684 |     engines: {node: '>=12.0'}
1685 |     peerDependencies:
1686 |       postcss: ^8.2.14
1687 |     dependencies:
1688 |       postcss: 8.4.33
1689 |       postcss-selector-parser: 6.0.15
1690 |     dev: true
1691 | 
1692 |   /postcss-selector-parser@6.0.15:
1693 |     resolution: {integrity: sha512-rEYkQOMUCEMhsKbK66tbEU9QVIxbhN18YiniAwA7XQYTVBqrBy+P2p5JcdqsHgKM2zWylp8d7J6eszocfds5Sw==}
1694 |     engines: {node: '>=4'}
1695 |     dependencies:
1696 |       cssesc: 3.0.0
1697 |       util-deprecate: 1.0.2
1698 |     dev: true
1699 | 
1700 |   /postcss-value-parser@4.2.0:
1701 |     resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==}
1702 |     dev: true
1703 | 
1704 |   /postcss@8.4.33:
1705 |     resolution: {integrity: sha512-Kkpbhhdjw2qQs2O2DGX+8m5OVqEcbB9HRBvuYM9pgrjEFUg30A9LmXNlTAUj4S9kgtGyrMbTzVjH7E+s5Re2yg==}
1706 |     engines: {node: ^10 || ^12 || >=14}
1707 |     dependencies:
1708 |       nanoid: 3.3.7
1709 |       picocolors: 1.0.0
1710 |       source-map-js: 1.0.2
1711 | 
1712 |   /postcss@8.4.35:
1713 |     resolution: {integrity: sha512-u5U8qYpBCpN13BsiEB0CbR1Hhh4Gc0zLFuedrHJKMctHCHAGrMdG0PRM/KErzAL3CU6/eckEtmHNB3x6e3c0vA==}
1714 |     engines: {node: ^10 || ^12 || >=14}
1715 |     dependencies:
1716 |       nanoid: 3.3.7
1717 |       picocolors: 1.0.0
1718 |       source-map-js: 1.0.2
1719 |     dev: true
1720 | 
1721 |   /preact@10.19.5:
1722 |     resolution: {integrity: sha512-OPELkDmSVbKjbFqF9tgvOowiiQ9TmsJljIzXRyNE8nGiis94pwv1siF78rQkAP1Q1738Ce6pellRg/Ns/CtHqQ==}
1723 |     dev: true
1724 | 
1725 |   /queue-microtask@1.2.3:
1726 |     resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
1727 |     dev: true
1728 | 
1729 |   /read-cache@1.0.0:
1730 |     resolution: {integrity: sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==}
1731 |     dependencies:
1732 |       pify: 2.3.0
1733 |     dev: true
1734 | 
1735 |   /readdirp@3.6.0:
1736 |     resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
1737 |     engines: {node: '>=8.10.0'}
1738 |     dependencies:
1739 |       picomatch: 2.3.1
1740 |     dev: true
1741 | 
1742 |   /resolve@1.22.8:
1743 |     resolution: {integrity: sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==}
1744 |     hasBin: true
1745 |     dependencies:
1746 |       is-core-module: 2.13.1
1747 |       path-parse: 1.0.7
1748 |       supports-preserve-symlinks-flag: 1.0.0
1749 |     dev: true
1750 | 
1751 |   /reusify@1.0.4:
1752 |     resolution: {integrity: sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==}
1753 |     engines: {iojs: '>=1.0.0', node: '>=0.10.0'}
1754 |     dev: true
1755 | 
1756 |   /rfdc@1.3.1:
1757 |     resolution: {integrity: sha512-r5a3l5HzYlIC68TpmYKlxWjmOP6wiPJ1vWv2HeLhNsRZMrCkxeqxiHlQ21oXmQ4F3SiryXBHhAD7JZqvOJjFmg==}
1758 |     dev: true
1759 | 
1760 |   /rollup@4.12.0:
1761 |     resolution: {integrity: sha512-wz66wn4t1OHIJw3+XU7mJJQV/2NAfw5OAk6G6Hoo3zcvz/XOfQ52Vgi+AN4Uxoxi0KBBwk2g8zPrTDA4btSB/Q==}
1762 |     engines: {node: '>=18.0.0', npm: '>=8.0.0'}
1763 |     hasBin: true
1764 |     dependencies:
1765 |       '@types/estree': 1.0.5
1766 |     optionalDependencies:
1767 |       '@rollup/rollup-android-arm-eabi': 4.12.0
1768 |       '@rollup/rollup-android-arm64': 4.12.0
1769 |       '@rollup/rollup-darwin-arm64': 4.12.0
1770 |       '@rollup/rollup-darwin-x64': 4.12.0
1771 |       '@rollup/rollup-linux-arm-gnueabihf': 4.12.0
1772 |       '@rollup/rollup-linux-arm64-gnu': 4.12.0
1773 |       '@rollup/rollup-linux-arm64-musl': 4.12.0
1774 |       '@rollup/rollup-linux-riscv64-gnu': 4.12.0
1775 |       '@rollup/rollup-linux-x64-gnu': 4.12.0
1776 |       '@rollup/rollup-linux-x64-musl': 4.12.0
1777 |       '@rollup/rollup-win32-arm64-msvc': 4.12.0
1778 |       '@rollup/rollup-win32-ia32-msvc': 4.12.0
1779 |       '@rollup/rollup-win32-x64-msvc': 4.12.0
1780 |       fsevents: 2.3.3
1781 |     dev: true
1782 | 
1783 |   /run-parallel@1.2.0:
1784 |     resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==}
1785 |     dependencies:
1786 |       queue-microtask: 1.2.3
1787 |     dev: true
1788 | 
1789 |   /sass@1.69.7:
1790 |     resolution: {integrity: sha512-rzj2soDeZ8wtE2egyLXgOOHQvaC2iosZrkF6v3EUG+tBwEvhqUCzm0VP3k9gHF9LXbSrRhT5SksoI56Iw8NPnQ==}
1791 |     engines: {node: '>=14.0.0'}
1792 |     hasBin: true
1793 |     dependencies:
1794 |       chokidar: 3.5.3
1795 |       immutable: 4.3.4
1796 |       source-map-js: 1.0.2
1797 |     dev: true
1798 | 
1799 |   /search-insights@2.13.0:
1800 |     resolution: {integrity: sha512-Orrsjf9trHHxFRuo9/rzm0KIWmgzE8RMlZMzuhZOJ01Rnz3D0YBAe+V6473t6/H6c7irs6Lt48brULAiRWb3Vw==}
1801 |     dev: true
1802 | 
1803 |   /shebang-command@2.0.0:
1804 |     resolution: {integrity: sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==}
1805 |     engines: {node: '>=8'}
1806 |     dependencies:
1807 |       shebang-regex: 3.0.0
1808 |     dev: true
1809 | 
1810 |   /shebang-regex@3.0.0:
1811 |     resolution: {integrity: sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==}
1812 |     engines: {node: '>=8'}
1813 |     dev: true
1814 | 
1815 |   /shiki@1.1.5:
1816 |     resolution: {integrity: sha512-754GuKIwkUdT810Xm8btuyNQPL+q3PqOkwGW/VlmAWyMYp+HbvvDt69sWXO1sm5aeczBJQjmQTTMR4GkKQNQPw==}
1817 |     dependencies:
1818 |       '@shikijs/core': 1.1.5
1819 |     dev: true
1820 | 
1821 |   /signal-exit@4.1.0:
1822 |     resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==}
1823 |     engines: {node: '>=14'}
1824 |     dev: true
1825 | 
1826 |   /slick@1.12.2:
1827 |     resolution: {integrity: sha512-4qdtOGcBjral6YIBCWJ0ljFSKNLz9KkhbWtuGvUyRowl1kxfuE1x/Z/aJcaiilpb3do9bl5K7/1h9XC5wWpY/A==}
1828 | 
1829 |   /source-map-js@1.0.2:
1830 |     resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==}
1831 |     engines: {node: '>=0.10.0'}
1832 | 
1833 |   /speakingurl@14.0.1:
1834 |     resolution: {integrity: sha512-1POYv7uv2gXoyGFpBCmpDVSNV74IfsWlDW216UPjbWufNf+bSU6GdbDsxdcxtfwb4xlI3yxzOTKClUosxARYrQ==}
1835 |     engines: {node: '>=0.10.0'}
1836 |     dev: true
1837 | 
1838 |   /speech-rule-engine@4.0.7:
1839 |     resolution: {integrity: sha512-sJrL3/wHzNwJRLBdf6CjJWIlxC04iYKkyXvYSVsWVOiC2DSkHmxsqOhEeMsBA9XK+CHuNcsdkbFDnoUfAsmp9g==}
1840 |     hasBin: true
1841 |     dependencies:
1842 |       commander: 9.2.0
1843 |       wicked-good-xpath: 1.3.0
1844 |       xmldom-sre: 0.1.31
1845 | 
1846 |   /string-width@4.2.3:
1847 |     resolution: {integrity: sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==}
1848 |     engines: {node: '>=8'}
1849 |     dependencies:
1850 |       emoji-regex: 8.0.0
1851 |       is-fullwidth-code-point: 3.0.0
1852 |       strip-ansi: 6.0.1
1853 |     dev: true
1854 | 
1855 |   /string-width@5.1.2:
1856 |     resolution: {integrity: sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==}
1857 |     engines: {node: '>=12'}
1858 |     dependencies:
1859 |       eastasianwidth: 0.2.0
1860 |       emoji-regex: 9.2.2
1861 |       strip-ansi: 7.1.0
1862 |     dev: true
1863 | 
1864 |   /strip-ansi@6.0.1:
1865 |     resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==}
1866 |     engines: {node: '>=8'}
1867 |     dependencies:
1868 |       ansi-regex: 5.0.1
1869 |     dev: true
1870 | 
1871 |   /strip-ansi@7.1.0:
1872 |     resolution: {integrity: sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==}
1873 |     engines: {node: '>=12'}
1874 |     dependencies:
1875 |       ansi-regex: 6.0.1
1876 |     dev: true
1877 | 
1878 |   /sucrase@3.35.0:
1879 |     resolution: {integrity: sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==}
1880 |     engines: {node: '>=16 || 14 >=14.17'}
1881 |     hasBin: true
1882 |     dependencies:
1883 |       '@jridgewell/gen-mapping': 0.3.3
1884 |       commander: 4.1.1
1885 |       glob: 10.3.10
1886 |       lines-and-columns: 1.2.4
1887 |       mz: 2.7.0
1888 |       pirates: 4.0.6
1889 |       ts-interface-checker: 0.1.13
1890 |     dev: true
1891 | 
1892 |   /supports-preserve-symlinks-flag@1.0.0:
1893 |     resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
1894 |     engines: {node: '>= 0.4'}
1895 |     dev: true
1896 | 
1897 |   /tabbable@6.2.0:
1898 |     resolution: {integrity: sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew==}
1899 |     dev: true
1900 | 
1901 |   /tailwindcss@3.4.1:
1902 |     resolution: {integrity: sha512-qAYmXRfk3ENzuPBakNK0SRrUDipP8NQnEY6772uDhflcQz5EhRdD7JNZxyrFHVQNCwULPBn6FNPp9brpO7ctcA==}
1903 |     engines: {node: '>=14.0.0'}
1904 |     hasBin: true
1905 |     dependencies:
1906 |       '@alloc/quick-lru': 5.2.0
1907 |       arg: 5.0.2
1908 |       chokidar: 3.5.3
1909 |       didyoumean: 1.2.2
1910 |       dlv: 1.1.3
1911 |       fast-glob: 3.3.2
1912 |       glob-parent: 6.0.2
1913 |       is-glob: 4.0.3
1914 |       jiti: 1.21.0
1915 |       lilconfig: 2.1.0
1916 |       micromatch: 4.0.5
1917 |       normalize-path: 3.0.0
1918 |       object-hash: 3.0.0
1919 |       picocolors: 1.0.0
1920 |       postcss: 8.4.33
1921 |       postcss-import: 15.1.0(postcss@8.4.33)
1922 |       postcss-js: 4.0.1(postcss@8.4.33)
1923 |       postcss-load-config: 4.0.2(postcss@8.4.33)
1924 |       postcss-nested: 6.0.1(postcss@8.4.33)
1925 |       postcss-selector-parser: 6.0.15
1926 |       resolve: 1.22.8
1927 |       sucrase: 3.35.0
1928 |     transitivePeerDependencies:
1929 |       - ts-node
1930 |     dev: true
1931 | 
1932 |   /thenify-all@1.6.0:
1933 |     resolution: {integrity: sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==}
1934 |     engines: {node: '>=0.8'}
1935 |     dependencies:
1936 |       thenify: 3.3.1
1937 |     dev: true
1938 | 
1939 |   /thenify@3.3.1:
1940 |     resolution: {integrity: sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==}
1941 |     dependencies:
1942 |       any-promise: 1.3.0
1943 |     dev: true
1944 | 
1945 |   /to-fast-properties@2.0.0:
1946 |     resolution: {integrity: sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==}
1947 |     engines: {node: '>=4'}
1948 | 
1949 |   /to-regex-range@5.0.1:
1950 |     resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==}
1951 |     engines: {node: '>=8.0'}
1952 |     dependencies:
1953 |       is-number: 7.0.0
1954 |     dev: true
1955 | 
1956 |   /tr46@0.0.3:
1957 |     resolution: {integrity: sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==}
1958 | 
1959 |   /ts-interface-checker@0.1.13:
1960 |     resolution: {integrity: sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==}
1961 |     dev: true
1962 | 
1963 |   /tslib@2.6.2:
1964 |     resolution: {integrity: sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==}
1965 | 
1966 |   /undici-types@5.26.5:
1967 |     resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
1968 |     dev: true
1969 | 
1970 |   /update-browserslist-db@1.0.13(browserslist@4.22.2):
1971 |     resolution: {integrity: sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==}
1972 |     hasBin: true
1973 |     peerDependencies:
1974 |       browserslist: '>= 4.21.0'
1975 |     dependencies:
1976 |       browserslist: 4.22.2
1977 |       escalade: 3.1.1
1978 |       picocolors: 1.0.0
1979 |     dev: true
1980 | 
1981 |   /util-deprecate@1.0.2:
1982 |     resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
1983 |     dev: true
1984 | 
1985 |   /valid-data-url@3.0.1:
1986 |     resolution: {integrity: sha512-jOWVmzVceKlVVdwjNSenT4PbGghU0SBIizAev8ofZVgivk/TVHXSbNL8LP6M3spZvkR9/QolkyJavGSX5Cs0UA==}
1987 |     engines: {node: '>=10'}
1988 | 
1989 |   /vite@5.1.3(@types/node@20.10.8)(sass@1.69.7):
1990 |     resolution: {integrity: sha512-UfmUD36DKkqhi/F75RrxvPpry+9+tTkrXfMNZD+SboZqBCMsxKtO52XeGzzuh7ioz+Eo/SYDBbdb0Z7vgcDJew==}
1991 |     engines: {node: ^18.0.0 || >=20.0.0}
1992 |     hasBin: true
1993 |     peerDependencies:
1994 |       '@types/node': ^18.0.0 || >=20.0.0
1995 |       less: '*'
1996 |       lightningcss: ^1.21.0
1997 |       sass: '*'
1998 |       stylus: '*'
1999 |       sugarss: '*'
2000 |       terser: ^5.4.0
2001 |     peerDependenciesMeta:
2002 |       '@types/node':
2003 |         optional: true
2004 |       less:
2005 |         optional: true
2006 |       lightningcss:
2007 |         optional: true
2008 |       sass:
2009 |         optional: true
2010 |       stylus:
2011 |         optional: true
2012 |       sugarss:
2013 |         optional: true
2014 |       terser:
2015 |         optional: true
2016 |     dependencies:
2017 |       '@types/node': 20.10.8
2018 |       esbuild: 0.19.12
2019 |       postcss: 8.4.35
2020 |       rollup: 4.12.0
2021 |       sass: 1.69.7
2022 |     optionalDependencies:
2023 |       fsevents: 2.3.3
2024 |     dev: true
2025 | 
2026 |   /vitepress@1.0.0-rc.44(@algolia/client-search@4.22.1)(@types/node@20.10.8)(markdown-it-mathjax3@4.3.2)(postcss@8.4.33)(sass@1.69.7)(search-insights@2.13.0):
2027 |     resolution: {integrity: sha512-tO5taxGI7fSpBK1D8zrZTyJJERlyU9nnt0jHSt3fywfq3VKn977Hg0wUuTkEmwXlFYwuW26+6+3xorf4nD3XvA==}
2028 |     hasBin: true
2029 |     peerDependencies:
2030 |       markdown-it-mathjax3: ^4.3.2
2031 |       postcss: ^8.4.35
2032 |     peerDependenciesMeta:
2033 |       markdown-it-mathjax3:
2034 |         optional: true
2035 |       postcss:
2036 |         optional: true
2037 |     dependencies:
2038 |       '@docsearch/css': 3.5.2
2039 |       '@docsearch/js': 3.5.2(@algolia/client-search@4.22.1)(search-insights@2.13.0)
2040 |       '@shikijs/core': 1.1.5
2041 |       '@shikijs/transformers': 1.1.5
2042 |       '@types/markdown-it': 13.0.7
2043 |       '@vitejs/plugin-vue': 5.0.4(vite@5.1.3)(vue@3.4.19)
2044 |       '@vue/devtools-api': 7.0.15(vue@3.4.19)
2045 |       '@vueuse/core': 10.7.2(vue@3.4.19)
2046 |       '@vueuse/integrations': 10.7.2(focus-trap@7.5.4)(vue@3.4.19)
2047 |       focus-trap: 7.5.4
2048 |       mark.js: 8.11.1
2049 |       markdown-it-mathjax3: 4.3.2
2050 |       minisearch: 6.3.0
2051 |       postcss: 8.4.33
2052 |       shiki: 1.1.5
2053 |       vite: 5.1.3(@types/node@20.10.8)(sass@1.69.7)
2054 |       vue: 3.4.19
2055 |     transitivePeerDependencies:
2056 |       - '@algolia/client-search'
2057 |       - '@types/node'
2058 |       - '@types/react'
2059 |       - '@vue/composition-api'
2060 |       - async-validator
2061 |       - axios
2062 |       - change-case
2063 |       - drauu
2064 |       - fuse.js
2065 |       - idb-keyval
2066 |       - jwt-decode
2067 |       - less
2068 |       - lightningcss
2069 |       - nprogress
2070 |       - qrcode
2071 |       - react
2072 |       - react-dom
2073 |       - sass
2074 |       - search-insights
2075 |       - sortablejs
2076 |       - stylus
2077 |       - sugarss
2078 |       - terser
2079 |       - typescript
2080 |       - universal-cookie
2081 |     dev: true
2082 | 
2083 |   /vue-demi@0.14.7(vue@3.4.19):
2084 |     resolution: {integrity: sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==}
2085 |     engines: {node: '>=12'}
2086 |     hasBin: true
2087 |     requiresBuild: true
2088 |     peerDependencies:
2089 |       '@vue/composition-api': ^1.0.0-rc.1
2090 |       vue: ^3.0.0-0 || ^2.6.0
2091 |     peerDependenciesMeta:
2092 |       '@vue/composition-api':
2093 |         optional: true
2094 |     dependencies:
2095 |       vue: 3.4.19
2096 |     dev: true
2097 | 
2098 |   /vue-github-button@3.1.0:
2099 |     resolution: {integrity: sha512-S69NFalucetUW4AjMkLlHY/fgTWu6LEGEtehMewXRNLnjODhDvJj4lwt0u0BSPXLTDB+PLk1tWlwx3pw+ItLgQ==}
2100 |     dependencies:
2101 |       github-buttons: 2.27.0
2102 |     dev: false
2103 | 
2104 |   /vue@3.4.15:
2105 |     resolution: {integrity: sha512-jC0GH4KkWLWJOEQjOpkqU1bQsBwf4R1rsFtw5GQJbjHVKWDzO6P0nWWBTmjp1xSemAioDFj1jdaK1qa3DnMQoQ==}
2106 |     peerDependencies:
2107 |       typescript: '*'
2108 |     peerDependenciesMeta:
2109 |       typescript:
2110 |         optional: true
2111 |     dependencies:
2112 |       '@vue/compiler-dom': 3.4.15
2113 |       '@vue/compiler-sfc': 3.4.15
2114 |       '@vue/runtime-dom': 3.4.15
2115 |       '@vue/server-renderer': 3.4.15(vue@3.4.15)
2116 |       '@vue/shared': 3.4.15
2117 |     dev: false
2118 | 
2119 |   /vue@3.4.19:
2120 |     resolution: {integrity: sha512-W/7Fc9KUkajFU8dBeDluM4sRGc/aa4YJnOYck8dkjgZoXtVsn3OeTGni66FV1l3+nvPA7VBFYtPioaGKUmEADw==}
2121 |     peerDependencies:
2122 |       typescript: '*'
2123 |     peerDependenciesMeta:
2124 |       typescript:
2125 |         optional: true
2126 |     dependencies:
2127 |       '@vue/compiler-dom': 3.4.19
2128 |       '@vue/compiler-sfc': 3.4.19
2129 |       '@vue/runtime-dom': 3.4.19
2130 |       '@vue/server-renderer': 3.4.19(vue@3.4.19)
2131 |       '@vue/shared': 3.4.19
2132 |     dev: true
2133 | 
2134 |   /web-resource-inliner@6.0.1:
2135 |     resolution: {integrity: sha512-kfqDxt5dTB1JhqsCUQVFDj0rmY+4HLwGQIsLPbyrsN9y9WV/1oFDSx3BQ4GfCv9X+jVeQ7rouTqwK53rA/7t8A==}
2136 |     engines: {node: '>=10.0.0'}
2137 |     dependencies:
2138 |       ansi-colors: 4.1.3
2139 |       escape-goat: 3.0.0
2140 |       htmlparser2: 5.0.1
2141 |       mime: 2.6.0
2142 |       node-fetch: 2.7.0
2143 |       valid-data-url: 3.0.1
2144 |     transitivePeerDependencies:
2145 |       - encoding
2146 | 
2147 |   /webidl-conversions@3.0.1:
2148 |     resolution: {integrity: sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==}
2149 | 
2150 |   /whatwg-url@5.0.0:
2151 |     resolution: {integrity: sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==}
2152 |     dependencies:
2153 |       tr46: 0.0.3
2154 |       webidl-conversions: 3.0.1
2155 | 
2156 |   /which@2.0.2:
2157 |     resolution: {integrity: sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==}
2158 |     engines: {node: '>= 8'}
2159 |     hasBin: true
2160 |     dependencies:
2161 |       isexe: 2.0.0
2162 |     dev: true
2163 | 
2164 |   /wicked-good-xpath@1.3.0:
2165 |     resolution: {integrity: sha512-Gd9+TUn5nXdwj/hFsPVx5cuHHiF5Bwuc30jZ4+ronF1qHK5O7HD0sgmXWSEgwKquT3ClLoKPVbO6qGwVwLzvAw==}
2166 | 
2167 |   /wrap-ansi@7.0.0:
2168 |     resolution: {integrity: sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==}
2169 |     engines: {node: '>=10'}
2170 |     dependencies:
2171 |       ansi-styles: 4.3.0
2172 |       string-width: 4.2.3
2173 |       strip-ansi: 6.0.1
2174 |     dev: true
2175 | 
2176 |   /wrap-ansi@8.1.0:
2177 |     resolution: {integrity: sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==}
2178 |     engines: {node: '>=12'}
2179 |     dependencies:
2180 |       ansi-styles: 6.2.1
2181 |       string-width: 5.1.2
2182 |       strip-ansi: 7.1.0
2183 |     dev: true
2184 | 
2185 |   /xmldom-sre@0.1.31:
2186 |     resolution: {integrity: sha512-f9s+fUkX04BxQf+7mMWAp5zk61pciie+fFLC9hX9UVvCeJQfNHRHXpeo5MPcR0EUf57PYLdt+ZO4f3Ipk2oZUw==}
2187 |     engines: {node: '>=0.1'}
2188 | 
2189 |   /yaml@2.3.4:
2190 |     resolution: {integrity: sha512-8aAvwVUSHpfEqTQ4w/KMlf3HcRdt50E5ODIQJBw1fQ5RL34xabzxtUlzTXVqc4rkZsPbvrXKWnABCD7kWSmocA==}
2191 |     engines: {node: '>= 14'}
2192 |     dev: true
2193 | 


--------------------------------------------------------------------------------
/postcss.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 |   plugins: {
3 |     tailwindcss: {},
4 |     autoprefixer: {},
5 |   },
6 | }
7 | 


--------------------------------------------------------------------------------
/readme.md:
--------------------------------------------------------------------------------
 1 | # Vue CheatSheet By ThemeSelection! 🚀
 2 | 
 3 | [![Vue CheatSheet](https://ts-assets.b-cdn.net/ts-assets/vue-cheatsheet/marketing/github-banner.png)](https://vue-cheatsheet.themeselection.com)
 4 | 
 5 | ## What is Vue CheatSheet?
 6 | 
 7 | It is an interactive cheatsheet of **Vue**, **Vue Router**, and **Pinia**. 🎊 The only **[Vue CheatSheet](https://vue-cheatsheet.themeselection.com/)** you will ever need whether you are using Vue, Vue Router & Pinia in your Vue project or starting a new Vue project.
 8 | 
 9 | [Vue JS CheatSheet](https://vue-cheatsheet.themeselection.com) is aimed at a large community of Vue users who find it difficult to search for Vue, Vue Router, and Pinia.
10 | 
11 | ## Key Features 🛠
12 | 
13 | - Comprehensive Coverage of Vue, Vue router, Pinia
14 | - Interactive search
15 | - Concise code snippet
16 | - Easily copy code snippet and use it
17 | - Open source
18 | 
19 | ## Contents 🤩
20 | 
21 | | Vue CheatSheet | URL |
22 | |--|--|
23 | | Vue | <https://vue-cheatsheet.themeselection.com/vue/basic.html> |
24 | | Vue Router | <https://vue-cheatsheet.themeselection.com/vue-router/basic.html> |
25 | | Pinia | <https://vue-cheatsheet.themeselection.com/pinia/basic.html> |
26 | 
27 | ## Contributing 📝
28 | 
29 | If you find something which doesn't make sense, or something doesn't seem right, please make a pull request and please add valid and well-reasoned explanations about your changes or comments.
30 | 
31 | Before adding a pull request, please see the **[contributing guidelines](https://vue-cheatsheet.themeselection.com/contributing.html)**. You should also remember about this:
32 | 
33 | All **suggestions/PR** are welcome!
34 | 
35 | ## Credits 🤘
36 | 
37 | | Name | URL |
38 | |--|--|
39 | | Vue | <https://vuejs.org> |
40 | | Vue Router | <https://router.vuejs.org> |
41 | | Pinia | <https://pinia.vuejs.org> |
42 | | Vitepre | <https://vitepress.dev> |
43 | | Python Cheatsheet | <https://www.pythoncheatsheet.org> |
44 | 
45 | ## Copyright and license ©
46 | 
47 | [Vue 3 CheatSheet](https://vue-cheatsheet.themeselection.com) is an open source project by [ThemeSelection](https://themeselection.com) that is licensed under [MIT](http://opensource.org/licenses/MIT). ThemeSelection reserves the right to change the license of future releases.
48 | 
49 | ## Note 📒
50 | 
51 | **We request you keep the ThemeSelection credit link if you share this tool or add it to a blog post.**
52 | 
53 | ## Looking For Premium Admin Templates ??
54 | 
55 | **[ThemeSelection](https://themeselection.com/)** provides Selected high quality, modern design, professional and easy-to-use Free and Premium [Bootstrap Admin Templates](https://themeselection.com/item/category/bootstrap-admin-template/), [VueJS Admin Templates](https://themeselection.com/item/category/vuejs-admin-templates/), [Nuxt Admin Dashboard](https://themeselection.com/item/category/nuxt-admin-template/), [Laravel Admin Templates](https://themeselection.com/item/category/laravel-admin-templates/) HTML Themes and [Free UI Kits](https://themeselection.com/item/category/free-ui-kits/) to create your applications faster!.
56 | 
57 | If you want to [Download Free Admin Templates](https://themeselection.com/item/category/free-admin-templates/m) then do visit [ThemeSelection](https://themeselection.com/).
58 | 
59 | ## Useful Links 🔗
60 | 
61 | - [More products](https://themeselection.com/products/) from ThemeSelection
62 | - [Freebies](https://themeselection.com/products/category/freebies/) from ThemeSelection
63 | - [Blog](https://themeselection.com/blog/)
64 | 
65 | ## Social Media 😇
66 | 
67 | - Twitter : [https://twitter.com/Theme_Selection](https://twitter.com/Theme_Selection)
68 | - Facebook : [https://www.facebook.com/ThemeSelections](https://www.facebook.com/ThemeSelections/)
69 | - Pintrest : [https://www.pinterest.com/themeselection/](https://www.pinterest.com/themeselection/)
70 | - Instagram : [https://www.instagram.com/themeselection/](https://www.instagram.com/themeselection/)
71 | 


--------------------------------------------------------------------------------
/shims.d.ts:
--------------------------------------------------------------------------------
1 | declare module '*.vue' {
2 |   import type { DefineComponent } from 'vue'
3 |   const component: DefineComponent<{}, {}, any>
4 |   export default component
5 | }
6 | 


--------------------------------------------------------------------------------
/tailwind.config.js:
--------------------------------------------------------------------------------
 1 | /** @type {import('tailwindcss').Config} */
 2 | module.exports = {
 3 |   darkMode: 'class',
 4 |   content: [
 5 |     "./content/**/*.{vue,js,ts,jsx,tsx}",
 6 |     "./content/.vitepress/**/*.{vue,js,ts,jsx,tsx}",
 7 |   ],
 8 |   theme: {
 9 |     extend: {},
10 |     container: {
11 |       screens: {
12 |         'xl': '1280px',
13 |         '2xl': '1280px',
14 |         'lg': '960px'
15 |       }
16 |     },
17 |   },
18 |   plugins: [],
19 | }
20 | 
21 | 


--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "compilerOptions": {
 3 |         "target": "esnext",
 4 |         "module": "esnext",
 5 |         "moduleResolution": "node",
 6 |         "esModuleInterop": true,
 7 |         "strict": true,
 8 |         "strictNullChecks": true,
 9 |         "forceConsistentCasingInFileNames": true,
10 |         "resolveJsonModule": true,
11 |         "skipDefaultLibCheck": true,
12 |         "skipLibCheck": true,
13 |         "noUncheckedIndexedAccess": true,
14 |         "jsx": "preserve",
15 |         "types": [
16 |             "node"
17 |         ],
18 |         "lib": [
19 |             "esnext",
20 |             "dom",
21 |             "dom.iterable",
22 |             "scripthost"
23 |         ]
24 |     },
25 |     "include": [
26 |         "./content/**/*",
27 |         "./content/.vitepress/**/*",
28 |         "./shims.d.ts"
29 |     ]
30 | }


--------------------------------------------------------------------------------