@ndla/ui 56.0.123-alpha.0 → 56.0.124-alpha.0

package/lib/Embed/FootnoteEmbed.js

@@ -1,50 +1,28 @@
-"use strict";
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
+const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
+const react_i18next = require_rolldown_runtime.__toESM(require("react-i18next"));
+const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _reactI18next = require("react-i18next");
-var _jsx2 = require("@ndla/styled-system/jsx");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * Copyright (c) 2023-present, NDLA.
- *
- * This source code is licensed under the GPLv3 license found in the
- * LICENSE file in the root directory of this source tree.
- *
- */
-
-const StyledSup = (0, _jsx2.styled)("sup", {
-  base: {
-    "& a": {
-      textStyle: "label.xsmall",
-      marginInlineStart: "1"
-    }
-  }
-});
-const FootnoteEmbed = _ref => {
-  let {
-    embed
-  } = _ref;
-  const {
-    t
-  } = (0, _reactI18next.useTranslation)();
-  if (embed.status === "error") {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      children: t("error")
-    });
-  }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-    id: `ref${embed.data.entryNum}`,
-    "data-embed-type": "footnote",
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledSup, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
-        href: `#note${embed.data.entryNum}`,
-        target: "_self",
-        children: `[${embed.data.entryNum}]`
-      })
-    })
-  });
+//#region src/Embed/FootnoteEmbed.tsx
+const StyledSup = (0, __ndla_styled_system_jsx.styled)("sup", { base: { "& a": {
+	textStyle: "label.xsmall",
+	marginInlineStart: "1"
+} } });
+const FootnoteEmbed = ({ embed }) => {
+	const { t } = (0, react_i18next.useTranslation)();
+	if (embed.status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: t("error") });
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		id: `ref${embed.data.entryNum}`,
+		"data-embed-type": "footnote",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledSup, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
+			href: `#note${embed.data.entryNum}`,
+			target: "_self",
+			children: `[${embed.data.entryNum}]`
+		}) })
+	});
 };
-var _default = exports.default = FootnoteEmbed;
+var FootnoteEmbed_default = FootnoteEmbed;
+
+//#endregion
+exports.FootnoteEmbed_default = FootnoteEmbed_default;
+//# sourceMappingURL=FootnoteEmbed.js.map

package/lib/Embed/FootnoteEmbed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FootnoteEmbed.js","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,qCAAO,OAAO,EAC9B,MAAM,EACJ,OAAO;CACL,WAAW;CACX,mBAAmB;AACpB,EACF,EACF,EAAC;AAEF,MAAM,gBAAgB,CAAC,EAAE,OAAc,KAAK;CAC1C,MAAM,EAAE,GAAG,GAAG,mCAAgB;AAC9B,KAAI,MAAM,WAAW,QACnB,wBAAO,2BAAC,mBAAK,EAAE,QAAQ,GAAO;AAGhC,wBACE,2BAAC;EAAK,KAAK,KAAK,MAAM,KAAK,SAAS;EAAG,mBAAgB;4BACrD,2BAAC,uCACC,2BAAC;GAAE,OAAO,OAAO,MAAM,KAAK,SAAS;GAAG,QAAO;cAAU,GAAG,MAAM,KAAK,SAAS;IAAO,GAC7E;GACP;AAEV;AAED,4BAAe"}

package/lib/Embed/GlossEmbed.js

@@ -1,88 +1,53 @@
-"use strict";
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
+const require_EmbedErrorPlaceholder = require('./EmbedErrorPlaceholder.js');
+const require_ConceptInlineTriggerButton = require('./ConceptInlineTriggerButton.js');
+const require_Gloss = require('../Gloss/Gloss.js');
+const react = require_rolldown_runtime.__toESM(require("react"));
+const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
+const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
+const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
+const __ark_ui_react = require_rolldown_runtime.__toESM(require("@ark-ui/react"));
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.GlossEmbed = void 0;
-var _react = require("react");
-var _react2 = require("@ark-ui/react");
-var _primitives = require("@ndla/primitives");
-var _jsx2 = require("@ndla/styled-system/jsx");
-var _ConceptInlineTriggerButton = require("./ConceptInlineTriggerButton");
-var _EmbedErrorPlaceholder = _interopRequireDefault(require("./EmbedErrorPlaceholder"));
-var _Gloss = require("../Gloss");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-/**
- * Copyright (c) 2024-present, NDLA.
- *
- * This source code is licensed under the GPLv3 license found in the
- * LICENSE file in the root directory of this source tree.
- *
- */
-
-const StyledPopoverContent = (0, _jsx2.styled)(_primitives.PopoverContent, {
-  base: {
-    width: "surface.xlarge"
-  }
-});
-const GlossEmbed = _ref => {
-  let {
-    embed
-  } = _ref;
-  const contentRef = (0, _react.useRef)(null);
-  if (embed.status === "error" && embed.embedData.type === "inline") {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-      children: embed.embedData.linkText
-    });
-  }
-  if (embed.status === "error" || !embed.data.concept.glossData) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_EmbedErrorPlaceholder.default, {
-      type: "gloss"
-    });
-  }
-  const {
-    concept,
-    visualElement
-  } = embed.data;
-  const audio = visualElement?.status === "success" && visualElement.resource === "audio" ? {
-    src: visualElement.data.audioFile.url,
-    title: visualElement.data.title.title
-  } : undefined;
-  if (embed.embedData.type === "inline") {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.PopoverRoot, {
-      initialFocusEl: () => contentRef.current,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.PopoverTrigger, {
-        asChild: true,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ConceptInlineTriggerButton.ConceptInlineTriggerButton, {
-          children: embed.embedData.linkText
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_react2.Portal, {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledPopoverContent, {
-          ref: contentRef,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Figure, {
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Gloss.Gloss, {
-              glossData: concept.glossData,
-              title: concept.title,
-              audio: audio,
-              exampleIds: embed.embedData.exampleIds,
-              exampleLangs: embed.embedData.exampleLangs
-            })
-          })
-        })
-      })]
-    });
-  }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Figure, {
-    "data-embed-type": "gloss",
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Gloss.Gloss, {
-      glossData: concept.glossData,
-      title: concept.title,
-      audio: audio,
-      exampleIds: embed.embedData.exampleIds,
-      exampleLangs: embed.embedData.exampleLangs,
-      variant: "bordered"
-    })
-  });
+//#region src/Embed/GlossEmbed.tsx
+const StyledPopoverContent = (0, __ndla_styled_system_jsx.styled)(__ndla_primitives.PopoverContent, { base: { width: "surface.xlarge" } });
+const GlossEmbed = ({ embed }) => {
+	const contentRef = (0, react.useRef)(null);
+	if (embed.status === "error" && embed.embedData.type === "inline") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: embed.embedData.linkText });
+	if (embed.status === "error" || !embed.data.concept.glossData) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EmbedErrorPlaceholder.EmbedErrorPlaceholder_default, { type: "gloss" });
+	const { concept, visualElement } = embed.data;
+	const audio = visualElement?.status === "success" && visualElement.resource === "audio" ? {
+		src: visualElement.data.audioFile.url,
+		title: visualElement.data.title.title
+	} : void 0;
+	if (embed.embedData.type === "inline") return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__ndla_primitives.PopoverRoot, {
+		initialFocusEl: () => contentRef.current,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_primitives.PopoverTrigger, {
+			asChild: true,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ConceptInlineTriggerButton.ConceptInlineTriggerButton, { children: embed.embedData.linkText })
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react.Portal, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledPopoverContent, {
+			ref: contentRef,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_primitives.Figure, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Gloss.Gloss_default, {
+				glossData: concept.glossData,
+				title: concept.title,
+				audio,
+				exampleIds: embed.embedData.exampleIds,
+				exampleLangs: embed.embedData.exampleLangs
+			}) })
+		}) })]
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_primitives.Figure, {
+		"data-embed-type": "gloss",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Gloss.Gloss_default, {
+			glossData: concept.glossData,
+			title: concept.title,
+			audio,
+			exampleIds: embed.embedData.exampleIds,
+			exampleLangs: embed.embedData.exampleLangs,
+			variant: "bordered"
+		})
+	});
 };
-exports.GlossEmbed = GlossEmbed;
+
+//#endregion
+exports.GlossEmbed = GlossEmbed;
+//# sourceMappingURL=GlossEmbed.js.map

package/lib/Embed/GlossEmbed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlossEmbed.js","names":["PopoverContent","EmbedErrorPlaceholder","PopoverRoot","PopoverTrigger","ConceptInlineTriggerButton","Portal","Figure","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 } 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\";\n\ninterface Props {\n  embed: ConceptMetaData;\n}\n\nconst StyledPopoverContent = styled(PopoverContent, {\n  base: {\n    width: \"surface.xlarge\",\n  },\n});\n\nexport const GlossEmbed = ({ embed }: Props) => {\n  const contentRef = useRef<HTMLDivElement>(null);\n  if (embed.status === \"error\" && embed.embedData.type === \"inline\") {\n    return <span>{embed.embedData.linkText}</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>{embed.embedData.linkText}</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":";;;;;;;;;;;AAqBA,MAAM,uBAAuB,qCAAOA,kCAAgB,EAClD,MAAM,EACJ,OAAO,iBACR,EACF,EAAC;AAEF,MAAa,aAAa,CAAC,EAAE,OAAc,KAAK;CAC9C,MAAM,aAAa,kBAAuB,KAAK;AAC/C,KAAI,MAAM,WAAW,WAAW,MAAM,UAAU,SAAS,SACvD,wBAAO,2BAAC,oBAAM,MAAM,UAAU,WAAgB;AAEhD,KAAI,MAAM,WAAW,YAAY,MAAM,KAAK,QAAQ,UAClD,wBAAO,2BAACC,+DAAsB,MAAK,UAAU;CAG/C,MAAM,EAAE,SAAS,eAAe,GAAG,MAAM;CAEzC,MAAM,QACJ,eAAe,WAAW,aAAa,cAAc,aAAa,UAC9D;EACE,KAAK,cAAc,KAAK,UAAU;EAClC,OAAO,cAAc,KAAK,MAAM;CACjC;AAGP,KAAI,MAAM,UAAU,SAAS,SAC3B,wBACE,4BAACC;EAAY,gBAAgB,MAAM,WAAW;6BAC5C,2BAACC;GAAe;6BACd,2BAACC,2EAA4B,MAAM,UAAU,WAAsC;IACpE,kBACjB,2BAACC,mDACC,2BAAC;GAAqB,KAAK;6BACzB,2BAACC,sDACC,2BAACC;IACC,WAAW,QAAQ;IACnB,OAAO,QAAQ;IACR;IACP,YAAY,MAAM,UAAU;IAC5B,cAAc,MAAM,UAAU;KAC9B,GACK;IACY,GAChB;GACG;AAIlB,wBACE,2BAACD;EAAO,mBAAgB;4BACtB,2BAACC;GACC,WAAW,QAAQ;GACnB,OAAO,QAAQ;GACR;GACP,YAAY,MAAM,UAAU;GAC5B,cAAc,MAAM,UAAU;GAC9B,SAAQ;IACR;GACK;AAEZ"}

package/lib/Embed/H5pEmbed.js

@@ -1,68 +1,39 @@
-"use strict";
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
+const require_EmbedErrorPlaceholder = require('./EmbedErrorPlaceholder.js');
+const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
+const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
+const react_i18next = require_rolldown_runtime.__toESM(require("react-i18next"));
+const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _reactI18next = require("react-i18next");
-var _primitives = require("@ndla/primitives");
-var _jsx2 = require("@ndla/styled-system/jsx");
-var _EmbedErrorPlaceholder = _interopRequireDefault(require("./EmbedErrorPlaceholder"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-/**
- * Copyright (c) 2023-present, NDLA.
- *
- * This source code is licensed under the GPLv3 license found in the
- * LICENSE file in the root directory of this source tree.
- *
- */
-
-const StyledFigure = (0, _jsx2.styled)(_primitives.Figure, {
-  base: {
-    "& iframe": {
-      height: "auto",
-      width: "100%"
-    }
-  }
-});
-const FigureOembed = (0, _jsx2.styled)(_primitives.Figure, {
-  base: {
-    width: "100%",
-    "& iframe": {
-      width: "100%"
-    }
-  }
-});
-const H5pEmbed = _ref => {
-  let {
-    embed
-  } = _ref;
-  const {
-    t
-  } = (0, _reactI18next.useTranslation)();
-  if (embed.status === "error") {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_EmbedErrorPlaceholder.default, {
-      type: "h5p"
-    });
-  }
-  if (embed.data.oembed) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(FigureOembed, {
-      "data-embed-type": "h5p",
-      dangerouslySetInnerHTML: {
-        __html: embed.data.oembed.html ?? ""
-      }
-    });
-  }
-  const title = embed.embedData.title?.trim() ? embed.embedData.title : embed.data.h5pLicenseInformation?.h5p.title?.trim() ? embed.data.h5pLicenseInformation.h5p.title : embed.embedData.url;
-  const titleWithPrefix = `${t("embed.type.h5p")}: ${title}`;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledFigure, {
-    "data-embed-type": "h5p",
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("iframe", {
-      title: titleWithPrefix,
-      "aria-label": titleWithPrefix,
-      src: embed.embedData.url
-    })
-  });
+//#region src/Embed/H5pEmbed.tsx
+const StyledFigure = (0, __ndla_styled_system_jsx.styled)(__ndla_primitives.Figure, { base: { "& iframe": {
+	height: "auto",
+	width: "100%"
+} } });
+const FigureOembed = (0, __ndla_styled_system_jsx.styled)(__ndla_primitives.Figure, { base: {
+	width: "100%",
+	"& iframe": { width: "100%" }
+} });
+const H5pEmbed = ({ embed }) => {
+	const { t } = (0, react_i18next.useTranslation)();
+	if (embed.status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EmbedErrorPlaceholder.EmbedErrorPlaceholder_default, { type: "h5p" });
+	if (embed.data.oembed) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FigureOembed, {
+		"data-embed-type": "h5p",
+		dangerouslySetInnerHTML: { __html: embed.data.oembed.html ?? "" }
+	});
+	const title = embed.embedData.title?.trim() ? embed.embedData.title : embed.data.h5pLicenseInformation?.h5p.title?.trim() ? embed.data.h5pLicenseInformation.h5p.title : embed.embedData.url;
+	const titleWithPrefix = `${t("embed.type.h5p")}: ${title}`;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledFigure, {
+		"data-embed-type": "h5p",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("iframe", {
+			title: titleWithPrefix,
+			"aria-label": titleWithPrefix,
+			src: embed.embedData.url
+		})
+	});
 };
-var _default = exports.default = H5pEmbed;
+var H5pEmbed_default = H5pEmbed;
+
+//#endregion
+exports.H5pEmbed_default = H5pEmbed_default;
+//# sourceMappingURL=H5pEmbed.js.map

package/lib/Embed/H5pEmbed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"H5pEmbed.js","names":["Figure","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,qCAAOA,0BAAQ,EAClC,MAAM,EACJ,YAAY;CACV,QAAQ;CACR,OAAO;AACR,EACF,EACF,EAAC;AAEF,MAAM,eAAe,qCAAOA,0BAAQ,EAClC,MAAM;CACJ,OAAO;CACP,YAAY,EACV,OAAO,OACR;AACF,EACF,EAAC;AAEF,MAAM,WAAW,CAAC,EAAE,OAAc,KAAK;CACrC,MAAM,EAAE,GAAG,GAAG,mCAAgB;AAC9B,KAAI,MAAM,WAAW,QACnB,wBAAO,2BAACC,+DAAsB,MAAK,QAAQ;AAG7C,KAAI,MAAM,KAAK,OACb,wBAAO,2BAAC;EAAa,mBAAgB;EAAM,yBAAyB,EAAE,QAAQ,MAAM,KAAK,OAAO,QAAQ,GAAI;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,mBAAmB,EAAE,EAAE,iBAAiB,CAAC,IAAI,MAAM;AAEzD,wBACE,2BAAC;EAAa,mBAAgB;4BAC5B,2BAAC;GAAO,OAAO;GAAiB,cAAY;GAAiB,KAAK,MAAM,UAAU;IAAO;GAC5E;AAElB;AAED,uBAAe"}

package/lib/Embed/IframeEmbed.js

@@ -1,100 +1,70 @@
-"use strict";
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
+const require_EmbedErrorPlaceholder = require('./EmbedErrorPlaceholder.js');
+const require_ResourceBox = require('../ResourceBox/ResourceBox.js');
+const react = require_rolldown_runtime.__toESM(require("react"));
+const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
+const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
+const react_i18next = require_rolldown_runtime.__toESM(require("react-i18next"));
+const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = require("react");
-var _reactI18next = require("react-i18next");
-var _primitives = require("@ndla/primitives");
-var _jsx2 = require("@ndla/styled-system/jsx");
-var _EmbedErrorPlaceholder = _interopRequireDefault(require("./EmbedErrorPlaceholder"));
-var _ResourceBox = require("../ResourceBox");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-/**
- * Copyright (c) 2023-present, NDLA.
- *
- * This source code is licensed under the GPLv3 license found in the
- * LICENSE file in the root directory of this source tree.
- *
- */
-
-const StyledIframe = (0, _jsx2.styled)("iframe", {
-  base: {
-    width: "100%",
-    border: 0
-  }
-});
-const StyledFigure = (0, _jsx2.styled)(_primitives.Figure, {
-  base: {
-    clear: "both"
-  }
-});
-const IframeEmbed = _ref => {
-  let {
-    embed
-  } = _ref;
-  const {
-    t
-  } = (0, _reactI18next.useTranslation)();
-  const iframeRef = (0, _react.useRef)(null);
-  (0, _react.useEffect)(() => {
-    const iframe = iframeRef.current;
-    if (iframe) {
-      const [width, height] = [Number.parseInt(iframe.width), Number.parseInt(iframe.height)];
-      iframe.style.aspectRatio = `${width ? width : 16}/${height ? height : 9}`;
-      iframe.width = "";
-      iframe.height = "";
-    }
-  }, []);
-  if (embed.status === "error") {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_EmbedErrorPlaceholder.default, {
-      type: "external"
-    });
-  }
-  const {
-    embedData,
-    data
-  } = embed;
-  if (embedData.type === "fullscreen") {
-    const iframeImage = embed.status === "success" ? data.iframeImage : undefined;
-    const alt = embedData.alt !== undefined ? embedData.alt : iframeImage?.alttext.alttext;
-    const image = {
-      src: iframeImage?.image.imageUrl,
-      alt: alt ?? ""
-    };
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledFigure, {
-      "data-embed-type": "iframe",
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ResourceBox.ResourceBox, {
-        image: image,
-        title: embedData.title ?? "",
-        url: embedData.url,
-        caption: embedData.caption ?? "",
-        buttonText: t("license.other.itemImage.ariaLabel")
-      })
-    });
-  }
-  const {
-    width,
-    height,
-    url
-  } = embedData;
-  const strippedWidth = typeof width === "number" ? width : width?.replace(/\s*px/, "");
-  const strippedHeight = typeof height === "number" ? height : height?.replace(/\s*px/, "");
-  const title = `${t("embed.type.external")}: ${embedData.title?.trim() ? embedData.title : url}`;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledFigure, {
-    "data-embed-type": "iframe",
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledIframe, {
-      ref: iframeRef,
-      title: title,
-      "aria-label": title,
-      src: url,
-      width: strippedWidth,
-      height: strippedHeight,
-      allow: "fullscreen; encrypted-media",
-      loading: "lazy"
-    })
-  });
+//#region src/Embed/IframeEmbed.tsx
+const StyledIframe = (0, __ndla_styled_system_jsx.styled)("iframe", { base: {
+	width: "100%",
+	border: 0
+} });
+const StyledFigure = (0, __ndla_styled_system_jsx.styled)(__ndla_primitives.Figure, { base: { clear: "both" } });
+const IframeEmbed = ({ embed }) => {
+	const { t } = (0, react_i18next.useTranslation)();
+	const iframeRef = (0, react.useRef)(null);
+	(0, react.useEffect)(() => {
+		const iframe = iframeRef.current;
+		if (iframe) {
+			const [width$1, height$1] = [Number.parseInt(iframe.width), Number.parseInt(iframe.height)];
+			iframe.style.aspectRatio = `${width$1 ? width$1 : 16}/${height$1 ? height$1 : 9}`;
+			iframe.width = "";
+			iframe.height = "";
+		}
+	}, []);
+	if (embed.status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EmbedErrorPlaceholder.EmbedErrorPlaceholder_default, { type: "external" });
+	const { embedData, data } = embed;
+	if (embedData.type === "fullscreen") {
+		const iframeImage = embed.status === "success" ? data.iframeImage : void 0;
+		const alt = embedData.alt !== void 0 ? embedData.alt : iframeImage?.alttext.alttext;
+		const image = {
+			src: iframeImage?.image.imageUrl,
+			alt: alt ?? ""
+		};
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledFigure, {
+			"data-embed-type": "iframe",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ResourceBox.ResourceBox_default, {
+				image,
+				title: embedData.title ?? "",
+				url: embedData.url,
+				caption: embedData.caption ?? "",
+				buttonText: t("license.other.itemImage.ariaLabel")
+			})
+		});
+	}
+	const { width, height, url } = embedData;
+	const strippedWidth = typeof width === "number" ? width : width?.replace(/\s*px/, "");
+	const strippedHeight = typeof height === "number" ? height : height?.replace(/\s*px/, "");
+	const title = `${t("embed.type.external")}: ${embedData.title?.trim() ? embedData.title : url}`;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledFigure, {
+		"data-embed-type": "iframe",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledIframe, {
+			ref: iframeRef,
+			title,
+			"aria-label": title,
+			src: url,
+			width: strippedWidth,
+			height: strippedHeight,
+			allow: "fullscreen; encrypted-media",
+			loading: "lazy"
+		})
+	});
 };
-var _default = exports.default = IframeEmbed;
+var IframeEmbed_default = IframeEmbed;
+
+//#endregion
+exports.IframeEmbed_default = IframeEmbed_default;
+//# sourceMappingURL=IframeEmbed.js.map

package/lib/Embed/IframeEmbed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IframeEmbed.js","names":["Figure","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\";\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,qCAAO,UAAU,EACpC,MAAM;CACJ,OAAO;CACP,QAAQ;AACT,EACF,EAAC;AAEF,MAAM,eAAe,qCAAOA,0BAAQ,EAClC,MAAM,EACJ,OAAO,OACR,EACF,EAAC;AAEF,MAAM,cAAc,CAAC,EAAE,OAAc,KAAK;CACxC,MAAM,EAAE,GAAG,GAAG,mCAAgB;CAC9B,MAAM,YAAY,kBAA0B,KAAK;AAEjD,sBAAU,MAAM;EACd,MAAM,SAAS,UAAU;AACzB,MAAI,QAAQ;GACV,MAAM,CAACC,SAAOC,SAAO,GAAG,CAAC,OAAO,SAAS,OAAO,MAAM,EAAE,OAAO,SAAS,OAAO,OAAO,AAAC;AACvF,UAAO,MAAM,eAAe,EAAED,UAAQA,UAAQ,GAAG,GAAGC,WAASA,WAAS,EAAE;AACxE,UAAO,QAAQ;AACf,UAAO,SAAS;EACjB;CACF,GAAE,CAAE,EAAC;AAEN,KAAI,MAAM,WAAW,QACnB,wBAAO,2BAACC,+DAAsB,MAAK,aAAa;CAGlD,MAAM,EAAE,WAAW,MAAM,GAAG;AAE5B,KAAI,UAAU,SAAS,cAAc;EACnC,MAAM,cAAc,MAAM,WAAW,YAAY,KAAK;EACtD,MAAM,MAAM,UAAU,iBAAoB,UAAU,MAAM,aAAa,QAAQ;EAC/E,MAAM,QAAQ;GAAE,KAAK,aAAa,MAAM;GAAU,KAAK,OAAO;EAAI;AAClE,yBACE,2BAAC;GAAa,mBAAgB;6BAC5B,2BAACC;IACQ;IACP,OAAO,UAAU,SAAS;IAC1B,KAAK,UAAU;IACf,SAAS,UAAU,WAAW;IAC9B,YAAY,EAAE,oCAAoC;KAClD;IACW;CAElB;CAED,MAAM,EAAE,OAAO,QAAQ,KAAK,GAAG;CAE/B,MAAM,uBAAuB,UAAU,WAAW,QAAQ,OAAO,QAAQ,SAAS,GAAG;CACrF,MAAM,wBAAwB,WAAW,WAAW,SAAS,QAAQ,QAAQ,SAAS,GAAG;CACzF,MAAM,SAAS,EAAE,EAAE,sBAAsB,CAAC,IAAI,UAAU,OAAO,MAAM,GAAG,UAAU,QAAQ,IAAI;AAE9F,wBACE,2BAAC;EAAa,mBAAgB;4BAC5B,2BAAC;GACC,KAAK;GACE;GACP,cAAY;GACZ,KAAK;GACL,OAAO;GACP,QAAQ;GACR,OAAM;GACN,SAAQ;IACR;GACW;AAElB;AAED,0BAAe"}