sigilUI

Split Pane

Divide a workspace into adjacent content panels.

@sigil-ui/componentsReact

Preview

Live preview Interactive

Import

import { SplitPane } from "@sigil-ui/components";

Usage

<SplitPane left={<Card><CardHeader><CardTitle>Left</CardTitle></CardHeader></Card>} right={<Card><CardHeader><CardTitle>Right</CardTitle></CardHeader></Card>} />

CLI

npx @sigil-ui/cli add split-pane

Token Integration

SplitPane follows the Sigil component rules: styles resolve from var(--s-*), class names are mergeable through className, and the component is exported from @sigil-ui/components.

On this page

PreviewImportUsageCLIToken Integration