@devalok/shilp-sutra 0.34.0 → 0.36.0

package/docs/components/ui/collapsible.md

@@ -1,40 +1,40 @@
-# Collapsible
-
-- Import: @devalok/shilp-sutra/ui/collapsible
-- Server-safe: No
-- Category: ui
-
-## Props
-    open: boolean (controlled)
-    onOpenChange: (open: boolean) => void
-    defaultOpen: boolean
-
-## Compound Components
-    Collapsible (root)
-      CollapsibleTrigger
-      CollapsibleContent
-
-## Defaults
-    none
-
-## Example
-```jsx
-<Collapsible>
-  <CollapsibleTrigger>Toggle</CollapsibleTrigger>
-  <CollapsibleContent>Hidden content</CollapsibleContent>
-</Collapsible>
-```
-
-## Gotchas
-- Standard Radix Collapsible API
-
-## Changes
-### v0.13.0
-- **Changed** Default animation changed from fade-only to height-based expand/collapse using `animate-collapsible-down`/`animate-collapsible-up`
-- **Added** `collapsible-down` and `collapsible-up` keyframes added to Tailwind preset
-
-### v0.4.2
-- **Added** `CollapsibleProps` type export
-
-### v0.1.0
-- **Added** Initial release
+# Collapsible
+
+- Import: @devalok/shilp-sutra/ui/collapsible
+- Server-safe: No
+- Category: ui
+
+## Props
+    open: boolean (controlled)
+    onOpenChange: (open: boolean) => void
+    defaultOpen: boolean
+
+## Compound Components
+    Collapsible (root)
+      CollapsibleTrigger
+      CollapsibleContent
+
+## Defaults
+    none
+
+## Example
+```jsx
+<Collapsible>
+  <CollapsibleTrigger>Toggle</CollapsibleTrigger>
+  <CollapsibleContent>Hidden content</CollapsibleContent>
+</Collapsible>
+```
+
+## Gotchas
+- Standard Radix Collapsible API
+
+## Changes
+### v0.13.0
+- **Changed** Default animation changed from fade-only to height-based expand/collapse using `animate-collapsible-down`/`animate-collapsible-up`
+- **Added** `collapsible-down` and `collapsible-up` keyframes added to Tailwind preset
+
+### v0.4.2
+- **Added** `CollapsibleProps` type export
+
+### v0.1.0
+- **Added** Initial release

package/docs/components/ui/color-input.md

@@ -1,91 +1,91 @@
-# ColorInput
-
-- Import: @devalok/shilp-sutra/ui/color-input
-- Server-safe: No
-- Category: ui
-- Dependency: react-colorful (bundled, 2.8KB gzipped)
-
-## Props
-    value: string (hex color, e.g. "#d33163")
-    onChange: (value: string) => void
-    presets: { hex: string; label: string }[] | string[] | false (default: 10 named colors. Pass false to hide.)
-    variant: "default" | "inline" (default: "default")
-    showPicker: boolean (default: true — set false for swatches-only mode)
-    defaultFormat: "hex" | "rgb" | "hsl" (default: "hex")
-    align: "start" | "center" | "end" (popover alignment, default: "start")
-    disabled: boolean
-    className: string
-
-## Defaults
-    value="#000000", variant="default", showPicker=true, defaultFormat="hex", align="start", disabled=false
-
-## Variants
-
-**default** — Gradient swatch on left edge fading into surface background, hex text on right. Popover opens on click.
-
-**inline** — Entire trigger IS the selected color. Hex text overlaid with contrast-aware color (white on dark, dark on light). Great for color tags, labels, and compact UIs.
-
-## Popover Contents
-
-1. Interactive gradient picker (saturation/brightness square + hue slider)
-2. Format switcher (HEX / RGB / HSL) with animated sliding pill
-3. Format-specific input fields (all editable, auto-converting)
-4. Preset color swatches (10 named defaults, customizable)
-5. Reset/Undo footer (appears when color has changed)
-
-## Example
-```jsx
-<ColorInput
-  value={color}
-  onChange={setColor}
-/>
-
-// Inline variant
-<ColorInput
-  value={color}
-  onChange={setColor}
-  variant="inline"
-/>
-
-// Custom presets
-<ColorInput
-  value={color}
-  onChange={setColor}
-  presets={[
-    { hex: '#EF4444', label: 'Danger' },
-    { hex: '#10B981', label: 'Success' },
-  ]}
-/>
-
-// Swatches only (no picker)
-<ColorInput value={color} onChange={setColor} showPicker={false} />
-```
-
-## Gotchas
-- Value must be a 6-character hex string (e.g. "#d33163")
-- Presets accept both `string[]` (backward-compatible) and `{ hex, label }[]` (recommended for accessibility)
-- The interactive picker (react-colorful) is pointer-based — keyboard users can edit colors via the HEX/RGB/HSL format inputs
-- Multiple ColorInput instances on the same page work correctly (unique layoutId per instance)
-- Undo tracks discrete changes (preset clicks, field edits), not continuous picker drag — dragging pushes one undo entry
-
-## Changes
-
-### v0.28.0
-- **Changed** Full redesign: replaced native `<input type="color">` with react-colorful interactive picker in a Popover
-- **Added** `variant` prop: `"default"` (gradient trigger) and `"inline"` (color-as-background trigger)
-- **Added** Multi-format input fields (HEX / RGB / HSL) with animated format switcher
-- **Added** `showPicker`, `defaultFormat`, `align` props
-- **Added** Reset/Undo functionality with footer UI
-- **Added** Framer Motion animations throughout (triggers, format swap, presets)
-- **Added** Internal state management — works both controlled and uncontrolled
-- **Changed** `presets` prop now accepts `{ hex, label }[]` or `false` in addition to `string[]`
-- **Fixed** Accessibility: label/input association, ARIA labels, input clamping
-
-### v0.15.0
-- **Changed** `md` size font standardized to `text-ds-md` (14px) from mixed values
-
-### v0.8.0
-- **Fixed** Added `aria-label` to hex color input
-
-### v0.1.0
-- **Added** Initial release
+# ColorInput
+
+- Import: @devalok/shilp-sutra/ui/color-input
+- Server-safe: No
+- Category: ui
+- Dependency: react-colorful (bundled, 2.8KB gzipped)
+
+## Props
+    value: string (hex color, e.g. "#d33163")
+    onChange: (value: string) => void
+    presets: { hex: string; label: string }[] | string[] | false (default: 10 named colors. Pass false to hide.)
+    variant: "default" | "inline" (default: "default")
+    showPicker: boolean (default: true — set false for swatches-only mode)
+    defaultFormat: "hex" | "rgb" | "hsl" (default: "hex")
+    align: "start" | "center" | "end" (popover alignment, default: "start")
+    disabled: boolean
+    className: string
+
+## Defaults
+    value="#000000", variant="default", showPicker=true, defaultFormat="hex", align="start", disabled=false
+
+## Variants
+
+**default** — Gradient swatch on left edge fading into surface background, hex text on right. Popover opens on click.
+
+**inline** — Entire trigger IS the selected color. Hex text overlaid with contrast-aware color (white on dark, dark on light). Great for color tags, labels, and compact UIs.
+
+## Popover Contents
+
+1. Interactive gradient picker (saturation/brightness square + hue slider)
+2. Format switcher (HEX / RGB / HSL) with animated sliding pill
+3. Format-specific input fields (all editable, auto-converting)
+4. Preset color swatches (10 named defaults, customizable)
+5. Reset/Undo footer (appears when color has changed)
+
+## Example
+```jsx
+<ColorInput
+  value={color}
+  onChange={setColor}
+/>
+
+// Inline variant
+<ColorInput
+  value={color}
+  onChange={setColor}
+  variant="inline"
+/>
+
+// Custom presets
+<ColorInput
+  value={color}
+  onChange={setColor}
+  presets={[
+    { hex: '#EF4444', label: 'Danger' },
+    { hex: '#10B981', label: 'Success' },
+  ]}
+/>
+
+// Swatches only (no picker)
+<ColorInput value={color} onChange={setColor} showPicker={false} />
+```
+
+## Gotchas
+- Value must be a 6-character hex string (e.g. "#d33163")
+- Presets accept both `string[]` (backward-compatible) and `{ hex, label }[]` (recommended for accessibility)
+- The interactive picker (react-colorful) is pointer-based — keyboard users can edit colors via the HEX/RGB/HSL format inputs
+- Multiple ColorInput instances on the same page work correctly (unique layoutId per instance)
+- Undo tracks discrete changes (preset clicks, field edits), not continuous picker drag — dragging pushes one undo entry
+
+## Changes
+
+### v0.28.0
+- **Changed** Full redesign: replaced native `<input type="color">` with react-colorful interactive picker in a Popover
+- **Added** `variant` prop: `"default"` (gradient trigger) and `"inline"` (color-as-background trigger)
+- **Added** Multi-format input fields (HEX / RGB / HSL) with animated format switcher
+- **Added** `showPicker`, `defaultFormat`, `align` props
+- **Added** Reset/Undo functionality with footer UI
+- **Added** Framer Motion animations throughout (triggers, format swap, presets)
+- **Added** Internal state management — works both controlled and uncontrolled
+- **Changed** `presets` prop now accepts `{ hex, label }[]` or `false` in addition to `string[]`
+- **Fixed** Accessibility: label/input association, ARIA labels, input clamping
+
+### v0.15.0
+- **Changed** `md` size font standardized to `text-ds-md` (14px) from mixed values
+
+### v0.8.0
+- **Fixed** Added `aria-label` to hex color input
+
+### v0.1.0
+- **Added** Initial release

package/docs/components/ui/color-swatch.md

@@ -1,25 +1,25 @@
-# ColorSwatch
-
-- Import: @devalok/shilp-sutra/ui/color-swatch
-- Server-safe: Yes
-- Category: ui
-
-## Props
-    color: string (any valid CSS color — hex, rgb, oklch, etc.)
-    size: "sm" | "md" | "lg"
-    shape: "circle" | "square" | "rounded"
-    ring: boolean (shows subtle ring border — useful for light colors that blend into the background)
-
-## Defaults
-    size="md", shape="circle", ring={false}
-
-## Example
-```jsx
-<ColorSwatch color="#FF5733" />
-<ColorSwatch color={org.brandColor} size="lg" ring />
-<ColorSwatch color="oklch(0.7 0.15 200)" shape="rounded" />
-```
-
-## Gotchas
-- Color is applied via inline `backgroundColor` style, not a token class — accepts any runtime CSS color string
-- Renders `role="presentation"` — purely decorative, not interactive
+# ColorSwatch
+
+- Import: @devalok/shilp-sutra/ui/color-swatch
+- Server-safe: Yes
+- Category: ui
+
+## Props
+    color: string (any valid CSS color — hex, rgb, oklch, etc.)
+    size: "sm" | "md" | "lg"
+    shape: "circle" | "square" | "rounded"
+    ring: boolean (shows subtle ring border — useful for light colors that blend into the background)
+
+## Defaults
+    size="md", shape="circle", ring={false}
+
+## Example
+```jsx
+<ColorSwatch color="#FF5733" />
+<ColorSwatch color={org.brandColor} size="lg" ring />
+<ColorSwatch color="oklch(0.7 0.15 200)" shape="rounded" />
+```
+
+## Gotchas
+- Color is applied via inline `backgroundColor` style, not a token class — accepts any runtime CSS color string
+- Renders `role="presentation"` — purely decorative, not interactive

package/docs/components/ui/combobox.md

@@ -1,54 +1,54 @@
-# Combobox
-
-- Import: @devalok/shilp-sutra/ui/combobox
-- Server-safe: No
-- Category: ui
-
-## Props
-    options: ComboboxOption[] (REQUIRED) — { value: string, label: string, description?: string, icon?: ReactNode, disabled?: boolean }
-    DISCRIMINATED UNION — type depends on `multiple` flag:
-    Single (default): multiple?: false, value?: string, onValueChange: (value: string) => void
-    Multiple: multiple: true, value?: string[], onValueChange: (value: string[]) => void
-    placeholder: string (default: "Select...")
-    searchPlaceholder: string (default: "Search...")
-    emptyMessage: string (default: "No results found")
-    disabled: boolean
-    triggerClassName: string
-    accessibleLabel: string (custom aria-label for trigger, falls back to placeholder)
-    maxVisible: number (default: 6, max dropdown items before scroll)
-    renderOption: (option, selected) => ReactNode
-
-## Defaults
-    placeholder="Select...", searchPlaceholder="Search...", emptyMessage="No results found", maxVisible=6
-
-## Example
-```jsx
-<Combobox
-  multiple
-  options={tagOptions}
-  value={selectedTags}
-  onValueChange={setSelectedTags}
-  placeholder="Select tags..."
-/>
-```
-
-## Gotchas
-- Enforces selection from list (unlike Autocomplete which allows free text)
-- In multi mode, selected items appear as pills with "+N more" overflow
-
-## Changes
-### v0.18.0
-- **Added** `accessibleLabel` prop — custom aria-label for trigger, falls back to placeholder
-
-### v0.14.0
-- **Changed** z-index promoted from `z-dropdown` (1000) to `z-popover` (1400) — fixes dropdown rendering behind Sheet/Dialog overlays
-
-### v0.8.0
-- **Changed** (BREAKING) Props now use discriminated union — `multiple: true` requires `value: string[]` and `onValueChange: (value: string[]) => void`
-
-### v0.3.0
-- **Changed** (BREAKING) `onChange` renamed to `onValueChange`
-- **Changed** Now extends HTMLAttributes — accepts all standard HTML props
-
-### v0.1.0
-- **Added** Initial release
+# Combobox
+
+- Import: @devalok/shilp-sutra/ui/combobox
+- Server-safe: No
+- Category: ui
+
+## Props
+    options: ComboboxOption[] (REQUIRED) — { value: string, label: string, description?: string, icon?: ReactNode, disabled?: boolean }
+    DISCRIMINATED UNION — type depends on `multiple` flag:
+    Single (default): multiple?: false, value?: string, onValueChange: (value: string) => void
+    Multiple: multiple: true, value?: string[], onValueChange: (value: string[]) => void
+    placeholder: string (default: "Select...")
+    searchPlaceholder: string (default: "Search...")
+    emptyMessage: string (default: "No results found")
+    disabled: boolean
+    triggerClassName: string
+    accessibleLabel: string (custom aria-label for trigger, falls back to placeholder)
+    maxVisible: number (default: 6, max dropdown items before scroll)
+    renderOption: (option, selected) => ReactNode
+
+## Defaults
+    placeholder="Select...", searchPlaceholder="Search...", emptyMessage="No results found", maxVisible=6
+
+## Example
+```jsx
+<Combobox
+  multiple
+  options={tagOptions}
+  value={selectedTags}
+  onValueChange={setSelectedTags}
+  placeholder="Select tags..."
+/>
+```
+
+## Gotchas
+- Enforces selection from list (unlike Autocomplete which allows free text)
+- In multi mode, selected items appear as pills with "+N more" overflow
+
+## Changes
+### v0.18.0
+- **Added** `accessibleLabel` prop — custom aria-label for trigger, falls back to placeholder
+
+### v0.14.0
+- **Changed** z-index promoted from `z-dropdown` (1000) to `z-popover` (1400) — fixes dropdown rendering behind Sheet/Dialog overlays
+
+### v0.8.0
+- **Changed** (BREAKING) Props now use discriminated union — `multiple: true` requires `value: string[]` and `onValueChange: (value: string[]) => void`
+
+### v0.3.0
+- **Changed** (BREAKING) `onChange` renamed to `onValueChange`
+- **Changed** Now extends HTMLAttributes — accepts all standard HTML props
+
+### v0.1.0
+- **Added** Initial release

package/docs/components/ui/container.md

@@ -1,26 +1,26 @@
-# Container
-
-- Import: @devalok/shilp-sutra/ui/container
-- Server-safe: Yes
-- Category: ui
-
-## Props
-    maxWidth: "default" | "body" | "full"
-    as: ElementType (default: "div")
-
-## Defaults
-    maxWidth="default"
-
-## Example
-```jsx
-<Container maxWidth="body">
-  <p>Centered content</p>
-</Container>
-```
-
-## Gotchas
-- Server-safe component — can be imported directly in Next.js Server Components
-
-## Changes
-### v0.1.0
-- **Added** Initial release
+# Container
+
+- Import: @devalok/shilp-sutra/ui/container
+- Server-safe: Yes
+- Category: ui
+
+## Props
+    maxWidth: "default" | "body" | "full"
+    as: ElementType (default: "div")
+
+## Defaults
+    maxWidth="default"
+
+## Example
+```jsx
+<Container maxWidth="body">
+  <p>Centered content</p>
+</Container>
+```
+
+## Gotchas
+- Server-safe component — can be imported directly in Next.js Server Components
+
+## Changes
+### v0.1.0
+- **Added** Initial release

package/docs/components/ui/context-menu.md

@@ -1,43 +1,43 @@
-# ContextMenu
-
-- Import: @devalok/shilp-sutra/ui/context-menu
-- Server-safe: No
-- Category: ui
-
-## Compound Components
-    ContextMenu (root)
-      ContextMenuTrigger (right-click target)
-      ContextMenuContent
-        ContextMenuItem
-        ContextMenuCheckboxItem
-        ContextMenuRadioGroup > ContextMenuRadioItem
-        ContextMenuLabel
-        ContextMenuSeparator
-        ContextMenuSub > ContextMenuSubTrigger, ContextMenuSubContent
-
-## Defaults
-    none
-
-## Example
-```jsx
-<ContextMenu>
-  <ContextMenuTrigger>Right-click me</ContextMenuTrigger>
-  <ContextMenuContent>
-    <ContextMenuItem>Edit</ContextMenuItem>
-    <ContextMenuItem>Delete</ContextMenuItem>
-  </ContextMenuContent>
-</ContextMenu>
-```
-
-## Gotchas
-- Triggered by right-click (or long-press on touch devices)
-
-## Changes
-### v0.18.0
-- **Added** `ContextMenuContentProps`, `ContextMenuItemProps` type exports
-
-### v0.14.0
-- **Changed** z-index promoted from `z-dropdown` (1000) to `z-popover` (1400) — fixes dropdown rendering behind Sheet/Dialog overlays
-
-### v0.1.0
-- **Added** Initial release
+# ContextMenu
+
+- Import: @devalok/shilp-sutra/ui/context-menu
+- Server-safe: No
+- Category: ui
+
+## Compound Components
+    ContextMenu (root)
+      ContextMenuTrigger (right-click target)
+      ContextMenuContent
+        ContextMenuItem
+        ContextMenuCheckboxItem
+        ContextMenuRadioGroup > ContextMenuRadioItem
+        ContextMenuLabel
+        ContextMenuSeparator
+        ContextMenuSub > ContextMenuSubTrigger, ContextMenuSubContent
+
+## Defaults
+    none
+
+## Example
+```jsx
+<ContextMenu>
+  <ContextMenuTrigger>Right-click me</ContextMenuTrigger>
+  <ContextMenuContent>
+    <ContextMenuItem>Edit</ContextMenuItem>
+    <ContextMenuItem>Delete</ContextMenuItem>
+  </ContextMenuContent>
+</ContextMenu>
+```
+
+## Gotchas
+- Triggered by right-click (or long-press on touch devices)
+
+## Changes
+### v0.18.0
+- **Added** `ContextMenuContentProps`, `ContextMenuItemProps` type exports
+
+### v0.14.0
+- **Changed** z-index promoted from `z-dropdown` (1000) to `z-popover` (1400) — fixes dropdown rendering behind Sheet/Dialog overlays
+
+### v0.1.0
+- **Added** Initial release

package/docs/components/ui/data-table-body.md

@@ -1,4 +1,4 @@
-# $(echo $f | sed 's/-/ /g' | sed 's/\b\(.\)/\u\1/g')
+# DataTableBody
 
 > Internal sub-component of DataTable. Not exported to consumers.
 

package/docs/components/ui/data-table-bulk-actions.md

@@ -1,4 +1,4 @@
-# $(echo $f | sed 's/-/ /g' | sed 's/\b\(.\)/\u\1/g')
+# DataTableBulkActions
 
 > Internal sub-component of DataTable. Not exported to consumers.
 

package/docs/components/ui/data-table-card.md

@@ -1,4 +1,4 @@
-# $(echo $f | sed 's/-/ /g' | sed 's/\b\(.\)/\u\1/g')
+# DataTableCard
 
 > Internal sub-component of DataTable. Not exported to consumers.
 

package/docs/components/ui/data-table-context.md

@@ -1,4 +1,4 @@
-# $(echo $f | sed 's/-/ /g' | sed 's/\b\(.\)/\u\1/g')
+# DataTableContext
 
 > Internal sub-component of DataTable. Not exported to consumers.
 

package/docs/components/ui/data-table-header.md

@@ -1,4 +1,4 @@
-# $(echo $f | sed 's/-/ /g' | sed 's/\b\(.\)/\u\1/g')
+# DataTableHeader
 
 > Internal sub-component of DataTable. Not exported to consumers.
 

package/docs/components/ui/data-table-pagination.md

@@ -1,4 +1,4 @@
-# $(echo $f | sed 's/-/ /g' | sed 's/\b\(.\)/\u\1/g')
+# DataTablePagination
 
 > Internal sub-component of DataTable. Not exported to consumers.