var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
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 React from 'react';
import { render, screen } from '@testing-library/react';
import { useBasicTableCellRenderer } from './useBasicTableCellRenderer';
import { CellRenderer } from './CellRenderer';
// eslint-disable-next-line react/prop-types
var TestComponent = function (_a) {
    var columnId = _a.columnId, columnsData = _a.columnsData, rowsData = _a.rowsData, otherProps = __rest(_a, ["columnId", "columnsData", "rowsData"]);
    var _b = useBasicTableCellRenderer(__assign({ columnsData: columnsData, rowsData: rowsData }, otherProps)), getRowHeight = _b.getRowHeight, collapseContextValue = _b.collapseContextValue, getHeightForSubRow = _b.getHeightForSubRow, tableRowsData = _b.tableRowsData;
    return (React.createElement("div", { "data-reltio-id": 'cell' },
        React.createElement(CellRenderer, { columnId: columnId, rowIndex: 0, collapseContextValue: collapseContextValue, getRowHeight: getRowHeight, columnsData: columnsData, tableRowsData: tableRowsData, getHeightForSubRow: getHeightForSubRow })));
};
describe('useBasicTableCellRenderer tests', function () {
    var CellValueRenderer = function (_a) {
        var value = _a.value;
        return React.createElement("div", { "data-reltio-id": 'value' }, value);
    };
    var rowsData = [
        {
            colA: 'A'
        }
    ];
    var columnsData = [
        {
            id: 'colA',
            label: 'Column A',
            dataTypeDefinition: {
                type: 'String'
            },
            rowCellValueRenderer: CellValueRenderer
        }
    ];
    var getCell = function () { return screen.getByTestId('cell'); };
    var getCellRendererContainer = function () { return getCell().firstChild; };
    var getValue = function () { return screen.getByTestId('value'); };
    var getAllValues = function () { return screen.getAllByTestId('value'); };
    it('should return basic table cell renderer and function to get its height', function () {
        render(React.createElement(TestComponent, { columnId: 'colA', rowsData: rowsData, columnsData: columnsData }));
        expect(getCellRendererContainer()).toHaveStyle({ height: '48px' });
        expect(getValue()).toHaveTextContent('A');
    });
    it('should use defaultRowHeight if cell height is 0', function () {
        var defaultRowHeight = 56;
        var props = {
            columnId: 'colA',
            rowsData: rowsData,
            columnsData: columnsData,
            getRowCellHeight: function () { return 0; },
            defaultRowHeight: defaultRowHeight
        };
        render(React.createElement(TestComponent, __assign({}, props)));
        expect(getCellRendererContainer()).toHaveStyle({ height: "".concat(defaultRowHeight, "px") });
    });
    describe('sub cell rendering', function () {
        var columnsData = [
            {
                id: 'nested.A',
                nestedPath: ['nested'],
                dataTypeDefinition: {
                    type: 'String'
                },
                rowCellValueRenderer: CellValueRenderer
            },
            {
                id: 'nested.nested.B',
                nestedPath: ['nested', 'nested'],
                dataTypeDefinition: {
                    type: 'String'
                },
                rowCellValueRenderer: CellValueRenderer
            }
        ];
        var rowsData = [
            {
                'nested.A': [['1'], ['2']],
                'nested.nested.B': [[['1.1']], [['2.1'], ['2.2']]]
            }
        ];
        it('should render sub cells with different height correctly', function () {
            render(React.createElement(TestComponent, { columnId: 'nested.A', rowsData: rowsData, columnsData: columnsData }));
            expect(getCellRendererContainer()).toHaveStyle({ height: '144px' });
            var valuesA = getAllValues();
            expect(valuesA).toHaveLength(2);
            expect(valuesA[0]).toHaveTextContent('1');
            expect(valuesA[0].parentElement).toHaveStyle({ height: '48px' });
            expect(valuesA[1]).toHaveTextContent('2');
            expect(valuesA[1].parentElement).toHaveStyle({ height: '96px' });
        });
        it('should render sub cells with same height correctly', function () {
            render(React.createElement(TestComponent, { columnId: 'nested.nested.B', rowsData: rowsData, columnsData: columnsData }));
            expect(getCellRendererContainer()).toHaveStyle({ height: '144px' });
            var valuesB = getAllValues();
            expect(valuesB).toHaveLength(3);
            expect(valuesB[0]).toHaveTextContent('1.1');
            expect(valuesB[0].parentElement).toHaveStyle({ height: '48px' });
            expect(valuesB[1]).toHaveTextContent('2.1');
            expect(valuesB[1].parentElement).toHaveStyle({ height: '48px' });
            expect(valuesB[2]).toHaveTextContent('2.2');
            expect(valuesB[2].parentElement).toHaveStyle({ height: '48px' });
        });
    });
});
