"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.InspectorInfoSubtitle = exports.InspectorInfoTitle = exports.InspectorInfoHeader = exports.INSPECTOR_INFO_HEADER_MIN_HEIGHT = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const colors_1 = require("../helpers/colors");
const InspectorPanelLayout_1 = require("./InspectorPanelLayout");
exports.INSPECTOR_INFO_HEADER_MIN_HEIGHT = 84;
const containerBase = {
    backgroundColor: colors_1.BACKGROUND,
    color: colors_1.WHITE,
    display: 'block',
    padding: `6px ${InspectorPanelLayout_1.INSPECTOR_PANEL_HORIZONTAL_PADDING}px`,
};
const container = {
    ...containerBase,
    minHeight: exports.INSPECTOR_INFO_HEADER_MIN_HEIGHT,
};
const row = {
    backgroundColor: colors_1.BACKGROUND,
    display: 'flex',
    flexDirection: 'row',
    lineHeight: '18px',
    minWidth: 0,
};
const content = {
    minWidth: 0,
    width: '100%',
};
const title = {
    backgroundColor: colors_1.BACKGROUND,
    color: colors_1.WHITE,
    fontSize: 12,
    lineHeight: '18px',
    overflow: 'hidden',
    textOverflow: 'ellipsis',
    whiteSpace: 'nowrap',
};
const subtitle = {
    backgroundColor: colors_1.BACKGROUND,
    color: colors_1.LIGHT_TEXT,
    fontSize: 12,
    lineHeight: '18px',
    overflow: 'hidden',
    textOverflow: 'ellipsis',
    whiteSpace: 'nowrap',
};
const InspectorInfoHeader = ({ children, contentSized = false, minHeight }) => {
    const style = contentSized
        ? containerBase
        : minHeight === undefined
            ? container
            : { ...containerBase, minHeight };
    return (jsx_runtime_1.jsx("div", { style: style, children: children === undefined || children === null ? null : (jsx_runtime_1.jsx("div", { style: row, children: jsx_runtime_1.jsx("div", { style: content, children: children }) })) }));
};
exports.InspectorInfoHeader = InspectorInfoHeader;
const InspectorInfoTitle = ({ children }) => {
    return jsx_runtime_1.jsx("div", { style: title, children: children });
};
exports.InspectorInfoTitle = InspectorInfoTitle;
const InspectorInfoSubtitle = ({ children }) => {
    return jsx_runtime_1.jsx("div", { style: subtitle, children: children });
};
exports.InspectorInfoSubtitle = InspectorInfoSubtitle;
