@ndla/ui 56.0.170-alpha.0 → 56.0.172-alpha.0

package/dist/panda.buildinfo.json

@@ -305,9 +305,8 @@
       "gridColumn]___[value:span 2]___[cond:tabletToDesktop<___>& > div:nth-child(3):last-child",
       "gridTemplateColumns]___[value:repeat(3, minmax(0, 1fr))]___[cond:desktop",
       "gridTemplateColumns]___[value:repeat(4, minmax(0, 1fr))]___[cond:desktop",
-      "borderColor]___[value:surface.brand.2",
       "outline]___[value:1px solid",
-      "outlineColor]___[value:stroke.default",
+      "outlineColor]___[value:stroke.subtle",
       "paddingBlock]___[value:xxlarge]___[cond:&:not(:has(> img))",
       "width]___[value:surface.3xsmall",
       "textStyle]___[value:heading.large",

package/dist/styles.css

@@ -312,10 +312,6 @@
     padding-inline: 0;
 }
 
-  .bd-c_surface\.brand\.2 {
-    border-color: var(--colors-surface-brand-2);
-}
-
   .ring_1px_solid {
     outline: 1px solid;
 }
@@ -591,8 +587,8 @@
     grid-template-columns: repeat(2, minmax(0, 1fr));
 }
 
-  .ring-c_stroke\.default {
-    outline-color: var(--colors-stroke-default);
+  .ring-c_stroke\.subtle {
+    outline-color: var(--colors-stroke-subtle);
 }
 
   .c_text\.subtle {

package/es/Article/Article.mjs

@@ -1,4 +1,3 @@
-import { ArticleByline } from "./ArticleByline.mjs";
 import { BadgesContainer } from "./BadgesContainer.mjs";
 import { forwardRef } from "react";
 import { Heading, Text } from "@ndla/primitives";
@@ -99,32 +98,7 @@ const ArticleTitle = ({ badges, heartButton, title, lang, id, introduction, comp
 		children
 	] });
 };
-const Article = ({ badges, article, licenseBox, children, competenceGoals, id, heartButton, lang, disclaimer }) => {
-	const { title, introduction, published, content, footNotes, copyright } = article;
-	const authors = copyright?.creators.length || copyright?.rightsholders.length ? copyright.creators : copyright?.processors;
-	return /* @__PURE__ */ jsxs(ArticleWrapper, { children: [
-		/* @__PURE__ */ jsx(ArticleTitle, {
-			id,
-			badges,
-			heartButton,
-			title,
-			introduction,
-			competenceGoals,
-			lang,
-			disclaimer
-		}),
-		/* @__PURE__ */ jsx(ArticleContent, { children: content }),
-		/* @__PURE__ */ jsxs(ArticleFooter, { children: [/* @__PURE__ */ jsx(ArticleByline, {
-			lang,
-			footnotes: footNotes,
-			authors,
-			suppliers: copyright?.rightsholders,
-			published,
-			licenseBox
-		}), children] })
-	] });
-};
 
 //#endregion
-export { Article, ArticleContent, ArticleFooter, ArticleHGroup, ArticleHeader, ArticleTitle, ArticleWrapper };
+export { ArticleContent, ArticleFooter, ArticleHGroup, ArticleHeader, ArticleTitle, ArticleWrapper };
 //# sourceMappingURL=Article.mjs.map

package/es/Article/Article.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Article.mjs","names":[],"sources":["../../src/Article/Article.tsx"],"sourcesContent":["/**\n * Copyright (c) 2016-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 { ark, type HTMLArkProps } from \"@ark-ui/react\";\nimport { Heading, Text } from \"@ndla/primitives\";\nimport { cx } from \"@ndla/styled-system/css\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { ArticleByline } from \"./ArticleByline\";\nimport { BadgesContainer } from \"./BadgesContainer\";\nimport type { Article as ArticleType } from \"../types\";\n\nconst StyledArticleContent = styled(ark.section, {}, { baseComponent: true });\n\nexport const ArticleContent = forwardRef<HTMLElement, HTMLArkProps<\"div\"> & StyledProps>(\n  ({ className, ...props }, ref) => (\n    <StyledArticleContent className={cx(\"ndla-article\", className)} {...props} ref={ref} />\n  ),\n);\n\nconst StyledArticleWrapper = styled(\n  ark.article,\n  {\n    base: {\n      background: \"background.default\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      color: \"text.default\",\n      alignItems: \"center\",\n      width: \"100%\",\n      overflowWrap: \"break-word\",\n      position: \"relative\",\n      \"& mjx-stretchy-v > mjx-ext > mjx-c\": {\n        transform: \"scaleY(100) translateY(0.075em)\",\n      },\n      _after: {\n        content: \"\",\n        display: \"table\",\n        clear: \"both\",\n      },\n    },\n  },\n  { baseComponent: true },\n);\n\nexport const ArticleWrapper = forwardRef<HTMLElement, ComponentPropsWithRef<\"article\"> & StyledProps>((props, ref) => (\n  <StyledArticleWrapper data-ndla-article=\"\" ref={ref} {...props} />\n));\n\nexport const ArticleHGroup = styled(\n  ark.hgroup,\n  {\n    base: {\n      display: \"flex\",\n      width: \"100%\",\n      flexDirection: \"column\",\n      alignItems: \"flex-start\",\n      \"& h1\": {\n        overflowWrap: \"anywhere\",\n      },\n    },\n  },\n  { baseComponent: true },\n);\n\nexport const ArticleHeader = styled(\n  ark.header,\n  {\n    base: {\n      display: \"flex\",\n      flexDirection: \"column\",\n      gap: \"medium\",\n      alignItems: \"flex-start\",\n      width: \"100%\",\n      paddingBlockStart: \"xxlarge\",\n      overflowWrap: \"anywhere\",\n    },\n  },\n  { baseComponent: true },\n);\n\nexport const ArticleFooter = styled(\n  ark.footer,\n  {\n    base: {\n      display: \"flex\",\n      flexDirection: \"column\",\n      gap: \"xxlarge\",\n      width: \"100%\",\n      \"& > :is(:last-child)\": {\n        paddingBlockEnd: \"5xlarge\",\n      },\n    },\n  },\n  { baseComponent: true },\n);\n\nconst InfoWrapper = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"space-between\",\n    gap: \"small\",\n    width: \"100%\",\n    minHeight: \"xxlarge\",\n  },\n});\n\nconst StyledWrapper = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    gap: \"small\",\n    flexWrap: \"wrap\",\n    alignItems: \"center\",\n  },\n});\n\ninterface ArticleTitleProps {\n  badges?: ReactNode;\n  heartButton?: ReactNode;\n  competenceGoals?: ReactNode;\n  id: string;\n  lang?: string;\n  title?: ReactNode;\n  introduction?: ReactNode;\n  disclaimer?: ReactNode;\n  children?: ReactNode;\n}\n\nexport const ArticleTitle = ({\n  badges,\n  heartButton,\n  title,\n  lang,\n  id,\n  introduction,\n  competenceGoals,\n  disclaimer,\n  children,\n}: ArticleTitleProps) => {\n  return (\n    <ArticleHeader>\n      <ArticleHGroup>\n        {(!!badges || !!heartButton) && (\n          <InfoWrapper>\n            {!!badges && <BadgesContainer>{badges}</BadgesContainer>}\n            {heartButton}\n          </InfoWrapper>\n        )}\n        <Heading textStyle=\"heading.medium\" id={id} lang={lang} property=\"dct:title\">\n          {title}\n        </Heading>\n      </ArticleHGroup>\n      {!!introduction && (\n        <Text lang={lang} textStyle=\"body.xlarge\" asChild consumeCss>\n          <div>{introduction}</div>\n        </Text>\n      )}\n      <StyledWrapper>\n        {competenceGoals}\n        {disclaimer}\n      </StyledWrapper>\n      {children}\n    </ArticleHeader>\n  );\n};\n\ninterface Props {\n  badges?: ReactNode;\n  heartButton?: ReactNode;\n  article: ArticleType;\n  licenseBox?: ReactNode;\n  children?: ReactNode;\n  competenceGoals?: ReactNode;\n  id: string;\n  lang?: string;\n  disclaimer?: ReactNode;\n}\n\nexport const Article = ({\n  badges,\n  article,\n  licenseBox,\n  children,\n  competenceGoals,\n  id,\n  heartButton,\n  lang,\n  disclaimer,\n}: Props) => {\n  const { title, introduction, published, content, footNotes, copyright } = article;\n\n  const authors =\n    copyright?.creators.length || copyright?.rightsholders.length ? copyright.creators : copyright?.processors;\n\n  return (\n    <ArticleWrapper>\n      <ArticleTitle\n        id={id}\n        badges={badges}\n        heartButton={heartButton}\n        title={title}\n        introduction={introduction}\n        competenceGoals={competenceGoals}\n        lang={lang}\n        disclaimer={disclaimer}\n      />\n      <ArticleContent>{content}</ArticleContent>\n      <ArticleFooter>\n        <ArticleByline\n          lang={lang}\n          footnotes={footNotes}\n          authors={authors}\n          suppliers={copyright?.rightsholders}\n          published={published}\n          licenseBox={licenseBox}\n        />\n        {children}\n      </ArticleFooter>\n    </ArticleWrapper>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;AAkBA,MAAM,uBAAuB,OAAO,IAAI,SAAS,EAAE,EAAE,EAAE,eAAe,MAAM,CAAC;AAE7E,MAAa,iBAAiB,YAC3B,EAAE,WAAW,GAAG,SAAS,QACxB,oBAAC;CAAqB,WAAW,GAAG,gBAAgB,UAAU;CAAE,GAAI;CAAY;EAAO,CAE1F;AAED,MAAM,uBAAuB,OAC3B,IAAI,SACJ,EACE,MAAM;CACJ,YAAY;CACZ,SAAS;CACT,eAAe;CACf,OAAO;CACP,YAAY;CACZ,OAAO;CACP,cAAc;CACd,UAAU;CACV,sCAAsC,EACpC,WAAW,mCACZ;CACD,QAAQ;EACN,SAAS;EACT,SAAS;EACT,OAAO;EACR;CACF,EACF,EACD,EAAE,eAAe,MAAM,CACxB;AAED,MAAa,iBAAiB,YAAyE,OAAO,QAC5G,oBAAC;CAAqB,qBAAkB;CAAQ;CAAK,GAAI;EAAS,CAClE;AAEF,MAAa,gBAAgB,OAC3B,IAAI,QACJ,EACE,MAAM;CACJ,SAAS;CACT,OAAO;CACP,eAAe;CACf,YAAY;CACZ,QAAQ,EACN,cAAc,YACf;CACF,EACF,EACD,EAAE,eAAe,MAAM,CACxB;AAED,MAAa,gBAAgB,OAC3B,IAAI,QACJ,EACE,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACL,YAAY;CACZ,OAAO;CACP,mBAAmB;CACnB,cAAc;CACf,EACF,EACD,EAAE,eAAe,MAAM,CACxB;AAED,MAAa,gBAAgB,OAC3B,IAAI,QACJ,EACE,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACL,OAAO;CACP,wBAAwB,EACtB,iBAAiB,WAClB;CACF,EACF,EACD,EAAE,eAAe,MAAM,CACxB;AAED,MAAM,cAAc,OAAO,OAAO,EAChC,MAAM;CACJ,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,KAAK;CACL,OAAO;CACP,WAAW;CACZ,EACF,CAAC;AAEF,MAAM,gBAAgB,OAAO,OAAO,EAClC,MAAM;CACJ,SAAS;CACT,KAAK;CACL,UAAU;CACV,YAAY;CACb,EACF,CAAC;AAcF,MAAa,gBAAgB,EAC3B,QACA,aACA,OACA,MACA,IACA,cACA,iBACA,YACA,eACuB;AACvB,QACE,qBAAC;EACC,qBAAC,6BACG,CAAC,CAAC,UAAU,CAAC,CAAC,gBACd,qBAAC,0BACE,CAAC,CAAC,UAAU,oBAAC,6BAAiB,SAAyB,EACvD,eACW,EAEhB,oBAAC;GAAQ,WAAU;GAAqB;GAAU;GAAM,UAAS;aAC9D;IACO,IACI;EACf,CAAC,CAAC,gBACD,oBAAC;GAAW;GAAM,WAAU;GAAc;GAAQ;aAChD,oBAAC,mBAAK,eAAmB;IACpB;EAET,qBAAC,4BACE,iBACA,cACa;EACf;KACa;;AAgBpB,MAAa,WAAW,EACtB,QACA,SACA,YACA,UACA,iBACA,IACA,aACA,MACA,iBACW;CACX,MAAM,EAAE,OAAO,cAAc,WAAW,SAAS,WAAW,cAAc;CAE1E,MAAM,UACJ,WAAW,SAAS,UAAU,WAAW,cAAc,SAAS,UAAU,WAAW,WAAW;AAElG,QACE,qBAAC;EACC,oBAAC;GACK;GACI;GACK;GACN;GACO;GACG;GACX;GACM;IACZ;EACF,oBAAC,4BAAgB,UAAyB;EAC1C,qBAAC,4BACC,oBAAC;GACO;GACN,WAAW;GACF;GACT,WAAW,WAAW;GACX;GACC;IACZ,EACD,YACa;KACD"}
+{"version":3,"file":"Article.mjs","names":[],"sources":["../../src/Article/Article.tsx"],"sourcesContent":["/**\n * Copyright (c) 2016-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 { ark, type HTMLArkProps } from \"@ark-ui/react\";\nimport { Heading, Text } from \"@ndla/primitives\";\nimport { cx } from \"@ndla/styled-system/css\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { BadgesContainer } from \"./BadgesContainer\";\n\nconst StyledArticleContent = styled(ark.section, {}, { baseComponent: true });\n\nexport const ArticleContent = forwardRef<HTMLElement, HTMLArkProps<\"div\"> & StyledProps>(\n  ({ className, ...props }, ref) => (\n    <StyledArticleContent className={cx(\"ndla-article\", className)} {...props} ref={ref} />\n  ),\n);\n\nconst StyledArticleWrapper = styled(\n  ark.article,\n  {\n    base: {\n      background: \"background.default\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      color: \"text.default\",\n      alignItems: \"center\",\n      width: \"100%\",\n      overflowWrap: \"break-word\",\n      position: \"relative\",\n      \"& mjx-stretchy-v > mjx-ext > mjx-c\": {\n        transform: \"scaleY(100) translateY(0.075em)\",\n      },\n      _after: {\n        content: \"\",\n        display: \"table\",\n        clear: \"both\",\n      },\n    },\n  },\n  { baseComponent: true },\n);\n\nexport const ArticleWrapper = forwardRef<HTMLElement, ComponentPropsWithRef<\"article\"> & StyledProps>((props, ref) => (\n  <StyledArticleWrapper data-ndla-article=\"\" ref={ref} {...props} />\n));\n\nexport const ArticleHGroup = styled(\n  ark.hgroup,\n  {\n    base: {\n      display: \"flex\",\n      width: \"100%\",\n      flexDirection: \"column\",\n      alignItems: \"flex-start\",\n      \"& h1\": {\n        overflowWrap: \"anywhere\",\n      },\n    },\n  },\n  { baseComponent: true },\n);\n\nexport const ArticleHeader = styled(\n  ark.header,\n  {\n    base: {\n      display: \"flex\",\n      flexDirection: \"column\",\n      gap: \"medium\",\n      alignItems: \"flex-start\",\n      width: \"100%\",\n      paddingBlockStart: \"xxlarge\",\n      overflowWrap: \"anywhere\",\n    },\n  },\n  { baseComponent: true },\n);\n\nexport const ArticleFooter = styled(\n  ark.footer,\n  {\n    base: {\n      display: \"flex\",\n      flexDirection: \"column\",\n      gap: \"xxlarge\",\n      width: \"100%\",\n      \"& > :is(:last-child)\": {\n        paddingBlockEnd: \"5xlarge\",\n      },\n    },\n  },\n  { baseComponent: true },\n);\n\nconst InfoWrapper = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"space-between\",\n    gap: \"small\",\n    width: \"100%\",\n    minHeight: \"xxlarge\",\n  },\n});\n\nconst StyledWrapper = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    gap: \"small\",\n    flexWrap: \"wrap\",\n    alignItems: \"center\",\n  },\n});\n\ninterface ArticleTitleProps {\n  badges?: ReactNode;\n  heartButton?: ReactNode;\n  competenceGoals?: ReactNode;\n  id: string;\n  lang?: string;\n  title?: ReactNode;\n  introduction?: ReactNode;\n  disclaimer?: ReactNode;\n  children?: ReactNode;\n}\n\nexport const ArticleTitle = ({\n  badges,\n  heartButton,\n  title,\n  lang,\n  id,\n  introduction,\n  competenceGoals,\n  disclaimer,\n  children,\n}: ArticleTitleProps) => {\n  return (\n    <ArticleHeader>\n      <ArticleHGroup>\n        {(!!badges || !!heartButton) && (\n          <InfoWrapper>\n            {!!badges && <BadgesContainer>{badges}</BadgesContainer>}\n            {heartButton}\n          </InfoWrapper>\n        )}\n        <Heading textStyle=\"heading.medium\" id={id} lang={lang} property=\"dct:title\">\n          {title}\n        </Heading>\n      </ArticleHGroup>\n      {!!introduction && (\n        <Text lang={lang} textStyle=\"body.xlarge\" asChild consumeCss>\n          <div>{introduction}</div>\n        </Text>\n      )}\n      <StyledWrapper>\n        {competenceGoals}\n        {disclaimer}\n      </StyledWrapper>\n      {children}\n    </ArticleHeader>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;AAgBA,MAAM,uBAAuB,OAAO,IAAI,SAAS,EAAE,EAAE,EAAE,eAAe,MAAM,CAAC;AAE7E,MAAa,iBAAiB,YAC3B,EAAE,WAAW,GAAG,SAAS,QACxB,oBAAC;CAAqB,WAAW,GAAG,gBAAgB,UAAU;CAAE,GAAI;CAAY;EAAO,CAE1F;AAED,MAAM,uBAAuB,OAC3B,IAAI,SACJ,EACE,MAAM;CACJ,YAAY;CACZ,SAAS;CACT,eAAe;CACf,OAAO;CACP,YAAY;CACZ,OAAO;CACP,cAAc;CACd,UAAU;CACV,sCAAsC,EACpC,WAAW,mCACZ;CACD,QAAQ;EACN,SAAS;EACT,SAAS;EACT,OAAO;EACR;CACF,EACF,EACD,EAAE,eAAe,MAAM,CACxB;AAED,MAAa,iBAAiB,YAAyE,OAAO,QAC5G,oBAAC;CAAqB,qBAAkB;CAAQ;CAAK,GAAI;EAAS,CAClE;AAEF,MAAa,gBAAgB,OAC3B,IAAI,QACJ,EACE,MAAM;CACJ,SAAS;CACT,OAAO;CACP,eAAe;CACf,YAAY;CACZ,QAAQ,EACN,cAAc,YACf;CACF,EACF,EACD,EAAE,eAAe,MAAM,CACxB;AAED,MAAa,gBAAgB,OAC3B,IAAI,QACJ,EACE,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACL,YAAY;CACZ,OAAO;CACP,mBAAmB;CACnB,cAAc;CACf,EACF,EACD,EAAE,eAAe,MAAM,CACxB;AAED,MAAa,gBAAgB,OAC3B,IAAI,QACJ,EACE,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACL,OAAO;CACP,wBAAwB,EACtB,iBAAiB,WAClB;CACF,EACF,EACD,EAAE,eAAe,MAAM,CACxB;AAED,MAAM,cAAc,OAAO,OAAO,EAChC,MAAM;CACJ,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,KAAK;CACL,OAAO;CACP,WAAW;CACZ,EACF,CAAC;AAEF,MAAM,gBAAgB,OAAO,OAAO,EAClC,MAAM;CACJ,SAAS;CACT,KAAK;CACL,UAAU;CACV,YAAY;CACb,EACF,CAAC;AAcF,MAAa,gBAAgB,EAC3B,QACA,aACA,OACA,MACA,IACA,cACA,iBACA,YACA,eACuB;AACvB,QACE,qBAAC;EACC,qBAAC,6BACG,CAAC,CAAC,UAAU,CAAC,CAAC,gBACd,qBAAC,0BACE,CAAC,CAAC,UAAU,oBAAC,6BAAiB,SAAyB,EACvD,eACW,EAEhB,oBAAC;GAAQ,WAAU;GAAqB;GAAU;GAAM,UAAS;aAC9D;IACO,IACI;EACf,CAAC,CAAC,gBACD,oBAAC;GAAW;GAAM,WAAU;GAAc;GAAQ;aAChD,oBAAC,mBAAK,eAAmB;IACpB;EAET,qBAAC,4BACE,iBACA,cACa;EACf;KACa"}

package/es/Article/ArticleByline.mjs

@@ -1,12 +1,12 @@
 import { ArticleFootNotes } from "./ArticleFootNotes.mjs";
-import { forwardRef, useCallback, useEffect, useState } from "react";
+import { forwardRef, useCallback, useEffect, useRef } from "react";
 import { AccordionItem, AccordionItemContent, AccordionItemIndicator, AccordionItemTrigger, AccordionRoot, Heading } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
 import { useTranslation } from "react-i18next";
 import { ArrowDownShortLine } from "@ndla/icons";
 import { SafeLink } from "@ndla/safelink";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useLocation } from "react-router";
+import { useAccordionContext } from "@ark-ui/react";
 
 //#region src/Article/ArticleByline.tsx
 /**
@@ -47,27 +47,9 @@ const StyledAccordionRoot = styled(AccordionRoot, { base: {
 } });
 const refRegexp = /note\d/;
 const footnotesAccordionId = "footnotes";
+const accordionItemValue = "rulesForUse";
 const ArticleByline = ({ lang, authors = [], suppliers = [], footnotes, licenseBox, published, displayByline = true, bylineType = "article", bylineSuffix, learningpathCopiedFrom }) => {
 	const { t, i18n } = useTranslation();
-	const { pathname } = useLocation();
-	const [openAccordions, setOpenAccordions] = useState([]);
-	const accordionItemValue = "rulesForUse";
-	const onHashChange = useCallback((e) => {
-		const hash = e.newURL.split("#")[1];
-		if (hash?.match(refRegexp) && !openAccordions.includes(footnotesAccordionId)) {
-			setOpenAccordions([...openAccordions, footnotesAccordionId]);
-			const el = document.getElementById(`#${hash}`);
-			el?.click();
-			el?.focus();
-		}
-	}, [openAccordions]);
-	useEffect(() => {
-		setOpenAccordions((prev) => prev.filter((state) => state !== accordionItemValue));
-	}, [pathname]);
-	useEffect(() => {
-		window.addEventListener("hashchange", onHashChange);
-		return () => window.removeEventListener("hashchange", onHashChange);
-	}, [onHashChange]);
 	const showPrimaryContributors = suppliers.length > 0 || authors.length > 0;
 	const listFormatter = new Intl.ListFormat(lang ?? i18n.language, {
 		style: "long",
@@ -93,19 +75,40 @@ const ArticleByline = ({ lang, authors = [], suppliers = [], footnotes, licenseB
 		]
 	}), (!!licenseBox || !!footnotes?.length) && /* @__PURE__ */ jsxs(StyledAccordionRoot, {
 		multiple: true,
-		value: openAccordions,
-		onValueChange: (details) => setOpenAccordions(details.value),
 		children: [!!licenseBox && /* @__PURE__ */ jsx(ArticleBylineAccordionItem, {
 			value: accordionItemValue,
 			accordionTitle: t("article.useContent"),
 			children: licenseBox
-		}), !!footnotes?.length && /* @__PURE__ */ jsx(ArticleBylineAccordionItem, {
-			value: footnotesAccordionId,
-			accordionTitle: t("article.footnotes"),
-			children: /* @__PURE__ */ jsx(ArticleFootNotes, { footNotes: footnotes })
-		})]
+		}), !!footnotes?.length && /* @__PURE__ */ jsx(ArticleBylineFootnotes, { footnotes })]
 	})] });
 };
+const ArticleBylineFootnotes = ({ footnotes }) => {
+	const { t } = useTranslation();
+	const { value, setValue } = useAccordionContext();
+	const ref = useRef(null);
+	const onHashChange = useCallback((e) => {
+		const hash = e.newURL.split("#")[1];
+		if (hash?.match(refRegexp) && !value.includes(footnotesAccordionId)) {
+			ref.current?.scrollIntoView({ behavior: "smooth" });
+			setValue([...value, footnotesAccordionId]);
+			setTimeout(() => {
+				const el = document.getElementById(`${hash}`);
+				el?.click();
+				el?.focus();
+			}, 300);
+		}
+	}, [value, setValue]);
+	useEffect(() => {
+		window.addEventListener("hashchange", onHashChange);
+		return () => window.removeEventListener("hashchange", onHashChange);
+	}, [onHashChange]);
+	return /* @__PURE__ */ jsx(ArticleBylineAccordionItem, {
+		ref,
+		value: footnotesAccordionId,
+		accordionTitle: t("article.footnotes"),
+		children: /* @__PURE__ */ jsx(ArticleFootNotes, { footNotes: footnotes })
+	});
+};
 const ArticleBylineAccordionItem = forwardRef(({ value, accordionTitle, children, ...props }, ref) => {
 	return /* @__PURE__ */ jsxs(AccordionItem, {
 		value,

package/es/Article/ArticleByline.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ArticleByline.mjs","names":[],"sources":["../../src/Article/ArticleByline.tsx"],"sourcesContent":["/**\n * Copyright (c) 2020-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, forwardRef, useCallback, useEffect, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { useLocation } from \"react-router\";\nimport { ArrowDownShortLine } from \"@ndla/icons\";\nimport {\n  AccordionItem,\n  AccordionItemContent,\n  AccordionItemIndicator,\n  type AccordionItemProps,\n  AccordionItemTrigger,\n  AccordionRoot,\n  Heading,\n} from \"@ndla/primitives\";\nimport { SafeLink } from \"@ndla/safelink\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport { ArticleFootNotes } from \"./ArticleFootNotes\";\nimport type { FootNote } from \"../types\";\n\nconst Wrapper = styled(\"div\", {\n  base: {\n    // TODO: Figure out if we want to remove this margin. It's only here to add some gap between the article content and the byline.\n    marginBlockStart: \"medium\",\n    paddingBlockStart: \"xsmall\",\n    borderTop: \"1px solid\",\n    borderColor: \"stroke.subtle\",\n  },\n});\n\nconst TextWrapper = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: \"3xsmall\",\n    width: \"100%\",\n    justifyContent: \"space-between\",\n    paddingBlock: \"xsmall\",\n    textStyle: \"body.medium\",\n    '& [data-contributors=\"false\"]': {\n      marginInlineStart: \"auto\",\n    },\n  },\n  variants: {\n    learningpath: {\n      true: {},\n      false: {\n        tabletWide: {\n          flexDirection: \"row\",\n        },\n      },\n    },\n  },\n});\n\ntype AuthorProps = {\n  name: string;\n};\n\ntype SupplierProps = {\n  name: string;\n};\n\ntype Props = {\n  lang?: string;\n  authors?: AuthorProps[];\n  suppliers?: SupplierProps[];\n  published?: string;\n  licenseBox?: ReactNode;\n  footnotes?: FootNote[];\n  displayByline?: boolean;\n  bylineType?: \"article\" | \"learningPath\" | \"external\";\n  bylineSuffix?: ReactNode;\n  learningpathCopiedFrom?: string;\n};\n\nfunction formatList(list: SupplierProps[], listFormatter: Intl.ListFormat) {\n  return listFormatter.format(list.map((l) => l.name));\n}\n\nconst StyledAccordionRoot = styled(AccordionRoot, {\n  base: {\n    paddingBlockStart: \"xxlarge\",\n    _print: {\n      display: \"none\",\n    },\n  },\n});\n\nconst refRegexp = /note\\d/;\nconst footnotesAccordionId = \"footnotes\";\n\nexport const ArticleByline = ({\n  lang,\n  authors = [],\n  suppliers = [],\n  footnotes,\n  licenseBox,\n  published,\n  displayByline = true,\n  bylineType = \"article\",\n  bylineSuffix,\n  learningpathCopiedFrom,\n}: Props) => {\n  const { t, i18n } = useTranslation();\n  const { pathname } = useLocation();\n  const [openAccordions, setOpenAccordions] = useState<string[]>([]);\n  const accordionItemValue = \"rulesForUse\";\n\n  const onHashChange = useCallback(\n    (e: HashChangeEvent) => {\n      const hash = e.newURL.split(\"#\")[1];\n      if (hash?.match(refRegexp) && !openAccordions.includes(footnotesAccordionId)) {\n        setOpenAccordions([...openAccordions, footnotesAccordionId]);\n        const el = document.getElementById(`#${hash}`);\n        el?.click();\n        el?.focus();\n      }\n    },\n    [openAccordions],\n  );\n\n  useEffect(() => {\n    setOpenAccordions((prev) => prev.filter((state) => state !== accordionItemValue));\n  }, [pathname]);\n\n  useEffect(() => {\n    window.addEventListener(\"hashchange\", onHashChange);\n    return () => window.removeEventListener(\"hashchange\", onHashChange);\n  }, [onHashChange]);\n\n  const showPrimaryContributors = suppliers.length > 0 || authors.length > 0;\n  const listFormatter = new Intl.ListFormat(lang ?? i18n.language, { style: \"long\", type: \"conjunction\" });\n\n  return (\n    <Wrapper>\n      {!!displayByline && (\n        <TextWrapper learningpath={bylineType === \"learningPath\"}>\n          {!!showPrimaryContributors && (\n            <span>\n              {authors.length > 0 &&\n                `${t(\"article.authorsLabel\", { context: bylineType })} ${formatList(authors, listFormatter)}. `}\n              {suppliers.length > 0 &&\n                `${t(\"article.supplierLabel\", { count: suppliers.length })} ${formatList(suppliers, listFormatter)}.`}\n            </span>\n          )}\n          {learningpathCopiedFrom ? (\n            <SafeLink to={learningpathCopiedFrom}>{t(`learningPath.copiedFrom`)}</SafeLink>\n          ) : null}\n          {published ? (\n            <div data-contributors={showPrimaryContributors}>\n              {t(`${bylineType}.lastUpdated`)} {published}\n            </div>\n          ) : null}\n          {bylineSuffix}\n        </TextWrapper>\n      )}\n      {(!!licenseBox || !!footnotes?.length) && (\n        <StyledAccordionRoot\n          multiple\n          value={openAccordions}\n          onValueChange={(details) => setOpenAccordions(details.value)}\n        >\n          {!!licenseBox && (\n            <ArticleBylineAccordionItem value={accordionItemValue} accordionTitle={t(\"article.useContent\")}>\n              {licenseBox}\n            </ArticleBylineAccordionItem>\n          )}\n          {!!footnotes?.length && (\n            <ArticleBylineAccordionItem value={footnotesAccordionId} accordionTitle={t(\"article.footnotes\")}>\n              <ArticleFootNotes footNotes={footnotes} />\n            </ArticleBylineAccordionItem>\n          )}\n        </StyledAccordionRoot>\n      )}\n    </Wrapper>\n  );\n};\n\ninterface ArticleBylineAccordionprops extends AccordionItemProps {\n  accordionTitle: ReactNode;\n}\n\nexport const ArticleBylineAccordionItem = forwardRef<HTMLDivElement, ArticleBylineAccordionprops>(\n  ({ value, accordionTitle, children, ...props }, ref) => {\n    return (\n      <AccordionItem value={value} ref={ref} {...props}>\n        <Heading asChild consumeCss textStyle=\"label.medium\" fontWeight=\"bold\">\n          <h2>\n            <AccordionItemTrigger>\n              {accordionTitle}\n              <AccordionItemIndicator asChild>\n                <ArrowDownShortLine />\n              </AccordionItemIndicator>\n            </AccordionItemTrigger>\n          </h2>\n        </Heading>\n        <AccordionItemContent>{children}</AccordionItemContent>\n      </AccordionItem>\n    );\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"ArticleByline.mjs","names":[],"sources":["../../src/Article/ArticleByline.tsx"],"sourcesContent":["/**\n * Copyright (c) 2020-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, forwardRef, useCallback, useEffect, useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { useAccordionContext } from \"@ark-ui/react\";\nimport { ArrowDownShortLine } from \"@ndla/icons\";\nimport {\n  AccordionItem,\n  AccordionItemContent,\n  AccordionItemIndicator,\n  type AccordionItemProps,\n  AccordionItemTrigger,\n  AccordionRoot,\n  Heading,\n} from \"@ndla/primitives\";\nimport { SafeLink } from \"@ndla/safelink\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport { ArticleFootNotes } from \"./ArticleFootNotes\";\nimport type { FootNote } from \"../types\";\n\nconst Wrapper = styled(\"div\", {\n  base: {\n    // TODO: Figure out if we want to remove this margin. It's only here to add some gap between the article content and the byline.\n    marginBlockStart: \"medium\",\n    paddingBlockStart: \"xsmall\",\n    borderTop: \"1px solid\",\n    borderColor: \"stroke.subtle\",\n  },\n});\n\nconst TextWrapper = styled(\"div\", {\n  base: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: \"3xsmall\",\n    width: \"100%\",\n    justifyContent: \"space-between\",\n    paddingBlock: \"xsmall\",\n    textStyle: \"body.medium\",\n    '& [data-contributors=\"false\"]': {\n      marginInlineStart: \"auto\",\n    },\n  },\n  variants: {\n    learningpath: {\n      true: {},\n      false: {\n        tabletWide: {\n          flexDirection: \"row\",\n        },\n      },\n    },\n  },\n});\n\ntype AuthorProps = {\n  name: string;\n};\n\ntype SupplierProps = {\n  name: string;\n};\n\ntype Props = {\n  lang?: string;\n  authors?: AuthorProps[];\n  suppliers?: SupplierProps[];\n  published?: string;\n  licenseBox?: ReactNode;\n  footnotes?: FootNote[];\n  displayByline?: boolean;\n  bylineType?: \"article\" | \"learningPath\" | \"external\";\n  bylineSuffix?: ReactNode;\n  learningpathCopiedFrom?: string;\n};\n\nfunction formatList(list: SupplierProps[], listFormatter: Intl.ListFormat) {\n  return listFormatter.format(list.map((l) => l.name));\n}\n\nconst StyledAccordionRoot = styled(AccordionRoot, {\n  base: {\n    paddingBlockStart: \"xxlarge\",\n    _print: {\n      display: \"none\",\n    },\n  },\n});\n\nconst refRegexp = /note\\d/;\nconst footnotesAccordionId = \"footnotes\";\nconst accordionItemValue = \"rulesForUse\";\n\nexport const ArticleByline = ({\n  lang,\n  authors = [],\n  suppliers = [],\n  footnotes,\n  licenseBox,\n  published,\n  displayByline = true,\n  bylineType = \"article\",\n  bylineSuffix,\n  learningpathCopiedFrom,\n}: Props) => {\n  const { t, i18n } = useTranslation();\n\n  const showPrimaryContributors = suppliers.length > 0 || authors.length > 0;\n  const listFormatter = new Intl.ListFormat(lang ?? i18n.language, { style: \"long\", type: \"conjunction\" });\n\n  return (\n    <Wrapper>\n      {!!displayByline && (\n        <TextWrapper learningpath={bylineType === \"learningPath\"}>\n          {!!showPrimaryContributors && (\n            <span>\n              {authors.length > 0 &&\n                `${t(\"article.authorsLabel\", { context: bylineType })} ${formatList(authors, listFormatter)}. `}\n              {suppliers.length > 0 &&\n                `${t(\"article.supplierLabel\", { count: suppliers.length })} ${formatList(suppliers, listFormatter)}.`}\n            </span>\n          )}\n          {learningpathCopiedFrom ? (\n            <SafeLink to={learningpathCopiedFrom}>{t(`learningPath.copiedFrom`)}</SafeLink>\n          ) : null}\n          {published ? (\n            <div data-contributors={showPrimaryContributors}>\n              {t(`${bylineType}.lastUpdated`)} {published}\n            </div>\n          ) : null}\n          {bylineSuffix}\n        </TextWrapper>\n      )}\n      {(!!licenseBox || !!footnotes?.length) && (\n        <StyledAccordionRoot multiple>\n          {!!licenseBox && (\n            <ArticleBylineAccordionItem value={accordionItemValue} accordionTitle={t(\"article.useContent\")}>\n              {licenseBox}\n            </ArticleBylineAccordionItem>\n          )}\n          {!!footnotes?.length && <ArticleBylineFootnotes footnotes={footnotes} />}\n        </StyledAccordionRoot>\n      )}\n    </Wrapper>\n  );\n};\n\ninterface ArticleBylineAccordionprops extends AccordionItemProps {\n  accordionTitle: ReactNode;\n}\n\ninterface ArticleBylineFootnotesProps {\n  footnotes: FootNote[];\n}\n\nexport const ArticleBylineFootnotes = ({ footnotes }: ArticleBylineFootnotesProps) => {\n  const { t } = useTranslation();\n  const { value, setValue } = useAccordionContext();\n  const ref = useRef<HTMLDivElement>(null);\n\n  const onHashChange = useCallback(\n    (e: HashChangeEvent) => {\n      const hash = e.newURL.split(\"#\")[1];\n      if (hash?.match(refRegexp) && !value.includes(footnotesAccordionId)) {\n        ref.current?.scrollIntoView({ behavior: \"smooth\" });\n        setValue([...value, footnotesAccordionId]);\n        setTimeout(() => {\n          const el = document.getElementById(`${hash}`);\n          el?.click();\n          el?.focus();\n        }, 300);\n      }\n    },\n    [value, setValue],\n  );\n\n  useEffect(() => {\n    window.addEventListener(\"hashchange\", onHashChange);\n    return () => window.removeEventListener(\"hashchange\", onHashChange);\n  }, [onHashChange]);\n\n  return (\n    <ArticleBylineAccordionItem ref={ref} value={footnotesAccordionId} accordionTitle={t(\"article.footnotes\")}>\n      <ArticleFootNotes footNotes={footnotes} />\n    </ArticleBylineAccordionItem>\n  );\n};\n\nexport const ArticleBylineAccordionItem = forwardRef<HTMLDivElement, ArticleBylineAccordionprops>(\n  ({ value, accordionTitle, children, ...props }, ref) => {\n    return (\n      <AccordionItem value={value} ref={ref} {...props}>\n        <Heading asChild consumeCss textStyle=\"label.medium\" fontWeight=\"bold\">\n          <h2>\n            <AccordionItemTrigger>\n              {accordionTitle}\n              <AccordionItemIndicator asChild>\n                <ArrowDownShortLine />\n              </AccordionItemIndicator>\n            </AccordionItemTrigger>\n          </h2>\n        </Heading>\n        <AccordionItemContent>{children}</AccordionItemContent>\n      </AccordionItem>\n    );\n  },\n);\n"],"mappings":"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"}

package/es/Article/ArticleFootNotes.mjs

@@ -21,6 +21,7 @@ const FootNote = ({ footNote }) => /* @__PURE__ */ jsx("li", { children: /* @__P
 	asChild: true,
 	consumeCss: true,
 	textStyle: "body.medium",
+	tabIndex: -1,
 	children: /* @__PURE__ */ jsxs(StyledCite, { children: [
 		/* @__PURE__ */ jsx("a", {
 			href: `#ref${footNote.ref}`,

package/es/Article/ArticleFootNotes.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ArticleFootNotes.mjs","names":[],"sources":["../../src/Article/ArticleFootNotes.tsx"],"sourcesContent":["/**\n * Copyright (c) 2017-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 { Text } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { FootNote as FootNoteType } from \"../types\";\n\nconst citeDetailString = (description: string | undefined) => (description ? `${description}. ` : \"\");\n\ntype FootNoteProps = {\n  footNote: FootNoteType;\n};\n\nconst StyledCite = styled(\"cite\", {\n  base: {\n    display: \"flex\",\n    alignItems: \"center\",\n    gap: \"xsmall\",\n  },\n});\n\nconst FootNote = ({ footNote }: FootNoteProps) => (\n  <li>\n    <Text id={`note${footNote.ref}`} asChild consumeCss textStyle=\"body.medium\">\n      <StyledCite>\n        <a href={`#ref${footNote.ref}`} target=\"_self\">\n          {footNote.ref}\n        </a>\n        {`«${footNote.title}». ${footNote.authors.join(\" \")}. ${citeDetailString(footNote.edition)}${citeDetailString(\n          footNote.publisher,\n        )}${footNote.year}. `}\n        {footNote.url ? (\n          <a href={footNote.url}>\n            {footNote.url}\n            {\".\"}\n          </a>\n        ) : null}\n      </StyledCite>\n    </Text>\n  </li>\n);\n\ntype ArticleFootNotesProps = {\n  footNotes: Array<FootNoteType>;\n};\n\nconst FootnoteList = styled(\"ol\", {\n  base: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: \"medium\",\n    listStyle: \"none\",\n  },\n});\n\nexport const ArticleFootNotes = ({ footNotes }: ArticleFootNotesProps) => (\n  <FootnoteList>\n    {footNotes.map((footNote) => (\n      <FootNote key={footNote.ref} footNote={footNote} />\n    ))}\n  </FootnoteList>\n);\n"],"mappings":";;;;;;;;;;;;AAYA,MAAM,oBAAoB,gBAAqC,cAAc,GAAG,YAAY,MAAM;AAMlG,MAAM,aAAa,OAAO,QAAQ,EAChC,MAAM;CACJ,SAAS;CACT,YAAY;CACZ,KAAK;CACN,EACF,CAAC;AAEF,MAAM,YAAY,EAAE,eAClB,oBAAC,kBACC,oBAAC;CAAK,IAAI,OAAO,SAAS;CAAO;CAAQ;CAAW,WAAU;WAC5D,qBAAC;EACC,oBAAC;GAAE,MAAM,OAAO,SAAS;GAAO,QAAO;aACpC,SAAS;IACR;EACH,IAAI,SAAS,MAAM,KAAK,SAAS,QAAQ,KAAK,IAAI,CAAC,IAAI,iBAAiB,SAAS,QAAQ,GAAG,iBAC3F,SAAS,UACV,GAAG,SAAS,KAAK;EACjB,SAAS,MACR,qBAAC;GAAE,MAAM,SAAS;cACf,SAAS,KACT;IACC,GACF;KACO;EACR,GACJ;AAOP,MAAM,eAAe,OAAO,MAAM,EAChC,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACL,WAAW;CACZ,EACF,CAAC;AAEF,MAAa,oBAAoB,EAAE,gBACjC,oBAAC,0BACE,UAAU,KAAK,aACd,oBAAC,YAAsC,YAAxB,SAAS,IAA2B,CACnD,GACW"}
+{"version":3,"file":"ArticleFootNotes.mjs","names":[],"sources":["../../src/Article/ArticleFootNotes.tsx"],"sourcesContent":["/**\n * Copyright (c) 2017-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 { Text } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { FootNote as FootNoteType } from \"../types\";\n\nconst citeDetailString = (description: string | undefined) => (description ? `${description}. ` : \"\");\n\ntype FootNoteProps = {\n  footNote: FootNoteType;\n};\n\nconst StyledCite = styled(\"cite\", {\n  base: {\n    display: \"flex\",\n    alignItems: \"center\",\n    gap: \"xsmall\",\n  },\n});\n\nconst FootNote = ({ footNote }: FootNoteProps) => (\n  <li>\n    <Text id={`note${footNote.ref}`} asChild consumeCss textStyle=\"body.medium\" tabIndex={-1}>\n      <StyledCite>\n        <a href={`#ref${footNote.ref}`} target=\"_self\">\n          {footNote.ref}\n        </a>\n        {`«${footNote.title}». ${footNote.authors.join(\" \")}. ${citeDetailString(footNote.edition)}${citeDetailString(\n          footNote.publisher,\n        )}${footNote.year}. `}\n        {footNote.url ? (\n          <a href={footNote.url}>\n            {footNote.url}\n            {\".\"}\n          </a>\n        ) : null}\n      </StyledCite>\n    </Text>\n  </li>\n);\n\ntype ArticleFootNotesProps = {\n  footNotes: Array<FootNoteType>;\n};\n\nconst FootnoteList = styled(\"ol\", {\n  base: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: \"medium\",\n    listStyle: \"none\",\n  },\n});\n\nexport const ArticleFootNotes = ({ footNotes }: ArticleFootNotesProps) => (\n  <FootnoteList>\n    {footNotes.map((footNote) => (\n      <FootNote key={footNote.ref} footNote={footNote} />\n    ))}\n  </FootnoteList>\n);\n"],"mappings":";;;;;;;;;;;;AAYA,MAAM,oBAAoB,gBAAqC,cAAc,GAAG,YAAY,MAAM;AAMlG,MAAM,aAAa,OAAO,QAAQ,EAChC,MAAM;CACJ,SAAS;CACT,YAAY;CACZ,KAAK;CACN,EACF,CAAC;AAEF,MAAM,YAAY,EAAE,eAClB,oBAAC,kBACC,oBAAC;CAAK,IAAI,OAAO,SAAS;CAAO;CAAQ;CAAW,WAAU;CAAc,UAAU;WACpF,qBAAC;EACC,oBAAC;GAAE,MAAM,OAAO,SAAS;GAAO,QAAO;aACpC,SAAS;IACR;EACH,IAAI,SAAS,MAAM,KAAK,SAAS,QAAQ,KAAK,IAAI,CAAC,IAAI,iBAAiB,SAAS,QAAQ,GAAG,iBAC3F,SAAS,UACV,GAAG,SAAS,KAAK;EACjB,SAAS,MACR,qBAAC;GAAE,MAAM,SAAS;cACf,SAAS,KACT;IACC,GACF;KACO;EACR,GACJ;AAOP,MAAM,eAAe,OAAO,MAAM,EAChC,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACL,WAAW;CACZ,EACF,CAAC;AAEF,MAAa,oBAAoB,EAAE,gBACjC,oBAAC,0BACE,UAAU,KAAK,aACd,oBAAC,YAAsC,YAAxB,SAAS,IAA2B,CACnD,GACW"}

package/es/AudioPlayer/Controls.mjs

@@ -96,14 +96,14 @@ const Controls = ({ src, title }) => {
 		if (audioRef.current) {
 			const audioElement = audioRef.current;
 			const handleTimeUpdate = () => {
-				const { currentTime: currentTime$1, duration: duration$1 } = audioElement;
-				setCurrentTime(Math.round(currentTime$1));
-				setDuration(Math.round(duration$1));
+				const { currentTime, duration } = audioElement;
+				setCurrentTime(Math.round(currentTime));
+				setDuration(Math.round(duration));
 			};
 			const handleLoadedMetaData = () => {
-				const { currentTime: currentTime$1, duration: duration$1 } = audioElement;
-				setCurrentTime(Math.round(currentTime$1));
-				setDuration(Math.round(duration$1));
+				const { currentTime, duration } = audioElement;
+				setCurrentTime(Math.round(currentTime));
+				setDuration(Math.round(duration));
 			};
 			const handleTimeEnded = () => {
 				setPlaying(false);

package/es/AudioPlayer/Controls.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Controls.mjs","names":["currentTime","duration"],"sources":["../../src/AudioPlayer/Controls.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 { useEffect, useRef, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { type SliderValueChangeDetails, createListCollection } from \"@ark-ui/react\";\nimport { Replay15Line, Forward15Line, PlayFill, PauseLine, VolumeUpFill, CheckLine } from \"@ndla/icons\";\nimport {\n  Button,\n  FieldRoot,\n  IconButton,\n  PopoverContent,\n  PopoverRoot,\n  PopoverTrigger,\n  SelectContent,\n  SelectControl,\n  SelectItem,\n  SelectItemIndicator,\n  SelectItemText,\n  SelectLabel,\n  SelectRoot,\n  SelectTrigger,\n  SliderControl,\n  SliderHiddenInput,\n  SliderLabel,\n  SliderRange,\n  SliderRoot,\n  SliderThumb,\n  SliderTrack,\n  Text,\n} from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\n\nconst ControlsWrapper = styled(\"div\", {\n  base: {\n    borderBlockStart: \"1px solid\",\n    borderColor: \"stroke.default\",\n    borderBottomRadius: \"xsmall\",\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    background: \"background.default\",\n    gap: \"xsmall\",\n    paddingBlock: \"xsmall\",\n    paddingInline: \"medium\",\n    tabletWideDown: {\n      display: \"grid\",\n      paddingBlock: \"xsmall\",\n      paddingInline: \"xsmall\",\n      gridTemplateColumns: \"1fr repeat(5, auto) 1fr\",\n      gridTemplateAreas: `\n  \"track  track track     track track     track   track\"\n  \".      speed backwards play  forwards  volume  .\"\n`,\n    },\n    mobileWideDown: {\n      columnGap: \"3xsmall\",\n    },\n  },\n});\n\nconst PlayButton = styled(IconButton, {\n  base: {\n    gridArea: \"play\",\n  },\n});\n\nconst Forward15SecButton = styled(IconButton, {\n  base: {\n    gridArea: \"forwards\",\n  },\n});\n\nconst Back15SecButton = styled(IconButton, {\n  base: {\n    gridArea: \"backwards\",\n  },\n});\n\nconst ProgressWrapper = styled(\"div\", {\n  base: {\n    flex: \"1\",\n    display: \"flex\",\n    alignItems: \"center\",\n    gap: \"xxsmall\",\n    gridArea: \"track\",\n    paddingBlock: \"xsmall\",\n    mobileDown: {\n      paddingInline: \"xsmall\",\n    },\n  },\n});\n\nconst StyledText = styled(Text, {\n  base: {\n    minWidth: \"xxlarge\",\n    flexShrink: \"0\",\n    textAlign: \"center\",\n  },\n});\n\nconst VolumeButton = styled(IconButton, {\n  base: {\n    gridArea: \"volume\",\n  },\n});\n\nconst SpeedButton = styled(Button, {\n  base: {\n    paddingBlock: \"auto\",\n    paddingInline: \"auto\",\n    maxWidth: \"xxlarge\",\n    maxHeight: \"xxlarge\",\n    minWidth: \"xxlarge\",\n    minHeight: \"xxlarge\",\n    \"& span\": {\n      flex: \"1\",\n    },\n  },\n});\n\nconst StyledSelectRoot = styled(SelectRoot<string>, {\n  base: {\n    gridArea: \"speed\",\n  },\n});\n\nconst StyledSliderControl = styled(SliderControl, {\n  base: {\n    height: \"surface.3xsmall\",\n    minWidth: \"small\",\n  },\n});\n\nconst StyledPopoverContent = styled(PopoverContent, {\n  base: {\n    paddingInline: \"small\",\n  },\n});\n\nconst formatTime = (seconds: number) => {\n  const minutes = Math.floor(seconds / 60);\n  const currentSeconds = seconds % 60;\n\n  const formattedSeconds = currentSeconds < 10 ? `0${currentSeconds}` : currentSeconds;\n  return `${minutes}:${formattedSeconds}`;\n};\n\nconst speedValues = createListCollection({ items: [\"0.5\", \"0.75\", \"1\", \"1.25\", \"1.5\", \"1.75\", \"2\"] });\n\ninterface Props {\n  src: string;\n  title: string;\n}\n\nexport const Controls = ({ src, title }: Props) => {\n  const { t } = useTranslation();\n  const [speedValue, setSpeedValue] = useState(1);\n  const [volumeValue, setVolumeValue] = useState(100);\n  const [currentTime, setCurrentTime] = useState(0);\n  const [duration, setDuration] = useState(0);\n  const [playing, setPlaying] = useState(false);\n  const audioRef = useRef<HTMLAudioElement>(null);\n\n  useEffect(() => {\n    if (audioRef.current) {\n      const audioElement = audioRef.current;\n      const handleTimeUpdate = () => {\n        const { currentTime, duration } = audioElement;\n        setCurrentTime(Math.round(currentTime));\n        setDuration(Math.round(duration));\n      };\n\n      const handleLoadedMetaData = () => {\n        const { currentTime, duration } = audioElement;\n        setCurrentTime(Math.round(currentTime));\n        setDuration(Math.round(duration));\n      };\n\n      const handleTimeEnded = () => {\n        setPlaying(false);\n      };\n\n      audioElement.addEventListener(\"timeupdate\", handleTimeUpdate);\n      audioElement.addEventListener(\"loadedmetadata\", handleLoadedMetaData);\n      audioElement.addEventListener(\"ended\", handleTimeEnded);\n      return () => {\n        audioElement.removeEventListener(\"timeupdate\", handleTimeUpdate);\n        audioElement.removeEventListener(\"loadedmetadata\", handleLoadedMetaData);\n        audioElement.removeEventListener(\"ended\", handleTimeEnded);\n      };\n    }\n  }, []);\n\n  const togglePlay = () => {\n    if (audioRef.current) {\n      const audioElement = audioRef.current;\n      if (!playing) {\n        audioElement.play();\n      } else {\n        audioElement.pause();\n      }\n      setPlaying(!playing);\n    }\n  };\n\n  const onPlaybackRateChange = (rate: number) => {\n    setSpeedValue(rate);\n    if (audioRef.current) {\n      audioRef.current.playbackRate = rate;\n    }\n  };\n\n  const onSeekSeconds = (seconds: number) => {\n    if (audioRef.current) {\n      audioRef.current.currentTime += seconds;\n    }\n  };\n\n  const handleSliderChange = (details: SliderValueChangeDetails) => {\n    const newValue = details.value[0];\n    if (audioRef.current && newValue != null && !isNaN(newValue)) {\n      audioRef.current.currentTime = details.value[0];\n    }\n  };\n\n  const handleVolumeSliderChange = (details: SliderValueChangeDetails) => {\n    if (audioRef.current) {\n      audioRef.current.volume = details.value[0] / 100;\n      setVolumeValue(details.value[0]);\n    }\n  };\n\n  return (\n    <div>\n      {/* TODO: We should tie this up to the textual description somehow */}\n      {/* eslint-disable-next-line jsx-a11y/media-has-caption */}\n      <audio ref={audioRef} src={src} title={title} preload=\"metadata\" />\n      <ControlsWrapper>\n        <Back15SecButton\n          variant=\"tertiary\"\n          title={t(\"audio.controls.rewind15sec\")}\n          aria-label={t(\"audio.controls.rewind15sec\")}\n          onClick={() => onSeekSeconds(-15)}\n        >\n          <Replay15Line />\n        </Back15SecButton>\n        <PlayButton aria-label={t(playing ? t(\"audio.pause\") : t(\"audio.play\"))} variant=\"primary\" onClick={togglePlay}>\n          {playing ? <PauseLine /> : <PlayFill />}\n        </PlayButton>\n        <Forward15SecButton\n          variant=\"tertiary\"\n          title={t(\"audio.controls.forward15sec\")}\n          aria-label={t(\"audio.controls.forward15sec\")}\n          onClick={() => onSeekSeconds(15)}\n        >\n          <Forward15Line />\n        </Forward15SecButton>\n        <ProgressWrapper>\n          <StyledText textStyle=\"label.medium\" asChild consumeCss>\n            <div>{formatTime(currentTime)}</div>\n          </StyledText>\n          <SliderRoot\n            value={[currentTime]}\n            defaultValue={[0]}\n            step={1}\n            max={duration}\n            onValueChange={handleSliderChange}\n            getAriaValueText={(value) =>\n              t(\"audio.valueText\", {\n                start: formatTime(Math.round(value.value)),\n                end: formatTime(Math.round(duration)),\n              })\n            }\n          >\n            <SliderLabel srOnly>{t(\"audio.progressBar\")}</SliderLabel>\n            <SliderControl>\n              <SliderTrack>\n                <SliderRange />\n              </SliderTrack>\n              <SliderThumb index={0}>\n                <SliderHiddenInput />\n              </SliderThumb>\n            </SliderControl>\n          </SliderRoot>\n          <StyledText textStyle=\"label.medium\" asChild consumeCss>\n            <div>-{formatTime(Math.round(duration - currentTime))}</div>\n          </StyledText>\n        </ProgressWrapper>\n        <FieldRoot>\n          <StyledSelectRoot\n            collection={speedValues}\n            value={[speedValue.toString()]}\n            onValueChange={(details) => onPlaybackRateChange(parseFloat(details.value[0]))}\n            positioning={{ placement: \"top\" }}\n          >\n            <SelectLabel srOnly>{t(\"audio.controls.selectSpeed\")}</SelectLabel>\n            <SelectControl>\n              <SelectTrigger asChild>\n                <SpeedButton\n                  variant=\"tertiary\"\n                  title={t(\"audio.controls.selectSpeed\")}\n                  aria-label={t(\"audio.controls.selectSpeed\")}\n                >\n                  <span>{`${speedValue}x`}</span>\n                </SpeedButton>\n              </SelectTrigger>\n            </SelectControl>\n            <SelectContent>\n              {speedValues.items.map((speed) => (\n                <SelectItem key={speed} item={speed}>\n                  <SelectItemText>{speed}x</SelectItemText>\n                  <SelectItemIndicator>\n                    <CheckLine />\n                  </SelectItemIndicator>\n                </SelectItem>\n              ))}\n            </SelectContent>\n          </StyledSelectRoot>\n        </FieldRoot>\n        <PopoverRoot positioning={{ placement: \"top\" }}>\n          <PopoverTrigger asChild>\n            <VolumeButton variant=\"tertiary\" aria-label={t(\"audio.controls.adjustVolume\")}>\n              <VolumeUpFill />\n            </VolumeButton>\n          </PopoverTrigger>\n          <StyledPopoverContent>\n            <SliderRoot\n              orientation=\"vertical\"\n              value={[volumeValue]}\n              min={0}\n              max={100}\n              defaultValue={[100]}\n              step={1}\n              onValueChange={handleVolumeSliderChange}\n            >\n              <SliderLabel srOnly>{t(\"audio.controls.adjustVolume\")}</SliderLabel>\n              <StyledSliderControl>\n                <SliderTrack>\n                  <SliderRange />\n                </SliderTrack>\n                <SliderThumb index={0}>\n                  <SliderHiddenInput />\n                </SliderThumb>\n              </StyledSliderControl>\n            </SliderRoot>\n          </StyledPopoverContent>\n        </PopoverRoot>\n      </ControlsWrapper>\n    </div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"Controls.mjs","names":[],"sources":["../../src/AudioPlayer/Controls.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 { useEffect, useRef, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { type SliderValueChangeDetails, createListCollection } from \"@ark-ui/react\";\nimport { Replay15Line, Forward15Line, PlayFill, PauseLine, VolumeUpFill, CheckLine } from \"@ndla/icons\";\nimport {\n  Button,\n  FieldRoot,\n  IconButton,\n  PopoverContent,\n  PopoverRoot,\n  PopoverTrigger,\n  SelectContent,\n  SelectControl,\n  SelectItem,\n  SelectItemIndicator,\n  SelectItemText,\n  SelectLabel,\n  SelectRoot,\n  SelectTrigger,\n  SliderControl,\n  SliderHiddenInput,\n  SliderLabel,\n  SliderRange,\n  SliderRoot,\n  SliderThumb,\n  SliderTrack,\n  Text,\n} from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\n\nconst ControlsWrapper = styled(\"div\", {\n  base: {\n    borderBlockStart: \"1px solid\",\n    borderColor: \"stroke.default\",\n    borderBottomRadius: \"xsmall\",\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    background: \"background.default\",\n    gap: \"xsmall\",\n    paddingBlock: \"xsmall\",\n    paddingInline: \"medium\",\n    tabletWideDown: {\n      display: \"grid\",\n      paddingBlock: \"xsmall\",\n      paddingInline: \"xsmall\",\n      gridTemplateColumns: \"1fr repeat(5, auto) 1fr\",\n      gridTemplateAreas: `\n  \"track  track track     track track     track   track\"\n  \".      speed backwards play  forwards  volume  .\"\n`,\n    },\n    mobileWideDown: {\n      columnGap: \"3xsmall\",\n    },\n  },\n});\n\nconst PlayButton = styled(IconButton, {\n  base: {\n    gridArea: \"play\",\n  },\n});\n\nconst Forward15SecButton = styled(IconButton, {\n  base: {\n    gridArea: \"forwards\",\n  },\n});\n\nconst Back15SecButton = styled(IconButton, {\n  base: {\n    gridArea: \"backwards\",\n  },\n});\n\nconst ProgressWrapper = styled(\"div\", {\n  base: {\n    flex: \"1\",\n    display: \"flex\",\n    alignItems: \"center\",\n    gap: \"xxsmall\",\n    gridArea: \"track\",\n    paddingBlock: \"xsmall\",\n    mobileDown: {\n      paddingInline: \"xsmall\",\n    },\n  },\n});\n\nconst StyledText = styled(Text, {\n  base: {\n    minWidth: \"xxlarge\",\n    flexShrink: \"0\",\n    textAlign: \"center\",\n  },\n});\n\nconst VolumeButton = styled(IconButton, {\n  base: {\n    gridArea: \"volume\",\n  },\n});\n\nconst SpeedButton = styled(Button, {\n  base: {\n    paddingBlock: \"auto\",\n    paddingInline: \"auto\",\n    maxWidth: \"xxlarge\",\n    maxHeight: \"xxlarge\",\n    minWidth: \"xxlarge\",\n    minHeight: \"xxlarge\",\n    \"& span\": {\n      flex: \"1\",\n    },\n  },\n});\n\nconst StyledSelectRoot = styled(SelectRoot<string>, {\n  base: {\n    gridArea: \"speed\",\n  },\n});\n\nconst StyledSliderControl = styled(SliderControl, {\n  base: {\n    height: \"surface.3xsmall\",\n    minWidth: \"small\",\n  },\n});\n\nconst StyledPopoverContent = styled(PopoverContent, {\n  base: {\n    paddingInline: \"small\",\n  },\n});\n\nconst formatTime = (seconds: number) => {\n  const minutes = Math.floor(seconds / 60);\n  const currentSeconds = seconds % 60;\n\n  const formattedSeconds = currentSeconds < 10 ? `0${currentSeconds}` : currentSeconds;\n  return `${minutes}:${formattedSeconds}`;\n};\n\nconst speedValues = createListCollection({ items: [\"0.5\", \"0.75\", \"1\", \"1.25\", \"1.5\", \"1.75\", \"2\"] });\n\ninterface Props {\n  src: string;\n  title: string;\n}\n\nexport const Controls = ({ src, title }: Props) => {\n  const { t } = useTranslation();\n  const [speedValue, setSpeedValue] = useState(1);\n  const [volumeValue, setVolumeValue] = useState(100);\n  const [currentTime, setCurrentTime] = useState(0);\n  const [duration, setDuration] = useState(0);\n  const [playing, setPlaying] = useState(false);\n  const audioRef = useRef<HTMLAudioElement>(null);\n\n  useEffect(() => {\n    if (audioRef.current) {\n      const audioElement = audioRef.current;\n      const handleTimeUpdate = () => {\n        const { currentTime, duration } = audioElement;\n        setCurrentTime(Math.round(currentTime));\n        setDuration(Math.round(duration));\n      };\n\n      const handleLoadedMetaData = () => {\n        const { currentTime, duration } = audioElement;\n        setCurrentTime(Math.round(currentTime));\n        setDuration(Math.round(duration));\n      };\n\n      const handleTimeEnded = () => {\n        setPlaying(false);\n      };\n\n      audioElement.addEventListener(\"timeupdate\", handleTimeUpdate);\n      audioElement.addEventListener(\"loadedmetadata\", handleLoadedMetaData);\n      audioElement.addEventListener(\"ended\", handleTimeEnded);\n      return () => {\n        audioElement.removeEventListener(\"timeupdate\", handleTimeUpdate);\n        audioElement.removeEventListener(\"loadedmetadata\", handleLoadedMetaData);\n        audioElement.removeEventListener(\"ended\", handleTimeEnded);\n      };\n    }\n  }, []);\n\n  const togglePlay = () => {\n    if (audioRef.current) {\n      const audioElement = audioRef.current;\n      if (!playing) {\n        audioElement.play();\n      } else {\n        audioElement.pause();\n      }\n      setPlaying(!playing);\n    }\n  };\n\n  const onPlaybackRateChange = (rate: number) => {\n    setSpeedValue(rate);\n    if (audioRef.current) {\n      audioRef.current.playbackRate = rate;\n    }\n  };\n\n  const onSeekSeconds = (seconds: number) => {\n    if (audioRef.current) {\n      audioRef.current.currentTime += seconds;\n    }\n  };\n\n  const handleSliderChange = (details: SliderValueChangeDetails) => {\n    const newValue = details.value[0];\n    if (audioRef.current && newValue != null && !isNaN(newValue)) {\n      audioRef.current.currentTime = details.value[0];\n    }\n  };\n\n  const handleVolumeSliderChange = (details: SliderValueChangeDetails) => {\n    if (audioRef.current) {\n      audioRef.current.volume = details.value[0] / 100;\n      setVolumeValue(details.value[0]);\n    }\n  };\n\n  return (\n    <div>\n      {/* TODO: We should tie this up to the textual description somehow */}\n      {/* eslint-disable-next-line jsx-a11y/media-has-caption */}\n      <audio ref={audioRef} src={src} title={title} preload=\"metadata\" />\n      <ControlsWrapper>\n        <Back15SecButton\n          variant=\"tertiary\"\n          title={t(\"audio.controls.rewind15sec\")}\n          aria-label={t(\"audio.controls.rewind15sec\")}\n          onClick={() => onSeekSeconds(-15)}\n        >\n          <Replay15Line />\n        </Back15SecButton>\n        <PlayButton aria-label={t(playing ? t(\"audio.pause\") : t(\"audio.play\"))} variant=\"primary\" onClick={togglePlay}>\n          {playing ? <PauseLine /> : <PlayFill />}\n        </PlayButton>\n        <Forward15SecButton\n          variant=\"tertiary\"\n          title={t(\"audio.controls.forward15sec\")}\n          aria-label={t(\"audio.controls.forward15sec\")}\n          onClick={() => onSeekSeconds(15)}\n        >\n          <Forward15Line />\n        </Forward15SecButton>\n        <ProgressWrapper>\n          <StyledText textStyle=\"label.medium\" asChild consumeCss>\n            <div>{formatTime(currentTime)}</div>\n          </StyledText>\n          <SliderRoot\n            value={[currentTime]}\n            defaultValue={[0]}\n            step={1}\n            max={duration}\n            onValueChange={handleSliderChange}\n            getAriaValueText={(value) =>\n              t(\"audio.valueText\", {\n                start: formatTime(Math.round(value.value)),\n                end: formatTime(Math.round(duration)),\n              })\n            }\n          >\n            <SliderLabel srOnly>{t(\"audio.progressBar\")}</SliderLabel>\n            <SliderControl>\n              <SliderTrack>\n                <SliderRange />\n              </SliderTrack>\n              <SliderThumb index={0}>\n                <SliderHiddenInput />\n              </SliderThumb>\n            </SliderControl>\n          </SliderRoot>\n          <StyledText textStyle=\"label.medium\" asChild consumeCss>\n            <div>-{formatTime(Math.round(duration - currentTime))}</div>\n          </StyledText>\n        </ProgressWrapper>\n        <FieldRoot>\n          <StyledSelectRoot\n            collection={speedValues}\n            value={[speedValue.toString()]}\n            onValueChange={(details) => onPlaybackRateChange(parseFloat(details.value[0]))}\n            positioning={{ placement: \"top\" }}\n          >\n            <SelectLabel srOnly>{t(\"audio.controls.selectSpeed\")}</SelectLabel>\n            <SelectControl>\n              <SelectTrigger asChild>\n                <SpeedButton\n                  variant=\"tertiary\"\n                  title={t(\"audio.controls.selectSpeed\")}\n                  aria-label={t(\"audio.controls.selectSpeed\")}\n                >\n                  <span>{`${speedValue}x`}</span>\n                </SpeedButton>\n              </SelectTrigger>\n            </SelectControl>\n            <SelectContent>\n              {speedValues.items.map((speed) => (\n                <SelectItem key={speed} item={speed}>\n                  <SelectItemText>{speed}x</SelectItemText>\n                  <SelectItemIndicator>\n                    <CheckLine />\n                  </SelectItemIndicator>\n                </SelectItem>\n              ))}\n            </SelectContent>\n          </StyledSelectRoot>\n        </FieldRoot>\n        <PopoverRoot positioning={{ placement: \"top\" }}>\n          <PopoverTrigger asChild>\n            <VolumeButton variant=\"tertiary\" aria-label={t(\"audio.controls.adjustVolume\")}>\n              <VolumeUpFill />\n            </VolumeButton>\n          </PopoverTrigger>\n          <StyledPopoverContent>\n            <SliderRoot\n              orientation=\"vertical\"\n              value={[volumeValue]}\n              min={0}\n              max={100}\n              defaultValue={[100]}\n              step={1}\n              onValueChange={handleVolumeSliderChange}\n            >\n              <SliderLabel srOnly>{t(\"audio.controls.adjustVolume\")}</SliderLabel>\n              <StyledSliderControl>\n                <SliderTrack>\n                  <SliderRange />\n                </SliderTrack>\n                <SliderThumb index={0}>\n                  <SliderHiddenInput />\n                </SliderThumb>\n              </StyledSliderControl>\n            </SliderRoot>\n          </StyledPopoverContent>\n        </PopoverRoot>\n      </ControlsWrapper>\n    </div>\n  );\n};\n"],"mappings":"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"}

package/es/Embed/IframeEmbed.mjs

@@ -25,8 +25,8 @@ const IframeEmbed = ({ embed }) => {
 	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}`;
+			const [width, height] = [Number.parseInt(iframe.width), Number.parseInt(iframe.height)];
+			iframe.style.aspectRatio = `${width ? width : 16}/${height ? height : 9}`;
 			iframe.width = "";
 			iframe.height = "";
 		}

package/es/Embed/IframeEmbed.mjs.map

@@ -1 +1 @@
-{"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"}
+{"version":3,"file":"IframeEmbed.mjs","names":[],"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,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,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"}

package/es/Gloss/GlossExample.mjs

@@ -24,25 +24,25 @@ const StyledGlossExample = styled("div", { base: {
 } });
 const PinyinText = styled(Text, { base: { fontStyle: "italic" } });
 const GlossExample = ({ examples, originalLanguage }) => {
-	return /* @__PURE__ */ jsx("div", { children: examples.map((examples$1, index) => /* @__PURE__ */ jsxs(Fragment, { children: [
+	return /* @__PURE__ */ jsx("div", { children: examples.map((examples, index) => /* @__PURE__ */ jsxs(Fragment, { children: [
 		/* @__PURE__ */ jsx(StyledGlossExample, {
-			lang: examples$1.language,
+			lang: examples.language,
 			children: /* @__PURE__ */ jsx(Text, {
 				textStyle: "label.medium",
-				lang: examples$1.language,
-				children: examples$1.example
+				lang: examples.language,
+				children: examples.example
 			})
 		}),
-		!!examples$1.transcriptions.pinyin && /* @__PURE__ */ jsx(StyledGlossExample, { children: /* @__PURE__ */ jsx(PinyinText, {
+		!!examples.transcriptions.pinyin && /* @__PURE__ */ jsx(StyledGlossExample, { children: /* @__PURE__ */ jsx(PinyinText, {
 			"data-pinyin": "",
 			lang: originalLanguage,
 			textStyle: "label.medium",
-			children: examples$1.transcriptions?.pinyin
+			children: examples.transcriptions?.pinyin
 		}) }),
-		!!examples$1.transcriptions?.traditional && /* @__PURE__ */ jsx(StyledGlossExample, { children: /* @__PURE__ */ jsx(Text, {
+		!!examples.transcriptions?.traditional && /* @__PURE__ */ jsx(StyledGlossExample, { children: /* @__PURE__ */ jsx(Text, {
 			textStyle: "label.medium",
 			lang: originalLanguage,
-			children: examples$1.transcriptions.traditional
+			children: examples.transcriptions.traditional
 		}) })
 	] }, index)) });
 };

package/es/Gloss/GlossExample.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"GlossExample.mjs","names":["examples"],"sources":["../../src/Gloss/GlossExample.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 { Fragment } from \"react\";\nimport { Text } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { GlossExampleDTO } from \"@ndla/types-backend/concept-api\";\n\ninterface Props {\n  examples: GlossExampleDTO[];\n  originalLanguage: string | undefined;\n}\n\nconst StyledGlossExample = styled(\"div\", {\n  base: {\n    borderTop: \"1px solid\",\n    borderColor: \"stroke.subtle\",\n    paddingBlock: \"xsmall\",\n    paddingInline: \"medium\",\n    _first: {\n      background: \"surface.brand.1.subtle\",\n      borderColor: \"stroke.default\",\n      \"& p\": {\n        fontWeight: \"bold\",\n      },\n    },\n  },\n});\n\nconst PinyinText = styled(Text, {\n  base: {\n    fontStyle: \"italic\",\n  },\n});\n\nexport const GlossExample = ({ examples, originalLanguage }: Props) => {\n  return (\n    <div>\n      {examples.map((examples, index) => (\n        <Fragment key={index}>\n          <StyledGlossExample lang={examples.language}>\n            <Text textStyle=\"label.medium\" lang={examples.language}>\n              {examples.example}\n            </Text>\n          </StyledGlossExample>\n          {!!examples.transcriptions.pinyin && (\n            <StyledGlossExample>\n              <PinyinText data-pinyin=\"\" lang={originalLanguage} textStyle=\"label.medium\">\n                {examples.transcriptions?.pinyin}\n              </PinyinText>\n            </StyledGlossExample>\n          )}\n          {!!examples.transcriptions?.traditional && (\n            <StyledGlossExample>\n              <Text textStyle=\"label.medium\" lang={originalLanguage}>\n                {examples.transcriptions.traditional}\n              </Text>\n            </StyledGlossExample>\n          )}\n        </Fragment>\n      ))}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;AAkBA,MAAM,qBAAqB,OAAO,OAAO,EACvC,MAAM;CACJ,WAAW;CACX,aAAa;CACb,cAAc;CACd,eAAe;CACf,QAAQ;EACN,YAAY;EACZ,aAAa;EACb,OAAO,EACL,YAAY,QACb;EACF;CACF,EACF,CAAC;AAEF,MAAM,aAAa,OAAO,MAAM,EAC9B,MAAM,EACJ,WAAW,UACZ,EACF,CAAC;AAEF,MAAa,gBAAgB,EAAE,UAAU,uBAA8B;AACrE,QACE,oBAAC,mBACE,SAAS,KAAK,YAAU,UACvB,qBAAC;EACC,oBAAC;GAAmB,MAAMA,WAAS;aACjC,oBAAC;IAAK,WAAU;IAAe,MAAMA,WAAS;cAC3CA,WAAS;KACL;IACY;EACpB,CAAC,CAACA,WAAS,eAAe,UACzB,oBAAC,gCACC,oBAAC;GAAW,eAAY;GAAG,MAAM;GAAkB,WAAU;aAC1DA,WAAS,gBAAgB;IACf,GACM;EAEtB,CAAC,CAACA,WAAS,gBAAgB,eAC1B,oBAAC,gCACC,oBAAC;GAAK,WAAU;GAAe,MAAM;aAClCA,WAAS,eAAe;IACpB,GACY;MAlBV,MAoBJ,CACX,GACE"}
+{"version":3,"file":"GlossExample.mjs","names":[],"sources":["../../src/Gloss/GlossExample.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 { Fragment } from \"react\";\nimport { Text } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { GlossExampleDTO } from \"@ndla/types-backend/concept-api\";\n\ninterface Props {\n  examples: GlossExampleDTO[];\n  originalLanguage: string | undefined;\n}\n\nconst StyledGlossExample = styled(\"div\", {\n  base: {\n    borderTop: \"1px solid\",\n    borderColor: \"stroke.subtle\",\n    paddingBlock: \"xsmall\",\n    paddingInline: \"medium\",\n    _first: {\n      background: \"surface.brand.1.subtle\",\n      borderColor: \"stroke.default\",\n      \"& p\": {\n        fontWeight: \"bold\",\n      },\n    },\n  },\n});\n\nconst PinyinText = styled(Text, {\n  base: {\n    fontStyle: \"italic\",\n  },\n});\n\nexport const GlossExample = ({ examples, originalLanguage }: Props) => {\n  return (\n    <div>\n      {examples.map((examples, index) => (\n        <Fragment key={index}>\n          <StyledGlossExample lang={examples.language}>\n            <Text textStyle=\"label.medium\" lang={examples.language}>\n              {examples.example}\n            </Text>\n          </StyledGlossExample>\n          {!!examples.transcriptions.pinyin && (\n            <StyledGlossExample>\n              <PinyinText data-pinyin=\"\" lang={originalLanguage} textStyle=\"label.medium\">\n                {examples.transcriptions?.pinyin}\n              </PinyinText>\n            </StyledGlossExample>\n          )}\n          {!!examples.transcriptions?.traditional && (\n            <StyledGlossExample>\n              <Text textStyle=\"label.medium\" lang={originalLanguage}>\n                {examples.transcriptions.traditional}\n              </Text>\n            </StyledGlossExample>\n          )}\n        </Fragment>\n      ))}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;AAkBA,MAAM,qBAAqB,OAAO,OAAO,EACvC,MAAM;CACJ,WAAW;CACX,aAAa;CACb,cAAc;CACd,eAAe;CACf,QAAQ;EACN,YAAY;EACZ,aAAa;EACb,OAAO,EACL,YAAY,QACb;EACF;CACF,EACF,CAAC;AAEF,MAAM,aAAa,OAAO,MAAM,EAC9B,MAAM,EACJ,WAAW,UACZ,EACF,CAAC;AAEF,MAAa,gBAAgB,EAAE,UAAU,uBAA8B;AACrE,QACE,oBAAC,mBACE,SAAS,KAAK,UAAU,UACvB,qBAAC;EACC,oBAAC;GAAmB,MAAM,SAAS;aACjC,oBAAC;IAAK,WAAU;IAAe,MAAM,SAAS;cAC3C,SAAS;KACL;IACY;EACpB,CAAC,CAAC,SAAS,eAAe,UACzB,oBAAC,gCACC,oBAAC;GAAW,eAAY;GAAG,MAAM;GAAkB,WAAU;aAC1D,SAAS,gBAAgB;IACf,GACM;EAEtB,CAAC,CAAC,SAAS,gBAAgB,eAC1B,oBAAC,gCACC,oBAAC;GAAK,WAAU;GAAe,MAAM;aAClC,SAAS,eAAe;IACpB,GACY;MAlBV,MAoBJ,CACX,GACE"}

package/es/Grid/Grid.mjs

@@ -39,7 +39,7 @@ const GridContainer = styled("div", {
 		border: { lightBlue: {
 			padding: "xsmall",
 			border: "1px solid",
-			borderColor: "surface.brand.2"
+			borderColor: "stroke.subtle"
 		} }
 	}
 });
@@ -47,7 +47,7 @@ const StyledGridItem = styled("div", {
 	base: { padding: "medium" },
 	variants: { border: { true: {
 		outline: "1px solid",
-		outlineColor: "stroke.default"
+		outlineColor: "stroke.subtle"
 	} } }
 });
 const Grid = ({ columns, border, children, ...rest }) => {

package/es/Grid/Grid.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Grid.mjs","names":[],"sources":["../../src/Grid/Grid.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 ComponentProps, type ReactNode } from \"react\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { StyledVariantProps } from \"@ndla/styled-system/types\";\n\nconst GridContainer = styled(\"div\", {\n  base: {\n    display: \"grid\",\n    justifyContent: \"center\",\n    borderRadius: \"xsmall\",\n    gridRowGap: \"large\",\n    gridColumnGap: \"medium\",\n    width: \"100%\",\n    minWidth: \"surface.xxsmall\",\n    gridTemplateColumns: \"repeat(2, minmax(0, 1fr))\",\n\n    \"& div[data-embed-type='pitch']\": {\n      height: \"100%\",\n      \"& > :last-child\": {\n        marginTop: \"auto\",\n      },\n    },\n    tabletDown: {\n      gridTemplateColumns: \"repeat(1, minmax(0, 1fr))\",\n    },\n    tabletToDesktop: {\n      gridTemplateColumns: \"repeat(2, minmax(0, 1fr))\",\n      \"& > div:nth-child(3):last-child\": {\n        display: \"flex\",\n        flexFlow: \"column\",\n        justifyContent: \"center\",\n        alignItems: \"center\",\n        gridColumn: \"span 2\",\n      },\n    },\n  },\n  variants: {\n    columns: {\n      \"2\": {},\n      \"2x2\": {},\n      \"3\": { desktop: { gridTemplateColumns: \"repeat(3, minmax(0, 1fr))\" } },\n      \"4\": { desktop: { gridTemplateColumns: \"repeat(4, minmax(0, 1fr))\" } },\n    },\n    border: {\n      lightBlue: {\n        padding: \"xsmall\",\n        border: \"1px solid\",\n        borderColor: \"surface.brand.2\",\n      },\n    },\n  },\n});\n\nconst StyledGridItem = styled(\"div\", {\n  base: {\n    padding: \"medium\",\n  },\n  variants: {\n    border: {\n      true: {\n        outline: \"1px solid\",\n        outlineColor: \"stroke.default\",\n      },\n    },\n  },\n});\n\ntype GridVariantProps = NonNullable<StyledVariantProps<typeof GridContainer>>;\n\nexport interface GridProps extends ComponentProps<\"div\">, GridVariantProps {\n  children?: ReactNode[];\n  columns: NonNullable<GridVariantProps[\"columns\"]>;\n}\n\ntype GridItemVariantProps = NonNullable<StyledVariantProps<typeof StyledGridItem>>;\n\nexport interface GridItemProps extends ComponentProps<\"div\">, GridItemVariantProps {}\n\nexport const Grid = ({ columns, border, children, ...rest }: GridProps) => {\n  const amountOfColumns = children?.length === 3 ? \"3\" : columns;\n\n  return (\n    <GridContainer data-embed-type=\"grid\" border={border} columns={amountOfColumns} {...rest}>\n      {children}\n    </GridContainer>\n  );\n};\n\nexport const GridItem = ({ border, children, ...rest }: GridItemProps) => {\n  return (\n    <StyledGridItem data-embed-type=\"grid-cell\" border={border} {...rest}>\n      {children}\n    </StyledGridItem>\n  );\n};\n"],"mappings":";;;;;AAYA,MAAM,gBAAgB,OAAO,OAAO;CAClC,MAAM;EACJ,SAAS;EACT,gBAAgB;EAChB,cAAc;EACd,YAAY;EACZ,eAAe;EACf,OAAO;EACP,UAAU;EACV,qBAAqB;EAErB,kCAAkC;GAChC,QAAQ;GACR,mBAAmB,EACjB,WAAW,QACZ;GACF;EACD,YAAY,EACV,qBAAqB,6BACtB;EACD,iBAAiB;GACf,qBAAqB;GACrB,mCAAmC;IACjC,SAAS;IACT,UAAU;IACV,gBAAgB;IAChB,YAAY;IACZ,YAAY;IACb;GACF;EACF;CACD,UAAU;EACR,SAAS;GACP,KAAK,EAAE;GACP,OAAO,EAAE;GACT,KAAK,EAAE,SAAS,EAAE,qBAAqB,6BAA6B,EAAE;GACtE,KAAK,EAAE,SAAS,EAAE,qBAAqB,6BAA6B,EAAE;GACvE;EACD,QAAQ,EACN,WAAW;GACT,SAAS;GACT,QAAQ;GACR,aAAa;GACd,EACF;EACF;CACF,CAAC;AAEF,MAAM,iBAAiB,OAAO,OAAO;CACnC,MAAM,EACJ,SAAS,UACV;CACD,UAAU,EACR,QAAQ,EACN,MAAM;EACJ,SAAS;EACT,cAAc;EACf,EACF,EACF;CACF,CAAC;AAaF,MAAa,QAAQ,EAAE,SAAS,QAAQ,UAAU,GAAG,WAAsB;CACzE,MAAM,kBAAkB,UAAU,WAAW,IAAI,MAAM;AAEvD,QACE,oBAAC;EAAc,mBAAgB;EAAe;EAAQ,SAAS;EAAiB,GAAI;EACjF;GACa;;AAIpB,MAAa,YAAY,EAAE,QAAQ,UAAU,GAAG,WAA0B;AACxE,QACE,oBAAC;EAAe,mBAAgB;EAAoB;EAAQ,GAAI;EAC7D;GACc"}
+{"version":3,"file":"Grid.mjs","names":[],"sources":["../../src/Grid/Grid.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 ComponentProps, type ReactNode } from \"react\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { StyledVariantProps } from \"@ndla/styled-system/types\";\n\nconst GridContainer = styled(\"div\", {\n  base: {\n    display: \"grid\",\n    justifyContent: \"center\",\n    borderRadius: \"xsmall\",\n    gridRowGap: \"large\",\n    gridColumnGap: \"medium\",\n    width: \"100%\",\n    minWidth: \"surface.xxsmall\",\n    gridTemplateColumns: \"repeat(2, minmax(0, 1fr))\",\n\n    \"& div[data-embed-type='pitch']\": {\n      height: \"100%\",\n      \"& > :last-child\": {\n        marginTop: \"auto\",\n      },\n    },\n    tabletDown: {\n      gridTemplateColumns: \"repeat(1, minmax(0, 1fr))\",\n    },\n    tabletToDesktop: {\n      gridTemplateColumns: \"repeat(2, minmax(0, 1fr))\",\n      \"& > div:nth-child(3):last-child\": {\n        display: \"flex\",\n        flexFlow: \"column\",\n        justifyContent: \"center\",\n        alignItems: \"center\",\n        gridColumn: \"span 2\",\n      },\n    },\n  },\n  variants: {\n    columns: {\n      \"2\": {},\n      \"2x2\": {},\n      \"3\": { desktop: { gridTemplateColumns: \"repeat(3, minmax(0, 1fr))\" } },\n      \"4\": { desktop: { gridTemplateColumns: \"repeat(4, minmax(0, 1fr))\" } },\n    },\n    border: {\n      lightBlue: {\n        padding: \"xsmall\",\n        border: \"1px solid\",\n        borderColor: \"stroke.subtle\",\n      },\n    },\n  },\n});\n\nconst StyledGridItem = styled(\"div\", {\n  base: {\n    padding: \"medium\",\n  },\n  variants: {\n    border: {\n      true: {\n        outline: \"1px solid\",\n        outlineColor: \"stroke.subtle\",\n      },\n    },\n  },\n});\n\ntype GridVariantProps = NonNullable<StyledVariantProps<typeof GridContainer>>;\n\nexport interface GridProps extends ComponentProps<\"div\">, GridVariantProps {\n  children?: ReactNode[];\n  columns: NonNullable<GridVariantProps[\"columns\"]>;\n}\n\ntype GridItemVariantProps = NonNullable<StyledVariantProps<typeof StyledGridItem>>;\n\nexport interface GridItemProps extends ComponentProps<\"div\">, GridItemVariantProps {}\n\nexport const Grid = ({ columns, border, children, ...rest }: GridProps) => {\n  const amountOfColumns = children?.length === 3 ? \"3\" : columns;\n\n  return (\n    <GridContainer data-embed-type=\"grid\" border={border} columns={amountOfColumns} {...rest}>\n      {children}\n    </GridContainer>\n  );\n};\n\nexport const GridItem = ({ border, children, ...rest }: GridItemProps) => {\n  return (\n    <StyledGridItem data-embed-type=\"grid-cell\" border={border} {...rest}>\n      {children}\n    </StyledGridItem>\n  );\n};\n"],"mappings":";;;;;AAYA,MAAM,gBAAgB,OAAO,OAAO;CAClC,MAAM;EACJ,SAAS;EACT,gBAAgB;EAChB,cAAc;EACd,YAAY;EACZ,eAAe;EACf,OAAO;EACP,UAAU;EACV,qBAAqB;EAErB,kCAAkC;GAChC,QAAQ;GACR,mBAAmB,EACjB,WAAW,QACZ;GACF;EACD,YAAY,EACV,qBAAqB,6BACtB;EACD,iBAAiB;GACf,qBAAqB;GACrB,mCAAmC;IACjC,SAAS;IACT,UAAU;IACV,gBAAgB;IAChB,YAAY;IACZ,YAAY;IACb;GACF;EACF;CACD,UAAU;EACR,SAAS;GACP,KAAK,EAAE;GACP,OAAO,EAAE;GACT,KAAK,EAAE,SAAS,EAAE,qBAAqB,6BAA6B,EAAE;GACtE,KAAK,EAAE,SAAS,EAAE,qBAAqB,6BAA6B,EAAE;GACvE;EACD,QAAQ,EACN,WAAW;GACT,SAAS;GACT,QAAQ;GACR,aAAa;GACd,EACF;EACF;CACF,CAAC;AAEF,MAAM,iBAAiB,OAAO,OAAO;CACnC,MAAM,EACJ,SAAS,UACV;CACD,UAAU,EACR,QAAQ,EACN,MAAM;EACJ,SAAS;EACT,cAAc;EACf,EACF,EACF;CACF,CAAC;AAaF,MAAa,QAAQ,EAAE,SAAS,QAAQ,UAAU,GAAG,WAAsB;CACzE,MAAM,kBAAkB,UAAU,WAAW,IAAI,MAAM;AAEvD,QACE,oBAAC;EAAc,mBAAgB;EAAe;EAAQ,SAAS;EAAiB,GAAI;EACjF;GACa;;AAIpB,MAAa,YAAY,EAAE,QAAQ,UAAU,GAAG,WAA0B;AACxE,QACE,oBAAC;EAAe,mBAAgB;EAAoB;EAAQ,GAAI;EAC7D;GACc"}

package/es/index.mjs

@@ -26,10 +26,10 @@ import { CodeBlock } from "./CodeBlock/CodeBlock.mjs";
 import { codeLanguageOptions } from "./CodeBlock/codeLanguageOptions.mjs";
 import { CodeEmbed } from "./Embed/CodeEmbed.mjs";
 import { EmbedWrapper } from "./Embed/EmbedWrapper.mjs";
+import { BadgesContainer } from "./Article/BadgesContainer.mjs";
+import { ArticleContent, ArticleFooter, ArticleHGroup, ArticleHeader, ArticleTitle, ArticleWrapper } from "./Article/Article.mjs";
 import { ArticleFootNotes } from "./Article/ArticleFootNotes.mjs";
 import { ArticleByline, ArticleBylineAccordionItem } from "./Article/ArticleByline.mjs";
-import { BadgesContainer } from "./Article/BadgesContainer.mjs";
-import { Article, ArticleContent, ArticleFooter, ArticleHGroup, ArticleHeader, ArticleTitle, ArticleWrapper } from "./Article/Article.mjs";
 import { getPossiblyRelativeUrl } from "./utils/relativeUrl.mjs";
 import { FileListEmbed, FileListItem, FileListWrapper } from "./FileList/FileList.mjs";
 import { File, FileListElement } from "./FileList/File.mjs";
@@ -40,16 +40,10 @@ import { subjectCategories } from "./model/SubjectCategories.mjs";
 import { subjectTypes } from "./model/SubjectTypes.mjs";
 import { wordClass } from "./model/WordClass.mjs";
 import { constants } from "./model/index.mjs";
-import messages_nb_default from "./locale/messages-nb.mjs";
-import messages_nn_default from "./locale/messages-nn.mjs";
-import messages_en_default from "./locale/messages-en.mjs";
-import messages_se_default from "./locale/messages-se.mjs";
 import { Breadcrumb } from "./Breadcrumb/Breadcrumb.mjs";
 import { HomeBreadcrumb } from "./Breadcrumb/HomeBreadcrumb.mjs";
-import { formatNestedMessages } from "./i18n/formatNestedMessages.mjs";
 import { TagSelectorClearTrigger, TagSelectorControl, TagSelectorInput, TagSelectorInputBase, TagSelectorItemInput, TagSelectorLabel, TagSelectorRoot, TagSelectorTrigger } from "./TagSelector/TagSelector.mjs";
 import { useAudioSearchTranslations, useComboboxTranslations, useDatePickerTranslations, useImageSearchTranslations, usePaginationTranslations, useTagSelectorTranslations, useTagsInputTranslations, useVideoSearchTranslations } from "./i18n/useComponentTranslations.mjs";
-import { ContentTypeBadge, contentTypeToBadgeVariantMap } from "./ContentTypeBadge/ContentTypeBadge.mjs";
 import { AnchorHeading } from "./AnchorHeading/AnchorHeading.mjs";
 import { Pitch } from "./Pitch/Pitch.mjs";
 import { KeyFigure } from "./KeyFigure/KeyFigure.mjs";
@@ -59,5 +53,6 @@ import { Grid, GridItem } from "./Grid/Grid.mjs";
 import { LinkBlock } from "./LinkBlock/LinkBlock.mjs";
 import { LinkBlockSection } from "./LinkBlock/LinkBlockSection.mjs";
 import { ZendeskButton } from "./ZendeskButton/ZendeskButton.mjs";
+import { messagesEN, messagesNB, messagesNN, messagesSE } from "@ndla/locales";
 
-export { AnchorHeading, Article, ArticleByline, ArticleBylineAccordionItem, ArticleContent, ArticleFootNotes, ArticleFooter, ArticleHGroup, ArticleHeader, ArticleTitle, ArticleWrapper, AudioEmbed, AudioPlayer, BadgesContainer, BlockConcept, Breadcrumb, BrightcoveEmbed, CampaignBlock, CodeBlock, CodeEmbed, Concept, ConceptEmbed, ConceptInlineTriggerButton, ContactBlock, ContentLinkEmbed, ContentTypeBadge, CopyrightEmbed, EmbedByline, EmbedWrapper, ExternalEmbed, FactBox, File, FileListElement, FileListEmbed, FileListItem, FileListWrapper, FootnoteEmbed, Gloss, GlossExample, Grid, GridItem, H5pEmbed, HomeBreadcrumb, IframeEmbed, ImageEmbed, InlineConcept, InlineTriggerButton, KeyFigure, LicenseLink, LinkBlock, LinkBlockSection, PdfFile, Pitch, RelatedArticle, RelatedArticleList, RelatedContentEmbed, ResourceBox, TagSelectorClearTrigger, TagSelectorControl, TagSelectorInput, TagSelectorInputBase, TagSelectorItemInput, TagSelectorLabel, TagSelectorRoot, TagSelectorTrigger, UnknownEmbed, UuDisclaimerEmbed, ZendeskButton, codeLanguageOptions, constants, contactBlockBackgrounds, contentTypeMapping, contentTypeToBadgeVariantMap, contentTypes, formatNestedMessages, getCrop, getFocalPoint, getPossiblyRelativeUrl, licenseAttributes, messages_en_default as messagesEN, messages_nb_default as messagesNB, messages_nn_default as messagesNN, messages_se_default as messagesSE, resourceEmbedTypeMapping, subjectCategories, subjectTypes, useAudioSearchTranslations, useComboboxTranslations, useDatePickerTranslations, useImageSearchTranslations, usePaginationTranslations, useTagSelectorTranslations, useTagsInputTranslations, useVideoSearchTranslations, wordClass };
+export { AnchorHeading, ArticleByline, ArticleBylineAccordionItem, ArticleContent, ArticleFootNotes, ArticleFooter, ArticleHGroup, ArticleHeader, ArticleTitle, ArticleWrapper, AudioEmbed, AudioPlayer, BadgesContainer, BlockConcept, Breadcrumb, BrightcoveEmbed, CampaignBlock, CodeBlock, CodeEmbed, Concept, ConceptEmbed, ConceptInlineTriggerButton, ContactBlock, ContentLinkEmbed, CopyrightEmbed, EmbedByline, EmbedWrapper, ExternalEmbed, FactBox, File, FileListElement, FileListEmbed, FileListItem, FileListWrapper, FootnoteEmbed, Gloss, GlossExample, Grid, GridItem, H5pEmbed, HomeBreadcrumb, IframeEmbed, ImageEmbed, InlineConcept, InlineTriggerButton, KeyFigure, LicenseLink, LinkBlock, LinkBlockSection, PdfFile, Pitch, RelatedArticle, RelatedArticleList, RelatedContentEmbed, ResourceBox, TagSelectorClearTrigger, TagSelectorControl, TagSelectorInput, TagSelectorInputBase, TagSelectorItemInput, TagSelectorLabel, TagSelectorRoot, TagSelectorTrigger, UnknownEmbed, UuDisclaimerEmbed, ZendeskButton, codeLanguageOptions, constants, contactBlockBackgrounds, contentTypeMapping, contentTypes, getCrop, getFocalPoint, getPossiblyRelativeUrl, licenseAttributes, messagesEN, messagesNB, messagesNN, messagesSE, resourceEmbedTypeMapping, subjectCategories, subjectTypes, useAudioSearchTranslations, useComboboxTranslations, useDatePickerTranslations, useImageSearchTranslations, usePaginationTranslations, useTagSelectorTranslations, useTagsInputTranslations, useVideoSearchTranslations, wordClass };

package/es/model/ContentType.mjs

@@ -17,11 +17,6 @@ const MULTIDISCIPLINARY = "multidisciplinary";
 const CONCEPT = "concept";
 const EXTERNAL = "external";
 const MISSING = "missing";
-const IMAGE = "image";
-const VIDEO = "video";
-const AUDIO = "audio";
-const PODCAST = "podcast";
-const GLOSS = "gloss";
 const PROGRAMME = "programme";
 const PODCAST_SERIES = "podcast-series";
 const FRONTPAGE_ARTICLE = "frontpage-article";
@@ -68,5 +63,5 @@ const resourceEmbedTypeMapping = {
 };
 
 //#endregion
-export { ASSESSMENT_RESOURCES, AUDIO, CONCEPT, EXTERNAL, FRONTPAGE_ARTICLE, GLOSS, IMAGE, LEARNING_PATH, MISSING, MULTIDISCIPLINARY, PODCAST, PODCAST_SERIES, PROGRAMME, SOURCE_MATERIAL, SUBJECT, SUBJECT_MATERIAL, TASKS_AND_ACTIVITIES, TOPIC, VIDEO, contentTypeMapping, contentTypes, resourceEmbedTypeMapping };
+export { contentTypeMapping, contentTypes, resourceEmbedTypeMapping };
 //# sourceMappingURL=ContentType.mjs.map

package/es/model/ContentType.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ContentType.mjs","names":[],"sources":["../../src/model/ContentType.ts"],"sourcesContent":["/**\n * Copyright (c) 2017-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\nexport const SUBJECT_MATERIAL = \"subject-material\";\nexport const TASKS_AND_ACTIVITIES = \"tasks-and-activities\";\nexport const ASSESSMENT_RESOURCES = \"assessment-resources\";\nexport const SUBJECT = \"subject\";\nexport const SOURCE_MATERIAL = \"source-material\";\nexport const LEARNING_PATH = \"learning-path\";\nexport const TOPIC = \"topic\";\nexport const MULTIDISCIPLINARY = \"multidisciplinary\";\nexport const CONCEPT = \"concept\";\nexport const EXTERNAL = \"external\";\nexport const MISSING = \"missing\";\nexport const IMAGE = \"image\";\nexport const VIDEO = \"video\";\nexport const AUDIO = \"audio\";\nexport const PODCAST = \"podcast\";\nexport const GLOSS = \"gloss\";\nexport const PROGRAMME = \"programme\";\nexport const PODCAST_SERIES = \"podcast-series\";\nexport const FRONTPAGE_ARTICLE = \"frontpage-article\";\n\nexport const contentTypes = {\n  SUBJECT_MATERIAL,\n  TASKS_AND_ACTIVITIES,\n  ASSESSMENT_RESOURCES,\n  SUBJECT,\n  SOURCE_MATERIAL,\n  LEARNING_PATH,\n  TOPIC,\n  MULTIDISCIPLINARY,\n  CONCEPT,\n  EXTERNAL,\n  MISSING,\n  PROGRAMME,\n  PODCAST_SERIES,\n};\n\nexport const RESOURCE_TYPE_LEARNING_PATH = \"urn:resourcetype:learningPath\";\nexport const RESOURCE_TYPE_SUBJECT_MATERIAL = \"urn:resourcetype:subjectMaterial\";\nexport const RESOURCE_TYPE_TASKS_AND_ACTIVITIES = \"urn:resourcetype:tasksAndActivities\";\nexport const RESOURCE_TYPE_ASSESSMENT_RESOURCES = \"urn:resourcetype:reviewResource\";\nexport const RESOURCE_TYPE_SOURCE_MATERIAL = \"urn:resourcetype:SourceMaterial\";\nexport const RESOURCE_TYPE_CONCEPT = \"urn:resourcetype:concept\";\n\nexport const contentTypeMapping: Record<string, string> = {\n  [RESOURCE_TYPE_LEARNING_PATH]: LEARNING_PATH,\n  [RESOURCE_TYPE_SUBJECT_MATERIAL]: SUBJECT_MATERIAL,\n  [RESOURCE_TYPE_TASKS_AND_ACTIVITIES]: TASKS_AND_ACTIVITIES,\n  [RESOURCE_TYPE_ASSESSMENT_RESOURCES]: ASSESSMENT_RESOURCES,\n  [RESOURCE_TYPE_SOURCE_MATERIAL]: SOURCE_MATERIAL,\n  [RESOURCE_TYPE_CONCEPT]: CONCEPT,\n  [MULTIDISCIPLINARY]: MULTIDISCIPLINARY,\n  [TOPIC]: TOPIC,\n  [FRONTPAGE_ARTICLE]: FRONTPAGE_ARTICLE,\n  default: SUBJECT_MATERIAL,\n};\n\nexport const resourceEmbedTypeMapping: Record<string, string> = {\n  image: \"image\",\n  video: \"video\",\n  concept: \"concept\",\n  audio: \"audio\",\n  podcast: \"podcast\",\n  gloss: \"gloss\",\n};\n"],"mappings":";;;;;;;;AAQA,MAAa,mBAAmB;AAChC,MAAa,uBAAuB;AACpC,MAAa,uBAAuB;AACpC,MAAa,UAAU;AACvB,MAAa,kBAAkB;AAC/B,MAAa,gBAAgB;AAC7B,MAAa,QAAQ;AACrB,MAAa,oBAAoB;AACjC,MAAa,UAAU;AACvB,MAAa,WAAW;AACxB,MAAa,UAAU;AACvB,MAAa,QAAQ;AACrB,MAAa,QAAQ;AACrB,MAAa,QAAQ;AACrB,MAAa,UAAU;AACvB,MAAa,QAAQ;AACrB,MAAa,YAAY;AACzB,MAAa,iBAAiB;AAC9B,MAAa,oBAAoB;AAEjC,MAAa,eAAe;CAC1B;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAED,MAAa,8BAA8B;AAC3C,MAAa,iCAAiC;AAC9C,MAAa,qCAAqC;AAClD,MAAa,qCAAqC;AAClD,MAAa,gCAAgC;AAC7C,MAAa,wBAAwB;AAErC,MAAa,qBAA6C;EACvD,8BAA8B;EAC9B,iCAAiC;EACjC,qCAAqC;EACrC,qCAAqC;EACrC,gCAAgC;EAChC,wBAAwB;EACxB,oBAAoB;EACpB,QAAQ;EACR,oBAAoB;CACrB,SAAS;CACV;AAED,MAAa,2BAAmD;CAC9D,OAAO;CACP,OAAO;CACP,SAAS;CACT,OAAO;CACP,SAAS;CACT,OAAO;CACR"}
+{"version":3,"file":"ContentType.mjs","names":[],"sources":["../../src/model/ContentType.ts"],"sourcesContent":["/**\n * Copyright (c) 2017-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\nexport const SUBJECT_MATERIAL = \"subject-material\";\nexport const TASKS_AND_ACTIVITIES = \"tasks-and-activities\";\nexport const ASSESSMENT_RESOURCES = \"assessment-resources\";\nexport const SUBJECT = \"subject\";\nexport const SOURCE_MATERIAL = \"source-material\";\nexport const LEARNING_PATH = \"learning-path\";\nexport const TOPIC = \"topic\";\nexport const MULTIDISCIPLINARY = \"multidisciplinary\";\nexport const CONCEPT = \"concept\";\nexport const EXTERNAL = \"external\";\nexport const MISSING = \"missing\";\nexport const IMAGE = \"image\";\nexport const VIDEO = \"video\";\nexport const AUDIO = \"audio\";\nexport const PODCAST = \"podcast\";\nexport const GLOSS = \"gloss\";\nexport const PROGRAMME = \"programme\";\nexport const PODCAST_SERIES = \"podcast-series\";\nexport const FRONTPAGE_ARTICLE = \"frontpage-article\";\n\nexport const contentTypes = {\n  SUBJECT_MATERIAL,\n  TASKS_AND_ACTIVITIES,\n  ASSESSMENT_RESOURCES,\n  SUBJECT,\n  SOURCE_MATERIAL,\n  LEARNING_PATH,\n  TOPIC,\n  MULTIDISCIPLINARY,\n  CONCEPT,\n  EXTERNAL,\n  MISSING,\n  PROGRAMME,\n  PODCAST_SERIES,\n};\n\nexport const RESOURCE_TYPE_LEARNING_PATH = \"urn:resourcetype:learningPath\";\nexport const RESOURCE_TYPE_SUBJECT_MATERIAL = \"urn:resourcetype:subjectMaterial\";\nexport const RESOURCE_TYPE_TASKS_AND_ACTIVITIES = \"urn:resourcetype:tasksAndActivities\";\nexport const RESOURCE_TYPE_ASSESSMENT_RESOURCES = \"urn:resourcetype:reviewResource\";\nexport const RESOURCE_TYPE_SOURCE_MATERIAL = \"urn:resourcetype:SourceMaterial\";\nexport const RESOURCE_TYPE_CONCEPT = \"urn:resourcetype:concept\";\n\nexport const contentTypeMapping: Record<string, string> = {\n  [RESOURCE_TYPE_LEARNING_PATH]: LEARNING_PATH,\n  [RESOURCE_TYPE_SUBJECT_MATERIAL]: SUBJECT_MATERIAL,\n  [RESOURCE_TYPE_TASKS_AND_ACTIVITIES]: TASKS_AND_ACTIVITIES,\n  [RESOURCE_TYPE_ASSESSMENT_RESOURCES]: ASSESSMENT_RESOURCES,\n  [RESOURCE_TYPE_SOURCE_MATERIAL]: SOURCE_MATERIAL,\n  [RESOURCE_TYPE_CONCEPT]: CONCEPT,\n  [MULTIDISCIPLINARY]: MULTIDISCIPLINARY,\n  [TOPIC]: TOPIC,\n  [FRONTPAGE_ARTICLE]: FRONTPAGE_ARTICLE,\n  default: SUBJECT_MATERIAL,\n};\n\nexport const resourceEmbedTypeMapping: Record<string, string> = {\n  image: \"image\",\n  video: \"video\",\n  concept: \"concept\",\n  audio: \"audio\",\n  podcast: \"podcast\",\n  gloss: \"gloss\",\n};\n"],"mappings":";;;;;;;;AAQA,MAAa,mBAAmB;AAChC,MAAa,uBAAuB;AACpC,MAAa,uBAAuB;AACpC,MAAa,UAAU;AACvB,MAAa,kBAAkB;AAC/B,MAAa,gBAAgB;AAC7B,MAAa,QAAQ;AACrB,MAAa,oBAAoB;AACjC,MAAa,UAAU;AACvB,MAAa,WAAW;AACxB,MAAa,UAAU;AAMvB,MAAa,YAAY;AACzB,MAAa,iBAAiB;AAC9B,MAAa,oBAAoB;AAEjC,MAAa,eAAe;CAC1B;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAED,MAAa,8BAA8B;AAC3C,MAAa,iCAAiC;AAC9C,MAAa,qCAAqC;AAClD,MAAa,qCAAqC;AAClD,MAAa,gCAAgC;AAC7C,MAAa,wBAAwB;AAErC,MAAa,qBAA6C;EACvD,8BAA8B;EAC9B,iCAAiC;EACjC,qCAAqC;EACrC,qCAAqC;EACrC,gCAAgC;EAChC,wBAAwB;EACxB,oBAAoB;EACpB,QAAQ;EACR,oBAAoB;CACrB,SAAS;CACV;AAED,MAAa,2BAAmD;CAC9D,OAAO;CACP,OAAO;CACP,SAAS;CACT,OAAO;CACP,SAAS;CACT,OAAO;CACR"}