Horizontal separator between items in a list.

<script setup lang="ts">
import { Separator } from "@/components/ui/separator"
</script>

<template>
  <div class="mx-auto flex w-full max-w-xs flex-col gap-2 text-sm">
    <dl class="flex items-center justify-between">
      <dt class="font-medium">Item 1</dt>
      <dd class="text-muted-foreground">Value 1</dd>
    </dl>
    <Separator />
    <dl class="flex items-center justify-between">
      <dt class="font-medium">Item 2</dt>
      <dd class="text-muted-foreground">Value 2</dd>
    </dl>
    <Separator />
    <dl class="flex items-center justify-between">
      <dt class="font-medium">Item 3</dt>
      <dd class="text-muted-foreground">Value 3</dd>
    </dl>
  </div>
</template>