Input

Live Editor

function InputDemo() {
  return (
    <ThemeProvider>
      <Input
        label="Workspace name"
        description="Visible to your team."
        variant="surface"
        tone="brand"
        counter
      />
    </ThemeProvider>
  );
}

Result

Loading...

Supported Props

value, onChange, onInput, onDebouncedInput, onClear, clearable, debounce, validation, size, minlength, maxlength, readOnly, autofocus, disabled, counter, floatingLabel, type, name, required, pattern, inputMode, autoComplete, min, max, step, spellCheck, placeholder, headless, variant, tone, density, shape, color, radius, label, description