import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import cx from "classnames";
import { FormattedMessage } from "react-intl";
import { Bubble, BubbleHoverTrigger } from "@gooddata/sdk-ui-kit";
import { ConfigurationPanelContent } from "./ConfigurationPanelContent.js";
import { messages } from "../../../locales.js";
import { BUBBLE_ARROW_OFFSET_X, BUBBLE_ARROW_OFFSET_Y, HIDE_DELAY_DEFAULT, SHOW_DELAY_DEFAULT, } from "../../constants/bubble.js";
import { LabelSubsection } from "../configurationControls/axis/LabelSubsection.js";
import { NameSubsection } from "../configurationControls/axis/NameSubsection.js";
import { CheckboxControl } from "../configurationControls/CheckboxControl.js";
import { ConfigSection } from "../configurationControls/ConfigSection.js";
import { MinMaxControl } from "../configurationControls/MinMaxControl.js";
import { countItemsOnAxes } from "../pluggableVisualizations/baseChart/insightIntrospection.js";
export class BulletChartConfigurationPanel extends ConfigurationPanelContent {
    renderConfigurationPanel() {
        const { propertiesMeta, properties, pushData, type, insight } = this.props;
        const controls = properties?.controls || {};
        const { xaxis, yaxis, grid } = controls;
        const xAxisVisible = typeof xaxis?.visible === "undefined" ? true : xaxis.visible;
        const yAxisVisible = typeof yaxis?.visible === "undefined" ? true : yaxis.visible;
        const gridEnabled = typeof grid?.enabled === "undefined" ? true : grid.enabled;
        const controlsDisabled = this.isControlDisabled();
        const { xaxis: itemsOnXAxis, yaxis: itemsOnYAxis } = countItemsOnAxes(type, controls, insight);
        const xAxisNameSectionDisabled = controlsDisabled || itemsOnXAxis !== 1;
        const yAxisNameSubsectionDisabled = controlsDisabled || itemsOnYAxis === 0;
        return (_jsxs(BubbleHoverTrigger, { showDelay: SHOW_DELAY_DEFAULT, hideDelay: HIDE_DELAY_DEFAULT, children: [
                _jsxs("div", { children: [this.renderColorSection(), _jsxs(ConfigSection, { id: "xaxis_section", title: messages["xaxisTitle"].id, valuePath: "xaxis.visible", canBeToggled: true, toggledOn: xAxisVisible, toggleDisabled: controlsDisabled, propertiesMeta: propertiesMeta, properties: properties, pushData: pushData, children: [
                                _jsx(NameSubsection, { disabled: xAxisNameSectionDisabled, configPanelDisabled: controlsDisabled, axis: "xaxis", properties: properties, pushData: pushData }), _jsx(LabelSubsection, { disabled: controlsDisabled, configPanelDisabled: controlsDisabled, axis: "xaxis", properties: properties, pushData: pushData, showFormat: true }), this.renderMinMax("xaxis")] }), _jsxs(ConfigSection, { id: "yaxis_section", title: messages["yaxisTitle"].id, valuePath: "yaxis.visible", canBeToggled: true, toggledOn: yAxisVisible, toggleDisabled: controlsDisabled, propertiesMeta: propertiesMeta, properties: properties, pushData: pushData, children: [
                                _jsx(NameSubsection, { disabled: yAxisNameSubsectionDisabled, configPanelDisabled: controlsDisabled, axis: "yaxis", properties: properties, pushData: pushData }), _jsx(LabelSubsection, { disabled: controlsDisabled || itemsOnYAxis === 0, configPanelDisabled: controlsDisabled, axis: "yaxis", properties: properties, pushData: pushData })
                            ] }), this.renderLegendSection(), this.renderInteractionsSection(), _jsx(ConfigSection, { id: "canvas_section", title: messages["canvasTitle"].id, propertiesMeta: propertiesMeta, properties: properties, pushData: pushData, children: _jsx(CheckboxControl, { valuePath: "grid.enabled", labelText: messages["canvasGridLine"].id, properties: properties, checked: gridEnabled, disabled: controlsDisabled, pushData: pushData }) }), this.renderAdvancedSection()] }), _jsx(Bubble, { className: this.getBubbleClassNames(), arrowOffsets: { "tc bc": [BUBBLE_ARROW_OFFSET_X, BUBBLE_ARROW_OFFSET_Y] }, alignPoints: [{ align: "tc bc" }], children: _jsx(FormattedMessage, { id: "properties.config.not_applicable" }) })
            ] }));
    }
    renderMinMax(basePath) {
        const { pushData, properties, propertiesMeta } = this.props;
        return (_jsx(MinMaxControl, { isDisabled: this.isControlDisabled(), basePath: basePath, pushData: pushData, properties: properties, propertiesMeta: propertiesMeta }));
    }
    getBubbleClassNames() {
        return cx("bubble-primary", {
            invisible: !this.isControlDisabled(),
        });
    }
}
//# sourceMappingURL=BulletChartConfigurationPanel.js.map