@rei/cedar 15.2.0 → 15.3.0

package/dist/components/link/CdrLink.vue.mjs

@@ -0,0 +1,9 @@
+import s from "./CdrLink.vue2.mjs";
+import o from "./styles/CdrLink.module.scss.mjs";
+import t from "../../_virtual/_plugin-vue_export-helper.mjs";
+const r = {
+  $style: o
+}, f = /* @__PURE__ */ t(s, [["__cssModules", r]]);
+export {
+  f as default
+};

package/dist/components/link/styles/CdrLink.module.scss.mjs

@@ -0,0 +1,8 @@
+const n = {
+  "cdr-link": "cdr-link_15-3-0",
+  "cdr-link--standalone": "cdr-link--standalone_15-3-0",
+  "cdr-link--inherit-color": "cdr-link--inherit-color_15-3-0"
+};
+export {
+  n as default
+};

package/dist/components/list/CdrList.vue.mjs

@@ -0,0 +1,9 @@
+import s from "./CdrList.vue2.mjs";
+import o from "./styles/CdrList.module.scss.mjs";
+import t from "../../_virtual/_plugin-vue_export-helper.mjs";
+const r = {
+  $style: o
+}, f = /* @__PURE__ */ t(s, [["__cssModules", r]]);
+export {
+  f as default
+};

package/dist/components/list/CdrList.vue2.mjs

@@ -0,0 +1,40 @@
+import "core-js/modules/esnext.iterator.map.js";
+import { defineComponent as l, useCssModule as n, computed as d, openBlock as m, createBlock as c, resolveDynamicComponent as p, normalizeClass as u, unref as f, withCtx as C, renderSlot as v } from "vue";
+import s from "../../utils/propValidator.mjs";
+const a = "cdr-list", $ = /* @__PURE__ */ l({
+  name: "CdrList",
+  __name: "CdrList",
+  props: {
+    /**
+     * Sets list type and HTML element as "unordered" or "ordered"
+     * @values ul, ol
+     */
+    tag: {
+      type: String,
+      default: "ul",
+      validator: (e) => s(e, ["ul", "ol"])
+    },
+    /**
+     * Modifies the style variant for this component
+     * @demoSelectMultiple true
+     * @values ordered, unordered, compact, inline
+     */
+    modifier: {
+      type: String,
+      default: void 0,
+      validator: (e) => s(e, ["ordered", "unordered", "compact", "inline"])
+    }
+  },
+  setup(e) {
+    const o = e, r = n(), i = d(() => o.modifier ? o.modifier.split(" ").map((t) => r[`${a}--${t}`]) : "");
+    return (t, g) => (m(), c(p(e.tag), {
+      class: u([f(r)[a], i.value])
+    }, {
+      default: C(() => [v(t.$slots, "default")]),
+      _: 3
+    }, 8, ["class"]));
+  }
+});
+export {
+  $ as default
+};

package/dist/components/list/styles/CdrList.module.scss.mjs

@@ -0,0 +1,10 @@
+const d = {
+  "cdr-list": "cdr-list_15-3-0",
+  "cdr-list--compact": "cdr-list--compact_15-3-0",
+  "cdr-list--ordered": "cdr-list--ordered_15-3-0",
+  "cdr-list--unordered": "cdr-list--unordered_15-3-0",
+  "cdr-list--inline": "cdr-list--inline_15-3-0"
+};
+export {
+  d as default
+};

package/dist/components/mediaObject/CdrMediaObject.vue.mjs

@@ -0,0 +1,9 @@
+import s from "./CdrMediaObject.vue2.mjs";
+import o from "./styles/CdrMediaObject.module.scss.mjs";
+import t from "../../_virtual/_plugin-vue_export-helper.mjs";
+const e = {
+  $style: o
+}, f = /* @__PURE__ */ t(s, [["__cssModules", e]]);
+export {
+  f as default
+};

package/dist/components/mediaObject/CdrMediaObject.vue2.mjs

@@ -0,0 +1,100 @@
+import "core-js/modules/es.array.push.js";
+import "core-js/modules/esnext.iterator.constructor.js";
+import "core-js/modules/esnext.iterator.for-each.js";
+import { defineComponent as q, useCssModule as z, computed as A, openBlock as B, createBlock as $, normalizeProps as E, guardReactiveProps as M, withCtx as R, createElementVNode as m, normalizeClass as p, unref as u, renderSlot as f } from "vue";
+import G from "../../utils/mapClasses.mjs";
+import { modifyClassName as i } from "../../utils/buildClass.mjs";
+import { getLayoutStyling as H } from "../../utils/mediaObject.mjs";
+import L from "../layout/CdrLayout.vue.mjs";
+import { spacing as g, breakpoints as y } from "../../utils/other.mjs";
+const J = /* @__PURE__ */ q({
+  name: "CdrMediaObject",
+  __name: "CdrMediaObject",
+  props: {
+    align: {
+      default: "start"
+    },
+    mediaPosition: {
+      default: "left"
+    },
+    mediaWidth: {
+      default: "1fr"
+    },
+    mediaHeight: {
+      default: "auto"
+    },
+    mediaCover: {
+      type: Boolean,
+      default: !1
+    },
+    overlay: {
+      type: Boolean,
+      default: !1
+    },
+    overlayRowAlign: {
+      default: "start"
+    },
+    overlayColumnAlign: {
+      default: "start"
+    },
+    contentPadding: {
+      default: "zero"
+    },
+    queryType: {},
+    flow: {},
+    flowValue: {},
+    columns: {},
+    rows: {},
+    gap: {},
+    rowGap: {},
+    columnGap: {},
+    as: {}
+  },
+  setup(v) {
+    const b = v, n = z(), h = A(() => {
+      const e = "cdr-media-object", t = [e], o = {}, {
+        align: r,
+        mediaPosition: d,
+        mediaWidth: j,
+        mediaHeight: C,
+        mediaCover: w,
+        overlay: P,
+        overlayRowAlign: _,
+        overlayColumnAlign: O,
+        contentPadding: s,
+        ...S
+      } = b, l = {
+        ...S
+      };
+      if (s !== "zero" && (typeof s == "string" ? o["--cdr-media-object-content-padding"] = g[s] : (t.push(i(e, "content-padding-cq")), y.forEach((a) => {
+        o[`--cdr-media-object-content-padding-${a}`] = g[s[a]];
+      }))), P)
+        t.push(i(e, "overlay")), Object.assign(l, {
+          rows: "auto",
+          columns: "auto"
+        }), o["--cdr-media-object-row-align"] = _, o["--cdr-media-object-column-align"] = O;
+      else {
+        const a = H(d, j, C);
+        Object.assign(o, a.inlineStyles), Object.assign(l, a.props), typeof d != "string" && t.push(i(e, "media-position-cq")), typeof r != "string" ? (t.push(i(e, "align-cq")), y.forEach((c) => {
+          o[`--cdr-media-object-align-${c}`] = r[c];
+        })) : o["--cdr-media-object-align"] = r, w && t.push(i(e, "cover"));
+      }
+      return {
+        ...l,
+        class: G(n, ...t) || void 0,
+        style: o
+      };
+    });
+    return (e, t) => (B(), $(L, E(M(h.value)), {
+      default: R(() => [m("div", {
+        class: p(u(n)["cdr-media-object__media"])
+      }, [f(e.$slots, "media")], 2), m("div", {
+        class: p(u(n)["cdr-media-object__content"])
+      }, [f(e.$slots, "content")], 2)]),
+      _: 3
+    }, 16));
+  }
+});
+export {
+  J as default
+};

package/dist/components/mediaObject/styles/CdrMediaObject.module.scss.mjs

@@ -0,0 +1,13 @@
+const e = {
+  "cdr-media-object": "cdr-media-object_15-3-0",
+  "cdr-media-object__media": "cdr-media-object__media_15-3-0",
+  "cdr-media-object__content": "cdr-media-object__content_15-3-0",
+  "cdr-media-object--align-cq": "cdr-media-object--align-cq_15-3-0",
+  "cdr-media-object--media-position-cq": "cdr-media-object--media-position-cq_15-3-0",
+  "cdr-media-object--cover": "cdr-media-object--cover_15-3-0",
+  "cdr-media-object--overlay": "cdr-media-object--overlay_15-3-0",
+  "cdr-media-object--content-padding-cq": "cdr-media-object--content-padding-cq_15-3-0"
+};
+export {
+  e as default
+};

package/dist/components/modal/CdrModal.vue.mjs

@@ -0,0 +1,9 @@
+import o from "./CdrModal.vue2.mjs";
+import s from "./styles/CdrModal.module.scss.mjs";
+import t from "../../_virtual/_plugin-vue_export-helper.mjs";
+const r = {
+  $style: s
+}, f = /* @__PURE__ */ t(o, [["__cssModules", r]]);
+export {
+  f as default
+};

package/dist/components/modal/CdrModal.vue2.mjs

@@ -0,0 +1,246 @@
+import "core-js/modules/es.array.push.js";
+import "core-js/modules/esnext.iterator.constructor.js";
+import "core-js/modules/esnext.iterator.for-each.js";
+import { defineComponent as de, useAttrs as ie, useCssModule as ce, ref as o, computed as h, watch as ue, onMounted as me, onUnmounted as fe, openBlock as ve, createBlock as he, Teleport as pe, createElementVNode as l, normalizeClass as d, unref as n, mergeProps as ye, renderSlot as S, normalizeStyle as O, toDisplayString as be, createCommentVNode as ge, createVNode as P, withCtx as Ce, nextTick as R } from "vue";
+import { debounce as we } from "../../utils/debounce.mjs";
+import V from "tabbable";
+import { CdrSpaceTwoX as X, CdrSpaceOneX as Ee, CdrBreakpointSm as xe } from "@rei/cdr-tokens";
+import Se from "./onTransitionEnd.mjs";
+import _e from "../button/CdrButton.vue.mjs";
+import ke from "../icon/comps/x-lg.vue.mjs";
+import j from "../../utils/mapClasses.mjs";
+const Be = ["tabIndex"], He = ["role", "aria-label"], Le = ["tabIndex"], Ne = "cdr-modal", Re = /* @__PURE__ */ de({
+  name: "CdrModal",
+  inheritAttrs: !1,
+  __name: "CdrModal",
+  props: {
+    /**
+     * Toggles the state of the modal
+     * @demoIgnore true
+     */
+    opened: {
+      type: Boolean,
+      required: !0
+    },
+    /**
+     * Sets `aria-label` and modal title text. Can also use title slot to set title.
+     */
+    label: {
+      type: String,
+      required: !0
+    },
+    /**
+     * Toggles the modal title text, which comes from `label` prop or `title` slot.
+     */
+    showTitle: {
+      type: Boolean,
+      required: !1,
+      default: !0
+    },
+    /**
+     * Text for aria-describedby attribute. Applied to modal content element
+     */
+    ariaDescribedby: {
+      type: String,
+      required: !1,
+      default: null
+    },
+    /**
+     * Sets the `role` attribute on the modal content element
+     * @values dialog, alertDialog
+     */
+    role: {
+      type: String,
+      required: !1,
+      default: "dialog"
+    },
+    /**
+     * Sets unique `id` for modal
+     */
+    id: {
+      type: String,
+      required: !1,
+      default: null
+    },
+    /** Adds custom class to the `cdr-modal__overlay` div */
+    overlayClass: String,
+    /** Adds custom class to the `cdr-modal__outerWrap` div */
+    wrapperClass: String,
+    /** Adds custom class to the `cdr-modal__innerWrap` div */
+    contentClass: String,
+    /** Sets duration for modal's close animation */
+    animationDuration: {
+      type: Number,
+      default: 300
+    }
+  },
+  emits: {
+    closed: null
+  },
+  setup(a, {
+    emit: F
+  }) {
+    const u = a, K = F, U = ie(), r = ce();
+    let y, b;
+    const g = o(!u.opened), C = o(!1), c = o({
+      x: void 0,
+      y: void 0
+    }), _ = o(0), k = o(0), B = o(0), H = o(0), L = o(0), N = o(0), T = o(!1), m = o(null), f = o(null), v = o(null), A = o(null), w = () => {
+      R(() => {
+        var e, t, s, i, p;
+        k.value = window.innerHeight, T.value = window.innerWidth < +xe, _.value = ((e = A.value) == null ? void 0 : e.offsetHeight) || 0, B.value = ((t = v.value) == null ? void 0 : t.scrollHeight) || 0, H.value = ((s = v.value) == null ? void 0 : s.offsetHeight) || 0, L.value = ((i = v.value) == null ? void 0 : i.offsetWidth) || 0, N.value = ((p = v.value) == null ? void 0 : p.clientWidth) || 0;
+      });
+    }, E = (e) => {
+      K("closed", e);
+    }, W = ({
+      key: e
+    }) => {
+      switch (e) {
+        case "Escape":
+        case "Esc":
+          E();
+          break;
+      }
+    }, $ = (e) => {
+      var z;
+      const {
+        documentElement: t
+      } = document;
+      if ((z = m.value) != null && z.contains(e.target) || !t) return;
+      const s = V(t), i = V(m.value), p = s.indexOf(e.target), se = s.indexOf(i[0]), M = p < se ? i[i.length - 1] : i[0];
+      M && M.focus();
+    }, q = we(() => {
+      w();
+    }, 300), Y = () => {
+      const {
+        documentElement: e,
+        body: t
+      } = document;
+      c.value = {
+        x: window.scrollX || (e || {}).scrollLeft || (t || {}).scrollLeft || 0,
+        y: window.scrollY || (e || {}).scrollTop || (t || {}).scrollTop || 0
+      }, e && (e.classList.add("cdr-modal__noscroll"), e.style.top = `-${c.value.y}px`, e.style.left = `-${c.value.x}px`), t && t.classList.add("cdr-modal__noscroll");
+    }, G = () => {
+      const {
+        documentElement: e,
+        body: t
+      } = document;
+      t && t.classList.remove("cdr-modal__noscroll"), e && (e.classList.remove("cdr-modal__noscroll"), e.style.top = "", e.style.left = "");
+    }, J = () => {
+      document.addEventListener("focusin", $, !0), document.addEventListener("keydown", W);
+    }, x = [];
+    let D = !1;
+    const Q = () => {
+      const e = ["body > *", ":not(script)", ":not(style)", ":not([aria-hidden=true])"];
+      document.querySelectorAll(e.join("")).forEach((s) => {
+        s !== f.value && getComputedStyle(s).getPropertyValue("display") !== "none" && x.push(s);
+      }), D = !0;
+    }, Z = () => {
+      D || Q(), x.forEach((e) => {
+        e.setAttribute("aria-hidden", "true");
+      });
+    }, ee = () => {
+      x.forEach((e) => {
+        e.removeAttribute("aria-hidden");
+      });
+    }, I = () => {
+      Z();
+      const {
+        activeElement: e
+      } = document;
+      Y(), C.value = !0, g.value = !1, b = e, R(() => {
+        m.value && m.value.focus(), w(), J(), setTimeout(() => {
+          f.value && (f.value.scrollTop = 0), w();
+        });
+      });
+    }, te = () => {
+      ee();
+      const {
+        documentElement: e
+      } = document;
+      document.removeEventListener("keydown", W), document.removeEventListener("focusin", $, !0), C.value = !1, y = Se(f.value, () => {
+        C.value || (y && y(), G(), g.value = !0, e && (e.style.scrollBehavior = "auto"), c.value.x !== void 0 && c.value.y !== void 0 && window.scrollTo(c.value.x, c.value.y), e && (e.style.scrollBehavior = ""), b && b.focus());
+      }, u.animationDuration + 16);
+    }, oe = h(() => ({
+      ...U,
+      "aria-describedby": u.ariaDescribedby,
+      id: u.id
+    })), le = h(() => {
+      const e = Number(X), t = Number(X) + Number(Ee);
+      return T.value ? e : t + e;
+    }), ne = h(() => k.value - _.value - le.value), ae = h(() => {
+      const e = B.value > H.value, t = L.value - N.value > 0;
+      return e && t ? 4 : e ? 12 : 0;
+    }), re = h(() => ({
+      maxHeight: `${ne.value}px`,
+      paddingRight: `${ae.value}px`
+    }));
+    return ue(() => u.opened, (e, t) => {
+      !!e != !!t && (e ? I() : te());
+    }), me(() => {
+      u.opened && I(), window.addEventListener("resize", q);
+    }), fe(() => {
+      window.removeEventListener("resize", q);
+    }), (e, t) => (ve(), he(pe, {
+      to: "body"
+    }, [l("div", {
+      class: d(n(j)(n(r), Ne, a.opened ? "" : "cdr-modal--closed")),
+      ref_key: "wrapperEl",
+      ref: f
+    }, [l("div", {
+      class: d([n(r)["cdr-modal__outerWrap"], a.wrapperClass])
+    }, [l("div", {
+      "aria-hidden": "true",
+      onClick: E,
+      class: d([n(r)["cdr-modal__overlay"], a.overlayClass])
+    }, null, 2), l("div", {
+      tabIndex: a.opened ? "0" : void 0
+    }, null, 8, Be), l("div", ye({
+      ref_key: "modalEl",
+      ref: m,
+      class: n(j)(n(r), "cdr-modal__contentWrap", "cdr-modal__dialog"),
+      tabIndex: "-1",
+      role: a.role,
+      "aria-modal": "true",
+      "aria-label": a.label
+    }, oe.value), [S(e.$slots, "modal", {}, () => [l("div", {
+      class: d([n(r)["cdr-modal__innerWrap"], a.contentClass]),
+      style: O(g.value ? {
+        display: "none"
+      } : void 0)
+    }, [l("section", null, [l("div", {
+      class: d(n(r)["cdr-modal__content"])
+    }, [l("div", {
+      class: d(n(r)["cdr-modal__header"]),
+      ref_key: "headerEl",
+      ref: A
+    }, [l("div", {
+      class: d(n(r)["cdr-modal__title"])
+    }, [a.showTitle ? S(e.$slots, "title", {
+      key: 0
+    }, () => [l("h1", null, be(a.label), 1)]) : ge("", !0)], 2), P(_e, {
+      class: d(n(r)["cdr-modal__close-button"]),
+      "icon-only": "",
+      "with-background": !0,
+      onClick: E,
+      "aria-label": "Close"
+    }, {
+      icon: Ce(() => [P(ke, {
+        "inherit-color": ""
+      })]),
+      _: 1
+    }, 8, ["class"])], 2), l("div", {
+      class: d(n(r)["cdr-modal__text-content"]),
+      style: O(re.value),
+      role: "document",
+      ref_key: "contentEl",
+      ref: v,
+      tabindex: "0"
+    }, [S(e.$slots, "default")], 6)], 2)])], 6)])], 16, He), l("div", {
+      tabIndex: a.opened ? "0" : void 0
+    }, null, 8, Le)], 2)], 2)]));
+  }
+});
+export {
+  Re as default
+};

package/dist/components/modal/styles/CdrModal.module.scss.mjs

@@ -0,0 +1,17 @@
+const d = {
+  "cdr-modal": "cdr-modal_15-3-0",
+  "cdr-modal__overlay": "cdr-modal__overlay_15-3-0",
+  "cdr-modal__outerWrap": "cdr-modal__outerWrap_15-3-0",
+  "cdr-modal__contentWrap": "cdr-modal__contentWrap_15-3-0",
+  "cdr-modal__innerWrap": "cdr-modal__innerWrap_15-3-0",
+  "cdr-modal__dialog": "cdr-modal__dialog_15-3-0",
+  "cdr-modal__content": "cdr-modal__content_15-3-0",
+  "cdr-modal__header": "cdr-modal__header_15-3-0",
+  "cdr-modal__title": "cdr-modal__title_15-3-0",
+  "cdr-modal__close-button": "cdr-modal__close-button_15-3-0",
+  "cdr-modal__text-content": "cdr-modal__text-content_15-3-0",
+  "cdr-modal--closed": "cdr-modal--closed_15-3-0"
+};
+export {
+  d as default
+};

package/dist/components/pagination/CdrPagination.vue.mjs

@@ -0,0 +1,9 @@
+import o from "./CdrPagination.vue2.mjs";
+import s from "./styles/CdrPagination.module.scss.mjs";
+import t from "../../_virtual/_plugin-vue_export-helper.mjs";
+const r = {
+  $style: s
+}, f = /* @__PURE__ */ t(o, [["__cssModules", r]]);
+export {
+  f as default
+};