Components

Label

Displays a label that is usually used with an input of some sort.

Test label here

Source Code

Copy the following code into your project.

<template>
  <label
    :for="props.for"
    :class="cn('inline-block cursor-pointer text-sm font-medium', props.class)"
  >
    <slot></slot>
  </label>
</template>

<script setup lang="ts">
  const props = defineProps<{
    /**
     *  The id of the input element that the label is bound to.
     */
    for?: string;
    /**
     * The class of the label element.
     */
    class?: any;
  }>();
</script>

Input

Displays a form input field or a component that looks like an input field.

Listbox

Displays a list of options, some of which can be selected.