{ "version": 3, "sources": ["../javascripts/helpers/articles.ts", "../javascripts/styled-components/components/ArticleCard/index.tsx", "../javascripts/utils/ts/date.ts", "../javascripts/styled-components/components/ArticleCard/wrappers.ts", "../javascripts/utils/readTime.ts"], "sourcesContent": ["import type { Article } from '../@types/ArticleV2';\nimport { resolveArticlesRoute } from '../routes/utils';\n\nexport const getArticleUrl = (article: Article) => {\n return `/${resolveArticlesRoute()}/${article.categories[0].slug}/${article.slug}`;\n};\n", "import React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { dateMonthYear } from '../../../utils/ts/date';\nimport { IconPlay } from '../Icon';\nimport {\n AuthorImage,\n AuthorName,\n AuthorRow,\n CardBody,\n Category,\n Excerpt,\n Eyebrow,\n Image,\n ImageContainer,\n TimeRow,\n Title,\n VideoIcon,\n Wrapper,\n} from './wrappers';\n\ninterface IArticleCard {\n author?: {\n image: string;\n image2x?: string;\n name: string;\n };\n backplate?: boolean;\n category: string;\n date?: string;\n excerpt: string;\n eyebrow?: string;\n image?: string;\n readTime?: number;\n title: string;\n layout?: 'large' | 'medium' | 'small' | 'stacked';\n mirrored?: boolean;\n link: string;\n videoIcon?: boolean;\n}\n\nconst ArticleCard = ({\n author,\n backplate,\n category,\n date,\n excerpt,\n eyebrow,\n image,\n layout = 'stacked',\n link,\n mirrored,\n readTime,\n title,\n videoIcon,\n}: IArticleCard) => {\n const { t } = useTranslation();\n\n return (\n <Wrapper $layout={layout} $mirrored={mirrored} $backplate={backplate}>\n <ImageContainer>\n {videoIcon && (\n <VideoIcon>\n <IconPlay />\n </VideoIcon>\n )}\n <Image src={image} alt={title} />\n </ImageContainer>\n <CardBody>\n {eyebrow && <Eyebrow>{eyebrow}</Eyebrow>}\n <Category>{category}</Category>\n <Title to={link} title={title}>\n {title}\n </Title>\n <Excerpt>{excerpt}</Excerpt>\n {(readTime || date) && (\n <TimeRow>\n {readTime && <div>{t('readTime', { ns: 'article', readTime })}</div>}\n {date && <div>{dateMonthYear(date)}</div>}\n </TimeRow>\n )}\n {author && (\n <AuthorRow>\n {author.image && (\n <AuthorImage src={author.image} srcSet={author.image2x} alt={author.name} />\n )}\n <AuthorName>{author.name}</AuthorName>\n </AuthorRow>\n )}\n </CardBody>\n </Wrapper>\n );\n};\n\nexport default ArticleCard;\n", "import { format } from 'date-fns';\nimport { nb, sv } from 'date-fns/locale';\nimport { getMarket } from '../../i18n';\n\nconst resolveLocale = () => {\n const marketCode = getMarket().marketCode;\n switch (marketCode) {\n case 'NO':\n return nb;\n default:\n return sv;\n }\n};\n\nexport const dayMonth = (date: string | Date) =>\n format(new Date(date), 'd MMMM', { locale: resolveLocale() });\n\nexport const dateMonthYear = (date: string | Date) =>\n format(new Date(date), 'd MMMM y', { locale: resolveLocale() });\n\nexport const dayMonthYear = (date: string | Date) =>\n format(new Date(date), 'EEEE d MMMM y', { locale: resolveLocale() });\n", "import styled, { css } from 'styled-components';\nimport { size } from '../../layout/helpers';\nimport { RouterLink } from '../Link';\n\nexport const CardBody = styled.div.withConfig({ componentId: 'sc-124l8s8-0' })`\n display: flex;\n flex-direction: column;\n gap: ${size(1)};\n flex: 1 1 auto;\n min-width: 0;\n width: 100%;\n`;\n\nexport const ImageContainer = styled.div.withConfig({ componentId: 'sc-124l8s8-1' })`\n position: relative;\n flex: 0 0 auto;\n aspect-ratio: 343 / 199;\n width: 100%;\n background: var(--c-bg-alt);\n\n ${({ theme }) => theme.breakpoint.Md} {\n aspect-ratio: 417 / 234;\n }\n`;\n\nexport const VideoIcon = styled.div.withConfig({ componentId: 'sc-124l8s8-2' })`\n --_size: ${size(7)};\n --_icon-size: ${size(3)};\n\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n display: flex;\n align-items: center;\n justify-content: center;\n width: var(--_size);\n height: var(--_size);\n border-radius: 50%;\n background-color: var(--c-primary-bg);\n color: var(--c-primary-fg);\n font-size: var(--_icon-size);\n`;\n\nexport const Image = styled.img.withConfig({ componentId: 'sc-124l8s8-3' })`\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n`;\n\nexport const Eyebrow = styled.div.withConfig({ componentId: 'sc-124l8s8-4' })`\n font-weight: var(--font-weight-bold);\n font-size: var(--font-size-xsmall);\n letter-spacing: 0.15em;\n text-transform: uppercase;\n opacity: 0.8;\n`;\n\nexport const Excerpt = styled.p.withConfig({ componentId: 'sc-124l8s8-5' })`\n margin: 0;\n`;\n\nexport const Category = styled.div.withConfig({ componentId: 'sc-124l8s8-6' })`\n font-size: var(--font-size-small);\n font-weight: var(--font-weight-bold);\n color: var(--c-secondary-fg);\n`;\n\nexport const Title = styled(RouterLink).withConfig({ componentId: 'sc-124l8s8-7' })`\n margin: 0;\n color: var(--c-text-dark);\n font-weight: var(--font-weight-bold);\n\n &::before {\n content: \"\";\n position: absolute;\n inset: 0;\n }\n`;\n\nexport const TimeRow = styled.div.withConfig({ componentId: 'sc-124l8s8-8' })`\n display: flex;\n gap: ${size(3)};\n font-size: var(--font-size-small);\n margin-top: ${size(1)};\n color: var(--c-text-muted);\n\n > * + * {\n position: relative;\n\n &:before {\n content: \"\";\n position: absolute;\n top: calc(50% - ${size(0.25)});\n left: ${size(-1.75)};\n height: ${size(0.5)};\n width: ${size(0.5)};\n border-radius: ${size(0.5)};\n background: var(--c-text-muted);\n }\n }\n`;\n\nexport const AuthorRow = styled.div.withConfig({ componentId: 'sc-124l8s8-9' })`\n display: flex;\n gap: ${size(1)};\n align-items: center;\n margin-top: ${size(1)};\n`;\n\nexport const AuthorImage = styled.img.withConfig({ componentId: 'sc-124l8s8-10' })`\n border-radius: 50%;\n width: ${size(4)};\n height: ${size(4)};\n`;\n\nexport const AuthorName = styled.div.withConfig({ componentId: 'sc-124l8s8-11' })`\n font-size: var(--font-size-small);\n font-weight: var(--font-weight-medium);\n color: var(--c-text-dark);\n`;\n\ninterface IArticleCardWrapper {\n $layout: 'large' | 'medium' | 'small' | 'stacked';\n $mirrored?: boolean;\n $backplate?: boolean;\n}\n\nexport const Wrapper = styled.div.withConfig({ componentId: 'sc-124l8s8-12' })<IArticleCardWrapper>`\n position: relative;\n display: flex;\n flex-direction: column;\n gap: ${size(2)};\n align-items: center;\n\n ${({ $layout }: IArticleCardWrapper) =>\n $layout === 'large' &&\n css`\n ${Title} {\n font-size: var(--font-size-h2);\n line-height: var(--line-height-h2);\n }\n `}\n\n ${({ $layout }: IArticleCardWrapper) =>\n $layout === 'small' &&\n css`\n flex-direction: row;\n\n ${ImageContainer} {\n width: ${size(11)};\n aspect-ratio: 1 / 1;\n }\n\n ${TimeRow} {\n margin-top: 0;\n }\n `}\n\n ${({ $layout }: IArticleCardWrapper) =>\n $layout === 'stacked' &&\n css`\n align-items: flex-start;\n\n ${ImageContainer} {\n width: 100%;\n }\n `}\n\n ${({ theme }) => theme.breakpoint.LtMd} {\n ${({ $layout }: IArticleCardWrapper) =>\n $layout === 'small' &&\n css`\n ${Excerpt} {\n display: none;\n }\n `}\n ${({ $layout }: IArticleCardWrapper) =>\n ($layout === 'large' || $layout === 'medium') &&\n css`\n ${ImageContainer} {\n width: 100%;\n }\n `}\n }\n\n ${({ theme }) => theme.breakpoint.Md} {\n ${({ $layout }: IArticleCardWrapper) =>\n $layout === 'large' &&\n css`\n gap: ${size(5)};\n flex-direction: row;\n\n ${ImageContainer} {\n aspect-ratio: 632 / 460;\n width: calc(50% - ${size(2.5)});\n }\n\n ${CardBody} {\n padding: ${size(1)} ${size(5)} ${size(1)} 0;\n }\n `}\n\n ${({ $layout }: IArticleCardWrapper) =>\n $layout === 'medium' &&\n css`\n flex-direction: row;\n\n ${ImageContainer} {\n max-width: 416px;\n }\n `}\n\n ${({ $layout }: IArticleCardWrapper) =>\n $layout === 'small' &&\n css`\n ${ImageContainer} {\n width: ${size(18)};\n }\n\n ${Excerpt} {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n `}\n }\n\n ${({ $mirrored, $layout }: IArticleCardWrapper) =>\n $mirrored && $layout !== 'medium'\n ? css`\n ${ImageContainer} {\n order: 2;\n }\n `\n : $mirrored\n ? css`\n ${({ theme }) => theme.breakpoint.Md} {\n ${ImageContainer} {\n order: 2;\n }\n }\n `\n : undefined}\n\n ${({ $backplate }: IArticleCardWrapper) =>\n $backplate &&\n css`\n background: var(--c-secondary-bg);\n\n ${({ theme }) => theme.breakpoint.LtMd} {\n ${CardBody} {\n padding: ${size(2)};\n }\n }\n `}\n`;\n", "export const readTime = (text: string) => {\n const wpm = 265;\n const words = text.trim().split(/\\s+/).length;\n const time = Math.ceil(words / wpm);\n return time;\n};\n"], "mappings": "2ZAGO,IAAMA,EAAiBC,GACrB,IAAIC,EAAqB,CAAC,IAAID,EAAQ,WAAW,CAAC,EAAE,IAAI,IAAIA,EAAQ,IAAI,GCJjF,IAAAE,EAAkB,SCIlB,IAAMC,EAAgB,IAAM,CAE1B,OADmBC,EAAU,EAAE,WACX,CAClB,IAAK,KACH,OAAOC,EACT,QACE,OAAOC,CACX,CACF,EAKO,IAAMC,EAAiBC,GAC5BC,EAAO,IAAI,KAAKD,CAAI,EAAG,WAAY,CAAE,OAAQE,EAAc,CAAE,CAAC,EAEnDC,EAAgBH,GAC3BC,EAAO,IAAI,KAAKD,CAAI,EAAG,gBAAiB,CAAE,OAAQE,EAAc,CAAE,CAAC,ECjB9D,IAAME,EAAWC,EAAO,IAAI,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA;AAAA;AAAA,WAGlEC,EAAK,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA,EAMLC,EAAiBF,EAAO,IAAI,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAO7E,CAAC,CAAE,MAAAG,CAAM,IAAMA,EAAM,WAAW,EAAE;AAAA;AAAA;AAAA,EAK3BC,EAAYJ,EAAO,IAAI,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA,eAC/DC,EAAK,CAAC,CAAC;AAAA,oBACFA,EAAK,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAiBdI,EAAQL,EAAO,IAAI,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,EAO7DM,EAAUN,EAAO,IAAI,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQ/DO,EAAUP,EAAO,EAAE,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA;AAAA,EAI7DQ,EAAWR,EAAO,IAAI,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA;AAAA;AAAA;AAAA,EAMhES,EAAQT,EAAOU,CAAU,EAAE,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYrEC,EAAUX,EAAO,IAAI,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA;AAAA,WAEjEC,EAAK,CAAC,CAAC;AAAA;AAAA,kBAEAA,EAAK,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,8BASKA,EAAK,GAAI,CAAC;AAAA,oBACpBA,EAAK,KAAK,CAAC;AAAA,sBACTA,EAAK,EAAG,CAAC;AAAA,qBACVA,EAAK,EAAG,CAAC;AAAA,6BACDA,EAAK,EAAG,CAAC;AAAA;AAAA;AAAA;AAAA,EAMzBW,EAAYZ,EAAO,IAAI,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA;AAAA,WAEnEC,EAAK,CAAC,CAAC;AAAA;AAAA,kBAEAA,EAAK,CAAC,CAAC;AAAA,EAGZY,EAAcb,EAAO,IAAI,WAAW,CAAE,YAAa,eAAgB,CAAC;AAAA;AAAA,aAEpEC,EAAK,CAAC,CAAC;AAAA,cACNA,EAAK,CAAC,CAAC;AAAA,EAGRa,EAAad,EAAO,IAAI,WAAW,CAAE,YAAa,eAAgB,CAAC;AAAA;AAAA;AAAA;AAAA,EAYnEe,EAAUf,EAAO,IAAI,WAAW,CAAE,YAAa,eAAgB,CAAC;AAAA;AAAA;AAAA;AAAA,WAIlEC,EAAK,CAAC,CAAC;AAAA;AAAA;AAAA,MAGZ,CAAC,CAAE,QAAAe,CAAQ,IACXA,IAAY,SACZC;AAAA,cACQR,CAAK;AAAA;AAAA;AAAA;AAAA,SAIV;AAAA;AAAA,MAEH,CAAC,CAAE,QAAAO,CAAQ,IACXA,IAAY,SACZC;AAAA;AAAA;AAAA,cAGQf,CAAc;AAAA,yBACHD,EAAK,EAAE,CAAC;AAAA;AAAA;AAAA;AAAA,cAInBU,CAAO;AAAA;AAAA;AAAA,SAGZ;AAAA;AAAA,MAEH,CAAC,CAAE,QAAAK,CAAQ,IACXA,IAAY,WACZC;AAAA;AAAA;AAAA,cAGQf,CAAc;AAAA;AAAA;AAAA,SAGnB;AAAA;AAAA,MAEH,CAAC,CAAE,MAAAC,CAAM,IAAMA,EAAM,WAAW,IAAI;AAAA,UAChC,CAAC,CAAE,QAAAa,CAAQ,IACXA,IAAY,SACZC;AAAA,kBACQV,CAAO;AAAA;AAAA;AAAA,aAGZ;AAAA,UACH,CAAC,CAAE,QAAAS,CAAQ,KACVA,IAAY,SAAWA,IAAY,WACpCC;AAAA,kBACQf,CAAc;AAAA;AAAA;AAAA,aAGnB;AAAA;AAAA;AAAA,MAGP,CAAC,CAAE,MAAAC,CAAM,IAAMA,EAAM,WAAW,EAAE;AAAA,UAC9B,CAAC,CAAE,QAAAa,CAAQ,IACXA,IAAY,SACZC;AAAA,uBACahB,EAAK,CAAC,CAAC;AAAA;AAAA;AAAA,kBAGZC,CAAc;AAAA;AAAA,wCAEQD,EAAK,GAAG,CAAC;AAAA;AAAA;AAAA,kBAG/BF,CAAQ;AAAA,+BACKE,EAAK,CAAC,CAAC,IAAIA,EAAK,CAAC,CAAC,IAAIA,EAAK,CAAC,CAAC;AAAA;AAAA,aAE/C;AAAA;AAAA,UAEH,CAAC,CAAE,QAAAe,CAAQ,IACXA,IAAY,UACZC;AAAA;AAAA;AAAA,kBAGQf,CAAc;AAAA;AAAA;AAAA,aAGnB;AAAA;AAAA,UAEH,CAAC,CAAE,QAAAc,CAAQ,IACXA,IAAY,SACZC;AAAA,kBACQf,CAAc;AAAA,6BACHD,EAAK,EAAE,CAAC;AAAA;AAAA;AAAA,kBAGnBM,CAAO;AAAA;AAAA;AAAA;AAAA;AAAA,aAKZ;AAAA;AAAA;AAAA,MAGP,CAAC,CAAE,UAAAW,EAAW,QAAAF,CAAQ,IACtBE,GAAaF,IAAY,SACrBC;AAAA,oBACUf,CAAc;AAAA;AAAA;AAAA,gBAIxBgB,EACED;AAAA,oBACQ,CAAC,CAAE,MAAAd,CAAM,IAAMA,EAAM,WAAW,EAAE;AAAA,wBAC9BD,CAAc;AAAA;AAAA;AAAA;AAAA,gBAK1B,MAAS;AAAA;AAAA,MAEf,CAAC,CAAE,WAAAiB,CAAW,IACdA,GACAF;AAAA;AAAA;AAAA,cAGQ,CAAC,CAAE,MAAAd,CAAM,IAAMA,EAAM,WAAW,IAAI;AAAA,kBAChCJ,CAAQ;AAAA,+BACKE,EAAK,CAAC,CAAC;AAAA;AAAA;AAAA,SAG7B;EFxNT,IAAMmB,EAAc,CAAC,CACnB,OAAAC,EACA,UAAAC,EACA,SAAAC,EACA,KAAAC,EACA,QAAAC,EACA,QAAAC,EACA,MAAAC,EACA,OAAAC,EAAS,UACT,KAAAC,EACA,SAAAC,EACA,SAAAC,EACA,MAAAC,EACA,UAAAC,CACF,IAAoB,CAClB,GAAM,CAAE,EAAAC,CAAE,EAAIC,EAAe,EAE7B,OACE,EAAAC,QAAA,cAACC,EAAA,CAAQ,QAAST,EAAQ,UAAWE,EAAU,WAAYR,GACzD,EAAAc,QAAA,cAACE,EAAA,KACEL,GACC,EAAAG,QAAA,cAACG,EAAA,KACC,EAAAH,QAAA,cAACI,EAAA,IAAS,CACZ,EAEF,EAAAJ,QAAA,cAACK,EAAA,CAAM,IAAKd,EAAO,IAAKK,EAAO,CACjC,EACA,EAAAI,QAAA,cAACM,EAAA,KACEhB,GAAW,EAAAU,QAAA,cAACO,EAAA,KAASjB,CAAQ,EAC9B,EAAAU,QAAA,cAACQ,EAAA,KAAUrB,CAAS,EACpB,EAAAa,QAAA,cAACS,EAAA,CAAM,GAAIhB,EAAM,MAAOG,GACrBA,CACH,EACA,EAAAI,QAAA,cAACU,EAAA,KAASrB,CAAQ,GAChBM,GAAYP,IACZ,EAAAY,QAAA,cAACW,EAAA,KACEhB,GAAY,EAAAK,QAAA,cAAC,WAAKF,EAAE,WAAY,CAAE,GAAI,UAAW,SAAAH,CAAS,CAAC,CAAE,EAC7DP,GAAQ,EAAAY,QAAA,cAAC,WAAKY,EAAcxB,CAAI,CAAE,CACrC,EAEDH,GACC,EAAAe,QAAA,cAACa,EAAA,KACE5B,EAAO,OACN,EAAAe,QAAA,cAACc,EAAA,CAAY,IAAK7B,EAAO,MAAO,OAAQA,EAAO,QAAS,IAAKA,EAAO,KAAM,EAE5E,EAAAe,QAAA,cAACe,EAAA,KAAY9B,EAAO,IAAK,CAC3B,CAEJ,CACF,CAEJ,EAEO+B,GAAQhC,EG7FR,IAAMiC,GAAYC,GAAiB,CAExC,IAAMC,EAAQD,EAAK,KAAK,EAAE,MAAM,KAAK,EAAE,OAEvC,OADa,KAAK,KAAKC,EAAQ,GAAG,CAEpC", "names": ["getArticleUrl", "article", "resolveArticlesRoute", "import_react", "resolveLocale", "getMarket", "nb", "sv", "dateMonthYear", "date", "format", "resolveLocale", "dayMonthYear", "CardBody", "dt", "size", "ImageContainer", "theme", "VideoIcon", "Image", "Eyebrow", "Excerpt", "Category", "Title", "RouterLink", "TimeRow", "AuthorRow", "AuthorImage", "AuthorName", "Wrapper", "$layout", "lt", "$mirrored", "$backplate", "ArticleCard", "author", "backplate", "category", "date", "excerpt", "eyebrow", "image", "layout", "link", "mirrored", "readTime", "title", "videoIcon", "t", "useTranslation", "React", "Wrapper", "ImageContainer", "VideoIcon", "IconPlay", "Image", "CardBody", "Eyebrow", "Category", "Title", "Excerpt", "TimeRow", "dateMonthYear", "AuthorRow", "AuthorImage", "AuthorName", "ArticleCard_default", "readTime", "text", "words"] }