From dfbae91d5314dedea616b6af5a2fe0902cd66674 Mon Sep 17 00:00:00 2001 From: Stephanie Smith Date: Thu, 27 Jun 2024 20:14:11 -0700 Subject: [PATCH 1/5] configuring exports for @explorer-1/vue updating more import paths --- apps/vue-storybook/.storybook/preview.ts | 6 +- apps/vue-storybook/.storybook/themeStore.ts | 27 ++ apps/vue-storybook/.storybook/withGlobals.ts | 9 +- apps/vue-storybook/package.json | 6 +- apps/vue-storybook/tsconfig.json | 4 + packages/nuxt/package.json | 4 +- packages/nuxt/playground/eslint.config.mjs | 3 - packages/nuxt/playground/nuxt.config.ts | 2 +- packages/nuxt/playground/package.json | 4 - packages/nuxt/src/module.ts | 9 +- packages/nuxt/src/runtime/plugins/dayjs.js | 2 +- packages/nuxt/src/runtime/plugins/filters.ts | 2 +- packages/nuxt/src/runtime/store/header.ts | 2 +- packages/nuxt/src/runtime/store/theme.ts | 2 +- packages/vue/lib/main.ts | 335 +++++++++++++++++- packages/vue/package.json | 8 +- .../BaseHeading/BaseHeading.stories.js | 6 +- .../MixinFancybox/MixinFancyboxOpenButton.vue | 2 +- .../SwimlaneCTA/SwimlaneCTA.stories.mdx | 2 +- .../foundation/grid_layouthelpers.stories.js | 2 +- packages/vue/vite.config.ts | 21 +- pnpm-lock.yaml | 44 ++- 22 files changed, 432 insertions(+), 70 deletions(-) create mode 100644 apps/vue-storybook/.storybook/themeStore.ts delete mode 100644 packages/nuxt/playground/eslint.config.mjs diff --git a/apps/vue-storybook/.storybook/preview.ts b/apps/vue-storybook/.storybook/preview.ts index 54fa4684..45cf7614 100644 --- a/apps/vue-storybook/.storybook/preview.ts +++ b/apps/vue-storybook/.storybook/preview.ts @@ -8,12 +8,14 @@ import { Swiper, SwiperSlide } from 'swiper/vue' import vClickOutside from 'click-outside-vue3' import VueCompareImage from 'vue3-compare-image' import { createPinia } from 'pinia' -import filters from '@explorer-1/vue/src/utils/filters' +import filters from '@explorer-1/vue' import '@explorer-1/common-storybook/src/config/canvas.css' -import '@explorer-1/vue/src/assets/scss/styles.scss' +import '@explorer-1/common/src/scss/styles.scss' import { withGlobals, globalTypes } from './withGlobals' import customTheme from '@explorer-1/common-storybook/src/config/customTheme' import '@explorer-1/common-storybook/src/config/canvas.css' +import useThemeStore from '@explorer-1/vue' +type Explorer1Theme = 'defaultTheme' | 'ThemeInternal' | 'ThemeEdu' const pinia = createPinia() diff --git a/apps/vue-storybook/.storybook/themeStore.ts b/apps/vue-storybook/.storybook/themeStore.ts new file mode 100644 index 00000000..d3d900be --- /dev/null +++ b/apps/vue-storybook/.storybook/themeStore.ts @@ -0,0 +1,27 @@ +import { defineStore } from 'pinia' +type Explorer1Theme = 'defaultTheme' | 'ThemeInternal' | 'ThemeEdu' + +/** Sets the Explorer-1 theme + */ + +export interface State { + theme: Explorer1Theme | null +} + +export const useThemeStore = defineStore('theme', { + state: (): State => { + return { + theme: null + } + }, + actions: { + setTheme(value: Explorer1Theme) { + this.theme = value + } + }, + getters: { + isEdu(state) { + return state.theme === 'ThemeEdu' + } + } +}) diff --git a/apps/vue-storybook/.storybook/withGlobals.ts b/apps/vue-storybook/.storybook/withGlobals.ts index 61a81e39..975d4703 100644 --- a/apps/vue-storybook/.storybook/withGlobals.ts +++ b/apps/vue-storybook/.storybook/withGlobals.ts @@ -1,8 +1,8 @@ import { useEffect, useGlobals } from '@storybook/preview-api' -import { useThemeStore } from '@explorer-1/vue/src/store/theme' -import { type Explorer1Theme } from '@explorer-1/vue/src/interfaces' +import { useThemeStore } from './themeStore' +type Explorer1Theme = 'defaultTheme' | 'ThemeInternal' | 'ThemeEdu' -const getConfig = (config) => { +export const getConfig = (config) => { // default values let defaultMethod: string = 'css' let options: string[] | undefined = undefined @@ -40,6 +40,7 @@ const getConfig = (config) => { export const withGlobals = (StoryFn, context) => { const useTheme = useThemeStore() + // function useTheme((context) => useThemeStore) const { themesConfig, variantsConfig } = context.globals const { options, method } = getConfig(themesConfig) const { options: variantOptions, method: variantMethod } = getConfig(variantsConfig) @@ -119,7 +120,7 @@ export const withGlobals = (StoryFn, context) => { useEffect(() => { if (variant) { const savedVariant = window.localStorage.getItem('data-variant') - document.body.classList.remove(savedVariant) + if (savedVariant) document.body.classList.remove(savedVariant) document.body.classList.add(variant) window.localStorage.setItem('data-variant', variant) } diff --git a/apps/vue-storybook/package.json b/apps/vue-storybook/package.json index 871514d0..5559f3cd 100644 --- a/apps/vue-storybook/package.json +++ b/apps/vue-storybook/package.json @@ -29,6 +29,9 @@ "init-msw": "msw init public/" }, "dependencies": { + "@explorer-1/common": "workspace:*", + "@explorer-1/common-storybook": "workspace:*", + "@explorer-1/vue": "workspace:*", "@fancyapps/ui": "^4.0.26", "@tailwindcss/forms": "^0.5.7", "click-outside-vue3": "^4.0.1", @@ -38,12 +41,9 @@ "vue3-compare-image": "^1.2.5" }, "devDependencies": { - "@explorer-1/common": "workspace:*", - "@explorer-1/common-storybook": "workspace:*", "@explorer-1/html": "workspace:*", "@explorer-1/prettier-config": "workspace:*", "@explorer-1/tsconfig": "workspace:*", - "@explorer-1/vue": "workspace:*", "@rushstack/eslint-patch": "^1.2.0", "@storybook/addon-a11y": "^8.1.6", "@storybook/addon-essentials": "^8.1.6", diff --git a/apps/vue-storybook/tsconfig.json b/apps/vue-storybook/tsconfig.json index 1da5717b..025fc42c 100644 --- a/apps/vue-storybook/tsconfig.json +++ b/apps/vue-storybook/tsconfig.json @@ -1,5 +1,9 @@ { "extends": "@explorer-1/tsconfig/storybook.json", + "compilerOptions": { + "moduleResolution": "bundler", + "module": "ESNext" + }, "exclude": ["node_modules"], "include": ["./**/*"] } diff --git a/packages/nuxt/package.json b/packages/nuxt/package.json index 3841afe7..9e09d2ea 100644 --- a/packages/nuxt/package.json +++ b/packages/nuxt/package.json @@ -39,6 +39,8 @@ }, "prettier": "@explorer-1/prettier-config", "dependencies": { + "@explorer-1/common": "workspace:*", + "@explorer-1/vue": "workspace:*", "@fancyapps/ui": "^4.0.26", "@nuxt/kit": "^3.11.2", "@nuxtjs/tailwindcss": "^6.12.0", @@ -53,9 +55,7 @@ "vue3-compare-image": "^1.2.5" }, "devDependencies": { - "@explorer-1/common": "workspace:*", "@explorer-1/prettier-config": "workspace:*", - "@explorer-1/vue": "workspace:*", "@nuxt/devtools": "^1.2.0", "@nuxt/module-builder": "^0.7.0", "@nuxt/schema": "^3.11.2", diff --git a/packages/nuxt/playground/eslint.config.mjs b/packages/nuxt/playground/eslint.config.mjs deleted file mode 100644 index cc1e31a0..00000000 --- a/packages/nuxt/playground/eslint.config.mjs +++ /dev/null @@ -1,3 +0,0 @@ -import withNuxt from './.nuxt/eslint.config.mjs' -import config from '@explorer-1/eslint-config' -export default withNuxt().prepend(config) diff --git a/packages/nuxt/playground/nuxt.config.ts b/packages/nuxt/playground/nuxt.config.ts index e14e014a..a44f788f 100644 --- a/packages/nuxt/playground/nuxt.config.ts +++ b/packages/nuxt/playground/nuxt.config.ts @@ -1,5 +1,5 @@ export default defineNuxtConfig({ - modules: ['@nuxt/eslint', '../src/module'], + modules: ['../src/module'], explorer1: {}, devtools: { enabled: true } }) diff --git a/packages/nuxt/playground/package.json b/packages/nuxt/playground/package.json index 051eef65..df70d0b5 100644 --- a/packages/nuxt/playground/package.json +++ b/packages/nuxt/playground/package.json @@ -15,9 +15,5 @@ }, "dependencies": { "nuxt": "^3.11.2" - }, - "devDependencies": { - "@nuxt/eslint": "^0.3.13", - "@explorer-1/eslint-config": "workspace:*" } } diff --git a/packages/nuxt/src/module.ts b/packages/nuxt/src/module.ts index 3464f654..f6dc9ae3 100644 --- a/packages/nuxt/src/module.ts +++ b/packages/nuxt/src/module.ts @@ -93,7 +93,7 @@ export default defineNuxtModule({ }) } // types addImportsSources({ - from: '@explorer-1/vue/src/interfaces', + from: '@explorer-1/vue/interfaces', imports: ['ImageObject', 'Explorer1Theme'] }) if (options.includePageTemplates) { @@ -107,15 +107,14 @@ export default defineNuxtModule({ } if (options.includeStore) { await installModule('@pinia/nuxt', { - autoImports: ['useThemeStore'], - storesDirs: ['./store/**', resolver.resolve(runtimeDir, 'store')] + storesDirs: ['./store/**'] }) addImportsSources({ - from: '@explorer-1/vue/src/store/theme', + from: '@explorer-1/vue', imports: ['useThemeStore'] }) addImportsSources({ - from: '@explorer-1/vue/src/store/header', + from: '@explorer-1/vue', imports: ['useHeaderStore'] }) } diff --git a/packages/nuxt/src/runtime/plugins/dayjs.js b/packages/nuxt/src/runtime/plugins/dayjs.js index 1c49640a..cc98e714 100644 --- a/packages/nuxt/src/runtime/plugins/dayjs.js +++ b/packages/nuxt/src/runtime/plugins/dayjs.js @@ -1,2 +1,2 @@ -import dayjs from '@explorer-1/vue/src/utils/dayjs' +import dayjs from '@explorer-1/vue' export default dayjs diff --git a/packages/nuxt/src/runtime/plugins/filters.ts b/packages/nuxt/src/runtime/plugins/filters.ts index 1126a3cc..2e095a12 100644 --- a/packages/nuxt/src/runtime/plugins/filters.ts +++ b/packages/nuxt/src/runtime/plugins/filters.ts @@ -1,4 +1,4 @@ -import filters from '@explorer-1/vue/src/utils/filters' +import filters from '@explorer-1/vue' import { defineNuxtPlugin } from 'nuxt/app' export default defineNuxtPlugin((nuxtApp) => { diff --git a/packages/nuxt/src/runtime/store/header.ts b/packages/nuxt/src/runtime/store/header.ts index 0eb1d35d..c0497f85 100644 --- a/packages/nuxt/src/runtime/store/header.ts +++ b/packages/nuxt/src/runtime/store/header.ts @@ -1,3 +1,3 @@ -import { useHeaderStore } from '@explorer-1/vue/src/store/header' +import useHeaderStore from '@explorer-1/vue' export default useHeaderStore diff --git a/packages/nuxt/src/runtime/store/theme.ts b/packages/nuxt/src/runtime/store/theme.ts index 205e1489..ed731e35 100644 --- a/packages/nuxt/src/runtime/store/theme.ts +++ b/packages/nuxt/src/runtime/store/theme.ts @@ -1,3 +1,3 @@ -import { useThemeStore } from '@explorer-1/vue/src/store/theme' +import useThemeStore from '@explorer-1/vue' export default useThemeStore diff --git a/packages/vue/lib/main.ts b/packages/vue/lib/main.ts index 7f9057dc..bbf3d7a7 100644 --- a/packages/vue/lib/main.ts +++ b/packages/vue/lib/main.ts @@ -24,21 +24,188 @@ import { mixinFormatEventDates, mixinFormatEventTimeInHoursAndMinutes } from './../src/utils/mixins' + // components here +import AsteroidWatchWidget from './../src/components/AsteroidWatchWidget/AsteroidWatchWidget.vue' +import BackToTop from './../src/components/BackToTop/BackToTop.vue' +import BaseAudio from './../src/components/BaseAudio/BaseAudio.vue' import BaseButton from './../src/components/BaseButton/BaseButton.vue' -import BaseHeading from './../src/components/BaseButton/BaseButton.vue' +import BaseCheckboxGroup from './../src/components/BaseCheckboxGroup/BaseCheckboxGroup.vue' +import BaseHeading from './../src/components/BaseHeading/BaseHeading.vue' import BaseImage from './../src/components/BaseImage/BaseImage.vue' +import BaseImageCaption from './../src/components/BaseImageCaption/BaseImageCaption.vue' +import BaseImagePlaceholder from './../src/components/BaseImagePlaceholder/BaseImagePlaceholder.vue' +import BaseLightboxCloseButton from './../src/components/BaseLightboxCloseButton/BaseLightboxCloseButton.vue' +import BaseLightboxOpenButton from './../src/components/BaseLightboxOpenButton/BaseLightboxOpenButton.vue' import BaseLink from './../src/components/BaseLink/BaseLink.vue' +import BaseModal from './../src/components/BaseModal/BaseModal.vue' +import BasePlaceholder from './../src/components/BasePlaceholder/BasePlaceholder.vue' +import BaseRadioGroup from './../src/components/BaseRadioGroup/BaseRadioGroup.vue' +import BaseSwimlane from './../src/components/BaseSwimlane/BaseSwimlane.vue' +import BaseTag from './../src/components/BaseTag/BaseTag.vue' +import BaseTimer from './../src/components/BaseTimer/BaseTimer.vue' +import BaseUnitToggle from './../src/components/BaseUnitToggle/BaseUnitToggle.vue' +import BaseVideo from './../src/components/BaseVideo/BaseVideo.vue' +import BlockAnchor from './../src/components/BlockAnchor/BlockAnchor.vue' +import BlockAudio from './../src/components/BlockAudio/BlockAudio.vue' +import BlockCard from './../src/components/BlockCard/BlockCard.vue' +import BlockCardGroup from './../src/components/BlockCardGroup/BlockCardGroup.vue' +import BlockCircleImageCard from './../src/components/BlockCircleImageCard/BlockCircleImageCard.vue' +import BlockCta from './../src/components/BlockCta/BlockCta.vue' import BlockHeading from './../src/components/BlockHeading/BlockHeading.vue' +import BlockIframeEmbed from './../src/components/BlockIframeEmbed/BlockIframeEmbed.vue' import BlockImage from './../src/components/BlockImage/BlockImage.vue' import BlockImageFullBleed from './../src/components/BlockImage/BlockImageFullBleed.vue' import BlockImageStandard from './../src/components/BlockImage/BlockImageStandard.vue' +import BlockImageCarousel from './../src/components/BlockImageCarousel/BlockImageCarousel.vue' +import BlockImageCarouselItem from './../src/components/BlockImageCarouselItem/BlockImageCarouselItem.vue' +import BlockImageComparison from './../src/components/BlockImageComparison/BlockImageComparison.vue' +import BlockImageGallery from './../src/components/BlockImageGallery/BlockImageGallery.vue' +import BlockInlineImage from './../src/components/BlockInlineImage/BlockInlineImage.vue' +import BlockKeyPoints from './../src/components/BlockKeyPoints/BlockKeyPoints.vue' +import BlockLinkCard from './../src/components/BlockLinkCard/BlockLinkCard.vue' +import BlockLinkCarousel from './../src/components/BlockLinkCarousel/BlockLinkCarousel.vue' +import BlockLinkTile from './../src/components/BlockLinkTile/BlockLinkTile.vue' +import BlockListCards from './../src/components/BlockListCards/BlockListCards.vue' +import BlockQuote from './../src/components/BlockQuote/BlockQuote.vue' +import BlockRelatedLinks from './../src/components/BlockRelatedLinks/BlockRelatedLinks.vue' +import RelatedLink from './../src/components/BlockRelatedLinks/RelatedLink.vue' +import BlockStreamfield from './../src/components/BlockStreamfield/BlockStreamfield.vue' +import BlockTable from './../src/components/BlockTable/BlockTable.vue' +import BlockTeaser from './../src/components/BlockTeaser/BlockTeaser.vue' +import BlockText from './../src/components/BlockText/BlockText.vue' +import BlockTwitterEmbed from './../src/components/BlockTwitterEmbed/BlockTwitterEmbed.vue' +import BlockVideo from './../src/components/BlockVideo/BlockVideo.vue' +import BlockVideoEmbed from './../src/components/BlockVideoEmbed/BlockVideoEmbed.vue' +import CalendarButton from './../src/components/CalendarButton/CalendarButton.vue' +import DetailHeadline from './../src/components/DetailHeadline/DetailHeadline.vue' +import DsnWidget from './../src/components/DsnWidget/DsnWidget.vue' +import EventCard from './../src/components/EventCard/EventCard.vue' +import EventDetailHero from './../src/components/EventDetailHero/EventDetailHero.vue' +import FormContact from './../src/components/FormContact/FormContact.vue' +import FormNewsletterSignup from './../src/components/FormNewsletterSignup/FormNewsletterSignup.vue' +import HeroLarge from './../src/components/HeroLarge/HeroLarge.vue' +import HeroListingIndex from './../src/components/HeroListingIndex/HeroListingIndex.vue' +import HeroMedia from './../src/components/HeroMedia/HeroMedia.vue' +import HeroMedium from './../src/components/HeroMedium/HeroMedium.vue' +import HomepageCarousel from './../src/components/HomepageCarousel/HomepageCarousel.vue' +import HomepageCarouselItem from './../src/components/HomepageCarouselItem/HomepageCarouselItem.vue' +import HomepageEmbedBlock from './../src/components/HomepageEmbedBlock/HomepageEmbedBlock.vue' +import HomepageFeaturedRobot from './../src/components/HomepageFeaturedRobot/HomepageFeaturedRobot.vue' +import HomepageMissionsCarousel from './../src/components/HomepageMissionsCarousel/HomepageMissionsCarousel.vue' +import HomepageStats from './../src/components/HomepageStats/HomepageStats.vue' +import HomepageTeaserBlock from './../src/components/HomepageTeaserBlock/HomepageTeaserBlock.vue' +import Icon360 from './../src/components/Icons/Icon360.vue' +import IconArrow from './../src/components/Icons/IconArrow.vue' import IconArrows from './../src/components/Icons/IconArrows.vue' +import IconAudio from './../src/components/Icons/IconAudio.vue' +import IconBook from './../src/components/Icons/IconBook.vue' +import IconBookUser from './../src/components/Icons/IconBookUser.vue' +import IconBriefcase from './../src/components/Icons/IconBriefcase.vue' +import IconCalendar from './../src/components/Icons/IconCalendar.vue' import IconCaret from './../src/components/Icons/IconCaret.vue' +import IconCheckbox from './../src/components/Icons/IconCheckbox.vue' +import IconCheckboxSelected from './../src/components/Icons/IconCheckboxSelected.vue' +import IconClose from './../src/components/Icons/IconClose.vue' +import IconCloseLightbox from './../src/components/Icons/IconCloseLightbox.vue' +import IconDownload from './../src/components/Icons/IconDownload.vue' +import IconDropdown from './../src/components/Icons/IconDropdown.vue' +import IconEnvelope from './../src/components/Icons/IconEnvelope.vue' +import IconExpand from './../src/components/Icons/IconExpand.vue' +import IconExternal from './../src/components/Icons/IconExternal.vue' +import IconFilter from './../src/components/Icons/IconFilter.vue' +import IconForwardTen from './../src/components/Icons/IconForwardTen.vue' +import IconGrid from './../src/components/Icons/IconGrid.vue' +import IconHand from './../src/components/Icons/IconHand.vue' +import IconInfo from './../src/components/Icons/IconInfo.vue' +import IconLink from './../src/components/Icons/IconLink.vue' +import IconList from './../src/components/Icons/IconList.vue' import IconLocation from './../src/components/Icons/IconLocation.vue' +import IconMagnifyingGlass from './../src/components/Icons/IconMagnifyingGlass.vue' +import IconMedal from './../src/components/Icons/IconMedal.vue' +import IconMenu from './../src/components/Icons/IconMenu.vue' +import IconMinus from './../src/components/Icons/IconMinus.vue' +import IconMute from './../src/components/Icons/IconMute.vue' +import IconNext from './../src/components/Icons/IconNext.vue' +import IconPause from './../src/components/Icons/IconPause.vue' +import IconPlay from './../src/components/Icons/IconPlay.vue' +import IconPlus from './../src/components/Icons/IconPlus.vue' +import IconPrev from './../src/components/Icons/IconPrev.vue' +import IconRewindTen from './../src/components/Icons/IconRewindTen.vue' +import IconSearch from './../src/components/Icons/IconSearch.vue' +import IconShare from './../src/components/Icons/IconShare.vue' +import IconSlideshow from './../src/components/Icons/IconSlideshow.vue' +import IconSocialEmail from './../src/components/Icons/IconSocialEmail.vue' +import IconSocialFacebook from './../src/components/Icons/IconSocialFacebook.vue' +import IconSocialGoogleClassroom from './../src/components/Icons/IconSocialGoogleClassroom.vue' +import IconSocialInstagram from './../src/components/Icons/IconSocialInstagram.vue' +import IconSocialPinterest from './../src/components/Icons/IconSocialPinterest.vue' +import IconSocialReddit from './../src/components/Icons/IconSocialReddit.vue' +import IconSocialTwitter from './../src/components/Icons/IconSocialTwitter.vue' +import IconSocialYoutube from './../src/components/Icons/IconSocialYoutube.vue' +import IconStop from './../src/components/Icons/IconStop.vue' +import IconTime from './../src/components/Icons/IconTime.vue' +import IconUniversity from './../src/components/Icons/IconUniversity.vue' import IconUser from './../src/components/Icons/IconUser.vue' +import IconVolume from './../src/components/Icons/IconVolume.vue' +import ImageDetailContextImage from './../src/components/ImageDetailContextImage/ImageDetailContextImage.vue' +import LayoutHelper from './../src/components/LayoutHelper/LayoutHelper.vue' +import LoadingTransition from './../src/components/LoadingTransition/LoadingTransition.vue' +import LogoCaltech from './../src/components/LogoCaltech/LogoCaltech.vue' +import LogoTribrand from './../src/components/LogoTribrand/LogoTribrand.vue' +import MissionDetailAbout from './../src/components/MissionDetailAbout/MissionDetailAbout.vue' +import MissionDetailHero from './../src/components/MissionDetailHero/MissionDetailHero.vue' +import MissionDetailHighlights from './../src/components/MissionDetailHighlights/MissionDetailHighlights.vue' +import MissionDetailInlineImage from './../src/components/MissionDetailInlineImage/MissionDetailInlineImage.vue' +import MissionDetailStats from './../src/components/MissionDetailStats/MissionDetailStats.vue' +import MissionDetailStreamfield from './../src/components/MissionDetailStreamfield/MissionDetailStreamfield.vue' import MixinAnimationCaret from './../src/components/MixinAnimationCaret/MixinAnimationCaret.vue' +import MixinCarousel from './../src/components/MixinCarousel/MixinCarousel.vue' +import MixinDropdownToggle from './../src/components/MixinDropdownToggle/MixinDropdownToggle.vue' import MixinFancybox from './../src/components/MixinFancybox/MixinFancybox.vue' +import MixinVideoBg from './../src/components/MixinVideoBg/MixinVideoBg.vue' +import NavDesktop from './../src/components/NavDesktop/NavDesktop.vue' +import NavHeading from './../src/components/NavHeading/NavHeading.vue' +import NavHighlight from './../src/components/NavHighlight/NavHighlight.vue' +import NavLinkList from './../src/components/NavLinkList/NavLinkList.vue' +import NavLogoLinks from './../src/components/NavLogoLinks/NavLogoLinks.vue' +import NavMobile from './../src/components/NavMobile/NavMobile.vue' +import NavSearchForm from './../src/components/NavSearchForm/NavSearchForm.vue' +import NavSecondary from './../src/components/NavSecondary/NavSecondary.vue' +import NavSocial from './../src/components/NavSocial/NavSocial.vue' +import NewsDetailMediaContact from './../src/components/NewsDetailMediaContact/NewsDetailMediaContact.vue' +import ParallaxContainer from './../src/components/ParallaxContainer/ParallaxContainer.vue' +import ParallaxElement from './../src/components/ParallaxElement/ParallaxElement.vue' +import PastEventsCarousel from './../src/components/PastEventsCarousel/PastEventsCarousel.vue' +import PodcastEpisodeCard from './../src/components/PodcastEpisodeCard/PodcastEpisodeCard.vue' +import PodcastSeriesCarousel from './../src/components/PodcastSeriesCarousel/PodcastSeriesCarousel.vue' +import ProfileDetailSectionGroup from './../src/components/ProfileDetailSectionGroup/ProfileDetailSectionGroup.vue' +import RoboticsDetailStats from './../src/components/RoboticsDetailStats/RoboticsDetailStats.vue' +import SearchFilterGroup from './../src/components/SearchFilterGroup/SearchFilterGroup.vue' +import SearchInput from './../src/components/SearchInput/SearchInput.vue' +import SearchPagination from './../src/components/SearchPagination/SearchPagination.vue' +import SearchResultCard from './../src/components/SearchResultCard/SearchResultCard.vue' +import SearchResultGridItem from './../src/components/SearchResultGridItem/SearchResultGridItem.vue' +import SearchResultsList from './../src/components/SearchResultsList/SearchResultsList.vue' +import SearchSelectMenu from './../src/components/SearchSelectMenu/SearchSelectMenu.vue' +import ShareButtons from './../src/components/ShareButtons/ShareButtons.vue' +import ShareButtonsEdu from './../src/components/ShareButtonsEdu/ShareButtonsEdu.vue' +import SkipLink from './../src/components/SkipLink/SkipLink.vue' +// import SwimlaneCTA from './../src/components/SwimlaneCTA/SwimlaneCTA.vue' +import TheFooter from './../src/components/TheFooter/TheFooter.vue' +import ThumbnailCarousel from './../src/components/ThumbnailCarousel/ThumbnailCarousel.vue' +import TopicDetailMissionCarousel from './../src/components/TopicDetailMissionCarousel/TopicDetailMissionCarousel.vue' +import TopicDetailMissionCarouselItem from './../src/components/TopicDetailMissionCarouselItem/TopicDetailMissionCarouselItem.vue' +import TopicDetailMissionSpotlight from './../src/components/TopicDetailMissionSpotlight/TopicDetailMissionSpotlight.vue' +import TopicDetailMore from './../src/components/TopicDetailMore/TopicDetailMore.vue' +import TopicDetailMoreItem from './../src/components/TopicDetailMoreItem/TopicDetailMoreItem.vue' +import TopicDetailStreamfield from './../src/components/TopicDetailStreamfield/TopicDetailStreamfield.vue' +import YearTicker from './../src/components/YearTicker/YearTicker.vue' + +// page templates +import PageContent from './../src/templates/PageContent/PageContent.vue' +import PageEventDetail from './../src/templates/PageEventDetail/PageEventDetail.vue' +import PageNewsDetail from './../src/templates/PageNewsDetail/PageNewsDetail.vue' export { type Explorer1Theme, @@ -61,18 +228,182 @@ export { mixinFormatSplitEventDates, mixinFormatEventDates, mixinFormatEventTimeInHoursAndMinutes, + AsteroidWatchWidget, + BackToTop, + BaseAudio, BaseButton, + BaseCheckboxGroup, BaseHeading, BaseImage, + BaseImageCaption, + BaseImagePlaceholder, + BaseLightboxCloseButton, + BaseLightboxOpenButton, BaseLink, + BaseModal, + BasePlaceholder, + BaseRadioGroup, + BaseSwimlane, + BaseTag, + BaseTimer, + BaseUnitToggle, + BaseVideo, + BlockAnchor, + BlockAudio, + BlockCard, + BlockCardGroup, + BlockCircleImageCard, + BlockCta, BlockHeading, + BlockIframeEmbed, BlockImage, BlockImageFullBleed, BlockImageStandard, + BlockImageCarousel, + BlockImageCarouselItem, + BlockImageComparison, + BlockImageGallery, + BlockInlineImage, + BlockKeyPoints, + BlockLinkCard, + BlockLinkCarousel, + BlockLinkTile, + BlockListCards, + BlockQuote, + BlockRelatedLinks, + RelatedLink, + BlockStreamfield, + BlockTable, + BlockTeaser, + BlockText, + BlockTwitterEmbed, + BlockVideo, + BlockVideoEmbed, + CalendarButton, + DetailHeadline, + DsnWidget, + EventCard, + EventDetailHero, + FormContact, + FormNewsletterSignup, + HeroLarge, + HeroListingIndex, + HeroMedia, + HeroMedium, + HomepageCarousel, + HomepageCarouselItem, + HomepageEmbedBlock, + HomepageFeaturedRobot, + HomepageMissionsCarousel, + HomepageStats, + HomepageTeaserBlock, + Icon360, + IconArrow, IconArrows, + IconAudio, + IconBook, + IconBookUser, + IconBriefcase, + IconCalendar, IconCaret, + IconCheckbox, + IconCheckboxSelected, + IconClose, + IconCloseLightbox, + IconDownload, + IconDropdown, + IconEnvelope, + IconExpand, + IconExternal, + IconFilter, + IconForwardTen, + IconGrid, + IconHand, + IconInfo, + IconLink, + IconList, IconLocation, + IconMagnifyingGlass, + IconMedal, + IconMenu, + IconMinus, + IconMute, + IconNext, + IconPause, + IconPlay, + IconPlus, + IconPrev, + IconRewindTen, + IconSearch, + IconShare, + IconSlideshow, + IconSocialEmail, + IconSocialFacebook, + IconSocialGoogleClassroom, + IconSocialInstagram, + IconSocialPinterest, + IconSocialReddit, + IconSocialTwitter, + IconSocialYoutube, + IconStop, + IconTime, + IconUniversity, IconUser, + IconVolume, + ImageDetailContextImage, + LayoutHelper, + LoadingTransition, + LogoCaltech, + LogoTribrand, + MissionDetailAbout, + MissionDetailHero, + MissionDetailHighlights, + MissionDetailInlineImage, + MissionDetailStats, + MissionDetailStreamfield, MixinAnimationCaret, - MixinFancybox + MixinCarousel, + MixinDropdownToggle, + MixinFancybox, + MixinVideoBg, + NavDesktop, + NavHeading, + NavHighlight, + NavLinkList, + NavLogoLinks, + NavMobile, + NavSearchForm, + NavSecondary, + NavSocial, + NewsDetailMediaContact, + ParallaxContainer, + ParallaxElement, + PastEventsCarousel, + PodcastEpisodeCard, + PodcastSeriesCarousel, + ProfileDetailSectionGroup, + RoboticsDetailStats, + SearchFilterGroup, + SearchInput, + SearchPagination, + SearchResultCard, + SearchResultGridItem, + SearchResultsList, + SearchSelectMenu, + ShareButtons, + ShareButtonsEdu, + SkipLink, + // SwimlaneCTA, + TheFooter, + ThumbnailCarousel, + TopicDetailMissionCarousel, + TopicDetailMissionCarouselItem, + TopicDetailMissionSpotlight, + TopicDetailMore, + TopicDetailMoreItem, + TopicDetailStreamfield, + YearTicker, + PageContent, + PageEventDetail, + PageNewsDetail } diff --git a/packages/vue/package.json b/packages/vue/package.json index ed66d001..3ae7c252 100644 --- a/packages/vue/package.json +++ b/packages/vue/package.json @@ -11,6 +11,11 @@ }, "version": "0.0.0", "type": "module", + "exports": { + ".": { + "import": "./dist/explorer-1-vue.umd.cjs" + } + }, "scripts": { "dev": "pnpm prepare && vite", "build": "pnpm prepare && vue-tsc && vite build", @@ -24,6 +29,7 @@ }, "prettier": "@explorer-1/prettier-config", "dependencies": { + "@explorer-1/common": "workspace:*", "@fancyapps/ui": "^4.0.26", "@tailwindcss/forms": "^0.5.7", "animejs": "^3.2.2", @@ -37,10 +43,10 @@ "tailwindcss": "^3.4.3", "twitter-widgets": "^2.0.0", "vue": "^3.4.21", + "vue-observe-visibility": "^1.0.0", "vue3-compare-image": "^1.2.5" }, "devDependencies": { - "@explorer-1/common": "workspace:*", "@explorer-1/prettier-config": "workspace:*", "@vitejs/plugin-vue": "^5.0.4", "autoprefixer": "^10.4.19", diff --git a/packages/vue/src/components/BaseHeading/BaseHeading.stories.js b/packages/vue/src/components/BaseHeading/BaseHeading.stories.js index 0c81d43b..c312a70f 100644 --- a/packages/vue/src/components/BaseHeading/BaseHeading.stories.js +++ b/packages/vue/src/components/BaseHeading/BaseHeading.stories.js @@ -1,7 +1,7 @@ import BaseHeading from './BaseHeading.vue' -import IconArrows from '@explorer-1/vue/src/components/Icons/IconArrows.vue' -import IconLocation from '@explorer-1/vue/src/components/Icons/IconLocation.vue' -import IconUser from '@explorer-1/vue/src/components/Icons/IconUser.vue' +import IconArrows from './../Icons/IconArrows.vue' +import IconLocation from './../Icons/IconLocation.vue' +import IconUser from './../Icons/IconUser.vue' export default { title: 'Components/Base/BaseHeading', diff --git a/packages/vue/src/components/MixinFancybox/MixinFancyboxOpenButton.vue b/packages/vue/src/components/MixinFancybox/MixinFancyboxOpenButton.vue index 80f8092d..98c71f60 100644 --- a/packages/vue/src/components/MixinFancybox/MixinFancyboxOpenButton.vue +++ b/packages/vue/src/components/MixinFancybox/MixinFancyboxOpenButton.vue @@ -1,6 +1,6 @@