@ndla/ui 56.0.141-alpha.0 → 56.0.143-alpha.0

package/lib/Concept/Concept.js

@@ -1,15 +1,19 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_LicenseByline_EmbedByline = require('../LicenseByline/EmbedByline.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_utils_licenseAttributes = require('../utils/licenseAttributes.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_ImageEmbed = require('../Embed/ImageEmbed.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_H5pEmbed = require('../Embed/H5pEmbed.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_ExternalEmbed = require('../Embed/ExternalEmbed.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_IframeEmbed = require('../Embed/IframeEmbed.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_BrightcoveEmbed = require('../Embed/BrightcoveEmbed.js');
-const react = require_rolldown_runtime.__toESM(require("react"));
-const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
-const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
-const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
+const require_EmbedByline = require('../LicenseByline/EmbedByline.js');
+const require_licenseAttributes = require('../utils/licenseAttributes.js');
+const require_BrightcoveEmbed = require('../Embed/BrightcoveEmbed.js');
+const require_ExternalEmbed = require('../Embed/ExternalEmbed.js');
+const require_H5pEmbed = require('../Embed/H5pEmbed.js');
+const require_IframeEmbed = require('../Embed/IframeEmbed.js');
+const require_ImageEmbed = require('../Embed/ImageEmbed.js');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let __ndla_primitives = require("@ndla/primitives");
+__ndla_primitives = require_rolldown_runtime.__toESM(__ndla_primitives);
+let __ndla_styled_system_jsx = require("@ndla/styled-system/jsx");
+__ndla_styled_system_jsx = require_rolldown_runtime.__toESM(__ndla_styled_system_jsx);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 
 //#region src/Concept/Concept.tsx
 const StyledFigure = (0, __ndla_styled_system_jsx.styled)(__ndla_primitives.Figure, { base: {
@@ -23,7 +27,7 @@ const ContentWrapper = (0, __ndla_styled_system_jsx.styled)("div", { base: {
 	"& p": { display: "inline" }
 } });
 const Concept = (0, react.forwardRef)(({ copyright, visualElement, lang, children, title, source, previewAlt,...rest }, ref) => {
-	const licenseProps = require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_utils_licenseAttributes.licenseAttributes(copyright?.license?.license, lang, source);
+	const licenseProps = require_licenseAttributes.licenseAttributes(copyright?.license?.license, lang, source);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(StyledFigure, {
 		ref,
 		...rest,
@@ -33,12 +37,12 @@ const Concept = (0, react.forwardRef)(({ copyright, visualElement, lang, childre
 				lang,
 				children: [!!title && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("b", { children: title }), ` – `] }), children]
 			}),
-			visualElement?.resource === "image" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_ImageEmbed.ImageEmbed_default, {
+			visualElement?.resource === "image" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ImageEmbed.default, {
 				embed: visualElement,
 				lang,
 				previewAlt
-			}) : visualElement?.resource === "brightcove" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_BrightcoveEmbed.BrightcoveEmbed_default, { embed: visualElement }) : visualElement?.resource === "h5p" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_H5pEmbed.H5pEmbed_default, { embed: visualElement }) : visualElement?.resource === "iframe" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_IframeEmbed.IframeEmbed_default, { embed: visualElement }) : visualElement?.resource === "external" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_ExternalEmbed.ExternalEmbed_default, { embed: visualElement }) : null,
-			!!copyright && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_LicenseByline_EmbedByline.EmbedByline, {
+			}) : visualElement?.resource === "brightcove" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_BrightcoveEmbed.default, { embed: visualElement }) : visualElement?.resource === "h5p" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_H5pEmbed.default, { embed: visualElement }) : visualElement?.resource === "iframe" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_IframeEmbed.default, { embed: visualElement }) : visualElement?.resource === "external" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ExternalEmbed.default, { embed: visualElement }) : null,
+			!!copyright && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EmbedByline.EmbedByline, {
 				copyright,
 				type: "concept"
 			})

package/lib/Concept/Concept.js.map

@@ -1 +1 @@
-{"version":3,"file":"Concept.js","names":["Figure","ImageEmbed","BrightcoveEmbed","H5pEmbed","IframeEmbed","ExternalEmbed","EmbedByline"],"sources":["../../src/Concept/Concept.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { type ComponentPropsWithRef, type ReactNode, forwardRef } from \"react\";\nimport { Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { IDraftCopyrightDTO as ConceptCopyright } from \"@ndla/types-backend/concept-api\";\nimport type { ConceptVisualElementMeta } from \"@ndla/types-embed\";\nimport { BrightcoveEmbed, ExternalEmbed, H5pEmbed, IframeEmbed, ImageEmbed } from \"../Embed\";\nimport { EmbedByline } from \"../LicenseByline/EmbedByline\";\nimport { licenseAttributes } from \"../utils/licenseAttributes\";\n\nexport interface ConceptProps extends Omit<ComponentPropsWithRef<\"figure\">, \"title\"> {\n  copyright?: ConceptCopyright;\n  visualElement?: ConceptVisualElementMeta;\n  lang?: string;\n  title?: ReactNode;\n  children?: ReactNode;\n  source?: string;\n  previewAlt?: boolean;\n}\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: \"medium\",\n  },\n});\n\nconst ContentWrapper = styled(\"div\", {\n  base: {\n    textStyle: \"body.large\",\n    display: \"inline\",\n    \"& p\": {\n      display: \"inline\",\n    },\n  },\n});\n\nexport const Concept = forwardRef<HTMLElement, ConceptProps>(\n  ({ copyright, visualElement, lang, children, title, source, previewAlt, ...rest }, ref) => {\n    const licenseProps = licenseAttributes(copyright?.license?.license, lang, source);\n\n    return (\n      <StyledFigure ref={ref} {...rest} {...licenseProps}>\n        <ContentWrapper lang={lang}>\n          {!!title && (\n            <>\n              <b>{title}</b>\n              {` – `}\n            </>\n          )}\n          {children}\n        </ContentWrapper>\n        {visualElement?.resource === \"image\" ? (\n          <ImageEmbed embed={visualElement} lang={lang} previewAlt={previewAlt} />\n        ) : visualElement?.resource === \"brightcove\" ? (\n          <BrightcoveEmbed embed={visualElement} />\n        ) : visualElement?.resource === \"h5p\" ? (\n          <H5pEmbed embed={visualElement} />\n        ) : visualElement?.resource === \"iframe\" ? (\n          <IframeEmbed embed={visualElement} />\n        ) : visualElement?.resource === \"external\" ? (\n          <ExternalEmbed embed={visualElement} />\n        ) : null}\n        {!!copyright && <EmbedByline copyright={copyright} type=\"concept\" />}\n      </StyledFigure>\n    );\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;AA2BA,MAAM,eAAe,qCAAOA,0BAAQ,EAClC,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;AACN,EACF,EAAC;AAEF,MAAM,iBAAiB,qCAAO,OAAO,EACnC,MAAM;CACJ,WAAW;CACX,SAAS;CACT,OAAO,EACL,SAAS,SACV;AACF,EACF,EAAC;AAEF,MAAa,UAAU,sBACrB,CAAC,EAAE,WAAW,eAAe,MAAM,UAAU,OAAO,QAAQ,WAAY,GAAG,MAAM,EAAE,QAAQ;CACzF,MAAM,eAAe,8GAAkB,WAAW,SAAS,SAAS,MAAM,OAAO;AAEjF,wBACE,4BAAC;EAAkB;EAAK,GAAI;EAAM,GAAI;;mBACpC,4BAAC;IAAqB;iBACjB,yBACD,qFACE,2BAAC,iBAAG,QAAU,GACZ,QACD,EAEJ;KACc;GAChB,eAAe,aAAa,0BAC3B,2BAACC;IAAW,OAAO;IAAqB;IAAkB;KAAc,GACtE,eAAe,aAAa,+BAC9B,2BAACC,qHAAgB,OAAO,gBAAiB,GACvC,eAAe,aAAa,wBAC9B,2BAACC,uGAAS,OAAO,gBAAiB,GAChC,eAAe,aAAa,2BAC9B,2BAACC,6GAAY,OAAO,gBAAiB,GACnC,eAAe,aAAa,6BAC9B,2BAACC,iHAAc,OAAO,gBAAiB,GACrC;KACD,6BAAa,2BAACC;IAAuB;IAAW,MAAK;KAAY;;GACvD;AAElB,EACF"}
+{"version":3,"file":"Concept.js","names":["Figure","licenseAttributes","ImageEmbed","BrightcoveEmbed","H5pEmbed","IframeEmbed","ExternalEmbed","EmbedByline"],"sources":["../../src/Concept/Concept.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { type ComponentPropsWithRef, type ReactNode, forwardRef } from \"react\";\nimport { Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { IDraftCopyrightDTO as ConceptCopyright } from \"@ndla/types-backend/concept-api\";\nimport type { ConceptVisualElementMeta } from \"@ndla/types-embed\";\nimport BrightcoveEmbed from \"../Embed/BrightcoveEmbed\";\nimport ExternalEmbed from \"../Embed/ExternalEmbed\";\nimport H5pEmbed from \"../Embed/H5pEmbed\";\nimport IframeEmbed from \"../Embed/IframeEmbed\";\nimport ImageEmbed from \"../Embed/ImageEmbed\";\nimport { EmbedByline } from \"../LicenseByline/EmbedByline\";\nimport { licenseAttributes } from \"../utils/licenseAttributes\";\n\nexport interface ConceptProps extends Omit<ComponentPropsWithRef<\"figure\">, \"title\"> {\n  copyright?: ConceptCopyright;\n  visualElement?: ConceptVisualElementMeta;\n  lang?: string;\n  title?: ReactNode;\n  children?: ReactNode;\n  source?: string;\n  previewAlt?: boolean;\n}\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: \"medium\",\n  },\n});\n\nconst ContentWrapper = styled(\"div\", {\n  base: {\n    textStyle: \"body.large\",\n    display: \"inline\",\n    \"& p\": {\n      display: \"inline\",\n    },\n  },\n});\n\nexport const Concept = forwardRef<HTMLElement, ConceptProps>(\n  ({ copyright, visualElement, lang, children, title, source, previewAlt, ...rest }, ref) => {\n    const licenseProps = licenseAttributes(copyright?.license?.license, lang, source);\n\n    return (\n      <StyledFigure ref={ref} {...rest} {...licenseProps}>\n        <ContentWrapper lang={lang}>\n          {!!title && (\n            <>\n              <b>{title}</b>\n              {` – `}\n            </>\n          )}\n          {children}\n        </ContentWrapper>\n        {visualElement?.resource === \"image\" ? (\n          <ImageEmbed embed={visualElement} lang={lang} previewAlt={previewAlt} />\n        ) : visualElement?.resource === \"brightcove\" ? (\n          <BrightcoveEmbed embed={visualElement} />\n        ) : visualElement?.resource === \"h5p\" ? (\n          <H5pEmbed embed={visualElement} />\n        ) : visualElement?.resource === \"iframe\" ? (\n          <IframeEmbed embed={visualElement} />\n        ) : visualElement?.resource === \"external\" ? (\n          <ExternalEmbed embed={visualElement} />\n        ) : null}\n        {!!copyright && <EmbedByline copyright={copyright} type=\"concept\" />}\n      </StyledFigure>\n    );\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;AA+BA,MAAM,oDAAsBA,0BAAQ,EAClC,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACN,EACF,CAAC;AAEF,MAAM,sDAAwB,OAAO,EACnC,MAAM;CACJ,WAAW;CACX,SAAS;CACT,OAAO,EACL,SAAS,UACV;CACF,EACF,CAAC;AAEF,MAAa,iCACV,EAAE,WAAW,eAAe,MAAM,UAAU,OAAO,QAAQ,WAAY,GAAG,QAAQ,QAAQ;CACzF,MAAM,eAAeC,4CAAkB,WAAW,SAAS,SAAS,MAAM,OAAO;AAEjF,QACE,4CAAC;EAAkB;EAAK,GAAI;EAAM,GAAI;;GACpC,4CAAC;IAAqB;eACnB,CAAC,CAAC,SACD,qFACE,2CAAC,iBAAG,QAAU,EACb,SACA,EAEJ;KACc;GAChB,eAAe,aAAa,UAC3B,2CAACC;IAAW,OAAO;IAAqB;IAAkB;KAAc,GACtE,eAAe,aAAa,eAC9B,2CAACC,mCAAgB,OAAO,gBAAiB,GACvC,eAAe,aAAa,QAC9B,2CAACC,4BAAS,OAAO,gBAAiB,GAChC,eAAe,aAAa,WAC9B,2CAACC,+BAAY,OAAO,gBAAiB,GACnC,eAAe,aAAa,aAC9B,2CAACC,iCAAc,OAAO,gBAAiB,GACrC;GACH,CAAC,CAAC,aAAa,2CAACC;IAAuB;IAAW,MAAK;KAAY;;GACvD;EAGpB"}

package/lib/ContactBlock/ContactBlock.js

@@ -1,9 +1,13 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_LicenseByline_EmbedByline = require('../LicenseByline/EmbedByline.js');
-const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
-const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
-const react_i18next = require_rolldown_runtime.__toESM(require("react-i18next"));
-const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
+const require_EmbedByline = require('../LicenseByline/EmbedByline.js');
+let __ndla_primitives = require("@ndla/primitives");
+__ndla_primitives = require_rolldown_runtime.__toESM(__ndla_primitives);
+let __ndla_styled_system_jsx = require("@ndla/styled-system/jsx");
+__ndla_styled_system_jsx = require_rolldown_runtime.__toESM(__ndla_styled_system_jsx);
+let react_i18next = require("react-i18next");
+react_i18next = require_rolldown_runtime.__toESM(react_i18next);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 
 //#region src/ContactBlock/ContactBlock.tsx
 const BackgroundVariant = {
@@ -133,7 +137,7 @@ const ContactBlock = ({ image, jobTitle, description, name, email, embedAlt, lan
 				src: image.image.imageUrl,
 				width: 300,
 				height: 300
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_LicenseByline_EmbedByline.LicenseContainerContent, {
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EmbedByline.LicenseContainerContent, {
 				type: "image",
 				copyright: image.copyright
 			})]

package/lib/ContactBlock/ContactBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContactBlock.js","names":["BackgroundVariant: Record<ContactBlockBackground, SystemStyleObject>","Text","LicenseContainerContent"],"sources":["../../src/ContactBlock/ContactBlock.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { useTranslation } from \"react-i18next\";\nimport { Text } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { SystemStyleObject } from \"@ndla/styled-system/types\";\nimport type { IImageMetaInformationV3DTO } from \"@ndla/types-backend/image-api\";\nimport { LicenseContainerContent } from \"../LicenseByline/EmbedByline\";\n\nexport type ContactBlockBackground = \"strong\" | \"moderate\" | \"subtle\";\n\nconst BackgroundVariant: Record<ContactBlockBackground, SystemStyleObject> = {\n  strong: { _before: { backgroundColor: \"surface.brand.3\" } },\n  moderate: { _before: { backgroundColor: \"surface.brand.3.moderate\" } },\n  subtle: { _before: { backgroundColor: \"surface.brand.3.subtle\" } },\n};\n\nexport const contactBlockBackgrounds = Object.keys(BackgroundVariant) as ContactBlockBackground[];\n\nconst StyledWrapper = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    minWidth: \"surface.xxsmall\",\n    padding: \"medium\",\n    alignItems: \"center\",\n    justifyContent: \"space-between\",\n    boxShadow: \"full\",\n    border: \"1px solid\",\n    gap: \"medium\",\n    position: \"relative\",\n    borderColor: \"stroke.default\",\n    borderRadius: \"xsmall\",\n    overflow: \"hidden\",\n    background: \"surface.default\",\n    flexDirection: \"column-reverse\",\n    tablet: {\n      alignItems: \"unset\",\n      flexDirection: \"row\",\n    },\n  },\n});\n\nconst EmailLink = styled(\"a\", {\n  base: {\n    color: \"text.default\",\n    textDecoration: \"underline\",\n    _hover: { textDecoration: \"none\" },\n    _focusVisible: { textDecoration: \"none\" },\n  },\n});\n\nconst HeaderWrapper = styled(\"div\", {\n  base: {\n    position: \"relative\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: \"3xsmall\",\n    zIndex: \"base\",\n    _before: {\n      content: '\"\"',\n      position: \"absolute\",\n      top: \"-60px\",\n      left: \"-50px\",\n      right: \"0\",\n      bottom: \"0\",\n      height: \"calc(100% + 50px)\",\n      width: \"surface.3xlarge\",\n      transform: \"rotate(-4deg)\",\n      zIndex: \"hide\",\n    },\n  },\n  variants: {\n    variant: BackgroundVariant,\n    imageExists: {\n      true: {\n        tabletDown: {\n          _before: {\n            display: \"none\",\n          },\n        },\n      },\n    },\n  },\n});\n\nconst ImageWrapper = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    gap: \"xxsmall\",\n    alignItems: \"flex-start\",\n    justifyContent: \"flex-start\",\n    flexDirection: \"column\",\n    zIndex: \"base\",\n    tabletDown: {\n      _before: {\n        content: '\"\"',\n        position: \"absolute\",\n        top: \"-50px\",\n        left: \"-50px\",\n        right: \"0\",\n        bottom: \"0\",\n        height: \"surface.xxsmall\",\n        width: \"surface.3xlarge\",\n        transform: \"rotate(-4deg)\",\n        zIndex: \"hide\",\n      },\n    },\n  },\n  variants: {\n    variant: BackgroundVariant,\n  },\n});\n\nconst StyledImage = styled(\"img\", {\n  base: {\n    borderRadius: \"xsmall\",\n    width: \"surface.xsmall\",\n    height: \"surface.xsmall\",\n    objectFit: \"cover\",\n  },\n});\n\nconst ContentWrapper = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: \"medium\",\n    flex: \"1\",\n    width: \"100%\",\n  },\n});\n\nconst StyledDescription = styled(Text, {\n  base: {\n    fontFamily: \"serif\",\n  },\n});\n\ninterface Props {\n  image?: IImageMetaInformationV3DTO;\n  jobTitle: string;\n  description: string;\n  backgroundColor?: ContactBlockBackground;\n  imageWidth?: number;\n  name: string;\n  email: string;\n  embedAlt?: string;\n  lang?: string;\n}\n\nexport const ContactBlock = ({\n  image,\n  jobTitle,\n  description,\n  name,\n  email,\n  embedAlt,\n  lang,\n  backgroundColor = \"strong\",\n}: Props) => {\n  const { t } = useTranslation();\n  return (\n    <StyledWrapper data-embed-type=\"contact-block\">\n      <ContentWrapper>\n        <HeaderWrapper variant={backgroundColor} imageExists={!!image}>\n          <Text lang={lang} fontWeight=\"bold\" textStyle=\"heading.small\">\n            {name}\n          </Text>\n          <Text lang={lang}>{jobTitle}</Text>\n          <Text>\n            {`${t(\"email\")}: `}\n            <EmailLink href={`mailto:${email}`}>{email}</EmailLink>\n          </Text>\n        </HeaderWrapper>\n        <StyledDescription textStyle=\"body.large\">{description}</StyledDescription>\n      </ContentWrapper>\n      {!!image && (\n        <ImageWrapper variant={backgroundColor}>\n          <StyledImage\n            alt={embedAlt !== undefined ? embedAlt : image.alttext.alttext}\n            src={image.image.imageUrl}\n            width={300}\n            height={300}\n          />\n          <LicenseContainerContent type=\"image\" copyright={image.copyright} />\n        </ImageWrapper>\n      )}\n    </StyledWrapper>\n  );\n};\n"],"mappings":";;;;;;;;AAiBA,MAAMA,oBAAuE;CAC3E,QAAQ,EAAE,SAAS,EAAE,iBAAiB,kBAAmB,EAAE;CAC3D,UAAU,EAAE,SAAS,EAAE,iBAAiB,2BAA4B,EAAE;CACtE,QAAQ,EAAE,SAAS,EAAE,iBAAiB,yBAA0B,EAAE;AACnE;AAED,MAAa,0BAA0B,OAAO,KAAK,kBAAkB;AAErE,MAAM,gBAAgB,qCAAO,OAAO,EAClC,MAAM;CACJ,SAAS;CACT,UAAU;CACV,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,WAAW;CACX,QAAQ;CACR,KAAK;CACL,UAAU;CACV,aAAa;CACb,cAAc;CACd,UAAU;CACV,YAAY;CACZ,eAAe;CACf,QAAQ;EACN,YAAY;EACZ,eAAe;CAChB;AACF,EACF,EAAC;AAEF,MAAM,YAAY,qCAAO,KAAK,EAC5B,MAAM;CACJ,OAAO;CACP,gBAAgB;CAChB,QAAQ,EAAE,gBAAgB,OAAQ;CAClC,eAAe,EAAE,gBAAgB,OAAQ;AAC1C,EACF,EAAC;AAEF,MAAM,gBAAgB,qCAAO,OAAO;CAClC,MAAM;EACJ,UAAU;EACV,SAAS;EACT,eAAe;EACf,KAAK;EACL,QAAQ;EACR,SAAS;GACP,SAAS;GACT,UAAU;GACV,KAAK;GACL,MAAM;GACN,OAAO;GACP,QAAQ;GACR,QAAQ;GACR,OAAO;GACP,WAAW;GACX,QAAQ;EACT;CACF;CACD,UAAU;EACR,SAAS;EACT,aAAa,EACX,MAAM,EACJ,YAAY,EACV,SAAS,EACP,SAAS,OACV,EACF,EACF,EACF;CACF;AACF,EAAC;AAEF,MAAM,eAAe,qCAAO,OAAO;CACjC,MAAM;EACJ,SAAS;EACT,KAAK;EACL,YAAY;EACZ,gBAAgB;EAChB,eAAe;EACf,QAAQ;EACR,YAAY,EACV,SAAS;GACP,SAAS;GACT,UAAU;GACV,KAAK;GACL,MAAM;GACN,OAAO;GACP,QAAQ;GACR,QAAQ;GACR,OAAO;GACP,WAAW;GACX,QAAQ;EACT,EACF;CACF;CACD,UAAU,EACR,SAAS,kBACV;AACF,EAAC;AAEF,MAAM,cAAc,qCAAO,OAAO,EAChC,MAAM;CACJ,cAAc;CACd,OAAO;CACP,QAAQ;CACR,WAAW;AACZ,EACF,EAAC;AAEF,MAAM,iBAAiB,qCAAO,OAAO,EACnC,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACL,MAAM;CACN,OAAO;AACR,EACF,EAAC;AAEF,MAAM,oBAAoB,qCAAOC,wBAAM,EACrC,MAAM,EACJ,YAAY,QACb,EACF,EAAC;AAcF,MAAa,eAAe,CAAC,EAC3B,OACA,UACA,aACA,MACA,OACA,UACA,MACA,kBAAkB,UACZ,KAAK;CACX,MAAM,EAAE,GAAG,GAAG,mCAAgB;AAC9B,wBACE,4BAAC;EAAc,mBAAgB;6BAC7B,4BAAC,6CACC,4BAAC;GAAc,SAAS;GAAiB,eAAe;;oBACtD,2BAACA;KAAW;KAAM,YAAW;KAAO,WAAU;eAC3C;MACI;oBACP,2BAACA;KAAW;eAAO;MAAgB;oBACnC,4BAACA,sCACG,EAAE,EAAE,QAAQ,CAAC,qBACf,2BAAC;KAAU,OAAO,SAAS,MAAM;eAAI;MAAkB,IAClD;;IACO,kBAChB,2BAAC;GAAkB,WAAU;aAAc;IAAgC,IAC5D,IACd,yBACD,4BAAC;GAAa,SAAS;8BACrB,2BAAC;IACC,KAAK,sBAAyB,WAAW,MAAM,QAAQ;IACvD,KAAK,MAAM,MAAM;IACjB,OAAO;IACP,QAAQ;KACR,kBACF,2BAACC;IAAwB,MAAK;IAAQ,WAAW,MAAM;KAAa;IACvD;GAEH;AAEnB"}
+{"version":3,"file":"ContactBlock.js","names":["BackgroundVariant: Record<ContactBlockBackground, SystemStyleObject>","Text","LicenseContainerContent"],"sources":["../../src/ContactBlock/ContactBlock.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { useTranslation } from \"react-i18next\";\nimport { Text } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { SystemStyleObject } from \"@ndla/styled-system/types\";\nimport type { IImageMetaInformationV3DTO } from \"@ndla/types-backend/image-api\";\nimport { LicenseContainerContent } from \"../LicenseByline/EmbedByline\";\n\nexport type ContactBlockBackground = \"strong\" | \"moderate\" | \"subtle\";\n\nconst BackgroundVariant: Record<ContactBlockBackground, SystemStyleObject> = {\n  strong: { _before: { backgroundColor: \"surface.brand.3\" } },\n  moderate: { _before: { backgroundColor: \"surface.brand.3.moderate\" } },\n  subtle: { _before: { backgroundColor: \"surface.brand.3.subtle\" } },\n};\n\nexport const contactBlockBackgrounds = Object.keys(BackgroundVariant) as ContactBlockBackground[];\n\nconst StyledWrapper = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    minWidth: \"surface.xxsmall\",\n    padding: \"medium\",\n    alignItems: \"center\",\n    justifyContent: \"space-between\",\n    boxShadow: \"full\",\n    border: \"1px solid\",\n    gap: \"medium\",\n    position: \"relative\",\n    borderColor: \"stroke.default\",\n    borderRadius: \"xsmall\",\n    overflow: \"hidden\",\n    background: \"surface.default\",\n    flexDirection: \"column-reverse\",\n    tablet: {\n      alignItems: \"unset\",\n      flexDirection: \"row\",\n    },\n  },\n});\n\nconst EmailLink = styled(\"a\", {\n  base: {\n    color: \"text.default\",\n    textDecoration: \"underline\",\n    _hover: { textDecoration: \"none\" },\n    _focusVisible: { textDecoration: \"none\" },\n  },\n});\n\nconst HeaderWrapper = styled(\"div\", {\n  base: {\n    position: \"relative\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: \"3xsmall\",\n    zIndex: \"base\",\n    _before: {\n      content: '\"\"',\n      position: \"absolute\",\n      top: \"-60px\",\n      left: \"-50px\",\n      right: \"0\",\n      bottom: \"0\",\n      height: \"calc(100% + 50px)\",\n      width: \"surface.3xlarge\",\n      transform: \"rotate(-4deg)\",\n      zIndex: \"hide\",\n    },\n  },\n  variants: {\n    variant: BackgroundVariant,\n    imageExists: {\n      true: {\n        tabletDown: {\n          _before: {\n            display: \"none\",\n          },\n        },\n      },\n    },\n  },\n});\n\nconst ImageWrapper = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    gap: \"xxsmall\",\n    alignItems: \"flex-start\",\n    justifyContent: \"flex-start\",\n    flexDirection: \"column\",\n    zIndex: \"base\",\n    tabletDown: {\n      _before: {\n        content: '\"\"',\n        position: \"absolute\",\n        top: \"-50px\",\n        left: \"-50px\",\n        right: \"0\",\n        bottom: \"0\",\n        height: \"surface.xxsmall\",\n        width: \"surface.3xlarge\",\n        transform: \"rotate(-4deg)\",\n        zIndex: \"hide\",\n      },\n    },\n  },\n  variants: {\n    variant: BackgroundVariant,\n  },\n});\n\nconst StyledImage = styled(\"img\", {\n  base: {\n    borderRadius: \"xsmall\",\n    width: \"surface.xsmall\",\n    height: \"surface.xsmall\",\n    objectFit: \"cover\",\n  },\n});\n\nconst ContentWrapper = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: \"medium\",\n    flex: \"1\",\n    width: \"100%\",\n  },\n});\n\nconst StyledDescription = styled(Text, {\n  base: {\n    fontFamily: \"serif\",\n  },\n});\n\ninterface Props {\n  image?: IImageMetaInformationV3DTO;\n  jobTitle: string;\n  description: string;\n  backgroundColor?: ContactBlockBackground;\n  imageWidth?: number;\n  name: string;\n  email: string;\n  embedAlt?: string;\n  lang?: string;\n}\n\nexport const ContactBlock = ({\n  image,\n  jobTitle,\n  description,\n  name,\n  email,\n  embedAlt,\n  lang,\n  backgroundColor = \"strong\",\n}: Props) => {\n  const { t } = useTranslation();\n  return (\n    <StyledWrapper data-embed-type=\"contact-block\">\n      <ContentWrapper>\n        <HeaderWrapper variant={backgroundColor} imageExists={!!image}>\n          <Text lang={lang} fontWeight=\"bold\" textStyle=\"heading.small\">\n            {name}\n          </Text>\n          <Text lang={lang}>{jobTitle}</Text>\n          <Text>\n            {`${t(\"email\")}: `}\n            <EmailLink href={`mailto:${email}`}>{email}</EmailLink>\n          </Text>\n        </HeaderWrapper>\n        <StyledDescription textStyle=\"body.large\">{description}</StyledDescription>\n      </ContentWrapper>\n      {!!image && (\n        <ImageWrapper variant={backgroundColor}>\n          <StyledImage\n            alt={embedAlt !== undefined ? embedAlt : image.alttext.alttext}\n            src={image.image.imageUrl}\n            width={300}\n            height={300}\n          />\n          <LicenseContainerContent type=\"image\" copyright={image.copyright} />\n        </ImageWrapper>\n      )}\n    </StyledWrapper>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAiBA,MAAMA,oBAAuE;CAC3E,QAAQ,EAAE,SAAS,EAAE,iBAAiB,mBAAmB,EAAE;CAC3D,UAAU,EAAE,SAAS,EAAE,iBAAiB,4BAA4B,EAAE;CACtE,QAAQ,EAAE,SAAS,EAAE,iBAAiB,0BAA0B,EAAE;CACnE;AAED,MAAa,0BAA0B,OAAO,KAAK,kBAAkB;AAErE,MAAM,qDAAuB,OAAO,EAClC,MAAM;CACJ,SAAS;CACT,UAAU;CACV,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,WAAW;CACX,QAAQ;CACR,KAAK;CACL,UAAU;CACV,aAAa;CACb,cAAc;CACd,UAAU;CACV,YAAY;CACZ,eAAe;CACf,QAAQ;EACN,YAAY;EACZ,eAAe;EAChB;CACF,EACF,CAAC;AAEF,MAAM,iDAAmB,KAAK,EAC5B,MAAM;CACJ,OAAO;CACP,gBAAgB;CAChB,QAAQ,EAAE,gBAAgB,QAAQ;CAClC,eAAe,EAAE,gBAAgB,QAAQ;CAC1C,EACF,CAAC;AAEF,MAAM,qDAAuB,OAAO;CAClC,MAAM;EACJ,UAAU;EACV,SAAS;EACT,eAAe;EACf,KAAK;EACL,QAAQ;EACR,SAAS;GACP,SAAS;GACT,UAAU;GACV,KAAK;GACL,MAAM;GACN,OAAO;GACP,QAAQ;GACR,QAAQ;GACR,OAAO;GACP,WAAW;GACX,QAAQ;GACT;EACF;CACD,UAAU;EACR,SAAS;EACT,aAAa,EACX,MAAM,EACJ,YAAY,EACV,SAAS,EACP,SAAS,QACV,EACF,EACF,EACF;EACF;CACF,CAAC;AAEF,MAAM,oDAAsB,OAAO;CACjC,MAAM;EACJ,SAAS;EACT,KAAK;EACL,YAAY;EACZ,gBAAgB;EAChB,eAAe;EACf,QAAQ;EACR,YAAY,EACV,SAAS;GACP,SAAS;GACT,UAAU;GACV,KAAK;GACL,MAAM;GACN,OAAO;GACP,QAAQ;GACR,QAAQ;GACR,OAAO;GACP,WAAW;GACX,QAAQ;GACT,EACF;EACF;CACD,UAAU,EACR,SAAS,mBACV;CACF,CAAC;AAEF,MAAM,mDAAqB,OAAO,EAChC,MAAM;CACJ,cAAc;CACd,OAAO;CACP,QAAQ;CACR,WAAW;CACZ,EACF,CAAC;AAEF,MAAM,sDAAwB,OAAO,EACnC,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACL,MAAM;CACN,OAAO;CACR,EACF,CAAC;AAEF,MAAM,yDAA2BC,wBAAM,EACrC,MAAM,EACJ,YAAY,SACb,EACF,CAAC;AAcF,MAAa,gBAAgB,EAC3B,OACA,UACA,aACA,MACA,OACA,UACA,MACA,kBAAkB,eACP;CACX,MAAM,EAAE,yCAAsB;AAC9B,QACE,4CAAC;EAAc,mBAAgB;aAC7B,4CAAC,6BACC,4CAAC;GAAc,SAAS;GAAiB,aAAa,CAAC,CAAC;;IACtD,2CAACA;KAAW;KAAM,YAAW;KAAO,WAAU;eAC3C;MACI;IACP,2CAACA;KAAW;eAAO;MAAgB;IACnC,4CAACA,qCACE,GAAG,EAAE,QAAQ,CAAC,KACf,2CAAC;KAAU,MAAM,UAAU;eAAU;MAAkB,IAClD;;IACO,EAChB,2CAAC;GAAkB,WAAU;aAAc;IAAgC,IAC5D,EAChB,CAAC,CAAC,SACD,4CAAC;GAAa,SAAS;cACrB,2CAAC;IACC,KAAK,aAAa,SAAY,WAAW,MAAM,QAAQ;IACvD,KAAK,MAAM,MAAM;IACjB,OAAO;IACP,QAAQ;KACR,EACF,2CAACC;IAAwB,MAAK;IAAQ,WAAW,MAAM;KAAa;IACvD;GAEH"}

package/lib/ContentTypeBadge/ContentTypeBadge.js

@@ -1,31 +1,35 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType = require('../model/ContentType.js');
-const react = require_rolldown_runtime.__toESM(require("react"));
-const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
-const react_i18next = require_rolldown_runtime.__toESM(require("react-i18next"));
-const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
+const require_ContentType = require('../model/ContentType.js');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let __ndla_primitives = require("@ndla/primitives");
+__ndla_primitives = require_rolldown_runtime.__toESM(__ndla_primitives);
+let react_i18next = require("react-i18next");
+react_i18next = require_rolldown_runtime.__toESM(react_i18next);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 
 //#region src/ContentTypeBadge/ContentTypeBadge.tsx
 const contentTypeToBadgeVariantMap = {
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.SUBJECT_MATERIAL]: "brand1",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.TASKS_AND_ACTIVITIES]: "brand2",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.ASSESSMENT_RESOURCES]: "brand2",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.SUBJECT]: "neutral",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.SOURCE_MATERIAL]: "brand1",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.LEARNING_PATH]: "brand3",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.TOPIC]: "neutral",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.MULTIDISCIPLINARY]: "neutral",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.CONCEPT]: "brand1",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.EXTERNAL]: "brand2",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.IMAGE]: "brand1",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.AUDIO]: "brand1",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.PODCAST]: "brand1",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.VIDEO]: "brand1",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.MISSING]: "neutral",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.PODCAST_SERIES]: "brand1",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.GLOSS]: "brand1",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.PROGRAMME]: "neutral",
-	[require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_model_ContentType.FRONTPAGE_ARTICLE]: "brand2"
+	[require_ContentType.SUBJECT_MATERIAL]: "brand1",
+	[require_ContentType.TASKS_AND_ACTIVITIES]: "brand2",
+	[require_ContentType.ASSESSMENT_RESOURCES]: "brand2",
+	[require_ContentType.SUBJECT]: "neutral",
+	[require_ContentType.SOURCE_MATERIAL]: "brand1",
+	[require_ContentType.LEARNING_PATH]: "brand3",
+	[require_ContentType.TOPIC]: "neutral",
+	[require_ContentType.MULTIDISCIPLINARY]: "neutral",
+	[require_ContentType.CONCEPT]: "brand1",
+	[require_ContentType.EXTERNAL]: "brand2",
+	[require_ContentType.IMAGE]: "brand1",
+	[require_ContentType.AUDIO]: "brand1",
+	[require_ContentType.PODCAST]: "brand1",
+	[require_ContentType.VIDEO]: "brand1",
+	[require_ContentType.MISSING]: "neutral",
+	[require_ContentType.PODCAST_SERIES]: "brand1",
+	[require_ContentType.GLOSS]: "brand1",
+	[require_ContentType.PROGRAMME]: "neutral",
+	[require_ContentType.FRONTPAGE_ARTICLE]: "brand2"
 };
 const ContentTypeBadge = (0, react.forwardRef)(({ contentType, children,...props }, ref) => {
 	const { t } = (0, react_i18next.useTranslation)();

package/lib/ContentTypeBadge/ContentTypeBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContentTypeBadge.js","names":["contentTypeToBadgeVariantMap: Record<ContentType, BadgeVariant>","Badge"],"sources":["../../src/ContentTypeBadge/ContentTypeBadge.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { forwardRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Badge, type BadgeProps, type BadgeVariant } from \"@ndla/primitives\";\nimport * as contentTypes from \"../model/ContentType\";\n\nexport interface ContentTypeBadgeProps extends Omit<BadgeProps, \"colorTheme\"> {\n  contentType: ContentType | undefined;\n}\n\nexport type StrictContentType =\n  | typeof contentTypes.SUBJECT_MATERIAL\n  | typeof contentTypes.TASKS_AND_ACTIVITIES\n  | typeof contentTypes.ASSESSMENT_RESOURCES\n  | typeof contentTypes.SUBJECT\n  | typeof contentTypes.SOURCE_MATERIAL\n  | typeof contentTypes.LEARNING_PATH\n  | typeof contentTypes.TOPIC\n  | typeof contentTypes.MULTIDISCIPLINARY\n  | typeof contentTypes.CONCEPT\n  | typeof contentTypes.EXTERNAL\n  | typeof contentTypes.IMAGE\n  | typeof contentTypes.AUDIO\n  | typeof contentTypes.VIDEO\n  | typeof contentTypes.MISSING\n  | typeof contentTypes.PODCAST\n  | typeof contentTypes.GLOSS\n  | typeof contentTypes.PROGRAMME\n  | typeof contentTypes.PODCAST_SERIES\n  | typeof contentTypes.FRONTPAGE_ARTICLE;\n\nexport type ContentType =\n  | StrictContentType\n  // This allows for us to fallback to string without getting a ts error, while still keeping intellisense\n  | (string & {});\n\nexport const contentTypeToBadgeVariantMap: Record<ContentType, BadgeVariant> = {\n  [contentTypes.SUBJECT_MATERIAL]: \"brand1\",\n  [contentTypes.TASKS_AND_ACTIVITIES]: \"brand2\",\n  [contentTypes.ASSESSMENT_RESOURCES]: \"brand2\",\n  [contentTypes.SUBJECT]: \"neutral\",\n  [contentTypes.SOURCE_MATERIAL]: \"brand1\",\n  [contentTypes.LEARNING_PATH]: \"brand3\",\n  [contentTypes.TOPIC]: \"neutral\",\n  [contentTypes.MULTIDISCIPLINARY]: \"neutral\",\n  [contentTypes.CONCEPT]: \"brand1\",\n  [contentTypes.EXTERNAL]: \"brand2\",\n  [contentTypes.IMAGE]: \"brand1\",\n  [contentTypes.AUDIO]: \"brand1\",\n  [contentTypes.PODCAST]: \"brand1\",\n  [contentTypes.VIDEO]: \"brand1\",\n  [contentTypes.MISSING]: \"neutral\",\n  [contentTypes.PODCAST_SERIES]: \"brand1\",\n  [contentTypes.GLOSS]: \"brand1\",\n  [contentTypes.PROGRAMME]: \"neutral\",\n  [contentTypes.FRONTPAGE_ARTICLE]: \"brand2\",\n};\n\nexport const ContentTypeBadge = forwardRef<HTMLDivElement, ContentTypeBadgeProps>(\n  ({ contentType, children, ...props }, ref) => {\n    const { t } = useTranslation();\n    return (\n      <Badge\n        colorTheme={contentTypeToBadgeVariantMap[contentType ?? \"missing\"] ?? contentTypeToBadgeVariantMap[\"missing\"]}\n        {...props}\n        ref={ref}\n      >\n        {children ?? t(`contentTypes.${contentType}`)}\n      </Badge>\n    );\n  },\n);\n"],"mappings":";;;;;;;;AA2CA,MAAaA,+BAAkE;2GAC5C;+GACI;+GACA;kGACb;0GACQ;wGACF;gGACR;4GACY;kGACV;mGACC;gGACH;gGACA;kGACE;gGACF;kGACE;yGACO;gGACT;oGACI;4GACQ;AACnC;AAED,MAAa,mBAAmB,sBAC9B,CAAC,EAAE,aAAa,SAAU,GAAG,OAAO,EAAE,QAAQ;CAC5C,MAAM,EAAE,GAAG,GAAG,mCAAgB;AAC9B,wBACE,2BAACC;EACC,YAAY,6BAA6B,eAAe,cAAc,6BAA6B;EACnG,GAAI;EACC;YAEJ,YAAY,GAAG,eAAe,YAAY,EAAE;GACvC;AAEX,EACF"}
+{"version":3,"file":"ContentTypeBadge.js","names":["contentTypeToBadgeVariantMap: Record<ContentType, BadgeVariant>","Badge"],"sources":["../../src/ContentTypeBadge/ContentTypeBadge.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { forwardRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Badge, type BadgeProps, type BadgeVariant } from \"@ndla/primitives\";\nimport * as contentTypes from \"../model/ContentType\";\n\nexport interface ContentTypeBadgeProps extends Omit<BadgeProps, \"colorTheme\"> {\n  contentType: ContentType | undefined;\n}\n\nexport type StrictContentType =\n  | typeof contentTypes.SUBJECT_MATERIAL\n  | typeof contentTypes.TASKS_AND_ACTIVITIES\n  | typeof contentTypes.ASSESSMENT_RESOURCES\n  | typeof contentTypes.SUBJECT\n  | typeof contentTypes.SOURCE_MATERIAL\n  | typeof contentTypes.LEARNING_PATH\n  | typeof contentTypes.TOPIC\n  | typeof contentTypes.MULTIDISCIPLINARY\n  | typeof contentTypes.CONCEPT\n  | typeof contentTypes.EXTERNAL\n  | typeof contentTypes.IMAGE\n  | typeof contentTypes.AUDIO\n  | typeof contentTypes.VIDEO\n  | typeof contentTypes.MISSING\n  | typeof contentTypes.PODCAST\n  | typeof contentTypes.GLOSS\n  | typeof contentTypes.PROGRAMME\n  | typeof contentTypes.PODCAST_SERIES\n  | typeof contentTypes.FRONTPAGE_ARTICLE;\n\nexport type ContentType =\n  | StrictContentType\n  // This allows for us to fallback to string without getting a ts error, while still keeping intellisense\n  | (string & {});\n\nexport const contentTypeToBadgeVariantMap: Record<ContentType, BadgeVariant> = {\n  [contentTypes.SUBJECT_MATERIAL]: \"brand1\",\n  [contentTypes.TASKS_AND_ACTIVITIES]: \"brand2\",\n  [contentTypes.ASSESSMENT_RESOURCES]: \"brand2\",\n  [contentTypes.SUBJECT]: \"neutral\",\n  [contentTypes.SOURCE_MATERIAL]: \"brand1\",\n  [contentTypes.LEARNING_PATH]: \"brand3\",\n  [contentTypes.TOPIC]: \"neutral\",\n  [contentTypes.MULTIDISCIPLINARY]: \"neutral\",\n  [contentTypes.CONCEPT]: \"brand1\",\n  [contentTypes.EXTERNAL]: \"brand2\",\n  [contentTypes.IMAGE]: \"brand1\",\n  [contentTypes.AUDIO]: \"brand1\",\n  [contentTypes.PODCAST]: \"brand1\",\n  [contentTypes.VIDEO]: \"brand1\",\n  [contentTypes.MISSING]: \"neutral\",\n  [contentTypes.PODCAST_SERIES]: \"brand1\",\n  [contentTypes.GLOSS]: \"brand1\",\n  [contentTypes.PROGRAMME]: \"neutral\",\n  [contentTypes.FRONTPAGE_ARTICLE]: \"brand2\",\n};\n\nexport const ContentTypeBadge = forwardRef<HTMLDivElement, ContentTypeBadgeProps>(\n  ({ contentType, children, ...props }, ref) => {\n    const { t } = useTranslation();\n    return (\n      <Badge\n        colorTheme={contentTypeToBadgeVariantMap[contentType ?? \"missing\"] ?? contentTypeToBadgeVariantMap[\"missing\"]}\n        {...props}\n        ref={ref}\n      >\n        {children ?? t(`contentTypes.${contentType}`)}\n      </Badge>\n    );\n  },\n);\n"],"mappings":";;;;;;;;;;;;AA2CA,MAAaA,+BAAkE;yCAC5C;6CACI;6CACA;gCACb;wCACQ;sCACF;8BACR;0CACY;gCACV;iCACC;8BACH;8BACA;gCACE;8BACF;gCACE;uCACO;8BACT;kCACI;0CACQ;CACnC;AAED,MAAa,0CACV,EAAE,aAAa,SAAU,GAAG,SAAS,QAAQ;CAC5C,MAAM,EAAE,yCAAsB;AAC9B,QACE,2CAACC;EACC,YAAY,6BAA6B,eAAe,cAAc,6BAA6B;EACnG,GAAI;EACC;YAEJ,YAAY,EAAE,gBAAgB,cAAc;GACvC;EAGb"}

package/lib/CopyParagraphButton/CopyParagraphButton.js

@@ -1,10 +1,16 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
-const react = require_rolldown_runtime.__toESM(require("react"));
-const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
-const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
-const react_i18next = require_rolldown_runtime.__toESM(require("react-i18next"));
-const __ndla_icons = require_rolldown_runtime.__toESM(require("@ndla/icons"));
-const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let __ndla_primitives = require("@ndla/primitives");
+__ndla_primitives = require_rolldown_runtime.__toESM(__ndla_primitives);
+let __ndla_styled_system_jsx = require("@ndla/styled-system/jsx");
+__ndla_styled_system_jsx = require_rolldown_runtime.__toESM(__ndla_styled_system_jsx);
+let react_i18next = require("react-i18next");
+react_i18next = require_rolldown_runtime.__toESM(react_i18next);
+let __ndla_icons = require("@ndla/icons");
+__ndla_icons = require_rolldown_runtime.__toESM(__ndla_icons);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 
 //#region src/CopyParagraphButton/CopyParagraphButton.tsx
 const ContainerDiv = (0, __ndla_styled_system_jsx.styled)("div", { base: {
@@ -60,5 +66,5 @@ const CopyParagraphButton = ({ children, copyText, lang }) => {
 var CopyParagraphButton_default = CopyParagraphButton;
 
 //#endregion
-exports.CopyParagraphButton_default$1 = CopyParagraphButton_default;
+exports.default = CopyParagraphButton_default;
 //# sourceMappingURL=CopyParagraphButton.js.map

package/lib/CopyParagraphButton/CopyParagraphButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"CopyParagraphButton.js","names":["IconButton","LinkMedium"],"sources":["../../src/CopyParagraphButton/CopyParagraphButton.tsx"],"sourcesContent":["/**\n * Copyright (c) 2021-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { type ReactNode, useCallback, useEffect, useMemo, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { LinkMedium } from \"@ndla/icons\";\nimport { IconButton } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\n\nconst ContainerDiv = styled(\"div\", {\n  base: {\n    position: \"relative\",\n    _hover: {\n      \"& [data-copy-button]\": {\n        opacity: \"1\",\n        cursor: \"pointer\",\n      },\n    },\n  },\n});\n\nconst StyledIconButton = styled(IconButton, {\n  base: {\n    position: \"absolute\",\n    left: \"-xxlarge\",\n    top: \"-4xsmall\",\n    opacity: \"0\",\n    cursor: \"pointer\",\n    \"&:focus, &:focus-visible, &:active\": {\n      opacity: \"1\",\n    },\n  },\n});\n\ninterface Props {\n  // What to render within the h2\n  children: ReactNode;\n  copyText: string;\n  lang?: string;\n}\nconst CopyParagraphButton = ({ children, copyText, lang }: Props) => {\n  const [hasCopied, setHasCopied] = useState(false);\n  const { t } = useTranslation();\n  const sanitizedTitle = useMemo(() => encodeURIComponent(copyText.replace(/ /g, \"-\")), [copyText]);\n\n  useEffect(() => {\n    if (hasCopied) {\n      setTimeout(() => setHasCopied(false), 3000);\n    }\n  }, [hasCopied]);\n\n  const onCopyClick = useCallback(async () => {\n    const { location } = window;\n    const newHash = `#${sanitizedTitle}`;\n    const port = location.port ? `:${location.port}` : \"\";\n    const urlToCopy = `${location.protocol}//${location.hostname}${port}${location.pathname}${location.search}${newHash}`;\n    try {\n      await navigator.clipboard.writeText(urlToCopy);\n      setHasCopied(true);\n    } catch {\n      // do nothing\n    }\n  }, [sanitizedTitle]);\n\n  const tooltip = hasCopied ? t(\"article.copyPageLinkCopied\") : t(\"article.copyHeaderLink\");\n  return (\n    <ContainerDiv data-embed-type=\"copy-heading\">\n      <StyledIconButton\n        variant=\"clear\"\n        data-copy-button=\"\"\n        onClick={onCopyClick}\n        title={tooltip}\n        aria-label={`${tooltip}: ${copyText}`}\n      >\n        <LinkMedium />\n      </StyledIconButton>\n      <h2 id={sanitizedTitle} tabIndex={-1} lang={lang}>\n        {children}\n      </h2>\n    </ContainerDiv>\n  );\n};\n\nexport default CopyParagraphButton;\n"],"mappings":";;;;;;;;;AAcA,MAAM,eAAe,qCAAO,OAAO,EACjC,MAAM;CACJ,UAAU;CACV,QAAQ,EACN,wBAAwB;EACtB,SAAS;EACT,QAAQ;CACT,EACF;AACF,EACF,EAAC;AAEF,MAAM,mBAAmB,qCAAOA,8BAAY,EAC1C,MAAM;CACJ,UAAU;CACV,MAAM;CACN,KAAK;CACL,SAAS;CACT,QAAQ;CACR,sCAAsC,EACpC,SAAS,IACV;AACF,EACF,EAAC;AAQF,MAAM,sBAAsB,CAAC,EAAE,UAAU,UAAU,MAAa,KAAK;CACnE,MAAM,CAAC,WAAW,aAAa,GAAG,oBAAS,MAAM;CACjD,MAAM,EAAE,GAAG,GAAG,mCAAgB;CAC9B,MAAM,iBAAiB,mBAAQ,MAAM,mBAAmB,SAAS,QAAQ,MAAM,IAAI,CAAC,EAAE,CAAC,QAAS,EAAC;AAEjG,sBAAU,MAAM;AACd,MAAI,UACF,YAAW,MAAM,aAAa,MAAM,EAAE,IAAK;CAE9C,GAAE,CAAC,SAAU,EAAC;CAEf,MAAM,cAAc,uBAAY,YAAY;EAC1C,MAAM,EAAE,UAAU,GAAG;EACrB,MAAM,WAAW,GAAG,eAAe;EACnC,MAAM,OAAO,SAAS,QAAQ,GAAG,SAAS,KAAK,IAAI;EACnD,MAAM,aAAa,EAAE,SAAS,SAAS,IAAI,SAAS,SAAS,EAAE,KAAK,EAAE,SAAS,SAAS,EAAE,SAAS,OAAO,EAAE,QAAQ;AACpH,MAAI;AACF,SAAM,UAAU,UAAU,UAAU,UAAU;AAC9C,gBAAa,KAAK;EACnB,QAAO,CAEP;CACF,GAAE,CAAC,cAAe,EAAC;CAEpB,MAAM,UAAU,YAAY,EAAE,6BAA6B,GAAG,EAAE,yBAAyB;AACzF,wBACE,4BAAC;EAAa,mBAAgB;6BAC5B,2BAAC;GACC,SAAQ;GACR,oBAAiB;GACjB,SAAS;GACT,OAAO;GACP,eAAa,EAAE,QAAQ,IAAI,SAAS;6BAEpC,2BAACC,4BAAa;IACG,kBACnB,2BAAC;GAAG,IAAI;GAAgB,UAAU;GAAU;GACzC;IACE;GACQ;AAElB;AAED,kCAAe"}
+{"version":3,"file":"CopyParagraphButton.js","names":["IconButton","LinkMedium"],"sources":["../../src/CopyParagraphButton/CopyParagraphButton.tsx"],"sourcesContent":["/**\n * Copyright (c) 2021-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { type ReactNode, useCallback, useEffect, useMemo, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { LinkMedium } from \"@ndla/icons\";\nimport { IconButton } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\n\nconst ContainerDiv = styled(\"div\", {\n  base: {\n    position: \"relative\",\n    _hover: {\n      \"& [data-copy-button]\": {\n        opacity: \"1\",\n        cursor: \"pointer\",\n      },\n    },\n  },\n});\n\nconst StyledIconButton = styled(IconButton, {\n  base: {\n    position: \"absolute\",\n    left: \"-xxlarge\",\n    top: \"-4xsmall\",\n    opacity: \"0\",\n    cursor: \"pointer\",\n    \"&:focus, &:focus-visible, &:active\": {\n      opacity: \"1\",\n    },\n  },\n});\n\ninterface Props {\n  // What to render within the h2\n  children: ReactNode;\n  copyText: string;\n  lang?: string;\n}\nconst CopyParagraphButton = ({ children, copyText, lang }: Props) => {\n  const [hasCopied, setHasCopied] = useState(false);\n  const { t } = useTranslation();\n  const sanitizedTitle = useMemo(() => encodeURIComponent(copyText.replace(/ /g, \"-\")), [copyText]);\n\n  useEffect(() => {\n    if (hasCopied) {\n      setTimeout(() => setHasCopied(false), 3000);\n    }\n  }, [hasCopied]);\n\n  const onCopyClick = useCallback(async () => {\n    const { location } = window;\n    const newHash = `#${sanitizedTitle}`;\n    const port = location.port ? `:${location.port}` : \"\";\n    const urlToCopy = `${location.protocol}//${location.hostname}${port}${location.pathname}${location.search}${newHash}`;\n    try {\n      await navigator.clipboard.writeText(urlToCopy);\n      setHasCopied(true);\n    } catch {\n      // do nothing\n    }\n  }, [sanitizedTitle]);\n\n  const tooltip = hasCopied ? t(\"article.copyPageLinkCopied\") : t(\"article.copyHeaderLink\");\n  return (\n    <ContainerDiv data-embed-type=\"copy-heading\">\n      <StyledIconButton\n        variant=\"clear\"\n        data-copy-button=\"\"\n        onClick={onCopyClick}\n        title={tooltip}\n        aria-label={`${tooltip}: ${copyText}`}\n      >\n        <LinkMedium />\n      </StyledIconButton>\n      <h2 id={sanitizedTitle} tabIndex={-1} lang={lang}>\n        {children}\n      </h2>\n    </ContainerDiv>\n  );\n};\n\nexport default CopyParagraphButton;\n"],"mappings":";;;;;;;;;;;;;;;AAcA,MAAM,oDAAsB,OAAO,EACjC,MAAM;CACJ,UAAU;CACV,QAAQ,EACN,wBAAwB;EACtB,SAAS;EACT,QAAQ;EACT,EACF;CACF,EACF,CAAC;AAEF,MAAM,wDAA0BA,8BAAY,EAC1C,MAAM;CACJ,UAAU;CACV,MAAM;CACN,KAAK;CACL,SAAS;CACT,QAAQ;CACR,sCAAsC,EACpC,SAAS,KACV;CACF,EACF,CAAC;AAQF,MAAM,uBAAuB,EAAE,UAAU,UAAU,WAAkB;CACnE,MAAM,CAAC,WAAW,oCAAyB,MAAM;CACjD,MAAM,EAAE,yCAAsB;CAC9B,MAAM,0CAA+B,mBAAmB,SAAS,QAAQ,MAAM,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC;AAEjG,4BAAgB;AACd,MAAI,UACF,kBAAiB,aAAa,MAAM,EAAE,IAAK;IAE5C,CAAC,UAAU,CAAC;CAEf,MAAM,qCAA0B,YAAY;EAC1C,MAAM,EAAE,aAAa;EACrB,MAAM,UAAU,IAAI;EACpB,MAAM,OAAO,SAAS,OAAO,IAAI,SAAS,SAAS;EACnD,MAAM,YAAY,GAAG,SAAS,SAAS,IAAI,SAAS,WAAW,OAAO,SAAS,WAAW,SAAS,SAAS;AAC5G,MAAI;AACF,SAAM,UAAU,UAAU,UAAU,UAAU;AAC9C,gBAAa,KAAK;UACZ;IAGP,CAAC,eAAe,CAAC;CAEpB,MAAM,UAAU,YAAY,EAAE,6BAA6B,GAAG,EAAE,yBAAyB;AACzF,QACE,4CAAC;EAAa,mBAAgB;aAC5B,2CAAC;GACC,SAAQ;GACR,oBAAiB;GACjB,SAAS;GACT,OAAO;GACP,cAAY,GAAG,QAAQ,IAAI;aAE3B,2CAACC,4BAAa;IACG,EACnB,2CAAC;GAAG,IAAI;GAAgB,UAAU;GAAU;GACzC;IACE;GACQ;;AAInB,kCAAe"}

package/lib/Embed/AudioEmbed.js

@@ -1,19 +1,22 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_LicenseByline_EmbedByline = require('../LicenseByline/EmbedByline.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_EmbedErrorPlaceholder = require('./EmbedErrorPlaceholder.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_utils_licenseAttributes = require('../utils/licenseAttributes.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_AudioPlayer_index = require('../AudioPlayer/index.js');
-const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
-const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
-const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
+const require_EmbedByline = require('../LicenseByline/EmbedByline.js');
+const require_EmbedErrorPlaceholder = require('./EmbedErrorPlaceholder.js');
+const require_licenseAttributes = require('../utils/licenseAttributes.js');
+const require_AudioPlayer = require('../AudioPlayer/AudioPlayer.js');
+let __ndla_primitives = require("@ndla/primitives");
+__ndla_primitives = require_rolldown_runtime.__toESM(__ndla_primitives);
+let __ndla_styled_system_jsx = require("@ndla/styled-system/jsx");
+__ndla_styled_system_jsx = require_rolldown_runtime.__toESM(__ndla_styled_system_jsx);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 
 //#region src/Embed/AudioEmbed.tsx
 const StyledFigure = (0, __ndla_styled_system_jsx.styled)(__ndla_primitives.Figure, { base: { clear: "both" } });
 const AudioEmbed = ({ embed, lang }) => {
 	const type = embed.embedData.type === "standard" ? "audio" : "podcast";
-	if (embed.status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_EmbedErrorPlaceholder.EmbedErrorPlaceholder_default, { type });
+	if (embed.status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EmbedErrorPlaceholder.default, { type });
 	const { data, embedData } = embed;
-	if (embedData.type === "minimal") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_AudioPlayer_index.AudioPlayer_default, {
+	if (embedData.type === "minimal") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AudioPlayer.default, {
 		speech: true,
 		src: data.audioFile.url,
 		title: data.title.title
@@ -27,19 +30,19 @@ const AudioEmbed = ({ embed, lang }) => {
 		url: coverPhoto.url,
 		alt: coverPhoto.altText
 	};
-	const licenseProps = require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_utils_licenseAttributes.licenseAttributes(data.copyright.license.license, lang, embedData.url);
+	const licenseProps = require_licenseAttributes.licenseAttributes(data.copyright.license.license, lang, embedData.url);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(StyledFigure, {
 		lang,
 		"data-embed-type": type,
 		...licenseProps,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_AudioPlayer_index.AudioPlayer_default, {
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AudioPlayer.default, {
 			description: data.podcastMeta?.introduction ?? "",
 			img,
 			src: data.audioFile.url,
 			textVersion: data.manuscript?.manuscript.length ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { dangerouslySetInnerHTML: { __html: data.manuscript.manuscript } }) : void 0,
 			title: data.title.title,
 			subtitle
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_LicenseByline_EmbedByline.EmbedByline, {
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EmbedByline.EmbedByline, {
 			error: false,
 			type: data.audioType === "standard" ? "audio" : "podcast",
 			copyright: embed.data.copyright
@@ -49,5 +52,5 @@ const AudioEmbed = ({ embed, lang }) => {
 var AudioEmbed_default = AudioEmbed;
 
 //#endregion
-exports.AudioEmbed_default = AudioEmbed_default;
+exports.default = AudioEmbed_default;
 //# sourceMappingURL=AudioEmbed.js.map

package/lib/Embed/AudioEmbed.js.map

@@ -1 +1 @@
-{"version":3,"file":"AudioEmbed.js","names":["Figure","EmbedErrorPlaceholder","AudioPlayer","EmbedByline"],"sources":["../../src/Embed/AudioEmbed.tsx"],"sourcesContent":["/**\n * Copyright (c) 2023-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { AudioMetaData } from \"@ndla/types-embed\";\nimport EmbedErrorPlaceholder from \"./EmbedErrorPlaceholder\";\nimport type { Author } from \"./ImageEmbed\";\nimport AudioPlayer from \"../AudioPlayer\";\nimport { EmbedByline } from \"../LicenseByline\";\nimport { licenseAttributes } from \"../utils/licenseAttributes\";\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    clear: \"both\",\n  },\n});\n\ninterface Props {\n  embed: AudioMetaData;\n  lang?: string;\n}\n\nexport const getFirstNonEmptyLicenseCredits = (authors: {\n  creators: Author[];\n  rightsholders: Author[];\n  processors: Author[];\n}) => Object.values(authors).find((i) => i.length > 0) ?? [];\n\nconst AudioEmbed = ({ embed, lang }: Props) => {\n  const type = embed.embedData.type === \"standard\" ? \"audio\" : \"podcast\";\n  if (embed.status === \"error\") {\n    return <EmbedErrorPlaceholder type={type} />;\n  }\n\n  const { data, embedData } = embed;\n\n  if (embedData.type === \"minimal\") {\n    return <AudioPlayer speech src={data.audioFile.url} title={data.title.title} />;\n  }\n\n  const subtitle = data.series ? { title: data.series.title.title, url: `/podkast/${data.series.id}` } : undefined;\n\n  const coverPhoto = data.podcastMeta?.coverPhoto;\n\n  const img = coverPhoto && { url: coverPhoto.url, alt: coverPhoto.altText };\n\n  const licenseProps = licenseAttributes(data.copyright.license.license, lang, embedData.url);\n\n  return (\n    <StyledFigure lang={lang} data-embed-type={type} {...licenseProps}>\n      <AudioPlayer\n        description={data.podcastMeta?.introduction ?? \"\"}\n        img={img}\n        src={data.audioFile.url}\n        textVersion={\n          data.manuscript?.manuscript.length ? (\n            <div dangerouslySetInnerHTML={{ __html: data.manuscript.manuscript }} />\n          ) : undefined\n        }\n        title={data.title.title}\n        subtitle={subtitle}\n      />\n      <EmbedByline\n        error={false}\n        type={data.audioType === \"standard\" ? \"audio\" : \"podcast\"}\n        copyright={embed.data.copyright}\n      />\n    </StyledFigure>\n  );\n};\n\nexport default AudioEmbed;\n"],"mappings":";;;;;;;;;;AAiBA,MAAM,eAAe,qCAAOA,0BAAQ,EAClC,MAAM,EACJ,OAAO,OACR,EACF,EAAC;AAaF,MAAM,aAAa,CAAC,EAAE,OAAO,MAAa,KAAK;CAC7C,MAAM,OAAO,MAAM,UAAU,SAAS,aAAa,UAAU;AAC7D,KAAI,MAAM,WAAW,QACnB,wBAAO,2BAACC,iIAA4B,OAAQ;CAG9C,MAAM,EAAE,MAAM,WAAW,GAAG;AAE5B,KAAI,UAAU,SAAS,UACrB,wBAAO,2BAACC;EAAY;EAAO,KAAK,KAAK,UAAU;EAAK,OAAO,KAAK,MAAM;GAAS;CAGjF,MAAM,WAAW,KAAK,SAAS;EAAE,OAAO,KAAK,OAAO,MAAM;EAAO,MAAM,WAAW,KAAK,OAAO,GAAG;CAAG;CAEpG,MAAM,aAAa,KAAK,aAAa;CAErC,MAAM,MAAM,cAAc;EAAE,KAAK,WAAW;EAAK,KAAK,WAAW;CAAS;CAE1E,MAAM,eAAe,8GAAkB,KAAK,UAAU,QAAQ,SAAS,MAAM,UAAU,IAAI;AAE3F,wBACE,4BAAC;EAAmB;EAAM,mBAAiB;EAAM,GAAI;6BACnD,2BAACA;GACC,aAAa,KAAK,aAAa,gBAAgB;GAC1C;GACL,KAAK,KAAK,UAAU;GACpB,aACE,KAAK,YAAY,WAAW,yBAC1B,2BAAC,SAAI,yBAAyB,EAAE,QAAQ,KAAK,WAAW,WAAY,IAAI;GAG5E,OAAO,KAAK,MAAM;GACR;IACV,kBACF,2BAACC;GACC,OAAO;GACP,MAAM,KAAK,cAAc,aAAa,UAAU;GAChD,WAAW,MAAM,KAAK;IACtB;GACW;AAElB;AAED,yBAAe"}
+{"version":3,"file":"AudioEmbed.js","names":["Figure","EmbedErrorPlaceholder","AudioPlayer","licenseAttributes","EmbedByline"],"sources":["../../src/Embed/AudioEmbed.tsx"],"sourcesContent":["/**\n * Copyright (c) 2023-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { AudioMetaData } from \"@ndla/types-embed\";\nimport EmbedErrorPlaceholder from \"./EmbedErrorPlaceholder\";\nimport type { Author } from \"./ImageEmbed\";\nimport AudioPlayer from \"../AudioPlayer/AudioPlayer\";\nimport { EmbedByline } from \"../LicenseByline/EmbedByline\";\nimport { licenseAttributes } from \"../utils/licenseAttributes\";\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    clear: \"both\",\n  },\n});\n\ninterface Props {\n  embed: AudioMetaData;\n  lang?: string;\n}\n\nexport const getFirstNonEmptyLicenseCredits = (authors: {\n  creators: Author[];\n  rightsholders: Author[];\n  processors: Author[];\n}) => Object.values(authors).find((i) => i.length > 0) ?? [];\n\nconst AudioEmbed = ({ embed, lang }: Props) => {\n  const type = embed.embedData.type === \"standard\" ? \"audio\" : \"podcast\";\n  if (embed.status === \"error\") {\n    return <EmbedErrorPlaceholder type={type} />;\n  }\n\n  const { data, embedData } = embed;\n\n  if (embedData.type === \"minimal\") {\n    return <AudioPlayer speech src={data.audioFile.url} title={data.title.title} />;\n  }\n\n  const subtitle = data.series ? { title: data.series.title.title, url: `/podkast/${data.series.id}` } : undefined;\n\n  const coverPhoto = data.podcastMeta?.coverPhoto;\n\n  const img = coverPhoto && { url: coverPhoto.url, alt: coverPhoto.altText };\n\n  const licenseProps = licenseAttributes(data.copyright.license.license, lang, embedData.url);\n\n  return (\n    <StyledFigure lang={lang} data-embed-type={type} {...licenseProps}>\n      <AudioPlayer\n        description={data.podcastMeta?.introduction ?? \"\"}\n        img={img}\n        src={data.audioFile.url}\n        textVersion={\n          data.manuscript?.manuscript.length ? (\n            <div dangerouslySetInnerHTML={{ __html: data.manuscript.manuscript }} />\n          ) : undefined\n        }\n        title={data.title.title}\n        subtitle={subtitle}\n      />\n      <EmbedByline\n        error={false}\n        type={data.audioType === \"standard\" ? \"audio\" : \"podcast\"}\n        copyright={embed.data.copyright}\n      />\n    </StyledFigure>\n  );\n};\n\nexport default AudioEmbed;\n"],"mappings":";;;;;;;;;;;;;AAiBA,MAAM,oDAAsBA,0BAAQ,EAClC,MAAM,EACJ,OAAO,QACR,EACF,CAAC;AAaF,MAAM,cAAc,EAAE,OAAO,WAAkB;CAC7C,MAAM,OAAO,MAAM,UAAU,SAAS,aAAa,UAAU;AAC7D,KAAI,MAAM,WAAW,QACnB,QAAO,2CAACC,yCAA4B,OAAQ;CAG9C,MAAM,EAAE,MAAM,cAAc;AAE5B,KAAI,UAAU,SAAS,UACrB,QAAO,2CAACC;EAAY;EAAO,KAAK,KAAK,UAAU;EAAK,OAAO,KAAK,MAAM;GAAS;CAGjF,MAAM,WAAW,KAAK,SAAS;EAAE,OAAO,KAAK,OAAO,MAAM;EAAO,KAAK,YAAY,KAAK,OAAO;EAAM,GAAG;CAEvG,MAAM,aAAa,KAAK,aAAa;CAErC,MAAM,MAAM,cAAc;EAAE,KAAK,WAAW;EAAK,KAAK,WAAW;EAAS;CAE1E,MAAM,eAAeC,4CAAkB,KAAK,UAAU,QAAQ,SAAS,MAAM,UAAU,IAAI;AAE3F,QACE,4CAAC;EAAmB;EAAM,mBAAiB;EAAM,GAAI;aACnD,2CAACD;GACC,aAAa,KAAK,aAAa,gBAAgB;GAC1C;GACL,KAAK,KAAK,UAAU;GACpB,aACE,KAAK,YAAY,WAAW,SAC1B,2CAAC,SAAI,yBAAyB,EAAE,QAAQ,KAAK,WAAW,YAAY,GAAI,GACtE;GAEN,OAAO,KAAK,MAAM;GACR;IACV,EACF,2CAACE;GACC,OAAO;GACP,MAAM,KAAK,cAAc,aAAa,UAAU;GAChD,WAAW,MAAM,KAAK;IACtB;GACW;;AAInB,yBAAe"}

package/lib/Embed/BrightcoveEmbed.js

@@ -1,13 +1,19 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_LicenseByline_EmbedByline = require('../LicenseByline/EmbedByline.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_EmbedErrorPlaceholder = require('./EmbedErrorPlaceholder.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_utils_licenseAttributes = require('../utils/licenseAttributes.js');
-const react = require_rolldown_runtime.__toESM(require("react"));
-const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
-const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
-const html_react_parser = require_rolldown_runtime.__toESM(require("html-react-parser"));
-const react_i18next = require_rolldown_runtime.__toESM(require("react-i18next"));
-const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
+const require_EmbedByline = require('../LicenseByline/EmbedByline.js');
+const require_EmbedErrorPlaceholder = require('./EmbedErrorPlaceholder.js');
+const require_licenseAttributes = require('../utils/licenseAttributes.js');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let __ndla_primitives = require("@ndla/primitives");
+__ndla_primitives = require_rolldown_runtime.__toESM(__ndla_primitives);
+let __ndla_styled_system_jsx = require("@ndla/styled-system/jsx");
+__ndla_styled_system_jsx = require_rolldown_runtime.__toESM(__ndla_styled_system_jsx);
+let html_react_parser = require("html-react-parser");
+html_react_parser = require_rolldown_runtime.__toESM(html_react_parser);
+let react_i18next = require("react-i18next");
+react_i18next = require_rolldown_runtime.__toESM(react_i18next);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 
 //#region src/Embed/BrightcoveEmbed.tsx
 const LinkedVideoButton = (0, __ndla_styled_system_jsx.styled)(__ndla_primitives.Button, { base: { marginBlockStart: "3xsmall" } });
@@ -45,7 +51,7 @@ const BrightcoveEmbed = ({ embed, renderContext = "article", lang }) => {
 			iframe.height = "";
 		}
 	}, []);
-	if (embed.status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_EmbedErrorPlaceholder.EmbedErrorPlaceholder_default, {
+	if (embed.status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EmbedErrorPlaceholder.default, {
 		type: "video",
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BrightcoveIframe, {
 			ref: iframeRef,
@@ -62,7 +68,7 @@ const BrightcoveEmbed = ({ embed, renderContext = "article", lang }) => {
 		...embedData,
 		videoid: linkedVideoId
 	}, data.sources) : void 0;
-	const licenseProps = require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_utils_licenseAttributes.licenseAttributes(data?.copyright?.license.license, lang, embedData.pageUrl);
+	const licenseProps = require_licenseAttributes.licenseAttributes(data?.copyright?.license.license, lang, embedData.pageUrl);
 	const title = data.name?.trim() ? `${t("embed.type.video")}: ${data.name}` : fallbackTitle;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__ndla_primitives.Figure, {
 		"data-embed-type": "brightcove",
@@ -77,7 +83,7 @@ const BrightcoveEmbed = ({ embed, renderContext = "article", lang }) => {
 				...alternativeVideoProps && !showOriginalVideo ? alternativeVideoProps : originalVideoProps,
 				allow: "fullscreen; encrypted-media"
 			})
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_LicenseByline_EmbedByline.EmbedByline, {
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EmbedByline.EmbedByline, {
 			type: "video",
 			copyright: data.copyright,
 			description: parsedDescription,
@@ -93,5 +99,5 @@ const BrightcoveEmbed = ({ embed, renderContext = "article", lang }) => {
 var BrightcoveEmbed_default = BrightcoveEmbed;
 
 //#endregion
-exports.BrightcoveEmbed_default = BrightcoveEmbed_default;
+exports.default = BrightcoveEmbed_default;
 //# sourceMappingURL=BrightcoveEmbed.js.map

package/lib/Embed/BrightcoveEmbed.js.map

@@ -1 +1 @@
-{"version":3,"file":"BrightcoveEmbed.js","names":["Button","value: any","data: BrightcoveEmbedData","sources: BrightcoveVideoSource[]","EmbedErrorPlaceholder","Figure","EmbedByline"],"sources":["../../src/Embed/BrightcoveEmbed.tsx"],"sourcesContent":["/**\n * Copyright (c) 2023-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport parse from \"html-react-parser\";\nimport { useEffect, useMemo, useRef, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Button, Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { BrightcoveEmbedData, BrightcoveMetaData, BrightcoveVideoSource } from \"@ndla/types-embed\";\nimport EmbedErrorPlaceholder from \"./EmbedErrorPlaceholder\";\nimport type { RenderContext } from \"./types\";\nimport { EmbedByline } from \"../LicenseByline\";\nimport { licenseAttributes } from \"../utils/licenseAttributes\";\n\ninterface Props {\n  embed: BrightcoveMetaData;\n  renderContext?: RenderContext;\n  lang?: string;\n}\n\nconst LinkedVideoButton = styled(Button, {\n  base: {\n    marginBlockStart: \"3xsmall\",\n  },\n});\n\nconst BrightcoveIframe = styled(\"iframe\", {\n  base: {\n    border: 0,\n    height: \"auto\",\n    width: \"100%\",\n  },\n});\n\nexport const makeIframeString = (url: string, width: string | number, height: string | number, title = \"\") => {\n  const strippedWidth = typeof width === \"number\" ? width : width.replace(/\\s*px/, \"\");\n  const strippedHeight = typeof height === \"number\" ? height : height.replace(/\\s*px/, \"\");\n  const urlOrTitle = title || url;\n  return `<iframe title=\"${urlOrTitle}\" aria-label=\"${urlOrTitle}\" src=\"${url}\" width=\"${strippedWidth}\" height=\"${strippedHeight}\" allowfullscreen scrolling=\"no\" frameborder=\"0\" loading=\"lazy\"></iframe>`;\n};\n\nexport const isNumeric = (value: any) => !Number.isNaN(value - Number.parseFloat(value));\n\nconst getIframeProps = (data: BrightcoveEmbedData, sources: BrightcoveVideoSource[]) => {\n  const { account, videoid, player = \"default\" } = data;\n\n  const source = sources.filter((s) => s.width && s.height).toSorted((a, b) => a!.height! - b.height!)[0];\n\n  return {\n    src: `https://players.brightcove.net/${account}/${player}_default/index.html?videoId=${videoid}`,\n    height: source?.height ?? \"480\",\n    width: source?.width ?? \"640\",\n  };\n};\nconst BrightcoveEmbed = ({ embed, renderContext = \"article\", lang }: Props) => {\n  const [showOriginalVideo, setShowOriginalVideo] = useState(true);\n  const { t } = useTranslation();\n  const iframeRef = useRef<HTMLIFrameElement>(null);\n  const { embedData } = embed;\n  const fallbackTitle = `${t(\"embed.type.video\")}: ${embedData.videoid}`;\n  const parsedDescription = useMemo(() => {\n    if (embed.embedData.caption || renderContext === \"article\") {\n      return embed.embedData.caption ? parse(embed.embedData.caption) : undefined;\n    } else if (embed.status === \"success\" && embed.data.description) {\n      return parse(embed.data.description);\n    }\n  }, [embed, renderContext]);\n\n  useEffect(() => {\n    const iframe = iframeRef.current;\n    if (iframe) {\n      const [width, height] = [parseInt(iframe.width), parseInt(iframe.height)];\n      iframe.style.aspectRatio = `${width}/${height}`;\n      iframe.width = \"\";\n      iframe.height = \"\";\n    }\n  }, []);\n  if (embed.status === \"error\") {\n    return (\n      <EmbedErrorPlaceholder type=\"video\">\n        <BrightcoveIframe\n          ref={iframeRef}\n          title={embedData.alt || fallbackTitle}\n          aria-label={embedData.alt || fallbackTitle}\n          {...getIframeProps(embedData, [])}\n          allow=\"fullscreen; encrypted-media\"\n        />\n      </EmbedErrorPlaceholder>\n    );\n  }\n  const { data } = embed;\n\n  const linkedVideoId = isNumeric(data.link?.text) ? data.link?.text : undefined;\n\n  const originalVideoProps = getIframeProps(embedData, data.sources);\n  const alternativeVideoProps = linkedVideoId\n    ? getIframeProps({ ...embedData, videoid: linkedVideoId }, data.sources)\n    : undefined;\n\n  const licenseProps = licenseAttributes(data?.copyright?.license.license, lang, embedData.pageUrl);\n\n  const title = data.name?.trim() ? `${t(\"embed.type.video\")}: ${data.name}` : fallbackTitle;\n\n  return (\n    <Figure data-embed-type=\"brightcove\" {...licenseProps}>\n      <div className=\"brightcove-video\">\n        <BrightcoveIframe\n          ref={iframeRef}\n          className=\"original\"\n          title={title}\n          aria-label={title}\n          {...(alternativeVideoProps && !showOriginalVideo ? alternativeVideoProps : originalVideoProps)}\n          allow=\"fullscreen; encrypted-media\"\n        />\n      </div>\n      <EmbedByline type=\"video\" copyright={data.copyright!} description={parsedDescription}>\n        <div>\n          {!!linkedVideoId && (\n            <LinkedVideoButton size=\"small\" variant=\"secondary\" onClick={() => setShowOriginalVideo((p) => !p)}>\n              {t(`figure.button.${!showOriginalVideo ? \"original\" : \"alternative\"}`)}\n            </LinkedVideoButton>\n          )}\n        </div>\n      </EmbedByline>\n    </Figure>\n  );\n};\n\nexport default BrightcoveEmbed;\n"],"mappings":";;;;;;;;;;;;AAyBA,MAAM,oBAAoB,qCAAOA,0BAAQ,EACvC,MAAM,EACJ,kBAAkB,UACnB,EACF,EAAC;AAEF,MAAM,mBAAmB,qCAAO,UAAU,EACxC,MAAM;CACJ,QAAQ;CACR,QAAQ;CACR,OAAO;AACR,EACF,EAAC;AASF,MAAa,YAAY,CAACC,WAAgB,OAAO,MAAM,QAAQ,OAAO,WAAW,MAAM,CAAC;AAExF,MAAM,iBAAiB,CAACC,MAA2BC,YAAqC;CACtF,MAAM,EAAE,SAAS,SAAS,SAAS,WAAW,GAAG;CAEjD,MAAM,SAAS,QAAQ,OAAO,CAAC,MAAM,EAAE,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,GAAG,MAAM,EAAG,SAAU,EAAE,OAAQ,CAAC;AAErG,QAAO;EACL,MAAM,iCAAiC,QAAQ,GAAG,OAAO,8BAA8B,QAAQ;EAC/F,QAAQ,QAAQ,UAAU;EAC1B,OAAO,QAAQ,SAAS;CACzB;AACF;AACD,MAAM,kBAAkB,CAAC,EAAE,OAAO,gBAAgB,WAAW,MAAa,KAAK;CAC7E,MAAM,CAAC,mBAAmB,qBAAqB,GAAG,oBAAS,KAAK;CAChE,MAAM,EAAE,GAAG,GAAG,mCAAgB;CAC9B,MAAM,YAAY,kBAA0B,KAAK;CACjD,MAAM,EAAE,WAAW,GAAG;CACtB,MAAM,iBAAiB,EAAE,EAAE,mBAAmB,CAAC,IAAI,UAAU,QAAQ;CACrE,MAAM,oBAAoB,mBAAQ,MAAM;AACtC,MAAI,MAAM,UAAU,WAAW,kBAAkB,UAC/C,QAAO,MAAM,UAAU,UAAU,+BAAM,MAAM,UAAU,QAAQ;WACtD,MAAM,WAAW,aAAa,MAAM,KAAK,YAClD,QAAO,+BAAM,MAAM,KAAK,YAAY;CAEvC,GAAE,CAAC,OAAO,aAAc,EAAC;AAE1B,sBAAU,MAAM;EACd,MAAM,SAAS,UAAU;AACzB,MAAI,QAAQ;GACV,MAAM,CAAC,OAAO,OAAO,GAAG,CAAC,SAAS,OAAO,MAAM,EAAE,SAAS,OAAO,OAAO,AAAC;AACzE,UAAO,MAAM,eAAe,EAAE,MAAM,GAAG,OAAO;AAC9C,UAAO,QAAQ;AACf,UAAO,SAAS;EACjB;CACF,GAAE,CAAE,EAAC;AACN,KAAI,MAAM,WAAW,QACnB,wBACE,2BAACC;EAAsB,MAAK;4BAC1B,2BAAC;GACC,KAAK;GACL,OAAO,UAAU,OAAO;GACxB,cAAY,UAAU,OAAO;GAC7B,GAAI,eAAe,WAAW,CAAE,EAAC;GACjC,OAAM;IACN;GACoB;CAG5B,MAAM,EAAE,MAAM,GAAG;CAEjB,MAAM,gBAAgB,UAAU,KAAK,MAAM,KAAK,GAAG,KAAK,MAAM;CAE9D,MAAM,qBAAqB,eAAe,WAAW,KAAK,QAAQ;CAClE,MAAM,wBAAwB,gBAC1B,eAAe;EAAE,GAAG;EAAW,SAAS;CAAe,GAAE,KAAK,QAAQ;CAG1E,MAAM,eAAe,8GAAkB,MAAM,WAAW,QAAQ,SAAS,MAAM,UAAU,QAAQ;CAEjG,MAAM,QAAQ,KAAK,MAAM,MAAM,IAAI,EAAE,EAAE,mBAAmB,CAAC,IAAI,KAAK,KAAK,IAAI;AAE7E,wBACE,4BAACC;EAAO,mBAAgB;EAAa,GAAI;6BACvC,2BAAC;GAAI,WAAU;6BACb,2BAAC;IACC,KAAK;IACL,WAAU;IACH;IACP,cAAY;IACZ,GAAK,0BAA0B,oBAAoB,wBAAwB;IAC3E,OAAM;KACN;IACE,kBACN,2BAACC;GAAY,MAAK;GAAQ,WAAW,KAAK;GAAY,aAAa;6BACjE,2BAAC,qBACI,iCACD,2BAAC;IAAkB,MAAK;IAAQ,SAAQ;IAAY,SAAS,MAAM,qBAAqB,CAAC,OAAO,EAAE;cAC/F,GAAG,iBAAiB,oBAAoB,aAAa,cAAc,EAAE;KACpD,GAElB;IACM;GACP;AAEZ;AAED,8BAAe"}
+{"version":3,"file":"BrightcoveEmbed.js","names":["Button","EmbedErrorPlaceholder","licenseAttributes","Figure","EmbedByline"],"sources":["../../src/Embed/BrightcoveEmbed.tsx"],"sourcesContent":["/**\n * Copyright (c) 2023-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport parse from \"html-react-parser\";\nimport { useEffect, useMemo, useRef, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Button, Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { BrightcoveEmbedData, BrightcoveMetaData, BrightcoveVideoSource } from \"@ndla/types-embed\";\nimport EmbedErrorPlaceholder from \"./EmbedErrorPlaceholder\";\nimport type { RenderContext } from \"./types\";\nimport { EmbedByline } from \"../LicenseByline/EmbedByline\";\nimport { licenseAttributes } from \"../utils/licenseAttributes\";\n\ninterface Props {\n  embed: BrightcoveMetaData;\n  renderContext?: RenderContext;\n  lang?: string;\n}\n\nconst LinkedVideoButton = styled(Button, {\n  base: {\n    marginBlockStart: \"3xsmall\",\n  },\n});\n\nconst BrightcoveIframe = styled(\"iframe\", {\n  base: {\n    border: 0,\n    height: \"auto\",\n    width: \"100%\",\n  },\n});\n\nexport const makeIframeString = (url: string, width: string | number, height: string | number, title = \"\") => {\n  const strippedWidth = typeof width === \"number\" ? width : width.replace(/\\s*px/, \"\");\n  const strippedHeight = typeof height === \"number\" ? height : height.replace(/\\s*px/, \"\");\n  const urlOrTitle = title || url;\n  return `<iframe title=\"${urlOrTitle}\" aria-label=\"${urlOrTitle}\" src=\"${url}\" width=\"${strippedWidth}\" height=\"${strippedHeight}\" allowfullscreen scrolling=\"no\" frameborder=\"0\" loading=\"lazy\"></iframe>`;\n};\n\nexport const isNumeric = (value: any) => !Number.isNaN(value - Number.parseFloat(value));\n\nconst getIframeProps = (data: BrightcoveEmbedData, sources: BrightcoveVideoSource[]) => {\n  const { account, videoid, player = \"default\" } = data;\n\n  const source = sources.filter((s) => s.width && s.height).toSorted((a, b) => a!.height! - b.height!)[0];\n\n  return {\n    src: `https://players.brightcove.net/${account}/${player}_default/index.html?videoId=${videoid}`,\n    height: source?.height ?? \"480\",\n    width: source?.width ?? \"640\",\n  };\n};\nconst BrightcoveEmbed = ({ embed, renderContext = \"article\", lang }: Props) => {\n  const [showOriginalVideo, setShowOriginalVideo] = useState(true);\n  const { t } = useTranslation();\n  const iframeRef = useRef<HTMLIFrameElement>(null);\n  const { embedData } = embed;\n  const fallbackTitle = `${t(\"embed.type.video\")}: ${embedData.videoid}`;\n  const parsedDescription = useMemo(() => {\n    if (embed.embedData.caption || renderContext === \"article\") {\n      return embed.embedData.caption ? parse(embed.embedData.caption) : undefined;\n    } else if (embed.status === \"success\" && embed.data.description) {\n      return parse(embed.data.description);\n    }\n  }, [embed, renderContext]);\n\n  useEffect(() => {\n    const iframe = iframeRef.current;\n    if (iframe) {\n      const [width, height] = [parseInt(iframe.width), parseInt(iframe.height)];\n      iframe.style.aspectRatio = `${width}/${height}`;\n      iframe.width = \"\";\n      iframe.height = \"\";\n    }\n  }, []);\n  if (embed.status === \"error\") {\n    return (\n      <EmbedErrorPlaceholder type=\"video\">\n        <BrightcoveIframe\n          ref={iframeRef}\n          title={embedData.alt || fallbackTitle}\n          aria-label={embedData.alt || fallbackTitle}\n          {...getIframeProps(embedData, [])}\n          allow=\"fullscreen; encrypted-media\"\n        />\n      </EmbedErrorPlaceholder>\n    );\n  }\n  const { data } = embed;\n\n  const linkedVideoId = isNumeric(data.link?.text) ? data.link?.text : undefined;\n\n  const originalVideoProps = getIframeProps(embedData, data.sources);\n  const alternativeVideoProps = linkedVideoId\n    ? getIframeProps({ ...embedData, videoid: linkedVideoId }, data.sources)\n    : undefined;\n\n  const licenseProps = licenseAttributes(data?.copyright?.license.license, lang, embedData.pageUrl);\n\n  const title = data.name?.trim() ? `${t(\"embed.type.video\")}: ${data.name}` : fallbackTitle;\n\n  return (\n    <Figure data-embed-type=\"brightcove\" {...licenseProps}>\n      <div className=\"brightcove-video\">\n        <BrightcoveIframe\n          ref={iframeRef}\n          className=\"original\"\n          title={title}\n          aria-label={title}\n          {...(alternativeVideoProps && !showOriginalVideo ? alternativeVideoProps : originalVideoProps)}\n          allow=\"fullscreen; encrypted-media\"\n        />\n      </div>\n      <EmbedByline type=\"video\" copyright={data.copyright!} description={parsedDescription}>\n        <div>\n          {!!linkedVideoId && (\n            <LinkedVideoButton size=\"small\" variant=\"secondary\" onClick={() => setShowOriginalVideo((p) => !p)}>\n              {t(`figure.button.${!showOriginalVideo ? \"original\" : \"alternative\"}`)}\n            </LinkedVideoButton>\n          )}\n        </div>\n      </EmbedByline>\n    </Figure>\n  );\n};\n\nexport default BrightcoveEmbed;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAyBA,MAAM,yDAA2BA,0BAAQ,EACvC,MAAM,EACJ,kBAAkB,WACnB,EACF,CAAC;AAEF,MAAM,wDAA0B,UAAU,EACxC,MAAM;CACJ,QAAQ;CACR,QAAQ;CACR,OAAO;CACR,EACF,CAAC;AASF,MAAa,aAAa,UAAe,CAAC,OAAO,MAAM,QAAQ,OAAO,WAAW,MAAM,CAAC;AAExF,MAAM,kBAAkB,MAA2B,YAAqC;CACtF,MAAM,EAAE,SAAS,SAAS,SAAS,cAAc;CAEjD,MAAM,SAAS,QAAQ,QAAQ,MAAM,EAAE,SAAS,EAAE,OAAO,CAAC,UAAU,GAAG,MAAM,EAAG,SAAU,EAAE,OAAQ,CAAC;AAErG,QAAO;EACL,KAAK,kCAAkC,QAAQ,GAAG,OAAO,8BAA8B;EACvF,QAAQ,QAAQ,UAAU;EAC1B,OAAO,QAAQ,SAAS;EACzB;;AAEH,MAAM,mBAAmB,EAAE,OAAO,gBAAgB,WAAW,WAAkB;CAC7E,MAAM,CAAC,mBAAmB,4CAAiC,KAAK;CAChE,MAAM,EAAE,yCAAsB;CAC9B,MAAM,8BAAsC,KAAK;CACjD,MAAM,EAAE,cAAc;CACtB,MAAM,gBAAgB,GAAG,EAAE,mBAAmB,CAAC,IAAI,UAAU;CAC7D,MAAM,6CAAkC;AACtC,MAAI,MAAM,UAAU,WAAW,kBAAkB,UAC/C,QAAO,MAAM,UAAU,yCAAgB,MAAM,UAAU,QAAQ,GAAG;WACzD,MAAM,WAAW,aAAa,MAAM,KAAK,YAClD,uCAAa,MAAM,KAAK,YAAY;IAErC,CAAC,OAAO,cAAc,CAAC;AAE1B,4BAAgB;EACd,MAAM,SAAS,UAAU;AACzB,MAAI,QAAQ;GACV,MAAM,CAAC,OAAO,UAAU,CAAC,SAAS,OAAO,MAAM,EAAE,SAAS,OAAO,OAAO,CAAC;AACzE,UAAO,MAAM,cAAc,GAAG,MAAM,GAAG;AACvC,UAAO,QAAQ;AACf,UAAO,SAAS;;IAEjB,EAAE,CAAC;AACN,KAAI,MAAM,WAAW,QACnB,QACE,2CAACC;EAAsB,MAAK;YAC1B,2CAAC;GACC,KAAK;GACL,OAAO,UAAU,OAAO;GACxB,cAAY,UAAU,OAAO;GAC7B,GAAI,eAAe,WAAW,EAAE,CAAC;GACjC,OAAM;IACN;GACoB;CAG5B,MAAM,EAAE,SAAS;CAEjB,MAAM,gBAAgB,UAAU,KAAK,MAAM,KAAK,GAAG,KAAK,MAAM,OAAO;CAErE,MAAM,qBAAqB,eAAe,WAAW,KAAK,QAAQ;CAClE,MAAM,wBAAwB,gBAC1B,eAAe;EAAE,GAAG;EAAW,SAAS;EAAe,EAAE,KAAK,QAAQ,GACtE;CAEJ,MAAM,eAAeC,4CAAkB,MAAM,WAAW,QAAQ,SAAS,MAAM,UAAU,QAAQ;CAEjG,MAAM,QAAQ,KAAK,MAAM,MAAM,GAAG,GAAG,EAAE,mBAAmB,CAAC,IAAI,KAAK,SAAS;AAE7E,QACE,4CAACC;EAAO,mBAAgB;EAAa,GAAI;aACvC,2CAAC;GAAI,WAAU;aACb,2CAAC;IACC,KAAK;IACL,WAAU;IACH;IACP,cAAY;IACZ,GAAK,yBAAyB,CAAC,oBAAoB,wBAAwB;IAC3E,OAAM;KACN;IACE,EACN,2CAACC;GAAY,MAAK;GAAQ,WAAW,KAAK;GAAY,aAAa;aACjE,2CAAC,mBACE,CAAC,CAAC,iBACD,2CAAC;IAAkB,MAAK;IAAQ,SAAQ;IAAY,eAAe,sBAAsB,MAAM,CAAC,EAAE;cAC/F,EAAE,iBAAiB,CAAC,oBAAoB,aAAa,gBAAgB;KACpD,GAElB;IACM;GACP;;AAIb,8BAAe"}

package/lib/Embed/CodeEmbed.js

@@ -1,13 +1,19 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_EmbedErrorPlaceholder = require('./EmbedErrorPlaceholder.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_CodeBlock_CodeBlock = require('../CodeBlock/CodeBlock.js');
-const require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_CodeBlock_codeLanguageOptions = require('../CodeBlock/codeLanguageOptions.js');
-const react = require_rolldown_runtime.__toESM(require("react"));
-const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
-const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
-const react_i18next = require_rolldown_runtime.__toESM(require("react-i18next"));
-const __ndla_icons = require_rolldown_runtime.__toESM(require("@ndla/icons"));
-const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
+const require_EmbedErrorPlaceholder = require('./EmbedErrorPlaceholder.js');
+const require_CodeBlock = require('../CodeBlock/CodeBlock.js');
+const require_codeLanguageOptions = require('../CodeBlock/codeLanguageOptions.js');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let __ndla_primitives = require("@ndla/primitives");
+__ndla_primitives = require_rolldown_runtime.__toESM(__ndla_primitives);
+let __ndla_styled_system_jsx = require("@ndla/styled-system/jsx");
+__ndla_styled_system_jsx = require_rolldown_runtime.__toESM(__ndla_styled_system_jsx);
+let react_i18next = require("react-i18next");
+react_i18next = require_rolldown_runtime.__toESM(react_i18next);
+let __ndla_icons = require("@ndla/icons");
+__ndla_icons = require_rolldown_runtime.__toESM(__ndla_icons);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 
 //#region src/Embed/CodeEmbed.tsx
 const StyledFigCaption = (0, __ndla_styled_system_jsx.styled)("figcaption", { base: {
@@ -19,9 +25,8 @@ const StyledFigure = (0, __ndla_styled_system_jsx.styled)(__ndla_primitives.Figu
 	"& > *:not(:where(:first-child))": { marginBlockStart: "xsmall" }
 } });
 const getTitleFromFormat = (format) => {
-	const selectedLanguage = require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_CodeBlock_codeLanguageOptions.codeLanguageOptions.find((item) => item.format === format);
+	const selectedLanguage = require_codeLanguageOptions.codeLanguageOptions.find((item) => item.format === format);
 	if (selectedLanguage) return selectedLanguage.title;
-	return;
 };
 const CodeEmbed = ({ embed }) => {
 	const [isCopied, setIsCopied] = (0, react.useState)(false);
@@ -34,12 +39,12 @@ const CodeEmbed = ({ embed }) => {
 			};
 		}
 	}, [isCopied]);
-	if (embed.status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_Embed_EmbedErrorPlaceholder.EmbedErrorPlaceholder_default, { type: "code" });
+	if (embed.status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EmbedErrorPlaceholder.default, { type: "code" });
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(StyledFigure, {
 		"data-embed-type": "code-block",
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledFigCaption, { children: embed.embedData.title || getTitleFromFormat(embed.embedData.codeFormat) }),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require__Users_jec_code_ndla_frontend_packages_packages_ndla_ui_src_CodeBlock_CodeBlock.CodeBlock_default, {
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_CodeBlock.default, {
 				highlightedCode: embed.status === "success" ? embed.data.highlightedCode : "",
 				format: embed.embedData.codeFormat
 			}),
@@ -59,5 +64,5 @@ const CodeEmbed = ({ embed }) => {
 var CodeEmbed_default = CodeEmbed;
 
 //#endregion
-exports.CodeEmbed_default = CodeEmbed_default;
+exports.default = CodeEmbed_default;
 //# sourceMappingURL=CodeEmbed.js.map

package/lib/Embed/CodeEmbed.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodeEmbed.js","names":["Figure","format: string","item: ICodeLangugeOption","EmbedErrorPlaceholder","CodeBlock","Button","CheckLine","FileCopyLine"],"sources":["../../src/Embed/CodeEmbed.tsx"],"sourcesContent":["/**\n * Copyright (c) 2023-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { useEffect, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { FileCopyLine, CheckLine } from \"@ndla/icons\";\nimport { Button, Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { CodeMetaData } from \"@ndla/types-embed\";\nimport EmbedErrorPlaceholder from \"./EmbedErrorPlaceholder\";\nimport { CodeBlock, codeLanguageOptions } from \"../CodeBlock\";\nimport type { ICodeLangugeOption } from \"../CodeBlock/codeLanguageOptions\";\n\ninterface Props {\n  embed: CodeMetaData;\n}\n\nconst StyledFigCaption = styled(\"figcaption\", {\n  base: {\n    textStyle: \"label.large\",\n    fontWeight: \"bold\",\n  },\n});\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    clear: \"both\",\n    // We apply margin here to allow for the float and size props on figure to work as intended.\n    \"& > *:not(:where(:first-child))\": {\n      marginBlockStart: \"xsmall\",\n    },\n  },\n});\n\nconst getTitleFromFormat = (format: string) => {\n  const selectedLanguage = codeLanguageOptions.find((item: ICodeLangugeOption) => item.format === format);\n  if (selectedLanguage) {\n    return selectedLanguage.title;\n  }\n  return;\n};\n\nconst CodeEmbed = ({ embed }: Props) => {\n  const [isCopied, setIsCopied] = useState(false);\n  const { t } = useTranslation();\n\n  useEffect(() => {\n    if (isCopied) {\n      const timer = setInterval(() => setIsCopied(false), 3000);\n      // ensure interval is cleared - also if unmounted\n      return () => {\n        clearTimeout(timer);\n      };\n    }\n  }, [isCopied]);\n\n  if (embed.status === \"error\") {\n    return <EmbedErrorPlaceholder type=\"code\" />;\n  }\n\n  return (\n    <StyledFigure data-embed-type=\"code-block\">\n      <StyledFigCaption>{embed.embedData.title || getTitleFromFormat(embed.embedData.codeFormat)}</StyledFigCaption>\n      <CodeBlock\n        highlightedCode={embed.status === \"success\" ? embed.data.highlightedCode : \"\"}\n        format={embed.embedData.codeFormat}\n      />\n      <Button\n        variant=\"secondary\"\n        onClick={async () => {\n          if (embed.status === \"success\") {\n            try {\n              await navigator.clipboard.writeText(embed.data.decodedContent);\n              setIsCopied(true);\n            } catch {\n              // do nothing\n            }\n          }\n        }}\n      >\n        {isCopied ? <CheckLine /> : <FileCopyLine />}\n        {isCopied ? t(\"codeBlock.copiedCode\") : t(\"codeBlock.copyCode\")}\n      </Button>\n    </StyledFigure>\n  );\n};\n\nexport default CodeEmbed;\n"],"mappings":";;;;;;;;;;;;AAsBA,MAAM,mBAAmB,qCAAO,cAAc,EAC5C,MAAM;CACJ,WAAW;CACX,YAAY;AACb,EACF,EAAC;AAEF,MAAM,eAAe,qCAAOA,0BAAQ,EAClC,MAAM;CACJ,OAAO;CAEP,mCAAmC,EACjC,kBAAkB,SACnB;AACF,EACF,EAAC;AAEF,MAAM,qBAAqB,CAACC,WAAmB;CAC7C,MAAM,mBAAmB,sHAAoB,KAAK,CAACC,SAA6B,KAAK,WAAW,OAAO;AACvG,KAAI,iBACF,QAAO,iBAAiB;AAE1B;AACD;AAED,MAAM,YAAY,CAAC,EAAE,OAAc,KAAK;CACtC,MAAM,CAAC,UAAU,YAAY,GAAG,oBAAS,MAAM;CAC/C,MAAM,EAAE,GAAG,GAAG,mCAAgB;AAE9B,sBAAU,MAAM;AACd,MAAI,UAAU;GACZ,MAAM,QAAQ,YAAY,MAAM,YAAY,MAAM,EAAE,IAAK;AAEzD,UAAO,MAAM;AACX,iBAAa,MAAM;GACpB;EACF;CACF,GAAE,CAAC,QAAS,EAAC;AAEd,KAAI,MAAM,WAAW,QACnB,wBAAO,2BAACC,iIAAsB,MAAK,SAAS;AAG9C,wBACE,4BAAC;EAAa,mBAAgB;;mBAC5B,2BAAC,8BAAkB,MAAM,UAAU,SAAS,mBAAmB,MAAM,UAAU,WAAW,GAAoB;mBAC9G,2BAACC;IACC,iBAAiB,MAAM,WAAW,YAAY,MAAM,KAAK,kBAAkB;IAC3E,QAAQ,MAAM,UAAU;KACxB;mBACF,4BAACC;IACC,SAAQ;IACR,SAAS,YAAY;AACnB,SAAI,MAAM,WAAW,UACnB,KAAI;AACF,YAAM,UAAU,UAAU,UAAU,MAAM,KAAK,eAAe;AAC9D,kBAAY,KAAK;KAClB,QAAO,CAEP;IAEJ;eAEA,2BAAW,2BAACC,2BAAY,mBAAG,2BAACC,8BAAe,EAC3C,WAAW,EAAE,uBAAuB,GAAG,EAAE,qBAAqB;KACxD;;GACI;AAElB;AAED,wBAAe"}
+{"version":3,"file":"CodeEmbed.js","names":["Figure","codeLanguageOptions","EmbedErrorPlaceholder","CodeBlock","Button","CheckLine","FileCopyLine"],"sources":["../../src/Embed/CodeEmbed.tsx"],"sourcesContent":["/**\n * Copyright (c) 2023-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { useEffect, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { FileCopyLine, CheckLine } from \"@ndla/icons\";\nimport { Button, Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { CodeMetaData } from \"@ndla/types-embed\";\nimport EmbedErrorPlaceholder from \"./EmbedErrorPlaceholder\";\nimport CodeBlock from \"../CodeBlock/CodeBlock\";\nimport { codeLanguageOptions, type ICodeLangugeOption } from \"../CodeBlock/codeLanguageOptions\";\n\ninterface Props {\n  embed: CodeMetaData;\n}\n\nconst StyledFigCaption = styled(\"figcaption\", {\n  base: {\n    textStyle: \"label.large\",\n    fontWeight: \"bold\",\n  },\n});\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    clear: \"both\",\n    // We apply margin here to allow for the float and size props on figure to work as intended.\n    \"& > *:not(:where(:first-child))\": {\n      marginBlockStart: \"xsmall\",\n    },\n  },\n});\n\nconst getTitleFromFormat = (format: string) => {\n  const selectedLanguage = codeLanguageOptions.find((item: ICodeLangugeOption) => item.format === format);\n  if (selectedLanguage) {\n    return selectedLanguage.title;\n  }\n  return;\n};\n\nconst CodeEmbed = ({ embed }: Props) => {\n  const [isCopied, setIsCopied] = useState(false);\n  const { t } = useTranslation();\n\n  useEffect(() => {\n    if (isCopied) {\n      const timer = setInterval(() => setIsCopied(false), 3000);\n      // ensure interval is cleared - also if unmounted\n      return () => {\n        clearTimeout(timer);\n      };\n    }\n  }, [isCopied]);\n\n  if (embed.status === \"error\") {\n    return <EmbedErrorPlaceholder type=\"code\" />;\n  }\n\n  return (\n    <StyledFigure data-embed-type=\"code-block\">\n      <StyledFigCaption>{embed.embedData.title || getTitleFromFormat(embed.embedData.codeFormat)}</StyledFigCaption>\n      <CodeBlock\n        highlightedCode={embed.status === \"success\" ? embed.data.highlightedCode : \"\"}\n        format={embed.embedData.codeFormat}\n      />\n      <Button\n        variant=\"secondary\"\n        onClick={async () => {\n          if (embed.status === \"success\") {\n            try {\n              await navigator.clipboard.writeText(embed.data.decodedContent);\n              setIsCopied(true);\n            } catch {\n              // do nothing\n            }\n          }\n        }}\n      >\n        {isCopied ? <CheckLine /> : <FileCopyLine />}\n        {isCopied ? t(\"codeBlock.copiedCode\") : t(\"codeBlock.copyCode\")}\n      </Button>\n    </StyledFigure>\n  );\n};\n\nexport default CodeEmbed;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAsBA,MAAM,wDAA0B,cAAc,EAC5C,MAAM;CACJ,WAAW;CACX,YAAY;CACb,EACF,CAAC;AAEF,MAAM,oDAAsBA,0BAAQ,EAClC,MAAM;CACJ,OAAO;CAEP,mCAAmC,EACjC,kBAAkB,UACnB;CACF,EACF,CAAC;AAEF,MAAM,sBAAsB,WAAmB;CAC7C,MAAM,mBAAmBC,gDAAoB,MAAM,SAA6B,KAAK,WAAW,OAAO;AACvG,KAAI,iBACF,QAAO,iBAAiB;;AAK5B,MAAM,aAAa,EAAE,YAAmB;CACtC,MAAM,CAAC,UAAU,mCAAwB,MAAM;CAC/C,MAAM,EAAE,yCAAsB;AAE9B,4BAAgB;AACd,MAAI,UAAU;GACZ,MAAM,QAAQ,kBAAkB,YAAY,MAAM,EAAE,IAAK;AAEzD,gBAAa;AACX,iBAAa,MAAM;;;IAGtB,CAAC,SAAS,CAAC;AAEd,KAAI,MAAM,WAAW,QACnB,QAAO,2CAACC,yCAAsB,MAAK,SAAS;AAG9C,QACE,4CAAC;EAAa,mBAAgB;;GAC5B,2CAAC,8BAAkB,MAAM,UAAU,SAAS,mBAAmB,MAAM,UAAU,WAAW,GAAoB;GAC9G,2CAACC;IACC,iBAAiB,MAAM,WAAW,YAAY,MAAM,KAAK,kBAAkB;IAC3E,QAAQ,MAAM,UAAU;KACxB;GACF,4CAACC;IACC,SAAQ;IACR,SAAS,YAAY;AACnB,SAAI,MAAM,WAAW,UACnB,KAAI;AACF,YAAM,UAAU,UAAU,UAAU,MAAM,KAAK,eAAe;AAC9D,kBAAY,KAAK;aACX;;eAMX,WAAW,2CAACC,2BAAY,GAAG,2CAACC,8BAAe,EAC3C,WAAW,EAAE,uBAAuB,GAAG,EAAE,qBAAqB;KACxD;;GACI;;AAInB,wBAAe"}