antd-mobile 5.2.1 → 5.2.2

package/es/components/modal/modal.js

@@ -52,49 +52,28 @@ export const Modal = p => {
     }
   });
   const [active, setActive] = useState(props.visible);
-  const node = withStopPropagation(props.stopPropagation, withNativeProps(props, React.createElement("div", {
-    className: classPrefix,
-    style: {
-      display: active ? 'unset' : 'none'
-    }
-  }, React.createElement(Mask, {
-    visible: props.visible,
-    onMaskClick: props.closeOnMaskClick ? props.onClose : undefined,
-    style: props.maskStyle,
-    className: classNames(`${classPrefix}-mask`, props.maskClassName)
-  }), React.createElement("div", {
-    className: `${classPrefix}-wrap`,
-    style: {
-      pointerEvents: props.visible ? 'unset' : 'none'
-    }
-  }, React.createElement(animated.div, {
-    style: Object.assign({}, style),
-    onClick: e => e.stopPropagation(),
-    className: `${classPrefix}-main`
+  const body = React.createElement("div", {
+    className: classNames(cls('body'), props.image && cls('with-image'), props.bodyClassName),
+    style: props.bodyStyle
   }, props.showCloseButton && React.createElement("a", {
-    className: classNames(`${classPrefix}-close`, 'adm-plain-anchor'),
+    className: classNames(cls('close'), 'adm-plain-anchor'),
     onClick: props.onClose
   }, React.createElement(CloseOutline, null)), !!props.image && React.createElement("div", {
-    className: `${classPrefix}-image-container`
+    className: cls('image-container')
   }, React.createElement(Image, {
     src: props.image,
     alt: 'modal header image',
     width: '100%'
-  })), React.createElement("div", {
-    style: props.bodyStyle,
-    className: classNames(`${classPrefix}-body`, props.bodyClassName)
-  }, !!props.header && React.createElement("div", {
-    className: `${classPrefix}-body-header-wrapper`
-  }, React.createElement("div", {
-    className: `${classPrefix}-body-header`
-  }, props.header)), !!props.title && React.createElement("div", {
-    className: `${classPrefix}-body-title`
-  }, props.title), !!props.content && React.createElement("div", {
-    className: `${classPrefix}-body-content`
-  }, typeof props.content === 'string' ? React.createElement(AutoCenter, null, props.content) : props.content)), React.createElement(Space, {
+  })), !!props.header && React.createElement("div", {
+    className: cls('header')
+  }, React.createElement(AutoCenter, null, props.header)), !!props.title && React.createElement("div", {
+    className: cls('title')
+  }, props.title), React.createElement("div", {
+    className: cls('content')
+  }, typeof props.content === 'string' ? React.createElement(AutoCenter, null, props.content) : props.content), React.createElement(Space, {
     direction: 'vertical',
     block: true,
-    className: `${classPrefix}-footer`
+    className: classNames(cls('footer'), props.actions.length === 0 && cls('footer-empty'))
   }, props.actions.map((action, index) => {
     return React.createElement(ModalActionButton, {
       key: action.key,
@@ -109,6 +88,28 @@ export const Modal = p => {
         }
       })
     });
-  })))))));
+  })));
+  const node = withStopPropagation(props.stopPropagation, withNativeProps(props, React.createElement("div", {
+    className: cls(),
+    style: {
+      display: active ? 'unset' : 'none'
+    }
+  }, React.createElement(Mask, {
+    visible: props.visible,
+    onMaskClick: props.closeOnMaskClick ? props.onClose : undefined,
+    style: props.maskStyle,
+    className: classNames(cls('mask'), props.maskClassName)
+  }), React.createElement("div", {
+    className: cls('wrap'),
+    style: {
+      pointerEvents: props.visible ? 'unset' : 'none'
+    }
+  }, React.createElement(animated.div, {
+    style: style
+  }, body)))));
   return renderToContainer(props.getContainer, node);
-};
+};
+
+function cls(name = '') {
+  return 'adm-modal' + (name && '-') + name;
+}

package/es/components/popover/arrow.js

@@ -4,9 +4,8 @@ export const Arrow = memo(props => {
   return withNativeProps(props, React.createElement("svg", {
     viewBox: '0 0 30 16'
   }, React.createElement("g", {
-    transform: 'translate(-1300.000000, -841.000000)',
     fill: 'currentColor'
   }, React.createElement("path", {
-    d: 'M1300,841 L1330,841 L1318.07289,855.312538 C1316.65863,857.009645 1314.13637,857.238942 1312.43926,855.824685 C1312.25341,855.669808 1312.08199,855.49839 1311.92711,855.312538 L1300,841 L1300,841 Z'
+    d: 'M0,0 L30,0 L18.07289,14.312538 C16.65863,16.009645 14.13637,16.238942 12.43926,14.824685 C12.25341,14.669808 12.08199,14.49839 11.92711,14.312538 L0,0 L0,0 Z'
   }))));
 });

package/es/components/switch/spin-icon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { NativeProps } from '../../utils/native-props';
+export declare const SpinIcon: React.NamedExoticComponent<NativeProps<never>>;

package/es/components/switch/spin-icon.js

@@ -0,0 +1,23 @@
+import React, { memo } from 'react';
+import { withNativeProps } from '../../utils/native-props';
+export const SpinIcon = memo(props => {
+  return withNativeProps(props, React.createElement("svg", {
+    width: '28px',
+    height: '28px',
+    viewBox: '0 0 28 28'
+  }, React.createElement("g", {
+    stroke: 'none',
+    strokeWidth: '1',
+    fill: 'none',
+    fillRule: 'evenodd'
+  }, React.createElement("g", {
+    transform: 'translate(-137.000000, -840.000000)',
+    fill: '#1576FE'
+  }, React.createElement("g", {
+    transform: 'translate(80.000000, 823.000000)'
+  }, React.createElement("g", {
+    transform: 'translate(53.000000, 13.000000)'
+  }, React.createElement("path", {
+    d: 'M17.9996753,31.5 C10.5556724,31.5 4.5,25.4443275 4.5,18.0003247 C4.5,10.5563219 10.5556724,4.5 17.9996753,4.5 C18.5355492,4.5 18.9702974,4.93474816 18.9702974,5.47062208 C18.9702974,6.006496 18.5355492,6.44124416 17.9996753,6.44124416 C11.6261524,6.44124416 6.44124416,11.6267709 6.44124416,18.0002938 C6.44124416,24.3738167 11.6261524,29.5587249 17.9996753,29.5587249 C24.3731982,29.5587249 29.5587249,24.3738167 29.5587249,18.0002938 C29.5587249,14.7964616 28.2778291,11.8169616 25.9523687,9.61220279 C25.5637302,9.24317094 25.5473089,8.62893223 25.9157222,8.23967523 C26.2841356,7.84976878 26.8989928,7.83461537 27.2882498,8.20302872 C30.0042351,10.7787368 31.5,14.2580826 31.5,18.0002938 C31.5,25.4443275 25.4436781,31.5 17.9996753,31.5 Z'
+  })))))));
+});

package/es/components/switch/switch.css

@@ -89,7 +89,7 @@
   cursor: not-allowed;
   opacity: 0.4;
 }
-.adm-switch-icon {
+.adm-switch-spin-icon {
   width: 14px;
   height: 14px;
   animation: loading-rotate 1s linear infinite;

package/es/components/switch/switch.js

@@ -1,10 +1,10 @@
 import { __awaiter } from "tslib";
 import classNames from 'classnames';
 import React, { useState } from 'react';
-import SpinIcon from '../../assets/spin.svg';
 import { withNativeProps } from '../../utils/native-props';
 import { usePropsValue } from '../../utils/use-props-value';
 import { mergeProps } from '../../utils/with-default-props';
+import { SpinIcon } from './spin-icon';
 const classPrefix = `adm-switch`;
 const defaultProps = {
   defaultChecked: false
@@ -54,10 +54,8 @@ export const Switch = p => {
     className: `${classPrefix}-checkbox`
   }, React.createElement("div", {
     className: `${classPrefix}-handle`
-  }, (props.loading || changing) && React.createElement("img", {
-    src: SpinIcon,
-    className: `${classPrefix}-icon`,
-    alt: 'switch-handle'
+  }, (props.loading || changing) && React.createElement(SpinIcon, {
+    className: `${classPrefix}-spin-icon`
   })), React.createElement("div", {
     className: `${classPrefix}-inner`
   }, checked ? props.checkedText : props.uncheckedText))));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "antd-mobile",
-  "version": "5.2.1",
+  "version": "5.2.2",
   "dependencies": {
     "@react-spring/web": "^9.4.3",
     "@types/resize-observer-browser": "^0.1.7",