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

package/lib/CampaignBlock/CampaignBlock.js

@@ -4,100 +4,138 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _htmlReactParser = _interopRequireDefault(require("html-react-parser"));
-var _react = require("@emotion/react");
-var _core = require("@ndla/core");
 var _common = require("@ndla/icons/common");
+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");
 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.
  *
  * 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 Container = /*#__PURE__*/(0, _base.default)("div", {
-  target: "eaovcyh4",
-  label: "Container"
-})("display:flex;flex-direction:column;gap:", _core.spacing.normal, ";border:1px ", _core.colors.brand.lighter, " solid;border-radius:", _core.misc.borderRadius, ";padding:", _core.spacing.normal, ";background-color:", _core.colors.white, ";&[data-image-side=\"right\"]{flex-direction:column-reverse;}", _core.mq.range({
-  from: _core.breakpoints.tabletWide
-}), "{max-width:1100px;flex-direction:row;&[data-image-side=\"right\"]{flex-direction:row-reverse;}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNhbXBhaWduQmxvY2sudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXFDNEIiLCJmaWxlIjoiQ2FtcGFpZ25CbG9jay50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMy1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgcGFyc2UgZnJvbSBcImh0bWwtcmVhY3QtcGFyc2VyXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgYnJlYWtwb2ludHMsIGNvbG9ycywgZm9udHMsIHNwYWNpbmcsIG1xLCBtaXNjIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IEZvcndhcmQgfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5pbXBvcnQgeyBTYWZlTGluayB9IGZyb20gXCJAbmRsYS9zYWZlbGlua1wiO1xuaW1wb3J0IHsgSGVhZGluZ0xldmVsIH0gZnJvbSBcIkBuZGxhL3R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IGdldFBvc3NpYmx5UmVsYXRpdmVVcmwgfSBmcm9tIFwiLi4vdXRpbHMvcmVsYXRpdmVVcmxcIjtcblxuaW50ZXJmYWNlIEltYWdlIHtcbiAgc3JjOiBzdHJpbmc7XG4gIGFsdDogc3RyaW5nO1xufVxuXG5pbnRlcmZhY2UgUHJvcHMge1xuICB0aXRsZTogc3RyaW5nO1xuICBkZXNjcmlwdGlvbjogc3RyaW5nO1xuICBoZWFkaW5nTGV2ZWw/OiBIZWFkaW5nTGV2ZWw7XG4gIHVybDoge1xuICAgIHVybD86IHN0cmluZztcbiAgICB0ZXh0Pzogc3RyaW5nO1xuICB9O1xuICBpbWFnZT86IEltYWdlO1xuICBpbWFnZVNpZGU/OiBcImxlZnRcIiB8IFwicmlnaHRcIjtcbiAgY2xhc3NOYW1lPzogc3RyaW5nO1xuICBwYXRoPzogc3RyaW5nO1xufVxuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBnYXA6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBib3JkZXI6IDFweCAke2NvbG9ycy5icmFuZC5saWdodGVyfSBzb2xpZDtcbiAgYm9yZGVyLXJhZGl1czogJHttaXNjLmJvcmRlclJhZGl1c307XG4gIHBhZGRpbmc6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2NvbG9ycy53aGl0ZX07XG4gICZbZGF0YS1pbWFnZS1zaWRlPVwicmlnaHRcIl0ge1xuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW4tcmV2ZXJzZTtcbiAgfVxuICAke21xLnJhbmdlKHsgZnJvbTogYnJlYWtwb2ludHMudGFibGV0V2lkZSB9KX0ge1xuICAgIG1heC13aWR0aDogMTEwMHB4O1xuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XG4gICAgJltkYXRhLWltYWdlLXNpZGU9XCJyaWdodFwiXSB7XG4gICAgICBmbGV4LWRpcmVjdGlvbjogcm93LXJldmVyc2U7XG4gICAgfVxuICB9XG5gO1xuXG5jb25zdCBoZWFkaW5nU3R5bGUgPSBjc3NgXG4gIG1hcmdpbjogMDtcbmA7XG5cbmNvbnN0IFN0eWxlZERlc2NyaXB0aW9uID0gc3R5bGVkLnBgXG4gIGZvbnQtZmFtaWx5OiAke2ZvbnRzLnNlcmlmfTtcbiAgbWFyZ2luOiAke3NwYWNpbmcubm9ybWFsfSAwICR7c3BhY2luZy5tZWRpdW19O1xuYDtcblxuY29uc3QgU3R5bGVkSW1nID0gc3R5bGVkLmltZ2BcbiAgYWxpZ24tc2VsZjogY2VudGVyO1xuICBvYmplY3QtZml0OiBjb250YWluO1xuYDtcblxuY29uc3QgU3R5bGVkTGluayA9IHN0eWxlZChTYWZlTGluaylgXG4gIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBnYXA6ICR7c3BhY2luZy54eHNtYWxsfTtcbiAgY29sb3I6ICR7Y29sb3JzLmJyYW5kLnByaW1hcnl9O1xuYDtcblxuY29uc3QgVGV4dFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBmbGV4LWdyb3c6IDE7XG5gO1xuXG5jb25zdCBDYW1wYWlnbkJsb2NrID0gKHtcbiAgdGl0bGUsXG4gIGltYWdlLFxuICBpbWFnZVNpZGUgPSBcImxlZnRcIixcbiAgZGVzY3JpcHRpb24sXG4gIGhlYWRpbmdMZXZlbDogSGVhZGluZyA9IFwiaDJcIixcbiAgdXJsLFxuICBwYXRoLFxuICBjbGFzc05hbWUsXG59OiBQcm9wcykgPT4ge1xuICByZXR1cm4gKFxuICAgIDxDb250YWluZXIgY2xhc3NOYW1lPXtjbGFzc05hbWV9IGRhdGEtdHlwZT1cImNhbXBhaWduLWJsb2NrXCIgZGF0YS1pbWFnZS1zaWRlPXtpbWFnZVNpZGV9PlxuICAgICAge2ltYWdlICYmIDxTdHlsZWRJbWcgc3JjPXtgJHtpbWFnZS5zcmN9P3dpZHRoPTI0MGB9IGhlaWdodD17MjAwfSB3aWR0aD17MjQwfSBhbHQ9e2ltYWdlLmFsdH0gLz59XG4gICAgICA8VGV4dFdyYXBwZXI+XG4gICAgICAgIDxIZWFkaW5nIGNzcz17aGVhZGluZ1N0eWxlfT57cGFyc2UodGl0bGUpfTwvSGVhZGluZz5cbiAgICAgICAgPFN0eWxlZERlc2NyaXB0aW9uPntwYXJzZShkZXNjcmlwdGlvbil9PC9TdHlsZWREZXNjcmlwdGlvbj5cbiAgICAgICAgeyEhdXJsPy51cmwgJiYgKFxuICAgICAgICAgIDxTdHlsZWRMaW5rIHRvPXtnZXRQb3NzaWJseVJlbGF0aXZlVXJsKHVybC51cmwsIHBhdGgpfT5cbiAgICAgICAgICAgIHtwYXJzZSh1cmwudGV4dCA/PyBcIlwiKX1cbiAgICAgICAgICAgIDxGb3J3YXJkIC8+XG4gICAgICAgICAgPC9TdHlsZWRMaW5rPlxuICAgICAgICApfVxuICAgICAgPC9UZXh0V3JhcHBlcj5cbiAgICA8L0NvbnRhaW5lcj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IENhbXBhaWduQmxvY2s7XG4iXX0= */"));
-const headingStyle = process.env.NODE_ENV === "production" ? {
-  name: "iu0jdc-headingStyle",
-  styles: "margin:0;label:headingStyle;"
-} : {
-  name: "iu0jdc-headingStyle",
-  styles: "margin:0;label:headingStyle;",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNhbXBhaWduQmxvY2sudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXlEd0IiLCJmaWxlIjoiQ2FtcGFpZ25CbG9jay50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMy1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgcGFyc2UgZnJvbSBcImh0bWwtcmVhY3QtcGFyc2VyXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgYnJlYWtwb2ludHMsIGNvbG9ycywgZm9udHMsIHNwYWNpbmcsIG1xLCBtaXNjIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IEZvcndhcmQgfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5pbXBvcnQgeyBTYWZlTGluayB9IGZyb20gXCJAbmRsYS9zYWZlbGlua1wiO1xuaW1wb3J0IHsgSGVhZGluZ0xldmVsIH0gZnJvbSBcIkBuZGxhL3R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IGdldFBvc3NpYmx5UmVsYXRpdmVVcmwgfSBmcm9tIFwiLi4vdXRpbHMvcmVsYXRpdmVVcmxcIjtcblxuaW50ZXJmYWNlIEltYWdlIHtcbiAgc3JjOiBzdHJpbmc7XG4gIGFsdDogc3RyaW5nO1xufVxuXG5pbnRlcmZhY2UgUHJvcHMge1xuICB0aXRsZTogc3RyaW5nO1xuICBkZXNjcmlwdGlvbjogc3RyaW5nO1xuICBoZWFkaW5nTGV2ZWw/OiBIZWFkaW5nTGV2ZWw7XG4gIHVybDoge1xuICAgIHVybD86IHN0cmluZztcbiAgICB0ZXh0Pzogc3RyaW5nO1xuICB9O1xuICBpbWFnZT86IEltYWdlO1xuICBpbWFnZVNpZGU/OiBcImxlZnRcIiB8IFwicmlnaHRcIjtcbiAgY2xhc3NOYW1lPzogc3RyaW5nO1xuICBwYXRoPzogc3RyaW5nO1xufVxuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBnYXA6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBib3JkZXI6IDFweCAke2NvbG9ycy5icmFuZC5saWdodGVyfSBzb2xpZDtcbiAgYm9yZGVyLXJhZGl1czogJHttaXNjLmJvcmRlclJhZGl1c307XG4gIHBhZGRpbmc6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2NvbG9ycy53aGl0ZX07XG4gICZbZGF0YS1pbWFnZS1zaWRlPVwicmlnaHRcIl0ge1xuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW4tcmV2ZXJzZTtcbiAgfVxuICAke21xLnJhbmdlKHsgZnJvbTogYnJlYWtwb2ludHMudGFibGV0V2lkZSB9KX0ge1xuICAgIG1heC13aWR0aDogMTEwMHB4O1xuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XG4gICAgJltkYXRhLWltYWdlLXNpZGU9XCJyaWdodFwiXSB7XG4gICAgICBmbGV4LWRpcmVjdGlvbjogcm93LXJldmVyc2U7XG4gICAgfVxuICB9XG5gO1xuXG5jb25zdCBoZWFkaW5nU3R5bGUgPSBjc3NgXG4gIG1hcmdpbjogMDtcbmA7XG5cbmNvbnN0IFN0eWxlZERlc2NyaXB0aW9uID0gc3R5bGVkLnBgXG4gIGZvbnQtZmFtaWx5OiAke2ZvbnRzLnNlcmlmfTtcbiAgbWFyZ2luOiAke3NwYWNpbmcubm9ybWFsfSAwICR7c3BhY2luZy5tZWRpdW19O1xuYDtcblxuY29uc3QgU3R5bGVkSW1nID0gc3R5bGVkLmltZ2BcbiAgYWxpZ24tc2VsZjogY2VudGVyO1xuICBvYmplY3QtZml0OiBjb250YWluO1xuYDtcblxuY29uc3QgU3R5bGVkTGluayA9IHN0eWxlZChTYWZlTGluaylgXG4gIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBnYXA6ICR7c3BhY2luZy54eHNtYWxsfTtcbiAgY29sb3I6ICR7Y29sb3JzLmJyYW5kLnByaW1hcnl9O1xuYDtcblxuY29uc3QgVGV4dFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBmbGV4LWdyb3c6IDE7XG5gO1xuXG5jb25zdCBDYW1wYWlnbkJsb2NrID0gKHtcbiAgdGl0bGUsXG4gIGltYWdlLFxuICBpbWFnZVNpZGUgPSBcImxlZnRcIixcbiAgZGVzY3JpcHRpb24sXG4gIGhlYWRpbmdMZXZlbDogSGVhZGluZyA9IFwiaDJcIixcbiAgdXJsLFxuICBwYXRoLFxuICBjbGFzc05hbWUsXG59OiBQcm9wcykgPT4ge1xuICByZXR1cm4gKFxuICAgIDxDb250YWluZXIgY2xhc3NOYW1lPXtjbGFzc05hbWV9IGRhdGEtdHlwZT1cImNhbXBhaWduLWJsb2NrXCIgZGF0YS1pbWFnZS1zaWRlPXtpbWFnZVNpZGV9PlxuICAgICAge2ltYWdlICYmIDxTdHlsZWRJbWcgc3JjPXtgJHtpbWFnZS5zcmN9P3dpZHRoPTI0MGB9IGhlaWdodD17MjAwfSB3aWR0aD17MjQwfSBhbHQ9e2ltYWdlLmFsdH0gLz59XG4gICAgICA8VGV4dFdyYXBwZXI+XG4gICAgICAgIDxIZWFkaW5nIGNzcz17aGVhZGluZ1N0eWxlfT57cGFyc2UodGl0bGUpfTwvSGVhZGluZz5cbiAgICAgICAgPFN0eWxlZERlc2NyaXB0aW9uPntwYXJzZShkZXNjcmlwdGlvbil9PC9TdHlsZWREZXNjcmlwdGlvbj5cbiAgICAgICAgeyEhdXJsPy51cmwgJiYgKFxuICAgICAgICAgIDxTdHlsZWRMaW5rIHRvPXtnZXRQb3NzaWJseVJlbGF0aXZlVXJsKHVybC51cmwsIHBhdGgpfT5cbiAgICAgICAgICAgIHtwYXJzZSh1cmwudGV4dCA/PyBcIlwiKX1cbiAgICAgICAgICAgIDxGb3J3YXJkIC8+XG4gICAgICAgICAgPC9TdHlsZWRMaW5rPlxuICAgICAgICApfVxuICAgICAgPC9UZXh0V3JhcHBlcj5cbiAgICA8L0NvbnRhaW5lcj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IENhbXBhaWduQmxvY2s7XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-};
-const StyledDescription = /*#__PURE__*/(0, _base.default)("p", {
-  target: "eaovcyh3",
-  label: "StyledDescription"
-})("font-family:", _core.fonts.serif, ";margin:", _core.spacing.normal, " 0 ", _core.spacing.medium, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNhbXBhaWduQmxvY2sudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTZEa0MiLCJmaWxlIjoiQ2FtcGFpZ25CbG9jay50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMy1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgcGFyc2UgZnJvbSBcImh0bWwtcmVhY3QtcGFyc2VyXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgYnJlYWtwb2ludHMsIGNvbG9ycywgZm9udHMsIHNwYWNpbmcsIG1xLCBtaXNjIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IEZvcndhcmQgfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5pbXBvcnQgeyBTYWZlTGluayB9IGZyb20gXCJAbmRsYS9zYWZlbGlua1wiO1xuaW1wb3J0IHsgSGVhZGluZ0xldmVsIH0gZnJvbSBcIkBuZGxhL3R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IGdldFBvc3NpYmx5UmVsYXRpdmVVcmwgfSBmcm9tIFwiLi4vdXRpbHMvcmVsYXRpdmVVcmxcIjtcblxuaW50ZXJmYWNlIEltYWdlIHtcbiAgc3JjOiBzdHJpbmc7XG4gIGFsdDogc3RyaW5nO1xufVxuXG5pbnRlcmZhY2UgUHJvcHMge1xuICB0aXRsZTogc3RyaW5nO1xuICBkZXNjcmlwdGlvbjogc3RyaW5nO1xuICBoZWFkaW5nTGV2ZWw/OiBIZWFkaW5nTGV2ZWw7XG4gIHVybDoge1xuICAgIHVybD86IHN0cmluZztcbiAgICB0ZXh0Pzogc3RyaW5nO1xuICB9O1xuICBpbWFnZT86IEltYWdlO1xuICBpbWFnZVNpZGU/OiBcImxlZnRcIiB8IFwicmlnaHRcIjtcbiAgY2xhc3NOYW1lPzogc3RyaW5nO1xuICBwYXRoPzogc3RyaW5nO1xufVxuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBnYXA6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBib3JkZXI6IDFweCAke2NvbG9ycy5icmFuZC5saWdodGVyfSBzb2xpZDtcbiAgYm9yZGVyLXJhZGl1czogJHttaXNjLmJvcmRlclJhZGl1c307XG4gIHBhZGRpbmc6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2NvbG9ycy53aGl0ZX07XG4gICZbZGF0YS1pbWFnZS1zaWRlPVwicmlnaHRcIl0ge1xuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW4tcmV2ZXJzZTtcbiAgfVxuICAke21xLnJhbmdlKHsgZnJvbTogYnJlYWtwb2ludHMudGFibGV0V2lkZSB9KX0ge1xuICAgIG1heC13aWR0aDogMTEwMHB4O1xuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XG4gICAgJltkYXRhLWltYWdlLXNpZGU9XCJyaWdodFwiXSB7XG4gICAgICBmbGV4LWRpcmVjdGlvbjogcm93LXJldmVyc2U7XG4gICAgfVxuICB9XG5gO1xuXG5jb25zdCBoZWFkaW5nU3R5bGUgPSBjc3NgXG4gIG1hcmdpbjogMDtcbmA7XG5cbmNvbnN0IFN0eWxlZERlc2NyaXB0aW9uID0gc3R5bGVkLnBgXG4gIGZvbnQtZmFtaWx5OiAke2ZvbnRzLnNlcmlmfTtcbiAgbWFyZ2luOiAke3NwYWNpbmcubm9ybWFsfSAwICR7c3BhY2luZy5tZWRpdW19O1xuYDtcblxuY29uc3QgU3R5bGVkSW1nID0gc3R5bGVkLmltZ2BcbiAgYWxpZ24tc2VsZjogY2VudGVyO1xuICBvYmplY3QtZml0OiBjb250YWluO1xuYDtcblxuY29uc3QgU3R5bGVkTGluayA9IHN0eWxlZChTYWZlTGluaylgXG4gIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBnYXA6ICR7c3BhY2luZy54eHNtYWxsfTtcbiAgY29sb3I6ICR7Y29sb3JzLmJyYW5kLnByaW1hcnl9O1xuYDtcblxuY29uc3QgVGV4dFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBmbGV4LWdyb3c6IDE7XG5gO1xuXG5jb25zdCBDYW1wYWlnbkJsb2NrID0gKHtcbiAgdGl0bGUsXG4gIGltYWdlLFxuICBpbWFnZVNpZGUgPSBcImxlZnRcIixcbiAgZGVzY3JpcHRpb24sXG4gIGhlYWRpbmdMZXZlbDogSGVhZGluZyA9IFwiaDJcIixcbiAgdXJsLFxuICBwYXRoLFxuICBjbGFzc05hbWUsXG59OiBQcm9wcykgPT4ge1xuICByZXR1cm4gKFxuICAgIDxDb250YWluZXIgY2xhc3NOYW1lPXtjbGFzc05hbWV9IGRhdGEtdHlwZT1cImNhbXBhaWduLWJsb2NrXCIgZGF0YS1pbWFnZS1zaWRlPXtpbWFnZVNpZGV9PlxuICAgICAge2ltYWdlICYmIDxTdHlsZWRJbWcgc3JjPXtgJHtpbWFnZS5zcmN9P3dpZHRoPTI0MGB9IGhlaWdodD17MjAwfSB3aWR0aD17MjQwfSBhbHQ9e2ltYWdlLmFsdH0gLz59XG4gICAgICA8VGV4dFdyYXBwZXI+XG4gICAgICAgIDxIZWFkaW5nIGNzcz17aGVhZGluZ1N0eWxlfT57cGFyc2UodGl0bGUpfTwvSGVhZGluZz5cbiAgICAgICAgPFN0eWxlZERlc2NyaXB0aW9uPntwYXJzZShkZXNjcmlwdGlvbil9PC9TdHlsZWREZXNjcmlwdGlvbj5cbiAgICAgICAgeyEhdXJsPy51cmwgJiYgKFxuICAgICAgICAgIDxTdHlsZWRMaW5rIHRvPXtnZXRQb3NzaWJseVJlbGF0aXZlVXJsKHVybC51cmwsIHBhdGgpfT5cbiAgICAgICAgICAgIHtwYXJzZSh1cmwudGV4dCA/PyBcIlwiKX1cbiAgICAgICAgICAgIDxGb3J3YXJkIC8+XG4gICAgICAgICAgPC9TdHlsZWRMaW5rPlxuICAgICAgICApfVxuICAgICAgPC9UZXh0V3JhcHBlcj5cbiAgICA8L0NvbnRhaW5lcj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IENhbXBhaWduQmxvY2s7XG4iXX0= */"));
-const StyledImg = /*#__PURE__*/(0, _base.default)("img", {
-  target: "eaovcyh2",
-  label: "StyledImg"
-})(process.env.NODE_ENV === "production" ? {
-  name: "vf9pfp",
-  styles: "align-self:center;object-fit:contain"
-} : {
-  name: "vf9pfp",
-  styles: "align-self:center;object-fit:contain",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNhbXBhaWduQmxvY2sudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtFNEIiLCJmaWxlIjoiQ2FtcGFpZ25CbG9jay50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMy1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgcGFyc2UgZnJvbSBcImh0bWwtcmVhY3QtcGFyc2VyXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgYnJlYWtwb2ludHMsIGNvbG9ycywgZm9udHMsIHNwYWNpbmcsIG1xLCBtaXNjIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IEZvcndhcmQgfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5pbXBvcnQgeyBTYWZlTGluayB9IGZyb20gXCJAbmRsYS9zYWZlbGlua1wiO1xuaW1wb3J0IHsgSGVhZGluZ0xldmVsIH0gZnJvbSBcIkBuZGxhL3R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IGdldFBvc3NpYmx5UmVsYXRpdmVVcmwgfSBmcm9tIFwiLi4vdXRpbHMvcmVsYXRpdmVVcmxcIjtcblxuaW50ZXJmYWNlIEltYWdlIHtcbiAgc3JjOiBzdHJpbmc7XG4gIGFsdDogc3RyaW5nO1xufVxuXG5pbnRlcmZhY2UgUHJvcHMge1xuICB0aXRsZTogc3RyaW5nO1xuICBkZXNjcmlwdGlvbjogc3RyaW5nO1xuICBoZWFkaW5nTGV2ZWw/OiBIZWFkaW5nTGV2ZWw7XG4gIHVybDoge1xuICAgIHVybD86IHN0cmluZztcbiAgICB0ZXh0Pzogc3RyaW5nO1xuICB9O1xuICBpbWFnZT86IEltYWdlO1xuICBpbWFnZVNpZGU/OiBcImxlZnRcIiB8IFwicmlnaHRcIjtcbiAgY2xhc3NOYW1lPzogc3RyaW5nO1xuICBwYXRoPzogc3RyaW5nO1xufVxuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBnYXA6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBib3JkZXI6IDFweCAke2NvbG9ycy5icmFuZC5saWdodGVyfSBzb2xpZDtcbiAgYm9yZGVyLXJhZGl1czogJHttaXNjLmJvcmRlclJhZGl1c307XG4gIHBhZGRpbmc6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2NvbG9ycy53aGl0ZX07XG4gICZbZGF0YS1pbWFnZS1zaWRlPVwicmlnaHRcIl0ge1xuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW4tcmV2ZXJzZTtcbiAgfVxuICAke21xLnJhbmdlKHsgZnJvbTogYnJlYWtwb2ludHMudGFibGV0V2lkZSB9KX0ge1xuICAgIG1heC13aWR0aDogMTEwMHB4O1xuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XG4gICAgJltkYXRhLWltYWdlLXNpZGU9XCJyaWdodFwiXSB7XG4gICAgICBmbGV4LWRpcmVjdGlvbjogcm93LXJldmVyc2U7XG4gICAgfVxuICB9XG5gO1xuXG5jb25zdCBoZWFkaW5nU3R5bGUgPSBjc3NgXG4gIG1hcmdpbjogMDtcbmA7XG5cbmNvbnN0IFN0eWxlZERlc2NyaXB0aW9uID0gc3R5bGVkLnBgXG4gIGZvbnQtZmFtaWx5OiAke2ZvbnRzLnNlcmlmfTtcbiAgbWFyZ2luOiAke3NwYWNpbmcubm9ybWFsfSAwICR7c3BhY2luZy5tZWRpdW19O1xuYDtcblxuY29uc3QgU3R5bGVkSW1nID0gc3R5bGVkLmltZ2BcbiAgYWxpZ24tc2VsZjogY2VudGVyO1xuICBvYmplY3QtZml0OiBjb250YWluO1xuYDtcblxuY29uc3QgU3R5bGVkTGluayA9IHN0eWxlZChTYWZlTGluaylgXG4gIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBnYXA6ICR7c3BhY2luZy54eHNtYWxsfTtcbiAgY29sb3I6ICR7Y29sb3JzLmJyYW5kLnByaW1hcnl9O1xuYDtcblxuY29uc3QgVGV4dFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBmbGV4LWdyb3c6IDE7XG5gO1xuXG5jb25zdCBDYW1wYWlnbkJsb2NrID0gKHtcbiAgdGl0bGUsXG4gIGltYWdlLFxuICBpbWFnZVNpZGUgPSBcImxlZnRcIixcbiAgZGVzY3JpcHRpb24sXG4gIGhlYWRpbmdMZXZlbDogSGVhZGluZyA9IFwiaDJcIixcbiAgdXJsLFxuICBwYXRoLFxuICBjbGFzc05hbWUsXG59OiBQcm9wcykgPT4ge1xuICByZXR1cm4gKFxuICAgIDxDb250YWluZXIgY2xhc3NOYW1lPXtjbGFzc05hbWV9IGRhdGEtdHlwZT1cImNhbXBhaWduLWJsb2NrXCIgZGF0YS1pbWFnZS1zaWRlPXtpbWFnZVNpZGV9PlxuICAgICAge2ltYWdlICYmIDxTdHlsZWRJbWcgc3JjPXtgJHtpbWFnZS5zcmN9P3dpZHRoPTI0MGB9IGhlaWdodD17MjAwfSB3aWR0aD17MjQwfSBhbHQ9e2ltYWdlLmFsdH0gLz59XG4gICAgICA8VGV4dFdyYXBwZXI+XG4gICAgICAgIDxIZWFkaW5nIGNzcz17aGVhZGluZ1N0eWxlfT57cGFyc2UodGl0bGUpfTwvSGVhZGluZz5cbiAgICAgICAgPFN0eWxlZERlc2NyaXB0aW9uPntwYXJzZShkZXNjcmlwdGlvbil9PC9TdHlsZWREZXNjcmlwdGlvbj5cbiAgICAgICAgeyEhdXJsPy51cmwgJiYgKFxuICAgICAgICAgIDxTdHlsZWRMaW5rIHRvPXtnZXRQb3NzaWJseVJlbGF0aXZlVXJsKHVybC51cmwsIHBhdGgpfT5cbiAgICAgICAgICAgIHtwYXJzZSh1cmwudGV4dCA/PyBcIlwiKX1cbiAgICAgICAgICAgIDxGb3J3YXJkIC8+XG4gICAgICAgICAgPC9TdHlsZWRMaW5rPlxuICAgICAgICApfVxuICAgICAgPC9UZXh0V3JhcHBlcj5cbiAgICA8L0NvbnRhaW5lcj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IENhbXBhaWduQmxvY2s7XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+ */
+
+const Container = (0, _jsx2.styled)("div", {
+  base: {
+    display: "flex",
+    flexDirection: "column",
+    border: "1px solid",
+    borderColor: "stroke.default",
+    backgroundColor: "background.default",
+    borderRadius: "xsmall",
+    boxShadow: "full",
+    maxWidth: "surface.xsmall",
+    overflow: "hidden",
+    mobileWide: {
+      maxWidth: "surface.medium"
+    },
+    tabletWide: {
+      // TODO: This is probably not the correct max-width. And it should be a token
+      maxWidth: "1100px",
+      flexDirection: "row"
+    }
+  }
+});
+const LinkText = (0, _jsx2.styled)(_primitives.Text, {
+  base: {
+    display: "flex",
+    gap: "xxsmall",
+    textDecoration: "underline",
+    _hover: {
+      textDecoration: "none"
+    }
+  }
 });
-const StyledLink = /*#__PURE__*/(0, _base.default)(_safelink.SafeLink, {
-  target: "eaovcyh1",
-  label: "StyledLink"
-})("display:inline-flex;align-items:center;gap:", _core.spacing.xxsmall, ";color:", _core.colors.brand.primary, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNhbXBhaWduQmxvY2sudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXVFbUMiLCJmaWxlIjoiQ2FtcGFpZ25CbG9jay50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMy1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgcGFyc2UgZnJvbSBcImh0bWwtcmVhY3QtcGFyc2VyXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgYnJlYWtwb2ludHMsIGNvbG9ycywgZm9udHMsIHNwYWNpbmcsIG1xLCBtaXNjIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IEZvcndhcmQgfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5pbXBvcnQgeyBTYWZlTGluayB9IGZyb20gXCJAbmRsYS9zYWZlbGlua1wiO1xuaW1wb3J0IHsgSGVhZGluZ0xldmVsIH0gZnJvbSBcIkBuZGxhL3R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IGdldFBvc3NpYmx5UmVsYXRpdmVVcmwgfSBmcm9tIFwiLi4vdXRpbHMvcmVsYXRpdmVVcmxcIjtcblxuaW50ZXJmYWNlIEltYWdlIHtcbiAgc3JjOiBzdHJpbmc7XG4gIGFsdDogc3RyaW5nO1xufVxuXG5pbnRlcmZhY2UgUHJvcHMge1xuICB0aXRsZTogc3RyaW5nO1xuICBkZXNjcmlwdGlvbjogc3RyaW5nO1xuICBoZWFkaW5nTGV2ZWw/OiBIZWFkaW5nTGV2ZWw7XG4gIHVybDoge1xuICAgIHVybD86IHN0cmluZztcbiAgICB0ZXh0Pzogc3RyaW5nO1xuICB9O1xuICBpbWFnZT86IEltYWdlO1xuICBpbWFnZVNpZGU/OiBcImxlZnRcIiB8IFwicmlnaHRcIjtcbiAgY2xhc3NOYW1lPzogc3RyaW5nO1xuICBwYXRoPzogc3RyaW5nO1xufVxuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBnYXA6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBib3JkZXI6IDFweCAke2NvbG9ycy5icmFuZC5saWdodGVyfSBzb2xpZDtcbiAgYm9yZGVyLXJhZGl1czogJHttaXNjLmJvcmRlclJhZGl1c307XG4gIHBhZGRpbmc6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2NvbG9ycy53aGl0ZX07XG4gICZbZGF0YS1pbWFnZS1zaWRlPVwicmlnaHRcIl0ge1xuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW4tcmV2ZXJzZTtcbiAgfVxuICAke21xLnJhbmdlKHsgZnJvbTogYnJlYWtwb2ludHMudGFibGV0V2lkZSB9KX0ge1xuICAgIG1heC13aWR0aDogMTEwMHB4O1xuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XG4gICAgJltkYXRhLWltYWdlLXNpZGU9XCJyaWdodFwiXSB7XG4gICAgICBmbGV4LWRpcmVjdGlvbjogcm93LXJldmVyc2U7XG4gICAgfVxuICB9XG5gO1xuXG5jb25zdCBoZWFkaW5nU3R5bGUgPSBjc3NgXG4gIG1hcmdpbjogMDtcbmA7XG5cbmNvbnN0IFN0eWxlZERlc2NyaXB0aW9uID0gc3R5bGVkLnBgXG4gIGZvbnQtZmFtaWx5OiAke2ZvbnRzLnNlcmlmfTtcbiAgbWFyZ2luOiAke3NwYWNpbmcubm9ybWFsfSAwICR7c3BhY2luZy5tZWRpdW19O1xuYDtcblxuY29uc3QgU3R5bGVkSW1nID0gc3R5bGVkLmltZ2BcbiAgYWxpZ24tc2VsZjogY2VudGVyO1xuICBvYmplY3QtZml0OiBjb250YWluO1xuYDtcblxuY29uc3QgU3R5bGVkTGluayA9IHN0eWxlZChTYWZlTGluaylgXG4gIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBnYXA6ICR7c3BhY2luZy54eHNtYWxsfTtcbiAgY29sb3I6ICR7Y29sb3JzLmJyYW5kLnByaW1hcnl9O1xuYDtcblxuY29uc3QgVGV4dFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBmbGV4LWdyb3c6IDE7XG5gO1xuXG5jb25zdCBDYW1wYWlnbkJsb2NrID0gKHtcbiAgdGl0bGUsXG4gIGltYWdlLFxuICBpbWFnZVNpZGUgPSBcImxlZnRcIixcbiAgZGVzY3JpcHRpb24sXG4gIGhlYWRpbmdMZXZlbDogSGVhZGluZyA9IFwiaDJcIixcbiAgdXJsLFxuICBwYXRoLFxuICBjbGFzc05hbWUsXG59OiBQcm9wcykgPT4ge1xuICByZXR1cm4gKFxuICAgIDxDb250YWluZXIgY2xhc3NOYW1lPXtjbGFzc05hbWV9IGRhdGEtdHlwZT1cImNhbXBhaWduLWJsb2NrXCIgZGF0YS1pbWFnZS1zaWRlPXtpbWFnZVNpZGV9PlxuICAgICAge2ltYWdlICYmIDxTdHlsZWRJbWcgc3JjPXtgJHtpbWFnZS5zcmN9P3dpZHRoPTI0MGB9IGhlaWdodD17MjAwfSB3aWR0aD17MjQwfSBhbHQ9e2ltYWdlLmFsdH0gLz59XG4gICAgICA8VGV4dFdyYXBwZXI+XG4gICAgICAgIDxIZWFkaW5nIGNzcz17aGVhZGluZ1N0eWxlfT57cGFyc2UodGl0bGUpfTwvSGVhZGluZz5cbiAgICAgICAgPFN0eWxlZERlc2NyaXB0aW9uPntwYXJzZShkZXNjcmlwdGlvbil9PC9TdHlsZWREZXNjcmlwdGlvbj5cbiAgICAgICAgeyEhdXJsPy51cmwgJiYgKFxuICAgICAgICAgIDxTdHlsZWRMaW5rIHRvPXtnZXRQb3NzaWJseVJlbGF0aXZlVXJsKHVybC51cmwsIHBhdGgpfT5cbiAgICAgICAgICAgIHtwYXJzZSh1cmwudGV4dCA/PyBcIlwiKX1cbiAgICAgICAgICAgIDxGb3J3YXJkIC8+XG4gICAgICAgICAgPC9TdHlsZWRMaW5rPlxuICAgICAgICApfVxuICAgICAgPC9UZXh0V3JhcHBlcj5cbiAgICA8L0NvbnRhaW5lcj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IENhbXBhaWduQmxvY2s7XG4iXX0= */"));
-const TextWrapper = /*#__PURE__*/(0, _base.default)("div", {
-  target: "eaovcyh0",
-  label: "TextWrapper"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1ff36h2",
-  styles: "flex-grow:1"
-} : {
-  name: "1ff36h2",
-  styles: "flex-grow:1",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNhbXBhaWduQmxvY2sudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQThFOEIiLCJmaWxlIjoiQ2FtcGFpZ25CbG9jay50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMy1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbi8qKiBAanN4SW1wb3J0U291cmNlIEBlbW90aW9uL3JlYWN0ICovXG5pbXBvcnQgcGFyc2UgZnJvbSBcImh0bWwtcmVhY3QtcGFyc2VyXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgYnJlYWtwb2ludHMsIGNvbG9ycywgZm9udHMsIHNwYWNpbmcsIG1xLCBtaXNjIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcbmltcG9ydCB7IEZvcndhcmQgfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5pbXBvcnQgeyBTYWZlTGluayB9IGZyb20gXCJAbmRsYS9zYWZlbGlua1wiO1xuaW1wb3J0IHsgSGVhZGluZ0xldmVsIH0gZnJvbSBcIkBuZGxhL3R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IGdldFBvc3NpYmx5UmVsYXRpdmVVcmwgfSBmcm9tIFwiLi4vdXRpbHMvcmVsYXRpdmVVcmxcIjtcblxuaW50ZXJmYWNlIEltYWdlIHtcbiAgc3JjOiBzdHJpbmc7XG4gIGFsdDogc3RyaW5nO1xufVxuXG5pbnRlcmZhY2UgUHJvcHMge1xuICB0aXRsZTogc3RyaW5nO1xuICBkZXNjcmlwdGlvbjogc3RyaW5nO1xuICBoZWFkaW5nTGV2ZWw/OiBIZWFkaW5nTGV2ZWw7XG4gIHVybDoge1xuICAgIHVybD86IHN0cmluZztcbiAgICB0ZXh0Pzogc3RyaW5nO1xuICB9O1xuICBpbWFnZT86IEltYWdlO1xuICBpbWFnZVNpZGU/OiBcImxlZnRcIiB8IFwicmlnaHRcIjtcbiAgY2xhc3NOYW1lPzogc3RyaW5nO1xuICBwYXRoPzogc3RyaW5nO1xufVxuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBnYXA6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBib3JkZXI6IDFweCAke2NvbG9ycy5icmFuZC5saWdodGVyfSBzb2xpZDtcbiAgYm9yZGVyLXJhZGl1czogJHttaXNjLmJvcmRlclJhZGl1c307XG4gIHBhZGRpbmc6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke2NvbG9ycy53aGl0ZX07XG4gICZbZGF0YS1pbWFnZS1zaWRlPVwicmlnaHRcIl0ge1xuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW4tcmV2ZXJzZTtcbiAgfVxuICAke21xLnJhbmdlKHsgZnJvbTogYnJlYWtwb2ludHMudGFibGV0V2lkZSB9KX0ge1xuICAgIG1heC13aWR0aDogMTEwMHB4O1xuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XG4gICAgJltkYXRhLWltYWdlLXNpZGU9XCJyaWdodFwiXSB7XG4gICAgICBmbGV4LWRpcmVjdGlvbjogcm93LXJldmVyc2U7XG4gICAgfVxuICB9XG5gO1xuXG5jb25zdCBoZWFkaW5nU3R5bGUgPSBjc3NgXG4gIG1hcmdpbjogMDtcbmA7XG5cbmNvbnN0IFN0eWxlZERlc2NyaXB0aW9uID0gc3R5bGVkLnBgXG4gIGZvbnQtZmFtaWx5OiAke2ZvbnRzLnNlcmlmfTtcbiAgbWFyZ2luOiAke3NwYWNpbmcubm9ybWFsfSAwICR7c3BhY2luZy5tZWRpdW19O1xuYDtcblxuY29uc3QgU3R5bGVkSW1nID0gc3R5bGVkLmltZ2BcbiAgYWxpZ24tc2VsZjogY2VudGVyO1xuICBvYmplY3QtZml0OiBjb250YWluO1xuYDtcblxuY29uc3QgU3R5bGVkTGluayA9IHN0eWxlZChTYWZlTGluaylgXG4gIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBnYXA6ICR7c3BhY2luZy54eHNtYWxsfTtcbiAgY29sb3I6ICR7Y29sb3JzLmJyYW5kLnByaW1hcnl9O1xuYDtcblxuY29uc3QgVGV4dFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBmbGV4LWdyb3c6IDE7XG5gO1xuXG5jb25zdCBDYW1wYWlnbkJsb2NrID0gKHtcbiAgdGl0bGUsXG4gIGltYWdlLFxuICBpbWFnZVNpZGUgPSBcImxlZnRcIixcbiAgZGVzY3JpcHRpb24sXG4gIGhlYWRpbmdMZXZlbDogSGVhZGluZyA9IFwiaDJcIixcbiAgdXJsLFxuICBwYXRoLFxuICBjbGFzc05hbWUsXG59OiBQcm9wcykgPT4ge1xuICByZXR1cm4gKFxuICAgIDxDb250YWluZXIgY2xhc3NOYW1lPXtjbGFzc05hbWV9IGRhdGEtdHlwZT1cImNhbXBhaWduLWJsb2NrXCIgZGF0YS1pbWFnZS1zaWRlPXtpbWFnZVNpZGV9PlxuICAgICAge2ltYWdlICYmIDxTdHlsZWRJbWcgc3JjPXtgJHtpbWFnZS5zcmN9P3dpZHRoPTI0MGB9IGhlaWdodD17MjAwfSB3aWR0aD17MjQwfSBhbHQ9e2ltYWdlLmFsdH0gLz59XG4gICAgICA8VGV4dFdyYXBwZXI+XG4gICAgICAgIDxIZWFkaW5nIGNzcz17aGVhZGluZ1N0eWxlfT57cGFyc2UodGl0bGUpfTwvSGVhZGluZz5cbiAgICAgICAgPFN0eWxlZERlc2NyaXB0aW9uPntwYXJzZShkZXNjcmlwdGlvbil9PC9TdHlsZWREZXNjcmlwdGlvbj5cbiAgICAgICAgeyEhdXJsPy51cmwgJiYgKFxuICAgICAgICAgIDxTdHlsZWRMaW5rIHRvPXtnZXRQb3NzaWJseVJlbGF0aXZlVXJsKHVybC51cmwsIHBhdGgpfT5cbiAgICAgICAgICAgIHtwYXJzZSh1cmwudGV4dCA/PyBcIlwiKX1cbiAgICAgICAgICAgIDxGb3J3YXJkIC8+XG4gICAgICAgICAgPC9TdHlsZWRMaW5rPlxuICAgICAgICApfVxuICAgICAgPC9UZXh0V3JhcHBlcj5cbiAgICA8L0NvbnRhaW5lcj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IENhbXBhaWduQmxvY2s7XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+const StyledImg = (0, _jsx2.styled)("img", {
+  base: {
+    alignSelf: "center",
+    objectFit: "cover",
+    width: "100%",
+    height: "215px",
+    desktop: {
+      height: "340px"
+    }
+  }
 });
-const CampaignBlock = _ref => {
+const ContentWrapper = (0, _jsx2.styled)("div", {
+  base: {
+    width: "100%",
+    position: "relative",
+    display: "flex",
+    flexDirection: "column",
+    gap: "xsmall",
+    alignItems: "flex-start",
+    paddingBlock: "medium",
+    paddingInline: "medium"
+  }
+});
+const StyledSafeLink = (0, _jsx2.styled)(_safelink.SafeLink, {
+  base: {
+    color: "inherit"
+  }
+});
+const MaybeLinkText = _ref => {
+  let {
+    url,
+    children,
+    path
+  } = _ref;
+  if (url) return (0, _jsxRuntime.jsx)(StyledSafeLink, {
+    to: (0, _relativeUrl.getPossiblyRelativeUrl)(url, path),
+    children: children
+  });
+  return children;
+};
+const CampaignBlock = _ref2 => {
   let {
     title,
     image,
     imageSide = "left",
     description,
-    headingLevel: Heading = "h2",
+    headingLevel: InternalHeading = "h2",
     url,
     path,
     className
-  } = _ref;
+  } = _ref2;
+  const imageComponent = image && (0, _jsxRuntime.jsx)(StyledImg, {
+    src: `${image.src}?width=455`,
+    height: 340,
+    width: 455,
+    alt: image.alt
+  });
+  const HeaderComponent = url?.url ? LinkText : _primitives.Text;
   return (0, _jsxRuntime.jsxs)(Container, {
     className: className,
     "data-type": "campaign-block",
-    "data-image-side": imageSide,
-    children: [image && (0, _jsxRuntime.jsx)(StyledImg, {
-      src: `${image.src}?width=240`,
-      height: 200,
-      width: 240,
-      alt: image.alt
-    }), (0, _jsxRuntime.jsxs)(TextWrapper, {
-      children: [(0, _jsxRuntime.jsx)(Heading, {
-        css: headingStyle,
-        children: (0, _htmlReactParser.default)(title)
-      }), (0, _jsxRuntime.jsx)(StyledDescription, {
+    children: [imageSide === "left" && imageComponent, (0, _jsxRuntime.jsxs)(ContentWrapper, {
+      children: [(0, _jsxRuntime.jsx)(MaybeLinkText, {
+        url: url?.url,
+        path: path,
+        children: (0, _jsxRuntime.jsx)(HeaderComponent, {
+          asChild: true,
+          consumeCss: true,
+          textStyle: "heading.small",
+          children: (0, _jsxRuntime.jsx)(InternalHeading, {
+            children: (0, _htmlReactParser.default)(title)
+          })
+        })
+      }), (0, _jsxRuntime.jsx)(_primitives.Text, {
+        textStyle: "body.large",
         children: (0, _htmlReactParser.default)(description)
-      }), !!url?.url && (0, _jsxRuntime.jsxs)(StyledLink, {
-        to: (0, _relativeUrl.getPossiblyRelativeUrl)(url.url, path),
-        children: [(0, _htmlReactParser.default)(url.text ?? ""), (0, _jsxRuntime.jsx)(_common.Forward, {})]
+      }), !!url?.url && (0, _jsxRuntime.jsx)(MaybeLinkText, {
+        url: url.url,
+        path: path,
+        children: (0, _jsxRuntime.jsxs)(LinkText, {
+          textStyle: "body.medium",
+          children: [(0, _htmlReactParser.default)(url.text ?? ""), (0, _jsxRuntime.jsx)(_common.Forward, {})]
+        })
       })]
-    })]
+    }), imageSide !== "left" && imageComponent]
   });
 };
 var _default = exports.default = CampaignBlock;

package/lib/Concept/Concept.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Copyright (c) 2024-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import { ComponentPropsWithRef, ReactNode } from "react";
+import { IDraftCopyright as ConceptCopyright } from "@ndla/types-backend/concept-api";
+import { ConceptVisualElementMeta } from "@ndla/types-embed";
+export interface ConceptProps extends ComponentPropsWithRef<"figure"> {
+    copyright?: ConceptCopyright;
+    visualElement?: ConceptVisualElementMeta;
+    lang?: string;
+    title?: string;
+    children?: ReactNode;
+}
+export declare const Concept: import("react").ForwardRefExoticComponent<Omit<ConceptProps, "ref"> & import("react").RefAttributes<HTMLElement>>;

package/lib/Concept/Concept.js

@@ -0,0 +1,75 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Concept = void 0;
+var _react = require("react");
+var _primitives = require("@ndla/primitives");
+var _jsx2 = require("@ndla/styled-system/jsx");
+var _Embed = require("../Embed");
+var _EmbedByline = require("../LicenseByline/EmbedByline");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+/**
+ * Copyright (c) 2024-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+const StyledFigure = (0, _jsx2.styled)(_primitives.Figure, {
+  base: {
+    display: "flex",
+    flexDirection: "column",
+    gap: "medium"
+  }
+});
+const ContentWrapper = (0, _jsx2.styled)("div", {
+  base: {
+    textStyle: "body.large",
+    display: "inline",
+    "& p": {
+      display: "inline"
+    }
+  }
+});
+
+// TODO: Figure out if we need to support tags, subjects and headerButtons.
+
+const Concept = exports.Concept = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+  let {
+    copyright,
+    visualElement,
+    lang,
+    children,
+    title,
+    ...rest
+  } = _ref;
+  return (0, _jsxRuntime.jsxs)(StyledFigure, {
+    ref: ref,
+    ...rest,
+    children: [(0, _jsxRuntime.jsxs)(ContentWrapper, {
+      lang: lang,
+      children: [!!title && (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+        children: [(0, _jsxRuntime.jsx)("b", {
+          children: title
+        }), ` – `]
+      }), children]
+    }), visualElement?.resource === "image" ? (0, _jsxRuntime.jsx)(_Embed.ImageEmbed, {
+      embed: visualElement,
+      lang: lang
+    }) : visualElement?.resource === "brightcove" ? (0, _jsxRuntime.jsx)(_Embed.BrightcoveEmbed, {
+      embed: visualElement
+    }) : visualElement?.resource === "h5p" ? (0, _jsxRuntime.jsx)(_Embed.H5pEmbed, {
+      embed: visualElement
+    }) : visualElement?.resource === "iframe" ? (0, _jsxRuntime.jsx)(_Embed.IframeEmbed, {
+      embed: visualElement
+    }) : visualElement?.resource === "external" ? (0, _jsxRuntime.jsx)(_Embed.ExternalEmbed, {
+      embed: visualElement
+    }) : null, copyright && (0, _jsxRuntime.jsx)(_EmbedByline.EmbedByline, {
+      copyright: copyright,
+      type: "concept"
+    })]
+  });
+});