feat(ARCH-737): add ESM support (recovery PR)

smouillour commented 3 months ago

What is the problem this PR is trying to solve?

our lib are in the CommonJS format. We want to move forward by using vite as bundler which is the common mainstream tool today to work on react. To achieve that we need to modernize our libraries and start to push ESM format.

Original PR: https://github.com/Talend/ui/pull/5263

What is the chosen solution to this problem?

[x] add script to start the playground with vite
[x] add output esm configuration to all ui libraries (packages and fork)

Please check if the PR fulfills these requirements

[ ] The PR have used yarn changeset to a request a release from the CI if wanted.
[ ] The PR commit message follows our guidelines
[ ] Tests for the changes have been added (for bug fixes / features) And non reg done before need review
[ ] Docs have been added / updated (for bug fixes / features)
[ ] Related design / discussions / pages (not in jira), if any, are all linked or available in the PR

[ ] This PR introduces a breaking change

github-actions[bot] commented 3 months ago

5329

:octocat: Demo is available here

github-actions[bot] commented 3 months ago

Title	Statements	Branches	Functions
assets-api	28.4% (25/88)	30.76% (16/52)	21.42% (3/14)
cmf	89.18% (1237/1387)	80.88% (605/748)	89.28% (350/392)
cmf-cqrs	87.43% (160/183)	70.23% (59/84)	84.21% (48/57)
cmf-router	69.23% (135/195)	55.71% (78/140)	56.81% (25/44)
components	90.82% (5522/6080)	81.86% (3196/3904)	88.2% (1391/1577)
containers	83.71% (1388/1658)	74.81% (692/925)	75.17% (327/435)
dataviz	85.44% (323/378)	66.66% (160/240)	75.79% (119/157)
design-system	66.75% (996/1492)	50.85% (536/1054)	54.54% (216/396)
faceted-search	85.69% (677/790)	79.31% (303/382)	82.63% (238/288)
flow-designer	70.07% (651/929)	66.72% (355/532)	70.92% (200/282)
forms	85.79% (1637/1908)	75.69% (925/1222)	84.24% (460/546)
http	100% (85/85)	98.07% (51/52)	100% (34/34)
sagas	92.3% (24/26)	66.66% (4/6)	50% (2/4)
stepper	81.52% (150/184)	59.34% (54/91)	80.85% (38/47)
utils	100% (73/73)	90.9% (10/11)	100% (24/24)

github-actions[bot] commented 3 months ago

Size Change: -640 kB (-4%)

Total Size: 16.8 MB

Filename	Size	Change
`./packages/cmf-cqrs/dist/TalendReactCmfCqrs.js`	205 kB	-71.7 kB (-26%)	🎉
`./packages/cmf-cqrs/dist/TalendReactCmfCqrs.min.js`	11.3 kB	-43.3 kB (-79%)	🏆
`./packages/cmf/dist/TalendReactCmf.js`	504 kB	-71.2 kB (-12%)	👏
`./packages/cmf/dist/TalendReactCmf.min.js`	65.2 kB	-43.1 kB (-40%)	🎉
`./packages/components/dist/TalendReactComponents.js`	4.63 MB	-218 kB (-4%)
`./packages/components/dist/TalendReactComponents.min.js`	1.24 MB	-49.7 kB (-4%)
`./packages/containers/dist/TalendReactContainers.js`	634 kB	-71.1 kB (-10%)	👏
`./packages/containers/dist/TalendReactContainers.min.js`	92.5 kB	-43.2 kB (-32%)	🎉
`./packages/design-system/dist/TalendDesignSystem.js`	1.37 MB	-71.2 kB (-5%)	✅
`./packages/design-system/dist/TalendDesignSystem.min.js`	245 kB	-43.1 kB (-15%)	👏
`./packages/faceted-search/dist/TalendReactFacetedSearch.js`	541 kB	-210 kB (-28%)	🎉
`./packages/faceted-search/dist/TalendReactFacetedSearch.min.js`	100 kB	-48.2 kB (-33%)	🎉
`./packages/forms/dist/TalendReactForms.js`	1.45 MB	+398 kB (+38%)	🚨
`./packages/forms/dist/TalendReactForms.min.js`	265 kB	-54.7 kB (-17%)	👏

ℹ️ View Unchanged

| Filename | Size | Change | | | :--- | :---: | :---: | :---: | | `./packages/assets-api/dist/TalendAssetsApi.js` | 7.15 kB | 0 B | | | `./packages/assets-api/dist/TalendAssetsApi.js.dependencies.json` | 2 B | 0 B | | | `./packages/assets-api/dist/TalendAssetsApi.min.js` | 3.33 kB | 0 B | | | `./packages/assets-api/dist/TalendAssetsApi.min.js.dependencies.json` | 2 B | 0 B | | | `./packages/cmf-cqrs/dist/TalendReactCmfCqrs.js.dependencies.json` | 672 B | +77 B (+13%) | ⚠️ | | `./packages/cmf-cqrs/dist/TalendReactCmfCqrs.min.js.dependencies.json` | 695 B | +81 B (+13%) | ⚠️ | | `./packages/cmf-router/dist/TalendReactCmfRouter.js` | 163 kB | 0 B | | | `./packages/cmf-router/dist/TalendReactCmfRouter.js.dependencies.json` | 1.25 kB | 0 B | | | `./packages/cmf-router/dist/TalendReactCmfRouter.min.js` | 12.8 kB | 0 B | | | `./packages/cmf-router/dist/TalendReactCmfRouter.min.js.dependencies.json` | 1.29 kB | 0 B | | | `./packages/cmf/dist/TalendReactCmf.js.dependencies.json` | 1.31 kB | 0 B | | | `./packages/cmf/dist/TalendReactCmf.min.js.dependencies.json` | 1.35 kB | 0 B | | | `./packages/components/dist/TalendReactComponents.css` | 397 kB | 0 B | | | `./packages/components/dist/TalendReactComponents.js.dependencies.json` | 3.21 kB | 0 B | | | `./packages/components/dist/TalendReactComponents.min.css` | 212 kB | 0 B | | | `./packages/components/dist/TalendReactComponents.min.js.dependencies.json` | 3.29 kB | 0 B | | | `./packages/containers/dist/TalendReactContainers.css` | 2.99 kB | 0 B | | | `./packages/containers/dist/TalendReactContainers.js.dependencies.json` | 1.4 kB | 0 B | | | `./packages/containers/dist/TalendReactContainers.min.css` | 1.78 kB | 0 B | | | `./packages/containers/dist/TalendReactContainers.min.js.dependencies.json` | 1.45 kB | 0 B | | | `./packages/dataviz/dist/TalendReactDataviz.css` | 28.1 kB | 0 B | | | `./packages/dataviz/dist/TalendReactDataviz.js` | 370 kB | 0 B | | | `./packages/dataviz/dist/TalendReactDataviz.js.dependencies.json` | 1.15 kB | 0 B | | | `./packages/dataviz/dist/TalendReactDataviz.min.css` | 12.2 kB | 0 B | | | `./packages/dataviz/dist/TalendReactDataviz.min.js` | 59.5 kB | 0 B | | | `./packages/dataviz/dist/TalendReactDataviz.min.js.dependencies.json` | 1.19 kB | 0 B | | | `./packages/design-system/dist/TalendDesignSystem.css` | 332 kB | 0 B | | | `./packages/design-system/dist/TalendDesignSystem.js.dependencies.json` | 1.57 kB | +77 B (+5%) | 🔍 | | `./packages/design-system/dist/TalendDesignSystem.min.css` | 215 kB | 0 B | | | `./packages/design-system/dist/TalendDesignSystem.min.js.dependencies.json` | 1.61 kB | +81 B (+5%) | 🔍 | | `./packages/design-tokens/dist/TalendDesignTokens.css` | 79.1 kB | 0 B | | | `./packages/design-tokens/dist/TalendDesignTokens.js` | 39.7 kB | 0 B | | | `./packages/design-tokens/dist/TalendDesignTokens.js.dependencies.json` | 2 B | 0 B | | | `./packages/design-tokens/dist/TalendDesignTokens.min.css` | 75 kB | 0 B | | | `./packages/design-tokens/dist/TalendDesignTokens.min.js` | 33.4 kB | 0 B | | | `./packages/design-tokens/dist/TalendDesignTokens.min.js.dependencies.json` | 2 B | 0 B | | | `./packages/faceted-search/dist/TalendReactFacetedSearch.css` | 19.1 kB | 0 B | | | `./packages/faceted-search/dist/TalendReactFacetedSearch.js.dependencies.json` | 1.54 kB | 0 B | | | `./packages/faceted-search/dist/TalendReactFacetedSearch.min.css` | 6.28 kB | 0 B | | | `./packages/faceted-search/dist/TalendReactFacetedSearch.min.js.dependencies.json` | 1.59 kB | 0 B | | | `./packages/flow-designer/dist/TalendReactFlowDesigner.min.js` | 50.7 kB | -25 B (0%) | | | `./packages/flow-designer/dist/TalendReactFlowDesigner.min.js.dependencies.json` | 1.25 kB | 0 B | | | `./packages/forms/dist/TalendReactForms.css` | 20.9 kB | 0 B | | | `./packages/forms/dist/TalendReactForms.js.dependencies.json` | 1.36 kB | 0 B | | | `./packages/forms/dist/TalendReactForms.min.css` | 6.2 kB | 0 B | | | `./packages/forms/dist/TalendReactForms.min.js.dependencies.json` | 1.39 kB | 0 B | | | `./packages/http/dist/TalendHttp.js` | 24.8 kB | 0 B | | | `./packages/http/dist/TalendHttp.js.dependencies.json` | 2 B | 0 B | | | `./packages/http/dist/TalendHttp.min.js` | 5.31 kB | 0 B | | | `./packages/http/dist/TalendHttp.min.js.dependencies.json` | 2 B | 0 B | | | `./packages/icons/dist/bundle.js` | 1.26 kB | 0 B | | | `./packages/icons/dist/info.js` | 26.8 kB | 0 B | | | `./packages/icons/dist/react.esm.js` | 614 kB | 0 B | | | `./packages/icons/dist/react.js` | 654 kB | 0 B | | | `./packages/icons/dist/talend-icons-webfont.css` | 18.3 kB | 0 B | | | `./packages/icons/dist/talendicons.css` | 334 B | 0 B | | | `./packages/icons/dist/TalendIcons.js` | 786 kB | 0 B | | | `./packages/icons/dist/TalendIcons.js.dependencies.json` | 128 B | 0 B | | | `./packages/icons/dist/TalendIcons.min.js` | 636 kB | 0 B | | | `./packages/icons/dist/TalendIcons.min.js.dependencies.json` | 131 B | 0 B | | | `./packages/icons/dist/typeUtils.js` | 14.5 kB | 0 B | | | `./packages/router-bridge/dist/TalendRouterBridge.js` | 134 kB | 0 B | | | `./packages/router-bridge/dist/TalendRouterBridge.js.dependencies.json` | 1.05 kB | 0 B | | | `./packages/router-bridge/dist/TalendRouterBridge.min.js` | 21 kB | 0 B | | | `./packages/router-bridge/dist/TalendRouterBridge.min.js.dependencies.json` | 1.07 kB | 0 B | | | `./packages/sagas/dist/TalendReactSagas.js` | 10.9 kB | 0 B | | | `./packages/sagas/dist/TalendReactSagas.js.dependencies.json` | 348 B | 0 B | | | `./packages/sagas/dist/TalendReactSagas.min.js` | 1.41 kB | 0 B | | | `./packages/sagas/dist/TalendReactSagas.min.js.dependencies.json` | 360 B | 0 B | | | `./packages/stepper/dist/TalendReactStepper.css` | 2.41 kB | 0 B | | | `./packages/stepper/dist/TalendReactStepper.js` | 97 kB | 0 B | | | `./packages/stepper/dist/TalendReactStepper.js.dependencies.json` | 1.27 kB | 0 B | | | `./packages/stepper/dist/TalendReactStepper.min.css` | 1.2 kB | 0 B | | | `./packages/stepper/dist/TalendReactStepper.min.js` | 9.37 kB | 0 B | | | `./packages/stepper/dist/TalendReactStepper.min.js.dependencies.json` | 1.31 kB | 0 B | | | `./packages/storybook-docs/dist/globalStyles.js` | 0 B | 0 B | 🆕 | | `./packages/storybook-docs/dist/globalStyles.min.css` | 384 B | 0 B | | | `./packages/storybook-docs/dist/managerStyles.js` | 0 B | 0 B | 🆕 | | `./packages/storybook-docs/dist/managerStyles.min.css` | 1.5 kB | 0 B | | | `./packages/theme/dist/bootstrap.css` | 171 kB | 0 B | | | `./packages/theme/dist/bootstrap.js` | 2.51 kB | 0 B | | | `./packages/theme/dist/bootstrap.js.dependencies.json` | 3 B | 0 B | |

_{compressed-size-action}

Talend / ui

feat(ARCH-737): add ESM support (recovery PR) #5329