[epic] Paper

[soroushm]

In Material Design, a "paper" refers to a container that is used to hold content and that is designed to look like a sheet of paper. Papers are used to create a sense of depth and to visually separate content from the rest of the interface.

Papers in Material Design can be created using various HTML elements, such as div, span, or section, and styled using CSS. The Material Design guidelines provide a set of predefined classes that can be used to apply the desired visual styling to a paper.

Import

import Paper from '@mnui/material/Paper';
// or
import { Paper } from '@mnui/material';

Props

Props of the native component are also available.

Name	Type	Default	Description
children	node		The content of the component.
component	elementType		The component used for the root node. Either a string to use a HTML element or a component.
elevation	integer	1	Shadow depth, corresponds to dp in the spec. It accepts values between 0 and 24 inclusive.
square	bool	false	If true, rounded corners are disabled.
sx	Array<func, object, bool>, func, object		The system prop that allows defining system overrides as well as additional CSS styles. See the `sx` epic for more details.
variant	'elevation', 'outlined', string	'elevation'	The variant to use.

The ref is forwarded to the root element.