From 88a17d7e74589daf9a8a6743a51178389a948574 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Romain?= Date: Mon, 27 Nov 2023 16:23:50 +0100 Subject: [PATCH 01/12] Fix(design-system): issue with theme provider (#5010) --- .changeset/wicked-panthers-film.md | 5 +++++ .../src/components/ThemeProvider/ThemeProvider.tsx | 12 ++++++++++-- 2 files changed, 15 insertions(+), 2 deletions(-) create mode 100644 .changeset/wicked-panthers-film.md diff --git a/.changeset/wicked-panthers-film.md b/.changeset/wicked-panthers-film.md new file mode 100644 index 00000000000..a79029c8d67 --- /dev/null +++ b/.changeset/wicked-panthers-film.md @@ -0,0 +1,5 @@ +--- +'@talend/design-system': patch +--- + +fix: theme provider override is not working as expected diff --git a/packages/design-system/src/components/ThemeProvider/ThemeProvider.tsx b/packages/design-system/src/components/ThemeProvider/ThemeProvider.tsx index aa3acf12624..aacb78ef963 100644 --- a/packages/design-system/src/components/ThemeProvider/ThemeProvider.tsx +++ b/packages/design-system/src/components/ThemeProvider/ThemeProvider.tsx @@ -13,7 +13,7 @@ import './ThemeProvider.scss'; export type ThemeProviderProps = PropsWithChildren<{ theme?: string; - tokensOverride?: React.CSSProperties; + tokensOverride?: Record; }>; export const ThemeProvider = ({ @@ -33,10 +33,18 @@ export const ThemeProvider = ({ setSelectedTheme(theme); }, [theme]); + useEffect(() => { + if (tokensOverride) { + Object.keys(tokensOverride).forEach(key => { + document.body.style.setProperty(key, tokensOverride[key].toString()); + }); + } + }, [tokensOverride]); + const switchTheme = (newTheme: string) => setSelectedTheme(newTheme); return ( - {tokensOverride ?
{children}
: children} + {children} ); }; From e1435717c4e3d3332cd5892441a9eeb2e4f18f41 Mon Sep 17 00:00:00 2001 From: Talend bot Date: Mon, 27 Nov 2023 16:31:08 +0100 Subject: [PATCH 02/12] chore: prepare release (#5009) --- .changeset/ninety-baboons-join.md | 5 ----- .changeset/wicked-panthers-film.md | 5 ----- packages/design-system/CHANGELOG.md | 6 ++++++ packages/design-system/package.json | 2 +- tools/upgrade-deps/CHANGELOG.md | 7 +++++++ tools/upgrade-deps/package.json | 2 +- 6 files changed, 15 insertions(+), 12 deletions(-) delete mode 100644 .changeset/ninety-baboons-join.md delete mode 100644 .changeset/wicked-panthers-film.md diff --git a/.changeset/ninety-baboons-join.md b/.changeset/ninety-baboons-join.md deleted file mode 100644 index 4b3a51f5739..00000000000 --- a/.changeset/ninety-baboons-join.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@talend/upgrade-deps': major ---- -Make upgrade-deps compatible with pnpm -[Breaking Change]remove security option (has it's not used) diff --git a/.changeset/wicked-panthers-film.md b/.changeset/wicked-panthers-film.md deleted file mode 100644 index a79029c8d67..00000000000 --- a/.changeset/wicked-panthers-film.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@talend/design-system': patch ---- - -fix: theme provider override is not working as expected diff --git a/packages/design-system/CHANGELOG.md b/packages/design-system/CHANGELOG.md index eba73ba1755..63f0c312b7b 100644 --- a/packages/design-system/CHANGELOG.md +++ b/packages/design-system/CHANGELOG.md @@ -1,5 +1,11 @@ # @talend/design-system +## 8.4.1 + +### Patch Changes + +- 88a17d7e7: fix: theme provider override is not working as expected + ## 8.4.0 ### Minor Changes diff --git a/packages/design-system/package.json b/packages/design-system/package.json index de55e5a9dee..cdde6544163 100644 --- a/packages/design-system/package.json +++ b/packages/design-system/package.json @@ -1,6 +1,6 @@ { "name": "@talend/design-system", - "version": "8.4.0", + "version": "8.4.1", "description": "Talend Design System", "main": "lib/index.js", "types": "lib/index.d.ts", diff --git a/tools/upgrade-deps/CHANGELOG.md b/tools/upgrade-deps/CHANGELOG.md index 187a53f51c3..a5c0ef01dde 100644 --- a/tools/upgrade-deps/CHANGELOG.md +++ b/tools/upgrade-deps/CHANGELOG.md @@ -1,5 +1,12 @@ # @talend/upgrade-deps +## 3.0.0 + +### Major Changes + +- e8c64eb49: Make upgrade-deps compatible with pnpm + [Breaking Change]remove security option (has it's not used) + ## 2.1.0 ### Minor Changes diff --git a/tools/upgrade-deps/package.json b/tools/upgrade-deps/package.json index c26ea4f0031..5dfab75e2d3 100644 --- a/tools/upgrade-deps/package.json +++ b/tools/upgrade-deps/package.json @@ -1,6 +1,6 @@ { "name": "@talend/upgrade-deps", - "version": "2.1.0", + "version": "3.0.0", "description": "CLI to help management of dependencies", "type": "module", "bin": { From 61603e6290bac0e2f57971efb20967e26944cf89 Mon Sep 17 00:00:00 2001 From: Sebastien LE MOUILLOUR <32456736+smouillour@users.noreply.github.com> Date: Mon, 27 Nov 2023 17:48:12 +0100 Subject: [PATCH 03/12] fix: cypress not working with config in ts (#5013) --- package.json | 2 +- .../{cypress.config.ts => cypress.config.js} | 12 +- packages/dataviz/cypress.d.ts | 9 - packages/dataviz/cypress/support/commands.ts | 13 +- packages/dataviz/package.json | 2 +- .../HorizontalBarChart.cy.tsx | 8 +- .../{cypress.config.ts => cypress.config.js} | 10 +- packages/design-system/package.json | 2 +- yarn.lock | 163 +++++++++--------- 9 files changed, 99 insertions(+), 122 deletions(-) rename packages/dataviz/{cypress.config.ts => cypress.config.js} (77%) delete mode 100644 packages/dataviz/cypress.d.ts rename packages/design-system/{cypress.config.ts => cypress.config.js} (73%) diff --git a/package.json b/package.json index 500b1e4c55b..2f893236868 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,7 @@ "prepare": "husky install" }, "resolutions": { - "**/cypress": "^12.17.4", + "**/cypress": "^13.6.0", "**/@types/react": "^18.2.7", "**/@types/react-dom": "^18.2.7", "**/i18next-scanner-typescript/typescript": "^5.0.4", diff --git a/packages/dataviz/cypress.config.ts b/packages/dataviz/cypress.config.js similarity index 77% rename from packages/dataviz/cypress.config.ts rename to packages/dataviz/cypress.config.js index 4ea4a9840cb..66e194d133d 100644 --- a/packages/dataviz/cypress.config.ts +++ b/packages/dataviz/cypress.config.js @@ -1,11 +1,11 @@ /* eslint-disable import/no-extraneous-dependencies */ -import { defineConfig } from 'cypress'; -import path from 'path'; +const { defineConfig } = require('cypress'); +const path = require('path'); -import { +const { getWebpackRules, getWebpackPlugins, -} from '@talend/scripts-config-react-webpack/config/webpack.config.common'; +} = require('@talend/scripts-config-react-webpack/config/webpack.config.common'); const webpack = require('webpack'); const srcDirectories = [ @@ -34,7 +34,7 @@ const webpackConfig = { }, }, module: { - rules: getWebpackRules(srcDirectories, true, true), + rules: getWebpackRules([path.resolve(process.cwd(), './src/')], true, true), }, plugins: getWebpackPlugins().concat([ new webpack.ProvidePlugin({ @@ -43,7 +43,7 @@ const webpackConfig = { ]), }; -export default defineConfig({ +module.exports = defineConfig({ viewportWidth: 400, viewportHeight: 400, video: false, diff --git a/packages/dataviz/cypress.d.ts b/packages/dataviz/cypress.d.ts deleted file mode 100644 index c6bd409bf2a..00000000000 --- a/packages/dataviz/cypress.d.ts +++ /dev/null @@ -1,9 +0,0 @@ -declare global { - namespace Cypress { - interface Chainable { - mount: typeof mount; - } - } -} - -declare module '@talend/scripts-config-react-webpack/config/webpack.config.common'; diff --git a/packages/dataviz/cypress/support/commands.ts b/packages/dataviz/cypress/support/commands.ts index 21e9cbfdc88..cf609b3c6d1 100644 --- a/packages/dataviz/cypress/support/commands.ts +++ b/packages/dataviz/cypress/support/commands.ts @@ -1,19 +1,10 @@ /* eslint-disable import/no-extraneous-dependencies */ /// - +import '@testing-library/cypress/add-commands'; import { mount } from 'cypress/react'; -declare global { - // eslint-disable-next-line @typescript-eslint/no-namespace - namespace Cypress { - interface Chainable { - mount: typeof mount; - } - } -} + Cypress.Commands.add('mount', (component, options) => { const wrapper = component; return mount(wrapper, options); }); - -import '@testing-library/cypress/add-commands'; diff --git a/packages/dataviz/package.json b/packages/dataviz/package.json index 6f7d636cea4..fc5f146ab3d 100644 --- a/packages/dataviz/package.json +++ b/packages/dataviz/package.json @@ -74,7 +74,7 @@ "@types/react": "^18.2.38", "@types/topojson-client": "^3.1.4", "@types/topojson-specification": "^1.0.5", - "cypress": "^12.17.4", + "cypress": "^13.6.0", "cross-env": "^7.0.3", "i18next": "^23.7.6", "react": "^18.2.0", diff --git a/packages/dataviz/src/components/BarChart/HorizontalBarChart/HorizontalBarChart.cy.tsx b/packages/dataviz/src/components/BarChart/HorizontalBarChart/HorizontalBarChart.cy.tsx index 91aaaacc74c..4c6fe09f4e7 100644 --- a/packages/dataviz/src/components/BarChart/HorizontalBarChart/HorizontalBarChart.cy.tsx +++ b/packages/dataviz/src/components/BarChart/HorizontalBarChart/HorizontalBarChart.cy.tsx @@ -1,8 +1,8 @@ /* eslint-disable testing-library/await-async-queries */ -/* eslint-disable testing-library/prefer-screen-queries */ -import HorizontalBarChart from './HorizontalBarChart.component'; +/* eslint-disable testing-library/prefer-screen-queries */ import { ChartStyle } from '../../../types'; +import HorizontalBarChart from './HorizontalBarChart.component'; context('', () => { it('Should trigger onBarClick', () => { @@ -51,7 +51,7 @@ context('', () => { height={300} width={400} onBarClick={onBarClick} - getTooltipContent={() =>
tooltip
} + getTooltipContent={() =>
tooltip
} />, ); @@ -60,7 +60,7 @@ context('', () => { .first() .trigger('mousemove') .trigger('click', { force: true }); - cy.get('[data-test="myTooltipContent"]').should('be.visible'); + cy.get('[data-test="tooltip"]').should('be.visible'); }); it('Should not grow to available size if not enough data provided', () => { const onBarClick = cy.stub().as('onBarClick'); diff --git a/packages/design-system/cypress.config.ts b/packages/design-system/cypress.config.js similarity index 73% rename from packages/design-system/cypress.config.ts rename to packages/design-system/cypress.config.js index e2141323ef8..8ef1b252506 100644 --- a/packages/design-system/cypress.config.ts +++ b/packages/design-system/cypress.config.js @@ -1,11 +1,11 @@ -import { defineConfig } from 'cypress'; +const { defineConfig } = require('cypress'); -import path from 'path'; +const path = require('path'); -import { +const { getWebpackRules, getWebpackPlugins, -} from '@talend/scripts-config-react-webpack/config/webpack.config.common'; +} = require('@talend/scripts-config-react-webpack/config/webpack.config.common'); const webpackConfig = { mode: 'development', @@ -26,7 +26,7 @@ const webpackConfig = { plugins: getWebpackPlugins(), }; -export default defineConfig({ +module.exports = defineConfig({ component: { devServer: { framework: 'react', diff --git a/packages/design-system/package.json b/packages/design-system/package.json index cdde6544163..edf8ef26b86 100644 --- a/packages/design-system/package.json +++ b/packages/design-system/package.json @@ -83,7 +83,7 @@ "browser-sync-webpack-plugin": "^2.3.0", "concurrently": "^7.6.0", "core-js": "^3.33.3", - "cypress": "^12.17.4", + "cypress": "^13.6.0", "focus-outline-manager": "^1.0.2", "i18next": "^23.7.6", "i18next-scanner": "^4.4.0", diff --git a/yarn.lock b/yarn.lock index eb677c4a42d..7e98cb48a1e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -471,7 +471,7 @@ resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.18.9.tgz#f2dde0c682ccc264a9a8595efd030a5cc8fd2539" integrity sha512-9uJveS9eY9DJ0t64YbIBZICtJy8a5QrDEVdiLCG97fVLpDTpGX7t8mMSb6OWw6Lrnjqj4O8zwjELX3dhoMgiBg== -"@babel/parser@^7.1.0", "@babel/parser@^7.13.16", "@babel/parser@^7.14.7", "@babel/parser@^7.17.3", "@babel/parser@^7.17.8", "@babel/parser@^7.20.7", "@babel/parser@^7.22.15", "@babel/parser@^7.22.7", "@babel/parser@^7.23.0", "@babel/parser@^7.23.3", "@babel/parser@^7.23.4", "@babel/parser@^7.9.4": +"@babel/parser@^7.1.0", "@babel/parser@^7.13.16", "@babel/parser@^7.14.7", "@babel/parser@^7.17.3", "@babel/parser@^7.17.8", "@babel/parser@^7.20.7", "@babel/parser@^7.22.15", "@babel/parser@^7.22.7", "@babel/parser@^7.23.3", "@babel/parser@^7.23.4", "@babel/parser@^7.9.4": version "7.23.4" resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.23.4.tgz#409fbe690c333bb70187e2de4021e1e47a026661" integrity sha512-vf3Xna6UEprW+7t6EtOmFpHNAuxw3xqPZghy+brsnusscJRW5BMUzzHZc5ICjULee81WeUV2jjakG09MDglJXQ== @@ -1715,10 +1715,10 @@ resolved "https://registry.yarnpkg.com/@cypress/react/-/react-7.0.3.tgz#e62d67c1344265ee959e99100ce237663f20abb1" integrity sha512-YseqnMugTbdPV9YCYEMXVqIf+P7x+pfjXOdjv4dnDFqNCZeHaZfOZVFZ4XfEHVxMv0aDszxlaLiIp3QDPhr12w== -"@cypress/request@2.88.12": - version "2.88.12" - resolved "https://registry.yarnpkg.com/@cypress/request/-/request-2.88.12.tgz#ba4911431738494a85e93fb04498cb38bc55d590" - integrity sha512-tOn+0mDZxASFM+cuAP9szGUGPI1HwWVSvdzm7V4cCsPdFTx6qMj29CwaQmRAMIEhORIUBFBsYROYJcveK4uOjA== +"@cypress/request@^3.0.0": + version "3.0.1" + resolved "https://registry.yarnpkg.com/@cypress/request/-/request-3.0.1.tgz#72d7d5425236a2413bd3d8bb66d02d9dc3168960" + integrity sha512-TWivJlJi8ZDx2wGOw1dbLuHJKUYX7bWySw377nlnGOW3hP9/MUKIsEdXT/YngWxVdgNCHRBmFlBipE+5/2ZZlQ== dependencies: aws-sign2 "~0.7.0" aws4 "^1.8.0" @@ -1733,7 +1733,7 @@ json-stringify-safe "~5.0.1" mime-types "~2.1.19" performance-now "^2.1.0" - qs "~6.10.3" + qs "6.10.4" safe-buffer "^5.1.2" tough-cookie "^4.1.3" tunnel-agent "^0.6.0" @@ -4875,12 +4875,7 @@ resolved "https://registry.yarnpkg.com/@types/node/-/node-12.20.55.tgz#c329cbd434c42164f846b909bd6f85b5537f6240" integrity sha512-J8xLz7q2OFulZ2cyGTLE1TbbZcjpno7FaN6zdJNrgAdrJ+DZzh/uFR6YrTb4C+nXakvud8Q4+rbhoIWlYQbUFQ== -"@types/node@^16.18.39": - version "16.18.65" - resolved "https://registry.yarnpkg.com/@types/node/-/node-16.18.65.tgz#b07eb49a14a808777b82879288a7e6f5a296ccfa" - integrity sha512-5E9WgTy95B7i90oISjui9U5Zu7iExUPfU4ygtv4yXEy6zJFE3oQYHCnh5H1jZRPkjphJt2Ml3oQW6M0qtK534A== - -"@types/node@^18.0.0": +"@types/node@^18.0.0", "@types/node@^18.17.5": version "18.18.13" resolved "https://registry.yarnpkg.com/@types/node/-/node-18.18.13.tgz#ae0f76c0bfe79d8fad0f910b78ae3e59b333c6e8" integrity sha512-vXYZGRrSCreZmq1rEjMRLXJhiy8MrIeVasx+PCVlP414N7CJLHnMf+juVvjdprHyH+XRy3zKZLHeNueOpJCn0g== @@ -5307,63 +5302,63 @@ resolved "https://registry.yarnpkg.com/@ungap/structured-clone/-/structured-clone-1.2.0.tgz#756641adb587851b5ccb3e095daf27ae581c8406" integrity sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ== -"@vue/compiler-core@3.3.8": - version "3.3.8" - resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.3.8.tgz#301bb60d0245265a88ed5b30e200fbf223acb313" - integrity sha512-hN/NNBUECw8SusQvDSqqcVv6gWq8L6iAktUR0UF3vGu2OhzRqcOiAno0FmBJWwxhYEXRlQJT5XnoKsVq1WZx4g== +"@vue/compiler-core@3.3.9": + version "3.3.9" + resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.3.9.tgz#df1fc7947dcef5c2e12d257eae540057707f47d1" + integrity sha512-+/Lf68Vr/nFBA6ol4xOtJrW+BQWv3QWKfRwGSm70jtXwfhZNF4R/eRgyVJYoxFRhdCTk/F6g99BP0ffPgZihfQ== dependencies: - "@babel/parser" "^7.23.0" - "@vue/shared" "3.3.8" + "@babel/parser" "^7.23.3" + "@vue/shared" "3.3.9" estree-walker "^2.0.2" source-map-js "^1.0.2" -"@vue/compiler-dom@3.3.8": - version "3.3.8" - resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.3.8.tgz#09d832514b9b8d9415a3816b065d69dbefcc7e9b" - integrity sha512-+PPtv+p/nWDd0AvJu3w8HS0RIm/C6VGBIRe24b9hSyNWOAPEUosFZ5diwawwP8ip5sJ8n0Pe87TNNNHnvjs0FQ== +"@vue/compiler-dom@3.3.9": + version "3.3.9" + resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.3.9.tgz#67315ea4193d9d18c7a710889b8f90f7aa3914d2" + integrity sha512-nfWubTtLXuT4iBeDSZ5J3m218MjOy42Vp2pmKVuBKo2/BLcrFUX8nCSr/bKRFiJ32R8qbdnnnBgRn9AdU5v0Sg== dependencies: - "@vue/compiler-core" "3.3.8" - "@vue/shared" "3.3.8" + "@vue/compiler-core" "3.3.9" + "@vue/shared" "3.3.9" "@vue/compiler-sfc@^3.2.40": - version "3.3.8" - resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.3.8.tgz#40b18e48aa00260950964d1d72157668521be0e1" - integrity sha512-WMzbUrlTjfYF8joyT84HfwwXo+8WPALuPxhy+BZ6R4Aafls+jDBnSz8PDz60uFhuqFbl3HxRfxvDzrUf3THwpA== - dependencies: - "@babel/parser" "^7.23.0" - "@vue/compiler-core" "3.3.8" - "@vue/compiler-dom" "3.3.8" - "@vue/compiler-ssr" "3.3.8" - "@vue/reactivity-transform" "3.3.8" - "@vue/shared" "3.3.8" + version "3.3.9" + resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.3.9.tgz#5900906baba1a90389200d81753ad0f7ceb98a83" + integrity sha512-wy0CNc8z4ihoDzjASCOCsQuzW0A/HP27+0MDSSICMjVIFzk/rFViezkR3dzH+miS2NDEz8ywMdbjO5ylhOLI2A== + dependencies: + "@babel/parser" "^7.23.3" + "@vue/compiler-core" "3.3.9" + "@vue/compiler-dom" "3.3.9" + "@vue/compiler-ssr" "3.3.9" + "@vue/reactivity-transform" "3.3.9" + "@vue/shared" "3.3.9" estree-walker "^2.0.2" magic-string "^0.30.5" postcss "^8.4.31" source-map-js "^1.0.2" -"@vue/compiler-ssr@3.3.8": - version "3.3.8" - resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.3.8.tgz#136eed54411e4694815d961048a237191063fbce" - integrity sha512-hXCqQL/15kMVDBuoBYpUnSYT8doDNwsjvm3jTefnXr+ytn294ySnT8NlsFHmTgKNjwpuFy7XVV8yTeLtNl/P6w== +"@vue/compiler-ssr@3.3.9": + version "3.3.9" + resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.3.9.tgz#3b3dbfa5368165fa4ff74c060503b4087ec1beed" + integrity sha512-NO5oobAw78R0G4SODY5A502MGnDNiDjf6qvhn7zD7TJGc8XDeIEw4fg6JU705jZ/YhuokBKz0A5a/FL/XZU73g== dependencies: - "@vue/compiler-dom" "3.3.8" - "@vue/shared" "3.3.8" + "@vue/compiler-dom" "3.3.9" + "@vue/shared" "3.3.9" -"@vue/reactivity-transform@3.3.8": - version "3.3.8" - resolved "https://registry.yarnpkg.com/@vue/reactivity-transform/-/reactivity-transform-3.3.8.tgz#6d07649013b0be5c670f0ab6cc7ddd3150ad03f2" - integrity sha512-49CvBzmZNtcHua0XJ7GdGifM8GOXoUMOX4dD40Y5DxI3R8OUhMlvf2nvgUAcPxaXiV5MQQ1Nwy09ADpnLQUqRw== +"@vue/reactivity-transform@3.3.9": + version "3.3.9" + resolved "https://registry.yarnpkg.com/@vue/reactivity-transform/-/reactivity-transform-3.3.9.tgz#5d894dd9a42a422a2db309babb385f9a2529b52f" + integrity sha512-HnUFm7Ry6dFa4Lp63DAxTixUp8opMtQr6RxQCpDI1vlh12rkGIeYqMvJtK+IKyEfEOa2I9oCkD1mmsPdaGpdVg== dependencies: - "@babel/parser" "^7.23.0" - "@vue/compiler-core" "3.3.8" - "@vue/shared" "3.3.8" + "@babel/parser" "^7.23.3" + "@vue/compiler-core" "3.3.9" + "@vue/shared" "3.3.9" estree-walker "^2.0.2" magic-string "^0.30.5" -"@vue/shared@3.3.8": - version "3.3.8" - resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.3.8.tgz#f044942142e1d3a395f24132e6203a784838542d" - integrity sha512-8PGwybFwM4x8pcfgqEQFy70NaQxASvOC5DJwLQfpArw1UDfUXrJkdxD3BhVTMS+0Lef/TU7YO0Jvr0jJY8T+mw== +"@vue/shared@3.3.9": + version "3.3.9" + resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.3.9.tgz#df740d26d338faf03e09ca662a8031acf66051db" + integrity sha512-ZE0VTIR0LmYgeyhurPTpy4KzKsuDyQbMSdM49eKkMnT5X4VfFBLysMzjIZhLEFQYjjOVVfbvUDHckwjDFiO2eA== "@vusion/webfonts-generator@^0.8.0": version "0.8.0" @@ -6848,9 +6843,9 @@ caniuse-api@^3.0.0: lodash.uniq "^4.5.0" caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001538, caniuse-lite@^1.0.30001541: - version "1.0.30001564" - resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001564.tgz#eaa8bbc58c0cbccdcb7b41186df39dd2ba591889" - integrity sha512-DqAOf+rhof+6GVx1y+xzbFPeOumfQnhYzVnZD6LAXijR77yPtm9mfOcqOnT3mpnJiZVT+kwLAFnRlZcIz+c6bg== + version "1.0.30001565" + resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001565.tgz#a528b253c8a2d95d2b415e11d8b9942acc100c4f" + integrity sha512-xrE//a3O7TP0vaJ8ikzkD2c2NgcVUvsEe2IvFTntV4Yd1Z9FVzh+gW+enX96L0psrbaFMcVcH2l90xNuGDWc8w== case-sensitive-paths-webpack-plugin@^2.4.0: version "2.4.0" @@ -7078,9 +7073,9 @@ cli-cursor@^4.0.0: restore-cursor "^4.0.0" cli-spinners@^2.5.0: - version "2.9.1" - resolved "https://registry.yarnpkg.com/cli-spinners/-/cli-spinners-2.9.1.tgz#9c0b9dad69a6d47cbb4333c14319b060ed395a35" - integrity sha512-jHgecW0pxkonBJdrKsqxgRX9AcG+u/5k0Q7WPDfi8AogLAdwxEkyYYNWwZ5GvVFoFx2uiY1eNcSK00fh+1+FyQ== + version "2.9.2" + resolved "https://registry.yarnpkg.com/cli-spinners/-/cli-spinners-2.9.2.tgz#1773a8f4b9c4d6ac31563df53b3fc1d79462fe41" + integrity sha512-ywqV+5MmyL4E7ybXgKys4DugZbX0FC6LnwrhjuykIjnK9k8OQacQ7axGKnjDXWNhns0xot3bZI5h55H8yo9cJg== cli-table3@^0.6.1, cli-table3@~0.6.1: version "0.6.3" @@ -7910,14 +7905,14 @@ cubic2quad@^1.2.1: resolved "https://registry.yarnpkg.com/cubic2quad/-/cubic2quad-1.2.1.tgz#2442260b72c02ee4b6a2fe998fcc1c4073622286" integrity sha512-wT5Y7mO8abrV16gnssKdmIhIbA9wSkeMzhh27jAguKrV82i24wER0vL5TGhUJ9dbJNDcigoRZ0IAHFEEEI4THQ== -cypress@*, cypress@^12.17.4: - version "12.17.4" - resolved "https://registry.yarnpkg.com/cypress/-/cypress-12.17.4.tgz#b4dadf41673058493fa0d2362faa3da1f6ae2e6c" - integrity sha512-gAN8Pmns9MA5eCDFSDJXWKUpaL3IDd89N9TtIupjYnzLSmlpVr+ZR+vb4U/qaMp+lB6tBvAmt7504c3Z4RU5KQ== +cypress@*, cypress@^13.6.0: + version "13.6.0" + resolved "https://registry.yarnpkg.com/cypress/-/cypress-13.6.0.tgz#b98b7b837679012ed09c7ecee5565bf7b31d4982" + integrity sha512-quIsnFmtj4dBUEJYU4OH0H12bABJpSujvWexC24Ju1gTlKMJbeT6tTO0vh7WNfiBPPjoIXLN+OUqVtiKFs6SGw== dependencies: - "@cypress/request" "2.88.12" + "@cypress/request" "^3.0.0" "@cypress/xvfb" "^1.2.4" - "@types/node" "^16.18.39" + "@types/node" "^18.17.5" "@types/sinonjs__fake-timers" "8.1.1" "@types/sizzle" "^2.3.2" arch "^2.2.0" @@ -8801,9 +8796,9 @@ ejs@^3.1.8: jake "^10.8.5" electron-to-chromium@^1.4.535: - version "1.4.593" - resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.593.tgz#f71b157f7382f3d3a164f73ff2da772d4b3fd984" - integrity sha512-c7+Hhj87zWmdpmjDONbvNKNo24tvmD4mjal1+qqTYTrlF0/sNpAcDlU0Ki84ftA/5yj3BF2QhSGEC0Rky6larg== + version "1.4.594" + resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.594.tgz#f69f207fba80735a44a988df42f3f439115d0515" + integrity sha512-xT1HVAu5xFn7bDfkjGQi9dNpMqGchUkebwf1GL7cZN32NSwwlHRPMSDJ1KN6HkS0bWUtndbSQZqvpQftKG2uFQ== emittery@^0.13.1: version "0.13.1" @@ -11001,11 +10996,11 @@ i18next-http-backend@^1.4.5: cross-fetch "3.1.5" i18next-scanner-typescript@^1.1.1: - version "1.1.1" - resolved "https://registry.yarnpkg.com/i18next-scanner-typescript/-/i18next-scanner-typescript-1.1.1.tgz#47a6eaa09ce1c2d375bc2c76ca101b1ce9cfb6cc" - integrity sha512-b2vDA1X5yAwcAJPN3W5nfl4ILAdRbeuC0fqOsS6TCS58YjEsYMLWOpB55YznWMcTUQY7mQ/ZGiNpuckTe1fEYQ== + version "1.2.0" + resolved "https://registry.yarnpkg.com/i18next-scanner-typescript/-/i18next-scanner-typescript-1.2.0.tgz#293b2c0ab0b53364ac5889dd450f5922f4600934" + integrity sha512-Q9VFw8LygB8cW9/ixVf6DHkrP8CD0hRvJcxpaFVGbx9HU84yYWO7PmPfEc9kMFMVjR8HtRiP2U0i8Vinb/wsww== dependencies: - typescript "^3.0.0" + typescript "^5.3.2" i18next-scanner@^4.4.0: version "4.4.0" @@ -13967,9 +13962,9 @@ nan@^2.14.2: integrity sha512-W7tfG7vMOGtD30sHoZSSc/JVYiyDPEyQVso/Zz+/uQd0B0L46gtC+pHha5FFMRpil6fm/AoEcRWyOVi4+E/f8w== nano-css@^5.3.1: - version "5.6.0" - resolved "https://registry.yarnpkg.com/nano-css/-/nano-css-5.6.0.tgz#b370802b0bb96e57be450734aa7ca5fa9be047f6" - integrity sha512-jNikscxQv93wwhmXN4w6XC1HVllqo3UvK2u7PRqjOfMJaD5gGkGvECgLxtILndQrWMUr4Mn8I4VurUyxMOipFw== + version "5.6.1" + resolved "https://registry.yarnpkg.com/nano-css/-/nano-css-5.6.1.tgz#964120cb1af6cccaa6d0717a473ccd876b34c197" + integrity sha512-T2Mhc//CepkTa3X4pUhKgbEheJHYAxD0VptuqFhDbGMUWVV2m+lkNiW/Ieuj35wrfC8Zm0l7HvssQh7zcEttSw== dependencies: "@jridgewell/sourcemap-codec" "^1.4.15" css-tree "^1.1.2" @@ -15666,6 +15661,13 @@ q@^1.1.2: resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7" integrity sha512-kV/CThkXo6xyFEZUugw/+pIOywXcDbFYgSct5cT3gqlbkBE1SJdwy6UQoZvodiWF/ckQLZyDE/Bu1M6gVu5lVw== +qs@6.10.4: + version "6.10.4" + resolved "https://registry.yarnpkg.com/qs/-/qs-6.10.4.tgz#6a3003755add91c0ec9eacdc5f878b034e73f9e7" + integrity sha512-OQiU+C+Ds5qiH91qh/mg0w+8nwQuLjM4F4M/PbmhDOoYehPh+Fb0bDjtR1sOvy7YKxvj28Y/M0PhP5uVX0kB+g== + dependencies: + side-channel "^1.0.4" + qs@6.11.0: version "6.11.0" resolved "https://registry.yarnpkg.com/qs/-/qs-6.11.0.tgz#fd0d963446f7a65e1367e01abd85429453f0c37a" @@ -15680,13 +15682,6 @@ qs@^6.10.0, qs@^6.10.3, qs@^6.11.0, qs@^6.11.2: dependencies: side-channel "^1.0.4" -qs@~6.10.3: - version "6.10.5" - resolved "https://registry.yarnpkg.com/qs/-/qs-6.10.5.tgz#974715920a80ff6a262264acd2c7e6c2a53282b4" - integrity sha512-O5RlPh0VFtR78y79rgcgKK4wbAI0C5zGVLztOIdpWX6ep368q5Hv6XRxDvXuZ9q3C6v+e3n8UfZZJw7IIG27eQ== - dependencies: - side-channel "^1.0.4" - querystring@^0.2.0: version "0.2.1" resolved "https://registry.yarnpkg.com/querystring/-/querystring-0.2.1.tgz#40d77615bb09d16902a85c3e38aa8b5ed761c2dd" @@ -15903,9 +15898,9 @@ react-focus-lock@2.5.2: use-sidecar "^1.0.5" react-grid-layout@^1.4.3: - version "1.4.3" - resolved "https://registry.yarnpkg.com/react-grid-layout/-/react-grid-layout-1.4.3.tgz#9622c4dbdbc863bf1a29a50ed5c35c4c52922d3a" - integrity sha512-maZJfspM5aDmO/1kJj1U13HQ44rh6svcV7VQPOU9c2UfZhh8Z5AuZb+iVrzETWjsisHBYD3e2zckVovUnqvGHA== + version "1.4.4" + resolved "https://registry.yarnpkg.com/react-grid-layout/-/react-grid-layout-1.4.4.tgz#0bdb19d6db061556868fef1f430cc8c14d21f131" + integrity sha512-7+Lg8E8O8HfOH5FrY80GCIR1SHTn2QnAYKh27/5spoz+OHhMmEhU/14gIkRzJOtympDPaXcVRX/nT1FjmeOUmQ== dependencies: clsx "^2.0.0" fast-equals "^4.0.3" @@ -18769,7 +18764,7 @@ typescript-tuple@^2.2.1: dependencies: typescript-compare "^0.0.2" -typescript@^3.0.0, typescript@^5.0.4, typescript@^5.3.2: +typescript@^5.0.4, typescript@^5.3.2: version "5.3.2" resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.3.2.tgz#00d1c7c1c46928c5845c1ee8d0cc2791031d4c43" integrity sha512-6l+RyNy7oAHDfxC4FzSJcz9vnjTKxrLpDG5M2Vu4SHRVNg6xzqZp6LYSR9zjqQTu8DU/f5xwxUdADOkbrIX2gQ== From 0e6c82e25412cb67c3410a4e90bc30fdb510bbab Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Romain?= Date: Tue, 28 Nov 2023 10:15:27 +0100 Subject: [PATCH 04/12] feat: message upgrade (#5011) --- .changeset/famous-adults-cough.md | 11 ++++ .../Message/Primitive/MessagePrimitive.tsx | 58 +++++++++++++------ .../Primitive/MessageStyles.module.scss | 11 +++- .../__snapshots__/Message.test.tsx.snap | 8 +-- .../src/stories/messaging/Message.stories.tsx | 30 ++++++---- 5 files changed, 81 insertions(+), 37 deletions(-) create mode 100644 .changeset/famous-adults-cough.md diff --git a/.changeset/famous-adults-cough.md b/.changeset/famous-adults-cough.md new file mode 100644 index 00000000000..7883fd5fc67 --- /dev/null +++ b/.changeset/famous-adults-cough.md @@ -0,0 +1,11 @@ +--- +'@talend/design-system': minor +--- + +feat: rework some part of Message component + +- The size of a message fit the container width while before, it has a max width of `28rem` +- add a new prop `titleInfo` that allow to display an information message aside the title +- add new prop `additionalIconAction` to allow to display an additional button icon instead (there was only the dropdown action available before) +- rename prop `additionalActions` to `additionalDropdownActions` to make the API more explicit +- remove the shadow on the message to make it more consistent with the rest of the design and integrate better in the page diff --git a/packages/design-system/src/components/Message/Primitive/MessagePrimitive.tsx b/packages/design-system/src/components/Message/Primitive/MessagePrimitive.tsx index 68802033632..6e782e9e336 100644 --- a/packages/design-system/src/components/Message/Primitive/MessagePrimitive.tsx +++ b/packages/design-system/src/components/Message/Primitive/MessagePrimitive.tsx @@ -1,40 +1,56 @@ import { forwardRef, HTMLAttributes, ReactNode, Ref } from 'react'; +import type { ReactElement } from 'react'; import { useTranslation } from 'react-i18next'; +import classnames from 'classnames'; + +import tokens from '@talend/design-tokens'; // eslint-disable-next-line @talend/import-depth import { IconNameWithSize } from '@talend/icons/dist/typeUtils'; -import tokens from '@talend/design-tokens'; -import classnames from 'classnames'; -import { SizedIcon } from '../../Icon'; -import Link, { LinkProps } from '../../Link/Link'; -import { StackHorizontal, StackVertical } from '../../Stack'; -import { ButtonTertiaryPropsType } from '../../Button/variations/ButtonTertiary'; import { ButtonTertiary } from '../../Button'; -import { Dropdown, DropdownPropsType } from '../../Dropdown'; +import { ButtonTertiaryPropsType } from '../../Button/variations/ButtonTertiary'; import { ButtonIcon } from '../../ButtonIcon'; +import type { ButtonIconType } from '../../ButtonIcon/variations/ButtonIcon'; import { I18N_DOMAIN_DESIGN_SYSTEM } from '../../constants'; +import { Dropdown, DropdownPropsType } from '../../Dropdown'; +import { SizedIcon } from '../../Icon'; +import Link, { LinkProps } from '../../Link/Link'; +import { StackHorizontal, StackVertical } from '../../Stack'; import styles from './MessageStyles.module.scss'; +type SharedMessageWithActionsPropsType = { + additionalIconAction?: ButtonIconType<'XS'>; + additionalDropdownActions?: never; +}; + +type SharedMessageWithActionPropsType = { + additionalIconAction?: never; + additionalDropdownActions?: Omit; +}; + export type SharedMessageCollectionProps = Omit< HTMLAttributes, 'style' | 'children' | 'className' > & { action: ButtonTertiaryPropsType<'S'>; - additionalActions?: Omit; - description: string; + additionalIconAction?: ButtonIconType<'XS'>; + additionalDropdownActions?: Omit; + description: string | ReactElement | string[] | ReactElement[]; title: string; -}; +} & (SharedMessageWithActionPropsType | SharedMessageWithActionsPropsType); export type SharedMessageProps = Omit, 'style' | 'className'> & { action?: ButtonTertiaryPropsType<'S'>; - additionalActions?: Omit; + additionalIconAction?: ButtonIconType<'XS'>; + additionalDropdownActions?: Omit; children?: ReactNode | ReactNode[]; - description: string; + description: string | ReactElement | string[] | ReactElement[]; link?: LinkProps; title?: string; -}; + titleInfo?: string; +} & (SharedMessageWithActionPropsType | SharedMessageWithActionsPropsType); export type BaseMessageProps = Omit & SharedMessageProps & { @@ -48,11 +64,13 @@ export const MessagePrimitive = forwardRef( borderClassname, description, title, + titleInfo, link, icon, children, action, - additionalActions, + additionalIconAction, + additionalDropdownActions, ...props }: BaseMessageProps, ref: Ref, @@ -68,23 +86,25 @@ export const MessagePrimitive = forwardRef( ref={ref} > - {title && ( + {title || titleInfo ? (
- + {icon && ( )} {title} + {titleInfo ?
{titleInfo}
: null}
- )} + ) : null}

{description}

{link && } {children} {action && } - {additionalActions && ( - + {additionalIconAction && } + {additionalDropdownActions && ( + {}}> {t('ADDITIONAL_ACTIONS', 'Additional actions')} diff --git a/packages/design-system/src/components/Message/Primitive/MessageStyles.module.scss b/packages/design-system/src/components/Message/Primitive/MessageStyles.module.scss index b8cc9808f56..69f4694ae20 100644 --- a/packages/design-system/src/components/Message/Primitive/MessageStyles.module.scss +++ b/packages/design-system/src/components/Message/Primitive/MessageStyles.module.scss @@ -3,10 +3,9 @@ .message { display: flex; border-radius: tokens.$coral-radius-s; - box-shadow: tokens.$coral-elevation-shadow-neutral-m; + border: tokens.$coral-border-s-solid tokens.$coral-color-neutral-border-weak; background-color: tokens.$coral-color-neutral-background; height: 100%; - width: 28rem; border-top-left-radius: tokens.$coral-radius-s; border-bottom-left-radius: tokens.$coral-radius-s; @@ -14,6 +13,14 @@ &__title { font: tokens.$coral-heading-m; + width: 100%; + + &__info { + font: tokens.$coral-paragraph-s; + color: tokens.$coral-color-neutral-text-weak; + white-space: nowrap; + margin-left: auto; + } } &__description { diff --git a/packages/design-system/src/components/Message/__snapshots__/Message.test.tsx.snap b/packages/design-system/src/components/Message/__snapshots__/Message.test.tsx.snap index 37779e46381..9628b326ead 100644 --- a/packages/design-system/src/components/Message/__snapshots__/Message.test.tsx.snap +++ b/packages/design-system/src/components/Message/__snapshots__/Message.test.tsx.snap @@ -14,7 +14,7 @@ exports[`Message should render a11y html 1`] = ` class="theme-message__title" >
All good
@@ -80,7 +80,7 @@ exports[`Message should render a11y html 1`] = ` class="theme-message__title" >
Something went wrong
@@ -146,7 +146,7 @@ exports[`Message should render a11y html 1`] = ` class="theme-message__title" >
Type incompatibilities
@@ -212,7 +212,7 @@ exports[`Message should render a11y html 1`] = ` class="theme-message__title" >
Auto mapping
diff --git a/packages/design-system/src/stories/messaging/Message.stories.tsx b/packages/design-system/src/stories/messaging/Message.stories.tsx index 5946eee3c49..47e3e78bfa0 100644 --- a/packages/design-system/src/stories/messaging/Message.stories.tsx +++ b/packages/design-system/src/stories/messaging/Message.stories.tsx @@ -17,7 +17,6 @@ import { TagSuccess, TagWarning, } from '../../'; - import { MessagePrimitive } from '../../components/Message/Primitive/MessagePrimitive'; export default { component: MessagePrimitive, title: 'Messaging/Message' }; @@ -25,16 +24,23 @@ export const DefaultMessageDemo = () => ( Good Default ( {} }, - additionalActions: { + additionalDropdownActions: { 'aria-label': 'Additional actions', items: [ { label: 'Select all', type: 'button', onClick: action('select all clicked') }, @@ -141,7 +147,7 @@ export const DefaultMessageCollectionDemo = () => ( description="Try resolving it this way or consult the documentation for more info." title="Success" action={{ children: 'See all (3)', onClick: action('action clicked') }} - additionalActions={{ + additionalDropdownActions={{ 'aria-label': 'Additional actions', items: [ { label: 'Select all', type: 'button', onClick: action('select all clicked') }, @@ -154,7 +160,7 @@ export const DefaultMessageCollectionDemo = () => ( title="Error" description="(n) input fields have been automatically mapped to an output." action={{ children: 'See all (3)', onClick: action('action clicked') }} - additionalActions={{ + additionalDropdownActions={{ 'aria-label': 'Additional actions', items: [ { label: 'Select all', type: 'button', onClick: action('select all clicked') }, @@ -167,7 +173,7 @@ export const DefaultMessageCollectionDemo = () => ( title="Warning" description="Try resolving it this way or consult the documentation for more info." action={{ children: 'See all (3)', onClick: action('action clicked') }} - additionalActions={{ + additionalDropdownActions={{ 'aria-label': 'Additional actions', items: [ { label: 'Select all', type: 'button', onClick: action('select all clicked') }, @@ -180,7 +186,7 @@ export const DefaultMessageCollectionDemo = () => ( description="(n) input fields have been automatically mapped to an output." title="Information" action={{ children: 'See all (3)', onClick: action('action clicked') }} - additionalActions={{ + additionalDropdownActions={{ 'aria-label': 'Additional actions', items: [ { label: 'Select all', type: 'button', onClick: action('select all clicked') }, @@ -203,7 +209,7 @@ export const MessageCollectionWithPropVariation = () => ( title="Warning" description="Try resolving it this way or consult the documentation for more info." action={{ children: 'See all (3)', onClick: action('action clicked') }} - additionalActions={{ + additionalDropdownActions={{ 'aria-label': 'Additional actions', items: [ { label: 'Select all', type: 'button', onClick: action('select all clicked') }, @@ -226,7 +232,7 @@ MessageCollectionInformationTemplateStory.args = { action: { children: 'See', onClick: () => {} }, title: 'Information Title', description: 'Maybe resolve this issue before doing anything else', - additionalActions: { + additionalDropdownActions: { 'aria-label': 'Additional actions', items: [ { label: 'Select all', type: 'button', onClick: action('select all clicked') }, @@ -246,7 +252,7 @@ MessageCollectionInformationTemplateStory.argTypes = { description: { control: { type: 'text' }, }, - additionalActions: { + additionalDropdownActions: { control: { type: 'object' }, }, }; From db246251d776b1295d450e7cd60fc66b248be2cf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Romain?= Date: Tue, 28 Nov 2023 10:20:22 +0100 Subject: [PATCH 05/12] fix: prevent display log of sass loader warnings (#5004) --- .changeset/flat-maps-dream.md | 5 +++++ .../config/webpack.config.common.js | 8 +++++++- 2 files changed, 12 insertions(+), 1 deletion(-) create mode 100644 .changeset/flat-maps-dream.md diff --git a/.changeset/flat-maps-dream.md b/.changeset/flat-maps-dream.md new file mode 100644 index 00000000000..0145d2ad2d5 --- /dev/null +++ b/.changeset/flat-maps-dream.md @@ -0,0 +1,5 @@ +--- +'@talend/scripts-config-react-webpack': patch +--- + +fix: prevent display log of lot of warnings related to sass loader diff --git a/tools/scripts-config-react-webpack/config/webpack.config.common.js b/tools/scripts-config-react-webpack/config/webpack.config.common.js index 81c606202bd..f8a1cfd74f5 100644 --- a/tools/scripts-config-react-webpack/config/webpack.config.common.js +++ b/tools/scripts-config-react-webpack/config/webpack.config.common.js @@ -72,7 +72,13 @@ function getSassLoaders(enableModules, sassData, isEnvDevelopmentServe) { { loader: require.resolve('resolve-url-loader'), options: { sourceMap } }, { loader: require.resolve('sass-loader'), - options: { sourceMap, additionalData: sassData }, + options: { + sourceMap, + additionalData: sassData, + sassOptions: { + quietDeps: true, + }, + }, }, ); } From cb5cb9a0a2be5e09384fdc22d1f0ba47fb0afdec Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Tue, 28 Nov 2023 10:20:35 +0100 Subject: [PATCH 06/12] chore(deps): bump cypress-io/github-action from 6.5.0 to 6.6.0 (#4969) --- .github/workflows/design-system-component-testing.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/design-system-component-testing.yml b/.github/workflows/design-system-component-testing.yml index a96c3443a84..8bb916cf46a 100644 --- a/.github/workflows/design-system-component-testing.yml +++ b/.github/workflows/design-system-component-testing.yml @@ -42,7 +42,7 @@ jobs: yarn workspace @talend/design-tokens run build:lib - name: Cypress Component Testing - uses: cypress-io/github-action@59810ebfa5a5ac6fcfdcfdf036d1cd4d083a88f2 #v6.5.0 + uses: cypress-io/github-action@ebe8b24c4428922d0f793a5c4c96853a633180e3 #v6.6.0 with: install: false browser: ${{ matrix.browser }} From ea026ec12244fa40097ede9cf3bc68fcf34eb321 Mon Sep 17 00:00:00 2001 From: sgendre <31214611+sgendre@users.noreply.github.com> Date: Tue, 28 Nov 2023 10:26:08 +0100 Subject: [PATCH 07/12] feat(forms): migrate to DS Tabs + CollapsibleFieldset (#4928) --- .changeset/beige-terms-yell.md | 5 + .changeset/few-months-tickle.md | 5 + .../Tabs/Primitive/TabStyles.module.scss | 20 +++ .../src/components/Tabs/Primitive/Tabs.tsx | 6 +- .../src/components/Tabs/variants/Tabs.tsx | 9 +- .../src/stories/navigation/Tabs.stories.tsx | 22 +++ .../UIForm/fieldsets/Array/Array.component.js | 1 + .../CollapsibleFieldset.component.js | 51 ++++-- .../CollapsibleFieldset.component.test.js | 26 +-- ...CollapsibleFieldset.component.test.js.snap | 157 +++++++----------- .../UIForm/fieldsets/Tabs/Tabs.component.js | 39 ++--- .../__snapshots__/Tabs.component.test.js.snap | 92 ++++------ packages/forms/src/UIForm/utils/array.js | 1 + .../forms/stories/SchemaFieldsets.stories.tsx | 10 ++ .../forms/stories/SchemaState.stories.tsx | 4 +- .../UIFormStoriesSchemas/errors.schema.js | 47 ++++++ .../fieldsets/core-arrays-collapsible.json | 89 ++++++++++ .../forms/stories/json/fieldsets/index.ts | 1 + 18 files changed, 372 insertions(+), 213 deletions(-) create mode 100644 .changeset/beige-terms-yell.md create mode 100644 .changeset/few-months-tickle.md create mode 100644 packages/forms/stories/json/fieldsets/core-arrays-collapsible.json diff --git a/.changeset/beige-terms-yell.md b/.changeset/beige-terms-yell.md new file mode 100644 index 00000000000..44df4b4bf36 --- /dev/null +++ b/.changeset/beige-terms-yell.md @@ -0,0 +1,5 @@ +--- +'@talend/react-forms': minor +--- + +Use DS tabs in UIForm diff --git a/.changeset/few-months-tickle.md b/.changeset/few-months-tickle.md new file mode 100644 index 00000000000..e7c8d0af7ed --- /dev/null +++ b/.changeset/few-months-tickle.md @@ -0,0 +1,5 @@ +--- +'@talend/design-system': minor +--- + +Error state for tabs diff --git a/packages/design-system/src/components/Tabs/Primitive/TabStyles.module.scss b/packages/design-system/src/components/Tabs/Primitive/TabStyles.module.scss index d0224816457..76737107486 100644 --- a/packages/design-system/src/components/Tabs/Primitive/TabStyles.module.scss +++ b/packages/design-system/src/components/Tabs/Primitive/TabStyles.module.scss @@ -102,4 +102,24 @@ margin-right: tokens.$coral-spacing-s; } } + + &_error { + color: tokens.$coral-color-danger-text; + + &[aria-selected='true'] { + color: tokens.$coral-color-danger-text; + } + } + + &_error::after { + content: ''; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + border-top: tokens.$coral-border-m-solid tokens.$coral-color-danger-text; + opacity: 0; + transition: tokens.$coral-transition-fast; + transform: translateY(100%); + } } diff --git a/packages/design-system/src/components/Tabs/Primitive/Tabs.tsx b/packages/design-system/src/components/Tabs/Primitive/Tabs.tsx index 2efcab63ffe..4e221050612 100644 --- a/packages/design-system/src/components/Tabs/Primitive/Tabs.tsx +++ b/packages/design-system/src/components/Tabs/Primitive/Tabs.tsx @@ -28,6 +28,7 @@ export type TabPropTypes = { icon?: IconNameWithSize<'S'>; tag?: string | number; tooltip?: string; + error?: boolean; }; export function Tab(props: TabPropTypes) { @@ -36,7 +37,10 @@ export function Tab(props: TabPropTypes) { - + + - + + Jimmy, Somsanith + +
-
- -

- - This is description - -

-
-

- Widget not found - string -

+ + +

- Widget not found - string + + This is description +

+

+ Widget not found + string +

+

+ Widget not found + string +

diff --git a/packages/forms/src/UIForm/fieldsets/Tabs/Tabs.component.js b/packages/forms/src/UIForm/fieldsets/Tabs/Tabs.component.js index 86c65244bdd..3b54f097f7b 100644 --- a/packages/forms/src/UIForm/fieldsets/Tabs/Tabs.component.js +++ b/packages/forms/src/UIForm/fieldsets/Tabs/Tabs.component.js @@ -1,29 +1,22 @@ import PropTypes from 'prop-types'; -import { useState } from 'react'; -import TabBar from '@talend/react-components/lib/TabBar'; -import classNames from 'classnames'; -import { useTranslation } from 'react-i18next'; +import { Tabs } from '@talend/design-system'; import Widget from '../../Widget'; import { isValid } from '../../utils/validation'; -import theme from './Tabs.module.scss'; -import { I18N_DOMAIN_FORMS } from '../../../constants'; - -function Tabs(props) { - const [selectedKey, setSelectedKey] = useState(0); - const { t } = useTranslation(I18N_DOMAIN_FORMS); +function TabsAdapter(props) { const { schema, ...restProps } = props; + const tabs = schema.items.map((item, index) => { const tabIsValid = isValid(item, restProps.errors); return { key: index, - label: item.title, - className: classNames({ [theme['has-error']]: !tabIsValid }), - 'aria-label': tabIsValid - ? undefined - : `${item.title} (${t('TF_TABS_HAS_ERRORS', { defaultValue: 'has errors' })})`, - children: ( + tabTitle: { + title: item.title, + id: `${restProps.id}-tabs-${index}`, + error: !tabIsValid, + }, + tabContent: ( setSelectedKey(item.key)} - selectedKey={selectedKey} - /> - ); + return ; } if (process.env.NODE_ENV !== 'production') { - Tabs.propTypes = { + TabsAdapter.propTypes = { errors: PropTypes.object, schema: PropTypes.shape({ items: PropTypes.arrayOf( @@ -57,4 +42,4 @@ if (process.env.NODE_ENV !== 'production') { }; } -export default Tabs; +export default TabsAdapter; diff --git a/packages/forms/src/UIForm/fieldsets/Tabs/__snapshots__/Tabs.component.test.js.snap b/packages/forms/src/UIForm/fieldsets/Tabs/__snapshots__/Tabs.component.test.js.snap index 816fb2e547e..f05c1ee2664 100644 --- a/packages/forms/src/UIForm/fieldsets/Tabs/__snapshots__/Tabs.component.test.js.snap +++ b/packages/forms/src/UIForm/fieldsets/Tabs/__snapshots__/Tabs.component.test.js.snap @@ -1,77 +1,54 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Tabs widget should render tabs 1`] = ` -
-
    - -
  • + + -
    • -
-
-
+
+ +
- + `; diff --git a/packages/forms/src/UIForm/utils/array.js b/packages/forms/src/UIForm/utils/array.js index cd0a78e6e03..bc8c3eb4f63 100644 --- a/packages/forms/src/UIForm/utils/array.js +++ b/packages/forms/src/UIForm/utils/array.js @@ -131,5 +131,6 @@ export function getArrayElementSchema(arraySchema, elementIndex) { items: getArrayElementItems(arraySchema, elementIndex), widget: arraySchema.itemWidget || 'fieldset', title: arraySchema.itemTitle, + managed: arraySchema.itemManaged, }; } diff --git a/packages/forms/stories/SchemaFieldsets.stories.tsx b/packages/forms/stories/SchemaFieldsets.stories.tsx index 0eb5518003f..a5210c59db4 100644 --- a/packages/forms/stories/SchemaFieldsets.stories.tsx +++ b/packages/forms/stories/SchemaFieldsets.stories.tsx @@ -54,6 +54,16 @@ export const CoreCollapsibleFieldset = { data: fieldsets.coreCollapsibleFieldset, }, }; +export const CoreArraysCollapsibleFieldset = { + parameters: { + formStoryDisplayMode: { + doc: 'ArraysCollapsibleFieldset/README.md', + }, + }, + args: { + data: fieldsets.coreArraysCollapsibleFieldset, + }, +}; export const CoreColumns = { parameters: { formStoryDisplayMode: { diff --git a/packages/forms/stories/SchemaState.stories.tsx b/packages/forms/stories/SchemaState.stories.tsx index d8fe62fec2a..cfbc81dfd73 100644 --- a/packages/forms/stories/SchemaState.stories.tsx +++ b/packages/forms/stories/SchemaState.stories.tsx @@ -85,7 +85,9 @@ const errorsProps = errorsSchema.uiSchema.reduce( ...acc, [current.key.split('.').join(',')]: 'There is an error', }), - {}, + { + tabConfiguration: 'There is an error', + }, ); export const Errors: Story = { diff --git a/packages/forms/stories/UIFormStoriesSchemas/errors.schema.js b/packages/forms/stories/UIFormStoriesSchemas/errors.schema.js index ef86ec63d6f..4f0454aa8f9 100644 --- a/packages/forms/stories/UIFormStoriesSchemas/errors.schema.js +++ b/packages/forms/stories/UIFormStoriesSchemas/errors.schema.js @@ -2,7 +2,25 @@ export const errorsSchema = { jsonSchema: { type: 'object', title: 'Comment', + required: ['fieldname'], properties: { + tabConfiguration: { + type: 'object', + properties: { + fieldname: { + type: 'string', + }, + }, + }, + fieldname: { + type: 'string', + }, + description: { + type: 'string', + }, + tabs: { + type: 'tabs', + }, arrayOfObjects: { type: 'array', items: { @@ -84,6 +102,35 @@ export const errorsSchema = { }, }, uiSchema: [ + { + key: 'tabs', + title: '2 Tabs', + widget: 'tabs', + items: [ + { + key: 'tabConfiguration', + title: 'Configuration', + widget: 'fieldset', + items: [ + { + key: 'fieldname', + title: 'Field Name', + }, + ], + }, + { + key: 'tabInfo', + title: 'Info', + widget: 'fieldset', + items: [ + { + key: 'description', + title: 'Description', + }, + ], + }, + ], + }, { key: 'arrayOfObjects', title: 'Array of objects', diff --git a/packages/forms/stories/json/fieldsets/core-arrays-collapsible.json b/packages/forms/stories/json/fieldsets/core-arrays-collapsible.json new file mode 100644 index 00000000000..143aaa96341 --- /dev/null +++ b/packages/forms/stories/json/fieldsets/core-arrays-collapsible.json @@ -0,0 +1,89 @@ +{ + "jsonSchema": { + "type": "object", + "title": "Comment", + "required": ["comments"], + "properties": { + "groupBy": { + "type": "array", + "minItems": 1, + "maxItems": 5, + "items": { + "type": "object", + "properties": { + "fieldName": { + "type": "string", + "enum": ["First Field", "Second Field", "Third Field"] + } + } + } + }, + "operations": { + "type": "array", + "minItems": 1, + "maxItems": 5, + "items": { + "type": "object", + "properties": { + "fieldName": { + "type": "string", + "enum": ["First Field", "Second Field", "Third Field"] + }, + "operation": { + "type": "string", + "enum": ["First Operation", "Second Operation", "Third Operation"] + } + } + } + } + } + }, + "uiSchema": [ + { + "key": "operations", + "title": "Operations", + "itemWidget": "collapsibleFieldset", + "itemManaged": false, + "items": [ + { + "key": "operations[].fieldName", + "title": "Field" + }, + { + "key": "operations[].operation", + "title": "Operation" + } + ] + }, + { + "key": "groupBy", + "title": "Group by", + "items": [ + { + "key": "groupBy[].fieldName", + "title": "Field" + } + ] + } + ], + "properties": { + "groupBy": [ + { + "fieldName": "First Field" + }, + { + "fieldName": "Second Field" + } + ], + "operations": [ + { + "fieldName": "First Field", + "operation": "First Operation" + }, + { + "fieldName": "Second Field", + "operation": "First Operation" + } + ] + } +} diff --git a/packages/forms/stories/json/fieldsets/index.ts b/packages/forms/stories/json/fieldsets/index.ts index fec5e66d191..74927719732 100644 --- a/packages/forms/stories/json/fieldsets/index.ts +++ b/packages/forms/stories/json/fieldsets/index.ts @@ -2,6 +2,7 @@ export { default as coreArraysComplex } from './core-arrays-complex.json'; export { default as coreArraysWithCustomOptions } from './core-arrays-with-custom-options.json'; export { default as coreArrays } from './core-arrays.json'; export { default as coreCollapsibleFieldset } from './core-collapsibleFieldset.json'; +export { default as coreArraysCollapsibleFieldset } from './core-arrays-collapsible.json'; export { default as coreColumns } from './core-columns.json'; export { default as coreFieldset } from './core-fieldset.json'; export { default as coreTabs } from './core-tabs.json'; From 4582fc6faf986e2b8ef483bba8441a7a8e578c65 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Tue, 28 Nov 2023 10:31:22 +0100 Subject: [PATCH 08/12] chore(deps): bump actions/checkout from 4.0.0 to 4.1.0 (#4905) --- .github/workflows/changeset.yml | 2 +- .github/workflows/dependencies.yml | 2 +- .github/workflows/design-system-component-testing.yml | 2 +- .github/workflows/icons.yml | 2 +- .github/workflows/pr-demo.yml | 2 +- .github/workflows/pr-lint.yml | 2 +- .github/workflows/pr-playground.yml | 4 ++-- .github/workflows/pr-test.yml | 2 +- .github/workflows/security-scan.yml | 2 +- .github/workflows/semgrep.yml | 2 +- .github/workflows/tests-cron.yml | 2 +- .github/workflows/visual-testing.yml | 2 +- .github/workflows/yarn-deduplicate.yml | 2 +- 13 files changed, 14 insertions(+), 14 deletions(-) diff --git a/.github/workflows/changeset.yml b/.github/workflows/changeset.yml index 91147291ee4..7e7ae8b82e6 100644 --- a/.github/workflows/changeset.yml +++ b/.github/workflows/changeset.yml @@ -23,7 +23,7 @@ jobs: runs-on: ubuntu-latest steps: - name: Checkout Repo - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 with: # This makes Actions fetch all Git history so that Changesets can generate changelogs with the correct commits fetch-depth: 0 diff --git a/.github/workflows/dependencies.yml b/.github/workflows/dependencies.yml index fc6b2687c2e..3d9db11ebf2 100644 --- a/.github/workflows/dependencies.yml +++ b/.github/workflows/dependencies.yml @@ -19,7 +19,7 @@ jobs: steps: - name: Checkout - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 - name: Use Node.js uses: ./.github/actions/setup-node diff --git a/.github/workflows/design-system-component-testing.yml b/.github/workflows/design-system-component-testing.yml index 8bb916cf46a..0187e7a70cb 100644 --- a/.github/workflows/design-system-component-testing.yml +++ b/.github/workflows/design-system-component-testing.yml @@ -22,7 +22,7 @@ jobs: browser: ["chrome", "firefox"] steps: - name: Checkout repository - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 - name: Use Node.js uses: ./.github/actions/setup-node diff --git a/.github/workflows/icons.yml b/.github/workflows/icons.yml index 04d6a4b7b2d..e76739fdfbf 100644 --- a/.github/workflows/icons.yml +++ b/.github/workflows/icons.yml @@ -19,7 +19,7 @@ jobs: working-directory: ./packages/icons steps: - name: Checkout sources - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 with: # Required when using a PAT for opening the PR persist-credentials: false diff --git a/.github/workflows/pr-demo.yml b/.github/workflows/pr-demo.yml index 984e066f635..9799d30effe 100644 --- a/.github/workflows/pr-demo.yml +++ b/.github/workflows/pr-demo.yml @@ -25,7 +25,7 @@ jobs: steps: - name: Checkout sources - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 - name: Use Node.js uses: ./.github/actions/setup-node diff --git a/.github/workflows/pr-lint.yml b/.github/workflows/pr-lint.yml index 9dcc3c90db2..da6fe1776b3 100644 --- a/.github/workflows/pr-lint.yml +++ b/.github/workflows/pr-lint.yml @@ -22,7 +22,7 @@ jobs: steps: - name: Checkout sources - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 with: persist-credentials: false # otherwise, the token used is the GITHUB_TOKEN, instead of your personal token fetch-depth: 0 # otherwise, you will failed to push refs to dest repo diff --git a/.github/workflows/pr-playground.yml b/.github/workflows/pr-playground.yml index 9e709ace2d2..4109135d513 100644 --- a/.github/workflows/pr-playground.yml +++ b/.github/workflows/pr-playground.yml @@ -24,7 +24,7 @@ jobs: steps: - name: Checkout sources - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 - name: Use Node.js uses: ./.github/actions/setup-node @@ -70,7 +70,7 @@ jobs: steps: - name: Checkout sources - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 - name: Use Node.js uses: ./.github/actions/setup-node diff --git a/.github/workflows/pr-test.yml b/.github/workflows/pr-test.yml index f4a95de1790..0a5fe4ecfb5 100644 --- a/.github/workflows/pr-test.yml +++ b/.github/workflows/pr-test.yml @@ -21,7 +21,7 @@ jobs: steps: - name: Checkout sources - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 - name: Use Node.js uses: ./.github/actions/setup-node diff --git a/.github/workflows/security-scan.yml b/.github/workflows/security-scan.yml index 67cb34df4dd..ff096eebcb9 100644 --- a/.github/workflows/security-scan.yml +++ b/.github/workflows/security-scan.yml @@ -13,7 +13,7 @@ jobs: environment: main runs-on: ubuntu-latest steps: - - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + - uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 - name: Scan uses: ./.github/actions/sourceclear env: diff --git a/.github/workflows/semgrep.yml b/.github/workflows/semgrep.yml index d39b9aba049..3db50260f25 100644 --- a/.github/workflows/semgrep.yml +++ b/.github/workflows/semgrep.yml @@ -26,7 +26,7 @@ jobs: if: (github.actor != 'dependabot[bot]') steps: - - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + - uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 # Run the "semgrep ci" command on the command line of the docker image. - run: semgrep ci env: diff --git a/.github/workflows/tests-cron.yml b/.github/workflows/tests-cron.yml index 1641011e9de..e593c6f0239 100644 --- a/.github/workflows/tests-cron.yml +++ b/.github/workflows/tests-cron.yml @@ -17,7 +17,7 @@ jobs: steps: - name: Checkout - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 - name: Use Node.js uses: ./.github/actions/setup-node diff --git a/.github/workflows/visual-testing.yml b/.github/workflows/visual-testing.yml index 7d2a26b5830..f706a6581e5 100644 --- a/.github/workflows/visual-testing.yml +++ b/.github/workflows/visual-testing.yml @@ -28,7 +28,7 @@ jobs: environment: pull_request_unsafe if: ( github.ref == 'refs/heads/master' || contains(github.event.pull_request.labels.*.name, 'need visual approval') ) steps: - - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + - uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 with: fetch-depth: 0 diff --git a/.github/workflows/yarn-deduplicate.yml b/.github/workflows/yarn-deduplicate.yml index d9dfb8526d4..fbaf79774a0 100644 --- a/.github/workflows/yarn-deduplicate.yml +++ b/.github/workflows/yarn-deduplicate.yml @@ -23,7 +23,7 @@ jobs: steps: - name: Checkout sources - uses: actions/checkout@3df4ab11eba7bda6032a0b82a6bb43b11571feac #v4.0.0 + uses: actions/checkout@8ade135a41bc03ea155e62e844d188df1ea18608 #v4.1.0 with: persist-credentials: false # otherwise, the token used is the GITHUB_TOKEN, instead of your personal token fetch-depth: 0 # otherwise, you will failed to push refs to dest repo From 9bdcf3ae8880869965b00f87b5afff68d827da01 Mon Sep 17 00:00:00 2001 From: Jean-Michel FRANCOIS Date: Tue, 28 Nov 2023 10:34:04 +0100 Subject: [PATCH 09/12] doc: update all documentation (#4869) --- fork/module-to-cdn/README.md | 78 ++++++++++++++----------- fork/module-to-cdn/jsonschema.json | 34 +++++++++++ tools/babel-plugin-assets-api/README.md | 2 + tools/eslint-plugin/README.md | 23 +++----- tools/scripts-cmf/README.md | 10 ++-- tools/scripts-config-babel/README.md | 4 +- 6 files changed, 96 insertions(+), 55 deletions(-) create mode 100644 fork/module-to-cdn/jsonschema.json diff --git a/fork/module-to-cdn/README.md b/fork/module-to-cdn/README.md index 617044f8732..32d5e511d17 100644 --- a/fork/module-to-cdn/README.md +++ b/fork/module-to-cdn/README.md @@ -1,30 +1,14 @@ # @talend/module-to-cdn -[![Build Status](https://travis-ci.org/toutpt/module-to-cdn.svg?branch=jmfrancois/chore/fork)](https://travis-ci.org/toutpt/module-to-cdn) -[![NPM][npm-icon] ][npm-url] -[![dependencies][dependencies-image] ][dependencies-url] -[![devdependencies][devdependencies-image] ][devdependencies-url] - -[npm-icon]: https://img.shields.io/npm/v/@talend/module-to-cdn.svg -[npm-url]: https://npmjs.org/package/@talend/module-to-cdn -[travis-ci-image]: https://travis-ci.org/toutpt/module-to-cdn.svg?branch=jmfrancois/chore/fork -[travis-ci-url]: https://travis-ci.org/toutpt/module-to-cdn -[dependencies-image]: https://david-dm.org/toutpt/module-to-cdn/status.svg -[dependencies-url]: https://david-dm.org/toutpt/module-to-cdn -[devdependencies-image]: https://david-dm.org/toutpt/module-to-cdn/dev-status.svg -[devdependencies-url]: https://david-dm.org/toutpt/module-to-cdn?type=dev - - > Get cdn config from npm module name ## Fork This module is fork of module-to-cdn from [Thomas Sileghem](http://mastilver.com). -Because unpkg is great for free usage [but not for production usage](https://kentcdodds.com/blog/unpkg-an-open-source-cdn-for-npm) we decided to made some changes to go forward. - -After the following [big PR]() on the repository and an email to the author we have got no news from the author as all other PRs. So we decided to fork. +Because unpkg is great for free usage [but not for production usage](https://kentcdodds.com/blog/unpkg-an-open-source-cdn-for-npm) we decided to made some changes to going forward. +After big PR on the repository and an email to the author we have got no news as all other PRs. So we decided to fork. ## Install @@ -32,7 +16,6 @@ After the following [big PR]() on the repository and an email to the author we $ npm install --save @talend/module-to-cdn ``` - ## Usage ```js @@ -50,6 +33,7 @@ moduleToCdn('react', '15.3.0'); */ ``` +Note if the package comes with css you will have them under `styleUrl` and `stylePath` properties ## API @@ -79,12 +63,12 @@ Default: `development` ### Result -* `name`: name of the module -* `var`: name of the global variable exposing the module -* `url`: url where the module is available -* `version`: the version asked for -* `path`: relative path of the umd file in the distributed package -* `local`: absolute path on the current system to the file +- `name`: name of the module +- `var`: name of the global variable exposing the module +- `url`: url where the module is available +- `version`: the version asked for +- `path`: relative path of the umd file in the distributed package +- `local`: absolute path on the current system to the file ## Configuration of the resolver @@ -118,9 +102,9 @@ moduleToCdn.add({ '@talend/my-private-module': { var: 'TalendMyPrivateModule', versions: { - '>= 0.0.0' : { - 'development': '/dist/build.js', - 'production': '/dist/build.min.js', + '>= 0.0.0': { + development: '/dist/build.js', + production: '/dist/build.min.js' } } } @@ -141,17 +125,45 @@ LIMIT=";ag-grid;ag-grid-community;ag-grid-enterprise;" ava -v ## Excluded modules +- hoist-non-react-statics: the umd build contains JS errors (process.env.NODE and require) on every versions. + +## style-versions -* hoist-non-react-statics: the umd build contains JS errors (process.env.NODE and require) on every versions. +For the sake of simplicity, range must match between js and styles. +Here is the line in the code that read it: + +```javascript +const styleConfig = moduleConf['style-versions'] && moduleConf['style-versions'][range]; +``` + +So take it as a constraint, for example: + +```json + "@talend/design-tokens": { + "var": "TalendDesignTokens", + "versions": { + "> 2.6.0": { + "development": "/dist/TalendDesignTokens.js", + "production": "/dist/TalendDesignTokens.min.js" + } + }, + "style-versions": { + "> 2.6.0": { + "development": "/dist/TalendDesignTokens.css", + "production": "/dist/TalendDesignTokens.min.css" + } + } + } +``` ## Contribute To add your modules you have to -* checkout this package on github -* install and run the tests (it will load the cache for the tests) -* add your module in the module.json file -* ensure everytime the provided umd path exists and is valid. +- checkout this package on github +- install and run the tests (it will load the cache for the tests) +- add your module in the module.json file +- ensure everytime the provided umd path exists and is valid. Example of not valid umd: https://unpkg.com/browse/react-popper@1.3.7/dist/index.umd.js createContext,deepEqual dependencies are always null. diff --git a/fork/module-to-cdn/jsonschema.json b/fork/module-to-cdn/jsonschema.json new file mode 100644 index 00000000000..9fe15150035 --- /dev/null +++ b/fork/module-to-cdn/jsonschema.json @@ -0,0 +1,34 @@ +{ + "$schema": "https://json-schema.org/draft/2020-12/schema", + "$id": "https://github.com/Talend/ui/modules.schema.json", + "title": "cdn modules schema", + "description": "Help you edit the file in vscode", + "type": "object", + "patternProperties": { + ".*": { + "type": "object", + + "properties": { + "var": { + "type": "string" + }, + "versions": { + "type": "object", + "patternProperties": { + ".*": { + "type": "object", + "properties": { + "development": { + "type": "string" + }, + "production": { + "type": "string" + } + } + } + } + } + } + } + } +} diff --git a/tools/babel-plugin-assets-api/README.md b/tools/babel-plugin-assets-api/README.md index 37d3eb90445..5bd1d83297f 100644 --- a/tools/babel-plugin-assets-api/README.md +++ b/tools/babel-plugin-assets-api/README.md @@ -23,3 +23,5 @@ assetsAPI.getURL('/', 'react', '16.14.0'); assetsAPI.getJSON('/foo.json', 'react', '16.14.0'); assetsAPI.getUMD('react', '16.14.0', 'React', '/umd/react.production.min.js'); ``` + +As you can see it uses production path in the getUMD. diff --git a/tools/eslint-plugin/README.md b/tools/eslint-plugin/README.md index d57b8ec30e5..550a33ec0a3 100644 --- a/tools/eslint-plugin/README.md +++ b/tools/eslint-plugin/README.md @@ -4,8 +4,7 @@ This package contains internal rules used at Talend. ## Installation -You have nothing to do if you use Talend/ui-scripts. - +You have nothing to do if you use Talend/ui-scripts. If not this can be used as any other eslint plugin ## Usage @@ -13,29 +12,21 @@ Add `talend` to the plugins section of your `.eslintrc` configuration file. You ```json { - "plugins": [ - "@talend" - ] + "plugins": ["@talend"] } ``` - Then configure the rules you want to use under the rules section. ```json { - "rules": { - "@talend/import-depth": 2 - } + "rules": { + "@talend/import-depth": 2 + } } ``` ## Supported Rules -* [talend/import-depth](./docs/rules/talend-import-depth.md) -* [talend/import-d3](./docs/rules/talend-import-d3.md) - - - - - +- [talend/import-depth](./docs/rules/talend-import-depth.md) +- [talend/import-d3](./docs/rules/talend-import-d3.md) diff --git a/tools/scripts-cmf/README.md b/tools/scripts-cmf/README.md index 81f133ccf68..c133710d85a 100644 --- a/tools/scripts-cmf/README.md +++ b/tools/scripts-cmf/README.md @@ -2,15 +2,15 @@ ## Usage -launch the command below to build your webapp. you can add it into `prepublish` npm script. - ``` -yarn cmf-settings +npx @talend/scripts-cmf ``` -Note: If you add `node_modules/.bin` into your env _PATH_ you can directly type `cmf-settings`. +You can also launch the command below to build your webapp. you can add it into `prepublish` npm script. -## cmf-settings +``` +yarn cmf-settings +``` This script merge a set of settings `sources` into a `destination` file. Each sources is a path to eiter a folder or a file. diff --git a/tools/scripts-config-babel/README.md b/tools/scripts-config-babel/README.md index 4ba4d886455..2e829428c59 100644 --- a/tools/scripts-config-babel/README.md +++ b/tools/scripts-config-babel/README.md @@ -1,4 +1,6 @@ -# Babel config customisation +This package contains the main babel configuration used everywhere else in Talend. + +## Babel config customisation You can use your own babelrc but it is not recommanded. To do so, you will need to extend the preset babelrc. From 83bc8aa082c511cd9ff5564123ee9a852d7aafd7 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Tue, 28 Nov 2023 09:42:35 +0000 Subject: [PATCH 10/12] chore(deps): bump get-func-name from 2.0.0 to 2.0.2 (#4910) From 48633516eade09cd50b31a015272be6a8463f2fb Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Tue, 28 Nov 2023 11:01:28 +0100 Subject: [PATCH 11/12] chore(deps): bump MishaKav/jest-coverage-comment from 1.0.23 to 1.0.24 (#5012) --- .github/workflows/pr-test.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/pr-test.yml b/.github/workflows/pr-test.yml index 0a5fe4ecfb5..c93938f9b30 100644 --- a/.github/workflows/pr-test.yml +++ b/.github/workflows/pr-test.yml @@ -33,7 +33,7 @@ jobs: run: yarn test --coverage --coverageReporters json-summary - name: Jest Coverage Comment - uses: MishaKav/jest-coverage-comment@41b5ca01d1250de84537448d248b8d18152cb277 #1.0.23 + uses: MishaKav/jest-coverage-comment@f2e8b560403c4fd8234a2b268af3c28ca91e5cc7 #1.0.24 with: multiple-files: | assets-api, ./packages/assets-api/coverage/coverage-summary.json From b5fc2c3bb53d5006c8a945a69aa3164bc9ecdddc Mon Sep 17 00:00:00 2001 From: Talend bot Date: Tue, 28 Nov 2023 11:12:16 +0100 Subject: [PATCH 12/12] chore: prepare release (#5014) --- .changeset/beige-terms-yell.md | 5 ----- .changeset/famous-adults-cough.md | 11 ----------- .changeset/few-months-tickle.md | 5 ----- .changeset/flat-maps-dream.md | 5 ----- packages/design-system/CHANGELOG.md | 14 ++++++++++++++ packages/design-system/package.json | 4 ++-- packages/forms/CHANGELOG.md | 12 ++++++++++++ packages/forms/package.json | 6 +++--- tools/scripts-config-react-webpack/CHANGELOG.md | 6 ++++++ tools/scripts-config-react-webpack/package.json | 2 +- 10 files changed, 38 insertions(+), 32 deletions(-) delete mode 100644 .changeset/beige-terms-yell.md delete mode 100644 .changeset/famous-adults-cough.md delete mode 100644 .changeset/few-months-tickle.md delete mode 100644 .changeset/flat-maps-dream.md diff --git a/.changeset/beige-terms-yell.md b/.changeset/beige-terms-yell.md deleted file mode 100644 index 44df4b4bf36..00000000000 --- a/.changeset/beige-terms-yell.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@talend/react-forms': minor ---- - -Use DS tabs in UIForm diff --git a/.changeset/famous-adults-cough.md b/.changeset/famous-adults-cough.md deleted file mode 100644 index 7883fd5fc67..00000000000 --- a/.changeset/famous-adults-cough.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -'@talend/design-system': minor ---- - -feat: rework some part of Message component - -- The size of a message fit the container width while before, it has a max width of `28rem` -- add a new prop `titleInfo` that allow to display an information message aside the title -- add new prop `additionalIconAction` to allow to display an additional button icon instead (there was only the dropdown action available before) -- rename prop `additionalActions` to `additionalDropdownActions` to make the API more explicit -- remove the shadow on the message to make it more consistent with the rest of the design and integrate better in the page diff --git a/.changeset/few-months-tickle.md b/.changeset/few-months-tickle.md deleted file mode 100644 index e7c8d0af7ed..00000000000 --- a/.changeset/few-months-tickle.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@talend/design-system': minor ---- - -Error state for tabs diff --git a/.changeset/flat-maps-dream.md b/.changeset/flat-maps-dream.md deleted file mode 100644 index 0145d2ad2d5..00000000000 --- a/.changeset/flat-maps-dream.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@talend/scripts-config-react-webpack': patch ---- - -fix: prevent display log of lot of warnings related to sass loader diff --git a/packages/design-system/CHANGELOG.md b/packages/design-system/CHANGELOG.md index 63f0c312b7b..59b56ddf022 100644 --- a/packages/design-system/CHANGELOG.md +++ b/packages/design-system/CHANGELOG.md @@ -1,5 +1,19 @@ # @talend/design-system +## 8.5.0 + +### Minor Changes + +- 0e6c82e25: feat: rework some part of Message component + + - The size of a message fit the container width while before, it has a max width of `28rem` + - add a new prop `titleInfo` that allow to display an information message aside the title + - add new prop `additionalIconAction` to allow to display an additional button icon instead (there was only the dropdown action available before) + - rename prop `additionalActions` to `additionalDropdownActions` to make the API more explicit + - remove the shadow on the message to make it more consistent with the rest of the design and integrate better in the page + +- ea026ec12: Error state for tabs + ## 8.4.1 ### Patch Changes diff --git a/packages/design-system/package.json b/packages/design-system/package.json index edf8ef26b86..79ddcfc41c0 100644 --- a/packages/design-system/package.json +++ b/packages/design-system/package.json @@ -1,6 +1,6 @@ { "name": "@talend/design-system", - "version": "8.4.1", + "version": "8.5.0", "description": "Talend Design System", "main": "lib/index.js", "types": "lib/index.d.ts", @@ -68,7 +68,7 @@ "@talend/locales-design-system": "^7.15.1", "@talend/scripts-core": "^16.3.0", "@talend/scripts-config-babel": "^13.2.0", - "@talend/scripts-config-react-webpack": "^16.3.1", + "@talend/scripts-config-react-webpack": "^16.3.2", "@talend/scripts-config-storybook-lib": "^5.2.0", "@talend/scripts-config-typescript": "^11.2.0", "@talend/storybook-docs": "^2.2.0", diff --git a/packages/forms/CHANGELOG.md b/packages/forms/CHANGELOG.md index 21e51653929..02c56ca5946 100644 --- a/packages/forms/CHANGELOG.md +++ b/packages/forms/CHANGELOG.md @@ -1,5 +1,17 @@ # @talend/react-forms +## 12.2.0 + +### Minor Changes + +- ea026ec12: Use DS tabs in UIForm + +### Patch Changes + +- Updated dependencies [0e6c82e25] +- Updated dependencies [ea026ec12] + - @talend/design-system@8.5.0 + ## 12.1.0 ### Minor Changes diff --git a/packages/forms/package.json b/packages/forms/package.json index ecf2632f437..e5e8ac361e9 100644 --- a/packages/forms/package.json +++ b/packages/forms/package.json @@ -39,7 +39,7 @@ "@talend/icons": "^7.3.0", "@talend/json-schema-form-core": "^1.2.0", "@talend/react-components": "^12.2.0", - "@talend/design-system": "^8.4.0", + "@talend/design-system": "^8.5.0", "@talend/design-tokens": "^2.10.0", "@talend/react-bootstrap": "^2.1.1", "@talend/utils": "^2.8.0", @@ -66,7 +66,7 @@ "@talend/eslint-plugin": "^1.1.0", "@talend/scripts-core": "^16.3.0", "@talend/scripts-config-babel": "^13.2.0", - "@talend/scripts-config-react-webpack": "^16.3.1", + "@talend/scripts-config-react-webpack": "^16.3.2", "@talend/scripts-config-storybook-lib": "^5.2.0", "@talend/scripts-config-typescript": "^11.2.0", "@testing-library/jest-dom": "^5.17.0", @@ -95,5 +95,5 @@ "publishConfig": { "access": "public" }, - "version": "12.1.0" + "version": "12.2.0" } diff --git a/tools/scripts-config-react-webpack/CHANGELOG.md b/tools/scripts-config-react-webpack/CHANGELOG.md index 5524a90bac2..71db7ec5b50 100644 --- a/tools/scripts-config-react-webpack/CHANGELOG.md +++ b/tools/scripts-config-react-webpack/CHANGELOG.md @@ -1,5 +1,11 @@ # @talend/scripts-config-react-webpack +## 16.3.2 + +### Patch Changes + +- db246251d: fix: prevent display log of lot of warnings related to sass loader + ## 16.3.1 ### Patch Changes diff --git a/tools/scripts-config-react-webpack/package.json b/tools/scripts-config-react-webpack/package.json index ba5ac230f4b..916d8e49856 100644 --- a/tools/scripts-config-react-webpack/package.json +++ b/tools/scripts-config-react-webpack/package.json @@ -1,7 +1,7 @@ { "name": "@talend/scripts-config-react-webpack", "description": "Webpack configuration for @talend/scripts-core", - "version": "16.3.1", + "version": "16.3.2", "license": "Apache-2.0", "main": "index.js", "author": "Talend Frontend ",