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

package/lib/Concept/Concept.js

@@ -1,78 +1,51 @@
-"use strict";
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
+const require_EmbedByline = require('../LicenseByline/EmbedByline.js');
+const require_licenseAttributes = require('../utils/licenseAttributes.js');
+const require_ImageEmbed = require('../Embed/ImageEmbed.js');
+const require_H5pEmbed = require('../Embed/H5pEmbed.js');
+const require_ExternalEmbed = require('../Embed/ExternalEmbed.js');
+const require_IframeEmbed = require('../Embed/IframeEmbed.js');
+const require_BrightcoveEmbed = require('../Embed/BrightcoveEmbed.js');
+const react = require_rolldown_runtime.__toESM(require("react"));
+const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
+const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
+const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
+//#region src/Concept/Concept.tsx
+const StyledFigure = (0, __ndla_styled_system_jsx.styled)(__ndla_primitives.Figure, { base: {
+	display: "flex",
+	flexDirection: "column",
+	gap: "medium"
+} });
+const ContentWrapper = (0, __ndla_styled_system_jsx.styled)("div", { base: {
+	textStyle: "body.large",
+	display: "inline",
+	"& p": { display: "inline" }
+} });
+const Concept = (0, react.forwardRef)(({ copyright, visualElement, lang, children, title, source, previewAlt,...rest }, ref) => {
+	const licenseProps = require_licenseAttributes.licenseAttributes(copyright?.license?.license, lang, source);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(StyledFigure, {
+		ref,
+		...rest,
+		...licenseProps,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(ContentWrapper, {
+				lang,
+				children: [!!title && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("b", { children: title }), ` – `] }), children]
+			}),
+			visualElement?.resource === "image" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ImageEmbed.ImageEmbed_default, {
+				embed: visualElement,
+				lang,
+				previewAlt
+			}) : visualElement?.resource === "brightcove" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_BrightcoveEmbed.BrightcoveEmbed_default, { embed: visualElement }) : visualElement?.resource === "h5p" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_H5pEmbed.H5pEmbed_default, { embed: visualElement }) : visualElement?.resource === "iframe" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_IframeEmbed.IframeEmbed_default, { embed: visualElement }) : visualElement?.resource === "external" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ExternalEmbed.ExternalEmbed_default, { embed: visualElement }) : null,
+			!!copyright && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EmbedByline.EmbedByline, {
+				copyright,
+				type: "concept"
+			})
+		]
+	});
 });
-exports.Concept = void 0;
-var _react = require("react");
-var _primitives = require("@ndla/primitives");
-var _jsx2 = require("@ndla/styled-system/jsx");
-var _Embed = require("../Embed");
-var _EmbedByline = require("../LicenseByline/EmbedByline");
-var _licenseAttributes = require("../utils/licenseAttributes");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * 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 StyledFigure = (0, _jsx2.styled)(_primitives.Figure, {
-  base: {
-    display: "flex",
-    flexDirection: "column",
-    gap: "medium"
-  }
-});
-const ContentWrapper = (0, _jsx2.styled)("div", {
-  base: {
-    textStyle: "body.large",
-    display: "inline",
-    "& p": {
-      display: "inline"
-    }
-  }
-});
-const Concept = exports.Concept = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
-  let {
-    copyright,
-    visualElement,
-    lang,
-    children,
-    title,
-    source,
-    previewAlt,
-    ...rest
-  } = _ref;
-  const licenseProps = (0, _licenseAttributes.licenseAttributes)(copyright?.license?.license, lang, source);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledFigure, {
-    ref: ref,
-    ...rest,
-    ...licenseProps,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(ContentWrapper, {
-      lang: lang,
-      children: [!!title && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("b", {
-          children: title
-        }), ` – `]
-      }), children]
-    }), visualElement?.resource === "image" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Embed.ImageEmbed, {
-      embed: visualElement,
-      lang: lang,
-      previewAlt: previewAlt
-    }) : visualElement?.resource === "brightcove" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Embed.BrightcoveEmbed, {
-      embed: visualElement
-    }) : visualElement?.resource === "h5p" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Embed.H5pEmbed, {
-      embed: visualElement
-    }) : visualElement?.resource === "iframe" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Embed.IframeEmbed, {
-      embed: visualElement
-    }) : visualElement?.resource === "external" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Embed.ExternalEmbed, {
-      embed: visualElement
-    }) : null, !!copyright && /*#__PURE__*/(0, _jsxRuntime.jsx)(_EmbedByline.EmbedByline, {
-      copyright: copyright,
-      type: "concept"
-    })]
-  });
-});
+//#endregion
+exports.Concept = Concept;
+//# sourceMappingURL=Concept.js.map

package/lib/Concept/Concept.js.map

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

package/lib/ContactBlock/ContactBlock.js

@@ -1,206 +1,147 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.contactBlockBackgrounds = exports.ContactBlock = void 0;
-var _reactI18next = require("react-i18next");
-var _primitives = require("@ndla/primitives");
-var _jsx2 = require("@ndla/styled-system/jsx");
-var _EmbedByline = require("../LicenseByline/EmbedByline");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * 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 require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
+const require_EmbedByline = require('../LicenseByline/EmbedByline.js');
+const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
+const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
+const react_i18next = require_rolldown_runtime.__toESM(require("react-i18next"));
+const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
 
+//#region src/ContactBlock/ContactBlock.tsx
 const BackgroundVariant = {
-  strong: {
-    _before: {
-      backgroundColor: "surface.brand.3"
-    }
-  },
-  moderate: {
-    _before: {
-      backgroundColor: "surface.brand.3.moderate"
-    }
-  },
-  subtle: {
-    _before: {
-      backgroundColor: "surface.brand.3.subtle"
-    }
-  }
+	strong: { _before: { backgroundColor: "surface.brand.3" } },
+	moderate: { _before: { backgroundColor: "surface.brand.3.moderate" } },
+	subtle: { _before: { backgroundColor: "surface.brand.3.subtle" } }
 };
-const contactBlockBackgrounds = exports.contactBlockBackgrounds = Object.keys(BackgroundVariant);
-const StyledWrapper = (0, _jsx2.styled)("div", {
-  base: {
-    display: "flex",
-    minWidth: "surface.xxsmall",
-    padding: "medium",
-    alignItems: "center",
-    justifyContent: "space-between",
-    boxShadow: "full",
-    border: "1px solid",
-    gap: "medium",
-    position: "relative",
-    borderColor: "stroke.default",
-    borderRadius: "xsmall",
-    overflow: "hidden",
-    background: "surface.default",
-    flexDirection: "column-reverse",
-    tablet: {
-      alignItems: "unset",
-      flexDirection: "row"
-    }
-  }
-});
-const EmailLink = (0, _jsx2.styled)("a", {
-  base: {
-    color: "text.default",
-    textDecoration: "underline",
-    _hover: {
-      textDecoration: "none"
-    },
-    _focusVisible: {
-      textDecoration: "none"
-    }
-  }
-});
-const HeaderWrapper = (0, _jsx2.styled)("div", {
-  base: {
-    position: "relative",
-    display: "flex",
-    flexDirection: "column",
-    gap: "3xsmall",
-    zIndex: "base",
-    _before: {
-      content: '""',
-      position: "absolute",
-      top: "-60px",
-      left: "-50px",
-      right: "0",
-      bottom: "0",
-      height: "calc(100% + 50px)",
-      width: "surface.3xlarge",
-      transform: "rotate(-4deg)",
-      zIndex: "hide"
-    }
-  },
-  variants: {
-    variant: BackgroundVariant,
-    imageExists: {
-      true: {
-        tabletDown: {
-          _before: {
-            display: "none"
-          }
-        }
-      }
-    }
-  }
+const contactBlockBackgrounds = Object.keys(BackgroundVariant);
+const StyledWrapper = (0, __ndla_styled_system_jsx.styled)("div", { base: {
+	display: "flex",
+	minWidth: "surface.xxsmall",
+	padding: "medium",
+	alignItems: "center",
+	justifyContent: "space-between",
+	boxShadow: "full",
+	border: "1px solid",
+	gap: "medium",
+	position: "relative",
+	borderColor: "stroke.default",
+	borderRadius: "xsmall",
+	overflow: "hidden",
+	background: "surface.default",
+	flexDirection: "column-reverse",
+	tablet: {
+		alignItems: "unset",
+		flexDirection: "row"
+	}
+} });
+const EmailLink = (0, __ndla_styled_system_jsx.styled)("a", { base: {
+	color: "text.default",
+	textDecoration: "underline",
+	_hover: { textDecoration: "none" },
+	_focusVisible: { textDecoration: "none" }
+} });
+const HeaderWrapper = (0, __ndla_styled_system_jsx.styled)("div", {
+	base: {
+		position: "relative",
+		display: "flex",
+		flexDirection: "column",
+		gap: "3xsmall",
+		zIndex: "base",
+		_before: {
+			content: "\"\"",
+			position: "absolute",
+			top: "-60px",
+			left: "-50px",
+			right: "0",
+			bottom: "0",
+			height: "calc(100% + 50px)",
+			width: "surface.3xlarge",
+			transform: "rotate(-4deg)",
+			zIndex: "hide"
+		}
+	},
+	variants: {
+		variant: BackgroundVariant,
+		imageExists: { true: { tabletDown: { _before: { display: "none" } } } }
+	}
 });
-const ImageWrapper = (0, _jsx2.styled)("div", {
-  base: {
-    display: "flex",
-    gap: "xxsmall",
-    alignItems: "flex-start",
-    justifyContent: "flex-start",
-    flexDirection: "column",
-    zIndex: "base",
-    tabletDown: {
-      _before: {
-        content: '""',
-        position: "absolute",
-        top: "-50px",
-        left: "-50px",
-        right: "0",
-        bottom: "0",
-        height: "surface.xxsmall",
-        width: "surface.3xlarge",
-        transform: "rotate(-4deg)",
-        zIndex: "hide"
-      }
-    }
-  },
-  variants: {
-    variant: BackgroundVariant
-  }
+const ImageWrapper = (0, __ndla_styled_system_jsx.styled)("div", {
+	base: {
+		display: "flex",
+		gap: "xxsmall",
+		alignItems: "flex-start",
+		justifyContent: "flex-start",
+		flexDirection: "column",
+		zIndex: "base",
+		tabletDown: { _before: {
+			content: "\"\"",
+			position: "absolute",
+			top: "-50px",
+			left: "-50px",
+			right: "0",
+			bottom: "0",
+			height: "surface.xxsmall",
+			width: "surface.3xlarge",
+			transform: "rotate(-4deg)",
+			zIndex: "hide"
+		} }
+	},
+	variants: { variant: BackgroundVariant }
 });
-const StyledImage = (0, _jsx2.styled)("img", {
-  base: {
-    borderRadius: "xsmall",
-    width: "surface.xsmall",
-    height: "surface.xsmall",
-    objectFit: "cover"
-  }
-});
-const ContentWrapper = (0, _jsx2.styled)("div", {
-  base: {
-    display: "flex",
-    flexDirection: "column",
-    gap: "medium",
-    flex: "1",
-    width: "100%"
-  }
-});
-const StyledDescription = (0, _jsx2.styled)(_primitives.Text, {
-  base: {
-    fontFamily: "serif"
-  }
-});
-const ContactBlock = _ref => {
-  let {
-    image,
-    jobTitle,
-    description,
-    name,
-    email,
-    embedAlt,
-    lang,
-    backgroundColor = "strong"
-  } = _ref;
-  const {
-    t
-  } = (0, _reactI18next.useTranslation)();
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledWrapper, {
-    "data-embed-type": "contact-block",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(ContentWrapper, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(HeaderWrapper, {
-        variant: backgroundColor,
-        imageExists: !!image,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Text, {
-          lang: lang,
-          fontWeight: "bold",
-          textStyle: "heading.small",
-          children: name
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Text, {
-          lang: lang,
-          children: jobTitle
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.Text, {
-          children: [`${t("email")}: `, /*#__PURE__*/(0, _jsxRuntime.jsx)(EmailLink, {
-            href: `mailto:${email}`,
-            children: email
-          })]
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledDescription, {
-        textStyle: "body.large",
-        children: description
-      })]
-    }), !!image && /*#__PURE__*/(0, _jsxRuntime.jsxs)(ImageWrapper, {
-      variant: backgroundColor,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(StyledImage, {
-        alt: embedAlt !== undefined ? embedAlt : image.alttext.alttext,
-        src: image.image.imageUrl,
-        width: 300,
-        height: 300
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_EmbedByline.LicenseContainerContent, {
-        type: "image",
-        copyright: image.copyright
-      })]
-    })]
-  });
+const StyledImage = (0, __ndla_styled_system_jsx.styled)("img", { base: {
+	borderRadius: "xsmall",
+	width: "surface.xsmall",
+	height: "surface.xsmall",
+	objectFit: "cover"
+} });
+const ContentWrapper = (0, __ndla_styled_system_jsx.styled)("div", { base: {
+	display: "flex",
+	flexDirection: "column",
+	gap: "medium",
+	flex: "1",
+	width: "100%"
+} });
+const StyledDescription = (0, __ndla_styled_system_jsx.styled)(__ndla_primitives.Text, { base: { fontFamily: "serif" } });
+const ContactBlock = ({ image, jobTitle, description, name, email, embedAlt, lang, backgroundColor = "strong" }) => {
+	const { t } = (0, react_i18next.useTranslation)();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(StyledWrapper, {
+		"data-embed-type": "contact-block",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(ContentWrapper, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HeaderWrapper, {
+			variant: backgroundColor,
+			imageExists: !!image,
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_primitives.Text, {
+					lang,
+					fontWeight: "bold",
+					textStyle: "heading.small",
+					children: name
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_primitives.Text, {
+					lang,
+					children: jobTitle
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__ndla_primitives.Text, { children: [`${t("email")}: `, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EmailLink, {
+					href: `mailto:${email}`,
+					children: email
+				})] })
+			]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledDescription, {
+			textStyle: "body.large",
+			children: description
+		})] }), !!image && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(ImageWrapper, {
+			variant: backgroundColor,
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledImage, {
+				alt: embedAlt !== void 0 ? embedAlt : image.alttext.alttext,
+				src: image.image.imageUrl,
+				width: 300,
+				height: 300
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EmbedByline.LicenseContainerContent, {
+				type: "image",
+				copyright: image.copyright
+			})]
+		})]
+	});
 };
-exports.ContactBlock = ContactBlock;
+
+//#endregion
+exports.ContactBlock = ContactBlock;
+exports.contactBlockBackgrounds = contactBlockBackgrounds;
+//# sourceMappingURL=ContactBlock.js.map

package/lib/ContactBlock/ContactBlock.js.map

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

package/lib/ContentTypeBadge/ContentTypeBadge.js

@@ -1,57 +1,43 @@
-"use strict";
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
+const require_ContentType = require('../model/ContentType.js');
+const react = require_rolldown_runtime.__toESM(require("react"));
+const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
+const react_i18next = require_rolldown_runtime.__toESM(require("react-i18next"));
+const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
+//#region src/ContentTypeBadge/ContentTypeBadge.tsx
+const contentTypeToBadgeVariantMap = {
+	[require_ContentType.SUBJECT_MATERIAL]: "brand1",
+	[require_ContentType.TASKS_AND_ACTIVITIES]: "brand2",
+	[require_ContentType.ASSESSMENT_RESOURCES]: "brand2",
+	[require_ContentType.SUBJECT]: "neutral",
+	[require_ContentType.SOURCE_MATERIAL]: "brand1",
+	[require_ContentType.LEARNING_PATH]: "brand3",
+	[require_ContentType.TOPIC]: "neutral",
+	[require_ContentType.MULTIDISCIPLINARY]: "neutral",
+	[require_ContentType.CONCEPT]: "brand1",
+	[require_ContentType.EXTERNAL]: "brand2",
+	[require_ContentType.IMAGE]: "brand1",
+	[require_ContentType.AUDIO]: "brand1",
+	[require_ContentType.PODCAST]: "brand1",
+	[require_ContentType.VIDEO]: "brand1",
+	[require_ContentType.MISSING]: "neutral",
+	[require_ContentType.PODCAST_SERIES]: "brand1",
+	[require_ContentType.GLOSS]: "brand1",
+	[require_ContentType.PROGRAMME]: "neutral",
+	[require_ContentType.FRONTPAGE_ARTICLE]: "brand2"
+};
+const ContentTypeBadge = (0, react.forwardRef)(({ contentType, children,...props }, ref) => {
+	const { t } = (0, react_i18next.useTranslation)();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_primitives.Badge, {
+		colorTheme: contentTypeToBadgeVariantMap[contentType ?? "missing"] ?? contentTypeToBadgeVariantMap["missing"],
+		...props,
+		ref,
+		children: children ?? t(`contentTypes.${contentType}`)
+	});
 });
-exports.contentTypeToBadgeVariantMap = exports.ContentTypeBadge = void 0;
-var _react = require("react");
-var _reactI18next = require("react-i18next");
-var _primitives = require("@ndla/primitives");
-var contentTypes = _interopRequireWildcard(require("../model/ContentType"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-/**
- * 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 contentTypeToBadgeVariantMap = exports.contentTypeToBadgeVariantMap = {
-  [contentTypes.SUBJECT_MATERIAL]: "brand1",
-  [contentTypes.TASKS_AND_ACTIVITIES]: "brand2",
-  [contentTypes.ASSESSMENT_RESOURCES]: "brand2",
-  [contentTypes.SUBJECT]: "neutral",
-  [contentTypes.SOURCE_MATERIAL]: "brand1",
-  [contentTypes.LEARNING_PATH]: "brand3",
-  [contentTypes.TOPIC]: "neutral",
-  [contentTypes.MULTIDISCIPLINARY]: "neutral",
-  [contentTypes.CONCEPT]: "brand1",
-  [contentTypes.EXTERNAL]: "brand2",
-  [contentTypes.IMAGE]: "brand1",
-  [contentTypes.AUDIO]: "brand1",
-  [contentTypes.PODCAST]: "brand1",
-  [contentTypes.VIDEO]: "brand1",
-  [contentTypes.MISSING]: "neutral",
-  [contentTypes.PODCAST_SERIES]: "brand1",
-  [contentTypes.GLOSS]: "brand1",
-  [contentTypes.PROGRAMME]: "neutral",
-  [contentTypes.FRONTPAGE_ARTICLE]: "brand2"
-};
-const ContentTypeBadge = exports.ContentTypeBadge = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
-  let {
-    contentType,
-    children,
-    ...props
-  } = _ref;
-  const {
-    t
-  } = (0, _reactI18next.useTranslation)();
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Badge, {
-    colorTheme: contentTypeToBadgeVariantMap[contentType ?? "missing"] ?? contentTypeToBadgeVariantMap["missing"],
-    ...props,
-    ref: ref,
-    children: children ?? t(`contentTypes.${contentType}`)
-  });
-});
+//#endregion
+exports.ContentTypeBadge = ContentTypeBadge;
+exports.contentTypeToBadgeVariantMap = contentTypeToBadgeVariantMap;
+//# sourceMappingURL=ContentTypeBadge.js.map

package/lib/ContentTypeBadge/ContentTypeBadge.js.map

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