@automattic/jetpack-ai-client 0.33.3 → 0.33.6

package/CHANGELOG.md

@@ -5,6 +5,21 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.33.6] - 2025-08-11
+### Changed
+- Update package dependencies. [#44677]
+
+### Fixed
+- I18n: Improve context hints in comments for translators. [#44686]
+
+## [0.33.5] - 2025-08-04
+### Changed
+- Update dependencies. [#44551]
+
+## [0.33.4] - 2025-07-28
+### Fixed
+- Block Editor: Fix Jetpack AI upgrade links. [#44405]
+
 ## [0.33.3] - 2025-07-21
 ### Changed
 - Internal updates.
@@ -667,6 +682,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - AI Client: stop using smart document visibility handling on the fetchEventSource library, so it does not restart the completion when changing tabs. [#32004]
 - Updated package dependencies. [#31468] [#31659] [#31785]
 
+[0.33.6]: https://github.com/Automattic/jetpack-ai-client/compare/v0.33.5...v0.33.6
+[0.33.5]: https://github.com/Automattic/jetpack-ai-client/compare/v0.33.4...v0.33.5
+[0.33.4]: https://github.com/Automattic/jetpack-ai-client/compare/v0.33.3...v0.33.4
 [0.33.3]: https://github.com/Automattic/jetpack-ai-client/compare/v0.33.2...v0.33.3
 [0.33.2]: https://github.com/Automattic/jetpack-ai-client/compare/v0.33.1...v0.33.2
 [0.33.1]: https://github.com/Automattic/jetpack-ai-client/compare/v0.33.0...v0.33.1

package/build/components/ai-image/hooks/use-ai-image.js

@@ -50,7 +50,7 @@ export default function useAiImage({ feature, type, cost, autoStart = true, prev
         });
     }, []);
     // the selec/useEffect combo...
-    const loadedMedia = useSelect((select) => select('core')?.getMedia?.(previousMediaId), [previousMediaId]);
+    const loadedMedia = useSelect((select) => select('core')?.getEntityRecord?.('postType', 'attachment', previousMediaId), [previousMediaId]);
     useEffect(() => {
         if (loadedMedia) {
             updateImages({

package/build/components/ai-image/types.d.ts

@@ -9,7 +9,7 @@ export interface EditorSelectors {
     isEditorPanelOpened: (panel: string) => boolean;
 }
 export interface CoreSelectors {
-    getMedia: (mediaId: number) => {
+    getEntityRecord: (kind: string, name: string, key: number) => {
         id: number;
         source_url: string;
     } | null;

package/build/components/message/index.js

@@ -90,7 +90,7 @@ export function UpgradeMessage({ requestsRemaining, severity, onUpgradeClick, up
     }
     return (_jsxs(Message, { severity: messageSeverity, children: [_jsx("span", { children: sprintf(
                 // translators: %1$d: number of requests remaining
-                __('You have %1$d requests remaining.', 'jetpack-ai-client'), requestsRemaining) }), _jsx(Button, { variant: "link", onClick: onUpgradeClick, href: upgradeUrl, target: upgradeUrl ? '_blank' : null, children: __('Upgrade now', 'jetpack-ai-client') })] }));
+                __('You have %1$d requests remaining.', 'jetpack-ai-client'), requestsRemaining) }), _jsx(Button, { variant: "link", onClick: onUpgradeClick, href: upgradeUrl, target: upgradeUrl ? '_blank' : null, children: _jsx("span", { children: __('Upgrade now', 'jetpack-ai-client') }) })] }));
 }
 /**
  * React component to render an error message
@@ -102,5 +102,5 @@ export function ErrorMessage({ error, code, onTryAgainClick, onUpgradeClick, upg
     const errorMessage = error || __('Something went wrong', 'jetpack-ai-client');
     return (_jsxs(Message, { severity: MESSAGE_SEVERITY_ERROR, children: [_jsx("span", { children: sprintf(
                 // translators: %1$d: A dynamic error message
-                __('Error: %1$s', 'jetpack-ai-client'), errorMessage) }), code === ERROR_QUOTA_EXCEEDED ? (_jsx(Button, { variant: "link", onClick: onUpgradeClick, href: upgradeUrl, target: upgradeUrl ? '_blank' : null, children: __('Upgrade now', 'jetpack-ai-client') })) : (_jsx(Button, { variant: "link", onClick: onTryAgainClick, children: __('Try again', 'jetpack-ai-client') }))] }));
+                __('Error: %1$s', 'jetpack-ai-client'), errorMessage) }), code === ERROR_QUOTA_EXCEEDED ? (_jsx(Button, { variant: "link", onClick: onUpgradeClick, href: upgradeUrl, target: upgradeUrl ? '_blank' : null, children: _jsx("span", { children: __('Upgrade now', 'jetpack-ai-client') }) })) : (_jsx(Button, { variant: "link", onClick: onTryAgainClick, children: _jsx("span", { children: __('Try again', 'jetpack-ai-client') }) }))] }));
 }

package/build/components/quota-exceeded-message/index.js

@@ -33,7 +33,7 @@ const useFairUsageNoticeMessage = () => {
             nextUsagePeriodStartDate.getDate());
     };
     const getFairUsageNoticeMessage = resetDateString => {
-        const fairUsageMessage = __("You've reached this month's request limit, per our <link>fair usage policy</link>.", 'jetpack-ai-client');
+        const fairUsageMessage = __("You've reached this month's request limit, per our <link><span>fair usage policy</span></link>.", 'jetpack-ai-client');
         if (!resetDateString) {
             return fairUsageMessage;
         }
@@ -47,6 +47,7 @@ const useFairUsageNoticeMessage = () => {
     const fairUsageNoticeMessage = getFairUsageNoticeMessage(nextUsagePeriodStartDateString);
     const fairUsageNoticeMessageElement = createInterpolateElement(fairUsageNoticeMessage, {
         link: (_jsx("a", { href: "https://jetpack.com/redirect/?source=ai-assistant-fair-usage-policy", target: "_blank", rel: "noreferrer" })),
+        span: _jsx("span", {}),
     });
     return fairUsageNoticeMessageElement;
 };
@@ -90,12 +91,12 @@ const DefaultUpgradePrompt = ({ placement = null, description = null, useLightNu
             return (_jsx(Nudge, { buttonText: __('Contact Us', 'jetpack-ai-client'), description: description || contactUsDescription, className: 'jetpack-ai-upgrade-banner', checkoutUrl: contactHref, visible: true, align: null, title: null, context: null, goToCheckoutPage: handleContactUsClick, target: "_blank" }));
         }
         const upgradeDescription = createInterpolateElement(sprintf(
-        /* Translators: number of requests */
+        /* Translators: %d: the number of requests allowed */
         __('You have reached the requests limit for your current plan. <strong>Upgrade now to increase your requests limit to %d.</strong>', 'jetpack-ai-client'), nextTier.limit), {
             strong: _jsx("strong", {}),
         });
         return (_jsx(Nudge, { buttonText: sprintf(
-            /* Translators: number of requests */
+            /* Translators: %d: the number of requests */
             __('Upgrade to %d requests', 'jetpack-ai-client'), nextTier.limit), checkoutUrl: checkoutUrl, className: 'jetpack-ai-upgrade-banner', description: description || upgradeDescription, goToCheckoutPage: handleUpgradeClick, visible: true, align: 'center', title: null, context: null, target: "_blank" }));
     }
     return (_jsx(Nudge, { buttonText: __('Upgrade', 'jetpack-ai-client'), checkoutUrl: checkoutUrl, className: 'jetpack-ai-upgrade-banner', description: createInterpolateElement(__('Congratulations on exploring Jetpack AI and reaching the free requests limit! <strong>Upgrade now to keep using it.</strong>', 'jetpack-ai-client'), {

package/build/components/quota-exceeded-message/light-nudge.js

@@ -4,5 +4,5 @@ import { __ } from '@wordpress/i18n';
 import './style.scss';
 export const LightNudge = ({ title, description, buttonText = null, checkoutUrl = null, goToCheckoutPage = null, isRedirecting = false, showButton = true, target = '_top', }) => {
     const redirectingText = __('Redirecting…', 'jetpack-ai-client');
-    return (_jsx("div", { className: "jetpack-upgrade-plan-banner-light", children: _jsx(Notice, { status: "error", isDismissible: false, children: _jsxs("p", { children: [title && _jsx("strong", { children: title }), description, ' ', showButton && (_jsx(Button, { href: isRedirecting ? null : checkoutUrl, onClick: goToCheckoutPage, variant: "link", target: target, children: isRedirecting ? redirectingText : buttonText }))] }) }) }));
+    return (_jsx("div", { className: "jetpack-upgrade-plan-banner-light", children: _jsx(Notice, { status: "error", isDismissible: false, children: _jsxs("p", { children: [title && _jsx("strong", { children: title }), description, ' ', showButton && (_jsx(Button, { href: isRedirecting ? null : checkoutUrl, onClick: goToCheckoutPage, variant: "link", target: target, children: _jsx("span", { children: isRedirecting ? redirectingText : buttonText }) }))] }) }) }));
 };

package/build/constants.d.ts

@@ -1,80 +1,80 @@
 export declare const LANGUAGE_MAP: {
     en: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"English">;
     };
     es: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Spanish">;
     };
     fr: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"French">;
     };
     de: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"German">;
     };
     it: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Italian">;
     };
     pt: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Portuguese">;
     };
     ru: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Russian">;
     };
     zh: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Chinese">;
     };
     ja: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Japanese">;
     };
     ar: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Arabic">;
     };
     hi: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Hindi">;
     };
     ko: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Korean">;
     };
 };
 export declare const PROMPT_TONES_MAP: {
     formal: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Formal">;
         emoji: string;
     };
     informal: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Informal">;
         emoji: string;
     };
     optimistic: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Optimistic">;
         emoji: string;
     };
     humorous: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Humorous">;
         emoji: string;
     };
     serious: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Serious">;
         emoji: string;
     };
     skeptical: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Skeptical">;
         emoji: string;
     };
     empathetic: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Empathetic">;
         emoji: string;
     };
     confident: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Confident">;
         emoji: string;
     };
     passionate: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Passionate">;
         emoji: string;
     };
     provocative: {
-        label: string;
+        label: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Provocative">;
         emoji: string;
     };
 };
@@ -92,18 +92,18 @@ export declare const PROMPT_TYPE_USER_PROMPT: "userPrompt";
 export declare const PROMPT_TYPE_JETPACK_FORM_CUSTOM_PROMPT: "jetpackFormCustomPrompt";
 export declare const PROMPT_TYPE_TRANSFORM_LIST_TO_TABLE: "transformListToTable";
 export declare const PROMPT_TYPE_WRITE_POST_FROM_LIST: "writePostFromList";
-export declare const TRANSLATE_LABEL: string;
-export declare const TONE_LABEL: string;
-export declare const CORRECT_SPELLING_LABEL: string;
-export declare const SIMPLIFY_LABEL: string;
-export declare const SUMMARIZE_LABEL: string;
-export declare const MAKE_SHORTER_LABEL: string;
-export declare const MAKE_LONGER_LABEL: string;
-export declare const TURN_LIST_INTO_TABLE_LABEL: string;
-export declare const WRITE_POST_FROM_LIST_LABEL: string;
-export declare const GENERATE_TITLE_LABEL: string;
-export declare const SUMMARY_BASED_ON_TITLE_LABEL: string;
-export declare const CONTINUE_LABEL: string;
+export declare const TRANSLATE_LABEL: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Translate">;
+export declare const TONE_LABEL: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Change tone">;
+export declare const CORRECT_SPELLING_LABEL: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Correct spelling and grammar">;
+export declare const SIMPLIFY_LABEL: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Simplify">;
+export declare const SUMMARIZE_LABEL: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Summarize">;
+export declare const MAKE_SHORTER_LABEL: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Make shorter">;
+export declare const MAKE_LONGER_LABEL: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Expand">;
+export declare const TURN_LIST_INTO_TABLE_LABEL: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Turn list into a table">;
+export declare const WRITE_POST_FROM_LIST_LABEL: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Write a post from this list">;
+export declare const GENERATE_TITLE_LABEL: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Generate a post title">;
+export declare const SUMMARY_BASED_ON_TITLE_LABEL: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Summary based on title">;
+export declare const CONTINUE_LABEL: import("@wordpress/i18n/build-types/types.js").TranslatableText<"Continue writing">;
 export declare const PLACEMENT_JETPACK_SIDEBAR: "jetpack-sidebar";
 export declare const PLACEMENT_DOCUMENT_SETTINGS: "document-settings";
 export declare const PLACEMENT_PRE_PUBLISH: "pre-publish";

package/build/logo-generator/components/prompt.js

@@ -156,5 +156,5 @@ export const Prompt = ({ initialPrompt = '' }) => {
     }, [context, setStyle, recordTracksEvent]);
     return (_jsxs("div", { className: "jetpack-ai-logo-generator__prompt", children: [_jsxs("div", { className: "jetpack-ai-logo-generator__prompt-header", children: [_jsx("div", { className: "jetpack-ai-logo-generator__prompt-label", children: __('Describe your site:', 'jetpack-ai-client') }), _jsx("div", { className: "jetpack-ai-logo-generator__prompt-actions", children: _jsxs(Button, { variant: "link", disabled: isBusy || requireUpgrade || !hasPrompt, onClick: onEnhance, children: [_jsx(AiIcon, {}), enhanceButtonLabel] }) }), showStyleSelector && (_jsx(SelectControl, { __nextHasNoMarginBottom: true, __next40pxDefaultSize: true, value: style, options: styles, onChange: updateStyle, disabled: isBusy || requireUpgrade }))] }), _jsx(AiModalPromptInput, { prompt: prompt, setPrompt: setPrompt, generateHandler: onGenerate, disabled: isBusy || requireUpgrade, actionDisabled: isBusy || requireUpgrade || !hasPrompt, placeholder: __('Describe your site or simply ask for a logo specifying some details about it', 'jetpack-ai-client') }), _jsxs("div", { className: "jetpack-ai-logo-generator__prompt-footer", children: [!isUnlimited && !requireUpgrade && (_jsxs("div", { className: "jetpack-ai-logo-generator__prompt-requests", children: [_jsx("div", { children: sprintf(
                                 // translators: %u is the number of requests
-                                __('%u requests remaining.', 'jetpack-ai-client'), requestsRemaining) }), hasNextTier && (_jsxs(_Fragment, { children: ["\u00A0", _jsx(Button, { variant: "link", href: checkoutUrl, target: "_blank", onClick: onUpgradeClick, children: __('Upgrade', 'jetpack-ai-client') })] })), "\u00A0", _jsx(Tooltip, { text: __('Logo generation costs 10 requests; prompt enhancement costs 1 request each', 'jetpack-ai-client'), placement: "bottom", children: _jsx(Icon, { className: "prompt-footer__icon", icon: info }) })] })), requireUpgrade && tierPlansEnabled && _jsx(UpgradeNudge, {}), requireUpgrade && !tierPlansEnabled && _jsx(FairUsageNotice, {}), enhancePromptFetchError && (_jsx("div", { className: "jetpack-ai-logo-generator__prompt-error", children: __('Error enhancing prompt. Please try again.', 'jetpack-ai-client') })), logoFetchError && (_jsx("div", { className: "jetpack-ai-logo-generator__prompt-error", children: __('Error generating logo. Please try again.', 'jetpack-ai-client') }))] })] }));
+                                __('%u requests remaining.', 'jetpack-ai-client'), requestsRemaining) }), hasNextTier && (_jsxs(_Fragment, { children: ["\u00A0", _jsx(Button, { variant: "link", href: checkoutUrl, target: "_blank", onClick: onUpgradeClick, children: _jsx("span", { children: __('Upgrade', 'jetpack-ai-client') }) })] })), "\u00A0", _jsx(Tooltip, { text: __('Logo generation costs 10 requests; prompt enhancement costs 1 request each', 'jetpack-ai-client'), placement: "bottom", children: _jsx(Icon, { className: "prompt-footer__icon", icon: info }) })] })), requireUpgrade && tierPlansEnabled && _jsx(UpgradeNudge, {}), requireUpgrade && !tierPlansEnabled && _jsx(FairUsageNotice, {}), enhancePromptFetchError && (_jsx("div", { className: "jetpack-ai-logo-generator__prompt-error", children: __('Error enhancing prompt. Please try again.', 'jetpack-ai-client') })), logoFetchError && (_jsx("div", { className: "jetpack-ai-logo-generator__prompt-error", children: __('Error generating logo. Please try again.', 'jetpack-ai-client') }))] })] }));
 };

package/build/logo-generator/components/upgrade-nudge.js

@@ -26,5 +26,5 @@ export const UpgradeNudge = () => {
     const handleUpgradeClick = () => {
         recordTracksEvent(EVENT_UPGRADE, { context, placement: EVENT_PLACEMENT_UPGRADE_PROMPT });
     };
-    return (_jsx("div", { className: "jetpack-upgrade-plan-banner", children: _jsxs("div", { className: "jetpack-upgrade-plan-banner__wrapper", children: [_jsxs("div", { children: [_jsx(Icon, { className: "jetpack-upgrade-plan-banner__icon", icon: warning }), _jsx("span", { className: "jetpack-upgrade-plan-banner__banner-description", children: upgradeMessage })] }), _jsx(Button, { href: checkoutUrl, target: "_blank", className: "is-primary", onClick: handleUpgradeClick, children: buttonText })] }) }));
+    return (_jsx("div", { className: "jetpack-upgrade-plan-banner", children: _jsxs("div", { className: "jetpack-upgrade-plan-banner__wrapper", children: [_jsxs("div", { children: [_jsx(Icon, { className: "jetpack-upgrade-plan-banner__icon", icon: warning }), _jsx("span", { className: "jetpack-upgrade-plan-banner__banner-description", children: upgradeMessage })] }), _jsx(Button, { href: checkoutUrl, target: "_blank", className: "is-primary", onClick: handleUpgradeClick, children: _jsx("span", { children: buttonText }) })] }) }));
 };

package/build/logo-generator/components/upgrade-screen.js

@@ -24,5 +24,5 @@ export const UpgradeScreen = ({ onCancel, upgradeURL, reason }) => {
         recordTracksEvent(EVENT_UPGRADE, { context, placement: EVENT_PLACEMENT_FREE_USER_SCREEN });
         onCancel();
     };
-    return (_jsxs("div", { className: "jetpack-ai-logo-generator-modal__notice-message-wrapper", children: [_jsxs("div", { className: "jetpack-ai-logo-generator-modal__notice-message", children: [_jsx("span", { className: "jetpack-ai-logo-generator-modal__loading-message", children: reason === 'feature' ? upgradeMessageFeature : upgradeMessageRequests }), "\u00A0", _jsx(Button, { variant: "link", href: upgradeInfoUrl, target: "_blank", children: __('Learn more about Jetpack AI.', 'jetpack-ai-client') })] }), _jsxs("div", { className: "jetpack-ai-logo-generator-modal__notice-actions", children: [_jsx(Button, { variant: "tertiary", onClick: onCancel, children: __('Cancel', 'jetpack-ai-client') }), _jsx(Button, { variant: "primary", href: upgradeURL, target: "_blank", onClick: handleUpgradeClick, children: __('Upgrade', 'jetpack-ai-client') })] })] }));
+    return (_jsxs("div", { className: "jetpack-ai-logo-generator-modal__notice-message-wrapper", children: [_jsxs("div", { className: "jetpack-ai-logo-generator-modal__notice-message", children: [_jsx("span", { className: "jetpack-ai-logo-generator-modal__loading-message", children: reason === 'feature' ? upgradeMessageFeature : upgradeMessageRequests }), "\u00A0", _jsx(Button, { variant: "link", href: upgradeInfoUrl, target: "_blank", children: _jsx("span", { children: __('Learn more about Jetpack AI.', 'jetpack-ai-client') }) })] }), _jsxs("div", { className: "jetpack-ai-logo-generator-modal__notice-actions", children: [_jsx(Button, { variant: "tertiary", onClick: onCancel, children: _jsx("span", { children: __('Cancel', 'jetpack-ai-client') }) }), _jsx(Button, { variant: "primary", href: upgradeURL, target: "_blank", onClick: handleUpgradeClick, children: _jsx("span", { children: __('Upgrade', 'jetpack-ai-client') }) })] })] }));
 };

package/build/logo-generator/components/visit-site-banner.js

@@ -12,5 +12,5 @@ import clsx from 'clsx';
 import jetpackLogo from '../assets/images/jetpack-logo.svg';
 import './visit-site-banner.scss';
 export const VisitSiteBanner = ({ className = null, onVisitBlankTarget }) => {
-    return (_jsxs("div", { className: clsx('jetpack-ai-logo-generator-modal-visit-site-banner', className), children: [_jsx("div", { className: "jetpack-ai-logo-generator-modal-visit-site-banner__jetpack-logo", children: _jsx("img", { src: jetpackLogo, alt: "Jetpack" }) }), _jsxs("div", { className: "jetpack-ai-logo-generator-modal-visit-site-banner__content", children: [_jsx("strong", { children: __('Do you want to know all the amazing things you can do with Jetpack AI?', 'jetpack-ai-client') }), _jsx("span", { children: __('Generate and tweak content, create forms, get feedback and much more.', 'jetpack-ai-client') }), _jsx("div", { children: _jsxs(Button, { variant: "link", href: "https://jetpack.com/redirect/?source=logo_generator_learn_more_about_jetpack_ai", target: "_blank", onClick: onVisitBlankTarget ? onVisitBlankTarget : null, children: [__('Learn more about Jetpack AI', 'jetpack-ai-client'), _jsx(Icon, { icon: external, size: 20 })] }) })] })] }));
+    return (_jsxs("div", { className: clsx('jetpack-ai-logo-generator-modal-visit-site-banner', className), children: [_jsx("div", { className: "jetpack-ai-logo-generator-modal-visit-site-banner__jetpack-logo", children: _jsx("img", { src: jetpackLogo, alt: "Jetpack" }) }), _jsxs("div", { className: "jetpack-ai-logo-generator-modal-visit-site-banner__content", children: [_jsx("strong", { children: __('Do you want to know all the amazing things you can do with Jetpack AI?', 'jetpack-ai-client') }), _jsx("span", { children: __('Generate and tweak content, create forms, get feedback and much more.', 'jetpack-ai-client') }), _jsx("div", { children: _jsxs(Button, { variant: "link", href: "https://jetpack.com/redirect/?source=logo_generator_learn_more_about_jetpack_ai", target: "_blank", onClick: onVisitBlankTarget ? onVisitBlankTarget : null, children: [_jsx("span", { children: __('Learn more about Jetpack AI', 'jetpack-ai-client') }), _jsx(Icon, { icon: external, size: 20 })] }) })] })] }));
 };

package/build/logo-generator/hooks/use-fair-usage-notice-message.js

@@ -24,7 +24,7 @@ const useFairUsageNoticeMessage = () => {
             nextUsagePeriodStartDate.getDate());
     };
     const getFairUsageNoticeMessage = resetDateString => {
-        const fairUsageMessage = __("You've reached this month's request limit, per our <link>fair usage policy</link>.", 'jetpack-ai-client');
+        const fairUsageMessage = __("You've reached this month's request limit, per our <link><span>fair usage policy</span></link>.", 'jetpack-ai-client');
         if (!resetDateString) {
             return fairUsageMessage;
         }
@@ -41,6 +41,7 @@ const useFairUsageNoticeMessage = () => {
     });
     const fairUsageNoticeMessageElement = createInterpolateElement(fairUsageNoticeMessage, {
         link: _jsx("a", { href: upgradeInfoUrl, target: "_blank", rel: "noreferrer" }),
+        span: _jsx("span", {}),
     });
     return fairUsageNoticeMessageElement;
 };

package/package.json

@@ -1,7 +1,7 @@
 {
-	"private": false,
 	"name": "@automattic/jetpack-ai-client",
-	"version": "0.33.3",
+	"version": "0.33.6",
+	"private": false,
 	"description": "A JS client for consuming Jetpack AI services",
 	"homepage": "https://github.com/Automattic/jetpack/tree/HEAD/projects/js-packages/ai-client/#readme",
 	"bugs": {
@@ -14,27 +14,7 @@
 	},
 	"license": "GPL-2.0-or-later",
 	"author": "Automattic",
-	"scripts": {
-		"build": "pnpm run clean && pnpm run compile-ts",
-		"clean": "rm -rf build/",
-		"compile-ts": "tsc --pretty",
-		"test": "NODE_OPTIONS=--experimental-vm-modules jest",
-		"test-coverage": "pnpm run test --coverage",
-		"typecheck": "tsc --noEmit",
-		"watch": "tsc --watch --pretty"
-	},
 	"type": "module",
-	"devDependencies": {
-		"@storybook/addon-docs": "9.0.15",
-		"@storybook/react": "9.0.15",
-		"@testing-library/dom": "10.4.0",
-		"@types/markdown-it": "14.1.2",
-		"@types/turndown": "5.0.5",
-		"jest": "30.0.4",
-		"jest-environment-jsdom": "30.0.4",
-		"storybook": "9.0.15",
-		"typescript": "5.8.3"
-	},
 	"exports": {
 		".": {
 			"types": "./build/index.d.ts",
@@ -43,36 +23,56 @@
 	},
 	"main": "./build/index.js",
 	"types": "./build/index.d.ts",
+	"scripts": {
+		"build": "pnpm run clean && pnpm run compile-ts",
+		"clean": "rm -rf build/",
+		"compile-ts": "tsc --pretty",
+		"test": "NODE_OPTIONS=--experimental-vm-modules jest",
+		"test-coverage": "pnpm run test --coverage",
+		"typecheck": "tsc --noEmit",
+		"watch": "tsc --watch --pretty"
+	},
 	"dependencies": {
-		"@automattic/jetpack-base-styles": "^1.0.5",
-		"@automattic/jetpack-components": "^1.1.14",
-		"@automattic/jetpack-connection": "^1.2.14",
+		"@automattic/jetpack-base-styles": "^1.0.7",
+		"@automattic/jetpack-components": "^1.1.18",
+		"@automattic/jetpack-connection": "^1.4.1",
 		"@automattic/jetpack-explat": "workspace:*",
-		"@automattic/jetpack-script-data": "^0.5.0",
-		"@automattic/jetpack-shared-extension-utils": "^1.3.5",
+		"@automattic/jetpack-script-data": "^0.5.1",
+		"@automattic/jetpack-shared-extension-utils": "^1.3.10",
 		"@microsoft/fetch-event-source": "2.0.1",
 		"@types/jest": "30.0.0",
 		"@types/react": "18.3.23",
 		"@types/wordpress__block-editor": "11.5.16",
-		"@wordpress/api-fetch": "7.26.0",
-		"@wordpress/base-styles": "6.2.0",
-		"@wordpress/blob": "4.26.0",
-		"@wordpress/block-editor": "14.21.0",
-		"@wordpress/blocks": "14.15.0",
-		"@wordpress/components": "29.12.0",
-		"@wordpress/compose": "7.26.0",
-		"@wordpress/data": "10.26.0",
-		"@wordpress/editor": "14.26.0",
-		"@wordpress/element": "6.26.0",
-		"@wordpress/i18n": "5.26.0",
-		"@wordpress/icons": "10.26.0",
-		"@wordpress/primitives": "4.26.0",
-		"@wordpress/url": "4.26.0",
+		"@wordpress/api-fetch": "7.27.0",
+		"@wordpress/base-styles": "6.3.0",
+		"@wordpress/blob": "4.27.0",
+		"@wordpress/block-editor": "15.0.0",
+		"@wordpress/blocks": "15.0.0",
+		"@wordpress/components": "30.0.0",
+		"@wordpress/compose": "7.27.0",
+		"@wordpress/data": "10.27.0",
+		"@wordpress/editor": "14.27.0",
+		"@wordpress/element": "6.27.0",
+		"@wordpress/i18n": "6.0.0",
+		"@wordpress/icons": "10.27.0",
+		"@wordpress/primitives": "4.27.0",
+		"@wordpress/url": "4.27.0",
 		"clsx": "2.1.1",
 		"debug": "4.4.1",
 		"markdown-it": "14.1.0",
 		"react": "18.3.1",
 		"react-dom": "18.3.1",
 		"turndown": "7.1.2"
+	},
+	"devDependencies": {
+		"@storybook/addon-docs": "9.0.15",
+		"@storybook/react": "9.0.15",
+		"@testing-library/dom": "10.4.0",
+		"@types/markdown-it": "14.1.2",
+		"@types/turndown": "5.0.5",
+		"jest": "30.0.4",
+		"jest-environment-jsdom": "30.0.4",
+		"storybook": "9.0.15",
+		"typescript": "5.8.3"
 	}
 }

package/src/components/ai-control/style.scss

@@ -1,4 +1,4 @@
-@use '@automattic/jetpack-base-styles/root-variables';
+@use "@automattic/jetpack-base-styles/root-variables";
 
 .jetpack-components-ai-control__container-wrapper {
 	position: sticky;
@@ -11,7 +11,7 @@
 	box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.12), 0 3px 9px 0 rgba(0, 0, 0, 0.12), 0 1px 3px 0 rgba(0, 0, 0, 0.15);
 	font-family: "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 	border-radius: 6px;
-	border: 1px solid var(--gutenberg-gray-400, #CCC);
+	border: 1px solid var(--gutenberg-gray-400, #ccc);
 }
 
 .jetpack-components-ai-control__wrapper {

package/src/components/ai-image/components/usage-counter.scss

@@ -1,4 +1,4 @@
-@use '@automattic/jetpack-base-styles/style';
+@use "@automattic/jetpack-base-styles/style";
 
 .ai-assistant-featured-image__usage-counter {
 	color: var(--studio-gray-50, #646970);

package/src/components/ai-image/hooks/use-ai-image.ts

@@ -119,7 +119,8 @@ export default function useAiImage( {
 
 	// the selec/useEffect combo...
 	const loadedMedia = useSelect(
-		( select: ( store ) => CoreSelectors ) => select( 'core' )?.getMedia?.( previousMediaId ),
+		( select: ( store ) => CoreSelectors ) =>
+			select( 'core' )?.getEntityRecord?.( 'postType', 'attachment', previousMediaId ),
 		[ previousMediaId ]
 	);
 	useEffect( () => {

package/src/components/ai-image/style.scss

@@ -30,7 +30,7 @@
 		textarea {
 			width: 100%;
 			outline: none;
-			border: 1px solid #CCC;
+			border: 1px solid #ccc;
 			border-radius: 6px;
 			padding: 12px;
 			color: var(--studio-black);
@@ -76,7 +76,7 @@
 		margin-top: 32px;
 		margin-bottom: -32px;
 		padding: 8px 32px;
-		border-top: solid 1px #DCDCDE;
+		border-top: solid 1px #dcdcde;
 		height: 60px;
 
 		&__feedback-button {

package/src/components/ai-image/types.ts

@@ -12,7 +12,11 @@ export interface EditorSelectors {
 }
 
 export interface CoreSelectors {
-	getMedia: ( mediaId: number ) => {
+	getEntityRecord: (
+		kind: string,
+		name: string,
+		key: number
+	) => {
 		id: number;
 		source_url: string;
 	} | null;

package/src/components/ai-status-indicator/style.scss

@@ -1,4 +1,4 @@
-@use '@automattic/jetpack-base-styles/style';
+@use "@automattic/jetpack-base-styles/style";
 
 .jetpack-ai-status-indicator__icon-wrapper {
 	transition: opacity 0.25s ease-in-out, width 0.25s;

package/src/components/message/index.tsx

@@ -209,7 +209,7 @@ export function UpgradeMessage( {
 				href={ upgradeUrl }
 				target={ upgradeUrl ? '_blank' : null }
 			>
-				{ __( 'Upgrade now', 'jetpack-ai-client' ) }
+				<span>{ __( 'Upgrade now', 'jetpack-ai-client' ) }</span>
 			</Button>
 		</Message>
 	);
@@ -246,11 +246,11 @@ export function ErrorMessage( {
 					href={ upgradeUrl }
 					target={ upgradeUrl ? '_blank' : null }
 				>
-					{ __( 'Upgrade now', 'jetpack-ai-client' ) }
+					<span>{ __( 'Upgrade now', 'jetpack-ai-client' ) }</span>
 				</Button>
 			) : (
 				<Button variant="link" onClick={ onTryAgainClick }>
-					{ __( 'Try again', 'jetpack-ai-client' ) }
+					<span>{ __( 'Try again', 'jetpack-ai-client' ) }</span>
 				</Button>
 			) }
 		</Message>

package/src/components/message/style.scss

@@ -1,4 +1,4 @@
-@use '@automattic/jetpack-base-styles/root-variables';
+@use "@automattic/jetpack-base-styles/root-variables";
 
 .jetpack-ai-assistant__message {
 	display: flex;
@@ -32,8 +32,8 @@
 			color: var(--jp-gray-50);
 		}
 
-		// Force padding 0 in link buttons, since default Gutenberg version in WordPress doesn't use iframe and
-		// Buttons receive styles from edit-post-visual-editor.
+		// Force padding 0 in link buttons, since default Gutenberg in WordPress
+		// doesn't use iframe and Buttons receive styles from edit-post-visual-editor.
 		.components-button.is-link {
 			padding: 0;
 		}
@@ -51,7 +51,7 @@
 }
 
 .jetpack-ai-assistant__message-severity-warning {
-	background-color: #FEF8EE;
+	background-color: #fef8ee;
 	color: var(--jp-gray-100);
 }
 
@@ -60,7 +60,7 @@
 	color: var(--jp-gray-100);
 
 	> svg {
-		fill: var(--jp-red-40, #E65054);
+		fill: var(--jp-red-40, #e65054);
 	}
 }
 

package/src/components/modal/style.scss

@@ -23,7 +23,7 @@
 	}
 
 	&__divider {
-		background: #DCDCDE;
+		background: #dcdcde;
 		margin: 0 -32px;
 		height: 1px;
 	}

package/src/components/quota-exceeded-message/index.tsx

@@ -47,7 +47,7 @@ const useFairUsageNoticeMessage = () => {
 
 	const getFairUsageNoticeMessage = resetDateString => {
 		const fairUsageMessage = __(
-			"You've reached this month's request limit, per our <link>fair usage policy</link>.",
+			"You've reached this month's request limit, per our <link><span>fair usage policy</span></link>.",
 			'jetpack-ai-client'
 		);
 
@@ -75,6 +75,7 @@ const useFairUsageNoticeMessage = () => {
 				rel="noreferrer"
 			/>
 		),
+		span: <span />,
 	} );
 
 	return fairUsageNoticeMessageElement;
@@ -166,7 +167,7 @@ const DefaultUpgradePrompt = ( {
 
 		const upgradeDescription = createInterpolateElement(
 			sprintf(
-				/* Translators: number of requests */
+				/* Translators: %d: the number of requests allowed */
 				__(
 					'You have reached the requests limit for your current plan. <strong>Upgrade now to increase your requests limit to %d.</strong>',
 					'jetpack-ai-client'
@@ -181,7 +182,7 @@ const DefaultUpgradePrompt = ( {
 		return (
 			<Nudge
 				buttonText={ sprintf(
-					/* Translators: number of requests */
+					/* Translators: %d: the number of requests */
 					__( 'Upgrade to %d requests', 'jetpack-ai-client' ),
 					nextTier.limit
 				) }

package/src/components/quota-exceeded-message/light-nudge.tsx

@@ -28,7 +28,7 @@ export const LightNudge = ( {
 							variant="link"
 							target={ target }
 						>
-							{ isRedirecting ? redirectingText : buttonText }
+							<span>{ isRedirecting ? redirectingText : buttonText }</span>
 						</Button>
 					) }
 				</p>

package/src/components/quota-exceeded-message/style.scss

@@ -1,4 +1,4 @@
-@use '@automattic/jetpack-base-styles/style';
+@use "@automattic/jetpack-base-styles/style";
 
 .jetpack-upgrade-plan-banner__wrapper {
 	column-gap: 32px;
@@ -29,9 +29,9 @@
 }
 
 .jetpack-ai-fair-usage-notice {
-	color: #1E1E1E;
+	color: #1e1e1e;
 
 	a {
-		color: #1E1E1E;
+		color: #1e1e1e;
 	}
 }

package/src/logo-generator/components/generator-modal.scss

@@ -1,4 +1,4 @@
-@use '@automattic/jetpack-base-styles/root-variables';
+@use "@automattic/jetpack-base-styles/root-variables";
 
 .jetpack-ai-logo-generator-modal {
 

package/src/logo-generator/components/history-carousel.scss

@@ -1,4 +1,4 @@
-@use '@automattic/jetpack-base-styles/root-variables';
+@use "@automattic/jetpack-base-styles/root-variables";
 
 .jetpack-ai-logo-generator__carousel {
 	display: flex;

package/src/logo-generator/components/logo-presenter.scss

@@ -1,4 +1,4 @@
-@use '@automattic/jetpack-base-styles/root-variables';
+@use "@automattic/jetpack-base-styles/root-variables";
 
 .jetpack-ai-logo-generator-modal-presenter__wrapper {
 	display: flex;

package/src/logo-generator/components/prompt.scss

@@ -1,4 +1,4 @@
-@use '@automattic/jetpack-base-styles/root-variables';
+@use "@automattic/jetpack-base-styles/root-variables";
 
 .jetpack-ai-logo-generator__prompt {
 	display: flex;

package/src/logo-generator/components/prompt.tsx

@@ -307,7 +307,7 @@ export const Prompt = ( { initialPrompt = '' }: PromptProps ) => {
 									target="_blank"
 									onClick={ onUpgradeClick }
 								>
-									{ __( 'Upgrade', 'jetpack-ai-client' ) }
+									<span>{ __( 'Upgrade', 'jetpack-ai-client' ) }</span>
 								</Button>
 							</>
 						) }

package/src/logo-generator/components/upgrade-nudge.scss

@@ -1,4 +1,4 @@
-@use '@automattic/jetpack-base-styles/root-variables';
+@use "@automattic/jetpack-base-styles/root-variables";
 
 .jetpack-upgrade-plan-banner .jetpack-upgrade-plan-banner__wrapper {
 	display: flex;

package/src/logo-generator/components/upgrade-nudge.tsx

@@ -50,7 +50,7 @@ export const UpgradeNudge = () => {
 					className="is-primary"
 					onClick={ handleUpgradeClick }
 				>
-					{ buttonText }
+					<span>{ buttonText }</span>
 				</Button>
 			</div>
 		</div>

package/src/logo-generator/components/upgrade-screen.tsx

@@ -52,12 +52,12 @@ export const UpgradeScreen: FC< {
 				</span>
 				&nbsp;
 				<Button variant="link" href={ upgradeInfoUrl } target="_blank">
-					{ __( 'Learn more about Jetpack AI.', 'jetpack-ai-client' ) }
+					<span>{ __( 'Learn more about Jetpack AI.', 'jetpack-ai-client' ) }</span>
 				</Button>
 			</div>
 			<div className="jetpack-ai-logo-generator-modal__notice-actions">
 				<Button variant="tertiary" onClick={ onCancel }>
-					{ __( 'Cancel', 'jetpack-ai-client' ) }
+					<span>{ __( 'Cancel', 'jetpack-ai-client' ) }</span>
 				</Button>
 				<Button
 					variant="primary"
@@ -65,7 +65,7 @@ export const UpgradeScreen: FC< {
 					target="_blank"
 					onClick={ handleUpgradeClick }
 				>
-					{ __( 'Upgrade', 'jetpack-ai-client' ) }
+					<span>{ __( 'Upgrade', 'jetpack-ai-client' ) }</span>
 				</Button>
 			</div>
 		</div>

package/src/logo-generator/components/visit-site-banner.scss

@@ -1,4 +1,4 @@
-@use '@automattic/jetpack-base-styles/root-variables';
+@use "@automattic/jetpack-base-styles/root-variables";
 
 .jetpack-ai-logo-generator-modal-visit-site-banner {
 	border-radius: 4px;

package/src/logo-generator/components/visit-site-banner.tsx

@@ -44,7 +44,7 @@ export const VisitSiteBanner: FC< {
 						target="_blank"
 						onClick={ onVisitBlankTarget ? onVisitBlankTarget : null }
 					>
-						{ __( 'Learn more about Jetpack AI', 'jetpack-ai-client' ) }
+						<span>{ __( 'Learn more about Jetpack AI', 'jetpack-ai-client' ) }</span>
 						<Icon icon={ external } size={ 20 } />
 					</Button>
 				</div>

package/src/logo-generator/hooks/use-fair-usage-notice-message.tsx

@@ -33,7 +33,7 @@ const useFairUsageNoticeMessage = (): Element => {
 
 	const getFairUsageNoticeMessage = resetDateString => {
 		const fairUsageMessage = __(
-			"You've reached this month's request limit, per our <link>fair usage policy</link>.",
+			"You've reached this month's request limit, per our <link><span>fair usage policy</span></link>.",
 			'jetpack-ai-client'
 		);
 
@@ -59,6 +59,7 @@ const useFairUsageNoticeMessage = (): Element => {
 
 	const fairUsageNoticeMessageElement = createInterpolateElement( fairUsageNoticeMessage, {
 		link: <a href={ upgradeInfoUrl } target="_blank" rel="noreferrer" />,
+		span: <span />,
 	} );
 
 	return fairUsageNoticeMessageElement;