Collapsible

Examples are the tab where the component is shown doing a job, not demonstrating a prop. The API tab already lists the props.

Press Compare. The frames are real viewports, so a layout that breaks at 320 breaks here too rather than in somebody's hands.

In a page

import { Collapsible } from "@sushindustries/ui";

export function ChangelogEntry({ version, details }: { version: string; details: string }) {
	return (
		<article>
			<p>Version {version} shipped with the usual fixes.</p>
			<Collapsible summary="Full changelog">
				<p>{details}</p>
			</Collapsible>
		</article>
	);
}

What this example is not

CollapsibleCollapsibleOne details, dressed - a sentence that opens, for prose rather than lists.@sushindustries/ui · layout sits inside a plain <article> here, not a list of entries each with their own toggle - if the page needed several changelog entries all independently expandable in a stack, AccordionAccordiondetails, stacked - every behaviour ships in the element, and items open independently on purpose.@sushindustries/ui · layout is the component that gives them the shared border and grouped look.