@ibiz-template/vue3-components 0.6.17 → 0.7.0

package/es/editor/raw/ibiz-raw/ibiz-raw.mjs

@@ -47,6 +47,13 @@ const IBizRaw = /* @__PURE__ */ defineComponent({
               ibiz.log.error("JSON\u5B57\u7B26\u4E32\u8F6C\u6362\u9519\u8BEF");
             }
           }
+          if (!Array.isArray(obj)) {
+            Object.assign(obj, {
+              data: {
+                ...props.data
+              }
+            });
+          }
           content.value = await ibiz.util.hbs.render(template, obj || newVal);
         }
       }

package/es/editor/user/ibiz-searchcond-edit/ibiz-searchcond-edit.mjs

@@ -2,7 +2,7 @@ import { ref, computed, watch, resolveComponent, createVNode, mergeProps, define
 import { getInputProps, getEditorEmits, useNamespace } from '@ibiz-template/vue3-util';
 import './ibiz-searchcond-edit.css';
 import { isNilOrEmpty } from 'qx-util';
-import { getOriginFilterNodes, parseFilters, calcSearchConds } from '@ibiz-template/runtime';
+import { getOriginFilterNodes, SearchCondEx2filterNode, calcSearchCondExs } from '@ibiz-template/runtime';
 
 "use strict";
 const IBizSearchCondEdit = /* @__PURE__ */ defineComponent({
@@ -36,7 +36,7 @@ const IBizSearchCondEdit = /* @__PURE__ */ defineComponent({
           if (newVal) {
             try {
               const searchconds = JSON.parse(newVal);
-              filterNodes.value = searchconds.map((item) => parseFilters(item));
+              filterNodes.value = searchconds.map((item) => SearchCondEx2filterNode(item));
             } catch (error) {
               ibiz.log.error("".concat(newVal, "\u503C\u683C\u5F0F\u4E0D\u6B63\u786E\uFF0C\u5FC5\u987B\u4E3Ajson\u5B57\u7B26\u4E32"));
             }
@@ -82,7 +82,7 @@ const IBizSearchCondEdit = /* @__PURE__ */ defineComponent({
       }
     };
     const getCurrentValByFilterNodes = () => {
-      const searchconds = calcSearchConds(filterNodes.value);
+      const searchconds = calcSearchCondExs(filterNodes.value);
       if (searchconds) {
         currentVal.value = JSON.stringify(searchconds, null, 2);
       }

package/es/panel-component/index.mjs

@@ -19,6 +19,7 @@ import { IBizSearchFormButtons } from './searchform-buttons/index.mjs';
 import { IBizViewMessage } from './view-message/index.mjs';
 import { IBizPanelStaticCarousel } from './panel-static-carousel/index.mjs';
 import { IBizCoopPos } from './coop-pos/index.mjs';
+import { IBizViewMsgPos } from './view-msg-pos/index.mjs';
 export { NavPosIndexState } from './nav-pos-index/nav-pos-index.state.mjs';
 export { NavPosIndexController } from './nav-pos-index/nav-pos-index.controller.mjs';
 export { PanelButtonController } from './panel-button/panel-button.controller.mjs';
@@ -63,6 +64,7 @@ const IBizPanelComponents = {
     v.use(IBizTeleportPlaceholder);
     v.use(IBizPanelContainerTabs);
     v.use(IBizCoopPos);
+    v.use(IBizViewMsgPos);
   }
 };
 

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

@@ -12,6 +12,7 @@ export declare const IBizPanelIndexViewSearch: import("@ibiz-template/vue3-util"
     classArr: import("vue").ComputedRef<(string | false)[]>;
     isCollapse: import("vue").ComputedRef<any>;
     onInput: (value: string) => void;
+    onSearch: () => Promise<void>;
     c: import("@ibiz-template/runtime").PanelItemController<import("@ibiz/model-core").IPanelItem>;
     query: import("vue").Ref<string>;
     menuAlign: import("vue").ComputedRef<string>;

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

@@ -16,6 +16,7 @@ export declare const PanelIndexViewSearch: import("vue").DefineComponent<{
     classArr: import("vue").ComputedRef<(string | false)[]>;
     isCollapse: import("vue").ComputedRef<any>;
     onInput: (value: string) => void;
+    onSearch: () => Promise<void>;
     c: PanelItemController<import("@ibiz/model-core").IPanelItem>;
     query: import("vue").Ref<string>;
     menuAlign: import("vue").ComputedRef<string>;

package/es/panel-component/panel-index-view-search/panel-index-view-search.mjs

@@ -1,6 +1,6 @@
 import { ref, inject, computed, resolveComponent, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
-import { PanelItemController } from '@ibiz-template/runtime';
+import { PanelItemController, AppFuncCommand } from '@ibiz-template/runtime';
 import { debounce } from 'lodash-es';
 import './panel-index-view-search.css';
 
@@ -45,11 +45,30 @@ const PanelIndexViewSearch = /* @__PURE__ */ defineComponent({
       result.push(...props.controller.containerClass);
       return result;
     });
+    const onSearch = async () => {
+      const id = props.modelData.id;
+      const menuC = c.panel.view.getController("appmenu");
+      if (menuC) {
+        const targetMenu = menuC.allAppMenuItems.find((item) => {
+          return item.id === id;
+        });
+        if (targetMenu) {
+          const tempContext = c.panel.context.clone();
+          const tempParam = c.panel.params;
+          tempContext.srfappid = targetMenu.appId || ibiz.env.appId;
+          await ibiz.commands.execute(AppFuncCommand.TAG, targetMenu.appFuncId, tempContext, {
+            ...tempParam,
+            query: query.value
+          }, {});
+        }
+      }
+    };
     return {
       ns,
       classArr,
       isCollapse,
       onInput,
+      onSearch,
       c,
       query,
       menuAlign
@@ -65,7 +84,8 @@ const PanelIndexViewSearch = /* @__PURE__ */ defineComponent({
       "model-value": this.query,
       "class": this.ns.b("search"),
       "placeholder": ibiz.i18n.t("component.indexSearch.placeholder"),
-      "onInput": this.onInput
+      "onInput": this.onInput,
+      "onChange": this.onSearch
     }, {
       prefix: () => {
         return createVNode("ion-icon", {

package/es/panel-component/view-msg-pos/index.d.ts

@@ -0,0 +1,25 @@
+import { ViewMsgPosController } from './view-msg-pos.controller';
+export { ViewMsgPosController };
+export declare const IBizViewMsgPos: import("@ibiz-template/vue3-util").TypeWithInstall<import("vue").DefineComponent<{
+    modelData: {
+        type: import("vue").PropType<import("@ibiz/model-core").IPanelRawItem>;
+        required: true;
+    };
+    controller: {
+        type: typeof ViewMsgPosController;
+        required: true;
+    };
+}, {
+    ns: import("@ibiz-template/core").Namespace;
+    view: import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    modelData: {
+        type: import("vue").PropType<import("@ibiz/model-core").IPanelRawItem>;
+        required: true;
+    };
+    controller: {
+        type: typeof ViewMsgPosController;
+        required: true;
+    };
+}>>, {}, {}>>;
+export default IBizViewMsgPos;

package/es/panel-component/view-msg-pos/index.mjs

@@ -0,0 +1,16 @@
+import { withInstall } from '@ibiz-template/vue3-util';
+import { registerPanelItemProvider } from '@ibiz-template/runtime';
+import { ViewMsgPos } from './view-msg-pos.mjs';
+import { ViewMsgPosProvider } from './view-msg-pos.provider.mjs';
+export { ViewMsgPosController } from './view-msg-pos.controller.mjs';
+
+"use strict";
+const IBizViewMsgPos = withInstall(ViewMsgPos, function(v) {
+  v.component(ViewMsgPos.name, ViewMsgPos);
+  registerPanelItemProvider(
+    "RAWITEM_VIEWMSG_POS",
+    () => new ViewMsgPosProvider()
+  );
+});
+
+export { IBizViewMsgPos, IBizViewMsgPos as default };

package/es/panel-component/view-msg-pos/view-msg-pos.controller.d.ts

@@ -0,0 +1,21 @@
+import { PanelItemController } from '@ibiz-template/runtime';
+import { IPanelRawItem } from '@ibiz/model-core';
+export declare class ViewMsgPosController extends PanelItemController<IPanelRawItem> {
+    /**
+     * 直接内容项参数
+     *
+     * @author zhanghengfeng
+     * @date 2024-04-08 19:04:15
+     * @type {IData}
+     */
+    rawItemParams: IData;
+    protected onInit(): Promise<void>;
+    /**
+     * 处理直接内容项参数
+     *
+     * @author zhanghengfeng
+     * @date 2024-04-08 19:04:59
+     * @protected
+     */
+    protected handleRawItemParams(): void;
+}

package/es/panel-component/view-msg-pos/view-msg-pos.controller.mjs

@@ -0,0 +1,48 @@
+import { PanelItemController } from '@ibiz-template/runtime';
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class ViewMsgPosController extends PanelItemController {
+  constructor() {
+    super(...arguments);
+    /**
+     * 直接内容项参数
+     *
+     * @author zhanghengfeng
+     * @date 2024-04-08 19:04:15
+     * @type {IData}
+     */
+    __publicField(this, "rawItemParams", {});
+  }
+  async onInit() {
+    await super.onInit();
+    this.handleRawItemParams();
+  }
+  /**
+   * 处理直接内容项参数
+   *
+   * @author zhanghengfeng
+   * @date 2024-04-08 19:04:59
+   * @protected
+   */
+  handleRawItemParams() {
+    var _a;
+    const rawItemParams = (_a = this.model.rawItem) == null ? void 0 : _a.rawItemParams;
+    if (Array.isArray(rawItemParams)) {
+      rawItemParams.forEach((item) => {
+        const key = item.key;
+        const value = item.value;
+        if (key && value) {
+          this.rawItemParams[key.toLowerCase()] = value;
+        }
+      });
+    }
+  }
+}
+
+export { ViewMsgPosController };

package/es/panel-component/view-msg-pos/view-msg-pos.d.ts

@@ -0,0 +1,25 @@
+import { PropType } from 'vue';
+import { IPanelRawItem } from '@ibiz/model-core';
+import { ViewMsgPosController } from './view-msg-pos.controller';
+export declare const ViewMsgPos: import("vue").DefineComponent<{
+    modelData: {
+        type: PropType<IPanelRawItem>;
+        required: true;
+    };
+    controller: {
+        type: typeof ViewMsgPosController;
+        required: true;
+    };
+}, {
+    ns: import("@ibiz-template/core").Namespace;
+    view: import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    modelData: {
+        type: PropType<IPanelRawItem>;
+        required: true;
+    };
+    controller: {
+        type: typeof ViewMsgPosController;
+        required: true;
+    };
+}>>, {}, {}>;

package/es/panel-component/view-msg-pos/view-msg-pos.mjs

@@ -0,0 +1,47 @@
+import { resolveComponent, createVNode, defineComponent } from 'vue';
+import { useNamespace, useCtx } from '@ibiz-template/vue3-util';
+import { ViewMsgPosController } from './view-msg-pos.controller.mjs';
+
+"use strict";
+const ViewMsgPos = /* @__PURE__ */ defineComponent({
+  name: "IBizViewMsgPos",
+  props: {
+    modelData: {
+      type: Object,
+      required: true
+    },
+    controller: {
+      type: ViewMsgPosController,
+      required: true
+    }
+  },
+  setup() {
+    const ns = useNamespace("view-msg-pos");
+    const ctx = useCtx();
+    const view = ctx.view;
+    return {
+      ns,
+      view
+    };
+  },
+  render() {
+    const c = this.controller;
+    if (!this.view.state.isCreated) {
+      return;
+    }
+    const position = c.rawItemParams.position || "BODY";
+    const scroll = c.rawItemParams.scroll === "true";
+    const viewMessages = this.view.state.viewMessages[position];
+    if (viewMessages == null ? void 0 : viewMessages.length) {
+      return createVNode("div", {
+        "class": this.ns.b()
+      }, [createVNode(resolveComponent("view-message"), {
+        "messages": viewMessages,
+        "scroll": scroll
+      }, null)]);
+    }
+    return null;
+  }
+});
+
+export { ViewMsgPos };

package/es/panel-component/view-msg-pos/view-msg-pos.provider.d.ts

@@ -0,0 +1,16 @@
+import { IPanelItemProvider, PanelController, PanelItemController } from '@ibiz-template/runtime';
+import { IPanelItem } from '@ibiz/model-core';
+import { ViewMsgPosController } from './view-msg-pos.controller';
+/**
+ * 预置视图消息适配器
+ *
+ * @author zk
+ * @date 2024-01-25 02:01:01
+ * @export
+ * @class ViewMessageProvider
+ * @implements {IPanelItemProvider}
+ */
+export declare class ViewMsgPosProvider implements IPanelItemProvider {
+    component: string;
+    createController(panelItem: IPanelItem, panel: PanelController, parent: PanelItemController | undefined): Promise<ViewMsgPosController>;
+}

package/es/panel-component/view-msg-pos/view-msg-pos.provider.mjs

@@ -0,0 +1,21 @@
+import { ViewMsgPosController } from './view-msg-pos.controller.mjs';
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class ViewMsgPosProvider {
+  constructor() {
+    __publicField(this, "component", "IBizViewMsgPos");
+  }
+  async createController(panelItem, panel, parent) {
+    const c = new ViewMsgPosController(panelItem, panel, parent);
+    await c.init();
+    return c;
+  }
+}
+
+export { ViewMsgPosProvider };

package/es/view-engine/index.mjs

@@ -180,6 +180,10 @@ const IBizViewEngine = {
       "VIEW_DEPANELVIEW",
       (c) => new PanelViewEngine(c)
     );
+    ibiz.engine.register(
+      "VIEW_APPPANELVIEW",
+      (c) => new PanelViewEngine(c)
+    );
     ibiz.engine.register(
       "VIEW_DECUSTOMVIEW",
       (c) => new CustomViewEngine(c)

package/es/view-engine/panel-view-engine.d.ts

@@ -1,4 +1,4 @@
-import { ViewEngineBase, ViewController, IWizardPanelController, IPanelViewEvent, IPanelViewState } from '@ibiz-template/runtime';
+import { ViewEngineBase, ViewController, IPanelController, IPanelViewEvent, IPanelViewState } from '@ibiz-template/runtime';
 import { IAppView } from '@ibiz/model-core';
 export declare class PanelViewEngine extends ViewEngineBase {
     /**
@@ -16,6 +16,6 @@ export declare class PanelViewEngine extends ViewEngineBase {
      * @readonly
      * @memberof PanelViewEngine
      */
-    get panel(): IWizardPanelController;
+    get panel(): IPanelController;
     onMounted(): Promise<void>;
 }

package/es/web-app/App.mjs

@@ -1,4 +1,4 @@
-import { resolveComponent, createVNode, defineComponent } from 'vue';
+import { onUnmounted, resolveComponent, createVNode, defineComponent } from 'vue';
 import { ViewMode, Modal } from '@ibiz-template/runtime';
 import { AppHooks } from '@ibiz-template/vue3-util';
 import './App.css';
@@ -20,6 +20,14 @@ var App = /* @__PURE__ */ defineComponent({
       }
     };
     document.addEventListener("keydown", listenDevtool);
+    const destroyAppHub = () => {
+      window.removeEventListener("unload", destroyAppHub);
+      ibiz.hub.destroy();
+    };
+    window.addEventListener("unload", destroyAppHub);
+    onUnmounted(() => {
+      destroyAppHub();
+    });
     return {
       modal
     };

package/lib/common/pagination/pagination.cjs

@@ -2,6 +2,7 @@
 
 var vue = require('vue');
 var vue3Util = require('@ibiz-template/vue3-util');
+var ramda = require('ramda');
 require('./pagination.css');
 
 "use strict";
@@ -19,6 +20,10 @@ const IBizPagination = /* @__PURE__ */ vue.defineComponent({
     size: {
       type: Number,
       required: true
+    },
+    totalPages: {
+      type: Number || void 0,
+      required: false
     }
   },
   emits: ["change", "pageSizeChange", "pageRefresh"],
@@ -44,6 +49,9 @@ const IBizPagination = /* @__PURE__ */ vue.defineComponent({
     const inputChange = (event) => {
       event.stopPropagation();
     };
+    const calcTotalPages = vue.computed(() => {
+      return Math.ceil(props.total / props.size);
+    });
     return {
       ns,
       start,
@@ -51,7 +59,8 @@ const IBizPagination = /* @__PURE__ */ vue.defineComponent({
       onPageChange,
       onPageSizeChange,
       pageRefresh,
-      inputChange
+      inputChange,
+      calcTotalPages
     };
   },
   render() {
@@ -61,6 +70,7 @@ const IBizPagination = /* @__PURE__ */ vue.defineComponent({
       "layout": "slot, prev, pager, next, sizes, jumper",
       "background": true,
       "total": this.total,
+      "page-count": !ramda.isNil(this.totalPages) && this.calcTotalPages === this.totalPages ? this.calcTotalPages : this.totalPages,
       "current-page": this.curPage,
       "page-size": this.size,
       "page-sizes": [10, 20, 30, 40, 50, 60, 70, 80, 90, 100]
@@ -78,7 +88,7 @@ const IBizPagination = /* @__PURE__ */ vue.defineComponent({
         default: () => [vue.createVNode("ion-icon", {
           "name": "refresh"
         }, null)]
-      })]), vue.createVNode("span", null, [ibiz.i18n.t("component.pagination.display"), vue.createTextVNode("\xA0"), this.start, vue.createTextVNode("\xA0-\xA0"), this.end, vue.createTextVNode("\xA0"), ibiz.i18n.t("component.pagination.piece"), vue.createTextVNode("\uFF0C"), ibiz.i18n.t("component.pagination.total"), vue.createTextVNode("\xA0"), this.total, vue.createTextVNode("\xA0"), ibiz.i18n.t("component.pagination.pieceData")])]
+      })]), ramda.isNil(this.totalPages) || this.calcTotalPages === this.totalPages ? vue.createVNode("span", null, [ibiz.i18n.t("component.pagination.display"), vue.createTextVNode("\xA0"), this.start, vue.createTextVNode("\xA0-\xA0"), this.end, vue.createTextVNode("\xA0"), ibiz.i18n.t("component.pagination.piece"), vue.createTextVNode("\uFF0C")]) : null, vue.createVNode("span", null, [ibiz.i18n.t("component.pagination.total"), vue.createTextVNode("\xA0"), this.total, vue.createTextVNode("\xA0"), ibiz.i18n.t("component.pagination.pieceData")])]
     })]);
   }
 });

package/lib/common/view-message/view-message.cjs

@@ -2,17 +2,25 @@
 
 var vue = require('vue');
 var vue3Util = require('@ibiz-template/vue3-util');
+var qxUtil = require('qx-util');
 require('./view-message.css');
 
 "use strict";
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !vue.isVNode(s);
+}
 const ViewMessage = /* @__PURE__ */ vue.defineComponent({
   name: "ViewMessage",
   props: {
     messages: {
       type: Array
+    },
+    scroll: {
+      type: Boolean,
+      default: false
     }
   },
-  setup() {
+  setup(props) {
     const ns = vue3Util.useNamespace("view-message");
     const getType = (messageType) => {
       switch (messageType) {
@@ -24,27 +32,132 @@ const ViewMessage = /* @__PURE__ */ vue.defineComponent({
           return "info";
       }
     };
+    const items = vue.ref([]);
+    const initialIndex = vue.ref(0);
+    const uuid = vue.ref("");
+    const isHiddenContainer = vue.ref(false);
+    vue.watch(() => props.messages, () => {
+      initialIndex.value = 0;
+      uuid.value = qxUtil.createUUID();
+      if (Array.isArray(props.messages)) {
+        items.value = props.messages.filter((item) => item.title || item.message).map((item) => {
+          return {
+            ...item
+          };
+        });
+        isHiddenContainer.value = false;
+      } else {
+        items.value = [];
+        isHiddenContainer.value = true;
+      }
+    }, {
+      immediate: true
+    });
+    const container = vue.ref(null);
+    const carouselHeight = vue.ref("");
+    vue.onMounted(() => {
+      vue.nextTick(() => {
+        const el = container.value;
+        if (!el) {
+          return;
+        }
+        const alertEl = el.querySelector(".el-alert");
+        if (alertEl) {
+          carouselHeight.value = "".concat(alertEl.offsetHeight, "px");
+        }
+      });
+    });
+    const handleAlertClose = (index) => {
+      items.value[index].hidden = true;
+      const isHiddenCarouse = items.value.every((item) => item.hidden);
+      if (isHiddenCarouse) {
+        isHiddenContainer.value = true;
+      }
+      uuid.value = qxUtil.createUUID();
+    };
+    const handleChange = (index) => {
+      initialIndex.value = index;
+    };
     return {
       ns,
-      getType
+      getType,
+      items,
+      container,
+      carouselHeight,
+      initialIndex,
+      uuid,
+      isHiddenContainer,
+      handleAlertClose,
+      handleChange
     };
   },
   render() {
-    var _a, _b;
-    if (!((_a = this.messages) == null ? void 0 : _a.length)) {
-      return null;
+    const renderScrollMessages = () => {
+      let _slot;
+      return vue.createVNode("div", {
+        "class": [this.ns.b(), this.isHiddenContainer && this.ns.m("hidden")],
+        "ref": "container"
+      }, [vue.createVNode(vue.resolveComponent("el-carousel"), {
+        "key": this.uuid,
+        "indicatorPosition": "none",
+        "arrow": "never",
+        "height": this.carouselHeight,
+        "initialIndex": this.initialIndex,
+        "onChange": this.handleChange
+      }, _isSlot(_slot = this.items.map((item, i) => {
+        if (item.hidden) {
+          return;
+        }
+        return vue.createVNode(vue.resolveComponent("el-carousel-item"), null, {
+          default: () => [vue.createVNode(vue.resolveComponent("el-alert"), {
+            "type": this.getType(item.messageType),
+            "class": this.ns.b("carousel-alert"),
+            "closable": item.removeMode !== 0,
+            "onClose": () => this.handleAlertClose(i)
+          }, {
+            title: () => {
+              return vue.createVNode("div", {
+                "class": this.ns.be("carousel-alert", "title")
+              }, [item.title || ""]);
+            },
+            default: () => {
+              return vue.createVNode("div", {
+                "class": this.ns.be("carousel-alert", "message")
+              }, [item.message || ""]);
+            }
+          })]
+        });
+      })) ? _slot : {
+        default: () => [_slot]
+      })]);
+    };
+    const renderMessages = () => {
+      return vue.createVNode("div", {
+        "class": [this.ns.b(), this.isHiddenContainer && this.ns.m("hidden")]
+      }, [this.items.map((item, i) => {
+        return vue.createVNode(vue.resolveComponent("el-alert"), {
+          "type": this.getType(item.messageType),
+          "class": [this.ns.b("alert"), this.ns.bm("alert", item.title && item.message ? "" : "single"), this.ns.bm("alert", !item.title && item.message ? "single-message" : "")],
+          "closable": item.removeMode !== 0,
+          "onClose": () => this.handleAlertClose(i)
+        }, {
+          title: () => {
+            return vue.createVNode("div", {
+              "class": this.ns.be("alert", "title")
+            }, [item.title || ""]);
+          },
+          default: () => {
+            return vue.createVNode("div", {
+              "class": this.ns.be("alert", "message")
+            }, [item.message || ""]);
+          }
+        });
+      })]);
+    };
+    if (this.items.length > 1 && this.scroll) {
+      return renderScrollMessages();
     }
-    return vue.createVNode("div", {
-      "class": [this.ns.b()]
-    }, [(_b = this.messages) == null ? void 0 : _b.map((message) => {
-      return vue.createVNode(vue.resolveComponent("el-alert"), {
-        "type": this.getType(message.messageType),
-        "title": message.title,
-        "class": [this.ns.e("alert"), this.ns.is("no-title", !message.title)],
-        "description": message.message,
-        "closable": message.removeMode !== 0
-      }, null);
-    })]);
+    return renderMessages();
   }
 });
 

package/lib/common/view-message/view-message.css

@@ -1 +1 @@
-.ibiz-view-message__alert.is-no-title.el-alert .el-alert__description{margin:0}
+.ibiz-view-message{--ibiz-view-message-border--warning:1px solid var(--ibiz-color-warning-active);--ibiz-view-message-border--error:1px solid var(--ibiz-color-danger-active);--ibiz-view-message-border--info:1px solid var(--ibiz-color-info-active);padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none)}.ibiz-view-message--hidden{display:none}.ibiz-view-message .el-alert--warning.is-light{border:var(--ibiz-view-message-border--warning)}.ibiz-view-message .el-alert--error.is-light{border:var(--ibiz-view-message-border--error)}.ibiz-view-message .el-alert--info.is-light{border:var(--ibiz-view-message-border--info)}.ibiz-view-message-alert{margin-bottom:var(--ibiz-spacing-tight)}.ibiz-view-message-alert:last-child{margin-bottom:var(--ibiz-spacing-none)}.ibiz-view-message-alert--single .el-alert__description{margin:0}.ibiz-view-message-alert--single-message .el-alert__close-btn{top:calc(var(--ibiz-spacing-tight) + var(--ibiz-spacing-super-tight))}.ibiz-view-message-alert__title{line-height:calc(var(--ibiz-spacing-base-loose) - var(--ibiz-spacing-super-tight))}.ibiz-view-message-alert__message{line-height:var(--ibiz-spacing-base)}.ibiz-view-message-carousel-alert .el-alert__content{overflow:hidden}.ibiz-view-message-carousel-alert__title{height:calc(var(--ibiz-spacing-base-loose) - var(--ibiz-spacing-super-tight));overflow:hidden;line-height:calc(var(--ibiz-spacing-base-loose) - var(--ibiz-spacing-super-tight));text-overflow:ellipsis;white-space:nowrap}.ibiz-view-message-carousel-alert__message{height:var(--ibiz-spacing-base);overflow:hidden;line-height:var(--ibiz-spacing-base);text-overflow:ellipsis;white-space:nowrap}