feat(ui): added asciinema player component (nolebase#173)

Signed-off-by: Neko Ayaka <[email protected]>

Author: nekomeowww

.vscode/settings.json

@@ -1,13 +1,16 @@
 {
   "cSpell.words": [
     "antfu",
+    "asciicast",
+    "asciinema",
     "Astro",
     "Attributify",
     "blurhash",
     "cijiugechu",
     "colorette",
     "datetime",
     "easytag",
+    "ElMassimo",
     "emittypes",
     "evanw",
     "frontmatter",
@@ -17,20 +20,19 @@
     "mkdist",
     "napi",
     "Nisekoi5",
+    "nodir",
     "nolebase",
     "Nólëbase",
     "quotepath",
     "Rehype",
     "resvg",
     "shikijs",
     "thumbhash",
+    "thumbhashes",
     "Twoslash",
     "unconfig",
     "uncrypto",
-    "unlazy",
-    "ElMassimo",
-    "nodir",
-    "thumbhashes"
+    "unlazy"
   ],
   "editor.formatOnSave": false,
   "editor.codeActionsOnSave": {

docs/.vitepress/config.ts

@@ -166,6 +166,7 @@ export const sidebars: Record<string, DefaultTheme.Sidebar> = {
       {
         text: 'Animations',
         items: [
+          { text: 'Asciinema player', link: '/pages/en/ui/asciinema-player/' },
           { text: 'Rive Canvas (Lazy Teleport)', link: '/pages/en/ui/lazy-teleport-rive-canvas/' },
         ],
       },
@@ -323,6 +324,7 @@ export const sidebars: Record<string, DefaultTheme.Sidebar> = {
       {
         text: '动画',
         items: [
+          { text: 'Asciinema 播放器', link: '/pages/en/ui/asciinema-player/' },
           { text: 'Rive Canvas（懒 Teleport）', link: '/pages/zh-CN/ui/lazy-teleport-rive-canvas/' },
         ],
       },

docs/pages/en/ui/asciinema-player/index.md

@@ -0,0 +1,41 @@
+<script setup>
+import { NuAsciinemaPlayer } from '@nolebase/ui'
+</script>
+
+# Asciinema Player
+
+<NuAsciinemaPlayer
+  src="/asciinema/test-nyancat.cast"
+  :preload="true"
+  :cols="400"
+  :rows="40"
+  :auto-play="true"
+  :controls="true"
+  :terminal-font-size="'12px'"
+  :loop="true"
+/>
+
+```vue
+<script setup>
+import { NuAsciinemaPlayer } from '@nolebase/ui'
+</script>
+
+<template>
+  <NuAsciinemaPlayer
+    src="/asciinema/test-nyancat.cast"
+    :preload="true"
+    :cols="400"
+    :rows="40"
+    :auto-play="true"
+    :controls="true"
+    :terminal-font-size="'12px'"
+    :loop="true"
+  />
+</template>
+```
+
+## Acknowledgements
+
+- [NARKOZ/go-nyancat: Nyancat in your terminal](https://github.com/NARKOZ/go-nyancat)
+- [klange/nyancat: Nyancat in your terminal, rendered through ANSI escape sequences. This is the source for the Debian package `nyancat`.](https://github.com/klange/nyancat)
+- [休息一下，看看彩虹貓囉！ Take a break at the Linux command line with Nyan Cat - HackMD](https://hackmd.io/@brlin/SkJi-KlWV/https%3A%2F%2Fhackmd.io%2FG1PDyxHYRjyE8UYewYePvQ?type=book)

docs/pages/zh-CN/ui/asciinema-player/index.md

@@ -0,0 +1,41 @@
+<script setup>
+import { NuAsciinemaPlayer } from '@nolebase/ui'
+</script>
+
+# Asciinema 播放器
+
+<NuAsciinemaPlayer
+  src="/asciinema/test-nyancat.cast"
+  :preload="true"
+  :cols="400"
+  :rows="40"
+  :auto-play="true"
+  :controls="true"
+  :terminal-font-size="'12px'"
+  :loop="true"
+/>
+
+```vue
+<script setup>
+import { NuAsciinemaPlayer } from '@nolebase/ui'
+</script>
+
+<template>
+  <NuAsciinemaPlayer
+    src="/asciinema/test-nyancat.cast"
+    :preload="true"
+    :cols="400"
+    :rows="40"
+    :auto-play="true"
+    :controls="true"
+    :terminal-font-size="'12px'"
+    :loop="true"
+  />
+</template>
+```
+
+## 致谢
+
+- [NARKOZ/go-nyancat: Nyancat in your terminal](https://github.com/NARKOZ/go-nyancat)
+- [klange/nyancat: Nyancat in your terminal, rendered through ANSI escape sequences. This is the source for the Debian package `nyancat`.](https://github.com/klange/nyancat)
+- [休息一下，看看彩虹貓囉！ Take a break at the Linux command line with Nyan Cat - HackMD](https://hackmd.io/@brlin/SkJi-KlWV/https%3A%2F%2Fhackmd.io%2FG1PDyxHYRjyE8UYewYePvQ?type=book)

docs/public/asciinema/test-nyancat.cast

@@ -32,6 +32,7 @@ export default defineConfig({
     '**/*.mov',
     '**/*.mp4',
     '**/*.riv',
+    '**/*.cast',
   ],
   optimizeDeps: {
     exclude: [

docs/vite.config.ts

@@ -76,6 +76,7 @@
   },
   "dependencies": {
     "@rive-app/canvas": "^2.11.1",
+    "asciinema-player": "^3.7.1",
     "less": "^4.2.0"
   },
   "devDependencies": {