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

package/dist/esm/components/Search/Search.js

@@ -22,33 +22,27 @@ var InsideButton = styled(Button).withConfig({
 })(["height:24px;width:24px;"]);
 var Search = /*#__PURE__*/forwardRef(function Search(_ref, ref) {
   var _onChange = _ref.onChange,
-      style = _ref.style,
-      className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
+    style = _ref.style,
+    className = _ref.className,
+    rest = _objectWithoutProperties(_ref, _excluded);
   var inputRef = useRef(null);
-
   var _useState = useState(Boolean(rest.defaultValue)),
-      _useState2 = _slicedToArray(_useState, 2),
-      showClear = _useState2[0],
-      setShowClear = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    showClear = _useState2[0],
+    setShowClear = _useState2[1];
   useEffect(function () {
     if (rest.value) {
       setShowClear(Boolean(rest.value));
     }
   }, [rest.value]);
-
   var clearInputValue = function clearInputValue() {
     var input = inputRef.current;
     var clearedValue = '';
     setReactInputValue(input, clearedValue);
   };
-
   var handleOnChange = function handleOnChange(e) {
     setShowClear(Boolean(e.currentTarget.value));
   };
-
   var combinedRef = useMemo(function () {
     return mergeRefs(inputRef, ref);
   }, [inputRef, ref]);
@@ -59,7 +53,6 @@ var Search = /*#__PURE__*/forwardRef(function Search(_ref, ref) {
     children: /*#__PURE__*/jsx(SearchInput, _objectSpread({
       onChange: function onChange(e) {
         handleOnChange(e);
-
         if (_onChange) {
           _onChange(e);
         }

package/dist/esm/components/Select/NativeSelect/NativeSelect.js

@@ -22,21 +22,19 @@ var StyledSelect = styled.select.withConfig({
 }, nativeselect.entities.input.spacings.right, nativeselect.entities.icon.width, nativeselect.background, nativeselect.background, nativeselect.entities.input.spacings.right, outlineTemplate(nativeselect.states.focus.outline), nativeselect.states.disabled.typography.color, nativeselect.background, nativeselect.background);
 var NativeSelect = /*#__PURE__*/forwardRef(function NativeSelect(_ref2, ref) {
   var label = _ref2.label,
-      children = _ref2.children,
-      className = _ref2.className,
-      style = _ref2.style,
-      selectRef = _ref2.selectRef,
-      id = _ref2.id,
-      meta = _ref2.meta,
-      _ref2$disabled = _ref2.disabled,
-      disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
-      _ref2$multiple = _ref2.multiple,
-      multiple = _ref2$multiple === void 0 ? false : _ref2$multiple,
-      other = _objectWithoutProperties(_ref2, _excluded);
-
+    children = _ref2.children,
+    className = _ref2.className,
+    style = _ref2.style,
+    selectRef = _ref2.selectRef,
+    id = _ref2.id,
+    meta = _ref2.meta,
+    _ref2$disabled = _ref2.disabled,
+    disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
+    _ref2$multiple = _ref2.multiple,
+    multiple = _ref2$multiple === void 0 ? false : _ref2$multiple,
+    other = _objectWithoutProperties(_ref2, _excluded);
   var _useEds = useEds(),
-      density = _useEds.density;
-
+    density = _useEds.density;
   var token = useToken({
     density: density
   }, nativeselect);
@@ -45,14 +43,12 @@ var NativeSelect = /*#__PURE__*/forwardRef(function NativeSelect(_ref2, ref) {
     className: className,
     style: style
   };
-
   var selectProps = _objectSpread({
     ref: selectRef,
     id: id,
     disabled: disabled,
     multiple: multiple
   }, other);
-
   var labelProps = {
     htmlFor: id,
     label: label,

package/dist/esm/components/Select/NativeSelect/NativeSelect.tokens.js

@@ -2,11 +2,11 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import { tokens } from '@equinor/eds-tokens';
 
 var colors = tokens.colors,
-    _tokens$spacings$comf = tokens.spacings.comfortable,
-    small = _tokens$spacings$comf.small,
-    x_small = _tokens$spacings$comf.x_small,
-    typography = tokens.typography,
-    shape = tokens.shape;
+  _tokens$spacings$comf = tokens.spacings.comfortable,
+  small = _tokens$spacings$comf.small,
+  x_small = _tokens$spacings$comf.x_small,
+  typography = tokens.typography,
+  shape = tokens.shape;
 var nativeselect = {
   background: colors.ui.background__light.rgba,
   typography: _objectSpread(_objectSpread({}, typography.input.text), {}, {

package/dist/esm/components/SideBar/SideBar.context.js

@@ -10,14 +10,12 @@ var initalState = {
 var SideBarContext = /*#__PURE__*/createContext(initalState);
 var SideBarProvider = function SideBarProvider(_ref) {
   var children = _ref.children;
-
   var _useState = useState(initalState),
-      _useState2 = _slicedToArray(_useState, 2),
-      state = _useState2[0],
-      setState = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    state = _useState2[0],
+    setState = _useState2[1];
   var isOpen = state.isOpen,
-      onToggle = state.onToggle;
+    onToggle = state.onToggle;
   var setIsOpen = useCallback(function (open) {
     setState(function (prevState) {
       return _objectSpread(_objectSpread({}, prevState), {}, {
@@ -26,7 +24,6 @@ var SideBarProvider = function SideBarProvider(_ref) {
     });
     onToggle === null || onToggle === void 0 ? void 0 : onToggle(open);
   }, [onToggle]);
-
   var setOnToggle = function setOnToggle(onToggle) {
     setState(function (prevState) {
       return _objectSpread(_objectSpread({}, prevState), {}, {
@@ -34,7 +31,6 @@ var SideBarProvider = function SideBarProvider(_ref) {
       });
     });
   };
-
   var value = {
     setIsOpen: setIsOpen,
     setOnToggle: setOnToggle,

package/dist/esm/components/SideBar/SideBar.js

@@ -9,27 +9,26 @@ import { jsx } from 'react/jsx-runtime';
 import { useEds } from '../EdsProvider/eds.context.js';
 
 var _excluded = ["onToggle", "open", "children"],
-    _excluded2 = ["onToggle", "open", "children"];
+  _excluded2 = ["onToggle", "open", "children"];
 var SideBarContainer = /*#__PURE__*/forwardRef(function SideBarContainer(_ref, ref) {
   var onToggleCallback = _ref.onToggle,
-      _ref$open = _ref.open,
-      open = _ref$open === void 0 ? false : _ref$open,
-      children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
+    _ref$open = _ref.open,
+    open = _ref$open === void 0 ? false : _ref$open,
+    children = _ref.children,
+    rest = _objectWithoutProperties(_ref, _excluded);
   var _useSideBar = useSideBar(),
-      isOpen = _useSideBar.isOpen,
-      setIsOpen = _useSideBar.setIsOpen,
-      onToggle = _useSideBar.onToggle,
-      setOnToggle = _useSideBar.setOnToggle;
-
+    isOpen = _useSideBar.isOpen,
+    setIsOpen = _useSideBar.setIsOpen,
+    onToggle = _useSideBar.onToggle,
+    setOnToggle = _useSideBar.setOnToggle;
   useEffect(function () {
     if (onToggle === null && onToggleCallback) {
       setOnToggle(onToggleCallback);
     }
   }, [onToggle, onToggleCallback, setOnToggle]);
   useEffect(function () {
-    setIsOpen(open); // eslint-disable-next-line react-hooks/exhaustive-deps
+    setIsOpen(open);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [open]);
   return /*#__PURE__*/jsx(GridContainer, _objectSpread(_objectSpread({}, rest), {}, {
     open: isOpen,
@@ -42,29 +41,25 @@ var GridContainer = styled.div.withConfig({
   componentId: "sc-a84pkc-0"
 })(function (_ref2) {
   var theme = _ref2.theme,
-      open = _ref2.open;
+    open = _ref2.open;
   return css(["box-sizing:content-box;", " display:grid;grid-template-rows:1fr auto;height:100%;grid-template-areas:'content' 'footer';background-color:", ";overflow:hidden;width:", ";min-width:", ";"], bordersTemplate(theme.border), theme.background, open ? theme.maxWidth : theme.minWidth, open ? theme.maxWidth : theme.minWidth);
 });
 var SideBar = /*#__PURE__*/forwardRef(function (_ref3, ref) {
   var onToggle = _ref3.onToggle,
-      _ref3$open = _ref3.open,
-      open = _ref3$open === void 0 ? false : _ref3$open,
-      children = _ref3.children,
-      rest = _objectWithoutProperties(_ref3, _excluded2);
-
+    _ref3$open = _ref3.open,
+    open = _ref3$open === void 0 ? false : _ref3$open,
+    children = _ref3.children,
+    rest = _objectWithoutProperties(_ref3, _excluded2);
   var _useEds = useEds(),
-      density = _useEds.density;
-
+    density = _useEds.density;
   var token = useToken({
     density: density
   }, sidebar);
-
   var props = _objectSpread({
     onToggle: onToggle,
     open: open,
     children: children
   }, rest);
-
   return /*#__PURE__*/jsx(ThemeProvider, {
     theme: token,
     children: /*#__PURE__*/jsx(SideBarProvider, {

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

@@ -1,23 +1,23 @@
 import { tokens } from '@equinor/eds-tokens';
 
 var _tokens$colors = tokens.colors,
-    _tokens$colors$ui = _tokens$colors.ui,
-    background__light = _tokens$colors$ui.background__light.rgba,
-    background__medium = _tokens$colors$ui.background__medium.rgba,
-    background = _tokens$colors$ui.background__default.rgba,
-    _tokens$colors$intera = _tokens$colors.interactive,
-    focusColor = _tokens$colors$intera.focus.rgba,
-    primary__resting = _tokens$colors$intera.primary__resting.rgba,
-    menuActive = _tokens$colors$intera.primary__selected_highlight.rgba,
-    menuDisabledBackground = _tokens$colors$intera.disabled__fill.rgba,
-    menuDisabledText = _tokens$colors$intera.disabled__text.rgba,
-    _tokens$colors$text = _tokens$colors.text,
-    expandTextColor = _tokens$colors$text.static_icons__default.rgba,
-    primaryWhite = _tokens$colors$text.static_icons__primary_white.rgba,
-    _tokens$spacings$comf = tokens.spacings.comfortable,
-    medium = _tokens$spacings$comf.medium,
-    large = _tokens$spacings$comf.large,
-    small = _tokens$spacings$comf.small;
+  _tokens$colors$ui = _tokens$colors.ui,
+  background__light = _tokens$colors$ui.background__light.rgba,
+  background__medium = _tokens$colors$ui.background__medium.rgba,
+  background = _tokens$colors$ui.background__default.rgba,
+  _tokens$colors$intera = _tokens$colors.interactive,
+  focusColor = _tokens$colors$intera.focus.rgba,
+  primary__resting = _tokens$colors$intera.primary__resting.rgba,
+  menuActive = _tokens$colors$intera.primary__selected_highlight.rgba,
+  menuDisabledBackground = _tokens$colors$intera.disabled__fill.rgba,
+  menuDisabledText = _tokens$colors$intera.disabled__text.rgba,
+  _tokens$colors$text = _tokens$colors.text,
+  expandTextColor = _tokens$colors$text.static_icons__default.rgba,
+  primaryWhite = _tokens$colors$text.static_icons__primary_white.rgba,
+  _tokens$spacings$comf = tokens.spacings.comfortable,
+  medium = _tokens$spacings$comf.medium,
+  large = _tokens$spacings$comf.large,
+  small = _tokens$spacings$comf.small;
 var sidebar = {
   background: background,
   minWidth: '72px',

package/dist/esm/components/SideBar/SideBarButton/index.js

@@ -1,12 +1,12 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import { forwardRef } from 'react';
+import { Button } from '../../Button/index.js';
+import { Icon } from '../../Icon/index.js';
 import { sidebar } from '../SideBar.tokens.js';
 import { useSideBar } from '../SideBar.context.js';
 import styled, { css } from 'styled-components';
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { Button } from '../../Button/index.js';
-import { Icon } from '../../Icon/index.js';
 import { Tooltip } from '../../Tooltip/Tooltip.js';
 
 var _excluded = ["label", "icon", "style", "className"];
@@ -16,12 +16,12 @@ var MenuButtonContainer = styled.div.withConfig({
   componentId: "sc-15xlkyo-0"
 })(function (_ref) {
   var open = _ref.open,
-      theme = _ref.theme;
+    theme = _ref.theme;
   var _theme$entities$actio = theme.entities.actionButton.spacings,
-      right = _theme$entities$actio.right,
-      left = _theme$entities$actio.left,
-      top = _theme$entities$actio.top,
-      bottom = _theme$entities$actio.bottom;
+    right = _theme$entities$actio.right,
+    left = _theme$entities$actio.left,
+    top = _theme$entities$actio.top,
+    bottom = _theme$entities$actio.bottom;
   return css(["display:", ";grid-template-columns:", " 1fr ", ";justify-content:center;align-items:center;margin-block-start:", ";margin-block-end:", ";box-sizing:border-box;"], open ? 'grid' : 'flex', left, right, top, bottom);
 });
 var ExtendedButton = styled(Button).withConfig({
@@ -32,23 +32,19 @@ var ExtendedButton = styled(Button).withConfig({
 });
 var SideBarButton = /*#__PURE__*/forwardRef(function SideBarToggle(_ref2, ref) {
   var label = _ref2.label,
-      icon = _ref2.icon,
-      style = _ref2.style,
-      className = _ref2.className,
-      rest = _objectWithoutProperties(_ref2, _excluded);
-
+    icon = _ref2.icon,
+    style = _ref2.style,
+    className = _ref2.className,
+    rest = _objectWithoutProperties(_ref2, _excluded);
   var props = _objectSpread(_objectSpread({}, rest), {}, {
     ref: ref
   });
-
   var styleProps = {
     style: style,
     className: className
   };
-
   var _useSideBar = useSideBar(),
-      isOpen = _useSideBar.isOpen;
-
+    isOpen = _useSideBar.isOpen;
   if (isOpen) {
     return /*#__PURE__*/jsx(MenuButtonContainer, _objectSpread(_objectSpread({
       open: isOpen
@@ -64,7 +60,6 @@ var SideBarButton = /*#__PURE__*/forwardRef(function SideBarToggle(_ref2, ref) {
       }))
     }));
   }
-
   return /*#__PURE__*/jsx(Tooltip, {
     title: label,
     placement: "right",

package/dist/esm/components/SideBar/SideBarContent.js

@@ -13,12 +13,10 @@ var StyledSideBarContent = styled.div.withConfig({
 });
 var SideBarContent = /*#__PURE__*/forwardRef(function SideBarContent(_ref, ref) {
   var children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
+    rest = _objectWithoutProperties(_ref, _excluded);
   var props = _objectSpread({
     ref: ref
   }, rest);
-
   return /*#__PURE__*/jsx(StyledSideBarContent, _objectSpread(_objectSpread({}, props), {}, {
     children: children
   }));

package/dist/esm/components/SideBar/SideBarFooter.js

@@ -13,12 +13,10 @@ var StyledSideBarFooter = styled.div.withConfig({
 });
 var SideBarFooter = /*#__PURE__*/forwardRef(function SideBarFooter(_ref, ref) {
   var children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
+    rest = _objectWithoutProperties(_ref, _excluded);
   var props = _objectSpread({
     ref: ref
   }, rest);
-
   return /*#__PURE__*/jsx(StyledSideBarFooter, _objectSpread(_objectSpread({}, props), {}, {
     children: children
   }));

package/dist/esm/components/SideBar/SideBarToggle.js

@@ -1,14 +1,14 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _extends from '@babel/runtime/helpers/extends';
 import { forwardRef } from 'react';
+import { Button } from '../Button/index.js';
+import { Icon } from '../Icon/index.js';
 import { useSideBar } from './SideBar.context.js';
 import { sidebar } from './SideBar.tokens.js';
 import { collapse, expand } from '@equinor/eds-icons';
 import styled, { css } from 'styled-components';
 import { jsx } from 'react/jsx-runtime';
-import { Button } from '../Button/index.js';
 import { Tooltip } from '../Tooltip/Tooltip.js';
-import { Icon } from '../Icon/index.js';
 
 var iconColor = sidebar.entities.toggleOpen.typography.color;
 var ToggleContainer = styled.div.withConfig({
@@ -17,22 +17,19 @@ var ToggleContainer = styled.div.withConfig({
 })(function (_ref) {
   var theme = _ref.theme;
   var minWidth = theme.minWidth,
-      _theme$entities$toggl = theme.entities.toggleOpen.spacings,
-      top = _theme$entities$toggl.top,
-      bottom = _theme$entities$toggl.bottom;
+    _theme$entities$toggl = theme.entities.toggleOpen.spacings,
+    top = _theme$entities$toggl.top,
+    bottom = _theme$entities$toggl.bottom;
   return css(["width:", ";display:grid;place-items:center;margin-block-start:", ";margin-block-end:", ";"], minWidth, top, bottom);
 });
 var SideBarToggle = /*#__PURE__*/forwardRef(function SideBarToggle(_ref2, ref) {
   var rest = _extends({}, _ref2);
-
   var props = _objectSpread(_objectSpread({}, rest), {}, {
     ref: ref
   });
-
   var _useSideBar = useSideBar(),
-      isOpen = _useSideBar.isOpen,
-      setIsOpen = _useSideBar.setIsOpen;
-
+    isOpen = _useSideBar.isOpen,
+    setIsOpen = _useSideBar.setIsOpen;
   return /*#__PURE__*/jsx(ToggleContainer, _objectSpread(_objectSpread({
     open: isOpen
   }, props), {}, {

package/dist/esm/components/SideBar/SidebarLink/index.js

@@ -3,34 +3,34 @@ import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProper
 import { forwardRef } from 'react';
 import { sidebar } from '../SideBar.tokens.js';
 import { bordersTemplate, outlineTemplate } from '@equinor/eds-utils';
+import { Icon } from '../../Icon/index.js';
 import styled, { css } from 'styled-components';
 import { useSideBar } from '../SideBar.context.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { Icon } from '../../Icon/index.js';
 import { Typography } from '../../Typography/Typography.js';
 import { Tooltip as Tooltip$1 } from '../../Tooltip/Tooltip.js';
 
 var _excluded = ["icon", "label", "active", "onClick", "as"];
 var _tokens$entities$side = sidebar.entities.sidebarItem,
-    itemTextColor = _tokens$entities$side.typography.color,
-    iconActive = _tokens$entities$side.states.active.typography.color;
+  itemTextColor = _tokens$entities$side.typography.color,
+  iconActive = _tokens$entities$side.states.active.typography.color;
 var Container = styled.a.withConfig({
   displayName: "SidebarLink__Container",
   componentId: "sc-gbehcj-0"
 })(function (_ref) {
   var theme = _ref.theme,
-      $active = _ref.$active;
+    $active = _ref.$active;
   var minWidth = theme.minWidth,
-      _theme$entities$sideb = theme.entities.sidebarItem,
-      minHeight = _theme$entities$sideb.minHeight,
-      border = _theme$entities$sideb.border,
-      _theme$entities$sideb2 = _theme$entities$sideb.states,
-      menuActiveBackground = _theme$entities$sideb2.active.background,
-      menuHoverBackground = _theme$entities$sideb2.hover.background,
-      focus = _theme$entities$sideb2.focus,
-      _theme$entities$sideb3 = _theme$entities$sideb2.disabled,
-      menuDisabledBackground = _theme$entities$sideb3.background,
-      menuDisabledText = _theme$entities$sideb3.typography.color;
+    _theme$entities$sideb = theme.entities.sidebarItem,
+    minHeight = _theme$entities$sideb.minHeight,
+    border = _theme$entities$sideb.border,
+    _theme$entities$sideb2 = _theme$entities$sideb.states,
+    menuActiveBackground = _theme$entities$sideb2.active.background,
+    menuHoverBackground = _theme$entities$sideb2.hover.background,
+    focus = _theme$entities$sideb2.focus,
+    _theme$entities$sideb3 = _theme$entities$sideb2.disabled,
+    menuDisabledBackground = _theme$entities$sideb3.background,
+    menuDisabledText = _theme$entities$sideb3.typography.color;
   return css(["background-color:", ";display:grid;grid-template-columns:", " 1fr;place-items:center;", " text-decoration:none;min-height:", ";&:hover{cursor:pointer;background-color:", ";}&:disabled{background-color:", ";color:", ";}&:focus-visible{", ";}"], $active ? menuActiveBackground : 'none', minWidth, bordersTemplate(border), minHeight, $active ? menuActiveBackground : menuHoverBackground, menuDisabledBackground, menuDisabledText, outlineTemplate(focus.outline));
 });
 var ItemText = styled(Typography).withConfig({
@@ -38,10 +38,10 @@ var ItemText = styled(Typography).withConfig({
   componentId: "sc-gbehcj-1"
 })(function (_ref2) {
   var theme = _ref2.theme,
-      $active = _ref2.$active;
+    $active = _ref2.$active;
   var _theme$entities$sideb4 = theme.entities.sidebarItem,
-      itemTextColor = _theme$entities$sideb4.typography.color,
-      itemActiveTextColor = _theme$entities$sideb4.states.active.typography.color;
+    itemTextColor = _theme$entities$sideb4.typography.color,
+    itemActiveTextColor = _theme$entities$sideb4.states.active.typography.color;
   return css(["justify-self:start;color:", ";&::first-letter{text-transform:capitalize;}"], $active ? itemActiveTextColor : itemTextColor);
 });
 var Tooltip = styled(Tooltip$1).withConfig({
@@ -50,20 +50,17 @@ var Tooltip = styled(Tooltip$1).withConfig({
 })(["text-transform:capitalize;"]);
 var SidebarLink = /*#__PURE__*/forwardRef(function SidebarLink(_ref3, ref) {
   var icon = _ref3.icon,
-      label = _ref3.label,
-      active = _ref3.active,
-      onClick = _ref3.onClick,
-      _ref3$as = _ref3.as,
-      as = _ref3$as === void 0 ? 'a' : _ref3$as,
-      rest = _objectWithoutProperties(_ref3, _excluded);
-
+    label = _ref3.label,
+    active = _ref3.active,
+    onClick = _ref3.onClick,
+    _ref3$as = _ref3.as,
+    as = _ref3$as === void 0 ? 'a' : _ref3$as,
+    rest = _objectWithoutProperties(_ref3, _excluded);
   var _useSideBar = useSideBar(),
-      isOpen = _useSideBar.isOpen;
-
+    isOpen = _useSideBar.isOpen;
   var getIconColor = function getIconColor() {
     return active ? iconActive : itemTextColor;
   };
-
   if (isOpen) {
     return /*#__PURE__*/jsxs(Container, _objectSpread(_objectSpread({
       as: as,
@@ -83,7 +80,6 @@ var SidebarLink = /*#__PURE__*/forwardRef(function SidebarLink(_ref3, ref) {
       })]
     }));
   }
-
   return /*#__PURE__*/jsx(Tooltip, {
     title: label,
     placement: "right",

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,