amis 1.4.2-beta.6 → 1.5.0

package/lib/components/Selection.js

@@ -0,0 +1,134 @@
+"use strict";
+/**
+ * @file Checkboxes
+ * @description 多选输入框
+ * @author fex
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Selection = exports.BaseSelection = void 0;
+var tslib_1 = require("tslib");
+var react_1 = (0, tslib_1.__importDefault)(require("react"));
+var uncontrollable_1 = require("uncontrollable");
+var Checkbox_1 = (0, tslib_1.__importDefault)(require("./Checkbox"));
+var theme_1 = require("../theme");
+var helper_1 = require("../utils/helper");
+var isEqual_1 = (0, tslib_1.__importDefault)(require("lodash/isEqual"));
+var locale_1 = require("../locale");
+var BaseSelection = /** @class */ (function (_super) {
+    (0, tslib_1.__extends)(BaseSelection, _super);
+    function BaseSelection() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    BaseSelection.value2array = function (value, options, option2value) {
+        if (option2value === void 0) { option2value = function (option) { return option; }; }
+        if (value === void 0) {
+            return [];
+        }
+        if (!Array.isArray(value)) {
+            value = [value];
+        }
+        return value.map(function (value) {
+            var option = (0, helper_1.findTree)(options, function (option) {
+                return (0, isEqual_1.default)(option2value(option), value);
+            });
+            return option || value;
+        });
+    };
+    BaseSelection.resolveSelected = function (value, options, option2value) {
+        if (option2value === void 0) { option2value = function (option) { return option; }; }
+        value = Array.isArray(value) ? value[0] : value;
+        return (0, helper_1.findTree)(options, function (option) { return (0, isEqual_1.default)(option2value(option), value); });
+    };
+    // 获取两个数组的交集
+    BaseSelection.prototype.intersectArray = function (arr1, arr2) {
+        if (!Array.isArray(arr1) || !Array.isArray(arr2)) {
+            return [];
+        }
+        var len1 = arr1.length;
+        var len2 = arr2.length;
+        if (len1 < len2) {
+            return this.intersectArray(arr2, arr1);
+        }
+        return Array.from(new Set(arr1.filter(function (item) { return arr2.includes(item); })));
+    };
+    BaseSelection.prototype.toggleOption = function (option) {
+        var _a = this.props, value = _a.value, onChange = _a.onChange, option2value = _a.option2value, options = _a.options, disabled = _a.disabled, multiple = _a.multiple, clearable = _a.clearable;
+        if (disabled || option.disabled) {
+            return;
+        }
+        var valueArray = BaseSelection.value2array(value, options, option2value);
+        var idx = valueArray.indexOf(option);
+        if (~idx && (multiple || clearable)) {
+            valueArray.splice(idx, 1);
+        }
+        else if (multiple) {
+            valueArray.push(option);
+        }
+        else {
+            valueArray = [option];
+        }
+        var newValue = option2value
+            ? valueArray.map(function (item) { return option2value(item); })
+            : valueArray;
+        onChange && onChange(multiple ? newValue : newValue[0]);
+    };
+    BaseSelection.prototype.toggleAll = function () {
+        var _a = this.props, value = _a.value, onChange = _a.onChange, option2value = _a.option2value, options = _a.options, multiple = _a.multiple;
+        if (multiple) {
+            return;
+        }
+        var valueArray = [];
+        var availableOptions = options.filter(function (option) { return !option.disabled; });
+        var intersectOptions = this.intersectArray(value, availableOptions);
+        if (!Array.isArray(value)) {
+            valueArray = availableOptions;
+        }
+        else if (intersectOptions.length < availableOptions.length) {
+            valueArray = Array.from(new Set((0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)([], value, true), availableOptions, true)));
+        }
+        else {
+            valueArray = value.filter(function (item) { return !availableOptions.includes(item); });
+        }
+        var newValue = option2value
+            ? valueArray.map(function (item) { return option2value(item); })
+            : valueArray;
+        onChange && onChange(newValue);
+    };
+    BaseSelection.prototype.render = function () {
+        var _this = this;
+        var _a = this.props, value = _a.value, options = _a.options, className = _a.className, placeholder = _a.placeholder, inline = _a.inline, labelClassName = _a.labelClassName, disabled = _a.disabled, cx = _a.classnames, option2value = _a.option2value, itemClassName = _a.itemClassName, itemRender = _a.itemRender, multiple = _a.multiple, onClick = _a.onClick;
+        var __ = this.props.translate;
+        var valueArray = BaseSelection.value2array(value, options, option2value);
+        var body = [];
+        if (Array.isArray(options) && options.length) {
+            body = options.map(function (option, key) { return (react_1.default.createElement(Checkbox_1.default, { type: multiple ? 'checkbox' : 'radio', className: cx(itemClassName, option.className), key: key, onChange: function () { return _this.toggleOption(option); }, checked: !!~valueArray.indexOf(option), disabled: disabled || option.disabled, labelClassName: labelClassName, description: option.description }, itemRender(option))); });
+        }
+        return (react_1.default.createElement("div", { className: cx('Selection', className, inline ? 'Selection--inline' : ''), onClick: onClick }, body && body.length ? body : react_1.default.createElement("div", null, __(placeholder))));
+    };
+    BaseSelection.defaultProps = {
+        placeholder: 'placeholder.noOption',
+        itemRender: function (option) { return react_1.default.createElement("span", null, option.label); },
+        multiple: true,
+        clearable: false
+    };
+    (0, tslib_1.__decorate)([
+        helper_1.autobind,
+        (0, tslib_1.__metadata)("design:type", Function),
+        (0, tslib_1.__metadata)("design:paramtypes", []),
+        (0, tslib_1.__metadata)("design:returntype", void 0)
+    ], BaseSelection.prototype, "toggleAll", null);
+    return BaseSelection;
+}(react_1.default.Component));
+exports.BaseSelection = BaseSelection;
+var Selection = /** @class */ (function (_super) {
+    (0, tslib_1.__extends)(Selection, _super);
+    function Selection() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    return Selection;
+}(BaseSelection));
+exports.Selection = Selection;
+exports.default = (0, theme_1.themeable)((0, locale_1.localeable)((0, uncontrollable_1.uncontrollable)(Selection, {
+    value: 'onChange'
+})));
+//# sourceMappingURL=./components/Selection.js.map

package/lib/components/Selection.js.map

@@ -0,0 +1,13 @@
+{
+    "version": 3,
+    "file": "Selection.js",
+    "sourceRoot": "",
+    "sources": [
+        "/src/components/Selection.tsx"
+    ],
+    "names": [],
+    "mappings": "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",
+    "sourcesContent": [
+        "/**\n * @file Checkboxes\n * @description 多选输入框\n * @author fex\n */\n\nimport React from 'react';\nimport {uncontrollable} from 'uncontrollable';\nimport Checkbox from './Checkbox';\nimport chunk from 'lodash/chunk';\nimport {ClassNamesFn, themeable, ThemeProps} from '../theme';\nimport {Option, value2array, Options} from './Select';\nimport find from 'lodash/find';\nimport {autobind, findTree} from '../utils/helper';\nimport isEqual from 'lodash/isEqual';\nimport {LocaleProps, localeable} from '../locale';\n// import isPlainObject from 'lodash/isPlainObject';\n\nexport interface BaseSelectionProps extends ThemeProps, LocaleProps {\n  options: Options;\n  className?: string;\n  placeholder?: string;\n  value?: any | Array<any>;\n  multiple?: boolean;\n  clearable?: boolean;\n  onChange?: (value: Array<any> | any) => void;\n  onDeferLoad?: (option: Option) => void;\n  inline?: boolean;\n  labelClassName?: string;\n  option2value?: (option: Option) => any;\n  itemClassName?: string;\n  itemRender: (option: Option) => JSX.Element;\n  disabled?: boolean;\n  onClick?: (e: React.MouseEvent) => void;\n}\n\nexport class BaseSelection<\n  T extends BaseSelectionProps = BaseSelectionProps,\n  S = any\n> extends React.Component<T, S> {\n  static defaultProps = {\n    placeholder: 'placeholder.noOption',\n    itemRender: (option: Option) => <span>{option.label}</span>,\n    multiple: true,\n    clearable: false\n  };\n\n  static value2array(\n    value: any,\n    options: Options,\n    option2value: (option: Option) => any = (option: Option) => option\n  ): Options {\n    if (value === void 0) {\n      return [];\n    }\n\n    if (!Array.isArray(value)) {\n      value = [value];\n    }\n\n    return value.map((value: any) => {\n      const option = findTree(options, option =>\n        isEqual(option2value(option), value)\n      );\n      return option || value;\n    });\n  }\n\n  static resolveSelected(\n    value: any,\n    options: Options,\n    option2value: (option: Option) => any = (option: Option) => option\n  ) {\n    value = Array.isArray(value) ? value[0] : value;\n    return findTree(options, option => isEqual(option2value(option), value));\n  }\n\n  // 获取两个数组的交集\n  intersectArray(\n    arr1: undefined | Array<Option>,\n    arr2: undefined | Array<Option>\n  ): Array<Option> {\n    if (!Array.isArray(arr1) || !Array.isArray(arr2)) {\n      return [];\n    }\n    const len1 = arr1.length;\n    const len2 = arr2.length;\n    if (len1 < len2) {\n      return this.intersectArray(arr2, arr1);\n    }\n    return Array.from(new Set(arr1.filter(item => arr2.includes(item))));\n  }\n\n  toggleOption(option: Option) {\n    const {\n      value,\n      onChange,\n      option2value,\n      options,\n      disabled,\n      multiple,\n      clearable\n    } = this.props;\n\n    if (disabled || option.disabled) {\n      return;\n    }\n\n    let valueArray = BaseSelection.value2array(value, options, option2value);\n    let idx = valueArray.indexOf(option);\n\n    if (~idx && (multiple || clearable)) {\n      valueArray.splice(idx, 1);\n    } else if (multiple) {\n      valueArray.push(option);\n    } else {\n      valueArray = [option];\n    }\n\n    let newValue: string | Array<Option> = option2value\n      ? valueArray.map(item => option2value(item))\n      : valueArray;\n\n    onChange && onChange(multiple ? newValue : newValue[0]);\n  }\n\n  @autobind\n  toggleAll() {\n    const {value, onChange, option2value, options, multiple} = this.props;\n    if (multiple) {\n      return;\n    }\n\n    let valueArray: Array<Option> = [];\n\n    const availableOptions = options.filter(option => !option.disabled);\n    const intersectOptions = this.intersectArray(value, availableOptions);\n\n    if (!Array.isArray(value)) {\n      valueArray = availableOptions;\n    } else if (intersectOptions.length < availableOptions.length) {\n      valueArray = Array.from(new Set([...value, ...availableOptions]));\n    } else {\n      valueArray = value.filter(item => !availableOptions.includes(item));\n    }\n\n    let newValue: string | Array<Option> = option2value\n      ? valueArray.map(item => option2value(item))\n      : valueArray;\n\n    onChange && onChange(newValue);\n  }\n\n  render() {\n    const {\n      value,\n      options,\n      className,\n      placeholder,\n      inline,\n      labelClassName,\n      disabled,\n      classnames: cx,\n      option2value,\n      itemClassName,\n      itemRender,\n      multiple,\n      onClick\n    } = this.props;\n\n    const __ = this.props.translate;\n\n    let valueArray = BaseSelection.value2array(value, options, option2value);\n    let body: Array<React.ReactNode> = [];\n\n    if (Array.isArray(options) && options.length) {\n      body = options.map((option, key) => (\n        <Checkbox\n          type={multiple ? 'checkbox' : 'radio'}\n          className={cx(itemClassName, option.className)}\n          key={key}\n          onChange={() => this.toggleOption(option)}\n          checked={!!~valueArray.indexOf(option)}\n          disabled={disabled || option.disabled}\n          labelClassName={labelClassName}\n          description={option.description}\n        >\n          {itemRender(option)}\n        </Checkbox>\n      ));\n    }\n\n    return (\n      <div\n        className={cx(\n          'Selection',\n          className,\n          inline ? 'Selection--inline' : ''\n        )}\n        onClick={onClick}\n      >\n        {body && body.length ? body : <div>{__(placeholder)}</div>}\n      </div>\n    );\n  }\n}\n\nexport class Selection extends BaseSelection {}\n\nexport default themeable(\n  localeable(\n    uncontrollable(Selection, {\n      value: 'onChange'\n    })\n  )\n);\n"
+    ]
+}