'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var React = require('react');
var clsx = require('clsx');
var componentsTheming = require('@wise/components-theming');
var jsxRuntime = require('react/jsx-runtime');

const SentimentSurface = /*#__PURE__*/React.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
  } = componentsTheming.useTheme();
  const classNames = clsx.clsx(closestBrandTheme, BASE_CLASS, `${BASE_CLASS}-${sentiment}-${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/
    jsxRuntime.jsx(Element, {
      ...sentimentProps,
      children: children
    })
  );
});
SentimentSurface.displayName = 'SentimentSurface';

exports.default = SentimentSurface;
//# sourceMappingURL=SentimentSurface.js.map
