import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { cn } from '../../../../scalars/lib/utils.js';
import { FormDescription } from '../../../../scalars/components/fragments/form-description/index.js';
import { FormGroup } from '../../../../scalars/components/fragments/form-group/form-group.js';
import { FormLabel } from '../../../../scalars/components/fragments/form-label/form-label.js';
import { FormMessageList } from '../../../../scalars/components/fragments/form-message/message-list.js';
import { forwardRef } from 'react';
import { BasePickerField } from '../date-time-picker/base-picker.js';
import TimePickerContent from './subcomponents/time-picker-content.js';
import { useTimePicker } from './use-time-picker.js';
import { handleKeyDown } from './utils.js';
const TimePicker = forwardRef(({ label, id, errors, name, placeholder, value, defaultValue, onChange, onBlur, description, warnings, required, disabled, inputProps, selectProps, timeFormat = 'hh:mm a', showTimezoneSelect, timeIntervals, timeZone, includeContinent, className, }, ref) => {
    const { selectedHour, setSelectedHour, selectedMinute, setSelectedMinute, selectedPeriod, setSelectedPeriod, hours, minutes, isOpen, setIsOpen, inputValue, handleInputChange, handleSave, handleCancel, timeZonesOptions, handleBlur, is12HourFormat, selectedTimeZone, setSelectedTimeZone, isDisableSelect, } = useTimePicker({
        value,
        defaultValue,
        onChange,
        onBlur,
        timeFormat,
        timeIntervals,
        timeZone,
        showTimezoneSelect,
        includeContinent,
    });
    return (_jsxs(FormGroup, { children: [label && (_jsx(FormLabel, { htmlFor: id, required: required, disabled: disabled, hasError: !!errors?.length, children: label })), _jsx(BasePickerField, { iconName: "Clock", isOpen: isOpen, name: name, errors: errors, disabled: disabled, required: required, value: inputValue, setIsOpen: setIsOpen, onInputChange: handleInputChange, ref: ref, placeholder: placeholder, handleBlur: handleBlur, inputProps: {
                    ...inputProps,
                    onKeyDown: handleKeyDown,
                }, className: cn('pb-4 pl-4 pr-4 pt-3', className), children: _jsx(TimePickerContent, { selectedHour: selectedHour, selectedMinute: selectedMinute, selectedPeriod: selectedPeriod, setSelectedHour: setSelectedHour, setSelectedMinute: setSelectedMinute, setSelectedPeriod: setSelectedPeriod, hours: hours, minutes: minutes, onSave: handleSave, onCancel: handleCancel, timeZonesOptions: timeZonesOptions, selectProps: selectProps, is12HourFormat: is12HourFormat, isDisableSelect: isDisableSelect, selectedTimeZone: selectedTimeZone, setSelectedTimeZone: setSelectedTimeZone, timeZone: timeZone }) }), description && _jsx(FormDescription, { children: description }), warnings && _jsx(FormMessageList, { messages: warnings, type: "warning" }), errors && _jsx(FormMessageList, { messages: errors, type: "error" })] }));
});
TimePicker.displayName = 'TimePicker';
export { TimePicker };
//# sourceMappingURL=time-picker.js.map