UNPKG

3.32 kBJavaScriptView Raw
1import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
2import _extends from "@babel/runtime/helpers/esm/extends";
3import * as React from 'react';
4import PropTypes from 'prop-types';
5import clsx from 'clsx';
6import { chainPropTypes } from '@material-ui/utils';
7import withStyles from '../styles/withStyles';
8export const styles = theme => {
9 const elevations = {};
10 theme.shadows.forEach((shadow, index) => {
11 elevations[`elevation${index}`] = {
12 boxShadow: shadow
13 };
14 });
15 return _extends({
16 /* Styles applied to the root element. */
17 root: {
18 backgroundColor: theme.palette.background.paper,
19 color: theme.palette.text.primary,
20 transition: theme.transitions.create('box-shadow')
21 },
22
23 /* Styles applied to the root element if `square={false}`. */
24 rounded: {
25 borderRadius: theme.shape.borderRadius
26 },
27
28 /* Styles applied to the root element if `variant="outlined"`. */
29 outlined: {
30 border: `1px solid ${theme.palette.divider}`
31 }
32 }, elevations);
33};
34const Paper = /*#__PURE__*/React.forwardRef(function Paper(props, ref) {
35 const {
36 classes,
37 className,
38 component: Component = 'div',
39 square = false,
40 elevation = 1,
41 variant = 'elevation'
42 } = props,
43 other = _objectWithoutPropertiesLoose(props, ["classes", "className", "component", "square", "elevation", "variant"]);
44
45 return /*#__PURE__*/React.createElement(Component, _extends({
46 className: clsx(classes.root, className, variant === 'outlined' ? classes.outlined : classes[`elevation${elevation}`], !square && classes.rounded),
47 ref: ref
48 }, other));
49});
50process.env.NODE_ENV !== "production" ? Paper.propTypes = {
51 // ----------------------------- Warning --------------------------------
52 // | These PropTypes are generated from the TypeScript type definitions |
53 // | To update them edit the d.ts file and run "yarn proptypes" |
54 // ----------------------------------------------------------------------
55
56 /**
57 * The content of the component.
58 */
59 children: PropTypes.node,
60
61 /**
62 * Override or extend the styles applied to the component.
63 * See [CSS API](#css) below for more details.
64 */
65 classes: PropTypes.object,
66
67 /**
68 * @ignore
69 */
70 className: PropTypes.string,
71
72 /**
73 * The component used for the root node.
74 * Either a string to use a HTML element or a component.
75 */
76 component: PropTypes
77 /* @typescript-to-proptypes-ignore */
78 .elementType,
79
80 /**
81 * Shadow depth, corresponds to `dp` in the spec.
82 * It accepts values between 0 and 24 inclusive.
83 */
84 elevation: chainPropTypes(PropTypes.number, props => {
85 const {
86 classes,
87 elevation
88 } = props; // in case `withStyles` fails to inject we don't need this warning
89
90 if (classes === undefined) {
91 return null;
92 }
93
94 if (elevation != null && classes[`elevation${elevation}`] === undefined) {
95 return new Error(`Material-UI: This elevation \`${elevation}\` is not implemented.`);
96 }
97
98 return null;
99 }),
100
101 /**
102 * If `true`, rounded corners are disabled.
103 */
104 square: PropTypes.bool,
105
106 /**
107 * The variant to use.
108 */
109 variant: PropTypes.oneOf(['elevation', 'outlined'])
110} : void 0;
111export default withStyles(styles, {
112 name: 'MuiPaper'
113})(Paper);
\No newline at end of file