How to use the @teleporthq/teleport-types.FileType.TSX function in @teleporthq/teleport-types

To help you get started, we’ve selected a few @teleporthq/teleport-types examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github teleporthq / teleport-code-generators / packages / teleport-plugin-stencil-app-routing / src / index.ts View on Github external
const routes = UIDLUtils.extractRoutes(uidl)
    const routeDefinitions = uidl.stateDefinitions.route

    /* The name should be injected only with AppRoot only then it acts as entry point,
    Sending only Root because app is appended while generation of decorators*/
    const params = {
      tag: 'app-root',
      shadow: true,
    }
    const decoratorAST = ASTBuilders.createComponentDecorator(params)

    chunks.push({
      name: componentDecoratorChunkName,
      type: ChunkType.AST,
      fileType: FileType.TSX,
      content: [decoratorAST],
      linkAfter: [importChunkName],
    })

    const classDeclarationAST = createClassDeclaration(routes, routeDefinitions)

    chunks.push({
      name: componentChunkName,
      type: ChunkType.AST,
      fileType: FileType.TSX,
      content: classDeclarationAST,
      linkAfter: [componentDecoratorChunkName],
    })

    return structure
  }
github teleporthq / teleport-code-generators / packages / teleport-plugin-stencil-app-routing / __tests__ / index.ts View on Github external
it('Should generate chunks for routing', async () => {
    const rootUIDL = projectUIDL.root as ComponentUIDL
    const structure: ComponentStructure = {
      uidl: rootUIDL,
      options: {},
      chunks: [],
      dependencies: {},
    }

    const { dependencies, chunks } = await stencilAppRouting(structure)

    expect(chunks.length).toBe(2)
    expect(Object.keys(dependencies).length).toBe(2)
    expect(chunks[0].name).toBe('component-decorator')
    expect(chunks[0].fileType).toBe(FileType.TSX)
    expect(chunks[0].type).toBe(ChunkType.AST)
    expect(chunks[0].content).toBeDefined()
    expect(chunks[1].name).toBe('jsx-component')
    expect(chunks[1].fileType).toBe(FileType.TSX)
    expect(chunks[1].type).toBe(ChunkType.AST)
    expect(chunks[1].content).toBeDefined()
  })
})
github teleporthq / teleport-code-generators / packages / teleport-plugin-css / __tests__ / index.ts View on Github external
},
        },
        dynamicRefPrefix: {
          prop: 'props.',
        },
      },
      type: ChunkType.AST,
      fileType: FileType.TSX,
      linkAfter: ['import-local'],
      content: {},
    }

    const decoratorChunk: ChunkDefinition = {
      name: 'component-decorator',
      type: ChunkType.AST,
      fileType: FileType.TSX,
      linkAfter: ['import-local'],
      content: {
        expression: {
          arguments: [
            {
              properties: [],
            },
          ],
        },
      },
    }

    it('generates a string chunk out of the styles, adds the className and the decorator reference', async () => {
      const style = {
        height: staticNode('100px'),
      }
github teleporthq / teleport-code-generators / packages / teleport-plugin-css / __tests__ / index.ts View on Github external
nodesLookup: {
          container: {
            openingElement: {
              name: {
                name: '',
              },
              attributes: [],
            },
          },
        },
        dynamicRefPrefix: {
          prop: 'props.',
        },
      },
      type: ChunkType.AST,
      fileType: FileType.TSX,
      linkAfter: ['import-local'],
      content: {},
    }

    const decoratorChunk: ChunkDefinition = {
      name: 'component-decorator',
      type: ChunkType.AST,
      fileType: FileType.TSX,
      linkAfter: ['import-local'],
      content: {
        expression: {
          arguments: [
            {
              properties: [],
            },
          ],
github teleporthq / teleport-code-generators / packages / teleport-project-generator-stencil / src / index.ts View on Github external
const createStencilProjectGenerator = () => {
  const prettierJS = createPrettierJSPostProcessor({ fileType: FileType.TSX })
  const importStatementsPlugin = createImportPlugin({ fileType: FileType.TSX })

  const stencilComponentGenerator = createStencilComponentGenerator()
  stencilComponentGenerator.addMapping(StencilProjectMapping as Mapping)

  const routingComponentGenerator = createComponentGenerator()
  routingComponentGenerator.addPlugin(stencilAppRouting)
  routingComponentGenerator.addPlugin(importStatementsPlugin)
  routingComponentGenerator.addPostProcessor(prettierJS)

  const htmlFileGenerator = createComponentGenerator()
  const prettierHTML = createPrettierHTMLPostProcessor()
  htmlFileGenerator.addPostProcessor(prettierHTML)

  const generator = createProjectGenerator({
    components: {
github teleporthq / teleport-code-generators / packages / teleport-plugin-stencil-app-routing / src / index.ts View on Github external
const decoratorAST = ASTBuilders.createComponentDecorator(params)

    chunks.push({
      name: componentDecoratorChunkName,
      type: ChunkType.AST,
      fileType: FileType.TSX,
      content: [decoratorAST],
      linkAfter: [importChunkName],
    })

    const classDeclarationAST = createClassDeclaration(routes, routeDefinitions)

    chunks.push({
      name: componentChunkName,
      type: ChunkType.AST,
      fileType: FileType.TSX,
      content: classDeclarationAST,
      linkAfter: [componentDecoratorChunkName],
    })

    return structure
  }
github teleporthq / teleport-code-generators / packages / teleport-component-generator-stencil / src / index.ts View on Github external
const createStencilComponentGenerator = ({
  mappings = [],
  plugins = [],
  postprocessors = [],
}: GeneratorFactoryParams = {}): ComponentGenerator => {
  const generator = createComponentGenerator()

  const importStatementsPlugin = createImportPlugin({ fileType: FileType.TSX })
  const stencilStylePlugin = createCSSPlugin({
    declareDependency: 'decorator',
    templateStyle: 'jsx',
    templateChunkName: 'jsx-component',
  })
  const prettierJS = createPrettierJSPostProcessor({ fileType: FileType.TSX })

  generator.addMapping(StencilMapping)
  mappings.forEach((mapping) => generator.addMapping(mapping))

  generator.addPlugin(stencilComponentPlugin)
  generator.addPlugin(stencilStylePlugin)
  plugins.forEach((plugin) => generator.addPlugin(plugin))
  generator.addPlugin(importStatementsPlugin)

  generator.addPostProcessor(prettierJS)
  postprocessors.forEach((postprocessor) => generator.addPostProcessor(postprocessor))

  return generator
}
github teleporthq / teleport-code-generators / packages / teleport-project-generator-stencil / src / index.ts View on Github external
const createStencilProjectGenerator = () => {
  const prettierJS = createPrettierJSPostProcessor({ fileType: FileType.TSX })
  const importStatementsPlugin = createImportPlugin({ fileType: FileType.TSX })

  const stencilComponentGenerator = createStencilComponentGenerator()
  stencilComponentGenerator.addMapping(StencilProjectMapping as Mapping)

  const routingComponentGenerator = createComponentGenerator()
  routingComponentGenerator.addPlugin(stencilAppRouting)
  routingComponentGenerator.addPlugin(importStatementsPlugin)
  routingComponentGenerator.addPostProcessor(prettierJS)

  const htmlFileGenerator = createComponentGenerator()
  const prettierHTML = createPrettierHTMLPostProcessor()
  htmlFileGenerator.addPostProcessor(prettierHTML)

  const generator = createProjectGenerator({
    components: {
      generator: stencilComponentGenerator,
github teleporthq / teleport-code-generators / packages / teleport-plugin-stencil-base-component / src / index.ts View on Github external
componentName,
      propDefinitions,
      stateDefinitions,
      jsxTagStructure
    )

    const params = {
      tag: UIDLUtils.createWebComponentFriendlyName(componentName),
      shadow: true,
    }

    const decoratorAST = ASTBuilders.createComponentDecorator(params)

    structure.chunks.push({
      type: ChunkType.AST,
      fileType: FileType.TSX,
      name: componentDecoratorChunkName,
      meta: {
        nodesLookup,
      },
      content: decoratorAST,
      linkAfter: [importChunkName],
    })

    structure.chunks.push({
      type: ChunkType.AST,
      fileType: FileType.TSX,
      name: componentChunkName,
      meta: {
        nodesLookup,
        dynamicRefPrefix: jsxOptions.dynamicReferencePrefixMap,
      },
github teleporthq / teleport-code-generators / packages / teleport-plugin-stencil-base-component / src / index.ts View on Github external
const decoratorAST = ASTBuilders.createComponentDecorator(params)

    structure.chunks.push({
      type: ChunkType.AST,
      fileType: FileType.TSX,
      name: componentDecoratorChunkName,
      meta: {
        nodesLookup,
      },
      content: decoratorAST,
      linkAfter: [importChunkName],
    })

    structure.chunks.push({
      type: ChunkType.AST,
      fileType: FileType.TSX,
      name: componentChunkName,
      meta: {
        nodesLookup,
        dynamicRefPrefix: jsxOptions.dynamicReferencePrefixMap,
      },
      content: exportAST,
      linkAfter: [importChunkName],
    })

    return structure
  }