@ndla/ui 56.0.148-alpha.0 → 56.0.150-alpha.0

package/es/Concept/Concept.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Concept.mjs","names":["ImageEmbed","BrightcoveEmbed","H5pEmbed","IframeEmbed","ExternalEmbed"],"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,eAAe,OAAO,QAAQ,EAClC,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACN,EACF,CAAC;AAEF,MAAM,iBAAiB,OAAO,OAAO,EACnC,MAAM;CACJ,WAAW;CACX,SAAS;CACT,OAAO,EACL,SAAS,UACV;CACF,EACF,CAAC;AAEF,MAAa,UAAU,YACpB,EAAE,WAAW,eAAe,MAAM,UAAU,OAAO,QAAQ,WAAY,GAAG,QAAQ,QAAQ;CACzF,MAAM,eAAe,kBAAkB,WAAW,SAAS,SAAS,MAAM,OAAO;AAEjF,QACE,qBAAC;EAAkB;EAAK,GAAI;EAAM,GAAI;;GACpC,qBAAC;IAAqB;eACnB,CAAC,CAAC,SACD,8CACE,oBAAC,iBAAG,QAAU,EACb,SACA,EAEJ;KACc;GAChB,eAAe,aAAa,UAC3B,oBAACA;IAAW,OAAO;IAAqB;IAAkB;KAAc,GACtE,eAAe,aAAa,eAC9B,oBAACC,2BAAgB,OAAO,gBAAiB,GACvC,eAAe,aAAa,QAC9B,oBAACC,oBAAS,OAAO,gBAAiB,GAChC,eAAe,aAAa,WAC9B,oBAACC,uBAAY,OAAO,gBAAiB,GACnC,eAAe,aAAa,aAC9B,oBAACC,yBAAc,OAAO,gBAAiB,GACrC;GACH,CAAC,CAAC,aAAa,oBAAC;IAAuB;IAAW,MAAK;KAAY;;GACvD;EAGpB"}
+{"version":3,"file":"Concept.mjs","names":[],"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,eAAe,OAAO,QAAQ,EAClC,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACN,EACF,CAAC;AAEF,MAAM,iBAAiB,OAAO,OAAO,EACnC,MAAM;CACJ,WAAW;CACX,SAAS;CACT,OAAO,EACL,SAAS,UACV;CACF,EACF,CAAC;AAEF,MAAa,UAAU,YACpB,EAAE,WAAW,eAAe,MAAM,UAAU,OAAO,QAAQ,WAAY,GAAG,QAAQ,QAAQ;CACzF,MAAM,eAAe,kBAAkB,WAAW,SAAS,SAAS,MAAM,OAAO;AAEjF,QACE,qBAAC;EAAkB;EAAK,GAAI;EAAM,GAAI;;GACpC,qBAAC;IAAqB;eACnB,CAAC,CAAC,SACD,8CACE,oBAAC,iBAAG,QAAU,EACb,SACA,EAEJ;KACc;GAChB,eAAe,aAAa,UAC3B,oBAAC;IAAW,OAAO;IAAqB;IAAkB;KAAc,GACtE,eAAe,aAAa,eAC9B,oBAAC,mBAAgB,OAAO,gBAAiB,GACvC,eAAe,aAAa,QAC9B,oBAAC,YAAS,OAAO,gBAAiB,GAChC,eAAe,aAAa,WAC9B,oBAAC,eAAY,OAAO,gBAAiB,GACnC,eAAe,aAAa,aAC9B,oBAAC,iBAAc,OAAO,gBAAiB,GACrC;GACH,CAAC,CAAC,aAAa,oBAAC;IAAuB;IAAW,MAAK;KAAY;;GACvD;EAGpB"}

package/es/CopyParagraphButton/CopyParagraphButton.mjs

@@ -56,8 +56,7 @@ const CopyParagraphButton = ({ children, copyText, lang }) => {
 		})]
 	});
 };
-var CopyParagraphButton_default = CopyParagraphButton;
 
 //#endregion
-export { CopyParagraphButton_default as default };
+export { CopyParagraphButton };
 //# sourceMappingURL=CopyParagraphButton.mjs.map

package/es/CopyParagraphButton/CopyParagraphButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CopyParagraphButton.mjs","names":[],"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,OAAO,OAAO,EACjC,MAAM;CACJ,UAAU;CACV,QAAQ,EACN,wBAAwB;EACtB,SAAS;EACT,QAAQ;EACT,EACF;CACF,EACF,CAAC;AAEF,MAAM,mBAAmB,OAAO,YAAY,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,gBAAgB,SAAS,MAAM;CACjD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,iBAAiB,cAAc,mBAAmB,SAAS,QAAQ,MAAM,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC;AAEjG,iBAAgB;AACd,MAAI,UACF,kBAAiB,aAAa,MAAM,EAAE,IAAK;IAE5C,CAAC,UAAU,CAAC;CAEf,MAAM,cAAc,YAAY,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,qBAAC;EAAa,mBAAgB;aAC5B,oBAAC;GACC,SAAQ;GACR,oBAAiB;GACjB,SAAS;GACT,OAAO;GACP,cAAY,GAAG,QAAQ,IAAI;aAE3B,oBAAC,eAAa;IACG,EACnB,oBAAC;GAAG,IAAI;GAAgB,UAAU;GAAU;GACzC;IACE;GACQ;;AAInB,kCAAe"}
+{"version":3,"file":"CopyParagraphButton.mjs","names":[],"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}\nexport const 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"],"mappings":";;;;;;;;AAcA,MAAM,eAAe,OAAO,OAAO,EACjC,MAAM;CACJ,UAAU;CACV,QAAQ,EACN,wBAAwB;EACtB,SAAS;EACT,QAAQ;EACT,EACF;CACF,EACF,CAAC;AAEF,MAAM,mBAAmB,OAAO,YAAY,EAC1C,MAAM;CACJ,UAAU;CACV,MAAM;CACN,KAAK;CACL,SAAS;CACT,QAAQ;CACR,sCAAsC,EACpC,SAAS,KACV;CACF,EACF,CAAC;AAQF,MAAa,uBAAuB,EAAE,UAAU,UAAU,WAAkB;CAC1E,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;CACjD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,iBAAiB,cAAc,mBAAmB,SAAS,QAAQ,MAAM,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC;AAEjG,iBAAgB;AACd,MAAI,UACF,kBAAiB,aAAa,MAAM,EAAE,IAAK;IAE5C,CAAC,UAAU,CAAC;CAEf,MAAM,cAAc,YAAY,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,qBAAC;EAAa,mBAAgB;aAC5B,oBAAC;GACC,SAAQ;GACR,oBAAiB;GACjB,SAAS;GACT,OAAO;GACP,cAAY,GAAG,QAAQ,IAAI;aAE3B,oBAAC,eAAa;IACG,EACnB,oBAAC;GAAG,IAAI;GAAgB,UAAU;GAAU;GACzC;IACE;GACQ"}

package/es/Embed/AudioEmbed.mjs

@@ -1,7 +1,7 @@
 import { EmbedByline } from "../LicenseByline/EmbedByline.mjs";
-import EmbedErrorPlaceholder_default from "./EmbedErrorPlaceholder.mjs";
+import { EmbedErrorPlaceholder } from "./EmbedErrorPlaceholder.mjs";
 import { licenseAttributes } from "../utils/licenseAttributes.mjs";
-import AudioPlayer_default from "../AudioPlayer/AudioPlayer.mjs";
+import { AudioPlayer } from "../AudioPlayer/AudioPlayer.mjs";
 import { Figure } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -10,9 +10,9 @@ import { jsx, jsxs } from "react/jsx-runtime";
 const StyledFigure = styled(Figure, { base: { clear: "both" } });
 const AudioEmbed = ({ embed, lang }) => {
 	const type = embed.embedData.type === "standard" ? "audio" : "podcast";
-	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder_default, { type });
+	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder, { type });
 	const { data, embedData } = embed;
-	if (embedData.type === "minimal") return /* @__PURE__ */ jsx(AudioPlayer_default, {
+	if (embedData.type === "minimal") return /* @__PURE__ */ jsx(AudioPlayer, {
 		speech: true,
 		src: data.audioFile.url,
 		title: data.title.title
@@ -31,7 +31,7 @@ const AudioEmbed = ({ embed, lang }) => {
 		lang,
 		"data-embed-type": type,
 		...licenseProps,
-		children: [/* @__PURE__ */ jsx(AudioPlayer_default, {
+		children: [/* @__PURE__ */ jsx(AudioPlayer, {
 			description: data.podcastMeta?.introduction ?? "",
 			img,
 			src: data.audioFile.url,
@@ -45,8 +45,7 @@ const AudioEmbed = ({ embed, lang }) => {
 		})]
 	});
 };
-var AudioEmbed_default = AudioEmbed;
 
 //#endregion
-export { AudioEmbed_default as default };
+export { AudioEmbed };
 //# sourceMappingURL=AudioEmbed.mjs.map

package/es/Embed/AudioEmbed.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AudioEmbed.mjs","names":["EmbedErrorPlaceholder","AudioPlayer"],"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,eAAe,OAAO,QAAQ,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,oBAACA,iCAA4B,OAAQ;CAG9C,MAAM,EAAE,MAAM,cAAc;AAE5B,KAAI,UAAU,SAAS,UACrB,QAAO,oBAACC;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,eAAe,kBAAkB,KAAK,UAAU,QAAQ,SAAS,MAAM,UAAU,IAAI;AAE3F,QACE,qBAAC;EAAmB;EAAM,mBAAiB;EAAM,GAAI;aACnD,oBAACA;GACC,aAAa,KAAK,aAAa,gBAAgB;GAC1C;GACL,KAAK,KAAK,UAAU;GACpB,aACE,KAAK,YAAY,WAAW,SAC1B,oBAAC,SAAI,yBAAyB,EAAE,QAAQ,KAAK,WAAW,YAAY,GAAI,GACtE;GAEN,OAAO,KAAK,MAAM;GACR;IACV,EACF,oBAAC;GACC,OAAO;GACP,MAAM,KAAK,cAAc,aAAa,UAAU;GAChD,WAAW,MAAM,KAAK;IACtB;GACW;;AAInB,yBAAe"}
+{"version":3,"file":"AudioEmbed.mjs","names":[],"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\nexport const 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"],"mappings":";;;;;;;;;AAiBA,MAAM,eAAe,OAAO,QAAQ,EAClC,MAAM,EACJ,OAAO,QACR,EACF,CAAC;AAaF,MAAa,cAAc,EAAE,OAAO,WAAkB;CACpD,MAAM,OAAO,MAAM,UAAU,SAAS,aAAa,UAAU;AAC7D,KAAI,MAAM,WAAW,QACnB,QAAO,oBAAC,yBAA4B,OAAQ;CAG9C,MAAM,EAAE,MAAM,cAAc;AAE5B,KAAI,UAAU,SAAS,UACrB,QAAO,oBAAC;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,eAAe,kBAAkB,KAAK,UAAU,QAAQ,SAAS,MAAM,UAAU,IAAI;AAE3F,QACE,qBAAC;EAAmB;EAAM,mBAAiB;EAAM,GAAI;aACnD,oBAAC;GACC,aAAa,KAAK,aAAa,gBAAgB;GAC1C;GACL,KAAK,KAAK,UAAU;GACpB,aACE,KAAK,YAAY,WAAW,SAC1B,oBAAC,SAAI,yBAAyB,EAAE,QAAQ,KAAK,WAAW,YAAY,GAAI,GACtE;GAEN,OAAO,KAAK,MAAM;GACR;IACV,EACF,oBAAC;GACC,OAAO;GACP,MAAM,KAAK,cAAc,aAAa,UAAU;GAChD,WAAW,MAAM,KAAK;IACtB;GACW"}

package/es/Embed/BrightcoveEmbed.mjs

@@ -1,5 +1,5 @@
 import { EmbedByline } from "../LicenseByline/EmbedByline.mjs";
-import EmbedErrorPlaceholder_default from "./EmbedErrorPlaceholder.mjs";
+import { EmbedErrorPlaceholder } from "./EmbedErrorPlaceholder.mjs";
 import { licenseAttributes } from "../utils/licenseAttributes.mjs";
 import { useEffect, useMemo, useRef, useState } from "react";
 import { Button, Figure } from "@ndla/primitives";
@@ -44,7 +44,7 @@ const BrightcoveEmbed = ({ embed, renderContext = "article", lang }) => {
 			iframe.height = "";
 		}
 	}, []);
-	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder_default, {
+	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder, {
 		type: "video",
 		children: /* @__PURE__ */ jsx(BrightcoveIframe, {
 			ref: iframeRef,
@@ -89,8 +89,7 @@ const BrightcoveEmbed = ({ embed, renderContext = "article", lang }) => {
 		})]
 	});
 };
-var BrightcoveEmbed_default = BrightcoveEmbed;
 
 //#endregion
-export { BrightcoveEmbed_default as default };
+export { BrightcoveEmbed };
 //# sourceMappingURL=BrightcoveEmbed.mjs.map

package/es/Embed/BrightcoveEmbed.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BrightcoveEmbed.mjs","names":["EmbedErrorPlaceholder"],"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,oBAAoB,OAAO,QAAQ,EACvC,MAAM,EACJ,kBAAkB,WACnB,EACF,CAAC;AAEF,MAAM,mBAAmB,OAAO,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,wBAAwB,SAAS,KAAK;CAChE,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,YAAY,OAA0B,KAAK;CACjD,MAAM,EAAE,cAAc;CACtB,MAAM,gBAAgB,GAAG,EAAE,mBAAmB,CAAC,IAAI,UAAU;CAC7D,MAAM,oBAAoB,cAAc;AACtC,MAAI,MAAM,UAAU,WAAW,kBAAkB,UAC/C,QAAO,MAAM,UAAU,UAAU,MAAM,MAAM,UAAU,QAAQ,GAAG;WACzD,MAAM,WAAW,aAAa,MAAM,KAAK,YAClD,QAAO,MAAM,MAAM,KAAK,YAAY;IAErC,CAAC,OAAO,cAAc,CAAC;AAE1B,iBAAgB;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,oBAACA;EAAsB,MAAK;YAC1B,oBAAC;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,eAAe,kBAAkB,MAAM,WAAW,QAAQ,SAAS,MAAM,UAAU,QAAQ;CAEjG,MAAM,QAAQ,KAAK,MAAM,MAAM,GAAG,GAAG,EAAE,mBAAmB,CAAC,IAAI,KAAK,SAAS;AAE7E,QACE,qBAAC;EAAO,mBAAgB;EAAa,GAAI;aACvC,oBAAC;GAAI,WAAU;aACb,oBAAC;IACC,KAAK;IACL,WAAU;IACH;IACP,cAAY;IACZ,GAAK,yBAAyB,CAAC,oBAAoB,wBAAwB;IAC3E,OAAM;KACN;IACE,EACN,oBAAC;GAAY,MAAK;GAAQ,WAAW,KAAK;GAAY,aAAa;aACjE,oBAAC,mBACE,CAAC,CAAC,iBACD,oBAAC;IAAkB,MAAK;IAAQ,SAAQ;IAAY,eAAe,sBAAsB,MAAM,CAAC,EAAE;cAC/F,EAAE,iBAAiB,CAAC,oBAAoB,aAAa,gBAAgB;KACpD,GAElB;IACM;GACP;;AAIb,8BAAe"}
+{"version":3,"file":"BrightcoveEmbed.mjs","names":[],"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};\nexport const 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"],"mappings":";;;;;;;;;;;AAyBA,MAAM,oBAAoB,OAAO,QAAQ,EACvC,MAAM,EACJ,kBAAkB,WACnB,EACF,CAAC;AAEF,MAAM,mBAAmB,OAAO,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,MAAa,mBAAmB,EAAE,OAAO,gBAAgB,WAAW,WAAkB;CACpF,MAAM,CAAC,mBAAmB,wBAAwB,SAAS,KAAK;CAChE,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,YAAY,OAA0B,KAAK;CACjD,MAAM,EAAE,cAAc;CACtB,MAAM,gBAAgB,GAAG,EAAE,mBAAmB,CAAC,IAAI,UAAU;CAC7D,MAAM,oBAAoB,cAAc;AACtC,MAAI,MAAM,UAAU,WAAW,kBAAkB,UAC/C,QAAO,MAAM,UAAU,UAAU,MAAM,MAAM,UAAU,QAAQ,GAAG;WACzD,MAAM,WAAW,aAAa,MAAM,KAAK,YAClD,QAAO,MAAM,MAAM,KAAK,YAAY;IAErC,CAAC,OAAO,cAAc,CAAC;AAE1B,iBAAgB;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,oBAAC;EAAsB,MAAK;YAC1B,oBAAC;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,eAAe,kBAAkB,MAAM,WAAW,QAAQ,SAAS,MAAM,UAAU,QAAQ;CAEjG,MAAM,QAAQ,KAAK,MAAM,MAAM,GAAG,GAAG,EAAE,mBAAmB,CAAC,IAAI,KAAK,SAAS;AAE7E,QACE,qBAAC;EAAO,mBAAgB;EAAa,GAAI;aACvC,oBAAC;GAAI,WAAU;aACb,oBAAC;IACC,KAAK;IACL,WAAU;IACH;IACP,cAAY;IACZ,GAAK,yBAAyB,CAAC,oBAAoB,wBAAwB;IAC3E,OAAM;KACN;IACE,EACN,oBAAC;GAAY,MAAK;GAAQ,WAAW,KAAK;GAAY,aAAa;aACjE,oBAAC,mBACE,CAAC,CAAC,iBACD,oBAAC;IAAkB,MAAK;IAAQ,SAAQ;IAAY,eAAe,sBAAsB,MAAM,CAAC,EAAE;cAC/F,EAAE,iBAAiB,CAAC,oBAAoB,aAAa,gBAAgB;KACpD,GAElB;IACM;GACP"}

package/es/Embed/CodeEmbed.mjs

@@ -1,5 +1,5 @@
-import EmbedErrorPlaceholder_default from "./EmbedErrorPlaceholder.mjs";
-import CodeBlock_default from "../CodeBlock/CodeBlock.mjs";
+import { EmbedErrorPlaceholder } from "./EmbedErrorPlaceholder.mjs";
+import { CodeBlock } from "../CodeBlock/CodeBlock.mjs";
 import { codeLanguageOptions } from "../CodeBlock/codeLanguageOptions.mjs";
 import { useEffect, useState } from "react";
 import { Button, Figure } from "@ndla/primitives";
@@ -32,12 +32,12 @@ const CodeEmbed = ({ embed }) => {
 			};
 		}
 	}, [isCopied]);
-	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder_default, { type: "code" });
+	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder, { type: "code" });
 	return /* @__PURE__ */ jsxs(StyledFigure, {
 		"data-embed-type": "code-block",
 		children: [
 			/* @__PURE__ */ jsx(StyledFigCaption, { children: embed.embedData.title || getTitleFromFormat(embed.embedData.codeFormat) }),
-			/* @__PURE__ */ jsx(CodeBlock_default, {
+			/* @__PURE__ */ jsx(CodeBlock, {
 				highlightedCode: embed.status === "success" ? embed.data.highlightedCode : "",
 				format: embed.embedData.codeFormat
 			}),
@@ -54,8 +54,7 @@ const CodeEmbed = ({ embed }) => {
 		]
 	});
 };
-var CodeEmbed_default = CodeEmbed;
 
 //#endregion
-export { CodeEmbed_default as default };
+export { CodeEmbed };
 //# sourceMappingURL=CodeEmbed.mjs.map

package/es/Embed/CodeEmbed.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CodeEmbed.mjs","names":["EmbedErrorPlaceholder","CodeBlock"],"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,mBAAmB,OAAO,cAAc,EAC5C,MAAM;CACJ,WAAW;CACX,YAAY;CACb,EACF,CAAC;AAEF,MAAM,eAAe,OAAO,QAAQ,EAClC,MAAM;CACJ,OAAO;CAEP,mCAAmC,EACjC,kBAAkB,UACnB;CACF,EACF,CAAC;AAEF,MAAM,sBAAsB,WAAmB;CAC7C,MAAM,mBAAmB,oBAAoB,MAAM,SAA6B,KAAK,WAAW,OAAO;AACvG,KAAI,iBACF,QAAO,iBAAiB;;AAK5B,MAAM,aAAa,EAAE,YAAmB;CACtC,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM;CAC/C,MAAM,EAAE,MAAM,gBAAgB;AAE9B,iBAAgB;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,oBAACA,iCAAsB,MAAK,SAAS;AAG9C,QACE,qBAAC;EAAa,mBAAgB;;GAC5B,oBAAC,8BAAkB,MAAM,UAAU,SAAS,mBAAmB,MAAM,UAAU,WAAW,GAAoB;GAC9G,oBAACC;IACC,iBAAiB,MAAM,WAAW,YAAY,MAAM,KAAK,kBAAkB;IAC3E,QAAQ,MAAM,UAAU;KACxB;GACF,qBAAC;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,oBAAC,cAAY,GAAG,oBAAC,iBAAe,EAC3C,WAAW,EAAE,uBAAuB,GAAG,EAAE,qBAAqB;KACxD;;GACI;;AAInB,wBAAe"}
+{"version":3,"file":"CodeEmbed.mjs","names":[],"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\nexport const 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"],"mappings":";;;;;;;;;;;AAsBA,MAAM,mBAAmB,OAAO,cAAc,EAC5C,MAAM;CACJ,WAAW;CACX,YAAY;CACb,EACF,CAAC;AAEF,MAAM,eAAe,OAAO,QAAQ,EAClC,MAAM;CACJ,OAAO;CAEP,mCAAmC,EACjC,kBAAkB,UACnB;CACF,EACF,CAAC;AAEF,MAAM,sBAAsB,WAAmB;CAC7C,MAAM,mBAAmB,oBAAoB,MAAM,SAA6B,KAAK,WAAW,OAAO;AACvG,KAAI,iBACF,QAAO,iBAAiB;;AAK5B,MAAa,aAAa,EAAE,YAAmB;CAC7C,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM;CAC/C,MAAM,EAAE,MAAM,gBAAgB;AAE9B,iBAAgB;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,oBAAC,yBAAsB,MAAK,SAAS;AAG9C,QACE,qBAAC;EAAa,mBAAgB;;GAC5B,oBAAC,8BAAkB,MAAM,UAAU,SAAS,mBAAmB,MAAM,UAAU,WAAW,GAAoB;GAC9G,oBAAC;IACC,iBAAiB,MAAM,WAAW,YAAY,MAAM,KAAK,kBAAkB;IAC3E,QAAQ,MAAM,UAAU;KACxB;GACF,qBAAC;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,oBAAC,cAAY,GAAG,oBAAC,iBAAe,EAC3C,WAAW,EAAE,uBAAuB,GAAG,EAAE,qBAAqB;KACxD;;GACI"}

package/es/Embed/ConceptEmbed.mjs

@@ -1,4 +1,4 @@
-import EmbedErrorPlaceholder_default from "./EmbedErrorPlaceholder.mjs";
+import { EmbedErrorPlaceholder } from "./EmbedErrorPlaceholder.mjs";
 import { Concept } from "../Concept/Concept.mjs";
 import { ConceptInlineTriggerButton } from "./ConceptInlineTriggerButton.mjs";
 import { GlossEmbed } from "./GlossEmbed.mjs";
@@ -22,7 +22,7 @@ const ConceptEmbed = ({ embed, renderContext, lang, previewAlt, children }) => {
 	}, [embed]);
 	const parsedTitle = useMemo(() => embed.status === "success" ? parse(embed.data.concept.title.htmlTitle) : void 0, [embed]);
 	if (embed.status === "error" && embed.embedData.type === "inline") return /* @__PURE__ */ jsx("span", { children });
-	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder_default, { type: "gloss" });
+	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder, { type: "gloss" });
 	const { concept, visualElement } = embed.data;
 	if (embed.data.concept.glossData) return /* @__PURE__ */ jsx(GlossEmbed, { embed });
 	if (embed.embedData.type === "inline") return /* @__PURE__ */ jsx(InlineConcept, {

package/es/Embed/ConceptEmbed.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ConceptEmbed.mjs","names":["EmbedErrorPlaceholder"],"sources":["../../src/Embed/ConceptEmbed.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 parse from \"html-react-parser\";\nimport { forwardRef, useMemo, useRef, type ReactNode } from \"react\";\nimport { Portal } from \"@ark-ui/react\";\nimport { PopoverContent, PopoverRoot, PopoverTrigger } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { ConceptMetaData } from \"@ndla/types-embed\";\nimport { ConceptInlineTriggerButton } from \"./ConceptInlineTriggerButton\";\nimport EmbedErrorPlaceholder from \"./EmbedErrorPlaceholder\";\nimport { GlossEmbed } from \"./GlossEmbed\";\nimport type { RenderContext } from \"./types\";\nimport { Concept, type ConceptProps } from \"../Concept/Concept\";\n\ninterface BaseProps {\n  renderContext?: RenderContext;\n  lang?: string;\n  previewAlt?: boolean;\n}\n\ninterface Props extends BaseProps {\n  embed: ConceptMetaData;\n  children?: ReactNode;\n}\n\nconst StyledPopoverContent = styled(PopoverContent, {\n  base: {\n    width: \"surface.xlarge\",\n    maxHeight: \"50vh\",\n    overflowY: \"auto\",\n  },\n});\n\nexport const ConceptEmbed = ({ embed, renderContext, lang, previewAlt, children }: Props) => {\n  const parsedContent = useMemo(() => {\n    if (embed.status === \"error\" || !embed.data.concept.content) return undefined;\n    return parse(embed.data.concept.content.htmlContent);\n  }, [embed]);\n\n  const parsedTitle = useMemo(\n    () => (embed.status === \"success\" ? parse(embed.data.concept.title.htmlTitle) : undefined),\n    [embed],\n  );\n\n  if (embed.status === \"error\" && embed.embedData.type === \"inline\") {\n    return <span>{children}</span>;\n  }\n  if (embed.status === \"error\") {\n    // TODO: This could be either concept or gloss. We don't know if it errors out. :)\n    return <EmbedErrorPlaceholder type=\"gloss\" />;\n  }\n\n  const { concept, visualElement } = embed.data;\n\n  // TODO: Consider whether we should do this in article-converter instead.\n  if (embed.data.concept.glossData) {\n    return <GlossEmbed embed={embed} />;\n  }\n\n  if (embed.embedData.type === \"inline\") {\n    return (\n      <InlineConcept\n        previewAlt={previewAlt}\n        linkContent={children}\n        copyright={concept.copyright}\n        visualElement={visualElement}\n        lang={lang}\n        title={parsedTitle}\n        source={concept.source}\n      >\n        {parsedContent}\n      </InlineConcept>\n    );\n  }\n\n  return (\n    <BlockConcept\n      previewAlt={previewAlt}\n      copyright={concept.copyright}\n      visualElement={visualElement}\n      lang={lang}\n      title={renderContext === \"embed\" ? undefined : parsedTitle}\n      source={concept.source}\n    >\n      {parsedContent}\n    </BlockConcept>\n  );\n};\n\nexport interface InlineConceptProps extends ConceptProps, BaseProps {\n  linkContent?: ReactNode;\n  source?: string;\n}\n\nexport const InlineConcept = forwardRef<HTMLSpanElement, InlineConceptProps>(\n  ({ linkContent, copyright, visualElement, previewAlt, lang, children, title, source, ...rest }, ref) => {\n    const contentRef = useRef<HTMLDivElement>(null);\n    return (\n      <PopoverRoot initialFocusEl={() => contentRef.current}>\n        {/* @ts-expect-error placing ref and rest on popover trigger somehow removes a bug where the popover target becomes a bit bigger */}\n        <PopoverTrigger asChild ref={ref} {...rest}>\n          <ConceptInlineTriggerButton>{linkContent}</ConceptInlineTriggerButton>\n        </PopoverTrigger>\n        <Portal>\n          <StyledPopoverContent ref={contentRef}>\n            <Concept\n              copyright={copyright}\n              visualElement={visualElement}\n              title={title}\n              lang={lang}\n              source={source}\n              previewAlt={previewAlt}\n            >\n              {children}\n            </Concept>\n          </StyledPopoverContent>\n        </Portal>\n      </PopoverRoot>\n    );\n  },\n);\n\nexport interface BlockConceptProps extends ConceptProps {}\n\nexport const BlockConcept = forwardRef<HTMLElement, BlockConceptProps>((props, ref) => (\n  <Concept {...props} data-embed-type=\"concept\" ref={ref} />\n));\n"],"mappings":";;;;;;;;;;;;AA+BA,MAAM,uBAAuB,OAAO,gBAAgB,EAClD,MAAM;CACJ,OAAO;CACP,WAAW;CACX,WAAW;CACZ,EACF,CAAC;AAEF,MAAa,gBAAgB,EAAE,OAAO,eAAe,MAAM,YAAY,eAAsB;CAC3F,MAAM,gBAAgB,cAAc;AAClC,MAAI,MAAM,WAAW,WAAW,CAAC,MAAM,KAAK,QAAQ,QAAS,QAAO;AACpE,SAAO,MAAM,MAAM,KAAK,QAAQ,QAAQ,YAAY;IACnD,CAAC,MAAM,CAAC;CAEX,MAAM,cAAc,cACX,MAAM,WAAW,YAAY,MAAM,MAAM,KAAK,QAAQ,MAAM,UAAU,GAAG,QAChF,CAAC,MAAM,CACR;AAED,KAAI,MAAM,WAAW,WAAW,MAAM,UAAU,SAAS,SACvD,QAAO,oBAAC,UAAM,WAAgB;AAEhC,KAAI,MAAM,WAAW,QAEnB,QAAO,oBAACA,iCAAsB,MAAK,UAAU;CAG/C,MAAM,EAAE,SAAS,kBAAkB,MAAM;AAGzC,KAAI,MAAM,KAAK,QAAQ,UACrB,QAAO,oBAAC,cAAkB,QAAS;AAGrC,KAAI,MAAM,UAAU,SAAS,SAC3B,QACE,oBAAC;EACa;EACZ,aAAa;EACb,WAAW,QAAQ;EACJ;EACT;EACN,OAAO;EACP,QAAQ,QAAQ;YAEf;GACa;AAIpB,QACE,oBAAC;EACa;EACZ,WAAW,QAAQ;EACJ;EACT;EACN,OAAO,kBAAkB,UAAU,SAAY;EAC/C,QAAQ,QAAQ;YAEf;GACY;;AASnB,MAAa,gBAAgB,YAC1B,EAAE,aAAa,WAAW,eAAe,YAAY,MAAM,UAAU,OAAO,OAAQ,GAAG,QAAQ,QAAQ;CACtG,MAAM,aAAa,OAAuB,KAAK;AAC/C,QACE,qBAAC;EAAY,sBAAsB,WAAW;aAE5C,oBAAC;GAAe;GAAa;GAAK,GAAI;aACpC,oBAAC,wCAA4B,cAAyC;IACvD,EACjB,oBAAC,oBACC,oBAAC;GAAqB,KAAK;aACzB,oBAAC;IACY;IACI;IACR;IACD;IACE;IACI;IAEX;KACO;IACW,GAChB;GACG;EAGnB;AAID,MAAa,eAAe,YAA4C,OAAO,QAC7E,oBAAC;CAAQ,GAAI;CAAO,mBAAgB;CAAe;EAAO,CAC1D"}
+{"version":3,"file":"ConceptEmbed.mjs","names":[],"sources":["../../src/Embed/ConceptEmbed.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 parse from \"html-react-parser\";\nimport { forwardRef, useMemo, useRef, type ReactNode } from \"react\";\nimport { Portal } from \"@ark-ui/react\";\nimport { PopoverContent, PopoverRoot, PopoverTrigger } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { ConceptMetaData } from \"@ndla/types-embed\";\nimport { ConceptInlineTriggerButton } from \"./ConceptInlineTriggerButton\";\nimport { EmbedErrorPlaceholder } from \"./EmbedErrorPlaceholder\";\nimport { GlossEmbed } from \"./GlossEmbed\";\nimport type { RenderContext } from \"./types\";\nimport { Concept, type ConceptProps } from \"../Concept/Concept\";\n\ninterface BaseProps {\n  renderContext?: RenderContext;\n  lang?: string;\n  previewAlt?: boolean;\n}\n\ninterface Props extends BaseProps {\n  embed: ConceptMetaData;\n  children?: ReactNode;\n}\n\nconst StyledPopoverContent = styled(PopoverContent, {\n  base: {\n    width: \"surface.xlarge\",\n    maxHeight: \"50vh\",\n    overflowY: \"auto\",\n  },\n});\n\nexport const ConceptEmbed = ({ embed, renderContext, lang, previewAlt, children }: Props) => {\n  const parsedContent = useMemo(() => {\n    if (embed.status === \"error\" || !embed.data.concept.content) return undefined;\n    return parse(embed.data.concept.content.htmlContent);\n  }, [embed]);\n\n  const parsedTitle = useMemo(\n    () => (embed.status === \"success\" ? parse(embed.data.concept.title.htmlTitle) : undefined),\n    [embed],\n  );\n\n  if (embed.status === \"error\" && embed.embedData.type === \"inline\") {\n    return <span>{children}</span>;\n  }\n  if (embed.status === \"error\") {\n    // TODO: This could be either concept or gloss. We don't know if it errors out. :)\n    return <EmbedErrorPlaceholder type=\"gloss\" />;\n  }\n\n  const { concept, visualElement } = embed.data;\n\n  // TODO: Consider whether we should do this in article-converter instead.\n  if (embed.data.concept.glossData) {\n    return <GlossEmbed embed={embed} />;\n  }\n\n  if (embed.embedData.type === \"inline\") {\n    return (\n      <InlineConcept\n        previewAlt={previewAlt}\n        linkContent={children}\n        copyright={concept.copyright}\n        visualElement={visualElement}\n        lang={lang}\n        title={parsedTitle}\n        source={concept.source}\n      >\n        {parsedContent}\n      </InlineConcept>\n    );\n  }\n\n  return (\n    <BlockConcept\n      previewAlt={previewAlt}\n      copyright={concept.copyright}\n      visualElement={visualElement}\n      lang={lang}\n      title={renderContext === \"embed\" ? undefined : parsedTitle}\n      source={concept.source}\n    >\n      {parsedContent}\n    </BlockConcept>\n  );\n};\n\nexport interface InlineConceptProps extends ConceptProps, BaseProps {\n  linkContent?: ReactNode;\n  source?: string;\n}\n\nexport const InlineConcept = forwardRef<HTMLSpanElement, InlineConceptProps>(\n  ({ linkContent, copyright, visualElement, previewAlt, lang, children, title, source, ...rest }, ref) => {\n    const contentRef = useRef<HTMLDivElement>(null);\n    return (\n      <PopoverRoot initialFocusEl={() => contentRef.current}>\n        {/* @ts-expect-error placing ref and rest on popover trigger somehow removes a bug where the popover target becomes a bit bigger */}\n        <PopoverTrigger asChild ref={ref} {...rest}>\n          <ConceptInlineTriggerButton>{linkContent}</ConceptInlineTriggerButton>\n        </PopoverTrigger>\n        <Portal>\n          <StyledPopoverContent ref={contentRef}>\n            <Concept\n              copyright={copyright}\n              visualElement={visualElement}\n              title={title}\n              lang={lang}\n              source={source}\n              previewAlt={previewAlt}\n            >\n              {children}\n            </Concept>\n          </StyledPopoverContent>\n        </Portal>\n      </PopoverRoot>\n    );\n  },\n);\n\nexport interface BlockConceptProps extends ConceptProps {}\n\nexport const BlockConcept = forwardRef<HTMLElement, BlockConceptProps>((props, ref) => (\n  <Concept {...props} data-embed-type=\"concept\" ref={ref} />\n));\n"],"mappings":";;;;;;;;;;;;AA+BA,MAAM,uBAAuB,OAAO,gBAAgB,EAClD,MAAM;CACJ,OAAO;CACP,WAAW;CACX,WAAW;CACZ,EACF,CAAC;AAEF,MAAa,gBAAgB,EAAE,OAAO,eAAe,MAAM,YAAY,eAAsB;CAC3F,MAAM,gBAAgB,cAAc;AAClC,MAAI,MAAM,WAAW,WAAW,CAAC,MAAM,KAAK,QAAQ,QAAS,QAAO;AACpE,SAAO,MAAM,MAAM,KAAK,QAAQ,QAAQ,YAAY;IACnD,CAAC,MAAM,CAAC;CAEX,MAAM,cAAc,cACX,MAAM,WAAW,YAAY,MAAM,MAAM,KAAK,QAAQ,MAAM,UAAU,GAAG,QAChF,CAAC,MAAM,CACR;AAED,KAAI,MAAM,WAAW,WAAW,MAAM,UAAU,SAAS,SACvD,QAAO,oBAAC,UAAM,WAAgB;AAEhC,KAAI,MAAM,WAAW,QAEnB,QAAO,oBAAC,yBAAsB,MAAK,UAAU;CAG/C,MAAM,EAAE,SAAS,kBAAkB,MAAM;AAGzC,KAAI,MAAM,KAAK,QAAQ,UACrB,QAAO,oBAAC,cAAkB,QAAS;AAGrC,KAAI,MAAM,UAAU,SAAS,SAC3B,QACE,oBAAC;EACa;EACZ,aAAa;EACb,WAAW,QAAQ;EACJ;EACT;EACN,OAAO;EACP,QAAQ,QAAQ;YAEf;GACa;AAIpB,QACE,oBAAC;EACa;EACZ,WAAW,QAAQ;EACJ;EACT;EACN,OAAO,kBAAkB,UAAU,SAAY;EAC/C,QAAQ,QAAQ;YAEf;GACY;;AASnB,MAAa,gBAAgB,YAC1B,EAAE,aAAa,WAAW,eAAe,YAAY,MAAM,UAAU,OAAO,OAAQ,GAAG,QAAQ,QAAQ;CACtG,MAAM,aAAa,OAAuB,KAAK;AAC/C,QACE,qBAAC;EAAY,sBAAsB,WAAW;aAE5C,oBAAC;GAAe;GAAa;GAAK,GAAI;aACpC,oBAAC,wCAA4B,cAAyC;IACvD,EACjB,oBAAC,oBACC,oBAAC;GAAqB,KAAK;aACzB,oBAAC;IACY;IACI;IACR;IACD;IACE;IACI;IAEX;KACO;IACW,GAChB;GACG;EAGnB;AAID,MAAa,eAAe,YAA4C,OAAO,QAC7E,oBAAC;CAAQ,GAAI;CAAO,mBAAgB;CAAe;EAAO,CAC1D"}

package/es/Embed/ContentLinkEmbed.mjs

@@ -24,8 +24,7 @@ const ContentLinkEmbed = ({ embed, isOembed, children }) => {
 		children
 	});
 };
-var ContentLinkEmbed_default = ContentLinkEmbed;
 
 //#endregion
-export { ContentLinkEmbed_default as default };
+export { ContentLinkEmbed };
 //# sourceMappingURL=ContentLinkEmbed.mjs.map

package/es/Embed/ContentLinkEmbed.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ContentLinkEmbed.mjs","names":[],"sources":["../../src/Embed/ContentLinkEmbed.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 type { ReactNode } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Text } from \"@ndla/primitives\";\nimport type { ContentLinkMetaData } from \"@ndla/types-embed\";\n\ninterface Props {\n  embed: ContentLinkMetaData;\n  isOembed?: boolean;\n  children?: ReactNode;\n}\n\nconst ContentLinkEmbed = ({ embed, isOembed, children }: Props) => {\n  const { t } = useTranslation();\n  if (embed.status === \"error\") {\n    return (\n      <Text color=\"text.error\" asChild consumeCss>\n        <span>\n          <span>{`${t(\"embed.linkError\")}: `}</span>\n          {children}\n        </span>\n      </Text>\n    );\n  }\n\n  const { embedData, data } = embed;\n\n  if (embedData.openIn === \"new-context\" || isOembed) {\n    return (\n      <a href={data.path} data-embed-type=\"content-link\" target=\"_blank\" rel=\"noopener noreferrer\">\n        {children}\n      </a>\n    );\n  }\n\n  return <a href={data.path}>{children}</a>;\n};\n\nexport default ContentLinkEmbed;\n"],"mappings":";;;;;AAmBA,MAAM,oBAAoB,EAAE,OAAO,UAAU,eAAsB;CACjE,MAAM,EAAE,MAAM,gBAAgB;AAC9B,KAAI,MAAM,WAAW,QACnB,QACE,oBAAC;EAAK,OAAM;EAAa;EAAQ;YAC/B,qBAAC,qBACC,oBAAC,oBAAM,GAAG,EAAE,kBAAkB,CAAC,MAAW,EACzC,YACI;GACF;CAIX,MAAM,EAAE,WAAW,SAAS;AAE5B,KAAI,UAAU,WAAW,iBAAiB,SACxC,QACE,oBAAC;EAAE,MAAM,KAAK;EAAM,mBAAgB;EAAe,QAAO;EAAS,KAAI;EACpE;GACC;AAIR,QAAO,oBAAC;EAAE,MAAM,KAAK;EAAO;GAAa;;AAG3C,+BAAe"}
+{"version":3,"file":"ContentLinkEmbed.mjs","names":[],"sources":["../../src/Embed/ContentLinkEmbed.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 type { ReactNode } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Text } from \"@ndla/primitives\";\nimport type { ContentLinkMetaData } from \"@ndla/types-embed\";\n\ninterface Props {\n  embed: ContentLinkMetaData;\n  isOembed?: boolean;\n  children?: ReactNode;\n}\n\nexport const ContentLinkEmbed = ({ embed, isOembed, children }: Props) => {\n  const { t } = useTranslation();\n  if (embed.status === \"error\") {\n    return (\n      <Text color=\"text.error\" asChild consumeCss>\n        <span>\n          <span>{`${t(\"embed.linkError\")}: `}</span>\n          {children}\n        </span>\n      </Text>\n    );\n  }\n\n  const { embedData, data } = embed;\n\n  if (embedData.openIn === \"new-context\" || isOembed) {\n    return (\n      <a href={data.path} data-embed-type=\"content-link\" target=\"_blank\" rel=\"noopener noreferrer\">\n        {children}\n      </a>\n    );\n  }\n\n  return <a href={data.path}>{children}</a>;\n};\n"],"mappings":";;;;;AAmBA,MAAa,oBAAoB,EAAE,OAAO,UAAU,eAAsB;CACxE,MAAM,EAAE,MAAM,gBAAgB;AAC9B,KAAI,MAAM,WAAW,QACnB,QACE,oBAAC;EAAK,OAAM;EAAa;EAAQ;YAC/B,qBAAC,qBACC,oBAAC,oBAAM,GAAG,EAAE,kBAAkB,CAAC,MAAW,EACzC,YACI;GACF;CAIX,MAAM,EAAE,WAAW,SAAS;AAE5B,KAAI,UAAU,WAAW,iBAAiB,SACxC,QACE,oBAAC;EAAE,MAAM,KAAK;EAAM,mBAAgB;EAAe,QAAO;EAAS,KAAI;EACpE;GACC;AAIR,QAAO,oBAAC;EAAE,MAAM,KAAK;EAAO;GAAa"}

package/es/Embed/CopyrightEmbed.mjs

@@ -16,8 +16,7 @@ const CopyrightEmbed = ({ embed, children }) => {
 		})]
 	});
 };
-var CopyrightEmbed_default = CopyrightEmbed;
 
 //#endregion
-export { CopyrightEmbed_default as default };
+export { CopyrightEmbed };
 //# sourceMappingURL=CopyrightEmbed.mjs.map

package/es/Embed/CopyrightEmbed.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CopyrightEmbed.mjs","names":[],"sources":["../../src/Embed/CopyrightEmbed.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 { ReactNode } from \"react\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { CopyrightMetaData } from \"@ndla/types-embed\";\nimport { EmbedByline } from \"../LicenseByline/EmbedByline\";\n\ninterface Props {\n  embed: CopyrightMetaData;\n  children?: ReactNode;\n}\n\nconst StyledCopyrightContent = styled(\"div\", {\n  base: {\n    marginBlockEnd: \"xsmall\",\n  },\n});\n\nconst CopyrightEmbed = ({ embed, children }: Props) => {\n  return (\n    <figure data-embed-type=\"copyright\">\n      <StyledCopyrightContent data-copyright-content=\"\">{children}</StyledCopyrightContent>\n      <EmbedByline type=\"copyright\" copyright={embed.embedData.copyright} />\n    </figure>\n  );\n};\n\nexport default CopyrightEmbed;\n"],"mappings":";;;;;AAkBA,MAAM,yBAAyB,OAAO,OAAO,EAC3C,MAAM,EACJ,gBAAgB,UACjB,EACF,CAAC;AAEF,MAAM,kBAAkB,EAAE,OAAO,eAAsB;AACrD,QACE,qBAAC;EAAO,mBAAgB;aACtB,oBAAC;GAAuB,0BAAuB;GAAI;IAAkC,EACrF,oBAAC;GAAY,MAAK;GAAY,WAAW,MAAM,UAAU;IAAa;GAC/D;;AAIb,6BAAe"}
+{"version":3,"file":"CopyrightEmbed.mjs","names":[],"sources":["../../src/Embed/CopyrightEmbed.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 { ReactNode } from \"react\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { CopyrightMetaData } from \"@ndla/types-embed\";\nimport { EmbedByline } from \"../LicenseByline/EmbedByline\";\n\ninterface Props {\n  embed: CopyrightMetaData;\n  children?: ReactNode;\n}\n\nconst StyledCopyrightContent = styled(\"div\", {\n  base: {\n    marginBlockEnd: \"xsmall\",\n  },\n});\n\nexport const CopyrightEmbed = ({ embed, children }: Props) => {\n  return (\n    <figure data-embed-type=\"copyright\">\n      <StyledCopyrightContent data-copyright-content=\"\">{children}</StyledCopyrightContent>\n      <EmbedByline type=\"copyright\" copyright={embed.embedData.copyright} />\n    </figure>\n  );\n};\n"],"mappings":";;;;;AAkBA,MAAM,yBAAyB,OAAO,OAAO,EAC3C,MAAM,EACJ,gBAAgB,UACjB,EACF,CAAC;AAEF,MAAa,kBAAkB,EAAE,OAAO,eAAsB;AAC5D,QACE,qBAAC;EAAO,mBAAgB;aACtB,oBAAC;GAAuB,0BAAuB;GAAI;IAAkC,EACrF,oBAAC;GAAY,MAAK;GAAY,WAAW,MAAM,UAAU;IAAa;GAC/D"}

package/es/Embed/EmbedErrorPlaceholder.mjs

@@ -36,8 +36,7 @@ const EmbedErrorPlaceholder = ({ type, children, figureType, float }) => {
 		})]
 	});
 };
-var EmbedErrorPlaceholder_default = EmbedErrorPlaceholder;
 
 //#endregion
-export { EmbedErrorPlaceholder_default as default };
+export { EmbedErrorPlaceholder };
 //# sourceMappingURL=EmbedErrorPlaceholder.mjs.map

package/es/Embed/EmbedErrorPlaceholder.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"EmbedErrorPlaceholder.mjs","names":[],"sources":["../../src/Embed/EmbedErrorPlaceholder.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 { type ReactNode } from \"react\";\nimport { ErrorWarningLine } from \"@ndla/icons\";\nimport { Figure, type FigureFloat, type FigureSize } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport { EmbedByline, type EmbedBylineErrorProps } from \"../LicenseByline/EmbedByline\";\n\ninterface Props {\n  type: EmbedBylineErrorProps[\"type\"];\n  figureType?: FigureSize;\n  float?: FigureFloat;\n  children?: ReactNode;\n}\n\nconst ErrorPlaceholder = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    background: \"background.subtle\",\n    height: \"surface.xsmall\",\n    border: \"1px solid\",\n    borderColor: \"stroke.default\",\n    borderRadius: \"xsmall\",\n    \"& svg\": {\n      height: \"5xlarge\",\n      width: \"5xlarge\",\n      fill: \"stroke.default\",\n    },\n  },\n});\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    \"& > *:not(:first-child)\": {\n      marginBlockStart: \"3xsmall\",\n    },\n  },\n});\n\nconst EmbedErrorPlaceholder = ({ type, children, figureType, float }: Props) => {\n  return (\n    <StyledFigure size={figureType} float={float} data-embed-type={type}>\n      {children ?? (\n        <ErrorPlaceholder data-embed-type={type}>\n          <ErrorWarningLine />\n        </ErrorPlaceholder>\n      )}\n      <EmbedByline error type={type} />\n    </StyledFigure>\n  );\n};\n\nexport default EmbedErrorPlaceholder;\n"],"mappings":";;;;;;;;AAqBA,MAAM,mBAAmB,OAAO,OAAO,EACrC,MAAM;CACJ,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,YAAY;CACZ,QAAQ;CACR,QAAQ;CACR,aAAa;CACb,cAAc;CACd,SAAS;EACP,QAAQ;EACR,OAAO;EACP,MAAM;EACP;CACF,EACF,CAAC;AAEF,MAAM,eAAe,OAAO,QAAQ,EAClC,MAAM,EACJ,2BAA2B,EACzB,kBAAkB,WACnB,EACF,EACF,CAAC;AAEF,MAAM,yBAAyB,EAAE,MAAM,UAAU,YAAY,YAAmB;AAC9E,QACE,qBAAC;EAAa,MAAM;EAAmB;EAAO,mBAAiB;aAC5D,YACC,oBAAC;GAAiB,mBAAiB;aACjC,oBAAC,qBAAmB;IACH,EAErB,oBAAC;GAAY;GAAY;IAAQ;GACpB;;AAInB,oCAAe"}
+{"version":3,"file":"EmbedErrorPlaceholder.mjs","names":[],"sources":["../../src/Embed/EmbedErrorPlaceholder.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 { type ReactNode } from \"react\";\nimport { ErrorWarningLine } from \"@ndla/icons\";\nimport { Figure, type FigureFloat, type FigureSize } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport { EmbedByline, type EmbedBylineErrorProps } from \"../LicenseByline/EmbedByline\";\n\ninterface Props {\n  type: EmbedBylineErrorProps[\"type\"];\n  figureType?: FigureSize;\n  float?: FigureFloat;\n  children?: ReactNode;\n}\n\nconst ErrorPlaceholder = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    background: \"background.subtle\",\n    height: \"surface.xsmall\",\n    border: \"1px solid\",\n    borderColor: \"stroke.default\",\n    borderRadius: \"xsmall\",\n    \"& svg\": {\n      height: \"5xlarge\",\n      width: \"5xlarge\",\n      fill: \"stroke.default\",\n    },\n  },\n});\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    \"& > *:not(:first-child)\": {\n      marginBlockStart: \"3xsmall\",\n    },\n  },\n});\n\nexport const EmbedErrorPlaceholder = ({ type, children, figureType, float }: Props) => {\n  return (\n    <StyledFigure size={figureType} float={float} data-embed-type={type}>\n      {children ?? (\n        <ErrorPlaceholder data-embed-type={type}>\n          <ErrorWarningLine />\n        </ErrorPlaceholder>\n      )}\n      <EmbedByline error type={type} />\n    </StyledFigure>\n  );\n};\n"],"mappings":";;;;;;;;AAqBA,MAAM,mBAAmB,OAAO,OAAO,EACrC,MAAM;CACJ,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,YAAY;CACZ,QAAQ;CACR,QAAQ;CACR,aAAa;CACb,cAAc;CACd,SAAS;EACP,QAAQ;EACR,OAAO;EACP,MAAM;EACP;CACF,EACF,CAAC;AAEF,MAAM,eAAe,OAAO,QAAQ,EAClC,MAAM,EACJ,2BAA2B,EACzB,kBAAkB,WACnB,EACF,EACF,CAAC;AAEF,MAAa,yBAAyB,EAAE,MAAM,UAAU,YAAY,YAAmB;AACrF,QACE,qBAAC;EAAa,MAAM;EAAmB;EAAO,mBAAiB;aAC5D,YACC,oBAAC;GAAiB,mBAAiB;aACjC,oBAAC,qBAAmB;IACH,EAErB,oBAAC;GAAY;GAAY;IAAQ;GACpB"}

package/es/Embed/ExternalEmbed.mjs

@@ -1,5 +1,5 @@
-import EmbedErrorPlaceholder_default from "./EmbedErrorPlaceholder.mjs";
-import ResourceBox_default from "../ResourceBox/ResourceBox.mjs";
+import { EmbedErrorPlaceholder } from "./EmbedErrorPlaceholder.mjs";
+import { ResourceBox } from "../ResourceBox/ResourceBox.mjs";
 import { useEffect, useRef } from "react";
 import { Figure } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
@@ -23,7 +23,7 @@ const ExternalEmbed = ({ embed }) => {
 			iframe.height = "";
 		}
 	}, []);
-	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder_default, { type: "external" });
+	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder, { type: "external" });
 	const { embedData, data } = embed;
 	if (embedData.type === "fullscreen") {
 		const image = {
@@ -32,7 +32,7 @@ const ExternalEmbed = ({ embed }) => {
 		};
 		return /* @__PURE__ */ jsx(Figure, {
 			"data-embed-type": "external",
-			children: /* @__PURE__ */ jsx(ResourceBox_default, {
+			children: /* @__PURE__ */ jsx(ResourceBox, {
 				image,
 				title: embedData.title ?? "",
 				url: embedData.url,
@@ -47,8 +47,7 @@ const ExternalEmbed = ({ embed }) => {
 		dangerouslySetInnerHTML: { __html: data?.oembed?.html ?? "" }
 	});
 };
-var ExternalEmbed_default = ExternalEmbed;
 
 //#endregion
-export { ExternalEmbed_default as default };
+export { ExternalEmbed };
 //# sourceMappingURL=ExternalEmbed.mjs.map

package/es/Embed/ExternalEmbed.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ExternalEmbed.mjs","names":["EmbedErrorPlaceholder","ResourceBox"],"sources":["../../src/Embed/ExternalEmbed.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, useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { OembedMetaData } from \"@ndla/types-embed\";\nimport EmbedErrorPlaceholder from \"./EmbedErrorPlaceholder\";\nimport ResourceBox from \"../ResourceBox/ResourceBox\";\n\ninterface Props {\n  embed: OembedMetaData;\n}\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    \"& iframe\": {\n      height: \"auto\",\n      width: \"100%\",\n    },\n  },\n});\n\nconst ExternalEmbed = ({ embed }: Props) => {\n  const { t } = useTranslation();\n  const figRef = useRef<HTMLElement>(null);\n\n  useEffect(() => {\n    const iframe = figRef.current?.querySelector(\"iframe\");\n    if (iframe) {\n      const [width, height] = [Number.parseInt(iframe.width), Number.parseInt(iframe.height)];\n      iframe.style.aspectRatio = `${width ? width : 16}/${height ? height : 9}`;\n      iframe.width = \"\";\n      iframe.height = \"\";\n    }\n  }, []);\n\n  if (embed.status === \"error\") {\n    return <EmbedErrorPlaceholder type=\"external\" />;\n  }\n\n  const { embedData, data } = embed;\n\n  if (embedData.type === \"fullscreen\") {\n    const image = {\n      src: data.iframeImage?.image.imageUrl,\n      alt: embedData.alt !== undefined ? embedData.alt : (data.iframeImage?.alttext?.alttext ?? \"\"),\n    };\n    return (\n      <Figure data-embed-type=\"external\">\n        <ResourceBox\n          image={image}\n          title={embedData.title ?? \"\"}\n          url={embedData.url}\n          caption={embedData.caption ?? \"\"}\n          buttonText={t(\"license.other.itemImage.ariaLabel\")}\n        />\n      </Figure>\n    );\n  }\n\n  return (\n    <StyledFigure\n      data-embed-type=\"external\"\n      ref={figRef}\n      dangerouslySetInnerHTML={{ __html: data?.oembed?.html ?? \"\" }}\n    />\n  );\n};\nexport default ExternalEmbed;\n"],"mappings":";;;;;;;;;AAoBA,MAAM,eAAe,OAAO,QAAQ,EAClC,MAAM,EACJ,YAAY;CACV,QAAQ;CACR,OAAO;CACR,EACF,EACF,CAAC;AAEF,MAAM,iBAAiB,EAAE,YAAmB;CAC1C,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,SAAS,OAAoB,KAAK;AAExC,iBAAgB;EACd,MAAM,SAAS,OAAO,SAAS,cAAc,SAAS;AACtD,MAAI,QAAQ;GACV,MAAM,CAAC,OAAO,UAAU,CAAC,OAAO,SAAS,OAAO,MAAM,EAAE,OAAO,SAAS,OAAO,OAAO,CAAC;AACvF,UAAO,MAAM,cAAc,GAAG,QAAQ,QAAQ,GAAG,GAAG,SAAS,SAAS;AACtE,UAAO,QAAQ;AACf,UAAO,SAAS;;IAEjB,EAAE,CAAC;AAEN,KAAI,MAAM,WAAW,QACnB,QAAO,oBAACA,iCAAsB,MAAK,aAAa;CAGlD,MAAM,EAAE,WAAW,SAAS;AAE5B,KAAI,UAAU,SAAS,cAAc;EACnC,MAAM,QAAQ;GACZ,KAAK,KAAK,aAAa,MAAM;GAC7B,KAAK,UAAU,QAAQ,SAAY,UAAU,MAAO,KAAK,aAAa,SAAS,WAAW;GAC3F;AACD,SACE,oBAAC;GAAO,mBAAgB;aACtB,oBAACC;IACQ;IACP,OAAO,UAAU,SAAS;IAC1B,KAAK,UAAU;IACf,SAAS,UAAU,WAAW;IAC9B,YAAY,EAAE,oCAAoC;KAClD;IACK;;AAIb,QACE,oBAAC;EACC,mBAAgB;EAChB,KAAK;EACL,yBAAyB,EAAE,QAAQ,MAAM,QAAQ,QAAQ,IAAI;GAC7D;;AAGN,4BAAe"}
+{"version":3,"file":"ExternalEmbed.mjs","names":[],"sources":["../../src/Embed/ExternalEmbed.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, useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { OembedMetaData } from \"@ndla/types-embed\";\nimport { EmbedErrorPlaceholder } from \"./EmbedErrorPlaceholder\";\nimport { ResourceBox } from \"../ResourceBox/ResourceBox\";\n\ninterface Props {\n  embed: OembedMetaData;\n}\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    \"& iframe\": {\n      height: \"auto\",\n      width: \"100%\",\n    },\n  },\n});\n\nexport const ExternalEmbed = ({ embed }: Props) => {\n  const { t } = useTranslation();\n  const figRef = useRef<HTMLElement>(null);\n\n  useEffect(() => {\n    const iframe = figRef.current?.querySelector(\"iframe\");\n    if (iframe) {\n      const [width, height] = [Number.parseInt(iframe.width), Number.parseInt(iframe.height)];\n      iframe.style.aspectRatio = `${width ? width : 16}/${height ? height : 9}`;\n      iframe.width = \"\";\n      iframe.height = \"\";\n    }\n  }, []);\n\n  if (embed.status === \"error\") {\n    return <EmbedErrorPlaceholder type=\"external\" />;\n  }\n\n  const { embedData, data } = embed;\n\n  if (embedData.type === \"fullscreen\") {\n    const image = {\n      src: data.iframeImage?.image.imageUrl,\n      alt: embedData.alt !== undefined ? embedData.alt : (data.iframeImage?.alttext?.alttext ?? \"\"),\n    };\n    return (\n      <Figure data-embed-type=\"external\">\n        <ResourceBox\n          image={image}\n          title={embedData.title ?? \"\"}\n          url={embedData.url}\n          caption={embedData.caption ?? \"\"}\n          buttonText={t(\"license.other.itemImage.ariaLabel\")}\n        />\n      </Figure>\n    );\n  }\n\n  return (\n    <StyledFigure\n      data-embed-type=\"external\"\n      ref={figRef}\n      dangerouslySetInnerHTML={{ __html: data?.oembed?.html ?? \"\" }}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;AAoBA,MAAM,eAAe,OAAO,QAAQ,EAClC,MAAM,EACJ,YAAY;CACV,QAAQ;CACR,OAAO;CACR,EACF,EACF,CAAC;AAEF,MAAa,iBAAiB,EAAE,YAAmB;CACjD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,SAAS,OAAoB,KAAK;AAExC,iBAAgB;EACd,MAAM,SAAS,OAAO,SAAS,cAAc,SAAS;AACtD,MAAI,QAAQ;GACV,MAAM,CAAC,OAAO,UAAU,CAAC,OAAO,SAAS,OAAO,MAAM,EAAE,OAAO,SAAS,OAAO,OAAO,CAAC;AACvF,UAAO,MAAM,cAAc,GAAG,QAAQ,QAAQ,GAAG,GAAG,SAAS,SAAS;AACtE,UAAO,QAAQ;AACf,UAAO,SAAS;;IAEjB,EAAE,CAAC;AAEN,KAAI,MAAM,WAAW,QACnB,QAAO,oBAAC,yBAAsB,MAAK,aAAa;CAGlD,MAAM,EAAE,WAAW,SAAS;AAE5B,KAAI,UAAU,SAAS,cAAc;EACnC,MAAM,QAAQ;GACZ,KAAK,KAAK,aAAa,MAAM;GAC7B,KAAK,UAAU,QAAQ,SAAY,UAAU,MAAO,KAAK,aAAa,SAAS,WAAW;GAC3F;AACD,SACE,oBAAC;GAAO,mBAAgB;aACtB,oBAAC;IACQ;IACP,OAAO,UAAU,SAAS;IAC1B,KAAK,UAAU;IACf,SAAS,UAAU,WAAW;IAC9B,YAAY,EAAE,oCAAoC;KAClD;IACK;;AAIb,QACE,oBAAC;EACC,mBAAgB;EAChB,KAAK;EACL,yBAAyB,EAAE,QAAQ,MAAM,QAAQ,QAAQ,IAAI;GAC7D"}

package/es/Embed/FootnoteEmbed.mjs

@@ -20,8 +20,7 @@ const FootnoteEmbed = ({ embed }) => {
 		}) })
 	});
 };
-var FootnoteEmbed_default = FootnoteEmbed;
 
 //#endregion
-export { FootnoteEmbed_default as default };
+export { FootnoteEmbed };
 //# sourceMappingURL=FootnoteEmbed.mjs.map

package/es/Embed/FootnoteEmbed.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FootnoteEmbed.mjs","names":[],"sources":["../../src/Embed/FootnoteEmbed.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 { useTranslation } from \"react-i18next\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { FootnoteMetaData } from \"@ndla/types-embed\";\n\ninterface Props {\n  embed: FootnoteMetaData;\n}\n\nconst StyledSup = styled(\"sup\", {\n  base: {\n    \"& a\": {\n      textStyle: \"label.xsmall\",\n      marginInlineStart: \"1\",\n    },\n  },\n});\n\nconst FootnoteEmbed = ({ embed }: Props) => {\n  const { t } = useTranslation();\n  if (embed.status === \"error\") {\n    return <div>{t(\"error\")}</div>;\n  }\n\n  return (\n    <span id={`ref${embed.data.entryNum}`} data-embed-type=\"footnote\">\n      <StyledSup>\n        <a href={`#note${embed.data.entryNum}`} target=\"_self\">{`[${embed.data.entryNum}]`}</a>\n      </StyledSup>\n    </span>\n  );\n};\n\nexport default FootnoteEmbed;\n"],"mappings":";;;;;AAgBA,MAAM,YAAY,OAAO,OAAO,EAC9B,MAAM,EACJ,OAAO;CACL,WAAW;CACX,mBAAmB;CACpB,EACF,EACF,CAAC;AAEF,MAAM,iBAAiB,EAAE,YAAmB;CAC1C,MAAM,EAAE,MAAM,gBAAgB;AAC9B,KAAI,MAAM,WAAW,QACnB,QAAO,oBAAC,mBAAK,EAAE,QAAQ,GAAO;AAGhC,QACE,oBAAC;EAAK,IAAI,MAAM,MAAM,KAAK;EAAY,mBAAgB;YACrD,oBAAC,uBACC,oBAAC;GAAE,MAAM,QAAQ,MAAM,KAAK;GAAY,QAAO;aAAS,IAAI,MAAM,KAAK,SAAS;IAAO,GAC7E;GACP;;AAIX,4BAAe"}
+{"version":3,"file":"FootnoteEmbed.mjs","names":[],"sources":["../../src/Embed/FootnoteEmbed.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 { useTranslation } from \"react-i18next\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { FootnoteMetaData } from \"@ndla/types-embed\";\n\ninterface Props {\n  embed: FootnoteMetaData;\n}\n\nconst StyledSup = styled(\"sup\", {\n  base: {\n    \"& a\": {\n      textStyle: \"label.xsmall\",\n      marginInlineStart: \"1\",\n    },\n  },\n});\n\nexport const FootnoteEmbed = ({ embed }: Props) => {\n  const { t } = useTranslation();\n  if (embed.status === \"error\") {\n    return <div>{t(\"error\")}</div>;\n  }\n\n  return (\n    <span id={`ref${embed.data.entryNum}`} data-embed-type=\"footnote\">\n      <StyledSup>\n        <a href={`#note${embed.data.entryNum}`} target=\"_self\">{`[${embed.data.entryNum}]`}</a>\n      </StyledSup>\n    </span>\n  );\n};\n"],"mappings":";;;;;AAgBA,MAAM,YAAY,OAAO,OAAO,EAC9B,MAAM,EACJ,OAAO;CACL,WAAW;CACX,mBAAmB;CACpB,EACF,EACF,CAAC;AAEF,MAAa,iBAAiB,EAAE,YAAmB;CACjD,MAAM,EAAE,MAAM,gBAAgB;AAC9B,KAAI,MAAM,WAAW,QACnB,QAAO,oBAAC,mBAAK,EAAE,QAAQ,GAAO;AAGhC,QACE,oBAAC;EAAK,IAAI,MAAM,MAAM,KAAK;EAAY,mBAAgB;YACrD,oBAAC,uBACC,oBAAC;GAAE,MAAM,QAAQ,MAAM,KAAK;GAAY,QAAO;aAAS,IAAI,MAAM,KAAK,SAAS;IAAO,GAC7E;GACP"}

package/es/Embed/GlossEmbed.mjs

@@ -1,6 +1,6 @@
-import EmbedErrorPlaceholder_default from "./EmbedErrorPlaceholder.mjs";
+import { EmbedErrorPlaceholder } from "./EmbedErrorPlaceholder.mjs";
 import { ConceptInlineTriggerButton } from "./ConceptInlineTriggerButton.mjs";
-import Gloss_default from "../Gloss/Gloss.mjs";
+import { Gloss } from "../Gloss/Gloss.mjs";
 import { useRef } from "react";
 import { Figure, PopoverContent, PopoverRoot, PopoverTrigger } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
@@ -12,7 +12,7 @@ const StyledPopoverContent = styled(PopoverContent, { base: { width: "surface.xl
 const GlossEmbed = ({ embed, children }) => {
 	const contentRef = useRef(null);
 	if (embed.status === "error" && embed.embedData.type === "inline") return /* @__PURE__ */ jsx("span", { children });
-	if (embed.status === "error" || !embed.data.concept.glossData) return /* @__PURE__ */ jsx(EmbedErrorPlaceholder_default, { type: "gloss" });
+	if (embed.status === "error" || !embed.data.concept.glossData) return /* @__PURE__ */ jsx(EmbedErrorPlaceholder, { type: "gloss" });
 	const { concept, visualElement } = embed.data;
 	const audio = visualElement?.status === "success" && visualElement.resource === "audio" ? {
 		src: visualElement.data.audioFile.url,
@@ -25,7 +25,7 @@ const GlossEmbed = ({ embed, children }) => {
 			children: /* @__PURE__ */ jsx(ConceptInlineTriggerButton, { children })
 		}), /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(StyledPopoverContent, {
 			ref: contentRef,
-			children: /* @__PURE__ */ jsx(Figure, { children: /* @__PURE__ */ jsx(Gloss_default, {
+			children: /* @__PURE__ */ jsx(Figure, { children: /* @__PURE__ */ jsx(Gloss, {
 				glossData: concept.glossData,
 				title: concept.title,
 				audio,
@@ -36,7 +36,7 @@ const GlossEmbed = ({ embed, children }) => {
 	});
 	return /* @__PURE__ */ jsx(Figure, {
 		"data-embed-type": "gloss",
-		children: /* @__PURE__ */ jsx(Gloss_default, {
+		children: /* @__PURE__ */ jsx(Gloss, {
 			glossData: concept.glossData,
 			title: concept.title,
 			audio,

package/es/Embed/GlossEmbed.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"GlossEmbed.mjs","names":["EmbedErrorPlaceholder","Gloss"],"sources":["../../src/Embed/GlossEmbed.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 { useRef, type ReactNode } from \"react\";\nimport { Portal } from \"@ark-ui/react\";\nimport { Figure, PopoverContent, PopoverRoot, PopoverTrigger } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { ConceptMetaData } from \"@ndla/types-embed\";\nimport { ConceptInlineTriggerButton } from \"./ConceptInlineTriggerButton\";\nimport EmbedErrorPlaceholder from \"./EmbedErrorPlaceholder\";\nimport Gloss from \"../Gloss/Gloss\";\n\ninterface Props {\n  embed: ConceptMetaData;\n  children?: ReactNode;\n}\n\nconst StyledPopoverContent = styled(PopoverContent, {\n  base: {\n    width: \"surface.xlarge\",\n  },\n});\n\nexport const GlossEmbed = ({ embed, children }: Props) => {\n  const contentRef = useRef<HTMLDivElement>(null);\n  if (embed.status === \"error\" && embed.embedData.type === \"inline\") {\n    return <span>{children}</span>;\n  }\n  if (embed.status === \"error\" || !embed.data.concept.glossData) {\n    return <EmbedErrorPlaceholder type=\"gloss\" />;\n  }\n\n  const { concept, visualElement } = embed.data;\n\n  const audio =\n    visualElement?.status === \"success\" && visualElement.resource === \"audio\"\n      ? {\n          src: visualElement.data.audioFile.url,\n          title: visualElement.data.title.title,\n        }\n      : undefined;\n\n  if (embed.embedData.type === \"inline\") {\n    return (\n      <PopoverRoot initialFocusEl={() => contentRef.current}>\n        <PopoverTrigger asChild>\n          <ConceptInlineTriggerButton>{children}</ConceptInlineTriggerButton>\n        </PopoverTrigger>\n        <Portal>\n          <StyledPopoverContent ref={contentRef}>\n            <Figure>\n              <Gloss\n                glossData={concept.glossData}\n                title={concept.title}\n                audio={audio}\n                exampleIds={embed.embedData.exampleIds}\n                exampleLangs={embed.embedData.exampleLangs}\n              />\n            </Figure>\n          </StyledPopoverContent>\n        </Portal>\n      </PopoverRoot>\n    );\n  }\n\n  return (\n    <Figure data-embed-type=\"gloss\">\n      <Gloss\n        glossData={concept.glossData}\n        title={concept.title}\n        audio={audio}\n        exampleIds={embed.embedData.exampleIds}\n        exampleLangs={embed.embedData.exampleLangs}\n        variant=\"bordered\"\n      />\n    </Figure>\n  );\n};\n"],"mappings":";;;;;;;;;;AAsBA,MAAM,uBAAuB,OAAO,gBAAgB,EAClD,MAAM,EACJ,OAAO,kBACR,EACF,CAAC;AAEF,MAAa,cAAc,EAAE,OAAO,eAAsB;CACxD,MAAM,aAAa,OAAuB,KAAK;AAC/C,KAAI,MAAM,WAAW,WAAW,MAAM,UAAU,SAAS,SACvD,QAAO,oBAAC,UAAM,WAAgB;AAEhC,KAAI,MAAM,WAAW,WAAW,CAAC,MAAM,KAAK,QAAQ,UAClD,QAAO,oBAACA,iCAAsB,MAAK,UAAU;CAG/C,MAAM,EAAE,SAAS,kBAAkB,MAAM;CAEzC,MAAM,QACJ,eAAe,WAAW,aAAa,cAAc,aAAa,UAC9D;EACE,KAAK,cAAc,KAAK,UAAU;EAClC,OAAO,cAAc,KAAK,MAAM;EACjC,GACD;AAEN,KAAI,MAAM,UAAU,SAAS,SAC3B,QACE,qBAAC;EAAY,sBAAsB,WAAW;aAC5C,oBAAC;GAAe;aACd,oBAAC,8BAA4B,WAAsC;IACpD,EACjB,oBAAC,oBACC,oBAAC;GAAqB,KAAK;aACzB,oBAAC,oBACC,oBAACC;IACC,WAAW,QAAQ;IACnB,OAAO,QAAQ;IACR;IACP,YAAY,MAAM,UAAU;IAC5B,cAAc,MAAM,UAAU;KAC9B,GACK;IACY,GAChB;GACG;AAIlB,QACE,oBAAC;EAAO,mBAAgB;YACtB,oBAACA;GACC,WAAW,QAAQ;GACnB,OAAO,QAAQ;GACR;GACP,YAAY,MAAM,UAAU;GAC5B,cAAc,MAAM,UAAU;GAC9B,SAAQ;IACR;GACK"}
+{"version":3,"file":"GlossEmbed.mjs","names":[],"sources":["../../src/Embed/GlossEmbed.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 { useRef, type ReactNode } from \"react\";\nimport { Portal } from \"@ark-ui/react\";\nimport { Figure, PopoverContent, PopoverRoot, PopoverTrigger } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { ConceptMetaData } from \"@ndla/types-embed\";\nimport { ConceptInlineTriggerButton } from \"./ConceptInlineTriggerButton\";\nimport { EmbedErrorPlaceholder } from \"./EmbedErrorPlaceholder\";\nimport { Gloss } from \"../Gloss/Gloss\";\n\ninterface Props {\n  embed: ConceptMetaData;\n  children?: ReactNode;\n}\n\nconst StyledPopoverContent = styled(PopoverContent, {\n  base: {\n    width: \"surface.xlarge\",\n  },\n});\n\nexport const GlossEmbed = ({ embed, children }: Props) => {\n  const contentRef = useRef<HTMLDivElement>(null);\n  if (embed.status === \"error\" && embed.embedData.type === \"inline\") {\n    return <span>{children}</span>;\n  }\n  if (embed.status === \"error\" || !embed.data.concept.glossData) {\n    return <EmbedErrorPlaceholder type=\"gloss\" />;\n  }\n\n  const { concept, visualElement } = embed.data;\n\n  const audio =\n    visualElement?.status === \"success\" && visualElement.resource === \"audio\"\n      ? {\n          src: visualElement.data.audioFile.url,\n          title: visualElement.data.title.title,\n        }\n      : undefined;\n\n  if (embed.embedData.type === \"inline\") {\n    return (\n      <PopoverRoot initialFocusEl={() => contentRef.current}>\n        <PopoverTrigger asChild>\n          <ConceptInlineTriggerButton>{children}</ConceptInlineTriggerButton>\n        </PopoverTrigger>\n        <Portal>\n          <StyledPopoverContent ref={contentRef}>\n            <Figure>\n              <Gloss\n                glossData={concept.glossData}\n                title={concept.title}\n                audio={audio}\n                exampleIds={embed.embedData.exampleIds}\n                exampleLangs={embed.embedData.exampleLangs}\n              />\n            </Figure>\n          </StyledPopoverContent>\n        </Portal>\n      </PopoverRoot>\n    );\n  }\n\n  return (\n    <Figure data-embed-type=\"gloss\">\n      <Gloss\n        glossData={concept.glossData}\n        title={concept.title}\n        audio={audio}\n        exampleIds={embed.embedData.exampleIds}\n        exampleLangs={embed.embedData.exampleLangs}\n        variant=\"bordered\"\n      />\n    </Figure>\n  );\n};\n"],"mappings":";;;;;;;;;;AAsBA,MAAM,uBAAuB,OAAO,gBAAgB,EAClD,MAAM,EACJ,OAAO,kBACR,EACF,CAAC;AAEF,MAAa,cAAc,EAAE,OAAO,eAAsB;CACxD,MAAM,aAAa,OAAuB,KAAK;AAC/C,KAAI,MAAM,WAAW,WAAW,MAAM,UAAU,SAAS,SACvD,QAAO,oBAAC,UAAM,WAAgB;AAEhC,KAAI,MAAM,WAAW,WAAW,CAAC,MAAM,KAAK,QAAQ,UAClD,QAAO,oBAAC,yBAAsB,MAAK,UAAU;CAG/C,MAAM,EAAE,SAAS,kBAAkB,MAAM;CAEzC,MAAM,QACJ,eAAe,WAAW,aAAa,cAAc,aAAa,UAC9D;EACE,KAAK,cAAc,KAAK,UAAU;EAClC,OAAO,cAAc,KAAK,MAAM;EACjC,GACD;AAEN,KAAI,MAAM,UAAU,SAAS,SAC3B,QACE,qBAAC;EAAY,sBAAsB,WAAW;aAC5C,oBAAC;GAAe;aACd,oBAAC,8BAA4B,WAAsC;IACpD,EACjB,oBAAC,oBACC,oBAAC;GAAqB,KAAK;aACzB,oBAAC,oBACC,oBAAC;IACC,WAAW,QAAQ;IACnB,OAAO,QAAQ;IACR;IACP,YAAY,MAAM,UAAU;IAC5B,cAAc,MAAM,UAAU;KAC9B,GACK;IACY,GAChB;GACG;AAIlB,QACE,oBAAC;EAAO,mBAAgB;YACtB,oBAAC;GACC,WAAW,QAAQ;GACnB,OAAO,QAAQ;GACR;GACP,YAAY,MAAM,UAAU;GAC5B,cAAc,MAAM,UAAU;GAC9B,SAAQ;IACR;GACK"}

package/es/Embed/H5pEmbed.mjs

@@ -1,4 +1,4 @@
-import EmbedErrorPlaceholder_default from "./EmbedErrorPlaceholder.mjs";
+import { EmbedErrorPlaceholder } from "./EmbedErrorPlaceholder.mjs";
 import { Figure } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
 import { useTranslation } from "react-i18next";
@@ -15,7 +15,7 @@ const FigureOembed = styled(Figure, { base: {
 } });
 const H5pEmbed = ({ embed }) => {
 	const { t } = useTranslation();
-	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder_default, { type: "h5p" });
+	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder, { type: "h5p" });
 	if (embed.data.oembed) return /* @__PURE__ */ jsx(FigureOembed, {
 		"data-embed-type": "h5p",
 		dangerouslySetInnerHTML: { __html: embed.data.oembed.html ?? "" }
@@ -31,8 +31,7 @@ const H5pEmbed = ({ embed }) => {
 		})
 	});
 };
-var H5pEmbed_default = H5pEmbed;
 
 //#endregion
-export { H5pEmbed_default as default };
+export { H5pEmbed };
 //# sourceMappingURL=H5pEmbed.mjs.map

package/es/Embed/H5pEmbed.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"H5pEmbed.mjs","names":["EmbedErrorPlaceholder"],"sources":["../../src/Embed/H5pEmbed.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 { useTranslation } from \"react-i18next\";\nimport { Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { H5pMetaData } from \"@ndla/types-embed\";\nimport EmbedErrorPlaceholder from \"./EmbedErrorPlaceholder\";\n\ninterface Props {\n  embed: H5pMetaData;\n}\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    \"& iframe\": {\n      height: \"auto\",\n      width: \"100%\",\n    },\n  },\n});\n\nconst FigureOembed = styled(Figure, {\n  base: {\n    width: \"100%\",\n    \"& iframe\": {\n      width: \"100%\",\n    },\n  },\n});\n\nconst H5pEmbed = ({ embed }: Props) => {\n  const { t } = useTranslation();\n  if (embed.status === \"error\") {\n    return <EmbedErrorPlaceholder type=\"h5p\" />;\n  }\n\n  if (embed.data.oembed) {\n    return <FigureOembed data-embed-type=\"h5p\" dangerouslySetInnerHTML={{ __html: embed.data.oembed.html ?? \"\" }} />;\n  }\n\n  const title = embed.embedData.title?.trim()\n    ? embed.embedData.title\n    : embed.data.h5pLicenseInformation?.h5p.title?.trim()\n      ? embed.data.h5pLicenseInformation.h5p.title\n      : embed.embedData.url;\n\n  const titleWithPrefix = `${t(\"embed.type.h5p\")}: ${title}`;\n\n  return (\n    <StyledFigure data-embed-type=\"h5p\">\n      <iframe title={titleWithPrefix} aria-label={titleWithPrefix} src={embed.embedData.url} />\n    </StyledFigure>\n  );\n};\n\nexport default H5pEmbed;\n"],"mappings":";;;;;;;AAkBA,MAAM,eAAe,OAAO,QAAQ,EAClC,MAAM,EACJ,YAAY;CACV,QAAQ;CACR,OAAO;CACR,EACF,EACF,CAAC;AAEF,MAAM,eAAe,OAAO,QAAQ,EAClC,MAAM;CACJ,OAAO;CACP,YAAY,EACV,OAAO,QACR;CACF,EACF,CAAC;AAEF,MAAM,YAAY,EAAE,YAAmB;CACrC,MAAM,EAAE,MAAM,gBAAgB;AAC9B,KAAI,MAAM,WAAW,QACnB,QAAO,oBAACA,iCAAsB,MAAK,QAAQ;AAG7C,KAAI,MAAM,KAAK,OACb,QAAO,oBAAC;EAAa,mBAAgB;EAAM,yBAAyB,EAAE,QAAQ,MAAM,KAAK,OAAO,QAAQ,IAAI;GAAI;CAGlH,MAAM,QAAQ,MAAM,UAAU,OAAO,MAAM,GACvC,MAAM,UAAU,QAChB,MAAM,KAAK,uBAAuB,IAAI,OAAO,MAAM,GACjD,MAAM,KAAK,sBAAsB,IAAI,QACrC,MAAM,UAAU;CAEtB,MAAM,kBAAkB,GAAG,EAAE,iBAAiB,CAAC,IAAI;AAEnD,QACE,oBAAC;EAAa,mBAAgB;YAC5B,oBAAC;GAAO,OAAO;GAAiB,cAAY;GAAiB,KAAK,MAAM,UAAU;IAAO;GAC5E;;AAInB,uBAAe"}
+{"version":3,"file":"H5pEmbed.mjs","names":[],"sources":["../../src/Embed/H5pEmbed.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 { useTranslation } from \"react-i18next\";\nimport { Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { H5pMetaData } from \"@ndla/types-embed\";\nimport { EmbedErrorPlaceholder } from \"./EmbedErrorPlaceholder\";\n\ninterface Props {\n  embed: H5pMetaData;\n}\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    \"& iframe\": {\n      height: \"auto\",\n      width: \"100%\",\n    },\n  },\n});\n\nconst FigureOembed = styled(Figure, {\n  base: {\n    width: \"100%\",\n    \"& iframe\": {\n      width: \"100%\",\n    },\n  },\n});\n\nexport const H5pEmbed = ({ embed }: Props) => {\n  const { t } = useTranslation();\n  if (embed.status === \"error\") {\n    return <EmbedErrorPlaceholder type=\"h5p\" />;\n  }\n\n  if (embed.data.oembed) {\n    return <FigureOembed data-embed-type=\"h5p\" dangerouslySetInnerHTML={{ __html: embed.data.oembed.html ?? \"\" }} />;\n  }\n\n  const title = embed.embedData.title?.trim()\n    ? embed.embedData.title\n    : embed.data.h5pLicenseInformation?.h5p.title?.trim()\n      ? embed.data.h5pLicenseInformation.h5p.title\n      : embed.embedData.url;\n\n  const titleWithPrefix = `${t(\"embed.type.h5p\")}: ${title}`;\n\n  return (\n    <StyledFigure data-embed-type=\"h5p\">\n      <iframe title={titleWithPrefix} aria-label={titleWithPrefix} src={embed.embedData.url} />\n    </StyledFigure>\n  );\n};\n"],"mappings":";;;;;;;AAkBA,MAAM,eAAe,OAAO,QAAQ,EAClC,MAAM,EACJ,YAAY;CACV,QAAQ;CACR,OAAO;CACR,EACF,EACF,CAAC;AAEF,MAAM,eAAe,OAAO,QAAQ,EAClC,MAAM;CACJ,OAAO;CACP,YAAY,EACV,OAAO,QACR;CACF,EACF,CAAC;AAEF,MAAa,YAAY,EAAE,YAAmB;CAC5C,MAAM,EAAE,MAAM,gBAAgB;AAC9B,KAAI,MAAM,WAAW,QACnB,QAAO,oBAAC,yBAAsB,MAAK,QAAQ;AAG7C,KAAI,MAAM,KAAK,OACb,QAAO,oBAAC;EAAa,mBAAgB;EAAM,yBAAyB,EAAE,QAAQ,MAAM,KAAK,OAAO,QAAQ,IAAI;GAAI;CAGlH,MAAM,QAAQ,MAAM,UAAU,OAAO,MAAM,GACvC,MAAM,UAAU,QAChB,MAAM,KAAK,uBAAuB,IAAI,OAAO,MAAM,GACjD,MAAM,KAAK,sBAAsB,IAAI,QACrC,MAAM,UAAU;CAEtB,MAAM,kBAAkB,GAAG,EAAE,iBAAiB,CAAC,IAAI;AAEnD,QACE,oBAAC;EAAa,mBAAgB;YAC5B,oBAAC;GAAO,OAAO;GAAiB,cAAY;GAAiB,KAAK,MAAM,UAAU;IAAO;GAC5E"}

package/es/Embed/IframeEmbed.mjs

@@ -1,5 +1,5 @@
-import EmbedErrorPlaceholder_default from "./EmbedErrorPlaceholder.mjs";
-import ResourceBox_default from "../ResourceBox/ResourceBox.mjs";
+import { EmbedErrorPlaceholder } from "./EmbedErrorPlaceholder.mjs";
+import { ResourceBox } from "../ResourceBox/ResourceBox.mjs";
 import { useEffect, useRef } from "react";
 import { Figure } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
@@ -24,7 +24,7 @@ const IframeEmbed = ({ embed }) => {
 			iframe.height = "";
 		}
 	}, []);
-	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder_default, { type: "external" });
+	if (embed.status === "error") return /* @__PURE__ */ jsx(EmbedErrorPlaceholder, { type: "external" });
 	const { embedData, data } = embed;
 	if (embedData.type === "fullscreen") {
 		const iframeImage = embed.status === "success" ? data.iframeImage : void 0;
@@ -35,7 +35,7 @@ const IframeEmbed = ({ embed }) => {
 		};
 		return /* @__PURE__ */ jsx(StyledFigure, {
 			"data-embed-type": "iframe",
-			children: /* @__PURE__ */ jsx(ResourceBox_default, {
+			children: /* @__PURE__ */ jsx(ResourceBox, {
 				image,
 				title: embedData.title ?? "",
 				url: embedData.url,
@@ -62,8 +62,7 @@ const IframeEmbed = ({ embed }) => {
 		})
 	});
 };
-var IframeEmbed_default = IframeEmbed;
 
 //#endregion
-export { IframeEmbed_default as default };
+export { IframeEmbed };
 //# sourceMappingURL=IframeEmbed.mjs.map

package/es/Embed/IframeEmbed.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"IframeEmbed.mjs","names":["width","height","EmbedErrorPlaceholder","ResourceBox"],"sources":["../../src/Embed/IframeEmbed.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, useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { IframeMetaData } from \"@ndla/types-embed\";\nimport EmbedErrorPlaceholder from \"./EmbedErrorPlaceholder\";\nimport ResourceBox from \"../ResourceBox/ResourceBox\";\n\ninterface Props {\n  embed: IframeMetaData;\n}\n\nconst StyledIframe = styled(\"iframe\", {\n  base: {\n    width: \"100%\",\n    border: 0,\n  },\n});\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    clear: \"both\",\n  },\n});\n\nconst IframeEmbed = ({ embed }: Props) => {\n  const { t } = useTranslation();\n  const iframeRef = useRef<HTMLIFrameElement>(null);\n\n  useEffect(() => {\n    const iframe = iframeRef.current;\n    if (iframe) {\n      const [width, height] = [Number.parseInt(iframe.width), Number.parseInt(iframe.height)];\n      iframe.style.aspectRatio = `${width ? width : 16}/${height ? height : 9}`;\n      iframe.width = \"\";\n      iframe.height = \"\";\n    }\n  }, []);\n\n  if (embed.status === \"error\") {\n    return <EmbedErrorPlaceholder type=\"external\" />;\n  }\n\n  const { embedData, data } = embed;\n\n  if (embedData.type === \"fullscreen\") {\n    const iframeImage = embed.status === \"success\" ? data.iframeImage : undefined;\n    const alt = embedData.alt !== undefined ? embedData.alt : iframeImage?.alttext.alttext;\n    const image = { src: iframeImage?.image.imageUrl, alt: alt ?? \"\" };\n    return (\n      <StyledFigure data-embed-type=\"iframe\">\n        <ResourceBox\n          image={image}\n          title={embedData.title ?? \"\"}\n          url={embedData.url}\n          caption={embedData.caption ?? \"\"}\n          buttonText={t(\"license.other.itemImage.ariaLabel\")}\n        />\n      </StyledFigure>\n    );\n  }\n\n  const { width, height, url } = embedData;\n\n  const strippedWidth = typeof width === \"number\" ? width : width?.replace(/\\s*px/, \"\");\n  const strippedHeight = typeof height === \"number\" ? height : height?.replace(/\\s*px/, \"\");\n  const title = `${t(\"embed.type.external\")}: ${embedData.title?.trim() ? embedData.title : url}`;\n\n  return (\n    <StyledFigure data-embed-type=\"iframe\">\n      <StyledIframe\n        ref={iframeRef}\n        title={title}\n        aria-label={title}\n        src={url}\n        width={strippedWidth}\n        height={strippedHeight}\n        allow=\"fullscreen; encrypted-media\"\n        loading=\"lazy\"\n      />\n    </StyledFigure>\n  );\n};\n\nexport default IframeEmbed;\n"],"mappings":";;;;;;;;;AAoBA,MAAM,eAAe,OAAO,UAAU,EACpC,MAAM;CACJ,OAAO;CACP,QAAQ;CACT,EACF,CAAC;AAEF,MAAM,eAAe,OAAO,QAAQ,EAClC,MAAM,EACJ,OAAO,QACR,EACF,CAAC;AAEF,MAAM,eAAe,EAAE,YAAmB;CACxC,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,YAAY,OAA0B,KAAK;AAEjD,iBAAgB;EACd,MAAM,SAAS,UAAU;AACzB,MAAI,QAAQ;GACV,MAAM,CAACA,SAAOC,YAAU,CAAC,OAAO,SAAS,OAAO,MAAM,EAAE,OAAO,SAAS,OAAO,OAAO,CAAC;AACvF,UAAO,MAAM,cAAc,GAAGD,UAAQA,UAAQ,GAAG,GAAGC,WAASA,WAAS;AACtE,UAAO,QAAQ;AACf,UAAO,SAAS;;IAEjB,EAAE,CAAC;AAEN,KAAI,MAAM,WAAW,QACnB,QAAO,oBAACC,iCAAsB,MAAK,aAAa;CAGlD,MAAM,EAAE,WAAW,SAAS;AAE5B,KAAI,UAAU,SAAS,cAAc;EACnC,MAAM,cAAc,MAAM,WAAW,YAAY,KAAK,cAAc;EACpE,MAAM,MAAM,UAAU,QAAQ,SAAY,UAAU,MAAM,aAAa,QAAQ;EAC/E,MAAM,QAAQ;GAAE,KAAK,aAAa,MAAM;GAAU,KAAK,OAAO;GAAI;AAClE,SACE,oBAAC;GAAa,mBAAgB;aAC5B,oBAACC;IACQ;IACP,OAAO,UAAU,SAAS;IAC1B,KAAK,UAAU;IACf,SAAS,UAAU,WAAW;IAC9B,YAAY,EAAE,oCAAoC;KAClD;IACW;;CAInB,MAAM,EAAE,OAAO,QAAQ,QAAQ;CAE/B,MAAM,gBAAgB,OAAO,UAAU,WAAW,QAAQ,OAAO,QAAQ,SAAS,GAAG;CACrF,MAAM,iBAAiB,OAAO,WAAW,WAAW,SAAS,QAAQ,QAAQ,SAAS,GAAG;CACzF,MAAM,QAAQ,GAAG,EAAE,sBAAsB,CAAC,IAAI,UAAU,OAAO,MAAM,GAAG,UAAU,QAAQ;AAE1F,QACE,oBAAC;EAAa,mBAAgB;YAC5B,oBAAC;GACC,KAAK;GACE;GACP,cAAY;GACZ,KAAK;GACL,OAAO;GACP,QAAQ;GACR,OAAM;GACN,SAAQ;IACR;GACW;;AAInB,0BAAe"}
+{"version":3,"file":"IframeEmbed.mjs","names":["width","height"],"sources":["../../src/Embed/IframeEmbed.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, useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Figure } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { IframeMetaData } from \"@ndla/types-embed\";\nimport { EmbedErrorPlaceholder } from \"./EmbedErrorPlaceholder\";\nimport { ResourceBox } from \"../ResourceBox/ResourceBox\";\n\ninterface Props {\n  embed: IframeMetaData;\n}\n\nconst StyledIframe = styled(\"iframe\", {\n  base: {\n    width: \"100%\",\n    border: 0,\n  },\n});\n\nconst StyledFigure = styled(Figure, {\n  base: {\n    clear: \"both\",\n  },\n});\n\nexport const IframeEmbed = ({ embed }: Props) => {\n  const { t } = useTranslation();\n  const iframeRef = useRef<HTMLIFrameElement>(null);\n\n  useEffect(() => {\n    const iframe = iframeRef.current;\n    if (iframe) {\n      const [width, height] = [Number.parseInt(iframe.width), Number.parseInt(iframe.height)];\n      iframe.style.aspectRatio = `${width ? width : 16}/${height ? height : 9}`;\n      iframe.width = \"\";\n      iframe.height = \"\";\n    }\n  }, []);\n\n  if (embed.status === \"error\") {\n    return <EmbedErrorPlaceholder type=\"external\" />;\n  }\n\n  const { embedData, data } = embed;\n\n  if (embedData.type === \"fullscreen\") {\n    const iframeImage = embed.status === \"success\" ? data.iframeImage : undefined;\n    const alt = embedData.alt !== undefined ? embedData.alt : iframeImage?.alttext.alttext;\n    const image = { src: iframeImage?.image.imageUrl, alt: alt ?? \"\" };\n    return (\n      <StyledFigure data-embed-type=\"iframe\">\n        <ResourceBox\n          image={image}\n          title={embedData.title ?? \"\"}\n          url={embedData.url}\n          caption={embedData.caption ?? \"\"}\n          buttonText={t(\"license.other.itemImage.ariaLabel\")}\n        />\n      </StyledFigure>\n    );\n  }\n\n  const { width, height, url } = embedData;\n\n  const strippedWidth = typeof width === \"number\" ? width : width?.replace(/\\s*px/, \"\");\n  const strippedHeight = typeof height === \"number\" ? height : height?.replace(/\\s*px/, \"\");\n  const title = `${t(\"embed.type.external\")}: ${embedData.title?.trim() ? embedData.title : url}`;\n\n  return (\n    <StyledFigure data-embed-type=\"iframe\">\n      <StyledIframe\n        ref={iframeRef}\n        title={title}\n        aria-label={title}\n        src={url}\n        width={strippedWidth}\n        height={strippedHeight}\n        allow=\"fullscreen; encrypted-media\"\n        loading=\"lazy\"\n      />\n    </StyledFigure>\n  );\n};\n"],"mappings":";;;;;;;;;AAoBA,MAAM,eAAe,OAAO,UAAU,EACpC,MAAM;CACJ,OAAO;CACP,QAAQ;CACT,EACF,CAAC;AAEF,MAAM,eAAe,OAAO,QAAQ,EAClC,MAAM,EACJ,OAAO,QACR,EACF,CAAC;AAEF,MAAa,eAAe,EAAE,YAAmB;CAC/C,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,YAAY,OAA0B,KAAK;AAEjD,iBAAgB;EACd,MAAM,SAAS,UAAU;AACzB,MAAI,QAAQ;GACV,MAAM,CAACA,SAAOC,YAAU,CAAC,OAAO,SAAS,OAAO,MAAM,EAAE,OAAO,SAAS,OAAO,OAAO,CAAC;AACvF,UAAO,MAAM,cAAc,GAAGD,UAAQA,UAAQ,GAAG,GAAGC,WAASA,WAAS;AACtE,UAAO,QAAQ;AACf,UAAO,SAAS;;IAEjB,EAAE,CAAC;AAEN,KAAI,MAAM,WAAW,QACnB,QAAO,oBAAC,yBAAsB,MAAK,aAAa;CAGlD,MAAM,EAAE,WAAW,SAAS;AAE5B,KAAI,UAAU,SAAS,cAAc;EACnC,MAAM,cAAc,MAAM,WAAW,YAAY,KAAK,cAAc;EACpE,MAAM,MAAM,UAAU,QAAQ,SAAY,UAAU,MAAM,aAAa,QAAQ;EAC/E,MAAM,QAAQ;GAAE,KAAK,aAAa,MAAM;GAAU,KAAK,OAAO;GAAI;AAClE,SACE,oBAAC;GAAa,mBAAgB;aAC5B,oBAAC;IACQ;IACP,OAAO,UAAU,SAAS;IAC1B,KAAK,UAAU;IACf,SAAS,UAAU,WAAW;IAC9B,YAAY,EAAE,oCAAoC;KAClD;IACW;;CAInB,MAAM,EAAE,OAAO,QAAQ,QAAQ;CAE/B,MAAM,gBAAgB,OAAO,UAAU,WAAW,QAAQ,OAAO,QAAQ,SAAS,GAAG;CACrF,MAAM,iBAAiB,OAAO,WAAW,WAAW,SAAS,QAAQ,QAAQ,SAAS,GAAG;CACzF,MAAM,QAAQ,GAAG,EAAE,sBAAsB,CAAC,IAAI,UAAU,OAAO,MAAM,GAAG,UAAU,QAAQ;AAE1F,QACE,oBAAC;EAAa,mBAAgB;YAC5B,oBAAC;GACC,KAAK;GACE;GACP,cAAY;GACZ,KAAK;GACL,OAAO;GACP,QAAQ;GACR,OAAM;GACN,SAAQ;IACR;GACW"}