diff --git a/.changeset/README.md b/.changeset/README.md new file mode 100644 index 00000000..e5b6d8d6 --- /dev/null +++ b/.changeset/README.md @@ -0,0 +1,8 @@ +# Changesets + +Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works +with multi-package repos, or single-package repos to help you version and publish your code. You can +find the full documentation for it [in our repository](https://github.com/changesets/changesets) + +We have a quick list of common questions to get you started engaging with this project in +[our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md) diff --git a/.changeset/config.json b/.changeset/config.json new file mode 100644 index 00000000..edef2ebc --- /dev/null +++ b/.changeset/config.json @@ -0,0 +1,11 @@ +{ + "$schema": "https://unpkg.com/@changesets/config@3.0.3/schema.json", + "changelog": "@changesets/cli/changelog", + "commit": false, + "fixed": [], + "linked": [], + "access": "restricted", + "baseBranch": "main", + "updateInternalDependencies": "patch", + "ignore": [] +} diff --git a/.changeset/fast-tips-train.md b/.changeset/fast-tips-train.md new file mode 100644 index 00000000..1df062c3 --- /dev/null +++ b/.changeset/fast-tips-train.md @@ -0,0 +1,5 @@ +--- +"@explorer-1/vue": patch +--- + +upgrades packages to match www/frontend, fixes misc bugs for edu launch diff --git a/.github/workflows/changeset.yml b/.github/workflows/changeset.yml new file mode 100644 index 00000000..f262a857 --- /dev/null +++ b/.github/workflows/changeset.yml @@ -0,0 +1,37 @@ +name: Changeset + +on: + push: + branches: + - main + paths: + - '.changeset/**' + +concurrency: ${{ github.workflow }}-${{ github.ref }} + +jobs: + release: + name: Changeset + runs-on: ubuntu-latest + steps: + - name: Checkout Repo + uses: actions/checkout@v3 + + - name: Setup Node.js 20 + uses: actions/setup-node@v3 + with: + node-version: 20.18.0 + + - uses: pnpm/action-setup@v2 + name: Install pnpm + with: + version: 9 + run_install: false + + - name: Install dependencies + run: pnpm install + + - name: Create Release Pull Request + uses: changesets/action@v1 + env: + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} \ No newline at end of file diff --git a/.nvmrc b/.nvmrc index 78a94959..67e145bf 100644 --- a/.nvmrc +++ b/.nvmrc @@ -1 +1 @@ -v20.15.1 \ No newline at end of file +v20.18.0 diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 81072dd1..2096e859 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -2,19 +2,28 @@ Documentation on how to run this project locally and add more components. -- [Getting started](#getting-started) - - [View the test page](#view-the-test-page) - - [View the Storybook](#view-the-storybook) - - [Testing your changes as a dependency in another project](#testing-your-changes-as-a-dependency-in-another-project) - - [Percy](#percy) -- [Adding components](#adding-components) - - [Storybook](#storybook) - - [SCSS](#scss) - - [JavaScript](#javascript) -- [Linting and Formatting](#linting-and-formatting) -- [Pull request guidance](#pull-request-guidance) -- [Publishing to npm](#publishing-to-npm) -- [Contribution licensing](#contribution-licensing) +- [For contributing developers](#for-contributing-developers) + - [Getting started](#getting-started) + - [View the test page](#view-the-test-page) + - [View the Storybook](#view-the-storybook) + - [Testing your changes as a dependency in another project](#testing-your-changes-as-a-dependency-in-another-project) + - [Percy](#percy) + - [Adding components](#adding-components) + - [Storybook](#storybook) + - [Adding a component story](#adding-a-component-story) + - [Reusing another component template](#reusing-another-component-template) + - [Decorators](#decorators) + - [Rebuilding assets](#rebuilding-assets) + - [SCSS](#scss) + - [Adding SCSS](#adding-scss) + - [Using Node modules](#using-node-modules) + - [JavaScript](#javascript) + - [Adding to scripts.js](#adding-to-scriptsjs) + - [Using Node modules](#using-node-modules-1) + - [Linting and Formatting](#linting-and-formatting) + - [Pull request guidance](#pull-request-guidance) + - [Publishing to npm](#publishing-to-npm) + - [Contribution licensing](#contribution-licensing) ## Getting started diff --git a/Makefile b/Makefile index 1730fe4b..26e12429 100644 --- a/Makefile +++ b/Makefile @@ -31,7 +31,6 @@ else @make nvm-use @echo '⏳ it can take a few minutes to install all of the $(YELLOW)node_modules$(RESET)' @echo '🙆 this could be a good opportunity to have a stretch... ' - @echo '⏭️ postinstall will check $(GREEN)workspaces$(RESET) with $(YELLOW)manypkg$(RESET)...' endif nvm: @@ -47,6 +46,10 @@ i: install clean: pnpm run clean +## Version: Create a Changeset (walkthrough versioning) +changeset: + pnpm run changeset + ## Refresh: remove node_modules and install refresh: pnpm run refresh diff --git a/README.md b/README.md index 56fef39d..fbb1d07c 100644 --- a/README.md +++ b/README.md @@ -55,21 +55,26 @@ make html-storybook ## Table of contents -- [Version 3.x.x docs (draft)](#version-3xx-docs-draft) - - [Publishing to npm](#publishing-to-npm) - - [Developing Vue components](#developing-vue-components) -- [What's included](#whats-included) -- [Installation](#installation) -- [Using bundled assets](#using-bundled-assets) - - [CSS and JS](#css-and-js) - - [Fonts](#fonts) -- [Compile your own: Using assets a la carte](#compile-your-own-using-assets-a-la-carte) - - [Styles](#styles) - - [JavaScript](#javascript) - - [Additional requirements for carousels](#additional-requirements-for-carousels) - - [Additional requirements for modals and lightboxes](#additional-requirements-for-modals-and-lightboxes) -- [Component templates (HTML)](#component-templates-html) -- [For contributing developers](#for-contributing-developers) +- [Explorer 1: JPL's Design System](#explorer-1-jpls-design-system) + - [Version 3.x.x docs (draft)](#version-3xx-docs-draft) + - [Publishing to npm](#publishing-to-npm) + - [Developing Vue components](#developing-vue-components) + - [Table of contents](#table-of-contents) + - [What's included](#whats-included) + - [Installation](#installation) + - [Using bundled assets](#using-bundled-assets) + - [CSS and JS](#css-and-js) + - [Fonts](#fonts) + - [Compile your own: Using assets a la carte](#compile-your-own-using-assets-a-la-carte) + - [Styles](#styles) + - [Using the Explorer 1 Tailwind config](#using-the-explorer-1-tailwind-config) + - [Importing SCSS files](#importing-scss-files) + - [Preloading Fonts](#preloading-fonts) + - [JavaScript](#javascript) + - [Additional requirements for carousels](#additional-requirements-for-carousels) + - [Additional requirements for modals and lightboxes](#additional-requirements-for-modals-and-lightboxes) + - [Component templates (HTML)](#component-templates-html) + - [For contributing developers](#for-contributing-developers) ## What's included diff --git a/apps/html-storybook/package.json b/apps/html-storybook/package.json index 84f3815a..553da0b4 100644 --- a/apps/html-storybook/package.json +++ b/apps/html-storybook/package.json @@ -12,7 +12,7 @@ "url": "https://github.com/nasa-jpl/explorer-1" }, "engines": { - "node": "^20.13.1", + "node": "^20.18.0", "npm": "^10.5.2" }, "prettier": "@explorer-1/prettier-config", @@ -53,18 +53,18 @@ "@storybook/preview-api": "^8.3.5", "@storybook/theming": "^8.3.5", "@whitespace/storybook-addon-html": "^6.1.1", - "autoprefixer": "^10.4.19", + "autoprefixer": "^10.4.20", "npm-run-all": "^4.1.5", "postcss": "^8.4.38", "postcss-import": "^16.1.0", "remark-gfm": "^4.0.0", - "rimraf": "^5.0.5", + "rimraf": "^6.0.1", "storybook": "^8.3.5", - "tailwindcss": "^3.4.3", + "tailwindcss": "^3.4.14", "ts-node": "^10.9.2", "tslib": "^2.6.2", - "typescript": "^5.4.5", - "vite": "^5.3.1" + "typescript": "^5.6.3", + "vite": "^5.4.10" }, "overrides": { "react-remove-scroll": { diff --git a/apps/vue-storybook/package.json b/apps/vue-storybook/package.json index 152db7a6..e739c182 100644 --- a/apps/vue-storybook/package.json +++ b/apps/vue-storybook/package.json @@ -38,15 +38,15 @@ "@explorer-1/common-storybook": "workspace:*", "@explorer-1/vue": "workspace:*", "@fancyapps/ui": "^4.0.26", - "@tailwindcss/forms": "^0.5.7", + "@tailwindcss/forms": "^0.5.9", "click-outside-vue3": "^4.0.1", - "dayjs": "^1.11.11", + "dayjs": "^1.11.13", "mitt": "^3.0.1", "swiper": "^11.1.3", - "vue": "^3.5.3", + "vue": "^3.5.12", "vue-bind-once": "^0.2.1", "vue3-compare-image": "^1.2.5", - "vue3-observe-visibility": "^1.0.1" + "vue3-observe-visibility": "^1.0.2" }, "devDependencies": { "@chromatic-com/storybook": "^1", @@ -65,27 +65,27 @@ "@storybook/theming": "^8.3.5", "@storybook/vue3": "^8.3.5", "@storybook/vue3-vite": "^8.3.5", - "@vitejs/plugin-vue": "^5.0.4", - "@vue/eslint-config-prettier": "^7.1.0", + "@vitejs/plugin-vue": "^5.1.4", + "@vue/eslint-config-prettier": "^10.1.0", "@whitespace/storybook-addon-html": "^6.1.1", - "a11y-dialog": "^8.1.0", - "autoprefixer": "^10.4.19", - "axe-playwright": "^2.0.1", - "chromatic": "^11.5.5", + "a11y-dialog": "^8.1.1", + "autoprefixer": "^10.4.20", + "axe-playwright": "^2.0.3", + "chromatic": "^11.16.5", "http-server": "^14.1.1", - "msw": "^2.3.0", + "msw": "^2.6.0", "msw-storybook-addon": "^2.0.2", "pinia": "^2.1.7", - "postcss": "^8.4.38", + "postcss": "^8.4.47", "postcss-import": "^16.1.0", - "rimraf": "^5.0.5", + "rimraf": "^6.0.1", "storybook": "^8.3.5", "storybook-addon-vue-slots": "^0.9.29", - "tailwindcss": "^3.4.3", + "tailwindcss": "^3.4.14", "ts-node": "^10.9.2", - "typescript": "^5.4.5", - "unplugin-vue-components": "^0.27.0", - "vite": "^5.3.1", - "vue-tsc": "^2.0.6" + "typescript": "^5.6.3", + "unplugin-vue-components": "^0.27.4", + "vite": "^5.4.10", + "vue-tsc": "^2.1.10" } } diff --git a/apps/vue-storybook/vite.config.ts b/apps/vue-storybook/vite.config.ts index 05f8da8f..fc35c039 100644 --- a/apps/vue-storybook/vite.config.ts +++ b/apps/vue-storybook/vite.config.ts @@ -1,5 +1,5 @@ -import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' +import { defineConfig } from 'vite' // import Components from 'unplugin-vue-components/vite' export default defineConfig({ @@ -26,5 +26,19 @@ export default defineConfig({ build: { // storybook-only modulePreload: false + }, + css: { + preprocessorOptions: { + scss: { + silenceDeprecations: [ + // Deprecation Warning: https://sass-lang.com/d/mixed-decls + 'mixed-decls', + // Deprecation Warning: https://sass-lang.com/d/import + 'import', + // Deprecation Warning: https://sass-lang.com/d/legacy-js-api + 'legacy-js-api' + ] + } + } } }) diff --git a/package.json b/package.json index a1b6ef7b..95bacc85 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,7 @@ "url": "https://github.com/nasa-jpl/explorer-1" }, "scripts": { + "changeset": "pnpm exec changeset", "clean": "pnpm clean:nodemodules && pnpm clean:dist && pnpm clean:nuxt", "clean:nodemodules": "rimraf \"**/node_modules\"", "clean:cache": "rimraf \"**/.cache\"", @@ -36,7 +37,7 @@ "lint:fix": "pnpm run -r --if-present lint:fix" }, "engines": { - "node": "^20.13.1", + "node": "^20.18.0", "pnpm": ">=9.1.1", "npm": "please-use-pnpm", "yarn": "please-use-pnpm" @@ -50,6 +51,10 @@ "@explorer-1/vue-storybook": "workspace:^", "@types/node": "^20.12.12" }, + "dependencies": { + "@changesets/changelog-github": "^0.5.0", + "@changesets/cli": "^2.27.9" + }, "resolutions": { "jackspeak": "2.1.1" }, diff --git a/packages/common-storybook/package.json b/packages/common-storybook/package.json index 0b29e4b8..d1bdc828 100644 --- a/packages/common-storybook/package.json +++ b/packages/common-storybook/package.json @@ -15,8 +15,8 @@ "@explorer-1/common": "workspace:*", "@explorer-1/prettier-config": "workspace:*", "@explorer-1/tsconfig": "workspace:*", - "rimraf": "^5.0.5", + "rimraf": "^6.0.1", "ts-node": "^10.9.2", - "typescript": "^5.4.5" + "typescript": "^5.6.3" } } diff --git a/packages/configs/eslint/package.json b/packages/configs/eslint/package.json index af62e30a..73fd5cc1 100644 --- a/packages/configs/eslint/package.json +++ b/packages/configs/eslint/package.json @@ -16,15 +16,15 @@ "prettier": "@explorer-1/prettier-config", "devDependencies": { "@eslint/eslintrc": "^3.1.0", - "@eslint/js": "^9.3.0", - "@stylistic/eslint-plugin": "^2.1.0", - "@typescript-eslint/eslint-plugin": "^7.10.0", - "@typescript-eslint/parser": "^7.10.0", - "eslint": "^9.3.0", + "@eslint/js": "^9.14.0", + "@stylistic/eslint-plugin": "^2.10.1", + "@typescript-eslint/eslint-plugin": "^8.13.0", + "@typescript-eslint/parser": "^8.13.0", + "eslint": "^9.14.0", "eslint-config-prettier": "^9.1.0", - "eslint-plugin-prettier": "^5.1.3", + "eslint-plugin-prettier": "^5.2.1", "eslint-plugin-storybook": "^0.8.0", - "eslint-plugin-vue": "^9.26.0", - "vue-eslint-parser": "^9.4.2" + "eslint-plugin-vue": "^9.30.0", + "vue-eslint-parser": "^9.4.3" } } diff --git a/packages/html/package.json b/packages/html/package.json index ee54bc01..c757e6c4 100644 --- a/packages/html/package.json +++ b/packages/html/package.json @@ -36,10 +36,10 @@ "devDependencies": { "@explorer-1/common": "workspace:*", "@explorer-1/prettier-config": "workspace:*", - "autoprefixer": "^10.4.19", - "lazysizes": "^5.3.0", + "autoprefixer": "^10.4.20", + "lazysizes": "^5.3.2", "postcss-import": "^16.1.0", - "typescript": "^5.4.5", - "vite": "^5.3.1" + "typescript": "^5.6.3", + "vite": "^5.4.10" } } diff --git a/packages/nuxt/package.json b/packages/nuxt/package.json index 2da3e25b..e6861dab 100644 --- a/packages/nuxt/package.json +++ b/packages/nuxt/package.json @@ -41,28 +41,28 @@ "@explorer-1/common": "workspace:*", "@explorer-1/vue": "workspace:*", "@fancyapps/ui": "^4.0.26", - "@nuxt/kit": "^3.11.2", - "@nuxtjs/tailwindcss": "^6.12.0", - "@pinia/nuxt": "^0.5.1", + "@nuxt/kit": "^3.13.2", + "@nuxtjs/tailwindcss": "^6.12.2", + "@pinia/nuxt": "^0.5.0", "@tailwindcss/forms": "^0.5.7", "click-outside-vue3": "^4.0.1", "datebook": "^8.0.1", - "dayjs": "^1.11.11", + "dayjs": "^1.11.13", "lodash": "^4.17.21", - "qs": "^6.12.1", + "qs": "^6.13.0", "swiper": "^11.1.3", "vue3-compare-image": "^1.2.5" }, "devDependencies": { "@explorer-1/prettier-config": "workspace:*", - "@nuxt/devtools": "^1.2.0", - "@nuxt/module-builder": "^0.7.0", - "@nuxt/schema": "^3.11.2", - "@nuxt/test-utils": "^3.12.1", - "@types/node": "^20.12.11", + "@nuxt/devtools": "^1.6.0", + "@nuxt/module-builder": "^0.8.4", + "@nuxt/schema": "^3.13.2", + "@nuxt/test-utils": "^3.13.2", + "@types/node": "^22.9.0", "changelogen": "^0.5.5", - "nuxt": "^3.11.2", - "typescript": "^5.4.5", - "vue-tsc": "^2.0.6" + "nuxt": "^3.13.2", + "typescript": "^5.6.3", + "vue-tsc": "^2.1.10" } } diff --git a/packages/nuxt/playground/package.json b/packages/nuxt/playground/package.json index df70d0b5..40e79f0b 100644 --- a/packages/nuxt/playground/package.json +++ b/packages/nuxt/playground/package.json @@ -14,6 +14,6 @@ "lint:fix": "eslint --fix" }, "dependencies": { - "nuxt": "^3.11.2" + "nuxt": "^3.13.2" } } diff --git a/packages/vue/package.json b/packages/vue/package.json index 7f6a902c..4eb5fd59 100644 --- a/packages/vue/package.json +++ b/packages/vue/package.json @@ -25,34 +25,35 @@ "dependencies": { "@explorer-1/common": "workspace:*", "@fancyapps/ui": "^4.0.26", - "@tailwindcss/forms": "^0.5.7", + "@tailwindcss/forms": "^0.5.9", "animejs": "^3.2.2", "click-outside-vue3": "^4.0.1", "datebook": "^8.0.1", - "dayjs": "^1.11.11", + "dayjs": "^1.11.13", "fast-qs": "^2.0.3", "lodash": "^4.17.21", "mitt": "^3.0.1", - "sass": "^1.77.4", + "sass": "^1.80.5", "swiper": "^11.1.3", - "tailwindcss": "^3.4.3", + "tailwindcss": "^3.4.14", "twitter-widgets": "^2.0.0", - "vue": "^3.5.3", + "vue": "^3.5.12", "vue-bind-once": "^0.2.1", "vue3-compare-image": "^1.2.5", - "vue3-observe-visibility": "^1.0.1" + "vue3-observe-visibility": "^1.0.2" }, "devDependencies": { "@explorer-1/prettier-config": "workspace:*", - "@vitejs/plugin-vue": "^5.0.4", - "a11y-dialog": "^8.1.0", - "autoprefixer": "^10.4.19", - "postcss": "^8.4.38", + "@vitejs/plugin-vue": "^5.1.4", + "a11y-dialog": "^8.1.1", + "autoprefixer": "^10.4.20", + "eslint": "^9.14.0", + "postcss": "^8.4.47", "postcss-import": "^16.1.0", - "typescript": "^5.4.5", - "unplugin-vue-components": "^0.27.0", - "vite": "^5.3.1", - "vite-plugin-dts": "^3.9.1", - "vue-tsc": "^2.0.6" + "typescript": "^5.6.3", + "unplugin-vue-components": "^0.27.4", + "vite": "^5.4.10", + "vite-plugin-dts": "^4.3.0", + "vue-tsc": "^2.1.10" } } diff --git a/packages/vue/src/components/BlockImageCarousel/BlockImageCarousel.vue b/packages/vue/src/components/BlockImageCarousel/BlockImageCarousel.vue index 4d2c0efc..d972dcaa 100644 --- a/packages/vue/src/components/BlockImageCarousel/BlockImageCarousel.vue +++ b/packages/vue/src/components/BlockImageCarousel/BlockImageCarousel.vue @@ -52,7 +52,7 @@ > @@ -60,17 +60,17 @@