How to use the @teleporthq/teleport-types.ComponentType.REACT function in @teleporthq/teleport-types

const createComponentGenerator = (componentType: ComponentType, styleVariation: StyleVariation) => {
  const generatorFactory = componentGeneratorFactories[componentType]

  if (!generatorFactory) {
    throw new Error(`Invalid ComponentType: ${componentType}`)
  }

  if (
    componentType === ComponentType.REACT ||
    componentType === ComponentType.PREACT ||
    componentType === ComponentType.REACTNATIVE
  ) {
    // @ts-ignore
    return generatorFactory(styleVariation)
  }

  return generatorFactory()
}

it('creates a react component', async () => {
    const options: GenerateOptions = {
      componentType: ComponentType.REACT,
      styleVariation: ReactStyleVariation.CSSModules,
    }

    const { files } = await generateComponent(componentUIDL, options)
    expect(files.length).toBe(2)
  })

export const generateComponent: GenerateComponentFunction = async (
  componentUIDL: ComponentUIDL,
  { componentType = ComponentType.REACT, styleVariation = ReactStyleVariation.CSSModules } = {}
) => {
  const generator = createComponentGenerator(componentType, styleVariation)
  const projectMapping = componentGeneratorProjectMappings[componentType]
  generator.addMapping(projectMapping)
  return generator.generateComponent(componentUIDL)
}

import { createVueComponentGenerator } from '@teleporthq/teleport-component-generator-vue'
import { createStencilComponentGenerator } from '@teleporthq/teleport-component-generator-stencil'
import { createAngularComponentGenerator } from '@teleporthq/teleport-component-generator-angular'
import { createReactNativeComponentGenerator } from '@teleporthq/teleport-component-generator-reactnative'

const componentGeneratorFactories = {
  [ComponentType.REACT]: createReactComponentGenerator,
  [ComponentType.PREACT]: createPreactComponentGenerator,
  [ComponentType.ANGULAR]: createAngularComponentGenerator,
  [ComponentType.VUE]: createVueComponentGenerator,
  [ComponentType.STENCIL]: createStencilComponentGenerator,
  [ComponentType.REACTNATIVE]: createReactNativeComponentGenerator,
}

const componentGeneratorProjectMappings = {
  [ComponentType.REACT]: ReactProjectMapping,
  [ComponentType.PREACT]: PreactProjectMapping,
  [ComponentType.ANGULAR]: AngularProjectMapping,
  [ComponentType.VUE]: VueProjectMapping,
  [ComponentType.STENCIL]: StencilProjectMapping,
  [ComponentType.REACTNATIVE]: ReactNativeProjectMapping,
}

const projectGeneratorFactories = {
  [ProjectType.REACT]: createReactProjectGenerator,
  [ProjectType.NEXT]: createNextProjectGenerator,
  [ProjectType.VUE]: createVueProjectGenerator,
  [ProjectType.NUXT]: createNuxtProjectGenerator,
  [ProjectType.PREACT]: createPreactProjectGenerator,
  [ProjectType.STENCIL]: createStencilProjectGenerator,
  [ProjectType.ANGULAR]: createAngularProjectGenerator,
  [ProjectType.REACTNATIVE]: createReactNativeProjectGenerator,

import { createZipPublisher } from '@teleporthq/teleport-publisher-zip'
import { createDiskPublisher } from '@teleporthq/teleport-publisher-disk'
import { createNowPublisher } from '@teleporthq/teleport-publisher-now'
import { createNetlifyPublisher } from '@teleporthq/teleport-publisher-netlify'
import { createGithubPublisher } from '@teleporthq/teleport-publisher-github'
import { createCodesandboxPublisher } from '@teleporthq/teleport-publisher-codesandbox'

import { createReactComponentGenerator } from '@teleporthq/teleport-component-generator-react'
import { createPreactComponentGenerator } from '@teleporthq/teleport-component-generator-preact'
import { createVueComponentGenerator } from '@teleporthq/teleport-component-generator-vue'
import { createStencilComponentGenerator } from '@teleporthq/teleport-component-generator-stencil'
import { createAngularComponentGenerator } from '@teleporthq/teleport-component-generator-angular'
import { createReactNativeComponentGenerator } from '@teleporthq/teleport-component-generator-reactnative'

const componentGeneratorFactories = {
  [ComponentType.REACT]: createReactComponentGenerator,
  [ComponentType.PREACT]: createPreactComponentGenerator,
  [ComponentType.ANGULAR]: createAngularComponentGenerator,
  [ComponentType.VUE]: createVueComponentGenerator,
  [ComponentType.STENCIL]: createStencilComponentGenerator,
  [ComponentType.REACTNATIVE]: createReactNativeComponentGenerator,
}

const componentGeneratorProjectMappings = {
  [ComponentType.REACT]: ReactProjectMapping,
  [ComponentType.PREACT]: PreactProjectMapping,
  [ComponentType.ANGULAR]: AngularProjectMapping,
  [ComponentType.VUE]: VueProjectMapping,
  [ComponentType.STENCIL]: StencilProjectMapping,
  [ComponentType.REACTNATIVE]: ReactNativeProjectMapping,
}