radix-ng-examples

Estrellas265

Forks17

Actualizado12 de julio de 2026 a las 13:33

Index of every documented @radix-ng/primitives example. Use when implementing a UI feature to find a working, copy-paste-ready Angular pattern built on the primitives. Each component links to a bundled .md file containing the full source of all its examples.

Instalación

Instalar con Codex o Claude Copia este prompt, pégalo en Codex, Claude u otro asistente, y deja que revise la página de la skill y la instale por ti.

Ejecutar en Manus

Fuente

radix-ng

radix-ng/primitives

Abrir repositorio de GitHub Ver repositorios del creador

Descarga

Ejecutar en Manus

Ocupaciones relacionadasSOC

Basado en la clasificación ocupacional SOC

Desarrolladores de softwareOcupaciones informáticas y matemáticas·SOC 15-1252

Explorador de archivos

65 archivos

SKILL.md

readonly

Más de este repositorio

mismo repositorio

project-knowledge

radix-ng/primitives

Use when you need information about this project's architecture, tech stack, coding patterns, data model, deployment setup, git workflow, or UX guidelines. Contains comprehensive project documentation including design decisions, technical specifications, and development standards.

2026-07-12265

radix-ng

radix-ng/primitives

Build correct, accessible UI with @radix-ng/primitives — the signals-first, headless Angular primitive library. Use when implementing Angular components, forms, dialogs, menus, or any UI on top of radix-ng primitives, or when styling them with a custom design system. Use when: "build a … with radix-ng", "use @radix-ng/primitives", "headless Angular component", "style radix-ng with my design system", "Angular accordion/dialog/select/…".

2026-07-12265

storybook-story

radix-ng/primitives

Write or update Storybook stories and docs MDX for a Radix NG primitive following project conventions. Use when: writing stories, updating docs, adding a new story, updating MDX, "обнови сторис", "напиши доки для", "update stories", "add story". Enforces: one-file-per-component rule, ?raw source imports, tailwindDemoDecorator, semantic tokens, docs MDX template.

2026-06-28265

testing

radix-ng/primitives

Test Radix NG primitives across every layer and pick the RIGHT one for a change: Vitest unit (zoneless), jest-axe a11y, Playwright browser regression (apps/visual-regression), SSR (apps/radix-ssr-testing), and perf benches (apps/radix-perf-testing). Enforces the rule that layout / positioning / part-visibility / opens-without-error fixes need a browser test — jsdom can't see them. Use when: writing/fixing/adding a test, "напиши тест", "добавь тест", "почему баг не поймали", "покрой тестом", "write a test", "add a regression test", "verify the fix", choosing a test type, debugging a zoneless / NG0100 / NG0951 / NG0201 test failure, or running any suite.

2026-06-28265

angular-developer

radix-ng/primitives

Angular framework reference for building this signals-first, headless directive library. Consult for API/best-practice details on reactivity (signal, computed, linkedSignal, effect, afterRenderEffect), Signal Forms, signal-based inputs/outputs, host bindings, dependency injection (inject, InjectionToken, providers, injection context, hierarchical injectors), headless accessible component patterns (ARIA), and Vitest testing. Defer to CLAUDE.md for repo-specific tooling — this is an Nx + pnpm monorepo, not an Angular CLI app.

2026-06-09265

documentation-writing

radix-ng/primitives

Maintain project documentation in .claude/skills/project-knowledge/: audit, edit, check consistency, track status. Use when: "проверь документацию", "обнови документацию", "аудит документации", "check docs", "audit documentation", "update docs", "проверь базу знаний проекта" For creating documentation from scratch use project-planning skill. For reading docs or explaining concepts, read project-knowledge skill directly.

2026-06-04265

name	radix-ng-examples
description	Index of every documented @radix-ng/primitives example. Use when implementing a UI feature to find a working, copy-paste-ready Angular pattern built on the primitives. Each component links to a bundled .md file containing the full source of all its examples.
compatibility	Requires @radix-ng/primitives installed in an Angular 21 project.
license	MIT
metadata	{"author":"radix-ng"}

Radix NG Primitives — Examples Index

Auto-generated by tools/scripts/skills/generate.mjs from the Storybook docs. Do not edit by hand — the Storybook stories are the source of truth. Generated from @radix-ng/primitives@1.1.0 — if the installed version differs, verify the API against the installed package.

Working examples built on @radix-ng/primitives. Full source is bundled offline under references/; browse visually at https://radix-ng.com.

How to use this skill

Describe the UI you want to build (e.g. "a multi-select accordion", "a form field with validation").
Find the matching component below and scan its example list.
Open the component's bundled references/components/<name>.md — it has the full Angular source of every example.
Adapt it: keep the primitive directives and data-* styling hooks, swap in the project's own design-system classes/tokens.

To style a primitive with a custom design system, pair an example with the data-attribute contract in the radix-ng skill (references/styling-contract.json).

Total: 247 examples across 43 components.