/**
 * @license MIT
 * author: Cube Dev Team
 * @cube-dev/ui-kit v0.0.0-canary-9f08182
 * Released under the MIT license.
 */

import { jsx as _jsx } from "react/jsx-runtime";
import { createCalendar } from '@internationalized/date';
import { useRef } from 'react';
import { useDateField, useFocusWithin, useLocale, } from 'react-aria';
import { useDateFieldState } from 'react-stately';
import { tasty } from '../../../tasty/index.js';
import { mergeProps } from '../../../utils/react/index.js';
import { DatePickerSegment } from './DatePickerSegment.js';
import { formatSegments } from './utils.js';
const DateInputElement = tasty({
    role: 'presentation',
    styles: {
        display: 'flex',
        flow: 'row',
        placeItems: 'center start',
    },
});
export function DatePickerInput(props) {
    let { isDisabled, isReadOnly, isRequired, useLocale: useLocaleProp } = props;
    let ref = useRef(null);
    let { locale } = useLocale();
    let state = useDateFieldState({
        ...props,
        locale: useLocaleProp ? locale : 'en-US',
        createCalendar,
    });
    if (useLocaleProp == null) {
        state.segments = formatSegments(state.segments);
    }
    const { focusWithinProps } = useFocusWithin({
        onFocusWithinChange: (isFocused) => {
            if (isFocused) {
                props.onFocus?.();
            }
            else {
                props.onBlur?.();
            }
        },
    });
    let { fieldProps } = useDateField(props, state, ref);
    return (_jsx(DateInputElement, { ref: ref, ...mergeProps(fieldProps, focusWithinProps), children: state.segments.map((segment, i) => (_jsx(DatePickerSegment, { segment: segment, state: state, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired }, i))) }));
}

        