Nasaq UI
Nasaq design system docs for agents: 390 components for React, Vue, Blade and HTML, with Arabic RTL.
¿Debería usar esto?
Calidad y seguridad
Hallazgos (2)
- HIGH
- MEDIUMen get_setup
Basado en el análisis automatizado de las definiciones de herramientas y el cumplimiento del protocolo.
Costo de contexto
Este es el número aproximado de tokens que se consumen cada vez que las herramientas del servidor se cargan en el contexto de un modelo. Los recuentos más altos reducen la atención disponible para otras tareas.
Instalar
Instalación con un clic
Agrega esto a tu archivo `claude_desktop_config.json`:
{
"mcpServers": {
"nasaq": {
"url": "https://mcp.nasaqui.com/mcp"
}
}
}Puntos de conexión remotos
https://mcp.nasaqui.com/mcpstreamable-httpQué puede hacer
Inventario de herramientas
Herramientas (6)
🟢list_components(category, query, framework)
Lists every Nasaq web component with its category, status, one-line summary and exports. Filter by category or a text query. With a non-React `framework`, lists only the components that exist in that stack.
Esquema de entrada
{
"type": "object",
"properties": {
"category": {
"description": "Only this category",
"type": "string",
"enum": [
"account",
"actions",
"admin",
"ai",
"ai-agents",
"alerts",
"analytics",
"auth",
"billing",
"bookings",
"brand",
"charts",
"chat",
"collaboration",
"crm",
"data-display",
"delivery",
"developer-tools",
"editors",
"feedback",
"feedback-sdk",
"files",
"form-builders",
"forms",
"gamification",
"healthcare",
"integrations",
"keyboard",
"layout",
"marketing",
"monitoring",
"navigation",
"onboarding",
"overlays",
"pickers",
"platforms",
"pricing",
"productivity",
"security",
"seo",
"server-tools",
"store",
"store-admin",
"typography",
"utilities",
"website",
"wellness",
"work",
"workflow"
]
},
"query": {
"description": "Free-text filter, e.g. 'table' or 'menu'",
"type": "string"
},
"framework": {
"description": "Default react (@fadymondy/nasaq/web). shadcn: the same React components copied by the shadcn CLI. inertia / inertia-vue: Laravel + Inertia. vue / nuxt / inertia-vue: Vue 3. blade / livewire / filament / laravel / tomatophp: Laravel Blade components. html / alpine: rendered HTML run by Alpine.",
"type": "string",
"enum": [
"react",
"shadcn",
"inertia",
"inertia-vue",
"html",
"alpine",
"vue",
"nuxt",
"blade",
"livewire",
"filament",
"laravel",
"tomatophp"
]
}
},
"$schema": "http://json-schema.org/draft-07/schema#"
}🟢search_components(query, limit)
Ranks components for a need described in words, e.g. 'switch between products', 'empty state', 'keyboard shortcut'.
Esquema de entrada
{
"type": "object",
"properties": {
"query": {
"type": "string",
"minLength": 1
},
"limit": {
"type": "integer",
"minimum": 1,
"maximum": 30
}
},
"required": [
"query"
],
"$schema": "http://json-schema.org/draft-07/schema#"
}🟢get_component(name, include, framework)
Returns one component's details and manual. `name` may be the folder (app-shell), the title (AppShell) or any export (SidebarItem). `include` picks what to return: readme (default, full manual), api (API section only), examples, source (TSX), story (Storybook CSF), all. `framework` returns the component in another stack (html, alpine, vue, blade, livewire, filament, inertia, shadcn, …).
Esquema de entrada
{
"type": "object",
"properties": {
"name": {
"type": "string",
"minLength": 1
},
"include": {
"description": "Default: ['readme']",
"type": "array",
"items": {
"type": "string",
"enum": [
"readme",
"api",
"examples",
"source",
"story",
"all"
]
}
},
"framework": {
"description": "Default react (@fadymondy/nasaq/web). shadcn: the same React components copied by the shadcn CLI. inertia / inertia-vue: Laravel + Inertia. vue / nuxt / inertia-vue: Vue 3. blade / livewire / filament / laravel / tomatophp: Laravel Blade components. html / alpine: rendered HTML run by Alpine.",
"type": "string",
"enum": [
"react",
"shadcn",
"inertia",
"inertia-vue",
"html",
"alpine",
"vue",
"nuxt",
"blade",
"livewire",
"filament",
"laravel",
"tomatophp"
]
}
},
"required": [
"name"
],
"$schema": "http://json-schema.org/draft-07/schema#"
}🟢get_foundation(topic)
Design rules behind the components: colour roles, layout and density, architecture, brand/logo rules, README spec. Omit `topic` to list topics.
Esquema de entrada
{
"type": "object",
"properties": {
"topic": {
"type": "string"
}
},
"$schema": "http://json-schema.org/draft-07/schema#"
}🟢list_tokens(prefix, limit)
CSS custom properties (--nq-*) with their value in each context (light, dark, brand, density). Filter by prefix, e.g. '--nq-danger' or 'surface'. In Tailwind use them as utilities: bg-nq-surface, text-nq-fg-muted, border-nq-border.
Esquema de entrada
{
"type": "object",
"properties": {
"prefix": {
"type": "string"
},
"limit": {
"type": "integer",
"minimum": 1,
"maximum": 500
}
},
"$schema": "http://json-schema.org/draft-07/schema#"
}🟢get_setup(framework)
Install command, CSS imports, provider and the usual app skeleton. Call once before building UI. `framework` picks the guide: react (default), shadcn, inertia, html, alpine, vue, or blade/livewire/filament/laravel/tomatophp.
Esquema de entrada
{
"type": "object",
"properties": {
"framework": {
"description": "Default react (@fadymondy/nasaq/web). shadcn: the same React components copied by the shadcn CLI. inertia / inertia-vue: Laravel + Inertia. vue / nuxt / inertia-vue: Vue 3. blade / livewire / filament / laravel / tomatophp: Laravel Blade components. html / alpine: rendered HTML run by Alpine.",
"type": "string",
"enum": [
"react",
"shadcn",
"inertia",
"inertia-vue",
"html",
"alpine",
"vue",
"nuxt",
"blade",
"livewire",
"filament",
"laravel",
"tomatophp"
]
}
},
"$schema": "http://json-schema.org/draft-07/schema#"
}Comunidad
Evidencia