@zykj2024/much-library 1.0.9 → 1.0.10-beta.1

package/dist/McSelect/index.js

@@ -3,13 +3,45 @@ import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["style", "className", "label", "multiple", "changeOnHidden", "inexistent", "fetchOptions", "pageSize", "extra", "value", "onChange", "labelInValue", "options", "disabled", "maxTagCount", "onSearch", "onPopupScroll", "onBlur", "onDropdownVisibleChange"];
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+var _excluded = ["style", "className", "label", "multiple", "changeOnHidden", "inexistent", "fetchOptions", "pageSize", "extra", "value", "onChange", "labelInValue", "options", "disabled", "maxTagCount", "onSearch", "onPopupScroll", "onBlur", "onDropdownVisibleChange", "toFilterOptions", "searchInPanel", "pinSelectedOptions", "searchInPanelPlaceholder"];
 import { Empty, Popover, Select, Spin } from 'antd';
-import { Utils } from "./..";
+import { debounce } from "../Utils";
 import { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import PanelSearchInput from "./components/PanelSearchInput";
 import "./index.css";
 import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
+// 将已选的option置顶
+var createPinedSelectedOptions = function createPinedSelectedOptions(options, selectedValues) {
+  if (!options || options.length === 0) return [];
+  if (!selectedValues || selectedValues.length === 0) return options;
+  var isLabelInValue = _typeof(selectedValues[0]) === 'object';
+  if (isLabelInValue) {
+    var unselectedOptions = options.filter(function (o) {
+      return !selectedValues.some(function (v) {
+        return v.value === o.value;
+      });
+    });
+    return [].concat(_toConsumableArray(selectedValues), _toConsumableArray(unselectedOptions));
+  } else {
+    var _options$filter;
+    // options中找不到的就不展示
+    var selectedOptions = selectedValues.map(function (v) {
+      return options.find(function (o) {
+        return o.value === v;
+      });
+    }).filter(function (o) {
+      return Boolean(o);
+    });
+    var _unselectedOptions = (_options$filter = options.filter(function (x) {
+      return !selectedValues.includes(x.value);
+    })) !== null && _options$filter !== void 0 ? _options$filter : [];
+    return [].concat(_toConsumableArray(selectedOptions), _toConsumableArray(_unselectedOptions));
+  }
+};
 var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
   var style = props.style,
     className = props.className,
@@ -32,6 +64,12 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
     onPopupScroll = props.onPopupScroll,
     onBlur = props.onBlur,
     onDropdownVisibleChange = props.onDropdownVisibleChange,
+    toFilterOptions = props.toFilterOptions,
+    _props$searchInPanel = props.searchInPanel,
+    searchInPanel = _props$searchInPanel === void 0 ? false : _props$searchInPanel,
+    _props$pinSelectedOpt = props.pinSelectedOptions,
+    pinSelectedOptions = _props$pinSelectedOpt === void 0 ? false : _props$pinSelectedOpt,
+    searchInPanelPlaceholder = props.searchInPanelPlaceholder,
     rest = _objectWithoutProperties(props, _excluded);
   var _ref = typeof inexistent === 'boolean' ? {} : inexistent,
     _ref$inexistentText = _ref.inexistentText,
@@ -87,6 +125,19 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
   var _oldValue = useRef();
   var _changeOption = useRef();
   var _inexistent = useRef(false);
+  var panelSearchInputRef = useRef(null);
+  var useDefaultSearch = !(multiple && searchInPanel);
+  var optionWithPriority = useMemo(function () {
+    if (pinSelectedOptions && multiple) {
+      if (fetchOptions && !labelInValue) {
+        console.warn('远程搜索下，pinSelectedOptions只支持labelInValue模式,建议修改');
+      } else {
+        return createPinedSelectedOptions(selectOptions, selectValue);
+      }
+    }
+    return selectOptions;
+  }, [selectOptions, selectValue]);
+  var filteredOptions = toFilterOptions ? toFilterOptions(optionWithPriority) : optionWithPriority; // 只要有render就需要重新生成options
 
   // 监听值和备选项的变化（赋值备选项，执行不存在值的判断逻辑）
   useEffect(function () {
@@ -187,7 +238,7 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
             _yield$fetchOptions = _context.sent;
             data = _yield$fetchOptions.data;
             total = _yield$fetchOptions.total;
-            newOptions = (_selectOptions.current || []).concat(data || []);
+            newOptions = (current === 1 ? [] : _selectOptions.current || []).concat(data || []);
             _maxPage.current = Math.ceil(total / pageSize) || 1;
             // 下拉列表滚动至最新数据的位置
             if (_listEl.current) {
@@ -209,12 +260,12 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
 
   // 搜索防抖函数
   var debounceSearcher = useMemo(function () {
-    return Utils.debounce(loadOptions, 350);
+    return debounce(loadOptions, 350);
   }, [loadOptions]);
 
   // 文本框值变化时回调
   var search = function search(v) {
-    var _v = v.trim();
+    var _v = (v === null || v === void 0 ? void 0 : v.trim()) || '';
     setSearchValue(_v);
     if (fetchOptions) {
       debounceSearcher(_v, 1);
@@ -231,7 +282,7 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
     _extra.current = extra;
   }, [extra, loadOptions]);
 
-  // 滚动触底防抖函数
+  // 滚动触底防抖函数。注意需要pageSize要够大，否则不会触发滚动条滚动，也就不会翻页。建议用默认的20
   var debounceScrollor = useMemo(function () {
     var scroll = function scroll(e) {
       var start = e.target.scrollTop + e.target.offsetHeight;
@@ -241,7 +292,7 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
         loadOptions(searchValue, _current.current + 1);
       }
     };
-    return Utils.debounce(scroll, 350);
+    return debounce(scroll, 350);
   }, [loadOptions, searchValue]);
 
   // 下拉列表滚动时的回调
@@ -254,13 +305,16 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
     }
     onPopupScroll === null || onPopupScroll === void 0 || onPopupScroll(e);
   };
+  var clearSearchData = function clearSearchData() {
+    setSearchValue('');
+    loadOptions('', 1);
+  };
 
   // 失去焦点时的回调（若为异步分页查询，需重置查询）
   var blur = function blur(e) {
     // 若当前文本框有值，则清空文本框并重置查询
-    if (searchValue) {
-      setSearchValue('');
-      loadOptions('', 1);
+    if (useDefaultSearch && searchValue) {
+      clearSearchData();
     }
     onBlur === null || onBlur === void 0 || onBlur(e);
   };
@@ -277,8 +331,38 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
         }
       }
     }
+    // 新版搜索交互逻辑
+    if (!useDefaultSearch) {
+      if (open) {
+        var _panelSearchInputRef$;
+        (_panelSearchInputRef$ = panelSearchInputRef.current) === null || _panelSearchInputRef$ === void 0 || _panelSearchInputRef$.focus();
+      } else if (searchValue) {
+        // 避免界面抖动
+        setTimeout(clearSearchData, 200);
+      }
+    }
     onDropdownVisibleChange === null || onDropdownVisibleChange === void 0 || onDropdownVisibleChange(open);
   };
+  var renderDropdownPanel = function renderDropdownPanel(menu) {
+    if (!multiple || !searchInPanel) {
+      return menu;
+    }
+    return /*#__PURE__*/_jsxs(_Fragment, {
+      children: [/*#__PURE__*/_jsx(PanelSearchInput, {
+        ref: panelSearchInputRef,
+        placeholder: searchInPanelPlaceholder,
+        searchValue: searchValue,
+        onSearch: search
+      }), menu, filteredOptions.length > 0 && fetching && /*#__PURE__*/_jsx("div", {
+        style: {
+          color: '#999',
+          fontSize: 12,
+          textAlign: 'center'
+        },
+        children: "\u52A0\u8F7D\u4E2D..."
+      })]
+    });
+  };
   return /*#__PURE__*/_jsxs("div", {
     style: _objectSpread({
       position: label ? 'relative' : 'static',
@@ -297,10 +381,11 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
       value: selectValue,
       onChange: change,
       labelInValue: labelInValue,
-      options: selectOptions,
+      options: filteredOptions,
       disabled: disabled,
       placeholder: "\u8BF7\u9009\u62E9",
-      showSearch: true,
+      showSearch: useDefaultSearch // 否则会和panel中的search冲突
+      ,
       optionFilterProp: "label",
       allowClear: true,
       maxTagCount: _maxTagCount,
@@ -330,8 +415,8 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
         });
       },
       filterOption: fetchOptions ? false : true,
-      searchValue: searchValue,
-      onSearch: search,
+      searchValue: useDefaultSearch ? searchValue : undefined,
+      onSearch: useDefaultSearch ? search : undefined,
       loading: fetching,
       notFoundContent: fetching ? /*#__PURE__*/_jsx(Spin, {
         size: "small"
@@ -340,7 +425,8 @@ var McSelect = /*#__PURE__*/forwardRef(function (props, ref) {
       }),
       onPopupScroll: popupScroll,
       onBlur: blur,
-      onDropdownVisibleChange: dropdownVisibleChange
+      onDropdownVisibleChange: dropdownVisibleChange,
+      dropdownRender: renderDropdownPanel
     }, rest), {}, {
       mode: multiple ? 'multiple' : undefined,
       fieldNames: undefined

package/dist/McTag/demo/demo1.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/dist/McTag/demo/demo1.js

@@ -0,0 +1,18 @@
+/**
+ * title: 设置本身宽度以支持ellipsis
+ * description: 在McTag上设置宽度，以支持ellipsis。同时支持复制
+ */
+import McTag from "../index";
+import { jsx as _jsx } from "react/jsx-runtime";
+export default (function () {
+  var uri = '/recommend/page/123/page/123/page/123';
+  return /*#__PURE__*/_jsx(McTag, {
+    style: {
+      maxWidth: 150
+    },
+    ellipsis: true,
+    color: "blue",
+    copyable: true,
+    children: uri
+  });
+});

package/dist/McTag/demo/demo2.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/dist/McTag/demo/demo2.js

@@ -0,0 +1,20 @@
+/**
+ * title: 设置父组件宽度以支持ellipsis
+ * description: 在McTag上设置宽度，以支持ellipsis。同时支持复制
+ */
+import McTag from "../index";
+import { jsx as _jsx } from "react/jsx-runtime";
+export default (function () {
+  var uri = '/recommend/page/123/page/123/page/123';
+  return /*#__PURE__*/_jsx("div", {
+    style: {
+      width: 200
+    },
+    children: /*#__PURE__*/_jsx(McTag, {
+      color: "blue",
+      copyable: true,
+      ellipsis: true,
+      children: uri
+    })
+  });
+});

package/dist/McTag/demo/demo3.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/dist/McTag/demo/demo3.js

@@ -0,0 +1,19 @@
+/**
+ * title: 支持复制
+ * description: 普通McTag模式也支持复制
+ */
+import { ExclamationCircleOutlined } from 'much-icons';
+import McTag from "../index";
+import { jsx as _jsx } from "react/jsx-runtime";
+export default (function () {
+  return /*#__PURE__*/_jsx(McTag, {
+    style: {
+      maxWidth: 150
+    },
+    ellipsis: true,
+    color: "warning",
+    icon: /*#__PURE__*/_jsx(ExclamationCircleOutlined, {}),
+    copyable: true,
+    children: "click me to copy"
+  });
+});

package/dist/McTag/demo/demo4.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/dist/McTag/demo/demo4.js

@@ -0,0 +1,22 @@
+/**
+ * title: 自定义ellipsis属性
+ */
+import McTag from "../index";
+import { jsx as _jsx } from "react/jsx-runtime";
+export default (function () {
+  var uri = '/recommend/page/123/page/123/page/123';
+  return /*#__PURE__*/_jsx("div", {
+    style: {
+      width: 200
+    },
+    children: /*#__PURE__*/_jsx(McTag, {
+      color: "blue",
+      copyable: true,
+      ellipsis: {
+        tooltip: true,
+        suffix: '等'
+      },
+      children: uri
+    })
+  });
+});

package/dist/McTag/index.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+import { TagProps } from 'antd';
+import { EllipsisConfig } from 'antd/es/typography/Base';
+interface McTagProps {
+    /**
+     * @description 为true时，使用默认行为，展示tooltip；为对象时，传递给Typography.Text的ellipsis属性
+     * @default undefined
+     */
+    ellipsis?: true | EllipsisConfig;
+    /**
+     * @description 是否可复制
+     * @default 默认为false
+     */
+    copyable?: boolean;
+    /**
+     * @description 省略模式时，设置文字样式。（一般用不上）
+     * @default undefined
+     */
+    ellipsisTextStyle?: React.CSSProperties;
+}
+declare const McTag: (props: TagProps & McTagProps) => import("react/jsx-runtime").JSX.Element;
+export default McTag;

package/dist/McTag/index.js

@@ -0,0 +1,59 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["ellipsis", "children", "copyable", "onClick", "ellipsisTextStyle"],
+  _excluded2 = ["style"];
+import { message, Tag, Typography } from 'antd';
+import { jsx as _jsx } from "react/jsx-runtime";
+var McTag = function McTag(props) {
+  var ellipsis = props.ellipsis,
+    children = props.children,
+    copyable = props.copyable,
+    _onClick = props.onClick,
+    ellipsisTextStyle = props.ellipsisTextStyle,
+    tagProps = _objectWithoutProperties(props, _excluded);
+  var useEllipsis = typeof children === 'string' && !!ellipsis;
+  var style = tagProps.style,
+    restTagProps = _objectWithoutProperties(tagProps, _excluded2);
+  var renderChildren = function renderChildren() {
+    if (useEllipsis) {
+      return /*#__PURE__*/_jsx(Typography.Text, {
+        style: _objectSpread({
+          color: 'inherit',
+          fontSize: 'inherit'
+        }, ellipsisTextStyle),
+        ellipsis: ellipsis === true ? {
+          tooltip: children
+        } : ellipsis,
+        children: children
+      });
+    }
+    return children;
+  };
+  return /*#__PURE__*/_jsx(Tag, _objectSpread(_objectSpread({
+    onClick: function onClick(e) {
+      if (copyable) {
+        var copyText = typeof copyable === 'string' ? copyable : children;
+        if (!(typeof copyText === 'string')) {
+          if (process.env.NODE_ENV === 'development') throw Error('copyable prop only support string children or string copyable');
+          return;
+        }
+        if (navigator.clipboard) {
+          navigator.clipboard.writeText(copyText).then(function () {
+            return message.success('复制成功!');
+          }, function () {
+            return message.error('复制失败!');
+          });
+        } else {
+          message.error('当前域名无权限使用剪切板');
+        }
+      }
+      if (_onClick) _onClick(e);
+    },
+    style: _objectSpread({
+      maxWidth: useEllipsis ? '100%' : 'none'
+    }, style)
+  }, restTagProps), {}, {
+    children: renderChildren()
+  }));
+};
+export default McTag;

package/dist/McThemeConfig/customToken.json

@@ -32,7 +32,8 @@
     },
     "Radio": {
       "buttonLineBg": "rgb(216, 216, 216)",
-      "buttonLineHeight": 16
+      "buttonLineHeight": 16,
+      "buttonCheckedBorderColorDisabled": "rgb(216, 216, 216)"
     }
   }
 }

package/dist/McThemeConfig/demo/radio.js

@@ -24,6 +24,16 @@ export default (function () {
         label: '选项二',
         value: 2
       }]
+    }), /*#__PURE__*/_jsx(Radio.Group, {
+      defaultValue: 1,
+      options: [{
+        label: '选项一',
+        value: 1,
+        disabled: true
+      }, {
+        label: '选项二',
+        value: 2
+      }]
     }), /*#__PURE__*/_jsx(Radio.Group, {
       defaultValue: 2,
       optionType: "button",
@@ -57,6 +67,20 @@ export default (function () {
         label: '选项三',
         value: 3
       }]
+    }), /*#__PURE__*/_jsx(Radio.Group, {
+      defaultValue: 1,
+      optionType: "button",
+      options: [{
+        label: '选项一',
+        value: 1,
+        disabled: true
+      }, {
+        label: '选项二',
+        value: 2
+      }, {
+        label: '选项三',
+        value: 3
+      }]
     }), /*#__PURE__*/_jsx(Radio.Group, {
       defaultValue: 2,
       optionType: "button",
@@ -92,6 +116,21 @@ export default (function () {
         label: '选项三',
         value: 3
       }]
+    }), /*#__PURE__*/_jsx(Radio.Group, {
+      defaultValue: 1,
+      optionType: "button",
+      buttonStyle: "solid",
+      options: [{
+        label: '选项一',
+        value: 1,
+        disabled: true
+      }, {
+        label: '选项二',
+        value: 2
+      }, {
+        label: '选项三',
+        value: 3
+      }]
     })]
   });
 });

package/dist/McThemeConfig/globalStyle.js

@@ -2,7 +2,7 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLit
 var _templateObject;
 // @ts-nocheck
 import { createGlobalStyle } from 'antd-style';
-var globalStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n// <====================== Layout ======================>\n\n", "\n\n// <====================== Font ======================>\n\n@font-face {\n   font-family: 'SourceHanSansCN';\n   src: url(", ");\n}\n\nbody * {\n  font-family: 'SourceHanSansCN';\n}\n\n// <====================== Button ======================>\n\n// primary\n.ant-btn-primary[disabled]{\n  background: ", ";\n  color: ", ";\n  opacity: 0.3;\n}\n\n// default\n.ant-btn-default[disabled] {\n  border-color: ", " !important;\n}\n\n// danger\n.ant-btn-default.ant-btn-dangerous,.ant-btn-default[data-danger],\n.ant-btn-default.ant-btn-dangerous[disabled],.ant-btn-default[data-danger][disabled] {\n  color: ", ";\n  background:  ", ";\n  border-color:", ";\n\n  &:hover {\n    color: ", " !important;\n    background: ", " !important;\n    border-color:", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n  }\n}\n.ant-btn-default.ant-btn-dangerous[disabled],.ant-btn-default[data-danger][disabled] {\n  opacity: 0.4;\n}\n\n// secondary\n.ant-btn-default[data-secondary],\n// modal\u3001drawer\u3001popconfirm footer\n.ant-modal-footer .ant-btn-default:not([data-default]):not([data-danger]):not(.ant-btn-dangerous),\n.ant-drawer-footer .ant-btn-default:not([data-default]):not([data-danger]):not(.ant-btn-dangerous),\n.ant-popconfirm-buttons .ant-btn-default:not([data-default]):not([data-danger]):not(.ant-btn-dangerous){\n  background: ", ";\n  border-color: ", ";\n\n  &:hover {\n    background: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active {\n    border-color: ", " !important;\n    color: ", " !important;\n  }\n}\n\n.ant-btn-default[data-secondary][disabled] {\n  color: ", " ;\n  background: ", ";\n  border-color: ", " !important;\n\n  &:hover {\n    color: ", ";\n    background: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n}\n\n// add\n.ant-btn-default[data-add] {\n  background: ", " !important;\n  color: ", " !important;\n  border-color: ", " !important;\n\n  &:hover {\n    color: ", " !important;\n    background: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active{\n    color: ", " !important;\n  }\n}\n\n.ant-btn-default[data-add][disabled] {\n  opacity: 0.4;\n  color: ", ";\n\n  &:hover {\n    background: ", " !important;\n    color: ", " !important;\n  }\n\n  &:active{\n    background: ", " !important;\n    color: ", " !important;\n  }\n}\n\n//dashed\n.ant-btn-dashed {\n  background: ", " !important;\n  border-color: ", " !important;\n}\n\n.ant-btn-dashed:not([disabled]) {\n  &:hover {\n    background: ", " !important;\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active{\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n}\n\n// dashed danger\n.ant-btn-dashed.ant-btn-dangerous,\n.ant-btn-dashed.ant-btn-dangerous:disabled {\n  color: ", " !important;\n  border-color: ", " !important;\n\n  &:hover {\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n  }\n}\n.ant-btn-dashed.ant-btn-dangerous:disabled {\n  opacity: 0.4;\n\n  &:hover {\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n}\n\n// ghost\n.ant-btn-background-ghost:not([disabled]) {\n  &:hover {\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n}\n\n// link\n.ant-btn-link:not([disabled]) {\n  &:hover {\n    color: ", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n\n  }\n}\n\n.ant-btn-link[disabled] {\n  color: ", " !important;\n  opacity: 0.3;\n}\n\n// link danger\n.ant-btn-link.ant-btn-dangerous {\n\n  &:hover {\n    color: ", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n  }\n}\n\n.ant-btn-link.ant-btn-dangerous:disabled {\n  color: ", " !important;\n  opacity: 0.3;\n}\n\n\n\n// <====================== Drawer ======================>\n\n.ant-drawer .ant-drawer-header{\n  border-bottom: none;\n  padding: 23px 24px;\n}\n// Drawer \u5BBD\u9AD8 \u4E1A\u52A1\u65B9\u81EA\u884C\u5B9E\u73B0\n//.ant-drawer .ant-drawer-content-wrapper {\n//  min-width: 480px\n//}\n.ant-drawer .ant-drawer-body{\n  padding: 0 24px;\n}\n.ant-drawer .ant-drawer-footer{\n  border-top: none;\n  padding: 24px;\n}\n\n// <====================== Modal ======================>\n\n.ant-modal .ant-modal-header {\n  margin-bottom:24px;\n}\n\n.ant-modal-body {\n  overflow-y: auto\n}\n\n/*\u5F53\u9875\u9762\u5BBD\u5EA6\u5927\u4E8E1280px\u4E14\u5C0F\u4E8E1366px\u7684\u65F6\u5019\u6267\u884C,1280-1366*/\n@media screen and (min-width:1280px) and (max-width: 1366px){\n  .ant-modal-root[data-small] {\n    .ant-modal-body {\n      max-height: 150px;\n    }\n    .ant-modal {\n      top: 150px;\n    }\n  }\n\n  .ant-modal-root[data-medium] {\n    .ant-modal-body {\n      max-height: 300px;\n      min-height: 150px\n    }\n    .ant-modal {\n      top: 80px;\n    }\n  }\n\n  .ant-modal-root[data-large] {\n    .ant-modal-body {\n      max-height: 450px;\n      min-height: 300px\n    }\n    .ant-modal {\n      top: 40px;\n    }\n  }\n}\n\n/*\u5F53\u9875\u9762\u5BBD\u5EA6\u5927\u4E8E1440px\u4E14\u5C0F\u4E8E1600px\u7684\u65F6\u5019\u6267\u884C,1440-1600*/\n@media screen and (min-width:1440px) and (max-width:1600px){\n  .ant-modal-root[data-small] {\n    .ant-modal-body {\n      max-height: 150px;\n    }\n    .ant-modal {\n      top: 200px;\n    }\n  }\n\n  .ant-modal-root[data-medium] {\n    .ant-modal-body {\n      max-height: 300px;\n      min-height: 150px\n    }\n    .ant-modal {\n      top: 150px;\n    }\n  }\n\n  .ant-modal-root[data-large] {\n    .ant-modal-body {\n      max-height: 450px;\n      min-height: 300px\n    }\n    .ant-modal {\n      top: 80px;\n    }\n  }\n}\n/*\u5F53\u9875\u9762\u5BBD\u5EA6\u5927\u4E8E1680px\u4E14\u5C0F\u4E8E1920px\u7684\u65F6\u5019\u6267\u884C,1680-1920*/\n@media screen and (min-width:1680px) and (max-width:2560px){\n  .ant-modal-root[data-small] {\n    .ant-modal-body {\n      max-height: 150px;\n    }\n    .ant-modal {\n      top: 200px;\n    }\n  }\n\n  .ant-modal-root[data-medium] {\n    .ant-modal-body {\n      max-height: 300px;\n      min-height: 150px\n    }\n    .ant-modal {\n      top: 150px;\n    }\n  }\n\n  .ant-modal-root[data-large] {\n    .ant-modal-body {\n      max-height: 450px;\n      min-height: 300px\n    }\n    .ant-modal {\n      top: 150px;\n    }\n  }\n}\n\n// <====================== Tabs ======================>\n\n.ant-tabs .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {\n  text-shadow: unset;\n}\n.ant-tabs-card {\n  .ant-tabs-nav {\n    &::before {\n      border: none;\n    }\n    .ant-tabs-nav-wrap {\n      background: transparent;\n      .ant-tabs-nav-list {\n        background: ", ";\n        border-top-right-radius: ", "px;\n        .ant-tabs-tab {\n          position: relative;\n          border: ", ";\n          border-radius: ", "px ", "px 0px 0px;\n          &::after {\n            position: absolute;\n            top: 11px;\n            right: -1px;\n            width: 1px;\n            height: 24px;\n            background: ", ";\n            content: '';\n          }\n        }\n        .ant-tabs-nav-add {\n          position: relative;\n          border: none;\n          border-top-right-radius: ", "px;\n          &::before {\n            position: absolute;\n            top: 11px;\n            left: 1px;\n            width: 1px;\n            height: 24px;\n            background: ", ";\n            content: '';\n          }\n        }\n        .ant-tabs-tab-active {\n          border: ", ";\n          &::after {\n            display: none;\n          }\n        }\n        .ant-tabs-tab:nth-last-of-type(2) {\n          &::after {\n            display: none;\n          }\n        }\n        .ant-tabs-tab:has(+ .ant-tabs-tab-active) {\n          &::after {\n            display: none;\n          }\n        }\n      }\n    }\n  }\n}\n\n// <====================== Pagination ======================>\n\n.ant-pagination {\n  display: flex;\n\n  .ant-pagination-total-text {\n    margin-right: auto;\n    color: ", ";\n  }\n\n  .ant-pagination-item.ant-pagination-item-active {\n    &:hover {\n      border-color: ", ";\n    }\n\n    &>a {\n      color: ", ";\n    }\n  }\n\n  &.ant-pagination-mini li:not(:first-of-type) {\n    margin-left: 2px;\n  }\n}\n\n// <====================== Radio ======================>\n.ant-radio-group {\n  .ant-radio-button-wrapper {\n    position: relative;\n    border: 1px solid ", ";\n    &::before {\n      display: none;\n    }\n    &::after {\n      display: inline-block;\n      position: absolute;\n      top: 50%;\n      transform: translateY(-50%);\n      width: 1px;\n      height: ", "px;\n      background: ", ";\n      right: -1px;\n      content: '';\n    }\n  }\n  .ant-radio-button-wrapper-checked {\n    border: 1px solid ", ";\n    &::after {\n      display: none;\n    }\n  }\n  .ant-radio-button-wrapper:nth-last-of-type(1) {\n    &::after {\n      display: none;\n    }\n  }\n  .ant-radio-button-wrapper:has(+ .ant-radio-button-wrapper-checked) {\n    &::after {\n      display: none;\n    }\n  }\n  .ant-radio-button-wrapper-disabled {\n    border: 1px solid ", ";\n  }\n  .ant-radio-button-wrapper-checked:has(+ .ant-radio-button-wrapper-disabled) {\n    border: 1px solid ", ";\n    background: 1px solid ", ";\n  }\n}\n"])), function (props) {
+var globalStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n// <====================== Layout ======================>\n\n", "\n\n// <====================== Font ======================>\n\n@font-face {\n   font-family: 'SourceHanSansCN';\n   src: url(", ");\n}\n\nbody * {\n  font-family: 'SourceHanSansCN';\n}\n\n// <====================== Button ======================>\n\n// primary\n.ant-btn-primary[disabled]{\n  background: ", ";\n  color: ", ";\n  opacity: 0.3;\n}\n\n// default\n.ant-btn-default[disabled] {\n  border-color: ", " !important;\n}\n\n// danger\n.ant-btn-default.ant-btn-dangerous,.ant-btn-default[data-danger],\n.ant-btn-default.ant-btn-dangerous[disabled],.ant-btn-default[data-danger][disabled] {\n  color: ", ";\n  background:  ", ";\n  border-color:", ";\n\n  &:hover {\n    color: ", " !important;\n    background: ", " !important;\n    border-color:", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n  }\n}\n.ant-btn-default.ant-btn-dangerous[disabled],.ant-btn-default[data-danger][disabled] {\n  opacity: 0.4;\n}\n\n// secondary\n.ant-btn-default[data-secondary],\n// modal\u3001drawer\u3001popconfirm footer\n.ant-modal-footer .ant-btn-default:not([data-default]):not([data-danger]):not(.ant-btn-dangerous),\n.ant-drawer-footer .ant-btn-default:not([data-default]):not([data-danger]):not(.ant-btn-dangerous),\n.ant-popconfirm-buttons .ant-btn-default:not([data-default]):not([data-danger]):not(.ant-btn-dangerous){\n  background: ", ";\n  border-color: ", ";\n\n  &:hover {\n    background: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active {\n    border-color: ", " !important;\n    color: ", " !important;\n  }\n}\n\n.ant-btn-default[data-secondary][disabled] {\n  color: ", " ;\n  background: ", ";\n  border-color: ", " !important;\n\n  &:hover {\n    color: ", ";\n    background: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n}\n\n// add\n.ant-btn-default[data-add] {\n  background: ", " !important;\n  color: ", " !important;\n  border-color: ", " !important;\n\n  &:hover {\n    color: ", " !important;\n    background: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active{\n    color: ", " !important;\n  }\n}\n\n.ant-btn-default[data-add][disabled] {\n  opacity: 0.4;\n  color: ", ";\n\n  &:hover {\n    background: ", " !important;\n    color: ", " !important;\n  }\n\n  &:active{\n    background: ", " !important;\n    color: ", " !important;\n  }\n}\n\n//dashed\n.ant-btn-dashed {\n  background: ", " !important;\n  border-color: ", " !important;\n}\n\n.ant-btn-dashed:not([disabled]) {\n  &:hover {\n    background: ", " !important;\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active{\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n}\n\n// dashed danger\n.ant-btn-dashed.ant-btn-dangerous,\n.ant-btn-dashed.ant-btn-dangerous:disabled {\n  color: ", " !important;\n  border-color: ", " !important;\n\n  &:hover {\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n  }\n}\n.ant-btn-dashed.ant-btn-dangerous:disabled {\n  opacity: 0.4;\n\n  &:hover {\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n}\n\n// ghost\n.ant-btn-background-ghost:not([disabled]) {\n  &:hover {\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n    border-color: ", " !important;\n  }\n}\n\n// link\n.ant-btn-link:not([disabled]) {\n  &:hover {\n    color: ", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n\n  }\n}\n\n.ant-btn-link[disabled] {\n  color: ", " !important;\n  opacity: 0.3;\n}\n\n// link danger\n.ant-btn-link.ant-btn-dangerous {\n\n  &:hover {\n    color: ", " !important;\n  }\n\n  &:active {\n    color: ", " !important;\n  }\n}\n\n.ant-btn-link.ant-btn-dangerous:disabled {\n  color: ", " !important;\n  opacity: 0.3;\n}\n\n\n\n// <====================== Drawer ======================>\n\n.ant-drawer .ant-drawer-header{\n  border-bottom: none;\n  padding: 23px 24px;\n  .ant-drawer-header-title {\n    flex-direction: row-reverse;\n    .ant-drawer-close {\n      margin: -4px;\n    }\n  }\n}\n// Drawer \u5BBD\u9AD8 \u4E1A\u52A1\u65B9\u81EA\u884C\u5B9E\u73B0\n//.ant-drawer .ant-drawer-content-wrapper {\n//  min-width: 480px\n//}\n.ant-drawer .ant-drawer-body{\n  padding: 0 24px;\n}\n.ant-drawer .ant-drawer-footer{\n  border-top: none;\n  padding: 24px;\n}\n\n// <====================== Modal ======================>\n\n.ant-modal .ant-modal-header {\n  margin-bottom:24px;\n}\n\n.ant-modal-body {\n  overflow-y: auto\n}\n\n/*\u5F53\u9875\u9762\u5BBD\u5EA6\u5927\u4E8E1280px\u4E14\u5C0F\u4E8E1366px\u7684\u65F6\u5019\u6267\u884C,1280-1366*/\n@media screen and (min-width:1280px) and (max-width: 1366px){\n  .ant-modal-root[data-small] {\n    .ant-modal-body {\n      max-height: 150px;\n    }\n    .ant-modal {\n      top: 150px;\n    }\n  }\n\n  .ant-modal-root[data-medium] {\n    .ant-modal-body {\n      max-height: 300px;\n      min-height: 150px\n    }\n    .ant-modal {\n      top: 80px;\n    }\n  }\n\n  .ant-modal-root[data-large] {\n    .ant-modal-body {\n      max-height: 450px;\n      min-height: 300px\n    }\n    .ant-modal {\n      top: 40px;\n    }\n  }\n}\n\n/*\u5F53\u9875\u9762\u5BBD\u5EA6\u5927\u4E8E1440px\u4E14\u5C0F\u4E8E1600px\u7684\u65F6\u5019\u6267\u884C,1440-1600*/\n@media screen and (min-width:1440px) and (max-width:1600px){\n  .ant-modal-root[data-small] {\n    .ant-modal-body {\n      max-height: 150px;\n    }\n    .ant-modal {\n      top: 200px;\n    }\n  }\n\n  .ant-modal-root[data-medium] {\n    .ant-modal-body {\n      max-height: 300px;\n      min-height: 150px\n    }\n    .ant-modal {\n      top: 150px;\n    }\n  }\n\n  .ant-modal-root[data-large] {\n    .ant-modal-body {\n      max-height: 450px;\n      min-height: 300px\n    }\n    .ant-modal {\n      top: 80px;\n    }\n  }\n}\n/*\u5F53\u9875\u9762\u5BBD\u5EA6\u5927\u4E8E1680px\u4E14\u5C0F\u4E8E1920px\u7684\u65F6\u5019\u6267\u884C,1680-1920*/\n@media screen and (min-width:1680px) and (max-width:2560px){\n  .ant-modal-root[data-small] {\n    .ant-modal-body {\n      max-height: 150px;\n    }\n    .ant-modal {\n      top: 200px;\n    }\n  }\n\n  .ant-modal-root[data-medium] {\n    .ant-modal-body {\n      max-height: 300px;\n      min-height: 150px\n    }\n    .ant-modal {\n      top: 150px;\n    }\n  }\n\n  .ant-modal-root[data-large] {\n    .ant-modal-body {\n      max-height: 450px;\n      min-height: 300px\n    }\n    .ant-modal {\n      top: 150px;\n    }\n  }\n}\n\n// <====================== Tabs ======================>\n\n.ant-tabs .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {\n  text-shadow: unset;\n}\n.ant-tabs-card {\n  .ant-tabs-nav {\n    margin: 0;\n    &::before {\n      border: none;\n    }\n    .ant-tabs-nav-wrap {\n      background: transparent;\n      .ant-tabs-nav-list {\n        background: ", ";\n        border-top-right-radius: ", "px;\n        .ant-tabs-tab {\n          position: relative;\n          border: ", ";\n          border-radius: ", "px ", "px 0px 0px;\n          &::after {\n            position: absolute;\n            top: 11px;\n            right: -1px;\n            width: 1px;\n            height: 24px;\n            background: ", ";\n            content: '';\n          }\n        }\n        .ant-tabs-nav-add {\n          position: relative;\n          border: none;\n          border-top-right-radius: ", "px;\n          &::before {\n            position: absolute;\n            top: 11px;\n            left: 1px;\n            width: 1px;\n            height: 24px;\n            background: ", ";\n            content: '';\n          }\n        }\n        .ant-tabs-tab-active {\n          border: ", ";\n          &::after {\n            display: none;\n          }\n        }\n        .ant-tabs-tab:nth-last-of-type(2) {\n          &::after {\n            display: none;\n          }\n        }\n        .ant-tabs-tab:has(+ .ant-tabs-tab-active) {\n          &::after {\n            display: none;\n          }\n        }\n      }\n    }\n  }\n}\n\n// <====================== Pagination ======================>\n\n.ant-pagination {\n  display: flex;\n  align-items: center;\n\n  .ant-pagination-total-text {\n    margin-right: auto;\n    color: ", ";\n  }\n\n  .ant-pagination-item.ant-pagination-item-active {\n    &:hover {\n      border-color: ", ";\n    }\n\n    &>a {\n      color: ", ";\n    }\n  }\n\n  .ant-pagination-options {\n    .ant-pagination-options-quick-jumper {\n      input {\n        background: ", ";\n        border-color:  ", ";\n        padding: 12px;\n\n        &:hover {\n          border-color: ", ";\n        }\n\n        &:focus {\n          border-color: ", ";\n        }\n      }\n    }\n  }\n\n  &.ant-pagination-mini li:not(:first-of-type) {\n    margin-left: 2px;\n  }\n}\n\n// <====================== Radio ======================>\n  .ant-radio-group {\n  .ant-radio-button-wrapper {\n    position: relative;\n    border: 1px solid ", ";\n    &::before {\n      display: none;\n    }\n    &::after {\n      display: inline-block;\n      position: absolute;\n      top: 50%;\n      transform: translateY(-50%);\n      width: 1px;\n      height: ", "px;\n      background: ", ";\n      right: -1px;\n      content: '';\n    }\n  }\n  .ant-radio-button-wrapper-checked {\n    border: 1px solid ", ";\n    &::after {\n      display: none;\n    }\n  }\n  .ant-radio-button-wrapper:nth-last-of-type(1) {\n    &::after {\n      display: none;\n    }\n  }\n  .ant-radio-button-wrapper:has(+ .ant-radio-button-wrapper-checked) {\n    &::after {\n      display: none;\n    }\n  }\n  .ant-radio-button-wrapper-disabled {\n    border: 1px solid ", " !important;\n  }\n  .ant-radio-button-wrapper-disabled.ant-radio-button-wrapper-checked {\n    border-color: ", " !important;\n  }\n}\n"])), function (props) {
   return props.layout;
 }, function (props) {
   return props.font.Regular;
@@ -154,6 +154,14 @@ var globalStyle = createGlobalStyle(_templateObject || (_templateObject = _tagge
   return props.theme.CustomToken.Pagination.itemActiveHoverBorderColor;
 }, function (props) {
   return props.theme.CustomToken.Pagination.itemActiveColor;
+}, function (props) {
+  return props.theme.Input.colorBgContainer;
+}, function (props) {
+  return props.theme.Input.colorBorder;
+}, function (props) {
+  return props.theme.Input.hoverBorderColor;
+}, function (props) {
+  return props.theme.Input.hoverBorderColor;
 }, function (props) {
   return props.theme.Radio.buttonBg;
 }, function (props) {
@@ -165,8 +173,6 @@ var globalStyle = createGlobalStyle(_templateObject || (_templateObject = _tagge
 }, function (props) {
   return props.theme.Radio.colorBgContainerDisabled;
 }, function (props) {
-  return props.theme.Radio.buttonCheckedColorDisabled;
-}, function (props) {
-  return props.theme.Radio.buttonCheckedBgDisabled;
+  return props.theme.CustomToken.Radio.buttonCheckedBorderColorDisabled;
 });
 export default globalStyle;

package/dist/McThemeConfig/themeToken.json

@@ -139,7 +139,7 @@
       "cardBg": "#F0F4F9",
       "cardGutter": 0,
       "cardHeight": 44,
-      "cardPadding": "11px 32px"
+      "cardPadding": "12px 32px"
     },
     "Pagination": {
       "itemActiveBg": "#325CF7",

package/dist/Utils/index.d.ts

@@ -1,4 +1,5 @@
-declare const _default: {
-    debounce: (fn: (...args: any[]) => any, wait: number) => (...args: any[]) => void;
-};
-export default _default;
+/** 工具方法 */
+export { default as debounce } from 'lodash/debounce';
+export { default as isEmpty } from 'lodash/isEmpty';
+export { default as isNil } from 'lodash/isNil';
+export { default as throttle } from 'lodash/throttle';

package/dist/Utils/index.js

@@ -1,26 +1,6 @@
-/**
- * 防抖函数
- * @param fn 回调函数
- * @param wait 间隔时间
- * @returns {void}
- */
-var debounce = function debounce(fn, wait) {
-  var timer = null;
-  return function () {
-    var _this = this;
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    if (timer) {
-      clearInterval(timer);
-    }
-    timer = setTimeout(function () {
-      fn.call(_this, args);
-      clearInterval(timer);
-      timer = null;
-    }, wait);
-  };
-};
-export default {
-  debounce: debounce
-};
+/** 工具方法 */
+
+export { default as debounce } from 'lodash/debounce';
+export { default as isEmpty } from 'lodash/isEmpty';
+export { default as isNil } from 'lodash/isNil';
+export { default as throttle } from 'lodash/throttle';

package/dist/index.d.ts

@@ -10,10 +10,13 @@ import McModalProvider from './McModalProvider';
 import McPeriodSelect from './McPeriodSelect';
 import McPopoverButton from './McPopoverButton';
 import McPopoverForm from './McPopoverForm';
+import McProSelect from './McProSelect';
 import McResult from './McResult';
 import McSelect from './McSelect';
+import McTag from './McTag';
+import McLazyLoader from './McLazyLoader';
 import McThemeConfig from './McThemeConfig';
 import McTreePanel from './McTreePanel';
 import McTreeSelect from './McTreeSelect';
-import Utils from './Utils';
-export { McCascader, McContainer, McDateRange, McFonts, McGroupPanel, McIconFont, McInput, McInputNumber, McModalProvider, McPeriodSelect, McPopoverButton, McPopoverForm, McResult, McSelect, McThemeConfig, McTreePanel, McTreeSelect, Utils, };
+import * as Utils from './Utils';
+export { McCascader, McContainer, McDateRange, McFonts, McGroupPanel, McIconFont, McInput, McInputNumber, McLazyLoader, McModalProvider, McPeriodSelect, McPopoverButton, McPopoverForm, McProSelect, McResult, McSelect, McTag, McThemeConfig, McTreePanel, McTreeSelect, Utils, };

package/dist/index.js

@@ -10,10 +10,13 @@ import McModalProvider from "./McModalProvider";
 import McPeriodSelect from "./McPeriodSelect";
 import McPopoverButton from "./McPopoverButton";
 import McPopoverForm from "./McPopoverForm";
+import McProSelect from "./McProSelect";
 import McResult from "./McResult";
 import McSelect from "./McSelect";
+import McTag from "./McTag";
+import McLazyLoader from "./McLazyLoader";
 import McThemeConfig from "./McThemeConfig";
 import McTreePanel from "./McTreePanel";
 import McTreeSelect from "./McTreeSelect";
-import Utils from "./Utils";
-export { McCascader, McContainer, McDateRange, McFonts, McGroupPanel, McIconFont, McInput, McInputNumber, McModalProvider, McPeriodSelect, McPopoverButton, McPopoverForm, McResult, McSelect, McThemeConfig, McTreePanel, McTreeSelect, Utils };
+import * as Utils from "./Utils";
+export { McCascader, McContainer, McDateRange, McFonts, McGroupPanel, McIconFont, McInput, McInputNumber, McLazyLoader, McModalProvider, McPeriodSelect, McPopoverButton, McPopoverForm, McProSelect, McResult, McSelect, McTag, McThemeConfig, McTreePanel, McTreeSelect, Utils };