"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.DataTableDetailsPanelRow = DataTableDetailsPanelRow;
const react_1 = __importDefault(require("react"));
const useTableDetailsPanel_1 = require("../hooks/useTableDetailsPanel");
const DataTableRoot_context_1 = require("../root/DataTableRoot.context");
function DataTableDetailsPanelRow({ rowId, rowData, }) {
    const { tableId, totalColSpan } = (0, DataTableRoot_context_1.useDataTableContext)();
    const { enableDetailsPanel, isExpanded, getDetailsPanelContent, getDetailsPanelHeight, } = (0, useTableDetailsPanel_1.useDataTableDetailsPanel)();
    if (!enableDetailsPanel) {
        return null;
    }
    if (!isExpanded(rowId)) {
        return null;
    }
    const content = getDetailsPanelContent === null || getDetailsPanelContent === void 0 ? void 0 : getDetailsPanelContent(rowData);
    const expansionId = (0, useTableDetailsPanel_1.getDataTableDetailsPanelId)(tableId, rowId);
    if (!content) {
        return null;
    }
    const panelHeight = getDetailsPanelHeight === null || getDetailsPanelHeight === void 0 ? void 0 : getDetailsPanelHeight(rowData);
    const style = panelHeight
        ? { height: panelHeight, overflow: "auto" }
        : { height: "auto" };
    return (react_1.default.createElement("tr", { className: "aksel-data-table__details-panel-row" },
        react_1.default.createElement("td", { id: expansionId, colSpan: totalColSpan, className: "aksel-data-table__details-panel-row-cell" },
            react_1.default.createElement("div", { style: style }, content))));
}
//# sourceMappingURL=DataTableDetailsPanelRow.js.map