Box
LayoutSemantic div / span with Tailwind class merging via cn().
The most basic building block. Renders a <div> by default. Use component to change the tag or asChild to merge Box's props onto a single child element (Radix Slot pattern).
Usage
import { Box } from "nosible-ux"
export default function Example() {
return <Box component="section">Signal analysis section</Box>
}Examples
As a semantic element
Props
| Name | Type | Default | Description |
|---|---|---|---|
asChild | boolean | undefined | — | When true, merges Box props onto the child element instead of rendering a wrapper div. |
component | ElementType<any, keyof IntrinsicElements> | undefined | — | Render as a specific HTML tag or custom component. Ignored when asChild is true. Default: "div". |