EEnterUI
DocsComponentsThemesDonation
Get Started
  • Component onboarding
    • Tabs
    • Accordion
    • Disclosure
EnterUIDocsFoundationsDisclosureDisclosure
FoundationsUpdated 6 May 2026

Disclosure

A standalone expandable region for showing and hiding supporting content.

Disclosure defines how EnterUI handles a standalone expandable region for showing and hiding supporting content, including default structure, accessible states, and token-driven styling.

#Default usage

Disclosure

Disclosure is a single standalone reveal pattern, separate from multi-item Accordion.

EnterUI ships components, CSS classes, and theme-aware variables from one public entry point.

Code
<Disclosure defaultOpen>
  <DisclosureTrigger>Package details</DisclosureTrigger>
  <DisclosureContent>
    EnterUI ships components, CSS classes, and theme-aware variables from one public entry point.
  </DisclosureContent>
</Disclosure>

#Import

Code
import {
  Disclosure,
  DisclosureContent,
  DisclosureTrigger,
} from "@froggdesign/enter-ui-react";

#Accessibility

The trigger is a native button with aria-expanded and aria-controls. Closed content is hidden with the native hidden attribute.

#API

  • defaultOpen sets uncontrolled initial state.
  • open and onOpenChange support controlled usage.
  • Trigger and content accept native props and className.

#Styling

Uses .eui-disclosure classes with calm surfaces and a simple disclosure chevron.

PreviousAccordion
NextInput

On this page

  1. Default usage
  2. Import
  3. Accessibility
  4. API
  5. Styling