@automattic/jetpack-components 1.12.0 → 1.12.1

package/CHANGELOG.md

@@ -2,6 +2,13 @@
 
 ### This is a list detailing changes for the Jetpack RNA Components package releases.
 
+## [1.12.1] - 2026-06-01
+### Changed
+- Update package dependencies. [#48404]
+
+### Fixed
+- PricingCard: Render the CTA with the @wordpress/ui Button (solid variant) so it shows correct button styling instead of unstyled text. [#49197]
+
 ## [1.12.0] - 2026-05-25
 ### Added
 - Add subpath exports for `Button`, `PricingTable`, and `ProductPrice` so they can be imported directly from bundles that cannot import the package barrel. [#49063]
@@ -1806,6 +1813,7 @@
 ### Changed
 - Update node version requirement to 14.16.1
 
+[1.12.1]: https://github.com/Automattic/jetpack-components/compare/1.12.0...1.12.1
 [1.12.0]: https://github.com/Automattic/jetpack-components/compare/1.11.3...1.12.0
 [1.11.3]: https://github.com/Automattic/jetpack-components/compare/1.11.2...1.11.3
 [1.11.2]: https://github.com/Automattic/jetpack-components/compare/1.11.1...1.11.2

package/SECURITY.md

@@ -13,7 +13,6 @@ Our HackerOne program covers the below plugin software, as well as a variety of
 * [Jetpack](https://jetpack.com/)
 * Jetpack Backup
 * Jetpack Boost
-* Jetpack CRM
 * Jetpack Protect
 * Jetpack Search
 * Jetpack Social

package/build/components/pricing-card/index.js

@@ -1,7 +1,7 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getCurrencyObject } from '@automattic/number-formatters';
-import { Button } from '@wordpress/components';
 import { sprintf, __ } from '@wordpress/i18n';
+import { Button } from '@wordpress/ui';
 import LoadingPlaceholder from '../loading-placeholder/index.js';
 import TermsOfService from '../terms-of-service/index.js';
 import './style.scss';
@@ -32,7 +32,7 @@ const PricingCard = ({ currencyCode = 'USD', priceDetails = __('/month, paid yea
                         ] })), props.priceAfter > 0 && (_jsxs(_Fragment, { children: [
                             _jsxs("div", { className: "jp-components__pricing-card__price-after", children: [
                                     _jsx("span", { className: "jp-components__pricing-card__currency", children: currencyObjectAfter.symbol }), _jsx("span", { className: "jp-components__pricing-card__price", children: currencyObjectAfter.integer }), showPriceDecimals(currencyObjectAfter) && (_jsx("span", { className: "jp-components__pricing-card__price-decimal", children: currencyObjectAfter.fraction }))] }), _jsx("span", { className: "jp-components__pricing-card__price-details", children: priceDetails })
-                        ] }))] }), props.children && (_jsx("div", { className: "jp-components__pricing-card__extra-content-wrapper", children: props.children })), props.tosText && _jsx("div", { className: "jp-components__pricing-card__tos", children: props.tosText }), props.ctaText && (_jsxs(_Fragment, { children: [!props.tosText && (_jsx("div", { className: "jp-components__pricing-card__tos", children: _jsx(TermsOfService, { agreeButtonLabel: props.ctaText }) })), _jsx("div", { className: "jp-components__pricing-card__cta", children: _jsx(Button, { className: "jp-components__pricing-card__button", label: props.ctaText, onClick: props.onCtaClick, children: props.ctaText }) })
+                        ] }))] }), props.children && (_jsx("div", { className: "jp-components__pricing-card__extra-content-wrapper", children: props.children })), props.tosText && _jsx("div", { className: "jp-components__pricing-card__tos", children: props.tosText }), props.ctaText && (_jsxs(_Fragment, { children: [!props.tosText && (_jsx("div", { className: "jp-components__pricing-card__tos", children: _jsx(TermsOfService, { agreeButtonLabel: props.ctaText }) })), _jsx("div", { className: "jp-components__pricing-card__cta", children: _jsx(Button, { variant: "solid", className: "jp-components__pricing-card__button", onClick: props.onCtaClick, children: props.ctaText }) })
                 ] })), props.infoText && (_jsx("div", { className: "jp-components__pricing-card__info", children: props.infoText }))] }));
 };
 export default PricingCard;

package/build/components/pricing-card/style.scss

@@ -87,13 +87,11 @@
 	}
 
 	&__button {
+		// Full-width CTA; the @wordpress/ui Button owns the rest of its chrome
+		// (fill, padding, radius) via its `solid` variant.
 		width: 100%;
-		height: auto;
-		font-size: 18px;
-		padding: 14px 24px;
 		margin: 24px 0 32px;
-		justify-content: center;
-		align-items: center;
+
 	}
 
 	&__info,

package/components/pricing-card/index.tsx

@@ -1,6 +1,6 @@
 import { getCurrencyObject } from '@automattic/number-formatters';
-import { Button } from '@wordpress/components';
 import { sprintf, __ } from '@wordpress/i18n';
+import { Button } from '@wordpress/ui';
 import LoadingPlaceholder from '../loading-placeholder/index.tsx';
 import TermsOfService from '../terms-of-service/index.tsx';
 import type { PricingCardProps } from './types.ts';
@@ -113,8 +113,8 @@ const PricingCard: FC< PricingCardProps > = ( {
 					) }
 					<div className="jp-components__pricing-card__cta">
 						<Button
+							variant="solid"
 							className="jp-components__pricing-card__button"
-							label={ props.ctaText }
 							onClick={ props.onCtaClick }
 						>
 							{ props.ctaText }

package/components/pricing-card/style.scss

@@ -87,13 +87,11 @@
 	}
 
 	&__button {
+		// Full-width CTA; the @wordpress/ui Button owns the rest of its chrome
+		// (fill, padding, radius) via its `solid` variant.
 		width: 100%;
-		height: auto;
-		font-size: 18px;
-		padding: 14px 24px;
 		margin: 24px 0 32px;
-		justify-content: center;
-		align-items: center;
+
 	}
 
 	&__info,

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@automattic/jetpack-components",
-	"version": "1.12.0",
+	"version": "1.12.1",
 	"description": "Jetpack Components Package",
 	"homepage": "https://github.com/Automattic/jetpack/tree/HEAD/projects/js-packages/components/#readme",
 	"bugs": {
@@ -87,10 +87,10 @@
 		"@wordpress/date": "5.46.0",
 		"@wordpress/element": "6.46.0",
 		"@wordpress/i18n": "6.19.0",
-		"@wordpress/icons": "12.2.0",
+		"@wordpress/icons": "13.1.0",
 		"@wordpress/notices": "5.46.0",
 		"@wordpress/theme": "0.13.0",
-		"@wordpress/ui": "0.11.0",
+		"@wordpress/ui": "0.13.0",
 		"clsx": "2.1.1",
 		"js-sha256": "0.11.1",
 		"prop-types": "^15.7.2",
@@ -101,7 +101,7 @@
 		"uplot-react": "1.1.4"
 	},
 	"devDependencies": {
-		"@automattic/jetpack-base-styles": "^1.2.4",
+		"@automattic/jetpack-base-styles": "^1.2.5",
 		"@babel/core": "7.29.0",
 		"@babel/preset-react": "7.28.5",
 		"@jest/globals": "30.4.1",