@ibiz-template/vue3-components 0.7.41-alpha.23 → 0.7.41-alpha.25

package/es/control/form/form-detail/form-mdctrl/form-mdctrl-md/form-mdctrl-md.mjs

@@ -1,7 +1,8 @@
-import { isVNode, computed, ref, resolveComponent, h, createVNode, defineComponent } from 'vue';
+import { isVNode, computed, ref, resolveComponent, createVNode, h, defineComponent } from 'vue';
 import { FormMDCtrlMDController } from '@ibiz-template/runtime';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import './form-mdctrl-md.css';
+import { showTitle } from '@ibiz-template/core';
 
 "use strict";
 function _isSlot(s) {
@@ -27,16 +28,52 @@ const FormMDCtrlMD = /* @__PURE__ */ defineComponent({
     const onSelectionChange = (event) => {
       isSelected.value = event.data.length > 0;
     };
+    const handleRemove = () => {
+      isSelected.value = false;
+      props.controller.remove();
+    };
+    const renderRemoveBtn = () => {
+      let _slot2;
+      if (!props.controller.enableDelete)
+        return null;
+      if (ibiz.config.form.mdCtrlConfirmBeforeRemove) {
+        return createVNode(resolveComponent("el-popconfirm"), {
+          "title": showTitle(ibiz.i18n.t("control.form.mdCtrlContainer.promptInformation")),
+          "confirm-button-text": ibiz.i18n.t("app.confirm"),
+          "cancel-button-text": ibiz.i18n.t("app.cancel"),
+          "onConfirm": () => handleRemove()
+        }, {
+          reference: () => {
+            let _slot;
+            return createVNode(resolveComponent("el-button"), {
+              "type": "danger",
+              "disabled": !isSelected.value,
+              "class": [ns.be("actions", "remove"), ns.be("actions", "btn")]
+            }, _isSlot(_slot = ibiz.i18n.t("app.delete")) ? _slot : {
+              default: () => [_slot]
+            });
+          }
+        });
+      }
+      return createVNode(resolveComponent("el-button"), {
+        "type": "danger",
+        "disabled": !isSelected.value,
+        "class": [ns.be("actions", "remove"), ns.be("actions", "btn")],
+        "onClick": () => handleRemove()
+      }, _isSlot(_slot2 = ibiz.i18n.t("app.delete")) ? _slot2 : {
+        default: () => [_slot2]
+      });
+    };
     return {
       ns,
       showActions,
-      isSelected,
       onCreated,
-      onSelectionChange
+      onSelectionChange,
+      renderRemoveBtn
     };
   },
   render() {
-    let _slot, _slot2;
+    let _slot3;
     const {
       mdProvider,
       model
@@ -62,16 +99,9 @@ const FormMDCtrlMD = /* @__PURE__ */ defineComponent({
     }, [this.controller.enableCreate && createVNode(resolveComponent("el-button"), {
       "class": [this.ns.be("actions", "create"), this.ns.be("actions", "btn")],
       "onClick": () => this.controller.create()
-    }, _isSlot(_slot = ibiz.i18n.t("app.add")) ? _slot : {
-      default: () => [_slot]
-    }), this.controller.enableDelete && createVNode(resolveComponent("el-button"), {
-      "type": "danger",
-      "disabled": !this.isSelected,
-      "class": [this.ns.be("actions", "remove"), this.ns.be("actions", "btn")],
-      "onClick": () => this.controller.remove()
-    }, _isSlot(_slot2 = ibiz.i18n.t("app.delete")) ? _slot2 : {
-      default: () => [_slot2]
-    })])]);
+    }, _isSlot(_slot3 = ibiz.i18n.t("app.add")) ? _slot3 : {
+      default: () => [_slot3]
+    }), this.renderRemoveBtn()])]);
   }
 });
 

package/es/control/form/form-detail/form-mdctrl/mdctrl-container/mdctrl-container.d.ts

@@ -27,10 +27,10 @@ export declare const MDCtrlContainer: import("vue").DefineComponent<{
     dragItems: import("vue").ComputedRef<import("@ibiz-template/core").IApiData[]>;
     renderDragBtn: () => JSX.Element;
     renderAddBtn: () => JSX.Element;
-    renderDefaultItem: (item: IData, index: number) => JSX.Element;
-    renderRemoveBtn: (item: IData, index: number) => JSX.Element | null;
-    renderStyle2AddBtn: () => JSX.Element;
-    renderStyle2RemoveBtn: (item: IData, index: number) => JSX.Element | null;
+    renderDefaultItem: (item: IData, index: number) => import("vue/jsx-runtime").JSX.Element;
+    renderRemoveBtn: (item: IData, index: number) => import("vue/jsx-runtime").JSX.Element | null;
+    renderStyle2AddBtn: () => import("vue/jsx-runtime").JSX.Element;
+    renderStyle2RemoveBtn: (item: IData, index: number) => import("vue/jsx-runtime").JSX.Element | null;
     handleDragChange: (_params: IParams) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     addClick: () => true;

package/es/control/form/form-detail/form-rawitem/form-rawitem.d.ts

@@ -16,7 +16,7 @@ export declare const FormRawItem: import("vue").DefineComponent<{
     content: Ref<string | number | undefined>;
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
     isDesignPreview: boolean;
-    renderPreviewContent: () => JSX.Element | null;
+    renderPreviewContent: () => import("vue/jsx-runtime").JSX.Element | null;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelData: {
         type: PropType<IDEFormRawItem>;

package/es/control/form/form-detail/form-rawitem/index.d.ts

@@ -12,7 +12,7 @@ export declare const IBizFormRawItem: import("@ibiz-template/vue3-util").TypeWit
     content: import("vue").Ref<string | number | undefined>;
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
     isDesignPreview: boolean;
-    renderPreviewContent: () => JSX.Element | null;
+    renderPreviewContent: () => import("vue/jsx-runtime").JSX.Element | null;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelData: {
         type: import("vue").PropType<import("@ibiz/model-core").IDEFormRawItem>;

package/es/control/form/form-detail/form-tab-panel/form-tab-panel.css

@@ -1 +1 @@
-.ibiz-form-tab-panel{width:100%;height:100%;--ibiz-form-tab-panel-font-size:var(--ibiz-font-size-header-4);--ibiz-form-tab-panel-header-border-color:var(--ibiz-color-border);--ibiz-form-tab-panel-text-color:var(--ibiz-color-text-2);--ibiz-form-tab-panel-bg-color:transparent;--ibiz-form-tab-panel-hover-text-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-hover-bg-color:transparent;--ibiz-form-tab-panel-active-text-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-active-bg-color:transparent;--ibiz-form-tab-panel-active-border-color:var(--ibiz-color-primary)}.ibiz-form-tab-panel>.el-tabs__header.is-top{margin-bottom:var(--ibiz-spacing-tight)}.ibiz-form-tab-panel>.el-tabs__header.is-top .el-tabs__item.is-top{font-size:var(--ibiz-form-tab-panel-font-size);color:var(--ibiz-form-tab-panel-text-color);background-color:var(--ibiz-form-tab-panel-bg-color)}.ibiz-form-tab-panel>.el-tabs__header.is-top .el-tabs__item.is-top:hover{color:var(--ibiz-form-tab-panel-hover-text-color);background-color:var(--ibiz-form-tab-panel-hover-bg-color)}.ibiz-form-tab-panel>.el-tabs__header.is-top .el-tabs__item.is-top.is-active{color:var(--ibiz-form-tab-panel-active-text-color);background-color:var(--ibiz-form-tab-panel-active-bg-color)}.ibiz-form-tab-panel .el-tabs__nav-wrap::after{height:1px;background-color:var(--ibiz-form-tab-panel-header-border-color)}.ibiz-form-tab-panel .el-tabs__active-bar{background-color:var(--ibiz-form-tab-panel-active-border-color)}.ibiz-form-tab-panel .el-tabs__item .ibiz-form-tab-panel__badge.is-no-counter{padding-right:var(--ibiz-spacing-none)}.ibiz-form-tab-panel__badge .el-badge__content{padding:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-font-size-small);background-color:var(--ibiz-color-danger)}.ibiz-form-tab-panel__badge .el-badge__content.is-fixed{top:var(--ibiz-spacing-super-tight);right:0}
+.ibiz-form-tab-panel{width:100%;height:100%;--ibiz-form-tab-panel-font-size:var(--ibiz-font-size-header-4);--ibiz-form-tab-panel-header-border-color:var(--ibiz-color-border);--ibiz-form-tab-panel-text-color:var(--ibiz-color-text-2);--ibiz-form-tab-panel-bg-color:transparent;--ibiz-form-tab-panel-hover-text-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-hover-bg-color:transparent;--ibiz-form-tab-panel-active-text-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-active-bg-color:transparent;--ibiz-form-tab-panel-active-border-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-select-all-height:40px}.ibiz-form-tab-panel>.el-tabs__header.is-top{margin-bottom:var(--ibiz-spacing-tight)}.ibiz-form-tab-panel>.el-tabs__header.is-top .el-tabs__item.is-top{font-size:var(--ibiz-form-tab-panel-font-size);color:var(--ibiz-form-tab-panel-text-color);background-color:var(--ibiz-form-tab-panel-bg-color)}.ibiz-form-tab-panel>.el-tabs__header.is-top .el-tabs__item.is-top:hover{color:var(--ibiz-form-tab-panel-hover-text-color);background-color:var(--ibiz-form-tab-panel-hover-bg-color)}.ibiz-form-tab-panel>.el-tabs__header.is-top .el-tabs__item.is-top.is-active{color:var(--ibiz-form-tab-panel-active-text-color);background-color:var(--ibiz-form-tab-panel-active-bg-color)}.ibiz-form-tab-panel .el-tabs__nav-wrap::after{height:1px;background-color:var(--ibiz-form-tab-panel-header-border-color)}.ibiz-form-tab-panel .el-tabs__active-bar{background-color:var(--ibiz-form-tab-panel-active-border-color)}.ibiz-form-tab-panel .el-tabs__item .ibiz-form-tab-panel__badge.is-no-counter{padding-right:var(--ibiz-spacing-none)}.ibiz-form-tab-panel__badge .el-badge__content{padding:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-font-size-small);background-color:var(--ibiz-color-danger)}.ibiz-form-tab-panel__badge .el-badge__content.is-fixed{top:var(--ibiz-spacing-super-tight);right:0}.ibiz-form-tab-panel--style2 .el-tabs__nav-next.is-disabled,.ibiz-form-tab-panel--style2 .el-tabs__nav-prev.is-disabled{display:none}.ibiz-form-tab-panel--style2 .el-tabs__nav-wrap.is-top:has(.el-tabs__nav-prev.is-disabled){padding-left:0}.ibiz-form-tab-panel--style2 .el-tabs__nav-wrap.is-top:has(.el-tabs__nav-next.is-disabled){padding-right:0}.ibiz-form-tab-panel-tab-panel-container-style2{position:relative;display:flex;width:100%;--ibiz-form-tab-panel-font-size:var(--ibiz-font-size-header-4);--ibiz-form-tab-panel-header-border-color:var(--ibiz-color-border);--ibiz-form-tab-panel-text-color:var(--ibiz-color-text-2);--ibiz-form-tab-panel-bg-color:transparent;--ibiz-form-tab-panel-hover-text-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-hover-bg-color:transparent;--ibiz-form-tab-panel-active-text-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-active-bg-color:transparent;--ibiz-form-tab-panel-active-border-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-select-all-height:40px}.ibiz-form-tab-panel-tab-panel-container-style2 .ibiz-form-tab-panel{width:100%}.ibiz-form-tab-panel-tab-panel-container-style2 .ibiz-form-tab-panel .el-tabs__header{width:calc(100% - 72px)}.ibiz-form-tab-panel-tab-panel-container-style2__popover{--ibiz-form-tab-panel-font-size:var(--ibiz-font-size-header-4);--ibiz-form-tab-panel-header-border-color:var(--ibiz-color-border);--ibiz-form-tab-panel-text-color:var(--ibiz-color-text-2);--ibiz-form-tab-panel-bg-color:transparent;--ibiz-form-tab-panel-hover-text-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-hover-bg-color:transparent;--ibiz-form-tab-panel-active-text-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-active-bg-color:transparent;--ibiz-form-tab-panel-active-border-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-select-all-height:40px}.ibiz-form-tab-panel-tab-panel-container-style2__popover.el-popover{padding:0}.ibiz-form-tab-panel-tab-panel-container-style2__select{position:absolute;top:0;right:0;display:flex;gap:var(--ibiz-spacing-extra-tight);align-items:center;justify-content:center;width:72px;height:var(--ibiz-form-tab-panel-select-all-height);font-size:var(--ibiz-form-tab-panel-font-size);color:var(--ibiz-form-tab-panel-text-color);cursor:pointer;border-bottom:1px solid var(--ibiz-form-tab-panel-header-border-color)}.ibiz-form-tab-panel-tab-panel-container-style2__content{padding:var(--ibiz-spacing-base) 0}.ibiz-form-tab-panel-tab-panel-container-style2__tab-item-content{width:100%;padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-base);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.ibiz-form-tab-panel-tab-panel-container-style2__tab-item-content:hover{color:var(--ibiz-form-tab-panel-hover-text-color);background-color:var(--ibiz-form-tab-panel-hover-bg-color)}.ibiz-form-tab-panel-tab-panel-container-style2__tab-item-content.is-active{color:var(--ibiz-form-tab-panel-active-text-color)}

package/es/control/form/form-detail/form-tab-panel/form-tab-panel.d.ts

@@ -13,8 +13,9 @@ export declare const FormTabPanel: import("vue").DefineComponent<{
     };
 }, {
     ns: import("@ibiz-template/core").Namespace;
+    popoverVisible: import("vue").Ref<boolean>;
     onTabClick: (tabIns: IData, event: MouseEvent) => void;
-    counterData: import("@ibiz-template/core").IApiData;
+    renderAllTabContent: () => import("vue/jsx-runtime").JSX.Element;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelData: {
         type: PropType<IDEFormTabPanel>;

package/es/control/form/form-detail/form-tab-panel/form-tab-panel.mjs

@@ -1,4 +1,4 @@
-import { isVNode, reactive, ref, onMounted, onUnmounted, resolveComponent, createVNode, defineComponent } from 'vue';
+import { isVNode, ref, createVNode, resolveComponent, defineComponent } from 'vue';
 import { useNamespace, useController } from '@ibiz-template/vue3-util';
 import './form-tab-panel.css';
 import { FormTabPanelController } from '@ibiz-template/runtime';
@@ -19,49 +19,42 @@ const FormTabPanel = /* @__PURE__ */ defineComponent({
       required: true
     }
   },
-  setup(props, {
-    slots
-  }) {
+  setup(props) {
     const ns = useNamespace("form-tab-panel");
     useController(props.controller);
-    let counter = null;
-    const counterData = reactive({});
-    const counterRefId = ref("");
-    const onTabClick = (tabIns, event) => {
-      props.controller.onTabChange(tabIns.props.name);
-      const pageC = props.controller.form.details[tabIns.props.name];
+    const popoverVisible = ref(false);
+    const triggerClick = (key, event) => {
+      const pageC = props.controller.form.details[key];
       if (pageC) {
         pageC.onClick(event);
       }
     };
-    const fn = (data) => {
-      counterData.value = data;
+    const onTabClick = (tabIns, event) => {
+      props.controller.onTabChange(tabIns.props.name);
+      triggerClick(tabIns.props.name, event);
+    };
+    const onPopoverClick = (key, event) => {
+      props.controller.selectTab(key);
+      popoverVisible.value = false;
+      triggerClick(key, event);
+    };
+    const renderAllTabContent = () => {
+      var _a;
+      return createVNode("div", {
+        "class": ns.be("tab-panel-container-style2", "content")
+      }, [(_a = props.modelData.deformTabPages) == null ? void 0 : _a.map((page) => {
+        return createVNode("div", {
+          "class": [ns.be("tab-panel-container-style2", "tab-item-content"), ns.is("active", page.id === props.controller.state.activeTab)],
+          "onClick": (event) => onPopoverClick(page.codeName, event),
+          "title": page.caption
+        }, [page.caption]);
+      })]);
     };
-    onMounted(() => {
-      var _a, _b;
-      const defaultSlots = ((_a = slots.default) == null ? void 0 : _a.call(slots)) || [];
-      for (let i = 0; i < defaultSlots.length; i++) {
-        const slot = defaultSlots[i];
-        const pagePropsC = (_b = slot.props) == null ? void 0 : _b.controller;
-        if (pagePropsC && pagePropsC.model && pagePropsC.model.appCounterRefId) {
-          counterRefId.value = pagePropsC.model.appCounterRefId;
-          break;
-        }
-      }
-      if (counterRefId.value) {
-        counter = props.controller.getCounter(counterRefId.value);
-        if (counter) {
-          counter.onChange(fn);
-        }
-      }
-    });
-    onUnmounted(() => {
-      counter == null ? void 0 : counter.offChange(fn);
-    });
     return {
       ns,
+      popoverVisible,
       onTabClick,
-      counterData
+      renderAllTabContent
     };
   },
   render() {
@@ -75,7 +68,7 @@ const FormTabPanel = /* @__PURE__ */ defineComponent({
         "icon": c.model.sysImage
       }, null), c.model.showCaption && c.model.caption]);
     };
-    return createVNode(resolveComponent("el-tabs"), {
+    const tabContent = createVNode(resolveComponent("el-tabs"), {
       "class": [this.ns.b(), this.ns.m(this.modelData.codeName), this.modelData.detailStyle ? this.ns.m(this.modelData.detailStyle.toLowerCase()) : "", ...this.controller.containerClass],
       "model-value": this.controller.state.activeTab,
       "onTabClick": this.onTabClick
@@ -97,7 +90,7 @@ const FormTabPanel = /* @__PURE__ */ defineComponent({
         default: () => slot,
         label: () => {
           let _slot;
-          const value = c.model.counterId ? this.counterData.value[c.model.counterId] : void 0;
+          const value = c.model.counterId ? this.controller.state.counterData[c.model.counterId] : void 0;
           return c.model.counterId ? createVNode(resolveComponent("el-badge"), {
             "class": [this.ns.e("badge"), this.ns.is("no-counter", !value && value !== 0 || c.model.counterMode === 1 && value <= 0)],
             "value": value,
@@ -111,6 +104,31 @@ const FormTabPanel = /* @__PURE__ */ defineComponent({
     })) ? _slot2 : {
       default: () => [_slot2]
     });
+    if (this.modelData.detailStyle === "STYLE2") {
+      return createVNode("div", {
+        "class": this.ns.b("tab-panel-container-style2")
+      }, [tabContent, createVNode(resolveComponent("el-popover"), {
+        "trigger": "click",
+        "placement": "top-end",
+        "visible": this.popoverVisible,
+        "onUpdate:visible": ($event) => this.popoverVisible = $event,
+        "popper-class": this.ns.be("tab-panel-container-style2", "popover")
+      }, {
+        reference: () => {
+          return createVNode("div", {
+            "class": this.ns.be("tab-panel-container-style2", "select")
+          }, [createVNode("div", {
+            "class": this.ns.bem("tab-panel-container-style2", "select", "title")
+          }, [ibiz.i18n.t("control.form.formTabPnel.all")]), createVNode("ion-icon", {
+            "name": "caret-down-outline"
+          }, null)]);
+        },
+        default: () => {
+          return this.renderAllTabContent();
+        }
+      })]);
+    }
+    return tabContent;
   }
 });
 

package/es/control/form/form-detail/form-tab-panel/index.d.ts

@@ -9,8 +9,9 @@ export declare const IBizFormTabPanel: import("@ibiz-template/vue3-util").TypeWi
     };
 }, {
     ns: import("@ibiz-template/core").Namespace;
+    popoverVisible: import("vue").Ref<boolean>;
     onTabClick: (tabIns: import("@ibiz-template/core").IApiData, event: MouseEvent) => void;
-    counterData: import("@ibiz-template/core").IApiData;
+    renderAllTabContent: () => import("vue/jsx-runtime").JSX.Element;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelData: {
         type: import("vue").PropType<import("@ibiz/model-core").IDEFormTabPanel>;

package/es/control/gantt/gantt.css

@@ -1 +1 @@
-.ibiz-control-gantt{width:100%;height:100%}.ibiz-control-gantt .xg-root{--gantt-bg:var(--ibiz-color-bg-1);--gantt-bg-hover:var(--ibiz-color-disabled-border);--gantt-bg-active:var(--ibiz-color-disabled-border);--gantt-bg-checkmark:transparent;--gantt-bg-toolbar-item-hover:var(--ibiz-color-primary-light-default);--gantt-shadow:var(--ibiz-color-shadow);--gantt-shadow-toolbar-item:var(--ibiz-color-shadow);--gantt-border:var(--ibiz-color-tertiary-light-active);--gantt-border-hover:var(--ibiz-color-tertiary-light-active);--gantt-border-dashed:var(--ibiz-color-disabled-border);--gantt-border-toolbar-item:var(--ibiz-color-border);--gantt-border-separate-line:var(--ibiz-color-border);--gantt-text-0:var(--ibiz-color-text-0);--gantt-text-3:var(--ibiz-color-text-3);--gantt-white:var(--ibiz-color-white);--gantt-black:var(--ibiz-color-black);--gantt-color-primary:var(--ibiz-color-primary);--gantt-warning:var(--ibiz-color-warning);--gantt-color-linking:var(--ibiz-color-primary);--gantt-link-path-hover:var(--ibiz-color-primary)}.ibiz-control-gantt .xg-root .xg-table-body .xg-table-row{cursor:pointer}.ibiz-control-gantt .xg-root .xg-table-body .xg-table-row .xg-table-cell:not(:first-child)>div{padding:var(--ibiz-spacing-none)}.ibiz-control-gantt .xg-root .xg-table-cell>div{width:100%}.ibiz-control-gantt .xg-root .xg-table-cell>div .cell{height:100%}.ibiz-control-gantt .xg-root .xg-row.xg-gantt-row{overflow:visible}.ibiz-control-gantt .xg-root .xg-row.xg-gantt-row .xg-slider.xg-slider-drag.xg-slider-level0{overflow:visible}.ibiz-control-gantt .xg-root .xg-row.xg-gantt-row .xg-slider .xg-slider-block{overflow:visible}.ibiz-control-gantt .xg-root .xg-row.xg-gantt-row .xg-slider.is-no-width{display:none}.ibiz-control-gantt .xg-root .ibiz-control-gantt__slider--caption{position:sticky;left:8px}.ibiz-control-gantt .xg-root .is-exceeds-range .ibiz-control-gantt__slider::after{position:absolute;right:0;z-index:99;display:block;width:16px;height:100%;content:"";background-color:var(--ibiz-color-primary)}.ibiz-control-gantt--empty .xg-table-body{height:calc(100% - 86px)!important}.ibiz-control-gantt__slider{display:flex;align-items:center;height:100%;padding:var(--ibiz-spacing-none) var(--ibiz-spacing-base-tight);cursor:pointer;background-color:var(--ibiz-color-primary);border-radius:var(--ibiz-border-radius-small)}.ibiz-control-gantt__slider--container-title .icon{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-control-gantt__slider--container-title .number{display:flex;align-items:center}.ibiz-control-gantt__slider--container-title .caption{margin:var(--ibiz-spacing-tight);font-size:var(--ibiz-font-size-header-6);font-weight:var(--ibiz-font-weight-regular)}.ibiz-control-gantt__slider--container-content{display:flex;justify-content:space-between}.ibiz-control-gantt__slider--container-content .caption{margin:var(--ibiz-spacing-extra-tight);color:var(--ibiz-color-disabled-text)}.ibiz-control-gantt__slider--container-content .detail{display:flex;flex-direction:column;flex-grow:1;align-items:center}.ibiz-control-gantt__slider--caption{overflow:hidden;color:var(--ibiz-color-primary-text);text-overflow:ellipsis;white-space:nowrap}.ibiz-control-gantt__setting{display:flex;align-items:center}.ibiz-control-gantt__setting--icon{cursor:pointer;fill:var(--ibiz-color-primary)}.ibiz-control-gantt__slider-popover{z-index:300!important;width:auto;min-width:300px;padding:12px;border:none;box-shadow:var(--ibiz-shadow-elevated)}.ibiz-control-gantt__link-path-popover{z-index:300!important;width:auto;min-width:300px;padding:12px;border:none;box-shadow:var(--ibiz-shadow-elevated)}.ibiz-control-gantt .ibiz-tree-grid-ex-field-column--ellipsis .ibiz-tree-grid-ex-field-column-text-container{min-width:0}.ibiz-control-gantt .ibiz-tree-grid-ex-field-column-toolbar-container{flex-shrink:0}.ibiz-control-gantt .ibiz-tree-grid-ex-edit-column__editor{min-height:32px}.xg-view-toolbar-switch-action{--gantt-text-switch-item:var(--ibiz-color-text-3);--gantt-bg-hover-switch-item:var(--ibiz-color-bg-0)}
+.ibiz-control-gantt{width:100%;height:100%}.ibiz-control-gantt .xg-root{--gantt-bg:var(--ibiz-color-bg-1);--gantt-bg-hover:var(--ibiz-color-disabled-border);--gantt-bg-active:var(--ibiz-color-disabled-border);--gantt-bg-checkmark:transparent;--gantt-bg-toolbar-item-hover:var(--ibiz-color-primary-light-default);--gantt-shadow:var(--ibiz-color-shadow);--gantt-shadow-toolbar-item:var(--ibiz-color-shadow);--gantt-border:var(--ibiz-color-tertiary-light-active);--gantt-border-hover:var(--ibiz-color-tertiary-light-active);--gantt-border-dashed:var(--ibiz-color-disabled-border);--gantt-border-toolbar-item:var(--ibiz-color-border);--gantt-border-separate-line:var(--ibiz-color-border);--gantt-text-0:var(--ibiz-color-text-0);--gantt-text-3:var(--ibiz-color-text-3);--gantt-white:var(--ibiz-color-white);--gantt-black:var(--ibiz-color-black);--gantt-color-primary:var(--ibiz-color-primary);--gantt-warning:var(--ibiz-color-warning);--gantt-color-linking:var(--ibiz-color-primary);--gantt-link-path-hover:var(--ibiz-color-primary)}.ibiz-control-gantt .xg-root .xg-table-body .xg-table-row{cursor:pointer}.ibiz-control-gantt .xg-root .xg-table-body .xg-table-row .xg-table-cell:not(:first-child)>div{padding:var(--ibiz-spacing-none)}.ibiz-control-gantt .xg-root .xg-table-cell>div{width:100%}.ibiz-control-gantt .xg-root .xg-table-cell>div .cell{height:100%}.ibiz-control-gantt .xg-root .xg-row.xg-gantt-row{overflow:visible}.ibiz-control-gantt .xg-root .xg-row.xg-gantt-row .xg-slider.xg-slider-drag.xg-slider-level0{overflow:visible}.ibiz-control-gantt .xg-root .xg-row.xg-gantt-row .xg-slider .xg-slider-block{overflow:visible}.ibiz-control-gantt .xg-root .xg-row.xg-gantt-row .xg-slider.is-no-width{display:none}.ibiz-control-gantt .xg-root .ibiz-control-gantt__slider--caption{position:sticky;left:8px}.ibiz-control-gantt .xg-root .is-exceeds-range .ibiz-control-gantt__slider::after{position:absolute;right:0;z-index:99;display:block;width:16px;height:100%;content:"";background-color:var(--ibiz-color-primary)}.ibiz-control-gantt--empty .xg-table-body{height:calc(100% - 86px)!important}.ibiz-control-gantt__slider{display:flex;align-items:center;height:100%;padding:var(--ibiz-spacing-none) var(--ibiz-spacing-base-tight);cursor:pointer;background-color:var(--ibiz-color-primary);border-radius:var(--ibiz-border-radius-small)}.ibiz-control-gantt__slider--container-title .icon{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-control-gantt__slider--container-title .number{display:flex;align-items:center}.ibiz-control-gantt__slider--container-title .caption{margin:var(--ibiz-spacing-tight);font-size:var(--ibiz-font-size-header-6);font-weight:var(--ibiz-font-weight-regular)}.ibiz-control-gantt__slider--container-content{display:flex;justify-content:space-between}.ibiz-control-gantt__slider--container-content .caption{margin:var(--ibiz-spacing-extra-tight);color:var(--ibiz-color-disabled-text)}.ibiz-control-gantt__slider--container-content .detail{display:flex;flex-direction:column;flex-grow:1;align-items:center}.ibiz-control-gantt__slider--caption{overflow:hidden;color:var(--ibiz-color-primary-text);text-overflow:ellipsis;white-space:nowrap}.ibiz-control-gantt__setting{display:flex;align-items:center}.ibiz-control-gantt__setting--icon{cursor:pointer;fill:var(--ibiz-color-primary)}.ibiz-control-gantt__slider-popover{z-index:300!important;width:auto;min-width:300px;padding:12px;border:none;box-shadow:var(--ibiz-shadow-elevated)}.ibiz-control-gantt__link-path-popover{z-index:300!important;width:auto;min-width:300px;padding:12px;border:none;box-shadow:var(--ibiz-shadow-elevated)}.ibiz-control-gantt .ibiz-tree-grid-ex-field-column--ellipsis .ibiz-tree-grid-ex-field-column-text-container{min-width:0}.ibiz-control-gantt .ibiz-tree-grid-ex-field-column-toolbar-container{flex-shrink:0}.ibiz-control-gantt .ibiz-tree-grid-ex-edit-column__editor{min-height:32px}.ibiz-control-gantt .xg-root .xg-table-body .xg-table-row .ibiz-action-toolbar__item.is-expand{display:inline-flex;opacity:1}.ibiz-control-gantt .xg-root .xg-table-body .xg-table-row:hover .ibiz-action-toolbar__item{display:inline-flex;opacity:1}.ibiz-control-gantt .xg-root .xg-table-body .xg-table-row:hover .ibiz-action-toolbar__separator{display:inline-flex;opacity:1}.xg-view-toolbar-switch-action{--gantt-text-switch-item:var(--ibiz-color-text-3);--gantt-bg-hover-switch-item:var(--ibiz-color-bg-0)}

package/es/control/gantt/gantt.d.ts

@@ -1,7 +1,7 @@
-import { PropType, VNode, Ref } from 'vue';
+import { Ref, VNode, PropType } from 'vue';
 import { IDEGantt, IDETreeColumn } from '@ibiz/model-core';
-import { IControlProvider, GanttController, IGanttNodeData } from '@ibiz-template/runtime';
-import { AllowDropType, NodeDropType } from 'element-plus/es/components/tree/src/tree.type';
+import { IGanttNodeData, GanttController, IControlProvider } from '@ibiz-template/runtime';
+import { NodeDropType, AllowDropType } from 'element-plus/es/components/tree/src/tree.type';
 import './gantt.scss';
 export declare const GanttControl: import("vue").DefineComponent<{
     /**
@@ -64,6 +64,7 @@ export declare const GanttControl: import("vue").DefineComponent<{
     columns: import("vue").ComputedRef<IDETreeColumn[]>;
     onCheck: (state: boolean, item: IGanttNodeData) => void;
     loading: import("vue").ComputedRef<boolean>;
+    expandColumnName: import("vue").ComputedRef<string | undefined>;
     ganttStyle: Ref<import("@ibiz-template/core").IApiData>;
     onNodeClick: (nodeData: IGanttNodeData, evt: MouseEvent) => void;
     onNodeDbClick: (nodeData: IGanttNodeData) => void;

package/es/control/gantt/gantt.mjs

@@ -156,6 +156,14 @@ const GanttControl = /* @__PURE__ */ defineComponent({
     const locale = computed(() => {
       return ibiz.i18n.getLang().toLowerCase();
     });
+    const expandColumnName = computed(() => {
+      var _a2;
+      const columnKey = (_a2 = c.controlParams.expandiconcolumn) == null ? void 0 : _a2.toLowerCase();
+      const columnSatate = c.state.columnStates.find((item) => columnKey && item.key.toLowerCase() === columnKey);
+      if (columnSatate && !columnSatate.hidden)
+        return columnSatate.key;
+      return void 0;
+    });
     watch([() => ganttRef.value, () => c.state.selectedData], ([table, newVal]) => {
       if (forbidOperation || !table)
         return;
@@ -654,6 +662,7 @@ const GanttControl = /* @__PURE__ */ defineComponent({
       columns,
       onCheck,
       loading,
+      expandColumnName,
       ganttStyle,
       onNodeClick,
       onNodeDbClick,
@@ -708,6 +717,7 @@ const GanttControl = /* @__PURE__ */ defineComponent({
         "allow-drop": this.allowDrop,
         "allow-drag": this.allowDrag,
         "onNodeDrop": this.handleDrop,
+        "expandColumnName": this.expandColumnName,
         "showCheckbox": !this.c.state.singleSelect,
         "onNodeExpand": this.onNodeExpand,
         "onNodeCollapse": this.onNodeCollapse,

package/es/control/gantt/index.d.ts

@@ -36,6 +36,7 @@ export declare const IBizGanttControl: import("@ibiz-template/vue3-util").TypeWi
     columns: import("vue").ComputedRef<import("@ibiz/model-core").IDETreeColumn[]>;
     onCheck: (state: boolean, item: import("@ibiz-template/runtime").IGanttNodeData) => void;
     loading: import("vue").ComputedRef<boolean>;
+    expandColumnName: import("vue").ComputedRef<string | undefined>;
     ganttStyle: import("vue").Ref<import("@ibiz-template/core").IApiData>;
     onNodeClick: (nodeData: import("@ibiz-template/runtime").IGanttNodeData, evt: MouseEvent) => void;
     onNodeDbClick: (nodeData: import("@ibiz-template/runtime").IGanttNodeData) => void;

package/es/control/grid/grid/grid.d.ts

@@ -2,7 +2,7 @@ import { VNode, PropType } from 'vue';
 import { IDEGrid, IDEGridColumn } from '@ibiz/model-core';
 import { GridRowState, GridController, IControlProvider, GridFieldColumnController } from '@ibiz-template/runtime';
 import './grid.scss';
-export declare function renderFieldColumn(c: GridFieldColumnController, row: GridRowState): JSX.Element;
+export declare function renderFieldColumn(c: GridFieldColumnController, row: GridRowState): import("vue/jsx-runtime").JSX.Element;
 export declare function renderColumn(c: GridController, model: IDEGridColumn, renderColumns: IDEGridColumn[], index: number): VNode | null;
 export declare function renderChildColumn(c: GridController, model: IDEGridColumn, renderColumns: IDEGridColumn[], index: number): VNode | null;
 export declare const GridControl: import("vue").DefineComponent<{
@@ -122,9 +122,9 @@ export declare const GridControl: import("vue").DefineComponent<{
         data: import("@ibiz-template/core").IApiData[];
     }) => string[];
     headerDragend: (newWidth: number, oldWidth: number, column: import("@ibiz-template/core").IApiData) => void;
-    renderPopover: () => JSX.Element[];
+    renderPopover: () => import("vue/jsx-runtime").JSX.Element[];
     onPageRefresh: () => void;
-    renderRowDetail: () => JSX.Element | undefined;
+    renderRowDetail: () => import("vue/jsx-runtime").JSX.Element | undefined;
     onPageSizeChange: (size: number) => void;
     renderTableColumn: (model: IDEGridColumn, index: number) => VNode | null;
     onSelectionChange: (selection: import("@ibiz-template/runtime").ControlVO[]) => void;
@@ -132,7 +132,7 @@ export declare const GridControl: import("vue").DefineComponent<{
         row: import("@ibiz-template/core").IApiData;
     }) => string;
     renderBatchToolBar: () => VNode | undefined;
-    renderDragIconColumn: () => JSX.Element;
+    renderDragIconColumn: () => import("vue/jsx-runtime").JSX.Element;
     handleHeaderCellClassName: ({ _row, column, _rowIndex, _columnIndex, }: {
         _row: import("@ibiz-template/core").IApiData;
         column: import("@ibiz-template/core").IApiData;

package/es/control/grid/grid/grid.mjs

@@ -136,25 +136,31 @@ function renderFieldColumn(c, row) {
   }, [actionToolbar])] : content]);
 }
 function renderColumn(c, model, renderColumns, index) {
-  var _a, _b, _c;
+  var _a, _b, _c, _d;
   const {
     codeName: columnName,
     width
   } = model;
   const columnC = c.columns[columnName];
   const columnState = c.state.columnStates.find((item) => item.key === columnName);
+  let type = "default";
+  const expandiconcolumn = (_a = c.controlParams.expandiconcolumn) == null ? void 0 : _a.toLowerCase();
+  const expandColumnSatate = c.state.columnStates.find((item) => expandiconcolumn && item.key.toLowerCase() === expandiconcolumn);
+  if (expandColumnSatate && !expandColumnSatate.hidden)
+    type = (columnName == null ? void 0 : columnName.toLowerCase()) === expandiconcolumn ? "default" : "";
   const widthFlexGrow = columnC.isAdaptiveColumn || !c.hasAdaptiveColumn && index === renderColumns.length - 1;
   const widthName = widthFlexGrow ? "min-width" : "width";
   const tempWidth = (columnState == null ? void 0 : columnState.columnWidth) || width;
   return createVNode(resolveComponent("el-table-column"), mergeProps({
-    "className": "".concat((_a = model.columnType) == null ? void 0 : _a.toLowerCase(), " ").concat((_b = model.columnType) == null ? void 0 : _b.toLowerCase(), "-").concat(columnName),
+    "type": type,
+    "prop": columnName,
     "label": model.caption,
-    "prop": columnName
+    "fixed": columnState.fixed
   }, {
     [widthName]: tempWidth
   }, {
-    "fixed": columnState.fixed,
     "sortable": model.enableSort ? c.model.sortMode === "LOCAL" || "custom" : false,
+    "align": ((_b = model.align) == null ? void 0 : _b.toLowerCase()) || "center",
     "sortMethod": (a, b) => {
       const fieldName = model.id.toLowerCase();
       if (a[fieldName] < b[fieldName] || !a[fieldName])
@@ -163,7 +169,7 @@ function renderColumn(c, model, renderColumns, index) {
         return 1;
       return 0;
     },
-    "align": ((_c = model.align) == null ? void 0 : _c.toLowerCase()) || "center"
+    "className": "".concat((_c = model.columnType) == null ? void 0 : _c.toLowerCase(), " ").concat((_d = model.columnType) == null ? void 0 : _d.toLowerCase(), "-").concat(columnName)
   }), {
     header: ({
       column
@@ -407,7 +413,7 @@ const GridControl = /* @__PURE__ */ defineComponent({
         return;
       }
       return createVNode("div", {
-        "class": [ns.b("batch-toolbar"), ns.is("show", c.state.selectedData.length > 0)]
+        "class": [ns.b("batch-toolbar"), ns.is("show", c.showBatchToolbar)]
       }, [createVNode("div", {
         "class": ns.b("batch-toolbar-content")
       }, [createVNode("div", {

package/es/control/grid/grid/index.d.ts

@@ -86,9 +86,9 @@ export declare const IBizGridControl: import("@ibiz-template/vue3-util").TypeWit
         data: import("@ibiz-template/core").IApiData[];
     }) => string[];
     headerDragend: (newWidth: number, oldWidth: number, column: import("@ibiz-template/core").IApiData) => void;
-    renderPopover: () => JSX.Element[];
+    renderPopover: () => import("vue/jsx-runtime").JSX.Element[];
     onPageRefresh: () => void;
-    renderRowDetail: () => JSX.Element | undefined;
+    renderRowDetail: () => import("vue/jsx-runtime").JSX.Element | undefined;
     onPageSizeChange: (size: number) => void;
     renderTableColumn: (model: import("@ibiz/model-core").IDEGridColumn, index: number) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
@@ -100,7 +100,7 @@ export declare const IBizGridControl: import("@ibiz-template/vue3-util").TypeWit
     renderBatchToolBar: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }> | undefined;
-    renderDragIconColumn: () => JSX.Element;
+    renderDragIconColumn: () => import("vue/jsx-runtime").JSX.Element;
     handleHeaderCellClassName: ({ _row, column, _rowIndex, _columnIndex, }: {
         _row: import("@ibiz-template/core").IApiData;
         column: import("@ibiz-template/core").IApiData;

package/es/control/grid/row-edit-popover/use-row-edit-popover.d.ts

@@ -1,5 +1,5 @@
 import { GridController } from '@ibiz-template/runtime';
 import { Ref } from 'vue';
 export declare function useRowEditPopover(tableRef: Ref<IData | undefined>, c: GridController): {
-    renderPopover: () => JSX.Element[];
+    renderPopover: () => import("vue/jsx-runtime").JSX.Element[];
 };

package/es/control/grid/virtualized-table/index.d.ts

@@ -64,11 +64,11 @@ export declare const IBizVirtualizedTableControl: import("@ibiz-template/vue3-ut
         [key: string]: any;
     }> | null;
     calcRowClass: (params: import("@ibiz-template/core").IApiParams) => string;
-    renderBodyCell: (params: import("@ibiz-template/core").IApiParams) => JSX.Element;
+    renderBodyCell: (params: import("@ibiz-template/core").IApiParams) => import("vue/jsx-runtime").JSX.Element;
     handleRowClick: (event: MouseEvent, data: import("@ibiz-template/runtime").ControlVO) => Promise<void>;
     calcColumnWidth: (_columns: import("./virtualized-table.util").IColumn[], bodyWidth: number) => import("./virtualized-table.util").IColumn[];
     handleDbRowClick: (event: MouseEvent, data: import("@ibiz-template/runtime").ControlVO) => Promise<void>;
-    renderHeaderCell: (params: import("@ibiz-template/core").IApiParams) => JSX.Element;
+    renderHeaderCell: (params: import("@ibiz-template/core").IApiParams) => import("vue/jsx-runtime").JSX.Element;
     renderBatchToolBar: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }> | undefined;

package/es/control/grid/virtualized-table/virtualized-table.d.ts

@@ -99,11 +99,11 @@ export declare const VirtualizedTableControl: import("vue").DefineComponent<{
     onPageSizeChange: (size: number) => void;
     renderNoData: () => VNode | null;
     calcRowClass: (params: IParams) => string;
-    renderBodyCell: (params: IParams) => JSX.Element;
+    renderBodyCell: (params: IParams) => import("vue/jsx-runtime").JSX.Element;
     handleRowClick: (event: MouseEvent, data: ControlVO) => Promise<void>;
     calcColumnWidth: (_columns: IColumn[], bodyWidth: number) => IColumn[];
     handleDbRowClick: (event: MouseEvent, data: ControlVO) => Promise<void>;
-    renderHeaderCell: (params: IParams) => JSX.Element;
+    renderHeaderCell: (params: IParams) => import("vue/jsx-runtime").JSX.Element;
     renderBatchToolBar: () => VNode | undefined;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     /**

package/es/control/kanban/index.d.ts

@@ -52,7 +52,7 @@ export declare const IBizKanbanControl: import("@ibiz-template/vue3-util").TypeW
     ns: import("@ibiz-template/core").Namespace;
     isFull: import("vue").Ref<boolean>;
     kanban: import("vue").Ref<any>;
-    renderGroup: (group: import("@ibiz-template/runtime").IKanbanGroupState) => JSX.Element;
+    renderGroup: (group: import("@ibiz-template/runtime").IKanbanGroupState) => import("vue/jsx-runtime").JSX.Element;
     onFullScreen: () => void;
     onPageChange: (page: number) => void;
     onPageRefresh: () => void;

package/es/control/kanban/kanban.css

@@ -1 +1 @@
-.ibiz-control-kanban{--ibiz-control-kanban-text-color:var(--ibiz-color-text-0);--ibiz-control-kanban-font-size:var(--ibiz-font-size-regular);--ibiz-control-kanban-font-weight:var(--ibiz-font-weight-bold);--ibiz-control-kanban-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-kanban-selected-bg-color:var(--ibiz-color-fill-0);--ibiz-control-kanban-group-header-height:48px;display:flex;flex-direction:column;width:100%;height:100%}.ibiz-control-kanban.is-enable-page .ibiz-control-kanban__content{height:calc(100% - 50px)}.ibiz-control-kanban__drag-icon{margin-right:var(--ibiz-spacing-tight);cursor:move;visibility:hidden}.ibiz-control-kanban__content{display:flex;flex-grow:1}.ibiz-control-kanban--row .ibiz-control-kanban-group-container{display:flex;padding-bottom:var(--ibiz-spacing-tight);overflow:auto}.ibiz-control-kanban--row .ibiz-control-kanban-group-container>*+*{margin-left:var(--ibiz-spacing-base)}.ibiz-control-kanban--row .ibiz-control-kanban-group.is-collapse{width:32px}.ibiz-control-kanban--row .ibiz-control-kanban-group.is-collapse .ibiz-control-kanban-group__header{position:relative;flex-direction:column;align-items:start;height:100%;padding:var(--ibiz-spacing-none)}.ibiz-control-kanban--row .ibiz-control-kanban-group.is-collapse .ibiz-control-kanban-group__header ion-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.ibiz-control-kanban--row .ibiz-control-kanban-group.is-collapse .ibiz-control-kanban-group__header-caption{align-self:center;transform:rotate(90deg) translate(calc(50% - var(--ibiz-spacing-tight)),0)}.ibiz-control-kanban--column .ibiz-control-kanban-group-container{display:flex;flex-direction:column}.ibiz-control-kanban--column .ibiz-control-kanban-group-container>*+*{margin-top:var(--ibiz-spacing-base)}.ibiz-control-kanban--column .ibiz-control-kanban-group.is-collapse{width:100%}.ibiz-control-kanban--column .ibiz-control-kanban-group.is-collapse ion-icon{transform:rotate(-90deg)}.ibiz-control-kanban .ibiz-control-kanban__default-item,.ibiz-control-kanban .ibiz-control-kanban__panel-item{flex-grow:1}.ibiz-control-kanban-group-container{flex:1}.ibiz-control-kanban-group{display:flex;flex-flow:column nowrap;flex-shrink:0;border:1px solid var(--ibiz-color-border);border-radius:var(--ibiz-border-radius-small);transition:all .3s}.ibiz-control-kanban-group__header{position:relative;height:var(--ibiz-control-kanban-group-header-height);padding:var(--ibiz-spacing-none) var(--ibiz-spacing-base);font-size:var(--ibiz-control-kanban-font-size);font-weight:var(--ibiz-control-kanban-font-weight);cursor:pointer;border-bottom:1px solid var(--ibiz-color-border);display:flex;align-items:center;justify-content:space-between}.ibiz-control-kanban-group__header::before{position:absolute;top:0;left:0;display:block;width:100%;content:"";border-color:inherit;border-top:2px solid}.ibiz-control-kanban-group__header-left{display:flex;align-items:center;justify-content:center}.ibiz-control-kanban-group__header-left ion-icon{margin-right:var(--ibiz-spacing-tight);transition:transform .3s}.ibiz-control-kanban-group__header-caption{padding:0 var(--ibiz-spacing-tight);white-space:nowrap}.ibiz-control-kanban-group__header-caption.is-badge{color:var(--ibiz-color-primary-active-text)}.ibiz-control-kanban-group__list{position:relative;flex:auto;width:100%;height:calc(100% - 48px);padding:var(--ibiz-spacing-none) var(--ibiz-spacing-tight);overflow:auto}.ibiz-control-kanban-group__list:hover .ibiz-control-kanban__quicktoolbar{visibility:visible}.ibiz-control-kanban-group__draggable{min-height:100%;padding:var(--ibiz-spacing-base) 0}.ibiz-control-kanban-group__list.is-empty{display:flex;flex-direction:column}.ibiz-control-kanban-group__list.is-empty .ibiz-control-kanban-group__draggable{flex-shrink:0;min-height:0}.ibiz-control-kanban-group__list.is-empty .ibiz-control-kanban__quicktoolbar{flex-grow:1;width:calc(100% - var(--ibiz-spacing-base))}.ibiz-control-kanban-group__list.is-empty .ibiz-control-toolbar__item{justify-content:center}.ibiz-control-kanban-group__header-actions{position:relative;z-index:100;width:32px;height:32px;padding:var(--ibiz-spacing-tight);margin-left:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-control-kanban-font-size);color:var(--ibiz-color-primary);cursor:pointer;border-radius:var(--ibiz-border-radius-circle)}.ibiz-control-kanban-group__header-actions:hover{background-color:var(--ibiz-color-fill-0)}.ibiz-control-kanban-group__actions-dropdown:has(.el-button){padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none)}.ibiz-control-kanban-group__actions-dropdown .ibiz-action-toolbar{display:flex;flex-flow:column nowrap}.ibiz-control-kanban-group__actions-dropdown .el-button{--el-button-size:var(--ibiz-height-control-large);justify-content:flex-start;width:100%;padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);margin:var(--ibiz-spacing-none);font-size:var(--ibiz-font-size-regular);color:var(--ibiz-color-primary-text)}.ibiz-control-kanban-group__actions-dropdown .el-button ion-icon{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-control-kanban-group__actions-dropdown .el-button.is-text:not(.is-disabled):hover{background-color:var(--el-button-hover-bg-color);border-color:var(--el-button-hover-border-color)}.ibiz-control-kanban-item{cursor:pointer}.ibiz-control-kanban-item:hover{background-color:var(--ibiz-control-kanban-hover-bg-color)}.ibiz-control-kanban-item:hover .ibiz-control-kanban__drag-icon{visibility:visible}.ibiz-control-kanban-item.is-selected{background-color:var(--ibiz-control-kanban-selected-bg-color)}.ibiz-control-kanban-item.is-disabled{cursor:no-drop}.ibiz-control-kanban-item__content{display:flex;align-items:center;width:100%;height:100%}.ibiz-control-kanban-item__bottom{display:flex;align-items:center;justify-content:center;padding:var(--ibiz-spacing-tight);margin-top:var(--ibiz-spacing-tight);border-top:1px solid var(--ibiz-color-border)}.ibiz-control-kanban-item__bottom--actions{display:flex;justify-content:center}.ibiz-control-kanban-item__bottom--actions .ibiz-action-toolbar__item{margin:0}.ibiz-control-kanban-item__bottom--actions .ibiz-action-toolbar__item--label.is-has-caption{margin:0}.ibiz-control-kanban-item+.ibiz-control-kanban-item{margin-top:var(--ibiz-spacing-base)}.ibiz-control-kanban{position:relative}.ibiz-control-kanban__popover>.el-scrollbar{overflow:visible}.ibiz-control-kanban__popover .ibiz-action-toolbar__popover{background-color:var(--ibiz-color-primary)!important}.ibiz-control-kanban__quicktoolbar{margin-bottom:var(--ibiz-spacing-base);visibility:hidden;display:flex;flex-flow:column nowrap}.ibiz-control-kanban__quicktoolbar>*+*{margin-top:var(--ibiz-spacing-tight)}.ibiz-control-kanban.is-full{padding:var(--ibiz-spacing-base);background-color:var(--ibiz-color-bg-2)}.ibiz-control-kanban-toolbar{display:flex;flex-shrink:0;gap:var(--ibiz-spacing-tight)}.ibiz-control-kanban-toolbar .el-button{border:1px solid var(--ibiz-color-border)}.ibiz-control-kanban-batch{padding:var(--ibiz-spacing-base-tight);border-bottom:1px solid var(--ibiz-color-border)}.ibiz-control-kanban-batch__toolbar .ibiz-control-toolbar{flex-wrap:wrap;row-gap:var(--ibiz-spacing-tight)}.ibiz-control-kanban-batch__check{display:flex;align-items:center;justify-content:space-between;margin-top:var(--ibiz-spacing-base-tight);font-size:var(--ibiz-font-size-regular)}.ibiz-control-kanban-batch__info span{margin:var(--ibiz-spacing-none) var(--ibiz-spacing-extra-tight);color:var(--ibiz-color-primary)}
+.ibiz-control-kanban{--ibiz-control-kanban-text-color:var(--ibiz-color-text-0);--ibiz-control-kanban-font-size:var(--ibiz-font-size-regular);--ibiz-control-kanban-font-weight:var(--ibiz-font-weight-bold);--ibiz-control-kanban-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-kanban-selected-bg-color:var(--ibiz-color-fill-0);--ibiz-control-kanban-group-header-height:48px;display:flex;flex-direction:column;width:100%;height:100%}.ibiz-control-kanban.is-enable-page .ibiz-control-kanban__content{height:calc(100% - 50px)}.ibiz-control-kanban__drag-icon{margin-right:var(--ibiz-spacing-tight);cursor:move;visibility:hidden}.ibiz-control-kanban__content{display:flex;flex-grow:1}.ibiz-control-kanban--row .ibiz-control-kanban-group-container{display:flex;padding-bottom:var(--ibiz-spacing-tight);overflow:auto}.ibiz-control-kanban--row .ibiz-control-kanban-group-container>*+*{margin-left:var(--ibiz-spacing-base)}.ibiz-control-kanban--row .ibiz-control-kanban-group.is-collapse{width:32px}.ibiz-control-kanban--row .ibiz-control-kanban-group.is-collapse .ibiz-control-kanban-group__header{position:relative;flex-direction:column;align-items:start;height:100%;padding:var(--ibiz-spacing-none)}.ibiz-control-kanban--row .ibiz-control-kanban-group.is-collapse .ibiz-control-kanban-group__header ion-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.ibiz-control-kanban--row .ibiz-control-kanban-group.is-collapse .ibiz-control-kanban-group__header-caption{align-self:center;transform:rotate(90deg) translate(calc(50% - var(--ibiz-spacing-tight)),0)}.ibiz-control-kanban--column .ibiz-control-kanban-group-container{display:flex;flex-direction:column}.ibiz-control-kanban--column .ibiz-control-kanban-group-container>*+*{margin-top:var(--ibiz-spacing-base)}.ibiz-control-kanban--column .ibiz-control-kanban-group.is-collapse{width:100%}.ibiz-control-kanban--column .ibiz-control-kanban-group.is-collapse ion-icon{transform:rotate(-90deg)}.ibiz-control-kanban .ibiz-control-kanban__default-item,.ibiz-control-kanban .ibiz-control-kanban__panel-item{flex-grow:1}.ibiz-control-kanban-group-container{flex:1}.ibiz-control-kanban-group{display:flex;flex-flow:column nowrap;flex-shrink:0;border:1px solid var(--ibiz-color-border);border-radius:var(--ibiz-border-radius-small);transition:all .3s}.ibiz-control-kanban-group__header{position:relative;height:var(--ibiz-control-kanban-group-header-height);padding:var(--ibiz-spacing-none) var(--ibiz-spacing-base);font-size:var(--ibiz-control-kanban-font-size);font-weight:var(--ibiz-control-kanban-font-weight);cursor:pointer;border-bottom:1px solid var(--ibiz-color-border);display:flex;align-items:center;justify-content:space-between}.ibiz-control-kanban-group__header::before{position:absolute;top:0;left:0;display:block;width:100%;content:"";border-color:inherit;border-top:2px solid}.ibiz-control-kanban-group__header-left{display:flex;align-items:center;justify-content:center}.ibiz-control-kanban-group__header-left ion-icon{margin-right:var(--ibiz-spacing-tight);transition:transform .3s}.ibiz-control-kanban-group__header-caption{padding:0 var(--ibiz-spacing-tight);white-space:nowrap}.ibiz-control-kanban-group__header-caption.is-badge{color:var(--ibiz-color-primary-active-text)}.ibiz-control-kanban-group__list{position:relative;flex:auto;width:100%;height:calc(100% - 48px);padding:var(--ibiz-spacing-none) var(--ibiz-spacing-tight);overflow:auto}.ibiz-control-kanban-group__list:hover .ibiz-control-kanban__quicktoolbar{visibility:visible}.ibiz-control-kanban-group__draggable{min-height:100%;padding:var(--ibiz-spacing-base) 0}.ibiz-control-kanban-group__list.is-empty{display:flex;flex-direction:column}.ibiz-control-kanban-group__list.is-empty .ibiz-control-kanban-group__draggable{flex-shrink:0;min-height:0}.ibiz-control-kanban-group__list.is-empty .ibiz-control-kanban__quicktoolbar{flex-grow:1;width:calc(100% - var(--ibiz-spacing-base))}.ibiz-control-kanban-group__list.is-empty .ibiz-control-toolbar__item{justify-content:center}.ibiz-control-kanban-group__header-actions{position:relative;z-index:100;width:32px;height:32px;padding:var(--ibiz-spacing-tight);margin-left:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-control-kanban-font-size);color:var(--ibiz-color-primary);cursor:pointer;border-radius:var(--ibiz-border-radius-circle)}.ibiz-control-kanban-group__header-actions:hover{background-color:var(--ibiz-color-fill-0)}.ibiz-control-kanban-group__actions-dropdown:has(.el-button){padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none)}.ibiz-control-kanban-group__actions-dropdown .ibiz-action-toolbar{display:flex;flex-flow:column nowrap}.ibiz-control-kanban-group__actions-dropdown .el-button{--el-button-size:var(--ibiz-height-control-large);justify-content:flex-start;width:100%;padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);margin:var(--ibiz-spacing-none);font-size:var(--ibiz-font-size-regular);color:var(--ibiz-color-primary-text)}.ibiz-control-kanban-group__actions-dropdown .el-button ion-icon{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-control-kanban-group__actions-dropdown .el-button.is-text:not(.is-disabled):hover{background-color:var(--el-button-hover-bg-color);border-color:var(--el-button-hover-border-color)}.ibiz-control-kanban-item{cursor:pointer}.ibiz-control-kanban-item:hover{background-color:var(--ibiz-control-kanban-hover-bg-color)}.ibiz-control-kanban-item:hover .ibiz-control-kanban__drag-icon{visibility:visible}.ibiz-control-kanban-item.is-selected{background-color:var(--ibiz-control-kanban-selected-bg-color)}.ibiz-control-kanban-item.is-disabled{cursor:no-drop}.ibiz-control-kanban-item__content{display:flex;align-items:center;width:100%;height:100%}.ibiz-control-kanban-item__bottom{display:flex;align-items:center;justify-content:center;padding:var(--ibiz-spacing-tight);margin-top:var(--ibiz-spacing-tight);border-top:1px solid var(--ibiz-color-border)}.ibiz-control-kanban-item__bottom--actions{display:flex;justify-content:center}.ibiz-control-kanban-item__bottom--actions .ibiz-action-toolbar__item{margin:0}.ibiz-control-kanban-item__bottom--actions .ibiz-action-toolbar__item--label.is-has-caption{margin:0}.ibiz-control-kanban-item+.ibiz-control-kanban-item{margin-top:var(--ibiz-spacing-base)}.ibiz-control-kanban{position:relative}.ibiz-control-kanban__popover>.el-scrollbar{min-width:150px;overflow:visible}.ibiz-control-kanban__popover .ibiz-action-toolbar__popover{padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none)!important;background-color:var(--ibiz-color-primary)!important;border-radius:0!important}.ibiz-control-kanban__quicktoolbar{margin-bottom:var(--ibiz-spacing-base);visibility:hidden;display:flex;flex-flow:column nowrap}.ibiz-control-kanban__quicktoolbar>*+*{margin-top:var(--ibiz-spacing-tight)}.ibiz-control-kanban.is-full{padding:var(--ibiz-spacing-base);background-color:var(--ibiz-color-bg-2)}.ibiz-control-kanban-toolbar{display:flex;flex-shrink:0;gap:var(--ibiz-spacing-tight)}.ibiz-control-kanban-toolbar .el-button{border:1px solid var(--ibiz-color-border)}.ibiz-control-kanban-batch{padding:var(--ibiz-spacing-base-tight);border-bottom:1px solid var(--ibiz-color-border)}.ibiz-control-kanban-batch__toolbar .ibiz-control-toolbar{flex-wrap:wrap;row-gap:var(--ibiz-spacing-tight)}.ibiz-control-kanban-batch__check{display:flex;align-items:center;justify-content:space-between;margin-top:var(--ibiz-spacing-base-tight);font-size:var(--ibiz-font-size-regular)}.ibiz-control-kanban-batch__info span{margin:var(--ibiz-spacing-none) var(--ibiz-spacing-extra-tight);color:var(--ibiz-color-primary)}

package/es/control/kanban/kanban.d.ts

@@ -85,7 +85,7 @@ export declare const KanbanControl: import("vue").DefineComponent<{
     ns: import("@ibiz-template/core").Namespace;
     isFull: Ref<boolean>;
     kanban: Ref<any>;
-    renderGroup: (group: IKanbanGroupState) => JSX.Element;
+    renderGroup: (group: IKanbanGroupState) => import("vue/jsx-runtime").JSX.Element;
     onFullScreen: () => void;
     onPageChange: (page: number) => void;
     onPageRefresh: () => void;

package/es/control/kanban/kanban.mjs

@@ -406,6 +406,7 @@ const KanbanControl = /* @__PURE__ */ defineComponent({
         dropdown: () => createVNode("div", {
           "class": ns.be("group", "actions-dropdown")
         }, [c.model.groupUIActionGroup && group.groupActionGroupState && createVNode(resolveComponent("iBizActionToolbar"), {
+          "direction": "vertical",
           "actionDetails": c.model.groupUIActionGroup.uiactionGroupDetails,
           "actionsState": group.groupActionGroupState,
           "onActionClick": (detail, event) => {

package/es/control/kanban/swimlane-kanban/swimlane-kanban.d.ts

@@ -13,8 +13,8 @@ export declare const SwimlaneKanban: import("vue").DefineComponent<{
     ns: import("@ibiz-template/core").Namespace;
     swimlaneKanban: Ref<any>;
     width: import("vue").ComputedRef<number>;
-    renderHeader: () => JSX.Element;
-    renderBody: () => JSX.Element;
+    renderHeader: () => import("vue/jsx-runtime").JSX.Element;
+    renderBody: () => import("vue/jsx-runtime").JSX.Element;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     controller: {
         type: PropType<KanbanController>;