@mirweb/mir-web-components 1.4.5 → 1.4.7

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

@@ -1,4 +1,4 @@
-import { defineComponent as g, computed as T, openBlock as l, createElementBlock as i, normalizeClass as m, toDisplayString as n, createElementVNode as t, renderSlot as c, pushScopeId as H, popScopeId as R, createTextVNode as J, ref as I, 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 S, Transition as we, withCtx as $, withModifiers as pe, createBlock as C, createCommentVNode as h, watchEffect as he, withKeys as Se, useSlots as Be, normalizeStyle as ce, isRef as ne, unref as B, 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 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";
 const qe = ["aria-label"], Le = /* @__PURE__ */ g({
   __name: "button",
   props: {
@@ -14,8 +14,8 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
       close: "close",
       next: "next",
       previous: "previous"
-    }, r = e, s = T(() => a[r.variant]);
-    return (o, u) => (l(), i("button", {
+    }, r = e, s = C(() => a[r.variant]);
+    return (o, c) => (l(), i("button", {
       class: m(["button", "button--" + s.value]),
       "aria-label": o.ariaLabel
     }, n(s.value === "close" ? "" : o.buttonText), 11, qe));
@@ -25,7 +25,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
   for (const [s, o] of a)
     r[s] = o;
   return r;
-}, ae = /* @__PURE__ */ f(Le, [["__scopeId", "data-v-f61b579c"]]), De = (e) => (H("data-v-0c4c6d8e"), e = e(), R(), e), Ce = ["id", "name", "value", "disabled", "required", "checked"], Te = ["for"], Ve = /* @__PURE__ */ De(() => /* @__PURE__ */ t("span", { class: "checkmark" }, null, -1)), Ae = /* @__PURE__ */ g({
+}, oe = /* @__PURE__ */ f(Le, [["__scopeId", "data-v-f61b579c"]]), De = (e) => (H("data-v-0c4c6d8e"), e = e(), R(), e), Ce = ["id", "name", "value", "disabled", "required", "checked"], Te = ["for"], Ve = /* @__PURE__ */ De(() => /* @__PURE__ */ t("span", { class: "checkmark" }, null, -1)), Ae = /* @__PURE__ */ g({
   __name: "checkbox",
   props: {
     name: { default: "checkbox" },
@@ -38,10 +38,10 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
   emits: ["input"],
   setup(e, { emit: a }) {
     const r = a, s = (o) => {
-      const u = o.target;
-      r("input", u.checked);
+      const c = o.target;
+      r("input", c.checked);
     };
-    return (o, u) => (l(), i("div", {
+    return (o, c) => (l(), i("div", {
       class: m(["checkbox__wrapper", o.disabled ? "disabled" : ""])
     }, [
       t("input", {
@@ -60,7 +60,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
         class: m(["checkbox__label", o.required ? "required" : ""])
       }, [
         Ve,
-        c(o.$slots, "default", {}, void 0, !0)
+        d(o.$slots, "default", {}, void 0, !0)
       ], 10, Te)
     ], 2));
   }
@@ -75,10 +75,10 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
   },
   emits: ["remove-chip"],
   setup(e) {
-    const a = e, r = T(() => `Chip: ${a.text}`);
+    const a = e, r = C(() => `Chip: ${a.text}`);
     return (s, o) => (l(), i("div", {
       class: "chip__wrapper",
-      onClick: o[0] || (o[0] = (u) => s.$emit("remove-chip"))
+      onClick: o[0] || (o[0] = (c) => s.$emit("remove-chip"))
     }, [
       t("span", {
         class: "chip",
@@ -107,32 +107,32 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
     const r = {
       primary: "dropdown-dark-bg-primary",
       dark: "dropdown-dark dropdown-dark-bg-dark"
-    }, s = e, o = T(() => r[s.variant]), u = I(null), _ = I(null), d = I([]), k = I(0), v = I(""), b = I(!0), L = I(0), oe = a, le = T(() => {
+    }, 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(() => {
       const p = s.options.find(
-        (w) => w.value === s.modelValue
+        (S) => S.value === s.modelValue
       );
       return p && p.label;
     });
     function se(p) {
-      oe("update:modelValue", p);
+      ee("update:modelValue", p);
     }
     function ie(p) {
-      var q;
-      const w = p.target;
-      w.getAttribute("role") === "option" && (W(w), te(), (q = u.value) == null || q.focus());
+      var L;
+      const S = p.target;
+      S.getAttribute("role") === "option" && (W(S), ae(), (L = c.value) == null || L.focus());
     }
     function G(p) {
-      var q;
-      const w = p.key;
-      switch (w) {
+      var L;
+      const S = p.key;
+      switch (S) {
         case "ArrowUp":
         case "ArrowDown": {
           p.preventDefault();
           const D = s.options.findIndex(
             (Y) => Y.value === s.modelValue
           );
-          let O = D ? d.value[D] : d.value[0];
-          w === "ArrowUp" ? D - 1 >= 0 && (O = d.value[D - 1]) : D + 1 <= s.options.length && (O = d.value[D + 1]), O && W(O);
+          let O = D ? u.value[D] : u.value[0];
+          S === "ArrowUp" ? D - 1 >= 0 && (O = u.value[D - 1]) : D + 1 <= s.options.length && (O = u.value[D + 1]), O && W(O);
           break;
         }
         case "Home":
@@ -145,16 +145,16 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
           break;
         case "Enter":
         case "Escape":
-          p.preventDefault(), te(), (q = u.value) == null || q.focus();
+          p.preventDefault(), ae(), (L = c.value) == null || L.focus();
           break;
         default: {
-          const D = z(w);
+          const D = z(S);
           D && W(D);
           break;
         }
       }
     }
-    function ee(p) {
+    function te(p) {
       if (!s.disabled)
         switch (p.key) {
           case "ArrowUp":
@@ -167,65 +167,65 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
       p && p.removeAttribute("aria-selected");
     }
     function y() {
-      k.value && (clearTimeout(k.value), k.value = 0), k.value = setTimeout(() => {
-        v.value = "", k.value = 0;
+      b.value && (clearTimeout(b.value), b.value = 0), b.value = setTimeout(() => {
+        v.value = "", b.value = 0;
       }, 500);
     }
     function z(p) {
-      let w = "";
-      (v.value === "" || w !== p) && (L.value = s.options.findIndex(
+      let S = "";
+      (v.value === "" || S !== p) && (w.value = s.options.findIndex(
         (D) => D.value === s.modelValue
-      )), v.value = w === p ? p : v.value + p, w = p, y();
-      let q = j(
-        L.value + 1,
+      )), v.value = S === p ? p : v.value + p, S = p, y();
+      let L = j(
+        w.value + 1,
         s.options.length
       );
-      return !q && v.value.length === 1 && (q = j(0, L.value)), L.value = (L.value + 1) % s.options.length, q;
+      return !L && v.value.length === 1 && (L = j(0, w.value)), w.value = (w.value + 1) % s.options.length, L;
     }
-    function j(p, w) {
-      for (let q = p; q < w; q++)
-        if (s.options[q].label && s.options[q].label.toUpperCase().indexOf(v.value.toUpperCase()) === 0)
-          return d.value[q];
+    function j(p, S) {
+      for (let L = p; L < S; L++)
+        if (s.options[L].label && s.options[L].label.toUpperCase().indexOf(v.value.toUpperCase()) === 0)
+          return u.value[L];
       return null;
     }
     function E() {
-      W(d.value[0]);
+      W(u.value[0]);
     }
     function W(p) {
-      var q, D;
-      const w = p.getAttribute("data-value");
+      var L, D;
+      const S = p.getAttribute("data-value");
       if (s.modelValue) {
         const O = s.options.findIndex(
           ($e) => $e.value === s.modelValue
-        ), Y = d.value[O];
+        ), Y = u.value[O];
         re(Y);
       }
-      if (p.setAttribute("aria-selected", "true"), (q = _.value) == null || q.setAttribute(
+      if (p.setAttribute("aria-selected", "true"), (L = _.value) == null || L.setAttribute(
         "aria-activedescendant",
-        w || ""
-      ), se(w || ""), _.value && _.value.scrollHeight > _.value.clientHeight) {
+        S || ""
+      ), se(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);
       }
     }
     function be() {
-      var w;
-      const p = (w = d.value) == null ? void 0 : w[s.options.length - 1];
+      var S;
+      const p = (S = u.value) == null ? void 0 : S[s.options.length - 1];
       W(p);
     }
-    function te() {
+    function ae() {
       var p;
-      b.value = !0, (p = u.value) == null || p.removeAttribute("aria-expanded");
+      k.value = !0, (p = c.value) == null || p.removeAttribute("aria-expanded");
     }
     function ue() {
-      var p, w;
-      b.value = !1, (p = u.value) == null || p.setAttribute("aria-expanded", "true"), (w = _.value) == null || w.focus();
+      var p, S;
+      k.value = !1, (p = c.value) == null || p.setAttribute("aria-expanded", "true"), (S = _.value) == null || S.focus();
     }
     function ye() {
-      s.disabled || (b.value ? ue() : te());
+      s.disabled || (k.value ? ue() : ae());
     }
-    return (p, w) => {
-      const q = _e("click-outside");
+    return (p, S) => {
+      const L = _e("click-outside");
       return l(), i("div", {
         ref: "listbox",
         class: "listbox__wrapper",
@@ -243,14 +243,14 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
           t("button", {
             id: `${p.name}-button-label`,
             ref_key: "listboxButton",
-            ref: u,
+            ref: c,
             "aria-labelledby": `${p.name}-label ${p.name}-button-label`,
             type: "button",
             "aria-haspopup": "listbox",
             "aria-disabled": p.disabled,
             class: m(["listbox__button", o.value]),
             onClick: ye,
-            onKeydown: ee
+            onKeydown: te
           }, n(p.modelValue ? le.value : p.placeholder), 43, ze),
           K(t("ul", {
             ref_key: "listboxNode",
@@ -267,17 +267,17 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
               key: `${p.name}-option-${O}`,
               ref_for: !0,
               ref_key: "listboxOptions",
-              ref: d,
+              ref: u,
               "aria-selected": D.value === p.modelValue,
               "data-value": D.value,
               class: "listbox__option",
               role: "option"
             }, n(D.label), 9, Ke))), 128))
           ], 40, je), [
-            [Z, !b.value]
+            [Z, !k.value]
           ])
         ])), [
-          [q, te]
+          [L, ae]
         ])
       ], 8, Re);
     };
@@ -295,7 +295,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
   },
   setup(e) {
     return (a, r) => (l(), i("div", Je, [
-      c(a.$slots, "default", F(N(a.$attrs)))
+      d(a.$slots, "default", F(N(a.$attrs)))
     ]));
   }
 }), M = /* @__PURE__ */ f(We, [["__scopeId", "data-v-e10217bd"]]), Ye = { class: "label__wrapper" }, Qe = ["aria-label", "label-dark"], Ze = /* @__PURE__ */ g({
@@ -305,7 +305,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
     labelDark: { type: Boolean, default: !1 }
   },
   setup(e) {
-    const a = e, r = T(() => `Label: ${a.text}`);
+    const a = e, r = C(() => `Label: ${a.text}`);
     return (s, o) => (l(), i("div", Ye, [
       t("span", {
         "aria-label": r.value,
@@ -336,20 +336,20 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
       hover: "underline-hover",
       true: "add-underline",
       false: "remove-underline"
-    }, s = e, o = T(() => a[s.linkType]), u = T(() => r[s.underline]), _ = T(() => {
-      const { ...d } = ke(s);
-      return d;
+    }, s = e, o = C(() => a[s.linkType]), c = C(() => r[s.underline]), _ = C(() => {
+      const { ...u } = ke(s);
+      return u;
     });
-    return (d, k) => (l(), i("div", Xe, [
+    return (u, b) => (l(), i("div", Xe, [
       t("div", de(_.value, {
         class: ["mir-link", [
           o.value,
-          d.disabled ? "disabled" : "",
-          u.value,
-          d.arrow ? "link-arrow" : ""
+          u.disabled ? "disabled" : "",
+          c.value,
+          u.arrow ? "link-arrow" : ""
         ]]
       }), [
-        c(d.$slots, "default")
+        d(u.$slots, "default")
       ], 16)
     ]));
   }
@@ -366,10 +366,10 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
   emits: ["input"],
   setup(e, { emit: a }) {
     const r = a, s = (o) => {
-      const u = o.target;
-      r("input", u.checked);
+      const c = o.target;
+      r("input", c.checked);
     };
-    return (o, u) => (l(), i("div", {
+    return (o, c) => (l(), i("div", {
       class: m(["radio__wrapper", o.disabled ? "disabled" : ""])
     }, [
       t("input", {
@@ -388,7 +388,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
         class: m(["radio__label", o.required ? "required" : ""])
       }, [
         at,
-        c(o.$slots, "default", {}, void 0, !0)
+        d(o.$slots, "default", {}, void 0, !0)
       ], 10, tt)
     ], 2));
   }
@@ -438,36 +438,36 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
     const r = e, s = a, o = () => {
       s("update:show", !r.show);
     };
-    return (u, _) => (l(), i("div", ut, [
-      S(we, {
+    return (c, _) => (l(), i("div", ut, [
+      B(we, {
         duration: 300,
         name: "nested"
       }, {
         default: $(() => [
           K(t("div", {
-            class: m(["overlay", u.searchBar ? "overlay-search" : "overlay-default"]),
+            class: m(["overlay", c.searchBar ? "overlay-search" : "overlay-default"]),
             ariaLabel: "modal",
             role: "dialog",
             onClick: o
           }, [
             t("div", {
               id: "modal",
-              class: m([u.searchBar ? "search" : ""]),
+              class: m([c.searchBar ? "search" : ""]),
               onClick: _[0] || (_[0] = pe(() => {
               }, ["stop"]))
             }, [
               t("div", null, [
-                u.searchBar ? h("", !0) : (l(), C(ae, {
+                c.searchBar ? h("", !0) : (l(), T(oe, {
                   key: 0,
                   "aria-label": "close",
                   variant: "close",
                   onClick: o
                 }))
               ]),
-              c(u.$slots, "default", {}, void 0, !0)
+              d(c.$slots, "default", {}, void 0, !0)
             ], 2)
           ], 2), [
-            [Z, u.show]
+            [Z, c.show]
           ])
         ]),
         _: 3
@@ -490,18 +490,18 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
   },
   emits: ["update:modelValue"],
   setup(e, { emit: a }) {
-    const r = e, s = a, o = I(r.modelValue), u = I(), _ = I(!1), d = (v, b, L) => (v - b) / (L - b) * 100, k = (v) => {
-      var b;
-      (b = u.value) == null || b.style.setProperty("--ProgressPercent", `${v}%`);
+    const r = e, s = a, o = q(r.modelValue), c = q(), _ = q(!1), u = (v, k, w) => (v - k) / (w - k) * 100, b = (v) => {
+      var k;
+      (k = c.value) == null || k.style.setProperty("--ProgressPercent", `${v}%`);
     };
     return he(() => {
-      if (u.value) {
+      if (c.value) {
         s("update:modelValue", o.value);
-        const v = d(o.value, r.min, r.max);
-        let b = (50 - v) / 100;
-        k(v + b);
+        const v = u(o.value, r.min, r.max);
+        let k = (50 - v) / 100;
+        b(v + k);
       }
-    }), (v, b) => (l(), i("div", null, [
+    }), (v, k) => (l(), i("div", null, [
       t("div", pt, [
         t("div", ht, [
           t("label", {
@@ -515,8 +515,8 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
             "aria-label": v.informationLabel,
             tabindex: "0",
             "aria-haspopup": "dialog",
-            onClick: b[0] || (b[0] = (L) => _.value = !_.value),
-            onKeyup: b[1] || (b[1] = Se((L) => _.value = !_.value, ["enter"]))
+            onClick: k[0] || (k[0] = (w) => _.value = !_.value),
+            onKeyup: k[1] || (k[1] = Se((w) => _.value = !_.value, ["enter"]))
           }, null, 42, vt)) : h("", !0)
         ]),
         t("div", ft, [
@@ -526,7 +526,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
           t("input", {
             id: v.id,
             ref_key: "slider",
-            ref: u,
+            ref: c,
             type: "range",
             name: v.name,
             value: v.modelValue,
@@ -534,7 +534,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
             step: v.step,
             max: v.max,
             class: m(v.variant),
-            onInput: b[2] || (b[2] = ({ target: L }) => o.value = parseFloat(L.value))
+            onInput: k[2] || (k[2] = ({ target: w }) => o.value = parseFloat(w.value))
           }, null, 42, gt),
           t("span", {
             class: m([v.variant, "slider__minmax"])
@@ -544,10 +544,10 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
           class: m([v.variant, "slider__value"])
         }, n(v.modelValue), 3)
       ]),
-      v.information ? (l(), C(fe, {
+      v.information ? (l(), T(fe, {
         key: 0,
         show: _.value,
-        "onUpdate:show": b[3] || (b[3] = (L) => _.value = L)
+        "onUpdate:show": k[3] || (k[3] = (w) => _.value = w)
       }, {
         default: $(() => [
           t("p", bt, n(v.information), 1)
@@ -642,59 +642,59 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
       tel: "tel",
       url: "url",
       search: "search"
-    }, r = e, s = T(() => a[r.type]), o = I(!0), u = T(
+    }, r = e, s = C(() => a[r.type]), o = q(!0), c = C(
       () => o.value ? "showPassword" : "hidePassword"
-    ), _ = T(
+    ), _ = C(
       () => o.value ? "password" : "text"
     );
-    return (d, k) => (l(), i("div", Ct, [
+    return (u, b) => (l(), i("div", Ct, [
       t("label", {
-        for: d.id,
+        for: u.id,
         class: m([
-          d.required ? "required" : "",
-          d.disabled ? "disabled" : "",
-          d.search ? "search" : ""
+          u.required ? "required" : "",
+          u.disabled ? "disabled" : "",
+          u.search ? "search" : ""
         ])
-      }, n(d.label), 11, Tt),
+      }, n(u.label), 11, Tt),
       s.value === "password" ? (l(), i("div", Vt, [
         t("input", {
-          id: d.id,
+          id: u.id,
           ref: "passwordField",
           type: _.value,
-          value: d.modelValue,
-          placeholder: d.placeholder,
-          required: d.required,
-          disabled: d.disabled,
-          name: d.fieldName,
-          onInput: k[0] || (k[0] = (v) => d.$emit("update:modelValue", v.target.value))
+          value: u.modelValue,
+          placeholder: u.placeholder,
+          required: u.required,
+          disabled: u.disabled,
+          name: u.fieldName,
+          onInput: b[0] || (b[0] = (v) => u.$emit("update:modelValue", v.target.value))
         }, null, 40, At),
         t("i", {
           role: "button",
-          class: m([u.value]),
+          class: m([c.value]),
           "aria-controls": "password",
           "aria-expanded": !o.value,
-          onClick: k[1] || (k[1] = (v) => o.value = !o.value)
+          onClick: b[1] || (b[1] = (v) => o.value = !o.value)
         }, null, 10, Pt)
       ])) : (l(), i("input", {
         key: 1,
-        id: d.id,
+        id: u.id,
         ref: "textField",
         type: s.value,
-        value: d.modelValue,
-        placeholder: d.placeholder,
-        required: d.required,
+        value: u.modelValue,
+        placeholder: u.placeholder,
+        required: u.required,
         class: m([
-          d.invalid ? "invalid" : "",
-          d.valid ? "valid" : "",
-          d.search ? "search" : ""
+          u.invalid ? "invalid" : "",
+          u.valid ? "valid" : "",
+          u.search ? "search" : ""
         ]),
-        disabled: d.disabled,
-        name: d.fieldName,
-        onInput: k[2] || (k[2] = (v) => d.$emit("update:modelValue", v.target.value))
+        disabled: u.disabled,
+        name: u.fieldName,
+        onInput: b[2] || (b[2] = (v) => u.$emit("update:modelValue", v.target.value))
       }, null, 42, Mt)),
-      d.search ? (l(), i("i", Ot)) : h("", !0),
-      d.errorMessage ? (l(), i("strong", Ft, n(d.errorMessage), 1)) : h("", !0),
-      d.helperText ? (l(), i("span", Ht, n(d.helperText), 1)) : h("", !0)
+      u.search ? (l(), i("i", Ot)) : h("", !0),
+      u.errorMessage ? (l(), i("strong", Ft, n(u.errorMessage), 1)) : h("", !0),
+      u.helperText ? (l(), i("span", Ht, n(u.helperText), 1)) : h("", !0)
     ]));
   }
 }), Et = /* @__PURE__ */ f(Rt, [["__scopeId", "data-v-414b9435"]]), Nt = { class: "video__wrapper" }, zt = ["aria-label", "controls", "poster", "width", "height", "autoplay", "loop", "muted", "src"], jt = ["src", "aria-label", "title", "width", "height"], Kt = /* @__PURE__ */ g({
@@ -715,36 +715,36 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
   },
   setup(e, { expose: a }) {
     const r = e;
-    let s = I(null);
+    let s = q(null);
     return he(() => {
       s.value && (r.play ? s.value.play() : r.play || s.value.pause());
     }), a({
       resetVideo: () => {
         s.value && (s.value.currentTime = 0, s.value.play());
       }
-    }), (u, _) => (l(), i("div", Nt, [
-      u.localVideo ? (l(), i("video", {
+    }), (c, _) => (l(), i("div", Nt, [
+      c.localVideo ? (l(), i("video", {
         key: 0,
         ref_key: "videoRef",
         ref: s,
-        "aria-label": u.ariaLabel,
-        controls: u.controls,
-        poster: u.poster,
-        width: u.width,
-        height: u.height,
-        autoplay: u.autoplay,
-        loop: u.loop,
-        muted: u.muted,
+        "aria-label": c.ariaLabel,
+        controls: c.controls,
+        poster: c.poster,
+        width: c.width,
+        height: c.height,
+        autoplay: c.autoplay,
+        loop: c.loop,
+        muted: c.muted,
         type: "video/mp4",
         playsinline: "",
-        src: u.src
+        src: c.src
       }, null, 8, zt)) : (l(), i("iframe", {
         key: 1,
-        src: u.src,
-        "aria-label": u.ariaLabel,
-        title: u.title,
-        width: u.width,
-        height: u.height,
+        src: c.src,
+        "aria-label": c.ariaLabel,
+        title: c.title,
+        width: c.width,
+        height: c.height,
         frameborder: "0",
         allow: "autoplay; fullscreen",
         allowfullscreen: ""
@@ -767,7 +767,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
     return (a, r) => (l(), i("div", Ut, [
       t("div", Gt, [
         t("div", Jt, [
-          c(a.$slots, "address-flag", {}, void 0, !0)
+          d(a.$slots, "address-flag", {}, void 0, !0)
         ]),
         t("div", Wt, [
           t("p", Yt, n(a.name), 1),
@@ -777,7 +777,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
           a.addressLine3 ? (l(), i("p", Qt, n(a.addressLine3), 1)) : h("", !0)
         ]),
         t("div", Zt, [
-          a.website ? (l(), C(V, {
+          a.website ? (l(), T(V, {
             key: 0,
             underline: "false",
             "link-type": "regular"
@@ -790,7 +790,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
             ]),
             _: 1
           })) : h("", !0),
-          (l(!0), i(A, null, P(a.phoneNumbers, (s) => (l(), C(V, {
+          (l(!0), i(A, null, P(a.phoneNumbers, (s) => (l(), T(V, {
             key: s,
             underline: "false",
             "link-type": "regular"
@@ -867,7 +867,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
   emits: ["clicked"],
   setup(e) {
     const a = Be();
-    let r = I(!1);
+    let r = q(!1);
     const s = {
       small: {
         class: "card--small",
@@ -884,23 +884,23 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
         width: "596",
         height: "335"
       }
-    }, o = e, u = T(() => s[o.size]);
-    return (_, d) => (l(), i("div", na, [
+    }, o = e, c = C(() => s[o.size]);
+    return (_, u) => (l(), i("div", na, [
       t("div", {
         class: m(["card", [
           _.theme === "dark" ? "card--dark" : "card--light",
           _.orientation === "vertical" ? "vertical" : "horizontal",
-          u.value.class,
+          c.value.class,
           _.size === "large" && _.variant === "article" ? "card--large-article" : "",
           _.variant === "product" ? "card--product" : "card--article"
         ]]),
         style: ce([_.variant === "product" ? "font-weight: 700" : "font-weight: 300"]),
-        onMouseover: d[0] || (d[0] = (k) => ne(r) ? r.value = !0 : r = !0),
-        onMouseout: d[1] || (d[1] = (k) => ne(r) ? r.value = !1 : r = !1)
+        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)
       }, [
-        _.mediaType === "image" ? (l(), C(M, { key: 0 }, {
+        _.mediaType === "image" ? (l(), T(M, { key: 0 }, {
           default: $(() => [
-            c(_.$slots, "card-image", de({
+            d(_.$slots, "card-image", de({
               src: _.imgSrc,
               width: "596",
               height: "335",
@@ -912,24 +912,24 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
           _: 3
         })) : (l(), i("div", {
           key: 1,
-          class: m(["video-card__wrapper", B(r) === !0 ? "vimeoPlaying" : ""])
+          class: m(["video-card__wrapper", I(r) === !0 ? "vimeoPlaying" : ""])
         }, [
-          S(x, {
-            play: B(r),
+          B(x, {
+            play: I(r),
             "local-video": !0,
             src: _.videoSrc,
             "aria-label": _.arialabel,
             controls: !1,
             poster: _.imgSrc,
-            width: u.value.width,
-            height: u.value.height,
+            width: c.value.width,
+            height: c.value.height,
             autoplay: !0,
             loop: !0,
             muted: !0
           }, null, 8, ["play", "src", "aria-label", "poster", "width", "height"])
         ], 2)),
-        B(a)["card-label"] ? (l(), i("div", da, [
-          c(_.$slots, "card-label")
+        I(a)["card-label"] ? (l(), i("div", da, [
+          d(_.$slots, "card-label")
         ])) : h("", !0),
         _.variant === "product" ? (l(), i("div", {
           key: 3,
@@ -975,7 +975,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
   },
   setup(e) {
     return (a, r) => (l(), i("div", ha, [
-      S(X, {
+      B(X, {
         "label-dark": !1,
         text: e.eventType ? e.eventType : ""
       }, null, 8, ["text"]),
@@ -1006,7 +1006,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
   },
   setup(e) {
     return (a, r) => (l(), i("div", $a, [
-      S(X, {
+      B(X, {
         "label-dark": !1,
         text: e.label ? e.label : ""
       }, null, 8, ["text"]),
@@ -1048,7 +1048,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
           e.paragraph ? (l(), i("p", Da, n(e.paragraph), 1)) : h("", !0)
         ])) : h("", !0),
         t("div", Ca, [
-          c(a.$slots, "card-display-cards", {}, void 0, !0)
+          d(a.$slots, "card-display-cards", {}, void 0, !0)
         ])
       ])
     ], 2));
@@ -1097,12 +1097,12 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
           ]))), 128))
         ]),
         a.link ? (l(), i("div", Ra, [
-          S(V, {
+          B(V, {
             "link-type": "regular_light",
             arrow: ""
           }, {
             default: $(() => [
-              c(a.$slots, "facts-link", {}, void 0, !0)
+              d(a.$slots, "facts-link", {}, void 0, !0)
             ]),
             _: 3
           })
@@ -1130,7 +1130,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
           t("h2", null, n(a.headline), 1)
         ])) : h("", !0),
         a.body ? (l(), i("div", Ua, [
-          c(a.$slots, "features-body", {}, void 0, !0)
+          d(a.$slots, "features-body", {}, void 0, !0)
         ])) : h("", !0),
         t("div", {
           class: m(["features__elements", [a.elements.length === 6 ? "features__elements--grid-6" : ""]])
@@ -1139,9 +1139,9 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
             key: s.headline,
             class: "features__element"
           }, [
-            S(M, { class: "element__icon" }, {
+            B(M, { class: "element__icon" }, {
               default: $(() => [
-                c(a.$slots, "features-icon", F(N({
+                d(a.$slots, "features-icon", F(N({
                   src: s.icon.src,
                   height: 30,
                   width: 30,
@@ -1171,11 +1171,11 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
         t("div", Xa, [
           t("h2", xa, n(e.headline), 1),
           t("div", eo, [
-            c(a.$slots, "form-body", {}, void 0, !0)
+            d(a.$slots, "form-body", {}, void 0, !0)
           ])
         ]),
         t("div", to, [
-          c(a.$slots, "form-script", {}, void 0, !0)
+          d(a.$slots, "form-script", {}, void 0, !0)
         ])
       ])
     ]));
@@ -1227,12 +1227,12 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
               t("h1", null, n(e.headline), 1)
             ]),
             t("div", mo, [
-              S(V, {
+              B(V, {
                 "link-type": "regular_light",
                 arrow: ""
               }, {
                 default: $(() => [
-                  c(a.$slots, "hero-link", {}, void 0, !0)
+                  d(a.$slots, "hero-link", {}, void 0, !0)
                 ]),
                 _: 3
               })
@@ -1242,10 +1242,10 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
         t("div", vo, [
           fo,
           t("div", go, [
-            c(a.$slots, "hero-video", {}, void 0, !0)
+            d(a.$slots, "hero-video", {}, void 0, !0)
           ]),
           t("div", bo, [
-            c(a.$slots, "hero-image", {}, void 0, !0)
+            d(a.$slots, "hero-image", {}, void 0, !0)
           ])
         ])
       ])
@@ -1278,9 +1278,9 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
     return (a, r) => (l(), i("div", ko, [
       t("div", wo, [
         t("div", So, [
-          S(M, null, {
+          B(M, null, {
             default: $(() => [
-              c(a.$slots, "image", F(N({
+              d(a.$slots, "image", F(N({
                 width: 984,
                 height: e.fullHeight ? "100%" : 554,
                 src: e.src,
@@ -1320,8 +1320,8 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
       white: "",
       light: "gallery__wrapper--light",
       dark: "gallery__wrapper--dark mirsaic--dark"
-    }, r = e, s = T(() => a[r.bgColor]);
-    return (o, u) => (l(), i("div", {
+    }, r = e, s = C(() => a[r.bgColor]);
+    return (o, c) => (l(), i("div", {
       class: m(["gallery__wrapper", s.value])
     }, [
       t("div", {
@@ -1332,9 +1332,9 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
       }, [
         t("div", Lo, [
           o.mediaLarge && o.mediaType === "image" ? (l(), i("div", Do, [
-            S(M, null, {
+            B(M, null, {
               default: $(() => [
-                c(o.$slots, "image-large", F(N({
+                d(o.$slots, "image-large", F(N({
                   width: 617,
                   height: 530,
                   src: o.mediaLarge.src,
@@ -1345,7 +1345,7 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
             })
           ])) : h("", !0),
           o.mediaLarge && o.mediaType === "video" ? (l(), i("div", Co, [
-            S(x, {
+            B(x, {
               src: o.mediaLarge.src,
               "local-video": "",
               "aria-label": o.mediaLarge.alt,
@@ -1370,9 +1370,9 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
             key: _.src + _.alt,
             class: "image image--small"
           }, [
-            S(M, null, {
+            B(M, null, {
               default: $(() => [
-                c(o.$slots, "image-small", F(N({
+                d(o.$slots, "image-small", F(N({
                   width: 328,
                   height: 246,
                   src: _.src,
@@ -1421,9 +1421,9 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
             key: s.src + s.alt,
             class: "logo-wall__logo"
           }, [
-            S(M, null, {
+            B(M, null, {
               default: $(() => [
-                c(a.$slots, "logo-wall-logo", F(N({
+                d(a.$slots, "logo-wall-logo", F(N({
                   width: 130,
                   height: 130,
                   src: s.src,
@@ -1435,12 +1435,12 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
           ]))), 128))
         ]),
         t("div", Eo, [
-          S(V, {
+          B(V, {
             "link-type": "regular_light",
             arrow: !0
           }, {
             default: $(() => [
-              c(a.$slots, "logo-wall-link", {}, void 0, !0)
+              d(a.$slots, "logo-wall-link", {}, void 0, !0)
             ]),
             _: 3
           })
@@ -1466,8 +1466,8 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
       white: "micro-stories__wrapper--white",
       blue: "micro-stories__wrapper--blue",
       dark: "micro-stories__wrapper--dark"
-    }, r = T(() => a[s.bgColor]), s = e;
-    return (o, u) => (l(), i("div", {
+    }, r = C(() => a[s.bgColor]), s = e;
+    return (o, c) => (l(), i("div", {
       class: m(["micro-stories__wrapper", r.value])
     }, [
       t("div", jo, [
@@ -1479,16 +1479,16 @@ const qe = ["aria-label"], Le = /* @__PURE__ */ g({
         ])) : h("", !0)
       ]),
       t("div", Go, [
-        c(o.$slots, "micro-stories-slides")
+        d(o.$slots, "micro-stories-slides")
       ]),
-      c(o.$slots, "micro-stories-controls")
+      d(o.$slots, "micro-stories-controls")
     ], 2));
   }
 }), Wo = {}, Yo = { class: "policy__wrapper" }, Qo = { class: "policy__content" };
 function Zo(e, a) {
   return l(), i("div", Yo, [
     t("div", Qo, [
-      c(e.$slots, "default", {}, void 0, !0)
+      d(e.$slots, "default", {}, void 0, !0)
     ])
   ]);
 }
@@ -1537,7 +1537,7 @@ const Xo = /* @__PURE__ */ f(Wo, [["render", Zo], ["__scopeId", "data-v-ea887d7a
       t("div", el, [
         t("div", tl, n(e.headline), 1),
         t("div", al, [
-          e.videoSrc !== "" ? (l(), C(x, {
+          e.videoSrc !== "" ? (l(), T(x, {
             key: 0,
             play: "",
             "local-video": !0,
@@ -1548,25 +1548,25 @@ const Xo = /* @__PURE__ */ f(Wo, [["render", Zo], ["__scopeId", "data-v-ea887d7a
             autoplay: "",
             loop: "",
             muted: ""
-          }, null, 8, ["src", "aria-label", "poster"])) : (l(), C(B(M), { key: 1 }, {
+          }, null, 8, ["src", "aria-label", "poster"])) : (l(), T(I(M), { key: 1 }, {
             default: $(() => [
-              c(a.$slots, "product-hero-image", {}, void 0, !0)
+              d(a.$slots, "product-hero-image", {}, void 0, !0)
             ]),
             _: 3
           })),
           t("div", ol, [
             e.logoSrc ? (l(), i("div", ll, [
-              S(B(M), null, {
+              B(I(M), null, {
                 default: $(() => [
-                  c(a.$slots, "product-hero-logo", {}, void 0, !0)
+                  d(a.$slots, "product-hero-logo", {}, void 0, !0)
                 ]),
                 _: 3
               })
             ])) : h("", !0),
             e.isCertified ? (l(), i("div", sl, [
-              S(B(M), null, {
+              B(I(M), null, {
                 default: $(() => [
-                  c(a.$slots, "product-hero-certification", {}, void 0, !0)
+                  d(a.$slots, "product-hero-certification", {}, void 0, !0)
                 ]),
                 _: 3
               })
@@ -1596,8 +1596,8 @@ const Xo = /* @__PURE__ */ f(Wo, [["render", Zo], ["__scopeId", "data-v-ea887d7a
       dark: "promo__wrapper--dark",
       light: "promo__wrapper--light",
       default: "promo__wrapper--default"
-    }, r = e, s = T(() => a[r.variant]);
-    return (o, u) => (l(), i("div", {
+    }, r = e, s = C(() => a[r.variant]);
+    return (o, c) => (l(), i("div", {
       class: m([
         "promo__wrapper",
         s.value,
@@ -1613,9 +1613,9 @@ const Xo = /* @__PURE__ */ f(Wo, [["render", Zo], ["__scopeId", "data-v-ea887d7a
             o.reverse ? "promo__image--reverse" : "promo__image--default"
           ])
         }, [
-          S(M, null, {
+          B(M, null, {
             default: $(() => [
-              c(o.$slots, "promo-image", F(N({ src: o.src, width: 1920, alt: o.alt, height: 1080 })))
+              d(o.$slots, "promo-image", F(N({ src: o.src, width: 1920, alt: o.alt, height: 1080 })))
             ]),
             _: 3
           })
@@ -1627,7 +1627,7 @@ const Xo = /* @__PURE__ */ f(Wo, [["render", Zo], ["__scopeId", "data-v-ea887d7a
             o.reverse ? "promo__video--reverse" : "promo__video--default"
           ])
         }, [
-          S(x, {
+          B(x, {
             src: o.src,
             "local-video": "",
             "aria-label": o.alt,
@@ -1645,7 +1645,7 @@ const Xo = /* @__PURE__ */ f(Wo, [["render", Zo], ["__scopeId", "data-v-ea887d7a
             o.reverse ? "promo__text--reverse" : "promo__text--default"
           ])
         }, [
-          o.label ? (l(), C(X, {
+          o.label ? (l(), T(X, {
             key: 0,
             text: o.label,
             "label-dark": o.variant === "dark"
@@ -1656,24 +1656,24 @@ const Xo = /* @__PURE__ */ f(Wo, [["render", Zo], ["__scopeId", "data-v-ea887d7a
               o.variant === "dark" ? "promo__title--dark" : ""
             ])
           }, [
-            c(o.$slots, "promo-headline")
+            d(o.$slots, "promo-headline")
           ], 2),
-          o.linkType === "link" ? (l(), C(V, {
+          o.linkType === "link" ? (l(), T(V, {
             key: 1,
             "link-type": o.variant === "dark" ? "regular_dark" : (o.variant === "light", "regular_light"),
             arrow: ""
           }, {
             default: $(() => [
-              c(o.$slots, "promo-link")
+              d(o.$slots, "promo-link")
             ]),
             _: 3
           }, 8, ["link-type"])) : h("", !0),
-          o.linkType === "button" ? (l(), C(V, {
+          o.linkType === "button" ? (l(), T(V, {
             key: 2,
             "link-type": o.variant === "dark" ? "secondary_dark" : (o.variant === "light", "secondary")
           }, {
             default: $(() => [
-              c(o.$slots, "promo-link")
+              d(o.$slots, "promo-link")
             ]),
             _: 3
           }, 8, ["link-type"])) : h("", !0)
@@ -1713,9 +1713,9 @@ const Xo = /* @__PURE__ */ f(Wo, [["render", Zo], ["__scopeId", "data-v-ea887d7a
           t("p", vl, n(e.quote), 1),
           t("div", fl, [
             e.authorImage ? (l(), i("div", gl, [
-              S(M, null, {
+              B(M, null, {
                 default: $(() => [
-                  c(a.$slots, "author-image", F(N({
+                  d(a.$slots, "author-image", F(N({
                     src: e.authorImage + "/m/100x100",
                     width: 60,
                     height: 60
@@ -1759,7 +1759,7 @@ const Xo = /* @__PURE__ */ f(Wo, [["render", Zo], ["__scopeId", "data-v-ea887d7a
       ])
     }, [
       t("div", Sl, [
-        a.label ? (l(), C(X, {
+        a.label ? (l(), T(X, {
           key: 0,
           text: a.label,
           "label-dark": !1
@@ -1783,13 +1783,13 @@ const Xo = /* @__PURE__ */ f(Wo, [["render", Zo], ["__scopeId", "data-v-ea887d7a
               a.bulletList || a.image ? "rich-text__body--content-right" : ""
             ])
           }, [
-            c(a.$slots, "rich-text-content"),
+            d(a.$slots, "rich-text-content"),
             a.links ? (l(), i("div", Bl, [
-              c(a.$slots, "rich-text-links")
+              d(a.$slots, "rich-text-links")
             ])) : h("", !0)
           ], 2),
           a.bulletList ? (l(), i("div", Il, [
-            c(a.$slots, "rich-text-bullet-list")
+            d(a.$slots, "rich-text-bullet-list")
           ])) : h("", !0),
           a.image ? (l(), i("div", {
             key: 1,
@@ -1798,9 +1798,9 @@ const Xo = /* @__PURE__ */ f(Wo, [["render", Zo], ["__scopeId", "data-v-ea887d7a
               a.imageClip ? "rich-text__image--clip" : ""
             ])
           }, [
-            S(M, null, {
+            B(M, null, {
               default: $(() => [
-                c(a.$slots, "rich-text-image", F(N({ width: 865, height: 307 })))
+                d(a.$slots, "rich-text-image", F(N({ width: 865, height: 307 })))
               ]),
               _: 3
             })
@@ -1809,17 +1809,17 @@ const Xo = /* @__PURE__ */ f(Wo, [["render", Zo], ["__scopeId", "data-v-ea887d7a
       ])
     ], 2));
   }
-}), Ll = /* @__PURE__ */ f(ql, [["__scopeId", "data-v-8bb69ea4"]]), Dl = {}, Cl = { class: "rich-text" }, Tl = { class: "rich-text__wrapper" }, Vl = { class: "rich-text__content rich-text__content--left-aligned" }, Al = { class: "rich-text__body" };
+}), Ll = /* @__PURE__ */ f(ql, [["__scopeId", "data-v-16ba7206"]]), Dl = {}, Cl = { class: "rich-text" }, Tl = { class: "rich-text__wrapper" }, Vl = { class: "rich-text__content rich-text__content--left-aligned" }, Al = { class: "rich-text__body" };
 function Pl(e, a) {
   return l(), i("div", Cl, [
     t("div", Tl, [
       t("div", Vl, [
         t("div", Al, [
           t("div", null, [
-            c(e.$slots, "rich-text-content-left", {}, void 0, !0)
+            d(e.$slots, "rich-text-content-left", {}, void 0, !0)
           ]),
           t("div", null, [
-            c(e.$slots, "rich-text-content-right", {}, void 0, !0)
+            d(e.$slots, "rich-text-content-right", {}, void 0, !0)
           ])
         ])
       ])
@@ -1862,9 +1862,9 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
             t("div", El, n(s.year), 1),
             Nl,
             t("div", zl, [
-              S(M, null, {
+              B(M, null, {
                 default: $(() => [
-                  s.media.src ? c(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(de({ key: 0 }, { src: s.media.src, alt: s.media.alt })), void 0, !0) : h("", !0)
                 ]),
                 _: 2
               }, 1024),
@@ -1901,7 +1901,7 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
     return (a, r) => (l(), i("div", Gl, [
       t("div", Jl, [
         e.headline ? (l(), i("h2", Wl, n(e.headline), 1)) : h("", !0),
-        c(a.$slots, "vimeo-content", {}, void 0, !0),
+        d(a.$slots, "vimeo-content", {}, void 0, !0),
         e.description ? (l(), i("p", Yl, n(e.description), 1)) : h("", !0)
       ])
     ]));
@@ -1950,7 +1950,7 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
             ])
           ])) : h("", !0),
           a.hero.showStats ? h("", !0) : (l(), i("div", hs, [
-            c(a.$slots, "button", {}, void 0, !0)
+            d(a.$slots, "button", {}, void 0, !0)
           ]))
         ])
       ])
@@ -1969,7 +1969,7 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
       t("div", gs, [
         t("h1", bs, n(e.headline), 1),
         t("div", ys, [
-          c(a.$slots, "not-found-body", {}, void 0, !0)
+          d(a.$slots, "not-found-body", {}, void 0, !0)
         ])
       ])
     ]));
@@ -1991,10 +1991,10 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
     return (a, r) => (l(), i("div", ws, [
       t("div", Ss, [
         t("div", Bs, [
-          c(a.$slots, "filter-dropdowns")
+          d(a.$slots, "filter-dropdowns")
         ]),
         t("div", Is, [
-          c(a.$slots, "filter-chips"),
+          d(a.$slots, "filter-chips"),
           e.hasChips ? (l(), i("button", {
             key: 0,
             class: "filter__clear",
@@ -2033,7 +2033,7 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
             t("span", Vs, n(s.title), 1),
             t("nav", null, [
               t("ul", As, [
-                c(a.$slots, "section-links", {
+                d(a.$slots, "section-links", {
                   links: s.links
                 })
               ])
@@ -2046,7 +2046,7 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
               Fs,
               Hs,
               Rs,
-              S(V, {
+              B(V, {
                 class: "footer__contact",
                 "link-type": "regular_light",
                 underline: "false"
@@ -2056,7 +2056,7 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
                 ]),
                 _: 1
               }),
-              S(V, {
+              B(V, {
                 class: "footer__contact",
                 "link-type": "regular_light",
                 underline: "false"
@@ -2081,11 +2081,11 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
                 J(n(a.changeRegion), 1)
               ])
             ]),
-            c(a.$slots, "footer-privacy-link"),
-            c(a.$slots, "footer-cookie-link")
+            d(a.$slots, "footer-privacy-link"),
+            d(a.$slots, "footer-cookie-link")
           ]),
           a.language !== "zh" ? (l(), i("div", Gs, [
-            (l(!0), i(A, null, P(a.socialMedia, (s) => (l(), C(V, {
+            (l(!0), i(A, null, P(a.socialMedia, (s) => (l(), T(V, {
               key: s.title,
               underline: "false",
               "link-type": "regular"
@@ -2106,7 +2106,7 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
               _: 2
             }, 1024))), 128))
           ])) : (l(), i("div", Ws, [
-            (l(!0), i(A, null, P(a.socialMediaChina, (s) => (l(), C(V, {
+            (l(!0), i(A, null, P(a.socialMediaChina, (s) => (l(), T(V, {
               key: s.title,
               underline: "false",
               "link-type": "regular"
@@ -2229,46 +2229,46 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
   setup(e, { expose: a, emit: r }) {
     let s = null;
     const o = e;
-    let u = I(o.burgerState), _ = I(o.search), d = I(o.showDropDown), k = I(o.showPortalSwitcherDropDown), v = I(o.showProfileDropDown), b = I(o.isAuthenticated);
+    let c = q(o.burgerState), _ = q(o.search), u = q(o.showDropDown), b = q(o.showPortalSwitcherDropDown), v = q(o.showProfileDropDown), k = q(o.isAuthenticated);
     Q(
       () => o.burgerState,
-      (y) => u.value = y
+      (y) => c.value = y
     ), Q(
       () => o.search,
       (y) => _.value = y
     ), Q(
       () => o.showDropDown,
-      (y) => d.value = y
+      (y) => u.value = y
     ), Q(
       () => o.showPortalSwitcherDropDown,
-      (y) => k.value = y
+      (y) => b.value = y
     ), Q(
       () => o.showProfileDropDown,
       (y) => v.value = y
     ), Q(
       () => o.isAuthenticated,
-      (y) => b.value = y
+      (y) => k.value = y
     ), me(() => {
       s = (y) => {
-        y.target.closest("#menu-dropdown") || (d.value = !1), y.target.closest("#menu-portal-switcher") || (k.value = !1), y.target.closest("#menu-profile-dropdown") || (v.value = !1);
+        y.target.closest("#menu-dropdown") || (u.value = !1), y.target.closest("#menu-portal-switcher") || (b.value = !1), y.target.closest("#menu-profile-dropdown") || (v.value = !1);
       }, window.addEventListener("click", s);
     }), Ie(() => {
       s !== null && window.removeEventListener("click", s);
     });
-    const L = r;
-    function oe() {
-      d.value = !d.value, L("update:showDropDown", d.value);
+    const w = r;
+    function ee() {
+      u.value = !u.value, w("update:showDropDown", u.value);
     }
     function le() {
-      k.value = !k.value, L("update:showPortalSwitcherDropDown", k.value);
+      b.value = !b.value, w("update:showPortalSwitcherDropDown", b.value);
     }
     function se() {
-      v.value = !v.value, L("update:showProfileDropDown", v.value);
+      v.value = !v.value, w("update:showProfileDropDown", v.value);
     }
     function ie() {
-      u.value = !u.value, L("update:burgerState", u.value);
+      c.value = !c.value, w("update:burgerState", c.value);
     }
-    let G = I(null), ee = I(null);
+    let G = q(null), te = q(null);
     function re() {
       G.value && G.value.blur();
     }
@@ -2278,37 +2278,37 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
       t("nav", null, [
         t("div", xs, [
           t("div", ei, [
-            c(y.$slots, "link-logo", {}, void 0, !0)
+            d(y.$slots, "link-logo", {}, void 0, !0)
           ]),
           t("ul", ti, [
-            c(y.$slots, "main-nav-items", {}, void 0, !0)
+            d(y.$slots, "main-nav-items", {}, void 0, !0)
           ]),
           e.useDropdown ? (l(), i("div", ai, [
             t("button", {
               class: "nav-dropdown-btn",
-              onClick: oe
+              onClick: ee
             }, [
-              c(y.$slots, "dropdown-title", {}, void 0, !0),
-              B(d) === !1 ? (l(), i("img", oi)) : (l(), i("img", li))
+              d(y.$slots, "dropdown-title", {}, void 0, !0),
+              I(u) === !1 ? (l(), i("img", oi)) : (l(), i("img", li))
             ]),
             K(t("div", si, [
-              c(y.$slots, "dropdown-links", {}, void 0, !0)
+              d(y.$slots, "dropdown-links", {}, void 0, !0)
             ], 512), [
-              [Z, B(d)]
+              [Z, I(u)]
             ])
           ], 512)) : h("", !0),
-          B(_) ? (l(), i("div", ii, [
+          I(_) ? (l(), i("div", ii, [
             t("button", {
               ref_key: "navSearchButton",
               ref: G,
               class: "search-icon",
               onClick: z[0] || (z[0] = (j) => {
                 var E;
-                return y.$emit("clickSearch"), (E = B(G)) == null ? void 0 : E.blur();
+                return y.$emit("clickSearch"), (E = I(G)) == null ? void 0 : E.blur();
               })
             }, [
               t("img", {
-                src: B(u) === !0 ? "https://a.storyblok.com/f/230581/21x21/13f4ac189d/search-icon-white.svg?cv=1695125826080" : "https://a.storyblok.com/f/230581/21x21/ebbdca38d3/search-icon.svg?cv=1695125825901",
+                src: I(c) === !0 ? "https://a.storyblok.com/f/230581/21x21/13f4ac189d/search-icon-white.svg?cv=1695125826080" : "https://a.storyblok.com/f/230581/21x21/ebbdca38d3/search-icon.svg?cv=1695125825901",
                 alt: "search icon",
                 width: "20",
                 height: "20"
@@ -2326,11 +2326,11 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
                   key: E,
                   class: "portal-switcher-link"
                 }, [
-                  S(B(V), { "link-type": "regular" }, {
+                  B(I(V), { "link-type": "regular" }, {
                     default: $(() => [
                       t("a", {
                         href: j.link,
-                        onClick: z[1] || (z[1] = (W) => ne(d) ? d.value = !1 : d = !1)
+                        onClick: z[1] || (z[1] = (W) => ne(u) ? u.value = !1 : u = !1)
                       }, [
                         t("img", {
                           src: j.icon
@@ -2343,45 +2343,45 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
                 ]))), 128))
               ])
             ], 512), [
-              [Z, B(k)]
+              [Z, I(b)]
             ])
           ])) : h("", !0),
           e.useProfileDropdown ? (l(), i("div", mi, [
-            B(b) ? h("", !0) : (l(), i("div", vi, [
-              c(y.$slots, "profile-dropdown-sign-in", {}, void 0, !0)
+            I(k) ? h("", !0) : (l(), i("div", vi, [
+              d(y.$slots, "profile-dropdown-sign-in", {}, void 0, !0)
             ])),
-            B(b) ? (l(), i("button", {
+            I(k) ? (l(), i("button", {
               key: 1,
               class: "nav-profile-dropdown-btn",
               onClick: se
             }, gi)) : h("", !0),
             K(t("div", bi, [
-              c(y.$slots, "profile-dropdown-links", {}, void 0, !0)
+              d(y.$slots, "profile-dropdown-links", {}, void 0, !0)
             ], 512), [
-              [Z, B(v)]
+              [Z, I(v)]
             ])
           ])) : h("", !0)
         ]),
         t("div", {
-          class: m(["mobile-nav-wrapper", B(u) === !0 ? "mirsaic-mobile-bg mirsaic--dark" : ""])
+          class: m(["mobile-nav-wrapper", I(c) === !0 ? "mirsaic-mobile-bg mirsaic--dark" : ""])
         }, [
           t("div", yi, [
             t("div", $i, [
-              c(y.$slots, "link-logo", {}, void 0, !0)
+              d(y.$slots, "link-logo", {}, void 0, !0)
             ]),
-            B(_) ? (l(), i("div", ki, [
+            I(_) ? (l(), i("div", ki, [
               t("button", {
                 ref_key: "mobileSearchButton",
-                ref: ee,
+                ref: te,
                 class: "search-icon",
                 "aria-label": "Toggle search",
                 onClick: z[2] || (z[2] = (j) => {
                   var E;
-                  return y.$emit("clickSearch"), (E = B(ee)) == null ? void 0 : E.blur();
+                  return y.$emit("clickSearch"), (E = I(te)) == null ? void 0 : E.blur();
                 })
               }, [
                 t("img", {
-                  src: B(u) === !0 ? "https://a.storyblok.com/f/230581/21x21/13f4ac189d/search-icon-white.svg?cv=1695125826080" : "https://a.storyblok.com/f/230581/21x21/ebbdca38d3/search-icon.svg?cv=1695125825901",
+                  src: I(c) === !0 ? "https://a.storyblok.com/f/230581/21x21/13f4ac189d/search-icon-white.svg?cv=1695125826080" : "https://a.storyblok.com/f/230581/21x21/ebbdca38d3/search-icon.svg?cv=1695125825901",
                   alt: "search icon",
                   width: "20",
                   height: "20"
@@ -2397,20 +2397,20 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
                 width: "20",
                 height: "20",
                 alt: "burger menu line icon",
-                src: B(u) === !0 ? "https://a.storyblok.com/f/230581/17x18/20e9329e46/close-white.svg" : "https://a.storyblok.com/f/230581/23x14/739e917bca/burger-menu-line.svg"
+                src: I(c) === !0 ? "https://a.storyblok.com/f/230581/17x18/20e9329e46/close-white.svg" : "https://a.storyblok.com/f/230581/23x14/739e917bca/burger-menu-line.svg"
               }, null, 8, Si)
             ])
           ]),
           K(t("div", Bi, [
             t("ul", null, [
-              c(y.$slots, "mobile-main-nav-items", {}, void 0, !0)
+              d(y.$slots, "mobile-main-nav-items", {}, void 0, !0)
             ]),
             t("ul", Ii, [
-              c(y.$slots, "mobile-dropdown-title", {}, void 0, !0),
-              c(y.$slots, "mobile-dropdown-links", {}, void 0, !0)
+              d(y.$slots, "mobile-dropdown-title", {}, void 0, !0),
+              d(y.$slots, "mobile-dropdown-links", {}, void 0, !0)
             ])
           ], 512), [
-            [Z, B(u)]
+            [Z, I(c)]
           ])
         ], 2)
       ])
@@ -2434,7 +2434,7 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
         t("h2", Ti, n(e.headline), 1),
         t("p", Vi, n(e.paragraph), 1),
         t("div", Ai, [
-          c(a.$slots, "language-links", {}, void 0, !0)
+          d(a.$slots, "language-links", {}, void 0, !0)
         ])
       ])
     ]));
@@ -2455,14 +2455,14 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
   setup(e) {
     return (a, r) => (l(), i("div", Oi, [
       t("div", Fi, [
-        S(ae, {
+        B(oe, {
           disabled: e.isPreviousDisabled,
           variant: "previous",
           "aria-label": "previous",
           onClick: r[0] || (r[0] = (s) => a.$emit("previous"))
         }, null, 8, ["disabled"]),
-        c(a.$slots, "pagination-numbers"),
-        S(ae, {
+        d(a.$slots, "pagination-numbers"),
+        B(oe, {
           disabled: e.isNextDisabled,
           variant: "next",
           "aria-label": "next",
@@ -2474,7 +2474,7 @@ const Ml = /* @__PURE__ */ f(Dl, [["render", Pl], ["__scopeId", "data-v-449f3040
 }), Ri = /* @__PURE__ */ f(Hi, [["__scopeId", "data-v-da6d07c9"]]), Ei = {}, Ni = { class: "search__wrapper" };
 function zi(e, a) {
   return l(), i("div", Ni, [
-    c(e.$slots, "default", { class: "search__content" })
+    d(e.$slots, "default", { class: "search__content" })
   ]);
 }
 const ji = /* @__PURE__ */ f(Ei, [["render", zi], ["__scopeId", "data-v-c07a6cf3"]]), Ki = { class: "dropdown" }, Ui = ["aria-expanded"], Gi = /* @__PURE__ */ g({
@@ -2486,50 +2486,51 @@ const ji = /* @__PURE__ */ f(Ei, [["render", zi], ["__scopeId", "data-v-c07a6cf3
   },
   emits: ["filter", "remove-filter"],
   setup(e, { emit: a }) {
-    const r = I(!1), s = e, o = a;
-    function u(d) {
-      s.selectedOptions.includes(d) ? o("remove-filter", d) : o("filter", d);
+    const r = q(!1), s = e, o = a;
+    function c(b) {
+      s.selectedOptions.includes(b) ? o("remove-filter", b) : o("filter", b);
     }
     function _() {
       r.value = !1;
     }
-    return (d, k) => {
-      const v = _e("click-outside");
+    const u = C(() => s.options.length > 8);
+    return (b, v) => {
+      const k = _e("click-outside");
       return K((l(), i("div", Ki, [
         t("button", {
           class: "dropdown-button",
           "aria-expanded": r.value ? "true" : "false",
-          onClick: k[0] || (k[0] = (b) => r.value = !r.value)
+          onClick: v[0] || (v[0] = (w) => r.value = !r.value)
         }, [
-          c(d.$slots, "button", {}, () => [
-            J(n(d.label), 1)
+          d(b.$slots, "button", {}, () => [
+            J(n(b.label), 1)
           ], !0)
         ], 8, Ui),
         t("div", {
-          class: m([{ hidden: !r.value }, "dropdown-content"])
+          class: m([{ hidden: !r.value, "adjust-height": u.value }, "dropdown-content"])
         }, [
-          (l(!0), i(A, null, P(d.options, (b) => (l(), C(B(ve), {
-            id: b.value,
-            key: b.value,
-            name: b.text,
+          (l(!0), i(A, null, P(b.options, (w) => (l(), T(I(ve), {
+            id: w.value,
+            key: w.value,
+            name: w.text,
             required: !1,
             disabled: !1,
-            value: b.value,
-            checked: d.selectedOptions.includes(b.value),
-            onInput: (L) => u(b.value)
+            value: w.value,
+            checked: b.selectedOptions.includes(w.value),
+            onInput: (ee) => c(w.value)
           }, {
             default: $(() => [
-              J(n(b.text), 1)
+              J(n(w.text), 1)
             ]),
             _: 2
           }, 1032, ["id", "name", "value", "checked", "onInput"]))), 128))
         ], 2)
       ])), [
-        [v, _]
+        [k, _]
       ]);
     };
   }
-}), Ji = /* @__PURE__ */ f(Gi, [["__scopeId", "data-v-e81c0edb"]]), 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-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({
   __name: "pallet-jack",
   props: {
     label: { default: "" },
@@ -2547,8 +2548,8 @@ const ji = /* @__PURE__ */ f(Ei, [["render", zi], ["__scopeId", "data-v-c07a6cf3
       dark: "promo__wrapper--dark",
       light: "promo__wrapper--light",
       default: "promo__wrapper--default"
-    }, r = e, s = T(() => a[r.variant]);
-    return (o, u) => (l(), i("div", {
+    }, r = e, s = C(() => a[r.variant]);
+    return (o, c) => (l(), i("div", {
       class: m([
         "promo__wrapper",
         s.value,
@@ -2564,10 +2565,10 @@ const ji = /* @__PURE__ */ f(Ei, [["render", zi], ["__scopeId", "data-v-c07a6cf3
         }, [
           t("div", Yi, [
             t("div", Qi, [
-              c(o.$slots, "pallet-jack-link")
+              d(o.$slots, "pallet-jack-link")
             ]),
             t("div", Zi, [
-              c(o.$slots, "pallet-jack-video")
+              d(o.$slots, "pallet-jack-video")
             ]),
             t("div", Xi, [
               t("h3", xi, n(o.headline), 1),
@@ -2581,7 +2582,7 @@ const ji = /* @__PURE__ */ f(Ei, [["render", zi], ["__scopeId", "data-v-c07a6cf3
             o.reverse ? "promo__text--reverse" : "promo__text--default"
           ])
         }, [
-          o.label ? (l(), C(X, {
+          o.label ? (l(), T(X, {
             key: 0,
             text: o.label,
             "label-dark": o.variant === "dark"
@@ -2592,24 +2593,24 @@ const ji = /* @__PURE__ */ f(Ei, [["render", zi], ["__scopeId", "data-v-c07a6cf3
               o.variant === "dark" ? "promo__title--dark" : ""
             ])
           }, [
-            c(o.$slots, "promo-text")
+            d(o.$slots, "promo-text")
           ], 2),
-          o.linkType === "link" ? (l(), C(V, {
+          o.linkType === "link" ? (l(), T(V, {
             key: 1,
             "link-type": o.variant === "dark" ? "regular_dark" : (o.variant === "light", "regular_light"),
             arrow: ""
           }, {
             default: $(() => [
-              c(o.$slots, "promo-link")
+              d(o.$slots, "promo-link")
             ]),
             _: 3
           }, 8, ["link-type"])) : h("", !0),
-          o.linkType === "button" ? (l(), C(V, {
+          o.linkType === "button" ? (l(), T(V, {
             key: 2,
             "link-type": o.variant === "dark" ? "secondary_dark" : (o.variant === "light", "secondary")
           }, {
             default: $(() => [
-              c(o.$slots, "promo-link")
+              d(o.$slots, "promo-link")
             ]),
             _: 3
           }, 8, ["link-type"])) : h("", !0)
@@ -2619,11 +2620,11 @@ const ji = /* @__PURE__ */ f(Ei, [["render", zi], ["__scopeId", "data-v-c07a6cf3
   }
 }), tr = /* @__PURE__ */ f(er, [["__scopeId", "data-v-00c0bad3"]]), or = {
   install: (e) => {
-    e.component("AtomButton", ae), e.component("AtomCheckbox", ve), e.component("AtomChip", He), e.component("AtomDropdown", Ge), e.component("AtomImage", M), e.component("AtomLabel", X), e.component("AtomLink", V), e.component("AtomRadioButton", lt), e.component("AtomSelect", ct), e.component("AtomSelectMultiple", Ji), e.component("AtomSlider", $t), e.component("AtomTextarea", Dt), e.component("AtomTextField", Et), e.component("AtomVideo", x), e.component("MoleculeAddress", aa), e.component("MoleculeBulletList", ra), e.component("MoleculeCard", _a), e.component("MoleculeEventCard", ya), e.component("MoleculeModal", fe), e.component("MoleculeTextCard", Ba), e.component("BlockFacts", Na), e.component("BlockFeatures", Ya), e.component("BlockFormScript", oo), e.component("BlockHeadline", ro), e.component("BlockHero", $o), e.component("BlockImage", qo), e.component("BlockImageGallery", Ao), e.component("BlockLogoWall", zo), e.component("BlockMicroStories", Jo), e.component("BlockPolicy", Xo), e.component("BlockProductHero", rl), e.component("BlockPromo", cl), e.component("BlockQuote", wl), e.component("BlockRichText", Ll), e.component("BlockRichTextColumns", Ml), e.component("BlockTimeline", Ul), e.component("BlockCardDisplay", Va), e.component("BlockVimeo", Zl), e.component("BlockPalletJack", tr), e.component("BlockFrontPageHero", vs), e.component("Organism404", ks), e.component("OrganismFilter", Ls), e.component("OrganismFooter", Zs), e.component("OrganismHeader", Li), e.component("OrganismLanguageSwitcher", Mi), e.component("OrganismPagination", Ri), e.component("OrganismSearch", ji);
+    e.component("AtomButton", oe), e.component("AtomCheckbox", ve), e.component("AtomChip", He), e.component("AtomDropdown", Ge), e.component("AtomImage", M), e.component("AtomLabel", X), e.component("AtomLink", V), e.component("AtomRadioButton", lt), e.component("AtomSelect", ct), e.component("AtomSelectMultiple", Ji), e.component("AtomSlider", $t), e.component("AtomTextarea", Dt), e.component("AtomTextField", Et), e.component("AtomVideo", x), e.component("MoleculeAddress", aa), e.component("MoleculeBulletList", ra), e.component("MoleculeCard", _a), e.component("MoleculeEventCard", ya), e.component("MoleculeModal", fe), e.component("MoleculeTextCard", Ba), e.component("BlockFacts", Na), e.component("BlockFeatures", Ya), e.component("BlockFormScript", oo), e.component("BlockHeadline", ro), e.component("BlockHero", $o), e.component("BlockImage", qo), e.component("BlockImageGallery", Ao), e.component("BlockLogoWall", zo), e.component("BlockMicroStories", Jo), e.component("BlockPolicy", Xo), e.component("BlockProductHero", rl), e.component("BlockPromo", cl), e.component("BlockQuote", wl), e.component("BlockRichText", Ll), e.component("BlockRichTextColumns", Ml), e.component("BlockTimeline", Ul), e.component("BlockCardDisplay", Va), e.component("BlockVimeo", Zl), e.component("BlockPalletJack", tr), e.component("BlockFrontPageHero", vs), e.component("Organism404", ks), e.component("OrganismFilter", Ls), e.component("OrganismFooter", Zs), e.component("OrganismHeader", Li), e.component("OrganismLanguageSwitcher", Mi), e.component("OrganismPagination", Ri), e.component("OrganismSearch", ji);
   }
 };
 export {
-  ae as AtomButton,
+  oe as AtomButton,
   ve as AtomCheckbox,
   He as AtomChip,
   Ge as AtomDropdown,