npm - @public-ui/angular-v21 - Versions diffs - 4.1.2-rc.1 → 4.1.2-rc.2 - Mend

@public-ui/angular-v21 4.1.2-rc.1 → 4.1.2-rc.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/dist/components.js CHANGED Viewed

@@ -332,78 +332,6 @@ function KolCard_ng_template_1_Template(rf, ctx) { if (rf & 1) {
 function KolCard_ng_template_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵprojection(0);
 } }
-function KolCardWc_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolCardWc_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementStart(0, "stencil-ng-proxy", 5, 2);
-    i0.ɵɵdomTemplate(2, KolCardWc_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template, 1, 0, "ng-container", 6);
-    i0.ɵɵdomElementEnd();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext(2);
-    const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_hasCloser", ctx_r0._hasCloser)("_label", ctx_r0._label)("_level", ctx_r0._level)("_on", ctx_r0._on);
-    i0.ɵɵadvance(2);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
-} }
-function KolCardWc_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolCardWc_ng_container_0_stencil_ng_proxy_1_Template, 3, 5, "stencil-ng-proxy", 4);
-    i0.ɵɵdomElementContainerEnd();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵdomProperty("replaceTag", ctx_r0.tagName);
-} }
-function KolCardWc_ng_template_1_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolCardWc_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomTemplate(0, KolCardWc_ng_template_1_ng_container_0_Template, 1, 0, "ng-container", 6);
-} if (rf & 2) {
-    i0.ɵɵnextContext();
-    const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
-} }
-function KolCardWc_ng_template_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵprojection(0);
-} }
-function KolClickButton_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolClickButton_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementStart(0, "stencil-ng-proxy", 5, 2);
-    i0.ɵɵdomTemplate(2, KolClickButton_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template, 1, 0, "ng-container", 6);
-    i0.ɵɵdomElementEnd();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext(2);
-    const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_label", ctx_r0._label);
-    i0.ɵɵadvance(2);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
-} }
-function KolClickButton_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolClickButton_ng_container_0_stencil_ng_proxy_1_Template, 3, 2, "stencil-ng-proxy", 4);
-    i0.ɵɵdomElementContainerEnd();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵdomProperty("replaceTag", ctx_r0.tagName);
-} }
-function KolClickButton_ng_template_1_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolClickButton_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomTemplate(0, KolClickButton_ng_template_1_ng_container_0_Template, 1, 0, "ng-container", 6);
-} if (rf & 2) {
-    i0.ɵɵnextContext();
-    const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
-} }
-function KolClickButton_ng_template_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵprojection(0);
-} }
 function KolCombobox_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainer(0);
 } }
@@ -1268,42 +1196,6 @@ function KolPagination_ng_template_1_Template(rf, ctx) { if (rf & 1) {
 function KolPagination_ng_template_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵprojection(0);
 } }
-function KolPaginationWc_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolPaginationWc_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementStart(0, "stencil-ng-proxy", 5, 2);
-    i0.ɵɵdomTemplate(2, KolPaginationWc_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template, 1, 0, "ng-container", 6);
-    i0.ɵɵdomElementEnd();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext(2);
-    const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_boundaryCount", ctx_r0._boundaryCount)("_customClass", ctx_r0._customClass)("_hasButtons", ctx_r0._hasButtons)("_label", ctx_r0._label)("_max", ctx_r0._max)("_on", ctx_r0._on)("_page", ctx_r0._page)("_pageSize", ctx_r0._pageSize)("_pageSizeOptions", ctx_r0._pageSizeOptions)("_siblingCount", ctx_r0._siblingCount)("_tooltipAlign", ctx_r0._tooltipAlign);
-    i0.ɵɵadvance(2);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
-} }
-function KolPaginationWc_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolPaginationWc_ng_container_0_stencil_ng_proxy_1_Template, 3, 12, "stencil-ng-proxy", 4);
-    i0.ɵɵdomElementContainerEnd();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵdomProperty("replaceTag", ctx_r0.tagName);
-} }
-function KolPaginationWc_ng_template_1_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolPaginationWc_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomTemplate(0, KolPaginationWc_ng_template_1_ng_container_0_Template, 1, 0, "ng-container", 6);
-} if (rf & 2) {
-    i0.ɵɵnextContext();
-    const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
-} }
-function KolPaginationWc_ng_template_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵprojection(0);
-} }
 function KolPopoverButton_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainer(0);
 } }
@@ -1340,42 +1232,6 @@ function KolPopoverButton_ng_template_1_Template(rf, ctx) { if (rf & 1) {
 function KolPopoverButton_ng_template_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵprojection(0);
 } }
-function KolPopoverButtonWc_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolPopoverButtonWc_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementStart(0, "stencil-ng-proxy", 5, 2);
-    i0.ɵɵdomTemplate(2, KolPopoverButtonWc_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template, 1, 0, "ng-container", 6);
-    i0.ɵɵdomElementEnd();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext(2);
-    const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_ariaDescription", ctx_r0._ariaDescription)("_customClass", ctx_r0._customClass)("_disabled", ctx_r0._disabled)("_hideLabel", ctx_r0._hideLabel)("_icons", ctx_r0._icons)("_inline", ctx_r0._inline)("_label", ctx_r0._label)("_name", ctx_r0._name)("_popoverAlign", ctx_r0._popoverAlign)("_shortKey", ctx_r0._shortKey)("_tabIndex", ctx_r0._tabIndex)("_tooltipAlign", ctx_r0._tooltipAlign)("_type", ctx_r0._type)("_value", ctx_r0._value)("_variant", ctx_r0._variant);
-    i0.ɵɵadvance(2);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
-} }
-function KolPopoverButtonWc_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolPopoverButtonWc_ng_container_0_stencil_ng_proxy_1_Template, 3, 17, "stencil-ng-proxy", 4);
-    i0.ɵɵdomElementContainerEnd();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵdomProperty("replaceTag", ctx_r0.tagName);
-} }
-function KolPopoverButtonWc_ng_template_1_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolPopoverButtonWc_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomTemplate(0, KolPopoverButtonWc_ng_template_1_ng_container_0_Template, 1, 0, "ng-container", 6);
-} if (rf & 2) {
-    i0.ɵɵnextContext();
-    const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
-} }
-function KolPopoverButtonWc_ng_template_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵprojection(0);
-} }
 function KolProgress_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainer(0);
 } }
@@ -1484,42 +1340,6 @@ function KolSelect_ng_template_1_Template(rf, ctx) { if (rf & 1) {
 function KolSelect_ng_template_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵprojection(0);
 } }
-function KolSelectWc_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolSelectWc_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementStart(0, "stencil-ng-proxy", 5, 2);
-    i0.ɵɵdomTemplate(2, KolSelectWc_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template, 1, 0, "ng-container", 6);
-    i0.ɵɵdomElementEnd();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext(2);
-    const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_disabled", ctx_r0._disabled)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_msg", ctx_r0._msg)("_multiple", ctx_r0._multiple)("_name", ctx_r0._name)("_on", ctx_r0._on)("_options", ctx_r0._options)("_required", ctx_r0._required)("_rows", ctx_r0._rows)("_shortKey", ctx_r0._shortKey)("_tabIndex", ctx_r0._tabIndex)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value);
-    i0.ɵɵadvance(2);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
-} }
-function KolSelectWc_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolSelectWc_ng_container_0_stencil_ng_proxy_1_Template, 3, 20, "stencil-ng-proxy", 4);
-    i0.ɵɵdomElementContainerEnd();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵdomProperty("replaceTag", ctx_r0.tagName);
-} }
-function KolSelectWc_ng_template_1_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolSelectWc_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomTemplate(0, KolSelectWc_ng_template_1_ng_container_0_Template, 1, 0, "ng-container", 6);
-} if (rf & 2) {
-    i0.ɵɵnextContext();
-    const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
-} }
-function KolSelectWc_ng_template_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵprojection(0);
-} }
 function KolSingleSelect_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainer(0);
 } }
@@ -1844,41 +1664,6 @@ function KolTextarea_ng_template_1_Template(rf, ctx) { if (rf & 1) {
 function KolTextarea_ng_template_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵprojection(0);
 } }
-function KolToastContainer_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolToastContainer_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementStart(0, "stencil-ng-proxy", null, 2);
-    i0.ɵɵdomTemplate(2, KolToastContainer_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template, 1, 0, "ng-container", 5);
-    i0.ɵɵdomElementEnd();
-} if (rf & 2) {
-    i0.ɵɵnextContext(2);
-    const ngContentOutlet_r1 = i0.ɵɵreference(4);
-    i0.ɵɵadvance(2);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r1);
-} }
-function KolToastContainer_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolToastContainer_ng_container_0_stencil_ng_proxy_1_Template, 3, 1, "stencil-ng-proxy", 4);
-    i0.ɵɵdomElementContainerEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵdomProperty("replaceTag", ctx_r1.tagName);
-} }
-function KolToastContainer_ng_template_1_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolToastContainer_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomTemplate(0, KolToastContainer_ng_template_1_ng_container_0_Template, 1, 0, "ng-container", 5);
-} if (rf & 2) {
-    i0.ɵɵnextContext();
-    const ngContentOutlet_r1 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r1);
-} }
-function KolToastContainer_ng_template_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵprojection(0);
-} }
 function KolToolbar_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainer(0);
 } }
@@ -1987,42 +1772,6 @@ function KolTreeItem_ng_template_1_Template(rf, ctx) { if (rf & 1) {
 function KolTreeItem_ng_template_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵprojection(0);
 } }
-function KolTreeItemWc_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolTreeItemWc_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementStart(0, "stencil-ng-proxy", 5, 2);
-    i0.ɵɵdomTemplate(2, KolTreeItemWc_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template, 1, 0, "ng-container", 6);
-    i0.ɵɵdomElementEnd();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext(2);
-    const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_active", ctx_r0._active)("_href", ctx_r0._href)("_label", ctx_r0._label)("_open", ctx_r0._open);
-    i0.ɵɵadvance(2);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
-} }
-function KolTreeItemWc_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolTreeItemWc_ng_container_0_stencil_ng_proxy_1_Template, 3, 5, "stencil-ng-proxy", 4);
-    i0.ɵɵdomElementContainerEnd();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵdomProperty("replaceTag", ctx_r0.tagName);
-} }
-function KolTreeItemWc_ng_template_1_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomElementContainer(0);
-} }
-function KolTreeItemWc_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵdomTemplate(0, KolTreeItemWc_ng_template_1_ng_container_0_Template, 1, 0, "ng-container", 6);
-} if (rf & 2) {
-    i0.ɵɵnextContext();
-    const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
-} }
-function KolTreeItemWc_ng_template_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵprojection(0);
-} }
 function KolVersion_ng_container_0_stencil_ng_proxy_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainer(0);
 } }
@@ -2729,14 +2478,14 @@ export { KolCard };
             args: [ReplaceTagDirective]
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolCard, { className: "KolCard", filePath: "components.ts", lineNumber: 564 }); })();
-let KolCardWc = class KolCardWc extends StencilProxyComponent {
+let KolCombobox = class KolCombobox extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_hasCloser', '_label', '_level', '_on'];
+        this.availableInputProperties = ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_placeholder', '_required', '_shortKey', '_suggestions', '_tooltipAlign', '_touched', '_value'];
         changeDetectorRef.detach();
-        const originalTagName = 'kol-card-wc';
+        const originalTagName = 'kol-combobox';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
         this.hasTagNameTransformer = typeof tagNameTransformer === 'function';
         this.el = r.nativeElement;
@@ -2748,36 +2497,37 @@ let KolCardWc = class KolCardWc extends StencilProxyComponent {
         this.changeDetectorRef.detectChanges();
     }
 };
-KolCardWc.ɵfac = function KolCardWc_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || KolCardWc)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
-KolCardWc.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolCardWc, selectors: [["kol-card-wc"]], viewQuery: function KolCardWc_Query(rf, ctx) { if (rf & 1) {
+KolCombobox.ɵfac = function KolCombobox_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || KolCombobox)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
+KolCombobox.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolCombobox, selectors: [["kol-combobox"]], viewQuery: function KolCombobox_Query(rf, ctx) { if (rf & 1) {
         i0.ɵɵviewQuery(ReplaceTagDirective, 5);
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _hasCloser: "_hasCloser", _label: "_label", _level: "_level", _on: "_on" }, features: [i0.ɵɵProvidersFeature([
-            { provide: StencilProxyComponent, useExisting: forwardRef(() => KolCardWc) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_hasCloser", "_label", "_level", "_on", 4, "replaceTag"], [3, "_hasCloser", "_label", "_level", "_on"], [4, "ngTemplateOutlet"]], template: function KolCardWc_Template(rf, ctx) { if (rf & 1) {
+    } }, inputs: { _accessKey: "_accessKey", _disabled: "_disabled", _hasClearButton: "_hasClearButton", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _msg: "_msg", _name: "_name", _on: "_on", _placeholder: "_placeholder", _required: "_required", _shortKey: "_shortKey", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value" }, features: [i0.ɵɵProvidersFeature([
+            { provide: StencilProxyComponent, useExisting: forwardRef(() => KolCombobox) }
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_disabled", "_hasClearButton", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_name", "_on", "_placeholder", "_required", "_shortKey", "_suggestions", "_tooltipAlign", "_touched", "_value", 4, "replaceTag"], [3, "_accessKey", "_disabled", "_hasClearButton", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_name", "_on", "_placeholder", "_required", "_shortKey", "_suggestions", "_tooltipAlign", "_touched", "_value"], [4, "ngTemplateOutlet"]], template: function KolCombobox_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
-        i0.ɵɵdomTemplate(0, KolCardWc_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolCardWc_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolCardWc_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
+        i0.ɵɵdomTemplate(0, KolCombobox_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolCombobox_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolCombobox_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
         const defaultCase_r3 = i0.ɵɵreference(2);
         i0.ɵɵdomProperty("ngIf", ctx.hasTagNameTransformer)("ngIfElse", defaultCase_r3);
     } }, encapsulation: 2, changeDetection: 0 });
-KolCardWc = __decorate([
+KolCombobox = __decorate([
     ProxyCmp({
-        inputs: ['_hasCloser', '_label', '_level', '_on']
+        inputs: ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_placeholder', '_required', '_shortKey', '_suggestions', '_tooltipAlign', '_touched', '_value'],
+        methods: ['getValue', 'focus']
     })
-], KolCardWc);
-export { KolCardWc };
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(KolCardWc, [{
+], KolCombobox);
+export { KolCombobox };
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(KolCombobox, [{
         type: Component,
         args: [{
-                selector: 'kol-card-wc',
+                selector: 'kol-combobox',
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_hasCloser]="_hasCloser" [_label]="_label" [_level]="_level" [_on]="_on"
+        [_accessKey]="_accessKey" [_disabled]="_disabled" [_hasClearButton]="_hasClearButton" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_msg]="_msg" [_name]="_name" [_on]="_on" [_placeholder]="_placeholder" [_required]="_required" [_shortKey]="_shortKey" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -2793,24 +2543,24 @@ export { KolCardWc };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_hasCloser', '_label', '_level', '_on'],
+                inputs: ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_placeholder', '_required', '_shortKey', '_suggestions', '_tooltipAlign', '_touched', '_value'],
                 providers: [
-                    { provide: StencilProxyComponent, useExisting: forwardRef(() => KolCardWc) }
+                    { provide: StencilProxyComponent, useExisting: forwardRef(() => KolCombobox) }
                 ],
             }]
     }], () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], { replaceTagDirective: [{
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolCardWc, { className: "KolCardWc", filePath: "components.ts", lineNumber: 625 }); })();
-let KolClickButton = class KolClickButton extends StencilProxyComponent {
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolCombobox, { className: "KolCombobox", filePath: "components.ts", lineNumber: 626 }); })();
+let KolDetails = class KolDetails extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_label'];
+        this.availableInputProperties = ['_disabled', '_label', '_level', '_on', '_open'];
         changeDetectorRef.detach();
-        const originalTagName = 'kol-click-button';
+        const originalTagName = 'kol-details';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
         this.hasTagNameTransformer = typeof tagNameTransformer === 'function';
         this.el = r.nativeElement;
@@ -2822,37 +2572,37 @@ let KolClickButton = class KolClickButton extends StencilProxyComponent {
         this.changeDetectorRef.detectChanges();
     }
 };
-KolClickButton.ɵfac = function KolClickButton_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || KolClickButton)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
-KolClickButton.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolClickButton, selectors: [["kol-click-button"]], viewQuery: function KolClickButton_Query(rf, ctx) { if (rf & 1) {
+KolDetails.ɵfac = function KolDetails_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || KolDetails)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
+KolDetails.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolDetails, selectors: [["kol-details"]], viewQuery: function KolDetails_Query(rf, ctx) { if (rf & 1) {
         i0.ɵɵviewQuery(ReplaceTagDirective, 5);
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _label: "_label" }, features: [i0.ɵɵProvidersFeature([
-            { provide: StencilProxyComponent, useExisting: forwardRef(() => KolClickButton) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_label", 4, "replaceTag"], [3, "_label"], [4, "ngTemplateOutlet"]], template: function KolClickButton_Template(rf, ctx) { if (rf & 1) {
+    } }, inputs: { _disabled: "_disabled", _label: "_label", _level: "_level", _on: "_on", _open: "_open" }, features: [i0.ɵɵProvidersFeature([
+            { provide: StencilProxyComponent, useExisting: forwardRef(() => KolDetails) }
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_disabled", "_label", "_level", "_on", "_open", 4, "replaceTag"], [3, "_disabled", "_label", "_level", "_on", "_open"], [4, "ngTemplateOutlet"]], template: function KolDetails_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
-        i0.ɵɵdomTemplate(0, KolClickButton_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolClickButton_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolClickButton_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
+        i0.ɵɵdomTemplate(0, KolDetails_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolDetails_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolDetails_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
         const defaultCase_r3 = i0.ɵɵreference(2);
         i0.ɵɵdomProperty("ngIf", ctx.hasTagNameTransformer)("ngIfElse", defaultCase_r3);
     } }, encapsulation: 2, changeDetection: 0 });
-KolClickButton = __decorate([
+KolDetails = __decorate([
     ProxyCmp({
-        inputs: ['_label'],
+        inputs: ['_disabled', '_label', '_level', '_on', '_open'],
         methods: ['focus']
     })
-], KolClickButton);
-export { KolClickButton };
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(KolClickButton, [{
+], KolDetails);
+export { KolDetails };
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(KolDetails, [{
         type: Component,
         args: [{
-                selector: 'kol-click-button',
+                selector: 'kol-details',
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_label]="_label"
+        [_disabled]="_disabled" [_label]="_label" [_level]="_level" [_on]="_on" [_open]="_open"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -2868,24 +2618,24 @@ export { KolClickButton };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_label'],
+                inputs: ['_disabled', '_label', '_level', '_on', '_open'],
                 providers: [
-                    { provide: StencilProxyComponent, useExisting: forwardRef(() => KolClickButton) }
+                    { provide: StencilProxyComponent, useExisting: forwardRef(() => KolDetails) }
                 ],
             }]
     }], () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], { replaceTagDirective: [{
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolClickButton, { className: "KolClickButton", filePath: "components.ts", lineNumber: 687 }); })();
-let KolCombobox = class KolCombobox extends StencilProxyComponent {
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolDetails, { className: "KolDetails", filePath: "components.ts", lineNumber: 702 }); })();
+let KolDialog = class KolDialog extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_placeholder', '_required', '_shortKey', '_suggestions', '_tooltipAlign', '_touched', '_value'];
+        this.availableInputProperties = ['_label', '_on', '_variant', '_width'];
         changeDetectorRef.detach();
-        const originalTagName = 'kol-combobox';
+        const originalTagName = 'kol-dialog';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
         this.hasTagNameTransformer = typeof tagNameTransformer === 'function';
         this.el = r.nativeElement;
@@ -2897,179 +2647,29 @@ let KolCombobox = class KolCombobox extends StencilProxyComponent {
         this.changeDetectorRef.detectChanges();
     }
 };
-KolCombobox.ɵfac = function KolCombobox_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || KolCombobox)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
-KolCombobox.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolCombobox, selectors: [["kol-combobox"]], viewQuery: function KolCombobox_Query(rf, ctx) { if (rf & 1) {
+KolDialog.ɵfac = function KolDialog_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || KolDialog)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
+KolDialog.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolDialog, selectors: [["kol-dialog"]], viewQuery: function KolDialog_Query(rf, ctx) { if (rf & 1) {
         i0.ɵɵviewQuery(ReplaceTagDirective, 5);
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _accessKey: "_accessKey", _disabled: "_disabled", _hasClearButton: "_hasClearButton", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _msg: "_msg", _name: "_name", _on: "_on", _placeholder: "_placeholder", _required: "_required", _shortKey: "_shortKey", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value" }, features: [i0.ɵɵProvidersFeature([
-            { provide: StencilProxyComponent, useExisting: forwardRef(() => KolCombobox) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_disabled", "_hasClearButton", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_name", "_on", "_placeholder", "_required", "_shortKey", "_suggestions", "_tooltipAlign", "_touched", "_value", 4, "replaceTag"], [3, "_accessKey", "_disabled", "_hasClearButton", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_name", "_on", "_placeholder", "_required", "_shortKey", "_suggestions", "_tooltipAlign", "_touched", "_value"], [4, "ngTemplateOutlet"]], template: function KolCombobox_Template(rf, ctx) { if (rf & 1) {
+    } }, inputs: { _label: "_label", _on: "_on", _variant: "_variant", _width: "_width" }, features: [i0.ɵɵProvidersFeature([
+            { provide: StencilProxyComponent, useExisting: forwardRef(() => KolDialog) }
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_label", "_on", "_variant", "_width", 4, "replaceTag"], [3, "_label", "_on", "_variant", "_width"], [4, "ngTemplateOutlet"]], template: function KolDialog_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
-        i0.ɵɵdomTemplate(0, KolCombobox_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolCombobox_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolCombobox_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
+        i0.ɵɵdomTemplate(0, KolDialog_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolDialog_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolDialog_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
         const defaultCase_r3 = i0.ɵɵreference(2);
         i0.ɵɵdomProperty("ngIf", ctx.hasTagNameTransformer)("ngIfElse", defaultCase_r3);
     } }, encapsulation: 2, changeDetection: 0 });
-KolCombobox = __decorate([
+KolDialog = __decorate([
     ProxyCmp({
-        inputs: ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_placeholder', '_required', '_shortKey', '_suggestions', '_tooltipAlign', '_touched', '_value'],
-        methods: ['getValue', 'focus']
+        inputs: ['_label', '_on', '_variant', '_width'],
+        methods: ['openModal', 'closeModal']
     })
-], KolCombobox);
-export { KolCombobox };
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(KolCombobox, [{
-        type: Component,
-        args: [{
-                selector: 'kol-combobox',
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                template: `
-    <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
-      <stencil-ng-proxy
-        [_accessKey]="_accessKey" [_disabled]="_disabled" [_hasClearButton]="_hasClearButton" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_msg]="_msg" [_name]="_name" [_on]="_on" [_placeholder]="_placeholder" [_required]="_required" [_shortKey]="_shortKey" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value"
-        *replaceTag="tagName"
-        #replaceTagHost
-      >
-        <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-      </stencil-ng-proxy>
-    </ng-container>
-    <ng-template #defaultCase>
-      <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-    </ng-template>
-    <ng-template #ngContentOutlet>
-      <ng-content></ng-content>
-    </ng-template>`,
-                // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_placeholder', '_required', '_shortKey', '_suggestions', '_tooltipAlign', '_touched', '_value'],
-                providers: [
-                    { provide: StencilProxyComponent, useExisting: forwardRef(() => KolCombobox) }
-                ],
-            }]
-    }], () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], { replaceTagDirective: [{
-            type: ViewChild,
-            args: [ReplaceTagDirective]
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolCombobox, { className: "KolCombobox", filePath: "components.ts", lineNumber: 746 }); })();
-let KolDetails = class KolDetails extends StencilProxyComponent {
-    constructor(changeDetectorRef, r, z) {
-        super();
-        this.changeDetectorRef = changeDetectorRef;
-        this.z = z;
-        this.availableInputProperties = ['_disabled', '_label', '_level', '_on', '_open'];
-        changeDetectorRef.detach();
-        const originalTagName = 'kol-details';
-        this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
-        this.hasTagNameTransformer = typeof tagNameTransformer === 'function';
-        this.el = r.nativeElement;
-    }
-    ngOnChanges() {
-        if (typeof this.replaceTagDirective === 'object' && this.replaceTagDirective !== null && typeof this.replaceTagDirective.handlePropertyChanges === 'function') {
-            this.replaceTagDirective.handlePropertyChanges();
-        }
-        this.changeDetectorRef.detectChanges();
-    }
-};
-KolDetails.ɵfac = function KolDetails_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || KolDetails)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
-KolDetails.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolDetails, selectors: [["kol-details"]], viewQuery: function KolDetails_Query(rf, ctx) { if (rf & 1) {
-        i0.ɵɵviewQuery(ReplaceTagDirective, 5);
-    } if (rf & 2) {
-        let _t;
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _disabled: "_disabled", _label: "_label", _level: "_level", _on: "_on", _open: "_open" }, features: [i0.ɵɵProvidersFeature([
-            { provide: StencilProxyComponent, useExisting: forwardRef(() => KolDetails) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_disabled", "_label", "_level", "_on", "_open", 4, "replaceTag"], [3, "_disabled", "_label", "_level", "_on", "_open"], [4, "ngTemplateOutlet"]], template: function KolDetails_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵprojectionDef();
-        i0.ɵɵdomTemplate(0, KolDetails_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolDetails_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolDetails_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
-    } if (rf & 2) {
-        const defaultCase_r3 = i0.ɵɵreference(2);
-        i0.ɵɵdomProperty("ngIf", ctx.hasTagNameTransformer)("ngIfElse", defaultCase_r3);
-    } }, encapsulation: 2, changeDetection: 0 });
-KolDetails = __decorate([
-    ProxyCmp({
-        inputs: ['_disabled', '_label', '_level', '_on', '_open'],
-        methods: ['focus']
-    })
-], KolDetails);
-export { KolDetails };
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(KolDetails, [{
-        type: Component,
-        args: [{
-                selector: 'kol-details',
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                template: `
-    <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
-      <stencil-ng-proxy
-        [_disabled]="_disabled" [_label]="_label" [_level]="_level" [_on]="_on" [_open]="_open"
-        *replaceTag="tagName"
-        #replaceTagHost
-      >
-        <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-      </stencil-ng-proxy>
-    </ng-container>
-    <ng-template #defaultCase>
-      <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-    </ng-template>
-    <ng-template #ngContentOutlet>
-      <ng-content></ng-content>
-    </ng-template>`,
-                // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_disabled', '_label', '_level', '_on', '_open'],
-                providers: [
-                    { provide: StencilProxyComponent, useExisting: forwardRef(() => KolDetails) }
-                ],
-            }]
-    }], () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], { replaceTagDirective: [{
-            type: ViewChild,
-            args: [ReplaceTagDirective]
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolDetails, { className: "KolDetails", filePath: "components.ts", lineNumber: 822 }); })();
-let KolDialog = class KolDialog extends StencilProxyComponent {
-    constructor(changeDetectorRef, r, z) {
-        super();
-        this.changeDetectorRef = changeDetectorRef;
-        this.z = z;
-        this.availableInputProperties = ['_label', '_on', '_variant', '_width'];
-        changeDetectorRef.detach();
-        const originalTagName = 'kol-dialog';
-        this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
-        this.hasTagNameTransformer = typeof tagNameTransformer === 'function';
-        this.el = r.nativeElement;
-    }
-    ngOnChanges() {
-        if (typeof this.replaceTagDirective === 'object' && this.replaceTagDirective !== null && typeof this.replaceTagDirective.handlePropertyChanges === 'function') {
-            this.replaceTagDirective.handlePropertyChanges();
-        }
-        this.changeDetectorRef.detectChanges();
-    }
-};
-KolDialog.ɵfac = function KolDialog_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || KolDialog)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
-KolDialog.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolDialog, selectors: [["kol-dialog"]], viewQuery: function KolDialog_Query(rf, ctx) { if (rf & 1) {
-        i0.ɵɵviewQuery(ReplaceTagDirective, 5);
-    } if (rf & 2) {
-        let _t;
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _label: "_label", _on: "_on", _variant: "_variant", _width: "_width" }, features: [i0.ɵɵProvidersFeature([
-            { provide: StencilProxyComponent, useExisting: forwardRef(() => KolDialog) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_label", "_on", "_variant", "_width", 4, "replaceTag"], [3, "_label", "_on", "_variant", "_width"], [4, "ngTemplateOutlet"]], template: function KolDialog_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵprojectionDef();
-        i0.ɵɵdomTemplate(0, KolDialog_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolDialog_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolDialog_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
-    } if (rf & 2) {
-        const defaultCase_r3 = i0.ɵɵreference(2);
-        i0.ɵɵdomProperty("ngIf", ctx.hasTagNameTransformer)("ngIfElse", defaultCase_r3);
-    } }, encapsulation: 2, changeDetection: 0 });
-KolDialog = __decorate([
-    ProxyCmp({
-        inputs: ['_label', '_on', '_variant', '_width'],
-        methods: ['openModal', 'closeModal']
-    })
-], KolDialog);
-export { KolDialog };
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(KolDialog, [{
+], KolDialog);
+export { KolDialog };
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(KolDialog, [{
         type: Component,
         args: [{
                 selector: 'kol-dialog',
@@ -3102,7 +2702,7 @@ export { KolDialog };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolDialog, { className: "KolDialog", filePath: "components.ts", lineNumber: 885 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolDialog, { className: "KolDialog", filePath: "components.ts", lineNumber: 765 }); })();
 let KolDrawer = class KolDrawer extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3177,7 +2777,7 @@ export { KolDrawer };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolDrawer, { className: "KolDrawer", filePath: "components.ts", lineNumber: 947 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolDrawer, { className: "KolDrawer", filePath: "components.ts", lineNumber: 827 }); })();
 let KolForm = class KolForm extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3252,7 +2852,7 @@ export { KolForm };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolForm, { className: "KolForm", filePath: "components.ts", lineNumber: 1010 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolForm, { className: "KolForm", filePath: "components.ts", lineNumber: 890 }); })();
 let KolHeading = class KolHeading extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3326,7 +2926,7 @@ export { KolHeading };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolHeading, { className: "KolHeading", filePath: "components.ts", lineNumber: 1070 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolHeading, { className: "KolHeading", filePath: "components.ts", lineNumber: 950 }); })();
 let KolIcon = class KolIcon extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3400,7 +3000,7 @@ export { KolIcon };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolIcon, { className: "KolIcon", filePath: "components.ts", lineNumber: 1130 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolIcon, { className: "KolIcon", filePath: "components.ts", lineNumber: 1010 }); })();
 let KolImage = class KolImage extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3474,7 +3074,7 @@ export { KolImage };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolImage, { className: "KolImage", filePath: "components.ts", lineNumber: 1189 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolImage, { className: "KolImage", filePath: "components.ts", lineNumber: 1069 }); })();
 let KolInputCheckbox = class KolInputCheckbox extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3549,7 +3149,7 @@ export { KolInputCheckbox };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputCheckbox, { className: "KolInputCheckbox", filePath: "components.ts", lineNumber: 1252 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputCheckbox, { className: "KolInputCheckbox", filePath: "components.ts", lineNumber: 1132 }); })();
 let KolInputColor = class KolInputColor extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3624,7 +3224,7 @@ export { KolInputColor };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputColor, { className: "KolInputColor", filePath: "components.ts", lineNumber: 1329 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputColor, { className: "KolInputColor", filePath: "components.ts", lineNumber: 1209 }); })();
 let KolInputDate = class KolInputDate extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3699,7 +3299,7 @@ export { KolInputDate };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputDate, { className: "KolInputDate", filePath: "components.ts", lineNumber: 1404 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputDate, { className: "KolInputDate", filePath: "components.ts", lineNumber: 1284 }); })();
 let KolInputEmail = class KolInputEmail extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3774,7 +3374,7 @@ export { KolInputEmail };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputEmail, { className: "KolInputEmail", filePath: "components.ts", lineNumber: 1485 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputEmail, { className: "KolInputEmail", filePath: "components.ts", lineNumber: 1365 }); })();
 let KolInputFile = class KolInputFile extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3849,7 +3449,7 @@ export { KolInputFile };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputFile, { className: "KolInputFile", filePath: "components.ts", lineNumber: 1568 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputFile, { className: "KolInputFile", filePath: "components.ts", lineNumber: 1448 }); })();
 let KolInputNumber = class KolInputNumber extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3924,7 +3524,7 @@ export { KolInputNumber };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputNumber, { className: "KolInputNumber", filePath: "components.ts", lineNumber: 1643 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputNumber, { className: "KolInputNumber", filePath: "components.ts", lineNumber: 1523 }); })();
 let KolInputPassword = class KolInputPassword extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3999,7 +3599,7 @@ export { KolInputPassword };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputPassword, { className: "KolInputPassword", filePath: "components.ts", lineNumber: 1724 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputPassword, { className: "KolInputPassword", filePath: "components.ts", lineNumber: 1604 }); })();
 let KolInputRadio = class KolInputRadio extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4074,7 +3674,7 @@ export { KolInputRadio };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputRadio, { className: "KolInputRadio", filePath: "components.ts", lineNumber: 1806 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputRadio, { className: "KolInputRadio", filePath: "components.ts", lineNumber: 1686 }); })();
 let KolInputRange = class KolInputRange extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4149,7 +3749,7 @@ export { KolInputRange };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputRange, { className: "KolInputRange", filePath: "components.ts", lineNumber: 1878 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputRange, { className: "KolInputRange", filePath: "components.ts", lineNumber: 1758 }); })();
 let KolInputText = class KolInputText extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4224,7 +3824,7 @@ export { KolInputText };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputText, { className: "KolInputText", filePath: "components.ts", lineNumber: 1955 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputText, { className: "KolInputText", filePath: "components.ts", lineNumber: 1835 }); })();
 let KolKolibri = class KolKolibri extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4298,7 +3898,7 @@ export { KolKolibri };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolKolibri, { className: "KolKolibri", filePath: "components.ts", lineNumber: 2038 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolKolibri, { className: "KolKolibri", filePath: "components.ts", lineNumber: 1918 }); })();
 let KolLink = class KolLink extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4373,7 +3973,7 @@ export { KolLink };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolLink, { className: "KolLink", filePath: "components.ts", lineNumber: 2098 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolLink, { className: "KolLink", filePath: "components.ts", lineNumber: 1978 }); })();
 let KolLinkButton = class KolLinkButton extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4448,7 +4048,7 @@ export { KolLinkButton };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolLinkButton, { className: "KolLinkButton", filePath: "components.ts", lineNumber: 2174 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolLinkButton, { className: "KolLinkButton", filePath: "components.ts", lineNumber: 2054 }); })();
 let KolModal = class KolModal extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4523,7 +4123,7 @@ export { KolModal };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolModal, { className: "KolModal", filePath: "components.ts", lineNumber: 2249 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolModal, { className: "KolModal", filePath: "components.ts", lineNumber: 2129 }); })();
 let KolNav = class KolNav extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4597,7 +4197,7 @@ export { KolNav };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolNav, { className: "KolNav", filePath: "components.ts", lineNumber: 2310 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolNav, { className: "KolNav", filePath: "components.ts", lineNumber: 2190 }); })();
 let KolPagination = class KolPagination extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4671,81 +4271,7 @@ export { KolPagination };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolPagination, { className: "KolPagination", filePath: "components.ts", lineNumber: 2373 }); })();
-let KolPaginationWc = class KolPaginationWc extends StencilProxyComponent {
-    constructor(changeDetectorRef, r, z) {
-        super();
-        this.changeDetectorRef = changeDetectorRef;
-        this.z = z;
-        this.availableInputProperties = ['_boundaryCount', '_customClass', '_hasButtons', '_label', '_max', '_on', '_page', '_pageSize', '_pageSizeOptions', '_siblingCount', '_tooltipAlign'];
-        changeDetectorRef.detach();
-        const originalTagName = 'kol-pagination-wc';
-        this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
-        this.hasTagNameTransformer = typeof tagNameTransformer === 'function';
-        this.el = r.nativeElement;
-    }
-    ngOnChanges() {
-        if (typeof this.replaceTagDirective === 'object' && this.replaceTagDirective !== null && typeof this.replaceTagDirective.handlePropertyChanges === 'function') {
-            this.replaceTagDirective.handlePropertyChanges();
-        }
-        this.changeDetectorRef.detectChanges();
-    }
-};
-KolPaginationWc.ɵfac = function KolPaginationWc_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || KolPaginationWc)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
-KolPaginationWc.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolPaginationWc, selectors: [["kol-pagination-wc"]], viewQuery: function KolPaginationWc_Query(rf, ctx) { if (rf & 1) {
-        i0.ɵɵviewQuery(ReplaceTagDirective, 5);
-    } if (rf & 2) {
-        let _t;
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _boundaryCount: "_boundaryCount", _customClass: "_customClass", _hasButtons: "_hasButtons", _label: "_label", _max: "_max", _on: "_on", _page: "_page", _pageSize: "_pageSize", _pageSizeOptions: "_pageSizeOptions", _siblingCount: "_siblingCount", _tooltipAlign: "_tooltipAlign" }, features: [i0.ɵɵProvidersFeature([
-            { provide: StencilProxyComponent, useExisting: forwardRef(() => KolPaginationWc) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_boundaryCount", "_customClass", "_hasButtons", "_label", "_max", "_on", "_page", "_pageSize", "_pageSizeOptions", "_siblingCount", "_tooltipAlign", 4, "replaceTag"], [3, "_boundaryCount", "_customClass", "_hasButtons", "_label", "_max", "_on", "_page", "_pageSize", "_pageSizeOptions", "_siblingCount", "_tooltipAlign"], [4, "ngTemplateOutlet"]], template: function KolPaginationWc_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵprojectionDef();
-        i0.ɵɵdomTemplate(0, KolPaginationWc_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolPaginationWc_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolPaginationWc_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
-    } if (rf & 2) {
-        const defaultCase_r3 = i0.ɵɵreference(2);
-        i0.ɵɵdomProperty("ngIf", ctx.hasTagNameTransformer)("ngIfElse", defaultCase_r3);
-    } }, encapsulation: 2, changeDetection: 0 });
-KolPaginationWc = __decorate([
-    ProxyCmp({
-        inputs: ['_boundaryCount', '_customClass', '_hasButtons', '_label', '_max', '_on', '_page', '_pageSize', '_pageSizeOptions', '_siblingCount', '_tooltipAlign']
-    })
-], KolPaginationWc);
-export { KolPaginationWc };
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(KolPaginationWc, [{
-        type: Component,
-        args: [{
-                selector: 'kol-pagination-wc',
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                template: `
-    <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
-      <stencil-ng-proxy
-        [_boundaryCount]="_boundaryCount" [_customClass]="_customClass" [_hasButtons]="_hasButtons" [_label]="_label" [_max]="_max" [_on]="_on" [_page]="_page" [_pageSize]="_pageSize" [_pageSizeOptions]="_pageSizeOptions" [_siblingCount]="_siblingCount" [_tooltipAlign]="_tooltipAlign"
-        *replaceTag="tagName"
-        #replaceTagHost
-      >
-        <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-      </stencil-ng-proxy>
-    </ng-container>
-    <ng-template #defaultCase>
-      <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-    </ng-template>
-    <ng-template #ngContentOutlet>
-      <ng-content></ng-content>
-    </ng-template>`,
-                // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_boundaryCount', '_customClass', '_hasButtons', '_label', '_max', '_on', '_page', '_pageSize', '_pageSizeOptions', '_siblingCount', '_tooltipAlign'],
-                providers: [
-                    { provide: StencilProxyComponent, useExisting: forwardRef(() => KolPaginationWc) }
-                ],
-            }]
-    }], () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], { replaceTagDirective: [{
-            type: ViewChild,
-            args: [ReplaceTagDirective]
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolPaginationWc, { className: "KolPaginationWc", filePath: "components.ts", lineNumber: 2441 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolPagination, { className: "KolPagination", filePath: "components.ts", lineNumber: 2253 }); })();
 let KolPopoverButton = class KolPopoverButton extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4820,82 +4346,7 @@ export { KolPopoverButton };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolPopoverButton, { className: "KolPopoverButton", filePath: "components.ts", lineNumber: 2510 }); })();
-let KolPopoverButtonWc = class KolPopoverButtonWc extends StencilProxyComponent {
-    constructor(changeDetectorRef, r, z) {
-        super();
-        this.changeDetectorRef = changeDetectorRef;
-        this.z = z;
-        this.availableInputProperties = ['_accessKey', '_ariaDescription', '_customClass', '_disabled', '_hideLabel', '_icons', '_inline', '_label', '_name', '_popoverAlign', '_shortKey', '_tabIndex', '_tooltipAlign', '_type', '_value', '_variant'];
-        changeDetectorRef.detach();
-        const originalTagName = 'kol-popover-button-wc';
-        this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
-        this.hasTagNameTransformer = typeof tagNameTransformer === 'function';
-        this.el = r.nativeElement;
-    }
-    ngOnChanges() {
-        if (typeof this.replaceTagDirective === 'object' && this.replaceTagDirective !== null && typeof this.replaceTagDirective.handlePropertyChanges === 'function') {
-            this.replaceTagDirective.handlePropertyChanges();
-        }
-        this.changeDetectorRef.detectChanges();
-    }
-};
-KolPopoverButtonWc.ɵfac = function KolPopoverButtonWc_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || KolPopoverButtonWc)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
-KolPopoverButtonWc.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolPopoverButtonWc, selectors: [["kol-popover-button-wc"]], viewQuery: function KolPopoverButtonWc_Query(rf, ctx) { if (rf & 1) {
-        i0.ɵɵviewQuery(ReplaceTagDirective, 5);
-    } if (rf & 2) {
-        let _t;
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _accessKey: "_accessKey", _ariaDescription: "_ariaDescription", _customClass: "_customClass", _disabled: "_disabled", _hideLabel: "_hideLabel", _icons: "_icons", _inline: "_inline", _label: "_label", _name: "_name", _popoverAlign: "_popoverAlign", _shortKey: "_shortKey", _tabIndex: "_tabIndex", _tooltipAlign: "_tooltipAlign", _type: "_type", _value: "_value", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
-            { provide: StencilProxyComponent, useExisting: forwardRef(() => KolPopoverButtonWc) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_ariaDescription", "_customClass", "_disabled", "_hideLabel", "_icons", "_inline", "_label", "_name", "_popoverAlign", "_shortKey", "_tabIndex", "_tooltipAlign", "_type", "_value", "_variant", 4, "replaceTag"], [3, "_accessKey", "_ariaDescription", "_customClass", "_disabled", "_hideLabel", "_icons", "_inline", "_label", "_name", "_popoverAlign", "_shortKey", "_tabIndex", "_tooltipAlign", "_type", "_value", "_variant"], [4, "ngTemplateOutlet"]], template: function KolPopoverButtonWc_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵprojectionDef();
-        i0.ɵɵdomTemplate(0, KolPopoverButtonWc_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolPopoverButtonWc_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolPopoverButtonWc_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
-    } if (rf & 2) {
-        const defaultCase_r3 = i0.ɵɵreference(2);
-        i0.ɵɵdomProperty("ngIf", ctx.hasTagNameTransformer)("ngIfElse", defaultCase_r3);
-    } }, encapsulation: 2, changeDetection: 0 });
-KolPopoverButtonWc = __decorate([
-    ProxyCmp({
-        inputs: ['_accessKey', '_ariaDescription', '_customClass', '_disabled', '_hideLabel', '_icons', '_inline', '_label', '_name', '_popoverAlign', '_shortKey', '_tabIndex', '_tooltipAlign', '_type', '_value', '_variant'],
-        methods: ['hidePopover', 'showPopover', 'focus']
-    })
-], KolPopoverButtonWc);
-export { KolPopoverButtonWc };
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(KolPopoverButtonWc, [{
-        type: Component,
-        args: [{
-                selector: 'kol-popover-button-wc',
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                template: `
-    <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
-      <stencil-ng-proxy
-        [_accessKey]="_accessKey" [_ariaDescription]="_ariaDescription" [_customClass]="_customClass" [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_icons]="_icons" [_inline]="_inline" [_label]="_label" [_name]="_name" [_popoverAlign]="_popoverAlign" [_shortKey]="_shortKey" [_tabIndex]="_tabIndex" [_tooltipAlign]="_tooltipAlign" [_type]="_type" [_value]="_value" [_variant]="_variant"
-        *replaceTag="tagName"
-        #replaceTagHost
-      >
-        <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-      </stencil-ng-proxy>
-    </ng-container>
-    <ng-template #defaultCase>
-      <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-    </ng-template>
-    <ng-template #ngContentOutlet>
-      <ng-content></ng-content>
-    </ng-template>`,
-                // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_accessKey', '_ariaDescription', '_customClass', '_disabled', '_hideLabel', '_icons', '_inline', '_label', '_name', '_popoverAlign', '_shortKey', '_tabIndex', '_tooltipAlign', '_type', '_value', '_variant'],
-                providers: [
-                    { provide: StencilProxyComponent, useExisting: forwardRef(() => KolPopoverButtonWc) }
-                ],
-            }]
-    }], () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], { replaceTagDirective: [{
-            type: ViewChild,
-            args: [ReplaceTagDirective]
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolPopoverButtonWc, { className: "KolPopoverButtonWc", filePath: "components.ts", lineNumber: 2584 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolPopoverButton, { className: "KolPopoverButton", filePath: "components.ts", lineNumber: 2322 }); })();
 let KolProgress = class KolProgress extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4969,7 +4420,7 @@ export { KolProgress };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolProgress, { className: "KolProgress", filePath: "components.ts", lineNumber: 2657 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolProgress, { className: "KolProgress", filePath: "components.ts", lineNumber: 2395 }); })();
 let KolQuote = class KolQuote extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5043,7 +4494,7 @@ export { KolQuote };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolQuote, { className: "KolQuote", filePath: "components.ts", lineNumber: 2719 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolQuote, { className: "KolQuote", filePath: "components.ts", lineNumber: 2457 }); })();
 let KolSelect = class KolSelect extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5118,82 +4569,7 @@ export { KolSelect };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSelect, { className: "KolSelect", filePath: "components.ts", lineNumber: 2781 }); })();
-let KolSelectWc = class KolSelectWc extends StencilProxyComponent {
-    constructor(changeDetectorRef, r, z) {
-        super();
-        this.changeDetectorRef = changeDetectorRef;
-        this.z = z;
-        this.availableInputProperties = ['_accessKey', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_multiple', '_name', '_on', '_options', '_required', '_rows', '_shortKey', '_tabIndex', '_tooltipAlign', '_touched', '_value'];
-        changeDetectorRef.detach();
-        const originalTagName = 'kol-select-wc';
-        this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
-        this.hasTagNameTransformer = typeof tagNameTransformer === 'function';
-        this.el = r.nativeElement;
-    }
-    ngOnChanges() {
-        if (typeof this.replaceTagDirective === 'object' && this.replaceTagDirective !== null && typeof this.replaceTagDirective.handlePropertyChanges === 'function') {
-            this.replaceTagDirective.handlePropertyChanges();
-        }
-        this.changeDetectorRef.detectChanges();
-    }
-};
-KolSelectWc.ɵfac = function KolSelectWc_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || KolSelectWc)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
-KolSelectWc.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolSelectWc, selectors: [["kol-select-wc"]], viewQuery: function KolSelectWc_Query(rf, ctx) { if (rf & 1) {
-        i0.ɵɵviewQuery(ReplaceTagDirective, 5);
-    } if (rf & 2) {
-        let _t;
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _accessKey: "_accessKey", _disabled: "_disabled", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _msg: "_msg", _multiple: "_multiple", _name: "_name", _on: "_on", _options: "_options", _required: "_required", _rows: "_rows", _shortKey: "_shortKey", _tabIndex: "_tabIndex", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value" }, features: [i0.ɵɵProvidersFeature([
-            { provide: StencilProxyComponent, useExisting: forwardRef(() => KolSelectWc) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_multiple", "_name", "_on", "_options", "_required", "_rows", "_shortKey", "_tabIndex", "_tooltipAlign", "_touched", "_value", 4, "replaceTag"], [3, "_accessKey", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_multiple", "_name", "_on", "_options", "_required", "_rows", "_shortKey", "_tabIndex", "_tooltipAlign", "_touched", "_value"], [4, "ngTemplateOutlet"]], template: function KolSelectWc_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵprojectionDef();
-        i0.ɵɵdomTemplate(0, KolSelectWc_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolSelectWc_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolSelectWc_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
-    } if (rf & 2) {
-        const defaultCase_r3 = i0.ɵɵreference(2);
-        i0.ɵɵdomProperty("ngIf", ctx.hasTagNameTransformer)("ngIfElse", defaultCase_r3);
-    } }, encapsulation: 2, changeDetection: 0 });
-KolSelectWc = __decorate([
-    ProxyCmp({
-        inputs: ['_accessKey', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_multiple', '_name', '_on', '_options', '_required', '_rows', '_shortKey', '_tabIndex', '_tooltipAlign', '_touched', '_value'],
-        methods: ['getValue', 'focus']
-    })
-], KolSelectWc);
-export { KolSelectWc };
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(KolSelectWc, [{
-        type: Component,
-        args: [{
-                selector: 'kol-select-wc',
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                template: `
-    <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
-      <stencil-ng-proxy
-        [_accessKey]="_accessKey" [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_msg]="_msg" [_multiple]="_multiple" [_name]="_name" [_on]="_on" [_options]="_options" [_required]="_required" [_rows]="_rows" [_shortKey]="_shortKey" [_tabIndex]="_tabIndex" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value"
-        *replaceTag="tagName"
-        #replaceTagHost
-      >
-        <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-      </stencil-ng-proxy>
-    </ng-container>
-    <ng-template #defaultCase>
-      <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-    </ng-template>
-    <ng-template #ngContentOutlet>
-      <ng-content></ng-content>
-    </ng-template>`,
-                // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_accessKey', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_multiple', '_name', '_on', '_options', '_required', '_rows', '_shortKey', '_tabIndex', '_tooltipAlign', '_touched', '_value'],
-                providers: [
-                    { provide: StencilProxyComponent, useExisting: forwardRef(() => KolSelectWc) }
-                ],
-            }]
-    }], () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], { replaceTagDirective: [{
-            type: ViewChild,
-            args: [ReplaceTagDirective]
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSelectWc, { className: "KolSelectWc", filePath: "components.ts", lineNumber: 2858 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSelect, { className: "KolSelect", filePath: "components.ts", lineNumber: 2519 }); })();
 let KolSingleSelect = class KolSingleSelect extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5268,7 +4644,7 @@ export { KolSingleSelect };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSingleSelect, { className: "KolSingleSelect", filePath: "components.ts", lineNumber: 2935 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSingleSelect, { className: "KolSingleSelect", filePath: "components.ts", lineNumber: 2596 }); })();
 let KolSkeleton = class KolSkeleton extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5344,7 +4720,7 @@ export { KolSkeleton };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSkeleton, { className: "KolSkeleton", filePath: "components.ts", lineNumber: 3012 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSkeleton, { className: "KolSkeleton", filePath: "components.ts", lineNumber: 2673 }); })();
 let KolSkipNav = class KolSkipNav extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5419,7 +4795,7 @@ export { KolSkipNav };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSkipNav, { className: "KolSkipNav", filePath: "components.ts", lineNumber: 3081 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSkipNav, { className: "KolSkipNav", filePath: "components.ts", lineNumber: 2742 }); })();
 let KolSpin = class KolSpin extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5493,7 +4869,7 @@ export { KolSpin };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSpin, { className: "KolSpin", filePath: "components.ts", lineNumber: 3140 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSpin, { className: "KolSpin", filePath: "components.ts", lineNumber: 2801 }); })();
 let KolSplitButton = class KolSplitButton extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5568,7 +4944,7 @@ export { KolSplitButton };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSplitButton, { className: "KolSplitButton", filePath: "components.ts", lineNumber: 3201 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSplitButton, { className: "KolSplitButton", filePath: "components.ts", lineNumber: 2862 }); })();
 let KolTableStateful = class KolTableStateful extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5643,7 +5019,7 @@ export { KolTableStateful };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTableStateful, { className: "KolTableStateful", filePath: "components.ts", lineNumber: 3277 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTableStateful, { className: "KolTableStateful", filePath: "components.ts", lineNumber: 2938 }); })();
 let KolTableStateless = class KolTableStateless extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5717,7 +5093,7 @@ export { KolTableStateless };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTableStateless, { className: "KolTableStateless", filePath: "components.ts", lineNumber: 3345 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTableStateless, { className: "KolTableStateless", filePath: "components.ts", lineNumber: 3006 }); })();
 let KolTabs = class KolTabs extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5791,7 +5167,7 @@ export { KolTabs };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTabs, { className: "KolTabs", filePath: "components.ts", lineNumber: 3410 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTabs, { className: "KolTabs", filePath: "components.ts", lineNumber: 3071 }); })();
 let KolTextarea = class KolTextarea extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5866,81 +5242,7 @@ export { KolTextarea };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTextarea, { className: "KolTextarea", filePath: "components.ts", lineNumber: 3475 }); })();
-let KolToastContainer = class KolToastContainer extends StencilProxyComponent {
-    constructor(changeDetectorRef, r, z) {
-        super();
-        this.changeDetectorRef = changeDetectorRef;
-        this.z = z;
-        this.availableInputProperties = [];
-        changeDetectorRef.detach();
-        const originalTagName = 'kol-toast-container';
-        this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
-        this.hasTagNameTransformer = typeof tagNameTransformer === 'function';
-        this.el = r.nativeElement;
-    }
-    ngOnChanges() {
-        if (typeof this.replaceTagDirective === 'object' && this.replaceTagDirective !== null && typeof this.replaceTagDirective.handlePropertyChanges === 'function') {
-            this.replaceTagDirective.handlePropertyChanges();
-        }
-        this.changeDetectorRef.detectChanges();
-    }
-};
-KolToastContainer.ɵfac = function KolToastContainer_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || KolToastContainer)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
-KolToastContainer.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolToastContainer, selectors: [["kol-toast-container"]], viewQuery: function KolToastContainer_Query(rf, ctx) { if (rf & 1) {
-        i0.ɵɵviewQuery(ReplaceTagDirective, 5);
-    } if (rf & 2) {
-        let _t;
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, features: [i0.ɵɵProvidersFeature([
-            { provide: StencilProxyComponent, useExisting: forwardRef(() => KolToastContainer) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [4, "replaceTag"], [4, "ngTemplateOutlet"]], template: function KolToastContainer_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵprojectionDef();
-        i0.ɵɵdomTemplate(0, KolToastContainer_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolToastContainer_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolToastContainer_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
-    } if (rf & 2) {
-        const defaultCase_r3 = i0.ɵɵreference(2);
-        i0.ɵɵdomProperty("ngIf", ctx.hasTagNameTransformer)("ngIfElse", defaultCase_r3);
-    } }, encapsulation: 2, changeDetection: 0 });
-KolToastContainer = __decorate([
-    ProxyCmp({
-        methods: ['enqueue', 'closeAll']
-    })
-], KolToastContainer);
-export { KolToastContainer };
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(KolToastContainer, [{
-        type: Component,
-        args: [{
-                selector: 'kol-toast-container',
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                template: `
-    <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
-      <stencil-ng-proxy
-        *replaceTag="tagName"
-        #replaceTagHost
-      >
-        <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-      </stencil-ng-proxy>
-    </ng-container>
-    <ng-template #defaultCase>
-      <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-    </ng-template>
-    <ng-template #ngContentOutlet>
-      <ng-content></ng-content>
-    </ng-template>`,
-                // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: [],
-                providers: [
-                    { provide: StencilProxyComponent, useExisting: forwardRef(() => KolToastContainer) }
-                ],
-            }]
-    }], () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], { replaceTagDirective: [{
-            type: ViewChild,
-            args: [ReplaceTagDirective]
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolToastContainer, { className: "KolToastContainer", filePath: "components.ts", lineNumber: 3556 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTextarea, { className: "KolTextarea", filePath: "components.ts", lineNumber: 3136 }); })();
 let KolToolbar = class KolToolbar extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -6014,7 +5316,7 @@ export { KolToolbar };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolToolbar, { className: "KolToolbar", filePath: "components.ts", lineNumber: 3614 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolToolbar, { className: "KolToolbar", filePath: "components.ts", lineNumber: 3217 }); })();
 let KolTree = class KolTree extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -6088,7 +5390,7 @@ export { KolTree };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTree, { className: "KolTree", filePath: "components.ts", lineNumber: 3674 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTree, { className: "KolTree", filePath: "components.ts", lineNumber: 3277 }); })();
 let KolTreeItem = class KolTreeItem extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -6163,82 +5465,7 @@ export { KolTreeItem };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTreeItem, { className: "KolTreeItem", filePath: "components.ts", lineNumber: 3733 }); })();
-let KolTreeItemWc = class KolTreeItemWc extends StencilProxyComponent {
-    constructor(changeDetectorRef, r, z) {
-        super();
-        this.changeDetectorRef = changeDetectorRef;
-        this.z = z;
-        this.availableInputProperties = ['_active', '_href', '_label', '_open'];
-        changeDetectorRef.detach();
-        const originalTagName = 'kol-tree-item-wc';
-        this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
-        this.hasTagNameTransformer = typeof tagNameTransformer === 'function';
-        this.el = r.nativeElement;
-    }
-    ngOnChanges() {
-        if (typeof this.replaceTagDirective === 'object' && this.replaceTagDirective !== null && typeof this.replaceTagDirective.handlePropertyChanges === 'function') {
-            this.replaceTagDirective.handlePropertyChanges();
-        }
-        this.changeDetectorRef.detectChanges();
-    }
-};
-KolTreeItemWc.ɵfac = function KolTreeItemWc_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || KolTreeItemWc)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
-KolTreeItemWc.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolTreeItemWc, selectors: [["kol-tree-item-wc"]], viewQuery: function KolTreeItemWc_Query(rf, ctx) { if (rf & 1) {
-        i0.ɵɵviewQuery(ReplaceTagDirective, 5);
-    } if (rf & 2) {
-        let _t;
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _active: "_active", _href: "_href", _label: "_label", _open: "_open" }, features: [i0.ɵɵProvidersFeature([
-            { provide: StencilProxyComponent, useExisting: forwardRef(() => KolTreeItemWc) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_active", "_href", "_label", "_open", 4, "replaceTag"], [3, "_active", "_href", "_label", "_open"], [4, "ngTemplateOutlet"]], template: function KolTreeItemWc_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵprojectionDef();
-        i0.ɵɵdomTemplate(0, KolTreeItemWc_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolTreeItemWc_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolTreeItemWc_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
-    } if (rf & 2) {
-        const defaultCase_r3 = i0.ɵɵreference(2);
-        i0.ɵɵdomProperty("ngIf", ctx.hasTagNameTransformer)("ngIfElse", defaultCase_r3);
-    } }, encapsulation: 2, changeDetection: 0 });
-KolTreeItemWc = __decorate([
-    ProxyCmp({
-        inputs: ['_active', '_href', '_label', '_open'],
-        methods: ['focus', 'expand', 'collapse', 'isOpen']
-    })
-], KolTreeItemWc);
-export { KolTreeItemWc };
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(KolTreeItemWc, [{
-        type: Component,
-        args: [{
-                selector: 'kol-tree-item-wc',
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                template: `
-    <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
-      <stencil-ng-proxy
-        [_active]="_active" [_href]="_href" [_label]="_label" [_open]="_open"
-        *replaceTag="tagName"
-        #replaceTagHost
-      >
-        <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-      </stencil-ng-proxy>
-    </ng-container>
-    <ng-template #defaultCase>
-      <ng-container *ngTemplateOutlet="ngContentOutlet"></ng-container>
-    </ng-template>
-    <ng-template #ngContentOutlet>
-      <ng-content></ng-content>
-    </ng-template>`,
-                // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_active', '_href', '_label', '_open'],
-                providers: [
-                    { provide: StencilProxyComponent, useExisting: forwardRef(() => KolTreeItemWc) }
-                ],
-            }]
-    }], () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], { replaceTagDirective: [{
-            type: ViewChild,
-            args: [ReplaceTagDirective]
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTreeItemWc, { className: "KolTreeItemWc", filePath: "components.ts", lineNumber: 3795 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTreeItem, { className: "KolTreeItem", filePath: "components.ts", lineNumber: 3336 }); })();
 let KolVersion = class KolVersion extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -6312,4 +5539,4 @@ export { KolVersion };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolVersion, { className: "KolVersion", filePath: "components.ts", lineNumber: 3856 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolVersion, { className: "KolVersion", filePath: "components.ts", lineNumber: 3397 }); })();