amis 1.5.6 → 1.6.1-beta.0

package/lib/components/TransferDropDown.js

@@ -11,6 +11,7 @@ var ResultBox_1 = (0, tslib_1.__importDefault)(require("./ResultBox"));
 var icons_1 = require("./icons");
 var InputBox_1 = (0, tslib_1.__importDefault)(require("./InputBox"));
 var PopOverContainer_1 = (0, tslib_1.__importDefault)(require("./PopOverContainer"));
+var helper_1 = require("../utils/helper");
 var TransferDropDown = /** @class */ (function (_super) {
     (0, tslib_1.__extends)(TransferDropDown, _super);
     function TransferDropDown() {
@@ -18,11 +19,14 @@ var TransferDropDown = /** @class */ (function (_super) {
     }
     TransferDropDown.prototype.render = function () {
         var _this = this;
-        var _a = this.props, cx = _a.classnames, value = _a.value, __ = _a.translate, disabled = _a.disabled, className = _a.className, onChange = _a.onChange, onSearch = _a.onSearch, multiple = _a.multiple, borderMode = _a.borderMode;
+        var _a = this.props, cx = _a.classnames, value = _a.value, __ = _a.translate, disabled = _a.disabled, className = _a.className, onChange = _a.onChange, onSearch = _a.onSearch, multiple = _a.multiple, borderMode = _a.borderMode, useMobileUI = _a.useMobileUI;
         var _b = this.state, inputValue = _b.inputValue, searchResult = _b.searchResult;
-        return (react_1.default.createElement(PopOverContainer_1.default, { popOverClassName: cx('TransferDropDown-popover'), popOverRender: function (_a) {
+        var mobileUI = useMobileUI && (0, helper_1.isMobile)();
+        return (react_1.default.createElement(PopOverContainer_1.default, { useMobileUI: useMobileUI, popOverClassName: cx('TransferDropDown-popover'), popOverRender: function (_a) {
                 var onClose = _a.onClose;
-                return (react_1.default.createElement("div", { className: cx('TransferDropDown-content') },
+                return (react_1.default.createElement("div", { className: cx('TransferDropDown-content', {
+                        'is-mobile': mobileUI
+                    }) },
                     onSearch ? (react_1.default.createElement("div", { className: cx('Transfer-search') },
                         react_1.default.createElement(InputBox_1.default, { value: inputValue, onChange: _this.handleSearch, placeholder: __('Transfer.searchKeyword'), clearable: false, onKeyDown: _this.handleSearchKeyDown }, searchResult !== null ? (react_1.default.createElement("a", { onClick: _this.handleSeachCancel },
                             react_1.default.createElement(icons_1.Icon, { icon: "close", className: "icon" }))) : (react_1.default.createElement(icons_1.Icon, { icon: "search", className: "icon" }))))) : null,
@@ -41,13 +45,8 @@ var TransferDropDown = /** @class */ (function (_super) {
                                 }, multiple: multiple }))));
             } }, function (_a) {
             var onClick = _a.onClick, isOpened = _a.isOpened, ref = _a.ref;
-            return (react_1.default.createElement(ResultBox_1.default, { className: cx('TransferDropDown', className, isOpened ? 'is-active' : ''), borderMode: borderMode, allowInput: false, result: multiple
-                    ? value
-                    : (value === null || value === void 0 ? void 0 : value[0])
-                        ? _this.props.itemRender(value[0])
-                        : null, onResultChange: onChange, onResultClick: onClick, placeholder: __('Select.placeholder'), disabled: disabled, ref: ref },
-                react_1.default.createElement("span", { className: cx('TransferDropDown-icon') },
-                    react_1.default.createElement(icons_1.Icon, { icon: "caret", className: "icon" }))));
+            return (react_1.default.createElement(ResultBox_1.default, { className: cx('TransferDropDown', className, isOpened ? 'is-active' : ''), borderMode: borderMode, allowInput: false, result: multiple ? value : (value === null || value === void 0 ? void 0 : value[0]) ? value === null || value === void 0 ? void 0 : value[0] : null, onResultChange: onChange, onResultClick: onClick, placeholder: __('Select.placeholder'), disabled: disabled, ref: ref, useMobileUI: useMobileUI }, !mobileUI ? (react_1.default.createElement("span", { className: cx('TransferDropDown-icon') },
+                react_1.default.createElement(icons_1.Icon, { icon: "caret", className: "icon" }))) : (react_1.default.createElement(react_1.default.Fragment, null))));
         }));
     };
     return TransferDropDown;

package/lib/components/TransferDropDown.js.map

@@ -6,8 +6,8 @@
         "/src/components/TransferDropDown.tsx"
     ],
     "names": [],
-    "mappings": "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",
+    "mappings": "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",
     "sourcesContent": [
-        "import {localeable} from '../locale';\nimport {themeable} from '../theme';\nimport {Transfer, TransferProps} from './Transfer';\nimport {uncontrollable} from 'uncontrollable';\nimport React from 'react';\nimport ResultBox from './ResultBox';\nimport {Icon} from './icons';\nimport InputBox from './InputBox';\nimport PopOverContainer from './PopOverContainer';\n\nexport interface TransferDropDownProps extends TransferProps {\n  // 新的属性？\n  multiple?: boolean;\n  borderMode?: 'full' | 'half' | 'none';\n}\n\nexport class TransferDropDown extends Transfer<TransferDropDownProps> {\n  render() {\n    const {\n      classnames: cx,\n      value,\n      translate: __,\n      disabled,\n      className,\n      onChange,\n      onSearch,\n      multiple,\n      borderMode\n    } = this.props;\n    const {inputValue, searchResult} = this.state;\n\n    return (\n      <PopOverContainer\n        popOverClassName={cx('TransferDropDown-popover')}\n        popOverRender={({onClose}) => (\n          <div className={cx('TransferDropDown-content')}>\n            {onSearch ? (\n              <div className={cx('Transfer-search')}>\n                <InputBox\n                  value={inputValue}\n                  onChange={this.handleSearch}\n                  placeholder={__('Transfer.searchKeyword')}\n                  clearable={false}\n                  onKeyDown={this.handleSearchKeyDown}\n                >\n                  {searchResult !== null ? (\n                    <a onClick={this.handleSeachCancel}>\n                      <Icon icon=\"close\" className=\"icon\" />\n                    </a>\n                  ) : (\n                    <Icon icon=\"search\" className=\"icon\" />\n                  )}\n                </InputBox>\n              </div>\n            ) : null}\n            {searchResult !== null\n              ? this.renderSearchResult({\n                  ...this.props,\n                  value,\n                  onChange: multiple\n                    ? onChange\n                    : (value: any) => {\n                        onClose();\n                        onChange?.(value);\n                      },\n                  multiple\n                })\n              : this.renderOptions({\n                  ...this.props,\n                  value,\n                  onChange: multiple\n                    ? onChange\n                    : (value: any) => {\n                        onClose();\n                        onChange?.(value);\n                      },\n                  multiple\n                })}\n          </div>\n        )}\n      >\n        {({onClick, isOpened, ref}) => (\n          <ResultBox\n            className={cx(\n              'TransferDropDown',\n              className,\n              isOpened ? 'is-active' : ''\n            )}\n            borderMode={borderMode}\n            allowInput={false}\n            result={\n              multiple\n                ? value\n                : value?.[0]\n                ? this.props.itemRender(value[0])\n                : null\n            }\n            onResultChange={onChange}\n            onResultClick={onClick}\n            placeholder={__('Select.placeholder')}\n            disabled={disabled}\n            ref={ref}\n          >\n            <span className={cx('TransferDropDown-icon')}>\n              <Icon icon=\"caret\" className=\"icon\" />\n            </span>\n          </ResultBox>\n        )}\n      </PopOverContainer>\n    );\n  }\n}\n\nexport default themeable(\n  localeable(\n    uncontrollable(TransferDropDown, {\n      value: 'onChange'\n    })\n  )\n);\n"
+        "import {localeable} from '../locale';\nimport {themeable} from '../theme';\nimport {Transfer, TransferProps} from './Transfer';\nimport {uncontrollable} from 'uncontrollable';\nimport React from 'react';\nimport ResultBox from './ResultBox';\nimport {Icon} from './icons';\nimport InputBox from './InputBox';\nimport PopOverContainer from './PopOverContainer';\nimport {isMobile} from '../utils/helper';\n\nexport interface TransferDropDownProps extends TransferProps {\n  // 新的属性？\n  multiple?: boolean;\n  borderMode?: 'full' | 'half' | 'none';\n  useMobileUI?: boolean;\n}\n\nexport class TransferDropDown extends Transfer<TransferDropDownProps> {\n  render() {\n    const {\n      classnames: cx,\n      value,\n      translate: __,\n      disabled,\n      className,\n      onChange,\n      onSearch,\n      multiple,\n      borderMode,\n      useMobileUI\n    } = this.props;\n    const {inputValue, searchResult} = this.state;\n\n    const mobileUI = useMobileUI && isMobile();\n    return (\n      <PopOverContainer\n        useMobileUI={useMobileUI}\n        popOverClassName={cx('TransferDropDown-popover')}\n        popOverRender={({onClose}) => (\n          <div\n            className={cx('TransferDropDown-content', {\n              'is-mobile': mobileUI\n            })}\n          >\n            {onSearch ? (\n              <div className={cx('Transfer-search')}>\n                <InputBox\n                  value={inputValue}\n                  onChange={this.handleSearch}\n                  placeholder={__('Transfer.searchKeyword')}\n                  clearable={false}\n                  onKeyDown={this.handleSearchKeyDown}\n                >\n                  {searchResult !== null ? (\n                    <a onClick={this.handleSeachCancel}>\n                      <Icon icon=\"close\" className=\"icon\" />\n                    </a>\n                  ) : (\n                    <Icon icon=\"search\" className=\"icon\" />\n                  )}\n                </InputBox>\n              </div>\n            ) : null}\n            {searchResult !== null\n              ? this.renderSearchResult({\n                  ...this.props,\n                  value,\n                  onChange: multiple\n                    ? onChange\n                    : (value: any) => {\n                        onClose();\n                        onChange?.(value);\n                      },\n                  multiple\n                })\n              : this.renderOptions({\n                  ...this.props,\n                  value,\n                  onChange: multiple\n                    ? onChange\n                    : (value: any) => {\n                        onClose();\n                        onChange?.(value);\n                      },\n                  multiple\n                })}\n          </div>\n        )}\n      >\n        {({onClick, isOpened, ref}) => (\n          <ResultBox\n            className={cx(\n              'TransferDropDown',\n              className,\n              isOpened ? 'is-active' : ''\n            )}\n            borderMode={borderMode}\n            allowInput={false}\n            result={multiple ? value : value?.[0] ? value?.[0] : null}\n            onResultChange={onChange}\n            onResultClick={onClick}\n            placeholder={__('Select.placeholder')}\n            disabled={disabled}\n            ref={ref}\n            useMobileUI={useMobileUI}\n          >\n            {!mobileUI ? (\n              <span className={cx('TransferDropDown-icon')}>\n                <Icon icon=\"caret\" className=\"icon\" />\n              </span>\n            ) : (\n              <></>\n            )}\n          </ResultBox>\n        )}\n      </PopOverContainer>\n    );\n  }\n}\n\nexport default themeable(\n  localeable(\n    uncontrollable(TransferDropDown, {\n      value: 'onChange'\n    })\n  )\n);\n"
     ]
 }

package/lib/components/TransferPicker.d.ts

@@ -9,6 +9,7 @@ export interface TransferPickerProps extends Omit<TransferProps, 'itemRender'> {
     borderMode?: 'full' | 'half' | 'none';
 }
 export declare class TransferPicker extends React.Component<TransferPickerProps> {
+    optionModified: boolean;
     handleConfirm(value: any): void;
     render(): JSX.Element;
 }

package/lib/components/TransferPicker.js

@@ -14,17 +14,32 @@ var helper_1 = require("../utils/helper");
 var TransferPicker = /** @class */ (function (_super) {
     (0, tslib_1.__extends)(TransferPicker, _super);
     function TransferPicker() {
-        return _super !== null && _super.apply(this, arguments) || this;
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.optionModified = false;
+        return _this;
     }
     TransferPicker.prototype.handleConfirm = function (value) {
         var _a, _b;
-        (_b = (_a = this.props).onChange) === null || _b === void 0 ? void 0 : _b.call(_a, value);
+        (_b = (_a = this.props).onChange) === null || _b === void 0 ? void 0 : _b.call(_a, value, this.optionModified);
+        this.optionModified = false;
     };
     TransferPicker.prototype.render = function () {
+        var _this = this;
         var _a = this.props, cx = _a.classnames, value = _a.value, __ = _a.translate, disabled = _a.disabled, className = _a.className, onChange = _a.onChange, size = _a.size, borderMode = _a.borderMode, rest = (0, tslib_1.__rest)(_a, ["classnames", "value", "translate", "disabled", "className", "onChange", "size", "borderMode"]);
         return (react_1.default.createElement(PickerContainer_1.default, { title: __('Select.placeholder'), bodyRender: function (_a) {
-                var onClose = _a.onClose, value = _a.value, onChange = _a.onChange;
-                return react_1.default.createElement(Transfer_1.default, (0, tslib_1.__assign)({}, rest, { value: value, onChange: onChange }));
+                var onClose = _a.onClose, value = _a.value, onChange = _a.onChange, setState = _a.setState, states = (0, tslib_1.__rest)(_a, ["onClose", "value", "onChange", "setState"]);
+                return (react_1.default.createElement(Transfer_1.default, (0, tslib_1.__assign)({}, rest, states, { value: value, onChange: function (value, optionModified) {
+                        if (optionModified) {
+                            var options = (0, helper_1.mapTree)(rest.options, function (item) {
+                                return (value.find(function (a) { return a.value === item.value; }) || item);
+                            });
+                            _this.optionModified = true;
+                            setState({ options: options, value: value });
+                        }
+                        else {
+                            onChange(value);
+                        }
+                    } })));
             }, value: value, onConfirm: this.handleConfirm, size: size }, function (_a) {
             var onClick = _a.onClick, isOpened = _a.isOpened;
             return (react_1.default.createElement(ResultBox_1.default, { className: cx('TransferPicker', className, isOpened ? 'is-active' : ''), allowInput: false, result: value, onResultChange: onChange, onResultClick: onClick, placeholder: __('Select.placeholder'), disabled: disabled, borderMode: borderMode },

package/lib/components/TransferPicker.js.map

@@ -6,8 +6,8 @@
         "/src/components/TransferPicker.tsx"
     ],
     "names": [],
-    "mappings": ";;;;AAAA,oCAAqC;AACrC,kCAAmC;AACnC,qEAAmD;AACnD,iDAA8C;AAC9C,6DAA0B;AAC1B,uEAAoC;AACpC,iCAA6B;AAC7B,mFAAgD;AAChD,0CAAyC;AAYzC;IAAoC,+CAAoC;IAAxE;;IAoDA,CAAC;IAlDC,sCAAa,GAAb,UAAc,KAAU;;QACtB,MAAA,MAAA,IAAI,CAAC,KAAK,EAAC,QAAQ,mDAAG,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,+BAAM,GAAN;QACE,IAAM,KAUF,IAAI,CAAC,KAAK,EATA,EAAE,gBAAA,EACd,KAAK,WAAA,EACM,EAAE,eAAA,EACb,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,QAAQ,cAAA,EACR,IAAI,UAAA,EACJ,UAAU,gBAAA,EACP,IAAI,2BATH,+FAUL,CAAa,CAAC;QAEf,OAAO,CACL,8BAAC,yBAAe,IACd,KAAK,EAAE,EAAE,CAAC,oBAAoB,CAAC,EAC/B,UAAU,EAAE,UAAC,EAA0B;oBAAzB,OAAO,aAAA,EAAE,KAAK,WAAA,EAAE,QAAQ,cAAA;gBACpC,OAAO,8BAAC,kBAAQ,4BAAK,IAAI,IAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,IAAI,CAAC;YAClE,CAAC,EACD,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,IAAI,CAAC,aAAa,EAC7B,IAAI,EAAE,IAAI,IAET,UAAC,EAAmB;gBAAlB,OAAO,aAAA,EAAE,QAAQ,cAAA;YAAM,OAAA,CACxB,8BAAC,mBAAS,IACR,SAAS,EAAE,EAAE,CACX,gBAAgB,EAChB,SAAS,EACT,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAC5B,EACD,UAAU,EAAE,KAAK,EACjB,MAAM,EAAE,KAAK,EACb,cAAc,EAAE,QAAQ,EACxB,aAAa,EAAE,OAAO,EACtB,WAAW,EAAE,EAAE,CAAC,oBAAoB,CAAC,EACrC,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU;gBAEtB,wCAAM,SAAS,EAAE,EAAE,CAAC,qBAAqB,CAAC;oBACxC,8BAAC,YAAI,IAAC,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAC,MAAM,GAAG,CAClC,CACG,CACb;QAnByB,CAmBzB,CACe,CACnB,CAAC;IACJ,CAAC;IAjDD;QADC,iBAAQ;;;;uDAGR;IAgDH,qBAAC;CAAA,AApDD,CAAoC,eAAK,CAAC,SAAS,GAoDlD;AApDY,wCAAc;AAsD3B,kBAAe,IAAA,iBAAS,EACtB,IAAA,mBAAU,EACR,IAAA,+BAAc,EAAC,cAAc,EAAE;IAC7B,KAAK,EAAE,UAAU;CAClB,CAAC,CACH,CACF,CAAC",
+    "mappings": "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",
     "sourcesContent": [
-        "import {localeable} from '../locale';\nimport {themeable} from '../theme';\nimport Transfer, {TransferProps} from './Transfer';\nimport {uncontrollable} from 'uncontrollable';\nimport React from 'react';\nimport ResultBox from './ResultBox';\nimport {Icon} from './icons';\nimport PickerContainer from './PickerContainer';\nimport {autobind} from '../utils/helper';\n\nexport interface TransferPickerProps extends Omit<TransferProps, 'itemRender'> {\n  // 新的属性？\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'full';\n\n  /**\n   * 边框模式，全边框，还是半边框，或者没边框。\n   */\n  borderMode?: 'full' | 'half' | 'none';\n}\n\nexport class TransferPicker extends React.Component<TransferPickerProps> {\n  @autobind\n  handleConfirm(value: any) {\n    this.props.onChange?.(value);\n  }\n\n  render() {\n    const {\n      classnames: cx,\n      value,\n      translate: __,\n      disabled,\n      className,\n      onChange,\n      size,\n      borderMode,\n      ...rest\n    } = this.props;\n\n    return (\n      <PickerContainer\n        title={__('Select.placeholder')}\n        bodyRender={({onClose, value, onChange}) => {\n          return <Transfer {...rest} value={value} onChange={onChange} />;\n        }}\n        value={value}\n        onConfirm={this.handleConfirm}\n        size={size}\n      >\n        {({onClick, isOpened}) => (\n          <ResultBox\n            className={cx(\n              'TransferPicker',\n              className,\n              isOpened ? 'is-active' : ''\n            )}\n            allowInput={false}\n            result={value}\n            onResultChange={onChange}\n            onResultClick={onClick}\n            placeholder={__('Select.placeholder')}\n            disabled={disabled}\n            borderMode={borderMode}\n          >\n            <span className={cx('TransferPicker-icon')}>\n              <Icon icon=\"pencil\" className=\"icon\" />\n            </span>\n          </ResultBox>\n        )}\n      </PickerContainer>\n    );\n  }\n}\n\nexport default themeable(\n  localeable(\n    uncontrollable(TransferPicker, {\n      value: 'onChange'\n    })\n  )\n);\n"
+        "import {localeable} from '../locale';\nimport {themeable} from '../theme';\nimport Transfer, {TransferProps} from './Transfer';\nimport {uncontrollable} from 'uncontrollable';\nimport React from 'react';\nimport ResultBox from './ResultBox';\nimport {Icon} from './icons';\nimport PickerContainer from './PickerContainer';\nimport {autobind, mapTree} from '../utils/helper';\n\nexport interface TransferPickerProps extends Omit<TransferProps, 'itemRender'> {\n  // 新的属性？\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'full';\n\n  /**\n   * 边框模式，全边框，还是半边框，或者没边框。\n   */\n  borderMode?: 'full' | 'half' | 'none';\n}\n\nexport class TransferPicker extends React.Component<TransferPickerProps> {\n  optionModified = false;\n  @autobind\n  handleConfirm(value: any) {\n    this.props.onChange?.(value, this.optionModified);\n    this.optionModified = false;\n  }\n\n  render() {\n    const {\n      classnames: cx,\n      value,\n      translate: __,\n      disabled,\n      className,\n      onChange,\n      size,\n      borderMode,\n      ...rest\n    } = this.props;\n\n    return (\n      <PickerContainer\n        title={__('Select.placeholder')}\n        bodyRender={({onClose, value, onChange, setState, ...states}) => {\n          return (\n            <Transfer\n              {...rest}\n              {...states}\n              value={value}\n              onChange={(value: any, optionModified) => {\n                if (optionModified) {\n                  let options = mapTree(rest.options, item => {\n                    return (\n                      value.find((a: any) => a.value === item.value) || item\n                    );\n                  });\n                  this.optionModified = true;\n                  setState({options, value});\n                } else {\n                  onChange(value);\n                }\n              }}\n            />\n          );\n        }}\n        value={value}\n        onConfirm={this.handleConfirm}\n        size={size}\n      >\n        {({onClick, isOpened}) => (\n          <ResultBox\n            className={cx(\n              'TransferPicker',\n              className,\n              isOpened ? 'is-active' : ''\n            )}\n            allowInput={false}\n            result={value}\n            onResultChange={onChange}\n            onResultClick={onClick}\n            placeholder={__('Select.placeholder')}\n            disabled={disabled}\n            borderMode={borderMode}\n          >\n            <span className={cx('TransferPicker-icon')}>\n              <Icon icon=\"pencil\" className=\"icon\" />\n            </span>\n          </ResultBox>\n        )}\n      </PickerContainer>\n    );\n  }\n}\n\nexport default themeable(\n  localeable(\n    uncontrollable(TransferPicker, {\n      value: 'onChange'\n    })\n  )\n);\n"
     ]
 }