import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Box } from '../box';
import { styled, useStyleConfig, vui } from '../core';
import { Icon } from '../icon';
import { T } from '../t';
import { cs } from '../utils';
import { iconDictionary, spacingDictionary } from './consts';
export const MessageBase = styled.divBox `
  transition-duration: fast;
`;
/** Displays a simple message text. */
export const Message = vui((props, ref) => {
    const { children, className, text, size = 'lg', variant = 'info', ...rest } = props;
    const styles = useStyleConfig('Message', props);
    return (_jsx(MessageBase, { className: cs('vui-message', className), ref: ref, ...styles, ...rest, children: _jsxs(Box, { children: [_jsx(Icon, { mr: `${spacingDictionary[size]}px`, name: iconDictionary[variant], size: styles.fontSize }), _jsx(T, { size: styles.fontSize, children: children ?? text })] }) }));
});
Message.displayName = 'Message';
export default Message;
//# sourceMappingURL=message.js.map