UNPKG

5.6 kBJavaScriptView Raw
1"use strict";
2
3var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
5var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
6
7Object.defineProperty(exports, "__esModule", {
8 value: true
9});
10exports.default = exports.styles = void 0;
11
12var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
13
14var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
15
16var React = _interopRequireWildcard(require("react"));
17
18var _propTypes = _interopRequireDefault(require("prop-types"));
19
20var _clsx = _interopRequireDefault(require("clsx"));
21
22var _withStyles = _interopRequireDefault(require("../styles/withStyles"));
23
24var _Typography = _interopRequireDefault(require("../Typography"));
25
26var styles = {
27 /* Styles applied to the root element. */
28 root: {
29 display: 'flex',
30 alignItems: 'center',
31 padding: 16
32 },
33
34 /* Styles applied to the avatar element. */
35 avatar: {
36 flex: '0 0 auto',
37 marginRight: 16
38 },
39
40 /* Styles applied to the action element. */
41 action: {
42 flex: '0 0 auto',
43 alignSelf: 'flex-start',
44 marginTop: -8,
45 marginRight: -8
46 },
47
48 /* Styles applied to the content wrapper element. */
49 content: {
50 flex: '1 1 auto'
51 },
52
53 /* Styles applied to the title Typography element. */
54 title: {},
55
56 /* Styles applied to the subheader Typography element. */
57 subheader: {}
58};
59exports.styles = styles;
60var CardHeader = /*#__PURE__*/React.forwardRef(function CardHeader(props, ref) {
61 var action = props.action,
62 avatar = props.avatar,
63 classes = props.classes,
64 className = props.className,
65 _props$component = props.component,
66 Component = _props$component === void 0 ? 'div' : _props$component,
67 _props$disableTypogra = props.disableTypography,
68 disableTypography = _props$disableTypogra === void 0 ? false : _props$disableTypogra,
69 subheaderProp = props.subheader,
70 subheaderTypographyProps = props.subheaderTypographyProps,
71 titleProp = props.title,
72 titleTypographyProps = props.titleTypographyProps,
73 other = (0, _objectWithoutProperties2.default)(props, ["action", "avatar", "classes", "className", "component", "disableTypography", "subheader", "subheaderTypographyProps", "title", "titleTypographyProps"]);
74 var title = titleProp;
75
76 if (title != null && title.type !== _Typography.default && !disableTypography) {
77 title = /*#__PURE__*/React.createElement(_Typography.default, (0, _extends2.default)({
78 variant: avatar ? 'body2' : 'h5',
79 className: classes.title,
80 component: "span",
81 display: "block"
82 }, titleTypographyProps), title);
83 }
84
85 var subheader = subheaderProp;
86
87 if (subheader != null && subheader.type !== _Typography.default && !disableTypography) {
88 subheader = /*#__PURE__*/React.createElement(_Typography.default, (0, _extends2.default)({
89 variant: avatar ? 'body2' : 'body1',
90 className: classes.subheader,
91 color: "textSecondary",
92 component: "span",
93 display: "block"
94 }, subheaderTypographyProps), subheader);
95 }
96
97 return /*#__PURE__*/React.createElement(Component, (0, _extends2.default)({
98 className: (0, _clsx.default)(classes.root, className),
99 ref: ref
100 }, other), avatar && /*#__PURE__*/React.createElement("div", {
101 className: classes.avatar
102 }, avatar), /*#__PURE__*/React.createElement("div", {
103 className: classes.content
104 }, title, subheader), action && /*#__PURE__*/React.createElement("div", {
105 className: classes.action
106 }, action));
107});
108process.env.NODE_ENV !== "production" ? CardHeader.propTypes = {
109 // ----------------------------- Warning --------------------------------
110 // | These PropTypes are generated from the TypeScript type definitions |
111 // | To update them edit the d.ts file and run "yarn proptypes" |
112 // ----------------------------------------------------------------------
113
114 /**
115 * The action to display in the card header.
116 */
117 action: _propTypes.default.node,
118
119 /**
120 * The Avatar for the Card Header.
121 */
122 avatar: _propTypes.default.node,
123
124 /**
125 * @ignore
126 */
127 children: _propTypes.default.node,
128
129 /**
130 * Override or extend the styles applied to the component.
131 * See [CSS API](#css) below for more details.
132 */
133 classes: _propTypes.default.object,
134
135 /**
136 * @ignore
137 */
138 className: _propTypes.default.string,
139
140 /**
141 * The component used for the root node.
142 * Either a string to use a HTML element or a component.
143 */
144 component: _propTypes.default
145 /* @typescript-to-proptypes-ignore */
146 .elementType,
147
148 /**
149 * If `true`, `subheader` and `title` won't be wrapped by a Typography component.
150 * This can be useful to render an alternative Typography variant by wrapping
151 * the `title` text, and optional `subheader` text
152 * with the Typography component.
153 */
154 disableTypography: _propTypes.default.bool,
155
156 /**
157 * The content of the component.
158 */
159 subheader: _propTypes.default.node,
160
161 /**
162 * These props will be forwarded to the subheader
163 * (as long as disableTypography is not `true`).
164 */
165 subheaderTypographyProps: _propTypes.default.object,
166
167 /**
168 * The content of the Card Title.
169 */
170 title: _propTypes.default.node,
171
172 /**
173 * These props will be forwarded to the title
174 * (as long as disableTypography is not `true`).
175 */
176 titleTypographyProps: _propTypes.default.object
177} : void 0;
178
179var _default = (0, _withStyles.default)(styles, {
180 name: 'MuiCardHeader'
181})(CardHeader);
182
183exports.default = _default;
\No newline at end of file