@times-components/ts-components 1.35.3 → 1.36.0

package/src/components/recommended-articles/RecommendedArticles.stories.tsx

@@ -0,0 +1,82 @@
+import React from 'react';
+
+import { showcaseConverter } from '@times-components/storybook';
+import { MockedProvider } from '@times-components/provider-test-tools';
+import { recommendations } from '@times-components/provider-queries';
+
+import analyticsStream from '../../fixtures/analytics-actions/analytics-actions';
+import { RecommendedArticles } from './RecommendedArticles';
+
+const mocks = [
+  {
+    delay: 1000,
+    request: {
+      query: recommendations,
+      variables: {
+        publisher: 'TIMES',
+        recomArgs: {
+          userId: '1234',
+          articleId: '94a01926-719a-11ec-aacf-0736e08b15cd'
+        }
+      }
+    },
+    result: {
+      data: {
+        recommendations: {
+          __typename: 'Recommendations',
+          leadAsset: 'null',
+          articles: [
+            {
+              __typename: 'UniversalArticle',
+              headline:
+                'Whole world is against us, says top Russian strategist',
+              id: 'a9ffb7cc-d5d1-11ec-bb99-1bcd45646516',
+              media: {
+                __typename: 'Image'
+              },
+              slug:
+                'were-no-match-for-ukrainian-grit-and-firepower-says-retired-russian-colonel',
+              url:
+                'https://www.staging-thetimes.co.uk/article/were-no-match-for-ukrainian-grit-and-firepower-says-retired-russian-colonel-lhnvsfj33'
+            },
+            {
+              __typename: 'UniversalArticle',
+              headline: 'Vardys leave court with swipe at Wayne Rooney',
+              id: 'f3d730a0-d5c2-11ec-8585-951ab3afb4d2',
+              media: {
+                __typename: 'Image'
+              },
+              slug:
+                'wayne-rooney-to-give-evidence-in-wagatha-christie-trial-as-jamie-vardy-attends-court-for-first-time',
+              url:
+                'https://www.staging-thetimes.co.uk/article/wayne-rooney-to-give-evidence-in-wagatha-christie-trial-as-jamie-vardy-attends-court-for-first-time-wlzvxklc6'
+            }
+          ]
+        }
+      }
+    }
+  }
+];
+
+const recarticles = {
+  children: [
+    {
+      component: () => (
+        <MockedProvider mocks={mocks}>
+          <RecommendedArticles
+            articleId="94a01926-719a-11ec-aacf-0736e08b15cd"
+            section="News"
+            analyticsStream={analyticsStream}
+          />
+        </MockedProvider>
+      ),
+
+      name: 'Recommended Articles',
+      platform: 'web',
+      type: 'story'
+    }
+  ],
+  name: 'Typescript Component/Recommended Articles'
+};
+
+showcaseConverter(module, recarticles);

package/src/components/recommended-articles/RecommendedArticles.tsx

@@ -0,0 +1,59 @@
+import React from 'react';
+
+import RelatedArticles from '@times-components/related-articles';
+import { GetRecommendedArticles } from '@times-components/provider';
+
+import { RelatedArticleSliceType } from '../../types/related-article-slice';
+
+import { Placeholder } from '@times-components/image';
+
+type RecommendedArticlesProps = {
+  articleId: string;
+  section: string;
+  analyticsStream?: (evt: any) => void;
+};
+
+export const RecommendedArticles = ({
+  articleId,
+  section,
+  analyticsStream
+}: RecommendedArticlesProps) => {
+  return (
+    <GetRecommendedArticles
+      publisher={'TIMES'}
+      recomArgs={{ userId: '1234', articleId }}
+      ssr={false}
+      debounceTimeMs={0}
+    >
+      {({ isLoading, error, recommendations }: any) => {
+        if (error) {
+          return null;
+        }
+
+        if (isLoading || !recommendations) {
+          return (
+            <div className="placeholder">
+              <Placeholder />
+            </div>
+          );
+        }
+
+        const slice: RelatedArticleSliceType = {
+          sliceName: 'StandardSlice',
+          items: recommendations
+            ? recommendations.articles.map((article: any) => ({ article }))
+            : []
+        };
+
+        return (
+          <RelatedArticles
+            heading={`Today's ${section}`}
+            slice={slice}
+            isVisible
+            analyticsStream={analyticsStream}
+          />
+        );
+      }}
+    </GetRecommendedArticles>
+  );
+};

package/src/components/recommended-articles/__tests__/RecommendedArticles.test.tsx

@@ -0,0 +1,91 @@
+import React from 'react';
+import { render, cleanup } from '@testing-library/react';
+
+import { RecommendedArticles } from '../RecommendedArticles';
+
+import { MockedProvider } from '@times-components/provider-test-tools';
+import { recommendations } from '@times-components/provider-queries';
+
+const mocks = [
+  {
+    delay: 1000,
+    request: {
+      query: recommendations,
+      variables: {
+        publisher: 'TIMES',
+        recomArgs: {
+          userId: '1234',
+          articleId: '94a01926-719a-11ec-aacf-0736e08b15cd'
+        }
+      }
+    },
+    result: {
+      data: {
+        recommendations: {
+          __typename: 'Recommendations',
+          leadAsset: 'null',
+          articles: [
+            {
+              __typename: 'UniversalArticle',
+              headline:
+                'Whole world is against us, says top Russian strategist',
+              id: 'a9ffb7cc-d5d1-11ec-bb99-1bcd45646516',
+              media: {
+                __typename: 'Image'
+              },
+              slug:
+                'were-no-match-for-ukrainian-grit-and-firepower-says-retired-russian-colonel',
+              url:
+                'https://www.staging-thetimes.co.uk/article/were-no-match-for-ukrainian-grit-and-firepower-says-retired-russian-colonel-lhnvsfj33'
+            },
+            {
+              __typename: 'UniversalArticle',
+              headline: 'Vardys leave court with swipe at Wayne Rooney',
+              id: 'f3d730a0-d5c2-11ec-8585-951ab3afb4d2',
+              media: {
+                __typename: 'Image'
+              },
+              slug:
+                'wayne-rooney-to-give-evidence-in-wagatha-christie-trial-as-jamie-vardy-attends-court-for-first-time',
+              url:
+                'https://www.staging-thetimes.co.uk/article/wayne-rooney-to-give-evidence-in-wagatha-christie-trial-as-jamie-vardy-attends-court-for-first-time-wlzvxklc6'
+            }
+          ]
+        }
+      }
+    }
+  }
+];
+
+describe('Recommended Articles', () => {
+  afterEach(() => {
+    jest.clearAllMocks();
+    cleanup();
+  });
+
+  it('it renders', () => {
+    const { asFragment } = render(
+      <MockedProvider mocks={mocks}>
+        <RecommendedArticles
+          articleId="94a01926-719a-11ec-aacf-0736e08b15cd"
+          section="News"
+          analyticsStream={jest.fn()}
+        />
+      </MockedProvider>
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  it('degrades gracefully', () => {
+    const { asFragment } = render(
+      <MockedProvider mocks={mocks}>
+        <RecommendedArticles
+          articleId=""
+          section="News"
+          analyticsStream={jest.fn()}
+        />
+      </MockedProvider>
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+});

package/src/components/recommended-articles/__tests__/__snapshots__/RecommendedArticles.test.tsx.snap

@@ -0,0 +1,71 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Recommended Articles degrades gracefully 1`] = `
+<DocumentFragment>
+  <div
+    class="placeholder"
+  >
+    <div
+      class="tc-view__TcView-nuazoi-0 fPjBcr"
+      height="100%"
+      style="align-items: center; background-color: rgb(237, 237, 237); bottom: 0px; justify-content: center; left: 0px; position: absolute; right: 0px; top: 0px; z-index: 0; border-radius: 0;"
+      width="100%"
+    >
+      <svg
+        height="auto"
+        style="max-width: 25%; max-height: 50%;"
+        version="1.1"
+        viewBox="145 50 108 120"
+        width="100%"
+      >
+        <g
+          fill="none"
+          fill-rule="evenodd"
+          stroke="none"
+          stroke-width="1"
+        >
+          <path
+            d="M211.26076,54 L211.231367,54 L147.67512,54 L145,85.7081465 L146.922096,86.4489102 C146.922096,86.4489102 164.867589,68.1355181 168.301115,65.0001546 C171.728017,61.8689133 174.237132,61.0885763 176.436179,60.3527593 C180.998206,59.169681 185.977937,59.2150255 185.977937,59.2150255 L186.109581,59.2150255 L186.109581,156.560932 L169.259886,164.473953 L169.259886,166 L228.735147,166 L228.735147,164.473953 L211.889177,156.560932 L211.889177,59.2150255 L212.01751,59.2150255 C212.01751,59.2150255 216.992272,59.169681 221.558854,60.3527593 C223.757072,61.0885763 226.266601,61.8689133 229.691848,65.0001546 C233.130341,68.1355181 251.071695,86.4489102 251.071695,86.4489102 L253,85.7081465 L250.317842,54 L211.270695,54 L211.242545,54"
+            fill="#FFFFFF"
+          />
+        </g>
+      </svg>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Recommended Articles it renders 1`] = `
+<DocumentFragment>
+  <div
+    class="placeholder"
+  >
+    <div
+      class="tc-view__TcView-nuazoi-0 fPjBcr"
+      height="100%"
+      style="align-items: center; background-color: rgb(237, 237, 237); bottom: 0px; justify-content: center; left: 0px; position: absolute; right: 0px; top: 0px; z-index: 0; border-radius: 0;"
+      width="100%"
+    >
+      <svg
+        height="auto"
+        style="max-width: 25%; max-height: 50%;"
+        version="1.1"
+        viewBox="145 50 108 120"
+        width="100%"
+      >
+        <g
+          fill="none"
+          fill-rule="evenodd"
+          stroke="none"
+          stroke-width="1"
+        >
+          <path
+            d="M211.26076,54 L211.231367,54 L147.67512,54 L145,85.7081465 L146.922096,86.4489102 C146.922096,86.4489102 164.867589,68.1355181 168.301115,65.0001546 C171.728017,61.8689133 174.237132,61.0885763 176.436179,60.3527593 C180.998206,59.169681 185.977937,59.2150255 185.977937,59.2150255 L186.109581,59.2150255 L186.109581,156.560932 L169.259886,164.473953 L169.259886,166 L228.735147,166 L228.735147,164.473953 L211.889177,156.560932 L211.889177,59.2150255 L212.01751,59.2150255 C212.01751,59.2150255 216.992272,59.169681 221.558854,60.3527593 C223.757072,61.0885763 226.266601,61.8689133 229.691848,65.0001546 C233.130341,68.1355181 251.071695,86.4489102 251.071695,86.4489102 L253,85.7081465 L250.317842,54 L211.270695,54 L211.242545,54"
+            fill="#FFFFFF"
+          />
+        </g>
+      </svg>
+    </div>
+  </div>
+</DocumentFragment>
+`;

package/src/index.ts

@@ -70,6 +70,9 @@ export {
 export {
   RelatedArticleSlice
 } from './components/related-article-slice/RelatedArticleSlice';
+export {
+  RecommendedArticles
+} from './components/recommended-articles/RecommendedArticles';
 export {
   LatestFromSection
 } from './components/latest-from-section/LatestFromSection';
@@ -109,28 +112,6 @@ export {
 
 export { UpdatedTimeProvider } from './helpers/time/UpdatedTimeProvider';
 
-// styleguide
-export {
-  default as styleguide,
-  Animations,
-  breakpoints,
-  colours,
-  editionBreakpoints,
-  editionBreakpointWidths,
-  editionMaxWidth,
-  sliceContentMaxWidth,
-  fonts,
-  fontFactory,
-  fontSizes,
-  getEditionBreakpoint,
-  lineHeight,
-  scales,
-  spacing,
-  globalSpacingStyles,
-  tabletRowPadding,
-  themeFactory
-} from './components/styleguide/Styleguide';
-
 export {
   default as safeDecodeURIComponent
 } from './utils/safeDecodeURIComponent';

package/src/types/externs.d.ts

@@ -180,12 +180,19 @@ declare module '@times-components/provider' {
     ssr: boolean;
     debounceTimeMs: number;
   }>;
+  export const GetRecommendedArticles: React.FC<{
+    publisher: string;
+    recomArgs: any;
+    ssr: boolean;
+    debounceTimeMs: number;
+  }>;
 }
 
 declare module '@times-components/provider-queries' {
   import { DocumentNode } from 'graphql';
   export const getNewsletter: DocumentNode;
   export const subscribeNewsletter: DocumentNode;
+  export const recommendations: DocumentNode;
 }
 
 declare module '@times-components/provider-test-tools' {

package/dist/components/styleguide/Styleguide.d.ts

@@ -1,193 +0,0 @@
-import 'react';
-import colours from './colours/colours';
-import Animations from './components/Animations';
-import breakpoints, { editionBreakpoints, editionMaxWidth, getEditionBreakpoint, editionBreakpointWidths, sliceContentMaxWidth } from './breakpoints';
-import lineHeight from './lineHeight';
-import { timesFontFactory, timesFontSizes, fontStyles } from './fonts/fonts';
-import themeFactory from './themeFactory';
-import scales from './scales';
-import spacing, { globalSpacingStyles } from './spacing';
-declare const nativeTablet: number, nativeTabletWide: number;
-export declare const tabletRowPadding = 20;
-declare const _default: () => {
-    Animations: {
-        FadeIn: import("styled-components").StyledComponent<import("react").FC<{
-            style?: import("react").CSSProperties | undefined;
-        }>, any, {}, never>;
-    };
-    colours: {
-        functional: {
-            action: string;
-            actionPressed: string;
-            articleFlagExclusive: string;
-            articleFlagNew: string;
-            articleFlagUpdated: string;
-            backgroundPrimary: string;
-            backgroundSecondary: string;
-            black: string;
-            border: string;
-            brandColour: string;
-            bullet: string;
-            contrast: string;
-            darkSupplement: string;
-            greyLabel: string;
-            greyStickyBarBoxShadow: string;
-            greyStickyBarBorderBottom: string;
-            gutter: string;
-            keyline: string;
-            modalBackground: string;
-            newsletterPuffBackground: string;
-            overlayGradientEnd: string;
-            overlayGradientFallback: string;
-            overlayGradientStart: string;
-            primary: string;
-            secondary: string;
-            tertiary: string;
-            transparentBlack: string;
-            transparentWhite: string;
-            white: string;
-            whiteGrey: string;
-        };
-        secondarySectionColours: {
-            'The Sunday Times Magazine': string;
-            thesundaytimesmagazine: string;
-        };
-        section: {
-            'Arts & Features': string;
-            'Bricks & Mortar': string;
-            Business: string;
-            Comment: string;
-            Culture: string;
-            Driving: string;
-            Focus: string;
-            Gardening: string;
-            Home: string;
-            Ireland: string;
-            Law: string;
-            Money: string;
-            News: string;
-            'News Review': string;
-            Puzzles: string;
-            Register: string;
-            'Saturday Review': string;
-            Scotland: string;
-            Sport: string;
-            Style: string;
-            'Tech & Games': string;
-            'The Dish': string;
-            'The Game': string;
-            'The Sunday Times Magazine': string;
-            'The Times Magazine': string;
-            Times2: string;
-            "Today's Magazines": string;
-            Travel: string;
-            Weekend: string;
-            World: string;
-            artsfeatures: string;
-            bricksmortar: string;
-            business: string;
-            comment: string;
-            culture: string;
-            default: string;
-            defcon: string;
-            driving: string;
-            focus: string;
-            gardening: string;
-            home: string;
-            ireland: string;
-            law: string;
-            money: string;
-            news: string;
-            newsreview: string;
-            puzzle: string;
-            register: string;
-            saturdayreview: string;
-            scotland: string;
-            sport: string;
-            style: string;
-            techgames: string;
-            thedish: string;
-            thegame: string;
-            thesundaytimesmagazine: string;
-            thetimesmagazine: string;
-            times2: string;
-            todaysmagazines: string;
-            travel: string;
-            weekend: string;
-            world: string;
-        };
-    };
-    fontFactory: ({ font, fontSize }: {
-        font: "body" | "headline" | "bodyRegular" | "bodyRegularSmallCaps" | "cultureMagazine" | "dropCap" | "headlineRegular" | "stMagazine" | "styleMagazine" | "supporting";
-        fontSize: "body" | "button" | "caption" | "link" | "meta" | "headline" | "articleHeadline" | "articleMeta" | "bodyMobile" | "cardHeadline" | "cardMeta" | "cardMetaMobile" | "commentsGuidelines" | "commentsHeadline" | "credits" | "imageOverlayTextSmall" | "infoTitle" | "keyFactsTitle" | "leadHeadline" | "newsletterPuffLabel" | "newsletterPuffHeadline" | "newsletterPuffCopy" | "pageComponentHeadline" | "pageHeadline" | "pageHeadlineLarge" | "pagingMeta" | "puffLink" | "secondary" | "sliceHeadline" | "smallestHeadline" | "smallHeadline" | "strapline" | "teaser" | "tertiary" | "tileLeadHeadline" | "heading2Mobile" | "heading3Mobile" | "heading4Mobile" | "heading5Mobile" | "infoSubText" | "heading2" | "heading3" | "heading4" | "heading5";
-    }) => {
-        fontFamily: string;
-        fontSize: number;
-        lineHeight: {};
-    };
-    fonts: {
-        body: string;
-        bodyRegular: string;
-        bodyRegularSmallCaps: string;
-        cultureMagazine: string;
-        dropCap: string;
-        headline: string;
-        headlineRegular: string;
-        stMagazine: string;
-        styleMagazine: string;
-        supporting: string;
-    };
-    fontSizes: {
-        articleHeadline: number;
-        articleMeta: number;
-        body: number;
-        bodyMobile: number;
-        button: number;
-        caption: number;
-        cardHeadline: number;
-        cardMeta: number;
-        cardMetaMobile: number;
-        commentsGuidelines: number;
-        commentsHeadline: number;
-        credits: number;
-        headline: number;
-        imageOverlayTextSmall: number;
-        infoTitle: number;
-        keyFactsTitle: number;
-        leadHeadline: number;
-        link: number;
-        meta: number;
-        newsletterPuffLabel: number;
-        newsletterPuffHeadline: number;
-        newsletterPuffCopy: number;
-        pageComponentHeadline: number;
-        pageHeadline: number;
-        pageHeadlineLarge: number;
-        pagingMeta: number;
-        puffLink: number;
-        secondary: number;
-        sliceHeadline: number;
-        smallestHeadline: number;
-        smallHeadline: number;
-        strapline: number;
-        teaser: number;
-        tertiary: number;
-        tileLeadHeadline: number;
-        heading2Mobile: number;
-        heading3Mobile: number;
-        heading4Mobile: number;
-        heading5Mobile: number;
-        infoSubText: number;
-        heading2: number;
-        heading3: number;
-        heading4: number;
-        heading5: number;
-    };
-    lineHeight: ({ font, fontSize }: {
-        font: string;
-        fontSize: string;
-    }) => {};
-    spacing: (multiple: number) => string;
-};
-export default _default;
-export { Animations, breakpoints, colours, editionBreakpoints, editionBreakpointWidths, editionMaxWidth, sliceContentMaxWidth, fontStyles as fonts, timesFontFactory as fontFactory, timesFontSizes as fontSizes, getEditionBreakpoint, lineHeight, scales, spacing, globalSpacingStyles, nativeTablet as tabletWidth, nativeTabletWide as tabletWidthMax, themeFactory };

package/dist/components/styleguide/Styleguide.js

@@ -1,24 +0,0 @@
-import 'react';
-import colours from './colours/colours';
-import Animations from './components/Animations';
-import breakpoints, { editionBreakpoints, editionMaxWidth, getEditionBreakpoint, editionBreakpointWidths, sliceContentMaxWidth } from './breakpoints';
-import lineHeight from './lineHeight';
-import { timesFontFactory, timesFontSizes, fontStyles } from './fonts/fonts';
-import themeFactory from './themeFactory';
-import scales from './scales';
-import spacing, { globalSpacingStyles } from './spacing';
-const { nativeTablet, nativeTabletWide } = breakpoints;
-export const tabletRowPadding = 20;
-export default () => {
-    return {
-        Animations,
-        colours,
-        fontFactory: timesFontFactory,
-        fonts: fontStyles,
-        fontSizes: timesFontSizes,
-        lineHeight,
-        spacing
-    };
-};
-export { Animations, breakpoints, colours, editionBreakpoints, editionBreakpointWidths, editionMaxWidth, sliceContentMaxWidth, fontStyles as fonts, timesFontFactory as fontFactory, timesFontSizes as fontSizes, getEditionBreakpoint, lineHeight, scales, spacing, globalSpacingStyles, nativeTablet as tabletWidth, nativeTabletWide as tabletWidthMax, themeFactory };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3R5bGVndWlkZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3N0eWxlZ3VpZGUvU3R5bGVndWlkZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxPQUFPLENBQUM7QUFDZixPQUFPLE9BQU8sTUFBTSxtQkFBbUIsQ0FBQztBQUN4QyxPQUFPLFVBQVUsTUFBTSx5QkFBeUIsQ0FBQztBQUVqRCxPQUFPLFdBQVcsRUFBRSxFQUNsQixrQkFBa0IsRUFDbEIsZUFBZSxFQUNmLG9CQUFvQixFQUNwQix1QkFBdUIsRUFDdkIsb0JBQW9CLEVBQ3JCLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sVUFBVSxNQUFNLGNBQWMsQ0FBQztBQUN0QyxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsY0FBYyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUM3RSxPQUFPLFlBQVksTUFBTSxnQkFBZ0IsQ0FBQztBQUUxQyxPQUFPLE1BQU0sTUFBTSxVQUFVLENBQUM7QUFDOUIsT0FBTyxPQUFPLEVBQUUsRUFBRSxtQkFBbUIsRUFBRSxNQUFNLFdBQVcsQ0FBQztBQUV6RCxNQUFNLEVBQUUsWUFBWSxFQUFFLGdCQUFnQixFQUFFLEdBQUcsV0FBVyxDQUFDO0FBRXZELE1BQU0sQ0FBQyxNQUFNLGdCQUFnQixHQUFHLEVBQUUsQ0FBQztBQUVuQyxlQUFlLEdBQUcsRUFBRTtJQUNsQixPQUFPO1FBQ0wsVUFBVTtRQUNWLE9BQU87UUFDUCxXQUFXLEVBQUUsZ0JBQWdCO1FBQzdCLEtBQUssRUFBRSxVQUFVO1FBQ2pCLFNBQVMsRUFBRSxjQUFjO1FBQ3pCLFVBQVU7UUFDVixPQUFPO0tBQ1IsQ0FBQztBQUNKLENBQUMsQ0FBQztBQUVGLE9BQU8sRUFDTCxVQUFVLEVBQ1YsV0FBVyxFQUNYLE9BQU8sRUFDUCxrQkFBa0IsRUFDbEIsdUJBQXVCLEVBQ3ZCLGVBQWUsRUFDZixvQkFBb0IsRUFDcEIsVUFBVSxJQUFJLEtBQUssRUFDbkIsZ0JBQWdCLElBQUksV0FBVyxFQUMvQixjQUFjLElBQUksU0FBUyxFQUMzQixvQkFBb0IsRUFDcEIsVUFBVSxFQUNWLE1BQU0sRUFDTixPQUFPLEVBQ1AsbUJBQW1CLEVBQ25CLFlBQVksSUFBSSxXQUFXLEVBQzNCLGdCQUFnQixJQUFJLGNBQWMsRUFDbEMsWUFBWSxFQUNiLENBQUMifQ==

package/dist/components/styleguide/__tests__/breakpoints.test.d.ts

@@ -1 +0,0 @@
-import '@testing-library/react';

package/dist/components/styleguide/__tests__/breakpoints.test.js

@@ -1,46 +0,0 @@
-import '@testing-library/react';
-import breakpoints, { editionBreakpointWidths, editionBreakpoints } from '../breakpoints';
-import { getEditionBreakpoint, sliceContentMaxWidth, editionMaxWidth, globalSpacingStyles, editionBreakpointWidths as styleguideEditionBreakpointWidths, editionBreakpoints as styleguideEditionBreakpoints } from '../Styleguide';
-describe('breakpoints', () => {
-    it('should return correct globalSpacingStyles value', () => {
-        expect(globalSpacingStyles).toEqual({
-            tabletHeadline: { marginBottom: 5 },
-            tabletTeaser: { marginTop: 5 }
-        });
-    });
-    it('should return correct sliceContentMaxWidth value', () => {
-        expect(sliceContentMaxWidth).toEqual(1180);
-    });
-    it('should return correct sliceContentMaxWidth value', () => {
-        expect(sliceContentMaxWidth).toEqual(1180);
-    });
-    it('should return correct editionBreakpointWidths value', () => {
-        expect(editionBreakpointWidths.wide).toEqual(1024);
-        expect(styleguideEditionBreakpointWidths.wide).toEqual(1024);
-    });
-    it('should return correct editionMaxWidth value', () => {
-        expect(editionMaxWidth).toEqual(1366);
-    });
-    it('should return correct breakpoint width value', () => {
-        expect(breakpoints.huge).toEqual(1320);
-    });
-    it('should retun correct editionBreakpoints value', () => {
-        expect(editionBreakpoints.huge).toEqual('huge');
-        expect(styleguideEditionBreakpoints.huge).toEqual('huge');
-    });
-    describe('getEditionBreakpoint()', () => {
-        it('should return correct getEditionBreakpoint value', () => {
-            expect(getEditionBreakpoint(600)).toEqual('small');
-        });
-        it('should return correct getEditionBreakpoint value', () => {
-            expect(getEditionBreakpoint(900)).toEqual('medium');
-        });
-        it('should return correct getEditionBreakpoint value', () => {
-            expect(getEditionBreakpoint(1100)).toEqual('wide');
-        });
-        it('should return correct getEditionBreakpoint value', () => {
-            expect(getEditionBreakpoint(1500)).toEqual('huge');
-        });
-    });
-});
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnJlYWtwb2ludHMudGVzdC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3N0eWxlZ3VpZGUvX190ZXN0c19fL2JyZWFrcG9pbnRzLnRlc3QudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyx3QkFBd0IsQ0FBQztBQUVoQyxPQUFPLFdBQVcsRUFBRSxFQUNsQix1QkFBdUIsRUFDdkIsa0JBQWtCLEVBQ25CLE1BQU0sZ0JBQWdCLENBQUM7QUFFeEIsT0FBTyxFQUNMLG9CQUFvQixFQUNwQixvQkFBb0IsRUFDcEIsZUFBZSxFQUNmLG1CQUFtQixFQUNuQix1QkFBdUIsSUFBSSxpQ0FBaUMsRUFDNUQsa0JBQWtCLElBQUksNEJBQTRCLEVBQ25ELE1BQU0sZUFBZSxDQUFDO0FBRXZCLFFBQVEsQ0FBQyxhQUFhLEVBQUUsR0FBRyxFQUFFO0lBQzNCLEVBQUUsQ0FBQyxpREFBaUQsRUFBRSxHQUFHLEVBQUU7UUFDekQsTUFBTSxDQUFDLG1CQUFtQixDQUFDLENBQUMsT0FBTyxDQUFDO1lBQ2xDLGNBQWMsRUFBRSxFQUFFLFlBQVksRUFBRSxDQUFDLEVBQUU7WUFDbkMsWUFBWSxFQUFFLEVBQUUsU0FBUyxFQUFFLENBQUMsRUFBRTtTQUMvQixDQUFDLENBQUM7SUFDTCxDQUFDLENBQUMsQ0FBQztJQUNILEVBQUUsQ0FBQyxrREFBa0QsRUFBRSxHQUFHLEVBQUU7UUFDMUQsTUFBTSxDQUFDLG9CQUFvQixDQUFDLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQzdDLENBQUMsQ0FBQyxDQUFDO0lBRUgsRUFBRSxDQUFDLGtEQUFrRCxFQUFFLEdBQUcsRUFBRTtRQUMxRCxNQUFNLENBQUMsb0JBQW9CLENBQUMsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDN0MsQ0FBQyxDQUFDLENBQUM7SUFFSCxFQUFFLENBQUMscURBQXFELEVBQUUsR0FBRyxFQUFFO1FBQzdELE1BQU0sQ0FBQyx1QkFBdUIsQ0FBQyxJQUFJLENBQUMsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDbkQsTUFBTSxDQUFDLGlDQUFpQyxDQUFDLElBQUksQ0FBQyxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUMvRCxDQUFDLENBQUMsQ0FBQztJQUVILEVBQUUsQ0FBQyw2Q0FBNkMsRUFBRSxHQUFHLEVBQUU7UUFDckQsTUFBTSxDQUFDLGVBQWUsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUN4QyxDQUFDLENBQUMsQ0FBQztJQUVILEVBQUUsQ0FBQyw4Q0FBOEMsRUFBRSxHQUFHLEVBQUU7UUFDdEQsTUFBTSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDekMsQ0FBQyxDQUFDLENBQUM7SUFFSCxFQUFFLENBQUMsK0NBQStDLEVBQUUsR0FBRyxFQUFFO1FBQ3ZELE1BQU0sQ0FBQyxrQkFBa0IsQ0FBQyxJQUFJLENBQUMsQ0FBQyxPQUFPLENBQUMsTUFBTSxDQUFDLENBQUM7UUFDaEQsTUFBTSxDQUFDLDRCQUE0QixDQUFDLElBQUksQ0FBQyxDQUFDLE9BQU8sQ0FBQyxNQUFNLENBQUMsQ0FBQztJQUM1RCxDQUFDLENBQUMsQ0FBQztJQUVILFFBQVEsQ0FBQyx3QkFBd0IsRUFBRSxHQUFHLEVBQUU7UUFDdEMsRUFBRSxDQUFDLGtEQUFrRCxFQUFFLEdBQUcsRUFBRTtZQUMxRCxNQUFNLENBQUMsb0JBQW9CLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDckQsQ0FBQyxDQUFDLENBQUM7UUFFSCxFQUFFLENBQUMsa0RBQWtELEVBQUUsR0FBRyxFQUFFO1lBQzFELE1BQU0sQ0FBQyxvQkFBb0IsQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsQ0FBQztRQUN0RCxDQUFDLENBQUMsQ0FBQztRQUVILEVBQUUsQ0FBQyxrREFBa0QsRUFBRSxHQUFHLEVBQUU7WUFDMUQsTUFBTSxDQUFDLG9CQUFvQixDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDLE1BQU0sQ0FBQyxDQUFDO1FBQ3JELENBQUMsQ0FBQyxDQUFDO1FBRUgsRUFBRSxDQUFDLGtEQUFrRCxFQUFFLEdBQUcsRUFBRTtZQUMxRCxNQUFNLENBQUMsb0JBQW9CLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUMsTUFBTSxDQUFDLENBQUM7UUFDckQsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDLENBQUMsQ0FBQztBQUNMLENBQUMsQ0FBQyxDQUFDIn0=