AgentHubAgentHub

Agent Skills

共 274 个资源 · Agent Skill 是带 SKILL.md 的指令包。安装后，AI 会根据 description 在匹配任务时自动加载，无需每次手动粘贴提示词。

来源：全部来源ClawHub
Skill 热门：pdfreactbrainstormtestingdesignwritingsecuritydeploy

“react” 共 274 个结果

react-compose-with-tanstack-virtual

vbeta

SkillSkillsMP

io.github.TanStack/table/compose-with-tanstack-virtual

`@tanstack/react-table` v9 does NOT include virtualization — pair with `@tanstack/react-virtual`. Standard row-virtualization pattern: get the row array from `table.getRowModel().rows`, feed `rows.length` to `useVirtualizer({ count, estimateSize, getScrollElement, ... })` in the DEEPEST possible component (a `TableBody`, NOT `App`), iterate `rowVirtualizer.getVirtualItems()` instead of `rows.map`, absolute-position each row with `transform: translateY(virtualRow.start)px`, and render `<tbody>` as a CSS grid with a fixed total height. Column virtualization uses `horizontal: true` plus padding-left/right placeholder cells. An experimental ref-mutation variant skips React reconciliation for ~10% extra perf but the standard pattern is the default.

source
在 SkillsMP 查看

react18-legacy-context

vmain

SkillSkillsMP

io.github.github/awesome-copilot/react18-legacy-context

Provides the complete migration pattern for React legacy context API (contextTypes, childContextTypes, getChildContext) to the modern createContext API. Use this skill whenever migrating legacy context in class components - this is always a cross-file migration requiring the provider AND all consumers to be updated together. Use it before touching any contextTypes or childContextTypes code, because migrating only the provider without the consumers (or vice versa) will cause a runtime failure. Always read this skill before writing any context migration - the cross-file coordination steps here prevent the most common context migration bugs.

source
在 SkillsMP 查看

mobile-accessibility

vmain

SkillSkillsMP

io.github.Community-Access/accessibility-agents/mobile-accessibility

Mobile accessibility specialist for React Native, Expo, iOS (SwiftUI/UIKit), and Android (Jetpack Compose/Views). Audits accessibilityLabel, accessibilityRole, accessibilityHint, touch target sizes, screen reader compatibility, and platform-specific semantics. Use for any React Native or native mobile code review - approximately 60% of web traffic is mobile and most UI accessibility tooling ignores mobile-specific patterns.

source
在 SkillsMP 查看

react-compose-with-tanstack-form

vbeta

SkillSkillsMP

io.github.TanStack/table/compose-with-tanstack-form

Editable cells for `@tanstack/react-table` v9 via `@tanstack/react-form`. The table is the layout primitive; the form owns editing state. Use `createFormHook` to register reusable field components (`TextField`, `NumberField`, `SelectField`), then in each column's `cell` return `<form.AppField name={`data[${row.index}].field`}>{(field) => <field.TextField />}</form.AppField>`. Critical typing gotcha: if your row has a recursive `subRows`, use `Omit<Row, 'subRows'>` for the form row type — TanStack Form's `DeepKeys` recurses and hits TS2589. Subscribe to `form.state.values.data.length` (not the whole array) for row add/remove re-renders.

source
在 SkillsMP 查看

react-compose-with-tanstack-store

vbeta

SkillSkillsMP

io.github.TanStack/table/compose-with-tanstack-store

`@tanstack/react-table` v9 is built on TanStack Store. Each state slice (sorting, pagination, rowSelection, columnFilters, …) is a separate atom. The table exposes three READ surfaces — `table.atoms.<slice>` (per-slice readonly), `table.store` (flat readonly view), `table.state` (selector output from `useTable`) — and two WRITE paths — internal `table.baseAtoms.<slice>` OR YOUR `options.atoms[slice]` if you opt to own the slice. Use `useCreateAtom` from `@tanstack/react-store` for stable identity, `useSelector` for fine-grained reads, and pass the atom in `options.atoms` so the table writes through it directly — no `on*Change` handler required.

source
在 SkillsMP 查看
上一页6 / 12下一页
Agent Skills · AgentHub