amis 1.4.2-beta.11 → 1.4.2-beta.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/Schema.d.ts +4 -3
- package/lib/Schema.js.map +1 -1
- package/lib/components/AssociatedSelection.js +2 -2
- package/lib/components/AssociatedSelection.js.map +2 -2
- package/lib/components/Checkbox.d.ts +20 -20
- package/lib/components/Collapse.d.ts +51 -23
- package/lib/components/Collapse.js +69 -11
- package/lib/components/Collapse.js.map +2 -2
- package/lib/components/CollapseGroup.d.ts +88 -0
- package/lib/components/CollapseGroup.js +81 -0
- package/lib/components/CollapseGroup.js.map +13 -0
- package/lib/components/Editor.d.ts +84 -84
- package/lib/components/GridNav.d.ts +52 -0
- package/lib/components/GridNav.js +123 -0
- package/lib/components/GridNav.js.map +13 -0
- package/lib/components/InputBox.d.ts +22 -21
- package/lib/components/InputBox.js +10 -2
- package/lib/components/InputBox.js.map +2 -2
- package/lib/components/ListGroup.d.ts +21 -21
- package/lib/components/PickerColumn.js +3 -3
- package/lib/components/PickerColumn.js.map +2 -2
- package/lib/components/ResultBox.d.ts +84 -84
- package/lib/components/ResultBox.js +10 -2
- package/lib/components/ResultBox.js.map +2 -2
- package/lib/components/Select.js +1 -1
- package/lib/components/Select.js.map +2 -2
- package/lib/components/Selection.js +1 -1
- package/lib/components/Selection.js.map +2 -2
- package/lib/components/Tabs.d.ts +20 -20
- package/lib/components/TabsTransfer.d.ts +84 -84
- package/lib/components/Toast.d.ts +86 -85
- package/lib/components/Toast.js +6 -3
- package/lib/components/Toast.js.map +2 -2
- package/lib/components/Transfer.d.ts +84 -84
- package/lib/components/TransferDropDown.d.ts +85 -84
- package/lib/components/TransferDropDown.js +2 -2
- package/lib/components/TransferDropDown.js.map +2 -2
- package/lib/components/TransferPicker.d.ts +4 -0
- package/lib/components/TransferPicker.js +2 -2
- package/lib/components/TransferPicker.js.map +2 -2
- package/lib/components/Tree.d.ts +115 -84
- package/lib/components/Tree.js +183 -30
- package/lib/components/Tree.js.map +2 -2
- package/lib/components/icons.js +2 -0
- package/lib/components/icons.js.map +2 -2
- package/lib/envOverwrite.d.ts +1 -1
- package/lib/envOverwrite.js +24 -9
- package/lib/envOverwrite.js.map +2 -2
- package/lib/factory.d.ts +11 -1
- package/lib/factory.js +31 -4
- package/lib/factory.js.map +2 -2
- package/lib/icons/download.js +7 -0
- package/lib/icons/drag-bar.js +10 -3
- package/lib/index.d.ts +2 -0
- package/lib/index.js +3 -1
- package/lib/index.js.map +2 -2
- package/lib/locale/en-US.js +1 -0
- package/lib/locale/en-US.js.map +2 -2
- package/lib/locale/zh-CN.js +1 -0
- package/lib/locale/zh-CN.js.map +2 -2
- package/lib/renderers/Collapse.d.ts +25 -20
- package/lib/renderers/Collapse.js +10 -73
- package/lib/renderers/Collapse.js.map +2 -2
- package/lib/renderers/CollapseGroup.d.ts +42 -0
- package/lib/renderers/CollapseGroup.js +33 -0
- package/lib/renderers/CollapseGroup.js.map +13 -0
- package/lib/renderers/Form/InputCity.d.ts +84 -84
- package/lib/renderers/Form/InputFile.d.ts +6 -0
- package/lib/renderers/Form/InputFile.js +18 -4
- package/lib/renderers/Form/InputFile.js.map +2 -2
- package/lib/renderers/Form/Item.js +2 -1
- package/lib/renderers/Form/Item.js.map +2 -2
- package/lib/renderers/Form/Select.d.ts +1 -0
- package/lib/renderers/Form/Select.js +16 -2
- package/lib/renderers/Form/Select.js.map +2 -2
- package/lib/renderers/Form/Transfer.js +15 -1
- package/lib/renderers/Form/Transfer.js.map +2 -2
- package/lib/renderers/Form/TransferPicker.d.ts +4 -0
- package/lib/renderers/Form/TransferPicker.js +17 -3
- package/lib/renderers/Form/TransferPicker.js.map +2 -2
- package/lib/renderers/Form/index.d.ts +5 -0
- package/lib/renderers/Form/index.js +4 -2
- package/lib/renderers/Form/index.js.map +2 -2
- package/lib/renderers/GridNav.d.ts +99 -0
- package/lib/renderers/GridNav.js +82 -0
- package/lib/renderers/GridNav.js.map +13 -0
- package/lib/renderers/Table/index.js +1 -1
- package/lib/renderers/Table/index.js.map +2 -2
- package/lib/store/formItem.js +44 -4
- package/lib/store/formItem.js.map +2 -2
- package/lib/store/table.d.ts +1 -0
- package/lib/store/table.js +35 -12
- package/lib/store/table.js.map +2 -2
- package/lib/themes/ang-ie11.css +272 -31
- package/lib/themes/ang.css +272 -31
- package/lib/themes/ang.css.map +1 -1
- package/lib/themes/antd-ie11.css +272 -31
- package/lib/themes/antd.css +272 -31
- package/lib/themes/antd.css.map +1 -1
- package/lib/themes/cxd-ie11.css +279 -38
- package/lib/themes/cxd.css +279 -38
- package/lib/themes/cxd.css.map +1 -1
- package/lib/themes/dark-ie11.css +272 -31
- package/lib/themes/dark.css +272 -31
- package/lib/themes/dark.css.map +1 -1
- package/lib/themes/default.css +279 -38
- package/lib/themes/default.css.map +1 -1
- package/lib/types.d.ts +1 -1
- package/lib/types.js.map +1 -1
- package/lib/utils/api.d.ts +1 -0
- package/lib/utils/api.js +77 -6
- package/lib/utils/api.js.map +2 -2
- package/lib/utils/helper.d.ts +6 -0
- package/lib/utils/helper.js +18 -1
- package/lib/utils/helper.js.map +2 -2
- package/package.json +1 -1
- package/schema.json +297 -55
- package/scss/base/_common.scss +3 -0
- package/scss/components/_anchor-nav.scss +1 -0
- package/scss/components/_collapse-group.scss +11 -0
- package/scss/components/_collapse.scss +33 -22
- package/scss/components/_grid-nav.scss +128 -0
- package/scss/components/_input-box.scss +1 -0
- package/scss/components/_nav.scss +1 -1
- package/scss/components/_picker-columns.scss +1 -0
- package/scss/components/_popover.scss +0 -4
- package/scss/components/_result-box.scss +1 -0
- package/scss/components/_spinner.scss +5 -4
- package/scss/components/_table.scss +6 -0
- package/scss/components/form/_combo.scss +4 -0
- package/scss/components/form/_file.scss +11 -0
- package/scss/components/form/_form.scss +48 -0
- package/scss/components/form/_tree.scss +42 -0
- package/scss/themes/_common.scss +3 -0
- package/scss/themes/_cxd-variables.scss +6 -7
- package/scss/themes/cxd.scss +1 -0
- package/sdk/ang-ie11.css +317 -32
- package/sdk/ang.css +312 -31
- package/sdk/antd-ie11.css +317 -32
- package/sdk/antd.css +312 -31
- package/sdk/charts.js +13 -13
- package/sdk/color-picker.js +65 -65
- package/sdk/cropperjs.js +2 -2
- package/sdk/cxd-ie11.css +323 -36
- package/sdk/cxd.css +319 -38
- package/sdk/dark-ie11.css +317 -32
- package/sdk/dark.css +312 -31
- package/sdk/exceljs.js +1 -1
- package/sdk/iconfont.svg +2513 -0
- package/sdk/iconfont.ttf +0 -0
- package/sdk/iconfont.woff +0 -0
- package/sdk/markdown.js +69 -69
- package/sdk/papaparse.js +1 -1
- package/sdk/renderers/Form/CityDB.js +1 -1
- package/sdk/rest.js +18 -18
- package/sdk/rich-text.js +62 -62
- package/sdk/sdk-ie11.css +323 -36
- package/sdk/sdk.css +319 -38
- package/sdk/sdk.js +1247 -1211
- package/sdk/thirds/hls.js/hls.js +1 -1
- package/sdk/thirds/mpegts.js/mpegts.js +1 -1
- package/sdk/tinymce.js +57 -57
- package/src/Schema.ts +5 -1
- package/src/components/AssociatedSelection.tsx +3 -1
- package/src/components/Collapse.tsx +144 -20
- package/src/components/CollapseGroup.tsx +130 -0
- package/src/components/GridNav.tsx +233 -0
- package/src/components/InputBox.tsx +10 -9
- package/src/components/PickerColumn.tsx +1 -1
- package/src/components/ResultBox.tsx +9 -9
- package/src/components/Select.tsx +1 -1
- package/src/components/Selection.tsx +1 -1
- package/src/components/Toast.tsx +23 -16
- package/src/components/TransferDropDown.tsx +4 -1
- package/src/components/TransferPicker.tsx +7 -0
- package/src/components/Tree.tsx +194 -8
- package/src/components/icons.tsx +2 -0
- package/src/envOverwrite.ts +20 -7
- package/src/factory.tsx +52 -6
- package/src/icons/download.svg +4 -0
- package/src/icons/drag-bar.svg +12 -6
- package/src/index.tsx +2 -0
- package/src/locale/en-US.ts +1 -0
- package/src/locale/zh-CN.ts +1 -0
- package/src/renderers/Collapse.tsx +70 -117
- package/src/renderers/CollapseGroup.tsx +80 -0
- package/src/renderers/Form/InputFile.tsx +36 -4
- package/src/renderers/Form/Item.tsx +2 -1
- package/src/renderers/Form/Select.tsx +22 -4
- package/src/renderers/Form/Transfer.tsx +16 -2
- package/src/renderers/Form/TransferPicker.tsx +25 -3
- package/src/renderers/Form/index.tsx +14 -1
- package/src/renderers/GridNav.tsx +204 -0
- package/src/renderers/Table/index.tsx +1 -2
- package/src/store/formItem.ts +94 -2
- package/src/store/table.ts +55 -14
- package/src/types.ts +1 -1
- package/src/utils/api.ts +93 -6
- package/src/utils/helper.ts +19 -0
- package/tsconfig-for-declaration.json +1 -1
|
@@ -14,7 +14,7 @@ var helper_1 = require("../utils/helper");
|
|
|
14
14
|
var theme_1 = require("../theme");
|
|
15
15
|
var locale_1 = require("../locale");
|
|
16
16
|
var use_touch_1 = (0, tslib_1.__importDefault)(require("../hooks/use-touch"));
|
|
17
|
-
var
|
|
17
|
+
var Button_1 = (0, tslib_1.__importDefault)(require("./Button"));
|
|
18
18
|
var DEFAULT_DURATION = 200;
|
|
19
19
|
var MOMENTUM_LIMIT_TIME = 300;
|
|
20
20
|
var MOMENTUM_LIMIT_DISTANCE = 15;
|
|
@@ -260,8 +260,8 @@ var PickerColumn = (0, react_1.forwardRef)(function (props, ref) {
|
|
|
260
260
|
};
|
|
261
261
|
return (react_1.default.createElement("div", { className: cx(mobileClassName, 'PickerColumns', 'PickerColumns-popOver') },
|
|
262
262
|
react_1.default.createElement("div", { className: cx('PickerColumns-toolbar') },
|
|
263
|
-
react_1.default.createElement(
|
|
264
|
-
react_1.default.createElement(
|
|
263
|
+
react_1.default.createElement(Button_1.default, { level: "default", onClick: onClose }, __('cancel')),
|
|
264
|
+
react_1.default.createElement(Button_1.default, { level: "primary", onClick: onConfirm }, __('confirm'))),
|
|
265
265
|
react_1.default.createElement("div", { className: cx('PickerColumns-columns'), style: columnsStyle },
|
|
266
266
|
react_1.default.createElement("div", { ref: root, className: props.classnames(props.className), onTouchStart: onTouchStart, onTouchMove: onTouchMove, onTouchEnd: onTouchEnd, onTouchCancel: onTouchEnd },
|
|
267
267
|
react_1.default.createElement("ul", { ref: wrapper, style: wrapperStyle, className: props.classnames('PickerColumns-columnWrapper'), onTransitionEnd: stopMomentum }, renderOptions())),
|
|
@@ -6,8 +6,8 @@
|
|
|
6
6
|
"/src/components/PickerColumn.tsx"
|
|
7
7
|
],
|
|
8
8
|
"names": [],
|
|
9
|
-
"mappings": ";;;AAAA;;;GAGG;AACH,0DAQe;AACf,0EAAuC;AACvC,4EAAyC;AACzC,iDAA8C;AAE9C,kCAAsD;AACtD,0CAAsC;AACtC,kCAA+C;AAC/C,oCAAkD;AAClD,8EAA0C;AAC1C,
|
|
9
|
+
"mappings": "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",
|
|
10
10
|
"sourcesContent": [
|
|
11
|
-
"/**\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"
|
|
11
|
+
"/**\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 './Button';\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"
|
|
12
12
|
]
|
|
13
13
|
}
|