diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index d22383b48e89..30b82b42ce89 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -216,6 +216,9 @@ importers: '@wordpress/primitives': specifier: 4.44.0 version: 4.44.0(react@18.3.1) + '@wordpress/ui': + specifier: 0.11.0 + version: 0.11.0(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@wordpress/url': specifier: 4.44.0 version: 4.44.0 @@ -723,6 +726,9 @@ importers: '@wordpress/icons': specifier: 12.2.0 version: 12.2.0(react@18.3.1) + '@wordpress/ui': + specifier: 0.11.0 + version: 0.11.0(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@wordpress/url': specifier: 4.44.0 version: 4.44.0 @@ -1093,6 +1099,9 @@ importers: '@wordpress/icons': specifier: 12.2.0 version: 12.2.0(react@18.3.1) + '@wordpress/ui': + specifier: 0.11.0 + version: 0.11.0(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) clsx: specifier: 2.1.1 version: 2.1.1 @@ -1443,6 +1452,9 @@ importers: '@wordpress/primitives': specifier: 4.44.0 version: 4.44.0(react@18.3.1) + '@wordpress/ui': + specifier: 0.11.0 + version: 0.11.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@wordpress/url': specifier: 4.44.0 version: 4.44.0 @@ -1869,6 +1881,9 @@ importers: '@wordpress/icons': specifier: 12.2.0 version: 12.2.0(react@18.3.1) + '@wordpress/ui': + specifier: 0.11.0 + version: 0.11.0(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@wordpress/url': specifier: 4.44.0 version: 4.44.0 @@ -2030,6 +2045,9 @@ importers: '@wordpress/icons': specifier: 12.2.0 version: 12.2.0(react@18.3.1) + '@wordpress/ui': + specifier: 0.11.0 + version: 0.11.0(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) moment: specifier: 2.30.1 version: 2.30.1 @@ -2912,6 +2930,9 @@ importers: '@wordpress/sync': specifier: 1.44.0 version: 1.44.0 + '@wordpress/ui': + specifier: 0.11.0 + version: 0.11.0(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@wordpress/url': specifier: 4.44.0 version: 4.44.0 @@ -3445,6 +3466,9 @@ importers: '@wordpress/i18n': specifier: 6.17.0 version: 6.17.0 + '@wordpress/ui': + specifier: 0.11.0 + version: 0.11.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@wordpress/widgets': specifier: 4.44.0 version: 4.44.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -4609,6 +4633,9 @@ importers: '@wordpress/plugins': specifier: 7.44.0 version: 7.44.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@wordpress/ui': + specifier: 0.11.0 + version: 0.11.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1) gridicons: specifier: 3.4.2 version: 3.4.2(react@18.3.1) @@ -4676,6 +4703,9 @@ importers: '@wordpress/i18n': specifier: 6.17.0 version: 6.17.0 + '@wordpress/ui': + specifier: 0.11.0 + version: 0.11.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1) clsx: specifier: 2.1.1 version: 2.1.1 @@ -6209,8 +6239,8 @@ importers: specifier: 7.0.0-dev.20260225.1 version: 7.0.0-dev.20260225.1 '@wordpress/eslint-plugin': - specifier: 25.0.0 - version: 25.0.0(@babel/core@7.29.0)(eslint-config-prettier@10.1.8(eslint@9.39.4))(eslint-plugin-import@2.32.0)(eslint-plugin-jest@29.15.0(eslint@9.39.4)(jest@30.3.0)(typescript@5.9.3))(eslint-plugin-jsdoc@62.8.0(eslint@9.39.4))(eslint-plugin-jsx-a11y@6.10.2(eslint@9.39.4))(eslint-plugin-playwright@2.10.0(eslint@9.39.4))(eslint-plugin-prettier@5.5.5(eslint-config-prettier@10.1.8(eslint@9.39.4))(eslint@9.39.4)(wp-prettier@3.0.3))(eslint-plugin-react-hooks@7.0.1(eslint@9.39.4))(eslint-plugin-react@7.37.5(eslint@9.39.4))(eslint@9.39.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(stylelint@17.7.0(typescript@5.9.3))(typescript@5.9.3)(wp-prettier@3.0.3) + specifier: 25.1.0 + version: 25.1.0(@babel/core@7.29.0)(eslint-config-prettier@10.1.8(eslint@9.39.4))(eslint-plugin-import@2.32.0)(eslint-plugin-jest@29.15.0(eslint@9.39.4)(jest@30.3.0)(typescript@5.9.3))(eslint-plugin-jsdoc@62.8.0(eslint@9.39.4))(eslint-plugin-jsx-a11y@6.10.2(eslint@9.39.4))(eslint-plugin-playwright@2.10.0(eslint@9.39.4))(eslint-plugin-prettier@5.5.5(eslint-config-prettier@10.1.8(eslint@9.39.4))(eslint@9.39.4)(wp-prettier@3.0.3))(eslint-plugin-react-hooks@7.0.1(eslint@9.39.4))(eslint-plugin-react@7.37.5(eslint@9.39.4))(eslint@9.39.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(stylelint@17.7.0(typescript@5.9.3))(typescript@5.9.3)(wp-prettier@3.0.3) '@wordpress/jest-console': specifier: 8.44.0 version: 8.44.0(jest@30.3.0) @@ -10154,6 +10184,7 @@ packages: '@ungap/structured-clone@1.3.0': resolution: {integrity: sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==} + deprecated: Potential CWE-502 - Update to 1.3.1 or higher '@unrs/resolver-binding-android-arm-eabi@1.11.1': resolution: {integrity: sha512-ppLRUgHVaGRWUx0R0Ut06Mjo9gBaBkg3v/8AxusGLhsIotbBLuRk51rAzqLC8gq6NyyAojEXglNjzf6R948DNw==} @@ -10550,8 +10581,8 @@ packages: peerDependencies: '@babel/core': ^7.25.7 - '@wordpress/babel-preset-default@8.44.0': - resolution: {integrity: sha512-6EQW8ysiQkct2MolHlhyqXfZ/Vgl0Cu9dCeHfPEf7S/8575qua1GnuDSFzEqU/8TIrEG88f2e2qP/R7VRB+EwQ==} + '@wordpress/babel-preset-default@8.45.0': + resolution: {integrity: sha512-xlrFFf8bsVDpOjzDW4dwkY8w040YupOIeRSVPB1FJyHBae8ObR+p2siM6E8/DrLNuDznudYoUFRnojYQ16ImjQ==} engines: {node: '>=18.12.0', npm: '>=8.19.2'} '@wordpress/base-styles@6.20.0': @@ -10597,6 +10628,10 @@ packages: resolution: {integrity: sha512-lYtkO7U7ok9RfRBIHWvVWXhcOys6cQuLfwFr1bGuPTE6+LmVHmRyniMnImZlG8Jb3XE4pvH8gXT1ecXogpDI2Q==} engines: {node: '>=18.12.0', npm: '>=8.19.2'} + '@wordpress/browserslist-config@6.45.0': + resolution: {integrity: sha512-iSRD/0bxD9PUHWssZN1zZa+xZ2E9FtpgNYKeceTPLKV3rd+rRPqI1h2a2iHboLzex80c1vaxe6eQ9kyZQfGtiA==} + engines: {node: '>=18.12.0', npm: '>=8.19.2'} + '@wordpress/build@0.13.0': resolution: {integrity: sha512-a442H7Kh1hW1b9UH8DZzqLaxYAspe84/dWDRyep1R3YZFx2TcMCBs1tAF96xzvli5pN83PAN/gscv2DfNYBHyw==} engines: {node: '>=20.10.0', npm: '>=10.2.3'} @@ -10738,8 +10773,8 @@ packages: resolution: {integrity: sha512-IW4mnA+65XKhABuBkwrQNAlbq97luC6ZIBfdSq0Tkq+AFPqE1lJTMlLo7iBkTpsHsBLyznViPXultq40fz8L7w==} engines: {node: '>=18.12.0', npm: '>=8.19.2'} - '@wordpress/eslint-plugin@25.0.0': - resolution: {integrity: sha512-GYOPtbsibtFWmvFHm4ZBKUM16SREBcvpVHUuQLfh2s/CQtTP9kbC25XHmIdp0by77i2FDFvEtVGHo7aswoiRCA==} + '@wordpress/eslint-plugin@25.1.0': + resolution: {integrity: sha512-tZVfrpAZoUNQ2A03XA8nVgfejb5lINPZUvbZcg8ZlTB4Bf58daLx5XOw3zIH4ubdS+t4paRslgrdnbCCpqX4Zg==} engines: {node: '>=18.12.0', npm: '>=8.19.2'} peerDependencies: '@babel/core': '>=7' @@ -10934,8 +10969,8 @@ packages: react: ^18.0.0 react-dom: ^18.0.0 - '@wordpress/prettier-config@4.44.0': - resolution: {integrity: sha512-RT8Pc/dGOhMM9PwCsPamhkpIYx6zjTUDBIs/huVYKusByXImXQFoeZmaI3nK/UNus55woW6xyNNWdb2/nvvXgw==} + '@wordpress/prettier-config@4.45.0': + resolution: {integrity: sha512-Tj8wdH/+uwFOYbyhaQKrfe9WjtCnmGEoOi2i5zQ5KF3NgrdYgfv7ADMnd/fMW2vffxWAZvGjelvH1jybhY6XJA==} engines: {node: '>=18.12.0', npm: '>=8.19.2'} peerDependencies: prettier: '>=3' @@ -11106,6 +11141,10 @@ packages: resolution: {integrity: sha512-avxdbIYhDuUh2qi2oiq7KeqYOVv2RubqV8UI/Q7bctZSFSXJE8RQGSR/W2YjABeyWBIjlyX/U5lOxVs2PIfy/w==} engines: {node: '>=18.12.0', npm: '>=8.19.2'} + '@wordpress/warning@3.45.0': + resolution: {integrity: sha512-NQ9tAhPdwhfceVIzWra1rbumvgAFAEDTgZlWsX880zLiq1F8JTwBouwW6wfIhA3XLcY6Yj7cBBYLa8vnNiDZDw==} + engines: {node: '>=18.12.0', npm: '>=8.19.2'} + '@wordpress/widgets@4.44.0': resolution: {integrity: sha512-wYTWr6/CBip7ZMNwwiV/UyB5mi7W4wR8IU8HcZKwxg/H+Nmwb8MKnVurmAKuxHZvbsmlzLVuBLDqzA5yL1XfmQ==} engines: {node: '>=18.12.0', npm: '>=8.19.2'} @@ -23440,7 +23479,7 @@ snapshots: dependencies: '@babel/core': 7.29.0 - '@wordpress/babel-preset-default@8.44.0': + '@wordpress/babel-preset-default@8.45.0': dependencies: '@babel/core': 7.29.0 '@babel/plugin-syntax-import-attributes': 7.28.6(@babel/core@7.29.0) @@ -23448,8 +23487,8 @@ snapshots: '@babel/plugin-transform-runtime': 7.29.0(@babel/core@7.29.0) '@babel/preset-env': 7.29.2(@babel/core@7.29.0) '@babel/preset-typescript': 7.28.5(@babel/core@7.29.0) - '@wordpress/browserslist-config': 6.44.0 - '@wordpress/warning': 3.44.0 + '@wordpress/browserslist-config': 6.45.0 + '@wordpress/warning': 3.45.0 browserslist: 4.28.2 core-js: 3.38.1 react: 18.3.1 @@ -23919,6 +23958,8 @@ snapshots: '@wordpress/browserslist-config@6.44.0': {} + '@wordpress/browserslist-config@6.45.0': {} + '@wordpress/build@0.13.0(@babel/core@7.29.0)(@wordpress/boot@0.11.0(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@wordpress/route@0.10.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@wordpress/theme@0.11.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(browserslist@4.28.2)': dependencies: '@emotion/babel-plugin': 11.13.5 @@ -24797,15 +24838,15 @@ snapshots: '@wordpress/escape-html@3.45.0': {} - '@wordpress/eslint-plugin@25.0.0(@babel/core@7.29.0)(eslint-config-prettier@10.1.8(eslint@9.39.4))(eslint-plugin-import@2.32.0)(eslint-plugin-jest@29.15.0(eslint@9.39.4)(jest@30.3.0)(typescript@5.9.3))(eslint-plugin-jsdoc@62.8.0(eslint@9.39.4))(eslint-plugin-jsx-a11y@6.10.2(eslint@9.39.4))(eslint-plugin-playwright@2.10.0(eslint@9.39.4))(eslint-plugin-prettier@5.5.5(eslint-config-prettier@10.1.8(eslint@9.39.4))(eslint@9.39.4)(wp-prettier@3.0.3))(eslint-plugin-react-hooks@7.0.1(eslint@9.39.4))(eslint-plugin-react@7.37.5(eslint@9.39.4))(eslint@9.39.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(stylelint@17.7.0(typescript@5.9.3))(typescript@5.9.3)(wp-prettier@3.0.3)': + '@wordpress/eslint-plugin@25.1.0(@babel/core@7.29.0)(eslint-config-prettier@10.1.8(eslint@9.39.4))(eslint-plugin-import@2.32.0)(eslint-plugin-jest@29.15.0(eslint@9.39.4)(jest@30.3.0)(typescript@5.9.3))(eslint-plugin-jsdoc@62.8.0(eslint@9.39.4))(eslint-plugin-jsx-a11y@6.10.2(eslint@9.39.4))(eslint-plugin-playwright@2.10.0(eslint@9.39.4))(eslint-plugin-prettier@5.5.5(eslint-config-prettier@10.1.8(eslint@9.39.4))(eslint@9.39.4)(wp-prettier@3.0.3))(eslint-plugin-react-hooks@7.0.1(eslint@9.39.4))(eslint-plugin-react@7.37.5(eslint@9.39.4))(eslint@9.39.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(stylelint@17.7.0(typescript@5.9.3))(typescript@5.9.3)(wp-prettier@3.0.3)': dependencies: '@babel/core': 7.29.0 '@babel/eslint-parser': 7.28.6(@babel/core@7.29.0)(eslint@9.39.4) '@eslint-community/eslint-plugin-eslint-comments': 4.7.1(eslint@9.39.4) '@eslint/compat': 2.0.3(eslint@9.39.4) - '@wordpress/babel-preset-default': 8.44.0 - '@wordpress/prettier-config': 4.44.0(wp-prettier@3.0.3) - '@wordpress/theme': 0.11.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(stylelint@17.7.0(typescript@5.9.3)) + '@wordpress/babel-preset-default': 8.45.0 + '@wordpress/prettier-config': 4.45.0(wp-prettier@3.0.3) + '@wordpress/theme': 0.12.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(stylelint@17.7.0(typescript@5.9.3)) cosmiconfig: 7.1.0 eslint: 9.39.4 eslint-config-prettier: 10.1.8(eslint@9.39.4) @@ -25579,7 +25620,7 @@ snapshots: - '@emotion/is-prop-valid' - supports-color - '@wordpress/prettier-config@4.44.0(wp-prettier@3.0.3)': + '@wordpress/prettier-config@4.45.0(wp-prettier@3.0.3)': dependencies: prettier: wp-prettier@3.0.3 @@ -25803,6 +25844,17 @@ snapshots: react: 18.3.1 react-dom: 18.3.1(react@18.3.1) + '@wordpress/theme@0.12.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(stylelint@17.7.0(typescript@5.9.3))': + dependencies: + '@wordpress/element': 6.45.0 + '@wordpress/private-apis': 1.45.0 + colorjs.io: 0.6.1 + memize: 2.1.1 + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + optionalDependencies: + stylelint: 17.7.0(typescript@5.9.3) + '@wordpress/token-list@3.44.0': {} '@wordpress/ui@0.11.0(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': @@ -25969,6 +26021,8 @@ snapshots: '@wordpress/warning@3.44.0': {} + '@wordpress/warning@3.45.0': {} + '@wordpress/widgets@4.44.0(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@wordpress/api-fetch': 7.44.0 diff --git a/projects/js-packages/ai-client/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/js-packages/ai-client/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/js-packages/ai-client/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/js-packages/ai-client/package.json b/projects/js-packages/ai-client/package.json index a5cae544559e..1508d9f5a6b9 100644 --- a/projects/js-packages/ai-client/package.json +++ b/projects/js-packages/ai-client/package.json @@ -56,6 +56,7 @@ "@wordpress/i18n": "6.17.0", "@wordpress/icons": "12.2.0", "@wordpress/primitives": "4.44.0", + "@wordpress/ui": "0.11.0", "@wordpress/url": "4.44.0", "clsx": "2.1.1", "debug": "4.4.3", diff --git a/projects/js-packages/ai-client/src/components/message/index.tsx b/projects/js-packages/ai-client/src/components/message/index.tsx index 88afb88bc1da..c72682ca6e3b 100644 --- a/projects/js-packages/ai-client/src/components/message/index.tsx +++ b/projects/js-packages/ai-client/src/components/message/index.tsx @@ -1,10 +1,11 @@ /** * External dependencies */ -import { ExternalLink, Button } from '@wordpress/components'; +import { Button } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, sprintf } from '@wordpress/i18n'; import { Icon, check } from '@wordpress/icons'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; /** * Internal dependencies @@ -126,9 +127,9 @@ export default function Message( { */ function LearnMoreLink(): ReactElement { return ( - + { __( 'Learn more', 'jetpack-ai-client' ) } - + ); } @@ -169,7 +170,8 @@ export function FairUsageLimitMessage(): ReactElement { ); const element = createInterpolateElement( message, { link: ( - diff --git a/projects/js-packages/components/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/js-packages/components/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/js-packages/components/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/js-packages/components/components/jetpack-footer/index.tsx b/projects/js-packages/components/components/jetpack-footer/index.tsx index 4a849554f323..bec370f6f4e3 100644 --- a/projects/js-packages/components/components/jetpack-footer/index.tsx +++ b/projects/js-packages/components/components/jetpack-footer/index.tsx @@ -69,12 +69,12 @@ const JetpackFooter: FC< JetpackFooterProps > = ( { className, menu, ...otherPro return (
  • } /> } + render={ } tone="neutral" variant="default" role={ item.role } @@ -84,7 +84,6 @@ const JetpackFooter: FC< JetpackFooterProps > = ( { className, menu, ...otherPro /> ) : ( } /> } tone="neutral" variant="default" href={ item.href || '' } diff --git a/projects/js-packages/components/components/jetpack-footer/test/__snapshots__/component.tsx.snap b/projects/js-packages/components/components/jetpack-footer/test/__snapshots__/component.tsx.snap index cd7a0fe23a2f..d9c1174a464b 100644 --- a/projects/js-packages/components/components/jetpack-footer/test/__snapshots__/component.tsx.snap +++ b/projects/js-packages/components/components/jetpack-footer/test/__snapshots__/component.tsx.snap @@ -45,7 +45,7 @@ exports[`JetpackFooter Render the component should match the snapshot: all props >
  • @@ -54,7 +54,7 @@ exports[`JetpackFooter Render the component should match the snapshot: all props
  • @@ -63,7 +63,7 @@ exports[`JetpackFooter Render the component should match the snapshot: all props
  • @@ -72,7 +72,7 @@ exports[`JetpackFooter Render the component should match the snapshot: all props
  • diff --git a/projects/js-packages/components/components/notice/stories/index.stories.jsx b/projects/js-packages/components/components/notice/stories/index.stories.jsx index fab7495604af..35df35f4d4a2 100644 --- a/projects/js-packages/components/components/notice/stories/index.stories.jsx +++ b/projects/js-packages/components/components/notice/stories/index.stories.jsx @@ -1,5 +1,5 @@ /* eslint-disable no-alert -- ok for demo */ -import { ExternalLink } from '@wordpress/components'; +import { Link } from '@wordpress/ui'; import Button from '../../button/index.tsx'; import Notice from '../index.tsx'; @@ -34,9 +34,9 @@ _default.args = { , - + Learn more - , + , ], hideCloseButton: false, }; @@ -54,9 +54,9 @@ Warning.args = { , - + Learn more - , + , ], hideCloseButton: false, }; @@ -83,9 +83,9 @@ Error.args = { 'We were unable to remove the eels from your hovercraft. Please contact the authorities, as the eels are armed and dangerous.', onClose: () => alert( 'Close clicked' ), actions: [ - + Learn more - , + , ], hideCloseButton: false, }; diff --git a/projects/js-packages/components/components/terms-of-service/index.tsx b/projects/js-packages/components/components/terms-of-service/index.tsx index 08dffb4fedf6..6a57146597cb 100644 --- a/projects/js-packages/components/components/terms-of-service/index.tsx +++ b/projects/js-packages/components/components/terms-of-service/index.tsx @@ -1,6 +1,6 @@ -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import { getRedirectUrl } from '../../index.ts'; import Text from '../text/index.tsx'; @@ -46,8 +46,8 @@ const MultipleButtonsText = ( { multipleButtonsLabels } ) => { ), { strong: , - tosLink: , - shareDetailsLink: , + tosLink: , + shareDetailsLink: , } ); } @@ -58,8 +58,8 @@ const MultipleButtonsText = ( { multipleButtonsLabels } ) => { 'jetpack-components' ), { - tosLink: , - shareDetailsLink: , + tosLink: , + shareDetailsLink: , } ); }; @@ -76,8 +76,8 @@ const SingleButtonText = ( { agreeButtonLabel } ) => ), { strong: , - tosLink: , - shareDetailsLink: , + tosLink: , + shareDetailsLink: , } ); @@ -88,15 +88,15 @@ const TermsOfServiceTextOnly = () => 'jetpack-components' ), { - tosLink: , - shareDetailsLink: , + tosLink: , + shareDetailsLink: , } ); -const Link: FC< { slug: string; children?: ReactNode } > = ( { slug, children } ) => ( - +const TosLink: FC< { slug: string; children?: ReactNode } > = ( { slug, children } ) => ( + { children } - + ); export default TermsOfService; diff --git a/projects/js-packages/connection/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/js-packages/connection/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/js-packages/connection/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/js-packages/connection/components/disconnect-dialog/steps/step-disconnect.jsx b/projects/js-packages/connection/components/disconnect-dialog/steps/step-disconnect.jsx index 8bea153f3ee4..353ada4c47d4 100644 --- a/projects/js-packages/connection/components/disconnect-dialog/steps/step-disconnect.jsx +++ b/projects/js-packages/connection/components/disconnect-dialog/steps/step-disconnect.jsx @@ -1,7 +1,8 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; -import { Button, ExternalLink } from '@wordpress/components'; +import { Button } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import PropTypes from 'prop-types'; import { Fragment, useCallback, useEffect } from 'react'; import ConnectedPlugins from '../../connected-plugins'; @@ -132,7 +133,6 @@ const StepDisconnect = props => { { disconnectStepComponent } { renderFallbackOutput() } - diff --git a/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/salesforce.tsx b/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/salesforce.tsx index 5370b569d0c7..92fa618f2464 100644 --- a/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/salesforce.tsx +++ b/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/salesforce.tsx @@ -1,6 +1,6 @@ -import { BaseControl, ExternalLink, TextControl } from '@wordpress/components'; +import { BaseControl, TextControl } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; -import { Badge } from '@wordpress/ui'; +import { Badge, Link } from '@wordpress/ui'; import SalesforceIcon from '../../../../../icons/salesforce.tsx'; import HelpMessage from '../../help-message/index.jsx'; import CreateSalesforceLeadFormButton from '../components/create-salesforce-lead-form-button.tsx'; @@ -82,9 +82,9 @@ export function buildSalesforceCard( { ) }

    - + { __( 'Where to find your Salesforce Organization ID', 'jetpack-forms' ) } - +

    { __( diff --git a/projects/packages/forms/src/blocks/contact-form/components/notifications-settings.js b/projects/packages/forms/src/blocks/contact-form/components/notifications-settings.js index b9824ea4fae8..5345aeb6eed5 100644 --- a/projects/packages/forms/src/blocks/contact-form/components/notifications-settings.js +++ b/projects/packages/forms/src/blocks/contact-form/components/notifications-settings.js @@ -1,11 +1,12 @@ import { isWpcomPlatformSite } from '@automattic/jetpack-script-data'; import { WpcomSupportLink } from '@automattic/jetpack-shared-extension-utils/components'; -import { FormTokenField, ToggleControl, ExternalLink } from '@wordpress/components'; +import { FormTokenField, ToggleControl } from '@wordpress/components'; import { store as coreStore } from '@wordpress/core-data'; import { useSelect } from '@wordpress/data'; import { store as editorStore } from '@wordpress/editor'; import { useState, createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import JetpackEmailConnectionSettings from './jetpack-email-connection-settings.js'; const NotificationsSettings = ( { @@ -84,7 +85,7 @@ const NotificationsSettings = ( { pushNotificationsLink: isWpcom ? ( ) : ( - + ), } ) } diff --git a/projects/packages/forms/src/blocks/contact-form/edit.tsx b/projects/packages/forms/src/blocks/contact-form/edit.tsx index 1e64c073cdd7..9acdf1a0d2a1 100644 --- a/projects/packages/forms/src/blocks/contact-form/edit.tsx +++ b/projects/packages/forms/src/blocks/contact-form/edit.tsx @@ -16,7 +16,6 @@ import { } from '@wordpress/block-editor'; import { createBlock } from '@wordpress/blocks'; import { - ExternalLink, Notice, PanelBody, TextareaControl, @@ -30,6 +29,7 @@ import { useSelect, useDispatch } from '@wordpress/data'; import { store as editorStore } from '@wordpress/editor'; import { useRef, useEffect, useCallback, lazy, Suspense, useState } from '@wordpress/element'; import { __, _x } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; /* * Internal dependencies @@ -63,6 +63,7 @@ import { useSyncedForm } from './hooks/use-synced-form.ts'; import useFormBlockDefaults from './shared/hooks/use-form-block-defaults.js'; import { getEditorContext } from './util/get-editor-context.ts'; import VariationPicker from './variation-picker.js'; + import './util/form-styles.js'; const IntegrationControls = lazy( () => import( './components/jetpack-integration-controls.js' ) ); @@ -1248,9 +1249,9 @@ function JetpackContactFormEdit( { __next40pxDefaultSize={ true } />

    - + { __( 'Read more.', 'jetpack-forms' ) } - +

    { 'jetpack-forms' ), { - moreInfoLink: , + moreInfoLink: , } ); diff --git a/projects/packages/forms/src/dashboard/components/inspector/response-fields/field-file/file.tsx b/projects/packages/forms/src/dashboard/components/inspector/response-fields/field-file/file.tsx index bef7c8406a8b..92730508304a 100644 --- a/projects/packages/forms/src/dashboard/components/inspector/response-fields/field-file/file.tsx +++ b/projects/packages/forms/src/dashboard/components/inspector/response-fields/field-file/file.tsx @@ -1,10 +1,11 @@ /** * External dependencies */ -import { Button, ExternalLink, Icon, Tooltip } from '@wordpress/components'; +import { Button, Icon, Tooltip } from '@wordpress/components'; import { decodeEntities } from '@wordpress/html-entities'; import { __, sprintf } from '@wordpress/i18n'; import { download } from '@wordpress/icons'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; /** * Internal dependencies @@ -70,9 +71,9 @@ const FieldFile = ( { file, onClick } ) => { ) } { ! file.is_previewable && ( - + { decodeEntities( file.name ) } - + ) }
    { sprintf( diff --git a/projects/packages/forms/src/dashboard/components/inspector/response-fields/field-preview/index.tsx b/projects/packages/forms/src/dashboard/components/inspector/response-fields/field-preview/index.tsx index 31c65daad9da..7423321e4051 100644 --- a/projects/packages/forms/src/dashboard/components/inspector/response-fields/field-preview/index.tsx +++ b/projects/packages/forms/src/dashboard/components/inspector/response-fields/field-preview/index.tsx @@ -3,12 +3,11 @@ */ import { formatNumber } from '@automattic/number-formatters'; import { - ExternalLink, Icon, __experimentalHStack as HStack, // eslint-disable-line @wordpress/no-unsafe-wp-apis __experimentalVStack as VStack, // eslint-disable-line @wordpress/no-unsafe-wp-apis } from '@wordpress/components'; -import { Badge } from '@wordpress/ui'; +import { Badge, Link } from '@wordpress/ui'; /** * Internal dependencies */ @@ -107,7 +106,11 @@ const FieldPreview = ( { field, onFilePreview }: FieldPreviewProps ) => { } if ( fieldType === 'url' && /^https?:\/\//.test( stringValue ) ) { - return { stringValue }; + return ( + + { stringValue } + + ); } if ( fieldType === 'rating' ) { diff --git a/projects/packages/forms/src/dashboard/components/inspector/response-meta/index.tsx b/projects/packages/forms/src/dashboard/components/inspector/response-meta/index.tsx index a9afe5f93dd0..93d44ab19fb3 100644 --- a/projects/packages/forms/src/dashboard/components/inspector/response-meta/index.tsx +++ b/projects/packages/forms/src/dashboard/components/inspector/response-meta/index.tsx @@ -2,7 +2,6 @@ * External dependencies */ import { - ExternalLink, Tooltip, __experimentalText as Text, // eslint-disable-line @wordpress/no-unsafe-wp-apis __experimentalHStack as HStack, // eslint-disable-line @wordpress/no-unsafe-wp-apis @@ -11,7 +10,7 @@ import { import { dateI18n, getSettings as getDateSettings } from '@wordpress/date'; import { decodeEntities } from '@wordpress/html-entities'; import { __ } from '@wordpress/i18n'; -import { Badge } from '@wordpress/ui'; +import { Badge, Link } from '@wordpress/ui'; /** * Internal dependencies */ @@ -42,16 +41,20 @@ const SourceCell = ( { response }: { response: FormResponse } ) => { if ( response.is_test ) { const label = __( 'Form preview', 'jetpack-forms' ); if ( response.preview_url ) { - return { label }; + return ( + + { label } + + ); } return <>{ label }; } if ( response.entry_permalink ) { return ( - + { decodeEntities( response.entry_title ) || getPath( response ) } - + ); } @@ -155,13 +158,14 @@ const ResponseMeta = ( { response }: ResponseMetaProps ): import('react').JSX.El - { response.ip } - + diff --git a/projects/packages/forms/src/dashboard/components/text-with-flag/index.tsx b/projects/packages/forms/src/dashboard/components/text-with-flag/index.tsx index fcd4afe4b09c..f08fd13f6238 100644 --- a/projects/packages/forms/src/dashboard/components/text-with-flag/index.tsx +++ b/projects/packages/forms/src/dashboard/components/text-with-flag/index.tsx @@ -41,7 +41,7 @@ function getFlagEmoji( countryCode: string ): string { * @param {TextWithFlagProps} props - The component props. * @param {string|undefined} props.countryCode - Two-letter ISO 3166-1 alpha-2 country code (e.g., "US") or undefined if unknown. * @param {boolean} props.fallbackIcon - Whether to display a fallback icon if the country code is not provided. - * @param {React.ReactNode} props.children - The text content to display after the flag. Can be a string or React elements (e.g., Tooltip, ExternalLink). + * @param {React.ReactNode} props.children - The text content to display after the flag. Can be a string or React elements (e.g., Tooltip, Link). * @return {JSX.Element} The TextWithFlag component */ export default function TextWithFlag( { diff --git a/projects/packages/forms/src/dashboard/inbox/stage/index.js b/projects/packages/forms/src/dashboard/inbox/stage/index.js index 69db168f9d2b..44c3a86e46b0 100644 --- a/projects/packages/forms/src/dashboard/inbox/stage/index.js +++ b/projects/packages/forms/src/dashboard/inbox/stage/index.js @@ -4,7 +4,7 @@ import jetpackAnalytics from '@automattic/jetpack-analytics'; import { JetpackLogo } from '@automattic/jetpack-components'; import { isSimpleSite } from '@automattic/jetpack-script-data'; -import { ExternalLink, Modal } from '@wordpress/components'; +import { Modal } from '@wordpress/components'; import { useViewportMatch } from '@wordpress/compose'; import { useSelect } from '@wordpress/data'; import { DataViews } from '@wordpress/dataviews/wp'; @@ -12,7 +12,7 @@ import { dateI18n, getSettings as getDateSettings } from '@wordpress/date'; import { useCallback, useMemo, useState } from '@wordpress/element'; import { decodeEntities } from '@wordpress/html-entities'; import { __ } from '@wordpress/i18n'; -import { Badge } from '@wordpress/ui'; +import { Badge, Link } from '@wordpress/ui'; import clsx from 'clsx'; import { useEffect } from 'react'; /** @@ -362,9 +362,9 @@ export default function InboxView( { parentId, pageTitle, pageSubtitle } = {} ) const previewLabel = __( 'Form preview', 'jetpack-forms' ); if ( item.preview_url ) { return ( - + { wrapperUnread( item.is_unread, previewLabel ) } - + ); } return wrapperUnread( item.is_unread, previewLabel ); @@ -373,12 +373,12 @@ export default function InboxView( { parentId, pageTitle, pageSubtitle } = {} ) return wrapperUnread( item.is_unread, decodeEntities( item.entry_title ) ); } return ( - + { wrapperUnread( item.is_unread, decodeEntities( item.entry_title ) || getPath( item ) ) } - + ); }, elements: [ diff --git a/projects/packages/forms/tests/js/contact-form/components/notifications-settings.test.js b/projects/packages/forms/tests/js/contact-form/components/notifications-settings.test.js index efd3b06d874a..85bbe763f161 100644 --- a/projects/packages/forms/tests/js/contact-form/components/notifications-settings.test.js +++ b/projects/packages/forms/tests/js/contact-form/components/notifications-settings.test.js @@ -78,15 +78,23 @@ await jest.unstable_mockModule( '@wordpress/components', () => { ); } + return { + ToggleControl: ToggleControlComponent, + FormTokenField: FormTokenFieldComponent, + }; +} ); + +// Mock @wordpress/ui Link +await jest.unstable_mockModule( '@wordpress/ui', () => { /** - * Mock ExternalLink component. + * Mock Link component. * * @param {object} root0 - Component props * @param {string} root0.href - Link URL * @param {*} root0.children - Child elements * @return {object} React element */ - function ExternalLinkComponent( { href, children } ) { + function LinkComponent( { href, children } ) { return ( { children } @@ -94,11 +102,7 @@ await jest.unstable_mockModule( '@wordpress/components', () => { ); } - return { - ToggleControl: ToggleControlComponent, - FormTokenField: FormTokenFieldComponent, - ExternalLink: ExternalLinkComponent, - }; + return { Link: LinkComponent }; } ); // Mock WordPress i18n diff --git a/projects/packages/forms/tools/webpack.config.blocks.js b/projects/packages/forms/tools/webpack.config.blocks.js index 468a9fa19422..6bd4f8be673e 100644 --- a/projects/packages/forms/tools/webpack.config.blocks.js +++ b/projects/packages/forms/tools/webpack.config.blocks.js @@ -67,6 +67,9 @@ const sharedWebpackConfig = { ], } ), + // Workarounds for non-extracted `@wordpress/*` packages. + ...jetpackWebpackConfig.BundledWpPkgsTranspileRules(), + // Handle CSS. jetpackWebpackConfig.CssRule( { extensions: [ 'css', 'sass', 'scss' ], diff --git a/projects/packages/forms/tools/webpack.config.form-editor.js b/projects/packages/forms/tools/webpack.config.form-editor.js index bf716065e427..3af1e78d3585 100644 --- a/projects/packages/forms/tools/webpack.config.form-editor.js +++ b/projects/packages/forms/tools/webpack.config.form-editor.js @@ -54,6 +54,9 @@ export default { includeNodeModules: [ '@automattic/', 'debug/' ], } ), + // Workarounds for non-extracted `@wordpress/*` packages. + ...jetpackWebpackConfig.BundledWpPkgsTranspileRules(), + // Handle CSS. jetpackWebpackConfig.CssRule( { extensions: [ 'css', 'sass', 'scss' ], diff --git a/projects/packages/jetpack-mu-wpcom/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/packages/jetpack-mu-wpcom/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/packages/jetpack-mu-wpcom/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/packages/jetpack-mu-wpcom/package.json b/projects/packages/jetpack-mu-wpcom/package.json index 45d93850f657..24efcd7c89ac 100644 --- a/projects/packages/jetpack-mu-wpcom/package.json +++ b/projects/packages/jetpack-mu-wpcom/package.json @@ -81,6 +81,7 @@ "@wordpress/rich-text": "7.44.0", "@wordpress/router": "^1.8.11", "@wordpress/sync": "1.44.0", + "@wordpress/ui": "0.11.0", "@wordpress/url": "4.44.0", "canvas-confetti": "^1.9.4", "clsx": "2.1.1", diff --git a/projects/packages/jetpack-mu-wpcom/src/features/replace-site-visibility/site-visibility/index.tsx b/projects/packages/jetpack-mu-wpcom/src/features/replace-site-visibility/site-visibility/index.tsx index f8988dc1071b..32eda2ff63ca 100644 --- a/projects/packages/jetpack-mu-wpcom/src/features/replace-site-visibility/site-visibility/index.tsx +++ b/projects/packages/jetpack-mu-wpcom/src/features/replace-site-visibility/site-visibility/index.tsx @@ -1,7 +1,7 @@ import { WpcomSupportLink } from '@automattic/jetpack-shared-extension-utils/components'; -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { sprintf, __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { useState } from 'react'; import { wpcomTrackEvent } from '../../../common/tracks'; import SitePreviewLink from '../site-preview-link'; @@ -176,7 +176,8 @@ const SiteVisibility = ( { strong: , br:
    , link1: ( - @@ -185,7 +186,8 @@ const SiteVisibility = ( { /> ), link2: ( - diff --git a/projects/packages/jetpack-mu-wpcom/webpack.config.js b/projects/packages/jetpack-mu-wpcom/webpack.config.js index 02ea2bf0a897..1c6af9c29676 100644 --- a/projects/packages/jetpack-mu-wpcom/webpack.config.js +++ b/projects/packages/jetpack-mu-wpcom/webpack.config.js @@ -125,6 +125,9 @@ module.exports = async () => { includeNodeModules: [ '@automattic/' ], } ), + // Workarounds for non-extracted `@wordpress/*` packages. + ...jetpackWebpackConfig.BundledWpPkgsTranspileRules(), + // Handle CSS. jetpackWebpackConfig.CssRule( { extensions: [ 'css', 'scss' ], diff --git a/projects/packages/my-jetpack/_inc/components/help-card/index.tsx b/projects/packages/my-jetpack/_inc/components/help-card/index.tsx index 9f4280a22cf2..29a2c0686d13 100644 --- a/projects/packages/my-jetpack/_inc/components/help-card/index.tsx +++ b/projects/packages/my-jetpack/_inc/components/help-card/index.tsx @@ -1,4 +1,4 @@ -import { ExternalLink } from '@wordpress/components'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import styles from './styles.module.scss'; import type { ReactNode } from 'react'; @@ -33,9 +33,9 @@ export function HelpCard( { { icon ?
    { icon }
    : null } { link ? ( - + { title } - + ) : ( title ) } diff --git a/projects/packages/my-jetpack/_inc/components/my-jetpack-tab-panel/help/footer.tsx b/projects/packages/my-jetpack/_inc/components/my-jetpack-tab-panel/help/footer.tsx index b9e8ce6bb449..3dd78daf1e96 100644 --- a/projects/packages/my-jetpack/_inc/components/my-jetpack-tab-panel/help/footer.tsx +++ b/projects/packages/my-jetpack/_inc/components/my-jetpack-tab-panel/help/footer.tsx @@ -1,6 +1,6 @@ import { getAdminUrl } from '@automattic/jetpack-script-data'; -import { ExternalLink } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { useCallback } from 'react'; import styles from './styles.module.scss'; import { useHelpTracking } from './use-help-tracking'; @@ -37,13 +37,14 @@ export function HelpFooter() { 'jetpack-my-jetpack' ) }

    - { __( 'Learn more about us', 'jetpack-my-jetpack' ) } - +
    ) } -
    { isBundleUpsell &&
    { icons }
    } @@ -356,9 +356,9 @@ const ProductDetailCard = ( { productMoniker ) }   - + { __( 'Get plugin', 'jetpack-my-jetpack' ) } - + ) } @@ -416,7 +416,8 @@ const ProductDetailCard = ( { { `${ text } ` } { url && link_text && ( - disclaimerClickHandler( id ) } @@ -425,7 +426,7 @@ const ProductDetailCard = ( { rel="noopener noreferrer" > { link_text } - + ) } ); diff --git a/projects/packages/my-jetpack/_inc/components/product-interstitial/jetpack-ai/product-page.jsx b/projects/packages/my-jetpack/_inc/components/product-interstitial/jetpack-ai/product-page.jsx index 220574c93075..d728f342b606 100644 --- a/projects/packages/my-jetpack/_inc/components/product-interstitial/jetpack-ai/product-page.jsx +++ b/projects/packages/my-jetpack/_inc/components/product-interstitial/jetpack-ai/product-page.jsx @@ -10,10 +10,11 @@ import { getRedirectUrl, Notice, } from '@automattic/jetpack-components'; -import { Button, Card, ExternalLink } from '@wordpress/components'; +import { Button, Card } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, sprintf } from '@wordpress/i18n'; import { Icon, plus, help, check } from '@wordpress/icons'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import debugFactory from 'debug'; import { useCallback, useState, useEffect } from 'react'; @@ -526,9 +527,9 @@ export default function () { 'Help us improving the accuracy of our results and feel free to give us ideas for future implementations and improvements.', 'jetpack-my-jetpack' ) }{ ' ' } - + { __( 'Share your feedback!', 'jetpack-my-jetpack' ) } - +

    diff --git a/projects/packages/my-jetpack/_inc/components/product-interstitial/products/jetpack-ai.tsx b/projects/packages/my-jetpack/_inc/components/product-interstitial/products/jetpack-ai.tsx index 2966babca68d..aa77adc087f1 100644 --- a/projects/packages/my-jetpack/_inc/components/product-interstitial/products/jetpack-ai.tsx +++ b/projects/packages/my-jetpack/_inc/components/product-interstitial/products/jetpack-ai.tsx @@ -1,6 +1,6 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import logo from '../logos/jetpack-ai-logo'; import { ProductConfig } from '../types'; import { getTranslatableFeatureLabels, COMPLETE, COMPLETE_SLUG } from './shared-labels'; @@ -35,9 +35,9 @@ export function getJetpackAiConfig(): ProductConfig { <> { __( 'Monthly usage quota for AI requests.', 'jetpack-my-jetpack' ) }   - + { __( 'Learn more', 'jetpack-my-jetpack' ) } - + ), free: { included: true, label: __( '20 requests', 'jetpack-my-jetpack' ) }, diff --git a/projects/packages/my-jetpack/_inc/components/product-interstitial/protect/product-page.tsx b/projects/packages/my-jetpack/_inc/components/product-interstitial/protect/product-page.tsx index 4e058ddff483..071ad3feac4e 100644 --- a/projects/packages/my-jetpack/_inc/components/product-interstitial/protect/product-page.tsx +++ b/projects/packages/my-jetpack/_inc/components/product-interstitial/protect/product-page.tsx @@ -9,9 +9,10 @@ import { getRedirectUrl, } from '@automattic/jetpack-components'; import { formatNumberCompact } from '@automattic/number-formatters'; -import { Button, Card, ExternalLink } from '@wordpress/components'; +import { Button, Card } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { Icon, check, shield, login } from '@wordpress/icons'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import { useCallback, useEffect } from 'react'; /** @@ -294,12 +295,12 @@ export default function ProtectProductPage() {

    - + { __( 'Learn more about the difference between Protect and Scan', 'jetpack-my-jetpack' ) } - +

    @@ -321,9 +322,9 @@ export default function ProtectProductPage() { - + { __( 'Learn more about Jetpack Security', 'jetpack-my-jetpack' ) } - + diff --git a/projects/packages/my-jetpack/_inc/hooks/use-notification-watcher/get-paid-plan-needs-plugins-content.tsx b/projects/packages/my-jetpack/_inc/hooks/use-notification-watcher/get-paid-plan-needs-plugins-content.tsx index c5a5590bed68..a20b425f290c 100644 --- a/projects/packages/my-jetpack/_inc/hooks/use-notification-watcher/get-paid-plan-needs-plugins-content.tsx +++ b/projects/packages/my-jetpack/_inc/hooks/use-notification-watcher/get-paid-plan-needs-plugins-content.tsx @@ -1,7 +1,7 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, _n, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { useMemo } from 'react'; import { getMyJetpackWindowInitialState } from '../../data/utils/get-my-jetpack-window-state'; @@ -60,7 +60,8 @@ export const useGetPaidPlanNeedsPluginsContent = ( { ), { link: ( - { pluginInfo.pluginName }     ) : ( - + { pluginInfo.pluginName } - + ) } ({ actionNounMap[ pluginInfo.action ] })
    @@ -145,7 +145,8 @@ const StepDisconnect = props => { { strong: , jpConnectionInfoLink: ( - { /> ), jpSupportLink: ( - { { strong: , connectionInfoLink: ( - ), supportLink: ( - ), } diff --git a/projects/js-packages/connection/components/owner-disconnect-dialog/index.jsx b/projects/js-packages/connection/components/owner-disconnect-dialog/index.jsx index 5cd0a37c3971..5ae1d7b0b639 100644 --- a/projects/js-packages/connection/components/owner-disconnect-dialog/index.jsx +++ b/projects/js-packages/connection/components/owner-disconnect-dialog/index.jsx @@ -4,10 +4,11 @@ import jetpackAnalytics from '@automattic/jetpack-analytics'; import restApi from '@automattic/jetpack-api'; import { getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink, Modal, Button } from '@wordpress/components'; +import { Modal, Button } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; import { Icon, chevronRight, external } from '@wordpress/icons'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import PropTypes from 'prop-types'; import { useCallback, useState, useEffect } from 'react'; @@ -122,7 +123,6 @@ const OwnerDisconnectDialog = ( { action="check-users" />
    -
    @@ -135,7 +135,8 @@ const OwnerDisconnectDialog = ( { { strong: , connectionInfoLink: ( - ), supportLink: ( - diff --git a/projects/js-packages/connection/package.json b/projects/js-packages/connection/package.json index 92c7f2ca45a4..081161280693 100644 --- a/projects/js-packages/connection/package.json +++ b/projects/js-packages/connection/package.json @@ -40,6 +40,7 @@ "@wordpress/element": "6.44.0", "@wordpress/i18n": "6.17.0", "@wordpress/icons": "12.2.0", + "@wordpress/ui": "0.11.0", "@wordpress/url": "4.44.0", "clsx": "2.1.1", "debug": "4.4.3", diff --git a/projects/js-packages/licensing/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/js-packages/licensing/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/js-packages/licensing/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/js-packages/licensing/components/activation-screen-error/use-get-error-content.tsx b/projects/js-packages/licensing/components/activation-screen-error/use-get-error-content.tsx index f29f2bc54d4f..fde051cb2826 100644 --- a/projects/js-packages/licensing/components/activation-screen-error/use-get-error-content.tsx +++ b/projects/js-packages/licensing/components/activation-screen-error/use-get-error-content.tsx @@ -1,7 +1,7 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { LICENSE_ERRORS } from './constants'; type LicenseErrorKeysType = keyof typeof LICENSE_ERRORS; @@ -19,7 +19,8 @@ export const useGetErrorContent = ( licenseError: string, errorType: LicenseErro __( 'Need help? Get in touch.', 'jetpack-licensing' ), { a: ( - steps to resolve it.', 'jetpack-licensing' ), { a: ( - { return ( <> { productLink && ( - { productLink.text } - + ) } ); diff --git a/projects/js-packages/licensing/package.json b/projects/js-packages/licensing/package.json index 0ab6249977fb..d75b047c6bc1 100644 --- a/projects/js-packages/licensing/package.json +++ b/projects/js-packages/licensing/package.json @@ -35,6 +35,7 @@ "@wordpress/element": "6.44.0", "@wordpress/i18n": "6.17.0", "@wordpress/icons": "12.2.0", + "@wordpress/ui": "0.11.0", "clsx": "2.1.1", "prop-types": "15.8.1" }, diff --git a/projects/js-packages/shared-extension-utils/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/js-packages/shared-extension-utils/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/js-packages/shared-extension-utils/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/js-packages/shared-extension-utils/package.json b/projects/js-packages/shared-extension-utils/package.json index a13127a91d92..a556af049f94 100644 --- a/projects/js-packages/shared-extension-utils/package.json +++ b/projects/js-packages/shared-extension-utils/package.json @@ -47,6 +47,7 @@ "@wordpress/i18n": "6.17.0", "@wordpress/plugins": "7.44.0", "@wordpress/primitives": "4.44.0", + "@wordpress/ui": "0.11.0", "@wordpress/url": "4.44.0", "clsx": "2.1.1", "debug": "4.4.3" diff --git a/projects/js-packages/shared-extension-utils/src/components/wpcom-support-link.jsx b/projects/js-packages/shared-extension-utils/src/components/wpcom-support-link.jsx index 91ed60155997..bb0f33f36077 100644 --- a/projects/js-packages/shared-extension-utils/src/components/wpcom-support-link.jsx +++ b/projects/js-packages/shared-extension-utils/src/components/wpcom-support-link.jsx @@ -1,5 +1,5 @@ -import { ExternalLink } from '@wordpress/components'; import { useDispatch } from '@wordpress/data'; +import { Link } from '@wordpress/ui'; import { forwardRef } from 'react'; /** @@ -36,9 +36,9 @@ export const WpcomSupportLink = forwardRef( ); } return ( - + { children } - + ); } ); diff --git a/projects/packages/activity-log/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/packages/activity-log/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/packages/activity-log/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/packages/activity-log/package.json b/projects/packages/activity-log/package.json index c15567423b3b..dab408432f1c 100644 --- a/projects/packages/activity-log/package.json +++ b/projects/packages/activity-log/package.json @@ -39,6 +39,7 @@ "@wordpress/element": "6.44.0", "@wordpress/i18n": "6.17.0", "@wordpress/icons": "12.2.0", + "@wordpress/ui": "0.11.0", "@wordpress/url": "4.44.0", "date-fns": "4.1.0", "fast-deep-equal": "3.1.3", diff --git a/projects/packages/activity-log/src/js/components/ActivityLog/formatted-block/index.tsx b/projects/packages/activity-log/src/js/components/ActivityLog/formatted-block/index.tsx index 5881d5c0f265..d634de540fe3 100644 --- a/projects/packages/activity-log/src/js/components/ActivityLog/formatted-block/index.tsx +++ b/projects/packages/activity-log/src/js/components/ActivityLog/formatted-block/index.tsx @@ -1,15 +1,4 @@ -/** - * Renders the structured tokens produced by the parser. - * - * Ported (simplified) from Calypso's logs-activity-formatted-block. Calypso - * links entities into its own routes (/reader/blogs/…, /people/edit/…, - * /plugins/…); in wp-admin we link into the equivalent core screens - * (post.php, user-edit.php, plugins.php, themes.php, comment.php) via - * `buildAdminLink`. Entities without a wp-admin equivalent (site, backup) - * fall through to plain strong text. Direct URL ranges (release notes, - * docs) still render as external links. - */ -import { ExternalLink } from '@wordpress/components'; +import { Link } from '@wordpress/ui'; import { Fragment, type MouseEvent, type ReactNode } from 'react'; import { buildAdminLink } from '../admin-links'; import type { ActivityBlockContent, ActivityBlockMeta, ActivityBlockNode } from './types'; @@ -44,7 +33,7 @@ const FilePath = ( { children }: { children: ReactNode } ) => ( const isWordPressDotComUrl = ( url?: string | null ): boolean => !! url && url.startsWith( 'https://wordpress.com/' ); -const Link: BlockRenderer = ( { content, children, onClick, meta } ) => { +const AnchorBlock: BlockRenderer = ( { content, children, onClick, meta } ) => { const { url, activity, section, intent } = content; if ( ! url ) { @@ -73,7 +62,8 @@ const Link: BlockRenderer = ( { content, children, onClick, meta } ) => { } return ( - { data-intent={ intent ?? meta.intent } > { children } - + ); }; @@ -102,8 +92,8 @@ const blockTypeMapping: Record< string, BlockRenderer > = { i: ( { children } ) => { children }, em: ( { children } ) => { children }, pre: ( { children } ) => { children }, - a: Link, - link: Link, + a: AnchorBlock, + link: AnchorBlock, filepath: ( { children } ) => { children }, post: EntityLink, comment: EntityLink, diff --git a/projects/packages/backup/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/packages/backup/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/packages/backup/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/packages/backup/package.json b/projects/packages/backup/package.json index 6e0d87b34033..18811a45769f 100644 --- a/projects/packages/backup/package.json +++ b/projects/packages/backup/package.json @@ -42,6 +42,7 @@ "@wordpress/element": "6.44.0", "@wordpress/i18n": "6.17.0", "@wordpress/icons": "12.2.0", + "@wordpress/ui": "0.11.0", "moment": "2.30.1", "prop-types": "^15.8.1", "react": "18.3.1", diff --git a/projects/packages/backup/src/js/components/Admin/index.js b/projects/packages/backup/src/js/components/Admin/index.js index 7b7bdb063d94..1e59e22fa5c0 100644 --- a/projects/packages/backup/src/js/components/Admin/index.js +++ b/projects/packages/backup/src/js/components/Admin/index.js @@ -9,7 +9,7 @@ import { } from '@automattic/jetpack-components'; import { useConnectionErrorNotice, ConnectionError } from '@automattic/jetpack-connection'; import apiFetch from '@wordpress/api-fetch'; -import { Button, ExternalLink } from '@wordpress/components'; +import { Button } from '@wordpress/components'; import { useSelect } from '@wordpress/data'; import { createInterpolateElement, @@ -19,6 +19,7 @@ import { useMemo, } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import useAnalytics from '../../hooks/useAnalytics'; import useBackupsState from '../../hooks/useBackupsState'; import useCapabilities from '../../hooks/useCapabilities'; @@ -190,12 +191,13 @@ const BackupSegments = ( { hasBackupPlan, connectionLoaded } ) => { ) }

    - { __( 'Learn about the file browser', 'jetpack-backup-pkg' ) } - +

    diff --git a/projects/packages/backup/src/js/components/Backups.js b/projects/packages/backup/src/js/components/Backups.js index 7a8380d7a576..f409de1b1c6b 100644 --- a/projects/packages/backup/src/js/components/Backups.js +++ b/projects/packages/backup/src/js/components/Backups.js @@ -3,11 +3,11 @@ import { getRedirectUrl, LoadingPlaceholder, } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { useSelect } from '@wordpress/data'; import { getDate, dateI18n } from '@wordpress/date'; import { createInterpolateElement, useCallback } from '@wordpress/element'; import { __, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { BACKUP_STATE } from '../constants'; import useAnalytics from '../hooks/useAnalytics'; import useBackupsState from '../hooks/useBackupsState.js'; @@ -199,12 +199,13 @@ const CompleteBackup = ( { latestTime, stats } ) => { ! backupsStopped && createInterpolateElement( __( - '
    View activity log', + '
    View activity log', 'jetpack-backup-pkg' ), { Button: ( - { /> ), br:
    , - ExternalLink: ( - { ), { link: ( - + ), } ) } diff --git a/projects/packages/backup/src/js/components/backup-storage-space/storage-usage-details/index.jsx b/projects/packages/backup/src/js/components/backup-storage-space/storage-usage-details/index.jsx index 5d4873c8d4bf..450a690d9436 100644 --- a/projects/packages/backup/src/js/components/backup-storage-space/storage-usage-details/index.jsx +++ b/projects/packages/backup/src/js/components/backup-storage-space/storage-usage-details/index.jsx @@ -1,9 +1,9 @@ import './style.scss'; import { getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { useSelect } from '@wordpress/data'; import { createInterpolateElement } from '@wordpress/element'; import { __, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { STORE_ID } from '../../../store'; import StorageHelpPopover from '../storage-help-popover'; import { StorageUsageLevels } from '../storage-usage-levels'; @@ -55,7 +55,8 @@ const StorageUsageDetails = ( { daysOfBackupsSaved === 1 ? singularDaysOfBackupLabel : pluralDaysOfBackupLabel, { a: ( - ), diff --git a/projects/packages/backup/src/js/components/next-scheduled-backup.tsx b/projects/packages/backup/src/js/components/next-scheduled-backup.tsx index b3544d870b0c..967dd64c8faa 100644 --- a/projects/packages/backup/src/js/components/next-scheduled-backup.tsx +++ b/projects/packages/backup/src/js/components/next-scheduled-backup.tsx @@ -1,8 +1,8 @@ import { getRedirectUrl, LoadingPlaceholder } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { useSelect } from '@wordpress/data'; import { useCallback } from '@wordpress/element'; import { __, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { FunctionComponent } from 'react'; import { useNextBackupSchedule } from '../hooks/scheduled-backups/use-next-backup-schedule'; import useAnalytics from '../hooks/useAnalytics'; @@ -52,13 +52,14 @@ const NextScheduledBackup: FunctionComponent< Props > = () => { timeRange ) } { ' ' } - { __( 'Modify', 'jetpack-backup-pkg' ) } - +
    ); }; diff --git a/projects/packages/backup/src/js/components/review-request/index.tsx b/projects/packages/backup/src/js/components/review-request/index.tsx index d0de30da3ce8..e2ccb3eee437 100644 --- a/projects/packages/backup/src/js/components/review-request/index.tsx +++ b/projects/packages/backup/src/js/components/review-request/index.tsx @@ -1,6 +1,6 @@ import { Text } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import styles from './style.module.scss'; import { ReviewRequestBaseProps } from './types'; import type { FC } from 'react'; @@ -20,7 +20,8 @@ const ReviewRequest: FC< ReviewRequestBaseProps > = ( { return ( <> - = ( { { reviewText } { cta }
    - + { __( 'Maybe later', 'jetpack-backup-pkg' ) } diff --git a/projects/packages/forms/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/packages/forms/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/packages/forms/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/packages/forms/routes/responses/integrations-modal.tsx b/projects/packages/forms/routes/responses/integrations-modal.tsx index 8a8070989784..9d579cdfbaf2 100644 --- a/projects/packages/forms/routes/responses/integrations-modal.tsx +++ b/projects/packages/forms/routes/responses/integrations-modal.tsx @@ -9,7 +9,6 @@ import { Modal, Card, Button, - ExternalLink, Spinner, // eslint-disable-next-line @wordpress/no-unsafe-wp-apis __experimentalVStack as VStack, @@ -19,6 +18,7 @@ import { import { useState, useCallback, useMemo, createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; import { chevronUp, chevronDown } from '@wordpress/icons'; +import { Link } from '@wordpress/ui'; import * as React from 'react'; /** * Internal dependencies @@ -138,7 +138,7 @@ const IntegrationCardComponent = ( { return (

    { createInterpolateElement( message, { - a: , + a: , } ) }

    ); @@ -177,7 +177,7 @@ const IntegrationCardComponent = ( { 'Akismet is active. There is one step left. Please add your Akismet key.', 'jetpack-forms' ), - { a: } + { a: } ) : __( 'Setup is required to complete the integration.', 'jetpack-forms' ) }

    @@ -220,9 +220,9 @@ const IntegrationCardComponent = ( { { id === 'akismet' && ( <> | - + { __( 'Learn about Akismet', 'jetpack-forms' ) } - + ) } diff --git a/projects/packages/forms/routes/responses/stage.tsx b/projects/packages/forms/routes/responses/stage.tsx index c14fc1694a7b..bc1813b3e2ec 100644 --- a/projects/packages/forms/routes/responses/stage.tsx +++ b/projects/packages/forms/routes/responses/stage.tsx @@ -8,7 +8,6 @@ import { formatNumber } from '@automattic/number-formatters'; import { Page } from '@wordpress/admin-ui'; import { __experimentalText as Text, // eslint-disable-line @wordpress/no-unsafe-wp-apis - ExternalLink, } from '@wordpress/components'; import { useDispatch, useSelect } from '@wordpress/data'; import { DataViews } from '@wordpress/dataviews'; @@ -17,7 +16,7 @@ import { useMemo, useState, useCallback, useEffect } from '@wordpress/element'; import { decodeEntities } from '@wordpress/html-entities'; import { __, sprintf } from '@wordpress/i18n'; import { useParams, useSearch, useNavigate } from '@wordpress/route'; -import { Badge, Stack } from '@wordpress/ui'; +import { Badge, Link, Stack } from '@wordpress/ui'; import * as React from 'react'; /** * Internal dependencies @@ -548,7 +547,9 @@ function StageInner() { const previewLabel = __( 'Form preview', 'jetpack-forms' ); if ( item.preview_url ) { return styleUnreadValue( - { previewLabel }, + + { previewLabel } + , item.is_unread ); } @@ -560,7 +561,9 @@ function StageInner() { __( '(no title)', 'jetpack-forms' ); if ( item.entry_permalink ) { return styleUnreadValue( - { source }, + + { source } + , item.is_unread ); } diff --git a/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/akismet.tsx b/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/akismet.tsx index a8624327446a..f0181f953606 100644 --- a/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/akismet.tsx +++ b/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/akismet.tsx @@ -1,7 +1,8 @@ import getRedirectUrl from '@automattic/jetpack-components/tools/jp-redirect'; -import { Button, ExternalLink, __experimentalHStack as HStack } from '@wordpress/components'; // eslint-disable-line @wordpress/no-unsafe-wp-apis +import { Button, __experimentalHStack as HStack } from '@wordpress/components'; // eslint-disable-line @wordpress/no-unsafe-wp-apis import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import AkismetIcon from '../../../../../icons/akismet.tsx'; import type { CardItem, CardBuilderProps } from './types.ts'; @@ -38,7 +39,7 @@ export function buildAkismetCard( { "Add one-click spam protection for your forms with Akismet. Simply install the plugin and you're set.", 'jetpack-forms' ), - { a: } + { a: } ), notActivatedMessage: __( 'Akismet is installed. Just activate the plugin to start blocking spam.', @@ -55,7 +56,7 @@ export function buildAkismetCard( { 'Akismet is active. There is one step left. Please add your Akismet key.', 'jetpack-forms' ), - { a: } + { a: } ) }

    ), diff --git a/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/hostinger-reach.tsx b/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/hostinger-reach.tsx index 2a436e48928f..4eda57df8139 100644 --- a/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/hostinger-reach.tsx +++ b/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/hostinger-reach.tsx @@ -1,11 +1,11 @@ import { Button, - ExternalLink, TextControl, __experimentalHStack as HStack, // eslint-disable-line @wordpress/no-unsafe-wp-apis } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import HostingerReachIcon from '../../../../../icons/hostinger-reach.tsx'; import type { CardItem, CardBuilderProps } from './types.ts'; import type { Integration } from '../../../../../types/index.ts'; @@ -51,7 +51,11 @@ export function buildHostingerReachCard( { ), { a: ( - + ), } ), @@ -65,12 +69,12 @@ export function buildHostingerReachCard( { body: ! isConnected ? ( <>

    - + { __( 'Hostinger Reach is active. There is one step left. Please complete Hostinger Reach setup.', 'jetpack-forms' ) } - +

    ); @@ -130,7 +131,7 @@ export function buildJetpackCrmCard( { 'You can save your form contacts in Jetpack CRM. To get started, please install the plugin.', 'jetpack-forms' ), - { a: } + { a: } ), notActivatedMessage: __( 'Jetpack CRM is installed. To start saving contacts, simply activate the plugin.', diff --git a/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/mailpoet.tsx b/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/mailpoet.tsx index 7392847f3f50..49059ac5022d 100644 --- a/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/mailpoet.tsx +++ b/projects/packages/forms/src/blocks/contact-form/components/jetpack-integrations-modal/helpers/mailpoet.tsx @@ -1,11 +1,11 @@ import { Button, - ExternalLink, SelectControl, __experimentalHStack as HStack, // eslint-disable-line @wordpress/no-unsafe-wp-apis } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import MailPoetIcon from '../../../../../icons/mailpoet.tsx'; import type { CardItem, CardBuilderProps } from './types.ts'; import type { Integration } from '../../../../../types/index.ts'; @@ -59,7 +59,7 @@ export function buildMailPoetCard( { 'Add powerful email marketing to your forms with MailPoet. Simply install the plugin to start sending emails.', 'jetpack-forms' ), - { a: } + { a: } ), notActivatedMessage: __( 'MailPoet is installed. Just activate the plugin to start sending emails.', @@ -76,7 +76,7 @@ export function buildMailPoetCard( { 'MailPoet is active. There is one step left. Please complete MailPoet setup.', 'jetpack-forms' ), - { a: } + { a: } ) }

    @@ -124,9 +124,9 @@ export function buildMailPoetCard( { { context === 'block-editor' && ConsentToggle && } { settingsUrl && (

    - + { __( 'View dashboard', 'jetpack-forms' ) } - +

    ) }
    • diff --git a/projects/packages/my-jetpack/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/packages/my-jetpack/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/packages/my-jetpack/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/packages/newsletter/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/packages/newsletter/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/packages/newsletter/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/packages/newsletter/src/settings/components/toggle-with-link.tsx b/projects/packages/newsletter/src/settings/components/toggle-with-link.tsx index 3ecf6cb8b28a..2f9bd7a9a14e 100644 --- a/projects/packages/newsletter/src/settings/components/toggle-with-link.tsx +++ b/projects/packages/newsletter/src/settings/components/toggle-with-link.tsx @@ -3,10 +3,11 @@ */ import analytics from '@automattic/jetpack-analytics'; import { getAdminUrl, type SiteType } from '@automattic/jetpack-script-data'; -import { ExternalLink, ToggleControl } from '@wordpress/components'; +import { ToggleControl } from '@wordpress/components'; import { type Field } from '@wordpress/dataviews/wp'; import { useCallback } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { addQueryArgs } from '@wordpress/url'; interface ToggleWithLinkProps { @@ -54,9 +55,9 @@ export function ToggleWithLink( { { field.label }{ ' ' } { isExternal ? ( - + { linkText } - + ) : ( { linkText } diff --git a/projects/packages/newsletter/src/settings/sections/newsletter-categories-section.tsx b/projects/packages/newsletter/src/settings/sections/newsletter-categories-section.tsx index 54457b25d8dd..b97fdc3f73bc 100644 --- a/projects/packages/newsletter/src/settings/sections/newsletter-categories-section.tsx +++ b/projects/packages/newsletter/src/settings/sections/newsletter-categories-section.tsx @@ -15,7 +15,6 @@ import { CardHeader, CardBody, CardFooter, - ExternalLink, Notice, __experimentalText as Text, // eslint-disable-line @wordpress/no-unsafe-wp-apis __experimentalHeading as Heading, // eslint-disable-line @wordpress/no-unsafe-wp-apis @@ -23,6 +22,7 @@ import { import { DataForm, type Field, useFormValidity } from '@wordpress/dataviews/wp'; import { createInterpolateElement, useCallback, useEffect, useState } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; /** * Internal dependencies */ @@ -162,7 +162,7 @@ export function NewsletterCategoriesSection( { const SubscribeBlockLink = isWpcom ? ( ) : ( - + ); return ( @@ -200,13 +200,14 @@ export function NewsletterCategoriesSection( { { data.wpcom_newsletter_categories_enabled && (

    - { __( 'Add new category', 'jetpack-newsletter' ) } - +

    ) } diff --git a/projects/packages/newsletter/src/settings/sections/newsletter-section.tsx b/projects/packages/newsletter/src/settings/sections/newsletter-section.tsx index b0d97b0b4bab..f80a3337f3fe 100644 --- a/projects/packages/newsletter/src/settings/sections/newsletter-section.tsx +++ b/projects/packages/newsletter/src/settings/sections/newsletter-section.tsx @@ -9,13 +9,13 @@ import { CardHeader, CardBody, CardFooter, - ExternalLink, ToggleControl, __experimentalHeading as Heading, // eslint-disable-line @wordpress/no-unsafe-wp-apis } from '@wordpress/components'; import { DataForm, type Field } from '@wordpress/dataviews/wp'; import { useCallback, useRef } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; /** * Internal dependencies */ @@ -132,18 +132,20 @@ export function NewsletterSection( { data, onChange }: NewsletterSectionProps ): /> - { __( 'Privacy information', 'jetpack-newsletter' ) } - + { data.subscriptions && newsletterScriptData && ( - { __( 'Manage all subscribers', 'jetpack-newsletter' ) } - + ) } diff --git a/projects/packages/paypal-payments/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/packages/paypal-payments/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/packages/paypal-payments/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/packages/paypal-payments/package.json b/projects/packages/paypal-payments/package.json index 7cb3953e4b00..00ffec1f8f7f 100644 --- a/projects/packages/paypal-payments/package.json +++ b/projects/packages/paypal-payments/package.json @@ -38,6 +38,7 @@ "@wordpress/element": "6.44.0", "@wordpress/hooks": "4.44.0", "@wordpress/i18n": "6.17.0", + "@wordpress/ui": "0.11.0", "@wordpress/widgets": "4.44.0", "clsx": "2.1.1", "copy-webpack-plugin": "14.0.0", diff --git a/projects/packages/paypal-payments/src/block/deprecated/v2/edit.js b/projects/packages/paypal-payments/src/block/deprecated/v2/edit.js index b22bb9b5c0fd..78ecffed0329 100644 --- a/projects/packages/paypal-payments/src/block/deprecated/v2/edit.js +++ b/projects/packages/paypal-payments/src/block/deprecated/v2/edit.js @@ -1,7 +1,6 @@ import { InspectorControls } from '@wordpress/block-editor'; import { Disabled, - ExternalLink, PanelBody, SelectControl, TextareaControl, @@ -12,6 +11,7 @@ import { compose, withInstanceId } from '@wordpress/compose'; import { dispatch, withSelect } from '@wordpress/data'; import { Component } from '@wordpress/element'; import { __, _n, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import { validate as emailValidatorValidate } from 'email-validator'; import { isEmpty, isEqual, pick, trimEnd } from 'lodash'; @@ -578,9 +578,9 @@ class SimplePaymentsEdit extends Component { 'Enter the email address associated with your PayPal account. Don’t have an account?', 'jetpack-paypal-payments' ) + ' ' } - + { __( 'Create one on PayPal', 'jetpack-paypal-payments' ) } - + diff --git a/projects/packages/paypal-payments/src/block/deprecated/v2/index.js b/projects/packages/paypal-payments/src/block/deprecated/v2/index.js index c2533de026e2..40b53feba611 100644 --- a/projects/packages/paypal-payments/src/block/deprecated/v2/index.js +++ b/projects/packages/paypal-payments/src/block/deprecated/v2/index.js @@ -1,7 +1,8 @@ import { isWpcomPlatformSite } from '@automattic/jetpack-script-data'; -import { ExternalLink, Path, SVG } from '@wordpress/components'; +import { Path, SVG } from '@wordpress/components'; import { Fragment } from '@wordpress/element'; import { __, _x } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { DEFAULT_CURRENCY } from '../../constants'; import edit from './edit'; import save from './save'; @@ -34,9 +35,9 @@ const settings = { 'jetpack-paypal-payments' ) }

    - + { __( 'Support reference', 'jetpack-paypal-payments' ) } - + ), diff --git a/projects/packages/paypal-payments/src/block/edit.js b/projects/packages/paypal-payments/src/block/edit.js index 9ff2e3119a35..3dd26079bd8e 100644 --- a/projects/packages/paypal-payments/src/block/edit.js +++ b/projects/packages/paypal-payments/src/block/edit.js @@ -1,7 +1,6 @@ import { InspectorControls, useBlockProps } from '@wordpress/block-editor'; import { Disabled, - ExternalLink, SelectControl, TextareaControl, TextControl, @@ -11,6 +10,7 @@ import { compose, withInstanceId } from '@wordpress/compose'; import { dispatch, withSelect } from '@wordpress/data'; import { useEffect, useRef, useState } from '@wordpress/element'; import { __, _n, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { getWidgetIdFromBlock } from '@wordpress/widgets'; import clsx from 'clsx'; import { validate as emailValidatorValidate } from 'email-validator'; @@ -536,9 +536,9 @@ export const SimplePaymentsEdit = ( { "Enter the email address associated with your PayPal account. Don't have an account?", 'jetpack-paypal-payments' ) + ' ' } - + { __( 'Create one on PayPal', 'jetpack-paypal-payments' ) } - + diff --git a/projects/packages/paypal-payments/src/paypal-payment-buttons/edit.js b/projects/packages/paypal-payments/src/paypal-payment-buttons/edit.js index cb6283673457..3709aa3be869 100644 --- a/projects/packages/paypal-payments/src/paypal-payment-buttons/edit.js +++ b/projects/packages/paypal-payments/src/paypal-payment-buttons/edit.js @@ -1,7 +1,6 @@ import { isWpcomPlatformSite } from '@automattic/jetpack-script-data'; import { PlainText, useBlockProps } from '@wordpress/block-editor'; import { - ExternalLink, Notice, Placeholder, // eslint-disable-next-line @wordpress/no-unsafe-wp-apis @@ -15,7 +14,9 @@ import { } from '@wordpress/components'; import { createInterpolateElement, useEffect, useState } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import PayPalIcon from './icon'; + import './editor.scss'; const BUTTON_ID_PATTERN = '[A-Za-z0-9_-]+'; @@ -336,8 +337,8 @@ export default function Edit( { attributes, setAttributes, isSelected } ) { 'jetpack-paypal-payments' ), { - SignupLink: , - LoginLink: , + SignupLink: , + LoginLink: , strong: , } ) } diff --git a/projects/packages/paypal-payments/tests/js/paypal-payment-buttons-block-tests/edit.test.js b/projects/packages/paypal-payments/tests/js/paypal-payment-buttons-block-tests/edit.test.js index 3ec67bb49f47..0a08484d1572 100644 --- a/projects/packages/paypal-payments/tests/js/paypal-payment-buttons-block-tests/edit.test.js +++ b/projects/packages/paypal-payments/tests/js/paypal-payment-buttons-block-tests/edit.test.js @@ -27,11 +27,6 @@ jest.mock( '@wordpress/components', () => ( { { children }     ), - ExternalLink: ( { href, children } ) => ( - - { children } - - ), Placeholder: ( { icon, label, instructions, notices, children } ) => (
    { icon && } @@ -72,6 +67,15 @@ jest.mock( '@wordpress/components', () => ( { Path: props => , } ) ); +// Mock @wordpress/ui +jest.mock( '@wordpress/ui', () => ( { + Link: ( { href, children } ) => ( + + { children } + + ), +} ) ); + // Mock i18n jest.mock( '@wordpress/i18n', () => ( { __: text => text, @@ -95,7 +99,7 @@ jest.mock( '@wordpress/element', () => { // Replace the text with actual React elements let result = text; - // Replace SignupLink and LoginLink with actual ExternalLink components + // Replace SignupLink and LoginLink with actual Link components if ( elements.SignupLink ) { result = React.createElement( React.Fragment, @@ -103,13 +107,13 @@ jest.mock( '@wordpress/element', () => { '1. ', React.cloneElement( elements.SignupLink, - { 'data-testid': 'external-link' }, + { 'data-testid': 'link' }, React.createElement( 'strong', null, 'Sign up' ) ), ' or ', React.cloneElement( elements.LoginLink, - { 'data-testid': 'external-link' }, + { 'data-testid': 'link' }, React.createElement( 'strong', null, 'log in' ) ), ' to PayPal to get your Payment Button code.' @@ -772,7 +776,7 @@ describe( 'Edit', () => { it( 'renders external links to PayPal signup and login pages for WordPress.org', () => { render( ); - const links = screen.getAllByTestId( 'external-link' ); + const links = screen.getAllByTestId( 'link' ); expect( links ).toHaveLength( 2 ); // Check signup link @@ -796,7 +800,7 @@ describe( 'Edit', () => { isWpcomPlatformSite.mockReturnValue( true ); render( ); - const links = screen.getAllByTestId( 'external-link' ); + const links = screen.getAllByTestId( 'link' ); expect( links ).toHaveLength( 2 ); // Check signup link diff --git a/projects/packages/paypal-payments/webpack.config.blocks.js b/projects/packages/paypal-payments/webpack.config.blocks.js index 042d09819cd7..3b8709f089b6 100644 --- a/projects/packages/paypal-payments/webpack.config.blocks.js +++ b/projects/packages/paypal-payments/webpack.config.blocks.js @@ -56,6 +56,9 @@ const sharedWebpackConfig = { ], } ), + // Workarounds for non-extracted `@wordpress/*` packages. + ...jetpackWebpackConfig.BundledWpPkgsTranspileRules(), + // Handle CSS. jetpackWebpackConfig.CssRule( { extensions: [ 'css', 'sass', 'scss' ], diff --git a/projects/packages/publicize/_inc/components/admin-page/toggles/social-module-toggle/index.tsx b/projects/packages/publicize/_inc/components/admin-page/toggles/social-module-toggle/index.tsx index 4a251250e835..186e89b5e69e 100644 --- a/projects/packages/publicize/_inc/components/admin-page/toggles/social-module-toggle/index.tsx +++ b/projects/packages/publicize/_inc/components/admin-page/toggles/social-module-toggle/index.tsx @@ -5,9 +5,9 @@ import { useBreakpointMatch, } from '@automattic/jetpack-components'; import { getScriptData, isWpcomPlatformSite } from '@automattic/jetpack-script-data'; -import { ExternalLink } from '@wordpress/components'; import { useSelect, useDispatch } from '@wordpress/data'; import { __, _x } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import { useCallback } from 'react'; import { store as socialStore } from '../../../../social-store'; @@ -80,7 +80,8 @@ const SocialModuleToggle: FC = () => { 'jetpack-publicize-pkg' ) }   - { className={ styles.learn } > { __( 'Learn more', 'jetpack-publicize-pkg' ) } - + { ! isWpcomPlatformSite() && ! hasSocialPaidFeatures() ? ( = ( { disabled } ) => { 'jetpack-publicize-pkg' ) } - - { isEnabled ? (
    = ( { disabled } ) => { 'jetpack-publicize-pkg' ) }   - + { __( 'Learn more', 'jetpack-publicize-pkg' ) } - + } __nextHasNoMarginBottom={ true } diff --git a/projects/packages/publicize/_inc/components/block-editor/placeholder.tsx b/projects/packages/publicize/_inc/components/block-editor/placeholder.tsx index 0f6b60bec616..592010cb8674 100644 --- a/projects/packages/publicize/_inc/components/block-editor/placeholder.tsx +++ b/projects/packages/publicize/_inc/components/block-editor/placeholder.tsx @@ -1,8 +1,9 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; import { useAnalytics } from '@automattic/jetpack-shared-extension-utils'; -import { PanelBody, Button, ExternalLink } from '@wordpress/components'; +import { PanelBody, Button } from '@wordpress/components'; import { useCallback, useState } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { getSocialAdminPageUrl } from '../../utils'; export const Placeholder = () => { @@ -41,9 +42,9 @@ export const Placeholder = () => { { __( 'Activate Jetpack Social', 'jetpack-publicize-pkg' ) }
    - + { __( 'Learn more', 'jetpack-publicize-pkg' ) } - +
    ); diff --git a/projects/packages/publicize/_inc/components/connection-management/connection-name.tsx b/projects/packages/publicize/_inc/components/connection-management/connection-name.tsx index 0f2646c6a4be..4188ee85115f 100644 --- a/projects/packages/publicize/_inc/components/connection-management/connection-name.tsx +++ b/projects/packages/publicize/_inc/components/connection-management/connection-name.tsx @@ -1,6 +1,7 @@ -import { ExternalLink, Spinner } from '@wordpress/components'; +import { Spinner } from '@wordpress/components'; import { useSelect } from '@wordpress/data'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { store as socialStore } from '../../social-store'; import { Connection } from '../../social-store/types'; import styles from './style.module.scss'; @@ -29,9 +30,9 @@ export function ConnectionName( { connection }: ConnectionNameProps ) { { ! connection.profile_link ? ( { connection.display_name } ) : ( - + { connection.display_name } - + ) } { isUpdating ? ( diff --git a/projects/packages/publicize/_inc/components/connection-management/connection-status.tsx b/projects/packages/publicize/_inc/components/connection-management/connection-status.tsx index 908459899d05..fc051192ff53 100644 --- a/projects/packages/publicize/_inc/components/connection-management/connection-status.tsx +++ b/projects/packages/publicize/_inc/components/connection-management/connection-status.tsx @@ -1,8 +1,8 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { useSelect } from '@wordpress/data'; import { createInterpolateElement } from '@wordpress/element'; import { __, _x, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { store as socialStore } from '../../social-store'; import { Connection } from '../../social-store/types'; import { SupportedService } from '../services/types'; @@ -59,7 +59,8 @@ export function ConnectionStatus( { connection, service }: ConnectionStatusProps ), { link: ( - @@ -81,7 +82,6 @@ export function ConnectionStatus( { connection, service }: ConnectionStatusProps ); } )( isUnsupported, connection.status ) } -   { ! isUnsupported && service ? ( ) : ( diff --git a/projects/packages/publicize/_inc/components/customize-and-preview/customization-section/per-connection-notice.tsx b/projects/packages/publicize/_inc/components/customize-and-preview/customization-section/per-connection-notice.tsx index f24bd09b3528..9271829ac7a5 100644 --- a/projects/packages/publicize/_inc/components/customize-and-preview/customization-section/per-connection-notice.tsx +++ b/projects/packages/publicize/_inc/components/customize-and-preview/customization-section/per-connection-notice.tsx @@ -1,6 +1,7 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink, Notice } from '@wordpress/components'; +import { Notice } from '@wordpress/components'; import { __, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { useConnectionMediaValidation } from '../../../hooks/use-connection-media-validation'; import { NO_MEDIA_ERROR, getErrorLabel } from '../../../hooks/use-media-restrictions/constants'; import { Connection } from '../../../social-store/types'; @@ -45,9 +46,9 @@ export function PerConnectionNotice( { connection }: PerConnectionNoticeProps ) { getErrorLabel( error ) } - + { __( 'Troubleshooting tips', 'jetpack-publicize-pkg' ) } - + ); } diff --git a/projects/packages/publicize/_inc/components/form/media-requirements-notice.tsx b/projects/packages/publicize/_inc/components/form/media-requirements-notice.tsx index 4fb2343c683f..07e29a0591c4 100644 --- a/projects/packages/publicize/_inc/components/form/media-requirements-notice.tsx +++ b/projects/packages/publicize/_inc/components/form/media-requirements-notice.tsx @@ -1,8 +1,9 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink, Notice } from '@wordpress/components'; +import { Notice } from '@wordpress/components'; import { useSelect } from '@wordpress/data'; import { Fragment, useMemo } from '@wordpress/element'; import { __, _x } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { getErrorLabel } from '../../hooks/use-media-restrictions/constants'; import { ValidationErrors } from '../../hooks/use-media-restrictions/types'; import { store as socialStore } from '../../social-store'; @@ -85,9 +86,9 @@ export const MediaRequirementsNotice: FC< MediaRequirementsNoticeProps > = ( { ); } ) } - + { __( 'Troubleshooting tips', 'jetpack-publicize-pkg' ) } - + ); }; diff --git a/projects/packages/publicize/_inc/components/manage-connections-modal/confirmation-form/index.tsx b/projects/packages/publicize/_inc/components/manage-connections-modal/confirmation-form/index.tsx index 9cc78a2b032a..e4db638eb837 100644 --- a/projects/packages/publicize/_inc/components/manage-connections-modal/confirmation-form/index.tsx +++ b/projects/packages/publicize/_inc/components/manage-connections-modal/confirmation-form/index.tsx @@ -1,9 +1,9 @@ import { getRedirectUrl, useGlobalNotices } from '@automattic/jetpack-components'; -import { CheckboxControl, ExternalLink, Notice, Button } from '@wordpress/components'; +import { CheckboxControl, Notice, Button } from '@wordpress/components'; import { useDispatch, useSelect } from '@wordpress/data'; import { useCallback, useMemo } from '@wordpress/element'; import { __, _x } from '@wordpress/i18n'; -import { Notice as UiNotice } from '@wordpress/ui'; +import { Notice as UiNotice, Link } from '@wordpress/ui'; import { store as socialStore } from '../../../social-store'; import { KeyringResult } from '../../../social-store/types'; import { useSupportedServices } from '../../services/use-supported-services'; @@ -212,12 +212,13 @@ export function ConfirmationForm( { 'jetpack-publicize-pkg' ) }   - { __( 'Learn more', 'jetpack-publicize-pkg' ) } - +

    ) } @@ -302,7 +303,6 @@ export function ConfirmationForm( {
    ) } - { accounts.connected.length ? (

    { __( 'Already connected', 'jetpack-publicize-pkg' ) }

    @@ -318,7 +318,6 @@ export function ConfirmationForm( {
    ) : null } -
    diff --git a/projects/packages/publicize/_inc/components/manual-sharing/info.tsx b/projects/packages/publicize/_inc/components/manual-sharing/info.tsx index 266de01254de..076db4aecd54 100644 --- a/projects/packages/publicize/_inc/components/manual-sharing/info.tsx +++ b/projects/packages/publicize/_inc/components/manual-sharing/info.tsx @@ -1,6 +1,6 @@ import { Text, getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import type { ComponentPropsWithoutRef } from 'react'; export type ManualSharingInfoProps = Omit< ComponentPropsWithoutRef< typeof Text >, 'children' >; @@ -19,10 +19,9 @@ export function ManualSharingInfo( { ...textProps }: ManualSharingInfoProps ) { `Just tap the social network or "Copy to Clipboard" icon, and we'll format your content for sharing.`, 'jetpack-publicize-pkg' ) } -   - + { __( 'Learn more', 'jetpack-publicize-pkg' ) } - + ); } diff --git a/projects/packages/publicize/_inc/components/media-section-v2/index.tsx b/projects/packages/publicize/_inc/components/media-section-v2/index.tsx index 505b32ead962..2d1218f706fb 100644 --- a/projects/packages/publicize/_inc/components/media-section-v2/index.tsx +++ b/projects/packages/publicize/_inc/components/media-section-v2/index.tsx @@ -7,10 +7,11 @@ import { GeneralPurposeImage } from '@automattic/jetpack-ai-client'; import { getRedirectUrl, ThemeProvider } from '@automattic/jetpack-components'; import { useAnalytics } from '@automattic/jetpack-shared-extension-utils'; import { MediaUpload } from '@wordpress/block-editor'; -import { BaseControl, Button, ExternalLink } from '@wordpress/components'; +import { BaseControl, Button } from '@wordpress/components'; import { useCallback, useMemo, useReducer, useRef } from '@wordpress/element'; import { applyFilters } from '@wordpress/hooks'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import useFeaturedImage from '../../hooks/use-featured-image'; import useImageGeneratorConfig from '../../hooks/use-image-generator-config'; import useMediaDetails from '../../hooks/use-media-details'; @@ -447,12 +448,13 @@ export default function MediaSectionV2( { /> ) } { currentSource === 'media-library' && ( - { __( 'Learn photo and video best practices', 'jetpack-publicize-pkg' ) } - + ) }
    diff --git a/projects/packages/publicize/_inc/components/services/custom-inputs.tsx b/projects/packages/publicize/_inc/components/services/custom-inputs.tsx index 00305d79a0a4..7a081e5425bf 100644 --- a/projects/packages/publicize/_inc/components/services/custom-inputs.tsx +++ b/projects/packages/publicize/_inc/components/services/custom-inputs.tsx @@ -1,7 +1,8 @@ -import { ExternalLink, Notice } from '@wordpress/components'; +import { Notice } from '@wordpress/components'; import { useSelect } from '@wordpress/data'; import { createInterpolateElement, useCallback, useId, useState } from '@wordpress/element'; import { __, _x, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import { store } from '../../social-store'; import styles from './style.module.scss'; @@ -158,7 +159,11 @@ export function CustomInputs( { service }: CustomInputsProps ) { ), { link: ( - + ), } ) } diff --git a/projects/packages/publicize/_inc/components/services/utils.tsx b/projects/packages/publicize/_inc/components/services/utils.tsx index 548f6e53ef08..1b27a472255b 100644 --- a/projects/packages/publicize/_inc/components/services/utils.tsx +++ b/projects/packages/publicize/_inc/components/services/utils.tsx @@ -1,7 +1,7 @@ import { SocialServiceIcon } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import connectionsFacebook from '../../assets/connections-facebook.webp'; import connectionsInstagramBusiness from '../../assets/connections-instagram-business.webp'; import connectionsLinkedin from '../../assets/connections-linkedin.webp'; @@ -99,7 +99,8 @@ export function getServiceUiDetails( id: ConnectionService[ 'id' ] ): ServiceUiD ) }

    - @@ -107,7 +108,7 @@ export function getServiceUiDetails( id: ConnectionService[ 'id' ] ): ServiceUiD 'Learn how to convert & link your Instagram account.', 'jetpack-publicize-pkg' ) } - + ), () => ( diff --git a/projects/packages/publicize/_inc/components/share-status/share-status-action.tsx b/projects/packages/publicize/_inc/components/share-status/share-status-action.tsx index 3971c681deda..c544ebf6c818 100644 --- a/projects/packages/publicize/_inc/components/share-status/share-status-action.tsx +++ b/projects/packages/publicize/_inc/components/share-status/share-status-action.tsx @@ -1,6 +1,6 @@ import { useAnalytics } from '@automattic/jetpack-shared-extension-utils'; -import { ExternalLink } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { useCallback } from 'react'; import { Retry, RetryProps } from './retry'; @@ -25,9 +25,9 @@ export function ShareStatusAction( { shareItem }: ShareStatusActionProps ) { if ( 'success' === shareItem.status ) { return ( - + { __( 'View', 'jetpack-publicize-pkg' ) } - + ); } diff --git a/projects/packages/publicize/_inc/components/unified-modal/sharing-activity/activity-action.tsx b/projects/packages/publicize/_inc/components/unified-modal/sharing-activity/activity-action.tsx index 28cddec06ea1..7c11612d0805 100644 --- a/projects/packages/publicize/_inc/components/unified-modal/sharing-activity/activity-action.tsx +++ b/projects/packages/publicize/_inc/components/unified-modal/sharing-activity/activity-action.tsx @@ -3,11 +3,11 @@ import { // eslint-disable-next-line @wordpress/no-unsafe-wp-apis __experimentalConfirmDialog as ConfirmDialog, Button, - ExternalLink, } from '@wordpress/components'; import { useDispatch } from '@wordpress/data'; import { useCallback, useReducer } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { store as socialStore } from '../../../social-store'; import { Retry } from '../../share-status/retry'; import { ScheduledActivityItem, SharedActivityItem, SharingActivityItem } from './types'; @@ -54,9 +54,9 @@ export function ActivityAction( { item }: ActivityActionProps ) { if ( item.activityType === 'shared' && item.status === 'success' ) { const sharedItem = item as SharedActivityItem; return ( - + { __( 'View', 'jetpack-publicize-pkg' ) } - + ); } diff --git a/projects/packages/publicize/_inc/components/x-usage/x-usage-content.tsx b/projects/packages/publicize/_inc/components/x-usage/x-usage-content.tsx index 5cc2d03fbf13..3c815a69400e 100644 --- a/projects/packages/publicize/_inc/components/x-usage/x-usage-content.tsx +++ b/projects/packages/publicize/_inc/components/x-usage/x-usage-content.tsx @@ -1,7 +1,7 @@ import { isSimpleSite } from '@automattic/jetpack-script-data'; -import { ExternalLink } from '@wordpress/components'; import { useCallback } from '@wordpress/element'; import { __, _n, _x, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { useSocialUserPreferences } from '../../hooks/use-social-user-preferences'; import { useAutoSaveAndRedirect } from '../form/use-auto-save-and-redirect'; import { AtLimitNotice } from './at-limit-notice'; @@ -61,7 +61,6 @@ export function XUsageContent( { return (

    { label }

    - { /* Show counter + progress bar when not at limit, or when at limit and dismissed */ } { ( ! isAtLimit || isDismissed ) && ( <> @@ -77,15 +76,12 @@ export function XUsageContent( { ) } - { /* At-limit notice for free plan */ } { isAtLimit && ! isPaid && ! isDismissed && ( ) } - { /* At-limit notice for paid plan */ } { isAtLimit && isPaid && ! isDismissed && } - { /* Near-limit warning for free plan (not at limit) */ } { isNearLimit && ! isAtLimit && ! isPaid && (

    @@ -96,17 +92,16 @@ export function XUsageContent( { ) }   { ! isSimpleSite() && ( - + { sprintf( /* translators: %d: paid plan share limit */ __( 'Unlock %d shares per month with a paid plan', 'jetpack-publicize-pkg' ), PAID_PLAN_LIMIT ) } - + ) }

    ) } - { /* At-limit inline text for free plan (when notice is dismissed) */ } { isAtLimit && ! isPaid && isDismissed && (

    @@ -117,17 +112,16 @@ export function XUsageContent( { ) }   { ! isSimpleSite() && ( - + { sprintf( /* translators: %d: paid plan share limit */ __( 'Unlock %d shares per month with a paid plan', 'jetpack-publicize-pkg' ), PAID_PLAN_LIMIT ) } - + ) }

    ) } - { /* Reset date for paid plan */ } { isPaid && resetDate && (

    @@ -147,7 +141,6 @@ export function XUsageContent( { ) }

    ) } - { /* Bottom text when at limit (free plan, notice shown) */ } { isAtLimit && ! isPaid && ! isDismissed && (

    diff --git a/projects/packages/publicize/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/packages/publicize/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/packages/publicize/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/packages/search/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/packages/search/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/packages/search/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/packages/search/src/dashboard/components/pages/sections/plan-usage-section.jsx b/projects/packages/search/src/dashboard/components/pages/sections/plan-usage-section.jsx index 5d971646e331..d6690555e4c3 100644 --- a/projects/packages/search/src/dashboard/components/pages/sections/plan-usage-section.jsx +++ b/projects/packages/search/src/dashboard/components/pages/sections/plan-usage-section.jsx @@ -1,7 +1,7 @@ import { ContextualUpgradeTrigger, ThemeProvider } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { useState, useCallback, useMemo } from 'react'; import DonutMeterContainer, { formatNumber } from '../../donut-meter-container'; import PlanSummary from './plan-summary'; @@ -405,7 +405,8 @@ const AboutPlanLimits = () => { ), { jpPlanLimits: ( - ) } - - - { ! hasUploadedChapters && hasIncompleteChapters && ( ) } - { hasUploadedChapters && (

    @@ -108,14 +99,16 @@ export default function DetailsPanel( { ), { link: ( - + ), } ) }

    ) } - { !! updateError && ( { __( 'Error updating the video details.', 'jetpack-videopress-pkg' ) } diff --git a/projects/packages/videopress/src/client/block-editor/blocks/video/components/playback-panel/index.tsx b/projects/packages/videopress/src/client/block-editor/blocks/video/components/playback-panel/index.tsx index 619232154aee..06f70dc9bbf6 100644 --- a/projects/packages/videopress/src/client/block-editor/blocks/video/components/playback-panel/index.tsx +++ b/projects/packages/videopress/src/client/block-editor/blocks/video/components/playback-panel/index.tsx @@ -1,12 +1,13 @@ /** *External dependencies */ -import { ExternalLink, PanelBody, ToggleControl } from '@wordpress/components'; +import { PanelBody, ToggleControl } from '@wordpress/components'; import { createInterpolateElement, useCallback } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; /** * Internal dependencies */ +import { Link } from '@wordpress/ui'; import { VideoControlProps } from '../../types'; import styles from './style.module.scss'; /** @@ -79,7 +80,6 @@ export default function PlaybackPanel( { attributes, setAttributes }: VideoContr help={ } __nextHasNoMarginBottom={ true } /> - - - - - - { createInterpolateElement( __( 'Send us your VideoPress feedback', 'jetpack-videopress-pkg' ), { - a: , + a: , } ) } diff --git a/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/index.js b/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/index.js index 12202fbd2f58..14cc8b4b45fd 100644 --- a/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/index.js +++ b/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/index.js @@ -4,12 +4,13 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; import apiFetch from '@wordpress/api-fetch'; import { BlockIcon, MediaPlaceholder } from '@wordpress/block-editor'; -import { Spinner, withNotices, Button, ExternalLink } from '@wordpress/components'; +import { Spinner, withNotices, Button } from '@wordpress/components'; import { useCallback, useState, useEffect, createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; /** * Internal dependencies */ +import { Link } from '@wordpress/ui'; import useResumableUploader from '../../../../../hooks/use-resumable-uploader'; import { uploadFromLibrary } from '../../../../../hooks/use-uploader'; import { isSiteConnected } from '../../../../../lib/connection'; @@ -269,7 +270,9 @@ const VideoPressUploader = ( { ), { connectLink: , - moreAboutVideoPressLink: , + moreAboutVideoPressLink: ( + + ), } ); diff --git a/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/uploader-error.js b/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/uploader-error.js index 27d795ec9592..5b080a3644b6 100644 --- a/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/uploader-error.js +++ b/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/uploader-error.js @@ -2,9 +2,10 @@ * External dependencies */ import { getRequiredPlan, getSiteFragment } from '@automattic/jetpack-shared-extension-utils'; -import { Button, ExternalLink } from '@wordpress/components'; +import { Button } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { PlaceholderWrapper } from '../../edit'; const getErrorMessage = uploadErrorData => { @@ -27,7 +28,9 @@ const getErrorMessage = uploadErrorData => { 'jetpack-videopress-pkg' ), { - upgradeLink: , + upgradeLink: ( + + ), } ); } @@ -41,7 +44,10 @@ const getErrorMessage = uploadErrorData => { ), { settingsLink: ( - + ), } ); diff --git a/projects/packages/videopress/src/client/block-editor/extend/core-embed/edit.js b/projects/packages/videopress/src/client/block-editor/extend/core-embed/edit.js index e0d32e9427c9..df0291da2889 100644 --- a/projects/packages/videopress/src/client/block-editor/extend/core-embed/edit.js +++ b/projects/packages/videopress/src/client/block-editor/extend/core-embed/edit.js @@ -4,11 +4,12 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; import { Warning, store as blockEditorStore } from '@wordpress/block-editor'; import { createBlock } from '@wordpress/blocks'; -import { Button, ExternalLink } from '@wordpress/components'; +import { Button } from '@wordpress/components'; import { createHigherOrderComponent } from '@wordpress/compose'; import { useDispatch } from '@wordpress/data'; import { useEffect, createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; /** * Internal dependencies */ @@ -64,7 +65,9 @@ const withCoreEmbedVideoPressBlock = createHigherOrderComponent( CoreEmbedBlockE 'jetpack-videopress-pkg' ), { - moreAboutVideoPressLink: , + moreAboutVideoPressLink: ( + + ), } ); diff --git a/projects/packages/videopress/src/client/block-editor/extend/core-video/index.js b/projects/packages/videopress/src/client/block-editor/extend/core-video/index.js index 4379618c27a7..1c6af563a2fe 100644 --- a/projects/packages/videopress/src/client/block-editor/extend/core-video/index.js +++ b/projects/packages/videopress/src/client/block-editor/extend/core-video/index.js @@ -4,12 +4,14 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; import { Warning, store as blockEditorStore } from '@wordpress/block-editor'; import { createBlock } from '@wordpress/blocks'; -import { Button, ExternalLink } from '@wordpress/components'; +import { Button } from '@wordpress/components'; import { createHigherOrderComponent } from '@wordpress/compose'; import { useDispatch } from '@wordpress/data'; import { useEffect, createInterpolateElement, useState } from '@wordpress/element'; import { addFilter } from '@wordpress/hooks'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; + /** * Internal dependencies */ @@ -112,7 +114,9 @@ function JetpackCoreVideoDeprecation( { BlockListBlock, ...props } ) { 'jetpack-videopress-pkg' ), { - moreAboutVideoPressLink: , + moreAboutVideoPressLink: ( + + ), } ); diff --git a/projects/packages/yoast-promo/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/packages/yoast-promo/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/packages/yoast-promo/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/packages/yoast-promo/package.json b/projects/packages/yoast-promo/package.json index 924129e2c9a5..82ae06f575af 100644 --- a/projects/packages/yoast-promo/package.json +++ b/projects/packages/yoast-promo/package.json @@ -35,6 +35,7 @@ "@wordpress/element": "6.44.0", "@wordpress/i18n": "6.17.0", "@wordpress/plugins": "7.44.0", + "@wordpress/ui": "0.11.0", "gridicons": "3.4.2", "react": "18.3.1", "react-dom": "18.3.1" diff --git a/projects/packages/yoast-promo/src/js/index.jsx b/projects/packages/yoast-promo/src/js/index.jsx index c5ff1774862a..03d14b7bf41e 100644 --- a/projects/packages/yoast-promo/src/js/index.jsx +++ b/projects/packages/yoast-promo/src/js/index.jsx @@ -1,11 +1,12 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; import { isSimpleSite } from '@automattic/jetpack-script-data'; import { getSiteFragment } from '@automattic/jetpack-shared-extension-utils'; -import { PanelRow, ExternalLink, Button } from '@wordpress/components'; +import { PanelRow, Button } from '@wordpress/components'; import { useSelect } from '@wordpress/data'; import { PluginPrePublishPanel } from '@wordpress/editor'; import { useCallback, useState } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import Gridicon from 'gridicons'; import { JetpackYoastLogos } from './JetpackYoastLogos'; import { createStore } from './utils'; @@ -85,14 +86,15 @@ export const YoastPromoContentFree = () => ( ) } - { __( 'Get Yoast SEO', 'jetpack-yoast-promo' ) } - + ); @@ -112,14 +114,15 @@ const YoastPromoContentPremium = () => ( ) } - { __( 'Get Yoast SEO Premium', 'jetpack-yoast-promo' ) } - + ); diff --git a/projects/packages/yoast-promo/webpack.config.js b/projects/packages/yoast-promo/webpack.config.js index c6dc847cf852..59e7720c9965 100644 --- a/projects/packages/yoast-promo/webpack.config.js +++ b/projects/packages/yoast-promo/webpack.config.js @@ -28,6 +28,9 @@ module.exports = [ includeNodeModules: [ '@automattic/jetpack-' ], } ), + // Workarounds for non-extracted `@wordpress/*` packages. + ...jetpackWebpackConfig.BundledWpPkgsTranspileRules(), + // Handle CSS. jetpackWebpackConfig.CssRule( { extensions: [ 'css', 'sass', 'scss' ], diff --git a/projects/plugins/automattic-for-agencies-client/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link b/projects/plugins/automattic-for-agencies-client/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link new file mode 100644 index 000000000000..948c4788767f --- /dev/null +++ b/projects/plugins/automattic-for-agencies-client/changelog/update-eslint-use_wp_recommended_components_link_instead_of_external_link @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Components: Use Link from `@wordpress/ui` instead of ExternalLink. diff --git a/projects/plugins/automattic-for-agencies-client/package.json b/projects/plugins/automattic-for-agencies-client/package.json index 3fa913097323..2dc4247989ff 100644 --- a/projects/plugins/automattic-for-agencies-client/package.json +++ b/projects/plugins/automattic-for-agencies-client/package.json @@ -36,6 +36,7 @@ "@wordpress/date": "5.44.0", "@wordpress/element": "6.44.0", "@wordpress/i18n": "6.17.0", + "@wordpress/ui": "0.11.0", "clsx": "2.1.1", "react": "18.3.1", "react-dom": "18.3.1" diff --git a/projects/plugins/automattic-for-agencies-client/src/js/components/connection-card/index.jsx b/projects/plugins/automattic-for-agencies-client/src/js/components/connection-card/index.jsx index 519c25f369bc..fbbbd2222b69 100644 --- a/projects/plugins/automattic-for-agencies-client/src/js/components/connection-card/index.jsx +++ b/projects/plugins/automattic-for-agencies-client/src/js/components/connection-card/index.jsx @@ -1,8 +1,8 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; import { ConnectButton } from '@automattic/jetpack-connection'; -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import { useCallback, useState } from 'react'; import BrandedCard from '../branded-card'; @@ -67,7 +67,8 @@ function ConnectionContent( { onShowSharingDetailsClick } ) { { strong: , tosLink: ( - diff --git a/projects/plugins/automattic-for-agencies-client/webpack.config.js b/projects/plugins/automattic-for-agencies-client/webpack.config.js index febd4b8150cf..0194c4949867 100644 --- a/projects/plugins/automattic-for-agencies-client/webpack.config.js +++ b/projects/plugins/automattic-for-agencies-client/webpack.config.js @@ -33,6 +33,9 @@ module.exports = [ includeNodeModules: [ '@automattic/jetpack-' ], } ), + // Workarounds for non-extracted `@wordpress/*` packages. + ...jetpackWebpackConfig.BundledWpPkgsTranspileRules(), + // Handle CSS. jetpackWebpackConfig.CssRule( { extensions: [ 'css', 'sass', 'scss' ], diff --git a/projects/plugins/boost/app/assets/src/js/features/cornerstone-pages/meta/meta.tsx b/projects/plugins/boost/app/assets/src/js/features/cornerstone-pages/meta/meta.tsx index b3c714efc6dc..62c3fae62a95 100644 --- a/projects/plugins/boost/app/assets/src/js/features/cornerstone-pages/meta/meta.tsx +++ b/projects/plugins/boost/app/assets/src/js/features/cornerstone-pages/meta/meta.tsx @@ -10,10 +10,10 @@ import { recordBoostEvent } from '$lib/utils/analytics'; import getSupportLink from '$lib/utils/get-support-link'; import { isSameSiteUrl } from '$lib/utils/is-same-site-url'; import { Button, getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink, Tooltip } from '@wordpress/components'; +import { Tooltip } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, _n, sprintf } from '@wordpress/i18n'; -import { Notice } from '@wordpress/ui'; +import { Notice, Link } from '@wordpress/ui'; import type { FC, ReactNode } from 'react'; import { useEffect, useMemo, useState } from 'react'; import { @@ -34,7 +34,8 @@ export const MetaError = () => ( ), { link: ( - { recordBoostEvent( 'cornerstone_pages_properties_failed', {} ); @@ -139,7 +140,8 @@ const Meta = () => { ), { link: ( - { recordBoostEvent( 'clicked_cornerstone_pages_learn_more', {} ); diff --git a/projects/plugins/boost/app/assets/src/js/features/cornerstone-pages/prerender/prerender.tsx b/projects/plugins/boost/app/assets/src/js/features/cornerstone-pages/prerender/prerender.tsx index 81c5fa37ce57..82bcd0cff65c 100644 --- a/projects/plugins/boost/app/assets/src/js/features/cornerstone-pages/prerender/prerender.tsx +++ b/projects/plugins/boost/app/assets/src/js/features/cornerstone-pages/prerender/prerender.tsx @@ -1,8 +1,11 @@ import { __ } from '@wordpress/i18n'; -import { ExternalLink, ToggleControl } from '@wordpress/components'; +import { ToggleControl } from '@wordpress/components'; import styles from './prerender.module.scss'; import { recordBoostEvent } from '$lib/utils/analytics'; import { createInterpolateElement, useState } from '@wordpress/element'; + +import { Link } from '@wordpress/ui'; + import { getRedirectUrl, IconTooltip } from '@automattic/jetpack-components'; import { useSingleModuleState } from '$features/module/lib/stores'; import { useNotices } from '$features/notice/context'; @@ -92,7 +95,7 @@ const PrerenderWarningMessage = ( { children }: BypassPatternsExampleProps ) => ) }
    { createInterpolateElement( __( 'Learn more', 'jetpack-boost' ), { - link: , + link: , } ) } diff --git a/projects/plugins/boost/app/assets/src/js/features/critical-css/show-stopper-error/show-stopper-error.tsx b/projects/plugins/boost/app/assets/src/js/features/critical-css/show-stopper-error/show-stopper-error.tsx index 1488de383de0..ddc1c47ba055 100644 --- a/projects/plugins/boost/app/assets/src/js/features/critical-css/show-stopper-error/show-stopper-error.tsx +++ b/projects/plugins/boost/app/assets/src/js/features/critical-css/show-stopper-error/show-stopper-error.tsx @@ -1,11 +1,10 @@ -import { ExternalLink } from '@wordpress/components'; import { __, sprintf } from '@wordpress/i18n'; -import { Notice } from '@wordpress/ui'; import FoldingElement from '../folding-element/folding-element'; import { ErrorSet, getPrimaryErrorSet } from '../lib/critical-css-errors'; import { CriticalCssState } from '../lib/stores/critical-css-state-types'; import { describeErrorSet, suggestion } from '../lib/describe-critical-css-recommendations'; import { createInterpolateElement } from '@wordpress/element'; +import { Notice, Link } from '@wordpress/ui'; import getSupportLinkCriticalCss from '$lib/utils/get-support-link-critical-css'; import NumberedList from '../numbered-list/numbered-list'; import getCriticalCssErrorSetInterpolateVars from '$lib/utils/get-critical-css-error-set-interpolate-vars'; @@ -119,7 +118,8 @@ const DocumentationSection = ( {

    { createInterpolateElement( message, { link: ( - { recordBoostEvent( 'critical_css_learn_more', {} ); @@ -203,7 +203,8 @@ const OtherErrors = ( { cssState, supportLink }: ShowStopperErrorTypes ) => { { __( 'Refresh', 'jetpack-boost' ) } ) : ( - { @@ -211,7 +212,7 @@ const OtherErrors = ( { cssState, supportLink }: ShowStopperErrorTypes ) => { } } > { __( 'Contact Support', 'jetpack-boost' ) } - + ) } ) } diff --git a/projects/plugins/boost/app/assets/src/js/features/lcp/status/error-details.tsx b/projects/plugins/boost/app/assets/src/js/features/lcp/status/error-details.tsx index ee5b9356bb34..939c606cb1c0 100644 --- a/projects/plugins/boost/app/assets/src/js/features/lcp/status/error-details.tsx +++ b/projects/plugins/boost/app/assets/src/js/features/lcp/status/error-details.tsx @@ -1,10 +1,9 @@ import FoldingElement from '$features/critical-css/folding-element/folding-element'; import { recordBoostEvent } from '$lib/utils/analytics'; import { getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, _n, sprintf } from '@wordpress/i18n'; -import { Notice } from '@wordpress/ui'; +import { Notice, Link } from '@wordpress/ui'; import { useLcpState } from '../lib/stores/lcp-state'; import { LcpErrorDetails } from '../lib/stores/lcp-state-types'; import styles from './error-details.module.scss'; @@ -83,8 +82,9 @@ const PageError = ( { url, error }: PageErrorProps ) => { return (

  • - { getErrorLabel( error ) } ({ url }){ ' ' } - { } } > { __( 'Learn more', 'jetpack-boost' ) } - +
    • ); }; diff --git a/projects/plugins/boost/app/assets/src/js/features/module/module.tsx b/projects/plugins/boost/app/assets/src/js/features/module/module.tsx index 4902e907b46f..b5f3a97f12c2 100644 --- a/projects/plugins/boost/app/assets/src/js/features/module/module.tsx +++ b/projects/plugins/boost/app/assets/src/js/features/module/module.tsx @@ -1,5 +1,4 @@ import { getRedirectUrl, ToggleControl } from '@automattic/jetpack-components'; -import { Notice } from '@wordpress/ui'; import { useEffect } from 'react'; import { useSingleModuleState } from './lib/stores'; import styles from './module.module.scss'; @@ -8,7 +7,7 @@ import { __ } from '@wordpress/i18n'; import { isWoaHosting } from '$lib/utils/hosting'; import { useNotices } from '$features/notice/context'; import { createInterpolateElement } from '@wordpress/element'; -import { ExternalLink } from '@wordpress/components'; +import { Notice, Link } from '@wordpress/ui'; import Pill from '$features/ui/pill/pill'; import type { ReactNode } from 'react'; @@ -153,7 +152,8 @@ export default ( props: ModuleProps ) => { ), { link: ( - ), diff --git a/projects/plugins/boost/app/assets/src/js/features/page-cache/health/error-notices.tsx b/projects/plugins/boost/app/assets/src/js/features/page-cache/health/error-notices.tsx index 77dc37b326c8..4923db4802f7 100644 --- a/projects/plugins/boost/app/assets/src/js/features/page-cache/health/error-notices.tsx +++ b/projects/plugins/boost/app/assets/src/js/features/page-cache/health/error-notices.tsx @@ -2,10 +2,9 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; import { createInterpolateElement } from '@wordpress/element'; import styles from './health.module.scss'; import { __, sprintf } from '@wordpress/i18n'; +import { Notice, Link } from '@wordpress/ui'; import { PageCacheError } from '$lib/stores/page-cache'; import { ReactNode } from 'react'; -import { ExternalLink } from '@wordpress/components'; -import { Notice } from '@wordpress/ui'; type NoticeProps = { onClose: () => void; @@ -29,7 +28,7 @@ export const FailedSettingsWriteNotice = ( { onClose }: NoticeProps ) => { 'jetpack-boost' ), { - link: , + link: , } ) }

    @@ -62,7 +61,7 @@ export const WPContentNotWritableNotice = ( { onClose }: NoticeProps ) => { ), { code: , - link: , + link: , } ) }

    @@ -84,7 +83,7 @@ export const NotUsingPermalinksNotice = ( { onClose }: NoticeProps ) => { 'jetpack-boost' ), { - link: , + link: , } ) }

    @@ -106,7 +105,7 @@ export const AdvancedCacheIncompatibleNotice = ( { onClose }: NoticeProps ) => { 'jetpack-boost' ), { - link: , + link: , } ) }

    @@ -136,7 +135,9 @@ export const AdvancedCacheForSuperCacheNotice = ( { ), { code: , - link: , + link: ( + + ), } ) }

    @@ -160,7 +161,10 @@ export const UnableToWriteToAdvancedCacheNotice = ( { onClose }: NoticeProps ) = ), { link: ( - + ), } ) } @@ -191,7 +195,7 @@ export const WPCacheDefinedNotTrueNotice = ( { onClose }: NoticeProps ) => { ), { code: , - link: , + link: , } ) }

    @@ -248,7 +252,7 @@ export const WPConfigNotWritableNotice = ( { onClose }: NoticeProps ) => { ), { code: , - link: , + link: , } ) }

    diff --git a/projects/plugins/boost/app/assets/src/js/features/page-cache/meta/meta.tsx b/projects/plugins/boost/app/assets/src/js/features/page-cache/meta/meta.tsx index 7e9c044087e2..b5f7ec5fc779 100644 --- a/projects/plugins/boost/app/assets/src/js/features/page-cache/meta/meta.tsx +++ b/projects/plugins/boost/app/assets/src/js/features/page-cache/meta/meta.tsx @@ -1,7 +1,7 @@ import { Button, IconTooltip, getRedirectUrl } from '@automattic/jetpack-components'; -import { Notice } from '@wordpress/ui'; import { createInterpolateElement } from '@wordpress/element'; import { __, _n, sprintf } from '@wordpress/i18n'; +import { Notice, Link as WPLink } from '@wordpress/ui'; import Lightning from '$svg/lightning'; import styles from './meta.module.scss'; import { useEffect, useState } from 'react'; @@ -14,7 +14,6 @@ import ErrorBoundary from '$features/error-boundary/error-boundary'; import ErrorNotice from '$features/error-notice/error-notice'; import { recordBoostEvent } from '$lib/utils/analytics'; import CollapsibleMeta from '$features/ui/collapsible-meta/collapsible-meta'; -import { ExternalLink } from '@wordpress/components'; import type { ChangeEvent, ReactNode } from 'react'; const Meta = () => { @@ -239,7 +238,7 @@ const BypassPatterns = ( { __( 'See an example or learn more.', 'jetpack-boost' ), { help: , // children are passed after the interpolation. - link: , + link: , } ) } diff --git a/projects/plugins/boost/app/assets/src/js/layout/settings-page/tips/tips.tsx b/projects/plugins/boost/app/assets/src/js/layout/settings-page/tips/tips.tsx index c899cce68318..75f588ae3f76 100644 --- a/projects/plugins/boost/app/assets/src/js/layout/settings-page/tips/tips.tsx +++ b/projects/plugins/boost/app/assets/src/js/layout/settings-page/tips/tips.tsx @@ -1,9 +1,9 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import styles from './tips.module.scss'; import { recordBoostEvent } from '$lib/utils/analytics'; -import { ExternalLink } from '@wordpress/components'; const Tips = () => { const pingdomLink = getRedirectUrl( 'jetpack-boost-pingdom' ); @@ -25,7 +25,8 @@ const Tips = () => { ), { link: ( - recordBoostEvent( 'pingdom_link_clicked', {} ) } href={ pingdomLink } /> @@ -44,7 +45,8 @@ const Tips = () => { ), { link: ( - recordBoostEvent( 'why_speed_link_clicked', {} ) } href={ whySpeedLink } /> diff --git a/projects/plugins/boost/app/assets/src/js/lib/utils/external-link-interpolate-var.tsx b/projects/plugins/boost/app/assets/src/js/lib/utils/external-link-interpolate-var.tsx index 8313e770ad4a..9adb2653a025 100644 --- a/projects/plugins/boost/app/assets/src/js/lib/utils/external-link-interpolate-var.tsx +++ b/projects/plugins/boost/app/assets/src/js/lib/utils/external-link-interpolate-var.tsx @@ -1,4 +1,4 @@ -import { ExternalLink } from '@wordpress/components'; +import { Link } from '@wordpress/ui'; /** * Generates an Interpolate var for an external link (with target and rel @@ -9,6 +9,6 @@ import { ExternalLink } from '@wordpress/components'; */ export default function externalLinkInterpolateVar( href: string, elementKey = 'link' ) { return { - [ elementKey ]: , + [ elementKey ]: , }; } diff --git a/projects/plugins/boost/app/assets/src/js/lib/utils/get-critical-css-error-set-interpolate-vars.tsx b/projects/plugins/boost/app/assets/src/js/lib/utils/get-critical-css-error-set-interpolate-vars.tsx index 43ef4ef5dd38..8a4f21951710 100644 --- a/projects/plugins/boost/app/assets/src/js/lib/utils/get-critical-css-error-set-interpolate-vars.tsx +++ b/projects/plugins/boost/app/assets/src/js/lib/utils/get-critical-css-error-set-interpolate-vars.tsx @@ -1,4 +1,3 @@ -import { ExternalLink } from '@wordpress/components'; import { useNavigate } from 'react-router'; import actionLinkInterpolateVar from '$lib/utils/action-link-interpolate-var'; import { InterpolateVars } from '$lib/utils/interplate-vars-types'; @@ -7,6 +6,7 @@ import { useRegenerateCriticalCssAction } from '$features/critical-css/lib/store import { suggestion } from '$features/critical-css/lib/describe-critical-css-recommendations'; import { ErrorSet } from '$features/critical-css/lib/critical-css-errors'; import { recordBoostEvent } from './analytics'; +import { Link } from '@wordpress/ui'; function getCriticalCssErrorSetInterpolateVars( errorSet: ErrorSet ) { const regenerateAction = useRegenerateCriticalCssAction(); @@ -31,7 +31,7 @@ function getCriticalCssErrorSetInterpolateVars( errorSet: ErrorSet ) { }; if ( 'listLink' in suggestion( errorSet ) ) { - interpolateVars.link = ; + interpolateVars.link = ; } return interpolateVars; diff --git a/projects/plugins/boost/app/assets/src/js/pages/index/index.tsx b/projects/plugins/boost/app/assets/src/js/pages/index/index.tsx index 5a4a57a4c335..ef692583fee9 100644 --- a/projects/plugins/boost/app/assets/src/js/pages/index/index.tsx +++ b/projects/plugins/boost/app/assets/src/js/pages/index/index.tsx @@ -16,9 +16,9 @@ import { recordBoostEvent } from '$lib/utils/analytics'; import { getRedirectUrl } from '@automattic/jetpack-components'; import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import styles from './index.module.scss'; import LcpModule from '$features/lcp/lcp'; -import { ExternalLink } from '@wordpress/components'; const Index = () => { const criticalCssLink = getRedirectUrl( 'jetpack-boost-critical-css' ); @@ -55,7 +55,9 @@ const Index = () => { 'jetpack-boost' ), { - link: , + link: ( + + ), } ) }

    @@ -105,7 +107,9 @@ const Index = () => { 'jetpack-boost' ), { - link: , + link: ( + + ), } ) }

    @@ -139,7 +143,8 @@ const Index = () => { ), { link: ( - recordBoostEvent( 'defer_js_link_clicked', {} ) } href={ deferJsLink } /> @@ -181,7 +186,6 @@ const Index = () => { -
    diff --git a/projects/plugins/boost/app/assets/src/js/pages/purchase-success/purchase-success.tsx b/projects/plugins/boost/app/assets/src/js/pages/purchase-success/purchase-success.tsx index be386f16cc63..b0d9901fb0b7 100644 --- a/projects/plugins/boost/app/assets/src/js/pages/purchase-success/purchase-success.tsx +++ b/projects/plugins/boost/app/assets/src/js/pages/purchase-success/purchase-success.tsx @@ -1,7 +1,7 @@ import { getRedirectUrl, Button } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement, useEffect } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { useSingleModuleState } from '$features/module/lib/stores'; import { useNavigate } from 'react-router'; import CardPage from '$layout/card-page/card-page'; @@ -86,7 +86,7 @@ const PurchaseSuccess: FC = () => { 'jetpack-boost' ), { - link: , + link: , strong: , } ) @@ -94,9 +94,9 @@ const PurchaseSuccess: FC = () => {

    - + { __( 'Learn more about Boost features and upgrades', 'jetpack-boost' ) } - +

    @@ -147,13 +148,14 @@ class MyPlanBody extends Component { compact rna > - { __( 'View your security activity', 'jetpack' ) } - + @@ -206,9 +208,9 @@ class MyPlanBody extends Component { compact rna > - + { __( 'View your security dashboard', 'jetpack' ) } - + ) : ( ) } @@ -377,14 +380,15 @@ class MyPlanBody extends Component { compact rna > - { __( 'View settings', 'jetpack' ) } - + ) } @@ -462,13 +466,14 @@ class MyPlanBody extends Component { compact rna > - { __( 'View your site activity', 'jetpack' ) } - + @@ -498,13 +503,14 @@ class MyPlanBody extends Component { compact rna > - { __( 'View your earnings', 'jetpack' ) } - + ) : ( @@ -585,13 +592,14 @@ class MyPlanBody extends Component { compact rna > - { __( 'Schedule posts', 'jetpack' ) } - + ) : ( @@ -710,13 +719,14 @@ class MyPlanBody extends Component { ) }

    @@ -749,13 +759,14 @@ class MyPlanBody extends Component { compact rna > - { __( 'Start sharing', 'jetpack' ) } - + ) : ( @@ -831,9 +843,9 @@ class MyPlanBody extends Component { compact rna > - + { __( 'Search support docs', 'jetpack' ) } - + diff --git a/projects/plugins/jetpack/_inc/client/my-plan/my-plan-header/index.js b/projects/plugins/jetpack/_inc/client/my-plan/my-plan-header/index.js index a77f8312ae83..dc10c16af2a1 100644 --- a/projects/plugins/jetpack/_inc/client/my-plan/my-plan-header/index.js +++ b/projects/plugins/jetpack/_inc/client/my-plan/my-plan-header/index.js @@ -1,7 +1,7 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, _n, _x, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import { isEmpty } from 'lodash'; import PropTypes from 'prop-types'; @@ -587,9 +587,9 @@ class MyPlanHeader extends Component { > { showPurchasesLink && ( ) } diff --git a/projects/plugins/jetpack/_inc/client/privacy/index.jsx b/projects/plugins/jetpack/_inc/client/privacy/index.jsx index 0d358dec5b52..37fda7e8326c 100644 --- a/projects/plugins/jetpack/_inc/client/privacy/index.jsx +++ b/projects/plugins/jetpack/_inc/client/privacy/index.jsx @@ -1,7 +1,7 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, _x } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import PropTypes from 'prop-types'; import { Component } from 'react'; import { connect } from 'react-redux'; @@ -120,7 +120,8 @@ class Privacy extends Component { ), { cookiePolicyLink: ( - { { props.isFeatureActive ? ( <> { configLinkIsExternal ? ( - { configureButtonLabel } - + ) : (
    - { ctaLabel } - +
    diff --git a/projects/plugins/jetpack/_inc/client/recommendations/feature-utils.js b/projects/plugins/jetpack/_inc/client/recommendations/feature-utils.js index 1db7ab1a3fe8..22eb61dbc052 100644 --- a/projects/plugins/jetpack/_inc/client/recommendations/feature-utils.js +++ b/projects/plugins/jetpack/_inc/client/recommendations/feature-utils.js @@ -305,7 +305,7 @@ export const getStepContent = ( state, stepSlug ) => { return { question: __( 'Get more views for your new page.', 'jetpack' ), description: __( - 'Fast websites mean more page visits and conversions. Even a one-second delay in loading times can reduce conversion rates by 20%.

    Make your site blazing fast with Jetpack Boost’s simple dashboard and acceleration tool:', + 'Fast websites mean more page visits and conversions. Even a one-second delay in loading times can reduce conversion rates by 20%.

    Make your site blazing fast with Jetpack Boost’s simple dashboard and acceleration tool:', 'jetpack' ), descriptionList: [ @@ -321,7 +321,7 @@ export const getStepContent = ( state, stepSlug ) => { progressValue: '76', question: __( 'Would you like to turn site visitors into subscribers?', 'jetpack' ), description: __( - 'The Jetpack Newsletter Form combined with Creative Mail by Constant Contact can help automatically gather subscribers and send them beautiful emails. Learn more', + 'The Jetpack Newsletter Form combined with Creative Mail by Constant Contact can help automatically gather subscribers and send them beautiful emails. Learn more', 'jetpack' ), descriptionLink: getRedirectUrl( 'jetpack-support-jetpack-blocks-newsletter-sign-up' ), @@ -333,7 +333,7 @@ export const getStepContent = ( state, stepSlug ) => { progressValue: '70', question: __( 'Send subscribers your latest blog posts via email?', 'jetpack' ), description: __( - 'With Jetpack Newsletter you can keep your audience engaged by automatically sending your content via email. Learn more', + 'With Jetpack Newsletter you can keep your audience engaged by automatically sending your content via email. Learn more', 'jetpack' ), descriptionLink: getRedirectUrl( 'jetpack-newsletter-landing' ), @@ -348,7 +348,7 @@ export const getStepContent = ( state, stepSlug ) => { 'jetpack' ), description: __( - 'If your site ever goes down, Downtime Monitoring will send you an email or push notitification to let you know. Learn more', + 'If your site ever goes down, Downtime Monitoring will send you an email or push notitification to let you know. Learn more', 'jetpack' ), descriptionLink: getRedirectUrl( 'jetpack-support-monitor' ), @@ -363,7 +363,7 @@ export const getStepContent = ( state, stepSlug ) => { 'jetpack' ), description: __( - 'Displaying Related Posts at the end of your content keeps visitors engaged and on your site. Learn more', + 'Displaying Related Posts at the end of your content keeps visitors engaged and on your site. Learn more', 'jetpack' ), descriptionLink: getRedirectUrl( 'jetpack-support-related-posts' ), @@ -375,7 +375,7 @@ export const getStepContent = ( state, stepSlug ) => { progressValue: '88', question: __( 'Would you like your site to load faster?', 'jetpack' ), description: __( - 'Faster sites get better ranking in search engines and help keep visitors on your site longer. Jetpack will automatically optimize and load your images and files from our global Content Delivery Network (CDN). Learn more', + 'Faster sites get better ranking in search engines and help keep visitors on your site longer. Jetpack will automatically optimize and load your images and files from our global Content Delivery Network (CDN). Learn more', 'jetpack' ), descriptionLink: getRedirectUrl( 'jetpack-support-site-accelerator' ), @@ -389,7 +389,7 @@ export const getStepContent = ( state, stepSlug ) => { 'jetpack' ), description: __( - 'It’s easy to share your content to a wider audience by connecting your social media accounts to Jetpack. When you publish a post, it will automatically appear on all your favorite platforms. Best of all, it’s free. Learn more', + 'It’s easy to share your content to a wider audience by connecting your social media accounts to Jetpack. When you publish a post, it will automatically appear on all your favorite platforms. Best of all, it’s free. Learn more', 'jetpack' ), descriptionLink: getRedirectUrl( 'jetpack-blog-social-sharing' ), @@ -399,7 +399,7 @@ export const getStepContent = ( state, stepSlug ) => { return { question: __( 'With more plugins comes more responsibility.', 'jetpack' ), description: __( - 'As you add plugins to your site, you have to start thinking about vulnerabilities.

    Jetpack Protect is a free security solution for WordPress that runs automated scans on your site and warns you about vulnerabilities.

    Focus on running your business while we protect your site with Jetpack Protect. Learn More.', + 'As you add plugins to your site, you have to start thinking about vulnerabilities.

    Jetpack Protect is a free security solution for WordPress that runs automated scans on your site and warns you about vulnerabilities.

    Focus on running your business while we protect your site with Jetpack Protect. Learn More.', 'jetpack' ), descriptionLink: getRedirectUrl( 'jetpack-protect-assistant-recommendation' ), @@ -423,7 +423,7 @@ export const getStepContent = ( state, stepSlug ) => { 'jetpack' ), description: __( - 'No matter your business, adding videos to your site is essential for success. Jetpack VideoPress offers HD, ad-free video hosting, so you can keep the focus on your content. Try it for free or upgrade for more space. Learn more', + 'No matter your business, adding videos to your site is essential for success. Jetpack VideoPress offers HD, ad-free video hosting, so you can keep the focus on your content. Try it for free or upgrade for more space. Learn more', 'jetpack' ), descriptionLink: getRedirectUrl( 'jetpack-videopress' ), @@ -434,7 +434,7 @@ export const getStepContent = ( state, stepSlug ) => { progressValue: '40', question: __( 'Would you like WooCommerce to power your store?', 'jetpack' ), description: __( - 'We’re partnered with WooCommerce — a customizable, open-source eCommerce platform built for WordPress. It’s everything you need to start selling products today. Learn more', + 'We’re partnered with WooCommerce — a customizable, open-source eCommerce platform built for WordPress. It’s everything you need to start selling products today. Learn more', 'jetpack' ), descriptionLink: getRedirectUrl( 'woocommerce-features-landing' ), diff --git a/projects/plugins/jetpack/_inc/client/recommendations/prompts/feature-prompt/index.jsx b/projects/plugins/jetpack/_inc/client/recommendations/prompts/feature-prompt/index.jsx index 18350bc163db..29ccf996865e 100644 --- a/projects/plugins/jetpack/_inc/client/recommendations/prompts/feature-prompt/index.jsx +++ b/projects/plugins/jetpack/_inc/client/recommendations/prompts/feature-prompt/index.jsx @@ -1,7 +1,7 @@ import { ProgressBar } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { Fragment, useCallback, useEffect, useMemo } from 'react'; import { connect } from 'react-redux'; import Button from 'components/button'; @@ -170,7 +170,7 @@ const FeaturePromptComponent = props => { description={ createInterpolateElement( description, { br:
    , strong: , - ExternalLink: , + Link: , } ) } content={ descriptionList || descriptionSecondary ? ( @@ -200,14 +200,15 @@ const FeaturePromptComponent = props => {
    { configLinkIsExternal ? ( - { configureButtonLabel } - + ) : (
    diff --git a/projects/plugins/jetpack/_inc/client/security/monitor.jsx b/projects/plugins/jetpack/_inc/client/security/monitor.jsx index ed946443289f..3ddc502566f5 100644 --- a/projects/plugins/jetpack/_inc/client/security/monitor.jsx +++ b/projects/plugins/jetpack/_inc/client/security/monitor.jsx @@ -1,7 +1,7 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, _x } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { Component } from 'react'; import { withModuleSettingsFormHelpers } from 'components/module-settings/with-module-settings-form-helpers'; import { ModuleToggle } from 'components/module-toggle'; @@ -59,7 +59,8 @@ export const Monitor = withModuleSettingsFormHelpers( ), { a: ( - diff --git a/projects/plugins/jetpack/_inc/client/security/sso.jsx b/projects/plugins/jetpack/_inc/client/security/sso.jsx index 5194d01d1165..ef9b7a68a9d0 100644 --- a/projects/plugins/jetpack/_inc/client/security/sso.jsx +++ b/projects/plugins/jetpack/_inc/client/security/sso.jsx @@ -1,8 +1,9 @@ import { getRedirectUrl, Gridicon } from '@automattic/jetpack-components'; import { useConnection } from '@automattic/jetpack-connection'; -import { Button, ExternalLink, ToggleControl } from '@wordpress/components'; +import { Button, ToggleControl } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, _x } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import * as cookie from 'cookie'; import { useState, Component } from 'react'; import ReactDOM from 'react-dom'; @@ -231,7 +232,8 @@ export const SSO = withModuleSettingsFormHelpers( ), { link: ( - ), diff --git a/projects/plugins/jetpack/_inc/client/security/waf.jsx b/projects/plugins/jetpack/_inc/client/security/waf.jsx index 5127e6825fbc..3315ec00148a 100644 --- a/projects/plugins/jetpack/_inc/client/security/waf.jsx +++ b/projects/plugins/jetpack/_inc/client/security/waf.jsx @@ -1,7 +1,8 @@ import { getRedirectUrl, Status } from '@automattic/jetpack-components'; -import { ExternalLink, ToggleControl } from '@wordpress/components'; +import { ToggleControl } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, _x, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { Component } from 'react'; import { connect } from 'react-redux'; import Button from 'components/button'; @@ -259,12 +260,13 @@ export const Waf = class extends Component { > { createInterpolateElement( __( - 'Allow Jetpack to collect basic data from blocked requests to improve firewall protection and accuracy. Learn more
    Privacy Information', + 'Allow Jetpack to collect basic data from blocked requests to improve firewall protection and accuracy. Learn more
    Privacy Information', 'jetpack' ), { - ExternalLink: ( - ), @@ -297,12 +299,13 @@ export const Waf = class extends Component { > { createInterpolateElement( __( - 'Allow Jetpack to collect detailed data from blocked requests to enhance firewall protection and accuracy. Learn more
    Privacy Information', + 'Allow Jetpack to collect detailed data from blocked requests to enhance firewall protection and accuracy. Learn more
    Privacy Information', 'jetpack' ), { - ExternalLink: ( - ), diff --git a/projects/plugins/jetpack/_inc/client/traffic/google-analytics.jsx b/projects/plugins/jetpack/_inc/client/traffic/google-analytics.jsx index 491daff79a34..0fe38a725588 100644 --- a/projects/plugins/jetpack/_inc/client/traffic/google-analytics.jsx +++ b/projects/plugins/jetpack/_inc/client/traffic/google-analytics.jsx @@ -1,7 +1,8 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; -import { ExternalLink, ToggleControl } from '@wordpress/components'; +import { ToggleControl } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, _x } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { Component } from 'react'; import { FormFieldset, FormLabel } from 'components/forms'; import { withModuleSettingsFormHelpers } from 'components/module-settings/with-module-settings-form-helpers'; @@ -137,7 +138,8 @@ export const GoogleAnalytics = withModuleSettingsFormHelpers( __( 'Learn more to find your Measurement ID.', 'jetpack' ), { link: ( - - , support: , google: ( - ), bing: ( - + ), pinterest: ( - ), yandex: ( - ), facebook: ( - diff --git a/projects/plugins/jetpack/_inc/client/traffic/verification-services/google.jsx b/projects/plugins/jetpack/_inc/client/traffic/verification-services/google.jsx index 8fff9fdbbed3..7824165696ae 100644 --- a/projects/plugins/jetpack/_inc/client/traffic/verification-services/google.jsx +++ b/projects/plugins/jetpack/_inc/client/traffic/verification-services/google.jsx @@ -1,6 +1,6 @@ -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import PropTypes from 'prop-types'; import { Component } from 'react'; import { connect } from 'react-redux'; @@ -236,7 +236,6 @@ class GoogleVerificationServiceComponent extends Component { { __( 'Edit', 'jetpack' ) } - { this.props.isOwner && (
    @@ -248,7 +247,8 @@ class GoogleVerificationServiceComponent extends Component { ), { a: ( - @@ -263,13 +263,15 @@ class GoogleVerificationServiceComponent extends Component { ), { a1: ( - ), a2: ( - - { __( 'Share your feedback', 'jetpack' ) } + + { __( 'Share your feedback', 'jetpack' ) } +
    ); diff --git a/projects/plugins/jetpack/extensions/blocks/ai-assistant/components/message/block-message.tsx b/projects/plugins/jetpack/extensions/blocks/ai-assistant/components/message/block-message.tsx index 7f30e96783f6..91f314344fcc 100644 --- a/projects/plugins/jetpack/extensions/blocks/ai-assistant/components/message/block-message.tsx +++ b/projects/plugins/jetpack/extensions/blocks/ai-assistant/components/message/block-message.tsx @@ -1,9 +1,6 @@ -/** - * External dependencies - */ -import { ExternalLink } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; /** * Internal dependencies */ @@ -74,7 +71,8 @@ export default function BlockMessage( props: BlockMessageProps ): ReactElement { ), { link: ( - diff --git a/projects/plugins/jetpack/extensions/blocks/ai-assistant/edit.js b/projects/plugins/jetpack/extensions/blocks/ai-assistant/edit.js index 04f7cf193934..aac82211edb6 100644 --- a/projects/plugins/jetpack/extensions/blocks/ai-assistant/edit.js +++ b/projects/plugins/jetpack/extensions/blocks/ai-assistant/edit.js @@ -21,17 +21,12 @@ import { } from '@automattic/jetpack-shared-extension-utils'; import { useBlockProps, InspectorControls } from '@wordpress/block-editor'; import { rawHandler } from '@wordpress/blocks'; -import { - Notice, - PanelBody, - PanelRow, - KeyboardShortcuts, - ExternalLink, -} from '@wordpress/components'; +import { Notice, PanelBody, PanelRow, KeyboardShortcuts } from '@wordpress/components'; import { useViewportMatch } from '@wordpress/compose'; import { useSelect, useDispatch } from '@wordpress/data'; import { RawHTML, useState, useCallback, useEffect, useRef } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; /** * Internal dependencies @@ -384,9 +379,9 @@ export default function AIAssistantEdit( { attributes, setAttributes, clientId, { /* Mock BlockCard component styles to keep alignment */ }
    - + { __( 'Discover all features', 'jetpack' ) } - +
    { ( planType === PLAN_TYPE_FREE || ( tierPlansEnabled && planType !== PLAN_TYPE_UNLIMITED ) ) && ( diff --git a/projects/plugins/jetpack/extensions/blocks/ai-chat/question-answer.js b/projects/plugins/jetpack/extensions/blocks/ai-chat/question-answer.js index cf0ca5374fa2..3b77c28ae1d5 100644 --- a/projects/plugins/jetpack/extensions/blocks/ai-chat/question-answer.js +++ b/projects/plugins/jetpack/extensions/blocks/ai-chat/question-answer.js @@ -1,18 +1,9 @@ /** * WordPress dependencies */ -import { - Button, - TextControl, - Spinner, - KeyboardShortcuts, - ExternalLink, -} from '@wordpress/components'; +import { Button, TextControl, Spinner, KeyboardShortcuts } from '@wordpress/components'; import { RawHTML, useEffect, useState } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; -/** - * Internal dependencies - */ import CopyButton from './components/copy-button'; import DisplayError from './components/display-error'; import Feedback from './components/feedback'; @@ -171,7 +162,9 @@ export default function QuestionAnswer( {     diff --git a/projects/plugins/jetpack/extensions/blocks/blog-stats/inactive-placeholder.js b/projects/plugins/jetpack/extensions/blocks/blog-stats/inactive-placeholder.js index 05b5ade52063..9e5cb90a0d6f 100644 --- a/projects/plugins/jetpack/extensions/blocks/blog-stats/inactive-placeholder.js +++ b/projects/plugins/jetpack/extensions/blocks/blog-stats/inactive-placeholder.js @@ -1,7 +1,8 @@ import { isWoASite } from '@automattic/jetpack-script-data'; import { getBlockIconComponent } from '@automattic/jetpack-shared-extension-utils'; -import { Button, ExternalLink, Placeholder } from '@wordpress/components'; +import { Button, Placeholder } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import metadata from './block.json'; export const InactiveStatsPlaceholder = ( { className, isLoading, changeStatus } ) => { @@ -33,9 +34,9 @@ export const InactiveStatsPlaceholder = ( { className, isLoading, changeStatus } { isLoading ? __( 'Activating Stats', 'jetpack' ) : __( 'Activate Stats', 'jetpack', 0 ) }
    - + { __( 'Learn more about the Stats module.', 'jetpack' ) } - +
    diff --git a/projects/plugins/jetpack/extensions/blocks/calendly/controls.js b/projects/plugins/jetpack/extensions/blocks/calendly/controls.js index ccf23a28724f..c13acd0a32b1 100644 --- a/projects/plugins/jetpack/extensions/blocks/calendly/controls.js +++ b/projects/plugins/jetpack/extensions/blocks/calendly/controls.js @@ -2,7 +2,6 @@ import { isWpcomPlatformSite } from '@automattic/jetpack-script-data'; import { BlockControls, InspectorControls } from '@wordpress/block-editor'; import { Button, - ExternalLink, Notice, PanelBody, ToggleControl, @@ -10,6 +9,7 @@ import { ToolbarGroup, } from '@wordpress/components'; import { __, _x } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import BlockStylesSelector from '../../shared/components/block-styles-selector'; export const CalendlyBlockControls = ( { onEditClick } ) => { @@ -68,9 +68,9 @@ export const CalendlyInspectorControls = props => { { externalDocLink && ( - + { __( 'Explore more customization options.', 'jetpack' ) } - + ) } diff --git a/projects/plugins/jetpack/extensions/blocks/calendly/edit.js b/projects/plugins/jetpack/extensions/blocks/calendly/edit.js index a3bdd861fbee..dc755d9d7133 100644 --- a/projects/plugins/jetpack/extensions/blocks/calendly/edit.js +++ b/projects/plugins/jetpack/extensions/blocks/calendly/edit.js @@ -1,10 +1,11 @@ import { getBlockIconComponent } from '@automattic/jetpack-shared-extension-utils'; import { InnerBlocks, useBlockProps } from '@wordpress/block-editor'; import { getBlockDefaultClassName } from '@wordpress/blocks'; -import { Button, ExternalLink, Placeholder, Spinner, withNotices } from '@wordpress/components'; +import { Button, Placeholder, Spinner, withNotices } from '@wordpress/components'; import { select, dispatch } from '@wordpress/data'; import { useEffect, useState } from '@wordpress/element'; import { __, _x } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import { isEqual } from 'lodash'; import { getValidatedAttributes } from '../../shared/get-validated-attributes'; @@ -134,9 +135,12 @@ export function CalendlyEdit( props ) {
    - + { __( 'Need help finding your embed code?', 'jetpack' ) } - +
    ); diff --git a/projects/plugins/jetpack/extensions/blocks/donations/controls.js b/projects/plugins/jetpack/extensions/blocks/donations/controls.js index 6a223167a92d..05436cfcf1d5 100644 --- a/projects/plugins/jetpack/extensions/blocks/donations/controls.js +++ b/projects/plugins/jetpack/extensions/blocks/donations/controls.js @@ -4,7 +4,6 @@ import { BlockControls, InspectorControls } from '@wordpress/block-editor'; import { Dashicon, Dropdown, - ExternalLink, MenuGroup, MenuItem, PanelBody, @@ -15,6 +14,7 @@ import { } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { DOWN } from '@wordpress/keycodes'; +import { Link } from '@wordpress/ui'; import { getDefaultDonationAmountsForCurrency, SUPPORTED_CURRENCIES, @@ -126,9 +126,9 @@ const Controls = props => { label={ __( 'Show custom amount option', 'jetpack' ) } __nextHasNoMarginBottom={ true } /> - + { __( 'View donation earnings', 'jetpack' ) } - + diff --git a/projects/plugins/jetpack/extensions/blocks/donations/first-time-modal.js b/projects/plugins/jetpack/extensions/blocks/donations/first-time-modal.js index 7b15ac8a9027..e76b3b914224 100644 --- a/projects/plugins/jetpack/extensions/blocks/donations/first-time-modal.js +++ b/projects/plugins/jetpack/extensions/blocks/donations/first-time-modal.js @@ -1,8 +1,9 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; import { isWpcomPlatformSite } from '@automattic/jetpack-script-data'; -import { Modal, Button, ExternalLink } from '@wordpress/components'; +import { Modal, Button } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; const FirstTimeModal = ( { onClose } ) => { // Configure the redirect URLs in the Jetpack Redirects service (see the README in jetpack-redirects). @@ -23,7 +24,7 @@ const FirstTimeModal = ( { onClose } ) => { 'jetpack' ), { - docLink: , + docLink: , } ) }

    @@ -46,7 +47,8 @@ const FirstTimeModal = ( { onClose } ) => { ), { requirementsLink: ( - ), diff --git a/projects/plugins/jetpack/extensions/blocks/eventbrite/form.js b/projects/plugins/jetpack/extensions/blocks/eventbrite/form.js index 4ae2c56bcc0f..edb65ff459c4 100644 --- a/projects/plugins/jetpack/extensions/blocks/eventbrite/form.js +++ b/projects/plugins/jetpack/extensions/blocks/eventbrite/form.js @@ -1,8 +1,10 @@ import { isWpcomPlatformSite } from '@automattic/jetpack-script-data'; import { getBlockIconComponent } from '@automattic/jetpack-shared-extension-utils'; -import { Placeholder, Button, ExternalLink } from '@wordpress/components'; +import { Placeholder, Button } from '@wordpress/components'; import { __, _x } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import metadata from './block.json'; + import {} from './utils'; const icon = getBlockIconComponent( metadata ); @@ -38,9 +40,9 @@ const EmbedForm = ( { className, noticeUI, editedUrl, onChange, onSubmit } ) =>
    - + { __( 'Learn more about Eventbrite embeds', 'jetpack' ) } - +
    diff --git a/projects/plugins/jetpack/extensions/blocks/google-calendar/edit.js b/projects/plugins/jetpack/extensions/blocks/google-calendar/edit.js index a834293af707..efbe2d91862d 100644 --- a/projects/plugins/jetpack/extensions/blocks/google-calendar/edit.js +++ b/projects/plugins/jetpack/extensions/blocks/google-calendar/edit.js @@ -2,10 +2,11 @@ import { isWpcomPlatformSite } from '@automattic/jetpack-script-data'; import { getBlockIconComponent } from '@automattic/jetpack-shared-extension-utils'; import { InspectorControls, useBlockProps } from '@wordpress/block-editor'; import { getBlockDefaultClassName } from '@wordpress/blocks'; -import { Placeholder, SandBox, Button, ExternalLink, withNotices } from '@wordpress/components'; +import { Placeholder, SandBox, Button, withNotices } from '@wordpress/components'; import { compose } from '@wordpress/compose'; import { useEffect, useState } from '@wordpress/element'; import { __, _x } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { withViewportMatch } from '@wordpress/viewport'; import metadata from './block.json'; import GoogleCalendarInspectorControls from './controls'; @@ -97,9 +98,9 @@ export function GoogleCalendarEdit( props ) { const html = ``; const permissionsLink = ( - + { __( 'Enable Permissions for the calendar you want to share', 'jetpack' ) } - + ); const controls = ( @@ -136,7 +137,9 @@ export function GoogleCalendarEdit( props ) { { getEditForm( `${ defaultClassName }-embed-form-editor` ) }
    - { __( 'Learn more', 'jetpack' ) } + + { __( 'Learn more', 'jetpack' ) } +
    diff --git a/projects/plugins/jetpack/extensions/blocks/google-docs-embed/preview.js b/projects/plugins/jetpack/extensions/blocks/google-docs-embed/preview.js index 72eebf309d82..1dad7d07da19 100644 --- a/projects/plugins/jetpack/extensions/blocks/google-docs-embed/preview.js +++ b/projects/plugins/jetpack/extensions/blocks/google-docs-embed/preview.js @@ -1,5 +1,5 @@ -import { ExternalLink } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; const Preview = props => { const { @@ -20,9 +20,9 @@ const Preview = props => { { __( 'This Google Document is private.', 'jetpack' ) }

    - + { __( 'Click here to open this document.', 'jetpack' ) } - +

    ) : ( diff --git a/projects/plugins/jetpack/extensions/blocks/instagram-gallery/controls.js b/projects/plugins/jetpack/extensions/blocks/instagram-gallery/controls.js index 939d8e297ab2..3f797dce5331 100644 --- a/projects/plugins/jetpack/extensions/blocks/instagram-gallery/controls.js +++ b/projects/plugins/jetpack/extensions/blocks/instagram-gallery/controls.js @@ -1,6 +1,5 @@ import { Button, - ExternalLink, Notice, PanelBody, PanelRow, @@ -8,6 +7,7 @@ import { ToggleControl, } from '@wordpress/components'; import { __, sprintf, _n } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { MAX_IMAGE_COUNT } from './constants'; export default function InstagramGalleryInspectorControls( { @@ -47,9 +47,9 @@ export default function InstagramGalleryInspectorControls( { { __( 'Account', 'jetpack' ) } - + @{ instagramUser } - + { currentUserConnected && ( diff --git a/projects/plugins/jetpack/extensions/blocks/like/edit.js b/projects/plugins/jetpack/extensions/blocks/like/edit.js index dba6e2b21a7e..961df675eb2b 100644 --- a/projects/plugins/jetpack/extensions/blocks/like/edit.js +++ b/projects/plugins/jetpack/extensions/blocks/like/edit.js @@ -1,8 +1,9 @@ import { isWpcomPlatformSite, isSimpleSite } from '@automattic/jetpack-script-data'; import { useBlockProps, InspectorControls } from '@wordpress/block-editor'; -import { ExternalLink, ToggleControl, PanelBody } from '@wordpress/components'; +import { ToggleControl, PanelBody } from '@wordpress/components'; import { createInterpolateElement } from '@wordpress/element'; import { __, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { getValidatedAttributes } from '../../shared/get-validated-attributes'; import avatar1 from '../blogging-prompt/example-avatars/avatar1.jpg'; import avatar2 from '../blogging-prompt/example-avatars/avatar2.jpg'; @@ -23,9 +24,9 @@ function LikeEdit( { attributes, setAttributes } ) { { isJetpackSite && (
    - + { __( 'Learn more', 'jetpack' ) } - +
    ) } diff --git a/projects/plugins/jetpack/extensions/blocks/mailchimp/controls.js b/projects/plugins/jetpack/extensions/blocks/mailchimp/controls.js index aaa0b3019111..ba754530ef53 100644 --- a/projects/plugins/jetpack/extensions/blocks/mailchimp/controls.js +++ b/projects/plugins/jetpack/extensions/blocks/mailchimp/controls.js @@ -1,7 +1,8 @@ import { InspectorControls } from '@wordpress/block-editor'; -import { ExternalLink, PanelBody, TextControl } from '@wordpress/components'; +import { PanelBody, TextControl } from '@wordpress/components'; import { useRef } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { NOTIFICATION_PROCESSING, NOTIFICATION_SUCCESS, @@ -95,9 +96,9 @@ export const MailChimpBlockControls = ( { } ); } } /> - + { __( 'Learn about groups', 'jetpack' ) } - + setAttributes( { signupFieldValue: value } ) } /> - + { __( 'Learn about signup location tracking', 'jetpack' ) } - + - { __( 'Manage Connection', 'jetpack' ) } + + { __( 'Manage Connection', 'jetpack' ) } + ); diff --git a/projects/plugins/jetpack/extensions/blocks/map/controls.js b/projects/plugins/jetpack/extensions/blocks/map/controls.js index 75be94413065..bdf5d74ae5f9 100644 --- a/projects/plugins/jetpack/extensions/blocks/map/controls.js +++ b/projects/plugins/jetpack/extensions/blocks/map/controls.js @@ -1,6 +1,5 @@ import { BlockAlignmentToolbar, PanelColorSettings } from '@wordpress/block-editor'; import { - ExternalLink, PanelBody, TextControl, ToggleControl, @@ -19,6 +18,7 @@ import { __experimentalToggleGroupControlOption as ToggleGroupControlOption, } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import Locations from './locations'; const markerIcon = ( @@ -173,9 +173,9 @@ export default ( { 'wpcom' === apiKeySource && ( <> { __( 'You can optionally enter your own access token.', 'jetpack' ) }{ ' ' } - + { __( 'Find it on Mapbox', 'jetpack' ) } - + ) } diff --git a/projects/plugins/jetpack/extensions/blocks/map/edit.js b/projects/plugins/jetpack/extensions/blocks/map/edit.js index bcc8279239ac..18fe1c1f58e2 100644 --- a/projects/plugins/jetpack/extensions/blocks/map/edit.js +++ b/projects/plugins/jetpack/extensions/blocks/map/edit.js @@ -6,18 +6,12 @@ import { useBlockProps, store as blockEditorStore, } from '@wordpress/block-editor'; -import { - Button, - ExternalLink, - Placeholder, - Spinner, - withNotices, - ResizableBox, -} from '@wordpress/components'; +import { Button, Placeholder, Spinner, withNotices, ResizableBox } from '@wordpress/components'; import { compose } from '@wordpress/compose'; import { useDispatch, useSelect } from '@wordpress/data'; import { useEffect, useRef, useState } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { getActiveStyleName } from '../../shared/block-styles'; import AddPoint from './add-point'; import metadata from './block.json'; @@ -258,9 +252,9 @@ const MapEdit = ( {

    { __( 'To use the map block, you need an Access Token.', 'jetpack' ) }
    - + { __( 'Create an account or log in to Mapbox.', 'jetpack' ) } - +
    { __( 'Locate and copy the default access token. Then, paste it into the field below.', diff --git a/projects/plugins/jetpack/extensions/blocks/opentable/edit.js b/projects/plugins/jetpack/extensions/blocks/opentable/edit.js index 501a9bf7168a..3142e89a5ecf 100644 --- a/projects/plugins/jetpack/extensions/blocks/opentable/edit.js +++ b/projects/plugins/jetpack/extensions/blocks/opentable/edit.js @@ -11,7 +11,6 @@ import { unregisterBlockStyle, } from '@wordpress/blocks'; import { - ExternalLink, PanelBody, Placeholder, SelectControl, @@ -20,6 +19,7 @@ import { } from '@wordpress/components'; import { useEffect } from '@wordpress/element'; import { __, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import { isEmpty, isEqual } from 'lodash'; import { getActiveStyleName } from '../../shared/block-styles'; @@ -238,10 +238,12 @@ function OpenTableEdit( { >

    - + { __( 'Sign up for OpenTable', 'jetpack' ) } - - { __( 'Learn more', 'jetpack' ) } + + + { __( 'Learn more', 'jetpack' ) } +
    ); diff --git a/projects/plugins/jetpack/extensions/blocks/podcast-player/edit.js b/projects/plugins/jetpack/extensions/blocks/podcast-player/edit.js index 6e9966b940de..507dbf264776 100644 --- a/projects/plugins/jetpack/extensions/blocks/podcast-player/edit.js +++ b/projects/plugins/jetpack/extensions/blocks/podcast-player/edit.js @@ -10,7 +10,6 @@ import { import { createBlock } from '@wordpress/blocks'; import { Button, - ExternalLink, PanelBody, Placeholder, RangeControl, @@ -26,6 +25,7 @@ import { compose, withInstanceId } from '@wordpress/compose'; import { withDispatch } from '@wordpress/data'; import { useCallback, useEffect, useState, useRef, useReducer, useMemo } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { isURL, prependHTTP } from '@wordpress/url'; import debugFactory from 'debug'; import { debounce } from 'lodash'; @@ -284,9 +284,9 @@ const PodcastPlayerEdit = ( {
    - + { __( 'Learn more about embeds', 'jetpack' ) } - +
    ); diff --git a/projects/plugins/jetpack/extensions/blocks/related-posts/inactive-placeholder.js b/projects/plugins/jetpack/extensions/blocks/related-posts/inactive-placeholder.js index 57110b489870..ddb65abbc833 100644 --- a/projects/plugins/jetpack/extensions/blocks/related-posts/inactive-placeholder.js +++ b/projects/plugins/jetpack/extensions/blocks/related-posts/inactive-placeholder.js @@ -1,9 +1,10 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; import { isWpcomPlatformSite, isSimpleSite } from '@automattic/jetpack-script-data'; import { useAnalytics, getBlockIconComponent } from '@automattic/jetpack-shared-extension-utils'; -import { Button, ExternalLink, Placeholder } from '@wordpress/components'; +import { Button, Placeholder } from '@wordpress/components'; import { useEffect } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import metadata from './block.json'; const icon = getBlockIconComponent( metadata ); @@ -65,9 +66,9 @@ export const InactiveRelatedPostsPlaceholder = ( { ) }
    - + { __( 'Learn more about the Related Posts feature.', 'jetpack' ) } - +
    diff --git a/projects/plugins/jetpack/extensions/blocks/subscriptions/email-preview.js b/projects/plugins/jetpack/extensions/blocks/subscriptions/email-preview.js index c7ff6066f93d..f56ed9e8164b 100644 --- a/projects/plugins/jetpack/extensions/blocks/subscriptions/email-preview.js +++ b/projects/plugins/jetpack/extensions/blocks/subscriptions/email-preview.js @@ -13,7 +13,6 @@ import { __experimentalToggleGroupControlOption as ToggleGroupControlOption, // eslint-disable-line @wordpress/no-unsafe-wp-apis __experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon, // eslint-disable-line @wordpress/no-unsafe-wp-apis Spinner, - ExternalLink, } from '@wordpress/components'; import { useSelect, useDispatch } from '@wordpress/data'; import { store as editorStore } from '@wordpress/editor'; @@ -28,6 +27,7 @@ import { currencyDollar, cautionFilled as warning, } from '@wordpress/icons'; +import { Link } from '@wordpress/ui'; import './email-preview.scss'; import { accessOptions } from '../../shared/memberships/constants'; import { useAccessLevel } from '../../shared/memberships/edit'; @@ -353,7 +353,9 @@ export function NewsletterPreviewModal( { isOpen, onClose, postId } ) { 'jetpack' ), { - supportLink: , + supportLink: ( + + ), } ) }

    diff --git a/projects/plugins/jetpack/extensions/blocks/top-posts/inactive-placeholder.js b/projects/plugins/jetpack/extensions/blocks/top-posts/inactive-placeholder.js index 995c59183c60..058b1a966f0e 100644 --- a/projects/plugins/jetpack/extensions/blocks/top-posts/inactive-placeholder.js +++ b/projects/plugins/jetpack/extensions/blocks/top-posts/inactive-placeholder.js @@ -1,7 +1,8 @@ import { isWoASite } from '@automattic/jetpack-script-data'; import { getBlockIconComponent } from '@automattic/jetpack-shared-extension-utils'; -import { Button, ExternalLink, Placeholder } from '@wordpress/components'; +import { Button, Placeholder } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import metadata from './block.json'; export const InactiveStatsPlaceholder = ( { className, isLoading, changeStatus } ) => { @@ -33,9 +34,9 @@ export const InactiveStatsPlaceholder = ( { className, isLoading, changeStatus } { isLoading ? __( 'Activating Stats', 'jetpack' ) : __( 'Activate Stats', 'jetpack', 0 ) }
    - + { __( 'Learn more about the Stats module.', 'jetpack' ) } - +
    diff --git a/projects/plugins/jetpack/extensions/blocks/videopress/edit.js b/projects/plugins/jetpack/extensions/blocks/videopress/edit.js index 3c72c721685d..20d83d8e96b5 100644 --- a/projects/plugins/jetpack/extensions/blocks/videopress/edit.js +++ b/projects/plugins/jetpack/extensions/blocks/videopress/edit.js @@ -12,7 +12,6 @@ import { import { BaseControl, Button, - ExternalLink, PanelBody, ResizableBox, SandBox, @@ -40,6 +39,7 @@ import { import { escapeHTML } from '@wordpress/escape-html'; import { __, _x, sprintf } from '@wordpress/i18n'; import { Icon } from '@wordpress/icons'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import { VideoPressBlockProvider } from './components'; import { VIDEO_PRIVACY } from './constants'; @@ -620,7 +620,7 @@ const VideoPressEdit = CoreVideoEdit => { createInterpolateElement( __( 'Send us your VideoPress feedback', 'jetpack' ), { - a: , + a: , } ) }     diff --git a/projects/plugins/jetpack/extensions/blocks/videopress/resumable-upload/index.js b/projects/plugins/jetpack/extensions/blocks/videopress/resumable-upload/index.js index 194ff3a136d4..1cc1802557bd 100644 --- a/projects/plugins/jetpack/extensions/blocks/videopress/resumable-upload/index.js +++ b/projects/plugins/jetpack/extensions/blocks/videopress/resumable-upload/index.js @@ -1,15 +1,17 @@ /** * WordPress dependencies */ -import { Button, ExternalLink } from '@wordpress/components'; +import { Button } from '@wordpress/components'; import { useCallback, useContext, useEffect, useRef, useState } from '@wordpress/element'; import { __, sprintf } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { filesize } from 'filesize'; /** * Internal Dependencies */ import { VideoPressBlockContext } from '../components'; import { getJWT, resumableUploader } from './use-uploader'; + import './style.scss'; export default function ResumableUpload( { file } ) { @@ -111,13 +113,14 @@ export default function ResumableUpload( { file } ) { <> { __( 'The format of the video you uploaded is not supported.', 'jetpack' ) }   - { __( 'Check the recommended video settings.', 'jetpack' ) } - + ); } else { diff --git a/projects/plugins/jetpack/extensions/blocks/wordads/components/jetpack-wordads-placeholder.js b/projects/plugins/jetpack/extensions/blocks/wordads/components/jetpack-wordads-placeholder.js index 6f4f11b3c3de..e75c1e328b68 100644 --- a/projects/plugins/jetpack/extensions/blocks/wordads/components/jetpack-wordads-placeholder.js +++ b/projects/plugins/jetpack/extensions/blocks/wordads/components/jetpack-wordads-placeholder.js @@ -1,6 +1,7 @@ import { getBlockIconComponent } from '@automattic/jetpack-shared-extension-utils'; -import { Button, Placeholder, ExternalLink } from '@wordpress/components'; +import { Button, Placeholder } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import metadata from '../block.json'; const icon = getBlockIconComponent( metadata ); @@ -26,9 +27,9 @@ export const WordAdsPlaceholder = ( { changeStatus, isLoading, isModuleActive } : __( 'Activate WordAds', 'jetpack', 0 ) }
    - + { __( 'Learn more about the WordAds feature.', 'jetpack' ) } - +
    ); diff --git a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/ai-assistant-plugin-sidebar/index.tsx b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/ai-assistant-plugin-sidebar/index.tsx index db778f47b414..83c4f3ff1bfe 100644 --- a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/ai-assistant-plugin-sidebar/index.tsx +++ b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/ai-assistant-plugin-sidebar/index.tsx @@ -14,14 +14,7 @@ import { usePlanType, } from '@automattic/jetpack-shared-extension-utils'; import { JetpackEditorPanelLogo } from '@automattic/jetpack-shared-extension-utils/components'; -import { - PanelBody, - PanelRow, - BaseControl, - Button, - ExternalLink, - Notice, -} from '@wordpress/components'; +import { PanelBody, PanelRow, BaseControl, Button, Notice } from '@wordpress/components'; import { store as coreStore } from '@wordpress/core-data'; import { useSelect, useDispatch } from '@wordpress/data'; import { @@ -31,6 +24,7 @@ import { } from '@wordpress/editor'; import { applyFilters } from '@wordpress/hooks'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import debugFactory from 'debug'; import { ComponentType, useCallback, useMemo } from 'react'; /** @@ -148,7 +142,6 @@ const JetpackAndSettingsContent = ( { ) } - { isPostEmpty && ( @@ -156,7 +149,6 @@ const JetpackAndSettingsContent = ( { ) } - { canWriteBriefBeEnabled() && isBreveAvailable && ( @@ -167,7 +159,6 @@ const JetpackAndSettingsContent = ( { ) } - { isAITitleOptimizationAvailable && ( @@ -176,7 +167,6 @@ const JetpackAndSettingsContent = ( { ) } - { ( imageGenerationHandler || isAIFeaturedImageAvailable ) && ( @@ -197,14 +187,12 @@ const JetpackAndSettingsContent = ( { ) } - { __( 'Get Feedback', 'jetpack' ) } - { requireUpgrade && ! isUsagePanelAvailable && ( @@ -215,30 +203,29 @@ const JetpackAndSettingsContent = ( { ) } - - + { __( 'Learn more about Jetpack AI', 'jetpack' ) } - + - - + { __( 'Give us feedback', 'jetpack' ) } - + - - + { __( 'AI guidelines', 'jetpack' ) } - + - { canWriteBriefBeEnabled() && ! isBreveAvailable && ( - + { __( 'Update on Write Brief (Beta)', 'jetpack' ) } - + ) } diff --git a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/ai-assistant-plugin-sidebar/test/index.test.tsx b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/ai-assistant-plugin-sidebar/test/index.test.tsx index 5eb665946cc4..d7d300025e34 100644 --- a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/ai-assistant-plugin-sidebar/test/index.test.tsx +++ b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/ai-assistant-plugin-sidebar/test/index.test.tsx @@ -112,10 +112,13 @@ jest.mock( '@wordpress/components', () => ( { { children } ), - ExternalLink: ( { children, href }: { children: React.ReactNode; href: string } ) => ( + Notice: ( { children }: { children: React.ReactNode } ) =>
    { children }
    , +} ) ); + +jest.mock( '@wordpress/ui', () => ( { + Link: ( { children, href }: { children: React.ReactNode; href: string } ) => ( { children } ), - Notice: ( { children }: { children: React.ReactNode } ) =>
    { children }
    , } ) ); jest.mock( '@wordpress/core-data', () => { diff --git a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/title-optimization/index.tsx b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/title-optimization/index.tsx index b354d3553e66..422c65de3550 100644 --- a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/title-optimization/index.tsx +++ b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/title-optimization/index.tsx @@ -13,13 +13,14 @@ import { AiAssistantModal, } from '@automattic/jetpack-ai-client'; import { useAnalytics, useAutosaveAndRedirect } from '@automattic/jetpack-shared-extension-utils'; -import { Button, Spinner, ExternalLink, Notice } from '@wordpress/components'; +import { Button, Spinner, Notice } from '@wordpress/components'; import { useDispatch } from '@wordpress/data'; import { useState, useCallback } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; /** * Internal dependencies */ +import { Link } from '@wordpress/ui'; import { getFeatureAvailability } from '../../../../blocks/ai-assistant/lib/utils/get-feature-availability'; import TitleOptimizationKeywords from './title-optimization-keywords'; import TitleOptimizationOptions from './title-optimization-options'; @@ -301,9 +302,9 @@ export default function TitleOptimization( { ) }
    - + { __( 'Provide feedback', 'jetpack' ) } - +
    ) } diff --git a/projects/plugins/jetpack/extensions/plugins/ai-content-lens/extend/ai-post-excerpt/index.tsx b/projects/plugins/jetpack/extensions/plugins/ai-content-lens/extend/ai-post-excerpt/index.tsx index 65914bd6c2ee..b31cea3adae9 100644 --- a/projects/plugins/jetpack/extensions/plugins/ai-content-lens/extend/ai-post-excerpt/index.tsx +++ b/projects/plugins/jetpack/extensions/plugins/ai-content-lens/extend/ai-post-excerpt/index.tsx @@ -9,7 +9,7 @@ import { import { isWpcomPlatformSite } from '@automattic/jetpack-script-data'; import { useAnalytics } from '@automattic/jetpack-shared-extension-utils'; import { WpcomSupportLink } from '@automattic/jetpack-shared-extension-utils/components'; -import { TextareaControl, ExternalLink, Button, Notice, BaseControl } from '@wordpress/components'; +import { TextareaControl, Button, Notice, BaseControl } from '@wordpress/components'; import { useDispatch, useSelect } from '@wordpress/data'; import { store as editorStore, @@ -18,6 +18,7 @@ import { } from '@wordpress/editor'; import { useState, useEffect, useCallback, useRef } from '@wordpress/element'; import { __, sprintf, _n } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import { count } from '@wordpress/wordcount'; /** * Internal dependencies @@ -228,7 +229,6 @@ ${ postContent } value={ currentExcerpt } disabled={ isTextAreaDisabled } /> - { isWpcomPlatformSite() ? ( ) : ( - { __( 'Learn more about manual excerpts', 'jetpack' ) } - + ) } -
    { error?.code && error.code !== 'error_quota_exceeded' && ( -
    - + { __( 'Learn more about Jetpack Likes.', 'jetpack' ) } - +
    ); diff --git a/projects/plugins/jetpack/extensions/plugins/payments/index.js b/projects/plugins/jetpack/extensions/plugins/payments/index.js index d808499fddbe..ea00b361e3ca 100644 --- a/projects/plugins/jetpack/extensions/plugins/payments/index.js +++ b/projects/plugins/jetpack/extensions/plugins/payments/index.js @@ -1,10 +1,10 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; import { useAnalytics } from '@automattic/jetpack-shared-extension-utils'; -import { ExternalLink } from '@wordpress/components'; import { useSelect } from '@wordpress/data'; import { PluginPostPublishPanel, store as editorStore } from '@wordpress/editor'; import { __ } from '@wordpress/i18n'; import { currencyDollar } from '@wordpress/icons'; +import { Link } from '@wordpress/ui'; const PaymentsPostPublish = () => { const { tracks } = useAnalytics(); @@ -30,9 +30,9 @@ const PaymentsPostPublish = () => { { __( 'Insert the Payment Button or the Donations Form — no plugin required.', 'jetpack' ) }

    - + { __( 'Learn more about these blocks', 'jetpack' ) } - +

    ); diff --git a/projects/plugins/jetpack/extensions/plugins/seo/components/placeholder.js b/projects/plugins/jetpack/extensions/plugins/seo/components/placeholder.js index 738f7e85dec5..68e4e22a4c4e 100644 --- a/projects/plugins/jetpack/extensions/plugins/seo/components/placeholder.js +++ b/projects/plugins/jetpack/extensions/plugins/seo/components/placeholder.js @@ -1,7 +1,8 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; import { useAnalytics } from '@automattic/jetpack-shared-extension-utils'; -import { Button, ExternalLink } from '@wordpress/components'; +import { Button } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import './placeholder.scss'; @@ -31,11 +32,10 @@ export const SeoPlaceholder = ( { changeStatus, isLoading, isModuleActive } ) => ? __( 'Activating Jetpack SEO', 'jetpack' ) : __( 'Activate Jetpack SEO', 'jetpack', 0 ) } -
    - + { __( 'Learn more about Jetpack SEO.', 'jetpack' ) } - +
    ); diff --git a/projects/plugins/jetpack/extensions/plugins/sharing/components/placeholder.js b/projects/plugins/jetpack/extensions/plugins/sharing/components/placeholder.js index d680bdf61f5c..e44d40e35065 100644 --- a/projects/plugins/jetpack/extensions/plugins/sharing/components/placeholder.js +++ b/projects/plugins/jetpack/extensions/plugins/sharing/components/placeholder.js @@ -1,7 +1,8 @@ import { getRedirectUrl } from '@automattic/jetpack-components'; import { useAnalytics } from '@automattic/jetpack-shared-extension-utils'; -import { Button, ExternalLink } from '@wordpress/components'; +import { Button } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import './placeholder.scss'; @@ -28,11 +29,10 @@ export const SharingPlaceholder = ( { changeStatus, isLoading, isModuleActive } ? __( 'Activating Sharing', 'jetpack' ) : __( 'Activate Sharing', 'jetpack', /* dummy arg to avoid bad minification */ 0 ) } -
    - + { __( 'Learn more about Jetpack Sharing.', 'jetpack' ) } - +
    ); diff --git a/projects/plugins/jetpack/extensions/shared/components/block-nudge/index.jsx b/projects/plugins/jetpack/extensions/shared/components/block-nudge/index.jsx index d0344f6c170d..27d203f9b6d1 100644 --- a/projects/plugins/jetpack/extensions/shared/components/block-nudge/index.jsx +++ b/projects/plugins/jetpack/extensions/shared/components/block-nudge/index.jsx @@ -1,7 +1,8 @@ import { useAutosaveAndRedirect } from '@automattic/jetpack-shared-extension-utils'; import { Warning } from '@wordpress/block-editor'; -import { Button, ExternalLink } from '@wordpress/components'; +import { Button } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { Link } from '@wordpress/ui'; import clsx from 'clsx'; import './style.scss'; @@ -54,9 +55,9 @@ export default function BlockNudge( { { readMoreUrl && ( <>
    - + { __( 'Learn more about the block and fees', 'jetpack' ) } - + ) } diff --git a/projects/plugins/jetpack/extensions/shared/components/product-management-controls/inspector-control.js b/projects/plugins/jetpack/extensions/shared/components/product-management-controls/inspector-control.js index 7ee100e87ed6..461d55828143 100644 --- a/projects/plugins/jetpack/extensions/shared/components/product-management-controls/inspector-control.js +++ b/projects/plugins/jetpack/extensions/shared/components/product-management-controls/inspector-control.js @@ -5,7 +5,6 @@ import { PanelRow, SelectControl, TextControl, - ExternalLink, Placeholder, Spinner, ToggleControl, @@ -14,6 +13,7 @@ import { useDispatch, useSelect } from '@wordpress/data'; import { useState } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; import { lock } from '@wordpress/icons'; +import { Link } from '@wordpress/ui'; import { useEffect } from 'react'; import { store as membershipProductsStore } from '../../../store/membership-products'; import { CURRENCY_OPTIONS } from '../../currencies'; @@ -90,9 +90,9 @@ export default function ProductManagementInspectorControl() { { siteSlug && ( - + { getMessageByProductType( 'manage your products', productType ) } - + ) } - + { __( 'Read more about Payments and related fees.', 'jetpack' ) } - +