@ant-design/pro-components 3.0.2-0 → 3.1.1-0

package/lib/form/layouts/LoginForm/index.js

@@ -1,66 +1,61 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.LoginForm = LoginForm;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _antd = require("antd");
-var _classnames = _interopRequireDefault(require("classnames"));
+var _clsx = require("clsx");
 var _react = _interopRequireWildcard(require("react"));
 var _provider = require("../../../provider");
 var _ProForm = require("../ProForm");
 var _style = require("./style");
 var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["logo", "message", "contentStyle", "title", "subTitle", "actions", "children", "containerStyle", "otherStyle"];
 function LoginForm(props) {
-  var _proFormProps$submitt;
-  var logo = props.logo,
-    message = props.message,
-    contentStyle = props.contentStyle,
-    title = props.title,
-    subTitle = props.subTitle,
-    actions = props.actions,
-    children = props.children,
-    containerStyle = props.containerStyle,
-    otherStyle = props.otherStyle,
-    proFormProps = (0, _objectWithoutProperties2.default)(props, _excluded);
-  var intl = (0, _provider.useIntl)();
-  var submitter = proFormProps.submitter === false ? false : (0, _objectSpread2.default)((0, _objectSpread2.default)({
+  const {
+    logo,
+    message,
+    contentStyle,
+    title,
+    subTitle,
+    actions,
+    children,
+    containerStyle,
+    otherStyle,
+    ...proFormProps
+  } = props;
+  const intl = (0, _provider.useIntl)();
+  const submitter = proFormProps.submitter === false ? false : {
     searchConfig: {
       submitText: intl.getMessage('loginForm.submitText', '登录')
-    }
-  }, proFormProps.submitter), {}, {
-    submitButtonProps: (0, _objectSpread2.default)({
+    },
+    ...proFormProps.submitter,
+    submitButtonProps: {
       size: 'large',
       style: {
         width: '100%'
-      }
-    }, (_proFormProps$submitt = proFormProps.submitter) === null || _proFormProps$submitt === void 0 ? void 0 : _proFormProps$submitt.submitButtonProps),
-    render: function render(_, dom) {
-      var _proFormProps$submitt2;
-      var loginButton = dom.pop();
-      if (typeof (proFormProps === null || proFormProps === void 0 || (_proFormProps$submitt2 = proFormProps.submitter) === null || _proFormProps$submitt2 === void 0 ? void 0 : _proFormProps$submitt2.render) === 'function') {
-        var _proFormProps$submitt3, _proFormProps$submitt4;
-        return proFormProps === null || proFormProps === void 0 || (_proFormProps$submitt3 = proFormProps.submitter) === null || _proFormProps$submitt3 === void 0 || (_proFormProps$submitt4 = _proFormProps$submitt3.render) === null || _proFormProps$submitt4 === void 0 ? void 0 : _proFormProps$submitt4.call(_proFormProps$submitt3, _, dom);
+      },
+      ...proFormProps.submitter?.submitButtonProps
+    },
+    render: (_, dom) => {
+      const loginButton = dom.pop();
+      if (typeof proFormProps?.submitter?.render === 'function') {
+        return proFormProps?.submitter?.render?.(_, dom);
       }
       return loginButton;
     }
-  });
-  var context = (0, _react.useContext)(_antd.ConfigProvider.ConfigContext);
-  var baseClassName = context.getPrefixCls('pro-form-login');
-  var _useStyle = (0, _style.useStyle)(baseClassName),
-    wrapSSR = _useStyle.wrapSSR,
-    hashId = _useStyle.hashId;
-  var getCls = function getCls(className) {
-    return "".concat(baseClassName, "-").concat(className, " ").concat(hashId);
   };
+  const context = (0, _react.useContext)(_antd.ConfigProvider.ConfigContext);
+  const baseClassName = context.getPrefixCls('pro-form-login');
+  const {
+    wrapSSR,
+    hashId
+  } = (0, _style.useStyle)(baseClassName);
+  const getCls = className => `${baseClassName}-${className} ${hashId}`;
 
   /** 生成logo 的dom，如果是string 设置为图片 如果是个 dom 就原样保留 */
-  var logoDom = (0, _react.useMemo)(function () {
+  const logoDom = (0, _react.useMemo)(() => {
     if (!logo) return null;
     if (typeof logo === 'string') {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
@@ -70,12 +65,12 @@ function LoginForm(props) {
     return logo;
   }, [logo]);
   return wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: (0, _classnames.default)(getCls('container'), hashId),
+    className: (0, _clsx.clsx)(getCls('container'), hashId),
     style: containerStyle,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: "".concat(getCls('top'), " ").concat(hashId).trim(),
+      className: `${getCls('top')} ${hashId}`.trim(),
       children: [title || logoDom ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: "".concat(getCls('header')),
+        className: `${getCls('header')}`,
         children: [logoDom ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
           className: getCls('logo'),
           children: logoDom
@@ -89,15 +84,16 @@ function LoginForm(props) {
       }) : null]
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: getCls('main'),
-      style: (0, _objectSpread2.default)({
-        width: 328
-      }, contentStyle),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_ProForm.ProForm, (0, _objectSpread2.default)((0, _objectSpread2.default)({
-        isKeyPressSubmit: true
-      }, proFormProps), {}, {
+      style: {
+        width: 328,
+        ...contentStyle
+      },
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_ProForm.ProForm, {
+        isKeyPressSubmit: true,
+        ...proFormProps,
         submitter: submitter,
         children: [message, children]
-      })), actions ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      }), actions ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: getCls('main-other'),
         style: otherStyle,
         children: actions

package/lib/form/layouts/LoginForm/style.d.ts

@@ -4,6 +4,6 @@ export interface LoginFormToken extends ProAliasToken {
     componentCls: string;
 }
 export declare function useStyle(prefixCls: string): {
-    wrapSSR: (node: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) => import("react").JSX.Element;
+    wrapSSR: (node: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
     hashId: string;
 };

package/lib/form/layouts/LoginForm/style.js

@@ -1,84 +1,87 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useStyle = useStyle;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _provider = require("../../../provider");
-var genLoginFormStyle = function genLoginFormStyle(token) {
-  return (0, _defineProperty2.default)((0, _defineProperty2.default)({}, token.componentCls, {
-    '&-container': {
-      display: 'flex',
-      flex: '1',
-      flexDirection: 'column',
-      height: '100%',
-      paddingInline: 32,
-      paddingBlock: 24,
-      overflow: 'auto',
-      background: 'inherit'
-    },
-    '&-top': {
-      textAlign: 'center'
-    },
-    '&-header': {
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'center',
-      height: '44px',
-      lineHeight: '44px',
-      a: {
-        textDecoration: 'none'
-      }
-    },
-    '&-title': {
-      position: 'relative',
-      insetBlockStart: '2px',
-      color: '@heading-color',
-      fontWeight: '600',
-      fontSize: '33px'
-    },
-    '&-logo': {
-      width: '44px',
-      height: '44px',
-      marginInlineEnd: '16px',
-      verticalAlign: 'top',
-      img: {
-        width: '100%'
+const genLoginFormStyle = token => {
+  return {
+    [token.componentCls]: {
+      '&-container': {
+        display: 'flex',
+        flex: '1',
+        flexDirection: 'column',
+        height: '100%',
+        paddingInline: 32,
+        paddingBlock: 24,
+        overflow: 'auto',
+        background: 'inherit'
+      },
+      '&-top': {
+        textAlign: 'center'
+      },
+      '&-header': {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        height: '44px',
+        lineHeight: '44px',
+        a: {
+          textDecoration: 'none'
+        }
+      },
+      '&-title': {
+        position: 'relative',
+        insetBlockStart: '2px',
+        color: '@heading-color',
+        fontWeight: '600',
+        fontSize: '33px'
+      },
+      '&-logo': {
+        width: '44px',
+        height: '44px',
+        marginInlineEnd: '16px',
+        verticalAlign: 'top',
+        img: {
+          width: '100%'
+        }
+      },
+      '&-desc': {
+        marginBlockStart: '12px',
+        marginBlockEnd: '40px',
+        color: token.colorTextSecondary,
+        fontSize: token.fontSize
+      },
+      '&-main': {
+        minWidth: '328px',
+        maxWidth: '580px',
+        margin: '0 auto',
+        '&-other': {
+          marginBlockStart: '24px',
+          lineHeight: '22px',
+          textAlign: 'start'
+        }
       }
     },
-    '&-desc': {
-      marginBlockStart: '12px',
-      marginBlockEnd: '40px',
-      color: token.colorTextSecondary,
-      fontSize: token.fontSize
-    },
-    '&-main': {
-      minWidth: '328px',
-      maxWidth: '580px',
-      margin: '0 auto',
-      '&-other': {
-        marginBlockStart: '24px',
-        lineHeight: '22px',
-        textAlign: 'start'
+    '@media (min-width: @screen-md-min)': {
+      [`${token.componentCls}-container`]: {
+        paddingInline: 0,
+        paddingBlockStart: 32,
+        paddingBlockEnd: 24,
+        backgroundRepeat: 'no-repeat',
+        backgroundPosition: 'center 110px',
+        backgroundSize: '100%'
       }
     }
-  }), '@media (min-width: @screen-md-min)', (0, _defineProperty2.default)({}, "".concat(token.componentCls, "-container"), {
-    paddingInline: 0,
-    paddingBlockStart: 32,
-    paddingBlockEnd: 24,
-    backgroundRepeat: 'no-repeat',
-    backgroundPosition: 'center 110px',
-    backgroundSize: '100%'
-  }));
+  };
 };
 function useStyle(prefixCls) {
-  return (0, _provider.useStyle)('LoginForm', function (token) {
-    var loginFormToken = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, token), {}, {
-      componentCls: ".".concat(prefixCls)
-    });
+  return (0, _provider.useStyle)('LoginForm', token => {
+    const loginFormToken = {
+      ...token,
+      componentCls: `.${prefixCls}`
+    };
     return [genLoginFormStyle(loginFormToken)];
   });
 }

package/lib/form/layouts/LoginFormPage/index.d.ts

@@ -62,4 +62,4 @@ export type LoginFormPageProps<T> = {
     mainStyle?: React.CSSProperties;
     otherStyle?: React.CSSProperties;
 } & Omit<ProFormProps<T>, 'title'>;
-export declare function LoginFormPage<T = Record<string, any>>(props: Partial<LoginFormPageProps<T>>): React.JSX.Element;
+export declare function LoginFormPage<T = Record<string, any>>(props: Partial<LoginFormPageProps<T>>): React.ReactElement<any, string | React.JSXElementConstructor<any>>;

package/lib/form/layouts/LoginFormPage/index.js

@@ -1,69 +1,64 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.LoginFormPage = LoginFormPage;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _antd = require("antd");
-var _classnames = _interopRequireDefault(require("classnames"));
+var _clsx = require("clsx");
 var _react = _interopRequireWildcard(require("react"));
 var _provider = require("../../../provider");
 var _ProForm = require("../ProForm");
 var _style = require("./style");
 var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["logo", "message", "style", "activityConfig", "backgroundImageUrl", "backgroundVideoUrl", "title", "subTitle", "actions", "children", "containerStyle", "otherStyle", "mainStyle"];
 function LoginFormPage(props) {
-  var logo = props.logo,
-    message = props.message,
-    style = props.style,
-    activityConfig = props.activityConfig,
-    backgroundImageUrl = props.backgroundImageUrl,
-    backgroundVideoUrl = props.backgroundVideoUrl,
-    title = props.title,
-    subTitle = props.subTitle,
-    actions = props.actions,
-    children = props.children,
-    containerStyle = props.containerStyle,
-    otherStyle = props.otherStyle,
-    mainStyle = props.mainStyle,
-    proFormProps = (0, _objectWithoutProperties2.default)(props, _excluded);
-  var intl = (0, _provider.useIntl)();
-  var genSubmitButtonProps = function genSubmitButtonProps() {
-    var _proFormProps$submitt, _proFormProps$submitt2;
+  const {
+    logo,
+    message,
+    style,
+    activityConfig,
+    backgroundImageUrl,
+    backgroundVideoUrl,
+    title,
+    subTitle,
+    actions,
+    children,
+    containerStyle,
+    otherStyle,
+    mainStyle,
+    ...proFormProps
+  } = props;
+  const intl = (0, _provider.useIntl)();
+  const genSubmitButtonProps = () => {
     if (proFormProps.submitter === false) return false;
-    if (((_proFormProps$submitt = proFormProps.submitter) === null || _proFormProps$submitt === void 0 ? void 0 : _proFormProps$submitt.submitButtonProps) === false) return false;
-    return (0, _objectSpread2.default)({
+    if (proFormProps.submitter?.submitButtonProps === false) return false;
+    return {
       size: 'large',
       style: {
         width: '100%'
-      }
-    }, (_proFormProps$submitt2 = proFormProps.submitter) === null || _proFormProps$submitt2 === void 0 ? void 0 : _proFormProps$submitt2.submitButtonProps);
+      },
+      ...proFormProps.submitter?.submitButtonProps
+    };
   };
-  var submitter = (0, _objectSpread2.default)((0, _objectSpread2.default)({
+  const submitter = {
     searchConfig: {
       submitText: intl.getMessage('loginForm.submitText', '登录')
     },
-    render: function render(_, dom) {
-      return dom.pop();
-    }
-  }, proFormProps.submitter), {}, {
+    render: (_, dom) => dom.pop(),
+    ...proFormProps.submitter,
     submitButtonProps: genSubmitButtonProps()
-  });
-  var context = (0, _react.useContext)(_antd.ConfigProvider.ConfigContext);
-  var baseClassName = context.getPrefixCls('pro-form-login-page');
-  var _useStyle = (0, _style.useStyle)(baseClassName),
-    wrapSSR = _useStyle.wrapSSR,
-    hashId = _useStyle.hashId;
-  var getCls = function getCls(className) {
-    return "".concat(baseClassName, "-").concat(className, " ").concat(hashId).trim();
   };
+  const context = (0, _react.useContext)(_antd.ConfigProvider.ConfigContext);
+  const baseClassName = context.getPrefixCls('pro-form-login-page');
+  const {
+    wrapSSR,
+    hashId
+  } = (0, _style.useStyle)(baseClassName);
+  const getCls = className => `${baseClassName}-${className} ${hashId}`.trim();
 
   /** 生成logo 的dom，如果是string 设置为图片 如果是个 dom 就原样保留 */
-  var logoDom = (0, _react.useMemo)(function () {
+  const logoDom = (0, _react.useMemo)(() => {
     if (!logo) return null;
     if (typeof logo === 'string') {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
@@ -73,11 +68,12 @@ function LoginFormPage(props) {
     return logo;
   }, [logo]);
   return wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: (0, _classnames.default)(baseClassName, hashId),
-    style: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, style), {}, {
+    className: (0, _clsx.clsx)(baseClassName, hashId),
+    style: {
+      ...style,
       position: 'relative',
-      backgroundImage: backgroundImageUrl ? "url(\"".concat(backgroundImageUrl, "\")") : undefined
-    }),
+      backgroundImage: backgroundImageUrl ? `url("${backgroundImageUrl}")` : undefined
+    },
     children: [backgroundVideoUrl ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       style: {
         position: 'absolute',
@@ -104,7 +100,7 @@ function LoginFormPage(props) {
         }
       })
     }) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: (0, _classnames.default)(baseClassName, hashId),
+      className: (0, _clsx.clsx)(baseClassName, hashId),
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: getCls('notice'),
         children: activityConfig && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
@@ -144,12 +140,12 @@ function LoginFormPage(props) {
           }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
             className: getCls('main'),
             style: mainStyle,
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_ProForm.ProForm, (0, _objectSpread2.default)((0, _objectSpread2.default)({
-              isKeyPressSubmit: true
-            }, proFormProps), {}, {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_ProForm.ProForm, {
+              isKeyPressSubmit: true,
+              ...proFormProps,
               submitter: submitter,
               children: [message, children]
-            })), actions ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            }), actions ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: getCls('other'),
               style: otherStyle,
               children: actions

package/lib/form/layouts/LoginFormPage/style.d.ts

@@ -4,6 +4,6 @@ export interface LoginFormToken extends ProAliasToken {
     componentCls: string;
 }
 export declare function useStyle(prefixCls: string): {
-    wrapSSR: (node: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) => import("react").JSX.Element;
+    wrapSSR: (node: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
     hashId: string;
 };