@mirweb/mir-web-components 0.17.49 → 0.17.50

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

@@ -1,4 +1,4 @@
-import { defineComponent as g, computed as L, openBlock as s, createElementBlock as i, normalizeClass as h, toDisplayString as n, createElementVNode as t, renderSlot as _, pushScopeId as E, popScopeId as R, createTextVNode as K, ref as I, withDirectives as Y, Fragment as M, renderList as O, vShow as Z, normalizeProps as P, guardReactiveProps as F, toRefs as ye, mergeProps as te, createVNode as w, Transition as $e, withCtx as k, withModifiers as ne, createBlock as C, createCommentVNode as m, watchEffect as de, withKeys as ke, useSlots as we, normalizeStyle as ae, isRef as ie, unref as V, onMounted as ce, watch as re, onUnmounted as Se } from "vue";
+import { defineComponent as g, computed as L, openBlock as s, createElementBlock as i, normalizeClass as h, toDisplayString as n, createElementVNode as t, renderSlot as _, pushScopeId as E, popScopeId as R, createTextVNode as K, ref as I, withDirectives as Q, Fragment as M, renderList as O, vShow as ee, normalizeProps as P, guardReactiveProps as F, toRefs as ye, mergeProps as te, createVNode as w, Transition as $e, withCtx as k, withModifiers as ne, createBlock as C, createCommentVNode as m, watchEffect as de, withKeys as ke, useSlots as we, normalizeStyle as ae, isRef as ie, unref as V, onMounted as ce, watch as re, onUnmounted as Se } from "vue";
 const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
   __name: "button",
   props: {
@@ -24,7 +24,7 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
   for (const [o, l] of a)
     r[o] = l;
   return r;
-}, X = /* @__PURE__ */ v(Ie, [["__scopeId", "data-v-a3e038ec"]]), qe = (e) => (E("data-v-42c44141"), e = e(), R(), e), Te = ["id", "name", "value", "disabled", "required"], Le = ["for"], Ve = /* @__PURE__ */ qe(() => /* @__PURE__ */ t("span", { class: "checkmark" }, null, -1)), Ce = /* @__PURE__ */ g({
+}, Z = /* @__PURE__ */ v(Ie, [["__scopeId", "data-v-a3e038ec"]]), qe = (e) => (E("data-v-42c44141"), e = e(), R(), e), Te = ["id", "name", "value", "disabled", "required"], Le = ["for"], Ve = /* @__PURE__ */ qe(() => /* @__PURE__ */ t("span", { class: "checkmark" }, null, -1)), Ce = /* @__PURE__ */ g({
   __name: "checkbox",
   props: {
     name: { default: "checkbox" },
@@ -104,7 +104,7 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
     const r = {
       primary: "dropdown-dark-bg-primary",
       dark: "dropdown-dark dropdown-dark-bg-dark"
-    }, o = e, l = L(() => r[o.variant]), u = I(null), c = I(null), p = I([]), S = I(0), f = I(""), y = I(!0), q = I(0), x = a, B = L(() => {
+    }, o = e, l = L(() => r[o.variant]), u = I(null), c = I(null), p = I([]), S = I(0), f = I(""), y = I(!0), q = I(0), X = a, B = L(() => {
       const d = o.options.find(
         (b) => b.value === o.modelValue
       );
@@ -119,13 +119,13 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
         document.body.removeEventListener("click", d.clickOutsideEvent);
       }
     };
-    function ee(d) {
-      x("update:modelValue", d);
+    function x(d) {
+      X("update:modelValue", d);
     }
     function H(d) {
       var $;
       const b = d.target;
-      b.getAttribute("role") === "option" && (W(b), Q(), ($ = u.value) == null || $.focus());
+      b.getAttribute("role") === "option" && (W(b), J(), ($ = u.value) == null || $.focus());
     }
     function le(d) {
       var $;
@@ -151,7 +151,7 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
           break;
         case "Enter":
         case "Escape":
-          d.preventDefault(), Q(), ($ = u.value) == null || $.focus();
+          d.preventDefault(), J(), ($ = u.value) == null || $.focus();
           break;
         default: {
           const T = me(b);
@@ -209,7 +209,7 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
       if (d.setAttribute("aria-selected", "true"), ($ = c.value) == null || $.setAttribute(
         "aria-activedescendant",
         b || ""
-      ), ee(b || ""), c.value && c.value.scrollHeight > c.value.clientHeight) {
+      ), x(b || ""), c.value && c.value.scrollHeight > c.value.clientHeight) {
         const N = c.value.clientHeight + c.value.scrollTop, U = d.offsetTop + d.offsetHeight;
         U > N ? c.value.scrollTop = U - ((T = c.value) == null ? void 0 : T.clientHeight) : d.offsetTop < c.value.scrollTop && (c.value.scrollTop = d.offsetTop);
       }
@@ -219,7 +219,7 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
       const d = (b = p.value) == null ? void 0 : b[o.options.length - 1];
       W(d);
     }
-    function Q() {
+    function J() {
       var d;
       y.value = !0, (d = u.value) == null || d.removeAttribute("aria-expanded");
     }
@@ -228,7 +228,7 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
       y.value = !1, (d = u.value) == null || d.setAttribute("aria-expanded", "true"), (b = c.value) == null || b.focus();
     }
     function ge() {
-      o.disabled || (y.value ? se() : Q());
+      o.disabled || (y.value ? se() : J());
     }
     return (d, b) => (s(), i("div", {
       ref: "listbox",
@@ -243,7 +243,7 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
           "is-required": d.required
         }, "listbox__label"])
       }, n(d.label), 11, Re),
-      Y((s(), i("div", Ne, [
+      Q((s(), i("div", Ne, [
         t("button", {
           id: `${d.name}-button-label`,
           ref_key: "listboxButton",
@@ -256,7 +256,7 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
           onClick: ge,
           onKeydown: _e
         }, n(d.modelValue ? B.value : d.placeholder), 43, He),
-        Y(t("ul", {
+        Q(t("ul", {
           ref_key: "listboxNode",
           ref: c,
           "aria-labelledby": `${d.name}-label`,
@@ -278,10 +278,10 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
             role: "option"
           }, n($.label), 9, je))), 128))
         ], 40, ze), [
-          [Z, !y.value]
+          [ee, !y.value]
         ])
       ])), [
-        [j, Q]
+        [j, J]
       ])
     ], 8, Ee));
   }
@@ -446,7 +446,8 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
         name: "nested"
       }, {
         default: k(() => [
-          Y(t("div", {
+          u.show ? (s(), i("div", {
+            key: 0,
             class: h(["overlay", u.searchBar ? "overlay-search" : "overlay-default"]),
             ariaLabel: "modal",
             role: "dialog",
@@ -459,7 +460,7 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
               }, ["stop"]))
             }, [
               t("div", null, [
-                u.searchBar ? m("", !0) : (s(), C(X, {
+                u.searchBar ? m("", !0) : (s(), C(Z, {
                   key: 0,
                   "aria-label": "close",
                   variant: "close",
@@ -468,15 +469,13 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
               ]),
               _(u.$slots, "default", {}, void 0, !0)
             ], 2)
-          ], 2), [
-            [Z, u.show]
-          ])
+          ], 2)) : m("", !0)
         ]),
         _: 3
       })
     ]));
   }
-}), ue = /* @__PURE__ */ v(ut, [["__scopeId", "data-v-80f0fb08"]]), _t = { class: "slider__wrapper" }, pt = { class: "slider__label" }, ht = ["for"], mt = ["aria-label"], vt = { class: "slider__content" }, ft = ["id", "name", "value", "min", "step", "max"], gt = /* @__PURE__ */ g({
+}), ue = /* @__PURE__ */ v(ut, [["__scopeId", "data-v-cc647ee6"]]), _t = { class: "slider__wrapper" }, pt = { class: "slider__label" }, ht = ["for"], mt = ["aria-label"], vt = { class: "slider__content" }, ft = ["id", "name", "value", "min", "step", "max"], gt = /* @__PURE__ */ g({
   __name: "slider",
   props: {
     label: {},
@@ -753,7 +752,7 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
       }, null, 8, Ht))
     ]));
   }
-}), J = /* @__PURE__ */ v(zt, [["__scopeId", "data-v-c6a0feb6"]]), jt = { class: "address__wrapper" }, Ut = { class: "address__content" }, Kt = { class: "address__flag" }, Gt = { class: "address__address" }, Wt = { class: "address__name" }, Yt = { key: 0 }, Jt = { class: "address__contact" }, Qt = ["href"], Zt = ["href"], Xt = /* @__PURE__ */ g({
+}), Y = /* @__PURE__ */ v(zt, [["__scopeId", "data-v-c6a0feb6"]]), jt = { class: "address__wrapper" }, Ut = { class: "address__content" }, Kt = { class: "address__flag" }, Gt = { class: "address__address" }, Wt = { class: "address__name" }, Yt = { key: 0 }, Jt = { class: "address__contact" }, Qt = ["href"], Zt = ["href"], Xt = /* @__PURE__ */ g({
   __name: "address",
   props: {
     name: {},
@@ -905,7 +904,7 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
           key: 1,
           class: h(["video-card__wrapper", V(r) === !0 ? "vimeoPlaying" : ""])
         }, [
-          w(J, {
+          w(Y, {
             play: V(r),
             "local-video": !0,
             src: c.videoSrc,
@@ -1211,7 +1210,7 @@ const Be = ["aria-label"], Ie = /* @__PURE__ */ g({
             })
           ])) : m("", !0),
           l.mediaLarge && l.mediaType === "video" ? (s(), i("div", al, [
-            w(J, {
+            w(Y, {
               src: l.mediaLarge.src,
               "local-video": "",
               "aria-label": l.mediaLarge.alt,
@@ -1516,7 +1515,7 @@ const Hl = /* @__PURE__ */ v(Fl, [["render", Nl], ["__scopeId", "data-v-9d5712e7
             l.reverse ? "promo__video--reverse" : "promo__video--default"
           ])
         }, [
-          w(J, {
+          w(Y, {
             src: l.src,
             "local-video": "",
             "aria-label": l.alt,
@@ -1991,11 +1990,11 @@ const wo = /* @__PURE__ */ v(fo, [["render", ko], ["__scopeId", "data-v-2881b194
       u.value = !u.value, p("update:burgerState", u.value);
     }
     let y = I(null), q = I(null);
-    function x() {
+    function X() {
       y.value && y.value.blur();
     }
     return a({
-      defocusSearchButton: x
+      defocusSearchButton: X
     }), (B, j) => (s(), i("div", gs, [
       t("nav", null, [
         t("div", bs, [
@@ -2013,10 +2012,10 @@ const wo = /* @__PURE__ */ v(fo, [["render", ko], ["__scopeId", "data-v-2881b194
               _(B.$slots, "dropdown-title", {}, void 0, !0),
               V(c) === !1 ? (s(), i("img", ws)) : (s(), i("img", Ss))
             ]),
-            Y(t("div", Bs, [
+            Q(t("div", Bs, [
               _(B.$slots, "dropdown-links", {}, void 0, !0)
             ], 512), [
-              [Z, V(c)]
+              [ee, V(c)]
             ])
           ], 512),
           t("div", Is, [
@@ -2024,7 +2023,7 @@ const wo = /* @__PURE__ */ v(fo, [["render", ko], ["__scopeId", "data-v-2881b194
               ref_key: "navSearchButton",
               ref: y,
               class: "search-icon",
-              onClick: j[0] || (j[0] = (ee) => {
+              onClick: j[0] || (j[0] = (x) => {
                 var H;
                 return B.$emit("clickSearch"), (H = V(y)) == null ? void 0 : H.blur();
               })
@@ -2051,7 +2050,7 @@ const wo = /* @__PURE__ */ v(fo, [["render", ko], ["__scopeId", "data-v-2881b194
                 ref: q,
                 class: "search-icon",
                 "aria-label": "Toggle search",
-                onClick: j[1] || (j[1] = (ee) => {
+                onClick: j[1] || (j[1] = (x) => {
                   var H;
                   return B.$emit("clickSearch"), (H = V(q)) == null ? void 0 : H.blur();
                 })
@@ -2077,7 +2076,7 @@ const wo = /* @__PURE__ */ v(fo, [["render", ko], ["__scopeId", "data-v-2881b194
               }, null, 8, As)
             ])
           ]),
-          Y(t("div", Ds, [
+          Q(t("div", Ds, [
             t("ul", null, [
               _(B.$slots, "mobile-main-nav-items", {}, void 0, !0)
             ]),
@@ -2086,7 +2085,7 @@ const wo = /* @__PURE__ */ v(fo, [["render", ko], ["__scopeId", "data-v-2881b194
               _(B.$slots, "mobile-dropdown-links", {}, void 0, !0)
             ])
           ], 512), [
-            [Z, V(u)]
+            [ee, V(u)]
           ])
         ], 2)
       ])
@@ -2131,14 +2130,14 @@ const wo = /* @__PURE__ */ v(fo, [["render", ko], ["__scopeId", "data-v-2881b194
   setup(e) {
     return (a, r) => (s(), i("div", Us, [
       t("div", Ks, [
-        w(X, {
+        w(Z, {
           disabled: e.isPreviousDisabled,
           variant: "previous",
           "aria-label": "previous",
           onClick: r[0] || (r[0] = (o) => a.$emit("previous"))
         }, null, 8, ["disabled"]),
         _(a.$slots, "pagination-numbers"),
-        w(X, {
+        w(Z, {
           disabled: e.isNextDisabled,
           variant: "next",
           "aria-label": "next",
@@ -2192,7 +2191,7 @@ const Zs = /* @__PURE__ */ v(Ys, [["render", Qs], ["__scopeId", "data-v-623adb82
           t("h3", null, n(e.headline), 1)
         ]),
         t("div", ti, [
-          e.videoSrc !== "" ? (s(), C(J, {
+          e.videoSrc !== "" ? (s(), C(Y, {
             key: 0,
             play: "",
             "local-video": !0,
@@ -2309,11 +2308,11 @@ const Zs = /* @__PURE__ */ v(Ys, [["render", Qs], ["__scopeId", "data-v-623adb82
   }
 }), _i = /* @__PURE__ */ v(ui, [["__scopeId", "data-v-8fdfddf2"]]), hi = {
   install: (e) => {
-    e.component("AtomButton", X), e.component("AtomCheckbox", Ae), e.component("AtomChip", Fe), e.component("AtomDropdown", Ke), e.component("AtomImage", A), e.component("AtomLabel", G), e.component("AtomLink", D), e.component("AtomRadioButton", lt), e.component("AtomSelect", dt), e.component("AtomSlider", bt), e.component("AtomTextarea", qt), e.component("AtomTextField", Et), e.component("AtomVideo", J), e.component("MoleculeAddress", xt), e.component("MoleculeBulletList", oa), e.component("MoleculeCard", da), e.component("MoleculeEventCard", fa), e.component("MoleculeModal", ue), e.component("MoleculeTextCard", ka), e.component("BlockFacts", Ca), e.component("BlockFeatures", Ra), e.component("BlockFormScript", Wa), e.component("BlockHeadline", dl), e.component("BlockHero", kl), e.component("BlockImage", xa), e.component("BlockImageGallery", sl), e.component("BlockLogoWall", Cl), e.component("BlockMicroStories", Pl), e.component("BlockPolicy", Hl), e.component("BlockProductHero", oi), e.component("BlockPromo", Zl), e.component("BlockQuote", uo), e.component("BlockRichText", vo), e.component("BlockRichTextColumns", wo), e.component("BlockTimeline", Do), e.component("BlockCardDisplay", Yl), e.component("BlockVimeo", Ro), e.component("BlockPalletJack", _i), e.component("Organism404", Ko), e.component("OrganismFilter", Zo), e.component("OrganismFooter", fs), e.component("OrganismHeader", Ps), e.component("OrganismLanguageSwitcher", js), e.component("OrganismPagination", Ws), e.component("OrganismSearch", Zs);
+    e.component("AtomButton", Z), e.component("AtomCheckbox", Ae), e.component("AtomChip", Fe), e.component("AtomDropdown", Ke), e.component("AtomImage", A), e.component("AtomLabel", G), e.component("AtomLink", D), e.component("AtomRadioButton", lt), e.component("AtomSelect", dt), e.component("AtomSlider", bt), e.component("AtomTextarea", qt), e.component("AtomTextField", Et), e.component("AtomVideo", Y), e.component("MoleculeAddress", xt), e.component("MoleculeBulletList", oa), e.component("MoleculeCard", da), e.component("MoleculeEventCard", fa), e.component("MoleculeModal", ue), e.component("MoleculeTextCard", ka), e.component("BlockFacts", Ca), e.component("BlockFeatures", Ra), e.component("BlockFormScript", Wa), e.component("BlockHeadline", dl), e.component("BlockHero", kl), e.component("BlockImage", xa), e.component("BlockImageGallery", sl), e.component("BlockLogoWall", Cl), e.component("BlockMicroStories", Pl), e.component("BlockPolicy", Hl), e.component("BlockProductHero", oi), e.component("BlockPromo", Zl), e.component("BlockQuote", uo), e.component("BlockRichText", vo), e.component("BlockRichTextColumns", wo), e.component("BlockTimeline", Do), e.component("BlockCardDisplay", Yl), e.component("BlockVimeo", Ro), e.component("BlockPalletJack", _i), e.component("Organism404", Ko), e.component("OrganismFilter", Zo), e.component("OrganismFooter", fs), e.component("OrganismHeader", Ps), e.component("OrganismLanguageSwitcher", js), e.component("OrganismPagination", Ws), e.component("OrganismSearch", Zs);
   }
 };
 export {
-  X as AtomButton,
+  Z as AtomButton,
   Ae as AtomCheckbox,
   Fe as AtomChip,
   Ke as AtomDropdown,
@@ -2325,7 +2324,7 @@ export {
   bt as AtomSlider,
   Et as AtomTextField,
   qt as AtomTextarea,
-  J as AtomVideo,
+  Y as AtomVideo,
   Yl as BlockCardDisplay,
   Ca as BlockFacts,
   Ra as BlockFeatures,