@vonage/vivid-react 2.10.58 → 2.10.60

package/scripts/generateWrappers/generator.js

@@ -1,264 +0,0 @@
-const packageJson = require('../../package.json')
-const { getImportsFromTag } = require('./helpers/generator')
-const {
-  ComponentsEventsMap,
-  ComponentsEventsMapV3,
-  CompoundComponentsMap,
-  OutputLanguage,
-  FileName
-} = require('./consts')
-
-const { pathExists, outputFile, outputJson } = require('fs-extra')
-
-const {
-  compileTypescript,
-  prepareDir,
-  getComponentName,
-  toJsonObjectsList,
-  filePath,
-  camel2kebab,
-  event2PropName,
-  renderJsDoc,
-  getIndexFileName,
-  getProperties,
-  getUniqueEvents,
-  getVividPackageName,
-  prepareCompoundComponents,
-  compoundComponentTemplate
-} = require('./utils')
-const { getTemplate, TemplateToken } = require('./templates/templates')
-const { join } = require('path')
-const { getPropTypes, getDefaultProps, getProps, mapType } = require('./prop.types')
-const { writeFileSync, readFileSync } = require('fs')
-
-const generateTypings = outputDir => async tags => {
-  const distTs = join(FileName.tempFolder, FileName.tempTsFolder)
-  await generateWrappers(distTs, OutputLanguage.TypeScript, false, false)(tags)
-  await compileTypescript(distTs)(outputDir)
-}
-
-const generateTypingsV3 = outputDir => async meta => {
-  const distTs = join(FileName.tempFolder, FileName.tempTsFolder)
-  await generateWrappersV3(distTs, OutputLanguage.TypeScript, false, false)(meta)
-  await compileTypescript(distTs)(outputDir)
-}
-
-const renderComponent = tag => language => componentName => {
-  const compoundsConfig = CompoundComponentsMap[componentName] || {}
-  const getCompoundComponents = prepareCompoundComponents(componentName, compoundComponentTemplate, compoundsConfig)
-  return getTemplate('react-component', language)
-    .replace(TemplateToken.CLASS_JSDOC, renderJsDoc(tag))
-    .replace(TemplateToken.IMPORTS, getImportsFromTag(tag).join('\n'))
-    .replace(TemplateToken.EVENTS, toJsonObjectsList(getUniqueEvents(tag.events)))
-    .replace(TemplateToken.PROPERTIES,
-      toJsonObjectsList(
-        getProperties(tag)
-          .filter(property => property.bindable)
-          .map(({ name }) => name))
-    )
-    .replace(TemplateToken.ATTRIBUTES, '')
-    .replace(TemplateToken.PROP_TYPES, getPropTypes(tag).join(',\n'))
-    .replace(TemplateToken.PROPS, getProps(tag).join(',\n'))
-    .replace(TemplateToken.DEFAULT_PROPS, getDefaultProps(tag).join(',\n'))
-    .replace(TemplateToken.TAG_DESCRIPTOR_JSON, JSON.stringify(tag, null, ' '))
-    .replace(TemplateToken.COMPOUND_COMPONENTS, getCompoundComponents())
-    .replace(TemplateToken.REACT_IMPORT, getCompoundComponents() &&
-      'import { createElement } from \'react\'')
-    .replace(new RegExp(TemplateToken.COMPONENT_CLASS_NAME, 'g'), componentName)
-    .replace(new RegExp(TemplateToken.TAG, 'g'), tag.name)
-}
-
-/**
- * Generates Vivid 2.x wrappers
- */
-const generateWrappers = (outputDir, language = OutputLanguage.JavaScript, cleanTemp = true, verbose = true) => async (tags) => {
-  const indexFileName = getIndexFileName(language)
-  const saveIndex = (outputDir, content) => {
-    const indexOutputFileName = join(outputDir, indexFileName)
-    return outputFile(
-      indexOutputFileName,
-      content
-    )
-  }
-
-  const saveStory = async (outputDir, componentName, content) => {
-    const indexOutputFileName = join(outputDir, `${componentName}.stories.jsx`)
-    const exists = await pathExists(indexOutputFileName)
-    return exists || outputFile(
-      indexOutputFileName,
-      content
-    )
-  }
-
-  const getStoriesContent = (componentName, tag) =>
-    getTemplate('stories', OutputLanguage.JavaScript)
-      .split(TemplateToken.COMPONENT_CLASS_NAME).join(componentName)
-
-  prepareDir(outputDir, true, verbose)
-  const components = []
-
-  for (const tag of tags) {
-    const componentName = getComponentName(tag)
-    components.push(componentName)
-    if (verbose) {
-      console.info(`Processing ${componentName}...`)
-    }
-    tag.events = [...(tag.events || []), ...(ComponentsEventsMap[componentName] || [])]
-
-    const componentOutputDir = join(process.cwd(), outputDir, componentName)
-    const storyOutputDir = join(process.cwd(), FileName.storyOutputDir, 'v2', componentName)
-    const componentContent = renderComponent(tag)(language)(componentName)
-
-    await saveIndex(componentOutputDir, componentContent)
-    await saveStory(storyOutputDir, componentName, getStoriesContent(componentName, tag))
-
-    const packageName = getVividPackageName(tag.path)
-    const packageJsonContent = {
-      name: `@vonage/vivid-react-${tag.name}`,
-      version: packageJson.version,
-      main: indexFileName,
-      types: 'index.d.ts',
-      private: true,
-      license: 'MIT',
-      dependencies: {
-        [packageName]: packageJson.dependencies[packageName]
-      }
-    }
-    await outputJson(join(componentOutputDir, FileName.packageJson), packageJsonContent, { spaces: 2 })
-  }
-
-  if (language === OutputLanguage.JavaScript) {
-    await generateTypings(outputDir)(tags)
-  }
-
-  prepareDir(filePath(FileName.tempFolder), cleanTemp, verbose)
-
-  if (verbose) {
-    console.info(`${components.length} wrappers generated at ${outputDir}`)
-  }
-}
-
-const renderComponentV3 = prefix => classDeclaration => language => componentClassName => {
-  const componentPrefix = prefix
-  const componentName = classDeclaration.name
-  const componentTagName = `${componentPrefix}-${camel2kebab(componentName)}`
-  const events = [...(classDeclaration.events?.map(({ name }) => name) || []), ...(ComponentsEventsMapV3[componentClassName] || [])]
-  const properties = classDeclaration.members?.filter(({ privacy = 'public', kind, readonly }) => kind === 'field' && privacy === 'public' && readonly !== true) || []
-  const attributes = classDeclaration.attributes?.filter(({ fieldName }) => properties.find(({ name }) => fieldName === name)) || []
-  const propertyNames = properties.map(({ name }) => `'${name}'`)
-  const props = [
-    ...(events.map(x => x.propName || event2PropName(x.name || x)).map(x => `  ${x}?: (event: SyntheticEvent) => void`)),
-    ...(properties.map(({ name, type }) => `  ${name}?: ${mapType(type?.text)}`))
-  ]
-  const renderPropertyJsDoc = ({ type, name, attribute = null, description }) => `* @param ${type?.text ? `{${type?.text}}` : ''} ${name} ${description ? `- ${description}` : ''} ${attribute ? `**attribute** \`${attribute.name || attribute.fieldName}\`` : ''}`
-  const jsDoc = `/** ${classDeclaration.description || componentClassName} \n${properties.map((p) => ({ ...p, attribute: attributes.find(({ fieldName }) => fieldName === p.name) })).map(renderPropertyJsDoc).join('\n')}\n*/`
-
-  return getTemplate('react-component-v3', language)
-    .replace(TemplateToken.CLASS_JSDOC, jsDoc)
-    .replace(TemplateToken.ATTRIBUTES, '')
-    .replace(TemplateToken.PROP_TYPES, '')
-    .replace(TemplateToken.PROPS, props.join(',\n'))
-    .replace(TemplateToken.TAG_DESCRIPTOR_JSON, JSON.stringify(classDeclaration, null, ' '))
-    .replace(new RegExp(TemplateToken.COMPONENT_CLASS_NAME, 'g'), componentClassName)
-    .replace(new RegExp(TemplateToken.TAG_PREFIX, 'g'), componentPrefix)
-    .replace(new RegExp(TemplateToken.COMPONENT_NAME, 'g'), componentName)
-    .replace(new RegExp(TemplateToken.TAG, 'g'), componentTagName)
-    .replace(new RegExp(TemplateToken.EVENTS, 'g'), toJsonObjectsList(getUniqueEvents(events)))
-    .replace(new RegExp(TemplateToken.PROPERTIES, 'g'), propertyNames.join(', '))
-}
-
-/**
- * Generates Vivid 3.x wrappers
- */
-const generateWrappersV3 = (outputDir, language = OutputLanguage.JavaScript, cleanTemp = true, verbose = true) => async (meta) => {
-  const componentPrefix = 'vvd3'
-  const indexFileName = getIndexFileName(language)
-  const saveIndex = (outputDir, content) => {
-    const indexOutputFileName = join(outputDir, indexFileName)
-    return outputFile(
-      indexOutputFileName,
-      content
-    )
-  }
-
-  const outDir = `${outputDir}/v3`
-
-  const classDeclarations = meta.elements.modules.reduce((acc, { declarations }) =>
-    [...acc, ...declarations.filter(({ kind }) => kind === 'class')]
-    , [])
-
-  for (const classDeclaration of classDeclarations) {
-    const componentName = `Vwc${classDeclaration.name}`
-    const componentNameKebab = camel2kebab(classDeclaration.name)
-    const componentOutputDir = join(process.cwd(), outDir, componentName)
-    const componentContent = renderComponentV3(componentPrefix)(classDeclaration)(language)(componentName)
-    await saveIndex(componentOutputDir, componentContent)
-
-    const packageName = '@vonage/vivid'
-    const packageJsonContent = {
-      name: `@vonage/vivid-react-${componentPrefix}-${componentNameKebab}`,
-      version: packageJson.dependencies[packageName],
-      main: indexFileName,
-      types: 'index.d.ts',
-      private: true,
-      license: 'MIT',
-      dependencies: {
-        [packageName]: packageJson.dependencies[packageName]
-      }
-    }
-    await outputJson(join(componentOutputDir, FileName.packageJson), packageJsonContent, { spaces: 2 })
-
-    if (verbose) {
-      console.info(`${componentName}... v3`)
-    }
-  }
-
-  if (language === OutputLanguage.TypeScript) {
-    const typesDir = filePath(FileName.types)
-    prepareDir(typesDir)
-    await outputFile(
-      join(typesDir, `index.d.ts`),
-      getTemplate('types', OutputLanguage.TypeScript)
-        .replace(TemplateToken.ELEMENT_TYPES,
-          classDeclarations.map(({ attributes, name }) => {
-            const componentTagName = `${componentPrefix}-${camel2kebab(name)}`
-            return getTemplate('element-type', OutputLanguage.TypeScript)
-              .replace(TemplateToken.TAG, componentTagName)
-              .replace(TemplateToken.ATTRIBUTES, (attributes || []).map(({ name, fieldName, type = { text: 'string' } }) => `            "${name || fieldName}": ${type.text};`).join('\n'))
-          }).join('\n')
-        )
-    )
-  }
-
-  if (language === OutputLanguage.JavaScript) {
-    const generatedDir = filePath(FileName.generatedFolder)
-    prepareDir(generatedDir)
-
-    writeFileSync(
-      `${generatedDir}/vivid.version.js`,
-      `export default { v2: '${packageJson.dependencies['@vonage/vvd-core']}', v3: \`${packageJson.dependencies['@vonage/vivid']}\`}`
-    )
-
-    for (const { name, file } of [
-      { name: 'core.all', file: './node_modules/@vonage/vivid/styles/core/all.css' },
-      { name: 'theme.light', file: './node_modules/@vonage/vivid/styles/tokens/theme-light.css' },
-      { name: 'theme.dark', file: './node_modules/@vonage/vivid/styles/tokens/theme-dark.css' },
-      { name: 'font.spezia', file: './node_modules/@vonage/vivid/styles/fonts/spezia-variable.css' }
-    ]) {
-      const cssText = readFileSync(file, { encoding: 'utf8' }).replace(/\/\*# sourceMappingURL=.*\*\//g, '')
-      writeFileSync(
-        `${generatedDir}/style.${name}.js`,
-        `export default { id: '${name}', css: \`${cssText}\`}`
-      )
-    }
-
-    await generateTypingsV3(outputDir)(meta)
-  }
-
-  prepareDir(filePath(FileName.tempFolder), cleanTemp, verbose)
-}
-
-module.exports = {
-  generateWrappers,
-  generateWrappersV3
-}

package/scripts/generateWrappers/helpers/generator.js

@@ -1,18 +0,0 @@
-const { posix, win32 } = require('path')
-
-const rootImportExclusions = ['vwc-tags']
-
-module.exports.getImportsFromTag = ({ name, path }) => {
-  const normalizedPath = path.split(win32.sep).join(posix.sep)
-  const [, rootComponent] = /@vonage\/([\w-]+)\//g.exec(normalizedPath)
-  const result = []
-  if (rootComponent === name) {
-    result.push(`@vonage/${name}`)
-  } else {
-    if (rootImportExclusions.indexOf(rootComponent) < 0) {
-      result.push(`@vonage/${rootComponent}`)
-    }
-    result.push(`@vonage/${rootComponent}/${name}`)
-  }
-  return result.map(x => `import '${x}'`)
-}

package/scripts/generateWrappers/helpers/generator.test.js

@@ -1,56 +0,0 @@
-const { posix, win32 } = require('path')
-const { getImportsFromTag } = require('./generator')
-
-describe('getImportsFromTag', () => {
-  const mainComponentTag = {
-    name: 'vwc-list',
-    path: './../node_modules/@vonage/vwc-list/src/vwc-list.ts'
-  }
-
-  const subComponentExclusionTag = {
-    name: 'vwc-tag',
-    path: './..\\node_modules\\@vonage\\vwc-tags\\vwc-tag.d.ts'
-  }
-
-  const subComponentTag = {
-    name: 'vwc-radio-list-item',
-    path: './../node_modules/@vonage/vwc-list/src/vwc-radio-list-item.ts'
-  }
-
-  it('should create a default import for main component', () => {
-    const result = getImportsFromTag(mainComponentTag)
-
-    expect(result).toEqual([`import '@vonage/vwc-list'`])
-  })
-
-  it('should create import from specific file for subcomponent and main component import', () => {
-    const result = getImportsFromTag(subComponentTag)
-
-    expect(result).toEqual([
-      `import '@vonage/vwc-list'`,
-      `import '@vonage/vwc-list/${subComponentTag.name}'`
-    ])
-  })
-
-  it('should create import from specific file for subcomponent with exclusion', () => {
-    const result = getImportsFromTag(subComponentExclusionTag)
-
-    expect(result).toEqual([
-      `import '@vonage/vwc-tags/${subComponentExclusionTag.name}'`
-    ])
-  })
-
-  it('should work for win32 paths', () => {
-    const winTag = {
-      ...subComponentTag,
-      path: subComponentTag.path.split(posix.sep).join(win32.sep)
-    }
-
-    const result = getImportsFromTag(winTag)
-
-    expect(result).toEqual([
-      `import '@vonage/vwc-list'`,
-      `import '@vonage/vwc-list/${subComponentTag.name}'`
-    ])
-  })
-})

package/scripts/generateWrappers/prop.types.js

@@ -1,87 +0,0 @@
-const { event2PropName, getProperties } = require('./utils')
-
-// Common
-
-const getEvents = tag => (tag.events || []).map(x => x.propName || event2PropName(x.name || x))
-const isTypeSet = type => /(".*?" \|)/.test(type)
-const isStringTypeSet = type => /".*"[ |]?/.test(type) && /".*"[ |]?/.exec(type)[0] === type
-const isBoolean = type => /^(true|false)$/.test(type) || type === 'boolean'
-const isArray = type => /(.*)\[\]$/gm.test(type) || type === 'array'
-const isNumber = type => /(integer)/.test(type) || type === 'number | null'
-
-// TypeScript
-const mapType = type => ([
-  'boolean',
-  'Boolean',
-  'string',
-  'string | null',
-  'string | undefined',
-  'string | number',
-  'number',
-  'unknown'].indexOf(type) >= 0 ||
-isTypeSet(type))
-  ? type
-  : isBoolean(type)
-    ? 'boolean'
-    : isNumber(type)
-      ? 'number'
-      : isArray(type)
-          ? 'any[]'
-          : `any /* ${type} */`
-
-const getProps = tag => {
-  const eventsProps = getEvents(tag).map(x => `  ${x}?: (event: SyntheticEvent) => void`)
-
-  const properties = getProperties(tag)
-  const props = properties.map(x => `  ${x.name}?: ${mapType(x.type)}`)
-
-  return [
-    ...eventsProps,
-    ...props
-  ]
-}
-
-// JavaScript
-
-const getDefaultProps = tag => {
-  const defaultProperties = getProperties(tag).filter(x => x.default)
-  return defaultProperties.map(x => `  ${x.name}: ${x.default}`)
-}
-
-const getPropTypes = tag => {
-  const eventsPropTypes = getEvents(tag).map(x => `  ${x}: PropTypes.func`)
-
-  const properties = getProperties(tag)
-  const isString = type => type === 'string | undefined' || type === 'string | null'
-  const getSetTypeOptions = setType => setType.split('|').map(x => x.trim())
-  const mapTypeToPropType = type => ['boolean', 'string', 'number', 'array'].indexOf(type) >= 0
-    ? (type === 'boolean' ? 'bool' : type)
-    : isStringTypeSet(type)
-      ? `oneOf([${getSetTypeOptions(type).join(',')}])`
-      : isString(type)
-        ? 'string'
-        : isNumber(type)
-          ? 'number'
-          : isArray(type)
-            ? 'array'
-            : isBoolean(type)
-              ? 'bool'
-              : `any /* ${type || 'type not provided'} */`
-  const propertiesPropTypes = properties.map(x =>
-    `  ${x.name}: PropTypes.${mapTypeToPropType(x.type)}${x.default ? `/* default: ${x.default} */` : ''}${x.attribute ? `/* attribute: ${x.attribute} */` : ''}`)
-
-  return [
-    ...eventsPropTypes,
-    ...propertiesPropTypes
-  ]
-}
-
-module.exports = {
-  // JavaScript
-  getDefaultProps,
-  getPropTypes,
-
-  // TypeScript
-  getProps,
-  mapType
-}

package/scripts/generateWrappers/templates/js/index.tmpl

@@ -1,2 +0,0 @@
-<% banner %>
-<% exports %>

package/scripts/generateWrappers/templates/js/react-component-v3.tmpl

@@ -1,19 +0,0 @@
-<% banner %>
-/*
-Code in this file were generated using following JSON:
-<% descriptor-json %>
-*/
-import wrapper from '@vonage/vivid-react-wrapper'
-import { register<% component-name %> } from '@vonage/vivid'
-
-register<% component-name %>('<% tag-prefix %>')
-
-const <% component-class-name %> = wrapper(`<% tag %>`,  {
-    events: [<% events %>],
-    attributes: [<% attributes %>],
-    properties: [<% properties %>]
-})
-
-<% component-class-name %>.displayName = '<% component-class-name %>'
-
-export default <% component-class-name %>

package/scripts/generateWrappers/templates/js/react-component.tmpl

@@ -1,30 +0,0 @@
-<% banner %>
-/*
-Code in this file were generated using following JSON:
-<% descriptor-json %>
-*/
-import PropTypes from 'prop-types'
-import wrapper from '@vonage/vivid-react-wrapper'
-<% imports %>
-<% react-import %>
-
-<% jsdoc.class %>
-const <% component-class-name %> = wrapper('<% tag %>',  {
-    events: [<% events %>],
-    attributes: [<% attributes %>],
-    properties: [<% properties %>]
-});
-
-<% component-class-name %>.propTypes = {
-<% prop-types %>
-}
-
-<% component-class-name %>.defaultProps = {
-<% default-props %>
-}
-
-<% component-class-name %>.displayName = '<% component-class-name %>'
-
-<% compound-components %>
-
-export default <% component-class-name %>

package/scripts/generateWrappers/templates/js/stories.tmpl

@@ -1,18 +0,0 @@
-import React from 'react'
-import <% component-class-name %> from '../../../dist/<% component-class-name %>'
-
-export const Default = () => <<% component-class-name %> />
-export default {
-  title: 'V2/<% component-class-name %>',
-  argTypes: {
-      //
-      // Example values
-      // numberValue: { control: 'number', defaultValue: 123 },
-      // booleanValue: { control: 'boolean', defaultValue: true },
-      // objectValue: { control: 'object', defaultValue: {} },
-      // stringValue: { control: 'string', defaultValue: 'string' },
-      // colorValue: { control: 'color' },
-      // dateValue: { control: 'date' }
-      //
-    }
-}

package/scripts/generateWrappers/templates/templates.js

@@ -1,39 +0,0 @@
-/*
-* Purpose: Support code-generation activities with templates
-*/
-const { readFileSync } = require('fs')
-
-const TemplateToken = {
-  BANNER: '<% banner %>',
-  IMPORTS: '<% imports %>',
-  EXPORTS: '<% exports %>',
-  TAG: '<% tag %>',
-  ELEMENT_TYPES: '<% element-types %>',
-  COMPONENT_CLASS_NAME: '<% component-class-name %>',
-  COMPONENT_NAME: '<% component-name %>',
-  TAG_PREFIX: '<% tag-prefix %>',
-  PROP_TYPES: '<% prop-types %>',
-  PROPS: '<% props %>',
-  DEFAULT_PROPS: '<% default-props %>',
-  PROPERTIES: '<% properties %>',
-  ATTRIBUTES: '<% attributes %>',
-  EVENTS: '<% events %>',
-  CLASS_JSDOC: '<% jsdoc.class %>',
-  TAG_DESCRIPTOR_JSON: '<% descriptor-json %>',
-  COMPOUND_COMPONENTS: '<% compound-components %>',
-  REACT_IMPORT: '<% react-import %>'
-}
-
-const GENERATED_CODE_BANNER = `/*
-* DO NOT EDIT THIS FILE. IT IS GENERATED
-*/`
-const templatesFolder = `${__dirname}`
-const getTemplate = (template, language) =>
-  readFileSync(`${templatesFolder}/${language}/${template}.tmpl`, { encoding: 'utf8' })
-    .replace(TemplateToken.BANNER, GENERATED_CODE_BANNER)
-
-module.exports = {
-  getTemplate,
-  TemplateToken,
-  GENERATED_CODE_BANNER
-}

package/scripts/generateWrappers/templates/ts/element-type.tmpl

@@ -1,3 +0,0 @@
-        "<% tag %>": React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement> & Partial<{
-<% attributes %>
-        }>;

package/scripts/generateWrappers/templates/ts/index.tmpl

@@ -1,2 +0,0 @@
-<% banner %>
-<% exports %>

package/scripts/generateWrappers/templates/ts/react-component-v3.tmpl

@@ -1,32 +0,0 @@
-<% banner %>
-/*
-Code in this file were generated using following JSON:
-<% descriptor-json %>
-*/
-import React, { ReactNode, SyntheticEvent, ForwardRefExoticComponent } from 'react'
-import wrapper from '@vonage/vivid-react-wrapper'
-import { register<% component-name %> } from '@vonage/vivid'
-
-register<% component-name %>('<% tag-prefix %>')
-
-const WrappedComponent = wrapper(`<% tag %>`,  {
-    events: [<% events %>],
-    attributes: [<% attributes %>],
-    properties: [<% properties %>]
-}) as ForwardRefExoticComponent<any>;
-
-<% jsdoc.class %>
-const <% component-class-name %> = (props:
-{
-  children?: ReactNode,
-  slot?: string,
-  id?: string,
-  style?: React.CSSProperties,
-  ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined,
-<% props %>
-}
-): JSX.Element => <WrappedComponent {...props}>{props.children}</WrappedComponent>
-
-<% component-class-name %>.displayName = '<% component-class-name %>'
-
-export default <% component-class-name %>

package/scripts/generateWrappers/templates/ts/react-component.tmpl

@@ -1,28 +0,0 @@
-<% banner %>
-/*
-Code in this file were generated using following JSON:
-<% descriptor-json %>
-*/
-import React, { ReactNode, SyntheticEvent, ForwardRefExoticComponent } from 'react'
-import wrapper from '@vonage/vivid-react-wrapper'
-<% imports %>
-
-const WrappedComponent = wrapper('<% tag %>',  {
-    events: [<% events %>],
-    attributes: [<% attributes %>],
-    properties: [<% properties %>]
-}) as ForwardRefExoticComponent<any>;
-
-<% jsdoc.class %>
-const <% component-class-name %> = (props:
-{
-  children?: ReactNode,
-  slot?: string,
-  id?: string,
-  style?: React.CSSProperties,
-  ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined,
-<% props %>
-}
-): JSX.Element => <WrappedComponent {...props}>{props.children}</WrappedComponent>
-
-export default <% component-class-name %>

package/scripts/generateWrappers/templates/ts/types.tmpl

@@ -1,8 +0,0 @@
-<% banner %>
-declare module '@vonage/vivid-react-wrapper';
-declare module '@vonage/vivid-react';
-declare namespace JSX {
-    interface IntrinsicElements {
-<% element-types %>
-    }
-}