v3.0.0
In v3 both packages - web and mobile are rewritten in TypeScript and bunch of improvements are added:
Improvements
- The Web and Mobile packages are now written in TypeScript
- PNPM is now used as package manager as well as to handle the monorepo
- Webpack is replaced by Esbuild to bundle the code and run dev server
- PropTypes are no longer required as peerDependencies. The component relays on the TypeScript types
- New prop
updateIntervalis added to control how often the timer should be updated - New prop
colorsTimeis added to handle the times when a color should switch to the next color. This was part of thecolorsprop before - New prop
isSmoothColorTransitionindicates if the colors should smoothly transition to the next color or just change the color when the time comes - New event handler
onUpdatewill fire every time the time changes - Reduce overall bundle size and provide ES module export for the Web package
Breaking changes
- IE is no longer supported
colorsprop now is either: Single color in any valid color format or URL to a gradient; Array of colors in HEX format. At least 2 colors should be provided.- Gradient is no longer supported out of the box and
isLinearGradientandgradientUniqueKeyare now deprecated. The gradient can be set from outside of the component. Please refer to the recipes section. ariaLabelandrenderAriaTimeare also deprecated. Refer to the recipes section to check how this can be implemented.childrenprop now accepts only a render function and it does not take a React component as a children
React Native (mobile) changes
- The Mobile package does not rely on
AnimatedPathto animate the SVG path but instead it uses the animation event loop fromuse-elapsed-time. Thus now both packages - web and mobile share the same core logic to animate the path. Performance comparison shows that the later approach is much more performant.