@ibiz-template/vue3-components 0.7.41-alpha.26 → 0.7.41-alpha.27

package/es/panel-component/panel-tab-panel/panel-tab-panel.controller.d.ts

@@ -1,7 +1,7 @@
-import { PanelItemController } from '@ibiz-template/runtime';
+import { PanelContainerController } from '@ibiz-template/runtime';
 import { IPanelTabPanel } from '@ibiz/model-core';
 import { PanelTabPanelState } from './panel-tab-panel.state';
-export declare class PanelTabPanelController extends PanelItemController<IPanelTabPanel> {
+export declare class PanelTabPanelController extends PanelContainerController<IPanelTabPanel> {
     state: PanelTabPanelState;
     /**
      * 新建状态

package/es/panel-component/panel-tab-panel/panel-tab-panel.controller.mjs

@@ -1,8 +1,8 @@
-import { PanelItemController } from '@ibiz-template/runtime';
+import { PanelContainerController } from '@ibiz-template/runtime';
 import { PanelTabPanelState } from './panel-tab-panel.state.mjs';
 
 "use strict";
-class PanelTabPanelController extends PanelItemController {
+class PanelTabPanelController extends PanelContainerController {
   /**
    * 新建状态
    *

package/es/panel-component/panel-tab-panel/panel-tab-panel.state.d.ts

@@ -1,4 +1,4 @@
-import { PanelItemState } from '@ibiz-template/runtime';
+import { PanelContainerState } from '@ibiz-template/runtime';
 /**
  * 分页面板状态
  *
@@ -6,9 +6,9 @@ import { PanelItemState } from '@ibiz-template/runtime';
  * @date 2024-05-12 14:05:01
  * @export
  * @class PanelTabPanelState
- * @extends {PanelItemState}
+ * @extends {PanelContainerState}
  */
-export declare class PanelTabPanelState extends PanelItemState {
+export declare class PanelTabPanelState extends PanelContainerState {
     /**
      * @description 当前激活分页
      * @exposedoc

package/es/panel-component/panel-tab-panel/panel-tab-panel.state.mjs

@@ -1,4 +1,4 @@
-import { PanelItemState } from '@ibiz-template/runtime';
+import { PanelContainerState } from '@ibiz-template/runtime';
 
 "use strict";
 var __defProp = Object.defineProperty;
@@ -7,7 +7,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-class PanelTabPanelState extends PanelItemState {
+class PanelTabPanelState extends PanelContainerState {
   constructor() {
     super(...arguments);
     /**

package/es/panel-component/panel-view-content/index.d.ts

@@ -4,7 +4,7 @@ export declare const IBizPanelViewContent: import("@ibiz-template/vue3-util").Ty
         required: true;
     };
     controller: {
-        type: typeof import("@ibiz-template/runtime").PanelItemController;
+        type: typeof import("@ibiz-template/vue3-util").PanelContainerController;
         required: true;
     };
 }, {
@@ -18,7 +18,7 @@ export declare const IBizPanelViewContent: import("@ibiz-template/vue3-util").Ty
         required: true;
     };
     controller: {
-        type: typeof import("@ibiz-template/runtime").PanelItemController;
+        type: typeof import("@ibiz-template/vue3-util").PanelContainerController;
         required: true;
     };
 }>>, {}, {}>>;

package/es/panel-component/panel-view-content/panel-view-content.d.ts

@@ -1,6 +1,6 @@
 import { IPanelContainer } from '@ibiz/model-core';
 import { PropType } from 'vue';
-import { PanelItemController } from '@ibiz-template/runtime';
+import { PanelContainerController } from '@ibiz-template/runtime';
 import './panel-view-content.scss';
 /**
  * 面板容器（视图内容）
@@ -21,7 +21,7 @@ export declare const PanelViewContent: import("vue").DefineComponent<{
      * @description  容器控制器
      */
     controller: {
-        type: typeof PanelItemController;
+        type: typeof PanelContainerController;
         required: true;
     };
 }, {
@@ -41,7 +41,7 @@ export declare const PanelViewContent: import("vue").DefineComponent<{
      * @description  容器控制器
      */
     controller: {
-        type: typeof PanelItemController;
+        type: typeof PanelContainerController;
         required: true;
     };
 }>>, {}, {}>;

package/es/panel-component/panel-view-content/panel-view-content.mjs

@@ -1,6 +1,6 @@
-import { isVNode, ref, computed, resolveComponent, createVNode, defineComponent } from 'vue';
+import { isVNode, ref, computed, resolveComponent, createVNode, resolveDirective, withDirectives, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
-import { PanelItemController } from '@ibiz-template/runtime';
+import { PanelContainerController } from '@ibiz-template/runtime';
 import './panel-view-content.css';
 
 "use strict";
@@ -21,7 +21,7 @@ const PanelViewContent = /* @__PURE__ */ defineComponent({
      * @description  容器控制器
      */
     controller: {
-      type: PanelItemController,
+      type: PanelContainerController,
       required: true
     }
   },
@@ -80,9 +80,9 @@ const PanelViewContent = /* @__PURE__ */ defineComponent({
     })) ? _slot : {
       default: () => [_slot]
     });
-    return createVNode("div", {
+    return withDirectives(createVNode("div", {
       "class": this.classArr
-    }, [content]);
+    }, [content]), [[resolveDirective("loading"), this.controller.state.loading]]);
   }
 });
 

package/es/panel-component/panel-view-content/panel-view-content.provider.d.ts

@@ -1,4 +1,4 @@
-import { IPanelItemProvider, PanelController, PanelItemController } from '@ibiz-template/runtime';
+import { IPanelItemProvider, PanelContainerController, PanelController, PanelItemController } from '@ibiz-template/runtime';
 import { IPanelContainer } from '@ibiz/model-core';
 /**
  * 面板容器适配器
@@ -11,5 +11,5 @@ import { IPanelContainer } from '@ibiz/model-core';
  */
 export declare class PanelViewContentProvider implements IPanelItemProvider {
     component: string;
-    createController(panelItem: IPanelContainer, panel: PanelController, parent: PanelItemController | undefined): Promise<PanelItemController>;
+    createController(panelItem: IPanelContainer, panel: PanelController, parent: PanelItemController | undefined): Promise<PanelContainerController>;
 }

package/es/panel-component/panel-view-content/panel-view-content.provider.mjs

@@ -1,4 +1,4 @@
-import { PanelItemController } from '@ibiz-template/runtime';
+import { PanelContainerController } from '@ibiz-template/runtime';
 
 "use strict";
 var __defProp = Object.defineProperty;
@@ -12,7 +12,7 @@ class PanelViewContentProvider {
     __publicField(this, "component", "IBizPanelViewContent");
   }
   async createController(panelItem, panel, parent) {
-    const c = new PanelItemController(panelItem, panel, parent);
+    const c = new PanelContainerController(panelItem, panel, parent);
     await c.init();
     return c;
   }

package/es/panel-component/panel-view-header/index.d.ts

@@ -4,7 +4,7 @@ export declare const IBizPanelViewHeader: import("@ibiz-template/vue3-util").Typ
         required: true;
     };
     controller: {
-        type: typeof import("@ibiz-template/runtime").PanelItemController;
+        type: typeof import("@ibiz-template/vue3-util").PanelContainerController;
         required: true;
     };
 }, {
@@ -18,7 +18,7 @@ export declare const IBizPanelViewHeader: import("@ibiz-template/vue3-util").Typ
         required: true;
     };
     controller: {
-        type: typeof import("@ibiz-template/runtime").PanelItemController;
+        type: typeof import("@ibiz-template/vue3-util").PanelContainerController;
         required: true;
     };
 }>>, {}, {}>>;

package/es/panel-component/panel-view-header/panel-view-header.d.ts

@@ -1,6 +1,6 @@
 import { IPanelContainer } from '@ibiz/model-core';
 import { PropType } from 'vue';
-import { PanelItemController } from '@ibiz-template/runtime';
+import { PanelContainerController } from '@ibiz-template/runtime';
 import './panel-view-header.scss';
 /**
  * 面板容器（视图头部）
@@ -19,7 +19,7 @@ export declare const PanelViewHeader: import("vue").DefineComponent<{
      * @description 容器控制器
      */
     controller: {
-        type: typeof PanelItemController;
+        type: typeof PanelContainerController;
         required: true;
     };
 }, {
@@ -39,7 +39,7 @@ export declare const PanelViewHeader: import("vue").DefineComponent<{
      * @description 容器控制器
      */
     controller: {
-        type: typeof PanelItemController;
+        type: typeof PanelContainerController;
         required: true;
     };
 }>>, {}, {}>;

package/es/panel-component/panel-view-header/panel-view-header.mjs

@@ -1,6 +1,6 @@
-import { isVNode, ref, computed, resolveComponent, createVNode, defineComponent } from 'vue';
+import { isVNode, ref, computed, resolveComponent, createVNode, resolveDirective, withDirectives, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
-import { PanelItemController } from '@ibiz-template/runtime';
+import { PanelContainerController } from '@ibiz-template/runtime';
 import './panel-view-header.css';
 
 "use strict";
@@ -21,7 +21,7 @@ const PanelViewHeader = /* @__PURE__ */ defineComponent({
      * @description 容器控制器
      */
     controller: {
-      type: PanelItemController,
+      type: PanelContainerController,
       required: true
     }
   },
@@ -74,9 +74,9 @@ const PanelViewHeader = /* @__PURE__ */ defineComponent({
     })) ? _slot : {
       default: () => [_slot]
     });
-    return createVNode("div", {
+    return withDirectives(createVNode("div", {
       "class": this.classArr
-    }, [content]);
+    }, [content]), [[resolveDirective("loading"), this.controller.state.loading]]);
   }
 });
 

package/es/panel-component/panel-view-header/panel-view-header.provider.d.ts

@@ -1,4 +1,4 @@
-import { IPanelItemProvider, PanelController, PanelItemController } from '@ibiz-template/runtime';
+import { IPanelItemProvider, PanelContainerController, PanelController, PanelItemController } from '@ibiz-template/runtime';
 import { IPanelContainer } from '@ibiz/model-core';
 /**
  * 面板容器适配器
@@ -11,5 +11,5 @@ import { IPanelContainer } from '@ibiz/model-core';
  */
 export declare class PanelViewHeaderProvider implements IPanelItemProvider {
     component: string;
-    createController(panelItem: IPanelContainer, panel: PanelController, parent: PanelItemController | undefined): Promise<PanelItemController>;
+    createController(panelItem: IPanelContainer, panel: PanelController, parent: PanelItemController | undefined): Promise<PanelContainerController>;
 }

package/es/panel-component/panel-view-header/panel-view-header.provider.mjs

@@ -1,4 +1,4 @@
-import { PanelItemController } from '@ibiz-template/runtime';
+import { PanelContainerController } from '@ibiz-template/runtime';
 
 "use strict";
 var __defProp = Object.defineProperty;
@@ -12,7 +12,7 @@ class PanelViewHeaderProvider {
     __publicField(this, "component", "IBizPanelViewHeader");
   }
   async createController(panelItem, panel, parent) {
-    const c = new PanelItemController(panelItem, panel, parent);
+    const c = new PanelContainerController(panelItem, panel, parent);
     await c.init();
     return c;
   }

package/es/panel-component/split-container/split-container.controller.d.ts

@@ -1,5 +1,5 @@
 import { IPanelContainer } from '@ibiz/model-core';
-import { PanelItemController } from '@ibiz-template/runtime';
+import { PanelContainerController } from '@ibiz-template/runtime';
 import { SplitContainerState } from './split-container.state';
 /**
  * 分割面板容器控制器
@@ -8,9 +8,9 @@ import { SplitContainerState } from './split-container.state';
  * @date 2023-08-22 17:08:37
  * @export
  * @class SplitContainerController
- * @extends {PanelItemController<IPanelContainer>}
+ * @extends {PanelContainerController<IPanelContainer>}
  */
-export declare class SplitContainerController extends PanelItemController<IPanelContainer> {
+export declare class SplitContainerController extends PanelContainerController<IPanelContainer> {
     /**
      * @description 分割面板容器状态
      * @exposedoc

package/es/panel-component/split-container/split-container.controller.mjs

@@ -1,4 +1,4 @@
-import { PanelItemController } from '@ibiz-template/runtime';
+import { PanelContainerController } from '@ibiz-template/runtime';
 
 "use strict";
 var __defProp = Object.defineProperty;
@@ -7,7 +7,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-class SplitContainerController extends PanelItemController {
+class SplitContainerController extends PanelContainerController {
   constructor() {
     super(...arguments);
     /**

package/es/panel-component/split-container/split-container.mjs

@@ -1,4 +1,4 @@
-import { computed, resolveComponent, createVNode, defineComponent } from 'vue';
+import { computed, resolveComponent, createVNode, resolveDirective, withDirectives, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { SplitContainerController } from './split-container.controller.mjs';
 import './split-container.css';
@@ -40,7 +40,7 @@ const SplitContainer = /* @__PURE__ */ defineComponent({
   render() {
     var _a, _b;
     const defaultSlots = ((_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)) || [];
-    return createVNode("div", {
+    return withDirectives(createVNode("div", {
       "class": this.classArr
     }, [createVNode(resolveComponent("iBizSplit"), {
       "modelValue": this.controller.state.splitValue,
@@ -51,7 +51,7 @@ const SplitContainer = /* @__PURE__ */ defineComponent({
       right: () => defaultSlots[1],
       top: () => defaultSlots[0],
       bottom: () => defaultSlots[1]
-    })]);
+    })]), [[resolveDirective("loading"), this.controller.state.loading]]);
   }
 });
 

package/es/panel-component/split-container/split-container.state.d.ts

@@ -1,4 +1,4 @@
-import { PanelItemState } from '@ibiz-template/runtime';
+import { PanelContainerState } from '@ibiz-template/runtime';
 /**
  * 分割面板容器状态
  *
@@ -6,9 +6,9 @@ import { PanelItemState } from '@ibiz-template/runtime';
  * @date 2023-10-08 17:10:22
  * @export
  * @class SplitContainerState
- * @extends {PanelItemState}
+ * @extends {PanelContainerState}
  */
-export declare class SplitContainerState extends PanelItemState {
+export declare class SplitContainerState extends PanelContainerState {
     /**
      * @description 分割值
      * @exposedoc

package/es/panel-component/split-container/split-container.state.mjs

@@ -1,4 +1,4 @@
-import { PanelItemState } from '@ibiz-template/runtime';
+import { PanelContainerState } from '@ibiz-template/runtime';
 
 "use strict";
 var __defProp = Object.defineProperty;
@@ -7,7 +7,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-class SplitContainerState extends PanelItemState {
+class SplitContainerState extends PanelContainerState {
   constructor() {
     super(...arguments);
     /**

package/es/util/fullscreen/fullscreen-util.mjs

@@ -1,6 +1,6 @@
 import { createApp } from 'vue';
 import ElementPlus from 'element-plus';
-import { defaultNamespace } from '../../node_modules/.pnpm/@ibiz-template_core@0.7.41-alpha.23_axios@1.6.8_lodash-es@4.17.21_qs@6.11.2_qx-util@0.4.8_ramda@0.29.1/node_modules/@ibiz-template/core/out/utils/namespace/namespace.mjs';
+import { defaultNamespace } from '../../node_modules/.pnpm/@ibiz-template_core@0.7.41-alpha.26_axios@1.6.8_lodash-es@4.17.21_qs@6.11.2_qx-util@0.4.8_ramda@0.29.1/node_modules/@ibiz-template/core/out/utils/namespace/namespace.mjs';
 import { IBizFullscreenToolbar } from '../../common/fullscreen-toolbar/fullscreen-toolbar.mjs';
 
 "use strict";

package/es/view-engine/md-custom-view.engine.d.ts

@@ -1,4 +1,4 @@
-import { IViewEvent, ViewEngineBase, IUIActionResult, ViewController, IControlController, IApiMDCustomViewCall, IMDCustomViewState } from '@ibiz-template/runtime';
+import { IViewEvent, ViewEngineBase, IUIActionResult, ViewController, IControlController, IApiMDCustomViewCall, IMDCustomViewState, ISearchBarController } from '@ibiz-template/runtime';
 import { IControl, IMDControl, IAppDECustomView } from '@ibiz/model-core';
 export declare class MDCustomViewEngine extends ViewEngineBase {
     protected view: ViewController<IAppDECustomView, IMDCustomViewState, IViewEvent>;
@@ -9,6 +9,14 @@ export declare class MDCustomViewEngine extends ViewEngineBase {
      * @memberof MDCustomViewEngine
      */
     controls: IControl[];
+    /**
+     * @description 获取分页搜索视图上移的搜索栏控制器
+     * @readonly
+     * @protected
+     * @type {ISearchBarController}
+     * @memberof MDCustomViewEngine
+     */
+    protected get tabSearchBar(): ISearchBarController;
     /**
      * 视图created生命周期执行逻辑
      *
@@ -23,6 +31,13 @@ export declare class MDCustomViewEngine extends ViewEngineBase {
      * @memberof MDCustomViewEngine
      */
     onMounted(): Promise<void>;
+    /**
+     * @description 获取搜索相关的查询参数
+     * @protected
+     * @returns {*}  {IParams}
+     * @memberof MDCustomViewEngine
+     */
+    protected getSearchParams(): IParams;
     /**
      * @description 初始化部件激活模式
      * @memberof MDCustomViewEngine
@@ -37,6 +52,13 @@ export declare class MDCustomViewEngine extends ViewEngineBase {
      */
     calcToolbarButtonState(control: IMDControl, data: IData | undefined, _params?: IParams): void;
     call(key: keyof IApiMDCustomViewCall, args: any): Promise<IData | null | undefined>;
+    /**
+     * @description 视图重新加载
+     * @protected
+     * @returns {*}  {Promise<void>}
+     * @memberof MDCustomViewEngine
+     */
+    protected reLoad(): Promise<void>;
     /**
      * @description 刷新数据
      * @returns {*}  {Promise<void>}

package/es/view-engine/md-custom-view.engine.mjs

@@ -20,6 +20,16 @@ class MDCustomViewEngine extends ViewEngineBase {
      */
     __publicField(this, "controls", []);
   }
+  /**
+   * @description 获取分页搜索视图上移的搜索栏控制器
+   * @readonly
+   * @protected
+   * @type {ISearchBarController}
+   * @memberof MDCustomViewEngine
+   */
+  get tabSearchBar() {
+    return this.view.getController("tabsearchbar");
+  }
   /**
    * 视图created生命周期执行逻辑
    *
@@ -40,6 +50,26 @@ class MDCustomViewEngine extends ViewEngineBase {
   async onMounted() {
     await super.onMounted();
     this.calcToolbarState = this.calcToolbarState.bind(this);
+    if (this.searchForm) {
+      this.searchForm.evt.on("onSearch", () => {
+        this.reLoad();
+      });
+    }
+    if (this.searchBar) {
+      this.searchBar.evt.on("onSearch", () => {
+        this.reLoad();
+      });
+    }
+    if (this.tabSearchForm) {
+      this.tabSearchForm.evt.on("onSearch", () => {
+        this.reLoad();
+      });
+    }
+    if (this.tabSearchBar) {
+      this.tabSearchBar.evt.on("onSearch", () => {
+        this.reLoad();
+      });
+    }
     this.controls.forEach((ctrl) => {
       const control = this.view.getController(
         ctrl.name
@@ -56,8 +86,33 @@ class MDCustomViewEngine extends ViewEngineBase {
         "onRefreshSuccess",
         (evt) => this.calcToolbarButtonState(ctrl, evt.data[0], evt)
       );
+      control == null ? void 0 : control.evt.on("onBeforeLoad", () => {
+        control.state.searchParams = this.getSearchParams();
+      });
     });
   }
+  /**
+   * @description 获取搜索相关的查询参数
+   * @protected
+   * @returns {*}  {IParams}
+   * @memberof MDCustomViewEngine
+   */
+  getSearchParams() {
+    const params = {};
+    if (this.searchForm) {
+      Object.assign(params, this.searchForm.getFilterParams());
+    }
+    if (this.searchBar) {
+      Object.assign(params, this.searchBar.getFilterParams());
+    }
+    if (this.tabSearchForm) {
+      Object.assign(params, this.tabSearchForm.getFilterParams());
+    }
+    if (this.tabSearchBar) {
+      Object.assign(params, this.tabSearchBar.getFilterParams());
+    }
+    return params;
+  }
   /**
    * @description 初始化部件激活模式
    * @memberof MDCustomViewEngine
@@ -106,6 +161,20 @@ class MDCustomViewEngine extends ViewEngineBase {
     }
     return super.call(key, args);
   }
+  /**
+   * @description 视图重新加载
+   * @protected
+   * @returns {*}  {Promise<void>}
+   * @memberof MDCustomViewEngine
+   */
+  async reLoad() {
+    if (this.view.state.xdatacontrolname) {
+      const xDataCtrl = this.view.getController(
+        this.view.state.xdatacontrolname
+      );
+      await (xDataCtrl == null ? void 0 : xDataCtrl.load({ isInitialLoad: true }));
+    }
+  }
   /**
    * @description 刷新数据
    * @returns {*}  {Promise<void>}

package/es/view-engine/mpickup-view-engine.mjs

@@ -17,7 +17,7 @@ class MPickupViewEngine extends PickupViewEngine {
      * @type {boolean}
      * @memberof MPickupViewEngine
      */
-    __publicField(this, "checkStrictly", true);
+    __publicField(this, "checkStrictly", false);
   }
   /**
    * 简单列表控制器

package/lib/common/action-toolbar/action-toolbar.cjs

@@ -100,6 +100,17 @@ const IBizActionToolbar = /* @__PURE__ */ vue.defineComponent({
       return [ns.e("item"), (_a2 = item.sysCss) == null ? void 0 : _a2.codeName, ns.em("item", "level-".concat(actionLevel))];
     };
     const popoverIndex = props.zIndex;
+    const renderItemContent = (detail) => {
+      var _a2, _b;
+      const caption = ((_a2 = detail.refUIActionGroup) == null ? void 0 : _a2.name) || ((_b = detail.refUIActionGroup) == null ? void 0 : _b.id) || detail.caption;
+      return [vue.createVNode("div", {
+        "class": [ns.em("item", "icon"), ns.is("has-caption", detail.showCaption && !!detail.caption), ns.is("has-icon", detail.showIcon && !!detail.sysImage)]
+      }, [detail.showIcon && detail.sysImage && vue.createVNode(vue.resolveComponent("iBizIcon"), {
+        "icon": detail.sysImage
+      }, null)]), vue.createVNode("div", {
+        "class": [ns.em("item", "label"), ns.is("has-caption", detail.showCaption && !!detail.caption), ns.is("has-icon", detail.showIcon && !!detail.sysImage)]
+      }, [caption])];
+    };
     return {
       ns,
       dropdownRef,
@@ -109,6 +120,7 @@ const IBizActionToolbar = /* @__PURE__ */ vue.defineComponent({
       groupButtonRef,
       popoverVisible,
       handleClick,
+      renderItemContent,
       calcActionItemClass
     };
   },
@@ -156,9 +168,11 @@ const IBizActionToolbar = /* @__PURE__ */ vue.defineComponent({
             "class": [...this.calcActionItemClass(detail), this.ns.e("group-item")]
           }, {
             default: () => [vue.createVNode("div", {
+              "class": this.ns.em("group-item", "content")
+            }, [vue.createVNode("div", {
               "class": this.ns.em("group-item", "caption")
-            }, [vue.createVNode("span", null, [actionGroup.name || actionGroup.id]), vue.createVNode("ion-icon", {
-              "class": this.ns.em("group-item", "caption-icon"),
+            }, [this.renderItemContent(detail)]), vue.createVNode("ion-icon", {
+              "class": this.ns.em("group-item", "icon"),
               "name": ishorizontal ? "chevron-down-outline" : "chevron-forward-outline"
             }, null)])]
           });
@@ -174,6 +188,7 @@ const IBizActionToolbar = /* @__PURE__ */ vue.defineComponent({
         if (detail.detailType === "DEUIACTIONGROUP" && detail.refUIActionGroup)
           return renderActionGroup(detail, isExpand);
         if ((_a2 = this.actionsState[detail.id]) == null ? void 0 : _a2.visible) {
+          let _slot;
           return [detail.addSeparator && renderDivider(isExpand), vue.createVNode(vue.resolveComponent("el-button"), {
             "text": true,
             "size": "small",
@@ -181,21 +196,15 @@ const IBizActionToolbar = /* @__PURE__ */ vue.defineComponent({
             "title": core.showTitle(detail.tooltip),
             "disabled": this.actionsState[detail.id].disabled,
             "class": this.calcActionItemClass(detail)
-          }, {
-            default: () => [vue.createVNode("div", {
-              "class": [this.ns.em("item", "icon"), this.ns.is("has-caption", detail.showCaption && !!detail.caption), this.ns.is("has-icon", detail.showIcon && !!detail.sysImage)]
-            }, [detail.showIcon && detail.sysImage && vue.createVNode(vue.resolveComponent("iBizIcon"), {
-              "icon": detail.sysImage
-            }, null)]), vue.createVNode("div", {
-              "class": [this.ns.em("item", "label"), this.ns.is("has-caption", detail.showCaption && !!detail.caption), this.ns.is("has-icon", detail.showIcon && !!detail.sysImage)]
-            }, [detail.showCaption ? detail.caption : ""])]
+          }, _isSlot(_slot = this.renderItemContent(detail)) ? _slot : {
+            default: () => [_slot]
           })];
         }
         return null;
       });
     };
     const renderGroup = () => {
-      let _slot;
+      let _slot2;
       if (this.groupDetails.length === 0)
         return null;
       const pvisible = this.groupDetails.findIndex((item) => {
@@ -228,8 +237,8 @@ const IBizActionToolbar = /* @__PURE__ */ vue.defineComponent({
         "popper-class": this.ns.e("popover"),
         "virtual-triggering": true,
         "popper-style": "z-index:".concat(this.popoverIndex)
-      }, _isSlot(_slot = renderActions(this.groupDetails, false)) ? _slot : {
-        default: () => [_slot]
+      }, _isSlot(_slot2 = renderActions(this.groupDetails, false)) ? _slot2 : {
+        default: () => [_slot2]
       })];
     };
     if (!((_a = this.actionsState) == null ? void 0 : _a.visible))

package/lib/common/action-toolbar/action-toolbar.css

@@ -1 +1 @@
-@charset "UTF-8";.ibiz-action-toolbar{--ibiz-action-toolbar-item-margin:var(--ibiz-spacing-none) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none) var(--ibiz-spacing-none);--ibiz-action-toolbar-item-padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-separator-height:var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-separator-width:var(--ibiz-spacing-super-tight);--ibiz-action-toolbar-separator-color:var(--ibiz-color-border);--ibiz-action-toolbar-popover-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-popover-button-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-popover-button-color:var(--ibiz-color-text-2);--ibiz-action-toolbar-popover-button-hover-bg:var(--ibiz-color-bg-0);display:flex;flex-wrap:wrap}.ibiz-action-toolbar__item{padding:var(--ibiz-action-toolbar-item-padding);margin:var(--ibiz-action-toolbar-item-margin)}.ibiz-action-toolbar__item--icon.is-has-icon{display:flex;align-items:baseline;justify-content:center;width:var(--ibiz-width-icon-medium);height:var(--ibiz-width-icon-medium);margin-right:var(--ibiz-spacing-extra-tight);margin-left:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-width-icon-medium)}.ibiz-action-toolbar__item--label.is-has-caption{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-action-toolbar__item+.ibiz-action-toolbar__item{margin:var(--ibiz-action-toolbar-item-margin)}.ibiz-action-toolbar__group-item>span{width:100%}.ibiz-action-toolbar__group-item--caption{display:flex;gap:var(--ibiz-spacing-extra-tight);align-items:center;justify-content:space-between;width:100%}.ibiz-action-toolbar__separator{height:auto}.ibiz-action-toolbar__popover{--ibiz-action-toolbar-item-margin:var(--ibiz-spacing-none) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none) var(--ibiz-spacing-none);--ibiz-action-toolbar-item-padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-separator-height:var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-separator-width:var(--ibiz-spacing-super-tight);--ibiz-action-toolbar-separator-color:var(--ibiz-color-border);--ibiz-action-toolbar-popover-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-popover-button-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-popover-button-color:var(--ibiz-color-text-2);--ibiz-action-toolbar-popover-button-hover-bg:var(--ibiz-color-bg-0);width:auto!important;min-width:150px;--el-popover-padding:var(--ibiz-action-toolbar-popover-padding)}.ibiz-action-toolbar__popover .el-button{--el-button-size:getCssVar("height-control", "large");display:block;width:100%;padding:var(--ibiz-action-toolbar-popover-button-padding);margin:var(--ibiz-spacing-none);font-size:var(--ibiz-font-size-regular);color:var(--ibiz-action-toolbar-popover-button-color);text-align:left;border-radius:0}.ibiz-action-toolbar__popover .el-button:hover{background-color:var(--ibiz-action-toolbar-popover-button-hover-bg)}.ibiz-action-toolbar__popover .el-button .ibiz-icon{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-action-toolbar__popover .ibiz-action-toolbar__separator{margin:var(--ibiz-spacing-none)}.ibiz-action-toolbar--dropdown .ibiz-action-toolbar__caption{cursor:pointer}.ibiz-action-toolbar--dropdown .ibiz-action-toolbar__caption-icon{vertical-align:bottom}
+@charset "UTF-8";.ibiz-action-toolbar{--ibiz-action-toolbar-item-margin:var(--ibiz-spacing-none) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none) var(--ibiz-spacing-none);--ibiz-action-toolbar-item-padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-separator-height:var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-separator-width:var(--ibiz-spacing-super-tight);--ibiz-action-toolbar-separator-color:var(--ibiz-color-border);--ibiz-action-toolbar-popover-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-popover-button-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-popover-button-color:var(--ibiz-color-text-2);--ibiz-action-toolbar-popover-button-hover-bg:var(--ibiz-color-bg-0);display:flex;flex-wrap:wrap}.ibiz-action-toolbar__item{padding:var(--ibiz-action-toolbar-item-padding);margin:var(--ibiz-action-toolbar-item-margin)}.ibiz-action-toolbar__item--icon.is-has-icon{display:flex;align-items:baseline;justify-content:center;width:var(--ibiz-width-icon-medium);height:var(--ibiz-width-icon-medium);margin-right:var(--ibiz-spacing-extra-tight);margin-left:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-width-icon-medium)}.ibiz-action-toolbar__item--label.is-has-caption{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-action-toolbar__item+.ibiz-action-toolbar__item{margin:var(--ibiz-action-toolbar-item-margin)}.ibiz-action-toolbar__group-item>span{width:100%}.ibiz-action-toolbar__group-item--content{display:flex;gap:var(--ibiz-spacing-extra-tight);align-items:center;justify-content:space-between;width:100%}.ibiz-action-toolbar__group-item--caption{display:flex;align-items:center;padding:var(--ibiz-action-toolbar-item-padding);margin:var(--ibiz-action-toolbar-item-margin)}.ibiz-action-toolbar__separator{height:auto}.ibiz-action-toolbar__popover{--ibiz-action-toolbar-item-margin:var(--ibiz-spacing-none) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none) var(--ibiz-spacing-none);--ibiz-action-toolbar-item-padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-separator-height:var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-separator-width:var(--ibiz-spacing-super-tight);--ibiz-action-toolbar-separator-color:var(--ibiz-color-border);--ibiz-action-toolbar-popover-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-popover-button-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-popover-button-color:var(--ibiz-color-text-2);--ibiz-action-toolbar-popover-button-hover-bg:var(--ibiz-color-bg-0);width:auto!important;min-width:150px;--el-popover-padding:var(--ibiz-action-toolbar-popover-padding)}.ibiz-action-toolbar__popover .el-button{--el-button-size:getCssVar("height-control", "large");display:block;width:100%;padding:var(--ibiz-action-toolbar-popover-button-padding);margin:var(--ibiz-spacing-none);font-size:var(--ibiz-font-size-regular);color:var(--ibiz-action-toolbar-popover-button-color);text-align:left;border-radius:0}.ibiz-action-toolbar__popover .el-button:hover{background-color:var(--ibiz-action-toolbar-popover-button-hover-bg)}.ibiz-action-toolbar__popover .el-button .ibiz-icon{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-action-toolbar__popover .ibiz-action-toolbar__separator{margin:var(--ibiz-spacing-none)}.ibiz-action-toolbar--dropdown .ibiz-action-toolbar__caption{cursor:pointer}.ibiz-action-toolbar--dropdown .ibiz-action-toolbar__caption-icon{vertical-align:bottom}

package/lib/common/button-list/button-list.cjs

@@ -172,12 +172,15 @@ const IBizButtonList = /* @__PURE__ */ vue.defineComponent({
           }, {
             default: () => [vue.createVNode("div", {
               "class": ns.e("button-content")
-            }, [vue.createVNode("span", {
+            }, [detail.showIcon && vue.createVNode(vue.resolveComponent("iBizIcon"), {
+              "icon": detail.sysImage,
+              "class": ns.em("button-content", "icon")
+            }, null), detail.showCaption && vue.createVNode("span", {
               "class": ns.em("button-content", "caption")
-            }, [actionGroup.name || actionGroup.id]), vue.createVNode("ion-icon", {
-              "class": ns.em("button-content", "icon"),
+            }, [actionGroup.name || actionGroup.id])]), vue.createVNode("ion-icon", {
+              "class": ns.em("item", "group-icon"),
               "name": isFlatten ? "chevron-down-outline" : "chevron-forward-outline"
-            }, null)])]
+            }, null)]
           });
         },
         default: () => {