Disclosure

A Disclosure is one collapsible section: a heading that opens and closes the content under it. It is the single-section counterpart to an accordion, for hiding detail that most readers will not need without sending them to another page for it.

Demo

Rendered live, with the same build of the library you install.

Every component in the library, the source, and the right to ship it in anything you like.

Usage

Source

Disclosure.tsx

import { NDisclosure } from '@nayan-ui/react';

const Disclosure = () => {
  return (
    <div>
      <NDisclosure title="What is included?" defaultExpanded>
        Every component in the library, the source, and the right to ship it in anything you like.
      </NDisclosure>
      <NDisclosure title="Do I need a licence key?">No. It is MIT licensed and there is nothing to activate.</NDisclosure>
    </div>
  );
};

export default Disclosure;

Attributes

10 props

Name	Type	Default	Details
title	ReactNode	Required	The title prop.
children	ReactNode	Required	The children prop.
defaultExpanded	boolean	false	The defaultExpanded prop.
expanded	boolean	Optional	The expanded prop.
onExpandedChange	(expanded: boolean) => void	Optional	The onExpandedChange prop.
disabled	boolean	false	The disabled prop.
className	string	''	The className prop.
triggerClassName	string	''	The triggerClassName prop.
contentClassName	string	''	The contentClassName prop.
indicatorClassName	string	''	The indicatorClassName prop.

Disclosure

Demo

What is included?

Do I need a licence key?

Usage

Attributes

Tags