@canlooks/can-ui 0.0.24 → 0.0.26

package/dist/cjs/components/dataGrid/dataGridHead.js

@@ -4,90 +4,96 @@ exports.DataGridHead = void 0;
 const react_1 = require("@emotion/react");
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const react_2 = require("react");
-const dataGrid_1 = require("./dataGrid");
-const icons_1 = require("@ant-design/icons");
 const dataGrid_style_1 = require("./dataGrid.style");
-const tooltip_1 = require("../tooltip");
+const dataGrid_1 = require("./dataGrid");
+const columnResize_1 = require("./columnResize");
 const checkbox_1 = require("../checkbox");
-const selectionContext_1 = require("../selectionContext");
 const utils_1 = require("../../utils");
-exports.DataGridHead = (0, react_2.memo)(({ columns, orderColumn, orderType, onOrderChange, allowSelectAll, multiple, primaryKey, rows, }) => {
-    const { value, setValue, selectionStatus } = (0, selectionContext_1.useSelectionContext)();
+const __1 = require("../..");
+const selectionContext_1 = require("../selectionContext");
+const tooltip_1 = require("../tooltip");
+const faCaretDown_1 = require("@fortawesome/free-solid-svg-icons/faCaretDown");
+exports.DataGridHead = (0, react_2.memo)(({ flattedColumns, completedColumns, rows, primaryKey, orderColumn, orderType, onOrderChange, allowSelectAll, columnResizable }) => {
+    const { multiple, setValue, selectionStatus } = (0, selectionContext_1.useSelectionContext)();
     const allSelectionStatus = (0, react_2.useMemo)(() => {
         if (multiple && allowSelectAll) {
             const sum = rows?.reduce((prev, row) => {
-                const status = selectionStatus?.get(row[primaryKey]) || 0;
+                const status = selectionStatus.get(row[primaryKey]) || 0;
                 return prev + status;
             }, 0) || 0;
             return sum === 0 ? 0 : sum < rows.length * 2 ? 1 : 2;
         }
         return 0;
-    }, [value, multiple, allowSelectAll]);
-    const checkboxChangeHandler = (e) => {
-        setValue(e.target.checked
-            ? rows?.flatMap(r => {
-                return r[primaryKey] ?? [];
-            }) || []
-            : []);
+    }, [selectionStatus, multiple, allowSelectAll]);
+    const selectAllChangeHandler = (e) => {
+        e.target.checked
+            ? setValue(rows?.flatMap(r => r[primaryKey] ?? []) || [])
+            : setValue([]);
     };
-    const renderHead = () => {
-        if (!columns) {
+    const renderedHead = (0, columnResize_1.useRenderHead)(Column => {
+        const columnDefinitions = columnResizable ? flattedColumns : completedColumns;
+        if (!columnDefinitions) {
             return;
         }
-        let allRows = 1;
-        const headRows = [];
-        const fn = (arr, parents = []) => {
-            let colSpan = 0;
-            arr?.forEach(col => {
-                if (typeof col !== 'symbol') {
-                    col._colSpan = fn(col.children, [...parents, col]) || 1;
-                    colSpan += col._colSpan;
-                    if (col.children?.length) {
-                        col['data-grouped'] = 'true';
-                        col.rowSpan = 1;
-                    }
-                    else {
-                        col._negativeRowSpan = col.children?.length ? 1 : parents.length;
-                    }
-                    if (parents.length + 1 > allRows) {
-                        allRows = parents.length + 1;
+        let headRows = [];
+        if (columnResizable) {
+            headRows = [columnDefinitions];
+        }
+        else {
+            // 处理表头分组情况
+            const fn = (cols, depth = 0) => {
+                let colSpan = 0;
+                cols?.forEach(col => {
+                    if (typeof col !== 'symbol') {
+                        if (col.children?.length) {
+                            col.colSpan = fn(col.children, depth + 1);
+                            colSpan += col.colSpan;
+                            col.rowSpan = 1;
+                            col['data-grouped'] = 'true';
+                        }
+                        else {
+                            col._negativeRowSpan = depth;
+                            colSpan++;
+                        }
                     }
-                }
-                headRows[parents.length] ||= [];
-                headRows[parents.length].push(col);
-            });
-            return colSpan;
-        };
-        fn(columns);
+                    headRows[depth] ||= [];
+                    headRows[depth].push(col);
+                });
+                return colSpan;
+            };
+            fn(columnDefinitions);
+        }
         return headRows.map((cols, i) => (0, jsx_runtime_1.jsx)("tr", { children: cols.flatMap((col, j) => {
                 if (typeof col === 'symbol') {
-                    return col === dataGrid_1.DataGrid.EXPAND_COLUMN
-                        ? []
-                        : (0, jsx_runtime_1.jsx)("th", { className: dataGrid_style_1.classes.selectable, children: multiple && allowSelectAll &&
-                                (0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { checked: allSelectionStatus === 2, indeterminate: allSelectionStatus === 1, onChange: checkboxChangeHandler }) }, j + '_selectable');
+                    if (col === dataGrid_1.DataGrid.EXPAND_COLUMN) {
+                        return [];
+                    }
+                    // col === DataGrid.SELECT_COLUMN
+                    return ((0, jsx_runtime_1.jsx)(Column, { className: dataGrid_style_1.classes.selectable, rowSpan: headRows.length, sticky: j === 0 ? 'left' : void 0, children: multiple && allowSelectAll &&
+                            (0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { checked: allSelectionStatus === 2, indeterminate: allSelectionStatus === 1, onChange: selectAllChangeHandler }) }, j + '_selectable'));
                 }
                 const { 
                 // 排除无需加入dom节点的属性
-                title, _key, key, field, render, sorter, sticky, _colSpan, _negativeRowSpan, ...colProps } = col;
+                title, key, children, sticky, field, render, sorter, _key, _negativeRowSpan = 0, ...colProps } = col;
+                const sortable = sorter && children?.length;
                 const isOrderingColumn = orderColumn === _key;
                 const currentOrderType = isOrderingColumn ? orderType : 'descend';
-                const renderedTh = ((0, react_1.createElement)("th", { colSpan: _colSpan, rowSpan: allRows - (_negativeRowSpan || 0), ...colProps, key: _key ?? j, "data-sortable": !!sorter, "data-ordering": isOrderingColumn, "data-order-type": currentOrderType, "data-sticky": typeof sticky !== 'undefined', style: {
-                        ...typeof sticky === 'number' && { left: sticky },
-                        ...colProps.style
-                    }, onClick: e => {
+                const renderedTh = ((0, react_1.createElement)(Column, { rowSpan: headRows.length - _negativeRowSpan, ...colProps, key: _key, sticky: sticky, "data-sortable": !!sortable, "data-ordering": isOrderingColumn, "data-order-type": currentOrderType, onClick: e => {
                         colProps.onClick?.(e);
-                        sorter && !(0, utils_1.isUnset)(_key) && onOrderChange?.(_key, currentOrderType === 'descend' ? 'ascend' : 'descend');
+                        if (sortable && !(0, utils_1.isUnset)(_key)) {
+                            onOrderChange?.(_key, currentOrderType === 'descend' ? 'ascend' : 'descend');
+                        }
                     } }, sorter
-                    ? (0, jsx_runtime_1.jsxs)("div", { className: dataGrid_style_1.classes.sorter, children: [(0, jsx_runtime_1.jsx)("div", { className: dataGrid_style_1.classes.title, children: title }), (0, jsx_runtime_1.jsx)(icons_1.CaretDownFilled, { className: dataGrid_style_1.classes.icon })] })
+                    ? (0, jsx_runtime_1.jsxs)("div", { className: dataGrid_style_1.classes.sorter, children: [(0, jsx_runtime_1.jsx)("div", { className: dataGrid_style_1.classes.title, children: title }), (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCaretDown_1.faCaretDown, className: dataGrid_style_1.classes.icon })] })
                     : title));
                 return [
-                    sorter
+                    sortable
                         ? (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: currentOrderType === 'descend'
                                 ? '点击升序'
                                 : '点击降序', children: renderedTh }, _key)
                         : renderedTh
                 ];
             }) }, i));
-    };
-    return ((0, jsx_runtime_1.jsx)("thead", { children: renderHead() }));
+    });
+    return (0, jsx_runtime_1.jsx)("thead", { children: renderedHead });
 });

package/dist/cjs/components/dataGrid/dataGridRows.d.ts

@@ -1,9 +1,9 @@
-import { ReactElement } from 'react';
-import { DataGridProps } from './dataGrid';
-import { Id, Obj } from '../../types';
-interface DataGridRowsProps<R extends Obj, V extends Id = Id> extends Pick<DataGridProps<R, V>, 'rows'> {
+import { Id } from '../../types';
+import { DataGridProps, RowType } from './dataGrid';
+type DataGridRowsProps<R extends RowType, V extends Id = Id> = {
+    rows: DataGridProps<R, V>['rows'] | undefined;
     /** @private 内部使用，用于缩进子行 */
     _level?: number;
-}
-export declare const DataGridRows: <R extends Obj, V extends Id = Id>(props: DataGridRowsProps<R, V>) => ReactElement;
+};
+export declare const DataGridRows: import("react").MemoExoticComponent<(<R extends RowType, V extends Id = Id>({ rows, _level }: DataGridRowsProps<R, V>) => import("@emotion/react/jsx-runtime").JSX.Element[] | undefined)>;
 export {};

package/dist/cjs/components/dataGrid/dataGridRows.js

@@ -5,27 +5,33 @@ const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const react_1 = require("@emotion/react");
 const react_2 = require("react");
 const dataGrid_1 = require("./dataGrid");
+const selectionContext_1 = require("../selectionContext");
 const utils_1 = require("../../utils");
-const dataGrid_style_1 = require("./dataGrid.style");
-const icons_1 = require("@ant-design/icons");
-const button_1 = require("../button");
-const transitionBase_1 = require("../transitionBase");
 const checkbox_1 = require("../checkbox");
 const radio_1 = require("../radio");
-const selectionContext_1 = require("../selectionContext");
+const table_1 = require("../table");
+const button_1 = require("../button");
+const transitionBase_1 = require("../transitionBase");
+const __1 = require("../..");
+const faMinusSquare_1 = require("@fortawesome/free-regular-svg-icons/faMinusSquare");
+const faPlusSquare_1 = require("@fortawesome/free-regular-svg-icons/faPlusSquare");
+const dataGrid_style_1 = require("./dataGrid.style");
 exports.DataGridRows = (0, react_2.memo)(({ rows, _level = 0 }) => {
-    const { primaryKey, childrenKey, flattedColumns, rowProps, clickRowToSelect, indent, expandedSet, toggleExpanded, renderExpandIcon, multiple } = (0, dataGrid_1.useDataGridContext)();
-    const { toggleSelected, selectionStatus } = (0, selectionContext_1.useSelectionContext)();
+    const { multiple, toggleSelected, selectionStatus } = (0, selectionContext_1.useSelectionContext)();
+    const { rowProps, primaryKey, childrenKey, clickRowToSelect, indent, renderExpandIcon, expandedSet, flattedColumns, toggleExpanded } = (0, dataGrid_1.useDataGridContext)();
     return rows?.flatMap((row, i, arr) => {
         const trKey = row[primaryKey];
+        if ((0, utils_1.isUnset)(trKey)) {
+            console.warn(`[@canlooks/can-ui/<DataGrid/>] primaryKey not found in row "${i}"`);
+        }
         const _rowProps = rowProps?.(row, i, arr);
         const status = selectionStatus?.get(trKey);
-        const children = childrenKey && row[childrenKey];
-        const expandable = !(0, utils_1.isUnset)(children) && children !== false;
+        const children = childrenKey !== null ? row[childrenKey] : void 0;
+        const expandable = !(0, utils_1.isUnset)(children) && typeof children !== 'boolean';
         const currentExpanded = expandable && expandedSet.has(trKey);
         let expandableIndex = -2;
         const ret = [
-            (0, react_1.createElement)("tr", { ..._rowProps, key: trKey, className: (0, utils_1.classnames)(_rowProps, _level > 0 && dataGrid_style_1.classes.sub), onClick: e => {
+            (0, react_1.createElement)("tr", { ..._rowProps, key: trKey, className: (0, utils_1.clsx)(_rowProps, _level > 0 && dataGrid_style_1.classes.sub), onClick: e => {
                     _rowProps?.onClick?.(e);
                     clickRowToSelect && toggleSelected(trKey, row);
                 }, "data-selected": status === 2 }, flattedColumns?.flatMap((col, j) => {
@@ -40,19 +46,21 @@ exports.DataGridRows = (0, react_2.memo)(({ rows, _level = 0 }) => {
                         expandableIndex = j;
                     }
                     const Component = multiple ? checkbox_1.Checkbox : radio_1.Radio;
-                    return ((0, jsx_runtime_1.jsx)("td", { className: dataGrid_style_1.classes.selectable, children: (0, jsx_runtime_1.jsx)(Component, { checked: status === 2, indeterminate: status === 1, onChange: () => toggleSelected(trKey, row), onClick: e => e.stopPropagation() }) }, j + '_selectable'));
+                    return ((0, jsx_runtime_1.jsx)(table_1.TdCell, { className: dataGrid_style_1.classes.selectable, sticky: j === 0 ? 'left' : void 0, children: (0, jsx_runtime_1.jsx)(Component, { checked: status === 2, indeterminate: status === 1, onChange: () => toggleSelected(trKey, row), onClick: e => e.stopPropagation() }) }, j + '_selectable'));
                 }
                 const { 
                 // 排除无需加入dom节点的属性
-                title, _key, key, field, render, sorter, sticky, _colSpan, _negativeRowSpan, ..._colProps } = col;
+                // width属性只需加入thead列中，普通列需排除
+                // rowSpan与colSpan需排除
+                title, key, children, sticky, field, render, sorter, width, _key, _negativeRowSpan, rowSpan, colSpan, ..._colProps } = col;
                 const renderedContent = (0, utils_1.renderCell)({ render, field }, row, i, arr);
                 const shouldRenderExpand = expandableIndex === j - 1;
-                return ((0, react_1.createElement)("td", { ..._colProps, key: _key ?? j, className: shouldRenderExpand ? dataGrid_style_1.classes.expandable : void 0, "data-sticky": typeof sticky !== 'undefined', style: typeof sticky === 'number' ? { left: sticky } : void 0 }, shouldRenderExpand
-                    ? (0, jsx_runtime_1.jsxs)("div", { className: dataGrid_style_1.classes.expandableWrap, style: { paddingLeft: _level * indent }, children: [(0, jsx_runtime_1.jsx)(button_1.Button, { variant: "text", shape: "circular", color: "disabled", onClick: () => toggleExpanded?.(trKey), style: expandable ? void 0 : { visibility: 'hidden' }, children: renderExpandIcon
+                return ((0, react_1.createElement)(table_1.TdCell, { ..._colProps, key: _key, className: shouldRenderExpand ? dataGrid_style_1.classes.expandable : void 0, sticky: sticky }, shouldRenderExpand
+                    ? (0, jsx_runtime_1.jsxs)("div", { className: dataGrid_style_1.classes.expandableWrap, style: { paddingLeft: _level * indent }, children: [(0, jsx_runtime_1.jsx)(button_1.Button, { variant: "text", shape: "circular", color: "text.disabled", onClick: () => toggleExpanded(trKey), style: expandable ? void 0 : { visibility: 'hidden' }, children: renderExpandIcon
                                     ? renderExpandIcon(trKey, currentExpanded, [...expandedSet])
                                     : currentExpanded
-                                        ? (0, jsx_runtime_1.jsx)(icons_1.MinusSquareOutlined, {})
-                                        : (0, jsx_runtime_1.jsx)(icons_1.PlusSquareOutlined, {}) }), renderedContent] })
+                                        ? (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faMinusSquare_1.faMinusSquare })
+                                        : (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faPlusSquare_1.faPlusSquare }) }), renderedContent] })
                     : renderedContent));
             }))
         ];

package/dist/cjs/components/dateTimePicker/calendar.d.ts

@@ -1,4 +1,4 @@
-import { DIVProps } from '../../types';
+import { DivProps } from '../../types';
 import { Dayjs } from 'dayjs';
 import { Dispatch, SetStateAction } from 'react';
 type SharedCalendarProps = {
@@ -6,7 +6,7 @@ type SharedCalendarProps = {
     value: Dayjs;
     onChange(value: Dayjs): void;
 };
-export interface CalendarProps extends SharedCalendarProps, Omit<DIVProps, 'onChange'> {
+export interface CalendarProps extends SharedCalendarProps, Omit<DivProps, 'onChange'> {
     type: 'dates' | 'months' | 'years';
 }
 export interface CommonCalendarProps extends SharedCalendarProps {

package/dist/cjs/components/dateTimePicker/calendarDates.js

@@ -6,11 +6,15 @@ const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const react_1 = require("react");
 const calendar_style_1 = require("./calendar.style");
 const button_1 = require("../button");
-const icons_1 = require("@ant-design/icons");
 const tooltip_1 = require("../tooltip");
 const dayjs_1 = tslib_1.__importDefault(require("dayjs"));
 const calendar_style_2 = require("./calendar.style");
 const dateTimePicker_1 = require("./dateTimePicker");
+const __1 = require("../..");
+const faAnglesLeft_1 = require("@fortawesome/free-solid-svg-icons/faAnglesLeft");
+const faAngleLeft_1 = require("@fortawesome/free-solid-svg-icons/faAngleLeft");
+const faAngleRight_1 = require("@fortawesome/free-solid-svg-icons/faAngleRight");
+const faAnglesRight_1 = require("@fortawesome/free-solid-svg-icons/faAnglesRight");
 const days = ['一', '二', '三', '四', '五', '六', '日'];
 const renderedDaysList = (() => {
     const ret = [];
@@ -74,5 +78,5 @@ exports.CalendarDates = (0, react_1.memo)(({ defaultNull, value, onChange, inner
         }
         return ret;
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { css: calendar_style_2.style, className: calendar_style_1.classes.root, children: [(0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.calendarHead, children: [(0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.calendarHeadSide, children: [renderHeadControl((0, jsx_runtime_1.jsx)(icons_1.DoubleLeftOutlined, {}), '上一年', prevYear), renderHeadControl((0, jsx_runtime_1.jsx)(icons_1.LeftOutlined, {}), '上一月', prevMonth)] }), (0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.calendarHeadSide, children: [renderHeadControl((0, jsx_runtime_1.jsx)(icons_1.RightOutlined, {}), '下一月', nextMonth), renderHeadControl((0, jsx_runtime_1.jsx)(icons_1.DoubleRightOutlined, {}), '下一年', nextYear)] }), (0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.calendarHeadCenter, children: [(0, jsx_runtime_1.jsxs)(button_1.Button, { ...commonButtonProps, className: calendar_style_1.classes.calendarHeadButton, onClick: () => setViewType('years'), children: [innerD.year(), "\u5E74"] }), (0, jsx_runtime_1.jsxs)(button_1.Button, { ...commonButtonProps, className: calendar_style_1.classes.calendarHeadButton, onClick: () => setViewType('months'), children: [(innerD.month() + 1).toString().padStart(2, '0'), "\u6708"] })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.calendarBody, "data-view-type": "dates", children: [renderedDaysList, renderDates()] }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.calendarFoot, children: (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "text", onClick: () => onChange((0, dayjs_1.default)()), children: "\u56DE\u4ECA\u5929" }) })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { css: calendar_style_2.style, className: calendar_style_1.classes.root, children: [(0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.calendarHead, children: [(0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.calendarHeadSide, children: [renderHeadControl((0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAnglesLeft_1.faAnglesLeft }), '上一年', prevYear), renderHeadControl((0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAngleLeft_1.faAngleLeft }), '上一月', prevMonth)] }), (0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.calendarHeadSide, children: [renderHeadControl((0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAngleRight_1.faAngleRight }), '下一月', nextMonth), renderHeadControl((0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAnglesRight_1.faAnglesRight }), '下一年', nextYear)] }), (0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.calendarHeadCenter, children: [(0, jsx_runtime_1.jsxs)(button_1.Button, { ...commonButtonProps, className: calendar_style_1.classes.calendarHeadButton, onClick: () => setViewType('years'), children: [innerD.year(), "\u5E74"] }), (0, jsx_runtime_1.jsxs)(button_1.Button, { ...commonButtonProps, className: calendar_style_1.classes.calendarHeadButton, onClick: () => setViewType('months'), children: [(innerD.month() + 1).toString().padStart(2, '0'), "\u6708"] })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.calendarBody, "data-view-type": "dates", children: [renderedDaysList, renderDates()] }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.calendarFoot, children: (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "text", onClick: () => onChange((0, dayjs_1.default)()), children: "\u56DE\u4ECA\u5929" }) })] }));
 });

package/dist/cjs/components/dateTimePicker/calendarYears.js

@@ -6,7 +6,9 @@ const react_1 = require("react");
 const calendar_style_1 = require("./calendar.style");
 const button_1 = require("../button");
 const tooltip_1 = require("../tooltip");
-const icons_1 = require("@ant-design/icons");
+const __1 = require("../..");
+const faAngleLeft_1 = require("@fortawesome/free-solid-svg-icons/faAngleLeft");
+const faAngleRight_1 = require("@fortawesome/free-solid-svg-icons/faAngleRight");
 exports.CalendarYears = (0, react_1.memo)(({ innerD, setInnerD, setViewType }) => {
     const currentYear = innerD.year();
     const clickHandler = (year) => {
@@ -23,5 +25,5 @@ exports.CalendarYears = (0, react_1.memo)(({ innerD, setInnerD, setViewType }) =
         }
         return ret;
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { css: calendar_style_1.style, className: calendar_style_1.classes.root, children: [(0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.calendarHead, children: [(0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.calendarHeadSide, children: renderHeadControl((0, jsx_runtime_1.jsx)(icons_1.LeftOutlined, {}), '上一页', () => setPage(p => p - 1)) }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.calendarHeadSide, children: renderHeadControl((0, jsx_runtime_1.jsx)(icons_1.RightOutlined, {}), '下一页', () => setPage(p => p + 1)) }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.calendarHeadCenter, children: "\u5E74\u4EFD" })] }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.calendarBody, "data-view-type": "months", children: renderButtons() })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { css: calendar_style_1.style, className: calendar_style_1.classes.root, children: [(0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.calendarHead, children: [(0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.calendarHeadSide, children: renderHeadControl((0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAngleLeft_1.faAngleLeft }), '上一页', () => setPage(p => p - 1)) }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.calendarHeadSide, children: renderHeadControl((0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAngleRight_1.faAngleRight }), '下一页', () => setPage(p => p + 1)) }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.calendarHeadCenter, children: "\u5E74\u4EFD" })] }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.calendarBody, "data-view-type": "months", children: renderButtons() })] }));
 });

package/dist/cjs/components/dateTimePicker/dateTimePicker.d.ts

@@ -1,5 +1,5 @@
-import React, { Ref } from 'react';
-import { PopperProps, PopperRef } from '../popper';
+import React, { JSX } from 'react';
+import { PopperProps } from '../popper';
 import { InputBaseProps } from '../inputBase';
 import { Dayjs } from 'dayjs';
 export type DatePickerSharedProps = {
@@ -11,10 +11,8 @@ export type DatePickerSharedProps = {
     disabledSeconds?: (date: Dayjs, seconds: number) => any;
 };
 export interface DateTimePickerProps extends DatePickerSharedProps, Omit<InputBaseProps<'input'>, 'children' | 'value' | 'defaultValue' | 'onChange' | 'min' | 'max'> {
-    inputProps?: React.JSX.IntrinsicElements['input'];
-    inputRef?: Ref<HTMLInputElement>;
+    inputProps?: JSX.IntrinsicElements['input'];
     popperProps?: PopperProps;
-    popperRef?: Ref<PopperRef>;
     defaultOpen?: boolean;
     open?: boolean;
     onOpenChange?(open: boolean): void;
@@ -25,4 +23,4 @@ export interface DateTimePickerProps extends DatePickerSharedProps, Omit<InputBa
     onChange?(value: Dayjs | null): void;
 }
 export declare function useDateTimePickerContext(): DatePickerSharedProps;
-export declare const DateTimePicker: React.MemoExoticComponent<({ inputProps, inputRef, popperProps, popperRef, min, max, disabledDates, disabledHours, disabledMinutes, disabledSeconds, format, defaultValue, value, onChange, defaultOpen, open, onOpenChange, autoClose, ...props }: DateTimePickerProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
+export declare const DateTimePicker: React.MemoExoticComponent<({ inputProps, popperProps, min, max, disabledDates, disabledHours, disabledMinutes, disabledSeconds, format, defaultValue, value, onChange, defaultOpen, open, onOpenChange, autoClose, ...props }: DateTimePickerProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

package/dist/cjs/components/dateTimePicker/dateTimePicker.js

@@ -11,16 +11,18 @@ const utils_1 = require("../../utils");
 const dateTimePicker_style_1 = require("./dateTimePicker.style");
 const dayjs_1 = tslib_1.__importDefault(require("dayjs"));
 const customParseFormat_1 = tslib_1.__importDefault(require("dayjs/plugin/customParseFormat"));
-const icons_1 = require("@ant-design/icons");
 const calendar_1 = require("./calendar");
 const timer_1 = require("./timer");
+const __1 = require("../..");
+const faCalendar_1 = require("@fortawesome/free-regular-svg-icons/faCalendar");
+const faClock_1 = require("@fortawesome/free-regular-svg-icons/faClock");
 dayjs_1.default.extend(customParseFormat_1.default);
 const availableFormatTokens = ['Y', 'M', 'D', 'H', 'm', 's'];
 const DateTimePickerContext = (0, react_1.createContext)({});
 function useDateTimePickerContext() {
     return (0, react_1.useContext)(DateTimePickerContext);
 }
-exports.DateTimePicker = (0, react_1.memo)(({ inputProps, inputRef, popperProps, popperRef, min, max, disabledDates, disabledHours, disabledMinutes, disabledSeconds, format = 'YYYY-MM-DD', defaultValue = null, value, onChange, defaultOpen = false, open, onOpenChange, autoClose = !/[Hms]/.test(format), ...props }) => {
+exports.DateTimePicker = (0, react_1.memo)(({ inputProps, popperProps, min, max, disabledDates, disabledHours, disabledMinutes, disabledSeconds, format = 'YYYY-MM-DD', defaultValue = null, value, onChange, defaultOpen = false, open, onOpenChange, autoClose = !/[Hms]/.test(format), ...props }) => {
     const innerInputRef = (0, react_1.useRef)(null);
     const focused = (0, react_1.useRef)(false);
     const [innerOpen, _setInnerOpen] = (0, utils_1.useControlled)(defaultOpen, open, onOpenChange);
@@ -32,7 +34,7 @@ exports.DateTimePicker = (0, react_1.memo)(({ inputProps, inputRef, popperProps,
     (0, react_1.useEffect)(() => {
         if (!innerOpen.current && !dateValue.current) {
             // 弹框关闭时没有选中日期，清空输入框
-            innerInputRef.current.value = '';
+            innerInputRef.current.value = format;
         }
     }, [innerOpen.current]);
     const [dateValue, _setDateValue] = (0, utils_1.useControlled)(defaultValue, value, onChange);
@@ -45,7 +47,7 @@ exports.DateTimePicker = (0, react_1.memo)(({ inputProps, inputRef, popperProps,
     }, [dateValue.current]);
     const clearHandler = () => {
         setDateValue(null);
-        selectFn(innerInputRef.current);
+        selectFn();
     };
     const ranges = (0, react_1.useMemo)(() => {
         const range = [];
@@ -62,7 +64,8 @@ exports.DateTimePicker = (0, react_1.memo)(({ inputProps, inputRef, popperProps,
         return range;
     }, [format]);
     const currentRange = (0, react_1.useRef)(null);
-    const selectFn = (input) => {
+    const selectFn = () => {
+        const input = innerInputRef.current;
         const { selectionStart } = input;
         const range = ranges.find(({ end }) => (selectionStart || 0) <= end) || ranges[ranges.length - 1];
         if (range) {
@@ -76,16 +79,13 @@ exports.DateTimePicker = (0, react_1.memo)(({ inputProps, inputRef, popperProps,
             // setSelectionRange()方法也会触发该回调，通过nativeEvent.type排除
             return;
         }
-        selectFn(e.target);
+        selectFn();
     };
     const focusHandler = (e) => {
         focused.current = true;
-        selectFn(e.target);
+        selectFn();
     };
     const blurHandler = (e) => {
-        if (!dateValue.current && !innerOpen.current) {
-            e.target.value = '';
-        }
         resetContinue();
         focused.current = false;
         _setInnerOpen(false);
@@ -221,10 +221,10 @@ exports.DateTimePicker = (0, react_1.memo)(({ inputProps, inputRef, popperProps,
                             : format.includes('M') ? 'months'
                                 : format.includes('Y') ? 'years'
                                     : 'dates', defaultNull: !dateValue.current, value: _dateVal, onChange: setDateValue }), showTimer &&
-                    (0, jsx_runtime_1.jsx)(timer_1.Timer, { showHours: format.includes('H'), showMinutes: format.includes('m'), showSeconds: format.includes('s'), value: _dateVal, onChange: setDateValue })] }), ...popperProps, popperRef: popperRef, onOpenChange: setInnerOpen, onPointerDown: e => {
+                    (0, jsx_runtime_1.jsx)(timer_1.Timer, { showHours: format.includes('H'), showMinutes: format.includes('m'), showSeconds: format.includes('s'), value: _dateVal, onChange: setDateValue })] }), ...popperProps, onOpenChange: setInnerOpen, onPointerDown: e => {
             popperProps?.onPointerDown?.(e);
             e.preventDefault();
-        }, children: (0, jsx_runtime_1.jsx)(inputBase_1.InputBase, { ...props, css: dateTimePicker_style_1.style, className: (0, utils_1.classnames)(dateTimePicker_style_1.classes.root, props.className), "data-focused": innerOpen.current, value: dateValue.current, onClear: clearHandler, onSelect: selectHandler, onFocus: focusHandler, onBlur: blurHandler, onKeyDown: keydownHandler, children: ({ ref, value, onChange, ...rest }) => (0, jsx_runtime_1.jsxs)("div", { className: dateTimePicker_style_1.classes.container, children: [(0, jsx_runtime_1.jsx)("input", { ...rest, ...inputProps, ref: (0, utils_1.cloneRef)(ref, inputRef, innerInputRef), className: (0, utils_1.classnames)(dateTimePicker_style_1.classes.input, inputProps?.className) }), (0, jsx_runtime_1.jsx)("div", { className: dateTimePicker_style_1.classes.dateTimeIcon, children: showTimer && !showCalendar
-                            ? (0, jsx_runtime_1.jsx)(icons_1.ClockCircleOutlined, {})
-                            : (0, jsx_runtime_1.jsx)(icons_1.CalendarOutlined, {}) })] }) }) }));
+        }, children: (0, jsx_runtime_1.jsx)(inputBase_1.InputBase, { ...props, css: dateTimePicker_style_1.style, className: (0, utils_1.clsx)(dateTimePicker_style_1.classes.root, props.className), "data-focused": innerOpen.current, value: dateValue.current, onClear: clearHandler, onSelect: selectHandler, onFocus: focusHandler, onBlur: blurHandler, onKeyDown: keydownHandler, children: ({ ref, value, onChange, ...rest }) => (0, jsx_runtime_1.jsxs)("div", { className: dateTimePicker_style_1.classes.container, children: [(0, jsx_runtime_1.jsx)("input", { ...rest, ...inputProps, ref: (0, utils_1.cloneRef)(ref, inputProps?.ref, innerInputRef), className: (0, utils_1.clsx)(dateTimePicker_style_1.classes.input, inputProps?.className) }), (0, jsx_runtime_1.jsx)("div", { className: dateTimePicker_style_1.classes.dateTimeIcon, children: showTimer && !showCalendar
+                            ? (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faClock_1.faClock })
+                            : (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCalendar_1.faCalendar }) })] }) }) }));
 });

package/dist/cjs/components/dateTimePicker/dateTimePicker.style.d.ts

@@ -1,6 +1,7 @@
 export declare const classes: {
     input: string;
     container: string;
+    calendar: string;
     calendarHead: string;
     calendarHeadSide: string;
     calendarHeadControl: string;
@@ -8,7 +9,6 @@ export declare const classes: {
     calendarHeadButton: string;
     calendarBody: string;
     dateItem: string;
-    calendar: string;
     inputGroup: string;
     inputUnit: string;
     dateTimeIcon: string;

package/dist/cjs/components/dateTimePicker/timer.js

@@ -39,7 +39,8 @@ function TimerItem({ type, value, onChange }) {
         }
         return false;
     };
-    const selectedItemRef = (0, popper_1.useScrollToSelected)();
+    const scrollerRef = (0, react_1.useRef)(null);
+    const selectedItemRef = (0, popper_1.useScrollToSelected)(scrollerRef);
     const renderItems = (count) => {
         const ret = [];
         for (let i = 0; i < count; i++) {
@@ -49,5 +50,5 @@ function TimerItem({ type, value, onChange }) {
     };
     return ((0, jsx_runtime_1.jsxs)("div", { className: timer_style_1.classes.selectItem, children: [(0, jsx_runtime_1.jsx)("div", { className: timer_style_1.classes.selectItemTitle, children: type === 'hour' ? '时'
                     : type === 'minute' ? '分'
-                        : '秒' }), (0, jsx_runtime_1.jsx)("div", { className: timer_style_1.classes.selectItemBody, children: renderItems(type === 'hour' ? 24 : 60) })] }));
+                        : '秒' }), (0, jsx_runtime_1.jsx)("div", { ref: scrollerRef, className: timer_style_1.classes.selectItemBody, children: renderItems(type === 'hour' ? 24 : 60) })] }));
 }

package/dist/cjs/components/dateTimeRangePicker/dateTimeRangePicker.d.ts

@@ -1,9 +1,9 @@
 import { ReactNode } from 'react';
-import { ColorPropsValue, DIVProps, Size } from '../../types';
+import { ColorPropsValue, DivProps, Size } from '../../types';
 import { DatePickerSharedProps, DateTimePickerProps } from '../dateTimePicker';
 import { Dayjs } from 'dayjs';
 type DateValueType = [Dayjs | null, Dayjs | null] | null;
-export interface DateTimeRangePickerProps extends DatePickerSharedProps, Omit<DIVProps, 'defaultValue' | 'onChange'> {
+export interface DateTimeRangePickerProps extends DatePickerSharedProps, Omit<DivProps, 'defaultValue' | 'onChange'> {
     startPickerProps?: DateTimePickerProps;
     endPickerProps?: DateTimePickerProps;
     format?: string;

package/dist/cjs/components/dateTimeRangePicker/dateTimeRangePicker.js

@@ -17,7 +17,7 @@ variant, size, color, disabled, readOnly, autoFocus, ...props }) => {
         variant, size, color, disabled, readOnly
     };
     const showTimer = /[Hms]/.test(format);
-    return ((0, jsx_runtime_1.jsxs)("div", { ...props, css: dateTimeRangePicker_style_1.style, className: (0, utils_1.classnames)(dateTimeRangePicker_style_1.classes.root, props.className), children: [(0, jsx_runtime_1.jsx)(dateTimePicker_1.DateTimePicker, { ...commonProps, autoFocus: autoFocus, autoClose: false, placeholder: showTimer ? '开始时间' : '开始日期', max: innerValue.current?.[1] || void 0, open: innerOpen.current === 'start', ...startPickerProps, onOpenChange: open => {
+    return ((0, jsx_runtime_1.jsxs)("div", { ...props, css: dateTimeRangePicker_style_1.style, className: (0, utils_1.clsx)(dateTimeRangePicker_style_1.classes.root, props.className), children: [(0, jsx_runtime_1.jsx)(dateTimePicker_1.DateTimePicker, { ...commonProps, autoFocus: autoFocus, autoClose: false, placeholder: showTimer ? '开始时间' : '开始日期', max: innerValue.current?.[1] || void 0, open: innerOpen.current === 'start', ...startPickerProps, onOpenChange: open => {
                     startPickerProps?.onOpenChange?.(open);
                     setInnerOpen(open ? 'start' : 'closed');
                 }, onChange: startValue => {
@@ -27,7 +27,7 @@ variant, size, color, disabled, readOnly, autoFocus, ...props }) => {
                         endPickerInputRef.current.focus();
                         innerOpen.current === 'start' && setInnerOpen('end');
                     }
-                } }), separator ?? (0, jsx_runtime_1.jsx)("span", { children: "-" }), (0, jsx_runtime_1.jsx)(dateTimePicker_1.DateTimePicker, { ...commonProps, autoClose: autoClose, placeholder: showTimer ? '结束时间' : '结束日期', min: innerValue.current?.[0] || void 0, open: innerOpen.current === 'end', ...endPickerProps, inputRef: (0, utils_1.cloneRef)(endPickerInputRef, endPickerProps?.inputRef), onOpenChange: open => {
+                } }), separator ?? (0, jsx_runtime_1.jsx)("span", { children: "-" }), (0, jsx_runtime_1.jsx)(dateTimePicker_1.DateTimePicker, { ...commonProps, autoClose: autoClose, placeholder: showTimer ? '结束时间' : '结束日期', min: innerValue.current?.[0] || void 0, open: innerOpen.current === 'end', ...endPickerProps, inputProps: { ref: endPickerInputRef }, onOpenChange: open => {
                     startPickerProps?.onOpenChange?.(open);
                     setInnerOpen(open ? 'end' : 'closed');
                 }, onChange: endValue => {

package/dist/cjs/components/descriptions/descriptionItem.d.ts

@@ -1,17 +1,16 @@
-import { ReactNode } from 'react';
+import { ReactNode, ElementType, ReactElement } from 'react';
 import { DescriptionsSharedProps } from './descriptions';
 import { GridItemProps } from '../grid';
-import { ResponsiveProp } from '../../types';
-interface DescriptionItemBaseProps extends DescriptionsSharedProps {
+import { MergeProps, ResponsiveProp } from '../../types';
+export interface DescriptionGridItemOwnProps extends DescriptionsSharedProps {
     label?: ReactNode;
+    /** @alias {@link children} */
+    content?: ReactNode;
 }
-interface DescriptionGridItemProps extends DescriptionItemBaseProps, GridItemProps {
-}
-interface DescriptionTableItemProps extends DescriptionItemBaseProps {
+export interface DescriptionTableItemProps extends DescriptionGridItemOwnProps {
     span?: ResponsiveProp;
     className?: string;
     children?: ReactNode;
 }
-export type DescriptionItemProps = DescriptionGridItemProps | DescriptionTableItemProps;
-export declare const DescriptionItem: import("react").MemoExoticComponent<({ label, size, labelWidth, colon, labelPlacement, disableMargin, disablePadding, span, ...props }: DescriptionItemProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
-export {};
+export type DescriptionItemProps<C extends ElementType = 'div'> = MergeProps<DescriptionGridItemOwnProps, GridItemProps<C>> | DescriptionTableItemProps;
+export declare const DescriptionItem: <C extends ElementType = "div">(props: DescriptionItemProps<C>) => ReactElement;

package/dist/cjs/components/descriptions/descriptionItem.js

@@ -8,7 +8,7 @@ const theme_1 = require("../theme");
 const grid_1 = require("../grid");
 const utils_1 = require("../../utils");
 const descriptions_style_1 = require("./descriptions.style");
-exports.DescriptionItem = (0, react_1.memo)(({ label, 
+exports.DescriptionItem = (0, react_1.memo)(({ label, content, 
 // 以下属性从DescriptionsSharedProps继承
 size, labelWidth, colon, labelPlacement, disableMargin, disablePadding, span = { xs: 1 }, ...props }) => {
     const theme = (0, theme_1.useTheme)();
@@ -21,11 +21,11 @@ size, labelWidth, colon, labelPlacement, disableMargin, disablePadding, span = {
     disablePadding ??= context.disablePadding;
     const spanNum = (0, utils_1.useResponsiveValue)(span);
     return variant === 'grid'
-        ? (0, jsx_runtime_1.jsxs)(grid_1.GridItem, { ...props, css: descriptions_style_1.gridItemStyle, className: (0, utils_1.classnames)(descriptions_style_1.classes.item, props.className), span: span, "data-size": size, "data-label-placement": labelPlacement, "data-disable-margin": disableMargin, children: [!!label &&
+        ? (0, jsx_runtime_1.jsxs)(grid_1.GridItem, { ...props, css: descriptions_style_1.gridItemStyle, className: (0, utils_1.clsx)(descriptions_style_1.classes.item, props.className), span: span, "data-size": size, "data-label-placement": labelPlacement, "data-disable-margin": disableMargin, children: [!!label &&
                     (0, jsx_runtime_1.jsxs)("div", { className: descriptions_style_1.classes.label, style: { width: labelWidth }, children: [label, !!colon && (labelPlacement === 'left' || labelPlacement === 'right') &&
-                                (0, jsx_runtime_1.jsx)("div", { className: descriptions_style_1.classes.colon, children: colon })] }), (0, jsx_runtime_1.jsx)("div", { className: descriptions_style_1.classes.content, children: props.children })] })
+                                (0, jsx_runtime_1.jsx)("div", { className: descriptions_style_1.classes.colon, children: colon })] }), (0, jsx_runtime_1.jsx)("div", { className: descriptions_style_1.classes.content, children: content ?? props.children })] })
         : labelPlacement === 'top'
-            ? (0, jsx_runtime_1.jsx)("td", { className: descriptions_style_1.classes.vertical, colSpan: spanNum, children: (0, jsx_runtime_1.jsxs)("div", { className: descriptions_style_1.classes.verticalColWrap, children: [(0, jsx_runtime_1.jsx)("div", { className: `${descriptions_style_1.classes.col} ${descriptions_style_1.classes.labelCol}`, "data-size": size, children: label }), (0, jsx_runtime_1.jsx)("div", { className: `${descriptions_style_1.classes.col} ${descriptions_style_1.classes.contentCol}`, "data-size": size, "data-disable-padding": disablePadding, children: props.children })] }) })
+            ? (0, jsx_runtime_1.jsx)("td", { className: descriptions_style_1.classes.vertical, colSpan: spanNum, children: (0, jsx_runtime_1.jsxs)("div", { className: descriptions_style_1.classes.verticalColWrap, children: [(0, jsx_runtime_1.jsx)("div", { className: `${descriptions_style_1.classes.col} ${descriptions_style_1.classes.labelCol}`, "data-size": size, children: label }), (0, jsx_runtime_1.jsx)("div", { className: `${descriptions_style_1.classes.col} ${descriptions_style_1.classes.contentCol}`, "data-size": size, "data-disable-padding": disablePadding, children: content ?? props.children })] }) })
             : (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [!!label &&
-                        (0, jsx_runtime_1.jsx)("td", { className: `${descriptions_style_1.classes.col} ${descriptions_style_1.classes.labelCol}`, "data-size": size, children: label }), (0, jsx_runtime_1.jsx)("td", { className: `${descriptions_style_1.classes.col} ${descriptions_style_1.classes.contentCol}`, colSpan: spanNum * 2 - 1, "data-size": size, "data-disable-padding": disablePadding, children: props.children })] });
+                        (0, jsx_runtime_1.jsx)("td", { className: `${descriptions_style_1.classes.col} ${descriptions_style_1.classes.labelCol}`, "data-size": size, children: label }), (0, jsx_runtime_1.jsx)("td", { className: `${descriptions_style_1.classes.col} ${descriptions_style_1.classes.contentCol}`, colSpan: spanNum * 2 - 1, "data-size": size, "data-disable-padding": disablePadding, children: content ?? props.children })] });
 });

package/dist/cjs/components/descriptions/descriptions.d.ts

@@ -1,5 +1,5 @@
-import React, { ReactElement, ReactNode } from 'react';
-import { Obj, ResponsiveProp, Size } from '../../types';
+import { ReactElement, ReactNode, ElementType } from 'react';
+import { MergeProps, Obj, OverridableProps, ResponsiveProp, Size } from '../../types';
 import { GridProps } from '../grid';
 import { DescriptionItem, DescriptionItemProps } from './descriptionItem';
 export type DescriptionsSharedProps = {
@@ -9,9 +9,9 @@ export type DescriptionsSharedProps = {
     colon?: ReactNode;
     /** 标签的位置，table模式下仅支持`left`与`top`, 默认为`left` */
     labelPlacement?: 'top' | 'bottom' | 'left' | 'right';
-    /** 是否禁用margin,{@link DescriptionsGridProps.variant}为grid有效  */
+    /** 是否禁用margin,{@link DescriptionsProps.variant}为grid有效  */
     disableMargin?: boolean;
-    /** 是否禁用padding,{@link DescriptionsTableProps.variant}为table有效 */
+    /** 是否禁用padding,{@link DescriptionsProps.variant}为table有效 */
     disablePadding?: boolean;
 };
 export interface DescriptionsBaseProps extends DescriptionsSharedProps {
@@ -20,23 +20,23 @@ export interface DescriptionsBaseProps extends DescriptionsSharedProps {
      * @private 用于渲染item的组件，通常为内部使用
      * 默认为`DescriptionItem` {@link DescriptionItem}
      */
-    itemComponent?: any;
+    itemComponent?: ElementType;
 }
-export interface DescriptionsGridProps extends DescriptionsBaseProps, GridProps {
+export interface DescriptionsGridOwnProps extends DescriptionsBaseProps {
     variant?: 'grid';
 }
-export interface DescriptionsTableProps extends DescriptionsBaseProps, Partial<React.JSX.IntrinsicElements['table']> {
+export interface DescriptionsTableProps extends DescriptionsBaseProps {
     variant: 'table';
     columnCount?: ResponsiveProp;
 }
-export type DescriptionsProps = DescriptionsGridProps | DescriptionsTableProps;
+export type DescriptionsProps<C extends ElementType = 'div' | 'table'> = MergeProps<DescriptionsGridOwnProps, GridProps<C>> | OverridableProps<DescriptionsTableProps, C>;
 interface DescriptionsContext extends DescriptionsSharedProps {
     variant?: 'grid' | 'table';
 }
 export declare function useDescriptionsContext(): DescriptionsContext;
-declare const DescriptionsContext: React.Context<DescriptionsContext>;
+declare const DescriptionsContext: import("react").Context<DescriptionsContext>;
 export declare const Descriptions: {
-    (props: DescriptionsProps): ReactElement;
+    <C extends ElementType = "div">(props: DescriptionsProps<C>): ReactElement;
     Item: typeof DescriptionItem;
 };
 export {};