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

package/lib/components/{ChainedCheckboxes.js → ChainedSelection.js}

@@ -1,11 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChainedCheckboxes = void 0;
+exports.ChainedSelection = void 0;
 var tslib_1 = require("tslib");
 /**
  * 级联多选框，支持无限极。从左侧到右侧一层层点选。
  */
-var Checkboxes_1 = require("./Checkboxes");
+var Selection_1 = require("./Selection");
 var theme_1 = require("../theme");
 var react_1 = (0, tslib_1.__importDefault)(require("react"));
 var uncontrollable_1 = require("uncontrollable");
@@ -14,16 +14,16 @@ var helper_1 = require("../utils/helper");
 var times_1 = (0, tslib_1.__importDefault)(require("lodash/times"));
 var Spinner_1 = (0, tslib_1.__importDefault)(require("./Spinner"));
 var locale_1 = require("../locale");
-var ChainedCheckboxes = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(ChainedCheckboxes, _super);
-    function ChainedCheckboxes() {
+var ChainedSelection = /** @class */ (function (_super) {
+    (0, tslib_1.__extends)(ChainedSelection, _super);
+    function ChainedSelection() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.state = {
             selected: []
         };
         return _this;
     }
-    ChainedCheckboxes.prototype.componentDidMount = function () {
+    ChainedSelection.prototype.componentDidMount = function () {
         var defaultSelectedIndex = this.props.defaultSelectedIndex;
         if (defaultSelectedIndex !== undefined) {
             this.setState({
@@ -31,7 +31,7 @@ var ChainedCheckboxes = /** @class */ (function (_super) {
             });
         }
     };
-    ChainedCheckboxes.prototype.selectOption = function (option, depth, id) {
+    ChainedSelection.prototype.selectOption = function (option, depth, id) {
         var onDeferLoad = this.props.onDeferLoad;
         var selected = this.state.selected.concat();
         selected.splice(depth, selected.length - depth);
@@ -40,23 +40,29 @@ var ChainedCheckboxes = /** @class */ (function (_super) {
             selected: selected
         }, option.defer && onDeferLoad ? function () { return onDeferLoad(option); } : undefined);
     };
-    ChainedCheckboxes.prototype.renderOption = function (option, index, depth, id) {
+    ChainedSelection.prototype.renderItem = function (option, index, depth, id) {
+        var _this = this;
+        var _a = this.props, labelClassName = _a.labelClassName, disabled = _a.disabled, cx = _a.classnames, itemClassName = _a.itemClassName, itemRender = _a.itemRender, multiple = _a.multiple;
+        var valueArray = this.valueArray;
+        return (react_1.default.createElement("div", { key: index, className: cx('ChainedSelection-item', itemClassName, option.className, disabled || option.disabled ? 'is-disabled' : '', !!~valueArray.indexOf(option) ? 'is-active' : ''), onClick: function () { return _this.toggleOption(option); } },
+            react_1.default.createElement("div", { className: cx('ChainedSelection-itemLabel') }, itemRender(option)),
+            multiple ? (react_1.default.createElement(Checkbox_1.default, { size: "sm", checked: !!~valueArray.indexOf(option), disabled: disabled || option.disabled, labelClassName: labelClassName, description: option.description })) : null));
+    };
+    ChainedSelection.prototype.renderOption = function (option, index, depth, id) {
         var _this = this;
         var _a = this.props, labelClassName = _a.labelClassName, disabled = _a.disabled, cx = _a.classnames, itemClassName = _a.itemClassName, itemRender = _a.itemRender;
         var valueArray = this.valueArray;
         if (Array.isArray(option.children) || option.defer) {
-            return (react_1.default.createElement("div", { key: index, className: cx('ChainedCheckboxes-item', itemClassName, option.className, disabled || option.disabled ? 'is-disabled' : '', ~this.state.selected.indexOf(id) ? 'is-active' : ''), onClick: function () { return _this.selectOption(option, depth, id); } },
-                react_1.default.createElement("div", { className: cx('ChainedCheckboxes-itemLabel') }, itemRender(option)),
+            return (react_1.default.createElement("div", { key: index, className: cx('ChainedSelection-item', itemClassName, option.className, disabled || option.disabled ? 'is-disabled' : '', ~this.state.selected.indexOf(id) ? 'is-active' : ''), onClick: function () { return _this.selectOption(option, depth, id); } },
+                react_1.default.createElement("div", { className: cx('ChainedSelection-itemLabel') }, itemRender(option)),
                 option.defer && option.loading ? react_1.default.createElement(Spinner_1.default, { size: "sm", show: true }) : null));
         }
-        return (react_1.default.createElement("div", { key: index, className: cx('ChainedCheckboxes-item', itemClassName, option.className, disabled || option.disabled ? 'is-disabled' : ''), onClick: function () { return _this.toggleOption(option); } },
-            react_1.default.createElement("div", { className: cx('ChainedCheckboxes-itemLabel') }, itemRender(option)),
-            react_1.default.createElement(Checkbox_1.default, { size: "sm", checked: !!~valueArray.indexOf(option), disabled: disabled || option.disabled, labelClassName: labelClassName, description: option.description })));
+        return this.renderItem(option, index, depth, id);
     };
-    ChainedCheckboxes.prototype.render = function () {
+    ChainedSelection.prototype.render = function () {
         var _this = this;
         var _a = this.props, value = _a.value, options = _a.options, className = _a.className, placeholder = _a.placeholder, cx = _a.classnames, option2value = _a.option2value, itemRender = _a.itemRender, __ = _a.translate;
-        this.valueArray = Checkboxes_1.BaseCheckboxes.value2array(value, options, option2value);
+        this.valueArray = Selection_1.BaseSelection.value2array(value, options, option2value);
         var body = [];
         if (Array.isArray(options) && options.length) {
             var selected_1 = this.state.selected.concat();
@@ -68,8 +74,8 @@ var ChainedCheckboxes = /** @class */ (function (_super) {
                 var nextSubTitle = '';
                 var nextPlaceholder = '';
                 var nextIndexes = indexes;
-                body.push(react_1.default.createElement("div", { key: depth, className: cx('ChainedCheckboxes-col') },
-                    subTitle ? (react_1.default.createElement("div", { className: cx('ChainedCheckboxes-subTitle') }, subTitle)) : null,
+                body.push(react_1.default.createElement("div", { key: depth, className: cx('ChainedSelection-col') },
+                    subTitle ? (react_1.default.createElement("div", { className: cx('ChainedSelection-subTitle') }, subTitle)) : null,
                     Array.isArray(options) && options.length ? (options.map(function (option, index) {
                         var id = indexes.concat(index).join('-');
                         if (id === selected) {
@@ -79,7 +85,7 @@ var ChainedCheckboxes = /** @class */ (function (_super) {
                             nextPlaceholder = option.placeholder;
                         }
                         return _this.renderOption(option, index, depth, id);
-                    })) : (react_1.default.createElement("div", { className: cx('ChainedCheckboxes-placeholder') }, __(placeholder)))));
+                    })) : (react_1.default.createElement("div", { className: cx('ChainedSelection-placeholder') }, __(placeholder)))));
                 return {
                     options: nextOptions,
                     subTitle: nextSubTitle,
@@ -94,12 +100,12 @@ var ChainedCheckboxes = /** @class */ (function (_super) {
                 placeholder: placeholder
             });
         }
-        return (react_1.default.createElement("div", { className: cx('ChainedCheckboxes', className) }, body && body.length ? (body) : (react_1.default.createElement("div", { className: cx('ChainedCheckboxes-placeholder') }, __(placeholder)))));
+        return (react_1.default.createElement("div", { className: cx('ChainedSelection', className) }, body && body.length ? (body) : (react_1.default.createElement("div", { className: cx('ChainedSelection-placeholder') }, __(placeholder)))));
     };
-    return ChainedCheckboxes;
-}(Checkboxes_1.BaseCheckboxes));
-exports.ChainedCheckboxes = ChainedCheckboxes;
-exports.default = (0, theme_1.themeable)((0, locale_1.localeable)((0, uncontrollable_1.uncontrollable)(ChainedCheckboxes, {
+    return ChainedSelection;
+}(Selection_1.BaseSelection));
+exports.ChainedSelection = ChainedSelection;
+exports.default = (0, theme_1.themeable)((0, locale_1.localeable)((0, uncontrollable_1.uncontrollable)(ChainedSelection, {
     value: 'onChange'
 })));
-//# sourceMappingURL=./components/ChainedCheckboxes.js.map
+//# sourceMappingURL=./components/ChainedSelection.js.map

package/lib/components/ChainedSelection.js.map

@@ -0,0 +1,13 @@
+{
+    "version": 3,
+    "file": "ChainedSelection.js",
+    "sourceRoot": "",
+    "sources": [
+        "/src/components/ChainedSelection.tsx"
+    ],
+    "names": [],
+    "mappings": "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",
+    "sourcesContent": [
+        "/**\n * 级联多选框，支持无限极。从左侧到右侧一层层点选。\n */\nimport {BaseSelection, BaseSelectionProps} from './Selection';\nimport {themeable} from '../theme';\nimport React from 'react';\nimport {uncontrollable} from 'uncontrollable';\nimport Checkbox from './Checkbox';\nimport {Option} from './Select';\nimport {getTreeDepth} from '../utils/helper';\nimport times from 'lodash/times';\nimport Spinner from './Spinner';\nimport {localeable} from '../locale';\n\nexport interface ChainedSelectionProps extends BaseSelectionProps {\n  defaultSelectedIndex?: string;\n}\n\nexport interface ChainedSelectionState {\n  selected: Array<string>;\n}\n\nexport class ChainedSelection extends BaseSelection<\n  ChainedSelectionProps,\n  ChainedSelectionState\n> {\n  valueArray: Array<Option>;\n  state: ChainedSelectionState = {\n    selected: []\n  };\n\n  componentDidMount() {\n    const defaultSelectedIndex = this.props.defaultSelectedIndex;\n\n    if (defaultSelectedIndex !== undefined) {\n      this.setState({\n        selected: [`${defaultSelectedIndex}`]\n      });\n    }\n  }\n\n  selectOption(option: Option, depth: number, id: string) {\n    const {onDeferLoad} = this.props;\n\n    const selected = this.state.selected.concat();\n    selected.splice(depth, selected.length - depth);\n    selected.push(id);\n\n    this.setState(\n      {\n        selected\n      },\n      option.defer && onDeferLoad ? () => onDeferLoad(option) : undefined\n    );\n  }\n\n  renderItem(option: Option, index: number, depth: number, id: string) {\n    const {\n      labelClassName,\n      disabled,\n      classnames: cx,\n      itemClassName,\n      itemRender,\n      multiple\n    } = this.props;\n    const valueArray = this.valueArray;\n\n    return (\n      <div\n        key={index}\n        className={cx(\n          'ChainedSelection-item',\n          itemClassName,\n          option.className,\n          disabled || option.disabled ? 'is-disabled' : '',\n          !!~valueArray.indexOf(option) ? 'is-active' : ''\n        )}\n        onClick={() => this.toggleOption(option)}\n      >\n        <div className={cx('ChainedSelection-itemLabel')}>\n          {itemRender(option)}\n        </div>\n\n        {multiple ? (\n          <Checkbox\n            size=\"sm\"\n            checked={!!~valueArray.indexOf(option)}\n            disabled={disabled || option.disabled}\n            labelClassName={labelClassName}\n            description={option.description}\n          />\n        ) : null}\n      </div>\n    );\n  }\n\n  renderOption(option: Option, index: number, depth: number, id: string) {\n    const {\n      labelClassName,\n      disabled,\n      classnames: cx,\n      itemClassName,\n      itemRender\n    } = this.props;\n    const valueArray = this.valueArray;\n\n    if (Array.isArray(option.children) || option.defer) {\n      return (\n        <div\n          key={index}\n          className={cx(\n            'ChainedSelection-item',\n            itemClassName,\n            option.className,\n            disabled || option.disabled ? 'is-disabled' : '',\n            ~this.state.selected.indexOf(id) ? 'is-active' : ''\n          )}\n          onClick={() => this.selectOption(option, depth, id)}\n        >\n          <div className={cx('ChainedSelection-itemLabel')}>\n            {itemRender(option)}\n          </div>\n\n          {option.defer && option.loading ? <Spinner size=\"sm\" show /> : null}\n        </div>\n      );\n    }\n\n    return this.renderItem(option, index, depth, id);\n  }\n\n  render() {\n    const {\n      value,\n      options,\n      className,\n      placeholder,\n      classnames: cx,\n      option2value,\n      itemRender,\n      translate: __\n    } = this.props;\n\n    this.valueArray = BaseSelection.value2array(value, options, option2value);\n    let body: Array<React.ReactNode> = [];\n\n    if (Array.isArray(options) && options.length) {\n      const selected: Array<string | null> = this.state.selected.concat();\n      const depth = Math.min(getTreeDepth(options), 3);\n      times(Math.max(depth - selected.length, 1), () => selected.push(null));\n\n      selected.reduce(\n        (\n          {\n            body,\n            options,\n            subTitle,\n            indexes,\n            placeholder\n          }: {\n            body: Array<React.ReactNode>;\n            options: Array<Option> | null;\n            subTitle?: string;\n            indexes: Array<number>;\n            placeholder?: string;\n          },\n          selected,\n          depth\n        ) => {\n          let nextOptions: Array<Option> = [];\n          let nextSubTitle: string = '';\n          let nextPlaceholder: string = '';\n          let nextIndexes = indexes;\n\n          body.push(\n            <div key={depth} className={cx('ChainedSelection-col')}>\n              {subTitle ? (\n                <div className={cx('ChainedSelection-subTitle')}>\n                  {subTitle}\n                </div>\n              ) : null}\n              {Array.isArray(options) && options.length ? (\n                options.map((option, index) => {\n                  const id = indexes.concat(index).join('-');\n\n                  if (id === selected) {\n                    nextSubTitle = option.subTitle;\n                    nextOptions = option.children!;\n                    nextIndexes = indexes.concat(index);\n                    nextPlaceholder = option.placeholder;\n                  }\n\n                  return this.renderOption(option, index, depth, id);\n                })\n              ) : (\n                <div className={cx('ChainedSelection-placeholder')}>\n                  {__(placeholder)}\n                </div>\n              )}\n            </div>\n          );\n\n          return {\n            options: nextOptions,\n            subTitle: nextSubTitle,\n            placeholder: nextPlaceholder,\n            indexes: nextIndexes,\n            body: body\n          };\n        },\n        {\n          options,\n          body,\n          indexes: [],\n          placeholder\n        }\n      );\n    }\n\n    return (\n      <div className={cx('ChainedSelection', className)}>\n        {body && body.length ? (\n          body\n        ) : (\n          <div className={cx('ChainedSelection-placeholder')}>\n            {__(placeholder)}\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n\nexport default themeable(\n  localeable(\n    uncontrollable(ChainedSelection, {\n      value: 'onChange'\n    })\n  )\n);\n"
+    ]
+}