var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx } from "react/jsx-runtime";
// ============================================================================
// Chatbot Main - Message - Content - Table
// ============================================================================
import { Children, cloneElement } from 'react';
import { Table } from '@patternfly/react-table';
import { css } from '@patternfly/react-styles';
const TableMessage = (_a) => {
    var _b;
    var { children, isPrimary, shouldRetainStyles } = _a, props = __rest(_a, ["children", "isPrimary", "shouldRetainStyles"]);
    const { className } = props, rest = __rest(props, ["className"]);
    // This allows us to parse the nested data we get back from the 3rd party Markdown parser
    // Open to feedback here if there is a better way to do this
    // This looks for ths and spits them all out so we can filter them later, looking for text values
    const findHeaders = (array) => {
        const headers = [];
        if (!array) {
            return headers;
        }
        const traverse = (items) => {
            for (const item of items) {
                if (item.tagName === 'th') {
                    headers.push(item);
                }
                if (item.children) {
                    traverse(item.children);
                }
            }
        };
        traverse(array);
        return headers;
    };
    const headers = findHeaders((_b = rest.node) === null || _b === void 0 ? void 0 : _b.children);
    const headerTextValues = headers.map((header) => { var _a, _b; return (_b = (_a = header === null || header === void 0 ? void 0 : header.children) === null || _a === void 0 ? void 0 : _a.filter((c) => (c === null || c === void 0 ? void 0 : c.type) === 'text')[0]) === null || _b === void 0 ? void 0 : _b.value; });
    // We are sending these header text values down to child tds by passing them through children, since mobile view for tables expects a dataLabel prop
    // The data structure does not otherwise know this information at that level
    // This is somewhat opinionated and may break if 3rd party library changes
    // See Tr and Tbody for other usage
    const modifyChildren = (children) => Children.map(children, (child) => {
        if (child && (headerTextValues === null || headerTextValues === void 0 ? void 0 : headerTextValues.length) > 0) {
            return cloneElement(child, { extraHeaders: headerTextValues });
        }
        return child;
    });
    if (!props['aria-label']) {
        // eslint-disable-next-line no-console
        console.warn('For accessibility reasons an aria-label should be specified for the Table via the <Message /> tableProps prop');
    }
    return (
    // gridBreakPoint is so we show mobile-styled-PF table
    _jsx(Table, Object.assign({ "aria-label": props['aria-label'], gridBreakPoint: "grid", className: css('pf-chatbot__message-table', isPrimary && 'pf-m-primary', shouldRetainStyles && 'pf-m-markdown', className) }, rest, { children: modifyChildren(children) })));
};
export default TableMessage;
