@rei/cedar 11.0.1 → 13.0.0-alpha.kurt-test
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +28 -35
- package/dist/cedar-compiled.css +944 -1104
- package/dist/cedar.js +8727 -9237
- package/dist/cedar.mjs +8519 -7534
- package/dist/lib/_virtual/plugin-vue_export-helper.js +9 -0
- package/dist/lib/assets/{cedar-compiled-010f67b6.css → cedar-compiled-f3a569d4.css} +2475 -2635
- package/dist/lib/node_modules/@rei/cdr-tokens/dist/js/{cdr-tokens.esm.mjs → cdr-tokens.esm.js} +0 -0
- package/dist/lib/src/components/accordion/CdrAccordion.js +211 -0
- package/dist/lib/src/components/accordion/CdrAccordionGroup.js +112 -0
- package/dist/lib/src/components/banner/CdrBanner.js +91 -0
- package/dist/lib/src/components/breadcrumb/CdrBreadcrumb.js +140 -0
- package/dist/lib/src/components/button/CdrButton.js +124 -0
- package/dist/lib/src/components/caption/CdrCaption.js +40 -0
- package/dist/lib/src/components/card/CdrCard.js +32 -0
- package/dist/lib/src/components/checkbox/CdrCheckbox.js +118 -0
- package/dist/lib/src/components/chip/CdrChip.js +59 -0
- package/dist/lib/src/components/chip/CdrChipGroup.js +109 -0
- package/dist/lib/src/components/container/CdrContainer.js +49 -0
- package/dist/lib/src/components/formError/CdrFormError.js +40 -0
- package/dist/lib/src/components/formGroup/CdrFormGroup.js +99 -0
- package/dist/lib/src/components/grid/CdrGrid.js +54 -0
- package/dist/lib/src/components/icon/CdrIcon.js +67 -0
- package/dist/lib/src/components/icon/comps/account-profile-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/account-profile.js +35 -0
- package/dist/lib/src/components/icon/comps/arrow-down.js +35 -0
- package/dist/lib/src/components/icon/comps/arrow-left.js +35 -0
- package/dist/lib/src/components/icon/comps/arrow-right.js +35 -0
- package/dist/lib/src/components/icon/comps/arrow-up.js +35 -0
- package/dist/lib/src/components/icon/comps/atv.js +35 -0
- package/dist/lib/src/components/icon/comps/bed-outline.js +35 -0
- package/dist/lib/src/components/icon/comps/bike-shop.js +35 -0
- package/dist/lib/src/components/icon/comps/binoculars.js +35 -0
- package/dist/lib/src/components/icon/comps/birding.js +35 -0
- package/dist/lib/src/components/icon/comps/boat.js +35 -0
- package/dist/lib/src/components/icon/comps/boating.js +35 -0
- package/dist/lib/src/components/icon/comps/bookmark-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/bookmark-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/brand-abstract.js +35 -0
- package/dist/lib/src/components/icon/comps/brand-code-sandbox.js +35 -0
- package/dist/lib/src/components/icon/comps/brand-github.js +35 -0
- package/dist/lib/src/components/icon/comps/brand-linkedin.js +35 -0
- package/dist/lib/src/components/icon/comps/brand-rei-ice-axes.js +35 -0
- package/dist/lib/src/components/icon/comps/brand-sketch.js +35 -0
- package/dist/lib/src/components/icon/comps/buddies.js +35 -0
- package/dist/lib/src/components/icon/comps/bus.js +35 -0
- package/dist/lib/src/components/icon/comps/calendar.js +35 -0
- package/dist/lib/src/components/icon/comps/camera.js +35 -0
- package/dist/lib/src/components/icon/comps/canoe.js +35 -0
- package/dist/lib/src/components/icon/comps/car.js +35 -0
- package/dist/lib/src/components/icon/comps/caret-down.js +35 -0
- package/dist/lib/src/components/icon/comps/caret-left.js +35 -0
- package/dist/lib/src/components/icon/comps/caret-right.js +35 -0
- package/dist/lib/src/components/icon/comps/caret-up.js +35 -0
- package/dist/lib/src/components/icon/comps/cart-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/cart.js +35 -0
- package/dist/lib/src/components/icon/comps/chain-link.js +35 -0
- package/dist/lib/src/components/icon/comps/chat.js +35 -0
- package/dist/lib/src/components/icon/comps/check-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/check-lg.js +35 -0
- package/dist/lib/src/components/icon/comps/check-sm.js +35 -0
- package/dist/lib/src/components/icon/comps/check-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/climb.js +35 -0
- package/dist/lib/src/components/icon/comps/clipboard.js +35 -0
- package/dist/lib/src/components/icon/comps/clock.js +35 -0
- package/dist/lib/src/components/icon/comps/code-html.js +35 -0
- package/dist/lib/src/components/icon/comps/code-js.js +35 -0
- package/dist/lib/src/components/icon/comps/compass.js +35 -0
- package/dist/lib/src/components/icon/comps/copy.js +35 -0
- package/dist/lib/src/components/icon/comps/coupon-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/coupon-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/credit-card.js +35 -0
- package/dist/lib/src/components/icon/comps/curbside-pickup.js +35 -0
- package/dist/lib/src/components/icon/comps/day.js +35 -0
- package/dist/lib/src/components/icon/comps/diving.js +35 -0
- package/dist/lib/src/components/icon/comps/dog.js +35 -0
- package/dist/lib/src/components/icon/comps/download.js +35 -0
- package/dist/lib/src/components/icon/comps/edit.js +35 -0
- package/dist/lib/src/components/icon/comps/elevation.js +35 -0
- package/dist/lib/src/components/icon/comps/error-fill.js +37 -0
- package/dist/lib/src/components/icon/comps/error-stroke.js +42 -0
- package/dist/lib/src/components/icon/comps/expand.js +35 -0
- package/dist/lib/src/components/icon/comps/experiences-backpacking.js +35 -0
- package/dist/lib/src/components/icon/comps/experiences-camping.js +35 -0
- package/dist/lib/src/components/icon/comps/experiences-climbing.js +35 -0
- package/dist/lib/src/components/icon/comps/experiences-clothing.js +35 -0
- package/dist/lib/src/components/icon/comps/experiences-cycling.js +35 -0
- package/dist/lib/src/components/icon/comps/experiences-family.js +35 -0
- package/dist/lib/src/components/icon/comps/experiences-fitness.js +35 -0
- package/dist/lib/src/components/icon/comps/experiences-hiking.js +35 -0
- package/dist/lib/src/components/icon/comps/experiences-outdoor-basics.js +35 -0
- package/dist/lib/src/components/icon/comps/experiences-paddling.js +35 -0
- package/dist/lib/src/components/icon/comps/experiences-rentals.js +35 -0
- package/dist/lib/src/components/icon/comps/experiences-snowsports.js +35 -0
- package/dist/lib/src/components/icon/comps/experiences-travel.js +35 -0
- package/dist/lib/src/components/icon/comps/external-link.js +35 -0
- package/dist/lib/src/components/icon/comps/eye-hide.js +35 -0
- package/dist/lib/src/components/icon/comps/eye-show.js +35 -0
- package/dist/lib/src/components/icon/comps/facebook.js +35 -0
- package/dist/lib/src/components/icon/comps/filter-alt.js +35 -0
- package/dist/lib/src/components/icon/comps/filter.js +35 -0
- package/dist/lib/src/components/icon/comps/find-location.js +35 -0
- package/dist/lib/src/components/icon/comps/fire.js +35 -0
- package/dist/lib/src/components/icon/comps/fishing.js +35 -0
- package/dist/lib/src/components/icon/comps/free-product.js +35 -0
- package/dist/lib/src/components/icon/comps/grid-view.js +35 -0
- package/dist/lib/src/components/icon/comps/heart-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/heart-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/hike.js +35 -0
- package/dist/lib/src/components/icon/comps/history.js +35 -0
- package/dist/lib/src/components/icon/comps/home.js +35 -0
- package/dist/lib/src/components/icon/comps/horse.js +35 -0
- package/dist/lib/src/components/icon/comps/horseshoe.js +35 -0
- package/dist/lib/src/components/icon/comps/image.js +35 -0
- package/dist/lib/src/components/icon/comps/information-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/information-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/instagram.js +35 -0
- package/dist/lib/src/components/icon/comps/kayak.js +35 -0
- package/dist/lib/src/components/icon/comps/list-ragged.js +35 -0
- package/dist/lib/src/components/icon/comps/list-view.js +35 -0
- package/dist/lib/src/components/icon/comps/location-pin-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/location-pin-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/lock-locked-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/lock-locked-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/lock-unlocked-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/mail.js +35 -0
- package/dist/lib/src/components/icon/comps/map.js +35 -0
- package/dist/lib/src/components/icon/comps/member-card.js +35 -0
- package/dist/lib/src/components/icon/comps/microphone.js +35 -0
- package/dist/lib/src/components/icon/comps/minus-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/minus-lg.js +35 -0
- package/dist/lib/src/components/icon/comps/minus-sm.js +35 -0
- package/dist/lib/src/components/icon/comps/minus-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/more-functions.js +35 -0
- package/dist/lib/src/components/icon/comps/my-location.js +35 -0
- package/dist/lib/src/components/icon/comps/navigation-menu.js +35 -0
- package/dist/lib/src/components/icon/comps/night.js +35 -0
- package/dist/lib/src/components/icon/comps/paddle.js +35 -0
- package/dist/lib/src/components/icon/comps/pause-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/pause-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/pause.js +35 -0
- package/dist/lib/src/components/icon/comps/photography.js +35 -0
- package/dist/lib/src/components/icon/comps/picnic.js +35 -0
- package/dist/lib/src/components/icon/comps/pinterest.js +35 -0
- package/dist/lib/src/components/icon/comps/plane.js +35 -0
- package/dist/lib/src/components/icon/comps/play-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/play-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/play.js +35 -0
- package/dist/lib/src/components/icon/comps/playground.js +35 -0
- package/dist/lib/src/components/icon/comps/plugin.js +35 -0
- package/dist/lib/src/components/icon/comps/plus-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/plus-lg.js +35 -0
- package/dist/lib/src/components/icon/comps/plus-sm.js +35 -0
- package/dist/lib/src/components/icon/comps/plus-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/print.js +35 -0
- package/dist/lib/src/components/icon/comps/protection-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/protection-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/question-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/question-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/refresh.js +35 -0
- package/dist/lib/src/components/icon/comps/reload.js +35 -0
- package/dist/lib/src/components/icon/comps/returns.js +35 -0
- package/dist/lib/src/components/icon/comps/run.js +35 -0
- package/dist/lib/src/components/icon/comps/scan-barcode.js +35 -0
- package/dist/lib/src/components/icon/comps/search.js +35 -0
- package/dist/lib/src/components/icon/comps/service-shop.js +35 -0
- package/dist/lib/src/components/icon/comps/shipping.js +35 -0
- package/dist/lib/src/components/icon/comps/shopping-bag-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/shopping-bag.js +35 -0
- package/dist/lib/src/components/icon/comps/shrink.js +35 -0
- package/dist/lib/src/components/icon/comps/size-chart.js +35 -0
- package/dist/lib/src/components/icon/comps/ski-boot.js +35 -0
- package/dist/lib/src/components/icon/comps/ski.js +35 -0
- package/dist/lib/src/components/icon/comps/snow-shop.js +35 -0
- package/dist/lib/src/components/icon/comps/snow.js +35 -0
- package/dist/lib/src/components/icon/comps/sort.js +35 -0
- package/dist/lib/src/components/icon/comps/star-100.js +35 -0
- package/dist/lib/src/components/icon/comps/star-25.js +35 -0
- package/dist/lib/src/components/icon/comps/star-50.js +35 -0
- package/dist/lib/src/components/icon/comps/star-75.js +35 -0
- package/dist/lib/src/components/icon/comps/star-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/storefront.js +35 -0
- package/dist/lib/src/components/icon/comps/swim.js +35 -0
- package/dist/lib/src/components/icon/comps/telephone.js +35 -0
- package/dist/lib/src/components/icon/comps/tent.js +35 -0
- package/dist/lib/src/components/icon/comps/trash.js +35 -0
- package/dist/lib/src/components/icon/comps/twitter.js +35 -0
- package/dist/lib/src/components/icon/comps/upload.js +35 -0
- package/dist/lib/src/components/icon/comps/verified-purchaser.js +35 -0
- package/dist/lib/src/components/icon/comps/virtual-outfitting.js +35 -0
- package/dist/lib/src/components/icon/comps/warning-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/warning-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/water.js +35 -0
- package/dist/lib/src/components/icon/comps/wilderness.js +35 -0
- package/dist/lib/src/components/icon/comps/x-fill.js +35 -0
- package/dist/lib/src/components/icon/comps/x-lg.js +35 -0
- package/dist/lib/src/components/icon/comps/x-sm.js +35 -0
- package/dist/lib/src/components/icon/comps/x-stroke.js +35 -0
- package/dist/lib/src/components/icon/comps/youtube.js +35 -0
- package/dist/lib/src/components/icon/comps/zoom-in.js +35 -0
- package/dist/lib/src/components/icon/comps/zoom-out.js +35 -0
- package/dist/lib/src/components/image/CdrImg.js +148 -0
- package/dist/lib/src/components/input/CdrInput.js +305 -0
- package/dist/lib/src/components/labelStandalone/CdrLabelStandalone.js +116 -0
- package/dist/lib/src/components/labelWrapper/CdrLabelWrapper.js +60 -0
- package/dist/lib/src/components/link/CdrLink.js +71 -0
- package/dist/lib/src/components/list/CdrList.js +46 -0
- package/dist/lib/src/components/modal/CdrModal.js +383 -0
- package/dist/lib/src/components/modal/{onTransitionEnd.mjs → onTransitionEnd.js} +15 -13
- package/dist/lib/src/components/pagination/CdrPagination.js +315 -0
- package/dist/lib/src/components/popover/CdrPopover.js +183 -0
- package/dist/lib/src/components/popup/CdrPopup.js +188 -0
- package/dist/lib/src/components/popup/calculatePlacement.js +88 -0
- package/dist/lib/src/components/quote/CdrQuote.js +64 -0
- package/dist/lib/src/components/radio/CdrRadio.js +110 -0
- package/dist/lib/src/components/rating/CdrRating.js +184 -0
- package/dist/lib/src/components/select/CdrSelect.js +277 -0
- package/dist/lib/src/components/table/CdrTable.js +84 -0
- package/dist/lib/src/components/tabs/CdrTabPanel.js +117 -0
- package/dist/lib/src/components/tabs/CdrTabs.js +361 -0
- package/dist/lib/src/components/text/CdrText.js +31 -0
- package/dist/lib/src/components/toast/CdrToast.js +160 -0
- package/dist/lib/src/components/tooltip/CdrTooltip.js +129 -0
- package/dist/lib/src/{index.mjs → index.js} +209 -209
- package/dist/lib/src/mixins/breakpoints.js +21 -0
- package/dist/lib/src/props/background.js +11 -0
- package/dist/lib/src/props/size.js +11 -0
- package/dist/lib/src/utils/buildClass.js +90 -0
- package/dist/lib/src/utils/mapClasses.js +22 -0
- package/dist/lib/src/utils/{propValidator.mjs → propValidator.js} +6 -5
- package/dist/style/cedar-full.css +0 -1
- package/package.json +53 -38
- package/dist/lib/src/components/accordion/CdrAccordion.mjs +0 -198
- package/dist/lib/src/components/accordion/CdrAccordionGroup.mjs +0 -119
- package/dist/lib/src/components/accordion/styles/CdrAccordion.mjs +0 -3
- package/dist/lib/src/components/accordion/styles/CdrAccordionGroup.mjs +0 -3
- package/dist/lib/src/components/banner/CdrBanner.mjs +0 -61
- package/dist/lib/src/components/banner/styles/CdrBanner.mjs +0 -3
- package/dist/lib/src/components/breadcrumb/CdrBreadcrumb.mjs +0 -158
- package/dist/lib/src/components/breadcrumb/styles/CdrBreadcrumb.mjs +0 -3
- package/dist/lib/src/components/button/CdrButton.mjs +0 -118
- package/dist/lib/src/components/button/styles/CdrButton.mjs +0 -3
- package/dist/lib/src/components/caption/CdrCaption.mjs +0 -38
- package/dist/lib/src/components/caption/styles/CdrCaption.mjs +0 -3
- package/dist/lib/src/components/card/CdrCard.mjs +0 -35
- package/dist/lib/src/components/card/styles/CdrCard.mjs +0 -3
- package/dist/lib/src/components/checkbox/CdrCheckbox.mjs +0 -165
- package/dist/lib/src/components/checkbox/styles/CdrCheckbox.mjs +0 -3
- package/dist/lib/src/components/chip/CdrChip.mjs +0 -30
- package/dist/lib/src/components/chip/CdrChipGroup.mjs +0 -105
- package/dist/lib/src/components/chip/styles/CdrChip.mjs +0 -3
- package/dist/lib/src/components/chip/styles/CdrChipGroup.mjs +0 -3
- package/dist/lib/src/components/container/CdrContainer.mjs +0 -49
- package/dist/lib/src/components/container/styles/CdrContainer.mjs +0 -3
- package/dist/lib/src/components/formError/CdrFormError.mjs +0 -39
- package/dist/lib/src/components/formError/styles/CdrFormError.mjs +0 -3
- package/dist/lib/src/components/formGroup/CdrFormGroup.mjs +0 -95
- package/dist/lib/src/components/formGroup/styles/CdrFormGroup.mjs +0 -3
- package/dist/lib/src/components/grid/CdrGrid.mjs +0 -55
- package/dist/lib/src/components/grid/styles/CdrGrid.mjs +0 -3
- package/dist/lib/src/components/icon/CdrIcon.mjs +0 -76
- package/dist/lib/src/components/icon/comps/account-profile-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/account-profile.mjs +0 -27
- package/dist/lib/src/components/icon/comps/arrow-down.mjs +0 -27
- package/dist/lib/src/components/icon/comps/arrow-left.mjs +0 -27
- package/dist/lib/src/components/icon/comps/arrow-right.mjs +0 -27
- package/dist/lib/src/components/icon/comps/arrow-up.mjs +0 -27
- package/dist/lib/src/components/icon/comps/atv.mjs +0 -27
- package/dist/lib/src/components/icon/comps/bed-outline.mjs +0 -27
- package/dist/lib/src/components/icon/comps/bike-shop.mjs +0 -27
- package/dist/lib/src/components/icon/comps/binoculars.mjs +0 -27
- package/dist/lib/src/components/icon/comps/birding.mjs +0 -27
- package/dist/lib/src/components/icon/comps/boat.mjs +0 -27
- package/dist/lib/src/components/icon/comps/boating.mjs +0 -27
- package/dist/lib/src/components/icon/comps/bookmark-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/bookmark-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/brand-abstract.mjs +0 -27
- package/dist/lib/src/components/icon/comps/brand-code-sandbox.mjs +0 -27
- package/dist/lib/src/components/icon/comps/brand-github.mjs +0 -27
- package/dist/lib/src/components/icon/comps/brand-linkedin.mjs +0 -27
- package/dist/lib/src/components/icon/comps/brand-rei-ice-axes.mjs +0 -27
- package/dist/lib/src/components/icon/comps/brand-sketch.mjs +0 -27
- package/dist/lib/src/components/icon/comps/buddies.mjs +0 -27
- package/dist/lib/src/components/icon/comps/bus.mjs +0 -27
- package/dist/lib/src/components/icon/comps/calendar.mjs +0 -27
- package/dist/lib/src/components/icon/comps/camera.mjs +0 -27
- package/dist/lib/src/components/icon/comps/canoe.mjs +0 -27
- package/dist/lib/src/components/icon/comps/car.mjs +0 -27
- package/dist/lib/src/components/icon/comps/caret-down.mjs +0 -27
- package/dist/lib/src/components/icon/comps/caret-left.mjs +0 -27
- package/dist/lib/src/components/icon/comps/caret-right.mjs +0 -27
- package/dist/lib/src/components/icon/comps/caret-up.mjs +0 -27
- package/dist/lib/src/components/icon/comps/cart-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/cart.mjs +0 -27
- package/dist/lib/src/components/icon/comps/chain-link.mjs +0 -27
- package/dist/lib/src/components/icon/comps/chat.mjs +0 -27
- package/dist/lib/src/components/icon/comps/check-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/check-lg.mjs +0 -27
- package/dist/lib/src/components/icon/comps/check-sm.mjs +0 -27
- package/dist/lib/src/components/icon/comps/check-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/climb.mjs +0 -27
- package/dist/lib/src/components/icon/comps/clipboard.mjs +0 -27
- package/dist/lib/src/components/icon/comps/clock.mjs +0 -27
- package/dist/lib/src/components/icon/comps/code-html.mjs +0 -27
- package/dist/lib/src/components/icon/comps/code-js.mjs +0 -27
- package/dist/lib/src/components/icon/comps/compass.mjs +0 -27
- package/dist/lib/src/components/icon/comps/copy.mjs +0 -27
- package/dist/lib/src/components/icon/comps/coupon-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/coupon-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/credit-card.mjs +0 -27
- package/dist/lib/src/components/icon/comps/curbside-pickup.mjs +0 -27
- package/dist/lib/src/components/icon/comps/day.mjs +0 -27
- package/dist/lib/src/components/icon/comps/diving.mjs +0 -27
- package/dist/lib/src/components/icon/comps/dog.mjs +0 -27
- package/dist/lib/src/components/icon/comps/download.mjs +0 -27
- package/dist/lib/src/components/icon/comps/edit.mjs +0 -27
- package/dist/lib/src/components/icon/comps/elevation.mjs +0 -27
- package/dist/lib/src/components/icon/comps/error-fill.mjs +0 -29
- package/dist/lib/src/components/icon/comps/error-stroke.mjs +0 -33
- package/dist/lib/src/components/icon/comps/expand.mjs +0 -27
- package/dist/lib/src/components/icon/comps/experiences-backpacking.mjs +0 -27
- package/dist/lib/src/components/icon/comps/experiences-camping.mjs +0 -27
- package/dist/lib/src/components/icon/comps/experiences-climbing.mjs +0 -27
- package/dist/lib/src/components/icon/comps/experiences-clothing.mjs +0 -27
- package/dist/lib/src/components/icon/comps/experiences-cycling.mjs +0 -27
- package/dist/lib/src/components/icon/comps/experiences-family.mjs +0 -27
- package/dist/lib/src/components/icon/comps/experiences-fitness.mjs +0 -27
- package/dist/lib/src/components/icon/comps/experiences-hiking.mjs +0 -27
- package/dist/lib/src/components/icon/comps/experiences-outdoor-basics.mjs +0 -27
- package/dist/lib/src/components/icon/comps/experiences-paddling.mjs +0 -27
- package/dist/lib/src/components/icon/comps/experiences-rentals.mjs +0 -27
- package/dist/lib/src/components/icon/comps/experiences-snowsports.mjs +0 -27
- package/dist/lib/src/components/icon/comps/experiences-travel.mjs +0 -27
- package/dist/lib/src/components/icon/comps/external-link.mjs +0 -27
- package/dist/lib/src/components/icon/comps/eye-hide.mjs +0 -27
- package/dist/lib/src/components/icon/comps/eye-show.mjs +0 -27
- package/dist/lib/src/components/icon/comps/facebook.mjs +0 -27
- package/dist/lib/src/components/icon/comps/filter-alt.mjs +0 -27
- package/dist/lib/src/components/icon/comps/filter.mjs +0 -27
- package/dist/lib/src/components/icon/comps/find-location.mjs +0 -27
- package/dist/lib/src/components/icon/comps/fire.mjs +0 -27
- package/dist/lib/src/components/icon/comps/fishing.mjs +0 -27
- package/dist/lib/src/components/icon/comps/free-product.mjs +0 -27
- package/dist/lib/src/components/icon/comps/grid-view.mjs +0 -27
- package/dist/lib/src/components/icon/comps/heart-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/heart-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/hike.mjs +0 -27
- package/dist/lib/src/components/icon/comps/history.mjs +0 -27
- package/dist/lib/src/components/icon/comps/home.mjs +0 -27
- package/dist/lib/src/components/icon/comps/horse.mjs +0 -27
- package/dist/lib/src/components/icon/comps/horseshoe.mjs +0 -27
- package/dist/lib/src/components/icon/comps/image.mjs +0 -27
- package/dist/lib/src/components/icon/comps/information-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/information-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/instagram.mjs +0 -27
- package/dist/lib/src/components/icon/comps/kayak.mjs +0 -27
- package/dist/lib/src/components/icon/comps/list-ragged.mjs +0 -27
- package/dist/lib/src/components/icon/comps/list-view.mjs +0 -27
- package/dist/lib/src/components/icon/comps/location-pin-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/location-pin-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/lock-locked-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/lock-locked-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/lock-unlocked-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/mail.mjs +0 -27
- package/dist/lib/src/components/icon/comps/map.mjs +0 -27
- package/dist/lib/src/components/icon/comps/member-card.mjs +0 -27
- package/dist/lib/src/components/icon/comps/microphone.mjs +0 -27
- package/dist/lib/src/components/icon/comps/minus-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/minus-lg.mjs +0 -27
- package/dist/lib/src/components/icon/comps/minus-sm.mjs +0 -27
- package/dist/lib/src/components/icon/comps/minus-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/more-functions.mjs +0 -27
- package/dist/lib/src/components/icon/comps/my-location.mjs +0 -27
- package/dist/lib/src/components/icon/comps/navigation-menu.mjs +0 -27
- package/dist/lib/src/components/icon/comps/night.mjs +0 -27
- package/dist/lib/src/components/icon/comps/paddle.mjs +0 -27
- package/dist/lib/src/components/icon/comps/pause-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/pause-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/pause.mjs +0 -27
- package/dist/lib/src/components/icon/comps/photography.mjs +0 -27
- package/dist/lib/src/components/icon/comps/picnic.mjs +0 -27
- package/dist/lib/src/components/icon/comps/pinterest.mjs +0 -27
- package/dist/lib/src/components/icon/comps/plane.mjs +0 -27
- package/dist/lib/src/components/icon/comps/play-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/play-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/play.mjs +0 -27
- package/dist/lib/src/components/icon/comps/playground.mjs +0 -27
- package/dist/lib/src/components/icon/comps/plugin.mjs +0 -27
- package/dist/lib/src/components/icon/comps/plus-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/plus-lg.mjs +0 -27
- package/dist/lib/src/components/icon/comps/plus-sm.mjs +0 -27
- package/dist/lib/src/components/icon/comps/plus-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/print.mjs +0 -27
- package/dist/lib/src/components/icon/comps/protection-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/protection-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/question-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/question-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/refresh.mjs +0 -27
- package/dist/lib/src/components/icon/comps/reload.mjs +0 -27
- package/dist/lib/src/components/icon/comps/returns.mjs +0 -27
- package/dist/lib/src/components/icon/comps/run.mjs +0 -27
- package/dist/lib/src/components/icon/comps/scan-barcode.mjs +0 -27
- package/dist/lib/src/components/icon/comps/search.mjs +0 -27
- package/dist/lib/src/components/icon/comps/service-shop.mjs +0 -27
- package/dist/lib/src/components/icon/comps/shipping.mjs +0 -27
- package/dist/lib/src/components/icon/comps/shopping-bag-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/shopping-bag.mjs +0 -27
- package/dist/lib/src/components/icon/comps/shrink.mjs +0 -27
- package/dist/lib/src/components/icon/comps/size-chart.mjs +0 -27
- package/dist/lib/src/components/icon/comps/ski-boot.mjs +0 -27
- package/dist/lib/src/components/icon/comps/ski.mjs +0 -27
- package/dist/lib/src/components/icon/comps/snow-shop.mjs +0 -27
- package/dist/lib/src/components/icon/comps/snow.mjs +0 -27
- package/dist/lib/src/components/icon/comps/sort.mjs +0 -27
- package/dist/lib/src/components/icon/comps/star-100.mjs +0 -27
- package/dist/lib/src/components/icon/comps/star-25.mjs +0 -27
- package/dist/lib/src/components/icon/comps/star-50.mjs +0 -27
- package/dist/lib/src/components/icon/comps/star-75.mjs +0 -27
- package/dist/lib/src/components/icon/comps/star-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/storefront.mjs +0 -27
- package/dist/lib/src/components/icon/comps/swim.mjs +0 -27
- package/dist/lib/src/components/icon/comps/telephone.mjs +0 -27
- package/dist/lib/src/components/icon/comps/tent.mjs +0 -27
- package/dist/lib/src/components/icon/comps/trash.mjs +0 -27
- package/dist/lib/src/components/icon/comps/twitter.mjs +0 -27
- package/dist/lib/src/components/icon/comps/upload.mjs +0 -27
- package/dist/lib/src/components/icon/comps/verified-purchaser.mjs +0 -27
- package/dist/lib/src/components/icon/comps/virtual-outfitting.mjs +0 -27
- package/dist/lib/src/components/icon/comps/warning-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/warning-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/water.mjs +0 -27
- package/dist/lib/src/components/icon/comps/wilderness.mjs +0 -27
- package/dist/lib/src/components/icon/comps/x-fill.mjs +0 -27
- package/dist/lib/src/components/icon/comps/x-lg.mjs +0 -27
- package/dist/lib/src/components/icon/comps/x-sm.mjs +0 -27
- package/dist/lib/src/components/icon/comps/x-stroke.mjs +0 -27
- package/dist/lib/src/components/icon/comps/youtube.mjs +0 -27
- package/dist/lib/src/components/icon/comps/zoom-in.mjs +0 -27
- package/dist/lib/src/components/icon/comps/zoom-out.mjs +0 -27
- package/dist/lib/src/components/icon/styles/CdrIcon.mjs +0 -3
- package/dist/lib/src/components/image/CdrImg.mjs +0 -140
- package/dist/lib/src/components/image/styles/CdrImg.mjs +0 -3
- package/dist/lib/src/components/input/CdrInput.mjs +0 -283
- package/dist/lib/src/components/input/styles/CdrInput.mjs +0 -3
- package/dist/lib/src/components/labelStandalone/CdrLabelStandalone.mjs +0 -85
- package/dist/lib/src/components/labelStandalone/styles/CdrLabelStandalone.mjs +0 -3
- package/dist/lib/src/components/labelWrapper/CdrLabelWrapper.mjs +0 -54
- package/dist/lib/src/components/labelWrapper/styles/CdrLabelWrapper.mjs +0 -3
- package/dist/lib/src/components/link/CdrLink.mjs +0 -71
- package/dist/lib/src/components/link/styles/CdrLink.mjs +0 -3
- package/dist/lib/src/components/list/CdrList.mjs +0 -42
- package/dist/lib/src/components/list/styles/CdrList.mjs +0 -3
- package/dist/lib/src/components/modal/CdrModal.mjs +0 -365
- package/dist/lib/src/components/modal/styles/CdrModal.mjs +0 -3
- package/dist/lib/src/components/pagination/CdrPagination.mjs +0 -425
- package/dist/lib/src/components/pagination/styles/CdrPagination.mjs +0 -3
- package/dist/lib/src/components/popover/CdrPopover.mjs +0 -155
- package/dist/lib/src/components/popover/styles/CdrPopover.mjs +0 -3
- package/dist/lib/src/components/popup/CdrPopup.mjs +0 -256
- package/dist/lib/src/components/popup/styles/CdrPopup.mjs +0 -3
- package/dist/lib/src/components/quote/CdrQuote.mjs +0 -66
- package/dist/lib/src/components/quote/styles/CdrQuote.mjs +0 -3
- package/dist/lib/src/components/radio/CdrRadio.mjs +0 -141
- package/dist/lib/src/components/radio/styles/CdrRadio.mjs +0 -3
- package/dist/lib/src/components/rating/CdrRating.mjs +0 -179
- package/dist/lib/src/components/rating/styles/CdrRating.mjs +0 -3
- package/dist/lib/src/components/select/CdrSelect.mjs +0 -255
- package/dist/lib/src/components/select/styles/CdrSelect.mjs +0 -3
- package/dist/lib/src/components/table/CdrTable.mjs +0 -73
- package/dist/lib/src/components/table/styles/CdrTable.mjs +0 -3
- package/dist/lib/src/components/tabs/CdrTabPanel.mjs +0 -105
- package/dist/lib/src/components/tabs/CdrTabs.mjs +0 -353
- package/dist/lib/src/components/tabs/styles/CdrTabPanel.mjs +0 -3
- package/dist/lib/src/components/tabs/styles/CdrTabs.mjs +0 -3
- package/dist/lib/src/components/text/CdrText.mjs +0 -44
- package/dist/lib/src/components/text/styles/CdrText.mjs +0 -3
- package/dist/lib/src/components/toast/CdrToast.mjs +0 -159
- package/dist/lib/src/components/toast/styles/CdrToast.mjs +0 -3
- package/dist/lib/src/components/tooltip/CdrTooltip.mjs +0 -121
- package/dist/lib/src/components/tooltip/styles/CdrTooltip.mjs +0 -3
- package/dist/lib/src/mixins/breakpoints.mjs +0 -26
- package/dist/lib/src/mixins/buildClass.mjs +0 -71
- package/dist/lib/src/mixins/fullWidth.mjs +0 -47
- package/dist/lib/src/mixins/modifier.mjs +0 -22
- package/dist/lib/src/mixins/size.mjs +0 -37
- package/dist/style/cdr-accordion-group.css +0 -1
- package/dist/style/cdr-accordion.css +0 -1
- package/dist/style/cdr-banner-vars.css +0 -0
- package/dist/style/cdr-banner.css +0 -1
- package/dist/style/cdr-breadcrumb.css +0 -1
- package/dist/style/cdr-button.css +0 -1
- package/dist/style/cdr-caption.css +0 -1
- package/dist/style/cdr-card.css +0 -1
- package/dist/style/cdr-checkbox.css +0 -1
- package/dist/style/cdr-chip-group.css +0 -1
- package/dist/style/cdr-chip.css +0 -1
- package/dist/style/cdr-container.css +0 -1
- package/dist/style/cdr-form-error.css +0 -1
- package/dist/style/cdr-form-group.css +0 -1
- package/dist/style/cdr-grid.css +0 -1
- package/dist/style/cdr-icon.css +0 -1
- package/dist/style/cdr-img.css +0 -1
- package/dist/style/cdr-input.css +0 -1
- package/dist/style/cdr-label-standalone.css +0 -1
- package/dist/style/cdr-label-wrapper.css +0 -1
- package/dist/style/cdr-link.css +0 -1
- package/dist/style/cdr-list.css +0 -1
- package/dist/style/cdr-modal.css +0 -1
- package/dist/style/cdr-pagination.css +0 -1
- package/dist/style/cdr-popover.css +0 -1
- package/dist/style/cdr-popup.css +0 -1
- package/dist/style/cdr-quote.css +0 -1
- package/dist/style/cdr-radio.css +0 -1
- package/dist/style/cdr-rating.css +0 -1
- package/dist/style/cdr-select.css +0 -1
- package/dist/style/cdr-tab-panel.css +0 -1
- package/dist/style/cdr-table.css +0 -1
- package/dist/style/cdr-tabs.css +0 -1
- package/dist/style/cdr-text.css +0 -1
- package/dist/style/cdr-toast.css +0 -1
- package/dist/style/cdr-tooltip.css +0 -1
- package/dist/style/reset.css +0 -1
|
@@ -0,0 +1,361 @@
|
|
|
1
|
+
import { buildClass } from '../../utils/buildClass.js';
|
|
2
|
+
import { defineComponent, ref, provide, computed, onMounted, nextTick, useCssModule, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, withKeys, withModifiers, Fragment, renderList, toDisplayString, renderSlot } from 'vue';
|
|
3
|
+
import debounce from 'lodash/debounce';
|
|
4
|
+
import mapClasses from '../../utils/mapClasses.js';
|
|
5
|
+
import { CdrColorBackgroundPrimary, CdrSpaceHalfX, CdrSpaceOneX } from '../../../node_modules/@rei/cdr-tokens/dist/js/cdr-tokens.esm.js';
|
|
6
|
+
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.js';
|
|
7
|
+
|
|
8
|
+
const _sfc_main = defineComponent({
|
|
9
|
+
name: 'CdrTabs',
|
|
10
|
+
props: {
|
|
11
|
+
height: {
|
|
12
|
+
type: String,
|
|
13
|
+
default: '240px',
|
|
14
|
+
},
|
|
15
|
+
activeTab: {
|
|
16
|
+
type: Number,
|
|
17
|
+
default: 0,
|
|
18
|
+
},
|
|
19
|
+
modifier: String,
|
|
20
|
+
size: String,
|
|
21
|
+
backgroundColor: {
|
|
22
|
+
type: String,
|
|
23
|
+
default: CdrColorBackgroundPrimary,
|
|
24
|
+
},
|
|
25
|
+
},
|
|
26
|
+
setup(props, ctx) {
|
|
27
|
+
|
|
28
|
+
const tabs = ref([]);
|
|
29
|
+
provide('tabs', tabs);
|
|
30
|
+
|
|
31
|
+
const underlineOffsetX = ref(0);
|
|
32
|
+
const underlineWidth = ref(0);
|
|
33
|
+
// const underlineScrollX = ref(0); // ????
|
|
34
|
+
const activeTabIndex = ref(0);
|
|
35
|
+
const headerWidth = ref(0);
|
|
36
|
+
const headerOverflow = ref(false);
|
|
37
|
+
const overflowLeft = ref(false);
|
|
38
|
+
const overflowRight = ref(false);
|
|
39
|
+
|
|
40
|
+
|
|
41
|
+
const containerEl = ref(null);
|
|
42
|
+
const slotWrapperEl = ref(null);
|
|
43
|
+
const cdrTabsHeaderEl = ref(null);
|
|
44
|
+
|
|
45
|
+
const baseClass = 'cdr-tabs';
|
|
46
|
+
const modifierClass = computed(() => buildClass('cdr-tabs', props.modifier));
|
|
47
|
+
const sizeClass = computed(() => props.size && buildClass('cdr-tabs', props.size));
|
|
48
|
+
|
|
49
|
+
const underlineStyle = computed(() => {
|
|
50
|
+
return {
|
|
51
|
+
transform: `translateX(${underlineOffsetX.value}px)`,
|
|
52
|
+
width: `${underlineWidth.value}px`,
|
|
53
|
+
};
|
|
54
|
+
});
|
|
55
|
+
const gradientLeftStyle = computed(() => {
|
|
56
|
+
const gradient = `linear-gradient(to left, rgba(255, 255, 255, 0), ${props.backgroundColor})`;
|
|
57
|
+
return {
|
|
58
|
+
background: gradient,
|
|
59
|
+
};
|
|
60
|
+
});
|
|
61
|
+
const gradientRightStyle = computed(() => {
|
|
62
|
+
const gradient = `linear-gradient(to right, rgba(255, 255, 255, 0), ${props.backgroundColor})`;
|
|
63
|
+
return {
|
|
64
|
+
background: gradient,
|
|
65
|
+
};
|
|
66
|
+
});
|
|
67
|
+
|
|
68
|
+
// TODO: i feel it in my heart that these 2 function can be 1-liners
|
|
69
|
+
const getNextTab = (startIndex) => {
|
|
70
|
+
for (let i = startIndex; i < tabs.value.length; i += 1) {
|
|
71
|
+
if (!tabs.value[i].disabled) {
|
|
72
|
+
return i;
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
if (startIndex !== 0) {
|
|
77
|
+
for (let k = 0; k < startIndex; k += 1) {
|
|
78
|
+
if (!tabs.value[k].disabled) {
|
|
79
|
+
return k;
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
return -1;
|
|
85
|
+
};
|
|
86
|
+
|
|
87
|
+
const getPreviousTab = (startIndex) => {
|
|
88
|
+
for (let i = startIndex; i > -1; i -= 1) {
|
|
89
|
+
if (!tabs.value[i].disabled) {
|
|
90
|
+
return i;
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
if (startIndex !== tabs.value.length - 1) {
|
|
95
|
+
for (let k = tabs.value.length - 1; k > startIndex; k -= 1) {
|
|
96
|
+
if (!tabs.value[k].disabled) {
|
|
97
|
+
return k;
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
return -1;
|
|
103
|
+
};
|
|
104
|
+
|
|
105
|
+
const handleClick = debounce(function handleClickCallback(tabClicked) {
|
|
106
|
+
// TODO: render index in buttons to bind this event, no need to find index????
|
|
107
|
+
const newIndex = tabs.value.findIndex((tab) => tabClicked.name === tab.name);
|
|
108
|
+
changeTab(newIndex);
|
|
109
|
+
}, 500, { leading: true, trailing: false });
|
|
110
|
+
|
|
111
|
+
const changeTab = (newIndex) => {
|
|
112
|
+
const oldIndex = activeTabIndex.value;
|
|
113
|
+
|
|
114
|
+
hideScrollBar();
|
|
115
|
+
if (newIndex > oldIndex) {
|
|
116
|
+
tabs.value[oldIndex].setAnimationDirection('exit-left');
|
|
117
|
+
tabs.value[oldIndex].setActive(false);
|
|
118
|
+
setTimeout(() => {
|
|
119
|
+
tabs.value[newIndex].setActive(true);
|
|
120
|
+
tabs.value[newIndex].setAnimationDirection('enter-right');
|
|
121
|
+
}, 200);
|
|
122
|
+
} else {
|
|
123
|
+
tabs.value[oldIndex].setAnimationDirection('exit-right');
|
|
124
|
+
tabs.value[oldIndex].setActive(false);
|
|
125
|
+
setTimeout(() => {
|
|
126
|
+
tabs.value[newIndex].setActive(true);
|
|
127
|
+
tabs.value[newIndex].setAnimationDirection('enter-left');
|
|
128
|
+
}, 200);
|
|
129
|
+
}
|
|
130
|
+
activeTabIndex.value = newIndex;
|
|
131
|
+
updateUnderline();
|
|
132
|
+
cdrTabsHeaderEl.value.children[activeTabIndex.value].focus();
|
|
133
|
+
};
|
|
134
|
+
const rightArrowNav = debounce(function handleRightArrow() {
|
|
135
|
+
const nextTab = getNextTab(activeTabIndex.value + 1);
|
|
136
|
+
if (nextTab !== -1) {
|
|
137
|
+
changeTab(nextTab);
|
|
138
|
+
}
|
|
139
|
+
}, 300, { leading: true, trailing: false });
|
|
140
|
+
|
|
141
|
+
const leftArrowNav = debounce(function handleLeftArrow() {
|
|
142
|
+
const previousTab = getPreviousTab(activeTabIndex.value - 1);
|
|
143
|
+
if (previousTab !== -1) {
|
|
144
|
+
changeTab(previousTab);
|
|
145
|
+
}
|
|
146
|
+
}, 300, { leading: true, trailing: false });
|
|
147
|
+
|
|
148
|
+
const calculateOverflow = () => {
|
|
149
|
+
let containerWidth = 0;
|
|
150
|
+
if (containerEl.value) {
|
|
151
|
+
containerWidth = containerEl.value.offsetWidth;
|
|
152
|
+
}
|
|
153
|
+
headerOverflow.value = headerWidth.value > containerWidth;
|
|
154
|
+
if (headerOverflow.value) {
|
|
155
|
+
// Get Scroll Position
|
|
156
|
+
const scrollX = cdrTabsHeaderEl.value.parentElement.scrollLeft;
|
|
157
|
+
overflowLeft.value = scrollX > 1;
|
|
158
|
+
overflowRight.value = (scrollX + 1) < (headerWidth.value - containerWidth);
|
|
159
|
+
} else {
|
|
160
|
+
overflowLeft.value = false;
|
|
161
|
+
overflowRight.value = false;
|
|
162
|
+
}
|
|
163
|
+
};
|
|
164
|
+
const updateUnderline = () => {
|
|
165
|
+
const elements = Array.from(cdrTabsHeaderEl.value.children); // TODO: cache this? probably?
|
|
166
|
+
if (elements.length > 0) {
|
|
167
|
+
const activeTab = elements[activeTabIndex.value];
|
|
168
|
+
const activeRect = activeTab.getBoundingClientRect();
|
|
169
|
+
const parentRect = cdrTabsHeaderEl.value.getBoundingClientRect();
|
|
170
|
+
const offset = activeRect.x - parentRect.x;
|
|
171
|
+
|
|
172
|
+
underlineOffsetX.value = offset
|
|
173
|
+
- cdrTabsHeaderEl.value.parentElement.scrollLeft;
|
|
174
|
+
underlineWidth.value = activeRect.width;
|
|
175
|
+
|
|
176
|
+
// shrink/hide the underline if it scrolls outside the container
|
|
177
|
+
if (underlineOffsetX.value + underlineWidth.value >= parentRect.width) {
|
|
178
|
+
underlineWidth.value = Math.max(0, parentRect.width - underlineOffsetX.value);
|
|
179
|
+
underlineOffsetX.value = Math.min(underlineOffsetX.value, parentRect.width);
|
|
180
|
+
} else if (underlineOffsetX.value < 0) {
|
|
181
|
+
underlineWidth.value = Math.max(0, underlineWidth.value + underlineOffsetX.value);
|
|
182
|
+
underlineOffsetX.value = 0;
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
};
|
|
186
|
+
// TODO: what?
|
|
187
|
+
const handleDownArrowNav = () => {
|
|
188
|
+
};
|
|
189
|
+
// TODO: listen for events emitted from tabs???
|
|
190
|
+
const setFocusToActiveTabHeader = () => {
|
|
191
|
+
cdrTabsHeaderEl.value.children[activeTabIndex.value].focus();
|
|
192
|
+
};
|
|
193
|
+
const getHeaderWidth = () => {
|
|
194
|
+
let headerElements = [];
|
|
195
|
+
if (cdrTabsHeaderEl.value) {
|
|
196
|
+
headerElements = Array.from(cdrTabsHeaderEl.value.children);
|
|
197
|
+
}
|
|
198
|
+
let totalWidth = 0;
|
|
199
|
+
headerElements.forEach((element, i) => {
|
|
200
|
+
// account for margin-left on header elements
|
|
201
|
+
if (i > 0) {
|
|
202
|
+
totalWidth += props.size === 'small' ? Number(CdrSpaceHalfX) : Number(CdrSpaceOneX);
|
|
203
|
+
}
|
|
204
|
+
totalWidth += element.offsetWidth || 0;
|
|
205
|
+
});
|
|
206
|
+
return totalWidth;
|
|
207
|
+
};
|
|
208
|
+
const hideScrollBar = () => {
|
|
209
|
+
const containerRef = containerEl.value.style;
|
|
210
|
+
const slotRef = slotWrapperEl.value.style;
|
|
211
|
+
window.addEventListener('transitionend', () => {
|
|
212
|
+
containerRef.setProperty('overflow-x', 'unset');
|
|
213
|
+
slotRef.setProperty('overflow-y', 'unset');
|
|
214
|
+
}, { once: true });
|
|
215
|
+
containerRef.setProperty('overflow-x', 'hidden');
|
|
216
|
+
slotRef.setProperty('overflow-y', 'hidden');
|
|
217
|
+
};
|
|
218
|
+
|
|
219
|
+
onMounted(() => {
|
|
220
|
+
|
|
221
|
+
activeTabIndex.value = getNextTab(props.activeTab);
|
|
222
|
+
|
|
223
|
+
if (tabs.value[activeTabIndex.value] && tabs.value[activeTabIndex.value].setActive) {
|
|
224
|
+
tabs.value[activeTabIndex.value].setActive(true);
|
|
225
|
+
}
|
|
226
|
+
|
|
227
|
+
nextTick(() => {
|
|
228
|
+
headerWidth.value = getHeaderWidth();
|
|
229
|
+
calculateOverflow();
|
|
230
|
+
setTimeout(() => {
|
|
231
|
+
updateUnderline();
|
|
232
|
+
}, 500);
|
|
233
|
+
});
|
|
234
|
+
// Check for header overflow on window resize for gradient behavior.
|
|
235
|
+
window.addEventListener('resize', debounce(() => {
|
|
236
|
+
headerWidth.value = getHeaderWidth();
|
|
237
|
+
calculateOverflow();
|
|
238
|
+
updateUnderline();
|
|
239
|
+
}, 500));
|
|
240
|
+
// Check for header overflow on widow resize for gradient behavior.
|
|
241
|
+
cdrTabsHeaderEl.value.parentElement.addEventListener('scroll', debounce(() => {
|
|
242
|
+
calculateOverflow();
|
|
243
|
+
updateUnderline();
|
|
244
|
+
}, 50));
|
|
245
|
+
});
|
|
246
|
+
|
|
247
|
+
return {
|
|
248
|
+
style: useCssModule(),
|
|
249
|
+
mapClasses,
|
|
250
|
+
baseClass,
|
|
251
|
+
modifierClass,
|
|
252
|
+
sizeClass,
|
|
253
|
+
tabs,
|
|
254
|
+
|
|
255
|
+
// containerHeight, // ????
|
|
256
|
+
overflowLeft,
|
|
257
|
+
overflowRight,
|
|
258
|
+
|
|
259
|
+
rightArrowNav,
|
|
260
|
+
leftArrowNav,
|
|
261
|
+
handleDownArrowNav,
|
|
262
|
+
handleClick,
|
|
263
|
+
|
|
264
|
+
cdrTabsHeaderEl,
|
|
265
|
+
slotWrapperEl,
|
|
266
|
+
containerEl,
|
|
267
|
+
|
|
268
|
+
underlineStyle,
|
|
269
|
+
gradientLeftStyle,
|
|
270
|
+
gradientRightStyle,
|
|
271
|
+
|
|
272
|
+
|
|
273
|
+
getHeaderWidth,
|
|
274
|
+
calculateOverflow,
|
|
275
|
+
updateUnderline,
|
|
276
|
+
hideScrollBar,
|
|
277
|
+
changeTab,
|
|
278
|
+
getNextTab,
|
|
279
|
+
getPreviousTab,
|
|
280
|
+
|
|
281
|
+
activeTabIndex,
|
|
282
|
+
setFocusToActiveTabHeader,
|
|
283
|
+
headerOverflow,
|
|
284
|
+
};
|
|
285
|
+
},
|
|
286
|
+
});
|
|
287
|
+
|
|
288
|
+
const _hoisted_1 = ["aria-selected", "aria-controls", "id", "tabIndex", "onClick"];
|
|
289
|
+
|
|
290
|
+
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
291
|
+
return (openBlock(), createElementBlock("div", {
|
|
292
|
+
class: normalizeClass(_ctx.mapClasses(_ctx.style, _ctx.baseClass, _ctx.modifierClass, _ctx.sizeClass)),
|
|
293
|
+
ref: "containerEl",
|
|
294
|
+
style: normalizeStyle({ height: _ctx.height })
|
|
295
|
+
}, [
|
|
296
|
+
createElementVNode("div", {
|
|
297
|
+
class: normalizeClass(_ctx.style['cdr-tabs__gradient-container']),
|
|
298
|
+
onKeyup: [
|
|
299
|
+
_cache[0] || (_cache[0] = withKeys((...args) => (_ctx.rightArrowNav && _ctx.rightArrowNav(...args)), ["right"])),
|
|
300
|
+
_cache[1] || (_cache[1] = withKeys((...args) => (_ctx.leftArrowNav && _ctx.leftArrowNav(...args)), ["left"]))
|
|
301
|
+
],
|
|
302
|
+
onKeydown: _cache[2] || (_cache[2] = withKeys(withModifiers((...args) => (_ctx.handleDownArrowNav && _ctx.handleDownArrowNav(...args)), ["prevent"]), ["down"]))
|
|
303
|
+
}, [
|
|
304
|
+
createElementVNode("div", {
|
|
305
|
+
class: normalizeClass(_ctx.mapClasses(_ctx.style,
|
|
306
|
+
'cdr-tabs__gradient',
|
|
307
|
+
'cdr-tabs__gradient--left',
|
|
308
|
+
_ctx.overflowLeft ? 'cdr-tabs__gradient--active' : ''
|
|
309
|
+
)),
|
|
310
|
+
style: normalizeStyle(_ctx.gradientLeftStyle)
|
|
311
|
+
}, null, 6 /* CLASS, STYLE */),
|
|
312
|
+
createElementVNode("nav", {
|
|
313
|
+
class: normalizeClass(_ctx.style['cdr-tabs__header-container'])
|
|
314
|
+
}, [
|
|
315
|
+
createElementVNode("div", {
|
|
316
|
+
class: normalizeClass(_ctx.style['cdr-tabs__header']),
|
|
317
|
+
role: "tablist",
|
|
318
|
+
ref: "cdrTabsHeaderEl"
|
|
319
|
+
}, [
|
|
320
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.tabs, (tab, i) => {
|
|
321
|
+
return (openBlock(), createElementBlock("button", {
|
|
322
|
+
role: "tab",
|
|
323
|
+
"aria-selected": tab.disabled ? '' : _ctx.activeTabIndex === i,
|
|
324
|
+
"aria-controls": tab.disabled ? '' : tab.id,
|
|
325
|
+
id: tab.disabled ? '' : tab.ariaLabelledby,
|
|
326
|
+
key: tab.id,
|
|
327
|
+
class: normalizeClass(_ctx.mapClasses(_ctx.style,
|
|
328
|
+
(_ctx.activeTabIndex === i && !tab.disabled) ? 'cdr-tabs__header-item-active' : '',
|
|
329
|
+
'cdr-tabs__header-item',
|
|
330
|
+
tab.disabled ? 'cdr-tabs__header-item--disabled' : '',
|
|
331
|
+
)),
|
|
332
|
+
tabIndex: (_ctx.activeTabIndex === i && !tab.disabled) ? 0 : -1,
|
|
333
|
+
onClick: withModifiers((e) => tab.disabled ? null : _ctx.handleClick(tab, e), ["prevent"])
|
|
334
|
+
}, toDisplayString(tab.name), 11 /* TEXT, CLASS, PROPS */, _hoisted_1))
|
|
335
|
+
}), 128 /* KEYED_FRAGMENT */))
|
|
336
|
+
], 2 /* CLASS */)
|
|
337
|
+
], 2 /* CLASS */),
|
|
338
|
+
createElementVNode("div", {
|
|
339
|
+
class: normalizeClass(_ctx.mapClasses(_ctx.style,
|
|
340
|
+
'cdr-tabs__gradient',
|
|
341
|
+
'cdr-tabs__gradient--right',
|
|
342
|
+
_ctx.overflowRight ? 'cdr-tabs__gradient--active' : '',
|
|
343
|
+
)),
|
|
344
|
+
style: normalizeStyle(_ctx.gradientRightStyle)
|
|
345
|
+
}, null, 6 /* CLASS, STYLE */),
|
|
346
|
+
createElementVNode("div", {
|
|
347
|
+
class: normalizeClass(_ctx.style['cdr-tabs__underline']),
|
|
348
|
+
style: normalizeStyle(_ctx.underlineStyle)
|
|
349
|
+
}, null, 6 /* CLASS, STYLE */)
|
|
350
|
+
], 34 /* CLASS, HYDRATE_EVENTS */),
|
|
351
|
+
createElementVNode("div", {
|
|
352
|
+
class: normalizeClass(_ctx.style['cdr-tabs__content-container']),
|
|
353
|
+
ref: "slotWrapperEl"
|
|
354
|
+
}, [
|
|
355
|
+
renderSlot(_ctx.$slots, "default")
|
|
356
|
+
], 2 /* CLASS */)
|
|
357
|
+
], 6 /* CLASS, STYLE */))
|
|
358
|
+
}
|
|
359
|
+
var CdrTabs = /*#__PURE__*/_export_sfc(_sfc_main, [['render',_sfc_render]]);
|
|
360
|
+
|
|
361
|
+
export { CdrTabs as default };
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { defineComponent, useCssModule, openBlock, createBlock, resolveDynamicComponent, normalizeClass, withCtx, renderSlot } from 'vue';
|
|
2
|
+
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.js';
|
|
3
|
+
|
|
4
|
+
const _sfc_main = defineComponent({
|
|
5
|
+
name: 'CdrText',
|
|
6
|
+
props: {
|
|
7
|
+
tag: {
|
|
8
|
+
type: String,
|
|
9
|
+
default: 'p',
|
|
10
|
+
},
|
|
11
|
+
},
|
|
12
|
+
setup() {
|
|
13
|
+
return {
|
|
14
|
+
style: useCssModule(),
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
|
|
19
|
+
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
20
|
+
return (openBlock(), createBlock(resolveDynamicComponent(_ctx.tag), {
|
|
21
|
+
class: normalizeClass(_ctx.style['cdr-text'])
|
|
22
|
+
}, {
|
|
23
|
+
default: withCtx(() => [
|
|
24
|
+
renderSlot(_ctx.$slots, "default")
|
|
25
|
+
]),
|
|
26
|
+
_: 3 /* FORWARDED */
|
|
27
|
+
}, 8 /* PROPS */, ["class"]))
|
|
28
|
+
}
|
|
29
|
+
var CdrText = /*#__PURE__*/_export_sfc(_sfc_main, [['render',_sfc_render]]);
|
|
30
|
+
|
|
31
|
+
export { CdrText as default };
|
|
@@ -0,0 +1,160 @@
|
|
|
1
|
+
import { useSlots, useCssModule, ref, computed, watch, onUpdated, openBlock, createBlock, Transition, unref, withCtx, createElementBlock, normalizeClass, createElementVNode, renderSlot, createCommentVNode, createVNode } from 'vue';
|
|
2
|
+
import validateProp from '../../utils/propValidator.js';
|
|
3
|
+
import { buildClass } from '../../utils/buildClass.js';
|
|
4
|
+
import IconXSm from '../icon/comps/x-sm.js';
|
|
5
|
+
import CdrButton from '../button/CdrButton.js';
|
|
6
|
+
|
|
7
|
+
const _sfc_main = {
|
|
8
|
+
props: {
|
|
9
|
+
type: {
|
|
10
|
+
type: String,
|
|
11
|
+
validator: (value) => validateProp(
|
|
12
|
+
value,
|
|
13
|
+
['info', 'warning', 'success', 'error', 'default'],
|
|
14
|
+
),
|
|
15
|
+
default: 'default',
|
|
16
|
+
},
|
|
17
|
+
open: {
|
|
18
|
+
type: Boolean,
|
|
19
|
+
default: false,
|
|
20
|
+
},
|
|
21
|
+
autoDismiss: {
|
|
22
|
+
type: Boolean,
|
|
23
|
+
default: true,
|
|
24
|
+
},
|
|
25
|
+
dismissDelay: {
|
|
26
|
+
type: Number,
|
|
27
|
+
default: 5000,
|
|
28
|
+
},
|
|
29
|
+
},
|
|
30
|
+
emits: ['open', 'closed'],
|
|
31
|
+
setup(__props, { emit }) {
|
|
32
|
+
|
|
33
|
+
const props = __props;
|
|
34
|
+
|
|
35
|
+
const slots = useSlots();
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
const baseClass = 'cdr-toast';
|
|
40
|
+
const style = useCssModule();
|
|
41
|
+
const hasIconLeft = slots['icon-left'];
|
|
42
|
+
const opened = ref(null);
|
|
43
|
+
const toastEl = ref(null);
|
|
44
|
+
let timeout;
|
|
45
|
+
let toastElement;
|
|
46
|
+
|
|
47
|
+
const typeClass = computed(() => props.type && buildClass(baseClass, props.type));
|
|
48
|
+
|
|
49
|
+
const openToast = (e) => {
|
|
50
|
+
if (timeout) {
|
|
51
|
+
clearTimeout(timeout);
|
|
52
|
+
} else {
|
|
53
|
+
emit('open', e);
|
|
54
|
+
}
|
|
55
|
+
opened.value = true;
|
|
56
|
+
if (props.autoDismiss && !e) {
|
|
57
|
+
closeToastWithDelay();
|
|
58
|
+
}
|
|
59
|
+
};
|
|
60
|
+
|
|
61
|
+
const closeToast = (e) => {
|
|
62
|
+
removeHandlers();
|
|
63
|
+
opened.value = false;
|
|
64
|
+
emit('closed', e);
|
|
65
|
+
};
|
|
66
|
+
|
|
67
|
+
const closeToastWithDelay = (e) => {
|
|
68
|
+
timeout = setTimeout(() => {
|
|
69
|
+
removeHandlers();
|
|
70
|
+
opened.value = false;
|
|
71
|
+
emit('closed', e);
|
|
72
|
+
}, props.dismissDelay);
|
|
73
|
+
};
|
|
74
|
+
|
|
75
|
+
const addHandlers = () => {
|
|
76
|
+
toastElement = toastEl.value;
|
|
77
|
+
if (toastElement) {
|
|
78
|
+
toastElement.addEventListener('mouseover', openToast);
|
|
79
|
+
toastElement.addEventListener('mouseleave', closeToastWithDelay);
|
|
80
|
+
}
|
|
81
|
+
};
|
|
82
|
+
|
|
83
|
+
const removeHandlers = () => {
|
|
84
|
+
if (toastElement) {
|
|
85
|
+
toastElement.removeEventListener('mouseover', openToast);
|
|
86
|
+
toastElement.removeEventListener('mouseleave', closeToastWithDelay);
|
|
87
|
+
}
|
|
88
|
+
};
|
|
89
|
+
|
|
90
|
+
watch(() => props.open, () => {
|
|
91
|
+
if (props.open) openToast();
|
|
92
|
+
});
|
|
93
|
+
|
|
94
|
+
onUpdated(() => {
|
|
95
|
+
if (props.autoDismiss) addHandlers();
|
|
96
|
+
});
|
|
97
|
+
|
|
98
|
+
return (_ctx, _cache) => {
|
|
99
|
+
return (openBlock(), createBlock(Transition, {
|
|
100
|
+
"enter-from-class": unref(style)['cdr-toast__transition--toast-enter-from'],
|
|
101
|
+
"enter-active-class": unref(style)['cdr-toast__transition--toast-enter-active'],
|
|
102
|
+
"leave-to-class": unref(style)['cdr-toast__transition--toast-leave-to'],
|
|
103
|
+
"leave-active-class": unref(style)['cdr-toast__transition--toast-leave-active']
|
|
104
|
+
}, {
|
|
105
|
+
default: withCtx(() => [
|
|
106
|
+
(opened.value)
|
|
107
|
+
? (openBlock(), createElementBlock("div", {
|
|
108
|
+
key: 0,
|
|
109
|
+
class: normalizeClass([unref(style)[baseClass], unref(style)[unref(typeClass)]]),
|
|
110
|
+
role: "status",
|
|
111
|
+
ref: (_value, _refs) => {
|
|
112
|
+
_refs['toastEl'] = _value;
|
|
113
|
+
toastEl.value = _value;
|
|
114
|
+
}
|
|
115
|
+
}, [
|
|
116
|
+
createElementVNode("div", {
|
|
117
|
+
class: normalizeClass([unref(style)['cdr-toast__main']])
|
|
118
|
+
}, [
|
|
119
|
+
(unref(hasIconLeft))
|
|
120
|
+
? (openBlock(), createElementBlock("div", {
|
|
121
|
+
key: 0,
|
|
122
|
+
class: normalizeClass([unref(style)['cdr-toast__icon-left']])
|
|
123
|
+
}, [
|
|
124
|
+
renderSlot(_ctx.$slots, "icon-left")
|
|
125
|
+
], 2 /* CLASS */))
|
|
126
|
+
: createCommentVNode("v-if", true),
|
|
127
|
+
createElementVNode("span", {
|
|
128
|
+
class: normalizeClass([unref(style)['cdr-toast__message']])
|
|
129
|
+
}, [
|
|
130
|
+
renderSlot(_ctx.$slots, "default")
|
|
131
|
+
], 2 /* CLASS */),
|
|
132
|
+
createVNode(unref(CdrButton), {
|
|
133
|
+
class: normalizeClass([unref(style)['cdr-toast__close-button']]),
|
|
134
|
+
"icon-only": "",
|
|
135
|
+
onClick: closeToast,
|
|
136
|
+
"aria-label": "Close",
|
|
137
|
+
size: "small"
|
|
138
|
+
}, {
|
|
139
|
+
default: withCtx(() => [
|
|
140
|
+
createVNode(unref(IconXSm), {
|
|
141
|
+
slot: "icon",
|
|
142
|
+
"inherit-color": ""
|
|
143
|
+
})
|
|
144
|
+
]),
|
|
145
|
+
_: 1 /* STABLE */
|
|
146
|
+
}, 8 /* PROPS */, ["class"])
|
|
147
|
+
], 2 /* CLASS */)
|
|
148
|
+
], 2 /* CLASS */))
|
|
149
|
+
: createCommentVNode("v-if", true)
|
|
150
|
+
]),
|
|
151
|
+
_: 3 /* FORWARDED */
|
|
152
|
+
}, 8 /* PROPS */, ["enter-from-class", "enter-active-class", "leave-to-class", "leave-active-class"]))
|
|
153
|
+
}
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
};
|
|
157
|
+
|
|
158
|
+
var _sfc_main$1 = _sfc_main;
|
|
159
|
+
|
|
160
|
+
export { _sfc_main$1 as default };
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
import { defineComponent, ref, watch, onMounted, useCssModule, resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, createVNode, withCtx } from 'vue';
|
|
2
|
+
import mapClasses from '../../utils/mapClasses.js';
|
|
3
|
+
import CdrPopup from '../popup/CdrPopup.js';
|
|
4
|
+
import validateProp from '../../utils/propValidator.js';
|
|
5
|
+
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.js';
|
|
6
|
+
|
|
7
|
+
const _sfc_main = defineComponent({
|
|
8
|
+
name: 'CdrTooltip',
|
|
9
|
+
components: {
|
|
10
|
+
CdrPopup,
|
|
11
|
+
},
|
|
12
|
+
props: {
|
|
13
|
+
position: {
|
|
14
|
+
type: String,
|
|
15
|
+
required: false,
|
|
16
|
+
default: 'top',
|
|
17
|
+
validator: (value) => validateProp(
|
|
18
|
+
value,
|
|
19
|
+
['top', 'bottom', 'left', 'right'],
|
|
20
|
+
),
|
|
21
|
+
},
|
|
22
|
+
autoPosition: {
|
|
23
|
+
type: Boolean,
|
|
24
|
+
default: true,
|
|
25
|
+
},
|
|
26
|
+
id: {
|
|
27
|
+
type: String,
|
|
28
|
+
required: true,
|
|
29
|
+
},
|
|
30
|
+
contentClass: {
|
|
31
|
+
type: String,
|
|
32
|
+
required: false,
|
|
33
|
+
},
|
|
34
|
+
open: {
|
|
35
|
+
type: Boolean,
|
|
36
|
+
default: false,
|
|
37
|
+
required: false,
|
|
38
|
+
},
|
|
39
|
+
},
|
|
40
|
+
setup(props, ctx) {
|
|
41
|
+
|
|
42
|
+
const isOpen = ref(false);
|
|
43
|
+
let timeout;
|
|
44
|
+
|
|
45
|
+
const popupEl = ref(null);
|
|
46
|
+
const triggerEl = ref(null);
|
|
47
|
+
|
|
48
|
+
const hasTrigger = ctx.slots.trigger;
|
|
49
|
+
// TODO: https://v3.vuejs.org/guide/migration/emits-option.html#overview
|
|
50
|
+
const openTooltip = (e) => {
|
|
51
|
+
if (timeout) clearTimeout(timeout);
|
|
52
|
+
isOpen.value = true;
|
|
53
|
+
ctx.emit('opened', e);
|
|
54
|
+
};
|
|
55
|
+
const closeTooltip = (e) => {
|
|
56
|
+
timeout = setTimeout(() => {
|
|
57
|
+
isOpen.value = false;
|
|
58
|
+
ctx.emit('closed', e);
|
|
59
|
+
}, 250);
|
|
60
|
+
};
|
|
61
|
+
const addHandlers = () => {
|
|
62
|
+
const triggerElement = triggerEl.value.children[0];
|
|
63
|
+
popupEl.value;
|
|
64
|
+
if (triggerElement) {
|
|
65
|
+
triggerElement.addEventListener('mouseover', openTooltip);
|
|
66
|
+
triggerElement.addEventListener('focus', openTooltip);
|
|
67
|
+
|
|
68
|
+
triggerElement.addEventListener('mouseleave', closeTooltip);
|
|
69
|
+
triggerElement.addEventListener('blur', closeTooltip);
|
|
70
|
+
|
|
71
|
+
// popupElement.addEventListener('mouseover', openTooltip);
|
|
72
|
+
// popupElement.addEventListener('mouseleave', closeTooltip);
|
|
73
|
+
}
|
|
74
|
+
};
|
|
75
|
+
|
|
76
|
+
watch(() => props.open, () => (props.open ? openTooltip() : closeTooltip()));
|
|
77
|
+
|
|
78
|
+
onMounted(() => {
|
|
79
|
+
addHandlers();
|
|
80
|
+
const trigger = triggerEl.value.children[0];
|
|
81
|
+
if (trigger) trigger.setAttribute('aria-describedby', props.id);
|
|
82
|
+
});
|
|
83
|
+
|
|
84
|
+
return {
|
|
85
|
+
style: useCssModule(),
|
|
86
|
+
hasTrigger,
|
|
87
|
+
isOpen,
|
|
88
|
+
mapClasses,
|
|
89
|
+
closeTooltip,
|
|
90
|
+
openTooltip,
|
|
91
|
+
popupEl,
|
|
92
|
+
triggerEl,
|
|
93
|
+
};
|
|
94
|
+
},
|
|
95
|
+
});
|
|
96
|
+
|
|
97
|
+
const _hoisted_1 = { ref: "triggerEl" };
|
|
98
|
+
|
|
99
|
+
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
100
|
+
const _component_cdr_popup = resolveComponent("cdr-popup");
|
|
101
|
+
|
|
102
|
+
return (openBlock(), createElementBlock("div", {
|
|
103
|
+
class: normalizeClass(_ctx.mapClasses(
|
|
104
|
+
_ctx.style, 'cdr-tooltip--wrapper', _ctx.hasTrigger && 'cdr-tooltip--position'
|
|
105
|
+
))
|
|
106
|
+
}, [
|
|
107
|
+
createElementVNode("div", _hoisted_1, [
|
|
108
|
+
renderSlot(_ctx.$slots, "trigger")
|
|
109
|
+
], 512 /* NEED_PATCH */),
|
|
110
|
+
createVNode(_component_cdr_popup, {
|
|
111
|
+
"content-class": _ctx.contentClass,
|
|
112
|
+
role: "tooltip",
|
|
113
|
+
ref: "popupEl",
|
|
114
|
+
position: _ctx.position,
|
|
115
|
+
"auto-position": _ctx.autoPosition,
|
|
116
|
+
opened: _ctx.isOpen,
|
|
117
|
+
id: _ctx.id,
|
|
118
|
+
onClosed: _ctx.closeTooltip
|
|
119
|
+
}, {
|
|
120
|
+
default: withCtx(() => [
|
|
121
|
+
renderSlot(_ctx.$slots, "default")
|
|
122
|
+
]),
|
|
123
|
+
_: 3 /* FORWARDED */
|
|
124
|
+
}, 8 /* PROPS */, ["content-class", "position", "auto-position", "opened", "id", "onClosed"])
|
|
125
|
+
], 2 /* CLASS */))
|
|
126
|
+
}
|
|
127
|
+
var CdrTooltip = /*#__PURE__*/_export_sfc(_sfc_main, [['render',_sfc_render]]);
|
|
128
|
+
|
|
129
|
+
export { CdrTooltip as default };
|