UNPKG

7.21 kBJavaScriptView Raw
1"use strict";
2
3var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
5var _typeof3 = require("@babel/runtime/helpers/typeof");
6
7Object.defineProperty(exports, "__esModule", {
8 value: true
9});
10exports["default"] = exports.DescriptionsContext = void 0;
11
12var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
13
14var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
15
16var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
17
18var React = _interopRequireWildcard(require("react"));
19
20var _classnames = _interopRequireDefault(require("classnames"));
21
22var _toArray = _interopRequireDefault(require("rc-util/lib/Children/toArray"));
23
24var _responsiveObserve = _interopRequireWildcard(require("../_util/responsiveObserve"));
25
26var _devWarning = _interopRequireDefault(require("../_util/devWarning"));
27
28var _configProvider = require("../config-provider");
29
30var _Row = _interopRequireDefault(require("./Row"));
31
32var _Item = _interopRequireDefault(require("./Item"));
33
34var _reactNode = require("../_util/reactNode");
35
36function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
37
38function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
39
40/* eslint-disable react/no-array-index-key */
41var DescriptionsContext = /*#__PURE__*/React.createContext({});
42exports.DescriptionsContext = DescriptionsContext;
43var DEFAULT_COLUMN_MAP = {
44 xxl: 3,
45 xl: 3,
46 lg: 3,
47 md: 3,
48 sm: 2,
49 xs: 1
50};
51
52function getColumn(column, screens) {
53 if (typeof column === 'number') {
54 return column;
55 }
56
57 if ((0, _typeof2["default"])(column) === 'object') {
58 for (var i = 0; i < _responsiveObserve.responsiveArray.length; i++) {
59 var breakpoint = _responsiveObserve.responsiveArray[i];
60
61 if (screens[breakpoint] && column[breakpoint] !== undefined) {
62 return column[breakpoint] || DEFAULT_COLUMN_MAP[breakpoint];
63 }
64 }
65 }
66
67 return 3;
68}
69
70function getFilledItem(node, span, rowRestCol) {
71 var clone = node;
72
73 if (span === undefined || span > rowRestCol) {
74 clone = (0, _reactNode.cloneElement)(node, {
75 span: rowRestCol
76 });
77 (0, _devWarning["default"])(span === undefined, 'Descriptions', 'Sum of column `span` in a line not match `column` of Descriptions.');
78 }
79
80 return clone;
81}
82
83function getRows(children, column) {
84 var childNodes = (0, _toArray["default"])(children).filter(function (n) {
85 return n;
86 });
87 var rows = [];
88 var tmpRow = [];
89 var rowRestCol = column;
90 childNodes.forEach(function (node, index) {
91 var _a;
92
93 var span = (_a = node.props) === null || _a === void 0 ? void 0 : _a.span;
94 var mergedSpan = span || 1; // Additional handle last one
95
96 if (index === childNodes.length - 1) {
97 tmpRow.push(getFilledItem(node, span, rowRestCol));
98 rows.push(tmpRow);
99 return;
100 }
101
102 if (mergedSpan < rowRestCol) {
103 rowRestCol -= mergedSpan;
104 tmpRow.push(node);
105 } else {
106 tmpRow.push(getFilledItem(node, mergedSpan, rowRestCol));
107 rows.push(tmpRow);
108 rowRestCol = column;
109 tmpRow = [];
110 }
111 });
112 return rows;
113}
114
115function Descriptions(_ref) {
116 var _classNames;
117
118 var customizePrefixCls = _ref.prefixCls,
119 title = _ref.title,
120 extra = _ref.extra,
121 _ref$column = _ref.column,
122 column = _ref$column === void 0 ? DEFAULT_COLUMN_MAP : _ref$column,
123 _ref$colon = _ref.colon,
124 colon = _ref$colon === void 0 ? true : _ref$colon,
125 bordered = _ref.bordered,
126 layout = _ref.layout,
127 children = _ref.children,
128 className = _ref.className,
129 style = _ref.style,
130 size = _ref.size,
131 labelStyle = _ref.labelStyle,
132 contentStyle = _ref.contentStyle;
133
134 var _React$useContext = React.useContext(_configProvider.ConfigContext),
135 getPrefixCls = _React$useContext.getPrefixCls,
136 direction = _React$useContext.direction;
137
138 var prefixCls = getPrefixCls('descriptions', customizePrefixCls);
139
140 var _React$useState = React.useState({}),
141 _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
142 screens = _React$useState2[0],
143 setScreens = _React$useState2[1];
144
145 var mergedColumn = getColumn(column, screens); // Responsive
146
147 React.useEffect(function () {
148 var token = _responsiveObserve["default"].subscribe(function (newScreens) {
149 if ((0, _typeof2["default"])(column) !== 'object') {
150 return;
151 }
152
153 setScreens(newScreens);
154 });
155
156 return function () {
157 _responsiveObserve["default"].unsubscribe(token);
158 };
159 }, []); // Children
160
161 var rows = getRows(children, mergedColumn);
162 return /*#__PURE__*/React.createElement(DescriptionsContext.Provider, {
163 value: {
164 labelStyle: labelStyle,
165 contentStyle: contentStyle
166 }
167 }, /*#__PURE__*/React.createElement("div", {
168 className: (0, _classnames["default"])(prefixCls, (_classNames = {}, (0, _defineProperty2["default"])(_classNames, "".concat(prefixCls, "-").concat(size), size && size !== 'default'), (0, _defineProperty2["default"])(_classNames, "".concat(prefixCls, "-bordered"), !!bordered), (0, _defineProperty2["default"])(_classNames, "".concat(prefixCls, "-rtl"), direction === 'rtl'), _classNames), className),
169 style: style
170 }, (title || extra) && /*#__PURE__*/React.createElement("div", {
171 className: "".concat(prefixCls, "-header")
172 }, title && /*#__PURE__*/React.createElement("div", {
173 className: "".concat(prefixCls, "-title")
174 }, title), extra && /*#__PURE__*/React.createElement("div", {
175 className: "".concat(prefixCls, "-extra")
176 }, extra)), /*#__PURE__*/React.createElement("div", {
177 className: "".concat(prefixCls, "-view")
178 }, /*#__PURE__*/React.createElement("table", null, /*#__PURE__*/React.createElement("tbody", null, rows.map(function (row, index) {
179 return /*#__PURE__*/React.createElement(_Row["default"], {
180 key: index,
181 index: index,
182 colon: colon,
183 prefixCls: prefixCls,
184 vertical: layout === 'vertical',
185 bordered: bordered,
186 row: row
187 });
188 }))))));
189}
190
191Descriptions.Item = _Item["default"];
192var _default = Descriptions;
193exports["default"] = _default;
\No newline at end of file