SurfaceProps API Reference
Prop reference
| Title | Type | Default | Description |
|---|---|---|---|
| variant | 'card' | 'well' | 'shape' | – | The variant of the surface, shape is currently experimental. |
| color | 'foreground' | 'background' | 'accent' | 'danger' | 'string' | – | The color of the surface. |
| shadow | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | – | The shadow size of the surface. |
| border | 'sm' | 'md' | 'lg' | 'xl' | 'none' | – | The border size of the surface. |
| rounded | 'sm' | 'md' | 'lg' | 'xl' | 'full' | – | The border radius of the surface. |
| padding | Size | – | The padding size of the surface. |
| onClick | OnClickFunction<HTMLDivElement> | – | The click handler for the surface. |
| className | string | – | Additional classNames for the root element |
| style | CSSProperties | – | Additional styles for the root element |
* Props marked with an asterisk are required.
CSS target reference
| Export | CSS Class Target | Description |
|---|---|---|
| SurfaceTargetClassRoot | .NPUI-Surface-root | Root of the Surface component |
Exports are available from /src/components/surface/surface.tsx or from
Related APIs