Box

Bordered container for grouping content. Pass a title to render a full-width titled panel with an uppercase header bar.

Example

Content inside a box

Titled Box

top permitted domains

Content inside a titled box. The header bar spans the full width with a dotted bottom border.

Props

Prop	Type	Default	Description
`title`	`string`	—	If set, renders a full-width uppercase title bar at the top of the box
`class`	`string`	—	Additional CSS classes
`children`	`Snippet`	—	Box content

Usage

<script>
  import { Box } from '@chrissnell/chonky-ui';
</script>

<Box>
  <p>Grouped content here</p>
</Box>

<Box title="query types">
  <p>Content below a titled header bar</p>
</Box>