@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
34 lines (33 loc) • 2.38 kB
TypeScript
import type { FieldProps, Validator, ValidatorWithCustomValidators } from '../../types';
import { DatePickerProps } from '../../../../components/DatePicker';
export type DateValidator = ValidatorWithCustomValidators<string, {
dateValidator: Validator<string>;
}>;
export type DateProps = Omit<FieldProps<string, undefined | string>, 'onBlurValidator'> & {
pattern?: string;
/**
* Defines if the Date field should support a value of two dates (starting and ending date).
* The value needs to be a string containing two dates, separated by a pipe character (`|`) i.e. (`01-09-2024|30-09-2024`) when this is set to `true`.
* Defaults to `false`.
*/
range?: DatePickerProps['range'];
/**
* If the input fields with the mask should be visible. Defaults to `true`.
*/
showInput?: DatePickerProps['showInput'];
/**
* If set to `true`, a cancel button will be shown. You can change the default text by using `cancel_button_text="Avbryt"` Defaults to `true`. If the `range` prop is `true`, then the cancel button is shown.
*/
showCancelButton?: DatePickerProps['showCancelButton'];
/**
* If set to `true`, a reset button will be shown. You can change the default text by using `resetButtonText="Tilbakestill"`. When clicked, the field resets to the initial `value` or `defaultValue`. If no initial value was provided, the field is cleared. Defaults to `true`.
*/
showResetButton?: DatePickerProps['showResetButton'];
onBlurValidator?: DateValidator | false;
} & Pick<DatePickerProps, 'month' | 'startMonth' | 'endMonth' | 'minDate' | 'maxDate' | 'maskOrder' | 'maskPlaceholder' | 'dateFormat' | 'returnFormat' | 'hideNavigation' | 'hideDays' | 'onlyMonth' | 'hideLastWeek' | 'disableAutofocus' | 'showSubmitButton' | 'submitButtonText' | 'cancelButtonText' | 'resetButtonText' | 'firstDay' | 'link' | 'size' | 'sync' | 'addonElement' | 'shortcuts' | 'opened' | 'direction' | 'alignPicker' | 'onDaysRender' | 'onType' | 'onShow' | 'onHide' | 'onSubmit' | 'onCancel' | 'onReset' | 'skipPortal' | 'yearNavigation' | 'tooltip'>;
declare function DateComponent(props: DateProps): import("react/jsx-runtime").JSX.Element;
declare namespace DateComponent {
var _supportsSpacingProps: boolean;
}
export declare function parseRangeValue(value: DateProps['value']): string[];
export default DateComponent;