Disclosure stack
A compact set of disclosures for layered supporting information.
Show the most useful answer first. The surrounding questions stay in place so people can scan what else is available.
Implementation
1"use client";2 3import { useId, useState, type ReactNode } from "react";4import { Plus } from "lucide-react";5 6export type DisclosureItem = {7 id: string;8 title: string;9 content: ReactNode;10 meta?: string;11};12 13export type DisclosureStackProps = {14 items: DisclosureItem[];15 mode?: "single" | "multiple";16 defaultOpen?: string[];17 openIds?: string[];18 collapsible?: boolean;19 onOpenChange?: (ids: string[]) => void;20};21 22/** Accessible disclosure list with single or multiple open panels. */23export function DisclosureStack({24 items,25 mode = "single",26 defaultOpen = [],27 openIds,28 collapsible = true,