Dropdown

The dropdown component is a simple wrapper around a button and a list of items. It is used to create a dropdown menu, that can be opened and closed by clicking on the button or clicking outside the dropdown.

Usage

<script setup lang="ts">
import { Table, TableHeader, TableData } from "@froeschke/ui";
</script>

<template>
  <Table title="My Table" description="This is a description for my table">
    <template #header>
      <TableHeader>ID</TableHeader>
      <TableHeader>Name</TableHeader>
    </template>
    <template #body>
      <tr>
        <TableData>1</TableData>
        <TableData>John Doe</TableData>
      </tr>
      <tr>
        <TableData>2</TableData>
        <TableData>Jane Doe</TableData>
      </tr>
    </template>
  </Table>
</template>

Props

Table

Name	Type	Default	Description
title	String	-	The title of the dropdown button
description	String	-	The description of the table

TableHeader

Name	Type	Default	Description
bold	Boolean	false	Whether the header should be bold