{"version":3,"file":"DatePicker-DJyL-1xW.js","sources":["../../Client/legacy/Components/FormGroups/DatePicker.tsx"],"sourcesContent":["import { Svg } from '@legacy/Components/Svg';\r\nimport { InlineError } from '@legacy/FormFields';\r\nimport { renderComponentInNode } from '@legacy/Renderer';\r\nimport * as Constants from '@shared/Constants';\r\nimport { Value } from '@webkit/index';\r\nimport dayjs from 'dayjs';\r\nimport * as React from 'react';\r\nimport { ReactDatePickerProps } from 'react-datepicker';\r\nimport Datepicker from '../ReactDatepicker';\r\nimport { FormGroup } from './Base';\r\n\r\nexport interface IDatePickerFormGroupProps extends Omit<ReactDatePickerProps, 'onChange'> {\r\n    /** The identifier for the form group. */\r\n    id: string;\r\n\r\n    /** The value class containing the data and validation state for the field. Note that setting this also sets the internal React DatePicker \"selected\" property. */\r\n    date: Value<dayjs.Dayjs | null>;\r\n\r\n    /** The human-readable label shown to the user. */\r\n    label?: string;\r\n\r\n    /** The optional CSS class for the form group. */\r\n    className?: string;\r\n\r\n    /** The optional CSS class for the label. */\r\n    labelClassName?: string;\r\n\r\n    /** The optional Id for the label. */\r\n    labelId?: string;\r\n\r\n    /** The optional CSS class for the input field. */\r\n    inputClassName?: string;\r\n\r\n    /** The optional tab index to support keyboard navigation. */\r\n    tabIndex?: number;\r\n\r\n    /** Optional, turns on homeowners styling if true. */\r\n    homeownersStyle?: boolean;\r\n\r\n    /** Optional, add placeholder text. */\r\n    placeholderText?: string;\r\n\r\n    /** The callback function fired when a date has been selected. */\r\n    onChange: (date: dayjs.Dayjs | null) => void;\r\n\r\n    /** Optional boolean to hide the icon */\r\n    hideIcon?: boolean;\r\n}\r\n\r\n/**\r\n * @deprecated The `DatePickerFormGroup` component should no longer be used. Instead, use `DatePicker` from @webkit for new development.\r\n */\r\nexport class DatePickerFormGroup extends React.Component<IDatePickerFormGroupProps, {}> {\r\n    render() {\r\n        const p = this.props;\r\n        const selectedDate = this.getDate(p.date.content);\r\n\r\n        return (\r\n            <FormGroup\r\n                label={p.label}\r\n                labelId={p.labelId}\r\n                className={`form-group-date-picker-cp ${p.className || ''}`}\r\n                labelClassName={`${p.className || ''}`}\r\n                homeownersStyle={p.homeownersStyle}\r\n            >\r\n                <Datepicker\r\n                    {...p}\r\n                    className={`${p.homeownersStyle ? 'ho-input-cp' : 'form-group-input-cp'} ${\r\n                        p.inputClassName || ''\r\n                    } ${p.date.error ? 'form-group-input-error-cp' : ''}`}\r\n                    selected={p.date && p.date.content ? selectedDate : null}\r\n                    id={p.id}\r\n                    placeholderText={p.placeholderText || ''}\r\n                    onFocus={p.onFocus}\r\n                    onBlur={p.onBlur}\r\n                    onChange={date => p.onChange(date ? dayjs(date).startOf('d') : null)}\r\n                />\r\n\r\n                {!p.hideIcon && (\r\n                    <Svg\r\n                        id='date-picker-icon'\r\n                        className={`form-group-date-picker-icon-cp${p.homeownersStyle ? ' ho-input-icon-cp' : ''}`}\r\n                        alt='Choose a date'\r\n                        path={Constants.iconPaths.calendar}\r\n                    />\r\n                )}\r\n\r\n                <InlineError error={p.date.error} homeownerStyle={p.homeownersStyle} />\r\n            </FormGroup>\r\n        );\r\n    }\r\n\r\n    private getDate(dateInstance: dayjs.Dayjs | null): Date | null {\r\n        if (!dateInstance) {\r\n            return null;\r\n        }\r\n\r\n        // Creating a Date this way will make sure the time component is midnight in the user's time zone, versus calling toDate() which will cause the result\r\n        // to be converted from midnight UTC to the user's time zone, pushing the value to one day in the past\r\n        return new Date(dateInstance.year(), dateInstance.month(), dateInstance.date());\r\n    }\r\n}\r\n\r\ninterface IDatePickerNodeProps {\r\n    id: string;\r\n    className?: string;\r\n    date: Value<dayjs.Dayjs>;\r\n    onChange: (date: dayjs.Dayjs | null) => void;\r\n    minDate?: dayjs.Dayjs;\r\n    maxDate?: dayjs.Dayjs;\r\n}\r\n\r\nexport const getDatePickerNode = (props: IDatePickerNodeProps): Node =>\r\n    renderComponentInNode(\r\n        <DatePickerFormGroup\r\n            id={props.id}\r\n            className={props.className}\r\n            date={props.date}\r\n            onChange={date => props.onChange(date)}\r\n            minDate={props.minDate?.toDate()}\r\n            maxDate={props.maxDate?.toDate()}\r\n            homeownersStyle\r\n        />\r\n    );\r\n"],"names":["DatePickerFormGroup","React.Component","p","selectedDate","jsxs","FormGroup","jsx","Datepicker","date","dayjs","Svg","Constants.iconPaths","InlineError","dateInstance"],"mappings":"yUAoDa,MAAAA,UAA4BC,EAAAA,SAA+C,CACpF,QAAS,CACL,MAAMC,EAAI,KAAK,MACTC,EAAe,KAAK,QAAQD,EAAE,KAAK,OAAO,EAG5C,OAAAE,EAAA,KAACC,EAAA,CACG,MAAOH,EAAE,MACT,QAASA,EAAE,QACX,UAAW,6BAA6BA,EAAE,WAAa,EAAE,GACzD,eAAgB,GAAGA,EAAE,WAAa,EAAE,GACpC,gBAAiBA,EAAE,gBAEnB,SAAA,CAAAI,EAAA,IAACC,EAAA,CACI,GAAGL,EACJ,UAAW,GAAGA,EAAE,gBAAkB,cAAgB,qBAAqB,IACnEA,EAAE,gBAAkB,EACxB,IAAIA,EAAE,KAAK,MAAQ,4BAA8B,EAAE,GACnD,SAAUA,EAAE,MAAQA,EAAE,KAAK,QAAUC,EAAe,KACpD,GAAID,EAAE,GACN,gBAAiBA,EAAE,iBAAmB,GACtC,QAASA,EAAE,QACX,OAAQA,EAAE,OACV,SAAkBM,GAAAN,EAAE,SAASM,EAAOC,EAAMD,CAAI,EAAE,QAAQ,GAAG,EAAI,IAAI,CAAA,CACvE,EAEC,CAACN,EAAE,UACAI,EAAA,IAACI,EAAA,CACG,GAAG,mBACH,UAAW,iCAAiCR,EAAE,gBAAkB,oBAAsB,EAAE,GACxF,IAAI,gBACJ,KAAMS,EAAoB,QAAA,CAC9B,EAGJL,MAACM,GAAY,MAAOV,EAAE,KAAK,MAAO,eAAgBA,EAAE,eAAiB,CAAA,CAAA,CAAA,CACzE,CAAA,CAIA,QAAQW,EAA+C,CAC3D,OAAKA,EAME,IAAI,KAAKA,EAAa,KAAK,EAAGA,EAAa,MAAM,EAAGA,EAAa,MAAM,EALnE,IAKmE,CAEtF"}