# ddm-collapsible

> Collapsible component used in Deseret Digital projects.

Latest version **1.0.1** (published 2016-01-27) · MIT license · 0 weekly downloads

## Install

```sh
npm install ddm-collapsible
pnpm add ddm-collapsible
yarn add ddm-collapsible
bun add ddm-collapsible
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2016-01-27 |
| First published | 2014-11-19 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Maintainers | janiv, jluker, mkartchner994, ponchorage, quiet-omen |
| Keywords | collapsible, ddm |

## Links

- npm: https://www.npmjs.com/package/ddm-collapsible
- Repository: https://github.com/deseretdigital-ui/ddm-collapsible
- Homepage: http://github.com/deseretdigital-ui/ddm-collapsible
- Issues: https://github.com/deseretdigital-ui/ddm-collapsible
- npm.io page: https://npm.io/package/ddm-collapsible

## Recent versions

- 1.0.1 (latest) — 2016-01-27
- 1.0.0 — 2016-01-20
- 0.1.10 — 2015-10-02
- 0.1.9 — 2015-10-02
- 0.1.7 — 2015-01-16
- 0.1.6 — 2014-12-31
- 0.1.5 — 2014-12-08
- 0.1.4 — 2014-12-03
- 0.1.3 — 2014-12-03
- 0.1.2 — 2014-11-20
- 0.1.1 — 2014-11-19
- 0.1.0 — 2014-11-19

## README

# DDM Collapsible

Collapsible component for DDM projects.


## React

This library is written in [React.js](http://facebook.github.io/react/).


## JSX Example

```jsx
React.render(
  <CollapsibleGroup>
    <Collapsible>
      <CollapsibleHead>Collapsible 1</CollapsibleHead>
      <CollapsibleBody>
        ...
      </CollapsibleBody>
    </Collapsible>
    <Collapsible>
      <CollapsibleHead>Collapsible 2</CollapsibleHead>
      <CollapsibleBody>
        ...
      </CollapsibleBody>
    </Collapsible>
  </CollapsibleGroup>,
  DOMElement
);
```

## Reference


### `CollapsibleGroup`

A container for multiple `Collapsible` components.

#### Props

+ `open={true|false}`: Sets the initial state of child `Collapsible` components to open.
+ `accordion={true}`: Enables accordion behavior where only one `Collapsible` is open at a time.


### `Collapsible`

A component that expands and collapses.

#### Props

+ `open={true|false}`: Sets the initial state to open. Overrides `open` prop from `CollapsibleGroup`.

#### Requirements

Must contain exactly one `CollapsibleHead` and one `CollapsibleBody`.


### `CollapsibleHead`

The head of a `Collapsible` component. Acts as a toggle for collapsing and expanding the `Collapsible`.

#### Props

+ `href="..."`: Convenience for making text in `CollapsibleHead` into a link. Setting this eliminates
the need of typing out an anchor tag.


### `CollapsibleBody`

The body of a `Collapsible` component. Expands and collapses using CSS transitions and max-height.

#### Props

No props available.


## CSS Transform

To enable css transform on the `CollapsibleHead` arrow add the `csstransforms` class to the `html`
element using a library such as [Modernizr](http://modernizr.com/).

---
_Source: https://npm.io/package/ddm-collapsible · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._