Collapsible

An interactive component which expands/collapses a panel.

@peduarte starred 3 repositories

@radix-ui/primitives

@radix-ui/colors

@stitches/react

templ

templ CollapsibleDemo() {
	@ui.Collapsible(false, "w-[350px] space-y-2", nil) {
		<div class="flex items-center justify-between space-x-4 px-4">
			<h4 class="text-sm font-semibold">{ "@peduarte starred 3 repositories" }</h4>
			@ui.Button(ui.ButtonTypeButton, ui.ButtonVariantGhost, ui.ButtonSizeIcon, "", ui.CollapsibleTriggerAttrs) {
				@icons.ChevronsUpDown(icons.Props{Class: "h-4 w-4"})
				<span class="sr-only">Toggle</span>
			}
		</div>
		<div class="rounded-md border px-4 py-3 font-mono text-sm">{ "@radix-ui/primitives" }</div>
		@ui.CollapsibleContent("space-y-2", nil) {
			<div class="rounded-md border px-4 py-3 font-mono text-sm">{ "@radix-ui/colors" }</div>
			<div class="rounded-md border px-4 py-3 font-mono text-sm">{ "@stitches/react" }</div>
		}
	}
}