@rei/cedar 13.4.0-alpha.0 → 13.5.0-alpha.0

package/dist/node_modules/@rei/cdr-tokens/dist/js/cdr-tokens.mjs

@@ -0,0 +1,10 @@
+const o = "#ffffff", r = "8", n = "16", c = "32", t = "768", a = "992", d = "1232";
+export {
+  d as CdrBreakpointLg,
+  a as CdrBreakpointMd,
+  t as CdrBreakpointSm,
+  o as CdrColorBackgroundPrimary,
+  r as CdrSpaceHalfX,
+  n as CdrSpaceOneX,
+  c as CdrSpaceTwoX
+};

package/dist/src/components/accordion/CdrAccordion.vue.mjs

@@ -0,0 +1,155 @@
+import { defineComponent as I, inject as b, useCssModule as w, ref as C, computed as n, watch as P, onMounted as J, resolveComponent as K, openBlock as p, createBlock as u, resolveDynamicComponent as m, normalizeClass as l, withCtx as f, mergeProps as L, toHandlers as Q, createElementVNode as g, renderSlot as $, createTextVNode as R, toDisplayString as W, createCommentVNode as X, normalizeStyle as Y } from "vue";
+import Z from "../icon/comps/caret-down.vue.mjs";
+import { modifyClassName as t } from "../../utils/buildClass.mjs";
+import _ from "../../utils/mapClasses.mjs";
+import x from "./styles/CdrAccordion.module.scss.mjs";
+import ee from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const ne = I({
+  name: "CdrAccordion",
+  components: {
+    IconCaretDown: Z
+  },
+  props: {
+    /**
+     * The unique id of an accordion.
+     */
+    id: {
+      type: String,
+      required: !0
+    },
+    /**
+     * Toggle this value to open/close the accordion.
+     */
+    opened: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Sets a compact style.
+     */
+    compact: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Sets a border-aligned style.
+     */
+    borderAligned: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Sets the heading level
+     */
+    level: {
+      type: [String, Number],
+      required: !0
+    },
+    /**
+     * Toggles content spacing (padding)
+     */
+    contentSpacing: {
+      type: Boolean,
+      default: !0
+    },
+    label: {
+      type: String
+    }
+  },
+  emits: ["accordion-toggle"],
+  setup(e, y) {
+    const c = b("unwrap", !1), v = b("grouped", !1) ? "li" : "div", h = w(), d = C(null), o = C(!1), i = C(e.opened ? "none" : "0px"), S = `h${e.level}`, U = "cdr-accordion__label", a = "cdr-accordion", B = "cdr-accordion__icon", A = "cdr-accordion__content-container", H = "cdr-accordion__content", s = n(() => c && c.isUnwrapped), k = n(() => s.value ? "div" : "button"), N = n(() => s.value ? "js-cdr-accordion-button" : [h["cdr-accordion__button"], "js-cdr-accordion-button"]), T = n(() => s.value ? "cdr-accordion__header--unwrapped" : "cdr-accordion__header"), z = n(() => e.compact ? t(a, "compact") : ""), M = n(() => e.borderAligned ? t(a, "border-aligned") : ""), O = n(() => o.value ? t(a, "focused") : null), j = n(() => s.value ? t(a, "unwrap") : null), D = n(() => e.contentSpacing ? null : t(a, "no-spacing")), E = n(() => e.opened || s.value ? "cdr-accordion--open" : "cdr-accordion--closed"), V = (r) => {
+      y.emit("accordion-toggle", r);
+    }, q = () => {
+      o.value = !0;
+    }, G = () => {
+      o.value = !1;
+    }, F = n(() => s.value ? {} : {
+      click: V,
+      focus: q,
+      blur: G
+    });
+    return P(() => e.opened, (r) => {
+      i.value = r ? "0px" : `${d.value.clientHeight}px`, setTimeout(() => {
+        i.value = r ? `${d.value.clientHeight}px` : "0px", setTimeout(() => {
+          i.value = r ? "none" : "0px";
+        }, 350);
+      }, 50);
+    }), J(() => {
+      e.opened && d.value && (i.value = "none");
+    }), {
+      style: w(),
+      headingTag: S,
+      headingClass: T,
+      headingContent: k,
+      headingContentStyle: N,
+      isGrouped: v,
+      unwrap: c,
+      accordionContentEl: d,
+      focused: o,
+      maxHeight: i,
+      baseClass: a,
+      labelClass: U,
+      compactClass: z,
+      borderAlignedClass: M,
+      focusedClass: O,
+      iconClass: B,
+      containerClass: A,
+      isOpenClass: E,
+      contentClass: H,
+      noSpacingClass: D,
+      listeners: F,
+      unwrapClass: j,
+      isUnwrapped: s,
+      mapClasses: _
+    };
+  }
+}), se = ["id"], oe = ["aria-hidden", "id"];
+function ae(e, y, c, v, h, d) {
+  const o = K("icon-caret-down");
+  return p(), u(m(e.isGrouped), {
+    class: l(e.isUnwrapped ? null : e.mapClasses(e.style, e.baseClass, e.compactClass, e.borderAlignedClass, e.focusedClass, e.noSpacingClass)),
+    id: `${e.id}-accordion`
+  }, {
+    default: f(() => [(p(), u(m(e.headingTag), {
+      class: l(e.style[e.headingClass])
+    }, {
+      default: f(() => [(p(), u(m(e.headingContent), L({
+        class: e.headingContentStyle,
+        id: e.id
+      }, Q(e.listeners), {
+        "aria-expanded": e.isUnwrapped ? null : `${e.opened}`,
+        "aria-pressed": e.isUnwrapped ? null : `${e.opened}`,
+        "aria-controls": e.isUnwrapped ? null : `${e.id}-collapsible`
+      }), {
+        default: f(() => [g("span", {
+          class: l(e.style[e.labelClass]),
+          id: `${e.id}-label`
+        }, [$(e.$slots, "label", {}, () => [R(W(e.label), 1)])], 10, se), e.isUnwrapped ? X("", !0) : (p(), u(o, {
+          key: 0,
+          class: l(e.mapClasses(e.style, e.iconClass, e.isOpenClass)),
+          size: e.compact ? "small" : null
+        }, null, 8, ["class", "size"]))]),
+        _: 3
+      }, 16, ["class", "id", "aria-expanded", "aria-pressed", "aria-controls"]))]),
+      _: 3
+    }, 8, ["class"])), g("div", {
+      class: l(e.mapClasses(e.style, e.containerClass, e.isOpenClass, e.unwrapClass)),
+      style: Y({
+        maxHeight: e.isUnwrapped ? "none" : e.maxHeight
+      })
+    }, [g("div", {
+      class: l(e.mapClasses(e.style, e.contentClass, e.isOpenClass, e.unwrapClass)),
+      "aria-hidden": e.isUnwrapped ? null : `${!e.opened}`,
+      id: `${e.id}-collapsible`,
+      ref: "accordionContentEl"
+    }, [$(e.$slots, "default")], 10, oe)], 6)]),
+    _: 3
+  }, 8, ["class", "id"]);
+}
+const le = {
+  $style: x
+}, ue = /* @__PURE__ */ ee(ne, [["render", ae], ["__cssModules", le]]);
+export {
+  ue as default
+};

package/dist/src/components/accordion/CdrAccordionGroup.vue.mjs

@@ -0,0 +1,78 @@
+import { defineComponent as w, ref as l, reactive as y, provide as c, computed as d, onMounted as g, useCssModule as b, openBlock as D, createElementBlock as k, normalizeClass as C, renderSlot as x } from "vue";
+import { debounce as A } from "lodash-es";
+import $ from "../../utils/propValidator.mjs";
+import p from "../../mixins/breakpoints.mjs";
+import B from "./styles/CdrAccordionGroup.module.scss.mjs";
+import E from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const U = w({
+  name: "CdrAccordionGroup",
+  props: {
+    unwrap: {
+      type: [String, Boolean],
+      default: !1,
+      validator: (e) => typeof e == "string" ? $(e, ["@xs", "@sm", "@md", "@lg"], !1) : typeof e == "boolean"
+    }
+  },
+  setup(e) {
+    const n = "cdr-accordion-group", t = l(0), r = l([]), u = l(null), a = y({
+      isUnwrapped: !!e.unwrap
+    });
+    c("unwrap", a), c("grouped", !0);
+    const s = d(() => {
+      const o = t.value + 1;
+      return o >= r.value.length ? 0 : o;
+    }), i = d(() => {
+      const o = t.value - 1;
+      return o <= -1 ? r.value.length - 1 : o;
+    }), f = (o) => {
+      if (t.value === -1)
+        return;
+      const {
+        key: m
+      } = o;
+      switch (m) {
+        case "Home":
+          o.preventDefault(), r.value[0].focus();
+          break;
+        case "End":
+          o.preventDefault(), r.value[r.value.length - 1].focus();
+          break;
+        case "ArrowDown":
+        case "Down":
+          o.preventDefault(), r.value[s.value].focus();
+          break;
+        case "ArrowUp":
+        case "Up":
+          o.preventDefault(), r.value[i.value].focus();
+          break;
+      }
+    }, v = (o) => {
+      t.value = Array.prototype.indexOf.call(r.value, o.target);
+    };
+    return g(() => {
+      r.value = u.value.querySelectorAll(".js-cdr-accordion-button"), typeof e.unwrap == "string" && (a.isUnwrapped = e.unwrap.indexOf(p()) !== -1, window.addEventListener("resize", A(() => {
+        a.isUnwrapped = e.unwrap.indexOf(p()) !== -1;
+      }, 300)));
+    }), {
+      style: b(),
+      handleKeyDown: f,
+      focusin: v,
+      baseClass: n,
+      accordionGroupEl: u
+    };
+  }
+});
+function h(e, n, t, r, u, a) {
+  return D(), k("ul", {
+    class: C(e.style[e.baseClass]),
+    ref: "accordionGroupEl",
+    onFocusin: n[0] || (n[0] = (...s) => e.focusin && e.focusin(...s)),
+    onKeydown: n[1] || (n[1] = (...s) => e.handleKeyDown && e.handleKeyDown(...s))
+  }, [x(e.$slots, "default")], 34);
+}
+const G = {
+  $style: B
+}, j = /* @__PURE__ */ E(U, [["render", h], ["__cssModules", G]]);
+export {
+  j as default
+};

package/dist/src/components/accordion/styles/CdrAccordion.module.scss.mjs

@@ -0,0 +1,34 @@
+const c = {
+  "cdr-icon": "cdr-icon_13-5-0-alpha-0",
+  "cdr-icon--small": "cdr-icon--small_13-5-0-alpha-0",
+  "cdr-icon--large": "cdr-icon--large_13-5-0-alpha-0",
+  "cdr-icon--small@xs": "cdr-icon--small@xs_13-5-0-alpha-0",
+  "cdr-icon--large@xs": "cdr-icon--large@xs_13-5-0-alpha-0",
+  "cdr-icon--small@sm": "cdr-icon--small@sm_13-5-0-alpha-0",
+  "cdr-icon--large@sm": "cdr-icon--large@sm_13-5-0-alpha-0",
+  "cdr-icon--small@md": "cdr-icon--small@md_13-5-0-alpha-0",
+  "cdr-icon--large@md": "cdr-icon--large@md_13-5-0-alpha-0",
+  "cdr-icon--small@lg": "cdr-icon--small@lg_13-5-0-alpha-0",
+  "cdr-icon--large@lg": "cdr-icon--large@lg_13-5-0-alpha-0",
+  "cdr-icon--inherit-color": "cdr-icon--inherit-color_13-5-0-alpha-0",
+  "cdr-accordion-group": "cdr-accordion-group_13-5-0-alpha-0",
+  "cdr-accordion": "cdr-accordion_13-5-0-alpha-0",
+  "cdr-accordion__button": "cdr-accordion__button_13-5-0-alpha-0",
+  "cdr-accordion__label": "cdr-accordion__label_13-5-0-alpha-0",
+  "cdr-accordion__header": "cdr-accordion__header_13-5-0-alpha-0",
+  "cdr-accordion__header--unwrapped": "cdr-accordion__header--unwrapped_13-5-0-alpha-0",
+  "cdr-accordion__icon": "cdr-accordion__icon_13-5-0-alpha-0",
+  "cdr-accordion--open": "cdr-accordion--open_13-5-0-alpha-0",
+  "cdr-accordion__content-container": "cdr-accordion__content-container_13-5-0-alpha-0",
+  "cdr-tabs--open": "cdr-tabs--open_13-5-0-alpha-0",
+  "cdr-accordion__content": "cdr-accordion__content_13-5-0-alpha-0",
+  "cdr-accordion--closed": "cdr-accordion--closed_13-5-0-alpha-0",
+  "cdr-accordion--unwrap": "cdr-accordion--unwrap_13-5-0-alpha-0",
+  "cdr-accordion--border-aligned": "cdr-accordion--border-aligned_13-5-0-alpha-0",
+  "cdr-accordion--no-spacing": "cdr-accordion--no-spacing_13-5-0-alpha-0",
+  "cdr-accordion--compact": "cdr-accordion--compact_13-5-0-alpha-0",
+  "cdr-accordion--focused": "cdr-accordion--focused_13-5-0-alpha-0"
+};
+export {
+  c as default
+};

package/dist/src/components/accordion/styles/CdrAccordionGroup.module.scss.mjs

@@ -0,0 +1,7 @@
+const c = {
+  "cdr-accordion-group": "cdr-accordion-group_13-5-0-alpha-0",
+  "cdr-accordion": "cdr-accordion_13-5-0-alpha-0"
+};
+export {
+  c as default
+};

package/dist/src/components/banner/CdrBanner.vue.mjs

@@ -0,0 +1,56 @@
+import { defineComponent as b, computed as y, useCssModule as g, openBlock as o, createElementBlock as a, normalizeClass as e, createElementVNode as i, renderSlot as r, createCommentVNode as l } from "vue";
+import h from "../../utils/propValidator.mjs";
+import $ from "./styles/CdrBanner.module.scss.mjs";
+import C from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const v = b({
+  name: "CdrBanner",
+  props: {
+    type: {
+      type: String,
+      validator: (s) => h(s, ["info", "warning", "success", "error", "default"]),
+      default: "default"
+    }
+  },
+  setup(s, n) {
+    const t = "cdr-banner", d = y(() => `${t}--${s.type}`), c = y(() => n.slots["message-body"] ? `${t}__wrapper--prominence` : void 0), p = n.slots["icon-left"], f = n.slots["icon-right"], m = n.slots["message-body"], u = n.slots["info-action"];
+    return {
+      style: g(),
+      baseClass: t,
+      typeClass: d,
+      prominenceClass: c,
+      hasIconLeft: p,
+      hasIconRight: f,
+      hasMessageBody: m,
+      hasInfoAction: u
+    };
+  }
+});
+function k(s, n, t, d, c, p) {
+  return o(), a("div", {
+    class: e([s.style[s.baseClass], s.style[s.typeClass]])
+  }, [i("div", {
+    class: e([s.style["cdr-banner__wrapper"], s.style[s.prominenceClass]])
+  }, [i("div", {
+    class: e([s.style["cdr-banner__main"]])
+  }, [s.hasIconLeft ? (o(), a("div", {
+    key: 0,
+    class: e([s.style["cdr-banner__icon-left"]])
+  }, [r(s.$slots, "icon-left")], 2)) : l("", !0), i("span", {
+    class: e([s.style["cdr-banner__message"]])
+  }, [r(s.$slots, "default")], 2), s.hasIconRight ? (o(), a("div", {
+    key: 1,
+    class: e([s.style["cdr-banner__icon-right"]])
+  }, [r(s.$slots, "icon-right")], 2)) : l("", !0)], 2), s.hasMessageBody ? (o(), a("div", {
+    key: 0,
+    class: e([s.style["cdr-banner__message-body"]])
+  }, [r(s.$slots, "message-body")], 2)) : l("", !0)], 2), s.hasInfoAction ? (o(), a("div", {
+    key: 0,
+    class: e([s.style["cdr-banner__info-action"]])
+  }, [r(s.$slots, "info-action")], 2)) : l("", !0)], 2);
+}
+const B = {
+  $style: $
+}, A = /* @__PURE__ */ C(v, [["render", k], ["__cssModules", B]]);
+export {
+  A as default
+};

package/dist/src/components/banner/styles/CdrBanner.module.scss.mjs

@@ -0,0 +1,19 @@
+const n = {
+  "cdr-banner": "cdr-banner_13-5-0-alpha-0",
+  "cdr-banner__wrapper--prominence": "cdr-banner__wrapper--prominence_13-5-0-alpha-0",
+  "cdr-banner__main": "cdr-banner__main_13-5-0-alpha-0",
+  "cdr-banner__icon-left": "cdr-banner__icon-left_13-5-0-alpha-0",
+  "cdr-banner__message": "cdr-banner__message_13-5-0-alpha-0",
+  "cdr-banner__message-body": "cdr-banner__message-body_13-5-0-alpha-0",
+  "cdr-banner__icon-right": "cdr-banner__icon-right_13-5-0-alpha-0",
+  "cdr-banner__info-action": "cdr-banner__info-action_13-5-0-alpha-0",
+  "cdr-banner--default": "cdr-banner--default_13-5-0-alpha-0",
+  "cdr-banner__wrapper": "cdr-banner__wrapper_13-5-0-alpha-0",
+  "cdr-banner--info": "cdr-banner--info_13-5-0-alpha-0",
+  "cdr-banner--warning": "cdr-banner--warning_13-5-0-alpha-0",
+  "cdr-banner--success": "cdr-banner--success_13-5-0-alpha-0",
+  "cdr-banner--error": "cdr-banner--error_13-5-0-alpha-0"
+};
+export {
+  n as default
+};

package/dist/src/components/breadcrumb/CdrBreadcrumb.vue.mjs

@@ -0,0 +1,101 @@
+import { defineComponent as y, ref as u, computed as h, watch as b, useCssModule as g, openBlock as r, createElementBlock as l, normalizeClass as s, createElementVNode as n, createCommentVNode as f, Fragment as p, renderList as k, withDirectives as C, renderSlot as $, toDisplayString as E, vShow as _, nextTick as v } from "vue";
+import L from "../../utils/uid.mjs";
+import B from "./styles/CdrBreadcrumb.module.scss.mjs";
+import w from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const q = y({
+  name: "CdrBreadcrumb",
+  props: {
+    items: {
+      type: Array,
+      default: () => [],
+      validator: (e) => {
+        if (e.length && e.length > 0)
+          for (let t = 0; t < e.length; t += 1) {
+            if (typeof e[t].item != "object")
+              return console.error("Breadcrumb items array missing item key at index ", t), !1;
+            if (!Object.hasOwnProperty.call(e[t].item, "name"))
+              return console.error("Breadcrumb items array is missing item.name value at index ", t), !1;
+          }
+        return !0;
+      }
+    },
+    /**
+    * Flag to track container width threshold exceeded
+    */
+    truncationEnabled: {
+      type: Boolean,
+      default: !0
+    },
+    id: {
+      type: String
+    }
+  },
+  emits: ["navigate"],
+  setup(e) {
+    const t = e.id ? e.id : L(), a = u(e.truncationEnabled && e.items.length > 2), o = u(null), d = h(() => {
+      const i = e.items.length - 2 > 1 ? "s" : "";
+      return `show ${e.items.length - 2} more navigation level${i}`;
+    }), m = () => {
+      a.value = !1, v(() => {
+        o.value.querySelector("li a").focus();
+      });
+    };
+    return b(() => e.items, () => {
+      a.value = e.truncationEnabled && e.items.length > 2;
+    }), {
+      style: g(),
+      uniqueId: t,
+      truncate: a,
+      itemListEl: o,
+      ellipsisLabel: d,
+      handleEllipsisClick: m
+    };
+  }
+}), S = ["id"], I = ["id"], M = ["aria-controls", "aria-label"], j = ["href", "onClick"];
+function D(e, t, a, o, d, m) {
+  return r(), l("nav", {
+    class: s(e.style["cdr-breadcrumb"]),
+    id: e.uniqueId,
+    "aria-label": "breadcrumbs"
+  }, [n("ol", {
+    id: `${e.uniqueId}List`,
+    class: s(e.style["cdr-breadcrumb__list"]),
+    ref: "itemListEl"
+  }, [e.truncate ? (r(), l("li", {
+    key: 0,
+    class: s(e.style["cdr-breadcrumb__item"])
+  }, [n("button", {
+    onClick: t[0] || (t[0] = (...i) => e.handleEllipsisClick && e.handleEllipsisClick(...i)),
+    "aria-expanded": "false",
+    class: s(e.style["cdr-breadcrumb__ellipses"]),
+    "aria-controls": `${e.uniqueId}List`,
+    "aria-label": e.ellipsisLabel
+  }, [n("span", {
+    class: s(e.style["cdr-breadcrumb__ellipses-icon"]),
+    "aria-hidden": "true"
+  }, " . . . ", 2)], 10, M), n("span", {
+    class: s(e.style["cdr-breadcrumb__delimiter"]),
+    "aria-hidden": "true"
+  }, " / ", 2)], 2)) : f("", !0), (r(!0), l(p, null, k(e.items, (i, c) => C((r(), l("li", {
+    class: s(e.style["cdr-breadcrumb__item"]),
+    key: i.item.id || i.item.name.replace(/ /g, "-").toLowerCase()
+  }, [$(e.$slots, "link", {
+    class: s(e.style["cdr-breadcrumb__link"]),
+    href: i.item.url,
+    content: i.item.name
+  }, () => [n("a", {
+    class: s(e.style["cdr-breadcrumb__link"]),
+    href: i.item.url,
+    onClick: (O) => e.$emit("navigate", i, e.e)
+  }, E(i.item.name), 11, j)]), c < e.items.length - 1 ? (r(), l("span", {
+    key: 0,
+    class: s(e.style["cdr-breadcrumb__delimiter"]),
+    "aria-hidden": "true"
+  }, " / ", 2)) : f("", !0)], 2)), [[_, !e.truncate || c >= e.items.length - 2]])), 128))], 10, I)], 10, S);
+}
+const N = {
+  $style: B
+}, P = /* @__PURE__ */ w(q, [["render", D], ["__cssModules", N]]);
+export {
+  P as default
+};

package/dist/src/components/breadcrumb/styles/CdrBreadcrumb.module.scss.mjs

@@ -0,0 +1,12 @@
+const r = {
+  "cdr-breadcrumb": "cdr-breadcrumb_13-5-0-alpha-0",
+  "cdr-breadcrumb__list": "cdr-breadcrumb__list_13-5-0-alpha-0",
+  "cdr-breadcrumb__item": "cdr-breadcrumb__item_13-5-0-alpha-0",
+  "cdr-breadcrumb__link": "cdr-breadcrumb__link_13-5-0-alpha-0",
+  "cdr-breadcrumb__delimiter": "cdr-breadcrumb__delimiter_13-5-0-alpha-0",
+  "cdr-breadcrumb__ellipses": "cdr-breadcrumb__ellipses_13-5-0-alpha-0",
+  "cdr-breadcrumb__ellipses-icon": "cdr-breadcrumb__ellipses-icon_13-5-0-alpha-0"
+};
+export {
+  r as default
+};

package/dist/src/components/button/CdrButton.vue.mjs

@@ -0,0 +1,75 @@
+import { defineComponent as y, computed as o, useCssModule as C, openBlock as g, createBlock as h, resolveDynamicComponent as p, normalizeClass as $, withCtx as b, renderSlot as n } from "vue";
+import B from "../../utils/mapClasses.mjs";
+import { buildBooleanClass as k, responsiveModifyClass as w } from "../../utils/buildClass.mjs";
+import e from "../../utils/propValidator.mjs";
+import O from "./styles/CdrButton.module.scss.mjs";
+import v from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const z = y({
+  name: "CdrButton",
+  props: {
+    tag: {
+      type: String,
+      default: "button",
+      validator: (t) => e(t, ["button", "a"])
+    },
+    type: {
+      type: String,
+      default: "button",
+      validator: (t) => e(t, ["button", "submit", "reset"])
+    },
+    modifier: {
+      type: String,
+      default: "primary",
+      validator: (t) => e(t, ["primary", "secondary", "sale", "dark", "link"])
+    },
+    size: {
+      type: String,
+      default: "medium",
+      validator: (t) => e(t, ["small", "medium", "large"])
+    },
+    fullWidth: {
+      type: [String, Boolean],
+      default: !1,
+      validator: (t) => typeof t == "string" ? e(t, ["@xs", "@sm", "@md", "@lg"], !1) : typeof t == "boolean"
+    },
+    iconOnly: {
+      type: Boolean,
+      default: !1
+    },
+    withBackground: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(t, l) {
+    const s = "cdr-button", a = o(() => t.tag === "button" ? t.type : null), i = o(() => `${s}--${t.modifier}`), r = o(() => !t.iconOnly && t.fullWidth && k(s, t.fullWidth, "full-width")), d = o(() => t.iconOnly ? `cdr-button--icon-only-${t.size}` : w(s, "", t.size)), u = o(() => l.slots["icon-left"] && l.slots.default && `${s}--has-icon-left`), f = o(() => l.slots["icon-right"] && l.slots.default && `${s}--has-icon-right`), c = o(() => t.iconOnly && `${s}--icon-only`), m = o(() => t.iconOnly && t.withBackground && `${s}--with-background`);
+    return {
+      style: C(),
+      mapClasses: B,
+      baseClass: s,
+      buttonType: a,
+      modifierClass: i,
+      fullWidthClass: r,
+      sizeClass: d,
+      iconLeftClass: u,
+      iconRightClass: f,
+      iconOnlyClass: c,
+      withBackgroundClass: m
+    };
+  }
+});
+function S(t, l, s, a, i, r) {
+  return g(), h(p(t.tag), {
+    class: $(t.mapClasses(t.style, t.baseClass, t.modifierClass, t.sizeClass, t.fullWidthClass, t.iconOnlyClass, t.iconLeftClass, t.iconRightClass, t.withBackgroundClass)),
+    type: t.buttonType
+  }, {
+    default: b(() => [n(t.$slots, "icon-left"), n(t.$slots, "icon"), n(t.$slots, "default"), n(t.$slots, "icon-right")]),
+    _: 3
+  }, 8, ["class", "type"]);
+}
+const W = {
+  $style: O
+}, j = /* @__PURE__ */ v(z, [["render", S], ["__cssModules", W]]);
+export {
+  j as default
+};

package/dist/src/components/button/styles/CdrButton.module.scss.mjs

@@ -0,0 +1,36 @@
+const t = {
+  "cdr-button": "cdr-button_13-5-0-alpha-0",
+  "cdr-button--has-icon-left": "cdr-button--has-icon-left_13-5-0-alpha-0",
+  "cdr-button--has-icon-right": "cdr-button--has-icon-right_13-5-0-alpha-0",
+  "cdr-button--primary": "cdr-button--primary_13-5-0-alpha-0",
+  "cdr-button--secondary": "cdr-button--secondary_13-5-0-alpha-0",
+  "cdr-button--dark": "cdr-button--dark_13-5-0-alpha-0",
+  "cdr-button--sale": "cdr-button--sale_13-5-0-alpha-0",
+  "cdr-button--link": "cdr-button--link_13-5-0-alpha-0",
+  "cdr-button--large": "cdr-button--large_13-5-0-alpha-0",
+  "cdr-button--medium": "cdr-button--medium_13-5-0-alpha-0",
+  "cdr-button--small": "cdr-button--small_13-5-0-alpha-0",
+  "cdr-button--icon-only": "cdr-button--icon-only_13-5-0-alpha-0",
+  "cdr-button--icon-only-large": "cdr-button--icon-only-large_13-5-0-alpha-0",
+  "cdr-button--with-background": "cdr-button--with-background_13-5-0-alpha-0",
+  "cdr-button--full-width": "cdr-button--full-width_13-5-0-alpha-0",
+  "cdr-button--small@xs": "cdr-button--small@xs_13-5-0-alpha-0",
+  "cdr-button--medium@xs": "cdr-button--medium@xs_13-5-0-alpha-0",
+  "cdr-button--large@xs": "cdr-button--large@xs_13-5-0-alpha-0",
+  "cdr-button--full-width@xs": "cdr-button--full-width@xs_13-5-0-alpha-0",
+  "cdr-button--small@sm": "cdr-button--small@sm_13-5-0-alpha-0",
+  "cdr-button--medium@sm": "cdr-button--medium@sm_13-5-0-alpha-0",
+  "cdr-button--large@sm": "cdr-button--large@sm_13-5-0-alpha-0",
+  "cdr-button--full-width@sm": "cdr-button--full-width@sm_13-5-0-alpha-0",
+  "cdr-button--small@md": "cdr-button--small@md_13-5-0-alpha-0",
+  "cdr-button--medium@md": "cdr-button--medium@md_13-5-0-alpha-0",
+  "cdr-button--large@md": "cdr-button--large@md_13-5-0-alpha-0",
+  "cdr-button--full-width@md": "cdr-button--full-width@md_13-5-0-alpha-0",
+  "cdr-button--small@lg": "cdr-button--small@lg_13-5-0-alpha-0",
+  "cdr-button--medium@lg": "cdr-button--medium@lg_13-5-0-alpha-0",
+  "cdr-button--large@lg": "cdr-button--large@lg_13-5-0-alpha-0",
+  "cdr-button--full-width@lg": "cdr-button--full-width@lg_13-5-0-alpha-0"
+};
+export {
+  t as default
+};

package/dist/src/components/caption/CdrCaption.vue.mjs

@@ -0,0 +1,39 @@
+import { defineComponent as n, useCssModule as i, openBlock as e, createElementBlock as r, normalizeClass as t, toDisplayString as a, createCommentVNode as o } from "vue";
+import l from "./styles/CdrCaption.module.scss.mjs";
+import m from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const p = n({
+  name: "CdrCaption",
+  props: {
+    summary: {
+      type: String
+    },
+    credit: {
+      type: String
+    }
+  },
+  setup() {
+    return {
+      style: i(),
+      baseClass: "cdr-caption",
+      summaryClass: "cdr-caption__summary",
+      citeClass: "cdr-caption__cite"
+    };
+  }
+});
+function c(s, u, y, C, f, $) {
+  return e(), r("div", {
+    class: t(s.style[s.baseClass])
+  }, [s.summary ? (e(), r("p", {
+    key: 0,
+    class: t(s.style[s.summaryClass])
+  }, a(s.summary), 3)) : o("", !0), s.credit ? (e(), r("cite", {
+    key: 1,
+    class: t(s.style[s.citeClass])
+  }, a(s.credit), 3)) : o("", !0)], 2);
+}
+const d = {
+  $style: l
+}, M = /* @__PURE__ */ m(p, [["render", c], ["__cssModules", d]]);
+export {
+  M as default
+};

package/dist/src/components/caption/styles/CdrCaption.module.scss.mjs

@@ -0,0 +1,7 @@
+const a = {
+  "cdr-caption": "cdr-caption_13-5-0-alpha-0",
+  "cdr-caption__summary": "cdr-caption__summary_13-5-0-alpha-0"
+};
+export {
+  a as default
+};

package/dist/src/components/card/CdrCard.vue.mjs

@@ -0,0 +1,32 @@
+import { defineComponent as s, useCssModule as t, openBlock as r, createBlock as o, resolveDynamicComponent as a, normalizeClass as l, withCtx as n, renderSlot as d } from "vue";
+import c from "./styles/CdrCard.module.scss.mjs";
+import p from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const u = s({
+  name: "CdrCard",
+  props: {
+    tag: {
+      type: String,
+      default: "article"
+    }
+  },
+  setup() {
+    return {
+      style: t(),
+      baseClass: "cdr-card"
+    };
+  }
+});
+function f(e, m, C, _, y, $) {
+  return r(), o(a(e.tag), {
+    class: l(e.style[e.baseClass])
+  }, {
+    default: n(() => [d(e.$slots, "default")]),
+    _: 3
+  }, 8, ["class"]);
+}
+const i = {
+  $style: c
+}, h = /* @__PURE__ */ p(u, [["render", f], ["__cssModules", i]]);
+export {
+  h as default
+};