apptify 0.2.0 → 0.5.0

package/templates/playground/public/images/SOURCES.md

@@ -0,0 +1,21 @@
+# Demo image sources
+
+These images are preview fixtures, not part of the npm library output.
+
+- `airpods-max-orange.jpg`: Apple official store CDN, https://store.storeimages.cdn-apple.com/1/as-images.apple.com/is/airpods-max-select-202409-orange?wid=800&hei=800&fmt=jpeg&qlt=85 . Product imagery belongs to Apple; replace with your own licensed assets for production distribution. This project is not affiliated with Apple.
+- `lake.jpg`: Unsplash, https://images.unsplash.com/photo-1470770841072-f978cf4d019e?auto=format&fit=crop&w=1200&q=85 . Demo landscape photo, retrieved 2026-09-26.
+
+Design references: https://www.apple.com/store/ and https://vuetifyjs.com/en/directives/ripple/ . No Apple fonts are bundled; system fonts are used.
+
+Additional AppleImage demo photos, retrieved 2026-10-02:
+
+- `mountains.jpg`: Unsplash, https://images.unsplash.com/photo-1464822759023-fed622ff2c3b?auto=format&fit=crop&w=1000&q=80 .
+- `forest.jpg`: Unsplash, https://images.unsplash.com/photo-1441974231531-c6227db76b6e?auto=format&fit=crop&w=800&h=1200&q=80 .
+- `coast.jpg`: Unsplash, https://images.unsplash.com/photo-1473116763249-2faaef81ccda?auto=format&fit=crop&w=1600&h=600&q=80 .
+- `desert.jpg`: Unsplash, https://images.unsplash.com/photo-1509316785289-025f5b846b35?auto=format&fit=crop&w=1000&h=750&q=80 .
+- `waterfall.jpg`: Unsplash, https://images.unsplash.com/photo-1432405972618-c60b0225b8f9?auto=format&fit=crop&w=700&h=1400&q=80 .
+- `sunset.jpg`: Unsplash, https://images.unsplash.com/photo-1472120435266-53107fd0c44a?auto=format&fit=crop&w=1200&h=500&q=80 .
+- `snow.jpg`: Unsplash, https://images.unsplash.com/photo-1418985991508-e47386d96a71?auto=format&fit=crop&w=900&h=1100&q=80 .
+- `city.jpg`: Unsplash, https://images.unsplash.com/photo-1480714378408-67cf0d13bc1b?auto=format&fit=crop&w=800&h=1000&q=80 .
+- `architecture.jpg`: Unsplash, https://images.unsplash.com/photo-1511818966892-d7d671e672a2?auto=format&fit=crop&w=700&h=1200&q=80 .
+- `food.jpg`: Unsplash, https://images.unsplash.com/photo-1504674900247-0877df9cc836?auto=format&fit=crop&w=1000&h=800&q=80 .

package/templates/playground/source-snapshot.json

@@ -0,0 +1,111 @@
+{
+  "createdAt": "2026-10-03T06:52:26.901Z",
+  "libraryVersion": "0.5.0",
+  "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",
+    "public/images/city.jpg": "2ff983f15a2116a169e0a77e841e546848951185d0be4cf1ba8983c350c05109",
+    "public/images/coast.jpg": "20fe6b79672be065307c3eed01d6a067969489c79baec35020a14a8f4cdecb3e",
+    "public/images/desert.jpg": "f2bcb6ee381cae278a29e89c3e1ea066bd34e885a0d3c08e856f994156cb546e",
+    "public/images/food.jpg": "9a36b1dacff2b9e7a1ebcdb14be714c17ee2d15d61de043faf178d5473753553",
+    "public/images/forest.jpg": "f57adf0b41247970af93cb4897fdfdf4bfe4f2004319ff905c912a419a43a1f6",
+    "public/images/lake.jpg": "26f1167b6c07e4d67cd90c469390ebb310bfa082a7d86e0e3758f616176378c7",
+    "public/images/mountains.jpg": "57aae81c2886f3404c582dd637ed325559616621466c027d2d1039bd918a213a",
+    "public/images/snow.jpg": "59fec6d2bbf9df11b7c697c57a253b7bd4b5a097489ce1017fb5209b9ee54b8e",
+    "public/images/sunset.jpg": "4ee91e88f1e341143a807ef48fdfc24d63aa045d99351b4ea8ad7efcfef6ef9b",
+    "public/images/waterfall.jpg": "cfd55ff5f41d3a58e91793d0e26a9ca90c86760aa401da033fbfa77d3364f238"
+  },
+  "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/gallery-scrollbar.ts": "3763c0f05629fed9d8b82514339f768d305120b56308f8ae8a9460c9853719bb",
+    "src/components/mobile-image-viewer.ts": "66cecdf485a731c231823d1137cffc26c92cde45d94ef8def5b0bff070de48f4",
+    "src/components/motion.ts": "d294cc879e690e07358765e33e318cd4f427b17ac66cb5f1bf5848c9fc453419",
+    "src/components/navibar.ts": "01c58cc6563273006ae91c43853283f60499de9fc88ba3a072ca64ef07f7eb2c",
+    "src/components/overlays.ts": "840bb7b1620d05beae767a2d6af9493f4e0dade8c098517d4260ca644221f3ba",
+    "src/components/tabs.ts": "a80fdf41efff49c2870859d6c0a97e5bbba69055706309acd5b53eafe8c02f9d",
+    "src/core/context.ts": "c96ccc6e75ac53b9461730dd61dd79952ca23004f08b1f9d199ca6478034fe4e",
+    "src/core/desktop-image-enter.ts": "6852f1a0a5d6cccfbe50509934729fea9e82ccd4c0cf9bdeda629eed2d9e3ef0",
+    "src/core/desktop-image-return.ts": "cfb4e9fc6cea3cd8dd614b940345e5314b6e74f4748c6066ab1cc6b4c535fe08",
+    "src/core/device.ts": "da97e64aa1a041d88c77818a836cee0e2401fb73a532bc173c2e19fa471ca97f",
+    "src/core/image-gallery-motion.ts": "0eab74e68687a930fa2501e7d23a63e83f0124bc5d9da55be541817f40ee2a33",
+    "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/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/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/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",
+    "public/images/city.jpg": "2ff983f15a2116a169e0a77e841e546848951185d0be4cf1ba8983c350c05109",
+    "public/images/coast.jpg": "20fe6b79672be065307c3eed01d6a067969489c79baec35020a14a8f4cdecb3e",
+    "public/images/desert.jpg": "f2bcb6ee381cae278a29e89c3e1ea066bd34e885a0d3c08e856f994156cb546e",
+    "public/images/food.jpg": "9a36b1dacff2b9e7a1ebcdb14be714c17ee2d15d61de043faf178d5473753553",
+    "public/images/forest.jpg": "f57adf0b41247970af93cb4897fdfdf4bfe4f2004319ff905c912a419a43a1f6",
+    "public/images/lake.jpg": "26f1167b6c07e4d67cd90c469390ebb310bfa082a7d86e0e3758f616176378c7",
+    "public/images/mountains.jpg": "57aae81c2886f3404c582dd637ed325559616621466c027d2d1039bd918a213a",
+    "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",
+    "index.html": "75f6d93e3962ddca97a13b666a04d98ba9b263b6c288171383db764215034fea",
+    "vite.config.ts": "df2eae92f81c9b9007549de5721a2311dd9b918dea45a4c7b8b4979f247e49ae",
+    "vite.lib.config.ts": "f877c1772da70c9fed5174118ca36a0fc25fd46cce49b71280a5f91c4f8003a3",
+    "tsconfig.json": "09590870bfbf6e90614d8a34af38b9a72902e8747ecd1a76be47ab24c842f9ea",
+    "tsconfig.lib.json": "c885806b003cee01192cddcaf32df3e7c6d369e645360398aa088c14b1c4792f",
+    "tooling/create-playground.mjs": "c45480c5982a64efd06f69dfb4620c65fd8ea35d01877b8574e7e2b30c095606",
+    "tooling/prepare-playground.mjs": "67e62e7e8bfd9a97f567474fe14e3776ce68166c97150c8d72509ba18efe4126",
+    "tooling/prepare-package.mjs": "cf57a112eec798412e2a68089d1b2d25b984600d6ffef99397ec253abf2fca57"
+  }
+}

package/templates/playground/tsconfig.json

@@ -0,0 +1,24 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "strict": true,
+    "jsx": "preserve",
+    "resolveJsonModule": true,
+    "esModuleInterop": true,
+    "lib": [
+      "ES2022",
+      "DOM",
+      "DOM.Iterable"
+    ],
+    "skipLibCheck": true,
+    "types": [
+      "vite/client"
+    ]
+  },
+  "include": [
+    "playground/**/*.ts",
+    "playground/**/*.vue"
+  ]
+}

package/templates/playground/vite.config.ts

@@ -0,0 +1,9 @@
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+import apptifyRoutes from 'apptify/vite'
+
+export default defineConfig({
+  plugins: [apptifyRoutes({ dirs: [{ dir: 'playground/views', baseRoute: '' }] }), vue()],
+  server: { host: '127.0.0.1' },
+  build: { outDir: 'dist' },
+})

package/tooling/create-playground.mjs

@@ -0,0 +1,35 @@
+#!/usr/bin/env node
+import { cp, mkdir, readFile, readdir, rename, writeFile } from 'node:fs/promises'
+import { resolve, join, sep } from 'node:path'
+import { fileURLToPath } from 'node:url'
+import { execFileSync } from 'node:child_process'
+
+const root = fileURLToPath(new URL('../', import.meta.url))
+const destination = process.argv[2]
+if (!destination || ['--help', '-h'].includes(destination)) {
+  console.log('Usage: apptify-playground <empty-directory>\nCopies the complete editable playground and a portable local library archive.\nThen run npm install and npm run dev in that directory.')
+  process.exit(destination ? 0 : 1)
+}
+try {
+  const target = resolve(destination)
+  const packageRoot = resolve(root)
+  if (target === packageRoot || target.startsWith(packageRoot + sep)) throw new Error('Destination must be outside the installed apptify package')
+  const existing = await readdir(target).catch(error => { if (error.code === 'ENOENT') return []; throw error })
+  if (existing.length) throw new Error('Destination must be empty: ' + target)
+  const template = join(root, 'templates/playground')
+  await readFile(join(template, 'package.json'))
+  await mkdir(target, { recursive: true })
+  await cp(template, target, { recursive: true })
+  await rename(join(target, 'gitignore'), join(target, '.gitignore'))
+  const vendor = join(target, 'vendor')
+  await mkdir(vendor)
+  const npm = process.platform === 'win32' ? 'npm.cmd' : 'npm'
+  const packed = JSON.parse(execFileSync(npm, ['pack', '--ignore-scripts', '--json', '--loglevel=error', '--pack-destination', vendor], { cwd: root, encoding: 'utf8' }))
+  const manifest = JSON.parse(await readFile(join(target, 'package.json'), 'utf8'))
+  manifest.dependencies.apptify = 'file:./vendor/' + packed[0].filename
+  await writeFile(join(target, 'package.json'), JSON.stringify(manifest, null, 2) + '\n')
+  console.log('Created ' + target + '\nNext: cd ' + JSON.stringify(target) + ' && npm install && npm run dev')
+} catch (error) {
+  console.error(error.message)
+  process.exitCode = 1
+}

package/tooling/prepare-package.mjs

@@ -0,0 +1,35 @@
+import assert from 'node:assert/strict'
+import { readFile, readdir, writeFile } from 'node:fs/promises'
+import { join, relative } from 'node:path'
+import { fileURLToPath } from 'node:url'
+import { createHash } from 'node:crypto'
+import { execFileSync } from 'node:child_process'
+
+const root = fileURLToPath(new URL('../', import.meta.url))
+async function sourceHashes() {
+  const files = {}
+  const record = async path => {
+    files[relative(root, path).replaceAll('\\', '/')] = createHash('sha256').update(await readFile(path)).digest('hex')
+  }
+  const directory = async path => {
+    for (const entry of await readdir(path, { withFileTypes: true })) {
+      if (entry.name === '.DS_Store') continue
+      const child = join(path, entry.name)
+      if (entry.isDirectory()) await directory(child)
+      else await record(child)
+    }
+  }
+  for (const name of ['src', 'playground', 'public', 'docs']) await directory(join(root, name))
+  for (const name of ['README.md', 'package.json', 'index.html', 'vite.config.ts', 'vite.lib.config.ts', 'tsconfig.json', 'tsconfig.lib.json', 'tooling/create-playground.mjs', 'tooling/prepare-playground.mjs', 'tooling/prepare-package.mjs']) await record(join(root, name))
+  return files
+}
+const before = await sourceHashes()
+const npm = process.platform === 'win32' ? 'npm.cmd' : 'npm'
+execFileSync(npm, ['run', 'build'], { cwd: root, stdio: 'inherit' })
+execFileSync(process.execPath, [join(root, 'tooling/prepare-playground.mjs')], { cwd: root, stdio: 'inherit' })
+assert.deepEqual(await sourceHashes(), before, 'Sources changed during the build; rerun packing to take the latest snapshot. No source file was restored.')
+const snapshotPath = join(root, 'templates/playground/source-snapshot.json')
+const snapshot = JSON.parse(await readFile(snapshotPath, 'utf8'))
+snapshot.buildSources = before
+await writeFile(snapshotPath, JSON.stringify(snapshot, null, 2) + '\n')
+console.log('Library build and editable template share the same source snapshot.')

package/tooling/prepare-playground.mjs

@@ -0,0 +1,90 @@
+import { cp, mkdir, readFile, readdir, rm, writeFile } from 'node:fs/promises'
+import { basename, join, relative } from 'node:path'
+import { fileURLToPath } from 'node:url'
+import { createHash } from 'node:crypto'
+
+const root = fileURLToPath(new URL('../', import.meta.url))
+const output = join(root, 'templates/playground')
+const library = JSON.parse(await readFile(join(root, 'package.json'), 'utf8'))
+await rm(output, { recursive: true, force: true })
+await mkdir(output, { recursive: true })
+const copyOptions = { recursive: true, filter: source => basename(source) !== '.DS_Store' }
+await cp(join(root, 'playground'), join(output, 'playground'), copyOptions)
+await cp(join(root, 'public'), join(output, 'public'), copyOptions)
+await cp(join(root, 'index.html'), join(output, 'index.html'))
+
+const snapshot = { createdAt: new Date().toISOString(), libraryVersion: library.version, files: {} }
+async function record(directory) {
+  for (const entry of await readdir(directory, { withFileTypes: true })) {
+    const path = join(directory, entry.name)
+    if (entry.isDirectory()) await record(path)
+    else snapshot.files[relative(output, path)] = createHash('sha256').update(await readFile(path)).digest('hex')
+  }
+}
+await record(output)
+await writeFile(join(output, 'source-snapshot.json'), JSON.stringify(snapshot, null, 2) + '\n')
+
+async function adapt(directory) {
+  for (const entry of await readdir(directory, { withFileTypes: true })) {
+    const path = join(directory, entry.name)
+    if (entry.isDirectory()) await adapt(path)
+    else if (/\.(vue|ts)$/.test(entry.name)) {
+      let source = await readFile(path, 'utf8')
+      source = source.replace(/(['"])(?:\.\.\/)+src(?:\/(?:index|core\/motion|core\/context|components\/content))?\1/g, "'apptify'")
+      if (/(['"])(?:\.\.\/)+src(?:\/[^'"]*)?\1/.test(source)) throw new Error('Unmapped private library import: ' + path)
+      if (entry.name === 'main.ts') source = "import 'apptify/style.css'\n" + source
+      if (path === join(output, 'playground/App.vue')) {
+        const navigationEnd = ']\n\nfunction navigate'
+        if (!source.includes(navigationEnd)) throw new Error('App navigation layout changed; update template adaptation')
+        source = source.replace('to="/" aria-label="Apptify 首页"', ':to="homePath" aria-label="Apptify 首页"')
+        source = source.replace(navigationEnd, "].filter(item => router.getRoutes().some(page => page.path === item.href))\nconst homePath = navigation[0]?.href ?? '/'\n\nfunction navigate")
+      }
+      if (path === join(output, 'playground/views/[...all].vue')) {
+        source = source.replace('to="/" custom', ':to="homePath" custom')
+        source = source.replace('const router = useRouter()', "const router = useRouter()\nconst homePath = router.getRoutes().some(page => page.path === '/') ? '/' : '/settings'")
+        source = source.replace("else void router.push('/')", 'else void router.push(homePath)')
+      }
+      await writeFile(path, source)
+    }
+  }
+}
+await adapt(join(output, 'playground'))
+const manifest = {
+  name: 'apptify-app', version: '0.0.0', private: true, type: 'module',
+  scripts: { dev: 'vite', typecheck: 'vue-tsc --noEmit', build: 'vue-tsc --noEmit && vite build', preview: 'vite preview --host 127.0.0.1' },
+  dependencies: {
+    apptify: '^' + library.version, vue: library.peerDependencies.vue,
+    'vue-router': library.devDependencies['vue-router'], vuetify: library.peerDependencies.vuetify,
+    'lucide-vue-next': library.dependencies['lucide-vue-next'],
+  },
+  devDependencies: Object.fromEntries(['@vitejs/plugin-vue', 'typescript', 'vite', 'vite-plugin-pages', 'vue-tsc'].map(name => [name, library.devDependencies[name]])),
+}
+await writeFile(join(output, 'package.json'), JSON.stringify(manifest, null, 2) + '\n')
+const tsconfig = JSON.parse(await readFile(join(root, 'tsconfig.json'), 'utf8'))
+tsconfig.include = ['playground/**/*.ts', 'playground/**/*.vue']
+await writeFile(join(output, 'tsconfig.json'), JSON.stringify(tsconfig, null, 2) + '\n')
+await writeFile(join(output, 'vite.config.ts'), [
+  "import { defineConfig } from 'vite'",
+  "import vue from '@vitejs/plugin-vue'",
+  "import apptifyRoutes from 'apptify/vite'",
+  '',
+  'export default defineConfig({',
+  "  plugins: [apptifyRoutes({ dirs: [{ dir: 'playground/views', baseRoute: '' }] }), vue()],",
+  "  server: { host: '127.0.0.1' },",
+  "  build: { outDir: 'dist' },",
+  '})', '',
+].join('\n'))
+// npm excludes .gitignore from tarballs; the copy command restores its dot.
+await writeFile(join(output, 'gitignore'), 'node_modules/\ndist/\n.env.local\n')
+await writeFile(join(output, 'README.md'), [
+  '# Apptify 可编辑应用模板', '',
+  '完整源码位于 playground/，静态图片与来源说明位于 public/images/。导航、账号/登录、设置、404 和页面动效均可直接编辑复用。', '',
+  '通过 apptify-playground 复制命令创建时，vendor/ 包含本地组件库 tgz，package.json 使用相对 file: 依赖；移动整个项目后仍可独立安装。', '',
+  '运行 npm install、npm run typecheck、npm run build；开发使用 npm run dev。请使用 Node.js 22 或 24 LTS。', '',
+  '开始业务开发可直接删除 playground/views/index.vue 和 playground/views/components.vue，再添加自己的页面；文件路由自动生成，导航自动隐藏已删除页面，品牌链接回到第一个保留的导航页面。删除页面后重启开发服务。', '',
+  '导航项在 playground/App.vue 的 navigation 数组；页面文件在 playground/views/；布局和账号入口在 App.vue 与 playground/components/UserMenu.vue。', '',
+  '设置保留主题、动效与玻璃偏好。404 在 playground/views/[...all].vue；首页和组件总览没有被其他页面硬导入。ComponentDemo.vue、catalog.ts 和 ComponentIndex.vue 可以保留，也可在删除总览页后按需删除。', '',
+  '登录、注册、忘记密码、邮箱验证码仍为 UI 演示入口，需要接入自己的后端。部署采用 history 路由，服务器应把未知页面路径回退到 index.html。', '',
+  '若手工复制包内 templates/playground，先将 package.json 的 apptify 依赖替换为实际本地 tgz 路径，或安装自己的正式发布版本；当前项目尚未发布 npm。', '',
+].join('\n'))
+console.log('Prepared editable playground template: ' + output)

package/tooling/test-playground-package.mjs

@@ -0,0 +1,188 @@
+import assert from 'node:assert/strict'
+import { cp, mkdir, mkdtemp, readFile, rm, writeFile } from 'node:fs/promises'
+import { join, resolve } from 'node:path'
+import { tmpdir } from 'node:os'
+import { createHash } from 'node:crypto'
+import { execFileSync, spawn } from 'node:child_process'
+import { fileURLToPath } from 'node:url'
+import { chromium } from '@playwright/test'
+
+const root = fileURLToPath(new URL('../', import.meta.url))
+const scratch = await mkdtemp(join(tmpdir(), 'apptify-package-'))
+const npm = process.platform === 'win32' ? 'npm.cmd' : 'npm'
+const run = (args, cwd = root) => execFileSync(npm, args, { cwd, stdio: 'inherit', timeout: 240_000 })
+console.log('Package acceptance workspace: ' + scratch)
+const archiveInput = process.argv[2] ? resolve(process.argv[2]) : undefined
+const archiveSha256 = archiveInput ? createHash('sha256').update(await readFile(archiveInput)).digest('hex') : undefined
+const packArgs = ['pack', '--ignore-scripts', '--json', '--loglevel=error', '--pack-destination', scratch]
+if (archiveInput) packArgs.push(archiveInput)
+const packed = JSON.parse(execFileSync(npm, packArgs, { cwd: root, encoding: 'utf8' }))[0]
+const contents = new Set(packed.files.map(file => file.path))
+const snapshot = archiveInput
+  ? JSON.parse(execFileSync('tar', ['-xOf', join(scratch, packed.filename), 'package/templates/playground/source-snapshot.json'], { encoding: 'utf8' }))
+  : JSON.parse(await readFile(join(root, 'templates/playground/source-snapshot.json'), 'utf8'))
+for (const path of Object.keys(snapshot.files)) assert(contents.has('templates/playground/' + path), 'Missing template file: ' + path)
+for (const path of ['package.json', 'vite.config.ts', 'tsconfig.json', 'README.md', 'gitignore', 'source-snapshot.json']) {
+  assert(contents.has('templates/playground/' + path), 'Missing template configuration: ' + path)
+}
+assert(contents.has('tooling/create-playground.mjs'))
+assert(contents.has('dist/apptify.js'))
+assert(contents.has('dist/apptify.css'))
+console.log('Pack manifest includes every playground source and public resource (' + Object.keys(snapshot.files).length + ' files).')
+
+const installer = join(scratch, 'installer')
+await mkdir(installer)
+await writeFile(join(installer, 'package.json'), '{"name":"template-installer","private":true,"type":"module"}\n')
+run(['install', '--ignore-scripts', '--no-audit', '--no-fund', join(scratch, packed.filename)], installer)
+const app = join(scratch, 'editable-app')
+const cli = join(installer, 'node_modules/apptify/tooling/create-playground.mjs')
+run(['exec', '--offline', '--', 'apptify-playground', app], installer)
+let refused = false
+try { execFileSync(process.execPath, [cli, app], { cwd: installer, stdio: 'pipe' }) } catch { refused = true }
+assert(refused, 'Copy command must not overwrite a nonempty directory')
+// Remove the installation used to invoke the command: the copied app must be portable.
+await rm(installer, { recursive: true, force: true })
+const appManifest = JSON.parse(await readFile(join(app, 'package.json'), 'utf8'))
+assert(appManifest.dependencies.apptify.startsWith('file:./vendor/'))
+assert((await readFile(join(app, '.gitignore'), 'utf8')).includes('node_modules/'))
+for (const [path, hash] of Object.entries(snapshot.files)) {
+  if (path.startsWith('public/')) assert.equal(createHash('sha256').update(await readFile(join(app, path))).digest('hex'), hash)
+}
+run(['install', '--no-audit', '--no-fund'], app)
+run(['run', 'typecheck'], app)
+run(['run', 'build'], app)
+
+// Verify the packed library's original consumer, without repository aliases.
+const consumer = join(app, 'library-consumer')
+await cp(join(root, 'tests/consumer'), consumer, { recursive: true })
+await writeFile(join(consumer, 'vite.config.ts'), [
+  "import { defineConfig } from 'vite'",
+  "import vue from '@vitejs/plugin-vue'",
+  "import apptifyRoutes from 'apptify/vite'",
+  "import { fileURLToPath } from 'node:url'",
+  "export default defineConfig({ root: fileURLToPath(new URL('.', import.meta.url)), plugins: [apptifyRoutes(), vue()], build: { outDir: 'dist' } })", '',
+].join('\n'))
+execFileSync(process.execPath, [join(app, 'node_modules/vite/bin/vite.js'), 'build', '--config', join(consumer, 'vite.config.ts')], { cwd: app, stdio: 'inherit' })
+const hasConsumerTypes = await readFile(join(consumer, 'image-api-types.ts')).then(() => true).catch(error => { if (error.code === 'ENOENT') return false; throw error })
+if (hasConsumerTypes) {
+  await writeFile(join(consumer, 'tsconfig.json'), JSON.stringify({ extends: '../tsconfig.json', include: ['image-api-types.ts'] }, null, 2) + '\n')
+  execFileSync(process.execPath, [join(app, 'node_modules/vue-tsc/bin/vue-tsc.js'), '--noEmit', '-p', join(consumer, 'tsconfig.json')], { cwd: app, stdio: 'inherit' })
+}
+
+async function serve() {
+  const child = spawn(npm, ['run', 'dev', '--', '--host', '127.0.0.1', '--port', '0', '--strictPort'], { cwd: app, stdio: ['ignore', 'pipe', 'pipe'], detached: process.platform !== 'win32' })
+  const stop = () => {
+    if (process.platform !== 'win32') { try { process.kill(-child.pid, 'SIGTERM') } catch {} }
+    else child.kill('SIGTERM')
+  }
+  let output = ''
+  const url = await new Promise((resolve, reject) => {
+    const timer = setTimeout(() => reject(new Error('Dev server did not start: ' + output)), 20_000)
+    const collect = chunk => {
+      output += chunk
+      const match = output.replace(/\x1B\[[0-?]*[ -/]*[@-~]/g, '').match(/http:\/\/127\.0\.0\.1:\d+\//)
+      if (match) { clearTimeout(timer); resolve(match[0]) }
+    }
+    child.stdout.on('data', collect)
+    child.stderr.on('data', collect)
+    child.once('exit', code => { clearTimeout(timer); reject(new Error('Dev server exited ' + code + ': ' + output)) })
+  }).catch(error => { stop(); throw error })
+  return { url, stop }
+}
+
+const browser = await chromium.launch({ channel: 'chrome' })
+const errors = []
+async function settledScreenshot(page, name) {
+  await page.evaluate(async () => { await new Promise(requestAnimationFrame); await new Promise(requestAnimationFrame) })
+  await page.waitForFunction(() => !document.getAnimations().some(animation => animation.playState === 'running' && Number.isFinite(Number(animation.effect?.getComputedTiming().endTime))))
+  await page.screenshot({ path: join(scratch, name) })
+}
+async function checkPage(baseURL, path, check) {
+  const page = await browser.newPage()
+  page.on('pageerror', error => errors.push(error.message))
+  await page.goto(new URL(path, baseURL).href)
+  await check(page)
+  assert(await page.evaluate(() => document.documentElement.scrollWidth <= innerWidth), 'Page overflow: ' + path)
+  await page.close()
+}
+let server
+try {
+  server = await serve()
+  await checkPage(server.url, '/', async page => {
+    await page.locator('.site-nav').waitFor()
+    await page.locator('main').waitFor()
+    await page.locator('.site-nav').getByRole('link', { name: '设置', exact: true }).click()
+    await page.waitForURL(new URL('/settings', server.url).href)
+    await page.goBack()
+    await page.waitForURL(server.url)
+    await settledScreenshot(page, 'complete-home.png')
+  })
+  await checkPage(server.url, '/components', async page => {
+    const image = page.locator('#apple-image img').first()
+    await image.scrollIntoViewIfNeeded()
+    assert.equal(await image.evaluate(async image => { await image.decode(); return image.naturalWidth > 0 }), true)
+    await page.locator('.component-index [aria-current]').first().waitFor()
+  })
+  await checkPage(server.url, '/settings', async page => {
+    await page.setViewportSize({ width: 320, height: 900 })
+    await page.getByRole('button', { name: '深色', exact: true }).click()
+    await page.getByRole('slider', { name: '玻璃不透明度', exact: true }).waitFor()
+    await page.getByRole('button', { name: '打开用户菜单', exact: true }).click()
+    await page.getByRole('button', { name: /登录 Login/ }).click()
+    await page.getByLabel('电子邮箱', { exact: true }).fill('template@example.com')
+    await page.getByLabel('密码', { exact: true }).fill('template-password')
+    assert.equal(await page.locator('.user-auth-form input[type=password]').count(), 1)
+    await settledScreenshot(page, 'settings-login-320.png')
+  })
+  await checkPage(server.url, '/template-missing-page', async page => {
+    await page.emulateMedia({ reducedMotion: 'reduce' })
+    await page.getByRole('heading', { name: '页面不存在', exact: true }).waitFor()
+    await page.locator('.paper-scene__art').waitFor()
+    await settledScreenshot(page, '404-current.png')
+    await page.getByRole('link', { name: '返回首页', exact: true }).click()
+    await page.waitForURL(server.url)
+  })
+  for (const path of Object.keys(snapshot.files).filter(path => path.startsWith('public/'))) {
+    const response = await fetch(new URL(path.slice('public/'.length), server.url))
+    assert.equal(response.status, 200, 'Missing served resource: ' + path)
+    assert.equal(createHash('sha256').update(Buffer.from(await response.arrayBuffer())).digest('hex'), snapshot.files[path])
+  }
+  server.stop()
+  server = undefined
+
+  await rm(join(app, 'playground/views/index.vue'))
+  await rm(join(app, 'playground/views/components.vue'))
+  // These files only served the removed overview page. Deleting them must be optional.
+  await rm(join(app, 'playground/ComponentDemo.vue'))
+  await rm(join(app, 'playground/catalog.ts'))
+  await rm(join(app, 'playground/components/ComponentIndex.vue'))
+  run(['run', 'typecheck'], app)
+  run(['run', 'build'], app)
+  server = await serve()
+  await checkPage(server.url, '/settings', async page => {
+    assert.equal(await page.locator('.site-nav a.apple-navibar__item').count(), 1)
+    assert.equal(await page.locator('.site-nav .brand').getAttribute('href'), '/settings')
+    await page.getByRole('button', { name: '打开用户菜单', exact: true }).click()
+    await page.getByRole('dialog', { name: '用户菜单', exact: true }).waitFor()
+    await settledScreenshot(page, 'reduced-settings.png')
+  })
+  await checkPage(server.url, '/new-business-page', async page => {
+    await page.getByRole('heading', { name: '页面不存在', exact: true }).waitFor()
+    assert.equal(await page.getByRole('link', { name: '返回首页', exact: true }).getAttribute('href'), '/settings')
+    await page.getByRole('link', { name: '返回首页', exact: true }).click()
+    await page.waitForURL(new URL('/settings', server.url).href)
+  })
+  assert.deepEqual(errors, [], 'Browser runtime errors')
+} finally {
+  server?.stop()
+  await browser.close()
+}
+for (const [path, hash] of Object.entries(snapshot.files)) {
+  assert.equal(createHash('sha256').update(await readFile(join(root, path))).digest('hex'), hash, 'Source changed during packing; rerun for its latest snapshot: ' + path)
+}
+for (const [path, hash] of Object.entries(snapshot.buildSources || {})) {
+  assert.equal(createHash('sha256').update(await readFile(join(root, path))).digest('hex'), hash, 'Build source changed after this archive was created; pack the latest version: ' + path)
+}
+if (archiveInput) assert.equal(createHash('sha256').update(await readFile(archiveInput)).digest('hex'), archiveSha256, 'Archive was overwritten during acceptance')
+await writeFile(join(scratch, 'acceptance.json'), JSON.stringify({ package: packed.filename, archiveInput, archiveSha256, packageBytes: packed.size, packageFileCount: packed.files.length, templateSourceFiles: Object.keys(snapshot.files).length, completeTemplate: true, removedDemoPages: true, libraryConsumer: true, libraryConsumerTypes: hasConsumerTypes, browserErrors: errors, nodeVersion: process.version, sourceSnapshot: snapshot }, null, 2) + '\n')
+console.log('Complete editable template, reduced app, routes/resources/account/settings/404, and packed library consumer all passed.\nEvidence: ' + scratch)

package/tooling/vite.d.ts

@@ -0,0 +1,5 @@
+import type { Plugin } from 'vite'
+import type { UserOptions } from 'vite-plugin-pages'
+
+/** Generates Vue routes from src/views by default. */
+export default function apptifyRoutes(options?: Omit<UserOptions, 'resolver'>): Plugin

package/tooling/vite.js

@@ -0,0 +1,10 @@
+import Pages from 'vite-plugin-pages'
+
+/** File routing with the same src/views convention as vuetify-project. */
+export default function apptifyRoutes(options = {}) {
+  return Pages({
+    dirs: [{ dir: 'src/views', baseRoute: '' }],
+    ...options,
+    resolver: 'vue',
+  })
+}