@rei/cedar 13.0.0-alpha.3 → 13.0.0-beta.0

package/dist/lib/src/components/popover/styles/CdrPopover.module.scss_vue_type_style_index_0_src_id_764fda0e_module_true_lang.css.mjs

@@ -1,3 +0,0 @@
-var style0 = {"cdr-popover--position":"cdr-popover--position_13-0-0-alpha-3","cdr-popover--wrapper":"cdr-popover--wrapper_13-0-0-alpha-3","cdr-popup--closed":"cdr-popup--closed_13-0-0-alpha-3","cdr-popover__title":"cdr-popover__title_13-0-0-alpha-3","cdr-popover__container":"cdr-popover__container_13-0-0-alpha-3","cdr-popover__content":"cdr-popover__content_13-0-0-alpha-3","cdr-popover__close-button":"cdr-popover__close-button_13-0-0-alpha-3"};
-
-export { style0 as default };

package/dist/lib/src/components/popup/CdrPopup.mjs

@@ -1,10 +0,0 @@
-import script from './CdrPopup.vue_vue_type_script_lang.mjs';
-export { default } from './CdrPopup.vue_vue_type_script_lang.mjs';
-import { render } from './CdrPopup.vue_vue_type_template_id_c9b83fa4_lang.mjs';
-import style0 from './styles/CdrPopup.module.scss_vue_type_style_index_0_src_id_c9b83fa4_module_true_lang.css.mjs';
-
-const cssModules = script.__cssModules = {};
-cssModules["$style"] = style0;
-
-script.render = render;
-script.__file = "src/components/popup/CdrPopup.vue";

package/dist/lib/src/components/popup/CdrPopup.vue_vue_type_script_lang.mjs

@@ -1,161 +0,0 @@
-import { defineComponent, ref, computed, watch, onMounted, onUnmounted, useCssModule, nextTick } from 'vue';
-import debounce from 'lodash/debounce';
-import validateProp from '../../utils/propValidator.mjs';
-import calculatePlacement from './calculatePlacement.mjs';
-import mapClasses from '../../utils/mapClasses.mjs';
-
-var script = defineComponent({
-  name: 'CdrPopup',
-  inheritAttrs: false,
-  props: {
-    opened: {
-      type: Boolean,
-      default: false,
-    },
-    position: {
-      type: String,
-      required: false,
-      default: 'top',
-      validator: (value) => validateProp(
-        value,
-        ['top', 'bottom', 'left', 'right'],
-      ),
-    },
-    autoPosition: {
-      type: Boolean,
-      default: true,
-    },
-    contentClass: {
-      type: String,
-    },
-  },
-  setup(props, ctx) {
-    const baseClass = 'cdr-popup';
-
-    // const keyHandler = ref(undefined);
-    // const clickHandler = ref(undefined);
-    // const resizeHandler = ref(undefined); // NOT NEEDED?
-    const pos = ref(props.position);
-    const corner = ref(undefined);
-    const exiting = ref(false);
-    const popupRect = ref(undefined); // DOES this have to be a ref?
-    const closed = ref(!props.opened);
-
-    const popupEl = ref(null);
-    const rootEl = ref(null);
-
-    const positionClass = computed(() => (props.opened || exiting.value ? `cdr-popup--${pos.value}` : undefined));
-    const cornerClass = computed(() => (corner.value ? `cdr-popup--corner-${corner.value}` : undefined));
-    const openClass = computed(() => (props.opened ? 'cdr-popup--open' : undefined));
-    const closedClass = computed(() => (closed.value && !exiting.value ? 'cdr-popup--closed' : undefined));
-    const exitingClass = computed(() => (exiting.value ? 'cdr-popup--exit' : undefined));
-
-    const closePopup = (e) => {
-      ctx.emit('closed', e);
-    };
-
-    const handleKeydown = (e) => {
-      switch (e.key) {
-        case 'Escape':
-        case 'Esc':
-          closePopup(e);
-          break;
-      }
-    };
-
-    const handleClick = (e) => {
-      nextTick(() => {
-        if (e.target !== popupEl.value && !popupEl.value.contains(e.target)) {
-          closePopup(e);
-        }
-      });
-    };
-
-    const handleResize = () => {
-      debounce(() => {
-        measurePopup();
-      }, 300);
-    };
-
-    const addHandlers = () => {
-      document.addEventListener('keydown', handleKeydown);
-      document.addEventListener('click', handleClick);
-    };
-
-    const measurePopup = () => {
-      closed.value = false;
-      nextTick(() => {
-        popupRect.value = popupEl.value.getBoundingClientRect();
-        closed.value = true;
-      });
-    };
-
-    const handleOpened = () => {
-      closed.value = false;
-      pos.value = props.position;
-      corner.value = undefined;
-
-      if (props.autoPosition) {
-        nextTick(() => {
-          // TODO: how to get $el?????
-          const triggerRect = rootEl.value.parentElement.getBoundingClientRect();
-          const { innerHeight, innerWidth } = window;
-          calculatePlacement(triggerRect, popupRect.value, innerWidth, innerHeight, props.position);
-        });
-      }
-
-      setTimeout(() => {
-        addHandlers();
-      }, 1);
-    };
-
-    const handleClosed = () => {
-      closed.value = true;
-      document.removeEventListener('keydown', handleKeydown);
-      document.removeEventListener('click', handleClick);
-      exiting.value = true;
-      setTimeout(() => {
-        exiting.value = false;
-      }, 200); // $cdr-duration-2;
-    };
-
-    watch(() => props.position, () => pos.value = props.position);
-    watch(() => props.opened, () => {
-      // if (!!newValue === !!oldValue) return;
-      // TODO: watch doesnt run unless it changes???? might need to use `watch`
-      if (props.opened) {
-        handleOpened();
-      } else {
-        handleClosed();
-      }
-    });
-
-    onMounted(() => {
-      measurePopup();
-      // resizeHandler = handleResize.bind(this); TODO: bind this?
-      window.addEventListener('resize', handleResize);
-    });
-    onUnmounted(() => {
-      document.removeEventListener('keydown', handleKeydown);
-      document.removeEventListener('click', handleClick);
-      window.removeEventListener('resize', handleResize);
-    });
-
-    return {
-      style: useCssModule(),
-      mapClasses,
-      rootEl,
-      popupEl,
-      baseClass,
-      openClass,
-      exitingClass,
-      positionClass,
-      cornerClass,
-      closedClass,
-      handleClick,
-      handleKeydown,
-    };
-  },
-});
-
-export { script as default };

package/dist/lib/src/components/popup/CdrPopup.vue_vue_type_template_id_c9b83fa4_lang.mjs

@@ -1,28 +0,0 @@
-import { openBlock, createElementBlock, normalizeClass, createElementVNode, mergeProps, renderSlot } from 'vue';
-
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (openBlock(), createElementBlock("div", {
-    ref: "rootEl",
-    class: normalizeClass(_ctx.mapClasses(
-      _ctx.style,
-      _ctx.baseClass,
-      _ctx.openClass,
-      _ctx.exitingClass,
-      _ctx.positionClass,
-      _ctx.cornerClass,
-      _ctx.closedClass,
-    ))
-  }, [
-    createElementVNode("div", mergeProps(_ctx.$attrs, {
-      class: _ctx.mapClasses(_ctx.style, 'cdr-popup__content', _ctx.contentClass),
-      ref: "popupEl"
-    }), [
-      renderSlot(_ctx.$slots, "default")
-    ], 16 /* FULL_PROPS */),
-    createElementVNode("div", {
-      class: normalizeClass(_ctx.style['cdr-popup__arrow'])
-    }, null, 2 /* CLASS */)
-  ], 2 /* CLASS */))
-}
-
-export { render };

package/dist/lib/src/components/popup/calculatePlacement.mjs

@@ -1,76 +0,0 @@
-import 'core-js/modules/web.dom-collections.iterator.js';
-
-function calculatePlacement (triggerRect, popupRect, screenWidth, screenHeight, originalPosition) {
-  const offset = 14; // 10px for arrow 4px for spacing
-
-  const borderSize = 2; // need to include border for corner calculations
-
-  const triggerCenterY = triggerRect.top + triggerRect.height / 2;
-  const triggerCenterX = triggerRect.left + triggerRect.width / 2;
-  let pos;
-  let corner;
-  const dirs = {
-    top: triggerRect.top - popupRect.height - offset,
-    bottom: screenHeight - triggerRect.bottom - popupRect.height - offset,
-    left: triggerRect.left - popupRect.width - offset,
-    right: screenWidth - triggerRect.right - popupRect.width - offset
-  };
-  const corners = {
-    left: triggerCenterX - popupRect.width / 2 - borderSize <= 0,
-    right: triggerCenterX + popupRect.width / 2 + borderSize >= screenWidth,
-    top: triggerCenterY - popupRect.height / 2 - borderSize <= 0,
-    bottom: triggerCenterY + popupRect.height / 2 + borderSize >= screenHeight
-  };
-  const invert = {
-    top: 'bottom',
-    bottom: 'top',
-    left: 'right',
-    right: 'left'
-  };
-  const inverse = invert[originalPosition];
-  const validDirs = Object.keys(dirs).filter(dir => dirs[dir] > 0);
-  const sortedDirs = Object.keys(dirs).sort((a, b) => {
-    if (dirs[a] > dirs[b]) {
-      return -1;
-    }
-
-    if (dirs[a] < dirs[b]) {
-      return 1;
-    }
-
-    return 0;
-  });
-
-  if (dirs[originalPosition] > 0) {
-    // selected position is valid, or no positions are valid
-    pos = originalPosition;
-  } else if (dirs[inverse] > 0) {
-    // inverted position is valid
-    pos = inverse;
-  } else if (validDirs.length) {
-    // try the angles
-    [pos] = validDirs;
-  } else {
-    // use whichever direction has the most space
-    [pos] = sortedDirs;
-  }
-
-  if (pos === 'bottom' || pos === 'top') {
-    if (corners.left) {
-      corner = 'left';
-    } else if (corners.right) {
-      corner = 'right';
-    }
-  } else if (corners.top) {
-    corner = 'top';
-  } else if (corners.bottom) {
-    corner = 'bottom';
-  }
-
-  return {
-    pos,
-    corner
-  };
-}
-
-export { calculatePlacement as default };

package/dist/lib/src/components/popup/styles/CdrPopup.module.scss_vue_type_style_index_0_src_id_c9b83fa4_module_true_lang.css.mjs

@@ -1,3 +0,0 @@
-var style0 = {"cdr-popup":"cdr-popup_13-0-0-alpha-3","cdr-popup--open":"cdr-popup--open_13-0-0-alpha-3","cdr-popup--closed":"cdr-popup--closed_13-0-0-alpha-3","cdr-popup__content":"cdr-popup__content_13-0-0-alpha-3","cdr-popup__arrow":"cdr-popup__arrow_13-0-0-alpha-3","cdr-popup--top":"cdr-popup--top_13-0-0-alpha-3","cdr-popup--bottom":"cdr-popup--bottom_13-0-0-alpha-3","cdr-popup--exit":"cdr-popup--exit_13-0-0-alpha-3","cdr-popup--corner-left":"cdr-popup--corner-left_13-0-0-alpha-3","cdr-popup--corner-right":"cdr-popup--corner-right_13-0-0-alpha-3","cdr-popup--left":"cdr-popup--left_13-0-0-alpha-3","cdr-popup--right":"cdr-popup--right_13-0-0-alpha-3","cdr-popup--corner-top":"cdr-popup--corner-top_13-0-0-alpha-3","cdr-popup--corner-bottom":"cdr-popup--corner-bottom_13-0-0-alpha-3"};
-
-export { style0 as default };

package/dist/lib/src/components/quote/CdrQuote.mjs

@@ -1,10 +0,0 @@
-import script from './CdrQuote.vue_vue_type_script_lang.mjs';
-export { default } from './CdrQuote.vue_vue_type_script_lang.mjs';
-import { render } from './CdrQuote.vue_vue_type_template_id_20116a2e_lang.mjs';
-import style0 from './styles/CdrQuote.module.scss_vue_type_style_index_0_src_id_20116a2e_module_true_lang.css.mjs';
-
-const cssModules = script.__cssModules = {};
-cssModules["$style"] = style0;
-
-script.render = render;
-script.__file = "src/components/quote/CdrQuote.vue";

package/dist/lib/src/components/quote/CdrQuote.vue_vue_type_script_lang.mjs

@@ -1,38 +0,0 @@
-import { defineComponent, computed, useCssModule } from 'vue';
-import mapClasses from '../../utils/mapClasses.mjs';
-import { buildClass } from '../../utils/buildClass.mjs';
-import validateProp from '../../utils/propValidator.mjs';
-
-var script = defineComponent({
-  name: 'CdrQuote',
-  props: {
-    tag: {
-      type: String,
-      default: 'blockquote',
-      validator: (value) => validateProp(value, ['blockquote', 'aside', 'q', 'div']),
-    },
-    modifier: {
-      type: String,
-      default: '',
-      validator: (value) => validateProp(value, ['', 'pull']),
-    },
-    /** Caption summary text */
-    summary: String,
-    /** Caption credit text */
-    citation: String,
-  },
-  setup(props) {
-    const baseClass = 'cdr-quote';
-    const modifierClass = computed(() => buildClass(baseClass, props.modifier));
-    return {
-      style: useCssModule(),
-      mapClasses,
-      baseClass,
-      modifierClass,
-      summaryClass: 'cdr-quote__summary',
-      citationClass: 'cdr-quote__citation',
-    };
-  },
-});
-
-export { script as default };

package/dist/lib/src/components/quote/CdrQuote.vue_vue_type_template_id_20116a2e_lang.mjs

@@ -1,27 +0,0 @@
-import { openBlock, createBlock, resolveDynamicComponent, normalizeClass, withCtx, createElementBlock, toDisplayString, createCommentVNode, renderSlot } from 'vue';
-
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (openBlock(), createBlock(resolveDynamicComponent(_ctx.tag), {
-    class: normalizeClass(_ctx.mapClasses(_ctx.style, _ctx.baseClass, _ctx.modifierClass))
-  }, {
-    default: withCtx(() => [
-      (_ctx.summary)
-        ? (openBlock(), createElementBlock("p", {
-            key: 0,
-            class: normalizeClass(_ctx.style[_ctx.summaryClass])
-          }, toDisplayString(_ctx.summary), 3 /* TEXT, CLASS */))
-        : createCommentVNode("v-if", true),
-      renderSlot(_ctx.$slots, "default"),
-      (_ctx.citation)
-        ? (openBlock(), createElementBlock("cite", {
-            key: 1,
-            class: normalizeClass(_ctx.style[_ctx.citationClass]),
-            tag: "cite"
-          }, toDisplayString(_ctx.citation), 3 /* TEXT, CLASS */))
-        : createCommentVNode("v-if", true)
-    ]),
-    _: 3 /* FORWARDED */
-  }, 8 /* PROPS */, ["class"]))
-}
-
-export { render };

package/dist/lib/src/components/quote/styles/CdrQuote.module.scss_vue_type_style_index_0_src_id_20116a2e_module_true_lang.css.mjs

@@ -1,3 +0,0 @@
-var style0 = {"cdr-quote":"cdr-quote_13-0-0-alpha-3","cdr-quote__summary":"cdr-quote__summary_13-0-0-alpha-3","cdr-quote--pull":"cdr-quote--pull_13-0-0-alpha-3"};
-
-export { style0 as default };

package/dist/lib/src/components/radio/CdrRadio.mjs

@@ -1,10 +0,0 @@
-import script from './CdrRadio.vue_vue_type_script_lang.mjs';
-export { default } from './CdrRadio.vue_vue_type_script_lang.mjs';
-import { render } from './CdrRadio.vue_vue_type_template_id_0a348de4_lang.mjs';
-import style0 from './styles/CdrRadio.module.scss_vue_type_style_index_0_src_id_0a348de4_module_true_lang.css.mjs';
-
-const cssModules = script.__cssModules = {};
-cssModules["$style"] = style0;
-
-script.render = render;
-script.__file = "src/components/radio/CdrRadio.vue";

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

@@ -1,77 +0,0 @@
-import { defineComponent, ref, watch, useCssModule } from 'vue';
-import validateProp from '../../utils/propValidator.mjs';
-import '../labelWrapper/CdrLabelWrapper.mjs';
-import sizeProps from '../../props/size.mjs';
-import backgroundProps from '../../props/background.mjs';
-import script$1 from '../labelWrapper/CdrLabelWrapper.vue_vue_type_script_lang.mjs';
-
-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: (value) => 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) {
-    const baseClass = 'cdr-radio';
-
-
-    const newValue = ref(props.modelValue);
-
-    watch(() => props.value, (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.mjs

@@ -1,35 +0,0 @@
-import { resolveComponent, openBlock, createBlock, normalizeClass, withCtx, createElementVNode, mergeProps, renderSlot } from 'vue';
-
-const _hoisted_1 = ["name", "checked", "value"];
-
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _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(() => [
-      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] = $event => (_ctx.$emit('update:modelValue', $event.target.checked && _ctx.customValue, $event)))
-      }), null, 16 /* FULL_PROPS */, _hoisted_1)
-    ]),
-    default: withCtx(() => [
-      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.mjs

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

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

@@ -1,10 +0,0 @@
-import script from './CdrRating.vue_vue_type_script_lang.mjs';
-export { default } from './CdrRating.vue_vue_type_script_lang.mjs';
-import { render } from './CdrRating.vue_vue_type_template_id_4cfe512c_lang.mjs';
-import style0 from './styles/CdrRating.module.scss_vue_type_style_index_0_src_id_4cfe512c_module_true_lang.css.mjs';
-
-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.mjs

@@ -1,116 +0,0 @@
-import { defineComponent, computed, useCssModule } from 'vue';
-import { buildClass } from '../../utils/buildClass.mjs';
-import validateProp from '../../utils/propValidator.mjs';
-import mapClasses from '../../utils/mapClasses.mjs';
-
-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: (value) => validateProp(
-        value,
-        ['small', 'medium', 'large'],
-      ),
-    },
-  },
-  setup(props) {
-    const baseClass = 'cdr-rating';
-    const sizeClass = computed(() => props.size && buildClass(baseClass, props.size));
-    const linkedClass = computed(() => props.href && buildClass(baseClass, 'linked'));
-    const emptyClass = computed(() => ((props.rounded > 0 || props.count > 0)
-      ? 'cdr-rating__placeholder'
-      : 'cdr-rating__placeholder--no-reviews'));
-    const tag = computed(() => (props.href ? 'a' : 'div'));
-
-    const displayRating = computed(() => (Math.round(props.rating * 10) / 10).toFixed(1));
-
-    const rounded = computed(() => Math.round(props.rating * 4) / 4);
-
-    const whole = computed(() => Math.floor(rounded.value));
-
-    const remainder = computed(() => rounded.value.toFixed(2).split('.')[1]);
-
-    const empties = computed(() => 5 - whole.value - (remainder.value > 0 ? 1 : 0));
-
-    const formattedCount = computed(() => (props.compact ? `(${props.count})` : `${props.count}`));
-
-    const srText = computed(() => {
-      // linked
-      if (props.href) {
-        // 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 ${displayRating.value} out of 5 stars`;
-        }
-        // default
-        return `View the ${props.count} reviews with an average rating of ${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 ${displayRating.value} out of 5 stars`;
-      }
-      // default
-      // eslint-disable-next-line
-      return `${props.count} reviews with an average rating of ${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 };