import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2026 GoodData Corporation
import { useState } from "react";
import cx from "classnames";
import { FormattedMessage, defineMessages, useIntl } from "react-intl";
import { isValidNumberParameterValue } from "@gooddata/sdk-model";
import { bem } from "../@ui/@utils/bem.js";
import { UiButton } from "../@ui/UiButton/UiButton.js";
import { useId } from "../utils/useId.js";
const { b, e } = bem("gd-ui-kit-parameter-control");
const messages = defineMessages({
    valueLabel: { id: "parameter_filter.dropdown.value_label" },
    reset: { id: "parameter_filter.dropdown.reset" },
    previewLabel: { id: "parameter_filter.dropdown.preview_label" },
    apply: { id: "parameter_filter.dropdown.apply" },
    cancel: { id: "cancel" },
    errorNotANumber: { id: "parameter_filter.dropdown.error.notANumber" },
    errorOutOfRange: { id: "parameter_filter.dropdown.error.outOfRange" },
    errorOutOfRangeMin: { id: "parameter_filter.dropdown.error.outOfRange.min" },
    errorOutOfRangeMax: { id: "parameter_filter.dropdown.error.outOfRange.max" },
});
/**
 * Dropdown panel for editing a numeric parameter value. Owns the draft, inline validation,
 * preview, and (mode-aware) Reset via `resetValue`.
 *
 * Reset is visible only when `resetValue` is set and differs from `value`; clicking it
 * writes `resetValue` into the draft input only. The user must click Apply to commit.
 *
 * @internal
 */
export function ParameterControlDropdown({ name, value, resetValue, constraints, onApply, onCancel, }) {
    const intl = useIntl();
    const inputId = useId();
    const [draft, setDraft] = useState(String(value));
    const error = getDraftValidationError(draft, constraints);
    const effectiveValue = error ? value : parseDraft(draft);
    const handleApply = () => {
        if (error) {
            return;
        }
        onApply(parseDraft(draft));
    };
    const showReset = resetValue !== undefined && effectiveValue !== resetValue;
    return (_jsxs("div", { className: `${b({ dropdown: true })} overlay gd-dialog gd-dropdown`, "data-testid": "parameter-control-dropdown", children: [
            _jsxs("div", { className: cx(e("dropdown-field"), { "has-error": !!error }), children: [
                    _jsxs("div", { className: e("dropdown-field-header"), children: [
                            _jsx("label", { htmlFor: inputId, className: e("dropdown-label"), children: intl.formatMessage(messages.valueLabel) }), showReset ? (_jsx("button", { type: "button", className: e("dropdown-reset"), "data-testid": "parameter-control-dropdown-reset", onClick: () => setDraft(String(resetValue)), children: intl.formatMessage(messages.reset) })) : null] }), _jsx("input", { id: inputId, type: "number", className: `${e("dropdown-input")} gd-input-field`, "data-testid": "parameter-control-dropdown-input", value: draft, min: constraints?.min, max: constraints?.max, onChange: (event) => setDraft(event.target.value) }), error ? (_jsx("div", { className: e("dropdown-error"), "data-testid": "parameter-control-dropdown-error", children: _jsx(FormattedMessage, { ...error, values: { min: constraints?.min, max: constraints?.max } }) })) : null] }), _jsx("div", { className: e("dropdown-divider") }), _jsxs("div", { className: e("dropdown-preview"), "data-testid": "parameter-control-dropdown-preview", children: [
                    _jsx("span", { className: e("dropdown-preview-label"), children: intl.formatMessage(messages.previewLabel) }), _jsx("span", { className: e("dropdown-preview-text"), children: _jsx(FormattedMessage, { id: "parameter_filter.dropdown.preview", values: {
                                name,
                                value: effectiveValue,
                                strong: (chunks) => _jsx("strong", { children: chunks }),
                            } }) })
                ] }), _jsxs("div", { className: e("dropdown-footer"), children: [
                    _jsx(UiButton, { variant: "secondary", size: "small", label: intl.formatMessage(messages.cancel), dataTestId: "parameter-control-dropdown-cancel", onClick: onCancel }), _jsx(UiButton, { variant: "primary", size: "small", label: intl.formatMessage(messages.apply), dataTestId: "parameter-control-dropdown-apply", onClick: handleApply, isDisabled: !!error })
                ] })
        ] }));
}
/**
 * Returns the message to show for an invalid draft, or `undefined` when the draft is a valid
 * in-range number. The single source of truth the dropdown derives its error row, input style,
 * and Apply-disabled state from.
 *
 * @internal
 */
export function getDraftValidationError(draft, constraints) {
    const value = parseDraft(draft);
    if (!Number.isFinite(value)) {
        return messages.errorNotANumber;
    }
    if (isValidNumberParameterValue(value, constraints)) {
        return undefined;
    }
    const { min, max } = constraints ?? {};
    if (min !== undefined && max === undefined) {
        return messages.errorOutOfRangeMin;
    }
    if (max !== undefined && min === undefined) {
        return messages.errorOutOfRangeMax;
    }
    return messages.errorOutOfRange;
}
function parseDraft(draft) {
    return draft.trim() === "" ? Number.NaN : Number(draft);
}
