amis-ui 3.1.1 → 3.3.0

package/lib/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,15 +40,17 @@ declare const _default: {
     new (props: Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
         body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
         children?: React.ReactNode | React.ReactNode[];
+        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;
     } & {
-        className?: string | undefined;
-        style?: any;
-        classPrefix?: string | undefined;
         classnames?: ClassNamesFn | undefined;
+        classPrefix?: string | undefined;
+        style?: any;
+        className?: string | undefined;
     } & import("packages/amis-core/lib/theme").ThemeOutterProps): {
         ref: any;
         childRef(ref: any): void;
@@ -56,29 +60,33 @@ declare const _default: {
         setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
             children?: React.ReactNode | React.ReactNode[];
+            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;
         } & {
-            className?: string | undefined;
-            style?: any;
-            classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
+            classPrefix?: string | undefined;
+            style?: any;
+            className?: string | 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<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
             children?: React.ReactNode | React.ReactNode[];
+            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;
         } & {
-            className?: string | undefined;
-            style?: any;
-            classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
+            classPrefix?: string | undefined;
+            style?: any;
+            className?: string | undefined;
         } & import("packages/amis-core/lib/theme").ThemeOutterProps>;
         state: Readonly<{}>;
         refs: {
@@ -88,97 +96,111 @@ declare const _default: {
         shouldComponentUpdate?(nextProps: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
             children?: React.ReactNode | React.ReactNode[];
+            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;
         } & {
-            className?: string | undefined;
-            style?: any;
-            classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
+            classPrefix?: string | undefined;
+            style?: any;
+            className?: string | 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<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
             children?: React.ReactNode | React.ReactNode[];
+            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;
         } & {
-            className?: string | undefined;
-            style?: any;
-            classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
+            classPrefix?: string | undefined;
+            style?: any;
+            className?: string | undefined;
         } & import("packages/amis-core/lib/theme").ThemeOutterProps>, prevState: Readonly<{}>): any;
         componentDidUpdate?(prevProps: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
             children?: React.ReactNode | React.ReactNode[];
+            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;
         } & {
-            className?: string | undefined;
-            style?: any;
-            classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
+            classPrefix?: string | undefined;
+            style?: any;
+            className?: string | undefined;
         } & import("packages/amis-core/lib/theme").ThemeOutterProps>, prevState: Readonly<{}>, snapshot?: any): void;
         componentWillMount?(): void;
         UNSAFE_componentWillMount?(): void;
         componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
             children?: React.ReactNode | React.ReactNode[];
+            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;
         } & {
-            className?: string | undefined;
-            style?: any;
-            classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
+            classPrefix?: string | undefined;
+            style?: any;
+            className?: string | undefined;
         } & import("packages/amis-core/lib/theme").ThemeOutterProps>, nextContext: any): void;
         UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
             children?: React.ReactNode | React.ReactNode[];
+            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;
         } & {
-            className?: string | undefined;
-            style?: any;
-            classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
+            classPrefix?: string | undefined;
+            style?: any;
+            className?: string | undefined;
         } & import("packages/amis-core/lib/theme").ThemeOutterProps>, nextContext: any): void;
         componentWillUpdate?(nextProps: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
             children?: React.ReactNode | React.ReactNode[];
+            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;
         } & {
-            className?: string | undefined;
-            style?: any;
-            classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
+            classPrefix?: string | undefined;
+            style?: any;
+            className?: string | undefined;
         } & import("packages/amis-core/lib/theme").ThemeOutterProps>, nextState: Readonly<{}>, nextContext: any): void;
         UNSAFE_componentWillUpdate?(nextProps: Readonly<Pick<Omit<CollapseGroupProps, keyof import("amis-core").ThemeProps>, never> & {
             body?: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
             children?: React.ReactNode | React.ReactNode[];
+            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;
         } & {
-            className?: string | undefined;
-            style?: any;
-            classPrefix?: string | undefined;
             classnames?: ClassNamesFn | undefined;
+            classPrefix?: string | undefined;
+            style?: any;
+            className?: string | undefined;
         } & import("packages/amis-core/lib/theme").ThemeOutterProps>, nextState: Readonly<{}>, nextContext: any): void;
     };
     displayName: string;

package/lib/components/CollapseGroup.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.1.1
+ * amis-ui v3.3.0
  * Copyright 2018-2023 fex
  */
 
@@ -17,11 +17,9 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var isEqual__default = /*#__PURE__*/_interopDefaultLegacy(isEqual);
 
-/**
- * @file CollapseGroup
- * @description 折叠面板group
- * @author hongyang03
- */
+var __react_jsx__ = require('react');
+var _J$X_ = (__react_jsx__["default"] || __react_jsx__).createElement;
+(__react_jsx__["default"] || __react_jsx__).Fragment;
 var CollapseGroup = /** @class */ (function (_super) {
     tslib.__extends(CollapseGroup, _super);
     function CollapseGroup(props) {
@@ -34,7 +32,7 @@ var CollapseGroup = /** @class */ (function (_super) {
                 var props = child.props;
                 var collapseId = props.propKey || String(index);
                 // 判断是否折叠
-                var collapsed = _this.state.activeKey.indexOf(collapseId) === -1;
+                var collapsed = _this.state.activeKeys.indexOf(collapseId) === -1;
                 return React__default["default"].cloneElement(child, tslib.__assign(tslib.__assign({}, props), { key: collapseId, collapseId: collapseId, collapsed: collapsed, expandIcon: _this.props.expandIcon, propsUpdate: true, onCollapse: function () { return _this.collapseChange(collapseId, collapsed); } }));
             });
         };
@@ -60,26 +58,27 @@ var CollapseGroup = /** @class */ (function (_super) {
         }
         if (isInit) {
             this.state = {
-                activeKey: curActiveKey.map(function (key) { return String(key); })
+                activeKeys: curActiveKey.map(function (key) { return String(key); })
             };
         }
         else {
             this.setState({
-                activeKey: curActiveKey.map(function (key) { return String(key); })
+                activeKeys: curActiveKey.map(function (key) { return String(key); })
             });
         }
     };
     CollapseGroup.prototype.collapseChange = function (collapseId, collapsed) {
-        var activeKey = this.state.activeKey.concat();
+        var _a, _b;
+        var activeKeys = this.state.activeKeys.concat();
         if (!collapsed) {
             // 开启状态
             if (this.props.accordion) {
-                activeKey = [];
+                activeKeys = [];
             }
             else {
-                for (var i = 0; i < activeKey.length; i++) {
-                    if (activeKey[i] === collapseId) {
-                        activeKey.splice(i, 1); // 剔除开启状态
+                for (var i = 0; i < activeKeys.length; i++) {
+                    if (activeKeys[i] === collapseId) {
+                        activeKeys.splice(i, 1); // 剔除开启状态
                         break;
                     }
                 }
@@ -87,20 +86,24 @@ var CollapseGroup = /** @class */ (function (_super) {
         }
         else {
             if (this.props.accordion) {
-                activeKey = [collapseId];
+                activeKeys = [collapseId];
             }
             else {
-                activeKey.push(collapseId);
+                activeKeys.push(collapseId);
             }
         }
+        (_b = (_a = this.props).onCollapseChange) === null || _b === void 0 ? void 0 : _b.call(_a, activeKeys, collapseId, activeKeys.indexOf(collapseId) === -1);
         this.setState({
-            activeKey: activeKey
+            activeKeys: activeKeys
         });
     };
     CollapseGroup.prototype.render = function () {
-        var _a = this.props, cx = _a.classnames, className = _a.className, style = _a.style, expandIconPosition = _a.expandIconPosition, children = _a.children;
-        return (React__default["default"].createElement("div", { className: cx("CollapseGroup", {
+        var _a = this.props, cx = _a.classnames, className = _a.className, style = _a.style, expandIconPosition = _a.expandIconPosition, children = _a.children, useMobileUI = _a.useMobileUI;
+        var mobileUI = useMobileUI && amisCore.isMobile();
+        return (_J$X_("div", { className: cx("CollapseGroup", {
                 'icon-position-right': expandIconPosition === 'right'
+            }, {
+                'is-mobile': mobileUI
             }, className), style: style }, this.getItems(children)));
     };
     CollapseGroup.defaultProps = {