antd-mobile 5.17.0 → 5.18.0

package/2x/cjs/components/tag/tag.js

@@ -0,0 +1,51 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Tag = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _withDefaultProps = require("../../utils/with-default-props");
+
+var _nativeProps = require("../../utils/native-props");
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const classPrefix = `adm-tag`;
+const colorRecord = {
+  default: '#666666',
+  primary: 'var(--adm-color-primary, #1677ff)',
+  success: 'var(--adm-color-success, #00b578)',
+  warning: 'var(--adm-color-warning, #ff8f1f)',
+  danger: 'var(--adm-color-danger, #ff3141)'
+};
+const defaultProps = {
+  color: 'default',
+  fill: 'solid',
+  round: false
+};
+
+const Tag = p => {
+  var _a;
+
+  const props = (0, _withDefaultProps.mergeProps)(defaultProps, p);
+  const color = (_a = colorRecord[props.color]) !== null && _a !== void 0 ? _a : props.color;
+  const style = {
+    '--border-color': color,
+    '--text-color': props.fill === 'outline' ? color : '#ffffff',
+    '--background-color': props.fill === 'outline' ? 'transparent' : color
+  };
+  return (0, _nativeProps.withNativeProps)(props, _react.default.createElement("span", {
+    style: style,
+    onClick: props.onClick,
+    className: (0, _classnames.default)(classPrefix, {
+      [`${classPrefix}-round`]: props.round
+    })
+  }, props.children));
+};
+
+exports.Tag = Tag;

package/2x/cjs/components/text-area/index.d.ts

@@ -0,0 +1,4 @@
+import './text-area.less';
+import { TextArea } from './text-area';
+export type { TextAreaProps, TextAreaRef } from './text-area';
+export default TextArea;

package/2x/cjs/components/text-area/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("./text-area.css");
+
+var _textArea2 = require("./text-area");
+
+var _default = _textArea2.TextArea;
+exports.default = _default;

package/2x/cjs/components/text-area/text-area.css

@@ -0,0 +1,78 @@
+.adm-text-area {
+  --font-size: var(--adm-font-size-9);
+  --color: var(--adm-color-text);
+  --placeholder-color: var(--adm-color-light);
+  --disabled-color: var(--adm-color-weak);
+  --text-align: left;
+  --count-text-align: right;
+  width: 100%;
+  max-width: 100%;
+  max-height: 100%;
+}
+
+.adm-text-area-element {
+  font-family: var(--adm-font-family);
+  resize: none;
+  flex: auto;
+  display: block;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 100%;
+  max-height: 100%;
+  padding: 0;
+  margin: 0;
+  color: var(--color);
+  font-size: var(--font-size);
+  line-height: 1.5;
+  background: transparent;
+  border: 0;
+  outline: none;
+  -webkit-appearance: none;
+  appearance: none;
+  min-height: 1.5em;
+  text-align: var(--text-align);
+}
+
+.adm-text-area-element::-webkit-input-placeholder {
+  color: var(--placeholder-color);
+  font-family: inherit;
+}
+
+.adm-text-area-element::placeholder {
+  color: var(--placeholder-color);
+  font-family: inherit;
+}
+
+.adm-text-area-element:-webkit-autofill {
+  background-color: transparent;
+}
+
+.adm-text-area-element:disabled {
+  color: var(--disabled-color);
+  cursor: not-allowed;
+  opacity: 1;
+  -webkit-text-fill-color: var(--disabled-color);
+}
+
+.adm-text-area-element:read-only {
+  cursor: default;
+}
+
+.adm-text-area-element:invalid {
+  box-shadow: none;
+}
+
+.adm-text-area-element::-ms-clear {
+  display: none;
+}
+
+.adm-text-area-element[readonly] {
+  pointer-events: none;
+}
+
+.adm-text-area-count {
+  text-align: var(--count-text-align);
+  color: var(--adm-color-weak);
+  font-size: var(--adm-font-size-9);
+  padding-top: 16px;
+}

package/2x/cjs/components/text-area/text-area.d.ts

@@ -0,0 +1,41 @@
+import React from 'react';
+import type { ReactNode } from 'react';
+import { NativeProps } from '../../utils/native-props';
+export declare type TextAreaProps = Pick<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, 'autoComplete' | 'autoFocus' | 'disabled' | 'readOnly' | 'name' | 'onFocus' | 'onBlur' | 'onCompositionStart' | 'onCompositionEnd' | 'onClick'> & {
+    onChange?: (val: string) => void;
+    value?: string;
+    defaultValue?: string;
+    placeholder?: string;
+    rows?: number;
+    maxLength?: number;
+    showCount?: boolean | ((length: number, maxLength?: number) => ReactNode);
+    autoSize?: boolean | {
+        minRows?: number;
+        maxRows?: number;
+    };
+    id?: string;
+} & NativeProps<'--font-size' | '--color' | '--placeholder-color' | '--disabled-color' | '--text-align' | '--count-text-align'>;
+export declare type TextAreaRef = {
+    clear: () => void;
+    focus: () => void;
+    blur: () => void;
+    nativeElement: HTMLTextAreaElement | null;
+};
+export declare const TextArea: React.ForwardRefExoticComponent<Pick<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "onClick" | "disabled" | "name" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "autoComplete" | "autoFocus" | "readOnly"> & {
+    onChange?: ((val: string) => void) | undefined;
+    value?: string | undefined;
+    defaultValue?: string | undefined;
+    placeholder?: string | undefined;
+    rows?: number | undefined;
+    maxLength?: number | undefined;
+    showCount?: boolean | ((length: number, maxLength?: number | undefined) => ReactNode) | undefined;
+    autoSize?: boolean | {
+        minRows?: number | undefined;
+        maxRows?: number | undefined;
+    } | undefined;
+    id?: string | undefined;
+} & {
+    className?: string | undefined;
+    style?: (React.CSSProperties & Partial<Record<"--color" | "--font-size" | "--placeholder-color" | "--text-align" | "--disabled-color" | "--count-text-align", string>>) | undefined;
+    tabIndex?: number | undefined;
+} & React.AriaAttributes & React.RefAttributes<TextAreaRef>>;

package/2x/cjs/components/text-area/text-area.js

@@ -0,0 +1,148 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TextArea = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _ahooks = require("ahooks");
+
+var _nativeProps = require("../../utils/native-props");
+
+var _usePropsValue = require("../../utils/use-props-value");
+
+var _withDefaultProps = require("../../utils/with-default-props");
+
+var _devLog = require("../../utils/dev-log");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const classPrefix = 'adm-text-area';
+const defaultProps = {
+  rows: 2,
+  showCount: false,
+  autoSize: false,
+  defaultValue: ''
+};
+const TextArea = (0, _react.forwardRef)((p, ref) => {
+  const props = (0, _withDefaultProps.mergeProps)(defaultProps, p);
+  const {
+    autoSize,
+    showCount,
+    maxLength
+  } = props;
+  const [value, setValue] = (0, _usePropsValue.usePropsValue)(Object.assign(Object.assign({}, props), {
+    value: props.value === null ? '' : props.value
+  }));
+
+  if (props.value === null) {
+    (0, _devLog.devError)('TextArea', '`value` prop on `TextArea` should not be `null`. Consider using an empty string to clear the component.');
+  }
+
+  const nativeTextAreaRef = (0, _react.useRef)(null);
+  (0, _react.useImperativeHandle)(ref, () => ({
+    clear: () => {
+      setValue('');
+    },
+    focus: () => {
+      var _a;
+
+      (_a = nativeTextAreaRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+    },
+    blur: () => {
+      var _a;
+
+      (_a = nativeTextAreaRef.current) === null || _a === void 0 ? void 0 : _a.blur();
+    },
+
+    get nativeElement() {
+      return nativeTextAreaRef.current;
+    }
+
+  }));
+  (0, _ahooks.useIsomorphicLayoutEffect)(() => {
+    if (!autoSize) return;
+    const textArea = nativeTextAreaRef.current;
+    if (!textArea) return;
+    textArea.style.height = 'auto';
+    let height = textArea.scrollHeight;
+
+    if (typeof autoSize === 'object') {
+      const computedStyle = window.getComputedStyle(textArea);
+      const lineHeight = parseFloat(computedStyle.lineHeight);
+
+      if (autoSize.minRows) {
+        height = Math.max(height, autoSize.minRows * lineHeight);
+      }
+
+      if (autoSize.maxRows) {
+        height = Math.min(height, autoSize.maxRows * lineHeight);
+      }
+    }
+
+    textArea.style.height = `${height}px`;
+  }, [value, autoSize]);
+  const compositingRef = (0, _react.useRef)(false);
+  let count;
+  const valueLength = [...value].length;
+
+  if (typeof showCount === 'function') {
+    count = showCount(valueLength, maxLength);
+  } else if (showCount) {
+    count = _react.default.createElement("div", {
+      className: `${classPrefix}-count`
+    }, maxLength === undefined ? valueLength : valueLength + '/' + maxLength);
+  }
+
+  return (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
+    className: classPrefix
+  }, _react.default.createElement("textarea", {
+    ref: nativeTextAreaRef,
+    className: `${classPrefix}-element`,
+    rows: props.rows,
+    value: value,
+    placeholder: props.placeholder,
+    onChange: e => {
+      let v = e.target.value;
+
+      if (maxLength && !compositingRef.current) {
+        v = [...v].slice(0, maxLength).join('');
+      }
+
+      setValue(v);
+    },
+    id: props.id,
+    onCompositionStart: e => {
+      var _a;
+
+      compositingRef.current = true;
+      (_a = props.onCompositionStart) === null || _a === void 0 ? void 0 : _a.call(props, e);
+    },
+    onCompositionEnd: e => {
+      var _a;
+
+      compositingRef.current = false;
+
+      if (maxLength) {
+        const v = e.target.value;
+        setValue([...v].slice(0, maxLength).join(''));
+      }
+
+      (_a = props.onCompositionEnd) === null || _a === void 0 ? void 0 : _a.call(props, e);
+    },
+    autoComplete: props.autoComplete,
+    autoFocus: props.autoFocus,
+    disabled: props.disabled,
+    readOnly: props.readOnly,
+    name: props.name,
+    onFocus: props.onFocus,
+    onBlur: props.onBlur,
+    onClick: props.onClick
+  }), count));
+});
+exports.TextArea = TextArea;
+TextArea.defaultProps = defaultProps;

package/2x/cjs/components/toast/index.d.ts

@@ -0,0 +1,9 @@
+import './toast.less';
+import { clear, show, config } from './methods';
+export type { ToastShowProps, ToastHandler } from './methods';
+declare const Toast: {
+    show: typeof show;
+    clear: typeof clear;
+    config: typeof config;
+};
+export default Toast;

package/2x/cjs/components/toast/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("./toast.css");
+
+var _methods = require("./methods");
+
+const Toast = {
+  show: _methods.show,
+  clear: _methods.clear,
+  config: _methods.config
+};
+var _default = Toast;
+exports.default = _default;

package/2x/cjs/components/toast/methods.d.ts

@@ -0,0 +1,8 @@
+import { ToastProps } from './toast';
+export declare type ToastShowProps = Omit<ToastProps, 'visible'>;
+export declare type ToastHandler = {
+    close: () => void;
+};
+export declare function show(p: ToastShowProps | string): ToastHandler;
+export declare function clear(): void;
+export declare function config(val: Pick<ToastProps, 'duration' | 'position' | 'maskClickable'>): void;

package/2x/cjs/components/toast/methods.js

@@ -0,0 +1,77 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.clear = clear;
+exports.config = config;
+exports.show = show;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _toast = require("./toast");
+
+var _withDefaultProps = require("../../utils/with-default-props");
+
+var _renderImperatively = require("../../utils/render-imperatively");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+let currentHandler = null;
+let currentTimeout = null;
+const defaultProps = {
+  duration: 2000,
+  position: 'center',
+  maskClickable: true
+};
+
+const ToastInner = props => _react.default.createElement(_toast.InternalToast, Object.assign({}, props));
+
+function show(p) {
+  const props = (0, _withDefaultProps.mergeProps)(defaultProps, typeof p === 'string' ? {
+    content: p
+  } : p);
+
+  const element = _react.default.createElement(ToastInner, Object.assign({}, props, {
+    onClose: () => {
+      currentHandler = null;
+    }
+  }));
+
+  if (currentHandler) {
+    currentHandler.replace(element);
+  } else {
+    currentHandler = (0, _renderImperatively.renderImperatively)(element);
+  }
+
+  if (currentTimeout) {
+    window.clearTimeout(currentTimeout);
+  }
+
+  if (props.duration !== 0) {
+    currentTimeout = window.setTimeout(() => {
+      clear();
+    }, props.duration);
+  }
+
+  return currentHandler;
+}
+
+function clear() {
+  currentHandler === null || currentHandler === void 0 ? void 0 : currentHandler.close();
+  currentHandler = null;
+}
+
+function config(val) {
+  if (val.duration !== undefined) {
+    defaultProps.duration = val.duration;
+  }
+
+  if (val.position !== undefined) {
+    defaultProps.position = val.position;
+  }
+
+  if (val.maskClickable !== undefined) {
+    defaultProps.maskClickable = val.maskClickable;
+  }
+}

package/2x/cjs/components/toast/toast.css

@@ -0,0 +1,48 @@
+.adm-toast-mask .adm-toast-wrap {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.adm-toast-mask .adm-toast-main {
+  display: inline-block;
+  position: relative;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: auto;
+  min-width: 192px;
+  max-width: 400px;
+  max-height: 70%;
+  overflow: auto;
+  color: white;
+  word-break: break-all;
+  background-color: rgba(0, 0, 0, 0.7);
+  border-radius: 16px;
+  pointer-events: all;
+  font-size: var(--adm-font-size-7);
+  line-height: 1.5;
+  box-sizing: border-box;
+}
+
+.adm-toast-mask .adm-toast-main-text {
+  padding: 24px;
+}
+
+.adm-toast-mask .adm-toast-main-icon {
+  padding: 70px 80px;
+}
+
+.adm-toast-mask .adm-toast-main-icon .adm-toast-icon {
+  text-align: center;
+  margin-bottom: 16px;
+  font-size: 72px;
+  line-height: 1;
+}
+
+.adm-toast-loading {
+  --size: 96px;
+  margin: 0 auto 16px;
+}

package/2x/cjs/components/toast/toast.d.ts

@@ -0,0 +1,18 @@
+import React, { ReactNode } from 'react';
+import type { MaskProps } from '../mask';
+import { PropagationEvent } from '../../utils/with-stop-propagation';
+import { GetContainer } from '../../utils/render-to-container';
+export interface ToastProps {
+    afterClose?: () => void;
+    maskStyle?: MaskProps['style'];
+    maskClassName?: string;
+    maskClickable?: boolean;
+    content?: ReactNode;
+    icon?: 'success' | 'fail' | 'loading' | React.ReactNode;
+    duration?: number;
+    position?: 'top' | 'bottom' | 'center';
+    visible?: boolean;
+    getContainer?: GetContainer;
+    stopPropagation?: PropagationEvent[];
+}
+export declare const InternalToast: React.FC<ToastProps>;

package/2x/cjs/components/toast/toast.js

@@ -0,0 +1,102 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InternalToast = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _antdMobileIcons = require("antd-mobile-icons");
+
+var _mask = _interopRequireDefault(require("../mask"));
+
+var _withDefaultProps = require("../../utils/with-default-props");
+
+var _autoCenter = _interopRequireDefault(require("../auto-center"));
+
+var _spinLoading = _interopRequireDefault(require("../spin-loading"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const classPrefix = `adm-toast`;
+const defaultProps = {
+  maskClickable: true,
+  stopPropagation: ['click']
+};
+
+const InternalToast = p => {
+  const props = (0, _withDefaultProps.mergeProps)(defaultProps, p);
+  const {
+    maskClickable,
+    content,
+    icon,
+    position
+  } = props;
+  const iconElement = (0, _react.useMemo)(() => {
+    if (icon === null || icon === undefined) return null;
+
+    switch (icon) {
+      case 'success':
+        return _react.default.createElement(_antdMobileIcons.CheckOutline, {
+          className: `${classPrefix}-icon-success`
+        });
+
+      case 'fail':
+        return _react.default.createElement(_antdMobileIcons.CloseOutline, {
+          className: `${classPrefix}-icon-fail`
+        });
+
+      case 'loading':
+        return _react.default.createElement(_spinLoading.default, {
+          color: 'white',
+          className: `${classPrefix}-loading`
+        });
+
+      default:
+        return icon;
+    }
+  }, [icon]);
+  const top = (0, _react.useMemo)(() => {
+    switch (position) {
+      case 'top':
+        return '20%';
+
+      case 'bottom':
+        return '80%';
+
+      default:
+        return '50%';
+    }
+  }, [position]);
+  return _react.default.createElement(_mask.default, {
+    visible: props.visible,
+    destroyOnClose: true,
+    opacity: 0,
+    disableBodyScroll: !maskClickable,
+    getContainer: props.getContainer,
+    afterClose: props.afterClose,
+    style: Object.assign({
+      pointerEvents: maskClickable ? 'none' : 'auto'
+    }, props.maskStyle),
+    className: (0, _classnames.default)(`${classPrefix}-mask`, props.maskClassName),
+    stopPropagation: props.stopPropagation
+  }, _react.default.createElement("div", {
+    className: (0, _classnames.default)(`${classPrefix}-wrap`)
+  }, _react.default.createElement("div", {
+    style: {
+      top
+    },
+    className: (0, _classnames.default)(`${classPrefix}-main`, icon ? `${classPrefix}-main-icon` : `${classPrefix}-main-text`)
+  }, iconElement && _react.default.createElement("div", {
+    className: `${classPrefix}-icon`
+  }, iconElement), _react.default.createElement(_autoCenter.default, null, content))));
+};
+
+exports.InternalToast = InternalToast;

package/2x/cjs/components/toast/toast.patch.css

@@ -0,0 +1,13 @@
+.adm-toast-mask .adm-toast-main {
+  font-size: 30px;
+}
+
+.adm-toast-loading.adm-toast-loading {
+  width: 96px;
+  height: 96px;
+  margin: 0 auto 16px;
+}
+
+.adm-toast-loading.adm-toast-loading .adm-spin-loading-fill {
+  stroke: #ffffff;
+}

package/2x/cjs/components/tree-select/index.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import './tree-select.less';
+export type { TreeSelectProps, TreeSelectOption } from './tree-select';
+export type { MultipleProps } from './multiple';
+declare const _default: import("react").FC<import("./tree-select").TreeSelectProps> & {
+    Multiple: import("react").FC<import("./multiple").MultipleProps>;
+};
+export default _default;

package/2x/cjs/components/tree-select/index.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("./tree-select.css");
+
+var _treeSelect2 = require("./tree-select");
+
+var _attachPropertiesToComponent = require("../../utils/attach-properties-to-component");
+
+var _multiple = require("./multiple");
+
+var _default = (0, _attachPropertiesToComponent.attachPropertiesToComponent)(_treeSelect2.TreeSelect, {
+  Multiple: _multiple.Multiple
+});
+
+exports.default = _default;