{"_id":"@apigo.cc/base","_rev":"13-635ca41aefec2189dd4eac3ddfb15e4e","name":"@apigo.cc/base","dist-tags":{"latest":"1.0.24"},"versions":{"1.0.7":{"name":"@apigo.cc/base","version":"1.0.7","_id":"@apigo.cc/base@1.0.7","maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"dist":{"shasum":"e42e2499c01a501098bbaecdf352ef05dda8d85e","tarball":"https://registry.npmjs.org/@apigo.cc/base/-/base-1.0.7.tgz","fileCount":4,"integrity":"sha512-SQD63FM+tHpgaXcFw14F/Vo9iWNzs5fVffKns3xwTFKfd7uNmZPZfzdfxChF8j5Vprm+CkK/D+Vt58Y79zHZuA==","signatures":[{"sig":"MEQCIC97+Ufho/R7VIRG1ZXTsuZgKjYrmXeg3HYwR5VxKnhAAiAL3pTcWO6RPg+fevT/ELmOhtCum0MKkeOTZ19OZurJ9A==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":94704},"main":"dist/base.js","type":"module","module":"dist/base.js","gitHead":"41d0745441a9e1b32e85b76686e9c8d4f9783ecd","scripts":{"dev":"vite","test":"playwright test","build":"vite build","publish":"node scripts/publish.js"},"_npmUser":{"name":"star3s","email":"isstar3@126.com"},"_npmVersion":"10.7.0","description":"`@web/base` 是基于 State.js 构建的高性能 Web 基础组件库。它采用**原生 ESM、零打包**架构，深度集成 Bootstrap 5，旨在为 AI 驱动的开发提供极致精简且功能完备的 UI 与逻辑基建。","directories":{},"_nodeVersion":"20.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","terser":"^5.47.1","@playwright/test":"^1.40.0","@rollup/plugin-terser":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/base_1.0.7_1780404014983_0.05377313555270047","host":"s3://npm-registry-packages-npm-production"}},"1.0.8":{"name":"@apigo.cc/base","version":"1.0.8","_id":"@apigo.cc/base@1.0.8","maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"dist":{"shasum":"9e7db26f0aab2d71cb1475936ce17ed221ae08db","tarball":"https://registry.npmjs.org/@apigo.cc/base/-/base-1.0.8.tgz","fileCount":4,"integrity":"sha512-3q2wU7liXwVXjTH65fOKFk/aHYqEEZH1vKrr/DEkMZPtpLpZgirSyovkriF9TNOwdZAGx8uaunmg59lYOFilKA==","signatures":[{"sig":"MEQCIAtFVlo1vjJQ35opxa+pWgpxnf2doMZMpp+pAOpipW2LAiB11UvbxPn2vOOMjKclWOcNgOM9W2oRN+in7MZYC7Uh8w==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":96404},"main":"dist/base.js","type":"module","module":"dist/base.js","gitHead":"48eb3e1311ac492e9d0d8c61a8f165fd64d09388","scripts":{"dev":"vite","pub":"node scripts/publish.js","test":"playwright test","build":"vite build"},"_npmUser":{"name":"star3s","email":"isstar3@126.com"},"_npmVersion":"10.7.0","description":"`@apigo.cc/base` 是基于 State.js 构建的高性能 Web 基础组件库。它采用**原生 ESM、零打包**架构，深度集成 Bootstrap 5，旨在为 AI 驱动的开发提供极致精简且功能完备的 UI 与逻辑基建。","directories":{},"_nodeVersion":"20.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","terser":"^5.47.1","@playwright/test":"^1.40.0","@rollup/plugin-terser":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/base_1.0.8_1780572408605_0.77571647720531","host":"s3://npm-registry-packages-npm-production"}},"1.0.11":{"name":"@apigo.cc/base","version":"1.0.11","_id":"@apigo.cc/base@1.0.11","maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"dist":{"shasum":"68d4ac71c78b1724a148c7e85b5a9ad0668da40d","tarball":"https://registry.npmjs.org/@apigo.cc/base/-/base-1.0.11.tgz","fileCount":4,"integrity":"sha512-zpyPUC4Il1tkkk7FvmnJchhIKQhYrf0PPVJ0KpfEK5Il5M7QPStlDpYMGI6yZGZSXn/1XX6THCCKxmD4zdKjdQ==","signatures":[{"sig":"MEYCIQCmD7faBXNGktSXq3AshMHCALyTKzP8MISLQeIKeVv2CAIhAM80TG/vcpg7t9BlIogsyAdwYSZNZ4c7fvPbZRHqqE+w","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":107965},"main":"dist/base.js","type":"module","gitHead":"251bb617e52b2620c832a756c1696961a601726b","scripts":{"dev":"vite","pub":"node scripts/publish.js","test":"playwright test","build":"vite build"},"_npmUser":{"name":"star3s","email":"isstar3@126.com"},"_npmVersion":"10.7.0","description":"本库是基于 `@apigo.cc/state` 增强的 UI 原子库，提供遵循 Bootstrap 5.3 规范的高阶业务组件。","directories":{},"_nodeVersion":"20.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","terser":"^5.47.1","@playwright/test":"^1.40.0","@rollup/plugin-terser":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/base_1.0.11_1780926989556_0.2711985774293666","host":"s3://npm-registry-packages-npm-production"}},"1.0.13":{"name":"@apigo.cc/base","version":"1.0.13","_id":"@apigo.cc/base@1.0.13","maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"dist":{"shasum":"a87297fdf2944aa8178fcee1d7fbecb9afa0ff72","tarball":"https://registry.npmjs.org/@apigo.cc/base/-/base-1.0.13.tgz","fileCount":4,"integrity":"sha512-/4BDlAzPnEKvyNk6nFAm4rBopKakTXhfSLQmT5lkve6bmsug/eqKtGxGDqcAC+/UQhRH5PZx1k8GEKZdVROQrw==","signatures":[{"sig":"MEQCIG8SF9LOdaRlRUZOZy2SBdGvWp4xWZrJjngK37fSAQoEAiB0Hxr7xzp5eAPGvAXq1dwsdCN4DLw0VTlYXTlEQGXVZA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":107965},"main":"dist/base.js","type":"module","gitHead":"251bb617e52b2620c832a756c1696961a601726b","scripts":{"dev":"vite","pub":"node scripts/publish.js","test":"playwright test","build":"vite build"},"_npmUser":{"name":"star3s","email":"isstar3@126.com"},"_npmVersion":"10.7.0","description":"本库是基于 `@apigo.cc/state` 增强的 UI 原子库，提供遵循 Bootstrap 5.3 规范的高阶业务组件。","directories":{},"_nodeVersion":"20.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","terser":"^5.47.1","@playwright/test":"^1.40.0","@rollup/plugin-terser":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/base_1.0.13_1780927029104_0.4192501919113487","host":"s3://npm-registry-packages-npm-production"}},"1.0.14":{"name":"@apigo.cc/base","version":"1.0.14","_id":"@apigo.cc/base@1.0.14","maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"dist":{"shasum":"c2ffecce28680371d5eed14e3394c1dcb57230db","tarball":"https://registry.npmjs.org/@apigo.cc/base/-/base-1.0.14.tgz","fileCount":4,"integrity":"sha512-6EOHr9XRYAyKOz6LMgEn7ovRnMOkgDDn8ZSGfMnzRS7tg5A3/2XbOzeFzoazwUZ1QV/NoqT2lUL+gJs6V7Jsqw==","signatures":[{"sig":"MEQCIBE/wgxtoIdZFRfgXWiVwsUUZg88Fq7J6MT3hu5XsJroAiBfmjNmUhLJE914jeECuIejHb+wq6gtQc3oKxVHDvyKGg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":106422},"main":"dist/base.js","type":"module","gitHead":"bae8adb2d313cbb7ec6a1a5d244e2450a4887775","scripts":{"dev":"vite","pub":"node scripts/publish.js","test":"playwright test","build":"vite build"},"_npmUser":{"name":"star3s","email":"isstar3@126.com"},"_npmVersion":"10.7.0","description":"本库是基于 `@apigo.cc/state` 增强的 UI 原子库，提供遵循 Bootstrap 5.3 规范的高阶业务组件。本包采用完全的全局注入模式。","directories":{},"_nodeVersion":"20.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","terser":"^5.47.1","@playwright/test":"^1.40.0","@rollup/plugin-terser":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/base_1.0.14_1780928204218_0.3879417173509534","host":"s3://npm-registry-packages-npm-production"}},"1.0.15":{"name":"@apigo.cc/base","version":"1.0.15","_id":"@apigo.cc/base@1.0.15","maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"dist":{"shasum":"3cc58539aeffe625a398325d2c8345fade842a15","tarball":"https://registry.npmjs.org/@apigo.cc/base/-/base-1.0.15.tgz","fileCount":4,"integrity":"sha512-w/X/vhB10h6/WjP9hYG/IEyboxNLlXYCAIetOS3+tZfnAv516oMPlltRL1a9ytVifINu5GJPceAZySXgWq4+lg==","signatures":[{"sig":"MEYCIQDjykkALRgLsmT+qP5XzcDvB368nBfBud2wcmtSceeEzQIhAKC8DsX+S6r50/zF6/wWAKZZnXBCiJFCpZcOtSQv+W6u","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":107680},"main":"dist/base.js","type":"module","gitHead":"c0d79b2814008cc5c6d302fe58c6c81cdd83f95c","scripts":{"dev":"vite","pub":"node scripts/publish.js","test":"playwright test","build":"vite build"},"_npmUser":{"name":"star3s","email":"isstar3@126.com"},"_npmVersion":"10.7.0","description":"本库是基于 `@apigo.cc/state` 增强的 UI 原子库，提供遵循 Bootstrap 5.3 规范的高阶业务组件。本包采用完全的全局注入模式。","directories":{},"_nodeVersion":"20.15.0","dependencies":{"@apigo.cc/bootstrap":"^1.0.6"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","terser":"^5.47.1","@playwright/test":"^1.40.0","@rollup/plugin-terser":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/base_1.0.15_1781008056329_0.5413429083399091","host":"s3://npm-registry-packages-npm-production"}},"1.0.16":{"name":"@apigo.cc/base","version":"1.0.16","_id":"@apigo.cc/base@1.0.16","maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"dist":{"shasum":"6fa5a080fed2f51d8d6e2cf771724ddd637575c1","tarball":"https://registry.npmjs.org/@apigo.cc/base/-/base-1.0.16.tgz","fileCount":4,"integrity":"sha512-SrsbYwNOUQKdNACs/43e6t1sdv1wjbDzGwP2EfQsXz86Kyd6v4BN2gxg5RzJ9bv+8zJWYZl/Gd6vNpRqEl0HYQ==","signatures":[{"sig":"MEYCIQCOIQc6kAzksvlKDshtdNF4ePz8tsbiy68b0AEC1SFHLwIhAMR/4y/djc54h79lOz/7tSgHDCzusn9bQiwmpMuYzI9Q","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":106422},"main":"dist/base.js","type":"module","gitHead":"c460e9e65e57c5a92fca7afe7bd4f1d5a1e59458","scripts":{"dev":"vite","pub":"node scripts/publish.js","test":"playwright test","build":"vite build"},"_npmUser":{"name":"star3s","email":"isstar3@126.com"},"_npmVersion":"10.7.0","description":"本库是基于 `@apigo.cc/state` 增强的 UI 原子库，提供遵循 Bootstrap 5.3 规范的高阶业务组件。本包采用完全的全局注入模式。","directories":{},"_nodeVersion":"20.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","terser":"^5.47.1","@playwright/test":"^1.40.0","@rollup/plugin-terser":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/base_1.0.16_1781008794060_0.11759783686036451","host":"s3://npm-registry-packages-npm-production"}},"1.0.17":{"name":"@apigo.cc/base","version":"1.0.17","_id":"@apigo.cc/base@1.0.17","maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"dist":{"shasum":"4558ee95e9b971d795edb44d57f9bcda1d421242","tarball":"https://registry.npmjs.org/@apigo.cc/base/-/base-1.0.17.tgz","fileCount":4,"integrity":"sha512-ZkTcsMiqRpqCKdetuG1D2VqVUAUpdABCD6RuTI4IPOVUS4HH2x2AJ03N8plSoq1vYGFugoYvWKCaqbCWoPa3kQ==","signatures":[{"sig":"MEQCIBwaHpHZWFPHhXZsMKyKAmvK0ARthgomN6ik3yCDq5mrAiBoOscpjtl8V/IXO+CA7ZGCJ11Cfl0J2qDA+JmcOuXJpQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":72018},"main":"dist/base.js","type":"module","gitHead":"f94f59e3a914c6f6e8eaebc43665847c10ce9481","scripts":{"dev":"vite","pub":"node scripts/publish.js","test":"playwright test","build":"vite build"},"_npmUser":{"name":"star3s","email":"isstar3@126.com"},"_npmVersion":"10.7.0","description":"本库是基于 `@apigo.cc/state` 增强的 UI 原子库，提供遵循 Bootstrap 5.3 规范的高阶业务组件。本包采用完全的全局注入模式。","directories":{},"_nodeVersion":"20.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","terser":"^5.47.1","@playwright/test":"^1.40.0","@rollup/plugin-terser":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/base_1.0.17_1781066988811_0.8862348792302228","host":"s3://npm-registry-packages-npm-production"}},"1.0.20":{"name":"@apigo.cc/base","version":"1.0.20","_id":"@apigo.cc/base@1.0.20","maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"dist":{"shasum":"4535453ebb8c54a3e795bda9287c4625b24021dd","tarball":"https://registry.npmjs.org/@apigo.cc/base/-/base-1.0.20.tgz","fileCount":4,"integrity":"sha512-YequUUNSvTk88LNsaUf5OyofFTrEUXsrEV5B8Kfxyxjx+Slp1uHI0Ad84UgJzs6W6x/zjMsQksbK/XC4aeqtlQ==","signatures":[{"sig":"MEYCIQDrKchtPUGOntpHoGBmfRmOl/QGL21VL/qY2m8lxBZNegIhAIwnE8kEvPhtverys/ciNu5ctCwhchQtcHvkKukiLnIR","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":113967},"main":"dist/base.js","type":"module","gitHead":"1207c26aef95316a39c6a7e55345cdb55a9383fb","scripts":{"dev":"vite","pub":"node scripts/publish.js","test":"playwright test","build":"vite build"},"_npmUser":{"name":"star3s","email":"isstar3@126.com"},"_npmVersion":"10.7.0","description":"本库是基于 `@apigo.cc/state` 增强的 UI 原子库，提供遵循 Bootstrap 5.3 规范的高阶业务组件。","directories":{},"_nodeVersion":"20.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","terser":"^5.47.1","@playwright/test":"^1.40.0","@rollup/plugin-terser":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/base_1.0.20_1782127438280_0.8203868483756738","host":"s3://npm-registry-packages-npm-production"}},"1.0.21":{"name":"@apigo.cc/base","version":"1.0.21","_id":"@apigo.cc/base@1.0.21","maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"dist":{"shasum":"0e6f57a7dc1f623ffdf032408996c64b66c77c0c","tarball":"https://registry.npmjs.org/@apigo.cc/base/-/base-1.0.21.tgz","fileCount":4,"integrity":"sha512-e5TYL8816Dzsgy1SmnlXSsz9OBcWU+dYMj5FuDflij+edWkQdAuj4j5Jo0w6UApW6zhmumuDmd7XxzXyaYWM+w==","signatures":[{"sig":"MEUCIQCmr08jX6aOOrT4JmwOC8o8rQzi4R8CtJ7YkMukFTJBhQIgeM545AJ56AriB3Z0BvAlPKYzsKSyb+yipd6cVfeDq4U=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":119975},"main":"dist/base.js","type":"module","gitHead":"0b8e1b29528a64b7a47292f63bc30d7e03a0929a","scripts":{"dev":"vite","pub":"node scripts/publish.js","test":"playwright test","build":"vite build"},"_npmUser":{"name":"star3s","email":"isstar3@126.com"},"_npmVersion":"10.7.0","description":"本库是基于 `@apigo.cc/state` 增强的 UI 原子库，提供遵循 Bootstrap 5.3 规范的高阶业务组件。","directories":{},"_nodeVersion":"20.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","terser":"^5.47.1","@playwright/test":"^1.40.0","@rollup/plugin-terser":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/base_1.0.21_1782576032397_0.09230910613898846","host":"s3://npm-registry-packages-npm-production"}},"1.0.22":{"name":"@apigo.cc/base","version":"1.0.22","_id":"@apigo.cc/base@1.0.22","maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"dist":{"shasum":"d610488609102db8232133fd57c2a88682370004","tarball":"https://registry.npmjs.org/@apigo.cc/base/-/base-1.0.22.tgz","fileCount":4,"integrity":"sha512-jhbC9xJKWl0U6jBSpOxWosd7NM61TlyXV86ShHbMOUbx1Mxuelpdo+ZU8N6j//9glRBoMozPxvWfdz4ZL5NWng==","signatures":[{"sig":"MEUCIQD3uxcfY0ImCSUTYVcqi54Wjoae5lBLPNBjEcPVnT5aVwIgELhCu7WRD7qacCIZbpPZ7+J2IiB5qSpgp26YekHNPHM=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":128554},"main":"dist/base.js","type":"module","gitHead":"2da203c5135bdafdf5479bb1422f6fe01890360b","scripts":{"dev":"vite","pub":"node scripts/publish.js","test":"npm run build && node scripts/prepare-test-lib.js && playwright test","build":"vite build"},"_npmUser":{"name":"star3s","email":"isstar3@126.com"},"_npmVersion":"10.7.0","description":"本库是基于 `@apigo.cc/state` 增强的 UI 原子库，提供遵循 Bootstrap 5.3 规范的高阶业务组件。","directories":{},"_nodeVersion":"20.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","terser":"^5.47.1","@playwright/test":"^1.40.0","@rollup/plugin-terser":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/base_1.0.22_1782619254557_0.9209456048675702","host":"s3://npm-registry-packages-npm-production"}},"1.0.23":{"name":"@apigo.cc/base","version":"1.0.23","_id":"@apigo.cc/base@1.0.23","maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"dist":{"shasum":"69a46ad9348fe09c10ea30a6330e15dce1780ccc","tarball":"https://registry.npmjs.org/@apigo.cc/base/-/base-1.0.23.tgz","fileCount":4,"integrity":"sha512-OV08A8ZlfIQEEi6mrXNTSge8fyr+/m64lJ24tWnH23vWASDNQ6OOfsI1u/eRiYidWo7p8W7u7gVHnl1qSNaAGA==","signatures":[{"sig":"MEQCIGELgYlOeiq2gcX/8ZZh3bNHaMNsntNfZlTdpq6gQjLQAiBNfSp/Rh6WMRpgdF4euNGjJt9dWvv2Sva2TX1QBrxx6w==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":137799},"main":"dist/base.js","type":"module","gitHead":"4b010c88c2ace5d81017b772b16bf6c14647876b","scripts":{"dev":"vite","pub":"node scripts/publish.js","test":"npm run build && node scripts/prepare-test-lib.js && playwright test","build":"vite build"},"_npmUser":{"name":"star3s","email":"isstar3@126.com"},"_npmVersion":"10.7.0","description":"`@apigo.cc/base` 是基于 `@apigo.cc/state` 和 Bootstrap 5.3 的同步组件层。页面只需要按顺序引入脚本，就能在首屏完成 DOM 处理和组件渲染。","directories":{},"_nodeVersion":"20.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","terser":"^5.47.1","@playwright/test":"^1.40.0","@rollup/plugin-terser":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/base_1.0.23_1783354652727_0.4402229334254879","host":"s3://npm-registry-packages-npm-production"}},"1.0.24":{"name":"@apigo.cc/base","version":"1.0.24","type":"module","main":"dist/base.js","scripts":{"dev":"vite","prebuild":"node ../.profile/scripts/sync-readme-versions.mjs","build":"vite build","test":"npm run build && node scripts/prepare-test-lib.js && playwright test","pub":"node scripts/publish.js"},"devDependencies":{"@playwright/test":"^1.40.0","@rollup/plugin-terser":"^1.0.0","terser":"^5.47.1","vite":"^5.0.0"},"gitHead":"f0d27cde9b4214b2ddeb9cd11bd12cebb8f30244","_id":"@apigo.cc/base@1.0.24","description":"`@apigo.cc/base` 是基于 `@apigo.cc/state` 和 Bootstrap 5.3 的同步组件层。页面只需要按顺序引入脚本，就能在首屏完成 DOM 处理和组件渲染。","_nodeVersion":"26.4.0","_npmVersion":"11.17.0","dist":{"integrity":"sha512-YnzSxBL1CzIDjP86iC2KS2q2MyP8eGCMtfax8T+HOBllnK9HoRR4Sem0UzrSskNrgrNhaVn5pCa7y2DgLZu2BA==","shasum":"00a712affd60ca610b47cb212aee91c440047e6f","tarball":"https://registry.npmjs.org/@apigo.cc/base/-/base-1.0.24.tgz","fileCount":4,"unpackedSize":146792,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIEoYlMKnfLzTdM54W9SPk2k4E05GpnQm//W2kwkQE3TWAiBPiTWJJxPYfcYYDXlWYFMU54k8abD9TvzEjb+z0UW0vA=="}]},"_npmUser":{"name":"star3s","email":"isstar3@126.com"},"directories":{},"maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/base_1.0.24_1787615893564_0.01166695241945992"},"_hasShrinkwrap":false}},"time":{"created":"2026-06-02T12:40:14.801Z","modified":"2026-08-24T23:58:13.880Z","1.0.7":"2026-06-02T12:40:15.179Z","1.0.8":"2026-06-04T11:26:48.752Z","1.0.11":"2026-06-08T13:56:29.702Z","1.0.13":"2026-06-08T13:57:09.261Z","1.0.14":"2026-06-08T14:16:44.352Z","1.0.15":"2026-06-09T12:27:36.466Z","1.0.16":"2026-06-09T12:39:54.215Z","1.0.17":"2026-06-10T04:49:48.941Z","1.0.20":"2026-06-22T11:23:58.436Z","1.0.21":"2026-06-27T16:00:32.538Z","1.0.22":"2026-06-28T04:00:54.687Z","1.0.23":"2026-07-06T16:17:32.880Z","1.0.24":"2026-08-24T23:58:13.718Z"},"description":"`@apigo.cc/base` 是基于 `@apigo.cc/state` 和 Bootstrap 5.3 的同步组件层。页面只需要按顺序引入脚本，就能在首屏完成 DOM 处理和组件渲染。","maintainers":[{"name":"star3s","email":"isstar3@126.com"}],"readme":"# @apigo.cc/base\n\n`@apigo.cc/base` 是基于 `@apigo.cc/state` 和 Bootstrap 5.3 的同步组件层。页面只需要按顺序引入脚本，就能在首屏完成 DOM 处理和组件渲染。\n\n## 目录\n\n- [依赖加载](#依赖加载) - 同步加载顺序和来源说明\n- [全局变量](#全局变量) - 本包直接挂到 `window` 的变量\n- [HTTP](#http) - 请求工具\n- [API](#api) - 声明式请求节点\n- [AutoForm](#autoform) - 自动表单节点\n- [表单扩展控件](#表单扩展控件) - `DatePicker` / `ColorPicker` / `IconPicker` / `TagsInput`\n- [List](#list) - 普通、分组、树形和虚拟滚动列表\n- [Nav](#nav) - 水平导航栏或垂直侧边栏\n- [Modal / Dialog](#modal--dialog) - 弹窗容器和确认弹窗\n- [Resizer](#resizer) - 拖拽分隔条\n- [UI](#ui) - toast 和对话框工具\n- [VirtualScroll / MouseMover](#virtualscroll--mousemover) - 虚拟滚动和鼠标拖拽辅助\n\n## 依赖加载\n\n按顺序同步加载：\n\n`@apigo.cc/state` -> `@apigo.cc/bootstrap` -> `@apigo.cc/base`\n\n`base` 会直接使用来自 `@apigo.cc/state` 的全局对象 `State`、`Hash`、`LocalStorage`。\n\n- [state 文档](https://apigo.cc/web/state)\n\n### 推荐加载顺序\n\n```html\n<script src=\"https://cdn.jsdelivr.net/npm/@apigo.cc/state@1.0.28/dist/state.min.js\"></script>\n<script src=\"https://cdn.jsdelivr.net/npm/@apigo.cc/bootstrap@1.0.13/dist/bootstrap.min.js\"></script>\n<script src=\"https://cdn.jsdelivr.net/npm/@apigo.cc/base@1.0.24/dist/base.min.js\"></script>\n```\n\n### 全局变量\n\n| 变量 | 说明 |\n|---|---|\n| `HTTP` | 请求工具 |\n| `UI` | 提示、确认、对话框工具 |\n| `AutoForm` | 自动表单容器和扩展注册器 |\n| `VirtualScroll` | 虚拟滚动工具 |\n| `MouseMover` | 鼠标拖拽位移工具 |\n\n## HTTP\n\n`HTTP` 只处理请求，不处理 UI。\n\n### 方法\n\n| 方法 | 写法示例 | 说明 |\n|---|---|---|\n| `HTTP.request(options)` | `await HTTP.request({ url: '/api/user', method: 'POST', data: { id: 1 } })` | 通用请求入口 |\n| `HTTP.get(...)` | `await HTTP.get({ url: '/api/user/1' })` | `GET` |\n| `HTTP.post(...)` | `await HTTP.post({ url: '/api/user', data: form })` | `POST` |\n| `HTTP.put(...)` | `await HTTP.put({ url: '/api/user/1', data: patch })` | `PUT` |\n| `HTTP.delete(...)` | `await HTTP.delete({ url: '/api/user/1' })` | `DELETE` |\n| `HTTP.head(...)` | `await HTTP.head({ url: '/api/user/1' })` | `HEAD` |\n\n### `HTTP.request` 参数\n\n| 参数 | 类型 | 写法示例 | 说明 |\n|---|---|---|---|\n| `url` | `string` | `url: '/api/user'` | 必填 |\n| `method` | `string` | `method: 'POST'` | 默认 `POST`，内部会转大写 |\n| `data` | `any` | `data: { name: 'Alice' }` | 请求体 |\n| `headers` | `object` | `headers: { Authorization: 'Bearer xxx' }` | 请求头 |\n| `responseType` | `string` | `responseType: 'json'` | 可手动指定 |\n| `timeout` | `number` | `timeout: 5000` | 默认 `10000` ms |\n\n### `HTTP` 对象属性\n\n| 属性 | 写法示例 | 说明 |\n|---|---|---|\n| `keepHeaders` | `HTTP.keepHeaders = ['Session-Id']` | 需要跨请求保留的响应头名 |\n\n### Content-Type 规则\n\n- `data` 是普通对象时，默认按 JSON 发送，并自动补 `Content-Type: application/json`\n- `data` 是 `FormData` 时，不手动设置 `Content-Type`，让浏览器生成带 boundary 的 multipart 请求头\n- 如果你在 `headers` 里手动传了 `Content-Type`，普通对象请求会按你的设置发送；`FormData` 仍然以浏览器生成的请求头为准\n\n### 返回值\n\n```js\n{\n  ok,\n  status,\n  headers,\n  responseType,\n  result,\n  error\n}\n```\n\n### 推荐示例\n\n```html\n<script>\n  window.userRequest = {\n    url: '/api/users/1',\n    method: 'GET'\n  }\n  window.apiResponse = null\n  window.apiResult = null\n  window.user = null\n</script>\n\n<API id=\"userApi\"\n  auto\n  $.request=\"window.userRequest\"\n  $onresponse=\"window.user = event.detail.result\"\n  $onerror=\"UI.toast(event.detail.message, { type: 'danger' })\">\n</API>\n\n<button class=\"btn btn-primary\" onclick=\"userApi.do({ noui: true })\">Reload</button>\n```\n\n## API\n\n`<API>` 是把请求封装成页面节点的方式。\n\n### 属性和状态\n\n| 名称 | 写法示例 | 说明 |\n|---|---|---|\n| `auto` | `<API auto>` | 监听 `request` 变化后自动请求 |\n| `request` | `$.request=\"window.userRequest\"` | 请求配置对象 |\n| `response` | `$.response=\"window.apiResponse\"` | 最近一次请求状态 |\n| `result` | `$.result=\"window.apiResult\"` | 响应结果缓存 |\n\n### `request` 默认结构\n\n```js\n{\n  url: '',\n  method: 'GET',\n  headers: {},\n  data: null,\n  timeout: 10000,\n  responseType: ''\n}\n```\n\n### `response` 默认结构\n\n```js\n{\n  loading: false,\n  ok: null,\n  status: null,\n  error: null,\n  headers: {},\n  responseType: '',\n  result: null\n}\n```\n\n### 方法\n\n| 方法 | 写法示例 | 说明 |\n|---|---|---|\n| `do(opt = {})` | `await userApi.do()` | 手动请求 |\n| `opt.noui` | `await userApi.do({ noui: true })` | 失败时不弹 toast |\n\n### 事件\n\n| 事件 | 触发时机 | `detail` |\n|---|---|---|\n| `response` | 请求成功 | 完整响应对象 |\n| `error` | 请求失败或返回错误 | `Error` 对象 |\n\n### 备注\n\n- `auto` 只在 `request.url` 存在时生效\n- `request` 深度变化会在微任务里触发一次请求，避免同一轮重复请求\n\n## AutoForm\n\n`<AutoForm>` 通过 `schema` 生成表单，适合和 `API`、`window` 上的页面数据直接联动。\n\n### 属性\n\n| 名称 | 写法示例 | 说明 |\n|---|---|---|\n| `vertical` | `<AutoForm vertical>` | 垂直布局 |\n| `horizontal` | `<AutoForm horizontal>` | 强制左右两列布局 |\n| `inline` | `<AutoForm inline>` | 行内紧凑布局 |\n| `nobutton` | `<AutoForm nobutton>` | 隐藏底部提交按钮 |\n| `api` | `$.api=\"saveApi\"` | 绑定 `<API>` 实例或其引用 |\n| `submitlabel` | `submitlabel=\"Search\"` | 提交按钮文案，默认 `{#Submit#}` |\n\n### 状态和方法\n\n| 名称 | 写法示例 | 说明 |\n|---|---|---|\n| `data` | `$.state.data=\"window.profile\"` | 表单数据，建议用 `Object.assign` 更新 |\n| `schema` | `$.state.schema=\"window.profileSchema\"` | 表单定义 |\n| `request` | `$.request=\"{ method: 'POST' }\"` | 默认提交配置 |\n| `response` | `$.response=\"window.formResponse\"` | 最近一次提交结果 |\n| `result` | `$.result=\"window.formResult\"` | 最近一次提交的 `response.result` |\n| `submit(opt = {})` | `form.submit()` | 主动提交 |\n\n### `schema` 字段\n\n| 字段 | 写法示例 | 说明 |\n|---|---|---|\n| `name` | `name: 'role'` | 必填，数据键名 |\n| `label` | `label: 'Role'` | 表单项标题 |\n| `type` | `type: 'select'` | 控件类型 |\n| `setting` | `setting: { required: true }` | 透传给控件的属性 |\n| `options` | `options: ['A', 'B']` | `select` / `checkbox` / `radio` 选项 |\n| `placeholder` | `placeholder: 'Please choose'` | `select` 的空值占位文案 |\n| `if` | `if: 'this.data.enable'` | 条件渲染表达式 |\n\n### `if` 说明\n\n- `if` 不是字符串模板拼接，而是表达式\n- 表达式执行时可直接访问 `this`、`State`、`Hash`、`LocalStorage`、`item`、`data`\n- 这类条件是表单级动态渲染，适合做联动显隐\n\n### 支持的 `type`\n\n| `type` | 用途 |\n|---|---|\n| `text` | 单行文本 |\n| `password` | 密码 |\n| `email` | 邮箱 |\n| `number` | 数字 |\n| `date` | 日期 |\n| `datetime` | 日期时间 |\n| `file` | 文件 |\n| `select` | 下拉单选 |\n| `checkbox` | 多选 |\n| `radio` | 单选按钮组 |\n| `switch` | 开关 |\n| `textarea` | 多行文本 |\n| `DatePicker` | 扩展日期控件 |\n| `ColorPicker` | 扩展颜色控件 |\n| `IconPicker` | 扩展图标控件 |\n| `TagsInput` | 扩展标签控件 |\n\n### `options` 写法\n\n```js\n['Admin', 'Editor']\n[{ label: 'Admin', value: 'admin' }]\n```\n\n### 事件\n\n| 事件 | 触发时机 | `detail` |\n|---|---|---|\n| `submit` | 表单校验通过、提交前 | 当前表单数据 |\n| `response` | 提交成功 | 完整响应对象 |\n| `error` | 提交失败 | `Error` 对象 |\n\n### 插槽\n\n| 插槽 | 位置 | 用途 |\n|---|---|---|\n| `actions` | 默认提交按钮左侧 | 自定义动作按钮 |\n\n### 推荐示例\n\n```html\n<script>\n  window.profile = { name: 'Alice' }\n  window.profileSchema = [\n    { name: 'name', label: 'Name', type: 'text', setting: { required: true, placeholder: 'Enter name' } },\n    { name: 'role', label: 'Role', type: 'select', options: [{ label: 'Admin', value: 'admin' }, { label: 'Editor', value: 'editor' }] },\n    { name: 'active', label: 'Active', type: 'switch' },\n    { name: 'birthday', label: 'Birthday', type: 'DatePicker', setting: { rangeEnd: 'birthdayEnd' } },\n    { name: 'birthdayEnd', label: 'Birthday End', type: 'date' },\n    { name: 'theme', label: 'Theme', type: 'ColorPicker' },\n    { name: 'icon', label: 'Icon', type: 'IconPicker' },\n    { name: 'tags', label: 'Tags', type: 'TagsInput' },\n    { name: 'remark', label: 'Remark', type: 'textarea', if: 'this.data.active' }\n  ]\n</script>\n\n<AutoForm vertical\n  $.state.schema=\"window.profileSchema\"\n  $.state.data=\"window.profile\"\n  $onsubmit=\"UI.toast('submit: ' + JSON.stringify(event.detail))\">\n  <template slot=\"actions\">\n    <button type=\"button\" class=\"btn btn-outline-secondary\" onclick=\"Object.assign(window.profile, { name: 'Alice' })\">Reset</button>\n  </template>\n</AutoForm>\n```\n\n### 编程注意\n\n- 不要直接整体覆盖 `form.data` 或 `form.state.data`\n- 需要更新时，优先用 `Object.assign(form.data, nextData)`\n\n### `AutoForm.register(name, typeName = '')`\n\n注册可被 `schema.type` 识别的自定义控件。\n\n| 参数 | 写法示例 | 说明 |\n|---|---|---|\n| `name` | `AutoForm.register('MyPicker')` | 组件标签名 |\n| `typeName` | `AutoForm.register('MyPicker', 'picker')` | 默认 `''`。只有当标签名和 `schema.type` 不同，或需要复用同一个标签名匹配另一个 `type` 时才传 |\n\n### 什么时候传 `typeName`\n\n- 你想让 `<MyPicker>` 处理 `schema.type === 'picker'`\n- 你想把一个标签名映射成不同的 `type`\n- 如果 `schema.type` 和标签名一致，直接省略第二个参数\n\n## 表单扩展控件\n\n这些控件既可以在 `AutoForm` 里作为 `schema.type` 使用，也可以单独放到页面上。单独使用时，直接绑定 `value`，再监听 `change` 即可。\n\n### `<DatePicker>`\n\n| 项目 | 说明 |\n|---|---|\n| `state.start` | 起始日期 |\n| `state.end` | 结束日期 |\n| `value` | 映射到 `state.start` |\n| `isRange` | 是否启用范围模式 |\n| `setting.rangeEnd` | 范围结束字段名 |\n| `rangeEnd` | 组件属性形式的范围结束字段名 |\n| `change` | 开始日期变化时触发，`detail` 为开始日期字符串 |\n\n### `<DatePicker>` 示例\n\n```html\n<script>\n  window.rangeForm = {}\n  window.rangeSchema = [\n    { name: 'rangeStart', label: 'Range', type: 'DatePicker', setting: { rangeEnd: 'rangeEnd' } },\n    { name: 'rangeEnd', label: 'Range End', type: 'date' }\n  ]\n</script>\n\n<AutoForm $.state.schema=\"window.rangeSchema\" $.state.data=\"window.rangeForm\"></AutoForm>\n```\n\n### `<DatePicker>` 单独使用\n\n```html\n<script>\n  window.birthDate = '2026-06-01'\n</script>\n\n<DatePicker $bind=\"window.birthDate\"></DatePicker>\n```\n\n### `<ColorPicker>`\n\n| 项目 | 说明 |\n|---|---|\n| `state.value` | 颜色值，默认 `#000000` |\n| `value` | 可读写，映射到 `state.value` |\n| `change` | 颜色变化时触发，`detail` 为颜色字符串 |\n\n### `<ColorPicker>` 示例\n\n```html\n<script>\n  window.colorForm = {}\n  window.colorSchema = [\n    { name: 'theme', label: 'Theme', type: 'ColorPicker' }\n  ]\n</script>\n\n<AutoForm $.state.schema=\"window.colorSchema\" $.state.data=\"window.colorForm\"></AutoForm>\n```\n\n### `<IconPicker>`\n\n| 项目 | 说明 |\n|---|---|\n| `state.value` | 当前图标名 |\n| `state.search` | 搜索词 |\n| `state.open` | 下拉是否展开 |\n| `filteredIcons` | 过滤后的图标列表 |\n| `value` | 可读写，映射到 `state.value` |\n| `change` | 选择图标时触发，`detail` 为图标名 |\n\n### `<IconPicker>` 示例\n\n```html\n<script>\n  window.iconForm = {}\n  window.iconSchema = [\n    { name: 'icon', label: 'Icon', type: 'IconPicker' }\n  ]\n</script>\n\n<AutoForm $.state.schema=\"window.iconSchema\" $.state.data=\"window.iconForm\"></AutoForm>\n```\n\n### `<TagsInput>`\n\n| 项目 | 说明 |\n|---|---|\n| `state.tags` | 标签数组 |\n| `change` | 标签变更时触发，`detail` 为最新数组 |\n\n### `<TagsInput>` 示例\n\n```html\n<script>\n  window.tagForm = {}\n  window.tagsSchema = [\n    { name: 'tags', label: 'Tags', type: 'TagsInput' }\n  ]\n</script>\n\n<AutoForm $.state.schema=\"window.tagsSchema\" $.state.data=\"window.tagForm\"></AutoForm>\n```\n\n### `<TagsInput>` 单独使用\n\n```html\n<script>\n  window.tags = ['Vue', 'AI']\n</script>\n\n<TagsInput $bind=\"window.tags\"></TagsInput>\n```\n\n## List\n\n`<List>` 支持普通、分组、树形和虚拟滚动。它的重点不是“能渲染”，而是“能直接拿来绑定状态”。\n\n### 属性\n\n| 名称 | 写法示例 | 说明 |\n|---|---|---|\n| `mode` | `<List mode=\"group\">` | `normal` / `group` / `tree`，默认 `normal` |\n| `fast` | `<List fast>` | 开启虚拟滚动。任意模式都能用 |\n| `collapsible` | `<List collapsible>` | 树形模式下允许折叠 |\n| `auto-select` | `<List auto-select>` | 点击项后把当前项 id 写回 `selectedItem` |\n| `auto-select-group` | `<List auto-select-group>` | 点击分组后把当前分组 id 写回 `selectedGroup` |\n\n### 状态\n\n| 名称 | 说明 |\n|---|---|\n| `list` | 原始列表 |\n| `groups` | 分组列表，`group` 模式使用 |\n| `filter` | 字符串或对象筛选条件 |\n| `order` | 排序规则，例如 `name`、`-name`、`name desc` |\n| `selectedItem` | 当前选中的项 id |\n| `selectedGroup` | 当前选中的分组 id |\n| `renderedList` | 当前实际渲染的列表片段 |\n| `flatList` | 逻辑处理后的扁平列表 |\n| `collapsed` | 树形折叠状态 |\n\n### 实例属性\n\n| 名称 | 写法示例 | 说明 |\n|---|---|---|\n| `filterFunc` | `list.filterFunc = item => item.active` | 自定义过滤函数 |\n| `orderFunc` | `list.orderFunc = (a, b) => a.name.localeCompare(b.name)` | 自定义排序函数 |\n\n### 事件\n\n| 事件 | 触发时机 | `detail` |\n|---|---|---|\n| `change` | 选中项变化 | `selectedItem` |\n| `itemclick` | 点击普通项 | `{ item, index }` |\n| `groupclick` | 点击分组项 | `{ item, index }` |\n\n### 绑定习惯\n\n- 推荐配合 `$bind` 保存当前选中 id，比如 `$bind=\"window.currentUserId\"`\n- 如果你只关心点击事件，也可以不绑，直接监听 `itemclick` / `groupclick`\n\n### 插槽\n\n| 插槽 | 说明 |\n|---|---|\n| `item` | 单项自定义内容 |\n| `item-actions` | 单项右侧动作区 |\n| `group-actions` | 分组右侧动作区 |\n\n### 字段默认映射\n\n不写映射属性时，默认字段名就是这些：\n\n| 字段 | 默认值 |\n|---|---|\n| `idfield` | `id` |\n| `labelfield` | `label` |\n| `summaryfield` | `summary` |\n| `groupidfield` | `id` |\n| `grouplabelfield` | `label` |\n| `groupsummaryfield` | `summary` |\n| `groupfield` | `group` |\n| `parentfield` | `parent` |\n| `groupicon` | `folder` |\n| `itemicon` | `file` |\n\n### 推荐示例\n\n#### 普通列表 + `$bind`\n\n```html\n<script>\n  window.currentUserId = null\n  window.userList = [\n    { id: '1', label: 'Alice', summary: 'Admin' },\n    { id: '2', label: 'Bob', summary: 'Editor' }\n  ]\n</script>\n\n<List class=\"h-100 overflow-auto\" auto-select\n  $.state.list=\"window.userList\"\n  $bind=\"window.currentUserId\"\n  $onitemclick=\"UI.toast('item: ' + event.detail.item.label)\">\n  <template slot=\"item\">\n    <span $text=\"item.label\"></span>\n    <span class=\"ms-auto text-muted small\" $text=\"item.summary\"></span>\n  </template>\n</List>\n```\n\n#### 分组列表\n\n```html\n<script>\n  window.groups = [\n    { id: 'team-a', label: 'Team A', summary: '2 people' },\n    { id: 'team-b', label: 'Team B', summary: '1 person' }\n  ]\n\n  window.members = [\n    { id: '1', label: 'Alice', summary: 'Admin', group: 'team-a' },\n    { id: '2', label: 'Bob', summary: 'Editor', group: 'team-b' }\n  ]\n</script>\n\n<List mode=\"group\" class=\"h-100 overflow-auto\" auto-select-group\n  $.state.list=\"window.members\"\n  $.state.groups=\"window.groups\"\n  $ongroupclick=\"UI.toast('group: ' + event.detail.item.label)\">\n  <template slot=\"item\">\n    <span $text=\"item.label\"></span>\n    <span class=\"ms-auto text-muted small\" $text=\"item.summary\"></span>\n  </template>\n</List>\n```\n\n#### 树形列表\n\n```html\n<script>\n  window.treeList = [\n    { id: '1', label: 'Root', parent: '' },\n    { id: '2', label: 'Child A', parent: '1' },\n    { id: '3', label: 'Child B', parent: '1' }\n  ]\n</script>\n\n<List mode=\"tree\" collapsible class=\"h-100 overflow-auto\"\n  $.state.list=\"window.treeList\">\n</List>\n```\n\n#### 虚拟滚动\n\n```html\n<script>\n  window.bigList = Array.from({ length: 2000 }, (_, i) => ({\n    id: String(i + 1),\n    label: 'Row ' + (i + 1),\n    summary: 'virtual row'\n  }))\n</script>\n\n<List fast class=\"h-100 overflow-auto\"\n  $.state.list=\"window.bigList\">\n</List>\n```\n\n### 行为说明\n\n- `filter` 是字符串时，同时匹配 `label` 和 `summary`\n- `filter` 是对象时，按字段模糊匹配\n- `tree` 模式会自动保留命中的祖先链\n- `fast` 模式要求外层容器有 `overflow-auto`\n- 数据项可加 `_itemHeight` 优化虚拟滚动测量\n\n## Nav\n\n`<Nav>` 默认是水平导航。需要侧边栏时才加 `vertical`。\n\n### 属性\n\n| 名称 | 写法示例 | 说明 |\n|---|---|---|\n| `vertical` | `<Nav vertical>` | 垂直侧边栏 |\n\n### 状态\n\n| 名称 | 说明 |\n|---|---|\n| `brand` | `{ image, icon, label }` |\n| `list` | 导航项数组 |\n| `value` | 当前选中项 |\n| `openName` | 当前展开的下拉项 |\n\n### 导航项结构\n\n| 字段 | 说明 |\n|---|---|\n| `type` | `button` / `dropdown` / `label` / `fill` |\n| `name` | 导航项标识 |\n| `label` | 文本 |\n| `icon` | Bootstrap Icons 名称 |\n| `class` | 额外 class |\n| `noselect` | 选中时不写回 `value` |\n| `width` | 仅 `dropdown` 在水平模式下控制下拉宽度 |\n| `list` | `dropdown` 的子项 |\n\n### 子项结构\n\n`dropdown.list` 内的子项支持：\n\n- `type: 'button'`\n- `type: 'label'`\n- `type: 'switch'`\n\n`switch` 子项需要：\n\n- `bind`: 一个状态对象\n- `name`: 写回的字段名\n\n### 事件\n\n| 事件 | 触发时机 | `detail` |\n|---|---|---|\n| `change` | 选中项变化 | 当前 `name` |\n| `nav` | 点击或展开时 | `{ item }` 或 `{ item, open }` |\n\n### 推荐示例\n\n```html\n<script>\n  window.currentNav = 'users'\n  window.brand = { icon: 'cpu', label: 'Admin' }\n  window.navSettings = { darkMode: false }\n  window.navList = [\n    { type: 'button', name: 'users', label: 'Users', icon: 'people' },\n    { type: 'dropdown', name: 'settings', label: 'Settings', icon: 'gear', list: [\n      { type: 'button', name: 'profile', label: 'Profile', icon: 'person' },\n      { type: 'switch', name: 'darkMode', label: 'Dark Mode', icon: 'moon', bind: window.navSettings }\n    ]}\n  ]\n</script>\n\n<Nav class=\"border-bottom\"\n  $.state.brand=\"window.brand\"\n  $.state.list=\"window.navList\"\n  $bind=\"window.currentNav\"\n  $onnav=\"UI.toast(event.detail.item.label)\">\n</Nav>\n```\n\n### 备注\n\n- 水平模式是默认推荐形态\n- 需要左侧栏时再加 `vertical`\n- `list` 推荐在 JS 里单独定义，不要硬塞成一长串 HTML 字面量\n- 如果需要同步当前路由或菜单名，可以再加 `$bind`\n\n## Modal / Dialog\n\n### `<Modal>`\n\n| 名称 | 写法示例 | 说明 |\n|---|---|---|\n| `show()` | `editModal.show()` | 打开弹窗 |\n| `hide()` | `editModal.hide()` | 关闭弹窗 |\n| `change` | `@change` | 关闭时派发 `false` |\n\n### `<Modal>` 的插槽\n\n| 插槽 | 说明 |\n|---|---|\n| `header` | 弹窗头部 |\n| `body` | 弹窗主体 |\n| `footer` | 弹窗底部 |\n\n### `<Modal>` 示例\n\n```html\n<Modal id=\"editModal\">\n  <div slot=\"header\">Edit User</div>\n  <div slot=\"body\">\n    <AutoForm nobutton inline $.state.schema=\"window.profileSchema\" $.state.data=\"window.profile\"></AutoForm>\n  </div>\n  <div slot=\"footer\">\n    <button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Close</button>\n  </div>\n</Modal>\n\n<button class=\"btn btn-primary\" onclick=\"editModal.show()\">Open</button>\n```\n\n### `<Dialog>`\n\n`<Dialog>` 是基于 `Modal` 的消息确认弹窗，平时直接用 `UI.showDialog` 更快。\n\n### `UI.showDialog`\n\n| 参数 | 写法示例 | 说明 |\n|---|---|---|\n| `title` | `title: 'Delete'` | 标题 |\n| `message` | `message: 'Are you sure?'` | 内容 |\n| `buttons` | `buttons: ['Cancel', 'Confirm']` | 按钮文本数组 |\n| `type` | `type: 'danger'` | 样式类型 |\n\n### `UI.showDialog` 示例\n\n```js\nconst ok = await UI.confirm('Delete it?', { type: 'danger' })\nif (ok) {\n  UI.toast('deleted', { type: 'success' })\n}\n```\n\n## Resizer\n\n`<Resizer>` 默认调整前一个元素的宽度。需要别的目标时再传 `target`。\n\n### 属性\n\n| 名称 | 写法示例 | 说明 |\n|---|---|---|\n| `vertical` | `<Resizer vertical>` | 调整高度，不是宽度 |\n| `min` | `min=\"180\"` | 最小像素，默认 `10` |\n| `max` | `max=\"420\"` | 最大像素，默认 `1000` |\n| `target` | `target=\"sidebar\"` | 要调整的元素；不写时默认前一个兄弟节点 |\n\n### 事件\n\n| 事件 | `detail` | 说明 |\n|---|---|---|\n| `resizing` | `{ oldSize, newSize }` | 拖动中持续触发 |\n| `resize` | `{ oldSize, newSize }` | 拖动结束触发 |\n| `change` | `newSize` | 拖动结束触发，适合写回状态 |\n\n### 推荐示例\n\n#### 默认用法\n\n```html\n<div id=\"sidebar\" style=\"width: 280px\"></div>\n<Resizer min=\"180\" max=\"420\"></Resizer>\n```\n\n#### 指定 target\n\n```html\n<div id=\"sidebar\" style=\"width: 280px\"></div>\n<Resizer target=\"sidebar\" min=\"180\" max=\"420\"></Resizer>\n```\n\n## UI\n\n### `UI.toast(message, options)`\n\n| 参数 | 写法示例 | 说明 |\n|---|---|---|\n| `message` | `UI.toast('Saved')` | 提示文案 |\n| `type` | `UI.toast('Saved', { type: 'success' })` | 主题类型 |\n| `delay` | `UI.toast('Saved', { delay: 2000 })` | 自动关闭延迟 |\n| `buttons` | `UI.toast('Confirm?', { buttons: ['Cancel', 'Confirm'] })` | 底部按钮 |\n| `container` | `UI.toast('...', { container: 'right-top' })` | 自定义容器 |\n\n### `UI.toastConfirm(message, options)`\n\n返回 `Promise<boolean>`。\n\n### `UI.alert(message, options)`\n\n```js\nawait UI.alert('Saved')\n```\n\n### `UI.confirm(message, options)`\n\n```js\nconst ok = await UI.confirm('Delete it?')\n```\n\n### `UI.showDialog(options)`\n\n```js\nawait UI.showDialog({\n  title: 'Confirm',\n  message: 'Do you want to continue?',\n  buttons: ['Cancel', 'Confirm'],\n  type: 'primary'\n})\n```\n\n## VirtualScroll / MouseMover\n\n### `VirtualScroll(options = {})`\n\n参数：\n\n| 参数 | 写法示例 | 说明 |\n|---|---|---|\n| `itemHeight` | `VirtualScroll({ itemHeight: 40 })` | 默认行高预估值 |\n\n返回值：\n\n| 方法 | 说明 |\n|---|---|\n| `reset(list, container)` | 重置缓存并返回初始可见列表 |\n| `init(list, refreshCallback)` | 初始化高度缓存 |\n| `update(index, node)` | 记录节点实际高度 |\n| `calc(container, list)` | 计算当前需要渲染的片段 |\n\n### `MouseMover.start(event, handlers)`\n\n```js\nMouseMover.start(event, {\n  onmousemove: ({ w, h }) => {},\n  onmouseup: ({ w, h }) => {}\n})\n```\n\n### 说明\n\n- `VirtualScroll` 主要给 `List` 和 `DataTable` 用\n- `MouseMover` 主要给 `Resizer` 用\n","readmeFilename":"README.md"}