@equinor/eds-core-react/dist/esm/components/Accordion/AccordionHeaderTitle.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 StyledAccordionHeaderTitle = styled.span.withConfig({
  displayName: "AccordionHeaderTitle__StyledAccordionHeaderTitle",
  componentId: "sc-g27uve-0"
})(({
  theme,
  $isExpanded,
  $disabled
}) => {
  const {
    entities: {
      header
    }
  } = theme;
  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.typography?.color : 'inherit');
});
const AccordionHeaderTitle = /*#__PURE__*/forwardRef(function AccordionHeaderTitle({
  isExpanded,
  disabled,
  children,
  ...rest
}, ref) {
  return /*#__PURE__*/jsx(StyledAccordionHeaderTitle, {
    ref: ref,
    $isExpanded: isExpanded,
    $disabled: disabled,
    ...rest,
    children: children
  });
});

export { AccordionHeaderTitle };