@public-ui/angular-v20 4.2.0-rc.1 → 4.2.0-rc.3

package/dist/components.js

@@ -342,13 +342,13 @@ function KolCombobox_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if (r
 } 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)("_hasClearButton", ctx_r0._hasClearButton)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_placeholder", ctx_r0._placeholder)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value);
+    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_disabled", ctx_r0._disabled)("_hasClearButton", ctx_r0._hasClearButton)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_placeholder", ctx_r0._placeholder)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolCombobox_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolCombobox_ng_container_0_stencil_ng_proxy_1_Template, 3, 19, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolCombobox_ng_container_0_stencil_ng_proxy_1_Template, 3, 20, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -666,13 +666,13 @@ function KolInputColor_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_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)("_name", ctx_r0._name)("_on", ctx_r0._on)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value);
+    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_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)("_name", ctx_r0._name)("_on", ctx_r0._on)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolInputColor_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolInputColor_ng_container_0_stencil_ng_proxy_1_Template, 3, 18, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolInputColor_ng_container_0_stencil_ng_proxy_1_Template, 3, 19, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -702,13 +702,13 @@ function KolInputDate_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if (
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_disabled", ctx_r0._disabled)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_max", ctx_r0._max)("_min", ctx_r0._min)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_readOnly", ctx_r0._readOnly)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_step", ctx_r0._step)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_type", ctx_r0._type)("_value", ctx_r0._value);
+    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_disabled", ctx_r0._disabled)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_max", ctx_r0._max)("_min", ctx_r0._min)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_readOnly", ctx_r0._readOnly)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_step", ctx_r0._step)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_type", ctx_r0._type)("_value", ctx_r0._value)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolInputDate_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolInputDate_ng_container_0_stencil_ng_proxy_1_Template, 3, 24, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolInputDate_ng_container_0_stencil_ng_proxy_1_Template, 3, 25, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -738,13 +738,13 @@ function KolInputEmail_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_disabled", ctx_r0._disabled)("_hasCounter", ctx_r0._hasCounter)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_maxLength", ctx_r0._maxLength)("_maxLengthBehavior", ctx_r0._maxLengthBehavior)("_msg", ctx_r0._msg)("_multiple", ctx_r0._multiple)("_name", ctx_r0._name)("_on", ctx_r0._on)("_pattern", ctx_r0._pattern)("_placeholder", ctx_r0._placeholder)("_readOnly", ctx_r0._readOnly)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value);
+    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_disabled", ctx_r0._disabled)("_hasCounter", ctx_r0._hasCounter)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_maxLength", ctx_r0._maxLength)("_maxLengthBehavior", ctx_r0._maxLengthBehavior)("_msg", ctx_r0._msg)("_multiple", ctx_r0._multiple)("_name", ctx_r0._name)("_on", ctx_r0._on)("_pattern", ctx_r0._pattern)("_placeholder", ctx_r0._placeholder)("_readOnly", ctx_r0._readOnly)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolInputEmail_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolInputEmail_ng_container_0_stencil_ng_proxy_1_Template, 3, 26, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolInputEmail_ng_container_0_stencil_ng_proxy_1_Template, 3, 27, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -774,13 +774,13 @@ function KolInputFile_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if (
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_accept", ctx_r0._accept)("_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)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched);
+    i0.ɵɵdomProperty("_accept", ctx_r0._accept)("_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)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolInputFile_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolInputFile_ng_container_0_stencil_ng_proxy_1_Template, 3, 18, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolInputFile_ng_container_0_stencil_ng_proxy_1_Template, 3, 19, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -810,13 +810,13 @@ function KolInputNumber_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_disabled", ctx_r0._disabled)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_max", ctx_r0._max)("_min", ctx_r0._min)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_placeholder", ctx_r0._placeholder)("_readOnly", ctx_r0._readOnly)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_step", ctx_r0._step)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value);
+    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_disabled", ctx_r0._disabled)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_max", ctx_r0._max)("_min", ctx_r0._min)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_placeholder", ctx_r0._placeholder)("_readOnly", ctx_r0._readOnly)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_step", ctx_r0._step)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolInputNumber_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolInputNumber_ng_container_0_stencil_ng_proxy_1_Template, 3, 24, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolInputNumber_ng_container_0_stencil_ng_proxy_1_Template, 3, 25, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -846,13 +846,13 @@ function KolInputPassword_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) {
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_disabled", ctx_r0._disabled)("_hasCounter", ctx_r0._hasCounter)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_maxLength", ctx_r0._maxLength)("_maxLengthBehavior", ctx_r0._maxLengthBehavior)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_pattern", ctx_r0._pattern)("_placeholder", ctx_r0._placeholder)("_readOnly", ctx_r0._readOnly)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value)("_variant", ctx_r0._variant);
+    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_disabled", ctx_r0._disabled)("_hasCounter", ctx_r0._hasCounter)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_maxLength", ctx_r0._maxLength)("_maxLengthBehavior", ctx_r0._maxLengthBehavior)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_pattern", ctx_r0._pattern)("_placeholder", ctx_r0._placeholder)("_readOnly", ctx_r0._readOnly)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value)("_variant", ctx_r0._variant)("_visibilityToggle", ctx_r0._visibilityToggle);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolInputPassword_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolInputPassword_ng_container_0_stencil_ng_proxy_1_Template, 3, 25, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolInputPassword_ng_container_0_stencil_ng_proxy_1_Template, 3, 26, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -882,13 +882,13 @@ function KolInputRadio_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_disabled", ctx_r0._disabled)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_label", ctx_r0._label)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_options", ctx_r0._options)("_orientation", ctx_r0._orientation)("_required", ctx_r0._required)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value);
+    i0.ɵɵdomProperty("_disabled", ctx_r0._disabled)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_label", ctx_r0._label)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_options", ctx_r0._options)("_orientation", ctx_r0._orientation)("_required", ctx_r0._required)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolInputRadio_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolInputRadio_ng_container_0_stencil_ng_proxy_1_Template, 3, 15, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolInputRadio_ng_container_0_stencil_ng_proxy_1_Template, 3, 16, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -918,13 +918,13 @@ function KolInputRange_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_disabled", ctx_r0._disabled)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_max", ctx_r0._max)("_min", ctx_r0._min)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_shortKey", ctx_r0._shortKey)("_step", ctx_r0._step)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value);
+    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_disabled", ctx_r0._disabled)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_max", ctx_r0._max)("_min", ctx_r0._min)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_shortKey", ctx_r0._shortKey)("_step", ctx_r0._step)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolInputRange_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolInputRange_ng_container_0_stencil_ng_proxy_1_Template, 3, 20, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolInputRange_ng_container_0_stencil_ng_proxy_1_Template, 3, 21, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -954,13 +954,13 @@ function KolInputText_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if (
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_disabled", ctx_r0._disabled)("_hasCounter", ctx_r0._hasCounter)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_maxLength", ctx_r0._maxLength)("_maxLengthBehavior", ctx_r0._maxLengthBehavior)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_pattern", ctx_r0._pattern)("_placeholder", ctx_r0._placeholder)("_readOnly", ctx_r0._readOnly)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_spellCheck", ctx_r0._spellCheck)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_type", ctx_r0._type)("_value", ctx_r0._value);
+    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_autoComplete", ctx_r0._autoComplete)("_disabled", ctx_r0._disabled)("_hasCounter", ctx_r0._hasCounter)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_maxLength", ctx_r0._maxLength)("_maxLengthBehavior", ctx_r0._maxLengthBehavior)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_pattern", ctx_r0._pattern)("_placeholder", ctx_r0._placeholder)("_readOnly", ctx_r0._readOnly)("_required", ctx_r0._required)("_shortKey", ctx_r0._shortKey)("_smartButton", ctx_r0._smartButton)("_spellCheck", ctx_r0._spellCheck)("_suggestions", ctx_r0._suggestions)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_type", ctx_r0._type)("_value", ctx_r0._value)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolInputText_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolInputText_ng_container_0_stencil_ng_proxy_1_Template, 3, 27, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolInputText_ng_container_0_stencil_ng_proxy_1_Template, 3, 28, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -1350,13 +1350,13 @@ function KolSelect_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if (rf
 } 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.ɵɵ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)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolSelect_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolSelect_ng_container_0_stencil_ng_proxy_1_Template, 3, 20, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolSelect_ng_container_0_stencil_ng_proxy_1_Template, 3, 21, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -1386,13 +1386,13 @@ function KolSingleSelect_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { i
 } 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)("_hasClearButton", ctx_r0._hasClearButton)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_options", ctx_r0._options)("_placeholder", ctx_r0._placeholder)("_required", ctx_r0._required)("_rows", ctx_r0._rows)("_shortKey", ctx_r0._shortKey)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value);
+    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_disabled", ctx_r0._disabled)("_hasClearButton", ctx_r0._hasClearButton)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_options", ctx_r0._options)("_placeholder", ctx_r0._placeholder)("_required", ctx_r0._required)("_rows", ctx_r0._rows)("_shortKey", ctx_r0._shortKey)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolSingleSelect_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolSingleSelect_ng_container_0_stencil_ng_proxy_1_Template, 3, 20, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolSingleSelect_ng_container_0_stencil_ng_proxy_1_Template, 3, 21, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -1566,13 +1566,13 @@ function KolTableStateful_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) {
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_allowMultiSort", ctx_r0._allowMultiSort)("_data", ctx_r0._data)("_dataFoot", ctx_r0._dataFoot)("_fixedCols", ctx_r0._fixedCols)("_hasSettingsMenu", ctx_r0._hasSettingsMenu)("_headers", ctx_r0._headers)("_label", ctx_r0._label)("_on", ctx_r0._on)("_pagination", ctx_r0._pagination)("_paginationPosition", ctx_r0._paginationPosition)("_selection", ctx_r0._selection)("_variant", ctx_r0._variant);
+    i0.ɵɵdomProperty("_allowMultiSort", ctx_r0._allowMultiSort)("_ariaLabelledby", ctx_r0._ariaLabelledby)("_data", ctx_r0._data)("_dataFoot", ctx_r0._dataFoot)("_fixedCols", ctx_r0._fixedCols)("_hasSettingsMenu", ctx_r0._hasSettingsMenu)("_headers", ctx_r0._headers)("_label", ctx_r0._label)("_on", ctx_r0._on)("_pagination", ctx_r0._pagination)("_paginationPosition", ctx_r0._paginationPosition)("_selection", ctx_r0._selection)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolTableStateful_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolTableStateful_ng_container_0_stencil_ng_proxy_1_Template, 3, 13, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolTableStateful_ng_container_0_stencil_ng_proxy_1_Template, 3, 14, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -1602,13 +1602,13 @@ function KolTableStateless_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) {
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_data", ctx_r0._data)("_dataFoot", ctx_r0._dataFoot)("_fixedCols", ctx_r0._fixedCols)("_hasSettingsMenu", ctx_r0._hasSettingsMenu)("_headerCells", ctx_r0._headerCells)("_label", ctx_r0._label)("_on", ctx_r0._on)("_selection", ctx_r0._selection)("_variant", ctx_r0._variant);
+    i0.ɵɵdomProperty("_ariaLabelledby", ctx_r0._ariaLabelledby)("_data", ctx_r0._data)("_dataFoot", ctx_r0._dataFoot)("_fixedCols", ctx_r0._fixedCols)("_hasSettingsMenu", ctx_r0._hasSettingsMenu)("_headerCells", ctx_r0._headerCells)("_label", ctx_r0._label)("_on", ctx_r0._on)("_selection", ctx_r0._selection)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolTableStateless_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolTableStateless_ng_container_0_stencil_ng_proxy_1_Template, 3, 10, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolTableStateless_ng_container_0_stencil_ng_proxy_1_Template, 3, 11, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -1674,13 +1674,13 @@ function KolTextarea_ng_container_0_stencil_ng_proxy_1_Template(rf, ctx) { if (r
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     const ngContentOutlet_r2 = i0.ɵɵreference(4);
-    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_adjustHeight", ctx_r0._adjustHeight)("_disabled", ctx_r0._disabled)("_hasCounter", ctx_r0._hasCounter)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_maxLength", ctx_r0._maxLength)("_maxLengthBehavior", ctx_r0._maxLengthBehavior)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_placeholder", ctx_r0._placeholder)("_readOnly", ctx_r0._readOnly)("_required", ctx_r0._required)("_resize", ctx_r0._resize)("_rows", ctx_r0._rows)("_shortKey", ctx_r0._shortKey)("_spellCheck", ctx_r0._spellCheck)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value);
+    i0.ɵɵdomProperty("_accessKey", ctx_r0._accessKey)("_adjustHeight", ctx_r0._adjustHeight)("_disabled", ctx_r0._disabled)("_hasCounter", ctx_r0._hasCounter)("_hideLabel", ctx_r0._hideLabel)("_hideMsg", ctx_r0._hideMsg)("_hint", ctx_r0._hint)("_icons", ctx_r0._icons)("_label", ctx_r0._label)("_maxLength", ctx_r0._maxLength)("_maxLengthBehavior", ctx_r0._maxLengthBehavior)("_msg", ctx_r0._msg)("_name", ctx_r0._name)("_on", ctx_r0._on)("_placeholder", ctx_r0._placeholder)("_readOnly", ctx_r0._readOnly)("_required", ctx_r0._required)("_resize", ctx_r0._resize)("_rows", ctx_r0._rows)("_shortKey", ctx_r0._shortKey)("_spellCheck", ctx_r0._spellCheck)("_tooltipAlign", ctx_r0._tooltipAlign)("_touched", ctx_r0._touched)("_value", ctx_r0._value)("_variant", ctx_r0._variant);
     i0.ɵɵadvance(2);
     i0.ɵɵdomProperty("ngTemplateOutlet", ngContentOutlet_r2);
 } }
 function KolTextarea_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementContainerStart(0);
-    i0.ɵɵdomTemplate(1, KolTextarea_ng_container_0_stencil_ng_proxy_1_Template, 3, 25, "stencil-ng-proxy", 4);
+    i0.ɵɵdomTemplate(1, KolTextarea_ng_container_0_stencil_ng_proxy_1_Template, 3, 26, "stencil-ng-proxy", 4);
     i0.ɵɵdomElementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -2519,7 +2519,7 @@ let KolCombobox = class KolCombobox extends StencilProxyComponent {
         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 = ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_placeholder', '_required', '_shortKey', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-combobox';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -2539,9 +2539,9 @@ KolCombobox.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolCombobox, se
     } 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([
+    } }, 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", _variant: "_variant" }, 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.ɵɵ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", "_variant", 4, "replaceTag"], [3, "_accessKey", "_disabled", "_hasClearButton", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_name", "_on", "_placeholder", "_required", "_shortKey", "_suggestions", "_tooltipAlign", "_touched", "_value", "_variant"], [4, "ngTemplateOutlet"]], template: function KolCombobox_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);
     } if (rf & 2) {
@@ -2550,7 +2550,7 @@ KolCombobox.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolCombobox, se
     } }, encapsulation: 2, changeDetection: 0 });
 KolCombobox = __decorate([
     ProxyCmp({
-        inputs: ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_placeholder', '_required', '_shortKey', '_suggestions', '_tooltipAlign', '_touched', '_value'],
+        inputs: ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_placeholder', '_required', '_shortKey', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'],
         methods: ['getValue', 'focus', 'click']
     })
 ], KolCombobox);
@@ -2563,7 +2563,7 @@ export { KolCombobox };
                 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"
+        [_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" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -2579,7 +2579,7 @@ export { KolCombobox };
       <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'],
+                inputs: ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_placeholder', '_required', '_shortKey', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolCombobox) }
                 ],
@@ -2663,7 +2663,7 @@ export { KolDetails };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolDetails, { className: "KolDetails", filePath: "components.ts", lineNumber: 702 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolDetails, { className: "KolDetails", filePath: "components.ts", lineNumber: 703 }); })();
 let KolDialog = class KolDialog extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -2738,7 +2738,7 @@ export { KolDialog };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolDialog, { className: "KolDialog", filePath: "components.ts", lineNumber: 765 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolDialog, { className: "KolDialog", filePath: "components.ts", lineNumber: 766 }); })();
 let KolDrawer = class KolDrawer extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -2813,7 +2813,7 @@ export { KolDrawer };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolDrawer, { className: "KolDrawer", filePath: "components.ts", lineNumber: 828 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolDrawer, { className: "KolDrawer", filePath: "components.ts", lineNumber: 829 }); })();
 let KolForm = class KolForm extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -2888,7 +2888,7 @@ export { KolForm };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolForm, { className: "KolForm", filePath: "components.ts", lineNumber: 892 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolForm, { className: "KolForm", filePath: "components.ts", lineNumber: 893 }); })();
 let KolHeading = class KolHeading extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -2962,7 +2962,7 @@ export { KolHeading };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolHeading, { className: "KolHeading", filePath: "components.ts", lineNumber: 952 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolHeading, { className: "KolHeading", filePath: "components.ts", lineNumber: 953 }); })();
 let KolIcon = class KolIcon extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3036,7 +3036,7 @@ export { KolIcon };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolIcon, { className: "KolIcon", filePath: "components.ts", lineNumber: 1012 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolIcon, { className: "KolIcon", filePath: "components.ts", lineNumber: 1013 }); })();
 let KolImage = class KolImage extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3110,7 +3110,7 @@ export { KolImage };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolImage, { className: "KolImage", filePath: "components.ts", lineNumber: 1071 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolImage, { className: "KolImage", filePath: "components.ts", lineNumber: 1072 }); })();
 let KolInputCheckbox = class KolInputCheckbox extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3185,13 +3185,13 @@ export { KolInputCheckbox };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputCheckbox, { className: "KolInputCheckbox", filePath: "components.ts", lineNumber: 1134 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputCheckbox, { className: "KolInputCheckbox", filePath: "components.ts", lineNumber: 1135 }); })();
 let KolInputColor = class KolInputColor extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_shortKey', '_smartButton', '_suggestions', '_tooltipAlign', '_touched', '_value'];
+        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_shortKey', '_smartButton', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-input-color';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -3211,9 +3211,9 @@ KolInputColor.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputColor
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _msg: "_msg", _name: "_name", _on: "_on", _shortKey: "_shortKey", _smartButton: "_smartButton", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value" }, features: [i0.ɵɵProvidersFeature([
+    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _msg: "_msg", _name: "_name", _on: "_on", _shortKey: "_shortKey", _smartButton: "_smartButton", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputColor) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_name", "_on", "_shortKey", "_smartButton", "_suggestions", "_tooltipAlign", "_touched", "_value", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_name", "_on", "_shortKey", "_smartButton", "_suggestions", "_tooltipAlign", "_touched", "_value"], [4, "ngTemplateOutlet"]], template: function KolInputColor_Template(rf, ctx) { if (rf & 1) {
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_name", "_on", "_shortKey", "_smartButton", "_suggestions", "_tooltipAlign", "_touched", "_value", "_variant", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_name", "_on", "_shortKey", "_smartButton", "_suggestions", "_tooltipAlign", "_touched", "_value", "_variant"], [4, "ngTemplateOutlet"]], template: function KolInputColor_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolInputColor_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolInputColor_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolInputColor_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -3222,7 +3222,7 @@ KolInputColor.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputColor
     } }, encapsulation: 2, changeDetection: 0 });
 KolInputColor = __decorate([
     ProxyCmp({
-        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_shortKey', '_smartButton', '_suggestions', '_tooltipAlign', '_touched', '_value'],
+        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_shortKey', '_smartButton', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'],
         methods: ['getValue', 'focus', 'click']
     })
 ], KolInputColor);
@@ -3235,7 +3235,7 @@ export { KolInputColor };
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_msg]="_msg" [_name]="_name" [_on]="_on" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value"
+        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_msg]="_msg" [_name]="_name" [_on]="_on" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -3251,7 +3251,7 @@ export { KolInputColor };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_shortKey', '_smartButton', '_suggestions', '_tooltipAlign', '_touched', '_value'],
+                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_shortKey', '_smartButton', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputColor) }
                 ],
@@ -3260,13 +3260,13 @@ export { KolInputColor };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputColor, { className: "KolInputColor", filePath: "components.ts", lineNumber: 1211 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputColor, { className: "KolInputColor", filePath: "components.ts", lineNumber: 1212 }); })();
 let KolInputDate = class KolInputDate extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_readOnly', '_required', '_shortKey', '_smartButton', '_step', '_suggestions', '_tooltipAlign', '_touched', '_type', '_value'];
+        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_readOnly', '_required', '_shortKey', '_smartButton', '_step', '_suggestions', '_tooltipAlign', '_touched', '_type', '_value', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-input-date';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -3286,9 +3286,9 @@ KolInputDate.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputDate,
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _max: "_max", _min: "_min", _msg: "_msg", _name: "_name", _on: "_on", _readOnly: "_readOnly", _required: "_required", _shortKey: "_shortKey", _smartButton: "_smartButton", _step: "_step", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _type: "_type", _value: "_value" }, features: [i0.ɵɵProvidersFeature([
+    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _max: "_max", _min: "_min", _msg: "_msg", _name: "_name", _on: "_on", _readOnly: "_readOnly", _required: "_required", _shortKey: "_shortKey", _smartButton: "_smartButton", _step: "_step", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _type: "_type", _value: "_value", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputDate) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_max", "_min", "_msg", "_name", "_on", "_readOnly", "_required", "_shortKey", "_smartButton", "_step", "_suggestions", "_tooltipAlign", "_touched", "_type", "_value", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_max", "_min", "_msg", "_name", "_on", "_readOnly", "_required", "_shortKey", "_smartButton", "_step", "_suggestions", "_tooltipAlign", "_touched", "_type", "_value"], [4, "ngTemplateOutlet"]], template: function KolInputDate_Template(rf, ctx) { if (rf & 1) {
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_max", "_min", "_msg", "_name", "_on", "_readOnly", "_required", "_shortKey", "_smartButton", "_step", "_suggestions", "_tooltipAlign", "_touched", "_type", "_value", "_variant", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_max", "_min", "_msg", "_name", "_on", "_readOnly", "_required", "_shortKey", "_smartButton", "_step", "_suggestions", "_tooltipAlign", "_touched", "_type", "_value", "_variant"], [4, "ngTemplateOutlet"]], template: function KolInputDate_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolInputDate_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolInputDate_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolInputDate_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -3297,7 +3297,7 @@ KolInputDate.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputDate,
     } }, encapsulation: 2, changeDetection: 0 });
 KolInputDate = __decorate([
     ProxyCmp({
-        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_readOnly', '_required', '_shortKey', '_smartButton', '_step', '_suggestions', '_tooltipAlign', '_touched', '_type', '_value'],
+        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_readOnly', '_required', '_shortKey', '_smartButton', '_step', '_suggestions', '_tooltipAlign', '_touched', '_type', '_value', '_variant'],
         methods: ['getValue', 'focus', 'click', 'reset']
     })
 ], KolInputDate);
@@ -3310,7 +3310,7 @@ export { KolInputDate };
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_max]="_max" [_min]="_min" [_msg]="_msg" [_name]="_name" [_on]="_on" [_readOnly]="_readOnly" [_required]="_required" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_step]="_step" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_type]="_type" [_value]="_value"
+        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_max]="_max" [_min]="_min" [_msg]="_msg" [_name]="_name" [_on]="_on" [_readOnly]="_readOnly" [_required]="_required" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_step]="_step" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_type]="_type" [_value]="_value" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -3326,7 +3326,7 @@ export { KolInputDate };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_readOnly', '_required', '_shortKey', '_smartButton', '_step', '_suggestions', '_tooltipAlign', '_touched', '_type', '_value'],
+                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_readOnly', '_required', '_shortKey', '_smartButton', '_step', '_suggestions', '_tooltipAlign', '_touched', '_type', '_value', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputDate) }
                 ],
@@ -3335,13 +3335,13 @@ export { KolInputDate };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputDate, { className: "KolInputDate", filePath: "components.ts", lineNumber: 1286 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputDate, { className: "KolInputDate", filePath: "components.ts", lineNumber: 1288 }); })();
 let KolInputEmail = class KolInputEmail extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_multiple', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_suggestions', '_tooltipAlign', '_touched', '_value'];
+        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_multiple', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-input-email';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -3361,9 +3361,9 @@ KolInputEmail.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputEmail
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hasCounter: "_hasCounter", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _maxLength: "_maxLength", _maxLengthBehavior: "_maxLengthBehavior", _msg: "_msg", _multiple: "_multiple", _name: "_name", _on: "_on", _pattern: "_pattern", _placeholder: "_placeholder", _readOnly: "_readOnly", _required: "_required", _shortKey: "_shortKey", _smartButton: "_smartButton", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value" }, features: [i0.ɵɵProvidersFeature([
+    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hasCounter: "_hasCounter", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _maxLength: "_maxLength", _maxLengthBehavior: "_maxLengthBehavior", _msg: "_msg", _multiple: "_multiple", _name: "_name", _on: "_on", _pattern: "_pattern", _placeholder: "_placeholder", _readOnly: "_readOnly", _required: "_required", _shortKey: "_shortKey", _smartButton: "_smartButton", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputEmail) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_multiple", "_name", "_on", "_pattern", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_suggestions", "_tooltipAlign", "_touched", "_value", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_multiple", "_name", "_on", "_pattern", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_suggestions", "_tooltipAlign", "_touched", "_value"], [4, "ngTemplateOutlet"]], template: function KolInputEmail_Template(rf, ctx) { if (rf & 1) {
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_multiple", "_name", "_on", "_pattern", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_suggestions", "_tooltipAlign", "_touched", "_value", "_variant", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_multiple", "_name", "_on", "_pattern", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_suggestions", "_tooltipAlign", "_touched", "_value", "_variant"], [4, "ngTemplateOutlet"]], template: function KolInputEmail_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolInputEmail_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolInputEmail_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolInputEmail_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -3372,7 +3372,7 @@ KolInputEmail.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputEmail
     } }, encapsulation: 2, changeDetection: 0 });
 KolInputEmail = __decorate([
     ProxyCmp({
-        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_multiple', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_suggestions', '_tooltipAlign', '_touched', '_value'],
+        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_multiple', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'],
         methods: ['getValue', 'focus', 'click']
     })
 ], KolInputEmail);
@@ -3385,7 +3385,7 @@ export { KolInputEmail };
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hasCounter]="_hasCounter" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_maxLength]="_maxLength" [_maxLengthBehavior]="_maxLengthBehavior" [_msg]="_msg" [_multiple]="_multiple" [_name]="_name" [_on]="_on" [_pattern]="_pattern" [_placeholder]="_placeholder" [_readOnly]="_readOnly" [_required]="_required" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value"
+        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hasCounter]="_hasCounter" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_maxLength]="_maxLength" [_maxLengthBehavior]="_maxLengthBehavior" [_msg]="_msg" [_multiple]="_multiple" [_name]="_name" [_on]="_on" [_pattern]="_pattern" [_placeholder]="_placeholder" [_readOnly]="_readOnly" [_required]="_required" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -3401,7 +3401,7 @@ export { KolInputEmail };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_multiple', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_suggestions', '_tooltipAlign', '_touched', '_value'],
+                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_multiple', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputEmail) }
                 ],
@@ -3410,13 +3410,13 @@ export { KolInputEmail };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputEmail, { className: "KolInputEmail", filePath: "components.ts", lineNumber: 1367 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputEmail, { className: "KolInputEmail", filePath: "components.ts", lineNumber: 1370 }); })();
 let KolInputFile = class KolInputFile extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_accept', '_accessKey', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_multiple', '_name', '_on', '_required', '_shortKey', '_smartButton', '_tooltipAlign', '_touched'];
+        this.availableInputProperties = ['_accept', '_accessKey', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_multiple', '_name', '_on', '_required', '_shortKey', '_smartButton', '_tooltipAlign', '_touched', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-input-file';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -3436,9 +3436,9 @@ KolInputFile.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputFile,
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _accept: "_accept", _accessKey: "_accessKey", _disabled: "_disabled", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _msg: "_msg", _multiple: "_multiple", _name: "_name", _on: "_on", _required: "_required", _shortKey: "_shortKey", _smartButton: "_smartButton", _tooltipAlign: "_tooltipAlign", _touched: "_touched" }, features: [i0.ɵɵProvidersFeature([
+    } }, inputs: { _accept: "_accept", _accessKey: "_accessKey", _disabled: "_disabled", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _msg: "_msg", _multiple: "_multiple", _name: "_name", _on: "_on", _required: "_required", _shortKey: "_shortKey", _smartButton: "_smartButton", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputFile) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accept", "_accessKey", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_multiple", "_name", "_on", "_required", "_shortKey", "_smartButton", "_tooltipAlign", "_touched", 4, "replaceTag"], [3, "_accept", "_accessKey", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_multiple", "_name", "_on", "_required", "_shortKey", "_smartButton", "_tooltipAlign", "_touched"], [4, "ngTemplateOutlet"]], template: function KolInputFile_Template(rf, ctx) { if (rf & 1) {
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accept", "_accessKey", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_multiple", "_name", "_on", "_required", "_shortKey", "_smartButton", "_tooltipAlign", "_touched", "_variant", 4, "replaceTag"], [3, "_accept", "_accessKey", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_multiple", "_name", "_on", "_required", "_shortKey", "_smartButton", "_tooltipAlign", "_touched", "_variant"], [4, "ngTemplateOutlet"]], template: function KolInputFile_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolInputFile_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolInputFile_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolInputFile_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -3447,7 +3447,7 @@ KolInputFile.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputFile,
     } }, encapsulation: 2, changeDetection: 0 });
 KolInputFile = __decorate([
     ProxyCmp({
-        inputs: ['_accept', '_accessKey', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_multiple', '_name', '_on', '_required', '_shortKey', '_smartButton', '_tooltipAlign', '_touched'],
+        inputs: ['_accept', '_accessKey', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_multiple', '_name', '_on', '_required', '_shortKey', '_smartButton', '_tooltipAlign', '_touched', '_variant'],
         methods: ['getValue', 'focus', 'click', 'reset']
     })
 ], KolInputFile);
@@ -3460,7 +3460,7 @@ export { KolInputFile };
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_accept]="_accept" [_accessKey]="_accessKey" [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_msg]="_msg" [_multiple]="_multiple" [_name]="_name" [_on]="_on" [_required]="_required" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched"
+        [_accept]="_accept" [_accessKey]="_accessKey" [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_msg]="_msg" [_multiple]="_multiple" [_name]="_name" [_on]="_on" [_required]="_required" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -3476,7 +3476,7 @@ export { KolInputFile };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_accept', '_accessKey', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_multiple', '_name', '_on', '_required', '_shortKey', '_smartButton', '_tooltipAlign', '_touched'],
+                inputs: ['_accept', '_accessKey', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_multiple', '_name', '_on', '_required', '_shortKey', '_smartButton', '_tooltipAlign', '_touched', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputFile) }
                 ],
@@ -3485,13 +3485,13 @@ export { KolInputFile };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputFile, { className: "KolInputFile", filePath: "components.ts", lineNumber: 1450 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputFile, { className: "KolInputFile", filePath: "components.ts", lineNumber: 1454 }); })();
 let KolInputNumber = class KolInputNumber extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_step', '_suggestions', '_tooltipAlign', '_touched', '_value'];
+        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_step', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-input-number';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -3511,9 +3511,9 @@ KolInputNumber.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputNumb
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _max: "_max", _min: "_min", _msg: "_msg", _name: "_name", _on: "_on", _placeholder: "_placeholder", _readOnly: "_readOnly", _required: "_required", _shortKey: "_shortKey", _smartButton: "_smartButton", _step: "_step", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value" }, features: [i0.ɵɵProvidersFeature([
+    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _max: "_max", _min: "_min", _msg: "_msg", _name: "_name", _on: "_on", _placeholder: "_placeholder", _readOnly: "_readOnly", _required: "_required", _shortKey: "_shortKey", _smartButton: "_smartButton", _step: "_step", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputNumber) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_max", "_min", "_msg", "_name", "_on", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_step", "_suggestions", "_tooltipAlign", "_touched", "_value", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_max", "_min", "_msg", "_name", "_on", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_step", "_suggestions", "_tooltipAlign", "_touched", "_value"], [4, "ngTemplateOutlet"]], template: function KolInputNumber_Template(rf, ctx) { if (rf & 1) {
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_max", "_min", "_msg", "_name", "_on", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_step", "_suggestions", "_tooltipAlign", "_touched", "_value", "_variant", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_max", "_min", "_msg", "_name", "_on", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_step", "_suggestions", "_tooltipAlign", "_touched", "_value", "_variant"], [4, "ngTemplateOutlet"]], template: function KolInputNumber_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolInputNumber_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolInputNumber_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolInputNumber_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -3522,7 +3522,7 @@ KolInputNumber.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputNumb
     } }, encapsulation: 2, changeDetection: 0 });
 KolInputNumber = __decorate([
     ProxyCmp({
-        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_step', '_suggestions', '_tooltipAlign', '_touched', '_value'],
+        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_step', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'],
         methods: ['getValue', 'focus', 'click']
     })
 ], KolInputNumber);
@@ -3535,7 +3535,7 @@ export { KolInputNumber };
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_max]="_max" [_min]="_min" [_msg]="_msg" [_name]="_name" [_on]="_on" [_placeholder]="_placeholder" [_readOnly]="_readOnly" [_required]="_required" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_step]="_step" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value"
+        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_max]="_max" [_min]="_min" [_msg]="_msg" [_name]="_name" [_on]="_on" [_placeholder]="_placeholder" [_readOnly]="_readOnly" [_required]="_required" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_step]="_step" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -3551,7 +3551,7 @@ export { KolInputNumber };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_step', '_suggestions', '_tooltipAlign', '_touched', '_value'],
+                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_step', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputNumber) }
                 ],
@@ -3560,13 +3560,13 @@ export { KolInputNumber };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputNumber, { className: "KolInputNumber", filePath: "components.ts", lineNumber: 1525 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputNumber, { className: "KolInputNumber", filePath: "components.ts", lineNumber: 1530 }); })();
 let KolInputPassword = class KolInputPassword extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_tooltipAlign', '_touched', '_value', '_variant'];
+        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_tooltipAlign', '_touched', '_value', '_variant', '_visibilityToggle'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-input-password';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -3586,9 +3586,9 @@ KolInputPassword.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputPa
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hasCounter: "_hasCounter", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _maxLength: "_maxLength", _maxLengthBehavior: "_maxLengthBehavior", _msg: "_msg", _name: "_name", _on: "_on", _pattern: "_pattern", _placeholder: "_placeholder", _readOnly: "_readOnly", _required: "_required", _shortKey: "_shortKey", _smartButton: "_smartButton", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
+    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hasCounter: "_hasCounter", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _maxLength: "_maxLength", _maxLengthBehavior: "_maxLengthBehavior", _msg: "_msg", _name: "_name", _on: "_on", _pattern: "_pattern", _placeholder: "_placeholder", _readOnly: "_readOnly", _required: "_required", _shortKey: "_shortKey", _smartButton: "_smartButton", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value", _variant: "_variant", _visibilityToggle: "_visibilityToggle" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputPassword) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_name", "_on", "_pattern", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_tooltipAlign", "_touched", "_value", "_variant", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_name", "_on", "_pattern", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_tooltipAlign", "_touched", "_value", "_variant"], [4, "ngTemplateOutlet"]], template: function KolInputPassword_Template(rf, ctx) { if (rf & 1) {
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_name", "_on", "_pattern", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_tooltipAlign", "_touched", "_value", "_variant", "_visibilityToggle", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_name", "_on", "_pattern", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_tooltipAlign", "_touched", "_value", "_variant", "_visibilityToggle"], [4, "ngTemplateOutlet"]], template: function KolInputPassword_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolInputPassword_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolInputPassword_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolInputPassword_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -3597,7 +3597,7 @@ KolInputPassword.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputPa
     } }, encapsulation: 2, changeDetection: 0 });
 KolInputPassword = __decorate([
     ProxyCmp({
-        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_tooltipAlign', '_touched', '_value', '_variant'],
+        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_tooltipAlign', '_touched', '_value', '_variant', '_visibilityToggle'],
         methods: ['getValue', 'focus', 'click']
     })
 ], KolInputPassword);
@@ -3610,7 +3610,7 @@ export { KolInputPassword };
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hasCounter]="_hasCounter" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_maxLength]="_maxLength" [_maxLengthBehavior]="_maxLengthBehavior" [_msg]="_msg" [_name]="_name" [_on]="_on" [_pattern]="_pattern" [_placeholder]="_placeholder" [_readOnly]="_readOnly" [_required]="_required" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value" [_variant]="_variant"
+        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hasCounter]="_hasCounter" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_maxLength]="_maxLength" [_maxLengthBehavior]="_maxLengthBehavior" [_msg]="_msg" [_name]="_name" [_on]="_on" [_pattern]="_pattern" [_placeholder]="_placeholder" [_readOnly]="_readOnly" [_required]="_required" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value" [_variant]="_variant" [_visibilityToggle]="_visibilityToggle"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -3626,7 +3626,7 @@ export { KolInputPassword };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_tooltipAlign', '_touched', '_value', '_variant'],
+                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_tooltipAlign', '_touched', '_value', '_variant', '_visibilityToggle'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputPassword) }
                 ],
@@ -3635,13 +3635,13 @@ export { KolInputPassword };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputPassword, { className: "KolInputPassword", filePath: "components.ts", lineNumber: 1606 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputPassword, { className: "KolInputPassword", filePath: "components.ts", lineNumber: 1612 }); })();
 let KolInputRadio = class KolInputRadio extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_disabled', '_hideLabel', '_hideMsg', '_hint', '_label', '_msg', '_name', '_on', '_options', '_orientation', '_required', '_tooltipAlign', '_touched', '_value'];
+        this.availableInputProperties = ['_disabled', '_hideLabel', '_hideMsg', '_hint', '_label', '_msg', '_name', '_on', '_options', '_orientation', '_required', '_tooltipAlign', '_touched', '_value', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-input-radio';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -3661,9 +3661,9 @@ KolInputRadio.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputRadio
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _disabled: "_disabled", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _label: "_label", _msg: "_msg", _name: "_name", _on: "_on", _options: "_options", _orientation: "_orientation", _required: "_required", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value" }, features: [i0.ɵɵProvidersFeature([
+    } }, inputs: { _disabled: "_disabled", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _label: "_label", _msg: "_msg", _name: "_name", _on: "_on", _options: "_options", _orientation: "_orientation", _required: "_required", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputRadio) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_disabled", "_hideLabel", "_hideMsg", "_hint", "_label", "_msg", "_name", "_on", "_options", "_orientation", "_required", "_tooltipAlign", "_touched", "_value", 4, "replaceTag"], [3, "_disabled", "_hideLabel", "_hideMsg", "_hint", "_label", "_msg", "_name", "_on", "_options", "_orientation", "_required", "_tooltipAlign", "_touched", "_value"], [4, "ngTemplateOutlet"]], template: function KolInputRadio_Template(rf, ctx) { if (rf & 1) {
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_disabled", "_hideLabel", "_hideMsg", "_hint", "_label", "_msg", "_name", "_on", "_options", "_orientation", "_required", "_tooltipAlign", "_touched", "_value", "_variant", 4, "replaceTag"], [3, "_disabled", "_hideLabel", "_hideMsg", "_hint", "_label", "_msg", "_name", "_on", "_options", "_orientation", "_required", "_tooltipAlign", "_touched", "_value", "_variant"], [4, "ngTemplateOutlet"]], template: function KolInputRadio_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolInputRadio_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolInputRadio_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolInputRadio_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -3672,7 +3672,7 @@ KolInputRadio.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputRadio
     } }, encapsulation: 2, changeDetection: 0 });
 KolInputRadio = __decorate([
     ProxyCmp({
-        inputs: ['_disabled', '_hideLabel', '_hideMsg', '_hint', '_label', '_msg', '_name', '_on', '_options', '_orientation', '_required', '_tooltipAlign', '_touched', '_value'],
+        inputs: ['_disabled', '_hideLabel', '_hideMsg', '_hint', '_label', '_msg', '_name', '_on', '_options', '_orientation', '_required', '_tooltipAlign', '_touched', '_value', '_variant'],
         methods: ['getValue', 'focus', 'click']
     })
 ], KolInputRadio);
@@ -3685,7 +3685,7 @@ export { KolInputRadio };
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_label]="_label" [_msg]="_msg" [_name]="_name" [_on]="_on" [_options]="_options" [_orientation]="_orientation" [_required]="_required" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value"
+        [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_label]="_label" [_msg]="_msg" [_name]="_name" [_on]="_on" [_options]="_options" [_orientation]="_orientation" [_required]="_required" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -3701,7 +3701,7 @@ export { KolInputRadio };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_disabled', '_hideLabel', '_hideMsg', '_hint', '_label', '_msg', '_name', '_on', '_options', '_orientation', '_required', '_tooltipAlign', '_touched', '_value'],
+                inputs: ['_disabled', '_hideLabel', '_hideMsg', '_hint', '_label', '_msg', '_name', '_on', '_options', '_orientation', '_required', '_tooltipAlign', '_touched', '_value', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputRadio) }
                 ],
@@ -3710,13 +3710,13 @@ export { KolInputRadio };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputRadio, { className: "KolInputRadio", filePath: "components.ts", lineNumber: 1688 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputRadio, { className: "KolInputRadio", filePath: "components.ts", lineNumber: 1695 }); })();
 let KolInputRange = class KolInputRange extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_shortKey', '_step', '_suggestions', '_tooltipAlign', '_touched', '_value'];
+        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_shortKey', '_step', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-input-range';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -3736,9 +3736,9 @@ KolInputRange.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputRange
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _max: "_max", _min: "_min", _msg: "_msg", _name: "_name", _on: "_on", _shortKey: "_shortKey", _step: "_step", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value" }, features: [i0.ɵɵProvidersFeature([
+    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _max: "_max", _min: "_min", _msg: "_msg", _name: "_name", _on: "_on", _shortKey: "_shortKey", _step: "_step", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputRange) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_max", "_min", "_msg", "_name", "_on", "_shortKey", "_step", "_suggestions", "_tooltipAlign", "_touched", "_value", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_max", "_min", "_msg", "_name", "_on", "_shortKey", "_step", "_suggestions", "_tooltipAlign", "_touched", "_value"], [4, "ngTemplateOutlet"]], template: function KolInputRange_Template(rf, ctx) { if (rf & 1) {
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_max", "_min", "_msg", "_name", "_on", "_shortKey", "_step", "_suggestions", "_tooltipAlign", "_touched", "_value", "_variant", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_max", "_min", "_msg", "_name", "_on", "_shortKey", "_step", "_suggestions", "_tooltipAlign", "_touched", "_value", "_variant"], [4, "ngTemplateOutlet"]], template: function KolInputRange_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolInputRange_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolInputRange_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolInputRange_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -3747,7 +3747,7 @@ KolInputRange.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputRange
     } }, encapsulation: 2, changeDetection: 0 });
 KolInputRange = __decorate([
     ProxyCmp({
-        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_shortKey', '_step', '_suggestions', '_tooltipAlign', '_touched', '_value'],
+        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_shortKey', '_step', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'],
         methods: ['focus', 'click', 'getValue']
     })
 ], KolInputRange);
@@ -3760,7 +3760,7 @@ export { KolInputRange };
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_max]="_max" [_min]="_min" [_msg]="_msg" [_name]="_name" [_on]="_on" [_shortKey]="_shortKey" [_step]="_step" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value"
+        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_max]="_max" [_min]="_min" [_msg]="_msg" [_name]="_name" [_on]="_on" [_shortKey]="_shortKey" [_step]="_step" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -3776,7 +3776,7 @@ export { KolInputRange };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_shortKey', '_step', '_suggestions', '_tooltipAlign', '_touched', '_value'],
+                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_max', '_min', '_msg', '_name', '_on', '_shortKey', '_step', '_suggestions', '_tooltipAlign', '_touched', '_value', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputRange) }
                 ],
@@ -3785,13 +3785,13 @@ export { KolInputRange };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputRange, { className: "KolInputRange", filePath: "components.ts", lineNumber: 1760 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputRange, { className: "KolInputRange", filePath: "components.ts", lineNumber: 1768 }); })();
 let KolInputText = class KolInputText extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_spellCheck', '_suggestions', '_tooltipAlign', '_touched', '_type', '_value'];
+        this.availableInputProperties = ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_spellCheck', '_suggestions', '_tooltipAlign', '_touched', '_type', '_value', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-input-text';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -3811,9 +3811,9 @@ KolInputText.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputText,
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hasCounter: "_hasCounter", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _maxLength: "_maxLength", _maxLengthBehavior: "_maxLengthBehavior", _msg: "_msg", _name: "_name", _on: "_on", _pattern: "_pattern", _placeholder: "_placeholder", _readOnly: "_readOnly", _required: "_required", _shortKey: "_shortKey", _smartButton: "_smartButton", _spellCheck: "_spellCheck", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _type: "_type", _value: "_value" }, features: [i0.ɵɵProvidersFeature([
+    } }, inputs: { _accessKey: "_accessKey", _autoComplete: "_autoComplete", _disabled: "_disabled", _hasCounter: "_hasCounter", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _maxLength: "_maxLength", _maxLengthBehavior: "_maxLengthBehavior", _msg: "_msg", _name: "_name", _on: "_on", _pattern: "_pattern", _placeholder: "_placeholder", _readOnly: "_readOnly", _required: "_required", _shortKey: "_shortKey", _smartButton: "_smartButton", _spellCheck: "_spellCheck", _suggestions: "_suggestions", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _type: "_type", _value: "_value", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputText) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_name", "_on", "_pattern", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_spellCheck", "_suggestions", "_tooltipAlign", "_touched", "_type", "_value", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_name", "_on", "_pattern", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_spellCheck", "_suggestions", "_tooltipAlign", "_touched", "_type", "_value"], [4, "ngTemplateOutlet"]], template: function KolInputText_Template(rf, ctx) { if (rf & 1) {
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_autoComplete", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_name", "_on", "_pattern", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_spellCheck", "_suggestions", "_tooltipAlign", "_touched", "_type", "_value", "_variant", 4, "replaceTag"], [3, "_accessKey", "_autoComplete", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_name", "_on", "_pattern", "_placeholder", "_readOnly", "_required", "_shortKey", "_smartButton", "_spellCheck", "_suggestions", "_tooltipAlign", "_touched", "_type", "_value", "_variant"], [4, "ngTemplateOutlet"]], template: function KolInputText_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolInputText_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolInputText_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolInputText_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -3822,8 +3822,8 @@ KolInputText.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolInputText,
     } }, encapsulation: 2, changeDetection: 0 });
 KolInputText = __decorate([
     ProxyCmp({
-        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_spellCheck', '_suggestions', '_tooltipAlign', '_touched', '_type', '_value'],
-        methods: ['getValue', 'focus', 'click', 'selectionStart', 'selectioconEnd', 'setSelectionRange', 'setSelectionStart', 'setRangeText']
+        inputs: ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_spellCheck', '_suggestions', '_tooltipAlign', '_touched', '_type', '_value', '_variant'],
+        methods: ['getValue', 'focus', 'click', 'selectionStart', 'selectionEnd', 'setSelectionRange', 'setSelectionStart', 'setRangeText']
     })
 ], KolInputText);
 export { KolInputText };
@@ -3835,7 +3835,7 @@ export { KolInputText };
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hasCounter]="_hasCounter" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_maxLength]="_maxLength" [_maxLengthBehavior]="_maxLengthBehavior" [_msg]="_msg" [_name]="_name" [_on]="_on" [_pattern]="_pattern" [_placeholder]="_placeholder" [_readOnly]="_readOnly" [_required]="_required" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_spellCheck]="_spellCheck" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_type]="_type" [_value]="_value"
+        [_accessKey]="_accessKey" [_autoComplete]="_autoComplete" [_disabled]="_disabled" [_hasCounter]="_hasCounter" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_maxLength]="_maxLength" [_maxLengthBehavior]="_maxLengthBehavior" [_msg]="_msg" [_name]="_name" [_on]="_on" [_pattern]="_pattern" [_placeholder]="_placeholder" [_readOnly]="_readOnly" [_required]="_required" [_shortKey]="_shortKey" [_smartButton]="_smartButton" [_spellCheck]="_spellCheck" [_suggestions]="_suggestions" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_type]="_type" [_value]="_value" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -3851,7 +3851,7 @@ export { KolInputText };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_spellCheck', '_suggestions', '_tooltipAlign', '_touched', '_type', '_value'],
+                inputs: ['_accessKey', '_autoComplete', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_pattern', '_placeholder', '_readOnly', '_required', '_shortKey', '_smartButton', '_spellCheck', '_suggestions', '_tooltipAlign', '_touched', '_type', '_value', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolInputText) }
                 ],
@@ -3860,7 +3860,7 @@ export { KolInputText };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputText, { className: "KolInputText", filePath: "components.ts", lineNumber: 1837 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolInputText, { className: "KolInputText", filePath: "components.ts", lineNumber: 1846 }); })();
 let KolKolibri = class KolKolibri extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -3934,7 +3934,7 @@ export { KolKolibri };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolKolibri, { className: "KolKolibri", filePath: "components.ts", lineNumber: 1920 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolKolibri, { className: "KolKolibri", filePath: "components.ts", lineNumber: 1930 }); })();
 let KolLink = class KolLink extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4009,7 +4009,7 @@ export { KolLink };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolLink, { className: "KolLink", filePath: "components.ts", lineNumber: 1980 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolLink, { className: "KolLink", filePath: "components.ts", lineNumber: 1990 }); })();
 let KolLinkButton = class KolLinkButton extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4084,7 +4084,7 @@ export { KolLinkButton };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolLinkButton, { className: "KolLinkButton", filePath: "components.ts", lineNumber: 2056 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolLinkButton, { className: "KolLinkButton", filePath: "components.ts", lineNumber: 2066 }); })();
 let KolMeter = class KolMeter extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4158,7 +4158,7 @@ export { KolMeter };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolMeter, { className: "KolMeter", filePath: "components.ts", lineNumber: 2130 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolMeter, { className: "KolMeter", filePath: "components.ts", lineNumber: 2140 }); })();
 let KolModal = class KolModal extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4233,7 +4233,7 @@ export { KolModal };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolModal, { className: "KolModal", filePath: "components.ts", lineNumber: 2197 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolModal, { className: "KolModal", filePath: "components.ts", lineNumber: 2207 }); })();
 let KolNav = class KolNav extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4307,7 +4307,7 @@ export { KolNav };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolNav, { className: "KolNav", filePath: "components.ts", lineNumber: 2258 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolNav, { className: "KolNav", filePath: "components.ts", lineNumber: 2268 }); })();
 let KolPagination = class KolPagination extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4381,7 +4381,7 @@ export { KolPagination };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolPagination, { className: "KolPagination", filePath: "components.ts", lineNumber: 2321 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolPagination, { className: "KolPagination", filePath: "components.ts", lineNumber: 2331 }); })();
 let KolPopoverButton = class KolPopoverButton extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4456,7 +4456,7 @@ export { KolPopoverButton };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolPopoverButton, { className: "KolPopoverButton", filePath: "components.ts", lineNumber: 2390 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolPopoverButton, { className: "KolPopoverButton", filePath: "components.ts", lineNumber: 2400 }); })();
 let KolProgress = class KolProgress extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4530,7 +4530,7 @@ export { KolProgress };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolProgress, { className: "KolProgress", filePath: "components.ts", lineNumber: 2463 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolProgress, { className: "KolProgress", filePath: "components.ts", lineNumber: 2473 }); })();
 let KolQuote = class KolQuote extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4604,13 +4604,13 @@ export { KolQuote };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolQuote, { className: "KolQuote", filePath: "components.ts", lineNumber: 2525 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolQuote, { className: "KolQuote", filePath: "components.ts", lineNumber: 2535 }); })();
 let KolSelect = class KolSelect 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'];
+        this.availableInputProperties = ['_accessKey', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_multiple', '_name', '_on', '_options', '_required', '_rows', '_shortKey', '_tabIndex', '_tooltipAlign', '_touched', '_value', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-select';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -4630,9 +4630,9 @@ KolSelect.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolSelect, select
     } 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([
+    } }, 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", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolSelect) }
-        ]), 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 KolSelect_Template(rf, ctx) { if (rf & 1) {
+        ]), 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", "_variant", 4, "replaceTag"], [3, "_accessKey", "_disabled", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_multiple", "_name", "_on", "_options", "_required", "_rows", "_shortKey", "_tabIndex", "_tooltipAlign", "_touched", "_value", "_variant"], [4, "ngTemplateOutlet"]], template: function KolSelect_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolSelect_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolSelect_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolSelect_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -4641,7 +4641,7 @@ KolSelect.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolSelect, select
     } }, encapsulation: 2, changeDetection: 0 });
 KolSelect = __decorate([
     ProxyCmp({
-        inputs: ['_accessKey', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_multiple', '_name', '_on', '_options', '_required', '_rows', '_shortKey', '_tabIndex', '_tooltipAlign', '_touched', '_value'],
+        inputs: ['_accessKey', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_multiple', '_name', '_on', '_options', '_required', '_rows', '_shortKey', '_tabIndex', '_tooltipAlign', '_touched', '_value', '_variant'],
         methods: ['getValue', 'focus']
     })
 ], KolSelect);
@@ -4654,7 +4654,7 @@ export { KolSelect };
                 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"
+        [_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" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -4670,7 +4670,7 @@ export { KolSelect };
       <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'],
+                inputs: ['_accessKey', '_disabled', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_multiple', '_name', '_on', '_options', '_required', '_rows', '_shortKey', '_tabIndex', '_tooltipAlign', '_touched', '_value', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolSelect) }
                 ],
@@ -4679,13 +4679,13 @@ export { KolSelect };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSelect, { className: "KolSelect", filePath: "components.ts", lineNumber: 2587 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSelect, { className: "KolSelect", filePath: "components.ts", lineNumber: 2597 }); })();
 let KolSingleSelect = class KolSingleSelect 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', '_options', '_placeholder', '_required', '_rows', '_shortKey', '_tooltipAlign', '_touched', '_value'];
+        this.availableInputProperties = ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_options', '_placeholder', '_required', '_rows', '_shortKey', '_tooltipAlign', '_touched', '_value', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-single-select';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -4705,9 +4705,9 @@ KolSingleSelect.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolSingleSe
     } 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", _options: "_options", _placeholder: "_placeholder", _required: "_required", _rows: "_rows", _shortKey: "_shortKey", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value" }, features: [i0.ɵɵProvidersFeature([
+    } }, inputs: { _accessKey: "_accessKey", _disabled: "_disabled", _hasClearButton: "_hasClearButton", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _msg: "_msg", _name: "_name", _on: "_on", _options: "_options", _placeholder: "_placeholder", _required: "_required", _rows: "_rows", _shortKey: "_shortKey", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolSingleSelect) }
-        ]), 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", "_options", "_placeholder", "_required", "_rows", "_shortKey", "_tooltipAlign", "_touched", "_value", 4, "replaceTag"], [3, "_accessKey", "_disabled", "_hasClearButton", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_name", "_on", "_options", "_placeholder", "_required", "_rows", "_shortKey", "_tooltipAlign", "_touched", "_value"], [4, "ngTemplateOutlet"]], template: function KolSingleSelect_Template(rf, ctx) { if (rf & 1) {
+        ]), 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", "_options", "_placeholder", "_required", "_rows", "_shortKey", "_tooltipAlign", "_touched", "_value", "_variant", 4, "replaceTag"], [3, "_accessKey", "_disabled", "_hasClearButton", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_msg", "_name", "_on", "_options", "_placeholder", "_required", "_rows", "_shortKey", "_tooltipAlign", "_touched", "_value", "_variant"], [4, "ngTemplateOutlet"]], template: function KolSingleSelect_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolSingleSelect_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolSingleSelect_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolSingleSelect_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -4716,7 +4716,7 @@ KolSingleSelect.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolSingleSe
     } }, encapsulation: 2, changeDetection: 0 });
 KolSingleSelect = __decorate([
     ProxyCmp({
-        inputs: ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_options', '_placeholder', '_required', '_rows', '_shortKey', '_tooltipAlign', '_touched', '_value'],
+        inputs: ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_options', '_placeholder', '_required', '_rows', '_shortKey', '_tooltipAlign', '_touched', '_value', '_variant'],
         methods: ['getValue', 'focus']
     })
 ], KolSingleSelect);
@@ -4729,7 +4729,7 @@ export { KolSingleSelect };
                 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" [_options]="_options" [_placeholder]="_placeholder" [_required]="_required" [_rows]="_rows" [_shortKey]="_shortKey" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value"
+        [_accessKey]="_accessKey" [_disabled]="_disabled" [_hasClearButton]="_hasClearButton" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_msg]="_msg" [_name]="_name" [_on]="_on" [_options]="_options" [_placeholder]="_placeholder" [_required]="_required" [_rows]="_rows" [_shortKey]="_shortKey" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -4745,7 +4745,7 @@ export { KolSingleSelect };
       <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', '_options', '_placeholder', '_required', '_rows', '_shortKey', '_tooltipAlign', '_touched', '_value'],
+                inputs: ['_accessKey', '_disabled', '_hasClearButton', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_msg', '_name', '_on', '_options', '_placeholder', '_required', '_rows', '_shortKey', '_tooltipAlign', '_touched', '_value', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolSingleSelect) }
                 ],
@@ -4754,7 +4754,7 @@ export { KolSingleSelect };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSingleSelect, { className: "KolSingleSelect", filePath: "components.ts", lineNumber: 2664 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSingleSelect, { className: "KolSingleSelect", filePath: "components.ts", lineNumber: 2675 }); })();
 let KolSkeleton = class KolSkeleton extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4830,7 +4830,7 @@ export { KolSkeleton };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSkeleton, { className: "KolSkeleton", filePath: "components.ts", lineNumber: 2741 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSkeleton, { className: "KolSkeleton", filePath: "components.ts", lineNumber: 2753 }); })();
 let KolSkipNav = class KolSkipNav extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4905,7 +4905,7 @@ export { KolSkipNav };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSkipNav, { className: "KolSkipNav", filePath: "components.ts", lineNumber: 2810 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSkipNav, { className: "KolSkipNav", filePath: "components.ts", lineNumber: 2822 }); })();
 let KolSpin = class KolSpin extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -4979,7 +4979,7 @@ export { KolSpin };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSpin, { className: "KolSpin", filePath: "components.ts", lineNumber: 2869 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSpin, { className: "KolSpin", filePath: "components.ts", lineNumber: 2881 }); })();
 let KolSplitButton = class KolSplitButton extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5054,13 +5054,13 @@ export { KolSplitButton };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSplitButton, { className: "KolSplitButton", filePath: "components.ts", lineNumber: 2930 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolSplitButton, { className: "KolSplitButton", filePath: "components.ts", lineNumber: 2942 }); })();
 let KolTableStateful = class KolTableStateful extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_allowMultiSort', '_data', '_dataFoot', '_fixedCols', '_hasSettingsMenu', '_headers', '_label', '_on', '_pagination', '_paginationPosition', '_selection', '_variant'];
+        this.availableInputProperties = ['_allowMultiSort', '_ariaLabelledby', '_data', '_dataFoot', '_fixedCols', '_hasSettingsMenu', '_headers', '_label', '_on', '_pagination', '_paginationPosition', '_selection', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-table-stateful';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -5080,9 +5080,9 @@ KolTableStateful.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolTableSt
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _allowMultiSort: "_allowMultiSort", _data: "_data", _dataFoot: "_dataFoot", _fixedCols: "_fixedCols", _hasSettingsMenu: "_hasSettingsMenu", _headers: "_headers", _label: "_label", _on: "_on", _pagination: "_pagination", _paginationPosition: "_paginationPosition", _selection: "_selection", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
+    } }, inputs: { _allowMultiSort: "_allowMultiSort", _ariaLabelledby: "_ariaLabelledby", _data: "_data", _dataFoot: "_dataFoot", _fixedCols: "_fixedCols", _hasSettingsMenu: "_hasSettingsMenu", _headers: "_headers", _label: "_label", _on: "_on", _pagination: "_pagination", _paginationPosition: "_paginationPosition", _selection: "_selection", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolTableStateful) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_allowMultiSort", "_data", "_dataFoot", "_fixedCols", "_hasSettingsMenu", "_headers", "_label", "_on", "_pagination", "_paginationPosition", "_selection", "_variant", 4, "replaceTag"], [3, "_allowMultiSort", "_data", "_dataFoot", "_fixedCols", "_hasSettingsMenu", "_headers", "_label", "_on", "_pagination", "_paginationPosition", "_selection", "_variant"], [4, "ngTemplateOutlet"]], template: function KolTableStateful_Template(rf, ctx) { if (rf & 1) {
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_allowMultiSort", "_ariaLabelledby", "_data", "_dataFoot", "_fixedCols", "_hasSettingsMenu", "_headers", "_label", "_on", "_pagination", "_paginationPosition", "_selection", "_variant", 4, "replaceTag"], [3, "_allowMultiSort", "_ariaLabelledby", "_data", "_dataFoot", "_fixedCols", "_hasSettingsMenu", "_headers", "_label", "_on", "_pagination", "_paginationPosition", "_selection", "_variant"], [4, "ngTemplateOutlet"]], template: function KolTableStateful_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolTableStateful_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolTableStateful_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolTableStateful_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -5091,7 +5091,7 @@ KolTableStateful.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolTableSt
     } }, encapsulation: 2, changeDetection: 0 });
 KolTableStateful = __decorate([
     ProxyCmp({
-        inputs: ['_allowMultiSort', '_data', '_dataFoot', '_fixedCols', '_hasSettingsMenu', '_headers', '_label', '_on', '_pagination', '_paginationPosition', '_selection', '_variant'],
+        inputs: ['_allowMultiSort', '_ariaLabelledby', '_data', '_dataFoot', '_fixedCols', '_hasSettingsMenu', '_headers', '_label', '_on', '_pagination', '_paginationPosition', '_selection', '_variant'],
         methods: ['getSelection', 'resetSort']
     })
 ], KolTableStateful);
@@ -5104,7 +5104,7 @@ export { KolTableStateful };
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_allowMultiSort]="_allowMultiSort" [_data]="_data" [_dataFoot]="_dataFoot" [_fixedCols]="_fixedCols" [_hasSettingsMenu]="_hasSettingsMenu" [_headers]="_headers" [_label]="_label" [_on]="_on" [_pagination]="_pagination" [_paginationPosition]="_paginationPosition" [_selection]="_selection" [_variant]="_variant"
+        [_allowMultiSort]="_allowMultiSort" [_ariaLabelledby]="_ariaLabelledby" [_data]="_data" [_dataFoot]="_dataFoot" [_fixedCols]="_fixedCols" [_hasSettingsMenu]="_hasSettingsMenu" [_headers]="_headers" [_label]="_label" [_on]="_on" [_pagination]="_pagination" [_paginationPosition]="_paginationPosition" [_selection]="_selection" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -5120,7 +5120,7 @@ export { KolTableStateful };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_allowMultiSort', '_data', '_dataFoot', '_fixedCols', '_hasSettingsMenu', '_headers', '_label', '_on', '_pagination', '_paginationPosition', '_selection', '_variant'],
+                inputs: ['_allowMultiSort', '_ariaLabelledby', '_data', '_dataFoot', '_fixedCols', '_hasSettingsMenu', '_headers', '_label', '_on', '_pagination', '_paginationPosition', '_selection', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolTableStateful) }
                 ],
@@ -5129,13 +5129,13 @@ export { KolTableStateful };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTableStateful, { className: "KolTableStateful", filePath: "components.ts", lineNumber: 3006 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTableStateful, { className: "KolTableStateful", filePath: "components.ts", lineNumber: 3018 }); })();
 let KolTableStateless = class KolTableStateless extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_data', '_dataFoot', '_fixedCols', '_hasSettingsMenu', '_headerCells', '_label', '_on', '_selection', '_variant'];
+        this.availableInputProperties = ['_ariaLabelledby', '_data', '_dataFoot', '_fixedCols', '_hasSettingsMenu', '_headerCells', '_label', '_on', '_selection', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-table-stateless';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -5155,9 +5155,9 @@ KolTableStateless.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolTableS
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _data: "_data", _dataFoot: "_dataFoot", _fixedCols: "_fixedCols", _hasSettingsMenu: "_hasSettingsMenu", _headerCells: "_headerCells", _label: "_label", _on: "_on", _selection: "_selection", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
+    } }, inputs: { _ariaLabelledby: "_ariaLabelledby", _data: "_data", _dataFoot: "_dataFoot", _fixedCols: "_fixedCols", _hasSettingsMenu: "_hasSettingsMenu", _headerCells: "_headerCells", _label: "_label", _on: "_on", _selection: "_selection", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolTableStateless) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_data", "_dataFoot", "_fixedCols", "_hasSettingsMenu", "_headerCells", "_label", "_on", "_selection", "_variant", 4, "replaceTag"], [3, "_data", "_dataFoot", "_fixedCols", "_hasSettingsMenu", "_headerCells", "_label", "_on", "_selection", "_variant"], [4, "ngTemplateOutlet"]], template: function KolTableStateless_Template(rf, ctx) { if (rf & 1) {
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_ariaLabelledby", "_data", "_dataFoot", "_fixedCols", "_hasSettingsMenu", "_headerCells", "_label", "_on", "_selection", "_variant", 4, "replaceTag"], [3, "_ariaLabelledby", "_data", "_dataFoot", "_fixedCols", "_hasSettingsMenu", "_headerCells", "_label", "_on", "_selection", "_variant"], [4, "ngTemplateOutlet"]], template: function KolTableStateless_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolTableStateless_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolTableStateless_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolTableStateless_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -5166,7 +5166,7 @@ KolTableStateless.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolTableS
     } }, encapsulation: 2, changeDetection: 0 });
 KolTableStateless = __decorate([
     ProxyCmp({
-        inputs: ['_data', '_dataFoot', '_fixedCols', '_hasSettingsMenu', '_headerCells', '_label', '_on', '_selection', '_variant']
+        inputs: ['_ariaLabelledby', '_data', '_dataFoot', '_fixedCols', '_hasSettingsMenu', '_headerCells', '_label', '_on', '_selection', '_variant']
     })
 ], KolTableStateless);
 export { KolTableStateless };
@@ -5178,7 +5178,7 @@ export { KolTableStateless };
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_data]="_data" [_dataFoot]="_dataFoot" [_fixedCols]="_fixedCols" [_hasSettingsMenu]="_hasSettingsMenu" [_headerCells]="_headerCells" [_label]="_label" [_on]="_on" [_selection]="_selection" [_variant]="_variant"
+        [_ariaLabelledby]="_ariaLabelledby" [_data]="_data" [_dataFoot]="_dataFoot" [_fixedCols]="_fixedCols" [_hasSettingsMenu]="_hasSettingsMenu" [_headerCells]="_headerCells" [_label]="_label" [_on]="_on" [_selection]="_selection" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -5194,7 +5194,7 @@ export { KolTableStateless };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_data', '_dataFoot', '_fixedCols', '_hasSettingsMenu', '_headerCells', '_label', '_on', '_selection', '_variant'],
+                inputs: ['_ariaLabelledby', '_data', '_dataFoot', '_fixedCols', '_hasSettingsMenu', '_headerCells', '_label', '_on', '_selection', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolTableStateless) }
                 ],
@@ -5203,7 +5203,7 @@ export { KolTableStateless };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTableStateless, { className: "KolTableStateless", filePath: "components.ts", lineNumber: 3075 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTableStateless, { className: "KolTableStateless", filePath: "components.ts", lineNumber: 3088 }); })();
 let KolTabs = class KolTabs extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5278,13 +5278,13 @@ export { KolTabs };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTabs, { className: "KolTabs", filePath: "components.ts", lineNumber: 3142 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTabs, { className: "KolTabs", filePath: "components.ts", lineNumber: 3156 }); })();
 let KolTextarea = class KolTextarea extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
         this.changeDetectorRef = changeDetectorRef;
         this.z = z;
-        this.availableInputProperties = ['_accessKey', '_adjustHeight', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_placeholder', '_readOnly', '_required', '_resize', '_rows', '_shortKey', '_spellCheck', '_tooltipAlign', '_touched', '_value'];
+        this.availableInputProperties = ['_accessKey', '_adjustHeight', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_placeholder', '_readOnly', '_required', '_resize', '_rows', '_shortKey', '_spellCheck', '_tooltipAlign', '_touched', '_value', '_variant'];
         changeDetectorRef.detach();
         const originalTagName = 'kol-textarea';
         this.tagName = typeof tagNameTransformer === 'function' ? tagNameTransformer(originalTagName) : originalTagName;
@@ -5304,9 +5304,9 @@ KolTextarea.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolTextarea, se
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.replaceTagDirective = _t.first);
-    } }, inputs: { _accessKey: "_accessKey", _adjustHeight: "_adjustHeight", _disabled: "_disabled", _hasCounter: "_hasCounter", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _maxLength: "_maxLength", _maxLengthBehavior: "_maxLengthBehavior", _msg: "_msg", _name: "_name", _on: "_on", _placeholder: "_placeholder", _readOnly: "_readOnly", _required: "_required", _resize: "_resize", _rows: "_rows", _shortKey: "_shortKey", _spellCheck: "_spellCheck", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value" }, features: [i0.ɵɵProvidersFeature([
+    } }, inputs: { _accessKey: "_accessKey", _adjustHeight: "_adjustHeight", _disabled: "_disabled", _hasCounter: "_hasCounter", _hideLabel: "_hideLabel", _hideMsg: "_hideMsg", _hint: "_hint", _icons: "_icons", _label: "_label", _maxLength: "_maxLength", _maxLengthBehavior: "_maxLengthBehavior", _msg: "_msg", _name: "_name", _on: "_on", _placeholder: "_placeholder", _readOnly: "_readOnly", _required: "_required", _resize: "_resize", _rows: "_rows", _shortKey: "_shortKey", _spellCheck: "_spellCheck", _tooltipAlign: "_tooltipAlign", _touched: "_touched", _value: "_value", _variant: "_variant" }, features: [i0.ɵɵProvidersFeature([
             { provide: StencilProxyComponent, useExisting: forwardRef(() => KolTextarea) }
-        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_adjustHeight", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_name", "_on", "_placeholder", "_readOnly", "_required", "_resize", "_rows", "_shortKey", "_spellCheck", "_tooltipAlign", "_touched", "_value", 4, "replaceTag"], [3, "_accessKey", "_adjustHeight", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_name", "_on", "_placeholder", "_readOnly", "_required", "_resize", "_rows", "_shortKey", "_spellCheck", "_tooltipAlign", "_touched", "_value"], [4, "ngTemplateOutlet"]], template: function KolTextarea_Template(rf, ctx) { if (rf & 1) {
+        ]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 5, vars: 2, consts: [["defaultCase", ""], ["ngContentOutlet", ""], ["replaceTagHost", ""], [4, "ngIf", "ngIfElse"], [3, "_accessKey", "_adjustHeight", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_name", "_on", "_placeholder", "_readOnly", "_required", "_resize", "_rows", "_shortKey", "_spellCheck", "_tooltipAlign", "_touched", "_value", "_variant", 4, "replaceTag"], [3, "_accessKey", "_adjustHeight", "_disabled", "_hasCounter", "_hideLabel", "_hideMsg", "_hint", "_icons", "_label", "_maxLength", "_maxLengthBehavior", "_msg", "_name", "_on", "_placeholder", "_readOnly", "_required", "_resize", "_rows", "_shortKey", "_spellCheck", "_tooltipAlign", "_touched", "_value", "_variant"], [4, "ngTemplateOutlet"]], template: function KolTextarea_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵprojectionDef();
         i0.ɵɵdomTemplate(0, KolTextarea_ng_container_0_Template, 2, 1, "ng-container", 3)(1, KolTextarea_ng_template_1_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, KolTextarea_ng_template_3_Template, 1, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     } if (rf & 2) {
@@ -5315,7 +5315,7 @@ KolTextarea.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: KolTextarea, se
     } }, encapsulation: 2, changeDetection: 0 });
 KolTextarea = __decorate([
     ProxyCmp({
-        inputs: ['_accessKey', '_adjustHeight', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_placeholder', '_readOnly', '_required', '_resize', '_rows', '_shortKey', '_spellCheck', '_tooltipAlign', '_touched', '_value'],
+        inputs: ['_accessKey', '_adjustHeight', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_placeholder', '_readOnly', '_required', '_resize', '_rows', '_shortKey', '_spellCheck', '_tooltipAlign', '_touched', '_value', '_variant'],
         methods: ['getValue', 'focus', 'click']
     })
 ], KolTextarea);
@@ -5328,7 +5328,7 @@ export { KolTextarea };
                 template: `
     <ng-container *ngIf="hasTagNameTransformer; else defaultCase">
       <stencil-ng-proxy
-        [_accessKey]="_accessKey" [_adjustHeight]="_adjustHeight" [_disabled]="_disabled" [_hasCounter]="_hasCounter" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_maxLength]="_maxLength" [_maxLengthBehavior]="_maxLengthBehavior" [_msg]="_msg" [_name]="_name" [_on]="_on" [_placeholder]="_placeholder" [_readOnly]="_readOnly" [_required]="_required" [_resize]="_resize" [_rows]="_rows" [_shortKey]="_shortKey" [_spellCheck]="_spellCheck" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value"
+        [_accessKey]="_accessKey" [_adjustHeight]="_adjustHeight" [_disabled]="_disabled" [_hasCounter]="_hasCounter" [_hideLabel]="_hideLabel" [_hideMsg]="_hideMsg" [_hint]="_hint" [_icons]="_icons" [_label]="_label" [_maxLength]="_maxLength" [_maxLengthBehavior]="_maxLengthBehavior" [_msg]="_msg" [_name]="_name" [_on]="_on" [_placeholder]="_placeholder" [_readOnly]="_readOnly" [_required]="_required" [_resize]="_resize" [_rows]="_rows" [_shortKey]="_shortKey" [_spellCheck]="_spellCheck" [_tooltipAlign]="_tooltipAlign" [_touched]="_touched" [_value]="_value" [_variant]="_variant"
         *replaceTag="tagName"
         #replaceTagHost
       >
@@ -5344,7 +5344,7 @@ export { KolTextarea };
       <ng-content></ng-content>
     </ng-template>`,
                 // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                inputs: ['_accessKey', '_adjustHeight', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_placeholder', '_readOnly', '_required', '_resize', '_rows', '_shortKey', '_spellCheck', '_tooltipAlign', '_touched', '_value'],
+                inputs: ['_accessKey', '_adjustHeight', '_disabled', '_hasCounter', '_hideLabel', '_hideMsg', '_hint', '_icons', '_label', '_maxLength', '_maxLengthBehavior', '_msg', '_name', '_on', '_placeholder', '_readOnly', '_required', '_resize', '_rows', '_shortKey', '_spellCheck', '_tooltipAlign', '_touched', '_value', '_variant'],
                 providers: [
                     { provide: StencilProxyComponent, useExisting: forwardRef(() => KolTextarea) }
                 ],
@@ -5353,7 +5353,7 @@ export { KolTextarea };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTextarea, { className: "KolTextarea", filePath: "components.ts", lineNumber: 3207 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTextarea, { className: "KolTextarea", filePath: "components.ts", lineNumber: 3221 }); })();
 let KolToolbar = class KolToolbar extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5428,7 +5428,7 @@ export { KolToolbar };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolToolbar, { className: "KolToolbar", filePath: "components.ts", lineNumber: 3289 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolToolbar, { className: "KolToolbar", filePath: "components.ts", lineNumber: 3304 }); })();
 let KolTree = class KolTree extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5503,7 +5503,7 @@ export { KolTree };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTree, { className: "KolTree", filePath: "components.ts", lineNumber: 3350 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTree, { className: "KolTree", filePath: "components.ts", lineNumber: 3365 }); })();
 let KolTreeItem = class KolTreeItem extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5578,7 +5578,7 @@ export { KolTreeItem };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTreeItem, { className: "KolTreeItem", filePath: "components.ts", lineNumber: 3409 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolTreeItem, { className: "KolTreeItem", filePath: "components.ts", lineNumber: 3424 }); })();
 let KolVersion = class KolVersion extends StencilProxyComponent {
     constructor(changeDetectorRef, r, z) {
         super();
@@ -5652,4 +5652,4 @@ export { KolVersion };
             type: ViewChild,
             args: [ReplaceTagDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolVersion, { className: "KolVersion", filePath: "components.ts", lineNumber: 3470 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(KolVersion, { className: "KolVersion", filePath: "components.ts", lineNumber: 3485 }); })();