wave-ui 3.4.2 → 3.4.4

package/dist/wave-ui.es.js

@@ -9,7 +9,7 @@ var X = (e, t, l) => (ne(e, t, "read from private field"), l ? l.call(e) : t.get
     throw TypeError("Cannot add the same private member more than once");
   t instanceof WeakSet ? t.add(e) : t.set(e, l);
 }, te = (e, t, l, a) => (ne(e, t, "write to private field"), a ? a.call(e, l) : t.set(e, l), l);
-import { reactive as Q, resolveComponent as $, openBlock as s, createBlock as m, Teleport as _e, createVNode as I, TransitionGroup as ae, normalizeClass as f, withCtx as g, createElementBlock as u, Fragment as k, renderList as L, mergeProps as C, createElementVNode as w, createCommentVNode as c, createApp as Ce, defineComponent as Se, inject as Be, withKeys as E, withModifiers as M, renderSlot as p, toHandlers as W, createTextVNode as S, toDisplayString as _, Transition as O, normalizeStyle as R, resolveDynamicComponent as V, normalizeProps as ie, resolveDirective as me, withDirectives as N, createSlots as Z, vShow as oe, vModelText as be, vModelDynamic as $e, KeepAlive as Ve } from "vue";
+import { reactive as Q, resolveComponent as $, openBlock as s, createBlock as m, Teleport as _e, createVNode as I, TransitionGroup as ae, normalizeClass as f, withCtx as g, createElementBlock as u, Fragment as k, renderList as L, mergeProps as C, createElementVNode as w, createCommentVNode as c, createApp as Ce, defineComponent as Se, inject as Be, withKeys as E, withModifiers as M, renderSlot as p, toHandlers as W, createTextVNode as S, toDisplayString as _, Transition as O, normalizeStyle as T, resolveDynamicComponent as V, normalizeProps as ie, resolveDirective as me, withDirectives as N, createSlots as Z, vShow as oe, vModelText as be, vModelDynamic as $e, KeepAlive as Ve } from "vue";
 const Ie = Q({
   on: "#app",
   breakpoints: {
@@ -60,8 +60,8 @@ const Ie = Q({
       typeof a == "object" ? ye(e[l], t[l]) : t[l] = a;
     }
   return t;
-}, Te = ["innerHTML"];
-function Re(e, t, l, a, r, i) {
+}, Re = ["innerHTML"];
+function Te(e, t, l, a, r, i) {
   const o = $("w-alert");
   return s(), m(_e, { to: ".w-app" }, [
     I(ae, {
@@ -82,7 +82,7 @@ function Re(e, t, l, a, r, i) {
             default: g(() => [
               w("div", {
                 innerHTML: n.message
-              }, null, 8, Te)
+              }, null, 8, Re)
             ]),
             _: 2
           }, 1040, ["modelValue", "onUpdate:modelValue", "onClose"])) : c("", !0)
@@ -117,7 +117,7 @@ const v = (e, t) => {
       return i.dismiss && (i.dismiss = !0), i;
     }
   }
-}, xe = /* @__PURE__ */ v(Le, [["render", Re]]);
+}, xe = /* @__PURE__ */ v(Le, [["render", Te]]);
 var H;
 const F = class {
   constructor() {
@@ -558,8 +558,8 @@ const ze = (e) => {
   for (const b in y)
     l[b] = y[b];
   let B = "";
-  return Object.entries(l).forEach(([b, T]) => {
-    B += `--w-${b}-color: ${T};`;
+  return Object.entries(l).forEach(([b, R]) => {
+    B += `--w-${b}-color: ${R};`;
   }), `:root{${B}}${t}`;
 }, Me = (e, t) => {
   let l = "";
@@ -1056,7 +1056,7 @@ function st(e, t, l, a, r, i) {
         l.modelValue ? (s(), u("div", {
           key: 0,
           class: f(["w-badge", i.classes]),
-          style: R(i.styles),
+          style: T(i.styles),
           "aria-atomic": "true",
           "aria-label": "Badge",
           "aria-live": "polite",
@@ -1554,7 +1554,7 @@ const _t = {
   /* @__PURE__ */ w("polyline", { points: "1 5 4 8 10 2" })
 ], -1), It = [
   Vt
-], Tt = ["for"], Rt = ["for", "innerHTML"];
+], Rt = ["for"], Tt = ["for", "innerHTML"];
 function Lt(e, t, l, a, r, i) {
   return s(), m(V(e.formRegister && !i.wCheckboxes ? "w-form-element" : "div"), C({ ref: "formEl" }, e.formRegister && { validators: e.validators, inputValue: r.isChecked, disabled: e.isDisabled }, {
     valid: e.valid,
@@ -1612,12 +1612,12 @@ function Lt(e, t, l, a, r, i) {
           p(e.$slots, "default", {}, () => [
             S(_(l.label), 1)
           ])
-        ], 10, Tt)) : l.label ? (s(), u("label", {
+        ], 10, Rt)) : l.label ? (s(), u("label", {
           key: 1,
           class: f(["w-checkbox__label w-form-el-shakable pl2", e.labelClasses]),
           for: `w-checkbox--${e._.uid}`,
           innerHTML: l.label
-        }, null, 10, Rt)) : c("", !0)
+        }, null, 10, Tt)) : c("", !0)
       ], 64)) : c("", !0)
     ]),
     _: 3
@@ -1939,7 +1939,7 @@ const At = {
 function Kt(e, t, l, a, r, i) {
   return s(), u("div", {
     class: f(["w-date-picker", i.classes]),
-    style: R(i.styles)
+    style: T(i.styles)
   }, [
     p(e.$slots, "default")
   ], 6);
@@ -1991,7 +1991,7 @@ function Ft(e, t, l, a, r, i) {
             "title-class": l.titleClass,
             "content-class": l.contentClass,
             title: l.title || void 0,
-            style: R(i.contentStyles)
+            style: T(i.contentStyles)
           }, Z({
             default: g(() => [
               p(e.$slots, "default")
@@ -2129,7 +2129,7 @@ function Qt(e, t, l, a, r, i) {
     l.pushContent ? (s(), u("div", {
       key: 0,
       class: "w-drawer-wrap__track",
-      style: R(i.trackStyles)
+      style: T(i.trackStyles)
     }, [
       w("div", Jt, [
         l.noOverlay ? c("", !0) : (s(), m(o, {
@@ -2154,7 +2154,7 @@ function Qt(e, t, l, a, r, i) {
             key: 0,
             class: f(["w-drawer", i.drawerClasses]),
             ref: "drawer",
-            style: R(i.styles)
+            style: T(i.styles)
           }, {
             default: g(() => [
               p(e.$slots, "default")
@@ -2186,7 +2186,7 @@ function Qt(e, t, l, a, r, i) {
             key: 0,
             class: f(["w-drawer", i.drawerClasses]),
             ref: "drawer",
-            style: R(i.styles)
+            style: T(i.styles)
           }, {
             default: g(() => [
               p(e.$slots, "default")
@@ -2710,7 +2710,7 @@ function wl(e, t, l, a, r, i) {
   const o = $("w-progress");
   return s(), m(V(i.wrapperTag), {
     class: f(["w-image-wrap", i.wrapperClasses]),
-    style: R(i.wrapperStyles)
+    style: T(i.wrapperStyles)
   }, {
     default: g(() => [
       I(O, {
@@ -2721,7 +2721,7 @@ function wl(e, t, l, a, r, i) {
           r.loaded ? (s(), m(V(l.tag), {
             key: 0,
             class: f(["w-image", i.imageClasses]),
-            style: R(i.imageStyles),
+            style: T(i.imageStyles),
             src: l.tag === "img" ? r.imgSrc : null
           }, null, 8, ["class", "style", "src"])) : c("", !0)
         ]),
@@ -2846,7 +2846,7 @@ const vl = {
 }, kl = /* @__PURE__ */ v(vl, [["render", wl]]), _l = ["name"], Cl = ["for"], Sl = ["id", "type", "name", "placeholder", "step", "min", "max", "minlength", "maxlength", "readonly", "aria-readonly", "disabled", "required", "tabindex"], Bl = ["id", "name", "multiple", "data-progress"], $l = {
   class: "w-input__no-file",
   key: "no-file"
-}, Vl = ["for"], Il = ["for"], Tl = ["src"], Rl = ["for"];
+}, Vl = ["for"], Il = ["for"], Rl = ["src"], Tl = ["for"];
 function Ll(e, t, l, a, r, i) {
   const o = $("w-icon"), n = $("w-progress");
   return s(), m(V(e.formRegister ? "w-form-element" : "div"), C({ ref: "formEl" }, e.formRegister && { validators: e.validators, inputValue: r.inputValue, disabled: e.isDisabled, readonly: e.isReadonly, isFocused: r.isFocused }, {
@@ -3004,7 +3004,7 @@ function Ll(e, t, l, a, r, i) {
               key: `${h}b`,
               src: d.preview,
               alt: ""
-            }, null, 8, Tl)) : (s(), u("i", {
+            }, null, 8, Rl)) : (s(), u("i", {
               class: f(["w-icon w-input__file-preview primary size--md", l.preview && typeof l.preview == "string" ? l.preview : "wi-file"]),
               key: `${h}c`
             }, null, 2))
@@ -3019,7 +3019,7 @@ function Ll(e, t, l, a, r, i) {
             p(e.$slots, "default", {}, () => [
               S(_(l.label), 1)
             ])
-          ], 10, Rl)) : c("", !0)
+          ], 10, Tl)) : c("", !0)
         ], 64)) : c("", !0)
       ], 64))
     ]),
@@ -3799,7 +3799,7 @@ function Nl(e, t, l, a, r, i) {
       r.show ? (s(), u("div", {
         key: 0,
         class: f(["w-notification", i.classes]),
-        style: R(i.styles)
+        style: T(i.styles)
       }, [
         I(o, C(i.alertProps, {
           class: i.alertClasses,
@@ -3950,7 +3950,7 @@ function Dl(e, t, l, a, r, i) {
         key: 0,
         class: f(["w-overlay", i.classes]),
         ref: "overlay",
-        style: R(l.modelValue && i.styles || null),
+        style: T(l.modelValue && i.styles || null),
         onKeydown: t[0] || (t[0] = E(M((...n) => i.onClick && i.onClick(...n), ["stop"]), ["escape"])),
         onClick: t[1] || (t[1] = (...n) => i.onClick && i.onClick(...n)),
         tabindex: "0"
@@ -4031,7 +4031,7 @@ const Xl = {
 function Zl(e, t, l, a, r, i) {
   return s(), u("div", {
     class: f(["w-progress", i.classes]),
-    style: R(i.styles)
+    style: T(i.styles)
   }, [
     l.circle ? (s(), u("svg", {
       key: 1,
@@ -4056,12 +4056,12 @@ function Zl(e, t, l, a, r, i) {
         "stroke-width": l.stroke,
         "stroke-linecap": l.roundCap && "round",
         "stroke-dasharray": e.circleCircumference,
-        style: R(`stroke-dashoffset: ${(1 - i.progressValue / 100) * e.circleCircumference}`)
+        style: T(`stroke-dashoffset: ${(1 - i.progressValue / 100) * e.circleCircumference}`)
       }, null, 12, Ql)
     ], 8, Gl)) : (s(), u("div", {
       key: 0,
       class: f(["w-progress__progress", { full: i.progressValue === 100 }]),
-      style: R(`width: ${i.progressValue}%`)
+      style: T(`width: ${i.progressValue}%`)
     }, null, 6)),
     l.label || e.$slots.default ? (s(), u("div", {
       key: 2,
@@ -4393,7 +4393,7 @@ function yi(e, t, l, a, r, i) {
             class: f(["w-icon", `${l.icon} ${l.color}`]),
             role: "icon",
             "aria-hidden": "true",
-            style: R(i.halfStarStyle)
+            style: T(i.halfStarStyle)
           }, null, 6)) : c("", !0)
         ], 42, bi)
       ], 64))), 128))
@@ -4511,7 +4511,7 @@ function ki(e, t, l, a, r, i) {
       w("div", {
         class: "w-scrollbar__thumb",
         ref: "thumb",
-        style: R(i.thumbStyles)
+        style: T(i.thumbStyles)
       }, null, 4)
     ], 34)
   ], 64);
@@ -4634,12 +4634,12 @@ const _i = {
 }, Si = /* @__PURE__ */ v(Ci, [["render", ki]]), Bi = ["for"], $i = ["aria-expanded", "aria-owns", "aria-activedescendant"], Vi = {
   key: 1,
   class: "w-select__selection-slot"
-}, Ii = ["contenteditable", "id", "disabled", "tabindex", "innerHTML"], Ti = ["value", "name"], Ri = ["for"], Li = ["for"];
+}, Ii = ["contenteditable", "id", "disabled", "tabindex", "innerHTML"], Ri = ["value", "name"], Ti = ["for"], Li = ["for"];
 function xi(e, t, l, a, r, i) {
   const o = $("w-icon"), n = $("w-list"), d = $("w-menu");
-  return s(), m(V(e.formRegister ? "w-form-element" : "div"), C({ ref: "formEl" }, e.formRegister && { validators: e.validators, inputValue: i.selectionString, disabled: e.isDisabled, readonly: e.isReadonly }, {
+  return s(), m(V(e.formRegister ? "w-form-element" : "div"), C({ ref: "formEl" }, e.formRegister && { validators: e.validators, inputValue: i.selectionString, disabled: e.isDisabled, readonly: e.isReadonly, isFocused: e.isFocused }, {
     valid: e.valid,
-    "onUpdate:valid": t[9] || (t[9] = (h) => e.valid = h),
+    "onUpdate:valid": t[11] || (t[11] = (h) => e.valid = h),
     onReset: i.onReset,
     wrap: i.hasLabel && l.labelPosition !== "inside",
     class: i.classes
@@ -4658,7 +4658,8 @@ function xi(e, t, l, a, r, i) {
       ], 64)) : c("", !0),
       I(d, C({
         modelValue: e.showMenu,
-        "onUpdate:modelValue": t[8] || (t[8] = (h) => e.showMenu = h),
+        "onUpdate:modelValue": t[9] || (t[9] = (h) => e.showMenu = h),
+        onClose: t[10] || (t[10] = (h) => !h && i.closeMenu()),
         "menu-class": `w-select__menu ${l.menuClass || ""}`,
         transition: "slide-fade-down",
         "append-to": (l.menuProps || {}).appendTo !== void 0 ? (l.menuProps || {}).appendTo : void 0,
@@ -4669,7 +4670,7 @@ function xi(e, t, l, a, r, i) {
         activator: g(({ on: h }) => [
           w("div", {
             class: f(["w-select__selection-wrap", i.inputWrapClasses]),
-            onClick: t[5] || (t[5] = (y) => !e.isDisabled && !e.isReadonly && (e.showMenu ? i.closeMenu : i.openMenu)()),
+            onClick: t[5] || (t[5] = (y) => !e.isDisabled && !e.isReadonly && i.onInputFieldClick()),
             role: "button",
             "aria-haspopup": "listbox",
             "aria-expanded": e.showMenu ? "true" : "false",
@@ -4711,7 +4712,7 @@ function xi(e, t, l, a, r, i) {
               type: "hidden",
               value: y.value === void 0 ? "" : y.value.toString(),
               name: e.inputName + (l.multiple ? "[]" : "")
-            }, null, 8, Ti))), 128)),
+            }, null, 8, Ri))), 128)),
             l.labelPosition === "inside" && i.showLabelInside ? (s(), u(k, { key: 2 }, [
               e.$slots.default || l.label ? (s(), u("label", {
                 key: 0,
@@ -4721,7 +4722,7 @@ function xi(e, t, l, a, r, i) {
                 p(e.$slots, "default", {}, () => [
                   S(_(l.label), 1)
                 ])
-              ], 10, Ri)) : c("", !0)
+              ], 10, Ti)) : c("", !0)
             ], 64)) : c("", !0),
             l.innerIconRight ? (s(), m(o, {
               key: 3,
@@ -4743,8 +4744,8 @@ function xi(e, t, l, a, r, i) {
             "onUpdate:modelValue": i.onInput,
             onItemClick: t[6] || (t[6] = (h) => e.$emit("item-click", h)),
             onItemSelect: i.onListItemSelect,
-            "onKeydown:enter": t[7] || (t[7] = (h) => l.noUnselect && !l.multiple && i.closeMenu()),
-            "onKeydown:escape": i.closeMenu,
+            "onKeydown:enter": t[7] || (t[7] = (h) => l.noUnselect && !l.multiple && i.closeMenu("la3")),
+            "onKeydown:escape": t[8] || (t[8] = (h) => e.showMenu && (this.showMenu = !1)),
             items: i.selectItems,
             multiple: l.multiple,
             "arrows-navigation": "",
@@ -4776,7 +4777,7 @@ function xi(e, t, l, a, r, i) {
                 ])
               ])
             }))
-          ]), 1032, ["model-value", "onUpdate:modelValue", "onItemSelect", "onKeydown:escape", "items", "multiple", "add-ids", "no-unselect", "selection-color", "item-color-key"])
+          ]), 1032, ["model-value", "onUpdate:modelValue", "onItemSelect", "items", "multiple", "add-ids", "no-unselect", "selection-color", "item-color-key"])
         ]),
         _: 3
       }, 16, ["modelValue", "menu-class", "append-to"]),
@@ -4893,14 +4894,15 @@ const Oi = {
   },
   methods: {
     onFocus(e) {
-      return this.isFocused = !0, this.$emit("focus", e), !1;
+      if (!this.isFocused)
+        return this.isFocused = !0, this.$emit("focus", e), !1;
     },
     onBlur(e) {
-      this.isFocused = !1, this.$emit("blur", e);
+      this.showMenu || (this.isFocused = !1, this.$emit("blur", e));
     },
     onKeydown(e) {
-      if (e.preventDefault(), [13, 27, 38, 40].includes(e.keyCode) && e.preventDefault(), e.keyCode === 27)
-        this.closeMenu();
+      if (!e.metaKey && !e.ctrlKey && e.keyCode !== 9 && e.preventDefault(), e.keyCode === 27 && this.showMenu)
+        this.closeMenu("la5");
       else if (e.keyCode === 13)
         this.openMenu();
       else if ([38, 40].includes(e.keyCode))
@@ -4923,8 +4925,11 @@ const Oi = {
       const t = this.multiple ? e : e[0];
       this.$emit("update:modelValue", t), this.$emit("input", t);
     },
+    onInputFieldClick() {
+      this.showMenu ? this.showMenu = !1 : this.openMenu();
+    },
     onListItemSelect(e) {
-      this.$emit("item-select", e), this.multiple || this.closeMenu();
+      this.$emit("item-select", e), this.multiple || (this.showMenu = !1);
     },
     onReset() {
       this.inputValue = [];
@@ -4947,7 +4952,8 @@ const Oi = {
       }, 100);
     },
     closeMenu() {
-      (this.menuProps || {}).hideOnMenuClick !== !1 && (this.showMenu = !1, setTimeout(() => this.$refs["selection-input"].focus(), 50));
+      var e;
+      ((e = this.menuProps) == null ? void 0 : e.hideOnMenuClick) !== !1 && (this.showMenu = !1, setTimeout(() => this.$refs["selection-input"].focus(), 50));
     }
   },
   created() {
@@ -5004,11 +5010,11 @@ function Ui(e, t, l, a, r, i) {
         }, [
           w("div", {
             class: f(["w-slider__range", i.rangeClasses]),
-            style: R(i.rangeStyles)
+            style: T(i.rangeStyles)
           }, null, 6),
           w("div", {
             class: "w-slider__thumb",
-            style: R(i.thumbStyles)
+            style: T(i.thumbStyles)
           }, [
             w("button", {
               class: f(["w-slider__thumb-button", [l.color]]),
@@ -5055,7 +5061,7 @@ function Ui(e, t, l, a, r, i) {
             class: "w-slider__step-label",
             key: o,
             onClick: (n) => i.onStepLabelClick(o * (100 / i.numberOfSteps)),
-            style: R(`left: ${o * (100 / i.numberOfSteps)}%`)
+            style: T(`left: ${o * (100 / i.numberOfSteps)}%`)
           }, _(i.percentToScaled(o * (100 / i.numberOfSteps))), 13, Di))), 128)),
           ~~i.numberOfSteps !== i.numberOfSteps ? (s(), u("div", {
             key: 0,
@@ -5220,7 +5226,7 @@ function Gi(e, t, l, a, r, i) {
   return l.modelValue || l.modelValue === void 0 ? (s(), u("div", {
     key: 0,
     class: f(["w-spinner", i.classes]),
-    style: R(i.styles)
+    style: T(i.styles)
   }, [
     i.isThreeDots ? (s(), u("span", Yi)) : c("", !0)
   ], 6)) : c("", !0);
@@ -5484,7 +5490,7 @@ function vs(e, t, l, a, r, i) {
       !l.noSlider && !l.card ? (s(), u("div", {
         key: 1,
         class: f(["w-tabs__slider", l.sliderColor]),
-        style: R(i.sliderStyles)
+        style: T(i.sliderStyles)
       }, null, 6)) : c("", !0)
     ], 2),
     e.tabs.length ? (s(), u("div", bs, [
@@ -5744,7 +5750,7 @@ const ks = {
 }, _s = /* @__PURE__ */ v(ks, [["render", vs]]), Cs = { ref: "colgroup" }, Ss = ["width"], Bs = { key: 0 }, $s = ["onClick"], Vs = ["innerHTML"], Is = {
   key: 0,
   class: "w-table__progress-bar"
-}, Ts = ["colspan"], Rs = {
+}, Rs = ["colspan"], Ts = {
   key: 0,
   class: "w-table__progress-bar"
 }, Ls = ["colspan"], xs = { class: "w-table__loading-text" }, Os = {
@@ -5778,17 +5784,17 @@ function Js(e, t, l, a, r, i) {
       onMouseout: t[7] || (t[7] = (...b) => i.onMouseOut && i.onMouseOut(...b))
     }, [
       w("colgroup", Cs, [
-        (s(!0), u(k, null, L(l.headers, (b, T) => (s(), u("col", {
-          class: f(["w-table__col", i.colClasses[T]]),
-          key: T,
+        (s(!0), u(k, null, L(l.headers, (b, R) => (s(), u("col", {
+          class: f(["w-table__col", i.colClasses[R]]),
+          key: R,
           width: b.width || null
         }, null, 10, Ss))), 128))
       ], 512),
       l.noHeaders ? c("", !0) : (s(), u("thead", Bs, [
         w("tr", null, [
-          (s(!0), u(k, null, L(l.headers, (b, T) => (s(), u("th", {
+          (s(!0), u(k, null, L(l.headers, (b, R) => (s(), u("th", {
             class: f(["w-table__header", i.headerClasses(b)]),
-            key: T,
+            key: R,
             onClick: (x) => !e.colResizing.dragging && b.sortable !== !1 && i.sortTable(b)
           }, [
             b.sortable !== !1 && b.align === "right" ? (s(), m(o, {
@@ -5805,7 +5811,7 @@ function Js(e, t, l, a, r, i) {
                 key: 0,
                 header: b,
                 label: b.label,
-                index: T + 1
+                index: R + 1
               }, () => [
                 S(_(b.label || ""), 1)
               ]) : (s(), u("span", {
@@ -5822,9 +5828,9 @@ function Js(e, t, l, a, r, i) {
               ]),
               _: 2
             }, 1032, ["class"])) : c("", !0),
-            T < l.headers.length - 1 && l.resizableColumns ? (s(), u("span", {
+            R < l.headers.length - 1 && l.resizableColumns ? (s(), u("span", {
               key: 3,
-              class: f(["w-table__col-resizer", { "w-table__col-resizer--hover": e.colResizing.hover === T, "w-table__col-resizer--active": e.colResizing.columnIndex === T }]),
+              class: f(["w-table__col-resizer", { "w-table__col-resizer--hover": e.colResizing.hover === R, "w-table__col-resizer--active": e.colResizing.columnIndex === R }]),
               onClick: t[0] || (t[0] = M(() => {
               }, ["stop"]))
             }, null, 2)) : c("", !0)
@@ -5837,14 +5843,14 @@ function Js(e, t, l, a, r, i) {
                 colspan: l.headers.length
               }, [
                 I(n, { tile: "" })
-              ], 8, Ts)
+              ], 8, Rs)
             ])) : c("", !0)
           ]),
           _: 1
         })
       ])),
       w("tbody", null, [
-        l.loading === !0 ? (s(), u("tr", Rs, [
+        l.loading === !0 ? (s(), u("tr", Ts, [
           w("td", {
             colspan: l.headers.length
           }, [
@@ -5865,17 +5871,17 @@ function Js(e, t, l, a, r, i) {
             ])
           ], 8, Ps)
         ])),
-        i.tableItems.length && l.loading !== !0 ? (s(!0), u(k, { key: 2 }, L(i.paginatedItems, (b, T) => (s(), u(k, { key: T }, [
+        i.tableItems.length && l.loading !== !0 ? (s(!0), u(k, { key: 2 }, L(i.paginatedItems, (b, R) => (s(), u(k, { key: R }, [
           e.$slots.item ? p(e.$slots, "item", {
             key: 0,
             item: b,
-            index: T + 1,
-            select: () => i.doSelectRow(b, T),
+            index: R + 1,
+            select: () => i.doSelectRow(b, R),
             classes: { "w-table__row": !0, "w-table__row--selected": i.selectedRowsByUid[b._uid] !== void 0, "w-table__row--expanded": i.expandedRowsByUid[b._uid] !== void 0 }
           }) : (s(), u("tr", {
             key: 1,
             class: f(["w-table__row", { "w-table__row--selected": i.selectedRowsByUid[b._uid] !== void 0, "w-table__row--expanded": i.expandedRowsByUid[b._uid] !== void 0 }]),
-            onClick: (x) => i.doSelectRow(b, T)
+            onClick: (x) => i.doSelectRow(b, R)
           }, [
             (s(!0), u(k, null, L(l.headers, (x, P) => (s(), u(k, null, [
               e.$slots[`item-cell.${x.key}`] || e.$slots[`item-cell.${P + 1}`] || e.$slots["item-cell"] ? (s(), u("td", {
@@ -5888,19 +5894,19 @@ function Js(e, t, l, a, r, i) {
                   header: x,
                   item: b,
                   label: b[x.key] || "",
-                  index: T + 1
+                  index: R + 1
                 }) : e.$slots[`item-cell.${P + 1}`] ? p(e.$slots, `item-cell.${P + 1}`, {
                   key: 1,
                   header: x,
                   item: b,
                   label: b[x.key] || "",
-                  index: T + 1
+                  index: R + 1
                 }) : e.$slots["item-cell"] ? p(e.$slots, "item-cell", {
                   key: 2,
                   header: x,
                   item: b,
                   label: b[x.key] || "",
-                  index: T + 1
+                  index: R + 1
                 }) : c("", !0),
                 P < l.headers.length - 1 && l.resizableColumns ? (s(), u("span", {
                   key: 3,
@@ -5931,12 +5937,12 @@ function Js(e, t, l, a, r, i) {
                   i.expandedRowsByUid[b._uid] ? (s(), u("div", Ks, [
                     p(e.$slots, "row-expansion", {
                       item: b,
-                      index: T + 1
+                      index: R + 1
                     })
                   ])) : c("", !0),
-                  T < l.headers.length - 1 && l.resizableColumns ? (s(), u("span", {
+                  R < l.headers.length - 1 && l.resizableColumns ? (s(), u("span", {
                     key: 1,
-                    class: f(["w-table__col-resizer", { "w-table__col-resizer--hover": e.colResizing.hover === T, "w-table__col-resizer--active": e.colResizing.columnIndex === e.j }])
+                    class: f(["w-table__col-resizer", { "w-table__col-resizer--hover": e.colResizing.hover === R, "w-table__col-resizer--active": e.colResizing.columnIndex === e.j }])
                   }, null, 2)) : c("", !0)
                 ]),
                 _: 2
@@ -5990,7 +5996,7 @@ function Js(e, t, l, a, r, i) {
                   (s(!0), u(k, null, L(e.paginationConfig.pagesCount, (b) => (s(), m(B, {
                     class: f(["w-pagination__page", { "w-pagination__page--active": b === e.paginationConfig.page }]),
                     key: b,
-                    onClick: (T) => b !== e.paginationConfig.page && i.goToPage(b),
+                    onClick: (R) => b !== e.paginationConfig.page && i.goToPage(b),
                     round: "",
                     lg: ""
                   }, {
@@ -6649,7 +6655,7 @@ const fa = {
 function ma(e, t, l, a, r, i) {
   return s(), u("div", {
     class: f(["w-toolbar", i.classes]),
-    style: R(i.styles)
+    style: T(i.styles)
   }, [
     p(e.$slots, "default")
   ], 6);
@@ -6716,7 +6722,7 @@ function wa(e, t, l, a, r, i) {
           class: f(["w-tooltip", i.classes]),
           ref: "detachable",
           key: e._.uid,
-          style: R(i.styles)
+          style: T(i.styles)
         }, [
           p(e.$slots, "default")
         ], 6)) : c("", !0)
@@ -6947,13 +6953,13 @@ function Ia(e, t, l, a, r, i) {
     _: 3
   }, 16);
 }
-const Ta = {
+const Ra = {
   name: "w-transition-fade",
   props: {
     appear: { type: Boolean },
     duration: { type: [Number, String] }
   }
-}, Ra = /* @__PURE__ */ v(Ta, [["render", Ia]]);
+}, Ta = /* @__PURE__ */ v(Ra, [["render", Ia]]);
 function La(e, t, l, a, r, i) {
   return s(), m(O, C({ name: "scale" }, e.$props), {
     default: g(() => [
@@ -7112,8 +7118,8 @@ function Xa(e, t, l, a, r, i) {
       }, 1040, ["onClick", "onKeydown", "tabindex"])),
       (s(), m(V(l.noTransition ? "div" : "w-transition-expand"), {
         y: !l.noTransition || null,
-        onAfterEnter: (B) => e.$emit("open", { item: h.originalItem, open: h.open, depth: l.depth, path: i.getTreeItemPathForOutput(h) }),
-        onAfterLeave: (B) => e.$emit("close", { item: h.originalItem, open: h.open, depth: l.depth, path: i.getTreeItemPathForOutput(h) })
+        onAfterEnter: (B) => e.$emit("open", i.emitPayload(h)),
+        onAfterLeave: (B) => e.$emit("close", i.emitPayload(h))
       }, {
         default: g(() => [
           h.children && h.open ? (s(), m(d, C({ key: 0 }, e.$props, {
@@ -7128,11 +7134,11 @@ function Xa(e, t, l, a, r, i) {
             onSelect: t[5] || (t[5] = (B) => e.$emit("select", B)),
             "onUpdate:modelValue": t[6] || (t[6] = (B) => e.$emit("update:model-value", B))
           }), {
-            item: g(({ item: B, depth: b, path: T, open: x }) => [
+            item: g(({ item: B, depth: b, path: R, open: x }) => [
               p(e.$slots, "item", {
                 item: B,
                 depth: b,
-                path: T,
+                path: R,
                 open: x
               })
             ]),
@@ -7183,6 +7189,7 @@ const Ya = {
       return {
         [`w-tree--depth${this.depth}`]: !0,
         "w-tree--expand-icon": this.expandIcon && !this.depth,
+        "w-tree--selectable": this.selectable,
         "w-tree--disabled": this.disabled && !this.depth,
         "w-tree--no-expand-button": !this.expandIcon
       };
@@ -7193,7 +7200,7 @@ const Ya = {
       if (this.currentDepthItems = [], !Array.isArray(e) && typeof e != "object")
         return G(`[w-tree] the tree items must be of type array or object, ${typeof e} received.`);
       Array.isArray(e) || (e = [e]), e.forEach((l, a) => {
-        var i;
+        var i, o;
         const r = {
           originalItem: l,
           _uid: this.depth.toString() + (a + 1),
@@ -7202,8 +7209,9 @@ const Ya = {
           branch: l.branch,
           route: l[this.itemRouteKey],
           disabled: l[this.itemDisabledKey],
+          selected: ((i = t[a]) == null ? void 0 : i.selected) || !1,
           depth: this.depth,
-          open: !!(((i = t[a]) == null ? void 0 : i.open) || this.expandAll || l[this.itemOpenKey]),
+          open: !!(((o = t[a]) == null ? void 0 : o.open) || this.expandAll || l[this.itemOpenKey]),
           parent: this.parent || null,
           path: []
         };
@@ -7228,37 +7236,32 @@ const Ya = {
     },
     expandDepth(e, t) {
       typeof t == "boolean" ? e.open = t : e.open = !e.open;
-      const l = {
-        item: e.originalItem,
-        open: e.open,
-        depth: this.depth,
-        path: this.getTreeItemPathForOutput(e)
-      };
+      const l = this.emitPayload(e);
       return this.$emit(e.open ? "before-open" : "before-close", l), !this.unexpandableEmpty && !e.children && this.$emit(e.open ? "open" : "close", l), !0;
     },
     onLabelClick(e, t) {
-      e[this.itemRouteKey] && this.$router && !this.hasExternalLink(e) && t.preventDefault(), this.$emit("click", {
-        item: e.originalItem,
-        depth: this.depth,
-        path: this.getTreeItemPathForOutput(e),
-        e: t
-      }), (e.children || e.branch && !this.unexpandableEmpty) && this.expandDepth(e), this.selectable && this.emitItemSelection(e, t);
-    },
-    emitItemSelection(e, t) {
-      const l = {
-        item: e.originalItem,
-        depth: this.depth,
-        path: this.getTreeItemPathForOutput(e),
-        e: t
-      };
-      (e.children || e.branch && !this.unexpandableEmpty) && (l.open = e.open), this.$emit("update:model-value", l), this.$emit("select", l);
+      e[this.itemRouteKey] && this.$router && !this.hasExternalLink(e) && t.preventDefault(), (e.children || e.branch && !this.unexpandableEmpty) && this.expandDepth(e), this.selectable && (e.selected = !e.selected);
+      const a = this.emitPayload(e, t);
+      this.$emit("click", a), this.emitItemSelection(e, t);
     },
     onLabelKeydown(e, t) {
       if (!(t.metaKey || t.ctrlKey || t.altKey || t.shiftKey) && [13, 32, 37, 38, 39, 40].includes(t.which) && ((e.children || e.branch) && ([13, 32].includes(t.which) ? this.expandDepth(e) && t.preventDefault() : t.which === 37 ? this.expandDepth(e, !1) && t.preventDefault() : t.which === 39 && this.expandDepth(e, !0) && t.preventDefault()), [38, 40].includes(t.which))) {
         const a = this.$el.closest(".w-tree--depth0").querySelectorAll('.w-tree__item-label[tabindex="0"]'), r = t.target.closest(".w-tree__item-label"), i = t.which === 38 ? -1 : 1;
         [...a].some((o, n) => o.isSameNode(r) ? (a[n + i] && a[n + i].focus(), !0) : !1);
       }
-      this.selectable && this.emitItemSelection(e, t);
+      t.which === 13 && (this.selectable && (e.selected = !e.selected), this.emitItemSelection(e, t));
+    },
+    emitItemSelection(e, t) {
+      const l = this.emitPayload(e, t);
+      this.$emit("update:model-value", l), this.selectable && this.$emit("select", l);
+    },
+    emitPayload(e, t) {
+      const l = {
+        item: e.originalItem,
+        depth: this.depth,
+        path: this.getTreeItemPathForOutput(e)
+      };
+      return t && (l.e = t), (e.children || e.branch && !this.unexpandableEmpty) && (l.open = e.open), this.selectable && (l.selected = e.selected), l;
     },
     getPreviousSibling(e, t) {
       for (; t && (e = e.previousElementSibling); )
@@ -7285,6 +7288,7 @@ const Ya = {
       return {
         [e.children || e.branch ? "w-tree__item--branch" : "w-tree__item--leaf"]: !0,
         "w-tree__item--disabled": e[this.itemDisabledKey],
+        "w-tree__item--selected": e.selected,
         "w-tree__item--empty": e.branch && !e.children,
         "w-tree__item--unexpandable": e.branch && !e.children && this.unexpandableEmpty
       };
@@ -7347,7 +7351,7 @@ const Ya = {
   WTooltip: ka,
   WTransitionBounce: Sa,
   WTransitionExpand: Va,
-  WTransitionFade: Ra,
+  WTransitionFade: Ta,
   WTransitionScale: Oa,
   WTransitionScaleFade: Ma,
   WTransitionSlide: Aa,