@navinc/base-react-components/dist/date-picker.d.ts

Nav's Pattern Library

import { FocusEvent } from 'react';
import { InferComponentProps } from './types.js';
type Field = 'day' | 'month' | 'year';
type Value = {
    day?: string | number;
    month?: string | number;
    year?: string | number;
};
type DatePickerProps = Omit<InferComponentProps<typeof DatePickerWrapper>, 'onBlur' | 'onChange'> & {
    errors?: string[];
    fieldsToShow?: Field[];
    hasSpaceForErrors?: boolean;
    isInvalid?: boolean;
    label?: string;
    name?: string;
    enabledMonths?: string[];
    onBlur?: ((e: FocusEvent<HTMLSelectElement>) => void) & ((e: FocusEvent<HTMLInputElement>) => void);
    onChange?: (e: {
        target: {
            value: Value;
        };
    }) => void;
    value?: Value;
};
export declare const DatePickerWrapper: import("styled-components/dist/types.js").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
/**
 * @deprecated This component is deprecated and will be removed in a future release. Avoid using it in new code.
 */
export declare const DatePickerInputWrapper: import("styled-components/dist/types.js").IStyledComponentBase<"web", import("styled-components/dist/types.js").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
    fieldsToShow?: Field[];
}>> & string;
export declare function isDateValid(dateIn?: {
    year?: string | number;
    month?: string | number;
    day?: string | number;
}): boolean;
/**
All form-element components expect to be controlled components. This makes them
immediately compatible with form managers like formik or redux-form, as well as
within any stateful component.

In addition to native form element attributes, all form-element components
implement these props

```
<DatePicker
  errors={touched.businessStartDate && errors.businessStartDate}
  fieldsToShow={['year', 'month']}
  isInvalid={touched.businessStartDate && errors.businessStartDate}
  label='Business start date'
  onBlur={() => setFieldTouched('businessStartDate')}
  onChange={(e) => setFieldValue('businessStartDate', e.target.value)}
  value={{
    day: 25,
    month: 12,
    year: 1950
  }}
/>
```
 *
 * @deprecated This component is deprecated and will be removed in a future release. Avoid using it in new code.
 */
export declare const DatePicker: import("styled-components/dist/types.js").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<InferComponentProps<import("styled-components/dist/types.js").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string>, "onBlur" | "onChange"> & {
    errors?: string[];
    fieldsToShow?: Field[];
    hasSpaceForErrors?: boolean;
    isInvalid?: boolean;
    label?: string;
    name?: string;
    enabledMonths?: string[];
    onBlur?: ((e: FocusEvent<HTMLSelectElement>) => void) & ((e: FocusEvent<HTMLInputElement>) => void);
    onChange?: (e: {
        target: {
            value: Value;
        };
    }) => void;
    value?: Value;
}, never>> & string & Omit<({ errors, fieldsToShow, hasSpaceForErrors, isInvalid, label, name, onBlur, onChange, value, enabledMonths, ...rest }: DatePickerProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
export {};