Web & Frontend

assistant-ui-skills Bundle

Grounding an assistant in your app with assistant-ui copilots (@assistant-ui/react). Use when steering assistant behavior with useAssistantInstructions, feeding lazy send-time app state through useAssistantContext({ getContext }), exposing rendered components to the assistant with makeAssistantVisible(Component, { clickable, editable }), giving the model two-way component state through interactables (unstable_useInteractable for app-scoped panels, unstable_interactableTool inside defineToolkit for thread-scoped artifacts, both mounted via AuiConfig({ unstable_interactables: unstable_Interactables() })), registering instructions and tools together imperatively with aui.modelContext.register({ getModelContext }), or bridging model context across an iframe boundary with AssistantFrameProvider and useAssistantFrameHost. The legacy Interactables() scope, useAssistantInteractable, and useInteractableState are deprecated since 2026-06-14 and scheduled for removal on or after 2026-09-14; new code uses the unstable_ A

assistant-ui-skills Bundle

Installs and customizes assistant-ui elements, the styled shadcn-style component catalog at assistant-ui.com/elements served from the r.assistant-ui.com registry through `npx assistant-ui@latest add <item>`. Use when adding a prebuilt chat surface or widget (Thread, ThreadList, AssistantModal, AssistantSidebar, ToolFallback, ToolGroup, MarkdownText, Reasoning, Sources, Attachment, ModelSelector, Voice orb, McpConfig) or one of the 120 standalone elements (approval card, agent plan, code diff, data table, chart, trace waterfall, message queue, composer variants, and so on), choosing between runtime-connected `<name>.aui.tsx` files and props-driven standalone files, overriding Thread slots through the `components` prop, editing the copied source under `components/assistant-ui/elements/`, using the shared `surfaces.tsx` tokens, or picking the Radix versus Base UI flavor through the style-aware registry URL in `components.json`. Route here when an import from `@/components/assistant-ui/...` fails, an element rend

assistant-ui-skills Bundle

Adds user managed browser MCP servers to assistant-ui with `@assistant-ui/react-mcp`. Use when mounting `McpManagerResource`, declaring `defineConnector` presets, persisting custom servers and OAuth state, composing `McpManagerPrimitive`, `McpServerPrimitive`, `McpAddFormPrimitive`, or `McpElicitationPrimitive`, handling an OAuth callback, browsing MCP resources, or diagnosing missing server tools, connection failures, and OAuth redirects. This covers end user chosen servers, not application owned backend MCP tools. For those use tools; for the chat runtime use runtime; for the copied dialog use elements.

assistant-ui-skills Bundle

Streaming wire protocols and backend helpers for assistant-ui, built on the assistant-stream package. Use when building a custom streaming endpoint (one that does not go through the Vercel AI SDK) with createAssistantStreamResponse, createAssistantStream, or createAssistantStreamController; writing to the returned AssistantStreamController through appendText, appendReasoning, appendSource, appendFile, appendData, addTextPart, addReasoningPart, or addToolCallPart (whose result exposes argsText and setResponse); choosing between the Data Stream protocol (useDataStreamRuntime from @assistant-ui/react-data-stream, DataStreamEncoder and DataStreamDecoder) and the Assistant Transport protocol (AssistantTransportEncoder and AssistantTransportDecoder, the useAssistantTransportRuntime state snapshot runtime); decoding a response with AssistantStream.fromResponse, UIMessageStreamDecoder, or PlainTextDecoder; or wiring resumable streams through assistant-stream/resumable (createResumableStreamContext, createResumableSes

assistant-ui-skills Bundle

Builds and customizes assistant-ui chat UI from composable, unstyled @assistant-ui/react primitives that follow Radix-style part composition: ThreadPrimitive (.Root, .Viewport, .ViewportProvider, .ViewportFooter, .Messages, .MessageByIndex, .Unstable_MessageById, .ScrollToBottom, .Suggestions), ComposerPrimitive (.Input, .Send, .Cancel, .Attachments, .AddAttachment, .AttachmentDropzone, .Quote, .Dictate, .Queue, the Unstable_TriggerPopover family for mentions and slash commands), MessagePrimitive (.Parts, .GroupedParts, .Attachments, .Quote, .GenerativeUI, .Error) and MessagePartPrimitive, ActionBarPrimitive plus ActionBarMorePrimitive, BranchPickerPrimitive, AttachmentPrimitive, ErrorPrimitive, AssistantModalPrimitive, ChainOfThoughtPrimitive, SelectionToolbarPrimitive, SuggestionPrimitive, QueueItemPrimitive, and the ThreadList primitives. Use when assembling or styling a custom Thread, Composer, message list, action bar, branch picker, mention or slash command popover, or suggestion grid from building bloc

assistant-ui-skills Bundle

Overview and router for assistant-ui, the React library for building AI chat interfaces from composable primitives and a styled elements catalog. Use for high-level, cross-cutting, or architecture questions: choosing packages, picking a runtime, or understanding the layers (elements, primitives, the aui client with AuiConfig and AuiProvider, the runtime, adapters) and the message model. Covers `@assistant-ui/react` 0.15.x, the framework-neutral `@assistant-ui/ai-sdk` integration for AI SDK v7 (`useChatRuntime`, `AssistantChatTransport`; `@assistant-ui/react-ai-sdk` re-exports it), `@assistant-ui/core`, `@assistant-ui/store`, `assistant-stream`, `assistant-cloud`, the adapters for LangGraph, LangChain, Google ADK, A2A, AG-UI, Eve, OpenCode, and Pi, and the platform bindings `@assistant-ui/react-native` and `@assistant-ui/react-ink`; `AssistantRuntimeProvider`; the primitives `ThreadPrimitive`, `MessagePrimitive`, `ComposerPrimitive`; the hooks `useAui`, `useAuiState`, `useAuiEvent`; and runtime selection acros

assistant-ui-skills Bundle

Build assistant-ui chat experiences for Expo and bare React Native with `@assistant-ui/react-native` and `@assistant-ui/ai-sdk`. Use when setting up an absolute mobile chat endpoint, `AssistantRuntimeProvider`, `useChatRuntime`, `AssistantChatTransport`, native `ThreadPrimitive`, `ComposerPrimitive`, `MessagePrimitive`, thread lists, attachments, React Native styles, `Metro` `withAui` for a `"use generative"` toolkit, local or remote thread adapters, or migrating a web chat surface to iOS and Android. Route here when a relative API URL fails on device, a native primitive lacks runtime state, `Metro` does not compile a toolkit, or web Elements are being used in a native app. Route web setup and DOM primitive work to `../setup/SKILL.md` and `../primitives/SKILL.md`.

assistant-ui-skills Bundle

Lets the model compose interfaces at runtime from a component vocabulary instead of one hand-written component per tool, and covers every generative UI pattern in the framework. Use for the model-driven present tool: JSONGenerativeUI, defaultGenerativeUILibrary, and present({ display }) from @assistant-ui/react-generative-ui, registered through AuiConfig({ tools: Tools({ toolkit }) }). Also covers the backend-driven MessagePrimitive.GenerativeUI primitive and its component allowlist for a server that already emits generative-ui message parts, the Slack Block Kit and Microsoft Teams Adaptive Card renderers and their action decoders, A2UI surfaces over AG-UI, and the third-party OpenUI integration. Route here when the model should design its own layout rather than fill one you wrote, when an unknown $type or component name throws or silently renders nothing, when a generative UI tree needs to post to Slack or Teams or paint an A2UI surface, or when generative UI, present tool, or component vocabulary comes up.

assistant-ui-skills Bundle

Instruments assistant-ui AI SDK backend routes with Langfuse, LangSmith, or Helicone, and renders independent trace data with the experimental @assistant-ui/react-o11y SpanResource and SpanPrimitive APIs. Use it when traces are missing, serverless spans are dropped, an AI SDK call needs provider metadata, Helicone is not proxying a provider, or a trace tree or timeline needs rendering. For streaming transport use streaming, for initial application wiring use setup, for Assistant Cloud persistence use cloud, and for copied styled trace UI use elements.

daangn Bundle

한 SEED 컴포넌트의 React·Lynx 공개 API와 사용자 결과 차이를 읽기 전용으로 비교할 때 사용한다.

daangn Bundle

한 SEED 컴포넌트의 구현·공개 export·Registry·문서·테스트 경로를 읽기 전용으로 찾을 때 사용한다.

daangn Bundle

SEED 컴포넌트의 플랫폼·공개 표면을 정하고 구현·문서·검증을 연결할 때 사용한다.

daangn Bundle

SEED 컴포넌트 작업을 여러 에이전트로 나누거나 레이어 사이의 구현 계약과 검증을 조율할 때 사용한다.

daangn Bundle

Lynx 컴포넌트의 문서·예제·런타임 결과를 환경별로 검증할 때 사용한다.

daangn Bundle

Lynx 컴포넌트 문서와 실행 예제를 React 대응과 맞춰 작성·수정할 때 사용한다.

fal-ai-community Bundle

Upgrade a coded website to award-tier, editorially-crafted design using fal.ai. Takes a local HTML file or a dev-server URL, screenshots it, has an opus-4.7 vision model write a gpt-image-2 edit prompt, uses fal-ai/gpt-image-2/edit to produce the redesigned reference image, then opus-4.7 vision writes a Markdown build-spec with a "Hard constraints" section + a tokens.json. Also supports iterate (screenshot implemented site → delta-spec vs reference) and greenfield generate (brief → mockup → single-file HTML). Invoke when the user says "improve the design", "make it world-class", "redesign this landing page", "upgrade this site", "design pass", or points at a local HTML / dev server for a visual review.

gluestack Skill

Enforces constrained, opinionated styling patterns for gluestack-ui v5 (Tailwind CSS v4, NativeWind v5 / UniWind). Main overview skill that coordinates specialized sub-skills for setup, components, styling, variants, performance, and validation.

gluestack Skill

Guide for installing gluestack-ui v5 — CLI and manual paths for NativeWind v5 and UniWind. Tailwind CSS v4 (CSS-first, no tailwind.config.js).

gluestack Skill

Styling patterns for gluestack-ui v5 - covers semantic tokens, spacing, dark mode (NativeWind v5 + UniWind), variants with tva, CSS variables, and className merging.

gluestack Skill

Component usage patterns for gluestack-ui v4 - covers component selection, props vs className, compound patterns, icons, and provider setup.

gluestack Skill

Component usage patterns for gluestack-ui v5 - covers component selection, props vs className, compound patterns, icons, and provider setup (NativeWind v5 + UniWind).

gluestack Skill

Validation checklist and anti-patterns for gluestack-ui v5 - use for code review, checking implementation quality, and identifying common mistakes including Tailwind v4-specific issues.

gluestack Skill

Step-by-step guide for creating components with gluestack-ui v4 - covers planning, structure, styling, TypeScript, and common component patterns.

gluestack Skill

Step-by-step guide for creating components with gluestack-ui v5 (Tailwind v4 CSS-first) - covers planning, structure, styling, TypeScript, and common component patterns.

millionco-react-doctor Skill

Diagnose React runtime performance with React Doctor traces, live render outlines, Long Animation Frames, interaction timing, and component render evidence. Use when invoked as `/performance` for a slow interaction, unexpected re-renders, or a measured before-and-after comparison.

millionco-react-doctor Skill

Fuzz React Doctor rules for crashes, slowness, false positives, and mutation-sensitive diagnostics with @react-doctor/fuzz. Use after rule tests pass, when investigating a fuzz finding, or whenever an eval, review, or user report confirms a new false positive.

millionco-react-doctor Bundle

Use when finishing a feature, fixing a bug, before committing React code, or when the user types `/doctor`, asks to scan, triage, or clean up React diagnostics. Covers lint, accessibility, bundle size, architecture. Includes a regression check and a full local-triage workflow that fetches the canonical playbook.

millionco-react-doctor Skill

Audit and fix Three.js and React Three Fiber apps for frame-loop performance, GPU memory leaks, scene-graph correctness, and visual defects like z-fighting, shadow acne, wrong color space, and broken resize handling. Uses React Doctor as the scanning engine plus a visual rubric checked against rendered output. Use when the user asks to improve, audit, scan, or clean up a Three.js, R3F, react-three-fiber, drei, or WebGL app, or types `/improve-threejs`.

millionco-react-doctor Skill

Run a targeted local React Doctor Evals loop against an uncommitted rule change. Use after focused rule tests pass, while inspecting real open-source hits, or when rule-validate needs local false-positive evidence before pull request parity.

millionco-react-doctor Bundle

Compare React Doctor diagnostics for a GitHub pull request (PR) with Daytona. Use when asked to run parity, check a PR for diagnostic regressions, compare a PR with its base, or report added and removed diagnostics.

millionco-react-doctor Skill

Implement React Doctor rules from a validated contract. Use when writing oxlint rules, planning syntax or control-flow detection, designing adversarial tests, reusing syntax tree utilities, or updating rule registration.

millionco-react-doctor Skill

Define a precise React Doctor rule contract before implementation. Use when validating a rule idea, collecting official or open-source evidence, identifying false-positive traps, choosing detector precision, or setting first-version boundaries.

millionco-react-doctor Skill

Validate an implemented React Doctor rule before merge. Use after focused tests pass to review detector correctness, inspect open-source hits, run pull request parity, add regression coverage, prepare a changeset, write pull request copy, or address review findings.

millionco-react-doctor Skill

Think like a product manager before changing React Doctor's public surface — CLI commands/flags, the 0–100 score, config (doctor.config.*), the JSON report schema, package APIs (inspect()/diagnose()), the GitHub Action, the website, and the canonical prompts. A step-by-step runbook for a user-facing change — locate the surface, search for a reuse candidate, wire one telemetry metric, add the compatibility artifacts (changeset / schemaVersion / action tag), update docs, and record a kill metric. Not for lint rules, which have their own pipeline. Also runs when the user types `/product-thinking`.

millionco-react-doctor Bundle

Audit React Doctor against ReactBench or similar diagnostic benchmark corpora for confirmed false positives, false negatives, taxonomy gaps, and verifier artifacts. Use when analyzing rd.log, rd-before.json, rd-after.json, model.patch, result.json, reward/test logs, rule distributions, or when asked to perform a second adversarial pass over React Doctor benchmark findings.

sonofmagic Bundle

面向 weapp-vite monorepo 的文档、website 与公开 skills 同步工作流。适用于源码能力变化后同步配置、CLI、React/Wevu/Vue SFC、多平台、mpcore、README、packaged docs、脚手架 `AGENTS.md`、AI skills 元数据和触发回归入口。