Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add skills/12-studio/tackl/react-context-setupnpx skills add 12-Studio/Tackl --skill react-context-setupgit clone --depth 1 https://github.com/12-Studio/TacklWhat it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5 | $0.00065 | $0.00380 |
| Opus 5 | $0.00032 | $0.00190 |
| Sonnet 5 | $0.00013 | $0.00076 |
| Haiku 4.5 | $0.00006 | $0.00038 |
Grade A, and why
react-context-setup scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
What it actually says
React Context Setup
Overview
This skill provides automated assistance for react context setup tasks within the Frontend Development domain.
When to Use
This skill activates automatically when you:
- Mention "react context setup" in your request
- Ask about react context setup patterns or best practices
- Need help with frontend skills covering react, vue, css, accessibility, performance optimization, and modern web development patterns.
Instructions
- Provides step-by-step guidance for react context setup
- Follows industry best practices and patterns
- Generates production-ready code and configurations
- Validates outputs against common standards
Examples
Example: Basic Usage Request: "Help me with react context setup" Result: Provides step-by-step guidance and generates appropriate configurations
Prerequisites
- Relevant development environment configured
- Access to necessary tools and services
- Basic understanding of frontend development concepts
Output
- Generated configurations and code
- Best practice recommendations
- Validation results
Error Handling
| Error | Cause | Solution |
|---|---|---|
| Configuration invalid | Missing required fields | Check documentation for required parameters |
| Tool not found | Dependency not installed | Install required tools per prerequisites |
| Permission denied | Insufficient access | Verify credentials and permissions |
Resources
- Official documentation for related tools
- Best practices guides
- Community examples and tutorials
Related Skills
Part of the Frontend Development skill category. Tags: react, vue, css, accessibility, web
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 2d ago First seen · 65 lines · 65 tokens per session scan A dac2a89a58d2
react-context-setup is a skill published in the GitHub repository 12-Studio/Tackl (10 stars, last pushed 6d ago), licensed MIT. It adds 65 tokens to every session and 380 once invoked, about $0.0003 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
table-state
Read automatically reactive Alpine table APIs in bindings and own slices with Alpine.reactive getters plus onChange or external TanStack Store atoms. Load for controlled state, updater callbacks, selector gating, atom precedence, or code incorrectly adding table.Subscribe.
aggregation
Aggregate TanStack Table columns independently of grouping, including grand totals, caller-selected row totals, multiple keyed aggregations, custom context-based definitions, grouped merges, manual values, and worker constraints.
cell-spanning
Merge adjacent body cells with cellSpanningFeature: value-based rowSpan opt-in per column via spanRows, per-row colSpan via spanColumns, and the covered-cell convention where a span of 0 means skip the cell. Load for merged data grids, spans that disappear after sorting or paginating, ragged table rows, or a cell that…
getting-started
Create an Alpine TanStack Table v9 table with createTable, explicit tableFeatures, Alpine.reactive data getters, x-for rendering, and FlexRender through x-html. Load for first-table setup, reactive options, or when nested Alpine directives rendered by x-html do not initialize.
with-tanstack-query
Compose Angular Query with signal-owned Table filtering, sorting, and pagination state using reactive query options, manual row-model boundaries, direct query data, server counts, and valid injection context.
with-tanstack-virtual
Virtualize Angular Table final row or column models inside the correct injection and reactive lifecycle with signal counts, scroll elements, keys, measurement, transforms, sticky regions, grid/flex sizing, and infinite data.