@rei/cedar 11.0.0 → 13.0.0-alpha.2

package/dist/lib/src/components/radio/CdrRadio.vue_vue_type_script_lang.js

@@ -0,0 +1,79 @@
+import _Symbol from '@babel/runtime-corejs3/core-js-stable/symbol';
+import { defineComponent, ref, watch, useCssModule } from 'vue';
+import validateProp from '../../utils/propValidator.js';
+import '../labelWrapper/CdrLabelWrapper.js';
+import sizeProps from '../../props/size.js';
+import backgroundProps from '../../props/background.js';
+import script$1 from '../labelWrapper/CdrLabelWrapper.vue_vue_type_script_lang.js';
+
+var script = defineComponent({
+  name: 'CdrRadio',
+  components: {
+    CdrLabelWrapper: script$1
+  },
+  inheritAttrs: false,
+  props: {
+    /**
+     * Class that is added to the label for custom styles
+     */
+    labelClass: String,
+
+    /**
+     * Class that is added to the input for custom styles
+     */
+    inputClass: String,
+
+    /**
+     * Class that is added to the slot wrapper for custom styles
+     */
+    contentClass: String,
+
+    /**
+     * Sets the name of the radio. Required.
+    */
+    name: {
+      type: String,
+      required: true
+    },
+    modifier: {
+      type: String,
+      default: '',
+      validator: function validator(value) {
+        return validateProp(value, ['', 'hide-figure']);
+      }
+    },
+    size: sizeProps,
+    // Set which background type the input renders on
+    background: backgroundProps,
+
+    /**
+     * Sets the value of the radio. Required.
+    */
+    customValue: {
+      type: [String, Number, Boolean, Object, Array, _Symbol, Function]
+    },
+
+    /** @ignore v-model binding */
+    modelValue: {
+      type: [String, Number, Boolean, Object, Array, _Symbol, Function]
+    }
+  },
+
+  setup(props) {
+    var baseClass = 'cdr-radio';
+    var newValue = ref(props.modelValue);
+    watch(function () {
+      return props.value;
+    }, function (val) {
+      newValue.value = val;
+    });
+    return {
+      style: useCssModule(),
+      baseClass,
+      newValue
+    };
+  }
+
+});
+
+export { script as default };

package/dist/lib/src/components/radio/CdrRadio.vue_vue_type_template_id_0a348de4_lang.js

@@ -0,0 +1,42 @@
+import { resolveComponent, openBlock, createBlock, normalizeClass, withCtx, createElementVNode, mergeProps, renderSlot } from 'vue';
+
+var _hoisted_1 = ["name", "checked", "value"];
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  var _component_cdr_label_wrapper = resolveComponent("cdr-label-wrapper");
+
+  return openBlock(), createBlock(_component_cdr_label_wrapper, {
+    class: normalizeClass(_ctx.style[_ctx.baseClass]),
+    size: _ctx.size,
+    modifier: _ctx.modifier,
+    "label-class": _ctx.labelClass,
+    "content-class": _ctx.contentClass,
+    background: _ctx.background,
+    disabled: _ctx.$attrs.disabled
+  }, {
+    input: withCtx(function () {
+      return [createElementVNode("input", mergeProps({
+        class: [_ctx.style['cdr-radio__input'], _ctx.inputClass],
+        type: "radio",
+        name: _ctx.name,
+        checked: _ctx.newValue == _ctx.customValue,
+        value: _ctx.customValue
+      }, _ctx.$attrs, {
+        onChange: _cache[0] || (_cache[0] = function ($event) {
+          return _ctx.$emit('update:modelValue', $event.target.checked && _ctx.customValue, $event);
+        })
+      }), null, 16
+      /* FULL_PROPS */
+      , _hoisted_1)];
+    }),
+    default: withCtx(function () {
+      return [renderSlot(_ctx.$slots, "default")];
+    }),
+    _: 3
+    /* FORWARDED */
+
+  }, 8
+  /* PROPS */
+  , ["class", "size", "modifier", "label-class", "content-class", "background", "disabled"]);
+}
+
+export { render };

package/dist/lib/src/components/radio/styles/CdrRadio.module.scss_vue_type_style_index_0_src_id_0a348de4_module_true_lang.css.js

@@ -0,0 +1,7 @@
+var style0 = {
+  "cdr-radio": "cdr-radio_13-0-0-alpha-2",
+  "cdr-label-wrapper__figure": "cdr-label-wrapper__figure_13-0-0-alpha-2",
+  "cdr-radio__input": "cdr-radio__input_13-0-0-alpha-2"
+};
+
+export { style0 as default };

package/dist/lib/src/components/rating/CdrRating.js

@@ -0,0 +1,10 @@
+import script from './CdrRating.vue_vue_type_script_lang.js';
+export { default } from './CdrRating.vue_vue_type_script_lang.js';
+import { render } from './CdrRating.vue_vue_type_template_id_4cfe512c_lang.js';
+import style0 from './styles/CdrRating.module.scss_vue_type_style_index_0_src_id_4cfe512c_module_true_lang.css.js';
+
+const cssModules = script.__cssModules = {};
+cssModules["$style"] = style0;
+
+script.render = render;
+script.__file = "src/components/rating/CdrRating.vue";

package/dist/lib/src/components/rating/CdrRating.vue_vue_type_script_lang.js

@@ -0,0 +1,139 @@
+import _concatInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/concat';
+import { defineComponent, computed, useCssModule } from 'vue';
+import { buildClass } from '../../utils/buildClass.js';
+import validateProp from '../../utils/propValidator.js';
+import mapClasses from '../../utils/mapClasses.js';
+
+var script = defineComponent({
+  name: 'CdrRating',
+  props: {
+    /**
+     * Rating value (out of 5)
+     */
+    rating: {
+      required: true,
+      type: [String, Number],
+      default: 0
+    },
+
+    /**
+     * Total number of ratings
+     */
+    count: {
+      required: false,
+      type: [String, Number],
+      default: null
+    },
+
+    /**
+     * Hides the word 'reviews' if true
+     */
+    compact: {
+      type: Boolean,
+      default: false
+    },
+
+    /**
+     * Allows the ratings to act as a link
+     */
+    href: {
+      type: String
+    },
+    size: {
+      type: String,
+      default: 'medium',
+      validator: function validator(value) {
+        return validateProp(value, ['small', 'medium', 'large']);
+      }
+    }
+  },
+
+  setup(props) {
+    var baseClass = 'cdr-rating';
+    var sizeClass = computed(function () {
+      return props.size && buildClass(baseClass, props.size);
+    });
+    var linkedClass = computed(function () {
+      return props.href && buildClass(baseClass, 'linked');
+    });
+    var emptyClass = computed(function () {
+      return props.rounded > 0 || props.count > 0 ? 'cdr-rating__placeholder' : 'cdr-rating__placeholder--no-reviews';
+    });
+    var tag = computed(function () {
+      return props.href ? 'a' : 'div';
+    });
+    var displayRating = computed(function () {
+      return (Math.round(props.rating * 10) / 10).toFixed(1);
+    });
+    var rounded = computed(function () {
+      return Math.round(props.rating * 4) / 4;
+    });
+    var whole = computed(function () {
+      return Math.floor(rounded.value);
+    });
+    var remainder = computed(function () {
+      return rounded.value.toFixed(2).split('.')[1];
+    });
+    var empties = computed(function () {
+      return 5 - whole.value - (remainder.value > 0 ? 1 : 0);
+    });
+    var formattedCount = computed(function () {
+      return props.compact ? "(".concat(props.count, ")") : "".concat(props.count);
+    });
+    var srText = computed(function () {
+      var _context2;
+
+      // linked
+      if (props.href) {
+        var _context;
+
+        // no reviews
+        if (props.count === 0 || props.count === '0') {
+          return 'No reviews yet; be the first!';
+        } // no count
+
+
+        if (props.count === null) {
+          return "View the reviews with an average rating of ".concat(displayRating.value, " out of 5 stars");
+        } // default
+
+
+        return _concatInstanceProperty(_context = "View the ".concat(props.count, " reviews with an average rating of ")).call(_context, displayRating.value, " out of 5 stars"); // eslint-disable-line max-len
+      } // non-linked
+      // no reviews
+
+
+      if (props.count === 0 || props.count === '0') {
+        return '0 reviews';
+      } // no count
+
+
+      if (props.count === null) {
+        return "Rated ".concat(displayRating.value, " out of 5 stars");
+      } // default
+      // eslint-disable-next-line
+
+
+      return _concatInstanceProperty(_context2 = "".concat(props.count, " reviews with an average rating of ")).call(_context2, displayRating.value, " out of 5 stars");
+    });
+    return {
+      style: useCssModule(),
+      tag,
+      baseClass,
+      sizeClass,
+      linkedClass,
+      emptyClass,
+      displayRating,
+      rounded,
+      whole,
+      remainder,
+      empties,
+      formattedCount,
+      srText,
+      mapClasses
+    };
+  }
+
+});
+
+export { script as default };

package/dist/lib/src/components/rating/CdrRating.vue_vue_type_template_id_4cfe512c_lang.js

@@ -0,0 +1,72 @@
+import _keysInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/keys';
+import { openBlock, createBlock, resolveDynamicComponent, normalizeClass, withCtx, createElementVNode, createElementBlock, Fragment, renderList, createCommentVNode, toDisplayString } from 'vue';
+
+var _hoisted_1 = {
+  key: 1
+};
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createBlock(resolveDynamicComponent(_ctx.tag), {
+    href: _ctx.href,
+    class: normalizeClass(_ctx.mapClasses(_ctx.style, _ctx.baseClass, _ctx.sizeClass, _ctx.linkedClass))
+  }, {
+    default: withCtx(function () {
+      var _context, _context2;
+
+      return [createElementVNode("div", {
+        class: normalizeClass(_ctx.style['cdr-rating__ratings'])
+      }, [(openBlock(true), createElementBlock(Fragment, null, renderList(_keysInstanceProperty(_context = Array(_ctx.whole)).call(_context), function (star) {
+        return openBlock(), createElementBlock("span", {
+          class: normalizeClass(_ctx.mapClasses(_ctx.style, 'cdr-rating__icon', 'cdr-rating__100')),
+          key: "rating-whole-".concat(star),
+          "aria-hidden": "true"
+        }, null, 2
+        /* CLASS */
+        );
+      }), 128
+      /* KEYED_FRAGMENT */
+      )), _ctx.remainder ? (openBlock(), createElementBlock("span", {
+        key: 0,
+        class: normalizeClass(_ctx.mapClasses(_ctx.style, 'cdr-rating__icon', "cdr-rating__".concat(_ctx.remainder))),
+        "aria-hidden": "true"
+      }, null, 2
+      /* CLASS */
+      )) : createCommentVNode("v-if", true), (openBlock(true), createElementBlock(Fragment, null, renderList(_keysInstanceProperty(_context2 = Array(_ctx.empties)).call(_context2), function (empty) {
+        return openBlock(), createElementBlock("span", {
+          class: normalizeClass(_ctx.mapClasses(_ctx.style, 'cdr-rating__icon', _ctx.emptyClass)),
+          key: "rating-empty-".concat(empty),
+          "aria-hidden": "true"
+        }, null, 2
+        /* CLASS */
+        );
+      }), 128
+      /* KEYED_FRAGMENT */
+      ))], 2
+      /* CLASS */
+      ), _ctx.count !== null ? (openBlock(), createElementBlock("span", {
+        key: 0,
+        "aria-hidden": "true",
+        class: normalizeClass(_ctx.style['cdr-rating__count'])
+      }, [_ctx.href ? (openBlock(), createElementBlock("span", {
+        key: 0,
+        class: normalizeClass(_ctx.style['cdr-rating__number'])
+      }, toDisplayString(_ctx.displayRating), 3
+      /* TEXT, CLASS */
+      )) : createCommentVNode("v-if", true), createElementVNode("span", null, toDisplayString(_ctx.formattedCount), 1
+      /* TEXT */
+      ), !_ctx.compact ? (openBlock(), createElementBlock("span", _hoisted_1, "  Reviews ")) : createCommentVNode("v-if", true)], 2
+      /* CLASS */
+      )) : createCommentVNode("v-if", true), createElementVNode("span", {
+        class: normalizeClass(_ctx.style['cdr-rating__caption-sr'])
+      }, toDisplayString(_ctx.srText), 3
+      /* TEXT, CLASS */
+      )];
+    }),
+    _: 1
+    /* STABLE */
+
+  }, 8
+  /* PROPS */
+  , ["href", "class"]);
+}
+
+export { render };

package/dist/lib/src/components/rating/styles/CdrRating.module.scss_vue_type_style_index_0_src_id_4cfe512c_module_true_lang.css.js

@@ -0,0 +1,32 @@
+var style0 = {
+  "cdr-rating__icon": "cdr-rating__icon_13-0-0-alpha-2",
+  "cdr-rating__count": "cdr-rating__count_13-0-0-alpha-2",
+  "cdr-rating": "cdr-rating_13-0-0-alpha-2",
+  "cdr-rating__number": "cdr-rating__number_13-0-0-alpha-2",
+  "cdr-rating__ratings": "cdr-rating__ratings_13-0-0-alpha-2",
+  "cdr-rating__caption-sr": "cdr-rating__caption-sr_13-0-0-alpha-2",
+  "cdr-rating__placeholder": "cdr-rating__placeholder_13-0-0-alpha-2",
+  "cdr-rating__placeholder--no-reviews": "cdr-rating__placeholder--no-reviews_13-0-0-alpha-2",
+  "cdr-rating__100": "cdr-rating__100_13-0-0-alpha-2",
+  "cdr-rating__75": "cdr-rating__75_13-0-0-alpha-2",
+  "cdr-rating__50": "cdr-rating__50_13-0-0-alpha-2",
+  "cdr-rating__25": "cdr-rating__25_13-0-0-alpha-2",
+  "cdr-rating--linked": "cdr-rating--linked_13-0-0-alpha-2",
+  "cdr-rating--large": "cdr-rating--large_13-0-0-alpha-2",
+  "cdr-rating--medium": "cdr-rating--medium_13-0-0-alpha-2",
+  "cdr-rating--small": "cdr-rating--small_13-0-0-alpha-2",
+  "cdr-rating--small@xs": "cdr-rating--small@xs_13-0-0-alpha-2",
+  "cdr-rating--medium@xs": "cdr-rating--medium@xs_13-0-0-alpha-2",
+  "cdr-rating--large@xs": "cdr-rating--large@xs_13-0-0-alpha-2",
+  "cdr-rating--small@sm": "cdr-rating--small@sm_13-0-0-alpha-2",
+  "cdr-rating--medium@sm": "cdr-rating--medium@sm_13-0-0-alpha-2",
+  "cdr-rating--large@sm": "cdr-rating--large@sm_13-0-0-alpha-2",
+  "cdr-rating--small@md": "cdr-rating--small@md_13-0-0-alpha-2",
+  "cdr-rating--medium@md": "cdr-rating--medium@md_13-0-0-alpha-2",
+  "cdr-rating--large@md": "cdr-rating--large@md_13-0-0-alpha-2",
+  "cdr-rating--small@lg": "cdr-rating--small@lg_13-0-0-alpha-2",
+  "cdr-rating--medium@lg": "cdr-rating--medium@lg_13-0-0-alpha-2",
+  "cdr-rating--large@lg": "cdr-rating--large@lg_13-0-0-alpha-2"
+};
+
+export { style0 as default };

package/dist/lib/src/components/select/CdrSelect.js

@@ -0,0 +1,10 @@
+import script from './CdrSelect.vue_vue_type_script_lang.js';
+export { default } from './CdrSelect.vue_vue_type_script_lang.js';
+import { render } from './CdrSelect.vue_vue_type_template_id_039dbe2a_lang.js';
+import style0 from './styles/CdrSelect.module.scss_vue_type_style_index_0_src_id_039dbe2a_module_true_lang.css.js';
+
+const cssModules = script.__cssModules = {};
+cssModules["$style"] = style0;
+
+script.render = render;
+script.__file = "src/components/select/CdrSelect.vue";

package/dist/lib/src/components/select/CdrSelect.vue_vue_type_script_lang.js

@@ -0,0 +1,185 @@
+import _Symbol from '@babel/runtime-corejs3/core-js-stable/symbol';
+import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
+import _mapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/map';
+import { defineComponent, computed, useCssModule } from 'vue';
+import toArray from 'lodash/toArray';
+import '../icon/comps/caret-down.js';
+import '../labelStandalone/CdrLabelStandalone.js';
+import '../formError/CdrFormError.js';
+import sizeProps from '../../props/size.js';
+import backgroundProps from '../../props/background.js';
+import { buildClass } from '../../utils/buildClass.js';
+import mapClasses from '../../utils/mapClasses.js';
+import script$1 from '../icon/comps/caret-down.vue_vue_type_script_lang.js';
+import script$2 from '../labelStandalone/CdrLabelStandalone.vue_vue_type_script_lang.js';
+import script$3 from '../formError/CdrFormError.vue_vue_type_script_lang.js';
+
+var script = defineComponent({
+  name: 'CdrSelect',
+  components: {
+    IconCaretDown: script$1,
+    CdrLabelStandalone: script$2,
+    CdrFormError: script$3
+  },
+  inheritAttrs: false,
+  props: {
+    /**
+     * `id` for the select that is mapped to the label `for` attribute. If one is not provided, it will be generated.
+    */
+    id: {
+      type: String,
+      required: true
+    },
+
+    /**
+     * Label text. This is required for a11y even if hiding the label with `hideLabel`.
+    */
+    label: {
+      type: String,
+      required: true
+    },
+
+    /**
+     * Removes the label element but sets the select `aria-label` to `label` text for a11y.
+    */
+    hideLabel: Boolean,
+
+    /**
+     * Adds an option that is disabled and selected by default to serve as a `placeholder` for the select.
+    */
+    prompt: String,
+
+    /**
+     * Build options programatically with data. Array of objects [{ text: String, value: String}] to give greater control. Array of strings ['String'] for simpler setup (value and text will be the same).
+    */
+    options: {
+      type: Array
+    },
+    // Set which background type the select renders on
+    background: backgroundProps,
+    size: sizeProps,
+    // Set error styling
+    error: {
+      type: [Boolean, String],
+      default: false
+    },
+
+    /**
+    * Override the error message role, default is `status`.
+    */
+    errorRole: {
+      type: String,
+      required: false,
+      default: 'status'
+    },
+    modelValue: {
+      type: [String, Number, Boolean, Object, Array, _Symbol, Function]
+    },
+    disabled: Boolean,
+    required: Boolean,
+    optional: Boolean,
+    multiple: Boolean,
+    multipleSize: Number
+  },
+
+  setup(props, ctx) {
+    var baseClass = 'cdr-select';
+    var hasHelper = ctx.slots['helper-text'];
+    var hasInfo = ctx.slots.info;
+    var hasInfoAction = ctx.slots['info-action'];
+    var hasPreIcon = ctx.slots['pre-icon'];
+    var multipleClass = computed(function () {
+      return props.multiple && 'cdr-select--multiple';
+    });
+    var promptClass = computed(function () {
+      return !props.modelValue && 'cdr-select--preicon';
+    });
+    var multilineClass = computed(function () {
+      return props.rows > 1 && 'cdr-select--multiline';
+    });
+    var preIconClass = computed(function () {
+      return hasPreIcon && 'cdr-select--preicon';
+    });
+    var errorClass = computed(function () {
+      return props.error && 'cdr-select--error';
+    });
+    var backgroundClass = computed(function () {
+      return "cdr-select--".concat(props.background);
+    });
+    var sizeClass = computed(function () {
+      return props.size && buildClass(baseClass, props.size);
+    });
+    var caretDisabledClass = computed(function () {
+      return props.disabled && 'cdr-select__caret--disabled';
+    });
+    var describedby = computed(function () {
+      var _context;
+
+      return _filterInstanceProperty(_context = [ctx.slots['helper-text'] ? "".concat(props.id, "-helper-text-top") : '', ctx.attrs['aria-describedby']]).call(_context, function (x) {
+        return x;
+      }).join(' ');
+    }); // TODO: refactor, would be much clearer as a 1-2 liner
+
+    var computedOpts = computed(function () {
+      var optsArr = [];
+
+      if (props.options) {
+        props.options.forEach(function (o) {
+          var optObj = {};
+          var text = '';
+          var val = '';
+
+          if (typeof o === 'string') {
+            text = o;
+            val = o;
+          } else {
+            var t = o.text,
+                v = o.value;
+            text = t;
+            val = v;
+          }
+
+          optObj.text = text;
+          optObj.value = val;
+          optsArr.push(optObj);
+        });
+      }
+
+      return optsArr;
+    });
+
+    var processMultiple = function processMultiple(options) {
+      var _context2, _context3;
+
+      return _mapInstanceProperty(_context2 = _filterInstanceProperty(_context3 = toArray(options)).call(_context3, function (o) {
+        return o.selected === true;
+      })).call(_context2, function (o) {
+        return o.value;
+      });
+    };
+
+    return {
+      style: useCssModule(),
+      baseClass,
+      computedOpts,
+      hasHelper,
+      hasInfo,
+      hasInfoAction,
+      hasPreIcon,
+      describedby,
+      processMultiple,
+      multipleClass,
+      promptClass,
+      multilineClass,
+      preIconClass,
+      errorClass,
+      backgroundClass,
+      sizeClass,
+      caretDisabledClass,
+      mapClasses
+    };
+  }
+
+});
+
+export { script as default };