@equinor/roma-framework 0.0.6 → 0.0.7-BETA.1

package/roma-framework.mjs

@@ -2,12 +2,14 @@ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useFramework, FrameworkProvider } from "@equinor/fusion-framework-react";
 import { configureModules } from "@equinor/fusion-framework-app";
 import * as React from "react";
-import { useState, useEffect, createContext, forwardRef, lazy, useRef, useContext, useMemo } from "react";
+import { useState, useEffect, lazy, useRef, createContext, useContext, useMemo } from "react";
 import { ModuleProvider } from "@equinor/fusion-framework-react-module";
-import styled, { StyleSheetManager, css, keyframes } from "styled-components";
+import { StyleSheetManager } from "styled-components";
+import { EdsProvider, StarProgress, Typography, Card } from "@equinor/eds-core-react";
 import { QueryClient, QueryClientProvider, useQueryClient, useQuery, useMutation } from "@tanstack/react-query";
 import { useCurrentApp, useApps as useApps$1 } from "@equinor/fusion-framework-react/app";
 import { App } from "@equinor/fusion-framework-module-app/app";
+import { tokens } from "@equinor/eds-tokens";
 import { useHttpClient } from "@equinor/fusion-framework-react-module-http";
 const createExtraScopePlugin = (scope) => {
   const plugin = (element, index, childEls) => {
@@ -21,1593 +23,14 @@ const createExtraScopePlugin = (scope) => {
   return plugin;
 };
 const StyleProvider = ({ scope, children }) => {
-  const stylisPlugins = scope ? [createExtraScopePlugin(`#${scope}`)] : [];
-  return /* @__PURE__ */ jsx(StyleSheetManager, { stylisPlugins, children: /* @__PURE__ */ jsx("div", { id: scope, children }) });
-};
-function _typeof(o) {
-  "@babel/helpers - typeof";
-  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o2) {
-    return typeof o2;
-  } : function(o2) {
-    return o2 && "function" == typeof Symbol && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2;
-  }, _typeof(o);
-}
-function _toPrimitive(input, hint) {
-  if (_typeof(input) !== "object" || input === null)
-    return input;
-  var prim = input[Symbol.toPrimitive];
-  if (prim !== void 0) {
-    var res = prim.call(input, hint || "default");
-    if (_typeof(res) !== "object")
-      return res;
-    throw new TypeError("@@toPrimitive must return a primitive value.");
-  }
-  return (hint === "string" ? String : Number)(input);
-}
-function _toPropertyKey(arg) {
-  var key = _toPrimitive(arg, "string");
-  return _typeof(key) === "symbol" ? key : String(key);
-}
-function _defineProperty(obj, key, value) {
-  key = _toPropertyKey(key);
-  if (key in obj) {
-    Object.defineProperty(obj, key, {
-      value,
-      enumerable: true,
-      configurable: true,
-      writable: true
-    });
-  } else {
-    obj[key] = value;
-  }
-  return obj;
-}
-function ownKeys(e, r) {
-  var t = Object.keys(e);
-  if (Object.getOwnPropertySymbols) {
-    var o = Object.getOwnPropertySymbols(e);
-    r && (o = o.filter(function(r2) {
-      return Object.getOwnPropertyDescriptor(e, r2).enumerable;
-    })), t.push.apply(t, o);
-  }
-  return t;
-}
-function _objectSpread2(e) {
-  for (var r = 1; r < arguments.length; r++) {
-    var t = null != arguments[r] ? arguments[r] : {};
-    r % 2 ? ownKeys(Object(t), true).forEach(function(r2) {
-      _defineProperty(e, r2, t[r2]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r2) {
-      Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2));
-    });
-  }
-  return e;
-}
-function _objectWithoutPropertiesLoose(source, excluded) {
-  if (source == null)
-    return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i;
-  for (i = 0; i < sourceKeys.length; i++) {
-    key = sourceKeys[i];
-    if (excluded.indexOf(key) >= 0)
-      continue;
-    target[key] = source[key];
-  }
-  return target;
-}
-function _objectWithoutProperties(source, excluded) {
-  if (source == null)
-    return {};
-  var target = _objectWithoutPropertiesLoose(source, excluded);
-  var key, i;
-  if (Object.getOwnPropertySymbols) {
-    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-    for (i = 0; i < sourceSymbolKeys.length; i++) {
-      key = sourceSymbolKeys[i];
-      if (excluded.indexOf(key) >= 0)
-        continue;
-      if (!Object.prototype.propertyIsEnumerable.call(source, key))
-        continue;
-      target[key] = source[key];
-    }
-  }
-  return target;
-}
-var clickbounds = {
-  jumbo__base: "88px",
-  default__base: "48px",
-  default__input: "56px",
-  compact__standard: "32px",
-  compact__input: "44px"
-};
-var colors$1 = {
-  text: {
-    static_icons__default: {
-      hex: "#3d3d3d",
-      hsla: "hsla(0, 0%, 23.9%, 1)",
-      rgba: "var(--eds_text__static_icons__default, rgba(61, 61, 61, 1))"
-    },
-    static_icons__secondary: {
-      hex: "#565656",
-      hsla: "hsla(0, 0%, 33.7%, 1)",
-      rgba: "var(--eds_text__static_icons__secondary, rgba(86, 86, 86, 1))"
-    },
-    static_icons__tertiary: {
-      hex: "#6f6f6f",
-      hsla: "hsla(0, 0%, 43.5%, 1)",
-      rgba: "var(--eds_text__static_icons__tertiary, rgba(111, 111, 111, 1))"
-    },
-    static_icons__primary_white: {
-      hex: "#ffffff",
-      hsla: "hsla(0, 0%, 100%, 1)",
-      rgba: "var(--eds_text__static_icons__primary_white, rgba(255, 255, 255, 1))"
-    }
-  },
-  ui: {
-    background__default: {
-      hex: "#ffffff",
-      hsla: "hsla(0, 0%, 100%, 1)",
-      rgba: "var(--eds_ui_background__default, rgba(255, 255, 255, 1))"
-    },
-    background__semitransparent: {
-      hex: "#ffffff",
-      hsla: "hsla(0, 0%, 100%, 0.2)",
-      rgba: "var(--eds_ui_background__semitransparent, rgba(255, 255, 255, 0.2))"
-    },
-    background__light: {
-      hex: "#f7f7f7",
-      hsla: "hsla(0, 0%, 96.9%, 1)",
-      rgba: "var(--eds_ui_background__light, rgba(247, 247, 247, 1))"
-    },
-    background__scrim: {
-      hex: "#000000",
-      hsla: "hsla(0, 0%, 0%, 0.4)",
-      rgba: "var(--eds_ui_background__scrim, rgba(0, 0, 0, 0.4))"
-    },
-    background__overlay: {
-      hex: "#000000",
-      hsla: "hsla(0, 0%, 0%, 0.8)",
-      rgba: "var(--eds_ui_background__overlay, rgba(0, 0, 0, 0.8))"
-    },
-    background__medium: {
-      hex: "#dcdcdc",
-      hsla: "hsla(0, 0%, 86.3%, 1)",
-      rgba: "var(--eds_ui_background__medium, rgba(220, 220, 220, 1))"
-    },
-    background__info: {
-      hex: "#d5eaf4",
-      hsla: "hsla(199, 58.5%, 89.6%, 1)",
-      rgba: "var(--eds_ui_background__info, rgba(213, 234, 244, 1))"
-    },
-    background__warning: {
-      hex: "#ffe7d6",
-      hsla: "hsla(25, 100%, 92%, 1)",
-      rgba: "var(--eds_ui_background__warning, rgba(255, 231, 214, 1))"
-    },
-    background__danger: {
-      hex: "#ffc1c1",
-      hsla: "hsla(0, 100%, 87.8%, 1)",
-      rgba: "var(--eds_ui_background__danger, rgba(255, 193, 193, 1))"
-    }
-  },
-  infographic: {
-    substitute__purple_berry: {
-      hex: "#8c1159",
-      hsla: "hsla(325, 78.3%, 30.8%, 1)",
-      rgba: "var(--eds_infographic_substitute__purple_berry, rgba(140, 17, 89, 1))"
-    },
-    substitute__pink_rose: {
-      hex: "#e24973",
-      hsla: "hsla(344, 72.5%, 58.6%, 1)",
-      rgba: "var(--eds_infographic_substitute__pink_rose, rgba(226, 73, 115, 1))"
-    },
-    substitute__pink_salmon: {
-      hex: "#ff92a8",
-      hsla: "hsla(348, 100%, 78.6%, 1)",
-      rgba: "var(--eds_infographic_substitute__pink_salmon, rgba(255, 146, 168, 1))"
-    },
-    substitute__green_cucumber: {
-      hex: "#005f57",
-      hsla: "hsla(175, 100%, 18.6%, 1)",
-      rgba: "var(--eds_infographic_substitute__green_cucumber, rgba(0, 95, 87, 1))"
-    },
-    substitute__green_succulent: {
-      hex: "#00977b",
-      hsla: "hsla(169, 100%, 29.6%, 1)",
-      rgba: "var(--eds_infographic_substitute__green_succulent, rgba(0, 151, 123, 1))"
-    },
-    substitute__green_mint: {
-      hex: "#40d38f",
-      hsla: "hsla(152, 62.6%, 53.9%, 1)",
-      rgba: "var(--eds_infographic_substitute__green_mint, rgba(64, 211, 143, 1))"
-    },
-    substitute__blue_ocean: {
-      hex: "#004088",
-      hsla: "hsla(212, 100%, 26.7%, 1)",
-      rgba: "var(--eds_infographic_substitute__blue_ocean, rgba(0, 64, 136, 1))"
-    },
-    substitute__blue_overcast: {
-      hex: "#0084c4",
-      hsla: "hsla(200, 100%, 38.4%, 1)",
-      rgba: "var(--eds_infographic_substitute__blue_overcast, rgba(0, 132, 196, 1))"
-    },
-    substitute__blue_sky: {
-      hex: "#52c0ff",
-      hsla: "hsla(202, 100%, 66.1%, 1)",
-      rgba: "var(--eds_infographic_substitute__blue_sky, rgba(82, 192, 255, 1))"
-    },
-    primary__moss_green_100: {
-      hex: "#007079",
-      hsla: "hsla(184, 100%, 23.7%, 1)",
-      rgba: "var(--eds_infographic_primary__moss_green_100, rgba(0, 112, 121, 1))"
-    },
-    primary__moss_green_55: {
-      hex: "#73b1b5",
-      hsla: "hsla(184, 30.8%, 58%, 1)",
-      rgba: "var(--eds_infographic_primary__moss_green_55, rgba(115, 177, 181, 1))"
-    },
-    primary__moss_green_34: {
-      hex: "#a8ced1",
-      hsla: "hsla(184, 30.8%, 73.9%, 1)",
-      rgba: "var(--eds_infographic_primary__moss_green_34, rgba(168, 206, 209, 1))"
-    },
-    primary__moss_green_21: {
-      hex: "#c9e0e2",
-      hsla: "hsla(185, 30.1%, 83.7%, 1)",
-      rgba: "var(--eds_infographic_primary__moss_green_21, rgba(201, 224, 226, 1))"
-    },
-    primary__moss_green_13: {
-      hex: "#deedee",
-      hsla: "hsla(184, 32%, 90.2%, 1)",
-      rgba: "var(--eds_infographic_primary__moss_green_13, rgba(222, 237, 238, 1))"
-    },
-    primary__energy_red_100: {
-      hex: "#eb0037",
-      hsla: "hsla(346, 100%, 46.1%, 1)",
-      rgba: "var(--eds_infographic_primary__energy_red_100, rgba(235, 0, 55, 1))"
-    },
-    primary__energy_red_55: {
-      hex: "#ff7d98",
-      hsla: "hsla(348, 100%, 74.5%, 1)",
-      rgba: "var(--eds_infographic_primary__energy_red_55, rgba(255, 125, 152, 1))"
-    },
-    primary__energy_red_34: {
-      hex: "#ffaebf",
-      hsla: "hsla(347, 100%, 84.1%, 1)",
-      rgba: "var(--eds_infographic_primary__energy_red_34, rgba(255, 174, 191, 1))"
-    },
-    primary__energy_red_21: {
-      hex: "#ffcdd7",
-      hsla: "hsla(348, 100%, 90.2%, 1)",
-      rgba: "var(--eds_infographic_primary__energy_red_21, rgba(255, 205, 215, 1))"
-    },
-    primary__energy_red_13: {
-      hex: "#ffe0e7",
-      hsla: "hsla(346, 100%, 93.9%, 1)",
-      rgba: "var(--eds_infographic_primary__energy_red_13, rgba(255, 224, 231, 1))"
-    },
-    primary__weathered_red: {
-      hex: "#7d0023",
-      hsla: "hsla(343, 100%, 24.5%, 1)",
-      rgba: "var(--eds_infographic_primary__weathered_red, rgba(125, 0, 35, 1))"
-    },
-    primary__slate_blue: {
-      hex: "#243746",
-      hsla: "hsla(206, 32.1%, 20.8%, 1)",
-      rgba: "var(--eds_infographic_primary__slate_blue, rgba(36, 55, 70, 1))"
-    },
-    primary__spruce_wood: {
-      hex: "#ffe7d6",
-      hsla: "hsla(25, 100%, 92%, 1)",
-      rgba: "var(--eds_infographic_primary__spruce_wood, rgba(255, 231, 214, 1))"
-    },
-    primary__mist_blue: {
-      hex: "#d5eaf4",
-      hsla: "hsla(199, 58.5%, 89.6%, 1)",
-      rgba: "var(--eds_infographic_primary__mist_blue, rgba(213, 234, 244, 1))"
-    },
-    primary__lichen_green: {
-      hex: "#e6faec",
-      hsla: "hsla(138, 66.7%, 94.1%, 1)",
-      rgba: "var(--eds_infographic_primary__lichen_green, rgba(230, 250, 236, 1))"
-    }
-  },
-  logo: {
-    fill_positive: {
-      hex: "#eb0037",
-      hsla: "hsla(346, 100%, 46.1%, 1)",
-      rgba: "var(--eds_logo__fill_positive, rgba(235, 0, 55, 1))"
-    },
-    fill_negative: {
-      hex: "#ffffff",
-      hsla: "hsla(0, 0%, 100%, 1)",
-      rgba: "var(--eds_logo__fill_negative, rgba(255, 255, 255, 1))"
-    }
-  },
-  interactive: {
-    primary__selected_highlight: {
-      hex: "#e6faec",
-      hsla: "hsla(138, 66.7%, 94.1%, 1)",
-      rgba: "var(--eds_interactive_primary__selected_highlight, rgba(230, 250, 236, 1))"
-    },
-    primary__selected_hover: {
-      hex: "#c3f3d2",
-      hsla: "hsla(139, 66.7%, 85.9%, 1)",
-      rgba: "var(--eds_interactive_primary__selected_hover, rgba(195, 243, 210, 1))"
-    },
-    primary__resting: {
-      hex: "#007079",
-      hsla: "hsla(184, 100%, 23.7%, 1)",
-      rgba: "var(--eds_interactive_primary__resting, rgba(0, 112, 121, 1))"
-    },
-    primary__hover: {
-      hex: "#004f55",
-      hsla: "hsla(184, 100%, 16.7%, 1)",
-      rgba: "var(--eds_interactive_primary__hover, rgba(0, 79, 85, 1))"
-    },
-    primary__hover_alt: {
-      hex: "#deedee",
-      hsla: "hsla(184, 32%, 90.2%, 1)",
-      rgba: "var(--eds_interactive_primary__hover_alt, rgba(222, 237, 238, 1))"
-    },
-    secondary__highlight: {
-      hex: "#d5eaf4",
-      hsla: "hsla(199, 58.5%, 89.6%, 1)",
-      rgba: "var(--eds_interactive_secondary__highlight, rgba(213, 234, 244, 1))"
-    },
-    secondary__resting: {
-      hex: "#243746",
-      hsla: "hsla(206, 32.1%, 20.8%, 1)",
-      rgba: "var(--eds_interactive_secondary__resting, rgba(36, 55, 70, 1))"
-    },
-    secondary__link_hover: {
-      hex: "#17242f",
-      hsla: "hsla(208, 34.3%, 13.7%, 1)",
-      rgba: "var(--eds_interactive_secondary__link_hover, rgba(23, 36, 47, 1))"
-    },
-    danger__highlight: {
-      hex: "#ffc1c1",
-      hsla: "hsla(0, 100%, 87.8%, 1)",
-      rgba: "var(--eds_interactive_danger__highlight, rgba(255, 193, 193, 1))"
-    },
-    danger__resting: {
-      hex: "#eb0000",
-      hsla: "hsla(0, 100%, 46.1%, 1)",
-      rgba: "var(--eds_interactive_danger__resting, rgba(235, 0, 0, 1))"
-    },
-    danger__hover: {
-      hex: "#b30d2f",
-      hsla: "hsla(348, 86.5%, 37.6%, 1)",
-      rgba: "var(--eds_interactive_danger__hover, rgba(179, 13, 47, 1))"
-    },
-    danger__text: {
-      hex: "#b30d2f",
-      hsla: "hsla(348, 86.5%, 37.6%, 1)",
-      rgba: "var(--eds_interactive_danger__text, rgba(179, 13, 47, 1))"
-    },
-    warning__highlight: {
-      hex: "#ffe7d6",
-      hsla: "hsla(25, 100%, 92%, 1)",
-      rgba: "var(--eds_interactive_warning__highlight, rgba(255, 231, 214, 1))"
-    },
-    warning__resting: {
-      hex: "#ff9200",
-      hsla: "hsla(34, 100%, 50%, 1)",
-      rgba: "var(--eds_interactive_warning__resting, rgba(255, 146, 0, 1))"
-    },
-    warning__hover: {
-      hex: "#ad6200",
-      hsla: "hsla(34, 100%, 33.9%, 1)",
-      rgba: "var(--eds_interactive_warning__hover, rgba(173, 98, 0, 1))"
-    },
-    warning__text: {
-      hex: "#ad6200",
-      hsla: "hsla(34, 100%, 33.9%, 1)",
-      rgba: "var(--eds_interactive_warning__text, rgba(173, 98, 0, 1))"
-    },
-    success__highlight: {
-      hex: "#e6faec",
-      hsla: "hsla(138, 66.7%, 94.1%, 1)",
-      rgba: "var(--eds_interactive_success__highlight, rgba(230, 250, 236, 1))"
-    },
-    success__resting: {
-      hex: "#4bb748",
-      hsla: "hsla(118, 43.5%, 50%, 1)",
-      rgba: "var(--eds_interactive_success__resting, rgba(75, 183, 72, 1))"
-    },
-    success__hover: {
-      hex: "#358132",
-      hsla: "hsla(118, 44.1%, 35.1%, 1)",
-      rgba: "var(--eds_interactive_success__hover, rgba(53, 129, 50, 1))"
-    },
-    success__text: {
-      hex: "#358132",
-      hsla: "hsla(118, 44.1%, 35.1%, 1)",
-      rgba: "var(--eds_interactive_success__text, rgba(53, 129, 50, 1))"
-    },
-    table__cell__fill_resting: {
-      hex: "#ffffff",
-      hsla: "hsla(0, 0%, 100%, 1)",
-      rgba: "var(--eds_interactive_table__cell__fill_resting, rgba(255, 255, 255, 1))"
-    },
-    table__cell__fill_hover: {
-      hex: "#eaeaea",
-      hsla: "hsla(0, 0%, 91.8%, 1)",
-      rgba: "var(--eds_interactive_table__cell__fill_hover, rgba(234, 234, 234, 1))"
-    },
-    table__cell__fill_activated: {
-      hex: "#e6faec",
-      hsla: "hsla(138, 66.7%, 94.1%, 1)",
-      rgba: "var(--eds_interactive_table__cell__fill_activated, rgba(230, 250, 236, 1))"
-    },
-    table__header__fill_activated: {
-      hex: "#eaeaea",
-      hsla: "hsla(0, 0%, 91.8%, 1)",
-      rgba: "var(--eds_interactive_table__header__fill_activated, rgba(234, 234, 234, 1))"
-    },
-    table__header__fill_hover: {
-      hex: "#dcdcdc",
-      hsla: "hsla(0, 0%, 86.3%, 1)",
-      rgba: "var(--eds_interactive_table__header__fill_hover, rgba(220, 220, 220, 1))"
-    },
-    table__header__fill_resting: {
-      hex: "#f7f7f7",
-      hsla: "hsla(0, 0%, 96.9%, 1)",
-      rgba: "var(--eds_interactive_table__header__fill_resting, rgba(247, 247, 247, 1))"
-    },
-    disabled__text: {
-      hex: "#bebebe",
-      hsla: "hsla(0, 0%, 74.5%, 1)",
-      rgba: "var(--eds_interactive__disabled__text, rgba(190, 190, 190, 1))"
-    },
-    text_highlight: {
-      hex: "#d5eaf4",
-      hsla: "hsla(199, 58.5%, 89.6%, 1)",
-      rgba: "var(--eds_interactive__text_highlight, rgba(213, 234, 244, 1))"
-    },
-    focus: {
-      hex: "#007079",
-      hsla: "hsla(184, 100%, 23.7%, 1)",
-      rgba: "var(--eds_interactive__focus, rgba(0, 112, 121, 1))"
-    },
-    disabled__border: {
-      hex: "#dcdcdc",
-      hsla: "hsla(0, 0%, 86.3%, 1)",
-      rgba: "var(--eds_interactive__disabled__border, rgba(220, 220, 220, 1))"
-    },
-    disabled__fill: {
-      hex: "#eaeaea",
-      hsla: "hsla(0, 0%, 91.8%, 1)",
-      rgba: "var(--eds_interactive__disabled__fill, rgba(234, 234, 234, 1))"
-    },
-    link_on_interactive_colors: {
-      hex: "#ffffff",
-      hsla: "hsla(0, 0%, 100%, 1)",
-      rgba: "var(--eds_interactive__link_on_interactive_colors, rgba(255, 255, 255, 1))"
-    },
-    icon_on_interactive_colors: {
-      hex: "#ffffff",
-      hsla: "hsla(0, 0%, 100%, 1)",
-      rgba: "var(--eds_interactive__icon_on_interactive_colors, rgba(255, 255, 255, 1))"
-    },
-    link_in_snackbars: {
-      hex: "#97cace",
-      hsla: "hsla(184, 35.9%, 70%, 1)",
-      rgba: "var(--eds_interactive__link_in_snackbars, rgba(151, 202, 206, 1))"
-    },
-    pressed_overlay_dark: {
-      hex: "#000000",
-      hsla: "hsla(0, 0%, 0%, 0.2)",
-      rgba: "var(--eds_interactive__pressed_overlay_dark, rgba(0, 0, 0, 0.2))"
-    },
-    pressed_overlay_light: {
-      hex: "#ffffff",
-      hsla: "hsla(0, 0%, 100%, 0.2)",
-      rgba: "var(--eds_interactive__pressed_overlay_light, rgba(255, 255, 255, 0.2))"
-    }
-  }
-};
-var elevation$1 = {
-  raised: "0 1px 5px rgba(0, 0, 0, 0.2),0 3px 4px rgba(0, 0, 0, 0.12),0 2px 4px rgba(0, 0, 0, 0.14)",
-  none: "0 0 1px rgba(0, 0, 0, 0.14)",
-  overlay: "0 1px 10px rgba(0, 0, 0, 0.2),0 4px 5px rgba(0, 0, 0, 0.12),0 2px 4px rgba(0, 0, 0, 0.14)",
-  sticky: "0 4px 5px rgba(0, 0, 0, 0.2),0 3px 14px rgba(0, 0, 0, 0.12),0 8px 10px rgba(0, 0, 0, 0.14)",
-  temporary_nav: "0 7px 8px rgba(0, 0, 0, 0.2),0 5px 22px rgba(0, 0, 0, 0.12),0 12px 17px rgba(0, 0, 0, 0.14)",
-  above_scrim: "0 11px 15px rgba(0, 0, 0, 0.2),0 9px 46px rgba(0, 0, 0, 0.12),0 24px 38px rgba(0, 0, 0, 0.14)"
-};
-var interactions = {
-  _modes: {
-    compact: {
-      pressed_dark_overlay: {
-        blendMode: "pass_through",
-        pressedColor: "transparent"
-      },
-      focused: {
-        style: "dashed",
-        color: "rgba(0, 112, 121, 1)",
-        width: "2px"
-      },
-      pressed_light_overlay: {
-        blendMode: "pass_through",
-        pressedColor: "rgba(255, 255, 255, 1)"
-      }
-    }
-  },
-  pressed_dark_overlay: {
-    blendMode: "darken",
-    pressedColor: "rgba(0, 0, 0, 0.2)"
-  },
-  focused: {
-    style: "dashed",
-    color: "rgba(0, 112, 121, 1)",
-    width: "2px"
-  },
-  pressed_light_overlay: {
-    blendMode: "pass_through",
-    pressedColor: "rgba(255, 255, 255, 0.2)"
-  }
-};
-var shape = {
-  _modes: {
-    compact: {
-      rounded: {
-        minHeight: "24px",
-        minWidth: "80px",
-        borderRadius: "100px"
-      },
-      button: {
-        minHeight: "24px",
-        minWidth: "112px",
-        borderRadius: "4px"
-      },
-      toggle: {
-        minHeight: "24px",
-        minWidth: "112px",
-        borderRadius: "4px"
-      },
-      corners: {
-        minHeight: "24px",
-        minWidth: "112px",
-        borderRadius: "4px"
-      },
-      icon_button: {
-        minHeight: "32px",
-        minWidth: "32px",
-        borderRadius: "100px"
-      },
-      straight: {
-        minHeight: "24px",
-        minWidth: "112px",
-        borderRadius: ""
-      },
-      toggle_rounded_border: {
-        minHeight: "24px",
-        minWidth: "2px",
-        borderRadius: ""
-      },
-      toggle_straight_border: {
-        minHeight: "24px",
-        minWidth: "2px",
-        borderRadius: ""
-      },
-      circle: {
-        minHeight: "24px",
-        minWidth: "24px",
-        borderRadius: "100px"
-      }
-    }
-  },
-  toggle_straight_border: {
-    minHeight: "36px",
-    minWidth: "4px",
-    borderRadius: ""
-  },
-  toggle_rounded_border: {
-    minHeight: "36px",
-    minWidth: "4px",
-    borderRadius: ""
-  },
-  circle: {
-    minHeight: "40px",
-    minWidth: "40px",
-    borderRadius: "100px"
-  },
-  rounded: {
-    minHeight: "40px",
-    minWidth: "80px",
-    borderRadius: "100px"
-  },
-  button: {
-    minHeight: "36px",
-    minWidth: "112px",
-    borderRadius: "4px"
-  },
-  toggle: {
-    minHeight: "36px",
-    minWidth: "112px",
-    borderRadius: "4px"
-  },
-  corners: {
-    minHeight: "36px",
-    minWidth: "112px",
-    borderRadius: "4px"
-  },
-  icon_button: {
-    minHeight: "40px",
-    minWidth: "40px",
-    borderRadius: "100px"
-  },
-  field: {
-    minHeight: "56px",
-    minWidth: "294px",
-    borderRadius: ""
-  },
-  straight: {
-    minHeight: "36px",
-    minWidth: "112px",
-    borderRadius: ""
-  },
-  caret: {
-    minHeight: "8px",
-    minWidth: "6px",
-    borderRadius: ""
-  }
-};
-var typography$1 = {
-  heading: {
-    h1_bold: {
-      color: "var(--eds_heading__h1_bold_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "2.000rem",
-      fontWeight: 700,
-      lineHeight: "1.250em",
-      textAlign: "left"
-    },
-    h1: {
-      color: "var(--eds_heading__h1_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "2.000rem",
-      fontWeight: 400,
-      lineHeight: "1.250em",
-      textAlign: "left"
-    },
-    h2: {
-      color: "var(--eds_heading__h2_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.750rem",
-      fontWeight: 400,
-      lineHeight: "1.250em",
-      textAlign: "left"
-    },
-    h3: {
-      color: "var(--eds_heading__h3_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.500rem",
-      fontWeight: 400,
-      lineHeight: "1.250em",
-      textAlign: "left"
-    },
-    h4: {
-      color: "var(--eds_heading__h4_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.250rem",
-      fontWeight: 400,
-      lineHeight: "1.600em",
-      textAlign: "left"
-    },
-    h5: {
-      color: "var(--eds_heading__h5_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.125rem",
-      fontWeight: 500,
-      letterSpacing: "0.013em",
-      lineHeight: "1.333em",
-      textAlign: "left"
-    },
-    h6: {
-      color: "var(--eds_heading__h6_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 500,
-      letterSpacing: "0.013em",
-      lineHeight: "1.500em",
-      textAlign: "left"
-    }
-  },
-  navigation: {
-    menu_title: {
-      color: "var(--eds_navigation__menu_title_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 400,
-      letterSpacing: "0.013em",
-      lineHeight: "1.000em",
-      textAlign: "left"
-    },
-    menu_tabs: {
-      color: "var(--eds_navigation__menu_tabs_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 500,
-      letterSpacing: "0.013em",
-      lineHeight: "1.000em",
-      textAlign: "left"
-    },
-    label: {
-      color: "var(--eds_navigation__label_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.750rem",
-      fontWeight: 500,
-      lineHeight: "1.333em",
-      textAlign: "left"
-    },
-    drawer_active: {
-      color: "var(--eds_navigation__drawer_active_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 700,
-      letterSpacing: "0.006em",
-      lineHeight: "1.000em",
-      textAlign: "left"
-    },
-    drawer_inactive: {
-      color: "var(--eds_navigation__drawer_inactive_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 500,
-      letterSpacing: "0.013em",
-      lineHeight: "1.000em",
-      textAlign: "left"
-    },
-    button: {
-      color: "var(--eds_navigation__button_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.875rem",
-      fontWeight: 500,
-      lineHeight: "1.143em",
-      textAlign: "left"
-    },
-    breadcrumb: {
-      color: "var(--eds_navigation__breadcrumb_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.875rem",
-      fontWeight: 500,
-      lineHeight: "1.143em",
-      textAlign: "left"
-    },
-    breadcrumb_hover: {
-      color: "var(--eds_navigation__breadcrumb_hover_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.875rem",
-      fontWeight: 500,
-      lineHeight: "1.143em",
-      textDecoration: "underline",
-      textAlign: "left"
-    },
-    menu_title_hover: {
-      color: "var(--eds_navigation__menu_title_hover_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 400,
-      letterSpacing: "0.013em",
-      lineHeight: "1.000em",
-      textAlign: "left"
-    }
-  },
-  input: {
-    label: {
-      color: "var(--eds_input__label_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.750rem",
-      fontWeight: 500,
-      lineHeight: "1.333em",
-      textAlign: "left"
-    },
-    text: {
-      color: "var(--eds_input__text_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 400,
-      letterSpacing: "0.025em",
-      lineHeight: "1.500em",
-      textAlign: "left"
-    },
-    text_monospaced: {
-      fontFeature: "'tnum' on,'lnum' on",
-      color: "var(--eds_input__text_monospaced_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 400,
-      letterSpacing: "0.063em",
-      lineHeight: "1.500em",
-      textAlign: "left"
-    },
-    helper: {
-      color: "var(--eds_input__helper_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.750rem",
-      fontWeight: 500,
-      letterSpacing: "0.013em",
-      lineHeight: "1.333em",
-      textAlign: "left"
-    }
-  },
-  paragraph: {
-    body_short_italic: {
-      color: "var(--eds_paragraph__body_short_italic_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 400,
-      lineHeight: "1.250em",
-      fontStyle: "italic",
-      textAlign: "left"
-    },
-    caption: {
-      color: "var(--eds_paragraph__caption_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.875rem",
-      fontWeight: 500,
-      lineHeight: "1.143em",
-      textAlign: "left"
-    },
-    meta: {
-      color: "var(--eds_paragraph__meta_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.625rem",
-      fontWeight: 500,
-      lineHeight: "1.600em",
-      textAlign: "left"
-    },
-    body_short: {
-      color: "var(--eds_paragraph__body_short_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 400,
-      lineHeight: "1.250em",
-      textAlign: "left"
-    },
-    body_short_bold_italic: {
-      color: "var(--eds_paragraph__body_short_bold_italic_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 700,
-      lineHeight: "1.250em",
-      fontStyle: "italic",
-      textAlign: "left"
-    },
-    body_short_bold: {
-      color: "var(--eds_paragraph__body_short_bold_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 700,
-      lineHeight: "1.250em",
-      textAlign: "left"
-    },
-    body_short_link: {
-      color: "var(--eds_paragraph__body_short_link_color, rgba(0, 112, 121, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 400,
-      lineHeight: "1.250em",
-      textDecoration: "underline",
-      textAlign: "left"
-    },
-    overline: {
-      color: "var(--eds_paragraph__overline_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.625rem",
-      fontWeight: 500,
-      letterSpacing: "0.069em",
-      lineHeight: "1.600em",
-      textTransform: "uppercase",
-      textAlign: "left"
-    },
-    ingress: {
-      color: "var(--eds_paragraph__ingress_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.125rem",
-      fontWeight: 400,
-      lineHeight: "1.333em",
-      textAlign: "left"
-    },
-    body_long: {
-      color: "var(--eds_paragraph__body_long_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 400,
-      lineHeight: "1.500em",
-      textAlign: "left"
-    },
-    body_long_link: {
-      color: "var(--eds_paragraph__body_long_link_color, rgba(0, 112, 121, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 400,
-      lineHeight: "1.500em",
-      textDecoration: "underline",
-      textAlign: "left"
-    },
-    body_long_italic: {
-      color: "var(--eds_paragraph__body_long_italic_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 400,
-      lineHeight: "1.500em",
-      fontStyle: "italic",
-      textAlign: "left"
-    },
-    body_long_bold: {
-      color: "var(--eds_paragraph__body_long_bold_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 700,
-      lineHeight: "1.500em",
-      textAlign: "left"
-    },
-    body_long_bold_italic: {
-      color: "var(--eds_paragraph__body_long_bold_italic_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 700,
-      lineHeight: "1.500em",
-      fontStyle: "italic",
-      textAlign: "left"
-    }
-  },
-  table: {
-    cell_header: {
-      color: "var(--eds_table__cell_header_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.875rem",
-      fontWeight: 700,
-      lineHeight: "1.429em",
-      textAlign: "left"
-    },
-    cell_text: {
-      color: "var(--eds_table__cell_text_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.875rem",
-      fontWeight: 500,
-      lineHeight: "1.429em",
-      textAlign: "left"
-    },
-    cell_text_bold: {
-      color: "var(--eds_table__cell_text_bold_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.875rem",
-      fontWeight: 700,
-      lineHeight: "1.429em",
-      textAlign: "left"
-    },
-    cell_text_link: {
-      color: "var(--eds_table__cell_text_link_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.875rem",
-      fontWeight: 500,
-      lineHeight: "1.429em",
-      textDecoration: "underline",
-      textAlign: "left"
-    },
-    cell_numeric_monospaced: {
-      fontFeature: "'tnum' on,'lnum' on",
-      color: "var(--eds_table__cell_numeric_monospaced_color, rgba(0, 0, 0, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.875rem",
-      fontWeight: 500,
-      lineHeight: "1.429em",
-      textAlign: "left"
-    }
-  },
-  _modes: {
-    compact: {
-      table: {
-        cell_header: {
-          color: "var(--eds_table__cell_header_color, rgba(0, 0, 0, 1))",
-          fontFamily: "Equinor",
-          fontSize: "0.875rem",
-          fontWeight: 700,
-          lineHeight: "1.143em",
-          textAlign: "left"
-        },
-        cell_text: {
-          color: "var(--eds_table__cell_text_color, rgba(0, 0, 0, 1))",
-          fontFamily: "Equinor",
-          fontSize: "0.875rem",
-          fontWeight: 500,
-          lineHeight: "1.143em",
-          textAlign: "left"
-        },
-        cell_text_bold: {
-          color: "var(--eds_table__cell_text_bold_color, rgba(0, 0, 0, 1))",
-          fontFamily: "Equinor",
-          fontSize: "0.875rem",
-          fontWeight: 700,
-          lineHeight: "1.143em",
-          textAlign: "left"
-        },
-        cell_text_link: {
-          color: "var(--eds_table__cell_text_link_color, rgba(0, 0, 0, 1))",
-          fontFamily: "Equinor",
-          fontSize: "0.875rem",
-          fontWeight: 500,
-          lineHeight: "1.143em",
-          textDecoration: "underline",
-          textAlign: "left"
-        },
-        cell_numeric_monospaced: {
-          fontFeature: "'tnum' on,'lnum' on",
-          color: "var(--eds_table__cell_numeric_monospaced_color, rgba(0, 0, 0, 1))",
-          fontFamily: "Equinor",
-          fontSize: "0.875rem",
-          fontWeight: 500,
-          lineHeight: "1.143em",
-          textAlign: "left"
-        }
-      }
-    }
-  },
-  ui: {
-    tooltip: {
-      color: "var(--eds_ui__tooltip_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.750rem",
-      fontWeight: 500,
-      lineHeight: "1.333em",
-      textAlign: "left"
-    },
-    snackbar: {
-      color: "var(--eds_ui__snackbar_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.750rem",
-      fontWeight: 500,
-      lineHeight: "1.333em",
-      textAlign: "left"
-    },
-    accordion_header: {
-      color: "var(--eds_ui__accordion_header_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "1.000rem",
-      fontWeight: 500,
-      lineHeight: "1.500em",
-      textAlign: "left"
-    },
-    chip__badge: {
-      color: "var(--eds_ui__chip__badge_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.750rem",
-      fontWeight: 500,
-      lineHeight: "1.333em",
-      textAlign: "left"
-    },
-    chart: {
-      color: "var(--eds_ui__chart_color, rgba(61, 61, 61, 1))",
-      fontFamily: "Equinor",
-      fontSize: "0.750rem",
-      fontWeight: 500,
-      lineHeight: "1.333em",
-      textAlign: "left"
-    }
-  }
-};
-var spacings$4 = {
-  comfortable: {
-    xxx_large: "48px",
-    xx_large: "40px",
-    x_large: "32px",
-    large: "24px",
-    medium: "16px",
-    medium_small: "12px",
-    small: "8px",
-    x_small: "4px",
-    xx_small: "2px"
-  }
-};
-var tokens = {
-  clickbounds,
-  colors: colors$1,
-  elevation: elevation$1,
-  interactions,
-  shape,
-  typography: typography$1,
-  spacings: spacings$4
-};
-function _arrayWithHoles(arr) {
-  if (Array.isArray(arr))
-    return arr;
-}
-function _iterableToArrayLimit(r, l) {
-  var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
-  if (null != t) {
-    var e, n, i, u, a = [], f = true, o = false;
-    try {
-      if (i = (t = t.call(r)).next, 0 === l) {
-        if (Object(t) !== t)
-          return;
-        f = false;
-      } else
-        for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = true)
-          ;
-    } catch (r2) {
-      o = true, n = r2;
-    } finally {
-      try {
-        if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u))
-          return;
-      } finally {
-        if (o)
-          throw n;
-      }
-    }
-    return a;
-  }
-}
-function _arrayLikeToArray(arr, len) {
-  if (len == null || len > arr.length)
-    len = arr.length;
-  for (var i = 0, arr2 = new Array(len); i < len; i++)
-    arr2[i] = arr[i];
-  return arr2;
-}
-function _unsupportedIterableToArray(o, minLen) {
-  if (!o)
-    return;
-  if (typeof o === "string")
-    return _arrayLikeToArray(o, minLen);
-  var n = Object.prototype.toString.call(o).slice(8, -1);
-  if (n === "Object" && o.constructor)
-    n = o.constructor.name;
-  if (n === "Map" || n === "Set")
-    return Array.from(o);
-  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))
-    return _arrayLikeToArray(o, minLen);
-}
-function _nonIterableRest() {
-  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-function _slicedToArray(arr, i) {
-  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
-}
-var shorthand = function shorthand2(token2) {
-  if (!token2) {
-    return void 0;
-  }
-  var _token$width = token2.width, width = _token$width === void 0 ? "" : _token$width, _token$style = token2.style, style = _token$style === void 0 ? "" : _token$style, _token$color = token2.color, color = _token$color === void 0 ? "" : _token$color;
-  if (!width) {
-    return null;
-  }
-  return "".concat(width, " ").concat(style, " ").concat(color);
-};
-var bordersTemplate = function bordersTemplate2(border2) {
-  var _border$left, _border$left2, _border$right, _border$right2;
-  if (!border2) {
-    return css({});
-  }
-  switch (border2.type) {
-    case "border":
-      return css({
-        border: shorthand(border2),
-        borderRadius: border2.radius
-      });
-    case "bordergroup":
-      return css({
-        borderBottom: shorthand(border2.bottom),
-        borderTop: shorthand(border2.top),
-        borderLeft: shorthand(border2.left),
-        borderRight: shorthand(border2.right),
-        borderBottomLeftRadius: border2 === null || border2 === void 0 || (_border$left = border2.left) === null || _border$left === void 0 ? void 0 : _border$left.radius,
-        borderTopLeftRadius: border2 === null || border2 === void 0 || (_border$left2 = border2.left) === null || _border$left2 === void 0 ? void 0 : _border$left2.radius,
-        borderBottomRightRadius: border2 === null || border2 === void 0 || (_border$right = border2.right) === null || _border$right === void 0 ? void 0 : _border$right.radius,
-        borderTopRightRadius: border2 === null || border2 === void 0 || (_border$right2 = border2.right) === null || _border$right2 === void 0 ? void 0 : _border$right2.radius
-      });
-    default:
-      return css({});
-  }
-};
-var focusColor = tokens.colors.interactive.focus.rgba;
-var outlineTemplate = function outlineTemplate2(outline) {
-  var _outline$color = outline.color, color = _outline$color === void 0 ? focusColor : _outline$color, _outline$style = outline.style, style = _outline$style === void 0 ? "dashed" : _outline$style, _outline$width = outline.width, width = _outline$width === void 0 ? "2px" : _outline$width, _outline$offset = outline.offset, offset = _outline$offset === void 0 ? "0px" : _outline$offset, type = outline.type;
-  var outline_ = {
-    color,
-    style,
-    width,
-    offset,
-    type
-  };
-  return css({
-    outline: shorthand(outline_),
-    outlineOffset: outline_.offset
-  });
-};
-var typographyTemplate = function typographyTemplate2(typography2, link2) {
-  if (!typography2) {
-    return "";
-  }
-  var base = "\n  margin: 0;\n  color: ".concat(typography2.color, ";\n  font-family: ").concat(typography2.fontFamily, ";\n  font-size: ").concat(typography2.fontSize, ";\n  font-weight: ").concat(typography2.fontWeight, ";\n  line-height: ").concat(typography2.lineHeight, ";\n  ");
-  if (typography2.fontStyle) {
-    base += "\nfont-style: ".concat(typography2.fontStyle, ";");
-  }
-  if (typography2.letterSpacing) {
-    base += "\nletter-spacing: ".concat(typography2.letterSpacing, ";");
-  }
-  if (typography2.textTransform) {
-    base += "\ntext-transform: ".concat(typography2.textTransform, ";");
-  }
-  if (typography2.textDecoration) {
-    base += "\ntext-decoration: ".concat(typography2.textDecoration, ";");
-  }
-  if (typography2.textAlign) {
-    base += "\ntext-align: ".concat(typography2.textAlign, ";");
-  }
-  if (typography2.fontFeature) {
-    base += "\nfont-feature-settings: ".concat(typography2.fontFeature, ";");
-  }
-  if (link2) {
-    base += "\ncursor: pointer;";
-  }
-  return base;
-};
-var initalState = {
-  /** Density for all components inside `EdsProvider` */
-  density: "comfortable"
-};
-var EdsContext = /* @__PURE__ */ createContext(initalState);
-var EdsProvider = function EdsProvider2(_ref) {
-  var children = _ref.children, density = _ref.density;
-  var _useState = useState(_objectSpread2(_objectSpread2({}, initalState), {}, {
-    density: density || "comfortable"
-  })), _useState2 = _slicedToArray(_useState, 2), state = _useState2[0], setState = _useState2[1];
-  var setDensity = function setDensity2(density2) {
-    return setState(function(prevState) {
-      return _objectSpread2(_objectSpread2({}, prevState), {}, {
-        density: density2
-      });
-    });
-  };
-  useEffect(function() {
-    if (typeof density !== "undefined" && density !== state.density) {
-      setDensity(density);
-    }
-  }, [density, state.density]);
-  var value = {
-    density: state.density,
-    setDensity
-  };
-  return /* @__PURE__ */ jsx(EdsContext.Provider, {
-    value,
-    children
-  });
-};
-var _tokens$colors$ui = tokens.colors.ui, background$1 = _tokens$colors$ui.background__default.rgba, backgroundInfo = _tokens$colors$ui.background__info.rgba, backgroundWarning = _tokens$colors$ui.background__warning.rgba, backgroundDanger = _tokens$colors$ui.background__danger.rgba, spacingMedium = tokens.spacings.comfortable.medium, borderRadius = tokens.shape.corners.borderRadius;
-var primary$2 = {
-  background: background$1,
-  border: {
-    type: "border",
-    radius: borderRadius
-  },
-  spacings: {
-    left: spacingMedium,
-    bottom: spacingMedium,
-    right: spacingMedium,
-    top: spacingMedium
-  }
-};
-var info = {
-  background: backgroundInfo
-};
-var danger$1 = {
-  background: backgroundDanger
-};
-var warning$1 = {
-  background: backgroundWarning
-};
-const Card_tokens = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
-  __proto__: null,
-  danger: danger$1,
-  info,
-  primary: primary$2,
-  warning: warning$1
-}, Symbol.toStringTag, { value: "Module" }));
-var elevation = tokens.elevation, background = tokens.colors.ui.background__default.rgba;
-var paper = {
-  background
-};
-var _excluded$8 = ["elevation"];
-var StyledPaper = styled.div.withConfig({
-  displayName: "Paper__StyledPaper",
-  componentId: "sc-6ncnv9-0"
-})(["background:", ";box-shadow:", ";"], paper.background, function(_ref) {
-  var $elevation = _ref.$elevation;
-  return $elevation;
-});
-var Paper = /* @__PURE__ */ forwardRef(function Paper2(_ref2, ref) {
-  var _elevationToken$eleva;
-  var _ref2$elevation = _ref2.elevation, elevation$12 = _ref2$elevation === void 0 ? "none" : _ref2$elevation, rest = _objectWithoutProperties(_ref2, _excluded$8);
-  var props = _objectSpread2(_objectSpread2({}, rest), {}, {
-    $elevation: (_elevationToken$eleva = elevation[elevation$12]) !== null && _elevationToken$eleva !== void 0 ? _elevationToken$eleva : "none"
-  });
-  return /* @__PURE__ */ jsx(StyledPaper, _objectSpread2(_objectSpread2({}, props), {}, {
-    ref
-  }));
-});
-var _excluded$7 = ["children", "variant", "elevation"];
-var primary$1 = primary$2;
-var StyledCard = styled(Paper).withConfig({
-  displayName: "Card__StyledCard",
-  componentId: "sc-bjucjn-0"
-})(["width:100%;position:relative;background-color:", ";box-sizing:border-box;display:flex;flex-direction:column;grid-gap:16px;", ";"], function(_ref) {
-  var $background = _ref.$background;
-  return $background;
-}, bordersTemplate(primary$1.border));
-var Card$1 = /* @__PURE__ */ forwardRef(function Card(_ref2, ref) {
-  var children = _ref2.children, _ref2$variant = _ref2.variant, variant = _ref2$variant === void 0 ? "default" : _ref2$variant, _ref2$elevation = _ref2.elevation, elevation2 = _ref2$elevation === void 0 ? "none" : _ref2$elevation, rest = _objectWithoutProperties(_ref2, _excluded$7);
-  var cardVariant = variant === "default" ? "primary" : variant;
-  var token2 = Card_tokens[cardVariant];
-  var props = _objectSpread2({
-    ref,
-    $background: token2.background
-  }, rest);
-  return /* @__PURE__ */ jsx(StyledCard, _objectSpread2(_objectSpread2({
-    elevation: elevation2
-  }, props), {}, {
-    children
-  }));
-});
-var typography = tokens.typography, colorsToken = tokens.colors, focusOutlineWidth = tokens.interactions.focused.width;
-var heading = typography.heading, paragraph = typography.paragraph;
-var _colorsToken$interact = colorsToken.interactive, primary = _colorsToken$interact.primary__resting.rgba, secondary = _colorsToken$interact.secondary__resting.rgba, danger = _colorsToken$interact.danger__resting.rgba, warning = _colorsToken$interact.warning__resting.rgba, success = _colorsToken$interact.success__resting.rgba, disabled = _colorsToken$interact.disabled__text.rgba, focus = _colorsToken$interact.focus.rgba;
-var colors = {
-  primary,
-  secondary,
-  danger,
-  warning,
-  success,
-  disabled
-};
-var quickVariants = _objectSpread2(_objectSpread2({}, heading), paragraph);
-var link = {
-  states: {
-    focus: {
-      outline: {
-        width: focusOutlineWidth,
-        color: focus,
-        style: "dashed",
-        type: "outline",
-        offset: "2px"
-      }
-    }
-  }
-};
-var _excluded$6 = ["variant", "children", "bold", "italic", "link", "lines", "color", "group", "token", "as"];
-var getElementType = function getElementType2(variant, link2) {
-  if (link2) {
-    return "a";
-  }
-  switch (variant) {
-    case "h1":
-    case "h2":
-    case "h3":
-    case "h4":
-    case "h5":
-    case "h6":
-      return variant;
-    case "caption":
-    case "overline":
-    case "ingress":
-    case "meta":
-    case "body_short":
-    case "body_long":
-    default:
-      return "p";
+  const stylisPlugins = [];
+  if (scope) {
+    const plugin = createExtraScopePlugin(`#${scope}`);
+    Object.defineProperty(plugin, "name", { value: `style-scope-${scope}` });
+    stylisPlugins.push(plugin);
   }
+  return /* @__PURE__ */ jsx(StyleSheetManager, { stylisPlugins, children: /* @__PURE__ */ jsx("div", { id: scope, children }) });
 };
-var findTypography = function findTypography2(variantName, group) {
-  if (!group && quickVariants[variantName]) {
-    return quickVariants[variantName];
-  }
-  return typography[group][variantName];
-};
-var findColor = function findColor2() {
-  var inputColor = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : null;
-  return typeof colors[inputColor] === "undefined" ? inputColor : colors[inputColor];
-};
-var toVariantName = function toVariantName2(variant) {
-  var bold = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
-  var italic = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : false;
-  var link2 = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : false;
-  return "".concat(variant).concat(bold ? "_bold" : "").concat(italic ? "_italic" : "").concat(link2 ? "_link" : "");
-};
-var StyledTypography = styled.p.withConfig({
-  displayName: "Typography__StyledTypography",
-  componentId: "sc-179guof-0"
-})(["", " ", " ", " ", ""], function(_ref) {
-  var $typography = _ref.$typography, $link = _ref.$link;
-  return typographyTemplate($typography, $link);
-}, function(_ref2) {
-  var $color = _ref2.$color;
-  return css({
-    color: findColor($color)
-  });
-}, function(_ref3) {
-  var $lines = _ref3.$lines;
-  return (
-    //https://caniuse.com/#feat=css-line-clamp
-    $lines > 0 && css(["&{display:-webkit-box;-webkit-line-clamp:", ";-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;}"], $lines)
-  );
-}, function(_ref4) {
-  var $link = _ref4.$link;
-  return $link && css(["&:focus{outline:none;}&[data-focus-visible-added]:focus{", "}&:focus-visible{", "}"], outlineTemplate(link.states.focus.outline), outlineTemplate(link.states.focus.outline));
-});
-var Typography = /* @__PURE__ */ forwardRef(function Typography2(_ref5, ref) {
-  var _ref5$variant = _ref5.variant, variant = _ref5$variant === void 0 ? "body_short" : _ref5$variant, children = _ref5.children, bold = _ref5.bold, italic = _ref5.italic, link2 = _ref5.link, lines = _ref5.lines, color = _ref5.color, group = _ref5.group, token2 = _ref5.token, providedAs = _ref5.as, other = _objectWithoutProperties(_ref5, _excluded$6);
-  var as = providedAs ? providedAs : getElementType(variant, link2);
-  var variantName = toVariantName(variant, bold, italic, link2);
-  var typography2 = findTypography(variantName, group);
-  if (typeof typography2 === "undefined") {
-    throw new Error('Typography variant not found for variant "'.concat(variantName, '" ("').concat(variant, '") & group "').concat(group || "", '"'));
-  }
-  return /* @__PURE__ */ jsx(StyledTypography, _objectSpread2(_objectSpread2({
-    as,
-    $typography: _objectSpread2(_objectSpread2({}, typography2), token2),
-    $link: link2,
-    $lines: lines,
-    ref,
-    $color: color
-  }, other), {}, {
-    children
-  }));
-});
-var _excluded$5 = ["children", "alignRight", "meta"];
-var spacings$3 = primary$2.spacings;
-var StyledCardActions = styled.div.withConfig({
-  displayName: "CardActions__StyledCardActions",
-  componentId: "sc-1d5vskp-0"
-})(["display:grid;grid-gap:8px;grid-auto-flow:column;align-items:center;justify-content:", ";padding:0 ", " 0 ", ";margin-top:auto;&:first-child{padding-top:", ";}&:last-child{padding-bottom:", ";}"], function(_ref) {
-  var $justifyContent = _ref.$justifyContent;
-  return $justifyContent;
-}, spacings$3.right, spacings$3.left, spacings$3.top, spacings$3.bottom);
-var CardActions = /* @__PURE__ */ forwardRef(function CardActions2(_ref2, ref) {
-  var children = _ref2.children, _ref2$alignRight = _ref2.alignRight, alignRight = _ref2$alignRight === void 0 ? false : _ref2$alignRight, _ref2$meta = _ref2.meta, meta = _ref2$meta === void 0 ? "" : _ref2$meta, rest = _objectWithoutProperties(_ref2, _excluded$5);
-  var $justifyContent = alignRight ? "flex-end" : "flex-start";
-  var props = _objectSpread2({
-    ref,
-    $justifyContent
-  }, rest);
-  return /* @__PURE__ */ jsxs(StyledCardActions, _objectSpread2(_objectSpread2({}, props), {}, {
-    children: [children, meta !== "" && /* @__PURE__ */ jsx(Typography, {
-      variant: "caption",
-      children: meta
-    })]
-  }));
-});
-var _excluded$4 = ["children"];
-var spacings$2 = primary$2.spacings;
-var StyledCardContent = styled.div.withConfig({
-  displayName: "CardContent__StyledCardContent",
-  componentId: "sc-esm4ym-0"
-})(["display:grid;padding:0 ", " 0 ", ";&:last-child{padding-bottom:", ";}"], spacings$2.right, spacings$2.left, spacings$2.bottom);
-var CardContent = /* @__PURE__ */ forwardRef(function CardContent2(_ref, ref) {
-  var children = _ref.children, props = _objectWithoutProperties(_ref, _excluded$4);
-  return /* @__PURE__ */ jsx(StyledCardContent, _objectSpread2(_objectSpread2({
-    ref
-  }, props), {}, {
-    children
-  }));
-});
-var _excluded$3 = ["children", "fullWidth"];
-var spacings$1 = primary$2.spacings, border = primary$2.border;
-var StyledCardMedia = styled.div.withConfig({
-  displayName: "CardMedia__StyledCardMedia",
-  componentId: "sc-kr8q9c-0"
-})(["display:flex;width:auto;", ""], function(_ref) {
-  var $fullWidth = _ref.$fullWidth;
-  return $fullWidth ? css(["> *{width:100%;}&:first-child{img{border-top-right-radius:", ";border-top-left-radius:", ";}}&:last-child{img{border-bottom-right-radius:", ";border-bottom-left-radius:", ";}}"], border.type === "border" && border.radius, border.type === "border" && border.radius, border.type === "border" && border.radius, border.type === "border" && border.radius) : css(["padding:0 ", " 0 ", ";&:first-child{padding:", " ", " 0 ", ";}&:last-child{padding:0 ", " ", " ", ";}> *{width:100%;}"], spacings$1.right, spacings$1.left, spacings$1.top, spacings$1.right, spacings$1.left, spacings$1.right, spacings$1.bottom, spacings$1.left);
-});
-var CardMedia = /* @__PURE__ */ forwardRef(function CardMedia2(_ref2, ref) {
-  var children = _ref2.children, _ref2$fullWidth = _ref2.fullWidth, fullWidth = _ref2$fullWidth === void 0 ? false : _ref2$fullWidth, rest = _objectWithoutProperties(_ref2, _excluded$3);
-  var props = _objectSpread2(_objectSpread2({}, rest), {}, {
-    ref,
-    $fullWidth: fullWidth
-  });
-  return /* @__PURE__ */ jsx(StyledCardMedia, _objectSpread2(_objectSpread2({}, props), {}, {
-    children
-  }));
-});
-var _excluded$2 = ["children"];
-var spacings = primary$2.spacings;
-var StyledCardHeader = styled.div.withConfig({
-  displayName: "CardHeader__StyledCardHeader",
-  componentId: "sc-15k8edh-0"
-})(["display:flex;justify-content:space-between;align-items:center;padding:0 ", " 0 ", ";> :not(:first-child){margin-left:", ";}&:first-child{padding-top:", ";}&:last-child{padding-bottom:", ";}"], spacings.right, spacings.left, spacings.left, spacings.top, spacings.bottom);
-var CardHeader = /* @__PURE__ */ forwardRef(function CardHeader2(_ref, ref) {
-  var children = _ref.children, rest = _objectWithoutProperties(_ref, _excluded$2);
-  var props = _objectSpread2(_objectSpread2({}, rest), {}, {
-    ref
-  });
-  return /* @__PURE__ */ jsx(StyledCardHeader, _objectSpread2(_objectSpread2({}, props), {}, {
-    children
-  }));
-});
-var _excluded$1 = ["children"];
-var StyledCardHeaderTitle = styled.div.withConfig({
-  displayName: "CardHeaderTitle__StyledCardHeaderTitle",
-  componentId: "sc-11m80r3-0"
-})(["display:grid;flex-grow:2;grid-auto-columns:auto;"]);
-var CardHeaderTitle = /* @__PURE__ */ forwardRef(function CardHeaderTitle2(_ref, ref) {
-  var children = _ref.children, rest = _objectWithoutProperties(_ref, _excluded$1);
-  var props = _objectSpread2(_objectSpread2({}, rest), {}, {
-    ref
-  });
-  return /* @__PURE__ */ jsx(StyledCardHeaderTitle, _objectSpread2(_objectSpread2({}, props), {}, {
-    children
-  }));
-});
-var Card2 = Card$1;
-Card2.Actions = CardActions;
-Card2.Content = CardContent;
-Card2.Header = CardHeader;
-Card2.Media = CardMedia;
-Card2.HeaderTitle = CardHeaderTitle;
-Card2.Actions.displayName = "Card.Actions";
-Card2.Content.displayName = "Card.Content";
-Card2.Header.displayName = "Card.Header";
-Card2.Media.displayName = "Card.Media";
-Card2.HeaderTitle.displayName = "Card.HeaderTitle";
-var logoFillPositive = tokens.colors.logo.fill_positive.rgba;
-var token = {
-  background: logoFillPositive
-};
-var _excluded = ["variant", "value", "size"];
-var indeterminate = keyframes(["0%{opacity:1;}20%{opacity:0.8;}40%{opacity:0.6;}60%{opacity:0.4;}80%{opacity:0.2;}100%{opacity:0.05;}"]);
-var determinate = keyframes(["0%{opacity:0;}10%{opacity:0.05;}20%{opacity:0.2;}40%{opacity:0.4;}60%{opacity:0.6;}80%{opacity:0.8;}100%{opacity:1;}"]);
-var Svg = styled.svg.withConfig({
-  displayName: "StarProgress__Svg",
-  componentId: "sc-c0byj9-0"
-})(["fill:", ";", ""], token.background, function(_ref) {
-  var $variant = _ref.$variant, $progress = _ref.$progress;
-  return $variant === "indeterminate" ? css(["path{&:nth-child(1){animation:", " 1.3s linear infinite;}&:nth-child(2){animation:", " 1.3s linear 0.3s infinite;}&:nth-child(3){animation:", " 1.3s linear 0.4s infinite;}&:nth-child(4){animation:", " 1.3s linear 0.6s infinite;}&:nth-child(5){animation:", " 1.3s linear 0.8s infinite;}&:nth-child(6){animation:", " 1.3s linear 1s infinite;}}"], indeterminate, indeterminate, indeterminate, indeterminate, indeterminate, indeterminate) : css(["path{animation:", " 1.3s linear;&:nth-child(6){animation-play-state:", ";}&:nth-child(5){animation-play-state:", ";}&:nth-child(4){animation-play-state:", ";}&:nth-child(3){animation-play-state:", ";}&:nth-child(2){animation-play-state:", ";}&:nth-child(1){animation-play-state:", ";}}"], determinate, $progress > 90 ? "running" : "paused", $progress > 80 ? "running" : "paused", $progress > 60 ? "running" : "paused", $progress > 40 ? "running" : "paused", $progress > 20 ? "running" : "paused", $progress <= 20 ? "running" : "paused");
-});
-var StarProgress = /* @__PURE__ */ forwardRef(function StarProgress2(_ref2, ref) {
-  var _ref2$variant = _ref2.variant, variant = _ref2$variant === void 0 ? "indeterminate" : _ref2$variant, _ref2$value = _ref2.value, value = _ref2$value === void 0 ? null : _ref2$value, _ref2$size = _ref2.size, size = _ref2$size === void 0 ? 48 : _ref2$size, rest = _objectWithoutProperties(_ref2, _excluded);
-  var progress = Math.round(value);
-  var height = size * 1.2;
-  var width = size;
-  var props = _objectSpread2(_objectSpread2({}, rest), {}, {
-    ref,
-    $variant: variant,
-    $progress: progress
-  });
-  if (variant === "determinate") {
-    if (value !== void 0) {
-      props["aria-valuenow"] = progress;
-      props["aria-valuemin"] = 0;
-      props["aria-valuemax"] = 100;
-    }
-  }
-  return /* @__PURE__ */ jsxs(Svg, _objectSpread2(_objectSpread2({}, props), {}, {
-    role: "progressbar",
-    width,
-    height,
-    viewBox: "0 0 40 48",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    preserveAspectRatio: "xMidYMid meet",
-    children: [/* @__PURE__ */ jsx("path", {
-      d: "M32.756 34.6798L29.482 36.5817C29.4139 36.6219 29.3295 36.6227 29.2606 36.5829L25.9476 34.7151C25.7975 34.6306 25.7967 34.4149 25.9456 34.3284L29.2397 32.4256C29.3077 32.3858 29.3914 32.3858 29.4603 32.4248L32.754 34.2931C32.9033 34.3784 32.9041 34.5929 32.756 34.6798Z"
-    }), /* @__PURE__ */ jsx("path", {
-      d: "M25.9596 45.4706L22.6655 43.5867C22.5966 43.5469 22.554 43.4744 22.554 43.396V41.4289V39.5922C22.5519 39.4204 22.7381 39.3109 22.8878 39.397L26.1819 41.2981C26.25 41.3379 26.2926 41.4104 26.2934 41.4896V43.4268V45.2762C26.2947 45.4472 26.1085 45.5559 25.9596 45.4706Z"
-    }), /* @__PURE__ */ jsx("path", {
-      d: "M12.3022 47.7037V44.9795V42.6544C12.3022 42.5495 12.3576 42.4515 12.4482 42.3986L14.1262 41.4062L16.8143 39.8188C17.0119 39.7019 17.2617 39.8442 17.2625 40.0739L17.2633 42.7627V45.1456C17.2633 45.251 17.2079 45.3486 17.1165 45.4015L12.7496 47.9587C12.552 48.0748 12.3031 47.9325 12.3022 47.7037Z"
-    }), /* @__PURE__ */ jsx("path", {
-      d: "M0.221343 34.2106L6.76939 30.4056C6.90636 30.326 7.07449 30.3256 7.21227 30.4023L13.8378 34.1401C14.138 34.3095 14.14 34.7413 13.8415 34.9131L7.25492 38.7182C7.11795 38.7977 6.94941 38.7985 6.81204 38.7206L0.225854 34.9836C-0.0734986 34.8139 -0.075549 34.3833 0.221343 34.2106Z"
-    }), /* @__PURE__ */ jsx("path", {
-      d: "M6.03876 9.125L16.9237 15.5151C17.1513 15.6484 17.2903 15.8912 17.2903 16.1549V28.8331C17.2903 29.4076 16.665 29.7647 16.1704 29.4728L5.28546 23.0264C5.05869 22.8919 4.92008 22.6479 4.9209 22.3855V9.76307C4.92254 9.1902 5.54503 8.83467 6.03876 9.125Z"
-    }), /* @__PURE__ */ jsx("path", {
-      d: "M39.6262 1.07261V11.7603V19.3368C39.627 19.7178 39.4265 20.0709 39.0988 20.2644L31.4145 24.8195L23.3545 29.5964C22.6385 30.0192 21.7339 29.5029 21.7339 28.6717V10.3259C21.7339 9.94495 21.9356 9.5927 22.2641 9.39955L38.008 0.149533C38.7232 -0.270381 39.6241 0.24385 39.6262 1.07261Z"
-    })]
-  }));
-});
 var extendStatics = function(d, b) {
   extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function(d2, b2) {
     d2.__proto__ = b2;
@@ -2784,8 +1207,8 @@ function parseNotationOptions(opt) {
 function parseNumberSkeleton(tokens2) {
   var result = {};
   for (var _i = 0, tokens_1 = tokens2; _i < tokens_1.length; _i++) {
-    var token2 = tokens_1[_i];
-    switch (token2.stem) {
+    var token = tokens_1[_i];
+    switch (token.stem) {
       case "percent":
       case "%":
         result.style = "percent";
@@ -2796,7 +1219,7 @@ function parseNumberSkeleton(tokens2) {
         continue;
       case "currency":
         result.style = "currency";
-        result.currency = token2.options[0];
+        result.currency = token.options[0];
         continue;
       case "group-off":
       case ",_":
@@ -2809,7 +1232,7 @@ function parseNumberSkeleton(tokens2) {
       case "measure-unit":
       case "unit":
         result.style = "unit";
-        result.unit = icuUnitToEcma(token2.options[0]);
+        result.unit = icuUnitToEcma(token.options[0]);
         continue;
       case "compact-short":
       case "K":
@@ -2822,12 +1245,12 @@ function parseNumberSkeleton(tokens2) {
         result.compactDisplay = "long";
         continue;
       case "scientific":
-        result = __assign(__assign(__assign({}, result), { notation: "scientific" }), token2.options.reduce(function(all, opt2) {
+        result = __assign(__assign(__assign({}, result), { notation: "scientific" }), token.options.reduce(function(all, opt2) {
           return __assign(__assign({}, all), parseNotationOptions(opt2));
         }, {}));
         continue;
       case "engineering":
-        result = __assign(__assign(__assign({}, result), { notation: "engineering" }), token2.options.reduce(function(all, opt2) {
+        result = __assign(__assign(__assign({}, result), { notation: "engineering" }), token.options.reduce(function(all, opt2) {
           return __assign(__assign({}, all), parseNotationOptions(opt2));
         }, {}));
         continue;
@@ -2850,13 +1273,13 @@ function parseNumberSkeleton(tokens2) {
         result.currencyDisplay = "symbol";
         continue;
       case "scale":
-        result.scale = parseFloat(token2.options[0]);
+        result.scale = parseFloat(token.options[0]);
         continue;
       case "integer-width":
-        if (token2.options.length > 1) {
+        if (token.options.length > 1) {
           throw new RangeError("integer-width stems only accept a single optional option");
         }
-        token2.options[0].replace(INTEGER_WIDTH_REGEX, function(_, g1, g2, g3, g4, g5) {
+        token.options[0].replace(INTEGER_WIDTH_REGEX, function(_, g1, g2, g3, g4, g5) {
           if (g1) {
             result.minimumIntegerDigits = g2.length;
           } else if (g3 && g4) {
@@ -2868,15 +1291,15 @@ function parseNumberSkeleton(tokens2) {
         });
         continue;
     }
-    if (CONCISE_INTEGER_WIDTH_REGEX.test(token2.stem)) {
-      result.minimumIntegerDigits = token2.stem.length;
+    if (CONCISE_INTEGER_WIDTH_REGEX.test(token.stem)) {
+      result.minimumIntegerDigits = token.stem.length;
       continue;
     }
-    if (FRACTION_PRECISION_REGEX.test(token2.stem)) {
-      if (token2.options.length > 1) {
+    if (FRACTION_PRECISION_REGEX.test(token.stem)) {
+      if (token.options.length > 1) {
         throw new RangeError("Fraction-precision stems only accept a single optional option");
       }
-      token2.stem.replace(FRACTION_PRECISION_REGEX, function(_, g1, g2, g3, g4, g5) {
+      token.stem.replace(FRACTION_PRECISION_REGEX, function(_, g1, g2, g3, g4, g5) {
         if (g2 === "*") {
           result.minimumFractionDigits = g1.length;
         } else if (g3 && g3[0] === "#") {
@@ -2890,7 +1313,7 @@ function parseNumberSkeleton(tokens2) {
         }
         return "";
       });
-      var opt = token2.options[0];
+      var opt = token.options[0];
       if (opt === "w") {
         result = __assign(__assign({}, result), { trailingZeroDisplay: "stripIfInteger" });
       } else if (opt) {
@@ -2898,15 +1321,15 @@ function parseNumberSkeleton(tokens2) {
       }
       continue;
     }
-    if (SIGNIFICANT_PRECISION_REGEX.test(token2.stem)) {
-      result = __assign(__assign({}, result), parseSignificantPrecision(token2.stem));
+    if (SIGNIFICANT_PRECISION_REGEX.test(token.stem)) {
+      result = __assign(__assign({}, result), parseSignificantPrecision(token.stem));
       continue;
     }
-    var signOpts = parseSign(token2.stem);
+    var signOpts = parseSign(token.stem);
     if (signOpts) {
       result = __assign(__assign({}, result), signOpts);
     }
-    var conciseScientificAndEngineeringOpts = parseConciseScientificAndEngineeringStem(token2.stem);
+    var conciseScientificAndEngineeringOpts = parseConciseScientificAndEngineeringStem(token.stem);
     if (conciseScientificAndEngineeringOpts) {
       result = __assign(__assign({}, result), conciseScientificAndEngineeringOpts);
     }
@@ -5809,9 +4232,9 @@ var defaultErrorHandler = function(error) {
     console.error(error);
   }
 };
-var defaultWarnHandler = function(warning2) {
+var defaultWarnHandler = function(warning) {
   if (process.env.NODE_ENV !== "production") {
-    console.warn(warning2);
+    console.warn(warning);
   }
 };
 var DEFAULT_INTL_CONFIG$1 = {
@@ -6585,9 +5008,9 @@ const EquinorLoader = ({
   );
 };
 const ErrorViewer = ({ error }) => {
-  return /* @__PURE__ */ jsxs(Card2, { variant: "warning", style: { width: 800 }, children: [
-    /* @__PURE__ */ jsx(Card2.Header, { children: /* @__PURE__ */ jsx(Typography, { variant: "h4", color: "warning", children: error.message }) }),
-    /* @__PURE__ */ jsx(Card2.Content, { children: /* @__PURE__ */ jsx("pre", { style: { whiteSpace: "pre-wrap" }, children: error.stack ?? "Error" }) })
+  return /* @__PURE__ */ jsxs(Card, { variant: "warning", style: { width: 800 }, children: [
+    /* @__PURE__ */ jsx(Card.Header, { children: /* @__PURE__ */ jsx(Typography, { variant: "h4", color: "warning", children: error.message }) }),
+    /* @__PURE__ */ jsx(Card.Content, { children: /* @__PURE__ */ jsx("pre", { style: { whiteSpace: "pre-wrap" }, children: error.stack ?? "Error" }) })
   ] });
 };
 function getAppModule(app, framework) {
@@ -6612,7 +5035,7 @@ function AppLoader({
 }) {
   const queryClient = useQueryClient();
   kind = kind ?? "widget";
-  const { setCurrentApp, clearCurrentApp } = useCurrentApp();
+  const { setCurrentApp, clearCurrentApp, currentApp } = useCurrentApp();
   const framework = useFramework();
   const [error, setError] = useState(null);
   const [loading, setLoading] = useState(false);
@@ -6671,7 +5094,8 @@ function AppLoader({
       } catch {
       }
       appModule.dispose();
-      clearCurrentApp();
+      if (kind === "app")
+        clearCurrentApp();
     };
   }, [app]);
   const ref = useRef(null);
@@ -6818,15 +5242,15 @@ const getError = (error) => {
 };
 const HttpErrorViewer = ({ error }) => {
   return /* @__PURE__ */ jsxs(
-    Card2,
+    Card,
     {
       style: {
         minWidth: 400,
         border: `1px solid ${tokens.colors.ui.background__danger.hex}`
       },
       children: [
-        /* @__PURE__ */ jsx(Card2.Header, { children: /* @__PURE__ */ jsx(Typography, { variant: "h4", color: "danger", children: error.message }) }),
-        /* @__PURE__ */ jsx(Card2.Content, { children: getError(error.response) })
+        /* @__PURE__ */ jsx(Card.Header, { children: /* @__PURE__ */ jsx(Typography, { variant: "h4", color: "danger", children: error.message }) }),
+        /* @__PURE__ */ jsx(Card.Content, { children: getError(error.response) })
       ]
     }
   );