UNPKG

@arolariu/components

Version:

🎨 70+ beautiful, accessible React components built on Base UI. TypeScript-first, CSS Modules styling, tree-shakeable, SSR-ready. Perfect for modern web apps, design systems & rapid prototyping. Zero config, maximum flexibility! ⚡

89 lines • 3.17 kB
import { Collapsible as BaseCollapsible } from "@base-ui/react/collapsible"; import * as React from "react"; interface CollapsibleProps extends React.ComponentPropsWithRef<typeof BaseCollapsible.Root> { } interface CollapsibleTriggerProps extends Omit<React.ComponentPropsWithRef<typeof BaseCollapsible.Trigger>, "className"> { /** * Applies additional CSS classes to the component root element. * @default undefined */ className?: string; /** * Enables child element composition instead of rendering the default wrapper. * @default false * @deprecated Prefer Base UI's `render` prop. */ asChild?: boolean; } interface CollapsibleContentProps extends Omit<React.ComponentPropsWithRef<typeof BaseCollapsible.Panel>, "className"> { /** * Applies additional CSS classes to the component root element. * @default undefined */ className?: string; } /** * Coordinates collapsible state and accessibility behavior. * * @remarks * - Delegates structure and state to the underlying Base UI primitive * - Built on {@link https://base-ui.com/react/components/collapsible | Base UI Collapsible} * - Preserves the underlying primitive API for advanced composition * * @example * ```tsx * <Collapsible>Content</Collapsible> * ``` * * @see {@link https://base-ui.com/react/components/collapsible | Base UI Documentation} */ declare function Collapsible(props: Readonly<Collapsible.Props>): React.ReactElement; declare namespace Collapsible { var displayName: string; } /** * Renders the collapsible trigger. * * @remarks * - Renders a `<button>` element by default * - Built on {@link https://base-ui.com/react/components/collapsible | Base UI Collapsible} * - Supports the `render` prop for element composition * * @example * ```tsx * <CollapsibleTrigger>Content</CollapsibleTrigger> * ``` * * @see {@link https://base-ui.com/react/components/collapsible | Base UI Documentation} */ declare const CollapsibleTrigger: React.ForwardRefExoticComponent<Omit<CollapsibleTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>; /** * Renders the collapsible content. * * @remarks * - Renders a `<div>` element by default * - Built on {@link https://base-ui.com/react/components/collapsible | Base UI Collapsible} * - Supports the `render` prop for element composition * * @example * ```tsx * <CollapsibleContent>Content</CollapsibleContent> * ``` * * @see {@link https://base-ui.com/react/components/collapsible | Base UI Documentation} */ declare const CollapsibleContent: React.ForwardRefExoticComponent<Omit<CollapsibleContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>; declare namespace Collapsible { type Props = CollapsibleProps; type State = BaseCollapsible.Root.State; } declare namespace CollapsibleTrigger { type Props = CollapsibleTriggerProps; type State = BaseCollapsible.Trigger.State; } declare namespace CollapsibleContent { type Props = CollapsibleContentProps; type State = BaseCollapsible.Panel.State; } export { Collapsible, CollapsibleContent, CollapsibleTrigger }; //# sourceMappingURL=collapsible.d.ts.map