amis 1.4.2-beta.1 → 1.4.2-beta.11

package/lib/components/PickerColumn.js

@@ -0,0 +1,279 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+/**
+ * @file Picker
+ * @description 移动端选择器
+ */
+var react_1 = tslib_1.__importStar(require("react"));
+var isObject_1 = (0, tslib_1.__importDefault)(require("lodash/isObject"));
+var cloneDeep_1 = (0, tslib_1.__importDefault)(require("lodash/cloneDeep"));
+var uncontrollable_1 = require("uncontrollable");
+var hooks_1 = require("../hooks");
+var helper_1 = require("../utils/helper");
+var theme_1 = require("../theme");
+var locale_1 = require("../locale");
+var use_touch_1 = (0, tslib_1.__importDefault)(require("../hooks/use-touch"));
+var _1 = require(".");
+var DEFAULT_DURATION = 200;
+var MOMENTUM_LIMIT_TIME = 300;
+var MOMENTUM_LIMIT_DISTANCE = 15;
+function getElementTranslateY(element) {
+    if (!element) {
+        return 0;
+    }
+    var style = window.getComputedStyle(element);
+    var transform = style.transform || style.webkitTransform;
+    // 格式如：matrix( scaleX(), skewY(), skewX(), scaleY(), translateX(), translateY() );
+    var translateY = transform.slice(7, transform.length - 1).split(', ')[5];
+    return Number(translateY);
+}
+function isOptionDisabled(option) {
+    return (0, isObject_1.default)(option) && option.disabled;
+}
+var PickerColumn = (0, react_1.forwardRef)(function (props, ref) {
+    var onClose = props.onClose, onConfirm = props.onConfirm, mobileClassName = props.mobileClassName, _a = props.visibleItemCount, visibleItemCount = _a === void 0 ? 5 : _a, value = props.value, _b = props.swipeDuration, swipeDuration = _b === void 0 ? 1000 : _b, _c = props.labelField, labelField = _c === void 0 ? 'value' : _c, __ = props.translate, _d = props.options, options = _d === void 0 ? [] : _d, cx = props.classnames;
+    var itemHeight = 24;
+    var defaultIndex = options.findIndex(function (item) { return item === value; });
+    var root = (0, react_1.useRef)(null);
+    var menuItemRef = (0, react_1.useRef)(null);
+    var wrapper = (0, react_1.useRef)(null);
+    var moving = (0, react_1.useRef)(false);
+    var startOffset = (0, react_1.useRef)(0);
+    var transitionEndTrigger = (0, react_1.useRef)(null);
+    var touchStartTime = (0, react_1.useRef)(0);
+    var momentumOffset = (0, react_1.useRef)(0);
+    if (menuItemRef.current) {
+        //@ts-ignore
+        itemHeight = menuItemRef.current.getBoundingClientRect().height;
+    }
+    var _e = (0, hooks_1.useSetState)({
+        index: defaultIndex,
+        offset: 0,
+        duration: 0,
+        options: (0, cloneDeep_1.default)(options)
+    }), state = _e[0], updateState = _e[1];
+    var touch = (0, use_touch_1.default)();
+    var count = state.options.length;
+    var baseOffset = (0, react_1.useMemo)(function () {
+        // 默认转入第一个选项的位置
+        return (itemHeight * (+visibleItemCount - 1)) / 2;
+    }, [itemHeight, visibleItemCount]);
+    var adjustIndex = function (index) {
+        index = (0, helper_1.range)(index, 0, count);
+        if (!state.options) {
+            return;
+        }
+        for (var i = index; i < count; i += 1) {
+            if (!isOptionDisabled(state.options[i]))
+                return i;
+        }
+        for (var i = index - 1; i >= 0; i -= 1) {
+            if (!isOptionDisabled(state.options[i]))
+                return i;
+        }
+        return null;
+    };
+    /**
+     *
+     * @param index 索引
+     * @param emitChange 是否派发变动消息
+     * @param confirm 是否为确认类型，为真时触发value改变
+     */
+    var setIndex = function (index, emitChange, confirm) {
+        index = adjustIndex(index) || 0;
+        var offset = -index * itemHeight;
+        var trigger = function () {
+            updateState({ index: index });
+            if (emitChange && props.onChange) {
+                setTimeout(function () {
+                    var _a;
+                    (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, options[index], index, confirm);
+                }, 0);
+            }
+        };
+        // trigger the change event after transitionend when moving
+        if (moving.current && offset !== state.offset) {
+            //@ts-ignore
+            transitionEndTrigger.current = trigger;
+        }
+        else {
+            trigger();
+        }
+        updateState({ offset: offset });
+    };
+    var setOptions = function (options) {
+        if (JSON.stringify(options) !== JSON.stringify(state.options)) {
+            updateState({ options: options });
+            setIndex(defaultIndex, true);
+        }
+    };
+    var onClickItem = function (index) {
+        if (moving.current || props.readonly) {
+            return;
+        }
+        transitionEndTrigger.current = null;
+        updateState({ duration: DEFAULT_DURATION });
+        setIndex(index, true, true);
+    };
+    var getOptionText = function (option) {
+        if ((0, isObject_1.default)(option) && props.labelField in option) {
+            //@ts-ignore
+            return option[labelField];
+        }
+        return option;
+    };
+    var getIndexByOffset = function (offset) {
+        return (0, helper_1.range)(Math.round(-offset / itemHeight), 0, count - 1);
+    };
+    var momentum = function (distance, duration) {
+        var speed = Math.abs(distance / duration);
+        distance = state.offset + (speed / 0.003) * (distance < 0 ? -1 : 1);
+        var index = getIndexByOffset(distance);
+        updateState({ duration: +swipeDuration });
+        setIndex(index, true);
+    };
+    var stopMomentum = function () {
+        moving.current = false;
+        updateState({ duration: 0 });
+        if (transitionEndTrigger.current) {
+            //@ts-ignore
+            transitionEndTrigger.current();
+            transitionEndTrigger.current = null;
+        }
+    };
+    var onTouchStart = function (event) {
+        if (props.readonly) {
+            return;
+        }
+        touch.start(event);
+        var offset = state.offset;
+        if (moving.current) {
+            var translateY = getElementTranslateY(wrapper.current);
+            offset = Math.min(0, translateY - baseOffset);
+            startOffset.current = offset;
+        }
+        else {
+            startOffset.current = offset;
+        }
+        updateState({ duration: 0, offset: offset });
+        touchStartTime.current = Date.now();
+        momentumOffset.current = startOffset.current;
+        transitionEndTrigger.current = null;
+    };
+    var onTouchMove = function (event) {
+        if (props.readonly) {
+            return;
+        }
+        touch.move(event);
+        if (touch.isVertical()) {
+            moving.current = true;
+        }
+        var offset = (0, helper_1.range)(startOffset.current + touch.deltaY, -(count * itemHeight), itemHeight);
+        updateState({
+            offset: offset
+        });
+        var now = Date.now();
+        if (now - touchStartTime.current > MOMENTUM_LIMIT_TIME) {
+            touchStartTime.current = now;
+            momentumOffset.current = offset;
+        }
+    };
+    var onTouchEnd = function () {
+        if (props.readonly) {
+            return;
+        }
+        var distance = state.offset - momentumOffset.current;
+        var duration = Date.now() - touchStartTime.current;
+        var allowMomentum = duration < MOMENTUM_LIMIT_TIME &&
+            Math.abs(distance) > MOMENTUM_LIMIT_DISTANCE;
+        if (allowMomentum) {
+            momentum(distance, duration);
+            return;
+        }
+        var index = getIndexByOffset(state.offset);
+        updateState({ duration: DEFAULT_DURATION });
+        setIndex(index, true);
+        // compatible with desktop scenario
+        // use setTimeout to skip the click event triggered after touchstart
+        setTimeout(function () {
+            moving.current = false;
+        }, 0);
+    };
+    var renderOptions = function () {
+        return state.options.map(function (option, index) {
+            var text = getOptionText(option);
+            var disabled = isOptionDisabled(option);
+            var data = {
+                role: 'button',
+                key: index,
+                tabIndex: disabled ? -1 : 0,
+                className: props.classnames("PickerColumns-columnItem", {
+                    'is-disabled': disabled,
+                    'is-selected': index === state.index
+                }),
+                onClick: function () {
+                    onClickItem(index);
+                }
+            };
+            var childData = {
+                className: 'text-ellipsis',
+                children: text
+            };
+            return (react_1.default.createElement("li", (0, tslib_1.__assign)({}, data, { ref: menuItemRef }), props.optionRender ? (props.optionRender(option)) : (react_1.default.createElement("div", (0, tslib_1.__assign)({}, childData)))));
+        });
+    };
+    var setValue = function (value) {
+        var options = state.options;
+        for (var i = 0; i < options.length; i += 1) {
+            if (getOptionText(options[i]) === value) {
+                return setIndex(i);
+            }
+        }
+        return null;
+    };
+    var getValue = (0, react_1.useCallback)(function () { return state.options[state.index]; }, [state.index, state.options]);
+    (0, react_1.useEffect)(function () {
+        setIndex(defaultIndex, true);
+    }, [defaultIndex]);
+    (0, hooks_1.useUpdateEffect)(function () {
+        setOptions((0, cloneDeep_1.default)(options));
+    }, [options]);
+    (0, react_1.useImperativeHandle)(ref, function () { return ({
+        state: state,
+        setIndex: setIndex,
+        getValue: getValue,
+        setValue: setValue,
+        setOptions: setOptions,
+        stopMomentum: stopMomentum
+    }); });
+    var wrapperStyle = {
+        transform: "translate3d(0, " + (state.offset + baseOffset) + "px, 0)",
+        transitionDuration: state.duration + "ms",
+        transitionProperty: state.duration ? 'all' : 'none'
+    };
+    var wrapHeight = itemHeight * +visibleItemCount;
+    var frameStyle = { height: itemHeight + "px" };
+    var columnsStyle = { height: wrapHeight + "px" };
+    var maskStyle = {
+        backgroundSize: "100% " + (wrapHeight - itemHeight) / 2 + "px"
+    };
+    return (react_1.default.createElement("div", { className: cx(mobileClassName, 'PickerColumns', 'PickerColumns-popOver') },
+        react_1.default.createElement("div", { className: cx('PickerColumns-toolbar') },
+            react_1.default.createElement(_1.Button, { level: "default", onClick: onClose }, __('cancel')),
+            react_1.default.createElement(_1.Button, { level: "primary", onClick: onConfirm }, __('confirm'))),
+        react_1.default.createElement("div", { className: cx('PickerColumns-columns'), style: columnsStyle },
+            react_1.default.createElement("div", { ref: root, className: props.classnames(props.className), onTouchStart: onTouchStart, onTouchMove: onTouchMove, onTouchEnd: onTouchEnd, onTouchCancel: onTouchEnd },
+                react_1.default.createElement("ul", { ref: wrapper, style: wrapperStyle, className: props.classnames('PickerColumns-columnWrapper'), onTransitionEnd: stopMomentum }, renderOptions())),
+            react_1.default.createElement("div", { className: cx('PickerColumns-mask'), style: maskStyle }),
+            react_1.default.createElement("div", { className: cx('PickerColumns-frame'), style: frameStyle }))));
+});
+PickerColumn.defaultProps = {
+    options: [],
+    visibleItemCount: 5,
+    swipeDuration: 1000
+};
+exports.default = (0, theme_1.themeable)((0, locale_1.localeable)((0, uncontrollable_1.uncontrollable)(PickerColumn, {
+    value: 'onChange'
+})));
+//# sourceMappingURL=./components/PickerColumn.js.map

package/lib/components/PickerColumn.js.map

@@ -0,0 +1,13 @@
+{
+    "version": 3,
+    "file": "PickerColumn.js",
+    "sourceRoot": "",
+    "sources": [
+        "/src/components/PickerColumn.tsx"
+    ],
+    "names": [],
+    "mappings": "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",
+    "sourcesContent": [
+        "/**\n * @file Picker\n * @description 移动端选择器\n */\nimport React, {\n  useEffect,\n  useMemo,\n  useRef,\n  useImperativeHandle,\n  useCallback,\n  forwardRef,\n  CSSProperties\n} from 'react';\nimport isObject from 'lodash/isObject';\nimport cloneDeep from 'lodash/cloneDeep';\nimport {uncontrollable} from 'uncontrollable';\n\nimport {useSetState, useUpdateEffect} from '../hooks';\nimport {range} from '../utils/helper';\nimport {themeable, ThemeProps} from '../theme';\nimport {localeable, LocaleProps} from '../locale';\nimport useTouch from '../hooks/use-touch';\nimport {Button} from '.';\n\nexport interface PickerColumnProps extends ThemeProps, LocaleProps {\n  mobileClassName?: string;\n  style?: CSSProperties;\n  index?: number;\n  labelField: string;\n  readonly?: boolean;\n  value: any;\n  swipeDuration?: number | string;\n  visibleItemCount?: number | string;\n  options?: PickerOption[];\n  children?: any;\n  optionRender?: (option: string | object | PickerOption) => React.ReactNode;\n  onChange?: (\n    value?: PickerOption | string,\n    index?: number,\n    confirm?: boolean\n  ) => void;\n  onClose?: () => void;\n  onConfirm?: () => void;\n}\n\nexport interface Column {\n  values?: string[];\n  className?: string;\n  children?: Column[];\n  disabled?: boolean;\n}\n\nexport type PickerOption = string | number | PickerObjectOption;\n\nexport type PickerObjectOption = {\n  value?: string | number;\n  text?: string | number;\n  disabled?: boolean;\n} & Record<string, {}>;\n\nconst DEFAULT_DURATION = 200;\nconst MOMENTUM_LIMIT_TIME = 300;\nconst MOMENTUM_LIMIT_DISTANCE = 15;\n\nfunction getElementTranslateY(element: HTMLElement | null) {\n  if (!element) {\n    return 0;\n  }\n  const style = window.getComputedStyle(element);\n  const transform = style.transform || style.webkitTransform;\n  // 格式如：matrix( scaleX(), skewY(), skewX(), scaleY(), translateX(), translateY() );\n  const translateY = transform.slice(7, transform.length - 1).split(', ')[5];\n\n  return Number(translateY);\n}\n\nfunction isOptionDisabled(option: PickerOption) {\n  return isObject(option) && option.disabled;\n}\n\nconst PickerColumn = forwardRef<{}, PickerColumnProps>((props, ref) => {\n  const {\n    onClose,\n    onConfirm,\n    mobileClassName,\n    visibleItemCount = 5,\n    value,\n    swipeDuration = 1000,\n    labelField = 'value',\n    translate: __,\n    options = [],\n    classnames: cx\n  } = props;\n  let itemHeight = 24;\n\n  const defaultIndex = options.findIndex(item => item === value);\n\n  const root = useRef(null);\n  const menuItemRef = useRef(null);\n  const wrapper = useRef(null);\n\n  const moving = useRef(false);\n  const startOffset = useRef(0);\n  const transitionEndTrigger = useRef(null);\n  const touchStartTime = useRef(0);\n  const momentumOffset = useRef(0);\n\n  if (menuItemRef.current) {\n    //@ts-ignore\n    itemHeight = menuItemRef.current.getBoundingClientRect().height;\n  }\n\n  const [state, updateState] = useSetState({\n    index: defaultIndex,\n    offset: 0,\n    duration: 0,\n    options: cloneDeep(options)\n  });\n\n  const touch = useTouch();\n\n  const count = state.options.length;\n\n  const baseOffset = useMemo(() => {\n    // 默认转入第一个选项的位置\n    return (itemHeight * (+visibleItemCount - 1)) / 2;\n  }, [itemHeight, visibleItemCount]);\n\n  const adjustIndex = (index: number) => {\n    index = range(index, 0, count);\n    if (!state.options) {\n      return;\n    }\n\n    for (let i = index; i < count; i += 1) {\n      if (!isOptionDisabled(state.options[i])) return i;\n    }\n    for (let i = index - 1; i >= 0; i -= 1) {\n      if (!isOptionDisabled(state.options[i])) return i;\n    }\n\n    return null;\n  };\n\n  /**\n   *\n   * @param index 索引\n   * @param emitChange 是否派发变动消息\n   * @param confirm 是否为确认类型，为真时触发value改变\n   */\n  const setIndex = (index: number, emitChange?: boolean, confirm?: boolean) => {\n    index = adjustIndex(index) || 0;\n\n    const offset = -index * itemHeight;\n    const trigger = () => {\n      updateState({index});\n\n      if (emitChange && props.onChange) {\n        setTimeout(() => {\n          props.onChange?.(options[index], index, confirm);\n        }, 0);\n      }\n    };\n\n    // trigger the change event after transitionend when moving\n    if (moving.current && offset !== state.offset) {\n      //@ts-ignore\n      transitionEndTrigger.current = trigger;\n    } else {\n      trigger();\n    }\n    updateState({offset});\n  };\n\n  const setOptions = (options: Array<PickerOption>) => {\n    if (JSON.stringify(options) !== JSON.stringify(state.options)) {\n      updateState({options});\n      setIndex(defaultIndex, true);\n    }\n  };\n\n  const onClickItem = (index: number) => {\n    if (moving.current || props.readonly) {\n      return;\n    }\n    transitionEndTrigger.current = null;\n    updateState({duration: DEFAULT_DURATION});\n    setIndex(index, true, true);\n  };\n\n  const getOptionText = (option: [] | PickerOption) => {\n    if (isObject(option) && props.labelField in option) {\n      //@ts-ignore\n      return option[labelField];\n    }\n    return option;\n  };\n\n  const getIndexByOffset = (offset: number) =>\n    range(Math.round(-offset / itemHeight), 0, count - 1);\n\n  const momentum = (distance: number, duration: number) => {\n    const speed = Math.abs(distance / duration);\n\n    distance = state.offset + (speed / 0.003) * (distance < 0 ? -1 : 1);\n\n    const index = getIndexByOffset(distance);\n    updateState({duration: +swipeDuration});\n    setIndex(index, true);\n  };\n\n  const stopMomentum = () => {\n    moving.current = false;\n    updateState({duration: 0});\n\n    if (transitionEndTrigger.current) {\n      //@ts-ignore\n      transitionEndTrigger.current();\n      transitionEndTrigger.current = null;\n    }\n  };\n\n  const onTouchStart = (event: any) => {\n    if (props.readonly) {\n      return;\n    }\n\n    touch.start(event);\n    let {offset} = state;\n\n    if (moving.current) {\n      const translateY = getElementTranslateY(wrapper.current);\n      offset = Math.min(0, translateY - baseOffset);\n      startOffset.current = offset;\n    } else {\n      startOffset.current = offset;\n    }\n\n    updateState({duration: 0, offset});\n    touchStartTime.current = Date.now();\n    momentumOffset.current = startOffset.current;\n    transitionEndTrigger.current = null;\n  };\n\n  const onTouchMove = (event: TouchEvent | React.TouchEvent) => {\n    if (props.readonly) {\n      return;\n    }\n\n    touch.move(event as TouchEvent);\n\n    if (touch.isVertical()) {\n      moving.current = true;\n    }\n\n    const offset = range(\n      startOffset.current + touch.deltaY,\n      -(count * itemHeight),\n      itemHeight\n    );\n\n    updateState({\n      offset\n    });\n\n    const now = Date.now();\n    if (now - touchStartTime.current > MOMENTUM_LIMIT_TIME) {\n      touchStartTime.current = now;\n      momentumOffset.current = offset;\n    }\n  };\n\n  const onTouchEnd = () => {\n    if (props.readonly) {\n      return;\n    }\n    const distance = state.offset - momentumOffset.current;\n    const duration = Date.now() - touchStartTime.current;\n\n    const allowMomentum =\n      duration < MOMENTUM_LIMIT_TIME &&\n      Math.abs(distance) > MOMENTUM_LIMIT_DISTANCE;\n\n    if (allowMomentum) {\n      momentum(distance, duration);\n      return;\n    }\n\n    const index = getIndexByOffset(state.offset);\n    updateState({duration: DEFAULT_DURATION});\n    setIndex(index, true);\n\n    // compatible with desktop scenario\n    // use setTimeout to skip the click event triggered after touchstart\n    setTimeout(() => {\n      moving.current = false;\n    }, 0);\n  };\n\n  const renderOptions = () => {\n    return state.options.map((option, index: number) => {\n      const text: string | PickerOption = getOptionText(option);\n      const disabled = isOptionDisabled(option);\n\n      const data = {\n        role: 'button',\n        key: index,\n        tabIndex: disabled ? -1 : 0,\n        className: props.classnames(`PickerColumns-columnItem`, {\n          'is-disabled': disabled,\n          'is-selected': index === state.index\n        }),\n        onClick: () => {\n          onClickItem(index);\n        }\n      };\n\n      const childData = {\n        className: 'text-ellipsis',\n        children: text\n      };\n\n      return (\n        <li {...data} ref={menuItemRef}>\n          {props.optionRender ? (\n            props.optionRender(option)\n          ) : (\n            <div {...childData} />\n          )}\n        </li>\n      );\n    });\n  };\n\n  const setValue = (value: string) => {\n    const {options} = state;\n    for (let i = 0; i < options.length; i += 1) {\n      if (getOptionText(options[i]) === value) {\n        return setIndex(i);\n      }\n    }\n    return null;\n  };\n\n  const getValue = useCallback<() => PickerOption>(\n    () => state.options[state.index],\n    [state.index, state.options]\n  );\n\n  useEffect(() => {\n    setIndex(defaultIndex, true);\n  }, [defaultIndex]);\n\n  useUpdateEffect(() => {\n    setOptions(cloneDeep(options));\n  }, [options]);\n\n  useImperativeHandle(ref, () => ({\n    state,\n    setIndex,\n    getValue,\n    setValue,\n    setOptions,\n    stopMomentum\n  }));\n\n  const wrapperStyle = {\n    transform: `translate3d(0, ${state.offset + baseOffset}px, 0)`,\n    transitionDuration: `${state.duration}ms`,\n    transitionProperty: state.duration ? 'all' : 'none'\n  };\n\n  const wrapHeight = itemHeight * +visibleItemCount;\n  const frameStyle = {height: `${itemHeight}px`};\n  const columnsStyle = {height: `${wrapHeight}px`};\n  const maskStyle = {\n    backgroundSize: `100% ${(wrapHeight - itemHeight) / 2}px`\n  };\n\n  return (\n    <div\n      className={cx(mobileClassName, 'PickerColumns', 'PickerColumns-popOver')}\n    >\n      <div className={cx('PickerColumns-toolbar')}>\n        <Button level=\"default\" onClick={onClose}>\n          {__('cancel')}\n        </Button>\n        <Button level=\"primary\" onClick={onConfirm}>\n          {__('confirm')}\n        </Button>\n      </div>\n      <div className={cx('PickerColumns-columns')} style={columnsStyle}>\n        <div\n          ref={root}\n          className={props.classnames(props.className)}\n          onTouchStart={onTouchStart}\n          onTouchMove={onTouchMove}\n          onTouchEnd={onTouchEnd}\n          onTouchCancel={onTouchEnd}\n        >\n          <ul\n            ref={wrapper}\n            style={wrapperStyle}\n            className={props.classnames('PickerColumns-columnWrapper')}\n            onTransitionEnd={stopMomentum}\n          >\n            {renderOptions()}\n          </ul>\n        </div>\n        <div className={cx('PickerColumns-mask')} style={maskStyle}></div>\n        <div className={cx('PickerColumns-frame')} style={frameStyle}></div>\n      </div>\n    </div>\n  );\n});\n\nPickerColumn.defaultProps = {\n  options: [],\n  visibleItemCount: 5,\n  swipeDuration: 1000\n};\n\nexport default themeable(\n  localeable(\n    uncontrollable(PickerColumn, {\n      value: 'onChange'\n    })\n  )\n);\n"
+    ]
+}