import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2020-2025 GoodData Corporation
import classNames from "classnames";
import { isEmpty } from "lodash-es";
import { FormattedMessage } from "react-intl";
import { LoadingMask } from "@gooddata/sdk-ui-kit";
const LOADING_MASK_HEIGHT = 60;
export function ParameterDetail({ title, typeName, label, isLoading, useEllipsis, values, additionalValues, }) {
    return (_jsxs("div", { className: "gd-drill-to-url-editor-parameter-detail s-parameter-detail", children: [
            _jsx("div", { className: "gd-parameter-detail-title", children: title }), _jsx(ParameterTypeSection, { typeName: typeName }), label ? _jsx(ParameterLabelSection, { label: label }) : null, !isEmpty(values) && (_jsx(ParameterValuesSection, { isLoading: isLoading, useEllipsis: useEllipsis, values: values, additionalValues: additionalValues }))] }));
}
function ParameterTypeSection({ typeName }) {
    return (_jsxs("div", { className: "gd-parameter-detail-section", children: [
            _jsx("div", { className: "gd-parameter-detail-subtitle", children: _jsx(FormattedMessage, { id: "configurationPanel.drillIntoUrl.editor.parameterDetailType" }) }), _jsx("div", { children: typeName })
        ] }));
}
function ParameterLabelSection({ label }) {
    return (_jsxs("div", { className: "gd-parameter-detail-section", children: [
            _jsx("div", { className: "gd-parameter-detail-subtitle", children: _jsx(FormattedMessage, { id: "configurationPanel.drillIntoUrl.editor.parameterDetailLabel" }) }), _jsx("div", { children: label })
        ] }));
}
function ParameterValuesSection({ isLoading, useEllipsis, values, additionalValues }) {
    return isLoading ? (_jsx(LoadingMask, { className: "s-parameter-detail-loading", height: LOADING_MASK_HEIGHT })) : (_jsx(Values, { useEllipsis: useEllipsis, values: values, additionalValues: additionalValues }));
}
function Values({ useEllipsis, values, additionalValues }) {
    const valueClassName = classNames("s-parameter-detail-value", {
        "gd-parameter-detail-ellipsis-row": useEllipsis,
    });
    return (values && (_jsxs("div", { className: "gd-parameter-detail-section", children: [
            _jsx("div", { className: "gd-parameter-detail-subtitle", children: _jsx(FormattedMessage, { id: "configurationPanel.drillIntoUrl.editor.parameterDetailValues", values: { numberOfValues: values.length } }) }), _jsxs("div", { children: [values.map((item, i) => (_jsx("div", { className: valueClassName, children: item }, i))), additionalValues ? (_jsx("div", { className: "gd-parameter-detail-info", children: _jsx(FormattedMessage, { id: "configurationPanel.drillIntoUrl.editor.parameterDetailMoreValues", values: { count: additionalValues } }) })) : null] })
        ] })));
}
