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

package/dist/esm/components/Accordion/Accordion.js

@@ -10,18 +10,15 @@ import { useEds } from '../EdsProvider/eds.context.js';
 var _excluded = ["headerLevel", "chevronPosition", "children", "id"];
 var Accordion = /*#__PURE__*/forwardRef(function Accordion(_ref, ref) {
   var _ref$headerLevel = _ref.headerLevel,
-      headerLevel = _ref$headerLevel === void 0 ? 'h2' : _ref$headerLevel,
-      _ref$chevronPosition = _ref.chevronPosition,
-      chevronPosition = _ref$chevronPosition === void 0 ? 'left' : _ref$chevronPosition,
-      children = _ref.children,
-      id = _ref.id,
-      props = _objectWithoutProperties(_ref, _excluded);
-
+    headerLevel = _ref$headerLevel === void 0 ? 'h2' : _ref$headerLevel,
+    _ref$chevronPosition = _ref.chevronPosition,
+    chevronPosition = _ref$chevronPosition === void 0 ? 'left' : _ref$chevronPosition,
+    children = _ref.children,
+    id = _ref.id,
+    props = _objectWithoutProperties(_ref, _excluded);
   var accordionId = useId(id, 'accordion');
-
   var _useEds = useEds(),
-      density = _useEds.density;
-
+    density = _useEds.density;
   var token = useToken({
     density: density
   }, accordion);
@@ -41,6 +38,6 @@ var Accordion = /*#__PURE__*/forwardRef(function Accordion(_ref, ref) {
       children: AccordionItems
     }))
   });
-}); // Accordion.displayName = 'Accordion'
+});
 
 export { Accordion };

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

@@ -2,20 +2,20 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import { tokens } from '@equinor/eds-tokens';
 
 var typography = tokens.typography.ui.accordion_header,
-    _tokens$colors = tokens.colors,
-    _tokens$colors$ui = _tokens$colors.ui,
-    backgroundDefault = _tokens$colors$ui.background__default.rgba,
-    borderColor = _tokens$colors$ui.background__medium.rgba,
-    backgroundHover = _tokens$colors$ui.background__light.rgba,
-    _tokens$colors$intera = _tokens$colors.interactive,
-    activatedColor = _tokens$colors$intera.primary__resting.rgba,
-    disabledIconColor = _tokens$colors$intera.disabled__fill.rgba,
-    disabledColor = _tokens$colors$intera.disabled__text.rgba,
-    focusOutlineColor = _tokens$colors$intera.focus.rgba,
-    defaultIconColor = _tokens$colors.text.static_icons__default.rgba,
-    mediumSpacing = tokens.spacings.comfortable.medium,
-    focusOutlineWidth = tokens.interactions.focused.width,
-    text = tokens.typography.input.text;
+  _tokens$colors = tokens.colors,
+  _tokens$colors$ui = _tokens$colors.ui,
+  backgroundDefault = _tokens$colors$ui.background__default.rgba,
+  borderColor = _tokens$colors$ui.background__medium.rgba,
+  backgroundHover = _tokens$colors$ui.background__light.rgba,
+  _tokens$colors$intera = _tokens$colors.interactive,
+  activatedColor = _tokens$colors$intera.primary__resting.rgba,
+  disabledIconColor = _tokens$colors$intera.disabled__fill.rgba,
+  disabledColor = _tokens$colors$intera.disabled__text.rgba,
+  focusOutlineColor = _tokens$colors$intera.focus.rgba,
+  defaultIconColor = _tokens$colors.text.static_icons__default.rgba,
+  mediumSpacing = tokens.spacings.comfortable.medium,
+  focusOutlineWidth = tokens.interactions.focused.width,
+  text = tokens.typography.input.text;
 var accordion = {
   border: {
     type: 'border',

package/dist/esm/components/Accordion/AccordionHeader.js

@@ -17,10 +17,10 @@ var StyledAccordionHeader = styled.div.withConfig({
   componentId: "sc-cu2e95-0"
 })(function (_ref) {
   var theme = _ref.theme,
-      disabled = _ref.disabled,
-      parentIndex = _ref.parentIndex;
+    disabled = _ref.disabled,
+    parentIndex = _ref.parentIndex;
   var header = theme.entities.header,
-      border = theme.border;
+    border = theme.border;
   return css(["margin:0;padding:0;height:", ";box-sizing:border-box;display:flex;flex-wrap:nowrap;justify-content:space-between;background-color:", ";", " border-top:", ";", ""], header.height, header.background, bordersTemplate(border), parentIndex === 0 ? null : 'none', disabled ? css({
     color: header.states.disabled.typography.color,
     cursor: 'not-allowed'
@@ -36,8 +36,8 @@ var StyledAccordionHeader = styled.div.withConfig({
 });
 var StyledAccordionHeaderButton = styled.button.attrs(function (_ref2) {
   var panelId = _ref2.panelId,
-      isExpanded = _ref2.isExpanded,
-      disabled = _ref2.disabled;
+    isExpanded = _ref2.isExpanded,
+    disabled = _ref2.disabled;
   return {
     'aria-expanded': isExpanded,
     'aria-controls': panelId,
@@ -50,10 +50,10 @@ var StyledAccordionHeaderButton = styled.button.attrs(function (_ref2) {
   componentId: "sc-cu2e95-1"
 })(function (_ref3) {
   var theme = _ref3.theme,
-      disabled = _ref3.disabled;
+    disabled = _ref3.disabled;
   var _theme$entities = theme.entities,
-      header = _theme$entities.header,
-      iconToken = _theme$entities.icon;
+    header = _theme$entities.header,
+    iconToken = _theme$entities.icon;
   return css(["", " ", " &[data-focus-visible-added]:focus{", "}&:focus-visible{", "}border:0;background-color:transparent;margin:0;display:flex;align-items:center;flex-grow:1;", " > svg{color:", ";}"], typographyTemplate(header.typography), spacingsTemplate(header.spacings), outlineTemplate(header.states.focus.outline), outlineTemplate(header.states.focus.outline), disabled ? css({
     color: header.states.disabled.typography.color,
     cursor: 'not-allowed'
@@ -75,54 +75,45 @@ var StyledIcon = styled(Icon).withConfig({
 });
 var AccordionHeader = /*#__PURE__*/forwardRef(function AccordionHeader(_ref5, ref) {
   var parentIndex = _ref5.parentIndex,
-      headerLevel = _ref5.headerLevel,
-      chevronPosition = _ref5.chevronPosition,
-      panelId = _ref5.panelId,
-      id = _ref5.id,
-      _ref5$isExpanded = _ref5.isExpanded,
-      isExpanded = _ref5$isExpanded === void 0 ? false : _ref5$isExpanded,
-      children = _ref5.children,
-      toggleExpanded = _ref5.toggleExpanded,
-      disabled = _ref5.disabled,
-      className = _ref5.className,
-      style = _ref5.style,
-      props = _objectWithoutProperties(_ref5, _excluded);
-
+    headerLevel = _ref5.headerLevel,
+    chevronPosition = _ref5.chevronPosition,
+    panelId = _ref5.panelId,
+    id = _ref5.id,
+    _ref5$isExpanded = _ref5.isExpanded,
+    isExpanded = _ref5$isExpanded === void 0 ? false : _ref5$isExpanded,
+    children = _ref5.children,
+    toggleExpanded = _ref5.toggleExpanded,
+    disabled = _ref5.disabled,
+    className = _ref5.className,
+    style = _ref5.style,
+    props = _objectWithoutProperties(_ref5, _excluded);
   var handleClick = function handleClick(e) {
     e.preventDefault();
     e.stopPropagation();
-
     if (!disabled) {
       toggleExpanded();
-
       if (props.onToggle) {
         props.onToggle();
       }
     }
   };
-
   var handleKeyDown = function handleKeyDown(e) {
     var key = e.key;
-
     if (key === 'Enter' || key === ' ') {
       toggleExpanded();
-
       if (props.onToggle) {
         props.onToggle();
       }
-
       e.preventDefault();
       e.stopPropagation();
     }
   };
-
   var chevron = /*#__PURE__*/jsx(StyledIcon, {
     data: isExpanded ? chevron_up : chevron_down,
     size: 24,
     chevronPosition: chevronPosition,
     color: disabled ? chevronToken.states.disabled.background : chevronToken.background
   }, "".concat(id, "-icon"));
-
   var headerChildren = Children.map(children, function (child) {
     if (typeof child === 'string') {
       return /*#__PURE__*/jsx(AccordionHeaderTitle, {
@@ -131,18 +122,15 @@ var AccordionHeader = /*#__PURE__*/forwardRef(function AccordionHeader(_ref5, re
         children: child
       });
     }
-
     if ( /*#__PURE__*/isValidElement(child) && child.type === AccordionHeaderTitle) {
       return /*#__PURE__*/cloneElement(child, {
         isExpanded: isExpanded,
         disabled: disabled
       });
     }
-
     if (child.type === AccordionHeaderActions) {
       return;
     }
-
     return child;
   });
   var headerActions = Children.map(children, function (child) {

package/dist/esm/components/Accordion/AccordionHeaderActions.js

@@ -10,10 +10,9 @@ var StyledAccordionHeaderActions = styled.span.withConfig({
   componentId: "sc-klu9el-0"
 })(function (_ref) {
   var _header$states$active;
-
   var theme = _ref.theme,
-      isExpanded = _ref.isExpanded,
-      disabled = _ref.disabled;
+    isExpanded = _ref.isExpanded,
+    disabled = _ref.disabled;
   var header = theme.entities.header;
   return css(["display:flex;align-items:center;justify-content:flex-end;padding-right:", ";", " color:", ";"], header.spacings.right, disabled ? css({
     color: header.states.disabled.typography.color,
@@ -25,10 +24,9 @@ var StyledAccordionHeaderActions = styled.span.withConfig({
 });
 var AccordionHeaderActions = /*#__PURE__*/forwardRef(function AccordionHeaderActions(_ref2, ref) {
   var isExpanded = _ref2.isExpanded,
-      disabled = _ref2.disabled,
-      children = _ref2.children,
-      rest = _objectWithoutProperties(_ref2, _excluded);
-
+    disabled = _ref2.disabled,
+    children = _ref2.children,
+    rest = _objectWithoutProperties(_ref2, _excluded);
   return /*#__PURE__*/jsx(StyledAccordionHeaderActions, _objectSpread(_objectSpread({
     ref: ref,
     isExpanded: isExpanded,

package/dist/esm/components/Accordion/AccordionHeaderTitle.js

@@ -10,19 +10,17 @@ var StyledAccordionHeaderTitle = styled.span.withConfig({
   componentId: "sc-g27uve-0"
 })(function (_ref) {
   var _header$states$active;
-
   var theme = _ref.theme,
-      isExpanded = _ref.isExpanded,
-      disabled = _ref.disabled;
+    isExpanded = _ref.isExpanded,
+    disabled = _ref.disabled;
   var header = theme.entities.header;
   return css(["display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;flex-grow:1;overflow:hidden;text-align:left;color:", ";"], isExpanded && !disabled ? (_header$states$active = header.states.active.typography) === null || _header$states$active === void 0 ? void 0 : _header$states$active.color : 'inherit');
 });
 var AccordionHeaderTitle = /*#__PURE__*/forwardRef(function AccordionHeaderTitle(_ref2, ref) {
   var isExpanded = _ref2.isExpanded,
-      disabled = _ref2.disabled,
-      children = _ref2.children,
-      rest = _objectWithoutProperties(_ref2, _excluded);
-
+    disabled = _ref2.disabled,
+    children = _ref2.children,
+    rest = _objectWithoutProperties(_ref2, _excluded);
   return /*#__PURE__*/jsx(StyledAccordionHeaderTitle, _objectSpread(_objectSpread({
     ref: ref,
     isExpanded: isExpanded,
@@ -30,6 +28,6 @@ var AccordionHeaderTitle = /*#__PURE__*/forwardRef(function AccordionHeaderTitle
   }, rest), {}, {
     children: children
   }));
-}); // AccordionHeaderTitle.displayName = 'AccordionHeaderTitle'
+});
 
 export { AccordionHeaderTitle };

package/dist/esm/components/Accordion/AccordionItem.js

@@ -7,24 +7,21 @@ import { jsx } from 'react/jsx-runtime';
 var _excluded = ["headerLevel", "chevronPosition", "index", "accordionId", "isExpanded", "children", "disabled"];
 var AccordionItem = /*#__PURE__*/forwardRef(function AccordionItem(_ref, ref) {
   var headerLevel = _ref.headerLevel,
-      chevronPosition = _ref.chevronPosition,
-      _ref$index = _ref.index,
-      index = _ref$index === void 0 ? 0 : _ref$index,
-      accordionId = _ref.accordionId,
-      isExpanded = _ref.isExpanded,
-      children = _ref.children,
-      disabled = _ref.disabled,
-      props = _objectWithoutProperties(_ref, _excluded);
-
+    chevronPosition = _ref.chevronPosition,
+    _ref$index = _ref.index,
+    index = _ref$index === void 0 ? 0 : _ref$index,
+    accordionId = _ref.accordionId,
+    isExpanded = _ref.isExpanded,
+    children = _ref.children,
+    disabled = _ref.disabled,
+    props = _objectWithoutProperties(_ref, _excluded);
   var _useState = useState(isExpanded),
-      _useState2 = _slicedToArray(_useState, 2),
-      expanded = _useState2[0],
-      setExpanded = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    expanded = _useState2[0],
+    setExpanded = _useState2[1];
   var toggleExpanded = function toggleExpanded() {
     setExpanded(!expanded);
   };
-
   var Children$1 = Children.map(children, function (child, childIndex) {
     var headerId = "".concat(accordionId, "-header-").concat(index + 1);
     var panelId = "".concat(accordionId, "-panel-").concat(index + 1);
@@ -50,6 +47,6 @@ var AccordionItem = /*#__PURE__*/forwardRef(function AccordionItem(_ref, ref) {
     ref: ref,
     children: Children$1
   }));
-}); // AccordionItem.displayName = 'AccordionItem'
+});
 
 export { AccordionItem };

package/dist/esm/components/Accordion/AccordionPanel.js

@@ -18,18 +18,17 @@ var StyledAccordionPanel = styled.div.attrs(function (_ref) {
 })(function (_ref2) {
   var theme = _ref2.theme;
   var _theme$entities = theme.entities,
-      header = _theme$entities.header,
-      panel = _theme$entities.panel,
-      border = theme.border;
+    header = _theme$entities.header,
+    panel = _theme$entities.panel,
+    border = theme.border;
   return css(["", " ", " ", " background:", ";min-height:96px;box-sizing:border-box;"], bordersTemplate(border), spacingsTemplate(panel.spacings), typographyTemplate(panel.typography), header.background);
 });
 var AccordionPanel = /*#__PURE__*/forwardRef(function AccordionPanel(_ref3, ref) {
   var id = _ref3.id,
-      headerId = _ref3.headerId,
-      hidden = _ref3.hidden,
-      children = _ref3.children,
-      props = _objectWithoutProperties(_ref3, _excluded);
-
+    headerId = _ref3.headerId,
+    hidden = _ref3.hidden,
+    children = _ref3.children,
+    props = _objectWithoutProperties(_ref3, _excluded);
   return /*#__PURE__*/jsx(StyledAccordionPanel, _objectSpread(_objectSpread({
     headerId: headerId,
     id: id,
@@ -38,6 +37,6 @@ var AccordionPanel = /*#__PURE__*/forwardRef(function AccordionPanel(_ref3, ref)
     ref: ref,
     children: children
   }));
-}); // AccordionPanel.displayName = 'eds-accordion-panel'
+});
 
 export { AccordionPanel };