UNPKG

2.67 kBJavaScriptView Raw
1import _extends from "@babel/runtime/helpers/esm/extends";
2import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3import * as React from 'react';
4import PropTypes from 'prop-types';
5import clsx from 'clsx';
6import withStyles from '../styles/withStyles';
7import ListContext from './ListContext';
8export const styles = {
9 /* Styles applied to the root element. */
10 root: {
11 listStyle: 'none',
12 margin: 0,
13 padding: 0,
14 position: 'relative'
15 },
16
17 /* Styles applied to the root element if `disablePadding={false}`. */
18 padding: {
19 paddingTop: 8,
20 paddingBottom: 8
21 },
22
23 /* Styles applied to the root element if dense. */
24 dense: {},
25
26 /* Styles applied to the root element if a `subheader` is provided. */
27 subheader: {
28 paddingTop: 0
29 }
30};
31const List = /*#__PURE__*/React.forwardRef(function List(props, ref) {
32 const {
33 children,
34 classes,
35 className,
36 component: Component = 'ul',
37 dense = false,
38 disablePadding = false,
39 subheader
40 } = props,
41 other = _objectWithoutPropertiesLoose(props, ["children", "classes", "className", "component", "dense", "disablePadding", "subheader"]);
42
43 const context = React.useMemo(() => ({
44 dense
45 }), [dense]);
46 return /*#__PURE__*/React.createElement(ListContext.Provider, {
47 value: context
48 }, /*#__PURE__*/React.createElement(Component, _extends({
49 className: clsx(classes.root, className, dense && classes.dense, !disablePadding && classes.padding, subheader && classes.subheader),
50 ref: ref
51 }, other), subheader, children));
52});
53process.env.NODE_ENV !== "production" ? List.propTypes = {
54 /**
55 * The content of the component.
56 */
57 children: PropTypes.node,
58
59 /**
60 * Override or extend the styles applied to the component.
61 * See [CSS API](#css) below for more details.
62 */
63 classes: PropTypes.object.isRequired,
64
65 /**
66 * @ignore
67 */
68 className: PropTypes.string,
69
70 /**
71 * The component used for the root node.
72 * Either a string to use a HTML element or a component.
73 */
74 component: PropTypes
75 /* @typescript-to-proptypes-ignore */
76 .elementType,
77
78 /**
79 * If `true`, compact vertical padding designed for keyboard and mouse input will be used for
80 * the list and list items.
81 * The prop is available to descendant components as the `dense` context.
82 */
83 dense: PropTypes.bool,
84
85 /**
86 * If `true`, vertical padding will be removed from the list.
87 */
88 disablePadding: PropTypes.bool,
89
90 /**
91 * The content of the subheader, normally `ListSubheader`.
92 */
93 subheader: PropTypes.node
94} : void 0;
95export default withStyles(styles, {
96 name: 'MuiList'
97})(List);
\No newline at end of file