From 7438b21d389978630d22898733fc5c224b4774d6 Mon Sep 17 00:00:00 2001 From: Max Duval Date: Tue, 23 Apr 2024 10:13:53 +0100 Subject: [PATCH] Bump `@guardian/*` packages (#474) * chore(deps): bump @guardian/* packages this results in a major dependency change, due to the fact that these change the peer dependencies range. * refactor: use new Button theme props https://github.com/guardian/csnx/blob/main/libs/%40guardian/source-react-components/CHANGELOG.md#2100 * fix(Button): apply border colour from text --- .changeset/honest-tomatoes-type.md | 9 ++++ package.json | 8 ++-- src/AppBanner/index.tsx | 66 +++++++++++++--------------- src/components/ReminderCtaButton.tsx | 1 + yarn.lock | 18 ++++---- 5 files changed, 54 insertions(+), 48 deletions(-) create mode 100644 .changeset/honest-tomatoes-type.md diff --git a/.changeset/honest-tomatoes-type.md b/.changeset/honest-tomatoes-type.md new file mode 100644 index 00000000..42359242 --- /dev/null +++ b/.changeset/honest-tomatoes-type.md @@ -0,0 +1,9 @@ +--- +'@guardian/braze-components': major +--- + +- Bumps `@guardian/source-react-components` to [`v22.1.0`](https://github.com/guardian/csnx/releases/tag/%40guardian%2Fsource-react-components%4022.1.0) +- Bumps `@guardian/source-react-components-development-kitchen` to [`v19.0.0`](https://github.com/guardian/csnx/releases/tag/%40guardian%2Fsource-react-components-development-kitchen%4019.0.0) + +This is a major change [as per our recommendations](https://github.com/guardian/recommendations/blob/main/npm-packages.md#changes-to-peerdependencies-ranges-are-breaking), and consumers should +ensure that they provide a compatible version of the package. diff --git a/package.json b/package.json index 80c68427..339374d8 100644 --- a/package.json +++ b/package.json @@ -48,8 +48,8 @@ "@guardian/libs": "^16.0.0", "@guardian/node-riffraff-artifact": "^0.3.2", "@guardian/source-foundations": "^14.1.2", - "@guardian/source-react-components": "^18.0.0", - "@guardian/source-react-components-development-kitchen": "^16.0.0", + "@guardian/source-react-components": "22.1.0", + "@guardian/source-react-components-development-kitchen": "19.0.0", "@rollup/plugin-alias": "^3.1.1", "@rollup/plugin-babel": "^5.1.0", "@rollup/plugin-commonjs": "^14.0.0", @@ -102,8 +102,8 @@ "@emotion/react": "^11.1.2", "@guardian/libs": "^16.0.0", "@guardian/source-foundations": "^14.1.2", - "@guardian/source-react-components": "^18.0.0", - "@guardian/source-react-components-development-kitchen": "^16.0.0", + "@guardian/source-react-components": "^22.1.0", + "@guardian/source-react-components-development-kitchen": "^19.0.0", "react": "17.0.2 || 18.2.0" }, "np": { diff --git a/src/AppBanner/index.tsx b/src/AppBanner/index.tsx index d675ae57..1bca6507 100644 --- a/src/AppBanner/index.tsx +++ b/src/AppBanner/index.tsx @@ -1,7 +1,6 @@ import React, { useState, ReactElement } from 'react'; import { css } from '@emotion/react'; -import { ThemeProvider } from '@emotion/react'; -import { Button, buttonThemeReaderRevenueBrandAlt } from '@guardian/source-react-components'; +import { Button, themeButtonReaderRevenueBrandAlt } from '@guardian/source-react-components'; import { space, from, until } from '@guardian/source-foundations'; import type { TrackClick } from '../utils/tracking'; @@ -22,7 +21,7 @@ export type BrazeMessageProps = { imageUrl?: string; }; -import type { ButtonTheme } from '@guardian/source-react-components'; +import type { ThemeButton } from '@guardian/source-react-components'; export type Props = { brazeMessageProps: BrazeMessageProps; @@ -46,18 +45,14 @@ export const AppBanner = (props: Props): ReactElement | null => { // This is to keep button colors the same as before // https://github.com/guardian/braze-components/pull/123 // Probably should be removed later - const overrridenReaderRevenueTheme: { button: ButtonTheme } = { - button: { - ...buttonThemeReaderRevenueBrandAlt.button, - backgroundPrimary: 'rgb(51, 51, 51)', - backgroundPrimaryHover: 'black', - }, + const overrridenReaderRevenueTheme: Partial = { + ...themeButtonReaderRevenueBrandAlt, + backgroundPrimary: 'rgb(51, 51, 51)', + backgroundPrimaryHover: 'black', }; - const notInterestedTheme: { button: ButtonTheme } = { - button: { - ...buttonThemeReaderRevenueBrandAlt.button, - textSubdued: 'rgb(51, 51, 51)', - }, + const notInterestedTheme: Partial = { + ...themeButtonReaderRevenueBrandAlt, + textSubdued: 'rgb(51, 51, 51)', }; if (!showBanner) { @@ -93,27 +88,28 @@ export const AppBanner = (props: Props): ReactElement | null => {

- - - - - - + +
diff --git a/src/components/ReminderCtaButton.tsx b/src/components/ReminderCtaButton.tsx index 9f6104b6..1707f1a5 100644 --- a/src/components/ReminderCtaButton.tsx +++ b/src/components/ReminderCtaButton.tsx @@ -69,6 +69,7 @@ const RemindMeButton = ({ buttonStyles, ctaText, onClick }: RemindMeButtonProps) onClick={() => onClick()} priority="tertiary" css={buttonStyles.remindMeButtonOverrides} + theme={{ borderTertiary: 'currentColor' }} > {ctaText} diff --git a/yarn.lock b/yarn.lock index ac52a57c..6b70483b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2890,15 +2890,15 @@ dependencies: mini-svg-data-uri "1.4.4" -"@guardian/source-react-components-development-kitchen@^16.0.0": - version "16.0.0" - resolved "https://registry.yarnpkg.com/@guardian/source-react-components-development-kitchen/-/source-react-components-development-kitchen-16.0.0.tgz#cd394cec864484ec18d27b2d4700dbf68339b20c" - integrity sha512-wJgQgPJIuahWS3nvHYhIsb0U/nsmmWyL2F6ID+so8Ft39/gEiyssPK/agqqWA0i/zUyttv5Fn3+Hk0tijau5+A== - -"@guardian/source-react-components@^18.0.0": - version "18.0.0" - resolved "https://registry.yarnpkg.com/@guardian/source-react-components/-/source-react-components-18.0.0.tgz#ed18cd7196a1988f9254442a1db507381a66f0a1" - integrity sha512-7mt6RDmViRdUKUlU8OaswIsYnR+yFEt5iYbRhmXB+A0XjiTeLYP8EHKmazISRlGXTZjjG701WgY5witaShI1YA== +"@guardian/source-react-components-development-kitchen@19.0.0": + version "19.0.0" + resolved "https://registry.yarnpkg.com/@guardian/source-react-components-development-kitchen/-/source-react-components-development-kitchen-19.0.0.tgz#e8b2741bc17a3f535b9c4e2b1cfa968ff223d8d4" + integrity sha512-YPqsLlwbuXNcD6dkUuzCCp/ytkwY7HH8ZozuuxlLhdwMFywFuvLRuCAp0q36gEBzcmuEU3eGjSIE823AKK9pfA== + +"@guardian/source-react-components@22.1.0": + version "22.1.0" + resolved "https://registry.yarnpkg.com/@guardian/source-react-components/-/source-react-components-22.1.0.tgz#8239eb1009b37e5c541a6f3629744296b84a862f" + integrity sha512-2oNhJsd4eaQRuHsOeQLkFZ3y4KAaA7BnG/qQES1SbPSx+e+MA8Z2UZu/9v/SEkGIleffkKKSeftP1TGQr4zJwQ== "@hapi/hoek@^9.0.0": version "9.2.0"