{"version":3,"file":"DatePicker.cjs","sources":["../../../../src/components/forms/date-picker/DatePicker.tsx"],"sourcesContent":["import { Calendar } from '@components/forms/calendar'\nimport { TextField } from '@components/forms/text-field'\nimport { Popover } from '@components/overlay/popover'\nimport { IconButton } from '@components/actions/icon-button'\nimport { useDatePicker } from '@components/forms/date-picker/hooks/useDatePicker.hook.ts'\nimport { DATE_PICKER_STYLES } from '@components/forms/date-picker/styles/DatePicker.css.ts'\nimport CalendarIcon from '@resources/asset/CalendarIcon.svg?react'\nimport { cn } from '@utils/cn.ts'\nimport type { DatePickerProps } from '@components/forms/date-picker/types/DatePicker.props.ts'\nimport { memo, useCallback, useMemo, useRef } from 'react'\n\n/**\n * A date picker that combines a native `type=\"date\"` text field with a\n * calendar popover.\n *\n * - Typing a valid `YYYY-MM-DD` date updates the calendar and calls `onChange`.\n * - Selecting a day in the calendar updates the input and closes the popover.\n * - Invalid or incomplete typed values are kept in the input but do not update\n *   the selected date until they become valid.\n * - Opening the popover focuses the selected day (or today), and closing it\n *   returns focus to the input.\n *\n * @example\n * ```tsx\n * const [date, setDate] = useState<Date | undefined>()\n * <DatePicker label=\"Pick a date\" value={date} onChange={setDate} />\n * ```\n */\nconst DatePicker = memo(\n    ({\n        value,\n        defaultValue,\n        onChange,\n        calendarProps,\n        id,\n        disabled,\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        calendarAriaLabel = 'Calendar',\n        onKeyDown,\n        ...textFieldProps\n    }: DatePickerProps) => {\n        const {\n            selectedDate,\n            inputValue,\n            open,\n            inputId,\n            handleInputChange,\n            handleInputKeyDown,\n            handleCalendarSelect,\n            setOpen,\n        } = useDatePicker({ value, defaultValue, onChange, id })\n\n        const inputRef = useRef<HTMLInputElement>(null)\n        const calendarDefaultMonth = useMemo(\n            () => selectedDate ?? new Date(),\n            [selectedDate],\n        )\n\n        const handleKeyDown = useCallback(\n            (event: React.KeyboardEvent<HTMLInputElement>) => {\n                handleInputKeyDown(event)\n                onKeyDown?.(event)\n            },\n            [handleInputKeyDown, onKeyDown],\n        )\n\n        const handleInputClick = useCallback(\n            (event: React.MouseEvent<HTMLInputElement>) => {\n                // Stops mobile browsers from opening their native date picker.\n                event.preventDefault()\n            },\n            [],\n        )\n\n        const handleCalendarButtonMouseDown = useCallback(\n            (event: React.MouseEvent<HTMLButtonElement>) => {\n                event.preventDefault()\n            },\n            [],\n        )\n\n        const { className: calendarClassName, ...restCalendarProps } =\n            calendarProps ?? {}\n\n        return (\n            <Popover\n                open={open}\n                onOpenChange={setOpen}\n            >\n                <TextField\n                    {...textFieldProps}\n                    ref={inputRef}\n                    id={inputId}\n                    type={'date'}\n                    disabled={disabled}\n                    value={inputValue}\n                    onChange={handleInputChange}\n                    onKeyDown={handleKeyDown}\n                    onClick={handleInputClick}\n                    className={cn(DATE_PICKER_STYLES.input, textFieldProps.className)}\n                    aria-label={ariaLabel}\n                    aria-labelledby={ariaLabelledBy}\n                    aria-haspopup={'dialog'}\n                    endAction={\n                        <Popover.Trigger>\n                            <IconButton\n                                icon={CalendarIcon}\n                                aria-label={'Open calendar'}\n                                variant={'ghost'}\n                                color={'primary'}\n                                size={'sm'}\n                                type={'button'}\n                                disabled={disabled}\n                                onMouseDown={handleCalendarButtonMouseDown}\n                            />\n                        </Popover.Trigger>\n                    }\n                />\n\n                <Popover.Content\n                    side={'bottom'}\n                    align={'end'}\n                    padding={'none'}\n                    aria-label={calendarAriaLabel}\n                    initialFocus={false}\n                    finalFocus={inputRef}\n                >\n                    <Calendar\n                        mode={'single'}\n                        selected={selectedDate}\n                        onSelect={handleCalendarSelect}\n                        disabled={disabled}\n                        className={cn(DATE_PICKER_STYLES.calendar, calendarClassName)}\n                        {...restCalendarProps}\n                        defaultMonth={calendarDefaultMonth}\n                        autoFocus={open}\n                    />\n                </Popover.Content>\n            </Popover>\n        )\n    },\n)\n\nDatePicker.displayName = 'DatePicker'\n\nexport default DatePicker\n"],"names":["DatePicker","memo","value","defaultValue","onChange","calendarProps","id","disabled","ariaLabel","ariaLabelledBy","calendarAriaLabel","onKeyDown","textFieldProps","selectedDate","inputValue","open","inputId","handleInputChange","handleInputKeyDown","handleCalendarSelect","setOpen","useDatePicker","inputRef","useRef","calendarDefaultMonth","useMemo","handleKeyDown","useCallback","event","handleInputClick","handleCalendarButtonMouseDown","calendarClassName","restCalendarProps","jsxs","Popover","jsx","TextField","cn","DATE_PICKER_STYLES","IconButton","CalendarIcon","Calendar"],"mappings":"+mDA4BMA,EAAaC,EAAAA,KACf,CAAC,CACG,MAAAC,EACA,aAAAC,EACA,SAAAC,EACA,cAAAC,EACA,GAAAC,EACA,SAAAC,EACA,aAAcC,EACd,kBAAmBC,EACnB,kBAAAC,EAAoB,WACpB,UAAAC,EACA,GAAGC,CAAA,IACgB,CACnB,KAAM,CACF,aAAAC,EACA,WAAAC,EACA,KAAAC,EACA,QAAAC,EACA,kBAAAC,EACA,mBAAAC,EACA,qBAAAC,EACA,QAAAC,CAAA,EACAC,EAAAA,cAAc,CAAE,MAAAnB,EAAO,aAAAC,EAAc,SAAAC,EAAU,GAAAE,EAAI,EAEjDgB,EAAWC,EAAAA,OAAyB,IAAI,EACxCC,EAAuBC,EAAAA,QACzB,IAAMZ,GAAgB,IAAI,KAC1B,CAACA,CAAY,CAAA,EAGXa,EAAgBC,EAAAA,YACjBC,GAAiD,CAC9CV,EAAmBU,CAAK,EACxBjB,IAAYiB,CAAK,CACrB,EACA,CAACV,EAAoBP,CAAS,CAAA,EAG5BkB,EAAmBF,EAAAA,YACpBC,GAA8C,CAE3CA,EAAM,eAAA,CACV,EACA,CAAA,CAAC,EAGCE,EAAgCH,EAAAA,YACjCC,GAA+C,CAC5CA,EAAM,eAAA,CACV,EACA,CAAA,CAAC,EAGC,CAAE,UAAWG,EAAmB,GAAGC,CAAA,EACrC3B,GAAiB,CAAA,EAErB,OACI4B,EAAAA,KAACC,EAAA,CACG,KAAAnB,EACA,aAAcK,EAEd,SAAA,CAAAe,EAAAA,IAACC,EAAA,CACI,GAAGxB,EACJ,IAAKU,EACL,GAAIN,EACJ,KAAM,OACN,SAAAT,EACA,MAAOO,EACP,SAAUG,EACV,UAAWS,EACX,QAASG,EACT,UAAWQ,EAAAA,GAAGC,EAAAA,mBAAmB,MAAO1B,EAAe,SAAS,EAChE,aAAYJ,EACZ,kBAAiBC,EACjB,gBAAe,SACf,UACI0B,EAAAA,IAACD,EAAQ,QAAR,CACG,SAAAC,EAAAA,IAACI,EAAA,CACG,KAAMC,EACN,aAAY,gBACZ,QAAS,QACT,MAAO,UACP,KAAM,KACN,KAAM,SACN,SAAAjC,EACA,YAAauB,CAAA,CAAA,CACjB,CACJ,CAAA,CAAA,EAIRK,EAAAA,IAACD,EAAQ,QAAR,CACG,KAAM,SACN,MAAO,MACP,QAAS,OACT,aAAYxB,EACZ,aAAc,GACd,WAAYY,EAEZ,SAAAa,EAAAA,IAACM,EAAA,CACG,KAAM,SACN,SAAU5B,EACV,SAAUM,EACV,SAAAZ,EACA,UAAW8B,EAAAA,GAAGC,qBAAmB,SAAUP,CAAiB,EAC3D,GAAGC,EACJ,aAAcR,EACd,UAAWT,CAAA,CAAA,CACf,CAAA,CACJ,CAAA,CAAA,CAGZ,CACJ,EAEAf,EAAW,YAAc"}