@rei/cedar 11.0.0 → 13.0.0-alpha.2

package/dist/lib/src/components/modal/CdrModal.vue_vue_type_template_id_57e9fd64_lang.js

@@ -0,0 +1,108 @@
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, mergeProps, renderSlot, normalizeStyle, toDisplayString, createCommentVNode, createVNode, withCtx } from 'vue';
+
+var _hoisted_1 = ["tabIndex"];
+var _hoisted_2 = ["role", "aria-modal", "aria-label"];
+var _hoisted_3 = ["tabIndex"];
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  var _component_icon_x_lg = resolveComponent("icon-x-lg");
+
+  var _component_cdr_button = resolveComponent("cdr-button");
+
+  return openBlock(), createElementBlock("div", {
+    class: normalizeClass(_ctx.mapClasses(_ctx.style, _ctx.baseClass, !_ctx.opened && 'cdr-modal--closed')),
+    ref: "wrapperEl"
+  }, [createElementVNode("div", {
+    class: normalizeClass([_ctx.style['cdr-modal__outerWrap'], _ctx.wrapperClass])
+  }, [createElementVNode("div", {
+    "aria-hidden": "true",
+    onClick: _cache[0] || (_cache[0] = function () {
+      return _ctx.onClick && _ctx.onClick.apply(_ctx, arguments);
+    }),
+    class: normalizeClass([_ctx.style['cdr-modal__overlay'], _ctx.overlayClass])
+  }, null, 2
+  /* CLASS */
+  ), createElementVNode("div", {
+    tabIndex: _ctx.opened ? '0' : undefined
+  }, null, 8
+  /* PROPS */
+  , _hoisted_1), createElementVNode("div", mergeProps({
+    ref: "modalEl",
+    class: _ctx.mapClasses(_ctx.style, 'cdr-modal__contentWrap', 'cdr-modal__dialog'),
+    tabIndex: "-1",
+    role: _ctx.role,
+    "aria-modal": !!_ctx.opened,
+    "aria-label": _ctx.label
+  }, _ctx.dialogAttrs), [renderSlot(_ctx.$slots, "modal", {}, function () {
+    return [createElementVNode("div", {
+      class: normalizeClass([_ctx.style['cdr-modal__innerWrap'], _ctx.contentClass]),
+      style: normalizeStyle(_ctx.reallyClosed ? {
+        display: 'none'
+      } : undefined)
+    }, [createElementVNode("section", null, [createElementVNode("div", {
+      class: normalizeClass(_ctx.style['cdr-modal__content'])
+    }, [createElementVNode("div", {
+      class: normalizeClass(_ctx.style['cdr-modal__header']),
+      ref: "headerEl"
+    }, [createElementVNode("div", {
+      class: normalizeClass(_ctx.style['cdr-modal__title'])
+    }, [_ctx.showTitle ? renderSlot(_ctx.$slots, "title", {
+      key: 0
+    }, function () {
+      return [createElementVNode("h1", null, toDisplayString(_ctx.label), 1
+      /* TEXT */
+      )];
+    }) : createCommentVNode("v-if", true)], 2
+    /* CLASS */
+    ), createVNode(_component_cdr_button, {
+      class: normalizeClass(_ctx.style['cdr-modal__close-button']),
+      "icon-only": "",
+      "with-background": true,
+      onClick: _ctx.onClick,
+      "aria-label": "Close"
+    }, {
+      default: withCtx(function () {
+        return [createVNode(_component_icon_x_lg, {
+          "inherit-color": ""
+        })];
+      }),
+      _: 1
+      /* STABLE */
+
+    }, 8
+    /* PROPS */
+    , ["class", "onClick"])], 2
+    /* CLASS */
+    ), createElementVNode("div", {
+      role: "document",
+      class: normalizeClass(_ctx.style['cdr-modal__text'])
+    }, [createElementVNode("div", {
+      class: normalizeClass(_ctx.style['cdr-modal__text-content']),
+      style: normalizeStyle({
+        maxHeight: "".concat(_ctx.scrollMaxHeight, "px"),
+        paddingRight: "".concat(_ctx.scrollPadding, "px")
+      }),
+      ref: "contentEl",
+      tabindex: "0"
+    }, [renderSlot(_ctx.$slots, "default")], 6
+    /* CLASS, STYLE */
+    )], 2
+    /* CLASS */
+    )], 2
+    /* CLASS */
+    )])], 6
+    /* CLASS, STYLE */
+    )];
+  })], 16
+  /* FULL_PROPS */
+  , _hoisted_2), createElementVNode("div", {
+    tabIndex: _ctx.opened ? '0' : undefined
+  }, null, 8
+  /* PROPS */
+  , _hoisted_3)], 2
+  /* CLASS */
+  )], 2
+  /* CLASS */
+  );
+}
+
+export { render };

package/dist/lib/src/components/modal/onTransitionEnd.js

@@ -0,0 +1,44 @@
+/* eslint-env browser */
+var transitions = {
+  transition: 'transitionend',
+  WebkitTransition: 'webkitTransitionEnd',
+  MozTransition: 'transitionend',
+  OTransition: 'oTransitionEnd otransitionend'
+}; // Also has to run on transitioncancel? if modal removed before this runs...
+
+var transitionEvent;
+
+if (typeof document !== 'undefined') {
+  var _document$createEleme = document.createElement('div'),
+      style = _document$createEleme.style;
+
+  var keys = Object.keys(transitions);
+
+  for (var i = 0, key = keys[i]; i < keys.length; i += 1, key = keys[i]) {
+    if (key in style) {
+      transitionEvent = transitions[key];
+      console.log(transitionEvent, key);
+      break;
+    }
+  }
+}
+
+var onTransitionEnd = (function (element, callback, timeout) {
+  element.addEventListener(transitionEvent, callback);
+  var timeoutId;
+
+  if (timeout) {
+    // console.log('onTransitionEnd timeout', timeout);
+    timeoutId = setTimeout(function () {
+      element.removeEventListener(transitionEvent, callback);
+      callback();
+    }, timeout);
+  }
+
+  return function () {
+    clearTimeout(timeoutId);
+    element.removeEventListener(transitionEvent, callback);
+  };
+});
+
+export { onTransitionEnd as default };

package/dist/lib/src/components/modal/styles/CdrModal.module.scss_vue_type_style_index_0_src_id_57e9fd64_module_true_lang.css.js

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

package/dist/lib/src/components/pagination/CdrPagination.js

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

package/dist/lib/src/components/pagination/CdrPagination.vue_vue_type_script_lang.js

@@ -0,0 +1,211 @@
+import _mapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/map';
+import _sliceInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/slice';
+import { defineComponent, ref, computed, onMounted, watch, useCssModule, nextTick } from 'vue';
+import mapClasses from '../../utils/mapClasses.js';
+import validateProp from '../../utils/propValidator.js';
+import '../icon/comps/caret-left.js';
+import '../icon/comps/caret-right.js';
+import '../select/CdrSelect.js';
+import script$1 from '../icon/comps/caret-left.vue_vue_type_script_lang.js';
+import script$2 from '../icon/comps/caret-right.vue_vue_type_script_lang.js';
+import script$3 from '../select/CdrSelect.vue_vue_type_script_lang.js';
+
+var script = defineComponent({
+  name: 'CdrPagination',
+  components: {
+    IconCaretLeft: script$1,
+    IconCaretRight: script$2,
+    CdrSelect: script$3
+  },
+  props: {
+    // NOTE pagination now requires an ID
+    id: {
+      type: String,
+      required: true
+    },
+
+    /**
+     * Total number of pages. Sometimes the total number of pages is different than total page data
+     * and this prop allows for that.
+     */
+    totalPages: {
+      type: Number,
+      default: null
+    },
+
+    /**
+     * Array of objects. Objects have structure of { page: Number, url: String }
+     */
+    pages: {
+      type: Array,
+      required: true,
+      validator: function validator(value) {
+        var result = value.every(function (obj) {
+          if (!Object.prototype.hasOwnProperty.call(obj, 'page') || typeof obj.page !== 'number') {
+            console.error('Property "page" is missing or is not a number', obj); // eslint-disable-line
+
+            return false;
+          }
+
+          if (!Object.prototype.hasOwnProperty.call(obj, 'url') || typeof obj.url !== 'string') {
+            console.error('Property "url" is missing or is not a string', obj); // eslint-disable-line
+
+            return false;
+          }
+
+          return true;
+        });
+        return result;
+      }
+    },
+    linkTag: {
+      type: String,
+      default: 'a',
+      validator: function validator(value) {
+        return validateProp(value, ['a', 'button']);
+      }
+    },
+    forLabel: {
+      type: String,
+      default: ''
+    },
+
+    /** @ignore used for binding v-model, represents the current page */
+    modelValue: {
+      type: Number
+    }
+  },
+
+  setup(props, ctx) {
+    var currentIdx = ref(0);
+    var innerValue = computed({
+      get: function get() {
+        return props.modelValue;
+      },
+      set: function set(val) {
+        setCurrentIdx(val);
+        ctx.emit('update:modelValue', val);
+      }
+    });
+
+    var setCurrentIdx = function setCurrentIdx(page) {
+      var _context;
+
+      currentIdx.value = _mapInstanceProperty(_context = props.pages).call(_context, function (x) {
+        return x.page;
+      }).indexOf(page);
+    };
+
+    var navigate = function navigate(pageNum, e) {
+      // TODO: provide option to just emit without navigating to support vue-router?
+      // Dont do anything if clicking the current active page
+      if (pageNum === innerValue.value) {
+        e.preventDefault();
+        return;
+      }
+
+      innerValue.value = pageNum;
+      ctx.emit('navigate', pageNum, currentUrl.value, e); // TODO: is this still necessary?
+
+      nextTick(function () {
+        // Done in a nextTick() to ensure rendering complete
+        try {
+          // Emulate native link click page reloading behaviour by blurring the
+          // paginator and returning focus to the document
+          var target = e.currentTarget || e.target;
+          target.blur();
+        } catch (err) {
+          // eslint-disable-next-line no-console
+          console.error(err);
+        }
+      });
+    };
+
+    var select = function select(page, e) {
+      e.preventDefault();
+      console.log('IMPLEMENT ME!', page); // TODO: add page links to refs array? better way to do this???
+      // $refs[`page-link-${page}-${componentID}`].click();
+    };
+
+    var currentUrl = computed(function () {
+      return props.pages[currentIdx.value].url;
+    });
+    var ariaLabel = computed(function () {
+      return props.forLabel || 'Pagination';
+    });
+    var prevPageData = computed(function () {
+      return props.pages[currentIdx.value - 1];
+    });
+    var nextPageData = computed(function () {
+      return props.pages[currentIdx.value + 1];
+    });
+    var paginationData = computed(function () {
+      var total = props.pages.length;
+      var current = innerValue.value;
+      var delta = 1;
+      var range = [];
+      var over5 = true;
+      var over5remain = true;
+
+      if (total <= 7) {
+        // all pages
+        return props.pages;
+      }
+
+      if (current < 5) {
+        var _context2;
+
+        // if first 5 pages
+        over5 = false; // [2-5]
+
+        range = _sliceInstanceProperty(_context2 = props.pages).call(_context2, 1, 5);
+      } else if (total - current < 4) {
+        var _context3;
+
+        // if last 5 pages
+        over5remain = false;
+        range = _sliceInstanceProperty(_context3 = props.pages).call(_context3, -5, -1);
+      } else {
+        // else in between
+        for (var i = Math.max(2, current - delta); i <= Math.min(total - 1, current + delta); i += 1) {
+          range.push(props.pages[i - 1]);
+        }
+      }
+
+      if (current - delta > 2 && over5) {
+        range.unshift('&hellip;');
+      }
+
+      if (current + delta < total - 1 && over5remain) {
+        range.push('&hellip;');
+      }
+
+      range.unshift(props.pages[0]);
+      range.push(props.pages[total - 1]);
+      return range;
+    });
+    onMounted(function () {
+      return setCurrentIdx(innerValue.value);
+    });
+    watch(function () {
+      return props.pages;
+    }, function () {
+      return setCurrentIdx(innerValue.value);
+    });
+    return {
+      style: useCssModule(),
+      innerValue,
+      currentIdx,
+      ariaLabel,
+      prevPageData,
+      nextPageData,
+      paginationData,
+      select,
+      navigate,
+      mapClasses
+    };
+  }
+
+});
+
+export { script as default };

package/dist/lib/src/components/pagination/CdrPagination.vue_vue_type_template_id_15a761e6_lang.js

@@ -0,0 +1,172 @@
+import _concatInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/concat';
+import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
+import { resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeClass, createBlock, resolveDynamicComponent, withCtx, createVNode, Fragment, renderList, createTextVNode, toDisplayString } from 'vue';
+
+var _hoisted_1 = ["aria-label"];
+var _hoisted_2 = {
+  key: 0
+};
+var _hoisted_3 = {
+  key: 1,
+  "aria-hidden": "true"
+};
+var _hoisted_4 = ["value"];
+var _hoisted_5 = {
+  key: 2
+};
+var _hoisted_6 = {
+  key: 3,
+  "aria-hidden": "true"
+};
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  var _component_icon_caret_left = resolveComponent("icon-caret-left");
+
+  var _component_cdr_select = resolveComponent("cdr-select");
+
+  var _component_icon_caret_right = resolveComponent("icon-caret-right");
+
+  return openBlock(), createElementBlock("nav", {
+    "aria-label": _ctx.ariaLabel
+  }, [createElementVNode("ol", {
+    class: normalizeClass(_ctx.style['cdr-pagination'])
+  }, [_ctx.innerValue > _ctx.pages[0].page ? (openBlock(), createElementBlock("li", _hoisted_2, [(openBlock(), createBlock(resolveDynamicComponent(_ctx.linkTag), {
+    "aria-label": "Go to previous page",
+    href: _ctx.linkTag === 'a' && _ctx.prevPageData && _ctx.prevPageData.url || undefined,
+    class: normalizeClass(_ctx.mapClasses(_ctx.style, 'cdr-pagination__link', 'cdr-pagination__prev')),
+    onClick: _cache[0] || (_cache[0] = function (e) {
+      return _ctx.navigate(_ctx.prevPageData.page, e);
+    })
+  }, {
+    default: withCtx(function () {
+      return [createVNode(_component_icon_caret_left, {
+        class: normalizeClass(_ctx.style['cdr-pagination_caret--prev'])
+      }, null, 8
+      /* PROPS */
+      , ["class"])];
+    }),
+    _: 1
+    /* STABLE */
+
+  }, 8
+  /* PROPS */
+  , ["href", "class"]))])) : (openBlock(), createElementBlock("li", _hoisted_3, [createElementVNode("span", {
+    "aria-disabled": "true",
+    class: normalizeClass(_ctx.mapClasses(_ctx.style, 'cdr-pagination__link', 'cdr-pagination__prev', 'cdr-pagination__link--disabled'))
+  }, [createVNode(_component_icon_caret_left, {
+    class: normalizeClass(_ctx.style['cdr-pagination_caret--prev']),
+    "inherit-color": ""
+  }, null, 8
+  /* PROPS */
+  , ["class"])], 2
+  /* CLASS */
+  )])), (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.paginationData, function (n) {
+    var _context;
+
+    return openBlock(), createElementBlock("li", {
+      key: _concatInstanceProperty(_context = "pagination-".concat(_ctx.id, "-li-")).call(_context, n.page),
+      class: normalizeClass(_ctx.style['cdr-pagination__li--links'])
+    }, [n.page ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.linkTag), {
+      key: 0,
+      class: normalizeClass(_ctx.mapClasses(_ctx.style, 'cdr-pagination__link', n.page === _ctx.innerValue && 'cdr-pagination__link--current')),
+      "aria-label": n.page === _ctx.innerValue ? "Current page, page ".concat(n.page) : "Go to page ".concat(n.page),
+      "aria-current": n.page === _ctx.innerValue ? 'page' : null,
+      href: _ctx.linkTag === 'a' && n.url || undefined,
+      onClick: function onClick(e) {
+        return _ctx.navigate(n.page, e);
+      }
+    }, {
+      default: withCtx(function () {
+        return [createTextVNode(toDisplayString(n.page), 1
+        /* TEXT */
+        )];
+      }),
+      _: 2
+      /* DYNAMIC */
+
+    }, 1032
+    /* PROPS, DYNAMIC_SLOTS */
+    , ["class", "aria-label", "aria-current", "href", "onClick"])) : (openBlock(), createElementBlock("span", {
+      key: 1,
+      class: normalizeClass(_ctx.style['cdr-pagination__ellipse'])
+    }, " … ", 2
+    /* CLASS */
+    ))], 2
+    /* CLASS */
+    );
+  }), 128
+  /* KEYED_FRAGMENT */
+  )), createElementVNode("li", {
+    class: normalizeClass(_ctx.style['cdr-pagination__li--select'])
+  }, [createVNode(_component_cdr_select, {
+    id: "pagination-select-".concat(_ctx.id),
+    modelValue: _ctx.innerValue,
+    "onUpdate:modelValue": _cache[1] || (_cache[1] = function ($event) {
+      return _ctx.innerValue = $event;
+    }),
+    label: "Navigate to page",
+    "hide-label": "",
+    onChange: _ctx.select
+  }, {
+    default: withCtx(function () {
+      var _context2;
+
+      return [(openBlock(true), createElementBlock(Fragment, null, renderList(_filterInstanceProperty(_context2 = _ctx.paginationData).call(_context2, function (n) {
+        return n.page;
+      }), function (page) {
+        var _context3;
+
+        return openBlock(), createElementBlock("option", {
+          key: _concatInstanceProperty(_context3 = "pagination-".concat(_ctx.id, "-select-")).call(_context3, page.page),
+          value: page.page
+        }, " Page " + toDisplayString(page.page) + toDisplayString(_ctx.totalPages === null ? '' : " of ".concat(_ctx.totalPages)), 9
+        /* TEXT, PROPS */
+        , _hoisted_4);
+      }), 128
+      /* KEYED_FRAGMENT */
+      ))];
+    }),
+    _: 1
+    /* STABLE */
+
+  }, 8
+  /* PROPS */
+  , ["id", "modelValue", "onChange"])], 2
+  /* CLASS */
+  ), _ctx.innerValue < _ctx.pages[_ctx.pages.length - 1].page ? (openBlock(), createElementBlock("li", _hoisted_5, [(openBlock(), createBlock(resolveDynamicComponent(_ctx.linkTag), {
+    "aria-label": "Go to next page",
+    href: _ctx.linkTag === 'a' && _ctx.nextPageData && _ctx.nextPageData.url || undefined,
+    class: normalizeClass(_ctx.mapClasses(_ctx.style, 'cdr-pagination__link', 'cdr-pagination__next')),
+    onClick: _cache[2] || (_cache[2] = function (e) {
+      return _ctx.navigate(_ctx.nextPageData.page, e);
+    })
+  }, {
+    default: withCtx(function () {
+      return [createVNode(_component_icon_caret_right, {
+        class: normalizeClass(_ctx.style['cdr-pagination_caret--next'])
+      }, null, 8
+      /* PROPS */
+      , ["class"])];
+    }),
+    _: 1
+    /* STABLE */
+
+  }, 8
+  /* PROPS */
+  , ["href", "class"]))])) : (openBlock(), createElementBlock("li", _hoisted_6, [createElementVNode("span", {
+    "aria-disabled": "true",
+    class: normalizeClass(_ctx.mapClasses(_ctx.style, 'cdr-pagination__link', 'cdr-pagination__next', 'cdr-pagination__link--disabled'))
+  }, [createVNode(_component_icon_caret_right, {
+    class: normalizeClass(_ctx.style['cdr-pagination_caret--next']),
+    "inherit-color": ""
+  }, null, 8
+  /* PROPS */
+  , ["class"])], 2
+  /* CLASS */
+  )]))], 2
+  /* CLASS */
+  )], 8
+  /* PROPS */
+  , _hoisted_1);
+}
+
+export { render };

package/dist/lib/src/components/pagination/styles/CdrPagination.module.scss_vue_type_style_index_0_src_id_15a761e6_module_true_lang.css.js

@@ -0,0 +1,15 @@
+var style0 = {
+  "cdr-pagination": "cdr-pagination_13-0-0-alpha-2",
+  "cdr-pagination__li--links": "cdr-pagination__li--links_13-0-0-alpha-2",
+  "cdr-pagination__li--select": "cdr-pagination__li--select_13-0-0-alpha-2",
+  "cdr-pagination__link": "cdr-pagination__link_13-0-0-alpha-2",
+  "cdr-pagination__link--current": "cdr-pagination__link--current_13-0-0-alpha-2",
+  "cdr-pagination__link--disabled": "cdr-pagination__link--disabled_13-0-0-alpha-2",
+  "cdr-pagination__ellipse": "cdr-pagination__ellipse_13-0-0-alpha-2",
+  "cdr-pagination__prev": "cdr-pagination__prev_13-0-0-alpha-2",
+  "cdr-pagination__next": "cdr-pagination__next_13-0-0-alpha-2",
+  "cdr-pagination__caret--prev": "cdr-pagination__caret--prev_13-0-0-alpha-2",
+  "cdr-pagination__caret--next": "cdr-pagination__caret--next_13-0-0-alpha-2"
+};
+
+export { style0 as default };

package/dist/lib/src/components/popover/CdrPopover.js

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