@rei/cedar 11.0.1 → 13.0.0-alpha.3

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

@@ -0,0 +1,130 @@
+import { resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeClass, createBlock, resolveDynamicComponent, withCtx, createVNode, Fragment, renderList, createTextVNode, toDisplayString } from 'vue';
+
+const _hoisted_1 = ["aria-label"];
+const _hoisted_2 = { key: 0 };
+const _hoisted_3 = {
+  key: 1,
+  "aria-hidden": "true"
+};
+const _hoisted_4 = ["value"];
+const _hoisted_5 = { key: 2 };
+const _hoisted_6 = {
+  key: 3,
+  "aria-hidden": "true"
+};
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_icon_caret_left = resolveComponent("icon-caret-left");
+  const _component_cdr_select = resolveComponent("cdr-select");
+  const _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] = (e) => _ctx.navigate(_ctx.prevPageData.page, e))
+            }, {
+              default: withCtx(() => [
+                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, (n) => {
+        return (openBlock(), createElementBlock("li", {
+          key: `pagination-${_ctx.id}-li-${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 ${n.page}` : `Go to page ${n.page}`,
+                "aria-current": n.page === _ctx.innerValue ? 'page' : null,
+                href: (_ctx.linkTag === 'a' && n.url) || undefined,
+                onClick: (e) => _ctx.navigate(n.page, e)
+              }, {
+                default: withCtx(() => [
+                  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-${_ctx.id}`,
+          modelValue: _ctx.innerValue,
+          "onUpdate:modelValue": _cache[1] || (_cache[1] = $event => ((_ctx.innerValue) = $event)),
+          label: "Navigate to page",
+          "hide-label": "",
+          onChange: _ctx.select
+        }, {
+          default: withCtx(() => [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.paginationData.filter(n => n.page), (page) => {
+              return (openBlock(), createElementBlock("option", {
+                key: `pagination-${_ctx.id}-select-${page.page}`,
+                value: page.page
+              }, " Page " + toDisplayString(page.page) + toDisplayString(_ctx.totalPages === null ? '' : ` of ${_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] = (e) => _ctx.navigate(_ctx.nextPageData.page, e))
+            }, {
+              default: withCtx(() => [
+                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.mjs

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

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

@@ -1,155 +1,10 @@
-import tabbable from 'tabbable';
-import clsx from 'clsx';
-import modules_36d90b1f from './styles/CdrPopover.mjs';
-import validateProp from '../../utils/propValidator.mjs';
-import IconXSm from '../icon/comps/x-sm.mjs';
-import CdrButton from '../button/CdrButton.mjs';
-import CdrPopup from '../popup/CdrPopup.mjs';
+import script from './CdrPopover.vue_vue_type_script_lang.mjs';
+export { default } from './CdrPopover.vue_vue_type_script_lang.mjs';
+import { render } from './CdrPopover.vue_vue_type_template_id_764fda0e_lang.mjs';
+import style0 from './styles/CdrPopover.module.scss_vue_type_style_index_0_src_id_764fda0e_module_true_lang.css.mjs';
 
-var CdrPopover = {
-  name: 'CdrPopover',
-  components: {
-    CdrPopup,
-    CdrButton,
-    IconXSm
-  },
-  props: {
-    position: {
-      type: String,
-      required: false,
-      default: 'top',
-      validator: value => validateProp(value, ['top', 'bottom', 'left', 'right'])
-    },
-    autoPosition: {
-      type: Boolean,
-      required: false,
-      default: true
-    },
-    label: {
-      type: String,
-      required: false
-    },
-    id: {
-      type: String,
-      required: true
-    },
-    contentClass: {
-      type: String,
-      required: false
-    },
-    open: {
-      type: Boolean,
-      default: false,
-      required: false
-    }
-  },
+const cssModules = script.__cssModules = {};
+cssModules["$style"] = style0;
 
-  data() {
-    return {
-      style: modules_36d90b1f,
-      isOpen: false,
-      openHandler: undefined,
-      lastActive: undefined
-    };
-  },
-
-  watch: {
-    open() {
-      if (this.open) {
-        this.openPopover();
-      } else {
-        this.closePopover();
-      }
-    }
-
-  },
-
-  mounted() {
-    this.addHandlers();
-    const trigger = this.$refs.trigger.children[0];
-
-    if (trigger) {
-      trigger.setAttribute('aria-controls', this.id);
-      trigger.setAttribute('aria-haspopup', 'dialog');
-    }
-  },
-
-  methods: {
-    openPopover(e) {
-      const {
-        activeElement
-      } = document;
-      this.lastActive = activeElement;
-      this.isOpen = true;
-      this.$emit('opened', e);
-      this.$nextTick(() => {
-        const tabbables = tabbable(this.$refs.popup.$el);
-        if (tabbables[0]) tabbables[0].focus();
-      });
-    },
-
-    closePopover(e) {
-      this.isOpen = false;
-      this.$emit('closed', e);
-      if (this.lastActive) this.lastActive.focus();
-    },
-
-    addHandlers() {
-      this.openHandler = this.openPopover.bind(this);
-      const triggerElement = this.$refs.trigger.children[0];
-
-      if (triggerElement) {
-        triggerElement.addEventListener('click', this.openHandler);
-      }
-    }
-
-  },
-
-  render() {
-    const h = arguments[0];
-    return h("div", {
-      "class": clsx(this.style['cdr-popover--wrapper'], this.$slots.trigger ? this.style['cdr-popover--position'] : '')
-    }, [h("div", {
-      "ref": "trigger"
-    }, [this.$slots.trigger]), h("cdr-popup", {
-      "class": this.style['cdr-popover'],
-      "attrs": {
-        "role": "dialog",
-        "position": this.position,
-        "autoPosition": this.autoPosition,
-        "opened": this.isOpen,
-        "aria-expanded": "".concat(this.isOpen),
-        "id": this.id,
-        "contentClass": this.contentClass
-      },
-      "ref": "popup",
-      "on": {
-        "closed": this.closePopover
-      }
-    }, [h("div", {
-      "class": this.style['cdr-popover__container']
-    }, [h("div", {
-      "class": this.style['cdr-popover__content']
-    }, [(this.$slots.title || this.label) && h("div", {
-      "class": this.style['cdr-popover__title']
-    }, [this.$slots.title, !this.$slots.title && this.label && h("span", [this.label])]), this.$slots.default]), h("cdr-button", {
-      "class": this.style['cdr-popover__close-button'],
-      "attrs": {
-        "icon-only": true,
-        "aria-label": "Close",
-        "size": "small"
-      },
-      "on": {
-        "click": this.closePopover
-      }
-    }, [h("icon-x-sm", {
-      "slot": "icon",
-      "attrs": {
-        "inherit-color": true
-      }
-    })])])])]);
-  }
-
-};
-
-export default CdrPopover;
+script.render = render;
+script.__file = "src/components/popover/CdrPopover.vue";

package/dist/lib/src/components/popover/CdrPopover.vue_vue_type_script_lang.mjs

@@ -0,0 +1,115 @@
+import { defineComponent, ref, watch, onMounted, useCssModule, nextTick } from 'vue';
+import tabbable from 'tabbable';
+import '../icon/comps/x-sm.mjs';
+import '../button/CdrButton.mjs';
+import '../popup/CdrPopup.mjs';
+import validateProp from '../../utils/propValidator.mjs';
+import mapClasses from '../../utils/mapClasses.mjs';
+import script$1 from '../popup/CdrPopup.vue_vue_type_script_lang.mjs';
+import script$3 from '../icon/comps/x-sm.vue_vue_type_script_lang.mjs';
+import script$2 from '../button/CdrButton.vue_vue_type_script_lang.mjs';
+
+var script = defineComponent({
+  name: 'CdrPopover',
+  components: {
+    CdrPopup: script$1,
+    CdrButton: script$2,
+    IconXSm: script$3,
+  },
+  props: {
+    position: {
+      type: String,
+      required: false,
+      default: 'top',
+      validator: (value) => validateProp(
+        value,
+        ['top', 'bottom', 'left', 'right'],
+      ),
+    },
+    autoPosition: {
+      type: Boolean,
+      required: false,
+      default: true,
+    },
+    label: {
+      type: String,
+      required: false,
+    },
+    id: {
+      type: String,
+      required: true,
+    },
+    contentClass: {
+      type: String,
+      required: false,
+    },
+    open: {
+      type: Boolean,
+      default: false,
+      required: false,
+    },
+  },
+  setup(props, ctx) {
+    const isOpen = ref(false);
+    let lastActive;
+
+    const triggerEl = ref(null);
+    const popupEl = ref(null);
+
+    const hasTrigger = ctx.slots.trigger;
+    const hasTitle = ctx.slots.title || props.label;
+
+    const openPopover = (e) => {
+      const { activeElement } = document;
+
+      lastActive = activeElement;
+      isOpen.value = true;
+      ctx.emit('opened', e);
+      nextTick(() => {
+        const tabbables = tabbable(popupEl.value);
+        if (tabbables[0]) tabbables[0].focus();
+      });
+    };
+
+    const closePopover = (e) => {
+      isOpen.value = false;
+      ctx.emit('closed', e);
+      if (lastActive) lastActive.focus();
+    };
+
+    const addHandlers = ()  =>{
+      const triggerElement = triggerEl.value.children[0];
+      if (triggerElement) {
+        triggerElement.addEventListener('click', openPopover);
+      }
+    };
+
+    watch(() => props.open, () => {
+      // TODO: if eslint yells about this then eslint must go :)
+      props.open ? openPopover() : closePopover();
+    });
+
+    onMounted(() => {
+      addHandlers();
+
+      const trigger = triggerEl.value.children[0];
+      if (trigger) {
+        trigger.setAttribute('aria-controls', props.id);
+        trigger.setAttribute('aria-haspopup', 'dialog');
+      }
+    });
+
+    return {
+      style: useCssModule(),
+      mapClasses,
+      hasTrigger,
+      triggerEl,
+      hasTitle,
+      closePopover,
+      openPopover,
+      isOpen,
+    };
+  },
+});
+
+export { script as default };

package/dist/lib/src/components/popover/CdrPopover.vue_vue_type_template_id_764fda0e_lang.mjs

@@ -0,0 +1,72 @@
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, createVNode, withCtx, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
+
+const _hoisted_1 = { ref: "triggerEl" };
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_icon_x_sm = resolveComponent("icon-x-sm");
+  const _component_cdr_button = resolveComponent("cdr-button");
+  const _component_cdr_popup = resolveComponent("cdr-popup");
+
+  return (openBlock(), createElementBlock("div", {
+    class: normalizeClass(_ctx.mapClasses(
+    _ctx.style,
+    'cdr-popover--wrapper',
+    _ctx.hasTrigger && 'cdr-popover--position',
+  ))
+  }, [
+    createElementVNode("div", _hoisted_1, [
+      renderSlot(_ctx.$slots, "trigger")
+    ], 512 /* NEED_PATCH */),
+    createVNode(_component_cdr_popup, {
+      role: "dialog",
+      ref: "popupEl",
+      onClosed: _ctx.closePopover,
+      position: _ctx.position,
+      "auto-position": _ctx.autoPosition,
+      opened: _ctx.isOpen,
+      "aria-expanded": `${_ctx.isOpen}`,
+      id: _ctx.id,
+      "content-class": _ctx.contentClass
+    }, {
+      default: withCtx(() => [
+        createElementVNode("div", {
+          class: normalizeClass(_ctx.style['cdr-popover__container'])
+        }, [
+          createElementVNode("div", {
+            class: normalizeClass(_ctx.style['cdr-popover__content'])
+          }, [
+            (_ctx.hasTitle)
+              ? (openBlock(), createElementBlock("div", {
+                  key: 0,
+                  class: normalizeClass(_ctx.style['cdr-popover__title'])
+                }, [
+                  renderSlot(_ctx.$slots, "title", {}, () => [
+                    createTextVNode(toDisplayString(_ctx.label), 1 /* TEXT */)
+                  ])
+                ], 2 /* CLASS */))
+              : createCommentVNode("v-if", true),
+            renderSlot(_ctx.$slots, "default")
+          ], 2 /* CLASS */),
+          createVNode(_component_cdr_button, {
+            class: normalizeClass(_ctx.style['cdr-popover__close-button']),
+            "icon-only": "",
+            onClick: _ctx.closePopover,
+            "aria-label": "Close",
+            size: "small"
+          }, {
+            default: withCtx(() => [
+              createVNode(_component_icon_x_sm, {
+                slot: "icon",
+                "inherit-color": ""
+              })
+            ]),
+            _: 1 /* STABLE */
+          }, 8 /* PROPS */, ["class", "onClick"])
+        ], 2 /* CLASS */)
+      ]),
+      _: 3 /* FORWARDED */
+    }, 8 /* PROPS */, ["onClosed", "position", "auto-position", "opened", "aria-expanded", "id", "content-class"])
+  ], 2 /* CLASS */))
+}
+
+export { render };

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

@@ -0,0 +1,3 @@
+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 };