antd-mobile 5.16.1 → 5.17.0

package/es/components/tree-select/multiple.js

@@ -1,307 +0,0 @@
-import classNames from 'classnames';
-import React, { useEffect, useMemo } from 'react';
-import { withNativeProps } from '../../utils/native-props';
-import { getTreeDeep } from '../../utils/tree';
-import { mergeProps } from '../../utils/with-default-props';
-import Checkbox from '../checkbox';
-import { usePropsValue } from '../../utils/use-props-value';
-import { devWarning } from '../../utils/dev-log';
-const classPrefix = `adm-tree-select-multiple`;
-export const Multiple = p => {
-  const props = mergeProps({
-    options: [],
-    fieldNames: {},
-    allSelectText: [],
-    defaultExpandKeys: [],
-    defaultValue: []
-  }, p);
-  useEffect(() => {
-    devWarning('TreeSelect', 'TreeSelect.Multiple has been deprecated.');
-  }, []);
-  const labelName = props.fieldNames.label || 'label';
-  const valueName = props.fieldNames.value || 'value';
-  const childrenName = props.fieldNames.children || 'children'; // 打开的 keys
-
-  const [expandKeys, setExpandKeys] = usePropsValue({
-    value: props.expandKeys,
-    defaultValue: props.defaultExpandKeys
-  }); // 选中的 value（聚合后）
-
-  const [value, setValue] = usePropsValue({
-    value: props.value,
-    defaultValue: props.defaultValue
-  }); // 获取目标所有叶子节点 key 集合
-
-  const getLeafKeys = option => {
-    const keys = [];
-
-    const walker = op => {
-      var _a;
-
-      if (!op) {
-        return;
-      }
-
-      if ((_a = op[childrenName]) === null || _a === void 0 ? void 0 : _a.length) {
-        op[childrenName].forEach(i => walker(i));
-      } else {
-        keys.push(op[valueName]);
-      }
-    };
-
-    walker(option);
-    return keys;
-  };
-
-  const [deep, optionsMap, optionsParentMap] = useMemo(() => {
-    const deep = getTreeDeep(props.options, childrenName);
-    const optionsMap = new Map();
-    const optionsParentMap = new Map();
-
-    function traverse(current, children) {
-      children.forEach(item => {
-        optionsParentMap.set(item[valueName], current);
-        optionsMap.set(item[valueName], item);
-
-        if (item[childrenName]) {
-          traverse(item, item[childrenName]);
-        }
-      });
-    }
-
-    traverse(undefined, props.options);
-    return [deep, optionsMap, optionsParentMap];
-  }, [props.options]); // 将聚合的 value 拆分开，获得叶子节点的 value 集合
-
-  const allSelectedLeafKeys = useMemo(() => {
-    let leafKeys = [];
-    value.forEach(v => {
-      const option = optionsMap.get(v);
-      leafKeys = leafKeys.concat(getLeafKeys(option));
-    });
-    return leafKeys;
-  }, [value, optionsMap]); // 子级有被选中的节点集合
-
-  const dotMap = useMemo(() => {
-    const map = new Map(); // 遍历 allChildrenValues, 向上递归
-
-    const walker = key => {
-      const parentOption = optionsParentMap.get(key);
-
-      if (!parentOption) {
-        return;
-      }
-
-      map.set(parentOption[valueName], true);
-      walker(parentOption[valueName]);
-    };
-
-    allSelectedLeafKeys.forEach(key => {
-      map.set(key, true);
-      walker(key);
-    });
-    return map;
-  }, [optionsParentMap, value]);
-
-  const onChange = targetKeys => {
-    var _a;
-
-    let groupKeys = [...targetKeys];
-    let unusedKeys = [];
-
-    const walker = keys => {
-      keys.forEach(key => {
-        var _a;
-
-        if (unusedKeys.includes(key)) {
-          return;
-        }
-
-        const parent = optionsParentMap.get(key);
-
-        if (!parent) {
-          return;
-        }
-
-        const childrenKeys = ((_a = parent[childrenName]) === null || _a === void 0 ? void 0 : _a.map(i => i[valueName])) || [];
-
-        if (childrenKeys.every(i => groupKeys.includes(i))) {
-          groupKeys.push(parent[valueName]);
-          unusedKeys = unusedKeys.concat(childrenKeys);
-        }
-      });
-    }; // 遍历 deep 次 groupKeys，每次往上聚合一层
-
-
-    for (let i = 0; i < deep; i++) {
-      walker(groupKeys);
-    }
-
-    groupKeys = groupKeys.filter(i => !unusedKeys.includes(i)); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-
-    const groupOptions = groupKeys.map(i => optionsMap.get(i));
-    setValue(groupKeys);
-    (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, groupKeys, groupOptions);
-  };
-
-  const onItemSelect = option => {
-    var _a;
-
-    const parentNodes = [];
-    let current = option;
-
-    while (current) {
-      parentNodes.unshift(current);
-      const next = optionsParentMap.get(current[valueName]);
-      current = next;
-    }
-
-    const keys = parentNodes.map(i => i[valueName]);
-    setExpandKeys(keys);
-    (_a = props.onExpand) === null || _a === void 0 ? void 0 : _a.call(props, keys, parentNodes);
-  }; // 渲染全选节点
-
-
-  const renderSelectAllItem = (columnOptions, index) => {
-    var _a;
-
-    const text = (_a = props.selectAllText) === null || _a === void 0 ? void 0 : _a[index];
-
-    if (!text) {
-      return;
-    }
-
-    let currentLeafKeys = [];
-    columnOptions.forEach(option => {
-      currentLeafKeys = currentLeafKeys.concat(getLeafKeys(option));
-    });
-    const allSelected = currentLeafKeys.every(i => allSelectedLeafKeys.includes(i));
-    return React.createElement("div", {
-      onClick: () => {
-        if (allSelected) {
-          onChange(allSelectedLeafKeys.filter(i => !currentLeafKeys.includes(i)));
-        } else {
-          onChange(allSelectedLeafKeys.concat(currentLeafKeys));
-        }
-      },
-      className: `${classPrefix}-item`
-    }, text);
-  }; // 渲染
-
-
-  const renderSelectAllLeafItem = (columnOptions, index) => {
-    var _a;
-
-    const text = (_a = props.selectAllText) === null || _a === void 0 ? void 0 : _a[index];
-
-    if (!text) {
-      return;
-    }
-
-    const currentLeafKeys = columnOptions.map(i => i[valueName]);
-    const allSelected = currentLeafKeys.every(i => allSelectedLeafKeys.includes(i));
-    const halfSelected = allSelected ? false : currentLeafKeys.some(i => allSelectedLeafKeys.includes(i));
-    return React.createElement("div", {
-      onClick: () => {
-        if (allSelected) {
-          onChange(allSelectedLeafKeys.filter(i => !currentLeafKeys.includes(i)));
-        } else {
-          onChange(allSelectedLeafKeys.concat(currentLeafKeys));
-        }
-      },
-      className: classNames(`${classPrefix}-item`, `${classPrefix}-item-leaf`)
-    }, React.createElement(Checkbox, {
-      className: `${classPrefix}-item-checkbox`,
-      checked: allSelected,
-      indeterminate: halfSelected
-    }), text);
-  }; // 渲染节点
-
-
-  const renderItem = option => {
-    const isExpand = expandKeys.includes(option[valueName]);
-    return React.createElement("div", {
-      key: option[valueName],
-      onClick: () => {
-        if (!isExpand) {
-          onItemSelect(option);
-        }
-      },
-      className: classNames(`${classPrefix}-item`, {
-        [`${classPrefix}-item-expand`]: isExpand
-      })
-    }, option[labelName], !!dotMap.get(option[valueName]) && React.createElement("div", {
-      className: `${classPrefix}-dot`
-    }));
-  }; // 渲染叶子节点
-
-
-  const renderLeafItem = option => {
-    const isSelected = allSelectedLeafKeys.includes(option[valueName]);
-    return React.createElement("div", {
-      key: option[valueName],
-      onClick: () => {
-        if (isSelected) {
-          onChange(allSelectedLeafKeys.filter(val => val !== option[valueName]));
-        } else {
-          onChange([...allSelectedLeafKeys, option[valueName]]);
-        }
-      },
-      className: classNames(`${classPrefix}-item`, `${classPrefix}-item-leaf`)
-    }, React.createElement(Checkbox, {
-      className: `${classPrefix}-item-checkbox`,
-      checked: isSelected
-    }), option[labelName]);
-  };
-
-  const renderItems = (columnOptions = [], index) => {
-    if (columnOptions.length === 0) {
-      return;
-    }
-
-    const isLeaf = deep === index + 1;
-
-    if (isLeaf) {
-      return React.createElement(React.Fragment, null, renderSelectAllLeafItem(columnOptions, index), columnOptions.map(option => {
-        return renderLeafItem(option);
-      }));
-    }
-
-    return React.createElement(React.Fragment, null, renderSelectAllItem(columnOptions, index), columnOptions.map(option => {
-      return renderItem(option);
-    }));
-  };
-
-  const renderColumns = () => {
-    var _a;
-
-    const columns = [];
-
-    for (let i = 0; i < deep; i++) {
-      let width = `${100 / deep}%`; // 两列的第一列宽度为 33.33，两列的第二列为 66.67%
-
-      if (deep === 2 && i === 0) {
-        width = `33.33%`;
-      }
-
-      if (deep === 2 && i === 1) {
-        width = `66.67%`;
-      }
-
-      const column = React.createElement("div", {
-        key: i,
-        className: classNames(`${classPrefix}-column`),
-        style: {
-          width
-        }
-      }, renderItems(i === 0 ? props.options : (_a = optionsMap.get(expandKeys[i - 1])) === null || _a === void 0 ? void 0 : _a[childrenName], i));
-      columns.push(column);
-    }
-
-    return columns;
-  };
-
-  return withNativeProps(props, React.createElement("div", {
-    className: classPrefix
-  }, renderColumns()));
-};

package/es/components/tree-select/tree-select.css

@@ -1,53 +0,0 @@
-.adm-tree-select,
-.adm-tree-select-multiple {
-  display: flex;
-  height: 100%;
-  font-size: var(--adm-font-size-main);
-  background-color: var(--adm-color-white);
-}
-.adm-tree-select-column,
-.adm-tree-select-multiple-column {
-  overflow-y: auto;
-  transform: translateZ(0);
-  -webkit-transform: translateZ(0);
-}
-.adm-tree-select-column:first-child,
-.adm-tree-select-multiple-column:first-child {
-  background-color: var(--adm-color-box);
-}
-.adm-tree-select-column:nth-child(2),
-.adm-tree-select-multiple-column:nth-child(2) {
-  background-color: #fafafa;
-}
-.adm-tree-select-item,
-.adm-tree-select-multiple-item {
-  display: flex;
-  align-items: center;
-  min-height: 50px;
-  box-sizing: border-box;
-  padding: 6px 12px;
-  position: relative;
-}
-.adm-tree-select-item-active {
-  color: var(--adm-color-primary);
-  font-weight: bold;
-  background-color: white;
-}
-.adm-tree-select-multiple-item-expand {
-  color: var(--adm-color-primary);
-  font-weight: bold;
-  background-color: white;
-}
-.adm-tree-select-multiple-item-checkbox {
-  margin-right: 8px;
-}
-.adm-tree-select-multiple-dot {
-  position: absolute;
-  top: 50%;
-  margin-top: -3px;
-  right: 8px;
-  width: 6px;
-  height: 6px;
-  background: var(--adm-color-primary);
-  border-radius: 3px;
-}

package/es/components/tree-select/tree-select.d.ts

@@ -1,19 +0,0 @@
-import { FC } from 'react';
-import { NativeProps } from '../../utils/native-props';
-export interface TreeSelectOption {
-    [key: string]: any;
-}
-export declare type TreeSelectProps = {
-    options: TreeSelectOption[];
-    defaultValue?: string[];
-    value?: string[];
-    onChange?: (value: string[], extend: {
-        options: TreeSelectOption[];
-    }) => void;
-    fieldNames?: {
-        label: string;
-        value: string;
-        children: string;
-    };
-} & NativeProps;
-export declare const TreeSelect: FC<TreeSelectProps>;

package/es/components/tree-select/tree-select.js

@@ -1,111 +0,0 @@
-import classNames from 'classnames';
-import React, { useMemo } from 'react';
-import { withNativeProps } from '../../utils/native-props';
-import { getTreeDeep } from '../../utils/tree';
-import { mergeProps } from '../../utils/with-default-props';
-import { usePropsValue } from '../../utils/use-props-value';
-const classPrefix = `adm-tree-select`;
-const defaultProps = {
-  options: [],
-  fieldNames: {},
-  defaultValue: []
-};
-export const TreeSelect = p => {
-  const props = mergeProps(defaultProps, p);
-  const labelName = props.fieldNames.label || 'label';
-  const valueName = props.fieldNames.value || 'value';
-  const childrenName = props.fieldNames.children || 'children';
-  const [value, setValue] = usePropsValue({
-    value: props.value,
-    defaultValue: props.defaultValue
-  });
-  const [deep, optionsMap, optionsParentMap] = useMemo(() => {
-    const deep = getTreeDeep(props.options, childrenName);
-    const optionsMap = new Map();
-    const optionsParentMap = new Map();
-
-    function traverse(current, children) {
-      children.forEach(item => {
-        optionsParentMap.set(item[valueName], current);
-        optionsMap.set(item[valueName], item);
-
-        if (item[childrenName]) {
-          traverse(item, item[childrenName]);
-        }
-      });
-    }
-
-    traverse(undefined, props.options);
-    return [deep, optionsMap, optionsParentMap];
-  }, [props.options]);
-
-  const onItemSelect = node => {
-    var _a; // 找到父级节点
-
-
-    const parentNodes = [];
-    let current = node;
-
-    while (current) {
-      parentNodes.push(current);
-      const next = optionsParentMap.get(current[valueName]);
-      current = next;
-    }
-
-    const values = parentNodes.reverse().map(i => i[valueName]);
-    setValue(values);
-    (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, values, {
-      options: parentNodes
-    });
-  };
-
-  const renderItems = (columnOptions = [], index) => {
-    return columnOptions.map(item => {
-      const isActive = item[valueName] === value[index];
-      return React.createElement("div", {
-        key: item[valueName],
-        className: classNames(`${classPrefix}-item`, {
-          [`${classPrefix}-item-active`]: isActive
-        }),
-        onClick: () => {
-          if (!isActive) {
-            onItemSelect(item);
-          }
-        }
-      }, item[labelName]);
-    });
-  };
-
-  const renderColumns = () => {
-    var _a;
-
-    const columns = [];
-
-    for (let i = 0; i < deep; i++) {
-      let width = `${100 / deep}%`; // 两列的第一列宽度为 33.33，两列的第二列为 66.67%
-
-      if (deep === 2 && i === 0) {
-        width = `33.33%`;
-      }
-
-      if (deep === 2 && i === 1) {
-        width = `66.67%`;
-      }
-
-      const column = React.createElement("div", {
-        key: i,
-        className: classNames(`${classPrefix}-column`),
-        style: {
-          width
-        }
-      }, renderItems(i === 0 ? props.options : (_a = optionsMap.get(value[i - 1])) === null || _a === void 0 ? void 0 : _a[childrenName], i));
-      columns.push(column);
-    }
-
-    return columns;
-  };
-
-  return withNativeProps(props, React.createElement("div", {
-    className: classPrefix
-  }, renderColumns()));
-};

package/es/components/virtual-input/index.d.ts

@@ -1,4 +0,0 @@
-import './virtual-input.less';
-import { VirtualInput } from './virtual-input';
-export type { VirtualInputProps, VirtualInputRef } from './virtual-input';
-export default VirtualInput;

package/es/components/virtual-input/index.js

@@ -1,3 +0,0 @@
-import "./virtual-input.css";
-import { VirtualInput } from './virtual-input';
-export default VirtualInput;

package/es/components/virtual-input/virtual-input.css

@@ -1,98 +0,0 @@
-.adm-virtual-input {
-  --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;
-  --caret-width: var(--adm-virtual-input-caret-width, 2px);
-  --caret-color: var(--adm-virtual-input-caret-color, var(--adm-color-primary));
-  display: flex;
-  justify-content: flex-start;
-  align-items: center;
-  position: relative;
-  text-align: var(--text-align);
-  font-size: var(--font-size);
-  line-height: 1.5;
-  white-space: nowrap;
-  color: var(--color);
-}
-.adm-virtual-input > * {
-  vertical-align: top;
-}
-.adm-virtual-input-content {
-  flex: auto;
-  display: inline-block;
-  position: relative;
-  z-index: 1;
-  width: 100%;
-  max-width: 100%;
-  overflow-y: hidden;
-  overflow-x: scroll;
-  scrollbar-width: none;
-}
-.adm-virtual-input-content::-webkit-scrollbar {
-  display: none;
-}
-.adm-virtual-input-placeholder {
-  display: block;
-  position: absolute;
-  z-index: 0;
-  left: 0;
-  top: 0;
-  width: 100%;
-  overflow: hidden;
-  text-align: var(--text-align);
-  color: var(--placeholder-color);
-}
-.adm-virtual-input-caret-container {
-  display: inline-block;
-  width: var(--caret-width);
-  height: 1.3em;
-  vertical-align: top;
-  margin-right: 1px;
-}
-.adm-virtual-input-caret {
-  width: 100%;
-  height: 100%;
-  background-color: var(--caret-color);
-  position: relative;
-  top: 5%;
-}
-.adm-virtual-input:focus {
-  outline: none;
-}
-.adm-virtual-input:focus .adm-virtual-input-caret {
-  display: block;
-  animation-name: adm-caret-blink;
-  animation-duration: 1s;
-  animation-timing-function: linear;
-  animation-iteration-count: infinite;
-}
-.adm-virtual-input-disabled {
-  color: var(--disabled-color);
-}
-@keyframes adm-caret-blink {
-  from {
-    opacity: 1;
-  }
-  60% {
-    opacity: 1;
-  }
-  80% {
-    opacity: 0;
-  }
-  to {
-    opacity: 0;
-  }
-}
-.adm-virtual-input-clear {
-  flex: none;
-  margin-left: 8px;
-  color: var(--placeholder-color);
-  padding: 3px;
-  cursor: pointer;
-}
-.adm-virtual-input-clear .antd-mobile-icon {
-  display: block;
-  font-size: var(--adm-font-size-6);
-}

package/es/components/virtual-input/virtual-input.d.ts

@@ -1,28 +0,0 @@
-import React, { ReactElement } from 'react';
-import type { InputProps } from '../input';
-import { NativeProps } from '../../utils/native-props';
-import { NumberKeyboardProps } from '../number-keyboard';
-export declare type VirtualInputProps = {
-    onFocus?: () => void;
-    onBlur?: () => void;
-    onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
-    keyboard?: ReactElement<NumberKeyboardProps>;
-    clearable?: boolean;
-    onClear?: () => void;
-} & Pick<InputProps, 'value' | 'onChange' | 'placeholder' | 'disabled'> & NativeProps<'--font-size' | '--color' | '--placeholder-color' | '--disabled-color' | '--text-align' | '--caret-width' | '--caret-color'>;
-export declare type VirtualInputRef = {
-    focus: () => void;
-    blur: () => void;
-};
-export declare const VirtualInput: React.ForwardRefExoticComponent<{
-    onFocus?: (() => void) | undefined;
-    onBlur?: (() => void) | undefined;
-    onClick?: ((e: React.MouseEvent<HTMLDivElement>) => void) | undefined;
-    keyboard?: React.ReactElement<NumberKeyboardProps, string | React.JSXElementConstructor<any>> | undefined;
-    clearable?: boolean | undefined;
-    onClear?: (() => void) | undefined;
-} & Pick<InputProps, "value" | "onChange" | "disabled" | "placeholder"> & {
-    className?: string | undefined;
-    style?: (React.CSSProperties & Partial<Record<"--color" | "--font-size" | "--placeholder-color" | "--text-align" | "--disabled-color" | "--caret-width" | "--caret-color", string>>) | undefined;
-    tabIndex?: number | undefined;
-} & React.AriaAttributes & React.RefAttributes<VirtualInputRef>>;