wimui 0.25.0 → 0.26.1

package/dist/llms-full.txt

@@ -4,7 +4,7 @@
 
 ## What this is
 
-**wimui** v0.25.0 — a React 19 component library: 218 documented components across 10 categories, with design tokens, dark mode, i18n (en/ja/pt-BR) and WAI-ARIA compliant a11y. Peer deps: react ^19, react-dom ^19 (plus optional peers for specific components — see package.json).
+**wimui** v0.26.1 — a React 19 component library: 218 documented components across 10 categories, with design tokens, dark mode, i18n (en/ja/pt-BR) and WAI-ARIA compliant a11y. Peer deps: react ^19, react-dom ^19 (plus optional peers for specific components — see package.json).
 
 ## Install & required setup
 
@@ -756,7 +756,7 @@ The container-query wrapper div is preserved to maintain responsive column behav
     - `glass: boolean` — Glassmorphism effect
     - `fluid: boolean` — Expand content to full width (disable the centered max-width container)
     - `background: "surface" | "surface-variant" | "transparent"` = "surface" — Background color
-- **InteractiveArea** — Interactive empty/drop zone area
+- **InteractiveArea** — Foundation component for consistent interactive areas with borders and states.
     - `title: ReactNode` — Area title
     - `description: ReactNode` — Area description
     - `icon: ReactNode` — Icon to display
@@ -981,7 +981,7 @@ Useful for using the button styles with Link components (e.g. from React Router
     - `suffix: React.ReactNode` — Static text shown after the field, inside the same shell — a unit such as
 `kg`, `%` or `円`. It is announced with the field via `aria-describedby`,
 so the unit does not have to be repeated in the label.
-    - `styles: React.ComponentProps<typeof InputBase>["styles"]` — Custom styles for internal parts
+    - `styles: { root?: string; inner?: string; icon?: string; icons?: string; iconItem?: string; iconButton?: string; }` — Custom styles for internal parts
     - `asChild: boolean` = false — Whether to render as a child element.
 - **ColorPicker** — Color selection picker
     - `intent: FieldIntent` = "default" — Semantic intent of the field (e.g. error state)
@@ -1009,7 +1009,7 @@ so the unit does not have to be repeated in the label.
     - `suffix: React.ReactNode` — Static text shown after the field, inside the same shell — a unit such as
 `kg`, `%` or `円`. It is announced with the field via `aria-describedby`,
 so the unit does not have to be repeated in the label.
-    - `styles: React.ComponentProps<typeof InputBase>["styles"]` — Custom styles for internal parts
+    - `styles: { root?: string; inner?: string; icon?: string; icons?: string; iconItem?: string; iconButton?: string; }` — Custom styles for internal parts
     - `asChild: boolean` = false — Whether to render as a child element.
 - **Combobox** — Select with search
     - `options: ComboboxOption[]` = [] — List of suggestion options
@@ -1080,7 +1080,7 @@ so the unit does not have to be repeated in the label.
     - `suffix: React.ReactNode` — Static text shown after the field, inside the same shell — a unit such as
 `kg`, `%` or `円`. It is announced with the field via `aria-describedby`,
 so the unit does not have to be repeated in the label.
-    - `styles: React.ComponentProps<typeof InputBase>["styles"]` — Custom styles for internal parts
+    - `styles: { root?: string; inner?: string; icon?: string; icons?: string; iconItem?: string; iconButton?: string; }` — Custom styles for internal parts
 - **DatePicker** — Date selection
     - `intent: FieldIntent` = "default" — Semantic intent of the field (e.g. error state)
     - `variant: "outline" | "ghost"` = "outline" — Visual style variant of the field
@@ -1197,10 +1197,21 @@ SCSS には誰も付けない `.default_intent` が「temporary name」のまま
     - `className: string` — Additional class names
     - `style: React.CSSProperties` — Style attribute
     - `aria-label: string` — Aria label for accessibility
-- **IconButton** — Icon-only button
+- **IconButton** — A square button containing only an icon without a text label.
     - `iconName: React.ComponentProps<typeof Icon>["name"]` (required) — Icon name to display
     - `aria-label: string` (required) — Accessible label for the icon-only button
-- **ImageCropper** — Front-end image crop and rotate tool
+    - `backgroundColor: T | (string & {})` — Overrides the button background color with a design token. Usually the `variant` prop is enough; use this prop only as a last resort.
+    - `size: Extract<ComponentSize, "sm" | "md" | "lg">` = "md" — Size of the button
+    - `variant: "solid" | "outline" | "ghost"` = "outline" — Visual style variant of the button
+    - `intent: ButtonIntent` = "default" — Design intent of the button (visual / semantic state). Unrelated to the ARIA role attribute.
+    - `icon: React.ComponentProps<typeof Icon>["name"] | React.ReactNode` — Icon name or custom icon element
+    - `loading: boolean` = false — Whether to show a loading indicator and disable interaction
+    - `justify: "start" | "center" | "end" | "between"` = "center" — Horizontal alignment of the button content
+    - `animateWidth: boolean` = false — Whether to animate the width change when label changes
+    - `fullWidth: boolean` = false — Whether the button should take up the full width of its container
+    - `styles: { root?: string; loader?: string; icon?: string; }` — Custom styles for internal parts
+    - `className: string` — Additional class names
+- **ImageCropper** — Front-end image cropping and rotation tool.
     - `src: string` — URL or data URL of the image to crop
     - `aspectRatio: number` = 1 — Aspect ratio (width / height); 1 produces a square
     - `circular: boolean` = false — Whether to display a circular crop area (for profile images)
@@ -1247,7 +1258,7 @@ SCSS には誰も付けない `.default_intent` が「temporary name」のまま
     - `suffix: React.ReactNode` — Static text shown after the field, inside the same shell — a unit such as
 `kg`, `%` or `円`. It is announced with the field via `aria-describedby`,
 so the unit does not have to be repeated in the label.
-    - `styles: React.ComponentProps<typeof InputBase>["styles"]` — Custom styles for internal parts
+    - `styles: { root?: string; inner?: string; icon?: string; icons?: string; iconItem?: string; iconButton?: string; }` — Custom styles for internal parts
     - `asChild: boolean` = false — Whether to render as a child element.
 - **InputBase** — Standardizes the visual container, icon slots (Prefix/Suffix), and clear button behavior for text-based inputs.
     - `children: React.ReactNode` (required) — Inner form control element(s) wrapped by the shell
@@ -1303,7 +1314,7 @@ make room rather than running underneath it.
     - `suffix: React.ReactNode` — Static text shown after the field, inside the same shell — a unit such as
 `kg`, `%` or `円`. It is announced with the field via `aria-describedby`,
 so the unit does not have to be repeated in the label.
-    - `styles: React.ComponentProps<typeof InputBase>["styles"]` — Custom styles for internal parts
+    - `styles: { root?: string; inner?: string; icon?: string; icons?: string; iconItem?: string; iconButton?: string; }` — Custom styles for internal parts
     - `asChild: boolean` = false — Whether to render as a child element.
 - **LinkButton** — Anchor styled as button
     - `iconPosition: "left" | "right"` = "left" — Position of the icon relative to the label
@@ -1379,9 +1390,9 @@ box and receives a **1-based** position — the first box is `1`, not `0`.
     - `suffix: React.ReactNode` — Static text shown after the field, inside the same shell — a unit such as
 `kg`, `%` or `円`. It is announced with the field via `aria-describedby`,
 so the unit does not have to be repeated in the label.
-    - `styles: React.ComponentProps<typeof InputBase>["styles"]` — Custom styles for internal parts
+    - `styles: { root?: string; inner?: string; icon?: string; icons?: string; iconItem?: string; iconButton?: string; }` — Custom styles for internal parts
     - `asChild: boolean` = false — Whether to render as a child element.
-- **PasswordStrength** — Visual meter to indicate password security level (aka Strength Meter)
+- **PasswordStrength** — Visual meter to indicate password security level. (aka Strength Meter)
     - `password: string` = "" — Password string to evaluate
     - `score: 0 | 1 | 2 | 3 | 4` — Strength score (the default calculation is used when omitted)
 0: very weak, 1: weak, 2: fair, 3: strong, 4: very strong
@@ -1533,7 +1544,7 @@ so the unit does not have to be repeated in the label.
     - `suffix: React.ReactNode` — Static text shown after the field, inside the same shell — a unit such as
 `kg`, `%` or `円`. It is announced with the field via `aria-describedby`,
 so the unit does not have to be repeated in the label.
-    - `styles: React.ComponentProps<typeof InputBase>["styles"]` — Custom styles for internal parts
+    - `styles: { root?: string; inner?: string; icon?: string; icons?: string; iconItem?: string; iconButton?: string; }` — Custom styles for internal parts
     - `asChild: boolean` = false — Whether to render as a child element.
 - **SegmentedControl** — Button-style controls for switching between a small set of mutually exclusive options (aka Segmented Buttons, Segmented Picker)
     - `options: Option[]` (required) — List of segment options
@@ -1605,7 +1616,7 @@ so the unit does not have to be repeated in the label.
     - `layout: "vertical" | "horizontal"` = "vertical" — Layout direction of label and field
     - `id: string` — Custom ID
     - `asChild: boolean` = false — Whether to render as a child element.
-    - `styles: React.ComponentPropsWithoutRef<typeof FieldTemplate>["styles"]` — Custom styles for internal parts
+    - `styles: { root?: string; labelWrapper?: string; label?: string; content?: string; error?: string; }` — Custom styles for internal parts
 - **SmartSearchInput** — Smart search input enabling both traditional search and AI prompting.
     - `intent: FieldIntent` = "default" — Semantic intent of the field (e.g. error state)
     - `variant: "outline" | "ghost"` = "outline" — Visual style variant of the field
@@ -1651,7 +1662,7 @@ but the toggle only shows a chevron, so it needs one of its own.
     - `error: string` — Error message
     - `required: boolean` — Whether to show the required indicator
     - `disabled: boolean` — Whether the whole group is disabled
-- **TagInput** — Field for entering free-form text as tags (aka Token Field, Chips Input)
+- **TagInput** — Input field for creating free-form tags. (aka Token Field, Chips Input)
     - `value: string[]` — List of tags (controlled)
     - `defaultValue: string[]` = [] — Initial list of tags (uncontrolled)
     - `onChange: (tags: string[]) => void` — Callback when the tags change
@@ -1715,7 +1726,7 @@ but the toggle only shows a chevron, so it needs one of its own.
     - `suffix: React.ReactNode` — Static text shown after the field, inside the same shell — a unit such as
 `kg`, `%` or `円`. It is announced with the field via `aria-describedby`,
 so the unit does not have to be repeated in the label.
-    - `styles: React.ComponentProps<typeof InputBase>["styles"]` — Custom styles for internal parts
+    - `styles: { root?: string; inner?: string; icon?: string; icons?: string; iconItem?: string; iconButton?: string; }` — Custom styles for internal parts
     - `asChild: boolean` = false — Whether to render as a child element.
 - **ToggleGroup** — Toggleable buttons
     - `options: Option[]` (required) — List of toggle options
@@ -1880,7 +1891,43 @@ origin while the card it was meant to cover was 1248x75.
     - `className: string` — Additional class name
 - **Progress** — Progress bar
   - ⚠️ Not the same as elsewhere: Material's "Progress Indicator" covers indeterminate spinners as well. WIM's `Progress` is determinate and linear only — for the indeterminate case use `Spinner`.
+    - `value: number` = 0 — Current value of the progress bar.
+@default 0
+    - `max: number` = 100 — Maximum value of the progress bar.
+@default 100
+    - `intent: IndicatorIntent` = "primary" — Intent (semantic color) of the bar.
+@default "primary"
+    - `size: Extract<ComponentSize, "sm" | "md" | "lg">` = "md" — Size of the bar.
+@default "md"
+    - `label: string` — Text label displayed above the bar. Also used as the accessible name unless
+`aria-label` / `aria-labelledby` is given.
+
+A progress bar always carries `role="progressbar"`, and a progressbar with no
+accessible name is a WCAG failure (axe `aria-progressbar-name`, serious). The
+type therefore requires one of `label` / `aria-label` / `aria-labelledby`.
+    - `showValue: boolean` = false — Whether to display the current value as a percentage.
+@default false
+    - `indeterminate: boolean` = false — If true, shows an indeterminate animation instead of a value.
+@default false
 - **ProgressRing** — ProgressRing description.
+    - `value: number` = 0 — Current value of the progress ring.
+@default 0
+    - `max: number` = 100 — Maximum value of the progress ring.
+@default 100
+    - `intent: IndicatorIntent` = "primary" — Intent (semantic color) of the ring.
+@default "primary"
+    - `size: Extract<ComponentSize, "sm" | "md" | "lg">` = "md" — Size of the ring.
+@default "md"
+    - `label: string` — Text label displayed below the ring. Also used as the accessible name unless
+`aria-label` / `aria-labelledby` is given.
+
+A progress ring always carries `role="progressbar"`, and a progressbar with no
+accessible name is a WCAG failure (axe `aria-progressbar-name`, serious). The
+type therefore requires one of `label` / `aria-label` / `aria-labelledby`.
+    - `showValue: boolean` = false — Whether to display the current value as a percentage inside the ring.
+@default false
+    - `indeterminate: boolean` = false — If true, shows an indeterminate animation instead of a value.
+@default false
 - **Result** — Task status indicator
     - `intent: Extract< WimIntent, "default" | "success" | "danger" | "info" | "warning" >` = "default" — Semantic intent — determines the icon and color.
 @default "default"
@@ -2060,7 +2107,16 @@ Useful for URL-based pagination (e.g. wrap with a Link via PaginationPage asChil
     - `actions: SpeedDialAction[]` (required) — Actions to display when SpeedDial is open
     - `icon: keyof typeof ALL_ICONS` = "PlusIcon" — Icon name for the main button when closed
     - `activeIcon: keyof typeof ALL_ICONS` = "CloseIcon" — Icon name for the main button when open
-    - `direction: "up" | "down" | "left" | "right"` = "up" — Direction in which actions expand
+    - `direction: "up" | "down" | "left" | "right"` = "up" — Direction in which actions expand.
+
+**The caller picks a direction that has room.** Actions are placed with
+plain CSS (`left: 100%` and friends) and are never measured, so this
+component does not flip when the viewport runs out — a `right` dial placed
+near the right edge pushes the page into a horizontal scroll. Anchor a
+`right` dial to the leading edge (and a `left` one to the trailing edge);
+`up` / `down` already grow inward from the trailing corner (T175).
+
+@default "up"
     - `trigger: "hover" | "click"` = "hover" — Trigger mode to open the SpeedDial
     - `open: boolean` — Controlled open state
     - `onOpenChange: (open: boolean) => void` — Callback when open state changes
@@ -2331,7 +2387,7 @@ drops secondary text below the AA contrast floor.
     - `pauseOnHover: boolean` = true — Whether to pause the animation on hover.
     - `vertical: boolean` = false — Whether to scroll vertically.
     - `repeat: number` = 2 — Number of times the content is repeated. May need adjusting for a seamless loop. Defaults to `2`.
-- **NodeGraph** — Interactive node-based flowchart and pipeline editor
+- **NodeGraph** — Visualizes complex networks and relationships between nodes.
     - `nodes: Node[]` (required) — Controlled nodes
     - `edges: Edge[]` (required) — Controlled edges
     - `onNodesChange: OnNodesChange` (required) — Called when nodes change (position, selection, add, removal)
@@ -2402,7 +2458,7 @@ When omitted, both Backspace and Delete work.
 @default true
     - `fallback: React.ReactNode` — Content shown when the date cannot be parsed.
     - `asChild: boolean` = false — If true, the component will be rendered as its child, merging its props onto that child.
-- **ScheduleView** — Time-grid calendar with drag-and-drop scheduling
+- **ScheduleView** — Displays tasks or events on a chronological timeline or calendar view.
     - `events: ScheduleViewEvent[]` = [] — List of calendar events
     - `initialView: "timeGridWeek" | "timeGridDay" | "dayGridMonth"` = "timeGridWeek" — Initial view mode
     - `editable: boolean` = true — Whether events can be dragged to new times
@@ -2864,6 +2920,9 @@ the value, so cutting the axis lies about the ratio between them.
 @default true
     - `animated: boolean` = false — If true, animates the chart on mount.
 @default false
+    - `aria-label: string` — Accessible name for the chart. Defaults to `title` when omitted; pass this
+when the chart has no visible title, or when the title is not descriptive
+enough on its own.
 - **BarChart** — Bar charts
     - `data: ChartDataPoint[]` (required) — Data to display in the chart.
     - `keys: string[]` (required) — Keys in the data objects to render as bars (series).
@@ -2881,6 +2940,9 @@ the value, so cutting the axis lies about the ratio between them.
     - `title: string` — Optional title displayed above the chart.
     - `animated: boolean` = false — If true, animates the chart on mount.
 @default false
+    - `aria-label: string` — Accessible name for the chart. Defaults to `title` when omitted; pass this
+when the chart has no visible title, or when the title is not descriptive
+enough on its own.
 - **FunnelChart** — Process stage abandonment chart
     - `data: ChartDataPoint[]` (required) — Data to display in the chart. Each entry represents one funnel stage.
     - `dataKey: string` (required) — The key in the data objects that represents the value of each stage.
@@ -2892,6 +2954,9 @@ the value, so cutting the axis lies about the ratio between them.
     - `title: string` — Optional title displayed above the chart.
     - `animated: boolean` = false — If true, animates the chart on mount.
 @default false
+    - `aria-label: string` — Accessible name for the chart. Defaults to `title` when omitted; pass this
+when the chart has no visible title, or when the title is not descriptive
+enough on its own.
 - **GanttChart** — Project schedule and timeline visualization
     - `tasks: GanttTask[]` (required) — Tasks to render as bars in the chart.
     - `startDate: Date` — Start of the visible date range. Defaults to the earliest task start date.
@@ -2919,6 +2984,9 @@ the value, so cutting the axis lies about the ratio between them.
     - `color: string` — Color of the gauge arc. Defaults to the first chart color.
     - `animated: boolean` = false — If true, animates the chart on mount.
 @default false
+    - `aria-label: string` — Accessible name for the chart. Defaults to `title` when omitted; pass this
+when the chart has no visible title, or when the title is not descriptive
+enough on its own.
 - **Heatmap** — Graphical representation of data where individual values are contained in a matrix as colors.
     - `data: { x: string; y: string; value: number }[]` (required) — Cells to display. Each entry maps an x/y category pair to a value.
     - `xAxisKey: string[]` (required) — Ordered list of X axis category labels.
@@ -2932,6 +3000,9 @@ the value, so cutting the axis lies about the ratio between them.
 @default ["var(--wim-color-surface-variant)", "var(--wim-color-chart-primary)"]
     - `animated: boolean` = false — Whether to animate the cells on mount.
 @default false
+    - `aria-label: string` — Accessible name for the chart. Defaults to `title` when omitted; pass this
+when the chart has no visible title, or when the title is not descriptive
+enough on its own.
 - **LineChart** — Line charts
     - `data: ChartDataPoint[]` (required) — Data to display in the chart.
     - `keys: string[]` (required) — Keys in the data objects to render as lines (series).
@@ -2949,6 +3020,9 @@ line on a 0–100 axis).
 @default [0, "auto"]
     - `animated: boolean` = false — If true, animates the chart on mount.
 @default false
+    - `aria-label: string` — Accessible name for the chart. Defaults to `title` when omitted; pass this
+when the chart has no visible title, or when the title is not descriptive
+enough on its own.
 - **PieChart** — Proportional parts of a whole chart
     - `data: { name: string; value: number }[]` (required) — Slices to display. Each entry has a name (label) and a value.
     - `height: number` = 300 — The height of the chart in pixels.
@@ -2960,6 +3034,9 @@ line on a 0–100 axis).
 @default false
     - `animated: boolean` = false — If true, animates the chart on mount.
 @default false
+    - `aria-label: string` — Accessible name for the chart. Defaults to `title` when omitted; pass this
+when the chart has no visible title, or when the title is not descriptive
+enough on its own.
 - **RadarChart** — Multivariate data on concentric axes chart
     - `data: ChartDataPoint[]` (required) — Data to display in the chart.
     - `keys: string[]` (required) — Keys in the data objects to render as radar areas (series).
@@ -2971,6 +3048,9 @@ line on a 0–100 axis).
     - `title: string` — Optional title displayed above the chart.
     - `animated: boolean` = false — If true, animates the chart on mount.
 @default false
+    - `aria-label: string` — Accessible name for the chart. Defaults to `title` when omitted; pass this
+when the chart has no visible title, or when the title is not descriptive
+enough on its own.
 - **ScatterChart** — Scatter plots
     - `data: { x: number; y: number; z?: number; name: string }[]` (required) — Points to plot. `z` optionally controls the point size.
     - `xAxisName: string` = "X" — Name of the X axis, shown in the tooltip.
@@ -2988,6 +3068,9 @@ line on a 0–100 axis).
     - `title: string` — Optional title displayed above the chart.
     - `animated: boolean` = false — If true, animates the chart on mount.
 @default false
+    - `aria-label: string` — Accessible name for the chart. Defaults to `title` when omitted; pass this
+when the chart has no visible title, or when the title is not descriptive
+enough on its own.
 - **Sparkline** — Tiny inline trend chart
     - `data: number[]` (required) — Sequence of values to plot, in order
     - `type: "line" | "area" | "bar"` = "line" — Visual form of the sparkline
@@ -3010,6 +3093,9 @@ line on a 0–100 axis).
     - `width: string | number` = "100%" — The width of the chart (e.g., "100%", 500).
 @default "100%"
     - `title: string` — Optional title displayed above the chart.
+    - `aria-label: string` — Accessible name for the chart. Defaults to `title` when omitted; pass this
+when the chart has no visible title, or when the title is not descriptive
+enough on its own.
 
 ### ai — `import { … } from "wimui/ai"`
 
@@ -3085,7 +3171,7 @@ written in the markdown. Default `"2xl"` keeps the historical mapping
     - `showContext: boolean` = true — Whether to show the context-length metadata in the dropdown
     - `labels: { /** Placeholder shown when nothing is selected */ placeholder?: string; /** Prefix for the context-length meta (default "Context") */ contextLabel?: string; /** Prefix for the input price meta (default "In") */ inputLabel?: string; /** Prefix for the output price meta (default "Out") */ outputLabel?: string; /** Suffix appended to prices (default "/1M") */ perTokensLabel?: string; /** Accessible label for the trigger button */ triggerAriaLabel?: string; }` — Labels for internationalization
     - `className: string` — Additional class names
-- **PromptInput** — Auto-resizing prompt input with send and attachment actions
+- **PromptInput** — Interactive input optimized for AI prompt engineering with multi-line support and action triggers.
     - `value: string` — Current text value (controlled)
     - `defaultValue: string` = "" — Default value (uncontrolled)
     - `onChange: (value: string) => void` — Callback when value changes
@@ -3110,7 +3196,7 @@ written in the markdown. Default `"2xl"` keeps the historical mapping
     - `index: number` — Numeric citation index shown as a badge (e.g. 1, 2, 3)
     - `domain: string` — Domain label shown below the title (auto-derived from url when omitted)
     - `className: string` — Additional CSS class
-- **StreamingText** — Streaming Markdown renderer for AI-generated responses
+- **StreamingText** — Renders text with a typewriter-like animation, ideal for AI chat responses.
     - `content: string` (required) — The markdown text content to render
     - `isStreaming: boolean` = false — When true, a blinking cursor is shown at the end of the content
     - `components: Components` — Override the default markdown component renderers

package/dist/llms.txt

@@ -4,7 +4,7 @@
 
 ## What this is
 
-**wimui** v0.25.0 — a React 19 component library: 218 documented components across 10 categories, with design tokens, dark mode, i18n (en/ja/pt-BR) and WAI-ARIA compliant a11y. Peer deps: react ^19, react-dom ^19 (plus optional peers for specific components — see package.json).
+**wimui** v0.26.1 — a React 19 component library: 218 documented components across 10 categories, with design tokens, dark mode, i18n (en/ja/pt-BR) and WAI-ARIA compliant a11y. Peer deps: react ^19, react-dom ^19 (plus optional peers for specific components — see package.json).
 
 ## Install & required setup
 
@@ -204,7 +204,7 @@ export function BillingOverview() {
 - **Grid** — Flexbox or CSS Grid system
 - **Group** — Flexible grouping
 - **Header** — Upper navigation
-- **InteractiveArea** — Interactive empty/drop zone area
+- **InteractiveArea** — Foundation component for consistent interactive areas with borders and states.
 - **Masonry** — Waterfall grid
 - **Navbar** — Primary navigation
 - **ScrollArea** — A custom scrollbar component that provides high-performance, cross-browser consistent themes while maintaining a native-like feel.
@@ -238,8 +238,8 @@ export function BillingOverview() {
 - **FieldTemplate** — Standardizes label placement, required markings, and error message display for all form-related components.
 - **FileUpload** — File selection
 - **FloatButton** — Floating action buttons
-- **IconButton** — Icon-only button
-- **ImageCropper** — Front-end image crop and rotate tool
+- **IconButton** — A square button containing only an icon without a text label.
+- **ImageCropper** — Front-end image cropping and rotation tool.
 - **InlineEdit** — A component that allows users to switch between a view-only mode and an editable mode in-place. (aka Editable Text)
 - **Input** — Single-line input fields for text, numbers, or emails
 - **InputBase** — Standardizes the visual container, icon slots (Prefix/Suffix), and clear button behavior for text-based inputs.
@@ -251,7 +251,7 @@ export function BillingOverview() {
 - **NumberInput** — Input with step adjustments (aka Spin Button, Numeric Stepper)
 - **OtpInput** — One-time password fields
 - **PasswordInput** — Password with toggle
-- **PasswordStrength** — Visual meter to indicate password security level (aka Strength Meter)
+- **PasswordStrength** — Visual meter to indicate password security level. (aka Strength Meter)
 - **PhoneInput** — International phone number input
 - **QueryBuilder** — Visual builder for constructing complex search queries.
 - **Radio** — Single choice
@@ -268,7 +268,7 @@ export function BillingOverview() {
 - **SplitButton** — SplitButton description.
 - **Switch** — A binary switch for instantly toggling settings between on and off states (aka Toggle, Toggle Switch)
 - **SwitchGroup** — Shared state switches
-- **TagInput** — Field for entering free-form text as tags (aka Token Field, Chips Input)
+- **TagInput** — Input field for creating free-form tags. (aka Token Field, Chips Input)
 - **Textarea** — Multi-line input fields for longer text entries like descriptions or comments
 - **ThemeToggle** — Light / dark / system theme switcher
 - **TimePicker** — Time selection
@@ -340,13 +340,13 @@ export function BillingOverview() {
 - **List** — Structurally organized items in bullet points or numbered formats
 - **Markdown** — A component for safely rendering text in Markdown format.
 - **Marquee** — Scrolling text animation (aka Ticker)
-- **NodeGraph** — Interactive node-based flowchart and pipeline editor
+- **NodeGraph** — Visualizes complex networks and relationships between nodes.
 - **PullToRefresh** — Pull-to-refresh utility for enhancing mobile user experience.
 - **QRCode** — QR generator
 - **RangeCalendar** — Range calendar view
 - **Reaction** — Display emoji reaction buttons with toggleable state and counts
 - **RelativeTime** — Display a timestamp as a localized relative phrase ("3 minutes ago", "yesterday") that updates automatically as time passes.
-- **ScheduleView** — Time-grid calendar with drag-and-drop scheduling
+- **ScheduleView** — Displays tasks or events on a chronological timeline or calendar view.
 - **SortableList** — Item rearrangement and reordering
 - **Stats** — A component to highlight key performance indicators and metrics
 - **SwipeAction** — Mobile-friendly swipe actions (delete, archive) for list items.
@@ -421,9 +421,9 @@ export function BillingOverview() {
 - **InteractiveGraph** — InteractiveGraph provides a canvas for visualizing node-based data. Ideal for RAG knowledge bases, agent workflows, or state machines.
 - **MarkdownRenderer** — MarkdownRenderer converts a markdown string into WIM UI components. It uses react-markdown under the hood and applies WIM's typography system.
 - **ModelSelector** — ModelSelector is a dropdown for switching between AI models, surfacing the metadata that matters when choosing one — context window size and per-token pricing.
-- **PromptInput** — Auto-resizing prompt input with send and attachment actions
+- **PromptInput** — Interactive input optimized for AI prompt engineering with multi-line support and action triggers.
 - **SourceCitation** — Displays cited sources with title, domain, and external link for AI-generated content.
-- **StreamingText** — Streaming Markdown renderer for AI-generated responses
+- **StreamingText** — Renders text with a typewriter-like animation, ideal for AI chat responses.
 - **Terminal** — Renders terminal-style output with ANSI color support, prompt prefixes, and copy/clear controls.
 - **ThoughtProcess** — Visualizes AI reasoning steps and execution states in a timeline format.
 - **ThreadList** — ThreadList renders a conversation-history sidebar for AI chat apps — a scrollable list of past threads with an optional new-conversation action and per-thread deletion.

package/dist/locales/en/common.json

@@ -23,7 +23,6 @@
     "go_to_next_page": "Go to next page",
     "go_to_page": "Go to page {{page}}",
     "go_to_prev_page": "Go to previous page",
-    "guideline_desc": "Consider assistive technologies and diverse viewing environments.",
     "hide_password": "Hide password",
     "icon_fallback": "Icon: {{name}}",
     "items_per_page": "Items per page",
@@ -207,29 +206,6 @@
     "description": "Description",
     "design_intent_title": "Design Intent",
     "fieldTemplate_a11y_desc": "Connects the label to the input via id, and the error message via aria-describedby.",
-    "fieldTemplate_anatomy_content_desc": "The actual component slot (Input, Select, etc.).",
-    "fieldTemplate_anatomy_content_label": "Field Area",
-    "fieldTemplate_anatomy_error_desc": "Validation feedback text displayed below the field.",
-    "fieldTemplate_anatomy_error_label": "Error Message",
-    "fieldTemplate_anatomy_label_desc": "The name of the field displayed above or beside the input.",
-    "fieldTemplate_anatomy_label_label": "Label",
-    "fieldTemplate_anatomy_required_desc": "An asterisk or (required) text appended to the label.",
-    "fieldTemplate_anatomy_required_label": "Required Indicator",
-    "fieldTemplate_best_practice_1": "Use horizontal layout for dense desktop forms.",
-    "fieldTemplate_best_practice_2": "Clearly highlight required fields to reduce user errors.",
-    "fieldTemplate_choice_alt_when": "Use InputBase directly for internal controls or dense UIs where a label is not required.",
-    "fieldTemplate_choice_matrix_desc": "Comparing FieldTemplate against using InputBase directly.",
-    "fieldTemplate_choice_use_when": "Use for virtually all user-facing form fields that require a label, error message, or required indicator.",
-    "fieldTemplate_content_guideline_1": "Keep labels short and descriptive.",
-    "fieldTemplate_content_guideline_2": "Error messages should be specific and actionable.",
-    "fieldTemplate_design_intent": "Standardizes label and error presentation to ensure consistent form layout across the product.",
-    "fieldTemplate_i18n_desc": "Label and error text are provided by the consumer; the component itself has no hardcoded strings.",
-    "fieldTemplate_keyboard_desc": "Focus management follows the wrapped input component behavior.",
-    "fieldTemplate_motion_desc": "Error messages fade in to draw attention without being disruptive.",
-    "fieldTemplate_scenario_1": "A standard user registration form.",
-    "fieldTemplate_scenario_2": "A settings page with vertical or horizontal field layouts.",
-    "label_title": "Descriptive text for input fields, including required/optional marks",
-    "label_long_desc": "A component for displaying descriptions or captions for form elements.",
     "label_design_intent": "Provides clear, accessible labels for form controls to guide user input.",
     "label_choice_self_when": "Use when you need to provide a text label for a single form input.",
     "label_choice_alt_when": "Use Heading for section titles or FieldTemplate for a complete field wrapper with error handling.",
@@ -240,7 +216,7 @@
     "label_anatomy_content": "The actual descriptive text for the form element.",
     "label_content_guideline": "Keep labels short, descriptive, and avoid using them for help text.",
     "label_motion_desc": "No specific interactions or animations.",
-    "label_a11y_desc": "Ensure the Label is associated with an input via htmlFor/id.",
+    "label_a11y_desc": "This renders a real <label>, so passing htmlFor is what connects it to its control — that association is what lets a click on the text focus the field and what gives the field its accessible name. When asChild is used the element is replaced but the same attributes are merged onto the child, so the association must still be maintained by the caller. The required and optional markers are drawn by FieldLabelContent and are aria-hidden, because the requirement belongs on the control itself (aria-required) rather than being read as part of the label text.",
     "label_scenario_1": "A standard contact form.",
     "label_scenario_2": "An admin dashboard settings panel.",
     "label_best_practice_1": "Keep labels visible at all times.",
@@ -253,25 +229,6 @@
     "i18n_docgen_none": "This component renders no text of its own — localize any content you pass into it.",
     "i18n_title": "Internationalization (i18n)",
     "inputBase_a11y_desc": "Ensures interactive icons have correct roles and labels.",
-    "inputBase_anatomy_content_desc": "Space for the actual input value or selected value.",
-    "inputBase_anatomy_content_label": "Content Area",
-    "inputBase_anatomy_root_desc": "The main wrapper that defines the border and background.",
-    "inputBase_anatomy_root_label": "Container",
-    "inputBase_best_practice_1": "Use semantic colors for validation states.",
-    "inputBase_best_practice_2": "Always provide a visible label externally (via FieldTemplate).",
-    "inputBase_choice_alt_when": "Use FieldTemplate when you need to wrap an existing input component with a label or error message.",
-    "inputBase_choice_matrix_desc": "Deciding between InputBase and FieldTemplate.",
-    "inputBase_choice_use_when": "Use when building a custom input field (e.g., Search, Select) that needs uniform border and icon styling.",
-    "inputBase_content_guideline_1": "Keep icon usage minimal to avoid visual clutter.",
-    "inputBase_content_guideline_2": "Ensure the focus ring is clearly visible.",
-    "inputBase_design_intent": "InputBase provides a consistent UI shell for text-based inputs, managing icon placement, clear button, and semantic state styling.",
-    "inputBase_i18n_desc": "All visible text is provided by the consumer; InputBase itself has no hardcoded strings.",
-    "inputBase_keyboard_desc": "Delegates keyboard behavior to the wrapped native input element.",
-    "inputBase_motion_desc": "Subtle transitions on border color and clear button visibility.",
-    "inputBase_responsive_desc": "The container scales with its parent; icon widths remain fixed.",
-    "inputBase_scenario_1": "A custom search box with an action icon.",
-    "inputBase_scenario_2": "A complex input wrapper for specialized data entry.",
-    "inputBase_tokens_desc": "Border, background, and spacing tokens control the visual container styling.",
     "recommendation": "Recommendation",
     "scenario": "Scenario",
     "summary": "Summary",
@@ -352,7 +309,6 @@
     "anatomy_module_note": "This component uses CSS Modules; the class names above are local names that are hashed at build time. To override styles, use the design token CSS variables instead of targeting these classes.",
     "test_title": "Testing",
     "test_description": "You can run the unit tests for this component by executing the following command:",
-    "tokens_title": "Design Tokens",
     "usage": "Usage",
     "usage_scenario": "Usage Scenario",
     "transfer_i18n_desc": "Full support for localizing labels, placeholders, and status messages.",
@@ -412,10 +368,6 @@
     "json_viewer_responsive_desc": "Responsive container with horizontal scrolling for deep nesting.",
     "json_viewer_keyboard_desc": "Full keyboard support for tree navigation and copying.",
     "json_viewer_i18n_desc": "Toolbar labels and counts are localized.",
-    "fieldTemplate_long_desc": "A wrapper that adds a label, error message, and required indicator to any input field.",
-    "fieldTemplate_usage_desc": "Wrap any form control to provide a standardized label and error layout.",
-    "inputBase_long_desc": "Internal primitive that underlies all text-based input components.",
-    "inputBase_usage_desc": "Used mainly to build other components. Owns the input-container styling such as border, background, and icon placement.",
     "baseListItem_long_desc": "Internal list-row primitive for building selectable list behaviors.",
     "baseListItem_usage_desc": "Use as a primitive when composing list item interactions.",
     "std_column_component": "Component",

package/dist/locales/en/data-display.json

@@ -9,7 +9,6 @@
   "table": {
     "header_component": "Component",
     "header_overview": "Overview",
-    "header_usage": "Usage Scenario",
     "header_placement": "Placement"
   }
-}
+}

package/dist/locales/en/form.json

@@ -26,29 +26,7 @@
     "close": "Close",
     "dismiss": "Dismiss",
     "label": "Button",
-    "guide_title": "Button Overview",
-    "guide_desc": "Guidelines for choosing and implementing the correct button type for your interface.",
-    "priority_weighting": "A matrix describing when to use Primary, Secondary, or Tertiary buttons.",
-    "semantics_desc": "Buttons trigger actions, while Links change page location or scroll position.",
-    "semantics_guide_ref": "Refer to the Link vs Button guide for more detailed information.",
-    "standard_desc": "Standard rectangular button for general actions.",
-    "standard_usage": "Main CTAs like Submit, Save, or Add Item.",
-    "icon_usage": "Dense toolbars, media controls, or social sharing.",
-    "link_desc": "A button styled like a text link for secondary navigating actions.",
-    "group_desc": "A container that groups multiple logically related buttons together.",
-    "group_usage": "Filter bars, pagination, or multi-step form actions.",
-    "copy_desc": "A specialized button for copying text to the clipboard with visual feedback.",
-    "copy_usage": "API keys, transaction IDs, or sharing links.",
-    "guideline_principle": "Principle",
-    "guideline_detail": "Detail",
-    "consistency": "Consistency",
-    "consistency_desc": "Maintain identical label casing (Sentence case) and icon placement across all buttons.",
-    "placement_desc": "Buttons should be grouped at the bottom-right for modals or bottom-left for forms.",
-    "placement_conflict": "Placement Conflict",
-    "placement_conflict_desc": "Avoid placing multiple primary buttons on the same view."
-  },
-  "btn": {
-    "page_transition": "Standard page transitions or footer links."
+    "consistency": "Consistency"
   },
   "dropzone": {
     "description": "Drag and drop files here, or click to select"