Input (输入框)

<script setup lang="ts">
import { ref } from 'vue'
const value = ref('')
</script>

<template>
  <KunInput
    v-model="value"
    label="Username"
    placeholder="Type here…"
    helper-text="Helper text below the field."
    class-name="max-w-xs"
  />
</template>

<script setup lang="ts">
import { ref } from 'vue'
const a = ref('')
const b = ref('locked')
</script>

<template>
  <div class="flex max-w-xs flex-col gap-3">
    <KunInput v-model="a" label="With error" error="This field is required." />
    <KunInput v-model="b" label="Disabled" disabled />
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
const v = ref('')
</script>

<template>
  <div class="flex max-w-xs flex-col gap-3">
    <KunInput v-model="v" size="sm" placeholder="sm" />
    <KunInput v-model="v" size="md" placeholder="md" />
    <KunInput v-model="v" size="lg" placeholder="lg" />
  </div>
</template>