Input component


Basic usage

import { WInput } from "vue-windi"

Basic

    <WInput placeholder="Type here..." />

No Border

    <WInput :bordered="false" placeholder="No Border..." />

Ghost

    <WInput :bordered="false" ghost placeholder="Ghost..." />

Sizes

<WInput size="xs" placeholder="Type here..." />
<WInput size="sm" placeholder="Type here..." />
<WInput size="md" placeholder="Type here..." />
<WInput size="lg" placeholder="Type here..." />

Colors

<WInput color="primary" placeholder="Type here..." />
<WInput color="secondary" placeholder="Type here..." />
<WInput color="success" placeholder="Type here..." />
<WInput color="warning" placeholder="Type here..." />
<WInput color="danger" placeholder="Type here..." />

Label

<WInput
  label="Your name"
  placeholder="With label here..."
/>

Ghost

The name field is required.
<WInput
  label="Your name"
  v-model:value="input.validation"
  error="The name field is required."
  placeholder="With validation here..."
/>

Disabled

<WInput disabled label="Disabled" placeholder="Type here..." />
<WInput disabled label="Disabled" value="disabled with text" />