From 7d0d0d5c9adf22a3edab26e066f0de100638ac9c Mon Sep 17 00:00:00 2001 From: James Mockett <1166188+jamesmockett@users.noreply.github.com> Date: Thu, 3 Oct 2024 10:20:12 +0100 Subject: [PATCH 1/2] Move article format types across from `@guardian/libs` --- apps-rendering/src/articleFormat.ts | 146 ++++++++++++++++++++-------- 1 file changed, 103 insertions(+), 43 deletions(-) diff --git a/apps-rendering/src/articleFormat.ts b/apps-rendering/src/articleFormat.ts index d6c909ee268..c70a0e582b1 100644 --- a/apps-rendering/src/articleFormat.ts +++ b/apps-rendering/src/articleFormat.ts @@ -1,45 +1,99 @@ /** - * Helpers for working with the `Format` type from `@guardian/libs` + * Type definitions and helpers for `ArticleFormat` */ // ----- Imports ----- // -import type { ArticleFormat, ArticleTheme, Pillar } from '@guardian/libs'; -import { - ArticleDesign, - ArticleDisplay, - ArticlePillar, - ArticleSpecial, -} from '@guardian/libs'; import { Optional } from 'optional'; +// ----- Types ----- // + +enum ArticleDesign { + Standard, + Picture, + Gallery, + Audio, + Video, + Review, + Analysis, + Explainer, + Comment, + Letter, + Feature, + LiveBlog, + DeadBlog, + Recipe, + MatchReport, + Interview, + Editorial, + Quiz, + Interactive, + PhotoEssay, + PrintShop, + Obituary, + Correction, + FullPageInteractive, + NewsletterSignup, + Timeline, + Profile, +} + +enum ArticleDisplay { + Standard, + Immersive, + Showcase, + NumberedList, +} + +enum Pillar { + News = 0, + Opinion = 1, + Sport = 2, + Culture = 3, + Lifestyle = 4, +} + +enum ArticleSpecial { + SpecialReport = 5, + Labs = 6, + SpecialReportAlt = 7, +} + +type ArticleTheme = Pillar | ArticleSpecial; + +interface ArticleFormat { + theme: ArticleTheme; + design: ArticleDesign; + display: ArticleDisplay; +} + // ----- Functions ----- // /** * Attempts to parse a pillar expressed as a `string` into an - * {@linkcode ArticlePillar}. Uses the pillar id format provided by CAPI; for + * {@linkcode Pillar}. Uses the pillar id format provided by CAPI; for * example `"pillar/news"`. Note that CAPI uses `"pillar/arts"` for * the culture pillar. * * @param pillarId A pillar expressed as a `string`, e.g. `"pillar/news"`. * @returns An `Optional`, with a `Some` corresponding to an - * {@linkcode ArticlePillar} if the id is valid, otherwise `None`. + * {@linkcode Pillar} if the id is valid, otherwise `None`. * * @example - * const maybePillar = getPillarFromId("pillar/arts") // Some + * const maybePillar = getPillarFromId("pillar/arts") // Some */ const getPillarFromId = (pillarId: string): Optional => { switch (pillarId) { case 'pillar/opinion': - return Optional.some(ArticlePillar.Opinion); + return Optional.some(Pillar.Opinion); case 'pillar/sport': - return Optional.some(ArticlePillar.Sport); + return Optional.some(Pillar.Sport); case 'pillar/arts': - return Optional.some(ArticlePillar.Culture); + return Optional.some(Pillar.Culture); case 'pillar/lifestyle': - return Optional.some(ArticlePillar.Lifestyle); + return Optional.some(Pillar.Lifestyle); case 'pillar/news': - return Optional.some(ArticlePillar.News); + return Optional.some(Pillar.News); default: return Optional.none(); } @@ -47,68 +101,68 @@ const getPillarFromId = (pillarId: string): Optional => { /** * Does the same as {@linkcode getPillarFromId}, but falls back to - * {@linkcode ArticlePillar.News} if parsing fails, instead of returning an + * {@linkcode Pillar.News} if parsing fails, instead of returning an * `Optional`. * * @param pillarId A pillar expressed as a `string`, e.g. `"pillar/news"`. - * @returns An {@linkcode ArticlePillar} if the id is valid, otherwise - * {@linkcode ArticlePillar.News}. + * @returns An {@linkcode Pillar} if the id is valid, otherwise + * {@linkcode Pillar.News}. * * @example - * const pillar = getPillarOrElseNews("pillar/arts") // ArticlePillar.Culture - * const pillar = getPillarOrElseNews("invalid id") // ArticlePillar.News + * const pillar = getPillarOrElseNews("pillar/arts") // Pillar.Culture + * const pillar = getPillarOrElseNews("invalid id") // Pillar.News */ const getPillarOrElseNews = (pillarId: string): Pillar => - getPillarFromId(pillarId).withDefault(ArticlePillar.News); + getPillarFromId(pillarId).withDefault(Pillar.News); /** - * Converts an {@linkcode ArticlePillar} into a `string`. The `string` will be + * Converts an {@linkcode Pillar} into a `string`. The `string` will be * in the pillar id format used by CAPI; for example `"pillar/news"`. Note that * CAPI uses `"pillar/arts"` for the culture pillar. * - * @param pillar An {@linkcode ArticlePillar} + * @param pillar An {@linkcode Pillar} * @returns A pillar in `string` form, using the pillar id CAPI format * * @example - * const pillarString = pillarToId(ArticlePillar.Culture) // "pillar/arts" + * const pillarString = pillarToId(Pillar.Culture) // "pillar/arts" */ const pillarToId = (pillar: Pillar): string => { switch (pillar) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return 'pillar/opinion'; - case ArticlePillar.Sport: + case Pillar.Sport: return 'pillar/sport'; - case ArticlePillar.Culture: + case Pillar.Culture: return 'pillar/arts'; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return 'pillar/lifestyle'; - case ArticlePillar.News: + case Pillar.News: return 'pillar/news'; } }; /** - * Converts an {@linkcode ArticleTheme} into the {@linkcode ArticlePillar} - * subset. For any `ArticleTheme` that isn't already an `ArticlePillar`, such + * Converts an {@linkcode ArticleTheme} into the {@linkcode Pillar} + * subset. For any `ArticleTheme` that isn't already an `Pillar`, such * as {@linkcode ArticleSpecial.SpecialReport}, will fall back to - * {@linkcode ArticlePillar.News}. + * {@linkcode Pillar.News}. * * @param theme An {@linkcode ArticleTheme} - * @returns An {@linkcode ArticlePillar} + * @returns An {@linkcode Pillar} * * @example - * const themeOne: ArticleTheme = ArticlePillar.Lifestyle - * const pillar: ArticlePillar = themeToPillar(themeOne) // ArticlePillar.Lifestyle + * const themeOne: ArticleTheme = Pillar.Lifestyle + * const pillar: Pillar = themeToPillar(themeOne) // Pillar.Lifestyle * * const themeTwo: ArticleTheme = ArticleSpecial.SpecialReport - * const pillar: ArticlePillar = themeToPillar(themeTwo) // ArticlePillar.News + * const pillar: Pillar = themeToPillar(themeTwo) // Pillar.News */ const themeToPillar = (theme: ArticleTheme): Pillar => { switch (theme) { case ArticleSpecial.SpecialReport: case ArticleSpecial.SpecialReportAlt: case ArticleSpecial.Labs: - return ArticlePillar.News; + return Pillar.News; default: return theme; } @@ -209,15 +263,15 @@ const displayToString = (display: ArticleDisplay): string => { */ const themeToString = (theme: ArticleTheme): string => { switch (theme) { - case ArticlePillar.News: + case Pillar.News: return 'News'; - case ArticlePillar.Opinion: + case Pillar.Opinion: return 'Opinion'; - case ArticlePillar.Sport: + case Pillar.Sport: return 'Sport'; - case ArticlePillar.Culture: + case Pillar.Culture: return 'Culture'; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return 'Lifestyle'; case ArticleSpecial.Labs: return 'Labs'; @@ -245,6 +299,12 @@ const formatToString = ({ design, display, theme }: ArticleFormat): string => // ----- Exports ----- // export { + ArticleDesign, + ArticleDisplay, + ArticleSpecial, + ArticleTheme, + ArticleFormat, + Pillar, formatToString, getPillarFromId, getPillarOrElseNews, From 5e3266e7f4044db04d9ecba7c36f8fbb8128558e Mon Sep 17 00:00:00 2001 From: James Mockett <1166188+jamesmockett@users.noreply.github.com> Date: Thu, 3 Oct 2024 11:33:36 +0100 Subject: [PATCH 2/2] Update imports to use local copy of article format types --- apps-rendering/src/adSlot.stories.tsx | 10 +- apps-rendering/src/adSlot.tsx | 2 +- apps-rendering/src/ads.ts | 2 +- apps-rendering/src/articleFormat.test.ts | 4 +- apps-rendering/src/bodyElement.ts | 2 +- apps-rendering/src/campaign.test.ts | 2 +- apps-rendering/src/campaign.ts | 2 +- apps-rendering/src/client/callouts.ts | 8 +- .../src/components/Anchor/Anchor.stories.tsx | 4 +- .../src/components/Anchor/index.tsx | 7 +- .../src/components/ArticleBody/index.tsx | 2 +- .../src/components/Avatar/index.tsx | 2 +- .../Blockquote/Blockquote.stories.tsx | 4 +- .../src/components/Blockquote/index.tsx | 2 +- .../BodyImage/BodyImage.defaults.tsx | 2 +- .../BodyImage/BodyImage.stories.tsx | 10 +- .../components/BodyImage/GalleryBodyImage.tsx | 2 +- .../src/components/BodyImage/index.tsx | 2 +- .../src/components/Bullet/Bullet.stories.tsx | 4 +- .../src/components/Bullet/index.tsx | 2 +- .../src/components/Byline/AnalysisByline.tsx | 2 +- .../src/components/Byline/Byline.defaults.tsx | 2 +- .../src/components/Byline/Byline.stories.tsx | 10 +- .../src/components/Byline/CommentByline.tsx | 2 +- .../src/components/Byline/DeadBlogByline.tsx | 2 +- .../src/components/Byline/GalleryByline.tsx | 2 +- .../src/components/Byline/LabsByline.tsx | 2 +- .../src/components/Byline/LiveBlogByline.tsx | 2 +- .../src/components/Byline/index.tsx | 7 +- .../src/components/BylineCard/index.tsx | 2 +- .../components/Callout/Callout.stories.tsx | 10 +- .../src/components/Callout/calloutBlock.tsx | 2 +- .../src/components/Callout/index.tsx | 2 +- .../CaptionIcon/CaptionIcon.stories.tsx | 6 +- .../src/components/CaptionIcon/index.tsx | 3 +- apps-rendering/src/components/Card/index.tsx | 8 +- .../CommentCount/CommentCount.stories.tsx | 4 +- .../src/components/CommentCount/index.tsx | 3 +- .../src/components/Credit/index.tsx | 3 +- .../src/components/Cutout/index.tsx | 2 +- .../components/Dateline/Dateline.stories.tsx | 8 +- .../src/components/Dateline/index.tsx | 3 +- .../DesignTag/DesignTag.stories.tsx | 2 +- .../src/components/DesignTag/index.tsx | 3 +- .../src/components/EmailSignupForm/index.tsx | 2 +- .../FigCaption/FigCaption.stories.tsx | 6 +- .../src/components/FigCaption/index.tsx | 3 +- .../FirstPublished/FirstPublished.stories.tsx | 8 +- .../src/components/FirstPublished/index.tsx | 2 +- .../src/components/Follow/Follow.stories.tsx | 6 +- .../src/components/Follow/Follow.test.tsx | 4 +- .../src/components/Follow/index.tsx | 3 +- .../src/components/Footer/Footer.defaults.tsx | 2 +- .../src/components/Footer/GalleryFooter.tsx | 2 +- .../src/components/Footer/ImmersiveFooter.tsx | 2 +- .../src/components/Footer/index.tsx | 7 +- .../HeadingTwo/HeadingTwo.defaults.tsx | 2 +- .../HeadingTwo/ImmersiveHeadingTwo.tsx | 2 +- .../src/components/HeadingTwo/index.tsx | 2 +- .../components/Headline/GalleryHeadline.tsx | 2 +- .../components/Headline/Headline.defaults.tsx | 3 +- .../components/Headline/Headline.stories.tsx | 6 +- .../components/Headline/ImmersiveHeadline.tsx | 2 +- .../src/components/Headline/index.tsx | 6 +- .../HeadlineByline/HeadlineByline.stories.tsx | 4 +- .../src/components/HeadlineByline/index.tsx | 3 +- apps-rendering/src/components/Img/index.tsx | 4 +- .../src/components/ImgAlt/ImgAlt.stories.tsx | 6 +- .../src/components/ImgAlt/index.tsx | 3 +- .../InPageNewsletterSignup.stories.tsx | 6 +- .../InPageNewsletterSignup/index.tsx | 2 +- .../src/components/InteractiveAtom/index.tsx | 2 +- .../KeyEvents/KeyEvents.stories.tsx | 17 +- .../src/components/KeyEvents/index.tsx | 16 +- .../src/components/Kicker/index.tsx | 3 +- .../src/components/Layout/AnalysisLayout.tsx | 2 +- .../src/components/Layout/CommentLayout.tsx | 2 +- .../src/components/Layout/GalleryLayout.tsx | 2 +- .../src/components/Layout/ImmersiveLayout.tsx | 2 +- .../src/components/Layout/Layout.stories.tsx | 3 +- .../src/components/Layout/LetterLayout.tsx | 2 +- .../src/components/Layout/LiveLayout.tsx | 3 +- .../Layout/NewsletterSignUpLayout.tsx | 2 +- .../src/components/Layout/StandardLayout.tsx | 5 +- .../src/components/Layout/index.tsx | 6 +- .../src/components/List/List.stories.tsx | 4 +- apps-rendering/src/components/List/index.tsx | 2 +- .../src/components/LiveBlock/index.tsx | 2 +- .../components/LiveBlockContainer/index.tsx | 2 +- .../src/components/LiveBlocks/index.tsx | 3 +- .../src/components/LiveDateline/index.tsx | 3 +- .../src/components/LiveblogHeader/index.tsx | 2 +- apps-rendering/src/components/Logo/index.tsx | 3 +- .../components/MainMedia/GalleryCaption.tsx | 2 +- .../components/MainMedia/ImmersiveCaption.tsx | 2 +- .../MainMediaImage/BlogMainMediaImage.tsx | 2 +- .../MainMediaImage/CommentMainMediaImage.tsx | 2 +- .../MainMediaImage/GalleryMainMediaImage.tsx | 2 +- .../ImmersiveMainMediaImage.tsx | 2 +- .../InterviewMainMediaImage.tsx | 2 +- .../MainMediaImage.defaults.tsx | 2 +- .../NewsletterSignupMainMediaImage.tsx | 2 +- .../MainMedia/MainMediaImage/index.tsx | 7 +- .../MainMedia/MainMediaVideo/index.tsx | 3 +- .../src/components/MainMedia/index.tsx | 2 +- .../components/MainMediaCaption/Caption.tsx | 2 +- .../MainMediaCaption.defaults.tsx | 2 +- .../MainMediaCaption.stories.tsx | 4 +- .../MainMediaCaption.test.tsx | 4 +- .../src/components/MainMediaCaption/index.tsx | 2 +- .../components/Metadata/GalleryMetadata.tsx | 2 +- .../components/Metadata/ImmersiveMetadata.tsx | 2 +- .../components/Metadata/LiveBlogMetadata.tsx | 3 +- .../src/components/Metadata/index.tsx | 2 +- .../NewsletterSignup.stories.tsx | 10 +- .../NewsletterSignup/PrivacyWording.tsx | 2 +- .../src/components/NewsletterSignup/index.tsx | 9 +- .../Pagination/Pagination.stories.tsx | 7 +- .../src/components/Pagination/index.tsx | 2 +- .../Paragraph/Paragraph.stories.tsx | 6 +- .../src/components/Paragraph/index.tsx | 7 +- .../PinnedPost/PinnedPost.stories.tsx | 18 +- .../src/components/PinnedPost/index.tsx | 2 +- .../Pullquote/Pullquote.stories.tsx | 4 +- .../src/components/Pullquote/index.tsx | 2 +- .../RelatedContent/GalleryRelatedContent.tsx | 2 +- .../ImmersiveRelatedContent.tsx | 2 +- .../src/components/RelatedContent/index.tsx | 2 +- .../components/RichLink/RichLink.stories.tsx | 6 +- .../src/components/RichLink/index.tsx | 19 +- .../src/components/Series/GallerySeries.tsx | 2 +- .../src/components/Series/ImmersiveSeries.tsx | 2 +- .../src/components/Series/index.tsx | 8 +- .../SpecialReportAltAtom.stories.tsx | 6 +- .../components/SpecialReportAltAtom/index.tsx | 2 +- .../Standfirst/DeadBlogStandfirst.tsx | 2 +- .../Standfirst/GalleryStandfirst.tsx | 2 +- .../Standfirst/ImmersiveStandfirst.tsx | 2 +- .../components/Standfirst/MediaStandfirst.tsx | 2 +- .../Standfirst/Standfirst.defaults.tsx | 2 +- .../Standfirst/Standfirst.stories.tsx | 14 +- .../src/components/Standfirst/index.tsx | 6 +- .../src/components/StarRating/index.tsx | 2 +- .../TableOfContents.stories.tsx | 12 +- .../src/components/TableOfContents/index.tsx | 7 +- .../src/components/Tags/GalleryTags.tsx | 2 +- .../src/components/Tags/Tags.defaults.tsx | 2 +- .../src/components/Tags/Tags.stories.tsx | 2 +- apps-rendering/src/components/Tags/index.tsx | 2 +- .../src/components/WithAgeWarning/index.tsx | 7 +- .../src/components/caption/caption.tsx | 3 +- .../editions/byline/byline.stories.tsx | 16 +- .../src/components/editions/byline/index.tsx | 7 +- .../editions/cartoon/cartoon.stories.tsx | 2 +- .../src/components/editions/cartoon/index.tsx | 2 +- .../galleryImage/galleryImage.stories.tsx | 4 +- .../editions/galleryImage/index.tsx | 2 +- .../src/components/editions/header/index.tsx | 2 +- .../headerMedia/headerMedia.stories.tsx | 10 +- .../components/editions/headerMedia/index.tsx | 7 +- .../editions/headline/headline.stories.tsx | 23 +- .../components/editions/headline/index.tsx | 7 +- .../src/components/editions/layout/index.tsx | 7 +- .../editions/layout/layout.stories.tsx | 3 +- .../components/editions/pullquote/index.tsx | 2 +- .../editions/pullquote/pullquote.stories.tsx | 10 +- .../src/components/editions/series/index.tsx | 2 +- .../editions/series/series.stories.tsx | 8 +- .../editions/shareIcon/shareIcon.stories.tsx | 4 +- .../components/editions/standfirst/index.tsx | 7 +- .../standfirst/standfirst.stories.tsx | 12 +- .../components/editions/starRating/index.tsx | 2 +- .../src/components/editions/styles.ts | 26 +- .../src/components/media/articleBody.tsx | 2 +- .../src/components/media/articleSeries.tsx | 2 +- apps-rendering/src/fixtures/article.ts | 23 +- apps-rendering/src/fixtures/item.ts | 6 +- apps-rendering/src/fixtures/live.ts | 10 +- apps-rendering/src/image.ts | 2 +- apps-rendering/src/item.test.ts | 2 +- apps-rendering/src/item.ts | 12 +- apps-rendering/src/newsletter.ts | 3 +- apps-rendering/src/palette/background.ts | 286 +++++----- apps-rendering/src/palette/border.ts | 78 +-- apps-rendering/src/palette/fill.ts | 178 +++--- apps-rendering/src/palette/hover.ts | 13 +- apps-rendering/src/palette/text.ts | 524 +++++++++--------- apps-rendering/src/renderer.test.ts | 5 +- apps-rendering/src/renderer.ts | 8 +- apps-rendering/src/server/csp.ts | 2 +- apps-rendering/src/server/editionsPage.tsx | 2 +- apps-rendering/src/server/page.tsx | 7 +- apps-rendering/src/server/server.ts | 13 +- apps-rendering/src/styles.ts | 3 +- apps-rendering/src/testsHelper.ts | 10 +- 195 files changed, 1017 insertions(+), 936 deletions(-) diff --git a/apps-rendering/src/adSlot.stories.tsx b/apps-rendering/src/adSlot.stories.tsx index 82ee46ada06..4cb33b583ac 100644 --- a/apps-rendering/src/adSlot.stories.tsx +++ b/apps-rendering/src/adSlot.stories.tsx @@ -1,14 +1,18 @@ // ----- Imports ----- // -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, + Pillar, +} from 'articleFormat'; import AdSlot from 'adSlot'; import type { ReactElement } from 'react'; // ----- Stories ----- // const mockFormat: ArticleFormat = { - theme: ArticlePillar.News, + theme: Pillar.News, design: ArticleDesign.Standard, display: ArticleDisplay.Standard, }; diff --git a/apps-rendering/src/adSlot.tsx b/apps-rendering/src/adSlot.tsx index a90e2f6c1ce..166c1a089ae 100644 --- a/apps-rendering/src/adSlot.tsx +++ b/apps-rendering/src/adSlot.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css, ThemeProvider } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from 'articleFormat'; import { from, headlineMedium17, diff --git a/apps-rendering/src/ads.ts b/apps-rendering/src/ads.ts index 3eb9d2b2f58..8d85bc0b8b4 100644 --- a/apps-rendering/src/ads.ts +++ b/apps-rendering/src/ads.ts @@ -1,4 +1,4 @@ -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from 'articleFormat'; import AdSlot from 'adSlot'; import Paragraph from 'components/Paragraph'; import type { ReactNode } from 'react'; diff --git a/apps-rendering/src/articleFormat.test.ts b/apps-rendering/src/articleFormat.test.ts index 765c21f0a39..2dd817791ed 100644 --- a/apps-rendering/src/articleFormat.test.ts +++ b/apps-rendering/src/articleFormat.test.ts @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from 'articleFormat'; import { formatToString } from 'articleFormat'; // ----- Tests ----- // @@ -10,7 +10,7 @@ describe('formatToString', () => { const format = formatToString({ design: ArticleDesign.Standard, display: ArticleDisplay.Immersive, - theme: ArticlePillar.Culture, + theme: Pillar.Culture, }); expect(format).toBe( diff --git a/apps-rendering/src/bodyElement.ts b/apps-rendering/src/bodyElement.ts index e636e1e122b..61f673c30c0 100644 --- a/apps-rendering/src/bodyElement.ts +++ b/apps-rendering/src/bodyElement.ts @@ -7,7 +7,7 @@ import type { Newsletter } from '@guardian/apps-rendering-api-models/newsletter' import type { Atoms } from '@guardian/content-api-models/v1/atoms'; import type { BlockElement } from '@guardian/content-api-models/v1/blockElement'; import { ElementType } from '@guardian/content-api-models/v1/elementType'; -import type { ArticleTheme } from '@guardian/libs'; +import type { ArticleTheme } from 'articleFormat'; import type { Option } from '../vendor/@guardian/types/index'; import { fromNullable } from '../vendor/@guardian/types/index'; import type { TimelineEvent } from 'atoms'; diff --git a/apps-rendering/src/campaign.test.ts b/apps-rendering/src/campaign.test.ts index 80a386287b5..5f1dfe18cc9 100644 --- a/apps-rendering/src/campaign.test.ts +++ b/apps-rendering/src/campaign.test.ts @@ -3,7 +3,7 @@ import { Campaign } from '@guardian/apps-rendering-api-models/campaign'; import { CampaignFields } from '@guardian/apps-rendering-api-models/campaignFields'; import { ParticipationFields } from '@guardian/apps-rendering-api-models/participationFields'; -import { ArticleSpecial } from '@guardian/libs'; +import { ArticleSpecial } from 'articleFormat'; import { Int64 } from 'thrift'; import { getCallout, getReport } from 'campaign'; diff --git a/apps-rendering/src/campaign.ts b/apps-rendering/src/campaign.ts index a72dbbb9da9..3a928344294 100644 --- a/apps-rendering/src/campaign.ts +++ b/apps-rendering/src/campaign.ts @@ -2,7 +2,7 @@ import type { Campaign } from '@guardian/apps-rendering-api-models/campaign'; import type { ParticipationFields } from '@guardian/apps-rendering-api-models/participationFields'; -import { ArticleSpecial } from '@guardian/libs'; +import { ArticleSpecial } from 'articleFormat'; import { Optional } from 'optional'; export type CalloutFields = { diff --git a/apps-rendering/src/client/callouts.ts b/apps-rendering/src/client/callouts.ts index 6588419139e..3f2c7614728 100644 --- a/apps-rendering/src/client/callouts.ts +++ b/apps-rendering/src/client/callouts.ts @@ -3,8 +3,12 @@ import type { Contact } from '@guardian/apps-rendering-api-models/contact'; import type { FormField } from '@guardian/apps-rendering-api-models/formField'; import type { FormOption } from '@guardian/apps-rendering-api-models/formOption'; -import { ArticleSpecial, Pillar } from '@guardian/libs'; -import type { ArticleFormat, ArticleTheme } from '@guardian/libs'; +import { + type ArticleFormat, + ArticleSpecial, + type ArticleTheme, + Pillar, +} from 'articleFormat'; import { withDefault } from '../../vendor/@guardian/types/index'; import { ElementKind } from 'bodyElementKind'; import { pipe, resultFromNullable } from 'lib'; diff --git a/apps-rendering/src/components/Anchor/Anchor.stories.tsx b/apps-rendering/src/components/Anchor/Anchor.stories.tsx index b5477e19d28..46e5180204c 100644 --- a/apps-rendering/src/components/Anchor/Anchor.stories.tsx +++ b/apps-rendering/src/components/Anchor/Anchor.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import { getAllThemes, getThemeNameAsString } from 'fixtures/article'; import Anchor from './'; @@ -16,7 +16,7 @@ const Default = () => ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} href={link} > diff --git a/apps-rendering/src/components/Anchor/index.tsx b/apps-rendering/src/components/Anchor/index.tsx index f1d41ca78da..58eb85cf3e4 100644 --- a/apps-rendering/src/components/Anchor/index.tsx +++ b/apps-rendering/src/components/Anchor/index.tsx @@ -2,8 +2,11 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticleSpecial } from '@guardian/libs'; +import { + ArticleDesign, + type ArticleFormat, + ArticleSpecial, +} from '../../articleFormat'; import { labs, neutral } from '@guardian/source/foundations'; import { text } from 'palette'; import type { ReactNode } from 'react'; diff --git a/apps-rendering/src/components/ArticleBody/index.tsx b/apps-rendering/src/components/ArticleBody/index.tsx index e2238249824..4ba29e51ebb 100644 --- a/apps-rendering/src/components/ArticleBody/index.tsx +++ b/apps-rendering/src/components/ArticleBody/index.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { palette, remSpace } from '@guardian/source/foundations'; import type { BodyElement } from 'bodyElement'; import { background } from 'palette'; diff --git a/apps-rendering/src/components/Avatar/index.tsx b/apps-rendering/src/components/Avatar/index.tsx index 60098332487..2e23003692d 100644 --- a/apps-rendering/src/components/Avatar/index.tsx +++ b/apps-rendering/src/components/Avatar/index.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { remSpace } from '@guardian/source/foundations'; import { map, withDefault } from '../../../vendor/@guardian/types/index'; import Img from 'components/Img'; diff --git a/apps-rendering/src/components/Blockquote/Blockquote.stories.tsx b/apps-rendering/src/components/Blockquote/Blockquote.stories.tsx index 56d4e936060..0a521b2be50 100644 --- a/apps-rendering/src/components/Blockquote/Blockquote.stories.tsx +++ b/apps-rendering/src/components/Blockquote/Blockquote.stories.tsx @@ -1,11 +1,11 @@ -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import Paragraph from 'components/Paragraph'; import Blockquote from './'; const standard = { design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }; const Default = () => ( diff --git a/apps-rendering/src/components/Blockquote/index.tsx b/apps-rendering/src/components/Blockquote/index.tsx index 5043d7c3ecd..8981cf4cb20 100644 --- a/apps-rendering/src/components/Blockquote/index.tsx +++ b/apps-rendering/src/components/Blockquote/index.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { remSpace } from '@guardian/source/foundations'; import { fill } from 'palette'; import type { ReactNode } from 'react'; diff --git a/apps-rendering/src/components/BodyImage/BodyImage.defaults.tsx b/apps-rendering/src/components/BodyImage/BodyImage.defaults.tsx index 099556c696f..7bfafa620c1 100644 --- a/apps-rendering/src/components/BodyImage/BodyImage.defaults.tsx +++ b/apps-rendering/src/components/BodyImage/BodyImage.defaults.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; import { ArticleElementRole } from '@guardian/libs'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, remSpace } from '@guardian/source/foundations'; import type { Breakpoint } from '@guardian/source/foundations'; import type { Option } from '../../../vendor/@guardian/types/index'; diff --git a/apps-rendering/src/components/BodyImage/BodyImage.stories.tsx b/apps-rendering/src/components/BodyImage/BodyImage.stories.tsx index 18807382a31..d75a5d06da9 100644 --- a/apps-rendering/src/components/BodyImage/BodyImage.stories.tsx +++ b/apps-rendering/src/components/BodyImage/BodyImage.stories.tsx @@ -1,11 +1,7 @@ // ----- Imports ----- // -import { - ArticleDesign, - ArticleDisplay, - ArticleElementRole, - ArticlePillar, -} from '@guardian/libs'; +import { ArticleElementRole } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import { none } from '../../../vendor/@guardian/types/index'; import { image } from 'fixtures/image'; import { Optional } from 'optional'; @@ -16,7 +12,7 @@ import BodyImage from '.'; const format = { design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }; const caption = Optional.some( 'Age of the train … a tourist train in Switzerland. Photograph: Kisa_Markiza/Getty Images', diff --git a/apps-rendering/src/components/BodyImage/GalleryBodyImage.tsx b/apps-rendering/src/components/BodyImage/GalleryBodyImage.tsx index d4a0f19cb3a..32280f0ff70 100644 --- a/apps-rendering/src/components/BodyImage/GalleryBodyImage.tsx +++ b/apps-rendering/src/components/BodyImage/GalleryBodyImage.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, headlineMedium17, diff --git a/apps-rendering/src/components/BodyImage/index.tsx b/apps-rendering/src/components/BodyImage/index.tsx index 30c3d05d5e6..8afbe518d4f 100644 --- a/apps-rendering/src/components/BodyImage/index.tsx +++ b/apps-rendering/src/components/BodyImage/index.tsx @@ -1,5 +1,5 @@ // ----- Imports ----- // -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign } from '../../articleFormat'; import type { Breakpoint } from '@guardian/source/foundations'; import type { Option } from '../../../vendor/@guardian/types/index'; import { none } from '../../../vendor/@guardian/types/index'; diff --git a/apps-rendering/src/components/Bullet/Bullet.stories.tsx b/apps-rendering/src/components/Bullet/Bullet.stories.tsx index dc9017c2b9d..0f6479673fc 100644 --- a/apps-rendering/src/components/Bullet/Bullet.stories.tsx +++ b/apps-rendering/src/components/Bullet/Bullet.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import Bullet from './'; // ----- Stories ----- // @@ -10,7 +10,7 @@ const Default = () => ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} text="• Lorem ipsum" /> diff --git a/apps-rendering/src/components/Bullet/index.tsx b/apps-rendering/src/components/Bullet/index.tsx index 11d4c7aecf9..2446417f95c 100644 --- a/apps-rendering/src/components/Bullet/index.tsx +++ b/apps-rendering/src/components/Bullet/index.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { background } from 'palette'; import { darkModeCss } from 'styles'; diff --git a/apps-rendering/src/components/Byline/AnalysisByline.tsx b/apps-rendering/src/components/Byline/AnalysisByline.tsx index dacb77bf6c0..e74894f3cb4 100644 --- a/apps-rendering/src/components/Byline/AnalysisByline.tsx +++ b/apps-rendering/src/components/Byline/AnalysisByline.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { headlineLightItalic28, headlineLightItalic34, diff --git a/apps-rendering/src/components/Byline/Byline.defaults.tsx b/apps-rendering/src/components/Byline/Byline.defaults.tsx index 7d5b920299f..52b0cde7bbc 100644 --- a/apps-rendering/src/components/Byline/Byline.defaults.tsx +++ b/apps-rendering/src/components/Byline/Byline.defaults.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { headlineBold17, headlineMediumItalic17, diff --git a/apps-rendering/src/components/Byline/Byline.stories.tsx b/apps-rendering/src/components/Byline/Byline.stories.tsx index bb671e6a123..bcc44299447 100644 --- a/apps-rendering/src/components/Byline/Byline.stories.tsx +++ b/apps-rendering/src/components/Byline/Byline.stories.tsx @@ -3,9 +3,9 @@ import { ArticleDesign, ArticleDisplay, - ArticlePillar, ArticleSpecial, -} from '@guardian/libs'; + Pillar, +} from '../../articleFormat'; import { parse } from 'client/parser'; import { getAllThemes, getThemeNameAsString } from 'fixtures/article'; import Byline from './'; @@ -27,7 +27,7 @@ const mockBylineHtml = parseByline( const Default = () => ( ( const Analysis = () => ( ( const Comment = () => ( ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} variant={CaptionIconVariant.Image} > @@ -21,7 +21,7 @@ const Video = () => ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} variant={CaptionIconVariant.Video} > diff --git a/apps-rendering/src/components/CaptionIcon/index.tsx b/apps-rendering/src/components/CaptionIcon/index.tsx index 354e1d4d6bd..ef8d994b5e9 100644 --- a/apps-rendering/src/components/CaptionIcon/index.tsx +++ b/apps-rendering/src/components/CaptionIcon/index.tsx @@ -1,6 +1,5 @@ import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../articleFormat'; import { remSpace } from '@guardian/source/foundations'; import { SvgCamera, SvgVideo } from '@guardian/source/react-components'; import { fill } from 'palette'; diff --git a/apps-rendering/src/components/Card/index.tsx b/apps-rendering/src/components/Card/index.tsx index d5cb758f4d4..82e57eccb62 100644 --- a/apps-rendering/src/components/Card/index.tsx +++ b/apps-rendering/src/components/Card/index.tsx @@ -2,13 +2,13 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; import type { RelatedItem } from '@guardian/apps-rendering-api-models/relatedItem'; import { RelatedItemType } from '@guardian/apps-rendering-api-models/relatedItemType'; -import type { ArticleFormat } from '@guardian/libs'; import { ArticleDesign, ArticleDisplay, - ArticlePillar, + type ArticleFormat, ArticleSpecial, -} from '@guardian/libs'; + Pillar, +} from '../../articleFormat'; import { from, headlineMedium17, @@ -539,7 +539,7 @@ const formatFromRelatedItem = ( design: ArticleDesign.Comment, theme: pillar === 'pillar/news' - ? ArticlePillar.Opinion + ? Pillar.Opinion : getPillarOrElseNews(pillar), display: ArticleDisplay.Standard, }; diff --git a/apps-rendering/src/components/CommentCount/CommentCount.stories.tsx b/apps-rendering/src/components/CommentCount/CommentCount.stories.tsx index 23de9f02114..bada1631a64 100644 --- a/apps-rendering/src/components/CommentCount/CommentCount.stories.tsx +++ b/apps-rendering/src/components/CommentCount/CommentCount.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import { breakpoints } from '@guardian/source/foundations'; import { some } from '../../../vendor/@guardian/types/index'; import { getAllThemes, getThemeNameAsString } from 'fixtures/article'; @@ -12,7 +12,7 @@ import CommentCount from './'; const Default = () => ( ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.Opinion, + theme: Pillar.Opinion, }} date={some(new Date('2019-12-17T03:24:00'))} edition={Edition.UK} @@ -24,7 +24,7 @@ const LiveBlogDateline = () => ( format={{ design: ArticleDesign.LiveBlog, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} date={some(new Date('2019-12-17T03:24:00'))} edition={Edition.US} @@ -36,7 +36,7 @@ const DeadBlogDateline = () => ( format={{ design: ArticleDesign.DeadBlog, display: ArticleDisplay.Standard, - theme: ArticlePillar.Culture, + theme: Pillar.Culture, }} date={some(new Date('2019-12-17T03:24:00'))} edition={Edition.AU} diff --git a/apps-rendering/src/components/Dateline/index.tsx b/apps-rendering/src/components/Dateline/index.tsx index 5d3716cefea..c2410eecd62 100644 --- a/apps-rendering/src/components/Dateline/index.tsx +++ b/apps-rendering/src/components/Dateline/index.tsx @@ -3,8 +3,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; import type { Edition } from '@guardian/apps-rendering-api-models/edition'; -import { ArticleDesign } from '@guardian/libs'; -import type { ArticleFormat } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../articleFormat'; import { from, neutral, diff --git a/apps-rendering/src/components/DesignTag/DesignTag.stories.tsx b/apps-rendering/src/components/DesignTag/DesignTag.stories.tsx index 0c877040bbf..2f2756b7e24 100644 --- a/apps-rendering/src/components/DesignTag/DesignTag.stories.tsx +++ b/apps-rendering/src/components/DesignTag/DesignTag.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay } from '../../articleFormat'; import { getAllThemes, getThemeNameAsString } from 'fixtures/article'; import DesignTag from './'; diff --git a/apps-rendering/src/components/DesignTag/index.tsx b/apps-rendering/src/components/DesignTag/index.tsx index b3ea29e43e1..fefd2f30bd8 100644 --- a/apps-rendering/src/components/DesignTag/index.tsx +++ b/apps-rendering/src/components/DesignTag/index.tsx @@ -1,7 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../articleFormat'; import { from, headlineBold17, diff --git a/apps-rendering/src/components/EmailSignupForm/index.tsx b/apps-rendering/src/components/EmailSignupForm/index.tsx index d578ddbec62..b6b9b88e033 100644 --- a/apps-rendering/src/components/EmailSignupForm/index.tsx +++ b/apps-rendering/src/components/EmailSignupForm/index.tsx @@ -2,7 +2,7 @@ import { css } from '@emotion/react'; import type { SerializedStyles } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { neutral, pxToRem, diff --git a/apps-rendering/src/components/FigCaption/FigCaption.stories.tsx b/apps-rendering/src/components/FigCaption/FigCaption.stories.tsx index b15a61a6b49..2c2e621ce22 100644 --- a/apps-rendering/src/components/FigCaption/FigCaption.stories.tsx +++ b/apps-rendering/src/components/FigCaption/FigCaption.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import { CaptionIconVariant } from 'components/CaptionIcon'; import { Optional } from 'optional'; import type { ReactElement } from 'react'; @@ -13,7 +13,7 @@ const Image = (): ReactElement => ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} variant={CaptionIconVariant.Image} > @@ -28,7 +28,7 @@ const Video = (): ReactElement => ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} variant={CaptionIconVariant.Video} > diff --git a/apps-rendering/src/components/FigCaption/index.tsx b/apps-rendering/src/components/FigCaption/index.tsx index 4969207a200..77b1b221989 100644 --- a/apps-rendering/src/components/FigCaption/index.tsx +++ b/apps-rendering/src/components/FigCaption/index.tsx @@ -2,8 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../articleFormat'; import { neutral, remSpace, textSans14 } from '@guardian/source/foundations'; import CaptionIcon from 'components/CaptionIcon'; import type { CaptionIconVariant } from 'components/CaptionIcon'; diff --git a/apps-rendering/src/components/FirstPublished/FirstPublished.stories.tsx b/apps-rendering/src/components/FirstPublished/FirstPublished.stories.tsx index 72ea99e9134..64c3c6c126d 100644 --- a/apps-rendering/src/components/FirstPublished/FirstPublished.stories.tsx +++ b/apps-rendering/src/components/FirstPublished/FirstPublished.stories.tsx @@ -1,7 +1,7 @@ // ----- Imports ----- // import { Edition } from '@guardian/apps-rendering-api-models/edition'; -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import FirstPublished from '.'; // ----- Stories ----- // @@ -15,7 +15,7 @@ const Default = () => ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} edition={Edition.UK} /> @@ -30,7 +30,7 @@ const PinnedPost = () => ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} edition={Edition.UK} /> @@ -45,7 +45,7 @@ const OriginalPinnedPost = () => ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} edition={Edition.UK} /> diff --git a/apps-rendering/src/components/FirstPublished/index.tsx b/apps-rendering/src/components/FirstPublished/index.tsx index c4d0f0e0d17..64b7ee602fb 100644 --- a/apps-rendering/src/components/FirstPublished/index.tsx +++ b/apps-rendering/src/components/FirstPublished/index.tsx @@ -1,6 +1,6 @@ import { css } from '@emotion/react'; import type { Edition } from '@guardian/apps-rendering-api-models/edition'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { timeAgo } from '@guardian/libs'; import { neutral, diff --git a/apps-rendering/src/components/Follow/Follow.stories.tsx b/apps-rendering/src/components/Follow/Follow.stories.tsx index 70c21488e76..68794231b8d 100644 --- a/apps-rendering/src/components/Follow/Follow.stories.tsx +++ b/apps-rendering/src/components/Follow/Follow.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import { none } from '../../../vendor/@guardian/types/index'; import { getAllThemes, getThemeNameAsString } from 'fixtures/article'; import Follow from './'; @@ -18,7 +18,7 @@ const Default = () => ( }, ]} format={{ - theme: ArticlePillar.News, + theme: Pillar.News, design: ArticleDesign.Standard, display: ArticleDisplay.Standard, }} @@ -36,7 +36,7 @@ const Comment = () => ( }, ]} format={{ - theme: ArticlePillar.Opinion, + theme: Pillar.Opinion, design: ArticleDesign.Comment, display: ArticleDisplay.Standard, }} diff --git a/apps-rendering/src/components/Follow/Follow.test.tsx b/apps-rendering/src/components/Follow/Follow.test.tsx index eee824885b4..b2255f09e95 100644 --- a/apps-rendering/src/components/Follow/Follow.test.tsx +++ b/apps-rendering/src/components/Follow/Follow.test.tsx @@ -6,7 +6,7 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import { none } from '../../../vendor/@guardian/types/index'; import { FollowTagStatus } from 'components/FollowStatus'; import type { Contributor } from 'contributor'; @@ -19,7 +19,7 @@ import Follow from './'; // ----- Setup ----- // const followFormat = { - theme: ArticlePillar.News, + theme: Pillar.News, design: ArticleDesign.Standard, display: ArticleDisplay.Standard, }; diff --git a/apps-rendering/src/components/Follow/index.tsx b/apps-rendering/src/components/Follow/index.tsx index b3987d9b537..7c2cbdb507c 100644 --- a/apps-rendering/src/components/Follow/index.tsx +++ b/apps-rendering/src/components/Follow/index.tsx @@ -2,8 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleSpecial } from '@guardian/libs'; +import { type ArticleFormat, ArticleSpecial } from '../../articleFormat'; import { remSpace, space, textSans15 } from '@guardian/source/foundations'; import { FollowNotificationStatus } from 'components/FollowStatus'; import type { Contributor } from 'contributor'; diff --git a/apps-rendering/src/components/Footer/Footer.defaults.tsx b/apps-rendering/src/components/Footer/Footer.defaults.tsx index c82f0e4a3d7..3851057ecca 100644 --- a/apps-rendering/src/components/Footer/Footer.defaults.tsx +++ b/apps-rendering/src/components/Footer/Footer.defaults.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { breakpoints, from, diff --git a/apps-rendering/src/components/Footer/GalleryFooter.tsx b/apps-rendering/src/components/Footer/GalleryFooter.tsx index 88f9db1529d..e9440d5f52e 100644 --- a/apps-rendering/src/components/Footer/GalleryFooter.tsx +++ b/apps-rendering/src/components/Footer/GalleryFooter.tsx @@ -2,7 +2,7 @@ import { css } from '@emotion/react'; import type { SerializedStyles } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, neutral, remSpace } from '@guardian/source/foundations'; import { grid } from 'grid/grid'; import { background, border, text } from 'palette'; diff --git a/apps-rendering/src/components/Footer/ImmersiveFooter.tsx b/apps-rendering/src/components/Footer/ImmersiveFooter.tsx index c796fd8bb6c..0df58792d4f 100644 --- a/apps-rendering/src/components/Footer/ImmersiveFooter.tsx +++ b/apps-rendering/src/components/Footer/ImmersiveFooter.tsx @@ -2,7 +2,7 @@ import { css } from '@emotion/react'; import type { SerializedStyles } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from } from '@guardian/source/foundations'; import { grid } from 'grid/grid'; import LeftCentreBorder from 'grid/LeftCentreBorder'; diff --git a/apps-rendering/src/components/Footer/index.tsx b/apps-rendering/src/components/Footer/index.tsx index 3d351755b76..bc74e0d40d7 100644 --- a/apps-rendering/src/components/Footer/index.tsx +++ b/apps-rendering/src/components/Footer/index.tsx @@ -1,7 +1,10 @@ // ----- Imports ----- // -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, +} from '../../articleFormat'; import DefaultFooter, { defaultStyles } from './Footer.defaults'; import GalleryFooter from './GalleryFooter'; import ImmersiveFooter from './ImmersiveFooter'; diff --git a/apps-rendering/src/components/HeadingTwo/HeadingTwo.defaults.tsx b/apps-rendering/src/components/HeadingTwo/HeadingTwo.defaults.tsx index 413d2235900..22ae239f35b 100644 --- a/apps-rendering/src/components/HeadingTwo/HeadingTwo.defaults.tsx +++ b/apps-rendering/src/components/HeadingTwo/HeadingTwo.defaults.tsx @@ -1,7 +1,7 @@ // ----- Imports ----- // import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { headlineBold20, remSpace } from '@guardian/source/foundations'; import { withDefault } from '../../../vendor/@guardian/types/index'; import type { HeadingTwo as HeadingTwoType } from 'bodyElement'; diff --git a/apps-rendering/src/components/HeadingTwo/ImmersiveHeadingTwo.tsx b/apps-rendering/src/components/HeadingTwo/ImmersiveHeadingTwo.tsx index d9c372d94f7..5df1d6bcae6 100644 --- a/apps-rendering/src/components/HeadingTwo/ImmersiveHeadingTwo.tsx +++ b/apps-rendering/src/components/HeadingTwo/ImmersiveHeadingTwo.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { headlineLight34 } from '@guardian/source/foundations'; import { text } from 'palette'; import { darkModeCss } from 'styles'; diff --git a/apps-rendering/src/components/HeadingTwo/index.tsx b/apps-rendering/src/components/HeadingTwo/index.tsx index ed3f92f1b18..b708fb0f876 100644 --- a/apps-rendering/src/components/HeadingTwo/index.tsx +++ b/apps-rendering/src/components/HeadingTwo/index.tsx @@ -1,4 +1,4 @@ -import { ArticleDisplay, ArticleSpecial } from '@guardian/libs'; +import { ArticleDisplay, ArticleSpecial } from '../../articleFormat'; import type { DefaultProps } from './HeadingTwo.defaults'; import DefaultHeadingTwo, { defaultStyles } from './HeadingTwo.defaults'; import ImmersiveHeadingTwo from './ImmersiveHeadingTwo'; diff --git a/apps-rendering/src/components/Headline/GalleryHeadline.tsx b/apps-rendering/src/components/Headline/GalleryHeadline.tsx index ab9d137f29a..bd5bf4bec5a 100644 --- a/apps-rendering/src/components/Headline/GalleryHeadline.tsx +++ b/apps-rendering/src/components/Headline/GalleryHeadline.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, headlineBold34, diff --git a/apps-rendering/src/components/Headline/Headline.defaults.tsx b/apps-rendering/src/components/Headline/Headline.defaults.tsx index dc10db63e59..d4acfc4b4f2 100644 --- a/apps-rendering/src/components/Headline/Headline.defaults.tsx +++ b/apps-rendering/src/components/Headline/Headline.defaults.tsx @@ -1,7 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../articleFormat'; import { from, headlineBold28, diff --git a/apps-rendering/src/components/Headline/Headline.stories.tsx b/apps-rendering/src/components/Headline/Headline.stories.tsx index 51dd0916aaa..a83fc819c26 100644 --- a/apps-rendering/src/components/Headline/Headline.stories.tsx +++ b/apps-rendering/src/components/Headline/Headline.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDisplay, Pillar } from '../../articleFormat'; import { some } from '../../../vendor/@guardian/types/index'; import { analysis, article, feature, labs, review } from 'fixtures/item'; import type { ReactElement } from 'react'; @@ -22,7 +22,7 @@ const Analysis = (): ReactElement => ( item={{ ...analysis, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -32,7 +32,7 @@ const Feature = (): ReactElement => ( item={{ ...feature, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); diff --git a/apps-rendering/src/components/Headline/ImmersiveHeadline.tsx b/apps-rendering/src/components/Headline/ImmersiveHeadline.tsx index c01a74ebf39..3df7756b27d 100644 --- a/apps-rendering/src/components/Headline/ImmersiveHeadline.tsx +++ b/apps-rendering/src/components/Headline/ImmersiveHeadline.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, headlineBold34, diff --git a/apps-rendering/src/components/Headline/index.tsx b/apps-rendering/src/components/Headline/index.tsx index 9149166b2ba..c76939c90e0 100644 --- a/apps-rendering/src/components/Headline/index.tsx +++ b/apps-rendering/src/components/Headline/index.tsx @@ -1,5 +1,9 @@ import { css } from '@emotion/react'; -import { ArticleDesign, ArticleDisplay, ArticleSpecial } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + ArticleSpecial, +} from '../../articleFormat'; import type { Item } from 'item'; import { getFormat } from 'item'; import BlogHeadline from './BlogHeadline'; diff --git a/apps-rendering/src/components/HeadlineByline/HeadlineByline.stories.tsx b/apps-rendering/src/components/HeadlineByline/HeadlineByline.stories.tsx index 33e22249d57..a9e09783afb 100644 --- a/apps-rendering/src/components/HeadlineByline/HeadlineByline.stories.tsx +++ b/apps-rendering/src/components/HeadlineByline/HeadlineByline.stories.tsx @@ -1,5 +1,5 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import type { Option } from '../../../vendor/@guardian/types/index'; import { parse } from 'client/parser'; import HeadlineByline from './'; @@ -19,7 +19,7 @@ const mockBylineHtml = (): Option => const Default = () => ( ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} lightbox={none} /> @@ -38,7 +38,7 @@ const Placeholder = () => ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} lightbox={none} /> diff --git a/apps-rendering/src/components/ImgAlt/index.tsx b/apps-rendering/src/components/ImgAlt/index.tsx index 70d7a7485a8..e32700a967e 100644 --- a/apps-rendering/src/components/ImgAlt/index.tsx +++ b/apps-rendering/src/components/ImgAlt/index.tsx @@ -2,8 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import { ArticleDesign } from '@guardian/libs'; -import type { ArticleFormat } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../articleFormat'; import { neutral } from '@guardian/source/foundations'; import { withDefault } from '../../../vendor/@guardian/types/index'; import type { Option } from '../../../vendor/@guardian/types/index'; diff --git a/apps-rendering/src/components/InPageNewsletterSignup/InPageNewsletterSignup.stories.tsx b/apps-rendering/src/components/InPageNewsletterSignup/InPageNewsletterSignup.stories.tsx index dec98651983..47c6a84a782 100644 --- a/apps-rendering/src/components/InPageNewsletterSignup/InPageNewsletterSignup.stories.tsx +++ b/apps-rendering/src/components/InPageNewsletterSignup/InPageNewsletterSignup.stories.tsx @@ -1,5 +1,5 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import InPageNewsletterSignup from '.'; // ---- Constants ---- // @@ -27,7 +27,7 @@ const Default = () => ( format={{ design: ArticleDesign.NewsletterSignup, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> @@ -45,7 +45,7 @@ const Unsupported = () => ( format={{ design: ArticleDesign.NewsletterSignup, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> diff --git a/apps-rendering/src/components/InPageNewsletterSignup/index.tsx b/apps-rendering/src/components/InPageNewsletterSignup/index.tsx index 7f5993582b7..27b4fbc0f6a 100644 --- a/apps-rendering/src/components/InPageNewsletterSignup/index.tsx +++ b/apps-rendering/src/components/InPageNewsletterSignup/index.tsx @@ -3,7 +3,7 @@ import { css } from '@emotion/react'; import type { SerializedStyles } from '@emotion/react'; import type { Newsletter } from '@guardian/apps-rendering-api-models/newsletter'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { remSpace } from '@guardian/source/foundations'; import { background, border, text } from 'palette'; import { darkModeCss } from 'styles'; diff --git a/apps-rendering/src/components/InteractiveAtom/index.tsx b/apps-rendering/src/components/InteractiveAtom/index.tsx index 4ad8b1a0e61..bdfa1d9f2e2 100644 --- a/apps-rendering/src/components/InteractiveAtom/index.tsx +++ b/apps-rendering/src/components/InteractiveAtom/index.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css, jsx as styledH } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { remSpace } from '@guardian/source/foundations'; import type { Option } from '../../../vendor/@guardian/types/index'; import { map, withDefault } from '../../../vendor/@guardian/types/index'; diff --git a/apps-rendering/src/components/KeyEvents/KeyEvents.stories.tsx b/apps-rendering/src/components/KeyEvents/KeyEvents.stories.tsx index 6f325a0e56f..def0c579b82 100644 --- a/apps-rendering/src/components/KeyEvents/KeyEvents.stories.tsx +++ b/apps-rendering/src/components/KeyEvents/KeyEvents.stories.tsx @@ -1,13 +1,14 @@ // ----- Imports ----- // import { css } from '@emotion/react'; -import type { ArticleFormat, ArticleTheme } from '@guardian/libs'; import { ArticleDesign, ArticleDisplay, - ArticlePillar, + type ArticleFormat, ArticleSpecial, -} from '@guardian/libs'; + type ArticleTheme, + Pillar, +} from '../../articleFormat'; import type { ReactElement } from 'react'; import type { KeyEvent } from '.'; import KeyEvents from '.'; @@ -85,11 +86,11 @@ const Default = (): ReactElement => ( flex-wrap: wrap; `} > - {KeyEventComp(getFormat(ArticlePillar.News), 'News')} - {KeyEventComp(getFormat(ArticlePillar.Culture), 'Culture')} - {KeyEventComp(getFormat(ArticlePillar.Lifestyle), 'Lifestyle')} - {KeyEventComp(getFormat(ArticlePillar.Opinion), 'Opinion')} - {KeyEventComp(getFormat(ArticlePillar.Sport), 'Sport')} + {KeyEventComp(getFormat(Pillar.News), 'News')} + {KeyEventComp(getFormat(Pillar.Culture), 'Culture')} + {KeyEventComp(getFormat(Pillar.Lifestyle), 'Lifestyle')} + {KeyEventComp(getFormat(Pillar.Opinion), 'Opinion')} + {KeyEventComp(getFormat(Pillar.Sport), 'Sport')} {KeyEventComp(getFormat(ArticleSpecial.Labs), 'Labs')} {KeyEventComp(getFormat(ArticleSpecial.SpecialReport), 'SpecialReport')} diff --git a/apps-rendering/src/components/KeyEvents/index.tsx b/apps-rendering/src/components/KeyEvents/index.tsx index aab3942e0ed..ef8ae7e8082 100644 --- a/apps-rendering/src/components/KeyEvents/index.tsx +++ b/apps-rendering/src/components/KeyEvents/index.tsx @@ -2,8 +2,12 @@ import { css } from '@emotion/react'; import type { SerializedStyles } from '@emotion/react'; -import type { ArticleFormat, ArticleTheme } from '@guardian/libs'; -import { ArticlePillar, timeAgo } from '@guardian/libs'; +import { + type ArticleFormat, + type ArticleTheme, + Pillar, +} from '../../articleFormat'; +import { timeAgo } from '@guardian/libs'; import { culture, from, @@ -43,13 +47,13 @@ interface ListItemProps { const getColour = (theme: ArticleTheme, paletteId: PaletteId): string => { switch (theme) { - case ArticlePillar.Sport: + case Pillar.Sport: return sport[paletteId]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[paletteId]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[paletteId]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[paletteId]; default: return news[paletteId]; diff --git a/apps-rendering/src/components/Kicker/index.tsx b/apps-rendering/src/components/Kicker/index.tsx index 22c4d8aea14..49e2e0fee82 100644 --- a/apps-rendering/src/components/Kicker/index.tsx +++ b/apps-rendering/src/components/Kicker/index.tsx @@ -1,7 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../articleFormat'; import { remSpace } from '@guardian/source/foundations'; import type { Option } from '../../../vendor/@guardian/types/index'; import { maybeRender } from 'lib'; diff --git a/apps-rendering/src/components/Layout/AnalysisLayout.tsx b/apps-rendering/src/components/Layout/AnalysisLayout.tsx index a63719ce2a9..2f07629855d 100644 --- a/apps-rendering/src/components/Layout/AnalysisLayout.tsx +++ b/apps-rendering/src/components/Layout/AnalysisLayout.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { breakpoints, from } from '@guardian/source/foundations'; import { StraightLines } from '@guardian/source-development-kitchen/react-components'; import ArticleBody from 'components/ArticleBody'; diff --git a/apps-rendering/src/components/Layout/CommentLayout.tsx b/apps-rendering/src/components/Layout/CommentLayout.tsx index d16e1b55ec2..c78f0068a49 100644 --- a/apps-rendering/src/components/Layout/CommentLayout.tsx +++ b/apps-rendering/src/components/Layout/CommentLayout.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { breakpoints, from, diff --git a/apps-rendering/src/components/Layout/GalleryLayout.tsx b/apps-rendering/src/components/Layout/GalleryLayout.tsx index 207a9044d1f..470f3b1e6f8 100644 --- a/apps-rendering/src/components/Layout/GalleryLayout.tsx +++ b/apps-rendering/src/components/Layout/GalleryLayout.tsx @@ -1,7 +1,7 @@ // ----- Imports ----- // import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import Byline from 'components/Byline'; import Footer from 'components/Footer'; import Headline from 'components/Headline'; diff --git a/apps-rendering/src/components/Layout/ImmersiveLayout.tsx b/apps-rendering/src/components/Layout/ImmersiveLayout.tsx index 8ff2ecce950..246add33dd4 100644 --- a/apps-rendering/src/components/Layout/ImmersiveLayout.tsx +++ b/apps-rendering/src/components/Layout/ImmersiveLayout.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { between, from, palette, remSpace } from '@guardian/source/foundations'; import { StraightLines } from '@guardian/source-development-kitchen/react-components'; import Footer from 'components/Footer'; diff --git a/apps-rendering/src/components/Layout/Layout.stories.tsx b/apps-rendering/src/components/Layout/Layout.stories.tsx index e579b1870c0..806623223e1 100644 --- a/apps-rendering/src/components/Layout/Layout.stories.tsx +++ b/apps-rendering/src/components/Layout/Layout.stories.tsx @@ -1,10 +1,9 @@ // ----- Imports ----- // import { Edition } from '@guardian/apps-rendering-api-models/edition'; -import { ArticleSpecial } from '@guardian/libs'; +import { ArticleSpecial, formatToString } from '../../articleFormat'; import { breakpoints } from '@guardian/source/foundations'; import type { StoryFn } from '@storybook/react'; -import { formatToString } from 'articleFormat'; import { analysis, article, diff --git a/apps-rendering/src/components/Layout/LetterLayout.tsx b/apps-rendering/src/components/Layout/LetterLayout.tsx index 31b8e27969c..a5222b3de07 100644 --- a/apps-rendering/src/components/Layout/LetterLayout.tsx +++ b/apps-rendering/src/components/Layout/LetterLayout.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { breakpoints, from } from '@guardian/source/foundations'; import { StraightLines } from '@guardian/source-development-kitchen/react-components'; import ArticleBody from 'components/ArticleBody'; diff --git a/apps-rendering/src/components/Layout/LiveLayout.tsx b/apps-rendering/src/components/Layout/LiveLayout.tsx index d7ad519274b..1b3efbc5224 100644 --- a/apps-rendering/src/components/Layout/LiveLayout.tsx +++ b/apps-rendering/src/components/Layout/LiveLayout.tsx @@ -2,8 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../articleFormat'; import { from, neutral, diff --git a/apps-rendering/src/components/Layout/NewsletterSignUpLayout.tsx b/apps-rendering/src/components/Layout/NewsletterSignUpLayout.tsx index 9e40dace37d..25f54ac8941 100644 --- a/apps-rendering/src/components/Layout/NewsletterSignUpLayout.tsx +++ b/apps-rendering/src/components/Layout/NewsletterSignUpLayout.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { brandAlt, remSpace, diff --git a/apps-rendering/src/components/Layout/StandardLayout.tsx b/apps-rendering/src/components/Layout/StandardLayout.tsx index 3661bd59659..5f427319cca 100644 --- a/apps-rendering/src/components/Layout/StandardLayout.tsx +++ b/apps-rendering/src/components/Layout/StandardLayout.tsx @@ -2,8 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat, Pillar } from '../../articleFormat'; import { breakpoints, from } from '@guardian/source/foundations'; import { DottedLines, @@ -75,7 +74,7 @@ const decideLines = ( ): JSX.Element => { const count = item.design === ArticleDesign.Comment ? 8 : 4; - if (item.theme === ArticlePillar.Sport) { + if (item.theme === Pillar.Sport) { return ; } diff --git a/apps-rendering/src/components/Layout/index.tsx b/apps-rendering/src/components/Layout/index.tsx index 583cc90ed37..3a0459dadf5 100644 --- a/apps-rendering/src/components/Layout/index.tsx +++ b/apps-rendering/src/components/Layout/index.tsx @@ -1,7 +1,11 @@ // ----- Imports ----- // import { css } from '@emotion/react'; -import { ArticleDesign, ArticleDisplay, ArticleSpecial } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + ArticleSpecial, +} from '../../articleFormat'; import { remSpace } from '@guardian/source/foundations'; import CommentLayout from 'components/Layout/CommentLayout'; import GalleryLayout from 'components/Layout/GalleryLayout'; diff --git a/apps-rendering/src/components/List/List.stories.tsx b/apps-rendering/src/components/List/List.stories.tsx index b440984a307..1be9353e765 100644 --- a/apps-rendering/src/components/List/List.stories.tsx +++ b/apps-rendering/src/components/List/List.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import ListItem from 'components/ListItem'; import List from './'; @@ -9,7 +9,7 @@ import List from './'; const format = { design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }; const listItem = A bullet point; diff --git a/apps-rendering/src/components/List/index.tsx b/apps-rendering/src/components/List/index.tsx index 16185bf448a..4030ea6e661 100644 --- a/apps-rendering/src/components/List/index.tsx +++ b/apps-rendering/src/components/List/index.tsx @@ -2,7 +2,7 @@ import { css } from '@emotion/react'; import type { SerializedStyles } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { remSpace } from '@guardian/source/foundations'; import { background } from 'palette'; import type { ReactNode } from 'react'; diff --git a/apps-rendering/src/components/LiveBlock/index.tsx b/apps-rendering/src/components/LiveBlock/index.tsx index 604c4d426f0..0796a95f4ef 100644 --- a/apps-rendering/src/components/LiveBlock/index.tsx +++ b/apps-rendering/src/components/LiveBlock/index.tsx @@ -1,6 +1,6 @@ import { css } from '@emotion/react'; import type { Edition } from '@guardian/apps-rendering-api-models/edition'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { LastUpdated } from 'components/LastUpdated'; import LiveBlockContainer from 'components/LiveBlockContainer'; import { datetimeFormat } from 'datetime'; diff --git a/apps-rendering/src/components/LiveBlockContainer/index.tsx b/apps-rendering/src/components/LiveBlockContainer/index.tsx index 536260b3beb..dcbcc0c170b 100644 --- a/apps-rendering/src/components/LiveBlockContainer/index.tsx +++ b/apps-rendering/src/components/LiveBlockContainer/index.tsx @@ -1,6 +1,6 @@ import { css } from '@emotion/react'; import type { Edition } from '@guardian/apps-rendering-api-models/edition'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { article17, from, diff --git a/apps-rendering/src/components/LiveBlocks/index.tsx b/apps-rendering/src/components/LiveBlocks/index.tsx index fac9622d3ca..4cd9de8fc37 100644 --- a/apps-rendering/src/components/LiveBlocks/index.tsx +++ b/apps-rendering/src/components/LiveBlocks/index.tsx @@ -1,8 +1,7 @@ // ----- Imports ----- // import type { Edition } from '@guardian/apps-rendering-api-models/edition'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../articleFormat'; import type { Option } from '../../../vendor/@guardian/types/index'; import { map, diff --git a/apps-rendering/src/components/LiveDateline/index.tsx b/apps-rendering/src/components/LiveDateline/index.tsx index 16d00f46c72..5d6c2a23809 100644 --- a/apps-rendering/src/components/LiveDateline/index.tsx +++ b/apps-rendering/src/components/LiveDateline/index.tsx @@ -1,8 +1,7 @@ // ----- Imports ----- // import { css, keyframes } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../articleFormat'; import { neutral, pxToRem, textSans12 } from '@guardian/source/foundations'; import type { Option } from '../../../vendor/@guardian/types/index'; import { makeRelativeDate } from 'date'; diff --git a/apps-rendering/src/components/LiveblogHeader/index.tsx b/apps-rendering/src/components/LiveblogHeader/index.tsx index a906cf2a303..a5948f14d47 100644 --- a/apps-rendering/src/components/LiveblogHeader/index.tsx +++ b/apps-rendering/src/components/LiveblogHeader/index.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { remSpace } from '@guardian/source/foundations'; import { Column, diff --git a/apps-rendering/src/components/Logo/index.tsx b/apps-rendering/src/components/Logo/index.tsx index 052c64b0517..b089ccb81cd 100644 --- a/apps-rendering/src/components/Logo/index.tsx +++ b/apps-rendering/src/components/Logo/index.tsx @@ -1,7 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import { ArticleDesign } from '@guardian/libs'; -import type { ArticleFormat } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../articleFormat'; import { remSpace, textSans15, until } from '@guardian/source/foundations'; import Anchor from 'components/Anchor'; import { getFormat } from 'item'; diff --git a/apps-rendering/src/components/MainMedia/GalleryCaption.tsx b/apps-rendering/src/components/MainMedia/GalleryCaption.tsx index 51ecba2a347..d214e917da4 100644 --- a/apps-rendering/src/components/MainMedia/GalleryCaption.tsx +++ b/apps-rendering/src/components/MainMedia/GalleryCaption.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, remSpace, textSans14 } from '@guardian/source/foundations'; import type { Option } from '../../../vendor/@guardian/types/index'; import { OptionKind } from '../../../vendor/@guardian/types/index'; diff --git a/apps-rendering/src/components/MainMedia/ImmersiveCaption.tsx b/apps-rendering/src/components/MainMedia/ImmersiveCaption.tsx index ddac0e0fbbc..f16337097a2 100644 --- a/apps-rendering/src/components/MainMedia/ImmersiveCaption.tsx +++ b/apps-rendering/src/components/MainMedia/ImmersiveCaption.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, remSpace, textSans14 } from '@guardian/source/foundations'; import type { Option } from '../../../vendor/@guardian/types/index'; import { OptionKind } from '../../../vendor/@guardian/types/index'; diff --git a/apps-rendering/src/components/MainMedia/MainMediaImage/BlogMainMediaImage.tsx b/apps-rendering/src/components/MainMedia/MainMediaImage/BlogMainMediaImage.tsx index dd0b1501d75..d899fce9e10 100644 --- a/apps-rendering/src/components/MainMedia/MainMediaImage/BlogMainMediaImage.tsx +++ b/apps-rendering/src/components/MainMedia/MainMediaImage/BlogMainMediaImage.tsx @@ -1,5 +1,5 @@ import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../../articleFormat'; import { between, remSpace } from '@guardian/source/foundations'; import { none } from '../../../../vendor/@guardian/types/index'; import type { Image } from 'image'; diff --git a/apps-rendering/src/components/MainMedia/MainMediaImage/CommentMainMediaImage.tsx b/apps-rendering/src/components/MainMedia/MainMediaImage/CommentMainMediaImage.tsx index 9a1ca853d09..077b003ceba 100644 --- a/apps-rendering/src/components/MainMedia/MainMediaImage/CommentMainMediaImage.tsx +++ b/apps-rendering/src/components/MainMedia/MainMediaImage/CommentMainMediaImage.tsx @@ -1,5 +1,5 @@ import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../../articleFormat'; import { from, remSpace } from '@guardian/source/foundations'; import type { Image } from 'image'; import { wideContentWidth } from 'styles'; diff --git a/apps-rendering/src/components/MainMedia/MainMediaImage/GalleryMainMediaImage.tsx b/apps-rendering/src/components/MainMedia/MainMediaImage/GalleryMainMediaImage.tsx index f437fb90d5c..e327bc1215a 100644 --- a/apps-rendering/src/components/MainMedia/MainMediaImage/GalleryMainMediaImage.tsx +++ b/apps-rendering/src/components/MainMedia/MainMediaImage/GalleryMainMediaImage.tsx @@ -1,7 +1,7 @@ // ----- Imports ----- // import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../../articleFormat'; import { from } from '@guardian/source/foundations'; import { some } from '../../../../vendor/@guardian/types/index'; import Img from 'components/ImgAlt'; diff --git a/apps-rendering/src/components/MainMedia/MainMediaImage/ImmersiveMainMediaImage.tsx b/apps-rendering/src/components/MainMedia/MainMediaImage/ImmersiveMainMediaImage.tsx index c9017a45b9f..99d0d1cb4fc 100644 --- a/apps-rendering/src/components/MainMedia/MainMediaImage/ImmersiveMainMediaImage.tsx +++ b/apps-rendering/src/components/MainMedia/MainMediaImage/ImmersiveMainMediaImage.tsx @@ -1,7 +1,7 @@ // ----- Imports ----- // import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../../articleFormat'; import { from } from '@guardian/source/foundations'; import { some } from '../../../../vendor/@guardian/types/index'; import Img from 'components/ImgAlt'; diff --git a/apps-rendering/src/components/MainMedia/MainMediaImage/InterviewMainMediaImage.tsx b/apps-rendering/src/components/MainMedia/MainMediaImage/InterviewMainMediaImage.tsx index a9fda895812..fe331da4cf4 100644 --- a/apps-rendering/src/components/MainMedia/MainMediaImage/InterviewMainMediaImage.tsx +++ b/apps-rendering/src/components/MainMedia/MainMediaImage/InterviewMainMediaImage.tsx @@ -1,5 +1,5 @@ import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../../articleFormat'; import { from, remSpace } from '@guardian/source/foundations'; import type { Image } from 'image'; import { wideContentWidth } from 'styles'; diff --git a/apps-rendering/src/components/MainMedia/MainMediaImage/MainMediaImage.defaults.tsx b/apps-rendering/src/components/MainMedia/MainMediaImage/MainMediaImage.defaults.tsx index d009a1347d1..f7be242b66a 100644 --- a/apps-rendering/src/components/MainMedia/MainMediaImage/MainMediaImage.defaults.tsx +++ b/apps-rendering/src/components/MainMedia/MainMediaImage/MainMediaImage.defaults.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../../articleFormat'; import { from, remSpace } from '@guardian/source/foundations'; import type { Option } from '../../../../vendor/@guardian/types/index'; import { some } from '../../../../vendor/@guardian/types/index'; diff --git a/apps-rendering/src/components/MainMedia/MainMediaImage/NewsletterSignupMainMediaImage.tsx b/apps-rendering/src/components/MainMedia/MainMediaImage/NewsletterSignupMainMediaImage.tsx index e8a3e73c3f3..1d286112711 100644 --- a/apps-rendering/src/components/MainMedia/MainMediaImage/NewsletterSignupMainMediaImage.tsx +++ b/apps-rendering/src/components/MainMedia/MainMediaImage/NewsletterSignupMainMediaImage.tsx @@ -1,5 +1,5 @@ import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../../articleFormat'; import { from, remSpace } from '@guardian/source/foundations'; import { none, some } from '../../../../vendor/@guardian/types/index'; import Img from 'components/ImgAlt'; diff --git a/apps-rendering/src/components/MainMedia/MainMediaImage/index.tsx b/apps-rendering/src/components/MainMedia/MainMediaImage/index.tsx index e26d957db60..750cbfa1f84 100644 --- a/apps-rendering/src/components/MainMedia/MainMediaImage/index.tsx +++ b/apps-rendering/src/components/MainMedia/MainMediaImage/index.tsx @@ -1,8 +1,11 @@ // ----- Imports ----- // import type { SerializedStyles } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, +} from '../../../articleFormat'; import type { Image } from 'image'; import BlogMainMediaImage from './BlogMainMediaImage'; import CommentMainMediaImage from './CommentMainMediaImage'; diff --git a/apps-rendering/src/components/MainMedia/MainMediaVideo/index.tsx b/apps-rendering/src/components/MainMedia/MainMediaVideo/index.tsx index a9f2f964852..3f5585425b5 100644 --- a/apps-rendering/src/components/MainMedia/MainMediaVideo/index.tsx +++ b/apps-rendering/src/components/MainMedia/MainMediaVideo/index.tsx @@ -2,8 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../../articleFormat'; import { from, neutral, remSpace } from '@guardian/source/foundations'; import { darkModeCss, wideContentWidth } from 'styles'; import type { Video } from 'video'; diff --git a/apps-rendering/src/components/MainMedia/index.tsx b/apps-rendering/src/components/MainMedia/index.tsx index de304a08c3f..f8d8ab8b364 100644 --- a/apps-rendering/src/components/MainMedia/index.tsx +++ b/apps-rendering/src/components/MainMedia/index.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import type { Option } from '../../../vendor/@guardian/types/index'; import MainMediaImage from 'components/MainMedia/MainMediaImage'; import MainMediaVideo from 'components/MainMedia/MainMediaVideo'; diff --git a/apps-rendering/src/components/MainMediaCaption/Caption.tsx b/apps-rendering/src/components/MainMediaCaption/Caption.tsx index 87db18c5176..c71ca34246c 100644 --- a/apps-rendering/src/components/MainMediaCaption/Caption.tsx +++ b/apps-rendering/src/components/MainMediaCaption/Caption.tsx @@ -1,7 +1,7 @@ // ----- Imports ----- // import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { neutral, textSansBold14, diff --git a/apps-rendering/src/components/MainMediaCaption/MainMediaCaption.defaults.tsx b/apps-rendering/src/components/MainMediaCaption/MainMediaCaption.defaults.tsx index e1eebf8e7dc..c669e54341b 100644 --- a/apps-rendering/src/components/MainMediaCaption/MainMediaCaption.defaults.tsx +++ b/apps-rendering/src/components/MainMediaCaption/MainMediaCaption.defaults.tsx @@ -1,7 +1,7 @@ // ----- Imports ----- // import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { between, brandAlt, diff --git a/apps-rendering/src/components/MainMediaCaption/MainMediaCaption.stories.tsx b/apps-rendering/src/components/MainMediaCaption/MainMediaCaption.stories.tsx index a37e438c936..fdfc39b0b66 100644 --- a/apps-rendering/src/components/MainMediaCaption/MainMediaCaption.stories.tsx +++ b/apps-rendering/src/components/MainMediaCaption/MainMediaCaption.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import { some } from '../../../vendor/@guardian/types/index'; import { parseHtml } from 'fixtures/item'; import MainMediaCaption from '.'; @@ -14,7 +14,7 @@ const Default = () => ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} id="caption-id" /> diff --git a/apps-rendering/src/components/MainMediaCaption/MainMediaCaption.test.tsx b/apps-rendering/src/components/MainMediaCaption/MainMediaCaption.test.tsx index 7b642f12932..f0b3b8af2f0 100644 --- a/apps-rendering/src/components/MainMediaCaption/MainMediaCaption.test.tsx +++ b/apps-rendering/src/components/MainMediaCaption/MainMediaCaption.test.tsx @@ -1,7 +1,7 @@ // ----- Imports ----- // import { matchers } from '@emotion/jest'; -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import { some } from '../../../vendor/@guardian/types/index'; import { JSDOM } from 'jsdom'; import renderer from 'react-test-renderer'; @@ -27,7 +27,7 @@ describe('MainMediaCaption component renders as expected', () => { format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} id={captionId} />, diff --git a/apps-rendering/src/components/MainMediaCaption/index.tsx b/apps-rendering/src/components/MainMediaCaption/index.tsx index 3fa5798c671..d705a379bde 100644 --- a/apps-rendering/src/components/MainMediaCaption/index.tsx +++ b/apps-rendering/src/components/MainMediaCaption/index.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import type { Option } from '../../../vendor/@guardian/types/index'; import DefaultMainMediaCaption, { defaultStyles, diff --git a/apps-rendering/src/components/Metadata/GalleryMetadata.tsx b/apps-rendering/src/components/Metadata/GalleryMetadata.tsx index cd89ad9306c..0f15aec13c9 100644 --- a/apps-rendering/src/components/Metadata/GalleryMetadata.tsx +++ b/apps-rendering/src/components/Metadata/GalleryMetadata.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; import type { Edition } from '@guardian/apps-rendering-api-models/edition'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { remSpace } from '@guardian/source/foundations'; import type { Option } from '../../../vendor/@guardian/types/index'; import CommentCount from 'components/CommentCount'; diff --git a/apps-rendering/src/components/Metadata/ImmersiveMetadata.tsx b/apps-rendering/src/components/Metadata/ImmersiveMetadata.tsx index 38cfa017056..2693d28f5fc 100644 --- a/apps-rendering/src/components/Metadata/ImmersiveMetadata.tsx +++ b/apps-rendering/src/components/Metadata/ImmersiveMetadata.tsx @@ -2,7 +2,7 @@ import { css } from '@emotion/react'; import type { Edition } from '@guardian/apps-rendering-api-models/edition'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, remSpace } from '@guardian/source/foundations'; import type { Option } from '../../../vendor/@guardian/types/index'; import CommentCount from 'components/CommentCount'; diff --git a/apps-rendering/src/components/Metadata/LiveBlogMetadata.tsx b/apps-rendering/src/components/Metadata/LiveBlogMetadata.tsx index 400c759b7f8..e9516f9f9a1 100644 --- a/apps-rendering/src/components/Metadata/LiveBlogMetadata.tsx +++ b/apps-rendering/src/components/Metadata/LiveBlogMetadata.tsx @@ -1,7 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../articleFormat'; import { breakpoints, from, diff --git a/apps-rendering/src/components/Metadata/index.tsx b/apps-rendering/src/components/Metadata/index.tsx index 3c7d65f564b..0c66daf2c80 100644 --- a/apps-rendering/src/components/Metadata/index.tsx +++ b/apps-rendering/src/components/Metadata/index.tsx @@ -1,5 +1,5 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay } from '../../articleFormat'; import type { Item } from 'item'; import { getFormat } from 'item'; import ExtendedMetadata from './ExtendedMetadata'; diff --git a/apps-rendering/src/components/NewsletterSignup/NewsletterSignup.stories.tsx b/apps-rendering/src/components/NewsletterSignup/NewsletterSignup.stories.tsx index 434e4d1ad23..ca99303e0a5 100644 --- a/apps-rendering/src/components/NewsletterSignup/NewsletterSignup.stories.tsx +++ b/apps-rendering/src/components/NewsletterSignup/NewsletterSignup.stories.tsx @@ -1,5 +1,5 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import { ElementKind } from 'bodyElementKind'; import NewsletterSignup from '.'; @@ -14,14 +14,14 @@ const Default = () => ( 'Reviewing the most important stories on feminism and sexism and those fighting for equality', name: 'The Week in Patriarchy', frequency: 'Weekly', - theme: ArticlePillar.Opinion, + theme: Pillar.Opinion, successDescription: "We'll send you The Week in Patriarchy every week", }} format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} showByDefault={true} /> @@ -36,13 +36,13 @@ const NewsTheme = () => ( 'Archie Bland and Nimo Omer take you through the top stories and what they mean, free every weekday morning', name: 'First Edition', frequency: 'Every weekday', - theme: ArticlePillar.News, + theme: Pillar.News, successDescription: "We'll send you First Edition every weekday", }} format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} showByDefault={true} /> diff --git a/apps-rendering/src/components/NewsletterSignup/PrivacyWording.tsx b/apps-rendering/src/components/NewsletterSignup/PrivacyWording.tsx index 3c006f0fc64..e67e49d3265 100644 --- a/apps-rendering/src/components/NewsletterSignup/PrivacyWording.tsx +++ b/apps-rendering/src/components/NewsletterSignup/PrivacyWording.tsx @@ -2,7 +2,7 @@ import { css } from '@emotion/react'; import type { SerializedStyles } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { textSans12, textSansBold12 } from '@guardian/source/foundations'; import { Link } from '@guardian/source/react-components'; import { text } from 'palette'; diff --git a/apps-rendering/src/components/NewsletterSignup/index.tsx b/apps-rendering/src/components/NewsletterSignup/index.tsx index 673d756f6c5..e712565129e 100644 --- a/apps-rendering/src/components/NewsletterSignup/index.tsx +++ b/apps-rendering/src/components/NewsletterSignup/index.tsx @@ -2,8 +2,11 @@ import { css } from '@emotion/react'; import type { SerializedStyles } from '@emotion/react'; -import { ArticlePillar } from '@guardian/libs'; -import type { ArticleFormat, ArticleTheme } from '@guardian/libs'; +import { + type ArticleFormat, + type ArticleTheme, + Pillar, +} from '../../articleFormat'; import { brandAlt, from, @@ -69,7 +72,7 @@ const titleStyles = (theme: ArticleTheme): SerializedStyles => css` ${headlineBold20}; flex-grow: 1; span { - color: ${theme === ArticlePillar.News ? sport[500] : 'inherit'}; + color: ${theme === Pillar.News ? sport[500] : 'inherit'}; } `; diff --git a/apps-rendering/src/components/Pagination/Pagination.stories.tsx b/apps-rendering/src/components/Pagination/Pagination.stories.tsx index 65653282f83..fc444ff871c 100644 --- a/apps-rendering/src/components/Pagination/Pagination.stories.tsx +++ b/apps-rendering/src/components/Pagination/Pagination.stories.tsx @@ -1,7 +1,10 @@ -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + formatToString, +} from '../../articleFormat'; import { breakpoints } from '@guardian/source/foundations'; import type { StoryFn } from '@storybook/react'; -import { formatToString } from 'articleFormat'; import { getAllThemes } from 'fixtures/article'; import { Pagination } from '.'; diff --git a/apps-rendering/src/components/Pagination/index.tsx b/apps-rendering/src/components/Pagination/index.tsx index b86d8e9d376..b08c6e336e6 100644 --- a/apps-rendering/src/components/Pagination/index.tsx +++ b/apps-rendering/src/components/Pagination/index.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { neutral, space, diff --git a/apps-rendering/src/components/Paragraph/Paragraph.stories.tsx b/apps-rendering/src/components/Paragraph/Paragraph.stories.tsx index 5e7ca1501ec..14273eed184 100644 --- a/apps-rendering/src/components/Paragraph/Paragraph.stories.tsx +++ b/apps-rendering/src/components/Paragraph/Paragraph.stories.tsx @@ -3,9 +3,9 @@ import { ArticleDesign, ArticleDisplay, - ArticlePillar, ArticleSpecial, -} from '@guardian/libs'; + Pillar, +} from '../../articleFormat'; import Paragraph from './'; // ----- Stories ----- // @@ -13,7 +13,7 @@ import Paragraph from './'; const standard = { design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }; const labs = { diff --git a/apps-rendering/src/components/Paragraph/index.tsx b/apps-rendering/src/components/Paragraph/index.tsx index 9cfce67c886..41aa7a6ae92 100644 --- a/apps-rendering/src/components/Paragraph/index.tsx +++ b/apps-rendering/src/components/Paragraph/index.tsx @@ -2,8 +2,11 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import { ArticleDesign, ArticleSpecial } from '@guardian/libs'; -import type { ArticleFormat } from '@guardian/libs'; +import { + ArticleDesign, + type ArticleFormat, + ArticleSpecial, +} from '../../articleFormat'; import { article17, headlineBold42, diff --git a/apps-rendering/src/components/PinnedPost/PinnedPost.stories.tsx b/apps-rendering/src/components/PinnedPost/PinnedPost.stories.tsx index 69413b13c87..f2a638768d1 100644 --- a/apps-rendering/src/components/PinnedPost/PinnedPost.stories.tsx +++ b/apps-rendering/src/components/PinnedPost/PinnedPost.stories.tsx @@ -1,8 +1,12 @@ // ----- Imports ----- // import { css } from '@emotion/react'; import { Edition } from '@guardian/apps-rendering-api-models/edition'; -import type { ArticleFormat, Pillar } from '@guardian/libs'; -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, + Pillar, +} from '../../articleFormat'; import { from } from '@guardian/source/foundations'; import { pinnedBlock } from 'fixtures/item'; import PinnedPost from './'; @@ -33,7 +37,7 @@ const Wrapper = ({ children }: { children: React.ReactNode }) => ( // ----- Stories ----- // -const Default = ({ pillar = ArticlePillar.News }: { pillar: Pillar }) => ( +const Default = ({ pillar = Pillar.News }: { pillar: Pillar }) => ( ( ); -const Sport = () => ; -const Culture = () => ; -const Opinion = () => ; -const Lifestyle = () => ; +const Sport = () => ; +const Culture = () => ; +const Opinion = () => ; +const Lifestyle = () => ; // ----- Exports ----- // diff --git a/apps-rendering/src/components/PinnedPost/index.tsx b/apps-rendering/src/components/PinnedPost/index.tsx index 4fe0f49e17d..985c3d582cc 100644 --- a/apps-rendering/src/components/PinnedPost/index.tsx +++ b/apps-rendering/src/components/PinnedPost/index.tsx @@ -1,7 +1,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; import type { Edition } from '@guardian/apps-rendering-api-models/edition'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { timeAgo } from '@guardian/libs'; import { focusHalo, diff --git a/apps-rendering/src/components/Pullquote/Pullquote.stories.tsx b/apps-rendering/src/components/Pullquote/Pullquote.stories.tsx index e75932f15c2..7c7625dc72e 100644 --- a/apps-rendering/src/components/Pullquote/Pullquote.stories.tsx +++ b/apps-rendering/src/components/Pullquote/Pullquote.stories.tsx @@ -1,11 +1,11 @@ -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import { some } from '../../../vendor/@guardian/types/index'; import Pullquote from './'; const standard = { design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }; const Default = () => ( diff --git a/apps-rendering/src/components/Pullquote/index.tsx b/apps-rendering/src/components/Pullquote/index.tsx index 9e49908901e..8b6900ef02a 100644 --- a/apps-rendering/src/components/Pullquote/index.tsx +++ b/apps-rendering/src/components/Pullquote/index.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { headlineLight24, remSpace } from '@guardian/source/foundations'; import { SvgQuote } from '@guardian/source/react-components'; import type { Option } from '../../../vendor/@guardian/types/index'; diff --git a/apps-rendering/src/components/RelatedContent/GalleryRelatedContent.tsx b/apps-rendering/src/components/RelatedContent/GalleryRelatedContent.tsx index 3df51906a95..569b2382cdd 100644 --- a/apps-rendering/src/components/RelatedContent/GalleryRelatedContent.tsx +++ b/apps-rendering/src/components/RelatedContent/GalleryRelatedContent.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, neutral, remSpace, until } from '@guardian/source/foundations'; import type { Option } from '../../../vendor/@guardian/types/index'; import { none } from '../../../vendor/@guardian/types/index'; diff --git a/apps-rendering/src/components/RelatedContent/ImmersiveRelatedContent.tsx b/apps-rendering/src/components/RelatedContent/ImmersiveRelatedContent.tsx index 3cd7de137af..e6d6e3d21ac 100644 --- a/apps-rendering/src/components/RelatedContent/ImmersiveRelatedContent.tsx +++ b/apps-rendering/src/components/RelatedContent/ImmersiveRelatedContent.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, neutral, until } from '@guardian/source/foundations'; import type { Option } from '../../../vendor/@guardian/types/index'; import { grid } from 'grid/grid'; diff --git a/apps-rendering/src/components/RelatedContent/index.tsx b/apps-rendering/src/components/RelatedContent/index.tsx index 68929cb9d5d..d2c2c57727d 100644 --- a/apps-rendering/src/components/RelatedContent/index.tsx +++ b/apps-rendering/src/components/RelatedContent/index.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay } from '../../articleFormat'; import type { Item } from 'item'; import { getFormat } from 'item'; import GalleryRelatedContent from './GalleryRelatedContent'; diff --git a/apps-rendering/src/components/RichLink/RichLink.stories.tsx b/apps-rendering/src/components/RichLink/RichLink.stories.tsx index 43f92483938..20a0ae27f18 100644 --- a/apps-rendering/src/components/RichLink/RichLink.stories.tsx +++ b/apps-rendering/src/components/RichLink/RichLink.stories.tsx @@ -1,5 +1,5 @@ import { css } from '@emotion/react'; -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import { from, remSpace } from '@guardian/source/foundations'; import RichLink, { richLinkWidth } from './'; @@ -19,7 +19,7 @@ const Default = () => ( format={{ design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} linkText={linkText} url={url} @@ -45,7 +45,7 @@ const Analysis = () => ( format={{ design: ArticleDesign.Analysis, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} linkText={linkText} url={url} diff --git a/apps-rendering/src/components/RichLink/index.tsx b/apps-rendering/src/components/RichLink/index.tsx index 7754ba10b6c..9898ec98928 100644 --- a/apps-rendering/src/components/RichLink/index.tsx +++ b/apps-rendering/src/components/RichLink/index.tsx @@ -1,7 +1,12 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; -import type { ArticleFormat, ArticleTheme } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, + type ArticleTheme, + Pillar, +} from '../../articleFormat'; import { from, headlineBold17, @@ -72,23 +77,23 @@ const richLinkStyles = (format: ArticleFormat): SerializedStyles => { transition: all 0.2s ease; &.js-news { - ${richLinkPillarStyles(formatFromTheme(ArticlePillar.News))} + ${richLinkPillarStyles(formatFromTheme(Pillar.News))} } &.js-opinion { - ${richLinkPillarStyles(formatFromTheme(ArticlePillar.Opinion))} + ${richLinkPillarStyles(formatFromTheme(Pillar.Opinion))} } &.js-sport { - ${richLinkPillarStyles(formatFromTheme(ArticlePillar.Sport))} + ${richLinkPillarStyles(formatFromTheme(Pillar.Sport))} } &.js-culture { - ${richLinkPillarStyles(formatFromTheme(ArticlePillar.Culture))} + ${richLinkPillarStyles(formatFromTheme(Pillar.Culture))} } &.js-lifestyle { - ${richLinkPillarStyles(formatFromTheme(ArticlePillar.Lifestyle))} + ${richLinkPillarStyles(formatFromTheme(Pillar.Lifestyle))} } img { diff --git a/apps-rendering/src/components/Series/GallerySeries.tsx b/apps-rendering/src/components/Series/GallerySeries.tsx index 6b769d94ff0..db996339faa 100644 --- a/apps-rendering/src/components/Series/GallerySeries.tsx +++ b/apps-rendering/src/components/Series/GallerySeries.tsx @@ -3,7 +3,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; import type { Tag } from '@guardian/content-api-models/v1/tag'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, headlineBold17, diff --git a/apps-rendering/src/components/Series/ImmersiveSeries.tsx b/apps-rendering/src/components/Series/ImmersiveSeries.tsx index c0c54fbda20..69a72bde072 100644 --- a/apps-rendering/src/components/Series/ImmersiveSeries.tsx +++ b/apps-rendering/src/components/Series/ImmersiveSeries.tsx @@ -3,7 +3,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; import type { Tag } from '@guardian/content-api-models/v1/tag'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, headlineBold17, diff --git a/apps-rendering/src/components/Series/index.tsx b/apps-rendering/src/components/Series/index.tsx index e4588cac11e..2cf08b3d42f 100644 --- a/apps-rendering/src/components/Series/index.tsx +++ b/apps-rendering/src/components/Series/index.tsx @@ -2,8 +2,12 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticleDisplay, ArticleSpecial } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, + ArticleSpecial, +} from '../../articleFormat'; import { from, headlineBold17, diff --git a/apps-rendering/src/components/SpecialReportAltAtom/SpecialReportAltAtom.stories.tsx b/apps-rendering/src/components/SpecialReportAltAtom/SpecialReportAltAtom.stories.tsx index 3207a045930..aae7e496420 100644 --- a/apps-rendering/src/components/SpecialReportAltAtom/SpecialReportAltAtom.stories.tsx +++ b/apps-rendering/src/components/SpecialReportAltAtom/SpecialReportAltAtom.stories.tsx @@ -1,6 +1,10 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticleSpecial } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + ArticleSpecial, +} from '../../articleFormat'; import SpecialReportAltAtom from '.'; // ----- Stories ----- // diff --git a/apps-rendering/src/components/SpecialReportAltAtom/index.tsx b/apps-rendering/src/components/SpecialReportAltAtom/index.tsx index fe822734c6b..6df143d890f 100644 --- a/apps-rendering/src/components/SpecialReportAltAtom/index.tsx +++ b/apps-rendering/src/components/SpecialReportAltAtom/index.tsx @@ -5,7 +5,7 @@ import { css } from '@emotion/react'; import { article17, articleBold17 } from '@guardian/source/foundations'; import { LinkButton } from '@guardian/source/react-components'; import { background, border, hover, text } from 'palette'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { darkModeCss } from 'styles'; // ----- Component ----- // diff --git a/apps-rendering/src/components/Standfirst/DeadBlogStandfirst.tsx b/apps-rendering/src/components/Standfirst/DeadBlogStandfirst.tsx index b289846a359..62837249a69 100644 --- a/apps-rendering/src/components/Standfirst/DeadBlogStandfirst.tsx +++ b/apps-rendering/src/components/Standfirst/DeadBlogStandfirst.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { headlineBold17, neutral, diff --git a/apps-rendering/src/components/Standfirst/GalleryStandfirst.tsx b/apps-rendering/src/components/Standfirst/GalleryStandfirst.tsx index 2a79a7a0260..42e1798caad 100644 --- a/apps-rendering/src/components/Standfirst/GalleryStandfirst.tsx +++ b/apps-rendering/src/components/Standfirst/GalleryStandfirst.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, headlineBold17, remSpace } from '@guardian/source/foundations'; import { grid } from 'grid/grid'; import { maybeRender } from 'lib'; diff --git a/apps-rendering/src/components/Standfirst/ImmersiveStandfirst.tsx b/apps-rendering/src/components/Standfirst/ImmersiveStandfirst.tsx index 20426a6fb0a..8ed6900956a 100644 --- a/apps-rendering/src/components/Standfirst/ImmersiveStandfirst.tsx +++ b/apps-rendering/src/components/Standfirst/ImmersiveStandfirst.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from, headlineLight24, remSpace } from '@guardian/source/foundations'; import type { Option } from '../../../vendor/@guardian/types/index'; import { OptionKind } from '../../../vendor/@guardian/types/index'; diff --git a/apps-rendering/src/components/Standfirst/MediaStandfirst.tsx b/apps-rendering/src/components/Standfirst/MediaStandfirst.tsx index 9ca61beda9d..34cf2b7b791 100644 --- a/apps-rendering/src/components/Standfirst/MediaStandfirst.tsx +++ b/apps-rendering/src/components/Standfirst/MediaStandfirst.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { headlineBold17 } from '@guardian/source/foundations'; import type { Item } from 'item'; import { getFormat } from 'item'; diff --git a/apps-rendering/src/components/Standfirst/Standfirst.defaults.tsx b/apps-rendering/src/components/Standfirst/Standfirst.defaults.tsx index d3b2dc7b87f..fb37329cbe1 100644 --- a/apps-rendering/src/components/Standfirst/Standfirst.defaults.tsx +++ b/apps-rendering/src/components/Standfirst/Standfirst.defaults.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { headlineBold17, remSpace } from '@guardian/source/foundations'; import type { Item } from 'item'; import { getFormat } from 'item'; diff --git a/apps-rendering/src/components/Standfirst/Standfirst.stories.tsx b/apps-rendering/src/components/Standfirst/Standfirst.stories.tsx index 2c939fc5a33..fd36fbd585d 100644 --- a/apps-rendering/src/components/Standfirst/Standfirst.stories.tsx +++ b/apps-rendering/src/components/Standfirst/Standfirst.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../articleFormat'; import { getAllThemes, getThemeNameAsString } from 'fixtures/article'; import { analysis, @@ -22,7 +22,7 @@ const Default = (): ReactElement => ( item={{ ...article, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -32,7 +32,7 @@ const Review = (): ReactElement => ( item={{ ...review, display: ArticleDisplay.Standard, - theme: ArticlePillar.Culture, + theme: Pillar.Culture, }} /> ); @@ -42,7 +42,7 @@ const Feature = (): ReactElement => ( item={{ ...feature, display: ArticleDisplay.Standard, - theme: ArticlePillar.Sport, + theme: Pillar.Sport, }} /> ); @@ -52,7 +52,7 @@ const Comment = (): ReactElement => ( item={{ ...comment, display: ArticleDisplay.Standard, - theme: ArticlePillar.Opinion, + theme: Pillar.Opinion, }} /> ); @@ -62,7 +62,7 @@ const Link = (): ReactElement => ( item={{ ...articleWithStandfirstLink, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -94,7 +94,7 @@ const Analysis = (): ReactElement => ( item={{ ...analysis, display: ArticleDisplay.Standard, - theme: ArticlePillar.Culture, + theme: Pillar.Culture, }} /> ); diff --git a/apps-rendering/src/components/Standfirst/index.tsx b/apps-rendering/src/components/Standfirst/index.tsx index bf19e40e50a..1db91270f8e 100644 --- a/apps-rendering/src/components/Standfirst/index.tsx +++ b/apps-rendering/src/components/Standfirst/index.tsx @@ -1,6 +1,10 @@ // ----- Imports ----- // import { css } from '@emotion/react'; -import { ArticleDesign, ArticleDisplay, ArticleSpecial } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + ArticleSpecial, +} from '../../articleFormat'; import type { Item } from 'item'; import { getFormat } from 'item'; import AnalysisStandfirst from './AnalysisStandfirst'; diff --git a/apps-rendering/src/components/StarRating/index.tsx b/apps-rendering/src/components/StarRating/index.tsx index cabfd86987b..c3816a4ae73 100644 --- a/apps-rendering/src/components/StarRating/index.tsx +++ b/apps-rendering/src/components/StarRating/index.tsx @@ -1,7 +1,7 @@ // ----- Imports ----- // import { css } from '@emotion/react'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign } from '../../articleFormat'; import { brandAltBackground, brandAltLine, diff --git a/apps-rendering/src/components/TableOfContents/TableOfContents.stories.tsx b/apps-rendering/src/components/TableOfContents/TableOfContents.stories.tsx index c1c4eacb81e..851b532de9d 100644 --- a/apps-rendering/src/components/TableOfContents/TableOfContents.stories.tsx +++ b/apps-rendering/src/components/TableOfContents/TableOfContents.stories.tsx @@ -1,10 +1,10 @@ -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { ArticleDesign, ArticleDisplay, - ArticlePillar, ArticleSpecial, -} from '@guardian/libs'; + Pillar, +} from '../../articleFormat'; import { explainer } from 'fixtures/item'; import type { ReactElement } from 'react'; import TableOfContents from '.'; @@ -12,13 +12,13 @@ import TableOfContents from '.'; const format: ArticleFormat = { design: ArticleDesign.Standard, display: ArticleDisplay.Standard, - theme: ArticlePillar.News, + theme: Pillar.News, }; const immersiveDisplayFormat: ArticleFormat = { design: ArticleDesign.Standard, display: ArticleDisplay.Immersive, - theme: ArticlePillar.News, + theme: Pillar.News, }; const labsThemeFormat: ArticleFormat = { @@ -30,7 +30,7 @@ const labsThemeFormat: ArticleFormat = { const numberedListDisplayFormat: ArticleFormat = { design: ArticleDesign.Standard, display: ArticleDisplay.NumberedList, - theme: ArticlePillar.News, + theme: Pillar.News, }; const numberedListDisplayLabsThemeFormat: ArticleFormat = { diff --git a/apps-rendering/src/components/TableOfContents/index.tsx b/apps-rendering/src/components/TableOfContents/index.tsx index 347537bb659..24ab1a4258e 100644 --- a/apps-rendering/src/components/TableOfContents/index.tsx +++ b/apps-rendering/src/components/TableOfContents/index.tsx @@ -1,7 +1,10 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDisplay, ArticleSpecial } from '@guardian/libs'; +import { + ArticleDisplay, + type ArticleFormat, + ArticleSpecial, +} from '../../articleFormat'; import { headlineBold17, headlineLight17, diff --git a/apps-rendering/src/components/Tags/GalleryTags.tsx b/apps-rendering/src/components/Tags/GalleryTags.tsx index 0213e9e92b8..2b329c5bc40 100644 --- a/apps-rendering/src/components/Tags/GalleryTags.tsx +++ b/apps-rendering/src/components/Tags/GalleryTags.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { from } from '@guardian/source/foundations'; import { grid } from 'grid/grid'; import type { Item } from 'item'; diff --git a/apps-rendering/src/components/Tags/Tags.defaults.tsx b/apps-rendering/src/components/Tags/Tags.defaults.tsx index 54e5ec0ffca..1c6b6d66075 100644 --- a/apps-rendering/src/components/Tags/Tags.defaults.tsx +++ b/apps-rendering/src/components/Tags/Tags.defaults.tsx @@ -3,7 +3,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; import { TagType } from '@guardian/content-api-models/v1/tagType'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { neutral, remSpace, textSans17 } from '@guardian/source/foundations'; import type { Item } from 'item'; import { getFormat } from 'item'; diff --git a/apps-rendering/src/components/Tags/Tags.stories.tsx b/apps-rendering/src/components/Tags/Tags.stories.tsx index d42b26f0e68..0f89a0f64eb 100644 --- a/apps-rendering/src/components/Tags/Tags.stories.tsx +++ b/apps-rendering/src/components/Tags/Tags.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { article } from 'fixtures/item'; import Tags from './'; diff --git a/apps-rendering/src/components/Tags/index.tsx b/apps-rendering/src/components/Tags/index.tsx index 95a57c4cdcd..140c82ec1ca 100644 --- a/apps-rendering/src/components/Tags/index.tsx +++ b/apps-rendering/src/components/Tags/index.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay } from '../../articleFormat'; import type { Item } from 'item'; import { getFormat } from 'item'; import GalleryTags from './GalleryTags'; diff --git a/apps-rendering/src/components/WithAgeWarning/index.tsx b/apps-rendering/src/components/WithAgeWarning/index.tsx index c6d581fd5e3..624249e01d4 100644 --- a/apps-rendering/src/components/WithAgeWarning/index.tsx +++ b/apps-rendering/src/components/WithAgeWarning/index.tsx @@ -1,8 +1,11 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; import type { Tag } from '@guardian/content-api-models/v1/tag'; -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; -import type { ArticleFormat } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, +} from '../../articleFormat'; import { from, remSpace } from '@guardian/source/foundations'; import { AgeWarning } from '@guardian/source-development-kitchen/react-components'; import type { Option } from '../../../vendor/@guardian/types/index'; diff --git a/apps-rendering/src/components/caption/caption.tsx b/apps-rendering/src/components/caption/caption.tsx index aae25da8b15..02c814a02d7 100644 --- a/apps-rendering/src/components/caption/caption.tsx +++ b/apps-rendering/src/components/caption/caption.tsx @@ -2,8 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from '../../articleFormat'; import { headlineMedium17, neutral, diff --git a/apps-rendering/src/components/editions/byline/byline.stories.tsx b/apps-rendering/src/components/editions/byline/byline.stories.tsx index f7c3cd0ad7a..cec5b435fe4 100644 --- a/apps-rendering/src/components/editions/byline/byline.stories.tsx +++ b/apps-rendering/src/components/editions/byline/byline.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDisplay, Pillar } from '../../../articleFormat'; import { none, some } from '../../../../vendor/@guardian/types/index'; import { parse } from 'client/parser'; import type { Contributor } from 'contributor'; @@ -64,7 +64,7 @@ const Default = (): ReactElement => ( ...article, display: ArticleDisplay.Standard, bylineHtml: mockBylineHtml, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -74,7 +74,7 @@ const Analysis = (): ReactElement => ( item={{ ...analysis, bylineHtml: mockBylineHtml, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -84,7 +84,7 @@ const Feature = (): ReactElement => ( item={{ ...feature, bylineHtml: mockBylineHtml, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -94,7 +94,7 @@ const Review = (): ReactElement => ( item={{ ...review, bylineHtml: mockBylineHtml, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -105,7 +105,7 @@ const Showcase = (): ReactElement => ( ...article, display: ArticleDisplay.Showcase, bylineHtml: mockBylineHtml, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -115,7 +115,7 @@ const Interview = (): ReactElement => ( item={{ ...interview, bylineHtml: mockBylineHtml, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -130,7 +130,7 @@ const Comment = (): ReactElement => ( item={{ ...comment, bylineHtml: mockBylineHtml, - theme: ArticlePillar.News, + theme: Pillar.News, contributors: contributors, }} /> diff --git a/apps-rendering/src/components/editions/byline/index.tsx b/apps-rendering/src/components/editions/byline/index.tsx index 345cf28d51d..acea82e815e 100644 --- a/apps-rendering/src/components/editions/byline/index.tsx +++ b/apps-rendering/src/components/editions/byline/index.tsx @@ -1,8 +1,11 @@ // ----- Imports ----- // import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, +} from '../../../articleFormat'; import { border, from, diff --git a/apps-rendering/src/components/editions/cartoon/cartoon.stories.tsx b/apps-rendering/src/components/editions/cartoon/cartoon.stories.tsx index a75b01f8d9a..25e4544bb10 100644 --- a/apps-rendering/src/components/editions/cartoon/cartoon.stories.tsx +++ b/apps-rendering/src/components/editions/cartoon/cartoon.stories.tsx @@ -2,7 +2,7 @@ import type { ReactElement } from 'react'; import Cartoon from './index'; -import { ArticleDesign, ArticleDisplay, Pillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../../../articleFormat'; import { cartoonData } from '../../../fixtures/cartoon'; // ----- Setup ------ // diff --git a/apps-rendering/src/components/editions/cartoon/index.tsx b/apps-rendering/src/components/editions/cartoon/index.tsx index c37884df18b..0176078e728 100644 --- a/apps-rendering/src/components/editions/cartoon/index.tsx +++ b/apps-rendering/src/components/editions/cartoon/index.tsx @@ -1,5 +1,5 @@ import { Cartoon } from '../../../cartoon'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../../articleFormat'; import { css } from '@emotion/react'; import { from } from '@guardian/source/foundations'; import { diff --git a/apps-rendering/src/components/editions/galleryImage/galleryImage.stories.tsx b/apps-rendering/src/components/editions/galleryImage/galleryImage.stories.tsx index 238b2b83951..534fc446e37 100644 --- a/apps-rendering/src/components/editions/galleryImage/galleryImage.stories.tsx +++ b/apps-rendering/src/components/editions/galleryImage/galleryImage.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticlePillar } from '@guardian/libs'; +import { Pillar } from '../../../articleFormat'; import imageFixture from 'fixtures/galleryImage'; import { article } from 'fixtures/item'; import type { ReactElement } from 'react'; @@ -14,7 +14,7 @@ const Default = (): ReactElement => ( diff --git a/apps-rendering/src/components/editions/galleryImage/index.tsx b/apps-rendering/src/components/editions/galleryImage/index.tsx index 4bcb234726b..016dcb9109a 100644 --- a/apps-rendering/src/components/editions/galleryImage/index.tsx +++ b/apps-rendering/src/components/editions/galleryImage/index.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../../articleFormat'; import { from, neutral, diff --git a/apps-rendering/src/components/editions/header/index.tsx b/apps-rendering/src/components/editions/header/index.tsx index 1fc413d238a..c3e54cd3d38 100644 --- a/apps-rendering/src/components/editions/header/index.tsx +++ b/apps-rendering/src/components/editions/header/index.tsx @@ -2,7 +2,7 @@ import { css } from '@emotion/react'; import type { SerializedStyles } from '@emotion/react'; -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay } from '../../../articleFormat'; import { border, from, neutral, remSpace } from '@guardian/source/foundations'; import Byline from 'components/editions/byline'; import HeaderMedia from 'components/editions/headerMedia'; diff --git a/apps-rendering/src/components/editions/headerMedia/headerMedia.stories.tsx b/apps-rendering/src/components/editions/headerMedia/headerMedia.stories.tsx index 8e7eba464a4..82628fdb971 100644 --- a/apps-rendering/src/components/editions/headerMedia/headerMedia.stories.tsx +++ b/apps-rendering/src/components/editions/headerMedia/headerMedia.stories.tsx @@ -1,6 +1,6 @@ // ----- Imports ----- // -import { ArticleDisplay, ArticlePillar, Pillar } from '@guardian/libs'; +import { ArticleDisplay, Pillar } from '../../../articleFormat'; import { article, cartoon, review } from 'fixtures/item'; import type { ReactElement } from 'react'; import HeaderMedia from './index'; @@ -29,7 +29,7 @@ const Image = (): ReactElement => ( ); @@ -39,7 +39,7 @@ const FullScreen = (): ReactElement => ( item={{ ...article, display: ArticleDisplay.Immersive, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -48,7 +48,7 @@ const WithStarRating = (): ReactElement => ( ); @@ -58,7 +58,7 @@ const Video = (): ReactElement => ( item={{ ...article, mainMedia: video, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); diff --git a/apps-rendering/src/components/editions/headerMedia/index.tsx b/apps-rendering/src/components/editions/headerMedia/index.tsx index a8d8ad8bfb0..37bfe69a49e 100644 --- a/apps-rendering/src/components/editions/headerMedia/index.tsx +++ b/apps-rendering/src/components/editions/headerMedia/index.tsx @@ -2,8 +2,11 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, +} from '../../../articleFormat'; import { brandAltBackground, from } from '@guardian/source/foundations'; import { none, some } from '../../../../vendor/@guardian/types/index'; import HeaderImageCaption, { diff --git a/apps-rendering/src/components/editions/headline/headline.stories.tsx b/apps-rendering/src/components/editions/headline/headline.stories.tsx index 51f2728a29a..fc4a0881daa 100644 --- a/apps-rendering/src/components/editions/headline/headline.stories.tsx +++ b/apps-rendering/src/components/editions/headline/headline.stories.tsx @@ -1,10 +1,7 @@ // ----- Imports ----- // -import { - ArticleDisplay, - ArticleElementRole, - ArticlePillar, -} from '@guardian/libs'; +import { ArticleDisplay, Pillar } from '../../../articleFormat'; +import { ArticleElementRole } from '@guardian/libs'; import { none, some } from '../../../../vendor/@guardian/types/index'; import type { Contributor } from 'contributor'; import { @@ -55,7 +52,7 @@ const Default = (): ReactElement => ( ); @@ -64,7 +61,7 @@ const Analysis = (): ReactElement => ( ); @@ -73,7 +70,7 @@ const Feature = (): ReactElement => ( ); @@ -82,7 +79,7 @@ const Review = (): ReactElement => ( ); @@ -92,7 +89,7 @@ const Showcase = (): ReactElement => ( item={{ ...review, display: ArticleDisplay.Showcase, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -101,7 +98,7 @@ const Interview = (): ReactElement => ( ); @@ -111,7 +108,7 @@ const Comment = (): ReactElement => ( item={{ ...comment, contributors, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -120,7 +117,7 @@ const Media = (): ReactElement => ( ); diff --git a/apps-rendering/src/components/editions/headline/index.tsx b/apps-rendering/src/components/editions/headline/index.tsx index 81e258294b8..f6a3cc5f4ce 100644 --- a/apps-rendering/src/components/editions/headline/index.tsx +++ b/apps-rendering/src/components/editions/headline/index.tsx @@ -2,8 +2,11 @@ import { css } from '@emotion/react'; import type { SerializedStyles } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, +} from '../../../articleFormat'; import { border, from, diff --git a/apps-rendering/src/components/editions/layout/index.tsx b/apps-rendering/src/components/editions/layout/index.tsx index 995c6be211a..89f35706cf4 100644 --- a/apps-rendering/src/components/editions/layout/index.tsx +++ b/apps-rendering/src/components/editions/layout/index.tsx @@ -2,8 +2,11 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, +} from '../../../articleFormat'; import { background, border, diff --git a/apps-rendering/src/components/editions/layout/layout.stories.tsx b/apps-rendering/src/components/editions/layout/layout.stories.tsx index 7449bef5c0c..82c34493dd1 100644 --- a/apps-rendering/src/components/editions/layout/layout.stories.tsx +++ b/apps-rendering/src/components/editions/layout/layout.stories.tsx @@ -1,6 +1,7 @@ // ----- Imports ----- // import type { Tag } from '@guardian/content-api-models/v1/tag'; -import { ArticleDisplay, ArticleElementRole, Pillar } from '@guardian/libs'; +import { ArticleElementRole } from '@guardian/libs'; +import { ArticleDisplay, Pillar } from '../../../articleFormat'; import { breakpoints } from '@guardian/source/foundations'; import { none, some } from '../../../../vendor/@guardian/types/index'; import type { Contributor } from 'contributor'; diff --git a/apps-rendering/src/components/editions/pullquote/index.tsx b/apps-rendering/src/components/editions/pullquote/index.tsx index 3530343d347..6e091b06ca0 100644 --- a/apps-rendering/src/components/editions/pullquote/index.tsx +++ b/apps-rendering/src/components/editions/pullquote/index.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../../articleFormat'; import { from, headlineBold20, diff --git a/apps-rendering/src/components/editions/pullquote/pullquote.stories.tsx b/apps-rendering/src/components/editions/pullquote/pullquote.stories.tsx index 5b892b5bc6c..85282ca69a6 100644 --- a/apps-rendering/src/components/editions/pullquote/pullquote.stories.tsx +++ b/apps-rendering/src/components/editions/pullquote/pullquote.stories.tsx @@ -1,7 +1,11 @@ // ----- Imports ----- // -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; -import type { ArticleFormat } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, + Pillar, +} from '../../../articleFormat'; import type { Option } from '../../../../vendor/@guardian/types/index'; import type { ReactElement } from 'react'; import Pullquote from './index'; @@ -20,7 +24,7 @@ const getInputProps = (): Props => ({ format: { display: ArticleDisplay.Standard, design: ArticleDesign.Analysis, - theme: ArticlePillar.News, + theme: Pillar.News, }, }); diff --git a/apps-rendering/src/components/editions/series/index.tsx b/apps-rendering/src/components/editions/series/index.tsx index 38159ace383..794d7accbd3 100644 --- a/apps-rendering/src/components/editions/series/index.tsx +++ b/apps-rendering/src/components/editions/series/index.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay } from '../../../articleFormat'; import { from, headlineBold17, diff --git a/apps-rendering/src/components/editions/series/series.stories.tsx b/apps-rendering/src/components/editions/series/series.stories.tsx index c83d6c51cf1..faa3e0ee688 100644 --- a/apps-rendering/src/components/editions/series/series.stories.tsx +++ b/apps-rendering/src/components/editions/series/series.stories.tsx @@ -1,7 +1,7 @@ // ----- Imports ----- // import type { Tag } from '@guardian/content-api-models/v1/tag'; -import { ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDisplay, Pillar } from '../../../articleFormat'; import Series from 'components/Series'; import { article, interview } from 'fixtures/item'; import type { ReactElement } from 'react'; @@ -28,7 +28,7 @@ const Default = (): ReactElement => ( item={{ ...article, tags: getTags('lifeandstyle/running', 'Running'), - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -38,7 +38,7 @@ const Interview = (): ReactElement => ( item={{ ...interview, tags: getTags('tone/interview', 'Interview'), - theme: ArticlePillar.Culture, + theme: Pillar.Culture, }} /> ); @@ -49,7 +49,7 @@ const Immersive = (): ReactElement => ( ...article, tags: getTags('news/series/the-long-read', 'The long read'), display: ArticleDisplay.Immersive, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); diff --git a/apps-rendering/src/components/editions/shareIcon/shareIcon.stories.tsx b/apps-rendering/src/components/editions/shareIcon/shareIcon.stories.tsx index 4c7d9cb99c5..cdf35133628 100644 --- a/apps-rendering/src/components/editions/shareIcon/shareIcon.stories.tsx +++ b/apps-rendering/src/components/editions/shareIcon/shareIcon.stories.tsx @@ -2,7 +2,7 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import { ArticlePillar } from '@guardian/libs'; +import { Pillar } from '../../../articleFormat'; import { article } from 'fixtures/item'; import { text } from 'palette'; import type { ReactElement } from 'react'; @@ -34,7 +34,7 @@ const styles = (kickerColor: string): SerializedStyles => { const Default = (): ReactElement => { const item = { ...article, - theme: ArticlePillar.News, + theme: Pillar.News, }; const kicker = text.editionsKicker(item); diff --git a/apps-rendering/src/components/editions/standfirst/index.tsx b/apps-rendering/src/components/editions/standfirst/index.tsx index a5f04ec8732..6e91a6e7bf5 100644 --- a/apps-rendering/src/components/editions/standfirst/index.tsx +++ b/apps-rendering/src/components/editions/standfirst/index.tsx @@ -2,8 +2,11 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, +} from '../../../articleFormat'; import { from, headlineBold17, diff --git a/apps-rendering/src/components/editions/standfirst/standfirst.stories.tsx b/apps-rendering/src/components/editions/standfirst/standfirst.stories.tsx index e11356b6ad4..a6b798ddb9b 100644 --- a/apps-rendering/src/components/editions/standfirst/standfirst.stories.tsx +++ b/apps-rendering/src/components/editions/standfirst/standfirst.stories.tsx @@ -1,5 +1,5 @@ // ----- Imports ----- // -import { ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { ArticleDisplay, Pillar } from '../../../articleFormat'; import { neutral } from '@guardian/source/foundations'; import { parse } from 'client/parser'; import { analysis, article, comment, media } from 'fixtures/item'; @@ -24,7 +24,7 @@ const Default = (): ReactElement => ( item={{ ...article, standfirst, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -36,7 +36,7 @@ const Showcase = (): ReactElement => ( ...article, standfirst, display: ArticleDisplay.Showcase, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -47,7 +47,7 @@ const Comment = (): ReactElement => ( item={{ ...comment, standfirst, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -58,7 +58,7 @@ const Analysis = (): ReactElement => ( item={{ ...analysis, standfirst, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> ); @@ -74,7 +74,7 @@ const Media = (): ReactElement => ( item={{ ...media, standfirst, - theme: ArticlePillar.News, + theme: Pillar.News, }} /> diff --git a/apps-rendering/src/components/editions/starRating/index.tsx b/apps-rendering/src/components/editions/starRating/index.tsx index ea57dbe93a3..6bdb402ea01 100644 --- a/apps-rendering/src/components/editions/starRating/index.tsx +++ b/apps-rendering/src/components/editions/starRating/index.tsx @@ -1,7 +1,7 @@ // ----- Imports ----- // import { css } from '@emotion/react'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign } from '../../../articleFormat'; import { brandAltBackground, brandAltLine } from '@guardian/source/foundations'; import { SvgStar } from '@guardian/source/react-components'; import type { Item } from 'item'; diff --git a/apps-rendering/src/components/editions/styles.ts b/apps-rendering/src/components/editions/styles.ts index b6b7b773a72..abaa35ad88e 100644 --- a/apps-rendering/src/components/editions/styles.ts +++ b/apps-rendering/src/components/editions/styles.ts @@ -1,7 +1,11 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, + Pillar, +} from '../../articleFormat'; import { brandAlt, culture, @@ -111,15 +115,15 @@ export const headerBackgroundColour = (format: ArticleFormat): Colour => { if (format.design === ArticleDesign.Comment) { switch (format.theme) { - case ArticlePillar.Culture: + case Pillar.Culture: return culture[800]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[800]; - case ArticlePillar.News: + case Pillar.News: return news[800]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[800]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[800]; default: return neutral[100]; @@ -128,7 +132,7 @@ export const headerBackgroundColour = (format: ArticleFormat): Colour => { if (format.design === ArticleDesign.Review) { switch (format.theme) { - case ArticlePillar.Culture: + case Pillar.Culture: return culture[800]; default: return neutral[100]; @@ -140,11 +144,11 @@ export const headerBackgroundColour = (format: ArticleFormat): Colour => { export const interviewBackgroundColour = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.Sport: + case Pillar.Sport: return brandAlt[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[600]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[800]; default: return neutral[100]; diff --git a/apps-rendering/src/components/media/articleBody.tsx b/apps-rendering/src/components/media/articleBody.tsx index 95476026edd..caec521cbfc 100644 --- a/apps-rendering/src/components/media/articleBody.tsx +++ b/apps-rendering/src/components/media/articleBody.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { remSpace } from '@guardian/source/foundations'; import { background, text } from 'palette'; import type { ReactNode } from 'react'; diff --git a/apps-rendering/src/components/media/articleSeries.tsx b/apps-rendering/src/components/media/articleSeries.tsx index c5851a356c0..a72110bbbc2 100644 --- a/apps-rendering/src/components/media/articleSeries.tsx +++ b/apps-rendering/src/components/media/articleSeries.tsx @@ -1,6 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from '../../articleFormat'; import { headlineBold17 } from '@guardian/source/foundations'; import type { Option } from '../../../vendor/@guardian/types/index'; import { map, withDefault } from '../../../vendor/@guardian/types/index'; diff --git a/apps-rendering/src/fixtures/article.ts b/apps-rendering/src/fixtures/article.ts index 066aa050faf..60945854c6e 100644 --- a/apps-rendering/src/fixtures/article.ts +++ b/apps-rendering/src/fixtures/article.ts @@ -1,11 +1,12 @@ // ----- Imports ----- // -import type { - ArticleDesign, - ArticleDisplay, - ArticleFormat, -} from '@guardian/libs'; -import { ArticlePillar, ArticleSpecial } from '@guardian/libs'; +import { + type ArticleDesign, + type ArticleDisplay, + type ArticleFormat, + ArticleSpecial, + Pillar, +} from '../articleFormat'; import { themeToString } from 'articleFormat'; // ----- Functions ----- // @@ -15,11 +16,11 @@ const getAllThemes = (format: { design: ArticleDesign; }): ArticleFormat[] => { return [ - { ...format, theme: ArticlePillar.News }, - { ...format, theme: ArticlePillar.Sport }, - { ...format, theme: ArticlePillar.Culture }, - { ...format, theme: ArticlePillar.Lifestyle }, - { ...format, theme: ArticlePillar.Opinion }, + { ...format, theme: Pillar.News }, + { ...format, theme: Pillar.Sport }, + { ...format, theme: Pillar.Culture }, + { ...format, theme: Pillar.Lifestyle }, + { ...format, theme: Pillar.Opinion }, { ...format, theme: ArticleSpecial.SpecialReport }, { ...format, theme: ArticleSpecial.Labs }, { ...format, theme: ArticleSpecial.SpecialReportAlt }, diff --git a/apps-rendering/src/fixtures/item.ts b/apps-rendering/src/fixtures/item.ts index 8ba69131a59..8d03a554e18 100644 --- a/apps-rendering/src/fixtures/item.ts +++ b/apps-rendering/src/fixtures/item.ts @@ -1,14 +1,14 @@ import { Edition } from '@guardian/apps-rendering-api-models/edition'; import type { Tag } from '@guardian/content-api-models/v1/tag'; import { TagType } from '@guardian/content-api-models/v1/tagType'; -import type { ArticleTheme } from '@guardian/libs'; +import { ArticleElementRole } from '@guardian/libs'; import { ArticleDesign, ArticleDisplay, - ArticleElementRole, ArticleSpecial, + type ArticleTheme, Pillar, -} from '@guardian/libs'; +} from '../articleFormat'; import { none, OptionKind, some } from '../../vendor/@guardian/types/index'; import type { Option } from '../../vendor/@guardian/types/index'; import type { Body } from 'bodyElement'; diff --git a/apps-rendering/src/fixtures/live.ts b/apps-rendering/src/fixtures/live.ts index c83477a9962..4ed78b29268 100644 --- a/apps-rendering/src/fixtures/live.ts +++ b/apps-rendering/src/fixtures/live.ts @@ -1,12 +1,8 @@ // ----- Imports ----- // import { Edition } from '@guardian/apps-rendering-api-models/edition'; -import { - ArticleDesign, - ArticleDisplay, - ArticleElementRole, - ArticlePillar, -} from '@guardian/libs'; +import { ArticleElementRole } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from '../articleFormat'; import { none, OptionKind, some } from '../../vendor/@guardian/types/index'; import type { Option } from '../../vendor/@guardian/types/index'; import { parse } from 'client/parser'; @@ -223,7 +219,7 @@ const tags = [ ]; const fields = { - theme: ArticlePillar.News, + theme: Pillar.News, display: ArticleDisplay.Standard, body: [], headline: headline, diff --git a/apps-rendering/src/image.ts b/apps-rendering/src/image.ts index 958b500d013..a080afbbbad 100644 --- a/apps-rendering/src/image.ts +++ b/apps-rendering/src/image.ts @@ -4,7 +4,7 @@ import type { Image as CardImage } from '@guardian/apps-rendering-api-models/ima import type { Asset } from '@guardian/content-api-models/v1/asset'; import type { BlockElement } from '@guardian/content-api-models/v1/blockElement'; import { ArticleElementRole } from '@guardian/libs'; -import type { ArticleFormat } from '@guardian/libs'; +import type { ArticleFormat } from 'articleFormat'; import type { Option } from '../vendor/@guardian/types/index'; import { andThen, diff --git a/apps-rendering/src/item.test.ts b/apps-rendering/src/item.test.ts index c8d456ed07c..e8604f9cf07 100644 --- a/apps-rendering/src/item.test.ts +++ b/apps-rendering/src/item.test.ts @@ -9,7 +9,7 @@ import { Atoms } from '@guardian/content-api-models/v1/atoms'; import { fromCapi, Standard, Review, getFormat } from 'item'; import { ElementKind } from 'bodyElement'; import { none, some } from '../vendor/@guardian/types/index'; -import { ArticleDesign, ArticleDisplay, ArticleSpecial } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, ArticleSpecial } from 'articleFormat'; import { JSDOM } from 'jsdom'; import { Content } from '@guardian/content-api-models/v1/content'; import { articleContentWith, articleMainContentWith } from 'helperTest'; diff --git a/apps-rendering/src/item.ts b/apps-rendering/src/item.ts index cb6ede26b79..ef5f2e7a947 100644 --- a/apps-rendering/src/item.ts +++ b/apps-rendering/src/item.ts @@ -11,13 +11,13 @@ import type { Content } from '@guardian/content-api-models/v1/content'; import type { Element } from '@guardian/content-api-models/v1/element'; import { ElementType } from '@guardian/content-api-models/v1/elementType'; import type { Tag } from '@guardian/content-api-models/v1/tag'; -import type { ArticleFormat } from '@guardian/libs'; import { ArticleDesign, ArticleDisplay, - ArticlePillar, + type ArticleFormat, ArticleSpecial, -} from '@guardian/libs'; + Pillar, +} from 'articleFormat'; import { andThen, fromNullable, @@ -343,7 +343,7 @@ const parseItemFields = ( theme: getReport(campaigns ?? []).withDefault( Optional.fromNullable(content.pillarId) .flatMap(getPillarFromId) - .withDefault(ArticlePillar.News), + .withDefault(Pillar.News), ), display: getDisplay(content), headline: content.fields?.headline ?? '', @@ -596,8 +596,8 @@ const fromCapi = body, ...itemFields, theme: - itemFields.theme === ArticlePillar.News - ? ArticlePillar.Opinion + itemFields.theme === Pillar.News + ? Pillar.Opinion : itemFields.theme, }; } else if (isInterview(tags)) { diff --git a/apps-rendering/src/newsletter.ts b/apps-rendering/src/newsletter.ts index 01fb6065ffd..0d67a50a2b9 100644 --- a/apps-rendering/src/newsletter.ts +++ b/apps-rendering/src/newsletter.ts @@ -1,8 +1,7 @@ // ----- Imports ----- // import type { Newsletter } from '@guardian/apps-rendering-api-models/newsletter'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign, getPillarOrElseNews } from 'articleFormat'; import { OptionKind } from '../vendor/@guardian/types/index'; -import { getPillarOrElseNews } from 'articleFormat'; import type { Body, BodyElement, NewsletterSignUp } from 'bodyElement'; import { ElementKind } from 'bodyElementKind'; import type { Item } from 'item'; diff --git a/apps-rendering/src/palette/background.ts b/apps-rendering/src/palette/background.ts index 6b2febdb598..a8c4e4a9450 100644 --- a/apps-rendering/src/palette/background.ts +++ b/apps-rendering/src/palette/background.ts @@ -1,12 +1,12 @@ // ----- Imports ----- // -import type { ArticleFormat } from '@guardian/libs'; import { ArticleDesign, ArticleDisplay, - ArticlePillar, + type ArticleFormat, ArticleSpecial, -} from '@guardian/libs'; + Pillar, +} from '../articleFormat'; import { brandAlt, culture, @@ -53,15 +53,15 @@ const headline = ({ design, display, theme }: ArticleFormat): Colour => { return neutral[97]; case ArticleDesign.LiveBlog: { switch (theme) { - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; - case ArticlePillar.News: + case Pillar.News: return news[300]; default: return news[300]; @@ -172,15 +172,15 @@ const headlineDark = ({ design, display, theme }: ArticleFormat): Colour => { return neutral[7]; case ArticleDesign.LiveBlog: { switch (theme) { - case ArticlePillar.Culture: + case Pillar.Culture: return culture[200]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[200]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[200]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[200]; - case ArticlePillar.News: + case Pillar.News: default: return news[200]; } @@ -224,15 +224,15 @@ const richLinkDark = (_format: ArticleFormat): Colour => { const richLinkSvg = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[400]; @@ -245,15 +245,15 @@ const richLinkSvg = (format: ArticleFormat): Colour => { const liveblogMetadata = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[200]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[200]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[200]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[200]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[200]; case ArticleSpecial.Labs: return labs[200]; @@ -266,15 +266,15 @@ const liveblogMetadata = (format: ArticleFormat): Colour => { const richLinkSvgDark = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[300]; @@ -291,15 +291,15 @@ const standfirst = ({ design, theme }: ArticleFormat): Colour => { return neutral[93]; case ArticleDesign.LiveBlog: { switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[200]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[100]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[200]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[200]; - case ArticlePillar.News: + case Pillar.News: default: return news[200]; } @@ -346,15 +346,15 @@ const standfirstDark = ({ design, theme }: ArticleFormat): Colour => { return neutral[10]; case ArticleDesign.LiveBlog: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[100]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[100]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[100]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[100]; - case ArticlePillar.News: + case Pillar.News: default: return news[100]; } @@ -384,15 +384,15 @@ const standfirstDark = ({ design, theme }: ArticleFormat): Colour => { const bullet = (format: ArticleFormat, returnPillarColour = true): Colour => { if (returnPillarColour) { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[400]; @@ -415,30 +415,30 @@ const bulletDark = ( return neutral[46]; case ArticleDesign.LiveBlog: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[550]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.News: + case Pillar.News: return news[550]; default: return neutral[46]; } default: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; @@ -455,15 +455,15 @@ const articleContentFollowIcon = ({ design, theme }: ArticleFormat): string => { switch (design) { case ArticleDesign.LiveBlog: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[200]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[200]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[200]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[200]; - case ArticlePillar.News: + case Pillar.News: default: return news[200]; } @@ -596,15 +596,15 @@ const avatar = ({ design, theme }: ArticleFormat): string => { return palette.specialReportAlt[200]; case ArticleSpecial.Labs: return labs[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.News: + case Pillar.News: return news[500]; } default: @@ -615,15 +615,15 @@ const avatar = ({ design, theme }: ArticleFormat): string => { return news[500]; case ArticleSpecial.Labs: return labs[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.News: + case Pillar.News: return news[500]; } } @@ -657,19 +657,19 @@ const avatarDark = ({ design, theme }: ArticleFormat): Colour => { const relatedCardBylineImage = (format: ArticleFormat): string => { switch (format.theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.SpecialReport: return specialReport[500]; case ArticleSpecial.SpecialReportAlt: return opinion[400]; - case ArticlePillar.News: + case Pillar.News: default: return opinion[400]; } @@ -710,15 +710,15 @@ const designTag = ({ design, theme }: ArticleFormat): Colour => { return specialReport[300]; case ArticleSpecial.Labs: return labs[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.News: + case Pillar.News: return news[300]; case ArticleSpecial.SpecialReportAlt: return palette.specialReportAlt[100]; @@ -729,15 +729,15 @@ const designTag = ({ design, theme }: ArticleFormat): Colour => { return specialReport[300]; case ArticleSpecial.Labs: return labs[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.News: + case Pillar.News: return news[300]; case ArticleSpecial.SpecialReportAlt: return news[300]; @@ -761,15 +761,15 @@ const designTagDark = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Editorial: case ArticleDesign.Analysis: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[300]; @@ -780,15 +780,15 @@ const designTagDark = ({ design, theme }: ArticleFormat): Colour => { } default: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[300]; @@ -808,17 +808,17 @@ const relatedCard = (format: ArticleFormat): Colour => { switch (format.design) { case ArticleDesign.LiveBlog: switch (format.theme) { - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[200]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[200]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[200]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[200]; case ArticleSpecial.SpecialReport: return specialReport[200]; - case ArticlePillar.News: + case Pillar.News: default: return news[200]; } @@ -836,19 +836,19 @@ const relatedCardDark = (format: ArticleFormat): Colour => { switch (format.design) { case ArticleDesign.LiveBlog: switch (format.theme) { - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[100]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[100]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[100]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[100]; case ArticleSpecial.Labs: return labs[200]; case ArticleSpecial.SpecialReport: return specialReport[100]; - case ArticlePillar.News: + case Pillar.News: default: return news[100]; } @@ -864,15 +864,15 @@ const relatedCardDark = (format: ArticleFormat): Colour => { const relatedCardIcon = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; @@ -899,19 +899,19 @@ const series = ({ design, display, theme }: ArticleFormat): Colour => { switch (design) { case ArticleDesign.Gallery: switch (theme) { - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.Labs: return labs[400]; case ArticleSpecial.SpecialReport: return brandAlt[400]; - case ArticlePillar.News: + case Pillar.News: default: return news[400]; } @@ -930,13 +930,13 @@ const series = ({ design, display, theme }: ArticleFormat): Colour => { case ArticleDesign.Standard: if (display === ArticleDisplay.Immersive) { switch (theme) { - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.Labs: return labs[400]; @@ -944,7 +944,7 @@ const series = ({ design, display, theme }: ArticleFormat): Colour => { return brandAlt[400]; case ArticleSpecial.SpecialReportAlt: return palette.specialReportAlt[300]; - case ArticlePillar.News: + case Pillar.News: default: return news[400]; } @@ -954,19 +954,19 @@ const series = ({ design, display, theme }: ArticleFormat): Colour => { default: if (display === ArticleDisplay.Immersive) { switch (theme) { - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.Labs: return labs[400]; case ArticleSpecial.SpecialReport: return brandAlt[400]; - case ArticlePillar.News: + case Pillar.News: default: return news[400]; } @@ -993,13 +993,13 @@ const seriesDark = ({ design, display, theme }: ArticleFormat): Colour => { case ArticleDesign.Analysis: if (display === ArticleDisplay.Immersive) { switch (theme) { - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.Labs: return labs[400]; @@ -1007,7 +1007,7 @@ const seriesDark = ({ design, display, theme }: ArticleFormat): Colour => { return brandAlt[400]; case ArticleSpecial.SpecialReportAlt: return palette.specialReportAlt[200]; - case ArticlePillar.News: + case Pillar.News: default: return news[400]; } @@ -1017,19 +1017,19 @@ const seriesDark = ({ design, display, theme }: ArticleFormat): Colour => { default: if (display === ArticleDisplay.Immersive) { switch (theme) { - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.Labs: return labs[400]; case ArticleSpecial.SpecialReport: return brandAlt[400]; - case ArticlePillar.News: + case Pillar.News: default: return news[400]; } @@ -1104,15 +1104,15 @@ const tagDark = ({ design, theme }: ArticleFormat): Colour => { const pinnedPost = (format: ArticleFormat): string => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[300]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return labs[300]; @@ -1150,19 +1150,19 @@ const newsletterSignUpFormDark = (_format: ArticleFormat): Colour => const editionsCameraIcon = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.SpecialReport: return specialReport[400]; case ArticleSpecial.Labs: return specialReport[400]; - case ArticlePillar.News: + case Pillar.News: default: return news[400]; } diff --git a/apps-rendering/src/palette/border.ts b/apps-rendering/src/palette/border.ts index 00d9c0446b7..c66bb6fa4b9 100644 --- a/apps-rendering/src/palette/border.ts +++ b/apps-rendering/src/palette/border.ts @@ -1,7 +1,11 @@ // ----- Imports ----- // -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticlePillar, ArticleSpecial } from '@guardian/libs'; +import { + ArticleDesign, + type ArticleFormat, + ArticleSpecial, + Pillar, +} from '../articleFormat'; import { culture, labs, @@ -19,15 +23,15 @@ import type { Colour } from './colour'; const articleLink = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.News: + case Pillar.News: default: return news[400]; } @@ -62,15 +66,15 @@ const interactiveAtomLink = (_format: ArticleFormat): Colour => { const liveBlock = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return labs[300]; @@ -83,15 +87,15 @@ const liveBlock = (format: ArticleFormat): Colour => { const liveBlockDark = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; @@ -119,15 +123,15 @@ const standfirstLink = (format: ArticleFormat): Colour => { } switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[600]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[600]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[600]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[600]; case ArticleSpecial.Labs: return labs[300]; @@ -150,15 +154,15 @@ const standfirstBlogLink = (format: ArticleFormat): Colour => { const richLink = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[400]; @@ -173,15 +177,15 @@ const richLinkSvg = richLink; const richLinkSvgDark = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[300]; @@ -230,15 +234,15 @@ const pagination = (format: ArticleFormat): Colour => { const pinnedPost = (format: ArticleFormat): string => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[300]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return labs[300]; diff --git a/apps-rendering/src/palette/fill.ts b/apps-rendering/src/palette/fill.ts index 76089d2ea40..151984490af 100644 --- a/apps-rendering/src/palette/fill.ts +++ b/apps-rendering/src/palette/fill.ts @@ -1,7 +1,11 @@ // ----- Imports ----- // -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticlePillar, ArticleSpecial } from '@guardian/libs'; +import { + ArticleDesign, + type ArticleFormat, + ArticleSpecial, + Pillar, +} from '../articleFormat'; import { culture, labs, @@ -22,19 +26,19 @@ const cameraCaptionIconDark = (): Colour => neutral[60]; const editionsCameraIcon = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[800]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[800]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[800]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[800]; case ArticleSpecial.SpecialReport: return specialReport[800]; case ArticleSpecial.Labs: return specialReport[800]; - case ArticlePillar.News: + case Pillar.News: default: return news[800]; } @@ -50,15 +54,15 @@ const commentCount = (format: ArticleFormat): Colour => { } switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[200]; case ArticleSpecial.Labs: return labs[300]; @@ -77,15 +81,15 @@ const commentCountDark = (format: ArticleFormat): Colour => { } switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; @@ -105,15 +109,15 @@ const commentCountWide = (format: ArticleFormat): Colour => { } switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[200]; case ArticleSpecial.Labs: return labs[300]; @@ -140,35 +144,35 @@ const icon = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Editorial: case ArticleDesign.Analysis: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.SpecialReport: return specialReport[500]; case ArticleSpecial.SpecialReportAlt: return palette.specialReportAlt[200]; - case ArticlePillar.News: + case Pillar.News: default: return news[400]; } default: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.SpecialReport: return specialReport[500]; - case ArticlePillar.News: + case Pillar.News: default: return news[400]; } @@ -191,35 +195,35 @@ const iconDark = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Editorial: case ArticleDesign.Analysis: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; case ArticleSpecial.SpecialReport: return specialReport[500]; case ArticleSpecial.SpecialReportAlt: return palette.specialReportAlt[300]; - case ArticlePillar.News: + case Pillar.News: default: return news[500]; } default: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; case ArticleSpecial.SpecialReport: return specialReport[500]; - case ArticlePillar.News: + case Pillar.News: default: return news[500]; } @@ -230,47 +234,47 @@ const followIcon = ({ design, theme }: ArticleFormat): Colour => { switch (design) { case ArticleDesign.Gallery: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; case ArticleSpecial.SpecialReport: return specialReport[500]; case ArticleSpecial.SpecialReportAlt: return palette.specialReportAlt[300]; - case ArticlePillar.News: + case Pillar.News: default: return news[500]; } case ArticleDesign.LiveBlog: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[600]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[600]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[600]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[600]; case ArticleSpecial.SpecialReport: return specialReport[500]; - case ArticlePillar.News: + case Pillar.News: default: return news[600]; } case ArticleDesign.Standard: { switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.Labs: return labs[300]; @@ -278,7 +282,7 @@ const followIcon = ({ design, theme }: ArticleFormat): Colour => { return specialReport[300]; case ArticleSpecial.SpecialReportAlt: return palette.specialReportAlt[100]; - case ArticlePillar.News: + case Pillar.News: default: return news[400]; } @@ -296,13 +300,13 @@ const followIcon = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Editorial: case ArticleDesign.Analysis: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.Labs: return labs[300]; @@ -310,25 +314,25 @@ const followIcon = ({ design, theme }: ArticleFormat): Colour => { return specialReport[300]; case ArticleSpecial.SpecialReportAlt: return palette.specialReportAlt[100]; - case ArticlePillar.News: + case Pillar.News: default: return news[400]; } default: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.SpecialReport: return specialReport[300]; case ArticleSpecial.SpecialReportAlt: return palette.specialReportAlt[100]; - case ArticlePillar.News: + case Pillar.News: default: return news[400]; } @@ -353,37 +357,37 @@ const followIconDark = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Editorial: case ArticleDesign.Analysis: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; case ArticleSpecial.SpecialReport: return specialReport[700]; case ArticleSpecial.SpecialReportAlt: return palette.specialReportAlt[700]; - case ArticlePillar.News: + case Pillar.News: default: return news[500]; } default: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; case ArticleSpecial.SpecialReport: return specialReport[700]; case ArticleSpecial.SpecialReportAlt: return palette.specialReportAlt[700]; - case ArticlePillar.News: + case Pillar.News: default: return news[500]; } @@ -394,15 +398,15 @@ const blockquoteIcon = (format: ArticleFormat): Colour => { switch (format.design) { case ArticleDesign.DeadBlog: switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[350]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return labs[300]; @@ -413,15 +417,15 @@ const blockquoteIcon = (format: ArticleFormat): Colour => { } default: switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[400]; diff --git a/apps-rendering/src/palette/hover.ts b/apps-rendering/src/palette/hover.ts index 021978692ef..0f3c5bbb7f4 100644 --- a/apps-rendering/src/palette/hover.ts +++ b/apps-rendering/src/palette/hover.ts @@ -1,7 +1,6 @@ // ----- Imports ----- // -import type { ArticleFormat } from '@guardian/libs'; -import { ArticlePillar, ArticleSpecial } from '@guardian/libs'; +import { type ArticleFormat, ArticleSpecial, Pillar } from '../articleFormat'; import { culture, labs, @@ -19,15 +18,15 @@ import type { Colour } from './colour'; const pagination = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return labs[300]; diff --git a/apps-rendering/src/palette/text.ts b/apps-rendering/src/palette/text.ts index b9d8ff7c43f..eb4f4bf5117 100644 --- a/apps-rendering/src/palette/text.ts +++ b/apps-rendering/src/palette/text.ts @@ -1,12 +1,12 @@ // ----- Imports ----- // -import type { ArticleFormat } from '@guardian/libs'; import { ArticleDesign, ArticleDisplay, - ArticlePillar, + type ArticleFormat, ArticleSpecial, -} from '@guardian/libs'; + Pillar, +} from '../articleFormat'; import { brandAlt, culture, @@ -41,15 +41,15 @@ const mediaArticleBody = (_format: ArticleFormat): Colour => { const mediaArticleBodyLinkDark = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; @@ -80,15 +80,15 @@ const byline = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Comment: case ArticleDesign.Editorial: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return labs[400]; @@ -108,15 +108,15 @@ const byline = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Letter: case ArticleDesign.Standard: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return labs[400]; @@ -127,15 +127,15 @@ const byline = ({ design, theme }: ArticleFormat): Colour => { } default: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return labs[400]; @@ -151,13 +151,13 @@ const bylineAnchor = ({ design, theme }: ArticleFormat): Colour => { switch (design) { case ArticleDesign.Analysis: switch (theme) { - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; case ArticleSpecial.Labs: return labs[300]; @@ -165,22 +165,22 @@ const bylineAnchor = ({ design, theme }: ArticleFormat): Colour => { return brandAlt[300]; case ArticleSpecial.SpecialReportAlt: return palette.specialReportAlt[100]; - case ArticlePillar.News: + case Pillar.News: default: return news[300]; } case ArticleDesign.Comment: case ArticleDesign.Editorial: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[300]; @@ -200,15 +200,15 @@ const bylineAnchor = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Review: case ArticleDesign.Standard: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[300]; @@ -219,15 +219,15 @@ const bylineAnchor = ({ design, theme }: ArticleFormat): Colour => { } default: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[300]; @@ -243,17 +243,17 @@ const bylineAnchorDark = ({ design, theme }: ArticleFormat): Colour => { switch (design) { case ArticleDesign.Analysis: switch (theme) { - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; case ArticleSpecial.SpecialReportAlt: return palette.specialReportAlt[700]; - case ArticlePillar.News: + case Pillar.News: default: return news[500]; } @@ -268,15 +268,15 @@ const bylineAnchorDark = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.NewsletterSignup: case ArticleDesign.Letter: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; @@ -288,15 +288,15 @@ const bylineAnchorDark = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Comment: case ArticleDesign.Editorial: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; @@ -307,15 +307,15 @@ const bylineAnchorDark = ({ design, theme }: ArticleFormat): Colour => { } default: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; @@ -337,15 +337,15 @@ const commentCount = (format: ArticleFormat): Colour => { } switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[200]; case ArticleSpecial.Labs: return labs[300]; @@ -365,15 +365,15 @@ const commentCountDark = (format: ArticleFormat): Colour => { } switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; @@ -404,15 +404,15 @@ const dropCap = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Editorial: case ArticleDesign.Analysis: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.News: + case Pillar.News: return news[300]; case ArticleSpecial.Labs: return labs[300]; @@ -423,15 +423,15 @@ const dropCap = ({ design, theme }: ArticleFormat): Colour => { } default: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.News: + case Pillar.News: return news[300]; case ArticleSpecial.Labs: return labs[300]; @@ -459,15 +459,15 @@ const dropCapDark = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Editorial: case ArticleDesign.Analysis: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.News: + case Pillar.News: return news[500]; case ArticleSpecial.Labs: return labs[300]; @@ -478,15 +478,15 @@ const dropCapDark = ({ design, theme }: ArticleFormat): Colour => { } default: switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.News: + case Pillar.News: return news[500]; case ArticleSpecial.Labs: return labs[300]; @@ -516,13 +516,13 @@ const headline = ({ design, display, theme }: ArticleFormat): Colour => { } switch (theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; case ArticleSpecial.SpecialReportAlt: return neutral[7]; @@ -541,7 +541,7 @@ const headline = ({ design, display, theme }: ArticleFormat): Colour => { const headlineDark = ({ design, theme }: ArticleFormat): Colour => { switch (design) { case ArticleDesign.LiveBlog: - return theme === ArticlePillar.Culture ? neutral[86] : neutral[93]; + return theme === Pillar.Culture ? neutral[86] : neutral[93]; case ArticleDesign.DeadBlog: return neutral[93]; case ArticleDesign.Standard: @@ -571,15 +571,15 @@ const bylineLeftColumn = (format: ArticleFormat): Colour => { switch (format.design) { case ArticleDesign.DeadBlog: switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return labs[300]; @@ -590,15 +590,15 @@ const bylineLeftColumn = (format: ArticleFormat): Colour => { } case ArticleDesign.LiveBlog: switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[300]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return labs[300]; @@ -628,19 +628,19 @@ const bylineInline = (format: ArticleFormat): Colour => { case ArticleDesign.DeadBlog: default: switch (format.theme) { - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[200]; case ArticleSpecial.Labs: return labs[300]; case ArticleSpecial.SpecialReport: return specialReport[300]; - case ArticlePillar.News: + case Pillar.News: default: return news[400]; } @@ -770,15 +770,15 @@ const linkDark = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Editorial: case ArticleDesign.Analysis: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return specialReport[500]; @@ -789,15 +789,15 @@ const linkDark = ({ design, theme }: ArticleFormat): Colour => { } default: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return specialReport[500]; @@ -814,15 +814,15 @@ const articleLink = (format: ArticleFormat): Colour => { case ArticleDesign.LiveBlog: case ArticleDesign.DeadBlog: switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[350]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return specialReport[400]; @@ -848,15 +848,15 @@ const articleLink = (format: ArticleFormat): Colour => { case ArticleDesign.Review: case ArticleDesign.Standard: switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[300]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return specialReport[300]; @@ -867,15 +867,15 @@ const articleLink = (format: ArticleFormat): Colour => { } default: switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[300]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return specialReport[300]; @@ -889,15 +889,15 @@ const articleLink = (format: ArticleFormat): Colour => { const interactiveAtomLink = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[400]; @@ -910,15 +910,15 @@ const interactiveAtomLink = (format: ArticleFormat): Colour => { const keyEventsInline = ({ theme }: ArticleFormat): Colour => { switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[350]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return labs[400]; @@ -931,15 +931,15 @@ const keyEventsInline = ({ theme }: ArticleFormat): Colour => { const keyEventsLeftColumn = ({ theme }: ArticleFormat): Colour => { switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return labs[300]; @@ -952,15 +952,15 @@ const keyEventsLeftColumn = ({ theme }: ArticleFormat): Colour => { const mediaArticleSeries = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; @@ -1027,15 +1027,15 @@ const standfirstLink = ({ design, theme }: ArticleFormat): Colour => { return neutral[100]; case ArticleDesign.DeadBlog: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[200]; case ArticleSpecial.Labs: return labs[300]; @@ -1050,15 +1050,15 @@ const standfirstLink = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Audio: case ArticleDesign.Video: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[300]; @@ -1081,15 +1081,15 @@ const standfirstLink = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Review: case ArticleDesign.Standard: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[300]; @@ -1100,15 +1100,15 @@ const standfirstLink = ({ design, theme }: ArticleFormat): Colour => { } default: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[300]; @@ -1130,15 +1130,15 @@ const standfirstLinkDark = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Video: case ArticleDesign.Picture: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[300]; @@ -1187,15 +1187,15 @@ const kicker = (format: ArticleFormat): Colour => { switch (format.design) { case ArticleDesign.LiveBlog: switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[600]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[600]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return neutral[100]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[600]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; case ArticleSpecial.Labs: default: @@ -1206,15 +1206,15 @@ const kicker = (format: ArticleFormat): Colour => { case ArticleDesign.Video: case ArticleDesign.Picture: switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[600]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[600]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[550]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; case ArticleSpecial.Labs: return labs[400]; @@ -1223,15 +1223,15 @@ const kicker = (format: ArticleFormat): Colour => { } default: switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.Labs: return labs[400]; @@ -1243,13 +1243,13 @@ const kicker = (format: ArticleFormat): Colour => { const editionsKicker = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; case ArticleSpecial.SpecialReport: case ArticleSpecial.Labs: @@ -1266,15 +1266,15 @@ const seriesTitle = ({ design, display, theme }: ArticleFormat): Colour => { return neutral[100]; case ArticleDesign.DeadBlog: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[400]; @@ -1285,15 +1285,15 @@ const seriesTitle = ({ design, display, theme }: ArticleFormat): Colour => { } case ArticleDesign.LiveBlog: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[600]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[600]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[600]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[600]; case ArticleSpecial.Labs: return labs[400]; @@ -1325,15 +1325,15 @@ const seriesTitle = ({ design, display, theme }: ArticleFormat): Colour => { } switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[300]; @@ -1348,15 +1348,15 @@ const seriesTitle = ({ design, display, theme }: ArticleFormat): Colour => { } switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[300]; @@ -1395,15 +1395,15 @@ const relatedCardTimeAgoDark = (_format: ArticleFormat): Colour => neutral[60]; const richLink = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[400]; @@ -1451,15 +1451,15 @@ const seriesTitleDark = ({ design, display, theme }: ArticleFormat): Colour => { } switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; @@ -1474,15 +1474,15 @@ const seriesTitleDark = ({ design, display, theme }: ArticleFormat): Colour => { } switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; @@ -1496,15 +1496,15 @@ const seriesTitleDark = ({ design, display, theme }: ArticleFormat): Colour => { const pagination = (format: ArticleFormat): Colour => { switch (format.theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[300]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[300]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[300]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[300]; case ArticleSpecial.Labs: return labs[300]; @@ -1531,15 +1531,15 @@ const pullquote = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Editorial: case ArticleDesign.Analysis: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[400]; @@ -1550,15 +1550,15 @@ const pullquote = ({ design, theme }: ArticleFormat): Colour => { } default: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[400]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[400]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[400]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[400]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[400]; case ArticleSpecial.Labs: return labs[400]; @@ -1586,15 +1586,15 @@ const pullquoteDark = ({ design, theme }: ArticleFormat): Colour => { case ArticleDesign.Editorial: case ArticleDesign.Analysis: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; @@ -1605,15 +1605,15 @@ const pullquoteDark = ({ design, theme }: ArticleFormat): Colour => { } default: switch (theme) { - case ArticlePillar.News: + case Pillar.News: return news[500]; - case ArticlePillar.Lifestyle: + case Pillar.Lifestyle: return lifestyle[500]; - case ArticlePillar.Sport: + case Pillar.Sport: return sport[500]; - case ArticlePillar.Culture: + case Pillar.Culture: return culture[500]; - case ArticlePillar.Opinion: + case Pillar.Opinion: return opinion[500]; case ArticleSpecial.Labs: return labs[400]; diff --git a/apps-rendering/src/renderer.test.ts b/apps-rendering/src/renderer.test.ts index 922e9cf235c..b4951edcc62 100644 --- a/apps-rendering/src/renderer.test.ts +++ b/apps-rendering/src/renderer.test.ts @@ -9,12 +9,11 @@ import { shouldShowDropCap, } from 'renderer'; import { JSDOM } from 'jsdom'; -import { ArticlePillar } from '@guardian/libs'; +import { ArticleDesign, ArticleDisplay, Pillar } from 'articleFormat'; import { isValidElement, ReactNode } from 'react'; import { compose } from 'lib'; import { BodyElement, ElementKind } from 'bodyElement'; import { none, some } from '../vendor/@guardian/types/index'; -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; import { renderToStaticMarkup } from 'react-dom/server'; import { EmbedKind } from 'embed'; import { EmbedTracksType } from '@guardian/content-api-models/v1/embedTracksType'; @@ -542,7 +541,7 @@ describe('Shows drop caps', () => { const positionAllowsDropCap = true; const format = { display: ArticleDisplay.Standard, - theme: ArticlePillar.Culture, + theme: Pillar.Culture, design: ArticleDesign.Interview, }; diff --git a/apps-rendering/src/renderer.ts b/apps-rendering/src/renderer.ts index e441a7fc29a..f8dc988d52a 100644 --- a/apps-rendering/src/renderer.ts +++ b/apps-rendering/src/renderer.ts @@ -1,8 +1,12 @@ // ----- Imports ----- // import { css, jsx as styledH } from '@emotion/react'; -import { ArticleDesign, ArticleDisplay, ArticleSpecial } from '@guardian/libs'; -import type { ArticleFormat } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, + ArticleSpecial, +} from 'articleFormat'; import type { Breakpoint } from '@guardian/source/foundations'; import { neutral, remSpace, until } from '@guardian/source/foundations'; import { diff --git a/apps-rendering/src/server/csp.ts b/apps-rendering/src/server/csp.ts index 48f384af6ad..dc42e943644 100644 --- a/apps-rendering/src/server/csp.ts +++ b/apps-rendering/src/server/csp.ts @@ -1,7 +1,7 @@ // ----- Imports ----- // import { createHash } from 'crypto'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign } from '../articleFormat'; import { map, withDefault } from '../../vendor/@guardian/types/index'; import type { BodyElement } from 'bodyElement'; import { ElementKind } from 'bodyElement'; diff --git a/apps-rendering/src/server/editionsPage.tsx b/apps-rendering/src/server/editionsPage.tsx index 4879c688aa5..6161826a65e 100644 --- a/apps-rendering/src/server/editionsPage.tsx +++ b/apps-rendering/src/server/editionsPage.tsx @@ -5,7 +5,7 @@ import { CacheProvider } from '@emotion/react'; import createEmotionServer from '@emotion/server/create-instance'; import type { EmotionCritical } from '@emotion/server/create-instance'; import type { RenderingRequest } from '@guardian/apps-rendering-api-models/renderingRequest'; -import type { ArticleTheme } from '@guardian/libs'; +import type { ArticleTheme } from '../articleFormat'; import { resets } from '@guardian/source/foundations'; import type { Option } from '../../vendor/@guardian/types/index'; import { diff --git a/apps-rendering/src/server/page.tsx b/apps-rendering/src/server/page.tsx index 24bbd5a2db0..2dca7148dc9 100644 --- a/apps-rendering/src/server/page.tsx +++ b/apps-rendering/src/server/page.tsx @@ -5,8 +5,11 @@ import { CacheProvider } from '@emotion/react'; import createEmotionServer from '@emotion/server/create-instance'; import type { EmotionCritical } from '@emotion/server/create-instance'; import type { RenderingRequest } from '@guardian/apps-rendering-api-models/renderingRequest'; -import { ArticleDesign, ArticleDisplay } from '@guardian/libs'; -import type { ArticleFormat } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, +} from '../articleFormat'; import { background, resets } from '@guardian/source/foundations'; import { map, none, some } from '../../vendor/@guardian/types/index'; import type { Option } from '../../vendor/@guardian/types/index'; diff --git a/apps-rendering/src/server/server.ts b/apps-rendering/src/server/server.ts index d38710c041d..370c06c1b96 100644 --- a/apps-rendering/src/server/server.ts +++ b/apps-rendering/src/server/server.ts @@ -5,8 +5,7 @@ import { Edition } from '@guardian/apps-rendering-api-models/edition'; import type { RelatedContent } from '@guardian/apps-rendering-api-models/relatedContent'; import type { RenderingRequest } from '@guardian/apps-rendering-api-models/renderingRequest'; import type { Content } from '@guardian/content-api-models/v1/content'; -import type { ArticleTheme } from '@guardian/libs'; -import { ArticlePillar, ArticleSpecial } from '@guardian/libs'; +import { ArticleSpecial, type ArticleTheme, Pillar } from '../articleFormat'; import type { Option } from '../../vendor/@guardian/types/index'; import { fromNullable, @@ -62,15 +61,15 @@ type CapiReturn = Promise>; function themeFromUnknown(a: unknown): Option { switch (a) { case '0': - return some(ArticlePillar.News); + return some(Pillar.News); case '1': - return some(ArticlePillar.Opinion); + return some(Pillar.Opinion); case '2': - return some(ArticlePillar.Sport); + return some(Pillar.Sport); case '3': - return some(ArticlePillar.Culture); + return some(Pillar.Culture); case '4': - return some(ArticlePillar.Lifestyle); + return some(Pillar.Lifestyle); case '5': return some(ArticleSpecial.SpecialReport); case '6': diff --git a/apps-rendering/src/styles.ts b/apps-rendering/src/styles.ts index aba9b00cf0f..d1d04781109 100644 --- a/apps-rendering/src/styles.ts +++ b/apps-rendering/src/styles.ts @@ -1,7 +1,6 @@ import type { SerializedStyles } from '@emotion/react'; import { css } from '@emotion/react'; -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign } from '@guardian/libs'; +import { ArticleDesign, type ArticleFormat } from 'articleFormat'; import { background, from, diff --git a/apps-rendering/src/testsHelper.ts b/apps-rendering/src/testsHelper.ts index a051e8db70d..dbcda9ecece 100644 --- a/apps-rendering/src/testsHelper.ts +++ b/apps-rendering/src/testsHelper.ts @@ -1,5 +1,9 @@ -import type { ArticleFormat } from '@guardian/libs'; -import { ArticleDesign, ArticleDisplay, ArticlePillar } from '@guardian/libs'; +import { + ArticleDesign, + ArticleDisplay, + type ArticleFormat, + Pillar, +} from 'articleFormat'; import type { BodyElement } from 'bodyElement'; import { flattenTextElement } from 'bodyElement'; import { JSDOM } from 'jsdom'; @@ -12,7 +16,7 @@ import { } from 'renderer'; const mockFormat: ArticleFormat = { - theme: ArticlePillar.News, + theme: Pillar.News, design: ArticleDesign.Standard, display: ArticleDisplay.Standard, };