Agent Skills
› home-assistant/frontend
home-assistant/frontend
GitHub指导 Home Assistant 前端 UI 组件的开发与审查，涵盖 Dialog、Button、Form、Alert 等标准组件的使用模式及事件处理规范。
Install All Skills
npx skills add home-assistant/frontend --all -g -y
Skills in Collection (11)
指导 Home Assistant 前端 UI 组件的开发与审查，涵盖 Dialog、Button、Form、Alert 等标准组件的使用模式及事件处理规范。
实现或审查 HA 前端 UI 组件
创建对话框、按钮、表单或告警
处理前端交互模式和自定义事件
npx skills add home-assistant/frontend --skill ha-frontend-components -g -y
指导 Home Assistant 前端组件从宽泛的 hass 对象迁移至细粒度 Context，优化渲染性能与测试可测性。
替换 hass 状态读取
重构组件状态访问
审查重渲染行为
npx skills add home-assistant/frontend --skill ha-frontend-contexts -g -y
用于运行和验证 Home Assistant 前端独立演示环境，处理 demo/ 目录下的文件变更及共享 stub 修改。支持本地启动、URL 导航及截图采集，需配合测试技能使用。
需要启动或停止前端演示服务
修改 demo 目录下的配置文件或共享 stub
npx skills add home-assistant/frontend --skill ha-frontend-demo -g -y
提供 Home Assistant 前端事件处理的最佳实践，涵盖 HASSDomEvent 类型使用、事件监听器实现及 fireEvent 分发规范。
实现前端事件监听器
定义自定义事件契约
使用 HASSDomEvent 类型
通过 fireEvent 分发事件
npx skills add home-assistant/frontend --skill ha-frontend-events -g -y
用于管理 Home Assistant 前端画廊的技能，涵盖 gallery/ 目录下的页面生成、演示开发、构建及验证。
修改 gallery/ 目录下的文件
运行画廊构建或开发命令
更新画廊页面描述或 TypeScript 演示
npx skills add home-assistant/frontend --skill ha-frontend-gallery -g -y
规范 Home Assistant 前端 Lit 组件开发，涵盖响应式属性、DOM 查询及渲染状态管理。用于指导组件状态实现、审查及生命周期处理，确保符合项目约定。
使用 Lit 框架开发前端组件
审查 Lit 组件代码规范
处理组件响应式状态或 DOM 访问
npx skills add home-assistant/frontend --skill ha-frontend-lit -g -y
指导 Home Assistant 前端代码审查与 PR 准备，涵盖模板使用、提交前检查清单及常见审查问题规范。
审查前端代码变更
准备前端 Pull Request
检查重复出现的审查问题
npx skills add home-assistant/frontend --skill ha-frontend-review -g -y
提供Home Assistant前端样式、主题、布局及无障碍指南，规范CSS变量使用、响应式设计与视图过渡。
编辑CSS或视觉组件结构
调整主题集成与间距
实现响应式布局或RTL支持
处理视图过渡动画
npx skills add home-assistant/frontend --skill ha-frontend-styling -g -y
Home Assistant前端测试与验证工作流，涵盖Vitest、Playwright、Lint及TypeScript检查。提供测试辅助复用指南、核心命令及生产构建管理规则，指导何时添加测试及避免冗余。
需要运行前端单元测试或E2E测试
执行代码格式化或类型检查
启动前端开发服务器
进行前端生产环境构建
npx skills add home-assistant/frontend --skill ha-frontend-testing -g -y
用于定义和审查 Home Assistant 前端 TypeScript 类型契约、共享类型及 Lit 生命周期类型，确保与后端数据源一致并遵循复用规范。
定义或审查 TypeScript 类型
检查前后端数据契约一致性
配置 Lit 组件生命周期类型
npx skills add home-assistant/frontend --skill ha-frontend-types -g -y
提供 Home Assistant 前端用户界面文案的编写与审查指南，涵盖本地化、语气风格及术语规范。适用于新增或审核标签、按钮、对话框、错误提示及翻译内容，确保文案准确且符合用户体验标准。
需要添加新的用户界面文案
审查现有 UI 字符串和翻译质量
检查文案是否符合本地化和术语规范
npx skills add home-assistant/frontend --skill ha-frontend-user-facing-text -g -y
