amis-ui 3.1.0 → 3.2.0

package/esm/components/ChainedDropdownSelection.js

@@ -0,0 +1,104 @@
+/**
+ * amis-ui v3.2.0
+ * Copyright 2018-2023 fex
+ */
+
+import { __extends, __assign, __decorate, __metadata, __spreadArray, __read } from 'tslib';
+import React__default from 'react';
+import omit from 'lodash/omit';
+import { autobind, themeable, localeable, uncontrollable } from 'amis-core';
+import { BaseSelection } from './Selection.js';
+import DropDownSelection from './DropDownSelection.js';
+
+var ChainedDropdownSelection = /** @class */ (function (_super) {
+    __extends(ChainedDropdownSelection, _super);
+    function ChainedDropdownSelection(props) {
+        var _this = _super.call(this, props) || this;
+        _this.state = _this.computed(props.value, props.options);
+        return _this;
+    }
+    ChainedDropdownSelection.prototype.componentDidUpdate = function (prevProps) {
+        var _a = this.props, options = _a.options, value = _a.value;
+        if (options !== prevProps.options || prevProps.value !== value) {
+            this.setState(this.computed(value, options));
+        }
+    };
+    ChainedDropdownSelection.prototype.computed = function (value, options) {
+        var valueField = this.props.valueField;
+        var values = [];
+        var getValues = function (opts, arr) {
+            if (arr === void 0) { arr = []; }
+            opts.forEach(function (item) {
+                var _a;
+                var cValue = valueField ? item[valueField] : (_a = item === null || item === void 0 ? void 0 : item.value) !== null && _a !== void 0 ? _a : '';
+                if (cValue === value) {
+                    values = __spreadArray(__spreadArray([], __read(arr), false), [cValue], false);
+                }
+                else if (item.children) {
+                    getValues(item.children, __spreadArray(__spreadArray([], __read(arr), false), [cValue], false));
+                }
+            });
+        };
+        getValues(options);
+        return {
+            values: values,
+            stacks: this.computedStask(values)
+        };
+    };
+    ChainedDropdownSelection.prototype.getFlatOptions = function (options) {
+        return options.map(function (item) { return omit(item, 'children'); });
+    };
+    ChainedDropdownSelection.prototype.handleSelect = function (index, value) {
+        var _this = this;
+        // 当前层级点击时，需要重新设置下values的值，以及重新计算stacks列表
+        var values = this.state.values;
+        values.splice(index, values.length - index);
+        value && values.push(value);
+        var stacks = this.computedStask(values);
+        this.setState({
+            stacks: stacks,
+            values: values
+        }, function () {
+            var _a, _b;
+            (_b = (_a = _this.props) === null || _a === void 0 ? void 0 : _a.onChange) === null || _b === void 0 ? void 0 : _b.call(_a, value);
+        });
+    };
+    // 根据树结构层级，寻找最后一层
+    ChainedDropdownSelection.prototype.computedStask = function (values) {
+        var _this = this;
+        var _a = this.props, options = _a.options, valueField = _a.valueField;
+        var getDeep = function (opts, index, tems) {
+            tems.push(_this.getFlatOptions(opts));
+            opts.forEach(function (op) {
+                var _a;
+                var cValue = valueField ? op[valueField] : (_a = op === null || op === void 0 ? void 0 : op.value) !== null && _a !== void 0 ? _a : '';
+                if (cValue === values[index] &&
+                    op.children &&
+                    values.length - 1 >= index) {
+                    getDeep(op.children, index + 1, tems);
+                }
+            });
+            return tems;
+        };
+        return getDeep(options, 0, []);
+    };
+    ChainedDropdownSelection.prototype.render = function () {
+        var _this = this;
+        var _a = this.state, stacks = _a.stacks, values = _a.values;
+        var _b = this.props, className = _b.className, cx = _b.classnames;
+        return (React__default.createElement("div", { className: cx('ChainedDropdownSelection', className) }, stacks.map(function (item, index) { return (React__default.createElement("div", { className: cx('ChainedDropdownSelection-item'), key: index },
+            React__default.createElement(DropDownSelection, __assign({}, _this.props, { value: values[index], options: item, onChange: function (value) { return _this.handleSelect(index, value); } })))); })));
+    };
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Number, String]),
+        __metadata("design:returntype", void 0)
+    ], ChainedDropdownSelection.prototype, "handleSelect", null);
+    return ChainedDropdownSelection;
+}(BaseSelection));
+var ChainedDropdownSelection$1 = themeable(localeable(uncontrollable(ChainedDropdownSelection, {
+    value: 'onChange'
+})));
+
+export { ChainedDropdownSelection, ChainedDropdownSelection$1 as default };

package/esm/components/ChainedSelection.js

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

package/esm/components/Checkbox.d.ts

@@ -26,6 +26,7 @@ interface CheckboxProps {
     partial?: boolean;
     optionType?: 'default' | 'button';
     children?: React.ReactNode | Array<React.ReactNode>;
+    useMobileUI?: boolean;
 }
 export declare class Checkbox extends React.Component<CheckboxProps, any> {
     static defaultProps: Pick<CheckboxProps, 'trueValue' | 'falseValue' | 'type'>;
@@ -33,7 +34,7 @@ export declare class Checkbox extends React.Component<CheckboxProps, any> {
     render(): React.JSX.Element;
 }
 declare const _default: {
-    new (props: Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType"> & {
+    new (props: Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType" | "useMobileUI"> & {
         type?: "checkbox" | "radio" | undefined;
         trueValue?: string | number | boolean | undefined;
         falseValue?: string | number | boolean | undefined;
@@ -43,13 +44,13 @@ declare const _default: {
         getWrappedInstance(): any;
         render(): React.JSX.Element;
         context: unknown;
-        setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType"> & {
+        setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType" | "useMobileUI"> & {
             type?: "checkbox" | "radio" | undefined;
             trueValue?: string | number | boolean | undefined;
             falseValue?: string | number | boolean | undefined;
         } & {} & import("packages/amis-core/lib/theme").ThemeOutterProps>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType"> & {
+        readonly props: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType" | "useMobileUI"> & {
             type?: "checkbox" | "radio" | undefined;
             trueValue?: string | number | boolean | undefined;
             falseValue?: string | number | boolean | undefined;
@@ -59,41 +60,41 @@ declare const _default: {
             [key: string]: React.ReactInstance;
         };
         componentDidMount?(): void;
-        shouldComponentUpdate?(nextProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType"> & {
+        shouldComponentUpdate?(nextProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType" | "useMobileUI"> & {
             type?: "checkbox" | "radio" | undefined;
             trueValue?: string | number | boolean | undefined;
             falseValue?: string | number | boolean | undefined;
         } & {} & import("packages/amis-core/lib/theme").ThemeOutterProps>, nextState: Readonly<{}>, nextContext: any): boolean;
         componentWillUnmount?(): void;
         componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
-        getSnapshotBeforeUpdate?(prevProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType"> & {
+        getSnapshotBeforeUpdate?(prevProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType" | "useMobileUI"> & {
             type?: "checkbox" | "radio" | undefined;
             trueValue?: string | number | boolean | undefined;
             falseValue?: string | number | boolean | undefined;
         } & {} & import("packages/amis-core/lib/theme").ThemeOutterProps>, prevState: Readonly<{}>): any;
-        componentDidUpdate?(prevProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType"> & {
+        componentDidUpdate?(prevProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType" | "useMobileUI"> & {
             type?: "checkbox" | "radio" | undefined;
             trueValue?: string | number | boolean | undefined;
             falseValue?: string | number | boolean | undefined;
         } & {} & import("packages/amis-core/lib/theme").ThemeOutterProps>, prevState: Readonly<{}>, snapshot?: any): void;
         componentWillMount?(): void;
         UNSAFE_componentWillMount?(): void;
-        componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType"> & {
+        componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType" | "useMobileUI"> & {
             type?: "checkbox" | "radio" | undefined;
             trueValue?: string | number | boolean | undefined;
             falseValue?: string | number | boolean | undefined;
         } & {} & import("packages/amis-core/lib/theme").ThemeOutterProps>, nextContext: any): void;
-        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType"> & {
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType" | "useMobileUI"> & {
             type?: "checkbox" | "radio" | undefined;
             trueValue?: string | number | boolean | undefined;
             falseValue?: string | number | boolean | undefined;
         } & {} & import("packages/amis-core/lib/theme").ThemeOutterProps>, nextContext: any): void;
-        componentWillUpdate?(nextProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType"> & {
+        componentWillUpdate?(nextProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType" | "useMobileUI"> & {
             type?: "checkbox" | "radio" | undefined;
             trueValue?: string | number | boolean | undefined;
             falseValue?: string | number | boolean | undefined;
         } & {} & import("packages/amis-core/lib/theme").ThemeOutterProps>, nextState: Readonly<{}>, nextContext: any): void;
-        UNSAFE_componentWillUpdate?(nextProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType"> & {
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<Pick<Omit<CheckboxProps, keyof import("amis-core").ThemeProps>, "description" | "children" | "label" | "name" | "disabled" | "value" | "checked" | "onChange" | "size" | "inline" | "readOnly" | "labelClassName" | "partial" | "optionType" | "useMobileUI"> & {
             type?: "checkbox" | "radio" | undefined;
             trueValue?: string | number | boolean | undefined;
             falseValue?: string | number | boolean | undefined;

package/esm/components/Checkbox.js

@@ -1,11 +1,11 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 
 import { __extends, __decorate, __metadata } from 'tslib';
 import React__default from 'react';
-import { autobind, themeable } from 'amis-core';
+import { isMobile, autobind, themeable } from 'amis-core';
 
 /**
  * @file Checkbox
@@ -41,6 +41,7 @@ var Checkbox = /** @class */ (function (_super) {
                 _a['Checkbox--button--checked'] = optionType === 'button' && _checked,
                 _a['Checkbox--button--disabled--unchecked'] = optionType === 'button' && disabled && !_checked,
                 _a['Checkbox--button--disabled--checked'] = optionType === 'button' && disabled && _checked,
+                _a['is-mobile'] = isMobile(),
                 _a)), "data-role": "checkbox" },
             React__default.createElement("input", { type: type, checked: typeof checked !== 'undefined'
                     ? checked

package/esm/components/CityArea.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 
@@ -176,10 +176,10 @@ var CityArea = memo(function (props) {
     }, [values]);
     var result = (_a = confirmValues === null || confirmValues === void 0 ? void 0 : confirmValues.filter(function (item) { return item === null || item === void 0 ? void 0 : item.value; })) === null || _a === void 0 ? void 0 : _a.map(function (item) { return item.text; }).join(delimiter);
     return (React__default.createElement("div", { className: cx("CityArea"), style: style },
-        React__default.createElement(ResultBox, { className: cx('CityArea-Input', isOpened ? 'is-active' : ''), allowInput: false, result: result, onResultChange: function () { }, onResultClick: function () { return setIsOpened(!isOpened); }, placeholder: __('Condition.cond_placeholder'), useMobileUI: useMobileUI }),
+        React__default.createElement(ResultBox, { className: cx('CityArea-Input', isOpened ? 'is-active' : ''), allowInput: false, result: result, onResultChange: function () { }, onResultClick: function () { return setIsOpened(!isOpened); }, placeholder: __('Select.placeholder'), useMobileUI: useMobileUI }),
         allowStreet && values[0] ? (React__default.createElement("input", { className: cx('CityArea-Input'), value: street, onChange: function (e) {
                 return setStreet(e.currentTarget.value);
-            }, placeholder: __('City.street'), disabled: disabled })) : null,
+            }, placeholder: __('City.street'), disabled: disabled, readOnly: true })) : null,
         React__default.createElement(PopUp, { className: cx("CityArea-popup"), container: popOverContainer, isShow: isOpened, showConfirm: true, onConfirm: onConfirm, onHide: onCancel },
             React__default.createElement(Picker, { className: 'CityArea-picker', columns: state.columns, onChange: onChange, showToolbar: false, labelField: "text", itemHeight: 40, value: values, classnames: props.classnames, classPrefix: props.classPrefix }))));
 });

package/esm/components/CityDB.js

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

package/esm/components/CodeMirror.js

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

package/esm/components/Collapse.d.ts

@@ -37,6 +37,8 @@ export interface CollapseProps {
     propsUpdate?: boolean;
     partial?: boolean;
     children?: React.ReactNode | Array<React.ReactNode>;
+    useMobileUI?: boolean;
+    divideLine?: boolean;
 }
 export interface CollapseState {
     collapsed: boolean;
@@ -74,6 +76,7 @@ declare const _default: {
         showArrow?: boolean | undefined;
         bodyClassName?: string | undefined;
         partial?: boolean | undefined;
+        useMobileUI?: boolean | undefined;
         collapsed?: boolean | undefined;
         collapseId?: string | undefined;
         propKey?: string | undefined;
@@ -85,6 +88,7 @@ declare const _default: {
         onCollapse?: ((item: any, collapsed: boolean) => void) | undefined;
         headingComponent?: any;
         propsUpdate?: boolean | undefined;
+        divideLine?: boolean | undefined;
     } & {
         classPrefix?: string | undefined;
         classnames?: ClassNamesFn | undefined;
@@ -111,6 +115,7 @@ declare const _default: {
             showArrow?: boolean | undefined;
             bodyClassName?: string | undefined;
             partial?: boolean | undefined;
+            useMobileUI?: boolean | undefined;
             collapsed?: boolean | undefined;
             collapseId?: string | undefined;
             propKey?: string | undefined;
@@ -122,6 +127,7 @@ declare const _default: {
             onCollapse?: ((item: any, collapsed: boolean) => void) | undefined;
             headingComponent?: any;
             propsUpdate?: boolean | undefined;
+            divideLine?: boolean | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -144,6 +150,7 @@ declare const _default: {
             showArrow?: boolean | undefined;
             bodyClassName?: string | undefined;
             partial?: boolean | undefined;
+            useMobileUI?: boolean | undefined;
             collapsed?: boolean | undefined;
             collapseId?: string | undefined;
             propKey?: string | undefined;
@@ -155,6 +162,7 @@ declare const _default: {
             onCollapse?: ((item: any, collapsed: boolean) => void) | undefined;
             headingComponent?: any;
             propsUpdate?: boolean | undefined;
+            divideLine?: boolean | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -181,6 +189,7 @@ declare const _default: {
             showArrow?: boolean | undefined;
             bodyClassName?: string | undefined;
             partial?: boolean | undefined;
+            useMobileUI?: boolean | undefined;
             collapsed?: boolean | undefined;
             collapseId?: string | undefined;
             propKey?: string | undefined;
@@ -192,6 +201,7 @@ declare const _default: {
             onCollapse?: ((item: any, collapsed: boolean) => void) | undefined;
             headingComponent?: any;
             propsUpdate?: boolean | undefined;
+            divideLine?: boolean | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -215,6 +225,7 @@ declare const _default: {
             showArrow?: boolean | undefined;
             bodyClassName?: string | undefined;
             partial?: boolean | undefined;
+            useMobileUI?: boolean | undefined;
             collapsed?: boolean | undefined;
             collapseId?: string | undefined;
             propKey?: string | undefined;
@@ -226,6 +237,7 @@ declare const _default: {
             onCollapse?: ((item: any, collapsed: boolean) => void) | undefined;
             headingComponent?: any;
             propsUpdate?: boolean | undefined;
+            divideLine?: boolean | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -247,6 +259,7 @@ declare const _default: {
             showArrow?: boolean | undefined;
             bodyClassName?: string | undefined;
             partial?: boolean | undefined;
+            useMobileUI?: boolean | undefined;
             collapsed?: boolean | undefined;
             collapseId?: string | undefined;
             propKey?: string | undefined;
@@ -258,6 +271,7 @@ declare const _default: {
             onCollapse?: ((item: any, collapsed: boolean) => void) | undefined;
             headingComponent?: any;
             propsUpdate?: boolean | undefined;
+            divideLine?: boolean | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -281,6 +295,7 @@ declare const _default: {
             showArrow?: boolean | undefined;
             bodyClassName?: string | undefined;
             partial?: boolean | undefined;
+            useMobileUI?: boolean | undefined;
             collapsed?: boolean | undefined;
             collapseId?: string | undefined;
             propKey?: string | undefined;
@@ -292,6 +307,7 @@ declare const _default: {
             onCollapse?: ((item: any, collapsed: boolean) => void) | undefined;
             headingComponent?: any;
             propsUpdate?: boolean | undefined;
+            divideLine?: boolean | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -313,6 +329,7 @@ declare const _default: {
             showArrow?: boolean | undefined;
             bodyClassName?: string | undefined;
             partial?: boolean | undefined;
+            useMobileUI?: boolean | undefined;
             collapsed?: boolean | undefined;
             collapseId?: string | undefined;
             propKey?: string | undefined;
@@ -324,6 +341,7 @@ declare const _default: {
             onCollapse?: ((item: any, collapsed: boolean) => void) | undefined;
             headingComponent?: any;
             propsUpdate?: boolean | undefined;
+            divideLine?: boolean | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -345,6 +363,7 @@ declare const _default: {
             showArrow?: boolean | undefined;
             bodyClassName?: string | undefined;
             partial?: boolean | undefined;
+            useMobileUI?: boolean | undefined;
             collapsed?: boolean | undefined;
             collapseId?: string | undefined;
             propKey?: string | undefined;
@@ -356,6 +375,7 @@ declare const _default: {
             onCollapse?: ((item: any, collapsed: boolean) => void) | undefined;
             headingComponent?: any;
             propsUpdate?: boolean | undefined;
+            divideLine?: boolean | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -377,6 +397,7 @@ declare const _default: {
             showArrow?: boolean | undefined;
             bodyClassName?: string | undefined;
             partial?: boolean | undefined;
+            useMobileUI?: boolean | undefined;
             collapsed?: boolean | undefined;
             collapseId?: string | undefined;
             propKey?: string | undefined;
@@ -388,6 +409,7 @@ declare const _default: {
             onCollapse?: ((item: any, collapsed: boolean) => void) | undefined;
             headingComponent?: any;
             propsUpdate?: boolean | undefined;
+            divideLine?: boolean | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;

package/esm/components/Collapse.js

@@ -1,11 +1,11 @@
 /**
- * amis-ui v3.1.0
+ * amis-ui v3.2.0
  * Copyright 2018-2023 fex
  */
 
 import { __extends, __assign, __decorate, __metadata } from 'tslib';
 import React__default from 'react';
-import { isClickOnInput, autobind, themeable } from 'amis-core';
+import { isClickOnInput, isMobile, autobind, themeable } from 'amis-core';
 import Transition, { EXITED, EXITING, ENTERING } from 'react-transition-group/Transition';
 import { Icon } from './icons.js';
 
@@ -41,6 +41,7 @@ var Collapse = /** @class */ (function (_super) {
         return null;
     };
     Collapse.prototype.toggleCollapsed = function (e) {
+        var _a;
         if (isClickOnInput(e)) {
             return;
         }
@@ -48,9 +49,10 @@ var Collapse = /** @class */ (function (_super) {
         if (props.disabled || props.collapsable === false) {
             return;
         }
-        props.onCollapse && props.onCollapse(props, !this.state.collapsed);
+        var newCollapsed = !this.state.collapsed;
+        (_a = props.onCollapse) === null || _a === void 0 ? void 0 : _a.call(props, props, newCollapsed);
         this.setState({
-            collapsed: !this.state.collapsed
+            collapsed: newCollapsed
         });
     };
     Collapse.prototype.handleEnter = function (elem) {
@@ -78,12 +80,13 @@ var Collapse = /** @class */ (function (_super) {
         var _a;
         var _this = this;
         var _b;
-        var _c = this.props, cx = _c.classnames, mountOnEnter = _c.mountOnEnter, unmountOnExit = _c.unmountOnExit; _c.classPrefix; var size = _c.size, WrapperComponent = _c.wrapperComponent, HeadingComponent = _c.headingComponent, className = _c.className, style = _c.style, headingClassName = _c.headingClassName, headerPosition = _c.headerPosition, collapseHeader = _c.collapseHeader, header = _c.header, body = _c.body, bodyClassName = _c.bodyClassName, collapsable = _c.collapsable; _c.translate; var showArrow = _c.showArrow, expandIcon = _c.expandIcon, disabled = _c.disabled, children = _c.children;
+        var _c = this.props, cx = _c.classnames, mountOnEnter = _c.mountOnEnter, unmountOnExit = _c.unmountOnExit; _c.classPrefix; var size = _c.size, WrapperComponent = _c.wrapperComponent, HeadingComponent = _c.headingComponent, className = _c.className, style = _c.style, headingClassName = _c.headingClassName, headerPosition = _c.headerPosition, collapseHeader = _c.collapseHeader, header = _c.header, body = _c.body, bodyClassName = _c.bodyClassName, collapsable = _c.collapsable; _c.translate; var showArrow = _c.showArrow, expandIcon = _c.expandIcon, disabled = _c.disabled, children = _c.children, useMobileUI = _c.useMobileUI;
         var finalHeader = this.state.collapsed
             ? header
             : collapseHeader || header;
+        var mobileUI = useMobileUI && isMobile();
         var dom = [
-            finalHeader ? (React__default.createElement(HeadingComponent, { key: "header", onClick: this.toggleCollapsed, className: cx("Collapse-header", headingClassName) },
+            finalHeader ? (React__default.createElement(HeadingComponent, { key: "header", onClick: this.toggleCollapsed, className: cx("Collapse-header", { 'is-mobile': mobileUI }, headingClassName) },
                 showArrow && collapsable ? (expandIcon ? (React__default.cloneElement(expandIcon, __assign(__assign({}, expandIcon.props), { className: cx('Collapse-icon-tranform', (_b = expandIcon.props) === null || _b === void 0 ? void 0 : _b.className) }))) : (React__default.createElement("span", { className: cx('Collapse-arrow-wrap') },
                     React__default.createElement(Icon, { icon: "right-arrow-bold", className: cx('Collapse-arrow', 'icon'), wrapClassName: cx('Collapse-arrow'), iconContent: "Collapse-arrow" })))) : (''),
                 finalHeader)) : null,
@@ -100,6 +103,7 @@ var Collapse = /** @class */ (function (_super) {
             dom.reverse();
         }
         return (React__default.createElement(WrapperComponent, { className: cx("Collapse", (_a = {
+                    'is-mobile': mobileUI,
                     'is-active': !this.state.collapsed
                 },
                 _a["Collapse--".concat(size)] = size,

package/esm/components/CollapseGroup.d.ts

@@ -21,9 +21,11 @@ export interface CollapseGroupProps {
     classnames: ClassNamesFn;
     classPrefix: string;
     children?: React.ReactNode | Array<React.ReactNode>;
+    useMobileUI?: boolean;
+    onCollapseChange?: (activeKeys: Array<string | number>, collapseId: string | number, collapsed: boolean) => void;
 }
 export interface CollapseGroupState {
-    activeKey: Array<string | number | never>;
+    activeKeys: Array<string | number | never>;
 }
 declare class CollapseGroup extends React.Component<CollapseGroupProps, CollapseGroupState> {
     static defaultProps: Partial<CollapseGroupProps>;
@@ -38,10 +40,12 @@ declare const _default: {
     new (props: Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
         children?: React.ReactNode | React.ReactNode[];
         body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
+        useMobileUI?: boolean | undefined;
         expandIcon?: SchemaNode | undefined;
         defaultActiveKey?: string | number | (string | number)[] | undefined;
         accordion?: boolean | undefined;
         expandIconPosition?: "left" | "right" | undefined;
+        onCollapseChange?: ((activeKeys: (string | number)[], collapseId: string | number, collapsed: boolean) => void) | undefined;
     } & {
         classPrefix?: string | undefined;
         classnames?: ClassNamesFn | undefined;
@@ -56,10 +60,12 @@ declare const _default: {
         setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             children?: React.ReactNode | React.ReactNode[];
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
+            useMobileUI?: boolean | undefined;
             expandIcon?: SchemaNode | undefined;
             defaultActiveKey?: string | number | (string | number)[] | undefined;
             accordion?: boolean | undefined;
             expandIconPosition?: "left" | "right" | undefined;
+            onCollapseChange?: ((activeKeys: (string | number)[], collapseId: string | number, collapsed: boolean) => void) | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -70,10 +76,12 @@ declare const _default: {
         readonly props: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             children?: React.ReactNode | React.ReactNode[];
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
+            useMobileUI?: boolean | undefined;
             expandIcon?: SchemaNode | undefined;
             defaultActiveKey?: string | number | (string | number)[] | undefined;
             accordion?: boolean | undefined;
             expandIconPosition?: "left" | "right" | undefined;
+            onCollapseChange?: ((activeKeys: (string | number)[], collapseId: string | number, collapsed: boolean) => void) | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -88,10 +96,12 @@ declare const _default: {
         shouldComponentUpdate?(nextProps: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             children?: React.ReactNode | React.ReactNode[];
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
+            useMobileUI?: boolean | undefined;
             expandIcon?: SchemaNode | undefined;
             defaultActiveKey?: string | number | (string | number)[] | undefined;
             accordion?: boolean | undefined;
             expandIconPosition?: "left" | "right" | undefined;
+            onCollapseChange?: ((activeKeys: (string | number)[], collapseId: string | number, collapsed: boolean) => void) | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -103,10 +113,12 @@ declare const _default: {
         getSnapshotBeforeUpdate?(prevProps: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             children?: React.ReactNode | React.ReactNode[];
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
+            useMobileUI?: boolean | undefined;
             expandIcon?: SchemaNode | undefined;
             defaultActiveKey?: string | number | (string | number)[] | undefined;
             accordion?: boolean | undefined;
             expandIconPosition?: "left" | "right" | undefined;
+            onCollapseChange?: ((activeKeys: (string | number)[], collapseId: string | number, collapsed: boolean) => void) | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -116,10 +128,12 @@ declare const _default: {
         componentDidUpdate?(prevProps: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             children?: React.ReactNode | React.ReactNode[];
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
+            useMobileUI?: boolean | undefined;
             expandIcon?: SchemaNode | undefined;
             defaultActiveKey?: string | number | (string | number)[] | undefined;
             accordion?: boolean | undefined;
             expandIconPosition?: "left" | "right" | undefined;
+            onCollapseChange?: ((activeKeys: (string | number)[], collapseId: string | number, collapsed: boolean) => void) | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -131,10 +145,12 @@ declare const _default: {
         componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             children?: React.ReactNode | React.ReactNode[];
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
+            useMobileUI?: boolean | undefined;
             expandIcon?: SchemaNode | undefined;
             defaultActiveKey?: string | number | (string | number)[] | undefined;
             accordion?: boolean | undefined;
             expandIconPosition?: "left" | "right" | undefined;
+            onCollapseChange?: ((activeKeys: (string | number)[], collapseId: string | number, collapsed: boolean) => void) | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -144,10 +160,12 @@ declare const _default: {
         UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             children?: React.ReactNode | React.ReactNode[];
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
+            useMobileUI?: boolean | undefined;
             expandIcon?: SchemaNode | undefined;
             defaultActiveKey?: string | number | (string | number)[] | undefined;
             accordion?: boolean | undefined;
             expandIconPosition?: "left" | "right" | undefined;
+            onCollapseChange?: ((activeKeys: (string | number)[], collapseId: string | number, collapsed: boolean) => void) | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -157,10 +175,12 @@ declare const _default: {
         componentWillUpdate?(nextProps: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             children?: React.ReactNode | React.ReactNode[];
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
+            useMobileUI?: boolean | undefined;
             expandIcon?: SchemaNode | undefined;
             defaultActiveKey?: string | number | (string | number)[] | undefined;
             accordion?: boolean | undefined;
             expandIconPosition?: "left" | "right" | undefined;
+            onCollapseChange?: ((activeKeys: (string | number)[], collapseId: string | number, collapsed: boolean) => void) | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
@@ -170,10 +190,12 @@ declare const _default: {
         UNSAFE_componentWillUpdate?(nextProps: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             children?: React.ReactNode | React.ReactNode[];
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
+            useMobileUI?: boolean | undefined;
             expandIcon?: SchemaNode | undefined;
             defaultActiveKey?: string | number | (string | number)[] | undefined;
             accordion?: boolean | undefined;
             expandIconPosition?: "left" | "right" | undefined;
+            onCollapseChange?: ((activeKeys: (string | number)[], collapseId: string | number, collapsed: boolean) => void) | undefined;
         } & {
             classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;