@equinor/eds-core-react 0.26.0 → 0.28.0-dev12052022

package/dist/esm/components/Button/tokens/icon.js

@@ -3,19 +3,19 @@ import { button } from './button.js';
 import mergeDeepRight from '../../../node_modules/.pnpm/ramda@0.28.0/node_modules/ramda/es/mergeDeepRight.js';
 
 var _tokens$colors$intera = tokens.colors.interactive,
-    primaryColor = _tokens$colors$intera.primary__resting.rgba,
-    primaryHoverAltColor = _tokens$colors$intera.primary__hover_alt.rgba,
-    secondaryColor = _tokens$colors$intera.secondary__resting.rgba,
-    secondaryHoverColor = _tokens$colors$intera.secondary__link_hover.rgba,
-    secondaryHoverAltColor = _tokens$colors$intera.secondary__highlight.rgba,
-    dangerColor = _tokens$colors$intera.danger__resting.rgba,
-    dangerHoverColor = _tokens$colors$intera.danger__hover.rgba,
-    dangerHoverAltColor = _tokens$colors$intera.danger__highlight.rgba,
-    _tokens$clickbounds = tokens.clickbounds,
-    clicboundHeight = _tokens$clickbounds.default__base,
-    compactClickboundHeight = _tokens$clickbounds.compact__standard,
-    shape = tokens.shape,
-    focusOutlineWidth = tokens.interactions.focused.width;
+  primaryColor = _tokens$colors$intera.primary__resting.rgba,
+  primaryHoverAltColor = _tokens$colors$intera.primary__hover_alt.rgba,
+  secondaryColor = _tokens$colors$intera.secondary__resting.rgba,
+  secondaryHoverColor = _tokens$colors$intera.secondary__link_hover.rgba,
+  secondaryHoverAltColor = _tokens$colors$intera.secondary__highlight.rgba,
+  dangerColor = _tokens$colors$intera.danger__resting.rgba,
+  dangerHoverColor = _tokens$colors$intera.danger__hover.rgba,
+  dangerHoverAltColor = _tokens$colors$intera.danger__highlight.rgba,
+  _tokens$clickbounds = tokens.clickbounds,
+  clicboundHeight = _tokens$clickbounds.default__base,
+  compactClickboundHeight = _tokens$clickbounds.compact__standard,
+  shape = tokens.shape,
+  focusOutlineWidth = tokens.interactions.focused.width;
 var primary = mergeDeepRight(button, {
   height: shape.icon_button.minHeight,
   width: shape.icon_button.minWidth,

package/dist/esm/components/Button/tokens/outlined.js

@@ -3,16 +3,16 @@ import { button } from './button.js';
 import mergeDeepRight from '../../../node_modules/.pnpm/ramda@0.28.0/node_modules/ramda/es/mergeDeepRight.js';
 
 var _tokens$colors$intera = tokens.colors.interactive,
-    primaryColor = _tokens$colors$intera.primary__resting.rgba,
-    primaryHoverColor = _tokens$colors$intera.primary__hover.rgba,
-    primaryHoverAltColor = _tokens$colors$intera.primary__hover_alt.rgba,
-    secondaryColor = _tokens$colors$intera.secondary__resting.rgba,
-    secondaryHoverColor = _tokens$colors$intera.secondary__link_hover.rgba,
-    secondaryHoverAltColor = _tokens$colors$intera.secondary__highlight.rgba,
-    dangerColor = _tokens$colors$intera.danger__resting.rgba,
-    dangerHoverColor = _tokens$colors$intera.danger__hover.rgba,
-    dangerHoverAltColor = _tokens$colors$intera.danger__highlight.rgba,
-    buttonBorderRadius = tokens.shape.button.borderRadius;
+  primaryColor = _tokens$colors$intera.primary__resting.rgba,
+  primaryHoverColor = _tokens$colors$intera.primary__hover.rgba,
+  primaryHoverAltColor = _tokens$colors$intera.primary__hover_alt.rgba,
+  secondaryColor = _tokens$colors$intera.secondary__resting.rgba,
+  secondaryHoverColor = _tokens$colors$intera.secondary__link_hover.rgba,
+  secondaryHoverAltColor = _tokens$colors$intera.secondary__highlight.rgba,
+  dangerColor = _tokens$colors$intera.danger__resting.rgba,
+  dangerHoverColor = _tokens$colors$intera.danger__hover.rgba,
+  dangerHoverAltColor = _tokens$colors$intera.danger__highlight.rgba,
+  buttonBorderRadius = tokens.shape.button.borderRadius;
 var primary = mergeDeepRight(button, {
   typography: {
     color: primaryColor

package/dist/esm/components/Card/Card.js

@@ -19,20 +19,17 @@ var StyledCard = styled(Paper).withConfig({
 }, bordersTemplate(primary.border));
 var Card = /*#__PURE__*/forwardRef(function Card(_ref2, ref) {
   var children = _ref2.children,
-      _ref2$variant = _ref2.variant,
-      variant = _ref2$variant === void 0 ? 'default' : _ref2$variant,
-      _ref2$elevation = _ref2.elevation,
-      elevation = _ref2$elevation === void 0 ? 'none' : _ref2$elevation,
-      rest = _objectWithoutProperties(_ref2, _excluded);
-
+    _ref2$variant = _ref2.variant,
+    variant = _ref2$variant === void 0 ? 'default' : _ref2$variant,
+    _ref2$elevation = _ref2.elevation,
+    elevation = _ref2$elevation === void 0 ? 'none' : _ref2$elevation,
+    rest = _objectWithoutProperties(_ref2, _excluded);
   var cardVariant = variant === 'default' ? 'primary' : variant;
   var token = Card_tokens[cardVariant];
-
   var props = _objectSpread({
     ref: ref,
     background: token.background
   }, rest);
-
   return /*#__PURE__*/jsx(StyledCard, _objectSpread(_objectSpread({
     elevation: elevation
   }, props), {}, {

package/dist/esm/components/Card/Card.tokens.js

@@ -1,12 +1,12 @@
 import { tokens as tokens$1 } from '@equinor/eds-tokens';
 
 var _tokens$colors$ui = tokens$1.colors.ui,
-    background = _tokens$colors$ui.background__default.rgba,
-    backgroundInfo = _tokens$colors$ui.background__info.rgba,
-    backgroundWarning = _tokens$colors$ui.background__warning.rgba,
-    backgroundDanger = _tokens$colors$ui.background__danger.rgba,
-    spacingMedium = tokens$1.spacings.comfortable.medium,
-    borderRadius = tokens$1.shape.corners.borderRadius;
+  background = _tokens$colors$ui.background__default.rgba,
+  backgroundInfo = _tokens$colors$ui.background__info.rgba,
+  backgroundWarning = _tokens$colors$ui.background__warning.rgba,
+  backgroundDanger = _tokens$colors$ui.background__danger.rgba,
+  spacingMedium = tokens$1.spacings.comfortable.medium,
+  borderRadius = tokens$1.shape.corners.borderRadius;
 var primary = {
   background: background,
   border: {

package/dist/esm/components/Card/CardActions.js

@@ -17,19 +17,16 @@ var StyledCardActions = styled.div.withConfig({
 }, spacings.right, spacings.left, spacings.top, spacings.bottom);
 var CardActions = /*#__PURE__*/forwardRef(function CardActions(_ref2, ref) {
   var children = _ref2.children,
-      _ref2$alignRight = _ref2.alignRight,
-      alignRight = _ref2$alignRight === void 0 ? false : _ref2$alignRight,
-      _ref2$meta = _ref2.meta,
-      meta = _ref2$meta === void 0 ? '' : _ref2$meta,
-      rest = _objectWithoutProperties(_ref2, _excluded);
-
+    _ref2$alignRight = _ref2.alignRight,
+    alignRight = _ref2$alignRight === void 0 ? false : _ref2$alignRight,
+    _ref2$meta = _ref2.meta,
+    meta = _ref2$meta === void 0 ? '' : _ref2$meta,
+    rest = _objectWithoutProperties(_ref2, _excluded);
   var justifyContent = alignRight ? 'flex-end' : 'flex-start';
-
   var props = _objectSpread({
     ref: ref,
     justifyContent: justifyContent
   }, rest);
-
   return /*#__PURE__*/jsxs(StyledCardActions, _objectSpread(_objectSpread({}, props), {}, {
     children: [children, meta !== '' && /*#__PURE__*/jsx(Typography, {
       variant: "caption",

package/dist/esm/components/Card/CardContent.js

@@ -13,8 +13,7 @@ var StyledCardContent = styled.div.withConfig({
 })(["display:grid;padding:0 ", " 0 ", ";:last-child{padding-bottom:", ";}"], spacings.right, spacings.left, spacings.bottom);
 var CardContent = /*#__PURE__*/forwardRef(function CardContent(_ref, ref) {
   var children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded);
-
+    props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/jsx(StyledCardContent, _objectSpread(_objectSpread({
     ref: ref
   }, props), {}, {

package/dist/esm/components/Card/CardHeader.js

@@ -13,12 +13,10 @@ var StyledCardHeader = styled.div.withConfig({
 })(["display:flex;justify-content:space-between;align-items:center;padding:0 ", " 0 ", ";> :not(:first-child){margin-left:", ";}:first-child{padding-top:", ";}:last-child{padding-bottom:", ";}"], spacings.right, spacings.left, spacings.left, spacings.top, spacings.bottom);
 var CardHeader = /*#__PURE__*/forwardRef(function CardHeader(_ref, ref) {
   var children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
+    rest = _objectWithoutProperties(_ref, _excluded);
   var props = _objectSpread(_objectSpread({}, rest), {}, {
     ref: ref
   });
-
   return /*#__PURE__*/jsx(StyledCardHeader, _objectSpread(_objectSpread({}, props), {}, {
     children: children
   }));

package/dist/esm/components/Card/CardHeaderTitle.js

@@ -11,12 +11,10 @@ var StyledCardHeaderTitle = styled.div.withConfig({
 })(["display:grid;flex-grow:2;grid-auto-columns:auto;"]);
 var CardHeaderTitle = /*#__PURE__*/forwardRef(function CardHeaderTitle(_ref, ref) {
   var children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
+    rest = _objectWithoutProperties(_ref, _excluded);
   var props = _objectSpread(_objectSpread({}, rest), {}, {
     ref: ref
   });
-
   return /*#__PURE__*/jsx(StyledCardHeaderTitle, _objectSpread(_objectSpread({}, props), {}, {
     children: children
   }));

package/dist/esm/components/Card/CardMedia.js

@@ -7,7 +7,7 @@ import { jsx } from 'react/jsx-runtime';
 
 var _excluded = ["children", "fullWidth"];
 var spacings = primary.spacings,
-    border = primary.border;
+  border = primary.border;
 var StyledCardMedia = styled.div.withConfig({
   displayName: "CardMedia__StyledCardMedia",
   componentId: "sc-kr8q9c-0"
@@ -17,15 +17,13 @@ var StyledCardMedia = styled.div.withConfig({
 });
 var CardMedia = /*#__PURE__*/forwardRef(function CardMedia(_ref2, ref) {
   var children = _ref2.children,
-      _ref2$fullWidth = _ref2.fullWidth,
-      fullWidth = _ref2$fullWidth === void 0 ? false : _ref2$fullWidth,
-      rest = _objectWithoutProperties(_ref2, _excluded);
-
+    _ref2$fullWidth = _ref2.fullWidth,
+    fullWidth = _ref2$fullWidth === void 0 ? false : _ref2$fullWidth,
+    rest = _objectWithoutProperties(_ref2, _excluded);
   var props = _objectSpread(_objectSpread({}, rest), {}, {
     ref: ref,
     fullWidth: fullWidth
   });
-
   return /*#__PURE__*/jsx(StyledCardMedia, _objectSpread(_objectSpread({}, props), {}, {
     children: children
   }));

package/dist/esm/components/Checkbox/Checkbox.js

@@ -21,13 +21,12 @@ var LabelText = styled.span.withConfig({
 })(["", ";"], typographyTemplate(checkbox.typography));
 var Checkbox = /*#__PURE__*/forwardRef(function Checkbox(_ref2, ref) {
   var label = _ref2.label,
-      _ref2$disabled = _ref2.disabled,
-      disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
-      indeterminate = _ref2.indeterminate,
-      className = _ref2.className,
-      style = _ref2.style,
-      rest = _objectWithoutProperties(_ref2, _excluded);
-
+    _ref2$disabled = _ref2.disabled,
+    disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
+    indeterminate = _ref2.indeterminate,
+    className = _ref2.className,
+    style = _ref2.style,
+    rest = _objectWithoutProperties(_ref2, _excluded);
   return label ? /*#__PURE__*/jsxs(StyledLabel, {
     disabled: disabled,
     className: className,

package/dist/esm/components/Checkbox/Checkbox.tokens.js

@@ -1,18 +1,18 @@
 import { tokens } from '@equinor/eds-tokens';
 
 var _tokens$colors$intera = tokens.colors.interactive,
-    primaryColor = _tokens$colors$intera.primary__resting.rgba,
-    primaryHoverAlt = _tokens$colors$intera.primary__hover_alt.rgba,
-    focusOutlineColor = _tokens$colors$intera.focus.rgba,
-    disabledText = _tokens$colors$intera.disabled__text.rgba,
-    labelTypography = tokens.typography.navigation.menu_title,
-    _tokens$spacings$comf = tokens.spacings.comfortable,
-    medium_small = _tokens$spacings$comf.medium_small,
-    x_small = _tokens$spacings$comf.x_small,
-    _tokens$clickbounds = tokens.clickbounds,
-    clicboundSize = _tokens$clickbounds.default__base,
-    compactClickboundSize = _tokens$clickbounds.compact__standard,
-    focusOutlineWidth = tokens.interactions.focused.width;
+  primaryColor = _tokens$colors$intera.primary__resting.rgba,
+  primaryHoverAlt = _tokens$colors$intera.primary__hover_alt.rgba,
+  focusOutlineColor = _tokens$colors$intera.focus.rgba,
+  disabledText = _tokens$colors$intera.disabled__text.rgba,
+  labelTypography = tokens.typography.navigation.menu_title,
+  _tokens$spacings$comf = tokens.spacings.comfortable,
+  medium_small = _tokens$spacings$comf.medium_small,
+  x_small = _tokens$spacings$comf.x_small,
+  _tokens$clickbounds = tokens.clickbounds,
+  clicboundSize = _tokens$clickbounds.default__base,
+  compactClickboundSize = _tokens$clickbounds.compact__standard,
+  focusOutlineWidth = tokens.interactions.focused.width;
 var checkbox = {
   background: primaryColor,
   typography: labelTypography,

package/dist/esm/components/Checkbox/Input.js

@@ -23,7 +23,7 @@ var StyledPath = styled.path.attrs(function (_ref) {
 })([""]);
 var Input = styled.input.attrs(function (_ref2) {
   var _ref2$type = _ref2.type,
-      type = _ref2$type === void 0 ? 'checkbox' : _ref2$type;
+    type = _ref2$type === void 0 ? 'checkbox' : _ref2$type;
   return {
     type: type
   };
@@ -32,7 +32,7 @@ var Input = styled.input.attrs(function (_ref2) {
   componentId: "sc-rqj7qf-1"
 })(["--scale:", ";appearance:none;width:100%;height:100%;margin:0;grid-area:input;transform:scale(var(--scale));cursor:", ";&:focus{outline:none;}&[data-focus-visible-added]:focus + svg{", "}&:focus-visible + svg{", "}&:not(:checked) ~ svg path[name='checked']{display:none;}&:not(:checked) ~ svg path[name='not-checked']{display:inline;}&:checked ~ svg path[name='not-checked']{display:none;}&:checked ~ svg path[name='checked']{display:inline;}"], function (_ref3) {
   var theme = _ref3.theme,
-      iconSize = _ref3.iconSize;
+    iconSize = _ref3.iconSize;
   return parseFloat(theme.clickbound.height) / iconSize;
 }, function (_ref4) {
   var disabled = _ref4.disabled;
@@ -46,8 +46,8 @@ var Input = styled.input.attrs(function (_ref2) {
 });
 var Svg = styled.svg.attrs(function (_ref7) {
   var height = _ref7.height,
-      width = _ref7.width,
-      fill = _ref7.fill;
+    width = _ref7.width,
+    fill = _ref7.fill;
   return {
     name: null,
     xmlns: 'http://www.w3.org/2000/svg',
@@ -71,15 +71,13 @@ var InputWrapper = styled.span.withConfig({
 });
 var CheckboxInput = /*#__PURE__*/forwardRef(function CheckboxInput(_ref10, ref) {
   var _ref10$disabled = _ref10.disabled,
-      disabled = _ref10$disabled === void 0 ? false : _ref10$disabled,
-      indeterminate = _ref10.indeterminate,
-      style = _ref10.style,
-      className = _ref10.className,
-      rest = _objectWithoutProperties(_ref10, _excluded);
-
+    disabled = _ref10$disabled === void 0 ? false : _ref10$disabled,
+    indeterminate = _ref10.indeterminate,
+    style = _ref10.style,
+    className = _ref10.className,
+    rest = _objectWithoutProperties(_ref10, _excluded);
   var _useEds = useEds(),
-      density = _useEds.density;
-
+    density = _useEds.density;
   var token = useToken({
     density: density
   }, checkbox);
@@ -90,12 +88,10 @@ var CheckboxInput = /*#__PURE__*/forwardRef(function CheckboxInput(_ref10, ref)
     style: style,
     className: className
   };
-
   var inputProps = _objectSpread(_defineProperty({
     ref: ref,
     disabled: disabled
   }, 'data-indeterminate', indeterminate), rest);
-
   return /*#__PURE__*/jsx(ThemeProvider, {
     theme: token,
     children: /*#__PURE__*/jsxs(InputWrapper, _objectSpread(_objectSpread({}, inputWrapperProps), {}, {

package/dist/esm/components/Chip/Chip.js

@@ -9,16 +9,16 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 
 var _excluded = ["children", "onDelete", "disabled", "onClick", "variant"];
 var enabled = enabled$1,
-    error = error$1;
+  error = error$1;
 var background = enabled.background,
-    height = enabled.height,
-    typography = enabled.typography,
-    spacings = enabled.spacings,
-    border = enabled.border,
-    states = enabled.states;
+  height = enabled.height,
+  typography = enabled.typography,
+  spacings = enabled.spacings,
+  border = enabled.border,
+  states = enabled.states;
 var StyledChips = styled.div.attrs(function (_ref) {
   var clickable = _ref.clickable,
-      deletable = _ref.deletable;
+    deletable = _ref.deletable;
   return {
     tabIndex: clickable || deletable ? 0 : null,
     role: clickable ? 'button' : null
@@ -31,14 +31,11 @@ var StyledChips = styled.div.attrs(function (_ref) {
   return clickable && css(["@media (hover:hover) and (pointer:fine){&:hover{cursor:pointer;}}"]);
 }, function (_ref3) {
   var variant = _ref3.variant;
-
   switch (variant) {
     case 'active':
       return css(["background:", ";"], states.active.background);
-
     case 'error':
       return css(["background:", ";color:", ";svg{fill:", ";}", ";@media (hover:hover) and (pointer:fine){&:hover{border-color:", ";color:", ";svg{fill:", ";}}}"], error.background, error.typography.color, error.entities.icon.typography.color, bordersTemplate(error.border), error.states.hover.typography.color, error.states.hover.typography.color, error.states.hover.typography.color);
-
     default:
       return '';
   }
@@ -54,20 +51,18 @@ var StyledChips = styled.div.attrs(function (_ref) {
 });
 var Chip = /*#__PURE__*/forwardRef(function Chip(_ref7, ref) {
   var children = _ref7.children,
-      onDelete = _ref7.onDelete,
-      _ref7$disabled = _ref7.disabled,
-      disabled = _ref7$disabled === void 0 ? false : _ref7$disabled,
-      onClick = _ref7.onClick,
-      _ref7$variant = _ref7.variant,
-      variant = _ref7$variant === void 0 ? 'default' : _ref7$variant,
-      other = _objectWithoutProperties(_ref7, _excluded);
-
+    onDelete = _ref7.onDelete,
+    _ref7$disabled = _ref7.disabled,
+    disabled = _ref7$disabled === void 0 ? false : _ref7$disabled,
+    onClick = _ref7.onClick,
+    _ref7$variant = _ref7.variant,
+    variant = _ref7$variant === void 0 ? 'default' : _ref7$variant,
+    other = _objectWithoutProperties(_ref7, _excluded);
   var handleDelete = disabled ? undefined : onDelete;
   var handleClick = disabled ? undefined : onClick;
   var deletable = handleDelete !== undefined;
   var clickable = handleClick !== undefined;
   var onlyChild = typeof children === 'string';
-
   var chipProps = _objectSpread(_objectSpread({}, other), {}, {
     ref: ref,
     disabled: disabled,
@@ -76,23 +71,19 @@ var Chip = /*#__PURE__*/forwardRef(function Chip(_ref7, ref) {
     onlyChild: onlyChild,
     variant: variant
   });
-
   var handleKeyPress = function handleKeyPress(event) {
     var _ref8 = event,
-        key = _ref8.key;
-
+      key = _ref8.key;
     if (key === 'Enter') {
       if (deletable) {
         handleDelete(event);
-      } // Delete takes precedence, else click action is activated
-
-
+      }
+      // Delete takes precedence, else click action is activated
       if (clickable && !deletable) {
         handleClick(event);
       }
     }
   };
-
   var resizedChildren = Children.map(children, function (child) {
     // We force size on Icon & Avatar component
     if (child.props) {
@@ -101,18 +92,14 @@ var Chip = /*#__PURE__*/forwardRef(function Chip(_ref7, ref) {
         disabled: disabled
       });
     }
-
     return child;
   });
-
   var onDeleteClick = function onDeleteClick(event) {
     event.stopPropagation();
-
     if (deletable) {
       handleDelete(event);
     }
   };
-
   return /*#__PURE__*/jsxs(StyledChips, _objectSpread(_objectSpread({}, chipProps), {}, {
     onClick: function onClick(event) {
       return clickable && handleClick(event);
@@ -127,6 +114,8 @@ var Chip = /*#__PURE__*/forwardRef(function Chip(_ref7, ref) {
       size: 16
     })]
   }));
-}); // Chip.displayName = 'eds-chip'
+});
+
+// Chip.displayName = 'eds-chip'
 
 export { Chip };

package/dist/esm/components/Chip/Chip.tokens.js

@@ -2,26 +2,26 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import { tokens } from '@equinor/eds-tokens';
 
 var _tokens$spacings$comf = tokens.spacings.comfortable,
-    x_small = _tokens$spacings$comf.x_small,
-    small = _tokens$spacings$comf.small,
-    medium = _tokens$spacings$comf.medium,
-    chipTypography = tokens.typography.ui.chip__badge,
-    _tokens$colors = tokens.colors,
-    _tokens$colors$ui = _tokens$colors.ui,
-    backgroundColorDefault = _tokens$colors$ui.background__default.rgba,
-    backgroundColor = _tokens$colors$ui.background__light.rgba,
-    _tokens$colors$intera = _tokens$colors.interactive,
-    primaryColor = _tokens$colors$intera.primary__resting.rgba,
-    primaryHoverAlt = _tokens$colors$intera.primary__hover_alt.rgba,
-    primaryHover = _tokens$colors$intera.primary__hover.rgba,
-    disabledColor = _tokens$colors$intera.disabled__text.rgba,
-    focusOutlineColor = _tokens$colors$intera.focus.rgba,
-    activeColor = _tokens$colors$intera.primary__selected_highlight.rgba,
-    errorColor = _tokens$colors$intera.danger__resting.rgba,
-    errorColorHover = _tokens$colors$intera.danger__hover.rgba,
-    errorBackgroundHover = _tokens$colors$intera.danger__highlight.rgba,
-    borderRadius = tokens.shape.rounded.borderRadius,
-    focusOutlineWidth = tokens.interactions.focused.width;
+  x_small = _tokens$spacings$comf.x_small,
+  small = _tokens$spacings$comf.small,
+  medium = _tokens$spacings$comf.medium,
+  chipTypography = tokens.typography.ui.chip__badge,
+  _tokens$colors = tokens.colors,
+  _tokens$colors$ui = _tokens$colors.ui,
+  backgroundColorDefault = _tokens$colors$ui.background__default.rgba,
+  backgroundColor = _tokens$colors$ui.background__light.rgba,
+  _tokens$colors$intera = _tokens$colors.interactive,
+  primaryColor = _tokens$colors$intera.primary__resting.rgba,
+  primaryHoverAlt = _tokens$colors$intera.primary__hover_alt.rgba,
+  primaryHover = _tokens$colors$intera.primary__hover.rgba,
+  disabledColor = _tokens$colors$intera.disabled__text.rgba,
+  focusOutlineColor = _tokens$colors$intera.focus.rgba,
+  activeColor = _tokens$colors$intera.primary__selected_highlight.rgba,
+  errorColor = _tokens$colors$intera.danger__resting.rgba,
+  errorColorHover = _tokens$colors$intera.danger__hover.rgba,
+  errorBackgroundHover = _tokens$colors$intera.danger__highlight.rgba,
+  borderRadius = tokens.shape.rounded.borderRadius,
+  focusOutlineWidth = tokens.interactions.focused.width;
 var enabled = {
   background: backgroundColor,
   height: '22px',

package/dist/esm/components/Chip/Icon.js

@@ -8,17 +8,15 @@ Icon$1.add({
   close: close
 });
 var enabled = enabled$1,
-    error = error$1;
+  error = error$1;
 var Icon = styled(Icon$1).withConfig({
   displayName: "Icon",
   componentId: "sc-50ffvg-0"
 })(["cursor:pointer;padding:1px;", " z-index:11;&:hover{", ";}", ""], bordersTemplate(enabled.entities.icon.border), function (_ref) {
   var variant = _ref.variant;
-
   switch (variant) {
     case 'error':
       return css(["background:", ";svg{fill:", ";}"], error.entities.icon.background, error.entities.icon.typography.color);
-
     default:
       return css(["background:", ";svg{fill:", ";}"], enabled.entities.icon.states.hover.background, enabled.states.hover.typography.color);
   }

package/dist/esm/components/Dialog/Dialog.js

@@ -26,35 +26,28 @@ var StyledDialog = styled(Paper).attrs({
 });
 var Dialog = /*#__PURE__*/forwardRef(function Dialog(_ref2, ref) {
   var children = _ref2.children,
-      open = _ref2.open,
-      onClose = _ref2.onClose,
-      _ref2$isDismissable = _ref2.isDismissable,
-      isDismissable = _ref2$isDismissable === void 0 ? false : _ref2$isDismissable,
-      props = _objectWithoutProperties(_ref2, _excluded);
-
+    open = _ref2.open,
+    onClose = _ref2.onClose,
+    _ref2$isDismissable = _ref2.isDismissable,
+    isDismissable = _ref2$isDismissable === void 0 ? false : _ref2$isDismissable,
+    props = _objectWithoutProperties(_ref2, _excluded);
   var _useEds = useEds(),
-      density = _useEds.density;
-
+    density = _useEds.density;
   var token = useToken({
     density: density
   }, dialog);
-
   var _useFloating = useFloating(),
-      floating = _useFloating.floating,
-      context = _useFloating.context;
-
+    floating = _useFloating.floating,
+    context = _useFloating.context;
   var handleDismiss = function handleDismiss() {
     onClose && onClose();
   };
-
   var dialogRef = useMemo(function () {
     return mergeRefs(floating, ref);
   }, [floating, ref]);
-
   var rest = _objectSpread(_objectSpread({}, props), {}, {
     open: open
   });
-
   return /*#__PURE__*/jsx(FloatingPortal, {
     id: "eds-dialog-container",
     children: /*#__PURE__*/jsx(ThemeProvider, {
@@ -77,6 +70,8 @@ var Dialog = /*#__PURE__*/forwardRef(function Dialog(_ref2, ref) {
       })
     })
   });
-}); // Dialog.displayName = 'EdsDialog'
+});
+
+// Dialog.displayName = 'EdsDialog'
 
 export { Dialog };

package/dist/esm/components/Dialog/Dialog.tokens.js

@@ -1,11 +1,11 @@
 import { tokens } from '@equinor/eds-tokens';
 
 var spacingMedium = tokens.spacings.comfortable.medium,
-    _tokens$typography = tokens.typography,
-    accordion_header = _tokens$typography.ui.accordion_header,
-    body_long = _tokens$typography.paragraph.body_long,
-    background = tokens.colors.ui.background__default.rgba,
-    borderRadius = tokens.shape.corners.borderRadius;
+  _tokens$typography = tokens.typography,
+  accordion_header = _tokens$typography.ui.accordion_header,
+  body_long = _tokens$typography.paragraph.body_long,
+  background = tokens.colors.ui.background__default.rgba,
+  borderRadius = tokens.shape.corners.borderRadius;
 var dialog = {
   width: '252px',
   background: background,

package/dist/esm/components/Dialog/DialogActions.js

@@ -10,18 +10,19 @@ var StyledDialogActions = styled.div.withConfig({
   componentId: "sc-16ydtxd-0"
 })(function (_ref) {
   var theme = _ref.theme,
-      children = _ref.children;
+    children = _ref.children;
   return css(["align-self:end;justify-self:start;padding:0 ", " 0 ", ";&:first-child{padding-top:", ";}&:last-child{padding-bottom:", ";}", ""], theme.entities.children.spacings.right, theme.entities.children.spacings.left, theme.entities.children.spacings.top, theme.entities.children.spacings.bottom, !children && css(["min-height:initial;height:'8px';"]));
 });
 var DialogActions = /*#__PURE__*/forwardRef(function DialogActions(_ref2, ref) {
   var children = _ref2.children,
-      props = _objectWithoutProperties(_ref2, _excluded);
-
+    props = _objectWithoutProperties(_ref2, _excluded);
   return /*#__PURE__*/jsx(StyledDialogActions, _objectSpread(_objectSpread({
     ref: ref
   }, props), {}, {
     children: children
   }));
-}); // Actions.displayName = 'EdsDialogActions'
+});
+
+// Actions.displayName = 'EdsDialogActions'
 
 export { DialogActions };

package/dist/esm/components/Dialog/DialogContent.js

@@ -12,7 +12,7 @@ var StyledDialogContent = styled.div.withConfig({
   componentId: "sc-1tze18k-0"
 })(function (_ref) {
   var theme = _ref.theme,
-      scrollable = _ref.scrollable;
+    scrollable = _ref.scrollable;
   return css(["", " min-height:", ";align-self:stretch;justify-self:stretch;padding:0 ", " 0 ", ";&:first-child{padding-top:", ";}&:last-child{padding-bottom:", ";}", ""], typographyTemplate(theme.entities.content.typography), theme.entities.content.minHeight, theme.entities.children.spacings.right, theme.entities.children.spacings.left, theme.entities.children.spacings.top, theme.entities.children.spacings.bottom, scrollable && css(["min-height:initial;height:", ";overflow-y:auto;"], theme.entities.content.height));
 });
 var StyledDivider = styled(Divider).withConfig({
@@ -21,15 +21,13 @@ var StyledDivider = styled(Divider).withConfig({
 })(["width:100%;margin-bottom:0;"]);
 var DialogContent = /*#__PURE__*/forwardRef(function DialogContent(_ref2, ref) {
   var children = _ref2.children,
-      _ref2$scrollable = _ref2.scrollable,
-      scrollable = _ref2$scrollable === void 0 ? false : _ref2$scrollable,
-      rest = _objectWithoutProperties(_ref2, _excluded);
-
+    _ref2$scrollable = _ref2.scrollable,
+    scrollable = _ref2$scrollable === void 0 ? false : _ref2$scrollable,
+    rest = _objectWithoutProperties(_ref2, _excluded);
   var props = _objectSpread({
     scrollable: scrollable,
     ref: ref
   }, rest);
-
   return /*#__PURE__*/jsxs(Fragment, {
     children: [/*#__PURE__*/jsx(StyledDialogContent, _objectSpread(_objectSpread({
       id: "eds-dialog-customcontent"