import React__default, { useCallback, useState, useEffect } from 'react';
import { validateRowKey, getTableCellValue } from '../utils/tableUtils.mjs';
import { TABLE_ACTIONS_HEADER, TableActionsContainer } from './TableActions.mjs';
import TableContainer from '../../../../../../node_modules/@mui/material/TableContainer/TableContainer.mjs';
import TableHead from '../../../../../../node_modules/@mui/material/TableHead/TableHead.mjs';
import TableRow from '../../../../../../node_modules/@mui/material/TableRow/TableRow.mjs';
import TableBody from '../../../../../../node_modules/@mui/material/TableBody/TableBody.mjs';
import styled from '../../../../../../node_modules/@mui/material/styles/styled.mjs';
import Table from '../../../../../../node_modules/@mui/material/Table/Table.mjs';
import TableCell from '../../../../../../node_modules/@mui/material/TableCell/TableCell.mjs';

const StyledTable$1 = styled(Table)(({ hasActions })=>[
        // For some reason with position sticky, the table is 2px wider than the container
        hasActions && {
            width: 'calc(100% - 2px)'
        }
    ]);
const StyleTabledCell = styled(TableCell)(({ isActions, isBottomAction })=>[
        {
            '& > p': {
                whiteSpace: 'normal'
            }
        },
        isActions && {
            position: 'sticky',
            right: 0,
            width: '1%'
        },
        isBottomAction && {
            borderBottom: 'none'
        }
    ]);
const EmbeddedTableCore = ({ itemRenderer, items, rowKeyExtractor, getItemActionProps, readOnly, bottomAction, initialItemState, tableHeaderSx, TableActionsComponent: TableActions, TypographyComponent: Typography })=>{
    validateRowKey(items, rowKeyExtractor);
    const getId = useCallback((item)=>rowKeyExtractor ? rowKeyExtractor(item) : typeof item === 'string' ? item : item.id, [
        rowKeyExtractor
    ]);
    const itemState = initialItemState ?? {};
    const [itemsState, setItemsState] = useState(items.reduce((acc, item)=>({
            ...acc,
            [getId(item)]: itemState
        }), {}));
    const setItemState = (item, state)=>{
        const id = getId(item);
        setItemsState((prevState)=>({
                ...prevState,
                [id]: state
            }));
    };
    useEffect(()=>{
        setItemsState(items.reduce((acc, item)=>({
                ...acc,
                [getId(item)]: itemsState[getId(item)] ?? itemState
            }), {}));
    }, [
        items,
        getId
    ]); // eslint-disable-line react-hooks/exhaustive-deps
    return /*#__PURE__*/ React__default.createElement(TableContainer, null, /*#__PURE__*/ React__default.createElement(StyledTable$1, {
        hasActions: Boolean(getItemActionProps)
    }, /*#__PURE__*/ React__default.createElement(TableHead, null, /*#__PURE__*/ React__default.createElement(TableRow, null, itemRenderer.map((column)=>/*#__PURE__*/ React__default.createElement(StyleTabledCell, {
            key: `col-header-${column.title}`,
            sx: tableHeaderSx
        }, /*#__PURE__*/ React__default.createElement(Typography, {
            variant: "body2"
        }, column.title))), !readOnly && getItemActionProps && /*#__PURE__*/ React__default.createElement(StyleTabledCell, {
        isActions: true,
        sx: tableHeaderSx
    }, /*#__PURE__*/ React__default.createElement(Typography, {
        variant: "body2"
    }, TABLE_ACTIONS_HEADER)))), /*#__PURE__*/ React__default.createElement(TableBody, null, items.map((item)=>{
        const id = getId(item);
        return /*#__PURE__*/ React__default.createElement(TableRow, {
            key: id
        }, itemRenderer.map((column, i)=>{
            const children = column.getValue(item, itemsState[id]);
            const value = getTableCellValue(children);
            return /*#__PURE__*/ React__default.createElement(StyleTabledCell, {
                key: `col-${column.title}-${i}`
            }, typeof value === 'string' ? /*#__PURE__*/ React__default.createElement(Typography, {
                variant: "body2"
            }, value) : value);
        }), !readOnly && getItemActionProps && /*#__PURE__*/ React__default.createElement(StyleTabledCell, {
            isActions: true
        }, /*#__PURE__*/ React__default.createElement(TableActions, getItemActionProps(item, (state)=>state && setItemState(item, state), itemsState[id]))));
    }), !readOnly && bottomAction && /*#__PURE__*/ React__default.createElement(TableRow, null, /*#__PURE__*/ React__default.createElement(StyleTabledCell, {
        colSpan: getItemActionProps ? itemRenderer.length : itemRenderer.length - 1,
        isBottomAction: true
    }), /*#__PURE__*/ React__default.createElement(StyleTabledCell, {
        isActions: true,
        isBottomAction: true
    }, /*#__PURE__*/ React__default.createElement(TableActionsContainer, null, bottomAction))))));
};

export { EmbeddedTableCore };
//# sourceMappingURL=EmbeddedTable.mjs.map
