@rei/cedar 11.0.1 → 13.0.0-alpha.kurt-test

package/dist/lib/src/components/labelWrapper/CdrLabelWrapper.mjs

@@ -1,54 +0,0 @@
-import clsx from 'clsx';
-import modules_fba16867 from './styles/CdrLabelWrapper.mjs';
-import modifier from '../../mixins/modifier.mjs';
-import size from '../../mixins/size.mjs';
-import validateProp from '../../utils/propValidator.mjs';
-
-var CdrLabelWrapper = {
-  name: 'CdrLabelWrapper',
-  mixins: [modifier, size],
-  inheritAttrs: false,
-  props: {
-    labelClass: String,
-    contentClass: String,
-    background: {
-      type: [String],
-      default: 'primary',
-      validator: value => validateProp(value, ['primary', 'secondary'])
-    },
-    disabled: Boolean
-  },
-
-  data() {
-    return {
-      style: modules_fba16867
-    };
-  },
-
-  computed: {
-    baseClass() {
-      return 'cdr-label-wrapper';
-    },
-
-    disabledClass() {
-      return this.disabled ? this.style['cdr-label-wrapper--disabled'] : '';
-    }
-
-  },
-
-  render() {
-    const h = arguments[0];
-    return h("div", {
-      "class": this.style['cdr-label-wrapper__container']
-    }, [h("label", {
-      "class": clsx(this.style['cdr-label-wrapper'], this.style["cdr-label-wrapper--".concat(this.background)], this.disabledClass, this.modifierClass, this.sizeClass, this.labelClass)
-    }, [this.$slots.input, h("span", {
-      "class": this.style['cdr-label-wrapper__figure']
-    }), h("div", {
-      "class": clsx(this.style['cdr-label-wrapper__content'], this.contentClass)
-    }, [this.$slots.default])])]);
-  }
-
-};
-
-export default CdrLabelWrapper;

package/dist/lib/src/components/labelWrapper/styles/CdrLabelWrapper.mjs

@@ -1,3 +0,0 @@
-var modules_fba16867 = {"cdr-label-wrapper":"cdr-label-wrapper_11-0-1","cdr-label-wrapper__container":"cdr-label-wrapper__container_11-0-1","cdr-label-wrapper--primary":"cdr-label-wrapper--primary_11-0-1","cdr-label-wrapper--secondary":"cdr-label-wrapper--secondary_11-0-1","cdr-label-wrapper--disabled":"cdr-label-wrapper--disabled_11-0-1","cdr-label-wrapper__figure":"cdr-label-wrapper__figure_11-0-1","cdr-label-wrapper__content":"cdr-label-wrapper__content_11-0-1","cdr-label-wrapper--hide-figure":"cdr-label-wrapper--hide-figure_11-0-1","cdr-label-wrapper--small":"cdr-label-wrapper--small_11-0-1","cdr-label-wrapper--medium":"cdr-label-wrapper--medium_11-0-1","cdr-label-wrapper--large":"cdr-label-wrapper--large_11-0-1","cdr-label-wrapper--small@xs":"cdr-label-wrapper--small@xs_11-0-1","cdr-label-wrapper--medium@xs":"cdr-label-wrapper--medium@xs_11-0-1","cdr-label-wrapper--large@xs":"cdr-label-wrapper--large@xs_11-0-1","cdr-label-wrapper--small@sm":"cdr-label-wrapper--small@sm_11-0-1","cdr-label-wrapper--medium@sm":"cdr-label-wrapper--medium@sm_11-0-1","cdr-label-wrapper--large@sm":"cdr-label-wrapper--large@sm_11-0-1","cdr-label-wrapper--small@md":"cdr-label-wrapper--small@md_11-0-1","cdr-label-wrapper--medium@md":"cdr-label-wrapper--medium@md_11-0-1","cdr-label-wrapper--large@md":"cdr-label-wrapper--large@md_11-0-1","cdr-label-wrapper--small@lg":"cdr-label-wrapper--small@lg_11-0-1","cdr-label-wrapper--medium@lg":"cdr-label-wrapper--medium@lg_11-0-1","cdr-label-wrapper--large@lg":"cdr-label-wrapper--large@lg_11-0-1"};
-
-export default modules_fba16867;

package/dist/lib/src/components/link/CdrLink.mjs

@@ -1,71 +0,0 @@
-import clsx from 'clsx';
-import modifier from '../../mixins/modifier.mjs';
-import modules_ec342341 from './styles/CdrLink.mjs';
-
-var CdrLink = {
-  name: 'CdrLink',
-  mixins: [modifier],
-  props: {
-    tag: {
-      type: String,
-      default: 'a'
-    },
-    href: {
-      type: String,
-      default: '#'
-    },
-    inheritColor: {
-      type: Boolean,
-      default: false
-    },
-
-    /** @ignore */
-    target: String,
-
-    /** @ignore */
-    rel: String
-  },
-
-  data() {
-    return {
-      style: modules_ec342341
-    };
-  },
-
-  computed: {
-    baseClass() {
-      return 'cdr-link';
-    },
-
-    computedRel() {
-      if (this.target === '_blank') {
-        return this.rel || 'noopener noreferrer';
-      }
-
-      return this.rel;
-    },
-
-    inheritColorClass() {
-      return this.inheritColor ? this.style['cdr-link--inherit-color'] : '';
-    }
-
-  },
-
-  render() {
-    const h = arguments[0];
-    const Component = this.tag;
-    return h(Component, {
-      "class": clsx(this.style[this.baseClass], this.modifierClass, this.inheritColorClass),
-      "attrs": {
-        "target": this.target,
-        "rel": this.computedRel,
-        "href": this.tag === 'a' ? this.href : null
-      },
-      "on": { ...this.$listeners
-      }
-    }, [this.$slots.default || this.href]);
-  }
-
-};
-
-export default CdrLink;

package/dist/lib/src/components/link/styles/CdrLink.mjs

@@ -1,3 +0,0 @@
-var modules_ec342341 = {"cdr-link":"cdr-link_11-0-1","cdr-link--standalone":"cdr-link--standalone_11-0-1","cdr-link--inherit-color":"cdr-link--inherit-color_11-0-1"};
-
-export default modules_ec342341;

package/dist/lib/src/components/list/CdrList.mjs

@@ -1,42 +0,0 @@
-import clsx from 'clsx';
-import modifier from '../../mixins/modifier.mjs';
-import modules_c3de6696 from './styles/CdrList.mjs';
-
-var CdrList = {
-  name: 'CdrList',
-  mixins: [modifier],
-  props: {
-    /**
-     * Tag accepts a user defined element and expects either: 'ul' = Unordered List or 'ol' = Ordered List.
-     */
-    tag: {
-      type: String,
-      default: 'ul',
-      validator: value => ['ul', 'ol'].indexOf(value) >= 0 || false
-    }
-  },
-
-  data() {
-    return {
-      style: modules_c3de6696
-    };
-  },
-
-  computed: {
-    baseClass() {
-      return 'cdr-list';
-    }
-
-  },
-
-  render() {
-    const h = arguments[0];
-    const Component = this.tag;
-    return h(Component, {
-      "class": clsx(this.style[this.baseClass], this.modifierClass)
-    }, [this.$slots.default]);
-  }
-
-};
-
-export default CdrList;

package/dist/lib/src/components/list/styles/CdrList.mjs

@@ -1,3 +0,0 @@
-var modules_c3de6696 = {"cdr-list":"cdr-list_11-0-1","cdr-list--compact":"cdr-list--compact_11-0-1","cdr-list--ordered":"cdr-list--ordered_11-0-1","cdr-list--unordered":"cdr-list--unordered_11-0-1","cdr-list--inline":"cdr-list--inline_11-0-1"};
-
-export default modules_c3de6696;

package/dist/lib/src/components/modal/CdrModal.mjs

@@ -1,365 +0,0 @@
-import debounce from 'lodash-es/debounce';
-import tabbable from 'tabbable';
-import clsx from 'clsx';
-import { CdrBreakpointSm, CdrSpaceTwoX, CdrSpaceOneX } from '../../../node_modules/@rei/cdr-tokens/dist/js/cdr-tokens.esm.mjs';
-import modules_11cadc74 from './styles/CdrModal.mjs';
-import onTransitionEnd from './onTransitionEnd.mjs';
-import CdrButton from '../button/CdrButton.mjs';
-import IconXLg from '../icon/comps/x-lg.mjs';
-
-var CdrModal = {
-  name: 'CdrModal',
-  components: {
-    CdrButton,
-    IconXLg
-  },
-  props: {
-    opened: {
-      type: Boolean,
-      required: true
-    },
-    label: {
-      type: String,
-      required: true
-    },
-    role: {
-      type: String,
-      required: false,
-      default: 'dialog'
-    },
-    showTitle: {
-      type: Boolean,
-      required: false,
-      default: true
-    },
-    ariaDescribedby: {
-      type: String,
-      required: false,
-      default: null
-    },
-    id: {
-      type: String,
-      required: false,
-      default: null
-    },
-    overlayClass: String,
-    wrapperClass: String,
-    contentClass: String,
-    animationDuration: {
-      type: Number,
-      default: 300
-    }
-  },
-
-  data() {
-    return {
-      style: modules_11cadc74,
-      unsubscribe: null,
-      keyHandler: null,
-      lastActive: null,
-      focusHandler: null,
-      resizeHandler: null,
-      isOpening: false,
-      offset: null,
-      headerHeight: 0,
-      totalHeight: 0,
-      isScrolling: false,
-      hasScrollbar: false,
-      fullscreen: false
-    };
-  },
-
-  computed: {
-    dialogAttrs() {
-      return {
-        'aria-describedby': this.ariaDescribedby,
-        'aria-modal': 'true',
-        id: this.id
-      };
-    },
-
-    scrollPadding() {
-      if (this.isScrolling && this.hasScrollbar) {
-        // content is scrolling, scrollbar is always present
-        return 4;
-      }
-
-      if (this.isScrolling) {
-        // content is scrolling, scrollbar only appears on scroll
-        return 12;
-      }
-
-      return 0;
-    },
-
-    verticalSpace() {
-      // contentWrap vertical padding
-      const fullscreen = Number(CdrSpaceTwoX);
-      const windowed = Number(CdrSpaceTwoX) + Number(CdrSpaceOneX);
-      return this.fullscreen ? fullscreen : windowed + fullscreen; // fullscreen, here, would account for outerWrap padding, which is the same CdrSpaceTwoX
-    },
-
-    scrollMaxHeight() {
-      return this.totalHeight - this.headerHeight - this.verticalSpace;
-    }
-
-  },
-  watch: {
-    opened(newValue, oldValue) {
-      if (!!newValue === !!oldValue) return;
-
-      if (newValue) {
-        this.handleOpened();
-      } else {
-        this.handleClosed();
-      }
-    }
-
-  },
-
-  mounted() {
-    if (this.opened) {
-      this.handleOpened();
-    }
-
-    this.resizeHandler = debounce(() => {
-      this.measureContent();
-    }, 300);
-    window.addEventListener('resize', this.resizeHandler);
-  },
-
-  beforeDestroy() {
-    if (this.unsubscribe) this.unsubscribe();
-    if (this.opened) this.removeNoScroll();
-    document.removeEventListener('focusin', this.focusHandler, true);
-    document.removeEventListener('keydown', this.keyHandler);
-    window.removeEventListener('resize', this.resizeHandler);
-  },
-
-  methods: {
-    measureContent() {
-      this.$nextTick(() => {
-        var _this$$refs$header, _this$$refs$content, _this$$refs$content2, _this$$refs$content3, _this$$refs$content4;
-
-        this.totalHeight = window.innerHeight;
-        this.fullscreen = window.innerWidth < CdrBreakpointSm;
-        this.headerHeight = (_this$$refs$header = this.$refs.header) === null || _this$$refs$header === void 0 ? void 0 : _this$$refs$header.offsetHeight;
-        this.isScrolling = ((_this$$refs$content = this.$refs.content) === null || _this$$refs$content === void 0 ? void 0 : _this$$refs$content.scrollHeight) > ((_this$$refs$content2 = this.$refs.content) === null || _this$$refs$content2 === void 0 ? void 0 : _this$$refs$content2.offsetHeight);
-        this.hasScrollbar = ((_this$$refs$content3 = this.$refs.content) === null || _this$$refs$content3 === void 0 ? void 0 : _this$$refs$content3.offsetWidth) - ((_this$$refs$content4 = this.$refs.content) === null || _this$$refs$content4 === void 0 ? void 0 : _this$$refs$content4.clientWidth) > 0;
-      });
-    },
-
-    handleKeyDown({
-      key
-    }) {
-      switch (key) {
-        case 'Escape':
-        case 'Esc':
-          this.onClick();
-          break;
-      }
-    },
-
-    handleFocus(e) {
-      const {
-        documentElement
-      } = document;
-      if (this.$refs.modal.contains(e.target) || !documentElement) return;
-      const tabbables = tabbable(documentElement);
-      const these = tabbable(this.$refs.modal);
-      const nextIx = tabbables.indexOf(e.target);
-      const firstModalIx = tabbables.indexOf(these[0]);
-      const nextRef = nextIx < firstModalIx ? these[these.length - 1] : these[0];
-      if (nextRef) nextRef.focus();
-      documentElement.scrollTop = this.scrollTop;
-      documentElement.scrollLeft = this.scrollLeft;
-    },
-
-    handleOpened() {
-      const {
-        activeElement
-      } = document;
-      this.addNoScroll();
-      this.isOpening = true;
-      this.lastActive = activeElement;
-      this.$nextTick(() => {
-        if (this.$refs.modal) this.$refs.modal.focus(); // wrapped in if so testing error isn't thrown
-
-        this.measureContent();
-        this.addHandlers();
-        setTimeout(() => {
-          // for some reason Safari scrolls the wrapper down a bit?
-          // doesn't work without setTimeout for some unknown reason
-          if (this.$refs.wrapper) this.$refs.wrapper.scrollTop = 0; // there is a race condition for measuring overflow when modal defaults to open,
-          // this seems to cover that
-
-          this.measureContent();
-        });
-      });
-    },
-
-    handleClosed() {
-      const {
-        documentElement
-      } = document;
-      document.removeEventListener('keydown', this.keyHandler);
-      document.removeEventListener('focusin', this.focusHandler, true);
-      this.isOpening = false;
-      this.unsubscribe = onTransitionEnd(this.$refs.wrapper, () => {
-        if (this.isOpening) return;
-        this.unsubscribe();
-        this.removeNoScroll();
-        this.unsubscribe = null; // handle scroll-behavior: smooth
-
-        if (documentElement) documentElement.style.scrollBehavior = 'auto'; // restore previous scroll position
-
-        window.scrollTo(this.offset.x, this.offset.y);
-        if (documentElement) documentElement.style.scrollBehavior = '';
-        if (this.lastActive) this.lastActive.focus();
-      }, this.animationDuration + 16);
-    },
-
-    addNoScroll() {
-      const {
-        documentElement,
-        body
-      } = document;
-      const offset = {
-        x: window.scrollX || (documentElement || {}).scrollLeft || (body || {}).scrollLeft || 0,
-        y: window.scrollY || (documentElement || {}).scrollTop || (body || {}).scrollTop || 0
-      };
-      this.offset = offset;
-
-      if (documentElement) {
-        documentElement.classList.add(modules_11cadc74['cdr-modal__noscroll']); // keep current scroll position manually
-
-        documentElement.style.top = "-".concat(offset.y, "px");
-        documentElement.style.left = "-".concat(offset.x, "px");
-      }
-
-      if (body) {
-        body.classList.add(modules_11cadc74['cdr-modal__noscroll']);
-      }
-    },
-
-    removeNoScroll() {
-      const {
-        documentElement,
-        body
-      } = document;
-
-      if (body) {
-        body.classList.remove(modules_11cadc74['cdr-modal__noscroll']);
-      }
-
-      if (documentElement) {
-        documentElement.classList.remove(modules_11cadc74['cdr-modal__noscroll']);
-        documentElement.style.top = '';
-        documentElement.style.left = '';
-      }
-    },
-
-    addHandlers() {
-      this.focusHandler = this.handleFocus.bind(this);
-      this.keyHandler = this.handleKeyDown.bind(this);
-      document.addEventListener('focusin', this.focusHandler, true);
-      document.addEventListener('keydown', this.keyHandler);
-    },
-
-    onClick(e) {
-      this.$emit('closed', e);
-    }
-
-  },
-
-  render() {
-    const h = arguments[0];
-    const {
-      onClick,
-      opened,
-      label,
-      wrapperClass,
-      overlayClass,
-      contentClass
-    } = this;
-    return h("div", {
-      "class": clsx(this.style['cdr-modal'], {
-        [this.style.closed]: !opened
-      }),
-      "ref": "wrapper"
-    }, [h("div", {
-      "class": clsx(this.style['cdr-modal__outerWrap'], wrapperClass)
-    }, [h("div", {
-      "attrs": {
-        "aria-hidden": "true"
-      },
-      "on": {
-        "click": onClick
-      },
-      "class": clsx(this.style['cdr-modal__overlay'], overlayClass)
-    }), h("div", {
-      "attrs": {
-        "tabIndex": opened ? '0' : undefined
-      }
-    }), h("div", {
-      "ref": "modal",
-      "class": clsx(this.style['cdr-modal__contentWrap'], this.style['cdr-modal__dialog']),
-      "attrs": {
-        "tabIndex": "-1",
-        "role": this.role,
-        "aria-modal": !!opened,
-        "aria-label": label,
-        ...this.dialogAttrs
-      }
-    }, [this.$slots.modal || h("div", {
-      "class": clsx(this.style['cdr-modal__innerWrap'], contentClass),
-      "style": !opened ? {
-        display: 'none'
-      } : undefined
-    }, [h("section", [h("div", {
-      "class": this.style['cdr-modal__content']
-    }, [h("div", {
-      "class": this.style['cdr-modal__header'],
-      "ref": "header"
-    }, [h("div", {
-      "class": this.style['cdr-modal__title']
-    }, [this.showTitle && this.$slots.title, this.showTitle && !this.$slots.title && h("h1", [this.label])]), h("cdr-button", {
-      "class": this.style['cdr-modal__close-button'],
-      "attrs": {
-        "icon-only": true,
-        "with-background": true,
-        "aria-label": "Close"
-      },
-      "on": {
-        "click": onClick
-      }
-    }, [h(IconXLg, {
-      "slot": "icon",
-      "attrs": {
-        "inherit-color": true
-      }
-    })])]), h("div", {
-      "attrs": {
-        "role": "document"
-      },
-      "class": this.style['cdr-modal__text']
-    }, [h("div", {
-      "class": this.style['cdr-modal__text-content'],
-      "style": {
-        maxHeight: "".concat(this.scrollMaxHeight, "px"),
-        paddingRight: "".concat(this.scrollPadding, "px")
-      },
-      "ref": "content",
-      "attrs": {
-        "tabindex": "0"
-      }
-    }, [this.$slots.default])])])])])]), h("div", {
-      "attrs": {
-        "tabIndex": opened ? '0' : undefined
-      }
-    })])]);
-  }
-
-};
-
-export default CdrModal;

package/dist/lib/src/components/modal/styles/CdrModal.mjs

@@ -1,3 +0,0 @@
-var modules_11cadc74 = {"cdr-modal":"cdr-modal_11-0-1","cdr-modal__overlay":"cdr-modal__overlay_11-0-1","cdr-modal__outerWrap":"cdr-modal__outerWrap_11-0-1","cdr-modal__contentWrap":"cdr-modal__contentWrap_11-0-1","cdr-modal__innerWrap":"cdr-modal__innerWrap_11-0-1","cdr-modal__dialog":"cdr-modal__dialog_11-0-1","cdr-modal__content":"cdr-modal__content_11-0-1","cdr-modal__header":"cdr-modal__header_11-0-1","cdr-modal__title":"cdr-modal__title_11-0-1","cdr-modal__close-button":"cdr-modal__close-button_11-0-1","cdr-modal__text":"cdr-modal__text_11-0-1","cdr-modal__text-content":"cdr-modal__text-content_11-0-1","closed":"closed_11-0-1","cdr-modal__noscroll":"cdr-modal__noscroll_11-0-1"};
-
-export default modules_11cadc74;