@automattic/jetpack-components 0.72.0 → 0.72.1

package/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ### This is a list detailing changes for the Jetpack RNA Components package releases.
 
+## [0.72.1] - 2025-04-01
+### Changed
+- Update package dependencies. [#42762]
+
 ## [0.72.0] - 2025-03-31
 ### Added
 - Add dot-page component. [#42625]
@@ -1343,6 +1347,7 @@
 ### Changed
 - Update node version requirement to 14.16.1
 
+[0.72.1]: https://github.com/Automattic/jetpack-components/compare/0.72.0...0.72.1
 [0.72.0]: https://github.com/Automattic/jetpack-components/compare/0.71.0...0.72.0
 [0.71.0]: https://github.com/Automattic/jetpack-components/compare/0.70.1...0.71.0
 [0.70.1]: https://github.com/Automattic/jetpack-components/compare/0.70.0...0.70.1

package/build/components/action-button/index.d.ts

@@ -7,19 +7,19 @@ export default ActionButton;
  * It is useful to async actions when the user has to wait the result of a request or process.
  *
  * @param {object} props - The properties.
- * @return {React.Component} The `ActionButton` component.
+ * @return {React.ReactNode} The `ActionButton` component.
  */
-declare function ActionButton(props: object): React.Component;
+declare function ActionButton(props: object): React.ReactNode;
 declare namespace ActionButton {
     namespace propTypes {
-        const label: any;
-        const onClick: any;
-        const isLoading: any;
-        const isDisabled: any;
-        const displayError: any;
-        const errorMessage: any;
-        const variant: any;
-        const isExternalLink: any;
+        let label: any;
+        let onClick: any;
+        let isLoading: any;
+        let isDisabled: any;
+        let displayError: any;
+        let errorMessage: any;
+        let variant: any;
+        let isExternalLink: any;
     }
 }
 import React from 'react';

package/build/components/action-button/index.js

@@ -20,7 +20,7 @@ import styles from './style.module.scss';
  * It is useful to async actions when the user has to wait the result of a request or process.
  *
  * @param {object} props - The properties.
- * @return {React.Component} The `ActionButton` component.
+ * @return {React.ReactNode} The `ActionButton` component.
  */
 const ActionButton = props => {
     const { label, onClick, isLoading = false, loadingText, isDisabled, displayError = false, errorMessage = __('An error occurred. Please try again.', 'jetpack-components'), variant = 'primary', isExternalLink = false, customClass, } = props;

package/build/components/action-popover/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 /**
  * Types
  */

package/build/components/admin-page/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 import type { JetpackFooterMenuItem } from '../jetpack-footer/types.js';
 export type AdminPageProps = {
     /**

package/build/components/admin-section/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 export type AdminSectionBaseProps = {
     /**
      * The section content

package/build/components/boost-score-graph/uplot-line-chart.js

@@ -33,7 +33,7 @@ function createSerieInfo(label, score) {
             gradient.addColorStop(0, getColor(score, '44'));
             gradient.addColorStop(1, getColor(score, '11'));
             return gradient;
-        },
+        }, // use the gradient as fill for the series
         width: 2,
         paths: (u, seriesIdx, idx0, idx1) => {
             return spline?.()(u, seriesIdx, idx0, idx1) || null;
@@ -115,7 +115,7 @@ export default function UplotLineChart({ range, periods, annotations = [] }) {
                     space: 100,
                     size: 30,
                     grid: {
-                        stroke: 'rgba(220, 220, 222, 0.5)',
+                        stroke: 'rgba(220, 220, 222, 0.5)', // #DCDCDE with 0.5 opacity
                         width: 1,
                     },
                     ticks: {

package/build/components/icon-tooltip/index.js

@@ -39,7 +39,7 @@ const IconTooltip = ({ className = '', iconClassName = '', placement = 'bottom-e
         noArrow: false,
         resize: false,
         flip: false,
-        offset,
+        offset, // The distance (in px) between the anchor and the popover.
         focusOnMount: 'container',
         onClose: hideTooltip,
         className: 'icon-tooltip-container',

package/build/components/icon-tooltip/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 export type Placement = 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end';
 export type Position = 'top left' | 'top center' | 'top right' | 'bottom left' | 'bottom center' | 'bottom right';
 export type IconTooltipProps = {

package/build/components/layout/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 type ColSpan = number | {
     start: number;
     end: number;

package/build/components/popover/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 import './style.scss';
 type PopoverProps = {
     action: React.ReactNode;

package/build/components/pricing-table/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 import type { Placement } from '../icon-tooltip/types.js';
 export type PricingTableProps = {
     /**

package/build/components/product-offer/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 import { ProductPriceProps } from '../product-price/types.js';
 import type { JetpackIconSlug } from '../icons/index.js';
 export type ProductOfferProps = {

package/build/components/product-price/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 export type ProductPriceProps = {
     /**
      * Product price.

package/build/components/radio-control/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 interface RadioControlProps {
     /** The current value. */
     selected: string;

package/build/components/spinner/index.d.ts

@@ -6,8 +6,8 @@ declare function Spinner({ color, className, size }: {
 }): import("react/jsx-runtime").JSX.Element;
 declare namespace Spinner {
     namespace propTypes {
-        const color: any;
-        const className: any;
-        const size: any;
+        let color: any;
+        let className: any;
+        let size: any;
     }
 }

package/build/components/spinner/index.js

@@ -7,7 +7,7 @@ const Spinner = ({ color = '#FFFFFF', className = '', size = 20 }) => {
     const styleOuter = {
         width: size,
         height: size,
-        fontSize: size,
+        fontSize: size, // allows border-width to be specified in em units
         borderTopColor: color,
     };
     const styleInner = {

package/build/components/split-button/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 /**
  * External dependencies
  */

package/build/components/stat-card/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 export type StatCardProps = {
     /**
      * Custom className to be inserted.

package/build/components/status/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 interface StatusProps {
     status?: 'active' | 'error' | 'inactive' | 'action' | 'initializing';
     label?: string;

package/build/components/terms-of-service/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 import type { TermsOfServiceProps } from './types.js';
 import './styles.scss';
 declare const TermsOfService: React.FC<TermsOfServiceProps>;

package/build/components/theme-provider/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 export type ThemeProviderProps = {
     /**
      * An optional id to register and identify the provider instance.

package/build/components/toggle-control/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" resolution-mode="require"/>
 interface ToggleControlProps {
     /** Whether or not the toggle is currently enabled. */
     checked?: boolean;

package/components/action-button/index.jsx

@@ -20,7 +20,7 @@ import styles from './style.module.scss';
  * It is useful to async actions when the user has to wait the result of a request or process.
  *
  * @param {object} props - The properties.
- * @return {React.Component} The `ActionButton` component.
+ * @return {React.ReactNode} The `ActionButton` component.
  */
 const ActionButton = props => {
 	const {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@automattic/jetpack-components",
-	"version": "0.72.0",
+	"version": "0.72.1",
 	"description": "Jetpack Components Package",
 	"author": "Automattic",
 	"license": "GPL-2.0-or-later",
@@ -15,7 +15,7 @@
 	},
 	"dependencies": {
 		"@automattic/format-currency": "1.0.1",
-		"@automattic/jetpack-boost-score-api": "^0.1.60",
+		"@automattic/jetpack-boost-score-api": "^0.1.61",
 		"@automattic/jetpack-api": "^0.20.0",
 		"@automattic/jetpack-script-data": "^0.3.0",
 		"@babel/runtime": "^7",
@@ -32,7 +32,7 @@
 		"prop-types": "^15.7.2",
 		"qrcode.react": "4.2.0",
 		"react-slider": "2.0.5",
-		"social-logos": "^3.1.18",
+		"social-logos": "^3.1.19",
 		"uplot": "1.6.31",
 		"uplot-react": "1.1.4"
 	},
@@ -58,7 +58,7 @@
 		"require-from-string": "2.0.2",
 		"storybook": "8.6.7",
 		"ts-dedent": "2.2.0",
-		"typescript": "5.0.4",
+		"typescript": "5.8.2",
 		"webpack": "5.94.0",
 		"webpack-cli": "6.0.1"
 	},