interactive-component-integration
用于忠实集成 Canvas、WebGL、着色器、滚动驱动、指针响应式和第三方动画组件的公开代理技能。
插件会安装到这里；不确定时保持 web。
npx -y @deepseek-ai/dsh plugin --profile web add github:Duoasa/interactive-component-integration#5134aa8bb25e26f23da5d24176834d000a01d536Interactive Component Integration 以 interactive-component-integration 发布，当前版本为 1.0.0。Plugin Hub 会校验它的 manifest，并保存精确安装来源，便于复现安装结果。
Public agent skill for production-grade interactive frontend integration. Compatible with Codex and DeepSeek Harness (DSH). Free for anyone to use, modify, and redistribute under the MIT License.
The skill applies to identified external interactive components. Its entrypoint routes to rendering, page containment, or visual-verification details only when needed. A small repair uses affected checks; initial source integration still preserves the rendering contract, and visual parity requires comparable evidence.
interactive-component-integration helps agents integrate third-party interactive and animated frontend components without silently changing how they actually render.
It targets a common failure mode: an adaptation looks approximately right, but its defaults, renderer setup, color pipeline, alpha behavior, DPR policy, post-processing chain, lifecycle, or accessibility contract have already drifted from the authoritative implementation.
Use this skill when a task involves:
The name and trigger scope are intentionally aligned. This is not a general frontend skill: ordinary page maintenance, page isolation, and visual QA do not trigger it unless they are part of an interactive-component integration.
Ask Codex to install the standalone skill directory:
Use $skill-installer to install the skill from:
https://github.com/Duoasa/interactive-component-integration/tree/main/resources/skills/interactive-component-integration
Codex can also discover skills from supported user- and repository-level skill directories. See the official OpenAI skill documentation for current locations and invocation behavior.
The repository is also a native DSH bundle. Install it directly from GitHub into a profile:
dsh plugin --profile web add github:Duoasa/interactive-component-integration
Then start DSH with that profile as usual:
dsh --profile web
No marketplace listing or build permission is required. The package ships plain JavaScript, declares its bundle layer through dsh.bundle.patch, and registers the same canonical skill at runtime through ctx.skills.register.
For supply-chain-sensitive environments, pin a reviewed commit:
dsh plugin --profile web add github:Duoasa/interactive-component-integration#<commit>
See the DeepSeek Harness repository for current DSH installation and plugin documentation.
Invoke the skill explicitly:
Use $interactive-component-integration to integrate this WebGL background,
preserve the source rendering contract, and verify it in the production page.
An agent may also activate it automatically when the task matches the trigger description in SKILL.md.
interactive-component-integration/
├── package.json # DSH bundle manifest
├── cordis.patch.yml # DSH activation layer
├── index.js # DSH runtime registration
├── LICENSE
├── README.md
└── resources/
└── skills/
└── interactive-component-integration/
├── SKILL.md # canonical skill instructions
└── agents/
└── openai.yaml
Codex installs the canonical skill directory. DSH installs the whole GitHub repository as a bundle and registers that exact same SKILL.md. There is no duplicated instruction body to drift between platforms.
The skill passes the official skill-creator structural validator. It was also forward-tested against:
The tests confirmed that the skill identifies rendering-contract drift and reports incomplete QA as not tested or blocked instead of claiming success.
This reusable workflow was extracted and generalized from production rules in Duoasa Design:
MIT. Anyone may use, copy, modify, publish, and redistribute this skill subject to the license terms.
interactive-component-integration 是一个公开、可复用的 agent skill，用于把第三方交互与动画组件可靠地集成到前端项目中，并避免适配过程悄悄改变其真实渲染机制。
它解决的典型问题是：页面“看起来差不多”，但组件的默认参数、渲染器配置、色彩管线、透明度与混合、DPR、后处理链、生命周期或无障碍行为已经偏离权威实现。
本 skill 同时兼容 Codex 与 DeepSeek Harness（DSH），并以 MIT 许可证公开发布，任何人都可以使用、修改与再分发。
这个 skill 适用于涉及以下内容的任务：
名称与触发范围刻意保持一致。它不是通用前端 skill：普通页面维护、页面隔离和常规视觉 QA 不会单独触发，只有当这些工作属于交互组件集成的一部分时才会加载。
让 Codex 安装仓库中的独立 skill 目录：
使用 $skill-installer 安装以下路径中的 skill：
https://github.com/Duoasa/interactive-component-integration/tree/main/resources/skills/interactive-component-integration
Codex 也支持从用户级和仓库级目录发现 skill。当前扫描位置与调用方式请参考 OpenAI 官方 skill 文档。
本仓库同时是一个原生 DSH bundle。按照示例，直接用一条命令从 GitHub 安装到 profile：
dsh plugin --profile web add github:Duoasa/interactive-component-integration
然后照常启动该 profile：
dsh --profile web
不需要进入任何市场，也不需要允许安装时构建脚本。仓库直接提交可运行的 JavaScript，通过 dsh.bundle.patch 声明配置层，并使用 ctx.skills.register 在运行时注册同一份 canonical skill。
对供应链安全要求较高时，可以固定到已审核的 commit：
dsh plugin --profile web add github:Duoasa/interactive-component-integration#<commit>
当前 DSH 的安装和插件机制请参考 DeepSeek Harness 官方仓库。
显式调用示例：
使用 $interactive-component-integration 集成这个 WebGL 背景，
保留官方渲染管线，并在真实生产页面中完成验证。
当任务匹配 SKILL.md 中的触发条件时，agent 也可以自动加载这个 skill。
interactive-component-integration/
├── package.json # DSH bundle manifest
├── cordis.patch.yml # DSH 激活层
├── index.js # DSH 运行时注册
├── LICENSE
├── README.md
└── resources/
└── skills/
└── interactive-component-integration/
├── SKILL.md # 唯一的 skill 指令源
└── agents/
└── openai.yaml
Codex 安装 canonical skill 目录；DSH 把整个 GitHub 仓库作为 bundle 安装，并注册完全相同的 SKILL.md。两套平台之间没有重复的指令正文，因此不会产生版本漂移。
该 skill 已通过官方 skill-creator 结构校验，并完成两组独立前向测试：
测试确认：skill 能识别渲染管线偏差，并会把未完成的验收明确标记为 not tested 或 blocked，而不是直接宣称成功。
这套通用工作流提炼自 Duoasa Design 的生产规则：
MIT。任何人都可以在遵守许可证条款的前提下使用、复制、修改、发布与再分发本 skill。