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 skills add pproenca/dot-skills --skill expo-design-system-scaffoldergit clone --depth 1 https://github.com/pproenca/dot-skillsWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/pproenca/dot-skills/expo-design-system-scaffolder)<a href="https://agentmods.dev/skills/pproenca/dot-skills/expo-design-system-scaffolder"><img src="https://agentmods.dev/badge/skills/pproenca/dot-skills/expo-design-system-scaffolder/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/pproenca/dot-skills/expo-design-system-scaffolder"><img src="https://agentmods.dev/badge/skills/pproenca/dot-skills/expo-design-system-scaffolder.svg" alt="Reviewed on agentmods" width="80" height="20"></a>- NVIDIA SkillSpector pass
What 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.1 | $0.00178 | $0.01351 |
| Opus 5 | $0.00089 | $0.00675 |
| Sonnet 5 | $0.00036 | $0.00270 |
| Haiku 4.5 | $0.00018 | $0.00135 |
Grade A, and why
expo-design-system-scaffolder 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 9d 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.
How it starts
The opening of the file, as written. The whole thing — 75 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Expo Design System Scaffolder
Parameterized templates that generate Expo / React Native design system components which start
correct instead of being retrofitted. Every template uses Unistyles v3 variants (never a style
escape hatch), ref-as-prop, design tokens, built-in accessibility, and web/iOS parity (_web
hover/focus/cursor on interactive primitives), and cites the
expo-design-system rule IDs it satisfies.
When to Apply
Use this skill when the user wants to:
- Create or add a new shared component — a button, card, text, input, or other primitive
- Scaffold a new screen that lists a domain entity (appointments, patients, notes)
- Add a new design token group (colors, etc.) to the Unistyles theme
- Add a Storybook story that catalogs a component's variants
- Start a new feature and want its components to follow the design system from the first commit
- Set up or update the design system index so agents discover and reuse existing components before building new ones
Available Templates
To scaffold: read the template, substitute the placeholders, and write the result under the
design system package (or app/ for the screen). Placeholders are single-brace identifier tokens
(e.g., {ComponentName}); literal TSX and Unistyles braces (e.g., { variant }, {item.title})
stay as-is.
| Template | Generates | Placeholders |
|---|---|---|
variant-component.tsx.template |
Pressable primitive with variant/size variants, press/disabled states, web hover/focus/cursor, accessibility, ref prop |
{ComponentName} {file_path} |
card-surface.tsx.template |
Composite surface with leading/trailing/children slots, tone/inset variants, elevation token |
{ComponentName} {file_path} |
text-primitive.tsx.template |
Typed text component with variant/tone, no raw style, capped font scaling |
{ComponentName} {file_path} |
form-field.tsx.template |
Labeled input: controlled/uncontrolled, ref prop, error variant, web focus ring, accessibility |
{ComponentName} {file_path} |
list-screen.tsx.template |
Entity list composed from primitives: FlashList, memoized row, web row hover/cursor, safe-area insets | {ScreenName} {Entity} {entity} {entity_plural} {route_path} {file_path} |
token-group.ts.template |
Raw → semantic → component token group to merge into the Unistyles theme | {token_group} {file_path} |
component-story.tsx.template |
Storybook story rendering every variant side by side | {ComponentName} {file_path} |
component-index.ts.template |
The design system's single public entry and inventory catalog — agents read it before styling to reuse what exists (reuse-first) | {file_path} |
What ships with it
12 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
- assets/templates/card-surface.tsx.template 1.6 KB
- assets/templates/component-index.ts.template 2.1 KB
- assets/templates/component-story.tsx.template 1.1 KB
- assets/templates/form-field.tsx.template 2.5 KB
- assets/templates/list-screen.tsx.template 2.3 KB
- assets/templates/text-primitive.tsx.template 1.4 KB
- assets/templates/token-group.ts.template 1.1 KB
- assets/templates/variant-component.tsx.template 2.5 KB
- config.json 366 B
- gotchas.md 614 B
- metadata.json 1.4 KB
- references/conventions.md 5.1 KB
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.
- 9d ago First seen · 75 lines · 178 tokens per session scan A 40cad8f4c6c9
expo-design-system-scaffolder is a skill published in the GitHub repository pproenca/dot-skills (207 stars, last pushed 27d ago), licensed MIT. It adds 178 tokens to every session and 1,351 once invoked, about $0.0009 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-09-03.
Other skills, from other repositories
expo-design-system
Framework (OSS). Build and maintain a design system inside an Expo app - a reusable theme of design tokens (color, spacing, typography, radius, shadow, motion), reusable component structure with variant/size/state prop conventions, and rules for when to extract a repeated view into a shared component. Use when…
flutter-build-responsive-layout
Use LayoutBuilder, MediaQuery, or Expanded/Flexible to create a layout that adapts to different screen sizes. Use when you need the UI to look good on both mobile and tablet/desktop form factors.
display-glasses-with-jetpack-compose-glimmer
Provides guidelines for developing projected Android XR apps for display glasses using the Jetpack Compose Glimmer UI toolkit. This skill covers foundational Glimmer design principles, workflows for implementing Jetpack Compose Glimmer, and interaction models for the glasses form factor. Use this skill to build an…
omh-apple-design
This is a Hermes-native apple-design workflow skill.
axiom-audit-liquid-glass
Use when the user mentions Liquid Glass review, iOS 26 UI updates, toolbar improvements, or visual effect migration.
axiom-audit-ux-flow
Use when the user mentions UX flow issues, dead-end views, dismiss traps, missing empty states, broken user journeys, or wants a UX audit of their iOS app.