UNPKG

5.54 kBJavaScriptView Raw
1import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
2import _extends from "@babel/runtime/helpers/esm/extends";
3const _excluded = ["children", "className", "disableTypography", "inset", "primary", "primaryTypographyProps", "secondary", "secondaryTypographyProps"];
4import * as React from 'react';
5import PropTypes from 'prop-types';
6import clsx from 'clsx';
7import { unstable_composeClasses as composeClasses } from '@mui/base';
8import Typography from '../Typography';
9import ListContext from '../List/ListContext';
10import useThemeProps from '../styles/useThemeProps';
11import styled from '../styles/styled';
12import listItemTextClasses, { getListItemTextUtilityClass } from './listItemTextClasses';
13import { jsx as _jsx } from "react/jsx-runtime";
14import { jsxs as _jsxs } from "react/jsx-runtime";
15
16const useUtilityClasses = ownerState => {
17 const {
18 classes,
19 inset,
20 primary,
21 secondary,
22 dense
23 } = ownerState;
24 const slots = {
25 root: ['root', inset && 'inset', dense && 'dense', primary && secondary && 'multiline'],
26 primary: ['primary'],
27 secondary: ['secondary']
28 };
29 return composeClasses(slots, getListItemTextUtilityClass, classes);
30};
31
32const ListItemTextRoot = styled('div', {
33 name: 'MuiListItemText',
34 slot: 'Root',
35 overridesResolver: (props, styles) => {
36 const {
37 ownerState
38 } = props;
39 return [{
40 [`& .${listItemTextClasses.primary}`]: styles.primary
41 }, {
42 [`& .${listItemTextClasses.secondary}`]: styles.secondary
43 }, styles.root, ownerState.inset && styles.inset, ownerState.primary && ownerState.secondary && styles.multiline, ownerState.dense && styles.dense];
44 }
45})(({
46 ownerState
47}) => _extends({
48 flex: '1 1 auto',
49 minWidth: 0,
50 marginTop: 4,
51 marginBottom: 4
52}, ownerState.primary && ownerState.secondary && {
53 marginTop: 6,
54 marginBottom: 6
55}, ownerState.inset && {
56 paddingLeft: 56
57}));
58const ListItemText = /*#__PURE__*/React.forwardRef(function ListItemText(inProps, ref) {
59 const props = useThemeProps({
60 props: inProps,
61 name: 'MuiListItemText'
62 });
63
64 const {
65 children,
66 className,
67 disableTypography = false,
68 inset = false,
69 primary: primaryProp,
70 primaryTypographyProps,
71 secondary: secondaryProp,
72 secondaryTypographyProps
73 } = props,
74 other = _objectWithoutPropertiesLoose(props, _excluded);
75
76 const {
77 dense
78 } = React.useContext(ListContext);
79 let primary = primaryProp != null ? primaryProp : children;
80 let secondary = secondaryProp;
81
82 const ownerState = _extends({}, props, {
83 disableTypography,
84 inset,
85 primary: !!primary,
86 secondary: !!secondary,
87 dense
88 });
89
90 const classes = useUtilityClasses(ownerState);
91
92 if (primary != null && primary.type !== Typography && !disableTypography) {
93 primary = /*#__PURE__*/_jsx(Typography, _extends({
94 variant: dense ? 'body2' : 'body1',
95 className: classes.primary,
96 component: "span",
97 display: "block"
98 }, primaryTypographyProps, {
99 children: primary
100 }));
101 }
102
103 if (secondary != null && secondary.type !== Typography && !disableTypography) {
104 secondary = /*#__PURE__*/_jsx(Typography, _extends({
105 variant: "body2",
106 className: classes.secondary,
107 color: "text.secondary",
108 display: "block"
109 }, secondaryTypographyProps, {
110 children: secondary
111 }));
112 }
113
114 return /*#__PURE__*/_jsxs(ListItemTextRoot, _extends({
115 className: clsx(classes.root, className),
116 ownerState: ownerState,
117 ref: ref
118 }, other, {
119 children: [primary, secondary]
120 }));
121});
122process.env.NODE_ENV !== "production" ? ListItemText.propTypes
123/* remove-proptypes */
124= {
125 // ----------------------------- Warning --------------------------------
126 // | These PropTypes are generated from the TypeScript type definitions |
127 // | To update them edit the d.ts file and run "yarn proptypes" |
128 // ----------------------------------------------------------------------
129
130 /**
131 * Alias for the `primary` prop.
132 */
133 children: PropTypes.node,
134
135 /**
136 * Override or extend the styles applied to the component.
137 */
138 classes: PropTypes.object,
139
140 /**
141 * @ignore
142 */
143 className: PropTypes.string,
144
145 /**
146 * If `true`, the children won't be wrapped by a Typography component.
147 * This can be useful to render an alternative Typography variant by wrapping
148 * the `children` (or `primary`) text, and optional `secondary` text
149 * with the Typography component.
150 * @default false
151 */
152 disableTypography: PropTypes.bool,
153
154 /**
155 * If `true`, the children are indented.
156 * This should be used if there is no left avatar or left icon.
157 * @default false
158 */
159 inset: PropTypes.bool,
160
161 /**
162 * The main content element.
163 */
164 primary: PropTypes.node,
165
166 /**
167 * These props will be forwarded to the primary typography component
168 * (as long as disableTypography is not `true`).
169 */
170 primaryTypographyProps: PropTypes.object,
171
172 /**
173 * The secondary content element.
174 */
175 secondary: PropTypes.node,
176
177 /**
178 * These props will be forwarded to the secondary typography component
179 * (as long as disableTypography is not `true`).
180 */
181 secondaryTypographyProps: PropTypes.object,
182
183 /**
184 * The system prop that allows defining system overrides as well as additional CSS styles.
185 */
186 sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
187} : void 0;
188export default ListItemText;
\No newline at end of file