@creekjs/web-components 1.0.5 → 1.0.6

package/dist/creek-table/hooks/useResizableColumns.js

@@ -0,0 +1,279 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/creek-table/hooks/useResizableColumns.tsx
+var useResizableColumns_exports = {};
+__export(useResizableColumns_exports, {
+  useResizableColumns: () => useResizableColumns
+});
+module.exports = __toCommonJS(useResizableColumns_exports);
+var import_ahooks = require("ahooks");
+var import_antd_style = require("antd-style");
+var import_classnames = __toESM(require("classnames"));
+var import_react = require("react");
+var import_react_resizable = require("react-resizable");
+var import_jsx_runtime = require("react/jsx-runtime");
+var useStyles = (0, import_antd_style.createStyles)(({ token }) => ({
+  "resizable-handle": {
+    position: "absolute",
+    right: -5,
+    bottom: 0,
+    zIndex: 10,
+    width: 10,
+    height: "100%",
+    cursor: "col-resize",
+    touchAction: "none",
+    userSelect: "none",
+    // 添加一个小竖线作为视觉提示
+    "&::after": {
+      content: '""',
+      position: "absolute",
+      top: 0,
+      bottom: 0,
+      left: "50%",
+      width: 1,
+      opacity: 0,
+      transition: "all 0.3s",
+      transform: "translateX(-50%)"
+    },
+    "&:hover::after": {
+      opacity: 1
+    },
+    "&:active::after": {
+      opacity: 1
+    }
+  },
+  "resizable-th": {
+    position: "relative",
+    "&:hover .resizable-handle::after": {
+      opacity: 0.5
+    }
+  }
+}));
+var ResizableTitle = (props) => {
+  const { onResize, onResizeStart, onResizeStop, width, className, minWidth, ...restProps } = props;
+  const { styles } = useStyles();
+  const ref = (0, import_react.useRef)(null);
+  const [realWidth, setRealWidth] = (0, import_react.useState)(void 0);
+  const [localWidth, setLocalWidth] = (0, import_react.useState)(typeof width === "number" ? width : void 0);
+  const [isResizing, setIsResizing] = (0, import_react.useState)(false);
+  (0, import_react.useEffect)(() => {
+    if (!isResizing && typeof width === "number") {
+      setLocalWidth(width);
+    }
+  }, [width, isResizing]);
+  (0, import_react.useLayoutEffect)(() => {
+    if (ref.current) {
+      const w = ref.current.getBoundingClientRect().width;
+      setRealWidth(w);
+      if (typeof width !== "number") {
+        setLocalWidth(w);
+      }
+    }
+  }, []);
+  const handleResizeStart = (e, data) => {
+    setIsResizing(true);
+    document.body.style.userSelect = "none";
+    document.body.style.cursor = "col-resize";
+    if (onResizeStart) {
+      onResizeStart(e, data);
+    }
+  };
+  const handleResizeStop = (e, data) => {
+    setIsResizing(false);
+    document.body.style.userSelect = "";
+    document.body.style.cursor = "";
+    if (onResizeStop) {
+      onResizeStop(e, data);
+    }
+  };
+  const handleResize = (e, data) => {
+    setLocalWidth(data.size.width);
+    if (onResize) {
+      onResize(e, data);
+    }
+  };
+  const currentWidth = localWidth ?? realWidth;
+  if (typeof currentWidth === "number" && onResize) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_react_resizable.Resizable,
+      {
+        width: currentWidth,
+        height: 0,
+        minConstraints: [minWidth || 0, 0],
+        handle: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "span",
+          {
+            className: (0, import_classnames.default)(styles["resizable-handle"], "resizable-handle"),
+            onClick: (e) => {
+              e.stopPropagation();
+            },
+            onMouseEnter: (e) => {
+              if (onResizeStart) {
+                onResizeStart(e, { node: e.currentTarget, size: { width: currentWidth, height: 0 }, handle: "e" });
+              }
+            }
+          }
+        ),
+        onResize: handleResize,
+        onResizeStart: handleResizeStart,
+        onResizeStop: handleResizeStop,
+        draggableOpts: { enableUserSelectHack: false },
+        axis: "x",
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { ...restProps, className: (0, import_classnames.default)(className, styles["resizable-th"]), style: { ...restProps.style, width: currentWidth } })
+      }
+    );
+  }
+  if (!onResize || !realWidth) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { ...restProps, className, ref });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_react_resizable.Resizable,
+    {
+      width: realWidth,
+      height: 0,
+      minConstraints: [minWidth || 0, 0],
+      handle: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "span",
+        {
+          className: (0, import_classnames.default)(styles["resizable-handle"], "resizable-handle"),
+          onClick: (e) => {
+            e.stopPropagation();
+          },
+          onMouseEnter: (e) => {
+            if (onResizeStart) {
+              onResizeStart(e, { node: e.currentTarget, size: { width: realWidth, height: 0 }, handle: "e" });
+            }
+          }
+        }
+      ),
+      onResize: handleResize,
+      onResizeStart: handleResizeStart,
+      onResizeStop: handleResizeStop,
+      draggableOpts: { enableUserSelectHack: false },
+      axis: "x",
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { ...restProps, className: (0, import_classnames.default)(className, styles["resizable-th"]), style: { ...restProps.style, width: realWidth } })
+    }
+  );
+};
+var useResizableColumns = (columns, resizable = true, resizedWidthsProp, setResizedWidthsProp, tableRef) => {
+  const [internalResizedWidths, setInternalResizedWidths] = (0, import_react.useState)({});
+  const [minWidths, setMinWidths] = (0, import_react.useState)({});
+  const resizedWidths = resizedWidthsProp || internalResizedWidths;
+  const setResizedWidths = setResizedWidthsProp || setInternalResizedWidths;
+  const handleResize = (0, import_ahooks.useMemoizedFn)((key) => (_, { size }) => {
+  });
+  const handleResizeStop = (0, import_ahooks.useMemoizedFn)((key) => (_, { size }) => {
+    setResizedWidths((prev) => ({
+      ...prev,
+      [key]: size.width
+    }));
+  });
+  const handleResizeStart = (0, import_ahooks.useMemoizedFn)(() => {
+    if (!(tableRef == null ? void 0 : tableRef.current))
+      return;
+    const thElements = tableRef.current.querySelectorAll("th[data-column-key]");
+    if (!thElements || thElements.length === 0)
+      return;
+    const currentWidths = {};
+    thElements.forEach((th) => {
+      const key = th.getAttribute("data-column-key");
+      const width = th.getBoundingClientRect().width;
+      if (key && width) {
+        currentWidths[key] = width;
+      }
+    });
+    setResizedWidths((prev) => {
+      const next = { ...currentWidths, ...prev };
+      const isSame = Object.keys(next).every((k) => next[k] === prev[k]) && Object.keys(prev).length === Object.keys(next).length;
+      if (isSame)
+        return prev;
+      return next;
+    });
+    setMinWidths((prev) => {
+      const next = { ...prev };
+      let hasChange = false;
+      Object.keys(currentWidths).forEach((key) => {
+        if (next[key] === void 0) {
+          next[key] = currentWidths[key];
+          hasChange = true;
+        }
+      });
+      return hasChange ? next : prev;
+    });
+  });
+  const resizableColumns = (0, import_react.useMemo)(() => {
+    if (!resizable || !columns)
+      return columns;
+    return columns.map((col, index) => {
+      const key = col.key || col.dataIndex || `col-${index}`;
+      if (col.valueType === "option") {
+        return col;
+      }
+      const width = resizedWidths[key] ?? col.width;
+      const calculatedMinWidth = col.calculatedWidth || 0;
+      const autoMinWidth = minWidths[key] || 0;
+      const minWidth = Math.max(calculatedMinWidth, autoMinWidth);
+      return {
+        ...col,
+        width,
+        // 应用调整后的宽度
+        onHeaderCell: (column) => ({
+          width,
+          // 传递给 ResizableTitle
+          minWidth,
+          onResize: handleResize(key),
+          onResizeStart: handleResizeStart,
+          onResizeStop: handleResizeStop(key),
+          "data-column-key": key,
+          // 用于在 DOM 中查找
+          ...col.onHeaderCell ? col.onHeaderCell(column) : null
+        })
+      };
+    });
+  }, [columns, resizable, resizedWidths, handleResize, handleResizeStart, handleResizeStop]);
+  const components = (0, import_react.useMemo)(() => {
+    if (!resizable)
+      return void 0;
+    return {
+      header: {
+        cell: ResizableTitle
+      }
+    };
+  }, [resizable]);
+  return {
+    columns: resizableColumns,
+    components,
+    resizedWidths
+  };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useResizableColumns
+});
+//# sourceMappingURL=useResizableColumns.js.map

package/dist/creek-table/hooks/useResizableColumns.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/creek-table/hooks/useResizableColumns.tsx"],
+  "sourcesContent": ["import { ProColumns } from '@ant-design/pro-components';\nimport { useMemoizedFn } from 'ahooks';\nimport { createStyles } from 'antd-style';\nimport classnames from 'classnames';\nimport React, { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { Resizable, ResizeCallbackData } from 'react-resizable';\n\ninterface ResizableTitleProps extends React.HTMLAttributes<HTMLTableCellElement> {\n  onResize?: (e: React.SyntheticEvent, data: ResizeCallbackData) => void;\n  onResizeStart?: (e: React.SyntheticEvent, data: ResizeCallbackData) => void;\n  onResizeStop?: (e: React.SyntheticEvent, data: ResizeCallbackData) => void;\n  width?: number | string;\n  minWidth?: number;\n}\n\n// 样式定义\nconst useStyles = createStyles(({ token }) => ({\n  'resizable-handle': {\n    position: 'absolute',\n    right: -5,\n    bottom: 0,\n    zIndex: 10,\n    width: 10,\n    height: '100%',\n    cursor: 'col-resize',\n    touchAction: 'none',\n    userSelect: 'none',\n    \n    // 添加一个小竖线作为视觉提示\n    '&::after': {\n      content: '\"\"',\n      position: 'absolute',\n      top: 0,\n      bottom: 0,\n      left: '50%',\n      width: 1,\n      opacity: 0,\n      transition: 'all 0.3s',\n      transform: 'translateX(-50%)',\n    },\n\n    '&:hover::after': {\n      opacity: 1,\n    },\n\n    '&:active::after': {\n      opacity: 1,\n    },\n  },\n  'resizable-th': {\n    position: 'relative',\n    '&:hover .resizable-handle::after': {\n      opacity: 0.5,\n    },\n  },\n}));\n\nconst ResizableTitle = (props: ResizableTitleProps) => {\n  const { onResize, onResizeStart, onResizeStop, width, className, minWidth, ...restProps } = props;\n  const { styles } = useStyles();\n\n  // 2. 如果 width 不是数字，尝试测量（降级处理）\n  const ref = useRef<HTMLTableCellElement>(null);\n  const [realWidth, setRealWidth] = useState<number | undefined>(undefined);\n\n  // 本地状态，用于控制拖动过程中的平滑更新\n  // 初始化为 props.width (如果是数字) 或 undefined\n  const [localWidth, setLocalWidth] = useState<number | undefined>(typeof width === 'number' ? width : undefined);\n  const [isResizing, setIsResizing] = useState(false);\n\n  // 当外部 width 变化且非拖动状态时，同步到内部\n  useEffect(() => {\n    if (!isResizing && typeof width === 'number') {\n      setLocalWidth(width);\n    }\n  }, [width, isResizing]);\n\n  useLayoutEffect(() => {\n    if (ref.current) {\n      const w = ref.current.getBoundingClientRect().width;\n      setRealWidth(w);\n      // 如果没有传入具体数字宽度，初始化 localWidth 为测量值\n      if (typeof width !== 'number') {\n        setLocalWidth(w);\n      }\n    }\n  }, []); // 只在挂载时测量一次\n\n  const handleResizeStart = (e: React.SyntheticEvent, data: ResizeCallbackData) => {\n    setIsResizing(true);\n    // 增加全局样式防止选中文字\n    document.body.style.userSelect = 'none';\n    document.body.style.cursor = 'col-resize';\n    if (onResizeStart) {\n      onResizeStart(e, data);\n    }\n  };\n\n  const handleResizeStop = (e: React.SyntheticEvent, data: ResizeCallbackData) => {\n    setIsResizing(false);\n    document.body.style.userSelect = '';\n    document.body.style.cursor = '';\n    // 拖动结束时，确保最后一次更新传递出去\n    if (onResizeStop) {\n      onResizeStop(e, data);\n    }\n  };\n\n  const handleResize = (e: React.SyntheticEvent, data: ResizeCallbackData) => {\n    // 1. 立即更新本地状态，保证 handle 跟手\n    setLocalWidth(data.size.width);\n    \n    // 2. 调用外部 onResize (可能会被节流)\n    if (onResize) {\n      onResize(e, data);\n    }\n  };\n\n  // 1. 如果 width 是数字，直接使用，避免任何 state/effect 开销\n  // 修改逻辑：只要有 localWidth 就使用 Resizable\n  const currentWidth = localWidth ?? realWidth;\n\n  if (typeof currentWidth === 'number' && onResize) {\n    return (\n      <Resizable\n        width={currentWidth}\n        height={0}\n        minConstraints={[minWidth || 0, 0]}\n        handle={\n          <span\n            className={classnames(styles['resizable-handle'], 'resizable-handle')}\n            onClick={(e) => {\n              e.stopPropagation();\n            }}\n            onMouseEnter={(e) => {\n               // 鼠标进入 handle 时触发一次 onResizeStart，用于预先锁定其他列宽度\n               // 这样可以避免在 onResizeStart (mousedown) 时触发重渲染导致 drag 失败\n               if (onResizeStart) {\n                 // 构造一个假的 event 和 data，因为这里只需要触发锁定逻辑\n                 onResizeStart(e, { node: e.currentTarget, size: { width: currentWidth, height: 0 }, handle: 'e' as any });\n               }\n            }}\n          />\n        }\n        onResize={handleResize}\n        onResizeStart={handleResizeStart}\n        onResizeStop={handleResizeStop}\n        draggableOpts={{ enableUserSelectHack: false }} // 我们自己处理了 userSelect\n        axis=\"x\"\n      >\n        <th {...restProps} className={classnames(className, styles['resizable-th'])} style={{ ...restProps.style, width: currentWidth }} />\n      </Resizable>\n    );\n  }\n\n  if (!onResize || !realWidth) {\n    return <th {...restProps} className={className} ref={ref} />;\n  }\n\n  // Fallback (虽然逻辑上可能不需要了，保留以防万一)\n  return (\n    <Resizable\n      width={realWidth}\n      height={0}\n      minConstraints={[minWidth || 0, 0]}\n      handle={\n        <span\n          className={classnames(styles['resizable-handle'], 'resizable-handle')}\n          onClick={(e) => {\n            e.stopPropagation();\n          }}\n          onMouseEnter={(e) => {\n             if (onResizeStart) {\n               onResizeStart(e, { node: e.currentTarget, size: { width: realWidth, height: 0 }, handle: 'e' as any });\n             }\n          }}\n        />\n      }\n      onResize={handleResize}\n      onResizeStart={handleResizeStart}\n      onResizeStop={handleResizeStop}\n      draggableOpts={{ enableUserSelectHack: false }}\n      axis=\"x\"\n    >\n      <th {...restProps} className={classnames(className, styles['resizable-th'])} style={{ ...restProps.style, width: realWidth }} />\n    </Resizable>\n  );\n};\n\nexport const useResizableColumns = <T, ValueType>(\n  columns: ProColumns<T, ValueType>[] | undefined,\n  resizable: boolean = true,\n  resizedWidthsProp?: Record<string, number>,\n  setResizedWidthsProp?: React.Dispatch<React.SetStateAction<Record<string, number>>>,\n  tableRef?: React.RefObject<HTMLDivElement>,\n): { \n  columns: ProColumns<T, ValueType>[] | undefined;\n  components: { header: { cell: React.ComponentType<ResizableTitleProps> } } | undefined;\n  resizedWidths: Record<string, number>;\n} => {\n  // 存储用户手动调整的列宽\n  const [internalResizedWidths, setInternalResizedWidths] = useState<Record<string, number>>({});\n  // 存储列的初始自动计算宽度，作为最小宽度限制\n  const [minWidths, setMinWidths] = useState<Record<string, number>>({});\n\n  const resizedWidths = resizedWidthsProp || internalResizedWidths;\n  const setResizedWidths = setResizedWidthsProp || setInternalResizedWidths;\n\n  // 性能优化：Resize 过程中不更新 state，只在 Stop 时更新\n  // handleResize 仅用于 potential future usage (e.g. events) or removed if not needed\n  const handleResize = useMemoizedFn((key: string) => (_: React.SyntheticEvent, { size }: ResizeCallbackData) => {\n     // Intentionally empty or minimal logic to avoid re-renders during drag\n     // ResizableTitle handles visual updates locally\n  });\n  \n  const handleResizeStop = useMemoizedFn((key: string) => (_: React.SyntheticEvent, { size }: ResizeCallbackData) => {\n    setResizedWidths((prev) => ({\n        ...prev,\n        [key]: size.width,\n    }));\n  });\n\n  const handleResizeStart = useMemoizedFn(() => {\n    // 只有当 tableRef 存在时才能获取当前宽度\n    if (!tableRef?.current) return;\n\n    // 查找所有表头单元格\n    const thElements = tableRef.current.querySelectorAll('th[data-column-key]');\n    if (!thElements || thElements.length === 0) return;\n\n    const currentWidths: Record<string, number> = {};\n    thElements.forEach((th) => {\n      const key = th.getAttribute('data-column-key');\n      const width = th.getBoundingClientRect().width;\n      if (key && width) {\n        currentWidths[key] = width;\n      }\n    });\n\n    setResizedWidths((prev) => {\n      // 只有当之前的状态中缺少某些列的宽度时，才合并当前宽度\n      // 这样可以避免覆盖用户已经调整过的值，同时填补未调整列的宽度\n      // 实际上，我们希望一旦开始 resize，所有列都有明确的宽度\n      const next = { ...currentWidths, ...prev };\n      \n      // 简单的浅比较，如果内容没变就不更新，避免重渲染\n      const isSame = Object.keys(next).every(k => next[k] === prev[k]) && Object.keys(prev).length === Object.keys(next).length;\n      if (isSame) return prev;\n\n      return next;\n    });\n\n    // 记录初始宽度作为 minWidth\n    setMinWidths((prev) => {\n      const next = { ...prev };\n      let hasChange = false;\n      Object.keys(currentWidths).forEach((key) => {\n        // 只有当没有记录该列的最小宽度时才记录\n        // 这样可以确保 minWidth 始终是第一次捕获时的宽度（即 auto 宽度）\n        if (next[key] === undefined) {\n          next[key] = currentWidths[key];\n          hasChange = true;\n        }\n      });\n      return hasChange ? next : prev;\n    });\n  });\n\n  const resizableColumns = useMemo(() => {\n    if (!resizable || !columns) return columns;\n\n    return columns.map((col, index) => {\n      // 优先使用 key，如果没有则使用 dataIndex，如果都没有则使用 index\n      const key = (col.key as string) || (col.dataIndex as string) || `col-${index}`;\n      \n      // 针对 valueType 为 'option' 的操作列，不启用 resizing\n      if (col.valueType === 'option') {\n        return col;\n      }\n      \n      // 只有当存在 resizedWidths[key] 时才使用它，否则完全依赖外部传入的 col.width（即 useAutoWidthColumns 计算出的宽度）\n      const width = resizedWidths[key] ?? col.width;\n\n      // 从 col 中获取 calculatedWidth 作为 minWidth\n      const calculatedMinWidth = (col as any).calculatedWidth || 0;\n      // 使用捕获到的 auto 宽度作为最小宽度，如果没有则使用 0\n      const autoMinWidth = minWidths[key] || 0;\n      \n      // 最终的 minWidth 取两者的最大值，确保至少是 auto 宽度\n      const minWidth = Math.max(calculatedMinWidth, autoMinWidth);\n\n      return {\n        ...col,\n        width, // 应用调整后的宽度\n        onHeaderCell: (column: any) => ({\n          width: width, // 传递给 ResizableTitle\n          minWidth: minWidth,\n          onResize: handleResize(key),\n          onResizeStart: handleResizeStart,\n          onResizeStop: handleResizeStop(key),\n          'data-column-key': key, // 用于在 DOM 中查找\n          ...(col.onHeaderCell ? col.onHeaderCell(column) : null),\n        }) as React.HTMLAttributes<HTMLElement>,\n      };\n    });\n  }, [columns, resizable, resizedWidths, handleResize, handleResizeStart, handleResizeStop]);\n\n  const components = useMemo(() => {\n    if (!resizable) return undefined;\n\n    return {\n      header: {\n        cell: ResizableTitle,\n      },\n    };\n  }, [resizable]);\n\n  return {\n    columns: resizableColumns,\n    components,\n    resizedWidths,\n  };\n};\n"],
+  "mappings": "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",
+  "names": ["classnames"]
+}

package/dist/creek-table/hooks/useStatusColumns.d.ts

@@ -0,0 +1,2 @@
+import { ProColumns } from '@ant-design/pro-components';
+export declare const useStatusColumns: <T, ValueType>(columns?: ProColumns<T, ValueType>[]) => ProColumns<T, ValueType>[] | undefined;

package/dist/creek-table/hooks/useStatusColumns.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useStatusColumns.d.ts","sourceRoot":"","sources":["../../../src/creek-table/hooks/useStatusColumns.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AA+HxD,eAAO,MAAM,gBAAgB,2BACjB,WAAW,CAAC,EAAE,SAAS,CAAC,EAAE,2CA2HrC,CAAC"}

package/dist/creek-table/hooks/useStatusColumns.js

@@ -0,0 +1,215 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/creek-table/hooks/useStatusColumns.tsx
+var useStatusColumns_exports = {};
+__export(useStatusColumns_exports, {
+  useStatusColumns: () => useStatusColumns
+});
+module.exports = __toCommonJS(useStatusColumns_exports);
+var import_antd = require("antd");
+var import_lodash = require("lodash");
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var PRESET_COLORS = [
+  "blue",
+  "green",
+  "volcano",
+  "orange",
+  "gold",
+  "lime",
+  "cyan",
+  "geekblue",
+  "purple",
+  "magenta"
+];
+var SEMANTIC_STATUS_MAP = {
+  // Success / Green
+  success: "success",
+  ok: "success",
+  pass: "success",
+  complete: "success",
+  finish: "success",
+  online: "success",
+  active: "success",
+  enable: "success",
+  published: "success",
+  open: "success",
+  正常: "success",
+  成功: "success",
+  完成: "success",
+  通过: "success",
+  启用: "success",
+  在线: "success",
+  发布: "success",
+  开启: "success",
+  已发布: "success",
+  // Error / Red
+  fail: "error",
+  error: "error",
+  reject: "error",
+  stop: "error",
+  close: "error",
+  offline: "error",
+  disable: "error",
+  banned: "error",
+  exception: "error",
+  blocked: "error",
+  失败: "error",
+  错误: "error",
+  拒绝: "error",
+  停止: "error",
+  关闭: "error",
+  离线: "error",
+  禁用: "error",
+  异常: "error",
+  封禁: "error",
+  // Processing / Blue
+  process: "processing",
+  running: "processing",
+  pending: "processing",
+  waiting: "processing",
+  loading: "processing",
+  init: "processing",
+  doing: "processing",
+  进行中: "processing",
+  处理中: "processing",
+  等待: "processing",
+  加载: "processing",
+  初始化: "processing",
+  启动: "processing",
+  运行中: "processing",
+  // Warning / Warning
+  warn: "warning",
+  timeout: "warning",
+  expire: "warning",
+  risk: "warning",
+  abnormal: "warning",
+  警告: "warning",
+  超时: "warning",
+  过期: "warning",
+  风险: "warning",
+  // Default
+  default: "default",
+  normal: "default",
+  unknown: "default",
+  默认: "default",
+  未知: "default"
+};
+var inferStatusColor = (key, text) => {
+  const normalizedKey = String(key).toLowerCase();
+  const normalizedText = String(text).toLowerCase();
+  for (const keyword in SEMANTIC_STATUS_MAP) {
+    if (normalizedKey.includes(keyword)) {
+      return SEMANTIC_STATUS_MAP[keyword];
+    }
+  }
+  for (const keyword in SEMANTIC_STATUS_MAP) {
+    if (normalizedText.includes(keyword)) {
+      return SEMANTIC_STATUS_MAP[keyword];
+    }
+  }
+  let hash = 0;
+  for (let i = 0; i < normalizedKey.length; i++) {
+    hash = normalizedKey.charCodeAt(i) + ((hash << 5) - hash);
+  }
+  const index = Math.abs(hash) % PRESET_COLORS.length;
+  return PRESET_COLORS[index];
+};
+var useStatusColumns = (columns) => {
+  return (0, import_react.useMemo)(() => {
+    return columns == null ? void 0 : columns.map((col) => {
+      var _a;
+      if (col.render) {
+        return col;
+      }
+      if (!col.valueEnum) {
+        return col;
+      }
+      const statusRender = (_a = col.fieldProps) == null ? void 0 : _a.statusRender;
+      if (statusRender === "none") {
+        return col;
+      }
+      return {
+        ...col,
+        render: (dom, entity, index, action, schema) => {
+          const valueEnum = schema == null ? void 0 : schema.valueEnum;
+          if (!valueEnum) {
+            return dom;
+          }
+          const dataIndex = col.dataIndex || col.key;
+          const rawValue = typeof dataIndex === "string" || Array.isArray(dataIndex) ? (0, import_lodash.get)(entity, dataIndex) : void 0;
+          if (rawValue === void 0 || rawValue === null) {
+            return dom;
+          }
+          let enumItem = null;
+          if (valueEnum instanceof Map) {
+            enumItem = valueEnum.get(rawValue);
+            if (!enumItem && typeof rawValue === "number") {
+              enumItem = valueEnum.get(String(rawValue));
+            } else if (!enumItem && typeof rawValue === "string") {
+              enumItem = valueEnum.get(Number(rawValue));
+            }
+          } else {
+            enumItem = valueEnum[rawValue];
+          }
+          if (!enumItem) {
+            return dom;
+          }
+          if (enumItem.color && statusRender !== "badge") {
+            return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Tag, { color: enumItem.color, style: { margin: 0 }, children: enumItem.text || dom });
+          }
+          if (enumItem.status && statusRender !== "tag") {
+            const status = String(enumItem.status).toLowerCase();
+            return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Badge, { status, text: enumItem.text || dom });
+          }
+          if (enumItem.status === null || enumItem.status === false) {
+            return dom;
+          }
+          const inferred = inferStatusColor(
+            rawValue,
+            enumItem.text || String(rawValue)
+          );
+          if (statusRender === "tag") {
+            let tagColor = inferred;
+            if (inferred === "processing")
+              tagColor = "blue";
+            if (inferred === "error")
+              tagColor = "error";
+            if (inferred === "success")
+              tagColor = "success";
+            if (inferred === "warning")
+              tagColor = "warning";
+            if (inferred === "default")
+              tagColor = "default";
+            return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Tag, { color: tagColor, style: { margin: 0 }, children: enumItem.text || dom });
+          }
+          if (["success", "processing", "error", "default", "warning"].includes(inferred)) {
+            return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Badge, { status: inferred, text: enumItem.text || dom });
+          }
+          return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Badge, { color: inferred, text: enumItem.text || dom });
+        }
+      };
+    });
+  }, [columns]);
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useStatusColumns
+});
+//# sourceMappingURL=useStatusColumns.js.map

package/dist/creek-table/hooks/useStatusColumns.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/creek-table/hooks/useStatusColumns.tsx"],
+  "sourcesContent": ["import { ProColumns } from '@ant-design/pro-components';\nimport { Badge, Tag } from 'antd';\nimport { get } from 'lodash';\nimport React, { useMemo } from 'react';\n\n// Preset colors for automatic assignment when no semantic match is found\nconst PRESET_COLORS = [\n  'blue',\n  'green',\n  'volcano',\n  'orange',\n  'gold',\n  'lime',\n  'cyan',\n  'geekblue',\n  'purple',\n  'magenta',\n];\n\n// Semantic keywords mapping\nconst SEMANTIC_STATUS_MAP: Record<string, string> = {\n  // Success / Green\n  success: 'success',\n  ok: 'success',\n  pass: 'success',\n  complete: 'success',\n  finish: 'success',\n  online: 'success',\n  active: 'success',\n  enable: 'success',\n  published: 'success',\n  open: 'success',\n  正常: 'success',\n  成功: 'success',\n  完成: 'success',\n  通过: 'success',\n  启用: 'success',\n  在线: 'success',\n  发布: 'success',\n  开启: 'success',\n  已发布: 'success',\n\n  // Error / Red\n  fail: 'error',\n  error: 'error',\n  reject: 'error',\n  stop: 'error',\n  close: 'error',\n  offline: 'error',\n  disable: 'error',\n  banned: 'error',\n  exception: 'error',\n  blocked: 'error',\n  失败: 'error',\n  错误: 'error',\n  拒绝: 'error',\n  停止: 'error',\n  关闭: 'error',\n  离线: 'error',\n  禁用: 'error',\n  异常: 'error',\n  封禁: 'error',\n\n  // Processing / Blue\n  process: 'processing',\n  running: 'processing',\n  pending: 'processing',\n  waiting: 'processing',\n  loading: 'processing',\n  init: 'processing',\n  doing: 'processing',\n  进行中: 'processing',\n  处理中: 'processing',\n  等待: 'processing',\n  加载: 'processing',\n  初始化: 'processing',\n  启动: 'processing',\n  运行中: 'processing',\n\n  // Warning / Warning\n  warn: 'warning',\n  timeout: 'warning',\n  expire: 'warning',\n  risk: 'warning',\n  abnormal: 'warning',\n  警告: 'warning',\n  超时: 'warning',\n  过期: 'warning',\n  风险: 'warning',\n\n  // Default\n  default: 'default',\n  normal: 'default',\n  unknown: 'default',\n  默认: 'default',\n  未知: 'default',\n};\n\n// Helper to determine status color based on text or key\nconst inferStatusColor = (key: string | number, text: string): string => {\n  const normalizedKey = String(key).toLowerCase();\n  const normalizedText = String(text).toLowerCase();\n\n  // 1. Try to match key first\n  for (const keyword in SEMANTIC_STATUS_MAP) {\n    if (normalizedKey.includes(keyword)) {\n      return SEMANTIC_STATUS_MAP[keyword];\n    }\n  }\n\n  // 2. Try to match text\n  for (const keyword in SEMANTIC_STATUS_MAP) {\n    if (normalizedText.includes(keyword)) {\n      return SEMANTIC_STATUS_MAP[keyword];\n    }\n  }\n\n  // 3. Fallback to deterministic hash color\n  // Use a simple hash of the key to pick a color from PRESET_COLORS\n  let hash = 0;\n  for (let i = 0; i < normalizedKey.length; i++) {\n    hash = normalizedKey.charCodeAt(i) + ((hash << 5) - hash);\n  }\n  const index = Math.abs(hash) % PRESET_COLORS.length;\n  return PRESET_COLORS[index];\n};\n\nexport const useStatusColumns = <T, ValueType>(\n  columns?: ProColumns<T, ValueType>[],\n) => {\n  return useMemo(() => {\n    return columns?.map((col) => {\n      // If user has custom render, we respect it and do nothing\n      if (col.render) {\n        return col;\n      }\n\n      // If no valueEnum, we do nothing\n      if (!col.valueEnum) {\n        return col;\n      }\n\n      // Check fieldProps for explicit status render mode: 'tag' | 'badge' | 'none' | undefined (auto)\n      // We use fieldProps because it's a standard place to put custom column props without TS errors\n      const statusRender = (col.fieldProps as any)?.statusRender;\n    \n\n      if (statusRender === 'none') {\n        return col;\n      }\n\n      // We wrap the render function to support Tag and Badge automatically based on valueEnum properties\n      return {\n        ...col,\n        render: (\n          dom: React.ReactNode,\n          entity: T,\n          index: number,\n          action: any,\n          schema: any,\n        ) => {\n          const valueEnum = schema?.valueEnum;\n          if (!valueEnum) {\n            return dom;\n          }\n\n          // Get raw value\n          const dataIndex = col.dataIndex || col.key;\n          // dataIndex can be array or string\n          const rawValue =\n            typeof dataIndex === 'string' || Array.isArray(dataIndex)\n              ? get(entity, dataIndex as any)\n              : undefined;\n\n          if (rawValue === undefined || rawValue === null) {\n            return dom;\n          }\n\n          // valueEnum can be Map or Object\n          let enumItem = null;\n          if (valueEnum instanceof Map) {\n            enumItem = valueEnum.get(rawValue);\n            // Try string key if number key fails, or vice versa\n            if (!enumItem && typeof rawValue === 'number') {\n              enumItem = valueEnum.get(String(rawValue));\n            } else if (!enumItem && typeof rawValue === 'string') {\n              enumItem = valueEnum.get(Number(rawValue));\n            }\n          } else {\n            enumItem = valueEnum[rawValue as string];\n          }\n\n          if (!enumItem) {\n            return dom;\n          }\n\n          // 1. If color is present, render Tag (unless forced to badge)\n          if (enumItem.color && statusRender !== 'badge') {\n            return (\n              <Tag color={enumItem.color} style={{ margin: 0 }}>\n                {enumItem.text || dom}\n              </Tag>\n            );\n          }\n\n          // 2. If status is present, render Badge (unless forced to tag)\n          // ProTable usually handles this, but since we overrode render, we must handle it\n          if (enumItem.status && statusRender !== 'tag') {\n            const status = String(enumItem.status).toLowerCase();\n            return <Badge status={status as any} text={enumItem.text || dom} />;\n          }\n\n          // 3. If neither is present, try to infer color automatically\n          // Only infer if it's NOT explicitly set to null/false (in case user wants plain text)\n          if (enumItem.status === null || enumItem.status === false) {\n            return dom;\n          }\n          const inferred = inferStatusColor(\n            rawValue,\n            enumItem.text || String(rawValue),\n          );\n\n          // Force Tag mode\n          if (statusRender === 'tag') {\n             // Map semantic status to actual colors for Tag\n            let tagColor = inferred;\n            if (inferred === 'processing') tagColor = 'blue';\n            if (inferred === 'error') tagColor = 'error';\n            if (inferred === 'success') tagColor = 'success';\n            if (inferred === 'warning') tagColor = 'warning';\n            if (inferred === 'default') tagColor = 'default';\n\n            return (\n                <Tag color={tagColor} style={{ margin: 0 }}>\n                  {enumItem.text || dom}\n                </Tag>\n            );\n          }\n\n          // Default / Force Badge mode\n          // If it is a semantic status, use status prop\n          if (['success', 'processing', 'error', 'default', 'warning'].includes(inferred)) {\n            return <Badge status={inferred as any} text={enumItem.text || dom} />;\n          }\n\n          // Otherwise use color prop (for preset colors like 'volcano', 'gold', etc.)\n          return <Badge color={inferred} text={enumItem.text || dom} />;\n        },\n      } as ProColumns<T, ValueType>;\n    });\n  }, [columns]);\n};\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/creek-table/hooks/useTableOptions.d.ts

@@ -0,0 +1,15 @@
+import { ParamsType, ProTableProps } from '@ant-design/pro-components';
+/**
+ * Hook to manage ProTable options logic including density and settings
+ *
+ * @param options User provided options configuration
+ * @param size User provided size (density)
+ * @returns { finalOptions, tableSize, setTableSize }
+ */
+export declare const useTableOptions: <T extends ParamsType, U extends ParamsType, ValueType = "text">(options: ProTableProps<T, U, ValueType>['options'], size?: ProTableProps<T, U, ValueType>['size'], optionsRender?: ProTableProps<T, U, ValueType>['optionsRender']) => {
+    finalOptions: ProTableProps<T, U, ValueType>['options'];
+    tableSize: ProTableProps<T, U, ValueType>['size'];
+    setTableSize: React.Dispatch<React.SetStateAction<ProTableProps<T, U, ValueType>['size']>>;
+    showDensity: boolean;
+    finalOptionsRender: ProTableProps<T, U, ValueType>['optionsRender'];
+};

package/dist/creek-table/hooks/useTableOptions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableOptions.d.ts","sourceRoot":"","sources":["../../../src/creek-table/hooks/useTableOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAKvE;;;;;;GAMG;AACH,eAAO,MAAM,eAAe,4EACjB,cAAc,CAAC,EAAE,CAAC,EAAE,SAAS,CAAC,CAAC,SAAS,CAAC,SAC3C,cAAc,CAAC,EAAE,CAAC,EAAE,SAAS,CAAC,CAAC,MAAM,CAAC,kBAC7B,cAAc,CAAC,EAAE,CAAC,EAAE,SAAS,CAAC,CAAC,eAAe,CAAC;kBAEjD,cAAc,CAAC,EAAE,CAAC,EAAE,SAAS,CAAC,CAAC,SAAS,CAAC;eAC5C,cAAc,CAAC,EAAE,CAAC,EAAE,SAAS,CAAC,CAAC,MAAM,CAAC;kBACnC,MAAM,QAAQ,CAAC,MAAM,cAAc,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;iBAC7E,OAAO;wBACA,cAAc,CAAC,EAAE,CAAC,EAAE,SAAS,CAAC,CAAC,eAAe,CAAC;CA2DpE,CAAC"}