@slidev/docs 51.8.0 → 51.8.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/features/code-groups.md +42 -15
- package/package.json +12 -12
package/features/code-groups.md
CHANGED
|
@@ -33,11 +33,17 @@ pnpm add @slidev/cli
|
|
|
33
33
|
|
|
34
34
|
## Title Icon Matching
|
|
35
35
|
|
|
36
|
-
`code groups` and `
|
|
36
|
+
`code groups`, `code block` and [`Shiki Magic Move`](/features/shiki-magic-move) also supports the automatically icon matching by the title name.
|
|
37
37
|
|
|
38
38
|

|
|
39
39
|
|
|
40
|
-
:::
|
|
40
|
+
::: info
|
|
41
|
+
|
|
42
|
+
By default, we provide some built-in icons, you can use them by install [@iconify-json/vscode-icons](https://www.npmjs.com/package/@iconify-json/vscode-icons).
|
|
43
|
+
|
|
44
|
+
:::
|
|
45
|
+
|
|
46
|
+
::: details All built-in icons
|
|
41
47
|
|
|
42
48
|
```js
|
|
43
49
|
const builtinIcons = {
|
|
@@ -103,26 +109,47 @@ const builtinIcons = {
|
|
|
103
109
|
|
|
104
110
|
:::
|
|
105
111
|
|
|
106
|
-
## Custom
|
|
112
|
+
## Custom Icons
|
|
113
|
+
|
|
114
|
+
You can use any name from the [iconify](https://icones.js.org) collection by using the `~icon~` syntax, for example:
|
|
115
|
+
|
|
116
|
+
````md
|
|
117
|
+
```js [npm ~i-uil:github~]
|
|
118
|
+
console.log('Hello, GitHub!')
|
|
119
|
+
```
|
|
120
|
+
````
|
|
121
|
+
|
|
122
|
+
To make it work, you need to:
|
|
123
|
+
|
|
124
|
+
1. Install the icon's collection.
|
|
125
|
+
|
|
126
|
+
:::code-group
|
|
107
127
|
|
|
108
|
-
|
|
128
|
+
```sh [npm]
|
|
129
|
+
npm add @iconify-json/uil
|
|
130
|
+
```
|
|
109
131
|
|
|
110
|
-
|
|
132
|
+
```sh [yarn]
|
|
133
|
+
yarn add @iconify-json/uil
|
|
134
|
+
```
|
|
135
|
+
|
|
136
|
+
```sh [pnpm]
|
|
137
|
+
pnpm add @iconify-json/uil
|
|
138
|
+
```
|
|
139
|
+
|
|
140
|
+
```sh [bun]
|
|
141
|
+
bun add @iconify-json/uil
|
|
142
|
+
```
|
|
143
|
+
|
|
144
|
+
:::
|
|
145
|
+
|
|
146
|
+
2. Add the icon to the `uno.config.ts` file.
|
|
111
147
|
|
|
112
148
|
```ts [uno.config.ts] {3-5}
|
|
113
149
|
import { defineConfig } from 'unocss'
|
|
114
|
-
|
|
115
150
|
export default defineConfig({
|
|
116
151
|
safelist: [
|
|
117
|
-
'i-
|
|
152
|
+
'i-uil:github',
|
|
118
153
|
],
|
|
119
154
|
})
|
|
120
155
|
```
|
|
121
|
-
|
|
122
|
-
2. Use the icon in the code block with the `~icon~` syntax:
|
|
123
|
-
|
|
124
|
-
````md
|
|
125
|
-
```sh [npm ~i-vscode-icons:file-type-coverage~]
|
|
126
|
-
npm i @slidev/cli
|
|
127
|
-
```
|
|
128
|
-
````
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@slidev/docs",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "51.8.
|
|
4
|
+
"version": "51.8.1",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"funding": "https://github.com/sponsors/antfu",
|
|
7
7
|
"homepage": "https://sli.dev",
|
|
@@ -17,28 +17,28 @@
|
|
|
17
17
|
],
|
|
18
18
|
"devDependencies": {
|
|
19
19
|
"@antfu/utils": "^9.2.0",
|
|
20
|
-
"@iconify/json": "^2.2.
|
|
20
|
+
"@iconify/json": "^2.2.344",
|
|
21
21
|
"@shikijs/vitepress-twoslash": "^3.4.2",
|
|
22
|
-
"@types/node": "^22.15.
|
|
23
|
-
"@unocss/reset": "^66.1.
|
|
24
|
-
"@vueuse/core": "^13.
|
|
22
|
+
"@types/node": "^22.15.29",
|
|
23
|
+
"@unocss/reset": "^66.1.3",
|
|
24
|
+
"@vueuse/core": "^13.3.0",
|
|
25
25
|
"fast-glob": "^3.3.3",
|
|
26
26
|
"gray-matter": "^4.0.3",
|
|
27
27
|
"markdown-it": "^14.1.0",
|
|
28
28
|
"shiki": "^3.4.2",
|
|
29
29
|
"typeit": "8.1.0",
|
|
30
30
|
"typescript": "^5.8.3",
|
|
31
|
-
"unocss": "^66.1.
|
|
31
|
+
"unocss": "^66.1.3",
|
|
32
32
|
"unplugin-icons": "^22.1.0",
|
|
33
|
-
"unplugin-vue-components": "^28.
|
|
33
|
+
"unplugin-vue-components": "^28.7.0",
|
|
34
34
|
"vite-plugin-inspect": "^11.1.0",
|
|
35
35
|
"vitepress": "^2.0.0-alpha.5",
|
|
36
36
|
"vitepress-plugin-group-icons": "^1.5.5",
|
|
37
|
-
"vitepress-plugin-llms": "^1.3.
|
|
38
|
-
"vue": "^3.5.
|
|
39
|
-
"@slidev/
|
|
40
|
-
"@slidev/
|
|
41
|
-
"@slidev/
|
|
37
|
+
"vitepress-plugin-llms": "^1.3.4",
|
|
38
|
+
"vue": "^3.5.16",
|
|
39
|
+
"@slidev/client": "51.8.1",
|
|
40
|
+
"@slidev/types": "51.8.1",
|
|
41
|
+
"@slidev/parser": "51.8.1"
|
|
42
42
|
},
|
|
43
43
|
"scripts": {
|
|
44
44
|
"dev": "vitepress",
|