| variant | "input" | "default" | "outline" | null | undefined | - | |
| tone | "neutral" | "danger" | null | undefined | - | |
| inset | boolean | null | undefined | - | |
| radius | "rounded" | "square" | "full" | null | undefined | - | |
| size | "base" | "2xs" | "xs" | "sm" | "lg" | "xl" | "2xl" | "3xl" | null | undefined | - | |
| render | useRender.RenderProp<Record<string, unknown>> | undefined | - | Replace the default <button> with another element or component. Glyph props render inside it, around children; the element should carry no children of its own. |
| active | boolean | undefined | - | Whether the item is in an active/selected state |
| activeIndicator | "none" | "dot" | "check" | undefined | - | Visual indicator for active state. "dot" shows grey dot normally, green when active. "check" shows green checkmark only when active. |
| loading | boolean | undefined | - | Show loading spinner in place of icon |
| indicator | React.ReactNode | - | Indicator element for checkbox/radio items (absolutely positioned on left). Automatically enables inset. |
| selectionMode | "checkbox" | "radio" | undefined | - | Selection visual: "checkbox" renders Checkbox, "radio" renders radio circle. Defaults to "checkbox" when checked is set. |
| checked | boolean | undefined | - | Checked state. Renders the selectionMode indicator inline. When undefined, no indicator renders. |
| avatar | React.ReactNode | - | Avatar element to display at the start (takes precedence over icon and dot) |
| dot | boolean | "neutral" | "brand" | "danger" | "warning" | "success" | "info" | undefined | - | Dot indicator at the start, centred in the icon space (takes precedence over icon): true for a neutral dot, or a {@link Tone} to tint it. |
| icon | LucideIcon | React.ComponentType<React.SVGProps<SVGSVGElement>> | undefined | - | Icon to display at the start |
| iconClassName | string | undefined | - | Additional className for the icon |
| suffixIcon | LucideIcon | React.ComponentType<React.SVGProps<SVGSVGElement>> | undefined | - | Icon to display at the end (e.g., checkmark, chevron). Takes precedence over kbd. |
| kbd | string[] | undefined | - | Keyboard shortcut keys to display (e.g., ["⌘", "C"]). Ignored if suffixIcon is provided. |
| kbdTone | "neutral" | "brand" | "danger" | null | undefined | - | Tone for kbd elements. Options: "neutral" (default), "brand", "danger". |
| kbdEmphasis | "outline" | "solid" | "ghost" | "soft" | null | undefined | - | Emphasis for kbd elements. Options: "solid" (default), "soft", "outline", "ghost". |
| suffix | React.ReactNode | - | Content to display at the end after suffixIcon/kbd (e.g., custom content) |
| children | string | number | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | undefined | - | Text label for the menu item. Use icon prop for icons, not children. |