@rei/cedar 13.4.0-alpha.1 → 13.4.1

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

@@ -0,0 +1,214 @@
+import { debounce as Q } from "lodash-es";
+import D from "tabbable";
+import { defineComponent as Z, ref as t, computed as g, watch as x, onMounted as ee, onUnmounted as le, useCssModule as oe, resolveComponent as z, openBlock as te, createElementBlock as ne, normalizeClass as s, createElementVNode as n, mergeProps as se, renderSlot as w, normalizeStyle as O, toDisplayString as ae, createCommentVNode as re, createVNode as X, withCtx as de, nextTick as A } from "vue";
+import { CdrBreakpointSm as ie, CdrSpaceTwoX as P, CdrSpaceOneX as ce } from "../../../node_modules/@rei/cdr-tokens/dist/js/cdr-tokens.mjs";
+import ue from "./onTransitionEnd.mjs";
+import me from "../button/CdrButton.vue.mjs";
+import fe from "../icon/comps/x-lg.vue.mjs";
+import ve from "../../utils/mapClasses.mjs";
+import pe from "./styles/CdrModal.module.scss.mjs";
+import ye from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const he = Z({
+  name: "CdrModal",
+  components: {
+    CdrButton: me,
+    IconXLg: fe
+  },
+  props: {
+    opened: {
+      type: Boolean,
+      required: !0
+    },
+    label: {
+      type: String,
+      required: !0
+    },
+    showTitle: {
+      type: Boolean,
+      required: !1,
+      default: !0
+    },
+    ariaDescribedby: {
+      type: String,
+      required: !1,
+      default: null
+    },
+    role: {
+      type: String,
+      required: !1,
+      default: "dialog"
+    },
+    id: {
+      type: String,
+      required: !1,
+      default: null
+    },
+    overlayClass: String,
+    wrapperClass: String,
+    contentClass: String,
+    animationDuration: {
+      type: Number,
+      default: 300
+    }
+  },
+  emits: ["closed"],
+  setup(e, d) {
+    const E = "cdr-modal";
+    let f, v;
+    const p = t(!e.opened), i = t(!1), a = t(null), y = t(0), S = t(0), k = t(0), _ = t(0), L = t(0), H = t(0), $ = t(!1), c = t(null), h = t(null), u = t(null), T = t(null), C = () => {
+      A(() => {
+        var l, o, m, r, b;
+        S.value = window.innerHeight, $.value = window.innerWidth < ie, y.value = (l = T.value) == null ? void 0 : l.offsetHeight, k.value = (o = u.value) == null ? void 0 : o.scrollHeight, _.value = (m = u.value) == null ? void 0 : m.offsetHeight, L.value = (r = u.value) == null ? void 0 : r.offsetWidth, H.value = (b = u.value) == null ? void 0 : b.clientWidth;
+      });
+    }, M = (l) => {
+      d.emit("closed", l);
+    }, N = ({
+      key: l
+    }) => {
+      switch (l) {
+        case "Escape":
+        case "Esc":
+          M();
+          break;
+      }
+    }, B = (l) => {
+      const {
+        documentElement: o
+      } = document;
+      if (c.value.contains(l.target) || !o)
+        return;
+      const m = D(o), r = D(c.value), b = m.indexOf(l.target), J = m.indexOf(r[0]), q = b < J ? r[r.length - 1] : r[0];
+      q && q.focus();
+    }, I = Q(() => {
+      C();
+    }, 300), R = () => {
+      const {
+        documentElement: l,
+        body: o
+      } = document;
+      a.value = {
+        x: window.scrollX || (l || {}).scrollLeft || (o || {}).scrollLeft || 0,
+        y: window.scrollY || (l || {}).scrollTop || (o || {}).scrollTop || 0
+      }, l && (l.classList.add("cdr-modal__noscroll"), l.style.top = `-${a.value.y}px`, l.style.left = `-${a.value.x}px`), o && o.classList.add("cdr-modal__noscroll");
+    }, V = () => {
+      const {
+        documentElement: l,
+        body: o
+      } = document;
+      o && o.classList.remove("cdr-modal__noscroll"), l && (l.classList.remove("cdr-modal__noscroll"), l.style.top = "", l.style.left = "");
+    }, F = () => {
+      document.addEventListener("focusin", B, !0), document.addEventListener("keydown", N);
+    }, W = () => {
+      const {
+        activeElement: l
+      } = document;
+      R(), i.value = !0, p.value = !1, v = l, A(() => {
+        c.value && c.value.focus(), C(), F(), setTimeout(() => {
+          h.value && (h.value.scrollTop = 0), C();
+        });
+      });
+    }, K = () => {
+      const {
+        documentElement: l
+      } = document;
+      document.removeEventListener("keydown", N), document.removeEventListener("focusin", B, !0), i.value = !1, f = ue(h.value, () => {
+        i.value || (f(), V(), f = null, p.value = !0, l && (l.style.scrollBehavior = "auto"), window.scrollTo(a.value.x, a.value.y), l && (l.style.scrollBehavior = ""), v && v.focus());
+      }, e.animationDuration + 16);
+    }, U = g(() => ({
+      ...d.attrs,
+      "aria-describedby": e.ariaDescribedby,
+      "aria-modal": "true",
+      id: e.id
+    })), Y = g(() => {
+      const l = Number(P), o = Number(P) + Number(ce);
+      return $.value ? l : o + l;
+    }), j = g(() => S.value - y.value - Y.value), G = g(() => {
+      const l = k.value > _.value, o = L.value - H.value > 0;
+      return l && o ? 4 : l ? 12 : 0;
+    });
+    return x(() => e.opened, (l, o) => {
+      !!l != !!o && (l ? W() : K());
+    }), ee(() => {
+      e.opened && W(), window.addEventListener("resize", I);
+    }), le(() => {
+      window.removeEventListener("resize", I);
+    }), {
+      style: oe(),
+      mapClasses: ve,
+      baseClass: E,
+      modalClosed: p,
+      modalEl: c,
+      wrapperEl: h,
+      contentEl: u,
+      headerEl: T,
+      scrollMaxHeight: j,
+      scrollPadding: G,
+      onClick: M,
+      dialogAttrs: U
+    };
+  }
+}), be = ["tabIndex"], ge = ["role", "aria-modal", "aria-label"], Ce = ["tabIndex"];
+function we(e, d, E, f, v, p) {
+  const i = z("icon-x-lg"), a = z("cdr-button");
+  return te(), ne("div", {
+    class: s(e.mapClasses(e.style, e.baseClass, !e.opened && "cdr-modal--closed")),
+    ref: "wrapperEl"
+  }, [n("div", {
+    class: s([e.style["cdr-modal__outerWrap"], e.wrapperClass])
+  }, [n("div", {
+    "aria-hidden": "true",
+    onClick: d[0] || (d[0] = (...y) => e.onClick && e.onClick(...y)),
+    class: s([e.style["cdr-modal__overlay"], e.overlayClass])
+  }, null, 2), n("div", {
+    tabIndex: e.opened ? "0" : void 0
+  }, null, 8, be), n("div", se({
+    ref: "modalEl",
+    class: e.mapClasses(e.style, "cdr-modal__contentWrap", "cdr-modal__dialog"),
+    tabIndex: "-1",
+    role: e.role,
+    "aria-modal": !!e.opened,
+    "aria-label": e.label
+  }, e.dialogAttrs), [w(e.$slots, "modal", {}, () => [n("div", {
+    class: s([e.style["cdr-modal__innerWrap"], e.contentClass]),
+    style: O(e.modalClosed ? {
+      display: "none"
+    } : void 0)
+  }, [n("section", null, [n("div", {
+    class: s(e.style["cdr-modal__content"])
+  }, [n("div", {
+    class: s(e.style["cdr-modal__header"]),
+    ref: "headerEl"
+  }, [n("div", {
+    class: s(e.style["cdr-modal__title"])
+  }, [e.showTitle ? w(e.$slots, "title", {
+    key: 0
+  }, () => [n("h1", null, ae(e.label), 1)]) : re("", !0)], 2), X(a, {
+    class: s(e.style["cdr-modal__close-button"]),
+    "icon-only": "",
+    "with-background": !0,
+    onClick: e.onClick,
+    "aria-label": "Close"
+  }, {
+    icon: de(() => [X(i, {
+      "inherit-color": ""
+    })]),
+    _: 1
+  }, 8, ["class", "onClick"])], 2), n("div", {
+    class: s(e.style["cdr-modal__text-content"]),
+    style: O({
+      maxHeight: `${e.scrollMaxHeight}px`,
+      paddingRight: `${e.scrollPadding}px`
+    }),
+    role: "document",
+    ref: "contentEl",
+    tabindex: "0"
+  }, [w(e.$slots, "default")], 6)], 2)])], 6)])], 16, ge), n("div", {
+    tabIndex: e.opened ? "0" : void 0
+  }, null, 8, Ce)], 2)], 2);
+}
+const Ee = {
+  $style: pe
+}, Ie = /* @__PURE__ */ ye(he, [["render", we], ["__cssModules", Ee]]);
+export {
+  Ie as default
+};

package/dist/src/components/modal/onTransitionEnd.mjs

@@ -0,0 +1,29 @@
+const s = {
+  transition: "transitionend",
+  WebkitTransition: "webkitTransitionEnd",
+  MozTransition: "transitionend",
+  OTransition: "oTransitionEnd otransitionend"
+};
+let o;
+if (typeof document < "u") {
+  const {
+    style: i
+  } = document.createElement("div"), n = Object.keys(s);
+  for (let t = 0, e = n[t]; t < n.length; t += 1, e = n[t])
+    if (e in i) {
+      o = s[e];
+      break;
+    }
+}
+const r = (i, n, t) => {
+  i.addEventListener(o, n);
+  let e;
+  return t && (e = setTimeout(() => {
+    i.removeEventListener(o, n), n();
+  }, t)), () => {
+    clearTimeout(e), i.removeEventListener(o, n);
+  };
+};
+export {
+  r as default
+};

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

@@ -0,0 +1,17 @@
+const d = {
+  "cdr-modal": "cdr-modal_13-4-1",
+  "cdr-modal__overlay": "cdr-modal__overlay_13-4-1",
+  "cdr-modal__outerWrap": "cdr-modal__outerWrap_13-4-1",
+  "cdr-modal__contentWrap": "cdr-modal__contentWrap_13-4-1",
+  "cdr-modal__innerWrap": "cdr-modal__innerWrap_13-4-1",
+  "cdr-modal__dialog": "cdr-modal__dialog_13-4-1",
+  "cdr-modal__content": "cdr-modal__content_13-4-1",
+  "cdr-modal__header": "cdr-modal__header_13-4-1",
+  "cdr-modal__title": "cdr-modal__title_13-4-1",
+  "cdr-modal__close-button": "cdr-modal__close-button_13-4-1",
+  "cdr-modal__text-content": "cdr-modal__text-content_13-4-1",
+  "cdr-modal--closed": "cdr-modal--closed_13-4-1"
+};
+export {
+  d as default
+};

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

@@ -0,0 +1,199 @@
+import "core-js/modules/es.array.push.js";
+import "core-js/modules/es.array.unshift.js";
+import { defineComponent as B, ref as q, computed as d, onMounted as G, watch as R, useCssModule as U, resolveComponent as $, openBlock as l, createElementBlock as u, createElementVNode as k, normalizeClass as r, createBlock as D, resolveDynamicComponent as T, withCtx as h, createVNode as f, createTextVNode as m, Fragment as N, renderList as w, toDisplayString as I, withModifiers as E, nextTick as H } from "vue";
+import z from "../../utils/mapClasses.mjs";
+import A from "../../utils/propValidator.mjs";
+import F from "../icon/comps/caret-left.vue.mjs";
+import W from "../icon/comps/caret-right.vue.mjs";
+import J from "../select/CdrSelect.vue.mjs";
+import K from "../../utils/uid.mjs";
+import Q from "./styles/CdrPagination.module.scss.mjs";
+import X from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const Y = B({
+  name: "CdrPagination",
+  components: {
+    IconCaretLeft: F,
+    IconCaretRight: W,
+    CdrSelect: J
+  },
+  props: {
+    // NOTE pagination now requires an ID
+    id: {
+      type: String
+    },
+    /**
+     * Total number of pages. Sometimes the total number of pages is different than total page data
+     * and this prop allows for that.
+     */
+    totalPages: {
+      type: Number,
+      default: null
+    },
+    /**
+     * Array of objects. Objects have structure of { page: Number, url: String }
+     */
+    pages: {
+      type: Array,
+      required: !0,
+      validator: (e) => e.every((i) => !Object.prototype.hasOwnProperty.call(i, "page") || typeof i.page != "number" ? (console.error('Property "page" is missing or is not a number', i), !1) : !Object.prototype.hasOwnProperty.call(i, "url") || typeof i.url != "string" ? (console.error('Property "url" is missing or is not a string', i), !1) : !0)
+    },
+    linkTag: {
+      type: String,
+      default: "a",
+      validator: (e) => A(e, ["a", "button"])
+    },
+    forLabel: {
+      type: String,
+      default: ""
+    },
+    /** @ignore used for binding v-model, represents the current page */
+    modelValue: {
+      type: Number
+    }
+  },
+  emits: ["update:modelValue", "navigate"],
+  setup(e, s) {
+    const i = q(0), C = q([]), _ = e.id ? e.id : K(), y = (n) => {
+      i.value = e.pages.map((t) => t.page).indexOf(n);
+    }, p = d({
+      get: () => e.modelValue,
+      set: (n) => {
+        y(n), s.emit("update:modelValue", n);
+      }
+    }), P = d(() => e.pages[i.value].url), v = (n, t) => {
+      const g = t.target.offsetWidth > 0 && t.target.offsetHeight > 0;
+      if (n === p.value && g) {
+        t.preventDefault();
+        return;
+      }
+      p.value = n, s.emit("navigate", n, P.value, t), H(() => {
+        try {
+          (t.currentTarget || t.target).blur();
+        } catch (o) {
+          console.error(o);
+        }
+      });
+    }, a = (n) => {
+      C.value.find((g) => (g == null ? void 0 : g.innerHTML) === n.target.value).click();
+    }, b = d(() => e.forLabel || "Pagination"), c = d(() => e.pages[i.value - 1]), O = d(() => e.pages[i.value + 1]), S = d(() => {
+      const n = e.pages.length, t = p.value, g = 1;
+      let o = [], L = !0, M = !0;
+      if (n <= 7)
+        return e.pages;
+      if (t < 5)
+        L = !1, o = e.pages.slice(1, 5);
+      else if (n - t < 4)
+        M = !1, o = e.pages.slice(-5, -1);
+      else
+        for (let V = Math.max(2, t - g); V <= Math.min(n - 1, t + g); V += 1)
+          o.push(e.pages[V - 1]);
+      return t - g > 2 && L && o.unshift("&hellip;"), t + g < n - 1 && M && o.push("&hellip;"), o.unshift(e.pages[0]), o.push(e.pages[n - 1]), o;
+    });
+    return G(() => y(p.value)), R(() => e.pages, () => y(p.value)), {
+      style: U(),
+      mapClasses: z,
+      uniqueId: _,
+      linkRefs: C,
+      navigate: v,
+      select: a,
+      ariaLabel: b,
+      prevPageData: c,
+      nextPageData: O,
+      paginationData: S,
+      innerValue: p,
+      currentIdx: i
+    };
+  }
+}), Z = ["aria-label"], j = {
+  key: 0
+}, x = {
+  key: 1,
+  "aria-hidden": "true"
+}, ee = ["value"], ae = {
+  key: 2
+}, ne = {
+  key: 3,
+  "aria-hidden": "true"
+};
+function te(e, s, i, C, _, y) {
+  const p = $("icon-caret-left"), P = $("cdr-select"), v = $("icon-caret-right");
+  return l(), u("nav", {
+    "aria-label": e.ariaLabel
+  }, [k("ol", {
+    class: r(e.style["cdr-pagination"])
+  }, [e.innerValue > e.pages[0].page ? (l(), u("li", j, [(l(), D(T(e.linkTag), {
+    "aria-label": "Go to previous page",
+    href: e.linkTag === "a" && e.prevPageData && e.prevPageData.url || void 0,
+    class: r(e.mapClasses(e.style, "cdr-pagination__link", "cdr-pagination__prev")),
+    onClick: s[0] || (s[0] = (a) => e.navigate(e.prevPageData.page, a))
+  }, {
+    default: h(() => [f(p, {
+      class: r(e.style["cdr-pagination_caret--prev"])
+    }, null, 8, ["class"]), m(" Prev ")]),
+    _: 1
+  }, 8, ["href", "class"]))])) : (l(), u("li", x, [k("span", {
+    "aria-disabled": "true",
+    class: r(e.mapClasses(e.style, "cdr-pagination__link", "cdr-pagination__prev", "cdr-pagination__link--disabled"))
+  }, [f(p, {
+    class: r(e.style["cdr-pagination_caret--prev"]),
+    "inherit-color": ""
+  }, null, 8, ["class"]), m(" Prev ")], 2)])), (l(!0), u(N, null, w(e.paginationData, (a, b) => (l(), u("li", {
+    key: `pagination-${e.uniqueId}-li-${a.page}`,
+    class: r(e.style["cdr-pagination__li--links"])
+  }, [a.page ? (l(), D(T(e.linkTag), {
+    key: 0,
+    id: `pagination-${e.uniqueId}-link-${a.page}`,
+    class: r(e.mapClasses(e.style, "cdr-pagination__link", a.page === e.innerValue && "cdr-pagination__link--current")),
+    "aria-label": a.page === e.innerValue ? `Current page, page ${a.page}` : `Go to page ${a.page}`,
+    "aria-current": a.page === e.innerValue ? "page" : null,
+    href: e.linkTag === "a" && a.url || void 0,
+    ref_for: !0,
+    ref: (c) => {
+      e.linkRefs[b] = c;
+    },
+    onClick: (c) => e.navigate(a.page, c)
+  }, {
+    default: h(() => [m(I(a.page), 1)]),
+    _: 2
+  }, 1032, ["id", "class", "aria-label", "aria-current", "href", "onClick"])) : (l(), u("span", {
+    key: 1,
+    class: r(e.style["cdr-pagination__ellipse"])
+  }, " … ", 2))], 2))), 128)), k("li", {
+    class: r(e.style["cdr-pagination__li--select"])
+  }, [f(P, {
+    id: `pagination-select-${e.uniqueId}`,
+    modelValue: e.innerValue,
+    "onUpdate:modelValue": s[1] || (s[1] = (a) => e.innerValue = a),
+    label: "Navigate to page",
+    "hide-label": "",
+    onChange: s[2] || (s[2] = E((a) => e.select(a), ["prevent"]))
+  }, {
+    default: h(() => [(l(!0), u(N, null, w(e.paginationData.filter((a) => a.page), (a) => (l(), u("option", {
+      key: `pagination-${e.uniqueId}-select-${a.page}`,
+      value: a.page
+    }, " Page " + I(a.page) + I(e.totalPages === null ? "" : ` of ${e.totalPages}`), 9, ee))), 128))]),
+    _: 1
+  }, 8, ["id", "modelValue"])], 2), e.innerValue < e.pages[e.pages.length - 1].page ? (l(), u("li", ae, [(l(), D(T(e.linkTag), {
+    "aria-label": "Go to next page",
+    href: e.linkTag === "a" && e.nextPageData && e.nextPageData.url || void 0,
+    class: r(e.mapClasses(e.style, "cdr-pagination__link", "cdr-pagination__next")),
+    onClick: s[3] || (s[3] = (a) => e.navigate(e.nextPageData.page, a))
+  }, {
+    default: h(() => [m(" Next "), f(v, {
+      class: r(e.style["cdr-pagination_caret--next"])
+    }, null, 8, ["class"])]),
+    _: 1
+  }, 8, ["href", "class"]))])) : (l(), u("li", ne, [k("span", {
+    "aria-disabled": "true",
+    class: r(e.mapClasses(e.style, "cdr-pagination__link", "cdr-pagination__next", "cdr-pagination__link--disabled"))
+  }, [m(" Next "), f(v, {
+    class: r(e.style["cdr-pagination_caret--next"]),
+    "inherit-color": ""
+  }, null, 8, ["class"])], 2)]))], 2)], 8, Z);
+}
+const ie = {
+  $style: Q
+}, ye = /* @__PURE__ */ X(Y, [["render", te], ["__cssModules", ie]]);
+export {
+  ye as default
+};

package/dist/src/components/pagination/styles/CdrPagination.module.scss.mjs

@@ -0,0 +1,58 @@
+const l = {
+  "cdr-icon": "cdr-icon_13-4-1",
+  "cdr-icon--small": "cdr-icon--small_13-4-1",
+  "cdr-icon--large": "cdr-icon--large_13-4-1",
+  "cdr-icon--small@xs": "cdr-icon--small@xs_13-4-1",
+  "cdr-icon--large@xs": "cdr-icon--large@xs_13-4-1",
+  "cdr-icon--small@sm": "cdr-icon--small@sm_13-4-1",
+  "cdr-icon--large@sm": "cdr-icon--large@sm_13-4-1",
+  "cdr-icon--small@md": "cdr-icon--small@md_13-4-1",
+  "cdr-icon--large@md": "cdr-icon--large@md_13-4-1",
+  "cdr-icon--small@lg": "cdr-icon--small@lg_13-4-1",
+  "cdr-icon--large@lg": "cdr-icon--large@lg_13-4-1",
+  "cdr-icon--inherit-color": "cdr-icon--inherit-color_13-4-1",
+  "cdr-label-standalone": "cdr-label-standalone_13-4-1",
+  "cdr-label-standalone__label-wrapper": "cdr-label-standalone__label-wrapper_13-4-1",
+  "cdr-label-standalone__label": "cdr-label-standalone__label_13-4-1",
+  "cdr-label-standalone__label--sr-only": "cdr-label-standalone__label--sr-only_13-4-1",
+  "cdr-label-standalone__label--disabled": "cdr-label-standalone__label--disabled_13-4-1",
+  "cdr-label-standalone__optional": "cdr-label-standalone__optional_13-4-1",
+  "cdr-label-standalone__helper": "cdr-label-standalone__helper_13-4-1",
+  "cdr-label-standalone__info": "cdr-label-standalone__info_13-4-1",
+  "cdr-label-standalone__post-content": "cdr-label-standalone__post-content_13-4-1",
+  "cdr-label-standalone__info-action": "cdr-label-standalone__info-action_13-4-1",
+  "cdr-label-standalone__input-wrap": "cdr-label-standalone__input-wrap_13-4-1",
+  "cdr-label-standalone__input-spacing": "cdr-label-standalone__input-spacing_13-4-1",
+  "cdr-form-error": "cdr-form-error_13-4-1",
+  "cdr-form-error__icon": "cdr-form-error__icon_13-4-1",
+  "cdr-select": "cdr-select_13-4-1",
+  "cdr-select--primary": "cdr-select--primary_13-4-1",
+  "cdr-select--secondary": "cdr-select--secondary_13-4-1",
+  "cdr-select--error": "cdr-select--error_13-4-1",
+  "cdr-select--preicon": "cdr-select--preicon_13-4-1",
+  "cdr-select__prompt": "cdr-select__prompt_13-4-1",
+  "cdr-select__caret": "cdr-select__caret_13-4-1",
+  "cdr-select__caret--disabled": "cdr-select__caret--disabled_13-4-1",
+  "cdr-select__pre-icon": "cdr-select__pre-icon_13-4-1",
+  "cdr-select--multiple": "cdr-select--multiple_13-4-1",
+  "cdr-select--large@xs": "cdr-select--large@xs_13-4-1",
+  "cdr-select--large": "cdr-select--large_13-4-1",
+  "cdr-select--large@sm": "cdr-select--large@sm_13-4-1",
+  "cdr-select--large@md": "cdr-select--large@md_13-4-1",
+  "cdr-select--large@lg": "cdr-select--large@lg_13-4-1",
+  "cdr-select-wrap": "cdr-select-wrap_13-4-1",
+  "cdr-pagination": "cdr-pagination_13-4-1",
+  "cdr-pagination__li--links": "cdr-pagination__li--links_13-4-1",
+  "cdr-pagination__li--select": "cdr-pagination__li--select_13-4-1",
+  "cdr-pagination__link": "cdr-pagination__link_13-4-1",
+  "cdr-pagination__link--current": "cdr-pagination__link--current_13-4-1",
+  "cdr-pagination__link--disabled": "cdr-pagination__link--disabled_13-4-1",
+  "cdr-pagination__ellipse": "cdr-pagination__ellipse_13-4-1",
+  "cdr-pagination__prev": "cdr-pagination__prev_13-4-1",
+  "cdr-pagination__next": "cdr-pagination__next_13-4-1",
+  "cdr-pagination__caret--prev": "cdr-pagination__caret--prev_13-4-1",
+  "cdr-pagination__caret--next": "cdr-pagination__caret--next_13-4-1"
+};
+export {
+  l as default
+};

package/dist/src/components/popover/CdrPopover.vue.mjs

@@ -0,0 +1,130 @@
+import { defineComponent as P, ref as u, watch as E, onMounted as S, useCssModule as k, resolveComponent as m, openBlock as y, createElementBlock as b, normalizeClass as n, createElementVNode as f, renderSlot as a, createVNode as v, withCtx as h, createTextVNode as q, toDisplayString as T, createCommentVNode as B } from "vue";
+import M from "tabbable";
+import N from "../icon/comps/x-sm.vue.mjs";
+import V from "../button/CdrButton.vue.mjs";
+import w from "../popup/CdrPopup.vue.mjs";
+import A from "../../utils/propValidator.mjs";
+import O from "../../utils/mapClasses.mjs";
+import z from "./styles/CdrPopover.module.scss.mjs";
+import D from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const H = P({
+  name: "CdrPopover",
+  components: {
+    IconXSm: N,
+    CdrButton: V,
+    CdrPopup: w
+  },
+  props: {
+    position: {
+      type: String,
+      required: !1,
+      default: "top",
+      validator: (e) => A(e, ["top", "bottom", "left", "right"])
+    },
+    autoPosition: {
+      type: Boolean,
+      required: !1,
+      default: !0
+    },
+    label: {
+      type: String,
+      required: !1
+    },
+    id: {
+      type: String,
+      required: !0
+    },
+    contentClass: {
+      type: String,
+      required: !1
+    },
+    open: {
+      type: Boolean,
+      default: !1,
+      required: !1
+    }
+  },
+  emits: ["opened", "closed"],
+  setup(e, t) {
+    const s = u(!1);
+    let l;
+    const i = u(null), p = u(null), d = t.slots.trigger, c = t.slots.title || e.label, r = (o) => {
+      if (s.value === !0)
+        return;
+      const {
+        activeElement: $
+      } = document;
+      l = $, s.value = !0, t.emit("opened", o), setTimeout(() => {
+        const C = M(p.value.$el);
+        C[0] && C[0].focus();
+      }, 50);
+    }, g = (o) => {
+      s.value = !1, t.emit("closed", o), l && l.focus();
+    }, _ = () => {
+      const o = i.value.children[0];
+      o && o.addEventListener("click", r);
+    };
+    return E(() => e.open, () => {
+      e.open ? r() : g();
+    }), S(() => {
+      _();
+      const o = i.value.children[0];
+      o && (o.setAttribute("aria-controls", e.id), o.setAttribute("aria-haspopup", "dialog"));
+    }), {
+      style: k(),
+      mapClasses: O,
+      hasTrigger: d,
+      triggerEl: i,
+      popupEl: p,
+      closePopover: g,
+      openPopover: r,
+      isOpen: s,
+      hasTitle: c
+    };
+  }
+}), I = {
+  ref: "triggerEl"
+};
+function L(e, t, s, l, i, p) {
+  const d = m("icon-x-sm"), c = m("cdr-button"), r = m("cdr-popup");
+  return y(), b("div", {
+    class: n(e.mapClasses(e.style, "cdr-popover--wrapper", e.hasTrigger && "cdr-popover--position"))
+  }, [f("div", I, [a(e.$slots, "trigger")], 512), v(r, {
+    role: "dialog",
+    ref: "popupEl",
+    onClosed: e.closePopover,
+    position: e.position,
+    "auto-position": e.autoPosition,
+    opened: e.isOpen,
+    "aria-expanded": `${e.isOpen}`,
+    id: e.id,
+    "content-class": e.contentClass
+  }, {
+    default: h(() => [f("div", {
+      class: n(e.style["cdr-popover__container"])
+    }, [f("div", {
+      class: n(e.style["cdr-popover__content"])
+    }, [e.hasTitle ? (y(), b("div", {
+      key: 0,
+      class: n(e.style["cdr-popover__title"])
+    }, [a(e.$slots, "title", {}, () => [q(T(e.label), 1)])], 2)) : B("", !0), a(e.$slots, "default")], 2), v(c, {
+      class: n(e.style["cdr-popover__close-button"]),
+      "icon-only": "",
+      onClick: e.closePopover,
+      "aria-label": "Close",
+      size: "small"
+    }, {
+      default: h(() => [a(e.$slots, "icon", {}, () => [v(d, {
+        "inherit-color": ""
+      })])]),
+      _: 3
+    }, 8, ["class", "onClick"])], 2)]),
+    _: 3
+  }, 8, ["onClosed", "position", "auto-position", "opened", "aria-expanded", "id", "content-class"])], 2);
+}
+const X = {
+  $style: z
+}, Y = /* @__PURE__ */ D(H, [["render", L], ["__cssModules", X]]);
+export {
+  Y as default
+};