@devalok/shilp-sutra 0.47.0 → 0.49.0

package/llms.txt

@@ -1,12 +1,12 @@
 # @devalok/shilp-sutra
 
-> Radix UI + Tailwind 4 (CSS-first) + CVA design system for Devalok apps, v0.47.0.
+> Radix UI + Tailwind 4 (CSS-first) + CVA design system for Devalok apps, v0.49.0.
 > Built on the same primitives as shadcn/ui but with DIFFERENT prop APIs — never guess from shadcn knowledge; verify every prop.
 > This file is a ROUTER: it tells you what exists and where to get details. Do not look for prop tables here — fetch them per component (MCP tool or per-component doc file below).
 
 ## How to get component details (in priority order)
 
-1. **shilp-sutra MCP** (if connected): `get_component(name)` — version-exact props/variants/examples/composition as JSON. Also: `find_component(query)`, `get_tokens(category)`, `get_setup(framework)`, `upgrade(from, to)`, `search_docs(query)`. Pass your installed version (`node_modules/@devalok/shilp-sutra/package.json`) as `version` on every call.
+1. **shilp-sutra MCP** (if connected): `get_component(name)` — version-exact props/variants/examples/composition as JSON. Also: `find_component(query)`, `get_tokens(category)`, `get_setup(framework)`, `upgrade(from, to)`, `search_docs(query)`. **Setting up in a project?** `detect_framework(packageJson)` → `get_setup(framework)` → `preflight(framework, imports)` (peer installs) → `validate_snippet(code)` before writing → `verify_setup(...)`. Pass your installed version (`node_modules/@devalok/shilp-sutra/package.json`) as `version` on every call.
    Connect: `claude mcp add --transport http shilp-sutra https://shilp-sutra.devalok.in/mcp`
 2. **No MCP?** Read the single per-component file linked in the index below (`node_modules/@devalok/shilp-sutra/docs/components/...`, ~3K tokens each). Read only the components you need — never bulk-read the directory.
 3. **Machine-readable everything**: `mcp-manifest.json` at the package root (all props/tokens/composition as JSON, react-docgen shape). Prefer targeted reads of it over any prose.
@@ -65,6 +65,7 @@ Format: `[name](doc path): summary`. Import paths follow `@devalok/shilp-sutra/<
 - [data-table-toolbar](docs/components/ui/data-table-toolbar.md)
 - [devalok-grain](docs/components/ui/devalok-grain.md)
 - [dialog](docs/components/ui/dialog.md)
+- [dot](docs/components/ui/dot.md): A small semantic status/indicator dot — the low-level primitive behind status pills, presence indicators, legend swatches, and `StatusDot`
 - [dropdown-menu](docs/components/ui/dropdown-menu.md)
 - [file-upload](docs/components/ui/file-upload.md)
 - [form](docs/components/ui/form.md)
@@ -83,7 +84,7 @@ Format: `[name](doc path): summary`. Import paths follow `@devalok/shilp-sutra/<
 - [oauth-button](docs/components/ui/oauth-button.md)
 - [pagination](docs/components/ui/pagination.md)
 - [popover](docs/components/ui/popover.md)
-- [progress](docs/components/ui/progress.md)
+- [progress](docs/components/ui/progress.md): A linear progress bar
 - [progress-ring](docs/components/ui/progress-ring.md)
 - [radio](docs/components/ui/radio.md)
 - [search-input](docs/components/ui/search-input.md)
@@ -98,7 +99,6 @@ Format: `[name](doc path): summary`. Import paths follow `@devalok/shilp-sutra/<
 - [stack](docs/components/ui/stack.md)
 - [stat-card](docs/components/ui/stat-card.md)
 - [stat-flash](docs/components/ui/stat-flash.md)
-- [status-dot](docs/components/ui/status-dot.md)
 - [stepper](docs/components/ui/stepper.md)
 - [surface](docs/components/ui/surface.md): The low-level elevated container primitive
 - [switch](docs/components/ui/switch.md)
@@ -141,6 +141,7 @@ Format: `[name](doc path): summary`. Import paths follow `@devalok/shilp-sutra/<
 - [page-header](docs/components/composed/page-header.md)
 - [page-skeletons](docs/components/composed/page-skeletons.md): Exports: DashboardSkeleton, ProjectListSkeleton, TaskDetailSkeleton
 - [priority-indicator](docs/components/composed/priority-indicator.md)
+- [responsive-modal](docs/components/composed/responsive-modal.md)
 - [rich-chat-input](docs/components/composed/rich-chat-input.md): Compact rich text chat input for unified human+AI workspaces
 - [rich-text-editor](docs/components/composed/rich-text-editor.md): Exports: RichTextEditor, RichTextViewer
 - [schedule-view](docs/components/composed/schedule-view.md)
@@ -157,6 +158,13 @@ Format: `[name](doc path): summary`. Import paths follow `@devalok/shilp-sutra/<
 - [sidebar](docs/components/shell/sidebar.md)
 - [top-bar](docs/components/shell/top-bar.md)
 
+### ai
+- [ai-command-provider](docs/components/ai/ai-command-provider.md): Context provider for the AI command system
+- [block-renderer](docs/components/ai/block-renderer.md): Renders an ordered list of typed AI "blocks" — the structured chunks an assistant/ server emits instead of plain text
+- [command-bar](docs/components/ai/command-bar.md): A unified AI command input with three layout variants
+- [conversation](docs/components/ai/conversation.md): A scrollable AI conversation thread: user + assistant turns, streaming processing steps, an agent header, and structured content blocks (rendered via BlockRenderer) with confirm/cancel/undo action support
+- [devadoot-icon](docs/components/ai/devadoot-icon.md): The animated Devalok chakra glyph — the visual identity for the AI command system
+
 ## Tokens
 
 Categories: color, spacing (`ds-01`…), typography (`text-ds-*`), radius (`rounded-ds-*`), shadow (`shadow-raised`/`shadow-overlay`/…), motion, z-layers. Full reference: `get_tokens(category)` via MCP, or the `tokens` object in `mcp-manifest.json`.

package/make-kit/components/form.md

@@ -69,7 +69,7 @@ Use inside a custom control to consume FormField context.
 
 | Control | Manual wiring needed |
 |---|---|
-| `<Select>` / `<SelectTrigger>` | Set `color="error"` on `SelectTrigger` from your validation state. |
+| `<Select>` / `<SelectTrigger>` | Set `state="error"` on `SelectTrigger` from your validation state. |
 | `<Checkbox>`, `<Radio>`, `<Switch>` | Pair `<Label htmlFor>` manually. State is visual on the control. |
 
 ## Examples
@@ -134,7 +134,7 @@ The Input receives `aria-describedby` (linked to FormHelperText), `aria-invalid=
     <FormField state={errors.role ? 'error' : 'helper'}>
       <Label htmlFor="role">Role</Label>
       <Select>
-        <SelectTrigger id="role" color={errors.role ? 'error' : 'default'}>
+        <SelectTrigger id="role" state={errors.role ? 'error' : 'default'}>
           <SelectValue placeholder="Choose a role" />
         </SelectTrigger>
         <SelectContent>

package/make-kit/components/icon.md

@@ -14,7 +14,7 @@ For the broader icon system (which icons exist, how to register custom ones, the
 - Any inline SVG icon — inside Button slots, IconButton, Badge slots, table cells, list rows.
 - Need an interactive icon button? Use `<IconButton>`, not Icon wrapped in `<button>`.
 - Need a static cluster of related icons? Use `<IconGroup>`.
-- Need a status indicator? Use `<StatusDot>` or `<Badge dot>` — they're optimized for that.
+- Need a status indicator? Use `<Dot>` or `<Badge dot>` — they're optimized for that.
 
 Tabler-only. Don't mix icon libraries — see `foundations/icons.md` for the rationale.
 
@@ -129,7 +129,7 @@ Input's IconProvider sets size by input size: `xs` / `sm` input → `sm` icon, `
 </Stack>
 ```
 
-For most status displays prefer `<StatusDot>` — purpose-built. Use this pattern only when you need a specific icon shape.
+For most status displays prefer `<Dot>` — purpose-built. Use this pattern only when you need a specific icon shape.
 
 ## Composability
 

package/make-kit/components/overview.md

@@ -77,7 +77,7 @@ Permanent inline message?
 Status of an item?
   → <Badge>          — pill label (status / tag)
   → <StatusBadge>    — colored dot + label (discriminated union: status="online"/"away"/...)
-  → <StatusDot>      — just the colored dot
+  → <Dot>            — just the colored status/indicator dot
 
 Temporary notification?
   → toast.success / error / warning / info (imperative) — must have <Toaster /> mounted
@@ -256,7 +256,7 @@ Code?
 | Skeleton | `/ui/skeleton` |
 | Badge | `/ui/badge` |
 | StatusBadge | `/composed/status-badge` |
-| StatusDot | `/ui/status-dot` |
+| Dot | `/ui/dot` |
 | EmptyState | `/composed/empty-state` |
 
 ### Layout

package/make-kit/components/select.md

@@ -98,7 +98,7 @@ Styling lives on the **Trigger**, not on `Select` root. Setting `<Select size="l
 <FormField state={errors.role ? 'error' : 'helper'}>
   <Label htmlFor="role">Role</Label>
   <Select value={role} onValueChange={setRole}>
-    <SelectTrigger id="role" color={errors.role ? 'error' : 'default'}>
+    <SelectTrigger id="role" state={errors.role ? 'error' : 'default'}>
       <SelectValue placeholder="Choose a role" />
     </SelectTrigger>
     <SelectContent>

package/make-kit/components/table.md

@@ -233,7 +233,7 @@ Table + Badge (server-safe via Badge.Group context — verify per use) + Avatar
 
 - **Server-safe:** Table and its sub-components are pure HTML semantic wrappers. No state, no context. Use in RSC trees without `'use client'`.
 - **TableHead scope:** Headers automatically get `scope="col"` for screen-reader navigation. Don't override it.
-- **Composes with primitives:** Drop `<Badge>`, `<Avatar>`, `<IconButton>`, `<StatusDot>` inside cells. Check each component's server-safety if you need RSC compatibility.
+- **Composes with primitives:** Drop `<Badge>`, `<Avatar>`, `<IconButton>`, `<Dot>` inside cells. Check each component's server-safety if you need RSC compatibility.
 - **TableCaption:** Renders as HTML `<caption>` — screen readers announce it before content. Use it for any non-trivial table.
 
 See `foundations/typography.md` for the body / label variants inside cells, `foundations/surfaces.md` for table-in-card surface guidance.