Switch

<script setup lang="ts">
const notifications = ref(true);
const marketing = ref(false);
</script>

<template>
  <div class="demo-stack">
    <UiSwitch v-model="notifications" label="Push notifications" />
    <UiSwitch v-model="marketing" label="Product updates" size="small" />
    <UiSwitch :model-value="true" label="Required" disabled />
  </div>
</template>

<script setup lang="ts">
const digest = ref(true);
</script>

<template>
  <div class="demo-stack">
    <UiSwitch v-model="digest" label="Weekly digest" hint="A summary every Monday morning." />
  </div>
</template>