amis-ui 3.1.0 → 3.2.0

package/lib/components/calendar/QuartersView.d.ts

@@ -15,13 +15,24 @@ export interface QuarterViewProps extends LocaleProps, ThemeProps {
     renderQuarter: any;
     isValidDate: (date: moment.Moment) => boolean;
     hideHeader?: boolean;
+    useMobileUI?: boolean;
+    onConfirm?: (value: number[], types?: string[]) => void;
+    onClose?: () => void;
 }
 export declare class QuarterView extends React.Component<QuarterViewProps> {
+    state: {
+        columns: never[];
+        pickerValue: number[];
+    };
     renderYear(): React.JSX.Element | null;
     renderQuarters(): React.DetailedReactHTMLElement<React.HTMLAttributes<HTMLElement>, HTMLElement>[];
     renderQuarter: (props: any, quartar: number, year: number, date: moment.Moment) => React.JSX.Element;
     updateSelectedQuarter: (event: any) => void;
     alwaysValidDate(): boolean;
+    onPickerConfirm: (value: number[]) => void;
+    onPickerChange: (value: number[], index: number) => void;
+    cancel(): void;
+    renderPicker(): React.JSX.Element;
     render(): React.JSX.Element;
 }
 declare const _default: {

package/lib/components/calendar/QuartersView.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 
@@ -11,6 +11,7 @@ var tslib = require('tslib');
 var moment = require('moment');
 var React = require('react');
 var amisCore = require('amis-core');
+var Picker = require('../Picker.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -21,6 +22,10 @@ var QuarterView = /** @class */ (function (_super) {
     tslib.__extends(QuarterView, _super);
     function QuarterView() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.state = {
+            columns: [],
+            pickerValue: [_this.props.viewDate.year(), _this.props.viewDate.quarter()]
+        };
         _this.renderQuarter = function (props, quartar, year, date) {
             return (React__default["default"].createElement("td", tslib.__assign({}, props),
                 React__default["default"].createElement("span", null,
@@ -30,6 +35,12 @@ var QuarterView = /** @class */ (function (_super) {
         _this.updateSelectedQuarter = function (event) {
             _this.props.updateSelectedDate(event);
         };
+        _this.onPickerConfirm = function (value) {
+            _this.props.onConfirm && _this.props.onConfirm(value, ['year', 'quarter']);
+        };
+        _this.onPickerChange = function (value, index) {
+            _this.setState({ pickerValue: value });
+        };
         return _this;
     }
     QuarterView.prototype.renderYear = function () {
@@ -78,13 +89,44 @@ var QuarterView = /** @class */ (function (_super) {
     QuarterView.prototype.alwaysValidDate = function () {
         return true;
     };
+    QuarterView.prototype.cancel = function () {
+        var _a, _b;
+        (_b = (_a = this.props).onClose) === null || _b === void 0 ? void 0 : _b.call(_a);
+    };
+    QuarterView.prototype.renderPicker = function () {
+        var __ = this.props.translate;
+        var title = __('Date.titleQuarter');
+        var minYear = new Date().getFullYear() - 100;
+        var maxYear = new Date().getFullYear() + 100;
+        var columns = [
+            {
+                options: amisCore.getRange(minYear, maxYear, 1)
+            },
+            {
+                options: amisCore.getRange(1, 4).map(function (item) {
+                    return {
+                        text: 'Q' + item,
+                        value: item
+                    };
+                })
+            }
+        ];
+        return (React__default["default"].createElement(Picker["default"], { translate: this.props.translate, locale: this.props.locale, title: title, columns: columns, value: this.state.pickerValue, onChange: this.onPickerChange, onConfirm: this.onPickerConfirm, onClose: this.cancel }));
+    };
     QuarterView.prototype.render = function () {
-        var _a = this.props, cx = _a.classnames, hideHeader = _a.hideHeader;
-        return (React__default["default"].createElement("div", { className: cx('ClalendarQuarter') },
+        var _a = this.props, cx = _a.classnames, hideHeader = _a.hideHeader, useMobileUI = _a.useMobileUI;
+        var mobileUI = useMobileUI && amisCore.isMobile();
+        return mobileUI ? (this.renderPicker()) : (React__default["default"].createElement("div", { className: cx('ClalendarQuarter') },
             hideHeader ? null : this.renderYear(),
             React__default["default"].createElement("table", null,
                 React__default["default"].createElement("tbody", null, this.renderQuarters()))));
     };
+    tslib.__decorate([
+        amisCore.autobind,
+        tslib.__metadata("design:type", Function),
+        tslib.__metadata("design:paramtypes", []),
+        tslib.__metadata("design:returntype", void 0)
+    ], QuarterView.prototype, "cancel", null);
     return QuarterView;
 }(React__default["default"].Component));
 var QuartersView = amisCore.localeable(QuarterView);

package/lib/components/calendar/TimeView.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 
@@ -438,9 +438,11 @@ var CustomTimeView = /** @class */ (function (_super) {
                                 : 'CalendarInput-sugsTimes'), id: "".concat(_this.state.uniqueTag, "-").concat(i, "-input") }, options_1.map(function (option) {
                             var _a;
                             return (React__default["default"].createElement("div", { key: option.value, className: cx('CalendarInput-sugsItem', {
+                                    'is-mobile': amisCore.isMobile(),
                                     'is-highlight': selectedDate
                                         ? option.value === date.format(formatMap_1[type])
-                                        : option.value === ((_a = options_1 === null || options_1 === void 0 ? void 0 : options_1[0]) === null || _a === void 0 ? void 0 : _a.value)
+                                        : option.value === ((_a = options_1 === null || options_1 === void 0 ? void 0 : options_1[0]) === null || _a === void 0 ? void 0 : _a.value) &&
+                                            !amisCore.isMobile()
                                 }), onClick: function () {
                                     _this.setTime(type, parseInt(option.value, 10));
                                     _this.scrollToTop(type, parseInt(option.value, 10), i);

package/lib/components/calendar/YearsView.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 

package/lib/components/condition-builder/Expression.d.ts

@@ -30,7 +30,7 @@ export interface ExpressionProps extends ThemeProps, LocaleProps {
     formula?: FormulaPickerProps;
     popOverContainer?: any;
     renderEtrValue?: any;
-    selectMode?: 'list' | 'tree';
+    selectMode?: 'list' | 'tree' | 'chained';
 }
 export declare class Expression extends React.Component<ExpressionProps> {
     handleInputTypeChange(type: 'value' | 'field' | 'func' | 'formula'): void;

package/lib/components/condition-builder/Expression.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 

package/lib/components/condition-builder/Field.d.ts

@@ -10,16 +10,12 @@ export interface ConditionFieldProps extends ThemeProps, LocaleProps, SpinnerExt
     fieldClassName?: string;
     searchable?: boolean;
     popOverContainer?: any;
-    selectMode?: 'list' | 'tree';
+    selectMode?: 'list' | 'tree' | 'chained';
 }
-export interface ConditionFieldState {
+export interface FieldState {
     searchText: string;
 }
-export declare class ConditionField extends React.Component<ConditionFieldProps, ConditionFieldState> {
-    constructor(props: ConditionFieldProps);
-    onSearch(text: string): void;
-    filterOptions(options: any[]): any[];
-    onPopClose(onClose: () => void): void;
+export declare class ConditionField extends React.Component<ConditionFieldProps, FieldState> {
     render(): React.JSX.Element;
 }
 declare const _default: {

package/lib/components/condition-builder/Field.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 
@@ -9,14 +9,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var tslib = require('tslib');
 var React = require('react');
-var ReactDOM = require('react-dom');
-var PopOverContainer = require('../PopOverContainer.js');
-var GroupedSelection = require('../GroupedSelection.js');
-var ResultBox = require('../ResultBox.js');
 var amisCore = require('amis-core');
-var icons = require('../icons.js');
-var SearchBox = require('../SearchBox.js');
-var TreeSelection = require('../TreeSelection.js');
+var DropDownSelection = require('../DropDownSelection.js');
+var ChainedDropdownSelection = require('../ChainedDropdownSelection.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -25,71 +20,18 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var option2value = function (item) { return item.name; };
 var ConditionField = /** @class */ (function (_super) {
     tslib.__extends(ConditionField, _super);
-    function ConditionField(props) {
-        var _this = _super.call(this, props) || this;
-        _this.state = {
-            searchText: ''
-        };
-        _this.onSearch = _this.onSearch.bind(_this);
-        _this.filterOptions = _this.filterOptions.bind(_this);
-        return _this;
+    function ConditionField() {
+        return _super !== null && _super.apply(this, arguments) || this;
     }
-    ConditionField.prototype.onSearch = function (text) {
-        var txt = text.toLowerCase();
-        this.setState({ searchText: txt });
-    };
-    ConditionField.prototype.filterOptions = function (options) {
-        var txt = this.state.searchText;
-        if (!txt) {
-            return this.props.options;
-        }
-        return options
-            .map(function (item) {
-            if (item.children) {
-                var children = item.children.filter(function (child) {
-                    return (child.name.toLowerCase().includes(txt) ||
-                        child.label.toLowerCase().includes(txt));
-                });
-                return children.length > 0
-                    ? Object.assign({}, item, { children: children }) // 需要copy一份，防止覆盖原始数据
-                    : false;
-            }
-            else {
-                return item.name.toLowerCase().includes(txt) ||
-                    item.label.toLowerCase().includes(txt)
-                    ? item
-                    : false;
-            }
-        })
-            .filter(function (item) {
-            return !!item;
-        });
-    };
-    // 选了值，还原options
-    ConditionField.prototype.onPopClose = function (onClose) {
-        this.setState({ searchText: '' });
-        onClose();
-    };
     ConditionField.prototype.render = function () {
-        var _this = this;
-        var _a = this.props, options = _a.options, onChange = _a.onChange, value = _a.value, cx = _a.classnames, fieldClassName = _a.fieldClassName, disabled = _a.disabled, __ = _a.translate, searchable = _a.searchable, popOverContainer = _a.popOverContainer, _b = _a.selectMode, selectMode = _b === void 0 ? 'list' : _b, loadingConfig = _a.loadingConfig;
-        return (React__default["default"].createElement(PopOverContainer.PopOverContainer, { popOverContainer: popOverContainer || (function () { return ReactDOM.findDOMNode(_this); }), popOverRender: function (_a) {
-                var onClose = _a.onClose;
-                return (React__default["default"].createElement(React__default["default"].Fragment, null,
-                    searchable ? (React__default["default"].createElement(SearchBox["default"], { mini: false, onSearch: _this.onSearch })) : null,
-                    selectMode === 'tree' ? (React__default["default"].createElement(TreeSelection["default"], { className: 'is-scrollable', multiple: false, options: _this.filterOptions(_this.props.options), value: value, loadingConfig: loadingConfig, onChange: function (value) {
-                            _this.onPopClose(onClose);
-                            onChange(value.name);
-                        } })) : (React__default["default"].createElement(GroupedSelection["default"], { multiple: false, onClick: function () { return _this.onPopClose(onClose); }, options: _this.filterOptions(_this.props.options), value: [value], option2value: option2value, onChange: function (value) {
-                            return onChange(Array.isArray(value) ? value[0] : value);
-                        } }))));
-            } }, function (_a) {
-            var onClick = _a.onClick, ref = _a.ref, isOpened = _a.isOpened;
-            return (React__default["default"].createElement("div", { className: cx('CBGroup-field') },
-                React__default["default"].createElement(ResultBox["default"], { className: cx('CBGroup-fieldInput', fieldClassName, isOpened ? 'is-active' : ''), ref: ref, allowInput: false, result: value ? amisCore.findTree(options, function (item) { return item.name === value; }) : '', onResultChange: amisCore.noop, onResultClick: onClick, placeholder: __('Condition.field_placeholder'), disabled: disabled },
-                    React__default["default"].createElement("span", { className: cx('CBGroup-fieldCaret') },
-                        React__default["default"].createElement(icons.Icon, { icon: "caret", className: "icon" })))));
-        }));
+        var _a = this.props, onChange = _a.onChange, value = _a.value, cx = _a.classnames, disabled = _a.disabled, translate = _a.translate, searchable = _a.searchable, _b = _a.selectMode, selectMode = _b === void 0 ? 'list' : _b, options = _a.options, loadingConfig = _a.loadingConfig;
+        return selectMode === 'chained' ? (React__default["default"].createElement(ChainedDropdownSelection["default"], { multiple: false, classnames: cx, translate: translate, options: options, value: value, valueField: "name", option2value: option2value, searchable: searchable, disabled: disabled, onChange: function (value) {
+                onChange(Array.isArray(value) ? value[0] : value);
+            } })) : selectMode === 'tree' ? (React__default["default"].createElement(DropDownSelection["default"], { className: 'is-scrollable', classnames: cx, translate: translate, multiple: false, option2value: option2value, searchable: searchable, disabled: disabled, valueField: 'name', mode: 'tree', options: options, value: value, loadingConfig: loadingConfig, onChange: function (value) {
+                onChange(value);
+            } })) : (React__default["default"].createElement(DropDownSelection["default"], { classnames: cx, translate: translate, options: options, value: value, valueField: 'name', option2value: option2value, searchable: searchable, disabled: disabled, onChange: function (value) {
+                return onChange(Array.isArray(value) ? value[0] : value);
+            } }));
     };
     return ConditionField;
 }(React__default["default"].Component));

package/lib/components/condition-builder/Formula.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 
@@ -24,7 +24,7 @@ var Formula = /** @class */ (function (_super) {
     Formula.prototype.render = function () {
         var _a = this.props, cx = _a.classnames, value = _a.value, onChange = _a.onChange, disabled = _a.disabled, __ = _a.translate;
         return (React__default["default"].createElement("div", { className: cx('CBFormula') },
-            React__default["default"].createElement(InputBox["default"], { disabled: disabled, value: value, onChange: onChange, placeholder: __('Condition.formula_placeholder'), prefix: React__default["default"].createElement("span", { className: cx('CBFormula-label') }, __('Condition.expression')) })));
+            React__default["default"].createElement(InputBox["default"], { disabled: disabled, value: value, onChange: onChange, placeholder: __('Condition.formula_placeholder'), prefix: React__default["default"].createElement("span", { className: cx('CBFormula-label') }, __('Condition.expression')), useMobileUI: true })));
     };
     return Formula;
 }(React__default["default"].Component));

package/lib/components/condition-builder/Func.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 
@@ -60,7 +60,7 @@ var ConditionFunc = /** @class */ (function (_super) {
                 return (React__default["default"].createElement("div", { className: cx('CBFunc-select') },
                     React__default["default"].createElement(ResultBox["default"], { className: cx('CBGroup-fieldInput', fieldClassName, isOpened ? 'is-active' : ''), ref: ref, allowInput: false, result: func, onResultChange: amisCore.noop, onResultClick: onClick, placeholder: __('Condition.field_placeholder'), disabled: disabled },
                         React__default["default"].createElement("span", { className: cx('CBGroup-fieldCaret') },
-                            React__default["default"].createElement(icons.Icon, { icon: "caret", className: "icon" })))));
+                            React__default["default"].createElement(icons.Icon, { icon: "right-arrow-bold", className: "icon" })))));
             }),
             func ? (this.renderFunc(func)) : (React__default["default"].createElement("span", { className: cx('CBFunc-error') }, __('Condition.fun_error')))));
     };

package/lib/components/condition-builder/Group.d.ts

@@ -27,8 +27,17 @@ export interface ConditionGroupProps extends ThemeProps, LocaleProps {
     formula?: FormulaPickerProps;
     popOverContainer?: any;
     renderEtrValue?: any;
-    selectMode?: 'list' | 'tree';
+    selectMode?: 'list' | 'tree' | 'chained';
     isCollapsed?: boolean;
+    depth: number;
+    isAddBtnVisibleOn?: (param: {
+        depth: number;
+        breadth: number;
+    }) => boolean;
+    isAddGroupBtnVisibleOn?: (param: {
+        depth: number;
+        breadth: number;
+    }) => boolean;
 }
 export declare class ConditionGroup extends React.Component<ConditionGroupProps, ConditionGroupState> {
     constructor(props: ConditionGroupProps);

package/lib/components/condition-builder/Group.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 
@@ -107,13 +107,17 @@ var ConditionGroup = /** @class */ (function (_super) {
     };
     ConditionGroup.prototype.render = function () {
         var _this = this;
-        var _a = this.props, builderMode = _a.builderMode, cx = _a.classnames, fieldClassName = _a.fieldClassName, value = _a.value, data = _a.data, fields = _a.fields, funcs = _a.funcs, config = _a.config, removeable = _a.removeable, onRemove = _a.onRemove, onDragStart = _a.onDragStart, showNot = _a.showNot, _b = _a.showANDOR, showANDOR = _b === void 0 ? false : _b, disabled = _a.disabled, searchable = _a.searchable, __ = _a.translate, formula = _a.formula, popOverContainer = _a.popOverContainer, selectMode = _a.selectMode, renderEtrValue = _a.renderEtrValue, draggable = _a.draggable;
+        var _a, _b, _c;
+        var _d = this.props, builderMode = _d.builderMode, cx = _d.classnames, fieldClassName = _d.fieldClassName, value = _d.value, data = _d.data, fields = _d.fields, funcs = _d.funcs, config = _d.config, removeable = _d.removeable, onRemove = _d.onRemove, onDragStart = _d.onDragStart, showNot = _d.showNot, _e = _d.showANDOR, showANDOR = _e === void 0 ? false : _e, disabled = _d.disabled, searchable = _d.searchable, __ = _d.translate, formula = _d.formula, popOverContainer = _d.popOverContainer, selectMode = _d.selectMode, renderEtrValue = _d.renderEtrValue, draggable = _d.draggable, depth = _d.depth, isAddBtnVisibleOn = _d.isAddBtnVisibleOn, isAddGroupBtnVisibleOn = _d.isAddGroupBtnVisibleOn;
         var isCollapsed = this.state.isCollapsed;
         var body = Array.isArray(value === null || value === void 0 ? void 0 : value.children) && value.children.length
             ? isCollapsed
                 ? value.children.slice(0, 1)
                 : value.children
             : null;
+        var param = { depth: depth, breadth: (_a = body === null || body === void 0 ? void 0 : body.length) !== null && _a !== void 0 ? _a : 0 };
+        var addConditionVisibleBool = (_b = isAddBtnVisibleOn === null || isAddBtnVisibleOn === void 0 ? void 0 : isAddBtnVisibleOn(param)) !== null && _b !== void 0 ? _b : true;
+        var addConditionGroupVisibleBool = (_c = isAddGroupBtnVisibleOn === null || isAddGroupBtnVisibleOn === void 0 ? void 0 : isAddGroupBtnVisibleOn(param)) !== null && _c !== void 0 ? _c : true;
         return (React__default["default"].createElement("div", { className: cx('CBGroup'), "data-group-id": value === null || value === void 0 ? void 0 : value.id },
             builderMode === 'simple' && showANDOR === false ? null : (React__default["default"].createElement("div", { className: cx('CBGroup-toolbarCondition'), draggable: draggable, onDragStart: onDragStart },
                 Array.isArray(value === null || value === void 0 ? void 0 : value.children) && value.children.length > 1 ? (React__default["default"].createElement("div", { className: cx('CBGroup-toolbarCondition-arrow', {
@@ -133,7 +137,7 @@ var ConditionGroup = /** @class */ (function (_super) {
                     ], value: (value === null || value === void 0 ? void 0 : value.conjunction) || 'and', disabled: disabled, onChange: this.handleConjunctionChange, clearable: false }))),
             React__default["default"].createElement("div", { className: cx('CBGroup-body-wrapper') },
                 React__default["default"].createElement("div", { className: cx('CBGroup-body') },
-                    body ? (body.map(function (item, index) { return (React__default["default"].createElement(GroupOrItem["default"], { draggable: value.children.length > 1, onDragStart: onDragStart, config: config, key: item.id, fields: fields, fieldClassName: fieldClassName, value: item, index: index, onChange: _this.handleItemChange, funcs: funcs, onRemove: _this.handleItemRemove, data: data, disabled: disabled, searchable: searchable, builderMode: builderMode, formula: formula, popOverContainer: popOverContainer, renderEtrValue: renderEtrValue, selectMode: selectMode, isCollapsed: isCollapsed })); })) : (React__default["default"].createElement("div", { className: cx("CBGroup-placeholder ".concat(builderMode === 'simple' ? 'simple' : '')) }, __('Condition.blank'))),
+                    body ? (body.map(function (item, index) { return (React__default["default"].createElement(GroupOrItem["default"], { draggable: draggable && value.children.length > 1, onDragStart: onDragStart, config: config, key: item.id, fields: fields, fieldClassName: fieldClassName, value: item, index: index, onChange: _this.handleItemChange, funcs: funcs, onRemove: _this.handleItemRemove, data: data, disabled: disabled, searchable: searchable, builderMode: builderMode, formula: formula, popOverContainer: popOverContainer, renderEtrValue: renderEtrValue, selectMode: selectMode, isCollapsed: isCollapsed, depth: depth, isAddBtnVisibleOn: isAddBtnVisibleOn, isAddGroupBtnVisibleOn: isAddGroupBtnVisibleOn })); })) : (React__default["default"].createElement("div", { className: cx("CBGroup-placeholder ".concat(builderMode === 'simple' ? 'simple' : '')) }, __('Condition.blank'))),
                     isCollapsed ? (React__default["default"].createElement("div", { className: cx('CBGroup-body-collapse') },
                         React__default["default"].createElement("span", { onClick: this.toggleCollapse },
                             __('Condition.collapse'),
@@ -142,8 +146,8 @@ var ConditionGroup = /** @class */ (function (_super) {
                 isCollapsed ? null : (React__default["default"].createElement("div", { className: cx('CBGroup-toolbar'), draggable: draggable, onDragStart: onDragStart },
                     React__default["default"].createElement("div", { className: cx("CBGroup-toolbarConditionAdd".concat(builderMode === 'simple' ? '-simple' : '')) },
                         React__default["default"].createElement("div", { className: cx('ButtonGroup') },
-                            React__default["default"].createElement(Button["default"], { level: "link", onClick: this.handleAdd, size: "xs", disabled: disabled }, __('Condition.add_cond')),
-                            builderMode === 'simple' ? null : (React__default["default"].createElement(Button["default"], { onClick: this.handleAddGroup, size: "xs", disabled: disabled, level: "link" }, __('Condition.add_cond_group'))),
+                            addConditionVisibleBool ? (React__default["default"].createElement(Button["default"], { level: "link", onClick: this.handleAdd, size: "xs", disabled: disabled }, __('Condition.add_cond'))) : null,
+                            addConditionGroupVisibleBool && builderMode !== 'simple' ? (React__default["default"].createElement(Button["default"], { onClick: this.handleAddGroup, size: "xs", disabled: disabled, level: "link" }, __('Condition.add_cond_group'))) : null,
                             removeable ? (React__default["default"].createElement(Button["default"], { onClick: onRemove, size: "xs", disabled: disabled, level: "link" }, __('Condition.delete_cond_group'))) : null)))))));
     };
     tslib.__decorate([

package/lib/components/condition-builder/GroupOrItem.d.ts

@@ -24,8 +24,17 @@ export interface CBGroupOrItemProps extends ThemeProps {
     formula?: FormulaPickerProps;
     popOverContainer?: any;
     renderEtrValue?: any;
-    selectMode?: 'list' | 'tree';
+    selectMode?: 'list' | 'tree' | 'chained';
     isCollapsed?: boolean;
+    depth: number;
+    isAddBtnVisibleOn?: (param: {
+        depth: number;
+        breadth: number;
+    }) => boolean;
+    isAddGroupBtnVisibleOn?: (param: {
+        depth: number;
+        breadth: number;
+    }) => boolean;
 }
 export declare class CBGroupOrItem extends React.Component<CBGroupOrItemProps> {
     state: {

package/lib/components/condition-builder/GroupOrItem.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 
@@ -36,6 +36,9 @@ var CBGroupOrItem = /** @class */ (function (_super) {
         (_b = (_a = this.props).onRemove) === null || _b === void 0 ? void 0 : _b.call(_a, this.props.index);
     };
     CBGroupOrItem.prototype.handlerHoverIn = function (e) {
+        if (amisCore.isMobile()) {
+            return;
+        }
         e.stopPropagation();
         this.setState({
             hover: true
@@ -47,14 +50,14 @@ var CBGroupOrItem = /** @class */ (function (_super) {
         });
     };
     CBGroupOrItem.prototype.render = function () {
-        var _a = this.props, builderMode = _a.builderMode, cx = _a.classnames, fieldClassName = _a.fieldClassName, value = _a.value, config = _a.config, fields = _a.fields, funcs = _a.funcs, draggable = _a.draggable, data = _a.data, disabled = _a.disabled, searchable = _a.searchable, onDragStart = _a.onDragStart, formula = _a.formula, popOverContainer = _a.popOverContainer, selectMode = _a.selectMode, renderEtrValue = _a.renderEtrValue, isCollapsed = _a.isCollapsed;
-        return (React__default["default"].createElement("div", { className: cx("CBGroupOrItem".concat(builderMode === 'simple' ? '-simple' : '')), "data-id": value === null || value === void 0 ? void 0 : value.id },
+        var _a = this.props, builderMode = _a.builderMode, cx = _a.classnames, fieldClassName = _a.fieldClassName, value = _a.value, config = _a.config, fields = _a.fields, funcs = _a.funcs, draggable = _a.draggable, data = _a.data, disabled = _a.disabled, searchable = _a.searchable, onDragStart = _a.onDragStart, formula = _a.formula, popOverContainer = _a.popOverContainer, selectMode = _a.selectMode, renderEtrValue = _a.renderEtrValue, isCollapsed = _a.isCollapsed, depth = _a.depth, isAddBtnVisibleOn = _a.isAddBtnVisibleOn, isAddGroupBtnVisibleOn = _a.isAddGroupBtnVisibleOn;
+        return (React__default["default"].createElement("div", { className: cx("CBGroupOrItem".concat(builderMode === 'simple' ? '-simple' : ''), { 'is-mobile': amisCore.isMobile() }), "data-id": value === null || value === void 0 ? void 0 : value.id },
             React__default["default"].createElement("div", { className: cx('CBGroupOrItem-body') }, (value === null || value === void 0 ? void 0 : value.conjunction) ? (React__default["default"].createElement("div", { className: cx('CBGroupOrItem-body-group', {
-                    'is-hover': this.state.hover
+                    'is-hover': this.state.hover || amisCore.isMobile()
                 }), onMouseOver: this.handlerHoverIn, onMouseOut: this.handlerHoverOut },
                 draggable && !disabled ? (React__default["default"].createElement("a", { draggable: true, onDragStart: onDragStart, className: cx('CBGroupOrItem-dragbar') },
                     React__default["default"].createElement(icons.Icon, { icon: "drag-bar", className: "icon" }))) : null,
-                React__default["default"].createElement(Group["default"], { isCollapsed: isCollapsed, draggable: draggable, disabled: disabled, searchable: searchable, onDragStart: onDragStart, config: config, fields: fields, value: value, onChange: this.handleItemChange, fieldClassName: fieldClassName, funcs: funcs, removeable: true, onRemove: this.handleItemRemove, data: data, renderEtrValue: renderEtrValue }))) : (React__default["default"].createElement("div", { className: cx('CBGroupOrItem-body-item') },
+                React__default["default"].createElement(Group["default"], { isCollapsed: isCollapsed, draggable: draggable, disabled: disabled, searchable: searchable, selectMode: selectMode, onDragStart: onDragStart, config: config, fields: fields, value: value, onChange: this.handleItemChange, fieldClassName: fieldClassName, funcs: funcs, removeable: true, onRemove: this.handleItemRemove, data: data, renderEtrValue: renderEtrValue, depth: depth + 1, isAddBtnVisibleOn: isAddBtnVisibleOn, isAddGroupBtnVisibleOn: isAddGroupBtnVisibleOn }))) : (React__default["default"].createElement("div", { className: cx('CBGroupOrItem-body-item') },
                 draggable && !disabled ? (React__default["default"].createElement("a", { draggable: true, onDragStart: onDragStart, className: cx('CBGroupOrItem-dragbar') },
                     React__default["default"].createElement(icons.Icon, { icon: "drag-bar", className: "icon" }))) : null,
                 React__default["default"].createElement(Item["default"], { disabled: disabled, searchable: searchable, config: config, fields: fields, value: value, onChange: this.handleItemChange, fieldClassName: fieldClassName, funcs: funcs, data: data, formula: formula, popOverContainer: popOverContainer, renderEtrValue: renderEtrValue, selectMode: selectMode }),

package/lib/components/condition-builder/InputSwitch.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 

package/lib/components/condition-builder/Item.d.ts

@@ -19,7 +19,7 @@ export interface ConditionItemProps extends ThemeProps, LocaleProps {
     formula?: FormulaPickerProps;
     popOverContainer?: any;
     renderEtrValue?: any;
-    selectMode?: 'list' | 'tree';
+    selectMode?: 'list' | 'tree' | 'chained';
 }
 export declare class ConditionItem extends React.Component<ConditionItemProps> {
     handleLeftFieldSelect(field: any): void;

package/lib/components/condition-builder/Item.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 
@@ -114,7 +114,7 @@ var ConditionItem = /** @class */ (function (_super) {
                     return operator;
                 }
             });
-            return (React__default["default"].createElement(PopOverContainer.PopOverContainer, { popOverContainer: popOverContainer || (function () { return ReactDOM.findDOMNode(_this); }), popOverRender: function (_a) {
+            return (React__default["default"].createElement(PopOverContainer.PopOverContainer, { useMobileUI: true, popOverContainer: popOverContainer || (function () { return ReactDOM.findDOMNode(_this); }), popOverRender: function (_a) {
                     var onClose = _a.onClose;
                     return (React__default["default"].createElement(GroupedSelection["default"], { onClick: onClose, option2value: option2value, onChange: _this.handleOperatorChange, options: options_1, value: value.op, multiple: false }));
                 } }, function (_a) {
@@ -122,9 +122,8 @@ var ConditionItem = /** @class */ (function (_super) {
                 var onClick = _a.onClick, isOpened = _a.isOpened, ref = _a.ref;
                 return (React__default["default"].createElement("div", { className: cx('CBGroup-operator') },
                     React__default["default"].createElement(ResultBox["default"], { className: cx('CBGroup-operatorInput', isOpened ? 'is-active' : ''), ref: ref, allowInput: false, result: __1(config.OperationMap[value === null || value === void 0 ? void 0 : value.op]) ||
-                            ((_b = options_1.find(function (option) { return option.value === value.op; })) === null || _b === void 0 ? void 0 : _b.label), onResultChange: amisCore.noop, onResultClick: onClick, disabled: disabled, placeholder: __1('Condition.cond_placeholder') },
-                        React__default["default"].createElement("span", { className: cx('CBGroup-operatorCaret') },
-                            React__default["default"].createElement(icons.Icon, { icon: "caret", className: "icon" })))));
+                            ((_b = options_1.find(function (option) { return option.value === value.op; })) === null || _b === void 0 ? void 0 : _b.label), onResultChange: amisCore.noop, onResultClick: onClick, disabled: disabled, placeholder: __1('Condition.cond_placeholder'), useMobileUI: true }, !amisCore.isMobile() ? (React__default["default"].createElement("span", { className: cx('CBGroup-operatorCaret') },
+                        React__default["default"].createElement(icons.Icon, { icon: "right-arrow-bold", className: "icon" }))) : null)));
             }));
         }
         return null;

package/lib/components/condition-builder/Value.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 
@@ -43,23 +43,23 @@ var Value = /** @class */ (function (_super) {
             input = React__default["default"].createElement(Picker.FormulaPicker, tslib.__assign({}, formula));
         }
         else if (field.type === 'text') {
-            input = (React__default["default"].createElement(InputBox["default"], { value: value !== null && value !== void 0 ? value : field.defaultValue, onChange: onChange, placeholder: __(field.placeholder), disabled: disabled }));
+            input = (React__default["default"].createElement(InputBox["default"], { value: value !== null && value !== void 0 ? value : field.defaultValue, onChange: onChange, placeholder: __(field.placeholder), disabled: disabled, useMobileUI: true }));
         }
         else if (field.type === 'number') {
-            input = (React__default["default"].createElement(NumberInput["default"], { placeholder: __(field.placeholder) || __('NumberInput.placeholder'), step: field.step, min: field.minimum, max: field.maximum, precision: field.precision, value: value !== null && value !== void 0 ? value : field.defaultValue, onChange: onChange, disabled: disabled }));
+            input = (React__default["default"].createElement(NumberInput["default"], { placeholder: __(field.placeholder) || __('NumberInput.placeholder'), step: field.step, min: field.minimum, max: field.maximum, precision: field.precision, value: value !== null && value !== void 0 ? value : field.defaultValue, onChange: onChange, disabled: disabled, useMobileUI: true }));
         }
         else if (field.type === 'date') {
-            input = (React__default["default"].createElement(DatePicker["default"], { placeholder: __(field.placeholder) || __('Date.placeholder'), format: field.format || 'YYYY-MM-DD', inputFormat: field.inputFormat || 'YYYY-MM-DD', value: value !== null && value !== void 0 ? value : field.defaultValue, onChange: onChange, timeFormat: "", disabled: disabled, popOverContainer: popOverContainer }));
+            input = (React__default["default"].createElement(DatePicker["default"], { placeholder: __(field.placeholder) || __('Date.placeholder'), format: field.format || 'YYYY-MM-DD', inputFormat: field.inputFormat || 'YYYY-MM-DD', value: value !== null && value !== void 0 ? value : field.defaultValue, onChange: onChange, timeFormat: "", disabled: disabled, popOverContainer: popOverContainer, useMobileUI: true }));
         }
         else if (field.type === 'time') {
-            input = (React__default["default"].createElement(DatePicker["default"], { viewMode: "time", placeholder: __(field.placeholder) || __('Time.placeholder'), format: field.format || 'HH:mm', inputFormat: field.inputFormat || 'HH:mm', value: value !== null && value !== void 0 ? value : field.defaultValue, onChange: onChange, dateFormat: "", timeFormat: field.format || 'HH:mm', disabled: disabled, popOverContainer: popOverContainer }));
+            input = (React__default["default"].createElement(DatePicker["default"], { viewMode: "time", placeholder: __(field.placeholder) || __('Time.placeholder'), format: field.format || 'HH:mm', inputFormat: field.inputFormat || 'HH:mm', value: value !== null && value !== void 0 ? value : field.defaultValue, onChange: onChange, dateFormat: "", timeFormat: field.format || 'HH:mm', disabled: disabled, popOverContainer: popOverContainer, useMobileUI: true }));
         }
         else if (field.type === 'datetime') {
-            input = (React__default["default"].createElement(DatePicker["default"], { placeholder: __(field.placeholder) || 'Time.placeholder', format: field.format || '', inputFormat: field.inputFormat || 'YYYY-MM-DD HH:mm', value: value !== null && value !== void 0 ? value : field.defaultValue, onChange: onChange, timeFormat: field.timeFormat || 'HH:mm', disabled: disabled, popOverContainer: popOverContainer }));
+            input = (React__default["default"].createElement(DatePicker["default"], { placeholder: __(field.placeholder) || 'Time.placeholder', format: field.format || '', inputFormat: field.inputFormat || 'YYYY-MM-DD HH:mm', value: value !== null && value !== void 0 ? value : field.defaultValue, onChange: onChange, timeFormat: field.timeFormat || 'HH:mm', disabled: disabled, popOverContainer: popOverContainer, useMobileUI: true }));
         }
         else if (field.type === 'select') {
             var autoComplete = field.autoComplete;
-            input = (React__default["default"].createElement(Select.SelectWithRemoteOptions, { simpleValue: true, options: field.options, placeholder: __(field.placeholder) || 'Select.placeholder', source: field.source, autoComplete: autoComplete, searchable: field.searchable, value: (_a = value !== null && value !== void 0 ? value : field.defaultValue) !== null && _a !== void 0 ? _a : '', data: data, onChange: onChange, multiple: op === 'select_any_in' || op === 'select_not_any_in', disabled: disabled, popOverContainer: popOverContainer }));
+            input = (React__default["default"].createElement(Select.SelectWithRemoteOptions, { simpleValue: true, options: field.options, placeholder: __(field.placeholder) || 'Select.placeholder', source: field.source, autoComplete: autoComplete, searchable: field.searchable, value: (_a = value !== null && value !== void 0 ? value : field.defaultValue) !== null && _a !== void 0 ? _a : '', data: data, onChange: onChange, multiple: op === 'select_any_in' || op === 'select_not_any_in', disabled: disabled, popOverContainer: popOverContainer, useMobileUI: true }));
         }
         else if (field.type === 'boolean') {
             input = (React__default["default"].createElement(Switch["default"], { value: value !== null && value !== void 0 ? value : field.defaultValue, onChange: onChange, disabled: disabled }));

package/lib/components/condition-builder/config.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 

package/lib/components/condition-builder/index.d.ts

@@ -20,12 +20,21 @@ export interface ConditionBuilderProps extends ThemeProps, LocaleProps {
     onChange: (value?: ConditionGroupValue) => void;
     config?: ConditionBuilderConfig;
     disabled?: boolean;
+    draggable?: boolean;
     searchable?: boolean;
     fieldClassName?: string;
     formula?: FormulaPickerProps;
     popOverContainer?: any;
     renderEtrValue?: any;
-    selectMode?: 'list' | 'tree';
+    selectMode?: 'list' | 'tree' | 'chained';
+    isAddBtnVisibleOn?: (param: {
+        depth: number;
+        breadth: number;
+    }) => boolean;
+    isAddGroupBtnVisibleOn?: (param: {
+        depth: number;
+        breadth: number;
+    }) => boolean;
 }
 export interface ConditionBuilderState {
     tmpValue: ConditionGroupValue;