'use client';
import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
import { useMemo } from 'react';
import { FieldLabel } from '../../fields/FieldLabel/index.js';
import './index.scss';
import { useTranslation } from '../../providers/Translation/index.js';
import { ReactSelect } from '../ReactSelect/index.js';
import { formatOptions } from '../WhereBuilder/Condition/Select/formatOptions.js';
export const TimezonePicker = (props)=>{
    const { id, onChange: onChangeFromProps, options: optionsFromProps, readOnly: readOnlyFromProps, required, selectedTimezone: selectedTimezoneFromProps } = props;
    const { t } = useTranslation();
    const options = formatOptions(optionsFromProps);
    const selectedTimezone = useMemo(()=>{
        return options.find((t)=>{
            const value = typeof t === 'string' ? t : t.value;
            return value === (selectedTimezoneFromProps || 'UTC');
        });
    }, [
        options,
        selectedTimezoneFromProps
    ]);
    const readOnly = Boolean(readOnlyFromProps) || options.length === 1;
    return /*#__PURE__*/ _jsxDEV("div", {
        className: "timezone-picker-wrapper",
        children: [
            /*#__PURE__*/ _jsxDEV(FieldLabel, {
                htmlFor: id,
                label: `${t('general:timezone')} ${required ? '*' : ''}`,
                required: required,
                unstyled: true
            }, void 0, false, {
                fileName: "src/elements/TimezonePicker/index.tsx",
                lineNumber: 41,
                columnNumber: 7
            }, this),
            /*#__PURE__*/ _jsxDEV(ReactSelect, {
                className: "timezone-picker",
                disabled: readOnly,
                inputId: id,
                isClearable: !required,
                isCreatable: false,
                onChange: (val)=>{
                    if (onChangeFromProps) {
                        onChangeFromProps(val?.value || '');
                    }
                },
                options: options,
                value: selectedTimezone
            }, void 0, false, {
                fileName: "src/elements/TimezonePicker/index.tsx",
                lineNumber: 47,
                columnNumber: 7
            }, this)
        ]
    }, void 0, true, {
        fileName: "src/elements/TimezonePicker/index.tsx",
        lineNumber: 40,
        columnNumber: 5
    }, this);
};

//# sourceMappingURL=index.js.map