How to use the react-view.PropTypes.Date function in react-view

locale: {
      value: undefined,
      type: PropTypes.Object,
      description:
        'A locale object. See date-fns for more details https://github.com/date-fns/date-fns/tree/master/src/locale.',
      hidden: true,
    },
    maxDate: {
      value: undefined,
      type: PropTypes.Date,
      description: 'A max date that is selectable.',
      placeholder: '2020-10-17T07:00:00.000Z',
    },
    minDate: {
      value: undefined,
      type: PropTypes.Date,
      description: 'A min date that is selectable.',
      placeholder: '2018-10-17T07:00:00.000Z',
    },
    monthsShown: {
      value: undefined,
      type: PropTypes.Number,
      description: 'A number of months rendered in the calendar.',
      hidden: true,
    },
    onDayClick: {
      value: undefined,
      type: PropTypes.Function,
      placeholder: '({ date, event }) => {}',
      description: `Day's click event handler.`,
      hidden: true,
    },

stateful: true,
    },
    onChange: {
      value: '({ id }) => setValue(id)',
      type: PropTypes.Function,
      description: 'Callback for when the timezone selection changes.',
      propHook: {
        what: 'id',
        into: 'value',
      },
    },
    positive: inputConfig.props.positive,
    error: inputConfig.props.error,
    date: {
      value: new Date().toISOString(),
      type: PropTypes.Date,
      description:
        'If not provided, defaults to new Date(). Important to note that the timezone picker only displays options related to the provided date. Take Pacific Time for example. On March 9th, Pacific Time equates to the more specific Pacific Standard Time. On March 10th, it operates on Pacific Daylight Time. The timezone picker will never display PST and PDT together. If you need exact specificity, provide a date. Otherwise it will default to the relevant timezone at render.',
    },
    mapLabels: {
      value: undefined,
      type: PropTypes.Function,
      placeholder: '({ id, label }) => "Test"',
      description: `Customize the option's label. Useful for translations and optionally mapping from 'America/Los_Angeles' to 'Pacific Time'.`,
    },
    disabled: inputConfig.props.disabled,
    overrides: {
      value: undefined,
      type: PropTypes.Custom,
      description: 'Lets you customize all aspects of the component.',
      custom: {
        names: [],

<label>{name}</label>
          
            React Ref documentation
          
          
        
      );
    case PropTypes.String:
    case PropTypes.Date:
    case PropTypes.Number:
      return (
        
          <label>{name}</label>
          <input> set((event.target as HTMLInputElement).value)}
            placeholder={placeholder}
            size="compact"
            value={val ? String(val) : undefined}
          /&gt;
          
        
      );
    case PropTypes.Boolean:
      return (

import selectConfig from './select';

const timepickerProps = require('!!extract-react-types-loader!../../../../src/timepicker/timepicker.js');

const TimepickerConfig: TConfig = {
  imports: {
    'baseui/timepicker': {named: ['TimePicker']},
  },
  scope: {
    TimePicker,
  },
  theme: selectConfig.theme,
  props: {
    value: {
      value: new Date().toISOString(),
      type: PropTypes.Date,
      description:
        'Optional value that can be provided to fully control the component. If not provided, TimePicker will manage state internally and default to the closest step to new Date().',
      stateful: true,
    },
    onChange: {
      value: 'date => setValue(date)',
      type: PropTypes.Function,
      description: 'Callback for when time selection changes.',
      propHook: {
        what: 'date.toISOString()',
        into: 'value',
      },
    },
    creatable: {
      value: undefined,
      type: PropTypes.Boolean,

value: undefined,
      type: PropTypes.Array,
      description:
        'Array of custom options (Array<{ id: string; beginDate: Date }>) displayed in the quick select. Overrides default options if provided.',
      hidden: true,
    },
    filterDate: {
      value: undefined,
      type: PropTypes.Function,
      description:
        'A filter function (Date => boolean) that is called to check the disabled state of a day. If false is returned the day is considered to be disabled.',
      hidden: true,
    },
    highlightDate: {
      value: undefined,
      type: PropTypes.Date,
      description:
        'Indicates a highlighted date on hover and keyboard navigation',
      hidden: true,
    },
    includesDates: {
      value: undefined,
      type: PropTypes.Array,
      description: 'A list Array of selectable dates.',
      hidden: true,
    },
    range: {
      value: undefined,
      type: PropTypes.Boolean,
      description: 'Defines if a range of dates can be selected.',
    },
    positive: inputConfig.props.positive,