import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2024-2026 GoodData Corporation
import { useCallback, useState } from "react";
import cx from "classnames";
import { FormattedMessage, useIntl } from "react-intl";
import { Bubble } from "../Bubble/Bubble.js";
import { BubbleHoverTrigger } from "../Bubble/BubbleHoverTrigger.js";
export function CronExpression({ expression, description, onChange, onBlur, showTimezone, timezone, disabled, validationError, accessibilityConfig, }) {
    const intl = useIntl();
    const [originalExpression] = useState(expression);
    const [changed, setChanged] = useState(false);
    const handleBlur = useCallback((e) => {
        const value = e.target.value;
        onBlur(value);
    }, [onBlur]);
    const handleChange = useCallback((e) => {
        const value = e.target.value;
        onChange(value);
        setChanged(originalExpression !== value);
    }, [onChange, originalExpression]);
    const cronPlaceholder = "* * * * * *";
    const hasTimezone = Boolean(showTimezone && timezone);
    const hasDescription = Boolean(description);
    return (_jsxs(_Fragment, { children: [
            _jsx("div", { className: cx("gd-recurrence-form-cron s-recurrence-form-cron", {
                    "has-error": !!validationError,
                    "is-disabled": disabled,
                }), children: _jsx("input", { className: "gd-input-field", type: "text", onChange: handleChange, onBlur: handleBlur, value: expression, placeholder: cronPlaceholder, disabled: disabled, "aria-describedby": accessibilityConfig?.ariaDescribedBy, "aria-labelledby": accessibilityConfig?.ariaLabelledBy }) }), hasDescription || hasTimezone ? (_jsxs("div", { className: "gd-recurrence-form-repeat-type-description s-recurrence-form-repeat-type-description", children: [hasDescription && !changed ? _jsx("span", { children: description }) : null, hasTimezone ? (_jsxs(_Fragment, { children: [
                            _jsx(FormattedMessage, { id: "gs.date.at", tagName: "span" }), _jsxs(BubbleHoverTrigger, { showDelay: 0, hideDelay: 0, className: "gd-recurrence-form-timezone-wrapper", children: [
                                    _jsxs("span", { className: "gd-recurrence-form-timezone", children: [" ", timezone, " ", intl.formatMessage({ id: "gs.time" })] }), _jsxs(Bubble, { className: "bubble-primary", alignPoints: [{ align: "bc tc" }], children: [timezone, " ", intl.formatMessage({ id: "gs.time" })] })
                                ] })
                        ] })) : null] })) : null] }));
}
