@canvas-components/react-list-table 0.2.0

package/dist/index.js

@@ -0,0 +1,2913 @@
+import { forwardRef, useRef, useState, useMemo, useImperativeHandle, useEffect, useLayoutEffect } from 'react';
+import { createPortal } from 'react-dom';
+import { ReactImagePreview, ReactNumberInput, ReactSelect, ReactPagination, ReactFilterPanel, ReactPopup, ReactPopconfirm, ReactContentScaleProvider, ReactInputNumber, ReactCheckbox, ReactInput, ReactAutoComplete, ReactColorPicker, ReactTimeRangePicker, ReactDateTimeRangePicker, ReactDateTimePicker, ReactTimePicker, ReactDateRangePicker, ReactDatePicker, ReactMonthPicker, ReactQuarterPicker, ReactYearPicker, ReactInputRange } from '@canvas-components/react-components';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { ListTable } from '@canvas-components/list-table';
+
+// #style-inject:#style-inject
+function styleInject(css, { insertAt } = {}) {
+  if (!css || typeof document === "undefined") return;
+  const head = document.head || document.getElementsByTagName("head")[0];
+  const style = document.createElement("style");
+  style.type = "text/css";
+  if (insertAt === "top") {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+// src/styles/table-overrides.css
+styleInject(".react-list-table-filter-option {\n  transition: background-color 0.2s ease;\n}\n.react-list-table-filter-option:hover {\n  background: #f3f4f6;\n}\n.react-list-table-menu-action,\n.react-list-table-menu-row {\n  transition: background-color 0.2s ease, color 0.2s ease;\n}\n.react-list-table-menu-action:hover,\n.react-list-table-menu-row:hover {\n  background: #f3f4f6 !important;\n}\n.react-list-table-custom-selection-copy {\n  transition: background-color 0.2s ease;\n}\n.react-list-table-custom-selection-copy:hover {\n  background: #4096ff !important;\n}\n.react-list-table-custom-selection-input > .canvas-react-input-number-handler-down {\n  display: none;\n}\n.react-list-table-menu-chevron {\n  width: 7px;\n  height: 7px;\n  flex: 0 0 auto;\n  margin-left: 8px;\n  border-top: 1.5px solid #9ca3af;\n  border-right: 1.5px solid #9ca3af;\n  transform: rotate(45deg);\n  transform-origin: center;\n  transition: transform 0.18s ease, border-color 0.18s ease;\n}\n.react-list-table-menu-action:hover .react-list-table-menu-chevron,\n.react-list-table-menu-row:hover .react-list-table-menu-chevron {\n  border-color: #6b7280;\n  transform: rotate(135deg);\n}\n.react-list-table-menu-chevron-active {\n  border-color: #6b7280;\n  transform: rotate(135deg);\n}\n");
+var CONTEXT_MENU_SURFACE_STYLE = {
+  padding: 8,
+  background: "#ffffff",
+  boxShadow: "0 8px 24px rgba(15, 23, 42, 0.16)"
+};
+function ReactTableContextMenuView(props) {
+  const { request } = props;
+  if (!request) {
+    return null;
+  }
+  const surfaceStyle = {
+    ...CONTEXT_MENU_SURFACE_STYLE,
+    width: 260,
+    maxHeight: 420,
+    overflow: "auto"
+  };
+  return /* @__PURE__ */ jsx(
+    ReactPopup,
+    {
+      open: true,
+      anchorRect: { x: request.x, y: request.y, width: 0, height: 0 },
+      minWidth: 260,
+      onOpenChange: (open) => {
+        if (!open) {
+          request.onClose();
+        }
+      },
+      surfaceStyle,
+      children: /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(
+          MenuSubmenu,
+          {
+            label: "\u590D\u5236",
+            items: [
+              {
+                key: "copy-cell",
+                label: "\u590D\u5236\u5355\u5143\u683C",
+                onClick: request.onCopyCell
+              },
+              {
+                key: "copy-column",
+                label: "\u590D\u5236\u6574\u5217",
+                onClick: request.onCopyColumn
+              },
+              {
+                key: "copy-row-text",
+                label: "\u590D\u5236\u5F53\u524D\u884C\u6587\u672C",
+                onClick: request.onCopyRowText
+              },
+              {
+                key: "copy-row-json",
+                label: "\u590D\u5236\u5F53\u524D\u884C JSON",
+                onClick: request.onCopyRowJson
+              },
+              {
+                key: "copy-selection",
+                label: "\u590D\u5236\u9009\u533A",
+                onClick: request.onCopySelection
+              }
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(CustomSelectionMenu, { request }),
+        /* @__PURE__ */ jsx(
+          MenuSubmenu,
+          {
+            label: "\u5BFC\u51FA",
+            items: [
+              {
+                key: "export-txt",
+                label: "\u5BFC\u51FA TXT",
+                onClick: request.onExportTxt
+              },
+              {
+                key: "export-csv",
+                label: "\u5BFC\u51FA CSV",
+                onClick: request.onExportCsv
+              },
+              {
+                key: "export-xlsx",
+                label: "\u5BFC\u51FA XLSX",
+                onClick: request.onExportXlsx
+              },
+              {
+                key: "export-json",
+                label: "\u5BFC\u51FA JSON",
+                onClick: request.onExportJson
+              }
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          MenuAction,
+          {
+            label: request.downloadContentLabel ?? "",
+            onClick: request.onDownloadContent
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          MenuAction,
+          {
+            label: request.toggleExpandRowLabel ?? "",
+            onClick: request.onToggleExpandRow
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          MenuAction,
+          {
+            label: "\u53D6\u6D88\u5168\u90E8\u6298\u53E0\u884C",
+            onClick: request.onExpandAllCollapsedRows
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          MenuAction,
+          {
+            label: request.toggleColumnLabel ?? "",
+            onClick: request.onToggleCurrentColumn
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          MenuAction,
+          {
+            label: "\u53D6\u6D88\u5168\u90E8\u6298\u53E0\u5217",
+            onClick: request.onExpandAllCollapsedColumns
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          MenuAction,
+          {
+            label: request.summaryVisible ? "\u9690\u85CF\u6C47\u603B\u680F" : "\u663E\u793A\u6C47\u603B\u680F",
+            onClick: request.onToggleSummary
+          }
+        ),
+        /* @__PURE__ */ jsx(SummaryMenu, { request }),
+        /* @__PURE__ */ jsx(
+          MenuSubmenu,
+          {
+            label: "\u51BB\u7ED3",
+            items: [
+              {
+                key: "freeze-top",
+                label: "\u51BB\u7ED3\u5230\u9876\u90E8",
+                onClick: request.onFreezeRowTop
+              },
+              {
+                key: "freeze-bottom",
+                label: "\u51BB\u7ED3\u5230\u5E95\u90E8",
+                onClick: request.onFreezeRowBottom
+              },
+              {
+                key: "unfreeze",
+                label: "\u53D6\u6D88\u51BB\u7ED3",
+                onClick: request.onUnfreezeRow
+              }
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          MenuSubmenu,
+          {
+            label: "\u91CD\u7F6E",
+            items: [
+              {
+                key: "reset-filter",
+                label: "\u91CD\u7F6E\u7B5B\u9009",
+                onClick: request.onResetFilter
+              },
+              {
+                key: "reset-sort",
+                label: "\u91CD\u7F6E\u6392\u5E8F",
+                onClick: request.onResetSort
+              },
+              {
+                key: "reset-header",
+                label: "\u91CD\u7F6E\u8868\u5934\u914D\u7F6E",
+                onClick: request.onResetHeader
+              }
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          DensityMenu,
+          {
+            value: request.density ?? "middle",
+            onChange: request.onChangeDensity
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ZoomMenu,
+          {
+            value: request.zoom ?? 1,
+            onChange: request.onChangeZoom
+          }
+        ),
+        request.columns?.length && request.onToggleColumn ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(MenuDivider, {}),
+          /* @__PURE__ */ jsx(
+            ColumnVisibilityMenu,
+            {
+              columns: request.columns,
+              onToggle: request.onToggleColumn
+            }
+          )
+        ] }) : null
+      ] })
+    }
+  );
+}
+function MenuAction(props) {
+  const { label, onClick, selected, reserveSelectionIcon } = props;
+  if (!onClick) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      onClick,
+      className: "react-list-table-menu-action",
+      style: {
+        display: "flex",
+        alignItems: "center",
+        width: "100%",
+        height: 32,
+        padding: "0 10px",
+        border: "none",
+        borderRadius: 8,
+        background: "transparent",
+        color: "#374151",
+        textAlign: "left",
+        cursor: "pointer"
+      },
+      children: [
+        reserveSelectionIcon ? /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            style: {
+              width: 16,
+              flex: "0 0 16px",
+              marginRight: 6,
+              textAlign: "center"
+            },
+            children: selected ? "\u2713" : ""
+          }
+        ) : null,
+        /* @__PURE__ */ jsx("span", { children: label })
+      ]
+    }
+  );
+}
+function MenuSubmenu(props) {
+  const { label, items, footer } = props;
+  const menuItems = items.filter((item) => item.onClick);
+  const reserveSelectionIcon = menuItems.some(
+    (item) => typeof item.selected === "boolean"
+  );
+  const triggerRef = useRef(null);
+  const [open, setOpen] = useState(false);
+  const closeTimerRef = useRef(null);
+  if (!menuItems.length && !footer) {
+    return null;
+  }
+  const clearCloseTimer = () => {
+    if (closeTimerRef.current != null) {
+      window.clearTimeout(closeTimerRef.current);
+      closeTimerRef.current = null;
+    }
+  };
+  const scheduleClose = () => {
+    clearCloseTimer();
+    closeTimerRef.current = window.setTimeout(() => {
+      setOpen(false);
+      closeTimerRef.current = null;
+    }, 120);
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      onMouseEnter: () => {
+        clearCloseTimer();
+        setOpen(true);
+      },
+      onMouseLeave: () => {
+        scheduleClose();
+      },
+      children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            ref: triggerRef,
+            type: "button",
+            className: "react-list-table-menu-action react-list-table-menu-action-submenu",
+            style: {
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+              width: "100%",
+              height: 32,
+              padding: "0 10px",
+              border: "none",
+              borderRadius: 8,
+              background: "transparent",
+              color: "#374151",
+              textAlign: "left",
+              cursor: "pointer"
+            },
+            children: [
+              /* @__PURE__ */ jsx("span", { children: label }),
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: `react-list-table-menu-chevron${open ? " react-list-table-menu-chevron-active" : ""}`,
+                  "aria-hidden": "true"
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ReactPopup,
+          {
+            open,
+            anchorRef: triggerRef,
+            placement: "rightTop",
+            offset: 2,
+            minWidth: 220,
+            onOpenChange: setOpen,
+            surfaceStyle: {
+              ...CONTEXT_MENU_SURFACE_STYLE,
+              maxHeight: 360,
+              overflow: "auto"
+            },
+            children: /* @__PURE__ */ jsxs(
+              "div",
+              {
+                onMouseEnter: () => {
+                  clearCloseTimer();
+                },
+                onMouseLeave: () => {
+                  scheduleClose();
+                },
+                children: [
+                  menuItems.map((item) => /* @__PURE__ */ jsx(
+                    MenuAction,
+                    {
+                      label: item.label,
+                      onClick: item.onClick,
+                      selected: item.selected,
+                      reserveSelectionIcon
+                    },
+                    item.key
+                  )),
+                  footer
+                ]
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+function DensityMenu(props) {
+  const { value, onChange } = props;
+  if (!onChange) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    MenuSubmenu,
+    {
+      label: "\u8868\u683C\u5BC6\u5EA6",
+      items: [
+        {
+          key: "density-comfortable",
+          label: "\u5BBD\u677E",
+          selected: value === "comfortable",
+          onClick: () => {
+            onChange("comfortable");
+          }
+        },
+        {
+          key: "density-middle",
+          label: "\u4E2D\u7B49",
+          selected: value === "middle",
+          onClick: () => {
+            onChange("middle");
+          }
+        },
+        {
+          key: "density-compact",
+          label: "\u7D27\u51D1",
+          selected: value === "compact",
+          onClick: () => {
+            onChange("compact");
+          }
+        }
+      ]
+    }
+  );
+}
+var CONTEXT_MENU_ZOOM_MIN = 50;
+var CONTEXT_MENU_ZOOM_MAX = 200;
+var CONTEXT_MENU_ZOOM_STEP = 10;
+function ZoomMenu(props) {
+  const { value, onChange } = props;
+  const triggerRef = useRef(null);
+  const [open, setOpen] = useState(false);
+  const closeTimerRef = useRef(null);
+  if (!onChange) {
+    return null;
+  }
+  const percent = Math.round(value * 100);
+  const clearCloseTimer = () => {
+    if (closeTimerRef.current != null) {
+      window.clearTimeout(closeTimerRef.current);
+      closeTimerRef.current = null;
+    }
+  };
+  const scheduleClose = () => {
+    clearCloseTimer();
+    closeTimerRef.current = window.setTimeout(() => {
+      setOpen(false);
+      closeTimerRef.current = null;
+    }, 120);
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      onMouseEnter: () => {
+        clearCloseTimer();
+        setOpen(true);
+      },
+      onMouseLeave: () => {
+        scheduleClose();
+      },
+      children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            ref: triggerRef,
+            type: "button",
+            className: "react-list-table-menu-action react-list-table-menu-action-submenu",
+            style: {
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+              width: "100%",
+              height: 32,
+              padding: "0 10px",
+              border: "none",
+              borderRadius: 8,
+              background: "transparent",
+              color: "#374151",
+              textAlign: "left",
+              cursor: "pointer"
+            },
+            children: [
+              /* @__PURE__ */ jsx("span", { children: "\u7F29\u653E" }),
+              /* @__PURE__ */ jsxs(
+                "span",
+                {
+                  style: {
+                    display: "inline-flex",
+                    alignItems: "center",
+                    gap: 8,
+                    color: "#6b7280",
+                    fontSize: 12
+                  },
+                  children: [
+                    /* @__PURE__ */ jsxs("span", { children: [
+                      percent,
+                      "%"
+                    ] }),
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        className: `react-list-table-menu-chevron${open ? " react-list-table-menu-chevron-active" : ""}`,
+                        "aria-hidden": "true"
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ReactPopup,
+          {
+            open,
+            anchorRef: triggerRef,
+            placement: "rightTop",
+            offset: 2,
+            minWidth: 220,
+            onOpenChange: setOpen,
+            surfaceStyle: {
+              ...CONTEXT_MENU_SURFACE_STYLE,
+              width: 220
+            },
+            children: /* @__PURE__ */ jsxs(
+              "div",
+              {
+                onMouseEnter: () => {
+                  clearCloseTimer();
+                },
+                onMouseLeave: () => {
+                  scheduleClose();
+                },
+                style: {
+                  display: "flex",
+                  flexDirection: "column",
+                  gap: 8,
+                  padding: "4px 2px"
+                },
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      style: {
+                        color: "#6b7280",
+                        fontSize: 12,
+                        padding: "0 8px"
+                      },
+                      children: "\u8868\u683C\u7F29\u653E\uFF0850% - 200%\uFF09"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("div", { style: { padding: "0 8px 4px" }, children: /* @__PURE__ */ jsx(
+                    ReactInputNumber,
+                    {
+                      value: percent,
+                      min: CONTEXT_MENU_ZOOM_MIN,
+                      max: CONTEXT_MENU_ZOOM_MAX,
+                      step: CONTEXT_MENU_ZOOM_STEP,
+                      precision: 0,
+                      addonAfter: "%",
+                      onChange: (next) => {
+                        if (next == null || !Number.isFinite(next)) {
+                          return;
+                        }
+                        onChange(Math.round(next) / 100);
+                      }
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      disabled: percent === 100,
+                      onClick: () => {
+                        onChange(1);
+                      },
+                      className: "react-list-table-menu-action",
+                      style: {
+                        display: "block",
+                        width: "100%",
+                        height: 32,
+                        padding: "0 8px",
+                        border: "none",
+                        borderRadius: 8,
+                        background: "transparent",
+                        color: percent === 100 ? "#9ca3af" : "#374151",
+                        textAlign: "left",
+                        cursor: percent === 100 ? "not-allowed" : "pointer"
+                      },
+                      children: "\u91CD\u7F6E\u7F29\u653E"
+                    }
+                  )
+                ]
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+function ColumnVisibilityMenu(props) {
+  const { columns, onToggle } = props;
+  const triggerRef = useRef(null);
+  const [open, setOpen] = useState(false);
+  const closeTimerRef = useRef(null);
+  const clearCloseTimer = () => {
+    if (closeTimerRef.current != null) {
+      window.clearTimeout(closeTimerRef.current);
+      closeTimerRef.current = null;
+    }
+  };
+  const scheduleClose = () => {
+    clearCloseTimer();
+    closeTimerRef.current = window.setTimeout(() => {
+      setOpen(false);
+      closeTimerRef.current = null;
+    }, 120);
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      onMouseEnter: () => {
+        clearCloseTimer();
+        setOpen(true);
+      },
+      onMouseLeave: () => {
+        scheduleClose();
+      },
+      children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            ref: triggerRef,
+            type: "button",
+            className: "react-list-table-menu-action react-list-table-menu-action-submenu",
+            style: {
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+              width: "100%",
+              height: 32,
+              padding: "0 10px",
+              border: "none",
+              borderRadius: 8,
+              background: "transparent",
+              color: "#374151",
+              textAlign: "left",
+              cursor: "pointer"
+            },
+            children: [
+              /* @__PURE__ */ jsx("span", { children: "\u5217\u663E\u793A" }),
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: `react-list-table-menu-chevron${open ? " react-list-table-menu-chevron-active" : ""}`,
+                  "aria-hidden": "true"
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ReactPopup,
+          {
+            open,
+            anchorRef: triggerRef,
+            placement: "rightTop",
+            offset: 2,
+            minWidth: 220,
+            onOpenChange: setOpen,
+            surfaceStyle: {
+              ...CONTEXT_MENU_SURFACE_STYLE,
+              maxHeight: 360,
+              overflow: "auto"
+            },
+            children: /* @__PURE__ */ jsx(
+              "div",
+              {
+                onMouseEnter: () => {
+                  clearCloseTimer();
+                },
+                onMouseLeave: () => {
+                  scheduleClose();
+                },
+                children: columns.map((column) => /* @__PURE__ */ jsx(
+                  ColumnVisibilityItem,
+                  {
+                    item: column,
+                    onToggle
+                  },
+                  column.key
+                ))
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+function ColumnVisibilityItem(props) {
+  const { item, onToggle } = props;
+  const triggerRef = useRef(null);
+  const [open, setOpen] = useState(false);
+  const closeTimerRef = useRef(null);
+  const hasChildren = !!item.children?.length;
+  const clearCloseTimer = () => {
+    if (closeTimerRef.current != null) {
+      window.clearTimeout(closeTimerRef.current);
+      closeTimerRef.current = null;
+    }
+  };
+  const scheduleClose = () => {
+    clearCloseTimer();
+    closeTimerRef.current = window.setTimeout(() => {
+      setOpen(false);
+      closeTimerRef.current = null;
+    }, 120);
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: triggerRef,
+      className: "react-list-table-menu-row",
+      onMouseEnter: () => {
+        if (hasChildren) {
+          clearCloseTimer();
+          setOpen(true);
+        }
+      },
+      onMouseLeave: () => {
+        if (hasChildren) {
+          scheduleClose();
+        }
+      },
+      style: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "space-between",
+        gap: 8,
+        minHeight: 32,
+        padding: "0 10px",
+        borderRadius: 8,
+        color: item.disabled ? "#9ca3af" : "#374151",
+        fontSize: 14
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          ReactCheckbox,
+          {
+            checked: item.checked,
+            disabled: item.disabled,
+            indeterminate: !!item.indeterminate,
+            onChange: (event) => {
+              onToggle(item.key, !!event.target.checked);
+            },
+            children: item.title
+          }
+        ),
+        hasChildren ? /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: `react-list-table-menu-chevron${open ? " react-list-table-menu-chevron-active" : ""}`,
+            "aria-hidden": "true"
+          }
+        ) : null,
+        hasChildren ? /* @__PURE__ */ jsx(
+          ReactPopup,
+          {
+            open,
+            anchorRef: triggerRef,
+            placement: "rightTop",
+            offset: 2,
+            minWidth: 220,
+            onOpenChange: setOpen,
+            surfaceStyle: {
+              ...CONTEXT_MENU_SURFACE_STYLE,
+              maxHeight: 320,
+              overflow: "auto"
+            },
+            children: /* @__PURE__ */ jsx(
+              "div",
+              {
+                onMouseEnter: () => {
+                  clearCloseTimer();
+                },
+                onMouseLeave: () => {
+                  scheduleClose();
+                },
+                children: item.children.map((child) => /* @__PURE__ */ jsx(
+                  ColumnVisibilityItem,
+                  {
+                    item: child,
+                    onToggle
+                  },
+                  child.key
+                ))
+              }
+            )
+          }
+        ) : null
+      ]
+    }
+  );
+}
+function MenuDivider() {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: {
+        height: 1,
+        margin: "6px 0",
+        background: "#f0f0f0"
+      }
+    }
+  );
+}
+function CustomSelectionMenu(props) {
+  const { request } = props;
+  const triggerRef = useRef(null);
+  const [open, setOpen] = useState(false);
+  const initial = request.customSelection ?? {
+    startRow: 1,
+    startColumn: 1,
+    endRow: 1,
+    endColumn: 1,
+    rowCount: 0,
+    columnCount: 0
+  };
+  const [range, setRange] = useState(initial);
+  if (!request.onCopyCustomSelection || !request.customSelection) {
+    return null;
+  }
+  const update = (key, value) => {
+    setRange((current) => ({
+      ...current,
+      [key]: value == null ? 1 : Math.floor(value)
+    }));
+  };
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        ref: triggerRef,
+        type: "button",
+        className: "react-list-table-menu-action",
+        style: {
+          display: "flex",
+          alignItems: "center",
+          width: "100%",
+          height: 32,
+          padding: "0 10px",
+          border: "none",
+          borderRadius: 8,
+          background: "transparent",
+          color: "#374151",
+          textAlign: "left",
+          cursor: "pointer"
+        },
+        onClick: () => setOpen((value) => !value),
+        children: /* @__PURE__ */ jsx("span", { children: "\u590D\u5236\u81EA\u5B9A\u4E49\u9009\u533A" })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ReactPopup,
+      {
+        open,
+        anchorRef: triggerRef,
+        placement: "rightTop",
+        offset: 2,
+        minWidth: 250,
+        onOpenChange: setOpen,
+        surfaceStyle: { ...CONTEXT_MENU_SURFACE_STYLE, width: 250 },
+        children: /* @__PURE__ */ jsxs("div", { style: { padding: 6 }, children: [
+          /* @__PURE__ */ jsx("div", { style: { color: "#6b7280", fontSize: 12, marginBottom: 6 }, children: "\u8F93\u5165\u8D77\u59CB\u4F4D\u7F6E\u548C\u7ED3\u675F\u4F4D\u7F6E" }),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              style: {
+                display: "grid",
+                gridTemplateColumns: "38px 1fr 1fr",
+                gap: 6,
+                marginBottom: 4,
+                color: "#6b7280",
+                fontSize: 12,
+                textAlign: "center"
+              },
+              children: [
+                /* @__PURE__ */ jsx("span", {}),
+                /* @__PURE__ */ jsx("span", { children: "\u884C" }),
+                /* @__PURE__ */ jsx("span", { children: "\u5217" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            CustomSelectionRow,
+            {
+              label: "\u8D77\u59CB",
+              row: range.startRow,
+              column: range.startColumn,
+              onRowChange: (value) => update("startRow", value),
+              onColumnChange: (value) => update("startColumn", value)
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            CustomSelectionRow,
+            {
+              label: "\u7ED3\u675F",
+              row: range.endRow,
+              column: range.endColumn,
+              onRowChange: (value) => update("endRow", value),
+              onColumnChange: (value) => update("endColumn", value)
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "react-list-table-custom-selection-copy",
+              style: {
+                display: "block",
+                width: "100%",
+                height: 32,
+                marginTop: 6,
+                border: "none",
+                borderRadius: 8,
+                background: "#1677ff",
+                color: "#fff",
+                cursor: "pointer"
+              },
+              onClick: () => {
+                request.onCopyCustomSelection?.({
+                  startRow: Math.max(range.startRow, 1),
+                  startColumn: Math.max(range.startColumn, 1),
+                  endRow: Math.max(range.endRow, 1),
+                  endColumn: Math.max(range.endColumn, 1)
+                });
+                setOpen(false);
+              },
+              children: "\u590D\u5236"
+            }
+          )
+        ] })
+      }
+    )
+  ] });
+}
+function CustomSelectionRow(props) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: {
+        display: "grid",
+        gridTemplateColumns: "38px 1fr 1fr",
+        gap: 6,
+        alignItems: "center",
+        marginBottom: 6
+      },
+      children: [
+        /* @__PURE__ */ jsx("span", { style: { color: "#374151", fontSize: 12 }, children: props.label }),
+        /* @__PURE__ */ jsx(
+          ReactInputNumber,
+          {
+            className: "react-list-table-custom-selection-input",
+            value: props.row,
+            min: 1,
+            step: 1,
+            precision: 0,
+            placeholder: "\u884C",
+            onChange: props.onRowChange
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ReactInputNumber,
+          {
+            className: "react-list-table-custom-selection-input",
+            value: props.column,
+            min: 1,
+            step: 1,
+            precision: 0,
+            placeholder: "\u5217",
+            onChange: props.onColumnChange
+          }
+        )
+      ]
+    }
+  );
+}
+function SummaryMenu(props) {
+  const { request } = props;
+  const [precision, setPrecision] = useState(
+    request.summaryPrecision ?? null
+  );
+  useEffect(() => {
+    setPrecision(request.summaryPrecision ?? null);
+  }, [request.summaryColumnKey, request.summaryPrecision]);
+  if (!request.summaryColumnKey) {
+    return null;
+  }
+  const summaryTypes = [
+    { key: "sum", label: "\u6C42\u548C", value: "sum" },
+    { key: "avg", label: "\u5E73\u5747\u503C", value: "avg" },
+    { key: "count", label: "\u8BA1\u6570", value: "count" },
+    { key: "unionCount", label: "\u53BB\u91CD\u8BA1\u6570", value: "unionCount" },
+    { key: "rowCount", label: "\u884C\u6570", value: "rowCount" },
+    { key: "mergedRowCount", label: "\u5408\u5E76\u884C\u6570", value: "mergedRowCount" },
+    { key: "min", label: "\u6700\u5C0F\u503C", value: "min" },
+    { key: "max", label: "\u6700\u5927\u503C", value: "max" }
+  ];
+  return /* @__PURE__ */ jsx(
+    MenuSubmenu,
+    {
+      label: "\u6C47\u603B\u65B9\u5F0F",
+      items: summaryTypes.map((item) => ({
+        key: item.key,
+        label: item.label,
+        selected: request.summaryType === item.value,
+        onClick: () => request.onChangeSummaryType?.(item.value)
+      })),
+      footer: request.onChangeSummaryPrecision ? /* @__PURE__ */ jsxs(
+        "div",
+        {
+          style: {
+            display: "grid",
+            gridTemplateColumns: "72px 1fr",
+            gap: 8,
+            alignItems: "center",
+            marginTop: 4,
+            padding: "10px 10px 2px",
+            borderTop: "1px solid #e5e7eb"
+          },
+          children: [
+            /* @__PURE__ */ jsx("span", { style: { color: "#374151", fontSize: 13 }, children: "\u5C0F\u6570\u4F4D\u6570" }),
+            /* @__PURE__ */ jsx(
+              ReactInputNumber,
+              {
+                value: precision,
+                min: 0,
+                max: 20,
+                step: 1,
+                precision: 0,
+                placeholder: "\u9ED8\u8BA4",
+                onChange: setPrecision,
+                onCommit: (value) => {
+                  request.onChangeSummaryPrecision?.(value ?? void 0);
+                }
+              }
+            )
+          ]
+        }
+      ) : void 0
+    }
+  );
+}
+
+// src/features/editor/utils.ts
+function toNumberValue(value) {
+  if (typeof value === "number" && Number.isFinite(value)) {
+    return value;
+  }
+  if (typeof value === "string" && value.trim().length > 0) {
+    const nextValue = Number(value);
+    return Number.isFinite(nextValue) ? nextValue : null;
+  }
+  return null;
+}
+function toNumericProp(value) {
+  if (typeof value === "number") {
+    return value;
+  }
+  if (typeof value === "string" && value.trim().length > 0) {
+    const nextValue = Number(value);
+    return Number.isFinite(nextValue) ? nextValue : void 0;
+  }
+  return void 0;
+}
+function resolvePadding(value, fallback = 0) {
+  return typeof value === "number" && Number.isFinite(value) && value >= 0 ? value : fallback;
+}
+function resolveEditorControlSize(request) {
+  const targetRect = request.hostRect ?? request.rect;
+  const height = Math.max(targetRect.height - 2, 1);
+  const fontSize = typeof request.theme.fontSize === "number" && Number.isFinite(request.theme.fontSize) && request.theme.fontSize > 0 ? request.theme.fontSize : void 0;
+  const paddingInline = resolvePadding(request.theme.paddingInline);
+  const paddingBlock = resolvePadding(request.theme.paddingBlock);
+  const contentZoom = typeof request.theme.contentZoom === "number" && Number.isFinite(request.theme.contentZoom) && request.theme.contentZoom > 0 ? request.theme.contentZoom : 1;
+  return { height, fontSize, paddingInline, paddingBlock, contentZoom };
+}
+function getEditorInputStyle(request) {
+  const { height, fontSize, paddingInline, paddingBlock, contentZoom } = resolveEditorControlSize(request);
+  return {
+    width: "100%",
+    height,
+    minHeight: height,
+    color: request.theme.cellColor ?? request.theme.textColor,
+    fontFamily: request.theme.fontFamily,
+    fontSize,
+    // 用像素 token，确保 select/time/color 触发器与内部 Input 同步缩放。
+    ["--canvas-react-control-height"]: `${height}px`,
+    ["--canvas-react-font-size"]: fontSize != null ? `${fontSize}px` : void 0,
+    ["--canvas-react-control-padding-inline"]: `${paddingInline}px`,
+    ["--canvas-react-control-padding-block"]: `${paddingBlock}px`,
+    ["--canvas-react-content-zoom"]: String(contentZoom),
+    boxSizing: "border-box"
+  };
+}
+function resolveEditorOverlayStyle(params) {
+  const { rect, hostRect, fontSize, paddingInline, paddingBlock, contentZoom } = params;
+  const targetRect = hostRect ?? rect;
+  const height = Math.max(targetRect.height - 2, 1);
+  const resolvedFontSize = typeof fontSize === "number" && Number.isFinite(fontSize) && fontSize > 0 ? fontSize : void 0;
+  const resolvedPaddingInline = resolvePadding(paddingInline);
+  const resolvedPaddingBlock = resolvePadding(paddingBlock);
+  const resolvedContentZoom = typeof contentZoom === "number" && Number.isFinite(contentZoom) && contentZoom > 0 ? contentZoom : 1;
+  return {
+    position: hostRect ? "absolute" : "fixed",
+    left: targetRect.x,
+    top: targetRect.y + 1,
+    width: Math.max(targetRect.width, 1),
+    height,
+    minHeight: height,
+    zIndex: 1200,
+    boxSizing: "border-box",
+    // 覆盖表单组件 token，使输入框高度/字号/内边距跟随表格缩放。
+    ["--canvas-react-control-height"]: `${height}px`,
+    ["--canvas-react-control-padding-inline"]: `${resolvedPaddingInline}px`,
+    ["--canvas-react-control-padding-block"]: `${resolvedPaddingBlock}px`,
+    ["--canvas-react-content-zoom"]: String(resolvedContentZoom),
+    ...resolvedFontSize != null ? {
+      ["--canvas-react-font-size"]: `${resolvedFontSize}px`,
+      fontSize: resolvedFontSize
+    } : null
+  };
+}
+function ReactTableEditorOverlay(props) {
+  const { request } = props;
+  const editorHostRef = useRef(null);
+  const style = resolveEditorOverlayStyle({
+    rect: request.rect,
+    hostRect: request.hostRect,
+    fontSize: request.theme.fontSize,
+    paddingInline: request.theme.paddingInline,
+    paddingBlock: request.theme.paddingBlock,
+    contentZoom: request.theme.contentZoom
+  });
+  const contentZoom = typeof request.theme.contentZoom === "number" && Number.isFinite(request.theme.contentZoom) && request.theme.contentZoom > 0 ? request.theme.contentZoom : 1;
+  useLayoutEffect(() => {
+    const input = editorHostRef.current?.querySelector("input");
+    if (!input) {
+      return;
+    }
+    focusAndSelectEditorInput(input);
+  }, [request]);
+  return /* @__PURE__ */ jsx(ReactContentScaleProvider, { scale: contentZoom, children: /* @__PURE__ */ jsx("div", { ref: editorHostRef, children: renderEditorByType(request, style) }, request.editorKey) });
+}
+function renderEditorByType(request, style) {
+  switch (request.config.valueType ?? "text") {
+    case "number":
+      return /* @__PURE__ */ jsx(NumberEditor, { request, style });
+    case "input-range":
+      return /* @__PURE__ */ jsx(InputRangeEditor, { request, style });
+    case "year":
+      return /* @__PURE__ */ jsx(YearEditor, { request, style });
+    case "quarter":
+      return /* @__PURE__ */ jsx(QuarterEditor, { request, style });
+    case "month":
+      return /* @__PURE__ */ jsx(MonthEditor, { request, style });
+    case "date":
+      return /* @__PURE__ */ jsx(DateEditor, { request, style });
+    case "date-range":
+      return /* @__PURE__ */ jsx(DateRangeEditor, { request, style });
+    case "time":
+      return /* @__PURE__ */ jsx(TimeEditor, { request, style });
+    case "datetime":
+      return /* @__PURE__ */ jsx(DateTimeEditor, { request, style });
+    case "datetime-range":
+      return /* @__PURE__ */ jsx(DateTimeRangeEditor, { request, style });
+    case "timerange":
+      return /* @__PURE__ */ jsx(TimeRangeEditor, { request, style });
+    case "color":
+      return /* @__PURE__ */ jsx(ColorEditor, { request, style });
+    case "select":
+      return /* @__PURE__ */ jsx(SelectEditor, { request, style });
+    case "auto-complete":
+      return /* @__PURE__ */ jsx(AutoCompleteEditor, { request, style });
+    default:
+      return /* @__PURE__ */ jsx(TextEditor, { request, style });
+  }
+}
+function TextEditor(props) {
+  const { request, style } = props;
+  const [value, setValue] = useState(String(request.value ?? ""));
+  const hostRef = useRef(null);
+  const skipBlurCommitRef = useRef(false);
+  useLayoutEffect(() => {
+    const input = hostRef.current?.querySelector("input");
+    focusAndSelectEditorInput(input);
+  }, [request]);
+  useEffect(() => {
+    setValue(String(request.value ?? ""));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { ref: hostRef, style, children: /* @__PURE__ */ jsx(
+    ReactInput,
+    {
+      value,
+      placeholder: request.config.placeholder ?? "",
+      onChange: (event) => {
+        const nextValue = event.target.value;
+        setValue(nextValue);
+        request.onChange(nextValue);
+      },
+      onPressEnter: () => {
+        request.onCommit({ restoreTableFocus: true });
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function NumberEditor(props) {
+  const { request, style } = props;
+  const [value, setValue] = useState(
+    toNumberValue(request.value)
+  );
+  const hostRef = useRef(null);
+  const skipBlurCommitRef = useRef(false);
+  useLayoutEffect(() => {
+    const input = hostRef.current?.querySelector("input");
+    focusAndSelectEditorInput(input);
+  }, [request]);
+  useEffect(() => {
+    setValue(toNumberValue(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { ref: hostRef, style, children: /* @__PURE__ */ jsx(
+    ReactNumberInput,
+    {
+      value,
+      min: toNumericProp(request.config.min),
+      max: toNumericProp(request.config.max),
+      step: toNumericProp(request.config.step),
+      onChange: (nextValue) => {
+        setValue(nextValue);
+        request.onChange(nextValue);
+      },
+      onPressEnter: () => {
+        request.onCommit({ restoreTableFocus: true });
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function InputRangeEditor(props) {
+  const { request, style } = props;
+  const [value, setValue] = useState(
+    toNumberRangeTuple(request.value)
+  );
+  const skipBlurCommitRef = useRef(false);
+  useEffect(() => {
+    setValue(toNumberRangeTuple(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { "data-list-table-range-editor": true, style, children: /* @__PURE__ */ jsx(
+    ReactInputRange,
+    {
+      value,
+      autoFocus: true,
+      min: toNumericProp(request.config.min),
+      max: toNumericProp(request.config.max),
+      step: toNumericProp(request.config.step),
+      rangeSeparator: request.config.rangeSeparator,
+      onChange: (nextValue) => {
+        setValue(nextValue);
+        request.onChange(nextValue);
+      },
+      onPressEnter: () => {
+        request.onCommit({ restoreTableFocus: true });
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleRangeInputTab(event)) {
+          return;
+        }
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function YearEditor(props) {
+  const { request, style } = props;
+  const [value, setValue] = useState(
+    request.value == null ? "" : String(request.value)
+  );
+  const skipBlurCommitRef = useRef(false);
+  useEffect(() => {
+    setValue(request.value == null ? "" : String(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { style, children: /* @__PURE__ */ jsx(
+    ReactYearPicker,
+    {
+      value,
+      autoFocus: true,
+      allowClear: false,
+      showArrow: false,
+      onChange: (nextValue) => {
+        setValue(nextValue);
+        request.onChange(nextValue);
+        request.onCommit();
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function QuarterEditor(props) {
+  const { request, style } = props;
+  const [value, setValue] = useState(
+    request.value == null ? "" : String(request.value)
+  );
+  const skipBlurCommitRef = useRef(false);
+  useEffect(() => {
+    setValue(request.value == null ? "" : String(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { style, children: /* @__PURE__ */ jsx(
+    ReactQuarterPicker,
+    {
+      value,
+      autoFocus: true,
+      allowClear: false,
+      showArrow: false,
+      onChange: (nextValue) => {
+        setValue(nextValue);
+        request.onChange(nextValue);
+        request.onCommit();
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function MonthEditor(props) {
+  const { request, style } = props;
+  const [value, setValue] = useState(
+    request.value == null ? "" : String(request.value)
+  );
+  const skipBlurCommitRef = useRef(false);
+  useEffect(() => {
+    setValue(request.value == null ? "" : String(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { style, children: /* @__PURE__ */ jsx(
+    ReactMonthPicker,
+    {
+      value,
+      autoFocus: true,
+      allowClear: false,
+      showArrow: false,
+      onChange: (nextValue) => {
+        setValue(nextValue);
+        request.onChange(nextValue);
+        request.onCommit();
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function DateEditor(props) {
+  const { request, style } = props;
+  const [value, setValue] = useState(
+    request.value == null ? "" : String(request.value)
+  );
+  const skipBlurCommitRef = useRef(false);
+  useEffect(() => {
+    setValue(request.value == null ? "" : String(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { style, children: /* @__PURE__ */ jsx(
+    ReactDatePicker,
+    {
+      value,
+      autoFocus: true,
+      allowClear: false,
+      showArrow: false,
+      onChange: (nextValue) => {
+        setValue(nextValue);
+        request.onChange(nextValue);
+        request.onCommit();
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function SelectEditor(props) {
+  const { request, style } = props;
+  const options = request.config.options ?? [];
+  const [value, setValue] = useState(
+    request.value == null ? void 0 : String(request.value)
+  );
+  const skipBlurCommitRef = useRef(false);
+  useEffect(() => {
+    setValue(request.value == null ? void 0 : String(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { style, children: /* @__PURE__ */ jsx(
+    ReactSelect,
+    {
+      value,
+      autoFocus: true,
+      showArrow: false,
+      showSearch: request.config.showSearch,
+      filterOption: request.config.filterOption,
+      options,
+      onChange: (nextValue, info) => {
+        const resolvedValue = String(nextValue);
+        setValue(resolvedValue);
+        request.onChange(
+          options.find((option) => String(option.value) === resolvedValue)?.value ?? resolvedValue
+        );
+        if (info.trigger === "mouse") {
+          request.onCommit();
+        }
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function AutoCompleteEditor(props) {
+  const { request, style } = props;
+  const [value, setValue] = useState(
+    request.value == null ? "" : String(request.value)
+  );
+  const [options, setOptions] = useState(request.config.options ?? []);
+  const skipBlurCommitRef = useRef(false);
+  useEffect(() => {
+    setValue(request.value == null ? "" : String(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { style, children: /* @__PURE__ */ jsx(
+    ReactAutoComplete,
+    {
+      value,
+      autoFocus: true,
+      showArrow: false,
+      options,
+      placeholder: request.config.placeholder ?? "",
+      onChange: (nextValue, info) => {
+        setValue(nextValue);
+        request.onChange(nextValue);
+        if (info.trigger === "mouse") {
+          request.onCommit();
+        }
+      },
+      onPressEnter: async (input) => {
+        const nextOptions = await request.config.onPressEnter?.(input);
+        if (nextOptions) {
+          setOptions(nextOptions);
+        }
+        return nextOptions;
+      },
+      onBlur: () => {
+        if (!skipBlurCommitRef.current) request.onCommit();
+        skipBlurCommitRef.current = false;
+      },
+      onKeyDown: (event) => {
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function ColorEditor(props) {
+  const { request, style } = props;
+  const [value, setValue] = useState(
+    request.value == null ? "" : String(request.value)
+  );
+  const skipBlurCommitRef = useRef(false);
+  useEffect(() => {
+    setValue(request.value == null ? "" : String(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { style, children: /* @__PURE__ */ jsx(
+    ReactColorPicker,
+    {
+      value,
+      autoFocus: true,
+      showArrow: false,
+      onChange: (nextValue) => {
+        setValue(nextValue);
+        request.onChange(nextValue);
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function DateRangeEditor(props) {
+  const { request, style } = props;
+  const separator = request.config.rangeSeparator ?? " ~ ";
+  const [value, setValue] = useState(
+    toRangeTuple(request.value)
+  );
+  const skipBlurCommitRef = useRef(false);
+  useEffect(() => {
+    setValue(toRangeTuple(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { "data-list-table-range-editor": true, style, children: /* @__PURE__ */ jsx(
+    ReactDateRangePicker,
+    {
+      value,
+      autoFocus: true,
+      allowClear: false,
+      showArrow: false,
+      rangeSeparator: separator,
+      onChange: (nextValue) => {
+        setValue(nextValue);
+        request.onChange(nextValue);
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleRangeInputTab(event)) {
+          return;
+        }
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function TimeEditor(props) {
+  const { request, style } = props;
+  const [value, setValue] = useState(
+    request.value == null ? "" : String(request.value)
+  );
+  const skipBlurCommitRef = useRef(false);
+  useEffect(() => {
+    setValue(request.value == null ? "" : String(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { style, children: /* @__PURE__ */ jsx(
+    ReactTimePicker,
+    {
+      value,
+      autoFocus: true,
+      allowClear: false,
+      showArrow: false,
+      onChange: (nextValue) => {
+        setValue(nextValue);
+        request.onChange(nextValue);
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function DateTimeEditor(props) {
+  const { request, style } = props;
+  const [value, setValue] = useState(
+    request.value == null ? "" : String(request.value)
+  );
+  const skipBlurCommitRef = useRef(false);
+  useEffect(() => {
+    setValue(request.value == null ? "" : String(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { style, children: /* @__PURE__ */ jsx(
+    ReactDateTimePicker,
+    {
+      value,
+      autoFocus: true,
+      allowClear: false,
+      showArrow: false,
+      onChange: (nextValue) => {
+        setValue(nextValue);
+        request.onChange(nextValue);
+        request.onCommit();
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function DateTimeRangeEditor(props) {
+  const { request, style } = props;
+  const separator = request.config.rangeSeparator ?? " ~ ";
+  const [value, setValue] = useState(
+    toRangeTuple(request.value)
+  );
+  const skipBlurCommitRef = useRef(false);
+  useEffect(() => {
+    setValue(toRangeTuple(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { "data-list-table-range-editor": true, style, children: /* @__PURE__ */ jsx(
+    ReactDateTimeRangePicker,
+    {
+      value,
+      autoFocus: true,
+      allowClear: false,
+      showArrow: false,
+      rangeSeparator: separator,
+      onChange: (nextValue) => {
+        setValue(nextValue);
+        request.onChange(nextValue);
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleRangeInputTab(event)) {
+          return;
+        }
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function TimeRangeEditor(props) {
+  const { request, style } = props;
+  const separator = request.config.rangeSeparator ?? " ~ ";
+  const [value, setValue] = useState(
+    toRangeTuple(request.value)
+  );
+  const skipBlurCommitRef = useRef(false);
+  useEffect(() => {
+    setValue(toRangeTuple(request.value));
+  }, [request.value]);
+  return /* @__PURE__ */ jsx("div", { "data-list-table-range-editor": true, style, children: /* @__PURE__ */ jsx(
+    ReactTimeRangePicker,
+    {
+      value,
+      autoFocus: true,
+      showArrow: false,
+      rangeSeparator: separator,
+      onChange: (nextValue) => {
+        setValue(nextValue);
+        request.onChange(nextValue);
+      },
+      onBlur: (event) => {
+        handleEditorBlur(event, skipBlurCommitRef, request);
+      },
+      onKeyDown: (event) => {
+        if (handleRangeInputTab(event)) {
+          return;
+        }
+        if (handleEditorNavigationKey(event, request, skipBlurCommitRef)) {
+          return;
+        }
+        handleEditorEscapeKey(event, request);
+      },
+      style: getEditorInputStyle(request)
+    }
+  ) });
+}
+function handleEditorNavigationKey(event, request, skipBlurCommitRef) {
+  const direction = resolveNavigationDirection(event);
+  if (!direction || !request.onNavigate) {
+    return false;
+  }
+  event.preventDefault();
+  skipBlurCommitRef.current = true;
+  request.onNavigate(direction);
+  return true;
+}
+function handleRangeInputTab(event) {
+  if (event.key !== "Tab") {
+    return false;
+  }
+  const host = event.currentTarget.closest(
+    "[data-list-table-range-editor]"
+  );
+  const inputs = Array.from(
+    host?.querySelectorAll("input") ?? []
+  );
+  const currentIndex = inputs.indexOf(event.currentTarget);
+  const nextIndex = event.shiftKey ? currentIndex - 1 : currentIndex + 1;
+  const nextInput = inputs[nextIndex];
+  if (!nextInput) {
+    return false;
+  }
+  event.preventDefault();
+  focusAndSelectEditorInput(nextInput);
+  return true;
+}
+function focusAndSelectEditorInput(input) {
+  if (!input) {
+    return;
+  }
+  input.focus();
+  try {
+    input.select();
+  } catch {
+  }
+}
+function handleEditorEscapeKey(event, request) {
+  if (event.key !== "Escape") {
+    return;
+  }
+  event.preventDefault();
+  request.onCancel();
+}
+function toRangeTuple(value) {
+  if (!Array.isArray(value)) {
+    return ["", ""];
+  }
+  return [String(value[0] ?? ""), String(value[1] ?? "")];
+}
+function toNumberRangeTuple(value) {
+  if (!Array.isArray(value)) {
+    return [null, null];
+  }
+  return [toNumberValue(value[0]), toNumberValue(value[1])];
+}
+function handleEditorBlur(_event, skipBlurCommitRef, request) {
+  if (skipBlurCommitRef.current) {
+    skipBlurCommitRef.current = false;
+    return;
+  }
+  request.onCommit();
+}
+function resolveNavigationDirection(event) {
+  if (event.key === "ArrowUp") {
+    return "up";
+  }
+  if (event.key === "ArrowDown") {
+    return "down";
+  }
+  if (event.key === "Tab") {
+    return event.shiftKey ? "prev" : "next";
+  }
+  return null;
+}
+function ReactTableFixedPopupView(props) {
+  const { request } = props;
+  if (!request) {
+    return null;
+  }
+  const surfaceStyle = {
+    minWidth: 160,
+    padding: 8
+  };
+  return /* @__PURE__ */ jsx(
+    ReactPopup,
+    {
+      open: true,
+      anchorRect: request.anchorRect,
+      offset: 8,
+      minWidth: 160,
+      onOpenChange: (open) => {
+        if (!open) {
+          request.onClose();
+        }
+      },
+      surfaceStyle,
+      children: /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(
+          PopupAction,
+          {
+            active: request.currentFixed === "left",
+            onClick: () => request.onSelect("left"),
+            children: "\u56FA\u5B9A\u5230\u5DE6\u4FA7"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          PopupAction,
+          {
+            active: request.currentFixed === "right",
+            onClick: () => request.onSelect("right"),
+            children: "\u56FA\u5B9A\u5230\u53F3\u4FA7"
+          }
+        ),
+        /* @__PURE__ */ jsx(PopupAction, { onClick: () => request.onSelect("none"), children: "\u53D6\u6D88\u56FA\u5B9A" })
+      ] })
+    }
+  );
+}
+function PopupAction(props) {
+  const { active = false, onClick, children } = props;
+  const [hovered, setHovered] = useState(false);
+  const backgroundColor = active ? hovered ? "#bae0ff" : "#e6f4ff" : hovered ? "#f5faff" : "transparent";
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick,
+      onMouseEnter: () => {
+        setHovered(true);
+      },
+      onMouseLeave: () => {
+        setHovered(false);
+      },
+      style: {
+        display: "block",
+        width: "100%",
+        height: 32,
+        marginBottom: 4,
+        border: "none",
+        borderRadius: 8,
+        background: backgroundColor,
+        color: active ? "#1677ff" : "#374151",
+        textAlign: "left",
+        padding: "0 10px",
+        cursor: "pointer"
+      },
+      children
+    }
+  );
+}
+function ReactTableFilterPanelView(props) {
+  return /* @__PURE__ */ jsx(
+    ReactFilterPanel,
+    {
+      request: props.request
+    }
+  );
+}
+function ReactTablePaginationView(props) {
+  const { config } = props;
+  if (!config) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: {
+        position: "absolute",
+        right: 0,
+        bottom: 0,
+        display: "flex",
+        justifyContent: "flex-end",
+        paddingTop: 12
+      },
+      children: /* @__PURE__ */ jsx(
+        ReactPagination,
+        {
+          current: config.current,
+          total: config.total,
+          pageSize: config.pageSize,
+          pageSizeOptions: config.pageSizeOptions,
+          disabled: config.disabled,
+          showSizeChanger: config.showSizeChanger,
+          showQuickJumper: config.showQuickJumper,
+          showLessItems: config.showLessItems,
+          simple: config.simple,
+          showTotal: config.showTotal,
+          onChange: (page, pageSize) => {
+            config.onChange?.(page, pageSize);
+          },
+          onPageSizeChange: (page, pageSize) => {
+            config.onPageSizeChange?.(page, pageSize);
+          }
+        }
+      )
+    }
+  );
+}
+function ReactTableDangerConfirmView(props) {
+  const { request, onClose } = props;
+  const confirmingRef = useRef(false);
+  useEffect(() => {
+    confirmingRef.current = false;
+  }, [request]);
+  if (!request) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    ReactPopconfirm,
+    {
+      open: true,
+      title: request.title,
+      description: request.description,
+      okText: request.okText,
+      cancelText: request.cancelText,
+      placement: "topLeft",
+      onConfirm: () => {
+        confirmingRef.current = true;
+        try {
+          request.onConfirm();
+        } finally {
+          onClose();
+        }
+      },
+      onOpenChange: (open) => {
+        if (open) {
+          return;
+        }
+        if (confirmingRef.current) {
+          confirmingRef.current = false;
+          return;
+        }
+        request.onCancel();
+        onClose();
+      },
+      style: {
+        position: "fixed",
+        left: request.anchorRect.x,
+        top: request.anchorRect.y,
+        width: Math.max(request.anchorRect.width, 1),
+        height: Math.max(request.anchorRect.height, 1),
+        pointerEvents: "none"
+      },
+      children: /* @__PURE__ */ jsx("span", { "aria-hidden": "true" })
+    }
+  );
+}
+function ReactTableTooltipView(props) {
+  const { request } = props;
+  if (!request) {
+    return null;
+  }
+  const zoom = typeof request.contentZoom === "number" && Number.isFinite(request.contentZoom) && request.contentZoom > 0 ? request.contentZoom : 1;
+  const fontSize = 12 * zoom;
+  const paddingBlock = 6 * zoom;
+  const paddingInline = 10 * zoom;
+  const borderRadius = 6 * zoom;
+  const maxWidth = 320 * zoom;
+  const style = {
+    position: "fixed",
+    left: request.x,
+    top: request.y,
+    transform: "translate(-50%, 0)",
+    maxWidth,
+    padding: `${paddingBlock}px ${paddingInline}px`,
+    borderRadius,
+    background: request.variant === "error" ? "#ffffff" : "rgba(17, 24, 39, 0.92)",
+    color: request.variant === "error" ? "#ff4d4f" : "#fff",
+    fontSize,
+    lineHeight: 1.5,
+    boxShadow: request.variant === "error" ? "0 10px 30px rgba(255, 77, 79, 0.16)" : "0 10px 30px rgba(15, 23, 42, 0.18)",
+    border: request.variant === "error" ? "1px solid rgba(255, 77, 79, 0.2)" : "none",
+    pointerEvents: "none",
+    zIndex: 1200,
+    whiteSpace: "pre-wrap",
+    wordBreak: "break-word"
+  };
+  return /* @__PURE__ */ jsx("div", { style, children: request.content });
+}
+function ToolbarIcon(props) {
+  const { path, ...svgProps } = props;
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      viewBox: "64 64 896 896",
+      width: "1em",
+      height: "1em",
+      fill: "currentColor",
+      "aria-hidden": "true",
+      focusable: "false",
+      ...svgProps,
+      children: /* @__PURE__ */ jsx("path", { d: path })
+    }
+  );
+}
+function FullscreenOutlined() {
+  return /* @__PURE__ */ jsx(ToolbarIcon, { path: "M290 236.4l43.9-43.9a8.01 8.01 0 00-4.7-13.6L169 160c-5.1-.6-9.5 3.7-8.9 8.9L179 329.1c.8 6.6 8.9 9.4 13.6 4.7l43.7-43.7L370 423.7c3.1 3.1 8.2 3.1 11.3 0l42.4-42.3c3.1-3.1 3.1-8.2 0-11.3L290 236.4zm352.7 187.3c3.1 3.1 8.2 3.1 11.3 0l133.7-133.6 43.7 43.7a8.01 8.01 0 0013.6-4.7L863.9 169c.6-5.1-3.7-9.5-8.9-8.9L694.8 179c-6.6.8-9.4 8.9-4.7 13.6l43.9 43.9L600.3 370a8.03 8.03 0 000 11.3l42.4 42.4zM845 694.9c-.8-6.6-8.9-9.4-13.6-4.7l-43.7 43.7L654 600.3a8.03 8.03 0 00-11.3 0l-42.4 42.3a8.03 8.03 0 000 11.3L734 787.6l-43.9 43.9a8.01 8.01 0 004.7 13.6L855 864c5.1.6 9.5-3.7 8.9-8.9L845 694.9zm-463.7-94.6a8.03 8.03 0 00-11.3 0L236.3 733.9l-43.7-43.7a8.01 8.01 0 00-13.6 4.7L160.1 855c-.6 5.1 3.7 9.5 8.9 8.9L329.2 845c6.6-.8 9.4-8.9 4.7-13.6L290 787.6 423.7 654c3.1-3.1 3.1-8.2 0-11.3l-42.4-42.4z" });
+}
+function FullscreenExitOutlined() {
+  return /* @__PURE__ */ jsx(ToolbarIcon, { path: "M391 240.9c-.8-6.6-8.9-9.4-13.6-4.7l-43.7 43.7L200 146.3a8.03 8.03 0 00-11.3 0l-42.4 42.3a8.03 8.03 0 000 11.3L280 333.6l-43.9 43.9a8.01 8.01 0 004.7 13.6L401 410c5.1.6 9.5-3.7 8.9-8.9L391 240.9zm10.1 373.2L240.8 633c-6.6.8-9.4 8.9-4.7 13.6l43.9 43.9L146.3 824a8.03 8.03 0 000 11.3l42.4 42.3c3.1 3.1 8.2 3.1 11.3 0L333.7 744l43.7 43.7A8.01 8.01 0 00391 783l18.9-160.1c.6-5.1-3.7-9.4-8.8-8.8zm221.8-204.2L783.2 391c6.6-.8 9.4-8.9 4.7-13.6L744 333.6 877.7 200c3.1-3.1 3.1-8.2 0-11.3l-42.4-42.3a8.03 8.03 0 00-11.3 0L690.3 279.9l-43.7-43.7a8.01 8.01 0 00-13.6 4.7L614.1 401c-.6 5.2 3.7 9.5 8.8 8.9zM744 690.4l43.9-43.9a8.01 8.01 0 00-4.7-13.6L623 614c-5.1-.6-9.5 3.7-8.9 8.9L633 783.1c.8 6.6 8.9 9.4 13.6 4.7l43.7-43.7L824 877.7c3.1 3.1 8.2 3.1 11.3 0l42.4-42.3c3.1-3.1 3.1-8.2 0-11.3L744 690.4z" });
+}
+function ReloadOutlined() {
+  return /* @__PURE__ */ jsx(ToolbarIcon, { path: "M909.1 209.3l-56.4 44.1C775.8 155.1 656.2 92 521.9 92 290 92 102.3 279.5 102 511.5 101.7 743.7 289.8 932 521.9 932c181.3 0 335.8-115 394.6-276.1 1.5-4.2-.7-8.9-4.9-10.3l-56.7-19.5a8 8 0 00-10.1 4.8c-1.8 5-3.8 10-5.9 14.9-17.3 41-42.1 77.8-73.7 109.4A344.77 344.77 0 01655.9 829c-42.3 17.9-87.4 27-133.8 27-46.5 0-91.5-9.1-133.8-27A341.5 341.5 0 01279 755.2a342.16 342.16 0 01-73.7-109.4c-17.9-42.4-27-87.4-27-133.9s9.1-91.5 27-133.9c17.3-41 42.1-77.8 73.7-109.4 31.6-31.6 68.4-56.4 109.3-73.8 42.3-17.9 87.4-27 133.8-27 46.5 0 91.5 9.1 133.8 27a341.5 341.5 0 01109.3 73.8c9.9 9.9 19.2 20.4 27.8 31.4l-60.2 47a8 8 0 003 14.1l175.6 43c5 1.2 9.9-2.6 9.9-7.7l.8-180.9c-.1-6.6-7.8-10.3-13-6.2z" });
+}
+function ExportOutlined() {
+  return /* @__PURE__ */ jsx(ToolbarIcon, { path: "M880 912H144c-17.7 0-32-14.3-32-32V144c0-17.7 14.3-32 32-32h360c4.4 0 8 3.6 8 8v56c0 4.4-3.6 8-8 8H184v656h656V520c0-4.4 3.6-8 8-8h56c4.4 0 8 3.6 8 8v360c0 17.7-14.3 32-32 32zM770.87 199.13l-52.2-52.2a8.01 8.01 0 014.7-13.6l179.4-21c5.1-.6 9.5 3.7 8.9 8.9l-21 179.4c-.8 6.6-8.9 9.4-13.6 4.7l-52.4-52.4-256.2 256.2a8.03 8.03 0 01-11.3 0l-42.4-42.4a8.03 8.03 0 010-11.3l256.1-256.3z" });
+}
+function ColumnHeightOutlined() {
+  return /* @__PURE__ */ jsx(ToolbarIcon, { path: "M840 836H184c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h656c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8zm0-724H184c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h656c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8zM610.8 378c6 0 9.4-7 5.7-11.7L515.7 238.7a7.14 7.14 0 00-11.3 0L403.6 366.3a7.23 7.23 0 005.7 11.7H476v268h-62.8c-6 0-9.4 7-5.7 11.7l100.8 127.5c2.9 3.7 8.5 3.7 11.3 0l100.8-127.5c3.7-4.7.4-11.7-5.7-11.7H548V378h62.8z" });
+}
+function SettingOutlined() {
+  return /* @__PURE__ */ jsx(ToolbarIcon, { path: "M924.8 625.7l-65.5-56c3.1-19 4.7-38.4 4.7-57.8s-1.6-38.8-4.7-57.8l65.5-56a32.03 32.03 0 009.3-35.2l-.9-2.6a443.74 443.74 0 00-79.7-137.9l-1.8-2.1a32.12 32.12 0 00-35.1-9.5l-81.3 28.9c-30-24.6-63.5-44-99.7-57.6l-15.7-85a32.05 32.05 0 00-25.8-25.7l-2.7-.5c-52.1-9.4-106.9-9.4-159 0l-2.7.5a32.05 32.05 0 00-25.8 25.7l-15.8 85.4a351.86 351.86 0 00-99 57.4l-81.9-29.1a32 32 0 00-35.1 9.5l-1.8 2.1a446.02 446.02 0 00-79.7 137.9l-.9 2.6c-4.5 12.5-.8 26.5 9.3 35.2l66.3 56.6c-3.1 18.8-4.6 38-4.6 57.1 0 19.2 1.5 38.4 4.6 57.1L99 625.5a32.03 32.03 0 00-9.3 35.2l.9 2.6c18.1 50.4 44.9 96.9 79.7 137.9l1.8 2.1a32.12 32.12 0 0035.1 9.5l81.9-29.1c29.8 24.5 63.1 43.9 99 57.4l15.8 85.4a32.05 32.05 0 0025.8 25.7l2.7.5a449.4 449.4 0 00159 0l2.7-.5a32.05 32.05 0 0025.8-25.7l15.7-85a350 350 0 0099.7-57.6l81.3 28.9a32 32 0 0035.1-9.5l1.8-2.1c34.8-41.1 61.6-87.5 79.7-137.9l.9-2.6c4.5-12.3.8-26.3-9.3-35zM788.3 465.9c2.5 15.1 3.8 30.6 3.8 46.1s-1.3 31-3.8 46.1l-6.6 40.1 74.7 63.9a370.03 370.03 0 01-42.6 73.6L721 702.8l-31.4 25.8c-23.9 19.6-50.5 35-79.3 45.8l-38.1 14.3-17.9 97a377.5 377.5 0 01-85 0l-17.9-97.2-37.8-14.5c-28.5-10.8-55-26.2-78.7-45.7l-31.4-25.9-93.4 33.2c-17-22.9-31.2-47.6-42.6-73.6l75.5-64.5-6.5-40c-2.4-14.9-3.7-30.3-3.7-45.5 0-15.3 1.2-30.6 3.7-45.5l6.5-40-75.5-64.5c11.3-26.1 25.6-50.7 42.6-73.6l93.4 33.2 31.4-25.9c23.7-19.5 50.2-34.9 78.7-45.7l37.9-14.3 17.9-97.2c28.1-3.2 56.8-3.2 85 0l17.9 97 38.1 14.3c28.7 10.8 55.4 26.2 79.3 45.8l31.4 25.8 92.8-32.9c17 22.9 31.2 47.6 42.6 73.6L781.8 426l6.5 39.9zM512 326c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm79.2 255.2A111.6 111.6 0 01512 614c-29.9 0-58-11.7-79.2-32.8A111.6 111.6 0 01400 502c0-29.9 11.7-58 32.8-79.2C454 401.6 482.1 390 512 390c29.9 0 58 11.6 79.2 32.8A111.6 111.6 0 01624 502c0 29.9-11.7 58-32.8 79.2z" });
+}
+function HolderOutlined() {
+  return /* @__PURE__ */ jsx(ToolbarIcon, { path: "M300 276.5a56 56 0 1056-97 56 56 0 00-56 97zm0 284a56 56 0 1056-97 56 56 0 00-56 97zM640 228a56 56 0 10112 0 56 56 0 00-112 0zm0 284a56 56 0 10112 0 56 56 0 00-112 0zM300 844.5a56 56 0 1056-97 56 56 0 00-56 97zM640 796a56 56 0 10112 0 56 56 0 00-112 0z" });
+}
+function SortableList(props) {
+  const { items, onOrderChange } = props;
+  const rootRef = useRef(null);
+  const dragRef = useRef(null);
+  const [dragState, setDragState] = useState(null);
+  useEffect(
+    () => () => {
+      document.body.classList.remove("react-list-table-sorting");
+      document.body.style.removeProperty("user-select");
+    },
+    []
+  );
+  useEffect(() => {
+    if (!dragState) return;
+    const handleMove = (event) => {
+      const current = dragRef.current;
+      if (!current) return;
+      const target = resolveClosestSortableItem({
+        items,
+        parentKey: current.source.parentKey,
+        layouts: current.layouts,
+        overlayCenterY: event.clientY - current.offsetY + current.height / 2
+      });
+      if (target) {
+        current.target = target;
+      }
+      setDragState({
+        sourceKey: current.source.key,
+        targetKey: current.target.key,
+        pointerY: event.clientY
+      });
+    };
+    const handleEnd = () => {
+      const current = dragRef.current;
+      if (current && current.source.key !== current.target.key) {
+        const siblings = items.filter(
+          (item) => item.parentKey === current.source.parentKey
+        );
+        const orderedKeys = resolveNextSortableOrder(
+          siblings.map((item) => item.key),
+          current.source.key,
+          current.target.key
+        );
+        if (orderedKeys) {
+          onOrderChange(current.source.parentKey, orderedKeys);
+        }
+      }
+      dragRef.current = null;
+      setDragState(null);
+      document.body.classList.remove("react-list-table-sorting");
+      document.body.style.removeProperty("user-select");
+    };
+    window.addEventListener("pointermove", handleMove);
+    window.addEventListener("pointerup", handleEnd, { once: true });
+    window.addEventListener("pointercancel", handleEnd, { once: true });
+    return () => {
+      window.removeEventListener("pointermove", handleMove);
+      window.removeEventListener("pointerup", handleEnd);
+      window.removeEventListener("pointercancel", handleEnd);
+    };
+  }, [dragState != null, items, onOrderChange]);
+  const sourceIndex = dragState ? items.findIndex((item) => item.key === dragState.sourceKey) : -1;
+  const targetIndex = dragState ? items.findIndex((item) => item.key === dragState.targetKey) : -1;
+  return /* @__PURE__ */ jsxs("div", { ref: rootRef, children: [
+    items.map((item, index) => {
+      const style = resolveSortableTransform(
+        index,
+        sourceIndex,
+        targetIndex,
+        dragRef.current?.height ?? 0
+      );
+      return /* @__PURE__ */ jsx(
+        "div",
+        {
+          "data-sortable-key": item.key,
+          className: dragState?.sourceKey === item.key ? "dragging" : "",
+          style,
+          children: props.renderItem(item, {
+            onPointerDown: (event) => {
+              if (event.button !== 0) return;
+              const row = event.currentTarget.closest(
+                "[data-sortable-key]"
+              );
+              if (!row) return;
+              const rect = row.getBoundingClientRect();
+              dragRef.current = {
+                source: item,
+                target: item,
+                layouts: collectSortableItemLayouts(rootRef.current),
+                offsetY: event.clientY - rect.top,
+                width: rect.width,
+                left: rect.left,
+                height: rect.height
+              };
+              setDragState({
+                sourceKey: item.key,
+                targetKey: item.key,
+                pointerY: event.clientY
+              });
+              document.body.classList.add("react-list-table-sorting");
+              document.body.style.userSelect = "none";
+              event.preventDefault();
+            }
+          })
+        },
+        item.key
+      );
+    }),
+    dragState && dragRef.current ? createPortal(
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "react-list-table-sort-overlay",
+          style: {
+            left: dragRef.current.left,
+            top: dragState.pointerY - dragRef.current.offsetY,
+            width: dragRef.current.width,
+            height: dragRef.current.height
+          },
+          children: props.renderItem(dragRef.current.source, {
+            onPointerDown: (event) => event.preventDefault()
+          })
+        }
+      ),
+      document.body
+    ) : null
+  ] });
+}
+function resolveNextSortableOrder(currentKeys, sourceKey, targetKey) {
+  const sourceIndex = currentKeys.indexOf(sourceKey);
+  const targetIndex = currentKeys.indexOf(targetKey);
+  if (sourceIndex < 0 || targetIndex < 0 || sourceIndex === targetIndex) {
+    return null;
+  }
+  const nextKeys = [...currentKeys];
+  const [source] = nextKeys.splice(sourceIndex, 1);
+  nextKeys.splice(targetIndex, 0, source);
+  return nextKeys;
+}
+function collectSortableItemLayouts(root) {
+  if (!root) return [];
+  return Array.from(
+    root.querySelectorAll("[data-sortable-key]")
+  ).map((element) => {
+    const rect = element.getBoundingClientRect();
+    return {
+      key: element.dataset.sortableKey ?? "",
+      centerY: rect.top + rect.height / 2
+    };
+  });
+}
+function resolveClosestSortableItem(params) {
+  let closestItem = null;
+  let closestDistance = Number.POSITIVE_INFINITY;
+  params.layouts.forEach((layout) => {
+    const item = params.items.find((candidate) => candidate.key === layout.key);
+    if (!item || item.parentKey !== params.parentKey) return;
+    const distance = Math.abs(params.overlayCenterY - layout.centerY);
+    if (distance < closestDistance) {
+      closestDistance = distance;
+      closestItem = item;
+    }
+  });
+  return closestItem;
+}
+function resolveSortableTransform(index, sourceIndex, targetIndex, height) {
+  let translateY = 0;
+  if (sourceIndex < targetIndex && index > sourceIndex && index <= targetIndex) {
+    translateY = -height;
+  } else if (sourceIndex > targetIndex && index >= targetIndex && index < sourceIndex) {
+    translateY = height;
+  }
+  return {
+    transform: translateY ? `translate3d(0, ${translateY}px, 0)` : void 0,
+    transition: sourceIndex >= 0 ? "transform 180ms ease" : void 0
+  };
+}
+
+// src/features/toolbar/style.css
+styleInject('.react-list-table-titlebar {\n  height: 44px;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 0;\n  box-sizing: border-box;\n  background: #fff;\n}\n.react-list-table-title {\n  min-width: 0;\n  color: #1f2937;\n  font-size: 14px;\n  font-weight: 600;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.react-list-table-tools {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  color: #475569;\n}\n.react-list-table-tool-wrap {\n  position: relative;\n  display: inline-flex;\n}\n.react-list-table-tool {\n  width: 20px;\n  height: 24px;\n  padding: 0;\n  border: 0;\n  color: inherit;\n  background: transparent;\n  font: 16px/24px sans-serif;\n  cursor: pointer;\n}\n.react-list-table-tool:hover {\n  color: #1677ff;\n}\n.react-list-table-tool-menu,\n.react-list-table-column-setting {\n  position: absolute;\n  z-index: 120;\n  top: 28px;\n  right: 0;\n  min-width: 112px;\n  padding: 6px;\n  border: 1px solid #e5e7eb;\n  border-radius: 6px;\n  background: #fff;\n  box-shadow: 0 8px 24px rgba(15, 23, 42, .14);\n}\n.react-list-table-tool-menu button {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  padding: 6px 10px;\n  border: 0;\n  border-radius: 4px;\n  background: transparent;\n  text-align: left;\n  cursor: pointer;\n}\n.react-list-table-tool-menu button.active::after {\n  content: "\\2713";\n  margin-left: 12px;\n  font-size: 12px;\n}\n.react-list-table-tool-menu button:hover,\n.react-list-table-tool-menu button.active {\n  color: #1677ff;\n  background: #e6f4ff;\n}\n.react-list-table-column-setting {\n  width: 328px;\n  max-height: 360px;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n.react-list-table-column-setting-head {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 4px 6px 8px;\n  border-bottom: 1px solid #f0f0f0;\n  flex: 0 0 auto;\n}\n.react-list-table-column-setting-head button {\n  border: 0;\n  color: #1677ff;\n  background: transparent;\n  cursor: pointer;\n}\n.react-list-table-column-setting-body {\n  flex: 1 1 auto;\n  min-height: 0;\n  overflow: auto;\n}\n.react-list-table-column-item {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  justify-content: space-between;\n  padding: 7px 6px;\n  box-sizing: border-box;\n  cursor: pointer;\n}\n.react-list-table-column-main,\n.react-list-table-column-actions {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n}\n.react-list-table-column-main {\n  min-width: 0;\n}\n.react-list-table-column-actions {\n  flex: 0 0 auto;\n}\n.react-list-table-column-actions > .canvas-react-select-wrap {\n  flex: 0 0 96px;\n  width: 96px;\n  height: 24px;\n}\n.react-list-table-column-label {\n  min-width: 64px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.react-list-table-column-width-input {\n  height: 22px;\n  padding-inline: 5px;\n}\n.react-list-table-column-fixed-input {\n  height: 22px;\n  padding-inline: 6px;\n  font-size: 12px;\n}\n.react-list-table-column-setting label.dragging {\n  opacity: 0.45;\n  background: #e6f4ff;\n}\n.react-list-table-column-setting [data-sortable-key].dragging {\n  opacity: 0.28;\n}\n.react-list-table-column-drag {\n  color: #94a3b8;\n  display: inline-flex;\n  font-size: 14px;\n  cursor: grab;\n  user-select: none;\n}\nbody.react-list-table-sorting,\nbody.react-list-table-sorting * {\n  cursor: grabbing !important;\n}\n.react-list-table-sort-overlay {\n  position: fixed;\n  z-index: 1400;\n  display: block;\n  padding: 0;\n  box-sizing: border-box;\n  color: #334155;\n  background: #fff;\n  border: 1px solid #91caff;\n  border-radius: 6px;\n  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.18);\n  pointer-events: none;\n}\n.react-list-table-sort-overlay .react-list-table-column-item {\n  width: 100%;\n  height: 100%;\n}\n');
+function ReactTableToolbar(props) {
+  const { toolbar, title } = props;
+  const [densityOpen, setDensityOpen] = useState(false);
+  const [settingOpen, setSettingOpen] = useState(false);
+  const [isFullscreen, setIsFullscreen] = useState(false);
+  const rootRef = useRef(null);
+  const hasToolbar = toolbar !== void 0 && toolbar !== false;
+  useEffect(() => {
+    const close = (event) => {
+      if (event.target?.closest(".canvas-react-popup")) {
+        return;
+      }
+      if (!rootRef.current?.contains(event.target)) {
+        setDensityOpen(false);
+        setSettingOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", close);
+    return () => document.removeEventListener("mousedown", close);
+  }, []);
+  useEffect(() => {
+    const handleFullscreenChange = () => {
+      const fullscreenNode = (typeof toolbar === "object" ? toolbar.getFullscreenNode?.() : null) ?? props.hostRef.current;
+      setIsFullscreen(document.fullscreenElement === fullscreenNode);
+    };
+    document.addEventListener("fullscreenchange", handleFullscreenChange);
+    return () => document.removeEventListener("fullscreenchange", handleFullscreenChange);
+  }, [props.hostRef, toolbar]);
+  if (!title && !hasToolbar) return null;
+  const config = typeof toolbar === "object" ? toolbar : {};
+  return /* @__PURE__ */ jsxs("div", { className: "react-list-table-titlebar", ref: rootRef, children: [
+    /* @__PURE__ */ jsx("div", { className: "react-list-table-title", children: title }),
+    hasToolbar ? /* @__PURE__ */ jsxs("div", { className: "react-list-table-tools", children: [
+      config.extra,
+      config.showFullscreen !== false ? /* @__PURE__ */ jsx(
+        ToolButton,
+        {
+          label: isFullscreen ? "\u9000\u51FA\u5168\u5C4F" : "\u5168\u5C4F",
+          onClick: () => {
+            if (isFullscreen) {
+              void document.exitFullscreen?.();
+            } else {
+              const fullscreenNode = config.getFullscreenNode?.() ?? props.hostRef.current;
+              void fullscreenNode?.requestFullscreen?.();
+            }
+          },
+          children: isFullscreen ? /* @__PURE__ */ jsx(FullscreenExitOutlined, {}) : /* @__PURE__ */ jsx(FullscreenOutlined, {})
+        }
+      ) : null,
+      config.showRefresh !== false ? /* @__PURE__ */ jsx(ToolButton, { label: "\u5237\u65B0", iconSize: 14, onClick: () => config.onRefresh?.(), children: /* @__PURE__ */ jsx(ReloadOutlined, {}) }) : null,
+      config.showExport ? /* @__PURE__ */ jsx(
+        ToolButton,
+        {
+          label: "\u5BFC\u51FA",
+          iconSize: 14,
+          onClick: () => {
+            if (config.onExport) {
+              config.onExport();
+            } else {
+              props.onExport();
+            }
+          },
+          children: /* @__PURE__ */ jsx(ExportOutlined, {})
+        }
+      ) : null,
+      config.showDensity !== false ? /* @__PURE__ */ jsxs("div", { className: "react-list-table-tool-wrap", children: [
+        /* @__PURE__ */ jsx(ToolButton, { label: "\u8868\u683C\u5BC6\u5EA6", onClick: () => setDensityOpen((v) => !v), children: /* @__PURE__ */ jsx(ColumnHeightOutlined, {}) }),
+        densityOpen ? /* @__PURE__ */ jsx("div", { className: "react-list-table-tool-menu", children: [48, 40, 32].map((height) => /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: props.density === height ? "active" : "",
+            onClick: () => {
+              props.onDensityChange(height);
+              setDensityOpen(false);
+            },
+            children: height === 48 ? "\u5BBD\u677E" : height === 40 ? "\u4E2D\u7B49" : "\u7D27\u51D1"
+          },
+          height
+        )) }) : null
+      ] }) : null,
+      config.showColumnSetting !== false ? /* @__PURE__ */ jsxs("div", { className: "react-list-table-tool-wrap", children: [
+        /* @__PURE__ */ jsx(ToolButton, { label: "\u5217\u8BBE\u7F6E", onClick: () => setSettingOpen((v) => !v), children: /* @__PURE__ */ jsx(SettingOutlined, {}) }),
+        settingOpen ? /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "react-list-table-column-setting",
+            style: { width: config.columnSettingWidth },
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "react-list-table-column-setting-head", children: [
+                /* @__PURE__ */ jsx("strong", { children: "\u5217\u8BBE\u7F6E" }),
+                /* @__PURE__ */ jsx("button", { type: "button", onClick: props.onResetColumns, children: "\u91CD\u7F6E" })
+              ] }),
+              /* @__PURE__ */ jsx("div", { className: "react-list-table-column-setting-body", children: /* @__PURE__ */ jsx(
+                SortableList,
+                {
+                  items: flattenColumns(props.columns),
+                  onOrderChange: props.onColumnOrderChange,
+                  renderItem: (column, handleProps) => /* @__PURE__ */ jsxs("div", { className: "react-list-table-column-item", children: [
+                    /* @__PURE__ */ jsxs(
+                      "span",
+                      {
+                        className: "react-list-table-column-main",
+                        style: { paddingLeft: column.level * 16 },
+                        children: [
+                          /* @__PURE__ */ jsx(
+                            "span",
+                            {
+                              className: "react-list-table-column-drag",
+                              ...handleProps,
+                              onClick: (event) => {
+                                event.preventDefault();
+                                event.stopPropagation();
+                              },
+                              children: /* @__PURE__ */ jsx(HolderOutlined, {})
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(
+                            "input",
+                            {
+                              type: "checkbox",
+                              checked: !column.hidden,
+                              onChange: (event) => props.onColumnVisibilityChange(
+                                column.key,
+                                event.target.checked
+                              )
+                            }
+                          ),
+                          /* @__PURE__ */ jsx("span", { className: "react-list-table-column-label", children: column.label })
+                        ]
+                      }
+                    ),
+                    !column.isGroup ? /* @__PURE__ */ jsxs("span", { className: "react-list-table-column-actions", children: [
+                      /* @__PURE__ */ jsx(
+                        ReactNumberInput,
+                        {
+                          className: "react-list-table-column-width-input",
+                          min: column.minWidth,
+                          max: column.maxWidth,
+                          value: column.width,
+                          allowClear: false,
+                          "aria-label": `${column.label}\u5217\u5BBD`,
+                          style: { width: 80, height: 24 },
+                          onChange: (width) => {
+                            if (width != null && Number.isFinite(width) && width > 0 && (column.minWidth == null || width >= column.minWidth) && (column.maxWidth == null || width <= column.maxWidth)) {
+                              props.onColumnWidthChange(column.key, width);
+                            }
+                          }
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        ReactSelect,
+                        {
+                          className: "react-list-table-column-fixed-input",
+                          value: column.fixed ?? "none",
+                          options: [
+                            { label: "\u4E0D\u56FA\u5B9A", value: "none" },
+                            { label: "\u56FA\u5B9A\u5DE6\u4FA7", value: "left" },
+                            { label: "\u56FA\u5B9A\u53F3\u4FA7", value: "right" }
+                          ],
+                          allowClear: false,
+                          showSearch: false,
+                          style: { width: "100%", height: 24 },
+                          "aria-label": `${column.label}\u56FA\u5B9A\u65B9\u5411`,
+                          onChange: (value) => {
+                            props.onColumnFixedChange(
+                              column.key,
+                              value === "left" || value === "right" ? value : void 0
+                            );
+                          }
+                        }
+                      )
+                    ] }) : null
+                  ] })
+                }
+              ) })
+            ]
+          }
+        ) : null
+      ] }) : null
+    ] }) : null
+  ] });
+}
+function ToolButton(props) {
+  return /* @__PURE__ */ jsx("button", { type: "button", className: "react-list-table-tool", style: { fontSize: props.iconSize ?? 16 }, title: props.label, "aria-label": props.label, onClick: props.onClick, children: props.children });
+}
+function flattenColumns(columns, parentKey = "root", level = 0) {
+  return columns.flatMap((column) => {
+    const key = String(column.key ?? column.dataIndex);
+    const label = typeof column.title === "string" ? column.title : key;
+    const current = {
+      key,
+      label,
+      hidden: column.hidden === true,
+      parentKey,
+      width: Number(column.width) || 160,
+      minWidth: typeof column.minWidth === "number" ? column.minWidth : void 0,
+      maxWidth: typeof column.maxWidth === "number" ? column.maxWidth : void 0,
+      fixed: column.fixed,
+      level,
+      isGroup: Boolean(column.children?.length)
+    };
+    return column.children?.length ? [current, ...flattenColumns(column.children, key, level + 1)] : [current];
+  });
+}
+function useReactListTableState(options) {
+  const containerRef = useRef(null);
+  const tableRef = useRef(null);
+  const [editorRequest, setEditorRequest] = useState(null);
+  const [paginationConfig, setPaginationConfig] = useState(null);
+  const [tooltipRequest, setTooltipRequest] = useState(null);
+  const [loadingRequest, setLoadingRequest] = useState(null);
+  const [filterPanelRequest, setFilterPanelRequest] = useState(null);
+  const [fixedPopupRequest, setFixedPopupRequest] = useState(null);
+  const [headerContextMenuRequest, setHeaderContextMenuRequest] = useState(null);
+  const [imagePreviewRequest, setImagePreviewRequest] = useState(null);
+  const [dangerConfirmRequest, setDangerConfirmRequest] = useState(null);
+  const uiOptions = useMemo(
+    () => ({
+      ...options.ui,
+      onEditorRequest: (request) => {
+        setEditorRequest(request);
+        options.ui?.onEditorRequest?.(request);
+      },
+      onPaginationRender: (config) => {
+        setPaginationConfig(config);
+        options.ui?.onPaginationRender?.(config);
+      },
+      onTooltipRequest: (request) => {
+        setTooltipRequest(request);
+        options.ui?.onTooltipRequest?.(request);
+      },
+      onLoadingRequest: (request) => {
+        setLoadingRequest(request);
+        options.ui?.onLoadingRequest?.(request);
+      },
+      onFilterPanelRequest: (request) => {
+        setFilterPanelRequest(request);
+        options.ui?.onFilterPanelRequest?.(request);
+      },
+      onFixedPopupRequest: (request) => {
+        setFixedPopupRequest(request);
+        options.ui?.onFixedPopupRequest?.(request);
+      },
+      onHeaderContextMenuRequest: (request) => {
+        setHeaderContextMenuRequest(request);
+        options.ui?.onHeaderContextMenuRequest?.(request);
+      },
+      onImagePreviewRequest: (request) => {
+        setImagePreviewRequest(request);
+        options.ui?.onImagePreviewRequest?.(request);
+      },
+      onDangerConfirmRequest: (request) => {
+        setDangerConfirmRequest(request);
+        options.ui?.onDangerConfirmRequest?.(request);
+      }
+    }),
+    [options.ui]
+  );
+  useEffect(() => {
+    const container = containerRef.current;
+    if (!container) {
+      return;
+    }
+    const table = new ListTable(container, {
+      ...options,
+      ui: uiOptions
+    });
+    table.mount();
+    tableRef.current = table;
+    return () => {
+      table.destroy();
+      tableRef.current = null;
+      setEditorRequest(null);
+      setPaginationConfig(null);
+      setTooltipRequest(null);
+      setLoadingRequest(null);
+      setFilterPanelRequest(null);
+      setFixedPopupRequest(null);
+      setHeaderContextMenuRequest(null);
+      setImagePreviewRequest(null);
+      setDangerConfirmRequest(null);
+    };
+  }, []);
+  useEffect(() => {
+    tableRef.current?.updateOptions({
+      ...options,
+      ui: uiOptions
+    });
+  }, [options, uiOptions]);
+  return {
+    containerRef,
+    tableRef,
+    editorRequest,
+    paginationConfig,
+    tooltipRequest,
+    loadingRequest,
+    filterPanelRequest,
+    fixedPopupRequest,
+    headerContextMenuRequest,
+    imagePreviewRequest,
+    dangerConfirmRequest,
+    closeDangerConfirmRequest: () => {
+      setDangerConfirmRequest(null);
+      options.ui?.onDangerConfirmRequest?.(null);
+    }
+  };
+}
+
+// src/components/build-list-table-options.ts
+function buildListTableOptions(props) {
+  const {
+    width,
+    height,
+    emptyText,
+    scroll,
+    locale,
+    onChange,
+    query,
+    ...restProps
+  } = props;
+  return {
+    type: "list",
+    ...restProps,
+    width: scroll?.x === true ? "100%" : scroll?.x ?? width,
+    height: scroll?.y ?? height,
+    emptyText: locale?.emptyText ?? emptyText,
+    query: onChange ? {
+      ...query,
+      onChange
+    } : query
+  };
+}
+function ReactListTableInner(props, ref) {
+  const {
+    className,
+    style,
+    width,
+    height,
+    emptyText,
+    scroll,
+    locale,
+    onChange,
+    rowKey,
+    columns,
+    dataSource,
+    theme,
+    striped,
+    highlightMode,
+    contextMenu,
+    rowHeight,
+    headerRowHeight,
+    summaryRowHeight,
+    overscanRowCount,
+    query,
+    rowSelection,
+    expandable,
+    pagination,
+    scrollbar,
+    carouselScroll,
+    stretchColumns,
+    resizable,
+    storageKey,
+    draggable,
+    tableId,
+    rowDrag,
+    debug,
+    title,
+    toolbar
+  } = props;
+  const shellRef = useRef(null);
+  const [densityOverride, setDensityOverride] = useState(
+    null
+  );
+  const [columnVisibility, setColumnVisibility] = useState(() => /* @__PURE__ */ new Map());
+  const [columnOrders, setColumnOrders] = useState(
+    () => /* @__PURE__ */ new Map()
+  );
+  const [columnConfig, setColumnConfig] = useState(() => /* @__PURE__ */ new Map());
+  const resolvedColumns = useMemo(
+    () => applyColumnManagerState(
+      columns,
+      columnVisibility,
+      columnOrders,
+      columnConfig
+    ),
+    [columns, columnVisibility, columnOrders, columnConfig]
+  );
+  const resolvedRowHeight = densityOverride ?? rowHeight;
+  const options = useMemo(
+    () => buildListTableOptions({
+      width,
+      height,
+      emptyText,
+      scroll,
+      locale,
+      onChange,
+      rowKey,
+      columns: resolvedColumns,
+      dataSource,
+      theme,
+      striped,
+      highlightMode,
+      contextMenu,
+      rowHeight: resolvedRowHeight,
+      headerRowHeight,
+      summaryRowHeight,
+      overscanRowCount,
+      query,
+      rowSelection,
+      expandable,
+      pagination,
+      scrollbar,
+      carouselScroll,
+      stretchColumns,
+      resizable,
+      storageKey,
+      draggable,
+      tableId,
+      rowDrag,
+      debug
+    }),
+    [
+      width,
+      height,
+      emptyText,
+      scroll,
+      locale,
+      onChange,
+      rowKey,
+      resolvedColumns,
+      dataSource,
+      theme,
+      striped,
+      highlightMode,
+      contextMenu,
+      resolvedRowHeight,
+      headerRowHeight,
+      summaryRowHeight,
+      overscanRowCount,
+      query,
+      rowSelection,
+      expandable,
+      pagination,
+      scrollbar,
+      carouselScroll,
+      stretchColumns,
+      resizable,
+      storageKey,
+      draggable,
+      tableId,
+      rowDrag,
+      debug
+    ]
+  );
+  const {
+    containerRef,
+    tableRef,
+    editorRequest,
+    paginationConfig,
+    tooltipRequest,
+    loadingRequest,
+    filterPanelRequest,
+    fixedPopupRequest,
+    headerContextMenuRequest,
+    imagePreviewRequest,
+    dangerConfirmRequest,
+    closeDangerConfirmRequest
+  } = useReactListTableState(options);
+  const hasPagination = paginationConfig != null;
+  useImperativeHandle(
+    ref,
+    () => ({
+      validate: () => tableRef.current?.validate() ?? Promise.resolve([]),
+      exportXlsx: () => {
+        tableRef.current?.exportXlsx();
+      },
+      scrollTo: (options2) => {
+        tableRef.current?.scrollTo(options2);
+      },
+      getDebugSnapshot: () => tableRef.current?.getDebugSnapshot() ?? null,
+      resetSorter: () => {
+        tableRef.current?.resetSorter();
+      },
+      resetFilter: () => {
+        tableRef.current?.resetFilter();
+      }
+    }),
+    []
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: shellRef,
+        className,
+        style: {
+          position: "relative",
+          display: "flex",
+          flexDirection: "column",
+          paddingBottom: hasPagination ? 44 : void 0,
+          ...style
+        },
+        children: [
+          /* @__PURE__ */ jsx(
+            ReactTableToolbar,
+            {
+              title,
+              toolbar,
+              columns: resolvedColumns,
+              density: resolvedRowHeight === "auto" ? 40 : resolvedRowHeight ?? 40,
+              hostRef: shellRef,
+              onExport: () => tableRef.current?.exportXlsx(),
+              onDensityChange: setDensityOverride,
+              onColumnVisibilityChange: (columnKey, visible) => {
+                setColumnVisibility((current) => {
+                  const next = new Map(current);
+                  next.set(columnKey, visible);
+                  return next;
+                });
+              },
+              onColumnOrderChange: (parentKey, orderedKeys) => {
+                setColumnOrders((current) => {
+                  const next = new Map(current);
+                  next.set(parentKey, orderedKeys);
+                  return next;
+                });
+              },
+              onColumnWidthChange: (columnKey, width2) => {
+                setColumnConfig((current) => {
+                  const next = new Map(current);
+                  next.set(columnKey, {
+                    ...next.get(columnKey),
+                    width: width2
+                  });
+                  return next;
+                });
+              },
+              onColumnFixedChange: (columnKey, fixed) => {
+                setColumnConfig((current) => {
+                  const next = new Map(current);
+                  next.set(columnKey, {
+                    ...next.get(columnKey),
+                    fixed: fixed ?? null
+                  });
+                  return next;
+                });
+              },
+              onResetColumns: () => {
+                setColumnVisibility(/* @__PURE__ */ new Map());
+                setColumnOrders(/* @__PURE__ */ new Map());
+                setColumnConfig(/* @__PURE__ */ new Map());
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              ref: containerRef,
+              style: { flex: 1, minWidth: 0, width: "100%", minHeight: 0 },
+              children: /* @__PURE__ */ jsx(ReactTablePaginationView, { config: paginationConfig })
+            }
+          ),
+          loadingRequest ? /* @__PURE__ */ jsx(
+            "div",
+            {
+              style: {
+                position: "absolute",
+                inset: 0,
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                background: "rgba(255, 255, 255, 0.68)",
+                color: "#475569",
+                fontSize: 14,
+                pointerEvents: "auto",
+                cursor: "progress"
+              },
+              children: loadingRequest.text ?? "\u5904\u7406\u4E2D\u2026"
+            }
+          ) : null
+        ]
+      }
+    ),
+    tooltipRequest ? createPortal(
+      /* @__PURE__ */ jsx(ReactTableTooltipView, { request: tooltipRequest }),
+      document.body
+    ) : null,
+    filterPanelRequest ? createPortal(
+      /* @__PURE__ */ jsx(ReactTableFilterPanelView, { request: filterPanelRequest }),
+      document.body
+    ) : null,
+    fixedPopupRequest ? createPortal(
+      /* @__PURE__ */ jsx(ReactTableFixedPopupView, { request: fixedPopupRequest }),
+      document.body
+    ) : null,
+    headerContextMenuRequest ? createPortal(
+      /* @__PURE__ */ jsx(ReactTableContextMenuView, { request: headerContextMenuRequest }),
+      document.body
+    ) : null,
+    dangerConfirmRequest ? createPortal(
+      /* @__PURE__ */ jsx(
+        ReactTableDangerConfirmView,
+        {
+          request: dangerConfirmRequest,
+          onClose: closeDangerConfirmRequest
+        }
+      ),
+      document.body
+    ) : null,
+    editorRequest ? createPortal(
+      /* @__PURE__ */ jsx(ReactTableEditorOverlay, { request: editorRequest }),
+      editorRequest.hostElement ?? document.body
+    ) : null,
+    imagePreviewRequest ? createPortal(
+      /* @__PURE__ */ jsx(
+        ReactImagePreview,
+        {
+          open: true,
+          src: imagePreviewRequest.src,
+          alt: imagePreviewRequest.alt,
+          onClose: imagePreviewRequest.onClose
+        }
+      ),
+      document.body
+    ) : null
+  ] });
+}
+function applyColumnManagerState(columns, visibility, orders, config, parentKey = "root") {
+  const order = orders.get(parentKey);
+  const sortedColumns = order ? [...columns].sort(
+    (left, right) => order.indexOf(resolveColumnKey(left)) - order.indexOf(resolveColumnKey(right))
+  ) : columns;
+  return sortedColumns.map((column) => {
+    const key = resolveColumnKey(column);
+    const managedConfig = config.get(key);
+    return {
+      ...column,
+      hidden: visibility.has(key) ? visibility.get(key) === false : column.hidden,
+      width: managedConfig?.width ?? column.width,
+      minWidth: column.minWidth,
+      maxWidth: column.maxWidth,
+      fixed: managedConfig?.fixed === null ? void 0 : managedConfig?.fixed ?? column.fixed,
+      children: column.children ? applyColumnManagerState(
+        column.children,
+        visibility,
+        orders,
+        config,
+        key
+      ) : void 0
+    };
+  });
+}
+function resolveColumnKey(column) {
+  return String(column.key ?? column.dataIndex);
+}
+var ReactListTable = forwardRef(ReactListTableInner);
+
+export { ReactListTable };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map