@zat-design/sisyphus-react 4.6.5 → 4.7.0-beta.1

package/es/ProEditTable/components/Summary/index.js

@@ -4,18 +4,15 @@ import { tools } from "@zat-design/utils";
 import { valueTypeRender } from "../../../ProUtils/utils";
 const { calc } = tools;
 const formatSummaryColumns = (columns, { rowSelection }) => {
-  const nextColumns = [...columns];
-  if (!rowSelection) {
-    nextColumns.forEach((column) => {
-      column.index = calc(column.index ?? 0, "-", 1);
-    });
-  }
+  const nextColumns = columns.map((column) => ({
+    ...column,
+    index: rowSelection ? column.index : calc(column.index ?? 0, "-", 1)
+  }));
   const { index: firstIndex } = (nextColumns == null ? void 0 : nextColumns[0]) || {};
-  if (firstIndex !== 0) {
-    const colSpan = calc(firstIndex ?? 0, "-", 1);
+  if (firstIndex > 0) {
     nextColumns.unshift({
       index: 0,
-      colSpan: colSpan === 0 ? void 0 : colSpan
+      colSpan: firstIndex === 1 ? void 0 : firstIndex
     });
   }
   return nextColumns;

package/es/ProForm/components/combination/Group/component/ComRender.js

@@ -47,6 +47,7 @@ const ComRender = (props) => {
   const mergedGetValueProps = getValueProps || ((val) => ({ [valuePropName]: val }));
   const nextProps = mergedGetValueProps(fieldProps.value);
   const componentProps = omit({ ...fieldProps, ...rest, ...nextProps }, ["onFieldChange"]);
+  const childContext = { ...contextProps, name, valueType, type, isView };
   const componentElementProps = (_a = props == null ? void 0 : props.component) == null ? void 0 : _a.props;
   const isSeparator = (componentElementProps == null ? void 0 : componentElementProps.className) === "group-separator";
   if (isSeparator && isView) {
@@ -57,7 +58,7 @@ const ComRender = (props) => {
     ] });
   }
   if (viewRender && isView) {
-    return /* @__PURE__ */ jsx(FieldProvider, { value: { ...contextProps, valueType, type, isView }, children: viewRender(componentProps) });
+    return /* @__PURE__ */ jsx(FieldProvider, { value: childContext, children: viewRender(componentProps) });
   }
   const Component = component ? React.cloneElement(component, { ...componentProps }) : /* @__PURE__ */ jsx(TypeComponent, { ...componentProps });
   const renderComponent = getComRender(Component, props, componentProps);
@@ -66,6 +67,8 @@ const ComRender = (props) => {
       name,
       className: formItemClassName,
       style: formItemStyle,
+      // Group controls the input value. Do not inject it into FieldProvider.value.
+      getValueProps: () => ({}),
       ...isView ? {} : { required: rest == null ? void 0 : rest.required, rules: rest == null ? void 0 : rest.rules }
     };
     if (dependencies && dependencies.length > 0) {
@@ -89,13 +92,13 @@ const ComRender = (props) => {
             return hasChanged;
           },
           noStyle: true,
-          children: () => /* @__PURE__ */ jsx(Form.Item, { ...formItemProps, children: /* @__PURE__ */ jsx(FieldProvider, { value: { ...contextProps, valueType, type, isView }, children: renderComponent }) })
+          children: () => /* @__PURE__ */ jsx(Form.Item, { ...formItemProps, children: /* @__PURE__ */ jsx(FieldProvider, { value: childContext, children: renderComponent }) })
         }
       );
     }
-    return /* @__PURE__ */ jsx(Form.Item, { ...formItemProps, children: /* @__PURE__ */ jsx(FieldProvider, { value: { ...contextProps, valueType, type, isView }, children: renderComponent }) });
+    return /* @__PURE__ */ jsx(Form.Item, { ...formItemProps, children: /* @__PURE__ */ jsx(FieldProvider, { value: childContext, children: renderComponent }) });
   }
-  return /* @__PURE__ */ jsx(FieldProvider, { value: { ...contextProps, valueType, type, isView }, children: renderComponent });
+  return /* @__PURE__ */ jsx(FieldProvider, { value: childContext, children: renderComponent });
 };
 var ComRender_default = ComRender;
 export {

package/es/ProForm/index.js

@@ -169,19 +169,28 @@ const ProForm = (props, ref) => {
   });
   const footerRender = () => {
     let footerEle = null;
+    let alignSearchFooter = false;
     if (isView || disabled) {
       footerEle = null;
     } else if (React.isValidElement(footer)) {
       footerEle = footer;
     } else if (footer === void 0 || footer || isObject(footer)) {
       footerEle = defaultFooter(footer);
+      alignSearchFooter = mode === "search";
     }
     const expandEle = expandRender();
     const hasElement = footerEle || expandEle;
-    return hasElement ? /* @__PURE__ */ jsx(Col, { ...colProps, className: footerCls, children: /* @__PURE__ */ jsxs(Space, { align: "center", children: [
-      footerEle,
-      expandEle
-    ] }) }) : null;
+    return hasElement ? /* @__PURE__ */ jsx(
+      Col,
+      {
+        ...colProps,
+        className: classnames(footerCls, { "pro-form-search-footer": alignSearchFooter }),
+        children: /* @__PURE__ */ jsxs(Space, { align: "center", children: [
+          footerEle,
+          expandEle
+        ] })
+      }
+    ) : null;
   };
   if ((localStorage == null ? void 0 : localStorage.locale) && localStorage.locale !== "zh-CN") {
     if (span === 24) {

package/es/ProForm/style/index.less

@@ -328,6 +328,12 @@
     }
   }
 
+  > .@{ant-prefix}-row > .pro-form-search-footer {
+    display: flex;
+    justify-content: flex-end;
+    margin-inline-start: auto;
+  }
+
   .pro-form-view-container {
     display: inline-block;
     word-break: break-all;

package/es/ProTable/components/RenderTableHeader/index.js

@@ -1,9 +1,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Button } from "antd";
+import { Button, Tooltip } from "antd";
 import { ReactSVG } from "react-svg";
 import { ProTreeModal } from "../../../index";
 const RenderTableHeader = (props) => {
-  var _a, _b, _c;
+  var _a, _b, _c, _d, _e;
   const { dataSource } = props;
   const {
     headerRender,
@@ -23,18 +23,20 @@ const RenderTableHeader = (props) => {
   return /* @__PURE__ */ jsxs("div", { className: "column-config", children: [
     /* @__PURE__ */ jsx("div", { className: "left-contain", children: headerRender ? typeof headerRender === "function" ? headerRender() : headerRender : null }),
     /* @__PURE__ */ jsxs("div", { className: "right-actions", children: [
-      resizeColumn && /* @__PURE__ */ jsx(
+      resizeColumn && /* @__PURE__ */ jsx(Tooltip, { title: (_a = locale == null ? void 0 : locale.ProTable) == null ? void 0 : _a.resetColumnWidth, children: /* @__PURE__ */ jsx(
         Button,
         {
+          "aria-label": (_b = locale == null ? void 0 : locale.ProTable) == null ? void 0 : _b.resetColumnWidth,
+          className: "table-header-icon-btn",
           icon: /* @__PURE__ */ jsx(ReactSVG, { className: "anticon", wrapper: "span", src: resetSvg }),
           onClick: resetColumnWidth,
-          children: (_a = locale == null ? void 0 : locale.ProTable) == null ? void 0 : _a.resetColumnWidth
+          type: "text"
         }
-      ),
+      ) }),
       columnConfig && /* @__PURE__ */ jsx(
         ProTreeModal,
         {
-          title: (_b = locale == null ? void 0 : locale.ProTable) == null ? void 0 : _b.customColumns,
+          title: (_c = locale == null ? void 0 : locale.ProTable) == null ? void 0 : _c.customColumns,
           span: 8,
           mode: "list",
           draggable: true,
@@ -42,14 +44,15 @@ const RenderTableHeader = (props) => {
           value: checkColumns,
           allValue: "all",
           onChange: handleColumnConfig,
-          trigger: /* @__PURE__ */ jsx(
+          trigger: /* @__PURE__ */ jsx(Tooltip, { title: (_d = locale == null ? void 0 : locale.ProTable) == null ? void 0 : _d.customColumns, children: /* @__PURE__ */ jsx(
             Button,
             {
-              className: "custom-column-btn",
+              "aria-label": (_e = locale == null ? void 0 : locale.ProTable) == null ? void 0 : _e.customColumns,
+              className: "custom-column-btn table-header-icon-btn",
               icon: /* @__PURE__ */ jsx(ReactSVG, { className: "anticon", wrapper: "span", src: customColumnSvg }),
-              children: (_c = locale == null ? void 0 : locale.ProTable) == null ? void 0 : _c.customColumns
+              type: "text"
             }
-          )
+          ) })
         }
       )
     ] })

package/es/ProTable/index.js

@@ -12,8 +12,8 @@ import useAntdTable, { SELECTION_ALL, CURRENT_PAGE, UNCHECK_ALL } from "./hooks/
 import { BaseTable, DraggableTable } from "./components/RcTable";
 import { formatColumn } from "./components/FormatColumn";
 import empty from "../assets/empty.png";
-import resetSvg from "../assets/reset.svg";
-import customColumnSvg from "../assets/customColumn.svg";
+import refreshSvg from "../assets/refresh.svg";
+import settingsSvg from "../assets/settings.svg";
 import { filterVisibleColumns, getColumnDataIndex, getRowKey } from "./utils";
 import {
   baseStorage,
@@ -360,13 +360,13 @@ const ProTable = forwardRef((props, tableRef) => {
           headerRender,
           columnConfig,
           resizeColumn,
-          resetSvg,
+          resetSvg: refreshSvg,
           resetColumnWidth,
           locale,
           customColumns,
           checkColumns,
           handleColumnConfig,
-          customColumnSvg
+          customColumnSvg: settingsSvg
         }
       }
     ),

package/es/ProTable/style/index.less

@@ -254,21 +254,36 @@
     }
   }
 
-  .column-config .right-actions .@{ant-prefix}-btn {
+  .column-config .right-actions .table-header-icon-btn {
+    display: inline-flex;
+    align-items: flex-end;
+    justify-content: center;
+    width: 28px;
+    height: 32px;
+    border: 0;
+    box-shadow: none;
+    padding: 0;
+
     &:hover,
     &:visited,
     &:focus {
       color: #333 !important;
-      background: #fff !important;
-      border: 1px solid #d9d9d9 !important;
+      background: transparent !important;
+      border: 0 !important;
     }
-  }
 
-  .custom-column-btn {
-    display: inline-flex;
-    align-items: center;
-    .anticon {
-      height: 16px;
+    &:focus-visible {
+      outline: 2px solid var(--zaui-brand, #006aff);
+      outline-offset: 2px;
+    }
+
+    .anticon > * {
+      line-height: 0;
+    }
+    .anticon svg {
+      display: block;
+      width: 20px;
+      height: 20px;
     }
   }
 
@@ -424,25 +439,12 @@
   .column-config {
     display: flex;
     justify-content: space-between;
-    margin-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1));
+    margin-bottom: calc(var(--zaui-space-size-md; 14px) * var(--zaui-size; 1));
 
     .right-actions {
       display: flex;
+      gap: 0;
       align-items: center;
-
-      > .@{ant-prefix}-btn {
-        &:hover,
-        &:visited,
-        &:focus {
-          color: unset;
-          background: unset;
-          border: 1px solid #d9d9d9;
-        }
-      }
-
-      .custom-column-btn {
-        margin-left: var(--zaui-space-size-sm, 8px);
-      }
     }
   }
 

package/es/assets/refresh.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none" stroke="#343434" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
+  <path d="M10 4a7 7 0 1 0 6.06 3.5" />
+  <path d="m8 2 2 2-2 2" />
+</svg>

package/es/assets/settings.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none" stroke="#343434" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
+  <path d="M8.25 2h3.5l.5 2 1.5.87 2-.57 1.75 3.03L16 8.8v2.4l1.5 1.47-1.75 3.03-2-.57-1.5.87-.5 2h-3.5l-.5-2-1.5-.87-2 .57-1.75-3.03L4 11.2V8.8L2.5 7.33 4.25 4.3l2 .57L7.75 4z" />
+  <circle cx="10" cy="10" r="2.5" />
+</svg>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zat-design/sisyphus-react",
-  "version": "4.6.5",
+  "version": "4.7.0-beta.1",
   "license": "MIT",
   "publishConfig": {
     "access": "public",