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

package/es/ErrorMessage/ErrorMessage.js

@@ -1,4 +1,3 @@
-import _styled from "@emotion/styled/base";
 /**
  * Copyright (c) 2019-present, NDLA.
  *
@@ -7,29 +6,49 @@ import _styled from "@emotion/styled/base";
  *
  */
 
-import { colors, spacing, breakpoints } from "@ndla/core";
+import { Text } from "@ndla/primitives";
 import { SafeLink } from "@ndla/safelink";
+import { styled } from "@ndla/styled-system/jsx";
+
+// TODO: This has not been redesignet yet. This is just a rewrite of the previous design in panda
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-const StyledErrorMessage = /*#__PURE__*/_styled("article", {
-  target: "e1n5vqts4",
-  label: "StyledErrorMessage"
-})("text-align:center;a{color:", colors.brand.primary, ";}h1{margin-top:0;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkVycm9yTWVzc2FnZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBYXlDIiwiZmlsZSI6IkVycm9yTWVzc2FnZS50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxOS1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCB7IFJlYWN0Tm9kZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBjb2xvcnMsIHNwYWNpbmcsIGJyZWFrcG9pbnRzIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IFNhZmVMaW5rIH0gZnJvbSBcIkBuZGxhL3NhZmVsaW5rXCI7XG5cbmNvbnN0IFN0eWxlZEVycm9yTWVzc2FnZSA9IHN0eWxlZC5hcnRpY2xlYFxuICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gIGEge1xuICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC5wcmltYXJ5fTtcbiAgfVxuXG4gIGgxIHtcbiAgICBtYXJnaW4tdG9wOiAwO1xuICB9XG5gO1xuXG5jb25zdCBJbGx1c3RyYXRpb25XcmFwcGVyID0gc3R5bGVkKFwiZGl2XCIpYFxuICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgQG1lZGlhIChtaW4td2lkdGg6ICR7YnJlYWtwb2ludHMudGFibGV0fSkge1xuICAgIG1hcmdpbi10b3A6ICR7c3BhY2luZy5sYXJnZX07XG4gIH1cbmA7XG5cbmNvbnN0IERlc2NyaXB0aW9uID0gc3R5bGVkKFwicFwiKWBcbiAgbWFyZ2luLWJvdHRvbTogJHtzcGFjaW5nLm5vcm1hbH07XG4gIEBtZWRpYSAobWluLXdpZHRoOiAke2JyZWFrcG9pbnRzLnRhYmxldH0pIHtcbiAgICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcubGFyZ2V9O1xuICB9XG5gO1xuXG5jb25zdCBDdXN0b21FbGVtZW50V3JhcHBlciA9IHN0eWxlZC5kaXZgXG4gIG1hcmdpbjogJHtzcGFjaW5nLmxhcmdlfSAwO1xuYDtcblxuY29uc3QgTWVzc2FnZVdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBtYXJnaW4tdG9wOiAke3NwYWNpbmcueHNtYWxsfTtcbmA7XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIG1lc3NhZ2VzOiB7XG4gICAgdGl0bGU6IHN0cmluZztcbiAgICBkZXNjcmlwdGlvbj86IHN0cmluZztcbiAgICBsaW5rc1RpdGxlPzogc3RyaW5nO1xuICAgIGJhY2s/OiBzdHJpbmc7XG4gICAgZ29Ub0Zyb250UGFnZT86IHN0cmluZztcbiAgICBsb2dJbkZhaWxlZD86IHN0cmluZztcbiAgfTtcbiAgaWxsdXN0cmF0aW9uPzoge1xuICAgIHVybDogc3RyaW5nO1xuICAgIGFsdFRleHQ6IHN0cmluZztcbiAgfTtcbiAgaWxsdXN0cmF0aW9uRWxlbWVudD86IFJlYWN0Tm9kZTtcbiAgY3VzdG9tRWxlbWVudD86IFJlYWN0Tm9kZTtcbiAgY2hpbGRyZW4/OiBSZWFjdE5vZGU7XG59XG5leHBvcnQgY29uc3QgRXJyb3JNZXNzYWdlID0gKHsgY2hpbGRyZW4sIG1lc3NhZ2VzLCBpbGx1c3RyYXRpb24sIGlsbHVzdHJhdGlvbkVsZW1lbnQsIGN1c3RvbUVsZW1lbnQgfTogUHJvcHMpID0+IChcbiAgPFN0eWxlZEVycm9yTWVzc2FnZT5cbiAgICB7aWxsdXN0cmF0aW9uICYmIChcbiAgICAgIDxJbGx1c3RyYXRpb25XcmFwcGVyPlxuICAgICAgICA8aW1nIHNyYz17aWxsdXN0cmF0aW9uLnVybH0gYWx0PXtpbGx1c3RyYXRpb24uYWx0VGV4dH0gLz5cbiAgICAgIDwvSWxsdXN0cmF0aW9uV3JhcHBlcj5cbiAgICApfVxuICAgIHtpbGx1c3RyYXRpb25FbGVtZW50ICYmIDxJbGx1c3RyYXRpb25XcmFwcGVyPntpbGx1c3RyYXRpb25FbGVtZW50fTwvSWxsdXN0cmF0aW9uV3JhcHBlcj59XG4gICAgPGgxPnttZXNzYWdlcy50aXRsZX08L2gxPlxuICAgIHttZXNzYWdlcy5kZXNjcmlwdGlvbiAmJiA8RGVzY3JpcHRpb24+e21lc3NhZ2VzLmRlc2NyaXB0aW9ufTwvRGVzY3JpcHRpb24+fVxuICAgIHtjdXN0b21FbGVtZW50ICYmIDxDdXN0b21FbGVtZW50V3JhcHBlcj57Y3VzdG9tRWxlbWVudH08L0N1c3RvbUVsZW1lbnRXcmFwcGVyPn1cbiAgICB7bWVzc2FnZXMubGlua3NUaXRsZSAmJiA8aDI+e21lc3NhZ2VzLmxpbmtzVGl0bGV9PC9oMj59XG4gICAge21lc3NhZ2VzLmJhY2sgJiYgKFxuICAgICAgPFNhZmVMaW5rIHRvPXtgLyMke2VuY29kZVVSSShtZXNzYWdlcy5iYWNrKX1gfSBvbkNsaWNrPXsoKSA9PiB3aW5kb3cuaGlzdG9yeS5iYWNrKCl9PlxuICAgICAgICB7bWVzc2FnZXMuYmFja31cbiAgICAgIDwvU2FmZUxpbms+XG4gICAgKX1cbiAgICB7bWVzc2FnZXMuZ29Ub0Zyb250UGFnZSAmJiAoXG4gICAgICA8TWVzc2FnZVdyYXBwZXI+XG4gICAgICAgIDxTYWZlTGluayB0bz1cIi9cIj57bWVzc2FnZXMuZ29Ub0Zyb250UGFnZX08L1NhZmVMaW5rPlxuICAgICAgPC9NZXNzYWdlV3JhcHBlcj5cbiAgICApfVxuICAgIHttZXNzYWdlcy5sb2dJbkZhaWxlZCAmJiAoXG4gICAgICA8TWVzc2FnZVdyYXBwZXI+XG4gICAgICAgIDxTYWZlTGluayB0bz1cIi9taW5uZGxhXCI+e21lc3NhZ2VzLmxvZ0luRmFpbGVkfTwvU2FmZUxpbms+XG4gICAgICA8L01lc3NhZ2VXcmFwcGVyPlxuICAgICl9XG4gICAge2NoaWxkcmVufVxuICA8L1N0eWxlZEVycm9yTWVzc2FnZT5cbik7XG5cbmV4cG9ydCBkZWZhdWx0IEVycm9yTWVzc2FnZTtcbiJdfQ== */"));
-const IllustrationWrapper = /*#__PURE__*/_styled("div", {
-  target: "e1n5vqts3",
-  label: "IllustrationWrapper"
-})("margin-bottom:", spacing.normal, ";@media (min-width: ", breakpoints.tablet, "){margin-top:", spacing.large, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkVycm9yTWVzc2FnZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0J5QyIsImZpbGUiOiJFcnJvck1lc3NhZ2UudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMTktcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG5pbXBvcnQgeyBSZWFjdE5vZGUgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgY29sb3JzLCBzcGFjaW5nLCBicmVha3BvaW50cyB9IGZyb20gXCJAbmRsYS9jb3JlXCI7XG5pbXBvcnQgeyBTYWZlTGluayB9IGZyb20gXCJAbmRsYS9zYWZlbGlua1wiO1xuXG5jb25zdCBTdHlsZWRFcnJvck1lc3NhZ2UgPSBzdHlsZWQuYXJ0aWNsZWBcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xuICBhIHtcbiAgICBjb2xvcjogJHtjb2xvcnMuYnJhbmQucHJpbWFyeX07XG4gIH1cblxuICBoMSB7XG4gICAgbWFyZ2luLXRvcDogMDtcbiAgfVxuYDtcblxuY29uc3QgSWxsdXN0cmF0aW9uV3JhcHBlciA9IHN0eWxlZChcImRpdlwiKWBcbiAgbWFyZ2luLWJvdHRvbTogJHtzcGFjaW5nLm5vcm1hbH07XG4gIEBtZWRpYSAobWluLXdpZHRoOiAke2JyZWFrcG9pbnRzLnRhYmxldH0pIHtcbiAgICBtYXJnaW4tdG9wOiAke3NwYWNpbmcubGFyZ2V9O1xuICB9XG5gO1xuXG5jb25zdCBEZXNjcmlwdGlvbiA9IHN0eWxlZChcInBcIilgXG4gIG1hcmdpbi1ib3R0b206ICR7c3BhY2luZy5ub3JtYWx9O1xuICBAbWVkaWEgKG1pbi13aWR0aDogJHticmVha3BvaW50cy50YWJsZXR9KSB7XG4gICAgbWFyZ2luLWJvdHRvbTogJHtzcGFjaW5nLmxhcmdlfTtcbiAgfVxuYDtcblxuY29uc3QgQ3VzdG9tRWxlbWVudFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBtYXJnaW46ICR7c3BhY2luZy5sYXJnZX0gMDtcbmA7XG5cbmNvbnN0IE1lc3NhZ2VXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgbWFyZ2luLXRvcDogJHtzcGFjaW5nLnhzbWFsbH07XG5gO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICBtZXNzYWdlczoge1xuICAgIHRpdGxlOiBzdHJpbmc7XG4gICAgZGVzY3JpcHRpb24/OiBzdHJpbmc7XG4gICAgbGlua3NUaXRsZT86IHN0cmluZztcbiAgICBiYWNrPzogc3RyaW5nO1xuICAgIGdvVG9Gcm9udFBhZ2U/OiBzdHJpbmc7XG4gICAgbG9nSW5GYWlsZWQ/OiBzdHJpbmc7XG4gIH07XG4gIGlsbHVzdHJhdGlvbj86IHtcbiAgICB1cmw6IHN0cmluZztcbiAgICBhbHRUZXh0OiBzdHJpbmc7XG4gIH07XG4gIGlsbHVzdHJhdGlvbkVsZW1lbnQ/OiBSZWFjdE5vZGU7XG4gIGN1c3RvbUVsZW1lbnQ/OiBSZWFjdE5vZGU7XG4gIGNoaWxkcmVuPzogUmVhY3ROb2RlO1xufVxuZXhwb3J0IGNvbnN0IEVycm9yTWVzc2FnZSA9ICh7IGNoaWxkcmVuLCBtZXNzYWdlcywgaWxsdXN0cmF0aW9uLCBpbGx1c3RyYXRpb25FbGVtZW50LCBjdXN0b21FbGVtZW50IH06IFByb3BzKSA9PiAoXG4gIDxTdHlsZWRFcnJvck1lc3NhZ2U+XG4gICAge2lsbHVzdHJhdGlvbiAmJiAoXG4gICAgICA8SWxsdXN0cmF0aW9uV3JhcHBlcj5cbiAgICAgICAgPGltZyBzcmM9e2lsbHVzdHJhdGlvbi51cmx9IGFsdD17aWxsdXN0cmF0aW9uLmFsdFRleHR9IC8+XG4gICAgICA8L0lsbHVzdHJhdGlvbldyYXBwZXI+XG4gICAgKX1cbiAgICB7aWxsdXN0cmF0aW9uRWxlbWVudCAmJiA8SWxsdXN0cmF0aW9uV3JhcHBlcj57aWxsdXN0cmF0aW9uRWxlbWVudH08L0lsbHVzdHJhdGlvbldyYXBwZXI+fVxuICAgIDxoMT57bWVzc2FnZXMudGl0bGV9PC9oMT5cbiAgICB7bWVzc2FnZXMuZGVzY3JpcHRpb24gJiYgPERlc2NyaXB0aW9uPnttZXNzYWdlcy5kZXNjcmlwdGlvbn08L0Rlc2NyaXB0aW9uPn1cbiAgICB7Y3VzdG9tRWxlbWVudCAmJiA8Q3VzdG9tRWxlbWVudFdyYXBwZXI+e2N1c3RvbUVsZW1lbnR9PC9DdXN0b21FbGVtZW50V3JhcHBlcj59XG4gICAge21lc3NhZ2VzLmxpbmtzVGl0bGUgJiYgPGgyPnttZXNzYWdlcy5saW5rc1RpdGxlfTwvaDI+fVxuICAgIHttZXNzYWdlcy5iYWNrICYmIChcbiAgICAgIDxTYWZlTGluayB0bz17YC8jJHtlbmNvZGVVUkkobWVzc2FnZXMuYmFjayl9YH0gb25DbGljaz17KCkgPT4gd2luZG93Lmhpc3RvcnkuYmFjaygpfT5cbiAgICAgICAge21lc3NhZ2VzLmJhY2t9XG4gICAgICA8L1NhZmVMaW5rPlxuICAgICl9XG4gICAge21lc3NhZ2VzLmdvVG9Gcm9udFBhZ2UgJiYgKFxuICAgICAgPE1lc3NhZ2VXcmFwcGVyPlxuICAgICAgICA8U2FmZUxpbmsgdG89XCIvXCI+e21lc3NhZ2VzLmdvVG9Gcm9udFBhZ2V9PC9TYWZlTGluaz5cbiAgICAgIDwvTWVzc2FnZVdyYXBwZXI+XG4gICAgKX1cbiAgICB7bWVzc2FnZXMubG9nSW5GYWlsZWQgJiYgKFxuICAgICAgPE1lc3NhZ2VXcmFwcGVyPlxuICAgICAgICA8U2FmZUxpbmsgdG89XCIvbWlubmRsYVwiPnttZXNzYWdlcy5sb2dJbkZhaWxlZH08L1NhZmVMaW5rPlxuICAgICAgPC9NZXNzYWdlV3JhcHBlcj5cbiAgICApfVxuICAgIHtjaGlsZHJlbn1cbiAgPC9TdHlsZWRFcnJvck1lc3NhZ2U+XG4pO1xuXG5leHBvcnQgZGVmYXVsdCBFcnJvck1lc3NhZ2U7XG4iXX0= */"));
-const Description = /*#__PURE__*/_styled("p", {
-  target: "e1n5vqts2",
-  label: "Description"
-})("margin-bottom:", spacing.normal, ";@media (min-width: ", breakpoints.tablet, "){margin-bottom:", spacing.large, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkVycm9yTWVzc2FnZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBK0IrQiIsImZpbGUiOiJFcnJvck1lc3NhZ2UudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMTktcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG5pbXBvcnQgeyBSZWFjdE5vZGUgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgY29sb3JzLCBzcGFjaW5nLCBicmVha3BvaW50cyB9IGZyb20gXCJAbmRsYS9jb3JlXCI7XG5pbXBvcnQgeyBTYWZlTGluayB9IGZyb20gXCJAbmRsYS9zYWZlbGlua1wiO1xuXG5jb25zdCBTdHlsZWRFcnJvck1lc3NhZ2UgPSBzdHlsZWQuYXJ0aWNsZWBcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xuICBhIHtcbiAgICBjb2xvcjogJHtjb2xvcnMuYnJhbmQucHJpbWFyeX07XG4gIH1cblxuICBoMSB7XG4gICAgbWFyZ2luLXRvcDogMDtcbiAgfVxuYDtcblxuY29uc3QgSWxsdXN0cmF0aW9uV3JhcHBlciA9IHN0eWxlZChcImRpdlwiKWBcbiAgbWFyZ2luLWJvdHRvbTogJHtzcGFjaW5nLm5vcm1hbH07XG4gIEBtZWRpYSAobWluLXdpZHRoOiAke2JyZWFrcG9pbnRzLnRhYmxldH0pIHtcbiAgICBtYXJnaW4tdG9wOiAke3NwYWNpbmcubGFyZ2V9O1xuICB9XG5gO1xuXG5jb25zdCBEZXNjcmlwdGlvbiA9IHN0eWxlZChcInBcIilgXG4gIG1hcmdpbi1ib3R0b206ICR7c3BhY2luZy5ub3JtYWx9O1xuICBAbWVkaWEgKG1pbi13aWR0aDogJHticmVha3BvaW50cy50YWJsZXR9KSB7XG4gICAgbWFyZ2luLWJvdHRvbTogJHtzcGFjaW5nLmxhcmdlfTtcbiAgfVxuYDtcblxuY29uc3QgQ3VzdG9tRWxlbWVudFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBtYXJnaW46ICR7c3BhY2luZy5sYXJnZX0gMDtcbmA7XG5cbmNvbnN0IE1lc3NhZ2VXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgbWFyZ2luLXRvcDogJHtzcGFjaW5nLnhzbWFsbH07XG5gO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICBtZXNzYWdlczoge1xuICAgIHRpdGxlOiBzdHJpbmc7XG4gICAgZGVzY3JpcHRpb24/OiBzdHJpbmc7XG4gICAgbGlua3NUaXRsZT86IHN0cmluZztcbiAgICBiYWNrPzogc3RyaW5nO1xuICAgIGdvVG9Gcm9udFBhZ2U/OiBzdHJpbmc7XG4gICAgbG9nSW5GYWlsZWQ/OiBzdHJpbmc7XG4gIH07XG4gIGlsbHVzdHJhdGlvbj86IHtcbiAgICB1cmw6IHN0cmluZztcbiAgICBhbHRUZXh0OiBzdHJpbmc7XG4gIH07XG4gIGlsbHVzdHJhdGlvbkVsZW1lbnQ/OiBSZWFjdE5vZGU7XG4gIGN1c3RvbUVsZW1lbnQ/OiBSZWFjdE5vZGU7XG4gIGNoaWxkcmVuPzogUmVhY3ROb2RlO1xufVxuZXhwb3J0IGNvbnN0IEVycm9yTWVzc2FnZSA9ICh7IGNoaWxkcmVuLCBtZXNzYWdlcywgaWxsdXN0cmF0aW9uLCBpbGx1c3RyYXRpb25FbGVtZW50LCBjdXN0b21FbGVtZW50IH06IFByb3BzKSA9PiAoXG4gIDxTdHlsZWRFcnJvck1lc3NhZ2U+XG4gICAge2lsbHVzdHJhdGlvbiAmJiAoXG4gICAgICA8SWxsdXN0cmF0aW9uV3JhcHBlcj5cbiAgICAgICAgPGltZyBzcmM9e2lsbHVzdHJhdGlvbi51cmx9IGFsdD17aWxsdXN0cmF0aW9uLmFsdFRleHR9IC8+XG4gICAgICA8L0lsbHVzdHJhdGlvbldyYXBwZXI+XG4gICAgKX1cbiAgICB7aWxsdXN0cmF0aW9uRWxlbWVudCAmJiA8SWxsdXN0cmF0aW9uV3JhcHBlcj57aWxsdXN0cmF0aW9uRWxlbWVudH08L0lsbHVzdHJhdGlvbldyYXBwZXI+fVxuICAgIDxoMT57bWVzc2FnZXMudGl0bGV9PC9oMT5cbiAgICB7bWVzc2FnZXMuZGVzY3JpcHRpb24gJiYgPERlc2NyaXB0aW9uPnttZXNzYWdlcy5kZXNjcmlwdGlvbn08L0Rlc2NyaXB0aW9uPn1cbiAgICB7Y3VzdG9tRWxlbWVudCAmJiA8Q3VzdG9tRWxlbWVudFdyYXBwZXI+e2N1c3RvbUVsZW1lbnR9PC9DdXN0b21FbGVtZW50V3JhcHBlcj59XG4gICAge21lc3NhZ2VzLmxpbmtzVGl0bGUgJiYgPGgyPnttZXNzYWdlcy5saW5rc1RpdGxlfTwvaDI+fVxuICAgIHttZXNzYWdlcy5iYWNrICYmIChcbiAgICAgIDxTYWZlTGluayB0bz17YC8jJHtlbmNvZGVVUkkobWVzc2FnZXMuYmFjayl9YH0gb25DbGljaz17KCkgPT4gd2luZG93Lmhpc3RvcnkuYmFjaygpfT5cbiAgICAgICAge21lc3NhZ2VzLmJhY2t9XG4gICAgICA8L1NhZmVMaW5rPlxuICAgICl9XG4gICAge21lc3NhZ2VzLmdvVG9Gcm9udFBhZ2UgJiYgKFxuICAgICAgPE1lc3NhZ2VXcmFwcGVyPlxuICAgICAgICA8U2FmZUxpbmsgdG89XCIvXCI+e21lc3NhZ2VzLmdvVG9Gcm9udFBhZ2V9PC9TYWZlTGluaz5cbiAgICAgIDwvTWVzc2FnZVdyYXBwZXI+XG4gICAgKX1cbiAgICB7bWVzc2FnZXMubG9nSW5GYWlsZWQgJiYgKFxuICAgICAgPE1lc3NhZ2VXcmFwcGVyPlxuICAgICAgICA8U2FmZUxpbmsgdG89XCIvbWlubmRsYVwiPnttZXNzYWdlcy5sb2dJbkZhaWxlZH08L1NhZmVMaW5rPlxuICAgICAgPC9NZXNzYWdlV3JhcHBlcj5cbiAgICApfVxuICAgIHtjaGlsZHJlbn1cbiAgPC9TdHlsZWRFcnJvck1lc3NhZ2U+XG4pO1xuXG5leHBvcnQgZGVmYXVsdCBFcnJvck1lc3NhZ2U7XG4iXX0= */"));
-const CustomElementWrapper = /*#__PURE__*/_styled("div", {
-  target: "e1n5vqts1",
-  label: "CustomElementWrapper"
-})("margin:", spacing.large, " 0;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkVycm9yTWVzc2FnZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBc0N1QyIsImZpbGUiOiJFcnJvck1lc3NhZ2UudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMTktcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG5pbXBvcnQgeyBSZWFjdE5vZGUgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgY29sb3JzLCBzcGFjaW5nLCBicmVha3BvaW50cyB9IGZyb20gXCJAbmRsYS9jb3JlXCI7XG5pbXBvcnQgeyBTYWZlTGluayB9IGZyb20gXCJAbmRsYS9zYWZlbGlua1wiO1xuXG5jb25zdCBTdHlsZWRFcnJvck1lc3NhZ2UgPSBzdHlsZWQuYXJ0aWNsZWBcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xuICBhIHtcbiAgICBjb2xvcjogJHtjb2xvcnMuYnJhbmQucHJpbWFyeX07XG4gIH1cblxuICBoMSB7XG4gICAgbWFyZ2luLXRvcDogMDtcbiAgfVxuYDtcblxuY29uc3QgSWxsdXN0cmF0aW9uV3JhcHBlciA9IHN0eWxlZChcImRpdlwiKWBcbiAgbWFyZ2luLWJvdHRvbTogJHtzcGFjaW5nLm5vcm1hbH07XG4gIEBtZWRpYSAobWluLXdpZHRoOiAke2JyZWFrcG9pbnRzLnRhYmxldH0pIHtcbiAgICBtYXJnaW4tdG9wOiAke3NwYWNpbmcubGFyZ2V9O1xuICB9XG5gO1xuXG5jb25zdCBEZXNjcmlwdGlvbiA9IHN0eWxlZChcInBcIilgXG4gIG1hcmdpbi1ib3R0b206ICR7c3BhY2luZy5ub3JtYWx9O1xuICBAbWVkaWEgKG1pbi13aWR0aDogJHticmVha3BvaW50cy50YWJsZXR9KSB7XG4gICAgbWFyZ2luLWJvdHRvbTogJHtzcGFjaW5nLmxhcmdlfTtcbiAgfVxuYDtcblxuY29uc3QgQ3VzdG9tRWxlbWVudFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBtYXJnaW46ICR7c3BhY2luZy5sYXJnZX0gMDtcbmA7XG5cbmNvbnN0IE1lc3NhZ2VXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgbWFyZ2luLXRvcDogJHtzcGFjaW5nLnhzbWFsbH07XG5gO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICBtZXNzYWdlczoge1xuICAgIHRpdGxlOiBzdHJpbmc7XG4gICAgZGVzY3JpcHRpb24/OiBzdHJpbmc7XG4gICAgbGlua3NUaXRsZT86IHN0cmluZztcbiAgICBiYWNrPzogc3RyaW5nO1xuICAgIGdvVG9Gcm9udFBhZ2U/OiBzdHJpbmc7XG4gICAgbG9nSW5GYWlsZWQ/OiBzdHJpbmc7XG4gIH07XG4gIGlsbHVzdHJhdGlvbj86IHtcbiAgICB1cmw6IHN0cmluZztcbiAgICBhbHRUZXh0OiBzdHJpbmc7XG4gIH07XG4gIGlsbHVzdHJhdGlvbkVsZW1lbnQ/OiBSZWFjdE5vZGU7XG4gIGN1c3RvbUVsZW1lbnQ/OiBSZWFjdE5vZGU7XG4gIGNoaWxkcmVuPzogUmVhY3ROb2RlO1xufVxuZXhwb3J0IGNvbnN0IEVycm9yTWVzc2FnZSA9ICh7IGNoaWxkcmVuLCBtZXNzYWdlcywgaWxsdXN0cmF0aW9uLCBpbGx1c3RyYXRpb25FbGVtZW50LCBjdXN0b21FbGVtZW50IH06IFByb3BzKSA9PiAoXG4gIDxTdHlsZWRFcnJvck1lc3NhZ2U+XG4gICAge2lsbHVzdHJhdGlvbiAmJiAoXG4gICAgICA8SWxsdXN0cmF0aW9uV3JhcHBlcj5cbiAgICAgICAgPGltZyBzcmM9e2lsbHVzdHJhdGlvbi51cmx9IGFsdD17aWxsdXN0cmF0aW9uLmFsdFRleHR9IC8+XG4gICAgICA8L0lsbHVzdHJhdGlvbldyYXBwZXI+XG4gICAgKX1cbiAgICB7aWxsdXN0cmF0aW9uRWxlbWVudCAmJiA8SWxsdXN0cmF0aW9uV3JhcHBlcj57aWxsdXN0cmF0aW9uRWxlbWVudH08L0lsbHVzdHJhdGlvbldyYXBwZXI+fVxuICAgIDxoMT57bWVzc2FnZXMudGl0bGV9PC9oMT5cbiAgICB7bWVzc2FnZXMuZGVzY3JpcHRpb24gJiYgPERlc2NyaXB0aW9uPnttZXNzYWdlcy5kZXNjcmlwdGlvbn08L0Rlc2NyaXB0aW9uPn1cbiAgICB7Y3VzdG9tRWxlbWVudCAmJiA8Q3VzdG9tRWxlbWVudFdyYXBwZXI+e2N1c3RvbUVsZW1lbnR9PC9DdXN0b21FbGVtZW50V3JhcHBlcj59XG4gICAge21lc3NhZ2VzLmxpbmtzVGl0bGUgJiYgPGgyPnttZXNzYWdlcy5saW5rc1RpdGxlfTwvaDI+fVxuICAgIHttZXNzYWdlcy5iYWNrICYmIChcbiAgICAgIDxTYWZlTGluayB0bz17YC8jJHtlbmNvZGVVUkkobWVzc2FnZXMuYmFjayl9YH0gb25DbGljaz17KCkgPT4gd2luZG93Lmhpc3RvcnkuYmFjaygpfT5cbiAgICAgICAge21lc3NhZ2VzLmJhY2t9XG4gICAgICA8L1NhZmVMaW5rPlxuICAgICl9XG4gICAge21lc3NhZ2VzLmdvVG9Gcm9udFBhZ2UgJiYgKFxuICAgICAgPE1lc3NhZ2VXcmFwcGVyPlxuICAgICAgICA8U2FmZUxpbmsgdG89XCIvXCI+e21lc3NhZ2VzLmdvVG9Gcm9udFBhZ2V9PC9TYWZlTGluaz5cbiAgICAgIDwvTWVzc2FnZVdyYXBwZXI+XG4gICAgKX1cbiAgICB7bWVzc2FnZXMubG9nSW5GYWlsZWQgJiYgKFxuICAgICAgPE1lc3NhZ2VXcmFwcGVyPlxuICAgICAgICA8U2FmZUxpbmsgdG89XCIvbWlubmRsYVwiPnttZXNzYWdlcy5sb2dJbkZhaWxlZH08L1NhZmVMaW5rPlxuICAgICAgPC9NZXNzYWdlV3JhcHBlcj5cbiAgICApfVxuICAgIHtjaGlsZHJlbn1cbiAgPC9TdHlsZWRFcnJvck1lc3NhZ2U+XG4pO1xuXG5leHBvcnQgZGVmYXVsdCBFcnJvck1lc3NhZ2U7XG4iXX0= */"));
-const MessageWrapper = /*#__PURE__*/_styled("div", {
-  target: "e1n5vqts0",
-  label: "MessageWrapper"
-})("margin-top:", spacing.xsmall, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkVycm9yTWVzc2FnZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBMENpQyIsImZpbGUiOiJFcnJvck1lc3NhZ2UudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMTktcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG5pbXBvcnQgeyBSZWFjdE5vZGUgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgY29sb3JzLCBzcGFjaW5nLCBicmVha3BvaW50cyB9IGZyb20gXCJAbmRsYS9jb3JlXCI7XG5pbXBvcnQgeyBTYWZlTGluayB9IGZyb20gXCJAbmRsYS9zYWZlbGlua1wiO1xuXG5jb25zdCBTdHlsZWRFcnJvck1lc3NhZ2UgPSBzdHlsZWQuYXJ0aWNsZWBcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xuICBhIHtcbiAgICBjb2xvcjogJHtjb2xvcnMuYnJhbmQucHJpbWFyeX07XG4gIH1cblxuICBoMSB7XG4gICAgbWFyZ2luLXRvcDogMDtcbiAgfVxuYDtcblxuY29uc3QgSWxsdXN0cmF0aW9uV3JhcHBlciA9IHN0eWxlZChcImRpdlwiKWBcbiAgbWFyZ2luLWJvdHRvbTogJHtzcGFjaW5nLm5vcm1hbH07XG4gIEBtZWRpYSAobWluLXdpZHRoOiAke2JyZWFrcG9pbnRzLnRhYmxldH0pIHtcbiAgICBtYXJnaW4tdG9wOiAke3NwYWNpbmcubGFyZ2V9O1xuICB9XG5gO1xuXG5jb25zdCBEZXNjcmlwdGlvbiA9IHN0eWxlZChcInBcIilgXG4gIG1hcmdpbi1ib3R0b206ICR7c3BhY2luZy5ub3JtYWx9O1xuICBAbWVkaWEgKG1pbi13aWR0aDogJHticmVha3BvaW50cy50YWJsZXR9KSB7XG4gICAgbWFyZ2luLWJvdHRvbTogJHtzcGFjaW5nLmxhcmdlfTtcbiAgfVxuYDtcblxuY29uc3QgQ3VzdG9tRWxlbWVudFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBtYXJnaW46ICR7c3BhY2luZy5sYXJnZX0gMDtcbmA7XG5cbmNvbnN0IE1lc3NhZ2VXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgbWFyZ2luLXRvcDogJHtzcGFjaW5nLnhzbWFsbH07XG5gO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICBtZXNzYWdlczoge1xuICAgIHRpdGxlOiBzdHJpbmc7XG4gICAgZGVzY3JpcHRpb24/OiBzdHJpbmc7XG4gICAgbGlua3NUaXRsZT86IHN0cmluZztcbiAgICBiYWNrPzogc3RyaW5nO1xuICAgIGdvVG9Gcm9udFBhZ2U/OiBzdHJpbmc7XG4gICAgbG9nSW5GYWlsZWQ/OiBzdHJpbmc7XG4gIH07XG4gIGlsbHVzdHJhdGlvbj86IHtcbiAgICB1cmw6IHN0cmluZztcbiAgICBhbHRUZXh0OiBzdHJpbmc7XG4gIH07XG4gIGlsbHVzdHJhdGlvbkVsZW1lbnQ/OiBSZWFjdE5vZGU7XG4gIGN1c3RvbUVsZW1lbnQ/OiBSZWFjdE5vZGU7XG4gIGNoaWxkcmVuPzogUmVhY3ROb2RlO1xufVxuZXhwb3J0IGNvbnN0IEVycm9yTWVzc2FnZSA9ICh7IGNoaWxkcmVuLCBtZXNzYWdlcywgaWxsdXN0cmF0aW9uLCBpbGx1c3RyYXRpb25FbGVtZW50LCBjdXN0b21FbGVtZW50IH06IFByb3BzKSA9PiAoXG4gIDxTdHlsZWRFcnJvck1lc3NhZ2U+XG4gICAge2lsbHVzdHJhdGlvbiAmJiAoXG4gICAgICA8SWxsdXN0cmF0aW9uV3JhcHBlcj5cbiAgICAgICAgPGltZyBzcmM9e2lsbHVzdHJhdGlvbi51cmx9IGFsdD17aWxsdXN0cmF0aW9uLmFsdFRleHR9IC8+XG4gICAgICA8L0lsbHVzdHJhdGlvbldyYXBwZXI+XG4gICAgKX1cbiAgICB7aWxsdXN0cmF0aW9uRWxlbWVudCAmJiA8SWxsdXN0cmF0aW9uV3JhcHBlcj57aWxsdXN0cmF0aW9uRWxlbWVudH08L0lsbHVzdHJhdGlvbldyYXBwZXI+fVxuICAgIDxoMT57bWVzc2FnZXMudGl0bGV9PC9oMT5cbiAgICB7bWVzc2FnZXMuZGVzY3JpcHRpb24gJiYgPERlc2NyaXB0aW9uPnttZXNzYWdlcy5kZXNjcmlwdGlvbn08L0Rlc2NyaXB0aW9uPn1cbiAgICB7Y3VzdG9tRWxlbWVudCAmJiA8Q3VzdG9tRWxlbWVudFdyYXBwZXI+e2N1c3RvbUVsZW1lbnR9PC9DdXN0b21FbGVtZW50V3JhcHBlcj59XG4gICAge21lc3NhZ2VzLmxpbmtzVGl0bGUgJiYgPGgyPnttZXNzYWdlcy5saW5rc1RpdGxlfTwvaDI+fVxuICAgIHttZXNzYWdlcy5iYWNrICYmIChcbiAgICAgIDxTYWZlTGluayB0bz17YC8jJHtlbmNvZGVVUkkobWVzc2FnZXMuYmFjayl9YH0gb25DbGljaz17KCkgPT4gd2luZG93Lmhpc3RvcnkuYmFjaygpfT5cbiAgICAgICAge21lc3NhZ2VzLmJhY2t9XG4gICAgICA8L1NhZmVMaW5rPlxuICAgICl9XG4gICAge21lc3NhZ2VzLmdvVG9Gcm9udFBhZ2UgJiYgKFxuICAgICAgPE1lc3NhZ2VXcmFwcGVyPlxuICAgICAgICA8U2FmZUxpbmsgdG89XCIvXCI+e21lc3NhZ2VzLmdvVG9Gcm9udFBhZ2V9PC9TYWZlTGluaz5cbiAgICAgIDwvTWVzc2FnZVdyYXBwZXI+XG4gICAgKX1cbiAgICB7bWVzc2FnZXMubG9nSW5GYWlsZWQgJiYgKFxuICAgICAgPE1lc3NhZ2VXcmFwcGVyPlxuICAgICAgICA8U2FmZUxpbmsgdG89XCIvbWlubmRsYVwiPnttZXNzYWdlcy5sb2dJbkZhaWxlZH08L1NhZmVMaW5rPlxuICAgICAgPC9NZXNzYWdlV3JhcHBlcj5cbiAgICApfVxuICAgIHtjaGlsZHJlbn1cbiAgPC9TdHlsZWRFcnJvck1lc3NhZ2U+XG4pO1xuXG5leHBvcnQgZGVmYXVsdCBFcnJvck1lc3NhZ2U7XG4iXX0= */"));
+const StyledErrorMessage = styled("article", {
+  base: {
+    textAlign: "center",
+    "& a": {
+      color: "text.strong"
+    },
+    "& h1": {
+      marginTop: "0"
+    }
+  }
+});
+const IllustrationWrapper = styled("div", {
+  base: {
+    marginBottom: "medium",
+    tablet: {
+      marginTop: "xxlarge"
+    }
+  }
+});
+const Description = styled(Text, {
+  base: {
+    marginBottom: "medium",
+    tablet: {
+      marginBottom: "xxlarge"
+    }
+  }
+});
+const CustomElementWrapper = styled("div", {
+  base: {
+    marginBlock: "xxlarge"
+  }
+});
+const MessageWrapper = styled("div", {
+  base: {
+    marginTop: "3xsmall"
+  }
+});
 export const ErrorMessage = _ref => {
   let {
     children,

package/es/ErrorMessage/ErrorResourceAccessDenied.js

@@ -1,4 +1,3 @@
-import _styled from "@emotion/styled/base";
 /**
  * Copyright (c) 2021-present, NDLA.
  *
@@ -9,14 +8,17 @@ import _styled from "@emotion/styled/base";
 
 import { useTranslation } from "react-i18next";
 import { ButtonV2 } from "@ndla/button";
-import { spacing } from "@ndla/core";
 import { HumanMaleBoard, LogIn } from "@ndla/icons/common";
+import { styled } from "@ndla/styled-system/jsx";
 import ErrorMessage from "./ErrorMessage";
+
+// TODO: This has not been redesignet yet. This is just a rewrite of the previous design in panda
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-const StyledLogInIconWrapper = /*#__PURE__*/_styled("span", {
-  target: "e1a7kjll0",
-  label: "StyledLogInIconWrapper"
-})("margin-left:", spacing.xsmall, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkVycm9yUmVzb3VyY2VBY2Nlc3NEZW5pZWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWdCMEMiLCJmaWxlIjoiRXJyb3JSZXNvdXJjZUFjY2Vzc0RlbmllZC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMS1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSBcInJlYWN0LWkxOG5leHRcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgQnV0dG9uVjIgfSBmcm9tIFwiQG5kbGEvYnV0dG9uXCI7XG5pbXBvcnQgeyBzcGFjaW5nIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IEh1bWFuTWFsZUJvYXJkLCBMb2dJbiB9IGZyb20gXCJAbmRsYS9pY29ucy9jb21tb25cIjtcblxuaW1wb3J0IEVycm9yTWVzc2FnZSBmcm9tIFwiLi9FcnJvck1lc3NhZ2VcIjtcblxuY29uc3QgU3R5bGVkTG9nSW5JY29uV3JhcHBlciA9IHN0eWxlZC5zcGFuYFxuICBtYXJnaW4tbGVmdDogJHtzcGFjaW5nLnhzbWFsbH07XG5gO1xuXG50eXBlIFByb3BzID0ge1xuICBvbkF1dGhlbnRpY2F0ZUNsaWNrOiAoKSA9PiB2b2lkO1xufTtcbmNvbnN0IEVycm9yUmVzb3VyY2VBY2Nlc3NEZW5pZWQgPSAoeyBvbkF1dGhlbnRpY2F0ZUNsaWNrIH06IFByb3BzKSA9PiB7XG4gIGNvbnN0IHsgdCB9ID0gdXNlVHJhbnNsYXRpb24oKTtcbiAgcmV0dXJuIChcbiAgICA8RXJyb3JNZXNzYWdlXG4gICAgICBtZXNzYWdlcz17e1xuICAgICAgICB0aXRsZTogdChcInVzZXIucmVzb3VyY2UuYWNjZXNzRGVuaWVkXCIpLFxuICAgICAgICBiYWNrOiB0KFwiZXJyb3JNZXNzYWdlLmJhY2tcIiksXG4gICAgICAgIGdvVG9Gcm9udFBhZ2U6IHQoXCJlcnJvck1lc3NhZ2UuZ29Ub0Zyb250UGFnZVwiKSxcbiAgICAgIH19XG4gICAgICBpbGx1c3RyYXRpb25FbGVtZW50PXs8SHVtYW5NYWxlQm9hcmQgc2l6ZT1cIm1lZGl1bVwiIC8+fVxuICAgICAgY3VzdG9tRWxlbWVudD17XG4gICAgICAgIDxCdXR0b25WMiBzaXplPVwibWVkaXVtXCIgb25DbGljaz17b25BdXRoZW50aWNhdGVDbGlja30+XG4gICAgICAgICAge3QoXCJ1c2VyLmJ1dHRvbkxvZ0luXCIpfVxuICAgICAgICAgIDxTdHlsZWRMb2dJbkljb25XcmFwcGVyIGFyaWEtaGlkZGVuPlxuICAgICAgICAgICAgPExvZ0luIHNpemU9XCJtZWRpdW1cIiAvPlxuICAgICAgICAgIDwvU3R5bGVkTG9nSW5JY29uV3JhcHBlcj5cbiAgICAgICAgPC9CdXR0b25WMj5cbiAgICAgIH1cbiAgICAvPlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgRXJyb3JSZXNvdXJjZUFjY2Vzc0RlbmllZDtcbiJdfQ== */"));
+const StyledLogInIconWrapper = styled("span", {
+  base: {
+    marginLeft: "3xsmall"
+  }
+});
 const ErrorResourceAccessDenied = _ref => {
   let {
     onAuthenticateClick

package/es/FactBox/FactBox.js

@@ -1,5 +1,3 @@
-import _styled from "@emotion/styled/base";
-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) 2016-present, NDLA.
  *
@@ -8,40 +6,99 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
  *
  */
 
-/** @jsxImportSource @emotion/react */
-import { forwardRef, useCallback, useEffect, useState } from "react";
+import { forwardRef, useCallback, useEffect, useId, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { css } from "@emotion/react";
-import { IconButtonV2 } from "@ndla/button";
-import { breakpoints, colors, mq, spacing, stackOrder } from "@ndla/core";
-import { ChevronDown, ChevronUp } from "@ndla/icons/common";
+import { ChevronDown } from "@ndla/icons/common";
+import { IconButton } from "@ndla/primitives";
+import { styled } from "@ndla/styled-system/jsx";
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-const StyledAside = /*#__PURE__*/_styled("aside", {
-  target: "el037bs2",
-  label: "StyledAside"
-})("display:flex;flex-direction:column;align-items:center;position:relative;z-index:", stackOrder.offsetSingle, ";margin:", spacing.large, " 0 calc(", spacing.large, " - ", spacing.nsmall, ") 0;overflow:hidden;padding-bottom:", spacing.nsmall, ";@media print{overflow:visible;}h2:first-of-type{border-bottom:2px solid ", colors.brand.primary, ";margin-top:0;margin-bottom:", spacing.normal, ";}h2,h3,h4,h5{display:block;margin-top:", spacing.normal, ";margin-bottom:", spacing.small, ";border-bottom:1px solid ", colors.brand.light, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZhY3RCb3gudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXdCZ0MiLCJmaWxlIjoiRmFjdEJveC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxNi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgeyBDb21wb25lbnRQcm9wcywgUmVhY3ROb2RlLCBmb3J3YXJkUmVmLCB1c2VDYWxsYmFjaywgdXNlRWZmZWN0LCB1c2VTdGF0ZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tIFwicmVhY3QtaTE4bmV4dFwiO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb25CdXR0b25WMiB9IGZyb20gXCJAbmRsYS9idXR0b25cIjtcbmltcG9ydCB7IGJyZWFrcG9pbnRzLCBjb2xvcnMsIG1xLCBzcGFjaW5nLCBzdGFja09yZGVyIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IENoZXZyb25Eb3duLCBDaGV2cm9uVXAgfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5cbmludGVyZmFjZSBQcm9wcyBleHRlbmRzIENvbXBvbmVudFByb3BzPFwiYXNpZGVcIj4ge1xuICBjaGlsZHJlbj86IFJlYWN0Tm9kZTtcbiAgZGVmYXVsdE9wZW4/OiBib29sZWFuO1xuICBvcGVuPzogYm9vbGVhbjtcbiAgb25PcGVuQ2hhbmdlPzogKG9wZW46IGJvb2xlYW4pID0+IHZvaWQ7XG59XG5cbmNvbnN0IFN0eWxlZEFzaWRlID0gc3R5bGVkLmFzaWRlYFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIHotaW5kZXg6ICR7c3RhY2tPcmRlci5vZmZzZXRTaW5nbGV9O1xuICBtYXJnaW46ICR7c3BhY2luZy5sYXJnZX0gMCBjYWxjKCR7c3BhY2luZy5sYXJnZX0gLSAke3NwYWNpbmcubnNtYWxsfSkgMDtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgcGFkZGluZy1ib3R0b206ICR7c3BhY2luZy5uc21hbGx9O1xuXG4gIEBtZWRpYSBwcmludCB7XG4gICAgb3ZlcmZsb3c6IHZpc2libGU7XG4gIH1cblxuICBoMjpmaXJzdC1vZi10eXBlIHtcbiAgICBib3JkZXItYm90dG9tOiAycHggc29saWQgJHtjb2xvcnMuYnJhbmQucHJpbWFyeX07XG4gICAgbWFyZ2luLXRvcDogMDtcbiAgICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgfVxuXG4gIGgyLFxuICBoMyxcbiAgaDQsXG4gIGg1IHtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgICBtYXJnaW4tdG9wOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcuc21hbGx9O1xuICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAke2NvbG9ycy5icmFuZC5saWdodH07XG4gIH1cbmA7XG5cbmNvbnN0IFN0eWxlZERpdiA9IHN0eWxlZC5kaXZgXG4gIHdpZHRoOiAxMDAlO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGNvbG9yOiAke2NvbG9ycy5icmFuZC5ncmV5RGFya307XG4gIHBhZGRpbmc6ICR7c3BhY2luZy5ub3JtYWx9ICR7c3BhY2luZy5ub3JtYWx9ICR7c3BhY2luZy5sYXJnZX07XG4gIGJvcmRlcjogMXB4IHNvbGlkICR7Y29sb3JzLmJyYW5kLmdyZXlMaWdodH07XG4gIG1heC1oZWlnaHQ6IDE5MHB4O1xuICB0cmFuc2l0aW9uOiBtYXgtaGVpZ2h0IDAuNnMgZWFzZS1pbi1vdXQ7XG4gIG92ZXJmbG93OiBoaWRkZW47XG5cbiAgJjphZnRlciB7XG4gICAgY29udGVudDogXCJcIjtcbiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIHRvcDogMDtcbiAgICBib3R0b206IDA7XG4gICAgcmlnaHQ6IDA7XG4gICAgd2lkdGg6IDk5JTtcbiAgICBtYXJnaW46IDAuNSUgMC41JSAwIDAuNSU7XG4gICAgdHJhbnNpdGlvbjogb3BhY2l0eSAwLjVzIGN1YmljLWJlemllcigwLjc0LCAtMC4wNCwgMC45NiwgMC45Nyk7XG4gICAgLyogVGhlIDAwIGFmdGVyIG91ciBjb2xvciBpcyB0byBzZXQgaXRzIG9wYWNpdHkgdG8gMCAqL1xuICAgIGJhY2tncm91bmQ6IGxpbmVhci1ncmFkaWVudCgke2NvbG9ycy5icmFuZC5saWdodH0wMCwgJHtjb2xvcnMud2hpdGV9KTtcbiAgICBvcGFjaXR5OiAxO1xuICAgIHotaW5kZXg6ICR7c3RhY2tPcmRlci5iYXNlfTtcbiAgfVxuXG4gIEBtZWRpYSBwcmludCB7XG4gICAgbWF4LWhlaWdodDogcmV2ZXJ0O1xuICAgICY6YWZ0ZXIge1xuICAgICAgZGlzcGxheTogbm9uZTtcbiAgICB9XG4gIH1cblxuICAmID4gdWw6bm90KFtjbGFzc10pLFxuICA6bm90KGxpKSA+IHVsOm5vdChbY2xhc3NdKSB7XG4gICAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLmRlc2t0b3AgfSl9IHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAke3NwYWNpbmcubm9ybWFsfTtcbiAgICB9XG4gIH1cblxuICAmID4gb2w6bm90KFtjbGFzc10pLFxuICA6bm90KGxpKSA+IG9sOm5vdChbY2xhc3NdKSB7XG4gICAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLmRlc2t0b3AgfSl9IHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAke3NwYWNpbmcubGFyZ2V9O1xuICAgIH1cbiAgfVxuYDtcblxuY29uc3QgU3R5bGVkSWNvbkJ1dHRvbiA9IHN0eWxlZChJY29uQnV0dG9uVjIpYFxuICBtYXJnaW4tdG9wOiAtMjBweDtcbiAgei1pbmRleDogJHtzdGFja09yZGVyLm9mZnNldFNpbmdsZX07XG5cbiAgQG1lZGlhIHByaW50IHtcbiAgICBkaXNwbGF5OiBub25lO1xuICB9XG5gO1xuXG5jb25zdCBleHBhbmRlZFN0eWxlID0gY3NzYFxuICBtYXgtaGVpZ2h0OiA1MDB2aDtcbmA7XG5cbmNvbnN0IGV4cGFuZGVkQ29udGVudFN0eWxlID0gY3NzYFxuICBtYXgtaGVpZ2h0OiA1MDB2aDtcbiAgJjphZnRlciB7XG4gICAgb3BhY2l0eTogMDtcbiAgICB6LWluZGV4OiAke3N0YWNrT3JkZXIuaGlkZX07XG4gIH1cbmA7XG5cbmNvbnN0IEZhY3RCb3ggPSBmb3J3YXJkUmVmPEhUTUxFbGVtZW50LCBQcm9wcz4oXG4gICh7IGNoaWxkcmVuLCBvcGVuLCBvbk9wZW5DaGFuZ2UsIGRlZmF1bHRPcGVuID0gZmFsc2UsIC4uLnJlc3QgfSwgcmVmKSA9PiB7XG4gICAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICAgIGNvbnN0IFtpc09wZW4sIHNldElzT3Blbl0gPSB1c2VTdGF0ZShkZWZhdWx0T3Blbik7XG5cbiAgICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgICAgaWYgKG9wZW4gIT09IHVuZGVmaW5lZCkge1xuICAgICAgICBzZXRJc09wZW4ob3Blbik7XG4gICAgICB9XG4gICAgfSwgW29wZW5dKTtcblxuICAgIGNvbnN0IG9uQ2xpY2sgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgICBjb25zdCBuZXdPcGVuID0gIWlzT3BlbjtcbiAgICAgIHNldElzT3BlbihuZXdPcGVuKTtcbiAgICAgIG9uT3BlbkNoYW5nZT8uKG5ld09wZW4pO1xuICAgIH0sIFtpc09wZW4sIG9uT3BlbkNoYW5nZV0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgIDxTdHlsZWRBc2lkZSB7Li4ucmVzdH0gY3NzPXtbaXNPcGVuID8gZXhwYW5kZWRTdHlsZSA6IHVuZGVmaW5lZF19IHJlZj17cmVmfT5cbiAgICAgICAgPFN0eWxlZERpdiBjc3M9e2lzT3BlbiA/IGV4cGFuZGVkQ29udGVudFN0eWxlIDogdW5kZWZpbmVkfT57Y2hpbGRyZW59PC9TdHlsZWREaXY+XG4gICAgICAgIDxTdHlsZWRJY29uQnV0dG9uIG9uQ2xpY2s9e29uQ2xpY2t9IGFyaWEtbGFiZWw9e3QoYGZhY3Rib3guJHtpc09wZW4gPyBcImNsb3NlXCIgOiBcIm9wZW5cIn1gKX0+XG4gICAgICAgICAge2lzT3BlbiA/IDxDaGV2cm9uVXAgLz4gOiA8Q2hldnJvbkRvd24gLz59XG4gICAgICAgIDwvU3R5bGVkSWNvbkJ1dHRvbj5cbiAgICAgIDwvU3R5bGVkQXNpZGU+XG4gICAgKTtcbiAgfSxcbik7XG5cbmV4cG9ydCBkZWZhdWx0IEZhY3RCb3g7XG4iXX0= */"));
-const StyledDiv = /*#__PURE__*/_styled("div", {
-  target: "el037bs1",
-  label: "StyledDiv"
-})("width:100%;position:relative;color:", colors.brand.greyDark, ";padding:", spacing.normal, " ", spacing.normal, " ", spacing.large, ";border:1px solid ", colors.brand.greyLight, ";max-height:190px;transition:max-height 0.6s ease-in-out;overflow:hidden;&:after{content:\"\";text-align:center;position:absolute;top:0;bottom:0;right:0;width:99%;margin:0.5% 0.5% 0 0.5%;transition:opacity 0.5s cubic-bezier(0.74, -0.04, 0.96, 0.97);background:linear-gradient(", colors.brand.light, "00, ", colors.white, ");opacity:1;z-index:", stackOrder.base, ";}@media print{max-height:revert;&:after{display:none;}}&>ul:not([class]),:not(li)>ul:not([class]){", mq.range({
-  from: breakpoints.desktop
-}), "{margin-left:", spacing.normal, ";}}&>ol:not([class]),:not(li)>ol:not([class]){", mq.range({
-  from: breakpoints.desktop
-}), "{margin-left:", spacing.large, ";}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZhY3RCb3gudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXVENEIiLCJmaWxlIjoiRmFjdEJveC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxNi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgeyBDb21wb25lbnRQcm9wcywgUmVhY3ROb2RlLCBmb3J3YXJkUmVmLCB1c2VDYWxsYmFjaywgdXNlRWZmZWN0LCB1c2VTdGF0ZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tIFwicmVhY3QtaTE4bmV4dFwiO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb25CdXR0b25WMiB9IGZyb20gXCJAbmRsYS9idXR0b25cIjtcbmltcG9ydCB7IGJyZWFrcG9pbnRzLCBjb2xvcnMsIG1xLCBzcGFjaW5nLCBzdGFja09yZGVyIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IENoZXZyb25Eb3duLCBDaGV2cm9uVXAgfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5cbmludGVyZmFjZSBQcm9wcyBleHRlbmRzIENvbXBvbmVudFByb3BzPFwiYXNpZGVcIj4ge1xuICBjaGlsZHJlbj86IFJlYWN0Tm9kZTtcbiAgZGVmYXVsdE9wZW4/OiBib29sZWFuO1xuICBvcGVuPzogYm9vbGVhbjtcbiAgb25PcGVuQ2hhbmdlPzogKG9wZW46IGJvb2xlYW4pID0+IHZvaWQ7XG59XG5cbmNvbnN0IFN0eWxlZEFzaWRlID0gc3R5bGVkLmFzaWRlYFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIHotaW5kZXg6ICR7c3RhY2tPcmRlci5vZmZzZXRTaW5nbGV9O1xuICBtYXJnaW46ICR7c3BhY2luZy5sYXJnZX0gMCBjYWxjKCR7c3BhY2luZy5sYXJnZX0gLSAke3NwYWNpbmcubnNtYWxsfSkgMDtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgcGFkZGluZy1ib3R0b206ICR7c3BhY2luZy5uc21hbGx9O1xuXG4gIEBtZWRpYSBwcmludCB7XG4gICAgb3ZlcmZsb3c6IHZpc2libGU7XG4gIH1cblxuICBoMjpmaXJzdC1vZi10eXBlIHtcbiAgICBib3JkZXItYm90dG9tOiAycHggc29saWQgJHtjb2xvcnMuYnJhbmQucHJpbWFyeX07XG4gICAgbWFyZ2luLXRvcDogMDtcbiAgICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgfVxuXG4gIGgyLFxuICBoMyxcbiAgaDQsXG4gIGg1IHtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgICBtYXJnaW4tdG9wOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcuc21hbGx9O1xuICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAke2NvbG9ycy5icmFuZC5saWdodH07XG4gIH1cbmA7XG5cbmNvbnN0IFN0eWxlZERpdiA9IHN0eWxlZC5kaXZgXG4gIHdpZHRoOiAxMDAlO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGNvbG9yOiAke2NvbG9ycy5icmFuZC5ncmV5RGFya307XG4gIHBhZGRpbmc6ICR7c3BhY2luZy5ub3JtYWx9ICR7c3BhY2luZy5ub3JtYWx9ICR7c3BhY2luZy5sYXJnZX07XG4gIGJvcmRlcjogMXB4IHNvbGlkICR7Y29sb3JzLmJyYW5kLmdyZXlMaWdodH07XG4gIG1heC1oZWlnaHQ6IDE5MHB4O1xuICB0cmFuc2l0aW9uOiBtYXgtaGVpZ2h0IDAuNnMgZWFzZS1pbi1vdXQ7XG4gIG92ZXJmbG93OiBoaWRkZW47XG5cbiAgJjphZnRlciB7XG4gICAgY29udGVudDogXCJcIjtcbiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIHRvcDogMDtcbiAgICBib3R0b206IDA7XG4gICAgcmlnaHQ6IDA7XG4gICAgd2lkdGg6IDk5JTtcbiAgICBtYXJnaW46IDAuNSUgMC41JSAwIDAuNSU7XG4gICAgdHJhbnNpdGlvbjogb3BhY2l0eSAwLjVzIGN1YmljLWJlemllcigwLjc0LCAtMC4wNCwgMC45NiwgMC45Nyk7XG4gICAgLyogVGhlIDAwIGFmdGVyIG91ciBjb2xvciBpcyB0byBzZXQgaXRzIG9wYWNpdHkgdG8gMCAqL1xuICAgIGJhY2tncm91bmQ6IGxpbmVhci1ncmFkaWVudCgke2NvbG9ycy5icmFuZC5saWdodH0wMCwgJHtjb2xvcnMud2hpdGV9KTtcbiAgICBvcGFjaXR5OiAxO1xuICAgIHotaW5kZXg6ICR7c3RhY2tPcmRlci5iYXNlfTtcbiAgfVxuXG4gIEBtZWRpYSBwcmludCB7XG4gICAgbWF4LWhlaWdodDogcmV2ZXJ0O1xuICAgICY6YWZ0ZXIge1xuICAgICAgZGlzcGxheTogbm9uZTtcbiAgICB9XG4gIH1cblxuICAmID4gdWw6bm90KFtjbGFzc10pLFxuICA6bm90KGxpKSA+IHVsOm5vdChbY2xhc3NdKSB7XG4gICAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLmRlc2t0b3AgfSl9IHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAke3NwYWNpbmcubm9ybWFsfTtcbiAgICB9XG4gIH1cblxuICAmID4gb2w6bm90KFtjbGFzc10pLFxuICA6bm90KGxpKSA+IG9sOm5vdChbY2xhc3NdKSB7XG4gICAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLmRlc2t0b3AgfSl9IHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAke3NwYWNpbmcubGFyZ2V9O1xuICAgIH1cbiAgfVxuYDtcblxuY29uc3QgU3R5bGVkSWNvbkJ1dHRvbiA9IHN0eWxlZChJY29uQnV0dG9uVjIpYFxuICBtYXJnaW4tdG9wOiAtMjBweDtcbiAgei1pbmRleDogJHtzdGFja09yZGVyLm9mZnNldFNpbmdsZX07XG5cbiAgQG1lZGlhIHByaW50IHtcbiAgICBkaXNwbGF5OiBub25lO1xuICB9XG5gO1xuXG5jb25zdCBleHBhbmRlZFN0eWxlID0gY3NzYFxuICBtYXgtaGVpZ2h0OiA1MDB2aDtcbmA7XG5cbmNvbnN0IGV4cGFuZGVkQ29udGVudFN0eWxlID0gY3NzYFxuICBtYXgtaGVpZ2h0OiA1MDB2aDtcbiAgJjphZnRlciB7XG4gICAgb3BhY2l0eTogMDtcbiAgICB6LWluZGV4OiAke3N0YWNrT3JkZXIuaGlkZX07XG4gIH1cbmA7XG5cbmNvbnN0IEZhY3RCb3ggPSBmb3J3YXJkUmVmPEhUTUxFbGVtZW50LCBQcm9wcz4oXG4gICh7IGNoaWxkcmVuLCBvcGVuLCBvbk9wZW5DaGFuZ2UsIGRlZmF1bHRPcGVuID0gZmFsc2UsIC4uLnJlc3QgfSwgcmVmKSA9PiB7XG4gICAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICAgIGNvbnN0IFtpc09wZW4sIHNldElzT3Blbl0gPSB1c2VTdGF0ZShkZWZhdWx0T3Blbik7XG5cbiAgICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgICAgaWYgKG9wZW4gIT09IHVuZGVmaW5lZCkge1xuICAgICAgICBzZXRJc09wZW4ob3Blbik7XG4gICAgICB9XG4gICAgfSwgW29wZW5dKTtcblxuICAgIGNvbnN0IG9uQ2xpY2sgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgICBjb25zdCBuZXdPcGVuID0gIWlzT3BlbjtcbiAgICAgIHNldElzT3BlbihuZXdPcGVuKTtcbiAgICAgIG9uT3BlbkNoYW5nZT8uKG5ld09wZW4pO1xuICAgIH0sIFtpc09wZW4sIG9uT3BlbkNoYW5nZV0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgIDxTdHlsZWRBc2lkZSB7Li4ucmVzdH0gY3NzPXtbaXNPcGVuID8gZXhwYW5kZWRTdHlsZSA6IHVuZGVmaW5lZF19IHJlZj17cmVmfT5cbiAgICAgICAgPFN0eWxlZERpdiBjc3M9e2lzT3BlbiA/IGV4cGFuZGVkQ29udGVudFN0eWxlIDogdW5kZWZpbmVkfT57Y2hpbGRyZW59PC9TdHlsZWREaXY+XG4gICAgICAgIDxTdHlsZWRJY29uQnV0dG9uIG9uQ2xpY2s9e29uQ2xpY2t9IGFyaWEtbGFiZWw9e3QoYGZhY3Rib3guJHtpc09wZW4gPyBcImNsb3NlXCIgOiBcIm9wZW5cIn1gKX0+XG4gICAgICAgICAge2lzT3BlbiA/IDxDaGV2cm9uVXAgLz4gOiA8Q2hldnJvbkRvd24gLz59XG4gICAgICAgIDwvU3R5bGVkSWNvbkJ1dHRvbj5cbiAgICAgIDwvU3R5bGVkQXNpZGU+XG4gICAgKTtcbiAgfSxcbik7XG5cbmV4cG9ydCBkZWZhdWx0IEZhY3RCb3g7XG4iXX0= */"));
-const StyledIconButton = /*#__PURE__*/_styled(IconButtonV2, {
-  target: "el037bs0",
-  label: "StyledIconButton"
-})("margin-top:-20px;z-index:", stackOrder.offsetSingle, ";@media print{display:none;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZhY3RCb3gudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXVHNkMiLCJmaWxlIjoiRmFjdEJveC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxNi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgeyBDb21wb25lbnRQcm9wcywgUmVhY3ROb2RlLCBmb3J3YXJkUmVmLCB1c2VDYWxsYmFjaywgdXNlRWZmZWN0LCB1c2VTdGF0ZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tIFwicmVhY3QtaTE4bmV4dFwiO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb25CdXR0b25WMiB9IGZyb20gXCJAbmRsYS9idXR0b25cIjtcbmltcG9ydCB7IGJyZWFrcG9pbnRzLCBjb2xvcnMsIG1xLCBzcGFjaW5nLCBzdGFja09yZGVyIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IENoZXZyb25Eb3duLCBDaGV2cm9uVXAgfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5cbmludGVyZmFjZSBQcm9wcyBleHRlbmRzIENvbXBvbmVudFByb3BzPFwiYXNpZGVcIj4ge1xuICBjaGlsZHJlbj86IFJlYWN0Tm9kZTtcbiAgZGVmYXVsdE9wZW4/OiBib29sZWFuO1xuICBvcGVuPzogYm9vbGVhbjtcbiAgb25PcGVuQ2hhbmdlPzogKG9wZW46IGJvb2xlYW4pID0+IHZvaWQ7XG59XG5cbmNvbnN0IFN0eWxlZEFzaWRlID0gc3R5bGVkLmFzaWRlYFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIHotaW5kZXg6ICR7c3RhY2tPcmRlci5vZmZzZXRTaW5nbGV9O1xuICBtYXJnaW46ICR7c3BhY2luZy5sYXJnZX0gMCBjYWxjKCR7c3BhY2luZy5sYXJnZX0gLSAke3NwYWNpbmcubnNtYWxsfSkgMDtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgcGFkZGluZy1ib3R0b206ICR7c3BhY2luZy5uc21hbGx9O1xuXG4gIEBtZWRpYSBwcmludCB7XG4gICAgb3ZlcmZsb3c6IHZpc2libGU7XG4gIH1cblxuICBoMjpmaXJzdC1vZi10eXBlIHtcbiAgICBib3JkZXItYm90dG9tOiAycHggc29saWQgJHtjb2xvcnMuYnJhbmQucHJpbWFyeX07XG4gICAgbWFyZ2luLXRvcDogMDtcbiAgICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgfVxuXG4gIGgyLFxuICBoMyxcbiAgaDQsXG4gIGg1IHtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgICBtYXJnaW4tdG9wOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcuc21hbGx9O1xuICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAke2NvbG9ycy5icmFuZC5saWdodH07XG4gIH1cbmA7XG5cbmNvbnN0IFN0eWxlZERpdiA9IHN0eWxlZC5kaXZgXG4gIHdpZHRoOiAxMDAlO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGNvbG9yOiAke2NvbG9ycy5icmFuZC5ncmV5RGFya307XG4gIHBhZGRpbmc6ICR7c3BhY2luZy5ub3JtYWx9ICR7c3BhY2luZy5ub3JtYWx9ICR7c3BhY2luZy5sYXJnZX07XG4gIGJvcmRlcjogMXB4IHNvbGlkICR7Y29sb3JzLmJyYW5kLmdyZXlMaWdodH07XG4gIG1heC1oZWlnaHQ6IDE5MHB4O1xuICB0cmFuc2l0aW9uOiBtYXgtaGVpZ2h0IDAuNnMgZWFzZS1pbi1vdXQ7XG4gIG92ZXJmbG93OiBoaWRkZW47XG5cbiAgJjphZnRlciB7XG4gICAgY29udGVudDogXCJcIjtcbiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIHRvcDogMDtcbiAgICBib3R0b206IDA7XG4gICAgcmlnaHQ6IDA7XG4gICAgd2lkdGg6IDk5JTtcbiAgICBtYXJnaW46IDAuNSUgMC41JSAwIDAuNSU7XG4gICAgdHJhbnNpdGlvbjogb3BhY2l0eSAwLjVzIGN1YmljLWJlemllcigwLjc0LCAtMC4wNCwgMC45NiwgMC45Nyk7XG4gICAgLyogVGhlIDAwIGFmdGVyIG91ciBjb2xvciBpcyB0byBzZXQgaXRzIG9wYWNpdHkgdG8gMCAqL1xuICAgIGJhY2tncm91bmQ6IGxpbmVhci1ncmFkaWVudCgke2NvbG9ycy5icmFuZC5saWdodH0wMCwgJHtjb2xvcnMud2hpdGV9KTtcbiAgICBvcGFjaXR5OiAxO1xuICAgIHotaW5kZXg6ICR7c3RhY2tPcmRlci5iYXNlfTtcbiAgfVxuXG4gIEBtZWRpYSBwcmludCB7XG4gICAgbWF4LWhlaWdodDogcmV2ZXJ0O1xuICAgICY6YWZ0ZXIge1xuICAgICAgZGlzcGxheTogbm9uZTtcbiAgICB9XG4gIH1cblxuICAmID4gdWw6bm90KFtjbGFzc10pLFxuICA6bm90KGxpKSA+IHVsOm5vdChbY2xhc3NdKSB7XG4gICAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLmRlc2t0b3AgfSl9IHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAke3NwYWNpbmcubm9ybWFsfTtcbiAgICB9XG4gIH1cblxuICAmID4gb2w6bm90KFtjbGFzc10pLFxuICA6bm90KGxpKSA+IG9sOm5vdChbY2xhc3NdKSB7XG4gICAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLmRlc2t0b3AgfSl9IHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAke3NwYWNpbmcubGFyZ2V9O1xuICAgIH1cbiAgfVxuYDtcblxuY29uc3QgU3R5bGVkSWNvbkJ1dHRvbiA9IHN0eWxlZChJY29uQnV0dG9uVjIpYFxuICBtYXJnaW4tdG9wOiAtMjBweDtcbiAgei1pbmRleDogJHtzdGFja09yZGVyLm9mZnNldFNpbmdsZX07XG5cbiAgQG1lZGlhIHByaW50IHtcbiAgICBkaXNwbGF5OiBub25lO1xuICB9XG5gO1xuXG5jb25zdCBleHBhbmRlZFN0eWxlID0gY3NzYFxuICBtYXgtaGVpZ2h0OiA1MDB2aDtcbmA7XG5cbmNvbnN0IGV4cGFuZGVkQ29udGVudFN0eWxlID0gY3NzYFxuICBtYXgtaGVpZ2h0OiA1MDB2aDtcbiAgJjphZnRlciB7XG4gICAgb3BhY2l0eTogMDtcbiAgICB6LWluZGV4OiAke3N0YWNrT3JkZXIuaGlkZX07XG4gIH1cbmA7XG5cbmNvbnN0IEZhY3RCb3ggPSBmb3J3YXJkUmVmPEhUTUxFbGVtZW50LCBQcm9wcz4oXG4gICh7IGNoaWxkcmVuLCBvcGVuLCBvbk9wZW5DaGFuZ2UsIGRlZmF1bHRPcGVuID0gZmFsc2UsIC4uLnJlc3QgfSwgcmVmKSA9PiB7XG4gICAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICAgIGNvbnN0IFtpc09wZW4sIHNldElzT3Blbl0gPSB1c2VTdGF0ZShkZWZhdWx0T3Blbik7XG5cbiAgICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgICAgaWYgKG9wZW4gIT09IHVuZGVmaW5lZCkge1xuICAgICAgICBzZXRJc09wZW4ob3Blbik7XG4gICAgICB9XG4gICAgfSwgW29wZW5dKTtcblxuICAgIGNvbnN0IG9uQ2xpY2sgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgICBjb25zdCBuZXdPcGVuID0gIWlzT3BlbjtcbiAgICAgIHNldElzT3BlbihuZXdPcGVuKTtcbiAgICAgIG9uT3BlbkNoYW5nZT8uKG5ld09wZW4pO1xuICAgIH0sIFtpc09wZW4sIG9uT3BlbkNoYW5nZV0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgIDxTdHlsZWRBc2lkZSB7Li4ucmVzdH0gY3NzPXtbaXNPcGVuID8gZXhwYW5kZWRTdHlsZSA6IHVuZGVmaW5lZF19IHJlZj17cmVmfT5cbiAgICAgICAgPFN0eWxlZERpdiBjc3M9e2lzT3BlbiA/IGV4cGFuZGVkQ29udGVudFN0eWxlIDogdW5kZWZpbmVkfT57Y2hpbGRyZW59PC9TdHlsZWREaXY+XG4gICAgICAgIDxTdHlsZWRJY29uQnV0dG9uIG9uQ2xpY2s9e29uQ2xpY2t9IGFyaWEtbGFiZWw9e3QoYGZhY3Rib3guJHtpc09wZW4gPyBcImNsb3NlXCIgOiBcIm9wZW5cIn1gKX0+XG4gICAgICAgICAge2lzT3BlbiA/IDxDaGV2cm9uVXAgLz4gOiA8Q2hldnJvbkRvd24gLz59XG4gICAgICAgIDwvU3R5bGVkSWNvbkJ1dHRvbj5cbiAgICAgIDwvU3R5bGVkQXNpZGU+XG4gICAgKTtcbiAgfSxcbik7XG5cbmV4cG9ydCBkZWZhdWx0IEZhY3RCb3g7XG4iXX0= */"));
-const expandedStyle = process.env.NODE_ENV === "production" ? {
-  name: "14om3zt-expandedStyle",
-  styles: "max-height:500vh;label:expandedStyle;"
-} : {
-  name: "14om3zt-expandedStyle",
-  styles: "max-height:500vh;label:expandedStyle;",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZhY3RCb3gudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWdIeUIiLCJmaWxlIjoiRmFjdEJveC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxNi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgeyBDb21wb25lbnRQcm9wcywgUmVhY3ROb2RlLCBmb3J3YXJkUmVmLCB1c2VDYWxsYmFjaywgdXNlRWZmZWN0LCB1c2VTdGF0ZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tIFwicmVhY3QtaTE4bmV4dFwiO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb25CdXR0b25WMiB9IGZyb20gXCJAbmRsYS9idXR0b25cIjtcbmltcG9ydCB7IGJyZWFrcG9pbnRzLCBjb2xvcnMsIG1xLCBzcGFjaW5nLCBzdGFja09yZGVyIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IENoZXZyb25Eb3duLCBDaGV2cm9uVXAgfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5cbmludGVyZmFjZSBQcm9wcyBleHRlbmRzIENvbXBvbmVudFByb3BzPFwiYXNpZGVcIj4ge1xuICBjaGlsZHJlbj86IFJlYWN0Tm9kZTtcbiAgZGVmYXVsdE9wZW4/OiBib29sZWFuO1xuICBvcGVuPzogYm9vbGVhbjtcbiAgb25PcGVuQ2hhbmdlPzogKG9wZW46IGJvb2xlYW4pID0+IHZvaWQ7XG59XG5cbmNvbnN0IFN0eWxlZEFzaWRlID0gc3R5bGVkLmFzaWRlYFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIHotaW5kZXg6ICR7c3RhY2tPcmRlci5vZmZzZXRTaW5nbGV9O1xuICBtYXJnaW46ICR7c3BhY2luZy5sYXJnZX0gMCBjYWxjKCR7c3BhY2luZy5sYXJnZX0gLSAke3NwYWNpbmcubnNtYWxsfSkgMDtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgcGFkZGluZy1ib3R0b206ICR7c3BhY2luZy5uc21hbGx9O1xuXG4gIEBtZWRpYSBwcmludCB7XG4gICAgb3ZlcmZsb3c6IHZpc2libGU7XG4gIH1cblxuICBoMjpmaXJzdC1vZi10eXBlIHtcbiAgICBib3JkZXItYm90dG9tOiAycHggc29saWQgJHtjb2xvcnMuYnJhbmQucHJpbWFyeX07XG4gICAgbWFyZ2luLXRvcDogMDtcbiAgICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgfVxuXG4gIGgyLFxuICBoMyxcbiAgaDQsXG4gIGg1IHtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgICBtYXJnaW4tdG9wOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcuc21hbGx9O1xuICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAke2NvbG9ycy5icmFuZC5saWdodH07XG4gIH1cbmA7XG5cbmNvbnN0IFN0eWxlZERpdiA9IHN0eWxlZC5kaXZgXG4gIHdpZHRoOiAxMDAlO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGNvbG9yOiAke2NvbG9ycy5icmFuZC5ncmV5RGFya307XG4gIHBhZGRpbmc6ICR7c3BhY2luZy5ub3JtYWx9ICR7c3BhY2luZy5ub3JtYWx9ICR7c3BhY2luZy5sYXJnZX07XG4gIGJvcmRlcjogMXB4IHNvbGlkICR7Y29sb3JzLmJyYW5kLmdyZXlMaWdodH07XG4gIG1heC1oZWlnaHQ6IDE5MHB4O1xuICB0cmFuc2l0aW9uOiBtYXgtaGVpZ2h0IDAuNnMgZWFzZS1pbi1vdXQ7XG4gIG92ZXJmbG93OiBoaWRkZW47XG5cbiAgJjphZnRlciB7XG4gICAgY29udGVudDogXCJcIjtcbiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIHRvcDogMDtcbiAgICBib3R0b206IDA7XG4gICAgcmlnaHQ6IDA7XG4gICAgd2lkdGg6IDk5JTtcbiAgICBtYXJnaW46IDAuNSUgMC41JSAwIDAuNSU7XG4gICAgdHJhbnNpdGlvbjogb3BhY2l0eSAwLjVzIGN1YmljLWJlemllcigwLjc0LCAtMC4wNCwgMC45NiwgMC45Nyk7XG4gICAgLyogVGhlIDAwIGFmdGVyIG91ciBjb2xvciBpcyB0byBzZXQgaXRzIG9wYWNpdHkgdG8gMCAqL1xuICAgIGJhY2tncm91bmQ6IGxpbmVhci1ncmFkaWVudCgke2NvbG9ycy5icmFuZC5saWdodH0wMCwgJHtjb2xvcnMud2hpdGV9KTtcbiAgICBvcGFjaXR5OiAxO1xuICAgIHotaW5kZXg6ICR7c3RhY2tPcmRlci5iYXNlfTtcbiAgfVxuXG4gIEBtZWRpYSBwcmludCB7XG4gICAgbWF4LWhlaWdodDogcmV2ZXJ0O1xuICAgICY6YWZ0ZXIge1xuICAgICAgZGlzcGxheTogbm9uZTtcbiAgICB9XG4gIH1cblxuICAmID4gdWw6bm90KFtjbGFzc10pLFxuICA6bm90KGxpKSA+IHVsOm5vdChbY2xhc3NdKSB7XG4gICAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLmRlc2t0b3AgfSl9IHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAke3NwYWNpbmcubm9ybWFsfTtcbiAgICB9XG4gIH1cblxuICAmID4gb2w6bm90KFtjbGFzc10pLFxuICA6bm90KGxpKSA+IG9sOm5vdChbY2xhc3NdKSB7XG4gICAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLmRlc2t0b3AgfSl9IHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAke3NwYWNpbmcubGFyZ2V9O1xuICAgIH1cbiAgfVxuYDtcblxuY29uc3QgU3R5bGVkSWNvbkJ1dHRvbiA9IHN0eWxlZChJY29uQnV0dG9uVjIpYFxuICBtYXJnaW4tdG9wOiAtMjBweDtcbiAgei1pbmRleDogJHtzdGFja09yZGVyLm9mZnNldFNpbmdsZX07XG5cbiAgQG1lZGlhIHByaW50IHtcbiAgICBkaXNwbGF5OiBub25lO1xuICB9XG5gO1xuXG5jb25zdCBleHBhbmRlZFN0eWxlID0gY3NzYFxuICBtYXgtaGVpZ2h0OiA1MDB2aDtcbmA7XG5cbmNvbnN0IGV4cGFuZGVkQ29udGVudFN0eWxlID0gY3NzYFxuICBtYXgtaGVpZ2h0OiA1MDB2aDtcbiAgJjphZnRlciB7XG4gICAgb3BhY2l0eTogMDtcbiAgICB6LWluZGV4OiAke3N0YWNrT3JkZXIuaGlkZX07XG4gIH1cbmA7XG5cbmNvbnN0IEZhY3RCb3ggPSBmb3J3YXJkUmVmPEhUTUxFbGVtZW50LCBQcm9wcz4oXG4gICh7IGNoaWxkcmVuLCBvcGVuLCBvbk9wZW5DaGFuZ2UsIGRlZmF1bHRPcGVuID0gZmFsc2UsIC4uLnJlc3QgfSwgcmVmKSA9PiB7XG4gICAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICAgIGNvbnN0IFtpc09wZW4sIHNldElzT3Blbl0gPSB1c2VTdGF0ZShkZWZhdWx0T3Blbik7XG5cbiAgICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgICAgaWYgKG9wZW4gIT09IHVuZGVmaW5lZCkge1xuICAgICAgICBzZXRJc09wZW4ob3Blbik7XG4gICAgICB9XG4gICAgfSwgW29wZW5dKTtcblxuICAgIGNvbnN0IG9uQ2xpY2sgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgICBjb25zdCBuZXdPcGVuID0gIWlzT3BlbjtcbiAgICAgIHNldElzT3BlbihuZXdPcGVuKTtcbiAgICAgIG9uT3BlbkNoYW5nZT8uKG5ld09wZW4pO1xuICAgIH0sIFtpc09wZW4sIG9uT3BlbkNoYW5nZV0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgIDxTdHlsZWRBc2lkZSB7Li4ucmVzdH0gY3NzPXtbaXNPcGVuID8gZXhwYW5kZWRTdHlsZSA6IHVuZGVmaW5lZF19IHJlZj17cmVmfT5cbiAgICAgICAgPFN0eWxlZERpdiBjc3M9e2lzT3BlbiA/IGV4cGFuZGVkQ29udGVudFN0eWxlIDogdW5kZWZpbmVkfT57Y2hpbGRyZW59PC9TdHlsZWREaXY+XG4gICAgICAgIDxTdHlsZWRJY29uQnV0dG9uIG9uQ2xpY2s9e29uQ2xpY2t9IGFyaWEtbGFiZWw9e3QoYGZhY3Rib3guJHtpc09wZW4gPyBcImNsb3NlXCIgOiBcIm9wZW5cIn1gKX0+XG4gICAgICAgICAge2lzT3BlbiA/IDxDaGV2cm9uVXAgLz4gOiA8Q2hldnJvbkRvd24gLz59XG4gICAgICAgIDwvU3R5bGVkSWNvbkJ1dHRvbj5cbiAgICAgIDwvU3R5bGVkQXNpZGU+XG4gICAgKTtcbiAgfSxcbik7XG5cbmV4cG9ydCBkZWZhdWx0IEZhY3RCb3g7XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-};
-const expandedContentStyle = /*#__PURE__*/css("max-height:500vh;&:after{opacity:0;z-index:", stackOrder.hide, ";};label:expandedContentStyle;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZhY3RCb3gudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW9IZ0MiLCJmaWxlIjoiRmFjdEJveC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxNi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgeyBDb21wb25lbnRQcm9wcywgUmVhY3ROb2RlLCBmb3J3YXJkUmVmLCB1c2VDYWxsYmFjaywgdXNlRWZmZWN0LCB1c2VTdGF0ZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tIFwicmVhY3QtaTE4bmV4dFwiO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb25CdXR0b25WMiB9IGZyb20gXCJAbmRsYS9idXR0b25cIjtcbmltcG9ydCB7IGJyZWFrcG9pbnRzLCBjb2xvcnMsIG1xLCBzcGFjaW5nLCBzdGFja09yZGVyIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IENoZXZyb25Eb3duLCBDaGV2cm9uVXAgfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5cbmludGVyZmFjZSBQcm9wcyBleHRlbmRzIENvbXBvbmVudFByb3BzPFwiYXNpZGVcIj4ge1xuICBjaGlsZHJlbj86IFJlYWN0Tm9kZTtcbiAgZGVmYXVsdE9wZW4/OiBib29sZWFuO1xuICBvcGVuPzogYm9vbGVhbjtcbiAgb25PcGVuQ2hhbmdlPzogKG9wZW46IGJvb2xlYW4pID0+IHZvaWQ7XG59XG5cbmNvbnN0IFN0eWxlZEFzaWRlID0gc3R5bGVkLmFzaWRlYFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIHotaW5kZXg6ICR7c3RhY2tPcmRlci5vZmZzZXRTaW5nbGV9O1xuICBtYXJnaW46ICR7c3BhY2luZy5sYXJnZX0gMCBjYWxjKCR7c3BhY2luZy5sYXJnZX0gLSAke3NwYWNpbmcubnNtYWxsfSkgMDtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgcGFkZGluZy1ib3R0b206ICR7c3BhY2luZy5uc21hbGx9O1xuXG4gIEBtZWRpYSBwcmludCB7XG4gICAgb3ZlcmZsb3c6IHZpc2libGU7XG4gIH1cblxuICBoMjpmaXJzdC1vZi10eXBlIHtcbiAgICBib3JkZXItYm90dG9tOiAycHggc29saWQgJHtjb2xvcnMuYnJhbmQucHJpbWFyeX07XG4gICAgbWFyZ2luLXRvcDogMDtcbiAgICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgfVxuXG4gIGgyLFxuICBoMyxcbiAgaDQsXG4gIGg1IHtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgICBtYXJnaW4tdG9wOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcuc21hbGx9O1xuICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAke2NvbG9ycy5icmFuZC5saWdodH07XG4gIH1cbmA7XG5cbmNvbnN0IFN0eWxlZERpdiA9IHN0eWxlZC5kaXZgXG4gIHdpZHRoOiAxMDAlO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGNvbG9yOiAke2NvbG9ycy5icmFuZC5ncmV5RGFya307XG4gIHBhZGRpbmc6ICR7c3BhY2luZy5ub3JtYWx9ICR7c3BhY2luZy5ub3JtYWx9ICR7c3BhY2luZy5sYXJnZX07XG4gIGJvcmRlcjogMXB4IHNvbGlkICR7Y29sb3JzLmJyYW5kLmdyZXlMaWdodH07XG4gIG1heC1oZWlnaHQ6IDE5MHB4O1xuICB0cmFuc2l0aW9uOiBtYXgtaGVpZ2h0IDAuNnMgZWFzZS1pbi1vdXQ7XG4gIG92ZXJmbG93OiBoaWRkZW47XG5cbiAgJjphZnRlciB7XG4gICAgY29udGVudDogXCJcIjtcbiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIHRvcDogMDtcbiAgICBib3R0b206IDA7XG4gICAgcmlnaHQ6IDA7XG4gICAgd2lkdGg6IDk5JTtcbiAgICBtYXJnaW46IDAuNSUgMC41JSAwIDAuNSU7XG4gICAgdHJhbnNpdGlvbjogb3BhY2l0eSAwLjVzIGN1YmljLWJlemllcigwLjc0LCAtMC4wNCwgMC45NiwgMC45Nyk7XG4gICAgLyogVGhlIDAwIGFmdGVyIG91ciBjb2xvciBpcyB0byBzZXQgaXRzIG9wYWNpdHkgdG8gMCAqL1xuICAgIGJhY2tncm91bmQ6IGxpbmVhci1ncmFkaWVudCgke2NvbG9ycy5icmFuZC5saWdodH0wMCwgJHtjb2xvcnMud2hpdGV9KTtcbiAgICBvcGFjaXR5OiAxO1xuICAgIHotaW5kZXg6ICR7c3RhY2tPcmRlci5iYXNlfTtcbiAgfVxuXG4gIEBtZWRpYSBwcmludCB7XG4gICAgbWF4LWhlaWdodDogcmV2ZXJ0O1xuICAgICY6YWZ0ZXIge1xuICAgICAgZGlzcGxheTogbm9uZTtcbiAgICB9XG4gIH1cblxuICAmID4gdWw6bm90KFtjbGFzc10pLFxuICA6bm90KGxpKSA+IHVsOm5vdChbY2xhc3NdKSB7XG4gICAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLmRlc2t0b3AgfSl9IHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAke3NwYWNpbmcubm9ybWFsfTtcbiAgICB9XG4gIH1cblxuICAmID4gb2w6bm90KFtjbGFzc10pLFxuICA6bm90KGxpKSA+IG9sOm5vdChbY2xhc3NdKSB7XG4gICAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLmRlc2t0b3AgfSl9IHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAke3NwYWNpbmcubGFyZ2V9O1xuICAgIH1cbiAgfVxuYDtcblxuY29uc3QgU3R5bGVkSWNvbkJ1dHRvbiA9IHN0eWxlZChJY29uQnV0dG9uVjIpYFxuICBtYXJnaW4tdG9wOiAtMjBweDtcbiAgei1pbmRleDogJHtzdGFja09yZGVyLm9mZnNldFNpbmdsZX07XG5cbiAgQG1lZGlhIHByaW50IHtcbiAgICBkaXNwbGF5OiBub25lO1xuICB9XG5gO1xuXG5jb25zdCBleHBhbmRlZFN0eWxlID0gY3NzYFxuICBtYXgtaGVpZ2h0OiA1MDB2aDtcbmA7XG5cbmNvbnN0IGV4cGFuZGVkQ29udGVudFN0eWxlID0gY3NzYFxuICBtYXgtaGVpZ2h0OiA1MDB2aDtcbiAgJjphZnRlciB7XG4gICAgb3BhY2l0eTogMDtcbiAgICB6LWluZGV4OiAke3N0YWNrT3JkZXIuaGlkZX07XG4gIH1cbmA7XG5cbmNvbnN0IEZhY3RCb3ggPSBmb3J3YXJkUmVmPEhUTUxFbGVtZW50LCBQcm9wcz4oXG4gICh7IGNoaWxkcmVuLCBvcGVuLCBvbk9wZW5DaGFuZ2UsIGRlZmF1bHRPcGVuID0gZmFsc2UsIC4uLnJlc3QgfSwgcmVmKSA9PiB7XG4gICAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICAgIGNvbnN0IFtpc09wZW4sIHNldElzT3Blbl0gPSB1c2VTdGF0ZShkZWZhdWx0T3Blbik7XG5cbiAgICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgICAgaWYgKG9wZW4gIT09IHVuZGVmaW5lZCkge1xuICAgICAgICBzZXRJc09wZW4ob3Blbik7XG4gICAgICB9XG4gICAgfSwgW29wZW5dKTtcblxuICAgIGNvbnN0IG9uQ2xpY2sgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgICBjb25zdCBuZXdPcGVuID0gIWlzT3BlbjtcbiAgICAgIHNldElzT3BlbihuZXdPcGVuKTtcbiAgICAgIG9uT3BlbkNoYW5nZT8uKG5ld09wZW4pO1xuICAgIH0sIFtpc09wZW4sIG9uT3BlbkNoYW5nZV0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgIDxTdHlsZWRBc2lkZSB7Li4ucmVzdH0gY3NzPXtbaXNPcGVuID8gZXhwYW5kZWRTdHlsZSA6IHVuZGVmaW5lZF19IHJlZj17cmVmfT5cbiAgICAgICAgPFN0eWxlZERpdiBjc3M9e2lzT3BlbiA/IGV4cGFuZGVkQ29udGVudFN0eWxlIDogdW5kZWZpbmVkfT57Y2hpbGRyZW59PC9TdHlsZWREaXY+XG4gICAgICAgIDxTdHlsZWRJY29uQnV0dG9uIG9uQ2xpY2s9e29uQ2xpY2t9IGFyaWEtbGFiZWw9e3QoYGZhY3Rib3guJHtpc09wZW4gPyBcImNsb3NlXCIgOiBcIm9wZW5cIn1gKX0+XG4gICAgICAgICAge2lzT3BlbiA/IDxDaGV2cm9uVXAgLz4gOiA8Q2hldnJvbkRvd24gLz59XG4gICAgICAgIDwvU3R5bGVkSWNvbkJ1dHRvbj5cbiAgICAgIDwvU3R5bGVkQXNpZGU+XG4gICAgKTtcbiAgfSxcbik7XG5cbmV4cG9ydCBkZWZhdWx0IEZhY3RCb3g7XG4iXX0= */"));
+const StyledAside = styled("aside", {
+  base: {
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    position: "relative",
+    padding: "medium",
+    transitionProperty: "max-height",
+    transitionDuration: "slow",
+    transitionTimingFunction: "ease-in-out",
+    border: "1px solid",
+    borderColor: "stroke.default",
+    borderRadius: "xsmall",
+    maxHeight: "surface.xxsmall",
+    _closed: {
+      _print: {
+        overflow: "visible",
+        maxHeight: "500vh"
+      }
+    },
+    _open: {
+      maxHeight: "500vh"
+    }
+  }
+});
+const StyledContent = styled("div", {
+  base: {
+    position: "relative",
+    width: "100%",
+    overflow: "hidden",
+    // Reset the top margin of the very first child.
+    "& :first-child": {
+      marginBlockStart: "0"
+    },
+    _after: {
+      content: '""',
+      textAlign: "center",
+      position: "absolute",
+      inset: "0",
+      transitionProperty: "opacity",
+      transitionDuration: "slow",
+      transitionTimingFunction: "ease-out",
+      // TODO: Consider improving this gradient. It's a little light up top.
+      gradientFrom: "surface.default/00",
+      gradientTo: "surface.default",
+      backgroundGradient: "to-b",
+      opacity: "1",
+      zIndex: "base"
+    },
+    _print: {
+      overflow: "visible",
+      _after: {
+        display: "none"
+      }
+    },
+    _open: {
+      paddingBlockEnd: "xsmall",
+      _after: {
+        opacity: "0",
+        zIndex: "hide"
+      }
+    }
+  }
+});
+const StyledIconButton = styled(IconButton, {
+  base: {
+    position: "absolute",
+    bottom: "-medium",
+    zIndex: "base",
+    "& svg": {
+      transitionProperty: "transform",
+      transitionTimingFunction: "ease-in-out",
+      transitionDuration: "fast"
+    },
+    _open: {
+      "& svg": {
+        transform: "rotate(180deg)"
+      }
+    },
+    _print: {
+      display: "none"
+    }
+  }
+});
+
+// TODO: Consider moving the open trigger depending on whether the content is open or closed.
+
 const FactBox = /*#__PURE__*/forwardRef((_ref, ref) => {
   let {
     children,
@@ -53,28 +110,42 @@ const FactBox = /*#__PURE__*/forwardRef((_ref, ref) => {
   const {
     t
   } = useTranslation();
-  const [isOpen, setIsOpen] = useState(defaultOpen);
+  const [state, setState] = useState(defaultOpen ? "open" : "closed");
+  const contentId = useId();
+  // Inert has existed since early 2023. It allows us to disable tabindex inside the content if it is closed, allowing us to be accessible for users with newish browsers. React 18 removes this because it doesn't recognize the attribute. This is a workaround for that.
+  // TODO: Remove this hack when we upgrade to React 19.
+  const inertAttribute = useMemo(() => {
+    return state === "closed" ? {
+      inert: ""
+    } : {};
+  }, [state]);
   useEffect(() => {
     if (open !== undefined) {
-      setIsOpen(open);
+      setState(open ? "open" : "closed");
     }
   }, [open]);
   const onClick = useCallback(() => {
-    const newOpen = !isOpen;
-    setIsOpen(newOpen);
-    onOpenChange?.(newOpen);
-  }, [isOpen, onOpenChange]);
+    const newState = state === "open" ? "closed" : "open";
+    setState(newState);
+    onOpenChange?.(newState === "open");
+  }, [state, onOpenChange]);
   return _jsxs(StyledAside, {
+    "data-state": state,
     ...rest,
-    css: [isOpen ? expandedStyle : undefined, ";label:FactBox;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZhY3RCb3gudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQThJNkIiLCJmaWxlIjoiRmFjdEJveC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxNi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgeyBDb21wb25lbnRQcm9wcywgUmVhY3ROb2RlLCBmb3J3YXJkUmVmLCB1c2VDYWxsYmFjaywgdXNlRWZmZWN0LCB1c2VTdGF0ZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tIFwicmVhY3QtaTE4bmV4dFwiO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb25CdXR0b25WMiB9IGZyb20gXCJAbmRsYS9idXR0b25cIjtcbmltcG9ydCB7IGJyZWFrcG9pbnRzLCBjb2xvcnMsIG1xLCBzcGFjaW5nLCBzdGFja09yZGVyIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IENoZXZyb25Eb3duLCBDaGV2cm9uVXAgfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5cbmludGVyZmFjZSBQcm9wcyBleHRlbmRzIENvbXBvbmVudFByb3BzPFwiYXNpZGVcIj4ge1xuICBjaGlsZHJlbj86IFJlYWN0Tm9kZTtcbiAgZGVmYXVsdE9wZW4/OiBib29sZWFuO1xuICBvcGVuPzogYm9vbGVhbjtcbiAgb25PcGVuQ2hhbmdlPzogKG9wZW46IGJvb2xlYW4pID0+IHZvaWQ7XG59XG5cbmNvbnN0IFN0eWxlZEFzaWRlID0gc3R5bGVkLmFzaWRlYFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIHotaW5kZXg6ICR7c3RhY2tPcmRlci5vZmZzZXRTaW5nbGV9O1xuICBtYXJnaW46ICR7c3BhY2luZy5sYXJnZX0gMCBjYWxjKCR7c3BhY2luZy5sYXJnZX0gLSAke3NwYWNpbmcubnNtYWxsfSkgMDtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgcGFkZGluZy1ib3R0b206ICR7c3BhY2luZy5uc21hbGx9O1xuXG4gIEBtZWRpYSBwcmludCB7XG4gICAgb3ZlcmZsb3c6IHZpc2libGU7XG4gIH1cblxuICBoMjpmaXJzdC1vZi10eXBlIHtcbiAgICBib3JkZXItYm90dG9tOiAycHggc29saWQgJHtjb2xvcnMuYnJhbmQucHJpbWFyeX07XG4gICAgbWFyZ2luLXRvcDogMDtcbiAgICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgfVxuXG4gIGgyLFxuICBoMyxcbiAgaDQsXG4gIGg1IHtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgICBtYXJnaW4tdG9wOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgICBtYXJnaW4tYm90dG9tOiAke3NwYWNpbmcuc21hbGx9O1xuICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAke2NvbG9ycy5icmFuZC5saWdodH07XG4gIH1cbmA7XG5cbmNvbnN0IFN0eWxlZERpdiA9IHN0eWxlZC5kaXZgXG4gIHdpZHRoOiAxMDAlO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGNvbG9yOiAke2NvbG9ycy5icmFuZC5ncmV5RGFya307XG4gIHBhZGRpbmc6ICR7c3BhY2luZy5ub3JtYWx9ICR7c3BhY2luZy5ub3JtYWx9ICR7c3BhY2luZy5sYXJnZX07XG4gIGJvcmRlcjogMXB4IHNvbGlkICR7Y29sb3JzLmJyYW5kLmdyZXlMaWdodH07XG4gIG1heC1oZWlnaHQ6IDE5MHB4O1xuICB0cmFuc2l0aW9uOiBtYXgtaGVpZ2h0IDAuNnMgZWFzZS1pbi1vdXQ7XG4gIG92ZXJmbG93OiBoaWRkZW47XG5cbiAgJjphZnRlciB7XG4gICAgY29udGVudDogXCJcIjtcbiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIHRvcDogMDtcbiAgICBib3R0b206IDA7XG4gICAgcmlnaHQ6IDA7XG4gICAgd2lkdGg6IDk5JTtcbiAgICBtYXJnaW46IDAuNSUgMC41JSAwIDAuNSU7XG4gICAgdHJhbnNpdGlvbjogb3BhY2l0eSAwLjVzIGN1YmljLWJlemllcigwLjc0LCAtMC4wNCwgMC45NiwgMC45Nyk7XG4gICAgLyogVGhlIDAwIGFmdGVyIG91ciBjb2xvciBpcyB0byBzZXQgaXRzIG9wYWNpdHkgdG8gMCAqL1xuICAgIGJhY2tncm91bmQ6IGxpbmVhci1ncmFkaWVudCgke2NvbG9ycy5icmFuZC5saWdodH0wMCwgJHtjb2xvcnMud2hpdGV9KTtcbiAgICBvcGFjaXR5OiAxO1xuICAgIHotaW5kZXg6ICR7c3RhY2tPcmRlci5iYXNlfTtcbiAgfVxuXG4gIEBtZWRpYSBwcmludCB7XG4gICAgbWF4LWhlaWdodDogcmV2ZXJ0O1xuICAgICY6YWZ0ZXIge1xuICAgICAgZGlzcGxheTogbm9uZTtcbiAgICB9XG4gIH1cblxuICAmID4gdWw6bm90KFtjbGFzc10pLFxuICA6bm90KGxpKSA+IHVsOm5vdChbY2xhc3NdKSB7XG4gICAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLmRlc2t0b3AgfSl9IHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAke3NwYWNpbmcubm9ybWFsfTtcbiAgICB9XG4gIH1cblxuICAmID4gb2w6bm90KFtjbGFzc10pLFxuICA6bm90KGxpKSA+IG9sOm5vdChbY2xhc3NdKSB7XG4gICAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLmRlc2t0b3AgfSl9IHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAke3NwYWNpbmcubGFyZ2V9O1xuICAgIH1cbiAgfVxuYDtcblxuY29uc3QgU3R5bGVkSWNvbkJ1dHRvbiA9IHN0eWxlZChJY29uQnV0dG9uVjIpYFxuICBtYXJnaW4tdG9wOiAtMjBweDtcbiAgei1pbmRleDogJHtzdGFja09yZGVyLm9mZnNldFNpbmdsZX07XG5cbiAgQG1lZGlhIHByaW50IHtcbiAgICBkaXNwbGF5OiBub25lO1xuICB9XG5gO1xuXG5jb25zdCBleHBhbmRlZFN0eWxlID0gY3NzYFxuICBtYXgtaGVpZ2h0OiA1MDB2aDtcbmA7XG5cbmNvbnN0IGV4cGFuZGVkQ29udGVudFN0eWxlID0gY3NzYFxuICBtYXgtaGVpZ2h0OiA1MDB2aDtcbiAgJjphZnRlciB7XG4gICAgb3BhY2l0eTogMDtcbiAgICB6LWluZGV4OiAke3N0YWNrT3JkZXIuaGlkZX07XG4gIH1cbmA7XG5cbmNvbnN0IEZhY3RCb3ggPSBmb3J3YXJkUmVmPEhUTUxFbGVtZW50LCBQcm9wcz4oXG4gICh7IGNoaWxkcmVuLCBvcGVuLCBvbk9wZW5DaGFuZ2UsIGRlZmF1bHRPcGVuID0gZmFsc2UsIC4uLnJlc3QgfSwgcmVmKSA9PiB7XG4gICAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICAgIGNvbnN0IFtpc09wZW4sIHNldElzT3Blbl0gPSB1c2VTdGF0ZShkZWZhdWx0T3Blbik7XG5cbiAgICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgICAgaWYgKG9wZW4gIT09IHVuZGVmaW5lZCkge1xuICAgICAgICBzZXRJc09wZW4ob3Blbik7XG4gICAgICB9XG4gICAgfSwgW29wZW5dKTtcblxuICAgIGNvbnN0IG9uQ2xpY2sgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgICBjb25zdCBuZXdPcGVuID0gIWlzT3BlbjtcbiAgICAgIHNldElzT3BlbihuZXdPcGVuKTtcbiAgICAgIG9uT3BlbkNoYW5nZT8uKG5ld09wZW4pO1xuICAgIH0sIFtpc09wZW4sIG9uT3BlbkNoYW5nZV0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgIDxTdHlsZWRBc2lkZSB7Li4ucmVzdH0gY3NzPXtbaXNPcGVuID8gZXhwYW5kZWRTdHlsZSA6IHVuZGVmaW5lZF19IHJlZj17cmVmfT5cbiAgICAgICAgPFN0eWxlZERpdiBjc3M9e2lzT3BlbiA/IGV4cGFuZGVkQ29udGVudFN0eWxlIDogdW5kZWZpbmVkfT57Y2hpbGRyZW59PC9TdHlsZWREaXY+XG4gICAgICAgIDxTdHlsZWRJY29uQnV0dG9uIG9uQ2xpY2s9e29uQ2xpY2t9IGFyaWEtbGFiZWw9e3QoYGZhY3Rib3guJHtpc09wZW4gPyBcImNsb3NlXCIgOiBcIm9wZW5cIn1gKX0+XG4gICAgICAgICAge2lzT3BlbiA/IDxDaGV2cm9uVXAgLz4gOiA8Q2hldnJvbkRvd24gLz59XG4gICAgICAgIDwvU3R5bGVkSWNvbkJ1dHRvbj5cbiAgICAgIDwvU3R5bGVkQXNpZGU+XG4gICAgKTtcbiAgfSxcbik7XG5cbmV4cG9ydCBkZWZhdWx0IEZhY3RCb3g7XG4iXX0= */")],
     ref: ref,
-    children: [_jsx(StyledDiv, {
-      css: isOpen ? expandedContentStyle : undefined,
-      children: children
-    }), _jsx(StyledIconButton, {
+    children: [_jsx(StyledIconButton, {
+      "data-state": state,
       onClick: onClick,
-      "aria-label": t(`factbox.${isOpen ? "close" : "open"}`),
-      children: isOpen ? _jsx(ChevronUp, {}) : _jsx(ChevronDown, {})
+      "aria-expanded": state === "open",
+      "aria-controls": contentId,
+      "aria-label": t(`factbox.${state === "open" ? "close" : "open"}`),
+      children: _jsx(ChevronDown, {})
+    }), _jsx(StyledContent, {
+      id: contentId,
+      "data-state": state,
+      "aria-hidden": state === "closed",
+      ...inertAttribute,
+      children: children
     })]
   });
 });

package/es/FileList/PdfFile.js

@@ -6,17 +6,35 @@
  *
  */
 
-import { Figure } from "../Figure";
+import { Heading, Figure } from "@ndla/primitives";
+import { styled } from "@ndla/styled-system/jsx";
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+const StyledIframe = styled("iframe", {
+  base: {
+    width: "100%"
+  }
+});
+const StyledFigure = styled(Figure, {
+  base: {
+    display: "flex",
+    flexDirection: "column",
+    gap: "xsmall"
+  }
+});
 const PdfFile = _ref => {
   let {
     title,
     url
   } = _ref;
-  return _jsxs(Figure, {
-    children: [_jsx("h2", {
-      children: title
-    }), _jsx("iframe", {
+  return _jsxs(StyledFigure, {
+    children: [_jsx(Heading, {
+      asChild: true,
+      consumeCss: true,
+      textStyle: "title.medium",
+      children: _jsx("h4", {
+        children: title
+      })
+    }), _jsx(StyledIframe, {
       title: title,
       height: "1050",
       src: url