import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { forwardRef } from 'react';
import styled, { css } from 'styled-components';
import Flex from '../Flex';
import { useI18n } from '../../hooks';
import { defaultThemeProp } from '../../theme';
import Icon, { StyledIcon } from '../Icon';
const defaultIcons = {
    negative: 'face-sad',
    positive: 'face-happy',
    neutral: 'face-blank'
};
export const StyledSentiment = styled.div(props => {
    const { theme, variant } = props;
    return css `
    > ${StyledIcon} {
      color: ${theme.components.sentiment[variant].color};
    }
  `;
});
StyledSentiment.defaultProps = defaultThemeProp;
const Sentiment = forwardRef(function Sentiment(props, ref) {
    const t = useI18n();
    const defaultLabels = {
        negative: t('sentiment_negative'),
        positive: t('sentiment_positive'),
        neutral: t('sentiment_neutral')
    };
    const { 'aria-label': ariaLabel, variant, labelHidden = false, labels = {}, icons = {}, ...restProps } = props;
    return (_jsxs(Flex, { "aria-label": ariaLabel ?? labels[variant] ?? defaultLabels[variant], ref: ref, variant: variant, role: 'img', ...restProps, as: StyledSentiment, container: { gap: 1 }, children: [_jsx(Icon, { "aria-hidden": true, name: icons[variant] ?? defaultIcons[variant] }), !labelHidden && _jsx("span", { children: labels[variant] ?? defaultLabels[variant] })] }));
});
export default Sentiment;
//# sourceMappingURL=Sentiment.js.map