BASuite

BAButtonBAInputBABoxBACheckboxBACollapseBADateBAFormElement

BABox

A simple wrapper component for layout and styling, similar to a div but with extended props.

Default Box
Clickable Box
Box with Inline Styles

Example:

 
import { BABox } from "basuite"; 
<> 
    <BABox className="p-4 bg-gray-100 rounded">Default Box</BABox> 
    <BABox className="p-4 bg-blue-100 rounded" onClick={() => alert("Clicked!")}> Clickable Box </BABox> 
    <BABox className="p-4 bg-green-100 rounded" sx={{ border: "1px solid green" }}> Box with Inline Styles </BABox> 
</>

Props:

NameTypeDescriptionDefault
childrenReact.ReactNodeContent inside the box.
classNamestringOptional CSS className for styling.
sxanyInline styles for additional customization.
onClick() => voidClick handler for the box container.