How to use the @storybook/components.Form.Input function in @storybook/components

import { Form } from '@storybook/components';

type DateTypeKnobValue = string[];

export interface FileTypeKnob {
  name: string;
  accept: string;
  value: DateTypeKnobValue;
}

export interface FilesTypeProps {
  knob: FileTypeKnob;
  onChange: (value: DateTypeKnobValue) => DateTypeKnobValue;
}

const FileInput = styled(Form.Input)({
  paddingTop: 4,
});

function fileReaderPromise(file: File) {
  return new Promise(resolve => {
    const fileReader = new FileReader();
    fileReader.onload = (e: Event) => resolve((e.currentTarget as FileReader).result as string);
    fileReader.readAsDataURL(file);
  });
}

const serialize = (): undefined => undefined;
const deserialize = (): undefined => undefined;

const FilesType: FunctionComponent & {
  serialize: typeof serialize;

interface DateTypeState {
  valid: boolean | undefined;
}

const FlexSpaced = styled.div({
  flex: 1,
  display: 'flex',
  '&& > *': {
    marginLeft: 10,
  },
  '&& > *:first-of-type': {
    marginLeft: 0,
  },
});
const FlexInput = styled(Form.Input)({ flex: 1 });

const formatDate = (date: Date) => {
  const year = `000${date.getFullYear()}`.slice(-4);
  const month = `0${date.getMonth() + 1}`.slice(-2);
  const day = `0${date.getDate()}`.slice(-2);

  return `${year}-${month}-${day}`;
};

const formatTime = (date: Date) => {
  const hours = `0${date.getHours()}`.slice(-2);
  const minutes = `0${date.getMinutes()}`.slice(-2);

  return `${hours}:${minutes}`;
};