Card & separator.
A quiet frame for related content.
LIVE PREVIEWTry it. It works.
Interface studiesDraft
One quiet frame for the things that belong together.
Usage
<Card><h3>Project details</h3><Separator /><p>One place for the essentials.</p></Card>Import components from @bld8/ui and include @bld8/ui/styles.css once. Wrap the application in UIProvider.
API & behaviour
Card forwards div props; Separator forwards hr props. Choose heading levels that fit the consuming page. Containers impose no layout or action behaviour.
Notes to self
Test this component with real content, keyboard input and both themes. The example is a starting point; labels, error handling and behaviour still need to fit the application.