@automattic/jetpack-components 0.55.0 → 0.55.2

package/CHANGELOG.md

@@ -2,6 +2,17 @@
 
 ### This is a list detailing changes for the Jetpack RNA Components package releases.
 
+## [0.55.2] - 2024-07-26
+### Added
+- Export button props type to be used elsewhere [#38549]
+
+## [0.55.1] - 2024-07-25
+### Added
+- Added `className` prop to `Alert` component [#38450]
+
+### Changed
+- React compatibility: Ensuring createRoot is not called more than once. [#38495]
+
 ## [0.55.0] - 2024-07-22
 ### Removed
 - Remove compatibility with WordPress 6.4. [#38386]
@@ -1091,6 +1102,8 @@
 ### Changed
 - Update node version requirement to 14.16.1
 
+[0.55.2]: https://github.com/Automattic/jetpack-components/compare/0.55.1...0.55.2
+[0.55.1]: https://github.com/Automattic/jetpack-components/compare/0.55.0...0.55.1
 [0.55.0]: https://github.com/Automattic/jetpack-components/compare/0.54.4...0.55.0
 [0.54.4]: https://github.com/Automattic/jetpack-components/compare/0.54.3...0.54.4
 [0.54.3]: https://github.com/Automattic/jetpack-components/compare/0.54.2...0.54.3

package/components/alert/index.tsx

@@ -12,6 +12,9 @@ type AlertProps = {
 
 	/** Children to be rendered inside the alert. */
 	children: React.ReactNode;
+
+	/** Wrapper class name */
+	className?: string;
 };
 
 const getIconByLevel = ( level: AlertProps[ 'level' ] ) => {
@@ -35,11 +38,17 @@ const getIconByLevel = ( level: AlertProps[ 'level' ] ) => {
  * @param {object} props                   - The component properties.
  * @param {string} props.level             - The alert level: error, warning, info, success.
  * @param {boolean} props.showIcon         - Whether to show the alert icon.
+ * @param {string} props.className         - The wrapper class name.
  * @param {React.Component} props.children - The alert content.
  * @returns {React.ReactElement}             The `Alert` component.
  */
-const Alert: React.FC< AlertProps > = ( { level = 'warning', children, showIcon = true } ) => {
-	const classes = clsx( styles.container, styles[ `is-${ level }` ] );
+const Alert: React.FC< AlertProps > = ( {
+	level = 'warning',
+	children,
+	showIcon = true,
+	className,
+} ) => {
+	const classes = clsx( styles.container, styles[ `is-${ level }` ], className );
 
 	return (
 		<div className={ classes }>

package/components/boost-score-graph/tooltips-plugin.ts

@@ -22,8 +22,9 @@ export function tooltipsPlugin( periods ) {
 	 */
 	function init( u: uPlot, _opts: object ) {
 		container.classList.add( 'jb-score-tooltips-container' );
-
-		reactDom = ReactDOM.createRoot( reactRoot );
+		if ( ! reactDom ) {
+			reactDom = ReactDOM.createRoot( reactRoot );
+		}
 		reactRoot.style.position = 'absolute';
 		reactRoot.style.bottom = -20 + 'px';
 		reactRoot.style.translate = '-50% calc( 100% - 20px )';

package/index.ts

@@ -48,6 +48,7 @@ export { default as ToggleControl } from './components/toggle-control';
 export { default as numberFormat } from './components/number-format';
 export { default as QRCode } from './components/qr-code';
 export { default as Button } from './components/button';
+export type { ButtonProps } from './components/button/types';
 export { default as LoadingPlaceholder } from './components/loading-placeholder';
 export { default as TermsOfService } from './components/terms-of-service';
 export { default as Chip } from './components/chip';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@automattic/jetpack-components",
-	"version": "0.55.0",
+	"version": "0.55.2",
 	"description": "Jetpack Components Package",
 	"author": "Automattic",
 	"license": "GPL-2.0-or-later",