@yamada-ui/calendar
Version:
Yamada UI calendar component
106 lines (103 loc) • 3.46 kB
TypeScript
import * as _yamada_ui_core from '@yamada-ui/core';
import { ThemeProps, FC, HTMLUIProps } from '@yamada-ui/core';
import { IconProps } from '@yamada-ui/icon';
import { MotionProps } from '@yamada-ui/motion';
import { PortalProps } from '@yamada-ui/portal';
import { ReactNode, RefAttributes } from 'react';
import { UseDatePickerProps } from './use-date-picker.js';
import '@yamada-ui/popover';
import './calendar.js';
import './calendar-header.js';
import '@yamada-ui/button';
import './use-calendar-header.js';
import './month.js';
import './month-list.js';
import './use-calendar.js';
import 'dayjs';
import './year-list.js';
import './use-calendar-picker.js';
import '@yamada-ui/form-control';
interface DatePickerOptions {
children?: FC<{
value: Date | undefined;
onClose: () => void;
}> | ReactNode;
/**
* If `true`, display the date picker clear icon.
*
* @default true
*/
clearable?: boolean;
/**
* The border color when the input is invalid.
*/
errorBorderColor?: string;
/**
* The border color when the input is focused.
*/
focusBorderColor?: string;
/**
* If `true`, display the date picker clear icon.
*
* @default true
*
* @deprecated Use `clearable` instead.
*/
isClearable?: boolean;
/**
* Props for date picker clear icon element.
*/
clearIconProps?: DatePickerIconProps;
/**
* Props for date picker container element.
*/
containerProps?: Omit<HTMLUIProps, "children">;
/**
* Props for month picker container element.
*/
contentProps?: Omit<MotionProps, "children">;
/**
* Props for date picker field element.
*/
fieldProps?: Omit<DatePickerFieldProps, "children" | "inputProps">;
/**
* Props for date picker icon element.
*/
iconProps?: DatePickerIconProps;
/**
* Props for date picker input element.
*/
inputProps?: DatePickerFieldProps["inputProps"];
/**
* Props to be forwarded to the portal component.
*
* @default '{ disabled: true }'
*
*/
portalProps?: Omit<PortalProps, "children">;
}
interface DatePickerProps extends ThemeProps<"DatePicker">, DatePickerOptions, UseDatePickerProps {
}
/**
* `DatePicker` is a component used for users to select a date.
*
* @see Docs https://yamada-ui.com/components/forms/date-picker
*/
declare const DatePicker: _yamada_ui_core.Component<"input", DatePickerProps>;
interface DatePickerFieldOptions {
inputProps?: HTMLUIProps<"input"> & RefAttributes<HTMLInputElement>;
}
interface DatePickerFieldProps extends HTMLUIProps, DatePickerFieldOptions {
}
declare const DatePickerField: _yamada_ui_core.Component<"input", DatePickerFieldProps>;
interface DatePickerIconProps extends Omit<HTMLUIProps, "clear"> {
}
declare const DatePickerIcon: _yamada_ui_core.Component<"div", DatePickerIconProps>;
interface DatePickerCalendarIconProps extends IconProps {
}
declare const DatePickerCalendarIcon: FC<DatePickerCalendarIconProps>;
interface DatePickerClearIconProps extends DatePickerIconProps {
disabled?: boolean;
}
declare const DatePickerClearIcon: FC<DatePickerClearIconProps>;
export { DatePicker, DatePickerCalendarIcon, type DatePickerCalendarIconProps, DatePickerClearIcon, type DatePickerClearIconProps, DatePickerField, type DatePickerFieldProps, DatePickerIcon, type DatePickerIconProps, type DatePickerProps };