@canvas-components/react-list-table 0.3.12 → 0.3.14

package/dist/index.d.cts

@@ -1,6 +1,7 @@
 import * as react from 'react';
 import { CSSProperties, ReactNode, ForwardedRef, PropsWithChildren } from 'react';
-import { ListTableOptions, ListTableQueryChange, ListTableExportXlsxOptions, ListTableScrollToOptions, ListTable, ListTableColumn, ListTablePaginationOptions, ListTableQueryOptions, ListTableRowSelectionOptions } from '@canvas-components/list-table';
+import { ListTableOptions, ListTableQueryChange, ListTableExportXlsxOptions, ListTableScrollToOptions, ListTable, ListTableColumn, ListTablePaginationOptions, ListTableQueryOptions, ListTableRowSelectionOptions, EXPAND_COLUMN, SELECTION_COLUMN, ROW_SELECTION_COLUMN } from '@canvas-components/list-table';
+export { EXPAND_COLUMN, ROW_SELECTION_COLUMN, SELECTION_COLUMN } from '@canvas-components/list-table';
 
 interface ReactListTableScrollConfig {
     x?: number | string | true;
@@ -54,6 +55,8 @@ interface ReactListTableRef<RecordType = Record<string, unknown>> {
     getDebugSnapshot: () => ReturnType<ListTable<RecordType>["getDebugSnapshot"]>;
     resetSorter: () => void;
     resetFilter: () => void;
+    /** 人工重试最近一次仍有效的本地查询失败。 */
+    retryQuery: () => boolean;
 }
 /**
  * antd Table 风格的 props 类型别名。
@@ -84,9 +87,15 @@ type ReactListTableQuery<RecordType = Record<string, unknown>> = ListTableQueryO
  * ListTable 的 React 宿主组件。
  */
 declare function ReactListTableInner<RecordType = Record<string, unknown>>(props: ReactListTableProps<RecordType>, ref: ForwardedRef<ReactListTableRef<RecordType>>): react.JSX.Element;
-declare const ReactListTable: <RecordType = Record<string, unknown>>(props: ReactListTableProps<RecordType> & {
-    ref?: ForwardedRef<ReactListTableRef<RecordType>>;
-}) => ReturnType<typeof ReactListTableInner>;
+interface ReactListTableComponent {
+    <RecordType = Record<string, unknown>>(props: ReactListTableProps<RecordType> & {
+        ref?: ForwardedRef<ReactListTableRef<RecordType>>;
+    }): ReturnType<typeof ReactListTableInner>;
+    EXPAND_COLUMN: typeof EXPAND_COLUMN;
+    SELECTION_COLUMN: typeof SELECTION_COLUMN;
+    ROW_SELECTION_COLUMN: typeof ROW_SELECTION_COLUMN;
+}
+declare const ReactListTable: ReactListTableComponent;
 
 /** ReactListTable 调试模式上下文属性。 */
 interface ReactListTableDebugProviderProps extends PropsWithChildren {

package/dist/index.d.ts

@@ -1,6 +1,7 @@
 import * as react from 'react';
 import { CSSProperties, ReactNode, ForwardedRef, PropsWithChildren } from 'react';
-import { ListTableOptions, ListTableQueryChange, ListTableExportXlsxOptions, ListTableScrollToOptions, ListTable, ListTableColumn, ListTablePaginationOptions, ListTableQueryOptions, ListTableRowSelectionOptions } from '@canvas-components/list-table';
+import { ListTableOptions, ListTableQueryChange, ListTableExportXlsxOptions, ListTableScrollToOptions, ListTable, ListTableColumn, ListTablePaginationOptions, ListTableQueryOptions, ListTableRowSelectionOptions, EXPAND_COLUMN, SELECTION_COLUMN, ROW_SELECTION_COLUMN } from '@canvas-components/list-table';
+export { EXPAND_COLUMN, ROW_SELECTION_COLUMN, SELECTION_COLUMN } from '@canvas-components/list-table';
 
 interface ReactListTableScrollConfig {
     x?: number | string | true;
@@ -54,6 +55,8 @@ interface ReactListTableRef<RecordType = Record<string, unknown>> {
     getDebugSnapshot: () => ReturnType<ListTable<RecordType>["getDebugSnapshot"]>;
     resetSorter: () => void;
     resetFilter: () => void;
+    /** 人工重试最近一次仍有效的本地查询失败。 */
+    retryQuery: () => boolean;
 }
 /**
  * antd Table 风格的 props 类型别名。
@@ -84,9 +87,15 @@ type ReactListTableQuery<RecordType = Record<string, unknown>> = ListTableQueryO
  * ListTable 的 React 宿主组件。
  */
 declare function ReactListTableInner<RecordType = Record<string, unknown>>(props: ReactListTableProps<RecordType>, ref: ForwardedRef<ReactListTableRef<RecordType>>): react.JSX.Element;
-declare const ReactListTable: <RecordType = Record<string, unknown>>(props: ReactListTableProps<RecordType> & {
-    ref?: ForwardedRef<ReactListTableRef<RecordType>>;
-}) => ReturnType<typeof ReactListTableInner>;
+interface ReactListTableComponent {
+    <RecordType = Record<string, unknown>>(props: ReactListTableProps<RecordType> & {
+        ref?: ForwardedRef<ReactListTableRef<RecordType>>;
+    }): ReturnType<typeof ReactListTableInner>;
+    EXPAND_COLUMN: typeof EXPAND_COLUMN;
+    SELECTION_COLUMN: typeof SELECTION_COLUMN;
+    ROW_SELECTION_COLUMN: typeof ROW_SELECTION_COLUMN;
+}
+declare const ReactListTable: ReactListTableComponent;
 
 /** ReactListTable 调试模式上下文属性。 */
 interface ReactListTableDebugProviderProps extends PropsWithChildren {

package/dist/index.js

@@ -1,7 +1,8 @@
 import { createContext, forwardRef, useMemo, useRef, useState, useImperativeHandle, useContext, useEffect, useLayoutEffect, Fragment as Fragment$1 } from 'react';
 import { createPortal } from 'react-dom';
 import { ReactImagePreview, ReactNumberInput, ReactSelect, ReactPagination, ReactFilterPanel, ReactPopup, ReactModal, ReactInput, ReactPopconfirm, ReactContentScaleProvider, ReactInputNumber, ReactCheckbox, ReactAutoComplete, ReactColorPicker, ReactTimeRangePicker, ReactDateTimeRangePicker, ReactDateTimePicker, ReactTimePicker, ReactDateRangePicker, ReactDatePicker, ReactMonthPicker, ReactQuarterPicker, ReactYearPicker, ReactInputRange } from '@canvas-components/react-components';
-import { resetListTableStoredColumnConfig, ListTable } from '@canvas-components/list-table';
+import { EXPAND_COLUMN, SELECTION_COLUMN, ROW_SELECTION_COLUMN, resetListTableStoredColumnConfig, ListTable } from '@canvas-components/list-table';
+export { EXPAND_COLUMN, ROW_SELECTION_COLUMN, SELECTION_COLUMN } from '@canvas-components/list-table';
 import { formatDateTimeValue, isDateTimeFormatPattern } from '@canvas-components/utils/date';
 import { formatNumberValue, formatPercentValue, formatScientificValue, formatCustomNumberPattern } from '@canvas-components/utils/number';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
@@ -438,7 +439,7 @@ function MenuAction(props) {
   );
 }
 function MenuSubmenu(props) {
-  const { label, items, footer, children, minWidth = 220 } = props;
+  const { label, items, header, footer, children, minWidth = 220 } = props;
   const menuItems = items.filter((item) => item.onClick || item.disabled);
   const reserveSelectionIcon = menuItems.some(
     (item) => typeof item.selected === "boolean"
@@ -446,7 +447,7 @@ function MenuSubmenu(props) {
   const triggerRef = useRef(null);
   const [open, setOpen] = useState(false);
   const closeTimerRef = useRef(null);
-  if (!menuItems.length && !footer && !children) {
+  if (!menuItems.length && !header && !footer && !children) {
     return null;
   }
   const clearCloseTimer = () => {
@@ -528,6 +529,7 @@ function MenuSubmenu(props) {
                   scheduleClose();
                 },
                 children: [
+                  header,
                   menuItems.map((item) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
                     item.separatorBefore ? /* @__PURE__ */ jsx(MenuDivider, {}) : null,
                     /* @__PURE__ */ jsx(
@@ -1163,6 +1165,7 @@ function CustomSelectionRow(props) {
 }
 function SummaryMenu(props) {
   const { request } = props;
+  const [title, setTitle] = useState(request.summaryTitle ?? "");
   const [precision, setPrecision] = useState(
     request.summaryPrecision ?? null
   );
@@ -1173,11 +1176,13 @@ function SummaryMenu(props) {
     request.summaryPreserveTrailingZeros ?? false
   );
   useEffect(() => {
+    setTitle(request.summaryTitle ?? "");
     setPrecision(request.summaryPrecision ?? null);
     setRoundingMode(request.summaryRoundingMode ?? "round");
     setPreserveTrailingZeros(request.summaryPreserveTrailingZeros ?? false);
   }, [
     request.summaryColumnKey,
+    request.summaryTitle,
     request.summaryPrecision,
     request.summaryRoundingMode,
     request.summaryPreserveTrailingZeros
@@ -1200,12 +1205,49 @@ function SummaryMenu(props) {
     {
       label: "\u6C47\u603B\u65B9\u5F0F",
       minWidth: 268,
-      items: summaryTypes.map((item) => ({
-        key: item.key,
-        label: item.label,
-        selected: request.summaryType === item.value,
-        onClick: () => request.onChangeSummaryType?.(item.value)
-      })),
+      header: request.onChangeSummaryTitle ? /* @__PURE__ */ jsxs(
+        "div",
+        {
+          style: {
+            display: "grid",
+            gridTemplateColumns: "56px 1fr",
+            gap: 8,
+            alignItems: "center",
+            padding: "2px 10px 10px",
+            marginBottom: 4,
+            borderBottom: "1px solid #e5e7eb"
+          },
+          children: [
+            /* @__PURE__ */ jsx("span", { style: { color: "#374151", fontSize: 14 }, children: "\u6807\u9898\uFF1A" }),
+            /* @__PURE__ */ jsx(
+              ReactInput,
+              {
+                value: title,
+                placeholder: "\u8BF7\u8F93\u5165\u6807\u9898",
+                onChange: (event) => {
+                  const value = event.target.value;
+                  setTitle(value);
+                  request.onChangeSummaryTitle?.(value);
+                }
+              }
+            )
+          ]
+        }
+      ) : void 0,
+      items: [
+        ...summaryTypes.map((item) => ({
+          key: item.key,
+          label: item.label,
+          selected: request.summaryType === item.value,
+          onClick: () => request.onChangeSummaryType?.(item.value)
+        })),
+        {
+          key: "clear-summary",
+          label: "\u53D6\u6D88\u6C47\u603B",
+          separatorBefore: true,
+          onClick: request.onClearSummary
+        }
+      ],
       footer: request.onChangeSummaryPrecision || request.onChangeSummaryRoundingMode || request.onChangeSummaryPreserveTrailingZeros ? /* @__PURE__ */ jsxs(
         "div",
         {
@@ -3829,6 +3871,7 @@ function ReactListTableInner(props, ref) {
     rowKey,
     columns,
     dataSource,
+    loading,
     onRow,
     theme,
     striped,
@@ -3840,6 +3883,7 @@ function ReactListTableInner(props, ref) {
     summaryRowHeight,
     overscanRowCount,
     query,
+    experimental,
     rowSelector,
     rowSelection,
     expandable,
@@ -3899,6 +3943,7 @@ function ReactListTableInner(props, ref) {
       rowKey,
       columns: resolvedColumns,
       dataSource,
+      loading,
       onRow,
       theme,
       striped,
@@ -3910,6 +3955,7 @@ function ReactListTableInner(props, ref) {
       summaryRowHeight: resolvedSummaryRowHeight,
       overscanRowCount,
       query,
+      experimental,
       rowSelector,
       rowSelection,
       expandable,
@@ -3948,6 +3994,7 @@ function ReactListTableInner(props, ref) {
     rowKey,
     resolvedColumns,
     dataSource,
+    loading,
     onRow,
     theme,
     striped,
@@ -3959,6 +4006,7 @@ function ReactListTableInner(props, ref) {
     resolvedSummaryRowHeight,
     overscanRowCount,
     query,
+    experimental,
     rowSelector,
     rowSelection,
     expandable,
@@ -3991,9 +4039,7 @@ function ReactListTableInner(props, ref) {
     closeDangerConfirmRequest
   } = useReactListTableState(options);
   const hasPagination = paginationConfig != null;
-  const paginationLayout = resolveReactListTablePaginationLayout(
-    resolvedRowHeight
-  );
+  const paginationLayout = resolveReactListTablePaginationLayout(resolvedRowHeight);
   useImperativeHandle(
     ref,
     () => ({
@@ -4010,7 +4056,8 @@ function ReactListTableInner(props, ref) {
       },
       resetFilter: () => {
         tableRef.current?.resetFilter();
-      }
+      },
+      retryQuery: () => tableRef.current?.retryQuery() ?? false
     }),
     []
   );
@@ -4123,7 +4170,7 @@ function ReactListTableInner(props, ref) {
               )
             }
           ),
-          loadingRequest ? /* @__PURE__ */ jsx(
+          loading || loadingRequest ? /* @__PURE__ */ jsx(
             "div",
             {
               style: {
@@ -4138,7 +4185,7 @@ function ReactListTableInner(props, ref) {
                 pointerEvents: "auto",
                 cursor: "progress"
               },
-              children: loadingRequest.text ?? "\u5904\u7406\u4E2D\u2026"
+              children: loading ? "\u6570\u636E\u52A0\u8F7D\u4E2D\u2026" : loadingRequest?.text ?? "\u5904\u7406\u4E2D\u2026"
             }
           ) : null
         ]
@@ -4236,7 +4283,12 @@ function applyManagedColumnOrder(columns, orderedKeys) {
 function resolveColumnKey(column) {
   return String(column.key ?? column.dataIndex);
 }
-var ReactListTable = forwardRef(ReactListTableInner);
+var ReactListTable = forwardRef(
+  ReactListTableInner
+);
+ReactListTable.EXPAND_COLUMN = EXPAND_COLUMN;
+ReactListTable.SELECTION_COLUMN = SELECTION_COLUMN;
+ReactListTable.ROW_SELECTION_COLUMN = ROW_SELECTION_COLUMN;
 
 export { ReactListTable, ReactListTableDebugProvider };
 //# sourceMappingURL=index.js.map