import React from 'react';
import { StatusAlertFilledSmall, StatusWarningFilledSmall, } from '@wix/wix-ui-icons-common';
import Box from '../../Box';
import Tooltip from '../../Tooltip';
import { useIcons } from '../../WixDesignSystemIconThemeProvider';
import { st, classes } from './RowStatusCell.st.css.js';
const renderMessages = messages => {
    if (!messages?.length)
        return undefined;
    if (messages.length === 1)
        return messages[0];
    return (React.createElement("ul", { className: classes.messageList }, messages.map((line, i) => (React.createElement("li", { key: i }, line)))));
};
export const RowStatusCell = ({ status, messages }) => {
    const icons = useIcons('RowStatusCell', {
        StatusAlertFilledSmall,
        StatusWarningFilledSmall,
    });
    const resolvedStatus = status === 'warning' ? 'warning' : 'error';
    const Icon = resolvedStatus === 'warning'
        ? icons.StatusWarningFilledSmall
        : icons.StatusAlertFilledSmall;
    const message = renderMessages(messages);
    const iconElement = (React.createElement("span", { "data-hook": "row-status-indicator", "data-status": resolvedStatus, ...(message ? { tabIndex: 0 } : {}) },
        React.createElement(Icon, null)));
    return (React.createElement(Box, { className: st(classes.root, { status: resolvedStatus }), align: "center", verticalAlign: "middle" }, message ? (React.createElement(Tooltip, { content: message, appendTo: "window", maxWidth: 250 }, iconElement)) : (iconElement)));
};
//# sourceMappingURL=RowStatusCell.js.map