From 152e0f6daf66b81d24969bbeae3655f23e93bcc6 Mon Sep 17 00:00:00 2001 From: Mathieu TUDISCO Date: Mon, 15 Nov 2021 07:04:28 +0100 Subject: [PATCH 001/211] docs: typo in sidebar (#43) --- .vitepress/config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.vitepress/config.js b/.vitepress/config.js index ed7fd49..8599e5b 100644 --- a/.vitepress/config.js +++ b/.vitepress/config.js @@ -42,7 +42,7 @@ const Guide = [ link: '/guide/presenter-mode', }, { - text: 'Drawing & Annonations', + text: 'Drawing & Annotations', link: '/guide/drawing', }, { From ad008f0449f00d699e7a8cfd06cd5119cc57fd9f Mon Sep 17 00:00:00 2001 From: Eduardo San Martin Morote Date: Wed, 17 Nov 2021 18:56:32 +0100 Subject: [PATCH 002/211] docs: typos in code (#45) --- custom/highlighters.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/custom/highlighters.md b/custom/highlighters.md index dbee808..994026b 100644 --- a/custom/highlighters.md +++ b/custom/highlighters.md @@ -60,8 +60,8 @@ import { defineShikiSetup } from '@slidev/types' export default defineShikiSetup(async({ loadTheme }) => { return { theme: { - dark: await loadTheme('path/to/theme.json')), - light: await loadTheme('path/to/theme.json')), + dark: await loadTheme('path/to/theme.json'), + light: await loadTheme('path/to/theme.json'), }, } }) From 5d92892e4c0e345ea45cde50316330f4c97117de Mon Sep 17 00:00:00 2001 From: Eduardo San Martin Morote Date: Wed, 17 Nov 2021 18:56:43 +0100 Subject: [PATCH 003/211] docs: typo (#44) --- guide/install.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/guide/install.md b/guide/install.md index 58e2048..29988f0 100644 --- a/guide/install.md +++ b/guide/install.md @@ -39,7 +39,7 @@ $ npx slidev > Please note if you are using [pnpm](https://pnpm.io), you will need to enable [shamefully-hoist](https://pnpm.io/npmrc#shamefully-hoist) option for Slidev to work properly: > > ```bash -> echo 'shamefully-flatten=true' >> .npmrc +> echo 'shamefully-hoist=true' >> .npmrc > ``` ## Install Globally From c393c03ca6c46af4a218f37db04bc399bde16088 Mon Sep 17 00:00:00 2001 From: Christian S Date: Sat, 4 Dec 2021 00:56:52 +0100 Subject: [PATCH 004/211] chore: typo (#46) --- builtin/layouts.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/builtin/layouts.md b/builtin/layouts.md index a8970d9..1b655a6 100644 --- a/builtin/layouts.md +++ b/builtin/layouts.md @@ -15,7 +15,7 @@ Used to display the cover page for the presentation, may contain the presentatio ### `default` -The most baisc layout, to display any kind of content. +The most basic layout, to display any kind of content. ### `end` From fbc97d802e30cc663321c93b32fff3cee9ca7ff9 Mon Sep 17 00:00:00 2001 From: Arnaud Thomas D Date: Thu, 9 Dec 2021 00:49:21 +0100 Subject: [PATCH 005/211] docs: fix typo (#47) --- custom/fonts.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/custom/fonts.md b/custom/fonts.md index 02b4a4d..6be9f4f 100644 --- a/custom/fonts.md +++ b/custom/fonts.md @@ -100,7 +100,7 @@ Currently, only Google Fonts is supported, we are planned to add more providers ```yaml --- fonts: - provide: 'none' + provider: 'none' --- ``` From a261c239adbbea08fafc043330460e1e7bb16e54 Mon Sep 17 00:00:00 2001 From: tkgroot Date: Mon, 20 Dec 2021 18:43:30 +0100 Subject: [PATCH 006/211] chore: typo (#48) --- builtin/layouts.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/builtin/layouts.md b/builtin/layouts.md index 1b655a6..d50357e 100644 --- a/builtin/layouts.md +++ b/builtin/layouts.md @@ -7,7 +7,7 @@ ### `center` -Displays the content in the middle of the sreen. +Displays the content in the middle of the screen. ### `cover` From 06ae2757fe5d59fbc9f2acd5867bba7521f3d679 Mon Sep 17 00:00:00 2001 From: Tony Cabaye Date: Mon, 17 Jan 2022 16:56:33 +0100 Subject: [PATCH 007/211] feat: add TOC documentation (#49) --- builtin/components.md | 36 ++++++++++++++++++++++++++++++++++++ 1 file changed, 36 insertions(+) diff --git a/builtin/components.md b/builtin/components.md index 822a9e6..b957d8e 100644 --- a/builtin/components.md +++ b/builtin/components.md @@ -4,6 +4,42 @@ > The documentations of this section is still working in progress. Before that, you can take a look at the [source code](https://github.com/slidevjs/slidev/blob/main/packages/client/builtin) directly. +### `TOC` + +Insert a Table Of Content. + +Titles and title levels get automatically retrieved from the first title element of each slides. + +You can override this automatic behaviour for a slide by using the front matter syntax: +```yml +--- +title: Amazing slide title +level: 2 +--- +``` + +Or if you prefer the slide to not appear in the TOC at all, you can use: +```yml +--- +hideInToc: true +--- +``` + +#### Usage +~~~md + +~~~ + +Parameters: + +* `columns` (`string | number`, default: `1`): The number of columns of the display +* `maxDepth` (`string | number`, default: `Infinity`): The maximum depth level of title to display +* `minDepth` (`string | number`, default: `1`): The minimum depth level of title to display +* `mode` (`'all' | 'onlyCurrentTree'| 'onlySiblings'`, default: `'all'`): + * `'all'`: Display all items + * `'onlyCurrentTree'`: Display only items that are in current tree (active item, parents and children of active item) + * `'onlySiblings'`: Display only items that are in current tree and their direct siblings + ## Custom Components Create a directory `components/` under your project root, and simply put your custom Vue components under it, then you can use it with the same name in your markdown file! From ce73d5801d6634c1734058202032c57f3360bfe3 Mon Sep 17 00:00:00 2001 From: chengpeiquan Date: Tue, 18 Jan 2022 13:14:14 +0800 Subject: [PATCH 008/211] fix: broken links (#50) --- themes/write-a-theme.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/themes/write-a-theme.md b/themes/write-a-theme.md index f802bdf..45658dc 100644 --- a/themes/write-a-theme.md +++ b/themes/write-a-theme.md @@ -120,7 +120,7 @@ Slidev toggles a `dark` class on the page's `html` element for switching color s Syntax highlighting colors are also provided in the theme. We support both [Prism](https://prismjs.com/) and [Shiki](https://github.com/shikijs/shiki). For more information please refer to [the syntax highlighting docs](/custom/highlighters). -You can support either one of them, or both. Refer to the default theme for configurations examples [`./styles/prism.css`](https://github.com/slidevjs/slidev/blob/main/packages/theme-default/styles/prism.css) / [`./setup/shiki.ts`](https://github.com/slidevjs/slidev/blob/main/packages/theme-default/setup/shiki.ts). +You can support either one of them, or both. Refer to the default theme for configurations examples [`./styles/code.css`](https://github.com/slidevjs/slidev/blob/main/packages/create-theme/template/styles/code.css) / [`./setup/shiki.ts`](https://github.com/slidevjs/slidev/blob/main/packages/create-theme/template/setup/shiki.ts). Also, remember to specify the supported highlighters in your `package.json` From 4890d427ba544b99fd2fae4ba003b50a13fae3a5 Mon Sep 17 00:00:00 2001 From: Plat <60182057+p1atdev@users.noreply.github.com> Date: Sun, 6 Feb 2022 21:56:38 +0900 Subject: [PATCH 009/211] Minor notation change (#51) --- resources/learning.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/resources/learning.md b/resources/learning.md index 14da52c..cfa4cab 100644 --- a/resources/learning.md +++ b/resources/learning.md @@ -16,7 +16,7 @@ - [神器！这款开源项目可以让你使用 Markdown 来做 PPT！](https://zhuanlan.zhihu.com/p/377567327) by [Github掘金计划](https://www.zhihu.com/people/github-stars) - [【用 markdown 写 Slide!】神器 Slidev 的安装及 bug 解决](https://blog.csdn.net/weixin_43828250/article/details/116664775) by HaloHoohoo -## 日本语 +## 日本語 - [開発者のためのスライド作成ツール Slidev がすごい](https://zenn.dev/ryo_kawamata/articles/introduce-slidev) by [ryo_kawamata](https://zenn.dev/ryo_kawamata) - [Markdownでオシャレなスライドを作るSli.dev](https://qiita.com/e99h2121/items/a115f8865a0dc21bb462) by [Nobuko YAMADA](https://qiita.com/e99h2121) From d99ebc341368cc7f6df4ae4cbd893a171a853aa6 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Mon, 7 Feb 2022 09:55:59 +0800 Subject: [PATCH 010/211] feat: add ja trans --- .vitepress/config.js | 4 ++++ README.md | 1 + 2 files changed, 5 insertions(+) diff --git a/.vitepress/config.js b/.vitepress/config.js index 8599e5b..915337d 100644 --- a/.vitepress/config.js +++ b/.vitepress/config.js @@ -106,6 +106,10 @@ const Translations = [ text: 'Ελληνικά', link: 'https://el.sli.dev{{pathname}}', }, + { + text: '日本語', + link: 'https://ja.sli.dev{{pathname}}', + }, ] const Customizations = [ diff --git a/README.md b/README.md index d3f0f88..cc88fa2 100644 --- a/README.md +++ b/README.md @@ -15,6 +15,7 @@ Documentation for [Slidev](https://github.com/slidevjs/slidev) | Deutsch | [docs-de](https://github.com/slidevjs/docs-de) | [de.sli.dev](https://de.sli.dev) | [@fabiankachlock](https://github.com/fabiankachlock) | | Português (BR) | [docs-br](https://github.com/slidevjs/docs-br) | [br.sli.dev](https://br.sli.dev) | [@luisfelipesdn12](https://github.com/luisfelipesdn12) | | Ελληνικά | [docs-el](https://github.com/slidevjs/docs-el) | [el.sli.dev](https://el.sli.dev) | [@GeopJr](https://github.com/GeopJr) | +| 日本語 | [docs-ja](https://github.com/slidevjs/docs-el) | [ja.sli.dev](https://ja.sli.dev) | [@IkumaTadokoro](https://github.com/IkumaTadokoro) | ## Start Server Locally From e89a81b443cfb679cd8c86c03daff8f512d98f1d Mon Sep 17 00:00:00 2001 From: Alexander Eble <35292572+alexanderdavide@users.noreply.github.com> Date: Mon, 14 Feb 2022 08:15:17 +0100 Subject: [PATCH 011/211] docs: add favicon frontmatter configure (#53) Co-authored-by: Alexander Eble --- custom/index.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/custom/index.md b/custom/index.md index cae9780..33b9bab 100644 --- a/custom/index.md +++ b/custom/index.md @@ -33,6 +33,8 @@ aspectRatio: '16/9' # real width of the canvas, unit in px canvasWidth: 980 +# favicon, can be a local file path or URL +favicon: 'https://cdn.jsdelivr.net/gh/slidevjs/slidev/assets/favicon.png' # fonts will be auto imported from Google fonts # Learn more: https://sli.dev/custom/fonts fonts: From 871a293da7f02bedf8804133bf6a4af060611eb0 Mon Sep 17 00:00:00 2001 From: Augustine Date: Wed, 16 Feb 2022 22:06:17 +0800 Subject: [PATCH 012/211] docs: update shiki URL (#54) --- guide/syntax.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/guide/syntax.md b/guide/syntax.md index a885c67..e82c3ea 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -72,7 +72,7 @@ console.log('Hello, World!') //``` ~~~ -We support [Prism](http://prismjs.com) and [Shiki](https://github.com/shiki/shiki) as syntax highlighters. Refer to [the highlighters section](/custom/highlighters) for more details. +We support [Prism](http://prismjs.com) and [Shiki](https://github.com/shikijs/shiki) as syntax highlighters. Refer to [the highlighters section](/custom/highlighters) for more details. ### Line Highlighting From 5b4af788678dc110e79241e2109414652f9b71dc Mon Sep 17 00:00:00 2001 From: Alexander Eble <35292572+alexanderdavide@users.noreply.github.com> Date: Mon, 7 Mar 2022 23:20:37 +0100 Subject: [PATCH 013/211] Add slidev-theme-academic (#55) --- .vitepress/themes.ts | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) diff --git a/.vitepress/themes.ts b/.vitepress/themes.ts index 9c285e0..1090423 100644 --- a/.vitepress/themes.ts +++ b/.vitepress/themes.ts @@ -315,6 +315,29 @@ export const community: ThemeInfo[] = [ 'light', ], }, + { + id: 'slidev-theme-academic', + name: 'Academic', + description: 'Academic presentations with Slidev made simple', + author: { + name: 'Alexander Eble', + link: 'https://github.com/alexanderdavide', + }, + repo: 'https://github.com/alexanderdavide/slidev-theme-academic', + previews: [ + 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/01.png', + 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/02.png', + 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/03.png', + 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/04.png', + 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/05.png', + 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/06.png', + 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/07.png', + ], + tags: [ + 'dark', + 'light', + ], + }, // Add yours here! { id: '', From 61b06f20d904b70a8b14d4b69879ed25d0f08510 Mon Sep 17 00:00:00 2001 From: Alexander Eble <35292572+alexanderdavide@users.noreply.github.com> Date: Mon, 7 Mar 2022 23:21:36 +0100 Subject: [PATCH 014/211] Add showcase Git's Most Wanted (#56) --- .vitepress/showcases.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/.vitepress/showcases.ts b/.vitepress/showcases.ts index dd7136b..e8e1242 100644 --- a/.vitepress/showcases.ts +++ b/.vitepress/showcases.ts @@ -108,6 +108,18 @@ export const showcases: ShowCaseInfo[] = [ at: 'Thoughtworks Internal Lunch & Learn', datetime: '2021-11-12', }, + { + title: 'Git\'s Most Wanted', + cover: 'https://cdn.jsdelivr.net/gh/alexanderdavide/git-most-wanted@assets/slides-export/01.png', + author: { + name: 'Alexander Eble', + link: 'https://github.com/alexanderdavide', + }, + slidesLink: 'https://git-most-wanted.alex-eble.de', + sourceLink: 'https://github.com/alexanderdavide/git-most-wanted', + at: 'Internal Tech Talk', + datetime: '2022-03-11', + }, // Add yours here! { title: 'Yours?', From e9cccdbd077d1ac7b5667b48fab66e5c0f9b5d37 Mon Sep 17 00:00:00 2001 From: tangramor Date: Wed, 16 Mar 2022 15:13:52 +0800 Subject: [PATCH 015/211] feat: update install.md to fix the missed docker part (#57) --- guide/install.md | 65 ++++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 63 insertions(+), 2 deletions(-) diff --git a/guide/install.md b/guide/install.md index 29988f0..2dc43fd 100644 --- a/guide/install.md +++ b/guide/install.md @@ -62,6 +62,67 @@ This command will also try to use local `@slidev/cli` if it has been found in th ## Install on Docker -If you need a rapid way to run a presentation with containers, you can use the prebuilt [docker](https://hub.docker.com/r/stig124/slidev) image maintained by [stig124](https://github.com/Stig124), or build your own. +If you need a rapid way to run a presentation with containers, you can use the prebuilt [docker](https://hub.docker.com/r/tangramor/slidev) image maintained by [tangramor](https://github.com/tangramor), or build your own. -Refer to the [slidevjs/container repo](https://github.com/slidevjs/container) for more details. +Just run following command in your work folder: + +```bash +docker run --name slidev --rm -it \ + --user node \ + -v ${PWD}:/slidev \ + -p 3030:3030 \ + tangramor/slidev:latest +``` + +If your work folder is empty, it will generate a template `slides.md` and other related files under your work folder, and launch the server on port `3030`. + +You can access your slides from http://localhost:3030/ + + +### Build deployable image + +Or you can create your own slidev project to a docker image with Dockerfile: + +```Dockerfile +FROM tangramor/slidev:latest + +ADD . /slidev + +``` + +Create the docker image: `docker build -t myppt .` + +And run the container: `docker run --name myslides --rm --user node -p 3030:3030 myppt` + +You can visit your slides from http://localhost:3030/ + + +### Build hostable SPA (Single Page Application) + +Run command `docker exec -i slidev npx slidev build` on the running container `slidev`. It will generate static HTML files under `dist` folder. + +You can host `dist` in a static web site such as [Github pages](https://tangramor.github.io/slidev_docker/) or Gitlab pages. Because in Github pages the url may contain subfolder, so you need to modify the generated `index.html` to change `href="/assets/xxx` to `href="./assets/xxx`. And to avoid Jekyll build process, you need to add an empty file `.nojekyll`. + +You can also host it by yourself: + +```bash +docker run --name myslides --rm -p 80:80 -v ${PWD}/dist:/usr/share/nginx/html nginx:alpine +``` + +Or create a static image with following Dockerfile: + +```Dockerfile +FROM nginx:alpine + +COPY dist /usr/share/nginx/html + +``` + +Create the docker image: `docker build -t mystaticppt .` + +And run the container: `docker run --name myslides --rm -p 80:80 mystaticppt` + +You can visit your slids from http://localhost/ + + +Refer to the [tangramor/slidev_docker](https://github.com/tangramor/slidev_docker) for more details. From 1abac97d69f2a4c1bf1ea213947287922b7adba4 Mon Sep 17 00:00:00 2001 From: tangramor Date: Wed, 16 Mar 2022 18:53:55 +0800 Subject: [PATCH 016/211] Update install.md to fix typos about docker section (#58) --- guide/install.md | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/guide/install.md b/guide/install.md index 2dc43fd..c1e7157 100644 --- a/guide/install.md +++ b/guide/install.md @@ -101,9 +101,19 @@ You can visit your slides from http://localhost:3030/ Run command `docker exec -i slidev npx slidev build` on the running container `slidev`. It will generate static HTML files under `dist` folder. -You can host `dist` in a static web site such as [Github pages](https://tangramor.github.io/slidev_docker/) or Gitlab pages. Because in Github pages the url may contain subfolder, so you need to modify the generated `index.html` to change `href="/assets/xxx` to `href="./assets/xxx`. And to avoid Jekyll build process, you need to add an empty file `.nojekyll`. -You can also host it by yourself: +#### Host on Github Pages + +You can host `dist` in a static web site such as [Github Pages](https://tangramor.github.io/slidev_docker/) or Gitlab Pages. + +Because in Github pages the url may contain subfolder, so you need to modify the generated `index.html` to change `href="/assets/xxx` to `href="./assets/xxx`. Or you may use `--base=//` option during the build process, such as: `docker exec -i slidev npx slidev build --base=/slidev_docker/`. + +And to avoid Jekyll build process, you need to add an empty file `.nojekyll`. + + +#### Host by docker + +You can also host it by yourself with docker: ```bash docker run --name myslides --rm -p 80:80 -v ${PWD}/dist:/usr/share/nginx/html nginx:alpine @@ -122,7 +132,7 @@ Create the docker image: `docker build -t mystaticppt .` And run the container: `docker run --name myslides --rm -p 80:80 mystaticppt` -You can visit your slids from http://localhost/ +You can visit your slides from http://localhost/ Refer to the [tangramor/slidev_docker](https://github.com/tangramor/slidev_docker) for more details. From b18d6f476b18393dabf793d2f08d22f243683948 Mon Sep 17 00:00:00 2001 From: Alex Liu Date: Tue, 22 Mar 2022 10:53:21 +0800 Subject: [PATCH 017/211] docs: add custom-nav-controls documents (#60) --- custom/global-layers.md | 25 ++++++++++++++++++++++++- 1 file changed, 24 insertions(+), 1 deletion(-) diff --git a/custom/global-layers.md b/custom/global-layers.md index e907c8f..f5388cf 100644 --- a/custom/global-layers.md +++ b/custom/global-layers.md @@ -4,13 +4,15 @@ Global layers allow you to have custom components that **persistent** across slides. This could be useful for having footers, cross-slides animations, global effects, etc. -Slidev provides two layers for this usage, create `global-top.vue` or `global-bottom.vue` under your project root and it will pick up automatically. +Slidev provides three layers for this usage, create `global-top.vue`, `global-bottom.vue` or `custom-nav-controls.vue` under your project root and it will pick up automatically. Layers relationship: - Global Top (`global-top.vue`) - Slides - Global Bottom (`global-bottom.vue`) +- NavControls + - Customized Navigation Controls (`custom-nav-controls.vue`) ## Example @@ -23,6 +25,17 @@ Layers relationship: The text `Your Name` will appear to all your slides. +```html + + +``` + +The button `Next` will appear in NavControls. + To enabled it conditionally, you can apply it with the [Vue Global Context](/custom/vue-context). ```html @@ -60,3 +73,13 @@ To enabled it conditionally, you can apply it with the [Vue Global Context](/cus ``` + +```html + + + +``` From d68398ac58d3e8efc2f6d29119938f4a4382f617 Mon Sep 17 00:00:00 2001 From: Ruy Adorno Date: Fri, 25 Mar 2022 12:56:21 -0400 Subject: [PATCH 018/211] docs: add mention to --dark option when exporting (#61) --- guide/exporting.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/guide/exporting.md b/guide/exporting.md index 398969d..86df8df 100644 --- a/guide/exporting.md +++ b/guide/exporting.md @@ -19,6 +19,12 @@ $ slidev export After a few seconds, your slides will be ready at `./slides-exports.pdf`. +In case you want to export your slides using the dark version of the theme, use the `--dark` option: + +```bash +$ slidev export --dark +``` + ### Export Clicks Steps > Available since v0.21 From 9fa6829bca1bd8a2262cbc20eb2759d08a0f11fa Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?R=C3=A9mi=20Emonet?= Date: Wed, 13 Apr 2022 10:41:52 +0200 Subject: [PATCH 019/211] fix: correct typo in the name of the generated pdf (#62) --- guide/exporting.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/guide/exporting.md b/guide/exporting.md index 86df8df..5ee1fb0 100644 --- a/guide/exporting.md +++ b/guide/exporting.md @@ -17,7 +17,7 @@ Now export your slides to PDF using the following command $ slidev export ``` -After a few seconds, your slides will be ready at `./slides-exports.pdf`. +After a few seconds, your slides will be ready at `./slides-export.pdf`. In case you want to export your slides using the dark version of the theme, use the `--dark` option: From 73087998518d8ebb02773f5f2ee6959d7255a222 Mon Sep 17 00:00:00 2001 From: Alexander Eble <35292572+alexanderdavide@users.noreply.github.com> Date: Thu, 14 Apr 2022 03:46:18 +0200 Subject: [PATCH 020/211] Document parameter listClass of Toc (#63) --- builtin/components.md | 1 + 1 file changed, 1 insertion(+) diff --git a/builtin/components.md b/builtin/components.md index b957d8e..016202a 100644 --- a/builtin/components.md +++ b/builtin/components.md @@ -33,6 +33,7 @@ hideInToc: true Parameters: * `columns` (`string | number`, default: `1`): The number of columns of the display +* `listClass` (`string | string[]`, default: `''`): Classes to apply to the table of contents list * `maxDepth` (`string | number`, default: `Infinity`): The maximum depth level of title to display * `minDepth` (`string | number`, default: `1`): The minimum depth level of title to display * `mode` (`'all' | 'onlyCurrentTree'| 'onlySiblings'`, default: `'all'`): From 0daa359721a2cdbb0abac8fc5f5e1c00dd7b4452 Mon Sep 17 00:00:00 2001 From: Tony Cabaye Date: Thu, 14 Apr 2022 10:59:55 +0200 Subject: [PATCH 021/211] feat: add doc for Titles and Link components (#64) --- builtin/components.md | 63 ++++++++++++++++++++++++++++++++++--------- 1 file changed, 51 insertions(+), 12 deletions(-) diff --git a/builtin/components.md b/builtin/components.md index 016202a..e07348d 100644 --- a/builtin/components.md +++ b/builtin/components.md @@ -4,28 +4,21 @@ > The documentations of this section is still working in progress. Before that, you can take a look at the [source code](https://github.com/slidevjs/slidev/blob/main/packages/client/builtin) directly. -### `TOC` +### `Toc` Insert a Table Of Content. -Titles and title levels get automatically retrieved from the first title element of each slides. - -You can override this automatic behaviour for a slide by using the front matter syntax: -```yml ---- -title: Amazing slide title -level: 2 ---- -``` - -Or if you prefer the slide to not appear in the TOC at all, you can use: +If you want a slide to not appear in the `` component, you can use in the front matter block of the slide: ```yml --- hideInToc: true --- ``` +Titles are displayed using the [`` component](#titles) + #### Usage + ~~~md ~~~ @@ -41,6 +34,52 @@ Parameters: * `'onlyCurrentTree'`: Display only items that are in current tree (active item, parents and children of active item) * `'onlySiblings'`: Display only items that are in current tree and their direct siblings +### `Link` + +Insert a link you can use to navigate to a given slide. + +#### Usage + +~~~md +Go to slide 42 + +~~~ + +Parameters: + +* `to` (`string | number`): The path of the slide to navigate to (slides starts from `1`) +* `title` (`string`): The title to display + +### `Titles` + +Insert the main title from a slide parsed as HTML. + +Titles and title levels get automatically retrieved from the first title element of each slides. + +You can override this automatic behaviour for a slide by using the front matter syntax: +```yml +--- +title: Amazing slide title +level: 2 +--- +``` + +#### Usage + +The `` component is a virtual component you can import with: +```js +import Titles from '/@slidev/titles.md' +``` + +Then you can use it with: +~~~md + +~~~ + +Parameters: + +* `no` (`string | number`): The number of the slide to display the title from (slides starts from `1`) + ## Custom Components Create a directory `components/` under your project root, and simply put your custom Vue components under it, then you can use it with the same name in your markdown file! From 37797ff651c1914f542e82bc6a10f8450281fad5 Mon Sep 17 00:00:00 2001 From: Tony Cabaye Date: Fri, 15 Apr 2022 08:52:17 +0200 Subject: [PATCH 022/211] feat: update config doc (#65) --- custom/index.md | 36 +++++++++++++++++++++++++++--------- 1 file changed, 27 insertions(+), 9 deletions(-) diff --git a/custom/index.md b/custom/index.md index 33b9bab..64a8b4d 100644 --- a/custom/index.md +++ b/custom/index.md @@ -11,30 +11,45 @@ You can configure Slidev in the frontmatter of your first slide, the following s # theme id or package name theme: 'default' # title of your slide, will auto infer from the first header if not specified -title: '' +title: 'Slidev' # titleTemplate for the webpage, `%s` will be replaced by the page's title titleTemplate: '%s - Slidev' +# information for your slides, can be a markdown string +info: false # enabled pdf downloading in SPA build, can also be a custom url -download: true +download: false +# filename of the export file +exportFilename: 'slidev-exported.pdf' # syntax highlighter, can be 'prism' or 'shiki' highlighter: 'prism' # show line numbers in code blocks lineNumbers: false -# enable monaco editor, default to dev only +# enable monaco editor, can be boolean, 'dev' or 'build' monaco: 'dev' +# download remote assets in local using vite-plugin-remote-assets, can be boolean, 'dev' or 'build' +remoteAssets: false +# controls whether texts in slides are selectable +selectable: true +# enable slide recording, can be boolean, 'dev' or 'build' +record: 'dev' -# force color schema for the slides, could be 'auto', 'light', or 'dark' +# force color schema for the slides, can be 'auto', 'light', or 'dark' colorSchema: 'auto' -# router mode for vue-router, could be "history" or "hash" +# router mode for vue-router, can be "history" or "hash" routerMode: 'history' # aspect ratio for the slides aspectRatio: '16/9' # real width of the canvas, unit in px canvasWidth: 980 +# used for theme customization, will inject root styles as `--slidev-theme-x` for attribute `x` +themeConfig: + primary: '#5d8392' # favicon, can be a local file path or URL favicon: 'https://cdn.jsdelivr.net/gh/slidevjs/slidev/assets/favicon.png' +# URL of PlantUML server used to render diagrams +plantUmlServer: 'https://www.plantuml.com/plantuml' # fonts will be auto imported from Google fonts # Learn more: https://sli.dev/custom/fonts fonts: @@ -47,10 +62,13 @@ defaults: layout: 'default' # ... -# information for your slides, can be a markdown string -info: | - ## Slidev - My first [Slidev](http://sli.dev/) presentations! +# drawing options +# Learn more: https://sli.dev/guide/drawing.html +drawings: + enabled: true + persist: false + presenterOnly: false + syncAll: true --- ``` From 030576270f137f7a9f12dda14c167d21a7eb432c Mon Sep 17 00:00:00 2001 From: Alexander Eble <35292572+alexanderdavide@users.noreply.github.com> Date: Mon, 25 Apr 2022 05:31:27 +0200 Subject: [PATCH 023/211] docs: update previews of slidev-theme-academic (#66) --- .vitepress/themes.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.vitepress/themes.ts b/.vitepress/themes.ts index 1090423..df153c6 100644 --- a/.vitepress/themes.ts +++ b/.vitepress/themes.ts @@ -327,7 +327,7 @@ export const community: ThemeInfo[] = [ previews: [ 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/01.png', 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/02.png', - 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/03.png', + 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/08.png', 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/04.png', 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/05.png', 'https://cdn.jsdelivr.net/gh/alexanderdavide/slidev-theme-academic@assets/example-export/06.png', From 87e46ef57643c3aa0f8551691b431a7cec3ed0c4 Mon Sep 17 00:00:00 2001 From: Tony Cabaye Date: Thu, 19 May 2022 11:15:57 +0200 Subject: [PATCH 024/211] feat: add doc for CLI commands (#67) --- custom/index.md | 1 + guide/install.md | 86 ++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 87 insertions(+) diff --git a/custom/index.md b/custom/index.md index 64a8b4d..faddfd7 100644 --- a/custom/index.md +++ b/custom/index.md @@ -9,6 +9,7 @@ You can configure Slidev in the frontmatter of your first slide, the following s ```yaml --- # theme id or package name +# Learn more: https://sli.dev/themes/use.html theme: 'default' # title of your slide, will auto infer from the first header if not specified title: 'Slidev' diff --git a/guide/install.md b/guide/install.md index c1e7157..fd7f85c 100644 --- a/guide/install.md +++ b/guide/install.md @@ -136,3 +136,89 @@ You can visit your slides from http://localhost/ Refer to the [tangramor/slidev_docker](https://github.com/tangramor/slidev_docker) for more details. + +### Command Line Interface (CLI) + +`@slidev/cli` Expose a few commands you can use with `npx slidev ...` or by adding scripts in your `package.json`: +```json +{ + "script": { + "dev": "slidev" + } +} +``` + +In that case you will be able to run `npm run dev`. + +You can pass options to any commands: + +* boolean option are `true` if they are present, false otherwise (example: `slidev --open`) +* some options can have values you can add just after the option or by using the `=` character (example: `slidev --port 8080` or `slidev --port=8080`) + +If you use npm scripts, don't forget to add `--` after the npm command: +```bash +npm run slidev -- --open +``` + +#### `slidev [entry]` + +Start a local server for Slidev. + +* `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. + +Options: + +* `--port`, `-p` (`number`, default: `3030`): port number. +* `--open`, `-o` (`boolean`, default: `false`): open in browser. +* `--remote [password]` (`string`): listen to public host and enable remote control, if a value is passed then the presenter mode is private and only accessible by passing the given password in the URL query `password` parameter. +* `--log` (`'error', 'warn', 'info', 'silent'`, default: `'warn'`): Log level. +* `--force`, `-f` (`boolean`, default `false`): force the optimizer to ignore the cache and re-bundle. +* `--theme`, `-t` (`string`): override theme. + +#### `slidev build [entry]` + +Build hostable SPA. + +* `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. + +Options: + +* `--watch`, `-w` (`boolean`, default: `false`): build watch. +* `--out`, `-o` (`string`, default: `dist`): output dir. +* `--base` (`string`, default: `/`): base URL (see https://cli.vuejs.org/config/#publicpath) +* `--download` (`boolean`, default: `false`): allow to download the slides as PDF inside the SPA. +* `--theme`, `-t` (`string`): override theme. + +#### `slidev export [entry]` + +Export slides to PDF (or other format). + +* `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. + +Options: + +* `--output` (`string`, default: use `exportFilename` (see https://sli.dev/custom/#frontmatter-configures) or use `[entry]-export`): path to the output. +* `--base` (`'pdf', 'png', 'md'`, default: `'pdf'`): output format. +* `--timeout` (`number`, default: `30000`): timeout for rendering the print page (see https://playwright.dev/docs/api/class-page#page-goto). +* `--range` (`string`): page ranges to export (example: `'1,4-5,6'`). +* `--dark` (`boolean`, default: `false`): export as dark theme. +* `--with-clicks`, `-c` (`boolean`, default: `false`): export pages for every clicks (see https://sli.dev/guide/animations.html#click-animations). +* `--theme`, `-t` (`string`): override theme. + +#### `slidev format [entry]` + +Format the markdown file. + +* `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. + +#### `slidev theme [subcommand]` + +Theme related operations. + +Subcommands: + +* `eject [entry]`: Eject current theme into local file system + * `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. + * Options: + * `--dir` (`string`, default: `theme`): output dir. + * `--theme`, `-t` (`string`): override theme. From 017f644e8a13bbfaaadda40c0b1fdf54ddb284a0 Mon Sep 17 00:00:00 2001 From: Haili Zhang Date: Sun, 22 May 2022 16:57:40 +0800 Subject: [PATCH 025/211] doc: propose a new showcase (#68) --- .vitepress/showcases.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/.vitepress/showcases.ts b/.vitepress/showcases.ts index e8e1242..7c4c6fa 100644 --- a/.vitepress/showcases.ts +++ b/.vitepress/showcases.ts @@ -120,6 +120,18 @@ export const showcases: ShowCaseInfo[] = [ at: 'Internal Tech Talk', datetime: '2022-03-11', }, + { + title: 'OpenFunction 202', + cover: 'https://s2.loli.net/2022/05/22/4zsCnkQRFoAU1E5.png', + author: { + name: 'Haili Zhang', + link: 'https://github.com/webup', + }, + slidesLink: 'https://openfunction-talks.netlify.app/2022/202-node-async/', + sourceLink: 'https://github.com/webup/openfunction-talks/tree/main/202-node-async', + at: 'OpenFunction Tutorial Sharing', + datetime: '2022-05-08', + }, // Add yours here! { title: 'Yours?', From afa4515b72ea8814d0a633bdb4ec4c41734b502c Mon Sep 17 00:00:00 2001 From: Liran Tal Date: Wed, 25 May 2022 00:43:40 +0300 Subject: [PATCH 026/211] docs: typo with NavControls action description (#69) --- custom/global-layers.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/custom/global-layers.md b/custom/global-layers.md index f5388cf..12579f9 100644 --- a/custom/global-layers.md +++ b/custom/global-layers.md @@ -36,7 +36,7 @@ The text `Your Name` will appear to all your slides. The button `Next` will appear in NavControls. -To enabled it conditionally, you can apply it with the [Vue Global Context](/custom/vue-context). +To enable it conditionally, you can apply it with the [Vue Global Context](/custom/vue-context). ```html From 18216961c9b829103d7ee5bc6c426cb525c3d51c Mon Sep 17 00:00:00 2001 From: Tony Cabaye Date: Wed, 25 May 2022 11:18:56 +0200 Subject: [PATCH 027/211] feat: addons doc (#71) * fix: title levels * feat: add addons doc * fix: remove compiler macro warnings --- .vitepress/config.js | 20 ++++++ .../theme/components/AlgoliaSearchBox.vue | 2 +- .../theme/components/BooleanDisplay.vue | 2 +- .vitepress/theme/components/Environment.vue | 2 - .vitepress/theme/components/NavBar.vue | 3 +- .../theme/components/NavDropdownLink.vue | 2 +- .../theme/components/NavDropdownLinkItem.vue | 2 +- .vitepress/theme/components/NavLink.vue | 2 +- .vitepress/theme/components/ShowCaseInfo.vue | 1 - .vitepress/theme/components/SideBar.vue | 1 - .vitepress/theme/components/ThemeGallery.vue | 2 +- .vitepress/theme/components/ThemeInfo.vue | 2 +- .vitepress/theme/components/Tweet.vue | 2 +- TRANSLATIONS.md | 5 ++ addons/use.md | 38 ++++++++++ addons/write-an-addon.md | 71 +++++++++++++++++++ guide/install.md | 12 ++-- 17 files changed, 149 insertions(+), 20 deletions(-) create mode 100644 addons/use.md create mode 100644 addons/write-an-addon.md diff --git a/.vitepress/config.js b/.vitepress/config.js index 915337d..c5b3569 100644 --- a/.vitepress/config.js +++ b/.vitepress/config.js @@ -70,6 +70,17 @@ const Theme = [ }, ] +const Addon = [ + { + text: 'Use Addon', + link: '/addons/use', + }, + { + text: 'Write an Addon', + link: '/addons/write-an-addon', + }, +] + const Translations = [ { text: 'English', @@ -191,6 +202,10 @@ const slidebars = [ text: 'Themes', children: Theme, }, + { + text: 'Addons', + children: Addon, + }, { text: 'Customizations', children: Customizations, @@ -254,6 +269,10 @@ module.exports = { text: 'Theme', items: Theme, }, + { + text: 'Addon', + items: Addon, + }, { text: 'Customize', items: Customizations, @@ -271,6 +290,7 @@ module.exports = { sidebar: { '/guide/': slidebars, '/themes/': slidebars, + '/addons/': slidebars, '/custom/': slidebars, '/builtin/': slidebars, '/resources/': slidebars, diff --git a/.vitepress/theme/components/AlgoliaSearchBox.vue b/.vitepress/theme/components/AlgoliaSearchBox.vue index 3961a51..b9a5b7f 100644 --- a/.vitepress/theme/components/AlgoliaSearchBox.vue +++ b/.vitepress/theme/components/AlgoliaSearchBox.vue @@ -5,7 +5,7 @@ diff --git a/.vitepress/theme/components/NavBar.vue b/.vitepress/theme/components/NavBar.vue index 5ba8c8d..ed00270 100644 --- a/.vitepress/theme/components/NavBar.vue +++ b/.vitepress/theme/components/NavBar.vue @@ -39,7 +39,6 @@ diff --git a/.vitepress/theme/components/HomeHero.vue b/.vitepress/theme/components/HomeHero.vue index 8bcbfff..efbc158 100644 --- a/.vitepress/theme/components/HomeHero.vue +++ b/.vitepress/theme/components/HomeHero.vue @@ -17,14 +17,14 @@ @@ -51,19 +51,19 @@ + - + + diff --git a/.vitepress/theme/NotFound.vue b/.vitepress/theme/NotFound.vue index 13494d3..bfaacb6 100644 --- a/.vitepress/theme/NotFound.vue +++ b/.vitepress/theme/NotFound.vue @@ -1,15 +1,7 @@ - - + + diff --git a/.vitepress/theme/components/AlgoliaSearchBox.vue b/.vitepress/theme/components/AlgoliaSearchBox.vue deleted file mode 100644 index 9561cb3..0000000 --- a/.vitepress/theme/components/AlgoliaSearchBox.vue +++ /dev/null @@ -1,123 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/BooleanDisplay.vue b/.vitepress/theme/components/BooleanDisplay.vue index 3a876f2..d51afbc 100644 --- a/.vitepress/theme/components/BooleanDisplay.vue +++ b/.vitepress/theme/components/BooleanDisplay.vue @@ -1,6 +1,4 @@ + + diff --git a/.vitepress/theme/components/DemoContainer.vue b/.vitepress/theme/components/DemoContainer.vue index 9d2b56f..1ea93e1 100644 --- a/.vitepress/theme/components/DemoContainer.vue +++ b/.vitepress/theme/components/DemoContainer.vue @@ -1,18 +1,18 @@ - - + + diff --git a/.vitepress/theme/components/EditLink.vue b/.vitepress/theme/components/EditLink.vue deleted file mode 100644 index 7504e01..0000000 --- a/.vitepress/theme/components/EditLink.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/Home.vue b/.vitepress/theme/components/Home.vue deleted file mode 100644 index 59b6eff..0000000 --- a/.vitepress/theme/components/Home.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/HomeFeatures.vue b/.vitepress/theme/components/HomeFeatures.vue deleted file mode 100644 index 292bc99..0000000 --- a/.vitepress/theme/components/HomeFeatures.vue +++ /dev/null @@ -1,137 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/HomeFooter.vue b/.vitepress/theme/components/HomeFooter.vue deleted file mode 100644 index 678be92..0000000 --- a/.vitepress/theme/components/HomeFooter.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - diff --git a/.vitepress/theme/components/HomeHero.vue b/.vitepress/theme/components/HomeHero.vue deleted file mode 100644 index efbc158..0000000 --- a/.vitepress/theme/components/HomeHero.vue +++ /dev/null @@ -1,174 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/LastUpdated.vue b/.vitepress/theme/components/LastUpdated.vue deleted file mode 100644 index c899316..0000000 --- a/.vitepress/theme/components/LastUpdated.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/NavBar.vue b/.vitepress/theme/components/NavBar.vue deleted file mode 100644 index ed00270..0000000 --- a/.vitepress/theme/components/NavBar.vue +++ /dev/null @@ -1,111 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/NavBarTitle.vue b/.vitepress/theme/components/NavBarTitle.vue deleted file mode 100644 index 5c4ca6f..0000000 --- a/.vitepress/theme/components/NavBarTitle.vue +++ /dev/null @@ -1,51 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/NavDropdownLink.vue b/.vitepress/theme/components/NavDropdownLink.vue deleted file mode 100644 index 6422ce9..0000000 --- a/.vitepress/theme/components/NavDropdownLink.vue +++ /dev/null @@ -1,131 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/NavDropdownLinkItem.vue b/.vitepress/theme/components/NavDropdownLinkItem.vue deleted file mode 100644 index cd8064a..0000000 --- a/.vitepress/theme/components/NavDropdownLinkItem.vue +++ /dev/null @@ -1,76 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/NavLink.vue b/.vitepress/theme/components/NavLink.vue deleted file mode 100644 index f48f4dc..0000000 --- a/.vitepress/theme/components/NavLink.vue +++ /dev/null @@ -1,61 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/NavLinks.vue b/.vitepress/theme/components/NavLinks.vue deleted file mode 100644 index 6be0326..0000000 --- a/.vitepress/theme/components/NavLinks.vue +++ /dev/null @@ -1,48 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/NextAndPrevLinks.vue b/.vitepress/theme/components/NextAndPrevLinks.vue deleted file mode 100644 index dcfea07..0000000 --- a/.vitepress/theme/components/NextAndPrevLinks.vue +++ /dev/null @@ -1,87 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/Note.vue b/.vitepress/theme/components/Note.vue deleted file mode 100644 index 0329e9f..0000000 --- a/.vitepress/theme/components/Note.vue +++ /dev/null @@ -1,5 +0,0 @@ - diff --git a/.vitepress/theme/components/Page.vue b/.vitepress/theme/components/Page.vue deleted file mode 100644 index f622cb9..0000000 --- a/.vitepress/theme/components/Page.vue +++ /dev/null @@ -1,48 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/PageFooter.vue b/.vitepress/theme/components/PageFooter.vue deleted file mode 100644 index 34e8ab6..0000000 --- a/.vitepress/theme/components/PageFooter.vue +++ /dev/null @@ -1,42 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/ShowCaseInfo.vue b/.vitepress/theme/components/ShowCaseInfo.vue index 74ea1f9..8f0a87a 100644 --- a/.vitepress/theme/components/ShowCaseInfo.vue +++ b/.vitepress/theme/components/ShowCaseInfo.vue @@ -8,14 +8,14 @@ defineProps<{ diff --git a/.vitepress/theme/components/SideBar.vue b/.vitepress/theme/components/SideBar.vue deleted file mode 100644 index 5c7fc8e..0000000 --- a/.vitepress/theme/components/SideBar.vue +++ /dev/null @@ -1,56 +0,0 @@ - - - - - diff --git a/.vitepress/theme/components/SideBarLink.ts b/.vitepress/theme/components/SideBarLink.ts deleted file mode 100644 index 14247f0..0000000 --- a/.vitepress/theme/components/SideBarLink.ts +++ /dev/null @@ -1,96 +0,0 @@ -import { FunctionalComponent, h, VNode } from 'vue' -import { useRoute, useData } from 'vitepress' -import { DefaultTheme } from '../config' -import { joinUrl, isActive } from '../utils' - -export interface Header { - level: number - title: string - slug: string -} - -interface HeaderWithChildren extends Header { - children?: Header[] -} - -export const SideBarLink: FunctionalComponent<{ - item: DefaultTheme.SideBarItem -}> = (props) => { - const route = useRoute() - const {site} = useData() - - const headers = route.data.headers - const text = props.item.text - const link = resolveLink(site.value.base, props.item.link) - const children = (props.item as DefaultTheme.SideBarGroup).children - const active = isActive(route, props.item.link) - const childItems = createChildren(active, children, headers) - - return h('li', { class: 'sidebar-link' }, [ - h( - link ? 'a' : 'p', - { - class: { 'sidebar-link-item': true, active }, - href: link, - }, - text, - ), - childItems, - ]) -} - -function resolveLink(base: string, path?: string): string | undefined { - if (path === undefined) - return path - - // keep relative hash to the same page - if (path.startsWith('#')) - return path - - return joinUrl(base, path) -} - -function createChildren( - active: boolean, - children?: DefaultTheme.SideBarItem[], - headers?: Header[], -): VNode | null { - if (children && children.length > 0) { - return h( - 'ul', - { class: 'sidebar-links' }, - children.map((c) => { - return h(SideBarLink, { item: c }) - }), - ) - } - - return active && headers - ? createChildren(false, resolveHeaders(headers)) - : null -} - -function resolveHeaders(headers: Header[]): DefaultTheme.SideBarItem[] { - return mapHeaders(groupHeaders(headers)) -} - -function groupHeaders(headers: Header[]): HeaderWithChildren[] { - headers = headers.map(h => Object.assign({}, h)) - let lastH2: HeaderWithChildren - headers.forEach((h) => { - if (h.level === 2) - lastH2 = h - - else if (lastH2) - (lastH2.children || (lastH2.children = [])).push(h) - }) - return headers.filter(h => h.level === 2) -} - -function mapHeaders(headers: HeaderWithChildren[]): DefaultTheme.SideBarItem[] { - return headers.map(header => ({ - text: header.title, - link: `#${header.slug}`, - children: header.children ? mapHeaders(header.children) : undefined, - })) -} diff --git a/.vitepress/theme/components/SideBarLinks.vue b/.vitepress/theme/components/SideBarLinks.vue deleted file mode 100644 index 77aea38..0000000 --- a/.vitepress/theme/components/SideBarLinks.vue +++ /dev/null @@ -1,12 +0,0 @@ - - - diff --git a/.vitepress/theme/components/ThemeGallery.vue b/.vitepress/theme/components/ThemeGallery.vue index b7fe1f9..ee92e0c 100644 --- a/.vitepress/theme/components/ThemeGallery.vue +++ b/.vitepress/theme/components/ThemeGallery.vue @@ -1,10 +1,10 @@ + - - @@ -429,6 +459,22 @@ This shows on the right This shows on the left ``` +## Import Code Snippets + +> Available since v0.47.0 + +You can import code snippets from existing files via following syntax: + +```md +<<< @/snippets/snippet.js +``` + +::: ttp +The value of `@` corresponds to the source root, the directory where the `slides.md` is located. +::: + +This feature is vendored from VitePress, learn more about it in [VitePress's documentation](https://vitepress.dev/guide/markdown#import-code-snippets). + ## Configurations All configurations needed can be defined in the Markdown file. For example: diff --git a/guide/why.md b/guide/why.md index 01c5ac2..20a4ab6 100644 --- a/guide/why.md +++ b/guide/why.md @@ -66,6 +66,4 @@ $ npm init slidev Or have a quick preview of it: -
- -
+ diff --git a/package.json b/package.json index 482f06e..457b3b1 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "devDependencies": { "@antfu/eslint-config": "^2.6.3", "@iconify/json": "^2.2.178", + "@shikijs/vitepress-twoslash": "1.0.0-beta.5", "@slidev/client": "0.34.3", "@slidev/parser": "0.34.3", "@slidev/theme-default": "0.21.2", @@ -26,13 +27,12 @@ "eslint": "^8.56.0", "fs-extra": "^11.2.0", "markdown-it": "^14.0.0", - "shiki": "1.0.0-beta.5", + "shiki": "^1.0.0-beta.5", "typescript": "^5.3.3", "unocss": "^0.58.4", "unplugin-icons": "^0.18.3", "unplugin-vue-components": "^0.26.0", "vite-plugin-inspect": "^0.8.3", - "vitepress": "^1.0.0-rc.41", - "windicss": "^3.5.6" + "vitepress": "^1.0.0-rc.41" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b866f17..5e5f60b 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -22,6 +22,9 @@ devDependencies: '@iconify/json': specifier: ^2.2.178 version: 2.2.178 + '@shikijs/vitepress-twoslash': + specifier: 1.0.0-beta.5 + version: 1.0.0-beta.5(typescript@5.3.3) '@slidev/client': specifier: 0.34.3 version: 0.34.3(typescript@5.3.3)(vite@3.2.8) @@ -53,7 +56,7 @@ devDependencies: specifier: ^14.0.0 version: 14.0.0 shiki: - specifier: 1.0.0-beta.5 + specifier: ^1.0.0-beta.5 version: 1.0.0-beta.5 typescript: specifier: ^5.3.3 @@ -73,9 +76,6 @@ devDependencies: vitepress: specifier: ^1.0.0-rc.41 version: 1.0.0-rc.41(@algolia/client-search@4.22.1)(@types/node@18.19.14)(postcss@8.4.33)(search-insights@2.13.0)(typescript@5.3.3) - windicss: - specifier: ^3.5.6 - version: 3.5.6 packages: @@ -983,6 +983,22 @@ packages: engines: {node: '>=14'} dev: true + /@floating-ui/core@1.6.0: + resolution: {integrity: sha512-PcF++MykgmTj3CIyOQbKA/hDzOAiqI3mhuoN44WRCopIs1sgoDoU4oty4Jtqaj/y3oDU6fnVSm4QG0a3t5i0+g==} + dependencies: + '@floating-ui/utils': 0.2.1 + dev: true + + /@floating-ui/dom@1.1.1: + resolution: {integrity: sha512-TpIO93+DIujg3g7SykEAGZMDtbJRrmnYRCNYSjJlvIbGhBjRSNTLVbNeDQBrzy9qDgUbiWdc7KA0uZHZ2tJmiw==} + dependencies: + '@floating-ui/core': 1.6.0 + dev: true + + /@floating-ui/utils@0.2.1: + resolution: {integrity: sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q==} + dev: true + /@humanwhocodes/config-array@0.11.14: resolution: {integrity: sha512-3T8LkOmg45BV5FICb15QQMsyUSWrQ8AygVfC7ZG32zOalnqrilm018ZVCw0eapXux8FtA33q8PSRSstjee3jSg==} engines: {node: '>=10.10.0'} @@ -1295,6 +1311,33 @@ packages: shiki: 1.0.0-beta.4 dev: true + /@shikijs/twoslash@1.0.0-beta.5(typescript@5.3.3): + resolution: {integrity: sha512-BPn2PFgy6Bon/hWU52ELWeGrdO1lsuR6ZIhTTDw4q+GrOZQsVDkdNlhIjoanGv1UY95dlbTEuPqXtzmk+4O73Q==} + dependencies: + '@shikijs/core': 1.0.0-beta.5 + twoslash: 0.1.0(typescript@5.3.3) + transitivePeerDependencies: + - supports-color + - typescript + dev: true + + /@shikijs/vitepress-twoslash@1.0.0-beta.5(typescript@5.3.3): + resolution: {integrity: sha512-FBjhz1sgSVNepZgPIk3jxPfI4tTVr+hCbR3niVQHrm9hgdqBBoU3cU3TUS3yB+7GJArGJAFrCtYUxsU9g/mUaQ==} + dependencies: + '@shikijs/twoslash': 1.0.0-beta.5(typescript@5.3.3) + floating-vue: 5.2.2(vue@3.4.15) + mdast-util-from-markdown: 2.0.0 + mdast-util-gfm: 3.0.0 + mdast-util-to-hast: 13.1.0 + shiki: 1.0.0-beta.5 + twoslash-vue: 0.1.0(typescript@5.3.3) + vue: 3.4.15(typescript@5.3.3) + transitivePeerDependencies: + - '@nuxt/kit' + - supports-color + - typescript + dev: true + /@sindresorhus/merge-streams@1.0.0: resolution: {integrity: sha512-rUV5WyJrJLoloD4NDN1V1+LDMDWOa4OTsT4yYJwQNpTU6FWxkxHpL7eu4w+DmiH8x/EAM1otkPE1+LaspIbplw==} engines: {node: '>=18'} @@ -1435,6 +1478,12 @@ packages: - typescript dev: true + /@types/debug@4.1.12: + resolution: {integrity: sha512-vIChWdVG3LG1SMxEvI/AK+FWJthlrqlTu7fbrlywTkkaONwk/UAGaULXRlf8vkzFBLVm0zkMdCquhL5aOjhXPQ==} + dependencies: + '@types/ms': 0.7.34 + dev: true + /@types/estree@1.0.5: resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==} dev: true @@ -1446,6 +1495,12 @@ packages: '@types/node': 18.19.14 dev: true + /@types/hast@3.0.4: + resolution: {integrity: sha512-WPs+bbQw5aCj+x6laNGWLH3wviHtoCv/P3+otBhbOhJgG8qtpdAMlTCxLtsTWA7LH1Oh/bFCHsBn0TPS5m30EQ==} + dependencies: + '@types/unist': 2.0.10 + dev: true + /@types/json-schema@7.0.15: resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==} dev: true @@ -1473,10 +1528,20 @@ packages: '@types/unist': 2.0.10 dev: true + /@types/mdast@4.0.3: + resolution: {integrity: sha512-LsjtqsyF+d2/yFOYaN22dHZI1Cpwkrj+g06G8+qtUKlhovPW89YhqSnfKtMbkgmEtYpH2gydRNULd6y8mciAFg==} + dependencies: + '@types/unist': 3.0.2 + dev: true + /@types/mdurl@1.0.5: resolution: {integrity: sha512-6L6VymKTzYSrEf4Nev4Xa1LCHKrlTlYCBMTlQKFuddo1CvQcE52I0mwfOJayueUC7MJuXOeHTcIU683lzd0cUA==} dev: true + /@types/ms@0.7.34: + resolution: {integrity: sha512-nG96G3Wp6acyAgJqGasjODb+acrI7KltPiRxzHPXnP3NgI28bpQDRv53olbqGXbfcgF5aiiHmO3xpwEpS5Ld9g==} + dev: true + /@types/node@18.19.14: resolution: {integrity: sha512-EnQ4Us2rmOS64nHDWr0XqAD8DsO6f3XR6lf9UIIrZQpUzPVdN/oPuEzfDWNHSyXLvoGgjuEm/sPwFGSSs35Wtg==} dependencies: @@ -1495,6 +1560,10 @@ packages: resolution: {integrity: sha512-IfYcSBWE3hLpBg8+X2SEa8LVkJdJEkT2Ese2aaLs3ptGdVtABxndrMaxuFlQ1qdFf9Q5rDvDpxI3WwgvKFAsQA==} dev: true + /@types/unist@3.0.2: + resolution: {integrity: sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==} + dev: true + /@types/web-bluetooth@0.0.14: resolution: {integrity: sha512-5d2RhCard1nQUC3aHcq/gHzWYO6K0WJmAbjO7mQJgCQKtZpgXxv1rOM6O/dBDhDYYVutk1sciOgNSe+5YyfM8A==} dev: true @@ -1634,6 +1703,14 @@ packages: eslint-visitor-keys: 3.4.3 dev: true + /@typescript/vfs@1.5.0: + resolution: {integrity: sha512-AJS307bPgbsZZ9ggCT3wwpg3VbTKMFNHfaY/uF0ahSkYYrPF2dSSKDNIDIQAHm9qJqbLvCsSJH7yN4Vs/CsMMg==} + dependencies: + debug: 4.3.4 + transitivePeerDependencies: + - supports-color + dev: true + /@ungap/structured-clone@1.2.0: resolution: {integrity: sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==} dev: true @@ -1997,6 +2074,18 @@ packages: vue: 3.4.15(typescript@5.3.3) dev: true + /@volar/language-core@1.11.1: + resolution: {integrity: sha512-dOcNn3i9GgZAcJt43wuaEykSluAuOkQgzni1cuxLxTV0nJKanQztp7FxyswdRILaKH+P2XZMPRp2S4MV/pElCw==} + dependencies: + '@volar/source-map': 1.11.1 + dev: true + + /@volar/source-map@1.11.1: + resolution: {integrity: sha512-hJnOnwZ4+WT5iupLRnuzbULZ42L7BWWPMmruzwtLhJfpDVoZLjNBxHDi2sY2bgZXCKlpU5XcsMFoYrsQmPhfZg==} + dependencies: + muggle-string: 0.3.1 + dev: true + /@vue/compiler-core@3.4.15: resolution: {integrity: sha512-XcJQVOaxTKCnth1vCxEChteGuwG6wqnUHxAm1DO3gCz0+uXKaJNx8/digSz4dLALCy8n2lKq24jSUs8segoqIw==} dependencies: @@ -2062,6 +2151,26 @@ packages: rfdc: 1.3.1 dev: true + /@vue/language-core@1.8.27(typescript@5.3.3): + resolution: {integrity: sha512-L8Kc27VdQserNaCUNiSFdDl9LWT24ly8Hpwf1ECy3aFb9m6bDhBGQYOujDm21N7EW3moKIOKEanQwe1q5BK+mA==} + peerDependencies: + typescript: '*' + peerDependenciesMeta: + typescript: + optional: true + dependencies: + '@volar/language-core': 1.11.1 + '@volar/source-map': 1.11.1 + '@vue/compiler-dom': 3.4.15 + '@vue/shared': 3.4.15 + computeds: 0.0.1 + minimatch: 9.0.3 + muggle-string: 0.3.1 + path-browserify: 1.0.1 + typescript: 5.3.3 + vue-template-compiler: 2.7.16 + dev: true + /@vue/reactivity@3.4.15: resolution: {integrity: sha512-55yJh2bsff20K5O84MxSvXKPHHt17I2EomHznvFiJCAZpJTNW8IuLj1xZWMLELRhBK3kkFV/1ErZGHJfah7i7w==} dependencies: @@ -2458,6 +2567,10 @@ packages: resolution: {integrity: sha512-acWTYaha8xfhA/Du/z4sNZjHUWjkiuoAi2LM+T/aL+kemKQgPT1xBb/YKjlQ0Qo8gvbHsGNplrEJ+9G3gL7i4Q==} dev: true + /ccount@2.0.1: + resolution: {integrity: sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg==} + dev: true + /chalk@2.4.2: resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==} engines: {node: '>=4'} @@ -2483,6 +2596,10 @@ packages: resolution: {integrity: sha512-iBMyeEHxfVnIakwOuDXpVkc54HijNgCyQB2w0VfGQThle6NXn50zU6V/u+LDhxHcDUPojn6Kpga3PTAD8W1bQw==} dev: true + /character-entities@2.0.2: + resolution: {integrity: sha512-shx7oQ0Awen/BRIdkjkvz54PnEEI/EjwXDSIZp86/KKdbafHh1Df/RYGBhn4hbe2+uKC9FnT5UCEdyPz3ai9hQ==} + dev: true + /character-reference-invalid@1.1.4: resolution: {integrity: sha512-mKKUkUbhPpQlCOfIuZkvSEgktjPFIsZKRRbC6KWVEMvlzblj3i3asQv5ODsrwt0N3pHAEvjP8KTQPHkp0+6jOg==} dev: true @@ -2586,6 +2703,10 @@ packages: engines: {node: '>= 12.0.0'} dev: true + /computeds@0.0.1: + resolution: {integrity: sha512-7CEBgcMjVmitjYo5q8JTJVra6X5mQ20uTThdK+0kR7UEaDrAWEQcRiBtWJzga4eRpP6afNwwLsX2SET2JhVB1Q==} + dev: true + /concat-map@0.0.1: resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==} dev: true @@ -2932,6 +3053,10 @@ packages: resolution: {integrity: sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ==} dev: true + /de-indent@1.0.2: + resolution: {integrity: sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==} + dev: true + /debug@3.2.7: resolution: {integrity: sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==} peerDependencies: @@ -2955,6 +3080,12 @@ packages: ms: 2.1.2 dev: true + /decode-named-character-reference@1.0.2: + resolution: {integrity: sha512-O8x12RzrUF8xyVcY0KJowWsmaJxQbmy0/EtnNtHRpsOcT7dFk5W598coHqBVpmWo1oQQfsCqfCmkZN5DJrZVdg==} + dependencies: + character-entities: 2.0.2 + dev: true + /deep-is@0.1.4: resolution: {integrity: sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==} dev: true @@ -2987,6 +3118,11 @@ packages: robust-predicates: 3.0.1 dev: true + /dequal@2.0.3: + resolution: {integrity: sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==} + engines: {node: '>=6'} + dev: true + /destr@1.2.2: resolution: {integrity: sha512-lrbCJwD9saUQrqUfXvl6qoM+QN3W7tLV5pAOs+OqOmopCCz/JkE05MHedJR1xfk4IAnZuJXPVuN5+7jNA2ZCiA==} dev: true @@ -2995,6 +3131,12 @@ packages: resolution: {integrity: sha512-65AlobnZMiCET00KaFFjUefxDX0khFA/E4myqZ7a6Sq1yZtR8+FVIvilVX66vF2uobSumxooYZChiRPCKNqhmg==} dev: true + /devlop@1.1.0: + resolution: {integrity: sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA==} + dependencies: + dequal: 2.0.3 + dev: true + /dir-glob@3.0.1: resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==} engines: {node: '>=8'} @@ -3317,7 +3459,6 @@ packages: engines: {node: '>=12'} requiresBuild: true dev: true - optional: true /eslint-compat-utils@0.1.2(eslint@8.56.0): resolution: {integrity: sha512-Jia4JDldWnFNIru1Ehx1H5s9/yxiRHY/TimCuUc0jNexew3cF1gI6CYZil1ociakfWO3rRqFjl1mskBblB3RYg==} @@ -3889,6 +4030,20 @@ packages: resolution: {integrity: sha512-36yxDn5H7OFZQla0/jFJmbIKTdZAQHngCedGxiMmpNfEZM0sdEeT+WczLQrjK6D7o2aiyLYDnkw0R3JK0Qv1RQ==} dev: true + /floating-vue@5.2.2(vue@3.4.15): + resolution: {integrity: sha512-afW+h2CFafo+7Y9Lvw/xsqjaQlKLdJV7h1fCHfcYQ1C4SVMlu7OAekqWgu5d4SgvkBVU0pVpLlVsrSTBURFRkg==} + peerDependencies: + '@nuxt/kit': ^3.2.0 + vue: ^3.2.0 + peerDependenciesMeta: + '@nuxt/kit': + optional: true + dependencies: + '@floating-ui/dom': 1.1.1 + vue: 3.4.15(typescript@5.3.3) + vue-resize: 2.0.0-alpha.1(vue@3.4.15) + dev: true + /focus-trap@7.5.4: resolution: {integrity: sha512-N7kHdlgsO/v+iD/dMoJKtsSqs5Dz/dXZVebRgJw23LDk+jMi/974zyiOYDziY2JPp8xivq9BmUGwIJMiuSBi7w==} dependencies: @@ -4078,6 +4233,11 @@ packages: function-bind: 1.1.2 dev: true + /he@1.2.0: + resolution: {integrity: sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==} + hasBin: true + dev: true + /heap@0.2.7: resolution: {integrity: sha512-2bsegYkkHO+h/9MGbn6KWcE45cHZgPANo5LXF7EvWdT0yT2EguSVO1nDgU5c8+ZOPwp2vMNa7YFsJhVcDR9Sdg==} dev: true @@ -4332,6 +4492,7 @@ packages: /jsonc-parser@3.2.1: resolution: {integrity: sha512-AilxAyFOAcK5wA1+LeaySVBrHsGQvUFCDWXKpZjzaL0PqW+xfBOttn8GNtWKFWqneyMZj41MWF9Kl6iPWLwgOA==} + requiresBuild: true dev: true /jsonfile@6.1.0: @@ -4439,6 +4600,10 @@ packages: resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==} dev: true + /longest-streak@3.1.0: + resolution: {integrity: sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g==} + dev: true + /lru-cache@5.1.1: resolution: {integrity: sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==} dependencies: @@ -4482,6 +4647,19 @@ packages: uc.micro: 2.0.0 dev: true + /markdown-table@3.0.3: + resolution: {integrity: sha512-Z1NL3Tb1M9wH4XESsCDEksWoKTdlUafKc4pt0GRwjUyXaCFZ+dc3g2erqB6zm3szA2IUSi7VnPI+o/9jnxh9hw==} + dev: true + + /mdast-util-find-and-replace@3.0.1: + resolution: {integrity: sha512-SG21kZHGC3XRTSUhtofZkBzZTJNM5ecCi0SK2IMKmSXR8vO3peL+kb1O0z7Zl83jKtutG4k5Wv/W7V3/YHvzPA==} + dependencies: + '@types/mdast': 4.0.3 + escape-string-regexp: 5.0.0 + unist-util-is: 6.0.0 + unist-util-visit-parents: 6.0.1 + dev: true + /mdast-util-from-markdown@0.8.5: resolution: {integrity: sha512-2hkTXtYYnr+NubD/g6KGBS/0mFmBcifAsI0yIWRiRo0PjVs6SSOSOdtzbp6kSGnShDN6G5aWZpKQ2lWRy27mWQ==} dependencies: @@ -4494,10 +4672,138 @@ packages: - supports-color dev: true + /mdast-util-from-markdown@2.0.0: + resolution: {integrity: sha512-n7MTOr/z+8NAX/wmhhDji8O3bRvPTV/U0oTCaZJkjhPSKTPhS3xufVhKGF8s1pJ7Ox4QgoIU7KHseh09S+9rTA==} + dependencies: + '@types/mdast': 4.0.3 + '@types/unist': 3.0.2 + decode-named-character-reference: 1.0.2 + devlop: 1.1.0 + mdast-util-to-string: 4.0.0 + micromark: 4.0.0 + micromark-util-decode-numeric-character-reference: 2.0.1 + micromark-util-decode-string: 2.0.0 + micromark-util-normalize-identifier: 2.0.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + unist-util-stringify-position: 4.0.0 + transitivePeerDependencies: + - supports-color + dev: true + + /mdast-util-gfm-autolink-literal@2.0.0: + resolution: {integrity: sha512-FyzMsduZZHSc3i0Px3PQcBT4WJY/X/RCtEJKuybiC6sjPqLv7h1yqAkmILZtuxMSsUyaLUWNp71+vQH2zqp5cg==} + dependencies: + '@types/mdast': 4.0.3 + ccount: 2.0.1 + devlop: 1.1.0 + mdast-util-find-and-replace: 3.0.1 + micromark-util-character: 2.1.0 + dev: true + + /mdast-util-gfm-footnote@2.0.0: + resolution: {integrity: sha512-5jOT2boTSVkMnQ7LTrd6n/18kqwjmuYqo7JUPe+tRCY6O7dAuTFMtTPauYYrMPpox9hlN0uOx/FL8XvEfG9/mQ==} + dependencies: + '@types/mdast': 4.0.3 + devlop: 1.1.0 + mdast-util-from-markdown: 2.0.0 + mdast-util-to-markdown: 2.1.0 + micromark-util-normalize-identifier: 2.0.0 + transitivePeerDependencies: + - supports-color + dev: true + + /mdast-util-gfm-strikethrough@2.0.0: + resolution: {integrity: sha512-mKKb915TF+OC5ptj5bJ7WFRPdYtuHv0yTRxK2tJvi+BDqbkiG7h7u/9SI89nRAYcmap2xHQL9D+QG/6wSrTtXg==} + dependencies: + '@types/mdast': 4.0.3 + mdast-util-from-markdown: 2.0.0 + mdast-util-to-markdown: 2.1.0 + transitivePeerDependencies: + - supports-color + dev: true + + /mdast-util-gfm-table@2.0.0: + resolution: {integrity: sha512-78UEvebzz/rJIxLvE7ZtDd/vIQ0RHv+3Mh5DR96p7cS7HsBhYIICDBCu8csTNWNO6tBWfqXPWekRuj2FNOGOZg==} + dependencies: + '@types/mdast': 4.0.3 + devlop: 1.1.0 + markdown-table: 3.0.3 + mdast-util-from-markdown: 2.0.0 + mdast-util-to-markdown: 2.1.0 + transitivePeerDependencies: + - supports-color + dev: true + + /mdast-util-gfm-task-list-item@2.0.0: + resolution: {integrity: sha512-IrtvNvjxC1o06taBAVJznEnkiHxLFTzgonUdy8hzFVeDun0uTjxxrRGVaNFqkU1wJR3RBPEfsxmU6jDWPofrTQ==} + dependencies: + '@types/mdast': 4.0.3 + devlop: 1.1.0 + mdast-util-from-markdown: 2.0.0 + mdast-util-to-markdown: 2.1.0 + transitivePeerDependencies: + - supports-color + dev: true + + /mdast-util-gfm@3.0.0: + resolution: {integrity: sha512-dgQEX5Amaq+DuUqf26jJqSK9qgixgd6rYDHAv4aTBuA92cTknZlKpPfa86Z/s8Dj8xsAQpFfBmPUHWJBWqS4Bw==} + dependencies: + mdast-util-from-markdown: 2.0.0 + mdast-util-gfm-autolink-literal: 2.0.0 + mdast-util-gfm-footnote: 2.0.0 + mdast-util-gfm-strikethrough: 2.0.0 + mdast-util-gfm-table: 2.0.0 + mdast-util-gfm-task-list-item: 2.0.0 + mdast-util-to-markdown: 2.1.0 + transitivePeerDependencies: + - supports-color + dev: true + + /mdast-util-phrasing@4.1.0: + resolution: {integrity: sha512-TqICwyvJJpBwvGAMZjj4J2n0X8QWp21b9l0o7eXyVJ25YNWYbJDVIyD1bZXE6WtV6RmKJVYmQAKWa0zWOABz2w==} + dependencies: + '@types/mdast': 4.0.3 + unist-util-is: 6.0.0 + dev: true + + /mdast-util-to-hast@13.1.0: + resolution: {integrity: sha512-/e2l/6+OdGp/FB+ctrJ9Avz71AN/GRH3oi/3KAx/kMnoUsD6q0woXlDT8lLEeViVKE7oZxE7RXzvO3T8kF2/sA==} + dependencies: + '@types/hast': 3.0.4 + '@types/mdast': 4.0.3 + '@ungap/structured-clone': 1.2.0 + devlop: 1.1.0 + micromark-util-sanitize-uri: 2.0.0 + trim-lines: 3.0.1 + unist-util-position: 5.0.0 + unist-util-visit: 5.0.0 + vfile: 6.0.1 + dev: true + + /mdast-util-to-markdown@2.1.0: + resolution: {integrity: sha512-SR2VnIEdVNCJbP6y7kVTJgPLifdr8WEU440fQec7qHoHOUz/oJ2jmNRqdDQ3rbiStOXb2mCDGTuwsK5OPUgYlQ==} + dependencies: + '@types/mdast': 4.0.3 + '@types/unist': 3.0.2 + longest-streak: 3.1.0 + mdast-util-phrasing: 4.1.0 + mdast-util-to-string: 4.0.0 + micromark-util-decode-string: 2.0.0 + unist-util-visit: 5.0.0 + zwitch: 2.0.4 + dev: true + /mdast-util-to-string@2.0.0: resolution: {integrity: sha512-AW4DRS3QbBayY/jJmD8437V1Gombjf8RSOUCMFBuo5iHi58AGEgVCKQ+ezHkZZDpAQS75hcBMpLqjpJTjtUL7w==} dev: true + /mdast-util-to-string@4.0.0: + resolution: {integrity: sha512-0H44vDimn51F0YwvxSJSm0eCDOJTRlmN0R1yBh4HLj9wiV1Dn0QoXGbvFAWj2hSItVTlCmBF1hqKlIyUBVFLPg==} + dependencies: + '@types/mdast': 4.0.3 + dev: true + /mdn-data@2.0.30: resolution: {integrity: sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==} dev: true @@ -4536,6 +4842,157 @@ packages: web-worker: 1.3.0 dev: true + /micromark-core-commonmark@2.0.0: + resolution: {integrity: sha512-jThOz/pVmAYUtkroV3D5c1osFXAMv9e0ypGDOIZuCeAe91/sD6BoE2Sjzt30yuXtwOYUmySOhMas/PVyh02itA==} + dependencies: + decode-named-character-reference: 1.0.2 + devlop: 1.1.0 + micromark-factory-destination: 2.0.0 + micromark-factory-label: 2.0.0 + micromark-factory-space: 2.0.0 + micromark-factory-title: 2.0.0 + micromark-factory-whitespace: 2.0.0 + micromark-util-character: 2.1.0 + micromark-util-chunked: 2.0.0 + micromark-util-classify-character: 2.0.0 + micromark-util-html-tag-name: 2.0.0 + micromark-util-normalize-identifier: 2.0.0 + micromark-util-resolve-all: 2.0.0 + micromark-util-subtokenize: 2.0.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + dev: true + + /micromark-factory-destination@2.0.0: + resolution: {integrity: sha512-j9DGrQLm/Uhl2tCzcbLhy5kXsgkHUrjJHg4fFAeoMRwJmJerT9aw4FEhIbZStWN8A3qMwOp1uzHr4UL8AInxtA==} + dependencies: + micromark-util-character: 2.1.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + dev: true + + /micromark-factory-label@2.0.0: + resolution: {integrity: sha512-RR3i96ohZGde//4WSe/dJsxOX6vxIg9TimLAS3i4EhBAFx8Sm5SmqVfR8E87DPSR31nEAjZfbt91OMZWcNgdZw==} + dependencies: + devlop: 1.1.0 + micromark-util-character: 2.1.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + dev: true + + /micromark-factory-space@2.0.0: + resolution: {integrity: sha512-TKr+LIDX2pkBJXFLzpyPyljzYK3MtmllMUMODTQJIUfDGncESaqB90db9IAUcz4AZAJFdd8U9zOp9ty1458rxg==} + dependencies: + micromark-util-character: 2.1.0 + micromark-util-types: 2.0.0 + dev: true + + /micromark-factory-title@2.0.0: + resolution: {integrity: sha512-jY8CSxmpWLOxS+t8W+FG3Xigc0RDQA9bKMY/EwILvsesiRniiVMejYTE4wumNc2f4UbAa4WsHqe3J1QS1sli+A==} + dependencies: + micromark-factory-space: 2.0.0 + micromark-util-character: 2.1.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + dev: true + + /micromark-factory-whitespace@2.0.0: + resolution: {integrity: sha512-28kbwaBjc5yAI1XadbdPYHX/eDnqaUFVikLwrO7FDnKG7lpgxnvk/XGRhX/PN0mOZ+dBSZ+LgunHS+6tYQAzhA==} + dependencies: + micromark-factory-space: 2.0.0 + micromark-util-character: 2.1.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + dev: true + + /micromark-util-character@2.1.0: + resolution: {integrity: sha512-KvOVV+X1yLBfs9dCBSopq/+G1PcgT3lAK07mC4BzXi5E7ahzMAF8oIupDDJ6mievI6F+lAATkbQQlQixJfT3aQ==} + dependencies: + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + dev: true + + /micromark-util-chunked@2.0.0: + resolution: {integrity: sha512-anK8SWmNphkXdaKgz5hJvGa7l00qmcaUQoMYsBwDlSKFKjc6gjGXPDw3FNL3Nbwq5L8gE+RCbGqTw49FK5Qyvg==} + dependencies: + micromark-util-symbol: 2.0.0 + dev: true + + /micromark-util-classify-character@2.0.0: + resolution: {integrity: sha512-S0ze2R9GH+fu41FA7pbSqNWObo/kzwf8rN/+IGlW/4tC6oACOs8B++bh+i9bVyNnwCcuksbFwsBme5OCKXCwIw==} + dependencies: + micromark-util-character: 2.1.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + dev: true + + /micromark-util-combine-extensions@2.0.0: + resolution: {integrity: sha512-vZZio48k7ON0fVS3CUgFatWHoKbbLTK/rT7pzpJ4Bjp5JjkZeasRfrS9wsBdDJK2cJLHMckXZdzPSSr1B8a4oQ==} + dependencies: + micromark-util-chunked: 2.0.0 + micromark-util-types: 2.0.0 + dev: true + + /micromark-util-decode-numeric-character-reference@2.0.1: + resolution: {integrity: sha512-bmkNc7z8Wn6kgjZmVHOX3SowGmVdhYS7yBpMnuMnPzDq/6xwVA604DuOXMZTO1lvq01g+Adfa0pE2UKGlxL1XQ==} + dependencies: + micromark-util-symbol: 2.0.0 + dev: true + + /micromark-util-decode-string@2.0.0: + resolution: {integrity: sha512-r4Sc6leeUTn3P6gk20aFMj2ntPwn6qpDZqWvYmAG6NgvFTIlj4WtrAudLi65qYoaGdXYViXYw2pkmn7QnIFasA==} + dependencies: + decode-named-character-reference: 1.0.2 + micromark-util-character: 2.1.0 + micromark-util-decode-numeric-character-reference: 2.0.1 + micromark-util-symbol: 2.0.0 + dev: true + + /micromark-util-encode@2.0.0: + resolution: {integrity: sha512-pS+ROfCXAGLWCOc8egcBvT0kf27GoWMqtdarNfDcjb6YLuV5cM3ioG45Ys2qOVqeqSbjaKg72vU+Wby3eddPsA==} + dev: true + + /micromark-util-html-tag-name@2.0.0: + resolution: {integrity: sha512-xNn4Pqkj2puRhKdKTm8t1YHC/BAjx6CEwRFXntTaRf/x16aqka6ouVoutm+QdkISTlT7e2zU7U4ZdlDLJd2Mcw==} + dev: true + + /micromark-util-normalize-identifier@2.0.0: + resolution: {integrity: sha512-2xhYT0sfo85FMrUPtHcPo2rrp1lwbDEEzpx7jiH2xXJLqBuy4H0GgXk5ToU8IEwoROtXuL8ND0ttVa4rNqYK3w==} + dependencies: + micromark-util-symbol: 2.0.0 + dev: true + + /micromark-util-resolve-all@2.0.0: + resolution: {integrity: sha512-6KU6qO7DZ7GJkaCgwBNtplXCvGkJToU86ybBAUdavvgsCiG8lSSvYxr9MhwmQ+udpzywHsl4RpGJsYWG1pDOcA==} + dependencies: + micromark-util-types: 2.0.0 + dev: true + + /micromark-util-sanitize-uri@2.0.0: + resolution: {integrity: sha512-WhYv5UEcZrbAtlsnPuChHUAsu/iBPOVaEVsntLBIdpibO0ddy8OzavZz3iL2xVvBZOpolujSliP65Kq0/7KIYw==} + dependencies: + micromark-util-character: 2.1.0 + micromark-util-encode: 2.0.0 + micromark-util-symbol: 2.0.0 + dev: true + + /micromark-util-subtokenize@2.0.0: + resolution: {integrity: sha512-vc93L1t+gpR3p8jxeVdaYlbV2jTYteDje19rNSS/H5dlhxUYll5Fy6vJ2cDwP8RnsXi818yGty1ayP55y3W6fg==} + dependencies: + devlop: 1.1.0 + micromark-util-chunked: 2.0.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + dev: true + + /micromark-util-symbol@2.0.0: + resolution: {integrity: sha512-8JZt9ElZ5kyTnO94muPxIGS8oyElRJaiJO8EzV6ZSyGQ1Is8xwl4Q45qU5UOg+bGH4AikWziz0iN4sFLWs8PGw==} + dev: true + + /micromark-util-types@2.0.0: + resolution: {integrity: sha512-oNh6S2WMHWRZrmutsRmDDfkzKtxF+bc2VxLC9dvtrDIRFln627VsFP6fLMgTryGDljgLPjkrzQSDcPrjPyDJ5w==} + dev: true + /micromark@2.11.4: resolution: {integrity: sha512-+WoovN/ppKolQOFIAajxi7Lu9kInbPxFuTBVEavFcL8eAfVstoc5MocPmqBeAdBOJV00uaVjegzH4+MA0DN/uA==} dependencies: @@ -4545,6 +5002,30 @@ packages: - supports-color dev: true + /micromark@4.0.0: + resolution: {integrity: sha512-o/sd0nMof8kYff+TqcDx3VSrgBTcZpSvYcAHIfHhv5VAuNmisCxjhx6YmxS8PFEpb9z5WKWKPdzf0jM23ro3RQ==} + dependencies: + '@types/debug': 4.1.12 + debug: 4.3.4 + decode-named-character-reference: 1.0.2 + devlop: 1.1.0 + micromark-core-commonmark: 2.0.0 + micromark-factory-space: 2.0.0 + micromark-util-character: 2.1.0 + micromark-util-chunked: 2.0.0 + micromark-util-combine-extensions: 2.0.0 + micromark-util-decode-numeric-character-reference: 2.0.1 + micromark-util-encode: 2.0.0 + micromark-util-normalize-identifier: 2.0.0 + micromark-util-resolve-all: 2.0.0 + micromark-util-sanitize-uri: 2.0.0 + micromark-util-subtokenize: 2.0.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + transitivePeerDependencies: + - supports-color + dev: true + /micromatch@4.0.5: resolution: {integrity: sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==} engines: {node: '>=8.6'} @@ -4652,6 +5133,10 @@ packages: resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==} dev: true + /muggle-string@0.3.1: + resolution: {integrity: sha512-ckmWDJjphvd/FvZawgygcUeQCxzvohjFO5RxTjj4eq8kw359gFF3E1brjfI+viLMxss5JrHTDRHZvu2/tuy0Qg==} + dev: true + /nanoid@3.3.7: resolution: {integrity: sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==} engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} @@ -4866,6 +5351,10 @@ packages: lines-and-columns: 1.2.4 dev: true + /path-browserify@1.0.1: + resolution: {integrity: sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==} + dev: true + /path-exists@4.0.0: resolution: {integrity: sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==} engines: {node: '>=8'} @@ -5419,6 +5908,10 @@ packages: engines: {node: '>=6'} dev: true + /trim-lines@3.0.1: + resolution: {integrity: sha512-kRj8B+YHZCc9kQYdWfJB2/oUl9rA99qbowYYBtr4ui4mZyAQ2JpvVBd/6U2YloATfqBhBTSMhTpgBHtU0Mf3Rg==} + dev: true + /ts-api-utils@1.0.3(typescript@5.3.3): resolution: {integrity: sha512-wNMeqtMz5NtwpT/UZGY5alT+VoKdSsOOP/kqHFcUW1P/VRhH2wJ48+DN2WwUliNbQ976ETwDL0Ifd2VVvgonvg==} engines: {node: '>=16.13.0'} @@ -5437,6 +5930,29 @@ packages: resolution: {integrity: sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==} dev: true + /twoslash-vue@0.1.0(typescript@5.3.3): + resolution: {integrity: sha512-4IVOdvQcjLY5KTrsR9GuTUAThhpYQqkkKawCtfUaTSkui3CXR2KPYBJMvY5yM1by+TkENBlW1ykLywP2BGukHg==} + peerDependencies: + typescript: '*' + dependencies: + '@vue/language-core': 1.8.27(typescript@5.3.3) + twoslash: 0.1.0(typescript@5.3.3) + typescript: 5.3.3 + transitivePeerDependencies: + - supports-color + dev: true + + /twoslash@0.1.0(typescript@5.3.3): + resolution: {integrity: sha512-zvDn23/FwNdi/i2xMTTDcn7xnX4iKlp6tJt68aD86zRqesQrb/HOnMBtaUu6+vme4gtlX9ScEfKYog1+7IPKSw==} + peerDependencies: + typescript: '*' + dependencies: + '@typescript/vfs': 1.5.0 + typescript: 5.3.3 + transitivePeerDependencies: + - supports-color + dev: true + /type-check@0.4.0: resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==} engines: {node: '>= 0.8.0'} @@ -5541,12 +6057,45 @@ packages: dev: true optional: true + /unist-util-is@6.0.0: + resolution: {integrity: sha512-2qCTHimwdxLfz+YzdGfkqNlH0tLi9xjTnHddPmJwtIG9MGsdbutfTc4P+haPD7l7Cjxf/WZj+we5qfVPvvxfYw==} + dependencies: + '@types/unist': 3.0.2 + dev: true + + /unist-util-position@5.0.0: + resolution: {integrity: sha512-fucsC7HjXvkB5R3kTCO7kUjRdrS0BJt3M/FPxmHMBOm8JQi2BsHAHFsy27E0EolP8rp0NzXsJ+jNPyDWvOJZPA==} + dependencies: + '@types/unist': 3.0.2 + dev: true + /unist-util-stringify-position@2.0.3: resolution: {integrity: sha512-3faScn5I+hy9VleOq/qNbAd6pAx7iH5jYBMS9I1HgQVijz/4mv5Bvw5iw1sC/90CODiKo81G/ps8AJrISn687g==} dependencies: '@types/unist': 2.0.10 dev: true + /unist-util-stringify-position@4.0.0: + resolution: {integrity: sha512-0ASV06AAoKCDkS2+xw5RXJywruurpbC4JZSm7nr7MOt1ojAzvyyaO+UxZf18j8FCF6kmzCZKcAgN/yu2gm2XgQ==} + dependencies: + '@types/unist': 3.0.2 + dev: true + + /unist-util-visit-parents@6.0.1: + resolution: {integrity: sha512-L/PqWzfTP9lzzEa6CKs0k2nARxTdZduw3zyh8d2NVBnsyvHjSX4TWse388YrrQKbvI8w20fGjGlhgT96WwKykw==} + dependencies: + '@types/unist': 3.0.2 + unist-util-is: 6.0.0 + dev: true + + /unist-util-visit@5.0.0: + resolution: {integrity: sha512-MR04uvD+07cwl/yhVuVWAtw+3GOR/knlL55Nd/wAdblk27GCVt3lqpTivy/tkJcZoNPzTwS1Y+KMojlLDhoTzg==} + dependencies: + '@types/unist': 3.0.2 + unist-util-is: 6.0.0 + unist-util-visit-parents: 6.0.1 + dev: true + /universalify@2.0.0: resolution: {integrity: sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==} engines: {node: '>= 10.0.0'} @@ -5740,6 +6289,21 @@ packages: spdx-expression-parse: 3.0.1 dev: true + /vfile-message@4.0.2: + resolution: {integrity: sha512-jRDZ1IMLttGj41KcZvlrYAaI3CfqpLpfpf+Mfig13viT6NKvRzWZ+lXz0Y5D60w6uJIBAOGq9mSHf0gktF0duw==} + dependencies: + '@types/unist': 3.0.2 + unist-util-stringify-position: 4.0.0 + dev: true + + /vfile@6.0.1: + resolution: {integrity: sha512-1bYqc7pt6NIADBJ98UiG0Bn/CHIVOoZ/IyEkqIruLg0mE1BKzkOXY2D6CSqQIcKqgadppE5lrxgWXJmXd7zZJw==} + dependencies: + '@types/unist': 3.0.2 + unist-util-stringify-position: 4.0.0 + vfile-message: 4.0.2 + dev: true + /vite-plugin-inspect@0.8.3(vite@3.2.8): resolution: {integrity: sha512-SBVzOIdP/kwe6hjkt7LSW4D0+REqqe58AumcnCfRNw4Kt3mbS9pEBkch+nupu2PBxv2tQi69EQHQ1ZA1vgB/Og==} engines: {node: '>=14'} @@ -5937,6 +6501,14 @@ packages: - supports-color dev: true + /vue-resize@2.0.0-alpha.1(vue@3.4.15): + resolution: {integrity: sha512-7+iqOueLU7uc9NrMfrzbG8hwMqchfVfSzpVlCMeJQe4pyibqyoifDNbKTZvwxZKDvGkB+PdFeKvnGZMoEb8esg==} + peerDependencies: + vue: ^3.0.0 + dependencies: + vue: 3.4.15(typescript@5.3.3) + dev: true + /vue-router@4.2.5(vue@3.4.15): resolution: {integrity: sha512-DIUpKcyg4+PTQKfFPX88UWhlagBEBEfJ5A8XDXRJLUnZOvcpMF8o/dnL90vpVkGaPbjvXazV/rC1qBKrZlFugw==} peerDependencies: @@ -5956,6 +6528,13 @@ packages: - typescript dev: true + /vue-template-compiler@2.7.16: + resolution: {integrity: sha512-AYbUWAJHLGGQM7+cNTELw+KsOG9nl2CnSv467WobS5Cv9uk3wFcnr1Etsz2sEIHEZvw1U+o9mRlEO6QbZvUPGQ==} + dependencies: + de-indent: 1.0.2 + he: 1.2.0 + dev: true + /vue@3.4.15(typescript@5.3.3): resolution: {integrity: sha512-jC0GH4KkWLWJOEQjOpkqU1bQsBwf4R1rsFtw5GQJbjHVKWDzO6P0nWWBTmjp1xSemAioDFj1jdaK1qa3DnMQoQ==} peerDependencies: @@ -6066,3 +6645,7 @@ packages: resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==} engines: {node: '>=10'} dev: true + + /zwitch@2.0.4: + resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==} + dev: true diff --git a/resources/learning.md b/resources/learning.md index cfa4cab..614872d 100644 --- a/resources/learning.md +++ b/resources/learning.md @@ -4,7 +4,7 @@ ### Videos - + ### Articles diff --git a/themes/write-a-theme.md b/themes/write-a-theme.md index 08ee0fe..5e79af9 100644 --- a/themes/write-a-theme.md +++ b/themes/write-a-theme.md @@ -118,7 +118,7 @@ Slidev toggles a `dark` class on the page's `html` element for switching color s ### Highlighter -Syntax highlighting colors are also provided in the theme. We support both [Prism](https://prismjs.com/), [Shiki](https://github.com/shikijs/shiki) and [Shikiji](https://github.com/antfu/shikiji). For more information please refer to [the syntax highlighting docs](/custom/highlighters). +Syntax highlighting colors are also provided in the theme. We support both [Prism](https://prismjs.com/), [Shiki](https://github.com/shikijs/shiki). For more information please refer to [the syntax highlighting docs](/custom/highlighters). You can support either one of them, or both. Refer to the default theme for configurations examples [`./styles/code.css`](https://github.com/slidevjs/slidev/blob/main/packages/create-theme/template/styles/code.css) / [`./setup/shiki.ts`](https://github.com/slidevjs/slidev/blob/main/packages/create-theme/template/setup/shiki.ts). From 6733ad9849abeb71c82213da07b3fc1e1b995b73 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Fri, 2 Feb 2024 21:32:06 +0100 Subject: [PATCH 121/211] chore: update --- components.d.ts | 6 ------ 1 file changed, 6 deletions(-) diff --git a/components.d.ts b/components.d.ts index 0b36d01..10dffc6 100644 --- a/components.d.ts +++ b/components.d.ts @@ -12,9 +12,6 @@ declare module 'vue' { ArrowRight: typeof import('./.vitepress/theme/components/icons/ArrowRight.vue')['default'] AutoFitText: typeof import('./.vitepress/@slidev/client/builtin/AutoFitText.vue')['default'] BooleanDisplay: typeof import('./.vitepress/theme/components/BooleanDisplay.vue')['default'] - 'Carbon:chevronLeft': typeof import('~icons/carbon/chevron-left')['default'] - 'Carbon:chevronRight': typeof import('~icons/carbon/chevron-right')['default'] - 'Carbon:logoTwitter': typeof import('~icons/carbon/logo-twitter')['default'] CarbonApps: typeof import('~icons/carbon/apps')['default'] CarbonArrowLeft: typeof import('~icons/carbon/arrow-left')['default'] CarbonArrowRight: typeof import('~icons/carbon/arrow-right')['default'] @@ -38,7 +35,6 @@ declare module 'vue' { DemoEditor: typeof import('./.vitepress/theme/components/demo/DemoEditor.vue')['default'] DemoSlide: typeof import('./.vitepress/theme/components/demo/DemoSlide.vue')['default'] Environment: typeof import('./.vitepress/theme/components/Environment.vue')['default'] - HomeFeatures: typeof import('./.vitepress/theme/components/HomeFeatures.vue')['default'] Link: typeof import('./.vitepress/@slidev/client/builtin/Link.vue')['default'] LogosVue: typeof import('~icons/logos/vue')['default'] MdiAccountCircle: typeof import('~icons/mdi/account-circle')['default'] @@ -53,8 +49,6 @@ declare module 'vue' { RouterView: typeof import('vue-router')['RouterView'] ShowCaseInfo: typeof import('./.vitepress/theme/components/ShowCaseInfo.vue')['default'] ShowCases: typeof import('./.vitepress/theme/components/ShowCases.vue')['default'] - SimpleIconsGithub: typeof import('~icons/simple-icons/github')['default'] - SimpleIconsNpm: typeof import('~icons/simple-icons/npm')['default'] SlideCurrentNo: typeof import('./.vitepress/@slidev/client/builtin/SlideCurrentNo.vue')['default'] SlidesTotal: typeof import('./.vitepress/@slidev/client/builtin/SlidesTotal.vue')['default'] Starport: typeof import('vue-starport')['Starport'] From 0a3ecb18a203289747bc5c18fb332402a4a8e393 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Fri, 2 Feb 2024 21:40:28 +0100 Subject: [PATCH 122/211] chore: update --- .vitepress/theme/components/demo/DemoEditor.vue | 12 +++++++----- .vitepress/theme/styles/vars.css | 1 + components.d.ts | 2 ++ netlify.toml | 2 +- 4 files changed, 11 insertions(+), 6 deletions(-) diff --git a/.vitepress/theme/components/demo/DemoEditor.vue b/.vitepress/theme/components/demo/DemoEditor.vue index 0d685f6..51e8aee 100644 --- a/.vitepress/theme/components/demo/DemoEditor.vue +++ b/.vitepress/theme/components/demo/DemoEditor.vue @@ -1,11 +1,11 @@ - From 36a1b5a39b047328e5666ec04c57c77e21277408 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Fri, 2 Feb 2024 22:36:53 +0100 Subject: [PATCH 124/211] chore: fix netlify --- netlify.toml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/netlify.toml b/netlify.toml index 6174c77..56736cf 100755 --- a/netlify.toml +++ b/netlify.toml @@ -3,7 +3,7 @@ publish = ".vitepress/dist" command = "pnpm run build" [build.environment] -NODE_VERSION = 20 +NODE_VERSION = "20" PLAYWRIGHT_BROWSERS_PATH = "0" [[redirects]] From b41368d064b797a78bad162df3a02793b4b8e8ef Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Fri, 2 Feb 2024 22:56:25 +0100 Subject: [PATCH 125/211] chore: update --- .vitepress/theme/components/{demo => }/Demo.vue | 0 .vitepress/theme/components/{demo => }/DemoEditor.vue | 0 .vitepress/theme/components/{demo => }/DemoSlide.vue | 0 3 files changed, 0 insertions(+), 0 deletions(-) rename .vitepress/theme/components/{demo => }/Demo.vue (100%) rename .vitepress/theme/components/{demo => }/DemoEditor.vue (100%) rename .vitepress/theme/components/{demo => }/DemoSlide.vue (100%) diff --git a/.vitepress/theme/components/demo/Demo.vue b/.vitepress/theme/components/Demo.vue similarity index 100% rename from .vitepress/theme/components/demo/Demo.vue rename to .vitepress/theme/components/Demo.vue diff --git a/.vitepress/theme/components/demo/DemoEditor.vue b/.vitepress/theme/components/DemoEditor.vue similarity index 100% rename from .vitepress/theme/components/demo/DemoEditor.vue rename to .vitepress/theme/components/DemoEditor.vue diff --git a/.vitepress/theme/components/demo/DemoSlide.vue b/.vitepress/theme/components/DemoSlide.vue similarity index 100% rename from .vitepress/theme/components/demo/DemoSlide.vue rename to .vitepress/theme/components/DemoSlide.vue From 79a4d453cf7d626368487ec247f6becebd0a20d5 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Fri, 2 Feb 2024 23:11:01 +0100 Subject: [PATCH 126/211] chore: fix demo style --- .vitepress/config.ts | 1 + .vitepress/theme/Layout.vue | 138 ------------------ .vitepress/theme/NotFound.vue | 23 --- .../theme/components/BooleanDisplay.vue | 25 ---- .../theme/components/DarkModeSwitch.vue | 13 -- .vitepress/theme/components/Demo.vue | 3 + .vitepress/theme/components/DemoContainer.vue | 18 --- .vitepress/theme/components/LandingPage.vue | 24 +++ .../components/{Tweet.vue => TheTweet.vue} | 2 +- .../theme/components/ToggleSideBarButton.vue | 46 ------ .../theme/components/icons/ArrowLeft.vue | 5 - .../theme/components/icons/ArrowRight.vue | 5 - .vitepress/theme/components/icons/Moon.vue | 8 - .../theme/components/icons/OutboundLink.vue | 31 ---- .vitepress/theme/components/icons/README.md | 1 - .vitepress/theme/components/icons/Sun.vue | 28 ---- .vitepress/theme/config.ts | 128 ---------------- .vitepress/theme/support/sideBar.ts | 67 --------- .vitepress/theme/utils.ts | 77 ---------- components.d.ts | 20 +-- guide/drawing.md | 2 +- guide/editors.md | 2 +- guide/recording.md | 2 +- guide/syntax.md | 2 +- index.md | 34 +---- 25 files changed, 40 insertions(+), 665 deletions(-) delete mode 100644 .vitepress/theme/Layout.vue delete mode 100644 .vitepress/theme/NotFound.vue delete mode 100644 .vitepress/theme/components/BooleanDisplay.vue delete mode 100644 .vitepress/theme/components/DarkModeSwitch.vue delete mode 100644 .vitepress/theme/components/DemoContainer.vue create mode 100644 .vitepress/theme/components/LandingPage.vue rename .vitepress/theme/components/{Tweet.vue => TheTweet.vue} (98%) delete mode 100644 .vitepress/theme/components/ToggleSideBarButton.vue delete mode 100644 .vitepress/theme/components/icons/ArrowLeft.vue delete mode 100644 .vitepress/theme/components/icons/ArrowRight.vue delete mode 100644 .vitepress/theme/components/icons/Moon.vue delete mode 100644 .vitepress/theme/components/icons/OutboundLink.vue delete mode 100644 .vitepress/theme/components/icons/README.md delete mode 100644 .vitepress/theme/components/icons/Sun.vue delete mode 100644 .vitepress/theme/config.ts delete mode 100644 .vitepress/theme/support/sideBar.ts delete mode 100644 .vitepress/theme/utils.ts diff --git a/.vitepress/config.ts b/.vitepress/config.ts index feffd36..8c5d9e1 100644 --- a/.vitepress/config.ts +++ b/.vitepress/config.ts @@ -1,6 +1,7 @@ import type { DefaultTheme } from 'vitepress' import { defineConfig } from 'vitepress' import { transformerTwoslash } from '@shikijs/vitepress-twoslash' +import vite from '../vite.config' const CURRENT_VERSION = '0.47.1' diff --git a/.vitepress/theme/Layout.vue b/.vitepress/theme/Layout.vue deleted file mode 100644 index 098f608..0000000 --- a/.vitepress/theme/Layout.vue +++ /dev/null @@ -1,138 +0,0 @@ - - - diff --git a/.vitepress/theme/NotFound.vue b/.vitepress/theme/NotFound.vue deleted file mode 100644 index bfaacb6..0000000 --- a/.vitepress/theme/NotFound.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/.vitepress/theme/components/BooleanDisplay.vue b/.vitepress/theme/components/BooleanDisplay.vue deleted file mode 100644 index d51afbc..0000000 --- a/.vitepress/theme/components/BooleanDisplay.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/.vitepress/theme/components/DarkModeSwitch.vue b/.vitepress/theme/components/DarkModeSwitch.vue deleted file mode 100644 index 3e1c70b..0000000 --- a/.vitepress/theme/components/DarkModeSwitch.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/.vitepress/theme/components/Demo.vue b/.vitepress/theme/components/Demo.vue index 1d1d41c..0c3d0eb 100644 --- a/.vitepress/theme/components/Demo.vue +++ b/.vitepress/theme/components/Demo.vue @@ -15,6 +15,9 @@ import SlideContainer from '@slidev/client/internals/SlideContainer.vue' import '@slidev/client/styles/layouts-base.css' import '@slidev/theme-default/styles/layouts.css' +import DemoEditor from './DemoEditor.vue' +import DemoSlide from './DemoSlide.vue' + const page = ref(0) const paused = ref(false) const code = ref('') diff --git a/.vitepress/theme/components/DemoContainer.vue b/.vitepress/theme/components/DemoContainer.vue deleted file mode 100644 index 1ea93e1..0000000 --- a/.vitepress/theme/components/DemoContainer.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/.vitepress/theme/components/LandingPage.vue b/.vitepress/theme/components/LandingPage.vue new file mode 100644 index 0000000..1a60abf --- /dev/null +++ b/.vitepress/theme/components/LandingPage.vue @@ -0,0 +1,24 @@ + diff --git a/.vitepress/theme/components/Tweet.vue b/.vitepress/theme/components/TheTweet.vue similarity index 98% rename from .vitepress/theme/components/Tweet.vue rename to .vitepress/theme/components/TheTweet.vue index af64870..9bf610e 100644 --- a/.vitepress/theme/components/Tweet.vue +++ b/.vitepress/theme/components/TheTweet.vue @@ -3,7 +3,7 @@ A simple wrapper for embedded Tweet Usage: - + --> - - - - diff --git a/.vitepress/theme/components/icons/ArrowLeft.vue b/.vitepress/theme/components/icons/ArrowLeft.vue deleted file mode 100644 index 3f64f1a..0000000 --- a/.vitepress/theme/components/icons/ArrowLeft.vue +++ /dev/null @@ -1,5 +0,0 @@ - diff --git a/.vitepress/theme/components/icons/ArrowRight.vue b/.vitepress/theme/components/icons/ArrowRight.vue deleted file mode 100644 index 19d2186..0000000 --- a/.vitepress/theme/components/icons/ArrowRight.vue +++ /dev/null @@ -1,5 +0,0 @@ - diff --git a/.vitepress/theme/components/icons/Moon.vue b/.vitepress/theme/components/icons/Moon.vue deleted file mode 100644 index 69567db..0000000 --- a/.vitepress/theme/components/icons/Moon.vue +++ /dev/null @@ -1,8 +0,0 @@ - diff --git a/.vitepress/theme/components/icons/OutboundLink.vue b/.vitepress/theme/components/icons/OutboundLink.vue deleted file mode 100644 index 4d74eee..0000000 --- a/.vitepress/theme/components/icons/OutboundLink.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/.vitepress/theme/components/icons/README.md b/.vitepress/theme/components/icons/README.md deleted file mode 100644 index 58b1801..0000000 --- a/.vitepress/theme/components/icons/README.md +++ /dev/null @@ -1 +0,0 @@ -Download from https://icones.js.org/collection/carbon diff --git a/.vitepress/theme/components/icons/Sun.vue b/.vitepress/theme/components/icons/Sun.vue deleted file mode 100644 index 9cd6bdf..0000000 --- a/.vitepress/theme/components/icons/Sun.vue +++ /dev/null @@ -1,28 +0,0 @@ - diff --git a/.vitepress/theme/config.ts b/.vitepress/theme/config.ts deleted file mode 100644 index 3139fb5..0000000 --- a/.vitepress/theme/config.ts +++ /dev/null @@ -1,128 +0,0 @@ -/* eslint-disable @typescript-eslint/no-namespace */ - -export namespace DefaultTheme { - export interface Config { - logo?: string - nav?: NavItem[] | false - sidebar?: SideBarConfig | MultiSideBarConfig - - /** - * GitHub repository following the format /. - * - * @example `"vuejs/vue-next"` - */ - repo?: string - - /** - * Customize the header label. Defaults to GitHub/Gitlab/Bitbucket - * depending on the provided repo. - * - * @exampe `"Contribute!"` - */ - repoLabel?: string - - /** - * If your docs are in a different repository from your main project. - * - * @example `"vuejs/docs-next"` - */ - docsRepo?: string - - /** - * If your docs are not at the root of the repo. - * - * @example `"docs"` - */ - docsDir?: string - - /** - * If your docs are in a different branch. Defaults to `main`. - * - * @example `"next"` - */ - docsBranch?: string - - /** - * Enable links to edit pages at the bottom of the page. - */ - editLinks?: boolean - - /** - * Custom text for edit link. Defaults to "Edit this page". - */ - editLinkText?: string - - /** - * Show last updated time at the bottom of the page. Defaults to `false`. - * If given a string, it will be displayed as a prefix (default value: - * "Last Updated"). - */ - lastUpdated?: string | boolean - - prevLinks?: boolean - nextLinks?: boolean - - locales?: Record> - } - - // navbar -------------------------------------------------------------------- - - export type NavItem = NavItemWithLink | NavItemWithChildren - - export interface NavItemBase { - text: string - target?: string - rel?: string - ariaLabel?: string - activeMatch?: string - } - - export interface NavItemWithLink extends NavItemBase { - link: string - } - - export interface NavItemWithChildren extends NavItemBase { - items: NavItemWithLink[] - } - - // sidebar ------------------------------------------------------------------- - - export type SideBarConfig = SideBarItem[] | 'auto' | false - - export interface MultiSideBarConfig { - [path: string]: SideBarConfig - } - - export type SideBarItem = SideBarLink | SideBarGroup - - export interface SideBarLink { - text: string - link: string - } - - export interface SideBarGroup { - text: string - link?: string - - /** - * @default false - */ - collapsable?: boolean - - children: SideBarItem[] - } - - // locales ------------------------------------------------------------------- - - export interface LocaleConfig { - /** - * Text for the language dropdown. - */ - selectText?: string - - /** - * Label for this locale in the language dropdown. - */ - label?: string - } -} diff --git a/.vitepress/theme/support/sideBar.ts b/.vitepress/theme/support/sideBar.ts deleted file mode 100644 index ccd068f..0000000 --- a/.vitepress/theme/support/sideBar.ts +++ /dev/null @@ -1,67 +0,0 @@ -import type { DefaultTheme } from '../config' -import { - ensureSlash, - ensureStartingSlash, - isArray, - removeExtension, -} from '../utils' - -export function isSideBarConfig( - sidebar: DefaultTheme.SideBarConfig | DefaultTheme.MultiSideBarConfig, -): sidebar is DefaultTheme.SideBarConfig { - return sidebar === false || sidebar === 'auto' || isArray(sidebar) -} - -export function isSideBarGroup( - item: DefaultTheme.SideBarItem, -): item is DefaultTheme.SideBarGroup { - return (item as DefaultTheme.SideBarGroup).children !== undefined -} - -/** - * Get the `SideBarConfig` from sidebar option. This method will ensure to get - * correct sidebar config from `MultiSideBarConfig` with various path - * combinations such as matching `guide/` and `/guide/`. If no matching config - * was found, it will return `auto` as a fallback. - */ -export function getSideBarConfig( - sidebar: DefaultTheme.SideBarConfig | DefaultTheme.MultiSideBarConfig, - path: string, -): DefaultTheme.SideBarConfig { - if (isSideBarConfig(sidebar)) - return sidebar - - // get the very first segment of the path to compare with nulti sidebar keys - // and make sure it's surrounded by slash - path = removeExtension(path) - path = ensureStartingSlash(path).split('/')[1] || '/' - path = ensureSlash(path) - - for (const dir of Object.keys(sidebar)) { - // make sure the multi sidebar key is surrounded by slash too - if (path === ensureSlash(dir)) - return sidebar[dir] - } - - return 'auto' -} - -/** - * Get flat sidebar links from the sidebar items. This method is useful for - * creating the "next and prev link" feature. It will ignore any items that - * don't have `link` property and removes `.md` or `.html` extension if a - * link contains it. - */ -export function getFlatSideBarLinks( - sidebar: DefaultTheme.SideBarItem[], -): DefaultTheme.SideBarLink[] { - return sidebar.reduce((links, item) => { - if (item.link) - links.push({ text: item.text, link: removeExtension(item.link) }) - - if (isSideBarGroup(item)) - links = [...links, ...getFlatSideBarLinks(item.children)] - - return links - }, []) -} diff --git a/.vitepress/theme/utils.ts b/.vitepress/theme/utils.ts deleted file mode 100644 index 6e985af..0000000 --- a/.vitepress/theme/utils.ts +++ /dev/null @@ -1,77 +0,0 @@ -export const hashRE = /#.*$/ -export const extRE = /(index)?\.(md|html)$/ -export const endingSlashRE = /\/$/ -export const outboundRE = /^[a-z]+:/i - -export function isNullish(value: any): value is null | undefined { - return value === null || value === undefined -} - -export function isArray(value: any): value is any[] { - return Array.isArray(value) -} - -export function isExternal(path: string): boolean { - return outboundRE.test(path) -} - -export function isActive(route: any, path?: string): boolean { - if (path === undefined) - return false - - const routePath = normalize(route.path) - const pagePath = normalize(path) - - return routePath === pagePath -} - -export function normalize(path: string): string { - return decodeURI(path).replace(hashRE, '').replace(extRE, '') -} - -export function joinUrl(base: string, path: string): string { - const baseEndsWithSlash = base.endsWith('/') - const pathStartsWithSlash = path.startsWith('/') - - if (baseEndsWithSlash && pathStartsWithSlash) - return base.slice(0, -1) + path - - if (!baseEndsWithSlash && !pathStartsWithSlash) - return `${base}/${path}` - - return base + path -} - -/** - * get the path without filename (the last segment). for example, if the given - * path is `/guide/getting-started.html`, this method will return `/guide/`. - * Always with a trailing slash. - */ -export function getPathDirName(path: string): string { - const segments = path.split('/') - - if (segments[segments.length - 1]) - segments.pop() - - return ensureEndingSlash(segments.join('/')) -} - -export function ensureSlash(path: string): string { - return ensureEndingSlash(ensureStartingSlash(path)) -} - -export function ensureStartingSlash(path: string): string { - return /^\//.test(path) ? path : `/${path}` -} - -export function ensureEndingSlash(path: string): string { - return /(\.html|\/)$/.test(path) ? path : `${path}/` -} - -/** - * Remove `.md` or `.html` extension from the given path. It also converts - * `index` to slush. - */ -export function removeExtension(path: string): string { - return path.replace(/(index)?(\.(md|html))?$/, '') || '/' -} diff --git a/components.d.ts b/components.d.ts index 8bb786d..b34c1cc 100644 --- a/components.d.ts +++ b/components.d.ts @@ -8,10 +8,7 @@ export {} declare module 'vue' { export interface GlobalComponents { Arrow: typeof import('./.vitepress/@slidev/client/builtin/Arrow.vue')['default'] - ArrowLeft: typeof import('./.vitepress/theme/components/icons/ArrowLeft.vue')['default'] - ArrowRight: typeof import('./.vitepress/theme/components/icons/ArrowRight.vue')['default'] AutoFitText: typeof import('./.vitepress/@slidev/client/builtin/AutoFitText.vue')['default'] - BooleanDisplay: typeof import('./.vitepress/theme/components/BooleanDisplay.vue')['default'] 'Carbon:chevronLeft': typeof import('~icons/carbon/chevron-left')['default'] 'Carbon:chevronRight': typeof import('~icons/carbon/chevron-right')['default'] CarbonApps: typeof import('~icons/carbon/apps')['default'] @@ -31,21 +28,17 @@ declare module 'vue' { CarbonUserSpeaker: typeof import('~icons/carbon/user-speaker')['default'] CarbonVideo: typeof import('~icons/carbon/video')['default'] CodeBlockWrapper: typeof import('./.vitepress/@slidev/client/builtin/CodeBlockWrapper.vue')['default'] - DarkModeSwitch: typeof import('./.vitepress/theme/components/DarkModeSwitch.vue')['default'] - Demo: typeof import('./.vitepress/theme/components/demo/Demo.vue')['default'] - DemoContainer: typeof import('./.vitepress/theme/components/DemoContainer.vue')['default'] - DemoEditor: typeof import('./.vitepress/theme/components/demo/DemoEditor.vue')['default'] - DemoSlide: typeof import('./.vitepress/theme/components/demo/DemoSlide.vue')['default'] + Demo: typeof import('./.vitepress/theme/components/Demo.vue')['default'] + DemoEditor: typeof import('./.vitepress/theme/components/DemoEditor.vue')['default'] + DemoSlide: typeof import('./.vitepress/theme/components/DemoSlide.vue')['default'] Environment: typeof import('./.vitepress/theme/components/Environment.vue')['default'] + LandingPage: typeof import('./.vitepress/theme/components/LandingPage.vue')['default'] Link: typeof import('./.vitepress/@slidev/client/builtin/Link.vue')['default'] LogosVue: typeof import('~icons/logos/vue')['default'] MdiAccountCircle: typeof import('~icons/mdi/account-circle')['default'] Mermaid: typeof import('./.vitepress/@slidev/client/builtin/Mermaid.vue')['default'] Monaco: typeof import('./.vitepress/@slidev/client/builtin/Monaco.vue')['default'] - Moon: typeof import('./.vitepress/theme/components/icons/Moon.vue')['default'] - OutboundLink: typeof import('./.vitepress/theme/components/icons/OutboundLink.vue')['default'] PlantUml: typeof import('./.vitepress/@slidev/client/builtin/PlantUml.vue')['default'] - README: typeof import('./.vitepress/theme/components/icons/README.md')['default'] RenderWhen: typeof import('./.vitepress/@slidev/client/builtin/RenderWhen.vue')['default'] RouterLink: typeof import('vue-router')['RouterLink'] RouterView: typeof import('vue-router')['RouterView'] @@ -55,14 +48,13 @@ declare module 'vue' { SlidesTotal: typeof import('./.vitepress/@slidev/client/builtin/SlidesTotal.vue')['default'] Starport: typeof import('vue-starport')['Starport'] StarportCarrier: typeof import('vue-starport')['StarportCarrier'] - Sun: typeof import('./.vitepress/theme/components/icons/Sun.vue')['default'] ThemeGallery: typeof import('./.vitepress/theme/components/ThemeGallery.vue')['default'] ThemeInfo: typeof import('./.vitepress/theme/components/ThemeInfo.vue')['default'] + TheTweet: typeof import('./.vitepress/theme/components/TheTweet.vue')['default'] Toc: typeof import('./.vitepress/@slidev/client/builtin/Toc.vue')['default'] TocList: typeof import('./.vitepress/@slidev/client/builtin/TocList.vue')['default'] - ToggleSideBarButton: typeof import('./.vitepress/theme/components/ToggleSideBarButton.vue')['default'] Transform: typeof import('./.vitepress/@slidev/client/builtin/Transform.vue')['default'] - Tweet: typeof import('./.vitepress/theme/components/Tweet.vue')['default'] + Tweet: typeof import('./.vitepress/@slidev/client/builtin/Tweet.vue')['default'] TwemojiCatWithTearsOfJoy: typeof import('~icons/twemoji/cat-with-tears-of-joy')['default'] UimRocket: typeof import('~icons/uim/rocket')['default'] Youtube: typeof import('./.vitepress/@slidev/client/builtin/Youtube.vue')['default'] diff --git a/guide/drawing.md b/guide/drawing.md index 382da1e..24f7a60 100644 --- a/guide/drawing.md +++ b/guide/drawing.md @@ -6,7 +6,7 @@ We have [drauu](https://github.com/antfu/drauu) built-in for drawing and annotat To start, click the icon in the toolbar and start drawing. It's also available in the [Presenter Mode](/guide/presenter-mode). Drawings and annotations you created will be **synced up** automatically across all instances in real-time. - + ## Use with Stylus Pen diff --git a/guide/editors.md b/guide/editors.md index 3e92209..c9700e4 100644 --- a/guide/editors.md +++ b/guide/editors.md @@ -40,4 +40,4 @@ The VS Code extension provides some features to help you better organize your sl ![](https://user-images.githubusercontent.com/11247099/116809994-cc2caa00-ab73-11eb-879f-60585747c3c9.png) - + diff --git a/guide/recording.md b/guide/recording.md index 5b28b06..3a81163 100644 --- a/guide/recording.md +++ b/guide/recording.md @@ -6,7 +6,7 @@ Slidev has a built-in recording and camera view. You can use them to record your Click the button in the navigation panel to show your camera view in the presentation. You can drag to move it, and use the handler on the right bottom corner to resize it. The size and position will persist in `localStorage` and will therefore be consistent across multiple refreshes, so no need to worry about that. - + ## Recording diff --git a/guide/syntax.md b/guide/syntax.md index 65df553..a1335ec 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -497,7 +497,7 @@ Learn more about [frontmatter configurations](/custom/#frontmatter-configures). Slidev comes with LaTeX support out-of-box, powered by [KaTeX](https://katex.org/). - + ### Inline diff --git a/index.md b/index.md index 72fc3e4..70a3a9d 100644 --- a/index.md +++ b/index.md @@ -1,37 +1,5 @@ --- layout: home - -# hero: -# name: Slidev -# text: For Developers -# tagline: Presentation Slides for Developers -# image: -# src: /logo.svg -# alt: Slidev -# actions: -# - theme: brand -# text: Get Started -# link: /guide/ -# - theme: alt -# text: Why -# link: /guide/why --- -
-
-

Slidev

- Slidev -

Presentation Slides for Developers

- -
-
-
- - - -
-
-
+ From f6bcb597777955c1bfc329d6f0ea11d06e77d8d9 Mon Sep 17 00:00:00 2001 From: Julien Deniau <1398469+jdeniau@users.noreply.github.com> Date: Sun, 4 Feb 2024 19:57:20 +0100 Subject: [PATCH 127/211] docs: layout image: add backgroundSize doc (#164) --- builtin/layouts.md | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/builtin/layouts.md b/builtin/layouts.md index b3aac08..01c942d 100644 --- a/builtin/layouts.md +++ b/builtin/layouts.md @@ -79,6 +79,25 @@ image: ./path/to/the/image --- ``` +You can change the default background size (`cover`) by adding the `backgroundSize` attribute: + +```yaml +--- +layout: image +image: ./path/to/the/image +backgroundSize: contain +--- +``` + +```yaml +--- +layout: image-left +image: ./path/to/the/image +backgroundSize: 20em 70% +--- +``` + + ### `iframe-left` Shows a web page on the left side of the screen, the content will be placed on the right side. From 9bbccbb1bd2d1d93f3d376ed06c73986710dd518 Mon Sep 17 00:00:00 2001 From: George <31376482+george-gca@users.noreply.github.com> Date: Sun, 4 Feb 2024 20:03:07 -0300 Subject: [PATCH 128/211] docs: updated GitHub actions versions on hosting.md (#163) --- guide/hosting.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/guide/hosting.md b/guide/hosting.md index 6f7b738..e373669 100644 --- a/guide/hosting.md +++ b/guide/hosting.md @@ -169,9 +169,9 @@ jobs: url: ${{ steps.deployment.outputs.page_url }} steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 - - uses: actions/setup-node@v3 + - uses: actions/setup-node@v4 with: node-version: 'lts/*' @@ -181,15 +181,15 @@ jobs: - name: Build run: npm run build -- --base // - - uses: actions/configure-pages@v3 + - uses: actions/configure-pages@v4 - - uses: actions/upload-pages-artifact@v1 + - uses: actions/upload-pages-artifact@v3 with: path: dist - name: Deploy id: deployment - uses: actions/deploy-pages@v2 + uses: actions/deploy-pages@v4 ``` - In your repository, go to Settings>Pages. Under "Build and deployment", select "Github Actions". - Finally, after all workflows are executed, a link to the slides should appear under Settings>Pages. From e52d01f8924fc2746acb41ca2510db795a7b0c4a Mon Sep 17 00:00:00 2001 From: Ethan Niser <100045248+ethanniser@users.noreply.github.com> Date: Tue, 6 Feb 2024 03:39:12 -0600 Subject: [PATCH 129/211] docs: add 'cards' prop in Tweet component (#166) --- builtin/components.md | 1 + 1 file changed, 1 insertion(+) diff --git a/builtin/components.md b/builtin/components.md index be2a9c8..35cbc0b 100644 --- a/builtin/components.md +++ b/builtin/components.md @@ -241,6 +241,7 @@ Parameters: * `id` (`number | string`, required): id of the tweet * `scale` (`number | string`, default `1`): transform scale value * `conversation` (`string`, default `'none'`): [tweet embed parameter](https://developer.twitter.com/en/docs/twitter-for-websites/embedded-tweets/guides/embedded-tweet-parameter-reference) +* `cards` (`'hidden' | 'visible'`, default `'visible'`): [tweet embed parameter](https://developer.twitter.com/en/docs/twitter-for-websites/embedded-tweets/guides/embedded-tweet-parameter-reference) ### `VAfter`, `VClick` and `VClicks` From 2ff459093d432ffb43fa5738d207017ad78a7b38 Mon Sep 17 00:00:00 2001 From: _Kerman Date: Sun, 11 Feb 2024 22:09:25 +0800 Subject: [PATCH 130/211] fix: components not found (#165) (#167) --- vite.config.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/vite.config.ts b/vite.config.ts index 88feddb..eba4341 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -33,9 +33,7 @@ export default defineConfig({ './.vitepress/@slidev/client/builtin', ], extensions: ['vue', 'md'], - include: [ - /\.(vue|md)$/, - ], + include: [/\.vue$/, /\.vue\?vue/, /\.md$/], resolvers: [ IconsResolver({ prefix: '', From dbfb0168dc2a10c37d04f991ec135a402b411f02 Mon Sep 17 00:00:00 2001 From: Bogdan Cerovac Date: Sun, 11 Feb 2024 15:31:54 +0100 Subject: [PATCH 131/211] docs: added info about the possibility to start YouTube video at specific time (#168) --- builtin/components.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/builtin/components.md b/builtin/components.md index 35cbc0b..7e333f1 100644 --- a/builtin/components.md +++ b/builtin/components.md @@ -262,6 +262,8 @@ Parameters: * `width` (`number`): width of the video * `height` (`number`): height of the video +You can also make the video start at specific time if you add `?start=1234` to the id value (where 1234 are seconds), + ## Custom Components Create a directory `components/` under your project root, and simply put your custom Vue components under it, then you can use it with the same name in your markdown file! From 178a989f589711edd18c5f67699e14917e0fae0b Mon Sep 17 00:00:00 2001 From: _Kerman Date: Thu, 15 Feb 2024 16:55:30 +0800 Subject: [PATCH 132/211] docs: update docs about click animations (#169) Co-authored-by: Anthony Fu --- guide/animations.md | 181 ++++++++++++++++++++++++++++++++------------ guide/syntax.md | 49 ++++-------- 2 files changed, 144 insertions(+), 86 deletions(-) diff --git a/guide/animations.md b/guide/animations.md index a00268a..393b761 100644 --- a/guide/animations.md +++ b/guide/animations.md @@ -1,51 +1,59 @@ +--- +outline: deep +--- + # Animations ## Click Animations +> [!NOTE] +> Since v0.48.0, we are rewritten the click animations system with much more consistent behaviors. It might change the behaviors of your existing slides in edge cases. While this page is showing the new click system, you can find more details about the refactor in [#1279](https://github.com/slidevjs/slidev/pull/1279). + ### `v-click` To apply "click animations" for elements, you can use the `v-click` directive or `` components ```md -# Hello - - - - -Hello World - - - - -
+ + Hello **World** -Hey! - -
+ +
Hey!
``` ### `v-after` -The usage of `v-after` is similar to `v-click` but it will turn the element visible when the previous `v-click` is triggered. +`v-after` is only provided as a directive. It will turn the element visible when the previous `v-click` is triggered. ```md -
Hello
-
World
+
Hello
+
World
``` -When you click the "next" button, both `Hello` and `World` will show up together. +When you press "next", both `Hello` and `World` will show up together. -### `v-click-hide` +### Hide after clicking -Same as `v-click` but instead of making the element appear, it makes the element invisible after clicking. +Add a `.hide` modifier to `v-click` or `v-after` to make the element invisible after clicking, instead of showing up. ```md -
Hello
+
Visible after 1 click
+
Hidden after 2 click
+
Hidden after 2 click
+``` + +For `v-click` component, you can use the `hide` prop to achieve the same effect: + +```md + Visible after 1 click + Hidden after 2 click ``` ### `v-clicks` -`v-clicks` is only provided as a component. It's a shorthand to apply the `v-click` directive to all its child elements. It is especially useful when working with lists. +`v-clicks` is only provided as a component. It's a shorthand to apply the `v-click` directive to all its child elements. It is especially useful when working with lists and tables. ```md @@ -53,14 +61,12 @@ Same as `v-click` but instead of making the element appear, it makes the element - Item 1 - Item 2 - Item 3 -- Item 4 ``` An item will become visible each time you click "next". - -It accepts a `depth` props for nested list: +It accepts a `depth` prop for nested list: ```md @@ -75,44 +81,108 @@ It accepts a `depth` props for nested list: ``` -### Custom Clicks Count +Also, you can use the `every` prop to specify the number of items to show after each click: -By default, Slidev counts how many steps are needed before going to the next slide. You can override this setting by passing the `clicks` frontmatter option: +```md + -```yaml ---- -# 10 clicks in this slide, before going to the next -clicks: 10 ---- +- Item 1 (part 1) +- Item 1 (part 2) +- Item 2 (part 1) +- Item 2 (part 2) + + ``` -### Ordering +### Positioning -Passing the click index to your directives, you can customize the order of the revealing +By default, the clicking animations take place one by one. You can customize the animation position of elements by using the `at` prop or the `v-click` directive with value. -```md -
1
-
2
-
3
+Like the CSS layout system, click-animated elements can be "relative" or "absolute": + +#### Relative Position + +This actual position of relative elements are calculated based on the previous relative elements: + +~~~md +
visible after 1 click
+
visible after 3 clicks
+
hidden after 2 clicks
+ +```js {none|1|2}{at:'+5'} +1 // highlighted after 7 clicks +2 // highlighted after 8 clicks ``` +~~~ + +> [!NOTE] +> The default value of `v-click` is `'+1'` when you don't specify it. + +In fact, `v-after` are just shortcuts for `v-click` with `at` prop: ```md - -
1
-
2
-
3
+ + + + + + + + ``` -```md ---- -clicks: 3 ---- +:::info +Only string values start with `'+'` or `'-'` like `'+1'` are treated as relative positions: - - -
Hi
- +| Value | Kind | +| -------------- | -------- | +| `'-1'`, `'+1'` | Relative | +| `+1` === `1` | Absolute | +| `'1'` | Absolute | + +So don't forget the single quotes for the relative values. +::: + +#### Absolute Position + +The given value is the exact click count to show the element: + +~~~md +
visible after 3 clicks
+
visible after 2 clicks
+
hidden after 1 click
+ +```js {none|1|2}{at:3} +1 // highlighted after 3 clicks +2 // highlighted after 4 clicks ``` +~~~ + +#### Mixed Case + +You can mix the absolute and relative positions: + +~~~md +
visible after 1 click
+
visible after 3 clicks
+
visible after 2 click
+
visible after 1 click
+
visible after 4 clicks
+~~~ + +The following example synchronizes the highlighting of the two code blocks: + +~~~md +```js {1|2}{at:1} +1 + 1 +'a' + 'b' +``` + +```js {1|2}{at:1} +2 +'ab' +``` +~~~ ### Enter & Leave @@ -124,6 +194,17 @@ You can also specify the enter and leave index for the `v-click` directive by pa
This will be shown on the 2nd and 3rd clicks, and hide again after the 4th.
``` +### Custom Total Clicks Count + +By default, Slidev counts how many steps are needed before going to the next slide. You can override this setting by passing the `clicks` frontmatter option: + +```yaml +--- +# 10 clicks in this slide, before going to the next +clicks: 10 +--- +``` + ### Element Transitions When you apply the `v-click` directive to your elements, it will attach the class name `slidev-vclick-target` to it. When the elements are hidden, the class name `slidev-vclick-hidden` will also be attached. For example: diff --git a/guide/syntax.md b/guide/syntax.md index a1335ec..d0cd2de 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -120,20 +120,7 @@ function add( ``` ~~~ -You can enable line number to all slides by setting `lineNumbers: true` on the config or enable each code block individually by setting `lines:true`. In case you want to disable the numbering for an specific block when `lineNumbers: true` you can set `lines:false` for that block: - -~~~md -```ts {2,3}{lines:true} -function add( - a: Ref | number, - b: Ref | number -) { - return computed(() => unref(a) + unref(b)) -} -``` -~~~ - -You can also set the starting line for each code block and highlight the lines accordingly, defaults to 1: +You can enable line number to all slides by setting `lineNumbers: true` on the config or enable each code block individually by setting `lines:true`. You can also set the starting line for each code block and highlight the lines accordingly, defaults to 1: ~~~md ```ts {6,7}{lines:true, startLine:5} @@ -146,7 +133,7 @@ function add( ``` ~~~ -To change the highlight in multiple steps, you can use `|` to separate them. For example +To change the highlight in multiple clicks, you can use `|` to separate them: ~~~md ```ts {2-3|5|all} @@ -159,12 +146,12 @@ function add( ``` ~~~ -This will first highlight `a: Ref | number` and `b: Ref | number`, and then `return computed(() => unref(a) + unref(b))` after one click, and lastly, the whole block. Learn more in the [clicks animations guide](/guide/animations). +This will first highlight `a: Ref | number` and `b: Ref | number`, and then `return computed(() => unref(a) + unref(b))` after one click, and lastly, the whole block. -You can start the highlight at a specific click: +You can set the line number to `hide` to hide the code block or `none` to not highlight any line: ~~~md -```ts {2-3|5|all}{at:0} +```ts {hide|none} function add( a: Ref | number, b: Ref | number @@ -174,26 +161,14 @@ function add( ``` ~~~ -This is especially useful when you need to sync different animations (when using `two-cols` layout and list animation for instance). -You may need to set the [custom clicks count](/guide/animations#custom-clicks-count) for the slide progression to function correctly. - -To skip highlighting any lines, you can set the line number to `0`. For example +::: tip +Learn more in the [clicks animations guide](./animations#positioning). +::: -~~~md {1} -```ts {0} -function add( - a: Ref | number, - b: Ref | number -) { - return computed(() => unref(a) + unref(b)) -} -``` -~~~ -If the code doesn't fit into one slide, you can pass an extra maxHeight option which will set fixed height -and enable scrolling +If the code doesn't fit into one slide, you use the `maxHeight` to set fixed height and enable scrolling: -~~~md {1} +~~~md ```ts {2|3|7|12}{maxHeight:'100px'} function add( a: Ref | number, @@ -469,7 +444,7 @@ You can import code snippets from existing files via following syntax: <<< @/snippets/snippet.js ``` -::: ttp +::: tip The value of `@` corresponds to the source root, the directory where the `slides.md` is located. ::: @@ -546,6 +521,8 @@ $$ {1|3|all} $$ ``` +The `at` and `finally` options of [code blocks](#line-highlighting) are also available for LaTeX blocks. + ## Diagrams You can also create diagrams / graphs from textual descriptions in your Markdown, powered by [Mermaid](https://mermaid-js.github.io/mermaid). From 5bb36b886ae9009e4661ee060cce1d86954d7280 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Thu, 15 Feb 2024 09:56:57 +0100 Subject: [PATCH 133/211] chore: update lint --- .vitepress/config.ts | 3 +-- .vitepress/theme/components/TheTweet.vue | 4 ++-- builtin/layouts.md | 1 - guide/hosting.md | 12 ++++++------ guide/syntax.md | 1 - 5 files changed, 9 insertions(+), 12 deletions(-) diff --git a/.vitepress/config.ts b/.vitepress/config.ts index 8c5d9e1..c3faaee 100644 --- a/.vitepress/config.ts +++ b/.vitepress/config.ts @@ -1,9 +1,8 @@ import type { DefaultTheme } from 'vitepress' import { defineConfig } from 'vitepress' import { transformerTwoslash } from '@shikijs/vitepress-twoslash' -import vite from '../vite.config' -const CURRENT_VERSION = '0.47.1' +const CURRENT_VERSION = '0.48.0-beta.2' const Guide: DefaultTheme.NavItemWithLink[] = [ { diff --git a/.vitepress/theme/components/TheTweet.vue b/.vitepress/theme/components/TheTweet.vue index 9bf610e..f822111 100644 --- a/.vitepress/theme/components/TheTweet.vue +++ b/.vitepress/theme/components/TheTweet.vue @@ -23,7 +23,7 @@ const vm = getCurrentInstance()! const loaded = ref(false) async function create() { - // @ts-expect-error + // @ts-expect-error Global variable await window.twttr.widgets.createTweet( props.id.toString(), tweet.value, @@ -36,7 +36,7 @@ async function create() { } if (isClient) { - // @ts-expect-error + // @ts-expect-error Global variable if (window?.twttr?.widgets) { onMounted(create) } diff --git a/builtin/layouts.md b/builtin/layouts.md index 01c942d..b04b0cd 100644 --- a/builtin/layouts.md +++ b/builtin/layouts.md @@ -97,7 +97,6 @@ backgroundSize: 20em 70% --- ``` - ### `iframe-left` Shows a web page on the left side of the screen, the content will be placed on the right side. diff --git a/guide/hosting.md b/guide/hosting.md index e373669..26177c0 100644 --- a/guide/hosting.md +++ b/guide/hosting.md @@ -106,15 +106,15 @@ We recommend to use `npm init slidev@latest` to scaffold your project, which con Create `netlify.toml` in your project root with the following content. -```ts -[build.environment] -NODE_VERSION = '14' - - [build] +```toml +[build] publish = 'dist' command = 'npm run build' - [[redirects]] +[build.environment] +NODE_VERSION = '20' + +[[redirects]] from = '/*' to = '/index.html' status = 200 diff --git a/guide/syntax.md b/guide/syntax.md index d0cd2de..33f5f3a 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -165,7 +165,6 @@ function add( Learn more in the [clicks animations guide](./animations#positioning). ::: - If the code doesn't fit into one slide, you use the `maxHeight` to set fixed height and enable scrolling: ~~~md From 081241c66e4b17a1a524facc9585f0b6f74f5699 Mon Sep 17 00:00:00 2001 From: Stefan Freitag Date: Sun, 18 Feb 2024 09:44:57 +0100 Subject: [PATCH 134/211] docs: fix typo in syntax.md (#171) --- guide/syntax.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/guide/syntax.md b/guide/syntax.md index 33f5f3a..2582f76 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -646,9 +646,9 @@ src: ./content.md > Available since v0.43.0 -Slidev has and experimental support for [MDC (Markdown Components) Syntax](https://content.nuxtjs.org/guide/writing/mdc) powered by [`markdown-it-mdc`](https://github.com/antfu/markdown-it-mdc). +Slidev has an experimental support for [MDC (Markdown Components) Syntax](https://content.nuxtjs.org/guide/writing/mdc) powered by [`markdown-it-mdc`](https://github.com/antfu/markdown-it-mdc). -You can enable it by add `mdc: true` to the frontmatter of your markdown file. +You can enable it by adding `mdc: true` to the frontmatter of your markdown file. ```md --- From 7a04557f35275398f1e4314e782f6a42936f7152 Mon Sep 17 00:00:00 2001 From: Xiangdong Zeng Date: Wed, 21 Feb 2024 00:52:47 +0800 Subject: [PATCH 135/211] docs: fix typo in fonts.md (#173) --- custom/fonts.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/custom/fonts.md b/custom/fonts.md index 03cfa38..be4674c 100644 --- a/custom/fonts.md +++ b/custom/fonts.md @@ -86,7 +86,7 @@ If you want to disable the fallback fonts, configure as following --- fonts: mono: 'Fira Code, monospace' - fallback: false + fallbacks: false --- ``` From c3c1774bdf48295664f5b30d7ba7bfbda5a0f3d2 Mon Sep 17 00:00:00 2001 From: _Kerman Date: Wed, 21 Feb 2024 21:32:19 +0800 Subject: [PATCH 136/211] docs: update latest features (#174) --- custom/index.md | 11 ++++++----- guide/install.md | 3 ++- 2 files changed, 8 insertions(+), 6 deletions(-) diff --git a/custom/index.md b/custom/index.md index 00399c4..de17375 100644 --- a/custom/index.md +++ b/custom/index.md @@ -99,17 +99,18 @@ Check out the [type definitions](https://github.com/slidevjs/slidev/blob/main/pa In addition, every slide accepts the following configuration in the Frontmatter block: -* `clicks` (`number`): Custom clicks count (learn more [here](/guide/animations.html#custom-clicks-count)). -* `disabled` (`boolean`): Completely disable the slide. -* `hide` (`boolean`): Hide sub-slides when using `src` (learn more [here](/guide/syntax.html#multiple-entries)). +* `clicks` (`number`): Custom clicks count (learn more [here](/guide/animations.html#custom-total-clicks-count)). +* `disabled` (`boolean`): Completely disable and hide the slide. +* `hide` (`boolean`): The same as `disabled`. * `hideInToc` (`boolean`): Hide the slide for the `` components (learn more [here](/builtin/components.html#toc)). * `layout` (`string`): Defines the layout component applied to the slide (learn more [here](/guide/syntax.html#front-matter-layouts) and [here](/builtin/layouts.html)). * `level` (`number`): Override the title level for the `` and `<Toc>` components (only if `title` has also been declared, learn more [here](/builtin/components.html#titles)). -* `preload` (`boolean`, default `true`): preload the next slide (learn more [here](/guide/animations.html#motion)). -* `routeAlias` (`string`): create a route alias that can be used in the URL or with the `<Link>` component (learn more [here](/builtin/components.html#link)). +* `preload` (`boolean`, default `true`): Preload the next slide (learn more [here](/guide/animations.html#motion)). +* `routeAlias` (`string`): Create a route alias that can be used in the URL or with the `<Link>` component (learn more [here](/builtin/components.html#link)). * `src` (`string`): Includes a markdown file (learn more [here](/guide/syntax.html#multiple-entries)). * `title` (`string`): Override the title for the `<Title>` and `<Toc>` components (learn more [here](/builtin/components.html#titles)). * `transition` (`string | TransitionProps`): Defines the transition between the slide and the next one (learn more [here](/guide/animations.html#slide-transitions)). +* `zoom` (`number`): Custom zoom scale. Useful for slides with a lot of content. ## Directory Structure diff --git a/guide/install.md b/guide/install.md index b5c308a..ff78ed7 100644 --- a/guide/install.md +++ b/guide/install.md @@ -163,8 +163,9 @@ Options: * `--port`, `-p` (`number`, default: `3030`): port number. * `--open`, `-o` (`boolean`, default: `false`): open in browser. * `--remote [password]` (`string`): listen to public host and enable remote control, if a value is passed then the presenter mode is private and only accessible by passing the given password in the URL query `password` parameter. +* `--bind` (`string`, default: `0.0.0.0`): specify which IP addresses the server should listen on in the remote mode. * `--log` (`'error', 'warn', 'info', 'silent'`, default: `'warn'`): Log level. -* `--force`, `-f` (`boolean`, default `false`): force the optimizer to ignore the cache and re-bundle. +* `--force`, `-f` (`boolean`, default: `false`): force the optimizer to ignore the cache and re-bundle. * `--theme`, `-t` (`string`): override theme. ### `slidev build [entry]` From 1d54c861642c679ca01887a28e187047fedcbc83 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Fri, 23 Feb 2024 14:24:29 +0800 Subject: [PATCH 137/211] docs: fix icons installation guide (#175) --- guide/syntax.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/guide/syntax.md b/guide/syntax.md index 2582f76..1d841ff 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -328,15 +328,15 @@ This is another note ## Icons -Slidev allows you to have the accessing to almost all the popular open-source iconsets **directly** in your markdown. Powered by [`unplugin-icons`](https://github.com/antfu/unplugin-icons) and [Iconify](https://iconify.design/). +Slidev allows you to have the accessing to almost all the popular open-source iconsets **directly** in your markdown after installing the corresponding package. Powered by [`unplugin-icons`](https://github.com/antfu/unplugin-icons) and [Iconify](https://iconify.design/). The naming follows [Iconify](https://iconify.design/)'s conversion `{collection-name}-{icon-name}`. For example: -- `<mdi-account-circle />` - <mdi-account-circle /> from [Material Design Icons](https://github.com/Templarian/MaterialDesign) -- `<carbon-badge />` - <carbon-badge /> from [Carbon](https://github.com/carbon-design-system/carbon/tree/main/packages/icons) -- `<uim-rocket />` - <uim-rocket /> from [Unicons Monochrome](https://github.com/Iconscout/unicons) -- `<twemoji-cat-with-tears-of-joy />` - <twemoji-cat-with-tears-of-joy /> from [Twemoji](https://github.com/twitter/twemoji) -- `<logos-vue />` - <logos-vue /> from [SVG Logos](https://github.com/gilbarbara/logos) +- `<mdi-account-circle />` - <mdi-account-circle /> from [Material Design Icons](https://github.com/Templarian/MaterialDesign) - [`@iconify-json/mdi`](https://npmjs.com/package/@iconify-json/mdi) +- `<carbon-badge />` - <carbon-badge /> from [Carbon](https://github.com/carbon-design-system/carbon/tree/main/packages/icons) - [`@iconify-json/carbon`](https://npmjs.com/package/@iconify-json/carbon) +- `<uim-rocket />` - <uim-rocket /> from [Unicons Monochrome](https://github.com/Iconscout/unicons) - [`@iconify-json/uim`](https://npmjs.com/package/@iconify-json/uim) +- `<twemoji-cat-with-tears-of-joy />` - <twemoji-cat-with-tears-of-joy /> from [Twemoji](https://github.com/twitter/twemoji) - [`@iconify-json/twemoji`](https://npmjs.com/package/@iconify-json/twemoji) +- `<logos-vue />` - <logos-vue /> from [SVG Logos](https://github.com/gilbarbara/logos) - [`@iconify-json/logos`](https://npmjs.com/package/@iconify-json/logos) - And much more... Browse and search for all the icons available with [Icônes](https://icones.js.org/). From aa8c4cadc05aeca1e672a8297d644c558b294402 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Sun, 25 Feb 2024 13:15:12 +0100 Subject: [PATCH 138/211] docs: update MDC support --- guide/animations.md | 2 +- guide/syntax.md | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/guide/animations.md b/guide/animations.md index 393b761..569ec5c 100644 --- a/guide/animations.md +++ b/guide/animations.md @@ -342,7 +342,7 @@ Experimental: This is not supported by all browsers. Check the [Browser compatib You can use the `view-transition-name` CSS property to name view transitions, which creates connections between different page elements and smooth transitions when switching slides. -You can enable [MDC (Markdown Component) Syntax](https://content.nuxtjs.org/guide/writing/mdc) support to conveniently name view-transitions: +You can enable [MDC (Markdown Component) Syntax](/syntax#mdc-syntax) support to conveniently name view-transitions: ```md --- diff --git a/guide/syntax.md b/guide/syntax.md index 1d841ff..fcd9fce 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -646,11 +646,11 @@ src: ./content.md > Available since v0.43.0 -Slidev has an experimental support for [MDC (Markdown Components) Syntax](https://content.nuxtjs.org/guide/writing/mdc) powered by [`markdown-it-mdc`](https://github.com/antfu/markdown-it-mdc). +Slidev supports optional [MDC (Markdown Components) Syntax](https://content.nuxtjs.org/guide/writing/mdc) powered by [`markdown-it-mdc`](https://github.com/antfu/markdown-it-mdc). You can enable it by adding `mdc: true` to the frontmatter of your markdown file. -```md +```mdc --- mdc: true --- @@ -664,4 +664,4 @@ The **default** slot :: ``` -Learn more about [the syntax](https://content.nuxtjs.org/guide/writing/mdc). +Learn more about [the syntax](https://content.nuxt.com/guide/writing/mdc). From 97da56b358bb9174ae380a59239ebe11fd5dda12 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Tue, 27 Feb 2024 21:20:56 +0800 Subject: [PATCH 139/211] docs: more detailed explain about code snippets (#178) --- guide/syntax.md | 23 ++++++++++++++++++++--- 1 file changed, 20 insertions(+), 3 deletions(-) diff --git a/guide/syntax.md b/guide/syntax.md index fcd9fce..79ecff1 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -443,11 +443,28 @@ You can import code snippets from existing files via following syntax: <<< @/snippets/snippet.js ``` -::: tip -The value of `@` corresponds to the source root, the directory where the `slides.md` is located. +:::tip +The value of `@` corresponds to your package's root directory. It's recommended to put snippets in `@/snippets`, for compatibility with the Monaco editor. Alternatively, you can also import from relative paths. ::: -This feature is vendored from VitePress, learn more about it in [VitePress's documentation](https://vitepress.dev/guide/markdown#import-code-snippets). +You can also use a [VS Code region](https://code.visualstudio.com/docs/editor/codebasics#_folding) to only include the corresponding part of the code file: + +```md +<<< @/snippets/snippet.js#region-name +``` + +To explicitly specify the language of the imported code, you can add a language identifier after: + +```md +<<< @/snippets/snippet.js ts +``` + +Any code block features like [line highlighting](#line-highlighting) and [Monaco editor](#monaco-editor) are also supported: + +```md +<<< @/snippets/snippet.js {2,3|5}{lines:true} +<<< @/snippets/snippet.js ts {monaco}{height:200px} +``` ## Configurations From 55df176a16c5693491d5823c68f1af798e1f718f Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Tue, 27 Feb 2024 21:21:24 +0800 Subject: [PATCH 140/211] docs: add docs about the Prettier plugin (#177) --- guide/editors.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/guide/editors.md b/guide/editors.md index c9700e4..6215472 100644 --- a/guide/editors.md +++ b/guide/editors.md @@ -41,3 +41,7 @@ The VS Code extension provides some features to help you better organize your sl ![](https://user-images.githubusercontent.com/11247099/116809994-cc2caa00-ab73-11eb-879f-60585747c3c9.png) <TheTweet id="1395333405345148930" /> + +## Prettier Plugin + +Slidev also provides a Prettier plugin to format your slides. You can use it with your favorite editor that supports Prettier. Docs for the plugin can be found [here](https://github.com/slidevjs/prettier-plugin). From 15820b064d1f419ed06cd798ae4b6dfe0c230e94 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Thu, 29 Feb 2024 12:42:23 +0800 Subject: [PATCH 141/211] docs: fix dead link in `animations.md` (#180) --- guide/animations.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/guide/animations.md b/guide/animations.md index 569ec5c..5375e31 100644 --- a/guide/animations.md +++ b/guide/animations.md @@ -342,7 +342,7 @@ Experimental: This is not supported by all browsers. Check the [Browser compatib You can use the `view-transition-name` CSS property to name view transitions, which creates connections between different page elements and smooth transitions when switching slides. -You can enable [MDC (Markdown Component) Syntax](/syntax#mdc-syntax) support to conveniently name view-transitions: +You can enable [MDC (Markdown Component) Syntax](/guide/syntax#mdc-syntax) support to conveniently name view-transitions: ```md --- From 3ecc509629ef65c79e45d4b34f31174ba34bde6a Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Sat, 2 Mar 2024 20:38:04 +0100 Subject: [PATCH 142/211] docs: mention about magic-shiki integration --- components.d.ts | 4 ++++ guide/syntax.md | 26 ++++++++++++++++++++++++++ 2 files changed, 30 insertions(+) diff --git a/components.d.ts b/components.d.ts index b34c1cc..d1d99c8 100644 --- a/components.d.ts +++ b/components.d.ts @@ -11,6 +11,10 @@ declare module 'vue' { AutoFitText: typeof import('./.vitepress/@slidev/client/builtin/AutoFitText.vue')['default'] 'Carbon:chevronLeft': typeof import('~icons/carbon/chevron-left')['default'] 'Carbon:chevronRight': typeof import('~icons/carbon/chevron-right')['default'] + 'Carbon:logoGithub': typeof import('~icons/carbon/logo-github')['default'] + 'Carbon:logoTwitter': typeof import('~icons/carbon/logo-twitter')['default'] + 'Carbon:presentationFile': typeof import('~icons/carbon/presentation-file')['default'] + 'Carbon:video': typeof import('~icons/carbon/video')['default'] CarbonApps: typeof import('~icons/carbon/apps')['default'] CarbonArrowLeft: typeof import('~icons/carbon/arrow-left')['default'] CarbonArrowRight: typeof import('~icons/carbon/arrow-right')['default'] diff --git a/guide/syntax.md b/guide/syntax.md index 79ecff1..56a6f2b 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -182,6 +182,8 @@ const c = add(1, 2) ### TwoSlash Integration +> Available since v0.46 + This feature is only available when you [set `highlighter` to `shiki`](/custom/highlighters) [TwoSlash](https://twoslash.netlify.app/) is a powerful tool for rendering TypeScript code blocks with type information on hover or inlined. It's quite useful for preparing slides for JavaScript/TypeScript-related topics. @@ -206,6 +208,30 @@ const count = ref(0) // ^? ``` +### Magic Shiki Integration + +> Available since v0.48 + +Magic Shiki enables you to have granular transition between code changes. You can check [this demo](https://shiki-magic-move.netlify.app/) to see how Magic Shiki works. + +In Slidev, we bind it to the [clicks system](guide/animations#click-animations). The syntax is wrap multiple code blocks representing each steps with <code>````md magic-move</code> (mind it's **4** backticks), this will be transformed into one code block, that morphing to each steps as you click. + +~~~~md +````md magic-move +```ts +console.log(`Step ${1}`) +``` +```ts +console.log(`Step ${1 + 1}`) +``` +```ts +console.log(`Step ${3}`) +``` +```` +~~~~ + +<!-- TODO: add an inline demo --> + ### Monaco Editor Whenever you want to do some modification in the presentation, simply add `{monaco}` after the language id — it turns the block into a fully-featured Monaco editor! From 7ce53a8019f375752d94f11701a87b2972a90f38 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Sat, 2 Mar 2024 20:51:59 +0100 Subject: [PATCH 143/211] docs: mention about click markers --- guide/syntax.md | 92 +++++++++++++++++++++++-------------------------- 1 file changed, 44 insertions(+), 48 deletions(-) diff --git a/guide/syntax.md b/guide/syntax.md index 56a6f2b..56fd8c2 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -66,32 +66,35 @@ This is a default page without any additional metadata. Refer to [customization](/custom/) for more details. -> The custom syntax might not be compactible with some formatters like Prettier. To improve that, we also support using a direct `yaml` code block to define the frontmatter: -> -> ~~~markdown -> --- -> layout: cover -> --- -> -> # Slidev -> -> This is the cover page. -> -> --- -> -> ```yaml -> # The first yaml block will be treated as the frontmatter of that slide -> layout: center -> background: './images/background-1.png' -> class: 'text-white' -> ``` -> -> # Page 2 -> -> This is a page with the layout `center` and a background image. -> ~~~ -> -> (Available since v0.44.0) +### Prettier Support + +> Available since v0.44 + +The custom syntax might not be compactible with some formatters like Prettier. +You can either install the [Prettier Plugin](/guide/editors#prettier-plugin) or use a direct `yaml` code block to define the frontmatter instead: + +~~~markdown +--- +layout: cover +--- + +# Slidev + +This is the cover page. + +--- + +```yaml +# The first yaml block will be treated as the frontmatter of that slide +layout: center +background: './images/background-1.png' +class: 'text-white' +``` + +# Page 2 + +This is a page with the layout `center` and a background image. +~~~ ## Code Blocks @@ -208,11 +211,11 @@ const count = ref(0) // ^? ``` -### Magic Shiki Integration +### Shiki Magic Move > Available since v0.48 -Magic Shiki enables you to have granular transition between code changes. You can check [this demo](https://shiki-magic-move.netlify.app/) to see how Magic Shiki works. +Shiki Magic Move enables you to have granular transition between code changes like Keynote's Magic Move. You can check [this demo](https://shiki-magic-move.netlify.app/) to see how it works. In Slidev, we bind it to the [clicks system](guide/animations#click-animations). The syntax is wrap multiple code blocks representing each steps with <code>````md magic-move</code> (mind it's **4** backticks), this will be transformed into one code block, that morphing to each steps as you click. @@ -352,6 +355,16 @@ This is another note --> ~~~ +Basic Markdown and HTML are also supported in notes on Presenter renderering. + +### Click Markers + +> Available since v0.48 + +For some slides you might have longer notes that might be hard to find where you are looking at, we introduced the click markers that allows highlighting and auto-scrolling to the section of notes of your corresponding content. Put `[click]` markers in your notes for the timming you need to go to another [click](/guide/animations#click-animations), Slidev divide the content between the click markers and highlight them in presenter notes, synchronized with your slide progress. + +<!-- TODO: add a video --> + ## Icons Slidev allows you to have the accessing to almost all the popular open-source iconsets **directly** in your markdown after installing the corresponding package. Powered by [`unplugin-icons`](https://github.com/antfu/unplugin-icons) and [Iconify](https://iconify.design/). @@ -469,28 +482,11 @@ You can import code snippets from existing files via following syntax: <<< @/snippets/snippet.js ``` -:::tip -The value of `@` corresponds to your package's root directory. It's recommended to put snippets in `@/snippets`, for compatibility with the Monaco editor. Alternatively, you can also import from relative paths. +::: tip +The value of `@` corresponds to the source root, the directory where the `slides.md` is located. ::: -You can also use a [VS Code region](https://code.visualstudio.com/docs/editor/codebasics#_folding) to only include the corresponding part of the code file: - -```md -<<< @/snippets/snippet.js#region-name -``` - -To explicitly specify the language of the imported code, you can add a language identifier after: - -```md -<<< @/snippets/snippet.js ts -``` - -Any code block features like [line highlighting](#line-highlighting) and [Monaco editor](#monaco-editor) are also supported: - -```md -<<< @/snippets/snippet.js {2,3|5}{lines:true} -<<< @/snippets/snippet.js ts {monaco}{height:200px} -``` +This feature is vendored from VitePress, learn more about it in [VitePress's documentation](https://vitepress.dev/guide/markdown#import-code-snippets). ## Configurations From 5a1464eb1ca581bc8167f4ea5f450a0b3bedcbae Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Sat, 2 Mar 2024 20:55:38 +0100 Subject: [PATCH 144/211] chore: update deps --- package.json | 24 +- pnpm-lock.yaml | 857 +++++++++++++++++++++++++++++-------------------- 2 files changed, 527 insertions(+), 354 deletions(-) diff --git a/package.json b/package.json index 457b3b1..251bdf4 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "type": "module", "private": true, - "packageManager": "pnpm@8.15.1", + "packageManager": "pnpm@8.15.4", "scripts": { "dev": "vitepress", "build": "vitepress build", @@ -10,29 +10,29 @@ }, "dependencies": { "@antfu/utils": "^0.7.7", - "@vueuse/core": "^10.7.2", + "@vueuse/core": "^10.9.0", "typeit": "^7.0.4" }, "devDependencies": { - "@antfu/eslint-config": "^2.6.3", - "@iconify/json": "^2.2.178", - "@shikijs/vitepress-twoslash": "1.0.0-beta.5", + "@antfu/eslint-config": "^2.6.4", + "@iconify/json": "^2.2.188", + "@shikijs/vitepress-twoslash": "^1.1.7", "@slidev/client": "0.34.3", "@slidev/parser": "0.34.3", "@slidev/theme-default": "0.21.2", "@slidev/types": "0.34.3", "@types/fs-extra": "^11.0.4", - "@types/node": "^18.19.14", - "@unocss/reset": "^0.58.4", - "eslint": "^8.56.0", + "@types/node": "^20.11.24", + "@unocss/reset": "^0.58.5", + "eslint": "^8.57.0", "fs-extra": "^11.2.0", "markdown-it": "^14.0.0", - "shiki": "^1.0.0-beta.5", + "shiki": "^1.1.7", "typescript": "^5.3.3", - "unocss": "^0.58.4", - "unplugin-icons": "^0.18.3", + "unocss": "^0.58.5", + "unplugin-icons": "^0.18.5", "unplugin-vue-components": "^0.26.0", "vite-plugin-inspect": "^0.8.3", - "vitepress": "^1.0.0-rc.41" + "vitepress": "^1.0.0-rc.44" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 5e5f60b..ea745a5 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -9,22 +9,22 @@ dependencies: specifier: ^0.7.7 version: 0.7.7 '@vueuse/core': - specifier: ^10.7.2 - version: 10.7.2(vue@3.4.15) + specifier: ^10.9.0 + version: 10.9.0(vue@3.4.15) typeit: specifier: ^7.0.4 version: 7.0.4 devDependencies: '@antfu/eslint-config': - specifier: ^2.6.3 - version: 2.6.3(@vue/compiler-sfc@3.4.15)(eslint@8.56.0)(typescript@5.3.3) + specifier: ^2.6.4 + version: 2.6.4(@vue/compiler-sfc@3.4.15)(eslint@8.57.0)(typescript@5.3.3) '@iconify/json': - specifier: ^2.2.178 - version: 2.2.178 + specifier: ^2.2.188 + version: 2.2.188 '@shikijs/vitepress-twoslash': - specifier: 1.0.0-beta.5 - version: 1.0.0-beta.5(typescript@5.3.3) + specifier: ^1.1.7 + version: 1.1.7(typescript@5.3.3) '@slidev/client': specifier: 0.34.3 version: 0.34.3(typescript@5.3.3)(vite@3.2.8) @@ -41,14 +41,14 @@ devDependencies: specifier: ^11.0.4 version: 11.0.4 '@types/node': - specifier: ^18.19.14 - version: 18.19.14 + specifier: ^20.11.24 + version: 20.11.24 '@unocss/reset': - specifier: ^0.58.4 - version: 0.58.4 + specifier: ^0.58.5 + version: 0.58.5 eslint: - specifier: ^8.56.0 - version: 8.56.0 + specifier: ^8.57.0 + version: 8.57.0 fs-extra: specifier: ^11.2.0 version: 11.2.0 @@ -56,17 +56,17 @@ devDependencies: specifier: ^14.0.0 version: 14.0.0 shiki: - specifier: ^1.0.0-beta.5 - version: 1.0.0-beta.5 + specifier: ^1.1.7 + version: 1.1.7 typescript: specifier: ^5.3.3 version: 5.3.3 unocss: - specifier: ^0.58.4 - version: 0.58.4(postcss@8.4.33)(vite@3.2.8) + specifier: ^0.58.5 + version: 0.58.5(postcss@8.4.33)(vite@3.2.8) unplugin-icons: - specifier: ^0.18.3 - version: 0.18.3(@vue/compiler-sfc@3.4.15) + specifier: ^0.18.5 + version: 0.18.5(@vue/compiler-sfc@3.4.15) unplugin-vue-components: specifier: ^0.26.0 version: 0.26.0(vue@3.4.15) @@ -74,8 +74,8 @@ devDependencies: specifier: ^0.8.3 version: 0.8.3(vite@3.2.8) vitepress: - specifier: ^1.0.0-rc.41 - version: 1.0.0-rc.41(@algolia/client-search@4.22.1)(@types/node@18.19.14)(postcss@8.4.33)(search-insights@2.13.0)(typescript@5.3.3) + specifier: ^1.0.0-rc.44 + version: 1.0.0-rc.44(@algolia/client-search@4.22.1)(@types/node@20.11.24)(postcss@8.4.33)(search-insights@2.13.0)(typescript@5.3.3) packages: @@ -226,8 +226,8 @@ packages: '@jridgewell/trace-mapping': 0.3.22 dev: true - /@antfu/eslint-config@2.6.3(@vue/compiler-sfc@3.4.15)(eslint@8.56.0)(typescript@5.3.3): - resolution: {integrity: sha512-sfkamrOatMwMZkp14mBerHKIw8FY0SD1iCb5UZ6Y5hgb+FeDpNQPlVA0i2PN95TQ8NSYyPC1QnoM+UA5NSl0Kg==} + /@antfu/eslint-config@2.6.4(@vue/compiler-sfc@3.4.15)(eslint@8.57.0)(typescript@5.3.3): + resolution: {integrity: sha512-dMD/QC5KWS1OltdpKLhfZM7W7y7zils85opk8d4lyNr7yn0OFjZs7eMYtcC6DrrN2kQ1JrFvBM7uB0QdWn5PUQ==} hasBin: true peerDependencies: '@unocss/eslint-plugin': '>=0.50.0' @@ -259,28 +259,28 @@ packages: '@eslint-types/jsdoc': 46.8.2-1 '@eslint-types/typescript-eslint': 6.19.1 '@eslint-types/unicorn': 50.0.1 - '@stylistic/eslint-plugin': 1.5.4(eslint@8.56.0)(typescript@5.3.3) - '@typescript-eslint/eslint-plugin': 6.20.0(@typescript-eslint/parser@6.20.0)(eslint@8.56.0)(typescript@5.3.3) - '@typescript-eslint/parser': 6.20.0(eslint@8.56.0)(typescript@5.3.3) - eslint: 8.56.0 + '@stylistic/eslint-plugin': 1.5.4(eslint@8.57.0)(typescript@5.3.3) + '@typescript-eslint/eslint-plugin': 6.20.0(@typescript-eslint/parser@6.20.0)(eslint@8.57.0)(typescript@5.3.3) + '@typescript-eslint/parser': 6.20.0(eslint@8.57.0)(typescript@5.3.3) + eslint: 8.57.0 eslint-config-flat-gitignore: 0.1.2 - eslint-merge-processors: 0.1.0(eslint@8.56.0) - eslint-plugin-antfu: 2.1.2(eslint@8.56.0) - eslint-plugin-eslint-comments: 3.2.0(eslint@8.56.0) - eslint-plugin-i: 2.29.1(@typescript-eslint/parser@6.20.0)(eslint@8.56.0) - eslint-plugin-jsdoc: 48.0.4(eslint@8.56.0) - eslint-plugin-jsonc: 2.13.0(eslint@8.56.0) - eslint-plugin-markdown: 3.0.1(eslint@8.56.0) - eslint-plugin-n: 16.6.2(eslint@8.56.0) + eslint-merge-processors: 0.1.0(eslint@8.57.0) + eslint-plugin-antfu: 2.1.2(eslint@8.57.0) + eslint-plugin-eslint-comments: 3.2.0(eslint@8.57.0) + eslint-plugin-i: 2.29.1(@typescript-eslint/parser@6.20.0)(eslint@8.57.0) + eslint-plugin-jsdoc: 48.0.4(eslint@8.57.0) + eslint-plugin-jsonc: 2.13.0(eslint@8.57.0) + eslint-plugin-markdown: 3.0.1(eslint@8.57.0) + eslint-plugin-n: 16.6.2(eslint@8.57.0) eslint-plugin-no-only-tests: 3.1.0 - eslint-plugin-perfectionist: 2.5.0(eslint@8.56.0)(typescript@5.3.3)(vue-eslint-parser@9.4.2) - eslint-plugin-toml: 0.9.2(eslint@8.56.0) - eslint-plugin-unicorn: 50.0.1(eslint@8.56.0) - eslint-plugin-unused-imports: 3.0.0(@typescript-eslint/eslint-plugin@6.20.0)(eslint@8.56.0) - eslint-plugin-vitest: 0.3.21(@typescript-eslint/eslint-plugin@6.20.0)(eslint@8.56.0)(typescript@5.3.3) - eslint-plugin-vue: 9.21.1(eslint@8.56.0) - eslint-plugin-yml: 1.12.2(eslint@8.56.0) - eslint-processor-vue-blocks: 0.1.1(@vue/compiler-sfc@3.4.15)(eslint@8.56.0) + eslint-plugin-perfectionist: 2.5.0(eslint@8.57.0)(typescript@5.3.3)(vue-eslint-parser@9.4.2) + eslint-plugin-toml: 0.9.2(eslint@8.57.0) + eslint-plugin-unicorn: 50.0.1(eslint@8.57.0) + eslint-plugin-unused-imports: 3.0.0(@typescript-eslint/eslint-plugin@6.20.0)(eslint@8.57.0) + eslint-plugin-vitest: 0.3.21(@typescript-eslint/eslint-plugin@6.20.0)(eslint@8.57.0)(typescript@5.3.3) + eslint-plugin-vue: 9.21.1(eslint@8.57.0) + eslint-plugin-yml: 1.12.2(eslint@8.57.0) + eslint-processor-vue-blocks: 0.1.1(@vue/compiler-sfc@3.4.15)(eslint@8.57.0) globals: 13.24.0 jsonc-eslint-parser: 2.4.0 local-pkg: 0.5.0 @@ -288,7 +288,7 @@ packages: picocolors: 1.0.0 prompts: 2.4.2 toml-eslint-parser: 0.9.3 - vue-eslint-parser: 9.4.2(eslint@8.56.0) + vue-eslint-parser: 9.4.2(eslint@8.57.0) yaml-eslint-parser: 1.2.2 yargs: 17.7.2 transitivePeerDependencies: @@ -929,13 +929,13 @@ packages: dev: true optional: true - /@eslint-community/eslint-utils@4.4.0(eslint@8.56.0): + /@eslint-community/eslint-utils@4.4.0(eslint@8.57.0): resolution: {integrity: sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} peerDependencies: eslint: ^6.0.0 || ^7.0.0 || >=8.0.0 dependencies: - eslint: 8.56.0 + eslint: 8.57.0 eslint-visitor-keys: 3.4.3 dev: true @@ -973,8 +973,8 @@ packages: - supports-color dev: true - /@eslint/js@8.56.0: - resolution: {integrity: sha512-gMsVel9D7f2HLkBma9VbtzZRehRogVRfbr++f06nL2vnCGCNlzOD+/MUov/F4p8myyAHspEhVobgjpX64q5m6A==} + /@eslint/js@8.57.0: + resolution: {integrity: sha512-Ys+3g2TaW7gADOJzPt83SJtCDhMjndcDMFVQ/Tj9iA1BfJzFKD9mAUXT3OenpuPHbI6P/myECxRJrofUsDx/5g==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} dev: true @@ -1019,8 +1019,8 @@ packages: resolution: {integrity: sha512-6EwiSjwWYP7pTckG6I5eyFANjPhmPjUX9JRLUSfNPC7FX7zK9gyZAfUEaECL6ALTpGX5AjnBq3C9XmVWPitNpw==} dev: true - /@iconify/json@2.2.178: - resolution: {integrity: sha512-AYw9z/Lu9Y0Q5V0DvyhysJA3ohwKMOgXxCJ1AzTnsZizbUqZ7zh5/wnBegv1ikBEISAY0tC/R46j0tJBjliHkw==} + /@iconify/json@2.2.188: + resolution: {integrity: sha512-gsJwZ60Vb5IrtjYu+Al4qMaML9ZKUnop6Gi0537ZcA6nEhe3Nb58WH4c6b1+mXOHwOkFlLA8AFBXJUHY5nKMdA==} dependencies: '@iconify/types': 2.0.0 pathe: 1.1.2 @@ -1047,8 +1047,8 @@ packages: - supports-color dev: true - /@iconify/utils@2.1.20: - resolution: {integrity: sha512-t8TeKlYK/5i9yTY9VAGAE4P0qQHd/0vH+VSRO+bdpxlt8wqB6f2I0/IrciRsdeFZPMoL8IICgP7lgl2ZtbG8Tw==} + /@iconify/utils@2.1.22: + resolution: {integrity: sha512-6UHVzTVXmvO8uS6xFF+L/QTSpTzA/JZxtgU+KYGFyDYMEObZ1bu/b5l+zNJjHy+0leWjHI+C0pXlzGvv3oXZMA==} dependencies: '@antfu/install-pkg': 0.1.1 '@antfu/utils': 0.7.7 @@ -1056,6 +1056,7 @@ packages: debug: 4.3.4 kolorist: 1.8.0 local-pkg: 0.5.0 + mlly: 1.5.0 transitivePeerDependencies: - supports-color dev: true @@ -1297,41 +1298,38 @@ packages: dev: true optional: true - /@shikijs/core@1.0.0-beta.4: - resolution: {integrity: sha512-iOGXTiBjezVbjAQIhV99M9Tfn4JzTvq04axoCV1wD6YWp6PDU2zbqnVG5BITWjlhIllKnfeaWobYGxLN+nePpQ==} - dev: true - - /@shikijs/core@1.0.0-beta.5: - resolution: {integrity: sha512-C/MxtvK3FFCQZSsDq6OfjDHHOmyP1Jc9wO66cnE8VLEyWXzWch7Zpoc2MWuVJTSC0Pz9QxyUlsBCnroplFqoSg==} + /@shikijs/core@1.1.7: + resolution: {integrity: sha512-gTYLUIuD1UbZp/11qozD3fWpUTuMqPSf3svDMMrL0UmlGU7D9dPw/V1FonwAorCUJBltaaESxq90jrSjQyGixg==} dev: true - /@shikijs/transformers@1.0.0-beta.4: - resolution: {integrity: sha512-C02t81fzpawddxq1Xs2yhNpehymqK/qw0RtlCeBwYrmvMz87rvBpVYmaYv8AkCaNeT8EFH5noTZL8U6ABu5Ciw==} + /@shikijs/transformers@1.1.7: + resolution: {integrity: sha512-lXz011ao4+rvweps/9h3CchBfzb1U5OtP5D51Tqc9lQYdLblWMIxQxH6Ybe1GeGINcEVM4goMyPrI0JvlIp4UQ==} dependencies: - shiki: 1.0.0-beta.4 + shiki: 1.1.7 dev: true - /@shikijs/twoslash@1.0.0-beta.5(typescript@5.3.3): - resolution: {integrity: sha512-BPn2PFgy6Bon/hWU52ELWeGrdO1lsuR6ZIhTTDw4q+GrOZQsVDkdNlhIjoanGv1UY95dlbTEuPqXtzmk+4O73Q==} + /@shikijs/twoslash@1.1.7(typescript@5.3.3): + resolution: {integrity: sha512-WH/Ee67eixqDWjsAUXIJQUgRzPDApsz7Bci65Yobc7SWHNc8T2sY1UBa+MCV2mAj0D6VCYBwWlNxMDTfhN7K0Q==} dependencies: - '@shikijs/core': 1.0.0-beta.5 - twoslash: 0.1.0(typescript@5.3.3) + '@shikijs/core': 1.1.7 + twoslash: 0.2.4(typescript@5.3.3) transitivePeerDependencies: - supports-color - typescript dev: true - /@shikijs/vitepress-twoslash@1.0.0-beta.5(typescript@5.3.3): - resolution: {integrity: sha512-FBjhz1sgSVNepZgPIk3jxPfI4tTVr+hCbR3niVQHrm9hgdqBBoU3cU3TUS3yB+7GJArGJAFrCtYUxsU9g/mUaQ==} + /@shikijs/vitepress-twoslash@1.1.7(typescript@5.3.3): + resolution: {integrity: sha512-rjPJlG1QvNDib5tQlQJKCZSN34lpqNwFRGO6hR50MkULmZRCMENRx22q1TZGJ4WJUeZYORIW7sxv5Y2s+TvLOQ==} dependencies: - '@shikijs/twoslash': 1.0.0-beta.5(typescript@5.3.3) - floating-vue: 5.2.2(vue@3.4.15) + '@shikijs/twoslash': 1.1.7(typescript@5.3.3) + floating-vue: 5.2.2(vue@3.4.21) mdast-util-from-markdown: 2.0.0 mdast-util-gfm: 3.0.0 mdast-util-to-hast: 13.1.0 - shiki: 1.0.0-beta.5 - twoslash-vue: 0.1.0(typescript@5.3.3) - vue: 3.4.15(typescript@5.3.3) + shiki: 1.1.7 + twoslash: 0.2.4(typescript@5.3.3) + twoslash-vue: 0.2.4(typescript@5.3.3) + vue: 3.4.21(typescript@5.3.3) transitivePeerDependencies: - '@nuxt/kit' - supports-color @@ -1412,7 +1410,7 @@ packages: engines: {node: '>=14.0.0'} dev: true - /@stylistic/eslint-plugin-js@1.5.4(eslint@8.56.0): + /@stylistic/eslint-plugin-js@1.5.4(eslint@8.57.0): resolution: {integrity: sha512-3ctWb3NvJNV1MsrZN91cYp2EGInLPSoZKphXIbIRx/zjZxKwLDr9z4LMOWtqjq14li/OgqUUcMq5pj8fgbLoTw==} engines: {node: ^16.0.0 || >=18.0.0} peerDependencies: @@ -1420,59 +1418,59 @@ packages: dependencies: acorn: 8.11.3 escape-string-regexp: 4.0.0 - eslint: 8.56.0 + eslint: 8.57.0 eslint-visitor-keys: 3.4.3 espree: 9.6.1 dev: true - /@stylistic/eslint-plugin-jsx@1.5.4(eslint@8.56.0): + /@stylistic/eslint-plugin-jsx@1.5.4(eslint@8.57.0): resolution: {integrity: sha512-JUfrpCkeBCqt1IZ4QsP4WgxGza4PhK4LPbc0VnCjHKygl+rgqoDAovqOuzFJ49wJ4Ix3r6OIHFuwiBGswZEVvg==} engines: {node: ^16.0.0 || >=18.0.0} peerDependencies: eslint: '>=8.40.0' dependencies: - '@stylistic/eslint-plugin-js': 1.5.4(eslint@8.56.0) - eslint: 8.56.0 + '@stylistic/eslint-plugin-js': 1.5.4(eslint@8.57.0) + eslint: 8.57.0 estraverse: 5.3.0 dev: true - /@stylistic/eslint-plugin-plus@1.5.4(eslint@8.56.0)(typescript@5.3.3): + /@stylistic/eslint-plugin-plus@1.5.4(eslint@8.57.0)(typescript@5.3.3): resolution: {integrity: sha512-dI0Cs5vYX/0uMhQDY+NK0cKQ0Pe9B6jWYxd0Ndud+mNloDaVLrsmJocK4zn+YfhGEDs1E4Nk5uAPZEumIpDuSg==} peerDependencies: eslint: '*' dependencies: - '@typescript-eslint/utils': 6.20.0(eslint@8.56.0)(typescript@5.3.3) - eslint: 8.56.0 + '@typescript-eslint/utils': 6.20.0(eslint@8.57.0)(typescript@5.3.3) + eslint: 8.57.0 transitivePeerDependencies: - supports-color - typescript dev: true - /@stylistic/eslint-plugin-ts@1.5.4(eslint@8.56.0)(typescript@5.3.3): + /@stylistic/eslint-plugin-ts@1.5.4(eslint@8.57.0)(typescript@5.3.3): resolution: {integrity: sha512-NZDFVIlVNjuPvhT+0Cidm5IS3emtx338xbJTqs2xfOVRDGTpYwRHhNVEGa1rFOpYHmv0sAj6+OXbMDn7ul0K/g==} engines: {node: ^16.0.0 || >=18.0.0} peerDependencies: eslint: '>=8.40.0' dependencies: - '@stylistic/eslint-plugin-js': 1.5.4(eslint@8.56.0) - '@typescript-eslint/utils': 6.20.0(eslint@8.56.0)(typescript@5.3.3) - eslint: 8.56.0 + '@stylistic/eslint-plugin-js': 1.5.4(eslint@8.57.0) + '@typescript-eslint/utils': 6.20.0(eslint@8.57.0)(typescript@5.3.3) + eslint: 8.57.0 transitivePeerDependencies: - supports-color - typescript dev: true - /@stylistic/eslint-plugin@1.5.4(eslint@8.56.0)(typescript@5.3.3): + /@stylistic/eslint-plugin@1.5.4(eslint@8.57.0)(typescript@5.3.3): resolution: {integrity: sha512-zWPXr+O67GC9KDAFkbL1U9UVqE6Iv69YMKhkIECCmE0GvClUJwdfsimm4XebEDondV7kfjMrTDZaYfrI5aS0Jg==} engines: {node: ^16.0.0 || >=18.0.0} peerDependencies: eslint: '>=8.40.0' dependencies: - '@stylistic/eslint-plugin-js': 1.5.4(eslint@8.56.0) - '@stylistic/eslint-plugin-jsx': 1.5.4(eslint@8.56.0) - '@stylistic/eslint-plugin-plus': 1.5.4(eslint@8.56.0)(typescript@5.3.3) - '@stylistic/eslint-plugin-ts': 1.5.4(eslint@8.56.0)(typescript@5.3.3) - eslint: 8.56.0 + '@stylistic/eslint-plugin-js': 1.5.4(eslint@8.57.0) + '@stylistic/eslint-plugin-jsx': 1.5.4(eslint@8.57.0) + '@stylistic/eslint-plugin-plus': 1.5.4(eslint@8.57.0)(typescript@5.3.3) + '@stylistic/eslint-plugin-ts': 1.5.4(eslint@8.57.0)(typescript@5.3.3) + eslint: 8.57.0 transitivePeerDependencies: - supports-color - typescript @@ -1492,13 +1490,13 @@ packages: resolution: {integrity: sha512-yTbItCNreRooED33qjunPthRcSjERP1r4MqCZc7wv0u2sUkzTFp45tgUfS5+r7FrZPdmCCNflLhVSP/o+SemsQ==} dependencies: '@types/jsonfile': 6.1.4 - '@types/node': 18.19.14 + '@types/node': 20.11.24 dev: true /@types/hast@3.0.4: resolution: {integrity: sha512-WPs+bbQw5aCj+x6laNGWLH3wviHtoCv/P3+otBhbOhJgG8qtpdAMlTCxLtsTWA7LH1Oh/bFCHsBn0TPS5m30EQ==} dependencies: - '@types/unist': 2.0.10 + '@types/unist': 3.0.2 dev: true /@types/json-schema@7.0.15: @@ -1508,7 +1506,7 @@ packages: /@types/jsonfile@6.1.4: resolution: {integrity: sha512-D5qGUYwjvnNNextdU59/+fI+spnwtTFmyQP0h+PfIOSkNfpU6AOICUOkm4i0OnSk+NyjdPJrxCDro0sJsWlRpQ==} dependencies: - '@types/node': 18.19.14 + '@types/node': 20.11.24 dev: true /@types/linkify-it@3.0.5: @@ -1542,8 +1540,8 @@ packages: resolution: {integrity: sha512-nG96G3Wp6acyAgJqGasjODb+acrI7KltPiRxzHPXnP3NgI28bpQDRv53olbqGXbfcgF5aiiHmO3xpwEpS5Ld9g==} dev: true - /@types/node@18.19.14: - resolution: {integrity: sha512-EnQ4Us2rmOS64nHDWr0XqAD8DsO6f3XR6lf9UIIrZQpUzPVdN/oPuEzfDWNHSyXLvoGgjuEm/sPwFGSSs35Wtg==} + /@types/node@20.11.24: + resolution: {integrity: sha512-Kza43ewS3xoLgCEpQrsT+xRo/EJej1y0kVYGiLFE1NEODXGzTfwiC6tXTLMQskn1X4/Rjlh0MQUvx9W+L9long==} dependencies: undici-types: 5.26.5 dev: true @@ -1571,7 +1569,7 @@ packages: /@types/web-bluetooth@0.0.20: resolution: {integrity: sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow==} - /@typescript-eslint/eslint-plugin@6.20.0(@typescript-eslint/parser@6.20.0)(eslint@8.56.0)(typescript@5.3.3): + /@typescript-eslint/eslint-plugin@6.20.0(@typescript-eslint/parser@6.20.0)(eslint@8.57.0)(typescript@5.3.3): resolution: {integrity: sha512-fTwGQUnjhoYHeSF6m5pWNkzmDDdsKELYrOBxhjMrofPqCkoC2k3B2wvGHFxa1CTIqkEn88nlW1HVMztjo2K8Hg==} engines: {node: ^16.0.0 || >=18.0.0} peerDependencies: @@ -1583,13 +1581,13 @@ packages: optional: true dependencies: '@eslint-community/regexpp': 4.10.0 - '@typescript-eslint/parser': 6.20.0(eslint@8.56.0)(typescript@5.3.3) + '@typescript-eslint/parser': 6.20.0(eslint@8.57.0)(typescript@5.3.3) '@typescript-eslint/scope-manager': 6.20.0 - '@typescript-eslint/type-utils': 6.20.0(eslint@8.56.0)(typescript@5.3.3) - '@typescript-eslint/utils': 6.20.0(eslint@8.56.0)(typescript@5.3.3) + '@typescript-eslint/type-utils': 6.20.0(eslint@8.57.0)(typescript@5.3.3) + '@typescript-eslint/utils': 6.20.0(eslint@8.57.0)(typescript@5.3.3) '@typescript-eslint/visitor-keys': 6.20.0 debug: 4.3.4 - eslint: 8.56.0 + eslint: 8.57.0 graphemer: 1.4.0 ignore: 5.3.1 natural-compare: 1.4.0 @@ -1600,7 +1598,7 @@ packages: - supports-color dev: true - /@typescript-eslint/parser@6.20.0(eslint@8.56.0)(typescript@5.3.3): + /@typescript-eslint/parser@6.20.0(eslint@8.57.0)(typescript@5.3.3): resolution: {integrity: sha512-bYerPDF/H5v6V76MdMYhjwmwgMA+jlPVqjSDq2cRqMi8bP5sR3Z+RLOiOMad3nsnmDVmn2gAFCyNgh/dIrfP/w==} engines: {node: ^16.0.0 || >=18.0.0} peerDependencies: @@ -1615,7 +1613,7 @@ packages: '@typescript-eslint/typescript-estree': 6.20.0(typescript@5.3.3) '@typescript-eslint/visitor-keys': 6.20.0 debug: 4.3.4 - eslint: 8.56.0 + eslint: 8.57.0 typescript: 5.3.3 transitivePeerDependencies: - supports-color @@ -1629,7 +1627,7 @@ packages: '@typescript-eslint/visitor-keys': 6.20.0 dev: true - /@typescript-eslint/type-utils@6.20.0(eslint@8.56.0)(typescript@5.3.3): + /@typescript-eslint/type-utils@6.20.0(eslint@8.57.0)(typescript@5.3.3): resolution: {integrity: sha512-qnSobiJQb1F5JjN0YDRPHruQTrX7ICsmltXhkV536mp4idGAYrIyr47zF/JmkJtEcAVnIz4gUYJ7gOZa6SmN4g==} engines: {node: ^16.0.0 || >=18.0.0} peerDependencies: @@ -1640,9 +1638,9 @@ packages: optional: true dependencies: '@typescript-eslint/typescript-estree': 6.20.0(typescript@5.3.3) - '@typescript-eslint/utils': 6.20.0(eslint@8.56.0)(typescript@5.3.3) + '@typescript-eslint/utils': 6.20.0(eslint@8.57.0)(typescript@5.3.3) debug: 4.3.4 - eslint: 8.56.0 + eslint: 8.57.0 ts-api-utils: 1.0.3(typescript@5.3.3) typescript: 5.3.3 transitivePeerDependencies: @@ -1676,19 +1674,19 @@ packages: - supports-color dev: true - /@typescript-eslint/utils@6.20.0(eslint@8.56.0)(typescript@5.3.3): + /@typescript-eslint/utils@6.20.0(eslint@8.57.0)(typescript@5.3.3): resolution: {integrity: sha512-/EKuw+kRu2vAqCoDwDCBtDRU6CTKbUmwwI7SH7AashZ+W+7o8eiyy6V2cdOqN49KsTcASWsC5QeghYuRDTyOOg==} engines: {node: ^16.0.0 || >=18.0.0} peerDependencies: eslint: ^7.0.0 || ^8.0.0 dependencies: - '@eslint-community/eslint-utils': 4.4.0(eslint@8.56.0) + '@eslint-community/eslint-utils': 4.4.0(eslint@8.57.0) '@types/json-schema': 7.0.15 '@types/semver': 7.5.6 '@typescript-eslint/scope-manager': 6.20.0 '@typescript-eslint/types': 6.20.0 '@typescript-eslint/typescript-estree': 6.20.0(typescript@5.3.3) - eslint: 8.56.0 + eslint: 8.57.0 semver: 7.5.4 transitivePeerDependencies: - supports-color @@ -1715,18 +1713,18 @@ packages: resolution: {integrity: sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==} dev: true - /@unocss/astro@0.58.4(vite@3.2.8): - resolution: {integrity: sha512-feS8+f3oPmCeR1XF7isQjs3Z9ojM5Ssv0vCNR/dexPFdROfccK/7sIu1YnHWtVg1trPc1kMfI8XJRqfrHMdd5w==} + /@unocss/astro@0.58.5(vite@3.2.8): + resolution: {integrity: sha512-LtuVnj8oFAK9663OVhQO8KpdJFiOyyPsYfnOZlDCOFK3gHb/2WMrzdBwr1w8LoQF3bDedkFMKirVF7gWjyZiaw==} peerDependencies: vite: ^2.9.0 || ^3.0.0-0 || ^4.0.0 || ^5.0.0-0 peerDependenciesMeta: vite: optional: true dependencies: - '@unocss/core': 0.58.4 - '@unocss/reset': 0.58.4 - '@unocss/vite': 0.58.4(vite@3.2.8) - vite: 3.2.8(@types/node@18.19.14) + '@unocss/core': 0.58.5 + '@unocss/reset': 0.58.5 + '@unocss/vite': 0.58.5(vite@3.2.8) + vite: 3.2.8(@types/node@20.11.24) transitivePeerDependencies: - rollup dev: true @@ -1748,16 +1746,16 @@ packages: perfect-debounce: 0.1.3 dev: true - /@unocss/cli@0.58.4: - resolution: {integrity: sha512-8dAs1TzzWCtb3FxoTsVtR2+JGkdmchuP0RvGlSywADf5FqYn9nbP0m3z4STtpPavHO9JaGbabStyjS0nA8Ck6w==} + /@unocss/cli@0.58.5: + resolution: {integrity: sha512-FzVVXO9ghsGtJpu9uR4o7JeM9gUfWNbVZZ/IfH+0WbDJuyx4rO/jwN55z0yA5QDkhvOz9DvzwPCBzLpTJ5q+Lw==} engines: {node: '>=14'} hasBin: true dependencies: '@ampproject/remapping': 2.2.1 '@rollup/pluginutils': 5.1.0 - '@unocss/config': 0.58.4 - '@unocss/core': 0.58.4 - '@unocss/preset-uno': 0.58.4 + '@unocss/config': 0.58.5 + '@unocss/core': 0.58.5 + '@unocss/preset-uno': 0.58.5 cac: 6.7.14 chokidar: 3.5.3 colorette: 2.0.20 @@ -1778,11 +1776,11 @@ packages: unconfig: 0.3.11 dev: true - /@unocss/config@0.58.4: - resolution: {integrity: sha512-b/inDCOnhUPzobhj+SxRI7xeSwoAQU+3D3J5JoWZNPBI4OaJdwpuz40uLXl9VsPz5N6dc8/qa+FrSsgCjUcLTg==} + /@unocss/config@0.58.5: + resolution: {integrity: sha512-O1pLSeNXfG11QHaLSVwS9rJKvE4b9304IQ3UvOdbYN+7SAT4YTZ7JDU4ngO1KWyOFBO6RD0WspCR95pgqOqJiQ==} engines: {node: '>=14'} dependencies: - '@unocss/core': 0.58.4 + '@unocss/core': 0.58.5 unconfig: 0.3.11 dev: true @@ -1790,14 +1788,14 @@ packages: resolution: {integrity: sha512-fExFmLDkquL+AevDCperw0ry1vcyD8RCZwrnLOmkBIZdUcXhy7OKOkzinj/5dEVm11mmPJC8A0wiw4VXbQRGuQ==} dev: true - /@unocss/core@0.58.4: - resolution: {integrity: sha512-wh4pxXUCkhC+C/0ct74PMYeZgX+oWuHj2mnvr09nM0WmvOm1HeeISrDCCBGcxmKbErUk+D1v3JgzXF7b6j2l4g==} + /@unocss/core@0.58.5: + resolution: {integrity: sha512-qbPqL+46hf1/UelQOwUwpAuvm6buoss43DPYHOPdfNJ+NTWkSpATQMF0JKT04QE0QRQbHNSHdMe9ariG+IIlCw==} dev: true - /@unocss/extractor-arbitrary-variants@0.58.4: - resolution: {integrity: sha512-TQlVtSQk8YdBU9KuTA5k6JBJ8d/aPrIsCWjDPfBvAqDvrll/dzwBCLoLTQMdCHFjCXCOYWKPum1ET+Wn9R+XbA==} + /@unocss/extractor-arbitrary-variants@0.58.5: + resolution: {integrity: sha512-KJQX0OJKzy4YjJo09h2la2Q+cn5IJ1JdyPVJJkzovHnv7jSBWzsfct+bj/6a+SJ4p4JBIqEJz3M/qxHv4EPJyA==} dependencies: - '@unocss/core': 0.58.4 + '@unocss/core': 0.58.5 dev: true /@unocss/inspector@0.42.1: @@ -1807,24 +1805,24 @@ packages: sirv: 2.0.4 dev: true - /@unocss/inspector@0.58.4: - resolution: {integrity: sha512-BbsaIMqP6dqa3qCfkC0nkvjCg11JRigvFPU4319imTPcTHQNQSg35t2mVFPGZ+QYHlU/3ouBeogUQfJDHBmtVQ==} + /@unocss/inspector@0.58.5: + resolution: {integrity: sha512-cbJlIHEZ14puTtttf7sl+VZFDscV1DJiSseh9sSe0xJ/1NVBT9Bvkm09/1tnpLYAgF5gfa1CaCcjKmURgYzKrA==} dependencies: - '@unocss/core': 0.58.4 - '@unocss/rule-utils': 0.58.4 + '@unocss/core': 0.58.5 + '@unocss/rule-utils': 0.58.5 gzip-size: 6.0.0 sirv: 2.0.4 dev: true - /@unocss/postcss@0.58.4(postcss@8.4.33): - resolution: {integrity: sha512-pg2qCGakV1TyMApPdvuvqqmPDhgogPWF14J97BT5zIfGYITAJSmBsm7d3+06w6EuqIS+vcYRw+qCV3oX6qTeiA==} + /@unocss/postcss@0.58.5(postcss@8.4.33): + resolution: {integrity: sha512-m4L2YRdYfT6CV306Kl2VwEwbqa/92EpW4GE2Kqak1RuJyFJXBnWEEMJV4Uy6B1jWKLlCEWkuVUW33JUg7X6BxQ==} engines: {node: '>=14'} peerDependencies: postcss: ^8.4.21 dependencies: - '@unocss/config': 0.58.4 - '@unocss/core': 0.58.4 - '@unocss/rule-utils': 0.58.4 + '@unocss/config': 0.58.5 + '@unocss/core': 0.58.5 + '@unocss/rule-utils': 0.58.5 css-tree: 2.3.1 fast-glob: 3.3.2 magic-string: 0.30.6 @@ -1837,10 +1835,10 @@ packages: '@unocss/core': 0.42.1 dev: true - /@unocss/preset-attributify@0.58.4: - resolution: {integrity: sha512-r7pDXgcOgGMmrMoqM4/w20KKn4PxF+/vpElatAGXW3V/tHJWFOLGzk+wYeCMgMxeC+vPzqyJkjTfoqYlZrlokQ==} + /@unocss/preset-attributify@0.58.5: + resolution: {integrity: sha512-OR4gUHamHCb4/LB/zZHlibaraTyILfFvRIzgmJnEb6lITGApQUl86qaJcTbTyfTfLVRufLG/JVeuz2HLUBPRXw==} dependencies: - '@unocss/core': 0.58.4 + '@unocss/core': 0.58.5 dev: true /@unocss/preset-icons@0.42.1: @@ -1853,11 +1851,11 @@ packages: - supports-color dev: true - /@unocss/preset-icons@0.58.4: - resolution: {integrity: sha512-xdOe3PLfEWS4y+rA7Gxh/kDI82VkW0PbdoYO2FBwXH7a0JegdUDD5zuOTsTKAIymvQ7eVH53WXN9mcuhfNmdvQ==} + /@unocss/preset-icons@0.58.5: + resolution: {integrity: sha512-LDNXavHtWaIvMvBezT9O8yiqHJChVCEfTRO6YFVY0yy+wo5jHiuMh6iKeHVcwbYdn3NqHYmpi7b/hrXPMtODzA==} dependencies: - '@iconify/utils': 2.1.20 - '@unocss/core': 0.58.4 + '@iconify/utils': 2.1.22 + '@unocss/core': 0.58.5 ofetch: 1.3.3 transitivePeerDependencies: - supports-color @@ -1869,12 +1867,12 @@ packages: '@unocss/core': 0.42.1 dev: true - /@unocss/preset-mini@0.58.4: - resolution: {integrity: sha512-cpIWUYxLi4VCkkjxpNJOVqH9D32NX1ebRFaoAVnvCRsoj5TRsZJSdxs0WMN7reHT/CUHh0Wh6d3TfMCFxzbZ4g==} + /@unocss/preset-mini@0.58.5: + resolution: {integrity: sha512-WqD31fKUAN28OCUOyi1uremmLk0eTMqtCizjbbXsY/DP6RKYUT7trFAtppTcHWFhSQcknb4FURfAZppACsTVQQ==} dependencies: - '@unocss/core': 0.58.4 - '@unocss/extractor-arbitrary-variants': 0.58.4 - '@unocss/rule-utils': 0.58.4 + '@unocss/core': 0.58.5 + '@unocss/extractor-arbitrary-variants': 0.58.5 + '@unocss/rule-utils': 0.58.5 dev: true /@unocss/preset-tagify@0.42.1: @@ -1883,10 +1881,10 @@ packages: '@unocss/core': 0.42.1 dev: true - /@unocss/preset-tagify@0.58.4: - resolution: {integrity: sha512-1E3vQvg5Qy4tbgovvrV0JaIXFfcdhK4NCSz+MuUk5ZYgKGVDh4IEw0WPuic534nlLm9+YFqyCSLLyIs3bT/GYQ==} + /@unocss/preset-tagify@0.58.5: + resolution: {integrity: sha512-UB9IXi8vA/SzmmRLMWR7bzeBpxpiRo7y9xk3ruvDddYlsyiwIeDIMwG23YtcA6q41FDQvkrmvTxUEH9LFlv6aA==} dependencies: - '@unocss/core': 0.58.4 + '@unocss/core': 0.58.5 dev: true /@unocss/preset-typography@0.42.1: @@ -1895,11 +1893,11 @@ packages: '@unocss/core': 0.42.1 dev: true - /@unocss/preset-typography@0.58.4: - resolution: {integrity: sha512-0Opt3Y0At4F03092iwGgz7HswRC2ElBXHR+IO9wWxSbldtpdmKzFJ/GBHEalzQjacWnyyzmRjabjA2quoQ8FQA==} + /@unocss/preset-typography@0.58.5: + resolution: {integrity: sha512-rFny4a9yxgY34XOom5euCqQaOLV8PpbTg0Pn+5FelUMG4OfMevTwBCe9JttFJcUc3cNTL2enkzIdMa3l66114g==} dependencies: - '@unocss/core': 0.58.4 - '@unocss/preset-mini': 0.58.4 + '@unocss/core': 0.58.5 + '@unocss/preset-mini': 0.58.5 dev: true /@unocss/preset-uno@0.42.1: @@ -1910,13 +1908,13 @@ packages: '@unocss/preset-wind': 0.42.1 dev: true - /@unocss/preset-uno@0.58.4: - resolution: {integrity: sha512-FWBPGIt0UcQHu58l75kvhB4vF2v+s2m0OW9DnIrPm3aY7Qj3q4yA2wdahR37qSsH+6vR3JP4+mV9WBrGjIsjrQ==} + /@unocss/preset-uno@0.58.5: + resolution: {integrity: sha512-vgq/R4f7RDmdROy+pX+PeE38I3SgYKd4LL7Wb1HJUaVwz7PkF0XHCynOTbwrPXnK1kp1cnZYYEww7/RiYp+IQQ==} dependencies: - '@unocss/core': 0.58.4 - '@unocss/preset-mini': 0.58.4 - '@unocss/preset-wind': 0.58.4 - '@unocss/rule-utils': 0.58.4 + '@unocss/core': 0.58.5 + '@unocss/preset-mini': 0.58.5 + '@unocss/preset-wind': 0.58.5 + '@unocss/rule-utils': 0.58.5 dev: true /@unocss/preset-web-fonts@0.42.1: @@ -1926,10 +1924,10 @@ packages: ohmyfetch: 0.4.21 dev: true - /@unocss/preset-web-fonts@0.58.4: - resolution: {integrity: sha512-vcy20fIK37GdhesRpiWGvCvkJDQsSiRF1jxw3dy8J5n9kFpIV8DQoPWUIE0ePF4i5ky2dHSDxKaNOP1bxHdKGA==} + /@unocss/preset-web-fonts@0.58.5: + resolution: {integrity: sha512-WKZ5raSClFXhqzfAhApef3+fuMq6cjKBxvhJ1FBIxFKcSOvN8e2czty2iGQVl02yMsxBWMv0Bpfm7np+cCoI1w==} dependencies: - '@unocss/core': 0.58.4 + '@unocss/core': 0.58.5 ofetch: 1.3.3 dev: true @@ -1940,27 +1938,27 @@ packages: '@unocss/preset-mini': 0.42.1 dev: true - /@unocss/preset-wind@0.58.4: - resolution: {integrity: sha512-e2F0HsqPXw+nD85MKIZ63mx5yUx5g8iPOtMw9/eEUeK67HrD+jFxeLq0hAM3ou3a4589QIzeg23LXAkM7gCzvg==} + /@unocss/preset-wind@0.58.5: + resolution: {integrity: sha512-54RkjLmlqMUlC8o8nDCVzB25D1zzK4eth+/3uQzt739qU0U92NxuZKY21ADj9Rp/mVhKBV5FKuXPjmYc6yTQRQ==} dependencies: - '@unocss/core': 0.58.4 - '@unocss/preset-mini': 0.58.4 - '@unocss/rule-utils': 0.58.4 + '@unocss/core': 0.58.5 + '@unocss/preset-mini': 0.58.5 + '@unocss/rule-utils': 0.58.5 dev: true /@unocss/reset@0.42.1: resolution: {integrity: sha512-sByjZKqqsXSavOOebaY6pPtZWFSO71adNbBFUPH7De56YtAGiS89PC9tQ/RGPhNBuZ2krZIMsN9og3+HivGUvg==} dev: true - /@unocss/reset@0.58.4: - resolution: {integrity: sha512-ZZTrAdl4WWmMjQdOqcOSWdgFH6kdFKZjPu4c6Ijxk7KvY2BW3nttTTBa7IYeuXFHVfcExUFqlOgRurt+NeWYyQ==} + /@unocss/reset@0.58.5: + resolution: {integrity: sha512-2wMrkCj3SSb5hrx9TKs5jZa34QIRkHv9FotbJutAPo7o8hx+XXn56ogzdoUrcFPJZJUx2R2nyOVbSlGMIjtFtw==} dev: true - /@unocss/rule-utils@0.58.4: - resolution: {integrity: sha512-52Jp4I+joGTaDm7ehB/7uZ2kJL+9BZcYRDUVk4IDacDH5W9yxf1F75LzYT8jJVWXD/HIhiS0r9V6qhcBq2OWZw==} + /@unocss/rule-utils@0.58.5: + resolution: {integrity: sha512-w0sGJoeUGwMWLVFLEE9PDiv/fQcQqZnTIIQLYNCjTdqXDRlwTp9ACW0h47x/hAAIXdOtEOOBuTfjGD79GznUmA==} engines: {node: '>=14'} dependencies: - '@unocss/core': 0.58.4 + '@unocss/core': 0.58.5 magic-string: 0.30.6 dev: true @@ -1968,25 +1966,25 @@ packages: resolution: {integrity: sha512-nFkfZwBGLl6nN6bBaUrF1l2ZkMcg2dAibSlA0U1mr+75L14gem2o+QR++Q76dATiLA9ljdL++Tn5JLR8zGQ7xg==} dev: true - /@unocss/scope@0.58.4: - resolution: {integrity: sha512-JrX98xoYnv0HN41WyzlvCCU1T3jnDOry+V8mm2dB9DvByzxI484X6gtKbOXlJFAPwOlZPU5Bru/XTDaL6yQQww==} + /@unocss/scope@0.58.5: + resolution: {integrity: sha512-vSentagAwYTnThGRCjzZ6eNSSRuzdWBl21L1BbvVNM91Ss/FugQnZ1hd0m3TrVvvStYXnFVHMQ/MjCAEJ4cMYg==} dev: true - /@unocss/transformer-attributify-jsx-babel@0.58.4: - resolution: {integrity: sha512-yJd+OxAdgAxSQHVrqC6z19ibPqwwWO7J0TFf2caiP3hidSJ0iOvxcC0h62YCMr9dg4MsCpXaiHmGzxXbWGJ9nQ==} + /@unocss/transformer-attributify-jsx-babel@0.58.5: + resolution: {integrity: sha512-IAWSSKN3V0D87DE8bqaaPrZBWOdWQ06QNfi9vRuQJfRWOui87ezi9+NffjcnQw/ap9xMk1O6z74/WOW3zo6uYA==} dependencies: '@babel/core': 7.23.9 '@babel/plugin-syntax-jsx': 7.23.3(@babel/core@7.23.9) '@babel/preset-typescript': 7.23.3(@babel/core@7.23.9) - '@unocss/core': 0.58.4 + '@unocss/core': 0.58.5 transitivePeerDependencies: - supports-color dev: true - /@unocss/transformer-attributify-jsx@0.58.4: - resolution: {integrity: sha512-Y4YMVkgY/EF7x0llV8Y42WGs8b77hbXkPstRLNeRD5x8KBNKnjYUXADwhTBEKXjDR8/y5Ewie8u43i1nbh1XuA==} + /@unocss/transformer-attributify-jsx@0.58.5: + resolution: {integrity: sha512-sItEALyvAt3PZLd9Q1tlIATjaj3kWbS/qI3otUVsYBdZjP4UudzJ3D1fcWNL2WPlgz8KtlVzRUuxob8TQ4ibZg==} dependencies: - '@unocss/core': 0.58.4 + '@unocss/core': 0.58.5 dev: true /@unocss/transformer-compile-class@0.42.1: @@ -1995,10 +1993,10 @@ packages: '@unocss/core': 0.42.1 dev: true - /@unocss/transformer-compile-class@0.58.4: - resolution: {integrity: sha512-GPz462ogvtb64W0iweuB0Dcm1snGsGte0RlVpFUeG2eWlVqKMRvNRtYuive2Ky2zSZKefWJQBGk3Ti+7CM4wFA==} + /@unocss/transformer-compile-class@0.58.5: + resolution: {integrity: sha512-4MaxjaZo1rf5uHvDGa2mbnXxAYVYoj1+oRNpL4fE3FoExS1Ka2CiNGQn/S4bHMF51vmXMSWtOzurJpPD4BaJUQ==} dependencies: - '@unocss/core': 0.58.4 + '@unocss/core': 0.58.5 dev: true /@unocss/transformer-directives@0.42.1: @@ -2008,11 +2006,11 @@ packages: css-tree: 2.3.1 dev: true - /@unocss/transformer-directives@0.58.4: - resolution: {integrity: sha512-5g2XVhwpmu2IrGHqPwxh+S3ZtkC/AwAtLIBLWB1QNhY3HVzAAaOzcif6uarngrCTTDQSDmsjzm8TSAq26LtCmQ==} + /@unocss/transformer-directives@0.58.5: + resolution: {integrity: sha512-allspF5TlT1B2bJSZ1houHScXOTaTPlatLiEmgQKzr/m93rCvktokaO5J6qeN2VXQdpTIsxdA5B8//7UkfTuIA==} dependencies: - '@unocss/core': 0.58.4 - '@unocss/rule-utils': 0.58.4 + '@unocss/core': 0.58.5 + '@unocss/rule-utils': 0.58.5 css-tree: 2.3.1 dev: true @@ -2022,10 +2020,10 @@ packages: '@unocss/core': 0.42.1 dev: true - /@unocss/transformer-variant-group@0.58.4: - resolution: {integrity: sha512-zpJ4TMor7aJ3SoLJm4jNBOSqikyXUdQEO1AxkILd9Zcn7JWRgudfFXiXnFP+WGJcs9mMLoUiISxzT8SKNCckfA==} + /@unocss/transformer-variant-group@0.58.5: + resolution: {integrity: sha512-SjUwGzKK5CVqn7Gg+3v3hV47ZUll7GcGu0vR3RCLO4gqEfFlZWMTHml1Sl2sY1WAca2iVcDRu+dp0RLxRG/dUA==} dependencies: - '@unocss/core': 0.58.4 + '@unocss/core': 0.58.5 dev: true /@unocss/vite@0.42.1(vite@3.2.8): @@ -2040,38 +2038,38 @@ packages: '@unocss/scope': 0.42.1 '@unocss/transformer-directives': 0.42.1 magic-string: 0.26.7 - vite: 3.2.8(@types/node@18.19.14) + vite: 3.2.8(@types/node@20.11.24) dev: true - /@unocss/vite@0.58.4(vite@3.2.8): - resolution: {integrity: sha512-TqD5fIXv6NF3v10FFrCII//GRbkou6Dn/OzW+d4T5f0KM5+T6DutljpYUdGo0+2QXKDroUWLAspFUaZUx8iwVw==} + /@unocss/vite@0.58.5(vite@3.2.8): + resolution: {integrity: sha512-p4o1XNX1rvjmoUqSSdua8XyWNg/d+YUChDd2L/xEty+6j2qv0wUaohs3UQ87vWlv632/UmgdX+2MbrgtqthCtw==} peerDependencies: vite: ^2.9.0 || ^3.0.0-0 || ^4.0.0 || ^5.0.0-0 dependencies: '@ampproject/remapping': 2.2.1 '@rollup/pluginutils': 5.1.0 - '@unocss/config': 0.58.4 - '@unocss/core': 0.58.4 - '@unocss/inspector': 0.58.4 - '@unocss/scope': 0.58.4 - '@unocss/transformer-directives': 0.58.4 + '@unocss/config': 0.58.5 + '@unocss/core': 0.58.5 + '@unocss/inspector': 0.58.5 + '@unocss/scope': 0.58.5 + '@unocss/transformer-directives': 0.58.5 chokidar: 3.5.3 fast-glob: 3.3.2 magic-string: 0.30.6 - vite: 3.2.8(@types/node@18.19.14) + vite: 3.2.8(@types/node@20.11.24) transitivePeerDependencies: - rollup dev: true - /@vitejs/plugin-vue@5.0.3(vite@5.0.12)(vue@3.4.15): - resolution: {integrity: sha512-b8S5dVS40rgHdDrw+DQi/xOM9ed+kSRZzfm1T74bMmBDCd8XO87NKlFYInzCtwvtWwXZvo1QxE2OSspTATWrbA==} + /@vitejs/plugin-vue@5.0.4(vite@5.1.4)(vue@3.4.21): + resolution: {integrity: sha512-WS3hevEszI6CEVEx28F8RjTX97k3KsrcY6kvTg7+Whm5y3oYvcqzVeGCU3hxSAn4uY2CLCkeokkGKpoctccilQ==} engines: {node: ^18.0.0 || >=20.0.0} peerDependencies: vite: ^5.0.0 vue: ^3.2.25 dependencies: - vite: 5.0.12(@types/node@18.19.14) - vue: 3.4.15(typescript@5.3.3) + vite: 5.1.4(@types/node@20.11.24) + vue: 3.4.21(typescript@5.3.3) dev: true /@volar/language-core@1.11.1: @@ -2095,12 +2093,29 @@ packages: estree-walker: 2.0.2 source-map-js: 1.0.2 + /@vue/compiler-core@3.4.21: + resolution: {integrity: sha512-MjXawxZf2SbZszLPYxaFCjxfibYrzr3eYbKxwpLR9EQN+oaziSu3qKVbwBERj1IFIB8OLUewxB5m/BFzi613og==} + dependencies: + '@babel/parser': 7.23.9 + '@vue/shared': 3.4.21 + entities: 4.5.0 + estree-walker: 2.0.2 + source-map-js: 1.0.2 + dev: true + /@vue/compiler-dom@3.4.15: resolution: {integrity: sha512-wox0aasVV74zoXyblarOM3AZQz/Z+OunYcIHe1OsGclCHt8RsRm04DObjefaI82u6XDzv+qGWZ24tIsRAIi5MQ==} dependencies: '@vue/compiler-core': 3.4.15 '@vue/shared': 3.4.15 + /@vue/compiler-dom@3.4.21: + resolution: {integrity: sha512-IZC6FKowtT1sl0CR5DpXSiEB5ayw75oT2bma1BEhV7RRR1+cfwLrxc2Z8Zq/RGFzJ8w5r9QtCOvTjQgdn0IKmA==} + dependencies: + '@vue/compiler-core': 3.4.21 + '@vue/shared': 3.4.21 + dev: true + /@vue/compiler-sfc@3.4.15: resolution: {integrity: sha512-LCn5M6QpkpFsh3GQvs2mJUOAlBQcCco8D60Bcqmf3O3w5a+KWS5GvYbrrJBkgvL1BDnTp+e8q0lXCLgHhKguBA==} dependencies: @@ -2114,12 +2129,33 @@ packages: postcss: 8.4.33 source-map-js: 1.0.2 + /@vue/compiler-sfc@3.4.21: + resolution: {integrity: sha512-me7epoTxYlY+2CUM7hy9PCDdpMPfIwrOvAXud2Upk10g4YLv9UBW7kL798TvMeDhPthkZ0CONNrK2GoeI1ODiQ==} + dependencies: + '@babel/parser': 7.23.9 + '@vue/compiler-core': 3.4.21 + '@vue/compiler-dom': 3.4.21 + '@vue/compiler-ssr': 3.4.21 + '@vue/shared': 3.4.21 + estree-walker: 2.0.2 + magic-string: 0.30.7 + postcss: 8.4.35 + source-map-js: 1.0.2 + dev: true + /@vue/compiler-ssr@3.4.15: resolution: {integrity: sha512-1jdeQyiGznr8gjFDadVmOJqZiLNSsMa5ZgqavkPZ8O2wjHv0tVuAEsw5hTdUoUW4232vpBbL/wJhzVW/JwY1Uw==} dependencies: '@vue/compiler-dom': 3.4.15 '@vue/shared': 3.4.15 + /@vue/compiler-ssr@3.4.21: + resolution: {integrity: sha512-M5+9nI2lPpAsgXOGQobnIueVqc9sisBFexh5yMIMRAPYLa7+5wEJs8iqOZc1WAa9WQbx9GR2twgznU8LTIiZ4Q==} + dependencies: + '@vue/compiler-dom': 3.4.21 + '@vue/shared': 3.4.21 + dev: true + /@vue/devtools-api@6.5.1: resolution: {integrity: sha512-+KpckaAQyfbvshdDW5xQylLni1asvNSGme1JFs8I1+/H5pHEhqUKMEQD/qn3Nx5+/nycBq11qAEi8lk+LXI2dA==} dev: true @@ -2176,12 +2212,25 @@ packages: dependencies: '@vue/shared': 3.4.15 + /@vue/reactivity@3.4.21: + resolution: {integrity: sha512-UhenImdc0L0/4ahGCyEzc/pZNwVgcglGy9HVzJ1Bq2Mm9qXOpP8RyNTjookw/gOCUlXSEtuZ2fUg5nrHcoqJcw==} + dependencies: + '@vue/shared': 3.4.21 + dev: true + /@vue/runtime-core@3.4.15: resolution: {integrity: sha512-6E3by5m6v1AkW0McCeAyhHTw+3y17YCOKG0U0HDKDscV4Hs0kgNT5G+GCHak16jKgcCDHpI9xe5NKb8sdLCLdw==} dependencies: '@vue/reactivity': 3.4.15 '@vue/shared': 3.4.15 + /@vue/runtime-core@3.4.21: + resolution: {integrity: sha512-pQthsuYzE1XcGZznTKn73G0s14eCJcjaLvp3/DKeYWoFacD9glJoqlNBxt3W2c5S40t6CCcpPf+jG01N3ULyrA==} + dependencies: + '@vue/reactivity': 3.4.21 + '@vue/shared': 3.4.21 + dev: true + /@vue/runtime-dom@3.4.15: resolution: {integrity: sha512-EVW8D6vfFVq3V/yDKNPBFkZKGMFSvZrUQmx196o/v2tHKdwWdiZjYUBS+0Ez3+ohRyF8Njwy/6FH5gYJ75liUw==} dependencies: @@ -2189,6 +2238,14 @@ packages: '@vue/shared': 3.4.15 csstype: 3.1.3 + /@vue/runtime-dom@3.4.21: + resolution: {integrity: sha512-gvf+C9cFpevsQxbkRBS1NpU8CqxKw0ebqMvLwcGQrNpx6gqRDodqKqA+A2VZZpQ9RpK2f9yfg8VbW/EpdFUOJw==} + dependencies: + '@vue/runtime-core': 3.4.21 + '@vue/shared': 3.4.21 + csstype: 3.1.3 + dev: true + /@vue/server-renderer@3.4.15(vue@3.4.15): resolution: {integrity: sha512-3HYzaidu9cHjrT+qGUuDhFYvF/j643bHC6uUN9BgM11DVy+pM6ATsG6uPBLnkwOgs7BpJABReLmpL3ZPAsUaqw==} peerDependencies: @@ -2198,20 +2255,58 @@ packages: '@vue/shared': 3.4.15 vue: 3.4.15(typescript@5.3.3) + /@vue/server-renderer@3.4.21(vue@3.4.21): + resolution: {integrity: sha512-aV1gXyKSN6Rz+6kZ6kr5+Ll14YzmIbeuWe7ryJl5muJ4uwSwY/aStXTixx76TwkZFJLm1aAlA/HSWEJ4EyiMkg==} + peerDependencies: + vue: 3.4.21 + dependencies: + '@vue/compiler-ssr': 3.4.21 + '@vue/shared': 3.4.21 + vue: 3.4.21(typescript@5.3.3) + dev: true + /@vue/shared@3.4.15: resolution: {integrity: sha512-KzfPTxVaWfB+eGcGdbSf4CWdaXcGDqckoeXUh7SB3fZdEtzPCK2Vq9B/lRRL3yutax/LWITz+SwvgyOxz5V75g==} - /@vueuse/core@10.7.2(vue@3.4.15): + /@vue/shared@3.4.21: + resolution: {integrity: sha512-PuJe7vDIi6VYSinuEbUIQgMIRZGgM8e4R+G+/dQTk0X1NEdvgvvgv7m+rfmDH1gZzyA1OjjoWskvHlfRNfQf3g==} + dev: true + + /@vueuse/core@10.7.2(vue@3.4.21): resolution: {integrity: sha512-AOyAL2rK0By62Hm+iqQn6Rbu8bfmbgaIMXcE3TSr7BdQ42wnSFlwIdPjInO62onYsEMK/yDMU8C6oGfDAtZ2qQ==} dependencies: '@types/web-bluetooth': 0.0.20 '@vueuse/metadata': 10.7.2 - '@vueuse/shared': 10.7.2(vue@3.4.15) + '@vueuse/shared': 10.7.2(vue@3.4.21) + vue-demi: 0.14.7(vue@3.4.21) + transitivePeerDependencies: + - '@vue/composition-api' + - vue + dev: true + + /@vueuse/core@10.9.0(vue@3.4.15): + resolution: {integrity: sha512-/1vjTol8SXnx6xewDEKfS0Ra//ncg4Hb0DaZiwKf7drgfMsKFExQ+FnnENcN6efPen+1kIzhLQoGSy0eDUVOMg==} + dependencies: + '@types/web-bluetooth': 0.0.20 + '@vueuse/metadata': 10.9.0 + '@vueuse/shared': 10.9.0(vue@3.4.15) vue-demi: 0.14.7(vue@3.4.15) transitivePeerDependencies: - '@vue/composition-api' - vue + /@vueuse/core@10.9.0(vue@3.4.21): + resolution: {integrity: sha512-/1vjTol8SXnx6xewDEKfS0Ra//ncg4Hb0DaZiwKf7drgfMsKFExQ+FnnENcN6efPen+1kIzhLQoGSy0eDUVOMg==} + dependencies: + '@types/web-bluetooth': 0.0.20 + '@vueuse/metadata': 10.9.0 + '@vueuse/shared': 10.9.0(vue@3.4.21) + vue-demi: 0.14.7(vue@3.4.21) + transitivePeerDependencies: + - '@vue/composition-api' + - vue + dev: true + /@vueuse/core@8.9.4(vue@3.4.15): resolution: {integrity: sha512-B/Mdj9TK1peFyWaPof+Zf/mP9XuGAngaJZBwPaXBvU3aCTZlx3ltlrFFFyMV4iGBwsjSCeUCgZrtkEj9dS2Y3Q==} peerDependencies: @@ -2241,7 +2336,7 @@ packages: - '@vue/composition-api' dev: true - /@vueuse/integrations@10.7.2(focus-trap@7.5.4)(vue@3.4.15): + /@vueuse/integrations@10.7.2(focus-trap@7.5.4)(vue@3.4.21): resolution: {integrity: sha512-+u3RLPFedjASs5EKPc69Ge49WNgqeMfSxFn+qrQTzblPXZg6+EFzhjarS5edj2qAf6xQ93f95TUxRwKStXj/sQ==} peerDependencies: async-validator: '*' @@ -2282,10 +2377,10 @@ packages: universal-cookie: optional: true dependencies: - '@vueuse/core': 10.7.2(vue@3.4.15) - '@vueuse/shared': 10.7.2(vue@3.4.15) + '@vueuse/core': 10.7.2(vue@3.4.21) + '@vueuse/shared': 10.7.2(vue@3.4.21) focus-trap: 7.5.4 - vue-demi: 0.14.7(vue@3.4.15) + vue-demi: 0.14.7(vue@3.4.21) transitivePeerDependencies: - '@vue/composition-api' - vue @@ -2293,6 +2388,10 @@ packages: /@vueuse/metadata@10.7.2: resolution: {integrity: sha512-kCWPb4J2KGrwLtn1eJwaJD742u1k5h6v/St5wFe8Quih90+k2a0JP8BS4Zp34XUuJqS2AxFYMb1wjUL8HfhWsQ==} + dev: true + + /@vueuse/metadata@10.9.0: + resolution: {integrity: sha512-iddNbg3yZM0X7qFY2sAotomgdHK7YJ6sKUvQqbvwnf7TmaVPxS4EJydcNsVejNdS8iWCtDk+fYXr7E32nyTnGA==} /@vueuse/metadata@8.9.4: resolution: {integrity: sha512-IwSfzH80bnJMzqhaapqJl9JRIiyQU0zsRGEgnxN6jhq7992cPUJIRfV+JHRIZXjYqbwt07E1gTEp0R0zPJ1aqw==} @@ -2303,7 +2402,7 @@ packages: peerDependencies: vue: '>=3.0.0' dependencies: - '@vueuse/core': 10.7.2(vue@3.4.15) + '@vueuse/core': 10.9.0(vue@3.4.15) '@vueuse/shared': 10.7.2(vue@3.4.15) csstype: 3.1.3 framesync: 6.1.2 @@ -2325,6 +2424,33 @@ packages: transitivePeerDependencies: - '@vue/composition-api' - vue + dev: true + + /@vueuse/shared@10.7.2(vue@3.4.21): + resolution: {integrity: sha512-qFbXoxS44pi2FkgFjPvF4h7c9oMDutpyBdcJdMYIMg9XyXli2meFMuaKn+UMgsClo//Th6+beeCgqweT/79BVA==} + dependencies: + vue-demi: 0.14.7(vue@3.4.21) + transitivePeerDependencies: + - '@vue/composition-api' + - vue + dev: true + + /@vueuse/shared@10.9.0(vue@3.4.15): + resolution: {integrity: sha512-Uud2IWncmAfJvRaFYzv5OHDli+FbOzxiVEQdLCKQKLyhz94PIyFC3CHcH7EDMwIn8NPtD06+PNbC/PiO0LGLtw==} + dependencies: + vue-demi: 0.14.7(vue@3.4.15) + transitivePeerDependencies: + - '@vue/composition-api' + - vue + + /@vueuse/shared@10.9.0(vue@3.4.21): + resolution: {integrity: sha512-Uud2IWncmAfJvRaFYzv5OHDli+FbOzxiVEQdLCKQKLyhz94PIyFC3CHcH7EDMwIn8NPtD06+PNbC/PiO0LGLtw==} + dependencies: + vue-demi: 0.14.7(vue@3.4.21) + transitivePeerDependencies: + - '@vue/composition-api' + - vue + dev: true /@vueuse/shared@8.9.4(vue@3.4.15): resolution: {integrity: sha512-wt+T30c4K6dGRMVqPddexEVLa28YwxW5OFIPmzUHICjphfAuBFTTdDoyqREZNDOFJZ44ARH1WWQNCUK8koJ+Ag==} @@ -3460,22 +3586,22 @@ packages: requiresBuild: true dev: true - /eslint-compat-utils@0.1.2(eslint@8.56.0): + /eslint-compat-utils@0.1.2(eslint@8.57.0): resolution: {integrity: sha512-Jia4JDldWnFNIru1Ehx1H5s9/yxiRHY/TimCuUc0jNexew3cF1gI6CYZil1ociakfWO3rRqFjl1mskBblB3RYg==} engines: {node: '>=12'} peerDependencies: eslint: '>=6.0.0' dependencies: - eslint: 8.56.0 + eslint: 8.57.0 dev: true - /eslint-compat-utils@0.4.1(eslint@8.56.0): + /eslint-compat-utils@0.4.1(eslint@8.57.0): resolution: {integrity: sha512-5N7ZaJG5pZxUeNNJfUchurLVrunD1xJvyg5kYOIVF8kg1f3ajTikmAu/5fZ9w100omNPOoMjngRszh/Q/uFGMg==} engines: {node: '>=12'} peerDependencies: eslint: '>=6.0.0' dependencies: - eslint: 8.56.0 + eslint: 8.57.0 semver: 7.5.4 dev: true @@ -3495,15 +3621,15 @@ packages: - supports-color dev: true - /eslint-merge-processors@0.1.0(eslint@8.56.0): + /eslint-merge-processors@0.1.0(eslint@8.57.0): resolution: {integrity: sha512-IvRXXtEajLeyssvW4wJcZ2etxkR9mUf4zpNwgI+m/Uac9RfXHskuJefkHUcawVzePnd6xp24enp5jfgdHzjRdQ==} peerDependencies: eslint: '*' dependencies: - eslint: 8.56.0 + eslint: 8.57.0 dev: true - /eslint-module-utils@2.8.0(@typescript-eslint/parser@6.20.0)(eslint-import-resolver-node@0.3.9)(eslint@8.56.0): + /eslint-module-utils@2.8.0(@typescript-eslint/parser@6.20.0)(eslint-import-resolver-node@0.3.9)(eslint@8.57.0): resolution: {integrity: sha512-aWajIYfsqCKRDgUfjEXNN/JlrzauMuSEy5sbd7WXbtW3EH6A6MpwEh42c7qD+MqQo9QMJ6fWLAeIJynx0g6OAw==} engines: {node: '>=4'} peerDependencies: @@ -3524,46 +3650,46 @@ packages: eslint-import-resolver-webpack: optional: true dependencies: - '@typescript-eslint/parser': 6.20.0(eslint@8.56.0)(typescript@5.3.3) + '@typescript-eslint/parser': 6.20.0(eslint@8.57.0)(typescript@5.3.3) debug: 3.2.7 - eslint: 8.56.0 + eslint: 8.57.0 eslint-import-resolver-node: 0.3.9 transitivePeerDependencies: - supports-color dev: true - /eslint-plugin-antfu@2.1.2(eslint@8.56.0): + /eslint-plugin-antfu@2.1.2(eslint@8.57.0): resolution: {integrity: sha512-s7ZTOM3uq0iqpp6gF0UEotnvup7f2PHBUftCytLZX0+6C9j9KadKZQh6bVVngAyFgsmeD9+gcBopOYLClb2oDg==} peerDependencies: eslint: '*' dependencies: - eslint: 8.56.0 + eslint: 8.57.0 dev: true - /eslint-plugin-es-x@7.5.0(eslint@8.56.0): + /eslint-plugin-es-x@7.5.0(eslint@8.57.0): resolution: {integrity: sha512-ODswlDSO0HJDzXU0XvgZ3lF3lS3XAZEossh15Q2UHjwrJggWeBoKqqEsLTZLXl+dh5eOAozG0zRcYtuE35oTuQ==} engines: {node: ^14.18.0 || >=16.0.0} peerDependencies: eslint: '>=8' dependencies: - '@eslint-community/eslint-utils': 4.4.0(eslint@8.56.0) + '@eslint-community/eslint-utils': 4.4.0(eslint@8.57.0) '@eslint-community/regexpp': 4.10.0 - eslint: 8.56.0 - eslint-compat-utils: 0.1.2(eslint@8.56.0) + eslint: 8.57.0 + eslint-compat-utils: 0.1.2(eslint@8.57.0) dev: true - /eslint-plugin-eslint-comments@3.2.0(eslint@8.56.0): + /eslint-plugin-eslint-comments@3.2.0(eslint@8.57.0): resolution: {integrity: sha512-0jkOl0hfojIHHmEHgmNdqv4fmh7300NdpA9FFpF7zaoLvB/QeXOGNLIo86oAveJFrfB1p05kC8hpEMHM8DwWVQ==} engines: {node: '>=6.5.0'} peerDependencies: eslint: '>=4.19.1' dependencies: escape-string-regexp: 1.0.5 - eslint: 8.56.0 + eslint: 8.57.0 ignore: 5.3.1 dev: true - /eslint-plugin-i@2.29.1(@typescript-eslint/parser@6.20.0)(eslint@8.56.0): + /eslint-plugin-i@2.29.1(@typescript-eslint/parser@6.20.0)(eslint@8.57.0): resolution: {integrity: sha512-ORizX37MelIWLbMyqI7hi8VJMf7A0CskMmYkB+lkCX3aF4pkGV7kwx5bSEb4qx7Yce2rAf9s34HqDRPjGRZPNQ==} engines: {node: '>=12'} peerDependencies: @@ -3571,9 +3697,9 @@ packages: dependencies: debug: 4.3.4 doctrine: 3.0.0 - eslint: 8.56.0 + eslint: 8.57.0 eslint-import-resolver-node: 0.3.9 - eslint-module-utils: 2.8.0(@typescript-eslint/parser@6.20.0)(eslint-import-resolver-node@0.3.9)(eslint@8.56.0) + eslint-module-utils: 2.8.0(@typescript-eslint/parser@6.20.0)(eslint-import-resolver-node@0.3.9)(eslint@8.57.0) get-tsconfig: 4.7.2 is-glob: 4.0.3 minimatch: 3.1.2 @@ -3585,7 +3711,7 @@ packages: - supports-color dev: true - /eslint-plugin-jsdoc@48.0.4(eslint@8.56.0): + /eslint-plugin-jsdoc@48.0.4(eslint@8.57.0): resolution: {integrity: sha512-A0cH+5svWPXzGZszBjXA1t0aAqVGS+/x3i02KFmb73rU0iMLnadEcVWcD/dGBZHIfAMKr3YpWh58f6wn4N909w==} engines: {node: '>=18'} peerDependencies: @@ -3596,7 +3722,7 @@ packages: comment-parser: 1.4.1 debug: 4.3.4 escape-string-regexp: 4.0.0 - eslint: 8.56.0 + eslint: 8.57.0 esquery: 1.5.0 is-builtin-module: 3.2.1 semver: 7.5.4 @@ -3605,15 +3731,15 @@ packages: - supports-color dev: true - /eslint-plugin-jsonc@2.13.0(eslint@8.56.0): + /eslint-plugin-jsonc@2.13.0(eslint@8.57.0): resolution: {integrity: sha512-2wWdJfpO/UbZzPDABuUVvlUQjfMJa2p2iQfYt/oWxOMpXCcjuiMUSaA02gtY/Dbu82vpaSqc+O7Xq6ECHwtIxA==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} peerDependencies: eslint: '>=6.0.0' dependencies: - '@eslint-community/eslint-utils': 4.4.0(eslint@8.56.0) - eslint: 8.56.0 - eslint-compat-utils: 0.4.1(eslint@8.56.0) + '@eslint-community/eslint-utils': 4.4.0(eslint@8.57.0) + eslint: 8.57.0 + eslint-compat-utils: 0.4.1(eslint@8.57.0) espree: 9.6.1 graphemer: 1.4.0 jsonc-eslint-parser: 2.4.0 @@ -3621,28 +3747,28 @@ packages: synckit: 0.6.2 dev: true - /eslint-plugin-markdown@3.0.1(eslint@8.56.0): + /eslint-plugin-markdown@3.0.1(eslint@8.57.0): resolution: {integrity: sha512-8rqoc148DWdGdmYF6WSQFT3uQ6PO7zXYgeBpHAOAakX/zpq+NvFYbDA/H7PYzHajwtmaOzAwfxyl++x0g1/N9A==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} peerDependencies: eslint: ^6.0.0 || ^7.0.0 || ^8.0.0 dependencies: - eslint: 8.56.0 + eslint: 8.57.0 mdast-util-from-markdown: 0.8.5 transitivePeerDependencies: - supports-color dev: true - /eslint-plugin-n@16.6.2(eslint@8.56.0): + /eslint-plugin-n@16.6.2(eslint@8.57.0): resolution: {integrity: sha512-6TyDmZ1HXoFQXnhCTUjVFULReoBPOAjpuiKELMkeP40yffI/1ZRO+d9ug/VC6fqISo2WkuIBk3cvuRPALaWlOQ==} engines: {node: '>=16.0.0'} peerDependencies: eslint: '>=7.0.0' dependencies: - '@eslint-community/eslint-utils': 4.4.0(eslint@8.56.0) + '@eslint-community/eslint-utils': 4.4.0(eslint@8.57.0) builtins: 5.0.1 - eslint: 8.56.0 - eslint-plugin-es-x: 7.5.0(eslint@8.56.0) + eslint: 8.57.0 + eslint-plugin-es-x: 7.5.0(eslint@8.57.0) get-tsconfig: 4.7.2 globals: 13.24.0 ignore: 5.3.1 @@ -3658,7 +3784,7 @@ packages: engines: {node: '>=5.0.0'} dev: true - /eslint-plugin-perfectionist@2.5.0(eslint@8.56.0)(typescript@5.3.3)(vue-eslint-parser@9.4.2): + /eslint-plugin-perfectionist@2.5.0(eslint@8.57.0)(typescript@5.3.3)(vue-eslint-parser@9.4.2): resolution: {integrity: sha512-F6XXcq4mKKUe/SREoMGQqzgw6cgCgf3pFzkFfQVIGtqD1yXVpQjnhTepzhBeZfxZwgMzR9HO4yH4CUhIQ2WBcQ==} peerDependencies: astro-eslint-parser: ^0.16.0 @@ -3676,44 +3802,44 @@ packages: vue-eslint-parser: optional: true dependencies: - '@typescript-eslint/utils': 6.20.0(eslint@8.56.0)(typescript@5.3.3) - eslint: 8.56.0 + '@typescript-eslint/utils': 6.20.0(eslint@8.57.0)(typescript@5.3.3) + eslint: 8.57.0 minimatch: 9.0.3 natural-compare-lite: 1.4.0 - vue-eslint-parser: 9.4.2(eslint@8.56.0) + vue-eslint-parser: 9.4.2(eslint@8.57.0) transitivePeerDependencies: - supports-color - typescript dev: true - /eslint-plugin-toml@0.9.2(eslint@8.56.0): + /eslint-plugin-toml@0.9.2(eslint@8.57.0): resolution: {integrity: sha512-ri0xf63PYf3pIq/WY9BIwrqxZmGTIwSkAO0bHddI0ajUwN4KGz6W8vOvdXFHOpRdRfzxlmXze/vfsY/aTEXESg==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} peerDependencies: eslint: '>=6.0.0' dependencies: debug: 4.3.4 - eslint: 8.56.0 - eslint-compat-utils: 0.4.1(eslint@8.56.0) + eslint: 8.57.0 + eslint-compat-utils: 0.4.1(eslint@8.57.0) lodash: 4.17.21 toml-eslint-parser: 0.9.3 transitivePeerDependencies: - supports-color dev: true - /eslint-plugin-unicorn@50.0.1(eslint@8.56.0): + /eslint-plugin-unicorn@50.0.1(eslint@8.57.0): resolution: {integrity: sha512-KxenCZxqSYW0GWHH18okDlOQcpezcitm5aOSz6EnobyJ6BIByiPDviQRjJIUAjG/tMN11958MxaQ+qCoU6lfDA==} engines: {node: '>=16'} peerDependencies: eslint: '>=8.56.0' dependencies: '@babel/helper-validator-identifier': 7.22.20 - '@eslint-community/eslint-utils': 4.4.0(eslint@8.56.0) + '@eslint-community/eslint-utils': 4.4.0(eslint@8.57.0) '@eslint/eslintrc': 2.1.4 ci-info: 4.0.0 clean-regexp: 1.0.0 core-js-compat: 3.35.1 - eslint: 8.56.0 + eslint: 8.57.0 esquery: 1.5.0 indent-string: 4.0.0 is-builtin-module: 3.2.1 @@ -3728,7 +3854,7 @@ packages: - supports-color dev: true - /eslint-plugin-unused-imports@3.0.0(@typescript-eslint/eslint-plugin@6.20.0)(eslint@8.56.0): + /eslint-plugin-unused-imports@3.0.0(@typescript-eslint/eslint-plugin@6.20.0)(eslint@8.57.0): resolution: {integrity: sha512-sduiswLJfZHeeBJ+MQaG+xYzSWdRXoSw61DpU13mzWumCkR0ufD0HmO4kdNokjrkluMHpj/7PJeN35pgbhW3kw==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} peerDependencies: @@ -3738,12 +3864,12 @@ packages: '@typescript-eslint/eslint-plugin': optional: true dependencies: - '@typescript-eslint/eslint-plugin': 6.20.0(@typescript-eslint/parser@6.20.0)(eslint@8.56.0)(typescript@5.3.3) - eslint: 8.56.0 + '@typescript-eslint/eslint-plugin': 6.20.0(@typescript-eslint/parser@6.20.0)(eslint@8.57.0)(typescript@5.3.3) + eslint: 8.57.0 eslint-rule-composer: 0.3.0 dev: true - /eslint-plugin-vitest@0.3.21(@typescript-eslint/eslint-plugin@6.20.0)(eslint@8.56.0)(typescript@5.3.3): + /eslint-plugin-vitest@0.3.21(@typescript-eslint/eslint-plugin@6.20.0)(eslint@8.57.0)(typescript@5.3.3): resolution: {integrity: sha512-oYwR1MrwaBw/OG6CKU+SJYleAc442w6CWL1RTQl5WLwy8X3sh0bgHIQk5iEtmTak3Q+XAvZglr0bIoDOjFdkcw==} engines: {node: ^18.0.0 || >= 20.0.0} peerDependencies: @@ -3756,41 +3882,41 @@ packages: vitest: optional: true dependencies: - '@typescript-eslint/eslint-plugin': 6.20.0(@typescript-eslint/parser@6.20.0)(eslint@8.56.0)(typescript@5.3.3) - '@typescript-eslint/utils': 6.20.0(eslint@8.56.0)(typescript@5.3.3) - eslint: 8.56.0 + '@typescript-eslint/eslint-plugin': 6.20.0(@typescript-eslint/parser@6.20.0)(eslint@8.57.0)(typescript@5.3.3) + '@typescript-eslint/utils': 6.20.0(eslint@8.57.0)(typescript@5.3.3) + eslint: 8.57.0 transitivePeerDependencies: - supports-color - typescript dev: true - /eslint-plugin-vue@9.21.1(eslint@8.56.0): + /eslint-plugin-vue@9.21.1(eslint@8.57.0): resolution: {integrity: sha512-XVtI7z39yOVBFJyi8Ljbn7kY9yHzznKXL02qQYn+ta63Iy4A9JFBw6o4OSB9hyD2++tVT+su9kQqetUyCCwhjw==} engines: {node: ^14.17.0 || >=16.0.0} peerDependencies: eslint: ^6.2.0 || ^7.0.0 || ^8.0.0 dependencies: - '@eslint-community/eslint-utils': 4.4.0(eslint@8.56.0) - eslint: 8.56.0 + '@eslint-community/eslint-utils': 4.4.0(eslint@8.57.0) + eslint: 8.57.0 natural-compare: 1.4.0 nth-check: 2.1.1 postcss-selector-parser: 6.0.15 semver: 7.5.4 - vue-eslint-parser: 9.4.2(eslint@8.56.0) + vue-eslint-parser: 9.4.2(eslint@8.57.0) xml-name-validator: 4.0.0 transitivePeerDependencies: - supports-color dev: true - /eslint-plugin-yml@1.12.2(eslint@8.56.0): + /eslint-plugin-yml@1.12.2(eslint@8.57.0): resolution: {integrity: sha512-hvS9p08FhPT7i/ynwl7/Wt7ke7Rf4P2D6fT8lZlL43peZDTsHtH2A0SIFQ7Kt7+mJ6if6P+FX3iJhMkdnxQwpg==} engines: {node: ^14.17.0 || >=16.0.0} peerDependencies: eslint: '>=6.0.0' dependencies: debug: 4.3.4 - eslint: 8.56.0 - eslint-compat-utils: 0.4.1(eslint@8.56.0) + eslint: 8.57.0 + eslint-compat-utils: 0.4.1(eslint@8.57.0) lodash: 4.17.21 natural-compare: 1.4.0 yaml-eslint-parser: 1.2.2 @@ -3798,14 +3924,14 @@ packages: - supports-color dev: true - /eslint-processor-vue-blocks@0.1.1(@vue/compiler-sfc@3.4.15)(eslint@8.56.0): + /eslint-processor-vue-blocks@0.1.1(@vue/compiler-sfc@3.4.15)(eslint@8.57.0): resolution: {integrity: sha512-9+dU5lU881log570oBwpelaJmOfOzSniben7IWEDRYQPPWwlvaV7NhOtsTuUWDqpYT+dtKKWPsgz4OkOi+aZnA==} peerDependencies: '@vue/compiler-sfc': ^3.3.0 eslint: ^8.50.0 dependencies: '@vue/compiler-sfc': 3.4.15 - eslint: 8.56.0 + eslint: 8.57.0 dev: true /eslint-rule-composer@0.3.0: @@ -3826,15 +3952,15 @@ packages: engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} dev: true - /eslint@8.56.0: - resolution: {integrity: sha512-Go19xM6T9puCOWntie1/P997aXxFsOi37JIHRWI514Hc6ZnaHGKY9xFhrU65RT6CcBEzZoGG1e6Nq+DT04ZtZQ==} + /eslint@8.57.0: + resolution: {integrity: sha512-dZ6+mexnaTIbSBZWgou51U6OmzIhYM2VcNdtiTtI7qPNZm35Akpr0f6vtw3w1Kmn5PYo+tZVfh13WrhpS6oLqQ==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} hasBin: true dependencies: - '@eslint-community/eslint-utils': 4.4.0(eslint@8.56.0) + '@eslint-community/eslint-utils': 4.4.0(eslint@8.57.0) '@eslint-community/regexpp': 4.10.0 '@eslint/eslintrc': 2.1.4 - '@eslint/js': 8.56.0 + '@eslint/js': 8.57.0 '@humanwhocodes/config-array': 0.11.14 '@humanwhocodes/module-importer': 1.0.1 '@nodelib/fs.walk': 1.2.8 @@ -4030,7 +4156,7 @@ packages: resolution: {integrity: sha512-36yxDn5H7OFZQla0/jFJmbIKTdZAQHngCedGxiMmpNfEZM0sdEeT+WczLQrjK6D7o2aiyLYDnkw0R3JK0Qv1RQ==} dev: true - /floating-vue@5.2.2(vue@3.4.15): + /floating-vue@5.2.2(vue@3.4.21): resolution: {integrity: sha512-afW+h2CFafo+7Y9Lvw/xsqjaQlKLdJV7h1fCHfcYQ1C4SVMlu7OAekqWgu5d4SgvkBVU0pVpLlVsrSTBURFRkg==} peerDependencies: '@nuxt/kit': ^3.2.0 @@ -4040,8 +4166,8 @@ packages: optional: true dependencies: '@floating-ui/dom': 1.1.1 - vue: 3.4.15(typescript@5.3.3) - vue-resize: 2.0.0-alpha.1(vue@3.4.15) + vue: 3.4.21(typescript@5.3.3) + vue-resize: 2.0.0-alpha.1(vue@3.4.21) dev: true /focus-trap@7.5.4: @@ -4631,6 +4757,13 @@ packages: dependencies: '@jridgewell/sourcemap-codec': 1.4.15 + /magic-string@0.30.7: + resolution: {integrity: sha512-8vBuFF/I/+OSLRmdf2wwFCJCz+nSn0m6DPvGH1fS/KiQoSaR+sETbov0eIk9KhEKy8CYqIkIAnbohxT/4H0kuA==} + engines: {node: '>=12'} + dependencies: + '@jridgewell/sourcemap-codec': 1.4.15 + dev: true + /mark.js@8.11.1: resolution: {integrity: sha512-1I+1qpDt4idfgLQG+BNWmrqku+7/2bi5nLf4YwF8y8zXvmfiTBY3PV3ZibfrjBueCByROpuBjLLFCajqkgYoLQ==} dev: true @@ -5453,6 +5586,15 @@ packages: picocolors: 1.0.0 source-map-js: 1.0.2 + /postcss@8.4.35: + resolution: {integrity: sha512-u5U8qYpBCpN13BsiEB0CbR1Hhh4Gc0zLFuedrHJKMctHCHAGrMdG0PRM/KErzAL3CU6/eckEtmHNB3x6e3c0vA==} + engines: {node: ^10 || ^12 || >=14} + dependencies: + nanoid: 3.3.7 + picocolors: 1.0.0 + source-map-js: 1.0.2 + dev: true + /preact@10.5.14: resolution: {integrity: sha512-KojoltCrshZ099ksUZ2OQKfbH66uquFoxHSbnwKbTJHeQNvx42EmC7wQVWNuDt6vC5s3nudRHFtKbpY4ijKlaQ==} dev: true @@ -5680,16 +5822,10 @@ packages: engines: {node: '>=8'} dev: true - /shiki@1.0.0-beta.4: - resolution: {integrity: sha512-bY7Hz1+kWsSeimt+AWoBSrpUKzd5KivteL880z+UdgfMDuDsi8apk+0TXb/U37Y6aCBnI3jKmD4SEbmk+CHZ+Q==} - dependencies: - '@shikijs/core': 1.0.0-beta.4 - dev: true - - /shiki@1.0.0-beta.5: - resolution: {integrity: sha512-S5FV55ZH8zLicVyqlJZj8LYqh/VuUICDDNG/L9eDM9I4d69EX+FbgSnKRIuJIwLrmJfTiPoGVnH1HsHX5whP/g==} + /shiki@1.1.7: + resolution: {integrity: sha512-9kUTMjZtcPH3i7vHunA6EraTPpPOITYTdA5uMrvsJRexktqP0s7P3s9HVK80b4pP42FRVe03D7fT3NmJv2yYhw==} dependencies: - '@shikijs/core': 1.0.0-beta.5 + '@shikijs/core': 1.1.7 dev: true /signal-exit@3.0.7: @@ -5930,24 +6066,30 @@ packages: resolution: {integrity: sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==} dev: true - /twoslash-vue@0.1.0(typescript@5.3.3): - resolution: {integrity: sha512-4IVOdvQcjLY5KTrsR9GuTUAThhpYQqkkKawCtfUaTSkui3CXR2KPYBJMvY5yM1by+TkENBlW1ykLywP2BGukHg==} + /twoslash-protocol@0.2.4: + resolution: {integrity: sha512-AEGTJj4mFGfvQc/M6qi0+s82Zq+mxLcjWZU+EUHGG8LQElyHDs+uDR+/3+m1l+WP7WL+QmWrVzFXgFX+hBg+bg==} + dev: true + + /twoslash-vue@0.2.4(typescript@5.3.3): + resolution: {integrity: sha512-AIcsYRSxn5WuZC+dD7/n99s1UEY6e5IljoGL3YijQvI/pylgsKk5sWXptp5NrRTH0srBLXoeVpE1re1Eo6eiJw==} peerDependencies: typescript: '*' dependencies: '@vue/language-core': 1.8.27(typescript@5.3.3) - twoslash: 0.1.0(typescript@5.3.3) + twoslash: 0.2.4(typescript@5.3.3) + twoslash-protocol: 0.2.4 typescript: 5.3.3 transitivePeerDependencies: - supports-color dev: true - /twoslash@0.1.0(typescript@5.3.3): - resolution: {integrity: sha512-zvDn23/FwNdi/i2xMTTDcn7xnX4iKlp6tJt68aD86zRqesQrb/HOnMBtaUu6+vme4gtlX9ScEfKYog1+7IPKSw==} + /twoslash@0.2.4(typescript@5.3.3): + resolution: {integrity: sha512-hc3y11BjLHP4kV37TR6lUKksxpZp0LQi9kCy95ka6qobye/gV49PqXZIuWlRaRVGNvp4AJBMg8aiwkp0M8x/nQ==} peerDependencies: typescript: '*' dependencies: '@typescript/vfs': 1.5.0 + twoslash-protocol: 0.2.4 typescript: 5.3.3 transitivePeerDependencies: - supports-color @@ -6130,11 +6272,11 @@ packages: - vite dev: true - /unocss@0.58.4(postcss@8.4.33)(vite@3.2.8): - resolution: {integrity: sha512-JYeQddAIObJPr6nuxahOgku0MIzjIaQ2P73KtJr0zSuzx6kiq20jf67FgDIOP1Ks6s7iJd7Ga3yuY2h49XjDjg==} + /unocss@0.58.5(postcss@8.4.33)(vite@3.2.8): + resolution: {integrity: sha512-0g4P6jLgRRNnhscxw7nQ9RHGrKJ1UPPiHPet+YT3TXUcmy4mTiYgo9+kGQf5bjyrzsELJ10cT6Qz2y6g9Tls4g==} engines: {node: '>=14'} peerDependencies: - '@unocss/webpack': 0.58.4 + '@unocss/webpack': 0.58.5 vite: ^2.9.0 || ^3.0.0-0 || ^4.0.0 || ^5.0.0-0 peerDependenciesMeta: '@unocss/webpack': @@ -6142,35 +6284,35 @@ packages: vite: optional: true dependencies: - '@unocss/astro': 0.58.4(vite@3.2.8) - '@unocss/cli': 0.58.4 - '@unocss/core': 0.58.4 - '@unocss/extractor-arbitrary-variants': 0.58.4 - '@unocss/postcss': 0.58.4(postcss@8.4.33) - '@unocss/preset-attributify': 0.58.4 - '@unocss/preset-icons': 0.58.4 - '@unocss/preset-mini': 0.58.4 - '@unocss/preset-tagify': 0.58.4 - '@unocss/preset-typography': 0.58.4 - '@unocss/preset-uno': 0.58.4 - '@unocss/preset-web-fonts': 0.58.4 - '@unocss/preset-wind': 0.58.4 - '@unocss/reset': 0.58.4 - '@unocss/transformer-attributify-jsx': 0.58.4 - '@unocss/transformer-attributify-jsx-babel': 0.58.4 - '@unocss/transformer-compile-class': 0.58.4 - '@unocss/transformer-directives': 0.58.4 - '@unocss/transformer-variant-group': 0.58.4 - '@unocss/vite': 0.58.4(vite@3.2.8) - vite: 3.2.8(@types/node@18.19.14) + '@unocss/astro': 0.58.5(vite@3.2.8) + '@unocss/cli': 0.58.5 + '@unocss/core': 0.58.5 + '@unocss/extractor-arbitrary-variants': 0.58.5 + '@unocss/postcss': 0.58.5(postcss@8.4.33) + '@unocss/preset-attributify': 0.58.5 + '@unocss/preset-icons': 0.58.5 + '@unocss/preset-mini': 0.58.5 + '@unocss/preset-tagify': 0.58.5 + '@unocss/preset-typography': 0.58.5 + '@unocss/preset-uno': 0.58.5 + '@unocss/preset-web-fonts': 0.58.5 + '@unocss/preset-wind': 0.58.5 + '@unocss/reset': 0.58.5 + '@unocss/transformer-attributify-jsx': 0.58.5 + '@unocss/transformer-attributify-jsx-babel': 0.58.5 + '@unocss/transformer-compile-class': 0.58.5 + '@unocss/transformer-directives': 0.58.5 + '@unocss/transformer-variant-group': 0.58.5 + '@unocss/vite': 0.58.5(vite@3.2.8) + vite: 3.2.8(@types/node@20.11.24) transitivePeerDependencies: - postcss - rollup - supports-color dev: true - /unplugin-icons@0.18.3(@vue/compiler-sfc@3.4.15): - resolution: {integrity: sha512-6EHPMXOq7XL8JAULzX0o3KqOsJHhYfpDfB1WvBWwZJH/PutIkV/ahRpHytucQ1evfRFuv/DVIozEmFIhP1xRxA==} + /unplugin-icons@0.18.5(@vue/compiler-sfc@3.4.15): + resolution: {integrity: sha512-KVNAohXbZ7tVcG1C3p6QaC7wU9Qrj7etv4XvsMMJAxr5LccQZ+Iuv5LOIv/7GtqXaGN1BuFCqRO1ErsHEgEXdQ==} peerDependencies: '@svgr/core': '>=7.0.0' '@svgx/core': ^1.0.1 @@ -6191,7 +6333,7 @@ packages: dependencies: '@antfu/install-pkg': 0.3.1 '@antfu/utils': 0.7.7 - '@iconify/utils': 2.1.20 + '@iconify/utils': 2.1.22 '@vue/compiler-sfc': 3.4.15 debug: 4.3.4 kolorist: 1.8.0 @@ -6323,7 +6465,7 @@ packages: perfect-debounce: 1.0.0 picocolors: 1.0.0 sirv: 2.0.4 - vite: 3.2.8(@types/node@18.19.14) + vite: 3.2.8(@types/node@20.11.24) transitivePeerDependencies: - rollup - supports-color @@ -6337,13 +6479,13 @@ packages: '@windicss/plugin-utils': 1.9.3 debug: 4.3.4 kolorist: 1.8.0 - vite: 3.2.8(@types/node@18.19.14) + vite: 3.2.8(@types/node@20.11.24) windicss: 3.5.6 transitivePeerDependencies: - supports-color dev: true - /vite@3.2.8(@types/node@18.19.14): + /vite@3.2.8(@types/node@20.11.24): resolution: {integrity: sha512-EtQU16PLIJpAZol2cTLttNP1mX6L0SyI0pgQB1VOoWeQnMSvtiwovV3D6NcjN8CZQWWyESD2v5NGnpz5RvgOZA==} engines: {node: ^14.18.0 || >=16.0.0} hasBin: true @@ -6368,7 +6510,7 @@ packages: terser: optional: true dependencies: - '@types/node': 18.19.14 + '@types/node': 20.11.24 esbuild: 0.15.18 postcss: 8.4.33 resolve: 1.22.8 @@ -6377,8 +6519,8 @@ packages: fsevents: 2.3.3 dev: true - /vite@5.0.12(@types/node@18.19.14): - resolution: {integrity: sha512-4hsnEkG3q0N4Tzf1+t6NdN9dg/L3BM+q8SWgbSPnJvrgH2kgdyzfVJwbR1ic69/4uMJJ/3dqDZZE5/WwqW8U1w==} + /vite@5.1.4(@types/node@20.11.24): + resolution: {integrity: sha512-n+MPqzq+d9nMVTKyewqw6kSt+R3CkvF9QAKY8obiQn8g1fwTscKxyfaYnC632HtBXAQGc1Yjomphwn1dtwGAHg==} engines: {node: ^18.0.0 || >=20.0.0} hasBin: true peerDependencies: @@ -6405,20 +6547,20 @@ packages: terser: optional: true dependencies: - '@types/node': 18.19.14 + '@types/node': 20.11.24 esbuild: 0.19.12 - postcss: 8.4.33 + postcss: 8.4.35 rollup: 4.9.6 optionalDependencies: fsevents: 2.3.3 dev: true - /vitepress@1.0.0-rc.41(@algolia/client-search@4.22.1)(@types/node@18.19.14)(postcss@8.4.33)(search-insights@2.13.0)(typescript@5.3.3): - resolution: {integrity: sha512-PAEoIIc9J//k/Wg39C6k86hZpXPmLZjRiTBwieDNeYGdevD7xr5Ve8o1W/w+e9dtyQMkuvzgianEamXDX3aj7g==} + /vitepress@1.0.0-rc.44(@algolia/client-search@4.22.1)(@types/node@20.11.24)(postcss@8.4.33)(search-insights@2.13.0)(typescript@5.3.3): + resolution: {integrity: sha512-tO5taxGI7fSpBK1D8zrZTyJJERlyU9nnt0jHSt3fywfq3VKn977Hg0wUuTkEmwXlFYwuW26+6+3xorf4nD3XvA==} hasBin: true peerDependencies: markdown-it-mathjax3: ^4.3.2 - postcss: ^8.4.33 + postcss: ^8.4.35 peerDependenciesMeta: markdown-it-mathjax3: optional: true @@ -6427,20 +6569,20 @@ packages: dependencies: '@docsearch/css': 3.5.2 '@docsearch/js': 3.5.2(@algolia/client-search@4.22.1)(search-insights@2.13.0) - '@shikijs/core': 1.0.0-beta.5 - '@shikijs/transformers': 1.0.0-beta.4 + '@shikijs/core': 1.1.7 + '@shikijs/transformers': 1.1.7 '@types/markdown-it': 13.0.7 - '@vitejs/plugin-vue': 5.0.3(vite@5.0.12)(vue@3.4.15) + '@vitejs/plugin-vue': 5.0.4(vite@5.1.4)(vue@3.4.21) '@vue/devtools-api': 7.0.14 - '@vueuse/core': 10.7.2(vue@3.4.15) - '@vueuse/integrations': 10.7.2(focus-trap@7.5.4)(vue@3.4.15) + '@vueuse/core': 10.9.0(vue@3.4.21) + '@vueuse/integrations': 10.7.2(focus-trap@7.5.4)(vue@3.4.21) focus-trap: 7.5.4 mark.js: 8.11.1 minisearch: 6.3.0 postcss: 8.4.33 - shiki: 1.0.0-beta.5 - vite: 5.0.12(@types/node@18.19.14) - vue: 3.4.15(typescript@5.3.3) + shiki: 1.1.7 + vite: 5.1.4(@types/node@20.11.24) + vue: 3.4.21(typescript@5.3.3) transitivePeerDependencies: - '@algolia/client-search' - '@types/node' @@ -6483,14 +6625,29 @@ packages: dependencies: vue: 3.4.15(typescript@5.3.3) - /vue-eslint-parser@9.4.2(eslint@8.56.0): + /vue-demi@0.14.7(vue@3.4.21): + resolution: {integrity: sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==} + engines: {node: '>=12'} + hasBin: true + requiresBuild: true + peerDependencies: + '@vue/composition-api': ^1.0.0-rc.1 + vue: ^3.0.0-0 || ^2.6.0 + peerDependenciesMeta: + '@vue/composition-api': + optional: true + dependencies: + vue: 3.4.21(typescript@5.3.3) + dev: true + + /vue-eslint-parser@9.4.2(eslint@8.57.0): resolution: {integrity: sha512-Ry9oiGmCAK91HrKMtCrKFWmSFWvYkpGglCeFAIqDdr9zdXmMMpJOmUJS7WWsW7fX81h6mwHmUZCQQ1E0PkSwYQ==} engines: {node: ^14.17.0 || >=16.0.0} peerDependencies: eslint: '>=6.0.0' dependencies: debug: 4.3.4 - eslint: 8.56.0 + eslint: 8.57.0 eslint-scope: 7.2.2 eslint-visitor-keys: 3.4.3 espree: 9.6.1 @@ -6501,12 +6658,12 @@ packages: - supports-color dev: true - /vue-resize@2.0.0-alpha.1(vue@3.4.15): + /vue-resize@2.0.0-alpha.1(vue@3.4.21): resolution: {integrity: sha512-7+iqOueLU7uc9NrMfrzbG8hwMqchfVfSzpVlCMeJQe4pyibqyoifDNbKTZvwxZKDvGkB+PdFeKvnGZMoEb8esg==} peerDependencies: vue: ^3.0.0 dependencies: - vue: 3.4.15(typescript@5.3.3) + vue: 3.4.21(typescript@5.3.3) dev: true /vue-router@4.2.5(vue@3.4.15): @@ -6550,6 +6707,22 @@ packages: '@vue/shared': 3.4.15 typescript: 5.3.3 + /vue@3.4.21(typescript@5.3.3): + resolution: {integrity: sha512-5hjyV/jLEIKD/jYl4cavMcnzKwjMKohureP8ejn3hhEjwhWIhWeuzL2kJAjzl/WyVsgPY56Sy4Z40C3lVshxXA==} + peerDependencies: + typescript: '*' + peerDependenciesMeta: + typescript: + optional: true + dependencies: + '@vue/compiler-dom': 3.4.21 + '@vue/compiler-sfc': 3.4.21 + '@vue/runtime-dom': 3.4.21 + '@vue/server-renderer': 3.4.21(vue@3.4.21) + '@vue/shared': 3.4.21 + typescript: 5.3.3 + dev: true + /web-worker@1.3.0: resolution: {integrity: sha512-BSR9wyRsy/KOValMgd5kMyr3JzpdeoR9KVId8u5GVlTTAtNChlsE4yTxeY7zMdNSyOmoKBv8NH2qeRY9Tg+IaA==} dev: true From 609f2b6bbf55ff4c77fdaccde2eeb77a4dc23282 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Sat, 2 Mar 2024 21:03:51 +0100 Subject: [PATCH 145/211] chore: fix links --- components.d.ts | 2 ++ guide/syntax.md | 2 +- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/components.d.ts b/components.d.ts index d1d99c8..b0f0cf0 100644 --- a/components.d.ts +++ b/components.d.ts @@ -48,6 +48,8 @@ declare module 'vue' { RouterView: typeof import('vue-router')['RouterView'] ShowCaseInfo: typeof import('./.vitepress/theme/components/ShowCaseInfo.vue')['default'] ShowCases: typeof import('./.vitepress/theme/components/ShowCases.vue')['default'] + SimpleIconsGithub: typeof import('~icons/simple-icons/github')['default'] + SimpleIconsNpm: typeof import('~icons/simple-icons/npm')['default'] SlideCurrentNo: typeof import('./.vitepress/@slidev/client/builtin/SlideCurrentNo.vue')['default'] SlidesTotal: typeof import('./.vitepress/@slidev/client/builtin/SlidesTotal.vue')['default'] Starport: typeof import('vue-starport')['Starport'] diff --git a/guide/syntax.md b/guide/syntax.md index 56fd8c2..e4bce7d 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -217,7 +217,7 @@ const count = ref(0) Shiki Magic Move enables you to have granular transition between code changes like Keynote's Magic Move. You can check [this demo](https://shiki-magic-move.netlify.app/) to see how it works. -In Slidev, we bind it to the [clicks system](guide/animations#click-animations). The syntax is wrap multiple code blocks representing each steps with <code>````md magic-move</code> (mind it's **4** backticks), this will be transformed into one code block, that morphing to each steps as you click. +In Slidev, we bind it to the [clicks system](/guide/animations#click-animations). The syntax is wrap multiple code blocks representing each steps with <code>````md magic-move</code> (mind it's **4** backticks), this will be transformed into one code block, that morphing to each steps as you click. ~~~~md ````md magic-move From e8054222645741a1f15a6138c2b0b6a091fb43a1 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Sat, 2 Mar 2024 23:33:11 +0100 Subject: [PATCH 146/211] chore: update --- guide/syntax.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/guide/syntax.md b/guide/syntax.md index e4bce7d..c3fefda 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -211,6 +211,9 @@ const count = ref(0) // ^? ``` +<!-- For the popup to not to overlap the content below --> +<div class="py-20" /> + ### Shiki Magic Move > Available since v0.48 From ee683ae81a2021c44b278d720a418ee0c6ddb537 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?R=C3=A9mi=20Emonet?= <twitwi@users.noreply.github.com> Date: Sun, 3 Mar 2024 21:42:27 +0100 Subject: [PATCH 147/211] docs: explain mode parameter for preparser extensions (#176) --- custom/config-parser.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/custom/config-parser.md b/custom/config-parser.md index 4784932..10febc1 100644 --- a/custom/config-parser.md +++ b/custom/config-parser.md @@ -12,7 +12,7 @@ Configuring the markdown parser used in step 2 can be done by [configuring Vite ## Preparser Extensions -> Available since v0.37.0 +> Available since v0.37.0. :::warning Important: when modifying the preparser configuration, you need to stop and start slidev again (restart might not be sufficient). @@ -25,7 +25,7 @@ To customize it, create a `./setup/preparser.ts` file with the following content ```ts import { definePreparserSetup } from '@slidev/types' -export default definePreparserSetup(({ filepath, headmatter }) => { +export default definePreparserSetup(({ filepath, headmatter, mode }) => { return [ { transformRawLines(lines) { @@ -41,7 +41,7 @@ export default definePreparserSetup(({ filepath, headmatter }) => { This example systematically replaces any `@@@` line by a line with `hello`. It illustrates the structure of a preparser configuration file and some of the main concepts the preparser involves: - `definePreparserSetup` must be called with a function as parameter. -- The function receives the file path (of the root presentation file) and headmatter (from the md file). It could use this information (e.g., enable extensions based on the presentation file). +- The function receives the file path (of the root presentation file), the headmatter (from the md file) and, since v0.48.0, a mode (dev, build or export). It could use this information (e.g., enable extensions based on the presentation file or whether we are exporting a PDF). - The function must return a list of preparser extensions. - An extension can contain: - a `transformRawLines(lines)` function that runs just after parsing the headmatter of the md file and receives a list of all lines (from the md file). The function can mutate the list arbitrarily. From d90cc87f0123f472cecc705e7e9fb1dce0fe9d1c Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Tue, 5 Mar 2024 01:55:01 +0100 Subject: [PATCH 148/211] fix: landing page style --- .vitepress/theme/components/LandingPage.vue | 4 ++-- index.md | 1 + 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/.vitepress/theme/components/LandingPage.vue b/.vitepress/theme/components/LandingPage.vue index 1a60abf..145f2a0 100644 --- a/.vitepress/theme/components/LandingPage.vue +++ b/.vitepress/theme/components/LandingPage.vue @@ -9,8 +9,8 @@ Presentation Slides for Developers </h2> <div flex="~ gap-3 justify-center" p4 mt-5> - <a href="/guide/" class="bg-$vp-c-brand-3 text-white px5 py3 text-xl font-bold rounded-xl hover:bg-$vp-c-brand-1">Get Started</a> - <a href="/guide/why" class="bg-$vp-c-gray-1 text-white px5 py3 text-xl font-bold rounded-2xl hover:bg-$vp-c-brand-1">Why</a> + <a href="/guide/" class="bg-$vp-c-brand-3 text-white! no-underline! px5 py3 text-xl font-bold rounded-xl hover:bg-$vp-c-brand-1">Get Started</a> + <a href="/guide/why" class="bg-$vp-c-gray-1 text-white! no-underline! px5 py3 text-xl font-bold rounded-2xl hover:bg-$vp-c-brand-1">Why</a> </div> </div> <div flex> diff --git a/index.md b/index.md index 70a3a9d..bee44a8 100644 --- a/index.md +++ b/index.md @@ -1,5 +1,6 @@ --- layout: home +markdownStyles: false --- <LandingPage /> From d85cd98e3b3e88363b670144c5633d51bea5f261 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Tue, 5 Mar 2024 02:09:31 +0100 Subject: [PATCH 149/211] docs: update docs about Monaco --- .vitepress/config.ts | 2 +- custom/config-monaco.md | 89 ++++++++++++++--------------------------- 2 files changed, 32 insertions(+), 59 deletions(-) diff --git a/.vitepress/config.ts b/.vitepress/config.ts index c3faaee..e6f8ae1 100644 --- a/.vitepress/config.ts +++ b/.vitepress/config.ts @@ -2,7 +2,7 @@ import type { DefaultTheme } from 'vitepress' import { defineConfig } from 'vitepress' import { transformerTwoslash } from '@shikijs/vitepress-twoslash' -const CURRENT_VERSION = '0.48.0-beta.2' +const CURRENT_VERSION = '0.48.0-beta.22' const Guide: DefaultTheme.NavItemWithLink[] = [ { diff --git a/custom/config-monaco.md b/custom/config-monaco.md index 5743908..3a101dd 100644 --- a/custom/config-monaco.md +++ b/custom/config-monaco.md @@ -19,7 +19,7 @@ Learn more about [configuring Monaco](https://github.com/Microsoft/monaco-editor To use Monaco in your slides, simply append `{monaco}` to your code snippets: ~~~md -```js +```js {monaco} // [!code ++] const count = ref(1) const plusOne = computed(() => count.value + 1) @@ -29,30 +29,7 @@ plusOne.value++ // error ``` ~~~ -To - -~~~md -```js {monaco} -const count = ref(1) -const plusOne = computed(() => count.value + 1) - -console.log(plusOne.value) // 2 - -plusOne.value++ // error -``` -~~~ - -## Exporting - -By default, Monaco will ONLY work on `dev` mode. If you would like to have it available in the exported SPA, configure it in your frontmatter: - -```yaml ---- -monaco: true # default "dev" ---- -``` - -## Types Auto Installing +## TypeScript Types When use TypeScript with Monaco, types for dependencies will be installed to the client-side automatically. @@ -65,49 +42,35 @@ const counter = ref(0) ``` ~~~ -In the example above, make sure `vue` and `@vueuse/core` are installed locally as dependencies / devDependencies, Slidev will handle the rest to get the types working for the editor automatically! +In the example above, make sure `vue` and `@vueuse/core` are installed locally as dependencies / devDependencies, Slidev will handle the rest to get the types working for the editor automatically. When deploy as SPA, those types will also be bundled for static hosting. -## Configure Themes - -The theme is controlled by Slidev based on the light/dark theme. If you want to customize it, you can pass the theme id to the setup function: +### Additional Types -```ts -// ./setup/monaco.ts -import { defineMonacoSetup } from '@slidev/types' +Slidev will scan all the monaco codeblocks in your slides and import the types for those used libraries for you. In case it missed some, you can explicitly specify extra packages to import the types for: -export default defineMonacoSetup(() => { - return { - theme: { - dark: 'vs-dark', - light: 'vs', - }, - } -}) +```md +--- +monacoTypesAdditionalPackages: + - lodash-es + - foo +--- ``` -If you want to load custom themes: +### Auto Type Acquisition -```ts -import { defineMonacoSetup } from '@slidev/types' +You can optionally switch to load types from CDN by setting the following headmatter: -// change to your themes -import dark from 'theme-vitesse/themes/vitesse-dark.json' -import light from 'theme-vitesse/themes/vitesse-light.json' +```md +--- +monacoTypesSource: ata +--- +``` -export default defineMonacoSetup((monaco) => { - monaco.editor.defineTheme('vitesse-light', light as any) - monaco.editor.defineTheme('vitesse-dark', dark as any) +This feature is powered by [`@typescript/ata`](https://github.com/microsoft/TypeScript-Website/tree/v2/packages/ata) and runs completely on the client-side. - return { - theme: { - light: 'vitesse-light', - dark: 'vitesse-dark', - }, - } -}) -``` +## Configure Themes -> If you are creating a theme for Slidev, use dynamic `import()` inside the setup function to get better tree-shaking and code-splitting results. +Since v0.48.0, Monaco will reuse the Shiki theme you configured in [Shiki's setup file](/custom/highlighters#configure-shiki), powered by [`@shikijs/monaco`](https://shiki.style/packages/monaco). You don't need to worry about it anymore and it will have a consistent style with the rest of your code blocks. ## Configure the Editor @@ -135,3 +98,13 @@ export default defineMonacoSetup(() => { } }) ``` + +## Disabling + +Since v0.48.0, Monaco editor is enabled by default and only be bundled when you use it. If you want to disable it, you can set `monaco` to `false` in the frontmatter of your slide: + +```yaml +--- +monaco: false # can also be `dev` or `build` tp conditionally enable it +--- +``` From ff88e581211d8dda4f85b37fdda6dd91b2678a19 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Tue, 5 Mar 2024 02:18:49 +0100 Subject: [PATCH 150/211] feat: docs for `v-mark` --- guide/animations.md | 38 +++++++++++++++++++++++++++++++++++++- 1 file changed, 37 insertions(+), 1 deletion(-) diff --git a/guide/animations.md b/guide/animations.md index 5375e31..57cc2e1 100644 --- a/guide/animations.md +++ b/guide/animations.md @@ -239,7 +239,7 @@ You can override them to customize the transition effects in your custom stylesh For example, you can achieve the scaling up transitions by: ```css -// styles.css +/* styles.css */ .slidev-vclick-target { transition: all 500ms ease; @@ -267,6 +267,42 @@ To specify animations for only certain slide or layout Learn more about [customizing styles](/custom/directory-structure#style). +## Rough Markers + +> Available since v0.48.0 + +Slidev integrates [Rough Notation](https://github.com/linkstrifer/react-rough-notation) to allow marking or highlighting elements in your slides. + +### `v-mark` + +Rough Notation integrates comes with the `v-mark` directive. + +#### Type + +`v-mark.underline` for Underline mark, `v-mark.circle` for Circle mark, etc. Default to `underline` + +#### Color + +`v-mark.red` make the notation `red`. Supported builtin color themes from UnoCSS. For custom colors, use object syntax `v-mark="{ color: '#234' }"` + +#### Clicks + +`v-mark` works like `v-click` and will trigger after a click. Same as `v-click`, it allows you to pass a custom click value, like `v-mark="5"` or `v-mark="'+1'"`. + +#### Options + +Optionally you can pass an object to `v-mark` to specify the options, for example: + +```vue +<span v-mark="{ at: 5, color: '#234', type: 'circle' }"> +Important text +</span> +``` + +#### Preview + +<video src="https://github.com/slidevjs/slidev/assets/11247099/c840340c-0aa1-4cde-b228-e6c67e5f6879" rounded-lg shadow controls></video> + ## Motion Slidev has [@vueuse/motion](https://motion.vueuse.org/) built-in. You can use the `v-motion` directive to any elements to make apply motion on them. For example From 4ee072e055e04965fad621e5941c6905ef2a2be0 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Tue, 5 Mar 2024 02:25:41 +0100 Subject: [PATCH 151/211] docs: update magic move docs --- guide/syntax.md | 32 ++++++++++++++++++++++++++------ 1 file changed, 26 insertions(+), 6 deletions(-) diff --git a/guide/syntax.md b/guide/syntax.md index c3fefda..0606cfa 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -123,10 +123,10 @@ function add( ``` ~~~ -You can enable line number to all slides by setting `lineNumbers: true` on the config or enable each code block individually by setting `lines:true`. You can also set the starting line for each code block and highlight the lines accordingly, defaults to 1: +You can enable line number to all slides by setting `lineNumbers: true` on the config or enable each code block individually by setting `lines: true`. You can also set the starting line for each code block and highlight the lines accordingly, defaults to 1: ~~~md -```ts {6,7}{lines:true, startLine:5} +```ts {6,7}{lines:true,startLine:5} function add( a: Ref<number> | number, b: Ref<number> | number @@ -218,20 +218,40 @@ const count = ref(0) > Available since v0.48 -Shiki Magic Move enables you to have granular transition between code changes like Keynote's Magic Move. You can check [this demo](https://shiki-magic-move.netlify.app/) to see how it works. +[Shiki Magic Move](https://github.com/shikijs/shiki-magic-move) enables you to have granular transition between code changes, similar to Keynote's Magic Move. You can check [the playground](https://shiki-magic-move.netlify.app/) to see how it works. In Slidev, we bind it to the [clicks system](/guide/animations#click-animations). The syntax is wrap multiple code blocks representing each steps with <code>````md magic-move</code> (mind it's **4** backticks), this will be transformed into one code block, that morphing to each steps as you click. ~~~~md ````md magic-move -```ts +```js console.log(`Step ${1}`) ``` -```ts +```js console.log(`Step ${1 + 1}`) ``` ```ts -console.log(`Step ${3}`) +console.log(`Step ${3}` as string) +``` +```` +~~~~ + +It's also possible mix Magic Move with [line highlighting](#line-highlighting), for example: + +~~~~md +````md magic-move {at:4} // [!code hl] +```js {*|1|2-5} // [!code hl] +let count = 1 +function add() { + count++ +} +``` + +Non-code blocks in between as ignored, you can put some comments. + +```js +let count = 1 +const add = () => count += 1 ``` ```` ~~~~ From fb225dd83a55c03e2932f3ef330bf867b25a5723 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Thu, 7 Mar 2024 11:51:29 +0100 Subject: [PATCH 152/211] docs: merge docs repo back to main repo --- .vitepress/theme/components/DemoEditor.vue | 13 +- .vitepress/theme/components/DemoSlide.vue | 4 +- .vitepress/theme/styles/custom.css | 2 +- .vitepress/theme/styles/vars.css | 8 +- README.md | 24 ++-- TRANSLATIONS.md | 2 + addons/use.md | 4 +- builtin/components.md | 133 +++++++++++---------- custom/config-monaco.md | 12 +- custom/config-parser.md | 5 + custom/directory-structure.md | 2 + custom/fonts.md | 2 + custom/index.md | 24 ++-- guide/animations.md | 20 ++-- guide/hosting.md | 6 +- guide/index.md | 6 +- guide/install.md | 64 +++++----- guide/navigation.md | 34 +++--- guide/presenter-mode.md | 2 + guide/syntax.md | 80 +++++++------ package.json | 3 - 21 files changed, 246 insertions(+), 204 deletions(-) diff --git a/.vitepress/theme/components/DemoEditor.vue b/.vitepress/theme/components/DemoEditor.vue index 51e8aee..9abb5b5 100644 --- a/.vitepress/theme/components/DemoEditor.vue +++ b/.vitepress/theme/components/DemoEditor.vue @@ -13,13 +13,15 @@ padding: 10px; border-radius: 7px; position: relative; - box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 0 30px 1px rgba(0, 0, 0, 0.15); + box-shadow: + 0 0 0 1px rgba(0, 0, 0, 0.05), + 0 0 30px 1px rgba(0, 0, 0, 0.15); } .dark .demo-editor { @apply bg-[#161618] border border-gray-400 border-opacity-10; } .demo-editor::after { - content: ""; + content: ''; position: absolute; top: 12px; left: 10px; @@ -27,6 +29,11 @@ height: 12px; background: #f95c5b; border-radius: 100%; - box-shadow: 0 0 0 1px #da3d42, 22px 0 0 0 #fabe3b, 22px 0 0 1px #ecb03e, 44px 0 0 0 #38cd46, 44px 0 0 1px #2eae32; + box-shadow: + 0 0 0 1px #da3d42, + 22px 0 0 0 #fabe3b, + 22px 0 0 1px #ecb03e, + 44px 0 0 0 #38cd46, + 44px 0 0 1px #2eae32; } </style> diff --git a/.vitepress/theme/components/DemoSlide.vue b/.vitepress/theme/components/DemoSlide.vue index 3fc3533..4ba7c28 100644 --- a/.vitepress/theme/components/DemoSlide.vue +++ b/.vitepress/theme/components/DemoSlide.vue @@ -14,7 +14,9 @@ line-height: 1.2em; border-radius: 7px; position: relative; - box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 0 30px 1px rgba(0, 0, 0, 0.15); + box-shadow: + 0 0 0 1px rgba(0, 0, 0, 0.05), + 0 0 30px 1px rgba(0, 0, 0, 0.15); @apply mt-4 transform translate-x-20 -translate-y-20 overflow-hidden; } diff --git a/.vitepress/theme/styles/custom.css b/.vitepress/theme/styles/custom.css index 45d334d..1e39fc0 100644 --- a/.vitepress/theme/styles/custom.css +++ b/.vitepress/theme/styles/custom.css @@ -1,7 +1,7 @@ .icon-btn { --uno: inline-block cursor-pointer select-none important-outline-none; --uno: opacity-75 transition duration-200 ease-in-out align-middle rounded p-2; - --uno: hover:(opacity-100 bg-gray-400 bg-opacity-10); + --uno: hover-(opacity-100 bg-gray-400 bg-opacity-10); } .icon-btn.disabled { diff --git a/.vitepress/theme/styles/vars.css b/.vitepress/theme/styles/vars.css index a5f6998..9173c6b 100644 --- a/.vitepress/theme/styles/vars.css +++ b/.vitepress/theme/styles/vars.css @@ -44,10 +44,10 @@ * -------------------------------------------------------------------------- */ :root { - --vp-c-brand-1: #3AB9D4; + --vp-c-brand-1: #3ab9d4; --vp-c-brand-2: #60c4db; --vp-c-brand-3: #6fcce1; - --vp-c-brand-soft: #3AB9D450; + --vp-c-brand-soft: #3ab9d450; --vp-c-bg-alt: #f9f9f9; --vp-font-family-mono: theme('fontFamily.mono'); @@ -56,8 +56,8 @@ .dark { --vp-c-brand-1: #6fcce1; --vp-c-brand-2: #60c4db; - --vp-c-brand-3: #3AB9D4; - --vp-c-brand-soft: #3AB9D450; + --vp-c-brand-3: #3ab9d4; + --vp-c-brand-soft: #3ab9d450; --vp-c-bg-alt: #18181b; --vp-c-gutter: #8883; } diff --git a/README.md b/README.md index cc88fa2..2358ae6 100644 --- a/README.md +++ b/README.md @@ -4,18 +4,18 @@ Documentation for [Slidev](https://github.com/slidevjs/slidev) ## Translations -| | Repo | Site | Maintainers | -|---|---|---:|---| -| English | [docs](https://github.com/slidevjs/docs) | [sli.dev](https://sli.dev) | [@antfu](https://github.com/antfu) | -| 简体中文 | [docs-cn](https://github.com/slidevjs/docs-cn) | [cn.sli.dev](https://cn.sli.dev) | [@QC-L](https://github.com/QC-L) [@Ivocin](https://github.com/Ivocin) | -| Français | [docs-fr](https://github.com/slidevjs/docs-fr) | [fr.sli.dev](https://fr.sli.dev) | [@ArthurDanjou](https://github.com/ArthurDanjou) | -| Español | [docs-es](https://github.com/slidevjs/docs-es) | [es.sli.dev](https://es.sli.dev) | [@owlnai](https://github.com/owlnai) | -| Русский | [docs-ru](https://github.com/slidevjs/docs-ru) | [ru.sli.dev](https://ru.sli.dev) | [@xesjkeee](https://github.com/xesjkeee) | -| Việt Nam | [docs-vn](https://github.com/slidevjs/docs-vn) | [vn.sli.dev](https://vn.sli.dev) | [@bongudth](https://github.com/bongudth) | -| Deutsch | [docs-de](https://github.com/slidevjs/docs-de) | [de.sli.dev](https://de.sli.dev) | [@fabiankachlock](https://github.com/fabiankachlock) | -| Português (BR) | [docs-br](https://github.com/slidevjs/docs-br) | [br.sli.dev](https://br.sli.dev) | [@luisfelipesdn12](https://github.com/luisfelipesdn12) | -| Ελληνικά | [docs-el](https://github.com/slidevjs/docs-el) | [el.sli.dev](https://el.sli.dev) | [@GeopJr](https://github.com/GeopJr) | -| 日本語 | [docs-ja](https://github.com/slidevjs/docs-el) | [ja.sli.dev](https://ja.sli.dev) | [@IkumaTadokoro](https://github.com/IkumaTadokoro) | +| | Repo | Site | Maintainers | +| -------------- | ---------------------------------------------- | -------------------------------: | --------------------------------------------------------------------- | +| English | [docs](https://github.com/slidevjs/docs) | [sli.dev](https://sli.dev) | [@antfu](https://github.com/antfu) | +| 简体中文 | [docs-cn](https://github.com/slidevjs/docs-cn) | [cn.sli.dev](https://cn.sli.dev) | [@QC-L](https://github.com/QC-L) [@Ivocin](https://github.com/Ivocin) | +| Français | [docs-fr](https://github.com/slidevjs/docs-fr) | [fr.sli.dev](https://fr.sli.dev) | [@ArthurDanjou](https://github.com/ArthurDanjou) | +| Español | [docs-es](https://github.com/slidevjs/docs-es) | [es.sli.dev](https://es.sli.dev) | [@owlnai](https://github.com/owlnai) | +| Русский | [docs-ru](https://github.com/slidevjs/docs-ru) | [ru.sli.dev](https://ru.sli.dev) | [@xesjkeee](https://github.com/xesjkeee) | +| Việt Nam | [docs-vn](https://github.com/slidevjs/docs-vn) | [vn.sli.dev](https://vn.sli.dev) | [@bongudth](https://github.com/bongudth) | +| Deutsch | [docs-de](https://github.com/slidevjs/docs-de) | [de.sli.dev](https://de.sli.dev) | [@fabiankachlock](https://github.com/fabiankachlock) | +| Português (BR) | [docs-br](https://github.com/slidevjs/docs-br) | [br.sli.dev](https://br.sli.dev) | [@luisfelipesdn12](https://github.com/luisfelipesdn12) | +| Ελληνικά | [docs-el](https://github.com/slidevjs/docs-el) | [el.sli.dev](https://el.sli.dev) | [@GeopJr](https://github.com/GeopJr) | +| 日本語 | [docs-ja](https://github.com/slidevjs/docs-el) | [ja.sli.dev](https://ja.sli.dev) | [@IkumaTadokoro](https://github.com/IkumaTadokoro) | ## Start Server Locally diff --git a/TRANSLATIONS.md b/TRANSLATIONS.md index d927008..43da9d3 100644 --- a/TRANSLATIONS.md +++ b/TRANSLATIONS.md @@ -9,7 +9,9 @@ You can find the repositories for each existing translation in [README.md](./REA If the language you want to contribute isn't on the list, join [our Discord server](https://chat.sli.dev), and find the `#translations` channel to see if someone is already working on the language you want, consider joining them and translate together. If not, you can start a new translation project with the following steps. In case it's already been translated but you're wondering how to maintain it, skip to the end. + ## Some tips before you get started + - It is recommended that you use your IDE of choice (e.g VSCode) paired with a development server running, so you can see your translation changes in real-time. - You can mark these checkmarks as the translation progresses or use your own workflow. The translations don't need to be made in any particular order. - Translations don't need to be literal, but they should convey the same message. In case you're not sure how to translate something, you can either leave it as it is or use online tools like WordReference or Linguee to aid you. diff --git a/addons/use.md b/addons/use.md index d1ca9e2..522ddce 100644 --- a/addons/use.md +++ b/addons/use.md @@ -4,8 +4,8 @@ Addons are sets of additional components, layouts, styles, configuration...etc. They are quite similar to [themes](/themes/use), but in general: -* they don't affect the global styles of your slides -* you can use multiple addons in one presentation +- they don't affect the global styles of your slides +- you can use multiple addons in one presentation To use addons, you have to install them manually via: diff --git a/builtin/components.md b/builtin/components.md index 7e333f1..17fd27e 100644 --- a/builtin/components.md +++ b/builtin/components.md @@ -8,24 +8,24 @@ Draw an arrow. #### Usage -~~~md +```md <Arrow x1="10" y1="20" x2="100" y2="200" /> -~~~ +``` Or: -~~~md +```md <Arrow v-bind="{ x1:10, y1:10, x2:200, y2:200 }" /> -~~~ +``` Parameters: -* `x1` (`string | number`, required): start point x position -* `y1` (`string | number`, required): start point y position -* `x2` (`string | number`, required): end point x position -* `y2` (`string | number`, required): end point x position -* `width` (`string | number`, default: `2`): line width -* `color` (`string`, default: `'currentColor'`): line color +- `x1` (`string | number`, required): start point x position +- `y1` (`string | number`, required): start point y position +- `x2` (`string | number`, required): end point x position +- `y2` (`string | number`, required): end point x position +- `width` (`string | number`, default: `2`): line width +- `color` (`string`, default: `'currentColor'`): line color ### `AutoFitText` @@ -35,15 +35,15 @@ Box inside which the font size will automatically adapt to fit the content. Simi #### Usage -~~~md +```md <AutoFitText :max="200" :min="100" modelValue="Some text"/> -~~~ +``` Parameters: -* `max` (`string | number`, default `100`): Maximum font size -* `min` (`string | number`, default `30`): Minimum font size -* `modelValue` (`string`, default `''`): text content +- `max` (`string | number`, default `100`): Maximum font size +- `min` (`string | number`, default `30`): Minimum font size +- `modelValue` (`string`, default `''`): text content ### `LightOrDark` @@ -52,15 +52,17 @@ Use it to display one thing or another depending on the active light or dark the #### Usage Use it with the two named Slots `#dark` and `#light`: -~~~md + +```md <LightOrDark> <template #dark>Dark mode is on</template> <template #light>Light mode is on</template> </LightOrDark> -~~~ +``` Provided props on `LightOrDark` component will be available using scoped slot props: -~~~md + +```md <LightOrDark width="100" alt="some image"> <template #dark="props"> <img src="/dark.png" v-bind="props"/> @@ -69,10 +71,11 @@ Provided props on `LightOrDark` component will be available using scoped slot pr <img src="/light.png" v-bind="props"/> </template> </LightOrDark> -~~~ +``` You can provide markdown in the slots, but you will need to surround the content with blank lines: -~~~md + +```md <LightOrDark> <template #dark> @@ -85,7 +88,7 @@ You can provide markdown in the slots, but you will need to surround the content </template> </LightOrDark> -~~~ +``` ### `Link` @@ -93,25 +96,26 @@ Insert a link you can use to navigate to a given slide. #### Usage -~~~md +```md <Link to="42">Go to slide 42</Link> <Link to="42" title="Go to slide 42"/> <Link to="solutions" title="Go to solutions"/> -~~~ +``` Parameters: -* `to` (`string | number`): The path of the slide to navigate to (slides starts from `1`) -* `title` (`string`): The title to display +- `to` (`string | number`): The path of the slide to navigate to (slides starts from `1`) +- `title` (`string`): The title to display One can use a string as `to`, provided the corresponding route exists, e.g. -~~~md +```md --- routeAlias: solutions --- + # Now some solutions! -~~~ +``` ### `RenderWhen` @@ -119,15 +123,15 @@ Render slot only when the context match (for example when we are in presenter vi #### Usage -~~~md +```md <RenderWhen context="presenter">This will only be rendered in presenter view.</RenderWhen> -~~~ +``` Context type: `'main' | 'slide' | 'overview' | 'presenter' | 'previewNext'` Parameters: -* `context` (`Context | Context[]`): context or array of contexts you want the slot to be rendered +- `context` (`Context | Context[]`): context or array of contexts you want the slot to be rendered ### `SlideCurrentNo` @@ -135,9 +139,9 @@ Current slide number. #### Usage -~~~md +```md <SlideCurrentNo /> -~~~ +``` ### `SlidesTotal` @@ -145,9 +149,9 @@ Total number of slides. #### Usage -~~~md +```md <SlidesTotal /> -~~~ +``` ### `Titles` @@ -156,6 +160,7 @@ Insert the main title from a slide parsed as HTML. Titles and title levels get automatically retrieved from the first title element of each slides. You can override this automatic behaviour for a slide by using the front matter syntax: + ```yml --- title: Amazing slide title @@ -166,24 +171,27 @@ level: 2 #### Usage The `<Titles>` component is a virtual component you can import with: + ```js import Titles from '/@slidev/titles.md' ``` Then you can use it with: -~~~md + +```md <Titles no="42" /> -~~~ +``` Parameters: -* `no` (`string | number`): The number of the slide to display the title from (slides starts from `1`) +- `no` (`string | number`): The number of the slide to display the title from (slides starts from `1`) ### `Toc` Insert a Table Of Content. If you want a slide to not appear in the `<Toc>` component, you can use in the front matter block of the slide: + ```yml --- hideInToc: true @@ -194,20 +202,20 @@ Titles are displayed using the [`<Titles>` component](#titles) #### Usage -~~~md +```md <Toc /> -~~~ +``` Parameters: -* `columns` (`string | number`, default: `1`): The number of columns of the display -* `listClass` (`string | string[]`, default: `''`): Classes to apply to the table of contents list -* `maxDepth` (`string | number`, default: `Infinity`): The maximum depth level of title to display -* `minDepth` (`string | number`, default: `1`): The minimum depth level of title to display -* `mode` (`'all' | 'onlyCurrentTree'| 'onlySiblings'`, default: `'all'`): - * `'all'`: Display all items - * `'onlyCurrentTree'`: Display only items that are in current tree (active item, parents and children of active item) - * `'onlySiblings'`: Display only items that are in current tree and their direct siblings +- `columns` (`string | number`, default: `1`): The number of columns of the display +- `listClass` (`string | string[]`, default: `''`): Classes to apply to the table of contents list +- `maxDepth` (`string | number`, default: `Infinity`): The maximum depth level of title to display +- `minDepth` (`string | number`, default: `1`): The minimum depth level of title to display +- `mode` (`'all' | 'onlyCurrentTree'| 'onlySiblings'`, default: `'all'`): + - `'all'`: Display all items + - `'onlyCurrentTree'`: Display only items that are in current tree (active item, parents and children of active item) + - `'onlySiblings'`: Display only items that are in current tree and their direct siblings ### `Transform` @@ -215,16 +223,16 @@ Apply scaling or transforming to elements. #### Usage -~~~md +```md <Transform :scale="0.5"> <YourElements /> </Transform> -~~~ +``` Parameters: -* `scale` (`number | string`, default `1`): transform scale value -* `origin` (`string`, default `'top left'`): transform origin value +- `scale` (`number | string`, default `1`): transform scale value +- `origin` (`string`, default `'top left'`): transform origin value ### `Tweet` @@ -232,35 +240,36 @@ Embed a tweet. #### Usage -~~~md +```md <Tweet id="20" /> -~~~ +``` Parameters: -* `id` (`number | string`, required): id of the tweet -* `scale` (`number | string`, default `1`): transform scale value -* `conversation` (`string`, default `'none'`): [tweet embed parameter](https://developer.twitter.com/en/docs/twitter-for-websites/embedded-tweets/guides/embedded-tweet-parameter-reference) -* `cards` (`'hidden' | 'visible'`, default `'visible'`): [tweet embed parameter](https://developer.twitter.com/en/docs/twitter-for-websites/embedded-tweets/guides/embedded-tweet-parameter-reference) +- `id` (`number | string`, required): id of the tweet +- `scale` (`number | string`, default `1`): transform scale value +- `conversation` (`string`, default `'none'`): [tweet embed parameter](https://developer.twitter.com/en/docs/twitter-for-websites/embedded-tweets/guides/embedded-tweet-parameter-reference) +- `cards` (`'hidden' | 'visible'`, default `'visible'`): [tweet embed parameter](https://developer.twitter.com/en/docs/twitter-for-websites/embedded-tweets/guides/embedded-tweet-parameter-reference) ### `VAfter`, `VClick` and `VClicks` See https://sli.dev/guide/animations.html + ### `Youtube` Embed a youtube video. #### Usage -~~~md +```md <Youtube id="luoMHjh-XcQ" /> -~~~ +``` Parameters: -* `id` (`string`, required): id of the youtube video -* `width` (`number`): width of the video -* `height` (`number`): height of the video +- `id` (`string`, required): id of the youtube video +- `width` (`number`): width of the video +- `height` (`number`): height of the video You can also make the video start at specific time if you add `?start=1234` to the id value (where 1234 are seconds), diff --git a/custom/config-monaco.md b/custom/config-monaco.md index 3a101dd..9bceea8 100644 --- a/custom/config-monaco.md +++ b/custom/config-monaco.md @@ -18,7 +18,7 @@ Learn more about [configuring Monaco](https://github.com/Microsoft/monaco-editor To use Monaco in your slides, simply append `{monaco}` to your code snippets: -~~~md +````md ```js {monaco} // [!code ++] const count = ref(1) const plusOne = computed(() => count.value + 1) @@ -27,20 +27,20 @@ console.log(plusOne.value) // 2 plusOne.value++ // error ``` -~~~ +```` ## TypeScript Types When use TypeScript with Monaco, types for dependencies will be installed to the client-side automatically. -~~~md +````md ```ts {monaco} import { ref } from 'vue' import { useMouse } from '@vueuse/core' const counter = ref(0) ``` -~~~ +```` In the example above, make sure `vue` and `@vueuse/core` are installed locally as dependencies / devDependencies, Slidev will handle the rest to get the types working for the editor automatically. When deploy as SPA, those types will also be bundled for static hosting. @@ -78,11 +78,11 @@ Since v0.48.0, Monaco will reuse the Shiki theme you configured in [Shiki's setu If you would like to customize the Monaco editor you may pass an `editorOptions` object that matches the [Monaco IEditorOptions](https://microsoft.github.io/monaco-editor/docs.html#interfaces/editor.IEditorOptions.html) definition. -~~~md +````md ```ts {monaco} { editorOptions: { wordWrap:'on'} } console.log('HelloWorld') ``` -~~~ +```` Alternatively if you would like these options to be applied to every Monaco instance, you can return them in the `defineMonacoSetup` function diff --git a/custom/config-parser.md b/custom/config-parser.md index 10febc1..bfcd98a 100644 --- a/custom/config-parser.md +++ b/custom/config-parser.md @@ -40,6 +40,7 @@ export default definePreparserSetup(({ filepath, headmatter, mode }) => { ``` This example systematically replaces any `@@@` line by a line with `hello`. It illustrates the structure of a preparser configuration file and some of the main concepts the preparser involves: + - `definePreparserSetup` must be called with a function as parameter. - The function receives the file path (of the root presentation file), the headmatter (from the md file) and, since v0.48.0, a mode (dev, build or export). It could use this information (e.g., enable extensions based on the presentation file or whether we are exporting a PDF). - The function must return a list of preparser extensions. @@ -54,6 +55,8 @@ This example systematically replaces any `@@@` line by a line with `hello`. It i Imagine a situation where (part of) your presentation is mainly showing cover images and including other md files. You might want a compact notation where for instance (part of) `slides.md` is as follows: +<!-- eslint-skip --> + ```md @cover: /nice.jpg # Welcome @@ -116,6 +119,8 @@ And that's it. Imagine a case where you often want to scale some of your slides but still want to use a variety of existing layouts so create a new layout would not be suited. For instance, you might want to write your `slides.md` as follows: +<!-- eslint-skip --> + ```md --- layout: quote diff --git a/custom/directory-structure.md b/custom/directory-structure.md index 5a1c677..d4a684e 100644 --- a/custom/directory-structure.md +++ b/custom/directory-structure.md @@ -117,6 +117,8 @@ import './layouts.css' Styles will be processed by [UnoCSS](https://unocss.dev/) and [PostCSS](https://postcss.org/), so you can use css nesting and [at-directives](https://unocss.dev/transformers/directives#apply) out-of-box. For example: +<!-- eslint-skip --> + ```less .slidev-layout { --uno: px-14 py-10 text-[1.1rem]; diff --git a/custom/fonts.md b/custom/fonts.md index be4674c..2c8a705 100644 --- a/custom/fonts.md +++ b/custom/fonts.md @@ -68,6 +68,8 @@ fonts: will result in +<!-- eslint-skip --> + ```css .font-sans { font-family: "Robot",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; diff --git a/custom/index.md b/custom/index.md index de17375..fa9d36c 100644 --- a/custom/index.md +++ b/custom/index.md @@ -99,18 +99,18 @@ Check out the [type definitions](https://github.com/slidevjs/slidev/blob/main/pa In addition, every slide accepts the following configuration in the Frontmatter block: -* `clicks` (`number`): Custom clicks count (learn more [here](/guide/animations.html#custom-total-clicks-count)). -* `disabled` (`boolean`): Completely disable and hide the slide. -* `hide` (`boolean`): The same as `disabled`. -* `hideInToc` (`boolean`): Hide the slide for the `<Toc>` components (learn more [here](/builtin/components.html#toc)). -* `layout` (`string`): Defines the layout component applied to the slide (learn more [here](/guide/syntax.html#front-matter-layouts) and [here](/builtin/layouts.html)). -* `level` (`number`): Override the title level for the `<Title>` and `<Toc>` components (only if `title` has also been declared, learn more [here](/builtin/components.html#titles)). -* `preload` (`boolean`, default `true`): Preload the next slide (learn more [here](/guide/animations.html#motion)). -* `routeAlias` (`string`): Create a route alias that can be used in the URL or with the `<Link>` component (learn more [here](/builtin/components.html#link)). -* `src` (`string`): Includes a markdown file (learn more [here](/guide/syntax.html#multiple-entries)). -* `title` (`string`): Override the title for the `<Title>` and `<Toc>` components (learn more [here](/builtin/components.html#titles)). -* `transition` (`string | TransitionProps`): Defines the transition between the slide and the next one (learn more [here](/guide/animations.html#slide-transitions)). -* `zoom` (`number`): Custom zoom scale. Useful for slides with a lot of content. +- `clicks` (`number`): Custom clicks count (learn more [here](/guide/animations.html#custom-total-clicks-count)). +- `disabled` (`boolean`): Completely disable and hide the slide. +- `hide` (`boolean`): The same as `disabled`. +- `hideInToc` (`boolean`): Hide the slide for the `<Toc>` components (learn more [here](/builtin/components.html#toc)). +- `layout` (`string`): Defines the layout component applied to the slide (learn more [here](/guide/syntax.html#front-matter-layouts) and [here](/builtin/layouts.html)). +- `level` (`number`): Override the title level for the `<Title>` and `<Toc>` components (only if `title` has also been declared, learn more [here](/builtin/components.html#titles)). +- `preload` (`boolean`, default `true`): Preload the next slide (learn more [here](/guide/animations.html#motion)). +- `routeAlias` (`string`): Create a route alias that can be used in the URL or with the `<Link>` component (learn more [here](/builtin/components.html#link)). +- `src` (`string`): Includes a markdown file (learn more [here](/guide/syntax.html#multiple-entries)). +- `title` (`string`): Override the title for the `<Title>` and `<Toc>` components (learn more [here](/builtin/components.html#titles)). +- `transition` (`string | TransitionProps`): Defines the transition between the slide and the next one (learn more [here](/guide/animations.html#slide-transitions)). +- `zoom` (`number`): Custom zoom scale. Useful for slides with a lot of content. ## Directory Structure diff --git a/guide/animations.md b/guide/animations.md index 57cc2e1..285a191 100644 --- a/guide/animations.md +++ b/guide/animations.md @@ -16,6 +16,7 @@ To apply "click animations" for elements, you can use the `v-click` directive or ```md <!-- Component usage: this will be invisible until you press "next" --> + <v-click> Hello **World** </v-click> <!-- Directive usage: @@ -104,7 +105,7 @@ Like the CSS layout system, click-animated elements can be "relative" or "absolu This actual position of relative elements are calculated based on the previous relative elements: -~~~md +````md <div v-click> visible after 1 click </div> <v-click at="+2"><div> visible after 3 clicks </div></v-click> <div v-click.hide="'-1'"> hidden after 2 clicks </div> @@ -113,7 +114,7 @@ This actual position of relative elements are calculated based on the previous r 1 // highlighted after 7 clicks 2 // highlighted after 8 clicks ``` -~~~ +```` > [!NOTE] > The default value of `v-click` is `'+1'` when you don't specify it. @@ -147,7 +148,7 @@ So don't forget the single quotes for the relative values. The given value is the exact click count to show the element: -~~~md +````md <div v-click="3"> visible after 3 clicks </div> <v-click at="2"><div> visible after 2 clicks </div></v-click> <div v-click.hide="1"> hidden after 1 click </div> @@ -156,23 +157,23 @@ The given value is the exact click count to show the element: 1 // highlighted after 3 clicks 2 // highlighted after 4 clicks ``` -~~~ +```` #### Mixed Case You can mix the absolute and relative positions: -~~~md +```md <div v-click> visible after 1 click </div> <div v-click="3"> visible after 3 clicks </div> <div v-click> visible after 2 click </div> <div v-click="'-1'"> visible after 1 click </div> <div v-click="4"> visible after 4 clicks </div> -~~~ +``` The following example synchronizes the highlighting of the two code blocks: -~~~md +````md ```js {1|2}{at:1} 1 + 1 'a' + 'b' @@ -182,7 +183,7 @@ The following example synchronizes the highlighting of the two code blocks: 2 'ab' ``` -~~~ +```` ### Enter & Leave @@ -385,8 +386,11 @@ You can enable [MDC (Markdown Component) Syntax](/guide/syntax#mdc-syntax) suppo transition: view-transition mdc: true --- + # View Transition {.inline-block.view-transition-title} + --- + # View Transition {.inline-block.view-transition-title} ``` diff --git a/guide/hosting.md b/guide/hosting.md index 26177c0..3205424 100644 --- a/guide/hosting.md +++ b/guide/hosting.md @@ -52,8 +52,8 @@ $ slidev build --download When using the download option, you can also provide the export options: -* By using [CLI export options](/guide/exporting.html) -* Or [frontmatter export options](/custom/#frontmatter-configures) +- By using [CLI export options](/guide/exporting.html) +- Or [frontmatter export options](/custom/#frontmatter-configures) ### Output directory @@ -143,6 +143,7 @@ Then go to your Vercel dashboard and create a new site with the repository. - [GitHub Pages](https://pages.github.com/) To deploy your slides on GitHub Pages: + - upload all the files of the project in your repo (i.e. named `name_of_repo`) - create `.github/workflows/deploy.yml` with following content to deploy your slides to GitHub Pages via GitHub Actions. In this file, replace `<name_of_repo>` with `name_of_repo`. Make sure to leave the leading and trailing slashes in place. @@ -191,5 +192,6 @@ jobs: id: deployment uses: actions/deploy-pages@v4 ``` + - In your repository, go to Settings>Pages. Under "Build and deployment", select "Github Actions". - Finally, after all workflows are executed, a link to the slides should appear under Settings>Pages. diff --git a/guide/index.md b/guide/index.md index 6705b70..2a0edc0 100644 --- a/guide/index.md +++ b/guide/index.md @@ -82,7 +82,7 @@ Run `slidev --help` for more options available. Slidev reads your `slides.md` file under your project root and converts them into slides. Whenever you made changes to it, the content of the slides will be updated immediately. For example: -~~~md +````md # Slidev Hello World @@ -100,7 +100,7 @@ console.log('Hello, World!') --- # Page 3 -~~~ +```` Read more about the Slidev Markdown syntax in the [syntax guide](/guide/syntax). @@ -113,7 +113,7 @@ Slidev is made possible by combining these tools and technologies. - [UnoCSS](https://github.com/unocss/unocss) - On-demand utility-first CSS framework, style your slides at ease - [Shiki](https://github.com/shikijs/shiki), [Prism](https://github.com/PrismJS/prism), [Monaco Editor](https://github.com/Microsoft/monaco-editor) - First-class code snippets support with live coding capability - [RecordRTC](https://recordrtc.org) - Built-in recording and camera view -- [VueUse](https://vueuse.org) family - [`@vueuse/core`](https://github.com/vueuse/vueuse), [`@vueuse/head`](https://github.com/vueuse/head), [`@vueuse/motion`](https://github.com/vueuse/motion), etc. +- [VueUse](https://vueuse.org) family - [`@vueuse/core`](https://github.com/vueuse/vueuse), [`@vueuse/head`](https://github.com/vueuse/head), [`@vueuse/motion`](https://github.com/vueuse/motion), etc. - [Iconify](https://iconify.design/) - Iconsets collection. - [Drauu](https://github.com/antfu/drauu) - Drawing and annotations support - [KaTeX](https://katex.org/) - LaTeX math rendering. diff --git a/guide/install.md b/guide/install.md index ff78ed7..48a6e10 100644 --- a/guide/install.md +++ b/guide/install.md @@ -33,9 +33,11 @@ If you still prefer to install Slidev manually or would like to integrate it int ```bash npm install @slidev/cli @slidev/theme-default ``` + ```bash touch slides.md ``` + ```bash npx slidev ``` @@ -132,6 +134,7 @@ Refer to the [tangramor/slidev_docker](https://github.com/tangramor/slidev_docke ## Command Line Interface (CLI) `@slidev/cli` Expose a few commands you can use with `npx slidev ...` or by adding scripts in your `package.json`: + ```json { "script": { @@ -144,10 +147,11 @@ In that case you will be able to run `npm run dev`. You can pass options to any commands: -* boolean option are `true` if they are present, false otherwise (example: `slidev --open`) -* some options can have values you can add just after the option or by using the `=` character (example: `slidev --port 8080` or `slidev --port=8080`) +- boolean option are `true` if they are present, false otherwise (example: `slidev --open`) +- some options can have values you can add just after the option or by using the `=` character (example: `slidev --port 8080` or `slidev --port=8080`) If you use npm scripts, don't forget to add `--` after the npm command: + ```bash npm run slidev -- --open ``` @@ -156,53 +160,53 @@ npm run slidev -- --open Start a local server for Slidev. -* `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. +- `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. Options: -* `--port`, `-p` (`number`, default: `3030`): port number. -* `--open`, `-o` (`boolean`, default: `false`): open in browser. -* `--remote [password]` (`string`): listen to public host and enable remote control, if a value is passed then the presenter mode is private and only accessible by passing the given password in the URL query `password` parameter. -* `--bind` (`string`, default: `0.0.0.0`): specify which IP addresses the server should listen on in the remote mode. -* `--log` (`'error', 'warn', 'info', 'silent'`, default: `'warn'`): Log level. -* `--force`, `-f` (`boolean`, default: `false`): force the optimizer to ignore the cache and re-bundle. -* `--theme`, `-t` (`string`): override theme. +- `--port`, `-p` (`number`, default: `3030`): port number. +- `--open`, `-o` (`boolean`, default: `false`): open in browser. +- `--remote [password]` (`string`): listen to public host and enable remote control, if a value is passed then the presenter mode is private and only accessible by passing the given password in the URL query `password` parameter. +- `--bind` (`string`, default: `0.0.0.0`): specify which IP addresses the server should listen on in the remote mode. +- `--log` (`'error', 'warn', 'info', 'silent'`, default: `'warn'`): Log level. +- `--force`, `-f` (`boolean`, default: `false`): force the optimizer to ignore the cache and re-bundle. +- `--theme`, `-t` (`string`): override theme. ### `slidev build [entry]` Build hostable SPA. -* `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. +- `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. Options: -* `--watch`, `-w` (`boolean`, default: `false`): build watch. -* `--out`, `-o` (`string`, default: `dist`): output dir. -* `--base` (`string`, default: `/`): base URL (see https://cli.vuejs.org/config/#publicpath) -* `--download` (`boolean`, default: `false`): allow to download the slides as PDF inside the SPA. -* `--theme`, `-t` (`string`): override theme. +- `--watch`, `-w` (`boolean`, default: `false`): build watch. +- `--out`, `-o` (`string`, default: `dist`): output dir. +- `--base` (`string`, default: `/`): base URL (see https://cli.vuejs.org/config/#publicpath) +- `--download` (`boolean`, default: `false`): allow to download the slides as PDF inside the SPA. +- `--theme`, `-t` (`string`): override theme. ### `slidev export [entry]` Export slides to PDF (or other format). -* `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. +- `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. Options: -* `--output` (`string`, default: use `exportFilename` (see https://sli.dev/custom/#frontmatter-configures) or use `[entry]-export`): path to the output. -* `--format` (`'pdf', 'png', 'md'`, default: `'pdf'`): output format. -* `--timeout` (`number`, default: `30000`): timeout for rendering the print page (see https://playwright.dev/docs/api/class-page#page-goto). -* `--range` (`string`): page ranges to export (example: `'1,4-5,6'`). -* `--dark` (`boolean`, default: `false`): export as dark theme. -* `--with-clicks`, `-c` (`boolean`, default: `false`): export pages for every clicks (see https://sli.dev/guide/animations.html#click-animations). -* `--theme`, `-t` (`string`): override theme. +- `--output` (`string`, default: use `exportFilename` (see https://sli.dev/custom/#frontmatter-configures) or use `[entry]-export`): path to the output. +- `--format` (`'pdf', 'png', 'md'`, default: `'pdf'`): output format. +- `--timeout` (`number`, default: `30000`): timeout for rendering the print page (see https://playwright.dev/docs/api/class-page#page-goto). +- `--range` (`string`): page ranges to export (example: `'1,4-5,6'`). +- `--dark` (`boolean`, default: `false`): export as dark theme. +- `--with-clicks`, `-c` (`boolean`, default: `false`): export pages for every clicks (see https://sli.dev/guide/animations.html#click-animations). +- `--theme`, `-t` (`string`): override theme. ### `slidev format [entry]` Format the markdown file. -* `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. +- `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. ### `slidev theme [subcommand]` @@ -210,8 +214,8 @@ Theme related operations. Subcommands: -* `eject [entry]`: Eject current theme into local file system - * `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. - * Options: - * `--dir` (`string`, default: `theme`): output dir. - * `--theme`, `-t` (`string`): override theme. +- `eject [entry]`: Eject current theme into local file system + - `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. + - Options: + - `--dir` (`string`, default: `theme`): output dir. + - `--theme`, `-t` (`string`): override theme. diff --git a/guide/navigation.md b/guide/navigation.md index 5caad02..b70e926 100644 --- a/guide/navigation.md +++ b/guide/navigation.md @@ -6,23 +6,23 @@ Move your mouse to the bottom left corner of Slidev page to make the navigation ![](/screenshots/navbar.png) -| Shortcuts | Button | Description | -| --- | --- | --- | -| <kbd>f</kbd> | <carbon-maximize class="inline-icon-btn"/> <carbon-minimize class="inline-icon-btn"/> | toggle fullscreen | -| <kbd>right</kbd> / <kbd>space</kbd> | <carbon-arrow-right class="inline-icon-btn"/> | next animation or slide | -| <kbd>left</kbd> | <carbon-arrow-left class="inline-icon-btn"/> | previous animation or slide | -| <kbd>up</kbd> | - | previous slide | -| <kbd>down</kbd> | - | next slide | -| <kbd>o</kbd> | <carbon-apps class="inline-icon-btn"/> | toggle [slides overview](#slides-overview) | -| <kbd>d</kbd> | <carbon-sun class="inline-icon-btn"/> <carbon-moon class="inline-icon-btn"/> | toggle dark mode | -| - | <carbon-user-avatar class="inline-icon-btn"/> | toggle [camera view](/guide/recording#camera-view) | -| - | <carbon-video class="inline-icon-btn"/> | [recording](/guide/recording#camera-view) | -| - | <carbon-user-speaker class="inline-icon-btn"/> | enter [presenter mode](/guide/presenter-mode) | -| - | <carbon-edit class="inline-icon-btn"/> | toggle [integrated editor](/guide/editors#integrated-editor) | -| - | <carbon-download class="inline-icon-btn"/> | download slides (only appear in [SPA build](/guide/exporting#single-page-application-spa)) | -| - | <carbon-information class="inline-icon-btn"/> | show information about the slides | -| - | <carbon-settings-adjust class="inline-icon-btn"/> | show settings menu | -| <kbd>g</kbd> | - | show goto... | +| Shortcuts | Button | Description | +| ----------------------------------- | ------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------ | +| <kbd>f</kbd> | <carbon-maximize class="inline-icon-btn"/> <carbon-minimize class="inline-icon-btn"/> | toggle fullscreen | +| <kbd>right</kbd> / <kbd>space</kbd> | <carbon-arrow-right class="inline-icon-btn"/> | next animation or slide | +| <kbd>left</kbd> | <carbon-arrow-left class="inline-icon-btn"/> | previous animation or slide | +| <kbd>up</kbd> | - | previous slide | +| <kbd>down</kbd> | - | next slide | +| <kbd>o</kbd> | <carbon-apps class="inline-icon-btn"/> | toggle [slides overview](#slides-overview) | +| <kbd>d</kbd> | <carbon-sun class="inline-icon-btn"/> <carbon-moon class="inline-icon-btn"/> | toggle dark mode | +| - | <carbon-user-avatar class="inline-icon-btn"/> | toggle [camera view](/guide/recording#camera-view) | +| - | <carbon-video class="inline-icon-btn"/> | [recording](/guide/recording#camera-view) | +| - | <carbon-user-speaker class="inline-icon-btn"/> | enter [presenter mode](/guide/presenter-mode) | +| - | <carbon-edit class="inline-icon-btn"/> | toggle [integrated editor](/guide/editors#integrated-editor) | +| - | <carbon-download class="inline-icon-btn"/> | download slides (only appear in [SPA build](/guide/exporting#single-page-application-spa)) | +| - | <carbon-information class="inline-icon-btn"/> | show information about the slides | +| - | <carbon-settings-adjust class="inline-icon-btn"/> | show settings menu | +| <kbd>g</kbd> | - | show goto... | <br> diff --git a/guide/presenter-mode.md b/guide/presenter-mode.md index 793cc2a..e926339 100644 --- a/guide/presenter-mode.md +++ b/guide/presenter-mode.md @@ -17,11 +17,13 @@ presenter: false ``` Or you can enable it only for `dev` or `build` mode by setting the mode you want in the config: + ```md --- presenter: dev --- ``` + In that case the presenter will only be available when running `slidev` but not when running `slidev build`. ## Remote restricted access diff --git a/guide/syntax.md b/guide/syntax.md index 0606cfa..ce268a8 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -8,7 +8,7 @@ Slides are written within **a single markdown file** (by default `./slides.md`). You can use [the Markdown features](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet) as you normally would, with the additional support of inlined HTML and Vue Components. Styling using [UnoCSS](/custom/config-unocss) is also supported. Use `---` padded with a new line to separate your slides. -~~~md +````md # Slidev Hello, World! @@ -19,9 +19,9 @@ Hello, World! Directly use code blocks for highlighting -//```ts +```ts console.log('Hello, World!') -//``` +``` --- @@ -32,13 +32,15 @@ You can directly use Windi CSS and Vue components to style and enrich your slide <div class="p-3"> <Tweet id="20" /> </div> -~~~ +```` ## Frontmatter & Layouts Specify layouts and other metadata for each slide by converting the separators into [frontmatter blocks](https://jekyllrb.com/docs/front-matter/). Each frontmatter starts with a triple-dash and ends with another. Texts between them are data objects in [YAML](https://www.cloudbees.com/blog/yaml-tutorial-everything-you-need-get-started/) format. For example: -~~~md +<!-- eslint-skip --> + +```md --- layout: cover --- @@ -62,7 +64,7 @@ This is a page with the layout `center` and a background image. # Page 3 This is a default page without any additional metadata. -~~~ +``` Refer to [customization](/custom/) for more details. @@ -73,7 +75,7 @@ Refer to [customization](/custom/) for more details. The custom syntax might not be compactible with some formatters like Prettier. You can either install the [Prettier Plugin](/guide/editors#prettier-plugin) or use a direct `yaml` code block to define the frontmatter instead: -~~~markdown +````md --- layout: cover --- @@ -94,17 +96,17 @@ class: 'text-white' # Page 2 This is a page with the layout `center` and a background image. -~~~ +```` ## Code Blocks One big reason I am building Slidev is needing to make my code look just right in the slides. So just as you expected, you can use Markdown flavored code block to highlight your code. -~~~md +````md ```ts console.log('Hello, World!') ``` -~~~ +```` We support [Prism](https://prismjs.com), [Shiki](https://github.com/shikijs/shiki) as syntax highlighters. Refer to [the highlighters section](/custom/highlighters) for more details. @@ -112,7 +114,7 @@ We support [Prism](https://prismjs.com), [Shiki](https://github.com/shikijs/shik To highlight specific lines, simply add line numbers within bracket `{}`. Line numbers start counting from 1 by default. -~~~md +````md ```ts {2,3} function add( a: Ref<number> | number, @@ -121,11 +123,11 @@ function add( return computed(() => unref(a) + unref(b)) } ``` -~~~ +```` You can enable line number to all slides by setting `lineNumbers: true` on the config or enable each code block individually by setting `lines: true`. You can also set the starting line for each code block and highlight the lines accordingly, defaults to 1: -~~~md +````md ```ts {6,7}{lines:true,startLine:5} function add( a: Ref<number> | number, @@ -134,11 +136,11 @@ function add( return computed(() => unref(a) + unref(b)) } ``` -~~~ +```` To change the highlight in multiple clicks, you can use `|` to separate them: -~~~md +````md ```ts {2-3|5|all} function add( a: Ref<number> | number, @@ -147,13 +149,13 @@ function add( return computed(() => unref(a) + unref(b)) } ``` -~~~ +```` This will first highlight `a: Ref<number> | number` and `b: Ref<number> | number`, and then `return computed(() => unref(a) + unref(b))` after one click, and lastly, the whole block. You can set the line number to `hide` to hide the code block or `none` to not highlight any line: -~~~md +````md ```ts {hide|none} function add( a: Ref<number> | number, @@ -162,7 +164,7 @@ function add( return computed(() => unref(a) + unref(b)) } ``` -~~~ +```` ::: tip Learn more in the [clicks animations guide](./animations#positioning). @@ -170,7 +172,7 @@ Learn more in the [clicks animations guide](./animations#positioning). If the code doesn't fit into one slide, you use the `maxHeight` to set fixed height and enable scrolling: -~~~md +````md ```ts {2|3|7|12}{maxHeight:'100px'} function add( a: Ref<number> | number, @@ -181,7 +183,7 @@ function add( /// ...as many lines as you want const c = add(1, 2) ``` -~~~ +```` ### TwoSlash Integration @@ -193,14 +195,14 @@ This feature is only available when you [set `highlighter` to `shiki`](/custom/h To use it, you can add `twoslash` to the code block's language identifier: -~~~md +````md ```ts twoslash import { ref } from 'vue' const count = ref(0) // ^? ``` -~~~ +```` It will be rendered as: @@ -222,7 +224,7 @@ const count = ref(0) In Slidev, we bind it to the [clicks system](/guide/animations#click-animations). The syntax is wrap multiple code blocks representing each steps with <code>````md magic-move</code> (mind it's **4** backticks), this will be transformed into one code block, that morphing to each steps as you click. -~~~~md +`````md ````md magic-move ```js console.log(`Step ${1}`) @@ -234,11 +236,11 @@ console.log(`Step ${1 + 1}`) console.log(`Step ${3}` as string) ``` ```` -~~~~ +````` It's also possible mix Magic Move with [line highlighting](#line-highlighting), for example: -~~~~md +`````md ````md magic-move {at:4} // [!code hl] ```js {*|1|2-5} // [!code hl] let count = 1 @@ -254,7 +256,7 @@ let count = 1 const add = () => count += 1 ``` ```` -~~~~ +````` <!-- TODO: add an inline demo --> @@ -262,11 +264,11 @@ const add = () => count += 1 Whenever you want to do some modification in the presentation, simply add `{monaco}` after the language id — it turns the block into a fully-featured Monaco editor! -~~~md +````md ```ts {monaco} console.log('HelloWorld') ``` -~~~ +```` Learn more about [configuring Monaco](/custom/config-monaco). @@ -354,7 +356,7 @@ You can also take notes for each slide. They will show up in [Presenter Mode](/g In Markdown, the last comment block in each slide will be treated as a note. -~~~md +```md --- layout: cover --- @@ -376,7 +378,7 @@ The second page <!-- This is another note --> -~~~ +``` Basic Markdown and HTML are also supported in notes on Presenter renderering. @@ -590,24 +592,24 @@ You can also create diagrams / graphs from textual descriptions in your Markdown Code blocks marked as `mermaid` will be converted to diagrams, for example: -~~~md -//```mermaid +````md +```mermaid sequenceDiagram Alice->John: Hello John, how are you? Note over Alice,John: A typical interaction -//``` -~~~ +``` +```` You can further pass an options object to it to specify the scaling and theming. The syntax of the object is a JavaScript object literal, you will need to add quotes (`'`) for strings and use comma (`,`) between keys. -~~~md -//```mermaid {theme: 'neutral', scale: 0.8} +````md +```mermaid {theme: 'neutral', scale: 0.8} graph TD B[Text] --> C{Decision} C -->|One| D[Result 1] C -->|Two| E[Result 2] -//``` -~~~ +``` +```` Learn more: [Demo](https://sli.dev/demo/starter/9) | [Mermaid](https://mermaid-js.github.io/mermaid) @@ -619,6 +621,8 @@ You can split your `slides.md` into multiple files and organize them as you want `slides.md` : +<!-- eslint-skip --> + ```md # Page 1 diff --git a/package.json b/package.json index 251bdf4..4658fd8 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,6 @@ "scripts": { "dev": "vitepress", "build": "vitepress build", - "lint": "eslint .", "postinstall": "node .vitepress/scripts/prepare.js" }, "dependencies": { @@ -14,7 +13,6 @@ "typeit": "^7.0.4" }, "devDependencies": { - "@antfu/eslint-config": "^2.6.4", "@iconify/json": "^2.2.188", "@shikijs/vitepress-twoslash": "^1.1.7", "@slidev/client": "0.34.3", @@ -24,7 +22,6 @@ "@types/fs-extra": "^11.0.4", "@types/node": "^20.11.24", "@unocss/reset": "^0.58.5", - "eslint": "^8.57.0", "fs-extra": "^11.2.0", "markdown-it": "^14.0.0", "shiki": "^1.1.7", From 35595fb2f309cc4da32c9d9ff0169d373a99063d Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Thu, 7 Mar 2024 12:09:16 +0100 Subject: [PATCH 153/211] chore: add back necessary file for docs --- docs/.gitignore | 4 ++++ docs/.npmrc | 2 ++ 2 files changed, 6 insertions(+) create mode 100644 docs/.gitignore create mode 100644 docs/.npmrc diff --git a/docs/.gitignore b/docs/.gitignore new file mode 100644 index 0000000..c62e6a4 --- /dev/null +++ b/docs/.gitignore @@ -0,0 +1,4 @@ +node_modules +dist +.vitepress/@slidev +.vitepress/cache diff --git a/docs/.npmrc b/docs/.npmrc new file mode 100644 index 0000000..cf04042 --- /dev/null +++ b/docs/.npmrc @@ -0,0 +1,2 @@ +shamefully-hoist=true +strict-peer-dependencies=false From df3892f83cceaf89baf69ba5b495d31fbc10f964 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Thu, 7 Mar 2024 13:11:04 +0100 Subject: [PATCH 154/211] docs: mention about the mirrored state --- README.md | 9 +++++++-- sync.js | 28 ++++++++++++++++++++++++++++ 2 files changed, 35 insertions(+), 2 deletions(-) create mode 100644 sync.js diff --git a/README.md b/README.md index 2358ae6..a5f4f71 100644 --- a/README.md +++ b/README.md @@ -1,12 +1,17 @@ # [sli.dev](https://sli.dev) -Documentation for [Slidev](https://github.com/slidevjs/slidev) +> [!IMPORTANT] +> This repository is a mirror of the `docs/` directory in [slidevjs/slidev](https://github.com/slidevjs/slidev/tree/main/docs). Mainly for other translations repositories to sync. +> +> **‼️ Please DO NOT submit pull requests here ‼️**. Instead, send them to the [main repository](https://github.com/slidevjs/slidev), and they will be synced here automatically. + +Mirrored documentation site for [Slidev](https://github.com/slidevjs/slidev) ## Translations | | Repo | Site | Maintainers | | -------------- | ---------------------------------------------- | -------------------------------: | --------------------------------------------------------------------- | -| English | [docs](https://github.com/slidevjs/docs) | [sli.dev](https://sli.dev) | [@antfu](https://github.com/antfu) | +| English | [docs](https://github.com/slidevjs/slidev/tree/main/docs) | [sli.dev](https://sli.dev) | [@antfu](https://github.com/antfu) | | 简体中文 | [docs-cn](https://github.com/slidevjs/docs-cn) | [cn.sli.dev](https://cn.sli.dev) | [@QC-L](https://github.com/QC-L) [@Ivocin](https://github.com/Ivocin) | | Français | [docs-fr](https://github.com/slidevjs/docs-fr) | [fr.sli.dev](https://fr.sli.dev) | [@ArthurDanjou](https://github.com/ArthurDanjou) | | Español | [docs-es](https://github.com/slidevjs/docs-es) | [es.sli.dev](https://es.sli.dev) | [@owlnai](https://github.com/owlnai) | diff --git a/sync.js b/sync.js new file mode 100644 index 0000000..1093d90 --- /dev/null +++ b/sync.js @@ -0,0 +1,28 @@ +/** + * Sync the changes from the main Slidev repository to this repo + * https://stackoverflow.com/a/63745988 + * + * Use `bun sync.js` to run this script + */ +/* eslint-disable no-console */ +import process from 'node:process' +import { $ } from 'bun' + +await $`git remote rm slidev` +await $`git remote add slidev https://github.com/slidevjs/slidev` +await $`git fetch slidev main` + +console.log('Timestamp of last commit:') +const { stdout: timestamp } = await $`git log -1 --format="%at" main` +console.log('Commits since last time:') +const { stdout: hashes } = await $`git log --since="${+(timestamp.toString()) + 1}" slidev/main --format="%H"` + +const firstHash = hashes.toString().trim().split('\n').at(-1) +if (!firstHash) { + console.log('No changes to sync') + process.exit(0) +} + +const command = `git format-patch -k --stdout ${firstHash}...slidev/main --remove-empty -- docs | git am -3 -k --empty=drop` +console.log('Running command:', command) +await $(command) From 9aec2497432f65683b1c64d4c5eb20779478e423 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Thu, 7 Mar 2024 13:28:40 +0100 Subject: [PATCH 155/211] feat: update showcase ui --- .vitepress/config.ts | 4 ++ .vitepress/showcases.ts | 54 ++++++++++---------- .vitepress/theme/components/ShowCaseInfo.vue | 23 ++++----- resources/learning.md | 2 +- showcases.md | 4 -- 5 files changed, 43 insertions(+), 44 deletions(-) diff --git a/.vitepress/config.ts b/.vitepress/config.ts index e6f8ae1..a821790 100644 --- a/.vitepress/config.ts +++ b/.vitepress/config.ts @@ -191,6 +191,10 @@ const slidebars: DefaultTheme.SidebarItem[] = [ text: 'Built-in', items: BuiltIn, }, + { + text: 'Resources', + items: Resources, + }, ] export default defineConfig({ diff --git a/.vitepress/showcases.ts b/.vitepress/showcases.ts index a80eea2..ed6b96a 100644 --- a/.vitepress/showcases.ts +++ b/.vitepress/showcases.ts @@ -20,8 +20,8 @@ export const showcases: ShowCaseInfo[] = [ name: 'Anthony Fu', link: 'https://github.com/antfu', }, - slidesLink: 'https://sli.dev/demo/composable-vue', - sourceLink: 'https://github.com/antfu/talks/tree/master/2021-04-29', + slidesLink: 'https://talks.antfu.me/2021/composable-vue/', + sourceLink: 'https://github.com/antfu/talks/tree/main/2021-04-29', at: 'VueDay 2021', datetime: '2021-04-29', }, @@ -49,29 +49,29 @@ export const showcases: ShowCaseInfo[] = [ at: 'Enter.js Vue Day', datetime: '2021-06-15', }, - { - title: 'Simply Publish Your Package to npm', - author: { - name: 'Lucky Dewa Satria', - link: 'https://github.com/lucky401', - }, - at: 'Weekly sharing', - slidesLink: 'https://masukin.link/talks/simply-publish-your-package-to-npm', - cover: 'https://masukin.link/talks-cover-npm.png', - datetime: '2021-06-12', - }, - { - title: 'Create Icon Package With Vue and Rollup', - author: { - name: 'Lucky Dewa Satria', - link: 'https://github.com/lucky401', - }, - at: 'Weekly Sharing', - slidesLink: 'https://masukin.link/talks/create-icon-package-with-vue-and-rollup', - sourceLink: 'https://github.com/lucky401/Create-Icon-Package-With-Vue-and-Rollup', - cover: 'https://masukin.link/talks-cover-create-icon-package-with-vue-and-rollup.png', - datetime: '2021-06-19', - }, + // { + // title: 'Simply Publish Your Package to npm', + // author: { + // name: 'Lucky Dewa Satria', + // link: 'https://github.com/lucky401', + // }, + // at: 'Weekly sharing', + // slidesLink: 'https://masukin.link/talks/simply-publish-your-package-to-npm', + // cover: 'https://masukin.link/talks-cover-npm.png', + // datetime: '2021-06-12', + // }, + // { + // title: 'Create Icon Package With Vue and Rollup', + // author: { + // name: 'Lucky Dewa Satria', + // link: 'https://github.com/lucky401', + // }, + // at: 'Weekly Sharing', + // slidesLink: 'https://masukin.link/talks/create-icon-package-with-vue-and-rollup', + // sourceLink: 'https://github.com/lucky401/Create-Icon-Package-With-Vue-and-Rollup', + // cover: 'https://masukin.link/talks-cover-create-icon-package-with-vue-and-rollup.png', + // datetime: '2021-06-19', + // }, { title: 'BeAPT', author: { @@ -199,6 +199,6 @@ export const showcases: ShowCaseInfo[] = [ at: 'Submit your talk/presentation to be list here!', slidesLink: 'https://github.com/slidevjs/docs/edit/main/.vitepress/showcases.ts', cover: `${import.meta.env.BASE_URL}theme-placeholder.png`, - datetime: '2021-04-29', + datetime: '2020-1-1', }, -] +].sort((a, b) => new Date(b.datetime).getTime() - new Date(a.datetime).getTime()) diff --git a/.vitepress/theme/components/ShowCaseInfo.vue b/.vitepress/theme/components/ShowCaseInfo.vue index 8f0a87a..49e475e 100644 --- a/.vitepress/theme/components/ShowCaseInfo.vue +++ b/.vitepress/theme/components/ShowCaseInfo.vue @@ -7,8 +7,8 @@ defineProps<{ </script> <template> - <div> - <div class="block mb-1.5 w-full relative aspect-16/9"> + <div class="flex flex-col gap-2"> + <div class="block w-full relative aspect-16/9"> <a class="absolute top-0 bottom-0 left-0 right-0 overflow-hidden" border="~ rounded gray-400 opacity-20" @@ -18,29 +18,28 @@ defineProps<{ <img :src="info.cover"> </a> </div> - <div class="font-bold"> + <div class="font-bold line-clamp-2"> {{ info.title }} </div> - <div - class="text-current text-xs opacity-75 whitespace-nowrap overflow-hidden overflow-ellipsis" - > + <div class="text-current text-xs opacity-75 whitespace-nowrap overflow-hidden overflow-ellipsis"> {{ info.at }} </div> - <div class="mt-2 flex"> + <div class="flex-auto" /> + <div class="flex"> <a v-if="info.author.link" :href="info.author.link" - class="text-current text-sm opacity-50" + class="text-current! text-sm opacity-50 whitespace-nowrap overflow-hidden overflow-ellipsis" target="_blank" >{{ info.author.name }}</a> - <div v-else class="text-current text-sm opacity-50"> + <div v-else class="text-current! text-sm opacity-50 whitespace-nowrap overflow-hidden overflow-ellipsis"> {{ info.author.name }} </div> <div class="flex-auto" /> <a v-if="info.videoLink" :href="info.videoLink" - class="ml-2 text-current opacity-20 hover:opacity-100 hover:text-[#cb3837]" + class="ml-2 text-current! opacity-20 hover:opacity-100 hover:text-[#cb3837]" target="_blank" > <carbon:video /> @@ -48,7 +47,7 @@ defineProps<{ <a v-if="info.slidesLink" :href="info.slidesLink" - class="ml-2 text-current opacity-20 hover:opacity-100 hover:text-[#cb3837]" + class="ml-2 text-current! opacity-20 hover:opacity-100 hover:text-[#cb3837]" target="_blank" > <carbon:presentation-file /> @@ -56,7 +55,7 @@ defineProps<{ <a v-if="info.sourceLink" :href="info.sourceLink" - class="ml-2 text-current opacity-20 hover:opacity-100" + class="ml-2 text-current! opacity-20 hover:opacity-100" target="_blank" > <carbon:logo-github /> diff --git a/resources/learning.md b/resources/learning.md index 614872d..ae64567 100644 --- a/resources/learning.md +++ b/resources/learning.md @@ -4,7 +4,7 @@ ### Videos -<iframe class="aspect-16/9 rounded-xl w-full shadow-md border-none" src="https://www.youtube-nocookie.com/embed/oSgM6GoSwyY" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> +- [Slidev - one of the best presentation software and it is free!](https://www.youtube.com/watch?v=oSgM6GoSwyY) - by [Federico Tartarini](https://www.youtube.com/@FedericoTartarini) ### Articles diff --git a/showcases.md b/showcases.md index 0ba8941..7eaa605 100644 --- a/showcases.md +++ b/showcases.md @@ -1,7 +1,3 @@ ---- -sidebar: false ---- - # Showcases Talks / Presentations using Slidev. From 856b1a093f22b055b9efa14ee68975fe9d2c0c09 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Thu, 7 Mar 2024 13:32:23 +0100 Subject: [PATCH 156/211] docs: update docker usage Co-authored-by: tangramor <tangramor@users.noreply.github.com> close https://github.com/slidevjs/docs/pull/158 --- guide/exporting.md | 18 ++++++++++++++++++ guide/install.md | 4 +++- 2 files changed, 21 insertions(+), 1 deletion(-) diff --git a/guide/exporting.md b/guide/exporting.md index 705e0a0..614190f 100644 --- a/guide/exporting.md +++ b/guide/exporting.md @@ -131,6 +131,24 @@ This command also accept multiple entries like for the [export command](#multipl See [Static Hosting](/guide/hosting). +## Exportable Docker Image + +To support the export feature, there is a [docker image](/guide/install#install-on-docker) (maintianed by [@tangramor](https://github.com/tangramor)) with tag **playwright**. Run following command in your work folder: + +```bash +docker run --name slidev --rm -it \ + -v ${PWD}:/slidev \ + -p 3030:3030 \ + -e NPM_MIRROR="https://registry.npmmirror.com" \ + tangramor/slidev:playwright +``` + +Then you can use the export feature like following under your work folder: + +```bash +docker exec -i slidev npx slidev export --timeout 2m --output slides.pdf +``` + ## Troubleshooting ### Timeout diff --git a/guide/install.md b/guide/install.md index 48a6e10..ede1e43 100644 --- a/guide/install.md +++ b/guide/install.md @@ -71,9 +71,12 @@ docker run --name slidev --rm -it \ --user node \ -v ${PWD}:/slidev \ -p 3030:3030 \ + -e NPM_MIRROR="https://registry.npmmirror.com" \ tangramor/slidev:latest ``` +**_Note_**: You can use `NPM_MIRROR` to specify a npm mirror to speed up the installation process. + If your work folder is empty, it will generate a template `slides.md` and other related files under your work folder, and launch the server on port `3030`. You can access your slides from `http://localhost:3030/` @@ -86,7 +89,6 @@ Or you can create your own slidev project to a docker image with Dockerfile: FROM tangramor/slidev:latest ADD . /slidev - ``` Create the docker image: `docker build -t myppt .` From 44554acaeea65736591404f8ecb27032fcef9815 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Thu, 7 Mar 2024 13:33:41 +0100 Subject: [PATCH 157/211] docs: add `slidev-theme-hep` Co-authored-by: AvencastF <AvencastF@users.noreply.github.com> close https://github.com/slidevjs/docs/pull/179 --- .vitepress/themes.ts | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/.vitepress/themes.ts b/.vitepress/themes.ts index 6961e0e..5fa751e 100644 --- a/.vitepress/themes.ts +++ b/.vitepress/themes.ts @@ -426,6 +426,25 @@ export const community: ThemeInfo[] = [ 'light', ], }, + { + id: 'slidev-theme-hep', + name: 'HEP', + description: 'Academic style for High Energy Physics', + author: { + name: 'Yulei ZHANG', + link: 'https://github.com/AvencastF', + }, + repo: 'https://github.com/AvencastF/slidev-theme-hep', + previews: [ + 'https://cdn.jsdelivr.net/gh/avencastf/slidev-theme-hep/screenshot/001.png', + 'https://cdn.jsdelivr.net/gh/avencastf/slidev-theme-hep/screenshot/004.png', + 'https://cdn.jsdelivr.net/gh/avencastf/slidev-theme-hep/screenshot/006.png', + 'https://cdn.jsdelivr.net/gh/avencastf/slidev-theme-hep/screenshot/008.png', + ], + tags: [ + 'light', + ], + }, // Add yours here! { id: '', From 31ad7e577ec9e1d29f2624b500e0a4be3091cec3 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Thu, 7 Mar 2024 13:38:36 +0100 Subject: [PATCH 158/211] docs: add showcase Co-authored-by: SuneBear <SuneBear@users.noreply.github.com> close https://github.com/slidevjs/docs/pull/153 --- .vitepress/showcases.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/.vitepress/showcases.ts b/.vitepress/showcases.ts index ed6b96a..c0bfd2e 100644 --- a/.vitepress/showcases.ts +++ b/.vitepress/showcases.ts @@ -190,6 +190,18 @@ export const showcases: ShowCaseInfo[] = [ at: 'Presentation on Social Engineering in Computers in Society class', datetime: '2023-10-20', }, + { + title: 'Diablo Health Orb Shader', + author: { + name: 'SuneBear', + link: 'https://github.com/sunebear', + }, + at: 'rctAI Sessions', + slidesLink: 'https://rct-ai.github.io/frontend-slides/diablo-health-orb-shader/', + sourceLink: 'https://github.com/rct-ai/frontend-slides', + cover: 'https://github-production-user-asset-6210df.s3.amazonaws.com/7693264/284304324-db973b4c-a043-4644-932c-826169a1b4d8.gif', + datetime: '2022-09-01', + }, // Add yours here! { title: 'Yours?', From 948b75ddb1f4429a20b0d68bd24bebbaedf0bcd2 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Thu, 7 Mar 2024 13:47:07 +0100 Subject: [PATCH 159/211] chore: update sync script --- sync.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/sync.js b/sync.js index 1093d90..d3ecc51 100644 --- a/sync.js +++ b/sync.js @@ -12,9 +12,9 @@ await $`git remote rm slidev` await $`git remote add slidev https://github.com/slidevjs/slidev` await $`git fetch slidev main` -console.log('Timestamp of last commit:') +console.log('\nTimestamp of last commit:') const { stdout: timestamp } = await $`git log -1 --format="%at" main` -console.log('Commits since last time:') +console.log('\nCommits since last time:') const { stdout: hashes } = await $`git log --since="${+(timestamp.toString()) + 1}" slidev/main --format="%H"` const firstHash = hashes.toString().trim().split('\n').at(-1) @@ -24,5 +24,5 @@ if (!firstHash) { } const command = `git format-patch -k --stdout ${firstHash}...slidev/main --remove-empty -- docs | git am -3 -k --empty=drop` -console.log('Running command:', command) -await $(command) +console.log('\nRunning command:', command) +await $`git format-patch -k --stdout ${firstHash}...slidev/main --remove-empty -- docs | git am -3 -k --empty=drop` From 69e1142c6f07cb04fb7fea7f396de60cd1f0538f Mon Sep 17 00:00:00 2001 From: Shane Crowley <66971213+edibotopic@users.noreply.github.com> Date: Mon, 8 Apr 2024 13:41:51 +0100 Subject: [PATCH 160/211] chore: typo (#183) --- custom/highlighters.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/custom/highlighters.md b/custom/highlighters.md index e00f9b4..b25a96a 100644 --- a/custom/highlighters.md +++ b/custom/highlighters.md @@ -7,7 +7,7 @@ Slidev comes with two syntax highlighters for you to choose from: **Prism** is one of the most popular syntax highlighters. The highlighting is done by adding token classes to the code and it's colored using CSS. You can browse through their [official themes](https://github.com/PrismJS/prism-themes), or create/customize one yourself very easily using [`prism-theme-vars`](https://github.com/antfu/prism-theme-vars). -**Shiki** is a TextMate grammar-powered syntax highlighter. It generates colored tokens, so there is no additional CSS needed. Since it has great grammar support, the generated colors are very accurate, just like what you will see in VS Code. Shiki also comes with [a bunch of built-in themes](https://shiki.style/themes). In Slidev, we also provided the [TwoSlash](#twoslash-integration) support is also built-in. +**Shiki** is a TextMate grammar-powered syntax highlighter. It generates colored tokens, so there is no additional CSS needed. Since it has great grammar support, the generated colors are very accurate, just like what you will see in VS Code. Shiki also comes with [a bunch of built-in themes](https://shiki.style/themes). In Slidev, [TwoSlash](https://sli.dev/guide/syntax#twoslash-integration) support is also built-in. Slidev themes usually support both Prism and Shiki, but depending on the theme you are using, it might only support one of them. From 6ed96317b65e08e5ef21ffe1581620725257f88f Mon Sep 17 00:00:00 2001 From: Caichong <951412526@qq.com> Date: Wed, 10 Apr 2024 08:44:23 +0800 Subject: [PATCH 161/211] docs: fix typo in exporting.md (#1511) --- guide/exporting.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/guide/exporting.md b/guide/exporting.md index 614190f..adb68b4 100644 --- a/guide/exporting.md +++ b/guide/exporting.md @@ -133,7 +133,7 @@ See [Static Hosting](/guide/hosting). ## Exportable Docker Image -To support the export feature, there is a [docker image](/guide/install#install-on-docker) (maintianed by [@tangramor](https://github.com/tangramor)) with tag **playwright**. Run following command in your work folder: +To support the export feature, there is a [docker image](/guide/install#install-on-docker) (maintained by [@tangramor](https://github.com/tangramor)) with tag **playwright**. Run following command in your work folder: ```bash docker run --name slidev --rm -it \ From 28ed54c28ab9a416606e181943e61a20499f6d84 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Wed, 10 Apr 2024 09:58:50 +0800 Subject: [PATCH 162/211] feat: enhance `SlidevVideo` component (#1435) --- builtin/components.md | 46 +++++++++++++++++++++++++++++++++++++++++++ guide/exporting.md | 32 +++++++++++++++++++----------- 2 files changed, 66 insertions(+), 12 deletions(-) diff --git a/builtin/components.md b/builtin/components.md index 17fd27e..9270c15 100644 --- a/builtin/components.md +++ b/builtin/components.md @@ -1,3 +1,7 @@ +--- +outline: [2, 3] +--- + # Components ## Built-in Components @@ -255,6 +259,48 @@ Parameters: See https://sli.dev/guide/animations.html +### `SlidevVideo` + +Embed a video. + +#### Usage + +```md +<SlidevVideo> + <!-- Anything that can go in a HTML video element. --> + <source src="myMovie.mp4" type="video/mp4" /> + <source src="myMovie.webm" type="video/webm" /> + <p> + Your browser does not support videos. You may download it + <a href="myMovie.mp4">here</a>. + </p> +</SlidevVideo> +``` + +Check [HTML video element's doc](https://developer.mozilla.org/docs/Web/HTML/Element/Video) to see what can be included in this component's slot. + +Parameters: + +- `controls` (`boolean`, default: `false`): show the video controls +- `autoplay` (`boolean | 'once'`, default: `false`): + - `true` or `'once'`: start the video only once and does not restart it once ended or paused + - `false`: never automatically start the video (rely on `controls` instead) +- `autoreset` (`'slide' | 'click'`, default: `undefined`): + - `'slide'`: go back to the start of the video when going back to the slide + - `'click'`: go back to the start of the video when going back to the component's click turn +- `poster` (`string | undefined`, default: `undefined`): + - The source of the image to print when the video is not playing. +- `printPoster` (`string | undefined`, default: `undefined`): + - The override for `poster` when printing. +- `timestamp` (`string | number`, default: `0`): + - The starting time of the video in seconds. +- `printTimestamp` (`string | number | 'last' | undefined`, default: `undefined`): + - The override for `timestamp` when printing. + +::: warning +When exporting, the video may fail to load because Chromium does not support some video formats. In this case, you can specify the executable path of the browser. See [Chromium executable path](/guide/exporting.html#executable-path) for more information. +::: + ### `Youtube` Embed a youtube video. diff --git a/guide/exporting.md b/guide/exporting.md index adb68b4..c83e2d5 100644 --- a/guide/exporting.md +++ b/guide/exporting.md @@ -4,16 +4,16 @@ ### PDF -> Exporting to PDF or PNG relies on [Playwright](https://playwright.dev) for rendering. You will therefore need to install [`playwright-chromium`](https://playwright.dev/docs/installation#download-single-browser-binary) to use this feature. +> Exporting to PDF or PNG relies on [Playwright](https://playwright.dev) for rendering. You will therefore need to install [`playwright-chromium`](https://npmjs.com/package/playwright-chromium) to use this feature. > If you are doing exporting in a CI environment, [the playwright CI guide](https://playwright.dev/docs/ci) can be helpful. -Install `playwright-chromium` +1. Install `playwright-chromium`: ```bash $ npm i -D playwright-chromium ``` -Now export your slides to PDF using the following command +2. Now export your slides to PDF using the following command: ```bash $ slidev export @@ -23,13 +23,13 @@ After a few seconds, your slides will be ready at `./slides-export.pdf`. ### PNGs and Markdown -When passing in the `--format png` option, Slidev will export PNG images for each slide instead of a PDF. +When passing in the `--format png` option, Slidev will export PNG images for each slide instead of a PDF: ```bash $ slidev export --format png ``` -You can also compile a markdown file composed of compiled png using `--format md`. +You can also compile a markdown file composed of compiled png using `--format md`: ```bash $ slidev export --format md @@ -47,7 +47,7 @@ $ slidev export --dark > Available since v0.21 -By default, Slidev exports one page per slide with clicks animations disabled. If you want export slides with multiple steps into multiple pages, pass the `--with-clicks` option. +By default, Slidev exports one page per slide with clicks animations disabled. If you want to export slides with multiple steps into multiple pages, pass the `--with-clicks` option: ```bash $ slidev export --with-clicks @@ -55,7 +55,7 @@ $ slidev export --with-clicks ### Slide range -You can also specify a range of slides to export with the `--range` option. +You can also specify a range of slides to export with the `--range` option: ```bash $ slidev export --range 1,4-5,6 @@ -65,7 +65,7 @@ $ slidev export --range 1,4-5,6 > Available since v0.36.10 -You can generate the PDF outline by passing the `--with-toc` option. +You can generate the PDF outline by passing the `--with-toc` option: ```bash $ slidev export --with-toc @@ -73,7 +73,7 @@ $ slidev export --with-toc ### Output filename -You can specify the output filename with the `--output` option. +You can specify the output filename with the `--output` option: ```bash $ slidev export --output my-pdf-export @@ -89,7 +89,7 @@ exportFilename: my-pdf-export ### Export a range of slides -By default, all slides in the presentation are exported. If you want to export a specific slide or a range of slides you can set the `--range` option and specify which slides you would like to export. +By default, all slides in the presentation are exported. If you want to export a specific slide or a range of slides you can set the `--range` option and specify which slides you would like to export: ```bash $ slidev export --range 1,6-8,10 @@ -101,7 +101,7 @@ The example above would export slides 1,6,7,8, and 10. ### Multiple entries -You can also export multiple slides at once. +You can also export multiple slides at once: ```bash $ slidev export slides1.md slides1.md @@ -119,7 +119,7 @@ In this case, each input file will generate its own PDf file. > Available since v0.36.8 -Export only the presenter notes (the last comment block for each slide) into a text document in PDF. +Export only the presenter notes (the last comment block for each slide) into a text document in PDF: ```bash $ slidev export-notes @@ -153,7 +153,11 @@ docker exec -i slidev npx slidev export --timeout 2m --output slides.pdf ### Timeout +<<<<<<< HEAD:guide/exporting.md For big presentation you might want to increase the playwrigth timeout with `--timeout` +======= +For big presentations you might want to increase the Playwright timeout with `--timeout`: +>>>>>>> feat: enhance `SlidevVideo` component (#1435):docs/guide/exporting.md ```bash $ slidev export --timeout 60000 @@ -161,7 +165,11 @@ $ slidev export --timeout 60000 ### Executable path +<<<<<<< HEAD:guide/exporting.md You can set the browser executable path for playwright using `--executable-path` +======= +Chromium may miss some features like codecs that are required to decode some videos. You can set the browser executable path for Playwright to your Chrome or Edge using `--executable-path`: +>>>>>>> feat: enhance `SlidevVideo` component (#1435):docs/guide/exporting.md ```bash $ slidev export --executable-path [path_to_chromium] From de9936fbe2e61c721b19227163dafcb7adbfa294 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Wed, 10 Apr 2024 10:07:50 +0800 Subject: [PATCH 163/211] feat: draggable element (#1402) Co-authored-by: Anthony Fu <anthonyfu117@hotmail.com> --- .vitepress/config.ts | 16 ++++++++-- builtin/components.md | 4 +++ custom/index.md | 1 + docs/guide/draggable.md | 66 +++++++++++++++++++++++++++++++++++++++++ 4 files changed, 85 insertions(+), 2 deletions(-) create mode 100644 docs/guide/draggable.md diff --git a/.vitepress/config.ts b/.vitepress/config.ts index a821790..5e187a8 100644 --- a/.vitepress/config.ts +++ b/.vitepress/config.ts @@ -30,8 +30,20 @@ const Guide: DefaultTheme.NavItemWithLink[] = [ link: '/guide/animations', }, { - text: 'Exporting', - link: '/guide/exporting', + text: 'Draggable Elements', + link: '/guide/draggable', + }, + { + text: 'Presenter Mode', + link: '/guide/presenter-mode', + }, + { + text: 'Slides Overview', + link: '/guide/overview', + }, + { + text: 'Drawing & Annotations', + link: '/guide/drawing', }, { text: 'Static Hosting', diff --git a/builtin/components.md b/builtin/components.md index 9270c15..6ad80b4 100644 --- a/builtin/components.md +++ b/builtin/components.md @@ -259,6 +259,10 @@ Parameters: See https://sli.dev/guide/animations.html +### `VDrag` + +See https://sli.dev/guide/draggable.html + ### `SlidevVideo` Embed a video. diff --git a/custom/index.md b/custom/index.md index fa9d36c..1b16855 100644 --- a/custom/index.md +++ b/custom/index.md @@ -111,6 +111,7 @@ In addition, every slide accepts the following configuration in the Frontmatter - `title` (`string`): Override the title for the `<Title>` and `<Toc>` components (learn more [here](/builtin/components.html#titles)). - `transition` (`string | TransitionProps`): Defines the transition between the slide and the next one (learn more [here](/guide/animations.html#slide-transitions)). - `zoom` (`number`): Custom zoom scale. Useful for slides with a lot of content. +- `dragPos` (`Record<string,string>`): Used as positions of draggable elements (learn more [here](/guide/draggable.html). ## Directory Structure diff --git a/docs/guide/draggable.md b/docs/guide/draggable.md new file mode 100644 index 0000000..02a2164 --- /dev/null +++ b/docs/guide/draggable.md @@ -0,0 +1,66 @@ +# Draggable Elements + +Draggable elements give you the ability to move, resize and rotate elements by dragging them with the mouse. This is useful for creating floating elements in your slides. + +## Directive Usage + +### Data from the frontmatter + +```md +--- +dragPos: + square: Left,Top,Width,Height,Rotate +--- + +<img v-drag="'square'" src="https://sli.dev/logo.png"> +``` + +### Data from the directive value + +::: warning +Slidev use regex to update the position value in the slide content. If you meet problems, please use the frontmatter to define the values instead. +::: + +```md +<img v-drag="[Left,Top,Width,Height,Rotate]" src="https://sli.dev/logo.png"> +``` + +## Component Usage + +### Data from the frontmatter + +```md +--- +dragPos: + foo: Left,Top,Width,Height,Rotate +--- + +<v-drag pos="foo" text-3xl> + <carbon:arrow-up /> + Use the `v-drag` component to have a draggable container! +</v-drag> +``` + +### Data from props + +```md +<v-drag pos="Left,Top,Width,Height,Rotate" text-3xl> + <carbon:arrow-up /> + Use the `v-drag` component to have a draggable container! +</v-drag> +``` + +## Automatic Height + +You can set `Height` to `NaN` (if you use the directive) or `_` (if you use the component) to make the height of the draggable element automatically adjust to its content. + +## Create a Draggable Element + +When you first create a draggable element, you don't need to specify the position value (but you need to specify the position name if you want to use the frontmatter). Slidev will automatically generate the initial position value for you. + +## Controls + +- Double click the draggable element to start dragging it. +- You can also use the arrow keys to move the element. +- Hold `Shift` while dragging to preserve its aspect ratio. +- Click outside the draggable element to stop dragging it. From 9104a10d594fb78c0e8d0c871b2025a11acb75a0 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Wed, 10 Apr 2024 04:18:39 +0200 Subject: [PATCH 164/211] chore: update deps --- package.json | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/package.json b/package.json index 4658fd8..7fb0e1b 100644 --- a/package.json +++ b/package.json @@ -13,23 +13,23 @@ "typeit": "^7.0.4" }, "devDependencies": { - "@iconify/json": "^2.2.188", - "@shikijs/vitepress-twoslash": "^1.1.7", + "@iconify/json": "^2.2.199", + "@shikijs/vitepress-twoslash": "^1.3.0", "@slidev/client": "0.34.3", "@slidev/parser": "0.34.3", "@slidev/theme-default": "0.21.2", "@slidev/types": "0.34.3", "@types/fs-extra": "^11.0.4", - "@types/node": "^20.11.24", - "@unocss/reset": "^0.58.5", + "@types/node": "^20.12.7", + "@unocss/reset": "^0.59.0", "fs-extra": "^11.2.0", - "markdown-it": "^14.0.0", - "shiki": "^1.1.7", - "typescript": "^5.3.3", - "unocss": "^0.58.5", + "markdown-it": "^14.1.0", + "shiki": "^1.3.0", + "typescript": "^5.4.4", + "unocss": "^0.59.0", "unplugin-icons": "^0.18.5", "unplugin-vue-components": "^0.26.0", "vite-plugin-inspect": "^0.8.3", - "vitepress": "^1.0.0-rc.44" + "vitepress": "^1.1.0" } } From c27f419806bb73195ad4efb62c7b99b474c047cc Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Fri, 12 Apr 2024 00:25:26 +0800 Subject: [PATCH 165/211] feat: more uniformed click animations (#1508) --- builtin/components.md | 2 +- guide/animations.md | 11 ++++++++--- guide/syntax.md | 20 ++++++++++++++++++++ 3 files changed, 29 insertions(+), 4 deletions(-) diff --git a/builtin/components.md b/builtin/components.md index 6ad80b4..9c41d42 100644 --- a/builtin/components.md +++ b/builtin/components.md @@ -270,7 +270,7 @@ Embed a video. #### Usage ```md -<SlidevVideo> +<SlidevVideo v-click autoplay controls> <!-- Anything that can go in a HTML video element. --> <source src="myMovie.mp4" type="video/mp4" /> <source src="myMovie.webm" type="video/webm" /> diff --git a/guide/animations.md b/guide/animations.md index 285a191..cefcac9 100644 --- a/guide/animations.md +++ b/guide/animations.md @@ -187,12 +187,17 @@ The following example synchronizes the highlighting of the two code blocks: ### Enter & Leave -> Available since v0.43.0 - You can also specify the enter and leave index for the `v-click` directive by passing an array. The end index is exclusive. ```md -<div v-click="[2, 4]">This will be shown on the 2nd and 3rd clicks, and hide again after the 4th.</div> +<div v-click.hide="[2, 4]"> + This will be hidden at click 2 and 3. +</div> + +<div v-click /> +<div v-click="'[+1, +1]'"> + This will be shown at click 3, and hidden since click 4. +</div> ``` ### Custom Total Clicks Count diff --git a/guide/syntax.md b/guide/syntax.md index ce268a8..1c92c05 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -292,6 +292,26 @@ This line is removed on the left. ``` ```` +It will provide the editor with a "Run" button, and shows the result right below the code block. You many also modify the code and the result will be re-evaluated on the fly. + +By default it will automatically runs the code when the slide is loaded, if you want to always explicitly trigger the run, you can set `{autorun:false}`. + +````md +```ts {monaco-run} {autorun:false} +console.log('Click the play button to run me') +``` +```` + +If you want to only show the output in certain clicks, you can use the `showOutputAt` prop. The value is the same as `v-click`. + +````md +```ts {monaco-run} {showOutputAt:'+1'} +console.log('Shown after 1 click') +``` +```` + +Currently Slidev supports running JavaScript and TypeScript code out-of-box. Refer to [Custom Code Runners](/custom/config-code-runners) for custom languages support. + ## Embedded Styles You can use `<style>` tag in your Markdown directly to override styles for the **current slide**. From f989a30ece7abe219889add3f3a4cedbd2a19cd3 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Fri, 12 Apr 2024 01:03:14 +0800 Subject: [PATCH 166/211] feat: context menu (#1475) Co-authored-by: Anthony Fu <anthonyfu117@hotmail.com> --- .vitepress/config.ts | 8 ++++++++ custom/index.md | 2 ++ docs/custom/config-context-menu.md | 33 ++++++++++++++++++++++++++++++ 3 files changed, 43 insertions(+) create mode 100644 docs/custom/config-context-menu.md diff --git a/.vitepress/config.ts b/.vitepress/config.ts index 5e187a8..27546cc 100644 --- a/.vitepress/config.ts +++ b/.vitepress/config.ts @@ -157,6 +157,14 @@ const Customizations: (DefaultTheme.NavItemWithLink | DefaultTheme.NavItemChildr text: 'Configure Shortcuts', link: '/custom/config-shortcuts', }, + { + text: 'Configure Code Runners', + link: '/custom/config-code-runners', + }, + { + text: 'Configure Context Menu', + link: '/custom/config-context-menu', + }, { text: 'Vue Global Context', link: '/custom/vue-context', diff --git a/custom/index.md b/custom/index.md index 1b16855..a359b5e 100644 --- a/custom/index.md +++ b/custom/index.md @@ -49,6 +49,8 @@ remoteAssets: false selectable: true # enable slide recording, can be boolean, 'dev' or 'build' record: dev +# enable Slidev's context menu, can be boolean, 'dev' or 'build' +contextMenu: true # force color schema for the slides, can be 'auto', 'light', or 'dark' colorSchema: auto diff --git a/docs/custom/config-context-menu.md b/docs/custom/config-context-menu.md new file mode 100644 index 0000000..12e6e1b --- /dev/null +++ b/docs/custom/config-context-menu.md @@ -0,0 +1,33 @@ +# Configure Context Menu + +<Environment type="client" /> + +Customize the context menu items in Slidev. + +Create `./setup/context-menu.ts` with the following content: + +```ts +import { defineContextMenuSetup } from '@slidev/types' +import { computed } from 'vue' +import Icon3DCursor from '~icons/carbon/3d-cursor' + +export default defineContextMenuSetup((items) => { + const { isPresenter } = useNav() + return computed(() => [ + ...items.value, + { + small: false, + icon: Icon3DCursor, // Used as `title` if `small` is `true` + label: 'Custom Menu Item', // or a Vue component + action() { + alert('Custom Menu Item Clicked!') + }, + disabled: isPresenter.value, + }, + ]) +}) +``` + +This will append a new menu item to the context menu. + +To disable context menu globally, set `contextMenu` to `false` in the frontmatter. `contextMenu` can also be set to `dev` or `build` to only enable the context menu in development or build mode. From 92214a683af78e943684e47a2d5dc68f43aa5e83 Mon Sep 17 00:00:00 2001 From: lauriegriffiths <laurie.in.japan@gmail.com> Date: Fri, 12 Apr 2024 21:48:12 +0900 Subject: [PATCH 167/211] docs: add example of a shiki custom language grammar (#1521) Co-authored-by: Laurie Griffiths <laurie@steampunk.digital> Co-authored-by: _Kerman <kermanx@qq.com> --- custom/highlighters.md | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/custom/highlighters.md b/custom/highlighters.md index b25a96a..5a62e8a 100644 --- a/custom/highlighters.md +++ b/custom/highlighters.md @@ -33,6 +33,7 @@ Create `./setup/shiki.ts` file with the following content ```ts /* ./setup/shiki.ts */ import { defineShikiSetup } from '@slidev/types' +import customLanguage from './customLanguage.tmLanguage.json' export default defineShikiSetup(() => { return { @@ -40,9 +41,13 @@ export default defineShikiSetup(() => { dark: 'min-dark', light: 'min-light', }, + langs: [ + 'cpp', + customLanguage, + ], transformers: [ // ... - ] + ], } }) ``` From 1a10627fd4e236ffe6dfa3d46da0416e71854934 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Fri, 12 Apr 2024 14:47:31 +0200 Subject: [PATCH 168/211] chore: update deps --- package.json | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index 7fb0e1b..69c0d8c 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,7 @@ "typeit": "^7.0.4" }, "devDependencies": { - "@iconify/json": "^2.2.199", + "@iconify/json": "^2.2.200", "@shikijs/vitepress-twoslash": "^1.3.0", "@slidev/client": "0.34.3", "@slidev/parser": "0.34.3", @@ -21,12 +21,12 @@ "@slidev/types": "0.34.3", "@types/fs-extra": "^11.0.4", "@types/node": "^20.12.7", - "@unocss/reset": "^0.59.0", + "@unocss/reset": "^0.59.2", "fs-extra": "^11.2.0", "markdown-it": "^14.1.0", "shiki": "^1.3.0", - "typescript": "^5.4.4", - "unocss": "^0.59.0", + "typescript": "^5.4.5", + "unocss": "^0.59.2", "unplugin-icons": "^0.18.5", "unplugin-vue-components": "^0.26.0", "vite-plugin-inspect": "^0.8.3", From 3f882f05cd51c554f022b27a61400db9994f1816 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?M=C3=A1t=C3=A9=20Gy=C3=B6ngy=C3=B6si?= <gyongyosimate1@gmail.com> Date: Mon, 15 Apr 2024 13:12:14 +0200 Subject: [PATCH 169/211] Changed page edit link from the mirrored repo to the actual one (#1534) --- .vitepress/config.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.vitepress/config.ts b/.vitepress/config.ts index 27546cc..a98a76d 100644 --- a/.vitepress/config.ts +++ b/.vitepress/config.ts @@ -254,7 +254,7 @@ export default defineConfig({ themeConfig: { logo: '/logo.svg', editLink: { - pattern: 'https://github.com/slidevjs/docs/edit/main/:path', + pattern: 'https://github.com/slidevjs/slidev/edit/main/docs/:path', text: 'Suggest changes to this page', }, From 593b728a0ed409ee2150cb5e53a60966b920320e Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Mon, 15 Apr 2024 19:43:50 +0800 Subject: [PATCH 170/211] feat: setup for routes (#1529) --- .vitepress/config.ts | 4 ++++ docs/custom/config-routes.md | 25 +++++++++++++++++++++++++ 2 files changed, 29 insertions(+) create mode 100644 docs/custom/config-routes.md diff --git a/.vitepress/config.ts b/.vitepress/config.ts index a98a76d..f1ea37c 100644 --- a/.vitepress/config.ts +++ b/.vitepress/config.ts @@ -153,6 +153,10 @@ const Customizations: (DefaultTheme.NavItemWithLink | DefaultTheme.NavItemChildr text: 'Configure Parser', link: '/custom/config-parser', }, + { + text: 'Configure Routes', + link: '/custom/config-routes', + }, { text: 'Configure Shortcuts', link: '/custom/config-shortcuts', diff --git a/docs/custom/config-routes.md b/docs/custom/config-routes.md new file mode 100644 index 0000000..88706ed --- /dev/null +++ b/docs/custom/config-routes.md @@ -0,0 +1,25 @@ +# Configure Routes + +<Environment type="client" /> + +Add your pages to the Slidev app. + +## Usage + +Create `./setup/routes.ts` with the following content: + +```ts +import { defineRoutesSetup } from '@slidev/types' + +export default defineRoutesSetup((routes) => { + return [ + ...routes, + { + path: '/my-page', + component: () => import('../pages/my-page.vue'), + }, + ] +}) +``` + +Learn more about routes in the [Vue Router documentation](https://router.vuejs.org/). From 7deb86f9959062a70ed1d808dd192d3b8d1fa0ba Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nguy=E1=BB=85n=20H=E1=BB=93ng=20Qu=C3=A2n?= <ng.hong.quan@gmail.com> Date: Mon, 15 Apr 2024 18:44:13 +0700 Subject: [PATCH 171/211] docs: add showcase for a talk about Rust (#1523) --- .vitepress/showcases.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/.vitepress/showcases.ts b/.vitepress/showcases.ts index c0bfd2e..497c1b0 100644 --- a/.vitepress/showcases.ts +++ b/.vitepress/showcases.ts @@ -202,6 +202,18 @@ export const showcases: ShowCaseInfo[] = [ cover: 'https://github-production-user-asset-6210df.s3.amazonaws.com/7693264/284304324-db973b4c-a043-4644-932c-826169a1b4d8.gif', datetime: '2022-09-01', }, + { + title: 'How Rust error handling ease web development', + author: { + name: 'Nguyễn Hồng Quân', + link: 'https://quan.hoabinh.vn', + }, + at: 'FOSSASIA Summit 2024', + slidesLink: 'https://talk.quan.hoabinh.vn/rust-error-handling-ease-web-dev/', + sourceLink: 'https://hongquan@bitbucket.org/hongquan/rust-error-handling-ease-web-dev.git', + cover: 'https://i.imgur.com/2eBJofY.png', + datetime: '2024-04-10', + }, // Add yours here! { title: 'Yours?', From 504216ba08dabe73db74c6a09412e6b05f153384 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?M=C3=A1t=C3=A9=20Gy=C3=B6ngy=C3=B6si?= <gyongyosimate1@gmail.com> Date: Mon, 15 Apr 2024 14:06:24 +0200 Subject: [PATCH 172/211] docs: correct image paths (#1535) Co-authored-by: Anthony Fu <anthonyfu117@hotmail.com> --- builtin/layouts.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/builtin/layouts.md b/builtin/layouts.md index b04b0cd..76a24e2 100644 --- a/builtin/layouts.md +++ b/builtin/layouts.md @@ -39,7 +39,7 @@ Shows an image on the left side of the screen, the content will be placed on the layout: image-left # the image source -image: ./path/to/the/image +image: /path/to/the/image # a custom class name to the content class: my-cool-content-on-the-right @@ -57,7 +57,7 @@ Shows an image on the right side of the screen, the content will be placed on th layout: image-right # the image source -image: ./path/to/the/image +image: /path/to/the/image # a custom class name to the content class: my-cool-content-on-the-left @@ -75,7 +75,7 @@ Shows an image as the main content of the page. layout: image # the image source -image: ./path/to/the/image +image: /path/to/the/image --- ``` @@ -84,7 +84,7 @@ You can change the default background size (`cover`) by adding the `backgroundSi ```yaml --- layout: image -image: ./path/to/the/image +image: /path/to/the/image backgroundSize: contain --- ``` @@ -92,7 +92,7 @@ backgroundSize: contain ```yaml --- layout: image-left -image: ./path/to/the/image +image: /path/to/the/image backgroundSize: 20em 70% --- ``` From 145809978af4ac77006227410f5130d68ff477aa Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Tue, 16 Apr 2024 11:17:19 +0800 Subject: [PATCH 173/211] feat: bundle monaco runnable deps (#1530) Co-authored-by: Anthony Fu <anthonyfu117@hotmail.com> --- custom/index.md | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/custom/index.md b/custom/index.md index a359b5e..3ed1d25 100644 --- a/custom/index.md +++ b/custom/index.md @@ -42,7 +42,13 @@ highlighter: shiki # show line numbers in code blocks lineNumbers: false # enable monaco editor, can be boolean, 'dev' or 'build' -monaco: dev +monaco: true +# Where to load monaco types from, can be 'cdn', 'local' or 'none' +monacoTypesSource: local +# explicitly specify extra local packages to import the types for +monacoTypesAdditionalPackages: [] +# explicitly specify extra local modules as dependency of monaco runnable +monacoRunAdditionalDeps: [] # download remote assets in local using vite-plugin-remote-assets, can be boolean, 'dev' or 'build' remoteAssets: false # controls whether texts in slides are selectable From f8dcdd31c01f1dffcdbfb7b3b6a2d8de16059add Mon Sep 17 00:00:00 2001 From: Denis <zede1697@mail.ru> Date: Tue, 16 Apr 2024 08:19:05 +0500 Subject: [PATCH 174/211] docs: add note about Magic Move with transformers (#1464) Co-authored-by: Anthony Fu <anthonyfu117@hotmail.com> --- custom/highlighters.md | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/custom/highlighters.md b/custom/highlighters.md index 5a62e8a..a9e6f66 100644 --- a/custom/highlighters.md +++ b/custom/highlighters.md @@ -28,7 +28,7 @@ highlighter: Prism <Environment type="node" /> -Create `./setup/shiki.ts` file with the following content +Create `./setup/shiki.ts` file with the following content: ```ts /* ./setup/shiki.ts */ @@ -54,6 +54,10 @@ export default defineShikiSetup(() => { Refer to [Shiki's docs](https://shiki.style) for available theme names. +:::info +For now, Shiki Magic Move does not support transformers. +::: + ## Configure Prism To configure your Prism, you can just import the theme CSS or use [`prism-theme-vars`](https://github.com/antfu/prism-theme-vars) to configure themes for both light and dark mode. Refer to its docs for more details. From 184241f638d2df59f6c9a3676bb7de93cc3bef3b Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Tue, 16 Apr 2024 11:07:31 +0200 Subject: [PATCH 175/211] chore: update deps --- package.json | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index 69c0d8c..5fc0996 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "type": "module", "private": true, - "packageManager": "pnpm@8.15.4", + "packageManager": "pnpm@8.15.7", "scripts": { "dev": "vitepress", "build": "vitepress build", @@ -13,7 +13,7 @@ "typeit": "^7.0.4" }, "devDependencies": { - "@iconify/json": "^2.2.200", + "@iconify/json": "^2.2.201", "@shikijs/vitepress-twoslash": "^1.3.0", "@slidev/client": "0.34.3", "@slidev/parser": "0.34.3", @@ -21,12 +21,12 @@ "@slidev/types": "0.34.3", "@types/fs-extra": "^11.0.4", "@types/node": "^20.12.7", - "@unocss/reset": "^0.59.2", + "@unocss/reset": "^0.59.3", "fs-extra": "^11.2.0", "markdown-it": "^14.1.0", "shiki": "^1.3.0", "typescript": "^5.4.5", - "unocss": "^0.59.2", + "unocss": "^0.59.3", "unplugin-icons": "^0.18.5", "unplugin-vue-components": "^0.26.0", "vite-plugin-inspect": "^0.8.3", From 5c6f6e20647560c555aa25ffe8fc73625c9ce23a Mon Sep 17 00:00:00 2001 From: huiliangShen <alal2al@hotmail.com> Date: Wed, 17 Apr 2024 13:34:12 +0800 Subject: [PATCH 176/211] docs: fix TypeIt error on the homepage (#1543) Co-authored-by: banruo <shl@dataqin.com> --- .vitepress/theme/components/Demo.vue | 9 +++++---- package.json | 2 +- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/.vitepress/theme/components/Demo.vue b/.vitepress/theme/components/Demo.vue index 0c3d0eb..444a74d 100644 --- a/.vitepress/theme/components/Demo.vue +++ b/.vitepress/theme/components/Demo.vue @@ -71,7 +71,8 @@ if (typeof window !== 'undefined') { } onMounted(() => { - new TypeIt(block.value, { + // @ts-expect-error wrong types provided by TypeIt + new TypeIt(block.value!, { speed: 50, startDelay: 900, afterStep: () => { @@ -81,9 +82,9 @@ onMounted(() => { }) .type('<br><span class="token title"># Welcome to Slidev!</span><br><br>', { delay: 400 }) .type('Presentation Slides for Developers', { delay: 400 }) - .move('START', { speed: 0 }) + .move(null, { to: 'START', speed: 0 }) .type('<br>') - .move('START') + .move(null, { to: 'START' }) .exec(pause) .type('<span class="token punctuation">---<br><br>---</span>') .move(-4) @@ -101,7 +102,7 @@ onMounted(() => { .type(COVER_URL, { speed: 0 }) .exec(resume) .pause(1000) - .move('END', { speed: 0 }) + .move(null, { to: 'END', speed: 0 }) .exec(pause) .type('<br><br><span class="token punctuation">---</span><br><br>', { delay: 400 }) .exec(resume) diff --git a/package.json b/package.json index 5fc0996..1330a73 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,7 @@ "dependencies": { "@antfu/utils": "^0.7.7", "@vueuse/core": "^10.9.0", - "typeit": "^7.0.4" + "typeit": "^8.1.0" }, "devDependencies": { "@iconify/json": "^2.2.201", From 4d0500784a5d993fc86363ee47045c2601b836a0 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Wed, 17 Apr 2024 21:37:55 +0200 Subject: [PATCH 177/211] docs: mark Prism.js support as deprecated (#1548) --- .vitepress/theme/components/Environment.vue | 7 ++- custom/highlighters.md | 53 +++++++++++---------- guide/index.md | 2 +- guide/syntax.md | 2 +- guide/why.md | 2 +- themes/write-a-theme.md | 19 ++------ 6 files changed, 40 insertions(+), 45 deletions(-) diff --git a/.vitepress/theme/components/Environment.vue b/.vitepress/theme/components/Environment.vue index 27fdbcd..dea8e82 100644 --- a/.vitepress/theme/components/Environment.vue +++ b/.vitepress/theme/components/Environment.vue @@ -1,5 +1,5 @@ <script setup lang="ts"> -defineProps<{ type: 'node' | 'client' }>() +defineProps<{ type: 'node' | 'client' | 'both' }>() </script> <template> @@ -10,7 +10,10 @@ defineProps<{ type: 'node' | 'client' }>() </summary> <div class="pt2 opacity-75"> - <span v-if="type === 'node'"> + <span v-if="type === 'both'"> + This setup function will run on <b>both</b> Node.js and client side. Avoid using either Node's or DOM API to avoid runtime errors. + </span> + <span v-else-if="type === 'node'"> This setup function will only run on Node.js environment, you can have access to Node's API. </span> <span v-else> diff --git a/custom/highlighters.md b/custom/highlighters.md index a9e6f66..1eda32c 100644 --- a/custom/highlighters.md +++ b/custom/highlighters.md @@ -1,49 +1,50 @@ # Highlighters -Slidev comes with two syntax highlighters for you to choose from: +Slidev uses [Shiki](https://github.com/shikijs/shiki) as the code highlighter. It's a TextMate grammar-powered syntax highlighter that generates colored tokens, so there is no additional CSS needed. Since it has great grammar support, the generated colors are very accurate, just like what you will see in VS Code. Shiki also comes with [a bunch of built-in themes](https://shiki.style/themes). In Slidev, we also provided the [TwoSlash](#twoslash-integration) support is also built-in. -- [Prism](https://prismjs.com/) -- [Shiki](https://github.com/shikijs/shiki) - -**Prism** is one of the most popular syntax highlighters. The highlighting is done by adding token classes to the code and it's colored using CSS. You can browse through their [official themes](https://github.com/PrismJS/prism-themes), or create/customize one yourself very easily using [`prism-theme-vars`](https://github.com/antfu/prism-theme-vars). - -**Shiki** is a TextMate grammar-powered syntax highlighter. It generates colored tokens, so there is no additional CSS needed. Since it has great grammar support, the generated colors are very accurate, just like what you will see in VS Code. Shiki also comes with [a bunch of built-in themes](https://shiki.style/themes). In Slidev, [TwoSlash](https://sli.dev/guide/syntax#twoslash-integration) support is also built-in. - -Slidev themes usually support both Prism and Shiki, but depending on the theme you are using, it might only support one of them. +## Configure Shiki -When you have the choice, the tradeoff is basically: +<Environment type="both" /> -- **Prism** for easier customization -- **Shiki** for accurate highlighting +Create `./setup/shiki.ts` file with the following content: -Slidev uses Shiki by default since v0.47. You can switch to it by adding the following to your `slides.md`: +```ts +/* ./setup/shiki.ts */ +import { defineShikiSetup } from '@slidev/types' -```yaml ---- -highlighter: Prism ---- +export default defineShikiSetup(() => { + return { + themes: { + dark: 'min-dark', + light: 'min-light', + }, + transformers: [ + // ... + ], + } +}) ``` -## Configure Shiki - -<Environment type="node" /> - -Create `./setup/shiki.ts` file with the following content: +If you want to add custom theme or language (TextMate grammar/themes in JSON), you can import them in the setup file: ```ts /* ./setup/shiki.ts */ import { defineShikiSetup } from '@slidev/types' +import customTheme from './customTheme.tmTheme.json' import customLanguage from './customLanguage.tmLanguage.json' export default defineShikiSetup(() => { return { themes: { - dark: 'min-dark', + dark: customTheme, light: 'min-light', }, langs: [ + 'js', + 'typescript', 'cpp', customLanguage, + // ... ], transformers: [ // ... @@ -52,7 +53,7 @@ export default defineShikiSetup(() => { }) ``` -Refer to [Shiki's docs](https://shiki.style) for available theme names. +Check [Built-in languages](https://shiki.style/languages) and [Built-in themes](https://shiki.style/themes), and refer to [Shiki's docs](https://shiki.style) for more details. :::info For now, Shiki Magic Move does not support transformers. @@ -60,4 +61,8 @@ For now, Shiki Magic Move does not support transformers. ## Configure Prism +:::warning +Prism support is deprecated and will be removed in the future. Please consider using Shiki instead. +::: + To configure your Prism, you can just import the theme CSS or use [`prism-theme-vars`](https://github.com/antfu/prism-theme-vars) to configure themes for both light and dark mode. Refer to its docs for more details. diff --git a/guide/index.md b/guide/index.md index 2a0edc0..32c836a 100644 --- a/guide/index.md +++ b/guide/index.md @@ -111,7 +111,7 @@ Slidev is made possible by combining these tools and technologies. - [Vite](https://vitejs.dev) - An extremely fast frontend tooling - [Vue 3](https://v3.vuejs.org/) powered [Markdown](https://daringfireball.net/projects/markdown/syntax) - Focus on the content while having the power of HTML and Vue components whenever needed - [UnoCSS](https://github.com/unocss/unocss) - On-demand utility-first CSS framework, style your slides at ease -- [Shiki](https://github.com/shikijs/shiki), [Prism](https://github.com/PrismJS/prism), [Monaco Editor](https://github.com/Microsoft/monaco-editor) - First-class code snippets support with live coding capability +- [Shiki](https://github.com/shikijs/shiki), [Monaco Editor](https://github.com/Microsoft/monaco-editor) - First-class code snippets support with live coding capability - [RecordRTC](https://recordrtc.org) - Built-in recording and camera view - [VueUse](https://vueuse.org) family - [`@vueuse/core`](https://github.com/vueuse/vueuse), [`@vueuse/head`](https://github.com/vueuse/head), [`@vueuse/motion`](https://github.com/vueuse/motion), etc. - [Iconify](https://iconify.design/) - Iconsets collection. diff --git a/guide/syntax.md b/guide/syntax.md index 1c92c05..e94e4d6 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -108,7 +108,7 @@ console.log('Hello, World!') ``` ```` -We support [Prism](https://prismjs.com), [Shiki](https://github.com/shikijs/shiki) as syntax highlighters. Refer to [the highlighters section](/custom/highlighters) for more details. +We have [Shiki](https://github.com/shikijs/shiki) builtin as the syntax highlighter. Refer to [the highlighters section](/custom/highlighters) for more details. ### Line Highlighting diff --git a/guide/why.md b/guide/why.md index 20a4ab6..9de9b66 100644 --- a/guide/why.md +++ b/guide/why.md @@ -26,7 +26,7 @@ Check out the [theme gallery](/themes/gallery) or [learn how to write a theme](/ ## Developer Friendly -Slidev provides first-class support for code snippets for developers. It supports both [Prism](https://prismjs.com/) and [Shiki](https://github.com/shikijs/shiki) to get pixel perfect syntax highlighting, while still being able to modify the code at any time. With [Monaco editor](https://microsoft.github.io/monaco-editor/) built-in, it also empowers you to do live coding / demonstration in your presentation with autocompletion, type hovering, and even TypeScript type check support. +Slidev provides first-class support for code snippets for developers. It supports [Shiki](https://github.com/shikijs/shiki) to get pixel-perfect syntax highlighting, while still being able to modify the code at any time. With [Monaco editor](https://microsoft.github.io/monaco-editor/) built-in, it also empowers you to do live coding / demonstration in your presentation with autocompletion, type hovering, and even TypeScript type check support. Learn more about [highlighters](/custom/highlighters) and [Monaco configuration](/custom/config-monaco). diff --git a/themes/write-a-theme.md b/themes/write-a-theme.md index 5e79af9..60af42b 100644 --- a/themes/write-a-theme.md +++ b/themes/write-a-theme.md @@ -16,8 +16,8 @@ A theme can contribute to the following points: - Provide default configurations (fonts, color schema, highlighters, etc.) - Provide custom layouts or override the existing one - Provide custom components or override the existing one -- Extend UnoCSS/Windi CSS configurations -- Configure tools like Monaco and Prism +- Extend UnoCSS configurations +- Configure tools like Shiki and Monaco ## Conventions @@ -118,20 +118,7 @@ Slidev toggles a `dark` class on the page's `html` element for switching color s ### Highlighter -Syntax highlighting colors are also provided in the theme. We support both [Prism](https://prismjs.com/), [Shiki](https://github.com/shikijs/shiki). For more information please refer to [the syntax highlighting docs](/custom/highlighters). - -You can support either one of them, or both. Refer to the default theme for configurations examples [`./styles/code.css`](https://github.com/slidevjs/slidev/blob/main/packages/create-theme/template/styles/code.css) / [`./setup/shiki.ts`](https://github.com/slidevjs/slidev/blob/main/packages/create-theme/template/setup/shiki.ts). - -Also, remember to specify the supported highlighters in your `package.json` - -```json -// package.json -{ - "slidev": { - "highlighter": "shiki" // or "prism" or "both" - } -} -``` +Syntax highlighting colors are also provided in the theme. For example [`./setup/shiki.ts`](https://github.com/slidevjs/slidev/blob/main/packages/create-theme/template/setup/shiki.ts). Refer to [the syntax highlighting docs](/custom/highlighters) for more information. ### Slidev Version From b1a9d8361d7b032446c3f7eb77f08bcd6f0543ab Mon Sep 17 00:00:00 2001 From: DY_XiaoDong <admin@xiaodong.moe> Date: Thu, 2 May 2024 17:40:48 +0800 Subject: [PATCH 178/211] feat: add `VSwitch` component (#1562) Co-authored-by: _Kerman <kermanx@qq.com> --- builtin/components.md | 10 ++++++++++ guide/animations.md | 13 ++++++++++++- 2 files changed, 22 insertions(+), 1 deletion(-) diff --git a/builtin/components.md b/builtin/components.md index 9c41d42..3d10ea2 100644 --- a/builtin/components.md +++ b/builtin/components.md @@ -259,6 +259,16 @@ Parameters: See https://sli.dev/guide/animations.html +### `VSwitch` + +Switch between multiple slots based on clicks. + +See https://sli.dev/guide/animations.html#enter-leave + +- If the `unmount` prop is set to `true`, the previous slot will be unmounted when switching to the next slot. Default is `false`. +- Use the `tag` and `childTag` props to change the default tag of the component and its children. Default is `div`. +- Use the `transition` prop to change the transition effect. Default is `false` (disabled). + ### `VDrag` See https://sli.dev/guide/draggable.html diff --git a/guide/animations.md b/guide/animations.md index cefcac9..c976e4b 100644 --- a/guide/animations.md +++ b/guide/animations.md @@ -193,13 +193,24 @@ You can also specify the enter and leave index for the `v-click` directive by pa <div v-click.hide="[2, 4]"> This will be hidden at click 2 and 3. </div> - <div v-click /> <div v-click="'[+1, +1]'"> This will be shown at click 3, and hidden since click 4. </div> ``` +You can also use `v-switch` to achieve the same effect: + +```md +<v-switch> + <template #1> show at click 1, hide at click 2. </template> + <template #2> show at click 2, hide at click 5. </template> + <template #5-7> show at click 5, hide at click 7. </template> +</v-switch> +``` + +See [`VSwitch` Component](/builtin/components#vswitch) for more details. + ### Custom Total Clicks Count By default, Slidev counts how many steps are needed before going to the next slide. You can override this setting by passing the `clicks` frontmatter option: From 81c4a28af1a5e8595a92abb8871486bb1028d72d Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Thu, 2 May 2024 11:47:58 +0200 Subject: [PATCH 179/211] chore: update deps --- package.json | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/package.json b/package.json index 1330a73..a275485 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "type": "module", "private": true, - "packageManager": "pnpm@8.15.7", + "packageManager": "pnpm@9.0.6", "scripts": { "dev": "vitepress", "build": "vitepress build", @@ -10,26 +10,26 @@ "dependencies": { "@antfu/utils": "^0.7.7", "@vueuse/core": "^10.9.0", - "typeit": "^8.1.0" + "typeit": "^8.8.3" }, "devDependencies": { - "@iconify/json": "^2.2.201", - "@shikijs/vitepress-twoslash": "^1.3.0", + "@iconify/json": "^2.2.206", + "@shikijs/vitepress-twoslash": "^1.4.0", "@slidev/client": "0.34.3", "@slidev/parser": "0.34.3", "@slidev/theme-default": "0.21.2", "@slidev/types": "0.34.3", "@types/fs-extra": "^11.0.4", - "@types/node": "^20.12.7", - "@unocss/reset": "^0.59.3", + "@types/node": "^20.12.8", + "@unocss/reset": "^0.59.4", "fs-extra": "^11.2.0", "markdown-it": "^14.1.0", - "shiki": "^1.3.0", + "shiki": "^1.4.0", "typescript": "^5.4.5", - "unocss": "^0.59.3", - "unplugin-icons": "^0.18.5", - "unplugin-vue-components": "^0.26.0", - "vite-plugin-inspect": "^0.8.3", - "vitepress": "^1.1.0" + "unocss": "^0.59.4", + "unplugin-icons": "^0.19.0", + "unplugin-vue-components": "^0.27.0", + "vite-plugin-inspect": "^0.8.4", + "vitepress": "^1.1.4" } } From 22c40b9858a8ae0c5cbc8b746a40024e01440de3 Mon Sep 17 00:00:00 2001 From: DY_XiaoDong <xiaodong@indouyin.cn> Date: Wed, 8 May 2024 20:18:39 +0800 Subject: [PATCH 180/211] docs: update /guide/syntax page (#1576) --- guide/syntax.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/guide/syntax.md b/guide/syntax.md index e94e4d6..1461a00 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -497,7 +497,7 @@ This shows on the left This shows on the right ``` -You can also explicitly specify the default slot and provide in the custom order +You can also explicitly specify the default slot and provide in the custom order. ```md --- @@ -666,7 +666,7 @@ This page is from another file ### Frontmatter Merging -You can provide frontmatters from both your main entry and external markdown pages. If there are the same keys in them, the ones from the **main entry have the higher priority**. For example +You can provide frontmatters from both your main entry and external markdown pages. If there are the same keys in them, the ones from the **main entry have the higher priority**. For example: `slides.md` : @@ -750,4 +750,4 @@ The **default** slot :: ``` -Learn more about [the syntax](https://content.nuxt.com/guide/writing/mdc). +Learn more about [MDC Syntax](https://content.nuxt.com/guide/writing/mdc). From 105d6ae4d58e6ea8b463668587b5e50248457b31 Mon Sep 17 00:00:00 2001 From: DY_XiaoDong <xiaodong@indouyin.cn> Date: Fri, 10 May 2024 18:21:35 +0800 Subject: [PATCH 181/211] docs: update /guide/exporting page (#1581) --- guide/exporting.md | 12 ++---------- 1 file changed, 2 insertions(+), 10 deletions(-) diff --git a/guide/exporting.md b/guide/exporting.md index c83e2d5..6c18c1f 100644 --- a/guide/exporting.md +++ b/guide/exporting.md @@ -53,14 +53,6 @@ By default, Slidev exports one page per slide with clicks animations disabled. I $ slidev export --with-clicks ``` -### Slide range - -You can also specify a range of slides to export with the `--range` option: - -```bash -$ slidev export --range 1,4-5,6 -``` - ### PDF outline > Available since v0.36.10 @@ -104,7 +96,7 @@ The example above would export slides 1,6,7,8, and 10. You can also export multiple slides at once: ```bash -$ slidev export slides1.md slides1.md +$ slidev export slides1.md slides2.md ``` Or @@ -113,7 +105,7 @@ Or $ slidev export *.md ``` -In this case, each input file will generate its own PDf file. +In this case, each input file will generate its own PDF file. ## Presenter notes From 1788a864edfaa16c0a2c626275a757236933c7e3 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Fri, 10 May 2024 22:42:06 +0800 Subject: [PATCH 182/211] feat: rewrite VSCode extension (#1557) Co-authored-by: Anthony Fu <anthonyfu117@hotmail.com> --- package.json | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index a275485..affbfdc 100644 --- a/package.json +++ b/package.json @@ -1,30 +1,30 @@ { "type": "module", "private": true, - "packageManager": "pnpm@9.0.6", + "packageManager": "pnpm@9.1.0", "scripts": { "dev": "vitepress", "build": "vitepress build", "postinstall": "node .vitepress/scripts/prepare.js" }, "dependencies": { - "@antfu/utils": "^0.7.7", + "@antfu/utils": "^0.7.8", "@vueuse/core": "^10.9.0", "typeit": "^8.8.3" }, "devDependencies": { - "@iconify/json": "^2.2.206", - "@shikijs/vitepress-twoslash": "^1.4.0", + "@iconify/json": "^2.2.208", + "@shikijs/vitepress-twoslash": "^1.5.1", "@slidev/client": "0.34.3", "@slidev/parser": "0.34.3", "@slidev/theme-default": "0.21.2", "@slidev/types": "0.34.3", "@types/fs-extra": "^11.0.4", - "@types/node": "^20.12.8", + "@types/node": "^20.12.11", "@unocss/reset": "^0.59.4", "fs-extra": "^11.2.0", "markdown-it": "^14.1.0", - "shiki": "^1.4.0", + "shiki": "^1.5.1", "typescript": "^5.4.5", "unocss": "^0.59.4", "unplugin-icons": "^0.19.0", From 07a66c764ef81c7ee63901667fc4e55e5f99c548 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Fri, 10 May 2024 16:43:26 +0200 Subject: [PATCH 183/211] chore: update deps --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index affbfdc..be2bca2 100644 --- a/package.json +++ b/package.json @@ -21,12 +21,12 @@ "@slidev/types": "0.34.3", "@types/fs-extra": "^11.0.4", "@types/node": "^20.12.11", - "@unocss/reset": "^0.59.4", + "@unocss/reset": "^0.60.0", "fs-extra": "^11.2.0", "markdown-it": "^14.1.0", "shiki": "^1.5.1", "typescript": "^5.4.5", - "unocss": "^0.59.4", + "unocss": "^0.60.0", "unplugin-icons": "^0.19.0", "unplugin-vue-components": "^0.27.0", "vite-plugin-inspect": "^0.8.4", From cc3c9ccddd7f7b70a67b2c6f735b28c2d18063a6 Mon Sep 17 00:00:00 2001 From: Corey Quinn <QuinnyPig@users.noreply.github.com> Date: Fri, 17 May 2024 03:16:36 -0700 Subject: [PATCH 184/211] docs: update docs to reduce confusion (#1596) --- addons/use.md | 7 +++++++ custom/global-layers.md | 2 ++ 2 files changed, 9 insertions(+) diff --git a/addons/use.md b/addons/use.md index 522ddce..3d1784b 100644 --- a/addons/use.md +++ b/addons/use.md @@ -36,3 +36,10 @@ Or in your `package.json` file: } } ``` + +## Examples + +[slidev-addon-qrcode](https://github.com/kravetsone/slidev-addon-qrcode) is an addon that allows you to embed QR codes in your slides. + + +[slidev-addon-remoji](https://github.com/twitwi/slidev-addon-remoji) is an addon that replaces emoji with icons in your slides for consistency / printing purposes. diff --git a/custom/global-layers.md b/custom/global-layers.md index d514e9a..4598533 100644 --- a/custom/global-layers.md +++ b/custom/global-layers.md @@ -14,6 +14,8 @@ Layers relationship: - NavControls - Customized Navigation Controls (`custom-nav-controls.vue`) +Note that this uses the terms "top" and "bottom" in the context of depth, not the screen position. + ## Example ```html From 6823301cfef539a143e1a8fda86414f9f85daf9d Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Fri, 17 May 2024 18:39:03 +0800 Subject: [PATCH 185/211] fix: remove `--watch` option in build command (#1598) --- guide/install.md | 1 - 1 file changed, 1 deletion(-) diff --git a/guide/install.md b/guide/install.md index ede1e43..e012e25 100644 --- a/guide/install.md +++ b/guide/install.md @@ -182,7 +182,6 @@ Build hostable SPA. Options: -- `--watch`, `-w` (`boolean`, default: `false`): build watch. - `--out`, `-o` (`string`, default: `dist`): output dir. - `--base` (`string`, default: `/`): base URL (see https://cli.vuejs.org/config/#publicpath) - `--download` (`boolean`, default: `false`): allow to download the slides as PDF inside the SPA. From d199b689abc43cf0786a1bd7f495b916a5c63103 Mon Sep 17 00:00:00 2001 From: Anthony Fu <anthonyfu117@hotmail.com> Date: Fri, 17 May 2024 13:12:55 +0200 Subject: [PATCH 186/211] chore: update deps, lint --- addons/use.md | 5 ++--- package.json | 14 +++++++------- vite.config.ts | 2 +- 3 files changed, 10 insertions(+), 11 deletions(-) diff --git a/addons/use.md b/addons/use.md index 3d1784b..c018dad 100644 --- a/addons/use.md +++ b/addons/use.md @@ -39,7 +39,6 @@ Or in your `package.json` file: ## Examples -[slidev-addon-qrcode](https://github.com/kravetsone/slidev-addon-qrcode) is an addon that allows you to embed QR codes in your slides. +- [slidev-addon-qrcode](https://github.com/kravetsone/slidev-addon-qrcode) is an addon that allows you to embed QR codes in your slides. - -[slidev-addon-remoji](https://github.com/twitwi/slidev-addon-remoji) is an addon that replaces emoji with icons in your slides for consistency / printing purposes. +- [slidev-addon-remoji](https://github.com/twitwi/slidev-addon-remoji) is an addon that replaces emoji with icons in your slides for consistency / printing purposes. diff --git a/package.json b/package.json index be2bca2..5acc7b9 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "type": "module", "private": true, - "packageManager": "pnpm@9.1.0", + "packageManager": "pnpm@9.1.1", "scripts": { "dev": "vitepress", "build": "vitepress build", @@ -13,20 +13,20 @@ "typeit": "^8.8.3" }, "devDependencies": { - "@iconify/json": "^2.2.208", - "@shikijs/vitepress-twoslash": "^1.5.1", + "@iconify/json": "^2.2.211", + "@shikijs/vitepress-twoslash": "^1.5.2", "@slidev/client": "0.34.3", "@slidev/parser": "0.34.3", "@slidev/theme-default": "0.21.2", "@slidev/types": "0.34.3", "@types/fs-extra": "^11.0.4", - "@types/node": "^20.12.11", - "@unocss/reset": "^0.60.0", + "@types/node": "^20.12.12", + "@unocss/reset": "^0.60.2", "fs-extra": "^11.2.0", "markdown-it": "^14.1.0", - "shiki": "^1.5.1", + "shiki": "^1.5.2", "typescript": "^5.4.5", - "unocss": "^0.60.0", + "unocss": "^0.60.2", "unplugin-icons": "^0.19.0", "unplugin-vue-components": "^0.27.0", "vite-plugin-inspect": "^0.8.4", diff --git a/vite.config.ts b/vite.config.ts index eba4341..084d492 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -51,7 +51,7 @@ export default defineConfig({ transform(code, id) { if (!id.endsWith('.md')) return - return code.replace(/\/\/```/mg, '```') + return code.replace(/\/\/```/g, '```') }, }, { From cc071f3e19a085f5df9b700366ee51106728bd71 Mon Sep 17 00:00:00 2001 From: John Farrar <sosensible@users.noreply.github.com> Date: Sat, 18 May 2024 07:16:17 -0400 Subject: [PATCH 187/211] docs: fix typo (#1600) --- guide/hosting.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/guide/hosting.md b/guide/hosting.md index 3205424..97845ca 100644 --- a/guide/hosting.md +++ b/guide/hosting.md @@ -76,7 +76,7 @@ $ slidev build --watch You can also build multiple slides at once. ```bash -$ slidev build slides1.md slides1.md +$ slidev build slides1.md slides2.md ``` Or From 1eb7ce9e93f2fa166670271582f917a6894ae0d5 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Mon, 20 May 2024 17:41:02 +0800 Subject: [PATCH 188/211] docs: use public folder in examples (#1601) --- builtin/components.md | 6 +++--- guide/syntax.md | 4 ++-- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/builtin/components.md b/builtin/components.md index 3d10ea2..ad8992d 100644 --- a/builtin/components.md +++ b/builtin/components.md @@ -282,11 +282,11 @@ Embed a video. ```md <SlidevVideo v-click autoplay controls> <!-- Anything that can go in a HTML video element. --> - <source src="myMovie.mp4" type="video/mp4" /> - <source src="myMovie.webm" type="video/webm" /> + <source src="/myMovie.mp4" type="video/mp4" /> + <source src="/myMovie.webm" type="video/webm" /> <p> Your browser does not support videos. You may download it - <a href="myMovie.mp4">here</a>. + <a href="/myMovie.mp4">here</a>. </p> </SlidevVideo> ``` diff --git a/guide/syntax.md b/guide/syntax.md index 1461a00..3a18803 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -51,7 +51,7 @@ This is the cover page. --- layout: center -background: './images/background-1.png' +background: /background-1.png class: 'text-white' --- @@ -89,7 +89,7 @@ This is the cover page. ```yaml # The first yaml block will be treated as the frontmatter of that slide layout: center -background: './images/background-1.png' +background: /background-1.png class: 'text-white' ``` From 84e2a1451eb9c48a6682fd612ed8354f19dcb224 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Sat, 25 May 2024 18:47:16 +0800 Subject: [PATCH 189/211] feat: export to PPTX (#1603) --- custom/index.md | 2 +- guide/exporting.md | 12 ++++++++++++ guide/install.md | 4 ++-- guide/why.md | 2 +- 4 files changed, 16 insertions(+), 4 deletions(-) diff --git a/custom/index.md b/custom/index.md index 3ed1d25..79cff09 100644 --- a/custom/index.md +++ b/custom/index.md @@ -17,7 +17,7 @@ title: Slidev titleTemplate: '%s - Slidev' # information for your slides, can be a markdown string. info: false -# author field for exported PDF +# author field for exported PDF or PPTX author: Your Name Here # keywords field for exported PDF, comma-delimited. keywords: keyword1,keyword2 diff --git a/guide/exporting.md b/guide/exporting.md index 6c18c1f..4906c40 100644 --- a/guide/exporting.md +++ b/guide/exporting.md @@ -35,6 +35,18 @@ You can also compile a markdown file composed of compiled png using `--format md $ slidev export --format md ``` +### PPTX (Microsoft PowerPoint) + +Slidev can also export your slides to a PPTX file: + +```bash +$ slidev export --format pptx +``` + +Note that all the slides in the PPTX file will be exported as images, so the text will not be selectable. + +In this mode, the `--with-clicks` option is enabled by default. To disable it, use `--with-clicks false`. + ### Dark mode In case you want to export your slides using the dark version of the theme, use the `--dark` option: diff --git a/guide/install.md b/guide/install.md index e012e25..9d09ad3 100644 --- a/guide/install.md +++ b/guide/install.md @@ -189,14 +189,14 @@ Options: ### `slidev export [entry]` -Export slides to PDF (or other format). +Export slides to PDF (or other format). See [Exporting](/guide/exporting.html) for more details. - `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. Options: - `--output` (`string`, default: use `exportFilename` (see https://sli.dev/custom/#frontmatter-configures) or use `[entry]-export`): path to the output. -- `--format` (`'pdf', 'png', 'md'`, default: `'pdf'`): output format. +- `--format` (`'pdf', 'png', 'pptx', 'md'`, default: `'pdf'`): output format. - `--timeout` (`number`, default: `30000`): timeout for rendering the print page (see https://playwright.dev/docs/api/class-page#page-goto). - `--range` (`string`): page ranges to export (example: `'1,4-5,6'`). - `--dark` (`boolean`, default: `false`): export as dark theme. diff --git a/guide/why.md b/guide/why.md index 9de9b66..46a82db 100644 --- a/guide/why.md +++ b/guide/why.md @@ -48,7 +48,7 @@ Learn more about [recording here](/guide/recording). ## Portable -Export your slides into PDF, PNGs, or even a hostable Single-page Application (SPA) with a single command, and share them anywhere. +Export your slides into PDF, PPTX, PNGs, or even a hostable Single-page Application (SPA) with a single command, and share them anywhere. Read more about that in the [exporting docs](/guide/exporting). From d56a0edec85907ef1a9e21f8a99743b0fbf3f6c9 Mon Sep 17 00:00:00 2001 From: Anthony Fu <github@antfu.me> Date: Sat, 25 May 2024 12:51:08 +0200 Subject: [PATCH 190/211] chore: update deps --- package.json | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/package.json b/package.json index 5acc7b9..cfe7ecb 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "type": "module", "private": true, - "packageManager": "pnpm@9.1.1", + "packageManager": "pnpm@9.1.2", "scripts": { "dev": "vitepress", "build": "vitepress build", @@ -13,23 +13,23 @@ "typeit": "^8.8.3" }, "devDependencies": { - "@iconify/json": "^2.2.211", - "@shikijs/vitepress-twoslash": "^1.5.2", + "@iconify/json": "^2.2.213", + "@shikijs/vitepress-twoslash": "^1.6.0", "@slidev/client": "0.34.3", "@slidev/parser": "0.34.3", "@slidev/theme-default": "0.21.2", "@slidev/types": "0.34.3", "@types/fs-extra": "^11.0.4", "@types/node": "^20.12.12", - "@unocss/reset": "^0.60.2", + "@unocss/reset": "^0.60.3", "fs-extra": "^11.2.0", "markdown-it": "^14.1.0", - "shiki": "^1.5.2", + "shiki": "^1.6.0", "typescript": "^5.4.5", - "unocss": "^0.60.2", + "unocss": "^0.60.3", "unplugin-icons": "^0.19.0", "unplugin-vue-components": "^0.27.0", "vite-plugin-inspect": "^0.8.4", - "vitepress": "^1.1.4" + "vitepress": "^1.2.2" } } From a41fecb0881b94fcf9991fa55b414480e2614cc6 Mon Sep 17 00:00:00 2001 From: Damien Fernandes <damienfern@users.noreply.github.com> Date: Mon, 27 May 2024 10:34:03 +0200 Subject: [PATCH 191/211] docs(hosting): use GitHub action variable to set base url (#1617) --- guide/hosting.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/guide/hosting.md b/guide/hosting.md index 97845ca..ec0fbec 100644 --- a/guide/hosting.md +++ b/guide/hosting.md @@ -145,7 +145,7 @@ Then go to your Vercel dashboard and create a new site with the repository. To deploy your slides on GitHub Pages: - upload all the files of the project in your repo (i.e. named `name_of_repo`) -- create `.github/workflows/deploy.yml` with following content to deploy your slides to GitHub Pages via GitHub Actions. In this file, replace `<name_of_repo>` with `name_of_repo`. Make sure to leave the leading and trailing slashes in place. +- create `.github/workflows/deploy.yml` with the following content to deploy your slides to GitHub Pages via GitHub Actions. ```yaml name: Deploy pages @@ -180,7 +180,7 @@ jobs: run: npm install - name: Build - run: npm run build -- --base /<name_of_repo>/ + run: npm run build -- --base /${{github.event.repository.name}}/ - uses: actions/configure-pages@v4 From 9a8771606834de2761a9d8ff1fe87240e91dd626 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Tue, 28 May 2024 17:40:46 +0800 Subject: [PATCH 192/211] feat: line numbers support in magic-move (#1619) --- guide/syntax.md | 30 +++++++++++++++++------------- 1 file changed, 17 insertions(+), 13 deletions(-) diff --git a/guide/syntax.md b/guide/syntax.md index 3a18803..9358beb 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -125,10 +125,10 @@ function add( ``` ```` -You can enable line number to all slides by setting `lineNumbers: true` on the config or enable each code block individually by setting `lines: true`. You can also set the starting line for each code block and highlight the lines accordingly, defaults to 1: +To change the highlight in multiple clicks, you can use `|` to separate them: ````md -```ts {6,7}{lines:true,startLine:5} +```ts {2-3|5|all} function add( a: Ref<number> | number, b: Ref<number> | number @@ -138,10 +138,12 @@ function add( ``` ```` -To change the highlight in multiple clicks, you can use `|` to separate them: +This will first highlight `a: Ref<number> | number` and `b: Ref<number> | number`, and then `return computed(() => unref(a) + unref(b))` after one click, and lastly, the whole block. + +You can set the line number to `hide` to hide the code block or `none` to not highlight any line: ````md -```ts {2-3|5|all} +```ts {hide|none} function add( a: Ref<number> | number, b: Ref<number> | number @@ -151,12 +153,16 @@ function add( ``` ```` -This will first highlight `a: Ref<number> | number` and `b: Ref<number> | number`, and then `return computed(() => unref(a) + unref(b))` after one click, and lastly, the whole block. +::: tip +Learn more in the [clicks animations guide](./animations#positioning). +::: -You can set the line number to `hide` to hide the code block or `none` to not highlight any line: +### Line Numbers + +You can enable line number to all slides by setting `lineNumbers: true` on the config or enable each code block individually by setting `lines: true`. You can also set the starting line for each code block and highlight the lines accordingly, defaults to 1: ````md -```ts {hide|none} +```ts {6,7}{lines:true,startLine:5} function add( a: Ref<number> | number, b: Ref<number> | number @@ -166,9 +172,7 @@ function add( ``` ```` -::: tip -Learn more in the [clicks animations guide](./animations#positioning). -::: +### Max Height If the code doesn't fit into one slide, you use the `maxHeight` to set fixed height and enable scrolling: @@ -238,10 +242,10 @@ console.log(`Step ${3}` as string) ```` ````` -It's also possible mix Magic Move with [line highlighting](#line-highlighting), for example: +It's also possible to mix Magic Move with [line highlighting](#line-highlighting) and [line numbers](#line-numbers), for example: `````md -````md magic-move {at:4} // [!code hl] +````md magic-move {at:4, lines: true} // [!code hl] ```js {*|1|2-5} // [!code hl] let count = 1 function add() { @@ -251,7 +255,7 @@ function add() { Non-code blocks in between as ignored, you can put some comments. -```js +```js {*}{lines: false} // [!code hl] let count = 1 const add = () => count += 1 ``` From ff57e5e124becc83905326eddb4477c671e8720e Mon Sep 17 00:00:00 2001 From: Filip Hric <filip@filiphric.sk> Date: Tue, 28 May 2024 11:41:06 +0200 Subject: [PATCH 193/211] docs: add excali-slide theme (#1616) Co-authored-by: _Kerman <kermanx@qq.com> --- .vitepress/themes.ts | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/.vitepress/themes.ts b/.vitepress/themes.ts index 5fa751e..e1d2c42 100644 --- a/.vitepress/themes.ts +++ b/.vitepress/themes.ts @@ -445,6 +445,24 @@ export const community: ThemeInfo[] = [ 'light', ], }, + { + id: 'slidev-theme-excali-slide', + name: 'Excali-slide', + description: 'A theme based on Excalidraw with animated highlighter effect', + author: { + name: 'Filip Hric', + link: 'https://github.com/filiphric', + }, + repo: 'https://github.com/filiphric/slidev-theme-excali-slide', + previews: [ + 'https://raw.githubusercontent.com/filiphric/excali-slide/main/images/default_slide.png', + 'https://raw.githubusercontent.com/filiphric/excali-slide/main/images/intro_slide.png', + ], + tags: [ + 'dark', + 'light', + ], + }, // Add yours here! { id: '', From 1586d5bffdb3a8c25764eac152c53b922837f9df Mon Sep 17 00:00:00 2001 From: Anthony Fu <github@antfu.me> Date: Wed, 29 May 2024 11:58:36 +0200 Subject: [PATCH 194/211] chore: update deps --- package.json | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index cfe7ecb..799d945 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "type": "module", "private": true, - "packageManager": "pnpm@9.1.2", + "packageManager": "pnpm@9.1.3", "scripts": { "dev": "vitepress", "build": "vitepress build", @@ -9,12 +9,12 @@ }, "dependencies": { "@antfu/utils": "^0.7.8", - "@vueuse/core": "^10.9.0", + "@vueuse/core": "^10.10.0", "typeit": "^8.8.3" }, "devDependencies": { - "@iconify/json": "^2.2.213", - "@shikijs/vitepress-twoslash": "^1.6.0", + "@iconify/json": "^2.2.214", + "@shikijs/vitepress-twoslash": "^1.6.1", "@slidev/client": "0.34.3", "@slidev/parser": "0.34.3", "@slidev/theme-default": "0.21.2", @@ -24,7 +24,7 @@ "@unocss/reset": "^0.60.3", "fs-extra": "^11.2.0", "markdown-it": "^14.1.0", - "shiki": "^1.6.0", + "shiki": "^1.6.1", "typescript": "^5.4.5", "unocss": "^0.60.3", "unplugin-icons": "^0.19.0", From 093750ee019b28b9ea996a61695094b2c5706050 Mon Sep 17 00:00:00 2001 From: Anthony Fu <github@antfu.me> Date: Wed, 29 May 2024 13:30:51 +0200 Subject: [PATCH 195/211] feat(monaco): introduce `monaco-write` --- components.d.ts | 2 +- guide/syntax.md | 12 ++++++++++++ 2 files changed, 13 insertions(+), 1 deletion(-) diff --git a/components.d.ts b/components.d.ts index b0f0cf0..6302e2b 100644 --- a/components.d.ts +++ b/components.d.ts @@ -1,10 +1,10 @@ /* eslint-disable */ -/* prettier-ignore */ // @ts-nocheck // Generated by unplugin-vue-components // Read more: https://github.com/vuejs/core/pull/3399 export {} +/* prettier-ignore */ declare module 'vue' { export interface GlobalComponents { Arrow: typeof import('./.vitepress/@slidev/client/builtin/Arrow.vue')['default'] diff --git a/guide/syntax.md b/guide/syntax.md index 9358beb..084cc6f 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -316,6 +316,18 @@ console.log('Shown after 1 click') Currently Slidev supports running JavaScript and TypeScript code out-of-box. Refer to [Custom Code Runners](/custom/config-code-runners) for custom languages support. +#### Writable Monaco Editor + +> Available since v0.49.5 + +You can also use the [Import Code Snippets](#import-code-snippets) syntax combining with the `{monaco-write}` directive, to link your Monaco Editor with a file on your filesystem. This will allow you to edit the code directly in the editor and save the changes back to the file. + +```md +<<< ./some-file.ts {monaco-write} +``` + +When using this, make sure to back up of your files beforehand, as the changes will be saved directly to the file. + ## Embedded Styles You can use `<style>` tag in your Markdown directly to override styles for the **current slide**. From 399eda208eec13117f21bb8097149674a38793c4 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Wed, 29 May 2024 19:31:57 +0800 Subject: [PATCH 196/211] feat: two-way arrow and `v-drag-arrow` (#1622) --- builtin/components.md | 11 +++++++++++ docs/guide/draggable.md | 10 ++++++++++ 2 files changed, 21 insertions(+) diff --git a/builtin/components.md b/builtin/components.md index ad8992d..444f6f8 100644 --- a/builtin/components.md +++ b/builtin/components.md @@ -30,6 +30,17 @@ Parameters: - `y2` (`string | number`, required): end point x position - `width` (`string | number`, default: `2`): line width - `color` (`string`, default: `'currentColor'`): line color +- `two-way` (`boolean`, default: `false`): draw a two-way arrow + +### `VDragArrow` + +An `Arrow` component that can be dragged. + +#### Usage + +See https://sli.dev/guide/draggable.html#draggable-arrow + +Parameters not related to position are the same as [the `Arrow` component](#arrow). ### `AutoFitText` diff --git a/docs/guide/draggable.md b/docs/guide/draggable.md index 02a2164..8d06d3c 100644 --- a/docs/guide/draggable.md +++ b/docs/guide/draggable.md @@ -64,3 +64,13 @@ When you first create a draggable element, you don't need to specify the positio - You can also use the arrow keys to move the element. - Hold `Shift` while dragging to preserve its aspect ratio. - Click outside the draggable element to stop dragging it. + +## Draggable Arrow + +The `<v-drag-arrow>` component creates a draggable arrow element. Simply use it like this: + +```md +<v-drag-arrow /> +``` + +And you will get a draggable arrow element. Other props are the same as [the `Arrow` component](/builtin/components#arrow). From 9ce83fd209262d446eb083d3599a9a92fc5b9aa1 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Fri, 31 May 2024 20:40:14 +0800 Subject: [PATCH 197/211] feat: slide layers (#1634) Co-authored-by: Anthony Fu <github@antfu.me> --- custom/global-layers.md | 36 +++++++++++++++++++++--------------- 1 file changed, 21 insertions(+), 15 deletions(-) diff --git a/custom/global-layers.md b/custom/global-layers.md index 4598533..e21ef40 100644 --- a/custom/global-layers.md +++ b/custom/global-layers.md @@ -1,20 +1,26 @@ # Global Layers -> Available since v0.17 - -Global layers allow you to have custom components that **persistent** across slides. This could be useful for having footers, cross-slides animations, global effects, etc. +Global layers allow you to have custom components that **persist** across slides. This could be useful for having footers, cross-slide animations, global effects, etc. Slidev provides three layers for this usage, create `global-top.vue`, `global-bottom.vue` or `custom-nav-controls.vue` under your project root and it will pick up automatically. -Layers relationship: +There are also layers for **each** slide: `layouts/slide-top.vue` and `layouts/slide-bottom.vue`. The usage is similar to the global layers, but they are applied to every slide, so there may be more than one instance of them. + +::: tip +When exporting, the `--per-slide` option should be used to ensure the global layers are applied to each slide correctly. +::: + +## Layers relationship + +At z-axis, from top to bottom: -- Global Top (`global-top.vue`) -- Slides -- Global Bottom (`global-bottom.vue`) - NavControls - Customized Navigation Controls (`custom-nav-controls.vue`) - -Note that this uses the terms "top" and "bottom" in the context of depth, not the screen position. +- Global Top (`global-top.vue`) - single instance +- Slide Top (`slide-top.vue`) - instance per slide +- Slide Content +- Slide Bottom (`slide-bottom.vue`) - instance per slide +- Global Bottom (`global-bottom.vue`) - single instance ## Example @@ -30,7 +36,7 @@ The text `Your Name` will appear to all your slides. ```html <!-- custom-nav-controls --> <template> - <button class="icon-btn" title="Next" @click="$slidev.nav.next"> + <button class="icon-btn" title="Next" @click="$nav.next"> <carbon:arrow-right /> </button> </template> @@ -44,7 +50,7 @@ To enable it conditionally, you can apply it with the [Vue Global Context](/cust <!-- hide the footer from Page 4 --> <template> <footer - v-if="$slidev.nav.currentPage !== 4" + v-if="$nav.currentPage !== 4" class="absolute bottom-0 left-0 right-0 p-2" > Your Name @@ -56,7 +62,7 @@ To enable it conditionally, you can apply it with the [Vue Global Context](/cust <!-- hide the footer from "cover" layout --> <template> <footer - v-if="$slidev.nav.currentLayout !== 'cover'" + v-if="$nav.currentLayout !== 'cover'" class="absolute bottom-0 left-0 right-0 p-2" > Your Name @@ -68,10 +74,10 @@ To enable it conditionally, you can apply it with the [Vue Global Context](/cust <!-- an example footer for pages --> <template> <footer - v-if="$slidev.nav.currentLayout !== 'cover'" + v-if="$nav.currentLayout !== 'cover'" class="absolute bottom-0 left-0 right-0 p-2" > - {{ $slidev.nav.currentPage }} / {{ $slidev.nav.total }} + {{ $nav.currentPage }} / {{ $nav.total }} </footer> </template> ``` @@ -80,7 +86,7 @@ To enable it conditionally, you can apply it with the [Vue Global Context](/cust <!-- custom-nav-controls --> <!-- hide the button in Presenter model --> <template> - <button v-if="!$slidev.nav.isPresenter" class="icon-btn" title="Next" @click="$slidev.nav.next"> + <button v-if="!$nav.isPresenter" class="icon-btn" title="Next" @click="$nav.next"> <carbon:arrow-right /> </button> </template> From 16cc6029d24d5bf506732143b1f27603818f0c40 Mon Sep 17 00:00:00 2001 From: Anthony Fu <github@antfu.me> Date: Sat, 1 Jun 2024 20:05:53 +0200 Subject: [PATCH 198/211] chore: update deps --- package.json | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index 799d945..9c730e5 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "type": "module", "private": true, - "packageManager": "pnpm@9.1.3", + "packageManager": "pnpm@9.1.4", "scripts": { "dev": "vitepress", "build": "vitepress build", @@ -13,20 +13,20 @@ "typeit": "^8.8.3" }, "devDependencies": { - "@iconify/json": "^2.2.214", + "@iconify/json": "^2.2.215", "@shikijs/vitepress-twoslash": "^1.6.1", "@slidev/client": "0.34.3", "@slidev/parser": "0.34.3", "@slidev/theme-default": "0.21.2", "@slidev/types": "0.34.3", "@types/fs-extra": "^11.0.4", - "@types/node": "^20.12.12", - "@unocss/reset": "^0.60.3", + "@types/node": "^20.13.0", + "@unocss/reset": "^0.60.4", "fs-extra": "^11.2.0", "markdown-it": "^14.1.0", "shiki": "^1.6.1", "typescript": "^5.4.5", - "unocss": "^0.60.3", + "unocss": "^0.60.4", "unplugin-icons": "^0.19.0", "unplugin-vue-components": "^0.27.0", "vite-plugin-inspect": "^0.8.4", From c3bff6a44250ce52f8bc1ea2124a4a44be284708 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Tue, 11 Jun 2024 20:47:12 +0800 Subject: [PATCH 199/211] docs: update docs for VSCode extension (#1657) --- components.d.ts | 5 +++++ guide/editors.md | 31 +++++++++++++++++++++++++++---- 2 files changed, 32 insertions(+), 4 deletions(-) diff --git a/components.d.ts b/components.d.ts index 6302e2b..fc3f307 100644 --- a/components.d.ts +++ b/components.d.ts @@ -32,6 +32,11 @@ declare module 'vue' { CarbonUserSpeaker: typeof import('~icons/carbon/user-speaker')['default'] CarbonVideo: typeof import('~icons/carbon/video')['default'] CodeBlockWrapper: typeof import('./.vitepress/@slidev/client/builtin/CodeBlockWrapper.vue')['default'] + CodiconAdd: typeof import('~icons/codicon/add')['default'] + CodiconEye: typeof import('~icons/codicon/eye')['default'] + CodiconGlobe: typeof import('~icons/codicon/globe')['default'] + CodiconLock: typeof import('~icons/codicon/lock')['default'] + CodiconRunAll: typeof import('~icons/codicon/run-all')['default'] Demo: typeof import('./.vitepress/theme/components/Demo.vue')['default'] DemoEditor: typeof import('./.vitepress/theme/components/DemoEditor.vue')['default'] DemoSlide: typeof import('./.vitepress/theme/components/DemoSlide.vue')['default'] diff --git a/guide/editors.md b/guide/editors.md index 6215472..724f490 100644 --- a/guide/editors.md +++ b/guide/editors.md @@ -32,16 +32,39 @@ The VS Code extension provides some features to help you better organize your sl ### Features -- View slides in the side panel -- Go to next / prev buttons +- Preview slides in the side panel +- Slides tree view - Re-ordering slides - Folding for slide blocks -- Convert Markdown to HTML +- Multiple slides project support +- Start dev server in one click -![](https://user-images.githubusercontent.com/11247099/116809994-cc2caa00-ab73-11eb-879f-60585747c3c9.png) +![](https://github.com/slidevjs/slidev/assets/63178754/2c9ba01a-d21f-4b33-b6b6-4e249873f865) + +::: code-group <TheTweet id="1395333405345148930" /> +<TheTweet id="1789684139152810151" /> + +::: + +### Installation + +You can install the extension from the [VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=antfu.slidev). + +### Usage + +Click the `Slidev` icon in the activity bar to open the **Slidev panel**. In the Slidev panel, you can see the projects tree view, slides tree view, and the preview webview. + +In the **projects tree view**, you can see all the Slidev projects in your workspace. You can dlick the item to open the corresponding file, and click the <codicon-eye /> icon over it to switch the active project. The <codicon-add /> icon allows you to load a slides project that wasn't scanned automatically. + +In the **slides tree view**, you can see all the slides in the active project. You can click the item to move you cursor to the slide in the editor, and drag and drop to reorder the slides. + +In the **preview webview**, you can click the <codicon-run-all /> icon to start the dev server and click the <codicon-globe /> icon to open the slides in the browser. Toggle <codicon-lock /> icon to sync/unsync the preview navigation with the editor cursor. + +There are also some **commands** you can use. Type `Slidev` in the command palette to see them. + ## Prettier Plugin Slidev also provides a Prettier plugin to format your slides. You can use it with your favorite editor that supports Prettier. Docs for the plugin can be found [here](https://github.com/slidevjs/prettier-plugin). From dd6aa9aa056e314c85bcbd75b388462f51b1fb95 Mon Sep 17 00:00:00 2001 From: Corey Quinn <QuinnyPig@users.noreply.github.com> Date: Tue, 11 Jun 2024 14:25:52 -0600 Subject: [PATCH 200/211] docs: grammatical updates (#1661) --- docs/guide/overview.md | 10 +++++++++ guide/drawing.md | 8 +++---- guide/editors.md | 4 ++-- guide/exporting.md | 12 +++++------ guide/faq.md | 2 +- guide/hosting.md | 8 +++---- guide/install.md | 36 ++++++++++++++++---------------- guide/presenter-mode.md | 10 ++++----- guide/recording.md | 4 ++-- guide/syntax.md | 46 +++++++++++++++++++++-------------------- 10 files changed, 76 insertions(+), 64 deletions(-) create mode 100644 docs/guide/overview.md diff --git a/docs/guide/overview.md b/docs/guide/overview.md new file mode 100644 index 0000000..1b4c3fb --- /dev/null +++ b/docs/guide/overview.md @@ -0,0 +1,10 @@ +# Slide Overview + +> Available since v0.48.0 + +<video src="https://github.com/slidevjs/slidev/assets/11247099/01bbf5b3-f916-4646-9ea4-cf269c0567cb" +controls rounded shadow></video> + +You can visit an overview of all of your slides by clicking the <carbon-apps class="inline-icon-btn"/> button in the navigation panel and then <carbon-list-boxes class="inline-icon-btn"/> on the top right, or by visiting `http://localhost:3030/overview` directly. + +The overview page gives you a linear list of all your slides, with all of your notes on the side. You can double click on the notes to edit the notes directly, or drag the clicks sliders to preview the steps in your slides. diff --git a/guide/drawing.md b/guide/drawing.md index 24f7a60..58c7633 100644 --- a/guide/drawing.md +++ b/guide/drawing.md @@ -2,15 +2,15 @@ > Available since v0.23 -We have [drauu](https://github.com/antfu/drauu) built-in for drawing and annotation that could enhance your presentation further. +[drauu](https://github.com/antfu/drauu) is built-in for drawing and annotation, should that help improve your presentation further. -To start, click the <carbon-pen class="inline-icon-btn"/> icon in the toolbar and start drawing. It's also available in the [Presenter Mode](/guide/presenter-mode). Drawings and annotations you created will be **synced up** automatically across all instances in real-time. +To start, click the <carbon-pen class="inline-icon-btn"/> icon in the toolbar and start drawing. It's also available in the [Presenter Mode](/guide/presenter-mode). Drawings and annotations you created will be **synced** automatically across all instances in real time. <TheTweet id="1424027510342250499" /> ## Use with Stylus Pen -When using a stylus pen on a tablet (for example, iPad with Apple Pencil), Slidev could smartly detect the input type. You can directly draw on your slides with the pen without turning on the drawing mode, while having your fingers or mouse control the navigation. +When using a stylus pen on a tablet (for example, iPad with Apple Pencil), Slidev will intelligently detect the input type. You can directly draw on your slides with the pen without turning on the drawing mode, while having your fingers or mouse control the navigation. ## Persist Drawings @@ -54,7 +54,7 @@ drawings: ## Drawing Syncing -By default, Slidev syncs up your drawings across all instances. If you are sharing your slides with others, you might want to disable the syncing by: +By default, Slidev syncs up your drawings across all instances. If you are sharing your slides with others, you might want to disable the syncing via: ```md --- diff --git a/guide/editors.md b/guide/editors.md index 724f490..80281e2 100644 --- a/guide/editors.md +++ b/guide/editors.md @@ -1,6 +1,6 @@ # Editor Support -Since Slidev is using Markdown as the source entry, you can use ANY editors you love to write it. +Since Slidev is using Markdown as the source entry, you can use any editor you'd lik' to write your slides. If you want some high-level management to your slides, we have provided the following editor integrations for you! @@ -37,7 +37,7 @@ The VS Code extension provides some features to help you better organize your sl - Re-ordering slides - Folding for slide blocks - Multiple slides project support -- Start dev server in one click +- Start the dev server with one click ![](https://github.com/slidevjs/slidev/assets/63178754/2c9ba01a-d21f-4b33-b6b6-4e249873f865) diff --git a/guide/exporting.md b/guide/exporting.md index 4906c40..377e81c 100644 --- a/guide/exporting.md +++ b/guide/exporting.md @@ -4,8 +4,8 @@ ### PDF -> Exporting to PDF or PNG relies on [Playwright](https://playwright.dev) for rendering. You will therefore need to install [`playwright-chromium`](https://npmjs.com/package/playwright-chromium) to use this feature. -> If you are doing exporting in a CI environment, [the playwright CI guide](https://playwright.dev/docs/ci) can be helpful. +> Exporting to PDF, PPTX, or PNG relies on [Playwright](https://playwright.dev) for rendering. You will therefore need to install [`playwright-chromium`](https://npmjs.com/package/playwright-chromium) to use this feature. +> If you are exporting within a CI environment, [the playwright CI guide](https://playwright.dev/docs/ci) can be helpful. 1. Install `playwright-chromium`: @@ -37,13 +37,13 @@ $ slidev export --format md ### PPTX (Microsoft PowerPoint) -Slidev can also export your slides to a PPTX file: +Slidev can also export your slides as a PPTX file: ```bash $ slidev export --format pptx ``` -Note that all the slides in the PPTX file will be exported as images, so the text will not be selectable. +Note that all the slides in the PPTX file will be exported as images, so the text will not be selectable. Presenter notes will be conveyed into the PPTX file on a per-slide basis. In this mode, the `--with-clicks` option is enabled by default. To disable it, use `--with-clicks false`. @@ -147,7 +147,7 @@ docker run --name slidev --rm -it \ tangramor/slidev:playwright ``` -Then you can use the export feature like following under your work folder: +Then you can use the export feature like the following under your work folder: ```bash docker exec -i slidev npx slidev export --timeout 2m --output slides.pdf @@ -155,7 +155,7 @@ docker exec -i slidev npx slidev export --timeout 2m --output slides.pdf ## Troubleshooting -### Timeout +### Timeouts <<<<<<< HEAD:guide/exporting.md For big presentation you might want to increase the playwrigth timeout with `--timeout` diff --git a/guide/faq.md b/guide/faq.md index 2607124..70ef052 100644 --- a/guide/faq.md +++ b/guide/faq.md @@ -4,7 +4,7 @@ Since Slidev is based on the Web, you can apply any grid layouts as you want. [CSS Grids](https://css-tricks.com/snippets/css/complete-guide-grid/), [flexboxes](https://css-tricks.com/snippets/css/a-guide-to-flexbox/), or even [Masonry](https://css-tricks.com/native-css-masonry-layout-in-css-grid/), you get the full controls. -Since we have [UnoCSS](https://unocss.dev/) built-in, here is one simple way for you to reference: +Since [UnoCSS](https://unocss.dev/) is built-in, here's one way that you can reference: ```html <div class="grid grid-cols-2 gap-4"> diff --git a/guide/hosting.md b/guide/hosting.md index ec0fbec..5d711eb 100644 --- a/guide/hosting.md +++ b/guide/hosting.md @@ -2,7 +2,7 @@ ## Build Single Page Applications (SPA) -You can also build the slides into a self-hostable SPA: +You can build the slides into a self-hostable SPA: ```bash $ slidev build @@ -12,7 +12,7 @@ The generated application will be available under `dist/`. You can test the generated build using a web server (Apache, NGINX, Caddy...etc.) or in the project you can directly run: `npx vite preview`. -Then you can host it on [GitHub Pages](https://pages.github.com/), [Netlify](https://netlify.app/), [Vercel](https://vercel.com/), or whatever you want. Now you can share your slides with the rest of the world with a single link. +Then you can host it on [GitHub Pages](https://pages.github.com/), [Netlify](https://netlify.app/), [Vercel](https://vercel.com/), or whatever other web server or service that you want. Now you can share your slides with the rest of the world with a single link. ### Base Path @@ -24,7 +24,7 @@ $ slidev build --base /talks/my-cool-talk/ Refer to [Vite's documentation](https://vitejs.dev/guide/build.html#public-base-path) for more details. -### Provide Downloadable PDF +### Provide a Downloadable PDF You can provide a downloadable PDF to the viewers of your SPA with the following config: @@ -73,7 +73,7 @@ $ slidev build --watch ### Multiple entries -You can also build multiple slides at once. +You can build multiple slide deckss at once. ```bash $ slidev build slides1.md slides2.md diff --git a/guide/install.md b/guide/install.md index 9d09ad3..8c7f4f7 100644 --- a/guide/install.md +++ b/guide/install.md @@ -4,7 +4,7 @@ > Slidev requires [**Node.js >=18.0**](https://nodejs.org/) -The best way to get started is using our official starter template. +The best way to get started is by using our official starter template: ::: code-group @@ -22,13 +22,13 @@ pnpm create slidev ::: -Follow the prompts and it will open up the slideshow at `http://localhost:3030/` automatically for you. +Follow the prompts and it will open the slideshow at `http://localhost:3030/` automatically for you. -It also contains the basic setup and a short demo with instructions on how to get started with Slidev. +It also contains a basic setup along with a short demo with instructions on how to get started with Slidev. ## Install Manually -If you still prefer to install Slidev manually or would like to integrate it into your existing projects, you can do: +If you prefer to install Slidev manually or would like to integrate it into an existing project, you can do: ```bash npm install @slidev/cli @slidev/theme-default @@ -81,9 +81,9 @@ If your work folder is empty, it will generate a template `slides.md` and other You can access your slides from `http://localhost:3030/` -### Build deployable image +### Build deployable images -Or you can create your own slidev project to a docker image with Dockerfile: +You can create your own slidev project as a docker image with Dockerfile: ```Dockerfile FROM tangramor/slidev:latest @@ -99,19 +99,19 @@ You can visit your slides from `http://localhost:3030/` ### Build hostable SPA (Single Page Application) -Run command `docker exec -i slidev npx slidev build` on the running container `slidev`. It will generate static HTML files under `dist` folder. +Run `docker exec -i slidev npx slidev build` on the running container `slidev`. It will generate static HTML files under `dist` folder. #### Host on Github Pages -You can host `dist` in a static web site such as [Github Pages](https://tangramor.github.io/slidev_docker/) or Gitlab Pages. +You can host `dist` as a static website via such services as [Github Pages](https://tangramor.github.io/slidev_docker/) or Gitlab Pages. -Because in Github pages the url may contain subfolder, so you need to modify the generated `index.html` to change `href="/assets/xxx` to `href="./assets/xxx`. Or you may use `--base=/<subfolder>/` option during the build process, such as: `docker exec -i slidev npx slidev build --base=/slidev_docker/`. +Since in GitHub Pages the URL may contain subfolders, you may use `--base=/<subfolder>/` option during the build process, such as `docker exec -i slidev npx slidev build --base=/slidev_docker/`. -And to avoid Jekyll build process, you need to add an empty file `.nojekyll`. +To avoid the Jekyll build process, you'll need to add an empty file `.nojekyll`. -#### Host by docker +#### Host via docker -You can also host it by yourself with docker: +You can also host Slidev yourself via docker: ```bash docker run --name myslides --rm -p 80:80 -v ${PWD}/dist:/usr/share/nginx/html nginx:alpine @@ -131,11 +131,11 @@ And run the container: `docker run --name myslides --rm -p 80:80 mystaticppt` You can visit your slides from http://localhost/ -Refer to the [tangramor/slidev_docker](https://github.com/tangramor/slidev_docker) for more details. +Refer to [tangramor/slidev_docker](https://github.com/tangramor/slidev_docker) for more details. ## Command Line Interface (CLI) -`@slidev/cli` Expose a few commands you can use with `npx slidev ...` or by adding scripts in your `package.json`: +`@slidev/cli` exposes a few commands you can use with `npx slidev ...` or by adding scripts in your `package.json`: ```json { @@ -162,7 +162,7 @@ npm run slidev -- --open Start a local server for Slidev. -- `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. +- `[entry]` (`string`, default: `slides.md`): path to the markdown file containing your slides. Options: @@ -176,15 +176,15 @@ Options: ### `slidev build [entry]` -Build hostable SPA. +Build a hostable SPA. -- `[entry]` (`string`, default: `slides.md`): path to the slides markdown entry. +- `[entry]` (`string`, default: `slides.md`): path to the slides markdown file. Options: - `--out`, `-o` (`string`, default: `dist`): output dir. - `--base` (`string`, default: `/`): base URL (see https://cli.vuejs.org/config/#publicpath) -- `--download` (`boolean`, default: `false`): allow to download the slides as PDF inside the SPA. +- `--download` (`boolean`, default: `false`): allow the download of the slides as a PDF inside the SPA. - `--theme`, `-t` (`string`): override theme. ### `slidev export [entry]` diff --git a/guide/presenter-mode.md b/guide/presenter-mode.md index e926339..09bcc84 100644 --- a/guide/presenter-mode.md +++ b/guide/presenter-mode.md @@ -1,6 +1,8 @@ # Presenter Mode -Click the <carbon-user-speaker class="inline-icon-btn"/> button in the navigation panel, or visit `http://localhost:3030/presenter` manually, to enter the presenter mode. Whenever you enter the presenter mode, other page instances will automatically stay in sync with the presenter. +Click the <carbon-user-speaker class="inline-icon-btn"/> button in the navigation panel, or visit `http://localhost:3030/presenter` manually, to enter the presenter mode. To present, you'll want to open two browser windows, one for the presenter and one for the audience. Generally maximizing the slideshow window on your projector screen, then controlling it from your laptop's screen is how people present with Slidev. + +Whenever you change slides in the presenter mode, all other page instances will automatically change as well, to stay in sync with the presenter. ![](/screenshots/presenter-mode.png) @@ -16,7 +18,7 @@ presenter: false --- ``` -Or you can enable it only for `dev` or `build` mode by setting the mode you want in the config: +Alternately you can enable it only for `dev` or `build` modes by setting the mode you want in the config: ```md --- @@ -30,8 +32,6 @@ In that case the presenter will only be available when running `slidev` but not You can run your presentation with remote access by running `slidev --remote`. -In that case you may want to share the slides with other people but you don't want them to access the presenter mode to mess up your presentation. - -For this scenario you can provide a password for starting the server by running `slidev --remote=your_password`. +If you want to share your slides with other people but you don't want them to access the presenter mode (either because you're ashamed of your presenter notes, or because you don't want them to mess up your presentation), you can provide a password to protect the presenter server by running `slidev --remote=your_password`. In that case you will need to provide the password when accessing `/presenter/*` routes. diff --git a/guide/recording.md b/guide/recording.md index 3a81163..86541bf 100644 --- a/guide/recording.md +++ b/guide/recording.md @@ -1,6 +1,6 @@ # Recording -Slidev has a built-in recording and camera view. You can use them to record your presentation easily in one place. +Slidev has a built-in recording feature, as well as a camera view. You can use them to record your presentation easily in one simple tool rather than juggling a bunch of disparate recording options while also giving a talk. ## Camera View @@ -10,7 +10,7 @@ Click the <carbon-user-avatar class="inline-icon-btn"/> button in the navigation ## Recording -Clicking the <carbon-video class="inline-icon-btn"/> button in the navigation panel will bring up a dialog for you. Here you can choose to either record your camera embedded in your slides or to separate them into two video files. +Clicking the <carbon-video class="inline-icon-btn"/> button in the navigation panel will bring up a dialog for you. Here you can choose to either record your camera output embedded in your slides or to separate them into two video files. This feature is powered by [RecordRTC](https://github.com/muaz-khan/RecordRTC) and uses the [WebRTC API](https://webrtc.org/). diff --git a/guide/syntax.md b/guide/syntax.md index 084cc6f..faff993 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -100,7 +100,7 @@ This is a page with the layout `center` and a background image. ## Code Blocks -One big reason I am building Slidev is needing to make my code look just right in the slides. So just as you expected, you can use Markdown flavored code block to highlight your code. +One big reason that led to the creation of Slidev is the need to make code look just right in slides. Accordingly, you can use Markdown-flavored code blocks to highlight your code. ````md ```ts @@ -108,11 +108,11 @@ console.log('Hello, World!') ``` ```` -We have [Shiki](https://github.com/shikijs/shiki) builtin as the syntax highlighter. Refer to [the highlighters section](/custom/highlighters) for more details. +Slidev has [Shiki](https://github.com/shikijs/shiki) built in as the syntax highlighter. Refer to [the highlighters section](/custom/highlighters) for more details. ### Line Highlighting -To highlight specific lines, simply add line numbers within bracket `{}`. Line numbers start counting from 1 by default. +To highlight specific lines, simply add line numbers within brackets `{}`. Line numbers start counting from 1 by default. ````md ```ts {2,3} @@ -125,7 +125,7 @@ function add( ``` ```` -To change the highlight in multiple clicks, you can use `|` to separate them: +To change what's highlighted with multiple clicks, you can use `|` to separate each stage: ````md ```ts {2-3|5|all} @@ -154,12 +154,12 @@ function add( ```` ::: tip -Learn more in the [clicks animations guide](./animations#positioning). +Learn more in the [click animations guide](./animations#positioning). ::: ### Line Numbers -You can enable line number to all slides by setting `lineNumbers: true` on the config or enable each code block individually by setting `lines: true`. You can also set the starting line for each code block and highlight the lines accordingly, defaults to 1: +You can enable line numbers for all slides by setting `lineNumbers: true` in the global config or enable each code block individually by setting `lines: true`. You can also set the starting line for each code block and highlight the lines accordingly; it defaults to 1: ````md ```ts {6,7}{lines:true,startLine:5} @@ -226,7 +226,9 @@ const count = ref(0) [Shiki Magic Move](https://github.com/shikijs/shiki-magic-move) enables you to have granular transition between code changes, similar to Keynote's Magic Move. You can check [the playground](https://shiki-magic-move.netlify.app/) to see how it works. -In Slidev, we bind it to the [clicks system](/guide/animations#click-animations). The syntax is wrap multiple code blocks representing each steps with <code>````md magic-move</code> (mind it's **4** backticks), this will be transformed into one code block, that morphing to each steps as you click. +<video src="https://github.com/slidevjs/slidev/assets/11247099/79927794-27ba-4342-9911-9996cec889d6" controls rounded shadow w-full></video> + +In Slidev, we bind the magic-move to the [clicks system](/guide/animations#click-animations). The syntax is to wrap multiple code blocks representing each step with <code>````md magic-move</code> (mind it's **4** backticks), this will be transformed into one code block, that morphs to each step as you click. `````md ````md magic-move @@ -296,9 +298,9 @@ This line is removed on the left. ``` ```` -It will provide the editor with a "Run" button, and shows the result right below the code block. You many also modify the code and the result will be re-evaluated on the fly. +It provides the editor with a "Run" button, and shows the result of the code execution right below the code block. You may also modify the code and the result will be re-evaluated on the fly. -By default it will automatically runs the code when the slide is loaded, if you want to always explicitly trigger the run, you can set `{autorun:false}`. +By default it will automatically run the code when the slide is loaded; if you want to instead explicitly trigger the run, you can set `{autorun:false}`. ````md ```ts {monaco-run} {autorun:false} @@ -326,7 +328,7 @@ You can also use the [Import Code Snippets](#import-code-snippets) syntax combin <<< ./some-file.ts {monaco-write} ``` -When using this, make sure to back up of your files beforehand, as the changes will be saved directly to the file. +When using this, be sure to back up your files beforehand, as the changes will be saved directly to the file. ## Embedded Styles @@ -346,7 +348,7 @@ h1 { # Next slide is not affected ``` -`<style>` tag in Markdown is always [scoped](https://vuejs.org/api/sfc-css-features.html#scoped-css). As an outstanding result, a selector with the child combinator (`.a > .b`) is unusable as such; see the previous link. To have global style overrides, check out the [customization section](/custom/directory-structure#style). +The `<style>` tag in Markdown is always [scoped](https://vuejs.org/api/sfc-css-features.html#scoped-css). As a result, a selector with a child combinator (`.a > .b`) is unusable as such; see the previous link. To have global style overrides, check out the [customization section](/custom/directory-structure#style). Powered by [UnoCSS](/custom/config-unocss), you can directly use nested css and [directives](https://unocss.dev/transformers/directives) (e.g. `--uno:` or `@apply`) @@ -368,7 +370,7 @@ blockquote { Just like you would do in markdown, you can use images pointing to a remote or local url. -For remote assets, the built-in [`vite-plugin-remote-assets`](https://github.com/antfu/vite-plugin-remote-assets) will cache them into the disk at the first run so you can have instant loading even for large images later on. +For remote assets, the built-in [`vite-plugin-remote-assets`](https://github.com/antfu/vite-plugin-remote-assets) will cache them onto disk at first run so you can have instant loading--even for large images later on. ```md ![Remote Image](https://sli.dev/favicon.png) @@ -388,7 +390,7 @@ For you want to apply custom sizes or styles, you can convert them to the `<img> ## Notes -You can also take notes for each slide. They will show up in [Presenter Mode](/guide/presenter-mode) for you to reference during presentations. +You can also create presenter notes for each slide. They will show up in [Presenter Mode](/guide/presenter-mode) for you to reference during presentations. In Markdown, the last comment block in each slide will be treated as a note. @@ -416,21 +418,21 @@ This is another note --> ``` -Basic Markdown and HTML are also supported in notes on Presenter renderering. +Basic Markdown and HTML are also supported in notes when the Presenter renders note content. ### Click Markers > Available since v0.48 -For some slides you might have longer notes that might be hard to find where you are looking at, we introduced the click markers that allows highlighting and auto-scrolling to the section of notes of your corresponding content. Put `[click]` markers in your notes for the timming you need to go to another [click](/guide/animations#click-animations), Slidev divide the content between the click markers and highlight them in presenter notes, synchronized with your slide progress. +For some slides you might have longer notes that could be hard to find your place. Slidev supports click markers that allow highlighting and auto-scrolling to the section of notes from your corresponding content. Put `[click]` markers in your notes for the timing you need to go to another [click](/guide/animations#click-animations), Slidev divides the content between the click markers and highlights it in presenter notes, synchronized with your slide progress. <!-- TODO: add a video --> ## Icons -Slidev allows you to have the accessing to almost all the popular open-source iconsets **directly** in your markdown after installing the corresponding package. Powered by [`unplugin-icons`](https://github.com/antfu/unplugin-icons) and [Iconify](https://iconify.design/). +Slidev allows you to have access to virtually all open-source icon sets **directly** in your markdown after installing the corresponding package. Powered by [`unplugin-icons`](https://github.com/antfu/unplugin-icons) and [Iconify](https://iconify.design/). -The naming follows [Iconify](https://iconify.design/)'s conversion `{collection-name}-{icon-name}`. For example: +The naming follows [Iconify](https://iconify.design/)'s convention of `{collection-name}-{icon-name}`. For example: - `<mdi-account-circle />` - <mdi-account-circle /> from [Material Design Icons](https://github.com/Templarian/MaterialDesign) - [`@iconify-json/mdi`](https://npmjs.com/package/@iconify-json/mdi) - `<carbon-badge />` - <carbon-badge /> from [Carbon](https://github.com/carbon-design-system/carbon/tree/main/packages/icons) - [`@iconify-json/carbon`](https://npmjs.com/package/@iconify-json/carbon) @@ -495,7 +497,7 @@ This shows on the right </div> </div> -We also provide a shorthand syntax sugar `::name::` for slot name. The following example works exactly the same as the previous one. +We also provide a shorthand syntactical sugar `::name::` for slot name. The following works exactly the same as the previous example. ```md --- @@ -551,7 +553,7 @@ This feature is vendored from VitePress, learn more about it in [VitePress's doc ## Configurations -All configurations needed can be defined in the Markdown file. For example: +All configurations can be defined in the Markdown file. For example: ```md --- @@ -653,7 +655,7 @@ Learn more: [Demo](https://sli.dev/demo/starter/9) | [Mermaid](https://mermaid-j > Available since v0.15 -You can split your `slides.md` into multiple files and organize them as you want. +You can split your `slides.md` into multiple files and organize them however you'd like. `slides.md` : @@ -682,7 +684,7 @@ This page is from another file ### Frontmatter Merging -You can provide frontmatters from both your main entry and external markdown pages. If there are the same keys in them, the ones from the **main entry have the higher priority**. For example: +You can provide frontmatter instructions from both your main entry and external markdown pages. If there are duplicate keys in them, the ones from the **main entry have the higher priority**. For example: `slides.md` : @@ -721,7 +723,7 @@ class: text-center Cover Page ``` -### Page Reusing +### Page Reuse With the multi-entries support, reusing pages could be straightforward. For example: From e39258497e71e66a32b3589a2be6d02e9b013f4e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jakob=20Korde=C5=BE?= <jakobkordez1999@gmail.com> Date: Tue, 11 Jun 2024 23:34:43 +0200 Subject: [PATCH 201/211] docs: typos (#1662) --- guide/editors.md | 2 +- guide/hosting.md | 2 +- guide/install.md | 2 +- guide/syntax.md | 6 +++--- 4 files changed, 6 insertions(+), 6 deletions(-) diff --git a/guide/editors.md b/guide/editors.md index 80281e2..36152c1 100644 --- a/guide/editors.md +++ b/guide/editors.md @@ -1,6 +1,6 @@ # Editor Support -Since Slidev is using Markdown as the source entry, you can use any editor you'd lik' to write your slides. +Since Slidev uses Markdown as the source entry, you can use any editor you prefer to create your slides. If you want some high-level management to your slides, we have provided the following editor integrations for you! diff --git a/guide/hosting.md b/guide/hosting.md index 5d711eb..01b8dfe 100644 --- a/guide/hosting.md +++ b/guide/hosting.md @@ -73,7 +73,7 @@ $ slidev build --watch ### Multiple entries -You can build multiple slide deckss at once. +You can build multiple slide decks at once. ```bash $ slidev build slides1.md slides2.md diff --git a/guide/install.md b/guide/install.md index 8c7f4f7..56a859f 100644 --- a/guide/install.md +++ b/guide/install.md @@ -103,7 +103,7 @@ Run `docker exec -i slidev npx slidev build` on the running container `slidev`. #### Host on Github Pages -You can host `dist` as a static website via such services as [Github Pages](https://tangramor.github.io/slidev_docker/) or Gitlab Pages. +You can host `dist` as a static website via services such as [GitHub Pages](https://tangramor.github.io/slidev_docker/) or GitLab Pages. Since in GitHub Pages the URL may contain subfolders, you may use `--base=/<subfolder>/` option during the build process, such as `docker exec -i slidev npx slidev build --base=/slidev_docker/`. diff --git a/guide/syntax.md b/guide/syntax.md index faff993..6aaf58a 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -100,7 +100,7 @@ This is a page with the layout `center` and a background image. ## Code Blocks -One big reason that led to the creation of Slidev is the need to make code look just right in slides. Accordingly, you can use Markdown-flavored code blocks to highlight your code. +One big reason that led to the creation of Slidev was the need to perfectly display code in slides. Consequently, you can use Markdown-flavored code blocks to highlight your code. ````md ```ts @@ -159,7 +159,7 @@ Learn more in the [click animations guide](./animations#positioning). ### Line Numbers -You can enable line numbers for all slides by setting `lineNumbers: true` in the global config or enable each code block individually by setting `lines: true`. You can also set the starting line for each code block and highlight the lines accordingly; it defaults to 1: +You can enable line numbering for all slides by setting `lineNumbers: true` in the global config or enable each code block individually by setting `lines: true`. You can also set the starting line for each code block and highlight the lines accordingly; it defaults to 1: ````md ```ts {6,7}{lines:true,startLine:5} @@ -370,7 +370,7 @@ blockquote { Just like you would do in markdown, you can use images pointing to a remote or local url. -For remote assets, the built-in [`vite-plugin-remote-assets`](https://github.com/antfu/vite-plugin-remote-assets) will cache them onto disk at first run so you can have instant loading--even for large images later on. +For remote assets, the built-in [`vite-plugin-remote-assets`](https://github.com/antfu/vite-plugin-remote-assets) will cache them onto the disk at first run, ensuring instant loading even for large images later on. ```md ![Remote Image](https://sli.dev/favicon.png) From ae605ce43b6ea9b594d31503a307c8dde426198b Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Mon, 17 Jun 2024 20:47:48 +0800 Subject: [PATCH 202/211] feat: optional wake lock (#1676) --- custom/index.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/custom/index.md b/custom/index.md index 79cff09..84deae4 100644 --- a/custom/index.md +++ b/custom/index.md @@ -57,6 +57,8 @@ selectable: true record: dev # enable Slidev's context menu, can be boolean, 'dev' or 'build' contextMenu: true +# enable wake lock, can be boolean, 'dev' or 'build' +wakeLock: true # force color schema for the slides, can be 'auto', 'light', or 'dark' colorSchema: auto From 21ba4d700bbec872dc75d5492cf2a907b8cc4633 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Mon, 17 Jun 2024 20:48:06 +0800 Subject: [PATCH 203/211] feat(vscode): `slidev.include` configuration (#1675) --- guide/editors.md | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/guide/editors.md b/guide/editors.md index 36152c1..137eb08 100644 --- a/guide/editors.md +++ b/guide/editors.md @@ -65,6 +65,14 @@ In the **preview webview**, you can click the <codicon-run-all /> icon to start There are also some **commands** you can use. Type `Slidev` in the command palette to see them. +You can add glob patterns to the `slidev.include` configuration to include files as Slidev entries. The default value is `["**/*.md"]`. Example: + +```json +{ + "slidev.include": ["**/presentation.md"] +} +``` + ## Prettier Plugin Slidev also provides a Prettier plugin to format your slides. You can use it with your favorite editor that supports Prettier. Docs for the plugin can be found [here](https://github.com/slidevjs/prettier-plugin). From 6f23958902ff4df7179e6fa2be93b07b2bf03983 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Tue, 18 Jun 2024 18:35:09 +0800 Subject: [PATCH 204/211] docs: pin `typeit` to `v8.1.0` (#1684) --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 9c730e5..ddf8e7a 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,7 @@ "dependencies": { "@antfu/utils": "^0.7.8", "@vueuse/core": "^10.10.0", - "typeit": "^8.8.3" + "typeit": "8.1.0" }, "devDependencies": { "@iconify/json": "^2.2.215", From e5a62551009b43d3681760dc9139f4b479aee298 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Thu, 20 Jun 2024 17:35:35 +0800 Subject: [PATCH 205/211] feat: add `--wait-until` option for exporting (#1687) --- guide/exporting.md | 33 +++++++++++++++++++++++++-------- 1 file changed, 25 insertions(+), 8 deletions(-) diff --git a/guide/exporting.md b/guide/exporting.md index 377e81c..11ba708 100644 --- a/guide/exporting.md +++ b/guide/exporting.md @@ -157,23 +157,40 @@ docker exec -i slidev npx slidev export --timeout 2m --output slides.pdf ### Timeouts -<<<<<<< HEAD:guide/exporting.md -For big presentation you might want to increase the playwrigth timeout with `--timeout` -======= For big presentations you might want to increase the Playwright timeout with `--timeout`: ->>>>>>> feat: enhance `SlidevVideo` component (#1435):docs/guide/exporting.md ```bash $ slidev export --timeout 60000 ``` +### Wait + +Some parts of your slides may require a longer time to render. You can use the `--wait` option to have an extra delay before exporting: + +```bash +$ slidev export --wait 10000 +``` + +There is also a `--wait-until` option to wait for a state before exporting each slide: + +```bash +$ slidev export --wait-until none +``` + +Possible values: + +- `'networkidle'` - (_default_) consider operation to be finished when there are no network connections for at least `500` ms. Don't use this method for testing, rely on web assertions to assess readiness instead. +- `'domcontentloaded'` - consider operation to be finished when the `DOMContentLoaded` event is fired. +- `'load'` - consider operation to be finished when the `load` event is fired. +- `'none'` - do not wait for any event. + +::: warning +When specifying values other than `'networkidle'`, please make sure the printed slides are complete and correct. If some contents are missing, you may need to use the `--wait` option. +::: + ### Executable path -<<<<<<< HEAD:guide/exporting.md -You can set the browser executable path for playwright using `--executable-path` -======= Chromium may miss some features like codecs that are required to decode some videos. You can set the browser executable path for Playwright to your Chrome or Edge using `--executable-path`: ->>>>>>> feat: enhance `SlidevVideo` component (#1435):docs/guide/exporting.md ```bash $ slidev export --executable-path [path_to_chromium] From 13a912c7c8bf530a596f16b18ef8f4f51630826f Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Thu, 20 Jun 2024 17:35:57 +0800 Subject: [PATCH 206/211] feat: add slide lifetime hooks (#1688) --- custom/vue-context.md | 39 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 39 insertions(+) diff --git a/custom/vue-context.md b/custom/vue-context.md index 06f22ed..4b3d086 100644 --- a/custom/vue-context.md +++ b/custom/vue-context.md @@ -110,3 +110,42 @@ themeConfig: > Available since v0.43.0 A shorthand of `$slidev.nav`. + +## Composable Usage + +> Available since v0.48.0 + +### Context + +If you want to get the context programmatically (also type-safely), you can import composables from `@slidev/client`: + +```vue +<script setup> +import { onSlideEnter, onSlideLeave, useDarkMode, useIsSlideActive, useNav, useSlideContext } from '@slidev/client' + +const { $slidev } = useSlideContext() +const { currentPage, currentLayout, currentSlideRoute } = useNav() +const { isDark } = useDarkMode() +const isActive = useIsSlideActive() +onSlideEnter(() => { /* ... */ }) +onSlideLeave(() => { /* ... */ }) +// ... +</script> +``` + +> [!NOTE] +> Previously, you might see the usage of importing nested modules like `import { isDark } from '@slidev/client/logic/dark.ts'`, this is **NOT RECOMMENDED** as they are internal implementation details and might be broken in the future. Try always to use the public API from `@slidev/client` whenever possible. + +### Types + +If you want to get a type programmatically, you can import types like `TocItem` from `@slidev/types`: + +```vue +<script setup> +import type { TocItem } from '@slidev/types' + +function tocFunc(tree: TocItem[]): TocItem[] { + // ... +} +</script> +``` From 5b2f357cf159aeb787539c79eefd1493589aa7df Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Fri, 21 Jun 2024 00:22:48 +0800 Subject: [PATCH 207/211] update docs and demo slides --- builtin/components.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/builtin/components.md b/builtin/components.md index 444f6f8..d70f268 100644 --- a/builtin/components.md +++ b/builtin/components.md @@ -132,6 +132,10 @@ routeAlias: solutions # Now some solutions! ``` +### `PoweredBySlidev` + +Renders "Powered by Slidev" with a link to the Slidev website. + ### `RenderWhen` Render slot only when the context match (for example when we are in presenter view). From 485db40e862bfd5a9f1464675af6cfc657d42659 Mon Sep 17 00:00:00 2001 From: _Kerman <kermanx@qq.com> Date: Tue, 25 Jun 2024 17:00:20 +0800 Subject: [PATCH 208/211] feat: replace CodeMirror in side editor with Shiki-based textarea (#1698) --- guide/editors.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/guide/editors.md b/guide/editors.md index 137eb08..cee5060 100644 --- a/guide/editors.md +++ b/guide/editors.md @@ -6,7 +6,7 @@ If you want some high-level management to your slides, we have provided the foll ## Integrated Editor -Slidev comes with an integrated [CodeMirror](https://codemirror.net/) editor that will instantly reload and save the changes to your file. +Slidev comes with an integrated editor that will instantly reload and save the changes to your file. Click the <carbon-edit class="inline-icon-btn"/> button to open it. From 9e1c87b38f3a44f47e08e788bab9a7a48837d25d Mon Sep 17 00:00:00 2001 From: Anthony Fu <github@antfu.me> Date: Tue, 25 Jun 2024 11:58:38 +0200 Subject: [PATCH 209/211] chore: update deps --- package.json | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/package.json b/package.json index ddf8e7a..db30efb 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "type": "module", "private": true, - "packageManager": "pnpm@9.1.4", + "packageManager": "pnpm@9.4.0", "scripts": { "dev": "vitepress", "build": "vitepress build", @@ -13,23 +13,23 @@ "typeit": "8.1.0" }, "devDependencies": { - "@iconify/json": "^2.2.215", - "@shikijs/vitepress-twoslash": "^1.6.1", + "@iconify/json": "^2.2.222", + "@shikijs/vitepress-twoslash": "^1.9.1", "@slidev/client": "0.34.3", "@slidev/parser": "0.34.3", "@slidev/theme-default": "0.21.2", "@slidev/types": "0.34.3", "@types/fs-extra": "^11.0.4", "@types/node": "^20.13.0", - "@unocss/reset": "^0.60.4", + "@unocss/reset": "^0.61.0", "fs-extra": "^11.2.0", "markdown-it": "^14.1.0", - "shiki": "^1.6.1", + "shiki": "^1.9.1", "typescript": "^5.4.5", - "unocss": "^0.60.4", + "unocss": "^0.61.0", "unplugin-icons": "^0.19.0", - "unplugin-vue-components": "^0.27.0", + "unplugin-vue-components": "^0.27.1", "vite-plugin-inspect": "^0.8.4", - "vitepress": "^1.2.2" + "vitepress": "^1.2.3" } } From a5791e95e060d78dc56c7490d643c084e76ae318 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?M=C3=A1t=C3=A9=20Gy=C3=B6ngy=C3=B6si?= <gyongyosimate1@gmail.com> Date: Sat, 29 Jun 2024 00:17:39 +0200 Subject: [PATCH 210/211] chore: update URL of `npx` package (#1711) --- guide/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/guide/index.md b/guide/index.md index 32c836a..66e756a 100644 --- a/guide/index.md +++ b/guide/index.md @@ -70,7 +70,7 @@ In a project where Slidev is installed, you can use the `slidev` binary in your } ``` -Otherwise, you can use it with [`npx`](https://www.npmjs.com/package/npx) +Otherwise, you can use it with [`npx`](https://github.com/npm/cli/blob/latest/bin/npx) ```bash $ npx slidev From 21fdadc17cd2018f65c637e5727de640db5036e3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?M=C3=A1t=C3=A9=20Gy=C3=B6ngy=C3=B6si?= <gyongyosimate1@gmail.com> Date: Sun, 30 Jun 2024 14:08:52 +0200 Subject: [PATCH 211/211] docs: add example and correct usage of `[click]` & `[click:{n+1}]` (#1717) --- guide/syntax.md | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) diff --git a/guide/syntax.md b/guide/syntax.md index 6aaf58a..8e4210d 100644 --- a/guide/syntax.md +++ b/guide/syntax.md @@ -424,7 +424,23 @@ Basic Markdown and HTML are also supported in notes when the Presenter renders n > Available since v0.48 -For some slides you might have longer notes that could be hard to find your place. Slidev supports click markers that allow highlighting and auto-scrolling to the section of notes from your corresponding content. Put `[click]` markers in your notes for the timing you need to go to another [click](/guide/animations#click-animations), Slidev divides the content between the click markers and highlights it in presenter notes, synchronized with your slide progress. +For some slides you might have longer notes that could be hard to find your place. Slidev supports click markers that allow highlighting and auto-scrolling to the section of notes from your corresponding content. Put `[click]` markers at the beginning of any line in your notes for the timing you need to go to another [click](/guide/animations#click-animations). You may skip `n` clicks by using `[click:{n+1}]`. For example: + +```md +<!-- +Content before the first click + +[click] This will be highlighted after the first click + +Also highlighted after the first click + +- [click] This list element will be highlighted after the second click + +[click:3] Last click (skip two clicks) +--> +``` + +Slidev divides the content between the click markers and highlights it in presenter notes, synchronized with your slide progress. <!-- TODO: add a video -->