@ndla/ui 55.0.15-alpha.0 → 55.0.17-alpha.0

package/lib/Gloss/Gloss.js

@@ -12,7 +12,7 @@ var _primitives = require("@ndla/primitives");
 var _jsx2 = require("@ndla/styled-system/jsx");
 var _GlossExample = _interopRequireDefault(require("./GlossExample"));
 var _SpeechControl = _interopRequireDefault(require("../AudioPlayer/SpeechControl"));
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
+var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /**
  * Copyright (c) 2023-present, NDLA.
@@ -96,81 +96,81 @@ const Gloss = _ref => {
   } = (0, _reactI18next.useTranslation)();
   const filteredExamples = (0, _react.useMemo)(() => getFilteredExamples(glossData, exampleIds, exampleLangs), [exampleIds, exampleLangs, glossData]);
   if (!glossData) return null;
-  return (0, _jsxRuntime.jsx)(_primitives.AccordionRoot, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.AccordionRoot, {
     multiple: true,
     variant: "clean",
-    children: (0, _jsxRuntime.jsxs)(StyledAccordionItem, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledAccordionItem, {
       value: "gloss",
       variant: variant,
-      children: [(0, _jsxRuntime.jsxs)(Container, {
-        children: [(0, _jsxRuntime.jsxs)(TextWrapper, {
-          children: [(0, _jsxRuntime.jsx)(_primitives.Text, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(Container, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(TextWrapper, {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Text, {
             textStyle: "label.medium",
             fontWeight: "bold",
             asChild: true,
             consumeCss: true,
             lang: glossData.originalLanguage,
-            children: (0, _jsxRuntime.jsx)("span", {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
               children: glossData.gloss
             })
-          }), glossData.transcriptions.traditional && (0, _jsxRuntime.jsx)(_primitives.Text, {
+          }), glossData.transcriptions.traditional && /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Text, {
             textStyle: "label.medium",
             asChild: true,
             consumeCss: true,
-            children: (0, _jsxRuntime.jsx)("span", {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
               "aria-label": t("gloss.transcriptions.traditional"),
               lang: glossData.originalLanguage,
               children: glossData.transcriptions.traditional
             }, t("gloss.transcriptions.traditional"))
-          }), glossData.transcriptions.pinyin && (0, _jsxRuntime.jsx)(_primitives.Text, {
+          }), glossData.transcriptions.pinyin && /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Text, {
             textStyle: "label.medium",
             asChild: true,
             consumeCss: true,
-            children: (0, _jsxRuntime.jsx)("span", {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
               "data-pinyin": "",
               "aria-label": t("gloss.transcriptions.pinyin"),
               lang: glossData.originalLanguage,
               children: glossData.transcriptions.pinyin
             }, t("gloss.transcriptions.pinyin"))
-          }), glossData.wordClass && (0, _jsxRuntime.jsx)(_primitives.Text, {
+          }), glossData.wordClass && /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Text, {
             textStyle: "label.medium",
             asChild: true,
             consumeCss: true,
-            children: (0, _jsxRuntime.jsx)("span", {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
               "aria-label": t("gloss.wordClass"),
               children: t(`wordClass.${glossData.wordClass}`).toLowerCase()
             })
           })]
-        }), audio?.src && (0, _jsxRuntime.jsx)(_SpeechControl.default, {
+        }), audio?.src && /*#__PURE__*/(0, _jsxRuntime.jsx)(_SpeechControl.default, {
           src: audio.src,
           title: audio.title,
           type: "gloss"
         })]
-      }), (0, _jsxRuntime.jsxs)(StyledContainer, {
-        children: [(0, _jsxRuntime.jsx)(_primitives.Text, {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledContainer, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Text, {
           textStyle: "label.medium",
           asChild: true,
           consumeCss: true,
-          children: (0, _jsxRuntime.jsx)("span", {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
             lang: title.language,
             children: title.title
           })
-        }), !!filteredExamples.length && (0, _jsxRuntime.jsx)(_react2.AccordionItemTrigger, {
+        }), !!filteredExamples.length && /*#__PURE__*/(0, _jsxRuntime.jsx)(_react2.AccordionItemTrigger, {
           asChild: true,
-          children: (0, _jsxRuntime.jsx)(_primitives.IconButton, {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.IconButton, {
             variant: "tertiary",
             "aria-label": t("gloss.showExamples"),
             title: t("gloss.showExamples"),
-            children: (0, _jsxRuntime.jsx)(_primitives.AccordionItemIndicator, {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.AccordionItemIndicator, {
               asChild: true,
-              children: (0, _jsxRuntime.jsx)(_common.ChevronDown, {
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_common.ChevronDown, {
                 size: "medium"
               })
             })
           })
         })]
-      }), (0, _jsxRuntime.jsx)(StyledAccordionItemContent, {
-        children: filteredExamples.map((examples, index) => (0, _jsxRuntime.jsx)(_GlossExample.default, {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledAccordionItemContent, {
+        children: filteredExamples.map((examples, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_GlossExample.default, {
           examples: examples,
           originalLanguage: glossData.originalLanguage
         }, `gloss-example-${index}`))

package/lib/Gloss/GlossExample.js

@@ -7,7 +7,7 @@ exports.default = void 0;
 var _react = require("react");
 var _primitives = require("@ndla/primitives");
 var _jsx2 = require("@ndla/styled-system/jsx");
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Copyright (c) 2023-present, NDLA.
  *
@@ -41,24 +41,24 @@ const GlossExample = _ref => {
     examples,
     originalLanguage
   } = _ref;
-  return (0, _jsxRuntime.jsx)("div", {
-    children: examples.map((examples, index) => (0, _jsxRuntime.jsxs)(_react.Fragment, {
-      children: [(0, _jsxRuntime.jsx)(StyledGlossExample, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: examples.map((examples, index) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(StyledGlossExample, {
         lang: examples.language,
-        children: (0, _jsxRuntime.jsx)(_primitives.Text, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Text, {
           textStyle: "label.medium",
           lang: examples.language,
           children: examples.example
         })
-      }), !!examples.transcriptions.pinyin && (0, _jsxRuntime.jsx)(StyledGlossExample, {
-        children: (0, _jsxRuntime.jsx)(PinyinText, {
+      }), !!examples.transcriptions.pinyin && /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledGlossExample, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(PinyinText, {
           "data-pinyin": "",
           lang: originalLanguage,
           textStyle: "label.medium",
           children: examples.transcriptions?.pinyin
         })
-      }), !!examples.transcriptions?.traditional && (0, _jsxRuntime.jsx)(StyledGlossExample, {
-        children: (0, _jsxRuntime.jsx)(_primitives.Text, {
+      }), !!examples.transcriptions?.traditional && /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledGlossExample, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Text, {
           textStyle: "label.medium",
           lang: originalLanguage,
           children: examples.transcriptions.traditional

package/lib/Grid/Grid.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = exports.GridParallaxItem = void 0;
 var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _core = require("@ndla/core");
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
+var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; } /**
  * Copyright (c) 2023-present, NDLA.
@@ -35,7 +35,7 @@ const Grid = _ref => {
     ...rest
   } = _ref;
   const amountOfColumns = children?.length === 3 ? "3" : columns;
-  return (0, _jsxRuntime.jsx)(GridContainer, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(GridContainer, {
     "data-frontpage": size,
     "data-border": border,
     "data-columns": amountOfColumns,
@@ -61,9 +61,9 @@ const GridParallaxItem = _ref2 => {
     children,
     ...rest
   } = _ref2;
-  return (0, _jsxRuntime.jsx)(StyledGridParallaxItem, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledGridParallaxItem, {
     ...rest,
-    children: (0, _jsxRuntime.jsx)("div", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       children: children
     })
   });

package/lib/KeyFigure/KeyFigure.js

@@ -7,7 +7,7 @@ exports.default = void 0;
 var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _htmlReactParser = _interopRequireDefault(require("html-react-parser"));
 var _core = require("@ndla/core");
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
+var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; } /**
  * Copyright (c) 2023-present, NDLA.
@@ -52,15 +52,15 @@ const KeyFigure = _ref => {
     title,
     subtitle
   } = _ref;
-  return (0, _jsxRuntime.jsxs)(ContentWrapper, {
-    children: [(0, _jsxRuntime.jsx)(StyledImage, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(ContentWrapper, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(StyledImage, {
       src: `${image?.src}?width=150`,
       width: 150,
       height: 150,
       alt: image?.alt
-    }), (0, _jsxRuntime.jsx)(TitleWrapper, {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(TitleWrapper, {
       children: (0, _htmlReactParser.default)(title)
-    }), (0, _jsxRuntime.jsx)(SubTitleWrapper, {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SubTitleWrapper, {
       children: (0, _htmlReactParser.default)(subtitle)
     })]
   });

package/lib/Layout/LayoutItem.d.ts

@@ -5,11 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-/** @jsxImportSource @emotion/react */
-import { HTMLAttributes, ReactNode } from "react";
-interface Props extends HTMLAttributes<HTMLElement> {
-    children?: ReactNode;
-    layout?: "extend" | "center";
-}
-export declare const LayoutItem: ({ children, layout, ...rest }: Props) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const LayoutItem: import("@ndla/styled-system/types").StyledComponent<"section", {
+    layout?: "center" | "extend" | undefined;
+}>;
 export default LayoutItem;

package/lib/Layout/LayoutItem.js

@@ -4,48 +4,37 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.LayoutItem = void 0;
-var _react = require("react");
-var _react2 = require("@emotion/react");
-var _core = require("@ndla/core");
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; } /**
+var _jsx = require("@ndla/styled-system/jsx");
+/**
  * Copyright (c) 2016-present, NDLA.
  *
  * This source code is licensed under the GPLv3 license found in the
  * LICENSE file in the root directory of this source tree.
  *
- */ /** @jsxImportSource @emotion/react */
-const centerCss = process.env.NODE_ENV === "production" ? {
-  name: "ivh9x8-centerCss",
-  styles: "position:relative!important;width:83.333%;right:auto!important;left:8.333%;label:centerCss;"
-} : {
-  name: "ivh9x8-centerCss",
-  styles: "position:relative!important;width:83.333%;right:auto!important;left:8.333%;label:centerCss;",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxheW91dEl0ZW0udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtCcUIiLCJmaWxlIjoiTGF5b3V0SXRlbS50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxNi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgeyBIVE1MQXR0cmlidXRlcywgUmVhY3ROb2RlLCB1c2VNZW1vIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IG1xLCBicmVha3BvaW50cyB9IGZyb20gXCJAbmRsYS9jb3JlXCI7XG5cbmludGVyZmFjZSBQcm9wcyBleHRlbmRzIEhUTUxBdHRyaWJ1dGVzPEhUTUxFbGVtZW50PiB7XG4gIGNoaWxkcmVuPzogUmVhY3ROb2RlO1xuICBsYXlvdXQ/OiBcImV4dGVuZFwiIHwgXCJjZW50ZXJcIjtcbn1cblxuY29uc3QgY2VudGVyQ3NzID0gY3NzYFxuICBwb3NpdGlvbjogcmVsYXRpdmUgIWltcG9ydGFudDtcbiAgd2lkdGg6IDgzLjMzMyU7XG4gIHJpZ2h0OiBhdXRvICFpbXBvcnRhbnQ7XG4gIGxlZnQ6IDguMzMzJTtcbmA7XG5cbmNvbnN0IGV4dGVuZENzcyA9IGNzc2BcbiAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLnRhYmxldCB9KX0ge1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZSAhaW1wb3J0YW50O1xuICAgIHdpZHRoOiA4My4zMzMlO1xuICAgIHJpZ2h0OiBhdXRvICFpbXBvcnRhbnQ7XG4gICAgbGVmdDogOC4zMzMlO1xuICB9XG5gO1xuXG5leHBvcnQgY29uc3QgTGF5b3V0SXRlbSA9ICh7IGNoaWxkcmVuLCBsYXlvdXQsIC4uLnJlc3QgfTogUHJvcHMpID0+IHtcbiAgY29uc3Qgc3R5bGUgPSB1c2VNZW1vKCgpID0+IHtcbiAgICBpZiAobGF5b3V0ID09PSBcImV4dGVuZFwiKSB7XG4gICAgICByZXR1cm4gZXh0ZW5kQ3NzO1xuICAgIH0gZWxzZSBpZiAobGF5b3V0ID09PSBcImNlbnRlclwiKSB7XG4gICAgICByZXR1cm4gY2VudGVyQ3NzO1xuICAgIH1cbiAgICByZXR1cm4gdW5kZWZpbmVkO1xuICB9LCBbbGF5b3V0XSk7XG5cbiAgcmV0dXJuIChcbiAgICA8c2VjdGlvbiBjc3M9e3N0eWxlfSB7Li4ucmVzdH0+XG4gICAgICB7Y2hpbGRyZW59XG4gICAgPC9zZWN0aW9uPlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgTGF5b3V0SXRlbTtcbiJdfQ== */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-};
-const extendCss = /*#__PURE__*/(0, _react2.css)(_core.mq.range({
-  from: _core.breakpoints.tablet
-}), "{position:relative!important;width:83.333%;right:auto!important;left:8.333%;};label:extendCss;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxheW91dEl0ZW0udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXlCcUIiLCJmaWxlIjoiTGF5b3V0SXRlbS50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxNi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgeyBIVE1MQXR0cmlidXRlcywgUmVhY3ROb2RlLCB1c2VNZW1vIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IG1xLCBicmVha3BvaW50cyB9IGZyb20gXCJAbmRsYS9jb3JlXCI7XG5cbmludGVyZmFjZSBQcm9wcyBleHRlbmRzIEhUTUxBdHRyaWJ1dGVzPEhUTUxFbGVtZW50PiB7XG4gIGNoaWxkcmVuPzogUmVhY3ROb2RlO1xuICBsYXlvdXQ/OiBcImV4dGVuZFwiIHwgXCJjZW50ZXJcIjtcbn1cblxuY29uc3QgY2VudGVyQ3NzID0gY3NzYFxuICBwb3NpdGlvbjogcmVsYXRpdmUgIWltcG9ydGFudDtcbiAgd2lkdGg6IDgzLjMzMyU7XG4gIHJpZ2h0OiBhdXRvICFpbXBvcnRhbnQ7XG4gIGxlZnQ6IDguMzMzJTtcbmA7XG5cbmNvbnN0IGV4dGVuZENzcyA9IGNzc2BcbiAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLnRhYmxldCB9KX0ge1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZSAhaW1wb3J0YW50O1xuICAgIHdpZHRoOiA4My4zMzMlO1xuICAgIHJpZ2h0OiBhdXRvICFpbXBvcnRhbnQ7XG4gICAgbGVmdDogOC4zMzMlO1xuICB9XG5gO1xuXG5leHBvcnQgY29uc3QgTGF5b3V0SXRlbSA9ICh7IGNoaWxkcmVuLCBsYXlvdXQsIC4uLnJlc3QgfTogUHJvcHMpID0+IHtcbiAgY29uc3Qgc3R5bGUgPSB1c2VNZW1vKCgpID0+IHtcbiAgICBpZiAobGF5b3V0ID09PSBcImV4dGVuZFwiKSB7XG4gICAgICByZXR1cm4gZXh0ZW5kQ3NzO1xuICAgIH0gZWxzZSBpZiAobGF5b3V0ID09PSBcImNlbnRlclwiKSB7XG4gICAgICByZXR1cm4gY2VudGVyQ3NzO1xuICAgIH1cbiAgICByZXR1cm4gdW5kZWZpbmVkO1xuICB9LCBbbGF5b3V0XSk7XG5cbiAgcmV0dXJuIChcbiAgICA8c2VjdGlvbiBjc3M9e3N0eWxlfSB7Li4ucmVzdH0+XG4gICAgICB7Y2hpbGRyZW59XG4gICAgPC9zZWN0aW9uPlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgTGF5b3V0SXRlbTtcbiJdfQ== */"));
-const LayoutItem = _ref => {
-  let {
-    children,
-    layout,
-    ...rest
-  } = _ref;
-  const style = (0, _react.useMemo)(() => {
-    if (layout === "extend") {
-      return extendCss;
-    } else if (layout === "center") {
-      return centerCss;
+ */
+
+// TODO: Refactor this. This is a copy of our old layout.
+const LayoutItem = exports.LayoutItem = (0, _jsx.styled)("section", {
+  defaultVariants: {
+    layout: "center"
+  },
+  variants: {
+    layout: {
+      center: {
+        position: "relative!",
+        width: "83.333%",
+        right: "auto !important",
+        left: "8.333%"
+      },
+      extend: {
+        tablet: {
+          position: "relative!",
+          width: "83.333%",
+          right: "auto!",
+          left: "8.333%"
+        }
+      }
     }
-    return undefined;
-  }, [layout]);
-  return (0, _jsxRuntime.jsx)("section", {
-    css: style,
-    ...rest,
-    children: children
-  });
-};
-exports.LayoutItem = LayoutItem;
+  }
+});
 var _default = exports.default = LayoutItem;

package/lib/Layout/OneColumn.d.ts

@@ -5,10 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-/** @jsxImportSource @emotion/react */
-import { ComponentPropsWithoutRef } from "react";
-interface Props extends ComponentPropsWithoutRef<"div"> {
-    wide?: boolean;
-}
-export declare const OneColumn: ({ wide, ...rest }: Props) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const OneColumn: import("@ndla/styled-system/types").StyledComponent<"div", {
+    wide?: boolean | undefined;
+}>;
 export default OneColumn;

package/lib/Layout/OneColumn.js

@@ -4,42 +4,45 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.OneColumn = void 0;
-var _base = _interopRequireDefault(require("@emotion/styled/base"));
-var _react = require("@emotion/react");
-var _core = require("@ndla/core");
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; } /**
+var _jsx = require("@ndla/styled-system/jsx");
+/**
  * Copyright (c) 2016-present, NDLA.
  *
  * This source code is licensed under the GPLv3 license found in the
  * LICENSE file in the root directory of this source tree.
  *
- */ /** @jsxImportSource @emotion/react */
-const StyledOneColumn = /*#__PURE__*/(0, _base.default)("div", {
-  target: "ekga4hm0",
-  label: "StyledOneColumn"
-})("max-width:1024px;margin-left:auto;margin-right:auto;width:100%;padding-left:", _core.spacing.nsmall, ";padding-right:", _core.spacing.nsmall, ";", _core.mq.range({
-  from: _core.breakpoints.mobileWide
-}), "{padding-left:", _core.spacing.normal, ";padding-right:", _core.spacing.normal, ";}&::after{content:\"\"!important;display:block!important;clear:both!important;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk9uZUNvbHVtbi50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0JrQyIsImZpbGUiOiJPbmVDb2x1bW4udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMTYtcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG4vKiogQGpzeEltcG9ydFNvdXJjZSBAZW1vdGlvbi9yZWFjdCAqL1xuaW1wb3J0IHsgQ29tcG9uZW50UHJvcHNXaXRob3V0UmVmIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgbXEsIHNwYWNpbmcsIGJyZWFrcG9pbnRzIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcblxuaW50ZXJmYWNlIFByb3BzIGV4dGVuZHMgQ29tcG9uZW50UHJvcHNXaXRob3V0UmVmPFwiZGl2XCI+IHtcbiAgd2lkZT86IGJvb2xlYW47XG59XG5cbmNvbnN0IFN0eWxlZE9uZUNvbHVtbiA9IHN0eWxlZC5kaXZgXG4gIG1heC13aWR0aDogMTAyNHB4O1xuICBtYXJnaW4tbGVmdDogYXV0bztcbiAgbWFyZ2luLXJpZ2h0OiBhdXRvO1xuICB3aWR0aDogMTAwJTtcbiAgcGFkZGluZy1sZWZ0OiAke3NwYWNpbmcubnNtYWxsfTtcbiAgcGFkZGluZy1yaWdodDogJHtzcGFjaW5nLm5zbWFsbH07XG5cbiAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLm1vYmlsZVdpZGUgfSl9IHtcbiAgICBwYWRkaW5nLWxlZnQ6ICR7c3BhY2luZy5ub3JtYWx9O1xuICAgIHBhZGRpbmctcmlnaHQ6ICR7c3BhY2luZy5ub3JtYWx9O1xuICB9XG4gICY6OmFmdGVyIHtcbiAgICBjb250ZW50OiBcIlwiICFpbXBvcnRhbnQ7XG4gICAgZGlzcGxheTogYmxvY2sgIWltcG9ydGFudDtcbiAgICBjbGVhcjogYm90aCAhaW1wb3J0YW50O1xuICB9XG5gO1xuXG5jb25zdCB3aWRlU3R5bGUgPSBjc3NgXG4gIG1heC13aWR0aDogMTE1MHB4O1xuYDtcblxuZXhwb3J0IGNvbnN0IE9uZUNvbHVtbiA9ICh7IHdpZGUsIC4uLnJlc3QgfTogUHJvcHMpID0+IDxTdHlsZWRPbmVDb2x1bW4gY3NzPXt3aWRlID8gd2lkZVN0eWxlIDogdW5kZWZpbmVkfSB7Li4ucmVzdH0gLz47XG5cbmV4cG9ydCBkZWZhdWx0IE9uZUNvbHVtbjtcbiJdfQ== */"));
-const wideStyle = process.env.NODE_ENV === "production" ? {
-  name: "1i2tiuq-wideStyle",
-  styles: "max-width:1150px;label:wideStyle;"
-} : {
-  name: "1i2tiuq-wideStyle",
-  styles: "max-width:1150px;label:wideStyle;",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk9uZUNvbHVtbi50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBcUNxQiIsImZpbGUiOiJPbmVDb2x1bW4udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMTYtcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG4vKiogQGpzeEltcG9ydFNvdXJjZSBAZW1vdGlvbi9yZWFjdCAqL1xuaW1wb3J0IHsgQ29tcG9uZW50UHJvcHNXaXRob3V0UmVmIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgbXEsIHNwYWNpbmcsIGJyZWFrcG9pbnRzIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcblxuaW50ZXJmYWNlIFByb3BzIGV4dGVuZHMgQ29tcG9uZW50UHJvcHNXaXRob3V0UmVmPFwiZGl2XCI+IHtcbiAgd2lkZT86IGJvb2xlYW47XG59XG5cbmNvbnN0IFN0eWxlZE9uZUNvbHVtbiA9IHN0eWxlZC5kaXZgXG4gIG1heC13aWR0aDogMTAyNHB4O1xuICBtYXJnaW4tbGVmdDogYXV0bztcbiAgbWFyZ2luLXJpZ2h0OiBhdXRvO1xuICB3aWR0aDogMTAwJTtcbiAgcGFkZGluZy1sZWZ0OiAke3NwYWNpbmcubnNtYWxsfTtcbiAgcGFkZGluZy1yaWdodDogJHtzcGFjaW5nLm5zbWFsbH07XG5cbiAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLm1vYmlsZVdpZGUgfSl9IHtcbiAgICBwYWRkaW5nLWxlZnQ6ICR7c3BhY2luZy5ub3JtYWx9O1xuICAgIHBhZGRpbmctcmlnaHQ6ICR7c3BhY2luZy5ub3JtYWx9O1xuICB9XG4gICY6OmFmdGVyIHtcbiAgICBjb250ZW50OiBcIlwiICFpbXBvcnRhbnQ7XG4gICAgZGlzcGxheTogYmxvY2sgIWltcG9ydGFudDtcbiAgICBjbGVhcjogYm90aCAhaW1wb3J0YW50O1xuICB9XG5gO1xuXG5jb25zdCB3aWRlU3R5bGUgPSBjc3NgXG4gIG1heC13aWR0aDogMTE1MHB4O1xuYDtcblxuZXhwb3J0IGNvbnN0IE9uZUNvbHVtbiA9ICh7IHdpZGUsIC4uLnJlc3QgfTogUHJvcHMpID0+IDxTdHlsZWRPbmVDb2x1bW4gY3NzPXt3aWRlID8gd2lkZVN0eWxlIDogdW5kZWZpbmVkfSB7Li4ucmVzdH0gLz47XG5cbmV4cG9ydCBkZWZhdWx0IE9uZUNvbHVtbjtcbiJdfQ== */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-};
-const OneColumn = _ref => {
-  let {
-    wide,
-    ...rest
-  } = _ref;
-  return (0, _jsxRuntime.jsx)(StyledOneColumn, {
-    css: wide ? wideStyle : undefined,
-    ...rest
-  });
-};
-exports.OneColumn = OneColumn;
+ */
+
+// TODO: This is a rewrite of our old layout. Refactor this.
+const OneColumn = exports.OneColumn = (0, _jsx.styled)("div", {
+  base: {
+    marginLeft: "auto",
+    marginRight: "auto",
+    width: "100%",
+    paddingLeft: "18px",
+    paddingRight: "18px",
+    mobileWide: {
+      paddingLeft: "medium",
+      paddingRight: "medium"
+    },
+    _after: {
+      content: '""!',
+      display: "block!",
+      clear: "both!"
+    }
+  },
+  defaultVariants: {
+    wide: false
+  },
+  variants: {
+    wide: {
+      true: {
+        maxWidth: "1150px"
+      },
+      false: {
+        maxWidth: "1024px"
+      }
+    }
+  }
+});
 var _default = exports.default = OneColumn;

package/lib/Layout/PageContainer.d.ts

@@ -5,10 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-/** @jsxImportSource @emotion/react */
-import { ComponentPropsWithoutRef } from "react";
-interface Props extends ComponentPropsWithoutRef<"div"> {
-    backgroundWide?: boolean;
-}
-export declare const PageContainer: ({ backgroundWide, ...rest }: Props) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const PageContainer: import("@ndla/styled-system/types").StyledComponent<"div", {
+    backgroundWide?: boolean | undefined;
+}>;
 export default PageContainer;

package/lib/Layout/PageContainer.js

@@ -4,42 +4,34 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.PageContainer = void 0;
-var _base = _interopRequireDefault(require("@emotion/styled/base"));
-var _react = require("@emotion/react");
-var _core = require("@ndla/core");
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; } /**
+var _jsx = require("@ndla/styled-system/jsx");
+/**
  * Copyright (c) 2016-present, NDLA.
  *
  * This source code is licensed under the GPLv3 license found in the
  * LICENSE file in the root directory of this source tree.
  *
- */ /** @jsxImportSource @emotion/react */
-const StyledPageContainer = /*#__PURE__*/(0, _base.default)("div", {
-  target: "e15w8m0f0",
-  label: "StyledPageContainer"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1vuza9j",
-  styles: "min-height:100vh;display:flex;flex-direction:column"
-} : {
-  name: "1vuza9j",
-  styles: "min-height:100vh;display:flex;flex-direction:column",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlBhZ2VDb250YWluZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtCc0MiLCJmaWxlIjoiUGFnZUNvbnRhaW5lci50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxNi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgeyBDb21wb25lbnRQcm9wc1dpdGhvdXRSZWYgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBjb2xvcnMsIG1xLCBicmVha3BvaW50cyB9IGZyb20gXCJAbmRsYS9jb3JlXCI7XG5cbmludGVyZmFjZSBQcm9wcyBleHRlbmRzIENvbXBvbmVudFByb3BzV2l0aG91dFJlZjxcImRpdlwiPiB7XG4gIGJhY2tncm91bmRXaWRlPzogYm9vbGVhbjtcbn1cblxuY29uc3QgU3R5bGVkUGFnZUNvbnRhaW5lciA9IHN0eWxlZC5kaXZgXG4gIG1pbi1oZWlnaHQ6IDEwMHZoO1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuYDtcblxuY29uc3QgYmFja2dyb3VuZFdpZGVTdHlsZSA9IGNzc2BcbiAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLnRhYmxldCB9KX0ge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7Y29sb3JzLmJyYW5kLmdyZXlMaWdodGVzdH07XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBQYWdlQ29udGFpbmVyID0gKHsgYmFja2dyb3VuZFdpZGUgPSBmYWxzZSwgLi4ucmVzdCB9OiBQcm9wcykgPT4gKFxuICA8U3R5bGVkUGFnZUNvbnRhaW5lciBjc3M9e2JhY2tncm91bmRXaWRlID8gYmFja2dyb3VuZFdpZGVTdHlsZSA6IHVuZGVmaW5lZH0gey4uLnJlc3R9IC8+XG4pO1xuXG5leHBvcnQgZGVmYXVsdCBQYWdlQ29udGFpbmVyO1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+ */
+
+// TODO: Refactor this. It's a rewrite of our old layout.
+const PageContainer = exports.PageContainer = (0, _jsx.styled)("div", {
+  base: {
+    minHeight: "100vh",
+    display: "flex",
+    flexDirection: "column"
+  },
+  defaultVariants: {
+    backgroundWide: false
+  },
+  variants: {
+    backgroundWide: {
+      true: {
+        tablet: {
+          backgroundColor: "#f8f8f8"
+        }
+      },
+      false: {}
+    }
+  }
 });
-const backgroundWideStyle = /*#__PURE__*/(0, _react.css)(_core.mq.range({
-  from: _core.breakpoints.tablet
-}), "{background-color:", _core.colors.brand.greyLightest, ";};label:backgroundWideStyle;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlBhZ2VDb250YWluZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXdCK0IiLCJmaWxlIjoiUGFnZUNvbnRhaW5lci50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxNi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgeyBDb21wb25lbnRQcm9wc1dpdGhvdXRSZWYgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBjb2xvcnMsIG1xLCBicmVha3BvaW50cyB9IGZyb20gXCJAbmRsYS9jb3JlXCI7XG5cbmludGVyZmFjZSBQcm9wcyBleHRlbmRzIENvbXBvbmVudFByb3BzV2l0aG91dFJlZjxcImRpdlwiPiB7XG4gIGJhY2tncm91bmRXaWRlPzogYm9vbGVhbjtcbn1cblxuY29uc3QgU3R5bGVkUGFnZUNvbnRhaW5lciA9IHN0eWxlZC5kaXZgXG4gIG1pbi1oZWlnaHQ6IDEwMHZoO1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuYDtcblxuY29uc3QgYmFja2dyb3VuZFdpZGVTdHlsZSA9IGNzc2BcbiAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLnRhYmxldCB9KX0ge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7Y29sb3JzLmJyYW5kLmdyZXlMaWdodGVzdH07XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBQYWdlQ29udGFpbmVyID0gKHsgYmFja2dyb3VuZFdpZGUgPSBmYWxzZSwgLi4ucmVzdCB9OiBQcm9wcykgPT4gKFxuICA8U3R5bGVkUGFnZUNvbnRhaW5lciBjc3M9e2JhY2tncm91bmRXaWRlID8gYmFja2dyb3VuZFdpZGVTdHlsZSA6IHVuZGVmaW5lZH0gey4uLnJlc3R9IC8+XG4pO1xuXG5leHBvcnQgZGVmYXVsdCBQYWdlQ29udGFpbmVyO1xuIl19 */"));
-const PageContainer = _ref => {
-  let {
-    backgroundWide = false,
-    ...rest
-  } = _ref;
-  return (0, _jsxRuntime.jsx)(StyledPageContainer, {
-    css: backgroundWide ? backgroundWideStyle : undefined,
-    ...rest
-  });
-};
-exports.PageContainer = PageContainer;
 var _default = exports.default = PageContainer;

package/lib/LicenseByline/EmbedByline.js

@@ -11,7 +11,7 @@ var _licenses = require("@ndla/licenses");
 var _primitives = require("@ndla/primitives");
 var _jsx2 = require("@ndla/styled-system/jsx");
 var _LicenseLink = require("./LicenseLink");
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Copyright (c) 2023-present, NDLA.
  *
@@ -71,10 +71,10 @@ const EmbedByline = _ref => {
   } = (0, _reactI18next.useTranslation)();
   if (props.error) {
     const typeString = type === "h5p" ? "H5P" : t(`embed.type.${type}`).toLowerCase();
-    return (0, _jsxRuntime.jsx)(ErrorBylineWrapper, {
-      children: (0, _jsxRuntime.jsxs)(ContentWrapper, {
-        children: [(0, _jsxRuntime.jsx)(_common.WarningOutline, {}), (0, _jsxRuntime.jsx)(BaseDescription, {
-          children: (0, _jsxRuntime.jsx)("span", {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(ErrorBylineWrapper, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(ContentWrapper, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_common.WarningOutline, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(BaseDescription, {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
             children: t("embed.embedError", {
               type: typeString
             })
@@ -86,21 +86,21 @@ const EmbedByline = _ref => {
   const {
     copyright
   } = props;
-  return (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [(0, _jsxRuntime.jsx)(BylineWrapper, {
-      children: (0, _jsxRuntime.jsxs)("div", {
-        children: [(0, _jsxRuntime.jsx)(LicenseContainerContent, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(BylineWrapper, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(LicenseContainerContent, {
           type: type,
           copyright: copyright,
           children: description
         }), children]
       })
-    }), visibleAlt ? (0, _jsxRuntime.jsx)(StyledText, {
+    }), visibleAlt ? /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledText, {
       color: "text.subtle",
       textStyle: "label.medium",
       asChild: true,
       consumeCss: true,
-      children: (0, _jsxRuntime.jsx)("span", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         children: `Alt: ${visibleAlt}`
       })
     }) : null]
@@ -158,13 +158,13 @@ const LicenseDescription = _ref2 => {
   const handleToggle = () => {
     setIsOpen(!isOpen);
   };
-  return (0, _jsxRuntime.jsx)(ContentWrapper, {
-    children: (0, _jsxRuntime.jsxs)(StyledDescription, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ContentWrapper, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledDescription, {
       ...open,
-      children: [(0, _jsxRuntime.jsx)(TextContent, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(TextContent, {
         ...open,
         children: children
-      }), (0, _jsxRuntime.jsx)(StyledButton, {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledButton, {
         variant: "link",
         size: "small",
         onClick: handleToggle,
@@ -186,23 +186,23 @@ const LicenseContainerContent = _ref3 => {
   const license = copyright ? (0, _licenses.getLicenseByAbbreviation)(copyright.license?.license ?? "", i18n.language) : undefined;
   const authors = (0, _licenses.getLicenseCredits)(copyright);
   const captionAuthors = Object.values(authors).find(i => i.length > 0) ?? [];
-  const content = (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [children, ` ${t(`embed.type.${type}`)}${captionAuthors.length ? ": " : ""}`, captionAuthors.map(author => author.name).join(", "), license ? (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [" / ", (0, _jsxRuntime.jsx)(_LicenseLink.LicenseLink, {
+  const content = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [children, ` ${t(`embed.type.${type}`)}${captionAuthors.length ? ": " : ""}`, captionAuthors.map(author => author.name).join(", "), license ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [" / ", /*#__PURE__*/(0, _jsxRuntime.jsx)(_LicenseLink.LicenseLink, {
         license: license
       })]
     }) : null]
   });
   if (children) {
-    return (0, _jsxRuntime.jsx)(LicenseDescription, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(LicenseDescription, {
       children: content
     });
   }
-  return (0, _jsxRuntime.jsx)(_primitives.Text, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Text, {
     textStyle: "label.medium",
     asChild: true,
     consumeCss: true,
-    children: (0, _jsxRuntime.jsx)("span", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       children: content
     })
   });

package/lib/LicenseByline/LicenseLink.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.LicenseLink = void 0;
 var _safelink = require("@ndla/safelink");
 var _jsx2 = require("@ndla/styled-system/jsx");
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Copyright (c) 2023-present, NDLA.
  *
@@ -36,13 +36,13 @@ const LicenseLink = _ref => {
     return null;
   }
   if (license.url?.length) {
-    return (0, _jsxRuntime.jsx)(StyledSafeLink, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledSafeLink, {
       to: license.url,
       rel: "license",
       children: license.abbreviation
     });
   }
-  return (0, _jsxRuntime.jsx)("span", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
     children: license.abbreviation
   });
 };