---
name: Section control
route: /components/common/section-control
edit: false
---

import { Playground, Props } from 'docz'
import SectionControl from './section-control'

# SectionControl
**SUBCATEGORY:** Controls

<hr />

## Section Control (disclosure)
### Description
For efficiently displaying sections of content as blocks, collapsed on first view.
A control expands or collapses each block to reveal or conceal content.

<Playground>
  <SectionControl sectionTitle='Section title'>Section text</SectionControl>
  <SectionControl sectionTitle='Section title'>Section text</SectionControl>
</Playground>

<hr />

## Section Control (inverse, disclosure)
### Description
For efficiently displaying sections of content as blocks, collapsed on first view.
A control expands or collapses each block to reveal or conceal content.

<Playground style={{ backgroundColor: "#333", margin: '-2em', padding: '2em' }}>
    <SectionControl inverse sectionTitle='Section title'>Section text</SectionControl>
    <SectionControl inverse sectionTitle='Section title'>Section text</SectionControl>
</Playground>

<hr />

## Properties
<Props of={SectionControl} />