@equinor/eds-core-react/dist/esm/components/Accordion/AccordionHeaderActions.js

The React implementation of the Equinor Design System

import { forwardRef } from 'react';
import styled, { css } from 'styled-components';
import { jsx } from 'react/jsx-runtime';

const StyledAccordionHeaderActions = styled.span.withConfig({
  displayName: "AccordionHeaderActions__StyledAccordionHeaderActions",
  componentId: "sc-klu9el-0"
})(({
  theme,
  $isExpanded,
  disabled
}) => {
  const {
    entities: {
      header
    }
  } = theme;
  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,
    cursor: 'not-allowed'
  }) : css({
    color: header.typography.color,
    cursor: 'pointer'
  }), $isExpanded && !disabled ? header.states.active.typography?.color : 'inherit');
});
const AccordionHeaderActions = /*#__PURE__*/forwardRef(function AccordionHeaderActions({
  isExpanded,
  disabled,
  children,
  ...rest
}, ref) {
  return /*#__PURE__*/jsx(StyledAccordionHeaderActions, {
    ref: ref,
    $isExpanded: isExpanded,
    disabled: disabled,
    ...rest,
    children: children
  });
});

export { AccordionHeaderActions };