@dtjoy/dt-design 1.0.6 → 1.0.8

package/lib/table/Table.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _table = require("@rc-component/table");
+var _Column = _interopRequireDefault(require("antd/lib/table/Column"));
+var _ColumnGroup = _interopRequireDefault(require("antd/lib/table/ColumnGroup"));
+var _useSelection = require("antd/lib/table/hooks/useSelection");
+var _InternalTable = _interopRequireDefault(require("./InternalTable"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+const Table = (props, ref) => {
+  const renderTimesRef = React.useRef(0);
+  renderTimesRef.current += 1;
+  return /*#__PURE__*/React.createElement(_InternalTable.default, _extends({}, props, {
+    ref: ref,
+    _renderTimes: renderTimesRef.current
+  }));
+};
+const ForwardTable = /*#__PURE__*/React.forwardRef(Table);
+ForwardTable.SELECTION_COLUMN = _useSelection.SELECTION_COLUMN;
+ForwardTable.EXPAND_COLUMN = _table.EXPAND_COLUMN;
+ForwardTable.SELECTION_ALL = _useSelection.SELECTION_ALL;
+ForwardTable.SELECTION_INVERT = _useSelection.SELECTION_INVERT;
+ForwardTable.SELECTION_NONE = _useSelection.SELECTION_NONE;
+ForwardTable.Column = _Column.default;
+ForwardTable.ColumnGroup = _ColumnGroup.default;
+ForwardTable.Summary = _table.Summary;
+if (process.env.NODE_ENV !== 'production') {
+  ForwardTable.displayName = 'Table';
+}
+var _default = exports.default = ForwardTable;

package/lib/table/TableMeasureRowContext.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const TableMeasureRowContext: React.Context<boolean>;
+export default TableMeasureRowContext;

package/lib/{_util/zindexContext.js → table/TableMeasureRowContext.js}

@@ -6,8 +6,5 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const zIndexContext = /*#__PURE__*/_react.default.createContext(undefined);
-if (process.env.NODE_ENV !== 'production') {
-  zIndexContext.displayName = 'zIndexContext';
-}
-var _default = exports.default = zIndexContext;
+const TableMeasureRowContext = /*#__PURE__*/_react.default.createContext(false);
+var _default = exports.default = TableMeasureRowContext;

package/lib/table/hooks/useContainerWidth.d.ts

@@ -0,0 +1 @@
+export default function useContainerWidth(prefixCls: string): (ele: HTMLElement, width: number) => number;

package/lib/table/hooks/useContainerWidth.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useContainerWidth;
+function useContainerWidth(prefixCls) {
+  const getContainerWidth = (ele, width) => {
+    const container = ele.querySelector(`.${prefixCls}-container`);
+    let returnWidth = width;
+    if (container) {
+      const style = getComputedStyle(container);
+      const borderLeft = Number.parseInt(style.borderLeftWidth, 10);
+      const borderRight = Number.parseInt(style.borderRightWidth, 10);
+      returnWidth = width - borderLeft - borderRight;
+    }
+    return returnWidth;
+  };
+  return getContainerWidth;
+}

package/lib/table/index.d.ts

@@ -0,0 +1,7 @@
+import type { TablePaginationConfig, TableProps } from './InternalTable';
+import Table from './Table';
+export type { ColumnGroupType, ColumnsType, ColumnType } from './interface';
+export type { Reference as TableRef } from '@rc-component/table';
+export type { ColumnProps } from 'antd/lib/table/Column';
+export type { TablePaginationConfig, TableProps };
+export default Table;

package/lib/table/index.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _Table = _interopRequireDefault(require("./Table"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _default = exports.default = _Table.default;

package/lib/table/interface.d.ts

@@ -0,0 +1,196 @@
+import type * as React from 'react';
+import type { Reference } from '@rc-component/table';
+import type { ExpandableConfig, FixedType, GetComponentProps, GetRowKey, ColumnType as RcColumnType, RenderedCell as RcRenderedCell } from '@rc-component/table/lib/interface';
+import type { CheckboxProps, DropdownProps, PaginationProps, TooltipProps } from 'antd';
+import type { Breakpoint } from 'antd/lib/_util/responsiveObserve';
+import type { INTERNAL_SELECTION_ITEM } from 'antd/lib/table/hooks/useSelection';
+import type { AnyObject } from '../_util/type';
+import type { InternalTableProps, TableProps } from './InternalTable';
+export type RefTable = <RecordType = AnyObject>(props: React.PropsWithChildren<TableProps<RecordType>> & React.RefAttributes<Reference>) => React.ReactElement;
+export type RefInternalTable = <RecordType = AnyObject>(props: React.PropsWithChildren<InternalTableProps<RecordType>> & React.RefAttributes<Reference>) => React.ReactElement;
+export type { ExpandableConfig, GetRowKey };
+export type Key = React.Key;
+export type SafeKey = Exclude<Key, bigint>;
+export type RowSelectionType = 'checkbox' | 'radio';
+export type SelectionItemSelectFn = (currentRowKeys: Key[]) => void;
+export type ExpandType = null | 'row' | 'nest';
+export interface TableLocale {
+    filterTitle?: string;
+    filterConfirm?: React.ReactNode;
+    filterReset?: React.ReactNode;
+    filterEmptyText?: React.ReactNode;
+    /**
+     * @deprecated Please use `filterCheckAll` instead.
+     */
+    filterCheckall?: React.ReactNode;
+    filterCheckAll?: React.ReactNode;
+    filterSearchPlaceholder?: string;
+    emptyText?: React.ReactNode | (() => React.ReactNode);
+    selectAll?: React.ReactNode;
+    selectNone?: React.ReactNode;
+    selectInvert?: React.ReactNode;
+    selectionAll?: React.ReactNode;
+    sortTitle?: string;
+    expand?: string;
+    collapse?: string;
+    triggerDesc?: string;
+    triggerAsc?: string;
+    cancelSort?: string;
+}
+export type SortOrder = 'descend' | 'ascend' | null;
+export type SorterTooltipTarget = 'full-header' | 'sorter-icon';
+export type SorterTooltipProps = TooltipProps & {
+    target?: SorterTooltipTarget;
+};
+declare const _TableActions: readonly ["paginate", "sort", "filter"];
+export type TableAction = (typeof _TableActions)[number];
+export type CompareFn<T = AnyObject> = (a: T, b: T, sortOrder?: SortOrder) => number;
+export interface ColumnFilterItem {
+    text: React.ReactNode;
+    value: React.Key | boolean;
+    children?: ColumnFilterItem[];
+}
+export interface ColumnTitleProps<RecordType = AnyObject> {
+    /** @deprecated Will be remove in v7, Please use `sorterColumns` instead. */
+    sortOrder?: SortOrder;
+    /** @deprecated Will be remove in v7, Please use `sorterColumns` instead. */
+    sortColumn?: ColumnType<RecordType>;
+    sortColumns?: {
+        column: ColumnType<RecordType>;
+        order: SortOrder;
+    }[];
+    filters?: Record<string, FilterValue>;
+}
+export type ColumnTitle<RecordType = AnyObject> = React.ReactNode | ((props: ColumnTitleProps<RecordType>) => React.ReactNode);
+export type FilterValue = (Key | boolean)[];
+export type FilterKey = (string | number)[] | null;
+export type FilterSearchType<RecordType = AnyObject> = boolean | ((input: string, record: RecordType) => boolean);
+export interface FilterConfirmProps {
+    closeDropdown: boolean;
+}
+export interface FilterRestProps {
+    confirm?: boolean;
+    closeDropdown?: boolean;
+}
+export interface FilterDropdownProps {
+    prefixCls: string;
+    setSelectedKeys: (selectedKeys: React.Key[]) => void;
+    selectedKeys: React.Key[];
+    /**
+     * Confirm filter value, if you want to close dropdown before commit, you can call with
+     * {closeDropdown: true}
+     */
+    confirm: (param?: FilterConfirmProps) => void;
+    clearFilters?: (param?: FilterRestProps) => void;
+    filters?: ColumnFilterItem[];
+    /** Only close filterDropdown */
+    close: () => void;
+    visible: boolean;
+}
+interface CoverableDropdownProps extends Omit<DropdownProps, 'onOpenChange' | 'overlay' | 'visible' | 'onVisibleChange'> {
+    onOpenChange?: (open: boolean) => void;
+}
+export interface ColumnType<RecordType = AnyObject> extends Omit<RcColumnType<RecordType>, 'title'> {
+    title?: ColumnTitle<RecordType>;
+    sorter?: boolean | CompareFn<RecordType> | {
+        compare?: CompareFn<RecordType>;
+        /** Config multiple sorter order priority */
+        multiple?: number;
+    };
+    sortOrder?: SortOrder;
+    defaultSortOrder?: SortOrder;
+    sortDirections?: SortOrder[];
+    sortIcon?: (props: {
+        sortOrder: SortOrder;
+    }) => React.ReactNode;
+    showSorterTooltip?: boolean | SorterTooltipProps;
+    filtered?: boolean;
+    filters?: ColumnFilterItem[];
+    filterDropdown?: React.ReactNode | ((props: FilterDropdownProps) => React.ReactNode);
+    filterOnClose?: boolean;
+    filterMultiple?: boolean;
+    filteredValue?: FilterValue | null;
+    defaultFilteredValue?: FilterValue | null;
+    filterIcon?: React.ReactNode | ((filtered: boolean) => React.ReactNode);
+    filterMode?: 'menu' | 'tree';
+    filterSearch?: FilterSearchType<ColumnFilterItem>;
+    onFilter?: (value: React.Key | boolean, record: RecordType) => boolean;
+    /**
+     * Can cover `<Dropdown>` props
+     * @since 5.22.0
+     */
+    filterDropdownProps?: CoverableDropdownProps;
+    filterResetToDefaultFilteredValue?: boolean;
+    responsive?: Breakpoint[];
+    /**
+     * @deprecated Please use `filterDropdownProps.open` instead.
+     * @since 4.23.0
+     */
+    filterDropdownOpen?: boolean;
+    /**
+     * @deprecated Please use `filterDropdownProps.onOpenChange` instead.
+     * @since 4.23.0
+     */
+    onFilterDropdownOpenChange?: (visible: boolean) => void;
+}
+export interface ColumnGroupType<RecordType = AnyObject> extends Omit<ColumnType<RecordType>, 'dataIndex'> {
+    children: ColumnsType<RecordType>;
+}
+export type ColumnsType<RecordType = AnyObject> = (ColumnGroupType<RecordType> | ColumnType<RecordType>)[];
+export interface SelectionItem {
+    key: string;
+    text: React.ReactNode;
+    onSelect?: SelectionItemSelectFn;
+}
+export type SelectionSelectFn<T = AnyObject> = (record: T, selected: boolean, selectedRows: T[], nativeEvent: Event) => void;
+export type RowSelectMethod = 'all' | 'none' | 'invert' | 'single' | 'multiple';
+export interface TableRowSelection<T = AnyObject> {
+    /** Keep the selection keys in list even the key not exist in `dataSource` anymore */
+    preserveSelectedRowKeys?: boolean;
+    type?: RowSelectionType;
+    selectedRowKeys?: Key[];
+    defaultSelectedRowKeys?: Key[];
+    onChange?: (selectedRowKeys: Key[], selectedRows: T[], info: {
+        type: RowSelectMethod;
+    }) => void;
+    getCheckboxProps?: (record: T) => Partial<Omit<CheckboxProps, 'checked' | 'defaultChecked'>>;
+    onSelect?: SelectionSelectFn<T>;
+    /** @deprecated This function will be remove in v7 and should use `onChange` instead */
+    onSelectMultiple?: (selected: boolean, selectedRows: T[], changeRows: T[]) => void;
+    /** @deprecated This function will be remove in v7 and should use `onChange` instead */
+    onSelectAll?: (selected: boolean, selectedRows: T[], changeRows: T[]) => void;
+    /** @deprecated This function will be remove in v7 and should use `onChange` instead */
+    onSelectInvert?: (selectedRowKeys: Key[]) => void;
+    /** @deprecated This function will be remove in v7 and should use `onChange` instead */
+    onSelectNone?: () => void;
+    selections?: INTERNAL_SELECTION_ITEM[] | boolean;
+    hideSelectAll?: boolean;
+    fixed?: FixedType;
+    columnWidth?: string | number;
+    columnTitle?: React.ReactNode | ((checkboxNode: React.ReactNode) => React.ReactNode);
+    checkStrictly?: boolean;
+    /** Set the alignment of the selection column */
+    align?: 'left' | 'center' | 'right';
+    renderCell?: (value: boolean, record: T, index: number, originNode: React.ReactNode) => React.ReactNode | RcRenderedCell<T>;
+    onCell?: GetComponentProps<T>;
+    getTitleCheckboxProps?: () => Partial<Omit<CheckboxProps, 'checked' | 'defaultChecked'>> & React.AriaAttributes;
+}
+export type TransformColumns<RecordType = AnyObject> = (columns: ColumnsType<RecordType>) => ColumnsType<RecordType>;
+export interface TableCurrentDataSource<RecordType = AnyObject> {
+    currentDataSource: RecordType[];
+    action: TableAction;
+}
+export interface SorterResult<RecordType = AnyObject> {
+    column?: ColumnType<RecordType>;
+    order?: SortOrder;
+    field?: Key | readonly Key[];
+    columnKey?: Key;
+}
+export type GetPopupContainer = (triggerNode: HTMLElement) => HTMLElement;
+export type TablePaginationPlacement = 'topStart' | 'topCenter' | 'topEnd' | 'bottomStart' | 'bottomCenter' | 'bottomEnd' | 'none';
+export type TablePaginationPosition = 'topLeft' | 'topCenter' | 'topRight' | 'bottomLeft' | 'bottomCenter' | 'bottomRight' | 'none';
+export interface TablePaginationConfig extends PaginationProps {
+    placement?: TablePaginationPlacement[];
+    /** @deprecated please use `placement` instead */
+    position?: TablePaginationPosition[];
+}

package/lib/table/interface.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+const _TableActions = ['paginate', 'sort', 'filter'];
+
+// 非必要请勿导出

package/lib/table/style/bordered.less

@@ -0,0 +1,141 @@
+@import '../../style/themes/index.less';
+
+@table-prefix-cls: ~'@{ant-prefix}-table';
+
+.@{table-prefix-cls}-wrapper {
+  .@{table-prefix-cls}.@{table-prefix-cls}-bordered {
+    // ============================ Title 标题 =============================
+    > .@{table-prefix-cls}-title {
+      border: @border-width-base @border-style-base @border-color-base;
+      border-bottom: 0;
+    }
+
+    // ============================ Content 内容容器 ============================
+    > .@{table-prefix-cls}-container {
+      border-left: @border-width-base @border-style-base @border-color-base;
+      border-top: @border-width-base @border-style-base @border-color-base;
+
+      > .@{table-prefix-cls}-content,
+      > .@{table-prefix-cls}-header,
+      > .@{table-prefix-cls}-body,
+      > .@{table-prefix-cls}-summary {
+        > table {
+          // ============================= Cell 单元格 =============================
+          > thead > tr > th,
+          > thead > tr > td,
+          > tbody > tr > th,
+          > tbody > tr > td,
+          > tfoot > tr > th,
+          > tfoot > tr > td {
+            border-right: @border-width-base @border-style-base @border-color-base;
+          }
+
+          // ============================ Header 表头 ============================
+          > thead {
+            > tr:not(:last-child) > th {
+              border-bottom: @border-width-base @border-style-base @border-color-base;
+            }
+
+            > tr > th::before {
+              background-color: transparent !important;
+            }
+          }
+
+          > thead > tr,
+          > tbody > tr,
+          > tfoot > tr {
+            > .@{table-prefix-cls}-cell-fix-right-first::after {
+              border-right: @border-width-base @border-style-base @border-color-base;
+            }
+          }
+
+          // ========================== Expandable 展开行 ==========================
+          > tbody > tr > th,
+          > tbody > tr > td {
+            > .@{table-prefix-cls}-expanded-row-fixed {
+              // margin: calc(-@table-cell-padding-vertical)
+              //     calc(-(@table-cell-padding-horizontal + @border-width-base));
+              &::after {
+                position: absolute;
+                top: 0;
+                right: @border-width-base;
+                bottom: 0;
+                border-right: @border-width-base @border-style-base @border-color-base;
+                content: '';
+              }
+            }
+          }
+        }
+      }
+    }
+
+    // ============================ Scroll 水平滚动 ============================
+    &.@{table-prefix-cls}-scroll-horizontal {
+      > .@{table-prefix-cls}-container > .@{table-prefix-cls}-body {
+        > table > tbody {
+          > tr.@{table-prefix-cls}-expanded-row,
+          > tr.@{table-prefix-cls}-placeholder {
+            > th,
+            > td {
+              border-right: 0;
+            }
+          }
+        }
+      }
+    }
+
+    // ============================ Size 尺寸样式（middle/small） ============================
+    &.@{table-prefix-cls}-middle {
+      > .@{table-prefix-cls}-container {
+        > .@{table-prefix-cls}-content,
+        > .@{table-prefix-cls}-body {
+          > table > tbody > tr > th,
+          > table > tbody > tr > td {
+            > .@{table-prefix-cls}-expanded-row-fixed {
+              // margin: calc(-@table-cell-padding-vertical-middle)
+              //     calc(-(@table-cell-padding-horizontal-middle + @border-width-base));
+            }
+          }
+        }
+      }
+    }
+
+    // small尺寸（对应原getSizeBorderStyle('small')）
+    &.@{table-prefix-cls}-small {
+      > .@{table-prefix-cls}-container {
+        > .@{table-prefix-cls}-content,
+        > .@{table-prefix-cls}-body {
+          > table > tbody > tr > th,
+          > table > tbody > tr > td {
+            > .@{table-prefix-cls}-expanded-row-fixed {
+              // margin: calc(-@table-cell-padding-vertical-small)
+              //     calc(-(@table-cell-padding-horizontal-small + @border-width-base));
+            }
+          }
+        }
+      }
+    }
+
+    // ============================ Footer 页脚 ============================
+    > .@{table-prefix-cls}-footer {
+      border: @border-width-base @border-style-base @border-color-base;
+      border-top: 0;
+    }
+  }
+
+  // ============================ Nested 嵌套表格 ============================
+  .@{table-prefix-cls}-cell {
+    > .@{table-prefix-cls}-container:first-child {
+      border-top: 0;
+    }
+
+    &-scrollbar:not([rowspan]) {
+      // box-shadow: 0 @border-width-base 0 @border-width-base @table-header-background;
+    }
+  }
+
+  // 边框表格滚动条右侧边框
+  .@{table-prefix-cls}-bordered .@{table-prefix-cls}-cell-scrollbar {
+    border-right: @border-width-base @border-style-base @border-color-base;
+  }
+}

package/lib/table/style/fixed.less

@@ -0,0 +1,88 @@
+@import '../../style/themes/index.less';
+
+@table-prefix-cls: ~'@{ant-prefix}-table';
+@cell-cls: ~'@{table-prefix-cls}-cell';
+@fix-cell-cls: ~'@{table-prefix-cls}-cell-fix';
+
+.shadow-left-style() {
+    box-shadow: inset 10px 0 8px -8px @border-color-split;
+}
+
+.shadow-right-style() {
+    box-shadow: inset -10px 0 8px -8px @border-color-split;
+}
+
+.shared-shadow-style() {
+    position: absolute;
+    top: 0;
+    bottom: calc(-@border-width-base);
+    width: 30px;
+    transition: box-shadow @motion-duration-slow;
+    content: '';
+    pointer-events: none;
+}
+
+.@{table-prefix-cls}-wrapper {
+    .@{cell-cls}.@{fix-cell-cls} {
+        position: sticky;
+    }
+
+    .@{fix-cell-cls} {
+        z-index: calc(var(--z-offset-reverse) + @zindex-table-fixed);
+        background: @table-bg;
+
+        &:after {
+            .shared-shadow-style();
+        }
+
+        &-start:after {
+            left: 100%;
+        }
+
+        &-end:after {
+            right: 100%;
+        }
+
+        &-start-shadow-show:after {
+            .shadow-left-style();
+        }
+
+        &-end-shadow-show:after {
+            .shadow-right-style();
+        }
+    }
+
+    .@{table-prefix-cls}-container {
+        position: relative;
+
+        &:before,
+        &:after {
+            .shared-shadow-style();
+            z-index: calc(var(--columns-count) * 2 + @zindex-table-fixed + 1);
+        }
+
+        &:before {
+            left: 0;
+        }
+
+        &:after {
+            right: 0;
+        }
+    }
+
+    .@{table-prefix-cls}-has-fix-start .@{table-prefix-cls}-container:before {
+        display: none;
+    }
+
+    .@{table-prefix-cls}-has-fix-end .@{table-prefix-cls}-container:after {
+        display: none;
+    }
+
+    .@{table-prefix-cls}-fix-start-shadow-show .@{table-prefix-cls}-container:before {
+        .shadow-left-style();
+    }
+
+    .@{table-prefix-cls}-fix-end-shadow-show .@{table-prefix-cls}-container:after {
+        .shadow-right-style();
+    }
+}

package/lib/table/style/index.d.ts

@@ -0,0 +1,2 @@
+import '../../style/index.less';
+import './index.less';

package/lib/table/style/index.js

@@ -0,0 +1,4 @@
+"use strict";
+
+require("../../style/index.less");
+require("./index.less");