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

package/es/ProDrawerForm/index.js

@@ -1,50 +1,10 @@
 import { jsx } from "react/jsx-runtime";
-import {
-  createContext,
-  forwardRef,
-  useContext,
-  useEffect,
-  useImperativeHandle,
-  useMemo
-} from "react";
+import { createContext, forwardRef, useContext, useImperativeHandle, useMemo } from "react";
 import { ProDrawer, ProModal } from "./components";
 import ProForm from "../ProForm";
 import { resolveDrawerSize } from "./utils";
 import locale from "../locale";
 const ProDrawerFormContext = createContext(null);
-const scrollLockClassName = "pro-drawer-form-scroll-lock";
-let openDrawerCount = 0;
-let lockedScrollLeft = 0;
-let lockedScrollTop = 0;
-const lockRootScroll = () => {
-  if (typeof document === "undefined") {
-    return void 0;
-  }
-  if (openDrawerCount === 0) {
-    const scrollingElement = document.scrollingElement ?? document.documentElement;
-    lockedScrollLeft = scrollingElement.scrollLeft;
-    lockedScrollTop = scrollingElement.scrollTop;
-    document.body.style.setProperty("--pro-drawer-form-scroll-top", `-${lockedScrollTop}px`);
-    document.body.style.setProperty("--pro-drawer-form-scroll-left", `-${lockedScrollLeft}px`);
-    document.documentElement.classList.add(scrollLockClassName);
-    document.body.classList.add(scrollLockClassName);
-  }
-  openDrawerCount += 1;
-  return () => {
-    openDrawerCount = Math.max(0, openDrawerCount - 1);
-    if (openDrawerCount === 0) {
-      document.documentElement.classList.remove(scrollLockClassName);
-      document.body.classList.remove(scrollLockClassName);
-      document.body.style.removeProperty("--pro-drawer-form-scroll-top");
-      document.body.style.removeProperty("--pro-drawer-form-scroll-left");
-      if (lockedScrollLeft !== 0 || lockedScrollTop !== 0) {
-        window.scrollTo(lockedScrollLeft, lockedScrollTop);
-      }
-      lockedScrollLeft = 0;
-      lockedScrollTop = 0;
-    }
-  };
-};
 const useProDrawerFormContext = () => useContext(ProDrawerFormContext);
 const ProDrawerForm = forwardRef((props, ref) => {
   var _a, _b, _c, _d, _e, _f;
@@ -67,12 +27,6 @@ const ProDrawerForm = forwardRef((props, ref) => {
   } = props;
   const nextIsView = isView || disabled;
   const nextOkText = okText ?? (mode === "Drawer" ? (_d = (_c = locale) == null ? void 0 : _c.ProDrawerForm) == null ? void 0 : _d.save : (_f = (_e = locale) == null ? void 0 : _e.ProDrawerForm) == null ? void 0 : _f.confirm);
-  useEffect(() => {
-    if (!open || mode !== "Drawer") {
-      return void 0;
-    }
-    return lockRootScroll();
-  }, [mode, open]);
   const { width: deprecatedWidth, ...restPropsWithoutWidth } = restProps;
   const width = resolveDrawerSize(size, deprecatedWidth);
   const [form] = ProForm.useForm(originalForm);

package/es/ProDrawerForm/style/index.less

@@ -1,17 +1,5 @@
 @import '../../style/variables.less';
 
-html.pro-drawer-form-scroll-lock {
-  overflow: hidden !important;
-}
-
-body.pro-drawer-form-scroll-lock {
-  position: fixed !important;
-  top: var(--pro-drawer-form-scroll-top, 0);
-  left: var(--pro-drawer-form-scroll-left, 0);
-  width: 100%;
-  overflow: hidden !important;
-}
-
 .pro-drawer {
   .original-value-tooltip {
     position: fixed;

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

@@ -35,7 +35,8 @@ import {
   OMIT_FORM_ITEM_AND_DOM_KEYS,
   arePropsEqual,
   hasRowFunctionDependency,
-  mergeOnFieldChangeRow
+  mergeOnFieldChangeRow,
+  stabilizeDatePickerValueProps
 } from "./tools";
 const RenderField = ({ text: value, record, index, column, config }) => {
   var _a, _b, _c;
@@ -573,6 +574,7 @@ const RenderField = ({ text: value, record, index, column, config }) => {
   if (["Select", "ProSelect", "ProEnum"].includes(type)) {
     componentProps.scrollFollowParent = false;
   }
+  const datePickerValueRef = useRef(void 0);
   const finalFormItemProps = useMemo(() => {
     const defaultTransformProps = defaultTransform();
     const namesTransformProps = namesTransform();
@@ -588,7 +590,7 @@ const RenderField = ({ text: value, record, index, column, config }) => {
       }
       return transformNormalize(value2, prevValue, allValues, isDiffMode);
     } : userNormalize || transformNormalize;
-    const finalGetValueProps = transformGetValueProps && userGetValueProps ? (value2, ...args) => {
+    const mergedGetValueProps = transformGetValueProps && userGetValueProps ? (value2, ...args) => {
       const transformValueProps = transformGetValueProps(value2, ...args) || {};
       const nextValue = Object.prototype.hasOwnProperty.call(transformValueProps, "value") ? transformValueProps.value : value2;
       const userValueProps = userGetValueProps(nextValue, ...args) || {};
@@ -597,6 +599,10 @@ const RenderField = ({ text: value, record, index, column, config }) => {
         ...userValueProps
       };
     } : userGetValueProps || transformGetValueProps;
+    const finalGetValueProps = type === "DatePicker" && transformGetValueProps && mergedGetValueProps ? (...args) => {
+      const valueProps = mergedGetValueProps(...args);
+      return valueProps ? stabilizeDatePickerValueProps(datePickerValueRef, valueProps) : valueProps;
+    } : mergedGetValueProps;
     return {
       ...lastFormItemProps,
       ...defaultTransformProps,

package/es/ProEditTable/components/RenderField/tools.d.ts

@@ -1,5 +1,9 @@
 import { InternalNamePath, NamePath } from 'antd/lib/form/interface';
 import { GetOriginalValueParams, RenderFieldComparableProps } from './propsType';
+/** 避免等值日期在表格重渲染时产生新引用，导致 DatePicker 面板状态被重置。 */
+export declare const stabilizeDatePickerValueProps: (valueRef: {
+    current: any;
+}, valueProps: Record<string, any>) => Record<string, any>;
 /** 判断列是否包含可能依赖整行数据的函数型配置。 */
 export declare const hasRowFunctionDependency: (column: Record<string, any> | null | undefined) => boolean;
 /**

package/es/ProEditTable/components/RenderField/tools.js

@@ -2,6 +2,7 @@ import get from "lodash/get";
 import isEqual from "lodash/isEqual";
 import isEqualWith from "lodash/isEqualWith";
 import isFunction from "lodash/isFunction";
+import dayjs from "dayjs";
 import { customEqualForFunction } from "../../../utils";
 import { getNamePath, isRecordShallowEqual } from "../../utils/tools";
 const ROW_FUNCTION_DEPENDENCY_KEYS = [
@@ -15,6 +16,18 @@ const ROW_FUNCTION_DEPENDENCY_KEYS = [
   "valueType",
   "viewRender"
 ];
+const stabilizeDatePickerValueProps = (valueRef, valueProps) => {
+  const previousValue = valueRef.current;
+  const nextValue = valueProps.value;
+  if (dayjs.isDayjs(previousValue) && dayjs.isDayjs(nextValue) && previousValue.valueOf() === nextValue.valueOf() && previousValue.utcOffset() === nextValue.utcOffset() && previousValue.locale() === nextValue.locale()) {
+    return {
+      ...valueProps,
+      value: previousValue
+    };
+  }
+  valueRef.current = nextValue;
+  return valueProps;
+};
 const hasRowFunctionDependency = (column) => ROW_FUNCTION_DEPENDENCY_KEYS.some((key) => isFunction(column == null ? void 0 : column[key]));
 const mergeOnFieldChangeRow = (beforeRow, mutatedRow, latestStoreRow) => {
   const before = beforeRow || {};
@@ -220,6 +233,7 @@ export {
   getOriginalValue,
   hasRowFunctionDependency,
   mergeOnFieldChangeRow,
+  stabilizeDatePickerValueProps,
   toNamePath,
   toNamePaths
 };

package/es/ProEditTable/style/index.less

@@ -239,6 +239,14 @@
     }
   }
 
+  .@{ant-prefix}-table-tbody
+    .is-editing:not(.@{ant-prefix}-table-measure-row):not(.@{ant-prefix}-table-row-extra)
+    .@{ant-prefix}-form-item-control {
+    min-height: calc(
+      var(--zaui-height-size-lg; 32px) * var(--zaui-size; 1)
+    ) !important;
+  }
+
   .@{ant-prefix}-table-tbody
     .is-editing:not(.@{ant-prefix}-table-measure-row):not(.@{ant-prefix}-table-row-extra)
     .@{ant-prefix}-form-item.@{ant-prefix}-form-item-has-error {

package/es/ProLayout/components/Layout/Menu/FoldMenu/index.js

@@ -2,16 +2,16 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useContext } from "react";
 import { Popover, Tooltip } from "antd";
 import classnames from "classnames";
-import { Link as RouterLink } from "react-router-dom";
+import { Link as RouterLink, useLocation } from "react-router-dom";
 import ProIcon from "../../../../../ProIcon";
 import SideMenu from "../SideMenu";
 import { LayoutContext } from "../../../../index";
-import { getUrlParams, getPathNameKey, findMenuItemByKey } from "../../../../utils";
+import { findMenuItemByKey, resolveMenuKeyIdPath } from "../../../../utils";
 const Link = RouterLink;
 const FoldMenu = (props) => {
   const { style, dataSource, onMenuClick } = props;
   const { menus, iconfontUrl, notice, collapsed, headerHeight } = dataSource;
-  const pathNamePrefix = `/${window.location.pathname.split("/")[1]}`;
+  const location = useLocation();
   const noticeCls = classnames({
     "pro-layout-menu-tooltip": true,
     "pro-layout-menu-tooltip-has-notice": notice,
@@ -22,17 +22,16 @@ const FoldMenu = (props) => {
     onSelected: () => {
     }
   };
+  const currentKeyIdPath = resolveMenuKeyIdPath({
+    menus,
+    pathname: location.pathname,
+    search: location.search,
+    selectedPath
+  });
   return /* @__PURE__ */ jsx("div", { className: "pro-layout-menu-fold", style: { ...style }, children: /* @__PURE__ */ jsx("ul", { className: "pro-layout-menu-fold-list", style: { ...style }, children: menus.filter((item) => !item.hideInMenu).map((item, index) => {
     var _a;
     const { id, url, name, icon, imgUrl, imgActiveUrl, children } = item;
     const toPath = item.redirectUrl || item.url;
-    const selectedMenu = getUrlParams("activeMenu");
-    const pathToMatch = selectedPath || selectedMenu || window.location.pathname;
-    const currentKeyIdPath = getPathNameKey({
-      menus,
-      pathName: pathToMatch
-      // 优先匹配上下文路径
-    }) || [];
     const cls = classnames({
       active: currentKeyIdPath.includes(id)
     });
@@ -42,7 +41,7 @@ const FoldMenu = (props) => {
         "img",
         {
           className: "pro-layout-icon",
-          src: pathNamePrefix === url ? imgActiveUrl || imgUrl : imgUrl,
+          src: currentKeyIdPath.includes(id) ? imgActiveUrl || imgUrl : imgUrl,
           alt: "icon"
         }
       ) : /* @__PURE__ */ jsx(

package/es/ProLayout/components/Layout/Menu/OpenMenu/index.js

@@ -4,15 +4,14 @@ import { Menu } from "antd";
 import { useDeepCompareEffect, useSetState } from "ahooks";
 import { CaretDownOutlined } from "@ant-design/icons";
 import classnames from "classnames";
-import { Link as RouterLink } from "react-router-dom";
+import { Link as RouterLink, useLocation } from "react-router-dom";
 import cloneDeep from "lodash/cloneDeep";
 import { LayoutContext } from "../../../../index";
-import { getIdsByPathName, findMenuItemByKey } from "../../../../utils";
+import { findMenuItemByKey, resolveMenuKeyIdPath } from "../../../../utils";
 import { canOpenAsTab } from "../../../TabsManager/utils";
 import ProIcon from "../../../../../ProIcon";
 const Link = RouterLink;
 const OpenMenu = (props) => {
-  var _a;
   const { className, dataSource, style, onMenuClick, textVisible = true } = props;
   const { menus, sideMenu } = dataSource || {};
   const linkRef = useRef(null);
@@ -21,7 +20,7 @@ const OpenMenu = (props) => {
     openKeys: [],
     router: ""
   });
-  const query = new URLSearchParams(window.location.search);
+  const location = useLocation();
   const layoutContext = useContext(LayoutContext);
   const layoutSelectedPath = layoutContext == null ? void 0 : layoutContext.selectedPath;
   const layoutOnSelected = layoutContext == null ? void 0 : layoutContext.onSelected;
@@ -31,8 +30,12 @@ const OpenMenu = (props) => {
     "pro-layout-menu-text-hidden": textVisible === false,
     [`${className}`]: className
   });
-  const preferredPath = query.get("activeMenu") || (layoutSelectedPath === "##EMPTY##" ? null : layoutSelectedPath) || window.location.pathname;
-  const selectKeyIdPath = preferredPath ? ((_a = getIdsByPathName(menus, preferredPath)) == null ? void 0 : _a.map((item) => String(item))) || [] : [];
+  const selectKeyIdPath = resolveMenuKeyIdPath({
+    menus,
+    pathname: location.pathname,
+    search: location.search,
+    selectedPath: layoutSelectedPath
+  }).map((item) => String(item));
   const selectedRootKey = selectKeyIdPath[0];
   const itemsTransform = useMemo(() => {
     const result = cloneDeep(menus);
@@ -41,8 +44,8 @@ const OpenMenu = (props) => {
     }
     const menuDeep = (data) => {
       data.forEach((item) => {
-        var _a2, _b, _c;
-        const isFirstMenu = ((_a2 = item.keyIdPath) == null ? void 0 : _a2.length) === 1 || sideMenu && ((_b = item.keyIdPath) == null ? void 0 : _b.length) === 2;
+        var _a, _b, _c;
+        const isFirstMenu = ((_a = item.keyIdPath) == null ? void 0 : _a.length) === 1 || sideMenu && ((_b = item.keyIdPath) == null ? void 0 : _b.length) === 2;
         item.label = /* @__PURE__ */ jsxs(
           "div",
           {
@@ -140,7 +143,7 @@ const OpenMenu = (props) => {
           }
           if (menuItem && canOpenAsTab(menuItem) && shouldActivate) {
             setState({
-              selectedKeys: keyPath,
+              selectedKeys: menuKeyPath,
               router: menuRouter
             });
             layoutOnSelected == null ? void 0 : layoutOnSelected({

package/es/ProLayout/utils/index.d.ts

@@ -6,6 +6,16 @@ import type { MenusType } from '../propTypes';
  * @return result
  */
 export declare const getIdsByPathName: (menus: any[], activeMenu?: string) => number[];
+interface ResolveMenuKeyIdPathOptions {
+    menus: any[];
+    pathname: string;
+    search?: string;
+    selectedPath?: string;
+}
+/**
+ * 统一解析菜单激活路径：显式 activeMenu 优先，其次匹配真实路由，最后回退上次选择。
+ */
+export declare const resolveMenuKeyIdPath: ({ menus, pathname, search, selectedPath, }: ResolveMenuKeyIdPathOptions) => number[];
 /**
  * 转换菜单数据源评价keyUrlPath与keyIdPath
  * @param menuData 菜单数据源
@@ -41,3 +51,4 @@ export declare const getPathNameKey: ({ menus, pathName }: {
  * @returns 找到的菜单项数据或null
  */
 export declare const findMenuItemByKey: (menus: any[], key: string) => any;
+export {};

package/es/ProLayout/utils/index.js

@@ -1,12 +1,21 @@
 import isPlainObject from "lodash/isPlainObject";
 const updateBestMatch = (pathName, itemUrl, itemRedirectUrl, keyIdPath, bestMatch) => {
-  if (itemUrl && pathName.includes(itemUrl)) {
+  const isSameOrNestedPath = (candidate) => {
+    if (!candidate)
+      return false;
+    const normalizedCandidate = candidate.length > 1 ? candidate.replace(/\/+$/, "") : candidate;
+    if (pathName === normalizedCandidate)
+      return true;
+    const boundary = pathName.charAt(normalizedCandidate.length);
+    return pathName.startsWith(normalizedCandidate) && ["/", "?", "#"].includes(boundary);
+  };
+  if (isSameOrNestedPath(itemUrl)) {
     const urlLength = itemUrl.length;
     if (!bestMatch || urlLength > bestMatch.urlLength) {
       return { keyIdPath, urlLength };
     }
   }
-  if (itemRedirectUrl && pathName.includes(itemRedirectUrl)) {
+  if (isSameOrNestedPath(itemRedirectUrl)) {
     const urlLength = itemRedirectUrl.length;
     if (!bestMatch || urlLength > bestMatch.urlLength) {
       return { keyIdPath, urlLength };
@@ -14,6 +23,27 @@ const updateBestMatch = (pathName, itemUrl, itemRedirectUrl, keyIdPath, bestMatc
   }
   return bestMatch;
 };
+const getExactMenuKeyIdPath = (menus, pathname) => {
+  const normalizePathname = (value) => {
+    if (!value)
+      return "";
+    const path = value.split(/[?#]/)[0];
+    return path.length > 1 ? path.replace(/\/+$/, "") : path;
+  };
+  const targetPathname = normalizePathname(pathname);
+  for (const item of menus || []) {
+    const routes = [item == null ? void 0 : item.redirectUrl, item == null ? void 0 : item.router, item == null ? void 0 : item.url].map(normalizePathname);
+    if (targetPathname && routes.includes(targetPathname)) {
+      return item.keyIdPath || [];
+    }
+    if (Array.isArray(item == null ? void 0 : item.children) && item.children.length) {
+      const childPath = getExactMenuKeyIdPath(item.children, pathname);
+      if (childPath.length)
+        return childPath;
+    }
+  }
+  return [];
+};
 const getIdsByPathName = (menus, activeMenu) => {
   const _pathName = activeMenu || window.location.pathname;
   let result;
@@ -42,6 +72,26 @@ const getIdsByPathName = (menus, activeMenu) => {
   menuDeep(menus);
   return result || (bestMatch == null ? void 0 : bestMatch.keyIdPath) || [];
 };
+const resolveMenuKeyIdPath = ({
+  menus,
+  pathname,
+  search = "",
+  selectedPath
+}) => {
+  if (selectedPath === "##EMPTY##")
+    return [];
+  const activeMenu = new URLSearchParams(search).get("activeMenu");
+  const activeMenuPath = activeMenu ? getIdsByPathName(menus, activeMenu) : [];
+  if (activeMenuPath.length)
+    return activeMenuPath;
+  const exactRoutePath = getExactMenuKeyIdPath(menus, pathname);
+  if (exactRoutePath.length)
+    return exactRoutePath;
+  const nestedRoutePath = getIdsByPathName(menus, pathname);
+  if (nestedRoutePath.length)
+    return nestedRoutePath;
+  return selectedPath ? getIdsByPathName(menus, selectedPath) : [];
+};
 const transformMenu = (menuData, pathPrefix) => {
   const data = [...menuData];
   const menuDeep = (menuDeepItem) => {
@@ -163,6 +213,7 @@ export {
   getIdsByPathName,
   getPathNameKey,
   getUrlParams,
+  resolveMenuKeyIdPath,
   transformMenu,
   transformMenus
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zat-design/sisyphus-react",
-  "version": "4.6.4",
+  "version": "4.6.5-beta.1",
   "license": "MIT",
   "publishConfig": {
     "access": "public",
@@ -106,6 +106,14 @@
   "engines": {
     "node": ">=20.0.0"
   },
+  "resolutions": {
+    "@umijs/bundler-utils@3.5.43": "3.5.43"
+  },
+  "overrides": {
+    "@umijs/bundler-webpack@3.5.43": {
+      "@umijs/bundler-utils": "3.5.43"
+    }
+  },
   "browserslist": [
     "last 2 versions",
     "Firefox ESR",