@teambit/generator 0.0.1144 → 0.0.1146

package/templates/component-generator/files/component-template-files/test.ts

@@ -0,0 +1,22 @@
+export const generateTestFileContent = () => {
+  return `import { ComponentContext } from '@teambit/generator';
+
+export const testFile = (context: ComponentContext) => {
+  const { name, namePascalCase: Name } = context;
+
+  return {
+    relativePath: name + '.spec.tsx',
+    content: \`import React from 'react';
+import { render } from '@testing-library/react';
+import { Basic\${Name} } from './\${name}.composition';
+
+it('renders with the correct text', () => {
+  const { getByText } = render(<Basic\${Name} />);
+  const rendered = getByText('hello world!');
+  expect(rendered).toBeTruthy();
+});
+\`,
+  };
+};
+`;
+};

package/templates/component-generator/files/component-template.ts

@@ -0,0 +1,58 @@
+import { ComponentContext } from '@teambit/generator';
+
+export function componentTemplate({ namePascalCase, name }: ComponentContext) {
+  return `import {
+    ComponentContext,
+    ComponentFile,
+    ComponentTemplate,
+  } from '@teambit/generator';
+  import { indexFile } from './files/index-file';
+  import { componentFile } from './files/component-file';
+  import { testFile } from './files/test-file';
+  import { compositionFile } from './files/composition-file';
+  
+  export type ${namePascalCase}ComponentTemplateOptions = {
+    /**
+     * name of the template
+     */
+    name?: string;
+  
+    /**
+     * description of the template.
+     */
+    description?: string;
+  
+    /**
+     * hide the template from the templates command.
+     */
+    hidden?: boolean;
+  };
+  
+  export class ${namePascalCase}ComponentTemplate implements ComponentTemplate {
+    constructor(
+      readonly name = '${name}',
+      readonly description = 'a template for ${name} components',
+      readonly hidden = false
+    ) {}
+  
+    generateFiles(context: ComponentContext): ComponentFile[] {
+      return [
+        indexFile(context),
+        compositionFile(context),
+        componentFile(context),
+        testFile(context),
+      ];
+    }
+  
+    static from(options: ${namePascalCase}ComponentTemplateOptions = {}) {
+      return () =>
+        new ${namePascalCase}ComponentTemplate(
+          options.name,
+          options.description,
+          options.hidden
+        );
+    }
+  }
+  
+`;
+}

package/templates/component-generator/files/index.ts

@@ -1,10 +1,6 @@
-import { ComponentContext } from '@teambit/generator';
+import { ComponentContext } from '../../..';
 
 export function indexFile({ namePascalCase, name }: ComponentContext) {
-  return `import { ${namePascalCase}Aspect } from './${name}.aspect';
-
-export type { ${namePascalCase}Main } from './${name}.main.runtime';
-export default ${namePascalCase}Aspect;
-export { ${namePascalCase}Aspect };
+  return `export { ${namePascalCase}ComponentTemplate } from './${name}';
 `;
 }

package/templates/component-generator/index.ts

@@ -1,13 +1,14 @@
-import { ComponentContext, ComponentTemplate } from '@teambit/generator';
+import { ComponentContext, ComponentTemplate } from '../..';
 import { indexFile } from './files/index';
-import { aspectFile } from './files/aspect-file';
-import { docsFile } from './files/docs-file';
-import { mainRuntime } from './files/main-runtime';
+import { generateTestFileContent } from './files/component-template-files/test';
+import { generateComponentFileContent } from './files/component-template-files/component';
+import { generateCompositionFileContent } from './files/component-template-files/composition';
+import { generateIndexFileContent } from './files/component-template-files/index-file';
+import { componentTemplate } from './files/component-template';
 
 export const componentGeneratorTemplate: ComponentTemplate = {
   name: 'component-generator',
-  description:
-    'create your own component generator \nDocs: https://bit.dev/docs/dev-services/generator/generate-component',
+  description: 'create your own component generator \nDocs: https://bit.dev/reference/generator/create-generator',
   generateFiles: (context: ComponentContext) => {
     return [
       {
@@ -15,17 +16,26 @@ export const componentGeneratorTemplate: ComponentTemplate = {
         content: indexFile(context),
         isMain: true,
       },
+
+      {
+        relativePath: `./${context.name}.ts`,
+        content: componentTemplate(context),
+      },
+      {
+        relativePath: `./files/test-file.ts`,
+        content: generateTestFileContent(),
+      },
       {
-        relativePath: `${context.name}.aspect.ts`,
-        content: aspectFile(context),
+        relativePath: `./files/composition-file.ts`,
+        content: generateCompositionFileContent(),
       },
       {
-        relativePath: `${context.name}.docs.mdx`,
-        content: docsFile(),
+        relativePath: `./files/component-file.ts`,
+        content: generateComponentFileContent(),
       },
       {
-        relativePath: `${context.name}.main.runtime.ts`,
-        content: mainRuntime(context),
+        relativePath: `./files/index-file.ts`,
+        content: generateIndexFileContent(),
       },
     ];
   },

package/templates/{component-generator → component-generator-standalone}/files/aspect-file.ts

@@ -1,4 +1,4 @@
-import { ComponentContext } from '@teambit/generator';
+import { ComponentContext } from '../../..';
 
 export function aspectFile({ namePascalCase, componentId }: ComponentContext) {
   return `import { Aspect } from '@teambit/harmony';

package/templates/component-generator-standalone/files/index.ts

@@ -0,0 +1,10 @@
+import { ComponentContext } from '@teambit/generator';
+
+export function indexFile({ namePascalCase, name }: ComponentContext) {
+  return `import { ${namePascalCase}Aspect } from './${name}.aspect';
+
+export type { ${namePascalCase}Main } from './${name}.main.runtime';
+export default ${namePascalCase}Aspect;
+export { ${namePascalCase}Aspect };
+`;
+}

package/templates/{component-generator → component-generator-standalone}/files/main-runtime.ts

@@ -1,4 +1,4 @@
-import { ComponentContext } from '@teambit/generator';
+import { ComponentContext } from '../../..';
 
 export function mainRuntime({ name, namePascalCase }: ComponentContext) {
   return `import { MainRuntime } from '@teambit/cli';

package/templates/component-generator-standalone/index.ts

@@ -0,0 +1,39 @@
+import { ComponentContext, ComponentTemplate } from '@teambit/generator';
+import { indexFile } from './files/index';
+import { aspectFile } from './files/aspect-file';
+import { docsFile } from './files/docs-file';
+import { mainRuntime } from './files/main-runtime';
+
+export const componentGeneratorTemplate: ComponentTemplate = {
+  name: 'component-generator',
+  description:
+    'create your own component generator \nDocs: https://bit.dev/docs/dev-services/generator/generate-component',
+  hidden: true,
+  generateFiles: (context: ComponentContext) => {
+    return [
+      {
+        relativePath: 'index.ts',
+        content: indexFile(context),
+        isMain: true,
+      },
+      {
+        relativePath: `${context.name}.aspect.ts`,
+        content: aspectFile(context),
+      },
+      {
+        relativePath: `${context.name}.docs.mdx`,
+        content: docsFile(),
+      },
+      {
+        relativePath: `${context.name}.main.runtime.ts`,
+        content: mainRuntime(context),
+      },
+    ];
+  },
+  config: {
+    'teambit.harmony/aspect': {},
+    'teambit.envs/envs': {
+      env: 'teambit.harmony/aspect',
+    },
+  },
+};

package/templates/index.ts

@@ -0,0 +1,4 @@
+export { starterTemplate as starterTemplateStandalone } from './starter-standalone';
+export { starterTemplate } from './starter';
+export { componentGeneratorTemplate as componentGeneratorTemplateStandalone } from './component-generator-standalone';
+export { componentGeneratorTemplate } from './component-generator';

package/templates/starter/files/doc-file.ts

@@ -0,0 +1,24 @@
+import { ComponentContext } from '@teambit/generator';
+
+export function docFile(context: ComponentContext) {
+  const { name, componentId } = context;
+  return `---
+description: Starter for generating a ${name} workspace
+labels: ['generator', 'templates', '${name}-workspace']
+---
+
+## Using the ${name} Workspace Starter
+
+How to use this generator locally, essentially for development purposes:
+
+\`\`\`js
+bit new ${name} my-${name}-workspace --load-from /Users/me/path/to/this/dir --aspect ${componentId.toString()}
+\`\`\`
+
+How to use this generator after exporting to a remote scope:
+
+\`\`\`js
+bit new ${name} my-${name}-workspace --aspect ${componentId.toString()}
+\`\`\`
+`;
+}

package/templates/starter/files/generate-files.ts

@@ -0,0 +1,27 @@
+export function generateFiles() {
+  return `import { WorkspaceContext, WorkspaceFile } from '@teambit/generator';
+  import { workspaceConfig } from './workspace-config';
+  import { gitIgnore } from './git-ignore';
+  
+  export async function generateFiles(
+    context: WorkspaceContext,
+  ): Promise<WorkspaceFile[]> {
+    const files: WorkspaceFile[] = [
+      {
+        relativePath: 'workspace.jsonc',
+        content: await workspaceConfig(context),
+      },
+    ];
+  
+    if (!context.skipGit) {
+      files.push({
+        relativePath: '.gitignore',
+        content: gitIgnore(),
+      });
+    }
+  
+    return files;
+  }
+  
+`;
+}

package/templates/starter/files/index.ts

@@ -1,6 +1,6 @@
-import { ComponentContext } from '@teambit/generator';
+import { ComponentContext } from '../../..';
 
 export function indexFile({ namePascalCase, name }: ComponentContext) {
-  return `export { starter as ${namePascalCase}Starter } from './${name}.starter';
+  return `export { ${namePascalCase}WorkspaceStarter } from './${name}.starter';
 `;
 }

package/templates/starter/files/starter.ts

@@ -1,31 +1,40 @@
-export function starterFile() {
-  return `import { WorkspaceContext, Starter } from '@teambit/generator';
-import { workspaceConfig } from './template/files/workspace-config';
-import { readme } from './template/files/readme-file';
-import { gitIgnore } from './template/files/git-ignore';
+import { ComponentContext } from '@teambit/generator';
 
-export const starter: Starter = {
-  name: 'template-example',
-  description: 'demonstration of a workspace template',
-  generateFiles: async (context: WorkspaceContext) => [
-    {
-      relativePath: 'workspace.jsonc',
-      content: await workspaceConfig(context),
-    },
-    {
-      relativePath: '.gitignore',
-      content: gitIgnore(),
-    },
-    {
-      relativePath: 'README.md',
-      content: readme(),
-    },
-  ],
-  importComponents: () => [
-    { id: 'teambit.react/templates/ui/text', path: 'ui/text' },
-  ],
-};
-
-export default starter;
+export function starterFile({ namePascalCase, name }: ComponentContext) {
+  return `import { WorkspaceContext, WorkspaceTemplate } from '@teambit/generator';
+  import { generateFiles as generateCommonFiles } from './template/files/generate-files';
+  
+  export type ${namePascalCase}StarterOptions = Pick<WorkspaceTemplate, 'name' | 'description' | 'hidden'>;
+  
+  export class ${namePascalCase}WorkspaceStarter implements WorkspaceTemplate {
+    constructor(
+      readonly name = '${name}-workspace',
+      readonly description = '${namePascalCase} workspace with a custom react env',
+      readonly hidden = false
+    ) {}
+  
+    async generateFiles(context: WorkspaceContext) {
+      return generateCommonFiles(context);
+    }
+  
+    fork() {
+      return [
+        {
+          id: 'teambit.react/react-env-extension',
+          targetName: 'envs/my-react-env',
+        },
+      ];
+    }
+  
+    static from(options: Partial<${namePascalCase}StarterOptions>) {
+      return () =>
+        new ${namePascalCase}WorkspaceStarter(
+          options.name,
+          options.description,
+          options.hidden
+        );
+    }
+  }
+  
 `;
 }

package/templates/starter/files/workspace-config-tpl.ts

@@ -3,9 +3,15 @@ export function workspaceConfigTemplate() {
 import { getWorkspaceConfigTemplateParsed, stringifyWorkspaceConfig } from '@teambit/config';
 
 export async function workspaceConfig({ name, defaultScope }: WorkspaceContext) {
+  const scope = defaultScope || 'org.scope';
   const configParsed = await getWorkspaceConfigTemplateParsed();
   configParsed['teambit.workspace/workspace'].name = name;
-  configParsed['teambit.workspace/workspace'].defaultScope = defaultScope || 'company.scope';
+  configParsed['teambit.workspace/workspace'].defaultScope = scope;
+  configParsed['teambit.generator/generator'] = {
+    envs: [
+     scope + '/react/react-env',
+    ],
+  };
   configParsed['teambit.workspace/variants'] = {
     '*': {},
   };

package/templates/starter/index.ts

@@ -1,14 +1,15 @@
-import { ComponentContext, ComponentTemplate } from '@teambit/generator';
+import { ComponentContext, ComponentTemplate } from '../../';
 import { indexFile } from './files/index';
 import { starterFile } from './files/starter';
-import { docsFile } from './files/docs-file';
+import { docFile } from './files/doc-file';
 import { gitIgnoreTemplate } from './files/git-ignore-tpl';
-import { readmeTemplate } from './files/readme-tpl';
 import { workspaceConfigTemplate } from './files/workspace-config-tpl';
+import { generateFiles } from './files/generate-files';
 
 export const starterTemplate: ComponentTemplate = {
   name: 'starter',
-  description: 'create your own starter - \nDocs: https://bit.dev/docs/dev-services/generator/generate-workspace',
+  description:
+    'create your own workspace starter (env integrated) - \nDocs: https://bit.dev/reference/starters/create-starter',
   generateFiles: (context: ComponentContext) => {
     return [
       {
@@ -18,30 +19,31 @@ export const starterTemplate: ComponentTemplate = {
       },
       {
         relativePath: `${context.name}.starter.ts`,
-        content: starterFile(),
+        content: starterFile(context),
       },
       {
         relativePath: `${context.name}.docs.mdx`,
-        content: docsFile(),
+        content: docFile(context),
       },
       {
         relativePath: 'template/files/git-ignore.ts',
         content: gitIgnoreTemplate(),
       },
-      {
-        relativePath: 'template/files/readme-file.ts',
-        content: readmeTemplate(),
-      },
+
       {
         relativePath: 'template/files/workspace-config.ts',
         content: workspaceConfigTemplate(),
       },
+      {
+        relativePath: 'template/files/generate-files.ts',
+        content: generateFiles(),
+      },
     ];
   },
   config: {
     'teambit.harmony/aspect': {},
     'teambit.envs/envs': {
-      env: 'teambit.harmony/aspect',
+      env: 'teambit.harmony/node',
     },
   },
 };

package/templates/starter-standalone/files/doc-file.ts

@@ -0,0 +1,24 @@
+import { ComponentContext } from '@teambit/generator';
+
+export function docFile(context: ComponentContext) {
+  const { name, componentId } = context;
+  return `---
+description: Starter for generating a ${name} workspace
+labels: ['generator', 'templates', '${name}-workspace']
+---
+
+## Using the ${name} Workspace Starter
+
+How to use this generator locally, essentially for development purposes:
+
+\`\`\`js
+bit new ${name} my-${name}-workspace --load-from /Users/me/path/to/this/dir --aspect ${componentId.toString()}
+\`\`\`
+
+How to use this generator after exporting to a remote scope:
+
+\`\`\`js
+bit new ${name} my-${name}-workspace --aspect ${componentId.toString()}
+\`\`\`
+`;
+}

package/templates/starter-standalone/files/git-ignore-tpl.ts

@@ -0,0 +1,113 @@
+export function gitIgnoreTemplate() {
+  return `export function gitIgnore() {
+  return \`# Bit
+.bit
+public
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Microbundle cache
+.rpt2_cache/
+.rts2_cache_cjs/
+.rts2_cache_es/
+.rts2_cache_umd/
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+.env.test
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+
+# Next.js build output
+.next
+
+# Nuxt.js build / generate output
+.nuxt
+dist
+
+# Gatsby files
+.cache/
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# TernJS port file
+.tern-port
+
+.history
+\`;
+}
+`;
+}

package/templates/starter-standalone/files/index.ts

@@ -0,0 +1,6 @@
+import { ComponentContext } from '@teambit/generator';
+
+export function indexFile({ namePascalCase, name }: ComponentContext) {
+  return `export { ${namePascalCase}WorkspaceStarter } from './${name}.starter';
+`;
+}

package/templates/starter-standalone/files/starter.ts

@@ -0,0 +1,35 @@
+import { ComponentContext } from '@teambit/generator';
+
+export function starterFile({ namePascalCase, name }: ComponentContext) {
+  return `import { WorkspaceContext, Starter } from '@teambit/generator';
+  import { workspaceConfig } from './template/files/workspace-config';
+  import { gitIgnore } from './template/files/git-ignore';
+  
+  export const ${namePascalCase}WorkspaceStarter: Starter = {
+    name: '${name}-workspace',
+    description: 'a ${name} workspace',
+    generateFiles: async (context: WorkspaceContext) => {
+      const files = [
+        {
+          relativePath: 'workspace.jsonc',
+          content: await workspaceConfig(context),
+        },
+      ];
+  
+      if (!context.skipGit) {
+        files.push({
+          relativePath: '.gitignore',
+          content: gitIgnore(),
+        });
+      }
+  
+      return files;
+    },
+    import: () => [
+      { id: 'teambit.community/component-showcase' },
+    ]
+  };
+  
+  export default ${namePascalCase}WorkspaceStarter;
+`;
+}

package/templates/starter-standalone/files/workspace-config-tpl.ts

@@ -0,0 +1,22 @@
+export function workspaceConfigTemplate() {
+  return `import { WorkspaceContext } from '@teambit/generator';
+import { getWorkspaceConfigTemplateParsed, stringifyWorkspaceConfig } from '@teambit/config';
+
+export async function workspaceConfig({ name, defaultScope }: WorkspaceContext) {
+  const configParsed = await getWorkspaceConfigTemplateParsed();
+  configParsed['teambit.workspace/workspace'].name = name;
+  configParsed['teambit.workspace/workspace'].defaultScope = defaultScope || 'org.scope';
+  configParsed['teambit.generator/generator'] = {
+    envs: [
+      'teambit.react/react-env',
+      'teambit.node/node',
+    ],
+  };
+  configParsed['teambit.workspace/variants'] = {
+    '*': {},
+  };
+
+  return stringifyWorkspaceConfig(configParsed);
+}
+`;
+}