import { forwardRef } from 'react';
import { clsx } from 'clsx';
import { useTheme } from '@wise/components-theming';
import { jsx } from 'react/jsx-runtime';

const SentimentSurface = /*#__PURE__*/forwardRef(function SentimentSurface({
  as,
  sentiment,
  emphasis = 'base',
  hasBaseStyles = true,
  style,
  className,
  children,
  id,
  'data-testid': dataTestId,
  ...props
}, ref) {
  const Element = as ?? 'div';
  const BASE_CLASS = 'wds-sentiment-surface';
  const {
    className: closestBrandTheme,
    isScreenModeDark: isDark,
    theme
  } = useTheme();
  const getThemeBrightness = () => {
    const isForestGreen = theme.includes('forest-green');
    const isPlatform = theme.includes('platform');
    return isForestGreen || isDark && !isPlatform ? 'dark' : 'light';
  };
  const classNames = clsx(closestBrandTheme, BASE_CLASS, `wds-sentiment-${sentiment}-${getThemeBrightness()}-${emphasis}`, hasBaseStyles && `${BASE_CLASS}--hasBaseStyles`, className);
  const sentimentProps = {
    ref,
    id,
    'data-testid': dataTestId,
    className: classNames,
    style,
    ...props
  };
  return (
    /*#__PURE__*/
    // @ts-expect-error - Generic forwardRef limitation. See: https://fettblog.eu/typescript-react-generic-forward-refs/
    jsx(Element, {
      ...sentimentProps,
      children: children
    })
  );
});
SentimentSurface.displayName = 'SentimentSurface';

export { SentimentSurface as default };
//# sourceMappingURL=SentimentSurface.mjs.map
