@material-ui/pickers

  • Version 3.3.10
  • Published
  • 1.49 MB
  • 6 dependencies
  • MIT license

Install

npm i @material-ui/pickers
yarn add @material-ui/pickers
pnpm add @material-ui/pickers

Overview

React components, that implements material design pickers for material-ui v4

Index

Variables

variable Calendar

const Calendar: any;

    variable Clock

    const Clock: any;

      variable ClockView

      const ClockView: any;

        variable DatePicker

        const DatePicker: any;

          variable DateTimePicker

          const DateTimePicker: any;

            variable Day

            const Day: any;

              variable KeyboardDatePicker

              const KeyboardDatePicker: any;

                variable KeyboardDateTimePicker

                const KeyboardDateTimePicker: any;

                  variable KeyboardTimePicker

                  const KeyboardTimePicker: any;

                    variable MuiPickersContext

                    const MuiPickersContext: any;

                      variable MuiPickersUtilsProvider

                      const MuiPickersUtilsProvider: any;

                        variable Picker

                        const Picker: any;

                          variable TimePicker

                          const TimePicker: any;

                            variable TimePickerView

                            const TimePickerView: any;

                              Functions

                              function makePickerWithState

                              makePickerWithState: <T extends unknown>({
                              Input,
                              useState,
                              useOptions,
                              getCustomProps,
                              DefaultToolbarComponent,
                              }: MakePickerOptions<T>) => any;

                                function useKeyboardPickerState

                                useKeyboardPickerState: (
                                props: BaseKeyboardPickerProps,
                                options: StateHookOptions
                                ) => {
                                inputProps: {
                                format: string;
                                inputValue: string;
                                onChange: (value: string | null) => void;
                                validationError: any;
                                openPicker: () => false | void;
                                };
                                wrapperProps: {
                                format: string;
                                open: boolean;
                                onClear: () => void;
                                onAccept: () => void;
                                onSetToday: () => void;
                                onDismiss: () => void;
                                };
                                pickerProps: {
                                date: MaterialUiPickersDate;
                                onChange: (newDate: MaterialUiPickersDate, isFinish?: boolean) => void;
                                };
                                };

                                  function usePickerState

                                  usePickerState: (
                                  props: BasePickerProps,
                                  options: StateHookOptions
                                  ) => {
                                  pickerProps: {
                                  date: MaterialUiPickersDate;
                                  onChange: (newDate: MaterialUiPickersDate, isFinish?: boolean) => void;
                                  };
                                  inputProps: {
                                  inputValue: string;
                                  validationError: import('react').ReactNode;
                                  openPicker: () => false | void;
                                  };
                                  wrapperProps: {
                                  format: string;
                                  open: boolean;
                                  onClear: () => void;
                                  onAccept: () => void;
                                  onSetToday: () => void;
                                  onDismiss: () => void;
                                  };
                                  };

                                    function useStaticState

                                    useStaticState: ({
                                    value,
                                    autoOk,
                                    onChange,
                                    defaultFormat,
                                    }: StaticStateOpts) => {
                                    pickerProps: {
                                    date: MaterialUiPickersDate;
                                    onChange: (newDate: MaterialUiPickersDate, isFinish?: boolean) => void;
                                    };
                                    wrapperProps: {
                                    format: string;
                                    open: boolean;
                                    onClear: () => void;
                                    onAccept: () => void;
                                    onSetToday: () => void;
                                    onDismiss: () => void;
                                    };
                                    inputProps: {
                                    inputValue: string;
                                    validationError: import('react').ReactNode;
                                    openPicker: () => false | void;
                                    };
                                    };

                                      function useUtils

                                      useUtils: () => any;

                                        function validate

                                        validate: (
                                        value: ParsableDate,
                                        utils: any,
                                        {
                                        maxDate,
                                        minDate,
                                        disablePast,
                                        disableFuture,
                                        maxDateMessage,
                                        minDateMessage,
                                        invalidDateMessage,
                                        strictCompareDates,
                                        }: Pick<
                                        DatePickerProps,
                                        | 'children'
                                        | 'ref'
                                        | 'label'
                                        | 'select'
                                        | 'style'
                                        | 'title'
                                        | 'value'
                                        | 'className'
                                        | 'innerRef'
                                        | 'key'
                                        | 'defaultChecked'
                                        | 'defaultValue'
                                        | 'suppressContentEditableWarning'
                                        | 'suppressHydrationWarning'
                                        | 'accessKey'
                                        | 'contentEditable'
                                        | 'contextMenu'
                                        | 'dir'
                                        | 'draggable'
                                        | 'hidden'
                                        | 'id'
                                        | 'lang'
                                        | 'placeholder'
                                        | 'slot'
                                        | 'spellCheck'
                                        | 'tabIndex'
                                        | 'radioGroup'
                                        | 'role'
                                        | 'about'
                                        | 'datatype'
                                        | 'inlist'
                                        | 'prefix'
                                        | 'property'
                                        | 'resource'
                                        | 'typeof'
                                        | 'vocab'
                                        | 'autoCapitalize'
                                        | 'autoCorrect'
                                        | 'autoSave'
                                        | 'color'
                                        | 'itemProp'
                                        | 'itemScope'
                                        | 'itemType'
                                        | 'itemID'
                                        | 'itemRef'
                                        | 'results'
                                        | 'security'
                                        | 'unselectable'
                                        | 'inputMode'
                                        | 'is'
                                        | 'aria-activedescendant'
                                        | 'aria-atomic'
                                        | 'aria-autocomplete'
                                        | 'aria-busy'
                                        | 'aria-checked'
                                        | 'aria-colcount'
                                        | 'aria-colindex'
                                        | 'aria-colspan'
                                        | 'aria-controls'
                                        | 'aria-current'
                                        | 'aria-describedby'
                                        | 'aria-details'
                                        | 'aria-disabled'
                                        | 'aria-dropeffect'
                                        | 'aria-errormessage'
                                        | 'aria-expanded'
                                        | 'aria-flowto'
                                        | 'aria-grabbed'
                                        | 'aria-haspopup'
                                        | 'aria-hidden'
                                        | 'aria-invalid'
                                        | 'aria-keyshortcuts'
                                        | 'aria-label'
                                        | 'aria-labelledby'
                                        | 'aria-level'
                                        | 'aria-live'
                                        | 'aria-modal'
                                        | 'aria-multiline'
                                        | 'aria-multiselectable'
                                        | 'aria-orientation'
                                        | 'aria-owns'
                                        | 'aria-placeholder'
                                        | 'aria-posinset'
                                        | 'aria-pressed'
                                        | 'aria-readonly'
                                        | 'aria-relevant'
                                        | 'aria-required'
                                        | 'aria-roledescription'
                                        | 'aria-rowcount'
                                        | 'aria-rowindex'
                                        | 'aria-rowspan'
                                        | 'aria-selected'
                                        | 'aria-setsize'
                                        | 'aria-sort'
                                        | 'aria-valuemax'
                                        | 'aria-valuemin'
                                        | 'aria-valuenow'
                                        | 'aria-valuetext'
                                        | 'dangerouslySetInnerHTML'
                                        | 'onCopy'
                                        | 'onCopyCapture'
                                        | 'onCut'
                                        | 'onCutCapture'
                                        | 'onPaste'
                                        | 'onPasteCapture'
                                        | 'onCompositionEnd'
                                        | 'onCompositionEndCapture'
                                        | 'onCompositionStart'
                                        | 'onCompositionStartCapture'
                                        | 'onCompositionUpdate'
                                        | 'onCompositionUpdateCapture'
                                        | 'onFocus'
                                        | 'onFocusCapture'
                                        | 'onBlur'
                                        | 'onBlurCapture'
                                        | 'onChange'
                                        | 'onChangeCapture'
                                        | 'onBeforeInput'
                                        | 'onBeforeInputCapture'
                                        | 'onInput'
                                        | 'onInputCapture'
                                        | 'onReset'
                                        | 'onResetCapture'
                                        | 'onSubmit'
                                        | 'onSubmitCapture'
                                        | 'onInvalid'
                                        | 'onInvalidCapture'
                                        | 'onLoad'
                                        | 'onLoadCapture'
                                        | 'onError'
                                        | 'onErrorCapture'
                                        | 'onKeyDown'
                                        | 'onKeyDownCapture'
                                        | 'onKeyPress'
                                        | 'onKeyPressCapture'
                                        | 'onKeyUp'
                                        | 'onKeyUpCapture'
                                        | 'onAbort'
                                        | 'onAbortCapture'
                                        | 'onCanPlay'
                                        | 'onCanPlayCapture'
                                        | 'onCanPlayThrough'
                                        | 'onCanPlayThroughCapture'
                                        | 'onDurationChange'
                                        | 'onDurationChangeCapture'
                                        | 'onEmptied'
                                        | 'onEmptiedCapture'
                                        | 'onEncrypted'
                                        | 'onEncryptedCapture'
                                        | 'onEnded'
                                        | 'onEndedCapture'
                                        | 'onLoadedData'
                                        | 'onLoadedDataCapture'
                                        | 'onLoadedMetadata'
                                        | 'onLoadedMetadataCapture'
                                        | 'onLoadStart'
                                        | 'onLoadStartCapture'
                                        | 'onPause'
                                        | 'onPauseCapture'
                                        | 'onPlay'
                                        | 'onPlayCapture'
                                        | 'onPlaying'
                                        | 'onPlayingCapture'
                                        | 'onProgress'
                                        | 'onProgressCapture'
                                        | 'onRateChange'
                                        | 'onRateChangeCapture'
                                        | 'onSeeked'
                                        | 'onSeekedCapture'
                                        | 'onSeeking'
                                        | 'onSeekingCapture'
                                        | 'onStalled'
                                        | 'onStalledCapture'
                                        | 'onSuspend'
                                        | 'onSuspendCapture'
                                        | 'onTimeUpdate'
                                        | 'onTimeUpdateCapture'
                                        | 'onVolumeChange'
                                        | 'onVolumeChangeCapture'
                                        | 'onWaiting'
                                        | 'onWaitingCapture'
                                        | 'onAuxClick'
                                        | 'onAuxClickCapture'
                                        | 'onClick'
                                        | 'onClickCapture'
                                        | 'onContextMenu'
                                        | 'onContextMenuCapture'
                                        | 'onDoubleClick'
                                        | 'onDoubleClickCapture'
                                        | 'onDrag'
                                        | 'onDragCapture'
                                        | 'onDragEnd'
                                        | 'onDragEndCapture'
                                        | 'onDragEnter'
                                        | 'onDragEnterCapture'
                                        | 'onDragExit'
                                        | 'onDragExitCapture'
                                        | 'onDragLeave'
                                        | 'onDragLeaveCapture'
                                        | 'onDragOver'
                                        | 'onDragOverCapture'
                                        | 'onDragStart'
                                        | 'onDragStartCapture'
                                        | 'onDrop'
                                        | 'onDropCapture'
                                        | 'onMouseDown'
                                        | 'onMouseDownCapture'
                                        | 'onMouseEnter'
                                        | 'onMouseLeave'
                                        | 'onMouseMove'
                                        | 'onMouseMoveCapture'
                                        | 'onMouseOut'
                                        | 'onMouseOutCapture'
                                        | 'onMouseOver'
                                        | 'onMouseOverCapture'
                                        | 'onMouseUp'
                                        | 'onMouseUpCapture'
                                        | 'onSelect'
                                        | 'onSelectCapture'
                                        | 'onTouchCancel'
                                        | 'onTouchCancelCapture'
                                        | 'onTouchEnd'
                                        | 'onTouchEndCapture'
                                        | 'onTouchMove'
                                        | 'onTouchMoveCapture'
                                        | 'onTouchStart'
                                        | 'onTouchStartCapture'
                                        | 'onPointerDown'
                                        | 'onPointerDownCapture'
                                        | 'onPointerMove'
                                        | 'onPointerMoveCapture'
                                        | 'onPointerUp'
                                        | 'onPointerUpCapture'
                                        | 'onPointerCancel'
                                        | 'onPointerCancelCapture'
                                        | 'onPointerEnter'
                                        | 'onPointerEnterCapture'
                                        | 'onPointerLeave'
                                        | 'onPointerLeaveCapture'
                                        | 'onPointerOver'
                                        | 'onPointerOverCapture'
                                        | 'onPointerOut'
                                        | 'onPointerOutCapture'
                                        | 'onGotPointerCapture'
                                        | 'onGotPointerCaptureCapture'
                                        | 'onLostPointerCapture'
                                        | 'onLostPointerCaptureCapture'
                                        | 'onScroll'
                                        | 'onScrollCapture'
                                        | 'onWheel'
                                        | 'onWheelCapture'
                                        | 'onAnimationStart'
                                        | 'onAnimationStartCapture'
                                        | 'onAnimationEnd'
                                        | 'onAnimationEndCapture'
                                        | 'onAnimationIteration'
                                        | 'onAnimationIterationCapture'
                                        | 'onTransitionEnd'
                                        | 'onTransitionEndCapture'
                                        | 'variant'
                                        | 'error'
                                        | 'name'
                                        | 'margin'
                                        | 'size'
                                        | 'open'
                                        | 'disabled'
                                        | 'type'
                                        | 'format'
                                        | 'orientation'
                                        | 'autoFocus'
                                        | 'autoComplete'
                                        | 'readOnly'
                                        | 'required'
                                        | 'rows'
                                        | 'fullWidth'
                                        | 'onMonthChange'
                                        | 'leftArrowIcon'
                                        | 'rightArrowIcon'
                                        | 'leftArrowButtonProps'
                                        | 'rightArrowButtonProps'
                                        | 'onClose'
                                        | 'onAccept'
                                        | 'okLabel'
                                        | 'cancelLabel'
                                        | 'clearLabel'
                                        | 'todayLabel'
                                        | 'clearable'
                                        | 'showTodayButton'
                                        | 'DialogProps'
                                        | 'PopoverProps'
                                        | 'hiddenLabel'
                                        | 'InputProps'
                                        | 'inputProps'
                                        | 'FormHelperTextProps'
                                        | 'helperText'
                                        | 'InputLabelProps'
                                        | 'inputRef'
                                        | 'multiline'
                                        | 'rowsMax'
                                        | 'SelectProps'
                                        | 'onOpen'
                                        | 'minDate'
                                        | 'maxDate'
                                        | 'disablePast'
                                        | 'disableFuture'
                                        | 'renderDay'
                                        | 'allowKeyboardControl'
                                        | 'shouldDisableDate'
                                        | 'loadingIndicator'
                                        | 'inputVariant'
                                        | 'TextFieldComponent'
                                        | 'initialFocusedDate'
                                        | 'autoOk'
                                        | 'minDateMessage'
                                        | 'maxDateMessage'
                                        | 'invalidDateMessage'
                                        | 'labelFunc'
                                        | 'invalidLabel'
                                        | 'emptyLabel'
                                        | 'disableToolbar'
                                        | 'ToolbarComponent'
                                        | 'strictCompareDates'
                                        | 'animateYearScrolling'
                                        | 'onYearChange'
                                        >
                                        ) => any;

                                          Interfaces

                                          interface BaseDatePickerProps

                                          interface BaseDatePickerProps extends OutterCalendarProps {}

                                            property animateYearScrolling

                                            animateYearScrolling?: boolean;
                                            • To animate scrolling to current year (using scrollIntoView) false

                                            property disableFuture

                                            disableFuture?: boolean;
                                            • Disable future dates false

                                            property disablePast

                                            disablePast?: boolean;
                                            • Disable past dates false

                                            property maxDate

                                            maxDate?: ParsableDate;
                                            • Max selectable date Date(2100-01-01)

                                            property minDate

                                            minDate?: ParsableDate;
                                            • Min selectable date Date(1900-01-01)

                                            property onYearChange

                                            onYearChange?: (date: MaterialUiPickersDate) => void;
                                            • Callback firing on year change

                                            property strictCompareDates

                                            strictCompareDates?: boolean;
                                            • Compare dates by the exact timestamp, instead of start/end of date false

                                            interface BaseTimePickerProps

                                            interface BaseTimePickerProps {}

                                              property ampm

                                              ampm?: boolean;
                                              • 12h/24h view for hour selection clock true

                                              property minutesStep

                                              minutesStep?: number;
                                              • Step over minutes 1

                                              interface DatePickerViewsProps

                                              interface DatePickerViewsProps extends BaseDatePickerProps {}

                                                property openTo

                                                openTo?: DatePickerView;
                                                • First view to show in DatePicker

                                                property views

                                                views?: DatePickerView[];
                                                • Array of views to show {Array<"year" | "date" | "month">}

                                                interface DateTimePickerViewsProps

                                                interface DateTimePickerViewsProps extends BaseDateTimePickerProps {}

                                                  property dateRangeIcon

                                                  dateRangeIcon?: React.ReactNode;
                                                  • Date tab icon

                                                  property hideTabs

                                                  hideTabs?: boolean;
                                                  • To show tabs

                                                  property openTo

                                                  openTo?: 'year' | 'date' | 'month' | 'hours' | 'minutes';
                                                  • First view to show in DatePicker

                                                  property timeIcon

                                                  timeIcon?: React.ReactNode;
                                                  • Time tab icon

                                                  property views

                                                  views?: ('year' | 'date' | 'month' | 'hours' | 'minutes')[];
                                                  • Array of views to show

                                                  interface TimePickerViewsProps

                                                  interface TimePickerViewsProps extends BaseTimePickerProps {}

                                                    property openTo

                                                    openTo?: 'hours' | 'minutes' | 'seconds';
                                                    • First view to show in timepicker

                                                    property views

                                                    views?: ('hours' | 'minutes' | 'seconds')[];
                                                    • Array of views to show

                                                    Type Aliases

                                                    type BaseDateTimePickerProps

                                                    type BaseDateTimePickerProps = BaseTimePickerProps & BaseDatePickerProps;

                                                      type DatePickerProps

                                                      type DatePickerProps = WithPureInputProps & DatePickerViewsProps;

                                                        type DatePickerView

                                                        type DatePickerView = 'year' | 'date' | 'month';

                                                          type DateTimePickerProps

                                                          type DateTimePickerProps = WithPureInputProps & DateTimePickerViewsProps;

                                                            type DateTimePickerView

                                                            type DateTimePickerView = 'year' | 'date' | 'month' | 'hours' | 'minutes';

                                                              type KeyboardDatePickerProps

                                                              type KeyboardDatePickerProps = WithKeyboardInputProps & DatePickerViewsProps;

                                                                type KeyboardDateTimePickerProps

                                                                type KeyboardDateTimePickerProps = WithKeyboardInputProps & DateTimePickerViewsProps;

                                                                  type KeyboardTimePickerProps

                                                                  type KeyboardTimePickerProps = WithKeyboardInputProps & TimePickerViewsProps;

                                                                    type TimePickerProps

                                                                    type TimePickerProps = WithPureInputProps & TimePickerViewsProps;

                                                                      Package Files (16)

                                                                      Dependencies (6)

                                                                      Dev Dependencies (0)

                                                                      No dev dependencies.

                                                                      Peer Dependencies (5)

                                                                      Badge

                                                                      To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                                                      You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@material-ui/pickers.

                                                                      • Markdown
                                                                        [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/@material-ui/pickers)
                                                                      • HTML
                                                                        <a href="https://www.jsdocs.io/package/@material-ui/pickers"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>