1 | "use client";
|
2 |
|
3 | var __rest = this && this.__rest || function (s, e) {
|
4 | var t = {};
|
5 | for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
6 | if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
7 | if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
8 | }
|
9 | return t;
|
10 | };
|
11 |
|
12 | import * as React from 'react';
|
13 | import classNames from 'classnames';
|
14 | import { matchScreen } from '../_util/responsiveObserver';
|
15 | import { ConfigContext } from '../config-provider';
|
16 | import useSize from '../config-provider/hooks/useSize';
|
17 | import useBreakpoint from '../grid/hooks/useBreakpoint';
|
18 | import DEFAULT_COLUMN_MAP from './constant';
|
19 | import DescriptionsContext from './DescriptionsContext';
|
20 | import useItems from './hooks/useItems';
|
21 | import useRow from './hooks/useRow';
|
22 | import DescriptionsItem from './Item';
|
23 | import Row from './Row';
|
24 | import useStyle from './style';
|
25 | const Descriptions = props => {
|
26 | const {
|
27 | prefixCls: customizePrefixCls,
|
28 | title,
|
29 | extra,
|
30 | column,
|
31 | colon = true,
|
32 | bordered,
|
33 | layout,
|
34 | children,
|
35 | className,
|
36 | rootClassName,
|
37 | style,
|
38 | size: customizeSize,
|
39 | labelStyle,
|
40 | contentStyle,
|
41 | items
|
42 | } = props,
|
43 | restProps = __rest(props, ["prefixCls", "title", "extra", "column", "colon", "bordered", "layout", "children", "className", "rootClassName", "style", "size", "labelStyle", "contentStyle", "items"]);
|
44 | const {
|
45 | getPrefixCls,
|
46 | direction,
|
47 | descriptions
|
48 | } = React.useContext(ConfigContext);
|
49 | const prefixCls = getPrefixCls('descriptions', customizePrefixCls);
|
50 | const screens = useBreakpoint();
|
51 |
|
52 | const mergedColumn = React.useMemo(() => {
|
53 | var _a;
|
54 | if (typeof column === 'number') {
|
55 | return column;
|
56 | }
|
57 | return (_a = matchScreen(screens, Object.assign(Object.assign({}, DEFAULT_COLUMN_MAP), column))) !== null && _a !== void 0 ? _a : 3;
|
58 | }, [screens, column]);
|
59 |
|
60 | const mergedItems = useItems(screens, items, children);
|
61 | const mergedSize = useSize(customizeSize);
|
62 | const rows = useRow(mergedColumn, mergedItems);
|
63 | const [wrapCSSVar, hashId, cssVarCls] = useStyle(prefixCls);
|
64 |
|
65 | const contextValue = React.useMemo(() => ({
|
66 | labelStyle,
|
67 | contentStyle
|
68 | }), [labelStyle, contentStyle]);
|
69 | return wrapCSSVar( React.createElement(DescriptionsContext.Provider, {
|
70 | value: contextValue
|
71 | }, React.createElement("div", Object.assign({
|
72 | className: classNames(prefixCls, descriptions === null || descriptions === void 0 ? void 0 : descriptions.className, {
|
73 | [`${prefixCls}-${mergedSize}`]: mergedSize && mergedSize !== 'default',
|
74 | [`${prefixCls}-bordered`]: !!bordered,
|
75 | [`${prefixCls}-rtl`]: direction === 'rtl'
|
76 | }, className, rootClassName, hashId, cssVarCls),
|
77 | style: Object.assign(Object.assign({}, descriptions === null || descriptions === void 0 ? void 0 : descriptions.style), style)
|
78 | }, restProps), (title || extra) && ( React.createElement("div", {
|
79 | className: `${prefixCls}-header`
|
80 | }, title && React.createElement("div", {
|
81 | className: `${prefixCls}-title`
|
82 | }, title), extra && React.createElement("div", {
|
83 | className: `${prefixCls}-extra`
|
84 | }, extra))), React.createElement("div", {
|
85 | className: `${prefixCls}-view`
|
86 | }, React.createElement("table", null, React.createElement("tbody", null, rows.map((row, index) => ( React.createElement(Row, {
|
87 | key: index,
|
88 | index: index,
|
89 | colon: colon,
|
90 | prefixCls: prefixCls,
|
91 | vertical: layout === 'vertical',
|
92 | bordered: bordered,
|
93 | row: row
|
94 | })))))))));
|
95 | };
|
96 | if (process.env.NODE_ENV !== 'production') {
|
97 | Descriptions.displayName = 'Descriptions';
|
98 | }
|
99 | export { DescriptionsContext };
|
100 | Descriptions.Item = DescriptionsItem;
|
101 | export default Descriptions; |
\ | No newline at end of file |