@kong/kongponents 9.14.7 → 9.14.8-pr.2497.3a723c8b3.0

package/dist/kongponents.es.js

@@ -1,7 +1,7 @@
 var uh = Object.defineProperty;
 var ch = (e, t, a) => t in e ? uh(e, t, { enumerable: !0, configurable: !0, writable: !0, value: a }) : e[t] = a;
 var Fa = (e, t, a) => ch(e, typeof t != "symbol" ? t + "" : t, a);
-import { defineComponent as se, reactive as fr, ref as E, computed as b, openBlock as h, createBlock as Q, resolveDynamicComponent as Fe, normalizeStyle as Ne, withCtx as O, createElementBlock as $, normalizeClass as ce, renderSlot as q, unref as x, createCommentVNode as H, createElementVNode as z, toDisplayString as ne, withKeys as pt, withModifiers as qe, useSlots as At, useAttrs as Wt, onMounted as st, mergeProps as He, toHandlers as ho, shallowRef as dh, watch as ve, getCurrentScope as vf, onScopeDispose as pf, shallowReadonly as Yn, getCurrentInstance as fh, onUnmounted as Jt, isReadonly as vh, toRefs as hf, watchEffect as bl, useCssVars as Bt, onBeforeUnmount as go, resolveDirective as Lt, withDirectives as ct, createTextVNode as fe, createVNode as V, Transition as ra, vShow as wl, nextTick as gt, Fragment as Te, renderList as Be, resolveComponent as Ot, createSlots as mt, inject as ti, provide as ai, normalizeProps as Rr, toRef as Ci, guardReactiveProps as hs, isRef as Wn, Comment as ph, cloneVNode as hh, onBeforeMount as gh, TransitionGroup as mh, render as wu, h as ku } from "vue";
+import { defineComponent as se, reactive as fr, ref as E, computed as b, openBlock as h, createBlock as Q, resolveDynamicComponent as Fe, normalizeStyle as Ne, withCtx as O, createElementBlock as $, normalizeClass as de, renderSlot as q, unref as x, createCommentVNode as H, createElementVNode as z, toDisplayString as ne, withKeys as pt, withModifiers as qe, useSlots as At, useAttrs as Wt, onMounted as st, mergeProps as He, toHandlers as ho, shallowRef as dh, watch as ve, getCurrentScope as vf, onScopeDispose as pf, shallowReadonly as Yn, getCurrentInstance as fh, onUnmounted as Jt, isReadonly as vh, toRefs as hf, watchEffect as bl, useCssVars as Bt, onBeforeUnmount as go, resolveDirective as Lt, withDirectives as ct, createTextVNode as fe, createVNode as V, Transition as ra, vShow as wl, nextTick as gt, Fragment as Te, renderList as Be, resolveComponent as Ot, createSlots as mt, inject as ti, provide as ai, normalizeProps as Rr, toRef as Ci, guardReactiveProps as hs, isRef as Wn, Comment as ph, cloneVNode as hh, onBeforeMount as gh, TransitionGroup as mh, render as wu, h as ku } from "vue";
 async function gf(e) {
   var n, r;
   if (navigator.clipboard)
@@ -3576,7 +3576,7 @@ const wf = {
       }
     });
     return (n, r) => (h(), $("div", {
-      class: ce(["k-alert", [e.appearance]])
+      class: de(["k-alert", [e.appearance]])
     }, [
       e.showIcon || n.$slots.icon ? (h(), $("div", Og, [
         q(n.$slots, "icon", {}, () => [
@@ -5372,7 +5372,7 @@ const _m = ["aria-labelledby", "x-placement"], Rm = ["tabindex"], Ym = {
                 ref_key: "popoverElement",
                 ref: c,
                 "aria-labelledby": R.$slots.title || e.title ? x(l) : void 0,
-                class: ce(["popover", D.value]),
+                class: de(["popover", D.value]),
                 role: "dialog",
                 style: Ne(x(P)),
                 "x-placement": x(W)
@@ -5400,7 +5400,7 @@ const _m = ["aria-labelledby", "x-placement"], Rm = ["tabindex"], Ym = {
                     R.$slots.title || e.title ? (h(), $("div", {
                       key: 0,
                       id: x(l),
-                      class: ce(["popover-title", { "close-icon-spacing": !e.hideCloseIcon }])
+                      class: de(["popover-title", { "close-icon-spacing": !e.hideCloseIcon }])
                     }, [
                       q(R.$slots, "title", {}, () => [
                         fe(ne(e.title), 1)
@@ -5408,7 +5408,7 @@ const _m = ["aria-labelledby", "x-placement"], Rm = ["tabindex"], Ym = {
                     ], 10, Fm)) : H("", !0)
                   ])) : H("", !0),
                   z("div", {
-                    class: ce(["popover-content", { "close-icon-spacing": !e.hideCloseIcon && !(R.$slots.title || e.title) }])
+                    class: de(["popover-content", { "close-icon-spacing": !e.hideCloseIcon && !(R.$slots.title || e.title) }])
                   }, [
                     q(R.$slots, "content", {}, void 0, !0)
                   ], 2),
@@ -5557,14 +5557,14 @@ const _m = ["aria-labelledby", "x-placement"], Rm = ["tabindex"], Ym = {
     return st(() => {
       s();
     }), (o, u) => (h(), $("div", {
-      class: ce(["k-badge", [e.appearance, { method: a.value }]])
+      class: de(["k-badge", [e.appearance, { method: a.value }]])
     }, [
       (h(), Q(Fe(l.value ? "KTooltip" : "div"), {
         text: l.value ? e.tooltip : void 0
       }, {
         default: O(() => [
           z("div", {
-            class: ce(["badge-content", { "icon-after": !e.iconBefore }])
+            class: de(["badge-content", { "icon-after": !e.iconBefore }])
           }, [
             o.$slots.icon ? q(o.$slots, "icon", { key: 0 }, void 0, !0) : H("", !0),
             z("div", {
@@ -5719,7 +5719,7 @@ const _m = ["aria-labelledby", "x-placement"], Rm = ["tabindex"], Ym = {
   },
   setup(e) {
     return (t, a) => (h(), $("div", {
-      class: ce(["skeleton-box", { [`width-${e.width}`]: !0, [`height-${e.height}`]: !0 }])
+      class: de(["skeleton-box", { [`width-${e.width}`]: !0, [`height-${e.height}`]: !0 }])
     }, null, 2));
   }
 }), ma = /* @__PURE__ */ Ie(i1, [["__scopeId", "data-v-2b6482a1"]]), o1 = { class: "skeleton-loader" }, s1 = /* @__PURE__ */ se({
@@ -5995,7 +5995,7 @@ const _m = ["aria-labelledby", "x-placement"], Rm = ["tabindex"], Ym = {
       }, t.delayMilliseconds);
     }), (n, r) => a.value ? (h(), $("div", {
       key: 0,
-      class: ce(["k-skeleton", { "not-spinner": e.type !== "spinner" }])
+      class: de(["k-skeleton", { "not-spinner": e.type !== "spinner" }])
     }, [
       e.type === "card" ? (h(), Q(p1, {
         key: 0,
@@ -6100,7 +6100,7 @@ const _m = ["aria-labelledby", "x-placement"], Rm = ["tabindex"], Ym = {
       }
     });
     return (r, i) => (h(), $("div", {
-      class: ce(["k-empty-state", [e.iconVariant]])
+      class: de(["k-empty-state", [e.iconVariant]])
     }, [
       z("div", I1, [
         z("div", O1, [
@@ -6246,7 +6246,7 @@ const _m = ["aria-labelledby", "x-placement"], Rm = ["tabindex"], Ym = {
       }
     }));
     return (f, v) => (h(), $("li", {
-      class: ce(["k-dropdown-item", [{
+      class: de(["k-dropdown-item", [{
         "has-divider": e.hasDivider,
         disabled: e.disabled,
         danger: e.danger || e.isDangerous,
@@ -6360,7 +6360,7 @@ const _m = ["aria-labelledby", "x-placement"], Rm = ["tabindex"], Ym = {
         g.length && (u.value = g[0]);
       }
     }), (g, w) => (h(), $("div", {
-      class: ce(["k-dropdown", { "selection-dropdown-menu": e.selectionMenu }])
+      class: de(["k-dropdown", { "selection-dropdown-menu": e.selectionMenu }])
     }, [
       V(x(mo), null, {
         default: O(({ toggle: S, isToggled: m }) => [
@@ -6643,7 +6643,7 @@ const W1 = {
     }), (J, _) => (h(), $("nav", {
       ref_key: "kPaginationElement",
       ref: i,
-      class: ce(["k-pagination", { "page-jump": !e.disablePageJump && !e.offset }]),
+      class: de(["k-pagination", { "page-jump": !e.disablePageJump && !e.offset }]),
       "data-testid": "k-pagination"
     }, [
       e.offset ? (h(), Q(q1, {
@@ -6693,7 +6693,7 @@ const W1 = {
             z("button", {
               "aria-current": le == P.value && "page" || void 0,
               "aria-label": `Go to page ${le}`,
-              class: ce(["pagination-button", { active: le == P.value }]),
+              class: de(["pagination-button", { active: le == P.value }]),
               "data-testid": `page-${le}-button`,
               type: "button",
               onClick: (oe) => I(le)
@@ -6810,7 +6810,7 @@ const W1 = {
       ]),
       default: O(() => [
         z("div", {
-          class: ce({ "multi-line-truncate": e.truncate })
+          class: de({ "multi-line-truncate": e.truncate })
         }, [
           q(r.$slots, "card-body", {}, () => [
             fe(ne(e.item ? e.item.description : ""), 1)
@@ -7179,7 +7179,7 @@ const W1 = {
           ], !0)
         ])) : ct((h(), $("div", {
           key: 5,
-          class: ce(["catalog-page", `card-${e.cardSize}`])
+          class: de(["catalog-page", `card-${e.cardSize}`])
         }, [
           q(G.$slots, "body", { data: c.value }, () => [
             (h(!0), $(Te, null, Be(c.value, (De, Z) => (h(), Q(Hf, {
@@ -7259,7 +7259,7 @@ const W1 = {
     return (i, s) => {
       const l = Lt("bind-once");
       return h(), $("label", {
-        class: ce(["k-label", { required: e.required }])
+        class: de(["k-label", { required: e.required }])
       }, [
         q(i.$slots, "default", {}, void 0, !0),
         n.value ? (h(), Q(wa, He({ key: 0 }, e.tooltipAttributes, {
@@ -7332,10 +7332,10 @@ const W1 = {
     return (w, S) => {
       const m = Lt("bind-once");
       return h(), $("div", {
-        class: ce(["k-checkbox", [w.$attrs.class, f.value]])
+        class: de(["k-checkbox", [w.$attrs.class, f.value]])
       }, [
         z("div", {
-          class: ce(["checkbox-input-wrapper", { "has-label": l.value }])
+          class: de(["checkbox-input-wrapper", { "has-label": l.value }])
         }, [
           ct(z("input", He(d.value, {
             "aria-checked": e.modelValue,
@@ -7500,7 +7500,7 @@ const W1 = {
     }), (T, I) => {
       const N = Lt("bind-once");
       return h(), $("div", {
-        class: ce(["k-input", [T.$attrs.class, { "input-error": m.value || e.error || e.hasError }]])
+        class: de(["k-input", [T.$attrs.class, { "input-error": m.value || e.error || e.hasError }]])
       }, [
         e.label ? ct((h(), Q(vn, He({ key: 0 }, e.labelAttributes, { required: c.value }), mt({
           default: O(() => [
@@ -7519,7 +7519,7 @@ const W1 = {
           [N, { for: x(d) }]
         ]) : H("", !0),
         z("div", {
-          class: ce(["input-element-wrapper", { "has-before-content": T.$slots.before, "has-after-content": T.$slots.after || e.type === "password" && e.showPasswordMaskToggle }])
+          class: de(["input-element-wrapper", { "has-before-content": T.$slots.before, "has-after-content": T.$slots.after || e.type === "password" && e.showPasswordMaskToggle }])
         }, [
           T.$slots.before ? (h(), $("div", {
             key: 0,
@@ -8007,7 +8007,7 @@ const Sy = {
       id: e.id,
       ref_key: "codeBlock",
       ref: g,
-      class: ce(["k-code-block", [`theme-${e.theme}`]]),
+      class: de(["k-code-block", [`theme-${e.theme}`]]),
       "data-testid": "k-code-block",
       tabindex: "-1"
     }, [
@@ -8170,7 +8170,7 @@ const Sy = {
       `))
         ])) : (h(), $("pre", {
           key: 1,
-          class: ce(["highlighted-code-block", {
+          class: de(["highlighted-code-block", {
             "single-line": e.singleLine,
             "show-copy-button": e.showCopyButton
           }]),
@@ -8182,7 +8182,7 @@ const Sy = {
           `)),
             (h(!0), $(Te, null, Be(k.value, (ge) => (h(), $("span", {
               key: ge,
-              class: ce(["line", {
+              class: de(["line", {
                 "line-is-match": m.value.includes(ge),
                 "line-is-highlighted-match": y.value !== null && ge === m.value[y.value]
               }])
@@ -8191,7 +8191,7 @@ const Sy = {
             `)),
               z("a", {
                 id: `${D.value}-L${ge}`,
-                class: ce(["line-anchor", { "hide-links": !e.showLineNumberLinks }]),
+                class: de(["line-anchor", { "hide-links": !e.showLineNumberLinks }]),
                 href: e.showLineNumberLinks ? `#${D.value}-L${ge}` : void 0
               }, ne(ge), 11, Ly),
               ee[9] || (ee[9] = fe(`
@@ -8286,7 +8286,7 @@ const Sy = {
       const w = Lt("bind-once");
       return h(), $("div", zy, [
         z("div", {
-          class: ce(["collapse-heading", { "has-trailing-trigger": o.value }])
+          class: de(["collapse-heading", { "has-trailing-trigger": o.value }])
         }, [
           e.title || v.$slots.title ? (h(), Q(Fe(e.titleTag), {
             key: 0,
@@ -8315,7 +8315,7 @@ const Sy = {
               }, [
                 q(v.$slots, "trigger-content", {}, () => [
                   V(x(Sf), {
-                    class: ce(["collapse-trigger-icon", { "collapse-expanded": !d.value }]),
+                    class: de(["collapse-trigger-icon", { "collapse-expanded": !d.value }]),
                     "data-testid": "collapse-trigger-icon",
                     decorative: "",
                     size: x(Qt)
@@ -16253,7 +16253,7 @@ function kO(e, { slots: t, emit: a }) {
       be(L), ye(L);
     });
   });
-  const de = {
+  const ce = {
     emit: a,
     containerRef: n,
     focusedDay: r,
@@ -16308,7 +16308,7 @@ function kO(e, { slots: t, emit: a }) {
     onDayFocusout: ea,
     onWeeknumberClick: Kt
   };
-  return ai(xp, de), de;
+  return ai(xp, ce), ce;
 }
 function Rn() {
   const e = ti(xp);
@@ -16512,7 +16512,7 @@ const CO = se({
 };
 function SO(e, t, a, n, r, i) {
   return h(), $("div", {
-    class: ce(["vc-popover-content-wrapper", { "is-interactive": e.isInteractive }]),
+    class: de(["vc-popover-content-wrapper", { "is-interactive": e.isInteractive }]),
     ref: "popoverRef",
     onClick: t[0] || (t[0] = (...s) => e.onClick && e.onClick(...s)),
     onMouseover: t[1] || (t[1] = (...s) => e.onMouseOver && e.onMouseOver(...s)),
@@ -16543,7 +16543,7 @@ function SO(e, t, a, n, r, i) {
             fe(ne(e.data), 1)
           ]),
           z("span", {
-            class: ce([
+            class: de([
               "vc-popover-caret",
               `direction-${e.direction}`,
               `align-${e.alignment}`
@@ -16579,7 +16579,7 @@ const fu = /* @__PURE__ */ hn(CO, [["render", SO]]), $O = { class: "vc-day-popov
     return (n, r) => (h(), $("div", $O, [
       x(a) ? (h(), $("div", DO, [
         z("span", {
-          class: ce(x(a).class)
+          class: de(x(a).class)
         }, null, 2)
       ])) : H("", !0),
       z("div", xO, [
@@ -16616,7 +16616,7 @@ const fu = /* @__PURE__ */ hn(CO, [["render", SO]]), $O = { class: "vc-day-popov
     }
     return (o, u) => (h(), Q(fu, {
       id: x(t),
-      class: ce([`vc-${x(n)}`, `vc-${x(a)}`])
+      class: de([`vc-${x(n)}`, `vc-${x(a)}`])
     }, {
       default: O(({ data: { day: c, attributes: d }, hide: f }) => [
         V(la, {
@@ -16771,7 +16771,7 @@ const t8 = /* @__PURE__ */ hn(QO, [["render", e8]]), a8 = /* @__PURE__ */ Object
       }
     }).join(" ") }));
     return (w, S) => (h(), $("div", {
-      class: ce(["vc-header", { "is-lg": e.isLg, "is-xl": e.isXl, "is-2xl": e.is2xl }]),
+      class: de(["vc-header", { "is-lg": e.isLg, "is-xl": e.isXl, "is-2xl": e.is2xl }]),
       style: Ne(x(g))
     }, [
       x(v).prev ? (h(), $("button", {
@@ -17058,7 +17058,7 @@ const l8 = { class: "vc-nav-header" }, u8 = ["disabled"], c8 = ["disabled"], d8
           type: "button",
           "data-id": ye.id,
           "aria-label": ye.ariaLabel,
-          class: ce(["vc-nav-item vc-focus", [
+          class: de(["vc-nav-item vc-focus", [
             ye.isActive ? "is-active" : ye.isCurrent ? "is-current" : ""
           ]]),
           disabled: ye.isDisabled,
@@ -17082,7 +17082,7 @@ const l8 = { class: "vc-nav-header" }, u8 = ["disabled"], c8 = ["disabled"], d8
     const { navPopoverId: t, color: a, displayMode: n } = Rn();
     return (r, i) => (h(), Q(fu, {
       id: x(t),
-      class: ce(["vc-nav-popover-container", `vc-${x(a)}`, `vc-${x(n)}`])
+      class: de(["vc-nav-popover-container", `vc-${x(a)}`, `vc-${x(n)}`])
     }, {
       default: O(({ data: s }) => [
         V(Ep, {
@@ -17238,15 +17238,15 @@ const l8 = { class: "vc-nav-header" }, u8 = ["disabled"], c8 = ["disabled"], d8
 function k8(e, t, a, n, r, i) {
   const s = Ot("CalendarSlot"), l = Lt("popover");
   return h(), $("div", {
-    class: ce(e.dayClasses)
+    class: de(e.dayClasses)
   }, [
     e.hasHighlights ? (h(), $("div", g8, [
       (h(!0), $(Te, null, Be(e.highlights, ({ key: o, wrapperClass: u, class: c, style: d }) => (h(), $("div", {
         key: o,
-        class: ce(u)
+        class: de(u)
       }, [
         z("div", {
-          class: ce(c),
+          class: de(c),
           style: Ne(d)
         }, null, 6)
       ], 2))), 128))
@@ -17273,7 +17273,7 @@ function k8(e, t, a, n, r, i) {
       z("div", y8, [
         (h(!0), $(Te, null, Be(e.dots, ({ key: o, class: u, style: c }) => (h(), $("span", {
           key: o,
-          class: ce(u),
+          class: de(u),
           style: Ne(c)
         }, null, 6))), 128))
       ])
@@ -17282,7 +17282,7 @@ function k8(e, t, a, n, r, i) {
       z("div", w8, [
         (h(!0), $(Te, null, Be(e.bars, ({ key: o, class: u, style: c }) => (h(), $("span", {
           key: o,
-          class: ce(u),
+          class: de(u),
           style: Ne(c)
         }, null, 6))), 128))
       ])
@@ -17297,7 +17297,7 @@ const C8 = /* @__PURE__ */ hn(h8, [["render", k8]]), S8 = { class: "vc-weekdays"
   setup(e) {
     const { page: t } = Mp(), { onWeeknumberClick: a } = Rn();
     return (n, r) => (h(), $("div", {
-      class: ce([
+      class: de([
         "vc-pane",
         `row-${x(t).row}`,
         `row-from-end-${x(t).rowFromEnd}`,
@@ -17312,14 +17312,14 @@ const C8 = /* @__PURE__ */ hn(h8, [["render", k8]]), S8 = { class: "vc-weekdays"
         "hide-arrows": ""
       }, null, 8, ["page"]),
       z("div", {
-        class: ce(["vc-weeks", {
+        class: de(["vc-weeks", {
           [`vc-show-weeknumbers-${x(t).weeknumberPosition}`]: x(t).weeknumberPosition
         }])
       }, [
         z("div", S8, [
           (h(!0), $(Te, null, Be(x(t).weekdays, ({ weekday: i, label: s }, l) => (h(), $("div", {
             key: l,
-            class: ce(`vc-weekday vc-weekday-${i}`)
+            class: de(`vc-weekday vc-weekday-${i}`)
           }, ne(s), 3))), 128))
         ]),
         (h(!0), $(Te, null, Be(x(t).viewWeeks, (i) => (h(), $("div", {
@@ -17328,10 +17328,10 @@ const C8 = /* @__PURE__ */ hn(h8, [["render", k8]]), S8 = { class: "vc-weekdays"
         }, [
           x(t).weeknumberPosition ? (h(), $("div", {
             key: 0,
-            class: ce(["vc-weeknumber", `is-${x(t).weeknumberPosition}`])
+            class: de(["vc-weeknumber", `is-${x(t).weeknumberPosition}`])
           }, [
             z("span", {
-              class: ce(["vc-weeknumber-content"]),
+              class: de(["vc-weeknumber-content"]),
               onClick: (s) => x(a)(i, s)
             }, ne(i.weeknumberDisplay), 9, $8)
           ], 2)) : H("", !0),
@@ -17378,7 +17378,7 @@ function M8(e, t, a, n, r, i) {
       ref: "containerRef"
     }), [
       z("div", {
-        class: ce(["vc-pane-container", { "in-transition": e.inTransition }])
+        class: de(["vc-pane-container", { "in-transition": e.inTransition }])
       }, [
         z("div", A8, [
           e.firstPage ? (h(), Q(s, {
@@ -17881,10 +17881,10 @@ function P8(e, { emit: t, slots: a }) {
       et(u.value, { formatInput: !0 });
     }
   );
-  const de = be(W.value);
+  const ce = be(W.value);
   u.value = nt(
     e.modelValue ?? null,
-    de,
+    ce,
     "dateTime"
   ), st(() => {
     et(e.modelValue, {
@@ -18085,7 +18085,7 @@ const _8 = ["value"], R8 = ["value", "disabled"], Y8 = {
       return n == null ? void 0 : n.label;
     });
     return (n, r) => (h(), $("div", {
-      class: ce(["vc-base-select", {
+      class: de(["vc-base-select", {
         "vc-fit-content": e.fitContent,
         "vc-has-icon": e.showIcon
       }])
@@ -18141,7 +18141,7 @@ const _8 = ["value"], R8 = ["value", "disabled"], Y8 = {
       timeAccuracy: y
     } = n;
     return (k, C) => (h(), $("div", {
-      class: ce(["vc-time-picker", [{ "vc-invalid": !x(i), "vc-attached": !x(v) }]])
+      class: de(["vc-time-picker", [{ "vc-invalid": !x(i), "vc-attached": !x(v) }]])
     }, [
       V(la, { name: "time-header" }, {
         default: O(() => [
@@ -18226,7 +18226,7 @@ const _8 = ["value"], R8 = ["value", "disabled"], Y8 = {
     } = vu(), d = l.value ? [0, 1] : [0];
     return (f, v) => x(s) ? (h(), $("div", {
       key: 0,
-      class: ce(`vc-container vc-bordered vc-${x(n)} vc-${x(r)}`)
+      class: de(`vc-container vc-bordered vc-${x(n)} vc-${x(r)}`)
     }, [
       (h(!0), $(Te, null, Be(x(d), (g) => (h(), Q(qd, {
         key: g,
@@ -18270,7 +18270,7 @@ const _8 = ["value"], R8 = ["value", "disabled"], Y8 = {
     return (u, c) => (h(), Q(fu, {
       id: x(t),
       placement: "bottom-start",
-      class: ce(`vc-date-picker-content vc-${x(a)} vc-${x(n)}`),
+      class: de(`vc-date-picker-content vc-${x(a)} vc-${x(n)}`),
       ref_key: "popoverRef",
       ref: r,
       onBeforeShow: x(i),
@@ -18345,7 +18345,7 @@ const e4 = /* @__PURE__ */ hn(X8, [["render", J8]]), t4 = { class: "k-segmented-
     return (l, o) => (h(), $("div", t4, [
       (h(!0), $(Te, null, Be(r.value, (u) => (h(), $("button", {
         key: `${u.value}-option`,
-        class: ce(["segmented-control-button", [e.size, { selected: a.modelValue === u.value }]]),
+        class: de(["segmented-control-button", [e.size, { selected: a.modelValue === u.value }]]),
         "data-testid": `${u.value}-option`,
         disabled: i(u),
         type: "button",
@@ -18548,7 +18548,7 @@ const e4 = /* @__PURE__ */ hn(X8, [["render", J8]]), t4 = { class: "k-segmented-
       } else
         M.tabName = "custom", P(n.modelValue), ((J = n.modelValue) != null && J.start && ((_ = n.modelValue) != null && _.end) || c.value && ((le = n.modelValue) != null && le.start)) && F();
     }), (X, J) => (h(), $("div", {
-      class: ce(["k-datetime-picker", { "set-min-width": d.value }]),
+      class: de(["k-datetime-picker", { "set-min-width": d.value }]),
       style: Ne(k.value)
     }, [
       V(vr, {
@@ -18646,17 +18646,17 @@ const e4 = /* @__PURE__ */ hn(X8, [["render", J8]]), t4 = { class: "k-segmented-
         ]),
         default: O(() => [
           z("div", {
-            class: ce(["datetime-picker-trigger-wrapper", { disabled: e.disabled }])
+            class: de(["datetime-picker-trigger-wrapper", { disabled: e.disabled }])
           }, [
             z("div", {
-              class: ce(["datetime-picker-trigger", { disabled: e.disabled }]),
+              class: de(["datetime-picker-trigger", { disabled: e.disabled }]),
               "data-testid": "datetime-picker-trigger",
               role: "button",
               style: Ne(k.value),
               tabindex: e.disabled ? -1 : 0
             }, [
               z("span", {
-                class: ce(["datetime-picker-display", { "has-icon": e.icon, disabled: e.disabled }]),
+                class: de(["datetime-picker-display", { "has-icon": e.icon, disabled: e.disabled }]),
                 "data-testid": "datetime-picker-display",
                 innerHTML: M.abbreviatedDisplay
               }, null, 10, c4)
@@ -18786,7 +18786,7 @@ const e4 = /* @__PURE__ */ hn(X8, [["render", J8]]), t4 = { class: "k-segmented-
       z("div", y4, [
         (h(), $("span", {
           key: y.value,
-          class: ce(["file-upload-input-text", { placeholder: !k.value, "has-icon": K.$slots.icon, disabled: e.disabled }])
+          class: de(["file-upload-input-text", { placeholder: !k.value, "has-icon": K.$slots.icon, disabled: e.disabled }])
         }, ne(k.value ? k.value : e.placeholder), 3)),
         (h(), Q(dn, He(x(n).id ? { id: String(x(n).id) } : {}, {
           key: y.value,
@@ -18889,7 +18889,7 @@ const e4 = /* @__PURE__ */ hn(X8, [["render", J8]]), t4 = { class: "k-segmented-
     return (c, d) => {
       const f = Ot("KLabel"), v = Lt("bind-once");
       return h(), $("div", {
-        class: ce(["k-input-switch", [e.size, { "label-before": e.labelBefore, disabled: e.disabled }, c.$attrs.class]])
+        class: de(["k-input-switch", [e.size, { "label-before": e.labelBefore, disabled: e.disabled }, c.$attrs.class]])
       }, [
         ct(z("input", He(l.value, {
           ref_key: "switchInputElement",
@@ -18909,7 +18909,7 @@ const e4 = /* @__PURE__ */ hn(X8, [["render", J8]]), t4 = { class: "k-segmented-
           default: O(() => [
             ct((h(), $("span", {
               "aria-checked": e.modelValue,
-              class: ce(["switch-control", { checked: e.modelValue, disabled: e.disabled }]),
+              class: de(["switch-control", { checked: e.modelValue, disabled: e.disabled }]),
               "data-testid": "switch-control",
               role: "checkbox",
               tabindex: e.disabled ? -1 : 0,
@@ -19787,7 +19787,7 @@ const X4 = {
       z("div", {
         ref_key: "modalWrapperElement",
         ref: o,
-        class: ce(["modal-backdrop", { "modal-full-screen": e.fullScreen && !k.$slots.content }]),
+        class: de(["modal-backdrop", { "modal-full-screen": e.fullScreen && !k.$slots.content }]),
         onClick: C[3] || (C[3] = (D) => g(!1, D))
       }, [
         V(x(J4), {
@@ -19799,7 +19799,7 @@ const X4 = {
         }, {
           default: O(() => [
             z("div", {
-              class: ce(["modal-container", { "custom-content": k.$slots.content }]),
+              class: de(["modal-container", { "custom-content": k.$slots.content }]),
               tabindex: "-1"
             }, [
               q(k.$slots, "content", {}, () => [
@@ -19824,7 +19824,7 @@ const X4 = {
                   ]))
                 ])) : H("", !0),
                 z("div", {
-                  class: ce(["modal-content", { "no-header": !f.value }])
+                  class: de(["modal-content", { "no-header": !f.value }])
                 }, [
                   q(k.$slots, "default", {}, void 0, !0)
                 ], 2),
@@ -19983,7 +19983,7 @@ Docs: https://kongponents.konghq.com/components/modal.html#fullscreen`);
       z("div", {
         ref_key: "modalBodyContent",
         ref: r,
-        class: ce(["k-modal-fullscreen-dialog", { "has-footer": u.$slots["footer-content"] }]),
+        class: de(["k-modal-fullscreen-dialog", { "has-footer": u.$slots["footer-content"] }]),
         tabindex: "0"
       }, [
         z("div", sP, [
@@ -20089,7 +20089,7 @@ Docs: https://kongponents.konghq.com/components/modal.html#fullscreen`);
     }, [
       z("div", $P, [
         z("button", {
-          class: ce({ selected: e.item.selected }),
+          class: de({ selected: e.item.selected }),
           disabled: e.item.disabled === !0 ? !0 : void 0,
           type: "button",
           value: e.item.value,
@@ -20430,28 +20430,28 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
   },
   emits: ["selected", "input", "change", "update:modelValue", "query-change", "item-added", "item-removed"],
   setup(e, { emit: t }) {
-    Bt((de) => ({
-      a7405ef8: nt.value
+    Bt((ce) => ({
+      dcf35ece: nt.value
     }));
     const a = Wt(), n = At(), { getSizeFromString: r, cloneDeep: i, stripRequiredLabel: s } = xt(), l = 36, o = "Filter...", u = e, c = t, d = E(null), f = b(() => a.required !== void 0 && String(a.required) !== "false"), v = b(() => s(u.label, f.value)), g = b(() => {
-      var de, L;
-      return !!((de = u.labelAttributes) != null && de.help || (L = u.labelAttributes) != null && L.info || n["label-tooltip"]);
-    }), w = (de) => Ce.value || Me.value || de != null && de.disabled ? "neutral" : u.error ? "danger" : "info", S = {
+      var ce, L;
+      return !!((ce = u.labelAttributes) != null && ce.help || (L = u.labelAttributes) != null && L.info || n["label-tooltip"]);
+    }), w = (ce) => Ce.value || Me.value || ce != null && ce.disabled ? "neutral" : u.error ? "danger" : "info", S = {
       hideCaret: !0,
       placement: "bottom-start",
       popoverTimeout: 0,
       popoverClasses: "multiselect-popover"
-    }, m = E(0), y = E(0), k = a.id ? String(a.id) : yt(), C = yt(), D = E(null), M = E(null), P = E(null), W = E(), K = b(() => u.selectedRowCount * l), U = E(""), R = b(() => !(!U.value || T.value.filter((de) => de.label === U.value).length)), F = E(null), T = E([]), I = E([]), N = E([]), j = E([]), ae = E([]), X = /* @__PURE__ */ new Set(), J = E([]), _ = E([]), le = b(() => _.value.map((de) => de.label).join(", ")), oe = E(!1), be = E(!1), ye = E(!1), Ce = b(() => (a == null ? void 0 : a.disabled) !== void 0 && String(a == null ? void 0 : a.disabled) !== "false"), Me = b(() => (a == null ? void 0 : a.readonly) !== void 0 && String(a == null ? void 0 : a.readonly) !== "false"), _e = b({
+    }, m = E(0), y = E(0), k = a.id ? String(a.id) : yt(), C = yt(), D = E(null), M = E(null), P = E(null), W = E(), K = b(() => u.selectedRowCount * l), U = E(""), R = b(() => !(!U.value || T.value.filter((ce) => ce.label === U.value).length)), F = E(null), T = E([]), I = E([]), N = E([]), j = E([]), ae = E([]), X = /* @__PURE__ */ new Set(), J = E([]), _ = E([]), le = b(() => _.value.map((ce) => ce.label).join(", ")), oe = E(!1), be = E(!1), ye = E(!1), Ce = b(() => (a == null ? void 0 : a.disabled) !== void 0 && String(a == null ? void 0 : a.disabled) !== "false"), Me = b(() => (a == null ? void 0 : a.readonly) !== void 0 && String(a == null ? void 0 : a.readonly) !== "false"), _e = b({
       get() {
         return u.modelValue;
       },
-      set(de) {
-        const L = T.value.filter((p) => de.includes(p.value));
-        L.length ? pe(L) : de.length || we();
+      set(ce) {
+        const L = T.value.filter((p) => ce.includes(p.value));
+        L.length ? pe(L) : ce.length || we();
       }
     }), Le = b(() => {
-      const de = { ...a };
-      return delete de.class, de;
+      const ce = { ...a };
+      return delete ce.class, ce;
     }), We = b(() => ({
       ...S,
       ...u.kpopAttributes,
@@ -20460,8 +20460,8 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
       maxWidth: wt.value + "px",
       disabled: a.disabled !== void 0 && String(a.disabled) !== "false" || a.readonly !== void 0 && String(a.readonly) !== "false"
     })), nt = b(() => r(u.dropdownMaxHeight)), Ke = b(() => ({ ...We.value })), Ge = b(() => {
-      const de = u.width ? u.width : "300";
-      return r(de);
+      const ce = u.width ? u.width : "300";
+      return r(ce);
     }), et = b(() => ({
       width: Ge.value
     })), tt = b(() => ({
@@ -20474,12 +20474,12 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
           return u.searchPlaceholder;
       }
       return N.value.length === 1 ? `${N.value.length} item selected` : `${N.value.length} items selected`;
-    }), ee = b(() => u.autosuggest ? T.value : u.filterFunction({ items: T.value, query: U.value })), ge = (de) => {
+    }), ee = b(() => u.autosuggest ? T.value : u.filterFunction({ items: T.value, query: U.value })), ge = (ce) => {
       var L;
-      (Ce.value || ((L = de == null ? void 0 : de.target) == null ? void 0 : L.dataset.propagateClicks) === "false") && de.stopPropagation();
-    }, De = async (de, L, p) => {
+      (Ce.value || ((L = ce == null ? void 0 : ce.target) == null ? void 0 : L.dataset.propagateClicks) === "false") && ce.stopPropagation();
+    }, De = async (ce, L, p) => {
       var A, Y;
-      if (de) {
+      if (ce) {
         if (!L.value) {
           U.value = "", p(), te(), await gt();
           const B = (Y = (A = P.value) == null ? void 0 : A.$el) == null ? void 0 : Y.querySelector("input");
@@ -20489,83 +20489,83 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
         L.value && (U.value = "", p());
     }, Z = () => {
       setTimeout(() => {
-        const de = W.value;
+        const ce = W.value;
         if (u.collapsedContext) {
           y.value++;
           return;
         }
-        if (de) {
-          if (de.clientHeight > K.value) {
-            const p = Array.from(de.querySelectorAll(".multiselect-selection-badge")).filter((B) => B.offsetTop >= K.value), A = j.value.length - p.length, Y = j.value.splice(A, p.length);
+        if (ce) {
+          if (ce.clientHeight > K.value) {
+            const p = Array.from(ce.querySelectorAll(".multiselect-selection-badge")).filter((B) => B.offsetTop >= K.value), A = j.value.length - p.length, Y = j.value.splice(A, p.length);
             for (const B of Y)
               X.has(B.value) || (X.add(B.value), ae.value.push(B));
           }
           y.value++;
         }
       }, 0);
-    }, pe = (de) => {
-      de.forEach((L) => {
+    }, pe = (ce) => {
+      ce.forEach((L) => {
         var A;
         const p = ((A = T.value.filter((Y) => Y.value === L.value)) == null ? void 0 : A[0]) || null;
         p.selected = !0, N.value.filter((Y) => Y.value === p.value).length || (N.value.push(p), j.value.push(p));
       }), Z();
-    }, Oe = (de, L = !1) => {
-      const p = new Set(de.map((A) => A.value));
-      N.value = N.value.filter((A) => !p.has(A.value)), j.value = j.value.filter((A) => !p.has(A.value)), ae.value = ae.value.filter((A) => !p.has(A.value)), de.forEach((A) => {
+    }, Oe = (ce, L = !1) => {
+      const p = new Set(ce.map((A) => A.value));
+      N.value = N.value.filter((A) => !p.has(A.value)), j.value = j.value.filter((A) => !p.has(A.value)), ae.value = ae.value.filter((A) => !p.has(A.value)), ce.forEach((A) => {
         if (X.delete(A.value), A.selected = !1, ae.value.length) {
           const Y = ae.value.pop();
           Y && (j.value.push(Y), X.delete(Y.value));
         }
         u.enableItemCreation && A.custom && (T.value = T.value.filter((Y) => Y.value !== A.value), c("item-removed", A));
       }), L && Z();
-    }, Pe = (de, L) => {
+    }, Pe = (ce, L) => {
       var B, ie;
-      let p = !1, A = L ? de : ((B = T.value.filter((ue) => ue.value === de.value)) == null ? void 0 : B[0]) || null;
-      if (u.enableItemCreation && (A != null && A.custom) && (p = !0), A === null && (A = ((ie = N.value.filter((ue) => ue.value === de.value)) == null ? void 0 : ie[0]) || null), A === null)
+      let p = !1, A = L ? ce : ((B = T.value.filter((ue) => ue.value === ce.value)) == null ? void 0 : B[0]) || null;
+      if (u.enableItemCreation && (A != null && A.custom) && (p = !0), A === null && (A = ((ie = N.value.filter((ue) => ue.value === ce.value)) == null ? void 0 : ie[0]) || null), A === null)
         return;
       if (A.selected) {
-        if (N.value = N.value.filter((ue) => ue.value !== de.value), j.value.filter((ue) => ue.value === de.value).length ? j.value = j.value.filter((ue) => ue.value !== de.value) : X.delete(de.value) && (ae.value = ae.value.filter((ue) => ue.value !== de.value)), A.selected = !1, ae.value.length) {
+        if (N.value = N.value.filter((ue) => ue.value !== ce.value), j.value.filter((ue) => ue.value === ce.value).length ? j.value = j.value.filter((ue) => ue.value !== ce.value) : X.delete(ce.value) && (ae.value = ae.value.filter((ue) => ue.value !== ce.value)), A.selected = !1, ae.value.length) {
           const ue = ae.value.pop();
           ue && (j.value.push(ue), X.delete(ue.value));
         }
-        p && (T.value = T.value.filter((ue) => ue.value !== de.value), c("item-removed", de));
+        p && (T.value = T.value.filter((ue) => ue.value !== ce.value), c("item-removed", ce));
       } else
         A.selected = !0, N.value.push(A), j.value.push(A), L && (A.custom = !0, T.value.push(A));
       Z();
       const Y = N.value.map((ue) => ue.value);
       c("selected", N.value), c("change", A), c("update:modelValue", Y);
-    }, $e = () => {
-      !ee.value.length && u.enableItemCreation && Qe();
+    }, $e = (ce) => {
+      !ee.value.length && u.enableItemCreation && Qe(), ce.preventDefault();
     }, Qe = () => {
       var p;
       if (!u.enableItemCreation || !U.value || !R.value || !u.itemCreationValidator(U.value))
         return;
-      const de = T.value.length + 1, L = {
+      const ce = T.value.length + 1, L = {
         label: so(U.value + ""),
         value: yt(),
-        key: `${(p = so(U.value).replace(/ /gi, "-")) == null ? void 0 : p.replace(/[^a-z0-9-_]/gi, "")}-${de}`
+        key: `${(p = so(U.value).replace(/ /gi, "-")) == null ? void 0 : p.replace(/[^a-z0-9-_]/gi, "")}-${ce}`
       };
       c("item-added", L), Pe(L, !0), U.value = "";
     }, te = () => {
-      const de = ee.value.filter((B) => B.selected), L = ee.value.filter((B) => !B.selected), p = [...de, ...L], A = p.filter((B) => !B.group), Y = p.filter((B) => B.group).sort((B, ie) => B.group.toLowerCase().localeCompare(ie.group.toLowerCase()));
+      const ce = ee.value.filter((B) => B.selected), L = ee.value.filter((B) => !B.selected), p = [...ce, ...L], A = p.filter((B) => !B.group), Y = p.filter((B) => B.group).sort((B, ie) => B.group.toLowerCase().localeCompare(ie.group.toLowerCase()));
       I.value = [...A, ...Y];
     }, we = () => {
       T.value.forEach((L) => {
         L.disabled || (L.selected = !1, L.custom && c("item-removed", L));
       }), T.value = T.value.filter((L) => !(L.custom && !L.disabled)), N.value = N.value.filter((L) => L.disabled), j.value = j.value.filter((L) => L.disabled), ae.value = ae.value.filter((L) => (L.disabled || X.delete(L.value), L.disabled)), U.value = "", Z();
-      const de = N.value.map((L) => L.value);
-      c("selected", N.value), c("update:modelValue", de), c("query-change", "");
-    }, Se = (de) => {
-      U.value = de, c("query-change", de);
-    }, Ze = (de, L) => {
+      const ce = N.value.map((L) => L.value);
+      c("selected", N.value), c("update:modelValue", ce), c("query-change", "");
+    }, Se = (ce) => {
+      U.value = ce, c("query-change", ce);
+    }, Ze = (ce, L) => {
       var p;
-      de.keyCode === 27 && (L.value = !1), (de.code === "ArrowDown" || de.code === "ArrowUp") && ((p = d.value) == null || p.setFocus());
+      ce.keyCode === 27 && (L.value = !1), (ce.code === "ArrowDown" || ce.code === "ArrowUp") && ((p = d.value) == null || p.setFocus());
     }, at = () => {
-      var de;
-      (de = F.value) == null || de.showPopover();
-    }, Mt = (de) => {
+      var ce;
+      (ce = F.value) == null || ce.showPopover();
+    }, Mt = (ce) => {
       var L;
-      (de.code === "ArrowDown" || de.code === "ArrowUp") && ((L = d.value) == null || L.setFocus());
+      (ce.code === "ArrowDown" || ce.code === "ArrowUp") && ((L = d.value) == null || L.setFocus());
     }, pa = async () => {
       ye.value = !0, ea();
     }, ea = () => {
@@ -20573,13 +20573,13 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
     };
     ve(y, () => {
       setTimeout(() => {
-        const de = W.value;
+        const ce = W.value;
         if (u.collapsedContext) {
           J.value = i(j.value), _.value = [], m.value++;
           return;
         }
-        if (de)
-          if (de.clientHeight > K.value) {
+        if (ce)
+          if (ce.clientHeight > K.value) {
             const p = j.value.pop();
             p && !X.has(p.value) && (ae.value.push(p), X.add(p.value)), y.value++;
           } else
@@ -20589,18 +20589,18 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
       F.value && typeof F.value.updatePopper == "function" && (await gt(), F.value.updatePopper());
     }), ve(ee, () => {
       te();
-    }), ve(_e, (de, L) => {
-      if (JSON.stringify(de) !== JSON.stringify(L)) {
-        if (!de.length) {
+    }), ve(_e, (ce, L) => {
+      if (JSON.stringify(ce) !== JSON.stringify(L)) {
+        if (!ce.length) {
           we();
           return;
         }
-        const p = new Set(L), A = new Set(de), Y = T.value.filter((ie) => A.has(ie.value)), B = N.value.filter((ie) => !A.has(ie.value) && p.has(ie.value));
+        const p = new Set(L), A = new Set(ce), Y = T.value.filter((ie) => A.has(ie.value)), B = N.value.filter((ie) => !A.has(ie.value) && p.has(ie.value));
         B.length && Oe(B), Y.length && pe(Y);
       }
-    }), ve(() => u.items, (de, L) => {
+    }), ve(() => u.items, (ce, L) => {
       var p, A;
-      if (JSON.stringify(de) !== JSON.stringify(L)) {
+      if (JSON.stringify(ce) !== JSON.stringify(L)) {
         T.value = i(u.items);
         for (let Y = 0; Y < T.value.length; Y++) {
           T.value[Y].selected === void 0 && (T.value[Y].selected = !1);
@@ -20616,17 +20616,17 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
       }
     }, { deep: !0, immediate: !0 });
     const wt = E(300), Rt = async () => {
-      var de;
-      wt.value = 300, await gt(), wt.value = ((de = D.value) == null ? void 0 : de.clientWidth) || 300, Z();
+      var ce;
+      wt.value = 300, await gt(), wt.value = ((ce = D.value) == null ? void 0 : ce.clientWidth) || 300, Z();
     }, Kt = E();
     return st(() => {
       qr("resize", Rt), Kt.value = Pn.create(Rt), Kt.value.observe(D.value);
     }), Jt(() => {
       Kt.value && D.value && Kt.value.unobserve(D.value);
-    }), (de, L) => {
+    }), (ce, L) => {
       const p = Ot("KTooltip"), A = Lt("bind-once");
       return h(), $("div", {
-        class: ce(["k-multiselect", [de.$attrs.class, { "multiselect-error": e.error }]]),
+        class: de(["k-multiselect", [ce.$attrs.class, { "multiselect-error": e.error }]]),
         style: Ne(et.value)
       }, [
         e.label ? ct((h(), Q(vn, He({ key: 0 }, e.labelAttributes, {
@@ -20641,7 +20641,7 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
           g.value ? {
             name: "tooltip",
             fn: O(() => [
-              q(de.$slots, "label-tooltip", {}, void 0, !0)
+              q(ce.$slots, "label-tooltip", {}, void 0, !0)
             ]),
             key: "0"
           } : void 0
@@ -20698,14 +20698,14 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
                         onSelected: Pe
                       }, {
                         content: O(({ item: ie }) => [
-                          q(de.$slots, "item-template", {
+                          q(ce.$slots, "item-template", {
                             class: "multiselect-item",
                             item: ie
                           }, void 0, !0)
                         ]),
                         _: 3
                       }, 8, ["items"]),
-                      e.enableItemCreation && R.value && !de.$slots.empty ? (h(), Q(oo, {
+                      e.enableItemCreation && R.value && !ce.$slots.empty ? (h(), Q(oo, {
                         key: "multiselect-add-item",
                         class: "multiselect-add-item",
                         "data-testid": "multiselect-add-item",
@@ -20720,23 +20720,23 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
                         ]),
                         _: 1
                       }, 8, ["item"])) : H("", !0),
-                      !I.value.length && !de.$slots.empty && !e.enableItemCreation ? (h(), Q(oo, {
+                      !I.value.length && !ce.$slots.empty && !e.enableItemCreation ? (h(), Q(oo, {
                         key: "multiselect-empty-item",
                         class: "multiselect-empty-item",
                         "data-testid": "multiselect-empty-item",
                         item: { label: "No results", value: "no_results", disabled: !0 }
                       })) : H("", !0)
                     ]),
-                    de.$slots.empty && !e.loading && !I.value.length ? (h(), $("div", VP, [
-                      q(de.$slots, "empty", {}, void 0, !0)
+                    ce.$slots.empty && !e.loading && !I.value.length ? (h(), $("div", VP, [
+                      q(ce.$slots, "empty", {}, void 0, !0)
                     ])) : H("", !0)
                   ], 32),
-                  e.dropdownFooterText || de.$slots["dropdown-footer-text"] ? (h(), $("div", {
+                  e.dropdownFooterText || ce.$slots["dropdown-footer-text"] ? (h(), $("div", {
                     key: 0,
-                    class: ce(["dropdown-footer", `dropdown-footer-${e.dropdownFooterTextPosition}`]),
+                    class: de(["dropdown-footer", `dropdown-footer-${e.dropdownFooterTextPosition}`]),
                     "data-testid": "dropdown-footer"
                   }, [
-                    q(de.$slots, "dropdown-footer-text", {}, () => [
+                    q(ce.$slots, "dropdown-footer-text", {}, () => [
                       fe(ne(e.dropdownFooterText), 1)
                     ], !0)
                   ], 2)) : H("", !0)
@@ -20762,7 +20762,7 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
                         ref: M,
                         autocapitalize: "off",
                         autocomplete: "off",
-                        class: ce(["multiselect-input", { "is-readonly": Me.value }]),
+                        class: de(["multiselect-input", { "is-readonly": Me.value }]),
                         "data-testid": "multiselect-input",
                         disabled: Ce.value,
                         "model-value": U.value,
@@ -20915,7 +20915,7 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
       ], 6);
     };
   }
-}), XP = /* @__PURE__ */ Ie(ZP, [["__scopeId", "data-v-65ff2770"]]), JP = {
+}), XP = /* @__PURE__ */ Ie(ZP, [["__scopeId", "data-v-c3146050"]]), JP = {
   key: 0,
   class: "prompt-content"
 }, e7 = { class: "prompt-message" }, t7 = {
@@ -21125,7 +21125,7 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
     return (S, m) => {
       const y = Lt("bind-once");
       return h(), $("div", {
-        class: ce(["k-radio", [
+        class: de(["k-radio", [
           S.$attrs.class ? S.$attrs.class : "",
           w.value
         ]])
@@ -21142,7 +21142,7 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
         ]),
         !e.card && (e.label || S.$slots.default) ? (h(), $("div", {
           key: 0,
-          class: ce(["radio-label-wrapper", { "has-description": o.value }])
+          class: de(["radio-label-wrapper", { "has-description": o.value }])
         }, [
           ct((h(), Q(vn, He(e.labelAttributes, { class: "radio-label" }), mt({
             default: O(() => [
@@ -21169,7 +21169,7 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
           ])) : H("", !0)
         ], 2)) : e.label || S.$slots.default ? (h(), $("label", {
           key: 1,
-          class: ce(["radio-card-wrapper radio-label-wrapper", { "has-label": e.label, "has-description": u.value }]),
+          class: de(["radio-card-wrapper radio-label-wrapper", { "has-label": e.label, "has-description": u.value }]),
           for: x(i),
           tabindex: s.value ? -1 : 0,
           onKeydown: m[0] || (m[0] = pt(qe(() => {
@@ -21217,7 +21217,7 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
     }, [
       z("div", g7, [
         z("button", {
-          class: ce({ selected: e.item.selected }),
+          class: de({ selected: e.item.selected }),
           disabled: e.item.disabled === !0 ? !0 : void 0,
           type: "button",
           value: e.item.value,
@@ -21464,9 +21464,9 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
   emits: ["selected", "input", "change", "update:modelValue", "query-change", "item-added", "item-removed"],
   setup(e, { emit: t }) {
     Bt((Z) => ({
-      a744a2f0: ae.value,
-      "73e08239": T.value,
-      c926d8b2: I.value
+      efaef080: ae.value,
+      "4b613c01": T.value,
+      f0c65122: I.value
     }));
     const { getSizeFromString: a, stripRequiredLabel: n } = xt(), r = e, i = t, s = Wt(), l = At(), o = E(!1), u = E(), c = b(() => {
       var Z;
@@ -21506,8 +21506,8 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
     }), be = (Z) => {
       if (!r.enableFiltering)
         return Z.preventDefault(), !1;
-    }, ye = () => {
-      !oe.value.length && r.enableItemCreation && Ce();
+    }, ye = (Z) => {
+      !oe.value.length && r.enableItemCreation && Ce(), Z.preventDefault();
     }, Ce = () => {
       var Oe, Pe;
       if (!r.enableItemCreation || !C.value || !D.value || !r.itemCreationValidator(C.value))
@@ -21603,7 +21603,7 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
     }), (Z, pe) => {
       const Oe = Lt("bind-once");
       return h(), $("div", {
-        class: ce(["k-select", [Z.$attrs.class]])
+        class: de(["k-select", [Z.$attrs.class]])
       }, [
         e.label ? (h(), Q(vn, He({
           key: 0,
@@ -21747,7 +21747,7 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
                         V(x(ua), { decorative: "" })
                       ])) : H("", !0),
                       V(x(yo), {
-                        class: ce(["chevron-down-icon", { disabled: f.value }]),
+                        class: de(["chevron-down-icon", { disabled: f.value }]),
                         decorative: ""
                       }, null, 8, ["class"])
                     ]),
@@ -21772,7 +21772,7 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
                     default: O(() => [
                       le.value && (!e.enableFiltering || !$e.value) ? (h(), $("div", {
                         key: 0,
-                        class: ce(["custom-selected-item-wrapper", { clearable: e.clearable }])
+                        class: de(["custom-selected-item-wrapper", { clearable: e.clearable }])
                       }, [
                         q(Z.$slots, "selected-item-template", { item: P.value }, () => [
                           q(Z.$slots, "item-template", { item: P.value }, void 0, !0)
@@ -21792,12 +21792,12 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
         }),
         e.help ? (h(), $("p", {
           key: 1,
-          class: ce(["help-text", { "select-error": e.error }])
+          class: de(["help-text", { "select-error": e.error }])
         }, ne(e.help), 3)) : H("", !0)
       ], 2);
     };
   }
-}), I7 = /* @__PURE__ */ Ie(E7, [["__scopeId", "data-v-af36772c"]]), O7 = { class: "k-slideout" }, P7 = { class: "slideout-header" }, N7 = {
+}), I7 = /* @__PURE__ */ Ie(E7, [["__scopeId", "data-v-f830882d"]]), O7 = { class: "k-slideout" }, P7 = { class: "slideout-header" }, N7 = {
   key: 0,
   class: "slideout-title",
   "data-testid": "slideout-title"
@@ -21877,7 +21877,7 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
         default: O(() => [
           e.visible ? (h(), $("div", {
             key: 0,
-            class: ce(["slideout-backdrop", { "backdrop-transparent": !e.hasOverlay }])
+            class: de(["slideout-backdrop", { "backdrop-transparent": !e.hasOverlay }])
           }, null, 2)) : H("", !0)
         ]),
         _: 1
@@ -21946,7 +21946,7 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
       "data-testid": `step-${e.state}`
     }, [
       z("div", {
-        class: ce(["step-container", `${e.state}`])
+        class: de(["step-container", `${e.state}`])
       }, [
         z("div", Y7, [
           e.state === "completed" ? (h(), Q(x(Wh), {
@@ -22569,14 +22569,14 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
     ), { state: Mt, hasData: pa, swrvState: ea } = r(we, Se, at), wt = E(!0), Rt = b(() => ({
       hasData: pa.value,
       state: Mt.value
-    })), Kt = b(() => wt.value ? "loading" : Se.value ? "error" : "success"), { debouncedFn: de, generateDebouncedFn: L } = a(Ze, 500), p = L(0), A = (re) => {
+    })), Kt = b(() => wt.value ? "loading" : Se.value ? "error" : "success"), { debouncedFn: ce, generateDebouncedFn: L } = a(Ze, 500), p = L(0), A = (re) => {
       const { key: me, useSortHandlerFunction: Ue } = re, ke = I.value + "";
       R.value = 1, I.value ? me === I.value ? N.value === "asc" ? N.value = "desc" : N.value = "asc" : (I.value = me, N.value = "asc", ae.value = [null]) : (I.value = me, N.value = "asc", ae.value = [null]), l.clientSort ? Ue && l.sortHandlerFunction ? l.sortHandlerFunction({
         key: me,
         prevKey: ke,
         sortColumnOrder: N.value,
         data: v.value
-      }) : i(me, ke, N.value, v.value) : l.paginationOffset || de(), xe();
+      }) : i(me, ke, N.value, v.value) : l.paginationOffset || ce(), xe();
     }, Y = ({ page: re }) => {
       R.value = re;
     }, B = ({ pageSize: re }) => {
@@ -22627,7 +22627,7 @@ const _P = { "data-testid": "multiselect-container" }, RP = ["tabindex"], YP = {
     const Ra = E(!1);
     return ve([Pe, R, F], async (re, me) => {
       const Ue = me == null ? void 0 : me[0], ke = re[0], dt = re[1];
-      ke !== Ue && dt !== 1 && (R.value = 1, ae.value = [null], j.value = null), _.value && !ee.value && (Ra.value = !0, ke !== "" && ke !== Ue ? await de() : await p(), Ra.value = !1);
+      ke !== Ue && dt !== 1 && (R.value = 1, ae.value = [null], j.value = null), _.value && !ee.value && (Ra.value = !0, ke !== "" && ke !== Ue ? await ce() : await p(), Ra.value = !1);
     }, { deep: !0, immediate: !0 }), ve(D, (re) => {
       re && (W.value = l.tablePreferences.columnVisibility || {});
     }, { immediate: !0 }), st(() => {
@@ -22711,23 +22711,23 @@ Docs: https://kongponents.konghq.com/components/table-data.html`), De();
             onScrollPassive: ie
           }, [
             ct((h(), $("table", {
-              class: ce(["table", {
+              class: de(["table", {
                 "has-hover": e.rowHover,
                 "is-clickable": J.value
               }])
             }, [
               z("thead", {
-                class: ce({ "is-scrolled": U.value })
+                class: de({ "is-scrolled": U.value })
               }, [
                 z("tr", {
                   ref_key: "headerRow",
                   ref: g,
-                  class: ce({ "is-scrolled": U.value })
+                  class: de({ "is-scrolled": U.value })
                 }, [
                   (h(!0), $(Te, null, Be(S.value, (ke, dt) => (h(), $("th", {
                     key: `table-${x(d)}-headers-${dt}`,
                     "aria-sort": e.sortable && ke.key === I.value ? N.value === "asc" ? "ascending" : "descending" : void 0,
-                    class: ce(["table-headers", nt(ke, dt)]),
+                    class: de(["table-headers", nt(ke, dt)]),
                     "data-testid": `table-header-${ke.key}`,
                     style: Ne(We.value[ke.key]),
                     onClick: () => {
@@ -22752,13 +22752,13 @@ Docs: https://kongponents.konghq.com/components/table-data.html`), De();
                     }, null, 40, t9)) : H("", !0),
                     z("div", {
                       "aria-describedby": ke.tooltip || re.$slots[ye(ke.key)] ? `${ye(ke.key)}-${x(d)}` : void 0,
-                      class: ce(["table-headers-container", { resized: m.value === ke.key }])
+                      class: de(["table-headers-container", { resized: m.value === ke.key }])
                     }, [
                       q(re.$slots, be(ke.key), {
                         column: Ce(ke)
                       }, () => [
                         z("span", {
-                          class: ce(["table-header-label", {
+                          class: de(["table-header-label", {
                             "sr-only": ke.hideLabel
                           }])
                         }, ne(ke.label ? ke.label : ke.key), 3)
@@ -22898,12 +22898,12 @@ Docs: https://kongponents.konghq.com/components/table-data.html`), De();
         (h(!0), $(Te, null, Be(e.tabs, (c) => (h(), $("li", {
           id: `${c.hash.replace("#", "")}-tab`,
           key: c.hash,
-          class: ce(["tab-item", { active: r.value === c.hash }])
+          class: de(["tab-item", { active: r.value === c.hash }])
         }, [
           z("div", {
             "aria-controls": e.hidePanels ? void 0 : `panel-${c.hash}`,
             "aria-selected": e.hidePanels ? void 0 : r.value === c.hash ? "true" : "false",
-            class: ce(["tab-link", { "has-panels": !e.hidePanels, disabled: c.disabled }]),
+            class: de(["tab-link", { "has-panels": !e.hidePanels, disabled: c.disabled }]),
             role: "tab",
             tabindex: l(c),
             onClick: qe((d) => c.disabled ? void 0 : i(c.hash), ["prevent"]),
@@ -23028,7 +23028,7 @@ Docs: https://kongponents.konghq.com/components/table-data.html`), De();
     return (C, D) => {
       const M = Lt("bind-once");
       return h(), $("div", {
-        class: ce(["k-textarea", [C.$attrs.class, { "input-error": e.error || e.hasError || S.value }]])
+        class: de(["k-textarea", [C.$attrs.class, { "input-error": e.error || e.hasError || S.value }]])
       }, [
         e.label ? ct((h(), Q(vn, He({ key: 0 }, e.labelAttributes, { required: l.value }), mt({
           default: O(() => [
@@ -23118,7 +23118,7 @@ Docs: https://kongponents.konghq.com/components/table-data.html`), De();
       default: O(() => [
         (h(!0), $(Te, null, Be(e.toasterState, (r) => (h(), $("div", {
           key: r.key,
-          class: ce(["toaster", `${r.appearance}`]),
+          class: de(["toaster", `${r.appearance}`]),
           role: "alert"
         }, [
           z("div", y9, [
@@ -24765,7 +24765,7 @@ const dN = {
       l.target && l.target.closest("a:not(.disabled), button:not([data-tree-item-trigger]), label, input, select") !== null || n("selected", a.item);
     };
     return (l, o) => (h(), $("button", {
-      class: ce(["tree-item", {
+      class: de(["tree-item", {
         "not-draggable": e.disabled,
         selected: e.item.selected
       }]),
@@ -24893,7 +24893,7 @@ const dN = {
         default: O(() => [
           (h(!0), $(Te, null, Be(i.value, (D) => (h(), $("div", {
             key: D.id,
-            class: ce(["tree-item-container", {
+            class: de(["tree-item-container", {
               "has-no-children": o(D)
             }])
           }, [
@@ -25171,7 +25171,7 @@ const dN = {
       return h(), $("div", {
         ref_key: "kTruncateWrapper",
         ref: l,
-        class: ce(["k-truncate", [n.value ? "expanded" : "", `truncate-${e.truncateText ? "text" : "content"}`]]),
+        class: de(["k-truncate", [n.value ? "expanded" : "", `truncate-${e.truncateText ? "text" : "content"}`]]),
         style: Ne(S.value)
       }, [
         !e.truncateText && r.value ? (h(), $("div", xN, [
@@ -25369,11 +25369,11 @@ const dN = {
       return h(), $("div", NN, [
         e.badge && e.badgeLabel ? (h(), $("span", BN, ne(e.badgeLabel), 1)) : H("", !0),
         z("div", {
-          class: ce(["copy-container", { "copy-element": e.truncate || e.badge, "badge-styles": e.badge }])
+          class: de(["copy-container", { "copy-element": e.truncate || e.badge, "badge-styles": e.badge }])
         }, [
           e.format !== "hidden" ? (h(), Q(wa, {
             key: 0,
-            class: ce([s.value]),
+            class: de([s.value]),
             "data-testid": "copy-tooltip-wrapper",
             "max-width": "500px",
             placement: "bottom-start",
@@ -25383,7 +25383,7 @@ const dN = {
               z("div", {
                 ref_key: "copyTextElement",
                 ref: f,
-                class: ce(["copy-text", { monospace: e.monospace || !e.badge }])
+                class: de(["copy-text", { monospace: e.monospace || !e.badge }])
               }, ne(l.value), 3)
             ]),
             _: 1
@@ -25733,7 +25733,7 @@ const dN = {
     const Rt = E(!1), Kt = b(() => {
       const p = N.value.filter((A) => !A.disabled && a.data.find((Y) => o(Y) === A.rowKey));
       return !!p.filter((A) => A.selected).length && !!p.filter((A) => !A.selected).length;
-    }), de = (p) => {
+    }), ce = (p) => {
       N.value.forEach((A) => {
         a.data.find((Y) => o(Y) === A.rowKey) && !A.disabled && (A.selected = p);
       });
@@ -25771,7 +25771,7 @@ const dN = {
     }), (p, A) => {
       const Y = Lt("bind-once");
       return h(), $("div", {
-        class: ce(["k-table-view", { "hide-headers": p.hideHeaders }])
+        class: de(["k-table-view", { "hide-headers": p.hideHeaders }])
       }, [
         U.value ? (h(), $("div", HN, [
           q(p.$slots, "toolbar", {}, void 0, !0),
@@ -25865,24 +25865,24 @@ const dN = {
             onScrollPassive: ge
           }, [
             ct((h(), $("table", {
-              class: ce(["table", {
+              class: de(["table", {
                 "has-hover": p.rowHover && !R.value,
                 "is-clickable": K.value
               }])
             }, [
               p.hideHeaders ? H("", !0) : (h(), $("thead", {
                 key: 0,
-                class: ce({ "is-scrolled": D.value })
+                class: de({ "is-scrolled": D.value })
               }, [
                 z("tr", {
                   ref_key: "headerRow",
                   ref: u,
-                  class: ce({ "is-scrolled": D.value })
+                  class: de({ "is-scrolled": D.value })
                 }, [
                   (h(!0), $(Te, null, Be(d.value, (B, ie) => (h(), $("th", {
                     key: `table-${x(s)}-headers-${B.key}`,
                     "aria-sort": B.key === P.value ? W.value === "asc" ? "ascending" : "descending" : void 0,
-                    class: ce(["table-headers", Le(B, ie)]),
+                    class: de(["table-headers", Le(B, ie)]),
                     "data-key": B.key,
                     "data-testid": `table-header-${B.key}`,
                     style: Ne(_e.value[B.key]),
@@ -25901,14 +25901,14 @@ const dN = {
                     }, null, 40, jN)) : H("", !0),
                     z("div", {
                       "aria-describedby": B.tooltip || p.$slots[_(B.key)] ? `${_(B.key)}-${x(s)}` : void 0,
-                      class: ce(["table-headers-container", { resized: f.value === B.key }])
+                      class: de(["table-headers-container", { resized: f.value === B.key }])
                     }, [
                       B.key !== x(Xe).BULK_ACTIONS ? q(p.$slots, J(B.key), {
                         key: 0,
                         column: le(B)
                       }, () => [
                         z("span", {
-                          class: ce(["table-header-label", {
+                          class: de(["table-header-label", {
                             "sr-only": B.hideLabel || B.key === x(Xe).ACTIONS && B.hideLabel !== !1
                           }])
                         }, ne(B.label ? B.label : B.key), 3)
@@ -25920,7 +25920,7 @@ const dN = {
                           class: "table-header-bulk-actions-checkbox",
                           "data-testid": "table-header-bulk-actions-checkbox",
                           indeterminate: Kt.value,
-                          onChange: de
+                          onChange: ce
                         }, null, 8, ["modelValue", "indeterminate"])
                       ])),
                       B.tooltip || p.$slots[_(B.key)] ? (h(), Q(wa, {
@@ -26054,7 +26054,7 @@ const dN = {
                           "aria-controls": `table-${x(s)}-row-${ie}-expandable-content`,
                           "aria-expanded": at.value.includes(ie),
                           "aria-label": "Toggle row expandable content",
-                          class: ce(["expandable-row-control", { expanded: at.value.includes(ie) }]),
+                          class: de(["expandable-row-control", { expanded: at.value.includes(ie) }]),
                           "data-testid": "expandable-row-control",
                           type: "button",
                           onClick: (rt) => Mt(ie, B)