feat: prepare for v2 release

[cheton]

Development plan: https://github.com/trendmicro-frontend/tonic-ui/wiki/Tonic-UI-Development-Plan#migrating-from-v1-to-v2

Related links: https://github.com/trendmicro-frontend/tonic-ui/pull/831, https://github.com/trendmicro-frontend/tonic-ui/issues/832, https://github.com/trendmicro-frontend/tonic-ui/pull/833

[codesandbox[bot]]

Review or Edit in CodeSandbox

Open the branch in Web Editor • VS Code • Insiders
Open Preview

[codesandbox-ci[bot]]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

[trendmicro-frontend-bot]

Tonic UI Demo

• 2024-05-21 10:33:34 +0000 The PR #834 (784aeb163ddb787f6df4de605e63ad5453619dc1) has been deployed to https://trendmicro-frontend.github.io/tonic-ui-demo/react/pr-834/

[codecov[bot]]

Codecov Report

Attention: Patch coverage is 74.28571% with 9 lines in your changes are missing coverage. Please review.

Project coverage is 71.64%. Comparing base (721fb8d) to head (784aeb1).

Files	Patch %	Lines
...ges/codemod/src/react/v2.0.0/import-react-icons.js	78.78%	7 Missing :warning:
...rc/react/v2.0.0/__tests__/__fixtures__/expected.js	0.00%	1 Missing :warning:
.../src/react/v2.0.0/__tests__/__fixtures__/source.js	0.00%	1 Missing :warning:

Additional details and impacted files

@@            Coverage Diff             @@
##           master     #834      +/-   ##
==========================================
+ Coverage   71.36%   71.64%   +0.28%     
==========================================
  Files         374      371       -3     
  Lines        6271     6098     -173     
==========================================
- Hits         4475     4369     -106     
+ Misses       1796     1729      -67     

Flag	Coverage Δ
codemod	74.28% <74.28%> (?)
react	73.47% <ø> (+0.40%)	:arrow_up:
react-hooks	87.59% <ø> (ø)
react-lab	14.04% <ø> (ø)
styled-system	91.73% <ø> (ø)
theme	100.00% <ø> (ø)
utils	70.28% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

[ZachLegros]

Are we still planning to remove tmicons from theme? https://github.com/trendmicro-frontend/tonic-ui/blob/6775f1a6bb9dbc9484df13e0e8cb8a7488a1ac73/packages/react/src/theme/theme.js#L10

[cheton]

Are we still planning to remove tmicons from theme?

https://github.com/trendmicro-frontend/tonic-ui/blob/6775f1a6bb9dbc9484df13e0e8cb8a7488a1ac73/packages/react/src/theme/theme.js#L10

Yes, it's going to be removed from the @tonic-ui/react package for v2. I will continue to update this PR.

[ZachLegros]

I tested the changes for react icons alongside the codemod with the new build configs on a large project and noticed a significant bundle size reduction! Around 234KB of unused code was trimmed and it reduced the gzip size by about 64KB.

Before:

After:

[ZachLegros]

• Checkbox Changed onChange(value, event) to onChange(value)

I tested the Checkbox component and it seems like the new behaviour is onChange(event) instead of onChange(value). Is this expected?

[joyfulelement]

I tested the changes for react icons alongside the codemod with the new build configs on a large project and noticed a significant bundle size reduction! Around 234KB of unused code was trimmed and it reduced the gzip size by about 64KB.

Before:

After:

Yes, this was one of the primary motivations behind the V2 release, so the package can now be effectively tree shaken by bundler tools.

[ZachLegros]

Yes, this was one of the primary motivations behind the V2 release, so the package can now be effectively tree shaken by bundler tools.

@joyfulelement Indeed, here is the discussion about this issue which contains a good article: https://github.com/trendmicro-frontend/tonic-ui/issues/832. Also, this PR has a good visual representation of the original problem.

[cheton]

• Checkbox Changed onChange(value, event) to onChange(value)

I tested the Checkbox component and it seems like the new behaviour is onChange(event) instead of onChange(value). Is this expected?

@ZachLegros Thank you for pointing out the mistake. The change is actually made to the CheckboxGroup component, not the Checkbox component. I've corrected it in the change list.

[cheton]

I'm currently occupied with other projects and will be on vacation next week. I might be able to continue the work around mid-May, The next change includes updating the default color style settings and default values of the tooltip component to fulfill the new visual specification (Figma links: Color Style, Tooltip). Once those tasks are completed, it will be ready for making an alpha release (e.g. 2.0.0-alpha).

[cheton]

Hi @ZachLegros

The first prerelease 2.0.0-alpha.0 is now available on NPM. Could you please check if it works properly on your end? Thank you! https://www.npmjs.com/package/@tonic-ui/react/v/2.0.0-alpha.0?activeTab=versions

[ZachLegros]

Hi @cheton,

Everything looks good on my end for now. Thank you for your work! I will be releasing types for tonic react v2 and react-icons shortly.

[cheton]

Hi @cheton,

Everything looks good on my end for now. Thank you for your work! I will be releasing types for tonic react v2 and react-icons shortly.

The pre-releases (2.0.0-alpha.x) will be available for testing to ensure everything functions smoothly. If all goes well, I'll proceed with a public release (2.0.0) next week.