@automattic/jetpack-components 0.72.3 → 0.72.4

package/components/product-price/price.tsx

@@ -1,8 +1,8 @@
 import { getCurrencyObject } from '@automattic/format-currency';
 import clsx from 'clsx';
-import Text from '../text/index.js';
+import Text from '../text/index.tsx';
 import styles from './style.module.scss';
-import type { PriceProps } from './types.js';
+import type { PriceProps } from './types.ts';
 import type React from 'react';
 
 /**

package/components/product-price/style.module.scss

@@ -29,7 +29,7 @@
 	&.is-not-off-price {
 		color: var( --jp-gray-20);
 
-		&:after {
+		&::after {
 			content: " ";
 			display: block;
 			width: 100%;

package/components/progress-bar/index.tsx

@@ -6,7 +6,7 @@ import clsx from 'clsx';
  * Internal dependencies
  */
 import styles from './style.module.scss';
-import { ProgressBarProps } from './types.js';
+import { ProgressBarProps } from './types.ts';
 import type React from 'react';
 
 /**

package/components/record-meter-bar/index.tsx

@@ -1,7 +1,7 @@
 import { __ } from '@wordpress/i18n';
 import clsx from 'clsx';
 import React, { useMemo } from 'react';
-import numberFormat from '../number-format/index.js';
+import numberFormat from '../number-format/index.ts';
 
 import './style.scss';
 

package/components/spinner/style.scss

@@ -20,13 +20,13 @@
 }
 
 .jp-components-spinner__outer {
-	border-top-color: white;
+	border-top-color: #fff;
 }
 
 .jp-components-spinner__inner {
 	width: 100%;
 	height: 100%;
-	border-top-color: white;
-	border-right-color: white;
+	border-top-color: #fff;
+	border-right-color: #fff;
 	opacity: 0.4;
 }

package/components/split-button/index.tsx

@@ -1,6 +1,6 @@
 import { Button, Flex, DropdownMenu } from '@wordpress/components';
 import styles from './style.module.scss';
-import { SplitButtonProps } from './types.js';
+import { SplitButtonProps } from './types.ts';
 import type React from 'react';
 
 const DownIcon = () => (

package/components/stat-card/index.tsx

@@ -6,10 +6,10 @@ import clsx from 'clsx';
 /**
  * Internal dependencies
  */
-import numberFormat from '../number-format/index.js';
-import Text from '../text/index.js';
+import numberFormat from '../number-format/index.ts';
+import Text from '../text/index.tsx';
 import styles from './style.module.scss';
-import { StatCardProps } from './types.js';
+import { StatCardProps } from './types.ts';
 import type React from 'react';
 
 /**

package/components/status/index.tsx

@@ -1,6 +1,6 @@
 import { __ } from '@wordpress/i18n';
 import clsx from 'clsx';
-import Text from '../text/index.js';
+import Text from '../text/index.tsx';
 import styles from './style.module.scss';
 
 interface StatusProps {

package/components/terms-of-service/index.tsx

@@ -1,9 +1,9 @@
 import { createInterpolateElement } from '@wordpress/element';
 import { __, sprintf } from '@wordpress/i18n';
 import clsx from 'clsx';
-import { getRedirectUrl } from '../../../components/index.js';
-import Text from '../text/index.js';
-import type { TermsOfServiceProps } from './types.js';
+import { getRedirectUrl } from '../../index.ts';
+import Text from '../text/index.tsx';
+import type { TermsOfServiceProps } from './types.ts';
 import './styles.scss';
 
 const TermsOfService: React.FC< TermsOfServiceProps > = ( {

package/components/terms-of-service/types.ts

@@ -1,4 +1,4 @@
-import { TextProps } from '../text/types.js';
+import { TextProps } from '../text/types.ts';
 
 type MultipleButtonsProps = {
 	/**

package/components/testimonials/index.tsx

@@ -1,7 +1,7 @@
 import { useState, useCallback } from '@wordpress/element';
-import Gridicon from '../gridicon/index.js';
-import { Testimonial } from './testimonial.js';
-import { TestimonialsType } from './types.js';
+import Gridicon from '../gridicon/index.tsx';
+import { Testimonial } from './testimonial.tsx';
+import { TestimonialsType } from './types.ts';
 
 const Testimonials: TestimonialsType = ( { testimonials } ) => {
 	const [ currentTestimonialIndex, setcurrentTestimonialIndex ] = useState( 0 );

package/components/testimonials/testimonial.tsx

@@ -1,5 +1,5 @@
 import clsx from 'clsx';
-import type { TestimonialType } from './types.js';
+import type { TestimonialType } from './types.ts';
 
 import './style.scss';
 

package/components/text/index.tsx

@@ -1,8 +1,8 @@
 import clsx from 'clsx';
 import React, { forwardRef, useMemo } from 'react';
-import { BOX_MODEL_VALUES, VARIANTS_MAPPING } from './constants.js';
+import { BOX_MODEL_VALUES, VARIANTS_MAPPING } from './constants.ts';
 import styles from './style.module.scss';
-import type { H3Props, TextProps, TitleProps } from './types.js';
+import type { H3Props, TextProps, TitleProps } from './types.ts';
 
 /**
  * Text component.
@@ -87,4 +87,4 @@ export const Title: React.FC< TitleProps > = ( {
 	</Text>
 );
 
-export * from './constants.js';
+export * from './constants.ts';

package/components/text/types.ts

@@ -1,4 +1,4 @@
-import { VARIANTS_MAPPING } from './constants.js';
+import { VARIANTS_MAPPING } from './constants.ts';
 import type React from 'react';
 
 export type SpacingValue = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;

package/components/theme-provider/index.tsx

@@ -1,6 +1,6 @@
 import React, { useLayoutEffect, useRef } from 'react';
 import styles from './globals.module.scss';
-import { ThemeInstance, ThemeProviderProps } from './types.js';
+import { ThemeInstance, ThemeProviderProps } from './types.ts';
 
 export const typography = {
 	// Headline

package/components/upsell-banner/index.tsx

@@ -2,7 +2,7 @@ import { Card, CardBody } from '@wordpress/components';
 import { createInterpolateElement } from '@wordpress/element';
 import React from 'react';
 import { Button } from '@automattic/jetpack-components';
-import { UpsellBannerProps } from './types.js';
+import { UpsellBannerProps } from './types.ts';
 
 import './style.scss';
 

package/components/upsell-banner/style.scss

@@ -75,7 +75,7 @@
 			.upsell-banner--content-cta-button {
 				white-space: nowrap;
 				box-shadow: inset 0 0 0 1.5px rgb(0, 0, 0);
-				font-weight: normal;
+				font-weight: 400;
 				padding: 8px 16px;
               
                 &.secondary {

package/components/zendesk-chat/index.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useCallback } from 'react';
-import { chatKey } from './constants.js';
-import type { ZendeskChatType } from './types.js';
+import { chatKey } from './constants.ts';
+import type { ZendeskChatType } from './types.ts';
 
 export const ZendeskChat: ZendeskChatType = ( { jwt_token } ) => {
 	const authenticateUser = useCallback( () => {

package/index.ts

@@ -14,74 +14,74 @@ along with this program; if not, write to the Free Software
 Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
 */
 
-export { default as JetpackLogo } from './components/jetpack-logo/index.js';
-export { default as JetpackSearchLogo } from './components/jetpack-search-logo/index.js';
-export { default as JetpackProtectLogo } from './components/jetpack-protect-logo/index.js';
-export { default as JetpackVaultPressBackupLogo } from './components/jetpack-vaultpress-backup-logo/index.js';
-export { default as JetpackVideoPressLogo } from './components/jetpack-videopress-logo/index.js';
-export { default as getRedirectUrl } from './tools/jp-redirect/index.js';
-export { default as getProductCheckoutUrl } from './tools/get-product-checkout-url/index.js';
-export { isFirstMonthTrial } from './tools/pricing-utils/index.js';
-export { default as AutomatticBylineLogo } from './components/automattic-byline-logo/index.js';
-export { default as AutomatticIconLogo } from './components/automattic-icon-logo/index.js';
-export { default as AutomatticForAgenciesLogo } from './components/automattic-for-agencies-logo/index.js';
-export { default as JetpackFooter } from './components/jetpack-footer/index.js';
-export { default as Spinner } from './components/spinner/index.js';
-export { default as Gridicon } from './components/gridicon/index.js';
-export { default as IconTooltip } from './components/icon-tooltip/index.js';
-export { default as ActionButton } from './components/action-button/index.js';
-export { default as PricingCard } from './components/pricing-card/index.js';
-export { default as NumberSlider } from './components/number-slider/index.js';
-export { default as AdminSection } from './components/admin-section/basic/index.js';
-export { default as AdminSectionHero } from './components/admin-section/hero/index.js';
-export { default as AdminPage } from './components/admin-page/index.js';
-export { default as DecorativeCard } from './components/decorative-card/index.js';
-export { default as Col } from './components/layout/col/index.js';
-export { default as Testimonials } from './components/testimonials/index.js';
-export { default as Container } from './components/layout/container/index.js';
-export { default as useBreakpointMatch } from './components/layout/use-breakpoint-match/index.js';
-export { default as CopyToClipboard } from './components/copy-to-clipboard/index.js';
-export * from './components/icons/index.js';
-export { default as SplitButton } from './components/split-button/index.js';
-export { default as ThemeProvider } from './components/theme-provider/index.js';
-export { default as Text, H2, H3, Title } from './components/text/index.js';
-export { default as ToggleControl } from './components/toggle-control/index.js';
-export { default as NumberControl } from './components/number-control/index.js';
-export { default as numberFormat } from './components/number-format/index.js';
-export { default as QRCode } from './components/qr-code/index.js';
-export { default as Button } from './components/button/index.js';
-export type { ButtonProps } from './components/button/types.js';
-export { default as LoadingPlaceholder } from './components/loading-placeholder/index.js';
-export { default as TermsOfService } from './components/terms-of-service/index.js';
-export { default as Badge } from './components/badge/index.js';
-export { default as Chip } from './components/chip/index.js';
+export { default as JetpackLogo } from './components/jetpack-logo/index.tsx';
+export { default as JetpackSearchLogo } from './components/jetpack-search-logo/index.tsx';
+export { default as JetpackProtectLogo } from './components/jetpack-protect-logo/index.tsx';
+export { default as JetpackVaultPressBackupLogo } from './components/jetpack-vaultpress-backup-logo/index.tsx';
+export { default as JetpackVideoPressLogo } from './components/jetpack-videopress-logo/index.tsx';
+export { default as getRedirectUrl } from './tools/jp-redirect/index.ts';
+export { default as getProductCheckoutUrl } from './tools/get-product-checkout-url/index.ts';
+export { isFirstMonthTrial } from './tools/pricing-utils/index.ts';
+export { default as AutomatticBylineLogo } from './components/automattic-byline-logo/index.tsx';
+export { default as AutomatticIconLogo } from './components/automattic-icon-logo/index.tsx';
+export { default as AutomatticForAgenciesLogo } from './components/automattic-for-agencies-logo/index.tsx';
+export { default as JetpackFooter } from './components/jetpack-footer/index.tsx';
+export { default as Spinner } from './components/spinner/index.jsx';
+export { default as Gridicon } from './components/gridicon/index.tsx';
+export { default as IconTooltip } from './components/icon-tooltip/index.tsx';
+export { default as ActionButton } from './components/action-button/index.jsx';
+export { default as PricingCard } from './components/pricing-card/index.tsx';
+export { default as NumberSlider } from './components/number-slider/index.tsx';
+export { default as AdminSection } from './components/admin-section/basic/index.tsx';
+export { default as AdminSectionHero } from './components/admin-section/hero/index.tsx';
+export { default as AdminPage } from './components/admin-page/index.tsx';
+export { default as DecorativeCard } from './components/decorative-card/index.tsx';
+export { default as Col } from './components/layout/col/index.tsx';
+export { default as Testimonials } from './components/testimonials/index.tsx';
+export { default as Container } from './components/layout/container/index.tsx';
+export { default as useBreakpointMatch } from './components/layout/use-breakpoint-match/index.ts';
+export { default as CopyToClipboard } from './components/copy-to-clipboard/index.tsx';
+export * from './components/icons/index.tsx';
+export { default as SplitButton } from './components/split-button/index.tsx';
+export { default as ThemeProvider } from './components/theme-provider/index.tsx';
+export { default as Text, H2, H3, Title } from './components/text/index.tsx';
+export { default as ToggleControl } from './components/toggle-control/index.tsx';
+export { default as NumberControl } from './components/number-control/index.jsx';
+export { default as numberFormat } from './components/number-format/index.ts';
+export { default as QRCode } from './components/qr-code/index.tsx';
+export { default as Button } from './components/button/index.tsx';
+export type { ButtonProps } from './components/button/types.ts';
+export { default as LoadingPlaceholder } from './components/loading-placeholder/index.tsx';
+export { default as TermsOfService } from './components/terms-of-service/index.tsx';
+export { default as Badge } from './components/badge/index.tsx';
+export { default as Chip } from './components/chip/index.tsx';
 export {
 	default as PricingTable,
 	PricingTableColumn,
 	PricingTableHeader,
 	PricingTableItem,
-} from './components/pricing-table/index.js';
-export { default as BoostScoreBar } from './components/boost-score-bar/index.js';
-export { default as BoostScoreGraph } from './components/boost-score-graph/index.js';
-export { default as ProductPrice } from './components/product-price/index.js';
-export { default as ProductOffer, IconsCard } from './components/product-offer/index.js';
-export { default as Dialog } from './components/dialog/index.js';
-export { default as DotPager } from './components/dot-pager/index.js';
-export { default as DonutMeter } from './components/donut-meter/index.js';
-export { default as RecordMeterBar } from './components/record-meter-bar/index.js';
-export { default as ContextualUpgradeTrigger } from './components/contextual-upgrade-trigger/index.js';
-export { default as Alert } from './components/alert/index.js';
-export { default as Notice } from './components/notice/index.js';
-export { default as Popover } from './components/popover/index.js';
-export { default as Status } from './components/status/index.js';
-export { default as IndeterminateProgressBar } from './components/indeterminate-progress-bar/index.js';
-export { default as ActionPopover } from './components/action-popover/index.js';
-export { default as ZendeskChat } from './components/zendesk-chat/index.js';
-export { default as ProgressBar } from './components/progress-bar/index.js';
-export { default as UpsellBanner } from './components/upsell-banner/index.js';
-export { getUserLocale, cleanLocale } from './lib/locale/index.js';
-export { default as RadioControl } from './components/radio-control/index.js';
-export { default as StatCard } from './components/stat-card/index.js';
-export { default as DiffViewer } from './components/diff-viewer/index.js';
-export { default as MarkedLines } from './components/marked-lines/index.js';
-export * from './components/global-notices/index.js';
+} from './components/pricing-table/index.tsx';
+export { default as BoostScoreBar } from './components/boost-score-bar/index.tsx';
+export { default as BoostScoreGraph } from './components/boost-score-graph/index.tsx';
+export { default as ProductPrice } from './components/product-price/index.tsx';
+export { default as ProductOffer, IconsCard } from './components/product-offer/index.tsx';
+export { default as Dialog } from './components/dialog/index.tsx';
+export { default as DotPager } from './components/dot-pager/index.tsx';
+export { default as DonutMeter } from './components/donut-meter/index.tsx';
+export { default as RecordMeterBar } from './components/record-meter-bar/index.tsx';
+export { default as ContextualUpgradeTrigger } from './components/contextual-upgrade-trigger/index.tsx';
+export { default as Alert } from './components/alert/index.tsx';
+export { default as Notice } from './components/notice/index.tsx';
+export { default as Popover } from './components/popover/index.tsx';
+export { default as Status } from './components/status/index.tsx';
+export { default as IndeterminateProgressBar } from './components/indeterminate-progress-bar/index.tsx';
+export { default as ActionPopover } from './components/action-popover/index.tsx';
+export { default as ZendeskChat } from './components/zendesk-chat/index.tsx';
+export { default as ProgressBar } from './components/progress-bar/index.tsx';
+export { default as UpsellBanner } from './components/upsell-banner/index.tsx';
+export { getUserLocale, cleanLocale } from './lib/locale/index.ts';
+export { default as RadioControl } from './components/radio-control/index.tsx';
+export { default as StatCard } from './components/stat-card/index.tsx';
+export { default as DiffViewer } from './components/diff-viewer/index.tsx';
+export { default as MarkedLines } from './components/marked-lines/index.tsx';
+export * from './components/global-notices/index.ts';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@automattic/jetpack-components",
-	"version": "0.72.3",
+	"version": "0.72.4",
 	"description": "Jetpack Components Package",
 	"author": "Automattic",
 	"license": "GPL-2.0-or-later",
@@ -15,9 +15,9 @@
 	},
 	"dependencies": {
 		"@automattic/format-currency": "1.0.1",
-		"@automattic/jetpack-boost-score-api": "^0.1.62",
+		"@automattic/jetpack-boost-score-api": "^0.1.63",
 		"@automattic/jetpack-api": "^0.20.1",
-		"@automattic/jetpack-script-data": "^0.3.0",
+		"@automattic/jetpack-script-data": "^0.4.0",
 		"@babel/runtime": "^7",
 		"@wordpress/browserslist-config": "6.21.0",
 		"@wordpress/components": "29.7.0",
@@ -32,12 +32,12 @@
 		"prop-types": "^15.7.2",
 		"qrcode.react": "4.2.0",
 		"react-slider": "2.0.5",
-		"social-logos": "^3.1.19",
+		"social-logos": "^3.1.20",
 		"uplot": "1.6.31",
 		"uplot-react": "1.1.4"
 	},
 	"devDependencies": {
-		"@automattic/jetpack-base-styles": "^0.7.0",
+		"@automattic/jetpack-base-styles": "^0.7.1",
 		"@babel/core": "7.26.10",
 		"@babel/preset-react": "7.26.3",
 		"@jest/globals": "29.4.3",

package/tools/jp-redirect/index.ts

@@ -1,6 +1,6 @@
 /* global jetpack_redirects */
 
-import { GetRedirectUrlArgs, QueryVars } from './types.js';
+import { GetRedirectUrlArgs, QueryVars } from './types.ts';
 
 /**
  * Builds an URL using the jetpack.com/redirect/ service

package/tools/pricing-utils/index.ts

@@ -1,4 +1,4 @@
-import { IntroOffer } from './types.js';
+import { IntroOffer } from './types.ts';
 
 /**
  * Returns whether an Introductory Offer is a first month trial