Accordion

Akordeon s variantami default / filled / separated / outlined, multiple expand a icon position

Installation

Usage

Preview

Varianta: default
Vlastní kolekce React komponent pro Tailwind + TypeScript.
npx shadcn@latest add "https://registry.ceskysoftware.cz/TOKEN/r/[název].json"
Varianta: filled
Vlastní kolekce React komponent pro Tailwind + TypeScript.
npx shadcn@latest add "https://registry.ceskysoftware.cz/TOKEN/r/[název].json"
Varianta: separated
Vlastní kolekce React komponent pro Tailwind + TypeScript.
npx shadcn@latest add "https://registry.ceskysoftware.cz/TOKEN/r/[název].json"
Varianta: outlined
Vlastní kolekce React komponent pro Tailwind + TypeScript.
npx shadcn@latest add "https://registry.ceskysoftware.cz/TOKEN/r/[název].json"
Multiple expand (filled)
Obě sekce jsou výchozně otevřené.
V multiple módu lze mít otevřeno více najednou.

Import

import { Accordion } from "@/components/ui/accordion"

Example

<Accordion variant="default" multiple={false} defaultOpen={["1"]} items={[ { id: "1", title: "Sekce 1", content: "Obsah první sekce." }, { id: "2", title: "Sekce 2", content: "Obsah druhé sekce." }, { id: "3", title: "Sekce 3", content: "Obsah třetí sekce." }, ]} />

Dependencies

lucide-react@ceskysoftware/utils (registry)