import "./text_disclosure.css"; import type * as React from "react"; import { Button as Base } from "@base-ui/react/button"; import { type StyleProps } from "./style_props"; import type { TextSize } from "./text"; /** * It takes no `TriggerProps`: a disclosure reveals content ALREADY on the page, * so it never stands in for an overlay's trigger — and `onToggle` is the name * the DOM gives a `
` event, which such a prop set would collide with. */ export interface TextDisclosureProps extends StyleProps { /** Open state — controlled, because the content it reveals is the caller's. */ expanded: boolean; onToggle: (expanded: boolean) => void; /** What is behind it, as a noun: "transcript", "3 earlier replies". The verb * is supplied — a caller writing its own "Show …" ends up with two vocabularies * for one control the first time somebody writes "View". */ label: string; /** Matches the prose it sits in. Default "sm". */ size?: TextSize; /** Announced name, when `label` alone is ambiguous on a page with several. */ accessibilityLabel?: string; testID?: string; ref?: React.Ref; render?: Base.Props["render"]; } /** * An in-prose DISCLOSURE: muted underlined text that reveals adjacent content in * place — a transcript under its player, a long value under its summary. * * The counterpart to {@link TextLink}, and the pair is the point: underlined text * either GOES somewhere or REVEALS something, and the INK says which. * * blue + `role="link"` (`Link`) → leaves this surface * muted underline (this) → reveals more of it, right here * * Both answer "show me more"; only one takes the reader away, which is the single * question the affordance exists to answer. Anything that MUTATES — saves, sends, * deletes, opens an overlay — carries a control surface instead (`Button` in * chrome, `InlineButton` on a field). See composition.md §"Commit & feedback surfaces". * * **Why this is a component rather than three lines at each call site.** It * carries a contract, and every part of it is a thing a hand-roll gets wrong: * * - **A `