amis-ui 6.2.2 → 6.4.0

package/lib/components/Tree.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v6.2.2
+ * amis-ui v6.4.0
  * Copyright 2018-2024 fex
  */
 
@@ -452,7 +452,7 @@ var TreeSelector = /** @class */ (function (_super) {
             flattenedOptions: flattenedOptionsWithoutAdding
         });
     };
-    TreeSelector.prototype.renderInput = function (prfix) {
+    TreeSelector.prototype.renderInput = function (prfix, testIdBuilder) {
         if (prfix === void 0) { prfix = null; }
         var _a = this.props, cx = _a.classnames, mobileUI = _a.mobileUI, __ = _a.translate;
         var inputValue = this.state.inputValue;
@@ -463,10 +463,10 @@ var TreeSelector = /** @class */ (function (_super) {
                     'is-mobile': mobileUI
                 }) },
                 prfix,
-                _J$X_("input", { onChange: this.handleInputChange, value: inputValue, placeholder: __('placeholder.enter') }),
-                _J$X_("a", { "data-tooltip": __('cancel'), onClick: this.handleCancel },
+                _J$X_("input", tslib.__assign({ onChange: this.handleInputChange, value: inputValue, placeholder: __('placeholder.enter') }, testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getChild('input').getTestId())),
+                _J$X_("a", tslib.__assign({ "data-tooltip": __('cancel'), onClick: this.handleCancel }, testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getChild('cancel').getTestId()),
                     _J$X_(icons.Icon, { icon: "close", className: "icon" })),
-                _J$X_("a", { "data-tooltip": __('confirm'), onClick: this.handleConfirm },
+                _J$X_("a", tslib.__assign({ "data-tooltip": __('confirm'), onClick: this.handleConfirm }, testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getChild('confirm').getTestId()),
                     _J$X_(icons.Icon, { icon: "check", className: "icon" })))));
     };
     TreeSelector.prototype.getOffsetPosition = function (element) {
@@ -744,7 +744,7 @@ var TreeSelector = /** @class */ (function (_super) {
     TreeSelector.prototype.renderItem = function (_a) {
         var _this = this;
         var index = _a.index, style = _a.style;
-        var _b = this.props, itemClassName = _b.itemClassName, showIcon = _b.showIcon, showRadio = _b.showRadio, multiple = _b.multiple, labelField = _b.labelField, iconField = _b.iconField, deferField = _b.deferField, cascade = _b.cascade, cx = _b.classnames, highlightTxt = _b.highlightTxt, creatable = _b.creatable, editable = _b.editable, removable = _b.removable, createTip = _b.createTip, editTip = _b.editTip, removeTip = _b.removeTip, __ = _b.translate, itemRender = _b.itemRender, draggable = _b.draggable, loadingConfig = _b.loadingConfig, enableDefaultIcon = _b.enableDefaultIcon, valueField = _b.valueField, mobileUI = _b.mobileUI;
+        var _b = this.props, itemClassName = _b.itemClassName, showIcon = _b.showIcon, showRadio = _b.showRadio, multiple = _b.multiple, labelField = _b.labelField, iconField = _b.iconField, deferField = _b.deferField, cascade = _b.cascade, cx = _b.classnames, highlightTxt = _b.highlightTxt, creatable = _b.creatable, editable = _b.editable, removable = _b.removable, createTip = _b.createTip, editTip = _b.editTip, removeTip = _b.removeTip, __ = _b.translate, itemRender = _b.itemRender, draggable = _b.draggable, loadingConfig = _b.loadingConfig, enableDefaultIcon = _b.enableDefaultIcon, valueField = _b.valueField, mobileUI = _b.mobileUI, testIdBuilder = _b.testIdBuilder;
         var item = this.state.flattenedOptions[index];
         if (!item) {
             return null;
@@ -754,7 +754,8 @@ var TreeSelector = /** @class */ (function (_super) {
         var disabled = this.isItemDisabled(item, checked);
         var partial = this.isItemChildrenPartialChecked(item, checked);
         var checkedInValue = !!~this.state.value.indexOf(item);
-        var checkbox = multiple ? (_J$X_(Checkbox["default"], { size: "sm", disabled: disabled, checked: checked || partial, partial: partial, onChange: this.handleCheck.bind(this, item, !checked) })) : showRadio ? (_J$X_(Checkbox["default"], { size: "sm", disabled: disabled, checked: checked, onChange: this.handleSelect.bind(this, item) })) : null;
+        var itemTestBuilder = testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getChild("item-".concat(item[valueField] || item[labelField] || index));
+        var checkbox = multiple ? (_J$X_(Checkbox["default"], { size: "sm", disabled: disabled, checked: checked || partial, partial: partial, onChange: this.handleCheck.bind(this, item, !checked), testIdBuilder: itemTestBuilder === null || itemTestBuilder === void 0 ? void 0 : itemTestBuilder.getChild('chekbx') })) : showRadio ? (_J$X_(Checkbox["default"], { size: "sm", disabled: disabled, checked: checked, onChange: this.handleSelect.bind(this, item), testIdBuilder: itemTestBuilder === null || itemTestBuilder === void 0 ? void 0 : itemTestBuilder.getChild('chekbx') })) : null;
         var isLeaf = (!item.children || !item.children.length) && !item.placeholder;
         var iconValue = item[iconField] ||
             (enableDefaultIcon !== false
@@ -765,12 +766,13 @@ var TreeSelector = /** @class */ (function (_super) {
         var level = this.levels.has(item) ? this.levels.get(item) - 1 : 0;
         var body = null;
         if (isEditing && editingItem === item) {
-            body = this.renderInput(checkbox);
+            body = this.renderInput(checkbox, itemTestBuilder === null || itemTestBuilder === void 0 ? void 0 : itemTestBuilder.getChild('edit'));
         }
         else if (item.isAdding) {
-            body = this.renderInput(_J$X_("span", { className: cx('Tree-itemArrowPlaceholder') }));
+            body = this.renderInput(_J$X_("span", { className: cx('Tree-itemArrowPlaceholder') }), itemTestBuilder === null || itemTestBuilder === void 0 ? void 0 : itemTestBuilder.getChild('add'));
         }
         else {
+            var isFolded = !this.isUnfolded(item);
             body = (_J$X_("div", { className: cx('Tree-itemLabel', {
                     'is-children-checked': multiple &&
                         !cascade &&
@@ -779,14 +781,14 @@ var TreeSelector = /** @class */ (function (_super) {
                     'is-checked': checkedInValue,
                     'is-disabled': disabled
                 }), draggable: draggable, onDragStart: this.onDragStart(item), onDragOver: this.onDragOver(item), onDragEnd: this.onDragEnd(item) },
-                draggable && (_J$X_("a", { className: cx('Tree-itemDrager drag-bar') },
+                draggable && (_J$X_("a", tslib.__assign({ className: cx('Tree-itemDrager drag-bar') }, itemTestBuilder === null || itemTestBuilder === void 0 ? void 0 : itemTestBuilder.getChild('drag-bar').getTestId()),
                     _J$X_(icons.Icon, { icon: "drag-bar", className: "icon" }))),
-                item.loading ? (_J$X_(Spinner["default"], { size: "sm", show: true, icon: "reload", spinnerClassName: cx('Tree-spinner'), loadingConfig: loadingConfig })) : !isLeaf || (item[deferField] && !item.loaded) ? (_J$X_("div", { onClick: function () { return _this.toggleUnfolded(item); }, className: cx('Tree-itemArrow', {
-                        'is-folded': !this.isUnfolded(item)
-                    }) },
+                item.loading ? (_J$X_(Spinner["default"], { size: "sm", show: true, icon: "reload", spinnerClassName: cx('Tree-spinner'), loadingConfig: loadingConfig })) : !isLeaf || (item[deferField] && !item.loaded) ? (_J$X_("div", tslib.__assign({ onClick: function () { return _this.toggleUnfolded(item); }, className: cx('Tree-itemArrow', {
+                        'is-folded': isFolded
+                    }) }, itemTestBuilder === null || itemTestBuilder === void 0 ? void 0 : itemTestBuilder.getChild(isFolded ? 'open' : 'fold').getTestId()),
                     _J$X_(icons.Icon, { icon: "down-arrow-bold", className: "icon" }))) : (_J$X_("span", { className: cx('Tree-itemArrowPlaceholder') })),
                 checkbox,
-                _J$X_("div", { className: cx('Tree-itemLabel-item', { 'is-mobile': mobileUI }) },
+                _J$X_("div", tslib.__assign({ className: cx('Tree-itemLabel-item', { 'is-mobile': mobileUI }) }, itemTestBuilder === null || itemTestBuilder === void 0 ? void 0 : itemTestBuilder.getChild('content').getTestId()),
                     showIcon ? (_J$X_("i", { className: cx("Tree-itemIcon ".concat(Array.isArray(item.children) && item.children.length
                             ? 'Tree-folderIcon'
                             : 'Tree-leafIcon')), onClick: function () {
@@ -794,13 +796,13 @@ var TreeSelector = /** @class */ (function (_super) {
                                 (multiple
                                     ? _this.handleCheck(item, !checked)
                                     : _this.handleSelect(item));
-                        } }, iconValue ? (icons.getIcon(iconValue) ? (_J$X_(icons.Icon, { icon: iconValue, className: "icon" })) : React__default["default"].isValidElement(iconValue) ? (iconValue) : (_J$X_("i", { className: iconValue }))) : null)) : null,
-                    _J$X_("span", { className: cx('Tree-itemText'), onClick: function () {
+                        } }, iconValue ? _J$X_(icons.Icon, { icon: iconValue, className: "icon" }) : null)) : null,
+                    _J$X_("span", tslib.__assign({ className: cx('Tree-itemText'), onClick: function () {
                             return !disabled &&
                                 (multiple
                                     ? _this.handleCheck(item, !checked)
                                     : _this.handleSelect(item));
-                        }, title: item[labelField] }, itemRender
+                        }, title: item[labelField] }, itemTestBuilder === null || itemTestBuilder === void 0 ? void 0 : itemTestBuilder.getChild('text').getTestId()), itemRender
                         ? itemRender(item, {
                             index: index,
                             multiple: multiple,
@@ -818,19 +820,19 @@ var TreeSelector = /** @class */ (function (_super) {
                         !isEditing &&
                         !(item[deferField] && !item.loaded) ? (_J$X_("div", { className: cx('Tree-item-icons') },
                         creatable && amisCore.hasAbility(item, 'creatable') ? (_J$X_(TooltipWrapper["default"], { placement: 'bottom', tooltip: __(createTip), trigger: 'hover', tooltipTheme: "dark" },
-                            _J$X_("a", { onClick: this.handleAdd.bind(this, item) },
+                            _J$X_("a", tslib.__assign({ onClick: this.handleAdd.bind(this, item) }, itemTestBuilder === null || itemTestBuilder === void 0 ? void 0 : itemTestBuilder.getChild('add').getTestId()),
                                 _J$X_(icons.Icon, { icon: "plus", className: "icon" })))) : null,
                         removable && amisCore.hasAbility(item, 'removable') ? (_J$X_(TooltipWrapper["default"], { placement: 'bottom', tooltip: __(removeTip), trigger: 'hover', tooltipTheme: "dark" },
-                            _J$X_("a", { onClick: this.handleRemove.bind(this, item) },
+                            _J$X_("a", tslib.__assign({ onClick: this.handleRemove.bind(this, item) }, itemTestBuilder === null || itemTestBuilder === void 0 ? void 0 : itemTestBuilder.getChild('remove').getTestId()),
                                 _J$X_(icons.Icon, { icon: "minus", className: "icon" })))) : null,
                         editable && amisCore.hasAbility(item, 'editable') ? (_J$X_(TooltipWrapper["default"], { placement: 'bottom', tooltip: __(editTip), trigger: 'hover', tooltipTheme: "dark" },
-                            _J$X_("a", { onClick: this.handleEdit.bind(this, item) },
+                            _J$X_("a", tslib.__assign({ onClick: this.handleEdit.bind(this, item) }, itemTestBuilder === null || itemTestBuilder === void 0 ? void 0 : itemTestBuilder.getChild('edit').getTestId()),
                                 _J$X_(icons.Icon, { icon: "new-edit", className: "icon" })))) : null)) : null)));
         }
-        return (_J$X_("li", { key: "".concat(item[valueField || 'value'], "-").concat(index), className: cx("Tree-item ".concat(itemClassName || ''), {
+        return (_J$X_("li", tslib.__assign({ key: "".concat(item[valueField || 'value'], "-").concat(index), className: cx("Tree-item ".concat(itemClassName || ''), {
                 'Tree-item--isLeaf': isLeaf,
                 'is-child': this.relations.get(item)
-            }), style: tslib.__assign(tslib.__assign({}, style), { paddingLeft: "calc(".concat(level, " * var(--Tree-indent))") }) }, body));
+            }), style: tslib.__assign(tslib.__assign({}, style), { paddingLeft: "calc(".concat(level, " * var(--Tree-indent))") }) }, itemTestBuilder === null || itemTestBuilder === void 0 ? void 0 : itemTestBuilder.getTestId()), body));
     };
     TreeSelector.prototype.isEmptyOrNotExist = function (obj) {
         return obj === '' || obj === undefined || obj === null;
@@ -900,21 +902,21 @@ var TreeSelector = /** @class */ (function (_super) {
             list.map(function (item, index) { return _this.renderItem({ index: index }); })));
     };
     TreeSelector.prototype.render = function () {
-        var _a = this.props, className = _a.className, placeholder = _a.placeholder, hideRoot = _a.hideRoot, rootLabel = _a.rootLabel, showOutline = _a.showOutline, showIcon = _a.showIcon, cx = _a.classnames, creatable = _a.creatable, rootCreatable = _a.rootCreatable, rootCreateTip = _a.rootCreateTip, disabled = _a.disabled, draggable = _a.draggable, __ = _a.translate;
+        var _a = this.props, className = _a.className, placeholder = _a.placeholder, hideRoot = _a.hideRoot, rootLabel = _a.rootLabel, showOutline = _a.showOutline, showIcon = _a.showIcon, cx = _a.classnames, creatable = _a.creatable, rootCreatable = _a.rootCreatable, rootCreateTip = _a.rootCreateTip, disabled = _a.disabled, draggable = _a.draggable, __ = _a.translate, testIdBuilder = _a.testIdBuilder;
         var _b = this.state, value = _b.value, isAdding = _b.isAdding, addingParent = _b.addingParent, isEditing = _b.isEditing, dropIndicator = _b.dropIndicator, flattenedOptions = _b.flattenedOptions;
         var addBtn = null;
         if (creatable && rootCreatable !== false && hideRoot) {
-            addBtn = (_J$X_("a", { className: cx('Tree-addTopBtn', {
+            addBtn = (_J$X_("a", tslib.__assign({ className: cx('Tree-addTopBtn', {
                     'is-disabled': isAdding || isEditing
-                }), onClick: this.handleAdd.bind(this, null) },
+                }), onClick: this.handleAdd.bind(this, null) }, testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getChild('add').getTestId()),
                 _J$X_(icons.Icon, { icon: "plus", className: "icon" }),
                 _J$X_("span", null, __(rootCreateTip))));
         }
-        return (_J$X_("div", { className: cx("Tree ".concat(className || ''), {
+        return (_J$X_("div", tslib.__assign({ className: cx("Tree ".concat(className || ''), {
                 'Tree--outline': showOutline,
                 'is-disabled': disabled,
                 'is-draggable': draggable
-            }), ref: this.root },
+            }), ref: this.root }, testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getTestId()),
             (flattenedOptions && flattenedOptions.length) ||
                 addBtn ||
                 hideRoot === false ? (_J$X_("ul", { className: cx('Tree-list') }, hideRoot ? (_J$X_(React__default["default"].Fragment, null,
@@ -924,7 +926,7 @@ var TreeSelector = /** @class */ (function (_super) {
                     'is-checked': !value || !value.length
                 }) },
                 _J$X_("div", { className: cx('Tree-itemLabel') },
-                    _J$X_("span", { className: cx('Tree-itemText'), onClick: this.clearSelect },
+                    _J$X_("span", tslib.__assign({ className: cx('Tree-itemText'), onClick: this.clearSelect }, testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getChild("root-item").getTestId()),
                         showIcon ? (_J$X_("i", { className: cx('Tree-itemIcon Tree-rootIcon') },
                             _J$X_(icons.Icon, { icon: "home", className: "icon" }))) : null,
                         rootLabel),
@@ -932,7 +934,7 @@ var TreeSelector = /** @class */ (function (_super) {
                         creatable &&
                         rootCreatable !== false &&
                         !isAdding &&
-                        !isEditing ? (_J$X_("div", { className: cx('Tree-item-icons') }, creatable ? (_J$X_("a", { onClick: this.handleAdd.bind(this, null), "data-tooltip": rootCreateTip, "data-position": "left" },
+                        !isEditing ? (_J$X_("div", { className: cx('Tree-item-icons') }, creatable ? (_J$X_("a", tslib.__assign({ onClick: this.handleAdd.bind(this, null), "data-tooltip": rootCreateTip, "data-position": "left" }, testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getChild("root-add").getTestId()),
                         _J$X_(icons.Icon, { icon: "plus", className: "icon" }))) : null)) : null),
                 _J$X_("ul", { className: cx('Tree-sublist') },
                     isAdding && !addingParent ? (_J$X_("li", { className: cx('Tree-item') }, this.renderInput())) : null,