wimui 0.6.0 → 0.7.0

package/dist/llms-full.txt

@@ -4,7 +4,7 @@
 
 ## What this is
 
-**wimui** v0.6.0 — a React 19 component library: 216 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.7.0 — a React 19 component library: 216 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
 
@@ -938,6 +938,9 @@ Useful for using the button styles with Link components (e.g. from React Router
     - `showPasswordAriaLabel: string` — Aria label for the show-password toggle
     - `hidePasswordAriaLabel: string` — Aria label for the hide-password toggle
     - `rightIconAriaLabel: string` — Aria label for the right icon button
+    - `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
     - `asChild: boolean` = false — Whether to render as a child element.
 - **ColorPicker** — Color selection picker
@@ -963,6 +966,9 @@ Useful for using the button styles with Link components (e.g. from React Router
     - `showPasswordAriaLabel: string` — Aria label for the show-password toggle
     - `hidePasswordAriaLabel: string` — Aria label for the hide-password toggle
     - `rightIconAriaLabel: string` — Aria label for the right icon button
+    - `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
     - `asChild: boolean` = false — Whether to render as a child element.
 - **Combobox** — Select with search
@@ -1031,6 +1037,9 @@ Useful for using the button styles with Link components (e.g. from React Router
     - `showPasswordAriaLabel: string` — Aria label for the show-password toggle
     - `hidePasswordAriaLabel: string` — Aria label for the hide-password toggle
     - `rightIconAriaLabel: string` — Aria label for the right icon button
+    - `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
 - **DatePicker** — Date selection
     - `intent: FieldIntent` = "default" — Semantic intent of the field (e.g. error state)
@@ -1066,6 +1075,12 @@ Useful for using the button styles with Link components (e.g. from React Router
     - `accept: string` — Accepted file types (e.g. ".jpg,.png").
     - `multiple: boolean` = false — Whether multiple files can be selected.
     - `disabled: boolean` = false — Whether the component is disabled.
+    - `value: string[]` — Names of the files the area should list — typically ones that already
+exist on the server, from an earlier session or an earlier step.
+
+Controlled: while this is set, it is what the area lists, and dropping or
+picking a file only fires `onChange`. Pass the new names back to show
+them. Leave it undefined to let the area track its own selection.
     - `onChange: (files: FileList | null) => void` — Callback when files are selected.
     - `className: string` — Additional class names.
     - `iconName: React.ComponentProps<typeof Icon>["name"]` = "UploadIcon" — Icon name shown in the drop area.
@@ -1080,7 +1095,12 @@ Useful for using the button styles with Link components (e.g. from React Router
 - **Fieldset** — Form grouping
     - `children: React.ReactNode` (required) — Form elements to group
     - `disabled: boolean` = false — Whether all contained form elements are disabled
-    - `variant: "default" | "full-width"` = "default" — Visual variant of the fieldset
+    - `variant: "default" | "full-width" | "plain"` = "default" — Visual variant of the fieldset.
+
+`plain` drops the frame and padding and keeps only the grouping — use it
+inside a `Card` or any surface that already draws a border, where a framed
+fieldset would put a box inside a box. The `<fieldset>` and its `<legend>`
+still do their job for assistive technology.
     - `className: string` — Additional class names
 - **FieldTemplate** — Standardizes label placement, required markings, and error message display for all form-related components.
     - `asChild: boolean` = false — Whether to render as a child element.
@@ -1101,6 +1121,12 @@ Useful for using the button styles with Link components (e.g. from React Router
     - `accept: string` — Accepted file types (e.g. ".jpg,.png")
     - `multiple: boolean` = false — Whether multiple files can be selected
     - `disabled: boolean` = false — Whether the component is disabled
+    - `value: string[]` — Names of the files the field should show — typically ones that already
+exist on the server, from an earlier session or an earlier step.
+
+Controlled: while this is set, it is what the field displays, and picking
+a file only fires `onChange`. Pass the new names back to show them. Leave
+it undefined to let the field track its own selection.
     - `onChange: (files: FileList | null) => void` — Callback when files are selected
     - `className: string` — Additional class names
     - `iconName: React.ComponentProps<typeof Icon>["name"]` — Icon name shown on the button
@@ -1173,6 +1199,9 @@ Useful for using the button styles with Link components (e.g. from React Router
     - `showPasswordAriaLabel: string` — Aria label for the show-password toggle
     - `hidePasswordAriaLabel: string` — Aria label for the hide-password toggle
     - `rightIconAriaLabel: string` — Aria label for the right icon button
+    - `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
     - `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.
@@ -1188,6 +1217,10 @@ Useful for using the button styles with Link components (e.g. from React Router
     - `onLeftIconClick: (e: React.MouseEvent<HTMLButtonElement>) => void` — Callback when the left icon is clicked (renders the icon as a button)
     - `leftIconAriaLabel: string` — Aria label for the left icon button
     - `rightIcons: InputBaseIcon[]` = [] — Icons to display on the right side
+    - `suffix: React.ReactNode` — Static text shown after the control, inside the same shell — a unit such
+as `kg`, `%` or `円`. It sits in the flex flow, so the control shrinks to
+make room rather than running underneath it.
+    - `suffixId: string` — `id` for the suffix, so the control can point `aria-describedby` at it
     - `allowClear: boolean` — Whether to show a clear button when value is present
     - `hasValue: boolean` — Whether the field currently has a value (controls clear button visibility)
     - `onClear: () => void` — Callback when the clear button is clicked
@@ -1222,6 +1255,9 @@ Useful for using the button styles with Link components (e.g. from React Router
     - `showPasswordAriaLabel: string` — Aria label for the show-password toggle
     - `hidePasswordAriaLabel: string` — Aria label for the hide-password toggle
     - `rightIconAriaLabel: string` — Aria label for the right icon button
+    - `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
     - `asChild: boolean` = false — Whether to render as a child element.
 - **LinkButton** — Anchor styled as button
@@ -1271,7 +1307,8 @@ Useful for using the button styles with Link components (e.g. from React Router
     - `required: boolean` — Whether to show the required indicator
     - `label: React.ReactNode` — Field label
     - `layout: "vertical" | "horizontal"` — Layout direction of label and field
-    - `labels: { digitAriaLabel?: (index: number) => string; }` = {} — Labels for internationalization
+    - `labels: { /** * Accessible name for one digit box. * * `position` is **1-based**: the first box is `1`, and the last is `length`. * It is meant to be read aloud ("Digit 3 of 6"), so it counts the way a person * would. Treating it as a 0-based index and adding one yields "Digit 2" for the * first box. * * @param position 1-based position of the box, from `1` to `length` * @default (position) => `Digit ${position}` */ digitAriaLabel?: (position: number) => string; }` = {} — Labels for internationalization. `digitAriaLabel(position)` names one digit
+box and receives a **1-based** position — the first box is `1`, not `0`.
     - `asChild: boolean` = false — Whether to render as a child element.
     - `fullWidth: boolean` = false — Whether to take full width of parent
 - **PasswordInput** — Password with toggle
@@ -1294,6 +1331,9 @@ Useful for using the button styles with Link components (e.g. from React Router
     - `showPasswordAriaLabel: string` — Aria label for the show-password toggle
     - `hidePasswordAriaLabel: string` — Aria label for the hide-password toggle
     - `rightIconAriaLabel: string` — Aria label for the right icon button
+    - `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
     - `asChild: boolean` = false — Whether to render as a child element.
 - **PasswordStrength** — Visual meter to indicate password security level
@@ -1445,6 +1485,9 @@ Useful for using the button styles with Link components (e.g. from React Router
     - `showPasswordAriaLabel: string` — Aria label for the show-password toggle
     - `hidePasswordAriaLabel: string` — Aria label for the hide-password toggle
     - `rightIconAriaLabel: string` — Aria label for the right icon button
+    - `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
     - `asChild: boolean` = false — Whether to render as a child element.
 - **SegmentedControl** — Button-style controls for switching between a small set of mutually exclusive options
@@ -1613,6 +1656,9 @@ Useful for using the button styles with Link components (e.g. from React Router
     - `showPasswordAriaLabel: string` — Aria label for the show-password toggle
     - `hidePasswordAriaLabel: string` — Aria label for the hide-password toggle
     - `rightIconAriaLabel: string` — Aria label for the right icon button
+    - `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
     - `asChild: boolean` = false — Whether to render as a child element.
 - **ToggleGroup** — Toggleable buttons
@@ -1678,8 +1724,15 @@ Useful for using the button styles with Link components (e.g. from React Router
 
 - **Alert** — Important messages
     - `title: React.ReactNode` — Title of the alert
-    - `titleTag: "h1" | "h2" | "h3" | "h4" | "h5" | "h6"` = "h4" — HTML tag used for the alert title
-@default "h4"
+    - `titleTag: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div" | "p" | "strong" | "span"` = "div" — HTML tag used for the alert title.
+
+The default is a `div`: an alert is a notice, not a section of the
+document, so its title does not belong in the heading outline. Making it
+one also breaks `heading-order` as soon as the alert sits under anything
+other than an `h3`. Pass a heading only when the alert really does head a
+section of the page.
+
+@default "div"
     - `description: React.ReactNode` — Description text of the alert
     - `intent: FeedbackIntent` = "default" — Intent (semantic state) of the alert
 @default "default"
@@ -2527,6 +2580,12 @@ Defaults to the localized `form.optional` string.
 @default "normal"
     - `decoration: "line-through" | "underline" | "highlight" | "none"` = "none" — Visual decoration applied to the text.
 @default "none"
+    - `nowrap: boolean` = false — Keep the text on one line instead of wrapping. Overflow is left visible —
+use `truncate` to clip it with an ellipsis.
+@default false
+    - `truncate: boolean` = false — Keep the text on one line and clip the overflow with an ellipsis.
+Implies `nowrap`.
+@default false
     - `content: React.ReactNode` — Content of the text. Alternative to children (children take precedence only with asChild).
 - **Title** — Possesses visual weight (boldness/size) to indicate page structure.
     - `asChild: boolean` = false — If true, the heading will be rendered as its child, merging its props onto that child.
@@ -2581,7 +2640,10 @@ Defaults to the localized `form.optional` string.
     - `component: React.ComponentType<React.SVGProps<SVGSVGElement>>` — Icon component passed directly. Works without registration and is tree-shakable.
     - `size: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl"` = "md" — Size of the icon
     - `spin: boolean` — Apply the loading rotation animation
-    - `color: "danger" | "success" | "warning" | "info" | "primary" | "secondary" | "tertiary" | "disabled"` — Semantic color of the icon
+    - `color: T | (string & {})` — Colour of the icon. Takes the semantic names — `"danger"`, `"success"`,
+`"warning"`, `"info"`, `"primary"`, `"secondary"`, `"tertiary"`,
+`"disabled"` — and, like `Text`, any design token colour name such as
+`"text-tertiary"`, or any CSS colour value.
 - **Image** — Image content
     - `src: string` (required) — Source URL of the image
     - `alt: string` (required) — Alternative text for the image

package/dist/llms.txt

@@ -4,7 +4,7 @@
 
 ## What this is
 
-**wimui** v0.6.0 — a React 19 component library: 216 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.7.0 — a React 19 component library: 216 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