feat: enhance code block

[yuyinws]

Previous discuss.

docs.

This PR implementing the code block and code group features in Slidev's slide like vitepress-plugin-group-icons.
It is implemented on top of UnoCSS's PresetIcon feature.

Usage

Code Group

input

## Code Group

::code-group

```sh [pnpm]
pnpm add slidev
```

```sh [yarn]
yarn add slidev
```

```sh [npm]
npm i slidev
```

```sh [bun]
bun add slidev
```

::

## Code Block with title

```ts [vite.config.ts]
import vue from '@vitejs/plugin-vue'
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [vue()],
})
```

Output

---

Custom Icon

It's also support specify the icon manually:

Input

```sh [Dockerfile ~i-vscode-icons:file-type-docker~]
FROM node:18-alpine

WORKDIR /app

COPY package.json .

RUN npm install
```

Output

[netlify]

✅ Deploy Preview for slidev ready!

Name	Link
🔨 Latest commit	ae41ac6
🔍 Latest deploy log	https://app.netlify.com/projects/slidev/deploys/683140b77fe53d0008e36726
😎 Deploy Preview	https://deploy-preview-2178--slidev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[pkg-pr-new]

Open in StackBlitz

@slidev/client

npm i https://pkg.pr.new/slidevjs/slidev/@slidev/client@2178

create-slidev

npm i https://pkg.pr.new/slidevjs/slidev/create-slidev@2178

create-slidev-theme

npm i https://pkg.pr.new/slidevjs/slidev/create-slidev-theme@2178

@slidev/parser

npm i https://pkg.pr.new/slidevjs/slidev/@slidev/parser@2178

@slidev/cli

npm i https://pkg.pr.new/slidevjs/slidev/@slidev/cli@2178

@slidev/types

npm i https://pkg.pr.new/slidevjs/slidev/@slidev/types@2178

commit: ae41ac6

[antfu]

Wow, looks awesome! Thanks a lot for working on it with the high quality PR!

[adamdehaven]

It looks like the icons aren't automatically available -- does this require installing a separate package for the icons? It looks like I need to install vitepress-plugin-group-icons

[adamdehaven]

Would be awesome to have this work alongside the magic-move as well

[yuyinws]

It looks like the icons aren't automatically available -- does this require installing a separate package for the icons? It looks like I need to install vitepress-plugin-group-icons

No need to install vitepress-plugin-group-icons. But you should install the icon's iconify collection first, like @iconify-json/vscode-icons. I'll mention it in the docs later.