SuperAPI AI 工具集

hyperframes-registry

通用与其它

查看项目

更新于 10-16 04:33

技能介绍

用途:该 Registry 提供可复用的 blocks(区块,独立子合成,拥有自己的尺寸、时长与时间线)和 components(组件,效果片段,无独立尺寸),通过 hyperframes add <name> 安装后接入 HyperFrames 合成。

适用时机:用户提到 hyperframes add、block、component 或 hyperframes.json;会话中出现 hyperframes add 的输出(文件路径、剪贴板片段);需要把已安装项接入现有合成;或想查看 registry 中有哪些可用项。

主要命令:hyperframes add data-chart 安装区块;hyperframes add grain-overlay 安装组件;hyperframes add shimmer-sweep --dir . 指定目标项目;hyperframes add data-chart --json 输出机器可读结果;hyperframes add data-chart --no-clipboard 跳过剪贴板(CI/无头环境)。安装后 CLI 会打印写入的文件与可粘贴到宿主合成的片段。

接线区块:区块是独立合成,通过 data-composition-src 在宿主 index.html 中引入,需设置 data-composition-id(须与区块内部 ID 一致)、data-start(出现时间,秒)、data-duration、data-width/data-height、data-track-index(层级,越大越靠前)。

接线组件:组件是片段,需把其 HTML 粘贴进合成的 div[data-composition-id],CSS 放入样式块,JS(若有)放入脚本,并按片段注释中的说明把 GSAP 时间线调用加入时间线。

安装位置:区块默认安装到 compositions/<name>.html,组件默认到 compositions/components/<name>.html,可在 hyperframes.json 的 paths 中配置 blocks、components、assets,registry 亦可配置。

发现:可读取 registry 清单 registry.json,每项的 registry-item.json 含 name、type、title、description、tags,区块另含 dimensions 与 duration,以及文件列表。

限制:hyperframes add 仅适用于 blocks 和 components;示例需改用 hyperframes init <dir> --example <name>。片段仅为起点,接线区块时仍需自行补充 data-composition-id、data-start、data-track-index 等属性。