apptify 0.5.0 → 0.5.4

package/docs/PLAYGROUND-TEMPLATE.md

@@ -1,74 +1,51 @@
-# 完整 playground 应用模板
+# 应用模板
 
-apptify 包既提供组件库，也携带完整的可编辑应用模板。模板源码在包内 templates/playground/，包括导航与页面布局、账号菜单与登录/注册表单、主题/动效/玻璃设置、404 纸片故事、全部示例页面及图片资源。
+npm 包包含完整可编辑的 Vue 应用：导航、账号表单、主题/动效/玻璃设置、404、组件示例与图片资源。
 
-这些应用文件不增加组件库的公开 exports。复制出的项目通过 apptify 和 apptify/vite 使用已打包组件库，不能导入原仓库的 src。
+## 创建与运行
 
-## 从本地包创建应用
-
-当前尚未发布 npm。使用 Node.js 22 或 24 LTS，先在库仓库生成包：
-
-~~~sh
-npm ci
-npm pack --pack-destination /tmp
-~~~
-
-npm pack 会先执行构建与模板准备。将输出的实际 tgz 路径代入以下命令；在一个用于安装组件库的空目录执行：
-
-~~~sh
-npm init -y
-npm install /tmp/apptify-0.4.0.tgz
-npx --no-install apptify-playground ../my-app
-cd ../my-app
+```sh
+npm create apptify@latest ./my-app
+cd my-app
 npm install
-npm run typecheck
-npm run build
 npm run dev
-~~~
-
-复制命令要求目标目录不存在或为空，拒绝覆盖已有项目。复制过程不会自动安装项目依赖。
+```
 
-my-app/vendor/ 会携带组件库 tgz，应用依赖使用相对 file: 依赖。可以把整个 my-app 移动到另一目录或发给其他使用者；后续安装无需原仓库或用于调用命令的安装目录。运行与构建所需依赖全部声明在应用的 package.json。更新库时可把新 tgz 放入 vendor/ 并调整该相对依赖。
+也可运行 `npx --package=apptify apptify-playground ./my-app`。
 
-也可手工复制包内 templates/playground/，把 gitignore 重命名为 .gitignore，再将模板 package.json 中的 apptify 版本依赖改为本地 tgz；复制命令会自动完成这些步骤。仓库内 templates/playground 是打包时生成的目录，开发者应编辑 playground 源文件；使用者复制出的项目可以直接编辑。
+使用 Node.js 22 或 24 LTS。目标目录必须不存在或为空；复制命令不会安装依赖。
 
-## 开始业务开发
+项目的 `vendor/` 保存组件库 tgz，`package.json` 使用相对 `file:` 依赖，移动整个项目后仍可独立安装。改用 npm 更新库时，在新项目执行 `npm install apptify@latest`。
 
-可以只删除以下两页，然后编写自己的页面：
+## 开始开发
 
-~~~text
-playground/views/index.vue
-playground/views/components.vue
-~~~
-
-文件路由从 playground/views/ 自动生成，不存在对这两页的硬导入。删除后重启开发服务即可；模板导航自动隐藏不存在的页面，品牌链接回到第一个保留的导航项，404 的“返回首页”在没有首页时回到设置。
-
-新页面例如 playground/views/orders.vue 会得到 /orders 路由。将入口加入 playground/App.vue 的 navigation 数组即可出现在顶部导航。自己的 index.vue 仍对应首页。生产服务器需把 history 路由请求回退到 index.html。
+| 位置 | 用途 |
+| --- | --- |
+| `src/App.vue` | 布局、导航项与账号入口 |
+| `src/views/` | 页面与自动生成的路由 |
+| `src/router/index.ts` | 滚动恢复、hash 定位与页面标题 |
+| `src/components/UserMenu.vue` | 账号菜单与登录/注册表单 |
+| `src/views/settings.vue` | 主题、动效与玻璃设置 |
+| `src/views/[...all].vue` | 404 页面 |
+| `src/style.css` | 应用样式 |
+| `public/images/` | 示例图片与来源说明 |
 
-删除组件总览后，ComponentDemo.vue、catalog.ts 和 components/ComponentIndex.vue 可以留着，也可按需删除；设置、账号、404 与布局不依赖它们。不需要清理库组件依赖或维护手写路由列表。
+可删除 `views/index.vue` 和 `views/components.vue`，再创建业务页面。删除后重启开发服务；导航会隐藏不存在的页面。删除组件总览后，可一并删除 `ComponentDemo.vue`、`catalog.ts` 和 `components/ComponentIndex.vue`。
 
-| 可编辑位置 | 用途 |
-| --- | --- |
-| playground/App.vue | 公共导航、品牌、账号入口和页面进入动效 |
-| playground/router/index.ts | 滚动恢复、hash 定位和页面标题 |
-| playground/components/UserMenu.vue | 账号菜单、登录/注册、邮箱验证码和忘记密码入口 |
-| playground/views/settings.vue | 外观、动效和玻璃偏好 |
-| playground/views/[...all].vue 与 components/not-found-paper-* | 404 页面与故事 |
-| playground/style.css | 应用布局与页面样式 |
-| public/images/ | 示例图片与来源说明 |
+例如 `src/views/orders.vue` 自动对应 `/orders`；在 `App.vue` 的 `navigation` 数组添加入口即可显示导航。`index.vue` 对应首页。
 
-账户操作仍是 UI 演示，需要接入使用者自己的后端。图片来源说明随模板保留在 public/images/SOURCES.md。
+组件通过 `apptify` 导入，样式通过 `apptify/style.css` 导入；`apptify/vite` 提供文件路由插件。已有项目接入时需安装 `vue-router` 和 `vite-plugin-pages`，模板已配置这些依赖。
 
-## 本地交付验证
+账号表单需要接入自己的后端。部署使用 history 路由，服务器需将页面请求回退到 `index.html`，保留 API 与静态资源路由。图片来源说明位于 `public/images/SOURCES.md`。
 
-在库仓库执行：
+## 检查与本地打包
 
-~~~sh
-npm run test:package
-~~~
+复制出的应用使用 `npm run typecheck` 和 `npm run build` 检查。
 
-此检查会构建原库消费者、生成真实 npm tarball、检查每份 playground 源码和静态资源都在包内，并在临时空目录安装包后调用复制命令。随后删除最初的安装目录，独立安装、类型检查、构建和启动复制项目，实测导航、图片、设置、登录及 404；再删除首页、组件总览及其可选演示文件，重复类型检查、构建和浏览器验证。原库消费测试仍单独执行。
+库开发者编辑原仓库的 `playground/`，打包时将其映射为模板的 `src/`。`npm pack` 自动构建组件库并准备模板；本地安装生成的 tgz 后，也可运行 `npx --no-install apptify-playground ../my-app`。
 
-source-snapshot.json 记录本次复制前各源码与资源的 SHA-256。构建前后与验收末尾都会比对库、模板、资源及配置；若用户在打包中途编辑，检查要求重新取最新快照，不会回写或恢复旧源码。命令打印临时目录与验收 JSON 路径，失败时也保留该目录用于检查。
+`npm run test:package` 验证包内容、独立安装、模板复制、类型检查、构建与浏览器交互，并检查删除示例页面后的行为。命令输出临时目录与验收结果路径。验证指定归档：
 
-已生成的具体 tgz 也可直接复验：运行 node tooling/test-playground-package.mjs /absolute/path/apptify-0.4.0.tgz。验收结果记录该文件 SHA-256，避免并行构建替换了被验证对象。
+```sh
+node tooling/test-playground-package.mjs /absolute/path/apptify-<version>.tgz
+```

package/docs/VALIDATION.md

@@ -10,7 +10,7 @@
 - WebKit 390px、触屏/移动视口模拟验证了输入、叠层弹窗、滚动锁、图片加载与翻页以及系统减少动态效果。
 - `npm run test:package`：TypeScript 检查、展示站构建、ESM 库构建、声明生成，以及通过包名 `apptify` 和 `apptify/style.css` 导入的独立消费示例均通过。消费者使用纯 JavaScript Options API，不要求 TypeScript。
 - `npm audit`：本次锁文件检查为 0 项已知漏洞。此结果仅代表当时的软件漏洞数据库。
-- 未发布到 npm；旧 tgz 是整改前版本，当前源码需重新 `npm pack`。演示图片不进入组件库安装包。
+- 此节为 2026-09-26 的历史记录。当前包已发布；模板与示例图片随包分发，最新源码需重新 `npm pack`。
 
 ## 回归修复
 

package/package.json

@@ -1,7 +1,15 @@
 {
   "name": "apptify",
-  "version": "0.5.0",
+  "version": "0.5.4",
   "description": "An Apple-inspired, responsive Vue 3 component library.",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/GARBAGELINUXGRAPHIC/apptify.git"
+  },
+  "homepage": "https://github.com/GARBAGELINUXGRAPHIC/apptify#readme",
+  "bugs": {
+    "url": "https://github.com/GARBAGELINUXGRAPHIC/apptify/issues"
+  },
   "type": "module",
   "license": "MIT",
   "files": [
@@ -34,6 +42,7 @@
     "test": "vitest run",
     "test:e2e": "playwright test",
     "test:package": "npm run prepack && vite build --config vite.consumer.config.ts && node tooling/test-playground-package.mjs",
+    "test:create": "node tooling/test-create-apptify.mjs",
     "preview": "vite preview --host 127.0.0.1",
     "prepare:playground": "node tooling/prepare-playground.mjs",
     "prepack": "node tooling/prepare-package.mjs"
@@ -52,8 +61,12 @@
   "devDependencies": {
     "@playwright/test": "^1.51.1",
     "@vitejs/plugin-vue": "^5.2.3",
+    "@vue/repl": "4.7.2",
     "@vue/test-utils": "^2.4.6",
+    "es-module-shims": "^2.8.4",
+    "esbuild": "^0.25.12",
     "jsdom": "^26.0.0",
+    "postcss": "^8.5.28",
     "typescript": "^5.8.2",
     "vite": "^6.3.4",
     "vite-plugin-pages": "^0.32.5",

package/templates/playground/README.md

@@ -1,17 +1,21 @@
-# Apptify 可编辑应用模板
+# Apptify 应用模板
 
-完整源码位于 playground/，静态图片与来源说明位于 public/images/。导航、账号/登录、设置、404 和页面动效均可直接编辑复用。
+可编辑的 Vue 应用，包含导航、账号表单、外观设置、404 与组件示例。建议 Node.js 22 或 24 LTS。
 
-通过 apptify-playground 复制命令创建时，vendor/ 包含本地组件库 tgz，package.json 使用相对 file: 依赖；移动整个项目后仍可独立安装。
+```sh
+npm install
+npm run dev
+```
 
-运行 npm install、npm run typecheck、npm run build；开发使用 npm run dev。请使用 Node.js 22 或 24 LTS。
+检查：`npm run typecheck`、`npm run build`。
 
-开始业务开发可直接删除 playground/views/index.vue 和 playground/views/components.vue，再添加自己的页面；文件路由自动生成，导航自动隐藏已删除页面，品牌链接回到第一个保留的导航页面。删除页面后重启开发服务。
+- 页面：`src/views/`，文件路由自动生成。
+- 布局与导航：`src/App.vue` 的 `navigation` 数组。
+- 账号表单：`src/components/UserMenu.vue`，需要接入自己的后端。
+- 样式：`src/style.css`；图片与来源：`public/images/`。
 
-导航项在 playground/App.vue 的 navigation 数组；页面文件在 playground/views/；布局和账号入口在 App.vue 与 playground/components/UserMenu.vue。
+可删除 `views/index.vue` 和 `views/components.vue`，再添加业务页面；删除后重启开发服务。删除组件总览后，可一并删除 `ComponentDemo.vue`、`catalog.ts` 和 `components/ComponentIndex.vue`。
 
-设置保留主题、动效与玻璃偏好。404 在 playground/views/[...all].vue；首页和组件总览没有被其他页面硬导入。ComponentDemo.vue、catalog.ts 和 ComponentIndex.vue 可以保留，也可在删除总览页后按需删除。
+复制命令在 `vendor/` 保存库归档，移动整个项目后仍可独立安装。使用 npm 更新库：`npm install apptify@latest`。手工复制模板时，将 `gitignore` 重命名为 `.gitignore`。
 
-登录、注册、忘记密码、邮箱验证码仍为 UI 演示入口，需要接入自己的后端。部署采用 history 路由，服务器应把未知页面路径回退到 index.html。
-
-若手工复制包内 templates/playground，先将 package.json 的 apptify 依赖替换为实际本地 tgz 路径，或安装自己的正式发布版本；当前项目尚未发布 npm。
+部署时将页面请求回退到 `index.html`，保留 API 与静态资源路由。

package/templates/playground/index.html

@@ -21,6 +21,6 @@
   </head>
   <body>
     <div id="app"></div>
-    <script type="module" src="/playground/main.ts"></script>
+    <script type="module" src="/src/main.ts"></script>
   </body>
 </html>

package/templates/playground/package.json

@@ -10,7 +10,7 @@
     "preview": "vite preview --host 127.0.0.1"
   },
   "dependencies": {
-    "apptify": "^0.5.0",
+    "apptify": "^0.5.4",
     "vue": "^3.5.0",
     "vue-router": "^4.6.4",
     "vuetify": "^3.9.0",
@@ -21,6 +21,10 @@
     "typescript": "^5.8.2",
     "vite": "^6.3.4",
     "vite-plugin-pages": "^0.32.5",
-    "vue-tsc": "^2.2.8"
+    "vue-tsc": "^2.2.8",
+    "@vue/repl": "4.7.2",
+    "es-module-shims": "^2.8.4",
+    "esbuild": "^0.25.12",
+    "postcss": "^8.5.28"
   }
 }

package/templates/playground/source-snapshot.json

@@ -1,24 +1,8 @@
 {
-  "createdAt": "2026-10-03T06:52:26.901Z",
-  "libraryVersion": "0.5.0",
+  "createdAt": "2026-10-04T09:39:13.558Z",
+  "libraryVersion": "0.5.4",
   "files": {
     "index.html": "75f6d93e3962ddca97a13b666a04d98ba9b263b6c288171383db764215034fea",
-    "playground/App.vue": "ef3f06f80758a3d4198ee90eb05f766a89b6156b4899fd566f8dca9b42e0ffc9",
-    "playground/ComponentDemo.vue": "0801a9eba5aa2e06f3bbd972b25647fed145ee6d630fd4d183eb016862f25ad4",
-    "playground/catalog.ts": "80b10ca45b18a611baec19361c70a967da655690c04091d23541192cd02fcecd",
-    "playground/components/ComponentIndex.vue": "2223f76786ef3dd1658fbb1ce29246e9bd155343d2e9bea9cb0674bc4a4ef879",
-    "playground/components/PageFooter.vue": "29c3ae396450c961aa13f3edc7d6b15f9dd12e95033242328fbe2093fb5ff0eb",
-    "playground/components/UserMenu.vue": "e584cc4c97c8e5a582be259f5aafc0ac355f4339133f6f572f079d979aa96c10",
-    "playground/components/not-found-paper-scene.vue": "39f12c23f04d72131d9da51e9a960894b621f2581c25e5b18463f7b458127209",
-    "playground/components/not-found-paper-story.ts": "b7c02528ce58080662f0e55bc4a6b11c170fc987b3b5e377ff7c0db8f77ddf10",
-    "playground/env.d.ts": "daae3800510e936d8308b7a9ebb0cb28d8f3fcd449e41386feea05d29bd12540",
-    "playground/main.ts": "efa30fb81f5c5f46ca21dc32a96fb08b32665b2d7de9d426e52c617662203285",
-    "playground/router/index.ts": "fe5f1c4b53f2f636bcb25727013b5cfb1e96bcadfd7f1a841537583fc98eccf5",
-    "playground/style.css": "940d33a07191f6143b1aef319bf7d09db479d2c0b3b3f6743a4362f8ea9c9e8b",
-    "playground/views/[...all].vue": "6d1cd2b7a67cc9e2b2935555633cda148dd81b5ca441bcb9b43029b8f719d3f9",
-    "playground/views/components.vue": "5edb34d2100f192d18fb7789a188b880c26daccad9597fe68d319927ac14e15a",
-    "playground/views/index.vue": "703fc1a39c31aaff17c8f6c69f418d455b9a16af5bb1b977403d77b09ef3f1e4",
-    "playground/views/settings.vue": "43e1074d8a17104ad88f72e7c7787a390b76e7948fa321b1c667e7ba41c9cae6",
     "public/images/SOURCES.md": "24ccb6625b1168e48550b7651e9fc20cb747324d87666d39199608c7db20541b",
     "public/images/airpods-max-orange.jpg": "f365fe9e374e2cede88f3e68487f6a773a767873978bcf20e4b21dee08aca966",
     "public/images/architecture.jpg": "928ea321954f0edabc1eed3c908c6b1fc93b247badcbd89d8dc5ba237420c26b",
@@ -31,21 +15,105 @@
     "public/images/mountains.jpg": "57aae81c2886f3404c582dd637ed325559616621466c027d2d1039bd918a213a",
     "public/images/snow.jpg": "59fec6d2bbf9df11b7c697c57a253b7bd4b5a097489ce1017fb5209b9ee54b8e",
     "public/images/sunset.jpg": "4ee91e88f1e341143a807ef48fdfc24d63aa045d99351b4ea8ad7efcfef6ef9b",
-    "public/images/waterfall.jpg": "cfd55ff5f41d3a58e91793d0e26a9ca90c86760aa401da033fbfa77d3364f238"
+    "public/images/waterfall.jpg": "cfd55ff5f41d3a58e91793d0e26a9ca90c86760aa401da033fbfa77d3364f238",
+    "src/App.vue": "1c794c9a04e5830cde04e2884a7ab3116e36283a9def63fc4d16cf9eea7151e0",
+    "src/ComponentDemo.vue": "0c3b65ad2bec0da36d01451b0fd2e4c4e6bdb34da0beb2f0b813427fa2eeaa3d",
+    "src/catalog.ts": "3aecd5190d37533ecd9427da3a2c9ed3b18b6f2f04a51c543ff88dfe52070e59",
+    "src/components/ComponentIndex.vue": "55c021899113b7fe26dcf42075f188a49d996e04a992ec9c86410eadc29e68a0",
+    "src/components/DirectoryDialog.vue": "ec6191422dad07dff2d710748a3f024bf7828be8b9b70fa16ab474f36ed878d2",
+    "src/components/PageFooter.vue": "5e9c1b4ba8866c05216993fb8d605fa826a09739a5ced15068b24334e4814fac",
+    "src/components/UserMenu.vue": "85e910f1de5815d23b2adb70a7ffba6a427f8d3bbdfd1cf6a203ace4035c67be",
+    "src/components/not-found-paper-scene.vue": "39f12c23f04d72131d9da51e9a960894b621f2581c25e5b18463f7b458127209",
+    "src/components/not-found-paper-story.ts": "b7c02528ce58080662f0e55bc4a6b11c170fc987b3b5e377ff7c0db8f77ddf10",
+    "src/editor/AppleInputExample.vue": "b563cdcb1ec6b033a3a19878f68e7fe4cf39da9d3e838887b591b2364e1aad90",
+    "src/editor/AppleInputPreview.vue": "e88a71316c62c4cb763d1f285b4b9fc8fbcb4a35c6282dc95b32d5824c87dc77",
+    "src/editor/ComponentDocumentLink.vue": "f4e1c88666b315a13e48386e9353c5da733fc149fba97ecc084804abd9d0067c",
+    "src/editor/ComponentWorkshop.vue": "0071a843cab7a8e25697c36755f911c8939c7657bd6264ec6c01a982da9f2647",
+    "src/editor/ConfigurableEditor.vue": "e2af7d67bdade43a31c9942bfca7d5d09e13883d0458582934bf85c29ae4e5e7",
+    "src/editor/LiveVueEditor.vue": "0559a63bba3dc2ffb2d54ad78e7b6c4577381280f3c08e1d3493e189fa6ff0d5",
+    "src/editor/apple-input-source.ts": "4092f61af0d77326a4e95213c9dc2e63afbe1e2d6e05b4854a04176e344538aa",
+    "src/editor/apple-input.ts": "54546ef9b04c991e3bedd7f718cd4b03855d0ef9a7449ad4459be615d080a141",
+    "src/editor/contract.ts": "0d39a03a7c20de6e214d91a68c67329e5dd3a62a79fd1f14475a41820a1e9443",
+    "src/editor/documents.ts": "22afdd9cc1b3388c34e8a4133f5aaa09369454503a477e95fc785bc63b91f3df",
+    "src/editor/input-playground.ts": "458ec5f8cb796b663d3d223cf018931b1f706f8f4836aa8a3c6dfce3add30d79",
+    "src/editor/runtime.ts": "09cd19ee9bf4f38a2f5bef013caae4f5ffd48677882550f19f2b9c266441faa9",
+    "src/editor/sections.ts": "614fecd6a895d6afb0e6d59cfb1e345317fa26bcc0aba916e0da2d164e82dd82",
+    "src/env.d.ts": "daae3800510e936d8308b7a9ebb0cb28d8f3fcd449e41386feea05d29bd12540",
+    "src/main.ts": "efa30fb81f5c5f46ca21dc32a96fb08b32665b2d7de9d426e52c617662203285",
+    "src/router/index.ts": "fe5f1c4b53f2f636bcb25727013b5cfb1e96bcadfd7f1a841537583fc98eccf5",
+    "src/style.css": "c952ec3900ee3952cc757e95e603abcfed62f7848eef02c9a03d30b32028e078",
+    "src/views/[...all].vue": "98797a9c353d390c7bf96da245feb9387e5e0cbec1a9f180ade457ae65c7484e",
+    "src/views/component-docs/[component].vue": "3f505550dacb1d8151417df61d0598940aa7d218518179e532ddc962b0632a5e",
+    "src/views/components.vue": "a19c4ca87a6a2ed43c4a6dc6eb52d3071733ce787024e1ab305db99b6acc6333",
+    "src/views/index.vue": "9afc860da88aebe4879668784da24c657ecba19e5bc3ddad9dbcdd72f84db245",
+    "src/views/settings.vue": "f5f9ca38f99d80fafab75fd33053715faa4265b998f32604af432497215a7c09",
+    "tooling/playground-editor.mjs": "128b1ffa1b5660b04f7652130d5474c1f31686c2c8e0e2866f1ebde2594d0b5b",
+    "tooling/prepare-input-source.mjs": "91bea35dcfa09735dbaeb5fbed7a70abfe447c3d133f4b4381e6ba0d0d4f9f6a"
+  },
+  "sourcePaths": {
+    "index.html": "index.html",
+    "public/images/SOURCES.md": "public/images/SOURCES.md",
+    "public/images/airpods-max-orange.jpg": "public/images/airpods-max-orange.jpg",
+    "public/images/architecture.jpg": "public/images/architecture.jpg",
+    "public/images/city.jpg": "public/images/city.jpg",
+    "public/images/coast.jpg": "public/images/coast.jpg",
+    "public/images/desert.jpg": "public/images/desert.jpg",
+    "public/images/food.jpg": "public/images/food.jpg",
+    "public/images/forest.jpg": "public/images/forest.jpg",
+    "public/images/lake.jpg": "public/images/lake.jpg",
+    "public/images/mountains.jpg": "public/images/mountains.jpg",
+    "public/images/snow.jpg": "public/images/snow.jpg",
+    "public/images/sunset.jpg": "public/images/sunset.jpg",
+    "public/images/waterfall.jpg": "public/images/waterfall.jpg",
+    "src/App.vue": "playground/App.vue",
+    "src/ComponentDemo.vue": "playground/ComponentDemo.vue",
+    "src/catalog.ts": "playground/catalog.ts",
+    "src/components/ComponentIndex.vue": "playground/components/ComponentIndex.vue",
+    "src/components/DirectoryDialog.vue": "playground/components/DirectoryDialog.vue",
+    "src/components/PageFooter.vue": "playground/components/PageFooter.vue",
+    "src/components/UserMenu.vue": "playground/components/UserMenu.vue",
+    "src/components/not-found-paper-scene.vue": "playground/components/not-found-paper-scene.vue",
+    "src/components/not-found-paper-story.ts": "playground/components/not-found-paper-story.ts",
+    "src/editor/AppleInputExample.vue": "playground/editor/AppleInputExample.vue",
+    "src/editor/AppleInputPreview.vue": "playground/editor/AppleInputPreview.vue",
+    "src/editor/ComponentDocumentLink.vue": "playground/editor/ComponentDocumentLink.vue",
+    "src/editor/ComponentWorkshop.vue": "playground/editor/ComponentWorkshop.vue",
+    "src/editor/ConfigurableEditor.vue": "playground/editor/ConfigurableEditor.vue",
+    "src/editor/LiveVueEditor.vue": "playground/editor/LiveVueEditor.vue",
+    "src/editor/apple-input-source.ts": "playground/editor/apple-input-source.ts",
+    "src/editor/apple-input.ts": "playground/editor/apple-input.ts",
+    "src/editor/contract.ts": "playground/editor/contract.ts",
+    "src/editor/documents.ts": "playground/editor/documents.ts",
+    "src/editor/input-playground.ts": "playground/editor/input-playground.ts",
+    "src/editor/runtime.ts": "playground/editor/runtime.ts",
+    "src/editor/sections.ts": "playground/editor/sections.ts",
+    "src/env.d.ts": "playground/env.d.ts",
+    "src/main.ts": "playground/main.ts",
+    "src/router/index.ts": "playground/router/index.ts",
+    "src/style.css": "playground/style.css",
+    "src/views/[...all].vue": "playground/views/[...all].vue",
+    "src/views/component-docs/[component].vue": "playground/views/component-docs/[component].vue",
+    "src/views/components.vue": "playground/views/components.vue",
+    "src/views/index.vue": "playground/views/index.vue",
+    "src/views/settings.vue": "playground/views/settings.vue",
+    "tooling/playground-editor.mjs": "tooling/playground-editor.mjs",
+    "tooling/prepare-input-source.mjs": "tooling/prepare-input-source.mjs"
   },
   "buildSources": {
-    "src/components/button.ts": "45db9f1488643ea03e6af5a090d6811fd815993f6ad5a5801cd9227394224439",
-    "src/components/content.ts": "e2206c834004ee7e099b2b9b4d7afe14b55a18c89569291ce44bc9a472d70f98",
-    "src/components/date-picker.ts": "130c127d4ab736e633b7eeaea5e9aa8937783391c690fe10479d90256b6930bd",
-    "src/components/forms.ts": "18cc26a711283a221c712e3c68791b5d1943240b954ca47b0a8525ae0c8598c5",
-    "src/components/foundation.ts": "671c6aa20cd2a253483f26d290a0080dba43c2656ae470dd5a84755a729bd1a4",
+    "src/components/AppleCard.vue": "b9de02769367840d8dfade7616e01d36c23744b6fabb9334e54b40223ae60134",
+    "src/components/button.ts": "affab78ead984c2d54511774758755a87e80ff6024faaf5027e82def40a2b940",
+    "src/components/content.ts": "a8110557a3aa9acef8c40e1b302d211ac2bf638af8d07e98f81d2ff8cf5c1a5d",
+    "src/components/date-picker.ts": "96f292972ca0deea95f91003d061b30df8213420d22e0a22203027ee373513ae",
+    "src/components/forms.ts": "9f006178836f71f2427f1883817a167bd799c14480ff0bc61cd808a72499ef2c",
+    "src/components/foundation.ts": "75f42e20f9deea3e7c6044f03a38486daee041651e86761880f76950df1f0347",
     "src/components/gallery-scrollbar.ts": "3763c0f05629fed9d8b82514339f768d305120b56308f8ae8a9460c9853719bb",
+    "src/components/link.ts": "f5d4acc163c205b4dfabffc62084e236aa4759f91b041367a8a4a185cca0a9e4",
     "src/components/mobile-image-viewer.ts": "66cecdf485a731c231823d1137cffc26c92cde45d94ef8def5b0bff070de48f4",
-    "src/components/motion.ts": "d294cc879e690e07358765e33e318cd4f427b17ac66cb5f1bf5848c9fc453419",
+    "src/components/motion.ts": "c8bd5928efe5cfeeae7486171e595a233603835620d009c5d1ffe611070fd0eb",
     "src/components/navibar.ts": "01c58cc6563273006ae91c43853283f60499de9fc88ba3a072ca64ef07f7eb2c",
-    "src/components/overlays.ts": "840bb7b1620d05beae767a2d6af9493f4e0dade8c098517d4260ca644221f3ba",
+    "src/components/overlays.ts": "09a6cbfd64000c1a0f30b87368f40aa5ebb31c66c0d818c60f77c340a60c2882",
     "src/components/tabs.ts": "a80fdf41efff49c2870859d6c0a97e5bbba69055706309acd5b53eafe8c02f9d",
-    "src/core/context.ts": "c96ccc6e75ac53b9461730dd61dd79952ca23004f08b1f9d199ca6478034fe4e",
+    "src/core/context.ts": "7ab1669799d0dc4abf30ce7d3ee069f7ad962bb30680bd99c82c787f10089fd9",
     "src/core/desktop-image-enter.ts": "6852f1a0a5d6cccfbe50509934729fea9e82ccd4c0cf9bdeda629eed2d9e3ef0",
     "src/core/desktop-image-return.ts": "cfb4e9fc6cea3cd8dd614b940345e5314b6e74f4748c6066ab1cc6b4c535fe08",
     "src/core/device.ts": "da97e64aa1a041d88c77818a836cee0e2401fb73a532bc173c2e19fa471ca97f",
@@ -53,34 +121,50 @@
     "src/core/image-geometry.ts": "6eb4d4e2a2afd078ccce010ec8aae32d89bf70a1e8c2c522b5e81040a97a1037",
     "src/core/image-motion.ts": "da1eded52a297332d314c9c1e27dc34ce031e07b6acce147ab2ae6eb9d7895d5",
     "src/core/layers.ts": "fe15fa50c82155e894f2e42a80340bd61bda2cfa4d3e9646a69f556c49fc5b04",
-    "src/core/motion.ts": "cb8b0cce9f4343cfc927466e21c3a315cf99df1e23380bfa10937b4caea62514",
-    "src/core/popup-motion.ts": "528f3a0d95eea5e63c4c2732b247eb71824c9fafc4d3a822b03d180a29902924",
-    "src/core/popup-placement.ts": "605138db77d9e1ebb9433281533ea607d9cead7689c6ea2596a9b20a277251d3",
+    "src/core/motion.ts": "00e87ecb6778797d3ff66e5426fba6a82e7725213c3b1ee8b395dd14e61b9b98",
+    "src/core/overlay-surface.ts": "4d2ac300dca02d158f4522369d97dc767068059439c18610c30a20876cd94e52",
+    "src/core/popup-motion.ts": "7d2d6a49660f2a0032cbac76af433251a042831a2653bff3de93715f369443d7",
+    "src/core/popup-placement.ts": "1a8ec6466aa641d1281800011ad22bad5f78c3053641ee18647a58e106034016",
     "src/core/preview-navigation.ts": "8de5cc0f62b16b0590f212de6f7bb234859ec483a612673a87dd8fe9e260a813",
     "src/index.ts": "75e2a540a1310aeda2e2eb64ffd8e1c93f83f2fab915f8f73432c4f554a67d55",
-    "src/styles/base.css": "02973e340575383182b378daabdbafcd7bc1e1191aea829ba11dc41010854547",
-    "src/styles/content.css": "3a57b7f24f5edb0245e8edba463f4a4fd5bd46fbe515d3332ba4eb708c4fb6f0",
-    "src/styles/date-picker.css": "a64396f52b95df206bca5c5a6f5d68777bc0b9426d08664998be23694727b2d7",
-    "src/styles/forms.css": "156dc5e5d43020abf3ca56f1d0b9898d4bf57e4a00588f6a764f69939b66b57b",
-    "src/styles/navibar.css": "56bf34300e3064e42cb0a0d35a2d6d4cc7ff5ba69740a6d1d6af55397fc555d6",
-    "src/styles/overlays.css": "7b975aa8b6796a9b2e051555807e834a399430397b8b8395c0b6b35af034d0ef",
+    "src/styles/base.css": "f124496025d4da23202b1025bf29b3231fe96268a3840ded4b00e1bf442abcaf",
+    "src/styles/content.css": "c38a3e24a4f297012145f226939c4c908608df8b72020b62c19827ad292c73d4",
+    "src/styles/date-picker.css": "932055e5f66794ce60f78f9c77f031683bd26b41864953b7686b22dbeb340f4f",
+    "src/styles/forms.css": "4474eb5482b7ad4e8601a7b6b8963068e87e1508b18522f314dd2a2bd3e4a42d",
+    "src/styles/navibar.css": "9324acda9cb31d442dd5e5ac70b013a53f552f526065a39a858eb40e9efa7c47",
+    "src/styles/overlays.css": "bb3d5f7bfc1b3e7a0ecf5ab4f632a65be3f496cb5de0e8c885bd6b6e5dc0f97a",
     "src/styles/ripple.css": "df0a5f661a862b5232bac256958f4bae6f555dd1f4a9c1432f61e85de71bdfea",
-    "playground/App.vue": "ef3f06f80758a3d4198ee90eb05f766a89b6156b4899fd566f8dca9b42e0ffc9",
-    "playground/ComponentDemo.vue": "0801a9eba5aa2e06f3bbd972b25647fed145ee6d630fd4d183eb016862f25ad4",
-    "playground/catalog.ts": "80b10ca45b18a611baec19361c70a967da655690c04091d23541192cd02fcecd",
-    "playground/components/ComponentIndex.vue": "2223f76786ef3dd1658fbb1ce29246e9bd155343d2e9bea9cb0674bc4a4ef879",
-    "playground/components/PageFooter.vue": "29c3ae396450c961aa13f3edc7d6b15f9dd12e95033242328fbe2093fb5ff0eb",
-    "playground/components/UserMenu.vue": "e584cc4c97c8e5a582be259f5aafc0ac355f4339133f6f572f079d979aa96c10",
+    "playground/App.vue": "1c794c9a04e5830cde04e2884a7ab3116e36283a9def63fc4d16cf9eea7151e0",
+    "playground/ComponentDemo.vue": "0c3b65ad2bec0da36d01451b0fd2e4c4e6bdb34da0beb2f0b813427fa2eeaa3d",
+    "playground/catalog.ts": "3aecd5190d37533ecd9427da3a2c9ed3b18b6f2f04a51c543ff88dfe52070e59",
+    "playground/components/ComponentIndex.vue": "55c021899113b7fe26dcf42075f188a49d996e04a992ec9c86410eadc29e68a0",
+    "playground/components/DirectoryDialog.vue": "ec6191422dad07dff2d710748a3f024bf7828be8b9b70fa16ab474f36ed878d2",
+    "playground/components/PageFooter.vue": "5e9c1b4ba8866c05216993fb8d605fa826a09739a5ced15068b24334e4814fac",
+    "playground/components/UserMenu.vue": "85e910f1de5815d23b2adb70a7ffba6a427f8d3bbdfd1cf6a203ace4035c67be",
     "playground/components/not-found-paper-scene.vue": "39f12c23f04d72131d9da51e9a960894b621f2581c25e5b18463f7b458127209",
     "playground/components/not-found-paper-story.ts": "b7c02528ce58080662f0e55bc4a6b11c170fc987b3b5e377ff7c0db8f77ddf10",
+    "playground/editor/AppleInputExample.vue": "b563cdcb1ec6b033a3a19878f68e7fe4cf39da9d3e838887b591b2364e1aad90",
+    "playground/editor/AppleInputPreview.vue": "e88a71316c62c4cb763d1f285b4b9fc8fbcb4a35c6282dc95b32d5824c87dc77",
+    "playground/editor/ComponentDocumentLink.vue": "f4e1c88666b315a13e48386e9353c5da733fc149fba97ecc084804abd9d0067c",
+    "playground/editor/ComponentWorkshop.vue": "0071a843cab7a8e25697c36755f911c8939c7657bd6264ec6c01a982da9f2647",
+    "playground/editor/ConfigurableEditor.vue": "e2af7d67bdade43a31c9942bfca7d5d09e13883d0458582934bf85c29ae4e5e7",
+    "playground/editor/LiveVueEditor.vue": "0559a63bba3dc2ffb2d54ad78e7b6c4577381280f3c08e1d3493e189fa6ff0d5",
+    "playground/editor/apple-input-source.ts": "4092f61af0d77326a4e95213c9dc2e63afbe1e2d6e05b4854a04176e344538aa",
+    "playground/editor/apple-input.ts": "54546ef9b04c991e3bedd7f718cd4b03855d0ef9a7449ad4459be615d080a141",
+    "playground/editor/contract.ts": "0d39a03a7c20de6e214d91a68c67329e5dd3a62a79fd1f14475a41820a1e9443",
+    "playground/editor/documents.ts": "22afdd9cc1b3388c34e8a4133f5aaa09369454503a477e95fc785bc63b91f3df",
+    "playground/editor/input-playground.ts": "458ec5f8cb796b663d3d223cf018931b1f706f8f4836aa8a3c6dfce3add30d79",
+    "playground/editor/runtime.ts": "09cd19ee9bf4f38a2f5bef013caae4f5ffd48677882550f19f2b9c266441faa9",
+    "playground/editor/sections.ts": "614fecd6a895d6afb0e6d59cfb1e345317fa26bcc0aba916e0da2d164e82dd82",
     "playground/env.d.ts": "daae3800510e936d8308b7a9ebb0cb28d8f3fcd449e41386feea05d29bd12540",
     "playground/main.ts": "efa30fb81f5c5f46ca21dc32a96fb08b32665b2d7de9d426e52c617662203285",
     "playground/router/index.ts": "fe5f1c4b53f2f636bcb25727013b5cfb1e96bcadfd7f1a841537583fc98eccf5",
-    "playground/style.css": "940d33a07191f6143b1aef319bf7d09db479d2c0b3b3f6743a4362f8ea9c9e8b",
-    "playground/views/[...all].vue": "6d1cd2b7a67cc9e2b2935555633cda148dd81b5ca441bcb9b43029b8f719d3f9",
-    "playground/views/components.vue": "5edb34d2100f192d18fb7789a188b880c26daccad9597fe68d319927ac14e15a",
-    "playground/views/index.vue": "703fc1a39c31aaff17c8f6c69f418d455b9a16af5bb1b977403d77b09ef3f1e4",
-    "playground/views/settings.vue": "43e1074d8a17104ad88f72e7c7787a390b76e7948fa321b1c667e7ba41c9cae6",
+    "playground/style.css": "c952ec3900ee3952cc757e95e603abcfed62f7848eef02c9a03d30b32028e078",
+    "playground/views/[...all].vue": "98797a9c353d390c7bf96da245feb9387e5e0cbec1a9f180ade457ae65c7484e",
+    "playground/views/component-docs/[component].vue": "3f505550dacb1d8151417df61d0598940aa7d218518179e532ddc962b0632a5e",
+    "playground/views/components.vue": "a19c4ca87a6a2ed43c4a6dc6eb52d3071733ce787024e1ab305db99b6acc6333",
+    "playground/views/index.vue": "9afc860da88aebe4879668784da24c657ecba19e5bc3ddad9dbcdd72f84db245",
+    "playground/views/settings.vue": "f5f9ca38f99d80fafab75fd33053715faa4265b998f32604af432497215a7c09",
     "public/images/SOURCES.md": "24ccb6625b1168e48550b7651e9fc20cb747324d87666d39199608c7db20541b",
     "public/images/airpods-max-orange.jpg": "f365fe9e374e2cede88f3e68487f6a773a767873978bcf20e4b21dee08aca966",
     "public/images/architecture.jpg": "928ea321954f0edabc1eed3c908c6b1fc93b247badcbd89d8dc5ba237420c26b",
@@ -94,18 +178,19 @@
     "public/images/snow.jpg": "59fec6d2bbf9df11b7c697c57a253b7bd4b5a097489ce1017fb5209b9ee54b8e",
     "public/images/sunset.jpg": "4ee91e88f1e341143a807ef48fdfc24d63aa045d99351b4ea8ad7efcfef6ef9b",
     "public/images/waterfall.jpg": "cfd55ff5f41d3a58e91793d0e26a9ca90c86760aa401da033fbfa77d3364f238",
-    "docs/COMPONENTS.md": "ca4a01cefaddd3e45a1cfdaef3bc0474fa6a831de9802fcd4c27e0926da00a70",
-    "docs/PLAYGROUND-TEMPLATE.md": "b8a418d940cb99c53dd7f95c4f44da2682dbaf03201ec7eccfe7234b198f1408",
-    "docs/VALIDATION.md": "fb73cf9a3ae78c87093c89627ad6fdd9edc516b87aefd7244849d731283a1d0f",
-    "README.md": "0a4838e51c0d6bd2269411176ad4dbb89293ec77c332e9ed95b0f7f66f07ca9f",
-    "package.json": "856dd5ba89db5b5ebe685f711f1c1851eb4869ffea94f860b5918325428c0f7f",
+    "docs/COMPONENTS.md": "5593cd13aa87ed60ccd9e7671260b9f5e6240d4fc9fc51c10521c21ad306909a",
+    "docs/INPUT-WORKSHOP.md": "82ea6db156d2d9be4cfee233675b107c837aaa30a849f92010e988e1df7ce3a0",
+    "docs/PLAYGROUND-TEMPLATE.md": "e476d6622e89d8cb04d9acdd54c090e5d559d666bb49f266bcf36d3f3bf8fe67",
+    "docs/VALIDATION.md": "3c1755f4699d6b7d8febb44b2b0b00eb416b86559c26d8b69e46a1c98271af5f",
+    "README.md": "95a66c9be54623335683af80d48e2415ae195e3797d624dfa69d042d6ea14958",
+    "package.json": "905ddd2741ce948047ae576fd6715f048cbda60218618617d703397c76df7d0b",
     "index.html": "75f6d93e3962ddca97a13b666a04d98ba9b263b6c288171383db764215034fea",
-    "vite.config.ts": "df2eae92f81c9b9007549de5721a2311dd9b918dea45a4c7b8b4979f247e49ae",
+    "vite.config.ts": "e2fee737d17c721cefaa33c955c6a7fcd47b46d51a95365768208eb16b608585",
     "vite.lib.config.ts": "f877c1772da70c9fed5174118ca36a0fc25fd46cce49b71280a5f91c4f8003a3",
     "tsconfig.json": "09590870bfbf6e90614d8a34af38b9a72902e8747ecd1a76be47ab24c842f9ea",
     "tsconfig.lib.json": "c885806b003cee01192cddcaf32df3e7c6d369e645360398aa088c14b1c4792f",
     "tooling/create-playground.mjs": "c45480c5982a64efd06f69dfb4620c65fd8ea35d01877b8574e7e2b30c095606",
-    "tooling/prepare-playground.mjs": "67e62e7e8bfd9a97f567474fe14e3776ce68166c97150c8d72509ba18efe4126",
+    "tooling/prepare-playground.mjs": "3a624b4966613a14e4f44a25555f25c564ea0fe69e5c68922c2ff5d21e1e2769",
     "tooling/prepare-package.mjs": "cf57a112eec798412e2a68089d1b2d25b984600d6ffef99397ec253abf2fca57"
   }
 }

package/templates/playground/{playground → src}/App.vue

@@ -11,6 +11,7 @@
         <component :is="Component" :key="route.path" />
       </div>
     </router-view>
+    <div class="site-footer"><PageFooter /></div>
   </apple-provider>
 </template>
 
@@ -20,6 +21,7 @@ import { useRoute, useRouter } from 'vue-router'
 import { useApple } from 'apptify'
 import { animateEntrance } from 'apptify'
 import UserMenu from './components/UserMenu.vue'
+import PageFooter from './components/PageFooter.vue'
 
 const router = useRouter()
 const route = useRoute()
@@ -41,12 +43,11 @@ function cancelEntrance() {
 function queueEntrance() {
   cancelEntrance()
   // Let the router restore the scroll position before animating the page.
-  // Animate the fixed sidebar itself so it shares the entrance without changing its containing block.
   entranceFrame = requestAnimationFrame(() => {
-    const targets = [routePage.value?.querySelector<HTMLElement>('main'), routePage.value?.querySelector<HTMLElement>('.sidebar')]
-    targets.forEach((element, index) => {
+    const targets = [routePage.value?.querySelector<HTMLElement>('main')]
+    targets.forEach(element => {
       if (!element) return
-      const animation = animateEntrance(element, index === 1 ? 'x' : 'y')
+      const animation = animateEntrance(element, 'y')
       if (animation) entrances.push(animation)
     })
   })

package/templates/playground/{playground → src}/ComponentDemo.vue

@@ -4,7 +4,7 @@
       <apple-button @click="notify('操作已完成')">继续</apple-button>
       <apple-button variant="secondary" @click="notify('已选择次要操作')">稍后再说</apple-button>
       <apple-button variant="outline" @click="notify('已加入收藏')">加入收藏</apple-button>
-      <apple-button variant="ghost" :icon="icons.ArrowUpRight" @click="notify('正在查看详情')">了解更多</apple-button>
+      <apple-link as="button" :icon="icons.ArrowUpRight" @click="notify('正在查看详情')">了解更多</apple-link>
       <apple-button :icon="icons.Plus" icon-only label="添加" @click="notify('已添加')" />
       <apple-button loading>处理中</apple-button><apple-button disabled>暂不可用</apple-button>
     </apple-stack>
@@ -43,12 +43,12 @@
     <apple-stack v-else-if="name === 'AppleGrid'">
       <apple-slider v-model="gridMin" label="最小列宽" :min="120" :max="320" :step="40" />
       <apple-grid :min="gridMin" :gap="16">
-        <div v-for="(section, index) in layoutItems" :key="section" class="demo-layout-tile"><span>0{{ index + 1 }}</span><strong>{{ section }}</strong></div>
+        <apple-card v-for="(section, index) in layoutItems" :key="section" class="demo-layout-tile"><span>0{{ index + 1 }}</span><strong>{{ section }}</strong></apple-card>
       </apple-grid>
     </apple-stack>
     <apple-card v-else-if="name === 'AppleCard'" class="demo-product" title="AirPods Max" subtitle="每个音符，都更动听。" eyebrow="声音，出类拔萃。">
       <apple-image :gallery="{ src: '/images/airpods-max-orange.jpg', alt: '橙色 AirPods Max 耳机' }" aspect-ratio="1" fit="contain" />
-      <template #actions><apple-button @click="notify('已加入购物袋')">加入购物袋</apple-button><apple-button variant="ghost" :icon="icons.Heart" icon-only label="收藏" @click="notify('已收藏')" /></template>
+      <template #actions><apple-button @click="notify('已加入购物袋')">加入购物袋</apple-button><apple-link as="button" :icon="icons.Heart" icon-only label="收藏" @click="notify('已收藏')" /></template>
     </apple-card>
     <apple-stack v-else-if="name === 'AppleImage'" class="demo-image">
       <apple-segmented-control v-model="imageLayout" :items="[{label:'省空间',value:'compact'},{label:'平铺',value:'tiled'},{label:'换行平铺',value:'tiled-wrap'}]" label="图片组布局" />
@@ -58,8 +58,8 @@
     </apple-stack>
     <apple-stack v-else-if="name === 'AppleAvatar'"><apple-slider v-model="avatarSize" label="头像尺寸" :min="24" :max="72" :step="8" /><apple-stack direction="row" align="center"><apple-avatar name="林初" :size="avatarSize" /><apple-avatar name="Alex" :size="avatarSize" /><apple-avatar name="Taylor" :size="avatarSize" square /></apple-stack></apple-stack>
     <apple-stack v-else-if="name === 'AppleAvatarGroup'"><apple-stepper v-model="avatarMax" label="显示人数" :min="1" :max="5" /><apple-avatar-group :items="people" :max="avatarMax" :size="44" label="设计团队" /></apple-stack>
-    <apple-stack v-else-if="name === 'AppleBadge'" direction="row" align="center"><apple-badge :value="unread"><apple-button variant="secondary" :icon="icons.Bell" @click="unread++">新消息</apple-button></apple-badge><apple-button variant="ghost" :disabled="!unread" @click="unread = 0">全部已读</apple-button></apple-stack>
-    <apple-stack v-else-if="name === 'AppleTag'" class="demo-tag-row" direction="row" align="center" :gap="10"><apple-tag>默认标签</apple-tag><apple-tag tone="success">已完成</apple-tag><apple-tag tone="info">进行中</apple-tag><apple-tag tone="warning">待确认</apple-tag><apple-tag v-if="tag" label="设计系统" closable @close="tag = false">设计系统</apple-tag><apple-button v-else variant="ghost" :icon="icons.Plus" @click="tag = true">添加标签</apple-button></apple-stack>
+    <apple-stack v-else-if="name === 'AppleBadge'" direction="row" align="center"><apple-badge :value="unread"><apple-link variant="secondary" :icon="icons.Bell" @click="unread++">新消息</apple-link></apple-badge><apple-link as="button" :disabled="!unread" @click="unread = 0">全部已读</apple-link></apple-stack>
+    <apple-stack v-else-if="name === 'AppleTag'" class="demo-tag-row" direction="row" align="center" :gap="10"><apple-tag>默认标签</apple-tag><apple-tag tone="success">已完成</apple-tag><apple-tag tone="info">进行中</apple-tag><apple-tag tone="warning">待确认</apple-tag><apple-tag v-if="tag" label="设计系统" closable @close="tag = false">设计系统</apple-tag><apple-link as="button" v-else :icon="icons.Plus" @click="tag = true">添加标签</apple-link></apple-stack>
     <apple-stack v-else-if="name === 'AppleDivider'"><apple-switch v-model="dividerVertical" label="纵向分隔" /><apple-stack :direction="dividerVertical ? 'row' : 'column'" :gap="0" align="center"><span>配送到家</span><apple-divider :vertical="dividerVertical" :label="dividerVertical ? undefined : '更多选择'" /><span>到店取货</span></apple-stack></apple-stack>
     <apple-input v-else-if="name === 'AppleInput'" v-model="text" label="姓名" placeholder="怎么称呼你" clearable />
     <apple-textarea v-else-if="name === 'AppleTextarea'" v-model="bio" label="个人简介" placeholder="写下你的想法" :maxlength="160" counter />
@@ -85,7 +85,7 @@
     <apple-form-field v-else-if="name === 'AppleFormField'" label="个人网站" :error="website && !website.startsWith('https://') ? '请输入以 https:// 开头的网址' : ''" hint="你的公开主页">
       <template #default="field"><input v-bind="field" v-model="website" class="apple-control" type="url" placeholder="https://example.com" /></template>
     </apple-form-field>
-    <apple-navibar v-else-if="name === 'AppleNavibar'" v-model="tab" brand="Apptify" :fixed="false" :items="tabs" label="示例导航"><template #actions><apple-button variant="ghost" :icon="icons.Bell" icon-only label="通知" @click="notify('暂无新通知')" /></template></apple-navibar>
+    <apple-navibar v-else-if="name === 'AppleNavibar'" v-model="tab" brand="Apptify" :fixed="false" :items="tabs" label="示例导航"><template #actions><apple-link as="button" :icon="icons.Bell" icon-only label="通知" @click="notify('暂无新通知')" /></template></apple-navibar>
     <apple-aside v-else-if="name === 'AppleAside'" :hide-on-preview="false" aria-label="示例侧栏"><apple-list v-model="setting" :items="settings" selectable /></apple-aside>
     <apple-tabs v-else-if="name === 'AppleTabs'" v-model="tab" :items="tabs"><template #default="{ value }"><p class="demo-copy">{{ value === 'overview' ? '这里是产品概览。' : value === 'spec' ? '这里是技术规格。' : '你的服务与支持。' }}</p></template></apple-tabs>
     <apple-tab-bar v-else-if="name === 'AppleTabBar'" v-model="tab" :items="tabs"><template #default="{ value }"><p class="demo-copy">{{ value === 'overview' ? '这里是产品概览。' : value === 'spec' ? '这里是技术规格。' : '你的服务与支持。' }}</p></template></apple-tab-bar>
@@ -96,7 +96,7 @@
     <apple-stack v-else-if="name === 'AppleTable'"><apple-switch v-model="virtualTable" label="虚拟滚动 · 5000 行" /><apple-table :columns="columns" :rows="virtualTable ? virtualRows : rows" selectable :virtual="virtualTable" :height="360" :page-size="virtualTable ? 0 : 3" /></apple-stack>
     <apple-tree v-else-if="name === 'AppleTree'" v-model="tree" :items="folders" />
     <apple-list v-else-if="name === 'AppleList'" v-model="setting" :items="settings" selectable @select="notify('已选择设置项')" />
-    <apple-stack v-else-if="name === 'AppleTimeline'"><apple-segmented-control v-model="timelineDirection" :items="[{label:'纵向',value:'vertical'},{label:'横向',value:'horizontal'}]" label="时间线方向" /><apple-timeline :items="events" :orientation="timelineDirection" /><apple-button variant="secondary" @click="updateDelivery">{{ delivered ? '查看配送过程' : '确认签收' }}</apple-button></apple-stack>
+    <apple-stack v-else-if="name === 'AppleTimeline'"><apple-segmented-control v-model="timelineDirection" :items="[{label:'纵向',value:'vertical'},{label:'横向',value:'horizontal'}]" label="时间线方向" /><apple-timeline :items="events" :orientation="timelineDirection" /><apple-link variant="secondary" @click="updateDelivery">{{ delivered ? '查看配送过程' : '确认签收' }}</apple-link></apple-stack>
     <apple-stack v-else-if="name === 'AppleStatistic'"><apple-segmented-control v-model="period" :items="periods" label="统计周期" /><apple-statistic :label="period === 'day' ? '今日访问' : period === 'week' ? '本周访问' : '本月访问'" :value="period === 'day' ? 428 : period === 'week' ? 2996 : 12840" suffix="次" description="最新访问数据" /></apple-stack>
     <apple-stack v-else-if="name === 'AppleDialog'" direction="row"><apple-button @click="openDialog">打开对话框</apple-button><apple-button variant="secondary" @click="openStack">多层对话框</apple-button></apple-stack>
     <template v-else-if="name === 'AppleDrawer'"><apple-button @click="drawer = true">打开抽屉</apple-button><apple-drawer v-model="drawer" title="偏好设置"><apple-stack><apple-switch v-model="checked" label="接收通知" /><apple-slider v-model="volume" label="音量" /></apple-stack></apple-drawer></template>
@@ -125,7 +125,7 @@
     <apple-pull-refresh v-else-if="name === 'ApplePullRefresh'" @refresh="refresh"><apple-list :items="[{label:'最新内容',value:'latest',description:refreshText},{label:'最近更新',value:'recent',description:'所有内容已同步'}]" /></apple-pull-refresh>
     <apple-infinite-scroll v-else-if="name === 'AppleInfiniteScroll'" :finished="itemsCount >= 12" @load="loadMore"><apple-list :items="Array.from({length:itemsCount}, (_, i) => ({label:`灵感收藏 ${i+1}`, value:i, description:'刚刚更新'}))" /></apple-infinite-scroll>
     <template v-else-if="name === 'AppleBackTop'"><apple-button :icon="icons.ArrowUp" variant="secondary" @click="toTop">回到顶部</apple-button><apple-back-top :threshold="0" :fixed="false" /></template>
-    <template v-else-if="name === 'AppleFloatingGroup'"><apple-button variant="secondary" @click="notify('快捷操作已就绪')">快捷操作</apple-button><apple-provider class="demo-floating-preview"><apple-floating-group :threshold="0"><apple-button icon-only :icon="icons.Plus" label="添加收藏" @click="notify('已加入收藏')" /><apple-button variant="secondary" icon-only :icon="icons.Bell" label="查看通知" @click="notify('暂无新通知')" /></apple-floating-group></apple-provider></template>
+    <template v-else-if="name === 'AppleFloatingGroup'"><apple-button variant="secondary" @click="notify('快捷操作已就绪')">快捷操作</apple-button><apple-card class="demo-floating-preview"><apple-provider><apple-floating-group :threshold="0" /></apple-provider></apple-card></template>
     <apple-stack v-else-if="name === 'AppleAutoSize'"><apple-switch v-model="checked" label="显示详情" /><apple-auto-size><apple-list :items="checked ? settings : settings.slice(0,1)" selectable /></apple-auto-size></apple-stack>
     <apple-stack v-else-if="name === 'AppleTransition'">
       <apple-segmented-control v-model="period" :items="periods" label="统计周期" />
@@ -135,7 +135,6 @@
         </apple-transition>
       </div>
     </apple-stack>
-    <apple-marquee v-else-if="name === 'AppleMarquee'" text="你的新设备已准备就绪，今天就开始探索更多可能。" />
   </div>
 </template>