@rei/cedar 11.0.0-alpha.0

package/dist/lib/src/components/tooltip/CdrTooltip.mjs

@@ -0,0 +1,126 @@
+import clsx from 'clsx';
+import modules_b81b4c73 from './styles/CdrTooltip.mjs';
+import CdrPopup from '../popup/CdrPopup.mjs';
+import validateProp from '../../utils/propValidator.mjs';
+
+var CdrTooltip = {
+  name: 'CdrTooltip',
+  components: {
+    CdrPopup
+  },
+  props: {
+    position: {
+      type: String,
+      required: false,
+      default: 'top',
+      validator: function validator(value) {
+        return validateProp(value, ['top', 'bottom', 'left', 'right']);
+      }
+    },
+    autoPosition: {
+      type: Boolean,
+      default: true
+    },
+    id: {
+      type: String,
+      required: true
+    },
+    contentClass: {
+      type: String,
+      required: false
+    },
+    open: {
+      type: Boolean,
+      default: false,
+      required: false
+    }
+  },
+
+  data() {
+    return {
+      style: modules_b81b4c73,
+      isOpen: false,
+      openHandler: undefined,
+      closeHandler: undefined,
+      timeout: undefined
+    };
+  },
+
+  watch: {
+    open() {
+      if (this.open) {
+        this.openTooltip();
+      } else {
+        this.closeTooltip();
+      }
+    }
+
+  },
+
+  mounted() {
+    this.addHandlers();
+    var trigger = this.$refs.trigger.children[0];
+    if (trigger) trigger.setAttribute('aria-describedby', this.id);
+  },
+
+  methods: {
+    openTooltip(e) {
+      if (this.timeout) clearTimeout(this.timeout);
+      this.isOpen = true;
+      this.$emit('opened', e);
+    },
+
+    closeTooltip(e) {
+      var _this = this;
+
+      this.timeout = setTimeout(function () {
+        _this.isOpen = false;
+
+        _this.$emit('closed', e);
+      }, 250);
+    },
+
+    addHandlers() {
+      this.openHandler = this.openTooltip.bind(this);
+      this.closeHandler = this.closeTooltip.bind(this);
+      var triggerElement = this.$refs.trigger.children[0];
+      var popupElement = this.$refs.popup.$el;
+
+      if (triggerElement) {
+        triggerElement.addEventListener('mouseover', this.openHandler);
+        triggerElement.addEventListener('focus', this.openHandler);
+        triggerElement.addEventListener('mouseleave', this.closeHandler);
+        triggerElement.addEventListener('blur', this.closeHandler);
+        popupElement.addEventListener('mouseover', this.openHandler);
+        popupElement.addEventListener('mouseleave', this.closeHandler);
+      }
+    }
+
+  },
+
+  render() {
+    var h = arguments[0];
+    return h("div", {
+      "class": clsx(this.style['cdr-tooltip--wrapper'], this.$slots.trigger ? this.style['cdr-tooltip--position'] : '')
+    }, [h("div", {
+      "ref": "trigger"
+    }, [this.$slots.trigger]), h("cdr-popup", {
+      "class": this.style['cdr-tooltip'],
+      "attrs": {
+        "contentClass": this.contentClass,
+        "role": "tooltip",
+        "position": this.position,
+        "autoPosition": this.autoPosition,
+        "opened": this.isOpen,
+        "id": this.id
+      },
+      "ref": "popup",
+      "on": {
+        "closed": this.closeTooltip
+      }
+    }, [this.$slots.default])]);
+  }
+
+};
+
+export default CdrTooltip;

package/dist/lib/src/components/tooltip/styles/CdrTooltip.mjs

@@ -0,0 +1,3 @@
+var modules_b81b4c73 = {"cdr-tooltip--position":"cdr-tooltip--position_11-0-0-alpha-0","cdr-tooltip--wrapper":"cdr-tooltip--wrapper_11-0-0-alpha-0","cdr-popup--closed":"cdr-popup--closed_11-0-0-alpha-0","cdr-popup__content":"cdr-popup__content_11-0-0-alpha-0","cdr-popup--bottom":"cdr-popup--bottom_11-0-0-alpha-0","cdr-popup__arrow":"cdr-popup__arrow_11-0-0-alpha-0","cdr-popup--top":"cdr-popup--top_11-0-0-alpha-0","cdr-popup--right":"cdr-popup--right_11-0-0-alpha-0","cdr-popup--left":"cdr-popup--left_11-0-0-alpha-0"};
+
+export default modules_b81b4c73;

package/dist/lib/src/index.mjs

@@ -0,0 +1,211 @@
+export { default as CdrAccordion } from './components/accordion/CdrAccordion.mjs';
+export { default as CdrAccordionGroup } from './components/accordion/CdrAccordionGroup.mjs';
+export { default as CdrBanner } from './components/banner/CdrBanner.mjs';
+export { default as CdrBreadcrumb } from './components/breadcrumb/CdrBreadcrumb.mjs';
+export { default as CdrButton } from './components/button/CdrButton.mjs';
+export { default as CdrCaption } from './components/caption/CdrCaption.mjs';
+export { default as CdrCard } from './components/card/CdrCard.mjs';
+export { default as CdrCheckbox } from './components/checkbox/CdrCheckbox.mjs';
+export { default as CdrChip } from './components/chip/CdrChip.mjs';
+export { default as CdrChipGroup } from './components/chip/CdrChipGroup.mjs';
+export { default as CdrCol } from './components/flex-grid/CdrCol.mjs';
+export { default as CdrContainer } from './components/container/CdrContainer.mjs';
+export { default as CdrFormGroup } from './components/formGroup/CdrFormGroup.mjs';
+export { default as CdrGrid } from './components/grid/CdrGrid.mjs';
+export { default as CdrIcon } from './components/icon/CdrIcon.mjs';
+export { default as CdrImg } from './components/image/CdrImg.mjs';
+export { default as CdrInput } from './components/input/CdrInput.mjs';
+export { default as CdrLink } from './components/link/CdrLink.mjs';
+export { default as CdrList } from './components/list/CdrList.mjs';
+export { default as CdrModal } from './components/modal/CdrModal.mjs';
+export { default as CdrPagination } from './components/pagination/CdrPagination.mjs';
+export { default as CdrPopover } from './components/popover/CdrPopover.mjs';
+export { default as CdrQuote } from './components/quote/CdrQuote.mjs';
+export { default as CdrRadio } from './components/radio/CdrRadio.mjs';
+export { default as CdrRating } from './components/rating/CdrRating.mjs';
+export { default as CdrRow } from './components/flex-grid/CdrRow.mjs';
+export { default as CdrSelect } from './components/select/CdrSelect.mjs';
+export { default as CdrTable } from './components/table/CdrTable.mjs';
+export { default as CdrTabPanel } from './components/tabs/CdrTabPanel.mjs';
+export { default as CdrTabs } from './components/tabs/CdrTabs.mjs';
+export { default as CdrText } from './components/text/CdrText.mjs';
+export { default as CdrToast } from './components/toast/CdrToast.mjs';
+export { default as CdrTooltip } from './components/tooltip/CdrTooltip.mjs';
+export { default as IconAccountProfileFill } from './components/icon/comps/account-profile-fill.mjs';
+export { default as IconAccountProfile } from './components/icon/comps/account-profile.mjs';
+export { default as IconArrowDown } from './components/icon/comps/arrow-down.mjs';
+export { default as IconArrowLeft } from './components/icon/comps/arrow-left.mjs';
+export { default as IconArrowRight } from './components/icon/comps/arrow-right.mjs';
+export { default as IconArrowUp } from './components/icon/comps/arrow-up.mjs';
+export { default as IconAtv } from './components/icon/comps/atv.mjs';
+export { default as IconBedOutline } from './components/icon/comps/bed-outline.mjs';
+export { default as IconBikeShop } from './components/icon/comps/bike-shop.mjs';
+export { default as IconBinoculars } from './components/icon/comps/binoculars.mjs';
+export { default as IconBirding } from './components/icon/comps/birding.mjs';
+export { default as IconBoat } from './components/icon/comps/boat.mjs';
+export { default as IconBoating } from './components/icon/comps/boating.mjs';
+export { default as IconBookmarkFill } from './components/icon/comps/bookmark-fill.mjs';
+export { default as IconBookmarkStroke } from './components/icon/comps/bookmark-stroke.mjs';
+export { default as IconBrandAbstract } from './components/icon/comps/brand-abstract.mjs';
+export { default as IconBrandCodeSandbox } from './components/icon/comps/brand-code-sandbox.mjs';
+export { default as IconBrandGithub } from './components/icon/comps/brand-github.mjs';
+export { default as IconBrandLinkedin } from './components/icon/comps/brand-linkedin.mjs';
+export { default as IconBrandReiIceAxes } from './components/icon/comps/brand-rei-ice-axes.mjs';
+export { default as IconBrandSketch } from './components/icon/comps/brand-sketch.mjs';
+export { default as IconBuddies } from './components/icon/comps/buddies.mjs';
+export { default as IconBus } from './components/icon/comps/bus.mjs';
+export { default as IconCalendar } from './components/icon/comps/calendar.mjs';
+export { default as IconCamera } from './components/icon/comps/camera.mjs';
+export { default as IconCanoe } from './components/icon/comps/canoe.mjs';
+export { default as IconCar } from './components/icon/comps/car.mjs';
+export { default as IconCaretDown } from './components/icon/comps/caret-down.mjs';
+export { default as IconCaretLeft } from './components/icon/comps/caret-left.mjs';
+export { default as IconCaretRight } from './components/icon/comps/caret-right.mjs';
+export { default as IconCaretUp } from './components/icon/comps/caret-up.mjs';
+export { default as IconCartFill } from './components/icon/comps/cart-fill.mjs';
+export { default as IconCart } from './components/icon/comps/cart.mjs';
+export { default as IconChainLink } from './components/icon/comps/chain-link.mjs';
+export { default as IconChat } from './components/icon/comps/chat.mjs';
+export { default as IconCheckFill } from './components/icon/comps/check-fill.mjs';
+export { default as IconCheckLg } from './components/icon/comps/check-lg.mjs';
+export { default as IconCheckSm } from './components/icon/comps/check-sm.mjs';
+export { default as IconCheckStroke } from './components/icon/comps/check-stroke.mjs';
+export { default as IconClimb } from './components/icon/comps/climb.mjs';
+export { default as IconClipboard } from './components/icon/comps/clipboard.mjs';
+export { default as IconClock } from './components/icon/comps/clock.mjs';
+export { default as IconCodeHtml } from './components/icon/comps/code-html.mjs';
+export { default as IconCodeJs } from './components/icon/comps/code-js.mjs';
+export { default as IconCompass } from './components/icon/comps/compass.mjs';
+export { default as IconCopy } from './components/icon/comps/copy.mjs';
+export { default as IconCouponFill } from './components/icon/comps/coupon-fill.mjs';
+export { default as IconCouponStroke } from './components/icon/comps/coupon-stroke.mjs';
+export { default as IconCreditCard } from './components/icon/comps/credit-card.mjs';
+export { default as IconCurbsidePickup } from './components/icon/comps/curbside-pickup.mjs';
+export { default as IconDay } from './components/icon/comps/day.mjs';
+export { default as IconDiving } from './components/icon/comps/diving.mjs';
+export { default as IconDog } from './components/icon/comps/dog.mjs';
+export { default as IconDownload } from './components/icon/comps/download.mjs';
+export { default as IconEdit } from './components/icon/comps/edit.mjs';
+export { default as IconElevation } from './components/icon/comps/elevation.mjs';
+export { default as IconErrorFill } from './components/icon/comps/error-fill.mjs';
+export { default as IconErrorStroke } from './components/icon/comps/error-stroke.mjs';
+export { default as IconExpand } from './components/icon/comps/expand.mjs';
+export { default as IconExperiencesBackpacking } from './components/icon/comps/experiences-backpacking.mjs';
+export { default as IconExperiencesCamping } from './components/icon/comps/experiences-camping.mjs';
+export { default as IconExperiencesClimbing } from './components/icon/comps/experiences-climbing.mjs';
+export { default as IconExperiencesClothing } from './components/icon/comps/experiences-clothing.mjs';
+export { default as IconExperiencesCycling } from './components/icon/comps/experiences-cycling.mjs';
+export { default as IconExperiencesFamily } from './components/icon/comps/experiences-family.mjs';
+export { default as IconExperiencesFitness } from './components/icon/comps/experiences-fitness.mjs';
+export { default as IconExperiencesHiking } from './components/icon/comps/experiences-hiking.mjs';
+export { default as IconExperiencesOutdoorBasics } from './components/icon/comps/experiences-outdoor-basics.mjs';
+export { default as IconExperiencesPaddling } from './components/icon/comps/experiences-paddling.mjs';
+export { default as IconExperiencesRentals } from './components/icon/comps/experiences-rentals.mjs';
+export { default as IconExperiencesSnowsports } from './components/icon/comps/experiences-snowsports.mjs';
+export { default as IconExperiencesTravel } from './components/icon/comps/experiences-travel.mjs';
+export { default as IconExternalLink } from './components/icon/comps/external-link.mjs';
+export { default as IconEyeHide } from './components/icon/comps/eye-hide.mjs';
+export { default as IconEyeShow } from './components/icon/comps/eye-show.mjs';
+export { default as IconFacebook } from './components/icon/comps/facebook.mjs';
+export { default as IconFilterAlt } from './components/icon/comps/filter-alt.mjs';
+export { default as IconFilter } from './components/icon/comps/filter.mjs';
+export { default as IconFindLocation } from './components/icon/comps/find-location.mjs';
+export { default as IconFire } from './components/icon/comps/fire.mjs';
+export { default as IconFishing } from './components/icon/comps/fishing.mjs';
+export { default as IconFreeProduct } from './components/icon/comps/free-product.mjs';
+export { default as IconGridView } from './components/icon/comps/grid-view.mjs';
+export { default as IconHeartFill } from './components/icon/comps/heart-fill.mjs';
+export { default as IconHeartStroke } from './components/icon/comps/heart-stroke.mjs';
+export { default as IconHike } from './components/icon/comps/hike.mjs';
+export { default as IconHistory } from './components/icon/comps/history.mjs';
+export { default as IconHome } from './components/icon/comps/home.mjs';
+export { default as IconHorse } from './components/icon/comps/horse.mjs';
+export { default as IconHorseshoe } from './components/icon/comps/horseshoe.mjs';
+export { default as IconImage } from './components/icon/comps/image.mjs';
+export { default as IconInformationFill } from './components/icon/comps/information-fill.mjs';
+export { default as IconInformationStroke } from './components/icon/comps/information-stroke.mjs';
+export { default as IconInstagram } from './components/icon/comps/instagram.mjs';
+export { default as IconKayak } from './components/icon/comps/kayak.mjs';
+export { default as IconListRagged } from './components/icon/comps/list-ragged.mjs';
+export { default as IconListView } from './components/icon/comps/list-view.mjs';
+export { default as IconLocationPinFill } from './components/icon/comps/location-pin-fill.mjs';
+export { default as IconLocationPinStroke } from './components/icon/comps/location-pin-stroke.mjs';
+export { default as IconLockLockedFill } from './components/icon/comps/lock-locked-fill.mjs';
+export { default as IconLockLockedStroke } from './components/icon/comps/lock-locked-stroke.mjs';
+export { default as IconLockUnlockedStroke } from './components/icon/comps/lock-unlocked-stroke.mjs';
+export { default as IconMail } from './components/icon/comps/mail.mjs';
+export { default as IconMap } from './components/icon/comps/map.mjs';
+export { default as IconMemberCard } from './components/icon/comps/member-card.mjs';
+export { default as IconMicrophone } from './components/icon/comps/microphone.mjs';
+export { default as IconMinusFill } from './components/icon/comps/minus-fill.mjs';
+export { default as IconMinusLg } from './components/icon/comps/minus-lg.mjs';
+export { default as IconMinusSm } from './components/icon/comps/minus-sm.mjs';
+export { default as IconMinusStroke } from './components/icon/comps/minus-stroke.mjs';
+export { default as IconMoreFunctions } from './components/icon/comps/more-functions.mjs';
+export { default as IconMyLocation } from './components/icon/comps/my-location.mjs';
+export { default as IconNavigationMenu } from './components/icon/comps/navigation-menu.mjs';
+export { default as IconNight } from './components/icon/comps/night.mjs';
+export { default as IconPaddle } from './components/icon/comps/paddle.mjs';
+export { default as IconPauseFill } from './components/icon/comps/pause-fill.mjs';
+export { default as IconPauseStroke } from './components/icon/comps/pause-stroke.mjs';
+export { default as IconPause } from './components/icon/comps/pause.mjs';
+export { default as IconPhotography } from './components/icon/comps/photography.mjs';
+export { default as IconPicnic } from './components/icon/comps/picnic.mjs';
+export { default as IconPinterest } from './components/icon/comps/pinterest.mjs';
+export { default as IconPlane } from './components/icon/comps/plane.mjs';
+export { default as IconPlayFill } from './components/icon/comps/play-fill.mjs';
+export { default as IconPlayStroke } from './components/icon/comps/play-stroke.mjs';
+export { default as IconPlay } from './components/icon/comps/play.mjs';
+export { default as IconPlayground } from './components/icon/comps/playground.mjs';
+export { default as IconPlugin } from './components/icon/comps/plugin.mjs';
+export { default as IconPlusFill } from './components/icon/comps/plus-fill.mjs';
+export { default as IconPlusLg } from './components/icon/comps/plus-lg.mjs';
+export { default as IconPlusSm } from './components/icon/comps/plus-sm.mjs';
+export { default as IconPlusStroke } from './components/icon/comps/plus-stroke.mjs';
+export { default as IconPrint } from './components/icon/comps/print.mjs';
+export { default as IconProtectionFill } from './components/icon/comps/protection-fill.mjs';
+export { default as IconProtectionStroke } from './components/icon/comps/protection-stroke.mjs';
+export { default as IconQuestionFill } from './components/icon/comps/question-fill.mjs';
+export { default as IconQuestionStroke } from './components/icon/comps/question-stroke.mjs';
+export { default as IconRefresh } from './components/icon/comps/refresh.mjs';
+export { default as IconReload } from './components/icon/comps/reload.mjs';
+export { default as IconReturns } from './components/icon/comps/returns.mjs';
+export { default as IconRun } from './components/icon/comps/run.mjs';
+export { default as IconScanBarcode } from './components/icon/comps/scan-barcode.mjs';
+export { default as IconSearch } from './components/icon/comps/search.mjs';
+export { default as IconServiceShop } from './components/icon/comps/service-shop.mjs';
+export { default as IconShipping } from './components/icon/comps/shipping.mjs';
+export { default as IconShoppingBagFill } from './components/icon/comps/shopping-bag-fill.mjs';
+export { default as IconShoppingBag } from './components/icon/comps/shopping-bag.mjs';
+export { default as IconShrink } from './components/icon/comps/shrink.mjs';
+export { default as IconSizeChart } from './components/icon/comps/size-chart.mjs';
+export { default as IconSkiBoot } from './components/icon/comps/ski-boot.mjs';
+export { default as IconSki } from './components/icon/comps/ski.mjs';
+export { default as IconSnowShop } from './components/icon/comps/snow-shop.mjs';
+export { default as IconSnow } from './components/icon/comps/snow.mjs';
+export { default as IconSort } from './components/icon/comps/sort.mjs';
+export { default as IconStar100 } from './components/icon/comps/star-100.mjs';
+export { default as IconStar25 } from './components/icon/comps/star-25.mjs';
+export { default as IconStar50 } from './components/icon/comps/star-50.mjs';
+export { default as IconStar75 } from './components/icon/comps/star-75.mjs';
+export { default as IconStarStroke } from './components/icon/comps/star-stroke.mjs';
+export { default as IconStorefront } from './components/icon/comps/storefront.mjs';
+export { default as IconSwim } from './components/icon/comps/swim.mjs';
+export { default as IconTelephone } from './components/icon/comps/telephone.mjs';
+export { default as IconTent } from './components/icon/comps/tent.mjs';
+export { default as IconTrash } from './components/icon/comps/trash.mjs';
+export { default as IconTwitter } from './components/icon/comps/twitter.mjs';
+export { default as IconUpload } from './components/icon/comps/upload.mjs';
+export { default as IconVerifiedPurchaser } from './components/icon/comps/verified-purchaser.mjs';
+export { default as IconVirtualOutfitting } from './components/icon/comps/virtual-outfitting.mjs';
+export { default as IconWarningFill } from './components/icon/comps/warning-fill.mjs';
+export { default as IconWarningStroke } from './components/icon/comps/warning-stroke.mjs';
+export { default as IconWater } from './components/icon/comps/water.mjs';
+export { default as IconWilderness } from './components/icon/comps/wilderness.mjs';
+export { default as IconXFill } from './components/icon/comps/x-fill.mjs';
+export { default as IconXLg } from './components/icon/comps/x-lg.mjs';
+export { default as IconXSm } from './components/icon/comps/x-sm.mjs';
+export { default as IconXStroke } from './components/icon/comps/x-stroke.mjs';
+export { default as IconYoutube } from './components/icon/comps/youtube.mjs';
+export { default as IconZoomIn } from './components/icon/comps/zoom-in.mjs';
+export { default as IconZoomOut } from './components/icon/comps/zoom-out.mjs';

package/dist/lib/src/mixins/breakpoints.mjs

@@ -0,0 +1,26 @@
+import { CdrBreakpointSm, CdrBreakpointMd, CdrBreakpointLg } from '../../node_modules/@rei/cdr-tokens/dist/js/cdr-tokens.esm.mjs';
+
+var breakpoints = {
+  methods: {
+    getCurrentBreakpoint() {
+      var screenWidth = window && window.innerWidth || 0;
+
+      if (screenWidth >= CdrBreakpointSm && screenWidth < CdrBreakpointMd) {
+        return 'sm';
+      }
+
+      if (screenWidth >= CdrBreakpointMd && screenWidth < CdrBreakpointLg) {
+        return 'md';
+      }
+
+      if (screenWidth >= CdrBreakpointLg) {
+        return 'lg';
+      }
+
+      return 'xs';
+    }
+
+  }
+};
+
+export default breakpoints;

package/dist/lib/src/mixins/buildClass.mjs

@@ -0,0 +1,97 @@
+import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
+import _mapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/map';
+import _concatInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/concat';
+
+/**
+ * @mixin
+ */
+var BuildClass = {
+  methods: {
+    /**
+     *
+     * @param {String} prop -- the prop to build classes from
+     */
+    buildClass(prop) {
+      var _context,
+          _this = this;
+
+      var propNamePrefix = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+      var checkBase = 'cdr';
+
+      if (this.baseClass) {
+        checkBase = this.baseClass;
+      }
+
+      var base = checkBase;
+      var propArgsArr = this[prop] ? _filterInstanceProperty(_context = this[prop].split(' ')).call(_context, function (x) {
+        return x;
+      }) : [];
+      var builtClasses = [];
+
+      if (propNamePrefix) {
+        /*
+          prefix class names with prop name
+        */
+        propArgsArr = _mapInstanceProperty(propArgsArr).call(propArgsArr, function (mod) {
+          var _context2;
+
+          return _concatInstanceProperty(_context2 = "".concat(prop)).call(_context2, mod);
+        });
+      }
+
+      builtClasses = _concatInstanceProperty(builtClasses).call(builtClasses, _mapInstanceProperty(propArgsArr).call(propArgsArr, function (mod) {
+        return _this.modifyClassName(base, mod);
+      }));
+      return builtClasses.join(' ');
+    },
+
+    /**
+     * Returns a css module class
+     */
+    moduleClass(className) {
+      return this.style["".concat(className)];
+    },
+
+    /**
+     * Returns a modified base class
+     */
+    modifyClassName(base, modifier) {
+      var _context3, _context4;
+
+      return this.style ? this.moduleClass(_concatInstanceProperty(_context3 = "".concat(base, "--")).call(_context3, modifier)) : _concatInstanceProperty(_context4 = "".concat(base, "--")).call(_context4, modifier);
+    },
+
+    /**
+     * supports pattern to have props that are boolean or breakpoint strings
+     *
+     * @param {String} base
+     * @param {String} modifier
+     * @param {String|Boolean} propVal
+     *
+     * given these conditions:
+     * base is 'cdr-table'
+     * modifier is 'full-width'
+     * prop would be full-width="@sm @lg"
+     *
+     * This takes that and returns classes of "cdr-table--full-width@sm cdr-table--full-width@lg"
+     */
+    responsiveModifyClass(base, modifier, propVal) {
+      var _this2 = this;
+
+      if (typeof propVal === 'string') {
+        var _context5;
+
+        return _mapInstanceProperty(_context5 = propVal.split(' ')).call(_context5, function (bp) {
+          var _context6;
+
+          return _this2.modifyClassName(base, _concatInstanceProperty(_context6 = "".concat(modifier)).call(_context6, bp));
+        }).join(' ');
+      }
+
+      return this.modifyClassName(base, modifier);
+    }
+
+  }
+};
+
+export default BuildClass;

package/dist/lib/src/mixins/fullWidth.mjs

@@ -0,0 +1,47 @@
+import validateProp from '../utils/propValidator.mjs';
+import BuildClass from './buildClass.mjs';
+
+/**
+ * #fullWidth Mixin/Interface
+ *
+ * Functionality for handling/standardizing full-width components.
+ *
+ *  :Values
+ *    :@xs
+ *    :x@sm
+ *    :@md
+ *    :@lg
+ *
+ * @mixin
+ */
+var fullWidth = {
+  mixins: [BuildClass],
+  props: {
+    /**
+     * fullWidth state
+     */
+    fullWidth: {
+      type: [String, Boolean],
+      default: false,
+      validator: function validator(value) {
+        if (typeof value === 'string') {
+          return validateProp(value, ['@xs', '@sm', '@md', '@lg'], false);
+        }
+
+        return typeof value === 'boolean';
+      }
+    }
+  },
+  computed: {
+    fullWidthClass() {
+      if (typeof this.fullWidth === 'boolean') {
+        return this.fullWidth && !this.iconOnly ? this.modifyClassName(this.baseClass, 'full-width') : null;
+      }
+
+      return this.buildClass('fullWidth', true);
+    }
+
+  }
+};
+
+export default fullWidth;

package/dist/lib/src/mixins/modifier.mjs

@@ -0,0 +1,22 @@
+import BuildClass from './buildClass.mjs';
+
+/**
+ * @mixin
+ */
+var modifier = {
+  mixins: [BuildClass],
+  props: {
+    /**
+     * Space separated list of modifiers. See above for possible values
+     */
+    modifier: String
+  },
+  computed: {
+    modifierClass() {
+      return this.buildClass('modifier');
+    }
+
+  }
+};
+
+export default modifier;

package/dist/lib/src/mixins/size.mjs

@@ -0,0 +1,39 @@
+import validateProp from '../utils/propValidator.mjs';
+import BuildClass from './buildClass.mjs';
+
+/**
+ * #Size Mixin/Interface
+ *
+ * Functionality for handling/standardizing component sizing.
+ *
+ *  :Values
+ *    :small
+ *    :medium (default)
+ *    :large
+ *
+ * @mixin
+ */
+var size = {
+  mixins: [BuildClass],
+  props: {
+    /**
+     * Size state
+     */
+    size: {
+      type: String,
+      default: 'medium',
+      validator: function validator(value) {
+        return validateProp(value, ['small', 'medium', 'large']);
+      }
+    }
+  },
+  computed: {
+    sizeClass() {
+      var returnClass = this.buildClass('size');
+      return returnClass;
+    }
+
+  }
+};
+
+export default size;

package/dist/lib/src/utils/propValidator.mjs

@@ -0,0 +1,27 @@
+/**
+ * Validates space separated string against an array of accepted values.
+ * @param {String} propValue -- Space separated string (provided by the user)
+ * @param {Array} validArr -- Array of values that are considered "valid"
+ * @param {Boolean} responsive -- Enables validation of validArr values with '@sm', '@md', '@lg' added to them
+ */
+function validateProp(propValue, validArr) {
+  var responsive = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+  var strArr = propValue.split(' ');
+  return strArr.every(function (mod) {
+    var modValid = validArr.some(function (validStr) {
+      if (responsive) {
+        return mod === validStr || mod === "".concat(validStr, "@xs") || mod === "".concat(validStr, "@sm") || mod === "".concat(validStr, "@md") || mod === "".concat(validStr, "@lg");
+      }
+
+      return mod === validStr;
+    });
+
+    if (!modValid) {
+      console.error("Invalid prop value: ".concat(mod)); // eslint-disable-line no-console
+    }
+
+    return modValid;
+  });
+}
+
+export default validateProp;

package/dist/style/cdr-accordion-group.css

@@ -0,0 +1 @@
+.cdr-accordion-group_11-0-0-alpha-0{display:block;list-style:none;padding:0;margin:0}.cdr-accordion-group_11-0-0-alpha-0 li+li>.cdr-accordion_11-0-0-alpha-0{border-top:none}

package/dist/style/cdr-accordion.css

@@ -0,0 +1 @@
+@import url("@rei/cedar/dist/style/cdr-icon.css");@import url("@rei/cedar/dist/style/cdr-accordion-group.css");.cdr-accordion_11-0-0-alpha-0{border-top:0.1rem solid #dcd6cb;border-bottom:0.1rem solid #dcd6cb;position:relative;z-index:1}.cdr-accordion_11-0-0-alpha-0+.cdr-accordion_11-0-0-alpha-0{border-top:none}.cdr-accordion__button_11-0-0-alpha-0{font-family:Graphik, "Helvetica Neue", sans-serif;font-style:normal;font-weight:600;letter-spacing:-0.008rem;font-size:1.6rem;line-height:2.2rem;background-color:transparent;border:none;color:rgba(12,11,8,0.75);cursor:pointer;display:flex;justify-content:space-between;padding:1.6rem;position:relative;text-align:left;width:100%;z-index:1}.cdr-accordion__button_11-0-0-alpha-0:hover,.cdr-accordion__button_11-0-0-alpha-0:focus{background-color:#f9f8f6}.cdr-accordion__label_11-0-0-alpha-0{margin-bottom:0}.cdr-accordion__header_11-0-0-alpha-0{margin:0;padding:0;font-weight:unset;font-style:unset;font-size:unset}.cdr-accordion__header--unwrapped_11-0-0-alpha-0{font-family:Graphik, "Helvetica Neue", sans-serif;font-style:normal;font-weight:500;letter-spacing:0;font-size:1.8rem;line-height:2.4rem;margin:1.6rem 0}.cdr-accordion__icon_11-0-0-alpha-0{margin-left:1.6rem;fill:#928b80;transition:transform .3s cubic-bezier(0.32, 0.94, 0.6, 1)}.cdr-accordion__icon_11-0-0-alpha-0.open{transform:rotate(-180deg)}.cdr-accordion__content-container_11-0-0-alpha-0{overflow:hidden;transition-duration:.3s;transition-property:max-height;transition-timing-function:cubic-bezier(0.15, 0, 0.15, 1)}.cdr-accordion__content-container_11-0-0-alpha-0.open{transition-duration:.3s}.cdr-accordion__content_11-0-0-alpha-0{font-family:Graphik, "Helvetica Neue", sans-serif;font-style:normal;font-weight:400;letter-spacing:0.008rem;font-size:1.6rem;line-height:2.6rem;background-color:transparent;color:rgba(12,11,8,0.75);padding:.8rem 1.6rem 1.6rem;transition:opacity .1s linear;opacity:0}.cdr-accordion__content_11-0-0-alpha-0>*{font-family:Graphik, "Helvetica Neue", sans-serif;font-style:normal;font-weight:400;letter-spacing:0.008rem;font-size:1.6rem;line-height:2.6rem}.cdr-accordion__content_11-0-0-alpha-0.open{opacity:1}.cdr-accordion__content_11-0-0-alpha-0.closed{visibility:hidden}.cdr-accordion--unwrap_11-0-0-alpha-0{padding:0}.cdr-accordion--border-aligned_11-0-0-alpha-0{margin:0 1.6rem}.cdr-accordion--border-aligned_11-0-0-alpha-0 .cdr-accordion__button_11-0-0-alpha-0{margin-left:-1.6rem;width:calc(100% + 3.2rem)}.cdr-accordion--border-aligned_11-0-0-alpha-0 .cdr-accordion__content_11-0-0-alpha-0{padding:.8rem 0 1.6rem}.cdr-accordion--compact_11-0-0-alpha-0 .cdr-accordion__button_11-0-0-alpha-0{font-family:Graphik, "Helvetica Neue", sans-serif;font-style:normal;font-weight:600;letter-spacing:-0.008rem;font-size:1.4rem;line-height:1.8rem;padding:1.2rem}.cdr-accordion--compact_11-0-0-alpha-0 .cdr-accordion__content_11-0-0-alpha-0{font-family:Graphik, "Helvetica Neue", sans-serif;font-style:normal;font-weight:400;letter-spacing:-0.016rem;font-size:1.4rem;line-height:1.8rem;padding:.4rem 1.2rem 1.2rem}.cdr-accordion--compact_11-0-0-alpha-0 .cdr-accordion__content_11-0-0-alpha-0>*{font-family:Graphik, "Helvetica Neue", sans-serif;font-style:normal;font-weight:400;letter-spacing:-0.016rem;font-size:1.4rem;line-height:1.8rem}.cdr-accordion--compact_11-0-0-alpha-0.cdr-accordion--border-aligned_11-0-0-alpha-0 .cdr-accordion__button_11-0-0-alpha-0{margin-left:-1.2rem;width:calc(100% + 2.4rem)}.cdr-accordion--compact_11-0-0-alpha-0.cdr-accordion--border-aligned_11-0-0-alpha-0 .cdr-accordion__content_11-0-0-alpha-0{padding:.4rem 0 1.2rem}.cdr-accordion--focused_11-0-0-alpha-0{z-index:10}

package/dist/style/cdr-banner.css

@@ -0,0 +1 @@
+.cdr-banner_11-0-0-alpha-0{position:relative;border-left:0.4rem solid;border-radius:.4rem;font-family:Graphik, "Helvetica Neue", sans-serif;font-style:normal;font-weight:400;letter-spacing:-0.016rem;font-size:1.6rem;line-height:2.2rem;display:grid;grid-template-columns:1fr 3.2rem;grid-template-areas:"main info-action" "message-body info-action"}.cdr-banner__wrapper_11-0-0-alpha-0{border-radius:.4rem}.cdr-banner__wrapper--prominence_11-0-0-alpha-0{box-shadow:0 0.2rem 0.2rem 0 rgba(12,11,8,0.2)}.cdr-banner__main_11-0-0-alpha-0{grid-area:main;display:grid;border-top-right-radius:.4rem;grid-template-columns:auto 1fr auto;grid-template-areas:"icon-left message icon-right"}.cdr-banner__main--info_11-0-0-alpha-0{background-color:#f1fcfd;border-top:0.1rem solid;border-right:0.1rem solid;border-bottom:0.1rem solid;border-color:#c2d8db}.cdr-banner__main--info_11-0-0-alpha-0 svg{fill:#408e86}.cdr-banner__main--warning_11-0-0-alpha-0{background-color:#fefcf1;border-top:0.1rem solid;border-right:0.1rem solid;border-bottom:0.1rem solid;border-color:#f5e9b7}.cdr-banner__main--warning_11-0-0-alpha-0 svg{fill:#b68b37}.cdr-banner__main--success_11-0-0-alpha-0{background-color:#f4fbf5;border-top:0.1rem solid;border-right:0.1rem solid;border-bottom:0.1rem solid;border-color:#d5e6cb}.cdr-banner__main--success_11-0-0-alpha-0 svg{fill:#3b8349}.cdr-banner__main--error_11-0-0-alpha-0{background-color:#fdf5f1;border-top:0.1rem solid;border-right:0.1rem solid;border-bottom:0.1rem solid;border-color:#eecbc1}.cdr-banner__main--error_11-0-0-alpha-0 svg{fill:#bb4045}.cdr-banner__main--default_11-0-0-alpha-0{background-color:#f9f8f6;border-top:0.1rem solid;border-right:0.1rem solid;border-bottom:0.1rem solid;border-color:#e8e0ce}.cdr-banner__main--default_11-0-0-alpha-0 svg{fill:#726d64}.cdr-banner__main--no-msg_11-0-0-alpha-0{border-bottom-right-radius:.4rem}.cdr-banner__icon-left_11-0-0-alpha-0{grid-area:icon-left;display:inherit;align-items:center;justify-items:center}.cdr-banner__icon-left_11-0-0-alpha-0 svg{width:3.2rem;stroke:white;stroke-width:0.4rem;paint-order:stroke fill;margin:.4rem}.cdr-banner__icon-left--info_11-0-0-alpha-0{background-color:#c2d8db}.cdr-banner__icon-left--warning_11-0-0-alpha-0{background-color:#f5e9b7}.cdr-banner__icon-left--success_11-0-0-alpha-0{background-color:#d5e6cb}.cdr-banner__icon-left--error_11-0-0-alpha-0{background-color:#eecbc1}.cdr-banner__icon-left--default_11-0-0-alpha-0{background-color:#e8e0ce}.cdr-banner__message_11-0-0-alpha-0{grid-area:message;padding:.8rem}.cdr-banner__message-body_11-0-0-alpha-0{grid-area:message-body;border-bottom-right-radius:.4rem;background-color:#fff;padding:.8rem}.cdr-banner__icon-right_11-0-0-alpha-0{grid-area:icon-right}.cdr-banner__icon-right_11-0-0-alpha-0 svg{fill:rgba(3,3,1,0.9) !important}.cdr-banner__info-action_11-0-0-alpha-0{grid-area:info-action}.cdr-banner__info-action_11-0-0-alpha-0 svg{fill:#406eb5 !important}.cdr-banner--default_11-0-0-alpha-0{border-left-color:#726d64}.cdr-banner--info_11-0-0-alpha-0{border-left-color:#408e86}.cdr-banner--warning_11-0-0-alpha-0{border-left-color:#b68b37}.cdr-banner--success_11-0-0-alpha-0{border-left-color:#3b8349}.cdr-banner--error_11-0-0-alpha-0{border-left-color:#bb4045}

package/dist/style/cdr-breadcrumb.css

@@ -0,0 +1 @@
+.cdr-breadcrumb_11-0-0-alpha-0{line-height:1}.cdr-breadcrumb__list_11-0-0-alpha-0{display:inline-flex;flex-wrap:wrap;padding:0;margin:0}.cdr-breadcrumb__item_11-0-0-alpha-0{display:inline-flex;flex:none;padding:0;color:rgba(66,59,47,0.75)}.cdr-breadcrumb__link_11-0-0-alpha-0{text-decoration:none;color:inherit}.cdr-breadcrumb__link_11-0-0-alpha-0:hover,.cdr-breadcrumb__link_11-0-0-alpha-0:active,.cdr-breadcrumb__link_11-0-0-alpha-0:focus{color:#406eb5}.cdr-breadcrumb__link_11-0-0-alpha-0:hover,.cdr-breadcrumb__link_11-0-0-alpha-0:active,.cdr-breadcrumb__link_11-0-0-alpha-0:focus{color:#406eb5;text-decoration:underline}.cdr-breadcrumb__delimiter_11-0-0-alpha-0{color:inherit;padding:0 .8rem}.cdr-breadcrumb__ellipses_11-0-0-alpha-0{font-family:inherit;font-size:inherit;line-height:inherit;border:none;background:none;background-color:transparent;cursor:pointer;display:inline-block;fill:inherit;padding:0}.cdr-breadcrumb__ellipses_11-0-0-alpha-0 .cdr-breadcrumb__ellipses-icon_11-0-0-alpha-0{color:rgba(66,59,47,0.75);border-bottom:0.1rem solid transparent;fill:inherit}.cdr-breadcrumb__ellipses_11-0-0-alpha-0:hover .cdr-breadcrumb__ellipses-icon_11-0-0-alpha-0,.cdr-breadcrumb__ellipses_11-0-0-alpha-0:active .cdr-breadcrumb__ellipses-icon_11-0-0-alpha-0,.cdr-breadcrumb__ellipses_11-0-0-alpha-0:focus .cdr-breadcrumb__ellipses-icon_11-0-0-alpha-0{color:#406eb5;text-decoration:underline}.cdr-breadcrumb__link_11-0-0-alpha-0,.cdr-breadcrumb__delimiter_11-0-0-alpha-0,.cdr-breadcrumb__ellipses_11-0-0-alpha-0{font-family:Graphik, "Helvetica Neue", sans-serif;font-style:normal;font-weight:400;letter-spacing:-0.008rem;font-size:1.2rem;line-height:1.6rem}@media (min-width: 992px){.cdr-breadcrumb__link_11-0-0-alpha-0,.cdr-breadcrumb__delimiter_11-0-0-alpha-0,.cdr-breadcrumb__ellipses_11-0-0-alpha-0{font-family:Graphik, "Helvetica Neue", sans-serif;font-style:normal;font-weight:400;letter-spacing:-0.016rem;font-size:1.4rem;line-height:1.8rem}}