@ibiz-template/vue3-components 0.7.41-alpha.97 → 0.7.41-alpha.99

package/es/common/high-light-code/high-light-code-util.mjs

@@ -74,7 +74,6 @@ const highlight = (src) => {
   src = normalizeFunctionBody(src);
   let result = "";
   let i = 0;
-  console.log(src);
   while (i < src.length) {
     if (src[i] === "/" && src[i + 1] === "/") {
       let j = i;

package/es/common/map-chart/map-chart.css

@@ -1 +1 @@
-.ibiz-map-chart{position:relative;min-width:300px;min-height:300px}.ibiz-map-chart__chart{width:100%;height:100%}.ibiz-map-chart__goback{position:absolute;top:60px;right:0;width:100px;height:100px;font-size:var(--ibiz-font-size-header-4);color:var(--ibiz-color-link);text-decoration:underline;letter-spacing:6px;cursor:pointer}
+.ibiz-map-chart{--ibiz-control-map-goback-gap:6px;--ibiz-control-map-goback-size:100px;--ibiz-control-map-goback-text-color:var(--ibiz-color-link);--ibiz-control-map-goback-font-size:var(--ibiz-font-size-header-4);position:relative;min-width:300px;min-height:300px}.ibiz-map-chart__chart{width:100%;height:100%}.ibiz-map-chart__goback{position:absolute;top:60px;right:0;width:var(--ibiz-control-map-goback-size);height:var(--ibiz-control-map-goback-size);font-size:var(--ibiz-control-map-goback-font-size);color:var(--ibiz-control-map-goback-text-color);text-decoration:underline;letter-spacing:var(--ibiz-control-map-goback-gap);cursor:pointer}

package/es/common/map-chart/map-chart.mjs

@@ -1,6 +1,6 @@
 import { defineComponent, createVNode, computed, onMounted } from 'vue';
 import { mergeDeepWithKey, isNil } from 'ramda';
-import { useNamespace } from '@ibiz-template/vue3-util';
+import { useNamespace, useSemanticNode } from '@ibiz-template/vue3-util';
 import { MapController } from '@ibiz-template/runtime';
 import { defaultOpts } from './map-chart.util.mjs';
 import { useMapManager } from './map-manager.mjs';
@@ -29,6 +29,10 @@ const IBizMapChart = /* @__PURE__ */ defineComponent({
     emit
   }) {
     const ns = useNamespace("map-chart");
+    const {
+      semanticClass,
+      semanticStyle
+    } = useSemanticNode(props.controller);
     const options = computed(() => {
       return mergeDeepWithKey((_key, x, z) => {
         return isNil(z) ? x : z;
@@ -195,6 +199,8 @@ const IBizMapChart = /* @__PURE__ */ defineComponent({
       ns,
       chartRef,
       historyNames,
+      semanticClass,
+      semanticStyle,
       goBack
     };
   },
@@ -205,7 +211,8 @@ const IBizMapChart = /* @__PURE__ */ defineComponent({
       "class": this.ns.e("chart"),
       "ref": "chartRef"
     }, null), this.historyNames.length > 1 && createVNode("div", {
-      "class": this.ns.e("goback"),
+      "style": this.semanticStyle("goback"),
+      "class": [this.ns.e("goback"), this.semanticClass("goback")],
       "onClick": () => {
         this.goBack();
       }

package/es/common/map-chart-user/map-chart-user.css

@@ -1 +1 @@
-.ibiz-map-chart-user{position:relative;min-width:300px;min-height:300px}.ibiz-map-chart-user__chart{width:100%;height:100%}.ibiz-map-chart-user__goback{position:absolute;top:60px;right:0;width:100px;height:100px;font-size:var(--ibiz-font-size-header-4);color:var(--ibiz-color-link);text-decoration:underline;letter-spacing:6px;cursor:pointer}.ibiz-map-chart-user__fullscreen{position:absolute;top:var(--ibiz-spacing-tight);right:var(--ibiz-spacing-tight);z-index:9}.ibiz-map-chart-user__popper{padding:var(--ibiz-spacing-tight);white-space:pre}
+.ibiz-map-chart-user{--ibiz-control-map-goback-gap:6px;--ibiz-control-map-goback-size:100px;--ibiz-control-map-goback-text-color:var(--ibiz-color-link);--ibiz-control-map-goback-font-size:var(--ibiz-font-size-header-4);--ibiz-control-map-fullscreen-position:var(--ibiz-spacing-tight);position:relative;min-width:300px;min-height:300px}.ibiz-map-chart-user__chart{width:100%;height:100%}.ibiz-map-chart-user__goback{position:absolute;top:60px;right:0;width:var(--ibiz-control-map-goback-size);height:var(--ibiz-control-map-goback-size);font-size:var(--ibiz-control-map-goback-font-size);color:var(--ibiz-control-map-goback-text-color);text-decoration:underline;letter-spacing:var(--ibiz-control-map-goback-gap);cursor:pointer}.ibiz-map-chart-user__fullscreen{position:absolute;top:var(--ibiz-control-map-fullscreen-position);right:var(--ibiz-control-map-fullscreen-position);z-index:9}.ibiz-map-chart-user__popper{padding:var(--ibiz-spacing-tight);white-space:pre}

package/es/common/map-chart-user/map-chart-user.mjs

@@ -1,6 +1,6 @@
 import { defineComponent, createVNode, resolveComponent, ref, computed, onMounted, onBeforeUnmount } from 'vue';
 import { mergeDeepLeft, mergeDeepWithKey, isNil } from 'ramda';
-import { useNamespace } from '@ibiz-template/vue3-util';
+import { useNamespace, useSemanticNode } from '@ibiz-template/vue3-util';
 import { getAreaLevelByCode, MapController } from '@ibiz-template/runtime';
 import { NOOP, listenJSEvent } from '@ibiz-template/core';
 import { toNumber } from 'lodash-es';
@@ -29,6 +29,10 @@ const IBizMapChartUser = /* @__PURE__ */ defineComponent({
   },
   setup(props) {
     const ns = useNamespace("map-chart-user");
+    const {
+      semanticClass,
+      semanticStyle
+    } = useSemanticNode(props.controller);
     const c = props.controller;
     let option = defaultOpts;
     const mapRef = ref();
@@ -140,12 +144,14 @@ const IBizMapChartUser = /* @__PURE__ */ defineComponent({
       }
     };
     return {
-      ns,
       c,
+      ns,
       mapRef,
+      isFull,
       chartRef,
       historyNames,
-      isFull,
+      semanticClass,
+      semanticStyle,
       onBack,
       toggleFullScreen
     };
@@ -159,8 +165,9 @@ const IBizMapChartUser = /* @__PURE__ */ defineComponent({
       "ref": "mapRef"
     }, [enabledFullScreen ? createVNode(resolveComponent("el-button"), {
       "type": "info",
-      "class": this.ns.e("fullscreen"),
       "onClick": this.toggleFullScreen,
+      "style": this.semanticStyle("fullscreen"),
+      "class": [this.ns.e("fullscreen"), this.semanticClass("fullscreen")],
       "title": this.isFull ? ibiz.i18n.t("app.cancelFullscreen") : ibiz.i18n.t("app.fullscreen")
     }, {
       default: () => [createVNode("ion-icon", {
@@ -170,7 +177,8 @@ const IBizMapChartUser = /* @__PURE__ */ defineComponent({
       "class": this.ns.e("chart"),
       "ref": "chartRef"
     }, null), this.historyNames.length > 1 && createVNode("div", {
-      "class": this.ns.e("goback"),
+      "style": this.semanticStyle("goback"),
+      "class": [this.ns.e("goback"), this.semanticClass("goback")],
       "onClick": () => {
         this.onBack();
       }

package/es/common/pagination/pagination.css

@@ -1 +1 @@
-.ibiz-pagination{--ibiz-pagination-text-color:var(--ibiz-color-text-2);--ibiz-pagination-height:50px;--ibiz-pagination-padding:0 var(--ibiz-spacing-base-tight);display:flex;justify-content:flex-end;height:var(--ibiz-pagination-height);padding:var(--ibiz-pagination-padding)}.ibiz-pagination .el-pagination{overflow:auto;font-size:var(--ibiz-font-size-regular);font-weight:var(--ibiz-font-weight-regular);color:var(--ibiz-pagination-text-color)}.ibiz-pagination .el-pagination .ibiz-pagination-btn{margin-right:var(--ibiz-spacing-tight)}.ibiz-pagination .el-pagination .ibiz-pagination-btn .el-button{color:var(--ibiz-pagination-text-color);border:1px solid var(--ibiz-color-border)}.ibiz-pagination .el-pagination .ibiz-pagination-btn .el-button ion-icon{width:var(--ibiz-width-icon-medium);height:var(--ibiz-width-icon-medium)}.ibiz-pagination .el-pagination .btn-next,.ibiz-pagination .el-pagination .btn-prev{border:1px solid var(--ibiz-color-border)}.ibiz-pagination .el-pagination .el-pager li{color:var(--ibiz-pagination-text-color);border:1px solid var(--ibiz-color-border)}.ibiz-pagination .el-pagination .el-pager li.is-active{color:var(--ibiz-color-primary-text);background-color:var(--ibiz-color-primary)}.ibiz-pagination .el-pagination .el-pagination__sizes{margin-left:var(--ibiz-spacing-tight);border:1px solid var(--ibiz-color-border)}.ibiz-pagination .el-pagination .el-pagination__sizes .el-select .el-input__wrapper{background-color:transparent}.ibiz-pagination .el-pagination .el-pagination__sizes .el-input__inner{color:var(--ibiz-pagination-text-color)}.ibiz-pagination .el-pagination .el-pagination__jump{color:var(--ibiz-pagination-text-color)}.ibiz-pagination .el-pagination .el-pagination__jump .el-pagination__editor{border:1px solid var(--ibiz-color-border)}.ibiz-pagination .el-pagination .el-pagination__jump .el-pagination__editor .el-input__wrapper{background-color:transparent}.ibiz-pagination-simple .el-pager .number{display:none}.ibiz-pagination-simple .el-pager .number.is-active{display:block}.ibiz-pagination-simple .el-pager .more{display:none}
+.ibiz-pagination{--ibiz-pagination-font-size:var(--ibiz-font-size-regular);--ibiz-pagination-font-weight:var(--ibiz-font-weight-regular);--ibiz-pagination-color:var(--ibiz-color-text-2);--ibiz-pagination-height:50px;--ibiz-pagination-padding:0 var(--ibiz-spacing-base-tight);--ibiz-pagination-item-color:var(--ibiz-pagination-color);--ibiz-pagination-item-active-color:var(--ibiz-color-primary-text);--ibiz-pagination-item-active-bg-color:var(--ibiz-color-primary);--ibiz-pagination-item-gap:var(--ibiz-spacing-tight);--ibiz-pagination-item-border:1px solid var(--ibiz-color-border);--ibiz-pagination-item-icon-size:var(--ibiz-width-icon-medium);display:flex;justify-content:flex-end;height:var(--ibiz-pagination-height);padding:var(--ibiz-pagination-padding)}.ibiz-pagination .el-pagination{overflow:auto;font-size:var(--ibiz-pagination-font-size);font-weight:var(--ibiz-pagination-font-weight);color:var(--ibiz-pagination-color)}.ibiz-pagination .el-pagination .ibiz-pagination-btn{margin-right:var(--ibiz-pagination-item-gap)}.ibiz-pagination .el-pagination .ibiz-pagination-btn .el-button{color:var(--ibiz-pagination-item-color);border:var(--ibiz-pagination-item-border)}.ibiz-pagination .el-pagination .ibiz-pagination-btn .el-button ion-icon{width:var(--ibiz-pagination-item-icon-size);height:var(--ibiz-pagination-item-icon-size)}.ibiz-pagination .el-pagination .btn-next,.ibiz-pagination .el-pagination .btn-prev{border:var(--ibiz-pagination-item-border)}.ibiz-pagination .el-pagination .el-pager li{color:var(--ibiz-pagination-item-color);border:var(--ibiz-pagination-item-border)}.ibiz-pagination .el-pagination .el-pager li.is-active{color:var(--ibiz-pagination-item-active-color);background-color:var(--ibiz-pagination-item-active-bg-color)}.ibiz-pagination .el-pagination .el-pagination__sizes{margin-left:var(--ibiz-pagination-item-gap);border:var(--ibiz-pagination-item-border)}.ibiz-pagination .el-pagination .el-pagination__sizes .el-select .el-input__wrapper{background-color:transparent}.ibiz-pagination .el-pagination .el-pagination__sizes .el-input__inner{color:var(--ibiz-pagination-item-color)}.ibiz-pagination .el-pagination .el-pagination__jump{color:var(--ibiz-pagination-item-color)}.ibiz-pagination .el-pagination .el-pagination__jump .el-pagination__editor{border:var(--ibiz-pagination-item-border)}.ibiz-pagination .el-pagination .el-pagination__jump .el-pagination__editor .el-input__wrapper{background-color:transparent}.ibiz-pagination-simple .el-pager .number{display:none}.ibiz-pagination-simple .el-pager .number.is-active{display:block}.ibiz-pagination-simple .el-pager .more{display:none}

package/es/common/pagination/pagination.mjs

@@ -31,6 +31,39 @@ const IBizPagination = /* @__PURE__ */ defineComponent({
     mode: {
       type: String,
       default: "default"
+    },
+    semantic: {
+      type: Object,
+      default: () => ({
+        refresh: {
+          class: "",
+          style: ""
+        },
+        description: {
+          class: "",
+          style: ""
+        },
+        item: {
+          class: "",
+          style: ""
+        },
+        prev: {
+          class: "",
+          style: ""
+        },
+        next: {
+          class: "",
+          style: ""
+        },
+        sizes: {
+          class: "",
+          style: ""
+        },
+        jump: {
+          class: "",
+          style: ""
+        }
+      })
     }
   },
   emits: ["change", "pageSizeChange", "pageRefresh"],
@@ -108,7 +141,8 @@ const IBizPagination = /* @__PURE__ */ defineComponent({
       onChange: this.inputChange
     }), {
       default: () => [createVNode("span", {
-        "class": this.ns.b("btn")
+        "class": [this.ns.b("btn"), this.semantic.refresh.class],
+        "style": this.semantic.refresh.style
       }, [createVNode(resolveComponent("el-button"), {
         "title": showTitle(ibiz.i18n.t("app.refresh")),
         "onClick": this.pageRefresh
@@ -116,7 +150,13 @@ const IBizPagination = /* @__PURE__ */ defineComponent({
         default: () => [createVNode("ion-icon", {
           "name": "refresh-outline"
         }, null)]
-      })]), isNil(this.totalPages) || this.calcTotalPages === this.totalPages ? createVNode("span", null, [ibiz.i18n.t("component.pagination.display"), createTextVNode("\xA0"), this.start, createTextVNode("\xA0-\xA0"), this.end, createTextVNode("\xA0"), ibiz.i18n.t("component.pagination.piece"), createTextVNode("\uFF0C")]) : null, createVNode("span", null, [ibiz.i18n.t("component.pagination.total"), createTextVNode("\xA0"), this.total, createTextVNode("\xA0"), ibiz.i18n.t("component.pagination.pieceData")])]
+      })]), isNil(this.totalPages) || this.calcTotalPages === this.totalPages ? createVNode("span", {
+        "class": [this.ns.b("desc"), this.semantic.description.class],
+        "style": this.semantic.description.style
+      }, [ibiz.i18n.t("component.pagination.display"), createTextVNode("\xA0"), this.start, createTextVNode("\xA0-\xA0"), this.end, createTextVNode("\xA0"), ibiz.i18n.t("component.pagination.piece"), createTextVNode("\uFF0C")]) : null, createVNode("span", {
+        "class": [this.ns.b("desc"), this.semantic.description.class],
+        "style": this.semantic.description.style
+      }, [ibiz.i18n.t("component.pagination.total"), createTextVNode("\xA0"), this.total, createTextVNode("\xA0"), ibiz.i18n.t("component.pagination.pieceData")])]
     })]);
   }
 });

package/es/common/rawitem/rawitem.css

@@ -1 +1 @@
-.ibiz-rawitem{width:100%;height:100%;font-size:var(--ibiz-font-size-regular);color:var(--ibiz-editor-default-text-color)}.ibiz-rawitem .ibiz-icon{width:100%;height:100%}.ibiz-rawitem .el-alert{margin:var(--ibiz-spacing-extra-tight) 0}
+.ibiz-rawitem{--ibiz-rawitem-text-color:var(--ibiz-editor-default-text-color);--ibiz-rawitem-font-size:var(--ibiz-font-size-regular);--ibiz-rawitem-alert-margin:var(--ibiz-spacing-extra-tight) 0;--ibiz-rawitem-divider-margin:var(--ibiz-spacing-loose) 0;width:100%;height:100%;font-size:var(--ibiz-rawitem-font-size);color:var(--ibiz-rawitem-text-color)}.ibiz-rawitem .ibiz-icon{width:100%;height:100%}.ibiz-rawitem .el-alert{margin:var(--ibiz-rawitem-alert-margin)}.ibiz-rawitem .el-divider--horizontal{margin:var(--ibiz-rawitem-divider-margin)}

package/es/common/rawitem/rawitem.mjs

@@ -269,6 +269,7 @@ const IBizRawItem = /* @__PURE__ */ defineComponent({
       }
       if (this.rawItemType === "DIVIDER") {
         return createVNode(resolveComponent("el-divider"), {
+          "class": this.ns.e("divider"),
           "content-position": this.dividerParams.contentPosition
         }, {
           default: () => [createVNode("span", {
@@ -278,6 +279,7 @@ const IBizRawItem = /* @__PURE__ */ defineComponent({
       }
       if (this.rawItemType === "INFO" || this.rawItemType === "WARNING" || this.rawItemType === "ERROR") {
         return createVNode(resolveComponent("el-alert"), {
+          "class": this.ns.e("alert"),
           "title": this.alertParams.title,
           "type": this.alertParams.type,
           "show-icon": this.alertParams.showIcon,

package/es/common/sort-bar/sort-bar.css

@@ -1 +1 @@
-.ibiz-sort-bar{--ibiz-sort-bar-icon-color:var(--ibiz-color-disabled-text);--ibiz-sort-bar-border-radius:var(--ibiz-border-radius-small);display:flex;align-items:center;justify-content:flex-start;padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base)}.ibiz-sort-bar-item{padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);margin-right:-1px;font-size:var(--ibiz-font-size-regular);line-height:1;color:var(--ibiz-color-text-2);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;background-color:var(--ibiz-color-bg-1);border:1px solid var(--ibiz-color-border)}.ibiz-sort-bar-item:first-child{border-top-left-radius:var(--ibiz-sort-bar-border-radius);border-bottom-left-radius:var(--ibiz-sort-bar-border-radius)}.ibiz-sort-bar-item:last-child{border-top-right-radius:var(--ibiz-sort-bar-border-radius);border-bottom-right-radius:var(--ibiz-sort-bar-border-radius)}.ibiz-sort-bar-item--asc .ibiz-sort-bar-icon-wrapper__icon-asc{border-bottom-color:var(--ibiz-color-primary)}.ibiz-sort-bar-item--desc .ibiz-sort-bar-icon-wrapper__icon-desc{border-top-color:var(--ibiz-color-primary)}.ibiz-sort-bar-icon-wrapper{position:relative;display:inline-block;width:10px;height:14px;margin-left:var(--ibiz-spacing-tight);vertical-align:middle}.ibiz-sort-bar-icon-wrapper__icon-asc{position:absolute;top:-5px;left:0;width:0;height:0;border:solid 5px transparent;border-bottom-color:var(--ibiz-sort-bar-icon-color)}.ibiz-sort-bar-icon-wrapper__icon-desc{position:absolute;bottom:-3px;left:0;width:0;height:0;border:solid 5px transparent;border-top-color:var(--ibiz-sort-bar-icon-color)}
+.ibiz-sort-bar{--ibiz-sort-bar-border-radius:var(--ibiz-border-radius-small);--ibiz-sort-bar-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-sort-bar-item-text-color:var(--ibiz-color-text-2);--ibiz-sort-bar-item-font-size:var(--ibiz-font-size-regular);--ibiz-sort-bar-item-font-weight:var(--ibiz-font-weight-regular);--ibiz-sort-bar-item-bg-color:var(--ibiz-color-bg-1);--ibiz-sort-bar-item-active-color:var(--ibiz-color-primary);--ibiz-sort-bar-item-icon-color:var(--ibiz-color-disabled-text);--ibiz-sort-bar-item-border-color:var(--ibiz-control-dataview-border-color);--ibiz-sort-bar-item-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);display:flex;align-items:center;justify-content:flex-start;padding:var(--ibiz-sort-bar-padding)}.ibiz-sort-bar-item{padding:var(--ibiz-sort-bar-item-padding);margin-right:-1px;font-size:var(--ibiz-sort-bar-item-font-size);font-weight:var(--ibiz-sort-bar-item-font-weight);line-height:1;color:var(--ibiz-sort-bar-item-text-color);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;background-color:var(--ibiz-sort-bar-item-bg-color);border:1px solid var(--ibiz-sort-bar-item-border-color)}.ibiz-sort-bar-item:first-child{border-top-left-radius:var(--ibiz-sort-bar-border-radius);border-bottom-left-radius:var(--ibiz-sort-bar-border-radius)}.ibiz-sort-bar-item:last-child{border-top-right-radius:var(--ibiz-sort-bar-border-radius);border-bottom-right-radius:var(--ibiz-sort-bar-border-radius)}.ibiz-sort-bar-item--asc .ibiz-sort-bar-icon-wrapper__icon-asc{border-bottom-color:var(--ibiz-sort-bar-item-active-color)}.ibiz-sort-bar-item--desc .ibiz-sort-bar-icon-wrapper__icon-desc{border-top-color:var(--ibiz-sort-bar-item-active-color)}.ibiz-sort-bar-icon-wrapper{position:relative;display:inline-block;width:10px;height:14px;margin-left:var(--ibiz-spacing-tight);vertical-align:middle}.ibiz-sort-bar-icon-wrapper__icon-asc{position:absolute;top:-5px;left:0;width:0;height:0;border:solid 5px transparent;border-bottom-color:var(--ibiz-sort-bar-item-icon-color)}.ibiz-sort-bar-icon-wrapper__icon-desc{position:absolute;bottom:-3px;left:0;width:0;height:0;border:solid 5px transparent;border-top-color:var(--ibiz-sort-bar-item-icon-color)}

package/es/common/sort-bar/sort-bar.mjs

@@ -9,6 +9,13 @@ const IBizSortBar = /* @__PURE__ */ defineComponent({
     sortItems: {
       type: Array,
       required: true
+    },
+    semantic: {
+      type: Object,
+      default: () => ({
+        class: "",
+        style: ""
+      })
     }
   },
   emits: {
@@ -42,7 +49,8 @@ const IBizSortBar = /* @__PURE__ */ defineComponent({
     }, [this.sortItems.length > 0 && this.sortItems.map((item) => {
       return createVNode("div", {
         "onClick": () => this.onItemClick(item),
-        "class": [this.ns.b("item"), item.order === "asc" ? this.ns.bm("item", "asc") : "", item.order === "desc" ? this.ns.bm("item", "desc") : ""]
+        "class": [this.ns.b("item"), item.order === "asc" ? this.ns.bm("item", "asc") : "", item.order === "desc" ? this.ns.bm("item", "desc") : "", this.semantic.class],
+        "style": this.semantic.style
       }, [item.caption, createVNode("div", {
         "class": this.ns.b("icon-wrapper")
       }, [createVNode("i", {

package/es/control/app-menu/app-menu.css

@@ -1 +1 @@
-@charset "UTF-8";.ibiz-control-appmenu{position:relative;width:100%;height:100%;--ibiz-control-appmenu-collapse-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-collapse-item-padding:var(--ibiz-spacing-base);--ibiz-control-appmenu-icon-width:var(--ibiz-width-icon-large);--ibiz-control-appmenu-icon-height:var(--ibiz-width-icon-large);--ibiz-control-appmenu-icon-margin:0 var(--ibiz-spacing-tight) 0 0;--ibiz-control-appmenu-icon-position:calc(var(--ibiz-spacing-base) - 2px);--ibiz-control-appmenu-icon-size:var(--ibiz-width-icon-medium);--ibiz-control-appmenu-collapse-height:var(--ibiz-spacing-super-loose);--ibiz-control-appmenu-scorll-color:var(--ibiz-color-scroll-menu);--ibiz-control-appmenu-item-selected-border-color:transparent;--ibiz-control-appmenu-item-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-padding:var(--ibiz-spacing-tight);--ibiz-control-appmenu-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-appmenu-item-border:2px solid var(--ibiz-color-text-1);--ibiz-control-appmenu-item-font-size:var(--ibiz-font-size-header-6);--ibiz-control-appmenu-item-height:42px;--ibiz-control-appmenu-item-gap:2px;--ibiz-control-appmenu-item-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-separator-color:var(--ibiz-color-scroll-menu);--ibiz-control-appmenu-item-horizontal-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-horizontal-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-horizontal-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-horizontal-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-horizontal-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-font-size:var(--ibiz-font-size-header-5);--ibiz-control-appmenu-item-horizontal-height:100%;--ibiz-control-appmenu-item-horizontal-border-radius:0;--ibiz-control-appmenu-item-horizontal-padding:0 var(--ibiz-spacing-base-loose);--ibiz-control-appmenu-item-horizontal-padding-right:calc(var(--ibiz-width-icon-large) + var(--ibiz-spacing-base-loose));--ibiz-control-appmenu-item-horizontal-popup-height:40px}.ibiz-control-appmenu>.el-menu{height:100%;padding:var(--ibiz-spacing-none) var(--ibiz-spacing-base);overflow-y:auto;border-right:0;--el-menu-hover-text-color:var(--ibiz-control-appmenu-item-color);--el-menu-hover-bg-color:transparent;--ibiz-control-appmenu-item-selected-border-color:transparent;--ibiz-control-appmenu-item-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-padding:var(--ibiz-spacing-tight);--ibiz-control-appmenu-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-appmenu-item-border:2px solid var(--ibiz-color-text-1);--ibiz-control-appmenu-item-font-size:var(--ibiz-font-size-header-6);--ibiz-control-appmenu-item-height:42px;--ibiz-control-appmenu-item-gap:2px;--ibiz-control-appmenu-item-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-separator-color:var(--ibiz-color-scroll-menu);--ibiz-control-appmenu-item-horizontal-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-horizontal-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-horizontal-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-horizontal-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-horizontal-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-font-size:var(--ibiz-font-size-header-5);--ibiz-control-appmenu-item-horizontal-height:100%;--ibiz-control-appmenu-item-horizontal-border-radius:0;--ibiz-control-appmenu-item-horizontal-padding:0 var(--ibiz-spacing-base-loose);--ibiz-control-appmenu-item-horizontal-padding-right:calc(var(--ibiz-width-icon-large) + var(--ibiz-spacing-base-loose));--ibiz-control-appmenu-item-horizontal-popup-height:40px}.ibiz-control-appmenu>.el-menu .ibiz-control-appmenu__rawitem{min-height:var(--ibiz-control-appmenu-item-height);line-height:var(--ibiz-control-appmenu-item-height)}.ibiz-control-appmenu>.el-menu .ibiz-control-appmenu__rawitem .ibiz-rawitem{display:flex;align-items:center;justify-content:flex-start;font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-color)}.ibiz-control-appmenu>.el-menu .ibiz-control-appmenu__rawitem .ibiz-rawitem *{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-appmenu .ibiz-control-appmenu-groupmenu .el-menu-item-group__title{padding:var(--ibiz-spacing-extra-tight) 0 var(--ibiz-spacing-extra-tight) 10px;font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-horizontal-color)}.ibiz-control-appmenu .ibiz-control-appmenu-groupmenu>ul>.el-menu-item{padding:0 var(--ibiz-spacing-extra-loose)}.ibiz-control-appmenu .ibiz-control-appmenu-groupmenu>ul>.el-divider{width:calc(100% - 40px);margin:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose)}.ibiz-control-appmenu .el-sub-menu .el-sub-menu__icon-arrow{right:10px;width:var(--ibiz-control-appmenu-icon-width);height:var(--ibiz-control-appmenu-icon-height);margin-top:-10px;font-size:var(--ibiz-control-appmenu-icon-width)}.ibiz-control-appmenu .el-sub-menu .el-menu-item{padding:calc(var(--ibiz-control-appmenu-item-padding) * .875) calc(var(--ibiz-control-appmenu-item-padding) * 2.5)}.ibiz-control-appmenu .el-sub-menu .el-sub-menu__title>.ibiz-control-appmenu__counter{right:30px}.ibiz-control-appmenu .el-menu--vertical{width:100%}.ibiz-control-appmenu .el-menu--vertical .el-menu-item,.ibiz-control-appmenu .el-menu--vertical .el-menu-item-group__title,.ibiz-control-appmenu .el-menu--vertical .el-sub-menu__title{display:flex;align-items:center;justify-content:flex-start;--el-menu-base-level-padding:var(--ibiz-control-appmenu-item-padding);width:100%;height:var(--ibiz-control-appmenu-item-height);font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-color);white-space:nowrap;border-radius:var(--ibiz-control-appmenu-item-border-radius)}.ibiz-control-appmenu .el-menu--vertical .el-menu-item-group__title.is-active,.ibiz-control-appmenu .el-menu--vertical .el-menu-item.is-active,.ibiz-control-appmenu .el-menu--vertical .el-sub-menu__title.is-active{color:var(--ibiz-control-appmenu-item-selected-color)!important;background-color:var(--ibiz-control-appmenu-item-selected-bg-color)}.ibiz-control-appmenu .el-menu--vertical .el-menu-item-group__title:hover,.ibiz-control-appmenu .el-menu--vertical .el-menu-item:hover,.ibiz-control-appmenu .el-menu--vertical .el-sub-menu__title:hover{color:var(--ibiz-control-appmenu-item-hover-color);background-color:var(--ibiz-control-appmenu-item-hover-bg-color)}.ibiz-control-appmenu .el-menu--vertical .el-menu-item .ibiz-control-appmenu__caption,.ibiz-control-appmenu .el-menu--vertical .el-menu-item-group__title .ibiz-control-appmenu__caption,.ibiz-control-appmenu .el-menu--vertical .el-sub-menu__title .ibiz-control-appmenu__caption{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-appmenu .el-menu--vertical .el-menu-item+.el-menu-item{margin-top:var(--ibiz-control-appmenu-item-gap)}.ibiz-control-appmenu .el-menu--vertical .el-sub-menu+.el-menu-item{margin-top:var(--ibiz-control-appmenu-item-gap)}.ibiz-control-appmenu .el-menu--vertical .el-sub-menu+.el-sub-menu{margin-top:var(--ibiz-control-appmenu-item-gap)}.ibiz-control-appmenu .el-menu--vertical .el-menu-item+.el-sub-menu{margin-top:var(--ibiz-control-appmenu-item-gap)}.ibiz-control-appmenu .el-menu--vertical .el-sub-menu__title+.el-menu{margin-top:var(--ibiz-control-appmenu-item-gap)}.ibiz-control-appmenu .el-menu--vertical::-webkit-scrollbar-thumb{background-color:var(--ibiz-control-appmenu-scorll-color)}.ibiz-control-appmenu .el-menu--horizontal{align-items:center;height:100%;padding:var(--ibiz-spacing-none) var(--ibiz-spacing-base-tight);overflow-x:hidden;background-color:transparent;border-bottom:none}.ibiz-control-appmenu .el-menu--horizontal .el-menu-item,.ibiz-control-appmenu .el-menu--horizontal .el-sub-menu__title{height:var(--ibiz-control-appmenu-item-horizontal-height);padding:var(--ibiz-control-appmenu-item-horizontal-padding);font-size:var(--ibiz-control-appmenu-item-horizontal-font-size);line-height:var(--ibiz-control-appmenu-item-horizontal-height);color:var(--ibiz-control-appmenu-item-horizontal-color);white-space:nowrap;border-width:0;border-radius:var(--ibiz-control-appmenu-item-horizontal-border-radius)}.ibiz-control-appmenu .el-menu--horizontal .el-menu-item:hover,.ibiz-control-appmenu .el-menu--horizontal .el-sub-menu__title:hover{color:var(--ibiz-control-appmenu-item-horizontal-hover-color);background-color:var(--ibiz-control-appmenu-item-horizontal-hover-bg-color)}.ibiz-control-appmenu .el-menu--horizontal .el-menu-item.is-active,.ibiz-control-appmenu .el-menu--horizontal .el-sub-menu__title.is-active{color:var(--ibiz-control-appmenu-item-selected-color)!important;background-color:var(--ibiz-control-appmenu-item-horizontal-selected-bg-color);border-top:var(--ibiz-control-appmenu-item-border)}.ibiz-control-appmenu .el-menu--horizontal .el-menu-item .el-sub-menu__icon-arrow,.ibiz-control-appmenu .el-menu--horizontal .el-sub-menu__title .el-sub-menu__icon-arrow{right:var(--ibiz-control-appmenu-icon-position)}.ibiz-control-appmenu .el-menu--horizontal .el-sub-menu{height:var(--ibiz-control-appmenu-item-horizontal-height)}.ibiz-control-appmenu .el-menu--horizontal .el-sub-menu>.el-sub-menu__title{padding-right:var(--ibiz-control-appmenu-item-horizontal-padding-right)}.ibiz-control-appmenu .el-menu--horizontal>.el-sub-menu:hover .el-sub-menu__title{color:var(--ibiz-control-appmenu-item-horizontal-hover-color);background-color:var(--ibiz-control-appmenu-item-horizontal-hover-bg-color)}.ibiz-control-appmenu .el-menu--horizontal>.el-sub-menu.is-active .el-sub-menu__title{color:var(--ibiz-control-appmenu-item-horizontal-selected-color);background-color:var(--ibiz-control-appmenu-item-horizontal-selected-bg-color);border-top:var(--ibiz-control-appmenu-item-border);border-bottom:0}.ibiz-control-appmenu .el-menu--horizontal::-webkit-scrollbar-thumb{background-color:var(--ibiz-control-appmenu-scorll-color)}.ibiz-control-appmenu .el-menu--horizontal .el-divider--vertical{border-color:var(--ibiz-color-border)}.ibiz-control-appmenu__icon{display:flex;align-items:center;justify-content:center;width:var(--ibiz-control-appmenu-icon-width);height:var(--ibiz-control-appmenu-icon-height);margin:var(--ibiz-control-appmenu-icon-margin);font-size:var(--ibiz-control-appmenu-icon-size)}.ibiz-control-appmenu__icon>svg{max-width:var(--ibiz-control-appmenu-icon-width);max-height:var(--ibiz-control-appmenu-icon-height)}.ibiz-control-appmenu.is-collapse>.el-menu.el-menu--vertical{padding:0 var(--ibiz-spacing-tight)}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu__icon{margin:var(--ibiz-spacing-none)}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu__item{display:flex;align-items:center;justify-content:center;padding:var(--ibiz-spacing-none);margin-bottom:var(--ibiz-spacing-tight)}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu-tooltip{width:100%}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu-submenu{display:block}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu-submenu>.el-sub-menu__title{display:flex;align-items:center;justify-content:center;display:flex;align-items:center;justify-content:center;padding:var(--ibiz-spacing-none);margin-bottom:var(--ibiz-spacing-tight);white-space:nowrap;cursor:pointer}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu-submenu .ibiz-control-appmenu-submenu__item{padding:var(--ibiz-spacing-none)}.ibiz-control-appmenu.is-show-collapse>.el-menu{height:calc(100% - var(--ibiz-control-appmenu-collapse-height));padding:0 var(--ibiz-spacing-base)}.ibiz-control-appmenu .ibiz-control-appmenu__counter{position:absolute;top:50%;right:5px;transform:translateY(-50%)}.ibiz-control-appmenu.is-scroll .el-menu.el-menu--vertical{padding-right:var(--ibiz-spacing-extra-tight)}.ibiz-control-appmenu-popup-container{--el-menu-hover-text-color:var(--ibiz-control-appmenu-item-color);--el-menu-hover-bg-color:transparent;--ibiz-control-appmenu-item-selected-border-color:transparent;--ibiz-control-appmenu-item-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-padding:var(--ibiz-spacing-tight);--ibiz-control-appmenu-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-appmenu-item-border:2px solid var(--ibiz-color-text-1);--ibiz-control-appmenu-item-font-size:var(--ibiz-font-size-header-6);--ibiz-control-appmenu-item-height:42px;--ibiz-control-appmenu-item-gap:2px;--ibiz-control-appmenu-item-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-separator-color:var(--ibiz-color-scroll-menu);--ibiz-control-appmenu-item-horizontal-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-horizontal-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-horizontal-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-horizontal-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-horizontal-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-font-size:var(--ibiz-font-size-header-5);--ibiz-control-appmenu-item-horizontal-height:100%;--ibiz-control-appmenu-item-horizontal-border-radius:0;--ibiz-control-appmenu-item-horizontal-padding:0 var(--ibiz-spacing-base-loose);--ibiz-control-appmenu-item-horizontal-padding-right:calc(var(--ibiz-width-icon-large) + var(--ibiz-spacing-base-loose));--ibiz-control-appmenu-item-horizontal-popup-height:40px}.ibiz-control-appmenu-popup-container .ibiz-control-appmenu__rawitem{min-height:var(--ibiz-control-appmenu-item-height);line-height:var(--ibiz-control-appmenu-item-height)}.ibiz-control-appmenu-popup-container .ibiz-control-appmenu__rawitem .ibiz-rawitem{display:flex;align-items:center;justify-content:flex-start;font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-color)}.ibiz-control-appmenu-popup-container .ibiz-control-appmenu__rawitem .ibiz-rawitem *{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-appmenu-popup-container .ibiz-control-appmenu-popup-container__extview1.el-menu--popup-container .el-menu--popup{padding:var(--ibiz-spacing-extra-tight) 0!important}.ibiz-control-appmenu-popup-container.el-menu--popup-container{--ibiz-control-appmenu-collapse-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-collapse-item-padding:var(--ibiz-spacing-base);--ibiz-control-appmenu-icon-width:var(--ibiz-width-icon-large);--ibiz-control-appmenu-icon-height:var(--ibiz-width-icon-large);--ibiz-control-appmenu-icon-margin:0 var(--ibiz-spacing-tight) 0 0;--ibiz-control-appmenu-icon-position:calc(var(--ibiz-spacing-base) - 2px);--ibiz-control-appmenu-icon-size:var(--ibiz-width-icon-medium);--ibiz-control-appmenu-collapse-height:var(--ibiz-spacing-super-loose);--ibiz-control-appmenu-scorll-color:var(--ibiz-color-scroll-menu);--ibiz-control-appmenu-item-selected-border-color:transparent;--ibiz-control-appmenu-item-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-padding:var(--ibiz-spacing-tight);--ibiz-control-appmenu-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-appmenu-item-border:2px solid var(--ibiz-color-text-1);--ibiz-control-appmenu-item-font-size:var(--ibiz-font-size-header-6);--ibiz-control-appmenu-item-height:42px;--ibiz-control-appmenu-item-gap:2px;--ibiz-control-appmenu-item-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-separator-color:var(--ibiz-color-scroll-menu);--ibiz-control-appmenu-item-horizontal-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-horizontal-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-horizontal-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-horizontal-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-horizontal-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-font-size:var(--ibiz-font-size-header-5);--ibiz-control-appmenu-item-horizontal-height:100%;--ibiz-control-appmenu-item-horizontal-border-radius:0;--ibiz-control-appmenu-item-horizontal-padding:0 var(--ibiz-spacing-base-loose);--ibiz-control-appmenu-item-horizontal-padding-right:calc(var(--ibiz-width-icon-large) + var(--ibiz-spacing-base-loose));--ibiz-control-appmenu-item-horizontal-popup-height:40px;border:none;box-shadow:var(--ibiz-shadow-elevated)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup{max-height:100vh;padding:var(--ibiz-spacing-extra-tight);overflow:auto;background-color:var(--ibiz-color-primary)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .ibiz-control-appmenu-groupmenu .el-menu-item-group__title{padding:var(--ibiz-spacing-extra-tight) 0 var(--ibiz-spacing-extra-tight) 10px;font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-horizontal-color)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .ibiz-control-appmenu-groupmenu>ul>.el-menu-item{padding:0 var(--ibiz-spacing-extra-loose)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .ibiz-control-appmenu-groupmenu>ul>.el-divider{width:calc(100% - 40px);margin:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-menu-item,.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-sub-menu__title{display:flex;align-items:center;justify-content:flex-start;width:100%;height:var(--ibiz-control-appmenu-item-horizontal-popup-height);font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-horizontal-color);white-space:nowrap;border-radius:var(--ibiz-control-appmenu-item-horizontal-border-radius)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-menu-item.is-active,.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-sub-menu__title.is-active{color:var(--ibiz-control-appmenu-item-horizontal-selected-color);background-color:var(--ibiz-control-appmenu-item-horizontal-selected-bg-color)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-menu-item:hover,.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-sub-menu__title:hover{color:var(--ibiz-control-appmenu-item-hover-color);background-color:var(--ibiz-control-appmenu-item-hover-bg-color)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-menu-item .el-icon,.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-sub-menu__title .el-icon{display:none}.ibiz-control-appmenu-popup-container .ibiz-control-appmenu__counter{position:absolute;top:50%;right:5px;height:20px;padding:var(--ibiz-spacing-none) var(--ibiz-spacing-tight);line-height:initial;color:var(--ibiz-color-danger-text);background-color:var(--ibiz-color-danger);border-radius:var(--ibiz-border-radius-medium);transform:translateY(-50%)}.ibiz-control-appmenu .ibiz-control-appmenu-collapse-icon{position:absolute;right:var(--ibiz-spacing-base-tight);bottom:var(--ibiz-spacing-tight);font-size:var(--ibiz-font-size-header-5);cursor:pointer}.ibiz-control-appmenu .ibiz-control-appmenu-collapse-icon.is-collapse{transform:rotate(180deg)}.ibiz-control-appmenu .ibiz-control-appmenu-menu-set{position:absolute;bottom:var(--ibiz-spacing-tight);left:var(--ibiz-spacing-base-tight);font-size:var(--ibiz-font-size-header-5);cursor:pointer}.ibiz-control-appmenu .ibiz-control-appmenu-menu-set.is-horizontal{right:0;bottom:0;left:unset;display:flex;align-items:center;height:100%}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu-collapse-icon{right:0;width:100%;text-align:center}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu-menu-set{position:absolute;right:var(--ibiz-spacing-base-tight);bottom:calc(var(--ibiz-spacing-tight) + 32px);font-size:var(--ibiz-font-size-header-5);text-align:center;cursor:pointer}.ibiz-control-appmenu.is-collapse.is-show-menu-design>.el-menu{height:calc(100% - var(--ibiz-control-appmenu-collapse-height) - var(--ibiz-control-appmenu-collapse-height))}.ibiz-control-appmenu__separator--horizontal{margin:var(--ibiz-spacing-tight) 0;border-color:var(--ibiz-control-appmenu-item-separator-color)}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu){--ibiz-control-appmenu-collapse-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-collapse-item-padding:var(--ibiz-spacing-base);--ibiz-control-appmenu-icon-width:var(--ibiz-width-icon-large);--ibiz-control-appmenu-icon-height:var(--ibiz-width-icon-large);--ibiz-control-appmenu-icon-margin:0 var(--ibiz-spacing-tight) 0 0;--ibiz-control-appmenu-icon-position:calc(var(--ibiz-spacing-base) - 2px);--ibiz-control-appmenu-icon-size:var(--ibiz-width-icon-medium);--ibiz-control-appmenu-collapse-height:var(--ibiz-spacing-super-loose);--ibiz-control-appmenu-scorll-color:var(--ibiz-color-scroll-menu);--ibiz-control-appmenu-item-selected-border-color:transparent;--ibiz-control-appmenu-item-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-padding:var(--ibiz-spacing-tight);--ibiz-control-appmenu-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-appmenu-item-border:2px solid var(--ibiz-color-text-1);--ibiz-control-appmenu-item-font-size:var(--ibiz-font-size-header-6);--ibiz-control-appmenu-item-height:42px;--ibiz-control-appmenu-item-gap:2px;--ibiz-control-appmenu-item-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-separator-color:var(--ibiz-color-scroll-menu);--ibiz-control-appmenu-item-horizontal-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-horizontal-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-horizontal-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-horizontal-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-horizontal-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-font-size:var(--ibiz-font-size-header-5);--ibiz-control-appmenu-item-horizontal-height:100%;--ibiz-control-appmenu-item-horizontal-border-radius:0;--ibiz-control-appmenu-item-horizontal-padding:0 var(--ibiz-spacing-base-loose);--ibiz-control-appmenu-item-horizontal-padding-right:calc(var(--ibiz-width-icon-large) + var(--ibiz-spacing-base-loose));--ibiz-control-appmenu-item-horizontal-popup-height:40px;border:none;box-shadow:var(--ibiz-shadow-elevated)}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup{padding:var(--ibiz-spacing-extra-tight);background-color:var(--ibiz-color-primary)}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-menu-item,.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-sub-menu__title{display:flex;align-items:center;justify-content:flex-start;width:100%;height:var(--ibiz-control-appmenu-item-horizontal-popup-height);font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-horizontal-color);white-space:nowrap;border-radius:var(--ibiz-control-appmenu-item-horizontal-border-radius)}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-menu-item.is-active,.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-sub-menu__title.is-active{color:var(--ibiz-control-appmenu-item-horizontal-selected-color);background-color:var(--ibiz-control-appmenu-item-horizontal-selected-bg-color)}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-menu-item:hover,.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-sub-menu__title:hover{color:var(--ibiz-control-appmenu-item-hover-color);background-color:var(--ibiz-control-appmenu-item-hover-bg-color)}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-menu-item .el-icon,.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-sub-menu__title .el-icon{display:none}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-menu-item.is-disabled:hover{background-color:var(--ibiz-control-appmenu-item-hover-bg-color)!important}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu .el-sub-menu.is-active>.el-sub-menu__title{color:var(--ibiz-control-appmenu-item-horizontal-selected-color)}
+.ibiz-control-appmenu{position:relative;width:100%;height:100%;--ibiz-control-appmenu-collapse-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-collapse-item-padding:var(--ibiz-spacing-base);--ibiz-control-appmenu-collapse-height:var(--ibiz-spacing-super-loose);--ibiz-control-appmenu-scorll-color:var(--ibiz-color-scroll-menu);--ibiz-control-appmenu-item-selected-border-color:transparent;--ibiz-control-appmenu-item-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-padding:var(--ibiz-spacing-tight);--ibiz-control-appmenu-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-appmenu-item-border:2px solid var(--ibiz-color-text-1);--ibiz-control-appmenu-item-font-size:var(--ibiz-font-size-header-6);--ibiz-control-appmenu-item-height:42px;--ibiz-control-appmenu-item-gap:2px;--ibiz-control-appmenu-item-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-horizontal-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-horizontal-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-horizontal-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-horizontal-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-font-size:var(--ibiz-font-size-header-5);--ibiz-control-appmenu-item-horizontal-height:100%;--ibiz-control-appmenu-item-horizontal-border-radius:0;--ibiz-control-appmenu-item-horizontal-padding:0 var(--ibiz-spacing-base-loose);--ibiz-control-appmenu-item-horizontal-padding-right:calc(var(--ibiz-width-icon-large) + var(--ibiz-spacing-base-loose));--ibiz-control-appmenu-item-horizontal-popup-height:40px;--ibiz-control-appmenu-submenu-gap:var(--ibiz-control-appmenu-item-gap);--ibiz-control-appmenu-item-icon-width:var(--ibiz-width-icon-large);--ibiz-control-appmenu-item-icon-height:var(--ibiz-width-icon-large);--ibiz-control-appmenu-item-icon-margin:0 var(--ibiz-spacing-tight) 0 0;--ibiz-control-appmenu-item-icon-position:calc(var(--ibiz-spacing-base) - 2px);--ibiz-control-appmenu-item-icon-size:var(--ibiz-width-icon-medium);--ibiz-control-appmenu-divider-color:var(--ibiz-color-scroll-menu);--ibiz-control-appmenu-divider-margin:var(--ibiz-spacing-tight) 0;--ibiz-control-appmenu-collapse-font-size:var(--ibiz-font-size-header-5);--ibiz-control-appmenu-collapse-bottom:var(--ibiz-spacing-tight);--ibiz-control-appmenu-collapse-right:var(--ibiz-spacing-base-tight)}.ibiz-control-appmenu>.el-menu{height:100%;padding:var(--ibiz-spacing-none) var(--ibiz-spacing-base);overflow-y:auto;border-right:0;--el-menu-hover-text-color:var(--ibiz-control-appmenu-item-color);--el-menu-hover-bg-color:transparent;--ibiz-control-appmenu-item-selected-border-color:transparent;--ibiz-control-appmenu-item-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-padding:var(--ibiz-spacing-tight);--ibiz-control-appmenu-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-appmenu-item-border:2px solid var(--ibiz-color-text-1);--ibiz-control-appmenu-item-font-size:var(--ibiz-font-size-header-6);--ibiz-control-appmenu-item-height:42px;--ibiz-control-appmenu-item-gap:2px;--ibiz-control-appmenu-item-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-horizontal-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-horizontal-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-horizontal-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-horizontal-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-font-size:var(--ibiz-font-size-header-5);--ibiz-control-appmenu-item-horizontal-height:100%;--ibiz-control-appmenu-item-horizontal-border-radius:0;--ibiz-control-appmenu-item-horizontal-padding:0 var(--ibiz-spacing-base-loose);--ibiz-control-appmenu-item-horizontal-padding-right:calc(var(--ibiz-width-icon-large) + var(--ibiz-spacing-base-loose));--ibiz-control-appmenu-item-horizontal-popup-height:40px}.ibiz-control-appmenu>.el-menu .ibiz-control-appmenu__rawitem{min-height:var(--ibiz-control-appmenu-item-height);line-height:var(--ibiz-control-appmenu-item-height)}.ibiz-control-appmenu>.el-menu .ibiz-control-appmenu__rawitem .ibiz-rawitem{display:flex;align-items:center;justify-content:flex-start;font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-color)}.ibiz-control-appmenu>.el-menu .ibiz-control-appmenu__rawitem .ibiz-rawitem *{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-appmenu .ibiz-control-appmenu-groupmenu .el-menu-item-group__title{padding:var(--ibiz-spacing-extra-tight) 0 var(--ibiz-spacing-extra-tight) 10px;font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-horizontal-color)}.ibiz-control-appmenu .ibiz-control-appmenu-groupmenu>ul>.el-menu-item{padding:0 var(--ibiz-spacing-extra-loose)}.ibiz-control-appmenu .ibiz-control-appmenu-groupmenu>ul>.el-divider{width:calc(100% - 40px);margin:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose)}.ibiz-control-appmenu .el-sub-menu .el-sub-menu__icon-arrow{right:10px;width:var(--ibiz-control-appmenu-item-icon-width);height:var(--ibiz-control-appmenu-item-icon-height);margin-top:-10px;font-size:var(--ibiz-control-appmenu-item-icon-width)}.ibiz-control-appmenu .el-sub-menu .el-menu-item{padding:calc(var(--ibiz-control-appmenu-item-padding) * .875) calc(var(--ibiz-control-appmenu-item-padding) * 2.5)}.ibiz-control-appmenu .el-sub-menu .el-sub-menu__title>.ibiz-control-appmenu__counter{right:30px}.ibiz-control-appmenu .el-menu--vertical{width:100%}.ibiz-control-appmenu .el-menu--vertical .el-menu-item,.ibiz-control-appmenu .el-menu--vertical .el-menu-item-group__title,.ibiz-control-appmenu .el-menu--vertical .el-sub-menu__title{display:flex;align-items:center;justify-content:flex-start;--el-menu-base-level-padding:var(--ibiz-control-appmenu-item-padding);width:100%;height:var(--ibiz-control-appmenu-item-height);font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-color);white-space:nowrap;border-radius:var(--ibiz-control-appmenu-item-border-radius)}.ibiz-control-appmenu .el-menu--vertical .el-menu-item-group__title.is-active,.ibiz-control-appmenu .el-menu--vertical .el-menu-item.is-active,.ibiz-control-appmenu .el-menu--vertical .el-sub-menu__title.is-active{color:var(--ibiz-control-appmenu-item-selected-color)!important;background-color:var(--ibiz-control-appmenu-item-selected-bg-color)}.ibiz-control-appmenu .el-menu--vertical .el-menu-item-group__title:hover,.ibiz-control-appmenu .el-menu--vertical .el-menu-item:hover,.ibiz-control-appmenu .el-menu--vertical .el-sub-menu__title:hover{color:var(--ibiz-control-appmenu-item-hover-color);background-color:var(--ibiz-control-appmenu-item-hover-bg-color)}.ibiz-control-appmenu .el-menu--vertical .el-menu-item .ibiz-control-appmenu__caption,.ibiz-control-appmenu .el-menu--vertical .el-menu-item-group__title .ibiz-control-appmenu__caption,.ibiz-control-appmenu .el-menu--vertical .el-sub-menu__title .ibiz-control-appmenu__caption{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-appmenu .el-menu--vertical .el-menu-item+.el-menu-item{margin-top:var(--ibiz-control-appmenu-item-gap)}.ibiz-control-appmenu .el-menu--vertical .el-sub-menu+.el-menu-item{margin-top:var(--ibiz-control-appmenu-item-gap)}.ibiz-control-appmenu .el-menu--vertical .el-sub-menu+.el-sub-menu{margin-top:var(--ibiz-control-appmenu-submenu-gap)}.ibiz-control-appmenu .el-menu--vertical .el-menu-item+.el-sub-menu{margin-top:var(--ibiz-control-appmenu-submenu-gap)}.ibiz-control-appmenu .el-menu--vertical .el-sub-menu__title+.el-menu{margin-top:var(--ibiz-control-appmenu-item-gap)}.ibiz-control-appmenu .el-menu--vertical::-webkit-scrollbar-thumb{background-color:var(--ibiz-control-appmenu-scorll-color)}.ibiz-control-appmenu .el-menu--horizontal{align-items:center;height:100%;padding:var(--ibiz-spacing-none) var(--ibiz-spacing-base-tight);overflow-x:hidden;background-color:transparent;border-bottom:none}.ibiz-control-appmenu .el-menu--horizontal .el-menu-item,.ibiz-control-appmenu .el-menu--horizontal .el-sub-menu__title{height:var(--ibiz-control-appmenu-item-horizontal-height);padding:var(--ibiz-control-appmenu-item-horizontal-padding);font-size:var(--ibiz-control-appmenu-item-horizontal-font-size);line-height:var(--ibiz-control-appmenu-item-horizontal-height);color:var(--ibiz-control-appmenu-item-horizontal-color);white-space:nowrap;border-width:0;border-radius:var(--ibiz-control-appmenu-item-horizontal-border-radius)}.ibiz-control-appmenu .el-menu--horizontal .el-menu-item:hover,.ibiz-control-appmenu .el-menu--horizontal .el-sub-menu__title:hover{color:var(--ibiz-control-appmenu-item-horizontal-hover-color);background-color:var(--ibiz-control-appmenu-item-horizontal-hover-bg-color)}.ibiz-control-appmenu .el-menu--horizontal .el-menu-item.is-active,.ibiz-control-appmenu .el-menu--horizontal .el-sub-menu__title.is-active{color:var(--ibiz-control-appmenu-item-selected-color)!important;background-color:var(--ibiz-control-appmenu-item-horizontal-selected-bg-color);border-top:var(--ibiz-control-appmenu-item-border)}.ibiz-control-appmenu .el-menu--horizontal .el-menu-item .el-sub-menu__icon-arrow,.ibiz-control-appmenu .el-menu--horizontal .el-sub-menu__title .el-sub-menu__icon-arrow{right:var(--ibiz-control-appmenu-item-icon-position)}.ibiz-control-appmenu .el-menu--horizontal .el-sub-menu{height:var(--ibiz-control-appmenu-item-horizontal-height)}.ibiz-control-appmenu .el-menu--horizontal .el-sub-menu>.el-sub-menu__title{padding-right:var(--ibiz-control-appmenu-item-horizontal-padding-right)}.ibiz-control-appmenu .el-menu--horizontal>.el-sub-menu:hover .el-sub-menu__title{color:var(--ibiz-control-appmenu-item-horizontal-hover-color);background-color:var(--ibiz-control-appmenu-item-horizontal-hover-bg-color)}.ibiz-control-appmenu .el-menu--horizontal>.el-sub-menu.is-active .el-sub-menu__title{color:var(--ibiz-control-appmenu-item-horizontal-selected-color);background-color:var(--ibiz-control-appmenu-item-horizontal-selected-bg-color);border-top:var(--ibiz-control-appmenu-item-border);border-bottom:0}.ibiz-control-appmenu .el-menu--horizontal::-webkit-scrollbar-thumb{background-color:var(--ibiz-control-appmenu-scorll-color)}.ibiz-control-appmenu .el-menu--horizontal .el-divider--vertical{border-color:var(--ibiz-control-appmenu-divider-color)}.ibiz-control-appmenu__icon{display:flex;align-items:center;justify-content:center;width:var(--ibiz-control-appmenu-item-icon-width);height:var(--ibiz-control-appmenu-item-icon-height);margin:var(--ibiz-control-appmenu-item-icon-margin);font-size:var(--ibiz-control-appmenu-item-icon-size)}.ibiz-control-appmenu__icon>svg{max-width:var(--ibiz-control-appmenu-item-icon-width);max-height:var(--ibiz-control-appmenu-item-icon-height)}.ibiz-control-appmenu.is-collapse>.el-menu.el-menu--vertical{padding:0 var(--ibiz-spacing-tight)}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu__icon{margin:var(--ibiz-spacing-none)}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu__item{display:flex;align-items:center;justify-content:center;padding:var(--ibiz-spacing-none);margin-bottom:var(--ibiz-spacing-tight)}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu-tooltip{width:100%}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu-submenu{display:block}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu-submenu>.el-sub-menu__title{display:flex;align-items:center;justify-content:center;display:flex;align-items:center;justify-content:center;padding:var(--ibiz-spacing-none);margin-bottom:var(--ibiz-spacing-tight);white-space:nowrap;cursor:pointer}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu-submenu .ibiz-control-appmenu-submenu__item{padding:var(--ibiz-spacing-none)}.ibiz-control-appmenu.is-show-collapse>.el-menu{height:calc(100% - var(--ibiz-control-appmenu-collapse-height));padding:0 var(--ibiz-spacing-base)}.ibiz-control-appmenu .ibiz-control-appmenu__counter{position:absolute;top:50%;right:5px;transform:translateY(-50%)}.ibiz-control-appmenu.is-scroll .el-menu.el-menu--vertical{padding-right:var(--ibiz-spacing-extra-tight)}.ibiz-control-appmenu-popup-container{--el-menu-hover-text-color:var(--ibiz-control-appmenu-item-color);--el-menu-hover-bg-color:transparent;--ibiz-control-appmenu-item-selected-border-color:transparent;--ibiz-control-appmenu-item-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-padding:var(--ibiz-spacing-tight);--ibiz-control-appmenu-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-appmenu-item-border:2px solid var(--ibiz-color-text-1);--ibiz-control-appmenu-item-font-size:var(--ibiz-font-size-header-6);--ibiz-control-appmenu-item-height:42px;--ibiz-control-appmenu-item-gap:2px;--ibiz-control-appmenu-item-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-horizontal-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-horizontal-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-horizontal-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-horizontal-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-font-size:var(--ibiz-font-size-header-5);--ibiz-control-appmenu-item-horizontal-height:100%;--ibiz-control-appmenu-item-horizontal-border-radius:0;--ibiz-control-appmenu-item-horizontal-padding:0 var(--ibiz-spacing-base-loose);--ibiz-control-appmenu-item-horizontal-padding-right:calc(var(--ibiz-width-icon-large) + var(--ibiz-spacing-base-loose));--ibiz-control-appmenu-item-horizontal-popup-height:40px}.ibiz-control-appmenu-popup-container .ibiz-control-appmenu__rawitem{min-height:var(--ibiz-control-appmenu-item-height);line-height:var(--ibiz-control-appmenu-item-height)}.ibiz-control-appmenu-popup-container .ibiz-control-appmenu__rawitem .ibiz-rawitem{display:flex;align-items:center;justify-content:flex-start;font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-color)}.ibiz-control-appmenu-popup-container .ibiz-control-appmenu__rawitem .ibiz-rawitem *{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-appmenu-popup-container .ibiz-control-appmenu-popup-container__extview1.el-menu--popup-container .el-menu--popup{padding:var(--ibiz-spacing-extra-tight) 0!important}.ibiz-control-appmenu-popup-container.el-menu--popup-container{--ibiz-control-appmenu-collapse-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-collapse-item-padding:var(--ibiz-spacing-base);--ibiz-control-appmenu-collapse-height:var(--ibiz-spacing-super-loose);--ibiz-control-appmenu-scorll-color:var(--ibiz-color-scroll-menu);--ibiz-control-appmenu-item-selected-border-color:transparent;--ibiz-control-appmenu-item-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-padding:var(--ibiz-spacing-tight);--ibiz-control-appmenu-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-appmenu-item-border:2px solid var(--ibiz-color-text-1);--ibiz-control-appmenu-item-font-size:var(--ibiz-font-size-header-6);--ibiz-control-appmenu-item-height:42px;--ibiz-control-appmenu-item-gap:2px;--ibiz-control-appmenu-item-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-horizontal-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-horizontal-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-horizontal-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-horizontal-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-font-size:var(--ibiz-font-size-header-5);--ibiz-control-appmenu-item-horizontal-height:100%;--ibiz-control-appmenu-item-horizontal-border-radius:0;--ibiz-control-appmenu-item-horizontal-padding:0 var(--ibiz-spacing-base-loose);--ibiz-control-appmenu-item-horizontal-padding-right:calc(var(--ibiz-width-icon-large) + var(--ibiz-spacing-base-loose));--ibiz-control-appmenu-item-horizontal-popup-height:40px;--ibiz-control-appmenu-item-icon-width:var(--ibiz-width-icon-large);--ibiz-control-appmenu-item-icon-height:var(--ibiz-width-icon-large);--ibiz-control-appmenu-item-icon-margin:0 var(--ibiz-spacing-tight) 0 0;--ibiz-control-appmenu-item-icon-position:calc(var(--ibiz-spacing-base) - 2px);--ibiz-control-appmenu-item-icon-size:var(--ibiz-width-icon-medium);border:none;box-shadow:var(--ibiz-shadow-elevated)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup{max-height:100vh;padding:var(--ibiz-spacing-extra-tight);overflow:auto;background-color:var(--ibiz-color-primary)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .ibiz-control-appmenu-groupmenu .el-menu-item-group__title{padding:var(--ibiz-spacing-extra-tight) 0 var(--ibiz-spacing-extra-tight) 10px;font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-horizontal-color)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .ibiz-control-appmenu-groupmenu>ul>.el-menu-item{padding:0 var(--ibiz-spacing-extra-loose)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .ibiz-control-appmenu-groupmenu>ul>.el-divider{width:calc(100% - 40px);margin:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-menu-item,.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-sub-menu__title{display:flex;align-items:center;justify-content:flex-start;width:100%;height:var(--ibiz-control-appmenu-item-horizontal-popup-height);font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-horizontal-color);white-space:nowrap;border-radius:var(--ibiz-control-appmenu-item-horizontal-border-radius)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-menu-item.is-active,.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-sub-menu__title.is-active{color:var(--ibiz-control-appmenu-item-horizontal-selected-color);background-color:var(--ibiz-control-appmenu-item-horizontal-selected-bg-color)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-menu-item:hover,.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-sub-menu__title:hover{color:var(--ibiz-control-appmenu-item-hover-color);background-color:var(--ibiz-control-appmenu-item-hover-bg-color)}.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-menu-item .el-icon,.ibiz-control-appmenu-popup-container.el-menu--popup-container .el-menu--popup .el-sub-menu__title .el-icon{display:none}.ibiz-control-appmenu-popup-container .ibiz-control-appmenu__counter{position:absolute;top:50%;right:5px;height:20px;padding:var(--ibiz-spacing-none) var(--ibiz-spacing-tight);line-height:initial;color:var(--ibiz-color-danger-text);background-color:var(--ibiz-color-danger);border-radius:var(--ibiz-border-radius-medium);transform:translateY(-50%)}.ibiz-control-appmenu .ibiz-control-appmenu-collapse-icon{position:absolute;right:var(--ibiz-control-appmenu-collapse-right);bottom:var(--ibiz-control-appmenu-collapse-bottom);font-size:var(--ibiz-control-appmenu-collapse-font-size);cursor:pointer}.ibiz-control-appmenu .ibiz-control-appmenu-collapse-icon.is-collapse{transform:rotate(180deg)}.ibiz-control-appmenu .ibiz-control-appmenu-menu-set{position:absolute;bottom:var(--ibiz-spacing-tight);left:var(--ibiz-spacing-base-tight);font-size:var(--ibiz-font-size-header-5);cursor:pointer}.ibiz-control-appmenu .ibiz-control-appmenu-menu-set.is-horizontal{right:0;bottom:0;left:unset;display:flex;align-items:center;height:100%}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu-collapse-icon{right:0;width:100%;text-align:center}.ibiz-control-appmenu.is-collapse .ibiz-control-appmenu-menu-set{position:absolute;right:var(--ibiz-spacing-base-tight);bottom:calc(var(--ibiz-spacing-tight) + 32px);font-size:var(--ibiz-font-size-header-5);text-align:center;cursor:pointer}.ibiz-control-appmenu.is-collapse.is-show-menu-design>.el-menu{height:calc(100% - var(--ibiz-control-appmenu-collapse-height) - var(--ibiz-control-appmenu-collapse-height))}.ibiz-control-appmenu__separator--horizontal{margin:var(--ibiz-control-appmenu-divider-margin);border-color:var(--ibiz-control-appmenu-divider-color)}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu){--ibiz-control-appmenu-collapse-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-collapse-item-padding:var(--ibiz-spacing-base);--ibiz-control-appmenu-collapse-height:var(--ibiz-spacing-super-loose);--ibiz-control-appmenu-scorll-color:var(--ibiz-color-scroll-menu);--ibiz-control-appmenu-item-selected-border-color:transparent;--ibiz-control-appmenu-item-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-padding:var(--ibiz-spacing-tight);--ibiz-control-appmenu-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-appmenu-item-border:2px solid var(--ibiz-color-text-1);--ibiz-control-appmenu-item-font-size:var(--ibiz-font-size-header-6);--ibiz-control-appmenu-item-height:42px;--ibiz-control-appmenu-item-gap:2px;--ibiz-control-appmenu-item-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-selected-color:var(--ibiz-color-primary-active-text);--ibiz-control-appmenu-item-horizontal-selected-bg-color:var(--ibiz-color-primary-active);--ibiz-control-appmenu-item-horizontal-hover-color:var(--ibiz-color-primary-hover-text);--ibiz-control-appmenu-item-horizontal-hover-bg-color:var(--ibiz-color-primary-hover);--ibiz-control-appmenu-item-horizontal-color:var(--ibiz-color-text-menu);--ibiz-control-appmenu-item-horizontal-font-size:var(--ibiz-font-size-header-5);--ibiz-control-appmenu-item-horizontal-height:100%;--ibiz-control-appmenu-item-horizontal-border-radius:0;--ibiz-control-appmenu-item-horizontal-padding:0 var(--ibiz-spacing-base-loose);--ibiz-control-appmenu-item-horizontal-padding-right:calc(var(--ibiz-width-icon-large) + var(--ibiz-spacing-base-loose));--ibiz-control-appmenu-item-horizontal-popup-height:40px;--ibiz-control-appmenu-item-icon-width:var(--ibiz-width-icon-large);--ibiz-control-appmenu-item-icon-height:var(--ibiz-width-icon-large);--ibiz-control-appmenu-item-icon-margin:0 var(--ibiz-spacing-tight) 0 0;--ibiz-control-appmenu-item-icon-position:calc(var(--ibiz-spacing-base) - 2px);--ibiz-control-appmenu-item-icon-size:var(--ibiz-width-icon-medium);border:none;box-shadow:var(--ibiz-shadow-elevated)}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup{padding:var(--ibiz-spacing-extra-tight);background-color:var(--ibiz-color-primary)}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-menu-item,.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-sub-menu__title{display:flex;align-items:center;justify-content:flex-start;width:100%;height:var(--ibiz-control-appmenu-item-horizontal-popup-height);font-size:var(--ibiz-control-appmenu-item-font-size);color:var(--ibiz-control-appmenu-item-horizontal-color);white-space:nowrap;border-radius:var(--ibiz-control-appmenu-item-horizontal-border-radius)}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-menu-item.is-active,.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-sub-menu__title.is-active{color:var(--ibiz-control-appmenu-item-horizontal-selected-color);background-color:var(--ibiz-control-appmenu-item-horizontal-selected-bg-color)}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-menu-item:hover,.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-sub-menu__title:hover{color:var(--ibiz-control-appmenu-item-hover-color);background-color:var(--ibiz-control-appmenu-item-hover-bg-color)}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-menu-item .el-icon,.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-sub-menu__title .el-icon{display:none}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu--popup .el-menu-item.is-disabled:hover{background-color:var(--ibiz-control-appmenu-item-hover-bg-color)!important}.el-menu--horizontal.el-menu--popup-container:has(.ibiz-control-appmenu__item,.ibiz-control-appmenu-submenu) .el-menu .el-sub-menu.is-active>.el-sub-menu__title{color:var(--ibiz-control-appmenu-item-horizontal-selected-color)}

package/es/control/app-menu/app-menu.mjs

@@ -1,8 +1,8 @@
 import { isVNode, defineComponent, createVNode, resolveComponent, mergeProps, ref, watch, computed, onMounted, nextTick } from 'vue';
 import { showTitle } from '@ibiz-template/core';
-import { useControlController, useNamespace, route2routePath } from '@ibiz-template/vue3-util';
+import { useControlController, useNamespace, useSemanticNode, route2routePath } from '@ibiz-template/vue3-util';
 import { createUUID } from 'qx-util';
-import { ScriptFactory, ViewCallTag, AppMenuController, formatSeparator } from '@ibiz-template/runtime';
+import { filterPresetAttrs, ScriptFactory, ViewCallTag, AppMenuController, formatSeparator } from '@ibiz-template/runtime';
 import { useRoute } from 'vue-router';
 import { MenuDesign } from './custom-menu-design/custom-menu-design.mjs';
 import './app-menu.css';
@@ -12,9 +12,8 @@ function _isSlot(s) {
   return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
 }
 function renderAttrs(model, params) {
-  var _a;
   const attrs = {};
-  (_a = model.controlAttributes) == null ? void 0 : _a.forEach((item) => {
+  filterPresetAttrs(model.controlAttributes).forEach((item) => {
     if (item.attrName && item.attrValue) {
       attrs[item.attrName] = ScriptFactory.execSingleLine(item.attrValue, {
         ...params
@@ -101,6 +100,10 @@ const AppMenuControl = /* @__PURE__ */ defineComponent({
   setup(props) {
     const c = useControlController((...args) => new AppMenuController(...args));
     const ns = useNamespace("control-".concat(c.model.controlType.toLowerCase()));
+    const {
+      semanticClass,
+      semanticStyle
+    } = useSemanticNode(c);
     const saveConfigs = ref([]);
     const defaultActive = ref("");
     const defaultOpens = ref([]);
@@ -280,7 +283,8 @@ const AppMenuControl = /* @__PURE__ */ defineComponent({
         "teleported": true,
         "popper-class": [ns.b("popup-container"), ns.be("popup-container", (_a = c.model.appMenuStyle) == null ? void 0 : _a.toLowerCase()), ns.b("".concat(c.model.codeName.toLowerCase(), "--popper")), "".concat(((_b = c.model.sysCss) == null ? void 0 : _b.cssName) ? "".concat((_c = c.model.sysCss) == null ? void 0 : _c.cssName, "--popper") : ""), "".concat((sysCss == null ? void 0 : sysCss.cssName) ? "".concat(sysCss == null ? void 0 : sysCss.cssName, "--popper") : "")],
         "title": showTitle(tooltip),
-        "class": [ns.b("submenu"), "".concat((sysCss == null ? void 0 : sysCss.cssName) || "")]
+        "style": semanticStyle("submenu", menu),
+        "class": [ns.b("submenu"), semanticClass("submenu", menu), "".concat((sysCss == null ? void 0 : sysCss.cssName) || "")]
       }, {
         default: () => appMenuItems.map((item) => renderMenu(false, item)),
         title: () => {
@@ -290,7 +294,8 @@ const AppMenuControl = /* @__PURE__ */ defineComponent({
           if (props.collapse) {
             if (sysImage)
               return createVNode(resolveComponent("iBizIcon"), {
-                "class": ns.e("icon"),
+                "class": [ns.e("icon"), semanticClass("submenu.icon", menu)],
+                "style": semanticStyle("submenu.icon", menu),
                 "icon": sysImage
               }, null);
             return [isFirst ? caption == null ? void 0 : caption.slice(0, 1) : caption, isFirst ? null : createVNode("ion-icon", {
@@ -298,12 +303,15 @@ const AppMenuControl = /* @__PURE__ */ defineComponent({
             }, null)];
           }
           return [sysImage && createVNode(resolveComponent("iBizIcon"), {
-            "class": ns.e("icon"),
+            "class": [ns.e("icon"), semanticClass("submenu.icon", menu)],
+            "style": semanticStyle("submenu.icon", menu),
             "icon": sysImage
           }, null), createVNode("span", {
-            "class": ns.e("caption")
+            "class": [ns.e("caption"), semanticClass("submenu.content", menu)],
+            "style": semanticStyle("submenu.content", menu)
           }, [caption]), counterId ? createVNode(resolveComponent("iBizBadge"), {
-            "class": ns.e("counter"),
+            "class": [ns.e("counter"), semanticClass("counter", menu)],
+            "style": semanticStyle("counter", menu),
             "value": c.state.counterData[counterId]
           }, null) : null];
         }
@@ -325,17 +333,21 @@ const AppMenuControl = /* @__PURE__ */ defineComponent({
         content = provider.renderText(menu, c);
       } else if (!(isFirst && props.collapse)) {
         content = [sysImage ? createVNode(resolveComponent("iBizIcon"), {
-          "class": ns.e("icon"),
+          "class": [ns.e("icon"), semanticClass("item.icon", menu)],
+          "style": semanticStyle("item.icon", menu),
           "icon": sysImage
         }, null) : null, createVNode("span", {
-          "class": ns.e("caption")
+          "class": [ns.e("caption"), semanticClass("item.content", menu)],
+          "style": semanticStyle("item.content", menu)
         }, [caption]), counterId ? createVNode(resolveComponent("iBizBadge"), {
-          "class": ns.e("counter"),
+          "class": [ns.e("counter"), semanticClass("counter", menu)],
+          "style": semanticStyle("counter", menu),
           "value": c.state.counterData[counterId]
         }, null) : null];
       } else {
         content = [sysImage ? createVNode(resolveComponent("iBizIcon"), {
-          "class": ns.e("icon"),
+          "class": [ns.e("icon"), semanticClass("item.icon", menu)],
+          "style": semanticStyle("item.icon", menu),
           "icon": sysImage
         }, null) : caption == null ? void 0 : caption.slice(0, 1)];
       }
@@ -343,7 +355,8 @@ const AppMenuControl = /* @__PURE__ */ defineComponent({
         "index": id,
         "disabled": !appFuncId,
         "title": showTitle(tooltip),
-        "class": [ns.e("item"), "".concat((sysCss == null ? void 0 : sysCss.cssName) || "")]
+        "class": [ns.e("item"), semanticClass("item", menu), "".concat((sysCss == null ? void 0 : sysCss.cssName) || "")],
+        "style": semanticStyle("item", menu)
       }, _isSlot(content) ? content : {
         default: () => [content]
       }) : createVNode(resolveComponent("el-tooltip"), {
@@ -355,7 +368,8 @@ const AppMenuControl = /* @__PURE__ */ defineComponent({
         default: () => [createVNode(resolveComponent("el-menu-item"), {
           "index": id,
           "disabled": !appFuncId,
-          "class": [ns.e("item"), "".concat((sysCss == null ? void 0 : sysCss.cssName) || "")]
+          "class": [ns.e("item"), semanticClass("item", menu), "".concat((sysCss == null ? void 0 : sysCss.cssName) || "")],
+          "style": semanticStyle("item", menu)
         }, _isSlot(content) ? content : {
           default: () => [content]
         })]
@@ -366,7 +380,8 @@ const AppMenuControl = /* @__PURE__ */ defineComponent({
       return createVNode(resolveComponent("el-divider"), {
         "id": menu.id,
         "direction": direction,
-        "class": ns.em("separator", direction)
+        "class": [ns.em("separator", direction), semanticClass("divider", menu)],
+        "style": semanticStyle("divider", menu)
       }, null);
     };
     const renderRawitem = (menu) => {
@@ -378,7 +393,8 @@ const AppMenuControl = /* @__PURE__ */ defineComponent({
       return createVNode(resolveComponent("el-menu-item"), {
         "index": id,
         "title": showTitle(tooltip),
-        "class": [ns.e("rawitem"), "".concat((sysCss == null ? void 0 : sysCss.cssName) || "")]
+        "class": [ns.e("rawitem"), semanticClass("rawitem", menu), "".concat((sysCss == null ? void 0 : sysCss.cssName) || "")],
+        "style": semanticStyle("rawitem", menu)
       }, {
         default: () => [createVNode(resolveComponent("iBizRawItem"), {
           "rawItem": menu
@@ -417,20 +433,25 @@ const AppMenuControl = /* @__PURE__ */ defineComponent({
       renderMenu,
       ellipsisSvg,
       configSaves,
-      configReset
+      configReset,
+      semanticClass,
+      semanticStyle
     };
   },
   render() {
     var _a, _b;
     return createVNode(resolveComponent("iBizControlBase"), {
       "ref": "menuRef",
-      "class": [this.ns.b(), this.ns.m(this.menuMode), this.ns.b("".concat(this.c.model.codeName.toLowerCase())), this.ns.b((_a = this.c.model.appMenuStyle) == null ? void 0 : _a.toLowerCase()), this.ns.is("collapse", this.collapse), this.ns.is("show-collapse", this.isShowCollapse), this.ns.is("show-menu-design", this.c.model.enableCustomized), this.ns.is("scroll", this.hasScroll), "".concat(((_b = this.c.model.sysCss) == null ? void 0 : _b.cssName) || "")],
+      "class": [this.ns.b(), this.semanticClass("root"), this.ns.m(this.menuMode), this.ns.b("".concat(this.c.model.codeName.toLowerCase())), this.ns.b((_a = this.c.model.appMenuStyle) == null ? void 0 : _a.toLowerCase()), this.ns.is("collapse", this.collapse), this.ns.is("show-collapse", this.isShowCollapse), this.ns.is("show-menu-design", this.c.model.enableCustomized), this.ns.is("scroll", this.hasScroll), "".concat(((_b = this.c.model.sysCss) == null ? void 0 : _b.cssName) || "")],
+      "style": this.semanticStyle("root"),
       "controller": this.c
     }, {
       default: () => {
         var _a2;
         return [this.c.state.isCreated && createVNode(resolveComponent("el-menu"), mergeProps({
           "key": this.key,
+          "class": this.semanticClass("content"),
+          "style": this.semanticStyle("content"),
           "popper-class": [this.ns.b("popper"), this.ns.b("".concat(this.c.model.codeName.toLowerCase(), "--popper")), "".concat(((_a2 = this.c.model.sysCss) == null ? void 0 : _a2.cssName) ? "".concat(this.c.model.sysCss.cssName, "--popper") : "")],
           "default-active": this.defaultActive,
           "default-openeds": this.defaultOpens,
@@ -454,7 +475,8 @@ const AppMenuControl = /* @__PURE__ */ defineComponent({
           "onSaved": this.configSaves,
           "onReset": this.configReset
         }, null), this.isShowCollapse && createVNode("div", {
-          "class": [this.ns.b("collapse-icon"), this.ns.is("collapse", this.collapse)],
+          "class": [this.ns.b("collapse-icon"), this.semanticClass("collapse"), this.ns.is("collapse", this.collapse)],
+          "style": this.semanticStyle("collapse"),
           "onClick": () => {
             this.c.view.call(ViewCallTag.TOGGLE_COLLAPSE);
           }

package/es/control/calendar/calendar-util.mjs

@@ -36,7 +36,7 @@ function useCalendarLegend(ns) {
     () => getVarValue("".concat(ns.cssVarName("color-black")))
   );
   const getBkColor = (_index) => {
-    return bgColors[_index] || bgColors[0];
+    return bgColors[_index % bgColors.length] || bgColors[0];
   };
   const getActBdrColors = (_index) => {
     return actBdrColors[_index] || getVarValue("".concat(ns.cssVarName("color-primary")));

package/es/control/calendar/calendar.css

@@ -1 +1 @@
-.ibiz-control-calendar{--ibiz-control-calendar-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-active-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-border-color:var(--ibiz-color-primary-active);--ibiz-control-calendar-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-margin:var(--ibiz-spacing-extra-tight);position:relative;width:100%;height:100%}.ibiz-control-calendar__nav-icon{position:absolute;top:18px;right:0;color:var(--ibiz-color-primary);cursor:pointer}.ibiz-control-calendar__calendar-item{display:flex;align-items:center;padding:var(--ibiz-control-calendar-item-padding)}.ibiz-control-calendar__icon{width:var(--ibiz-width-icon-small);height:var(--ibiz-width-icon-small);margin-right:var(--ibiz-spacing-base-tight);border-radius:var(--ibiz-border-radius-circle)}.ibiz-control-calendar__user .ibiz-control-calendar__nav-icon{top:9px}.ibiz-control-calendar__day .ibiz-control-calendar__nav-icon,.ibiz-control-calendar__week .ibiz-control-calendar__nav-icon{top:28px;right:10px}.ibiz-control-calendar-content{display:flex;flex-direction:column;width:100%;height:100%}.ibiz-control-calendar-content .el-calendar{display:flex;flex-direction:column;height:100%}.ibiz-control-calendar-content .el-calendar__header{flex-wrap:nowrap}.ibiz-control-calendar-content .el-calendar-table,.ibiz-control-calendar-content .el-calendar-table .el-calendar-day{width:100%;height:100%;min-height:90px;cursor:pointer}.ibiz-control-calendar-content .el-calendar-table{flex:1;width:-moz-fit-content;width:fit-content}.ibiz-control-calendar-content .el-calendar-table .el-calendar-day:hover{cursor:pointer;background-color:var(--el-calendar-selected-bg-color)}.ibiz-control-calendar-content .el-calendar__body{display:flex;flex:1;padding:0;overflow:auto}.ibiz-control-calendar-content.is-show-date-range .el-calendar-day{padding:var(--ibiz-spacing-tight) 0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item{width:calc(100% + 1px);min-height:34px;border-radius:0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-begin-time{width:100%;margin-left:var(--ibiz-spacing-super-tight);border-radius:var(--ibiz-spacing-extra-tight) 0 0 var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-begin-time.is-end-time{width:calc(100% - var(--ibiz-spacing-super-tight) * 2);border-radius:var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-end-time{width:calc(100% - var(--ibiz-spacing-super-tight));border-radius:0 var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-extra-tight) 0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-active{border-right:none;border-left:none}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-active.is-begin-time{border-left:solid .5px var(--ibiz-control-calendar-item-active-border-color,var(--ibiz-control-calendar-border-color))}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-active.is-end-time{border-right:solid .5px var(--ibiz-control-calendar-item-active-border-color,var(--ibiz-control-calendar-border-color))}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-hidden{position:relative;z-index:-1;opacity:0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-no-begin-time,.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-no-end-time{width:calc(100% - var(--ibiz-spacing-super-tight) * 2);margin-left:var(--ibiz-spacing-super-tight);border-radius:var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-more{width:100%;font-size:var(--ibiz-font-size-small);border-radius:var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-more:hover{background-color:var(--ibiz-control-calendar-hover-bg-color)}.ibiz-control-calendar-item{--ibiz-control-calendar-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-active-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-border-color:var(--ibiz-color-primary-active);--ibiz-control-calendar-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-margin:var(--ibiz-spacing-extra-tight);--ibiz-control-calendar-item-color:none;--ibiz-color-text-2:var(--ibiz-control-calendar-item-color);--ibiz-editor-default-text-color:var(--ibiz-control-calendar-item-color);height:100%;padding:var(--ibiz-control-calendar-item-padding);margin-bottom:var(--ibiz-control-calendar-margin);overflow:hidden;font-size:var(--ibiz-control-calendar-font-size);color:var(--ibiz-control-calendar-text-color);text-overflow:ellipsis;white-space:nowrap;cursor:pointer;border:solid .5px transparent;border-radius:var(--ibiz-control-calendar-border-radius)}.ibiz-control-calendar-item:hover{background-color:var(--ibiz-control-calendar-hover-bg-color)}.ibiz-control-calendar-item.is-active{background-color:var(--ibiz-control-calendar-active-bg-color);border:solid .5px var(--ibiz-control-calendar-item-active-border-color,var(--ibiz-control-calendar-border-color))}.ibiz-control-calendar-date-text{--ibiz-control-calendar-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-active-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-border-color:var(--ibiz-color-primary-active);--ibiz-control-calendar-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-margin:var(--ibiz-spacing-extra-tight);padding-bottom:var(--ibiz-control-calendar-item-padding);margin:0;text-align:center}.ibiz-control-calendar-day{height:-moz-fit-content;height:fit-content}.ibiz-control-calendar-content-title{line-height:var(--ibiz-editor-default-line-height);white-space:nowrap}.ibiz-control-calendar-content-header{--ibiz-control-calendar-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-active-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-border-color:var(--ibiz-color-primary-active);--ibiz-control-calendar-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-margin:var(--ibiz-spacing-extra-tight);display:flex;align-items:center}.ibiz-control-calendar-content-header>*+*{margin-left:var(--ibiz-control-calendar-item-padding)}.ibiz-control-calendar-content-header .el-button-group{display:flex}.ibiz-control-calendar-legend{display:flex;justify-content:center;width:100%}.ibiz-control-calendar-legend__item{display:flex;align-items:center;padding:0 var(--ibiz-spacing-tight);line-height:1em;cursor:pointer}.ibiz-control-calendar-legend__item--tip{display:inline-block;width:1.5em;height:.9em;margin-right:var(--ibiz-spacing-extra-tight);border-radius:var(--ibiz-border-radius-extra-small)}.ibiz-control-calendar-legend__item--text{display:inline-block;width:auto;max-width:100px;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-calendar-timeline-content{height:100%;overflow:auto}.ibiz-control-calendar-timeline-content .el-timeline{padding-left:0}
+.ibiz-control-calendar{--ibiz-control-calendar-bg-color:transparent;--ibiz-control-calendar-padding:var(--ibiz-spacing-none);--ibiz-control-calendar-border-color:var(--ibiz-color-border);--ibiz-control-calendar-icon-color:var(--ibiz-color-text-2);--ibiz-control-calendar-hover-color:var(--ibiz-color-primary-hover);--ibiz-control-calendar-active-border-color:var(--ibiz-color-primary-active);--ibiz-control-calendar-timeline-padding:var(--ibiz-spacing-none);--ibiz-control-calendar-month-gap:var(--ibiz-spacing-tight);--ibiz-control-calendar-month-hover-bg-color:rgba(var(--ibiz-blue-cyan-1), 0.25);--ibiz-control-calendar-month-active-bg-color:rgba(var(--ibiz-blue-cyan-1), 0.25);--ibiz-control-calendar-more-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-more-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-more-border-radius:var(--ibiz-spacing-extra-tight);--ibiz-control-calendar-legend-gap:var(--ibiz-spacing-tight);--ibiz-control-calendar-item-color:none;--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-item-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-item-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-margin:var(--ibiz-spacing-extra-tight);--ibiz-control-calendar-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-item-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-item-active-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-legend-item-gap:var(--ibiz-spacing-extra-tight);--ibiz-control-calendar-legend-item-border-radius:var(--ibiz-border-radius-extra-small);position:relative;width:100%;height:100%;padding:var(--ibiz-control-calendar-padding);background-color:var(--ibiz-control-calendar-bg-color)}.ibiz-control-calendar__nav-icon{position:absolute;top:18px;right:0;color:var(--ibiz-control-calendar-icon-color);cursor:pointer}.ibiz-control-calendar__nav-icon:hover{color:var(--ibiz-control-calendar-hover-color)}.ibiz-control-calendar__calendar-item{display:flex;align-items:center;padding:var(--ibiz-control-calendar-item-padding)}.ibiz-control-calendar__icon{width:var(--ibiz-width-icon-small);height:var(--ibiz-width-icon-small);margin-right:var(--ibiz-spacing-base-tight);border-radius:var(--ibiz-border-radius-circle)}.ibiz-control-calendar__user .ibiz-control-calendar__nav-icon{top:9px}.ibiz-control-calendar__day .ibiz-control-calendar__nav-icon,.ibiz-control-calendar__week .ibiz-control-calendar__nav-icon{top:28px;right:10px}.ibiz-control-calendar-content{display:flex;flex-direction:column;width:100%;height:100%}.ibiz-control-calendar-content .el-calendar{display:flex;flex-direction:column;height:100%}.ibiz-control-calendar-content .el-calendar__header{flex-wrap:nowrap}.ibiz-control-calendar-content .el-calendar-table,.ibiz-control-calendar-content .el-calendar-table .el-calendar-day{width:100%;height:100%;min-height:90px;cursor:pointer}.ibiz-control-calendar-content .el-calendar-table{flex:1;width:-moz-fit-content;width:fit-content}.ibiz-control-calendar-content .el-calendar-table .el-calendar-day:hover{cursor:pointer;background-color:var(--ibiz-control-calendar-month-hover-bg-color)}.ibiz-control-calendar-content .el-calendar-table td.is-selected{background-color:var(--ibiz-control-calendar-month-active-bg-color)}.ibiz-control-calendar-content .el-calendar__body{display:flex;flex:1;padding:0;overflow:auto}.ibiz-control-calendar-content.is-show-date-range .el-calendar-day{padding:var(--ibiz-control-calendar-month-gap) 0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item{width:calc(100% + 1px);min-height:34px;border-radius:0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-begin-time{width:100%;margin-left:var(--ibiz-spacing-super-tight);border-radius:var(--ibiz-spacing-extra-tight) 0 0 var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-begin-time.is-end-time{width:calc(100% - var(--ibiz-spacing-super-tight) * 2);border-radius:var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-end-time{width:calc(100% - var(--ibiz-spacing-super-tight));border-radius:0 var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-extra-tight) 0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-active{border-right:none;border-left:none}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-active.is-begin-time{border-left:solid .5px var(--ibiz-control-calendar-item-active-border-color,var(--ibiz-control-calendar-active-border-color))}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-active.is-end-time{border-right:solid .5px var(--ibiz-control-calendar-item-active-border-color,var(--ibiz-control-calendar-active-border-color))}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-hidden{position:relative;z-index:-1;opacity:0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-no-begin-time,.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-no-end-time{width:calc(100% - var(--ibiz-spacing-super-tight) * 2);margin-left:var(--ibiz-spacing-super-tight);border-radius:var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-more{width:100%;font-size:var(--ibiz-control-calendar-more-font-size);border-radius:var(--ibiz-control-calendar-more-border-radius)}.ibiz-control-calendar-more:hover{background-color:var(--ibiz-control-calendar-more-hover-bg-color)}.ibiz-control-calendar-item{--ibiz-control-calendar-item-color:none;--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-item-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-item-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-margin:var(--ibiz-spacing-extra-tight);--ibiz-control-calendar-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-item-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-item-active-bg-color:var(--ibiz-color-fill-0);--ibiz-color-text-2:var(--ibiz-control-calendar-item-color);--ibiz-editor-default-text-color:var(--ibiz-control-calendar-item-color);height:100%;padding:var(--ibiz-control-calendar-item-padding);margin-bottom:var(--ibiz-control-calendar-item-margin);overflow:hidden;font-size:var(--ibiz-control-calendar-item-font-size);color:var(--ibiz-control-calendar-item-text-color);text-overflow:ellipsis;white-space:nowrap;cursor:pointer;border:solid .5px transparent;border-radius:var(--ibiz-control-calendar-item-border-radius)}.ibiz-control-calendar-item:hover{background-color:var(--ibiz-control-calendar-item-hover-bg-color)}.ibiz-control-calendar-item.is-active{background-color:var(--ibiz-control-calendar-item-active-bg-color);border:solid .5px var(--ibiz-control-calendar-item-active-border-color,var(--ibiz-control-calendar-active-border-color))}.ibiz-control-calendar-date-text{padding-bottom:var(--ibiz-control-calendar-month-gap);margin:0;text-align:center}.ibiz-control-calendar-day{height:-moz-fit-content;height:fit-content}.ibiz-control-calendar-content-title{line-height:var(--ibiz-editor-default-line-height);white-space:nowrap}.ibiz-control-calendar-content-header{display:flex;align-items:center}.ibiz-control-calendar-content-header>*+*{margin-left:var(--ibiz-control-calendar-month-gap)}.ibiz-control-calendar-content-header .el-button-group{display:flex}.ibiz-control-calendar-legend{display:flex;justify-content:center;width:100%}.ibiz-control-calendar-legend__item{display:flex;align-items:center;padding:0 var(--ibiz-control-calendar-legend-gap);line-height:1em;cursor:pointer}.ibiz-control-calendar-legend__item--tip{display:inline-block;width:1.5em;height:.9em;margin-right:var(--ibiz-control-calendar-legend-item-gap);border-radius:var(--ibiz-control-calendar-legend-item-border-radius)}.ibiz-control-calendar-legend__item--text{display:inline-block;width:auto;max-width:100px;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-calendar-timeline-content{height:100%;overflow:auto}.ibiz-control-calendar-timeline-content .el-timeline{padding-left:var(--ibiz-control-calendar-timeline-padding)}