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

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
   });
 };

package/lib/LinkBlock/LinkBlock.js

@@ -13,7 +13,7 @@ var _primitives = require("@ndla/primitives");
 var _safelink = require("@ndla/safelink");
 var _jsx2 = require("@ndla/styled-system/jsx");
 var _relativeUrl = require("../utils/relativeUrl");
-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.
@@ -87,21 +87,21 @@ const LinkBlock = _ref => {
       locale
     });
   }, [date, articleLanguage]);
-  return (0, _jsxRuntime.jsxs)(StyledSafeLink, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledSafeLink, {
     to: href,
-    children: [(0, _jsxRuntime.jsxs)(InfoWrapper, {
-      children: [(0, _jsxRuntime.jsx)(_primitives.Heading, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(InfoWrapper, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Heading, {
         asChild: true,
         consumeCss: true,
         textStyle: "title.medium",
-        children: (0, _jsxRuntime.jsx)("h3", {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("h3", {
           "data-heading": true,
           children: (0, _htmlReactParser.default)(title)
         })
-      }), date && (0, _jsxRuntime.jsxs)(StyledDateContainer, {
-        children: [(0, _jsxRuntime.jsx)(StyledCalendarEd, {}), formattedDate]
+      }), date && /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledDateContainer, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(StyledCalendarEd, {}), formattedDate]
       })]
-    }), (0, _jsxRuntime.jsx)(_common.Forward, {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_common.Forward, {
       "data-forward": true
     })]
   });

package/lib/LinkBlock/LinkBlockSection.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = require("react");
 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.
  *
@@ -28,10 +28,10 @@ const LinkBlockSection = _ref => {
     children,
     ...rest
   } = _ref;
-  return (0, _jsxRuntime.jsx)("nav", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("nav", {
     ...rest,
-    children: (0, _jsxRuntime.jsx)(StyledList, {
-      children: _react.Children.map(children, child => (0, _jsxRuntime.jsx)("li", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledList, {
+      children: _react.Children.map(children, child => /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
         children: child
       }))
     })

package/lib/Messages/MessageBox.js

@@ -10,7 +10,7 @@ var _button = require("@ndla/button");
 var _core = require("@ndla/core");
 var _action = require("@ndla/icons/action");
 var _common = require("@ndla/icons/common");
-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) 2022-present, NDLA.
@@ -58,28 +58,28 @@ const MessageBox = _ref => {
   const {
     t
   } = (0, _reactI18next.useTranslation)();
-  return (0, _jsxRuntime.jsxs)(MessageBoxWrapper, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(MessageBoxWrapper, {
     "data-type": type,
     contentEditable: contentEditable ?? undefined,
-    children: [(0, _jsxRuntime.jsx)(InfoWrapper, {
-      children: (0, _jsxRuntime.jsxs)("div", {
-        children: [(0, _jsxRuntime.jsx)(ChildrenWrapper, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(InfoWrapper, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ChildrenWrapper, {
           children: children
-        }), links && (0, _jsxRuntime.jsx)(LinkWrapper, {
-          children: links.map(x => (0, _jsxRuntime.jsxs)(Link, {
+        }), links && /*#__PURE__*/(0, _jsxRuntime.jsx)(LinkWrapper, {
+          children: links.map(x => /*#__PURE__*/(0, _jsxRuntime.jsxs)(Link, {
             href: x.href,
-            children: [(0, _jsxRuntime.jsx)("span", {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
               children: x.text
-            }), (0, _jsxRuntime.jsx)(_common.Forward, {})]
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_common.Forward, {})]
           }, x.href))
         })]
       })
-    }), showCloseButton && (0, _jsxRuntime.jsx)(StyledCloseButton, {
+    }), showCloseButton && /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledCloseButton, {
       variant: "ghost",
       "aria-label": t("close"),
       title: t("close"),
       onClick: onClose,
-      children: (0, _jsxRuntime.jsx)(_action.Cross, {})
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_action.Cross, {})
     })]
   });
 };

package/lib/Messages/index.d.ts

@@ -5,6 +5,5 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-import MessageBanner from "./MessageBanner";
 import MessageBox from "./MessageBox";
-export { MessageBox, MessageBanner };
+export { MessageBox };

package/lib/Messages/index.js

@@ -3,18 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "MessageBanner", {
-  enumerable: true,
-  get: function () {
-    return _MessageBanner.default;
-  }
-});
 Object.defineProperty(exports, "MessageBox", {
   enumerable: true,
   get: function () {
     return _MessageBox.default;
   }
 });
-var _MessageBanner = _interopRequireDefault(require("./MessageBanner"));
 var _MessageBox = _interopRequireDefault(require("./MessageBox"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }