@equinor/eds-core-react 0.25.0 → 0.27.0

package/dist/esm/components/SideSheet/SideSheet.js

@@ -12,9 +12,9 @@ import { Typography } from '../Typography/Typography.js';
 
 var _excluded = ["variant", "width", "title", "children", "open", "onClose"];
 var background = comfortable.background,
-    spacings = comfortable.spacings,
-    border = comfortable.border,
-    typography = comfortable.typography;
+  spacings = comfortable.spacings,
+  border = comfortable.border,
+  typography = comfortable.typography;
 var StyledSideSheet = styled.div.withConfig({
   displayName: "SideSheet__StyledSideSheet",
   componentId: "sc-wkzlnn-0"
@@ -28,22 +28,21 @@ var Header = styled.div.withConfig({
 })(["display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;padding-bottom:24px;padding-right:10px;"]);
 var SideSheet = /*#__PURE__*/forwardRef(function SideSheet(_ref2, ref) {
   var _ref2$variant = _ref2.variant,
-      variant = _ref2$variant === void 0 ? 'medium' : _ref2$variant,
-      width = _ref2.width,
-      _ref2$title = _ref2.title,
-      title = _ref2$title === void 0 ? '' : _ref2$title,
-      children = _ref2.children,
-      _ref2$open = _ref2.open,
-      open = _ref2$open === void 0 ? true : _ref2$open,
-      onClose = _ref2.onClose,
-      rest = _objectWithoutProperties(_ref2, _excluded);
-
+    variant = _ref2$variant === void 0 ? 'medium' : _ref2$variant,
+    width = _ref2.width,
+    _ref2$title = _ref2.title,
+    title = _ref2$title === void 0 ? '' : _ref2$title,
+    children = _ref2.children,
+    _ref2$open = _ref2.open,
+    open = _ref2$open === void 0 ? true : _ref2$open,
+    onClose = _ref2.onClose,
+    rest = _objectWithoutProperties(_ref2, _excluded);
   var props = _objectSpread(_objectSpread({}, rest), {}, {
     ref: ref,
     width: width || variants[variant]
-  }); // Controller must set open={false} when pressing the close button
-
+  });
 
+  // Controller must set open={false} when pressing the close button
   return open && /*#__PURE__*/jsxs(StyledSideSheet, _objectSpread(_objectSpread({}, props), {}, {
     children: [/*#__PURE__*/jsxs(Header, {
       children: [/*#__PURE__*/jsx(Typography, {

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

@@ -2,12 +2,12 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import { tokens } from '@equinor/eds-tokens';
 
 var _tokens$colors$ui = tokens.colors.ui,
-    background = _tokens$colors$ui.background__default.rgba,
-    borderColor = _tokens$colors$ui.background__light.rgba,
-    _tokens$spacings$comf = tokens.spacings.comfortable,
-    spacingXXS = _tokens$spacings$comf.xx_small,
-    spacingMedium = _tokens$spacings$comf.medium,
-    body_short = tokens.typography.paragraph.body_short;
+  background = _tokens$colors$ui.background__default.rgba,
+  borderColor = _tokens$colors$ui.background__light.rgba,
+  _tokens$spacings$comf = tokens.spacings.comfortable,
+  spacingXXS = _tokens$spacings$comf.xx_small,
+  spacingMedium = _tokens$spacings$comf.medium,
+  body_short = tokens.typography.paragraph.body_short;
 var comfortable = {
   background: background,
   spacings: {

package/dist/esm/components/Slider/MinMax.js

@@ -5,8 +5,8 @@ import { slider } from './Slider.tokens.js';
 import { jsx } from 'react/jsx-runtime';
 
 var _tokens$entities = slider.entities,
-    track = _tokens$entities.track,
-    output = _tokens$entities.output;
+  track = _tokens$entities.track,
+  output = _tokens$entities.output;
 var StyledMinMax = styled.span.withConfig({
   displayName: "MinMax__StyledMinMax",
   componentId: "sc-lxmlid-0"

package/dist/esm/components/Slider/Output.js

@@ -5,8 +5,8 @@ import { slider } from './Slider.tokens.js';
 import { jsx } from 'react/jsx-runtime';
 
 var _tokens$entities = slider.entities,
-    track = _tokens$entities.track,
-    output = _tokens$entities.output;
+  track = _tokens$entities.track,
+  output = _tokens$entities.output;
 var StyledOutput = styled.output.withConfig({
   displayName: "Output__StyledOutput",
   componentId: "sc-1dy945x-0"
@@ -16,8 +16,8 @@ var StyledOutput = styled.output.withConfig({
 }, typographyTemplate(output.typography), slider.background, track.spacings.top);
 var Output = /*#__PURE__*/forwardRef(function Output(_ref2, ref) {
   var children = _ref2.children,
-      value = _ref2.value,
-      htmlFor = _ref2.htmlFor;
+    value = _ref2.value,
+    htmlFor = _ref2.htmlFor;
   return /*#__PURE__*/jsx(StyledOutput, {
     ref: ref,
     value: value,

package/dist/esm/components/Slider/Slider.js

@@ -12,9 +12,9 @@ import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 
 var _excluded = ["min", "max", "value", "outputFunction", "onChange", "onChangeCommitted", "minMaxDots", "minMaxValues", "step", "disabled", "ariaLabelledby", "aria-labelledby"];
 var _tokens$entities = slider.entities,
-    track = _tokens$entities.track,
-    handle = _tokens$entities.handle,
-    dot = _tokens$entities.dot;
+  track = _tokens$entities.track,
+  handle = _tokens$entities.handle,
+  dot = _tokens$entities.dot;
 var fakeTrackBg = css(["background-image:url(\"data:image/svg+xml,<svg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'><rect x='0' y='11' fill='", "' width='100%' height='4' rx='2' /></svg>\");background-size:cover;background-repeat:no-repeat;"], track.background);
 var fakeTrackBgHover = css({
   backgroundImage: "url(\"data:image/svg+xml,<svg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'><rect x='0' y='11' fill='".concat(track.states.hover.background, "' width='100%' height='4' rx='2' /></svg>\")")
@@ -70,38 +70,34 @@ var SrOnlyLabel = styled.label.withConfig({
 })(["position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;"]);
 var Slider = /*#__PURE__*/forwardRef(function Slider(_ref10, ref) {
   var _ref10$min = _ref10.min,
-      min = _ref10$min === void 0 ? 0 : _ref10$min,
-      _ref10$max = _ref10.max,
-      max = _ref10$max === void 0 ? 100 : _ref10$max,
-      _ref10$value = _ref10.value,
-      value = _ref10$value === void 0 ? [40, 60] : _ref10$value,
-      outputFunction = _ref10.outputFunction,
-      onChange = _ref10.onChange,
-      onChangeCommitted = _ref10.onChangeCommitted,
-      _ref10$minMaxDots = _ref10.minMaxDots,
-      minMaxDots = _ref10$minMaxDots === void 0 ? true : _ref10$minMaxDots,
-      _ref10$minMaxValues = _ref10.minMaxValues,
-      minMaxValues = _ref10$minMaxValues === void 0 ? true : _ref10$minMaxValues,
-      _ref10$step = _ref10.step,
-      step = _ref10$step === void 0 ? 1 : _ref10$step,
-      disabled = _ref10.disabled,
-      ariaLabelledby = _ref10.ariaLabelledby,
-      ariaLabelledbyNative = _ref10['aria-labelledby'],
-      rest = _objectWithoutProperties(_ref10, _excluded);
-
+    min = _ref10$min === void 0 ? 0 : _ref10$min,
+    _ref10$max = _ref10.max,
+    max = _ref10$max === void 0 ? 100 : _ref10$max,
+    _ref10$value = _ref10.value,
+    value = _ref10$value === void 0 ? [40, 60] : _ref10$value,
+    outputFunction = _ref10.outputFunction,
+    onChange = _ref10.onChange,
+    onChangeCommitted = _ref10.onChangeCommitted,
+    _ref10$minMaxDots = _ref10.minMaxDots,
+    minMaxDots = _ref10$minMaxDots === void 0 ? true : _ref10$minMaxDots,
+    _ref10$minMaxValues = _ref10.minMaxValues,
+    minMaxValues = _ref10$minMaxValues === void 0 ? true : _ref10$minMaxValues,
+    _ref10$step = _ref10.step,
+    step = _ref10$step === void 0 ? 1 : _ref10$step,
+    disabled = _ref10.disabled,
+    ariaLabelledby = _ref10.ariaLabelledby,
+    ariaLabelledbyNative = _ref10['aria-labelledby'],
+    rest = _objectWithoutProperties(_ref10, _excluded);
   var isRangeSlider = Array.isArray(value);
   var parsedValue = isRangeSlider ? value : [value];
-
   var _useState = useState(parsedValue),
-      _useState2 = _slicedToArray(_useState, 2),
-      initalValue = _useState2[0],
-      setInitalValue = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    initalValue = _useState2[0],
+    setInitalValue = _useState2[1];
   var _useState3 = useState(parsedValue),
-      _useState4 = _slicedToArray(_useState3, 2),
-      sliderValue = _useState4[0],
-      setSliderValue = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    sliderValue = _useState4[0],
+    setSliderValue = _useState4[1];
   useEffect(function () {
     if (isRangeSlider) {
       if (value[0] !== initalValue[0] || value[1] !== initalValue[1]) {
@@ -117,55 +113,42 @@ var Slider = /*#__PURE__*/forwardRef(function Slider(_ref10, ref) {
   }, [value, initalValue, isRangeSlider]);
   var minRange = useRef(null);
   var maxRange = useRef(null);
-
   var onValueChange = function onValueChange(event, valueArrIdx) {
     var changedValue = parseFloat(event.target.value);
-
     if (isRangeSlider) {
       var _newValue = sliderValue.slice();
-
       _newValue[valueArrIdx] = changedValue;
       setSliderValue(_newValue);
-
       if (onChange) {
         // Callback for provided onChange func
         onChange(event, _newValue);
       }
-
       return;
     }
-
     setSliderValue([changedValue]);
-
     if (onChange) {
       // Callback for provided onChange func
       onChange(event, [changedValue]);
     }
   };
-
   var handleKeyUp = function handleKeyUp(event) {
     if (event.key === 'ArrowLeft' || event.key === 'ArrowRight') {
       handleCommitedValue(event);
     }
   };
-
   var handleCommitedValue = function handleCommitedValue(event) {
     if (onChangeCommitted) {
       onChangeCommitted(event, sliderValue);
     }
   };
-
   var getFormattedText = function getFormattedText(text) {
     return outputFunction ? outputFunction(text) : text;
   };
-
   var findClosestRange = function findClosestRange(event) {
     var target = event.target;
-
     if (target.type === 'output') {
       return;
     }
-
     var bounds = target.getBoundingClientRect();
     var x = event.clientX - bounds.left;
     var inputWidth = minRange.current.offsetWidth;
@@ -175,7 +158,6 @@ var Slider = /*#__PURE__*/forwardRef(function Slider(_ref10, ref) {
     var normX = x / inputWidth * diff + min;
     var maxX = Math.abs(normX - parseFloat(maxValue));
     var minX = Math.abs(normX - parseFloat(minValue));
-
     if (minX > maxX) {
       minRange.current.style.zIndex = '10';
       maxRange.current.style.zIndex = '20';
@@ -184,18 +166,15 @@ var Slider = /*#__PURE__*/forwardRef(function Slider(_ref10, ref) {
       maxRange.current.style.zIndex = '10';
     }
   };
-
   var inputIdA = useId(null, 'inputA');
   var inputIdB = useId(null, 'inputB');
   var inputId = useId(null, 'thumb');
-
   if (rest['id']) {
     var overrideId = rest['id'];
     inputIdA = "".concat(overrideId, "-thumb-a");
     inputIdB = "".concat(overrideId, "-thumb-b");
     inputId = "".concat(overrideId, "-thumb");
   }
-
   var getAriaLabelledby = useCallback(function () {
     if (ariaLabelledbyNative) return ariaLabelledbyNative;
     if (ariaLabelledby) return ariaLabelledby;

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

@@ -2,20 +2,20 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import { tokens } from '@equinor/eds-tokens';
 
 var _tokens$colors = tokens.colors,
-    _tokens$colors$ui = _tokens$colors.ui,
-    backgroundColor = _tokens$colors$ui.background__light.rgba,
-    backgroundColorDefault = _tokens$colors$ui.background__default.rgba,
-    backgroundColorMedium = _tokens$colors$ui.background__medium.rgba,
-    _tokens$colors$intera = _tokens$colors.interactive,
-    indicatorColor = _tokens$colors$intera.primary__resting.rgba,
-    primaryHoverAlt = _tokens$colors$intera.primary__hover_alt.rgba,
-    primaryHover = _tokens$colors$intera.primary__hover.rgba,
-    focusOutlineColor = _tokens$colors$intera.focus.rgba,
-    backgroundColorDisabled = _tokens$colors$intera.disabled__fill.rgba,
-    backgroundBorderDisabled = _tokens$colors$intera.disabled__border.rgba,
-    textColor = _tokens$colors.text.static_icons__tertiary.rgba,
-    paragraph = tokens.typography.paragraph,
-    focusOutlineWidth = tokens.interactions.focused.width;
+  _tokens$colors$ui = _tokens$colors.ui,
+  backgroundColor = _tokens$colors$ui.background__light.rgba,
+  backgroundColorDefault = _tokens$colors$ui.background__default.rgba,
+  backgroundColorMedium = _tokens$colors$ui.background__medium.rgba,
+  _tokens$colors$intera = _tokens$colors.interactive,
+  indicatorColor = _tokens$colors$intera.primary__resting.rgba,
+  primaryHoverAlt = _tokens$colors$intera.primary__hover_alt.rgba,
+  primaryHover = _tokens$colors$intera.primary__hover.rgba,
+  focusOutlineColor = _tokens$colors$intera.focus.rgba,
+  backgroundColorDisabled = _tokens$colors$intera.disabled__fill.rgba,
+  backgroundBorderDisabled = _tokens$colors$intera.disabled__border.rgba,
+  textColor = _tokens$colors.text.static_icons__tertiary.rgba,
+  paragraph = tokens.typography.paragraph,
+  focusOutlineWidth = tokens.interactions.focused.width;
 var slider = {
   background: backgroundColorDefault,
   entities: {

package/dist/esm/components/Slider/SliderInput.js

@@ -8,7 +8,7 @@ import { jsx } from 'react/jsx-runtime';
 
 var _excluded = ["value", "min", "max", "id", "step", "onChange", "onMouseUp", "onKeyUp", "disabled"];
 var handle = slider.entities.handle,
-    _disabled = slider.states.disabled;
+  _disabled = slider.states.disabled;
 var track = css(["width:100%;height:100%;cursor:pointer;background:none;"]);
 var thumb = css(["", " height:", ";width:", ";background:", ";cursor:pointer;position:relative;z-index:1;"], bordersTemplate(handle.border), handle.height, handle.width, handle.background);
 var thumbHover = css(["@media (hover:hover) and (pointer:fine){box-shadow:0px 0px 0px 6px ", ";border-color:", ";}"], handle.states.hover.background, handle.states.hover.border.color);
@@ -24,16 +24,15 @@ var StyledSliderInput = styled.input.attrs(function () {
 })(["&::-webkit-slider-runnable-track,&::-webkit-slider-thumb,&{-webkit-appearance:none;}::-moz-focus-outer{border:0;}width:100%;background:transparent;background:none;grid-column:1 / -1;grid-row:2;font:inherit;margin:0;z-index:2;outline:none;&[data-focus-visible-added]:focus{z-index:2;&::-webkit-slider-thumb{", ";}&::-moz-range-thumb{", ";}}&:focus-visible{z-index:2;&::-webkit-slider-thumb{", ";}&::-moz-range-thumb{", ";}}&:hover,&:active{&::-webkit-slider-thumb{", "}&::-moz-range-thumb{", "}}&:disabled{&::-webkit-slider-thumb{", "}&::-moz-range-thumb{", "}}&:disabled:hover,&:disabled:active{&::-webkit-slider-thumb{", "}&::-moz-range-thumb{", "}&::-webkit-slider-runnable-track{cursor:not-allowed;}&::-moz-range-track{cursor:not-allowed;}}&:before,&:after{}&:after{right:0;}&::-webkit-slider-thumb{", " margin-top:6px;}&::-moz-range-thumb{", " height:8px;width:8px;}&::-webkit-slider-runnable-track{", "}&::-moz-range-track{", "}"], outlineTemplate(handle.states.focus.outline), outlineTemplate(handle.states.focus.outline), outlineTemplate(handle.states.focus.outline), outlineTemplate(handle.states.focus.outline), thumbHover, thumbHover, thumbDisabled, thumbDisabled, thumbHoverAndDisabled, thumbHoverAndDisabled, thumb, thumb, track, track);
 var SliderInput = /*#__PURE__*/forwardRef(function SliderInput(_ref, ref) {
   var value = _ref.value,
-      min = _ref.min,
-      max = _ref.max,
-      id = _ref.id,
-      step = _ref.step,
-      _onChange = _ref.onChange,
-      _onMouseUp = _ref.onMouseUp,
-      _onKeyUp = _ref.onKeyUp,
-      disabled = _ref.disabled,
-      restProps = _objectWithoutProperties(_ref, _excluded);
-
+    min = _ref.min,
+    max = _ref.max,
+    id = _ref.id,
+    step = _ref.step,
+    _onChange = _ref.onChange,
+    _onMouseUp = _ref.onMouseUp,
+    _onKeyUp = _ref.onKeyUp,
+    disabled = _ref.disabled,
+    restProps = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/jsx(StyledSliderInput, _objectSpread(_objectSpread({}, restProps), {}, {
     value: value,
     ref: ref,

package/dist/esm/components/Snackbar/Snackbar.js

@@ -16,7 +16,7 @@ var StyledSnackbar = styled(Paper).withConfig({
   componentId: "sc-ac6no8-0"
 })(function (_ref) {
   var theme = _ref.theme,
-      placement = _ref.placement;
+    placement = _ref.placement;
   return css(["position:fixed;background-color:", ";", " ", " ", " min-height:", ";box-sizing:border-box;z-index:1400;", " a,button{color:", ";}"], theme.background, spacingsTemplate(theme.spacings), bordersTemplate(theme.border), typographyTemplate(theme.typography), theme.minHeight, {
     top: placement.includes('top') ? theme.spacings.top : placement === 'left' || placement === 'right' ? '50%' : undefined,
     bottom: placement.includes('bottom') ? theme.spacings.bottom : undefined,
@@ -27,26 +27,23 @@ var StyledSnackbar = styled(Paper).withConfig({
 });
 var Snackbar = /*#__PURE__*/forwardRef(function Snackbar(_ref2, ref) {
   var _ref2$open = _ref2.open,
-      open = _ref2$open === void 0 ? false : _ref2$open,
-      _ref2$autoHideDuratio = _ref2.autoHideDuration,
-      autoHideDuration = _ref2$autoHideDuratio === void 0 ? 7000 : _ref2$autoHideDuratio,
-      onClose = _ref2.onClose,
-      _ref2$placement = _ref2.placement,
-      placement = _ref2$placement === void 0 ? 'bottom' : _ref2$placement,
-      children = _ref2.children,
-      rest = _objectWithoutProperties(_ref2, _excluded);
-
+    open = _ref2$open === void 0 ? false : _ref2$open,
+    _ref2$autoHideDuratio = _ref2.autoHideDuration,
+    autoHideDuration = _ref2$autoHideDuratio === void 0 ? 7000 : _ref2$autoHideDuratio,
+    onClose = _ref2.onClose,
+    _ref2$placement = _ref2.placement,
+    placement = _ref2$placement === void 0 ? 'bottom' : _ref2$placement,
+    children = _ref2.children,
+    rest = _objectWithoutProperties(_ref2, _excluded);
   var _useState = useState(open),
-      _useState2 = _slicedToArray(_useState, 2),
-      visible = _useState2[0],
-      setVisible = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    visible = _useState2[0],
+    setVisible = _useState2[1];
   var timer = useRef();
   useEffect(function () {
     setVisible(open);
     timer.current = setTimeout(function () {
       setVisible(false);
-
       if (onClose) {
         onClose();
       }
@@ -55,15 +52,12 @@ var Snackbar = /*#__PURE__*/forwardRef(function Snackbar(_ref2, ref) {
       return clearTimeout(timer.current);
     };
   }, [open, autoHideDuration, setVisible, onClose]);
-
   var props = _objectSpread({
     ref: ref,
     placement: placement
   }, rest);
-
   var _useEds = useEds(),
-      density = _useEds.density;
-
+    density = _useEds.density;
   var token = useToken({
     density: density
   }, snackbar);

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

@@ -2,15 +2,15 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import { tokens } from '@equinor/eds-tokens';
 
 var typography = tokens.typography.ui.snackbar,
-    _tokens$colors = tokens.colors,
-    background = _tokens$colors.ui.background__overlay.rgba,
-    color = _tokens$colors.text.static_icons__primary_white.rgba,
-    buttonColor = _tokens$colors.interactive.link_in_snackbars.rgba,
-    _tokens$spacings$comf = tokens.spacings.comfortable,
-    spacingMedium = _tokens$spacings$comf.medium,
-    spacingXLarge = _tokens$spacings$comf.x_large,
-    clickbounds = tokens.clickbounds.default__base,
-    radius = tokens.shape.button.borderRadius;
+  _tokens$colors = tokens.colors,
+  background = _tokens$colors.ui.background__overlay.rgba,
+  color = _tokens$colors.text.static_icons__primary_white.rgba,
+  buttonColor = _tokens$colors.interactive.link_in_snackbars.rgba,
+  _tokens$spacings$comf = tokens.spacings.comfortable,
+  spacingMedium = _tokens$spacings$comf.medium,
+  spacingXLarge = _tokens$spacings$comf.x_large,
+  clickbounds = tokens.clickbounds.default__base,
+  radius = tokens.shape.button.borderRadius;
 var snackbar = {
   background: background,
   minHeight: clickbounds,

package/dist/esm/components/Snackbar/SnackbarAction.js

@@ -14,12 +14,10 @@ var StyledSnackbarAction = styled.div.withConfig({
 });
 var SnackbarAction = /*#__PURE__*/forwardRef(function SnackbarAction(_ref2, ref) {
   var children = _ref2.children,
-      rest = _objectWithoutProperties(_ref2, _excluded);
-
+    rest = _objectWithoutProperties(_ref2, _excluded);
   var props = _objectSpread(_objectSpread({}, rest), {}, {
     ref: ref
   });
-
   return /*#__PURE__*/jsx(StyledSnackbarAction, _objectSpread(_objectSpread({}, props), {}, {
     children: Children.only(children)
   }));

package/dist/esm/components/Switch/Switch.js

@@ -26,17 +26,15 @@ var Label = styled.span.withConfig({
 });
 var Switch = /*#__PURE__*/forwardRef(function Switch(_ref3, ref) {
   var _ref3$size = _ref3.size,
-      size = _ref3$size === void 0 ? 'default' : _ref3$size,
-      disabled = _ref3.disabled,
-      label = _ref3.label,
-      className = _ref3.className,
-      style = _ref3.style,
-      rest = _objectWithoutProperties(_ref3, _excluded);
-
+    size = _ref3$size === void 0 ? 'default' : _ref3$size,
+    disabled = _ref3.disabled,
+    label = _ref3.label,
+    className = _ref3.className,
+    style = _ref3.style,
+    rest = _objectWithoutProperties(_ref3, _excluded);
   var _useEds = useEds(),
-      density = _useEds.density; // TODO Temporary workaround untill we can deprecate "size" property (controlled by EdsProvider in the future)
-
-
+    density = _useEds.density;
+  // TODO Temporary workaround untill we can deprecate "size" property (controlled by EdsProvider in the future)
   var overrideDensity = size === 'small' ? 'compact' : density;
   var token = useToken({
     density: overrideDensity

package/dist/esm/components/Switch/Switch.styles.js

@@ -6,16 +6,15 @@ var BaseInputWrapper = styled.span.withConfig({
   componentId: "sc-x39lde-0"
 })(function (_ref) {
   var _clickbound$offset, _clickbound$offset2;
-
   var _ref$theme = _ref.theme,
-      clickbound = _ref$theme.clickbound,
-      width = _ref$theme.width,
-      height = _ref$theme.height;
+    clickbound = _ref$theme.clickbound,
+    width = _ref$theme.width,
+    height = _ref$theme.height;
   return css(["width:", ";height:", ";border-radius:50%;position:relative;grid-area:input;pointer-events:none;&::before{position:absolute;top:0;left:0;width:auto;min-height:auto;content:'';}&::after{position:absolute;top:-", ";left:-", ";width:", ";height:", ";content:'';}"], width, height, clickbound === null || clickbound === void 0 ? void 0 : (_clickbound$offset = clickbound.offset) === null || _clickbound$offset === void 0 ? void 0 : _clickbound$offset.top, clickbound === null || clickbound === void 0 ? void 0 : (_clickbound$offset2 = clickbound.offset) === null || _clickbound$offset2 === void 0 ? void 0 : _clickbound$offset2.left, clickbound === null || clickbound === void 0 ? void 0 : clickbound.width, clickbound === null || clickbound === void 0 ? void 0 : clickbound.height);
 });
 var BaseInput = 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
   };
@@ -24,7 +23,7 @@ var BaseInput = styled.input.attrs(function (_ref2) {
   componentId: "sc-x39lde-1"
 })(function (_ref3) {
   var disabled = _ref3.disabled,
-      theme = _ref3.theme;
+    theme = _ref3.theme;
   return css(["appearance:none;width:100%;height:100%;grid-area:input;margin:0;cursor:", ";&:focus{outline:none;}&[data-focus-visible-added]:focus + span{", "}&:focus-visible + span{", "}"], disabled ? 'not-allowed' : 'pointer', outlineTemplate(theme.states.focus.outline), outlineTemplate(theme.states.focus.outline));
 });
 var GridWrapper = styled.span.withConfig({

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

@@ -1,24 +1,24 @@
 import { tokens } from '@equinor/eds-tokens';
 
 var _tokens$colors = tokens.colors,
-    backgroundColorMedium = _tokens$colors.ui.background__medium.rgba,
-    _tokens$colors$intera = _tokens$colors.interactive,
-    primaryHoverAlt = _tokens$colors$intera.primary__hover_alt.rgba,
-    primaryHover = _tokens$colors$intera.primary__hover.rgba,
-    activeColor = _tokens$colors$intera.primary__selected_highlight.rgba,
-    primaryResting = _tokens$colors$intera.primary__resting.rgba,
-    backgroundDisabled = _tokens$colors$intera.disabled__fill.rgba,
-    focusOutlineColor = _tokens$colors$intera.focus.rgba,
-    iconInteractive = _tokens$colors$intera.icon_on_interactive_colors.rgba,
-    iconTertiary = _tokens$colors.text.static_icons__tertiary.rgba,
-    labelTypography = tokens.typography.navigation.menu_title,
-    clickbounds = tokens.clickbounds,
-    boxShadow = tokens.elevation.raised,
-    medium_small = tokens.spacings.comfortable.medium_small,
-    _tokens$shape = tokens.shape,
-    circle = _tokens$shape.circle,
-    compactIconButton = _tokens$shape._modes.compact.icon_button,
-    focusOutlineWidth = tokens.interactions.focused.width;
+  backgroundColorMedium = _tokens$colors.ui.background__medium.rgba,
+  _tokens$colors$intera = _tokens$colors.interactive,
+  primaryHoverAlt = _tokens$colors$intera.primary__hover_alt.rgba,
+  primaryHover = _tokens$colors$intera.primary__hover.rgba,
+  activeColor = _tokens$colors$intera.primary__selected_highlight.rgba,
+  primaryResting = _tokens$colors$intera.primary__resting.rgba,
+  backgroundDisabled = _tokens$colors$intera.disabled__fill.rgba,
+  focusOutlineColor = _tokens$colors$intera.focus.rgba,
+  iconInteractive = _tokens$colors$intera.icon_on_interactive_colors.rgba,
+  iconTertiary = _tokens$colors.text.static_icons__tertiary.rgba,
+  labelTypography = tokens.typography.navigation.menu_title,
+  clickbounds = tokens.clickbounds,
+  boxShadow = tokens.elevation.raised,
+  medium_small = tokens.spacings.comfortable.medium_small,
+  _tokens$shape = tokens.shape,
+  circle = _tokens$shape.circle,
+  compactIconButton = _tokens$shape._modes.compact.icon_button,
+  focusOutlineWidth = tokens.interactions.focused.width;
 var comfortable = {
   typography: labelTypography,
   height: circle.minHeight,

package/dist/esm/components/Switch/SwitchDefault.js

@@ -12,7 +12,7 @@ var Input = styled(BaseInput).withConfig({
   componentId: "sc-16ym5pn-0"
 })(function (_ref) {
   var disabled = _ref.disabled,
-      theme = _ref.theme;
+    theme = _ref.theme;
   return css(["&:checked + span > span{background-color:", ";}&:checked + span > span:last-child{transform:translate(105%,-50%);background-color:", ";}&:hover + span{background-color:", ";}&:hover + span > span:last-child{background-color:", ";}"], disabled ? theme.states.disabled.background : theme.entities.track.states.active.background, disabled ? theme.states.disabled.background : theme.entities.handle.states.active.background, disabled ? 'transparent' : theme.states.hover.background, disabled ? theme.states.disabled.background : theme.states.hover.entities.handle.background);
 });
 var Track = styled.span.withConfig({
@@ -20,9 +20,9 @@ var Track = styled.span.withConfig({
   componentId: "sc-16ym5pn-1"
 })(function (_ref2) {
   var isDisabled = _ref2.isDisabled,
-      _ref2$theme = _ref2.theme,
-      states = _ref2$theme.states,
-      track = _ref2$theme.entities.track;
+    _ref2$theme = _ref2.theme,
+    states = _ref2$theme.states,
+    track = _ref2$theme.entities.track;
   return css(["", " border:none;width:", ";height:", ";background-color:", ";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);transition:background 0.36s;", ""], bordersTemplate(track.border), track.width, track.height, track.background, isDisabled && {
     backgroundColor: states.disabled.background
   });
@@ -32,19 +32,18 @@ var Handle = styled.span.withConfig({
   componentId: "sc-16ym5pn-2"
 })(function (_ref3) {
   var isDisabled = _ref3.isDisabled,
-      _ref3$theme = _ref3.theme,
-      states = _ref3$theme.states,
-      handle = _ref3$theme.entities.handle;
+    _ref3$theme = _ref3.theme,
+    states = _ref3$theme.states,
+    handle = _ref3$theme.entities.handle;
   return css(["background-color:", ";", " box-shadow:", ";width:", ";height:", ";border-radius:50%;display:inline-block;position:absolute;top:50%;transform:translate(0,-50%);left:4px;transition:transform 0.36s cubic-bezier(0.78,0.14,0.15,0.86);"], handle.background, isDisabled && {
     backgroundColor: states.disabled.background
   }, handle.boxShadow, handle.width, handle.height);
 });
 var SwitchDefault = /*#__PURE__*/forwardRef(function SwitchDefault(_ref4, ref) {
   var disabled = _ref4.disabled,
-      className = _ref4.className,
-      style = _ref4.style,
-      rest = _objectWithoutProperties(_ref4, _excluded);
-
+    className = _ref4.className,
+    style = _ref4.style,
+    rest = _objectWithoutProperties(_ref4, _excluded);
   return /*#__PURE__*/jsxs(GridWrapper, {
     className: className,
     style: style,

package/dist/esm/components/Switch/SwitchSmall.js

@@ -12,11 +12,11 @@ var Input = styled(BaseInput).withConfig({
   componentId: "sc-1a99mis-0"
 })(function (_ref) {
   var disabled = _ref.disabled,
-      _ref$theme = _ref.theme,
-      states = _ref$theme.states,
-      _ref$theme$entities = _ref$theme.entities,
-      handle = _ref$theme$entities.handle,
-      track = _ref$theme$entities.track;
+    _ref$theme = _ref.theme,
+    states = _ref$theme.states,
+    _ref$theme$entities = _ref$theme.entities,
+    handle = _ref$theme$entities.handle,
+    track = _ref$theme$entities.track;
   return css(["&[data-focus-visible-added]:focus + span{", "}&:focus-visible + span{", "}&:checked + span > span{background-color:", ";}&:checked + span > span:last-child{transform:translate(180%,-50%);background-color:", ";}@media (hover:hover) and (pointer:fine){&:hover + span{background-color:", ";}}"], outlineTemplate(states.focus.outline), outlineTemplate(states.focus.outline), disabled ? states.disabled.background : track.states.active.background, handle.background, disabled ? 'transparent' : states.hover.background);
 });
 var Track = styled.span.withConfig({
@@ -24,9 +24,9 @@ var Track = styled.span.withConfig({
   componentId: "sc-1a99mis-1"
 })(function (_ref2) {
   var isDisabled = _ref2.isDisabled,
-      _ref2$theme = _ref2.theme,
-      states = _ref2$theme.states,
-      track = _ref2$theme.entities.track;
+    _ref2$theme = _ref2.theme,
+    states = _ref2$theme.states,
+    track = _ref2$theme.entities.track;
   return css(["width:", ";height:", ";border-radius:10px;border:none;background-color:", ";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);"], track.width, track.height, isDisabled ? states.disabled.background : track.states.disabled.background);
 });
 var Handle = styled.span.withConfig({
@@ -38,10 +38,9 @@ var Handle = styled.span.withConfig({
 });
 var SwitchSmall = /*#__PURE__*/forwardRef(function SwitchSmall(_ref4, ref) {
   var disabled = _ref4.disabled,
-      className = _ref4.className,
-      style = _ref4.style,
-      rest = _objectWithoutProperties(_ref4, _excluded);
-
+    className = _ref4.className,
+    style = _ref4.style,
+    rest = _objectWithoutProperties(_ref4, _excluded);
   return /*#__PURE__*/jsxs(GridWrapper, {
     className: className,
     style: style,