@rei/cedar 14.0.2-alpha.6 → 14.0.2-alpha.8

package/dist/src/components/select/CdrSelect.vue2.mjs

@@ -0,0 +1,196 @@
+import "core-js/modules/es.array.push.js";
+import { defineComponent as R, useCssModule as U, useSlots as H, useAttrs as T, computed as o, openBlock as i, createBlock as C, unref as t, createSlots as G, withCtx as n, createElementVNode as S, normalizeClass as p, createElementBlock as f, renderSlot as d, createCommentVNode as y, withDirectives as J, mergeProps as K, toDisplayString as k, Fragment as Q, renderList as W, vModelSelect as X, createVNode as Y } from "vue";
+import Z from "../icon/comps/caret-down.vue.mjs";
+import _ from "../labelStandalone/CdrLabelStandalone.vue.mjs";
+import ee from "../formError/CdrFormError.vue.mjs";
+import re from "../../props/size.mjs";
+import te from "../../props/background.mjs";
+import $ from "../../utils/mapClasses.mjs";
+import le from "../../utils/uid.mjs";
+const oe = ["id", "multiple", "size", "disabled", "aria-required", "aria-invalid", "aria-errormessage", "aria-describedby"], ae = ["value"], z = "cdr-select", be = /* @__PURE__ */ R({
+  name: "CdrSelect",
+  inheritAttrs: !1,
+  customOptions: {},
+  __name: "CdrSelect",
+  props: {
+    /**
+     * Custom ID that is mapped to the label ‘for’ attribute. If this value is not set, it will be auto-generated.
+    */
+    id: {
+      type: String
+    },
+    /**
+     * Sets the text value for the select label.
+     * Required for accessibility compliance. Use ‘hideLabel’ to
+     * visually hide the label but keep it available to screenreaders.
+    */
+    label: {
+      type: String,
+      required: !0
+    },
+    /**
+     * Visually hides the label element, but leaves it available to screen readers for accessibility compliance.
+     */
+    hideLabel: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Adds an option that is disabled and selected by default to serve as a `placeholder` for the select.
+    */
+    prompt: String,
+    /**
+     * Build options programmatically with data.
+     * Provide an array of objects [{ text: String, value: String}] for greater control
+     * or provide an array of strings ['String'] for simpler setup (value and text will be the same).
+    */
+    options: {
+      type: Array
+    },
+    /**
+     * Sets the background color the radio button is rendered on
+     * @values primary, secondary
+     */
+    background: te,
+    /**
+     * Sets the component's size; values can target responsive breakpoints. Example `small@lg`
+     * @demoSelectMultiple false
+     * @values small, medium, large
+    */
+    size: re,
+    /** Sets the select to an error state, displays the `error` slot if one is present. */
+    error: {
+      type: [Boolean, String],
+      default: !1
+    },
+    /**
+    * Sets the `role` attribute for the embedded error state messaging.
+    */
+    errorRole: {
+      type: String,
+      default: "status"
+    },
+    /** @ignore */
+    modelValue: {
+      type: [String, Number, Boolean, Object, Array, Symbol, Function]
+    },
+    /** Disables the input and sets appropriate styling */
+    disabled: Boolean,
+    /** Sets aria-required on the input field and displays an asterisk next to the select label */
+    required: Boolean,
+    /** Displays '(optional)' text next to the select label. */
+    optional: Boolean,
+    /** Turns CdrSelect into a multi-select element. */
+    multiple: Boolean,
+    /** Sets the height of the CdrSelect when using the multiple option.
+     * This number corresponds to the number of select options that will be visible without scrolling.
+     */
+    multipleSize: Number
+  },
+  emits: {
+    /**
+     * Event emitted by v-model on the radio's <input> element
+     * @param modelValue
+     */
+    "update:modelValue": null
+  },
+  setup(e, {
+    emit: B
+  }) {
+    const r = e, c = U(), u = H(), q = T(), V = u["helper-text"], x = u.info, A = u["info-action"], h = u["pre-icon"], m = r.id ? r.id : le(), I = o(() => r.multiple ? "cdr-select--multiple" : ""), N = o(() => r.modelValue ? "" : "cdr-select__prompt"), E = o(() => h ? "cdr-select--preicon" : ""), L = o(() => r.error ? "cdr-select--error" : ""), O = o(() => `cdr-select--${r.background}`), P = o(() => r.size ? `${z}--${r.size}` : ""), j = o(() => r.disabled ? "cdr-select__caret--disabled" : ""), w = o(() => {
+      const l = [u["helper-text"] ? `${r.id}-helper-text-top` : "", q["aria-describedby"]].filter((a) => a).join(" ");
+      return r.error ? `${r.id}-error` : l;
+    }), D = o(() => {
+      const l = [];
+      return r.options && r.options.forEach((a) => {
+        const s = {
+          text: "",
+          value: ""
+        };
+        let b = "", v = "";
+        if (typeof a == "string")
+          b = a, v = a;
+        else {
+          const {
+            text: F,
+            value: M
+          } = a;
+          b = F, v = M;
+        }
+        s.text = b, s.value = v, l.push(s);
+      }), l;
+    }), g = o({
+      get() {
+        return r.modelValue;
+      },
+      set(l) {
+        B("update:modelValue", l);
+      }
+    });
+    return (l, a) => (i(), C(_, {
+      "for-id": t(m),
+      label: e.label,
+      "hide-label": e.hideLabel,
+      required: e.required,
+      optional: e.optional,
+      disabled: e.disabled
+    }, G({
+      default: n(() => [S("div", {
+        class: p(t(c)["cdr-select-wrap"])
+      }, [t(h) ? (i(), f("span", {
+        key: 0,
+        class: p(t(c)["cdr-select__pre-icon"])
+      }, [d(l.$slots, "pre-icon")], 2)) : y("", !0), J(S("select", K({
+        id: t(m),
+        class: t($)(t(c), z, P.value, N.value, I.value, O.value, L.value, E.value),
+        multiple: e.multiple,
+        size: e.multipleSize,
+        disabled: e.disabled,
+        "aria-required": e.required || void 0,
+        "aria-invalid": !!e.error || void 0,
+        "aria-errormessage": !!e.error && `${t(m)}-error` || void 0
+      }, l.$attrs, {
+        "aria-describedby": w.value || void 0,
+        "onUpdate:modelValue": a[0] || (a[0] = (s) => g.value = s)
+      }), [e.prompt ? (i(), f("option", {
+        key: 0,
+        class: p(t(c)["cdr-select__prompt"]),
+        value: "",
+        disabled: ""
+      }, k(e.prompt), 3)) : y("", !0), (i(!0), f(Q, null, W(D.value, (s) => (i(), f("option", {
+        key: s.text,
+        value: s.value
+      }, k(s.text), 9, ae))), 128)), d(l.$slots, "default")], 16, oe), [[X, g.value]]), Y(Z, {
+        class: p(t($)(t(c), "cdr-select__caret", j.value))
+      }, null, 8, ["class"])], 2)]),
+      _: 2
+    }, [t(V) ? {
+      name: "helper",
+      fn: n(() => [d(l.$slots, "helper-text")]),
+      key: "0"
+    } : void 0, t(x) ? {
+      name: "info",
+      fn: n(() => [d(l.$slots, "info")]),
+      key: "1"
+    } : void 0, t(A) ? {
+      name: "info-action",
+      fn: n(() => [d(l.$slots, "info-action")]),
+      key: "2"
+    } : void 0, e.error ? {
+      name: "error",
+      fn: n(() => [e.error ? (i(), C(ee, {
+        key: 0,
+        error: e.error,
+        role: e.errorRole,
+        id: `${t(m)}-error`
+      }, {
+        error: n(() => [d(l.$slots, "error")]),
+        _: 3
+      }, 8, ["error", "role", "id"])) : y("", !0)]),
+      key: "3"
+    } : void 0]), 1032, ["for-id", "label", "hide-label", "required", "optional", "disabled"]));
+  }
+});
+export {
+  be as default
+};

package/dist/src/components/select/styles/CdrSelect.module.scss.mjs

@@ -0,0 +1,47 @@
+const l = {
+  "cdr-icon": "cdr-icon_14-0-2-alpha-8",
+  "cdr-icon--small": "cdr-icon--small_14-0-2-alpha-8",
+  "cdr-icon--large": "cdr-icon--large_14-0-2-alpha-8",
+  "cdr-icon--small@xs": "cdr-icon--small@xs_14-0-2-alpha-8",
+  "cdr-icon--large@xs": "cdr-icon--large@xs_14-0-2-alpha-8",
+  "cdr-icon--small@sm": "cdr-icon--small@sm_14-0-2-alpha-8",
+  "cdr-icon--large@sm": "cdr-icon--large@sm_14-0-2-alpha-8",
+  "cdr-icon--small@md": "cdr-icon--small@md_14-0-2-alpha-8",
+  "cdr-icon--large@md": "cdr-icon--large@md_14-0-2-alpha-8",
+  "cdr-icon--small@lg": "cdr-icon--small@lg_14-0-2-alpha-8",
+  "cdr-icon--large@lg": "cdr-icon--large@lg_14-0-2-alpha-8",
+  "cdr-icon--inherit-color": "cdr-icon--inherit-color_14-0-2-alpha-8",
+  "cdr-label-standalone": "cdr-label-standalone_14-0-2-alpha-8",
+  "cdr-label-standalone__label-wrapper": "cdr-label-standalone__label-wrapper_14-0-2-alpha-8",
+  "cdr-label-standalone__label": "cdr-label-standalone__label_14-0-2-alpha-8",
+  "cdr-label-standalone__label--sr-only": "cdr-label-standalone__label--sr-only_14-0-2-alpha-8",
+  "cdr-label-standalone__label--disabled": "cdr-label-standalone__label--disabled_14-0-2-alpha-8",
+  "cdr-label-standalone__optional": "cdr-label-standalone__optional_14-0-2-alpha-8",
+  "cdr-label-standalone__helper": "cdr-label-standalone__helper_14-0-2-alpha-8",
+  "cdr-label-standalone__info": "cdr-label-standalone__info_14-0-2-alpha-8",
+  "cdr-label-standalone__post-content": "cdr-label-standalone__post-content_14-0-2-alpha-8",
+  "cdr-label-standalone__info-action": "cdr-label-standalone__info-action_14-0-2-alpha-8",
+  "cdr-label-standalone__input-wrap": "cdr-label-standalone__input-wrap_14-0-2-alpha-8",
+  "cdr-label-standalone__input-spacing": "cdr-label-standalone__input-spacing_14-0-2-alpha-8",
+  "cdr-form-error": "cdr-form-error_14-0-2-alpha-8",
+  "cdr-form-error__icon": "cdr-form-error__icon_14-0-2-alpha-8",
+  "cdr-select": "cdr-select_14-0-2-alpha-8",
+  "cdr-select--primary": "cdr-select--primary_14-0-2-alpha-8",
+  "cdr-select--secondary": "cdr-select--secondary_14-0-2-alpha-8",
+  "cdr-select--error": "cdr-select--error_14-0-2-alpha-8",
+  "cdr-select--preicon": "cdr-select--preicon_14-0-2-alpha-8",
+  "cdr-select__prompt": "cdr-select__prompt_14-0-2-alpha-8",
+  "cdr-select__caret": "cdr-select__caret_14-0-2-alpha-8",
+  "cdr-select__caret--disabled": "cdr-select__caret--disabled_14-0-2-alpha-8",
+  "cdr-select__pre-icon": "cdr-select__pre-icon_14-0-2-alpha-8",
+  "cdr-select--multiple": "cdr-select--multiple_14-0-2-alpha-8",
+  "cdr-select--large@xs": "cdr-select--large@xs_14-0-2-alpha-8",
+  "cdr-select--large": "cdr-select--large_14-0-2-alpha-8",
+  "cdr-select--large@sm": "cdr-select--large@sm_14-0-2-alpha-8",
+  "cdr-select--large@md": "cdr-select--large@md_14-0-2-alpha-8",
+  "cdr-select--large@lg": "cdr-select--large@lg_14-0-2-alpha-8",
+  "cdr-select-wrap": "cdr-select-wrap_14-0-2-alpha-8"
+};
+export {
+  l as default
+};

package/dist/src/components/skeleton/CdrSkeleton.vue.mjs

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

package/dist/src/components/skeleton/CdrSkeleton.vue2.mjs

@@ -0,0 +1,29 @@
+import { defineComponent as r, useCssModule as l, toRef as a, provide as i, openBlock as m, createElementBlock as c, normalizeClass as p, unref as u, renderSlot as d } from "vue";
+import { motionKey as f } from "../../types/symbols.mjs";
+const C = "cdr-skeleton", S = /* @__PURE__ */ r({
+  name: "CdrSkeleton",
+  __name: "CdrSkeleton",
+  props: {
+    /**
+       * Toggle animation on/off.
+       * When `true`, animated gradient will be used while loading.
+       * When `false` a static background color will be used.
+       * Automatically disabled if `prefers-reduced-motion` is set by user.
+    */
+    motion: {
+      type: Boolean,
+      default: !0
+    }
+  },
+  setup(e) {
+    const o = e, t = l(), n = a(o, "motion");
+    return i(f, n), (s, k) => (m(), c("div", {
+      class: p(u(t)[C]),
+      "aria-live": "polite",
+      "aria-busy": "true"
+    }, [d(s.$slots, "default")], 2));
+  }
+});
+export {
+  S as default
+};

package/dist/src/components/skeleton/CdrSkeletonBone.vue.mjs

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

package/dist/src/components/skeleton/CdrSkeletonBone.vue2.mjs

@@ -0,0 +1,29 @@
+import { defineComponent as c, useCssModule as p, computed as t, inject as i, ref as u, openBlock as d, createElementBlock as f, normalizeClass as C, unref as n } from "vue";
+import _ from "../../utils/propValidator.mjs";
+import v from "../../utils/mapClasses.mjs";
+import { motionKey as y } from "../../types/symbols.mjs";
+const o = "cdr-skeleton-bone", b = /* @__PURE__ */ c({
+  name: "CdrSkeletonBone",
+  __name: "CdrSkeletonBone",
+  props: {
+    /**
+     * Sets the type of content placeholder
+     * @demoSelectMultiple false
+     * @values default, heading, line, rectangle, square
+    */
+    type: {
+      type: String,
+      default: "default",
+      validator: (e) => _(e, ["default", "heading", "line", "rectangle", "square"])
+    }
+  },
+  setup(e) {
+    const s = e, a = p(), l = t(() => `${o}--${s.type}`), r = i(y, u(!0)), m = t(() => r.value ? `${o}__shimmer` : "");
+    return (g, k) => (d(), f("div", {
+      class: C(n(v)(n(a), o, l.value, m.value))
+    }, null, 2));
+  }
+});
+export {
+  b as default
+};

package/dist/src/components/skeleton/styles/CdrSkeleton.module.scss.mjs

@@ -0,0 +1,6 @@
+const e = {
+  "cdr-skeleton": "cdr-skeleton_14-0-2-alpha-8"
+};
+export {
+  e as default
+};

package/dist/src/components/skeleton/styles/CdrSkeletonBone.module.scss.mjs

@@ -0,0 +1,13 @@
+const e = "shimmer_14-0-2-alpha-8", n = {
+  "cdr-skeleton-bone": "cdr-skeleton-bone_14-0-2-alpha-8",
+  "cdr-skeleton-bone__shimmer": "cdr-skeleton-bone__shimmer_14-0-2-alpha-8",
+  shimmer: e,
+  "cdr-skeleton-bone--line": "cdr-skeleton-bone--line_14-0-2-alpha-8",
+  "cdr-skeleton-bone--heading": "cdr-skeleton-bone--heading_14-0-2-alpha-8",
+  "cdr-skeleton-bone--rectangle": "cdr-skeleton-bone--rectangle_14-0-2-alpha-8",
+  "cdr-skeleton-bone--square": "cdr-skeleton-bone--square_14-0-2-alpha-8"
+};
+export {
+  n as default,
+  e as shimmer
+};

package/dist/src/components/switch/CdrSwitch.vue.mjs

@@ -0,0 +1,9 @@
+import s from "./CdrSwitch.vue2.mjs";
+import o from "./styles/CdrSwitch.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/src/components/switch/CdrSwitch.vue2.mjs

@@ -0,0 +1,78 @@
+import { defineComponent as _, useCssModule as w, computed as r, openBlock as C, createElementBlock as b, normalizeClass as s, unref as e, createElementVNode as a, renderSlot as v, createVNode as n } from "vue";
+import y from "../../utils/propValidator.mjs";
+import { buildBooleanClass as V } from "../../utils/buildClass.mjs";
+import k from "../icon/comps/check-sm.vue.mjs";
+import z from "../icon/comps/x-sm.vue.mjs";
+import B from "../../utils/mapClasses.mjs";
+import S from "../../utils/uid.mjs";
+const $ = ["id"], g = ["aria-checked", "aria-labelledby"], u = "cdr-switch", U = /* @__PURE__ */ _({
+  name: "CdrSwitch",
+  __name: "CdrSwitch",
+  props: {
+    /**
+     * Sets a custom ID for the switch. If this value is not set, it will be auto-generated.
+    */
+    id: {
+      type: String
+    },
+    /**
+     * Sets the size of the switch
+     * @demoSelectMultiple false
+     * @values medium, large
+    */
+    size: {
+      type: String,
+      default: "medium",
+      validator: (i) => y(i, ["medium", "large"])
+    },
+    /**
+     * Sets the label and switch to expand to the full width of its container with `space-between`
+     */
+    fullWidth: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * @demoIgnore true
+    */
+    modelValue: {
+      type: Boolean,
+      required: !0
+    }
+  },
+  emits: {
+    /**
+     * Event emitted by v-model on switch
+     * @param modelValue
+     */
+    "update:modelValue": null
+  },
+  setup(i, {
+    emit: m
+  }) {
+    const l = i, t = w(), d = l.id ? l.id : S(), f = (o) => {
+      m("update:modelValue", !o);
+    }, h = r(() => l.size ? `cdr-switch--${l.size}` : "cdr-switch--medium"), p = r(() => l.fullWidth ? V(u, l.fullWidth, "full-width") : "");
+    return (o, c) => (C(), b("div", {
+      class: s(e(B)(e(t), u, p.value, h.value))
+    }, [a("div", {
+      id: e(d),
+      class: s(e(t)["cdr-switch__label"])
+    }, [v(o.$slots, "default")], 10, $), a("button", {
+      onClick: c[0] || (c[0] = (W) => f(i.modelValue)),
+      class: s(e(t)["cdr-switch__button"]),
+      role: "switch",
+      "aria-checked": i.modelValue,
+      "aria-labelledby": e(d)
+    }, [n(k, {
+      class: s(e(t)["cdr-switch__button-icon"])
+    }, null, 8, ["class"]), n(z, {
+      class: s(e(t)["cdr-switch__button-icon"])
+    }, null, 8, ["class"]), a("div", {
+      class: s(e(t)["cdr-switch__handle"])
+    }, null, 2)], 10, g)], 2));
+  }
+});
+export {
+  U as default
+};

package/dist/src/components/switch/styles/CdrSwitch.module.scss.mjs

@@ -0,0 +1,13 @@
+const c = {
+  "cdr-switch": "cdr-switch_14-0-2-alpha-8",
+  "cdr-switch__button": "cdr-switch__button_14-0-2-alpha-8",
+  "cdr-switch__button-icon": "cdr-switch__button-icon_14-0-2-alpha-8",
+  "cdr-switch__handle": "cdr-switch__handle_14-0-2-alpha-8",
+  "cdr-switch__label": "cdr-switch__label_14-0-2-alpha-8",
+  "cdr-switch--full-width": "cdr-switch--full-width_14-0-2-alpha-8",
+  "cdr-switch--large": "cdr-switch--large_14-0-2-alpha-8",
+  "cdr-switch--medium": "cdr-switch--medium_14-0-2-alpha-8"
+};
+export {
+  c as default
+};

package/dist/src/components/table/CdrTable.vue.mjs

@@ -0,0 +1,9 @@
+import s from "./CdrTable.vue2.mjs";
+import o from "./styles/CdrTable.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/src/components/table/CdrTable.vue2.mjs

@@ -0,0 +1,58 @@
+import { defineComponent as f, useCssModule as c, computed as l, openBlock as v, createElementBlock as C, normalizeClass as b, unref as o, createElementVNode as h, mergeProps as B, renderSlot as $ } from "vue";
+import y from "../../utils/mapClasses.mjs";
+import { buildBooleanClass as z } from "../../utils/buildClass.mjs";
+import g from "../../utils/propValidator.mjs";
+const s = "cdr-table", E = /* @__PURE__ */ f({
+  name: "CdrTable",
+  __name: "CdrTable",
+  props: {
+    /** Sets row colors to alternate between darker and lighter backgrounds.
+     * Striping will not apply when `border` is true
+     */
+    striped: {
+      type: Boolean,
+      default: !1
+    },
+    /** Adds borders between rows. Will disable `striped` if both are true */
+    border: {
+      type: Boolean,
+      default: !0
+    },
+    /** Sets the width to 100%. Also accepts space separated strings for breakpoints that it should be full width: { '@xs' | '@sm' | '@md' | '@lg' } */
+    fullWidth: {
+      type: [Boolean, String],
+      default: !0
+    },
+    /** Makes the table scroll horizontally when it would overflow its container */
+    responsive: {
+      type: Boolean,
+      default: !0
+    },
+    /** Adds a darker background on row hover */
+    hover: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Sets the table size (cell padding); values can target responsive breakpoints. Example `small@lg`.
+     * @demoSelectMultiple false
+     * @values small, medium, large
+    */
+    size: {
+      type: String,
+      default: "medium",
+      validator: (t) => g(t, ["small", "medium", "large"])
+    }
+  },
+  setup(t) {
+    const e = t, r = c(), d = l(() => e.size ? `${s}--${e.size}` : ""), n = l(() => e.striped ? `${s}--striped` : ""), i = l(() => e.hover ? `${s}--hover` : ""), p = l(() => e.border && !e.striped ? `${s}--border` : ""), u = l(() => e.fullWidth ? z(s, e.fullWidth, "full-width") : ""), m = l(() => e.responsive ? `${s}--responsive` : "");
+    return (a, W) => (v(), C("div", {
+      class: b(o(r)[m.value])
+    }, [h("table", B(a.$attrs, {
+      class: o(y)(o(r), s, d.value, n.value, i.value, p.value, u.value)
+    }), [$(a.$slots, "default")], 16)], 2));
+  }
+});
+export {
+  E as default
+};

package/dist/src/components/table/styles/CdrTable.module.scss.mjs

@@ -0,0 +1,18 @@
+const l = {
+  "cdr-table": "cdr-table_14-0-2-alpha-8",
+  "cdr-table--small": "cdr-table--small_14-0-2-alpha-8",
+  "cdr-table--medium": "cdr-table--medium_14-0-2-alpha-8",
+  "cdr-table--large": "cdr-table--large_14-0-2-alpha-8",
+  "cdr-table--striped": "cdr-table--striped_14-0-2-alpha-8",
+  "cdr-table--border": "cdr-table--border_14-0-2-alpha-8",
+  "cdr-table--full-width": "cdr-table--full-width_14-0-2-alpha-8",
+  "cdr-table--responsive": "cdr-table--responsive_14-0-2-alpha-8",
+  "cdr-table--hover": "cdr-table--hover_14-0-2-alpha-8",
+  "cdr-table--full-width@xs": "cdr-table--full-width@xs_14-0-2-alpha-8",
+  "cdr-table--full-width@sm": "cdr-table--full-width@sm_14-0-2-alpha-8",
+  "cdr-table--full-width@md": "cdr-table--full-width@md_14-0-2-alpha-8",
+  "cdr-table--full-width@lg": "cdr-table--full-width@lg_14-0-2-alpha-8"
+};
+export {
+  l as default
+};

package/dist/src/components/tabs/CdrTabPanel.vue.mjs

@@ -0,0 +1,9 @@
+import s from "./CdrTabPanel.vue2.mjs";
+import o from "./styles/CdrTabPanel.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/src/components/tabs/CdrTabPanel.vue2.mjs

@@ -0,0 +1,40 @@
+import { defineComponent as c, useCssModule as d, inject as m, ref as u, computed as r, watch as b, withDirectives as p, openBlock as f, createElementBlock as h, normalizeClass as v, unref as C, renderSlot as g, vShow as y } from "vue";
+import S from "../../utils/kebabCase.mjs";
+import { selectedTabKey as _ } from "../../types/symbols.mjs";
+const k = ["aria-hidden", "id", "aria-labelledby"], T = /* @__PURE__ */ c({
+  name: "CdrTabPanel",
+  __name: "CdrTabPanel",
+  props: {
+    /** Sets reference identifier for tab content. This property is required and is necessary for accessibility. Must be unique for each tabPanel, and cannot be the same as the `aria-labelledby` property. */
+    id: String,
+    /** Sets tab display name. Required and must be unique for each tab. If `id` is not provided, this value will be used as the reference identifier. */
+    name: String,
+    /** Sets reference identifier for tab header. This property is required and is necessary for accessibility. Must be unique for each tabPanel, and cannot be the same as the `id` property. */
+    ariaLabelledby: String
+  },
+  emits: {
+    /**
+     * Emits when active tab is changed
+     * @params state, panelId
+     */
+    "tab-change": null
+  },
+  setup(l, {
+    emit: o
+  }) {
+    const e = l, s = d(), a = m(_, u(null)), n = r(() => e.name === (a == null ? void 0 : a.value)), i = r(() => e.name ? `${S(e.name)}-panel` : void 0);
+    return b(n, (t) => {
+      o("tab-change", t, i.value);
+    }), (t, w) => p((f(), h("section", {
+      tabindex: "0",
+      "aria-hidden": !n.value,
+      role: "tabpanel",
+      class: v(C(s)["cdr-tab-panel"]),
+      id: i.value,
+      "aria-labelledby": l.name
+    }, [g(t.$slots, "default")], 10, k)), [[y, n.value]]);
+  }
+});
+export {
+  T as default
+};

package/dist/src/components/tabs/CdrTabs.vue.mjs

@@ -0,0 +1,9 @@
+import s from "./CdrTabs.vue2.mjs";
+import o from "./styles/CdrTabs.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
+};