@zat-design/sisyphus-react 4.0.0-beta.3 → 4.0.0-beta.5

package/es/ProDrawerForm/components/ProModal/index.js

@@ -1,9 +1,14 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import "antd/es/modal/style";
+import _Modal from "antd/es/modal";
+import "antd/es/space/style";
+import _Space from "antd/es/space";
+import "antd/es/button/style";
+import _Button from "antd/es/button";
 import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { useCallback, useState, useRef } from 'react';
-import { Space, Button, Modal } from 'antd';
 import { useScroll, useSize } from 'ahooks';
 import classnames from 'classnames';
 import { isArray } from 'lodash';
@@ -12,7 +17,7 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * 弹窗组件
  */
-var ProModal = function ProModal(_ref) {
+var ProModal = _ref => {
   var _ref$current;
   var form = _ref.form,
     title = _ref.title,
@@ -108,7 +113,7 @@ var ProModal = function ProModal(_ref) {
           _context.prev = 26;
           _context.t4 = _context["catch"](0);
           /** 使用setTimeout确保DOM已经更新，错误标记已经渲染 */
-          setTimeout(function () {
+          setTimeout(() => {
             var _ref$current2, _error$errorFields;
             var errorElement = (_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.querySelector('[class*="form-item-has-error"]');
             if (errorElement && _context.t4 !== null && _context.t4 !== void 0 && (_error$errorFields = _context.t4.errorFields) !== null && _error$errorFields !== void 0 && _error$errorFields.length) {
@@ -138,11 +143,11 @@ var ProModal = function ProModal(_ref) {
       'pro-modal-footer': extraLeft,
       'pro-modal-footer-123': true
     }),
-    children: [extraLeft, /*#__PURE__*/_jsxs(Space, {
-      children: [/*#__PURE__*/_jsx(Button, {
+    children: [extraLeft, /*#__PURE__*/_jsxs(_Space, {
+      children: [/*#__PURE__*/_jsx(_Button, {
         onClick: onCancel,
         children: cancelText
-      }), /*#__PURE__*/_jsx(Button, {
+      }), /*#__PURE__*/_jsx(_Button, {
         type: "primary",
         onClick: handleFinish,
         loading: okLoading !== null && okLoading !== void 0 ? okLoading : loading,
@@ -151,7 +156,7 @@ var ProModal = function ProModal(_ref) {
       })]
     })]
   });
-  var renderFooter = function renderFooter() {
+  var renderFooter = () => {
     if (noRenderFooter) {
       return null;
     }
@@ -164,7 +169,7 @@ var ProModal = function ProModal(_ref) {
     if (isArray(footer) && footer !== null && footer !== void 0 && footer.length) {
       return /*#__PURE__*/_jsx("div", {
         className: "pro-drawer-footer",
-        children: footer.map(function (item) {
+        children: footer.map(item => {
           if ( /*#__PURE__*/React.isValidElement(item)) {
             return item;
           }
@@ -174,7 +179,7 @@ var ProModal = function ProModal(_ref) {
     }
     return defaultFooter;
   };
-  return /*#__PURE__*/_jsx(Modal, _objectSpread(_objectSpread({
+  return /*#__PURE__*/_jsx(_Modal, _objectSpread(_objectSpread({
     className: _className,
     title: title,
     width: width,

package/es/ProDrawerForm/index.js

@@ -1,6 +1,7 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-var _locale$ProDrawerForm3;
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["open", "mode", "size", "disabled", "isView", "form", "proFormProps", "onCancel", "onCloseClean", "children", "okText", "isConfirmClose", "maskClosable", "cancelText"];
 import React, { createContext, forwardRef, useContext, useImperativeHandle, useMemo } from 'react';
 import { ProDrawer, ProModal } from "./components";
 import ProForm from "../ProForm";
@@ -8,79 +9,78 @@ import { transformBySize } from "./utils";
 import locale from "../locale";
 import { jsx as _jsx } from "react/jsx-runtime";
 var ProDrawerFormContext = /*#__PURE__*/createContext(null);
-export var useProDrawerFormContext = function useProDrawerFormContext() {
-  return useContext(ProDrawerFormContext);
-};
-var ProDrawerForm = /*#__PURE__*/forwardRef(function (props, ref) {
-  var _okText, _locale$ProDrawerForm, _locale$ProDrawerForm2;
-  var showType = props.showType,
-    okText = props.okText,
-    isView = props.isView;
+export var useProDrawerFormContext = () => useContext(ProDrawerFormContext);
+var ProDrawerForm = /*#__PURE__*/forwardRef((props, ref) => {
+  var _locale$ProDrawerForm, _locale$ProDrawerForm2, _locale$ProDrawerForm3;
   var open = props.open,
-    mode = props.mode,
-    size = props.size,
+    _props$mode = props.mode,
+    mode = _props$mode === void 0 ? 'Drawer' : _props$mode,
+    _props$size = props.size,
+    size = _props$size === void 0 ? 'middle' : _props$size,
     disabled = props.disabled,
+    isView = props.isView,
     originalForm = props.form,
-    proFormProps = props.proFormProps,
+    _props$proFormProps = props.proFormProps,
+    proFormProps = _props$proFormProps === void 0 ? {} : _props$proFormProps,
     onCancel = props.onCancel,
-    onCloseClean = props.onCloseClean,
-    children = props.children;
-  showType = mode || showType;
-  isView = isView || disabled;
-  okText = (_okText = okText) !== null && _okText !== void 0 ? _okText : showType === 'Drawer' ? locale === null || locale === void 0 || (_locale$ProDrawerForm = locale.ProDrawerForm) === null || _locale$ProDrawerForm === void 0 ? void 0 : _locale$ProDrawerForm.save : locale === null || locale === void 0 || (_locale$ProDrawerForm2 = locale.ProDrawerForm) === null || _locale$ProDrawerForm2 === void 0 ? void 0 : _locale$ProDrawerForm2.confirm;
-  var width = props.width;
+    _props$onCloseClean = props.onCloseClean,
+    onCloseClean = _props$onCloseClean === void 0 ? true : _props$onCloseClean,
+    children = props.children,
+    okText = props.okText,
+    _props$isConfirmClose = props.isConfirmClose,
+    isConfirmClose = _props$isConfirmClose === void 0 ? true : _props$isConfirmClose,
+    _props$maskClosable = props.maskClosable,
+    maskClosable = _props$maskClosable === void 0 ? false : _props$maskClosable,
+    _props$cancelText = props.cancelText,
+    cancelText = _props$cancelText === void 0 ? locale === null || locale === void 0 || (_locale$ProDrawerForm = locale.ProDrawerForm) === null || _locale$ProDrawerForm === void 0 ? void 0 : _locale$ProDrawerForm.cancel : _props$cancelText,
+    restProps = _objectWithoutProperties(props, _excluded);
+  var nextIsView = isView || disabled;
+  var nextOkText = okText !== null && okText !== void 0 ? okText : mode === 'Drawer' ? locale === null || locale === void 0 || (_locale$ProDrawerForm2 = locale.ProDrawerForm) === null || _locale$ProDrawerForm2 === void 0 ? void 0 : _locale$ProDrawerForm2.save : locale === null || locale === void 0 || (_locale$ProDrawerForm3 = locale.ProDrawerForm) === null || _locale$ProDrawerForm3 === void 0 ? void 0 : _locale$ProDrawerForm3.confirm;
+  var width = restProps.width;
   if (!width && size) {
     width = transformBySize(size);
   }
 
   // 强转string 类型
   if (!Number.isNaN(+width)) {
-    width = "".concat(width, "px");
+    width = `${width}px`;
   }
   var _ProForm$useForm = ProForm.useForm(originalForm),
     _ProForm$useForm2 = _slicedToArray(_ProForm$useForm, 1),
     form = _ProForm$useForm2[0];
-  var handleCancel = function handleCancel() {
+  var handleCancel = () => {
     onCloseClean && form.resetFields();
     onCancel === null || onCancel === void 0 || onCancel();
   };
 
   // 暴露form实例给用户
-  useImperativeHandle(ref, function () {
-    return form;
-  });
-  var DrawerModal = useMemo(function () {
+  useImperativeHandle(ref, () => form);
+  var DrawerModal = useMemo(() => {
     return {
       Drawer: ProDrawer,
       Modal: ProModal
-    }[showType];
-  }, [showType]);
+    }[mode];
+  }, [mode]);
   return /*#__PURE__*/_jsx(ProDrawerFormContext.Provider, {
     value: {
       source: 'ProDrawerForm'
     },
-    children: open ? /*#__PURE__*/_jsx(DrawerModal, _objectSpread(_objectSpread({}, props), {}, {
-      isView: isView,
+    children: open ? /*#__PURE__*/_jsx(DrawerModal, _objectSpread(_objectSpread({}, restProps), {}, {
+      isView: nextIsView,
       open: open,
       form: form,
       width: width,
-      okText: okText,
+      okText: nextOkText,
       onCancel: handleCancel,
+      isConfirmClose: isConfirmClose,
+      maskClosable: maskClosable,
+      cancelText: cancelText,
       children: children || /*#__PURE__*/_jsx(ProForm, _objectSpread({
         form: form,
-        disabled: isView,
+        disabled: nextIsView,
         footer: false
       }, proFormProps))
     })) : null
   });
 });
-ProDrawerForm.defaultProps = {
-  showType: 'Drawer',
-  size: 'middle',
-  isConfirmClose: true,
-  onCloseClean: true,
-  maskClosable: false,
-  cancelText: locale === null || locale === void 0 || (_locale$ProDrawerForm3 = locale.ProDrawerForm) === null || _locale$ProDrawerForm3 === void 0 ? void 0 : _locale$ProDrawerForm3.cancel,
-  proFormProps: {}
-};
 export default ProDrawerForm;

package/es/ProDrawerForm/style/index.less

@@ -1,5 +1,3 @@
-/* @root-entry-name: 'default'; */
-/* @import (reference) '~antd/es/style/themes/index.less'; */
 
 .pro-drawer {
   .original-value-tooltip {

package/es/ProDrawerForm/utils/index.js

@@ -2,7 +2,7 @@
  * 将枚举值转成数值px，暴露枚举，隐藏真实数值，暂时不让用户自定义
  * @param size 设计规范的三个尺寸  460 960 1200 对应 'small' | 'middle' | 'large'
  */
-export var transformBySize = function transformBySize(size) {
+export var transformBySize = size => {
   switch (size) {
     case 'small':
       return 460;

package/es/ProEditLabel/components/RenderProForm.js

@@ -1,19 +1,20 @@
+import "antd/es/space/style";
+import _Space from "antd/es/space";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import { useEffect } from 'react';
 import { omit } from 'lodash';
 import { InfoCircleOutlined } from '@ant-design/icons';
-import { Space } from 'antd';
 import { ProForm } from "../../index";
 import { matchFormValue } from "../utils";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
-var RenderProForm = function RenderProForm(props) {
+var RenderProForm = props => {
   var _props3, _props6, _props7;
   var columns = [];
   var primitiveProps = _objectSpread({}, props);
   var _props = {};
-  useEffect(function () {
+  useEffect(() => {
     // isNode以ReactNode节点方式打开popUp，默认每次打开弹窗清空弹窗内容
     if (primitiveProps !== null && primitiveProps !== void 0 && primitiveProps.value && !(primitiveProps !== null && primitiveProps !== void 0 && primitiveProps.isNode)) {
       var _props2;
@@ -21,7 +22,7 @@ var RenderProForm = function RenderProForm(props) {
     }
 
     // 销毁重置表单数据
-    return function () {
+    return () => {
       var _props$form;
       (_props$form = _props.form) === null || _props$form === void 0 || _props$form.resetFields();
     };
@@ -33,7 +34,7 @@ var RenderProForm = function RenderProForm(props) {
       name: props.type || 'Input'
     });
     _props = {
-      columns: columns,
+      columns,
       form: props.form,
       isView: props.isView
     };
@@ -42,12 +43,12 @@ var RenderProForm = function RenderProForm(props) {
   }
   if ((_props3 = _props) !== null && _props3 !== void 0 && _props3.isView) {
     var _props4;
-    (_props4 = _props) === null || _props4 === void 0 || (_props4 = _props4.columns) === null || _props4 === void 0 || _props4.forEach(function (item) {
+    (_props4 = _props) === null || _props4 === void 0 || (_props4 = _props4.columns) === null || _props4 === void 0 || _props4.forEach(item => {
       item.noStyle = true;
     });
   } else {
     var _props5;
-    (_props5 = _props) === null || _props5 === void 0 || (_props5 = _props5.columns) === null || _props5 === void 0 || _props5.forEach(function (item) {
+    (_props5 = _props) === null || _props5 === void 0 || (_props5 = _props5.columns) === null || _props5 === void 0 || _props5.forEach(item => {
       item.noStyle = false;
     });
   }
@@ -57,14 +58,14 @@ var RenderProForm = function RenderProForm(props) {
       children: primitiveProps === null || primitiveProps === void 0 ? void 0 : primitiveProps.title
     }), (primitiveProps === null || primitiveProps === void 0 ? void 0 : primitiveProps.tip) && !((_props7 = _props) !== null && _props7 !== void 0 && _props7.isView) && /*#__PURE__*/_jsx("div", {
       className: "pro-edit-label-tip",
-      children: /*#__PURE__*/_jsxs(Space, {
+      children: /*#__PURE__*/_jsxs(_Space, {
         align: "start",
         children: [/*#__PURE__*/_jsx(InfoCircleOutlined, {}), primitiveProps === null || primitiveProps === void 0 ? void 0 : primitiveProps.tip]
       })
     }), /*#__PURE__*/_jsx(ProForm, _objectSpread({
       span: 24,
       footer: false,
-      onValuesChange: function onValuesChange(changeValue, values) {
+      onValuesChange: (changeValue, values) => {
         var _props8;
         if (((_props8 = _props) === null || _props8 === void 0 ? void 0 : _props8.columns.length) === 1) {
           var _props9;

package/es/ProEditLabel/index.js

@@ -1,12 +1,18 @@
+import "antd/es/popconfirm/style";
+import _Popconfirm from "antd/es/popconfirm";
+import "antd/es/input/style";
+import _Input from "antd/es/input";
+import "antd/es/space/style";
+import _Space from "antd/es/space";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import "antd/es/form/style";
+import _Form from "antd/es/form";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["open", "disabled", "onOpenChange", "onFinish", "onConfirm", "trigger", "mode", "className", "size", "popupProps", "style", "viewEmpty", "children", "form"];
 import { EditOutlined } from '@ant-design/icons';
-import { Input, Popconfirm, Form, Space } from 'antd';
 import { useToggle, useSetState } from 'ahooks';
 import classnames from 'classnames';
 import React, { useEffect, useRef } from 'react';
@@ -16,7 +22,7 @@ import { matchFormValue } from "./utils";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
-var ProEditLabel = function ProEditLabel(_ref) {
+var ProEditLabel = _ref => {
   var _ref$open = _ref.open,
     open = _ref$open === void 0 ? false : _ref$open,
     _ref$disabled = _ref.disabled,
@@ -50,14 +56,14 @@ var ProEditLabel = function ProEditLabel(_ref) {
     _useToggle2 = _slicedToArray(_useToggle, 2),
     status = _useToggle2[0],
     toggleStatus = _useToggle2[1].toggle;
-  var _Form$useForm = Form.useForm(OriginForm),
+  var _Form$useForm = _Form.useForm(OriginForm),
     _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
     form = _Form$useForm2[0];
-  var _Form$useForm3 = Form.useForm(),
+  var _Form$useForm3 = _Form.useForm(),
     _Form$useForm4 = _slicedToArray(_Form$useForm3, 1),
     viewForm = _Form$useForm4[0];
   var inputRef = useRef(null);
-  var onPress = function onPress(e) {
+  var onPress = e => {
     var element = e.target;
     if (e.key === 'Enter') {
       onFinish && onFinish(element.value);
@@ -65,7 +71,7 @@ var ProEditLabel = function ProEditLabel(_ref) {
       toggleStatus();
     }
   };
-  var editHandle = function editHandle() {
+  var editHandle = () => {
     var _inputRef$current;
     toggleStatus();
     (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus();
@@ -82,14 +88,14 @@ var ProEditLabel = function ProEditLabel(_ref) {
       });
     }
   };
-  useEffect(function () {
+  useEffect(() => {
     var _inputRef$current2;
     status && ((_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.focus());
   }, [status]);
-  useEffect(function () {
+  useEffect(() => {
     _onOpenChange && _onOpenChange(status);
   }, [_onOpenChange, status]);
-  useEffect(function () {
+  useEffect(() => {
     setState({
       confirmValue: props.value,
       popValue: props.value
@@ -97,7 +103,7 @@ var ProEditLabel = function ProEditLabel(_ref) {
   }, [props.value]);
 
   // 初始化同步数据或者同步外部数据源
-  useEffect(function () {
+  useEffect(() => {
     // 弹窗模式使用form赋值
     if (mode === 'popup' && props.value) {
       // 兼容老写法
@@ -114,7 +120,7 @@ var ProEditLabel = function ProEditLabel(_ref) {
   }, [props.value, mode]);
 
   // 文本模式同步
-  useEffect(function () {
+  useEffect(() => {
     // 弹窗模式使用form赋值
     if (mode === 'popup' && confirmValue !== props.value) {
       // 兼容老写法
@@ -125,9 +131,15 @@ var ProEditLabel = function ProEditLabel(_ref) {
       }
     }
   }, [confirmValue, mode]);
-  var cls = classnames(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
-    'pro-edit-label': true
-  }, "trigger-".concat(trigger), trigger), 'pro-edit-label-small', size === 'small'), 'pro-edit-label-middle', size === 'middle'), 'pro-edit-label-large', size === 'large'), "".concat(className), className));
+  var cls = classnames({
+    'pro-edit-label': true,
+    [`trigger-${trigger}`]: trigger,
+    'pro-edit-label-small': size === 'small',
+    'pro-edit-label-middle': size === 'middle',
+    // 默认middle
+    'pro-edit-label-large': size === 'large',
+    [`${className}`]: className
+  });
 
   /**
    * pop确认回调
@@ -190,7 +202,7 @@ var ProEditLabel = function ProEditLabel(_ref) {
   /**
    * pop取消回调
    */
-  var onCancelHandle = function onCancelHandle() {
+  var onCancelHandle = () => {
     // 兼容老写法
     if (!popupProps.columns) {
       form.setFieldValue((popupProps === null || popupProps === void 0 ? void 0 : popupProps.type) || 'Input', props.value);
@@ -206,11 +218,11 @@ var ProEditLabel = function ProEditLabel(_ref) {
    * 渲染可编辑label
    * @returns
    */
-  var renderProEditLabel = function renderProEditLabel() {
+  var renderProEditLabel = () => {
     var TextNode = /*#__PURE__*/_jsx("div", {
       className: cls,
       style: style,
-      children: /*#__PURE__*/_jsxs(Space, {
+      children: /*#__PURE__*/_jsxs(_Space, {
         align: "start",
         children: [mode === 'current' ? props.value : /*#__PURE__*/_jsx(RenderProForm, _objectSpread({
           value: confirmValue,
@@ -233,17 +245,17 @@ var ProEditLabel = function ProEditLabel(_ref) {
     // 当前页编辑模式
     if (mode === 'current') {
       if (status) {
-        return /*#__PURE__*/_jsx(Input, _objectSpread(_objectSpread({
+        return /*#__PURE__*/_jsx(_Input, _objectSpread(_objectSpread({
           ref: inputRef,
           size: size,
-          onBlur: function onBlur(e) {
+          onBlur: e => {
             toggleStatus();
             onFinish && onFinish(e.target.value);
             onConfirm && onConfirm(e.target.value);
           },
           onKeyDown: onPress
         }, props), {}, {
-          onChange: function onChange(e) {
+          onChange: e => {
             props.onChange && props.onChange(e.target.value);
           }
         }));
@@ -253,13 +265,13 @@ var ProEditLabel = function ProEditLabel(_ref) {
     // 弹窗编辑模式
     if (mode === 'popup') {
       // 查看时内容渲染
-      var labelRender = function labelRender() {
+      var labelRender = () => {
         if ( /*#__PURE__*/React.isValidElement(children)) {
           return children;
         }
         return TextNode;
       };
-      return /*#__PURE__*/_jsx(Popconfirm, _objectSpread(_objectSpread({
+      return /*#__PURE__*/_jsx(_Popconfirm, _objectSpread(_objectSpread({
         classNames: {
           root: 'pro-edit-label-popconfirm'
         },
@@ -273,7 +285,7 @@ var ProEditLabel = function ProEditLabel(_ref) {
         }, popupProps)),
         onConfirm: onConfirmHandle,
         onCancel: onCancelHandle,
-        onOpenChange: function onOpenChange(open) {
+        onOpenChange: open => {
           _onOpenChange && _onOpenChange(open);
         }
       }, omit(popupProps, ['type', 'label', 'title', 'tip', 'trim', 'labelWidth', 'fieldProps', 'columns'])), {}, {

package/es/ProEditLabel/style/index.less

@@ -1,5 +1,3 @@
-/* @root-entry-name: 'default'; */
-/* @import (reference) '~antd/es/style/themes/index.less'; */
 
 .pro-edit-label {
   display: inline-block;

package/es/ProEditLabel/utils/index.js

@@ -1,16 +1,17 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 /**
  * 判断columns的length是否为1，给表单赋值，默认匹配到value上
  * @param value 表单值
  * @param columns 表单配置项
  * @returns value
  */
-export var matchFormValue = function matchFormValue(value, columns) {
+export var matchFormValue = (value, columns) => {
   if (!Array.isArray(columns)) {
     return value;
   }
   if (columns.length === 1) {
-    return _defineProperty({}, columns[0].name || columns[0].type, value);
+    return {
+      [columns[0].name || columns[0].type]: value
+    };
   }
   return value;
 };