μMilk UI

Button

A button primitive with native semantics and disabled state.

React source
import { Button } from '@milkui/react/button';

export function SaveButton() {
  return <Button>Save changes</Button>;
}

Features

  • Renders a real button element.
  • React defaults to type="button"; native markup must specify its own type.
  • Supports disabled state in React props and native initial attributes.
  • React asChild composition, or a native marker attribute.

Anatomy

React anatomy
import { Button } from '@milkui/react/button';

<Button />

API reference

React defaults to type="button"; an explicit type prop overrides it. Use the disabled prop to disable it.

Button

PropTypeDefaultDescription
disabledbooleanfalseDisable the button.
asChildbooleanfalseRender onto the child element.
AttributeValues
[disabled]Present when disabled
[mlk-button]Button marker

Examples

Disabled

Disabled buttons keep native button semantics and do not fire click actions.

React source
<Button disabled>
  Save changes
</Button>

Keyboard interactions

Button renders a native button, so it follows browser button behavior.

KeyDescription
SpaceActivates the button.
EnterActivates the button.
TabMoves focus to the next focusable element.