diff --git a/config/data/paragonUtils.js b/config/data/paragonUtils.js index 8cc32825c..7bd33a016 100644 --- a/config/data/paragonUtils.js +++ b/config/data/paragonUtils.js @@ -9,7 +9,7 @@ const fs = require('fs'); * @returns {string} Paragon dependency version of the consuming application */ function getParagonVersion(dir, { isBrandOverride = false } = {}) { - const npmPackageName = isBrandOverride ? '@edx/brand' : '@edx/paragon'; + const npmPackageName = isBrandOverride ? '@edx/brand' : '@openedx/paragon'; const pathToPackageJson = `${dir}/node_modules/${npmPackageName}/package.json`; if (!fs.existsSync(pathToPackageJson)) { return undefined; @@ -38,12 +38,12 @@ function getParagonVersion(dir, { isBrandOverride = false } = {}) { */ /** - * Attempts to extract the Paragon theme CSS from the locally installed `@edx/paragon` package. + * Attempts to extract the Paragon theme CSS from the locally installed `@openedx/paragon` package. * @param {string} dir Path to directory containing `node_modules`. * @returns {ParagonThemeCss} */ function getParagonThemeCss(dir, { isBrandOverride = false } = {}) { - const npmPackageName = isBrandOverride ? '@edx/brand' : '@edx/paragon'; + const npmPackageName = isBrandOverride ? '@edx/brand' : '@openedx/paragon'; const pathToParagonThemeOutput = path.resolve(dir, 'node_modules', npmPackageName, 'dist', 'theme-urls.json'); if (!fs.existsSync(pathToParagonThemeOutput)) { @@ -128,8 +128,8 @@ function getParagonCacheGroups(paragonThemeCss) { * @param {ParagonThemeCss} paragonThemeCss The Paragon theme CSS metadata. * @returns {Object.} The entry points for the Paragon theme CSS. Example: ``` * { - * "paragon.theme.core": "/path/to/node_modules/@edx/paragon/dist/core.min.css", - * "paragon.theme.variants.light": "/path/to/node_modules/@edx/paragon/dist/light.min.css" + * "paragon.theme.core": "/path/to/node_modules/@openedx/paragon/dist/core.min.css", + * "paragon.theme.variants.light": "/path/to/node_modules/@openedx/paragon/dist/light.min.css" * } * ``` */ diff --git a/config/webpack.common.config.js b/config/webpack.common.config.js index 6da491a9c..0acfc4ed8 100644 --- a/config/webpack.common.config.js +++ b/config/webpack.common.config.js @@ -17,8 +17,8 @@ module.exports = { /** * The entry points for the Paragon theme CSS. Example: ``` * { - * "paragon.theme.core": "/path/to/node_modules/@edx/paragon/dist/core.min.css", - * "paragon.theme.variants.light": "/path/to/node_modules/@edx/paragon/dist/light.min.css" + * "paragon.theme.core": "/path/to/node_modules/@openedx/paragon/dist/core.min.css", + * "paragon.theme.variants.light": "/path/to/node_modules/@openedx/paragon/dist/light.min.css" * } */ ...getParagonEntryPoints(paragonThemeCss), diff --git a/config/webpack.dev.config.js b/config/webpack.dev.config.js index 7a97a0794..5a49039cf 100644 --- a/config/webpack.dev.config.js +++ b/config/webpack.dev.config.js @@ -4,7 +4,6 @@ const ImageMinimizerPlugin = require('image-minimizer-webpack-plugin'); const MiniCssExtractPlugin = require('mini-css-extract-plugin'); const { merge } = require('webpack-merge'); const Dotenv = require('dotenv-webpack'); -const dotenv = require('dotenv'); const HtmlWebpackPlugin = require('html-webpack-plugin'); const path = require('path'); const PostCssAutoprefixerPlugin = require('autoprefixer'); @@ -17,12 +16,6 @@ const presets = require('../lib/presets'); const resolvePrivateEnvConfig = require('../lib/resolvePrivateEnvConfig'); const getLocalAliases = require('./getLocalAliases'); -// Add process env vars. Currently used only for setting the -// server port and the publicPath -dotenv.config({ - path: path.resolve(process.cwd(), '.env.development'), -}); - // Allow private/local overrides of env vars from .env.development for config settings // that you'd like to persist locally during development, without the risk of checking // in temporary modifications to .env.development. @@ -109,7 +102,7 @@ module.exports = merge(commonConfig, { test: /(.scss|.css)$/, oneOf: [ { - resource: /(@edx\/paragon|@edx\/brand)/, + resource: /(@openedx\/paragon|@edx\/brand)/, use: [ MiniCssExtractPlugin.loader, ...getStyleUseConfig(), diff --git a/example/package-lock.json b/example/package-lock.json index 5419157a3..2051f414b 100644 --- a/example/package-lock.json +++ b/example/package-lock.json @@ -11,7 +11,7 @@ "dependencies": { "@edx/brand": "npm:@openedx/brand-openedx@1.2.3", "@edx/frontend-platform": "8.0.2", - "@edx/paragon": "npm:@openedx/paragon@22.0.0-alpha.25", + "@openedx/paragon": "22.0.0-alpha.25", "react": "17.0.2", "react-dom": "17.0.2", "react-redux": "7.2.9", @@ -2231,144 +2231,6 @@ "@newrelic/publish-sourcemap": "^5.0.1" } }, - "node_modules/@edx/paragon": { - "name": "@openedx/paragon", - "version": "22.0.0-alpha.25", - "resolved": "https://registry.npmjs.org/@openedx/paragon/-/paragon-22.0.0-alpha.25.tgz", - "integrity": "sha512-Eml6g8u3+HHnji7MWaeqD1OjoedKTFb/xpNjz3HI+MZohfVHwUTs6hUSim41WWlclYk72XGZ5BRDNm+kK2p3xA==", - "dependencies": { - "@popperjs/core": "^2.11.4", - "axios": "^0.27.2", - "bootstrap": "^4.6.2", - "chalk": "^4.1.2", - "child_process": "^1.0.2", - "chroma-js": "^2.4.2", - "classnames": "^2.3.1", - "cli-progress": "^3.12.0", - "commander": "^9.4.1", - "email-prop-type": "^3.0.0", - "file-selector": "^0.6.0", - "glob": "^8.0.3", - "inquirer": "^8.2.5", - "lodash.uniqby": "^4.7.0", - "log-update": "^4.0.0", - "mailto-link": "^2.0.0", - "minimist": "^1.2.8", - "ora": "^5.4.1", - "postcss": "^8.4.21", - "postcss-combine-duplicated-selectors": "^10.0.3", - "postcss-custom-media": "^9.1.2", - "postcss-import": "^15.1.0", - "postcss-map": "^0.11.0", - "postcss-minify": "^1.1.0", - "prop-types": "^15.8.1", - "react-bootstrap": "^1.6.5", - "react-colorful": "^5.6.1", - "react-dropzone": "^14.2.1", - "react-focus-on": "^3.5.4", - "react-imask": "^7.1.3", - "react-loading-skeleton": "^3.1.0", - "react-popper": "^2.2.5", - "react-proptype-conditional-require": "^1.0.4", - "react-responsive": "^8.2.0", - "react-table": "^7.7.0", - "react-transition-group": "^4.4.2", - "sass": "^1.58.3", - "style-dictionary": "^3.7.1", - "tabbable": "^5.3.3", - "uncontrollable": "^7.2.1", - "uuid": "^9.0.0" - }, - "bin": { - "paragon": "bin/paragon-scripts.js" - }, - "peerDependencies": { - "react": "^16.8.6 || ^17.0.0", - "react-dom": "^16.8.6 || ^17.0.0", - "react-intl": "^5.25.1 || ^6.4.0" - } - }, - "node_modules/@edx/paragon/node_modules/axios": { - "version": "0.27.2", - "resolved": "https://registry.npmjs.org/axios/-/axios-0.27.2.tgz", - "integrity": "sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==", - "dependencies": { - "follow-redirects": "^1.14.9", - "form-data": "^4.0.0" - } - }, - "node_modules/@edx/paragon/node_modules/brace-expansion": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", - "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==", - "dependencies": { - "balanced-match": "^1.0.0" - } - }, - "node_modules/@edx/paragon/node_modules/commander": { - "version": "9.5.0", - "resolved": "https://registry.npmjs.org/commander/-/commander-9.5.0.tgz", - "integrity": "sha512-KRs7WVDKg86PWiuAqhDrAQnTXZKraVcCc6vFdL14qrZ/DcWwuRo7VoiYXalXO7S5GKpqYiVEwCbgFDfxNHKJBQ==", - "engines": { - "node": "^12.20.0 || >=14" - } - }, - "node_modules/@edx/paragon/node_modules/glob": { - "version": "8.1.0", - "resolved": "https://registry.npmjs.org/glob/-/glob-8.1.0.tgz", - "integrity": "sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==", - "dependencies": { - "fs.realpath": "^1.0.0", - "inflight": "^1.0.4", - "inherits": "2", - "minimatch": "^5.0.1", - "once": "^1.3.0" - }, - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/isaacs" - } - }, - "node_modules/@edx/paragon/node_modules/minimatch": { - "version": "5.1.6", - "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.1.6.tgz", - "integrity": "sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==", - "dependencies": { - "brace-expansion": "^2.0.1" - }, - "engines": { - "node": ">=10" - } - }, - "node_modules/@edx/paragon/node_modules/postcss-custom-media": { - "version": "9.1.5", - "resolved": "https://registry.npmjs.org/postcss-custom-media/-/postcss-custom-media-9.1.5.tgz", - "integrity": "sha512-GStyWMz7Qbo/Gtw1xVspzVSX8eipgNg4lpsO3CAeY4/A1mzok+RV6MCv3fg62trWijh/lYEj6vps4o8JcBBpDA==", - "funding": [ - { - "type": "github", - "url": "https://github.com/sponsors/csstools" - }, - { - "type": "opencollective", - "url": "https://opencollective.com/csstools" - } - ], - "dependencies": { - "@csstools/cascade-layer-name-parser": "^1.0.2", - "@csstools/css-parser-algorithms": "^2.2.0", - "@csstools/css-tokenizer": "^2.1.1", - "@csstools/media-query-list-parser": "^2.1.1" - }, - "engines": { - "node": "^14 || ^16 || >=18" - }, - "peerDependencies": { - "postcss": "^8.4" - } - }, "node_modules/@edx/typescript-config": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/@edx/typescript-config/-/typescript-config-1.0.1.tgz", @@ -2772,42 +2634,6 @@ "node": ">=14.17" } }, - "node_modules/@fortawesome/fontawesome-common-types": { - "version": "6.5.2", - "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.2.tgz", - "integrity": "sha512-gBxPg3aVO6J0kpfHNILc+NMhXnqHumFxOmjYCFfOiLZfwhnnfhtsdA2hfJlDnj+8PjAs6kKQPenOTKj3Rf7zHw==", - "hasInstallScript": true, - "peer": true, - "engines": { - "node": ">=6" - } - }, - "node_modules/@fortawesome/fontawesome-svg-core": { - "version": "6.5.2", - "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.2.tgz", - "integrity": "sha512-5CdaCBGl8Rh9ohNdxeeTMxIj8oc3KNBgIeLMvJosBMdslK/UnEB8rzyDRrbKdL1kDweqBPo4GT9wvnakHWucZw==", - "hasInstallScript": true, - "peer": true, - "dependencies": { - "@fortawesome/fontawesome-common-types": "6.5.2" - }, - "engines": { - "node": ">=6" - } - }, - "node_modules/@fortawesome/react-fontawesome": { - "version": "0.1.19", - "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.1.19.tgz", - "integrity": "sha512-Hyb+lB8T18cvLNX0S3llz7PcSOAJMLwiVKBuuzwM/nI5uoBw+gQjnf9il0fR1C3DKOI5Kc79pkJ4/xB0Uw9aFQ==", - "peer": true, - "dependencies": { - "prop-types": "^15.8.1" - }, - "peerDependencies": { - "@fortawesome/fontawesome-svg-core": "~1 || ~6", - "react": ">=16.x" - } - }, "node_modules/@fullhuman/postcss-purgecss": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/@fullhuman/postcss-purgecss/-/postcss-purgecss-5.0.0.tgz", @@ -3632,25 +3458,34 @@ } }, "node_modules/@openedx/paragon": { - "version": "22.4.0", - "resolved": "https://registry.npmjs.org/@openedx/paragon/-/paragon-22.4.0.tgz", - "integrity": "sha512-0dbff4cz1QCZL4hvyIke5o2m6z7xQKO8O12fyHrijL9izL0jjhPNKwcT2U2VLF/rOKx/AgPH3PMtZhlib+t1ew==", - "peer": true, + "version": "22.0.0-alpha.25", + "resolved": "https://registry.npmjs.org/@openedx/paragon/-/paragon-22.0.0-alpha.25.tgz", + "integrity": "sha512-Eml6g8u3+HHnji7MWaeqD1OjoedKTFb/xpNjz3HI+MZohfVHwUTs6hUSim41WWlclYk72XGZ5BRDNm+kK2p3xA==", "dependencies": { - "@fortawesome/fontawesome-svg-core": "^6.1.1", - "@fortawesome/react-fontawesome": "^0.1.18", "@popperjs/core": "^2.11.4", + "axios": "^0.27.2", "bootstrap": "^4.6.2", "chalk": "^4.1.2", "child_process": "^1.0.2", + "chroma-js": "^2.4.2", "classnames": "^2.3.1", + "cli-progress": "^3.12.0", + "commander": "^9.4.1", "email-prop-type": "^3.0.0", "file-selector": "^0.6.0", - "font-awesome": "^4.7.0", "glob": "^8.0.3", "inquirer": "^8.2.5", "lodash.uniqby": "^4.7.0", + "log-update": "^4.0.0", "mailto-link": "^2.0.0", + "minimist": "^1.2.8", + "ora": "^5.4.1", + "postcss": "^8.4.21", + "postcss-combine-duplicated-selectors": "^10.0.3", + "postcss-custom-media": "^9.1.2", + "postcss-import": "^15.1.0", + "postcss-map": "^0.11.0", + "postcss-minify": "^1.1.0", "prop-types": "^15.8.1", "react-bootstrap": "^1.6.5", "react-colorful": "^5.6.1", @@ -3663,6 +3498,8 @@ "react-responsive": "^8.2.0", "react-table": "^7.7.0", "react-transition-group": "^4.4.2", + "sass": "^1.58.3", + "style-dictionary": "^3.7.1", "tabbable": "^5.3.3", "uncontrollable": "^7.2.1", "uuid": "^9.0.0" @@ -3676,20 +3513,35 @@ "react-intl": "^5.25.1 || ^6.4.0" } }, + "node_modules/@openedx/paragon/node_modules/axios": { + "version": "0.27.2", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.27.2.tgz", + "integrity": "sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==", + "dependencies": { + "follow-redirects": "^1.14.9", + "form-data": "^4.0.0" + } + }, "node_modules/@openedx/paragon/node_modules/brace-expansion": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==", - "peer": true, "dependencies": { "balanced-match": "^1.0.0" } }, + "node_modules/@openedx/paragon/node_modules/commander": { + "version": "9.5.0", + "resolved": "https://registry.npmjs.org/commander/-/commander-9.5.0.tgz", + "integrity": "sha512-KRs7WVDKg86PWiuAqhDrAQnTXZKraVcCc6vFdL14qrZ/DcWwuRo7VoiYXalXO7S5GKpqYiVEwCbgFDfxNHKJBQ==", + "engines": { + "node": "^12.20.0 || >=14" + } + }, "node_modules/@openedx/paragon/node_modules/glob": { "version": "8.1.0", "resolved": "https://registry.npmjs.org/glob/-/glob-8.1.0.tgz", "integrity": "sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==", - "peer": true, "dependencies": { "fs.realpath": "^1.0.0", "inflight": "^1.0.4", @@ -3708,7 +3560,6 @@ "version": "5.1.6", "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.1.6.tgz", "integrity": "sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==", - "peer": true, "dependencies": { "brace-expansion": "^2.0.1" }, @@ -3716,6 +3567,33 @@ "node": ">=10" } }, + "node_modules/@openedx/paragon/node_modules/postcss-custom-media": { + "version": "9.1.5", + "resolved": "https://registry.npmjs.org/postcss-custom-media/-/postcss-custom-media-9.1.5.tgz", + "integrity": "sha512-GStyWMz7Qbo/Gtw1xVspzVSX8eipgNg4lpsO3CAeY4/A1mzok+RV6MCv3fg62trWijh/lYEj6vps4o8JcBBpDA==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "dependencies": { + "@csstools/cascade-layer-name-parser": "^1.0.2", + "@csstools/css-parser-algorithms": "^2.2.0", + "@csstools/css-tokenizer": "^2.1.1", + "@csstools/media-query-list-parser": "^2.1.1" + }, + "engines": { + "node": "^14 || ^16 || >=18" + }, + "peerDependencies": { + "postcss": "^8.4" + } + }, "node_modules/@pkgjs/parseargs": { "version": "0.11.0", "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz", @@ -9136,15 +9014,6 @@ } } }, - "node_modules/font-awesome": { - "version": "4.7.0", - "resolved": "https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz", - "integrity": "sha512-U6kGnykA/6bFmg1M/oT9EkFeIYv7JlX3bozwQJWiiLz6L0w3F5vBVPxHlwyX/vtNq1ckcpRKOB9f2Qal/VtFpg==", - "peer": true, - "engines": { - "node": ">=0.10.3" - } - }, "node_modules/for-each": { "version": "0.3.3", "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz", diff --git a/example/package.json b/example/package.json index 78bba9d53..e8b4bd090 100644 --- a/example/package.json +++ b/example/package.json @@ -17,7 +17,7 @@ "dependencies": { "@edx/brand": "npm:@openedx/brand-openedx@1.2.3", "@edx/frontend-platform": "8.0.2", - "@edx/paragon": "npm:@openedx/paragon@22.0.0-alpha.25", + "@openedx/paragon": "22.0.0-alpha.25", "react": "17.0.2", "react-dom": "17.0.2", "react-redux": "7.2.9", diff --git a/example/src/ParagonPreview.jsx b/example/src/ParagonPreview.jsx index 0d9dbfa4f..6b2488fdd 100644 --- a/example/src/ParagonPreview.jsx +++ b/example/src/ParagonPreview.jsx @@ -10,7 +10,8 @@ const ParagonPreview = () => {

Exposed theme CSS files

- Note: Depending on the versions of @edx/paragon and/or @edx/brand installed, + Note: Depending on the versions + of @openedx/paragon and/or @openedx/brand-openedx installed, it is expected that no exposed theme CSS assets be listed here.

diff --git a/example/src/__snapshots__/App.test.jsx.snap b/example/src/__snapshots__/App.test.jsx.snap index fab174abe..3ad8da143 100644 --- a/example/src/__snapshots__/App.test.jsx.snap +++ b/example/src/__snapshots__/App.test.jsx.snap @@ -126,11 +126,11 @@ exports[`Basic test should render 1`] = ` Note: Depending on the versions of - @edx/paragon + @openedx/paragon and/or - @edx/brand + @openedx/brand-openedx installed, it is expected that no exposed theme CSS assets be listed here. diff --git a/example/src/style.scss b/example/src/style.scss index b68d3ec5d..7789608df 100644 --- a/example/src/style.scss +++ b/example/src/style.scss @@ -1,5 +1,5 @@ -@use "@edx/paragon/dist/core.min.css" as paragonCore; -@use "@edx/paragon/dist/light.min.css" as paragonLight; +@use "@openedx/paragon/dist/core.min.css" as paragonCore; +@use "@openedx/paragon/dist/light.min.css" as paragonLight; $h3-color: red;