@amboss/design-system 1.12.1 → 1.13.0

package/build/esm/src/components/Icon/Icon.js

@@ -5,6 +5,26 @@ import icons$1 from '../../../build-tokens/assets/icons.json.js';
 import icons16 from '../../../build-tokens/assets/icons16.json.js';
 import { useHover } from '../../shared/useHover.js';
 
+const handleColor = (theme, color) => {
+  switch (color) {
+    case "inherit":
+      return "inherit";
+    default:
+      return theme.values.color.icon[color];
+  }
+};
+const handleVariant = (theme, variant) => {
+  switch (variant) {
+    case "inherit":
+      return "inherit";
+    case "primary":
+      return theme.values.color.icon.accent;
+    case "secondary":
+      return theme.values.color.icon.primary;
+    default:
+      return theme.values.color.icon[variant];
+  }
+};
 const StyledIcon = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
   target: "e1pr7vjj0"
 } : {
@@ -18,7 +38,8 @@ const StyledIcon = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "product
     parentRef,
     parentIsHovered,
     size,
-    as
+    as,
+    color
   } = _ref;
   return {
     width: icons[size],
@@ -27,13 +48,8 @@ const StyledIcon = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "product
       width: icons[size],
       height: icons[size]
     },
-    ...(variant !== "inherit" && {
-      ...(theme.values.color.text.link[variant] ? {
-        color: theme.values.color.text.link[variant]
-      } : {
-        color: theme.values.color.text[variant]
-      })
-    }),
+    // variant prop is deprecated
+    color: variant ? handleVariant(theme, variant) : handleColor(theme, color),
     ...(as === "span" && {
       verticalAlign: "middle"
     }),
@@ -50,14 +66,15 @@ const StyledIcon = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "product
       }
     })
   };
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkljb24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVFtQiIsImZpbGUiOiJJY29uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgSWNvbnNWYXJpYXRpb25zLCBCYXNlVmFyaWF0aW9ucyB9IGZyb20gXCIuLi8uLi90eXBlc1wiO1xuaW1wb3J0IHsgaWNvbnMgYXMgaWNvblNpemVzIH0gZnJvbSBcIi4uLy4uLy4uL2J1aWxkLXRva2Vucy9faWNvbl9zaXplc19tYXAuanNvblwiO1xuaW1wb3J0IGljb25zIGZyb20gXCIuLi8uLi8uLi9idWlsZC10b2tlbnMvYXNzZXRzL2ljb25zLmpzb25cIjtcbmltcG9ydCBpY29uczE2IGZyb20gXCIuLi8uLi8uLi9idWlsZC10b2tlbnMvYXNzZXRzL2ljb25zMTYuanNvblwiO1xuaW1wb3J0IHsgdXNlSG92ZXIgfSBmcm9tIFwiLi4vLi4vc2hhcmVkL3VzZUhvdmVyXCI7XG5cbmNvbnN0IFN0eWxlZEljb24gPSBzdHlsZWQuZGl2PFxuICBQYXJ0aWFsPEljb25Qcm9wcz4gJiB7XG4gICAgaXNIb3ZlcmFibGU6IGJvb2xlYW47XG4gICAgcGFyZW50UmVmOiBSZWFjdC5NdXRhYmxlUmVmT2JqZWN0PGFueT47XG4gICAgcGFyZW50SXNIb3ZlcmVkOiBib29sZWFuO1xuICB9XG4+KCh7IHRoZW1lLCB2YXJpYW50LCBpc0hvdmVyYWJsZSwgcGFyZW50UmVmLCBwYXJlbnRJc0hvdmVyZWQsIHNpemUsIGFzIH0pID0+ICh7XG4gIHdpZHRoOiBpY29uU2l6ZXNbc2l6ZV0sXG4gIGhlaWdodDogaWNvblNpemVzW3NpemVdLFxuICBcIiYgPiBzdmdcIjoge1xuICAgIHdpZHRoOiBpY29uU2l6ZXNbc2l6ZV0sXG4gICAgaGVpZ2h0OiBpY29uU2l6ZXNbc2l6ZV0sXG4gIH0sXG4gIC4uLih2YXJpYW50ICE9PSBcImluaGVyaXRcIiAmJiB7XG4gICAgLi4uKHRoZW1lLnZhbHVlcy5jb2xvci50ZXh0LmxpbmtbdmFyaWFudCBhcyBCYXNlVmFyaWF0aW9uc11cbiAgICAgID8ge1xuICAgICAgICAgIGNvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IudGV4dC5saW5rW3ZhcmlhbnQgYXMgQmFzZVZhcmlhdGlvbnNdLFxuICAgICAgICB9XG4gICAgICA6IHtcbiAgICAgICAgICBjb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLnRleHRbdmFyaWFudF0sXG4gICAgICAgIH0pLFxuICB9KSxcbiAgLi4uKGFzID09PSBcInNwYW5cIiAmJiB7XG4gICAgdmVydGljYWxBbGlnbjogXCJtaWRkbGVcIixcbiAgfSksXG4gIC4uLigocGFyZW50SXNIb3ZlcmVkIHx8IGlzSG92ZXJhYmxlKSAmJiB7XG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgfSksXG4gIC4uLihwYXJlbnRSZWYgJiYge1xuICAgIG9wYWNpdHk6IHBhcmVudElzSG92ZXJlZCA/IDEgOiAwLjYsXG4gIH0pLFxuICAuLi4oaXNIb3ZlcmFibGUgJiYge1xuICAgIG9wYWNpdHk6IDAuNixcbiAgICBcIjpob3ZlclwiOiB7XG4gICAgICBvcGFjaXR5OiAxLFxuICAgIH0sXG4gIH0pLFxufSkpO1xuXG5leHBvcnQgdHlwZSBJY29uTmFtZSA9IGtleW9mIHR5cGVvZiBpY29ucztcbmV4cG9ydCB0eXBlIEljb25OYW1lMTYgPSBrZXlvZiB0eXBlb2YgaWNvbnMxNjtcblxuZXhwb3J0IHR5cGUgSWNvblByb3BzID0ge1xuICAvKiogSWNvbiBuYW1lICovXG4gIG5hbWU6IEljb25OYW1lO1xuICAvKiogc2V0IHRvIHRydWUgdG8gbWFrZSB0aGUgaWNvbiBob3ZlcmFibGUsIHBhc3MgYSBwYXJlbnQncyByZWYgdG8gbWFrZSB0aGUgaWNvbiBtYXRjaCB0aGUgcGFyZW50IGhvdmVyICovXG4gIGhvdmVyYWJsZT86IGJvb2xlYW4gfCBSZWFjdC5NdXRhYmxlUmVmT2JqZWN0PGFueT47XG4gIC8qKiBzZXQgdG8gdHJ1ZSB0byBoYXZlIGFuIGlubGluZSBpY29uIHdyYXBwZWQgaW4gYSBzcGFuIGluc3RlYWQgb2YgZGl2ICovXG4gIGlubGluZT86IGJvb2xlYW47XG4gIC8qKiBJY29uIGNvbG9yIGNhbiBpbmhlcml0IHBhcmVudCBzdHlsZSBvciBjYW4gYmUgcHJpbWFyeSwgc2Vjb25kYXJ5IGFuZCB0ZXJ0aWFyeS4gKi9cbiAgdmFyaWFudD86IEljb25zVmFyaWF0aW9ucztcbiAgc2l6ZT86IFwic1wiIHwgXCJtXCIgfCBcImxcIjtcbiAgXCJkYXRhLWUyZS10ZXN0LWlkXCI/OiBzdHJpbmc7XG4gIFwiZGF0YS10ZXN0aWRcIj86IHN0cmluZztcbn07XG5cbmV4cG9ydCBjb25zdCBJY29uID0gKHtcbiAgbmFtZSxcbiAgaG92ZXJhYmxlID0gZmFsc2UsXG4gIGlubGluZSA9IGZhbHNlLFxuICBzaXplID0gXCJtXCIsXG4gIHZhcmlhbnQgPSBcImluaGVyaXRcIixcbiAgXCJkYXRhLWUyZS10ZXN0LWlkXCI6IGRhdGFFMmVUZXN0SWQsXG4gIFwiZGF0YS10ZXN0aWRcIjogZGF0YVRlc3RJZCxcbn06IEljb25Qcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCA9PiB7XG4gIGNvbnN0IGlzSG92ZXJhYmxlID0gdHlwZW9mIGhvdmVyYWJsZSA9PT0gXCJib29sZWFuXCIgJiYgaG92ZXJhYmxlO1xuICBjb25zdCBwYXJlbnRSZWYgPSB0eXBlb2YgaG92ZXJhYmxlICE9PSBcImJvb2xlYW5cIiAmJiBob3ZlcmFibGU7XG4gIGNvbnN0IHBhcmVudElzSG92ZXJlZCA9IHVzZUhvdmVyKHBhcmVudFJlZik7XG4gIGNvbnN0IGFzID0gaW5saW5lID8gXCJzcGFuXCIgOiBcImRpdlwiO1xuXG4gIHJldHVybiAoXG4gICAgPFN0eWxlZEljb25cbiAgICAgIGFzPXthc31cbiAgICAgIGRhdGEtZTJlLXRlc3QtaWQ9e2RhdGFFMmVUZXN0SWR9XG4gICAgICBkYXRhLXRlc3RpZD17ZGF0YVRlc3RJZH1cbiAgICAgIGRhdGEtZHMtaWQ9XCJJY29uXCJcbiAgICAgIGRhdGEtdmFyaWFudD17dmFyaWFudH1cbiAgICAgIHZhcmlhbnQ9e3ZhcmlhbnR9XG4gICAgICBpc0hvdmVyYWJsZT17aXNIb3ZlcmFibGV9XG4gICAgICBwYXJlbnRSZWY9e3BhcmVudFJlZn1cbiAgICAgIHBhcmVudElzSG92ZXJlZD17cGFyZW50SXNIb3ZlcmVkfVxuICAgICAgc2l6ZT17c2l6ZX1cbiAgICAgIGRhbmdlcm91c2x5U2V0SW5uZXJIVE1MPXt7XG4gICAgICAgIF9faHRtbDogKHNpemUgPT09IFwic1wiICYmIGljb25zMTZbbmFtZSBhcyBJY29uTmFtZTE2XSkgfHwgaWNvbnNbbmFtZV0sXG4gICAgICB9fVxuICAgIC8+XG4gICk7XG59O1xuIl19 */");
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkljb24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQStCbUIiLCJmaWxlIjoiSWNvbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IFRoZW1lIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgeyBJY29uc1ZhcmlhdGlvbnMsIEljb25zQ29sb3JzIH0gZnJvbSBcIi4uLy4uL3R5cGVzXCI7XG5pbXBvcnQgeyBpY29ucyBhcyBpY29uU2l6ZXMgfSBmcm9tIFwiLi4vLi4vLi4vYnVpbGQtdG9rZW5zL19pY29uX3NpemVzX21hcC5qc29uXCI7XG5pbXBvcnQgaWNvbnMgZnJvbSBcIi4uLy4uLy4uL2J1aWxkLXRva2Vucy9hc3NldHMvaWNvbnMuanNvblwiO1xuaW1wb3J0IGljb25zMTYgZnJvbSBcIi4uLy4uLy4uL2J1aWxkLXRva2Vucy9hc3NldHMvaWNvbnMxNi5qc29uXCI7XG5pbXBvcnQgeyB1c2VIb3ZlciB9IGZyb20gXCIuLi8uLi9zaGFyZWQvdXNlSG92ZXJcIjtcblxuY29uc3QgaGFuZGxlQ29sb3IgPSAodGhlbWU6IFRoZW1lLCBjb2xvcjogSWNvbnNDb2xvcnMpID0+IHtcbiAgc3dpdGNoIChjb2xvcikge1xuICAgIGNhc2UgXCJpbmhlcml0XCI6XG4gICAgICByZXR1cm4gXCJpbmhlcml0XCI7XG4gICAgZGVmYXVsdDpcbiAgICAgIHJldHVybiB0aGVtZS52YWx1ZXMuY29sb3IuaWNvbltjb2xvcl07XG4gIH1cbn07XG5cbmNvbnN0IGhhbmRsZVZhcmlhbnQgPSAodGhlbWU6IFRoZW1lLCB2YXJpYW50OiBJY29uc1ZhcmlhdGlvbnMpID0+IHtcbiAgc3dpdGNoICh2YXJpYW50KSB7XG4gICAgY2FzZSBcImluaGVyaXRcIjpcbiAgICAgIHJldHVybiBcImluaGVyaXRcIjtcbiAgICBjYXNlIFwicHJpbWFyeVwiOlxuICAgICAgcmV0dXJuIHRoZW1lLnZhbHVlcy5jb2xvci5pY29uLmFjY2VudDtcbiAgICBjYXNlIFwic2Vjb25kYXJ5XCI6XG4gICAgICByZXR1cm4gdGhlbWUudmFsdWVzLmNvbG9yLmljb24ucHJpbWFyeTtcbiAgICBkZWZhdWx0OlxuICAgICAgcmV0dXJuIHRoZW1lLnZhbHVlcy5jb2xvci5pY29uW3ZhcmlhbnRdO1xuICB9XG59O1xuXG5jb25zdCBTdHlsZWRJY29uID0gc3R5bGVkLmRpdjxcbiAgUGFydGlhbDxJY29uUHJvcHM+ICYge1xuICAgIGlzSG92ZXJhYmxlOiBib29sZWFuO1xuICAgIHBhcmVudFJlZjogUmVhY3QuTXV0YWJsZVJlZk9iamVjdDxhbnk+O1xuICAgIHBhcmVudElzSG92ZXJlZDogYm9vbGVhbjtcbiAgfVxuPihcbiAgKHtcbiAgICB0aGVtZSxcbiAgICB2YXJpYW50LFxuICAgIGlzSG92ZXJhYmxlLFxuICAgIHBhcmVudFJlZixcbiAgICBwYXJlbnRJc0hvdmVyZWQsXG4gICAgc2l6ZSxcbiAgICBhcyxcbiAgICBjb2xvcixcbiAgfSkgPT4gKHtcbiAgICB3aWR0aDogaWNvblNpemVzW3NpemVdLFxuICAgIGhlaWdodDogaWNvblNpemVzW3NpemVdLFxuICAgIFwiJiA+IHN2Z1wiOiB7XG4gICAgICB3aWR0aDogaWNvblNpemVzW3NpemVdLFxuICAgICAgaGVpZ2h0OiBpY29uU2l6ZXNbc2l6ZV0sXG4gICAgfSxcbiAgICAvLyB2YXJpYW50IHByb3AgaXMgZGVwcmVjYXRlZFxuICAgIGNvbG9yOiB2YXJpYW50ID8gaGFuZGxlVmFyaWFudCh0aGVtZSwgdmFyaWFudCkgOiBoYW5kbGVDb2xvcih0aGVtZSwgY29sb3IpLFxuICAgIC4uLihhcyA9PT0gXCJzcGFuXCIgJiYge1xuICAgICAgdmVydGljYWxBbGlnbjogXCJtaWRkbGVcIixcbiAgICB9KSxcbiAgICAuLi4oKHBhcmVudElzSG92ZXJlZCB8fCBpc0hvdmVyYWJsZSkgJiYge1xuICAgICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICB9KSxcbiAgICAuLi4ocGFyZW50UmVmICYmIHtcbiAgICAgIG9wYWNpdHk6IHBhcmVudElzSG92ZXJlZCA/IDEgOiAwLjYsXG4gICAgfSksXG4gICAgLi4uKGlzSG92ZXJhYmxlICYmIHtcbiAgICAgIG9wYWNpdHk6IDAuNixcbiAgICAgIFwiOmhvdmVyXCI6IHtcbiAgICAgICAgb3BhY2l0eTogMSxcbiAgICAgIH0sXG4gICAgfSksXG4gIH0pXG4pO1xuXG5leHBvcnQgdHlwZSBJY29uTmFtZSA9IGtleW9mIHR5cGVvZiBpY29ucztcbmV4cG9ydCB0eXBlIEljb25OYW1lMTYgPSBrZXlvZiB0eXBlb2YgaWNvbnMxNjtcblxuZXhwb3J0IHR5cGUgSWNvblByb3BzID0ge1xuICAvKiogSWNvbiBuYW1lICovXG4gIG5hbWU6IEljb25OYW1lO1xuICAvKiogc2V0IHRvIHRydWUgdG8gbWFrZSB0aGUgaWNvbiBob3ZlcmFibGUsIHBhc3MgYSBwYXJlbnQncyByZWYgdG8gbWFrZSB0aGUgaWNvbiBtYXRjaCB0aGUgcGFyZW50IGhvdmVyICovXG4gIGhvdmVyYWJsZT86IGJvb2xlYW4gfCBSZWFjdC5NdXRhYmxlUmVmT2JqZWN0PGFueT47XG4gIC8qKiBzZXQgdG8gdHJ1ZSB0byBoYXZlIGFuIGlubGluZSBpY29uIHdyYXBwZWQgaW4gYSBzcGFuIGluc3RlYWQgb2YgZGl2ICovXG4gIGlubGluZT86IGJvb2xlYW47XG4gIC8qKiBAZGVwcmVjYXRlZCB2YXJpYW50LCBwbGVhc2UgdXNlIFwiY29sb3JcIiBwcm9wIGluc3RlYWQgKi9cbiAgdmFyaWFudD86IEljb25zVmFyaWF0aW9ucztcbiAgLyoqIEljb24gY29sb3IgY2FuIGluaGVyaXQgcGFyZW50IHN0eWxlLiAqL1xuICBjb2xvcj86IEljb25zQ29sb3JzO1xuICBzaXplPzogXCJzXCIgfCBcIm1cIiB8IFwibFwiO1xuICBcImRhdGEtZTJlLXRlc3QtaWRcIj86IHN0cmluZztcbiAgXCJkYXRhLXRlc3RpZFwiPzogc3RyaW5nO1xufTtcblxuZXhwb3J0IGNvbnN0IEljb24gPSAoe1xuICBuYW1lLFxuICBob3ZlcmFibGUgPSBmYWxzZSxcbiAgaW5saW5lID0gZmFsc2UsXG4gIHNpemUgPSBcIm1cIixcbiAgY29sb3IgPSBcImluaGVyaXRcIixcbiAgdmFyaWFudCxcbiAgXCJkYXRhLWUyZS10ZXN0LWlkXCI6IGRhdGFFMmVUZXN0SWQsXG4gIFwiZGF0YS10ZXN0aWRcIjogZGF0YVRlc3RJZCxcbn06IEljb25Qcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCA9PiB7XG4gIGNvbnN0IGlzSG92ZXJhYmxlID0gdHlwZW9mIGhvdmVyYWJsZSA9PT0gXCJib29sZWFuXCIgJiYgaG92ZXJhYmxlO1xuICBjb25zdCBwYXJlbnRSZWYgPSB0eXBlb2YgaG92ZXJhYmxlICE9PSBcImJvb2xlYW5cIiAmJiBob3ZlcmFibGU7XG4gIGNvbnN0IHBhcmVudElzSG92ZXJlZCA9IHVzZUhvdmVyKHBhcmVudFJlZik7XG4gIGNvbnN0IGFzID0gaW5saW5lID8gXCJzcGFuXCIgOiBcImRpdlwiO1xuXG4gIHJldHVybiAoXG4gICAgPFN0eWxlZEljb25cbiAgICAgIGFzPXthc31cbiAgICAgIGRhdGEtZTJlLXRlc3QtaWQ9e2RhdGFFMmVUZXN0SWR9XG4gICAgICBkYXRhLXRlc3RpZD17ZGF0YVRlc3RJZH1cbiAgICAgIGRhdGEtZHMtaWQ9XCJJY29uXCJcbiAgICAgIGRhdGEtdmFyaWFudD17Y29sb3J9XG4gICAgICB2YXJpYW50PXt2YXJpYW50fVxuICAgICAgY29sb3I9e2NvbG9yfVxuICAgICAgaXNIb3ZlcmFibGU9e2lzSG92ZXJhYmxlfVxuICAgICAgcGFyZW50UmVmPXtwYXJlbnRSZWZ9XG4gICAgICBwYXJlbnRJc0hvdmVyZWQ9e3BhcmVudElzSG92ZXJlZH1cbiAgICAgIHNpemU9e3NpemV9XG4gICAgICBkYW5nZXJvdXNseVNldElubmVySFRNTD17e1xuICAgICAgICBfX2h0bWw6IChzaXplID09PSBcInNcIiAmJiBpY29uczE2W25hbWUgYXMgSWNvbk5hbWUxNl0pIHx8IGljb25zW25hbWVdLFxuICAgICAgfX1cbiAgICAvPlxuICApO1xufTtcbiJdfQ== */");
 const Icon = _ref2 => {
   let {
     name,
     hoverable = false,
     inline = false,
     size = "m",
-    variant = "inherit",
+    color = "inherit",
+    variant,
     "data-e2e-test-id": dataE2eTestId,
     "data-testid": dataTestId
   } = _ref2;
@@ -70,8 +87,9 @@ const Icon = _ref2 => {
     "data-e2e-test-id": dataE2eTestId,
     "data-testid": dataTestId,
     "data-ds-id": "Icon",
-    "data-variant": variant,
+    "data-variant": color,
     variant: variant,
+    color: color,
     isHoverable: isHoverable,
     parentRef: parentRef,
     parentIsHovered: parentIsHovered,

package/build/esm/src/components/Icon/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.js","sources":["../../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { IconsVariations, BaseVariations } from \"../../types\";\nimport { icons as iconSizes } from \"../../../build-tokens/_icon_sizes_map.json\";\nimport icons from \"../../../build-tokens/assets/icons.json\";\nimport icons16 from \"../../../build-tokens/assets/icons16.json\";\nimport { useHover } from \"../../shared/useHover\";\n\nconst StyledIcon = styled.div<\n  Partial<IconProps> & {\n    isHoverable: boolean;\n    parentRef: React.MutableRefObject<any>;\n    parentIsHovered: boolean;\n  }\n>(({ theme, variant, isHoverable, parentRef, parentIsHovered, size, as }) => ({\n  width: iconSizes[size],\n  height: iconSizes[size],\n  \"& > svg\": {\n    width: iconSizes[size],\n    height: iconSizes[size],\n  },\n  ...(variant !== \"inherit\" && {\n    ...(theme.values.color.text.link[variant as BaseVariations]\n      ? {\n          color: theme.values.color.text.link[variant as BaseVariations],\n        }\n      : {\n          color: theme.values.color.text[variant],\n        }),\n  }),\n  ...(as === \"span\" && {\n    verticalAlign: \"middle\",\n  }),\n  ...((parentIsHovered || isHoverable) && {\n    cursor: \"pointer\",\n  }),\n  ...(parentRef && {\n    opacity: parentIsHovered ? 1 : 0.6,\n  }),\n  ...(isHoverable && {\n    opacity: 0.6,\n    \":hover\": {\n      opacity: 1,\n    },\n  }),\n}));\n\nexport type IconName = keyof typeof icons;\nexport type IconName16 = keyof typeof icons16;\n\nexport type IconProps = {\n  /** Icon name */\n  name: IconName;\n  /** set to true to make the icon hoverable, pass a parent's ref to make the icon match the parent hover */\n  hoverable?: boolean | React.MutableRefObject<any>;\n  /** set to true to have an inline icon wrapped in a span instead of div */\n  inline?: boolean;\n  /** Icon color can inherit parent style or can be primary, secondary and tertiary. */\n  variant?: IconsVariations;\n  size?: \"s\" | \"m\" | \"l\";\n  \"data-e2e-test-id\"?: string;\n  \"data-testid\"?: string;\n};\n\nexport const Icon = ({\n  name,\n  hoverable = false,\n  inline = false,\n  size = \"m\",\n  variant = \"inherit\",\n  \"data-e2e-test-id\": dataE2eTestId,\n  \"data-testid\": dataTestId,\n}: IconProps): React.ReactElement => {\n  const isHoverable = typeof hoverable === \"boolean\" && hoverable;\n  const parentRef = typeof hoverable !== \"boolean\" && hoverable;\n  const parentIsHovered = useHover(parentRef);\n  const as = inline ? \"span\" : \"div\";\n\n  return (\n    <StyledIcon\n      as={as}\n      data-e2e-test-id={dataE2eTestId}\n      data-testid={dataTestId}\n      data-ds-id=\"Icon\"\n      data-variant={variant}\n      variant={variant}\n      isHoverable={isHoverable}\n      parentRef={parentRef}\n      parentIsHovered={parentIsHovered}\n      size={size}\n      dangerouslySetInnerHTML={{\n        __html: (size === \"s\" && icons16[name as IconName16]) || icons[name],\n      }}\n    />\n  );\n};\n"],"names":["StyledIcon","_styled","process","env","NODE_ENV","target","label","_ref","theme","variant","isHoverable","parentRef","parentIsHovered","size","as","width","iconSizes","height","values","color","text","link","verticalAlign","cursor","opacity","Icon","_ref2","name","hoverable","inline","dataE2eTestId","dataTestId","useHover","React","createElement","dangerouslySetInnerHTML","__html","icons16","icons"],"mappings":"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"}
+{"version":3,"file":"Icon.js","sources":["../../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Theme } from \"@emotion/react\";\nimport { IconsVariations, IconsColors } from \"../../types\";\nimport { icons as iconSizes } from \"../../../build-tokens/_icon_sizes_map.json\";\nimport icons from \"../../../build-tokens/assets/icons.json\";\nimport icons16 from \"../../../build-tokens/assets/icons16.json\";\nimport { useHover } from \"../../shared/useHover\";\n\nconst handleColor = (theme: Theme, color: IconsColors) => {\n  switch (color) {\n    case \"inherit\":\n      return \"inherit\";\n    default:\n      return theme.values.color.icon[color];\n  }\n};\n\nconst handleVariant = (theme: Theme, variant: IconsVariations) => {\n  switch (variant) {\n    case \"inherit\":\n      return \"inherit\";\n    case \"primary\":\n      return theme.values.color.icon.accent;\n    case \"secondary\":\n      return theme.values.color.icon.primary;\n    default:\n      return theme.values.color.icon[variant];\n  }\n};\n\nconst StyledIcon = styled.div<\n  Partial<IconProps> & {\n    isHoverable: boolean;\n    parentRef: React.MutableRefObject<any>;\n    parentIsHovered: boolean;\n  }\n>(\n  ({\n    theme,\n    variant,\n    isHoverable,\n    parentRef,\n    parentIsHovered,\n    size,\n    as,\n    color,\n  }) => ({\n    width: iconSizes[size],\n    height: iconSizes[size],\n    \"& > svg\": {\n      width: iconSizes[size],\n      height: iconSizes[size],\n    },\n    // variant prop is deprecated\n    color: variant ? handleVariant(theme, variant) : handleColor(theme, color),\n    ...(as === \"span\" && {\n      verticalAlign: \"middle\",\n    }),\n    ...((parentIsHovered || isHoverable) && {\n      cursor: \"pointer\",\n    }),\n    ...(parentRef && {\n      opacity: parentIsHovered ? 1 : 0.6,\n    }),\n    ...(isHoverable && {\n      opacity: 0.6,\n      \":hover\": {\n        opacity: 1,\n      },\n    }),\n  })\n);\n\nexport type IconName = keyof typeof icons;\nexport type IconName16 = keyof typeof icons16;\n\nexport type IconProps = {\n  /** Icon name */\n  name: IconName;\n  /** set to true to make the icon hoverable, pass a parent's ref to make the icon match the parent hover */\n  hoverable?: boolean | React.MutableRefObject<any>;\n  /** set to true to have an inline icon wrapped in a span instead of div */\n  inline?: boolean;\n  /** @deprecated variant, please use \"color\" prop instead */\n  variant?: IconsVariations;\n  /** Icon color can inherit parent style. */\n  color?: IconsColors;\n  size?: \"s\" | \"m\" | \"l\";\n  \"data-e2e-test-id\"?: string;\n  \"data-testid\"?: string;\n};\n\nexport const Icon = ({\n  name,\n  hoverable = false,\n  inline = false,\n  size = \"m\",\n  color = \"inherit\",\n  variant,\n  \"data-e2e-test-id\": dataE2eTestId,\n  \"data-testid\": dataTestId,\n}: IconProps): React.ReactElement => {\n  const isHoverable = typeof hoverable === \"boolean\" && hoverable;\n  const parentRef = typeof hoverable !== \"boolean\" && hoverable;\n  const parentIsHovered = useHover(parentRef);\n  const as = inline ? \"span\" : \"div\";\n\n  return (\n    <StyledIcon\n      as={as}\n      data-e2e-test-id={dataE2eTestId}\n      data-testid={dataTestId}\n      data-ds-id=\"Icon\"\n      data-variant={color}\n      variant={variant}\n      color={color}\n      isHoverable={isHoverable}\n      parentRef={parentRef}\n      parentIsHovered={parentIsHovered}\n      size={size}\n      dangerouslySetInnerHTML={{\n        __html: (size === \"s\" && icons16[name as IconName16]) || icons[name],\n      }}\n    />\n  );\n};\n"],"names":["handleColor","theme","color","values","icon","handleVariant","variant","accent","primary","StyledIcon","_styled","process","env","NODE_ENV","target","label","_ref","isHoverable","parentRef","parentIsHovered","size","as","width","iconSizes","height","verticalAlign","cursor","opacity","Icon","_ref2","name","hoverable","inline","dataE2eTestId","dataTestId","useHover","React","createElement","dangerouslySetInnerHTML","__html","icons16","icons"],"mappings":"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"}

package/build/esm/src/components/Link/Link.d.ts

@@ -1,13 +1,15 @@
 import React from "react";
-import { LinkVariations, LinkTextSize, PolymorphicComponentProps, AsProp } from "../../types";
+import { LinkVariations, LinkColors, LinkTextSize, PolymorphicComponentProps, AsProp } from "../../types";
 export declare type LinkProps = {
     size?: LinkTextSize;
     weight?: "normal" | "bold" | "inherit";
+    /** @deprecated variant, please use "color" prop instead */
     variant?: LinkVariations;
+    color?: LinkColors;
     onClick?: () => void;
     "data-e2e-test-id"?: string;
 };
-export declare function Link<C extends React.ElementType = "a">({ children, size, weight, variant, "data-e2e-test-id": dataE2eTestId, ...rest }: PolymorphicComponentProps<C, LinkProps>): React.ReactElement;
+export declare function Link<C extends React.ElementType = "a">({ children, size, weight, variant, color, "data-e2e-test-id": dataE2eTestId, ...rest }: PolymorphicComponentProps<C, LinkProps>): React.ReactElement;
 export declare namespace Link {
     var defaultProps: Partial<LinkProps> & AsProp<"a">;
 }

package/build/esm/src/components/Link/Link.js

@@ -4,18 +4,17 @@ import React from 'react';
 import { informDeprecation } from '../../shared/informDeprecation.js';
 
 const defaultProps = {
-  variant: "secondary",
+  color: "primary",
   as: "a"
 };
-const handleHover = (theme, variant) => {
+const handleVariant = (theme, variant, state) => {
   switch (variant) {
     case "primary":
-      return theme.values.color.text.link.primaryHover;
-    case "tertiary":
-      return theme.values.color.text.link.tertiaryHover;
+      return theme.values.color.text.accent[state];
     case "secondary":
+      return theme.values.color.text.primary[state];
     default:
-      return theme.values.color.text.link.secondaryHover;
+      return theme.values.color.text[variant][state];
   }
 };
 const StyledLink = /*#__PURE__*/_styled("a", process.env.NODE_ENV === "production" ? {
@@ -28,30 +27,32 @@ const StyledLink = /*#__PURE__*/_styled("a", process.env.NODE_ENV === "productio
     theme,
     weight,
     variant,
-    size
+    size,
+    color
   } = _ref;
   return {
     textDecoration: "underline",
     cursor: "pointer",
-    color: theme.values.color.text.link[variant],
     background: "none",
     border: "none",
     padding: 0,
+    color: variant ? handleVariant(theme, variant, "default") : theme.values.color.text[color].default,
     "&:hover": {
-      color: handleHover(theme, variant)
+      color: variant ? handleVariant(theme, variant, "hover") : theme.values.color.text[color].hover
     },
     fontSize: theme.variables.size.font.link[size],
     fontWeight: theme.variables.weight[weight],
     lineHeight: theme.variables.size.lineHeight.link[size],
     fontFamily: theme.variables.fontFamily.lato
   };
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxpbmsudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXVDbUIiLCJmaWxlIjoiTGluay50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKiBlc2xpbnQtZGlzYWJsZSByZWFjdC9qc3gtcHJvcHMtbm8tc3ByZWFkaW5nICovXG4vKiBlc2xpbnQtZGlzYWJsZSByZWFjdC9kZWZhdWx0LXByb3BzLW1hdGNoLXByb3AtdHlwZXMgKi9cbmltcG9ydCBSZWFjdCBmcm9tIFwicmVhY3RcIjtcblxuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUaGVtZSwgQ1NTT2JqZWN0IH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQge1xuICBMaW5rVmFyaWF0aW9ucyxcbiAgTGlua1RleHRTaXplLFxuICBQb2x5bW9ycGhpY0NvbXBvbmVudFByb3BzLFxuICBBc1Byb3AsXG59IGZyb20gXCIuLi8uLi90eXBlc1wiO1xuaW1wb3J0IHsgaW5mb3JtRGVwcmVjYXRpb24gfSBmcm9tIFwiLi4vLi4vc2hhcmVkL2luZm9ybURlcHJlY2F0aW9uXCI7XG5cbmV4cG9ydCB0eXBlIExpbmtQcm9wcyA9IHtcbiAgc2l6ZT86IExpbmtUZXh0U2l6ZTtcbiAgd2VpZ2h0PzogXCJub3JtYWxcIiB8IFwiYm9sZFwiIHwgXCJpbmhlcml0XCI7XG4gIHZhcmlhbnQ/OiBMaW5rVmFyaWF0aW9ucztcbiAgb25DbGljaz86ICgpID0+IHZvaWQ7XG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiPzogc3RyaW5nO1xufTtcblxuY29uc3QgZGVmYXVsdFByb3BzOiBQYXJ0aWFsPExpbmtQcm9wcz4gJiBBc1Byb3A8XCJhXCI+ID0ge1xuICB2YXJpYW50OiBcInNlY29uZGFyeVwiLFxuICBhczogXCJhXCIsXG59O1xuXG5jb25zdCBoYW5kbGVIb3ZlciA9ICh0aGVtZTogVGhlbWUsIHZhcmlhbnQ6IExpbmtWYXJpYXRpb25zKSA9PiB7XG4gIHN3aXRjaCAodmFyaWFudCkge1xuICAgIGNhc2UgXCJwcmltYXJ5XCI6XG4gICAgICByZXR1cm4gdGhlbWUudmFsdWVzLmNvbG9yLnRleHQubGluay5wcmltYXJ5SG92ZXI7XG4gICAgY2FzZSBcInRlcnRpYXJ5XCI6XG4gICAgICByZXR1cm4gdGhlbWUudmFsdWVzLmNvbG9yLnRleHQubGluay50ZXJ0aWFyeUhvdmVyO1xuICAgIGNhc2UgXCJzZWNvbmRhcnlcIjpcbiAgICBkZWZhdWx0OlxuICAgICAgcmV0dXJuIHRoZW1lLnZhbHVlcy5jb2xvci50ZXh0Lmxpbmsuc2Vjb25kYXJ5SG92ZXI7XG4gIH1cbn07XG5cbmNvbnN0IFN0eWxlZExpbmsgPSBzdHlsZWQuYTxQYXJ0aWFsPExpbmtQcm9wcz4+KFxuICAoeyB0aGVtZSwgd2VpZ2h0LCB2YXJpYW50LCBzaXplIH0pID0+XG4gICAgKHtcbiAgICAgIHRleHREZWNvcmF0aW9uOiBcInVuZGVybGluZVwiLFxuICAgICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICAgIGNvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IudGV4dC5saW5rW3ZhcmlhbnRdLFxuICAgICAgYmFja2dyb3VuZDogXCJub25lXCIsXG4gICAgICBib3JkZXI6IFwibm9uZVwiLFxuICAgICAgcGFkZGluZzogMCxcbiAgICAgIFwiJjpob3ZlclwiOiB7XG4gICAgICAgIGNvbG9yOiBoYW5kbGVIb3Zlcih0aGVtZSwgdmFyaWFudCksXG4gICAgICB9LFxuICAgICAgZm9udFNpemU6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmZvbnQubGlua1tzaXplXSxcbiAgICAgIGZvbnRXZWlnaHQ6IHRoZW1lLnZhcmlhYmxlcy53ZWlnaHRbd2VpZ2h0XSxcbiAgICAgIGxpbmVIZWlnaHQ6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmxpbmVIZWlnaHQubGlua1tzaXplXSxcbiAgICAgIGZvbnRGYW1pbHk6IHRoZW1lLnZhcmlhYmxlcy5mb250RmFtaWx5LmxhdG8sXG4gICAgfSBhcyBDU1NPYmplY3QpXG4pO1xuXG5leHBvcnQgZnVuY3Rpb24gTGluazxDIGV4dGVuZHMgUmVhY3QuRWxlbWVudFR5cGUgPSBcImFcIj4oe1xuICBjaGlsZHJlbixcbiAgc2l6ZSxcbiAgd2VpZ2h0LFxuICB2YXJpYW50LFxuICBcImRhdGEtZTJlLXRlc3QtaWRcIjogZGF0YUUyZVRlc3RJZCxcbiAgLi4ucmVzdFxufTogUG9seW1vcnBoaWNDb21wb25lbnRQcm9wczxDLCBMaW5rUHJvcHM+KTogUmVhY3QuUmVhY3RFbGVtZW50IHtcbiAgaWYgKHZhcmlhbnQgPT09IChcImxpZ2h0LXByaW1hcnlcIiBhcyBMaW5rVmFyaWF0aW9ucykpIHtcbiAgICBpbmZvcm1EZXByZWNhdGlvbihcbiAgICAgIHZhcmlhbnQsXG4gICAgICBcImxpZ2h0LXByaW1hcnlcIixcbiAgICAgIFwiTGluayBjb21wb25lbnRcIixcbiAgICAgIFwiUGxlYXNlIGNvbnNpZGVyIHVzaW5nIFN1YlRoZW1lUHJvdmlkZXIuIFxcbiBEZWxldGUgYWxsIG1lbnRpb25zIG9mIGxpZ2h0LXByaW1hcnkgaW4gRFMgYWZ0ZXIuXCJcbiAgICApO1xuICB9XG4gIHJldHVybiAoXG4gICAgPFN0eWxlZExpbmtcbiAgICAgIGRhdGEtZTJlLXRlc3QtaWQ9e2RhdGFFMmVUZXN0SWR9XG4gICAgICBkYXRhLWRzLWlkPVwiTGlua1wiXG4gICAgICB2YXJpYW50PXt2YXJpYW50fVxuICAgICAgc2l6ZT17c2l6ZX1cbiAgICAgIHdlaWdodD17d2VpZ2h0fVxuICAgICAgey4uLnJlc3R9XG4gICAgPlxuICAgICAge2NoaWxkcmVufVxuICAgIDwvU3R5bGVkTGluaz5cbiAgKTtcbn1cblxuTGluay5kZWZhdWx0UHJvcHMgPSBkZWZhdWx0UHJvcHM7XG4iXX0= */");
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxpbmsudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTZDbUIiLCJmaWxlIjoiTGluay50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKiBlc2xpbnQtZGlzYWJsZSByZWFjdC9qc3gtcHJvcHMtbm8tc3ByZWFkaW5nICovXG4vKiBlc2xpbnQtZGlzYWJsZSByZWFjdC9kZWZhdWx0LXByb3BzLW1hdGNoLXByb3AtdHlwZXMgKi9cbmltcG9ydCBSZWFjdCBmcm9tIFwicmVhY3RcIjtcblxuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUaGVtZSwgQ1NTT2JqZWN0IH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQge1xuICBMaW5rVmFyaWF0aW9ucyxcbiAgTGlua0NvbG9ycyxcbiAgTGlua1RleHRTaXplLFxuICBQb2x5bW9ycGhpY0NvbXBvbmVudFByb3BzLFxuICBBc1Byb3AsXG59IGZyb20gXCIuLi8uLi90eXBlc1wiO1xuaW1wb3J0IHsgaW5mb3JtRGVwcmVjYXRpb24gfSBmcm9tIFwiLi4vLi4vc2hhcmVkL2luZm9ybURlcHJlY2F0aW9uXCI7XG5cbmV4cG9ydCB0eXBlIExpbmtQcm9wcyA9IHtcbiAgc2l6ZT86IExpbmtUZXh0U2l6ZTtcbiAgd2VpZ2h0PzogXCJub3JtYWxcIiB8IFwiYm9sZFwiIHwgXCJpbmhlcml0XCI7XG4gIC8qKiBAZGVwcmVjYXRlZCB2YXJpYW50LCBwbGVhc2UgdXNlIFwiY29sb3JcIiBwcm9wIGluc3RlYWQgKi9cbiAgdmFyaWFudD86IExpbmtWYXJpYXRpb25zO1xuICBjb2xvcj86IExpbmtDb2xvcnM7XG4gIG9uQ2xpY2s/OiAoKSA9PiB2b2lkO1xuICBcImRhdGEtZTJlLXRlc3QtaWRcIj86IHN0cmluZztcbn07XG5cbmNvbnN0IGRlZmF1bHRQcm9wczogUGFydGlhbDxMaW5rUHJvcHM+ICYgQXNQcm9wPFwiYVwiPiA9IHtcbiAgY29sb3I6IFwicHJpbWFyeVwiLFxuICBhczogXCJhXCIsXG59O1xuXG5jb25zdCBoYW5kbGVWYXJpYW50ID0gKFxuICB0aGVtZTogVGhlbWUsXG4gIHZhcmlhbnQ6IExpbmtWYXJpYXRpb25zLFxuICBzdGF0ZTogXCJkZWZhdWx0XCIgfCBcImhvdmVyXCJcbikgPT4ge1xuICBzd2l0Y2ggKHZhcmlhbnQpIHtcbiAgICBjYXNlIFwicHJpbWFyeVwiOlxuICAgICAgcmV0dXJuIHRoZW1lLnZhbHVlcy5jb2xvci50ZXh0LmFjY2VudFtzdGF0ZV07XG4gICAgY2FzZSBcInNlY29uZGFyeVwiOlxuICAgICAgcmV0dXJuIHRoZW1lLnZhbHVlcy5jb2xvci50ZXh0LnByaW1hcnlbc3RhdGVdO1xuICAgIGRlZmF1bHQ6XG4gICAgICByZXR1cm4gdGhlbWUudmFsdWVzLmNvbG9yLnRleHRbdmFyaWFudF1bc3RhdGVdO1xuICB9XG59O1xuXG5jb25zdCBTdHlsZWRMaW5rID0gc3R5bGVkLmE8UGFydGlhbDxMaW5rUHJvcHM+PihcbiAgKHsgdGhlbWUsIHdlaWdodCwgdmFyaWFudCwgc2l6ZSwgY29sb3IgfSkgPT5cbiAgICAoe1xuICAgICAgdGV4dERlY29yYXRpb246IFwidW5kZXJsaW5lXCIsXG4gICAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgICAgYmFja2dyb3VuZDogXCJub25lXCIsXG4gICAgICBib3JkZXI6IFwibm9uZVwiLFxuICAgICAgcGFkZGluZzogMCxcbiAgICAgIGNvbG9yOiB2YXJpYW50XG4gICAgICAgID8gaGFuZGxlVmFyaWFudCh0aGVtZSwgdmFyaWFudCwgXCJkZWZhdWx0XCIpXG4gICAgICAgIDogdGhlbWUudmFsdWVzLmNvbG9yLnRleHRbY29sb3JdLmRlZmF1bHQsXG4gICAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgICBjb2xvcjogdmFyaWFudFxuICAgICAgICAgID8gaGFuZGxlVmFyaWFudCh0aGVtZSwgdmFyaWFudCwgXCJob3ZlclwiKVxuICAgICAgICAgIDogdGhlbWUudmFsdWVzLmNvbG9yLnRleHRbY29sb3JdLmhvdmVyLFxuICAgICAgfSxcbiAgICAgIGZvbnRTaXplOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5mb250Lmxpbmtbc2l6ZV0sXG4gICAgICBmb250V2VpZ2h0OiB0aGVtZS52YXJpYWJsZXMud2VpZ2h0W3dlaWdodF0sXG4gICAgICBsaW5lSGVpZ2h0OiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5saW5lSGVpZ2h0Lmxpbmtbc2l6ZV0sXG4gICAgICBmb250RmFtaWx5OiB0aGVtZS52YXJpYWJsZXMuZm9udEZhbWlseS5sYXRvLFxuICAgIH0gYXMgQ1NTT2JqZWN0KVxuKTtcblxuZXhwb3J0IGZ1bmN0aW9uIExpbms8QyBleHRlbmRzIFJlYWN0LkVsZW1lbnRUeXBlID0gXCJhXCI+KHtcbiAgY2hpbGRyZW4sXG4gIHNpemUsXG4gIHdlaWdodCxcbiAgdmFyaWFudCxcbiAgY29sb3IsXG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiOiBkYXRhRTJlVGVzdElkLFxuICAuLi5yZXN0XG59OiBQb2x5bW9ycGhpY0NvbXBvbmVudFByb3BzPEMsIExpbmtQcm9wcz4pOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBpZiAodmFyaWFudCA9PT0gKFwibGlnaHQtcHJpbWFyeVwiIGFzIExpbmtWYXJpYXRpb25zKSkge1xuICAgIGluZm9ybURlcHJlY2F0aW9uKFxuICAgICAgdmFyaWFudCxcbiAgICAgIFwibGlnaHQtcHJpbWFyeVwiLFxuICAgICAgXCJMaW5rIGNvbXBvbmVudFwiLFxuICAgICAgXCJQbGVhc2UgY29uc2lkZXIgdXNpbmcgU3ViVGhlbWVQcm92aWRlci4gXFxuIERlbGV0ZSBhbGwgbWVudGlvbnMgb2YgbGlnaHQtcHJpbWFyeSBpbiBEUyBhZnRlci5cIlxuICAgICk7XG4gIH1cblxuICByZXR1cm4gKFxuICAgIDxTdHlsZWRMaW5rXG4gICAgICBkYXRhLWUyZS10ZXN0LWlkPXtkYXRhRTJlVGVzdElkfVxuICAgICAgZGF0YS1kcy1pZD1cIkxpbmtcIlxuICAgICAgdmFyaWFudD17dmFyaWFudH1cbiAgICAgIGNvbG9yPXtjb2xvcn1cbiAgICAgIHNpemU9e3NpemV9XG4gICAgICB3ZWlnaHQ9e3dlaWdodH1cbiAgICAgIHsuLi5yZXN0fVxuICAgID5cbiAgICAgIHtjaGlsZHJlbn1cbiAgICA8L1N0eWxlZExpbms+XG4gICk7XG59XG5cbkxpbmsuZGVmYXVsdFByb3BzID0gZGVmYXVsdFByb3BzO1xuIl19 */");
 function Link(_ref2) {
   let {
     children,
     size,
     weight,
     variant,
+    color,
     "data-e2e-test-id": dataE2eTestId,
     ...rest
   } = _ref2;
@@ -62,6 +63,7 @@ function Link(_ref2) {
     "data-e2e-test-id": dataE2eTestId,
     "data-ds-id": "Link",
     variant: variant,
+    color: color,
     size: size,
     weight: weight
   }, rest), children);

package/build/esm/src/components/Link/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sources":["../../../../../src/components/Link/Link.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n/* eslint-disable react/default-props-match-prop-types */\nimport React from \"react\";\n\nimport styled from \"@emotion/styled\";\nimport { Theme, CSSObject } from \"@emotion/react\";\nimport {\n  LinkVariations,\n  LinkTextSize,\n  PolymorphicComponentProps,\n  AsProp,\n} from \"../../types\";\nimport { informDeprecation } from \"../../shared/informDeprecation\";\n\nexport type LinkProps = {\n  size?: LinkTextSize;\n  weight?: \"normal\" | \"bold\" | \"inherit\";\n  variant?: LinkVariations;\n  onClick?: () => void;\n  \"data-e2e-test-id\"?: string;\n};\n\nconst defaultProps: Partial<LinkProps> & AsProp<\"a\"> = {\n  variant: \"secondary\",\n  as: \"a\",\n};\n\nconst handleHover = (theme: Theme, variant: LinkVariations) => {\n  switch (variant) {\n    case \"primary\":\n      return theme.values.color.text.link.primaryHover;\n    case \"tertiary\":\n      return theme.values.color.text.link.tertiaryHover;\n    case \"secondary\":\n    default:\n      return theme.values.color.text.link.secondaryHover;\n  }\n};\n\nconst StyledLink = styled.a<Partial<LinkProps>>(\n  ({ theme, weight, variant, size }) =>\n    ({\n      textDecoration: \"underline\",\n      cursor: \"pointer\",\n      color: theme.values.color.text.link[variant],\n      background: \"none\",\n      border: \"none\",\n      padding: 0,\n      \"&:hover\": {\n        color: handleHover(theme, variant),\n      },\n      fontSize: theme.variables.size.font.link[size],\n      fontWeight: theme.variables.weight[weight],\n      lineHeight: theme.variables.size.lineHeight.link[size],\n      fontFamily: theme.variables.fontFamily.lato,\n    } as CSSObject)\n);\n\nexport function Link<C extends React.ElementType = \"a\">({\n  children,\n  size,\n  weight,\n  variant,\n  \"data-e2e-test-id\": dataE2eTestId,\n  ...rest\n}: PolymorphicComponentProps<C, LinkProps>): React.ReactElement {\n  if (variant === (\"light-primary\" as LinkVariations)) {\n    informDeprecation(\n      variant,\n      \"light-primary\",\n      \"Link component\",\n      \"Please consider using SubThemeProvider. \\n Delete all mentions of light-primary in DS after.\"\n    );\n  }\n  return (\n    <StyledLink\n      data-e2e-test-id={dataE2eTestId}\n      data-ds-id=\"Link\"\n      variant={variant}\n      size={size}\n      weight={weight}\n      {...rest}\n    >\n      {children}\n    </StyledLink>\n  );\n}\n\nLink.defaultProps = defaultProps;\n"],"names":["defaultProps","variant","as","handleHover","theme","values","color","text","link","primaryHover","tertiaryHover","secondaryHover","StyledLink","_styled","process","env","NODE_ENV","target","label","_ref","weight","size","textDecoration","cursor","background","border","padding","fontSize","variables","font","fontWeight","lineHeight","fontFamily","lato","Link","_ref2","children","dataE2eTestId","rest","informDeprecation","React","createElement","_extends"],"mappings":"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"}
+{"version":3,"file":"Link.js","sources":["../../../../../src/components/Link/Link.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n/* eslint-disable react/default-props-match-prop-types */\nimport React from \"react\";\n\nimport styled from \"@emotion/styled\";\nimport { Theme, CSSObject } from \"@emotion/react\";\nimport {\n  LinkVariations,\n  LinkColors,\n  LinkTextSize,\n  PolymorphicComponentProps,\n  AsProp,\n} from \"../../types\";\nimport { informDeprecation } from \"../../shared/informDeprecation\";\n\nexport type LinkProps = {\n  size?: LinkTextSize;\n  weight?: \"normal\" | \"bold\" | \"inherit\";\n  /** @deprecated variant, please use \"color\" prop instead */\n  variant?: LinkVariations;\n  color?: LinkColors;\n  onClick?: () => void;\n  \"data-e2e-test-id\"?: string;\n};\n\nconst defaultProps: Partial<LinkProps> & AsProp<\"a\"> = {\n  color: \"primary\",\n  as: \"a\",\n};\n\nconst handleVariant = (\n  theme: Theme,\n  variant: LinkVariations,\n  state: \"default\" | \"hover\"\n) => {\n  switch (variant) {\n    case \"primary\":\n      return theme.values.color.text.accent[state];\n    case \"secondary\":\n      return theme.values.color.text.primary[state];\n    default:\n      return theme.values.color.text[variant][state];\n  }\n};\n\nconst StyledLink = styled.a<Partial<LinkProps>>(\n  ({ theme, weight, variant, size, color }) =>\n    ({\n      textDecoration: \"underline\",\n      cursor: \"pointer\",\n      background: \"none\",\n      border: \"none\",\n      padding: 0,\n      color: variant\n        ? handleVariant(theme, variant, \"default\")\n        : theme.values.color.text[color].default,\n      \"&:hover\": {\n        color: variant\n          ? handleVariant(theme, variant, \"hover\")\n          : theme.values.color.text[color].hover,\n      },\n      fontSize: theme.variables.size.font.link[size],\n      fontWeight: theme.variables.weight[weight],\n      lineHeight: theme.variables.size.lineHeight.link[size],\n      fontFamily: theme.variables.fontFamily.lato,\n    } as CSSObject)\n);\n\nexport function Link<C extends React.ElementType = \"a\">({\n  children,\n  size,\n  weight,\n  variant,\n  color,\n  \"data-e2e-test-id\": dataE2eTestId,\n  ...rest\n}: PolymorphicComponentProps<C, LinkProps>): React.ReactElement {\n  if (variant === (\"light-primary\" as LinkVariations)) {\n    informDeprecation(\n      variant,\n      \"light-primary\",\n      \"Link component\",\n      \"Please consider using SubThemeProvider. \\n Delete all mentions of light-primary in DS after.\"\n    );\n  }\n\n  return (\n    <StyledLink\n      data-e2e-test-id={dataE2eTestId}\n      data-ds-id=\"Link\"\n      variant={variant}\n      color={color}\n      size={size}\n      weight={weight}\n      {...rest}\n    >\n      {children}\n    </StyledLink>\n  );\n}\n\nLink.defaultProps = defaultProps;\n"],"names":["defaultProps","color","as","handleVariant","theme","variant","state","values","text","accent","primary","StyledLink","_styled","process","env","NODE_ENV","target","label","_ref","weight","size","textDecoration","cursor","background","border","padding","default","hover","fontSize","variables","font","link","fontWeight","lineHeight","fontFamily","lato","Link","_ref2","children","dataE2eTestId","rest","informDeprecation","React","createElement","_extends"],"mappings":";;;;;AAyBA,MAAMA,YAA8C,GAAG;AACrDC,EAAAA,KAAK,EAAE,SAAS;AAChBC,EAAAA,EAAE,EAAE,GAAA;AACN,CAAC,CAAA;AAED,MAAMC,aAAa,GAAGA,CACpBC,KAAY,EACZC,OAAuB,EACvBC,KAA0B,KACvB;AACH,EAAA,QAAQD,OAAO;AACb,IAAA,KAAK,SAAS;MACZ,OAAOD,KAAK,CAACG,MAAM,CAACN,KAAK,CAACO,IAAI,CAACC,MAAM,CAACH,KAAK,CAAC,CAAA;AAC9C,IAAA,KAAK,WAAW;MACd,OAAOF,KAAK,CAACG,MAAM,CAACN,KAAK,CAACO,IAAI,CAACE,OAAO,CAACJ,KAAK,CAAC,CAAA;AAC/C,IAAA;AACE,MAAA,OAAOF,KAAK,CAACG,MAAM,CAACN,KAAK,CAACO,IAAI,CAACH,OAAO,CAAC,CAACC,KAAK,CAAC,CAAA;AAClD,GAAA;AACF,CAAC,CAAA;AAED,MAAMK,UAAU,gBAAGC,OAAA,CAAA,GAAA,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAA,YAAA,GAAA;EAAAC,MAAA,EAAA,UAAA;AAAA,CAAA,GAAA;EAAAA,MAAA,EAAA,UAAA;EAAAC,KAAA,EAAA,YAAA;AAAA,CAAA,CAAA,CACjBC,IAAA,IAAA;EAAA,IAAC;IAAEd,KAAK;IAAEe,MAAM;IAAEd,OAAO;IAAEe,IAAI;AAAEnB,IAAAA,KAAAA;AAAM,GAAC,GAAAiB,IAAA,CAAA;EAAA,OACrC;AACCG,IAAAA,cAAc,EAAE,WAAW;AAC3BC,IAAAA,MAAM,EAAE,SAAS;AACjBC,IAAAA,UAAU,EAAE,MAAM;AAClBC,IAAAA,MAAM,EAAE,MAAM;AACdC,IAAAA,OAAO,EAAE,CAAC;IACVxB,KAAK,EAAEI,OAAO,GACVF,aAAa,CAACC,KAAK,EAAEC,OAAO,EAAE,SAAS,CAAC,GACxCD,KAAK,CAACG,MAAM,CAACN,KAAK,CAACO,IAAI,CAACP,KAAK,CAAC,CAACyB,OAAO;AAC1C,IAAA,SAAS,EAAE;MACTzB,KAAK,EAAEI,OAAO,GACVF,aAAa,CAACC,KAAK,EAAEC,OAAO,EAAE,OAAO,CAAC,GACtCD,KAAK,CAACG,MAAM,CAACN,KAAK,CAACO,IAAI,CAACP,KAAK,CAAC,CAAC0B,KAAAA;KACpC;AACDC,IAAAA,QAAQ,EAAExB,KAAK,CAACyB,SAAS,CAACT,IAAI,CAACU,IAAI,CAACC,IAAI,CAACX,IAAI,CAAC;IAC9CY,UAAU,EAAE5B,KAAK,CAACyB,SAAS,CAACV,MAAM,CAACA,MAAM,CAAC;AAC1Cc,IAAAA,UAAU,EAAE7B,KAAK,CAACyB,SAAS,CAACT,IAAI,CAACa,UAAU,CAACF,IAAI,CAACX,IAAI,CAAC;AACtDc,IAAAA,UAAU,EAAE9B,KAAK,CAACyB,SAAS,CAACK,UAAU,CAACC,IAAAA;GACxC,CAAA;AAAA,CAAc,EAAAtB,OAAA,CAAAC,GAAA,CAAAC,QAAA,01HACnB,CAAC,CAAA;AAEM,SAASqB,IAAIA,CAAAC,KAAA,EAQ4C;EAAA,IARR;IACtDC,QAAQ;IACRlB,IAAI;IACJD,MAAM;IACNd,OAAO;IACPJ,KAAK;AACL,IAAA,kBAAkB,EAAEsC,aAAa;IACjC,GAAGC,IAAAA;AACoC,GAAC,GAAAH,KAAA,CAAA;EACxC,IAAIhC,OAAO,KAAM,eAAkC,EAAE;IACnDoC,iBAAiB,CACfpC,OAAO,EACP,eAAe,EACf,gBAAgB,EAChB,8FACF,CAAC,CAAA;AACH,GAAA;AAEA,EAAA,oBACEqC,KAAA,CAAAC,aAAA,CAAChC,UAAU,EAAAiC,QAAA,CAAA;AACT,IAAA,kBAAA,EAAkBL,aAAc;AAChC,IAAA,YAAA,EAAW,MAAM;AACjBlC,IAAAA,OAAO,EAAEA,OAAQ;AACjBJ,IAAAA,KAAK,EAAEA,KAAM;AACbmB,IAAAA,IAAI,EAAEA,IAAK;AACXD,IAAAA,MAAM,EAAEA,MAAAA;GACJqB,EAAAA,IAAI,CAEPF,EAAAA,QACS,CAAC,CAAA;AAEjB,CAAA;AAEAF,IAAI,CAACpC,YAAY,GAAGA,YAAY;;;;"}

package/build/esm/src/components/Logo/Logo.js

@@ -12,9 +12,9 @@ const StyledLogoElement = /*#__PURE__*/_styled("a", process.env.NODE_ENV === "pr
     theme
   } = _ref;
   return {
-    color: theme.values.color.logo.base
+    color: theme.values.color.text.primary.default
   };
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxvZ28udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVcwQiIsImZpbGUiOiJMb2dvLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IGxvZ28gZnJvbSBcIi4uLy4uLy4uL2J1aWxkLXRva2Vucy9hc3NldHMvbG9nby5qc29uXCI7XG5cbmV4cG9ydCB0eXBlIExvZ29Qcm9wcyA9IHtcbiAgaHJlZjogc3RyaW5nO1xuICBhcmlhTGFiZWw/OiBzdHJpbmc7XG4gIHJvbGU/OiBzdHJpbmc7XG4gIFwiZGF0YS10ZXN0aWRcIj86IHN0cmluZztcbn07XG5cbmNvbnN0IFN0eWxlZExvZ29FbGVtZW50ID0gc3R5bGVkLmEoKHsgdGhlbWUgfSkgPT4gKHtcbiAgY29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci5sb2dvLmJhc2UsXG59KSk7XG5cbmV4cG9ydCBmdW5jdGlvbiBMb2dvKHtcbiAgaHJlZixcbiAgYXJpYUxhYmVsID0gXCJNYWluXCIsXG4gIHJvbGUgPSBcIm5hdmlnYXRpb25cIixcbiAgXCJkYXRhLXRlc3RpZFwiOiBkYXRhVGVzdElkLFxufTogTG9nb1Byb3BzKTogUmVhY3QuUmVhY3RFbGVtZW50IHtcbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkTG9nb0VsZW1lbnRcbiAgICAgIGhyZWY9e2hyZWZ9XG4gICAgICBhcmlhLWxhYmVsPXthcmlhTGFiZWx9XG4gICAgICByb2xlPXtyb2xlfVxuICAgICAgZGFuZ2Vyb3VzbHlTZXRJbm5lckhUTUw9e3tcbiAgICAgICAgX19odG1sOiBsb2dvW1wiYW1ib3NzLWxvZ29cIl0sXG4gICAgICB9fVxuICAgICAgZGF0YS10ZXN0aWQ9e2RhdGFUZXN0SWR9XG4gICAgICBkYXRhLWRzLWlkPVwiTG9nb1wiXG4gICAgLz5cbiAgKTtcbn1cbiJdfQ== */");
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxvZ28udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVcwQiIsImZpbGUiOiJMb2dvLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IGxvZ28gZnJvbSBcIi4uLy4uLy4uL2J1aWxkLXRva2Vucy9hc3NldHMvbG9nby5qc29uXCI7XG5cbmV4cG9ydCB0eXBlIExvZ29Qcm9wcyA9IHtcbiAgaHJlZjogc3RyaW5nO1xuICBhcmlhTGFiZWw/OiBzdHJpbmc7XG4gIHJvbGU/OiBzdHJpbmc7XG4gIFwiZGF0YS10ZXN0aWRcIj86IHN0cmluZztcbn07XG5cbmNvbnN0IFN0eWxlZExvZ29FbGVtZW50ID0gc3R5bGVkLmEoKHsgdGhlbWUgfSkgPT4gKHtcbiAgY29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci50ZXh0LnByaW1hcnkuZGVmYXVsdCxcbn0pKTtcblxuZXhwb3J0IGZ1bmN0aW9uIExvZ28oe1xuICBocmVmLFxuICBhcmlhTGFiZWwgPSBcIk1haW5cIixcbiAgcm9sZSA9IFwibmF2aWdhdGlvblwiLFxuICBcImRhdGEtdGVzdGlkXCI6IGRhdGFUZXN0SWQsXG59OiBMb2dvUHJvcHMpOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICByZXR1cm4gKFxuICAgIDxTdHlsZWRMb2dvRWxlbWVudFxuICAgICAgaHJlZj17aHJlZn1cbiAgICAgIGFyaWEtbGFiZWw9e2FyaWFMYWJlbH1cbiAgICAgIHJvbGU9e3JvbGV9XG4gICAgICBkYW5nZXJvdXNseVNldElubmVySFRNTD17e1xuICAgICAgICBfX2h0bWw6IGxvZ29bXCJhbWJvc3MtbG9nb1wiXSxcbiAgICAgIH19XG4gICAgICBkYXRhLXRlc3RpZD17ZGF0YVRlc3RJZH1cbiAgICAgIGRhdGEtZHMtaWQ9XCJMb2dvXCJcbiAgICAvPlxuICApO1xufVxuIl19 */");
 function Logo(_ref2) {
   let {
     href,

package/build/esm/src/components/Logo/Logo.js.map

@@ -1 +1 @@
-{"version":3,"file":"Logo.js","sources":["../../../../../src/components/Logo/Logo.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport logo from \"../../../build-tokens/assets/logo.json\";\n\nexport type LogoProps = {\n  href: string;\n  ariaLabel?: string;\n  role?: string;\n  \"data-testid\"?: string;\n};\n\nconst StyledLogoElement = styled.a(({ theme }) => ({\n  color: theme.values.color.logo.base,\n}));\n\nexport function Logo({\n  href,\n  ariaLabel = \"Main\",\n  role = \"navigation\",\n  \"data-testid\": dataTestId,\n}: LogoProps): React.ReactElement {\n  return (\n    <StyledLogoElement\n      href={href}\n      aria-label={ariaLabel}\n      role={role}\n      dangerouslySetInnerHTML={{\n        __html: logo[\"amboss-logo\"],\n      }}\n      data-testid={dataTestId}\n      data-ds-id=\"Logo\"\n    />\n  );\n}\n"],"names":["StyledLogoElement","_styled","process","env","NODE_ENV","target","label","_ref","theme","color","values","logo","base","Logo","_ref2","href","ariaLabel","role","dataTestId","React","createElement","dangerouslySetInnerHTML","__html"],"mappings":";;;;AAWA,MAAMA,iBAAiB,gBAAGC,OAAA,CAAA,GAAA,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAA,YAAA,GAAA;EAAAC,MAAA,EAAA,UAAA;AAAA,CAAA,GAAA;EAAAA,MAAA,EAAA,UAAA;EAAAC,KAAA,EAAA,mBAAA;AAAA,CAAA,CAAA,CAASC,IAAA,IAAA;EAAA,IAAC;AAAEC,IAAAA,KAAAA;AAAM,GAAC,GAAAD,IAAA,CAAA;EAAA,OAAM;IACjDE,KAAK,EAAED,KAAK,CAACE,MAAM,CAACD,KAAK,CAACE,IAAI,CAACC,IAAAA;GAChC,CAAA;AAAA,CAAC,EAAAV,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAC,YAAA,GAAA,EAAA,GAAA,6tCAAA,CAAA,CAAA;AAEI,SAASS,IAAIA,CAAAC,KAAA,EAKc;EAAA,IALb;IACnBC,IAAI;AACJC,IAAAA,SAAS,GAAG,MAAM;AAClBC,IAAAA,IAAI,GAAG,YAAY;AACnB,IAAA,aAAa,EAAEC,UAAAA;AACN,GAAC,GAAAJ,KAAA,CAAA;AACV,EAAA,oBACEK,KAAA,CAAAC,aAAA,CAACpB,iBAAiB,EAAA;AAChBe,IAAAA,IAAI,EAAEA,IAAK;AACX,IAAA,YAAA,EAAYC,SAAU;AACtBC,IAAAA,IAAI,EAAEA,IAAK;AACXI,IAAAA,uBAAuB,EAAE;MACvBC,MAAM,EAAEX,IAAI,CAAC,aAAa,CAAA;KAC1B;AACF,IAAA,aAAA,EAAaO,UAAW;IACxB,YAAW,EAAA,MAAA;AAAM,GAClB,CAAC,CAAA;AAEN;;;;"}
+{"version":3,"file":"Logo.js","sources":["../../../../../src/components/Logo/Logo.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport logo from \"../../../build-tokens/assets/logo.json\";\n\nexport type LogoProps = {\n  href: string;\n  ariaLabel?: string;\n  role?: string;\n  \"data-testid\"?: string;\n};\n\nconst StyledLogoElement = styled.a(({ theme }) => ({\n  color: theme.values.color.text.primary.default,\n}));\n\nexport function Logo({\n  href,\n  ariaLabel = \"Main\",\n  role = \"navigation\",\n  \"data-testid\": dataTestId,\n}: LogoProps): React.ReactElement {\n  return (\n    <StyledLogoElement\n      href={href}\n      aria-label={ariaLabel}\n      role={role}\n      dangerouslySetInnerHTML={{\n        __html: logo[\"amboss-logo\"],\n      }}\n      data-testid={dataTestId}\n      data-ds-id=\"Logo\"\n    />\n  );\n}\n"],"names":["StyledLogoElement","_styled","process","env","NODE_ENV","target","label","_ref","theme","color","values","text","primary","default","Logo","_ref2","href","ariaLabel","role","dataTestId","React","createElement","dangerouslySetInnerHTML","__html","logo"],"mappings":";;;;AAWA,MAAMA,iBAAiB,gBAAGC,OAAA,CAAA,GAAA,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAA,YAAA,GAAA;EAAAC,MAAA,EAAA,UAAA;AAAA,CAAA,GAAA;EAAAA,MAAA,EAAA,UAAA;EAAAC,KAAA,EAAA,mBAAA;AAAA,CAAA,CAAA,CAASC,IAAA,IAAA;EAAA,IAAC;AAAEC,IAAAA,KAAAA;AAAM,GAAC,GAAAD,IAAA,CAAA;EAAA,OAAM;IACjDE,KAAK,EAAED,KAAK,CAACE,MAAM,CAACD,KAAK,CAACE,IAAI,CAACC,OAAO,CAACC,OAAAA;GACxC,CAAA;AAAA,CAAC,EAAAX,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAC,YAAA,GAAA,EAAA,GAAA,yuCAAA,CAAA,CAAA;AAEI,SAASU,IAAIA,CAAAC,KAAA,EAKc;EAAA,IALb;IACnBC,IAAI;AACJC,IAAAA,SAAS,GAAG,MAAM;AAClBC,IAAAA,IAAI,GAAG,YAAY;AACnB,IAAA,aAAa,EAAEC,UAAAA;AACN,GAAC,GAAAJ,KAAA,CAAA;AACV,EAAA,oBACEK,KAAA,CAAAC,aAAA,CAACrB,iBAAiB,EAAA;AAChBgB,IAAAA,IAAI,EAAEA,IAAK;AACX,IAAA,YAAA,EAAYC,SAAU;AACtBC,IAAAA,IAAI,EAAEA,IAAK;AACXI,IAAAA,uBAAuB,EAAE;MACvBC,MAAM,EAAEC,IAAI,CAAC,aAAa,CAAA;KAC1B;AACF,IAAA,aAAA,EAAaL,UAAW;IACxB,YAAW,EAAA,MAAA;AAAM,GAClB,CAAC,CAAA;AAEN;;;;"}

package/build/esm/src/components/MediaItem/MediaItem.js

@@ -25,7 +25,7 @@ const StyledMediaContainer = /*#__PURE__*/_styled("div", process.env.NODE_ENV ==
       height: "100%"
     })
   };
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk1lZGlhSXRlbS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUI2QiIsImZpbGUiOiJNZWRpYUl0ZW0udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb24gfSBmcm9tIFwiLi4vSWNvbi9JY29uXCI7XG5cbmV4cG9ydCB0eXBlIE1lZGlhSXRlbVByb3BzID0ge1xuICBzcmM6IHN0cmluZztcbiAgdGl0bGU6IHN0cmluZztcbiAgLyoqIFNldHMgdGhlIGhlaWdodCBvZiB0aGUgbWVkaWEgdG8gZXF1YWwgdGhlIHdpZHRoIHZhbHVlIG1ha2luZyBhIHNxdWFyZSA8YnIvPlxuICAgKi9cbiAgc3F1YXJlQnlXaWR0aD86IGJvb2xlYW47XG4gIC8qKiBTcGVjaWZ5IGZpdCBvZiB0aGUgbWVkaWEgYmFja2dyb3VuZC4gPGJyLz5cbiAgICogXCJjb250YWluXCIgLSB0aGUgbWVkaWEga2VlcHMgaXRzIGFzcGVjdCByYXRpbywgYnV0IGlzIHJlc2l6ZWQgdG8gZml0IHdpdGhpbiB0aGUgZ2l2ZW4gZGltZW5zaW9uLiA8YnIvPlxuICAgKiBcImNvdmVyXCIgLSB0aGUgbWVkaWEga2VlcHMgaXRzIGFzcGVjdCByYXRpbyBhbmQgZmlsbHMgdGhlIGdpdmVuIGRpbWVuc2lvbi4gVGhlIG1lZGlhIHdpbGwgYmUgY2xpcHBlZCB0byBmaXQuXG4gICAqL1xuICBmaXQ6IFwiY292ZXJcIiB8IFwiY29udGFpblwiO1xufTtcblxuY29uc3QgU3R5bGVkTWVkaWFDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PihcbiAgKHsgc3F1YXJlQnlXaWR0aCB9KSA9PiAoe1xuICAgIHBvc2l0aW9uOiBcInJlbGF0aXZlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBcIiB0cmFuc3BhcmVudFwiLFxuICAgIG92ZXJmbG93OiBcImhpZGRlblwiLFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJvcmRlclJhZGl1czogXCJpbmhlcml0XCIsXG4gICAgLi4uKHNxdWFyZUJ5V2lkdGggJiYgeyBwYWRkaW5nVG9wOiBcIjEwMCVcIiB9KSxcbiAgICAuLi4oIXNxdWFyZUJ5V2lkdGggJiYgeyBoZWlnaHQ6IFwiMTAwJVwiIH0pLFxuICB9KVxuKTtcblxuY29uc3QgU3R5bGVkTWVkaWEgPSBzdHlsZWQuaW1nPFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PigoeyB0aGVtZSwgZml0IH0pID0+ICh7XG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIHRvcDogMCxcbiAgbGVmdDogMCxcbiAgZGlzcGxheTogXCJibG9ja1wiLFxuICB3aWR0aDogXCIxMDAlXCIsXG4gIGhlaWdodDogXCIxMDAlXCIsXG4gIGJhY2tncm91bmRQb3NpdGlvbjogXCJjZW50ZXJcIixcbiAgb2JqZWN0Rml0OiBmaXQsXG4gIGJhY2tncm91bmRSZXBlYXQ6IFwibm8tcmVwZWF0XCIsXG4gIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gIFwiOmdsb2JhbCguaXNEYXJrbW9kZUFjdGl2ZSkgJlwiOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5sYXllcl8xLFxuICB9LFxufSkpO1xuXG5jb25zdCBTdHlsZWRDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PihcbiAgKHsgdGhlbWUsIHNxdWFyZUJ5V2lkdGggfSkgPT4gKHtcbiAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgIHRvcDogMCxcbiAgICBsZWZ0OiAwLFxuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAganVzdGlmeUNvbnRlbnQ6IFwiY2VudGVyXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuYnV0dG9uLnNlY29uZGFyeS5ob3ZlcixcbiAgICAuLi4oc3F1YXJlQnlXaWR0aCAmJiB7IHBhZGRpbmdUb3A6IFwiMTAwJVwiIH0pLFxuICAgIC4uLighc3F1YXJlQnlXaWR0aCAmJiB7IGhlaWdodDogXCIxMDAlXCIgfSksXG4gIH0pXG4pO1xuXG5leHBvcnQgZnVuY3Rpb24gTWVkaWFJdGVtKHtcbiAgc3JjLFxuICB0aXRsZSxcbiAgc3F1YXJlQnlXaWR0aCxcbiAgZml0LFxufTogTWVkaWFJdGVtUHJvcHMpOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBjb25zdCBbc3JjRXJyb3IsIHNldFNyY0Vycm9yXSA9IHVzZVN0YXRlKGZhbHNlKTtcblxuICBjb25zdCBpbWFnZSA9IG5ldyBJbWFnZSgpO1xuICBpbWFnZS5zcmMgPSBzcmM7XG4gIGltYWdlLm9uZXJyb3IgPSAoKSA9PiB7XG4gICAgaWYgKCFzcmNFcnJvcikge1xuICAgICAgc2V0U3JjRXJyb3IodHJ1ZSk7XG4gICAgfVxuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPFN0eWxlZE1lZGlhQ29udGFpbmVyIHNxdWFyZUJ5V2lkdGg9e3NxdWFyZUJ5V2lkdGh9IGRhdGEtZHMtaWQ9XCJNZWRpYUl0ZW1cIj5cbiAgICAgIHshc3JjRXJyb3IgPyAoXG4gICAgICAgIDxTdHlsZWRNZWRpYSBzcmM9e3NyY30gdGl0bGU9e3RpdGxlfSBhbHQ9e3RpdGxlfSBmaXQ9e2ZpdH0gLz5cbiAgICAgICkgOiAoXG4gICAgICAgIDxTdHlsZWRDb250YWluZXIgdGl0bGU9XCJFcnJvciBub3QgZm91bmRcIj5cbiAgICAgICAgICA8SWNvbiBuYW1lPVwiaW1hZ2UtYnJva2VuXCIgdmFyaWFudD1cInRlcnRpYXJ5XCIgLz5cbiAgICAgICAgPC9TdHlsZWRDb250YWluZXI+XG4gICAgICApfVxuICAgIDwvU3R5bGVkTWVkaWFDb250YWluZXI+XG4gICk7XG59XG5cbk1lZGlhSXRlbS5kZWZhdWx0UHJvcHMgPSB7XG4gIG1lZGlhQ292ZXI6IHRydWUsXG4gIHNxdWFyZUJ5V2lkdGg6IGZhbHNlLFxuICBmaXQ6IFwiY292ZXJcIixcbn07XG4iXX0= */");
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk1lZGlhSXRlbS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUI2QiIsImZpbGUiOiJNZWRpYUl0ZW0udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb24gfSBmcm9tIFwiLi4vSWNvbi9JY29uXCI7XG5cbmV4cG9ydCB0eXBlIE1lZGlhSXRlbVByb3BzID0ge1xuICBzcmM6IHN0cmluZztcbiAgdGl0bGU6IHN0cmluZztcbiAgLyoqIFNldHMgdGhlIGhlaWdodCBvZiB0aGUgbWVkaWEgdG8gZXF1YWwgdGhlIHdpZHRoIHZhbHVlIG1ha2luZyBhIHNxdWFyZSA8YnIvPlxuICAgKi9cbiAgc3F1YXJlQnlXaWR0aD86IGJvb2xlYW47XG4gIC8qKiBTcGVjaWZ5IGZpdCBvZiB0aGUgbWVkaWEgYmFja2dyb3VuZC4gPGJyLz5cbiAgICogXCJjb250YWluXCIgLSB0aGUgbWVkaWEga2VlcHMgaXRzIGFzcGVjdCByYXRpbywgYnV0IGlzIHJlc2l6ZWQgdG8gZml0IHdpdGhpbiB0aGUgZ2l2ZW4gZGltZW5zaW9uLiA8YnIvPlxuICAgKiBcImNvdmVyXCIgLSB0aGUgbWVkaWEga2VlcHMgaXRzIGFzcGVjdCByYXRpbyBhbmQgZmlsbHMgdGhlIGdpdmVuIGRpbWVuc2lvbi4gVGhlIG1lZGlhIHdpbGwgYmUgY2xpcHBlZCB0byBmaXQuXG4gICAqL1xuICBmaXQ6IFwiY292ZXJcIiB8IFwiY29udGFpblwiO1xufTtcblxuY29uc3QgU3R5bGVkTWVkaWFDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PihcbiAgKHsgc3F1YXJlQnlXaWR0aCB9KSA9PiAoe1xuICAgIHBvc2l0aW9uOiBcInJlbGF0aXZlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBcIiB0cmFuc3BhcmVudFwiLFxuICAgIG92ZXJmbG93OiBcImhpZGRlblwiLFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJvcmRlclJhZGl1czogXCJpbmhlcml0XCIsXG4gICAgLi4uKHNxdWFyZUJ5V2lkdGggJiYgeyBwYWRkaW5nVG9wOiBcIjEwMCVcIiB9KSxcbiAgICAuLi4oIXNxdWFyZUJ5V2lkdGggJiYgeyBoZWlnaHQ6IFwiMTAwJVwiIH0pLFxuICB9KVxuKTtcblxuY29uc3QgU3R5bGVkTWVkaWEgPSBzdHlsZWQuaW1nPFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PigoeyB0aGVtZSwgZml0IH0pID0+ICh7XG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIHRvcDogMCxcbiAgbGVmdDogMCxcbiAgZGlzcGxheTogXCJibG9ja1wiLFxuICB3aWR0aDogXCIxMDAlXCIsXG4gIGhlaWdodDogXCIxMDAlXCIsXG4gIGJhY2tncm91bmRQb3NpdGlvbjogXCJjZW50ZXJcIixcbiAgb2JqZWN0Rml0OiBmaXQsXG4gIGJhY2tncm91bmRSZXBlYXQ6IFwibm8tcmVwZWF0XCIsXG4gIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gIFwiOmdsb2JhbCguaXNEYXJrbW9kZUFjdGl2ZSkgJlwiOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gIH0sXG59KSk7XG5cbmNvbnN0IFN0eWxlZENvbnRhaW5lciA9IHN0eWxlZC5kaXY8UGFydGlhbDxNZWRpYUl0ZW1Qcm9wcz4+KFxuICAoeyB0aGVtZSwgc3F1YXJlQnlXaWR0aCB9KSA9PiAoe1xuICAgIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gICAgdG9wOiAwLFxuICAgIGxlZnQ6IDAsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIixcbiAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC50cmFuc3BhcmVudC5hY3RpdmUsXG4gICAgLi4uKHNxdWFyZUJ5V2lkdGggJiYgeyBwYWRkaW5nVG9wOiBcIjEwMCVcIiB9KSxcbiAgICAuLi4oIXNxdWFyZUJ5V2lkdGggJiYgeyBoZWlnaHQ6IFwiMTAwJVwiIH0pLFxuICB9KVxuKTtcblxuZXhwb3J0IGZ1bmN0aW9uIE1lZGlhSXRlbSh7XG4gIHNyYyxcbiAgdGl0bGUsXG4gIHNxdWFyZUJ5V2lkdGgsXG4gIGZpdCxcbn06IE1lZGlhSXRlbVByb3BzKTogUmVhY3QuUmVhY3RFbGVtZW50IHtcbiAgY29uc3QgW3NyY0Vycm9yLCBzZXRTcmNFcnJvcl0gPSB1c2VTdGF0ZShmYWxzZSk7XG5cbiAgY29uc3QgaW1hZ2UgPSBuZXcgSW1hZ2UoKTtcbiAgaW1hZ2Uuc3JjID0gc3JjO1xuICBpbWFnZS5vbmVycm9yID0gKCkgPT4ge1xuICAgIGlmICghc3JjRXJyb3IpIHtcbiAgICAgIHNldFNyY0Vycm9yKHRydWUpO1xuICAgIH1cbiAgfTtcblxuICByZXR1cm4gKFxuICAgIDxTdHlsZWRNZWRpYUNvbnRhaW5lciBzcXVhcmVCeVdpZHRoPXtzcXVhcmVCeVdpZHRofSBkYXRhLWRzLWlkPVwiTWVkaWFJdGVtXCI+XG4gICAgICB7IXNyY0Vycm9yID8gKFxuICAgICAgICA8U3R5bGVkTWVkaWEgc3JjPXtzcmN9IHRpdGxlPXt0aXRsZX0gYWx0PXt0aXRsZX0gZml0PXtmaXR9IC8+XG4gICAgICApIDogKFxuICAgICAgICA8U3R5bGVkQ29udGFpbmVyIHRpdGxlPVwiRXJyb3Igbm90IGZvdW5kXCI+XG4gICAgICAgICAgPEljb24gbmFtZT1cImltYWdlLWJyb2tlblwiIGNvbG9yPVwidGVydGlhcnlcIiAvPlxuICAgICAgICA8L1N0eWxlZENvbnRhaW5lcj5cbiAgICAgICl9XG4gICAgPC9TdHlsZWRNZWRpYUNvbnRhaW5lcj5cbiAgKTtcbn1cblxuTWVkaWFJdGVtLmRlZmF1bHRQcm9wcyA9IHtcbiAgbWVkaWFDb3ZlcjogdHJ1ZSxcbiAgc3F1YXJlQnlXaWR0aDogZmFsc2UsXG4gIGZpdDogXCJjb3ZlclwiLFxufTtcbiJdfQ== */");
 const StyledMedia = /*#__PURE__*/_styled("img", process.env.NODE_ENV === "production" ? {
   target: "e18zu6wq1"
 } : {
@@ -48,10 +48,10 @@ const StyledMedia = /*#__PURE__*/_styled("img", process.env.NODE_ENV === "produc
     backgroundRepeat: "no-repeat",
     cursor: "pointer",
     ":global(.isDarkmodeActive) &": {
-      backgroundColor: theme.values.color.background.layer_1
+      backgroundColor: theme.values.color.background.primary.default
     }
   };
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk1lZGlhSXRlbS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBOEJvQiIsImZpbGUiOiJNZWRpYUl0ZW0udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb24gfSBmcm9tIFwiLi4vSWNvbi9JY29uXCI7XG5cbmV4cG9ydCB0eXBlIE1lZGlhSXRlbVByb3BzID0ge1xuICBzcmM6IHN0cmluZztcbiAgdGl0bGU6IHN0cmluZztcbiAgLyoqIFNldHMgdGhlIGhlaWdodCBvZiB0aGUgbWVkaWEgdG8gZXF1YWwgdGhlIHdpZHRoIHZhbHVlIG1ha2luZyBhIHNxdWFyZSA8YnIvPlxuICAgKi9cbiAgc3F1YXJlQnlXaWR0aD86IGJvb2xlYW47XG4gIC8qKiBTcGVjaWZ5IGZpdCBvZiB0aGUgbWVkaWEgYmFja2dyb3VuZC4gPGJyLz5cbiAgICogXCJjb250YWluXCIgLSB0aGUgbWVkaWEga2VlcHMgaXRzIGFzcGVjdCByYXRpbywgYnV0IGlzIHJlc2l6ZWQgdG8gZml0IHdpdGhpbiB0aGUgZ2l2ZW4gZGltZW5zaW9uLiA8YnIvPlxuICAgKiBcImNvdmVyXCIgLSB0aGUgbWVkaWEga2VlcHMgaXRzIGFzcGVjdCByYXRpbyBhbmQgZmlsbHMgdGhlIGdpdmVuIGRpbWVuc2lvbi4gVGhlIG1lZGlhIHdpbGwgYmUgY2xpcHBlZCB0byBmaXQuXG4gICAqL1xuICBmaXQ6IFwiY292ZXJcIiB8IFwiY29udGFpblwiO1xufTtcblxuY29uc3QgU3R5bGVkTWVkaWFDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PihcbiAgKHsgc3F1YXJlQnlXaWR0aCB9KSA9PiAoe1xuICAgIHBvc2l0aW9uOiBcInJlbGF0aXZlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBcIiB0cmFuc3BhcmVudFwiLFxuICAgIG92ZXJmbG93OiBcImhpZGRlblwiLFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJvcmRlclJhZGl1czogXCJpbmhlcml0XCIsXG4gICAgLi4uKHNxdWFyZUJ5V2lkdGggJiYgeyBwYWRkaW5nVG9wOiBcIjEwMCVcIiB9KSxcbiAgICAuLi4oIXNxdWFyZUJ5V2lkdGggJiYgeyBoZWlnaHQ6IFwiMTAwJVwiIH0pLFxuICB9KVxuKTtcblxuY29uc3QgU3R5bGVkTWVkaWEgPSBzdHlsZWQuaW1nPFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PigoeyB0aGVtZSwgZml0IH0pID0+ICh7XG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIHRvcDogMCxcbiAgbGVmdDogMCxcbiAgZGlzcGxheTogXCJibG9ja1wiLFxuICB3aWR0aDogXCIxMDAlXCIsXG4gIGhlaWdodDogXCIxMDAlXCIsXG4gIGJhY2tncm91bmRQb3NpdGlvbjogXCJjZW50ZXJcIixcbiAgb2JqZWN0Rml0OiBmaXQsXG4gIGJhY2tncm91bmRSZXBlYXQ6IFwibm8tcmVwZWF0XCIsXG4gIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gIFwiOmdsb2JhbCguaXNEYXJrbW9kZUFjdGl2ZSkgJlwiOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5sYXllcl8xLFxuICB9LFxufSkpO1xuXG5jb25zdCBTdHlsZWRDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PihcbiAgKHsgdGhlbWUsIHNxdWFyZUJ5V2lkdGggfSkgPT4gKHtcbiAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgIHRvcDogMCxcbiAgICBsZWZ0OiAwLFxuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAganVzdGlmeUNvbnRlbnQ6IFwiY2VudGVyXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuYnV0dG9uLnNlY29uZGFyeS5ob3ZlcixcbiAgICAuLi4oc3F1YXJlQnlXaWR0aCAmJiB7IHBhZGRpbmdUb3A6IFwiMTAwJVwiIH0pLFxuICAgIC4uLighc3F1YXJlQnlXaWR0aCAmJiB7IGhlaWdodDogXCIxMDAlXCIgfSksXG4gIH0pXG4pO1xuXG5leHBvcnQgZnVuY3Rpb24gTWVkaWFJdGVtKHtcbiAgc3JjLFxuICB0aXRsZSxcbiAgc3F1YXJlQnlXaWR0aCxcbiAgZml0LFxufTogTWVkaWFJdGVtUHJvcHMpOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBjb25zdCBbc3JjRXJyb3IsIHNldFNyY0Vycm9yXSA9IHVzZVN0YXRlKGZhbHNlKTtcblxuICBjb25zdCBpbWFnZSA9IG5ldyBJbWFnZSgpO1xuICBpbWFnZS5zcmMgPSBzcmM7XG4gIGltYWdlLm9uZXJyb3IgPSAoKSA9PiB7XG4gICAgaWYgKCFzcmNFcnJvcikge1xuICAgICAgc2V0U3JjRXJyb3IodHJ1ZSk7XG4gICAgfVxuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPFN0eWxlZE1lZGlhQ29udGFpbmVyIHNxdWFyZUJ5V2lkdGg9e3NxdWFyZUJ5V2lkdGh9IGRhdGEtZHMtaWQ9XCJNZWRpYUl0ZW1cIj5cbiAgICAgIHshc3JjRXJyb3IgPyAoXG4gICAgICAgIDxTdHlsZWRNZWRpYSBzcmM9e3NyY30gdGl0bGU9e3RpdGxlfSBhbHQ9e3RpdGxlfSBmaXQ9e2ZpdH0gLz5cbiAgICAgICkgOiAoXG4gICAgICAgIDxTdHlsZWRDb250YWluZXIgdGl0bGU9XCJFcnJvciBub3QgZm91bmRcIj5cbiAgICAgICAgICA8SWNvbiBuYW1lPVwiaW1hZ2UtYnJva2VuXCIgdmFyaWFudD1cInRlcnRpYXJ5XCIgLz5cbiAgICAgICAgPC9TdHlsZWRDb250YWluZXI+XG4gICAgICApfVxuICAgIDwvU3R5bGVkTWVkaWFDb250YWluZXI+XG4gICk7XG59XG5cbk1lZGlhSXRlbS5kZWZhdWx0UHJvcHMgPSB7XG4gIG1lZGlhQ292ZXI6IHRydWUsXG4gIHNxdWFyZUJ5V2lkdGg6IGZhbHNlLFxuICBmaXQ6IFwiY292ZXJcIixcbn07XG4iXX0= */");
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk1lZGlhSXRlbS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBOEJvQiIsImZpbGUiOiJNZWRpYUl0ZW0udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb24gfSBmcm9tIFwiLi4vSWNvbi9JY29uXCI7XG5cbmV4cG9ydCB0eXBlIE1lZGlhSXRlbVByb3BzID0ge1xuICBzcmM6IHN0cmluZztcbiAgdGl0bGU6IHN0cmluZztcbiAgLyoqIFNldHMgdGhlIGhlaWdodCBvZiB0aGUgbWVkaWEgdG8gZXF1YWwgdGhlIHdpZHRoIHZhbHVlIG1ha2luZyBhIHNxdWFyZSA8YnIvPlxuICAgKi9cbiAgc3F1YXJlQnlXaWR0aD86IGJvb2xlYW47XG4gIC8qKiBTcGVjaWZ5IGZpdCBvZiB0aGUgbWVkaWEgYmFja2dyb3VuZC4gPGJyLz5cbiAgICogXCJjb250YWluXCIgLSB0aGUgbWVkaWEga2VlcHMgaXRzIGFzcGVjdCByYXRpbywgYnV0IGlzIHJlc2l6ZWQgdG8gZml0IHdpdGhpbiB0aGUgZ2l2ZW4gZGltZW5zaW9uLiA8YnIvPlxuICAgKiBcImNvdmVyXCIgLSB0aGUgbWVkaWEga2VlcHMgaXRzIGFzcGVjdCByYXRpbyBhbmQgZmlsbHMgdGhlIGdpdmVuIGRpbWVuc2lvbi4gVGhlIG1lZGlhIHdpbGwgYmUgY2xpcHBlZCB0byBmaXQuXG4gICAqL1xuICBmaXQ6IFwiY292ZXJcIiB8IFwiY29udGFpblwiO1xufTtcblxuY29uc3QgU3R5bGVkTWVkaWFDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PihcbiAgKHsgc3F1YXJlQnlXaWR0aCB9KSA9PiAoe1xuICAgIHBvc2l0aW9uOiBcInJlbGF0aXZlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBcIiB0cmFuc3BhcmVudFwiLFxuICAgIG92ZXJmbG93OiBcImhpZGRlblwiLFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJvcmRlclJhZGl1czogXCJpbmhlcml0XCIsXG4gICAgLi4uKHNxdWFyZUJ5V2lkdGggJiYgeyBwYWRkaW5nVG9wOiBcIjEwMCVcIiB9KSxcbiAgICAuLi4oIXNxdWFyZUJ5V2lkdGggJiYgeyBoZWlnaHQ6IFwiMTAwJVwiIH0pLFxuICB9KVxuKTtcblxuY29uc3QgU3R5bGVkTWVkaWEgPSBzdHlsZWQuaW1nPFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PigoeyB0aGVtZSwgZml0IH0pID0+ICh7XG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIHRvcDogMCxcbiAgbGVmdDogMCxcbiAgZGlzcGxheTogXCJibG9ja1wiLFxuICB3aWR0aDogXCIxMDAlXCIsXG4gIGhlaWdodDogXCIxMDAlXCIsXG4gIGJhY2tncm91bmRQb3NpdGlvbjogXCJjZW50ZXJcIixcbiAgb2JqZWN0Rml0OiBmaXQsXG4gIGJhY2tncm91bmRSZXBlYXQ6IFwibm8tcmVwZWF0XCIsXG4gIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gIFwiOmdsb2JhbCguaXNEYXJrbW9kZUFjdGl2ZSkgJlwiOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gIH0sXG59KSk7XG5cbmNvbnN0IFN0eWxlZENvbnRhaW5lciA9IHN0eWxlZC5kaXY8UGFydGlhbDxNZWRpYUl0ZW1Qcm9wcz4+KFxuICAoeyB0aGVtZSwgc3F1YXJlQnlXaWR0aCB9KSA9PiAoe1xuICAgIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gICAgdG9wOiAwLFxuICAgIGxlZnQ6IDAsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIixcbiAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC50cmFuc3BhcmVudC5hY3RpdmUsXG4gICAgLi4uKHNxdWFyZUJ5V2lkdGggJiYgeyBwYWRkaW5nVG9wOiBcIjEwMCVcIiB9KSxcbiAgICAuLi4oIXNxdWFyZUJ5V2lkdGggJiYgeyBoZWlnaHQ6IFwiMTAwJVwiIH0pLFxuICB9KVxuKTtcblxuZXhwb3J0IGZ1bmN0aW9uIE1lZGlhSXRlbSh7XG4gIHNyYyxcbiAgdGl0bGUsXG4gIHNxdWFyZUJ5V2lkdGgsXG4gIGZpdCxcbn06IE1lZGlhSXRlbVByb3BzKTogUmVhY3QuUmVhY3RFbGVtZW50IHtcbiAgY29uc3QgW3NyY0Vycm9yLCBzZXRTcmNFcnJvcl0gPSB1c2VTdGF0ZShmYWxzZSk7XG5cbiAgY29uc3QgaW1hZ2UgPSBuZXcgSW1hZ2UoKTtcbiAgaW1hZ2Uuc3JjID0gc3JjO1xuICBpbWFnZS5vbmVycm9yID0gKCkgPT4ge1xuICAgIGlmICghc3JjRXJyb3IpIHtcbiAgICAgIHNldFNyY0Vycm9yKHRydWUpO1xuICAgIH1cbiAgfTtcblxuICByZXR1cm4gKFxuICAgIDxTdHlsZWRNZWRpYUNvbnRhaW5lciBzcXVhcmVCeVdpZHRoPXtzcXVhcmVCeVdpZHRofSBkYXRhLWRzLWlkPVwiTWVkaWFJdGVtXCI+XG4gICAgICB7IXNyY0Vycm9yID8gKFxuICAgICAgICA8U3R5bGVkTWVkaWEgc3JjPXtzcmN9IHRpdGxlPXt0aXRsZX0gYWx0PXt0aXRsZX0gZml0PXtmaXR9IC8+XG4gICAgICApIDogKFxuICAgICAgICA8U3R5bGVkQ29udGFpbmVyIHRpdGxlPVwiRXJyb3Igbm90IGZvdW5kXCI+XG4gICAgICAgICAgPEljb24gbmFtZT1cImltYWdlLWJyb2tlblwiIGNvbG9yPVwidGVydGlhcnlcIiAvPlxuICAgICAgICA8L1N0eWxlZENvbnRhaW5lcj5cbiAgICAgICl9XG4gICAgPC9TdHlsZWRNZWRpYUNvbnRhaW5lcj5cbiAgKTtcbn1cblxuTWVkaWFJdGVtLmRlZmF1bHRQcm9wcyA9IHtcbiAgbWVkaWFDb3ZlcjogdHJ1ZSxcbiAgc3F1YXJlQnlXaWR0aDogZmFsc2UsXG4gIGZpdDogXCJjb3ZlclwiLFxufTtcbiJdfQ== */");
 const StyledContainer = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
   target: "e18zu6wq0"
 } : {
@@ -70,7 +70,7 @@ const StyledContainer = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "pr
     alignItems: "center",
     justifyContent: "center",
     width: "100%",
-    backgroundColor: theme.values.color.background.button.secondary.hover,
+    backgroundColor: theme.values.color.background.transparent.active,
     ...(squareByWidth && {
       paddingTop: "100%"
     }),
@@ -78,7 +78,7 @@ const StyledContainer = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "pr
       height: "100%"
     })
   };
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk1lZGlhSXRlbS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBOEN3QiIsImZpbGUiOiJNZWRpYUl0ZW0udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb24gfSBmcm9tIFwiLi4vSWNvbi9JY29uXCI7XG5cbmV4cG9ydCB0eXBlIE1lZGlhSXRlbVByb3BzID0ge1xuICBzcmM6IHN0cmluZztcbiAgdGl0bGU6IHN0cmluZztcbiAgLyoqIFNldHMgdGhlIGhlaWdodCBvZiB0aGUgbWVkaWEgdG8gZXF1YWwgdGhlIHdpZHRoIHZhbHVlIG1ha2luZyBhIHNxdWFyZSA8YnIvPlxuICAgKi9cbiAgc3F1YXJlQnlXaWR0aD86IGJvb2xlYW47XG4gIC8qKiBTcGVjaWZ5IGZpdCBvZiB0aGUgbWVkaWEgYmFja2dyb3VuZC4gPGJyLz5cbiAgICogXCJjb250YWluXCIgLSB0aGUgbWVkaWEga2VlcHMgaXRzIGFzcGVjdCByYXRpbywgYnV0IGlzIHJlc2l6ZWQgdG8gZml0IHdpdGhpbiB0aGUgZ2l2ZW4gZGltZW5zaW9uLiA8YnIvPlxuICAgKiBcImNvdmVyXCIgLSB0aGUgbWVkaWEga2VlcHMgaXRzIGFzcGVjdCByYXRpbyBhbmQgZmlsbHMgdGhlIGdpdmVuIGRpbWVuc2lvbi4gVGhlIG1lZGlhIHdpbGwgYmUgY2xpcHBlZCB0byBmaXQuXG4gICAqL1xuICBmaXQ6IFwiY292ZXJcIiB8IFwiY29udGFpblwiO1xufTtcblxuY29uc3QgU3R5bGVkTWVkaWFDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PihcbiAgKHsgc3F1YXJlQnlXaWR0aCB9KSA9PiAoe1xuICAgIHBvc2l0aW9uOiBcInJlbGF0aXZlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBcIiB0cmFuc3BhcmVudFwiLFxuICAgIG92ZXJmbG93OiBcImhpZGRlblwiLFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJvcmRlclJhZGl1czogXCJpbmhlcml0XCIsXG4gICAgLi4uKHNxdWFyZUJ5V2lkdGggJiYgeyBwYWRkaW5nVG9wOiBcIjEwMCVcIiB9KSxcbiAgICAuLi4oIXNxdWFyZUJ5V2lkdGggJiYgeyBoZWlnaHQ6IFwiMTAwJVwiIH0pLFxuICB9KVxuKTtcblxuY29uc3QgU3R5bGVkTWVkaWEgPSBzdHlsZWQuaW1nPFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PigoeyB0aGVtZSwgZml0IH0pID0+ICh7XG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIHRvcDogMCxcbiAgbGVmdDogMCxcbiAgZGlzcGxheTogXCJibG9ja1wiLFxuICB3aWR0aDogXCIxMDAlXCIsXG4gIGhlaWdodDogXCIxMDAlXCIsXG4gIGJhY2tncm91bmRQb3NpdGlvbjogXCJjZW50ZXJcIixcbiAgb2JqZWN0Rml0OiBmaXQsXG4gIGJhY2tncm91bmRSZXBlYXQ6IFwibm8tcmVwZWF0XCIsXG4gIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gIFwiOmdsb2JhbCguaXNEYXJrbW9kZUFjdGl2ZSkgJlwiOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5sYXllcl8xLFxuICB9LFxufSkpO1xuXG5jb25zdCBTdHlsZWRDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PihcbiAgKHsgdGhlbWUsIHNxdWFyZUJ5V2lkdGggfSkgPT4gKHtcbiAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgIHRvcDogMCxcbiAgICBsZWZ0OiAwLFxuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAganVzdGlmeUNvbnRlbnQ6IFwiY2VudGVyXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuYnV0dG9uLnNlY29uZGFyeS5ob3ZlcixcbiAgICAuLi4oc3F1YXJlQnlXaWR0aCAmJiB7IHBhZGRpbmdUb3A6IFwiMTAwJVwiIH0pLFxuICAgIC4uLighc3F1YXJlQnlXaWR0aCAmJiB7IGhlaWdodDogXCIxMDAlXCIgfSksXG4gIH0pXG4pO1xuXG5leHBvcnQgZnVuY3Rpb24gTWVkaWFJdGVtKHtcbiAgc3JjLFxuICB0aXRsZSxcbiAgc3F1YXJlQnlXaWR0aCxcbiAgZml0LFxufTogTWVkaWFJdGVtUHJvcHMpOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBjb25zdCBbc3JjRXJyb3IsIHNldFNyY0Vycm9yXSA9IHVzZVN0YXRlKGZhbHNlKTtcblxuICBjb25zdCBpbWFnZSA9IG5ldyBJbWFnZSgpO1xuICBpbWFnZS5zcmMgPSBzcmM7XG4gIGltYWdlLm9uZXJyb3IgPSAoKSA9PiB7XG4gICAgaWYgKCFzcmNFcnJvcikge1xuICAgICAgc2V0U3JjRXJyb3IodHJ1ZSk7XG4gICAgfVxuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPFN0eWxlZE1lZGlhQ29udGFpbmVyIHNxdWFyZUJ5V2lkdGg9e3NxdWFyZUJ5V2lkdGh9IGRhdGEtZHMtaWQ9XCJNZWRpYUl0ZW1cIj5cbiAgICAgIHshc3JjRXJyb3IgPyAoXG4gICAgICAgIDxTdHlsZWRNZWRpYSBzcmM9e3NyY30gdGl0bGU9e3RpdGxlfSBhbHQ9e3RpdGxlfSBmaXQ9e2ZpdH0gLz5cbiAgICAgICkgOiAoXG4gICAgICAgIDxTdHlsZWRDb250YWluZXIgdGl0bGU9XCJFcnJvciBub3QgZm91bmRcIj5cbiAgICAgICAgICA8SWNvbiBuYW1lPVwiaW1hZ2UtYnJva2VuXCIgdmFyaWFudD1cInRlcnRpYXJ5XCIgLz5cbiAgICAgICAgPC9TdHlsZWRDb250YWluZXI+XG4gICAgICApfVxuICAgIDwvU3R5bGVkTWVkaWFDb250YWluZXI+XG4gICk7XG59XG5cbk1lZGlhSXRlbS5kZWZhdWx0UHJvcHMgPSB7XG4gIG1lZGlhQ292ZXI6IHRydWUsXG4gIHNxdWFyZUJ5V2lkdGg6IGZhbHNlLFxuICBmaXQ6IFwiY292ZXJcIixcbn07XG4iXX0= */");
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk1lZGlhSXRlbS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBOEN3QiIsImZpbGUiOiJNZWRpYUl0ZW0udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb24gfSBmcm9tIFwiLi4vSWNvbi9JY29uXCI7XG5cbmV4cG9ydCB0eXBlIE1lZGlhSXRlbVByb3BzID0ge1xuICBzcmM6IHN0cmluZztcbiAgdGl0bGU6IHN0cmluZztcbiAgLyoqIFNldHMgdGhlIGhlaWdodCBvZiB0aGUgbWVkaWEgdG8gZXF1YWwgdGhlIHdpZHRoIHZhbHVlIG1ha2luZyBhIHNxdWFyZSA8YnIvPlxuICAgKi9cbiAgc3F1YXJlQnlXaWR0aD86IGJvb2xlYW47XG4gIC8qKiBTcGVjaWZ5IGZpdCBvZiB0aGUgbWVkaWEgYmFja2dyb3VuZC4gPGJyLz5cbiAgICogXCJjb250YWluXCIgLSB0aGUgbWVkaWEga2VlcHMgaXRzIGFzcGVjdCByYXRpbywgYnV0IGlzIHJlc2l6ZWQgdG8gZml0IHdpdGhpbiB0aGUgZ2l2ZW4gZGltZW5zaW9uLiA8YnIvPlxuICAgKiBcImNvdmVyXCIgLSB0aGUgbWVkaWEga2VlcHMgaXRzIGFzcGVjdCByYXRpbyBhbmQgZmlsbHMgdGhlIGdpdmVuIGRpbWVuc2lvbi4gVGhlIG1lZGlhIHdpbGwgYmUgY2xpcHBlZCB0byBmaXQuXG4gICAqL1xuICBmaXQ6IFwiY292ZXJcIiB8IFwiY29udGFpblwiO1xufTtcblxuY29uc3QgU3R5bGVkTWVkaWFDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PihcbiAgKHsgc3F1YXJlQnlXaWR0aCB9KSA9PiAoe1xuICAgIHBvc2l0aW9uOiBcInJlbGF0aXZlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBcIiB0cmFuc3BhcmVudFwiLFxuICAgIG92ZXJmbG93OiBcImhpZGRlblwiLFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJvcmRlclJhZGl1czogXCJpbmhlcml0XCIsXG4gICAgLi4uKHNxdWFyZUJ5V2lkdGggJiYgeyBwYWRkaW5nVG9wOiBcIjEwMCVcIiB9KSxcbiAgICAuLi4oIXNxdWFyZUJ5V2lkdGggJiYgeyBoZWlnaHQ6IFwiMTAwJVwiIH0pLFxuICB9KVxuKTtcblxuY29uc3QgU3R5bGVkTWVkaWEgPSBzdHlsZWQuaW1nPFBhcnRpYWw8TWVkaWFJdGVtUHJvcHM+PigoeyB0aGVtZSwgZml0IH0pID0+ICh7XG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIHRvcDogMCxcbiAgbGVmdDogMCxcbiAgZGlzcGxheTogXCJibG9ja1wiLFxuICB3aWR0aDogXCIxMDAlXCIsXG4gIGhlaWdodDogXCIxMDAlXCIsXG4gIGJhY2tncm91bmRQb3NpdGlvbjogXCJjZW50ZXJcIixcbiAgb2JqZWN0Rml0OiBmaXQsXG4gIGJhY2tncm91bmRSZXBlYXQ6IFwibm8tcmVwZWF0XCIsXG4gIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gIFwiOmdsb2JhbCguaXNEYXJrbW9kZUFjdGl2ZSkgJlwiOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gIH0sXG59KSk7XG5cbmNvbnN0IFN0eWxlZENvbnRhaW5lciA9IHN0eWxlZC5kaXY8UGFydGlhbDxNZWRpYUl0ZW1Qcm9wcz4+KFxuICAoeyB0aGVtZSwgc3F1YXJlQnlXaWR0aCB9KSA9PiAoe1xuICAgIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gICAgdG9wOiAwLFxuICAgIGxlZnQ6IDAsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIixcbiAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC50cmFuc3BhcmVudC5hY3RpdmUsXG4gICAgLi4uKHNxdWFyZUJ5V2lkdGggJiYgeyBwYWRkaW5nVG9wOiBcIjEwMCVcIiB9KSxcbiAgICAuLi4oIXNxdWFyZUJ5V2lkdGggJiYgeyBoZWlnaHQ6IFwiMTAwJVwiIH0pLFxuICB9KVxuKTtcblxuZXhwb3J0IGZ1bmN0aW9uIE1lZGlhSXRlbSh7XG4gIHNyYyxcbiAgdGl0bGUsXG4gIHNxdWFyZUJ5V2lkdGgsXG4gIGZpdCxcbn06IE1lZGlhSXRlbVByb3BzKTogUmVhY3QuUmVhY3RFbGVtZW50IHtcbiAgY29uc3QgW3NyY0Vycm9yLCBzZXRTcmNFcnJvcl0gPSB1c2VTdGF0ZShmYWxzZSk7XG5cbiAgY29uc3QgaW1hZ2UgPSBuZXcgSW1hZ2UoKTtcbiAgaW1hZ2Uuc3JjID0gc3JjO1xuICBpbWFnZS5vbmVycm9yID0gKCkgPT4ge1xuICAgIGlmICghc3JjRXJyb3IpIHtcbiAgICAgIHNldFNyY0Vycm9yKHRydWUpO1xuICAgIH1cbiAgfTtcblxuICByZXR1cm4gKFxuICAgIDxTdHlsZWRNZWRpYUNvbnRhaW5lciBzcXVhcmVCeVdpZHRoPXtzcXVhcmVCeVdpZHRofSBkYXRhLWRzLWlkPVwiTWVkaWFJdGVtXCI+XG4gICAgICB7IXNyY0Vycm9yID8gKFxuICAgICAgICA8U3R5bGVkTWVkaWEgc3JjPXtzcmN9IHRpdGxlPXt0aXRsZX0gYWx0PXt0aXRsZX0gZml0PXtmaXR9IC8+XG4gICAgICApIDogKFxuICAgICAgICA8U3R5bGVkQ29udGFpbmVyIHRpdGxlPVwiRXJyb3Igbm90IGZvdW5kXCI+XG4gICAgICAgICAgPEljb24gbmFtZT1cImltYWdlLWJyb2tlblwiIGNvbG9yPVwidGVydGlhcnlcIiAvPlxuICAgICAgICA8L1N0eWxlZENvbnRhaW5lcj5cbiAgICAgICl9XG4gICAgPC9TdHlsZWRNZWRpYUNvbnRhaW5lcj5cbiAgKTtcbn1cblxuTWVkaWFJdGVtLmRlZmF1bHRQcm9wcyA9IHtcbiAgbWVkaWFDb3ZlcjogdHJ1ZSxcbiAgc3F1YXJlQnlXaWR0aDogZmFsc2UsXG4gIGZpdDogXCJjb3ZlclwiLFxufTtcbiJdfQ== */");
 function MediaItem(_ref4) {
   let {
     src,
@@ -106,7 +106,7 @@ function MediaItem(_ref4) {
     title: "Error not found"
   }, /*#__PURE__*/React.createElement(Icon, {
     name: "image-broken",
-    variant: "tertiary"
+    color: "tertiary"
   })));
 }
 MediaItem.defaultProps = {

package/build/esm/src/components/MediaItem/MediaItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"MediaItem.js","sources":["../../../../../src/components/MediaItem/MediaItem.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Icon } from \"../Icon/Icon\";\n\nexport type MediaItemProps = {\n  src: string;\n  title: string;\n  /** Sets the height of the media to equal the width value making a square <br/>\n   */\n  squareByWidth?: boolean;\n  /** Specify fit of the media background. <br/>\n   * \"contain\" - the media keeps its aspect ratio, but is resized to fit within the given dimension. <br/>\n   * \"cover\" - the media keeps its aspect ratio and fills the given dimension. The media will be clipped to fit.\n   */\n  fit: \"cover\" | \"contain\";\n};\n\nconst StyledMediaContainer = styled.div<Partial<MediaItemProps>>(\n  ({ squareByWidth }) => ({\n    position: \"relative\",\n    backgroundColor: \" transparent\",\n    overflow: \"hidden\",\n    border: \"none\",\n    width: \"100%\",\n    borderRadius: \"inherit\",\n    ...(squareByWidth && { paddingTop: \"100%\" }),\n    ...(!squareByWidth && { height: \"100%\" }),\n  })\n);\n\nconst StyledMedia = styled.img<Partial<MediaItemProps>>(({ theme, fit }) => ({\n  position: \"absolute\",\n  top: 0,\n  left: 0,\n  display: \"block\",\n  width: \"100%\",\n  height: \"100%\",\n  backgroundPosition: \"center\",\n  objectFit: fit,\n  backgroundRepeat: \"no-repeat\",\n  cursor: \"pointer\",\n  \":global(.isDarkmodeActive) &\": {\n    backgroundColor: theme.values.color.background.layer_1,\n  },\n}));\n\nconst StyledContainer = styled.div<Partial<MediaItemProps>>(\n  ({ theme, squareByWidth }) => ({\n    position: \"absolute\",\n    top: 0,\n    left: 0,\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    width: \"100%\",\n    backgroundColor: theme.values.color.background.button.secondary.hover,\n    ...(squareByWidth && { paddingTop: \"100%\" }),\n    ...(!squareByWidth && { height: \"100%\" }),\n  })\n);\n\nexport function MediaItem({\n  src,\n  title,\n  squareByWidth,\n  fit,\n}: MediaItemProps): React.ReactElement {\n  const [srcError, setSrcError] = useState(false);\n\n  const image = new Image();\n  image.src = src;\n  image.onerror = () => {\n    if (!srcError) {\n      setSrcError(true);\n    }\n  };\n\n  return (\n    <StyledMediaContainer squareByWidth={squareByWidth} data-ds-id=\"MediaItem\">\n      {!srcError ? (\n        <StyledMedia src={src} title={title} alt={title} fit={fit} />\n      ) : (\n        <StyledContainer title=\"Error not found\">\n          <Icon name=\"image-broken\" variant=\"tertiary\" />\n        </StyledContainer>\n      )}\n    </StyledMediaContainer>\n  );\n}\n\nMediaItem.defaultProps = {\n  mediaCover: true,\n  squareByWidth: false,\n  fit: \"cover\",\n};\n"],"names":["StyledMediaContainer","_styled","process","env","NODE_ENV","target","label","_ref","squareByWidth","position","backgroundColor","overflow","border","width","borderRadius","paddingTop","height","StyledMedia","_ref2","theme","fit","top","left","display","backgroundPosition","objectFit","backgroundRepeat","cursor","values","color","background","layer_1","StyledContainer","_ref3","alignItems","justifyContent","button","secondary","hover","MediaItem","_ref4","src","title","srcError","setSrcError","useState","image","Image","onerror","React","createElement","alt","Icon","name","variant","defaultProps","mediaCover"],"mappings":"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"}
+{"version":3,"file":"MediaItem.js","sources":["../../../../../src/components/MediaItem/MediaItem.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Icon } from \"../Icon/Icon\";\n\nexport type MediaItemProps = {\n  src: string;\n  title: string;\n  /** Sets the height of the media to equal the width value making a square <br/>\n   */\n  squareByWidth?: boolean;\n  /** Specify fit of the media background. <br/>\n   * \"contain\" - the media keeps its aspect ratio, but is resized to fit within the given dimension. <br/>\n   * \"cover\" - the media keeps its aspect ratio and fills the given dimension. The media will be clipped to fit.\n   */\n  fit: \"cover\" | \"contain\";\n};\n\nconst StyledMediaContainer = styled.div<Partial<MediaItemProps>>(\n  ({ squareByWidth }) => ({\n    position: \"relative\",\n    backgroundColor: \" transparent\",\n    overflow: \"hidden\",\n    border: \"none\",\n    width: \"100%\",\n    borderRadius: \"inherit\",\n    ...(squareByWidth && { paddingTop: \"100%\" }),\n    ...(!squareByWidth && { height: \"100%\" }),\n  })\n);\n\nconst StyledMedia = styled.img<Partial<MediaItemProps>>(({ theme, fit }) => ({\n  position: \"absolute\",\n  top: 0,\n  left: 0,\n  display: \"block\",\n  width: \"100%\",\n  height: \"100%\",\n  backgroundPosition: \"center\",\n  objectFit: fit,\n  backgroundRepeat: \"no-repeat\",\n  cursor: \"pointer\",\n  \":global(.isDarkmodeActive) &\": {\n    backgroundColor: theme.values.color.background.primary.default,\n  },\n}));\n\nconst StyledContainer = styled.div<Partial<MediaItemProps>>(\n  ({ theme, squareByWidth }) => ({\n    position: \"absolute\",\n    top: 0,\n    left: 0,\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    width: \"100%\",\n    backgroundColor: theme.values.color.background.transparent.active,\n    ...(squareByWidth && { paddingTop: \"100%\" }),\n    ...(!squareByWidth && { height: \"100%\" }),\n  })\n);\n\nexport function MediaItem({\n  src,\n  title,\n  squareByWidth,\n  fit,\n}: MediaItemProps): React.ReactElement {\n  const [srcError, setSrcError] = useState(false);\n\n  const image = new Image();\n  image.src = src;\n  image.onerror = () => {\n    if (!srcError) {\n      setSrcError(true);\n    }\n  };\n\n  return (\n    <StyledMediaContainer squareByWidth={squareByWidth} data-ds-id=\"MediaItem\">\n      {!srcError ? (\n        <StyledMedia src={src} title={title} alt={title} fit={fit} />\n      ) : (\n        <StyledContainer title=\"Error not found\">\n          <Icon name=\"image-broken\" color=\"tertiary\" />\n        </StyledContainer>\n      )}\n    </StyledMediaContainer>\n  );\n}\n\nMediaItem.defaultProps = {\n  mediaCover: true,\n  squareByWidth: false,\n  fit: \"cover\",\n};\n"],"names":["StyledMediaContainer","_styled","process","env","NODE_ENV","target","label","_ref","squareByWidth","position","backgroundColor","overflow","border","width","borderRadius","paddingTop","height","StyledMedia","_ref2","theme","fit","top","left","display","backgroundPosition","objectFit","backgroundRepeat","cursor","values","color","background","primary","default","StyledContainer","_ref3","alignItems","justifyContent","transparent","active","MediaItem","_ref4","src","title","srcError","setSrcError","useState","image","Image","onerror","React","createElement","alt","Icon","name","defaultProps","mediaCover"],"mappings":"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"}

package/build/esm/src/components/MediaViewerBar/MediaViewerBar.js

@@ -17,8 +17,8 @@ const StyledMediaViewerBar = /*#__PURE__*/_styled("div", process.env.NODE_ENV ==
     display: "inline-flex",
     borderRadius: theme.variables.size.spacing.xxs,
     height: theme.variables.size.spacing.l,
-    backgroundColor: theme.values.color.background.layer_1,
-    color: theme.values.color.text.lightPrimary,
+    backgroundColor: theme.values.color.background.primary.default,
+    color: theme.values.color.text.secondary.default,
     overflow: "hidden",
     "> div": {
       width: "100%",
@@ -27,7 +27,7 @@ const StyledMediaViewerBar = /*#__PURE__*/_styled("div", process.env.NODE_ENV ==
       }
     }
   };
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk1lZGlhVmlld2VyQmFyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNNkIiLCJmaWxlIjoiTWVkaWFWaWV3ZXJCYXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IFJlYWN0RWxlbWVudCB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBJbmxpbmUgfSBmcm9tIFwiLi4vSW5saW5lL0lubGluZVwiO1xuaW1wb3J0IHsgZmxhdHRlbkNoaWxkcmVuIH0gZnJvbSBcIi4uLy4uL3NoYXJlZC9mbGF0dGVuQ2hpbGRyZW5cIjtcbmltcG9ydCB7IFN1YlRoZW1lUHJvdmlkZXIgfSBmcm9tIFwiLi4vU3ViVGhlbWVQcm92aWRlci9TdWJUaGVtZVByb3ZpZGVyXCI7XG5cbmNvbnN0IFN0eWxlZE1lZGlhVmlld2VyQmFyID0gc3R5bGVkLmRpdigoeyB0aGVtZSB9KSA9PiAoe1xuICBkaXNwbGF5OiBcImlubGluZS1mbGV4XCIsXG4gIGJvcmRlclJhZGl1czogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy54eHMsXG4gIGhlaWdodDogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy5sLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci5iYWNrZ3JvdW5kLmxheWVyXzEsXG4gIGNvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IudGV4dC5saWdodFByaW1hcnksXG4gIG92ZXJmbG93OiBcImhpZGRlblwiLFxuICBcIj4gZGl2XCI6IHtcbiAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgXCI+IGRpdlwiOiB7XG4gICAgICBsaW5lSGVpZ2h0OiBcIm5vcm1hbFwiLFxuICAgIH0sXG4gIH0sXG59KSk7XG5cbmNvbnN0IFN0eWxlZFNlcGFyYXRvciA9IHN0eWxlZC5kaXYoKHsgdGhlbWUgfSkgPT4gKHtcbiAgd2lkdGg6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmRpbWVuc2lvbi5tZWRpYVZpZXdlckJhci5zZXBhcmF0b3Iud2lkdGgsXG4gIGhlaWdodDogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy5sLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci5iYWNrZ3JvdW5kLmxheWVyXzIsXG59KSk7XG5cbmV4cG9ydCB0eXBlIE1lZGlhVmlld2VyQmFyUHJvcHMgPSB7XG4gIGNoaWxkcmVuPzogUmVhY3RFbGVtZW50IHwgUmVhY3RFbGVtZW50W107XG4gIGhhc1NlcGFyYXRvcj86IGJvb2xlYW47XG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiPzogc3RyaW5nO1xufTtcblxuZXhwb3J0IGZ1bmN0aW9uIE1lZGlhVmlld2VyQmFyKHtcbiAgY2hpbGRyZW4sXG4gIGhhc1NlcGFyYXRvcixcbiAgXCJkYXRhLWUyZS10ZXN0LWlkXCI6IGRhdGFFMmVUZXN0SWQsXG59OiBNZWRpYVZpZXdlckJhclByb3BzKTogUmVhY3RFbGVtZW50IHtcbiAgY29uc3QgZmxhdHRlbmVkQ2hpbGRyZW4gPSBmbGF0dGVuQ2hpbGRyZW4oY2hpbGRyZW4pO1xuXG4gIHJldHVybiAoXG4gICAgPFN1YlRoZW1lUHJvdmlkZXIgbmFtZT1cImRpbW1lZFwiPlxuICAgICAgPFN0eWxlZE1lZGlhVmlld2VyQmFyXG4gICAgICAgIGRhdGEtZTJlLXRlc3QtaWQ9e2RhdGFFMmVUZXN0SWR9XG4gICAgICAgIGRhdGEtZHMtaWQ9XCJNZWRpYVZpZXdlckJhclwiXG4gICAgICA+XG4gICAgICAgIDxJbmxpbmUgc3BhY2U9XCJ6ZXJvXCIgdkFsaWduSXRlbXM9XCJjZW50ZXJcIiBhbGlnbkl0ZW1zPVwiY2VudGVyXCIgbm9XcmFwPlxuICAgICAgICAgIHtSZWFjdC5DaGlsZHJlbi5tYXAoZmxhdHRlbmVkQ2hpbGRyZW4sIChjaGlsZCwgaW5kZXgpID0+IChcbiAgICAgICAgICAgIDw+XG4gICAgICAgICAgICAgIHtoYXNTZXBhcmF0b3IgJiYgaW5kZXggPiAwICYmIDxTdHlsZWRTZXBhcmF0b3IgLz59XG4gICAgICAgICAgICAgIHtjaGlsZH1cbiAgICAgICAgICAgIDwvPlxuICAgICAgICAgICkpfVxuICAgICAgICA8L0lubGluZT5cbiAgICAgIDwvU3R5bGVkTWVkaWFWaWV3ZXJCYXI+XG4gICAgPC9TdWJUaGVtZVByb3ZpZGVyPlxuICApO1xufVxuIl19 */");
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk1lZGlhVmlld2VyQmFyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNNkIiLCJmaWxlIjoiTWVkaWFWaWV3ZXJCYXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IFJlYWN0RWxlbWVudCB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBJbmxpbmUgfSBmcm9tIFwiLi4vSW5saW5lL0lubGluZVwiO1xuaW1wb3J0IHsgZmxhdHRlbkNoaWxkcmVuIH0gZnJvbSBcIi4uLy4uL3NoYXJlZC9mbGF0dGVuQ2hpbGRyZW5cIjtcbmltcG9ydCB7IFN1YlRoZW1lUHJvdmlkZXIgfSBmcm9tIFwiLi4vU3ViVGhlbWVQcm92aWRlci9TdWJUaGVtZVByb3ZpZGVyXCI7XG5cbmNvbnN0IFN0eWxlZE1lZGlhVmlld2VyQmFyID0gc3R5bGVkLmRpdigoeyB0aGVtZSB9KSA9PiAoe1xuICBkaXNwbGF5OiBcImlubGluZS1mbGV4XCIsXG4gIGJvcmRlclJhZGl1czogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy54eHMsXG4gIGhlaWdodDogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy5sLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci5iYWNrZ3JvdW5kLnByaW1hcnkuZGVmYXVsdCxcbiAgY29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci50ZXh0LnNlY29uZGFyeS5kZWZhdWx0LFxuICBvdmVyZmxvdzogXCJoaWRkZW5cIixcbiAgXCI+IGRpdlwiOiB7XG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIFwiPiBkaXZcIjoge1xuICAgICAgbGluZUhlaWdodDogXCJub3JtYWxcIixcbiAgICB9LFxuICB9LFxufSkpO1xuXG5jb25zdCBTdHlsZWRTZXBhcmF0b3IgPSBzdHlsZWQuZGl2KCh7IHRoZW1lIH0pID0+ICh7XG4gIHdpZHRoOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5kaW1lbnNpb24ubWVkaWFWaWV3ZXJCYXIuc2VwYXJhdG9yLndpZHRoLFxuICBoZWlnaHQ6IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcubCxcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG59KSk7XG5cbmV4cG9ydCB0eXBlIE1lZGlhVmlld2VyQmFyUHJvcHMgPSB7XG4gIGNoaWxkcmVuPzogUmVhY3RFbGVtZW50IHwgUmVhY3RFbGVtZW50W107XG4gIGhhc1NlcGFyYXRvcj86IGJvb2xlYW47XG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiPzogc3RyaW5nO1xufTtcblxuZXhwb3J0IGZ1bmN0aW9uIE1lZGlhVmlld2VyQmFyKHtcbiAgY2hpbGRyZW4sXG4gIGhhc1NlcGFyYXRvcixcbiAgXCJkYXRhLWUyZS10ZXN0LWlkXCI6IGRhdGFFMmVUZXN0SWQsXG59OiBNZWRpYVZpZXdlckJhclByb3BzKTogUmVhY3RFbGVtZW50IHtcbiAgY29uc3QgZmxhdHRlbmVkQ2hpbGRyZW4gPSBmbGF0dGVuQ2hpbGRyZW4oY2hpbGRyZW4pO1xuXG4gIHJldHVybiAoXG4gICAgPFN1YlRoZW1lUHJvdmlkZXIgbmFtZT1cImRpbW1lZFwiPlxuICAgICAgPFN0eWxlZE1lZGlhVmlld2VyQmFyXG4gICAgICAgIGRhdGEtZTJlLXRlc3QtaWQ9e2RhdGFFMmVUZXN0SWR9XG4gICAgICAgIGRhdGEtZHMtaWQ9XCJNZWRpYVZpZXdlckJhclwiXG4gICAgICA+XG4gICAgICAgIDxJbmxpbmUgc3BhY2U9XCJ6ZXJvXCIgdkFsaWduSXRlbXM9XCJjZW50ZXJcIiBhbGlnbkl0ZW1zPVwiY2VudGVyXCIgbm9XcmFwPlxuICAgICAgICAgIHtSZWFjdC5DaGlsZHJlbi5tYXAoZmxhdHRlbmVkQ2hpbGRyZW4sIChjaGlsZCwgaW5kZXgpID0+IChcbiAgICAgICAgICAgIDw+XG4gICAgICAgICAgICAgIHtoYXNTZXBhcmF0b3IgJiYgaW5kZXggPiAwICYmIDxTdHlsZWRTZXBhcmF0b3IgLz59XG4gICAgICAgICAgICAgIHtjaGlsZH1cbiAgICAgICAgICAgIDwvPlxuICAgICAgICAgICkpfVxuICAgICAgICA8L0lubGluZT5cbiAgICAgIDwvU3R5bGVkTWVkaWFWaWV3ZXJCYXI+XG4gICAgPC9TdWJUaGVtZVByb3ZpZGVyPlxuICApO1xufVxuIl19 */");
 const StyledSeparator = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
   target: "e1l20w890"
 } : {
@@ -40,9 +40,9 @@ const StyledSeparator = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "pr
   return {
     width: theme.variables.size.dimension.mediaViewerBar.separator.width,
     height: theme.variables.size.spacing.l,
-    backgroundColor: theme.values.color.background.layer_2
+    backgroundColor: theme.values.color.background.primary.default
   };
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk1lZGlhVmlld2VyQmFyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxQndCIiwiZmlsZSI6Ik1lZGlhVmlld2VyQmFyLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyBSZWFjdEVsZW1lbnQgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgSW5saW5lIH0gZnJvbSBcIi4uL0lubGluZS9JbmxpbmVcIjtcbmltcG9ydCB7IGZsYXR0ZW5DaGlsZHJlbiB9IGZyb20gXCIuLi8uLi9zaGFyZWQvZmxhdHRlbkNoaWxkcmVuXCI7XG5pbXBvcnQgeyBTdWJUaGVtZVByb3ZpZGVyIH0gZnJvbSBcIi4uL1N1YlRoZW1lUHJvdmlkZXIvU3ViVGhlbWVQcm92aWRlclwiO1xuXG5jb25zdCBTdHlsZWRNZWRpYVZpZXdlckJhciA9IHN0eWxlZC5kaXYoKHsgdGhlbWUgfSkgPT4gKHtcbiAgZGlzcGxheTogXCJpbmxpbmUtZmxleFwiLFxuICBib3JkZXJSYWRpdXM6IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcueHhzLFxuICBoZWlnaHQ6IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcubCxcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5sYXllcl8xLFxuICBjb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLnRleHQubGlnaHRQcmltYXJ5LFxuICBvdmVyZmxvdzogXCJoaWRkZW5cIixcbiAgXCI+IGRpdlwiOiB7XG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIFwiPiBkaXZcIjoge1xuICAgICAgbGluZUhlaWdodDogXCJub3JtYWxcIixcbiAgICB9LFxuICB9LFxufSkpO1xuXG5jb25zdCBTdHlsZWRTZXBhcmF0b3IgPSBzdHlsZWQuZGl2KCh7IHRoZW1lIH0pID0+ICh7XG4gIHdpZHRoOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5kaW1lbnNpb24ubWVkaWFWaWV3ZXJCYXIuc2VwYXJhdG9yLndpZHRoLFxuICBoZWlnaHQ6IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcubCxcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5sYXllcl8yLFxufSkpO1xuXG5leHBvcnQgdHlwZSBNZWRpYVZpZXdlckJhclByb3BzID0ge1xuICBjaGlsZHJlbj86IFJlYWN0RWxlbWVudCB8IFJlYWN0RWxlbWVudFtdO1xuICBoYXNTZXBhcmF0b3I/OiBib29sZWFuO1xuICBcImRhdGEtZTJlLXRlc3QtaWRcIj86IHN0cmluZztcbn07XG5cbmV4cG9ydCBmdW5jdGlvbiBNZWRpYVZpZXdlckJhcih7XG4gIGNoaWxkcmVuLFxuICBoYXNTZXBhcmF0b3IsXG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiOiBkYXRhRTJlVGVzdElkLFxufTogTWVkaWFWaWV3ZXJCYXJQcm9wcyk6IFJlYWN0RWxlbWVudCB7XG4gIGNvbnN0IGZsYXR0ZW5lZENoaWxkcmVuID0gZmxhdHRlbkNoaWxkcmVuKGNoaWxkcmVuKTtcblxuICByZXR1cm4gKFxuICAgIDxTdWJUaGVtZVByb3ZpZGVyIG5hbWU9XCJkaW1tZWRcIj5cbiAgICAgIDxTdHlsZWRNZWRpYVZpZXdlckJhclxuICAgICAgICBkYXRhLWUyZS10ZXN0LWlkPXtkYXRhRTJlVGVzdElkfVxuICAgICAgICBkYXRhLWRzLWlkPVwiTWVkaWFWaWV3ZXJCYXJcIlxuICAgICAgPlxuICAgICAgICA8SW5saW5lIHNwYWNlPVwiemVyb1wiIHZBbGlnbkl0ZW1zPVwiY2VudGVyXCIgYWxpZ25JdGVtcz1cImNlbnRlclwiIG5vV3JhcD5cbiAgICAgICAgICB7UmVhY3QuQ2hpbGRyZW4ubWFwKGZsYXR0ZW5lZENoaWxkcmVuLCAoY2hpbGQsIGluZGV4KSA9PiAoXG4gICAgICAgICAgICA8PlxuICAgICAgICAgICAgICB7aGFzU2VwYXJhdG9yICYmIGluZGV4ID4gMCAmJiA8U3R5bGVkU2VwYXJhdG9yIC8+fVxuICAgICAgICAgICAgICB7Y2hpbGR9XG4gICAgICAgICAgICA8Lz5cbiAgICAgICAgICApKX1cbiAgICAgICAgPC9JbmxpbmU+XG4gICAgICA8L1N0eWxlZE1lZGlhVmlld2VyQmFyPlxuICAgIDwvU3ViVGhlbWVQcm92aWRlcj5cbiAgKTtcbn1cbiJdfQ== */");
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk1lZGlhVmlld2VyQmFyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxQndCIiwiZmlsZSI6Ik1lZGlhVmlld2VyQmFyLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyBSZWFjdEVsZW1lbnQgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgSW5saW5lIH0gZnJvbSBcIi4uL0lubGluZS9JbmxpbmVcIjtcbmltcG9ydCB7IGZsYXR0ZW5DaGlsZHJlbiB9IGZyb20gXCIuLi8uLi9zaGFyZWQvZmxhdHRlbkNoaWxkcmVuXCI7XG5pbXBvcnQgeyBTdWJUaGVtZVByb3ZpZGVyIH0gZnJvbSBcIi4uL1N1YlRoZW1lUHJvdmlkZXIvU3ViVGhlbWVQcm92aWRlclwiO1xuXG5jb25zdCBTdHlsZWRNZWRpYVZpZXdlckJhciA9IHN0eWxlZC5kaXYoKHsgdGhlbWUgfSkgPT4gKHtcbiAgZGlzcGxheTogXCJpbmxpbmUtZmxleFwiLFxuICBib3JkZXJSYWRpdXM6IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcueHhzLFxuICBoZWlnaHQ6IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcubCxcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gIGNvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IudGV4dC5zZWNvbmRhcnkuZGVmYXVsdCxcbiAgb3ZlcmZsb3c6IFwiaGlkZGVuXCIsXG4gIFwiPiBkaXZcIjoge1xuICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICBcIj4gZGl2XCI6IHtcbiAgICAgIGxpbmVIZWlnaHQ6IFwibm9ybWFsXCIsXG4gICAgfSxcbiAgfSxcbn0pKTtcblxuY29uc3QgU3R5bGVkU2VwYXJhdG9yID0gc3R5bGVkLmRpdigoeyB0aGVtZSB9KSA9PiAoe1xuICB3aWR0aDogdGhlbWUudmFyaWFibGVzLnNpemUuZGltZW5zaW9uLm1lZGlhVmlld2VyQmFyLnNlcGFyYXRvci53aWR0aCxcbiAgaGVpZ2h0OiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5zcGFjaW5nLmwsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQucHJpbWFyeS5kZWZhdWx0LFxufSkpO1xuXG5leHBvcnQgdHlwZSBNZWRpYVZpZXdlckJhclByb3BzID0ge1xuICBjaGlsZHJlbj86IFJlYWN0RWxlbWVudCB8IFJlYWN0RWxlbWVudFtdO1xuICBoYXNTZXBhcmF0b3I/OiBib29sZWFuO1xuICBcImRhdGEtZTJlLXRlc3QtaWRcIj86IHN0cmluZztcbn07XG5cbmV4cG9ydCBmdW5jdGlvbiBNZWRpYVZpZXdlckJhcih7XG4gIGNoaWxkcmVuLFxuICBoYXNTZXBhcmF0b3IsXG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiOiBkYXRhRTJlVGVzdElkLFxufTogTWVkaWFWaWV3ZXJCYXJQcm9wcyk6IFJlYWN0RWxlbWVudCB7XG4gIGNvbnN0IGZsYXR0ZW5lZENoaWxkcmVuID0gZmxhdHRlbkNoaWxkcmVuKGNoaWxkcmVuKTtcblxuICByZXR1cm4gKFxuICAgIDxTdWJUaGVtZVByb3ZpZGVyIG5hbWU9XCJkaW1tZWRcIj5cbiAgICAgIDxTdHlsZWRNZWRpYVZpZXdlckJhclxuICAgICAgICBkYXRhLWUyZS10ZXN0LWlkPXtkYXRhRTJlVGVzdElkfVxuICAgICAgICBkYXRhLWRzLWlkPVwiTWVkaWFWaWV3ZXJCYXJcIlxuICAgICAgPlxuICAgICAgICA8SW5saW5lIHNwYWNlPVwiemVyb1wiIHZBbGlnbkl0ZW1zPVwiY2VudGVyXCIgYWxpZ25JdGVtcz1cImNlbnRlclwiIG5vV3JhcD5cbiAgICAgICAgICB7UmVhY3QuQ2hpbGRyZW4ubWFwKGZsYXR0ZW5lZENoaWxkcmVuLCAoY2hpbGQsIGluZGV4KSA9PiAoXG4gICAgICAgICAgICA8PlxuICAgICAgICAgICAgICB7aGFzU2VwYXJhdG9yICYmIGluZGV4ID4gMCAmJiA8U3R5bGVkU2VwYXJhdG9yIC8+fVxuICAgICAgICAgICAgICB7Y2hpbGR9XG4gICAgICAgICAgICA8Lz5cbiAgICAgICAgICApKX1cbiAgICAgICAgPC9JbmxpbmU+XG4gICAgICA8L1N0eWxlZE1lZGlhVmlld2VyQmFyPlxuICAgIDwvU3ViVGhlbWVQcm92aWRlcj5cbiAgKTtcbn1cbiJdfQ== */");
 function MediaViewerBar(_ref3) {
   let {
     children,

package/build/esm/src/components/MediaViewerBar/MediaViewerBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"MediaViewerBar.js","sources":["../../../../../src/components/MediaViewerBar/MediaViewerBar.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Inline } from \"../Inline/Inline\";\nimport { flattenChildren } from \"../../shared/flattenChildren\";\nimport { SubThemeProvider } from \"../SubThemeProvider/SubThemeProvider\";\n\nconst StyledMediaViewerBar = styled.div(({ theme }) => ({\n  display: \"inline-flex\",\n  borderRadius: theme.variables.size.spacing.xxs,\n  height: theme.variables.size.spacing.l,\n  backgroundColor: theme.values.color.background.layer_1,\n  color: theme.values.color.text.lightPrimary,\n  overflow: \"hidden\",\n  \"> div\": {\n    width: \"100%\",\n    \"> div\": {\n      lineHeight: \"normal\",\n    },\n  },\n}));\n\nconst StyledSeparator = styled.div(({ theme }) => ({\n  width: theme.variables.size.dimension.mediaViewerBar.separator.width,\n  height: theme.variables.size.spacing.l,\n  backgroundColor: theme.values.color.background.layer_2,\n}));\n\nexport type MediaViewerBarProps = {\n  children?: ReactElement | ReactElement[];\n  hasSeparator?: boolean;\n  \"data-e2e-test-id\"?: string;\n};\n\nexport function MediaViewerBar({\n  children,\n  hasSeparator,\n  \"data-e2e-test-id\": dataE2eTestId,\n}: MediaViewerBarProps): ReactElement {\n  const flattenedChildren = flattenChildren(children);\n\n  return (\n    <SubThemeProvider name=\"dimmed\">\n      <StyledMediaViewerBar\n        data-e2e-test-id={dataE2eTestId}\n        data-ds-id=\"MediaViewerBar\"\n      >\n        <Inline space=\"zero\" vAlignItems=\"center\" alignItems=\"center\" noWrap>\n          {React.Children.map(flattenedChildren, (child, index) => (\n            <>\n              {hasSeparator && index > 0 && <StyledSeparator />}\n              {child}\n            </>\n          ))}\n        </Inline>\n      </StyledMediaViewerBar>\n    </SubThemeProvider>\n  );\n}\n"],"names":["StyledMediaViewerBar","_styled","process","env","NODE_ENV","target","label","_ref","theme","display","borderRadius","variables","size","spacing","xxs","height","l","backgroundColor","values","color","background","layer_1","text","lightPrimary","overflow","width","lineHeight","StyledSeparator","_ref2","dimension","mediaViewerBar","separator","layer_2","MediaViewerBar","_ref3","children","hasSeparator","dataE2eTestId","flattenedChildren","flattenChildren","React","createElement","SubThemeProvider","name","Inline","space","vAlignItems","alignItems","noWrap","Children","map","child","index","Fragment"],"mappings":"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"}
+{"version":3,"file":"MediaViewerBar.js","sources":["../../../../../src/components/MediaViewerBar/MediaViewerBar.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Inline } from \"../Inline/Inline\";\nimport { flattenChildren } from \"../../shared/flattenChildren\";\nimport { SubThemeProvider } from \"../SubThemeProvider/SubThemeProvider\";\n\nconst StyledMediaViewerBar = styled.div(({ theme }) => ({\n  display: \"inline-flex\",\n  borderRadius: theme.variables.size.spacing.xxs,\n  height: theme.variables.size.spacing.l,\n  backgroundColor: theme.values.color.background.primary.default,\n  color: theme.values.color.text.secondary.default,\n  overflow: \"hidden\",\n  \"> div\": {\n    width: \"100%\",\n    \"> div\": {\n      lineHeight: \"normal\",\n    },\n  },\n}));\n\nconst StyledSeparator = styled.div(({ theme }) => ({\n  width: theme.variables.size.dimension.mediaViewerBar.separator.width,\n  height: theme.variables.size.spacing.l,\n  backgroundColor: theme.values.color.background.primary.default,\n}));\n\nexport type MediaViewerBarProps = {\n  children?: ReactElement | ReactElement[];\n  hasSeparator?: boolean;\n  \"data-e2e-test-id\"?: string;\n};\n\nexport function MediaViewerBar({\n  children,\n  hasSeparator,\n  \"data-e2e-test-id\": dataE2eTestId,\n}: MediaViewerBarProps): ReactElement {\n  const flattenedChildren = flattenChildren(children);\n\n  return (\n    <SubThemeProvider name=\"dimmed\">\n      <StyledMediaViewerBar\n        data-e2e-test-id={dataE2eTestId}\n        data-ds-id=\"MediaViewerBar\"\n      >\n        <Inline space=\"zero\" vAlignItems=\"center\" alignItems=\"center\" noWrap>\n          {React.Children.map(flattenedChildren, (child, index) => (\n            <>\n              {hasSeparator && index > 0 && <StyledSeparator />}\n              {child}\n            </>\n          ))}\n        </Inline>\n      </StyledMediaViewerBar>\n    </SubThemeProvider>\n  );\n}\n"],"names":["StyledMediaViewerBar","_styled","process","env","NODE_ENV","target","label","_ref","theme","display","borderRadius","variables","size","spacing","xxs","height","l","backgroundColor","values","color","background","primary","default","text","secondary","overflow","width","lineHeight","StyledSeparator","_ref2","dimension","mediaViewerBar","separator","MediaViewerBar","_ref3","children","hasSeparator","dataE2eTestId","flattenedChildren","flattenChildren","React","createElement","SubThemeProvider","name","Inline","space","vAlignItems","alignItems","noWrap","Children","map","child","index","Fragment"],"mappings":"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"}