@teamix/pro 1.5.44 → 1.5.46-beat.2

package/es/actions/quick.js

@@ -16,6 +16,7 @@ export function createAction(props) {
   var divDom = document.createElement('div');
   divDom.style.display = 'none';
   divDom.setAttribute('class', 'teamix-pro-actions-identification');
+  //@ts-ignore
   ReactDom.render( /*#__PURE__*/React.createElement(ProAction, _objectSpread({}, props)), divDom);
   parentDom.appendChild(divDom);
   setTimeout(function () {

package/es/form/Components/SelectTable2/index.d.ts

@@ -93,5 +93,6 @@ declare const SelectTable2: React.ForwardRefExoticComponent<Partial<{
         columnProps?: (() => any) | undefined;
         titleAddons?: (() => any) | undefined;
     }) | undefined;
+    key?: React.Key | null | undefined;
 } & Omit<import("@alifd/next/types/table").TableProps, "rowSelection" | "columns"> & import("../../../table").ProTableTopAreaProps> & React.RefAttributes<unknown>>;
 export default SelectTable2;

package/es/form/Filter/useBindUrl.d.ts

@@ -1,2 +1,14 @@
-declare const _default: (bindUrl: any, functions: any, formRef: any) => any;
-export default _default;
+/// <reference types="react" />
+import { UrlStateOptions } from '@teamix/hooks';
+import type { Form } from '@formily/core';
+export interface BindUrlInitFunctions {
+    onInit?: (values: Record<string, any>) => void;
+    onFilter?: (values: Record<string, any>) => void;
+    onReset?: (values: Record<string, any>) => void;
+}
+export default function useBindUrl<S = unknown>(bindUrl: boolean | UrlStateOptions<S> | undefined, functions: BindUrlInitFunctions, formRef: React.MutableRefObject<Form<any> | undefined>): {
+    onInit?: ((values: Record<string, any>) => void) | undefined;
+    onFilter?: ((values: Record<string, any>) => void) | undefined;
+    onReset?: ((values: Record<string, any>) => void) | undefined;
+    setValuesByUrlState: (form: any) => void;
+};

package/es/form/Filter/useBindUrl.js

@@ -7,9 +7,10 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-import { useUrlState } from '@teamix/hooks';
+import { useUpdate, useUrlState } from '@teamix/hooks';
 import { isUsable, isPlainObj } from '@teamix/utils';
-export default (function (bindUrl, functions, formRef) {
+export default function useBindUrl(bindUrl, functions, formRef) {
+  var update = useUpdate();
   // 预处理 bindUrl 参数（主要兼容 SelectGroup 组件）
   var initializeBindUrl = function initializeBindUrl(options) {
     return options ? _objectSpread(_objectSpread({}, options), {}, {
@@ -23,9 +24,10 @@ export default (function (bindUrl, functions, formRef) {
             key = _ref2[0],
             value = _ref2[1];
           var form = formRef.current;
-          var field = (_form$query = form.query(key)) === null || _form$query === void 0 ? void 0 : _form$query.take();
-          if ((field === null || field === void 0 ? void 0 : field.component[0]) === 'SelectGroup') {
-            newValues[key] = value.map(function (_ref3) {
+          var field = form === null || form === void 0 ? void 0 : (_form$query = form.query(key)) === null || _form$query === void 0 ? void 0 : _form$query.take();
+          var component = field === null || field === void 0 ? void 0 : field.component;
+          if (component instanceof Array && component[0] === 'SelectGroup') {
+            newValues[key] = (value !== null && value !== void 0 ? value : []).map(function (_ref3) {
               var key = _ref3.key,
                 value = _ref3.value;
               return key && value ? "".concat(key, "||").concat(value === null || value === void 0 ? void 0 : value.join('|')) : '';
@@ -33,52 +35,104 @@ export default (function (bindUrl, functions, formRef) {
           }
         });
         return beforeStringify ? beforeStringify(newValues) : newValues;
+      },
+      beforeParse: function beforeParse(values) {
+        var _Object$entries2;
+        var beforeParse = options.beforeParse;
+        var newValues = _objectSpread({}, values);
+        (_Object$entries2 = Object.entries(values)) === null || _Object$entries2 === void 0 ? void 0 : _Object$entries2.forEach(function (_ref4) {
+          var _form$query2;
+          var _ref5 = _slicedToArray(_ref4, 2),
+            key = _ref5[0],
+            value = _ref5[1];
+          var form = formRef.current;
+          var field = form === null || form === void 0 ? void 0 : (_form$query2 = form.query(key)) === null || _form$query2 === void 0 ? void 0 : _form$query2.take();
+          var component = field === null || field === void 0 ? void 0 : field.component;
+          if (component instanceof Array && component[0] === 'SelectGroup') {
+            newValues[key] = (value !== null && value !== void 0 ? value : []).map(function (item) {
+              var _item$split = item === null || item === void 0 ? void 0 : item.split('||'),
+                _item$split2 = _slicedToArray(_item$split, 2),
+                key = _item$split2[0],
+                value = _item$split2[1];
+              return {
+                key: key,
+                value: value === null || value === void 0 ? void 0 : value.split('|')
+              };
+            });
+          }
+        });
+        return beforeParse ? beforeParse(newValues) : newValues;
       }
     }) : options;
   };
   // 通过 useUrlState 获取 url 上的参数和 url 配置方法
-  var _ref4 = bindUrl ? useUrlState(undefined, initializeBindUrl(isPlainObj(bindUrl) ? bindUrl : {})) : [],
-    _ref5 = _slicedToArray(_ref4, 2),
-    urlState = _ref5[0],
-    setUrlState = _ref5[1];
+  var _ref6 = bindUrl ? useUrlState(undefined, _objectSpread(_objectSpread({}, initializeBindUrl(isPlainObj(bindUrl) ? bindUrl : {})), {}, {
+      navigateMode: 'replace'
+    })) : [],
+    _ref7 = _slicedToArray(_ref6, 4),
+    urlState = _ref7[0],
+    setUrlState = _ref7[1],
+    queryFromUrl = _ref7[2],
+    stringify = _ref7[3];
   // 输出配置url参数的函数
-  var initializedFunctions = Object.entries(functions).reduce(function (prev, _ref6) {
-    var _ref7 = _slicedToArray(_ref6, 2),
-      key = _ref7[0],
-      fun = _ref7[1];
-    prev[key] = function (values) {
-      fun === null || fun === void 0 ? void 0 : fun(values);
-      setUrlState === null || setUrlState === void 0 ? void 0 : setUrlState(values);
+  var initializedFunctions = Object.entries(functions).reduce(function (prev, _ref8) {
+    var _ref9 = _slicedToArray(_ref8, 2),
+      listenerKey = _ref9[0],
+      originalFunction = _ref9[1];
+    prev[listenerKey] = function (values) {
+      originalFunction === null || originalFunction === void 0 ? void 0 : originalFunction(values);
+      if (bindUrl) {
+        // guard: onInit 会在 mount 时被自动调用，需要避免其在任何情况下都调用 setUrlState。故增加幂等判断
+        var hasStringifiedDiff = false;
+        var hasValuesDiff = false;
+        for (var paramName in values) {
+          if (Object.hasOwn(values, paramName)) {
+            var oldValue = queryFromUrl === null || queryFromUrl === void 0 ? void 0 : queryFromUrl[paramName];
+            var newValue = values[paramName];
+            // 这里我们必须使用 stringify 来判断是否有变化，因为 special case 太多。例如，默认配置下：
+            // { a: [undefined, undefined], b: undefined, c: [], d: null, e: ''} 会生成 'd=&e='
+            // 类似地，{ a: [''], b: [null], c: [undefined] } 会生成 'a=&b='。更不用说还有非默认配置的情况
+            // 想要避免这种 hazard，我们必须使用钩子内部导出的、经过柯里化的 stringify 来判断生成的字符串是否无变化。
+            if (stringify(_defineProperty({}, paramName, newValue)) !== stringify(_defineProperty({}, paramName, oldValue))) {
+              hasStringifiedDiff = true;
+              break;
+            } else if (oldValue !== newValue) {
+              hasValuesDiff = true;
+            }
+          }
+        }
+        if (hasStringifiedDiff) {
+          setUrlState(values);
+        } else if (hasValuesDiff) {
+          // guard: 虽然 url 字符串没有变化，但是 values 变化了，还是需要触发组件的 update 以保证行为一致。
+          update();
+        }
+      }
     };
     return prev;
   }, {});
   // 使用 url 参数配置 QueryFilter 默认值（移除非表单值，兼容数组数据，兼容 SelectGroup 组件）
   var setValuesByUrlState = function setValuesByUrlState(form) {
     if (urlState) {
-      var _Object$entries2;
-      (_Object$entries2 = Object.entries(urlState)) === null || _Object$entries2 === void 0 ? void 0 : _Object$entries2.forEach(function (_ref8) {
-        var _form$query2;
-        var _ref9 = _slicedToArray(_ref8, 2),
-          key = _ref9[0],
-          value = _ref9[1];
-        var field = (_form$query2 = form.query(key)) === null || _form$query2 === void 0 ? void 0 : _form$query2.take();
+      var _Object$entries3;
+      (_Object$entries3 = Object.entries(urlState)) === null || _Object$entries3 === void 0 ? void 0 : _Object$entries3.forEach(function (_ref10) {
+        var _form$query3;
+        var _ref11 = _slicedToArray(_ref10, 2),
+          key = _ref11[0],
+          value = _ref11[1];
+        var field = (_form$query3 = form.query(key)) === null || _form$query3 === void 0 ? void 0 : _form$query3.take();
         if (field) {
           var newValue = value;
           if (field.displayName === 'ArrayField') {
             newValue = [].concat(isUsable(newValue) ? newValue : []);
           }
-          if (field.component[0] === 'SelectGroup') {
-            newValue = newValue.map(function (item) {
-              var _item$split = item === null || item === void 0 ? void 0 : item.split('||'),
-                _item$split2 = _slicedToArray(_item$split, 2),
-                key = _item$split2[0],
-                value = _item$split2[1];
-              return {
-                key: key,
-                value: value === null || value === void 0 ? void 0 : value.split('|')
-              };
-            });
-          }
+          // 这部分应该挪到上面的 beforeParse 里面做，beforeParse 和 beforeStringify 应该是互逆的
+          // if (field.component[0] === 'SelectGroup') {
+          //   newValue = newValue.map((item: any) => {
+          //     const [key, value] = item?.split('||');
+          //     return { key, value: value?.split('|') };
+          //   });
+          // }
           form.setValuesIn(key, newValue);
         }
       });
@@ -87,4 +141,4 @@ export default (function (bindUrl, functions, formRef) {
   return _objectSpread({
     setValuesByUrlState: setValuesByUrlState
   }, initializedFunctions);
-});
+}

package/es/index.d.ts

@@ -30,5 +30,5 @@ export * from './sidebar';
 export * from './utils';
 export * from './timeline';
 export * from './image';
-declare const version = "1.5.44";
+declare const version = "1.5.46-beta.2";
 export { version, ProAction, ProCard, ProField, ProForm, ProInfo, ProPageContainer, ProPageHeader, ProSkeleton, ProTable, ProSidebar, ProTimeline, TeamixIcon, ProImage, hooks, nocode, templates, utils, };

package/es/index.js

@@ -37,7 +37,7 @@ export * from './sidebar';
 export * from './utils';
 export * from './timeline';
 export * from './image';
-var version = '1.5.44';
+var version = '1.5.46-beta.2';
 // By TeamixTest
 window.postMessage({
   source: 'teamix-test-devtools',

package/es/page-header/index.js

@@ -8,7 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import React from 'react';
 // import { useHistory } from 'react-router-dom';
-import { useRealHistory } from '@teamix/utils';
+import { useReactHistory } from '@teamix/utils';
 import classnames from 'classnames';
 import TeamixIcon from '@teamix/icon';
 import { Breadcrumb, Balloon } from '@alicloudfe/components';
@@ -132,7 +132,7 @@ var ProPageHeader = function ProPageHeader(props) {
     style = props.style,
     tabs = props.tabs,
     others = _objectWithoutProperties(props, _excluded3);
-  var history = useRealHistory();
+  var history = useReactHistory();
   var backgroundImage = image ? "url('".concat(image, "')") : undefined;
   var showList = function showList(list) {
     var _list$actions;

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

@@ -152,7 +152,7 @@ export declare function getTreeNodeProps(item: ProSidebarDataSourceItem): {
         'aria-colindex'?: number | undefined;
         'aria-colspan'?: number | undefined;
         'aria-controls'?: string | undefined;
-        'aria-current'?: boolean | "date" | "time" | "page" | "false" | "true" | "step" | "location" | undefined;
+        'aria-current'?: boolean | "location" | "date" | "time" | "page" | "false" | "true" | "step" | undefined;
         'aria-describedby'?: string | undefined;
         'aria-details'?: string | undefined;
         'aria-disabled'?: (boolean | "false" | "true") | undefined;

package/es/table/components/Cell/index.js

@@ -189,11 +189,31 @@ var processBuriedPoint = function processBuriedPoint() {
   }))));
 };
 var equalColumns = function equalColumns(prevProps, nextProps) {
-  var preValue = prevProps.value;
+  var preValue = prevProps.value,
+    preItem = prevProps.item,
+    preRecord = prevProps.record,
+    preContext = prevProps.context;
   var nextValue = nextProps.value,
-    item = nextProps.item;
+    nextItem = nextProps.item,
+    nextRecord = nextProps.record,
+    nextContext = nextProps.context;
+  // if (nextItem?.render) {
+  //   let renderCache = true;
+  //   Object.keys(nextItem?.render).forEach((key) => {
+  //     // 如果 preItem 不包含 render 的属性，则强制刷新
+  //     if (!preItem?.render[key]) {
+  //       renderCache = false;
+  //       return false
+  //     }
+  //     let preRenderValue = getTargetValue(preItem?.render[key], {...preRecord, ...preContext});
+  //     let nextRenderValue = getTargetValue(nextItem?.render[key], {...nextRecord, ...nextContext})
+  //     if (preRenderValue !== nextRenderValue) {
+  //       renderCache = false;
+  //     }
+  //   })
+  // }
   // columns 强制更新参数
-  if (item === null || item === void 0 ? void 0 : item.forcedUpdate) {
+  if (nextItem === null || nextItem === void 0 ? void 0 : nextItem.forcedUpdate) {
     return false;
   }
   // 操作列的时候强制刷新 || 当 value 值拿不到的时候

package/es/table/components/Filter/index.js

@@ -33,7 +33,9 @@ var Filter = function Filter(props) {
     filtersWidth = _column$filtersWidth === void 0 ? 130 : _column$filtersWidth,
     _column$defaultFilter = column.defaultFilterSelectedKeys,
     defaultFilterSelectedKeys = _column$defaultFilter === void 0 ? [] : _column$defaultFilter;
-  var _ref = bindUrl ? useUrlState() : [],
+  var _ref = bindUrl ? useUrlState({}, {
+      navigateMode: 'replace'
+    }) : [],
     _ref2 = _slicedToArray(_ref, 2),
     urlState = _ref2[0],
     setUrlState = _ref2[1];

package/es/table/components/ToolBar/RefreshIcon.js

@@ -59,6 +59,7 @@ var LayoutIcon = function LayoutIcon(props) {
       setTimes(timer);
       timerRef.current.remain = timer / 1000;
       if (timerRef.current.timer) {
+        //@ts-ignore
         clearInterval(timerRef.current.timer);
         timerRef.current.timer = undefined;
       }
@@ -84,6 +85,7 @@ var LayoutIcon = function LayoutIcon(props) {
       var _actionRef$current2, _actionRef$current2$c;
       (_actionRef$current2 = actionRef.current) === null || _actionRef$current2 === void 0 ? void 0 : (_actionRef$current2$c = _actionRef$current2.clearAutoRefreshTimers) === null || _actionRef$current2$c === void 0 ? void 0 : _actionRef$current2$c.call(_actionRef$current2);
       if (timerRef.current.timer) {
+        //@ts-ignore
         clearInterval(timerRef.current.timer);
         timerRef.current.timer = undefined;
         timerRef.current.remain = times / 1000;

package/es/table/index.js

@@ -135,7 +135,9 @@ var ProTable = function ProTable(props) {
   var targetPageKey = pageKey || globalPageKey;
   var targetPageSizeKey = pageSizeKey || globalPageSizeKey;
   var targetFormatSort = formatSort || globalFormatSort;
-  var _ref = bindUrl ? useUrlState() : [],
+  var _ref = bindUrl ? useUrlState({}, {
+      navigateMode: 'replace'
+    }) : [],
     _ref2 = _slicedToArray(_ref, 2),
     urlState = _ref2[0],
     setUrlState = _ref2[1];
@@ -337,9 +339,9 @@ var ProTable = function ProTable(props) {
           setFooterSuctionState(false);
         }
         // 如果有切换区tab，那么重新计算
-        if (headerFixedTopSectionDom.clientHeight) {
+        if (headerFixedTopSectionDom === null || headerFixedTopSectionDom === void 0 ? void 0 : headerFixedTopSectionDom.clientHeight) {
           var _headerFixedTopSectio;
-          var headerFixedTopSectionHeight = (_headerFixedTopSectio = headerFixedTopSectionDom.clientHeight) !== null && _headerFixedTopSectio !== void 0 ? _headerFixedTopSectio : 0;
+          var headerFixedTopSectionHeight = (_headerFixedTopSectio = headerFixedTopSectionDom === null || headerFixedTopSectionDom === void 0 ? void 0 : headerFixedTopSectionDom.clientHeight) !== null && _headerFixedTopSectio !== void 0 ? _headerFixedTopSectio : 0;
           // const clientTableBodyHeight =
           //   document.body.clientHeight - offsetHeaderHeight;
           setHeaderHeight(headerFixedTopSectionHeight + teamixNavHeight + footerRowSelectionHeight + tableHeaderHeight + 1);
@@ -1199,7 +1201,8 @@ var ProTable = function ProTable(props) {
   }, [fullscreenState, fixedTableBody, footerSuction, footerSuctionState]);
   return /*#__PURE__*/React.createElement(FullScreen, {
     visible: fullscreenState,
-    actionRef: actionRef
+    actionRef: actionRef,
+    key: props.key
   }, function (isFullScreen) {
     return /*#__PURE__*/React.createElement("div", {
       className: cls({

package/es/table/typing.d.ts

@@ -189,6 +189,8 @@ export declare type ProTableProps = {
     /** 使用超大数据模式 **/
     useMaxData?: boolean;
     rowSelection?: rowSelectionType;
+    /** React Key **/
+    key?: React.Key | null;
 } & Omit<TableProps, 'columns' | 'rowSelection'> & ProTableTopAreaProps;
 export declare type rowSelectionType = {
     getProps?: (record: any, index: number) => any;

package/es/table/utils/genAutoWidthColumns.js

@@ -38,7 +38,10 @@ export function genAutoWidthColumns(columns, ref, data, size, useRowSelection, a
     return columns;
   }
   var finalColumns = [];
-  var filterdColumnsResult = _.cloneDeep(columns);
+  // @FIXME: lodash 的 cloneDeep 无法正确处理 columns 内部含有 ReactNode 的情况。我们也不该用 React 以外的工具来复制 ReactNode
+  // 因为它里面的 fiber node id 等等的在复制后并不会变，对于 React 来讲这就意味着两个 ReactNode 有相同的 fiber node id，不符合预期。
+  // 先注释掉，后续再想办法
+  var filterdColumnsResult = columns; // _.cloneDeep(columns);
   filterdColumnsResult.forEach(function (column, index) {
     var render = column.render,
       _column$valueType = column.valueType,

package/es/table/utils/useTableSelection.js

@@ -41,6 +41,10 @@ function useTableSelection() {
   var dataRef = useRef({
     selectedRowKeys: config.selectedRowKeys || defaultSelectedRowKeys
   });
+  var onSetSelectedRowKeys = function onSetSelectedRowKeys(keys) {
+    setSelectedRowKeys(keys);
+    dataRef.current.selectedRowKeys = keys;
+  };
   useEffect(function () {
     var _config$selectedRowKe, _config$selectedRowKe2;
     setSelectedRowKeys((_config$selectedRowKe = config === null || config === void 0 ? void 0 : config.selectedRowKeys) !== null && _config$selectedRowKe !== void 0 ? _config$selectedRowKe : []);
@@ -148,7 +152,7 @@ function useTableSelection() {
   return {
     rowSelection: rowSelection,
     selectedRowKeys: selectedRowKeys,
-    setSelectedRowKeys: setSelectedRowKeys,
+    setSelectedRowKeys: onSetSelectedRowKeys,
     selectedRecords: selectedRecords,
     setSelectedRecords: setSelectedRecords
   };

package/lib/actions/quick.js

@@ -23,6 +23,7 @@ function createAction(props) {
   var divDom = document.createElement('div');
   divDom.style.display = 'none';
   divDom.setAttribute('class', 'teamix-pro-actions-identification');
+  //@ts-ignore
   _reactDom.default.render( /*#__PURE__*/_react.default.createElement(_.default, _objectSpread({}, props)), divDom);
   parentDom.appendChild(divDom);
   setTimeout(function () {

package/lib/form/Components/SelectTable2/index.d.ts

@@ -93,5 +93,6 @@ declare const SelectTable2: React.ForwardRefExoticComponent<Partial<{
         columnProps?: (() => any) | undefined;
         titleAddons?: (() => any) | undefined;
     }) | undefined;
+    key?: React.Key | null | undefined;
 } & Omit<import("@alifd/next/types/table").TableProps, "rowSelection" | "columns"> & import("../../../table").ProTableTopAreaProps> & React.RefAttributes<unknown>>;
 export default SelectTable2;

package/lib/form/Filter/useBindUrl.d.ts

@@ -1,2 +1,14 @@
-declare const _default: (bindUrl: any, functions: any, formRef: any) => any;
-export default _default;
+/// <reference types="react" />
+import { UrlStateOptions } from '@teamix/hooks';
+import type { Form } from '@formily/core';
+export interface BindUrlInitFunctions {
+    onInit?: (values: Record<string, any>) => void;
+    onFilter?: (values: Record<string, any>) => void;
+    onReset?: (values: Record<string, any>) => void;
+}
+export default function useBindUrl<S = unknown>(bindUrl: boolean | UrlStateOptions<S> | undefined, functions: BindUrlInitFunctions, formRef: React.MutableRefObject<Form<any> | undefined>): {
+    onInit?: ((values: Record<string, any>) => void) | undefined;
+    onFilter?: ((values: Record<string, any>) => void) | undefined;
+    onReset?: ((values: Record<string, any>) => void) | undefined;
+    setValuesByUrlState: (form: any) => void;
+};

package/lib/form/Filter/useBindUrl.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = useBindUrl;
 var _hooks = require("@teamix/hooks");
 var _utils = require("@teamix/utils");
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
@@ -15,7 +15,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-var _default = function _default(bindUrl, functions, formRef) {
+function useBindUrl(bindUrl, functions, formRef) {
+  var update = (0, _hooks.useUpdate)();
   // 预处理 bindUrl 参数（主要兼容 SelectGroup 组件）
   var initializeBindUrl = function initializeBindUrl(options) {
     return options ? _objectSpread(_objectSpread({}, options), {}, {
@@ -29,9 +30,10 @@ var _default = function _default(bindUrl, functions, formRef) {
             key = _ref2[0],
             value = _ref2[1];
           var form = formRef.current;
-          var field = (_form$query = form.query(key)) === null || _form$query === void 0 ? void 0 : _form$query.take();
-          if ((field === null || field === void 0 ? void 0 : field.component[0]) === 'SelectGroup') {
-            newValues[key] = value.map(function (_ref3) {
+          var field = form === null || form === void 0 ? void 0 : (_form$query = form.query(key)) === null || _form$query === void 0 ? void 0 : _form$query.take();
+          var component = field === null || field === void 0 ? void 0 : field.component;
+          if (component instanceof Array && component[0] === 'SelectGroup') {
+            newValues[key] = (value !== null && value !== void 0 ? value : []).map(function (_ref3) {
               var key = _ref3.key,
                 value = _ref3.value;
               return key && value ? "".concat(key, "||").concat(value === null || value === void 0 ? void 0 : value.join('|')) : '';
@@ -39,52 +41,104 @@ var _default = function _default(bindUrl, functions, formRef) {
           }
         });
         return beforeStringify ? beforeStringify(newValues) : newValues;
+      },
+      beforeParse: function beforeParse(values) {
+        var _Object$entries2;
+        var beforeParse = options.beforeParse;
+        var newValues = _objectSpread({}, values);
+        (_Object$entries2 = Object.entries(values)) === null || _Object$entries2 === void 0 ? void 0 : _Object$entries2.forEach(function (_ref4) {
+          var _form$query2;
+          var _ref5 = _slicedToArray(_ref4, 2),
+            key = _ref5[0],
+            value = _ref5[1];
+          var form = formRef.current;
+          var field = form === null || form === void 0 ? void 0 : (_form$query2 = form.query(key)) === null || _form$query2 === void 0 ? void 0 : _form$query2.take();
+          var component = field === null || field === void 0 ? void 0 : field.component;
+          if (component instanceof Array && component[0] === 'SelectGroup') {
+            newValues[key] = (value !== null && value !== void 0 ? value : []).map(function (item) {
+              var _item$split = item === null || item === void 0 ? void 0 : item.split('||'),
+                _item$split2 = _slicedToArray(_item$split, 2),
+                key = _item$split2[0],
+                value = _item$split2[1];
+              return {
+                key: key,
+                value: value === null || value === void 0 ? void 0 : value.split('|')
+              };
+            });
+          }
+        });
+        return beforeParse ? beforeParse(newValues) : newValues;
       }
     }) : options;
   };
   // 通过 useUrlState 获取 url 上的参数和 url 配置方法
-  var _ref4 = bindUrl ? (0, _hooks.useUrlState)(undefined, initializeBindUrl((0, _utils.isPlainObj)(bindUrl) ? bindUrl : {})) : [],
-    _ref5 = _slicedToArray(_ref4, 2),
-    urlState = _ref5[0],
-    setUrlState = _ref5[1];
+  var _ref6 = bindUrl ? (0, _hooks.useUrlState)(undefined, _objectSpread(_objectSpread({}, initializeBindUrl((0, _utils.isPlainObj)(bindUrl) ? bindUrl : {})), {}, {
+      navigateMode: 'replace'
+    })) : [],
+    _ref7 = _slicedToArray(_ref6, 4),
+    urlState = _ref7[0],
+    setUrlState = _ref7[1],
+    queryFromUrl = _ref7[2],
+    stringify = _ref7[3];
   // 输出配置url参数的函数
-  var initializedFunctions = Object.entries(functions).reduce(function (prev, _ref6) {
-    var _ref7 = _slicedToArray(_ref6, 2),
-      key = _ref7[0],
-      fun = _ref7[1];
-    prev[key] = function (values) {
-      fun === null || fun === void 0 ? void 0 : fun(values);
-      setUrlState === null || setUrlState === void 0 ? void 0 : setUrlState(values);
+  var initializedFunctions = Object.entries(functions).reduce(function (prev, _ref8) {
+    var _ref9 = _slicedToArray(_ref8, 2),
+      listenerKey = _ref9[0],
+      originalFunction = _ref9[1];
+    prev[listenerKey] = function (values) {
+      originalFunction === null || originalFunction === void 0 ? void 0 : originalFunction(values);
+      if (bindUrl) {
+        // guard: onInit 会在 mount 时被自动调用，需要避免其在任何情况下都调用 setUrlState。故增加幂等判断
+        var hasStringifiedDiff = false;
+        var hasValuesDiff = false;
+        for (var paramName in values) {
+          if (Object.hasOwn(values, paramName)) {
+            var oldValue = queryFromUrl === null || queryFromUrl === void 0 ? void 0 : queryFromUrl[paramName];
+            var newValue = values[paramName];
+            // 这里我们必须使用 stringify 来判断是否有变化，因为 special case 太多。例如，默认配置下：
+            // { a: [undefined, undefined], b: undefined, c: [], d: null, e: ''} 会生成 'd=&e='
+            // 类似地，{ a: [''], b: [null], c: [undefined] } 会生成 'a=&b='。更不用说还有非默认配置的情况
+            // 想要避免这种 hazard，我们必须使用钩子内部导出的、经过柯里化的 stringify 来判断生成的字符串是否无变化。
+            if (stringify(_defineProperty({}, paramName, newValue)) !== stringify(_defineProperty({}, paramName, oldValue))) {
+              hasStringifiedDiff = true;
+              break;
+            } else if (oldValue !== newValue) {
+              hasValuesDiff = true;
+            }
+          }
+        }
+        if (hasStringifiedDiff) {
+          setUrlState(values);
+        } else if (hasValuesDiff) {
+          // guard: 虽然 url 字符串没有变化，但是 values 变化了，还是需要触发组件的 update 以保证行为一致。
+          update();
+        }
+      }
     };
     return prev;
   }, {});
   // 使用 url 参数配置 QueryFilter 默认值（移除非表单值，兼容数组数据，兼容 SelectGroup 组件）
   var setValuesByUrlState = function setValuesByUrlState(form) {
     if (urlState) {
-      var _Object$entries2;
-      (_Object$entries2 = Object.entries(urlState)) === null || _Object$entries2 === void 0 ? void 0 : _Object$entries2.forEach(function (_ref8) {
-        var _form$query2;
-        var _ref9 = _slicedToArray(_ref8, 2),
-          key = _ref9[0],
-          value = _ref9[1];
-        var field = (_form$query2 = form.query(key)) === null || _form$query2 === void 0 ? void 0 : _form$query2.take();
+      var _Object$entries3;
+      (_Object$entries3 = Object.entries(urlState)) === null || _Object$entries3 === void 0 ? void 0 : _Object$entries3.forEach(function (_ref10) {
+        var _form$query3;
+        var _ref11 = _slicedToArray(_ref10, 2),
+          key = _ref11[0],
+          value = _ref11[1];
+        var field = (_form$query3 = form.query(key)) === null || _form$query3 === void 0 ? void 0 : _form$query3.take();
         if (field) {
           var newValue = value;
           if (field.displayName === 'ArrayField') {
             newValue = [].concat((0, _utils.isUsable)(newValue) ? newValue : []);
           }
-          if (field.component[0] === 'SelectGroup') {
-            newValue = newValue.map(function (item) {
-              var _item$split = item === null || item === void 0 ? void 0 : item.split('||'),
-                _item$split2 = _slicedToArray(_item$split, 2),
-                key = _item$split2[0],
-                value = _item$split2[1];
-              return {
-                key: key,
-                value: value === null || value === void 0 ? void 0 : value.split('|')
-              };
-            });
-          }
+          // 这部分应该挪到上面的 beforeParse 里面做，beforeParse 和 beforeStringify 应该是互逆的
+          // if (field.component[0] === 'SelectGroup') {
+          //   newValue = newValue.map((item: any) => {
+          //     const [key, value] = item?.split('||');
+          //     return { key, value: value?.split('|') };
+          //   });
+          // }
           form.setValuesIn(key, newValue);
         }
       });
@@ -93,5 +147,4 @@ var _default = function _default(bindUrl, functions, formRef) {
   return _objectSpread({
     setValuesByUrlState: setValuesByUrlState
   }, initializedFunctions);
-};
-exports.default = _default;
+}

package/lib/index.d.ts

@@ -30,5 +30,5 @@ export * from './sidebar';
 export * from './utils';
 export * from './timeline';
 export * from './image';
-declare const version = "1.5.44";
+declare const version = "1.5.46-beta.2";
 export { version, ProAction, ProCard, ProField, ProForm, ProInfo, ProPageContainer, ProPageHeader, ProSkeleton, ProTable, ProSidebar, ProTimeline, TeamixIcon, ProImage, hooks, nocode, templates, utils, };

package/lib/index.js

@@ -299,7 +299,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 if (!((_window = window) === null || _window === void 0 ? void 0 : _window.TEAMIXPRO_WITHOUT_ICON)) {
   _icon.default.setConfig(_utils.default.getTeamixIconConfig());
 }
-var version = '1.5.44';
+var version = '1.5.46-beta.2';
 // By TeamixTest
 exports.version = version;
 window.postMessage({

package/lib/page-header/index.js

@@ -137,7 +137,7 @@ var ProPageHeader = function ProPageHeader(props) {
     style = props.style,
     tabs = props.tabs,
     others = _objectWithoutProperties(props, _excluded3);
-  var history = (0, _utils.useRealHistory)();
+  var history = (0, _utils.useReactHistory)();
   var backgroundImage = image ? "url('".concat(image, "')") : undefined;
   var showList = function showList(list) {
     var _list$actions;