{"version":3,"file":"DateTimePickerPanel.mjs","sources":["../../../../src/lib/nextGenComponents/components/CustomRangePicker/DateTimePickerPanel.tsx"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react'\nimport type { DateRange } from 'react-day-picker'\n\nimport {\n  MaskedInput,\n  isMaskComplete,\n  type MaskItem\n} from '@/components/CustomRangePicker/MaskedInput'\nimport { TimePickerInput } from '@/components/CustomRangePicker/TimePickerInput'\nimport { Calendar } from '@/components/ui/calendar'\nimport { cn } from '@/lib/utils'\nimport {\n  formatLocalDate,\n  getDatePlaceholder,\n  getSupportedLocale,\n  parseLocalDate\n} from '@/utils/date.utils'\n\ntype Props = {\n  label: string\n  side: 'start' | 'end'\n  dateValue?: Date\n  range?: DateRange\n  hourValue: string\n  singleDate?: boolean\n  onHourChange: (value: string) => void\n  onSelectDate: (selectedDate?: Date) => void\n}\n\nconst PLACEHOLDER_CHAR = '_' as const\n\nconst buildLocalDateMask = (): ((value: string) => MaskItem[]) => {\n  const isUS = getSupportedLocale() === 'en-US'\n\n  if (isUS) {\n    return (value: string): MaskItem[] => {\n      const monthFirst = value[0]\n      const dayFirst = value[3]\n      return [\n        /[0-1]/,\n        monthFirst === '1' ? /[0-2]/ : /\\d/,\n        '/',\n        /[0-3]/,\n        dayFirst === '3' ? /[0-1]/ : /\\d/,\n        '/',\n        /[1-2]/,\n        /\\d/,\n        /\\d/,\n        /\\d/\n      ]\n    }\n  }\n\n  return (value: string): MaskItem[] => {\n    const dayFirst = value[0]\n    const monthFirst = value[3]\n    return [\n      /[0-3]/,\n      dayFirst === '3' ? /[0-1]/ : /\\d/,\n      '/',\n      /[0-1]/,\n      monthFirst === '1' ? /[0-2]/ : /\\d/,\n      '/',\n      /[1-2]/,\n      /\\d/,\n      /\\d/,\n      /\\d/\n    ]\n  }\n}\n\nconst dateMask = buildLocalDateMask()\nconst datePlaceholder = getDatePlaceholder()\n\nexport const DateTimePickerPanel = ({\n  label,\n  side,\n  dateValue,\n  range,\n  hourValue,\n  singleDate,\n  onHourChange,\n  onSelectDate\n}: Props) => {\n  const [maskedDate, setMaskedDate] = useState(dateValue ? formatLocalDate(dateValue) : '')\n  const [displayedMonth, setDisplayedMonth] = useState<Date>(dateValue ?? new Date())\n\n  useEffect(() => {\n    setMaskedDate(dateValue ? formatLocalDate(dateValue) : '')\n    if (dateValue) {\n      setDisplayedMonth(dateValue)\n    }\n  }, [dateValue])\n\n  const handleMaskedDateChange = useCallback(\n    (masked: string) => {\n      setMaskedDate(masked)\n      if (!masked) {\n        onSelectDate(undefined)\n        return\n      }\n      if (isMaskComplete(masked, PLACEHOLDER_CHAR)) {\n        const parsed = parseLocalDate(masked)\n        if (parsed) onSelectDate(parsed)\n      }\n    },\n    [onSelectDate]\n  )\n\n  const handleDateBlur = useCallback(() => {\n    if (!maskedDate) {\n      onSelectDate(undefined)\n      return\n    }\n    if (isMaskComplete(maskedDate, PLACEHOLDER_CHAR)) {\n      const parsed = parseLocalDate(maskedDate)\n      if (parsed) {\n        setMaskedDate(formatLocalDate(parsed))\n        onSelectDate(parsed)\n      } else {\n        setMaskedDate(dateValue ? formatLocalDate(dateValue) : '')\n      }\n    } else {\n      setMaskedDate(dateValue ? formatLocalDate(dateValue) : '')\n    }\n  }, [maskedDate, dateValue, onSelectDate])\n\n  return (\n    <div className=\"flex flex-col gap-6\">\n      <div className=\"flex gap-2\">\n        <MaskedInput\n          mask={dateMask}\n          value={maskedDate}\n          onChange={handleMaskedDateChange}\n          onBlur={handleDateBlur}\n          textPlaceholder={datePlaceholder}\n          className={cn(\n            'h-10 flex-1 w-[116px] text-center text-[14px] border border-[#C4C2C8] rounded-md focus-visible:ring-1 focus-visible:ring-igz-light-purple focus-visible:outline-none',\n            dateValue ? 'text-igz-primary' : 'text-[#C4C2C8]'\n          )}\n        />\n\n        <TimePickerInput value={hourValue} onChange={onHourChange} className=\"w-[110px]\" />\n      </div>\n\n      <Calendar\n        mode=\"single\"\n        month={displayedMonth}\n        onMonthChange={setDisplayedMonth}\n        selected={dateValue}\n        onSelect={onSelectDate}\n        className=\"[--calendar-padding:0rem] border-none\"\n        classNames={{\n          weekday: 'text-[#ADABB0] uppercase font-normal text-[12px] w-full',\n          caption_label: 'text-igz-primary font-normal text-[20px]'\n        }}\n        range={range}\n        activeRangeSide={side}\n        captionPrefix={label}\n        singleDate={singleDate}\n      />\n    </div>\n  )\n}\n"],"names":["PLACEHOLDER_CHAR","buildLocalDateMask","getSupportedLocale","value","monthFirst","dayFirst","dateMask","datePlaceholder","getDatePlaceholder","DateTimePickerPanel","label","side","dateValue","range","hourValue","singleDate","onHourChange","onSelectDate","maskedDate","setMaskedDate","useState","formatLocalDate","displayedMonth","setDisplayedMonth","useEffect","handleMaskedDateChange","useCallback","masked","isMaskComplete","parsed","parseLocalDate","handleDateBlur","jsxs","jsx","MaskedInput","cn","TimePickerInput","Calendar"],"mappings":"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"}