Skip to main content

Options panel

An elegant way to display options in an options page, with a contained width and options for label and help text.

<OptionsPanel>
	<OptionsPanelSection>
		<span>This is demo content</span>
	</OptionsPanelSection>
</OptionsPanel>

For the complete list of props, use your IDE's autocomplete functionality.

Multiple sections

<OptionsPanel>
	<OptionsPanelSection>
		<span>Section 1 content</span>
	</OptionsPanelSection>
	<OptionsPanelSection>
		<span>Section 2 content</span>
	</OptionsPanelSection>
</OptionsPanel>

Title and help text

<OptionsPanel
	title='Demo panel title'
	help='Demo panel help'
>
	<OptionsPanelSection>
		<span>Section content</span>
	</OptionsPanelSection>
</OptionsPanel>