wave-ui 2.39.0 → 2.40.1

package/dist/wave-ui.es.js

@@ -1,34 +1,5 @@
 var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
 var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
@@ -92,16 +63,17 @@ const _NotificationManager$1 = class {
     };
   }
   notify(...args) {
-    let notification = __spreadProps(__spreadValues({}, this._notificationDefaults), { _uid: this._uid++ });
+    let notification = { ...this._notificationDefaults, _uid: this._uid++ };
     if (typeof args[0] === "object")
-      notification = __spreadValues(__spreadValues({}, notification), args[0]);
+      notification = { ...notification, ...args[0] };
     else {
       const [message, type, timeout] = args;
-      notification = __spreadProps(__spreadValues({}, notification), {
+      notification = {
+        ...notification,
         message: message || "",
         [type === void 0 ? "info" : type]: true,
         timeout: timeout || timeout === 0 ? parseFloat(timeout) : 4e3
-      });
+      };
     }
     this.notifications.push(notification);
     if (~~notification.timeout !== 0)
@@ -437,7 +409,8 @@ const _WaveUI = class {
       obj[color.label] = color.color;
       color.shades.forEach((shade) => obj[shade.label] = shade.color);
       return obj;
-    }, __spreadProps(__spreadValues({}, config.colors), { black: "#000", white: "#fff", transparent: "transparent", inherit: "inherit" })));
+    }, { ...config.colors, black: "#000", white: "#fff", transparent: "transparent", inherit: "inherit" }));
+    __publicField(this, "config", {});
     if (_WaveUI.instance)
       return _WaveUI.instance;
     else {
@@ -463,6 +436,7 @@ const _WaveUI = class {
           }
         }
       }
+      this.config = config;
       _WaveUI.instance = this;
       app.config.globalProperties.$waveui = reactive(this);
     }
@@ -660,7 +634,8 @@ const _sfc_main$P = {
     },
     updateItems() {
       const items = typeof this.items === "number" ? Array(this.items).fill({}) : this.items || [];
-      this.accordionItems = items.map((item, _index) => __spreadProps(__spreadValues({}, item), {
+      this.accordionItems = items.map((item, _index) => ({
+        ...item,
         _index,
         _expanded: this.modelValue && this.modelValue[_index],
         _disabled: !!item.disabled
@@ -851,7 +826,7 @@ const _sfc_main$N = {
   },
   methods: {
     notifProps(notif) {
-      const _a = notif, { _value, _uid, message, timeout } = _a, props = __objRest(_a, ["_value", "_uid", "message", "timeout"]);
+      const { _value, _uid, message, timeout, ...props } = notif;
       return props;
     }
   },
@@ -864,57 +839,50 @@ const _sfc_main$N = {
   }
 };
 var NotificationManager = /* @__PURE__ */ _export_sfc(_sfc_main$N, [["render", render$N]]);
-const { css: cssConfig } = config;
-const entries = Object.entries(config.breakpoints);
-const breakpoints = entries.map(([label, max], i) => {
-  const [, value = 0] = entries[i - 1] || [];
-  return { label, min: value ? value + 1 : 0, max };
-});
-let computedStyles = null;
 const cssVars = {
   cssScope: ".w-app",
   baseIncrement: 4
 };
-const generateColors = () => {
+const generateColors = (config2) => {
   let styles = "";
   const { cssScope } = cssVars;
-  const _a = config.colors, { info, warning, success, error } = _a, colors2 = __objRest(_a, ["info", "warning", "success", "error"]);
+  const { info, warning, success, error, ...colors2 } = config2.colors;
   for (const color in colors2) {
-    styles += `${cssScope} .${color}--bg{background-color:${config.colors[color]}}${cssScope} .${color}{color:${config.colors[color]}}`;
+    styles += `${cssScope} .${color}--bg{background-color:${config2.colors[color]}}${cssScope} .${color}{color:${config2.colors[color]}}`;
   }
-  if (cssConfig.colorShades && config.colorShades) {
-    Object.entries(config.colorShades).forEach(([label, color]) => {
+  if (config2.css.colorShades && config2.colorShades) {
+    Object.entries(config2.colorShades).forEach(([label, color]) => {
       styles += `${cssScope} .${label}--bg{background-color:${color}}${cssScope} .${label}{color:${color}}`;
     });
   }
   const statusColors = { info, warning, success, error };
   for (const color in statusColors) {
-    styles += `${cssScope} .${color}--bg{background-color:${config.colors[color]}}${cssScope} .${color}{color:${config.colors[color]}}`;
+    styles += `${cssScope} .${color}--bg{background-color:${config2.colors[color]}}${cssScope} .${color}{color:${config2.colors[color]}}`;
   }
   const cssVariables = [];
-  cssVariables.push(`--primary: ${config.colors.primary}`);
+  cssVariables.push(`--primary: ${config2.colors.primary}`);
   styles += `:root {${cssVariables.join(";")}}`;
   return styles;
 };
-const generateBreakpoints = () => {
+const generateBreakpoints = (breakpoints, grid) => {
   let styles = "";
   const { cssScope } = cssVars;
   breakpoints.forEach(({ min, label }) => {
     if (label === "xs") {
-      for (let i = 0; i < cssConfig.grid; i++) {
-        styles += `${cssScope} .${label}${cssConfig.grid - i}{width:${parseFloat(((cssConfig.grid - i) * 100 / cssConfig.grid).toFixed(4))}%;}`;
+      for (let i = 0; i < grid; i++) {
+        styles += `${cssScope} .${label}${grid - i}{width:${parseFloat(((grid - i) * 100 / grid).toFixed(4))}%;}`;
       }
     } else {
       styles += `@media(min-width:${min}px){`;
-      for (let i = 0; i < cssConfig.grid; i++) {
-        styles += `${cssScope} .${label}${cssConfig.grid - i}{width:${parseFloat(((cssConfig.grid - i) * 100 / cssConfig.grid).toFixed(4))}%;}`;
+      for (let i = 0; i < grid; i++) {
+        styles += `${cssScope} .${label}${grid - i}{width:${parseFloat(((grid - i) * 100 / grid).toFixed(4))}%;}`;
       }
       styles += "}";
     }
   });
   return styles;
 };
-const genBreakpointLayoutClasses = () => {
+const genBreakpointLayoutClasses = (breakpoints) => {
   let styles = "";
   const { cssScope, baseIncrement } = cssVars;
   const layoutClasses = [
@@ -967,15 +935,20 @@ const genBreakpointLayoutClasses = () => {
   });
   return styles;
 };
-var DynamicCSS = () => {
-  let styles = "";
-  computedStyles = getComputedStyle(document.documentElement);
+var dynamicCSS = (config2) => {
+  const entries = Object.entries(config2.breakpoints);
+  const breakpointsDef2 = entries.map(([label, max], i) => {
+    const [, value = 0] = entries[i - 1] || [];
+    return { label, min: value ? value + 1 : 0, max };
+  });
+  const computedStyles = getComputedStyle(document.documentElement);
   cssVars.cssScope = computedStyles.getPropertyValue("--css-scope");
   cssVars.baseIncrement = parseInt(computedStyles.getPropertyValue("--base-increment"));
-  styles += generateColors();
-  styles += generateBreakpoints();
-  if (cssConfig.breakpointLayoutClasses)
-    styles += genBreakpointLayoutClasses();
+  let styles = "";
+  styles += generateColors(config2);
+  styles += generateBreakpoints(breakpointsDef2, config2.css.grid);
+  if (config2.css.breakpointLayoutClasses)
+    styles += genBreakpointLayoutClasses(breakpointsDef2);
   return styles;
 };
 function render$M(_ctx, _cache, $props, $setup, $data, $options) {
@@ -988,8 +961,7 @@ function render$M(_ctx, _cache, $props, $setup, $data, $options) {
   ], 2);
 }
 var wApp_vue_vue_type_style_index_0_lang = "";
-const breakpointsNames = Object.keys(config.breakpoints);
-const breakpointsValues = Object.values(config.breakpoints);
+let breakpointsDef = { keys: [], values: [] };
 const _sfc_main$M = {
   name: "w-app",
   props: {
@@ -1032,10 +1004,10 @@ const _sfc_main$M = {
   methods: {
     getBreakpoint() {
       const width = window.innerWidth;
-      const breakpoints2 = breakpointsValues.slice(0);
-      breakpoints2.push(width);
-      breakpoints2.sort((a, b) => a - b);
-      const breakpoint = breakpointsNames[breakpoints2.indexOf(width)] || "xl";
+      const breakpoints = breakpointsDef.values.slice(0);
+      breakpoints.push(width);
+      breakpoints.sort((a, b) => a - b);
+      const breakpoint = breakpointsDef.keys[breakpoints.indexOf(width)] || "xl";
       if (breakpoint !== this.currentBreakpoint) {
         this.currentBreakpoint = breakpoint;
         this.$waveui.breakpoint = {
@@ -1049,16 +1021,15 @@ const _sfc_main$M = {
         };
       }
       this.$waveui.breakpoint.width = width;
-    },
-    dynamicStyles() {
-      return DynamicCSS();
     }
   },
   mounted() {
+    const { config: config2 } = this.$waveui;
+    breakpointsDef = { keys: Object.keys(config2.breakpoints), values: Object.values(config2.breakpoints) };
     if (!document.getElementById("wave-ui-styles")) {
       const css = document.createElement("style");
       css.id = "wave-ui-styles";
-      css.innerHTML = this.dynamicStyles();
+      css.innerHTML = dynamicCSS(config2);
       const firstStyle = document.head.querySelectorAll('style,link[rel="stylesheet"]')[0];
       if (firstStyle)
         firstStyle.before(css);
@@ -1338,7 +1309,8 @@ const _sfc_main$J = {
       return this.hasRouter ? this.$router.resolve(this.route).href : this.route;
     },
     listeners() {
-      return this.route && this.hasRouter && !this.forceLink && !this.externalLink ? __spreadProps(__spreadValues({}, this.$attrs), {
+      return this.route && this.hasRouter && !this.forceLink && !this.externalLink ? {
+        ...this.$attrs,
         click: (e) => {
           if (this.$attrs.click)
             this.$attrs.click(e);
@@ -1346,7 +1318,7 @@ const _sfc_main$J = {
           e.stopPropagation();
           e.preventDefault();
         }
-      }) : this.$attrs;
+      } : this.$attrs;
     },
     size() {
       return this.xs && "xs" || this.sm && "sm" || this.lg && "lg" || this.xl && "xl" || "md";
@@ -1404,7 +1376,7 @@ function render$I(_ctx, _cache, $props, $setup, $data, $options) {
   }, [
     _ctx.$slots.title || $props.title ? (openBlock(), createElementBlock("div", {
       key: 0,
-      class: normalizeClass(["w-card__title", __spreadValues({ "w-card__title--has-toolbar": _ctx.$slots.title && $options.titleHasToolbar }, $options.titleClasses)])
+      class: normalizeClass(["w-card__title", { "w-card__title--has-toolbar": _ctx.$slots.title && $options.titleHasToolbar, ...$options.titleClasses }])
     }, [
       renderSlot(_ctx.$slots, "title", {}, () => [
         createTextVNode(toDisplayString($props.title), 1)
@@ -1465,10 +1437,11 @@ const _sfc_main$I = {
       return actions && actions().map((vnode) => vnode.type.name).join("").includes("w-toolbar");
     },
     imgProps() {
-      return __spreadValues({
+      return {
         tag: "div",
-        ratio: 1 / 2
-      }, this.imageProps);
+        ratio: 1 / 2,
+        ...this.imageProps
+      };
     },
     classes() {
       return {
@@ -1735,13 +1708,14 @@ const _sfc_main$G = {
     checkboxItems() {
       return (this.items || []).map((item, i) => {
         const itemValue = item[this.itemValueKey] === void 0 ? item[this.itemLabelKey] || i : item[this.itemValueKey];
-        return reactive(__spreadProps(__spreadValues({}, item), {
+        return reactive({
+          ...item,
           label: item[this.itemLabelKey],
           _index: i,
           value: itemValue,
           color: item[this.itemColorKey] || this.color,
           _isChecked: this.modelValue && this.modelValue.includes(itemValue)
-        }));
+        });
       });
     },
     classes() {
@@ -1780,7 +1754,7 @@ function render$F(_ctx, _cache, $props, $setup, $data, $options) {
       "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.showPopup = $event)
     }, $options.wMenuProps), {
       activator: withCtx(({ on }) => [
-        createVNode(_component_w_button, mergeProps({ class: "w-confirm__button" }, __spreadValues(__spreadValues(__spreadValues({}, _ctx.$attrs), $options.buttonProps), on)), {
+        createVNode(_component_w_button, mergeProps({ class: "w-confirm__button" }, { ..._ctx.$attrs, ...$options.buttonProps, ...on }), {
           default: withCtx(() => [
             renderSlot(_ctx.$slots, "default")
           ]),
@@ -1872,7 +1846,7 @@ const _sfc_main$F = {
       return button;
     },
     cancelButtonProps() {
-      const _a = this.cancelButton, { label } = _a, props = __objRest(_a, ["label"]);
+      const { label, ...props } = this.cancelButton;
       return props;
     },
     confirmButton() {
@@ -1882,11 +1856,11 @@ const _sfc_main$F = {
       return button;
     },
     confirmButtonProps() {
-      const _a = this.confirmButton, { label } = _a, props = __objRest(_a, ["label"]);
+      const { label, ...props } = this.confirmButton;
       return props;
     },
     wMenuProps() {
-      return __spreadValues({
+      return {
         top: this.top,
         bottom: this.bottom,
         left: this.left,
@@ -1897,15 +1871,17 @@ const _sfc_main$F = {
         alignLeft: this.alignLeft,
         alignRight: this.alignRight,
         persistent: this.persistent,
-        transition: this.transition
-      }, this.menu);
+        transition: this.transition,
+        ...this.menu
+      };
     },
     buttonProps() {
-      return __spreadValues({
+      return {
         bgColor: this.bgColor,
         color: this.color,
-        icon: this.icon
-      }, this.mainButton);
+        icon: this.icon,
+        ...this.mainButton
+      };
     }
   },
   methods: {
@@ -2671,7 +2647,10 @@ const _sfc_main$x = {
           return obj;
         }, {});
       }
-      return __spreadValues(__spreadValues({}, breakpointsColumns || { [`columns${this.columns}`]: this.columns }), breakpointsGap || { [`gap${this.gap}`]: this.gap });
+      return {
+        ...breakpointsColumns || { [`columns${this.columns}`]: this.columns },
+        ...breakpointsGap || { [`gap${this.gap}`]: this.gap }
+      };
     }
   }
 };
@@ -3182,15 +3161,15 @@ const _sfc_main$u = {
   },
   computed: {
     attrs() {
-      const _a = this.$attrs, { class: classes } = _a, attrs = __objRest(_a, ["class"]);
+      const { class: classes, ...attrs } = this.$attrs;
       return attrs;
     },
     listeners() {
-      const _a = this.$attrs, { input, focus, blur } = _a, listeners = __objRest(_a, ["input", "focus", "blur"]);
+      const { input, focus, blur, ...listeners } = this.$attrs;
       return listeners;
     },
     attrs() {
-      const _a = this.$attrs, { class: Class } = _a, htmlAttrs = __objRest(_a, ["class"]);
+      const { class: Class, ...htmlAttrs } = this.$attrs;
       return htmlAttrs;
     },
     hasValue() {
@@ -3606,7 +3585,7 @@ const _sfc_main$t = {
       const items = this.selectedItems.map((item) => {
         if (!this.returnObject)
           return item._value;
-        const _a = item, { _value, _selected } = _a, Item = __objRest(_a, ["_value", "_selected"]);
+        const { _value, _selected, ...Item } = item;
         return Item;
       });
       const selection = this.isMultipleSelect ? items : items[0] !== void 0 ? items[0] : null;
@@ -3621,12 +3600,13 @@ const _sfc_main$t = {
       this.$el.querySelector(`#${this.listId}_item-${index2 + 1}`).focus();
     },
     cleanLi(li) {
-      const _a = li, { _index, _value, _label, _selected, _focused } = _a, cleanLi = __objRest(_a, ["_index", "_value", "_label", "_selected", "_focused"]);
+      const { _index, _value, _label, _selected, _focused, ...cleanLi } = li;
       return cleanLi;
     },
     refreshListItems() {
       const items = typeof this.items === "number" ? Array(this.items).fill({}) : this.items || [];
-      this.listItems = items.map((item, i) => __spreadProps(__spreadValues({}, item), {
+      this.listItems = items.map((item, i) => ({
+        ...item,
         _index: i,
         _value: item[this.itemValueKey] === void 0 ? item[this.itemLabelKey] || i : item[this.itemValueKey],
         _selected: item._selected || false,
@@ -3773,11 +3753,12 @@ var DetachableMixin = {
       let coords = { top, left, width, height };
       if (!this.fixed) {
         const { top: targetTop, left: targetLeft } = this.detachableParentEl.getBoundingClientRect();
-        const computedStyles2 = window.getComputedStyle(this.detachableParentEl, null);
-        coords = __spreadProps(__spreadValues({}, coords), {
-          top: top - targetTop + this.detachableParentEl.scrollTop - parseInt(computedStyles2.getPropertyValue("border-top-width")),
-          left: left - targetLeft + this.detachableParentEl.scrollLeft - parseInt(computedStyles2.getPropertyValue("border-left-width"))
-        });
+        const computedStyles = window.getComputedStyle(this.detachableParentEl, null);
+        coords = {
+          ...coords,
+          top: top - targetTop + this.detachableParentEl.scrollTop - parseInt(computedStyles.getPropertyValue("border-top-width")),
+          left: left - targetLeft + this.detachableParentEl.scrollLeft - parseInt(computedStyles.getPropertyValue("border-left-width"))
+        };
       }
       return coords;
     },
@@ -3787,12 +3768,12 @@ var DetachableMixin = {
         return;
       this.detachableEl.style.visibility = "hidden";
       this.detachableEl.style.display = "flex";
-      const computedStyles2 = window.getComputedStyle(this.detachableEl, null);
+      const computedStyles = window.getComputedStyle(this.detachableEl, null);
       switch (this.position) {
         case "top": {
           top -= this.detachableEl.offsetHeight;
           if (this.alignRight) {
-            left += width - this.detachableEl.offsetWidth + parseInt(computedStyles2.getPropertyValue("border-right-width"));
+            left += width - this.detachableEl.offsetWidth + parseInt(computedStyles.getPropertyValue("border-right-width"));
           } else if (!this.alignLeft)
             left += (width - this.detachableEl.offsetWidth) / 2;
           break;
@@ -3800,7 +3781,7 @@ var DetachableMixin = {
         case "bottom": {
           top += height;
           if (this.alignRight) {
-            left += width - this.detachableEl.offsetWidth + parseInt(computedStyles2.getPropertyValue("border-right-width"));
+            left += width - this.detachableEl.offsetWidth + parseInt(computedStyles.getPropertyValue("border-right-width"));
           } else if (!this.alignLeft)
             left += (width - this.detachableEl.offsetWidth) / 2;
           break;
@@ -3816,9 +3797,9 @@ var DetachableMixin = {
         case "right": {
           left += width;
           if (this.alignBottom) {
-            top += height - this.detachableEl.offsetHeight + parseInt(computedStyles2.getPropertyValue("margin-top"));
+            top += height - this.detachableEl.offsetHeight + parseInt(computedStyles.getPropertyValue("margin-top"));
           } else if (!this.alignTop) {
-            top += (height - this.detachableEl.offsetHeight) / 2 + parseInt(computedStyles2.getPropertyValue("margin-top"));
+            top += (height - this.detachableEl.offsetHeight) / 2 + parseInt(computedStyles.getPropertyValue("margin-top"));
           }
           break;
         }
@@ -4054,15 +4035,16 @@ const _sfc_main$s = {
       return objectifyClasses(this.contentClass);
     },
     overlayClasses() {
-      return __spreadProps(__spreadValues({}, objectifyClasses(this.overlayClass)), {
+      return {
+        ...objectifyClasses(this.overlayClass),
         "w-overlay--no-pointer-event": this.showOnHover
-      });
+      };
     },
     classes() {
-      return __spreadProps(__spreadValues({
+      return {
         [this.color]: this.color,
-        [`${this.bgColor}--bg`]: this.bgColor
-      }, this.menuClasses), {
+        [`${this.bgColor}--bg`]: this.bgColor,
+        ...this.menuClasses,
         [`w-menu--${this.position}`]: !this.noPosition,
         [`w-menu--align-${this.alignment}`]: !this.noPosition && this.alignment,
         "w-menu--tile": this.tile,
@@ -4071,7 +4053,7 @@ const _sfc_main$s = {
         "w-menu--arrow": this.arrow,
         "w-menu--shadow": this.shadow,
         "w-menu--fixed": this.fixed
-      });
+      };
     },
     styles() {
       return {
@@ -4157,7 +4139,8 @@ function render$r(_ctx, _cache, $props, $setup, $data, $options) {
         class: normalizeClass(["w-notification", $options.classes]),
         style: normalizeStyle($options.styles)
       }, [
-        createVNode(_component_w_alert, mergeProps({ class: "white--bg" }, $options.alertProps, {
+        createVNode(_component_w_alert, mergeProps($options.alertProps, {
+          class: $options.alertClasses,
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => {
             _ctx.$emit("update:modelValue", false);
             _ctx.$emit("input", false);
@@ -4167,7 +4150,7 @@ function render$r(_ctx, _cache, $props, $setup, $data, $options) {
             renderSlot(_ctx.$slots, "default")
           ]),
           _: 3
-        }, 16)
+        }, 16, ["class"])
       ], 6)) : createCommentVNode("", true)
     ]),
     _: 3
@@ -4274,6 +4257,11 @@ const _sfc_main$r = {
         [`w-notification--${this.position.join(" w-notification--")}`]: true
       };
     },
+    alertClasses() {
+      if (this.bgColor || (this.success || this.info || this.warning || this.error) && this.plain)
+        return null;
+      return "white--bg";
+    },
     styles() {
       return {
         zIndex: this.zIndex || this.zIndex === 0 || null
@@ -4740,7 +4728,8 @@ const _sfc_main$m = {
   }),
   computed: {
     radioItems() {
-      return (this.items || []).map((item, i) => __spreadProps(__spreadValues({}, item), {
+      return (this.items || []).map((item, i) => ({
+        ...item,
         _index: i,
         label: item[this.itemLabelKey],
         value: item[this.itemValueKey] === void 0 ? item[this.itemLabelKey] || i : item[this.itemValueKey],
@@ -5145,7 +5134,7 @@ const _sfc_main$k = {
   computed: {
     selectItems() {
       return this.items.map((item, i) => {
-        const obj = __spreadValues({}, item);
+        const obj = { ...item };
         obj.value = obj[this.itemValueKey] === void 0 ? obj[this.itemLabelKey] || i : obj[this.itemValueKey];
         obj.index = i;
         return obj;
@@ -5941,10 +5930,11 @@ const _sfc_main$e = {
     },
     tabsItems() {
       const items = typeof this.items === "number" ? Array(this.items).fill({}) : this.items;
-      return items.map((item, _index) => reactive(__spreadProps(__spreadValues({}, item), {
+      return items.map((item, _index) => reactive({
+        ...item,
         _index,
         _disabled: !!item.disabled
-      })));
+      }));
     },
     activeTab() {
       return this.tabsItems[this.activeTabIndex] || this.tabsItems[0] || {};
@@ -6798,7 +6788,7 @@ const _sfc_main$b = {
   },
   computed: {
     listeners() {
-      const _a = this.$attrs, { input, focus, blur } = _a, listeners = __objRest(_a, ["input", "focus", "blur"]);
+      const { input, focus, blur, ...listeners } = this.$attrs;
       return listeners;
     },
     hasValue() {
@@ -6867,10 +6857,10 @@ const _sfc_main$b = {
       this.$refs.textarea.style.height = height + "px";
     },
     getLineHeight() {
-      const computedStyles2 = window.getComputedStyle(this.$refs.textarea, null);
-      this.lineHeight = parseFloat(computedStyles2.getPropertyValue("line-height"));
-      this.paddingY = parseFloat(computedStyles2.getPropertyValue("padding-top"));
-      this.paddingY += parseFloat(computedStyles2.getPropertyValue("padding-bottom"));
+      const computedStyles = window.getComputedStyle(this.$refs.textarea, null);
+      this.lineHeight = parseFloat(computedStyles.getPropertyValue("line-height"));
+      this.paddingY = parseFloat(computedStyles.getPropertyValue("padding-top"));
+      this.paddingY += parseFloat(computedStyles.getPropertyValue("padding-bottom"));
     }
   },
   mounted() {
@@ -7069,10 +7059,10 @@ const _sfc_main$8 = {
       return this.transition || `w-tooltip-slide-fade-${direction}`;
     },
     classes() {
-      return __spreadProps(__spreadValues({
+      return {
         [this.color]: this.color,
-        [`${this.bgColor}--bg`]: this.bgColor
-      }, this.tooltipClasses), {
+        [`${this.bgColor}--bg`]: this.bgColor,
+        ...this.tooltipClasses,
         [`w-tooltip--${this.position}`]: !this.noPosition,
         [`w-tooltip--align-${this.alignment}`]: !this.noPosition && this.alignment,
         "w-tooltip--tile": this.tile,
@@ -7081,7 +7071,7 @@ const _sfc_main$8 = {
         "w-tooltip--fixed": this.fixed,
         "w-tooltip--no-border": this.noBorder || this.bgColor,
         "w-tooltip--custom-transition": this.transition
-      });
+      };
     },
     styles() {
       return {
@@ -7314,24 +7304,24 @@ const _sfc_main$6 = {
       this.el.originalStyles = el.style.cssText;
     },
     show(el, done) {
-      const computedStyles2 = window.getComputedStyle(el, null);
+      const computedStyles = window.getComputedStyle(el, null);
       if (this.animX) {
         this.el.width = el.offsetWidth;
-        this.el.marginLeft = computedStyles2.getPropertyValue("marginLeft");
-        this.el.marginRight = computedStyles2.getPropertyValue("marginRight");
-        this.el.paddingLeft = computedStyles2.getPropertyValue("paddingLeft");
-        this.el.paddingRight = computedStyles2.getPropertyValue("paddingRight");
-        this.el.borderLeftWidth = computedStyles2.getPropertyValue("borderLeftWidth");
-        this.el.borderRightWidth = computedStyles2.getPropertyValue("borderRightWidth");
+        this.el.marginLeft = computedStyles.getPropertyValue("marginLeft");
+        this.el.marginRight = computedStyles.getPropertyValue("marginRight");
+        this.el.paddingLeft = computedStyles.getPropertyValue("paddingLeft");
+        this.el.paddingRight = computedStyles.getPropertyValue("paddingRight");
+        this.el.borderLeftWidth = computedStyles.getPropertyValue("borderLeftWidth");
+        this.el.borderRightWidth = computedStyles.getPropertyValue("borderRightWidth");
       }
       if (this.animY) {
         this.el.height = el.offsetHeight;
-        this.el.marginTop = computedStyles2.getPropertyValue("marginTop");
-        this.el.marginBottom = computedStyles2.getPropertyValue("marginBottom");
-        this.el.paddingTop = computedStyles2.getPropertyValue("paddingTop");
-        this.el.paddingBottom = computedStyles2.getPropertyValue("paddingBottom");
-        this.el.borderTopWidth = computedStyles2.getPropertyValue("borderTopWidth");
-        this.el.borderBottomWidth = computedStyles2.getPropertyValue("borderBottomWidth");
+        this.el.marginTop = computedStyles.getPropertyValue("marginTop");
+        this.el.marginBottom = computedStyles.getPropertyValue("marginBottom");
+        this.el.paddingTop = computedStyles.getPropertyValue("paddingTop");
+        this.el.paddingBottom = computedStyles.getPropertyValue("paddingBottom");
+        this.el.borderTopWidth = computedStyles.getPropertyValue("borderTopWidth");
+        this.el.borderBottomWidth = computedStyles.getPropertyValue("borderBottomWidth");
       }
       this.applyHideStyles(el);
       setTimeout(() => this.applyShowStyles(el), 20);
@@ -7521,5 +7511,5 @@ var components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProp
   WTransitionTwist: wTransitionTwist
 }, Symbol.toStringTag, { value: "Module" }));
 const install = WaveUI.install;
-WaveUI.install = (app, options = {}) => install.call(WaveUI, app, __spreadValues({ components }, options));
+WaveUI.install = (app, options = {}) => install.call(WaveUI, app, { components, ...options });
 export { WaveUI as default };