@mirweb/mir-web-components 1.4.7 → 1.4.8

package/dist/mir-web-components.es.js

@@ -1,4 +1,4 @@
-import { defineComponent as g, computed as C, openBlock as l, createElementBlock as i, normalizeClass as m, toDisplayString as n, createElementVNode as t, renderSlot as d, pushScopeId as H, popScopeId as R, createTextVNode as J, ref as q, resolveDirective as _e, withDirectives as K, Fragment as A, renderList as P, vShow as Z, normalizeProps as F, guardReactiveProps as N, toRefs as ke, mergeProps as de, createVNode as B, Transition as we, withCtx as $, withModifiers as pe, createBlock as T, createCommentVNode as h, watchEffect as he, withKeys as Se, useSlots as Be, normalizeStyle as ce, isRef as ne, unref as I, onMounted as me, watch as Q, onUnmounted as Ie } from "vue";
+import { defineComponent as g, computed as C, openBlock as l, createElementBlock as i, normalizeClass as m, toDisplayString as n, createElementVNode as t, renderSlot as d, pushScopeId as H, popScopeId as R, createTextVNode as J, ref as q, resolveDirective as _e, withDirectives as K, Fragment as A, renderList as P, vShow as Z, normalizeProps as F, guardReactiveProps as N, toRefs as ke, mergeProps as ce, createVNode as B, Transition as we, withCtx as $, withModifiers as pe, createBlock as T, createCommentVNode as h, watchEffect as he, withKeys as Se, useSlots as Be, normalizeStyle as le, isRef as de, unref as I, onMounted as me, watch as Q, onUnmounted as Ie } from "vue";
 const qe = ["aria-label"], Le = /* @__PURE__ */ g({
   __name: "button",
   props: {
@@ -107,16 +107,16 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
     const r = {
       primary: "dropdown-dark-bg-primary",
       dark: "dropdown-dark dropdown-dark-bg-dark"
-    }, s = e, o = C(() => r[s.variant]), c = q(null), _ = q(null), u = q([]), b = q(0), v = q(""), k = q(!0), w = q(0), ee = a, le = C(() => {
+    }, s = e, o = C(() => r[s.variant]), c = q(null), _ = q(null), u = q([]), b = q(0), v = q(""), k = q(!0), w = q(0), ee = a, se = C(() => {
       const p = s.options.find(
         (S) => S.value === s.modelValue
       );
       return p && p.label;
     });
-    function se(p) {
+    function ie(p) {
       ee("update:modelValue", p);
     }
-    function ie(p) {
+    function re(p) {
       var L;
       const S = p.target;
       S.getAttribute("role") === "option" && (W(S), ae(), (L = c.value) == null || L.focus());
@@ -163,7 +163,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
             break;
         }
     }
-    function re(p) {
+    function ne(p) {
       p && p.removeAttribute("aria-selected");
     }
     function y() {
@@ -198,12 +198,12 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
         const O = s.options.findIndex(
           ($e) => $e.value === s.modelValue
         ), Y = u.value[O];
-        re(Y);
+        ne(Y);
       }
       if (p.setAttribute("aria-selected", "true"), (L = _.value) == null || L.setAttribute(
         "aria-activedescendant",
         S || ""
-      ), se(S || ""), _.value && _.value.scrollHeight > _.value.clientHeight) {
+      ), ie(S || ""), _.value && _.value.scrollHeight > _.value.clientHeight) {
         const O = _.value.clientHeight + _.value.scrollTop, Y = p.offsetTop + p.offsetHeight;
         Y > O ? _.value.scrollTop = Y - ((D = _.value) == null ? void 0 : D.clientHeight) : p.offsetTop < _.value.scrollTop && (_.value.scrollTop = p.offsetTop);
       }
@@ -251,7 +251,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
             class: m(["listbox__button", o.value]),
             onClick: ye,
             onKeydown: te
-          }, n(p.modelValue ? le.value : p.placeholder), 43, ze),
+          }, n(p.modelValue ? se.value : p.placeholder), 43, ze),
           K(t("ul", {
             ref_key: "listboxNode",
             ref: _,
@@ -261,7 +261,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
             role: "listbox",
             class: "listbox__list",
             onKeydown: G,
-            onClick: ie
+            onClick: re
           }, [
             (l(!0), i(A, null, P(p.options, (D, O) => (l(), i("li", {
               key: `${p.name}-option-${O}`,
@@ -341,7 +341,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
       return u;
     });
     return (u, b) => (l(), i("div", Xe, [
-      t("div", de(_.value, {
+      t("div", ce(_.value, {
         class: ["mir-link", [
           o.value,
           u.disabled ? "disabled" : "",
@@ -894,13 +894,13 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
           _.size === "large" && _.variant === "article" ? "card--large-article" : "",
           _.variant === "product" ? "card--product" : "card--article"
         ]]),
-        style: ce([_.variant === "product" ? "font-weight: 700" : "font-weight: 300"]),
-        onMouseover: u[0] || (u[0] = (b) => ne(r) ? r.value = !0 : r = !0),
-        onMouseout: u[1] || (u[1] = (b) => ne(r) ? r.value = !1 : r = !1)
+        style: le([_.variant === "product" ? "font-weight: 700" : "font-weight: 300"]),
+        onMouseover: u[0] || (u[0] = (b) => de(r) ? r.value = !0 : r = !0),
+        onMouseout: u[1] || (u[1] = (b) => de(r) ? r.value = !1 : r = !1)
       }, [
         _.mediaType === "image" ? (l(), T(M, { key: 0 }, {
           default: $(() => [
-            d(_.$slots, "card-image", de({
+            d(_.$slots, "card-image", ce({
               src: _.imgSrc,
               width: "596",
               height: "335",
@@ -1360,7 +1360,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
           ])) : h("", !0)
         ]),
         t("div", {
-          style: ce([o.mediaSmall.length === 2 ? "grid-gap: 38px;" : ""]),
+          style: le([o.mediaSmall.length === 2 ? "grid-gap: 38px;" : ""]),
           class: m([
             "gallery__small",
             o.flipVertical ? "gallery__small--reverse" : "gallery__small--default"
@@ -1864,12 +1864,12 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
             t("div", zl, [
               B(M, null, {
                 default: $(() => [
-                  s.media.src ? d(a.$slots, "timeline-image", F(de({ key: 0 }, { src: s.media.src, alt: s.media.alt })), void 0, !0) : h("", !0)
+                  s.media.src ? d(a.$slots, "timeline-image", F(ce({ key: 0 }, { src: s.media.src, alt: s.media.alt })), void 0, !0) : h("", !0)
                 ]),
                 _: 2
               }, 1024),
               t("div", {
-                style: ce([s.media.src ? "" : "margin-top: 0px"]),
+                style: le([s.media.src ? "" : "margin-top: 0px"]),
                 class: "rich-text",
                 innerHTML: s.text
               }, null, 12, jl)
@@ -2259,21 +2259,21 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
     function ee() {
       u.value = !u.value, w("update:showDropDown", u.value);
     }
-    function le() {
+    function se() {
       b.value = !b.value, w("update:showPortalSwitcherDropDown", b.value);
     }
-    function se() {
+    function ie() {
       v.value = !v.value, w("update:showProfileDropDown", v.value);
     }
-    function ie() {
+    function re() {
       c.value = !c.value, w("update:burgerState", c.value);
     }
     let G = q(null), te = q(null);
-    function re() {
+    function ne() {
       G.value && G.value.blur();
     }
     return a({
-      defocusSearchButton: re
+      defocusSearchButton: ne
     }), (y, z) => (l(), i("div", Xs, [
       t("nav", null, [
         t("div", xs, [
@@ -2318,7 +2318,7 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
           e.usePortalSwitcher ? (l(), i("div", ni, [
             t("button", {
               class: "nav-portal-switcher-btn",
-              onClick: le
+              onClick: se
             }, ci),
             K(t("div", ui, [
               t("ul", _i, [
@@ -2330,7 +2330,7 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
                     default: $(() => [
                       t("a", {
                         href: j.link,
-                        onClick: z[1] || (z[1] = (W) => ne(u) ? u.value = !1 : u = !1)
+                        onClick: z[1] || (z[1] = (W) => de(u) ? u.value = !1 : u = !1)
                       }, [
                         t("img", {
                           src: j.icon
@@ -2353,7 +2353,7 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
             I(k) ? (l(), i("button", {
               key: 1,
               class: "nav-profile-dropdown-btn",
-              onClick: se
+              onClick: ie
             }, gi)) : h("", !0),
             K(t("div", bi, [
               d(y.$slots, "profile-dropdown-links", {}, void 0, !0)
@@ -2391,7 +2391,7 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
             t("button", {
               class: "mobile-burger-wrapper",
               "aria-label": "Toggle menu",
-              onClick: pe(ie, ["prevent"])
+              onClick: pe(re, ["prevent"])
             }, [
               t("img", {
                 width: "20",
@@ -2499,13 +2499,14 @@ const ji = /* @__PURE__ */ f(Ei, [["render", zi], ["__scopeId", "data-v-c07a6cf3
       return K((l(), i("div", Ki, [
         t("button", {
           class: "dropdown-button",
+          style: le({ "z-index": r.value ? 2 : 0 }),
           "aria-expanded": r.value ? "true" : "false",
           onClick: v[0] || (v[0] = (w) => r.value = !r.value)
         }, [
           d(b.$slots, "button", {}, () => [
             J(n(b.label), 1)
           ], !0)
-        ], 8, Ui),
+        ], 12, Ui),
         t("div", {
           class: m([{ hidden: !r.value, "adjust-height": u.value }, "dropdown-content"])
         }, [
@@ -2530,7 +2531,7 @@ const ji = /* @__PURE__ */ f(Ei, [["render", zi], ["__scopeId", "data-v-c07a6cf3
       ]);
     };
   }
-}), Ji = /* @__PURE__ */ f(Gi, [["__scopeId", "data-v-ffc98bac"]]), Wi = { class: "promo__content" }, Yi = { class: "pallet-jack__media-wrap" }, Qi = { class: "pallet-jack-link" }, Zi = { class: "pallet-jack__media-wrap__inner-wrap" }, Xi = { class: "pallet-jack__media-wrap__content-wrap" }, xi = { class: "regular-blue" }, er = /* @__PURE__ */ g({
+}), Ji = /* @__PURE__ */ f(Gi, [["__scopeId", "data-v-164647da"]]), Wi = { class: "promo__content" }, Yi = { class: "pallet-jack__media-wrap" }, Qi = { class: "pallet-jack-link" }, Zi = { class: "pallet-jack__media-wrap__inner-wrap" }, Xi = { class: "pallet-jack__media-wrap__content-wrap" }, xi = { class: "regular-blue" }, er = /* @__PURE__ */ g({
   __name: "pallet-jack",
   props: {
     label: { default: "" },