@teambit/react 0.0.668 → 0.0.671

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/react",
-  "version": "0.0.668",
+  "version": "0.0.671",
   "homepage": "https://bit.dev/teambit/react/react",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.react",
     "name": "react",
-    "version": "0.0.668"
+    "version": "0.0.671"
   },
   "dependencies": {
     "react-error-boundary": "^3.0.0",
@@ -79,39 +79,39 @@
     "@teambit/react.instructions.react.adding-compositions": "0.0.6",
     "@teambit/react.instructions.react.adding-tests": "0.0.6",
     "@teambit/design.ui.pages.standalone-not-found-page": "0.0.355",
-    "@teambit/preview": "0.0.668",
+    "@teambit/preview": "0.0.671",
     "@teambit/react.ui.error-fallback": "0.0.110",
     "@teambit/react.ui.loader-fallback": "0.0.89",
     "@teambit/compositions.ui.hooks.use-composition": "0.0.163",
     "@teambit/design.ui.input.option-button": "0.0.26",
     "@teambit/design.ui.tooltip": "0.0.352",
-    "@teambit/builder": "0.0.668",
-    "@teambit/bundler": "0.0.668",
-    "@teambit/compiler": "0.0.668",
+    "@teambit/builder": "0.0.671",
+    "@teambit/bundler": "0.0.671",
+    "@teambit/compiler": "0.0.671",
     "@teambit/component.modules.component-url": "0.0.123",
-    "@teambit/component": "0.0.668",
-    "@teambit/envs": "0.0.668",
-    "@teambit/eslint": "0.0.668",
-    "@teambit/formatter": "0.0.219",
-    "@teambit/jest": "0.0.668",
-    "@teambit/linter": "0.0.668",
-    "@teambit/pkg": "0.0.668",
-    "@teambit/prettier": "0.0.219",
+    "@teambit/component": "0.0.671",
+    "@teambit/envs": "0.0.671",
+    "@teambit/eslint": "0.0.671",
+    "@teambit/formatter": "0.0.222",
+    "@teambit/jest": "0.0.671",
+    "@teambit/linter": "0.0.671",
+    "@teambit/pkg": "0.0.671",
+    "@teambit/prettier": "0.0.222",
     "@teambit/react.ui.highlighter.component-metadata.bit-component-meta": "0.0.21",
-    "@teambit/schema": "0.0.668",
-    "@teambit/tester": "0.0.668",
-    "@teambit/typescript": "0.0.668",
-    "@teambit/webpack": "0.0.668",
-    "@teambit/workspace": "0.0.668",
-    "@teambit/application": "0.0.310",
-    "@teambit/cli": "0.0.451",
-    "@teambit/dependency-resolver": "0.0.668",
-    "@teambit/generator": "0.0.668",
-    "@teambit/graphql": "0.0.668",
+    "@teambit/schema": "0.0.671",
+    "@teambit/tester": "0.0.671",
+    "@teambit/typescript": "0.0.671",
+    "@teambit/webpack": "0.0.671",
+    "@teambit/workspace": "0.0.671",
+    "@teambit/application": "0.0.313",
+    "@teambit/cli": "0.0.452",
+    "@teambit/dependency-resolver": "0.0.671",
+    "@teambit/generator": "0.0.671",
+    "@teambit/graphql": "0.0.671",
     "@teambit/react.ui.highlighter-provider": "0.0.184",
-    "@teambit/compositions": "0.0.668",
-    "@teambit/ui": "0.0.668",
-    "@teambit/react.eslint-config-bit-react": "0.0.528",
+    "@teambit/compositions": "0.0.671",
+    "@teambit/ui": "0.0.671",
+    "@teambit/react.eslint-config-bit-react": "0.0.529",
     "@teambit/webpack.modules.generate-expose-loaders": "0.0.3",
     "@teambit/webpack.modules.generate-externals": "0.0.3",
     "@teambit/webpack.modules.config-mutator": "0.0.137",
@@ -121,7 +121,7 @@
     "@teambit/webpack.modules.style-regexps": "0.0.132",
     "@teambit/component-id": "0.0.401",
     "@teambit/toolbox.network.get-port": "0.0.113",
-    "@teambit/config": "0.0.464"
+    "@teambit/config": "0.0.465"
   },
   "devDependencies": {
     "@types/react": "^17.0.8",
@@ -140,7 +140,7 @@
     "@teambit/react.aspect-docs.react": "0.0.132"
   },
   "peerDependencies": {
-    "@teambit/legacy": "1.0.230",
+    "@teambit/legacy": "1.0.231",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },
@@ -202,7 +202,7 @@
         "@types/jest": "^26.0.0"
       },
       "peerDependencies": {
-        "@teambit/legacy": "1.0.230",
+        "@teambit/legacy": "1.0.231",
         "react-dom": "^16.8.0 || ^17.0.0",
         "react": "^16.8.0 || ^17.0.0"
       }

package/{preview-1646709972516.js → preview-1646920477648.js}

@@ -1,2 +1,2 @@
-export const compositions = [require('/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.react_react@0.0.668/dist/react.composition.js')]
-export const overview = [require('/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.react_react@0.0.668/dist/react.docs.mdx')]
+export const compositions = [require('/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.react_react@0.0.671/dist/react.composition.js')]
+export const overview = [require('/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.react_react@0.0.671/dist/react.docs.mdx')]

package/templates/react-component/files/index-file.ts

@@ -0,0 +1,12 @@
+import { ComponentContext } from '@teambit/generator';
+
+export const indexFile = (context: ComponentContext) => {
+  const { name, namePascalCase: Name } = context;
+
+  return {
+    relativePath: 'index.ts',
+    content: `export { ${Name} } from './${name}';
+export type { ${Name}Props } from './${name}';
+`,
+  };
+}

package/templates/react-component/index.ts

@@ -3,37 +3,23 @@ import { componentFile } from './files/component';
 import { compositionFile } from './files/composition';
 import { docsFile } from './files/docs';
 import { testFile } from './files/test';
+import { indexFile } from './files/index-file';
 
 export const reactComponent: ComponentTemplate = {
   name: 'react',
   description: 'a basic react component',
   generateFiles: (context: ComponentContext) => {
-    const { name, namePascalCase: Name } = context;
-    const indexFile = {
-      relativePath: 'index.ts',
-      content: `export { ${Name} } from './${name}';
-export type { ${Name}Props } from './${name}';
-`,
-    };
-
-    return [indexFile, componentFile(context), compositionFile(context), docsFile(context), testFile(context)];
+    return [indexFile(context), componentFile(context), compositionFile(context), docsFile(context), testFile(context)];
   },
+  // config: {
+  //   'teambit.envs/envs': {
+  //     env: 'teambit.react/react',
+  //   },
+  // }
 };
 
 export const deprecatedReactComponent: ComponentTemplate = {
+  ...reactComponent,
   name: 'react-component',
-  description: 'a basic react component',
   hidden: true,
-
-  generateFiles: (context: ComponentContext) => {
-    const { name, namePascalCase: Name } = context;
-    const indexFile = {
-      relativePath: 'index.ts',
-      content: `export { ${Name} } from './${name}';
-export type { ${Name}Props } from './${name}';
-`,
-    };
-
-    return [indexFile, componentFile(context), compositionFile(context), docsFile(context), testFile(context)];
-  },
 };

package/templates/react-component-js/index.ts

@@ -15,24 +15,17 @@ export const reactComponentJS: ComponentTemplate = {
       content: `export { ${Name} } from './${name}';
 `,
     };
-
     return [indexFile, componentFile(context), compositionFile(context), docsFile(context), testFile(context)];
   },
+  // config: {
+  //   'teambit.envs/envs': {
+  //     env: 'teambit.react/react',
+  //   },
+  // }
 };
 
 export const deprecatedReactComponentJS: ComponentTemplate = {
+  ...reactComponentJS,
   name: 'react-component-js',
-  description: 'a basic react component in js',
   hidden: true,
-
-  generateFiles: (context: ComponentContext) => {
-    const { name, namePascalCase: Name } = context;
-    const indexFile = {
-      relativePath: 'index.js',
-      content: `export { ${Name} } from './${name}';
-`,
-    };
-
-    return [indexFile, componentFile(context), compositionFile(context), docsFile(context), testFile(context)];
-  },
 };

package/templates/react-context/files/index-file.ts

@@ -0,0 +1,14 @@
+import { ComponentContext } from '@teambit/generator';
+
+export const indexFile = (context: ComponentContext) => {
+  const { name, namePascalCase: Name } = context;
+
+  return {
+    relativePath: 'index.ts',
+    content: `export { ${Name}Context } from './${name}-context';
+export type { ${Name}ContextType } from './${name}-context';
+export { ${Name}Provider } from './${name}-context-provider';
+export type { ${Name}ProviderProps } from './${name}-context-provider';
+`,
+  };
+}

package/templates/react-context/index.ts

@@ -4,24 +4,15 @@ import { contextProviderFile } from './files/context-provider';
 import { compositionFile } from './files/composition';
 import { docsFile } from './files/docs';
 import { testFile } from './files/test';
+import { indexFile } from './files/index-file';
 
 export const reactContext: ComponentTemplate = {
   name: 'react-context',
   description: 'a react context component',
 
   generateFiles: (context: ComponentContext) => {
-    const { name, namePascalCase: Name } = context;
-    const indexFile = {
-      relativePath: 'index.ts',
-      content: `export { ${Name}Context } from './${name}-context';
-export type { ${Name}ContextType } from './${name}-context';
-export { ${Name}Provider } from './${name}-context-provider';
-export type { ${Name}ProviderProps } from './${name}-context-provider';
-`,
-    };
-
     return [
-      indexFile,
+      indexFile(context),
       contextFile(context),
       contextProviderFile(context),
       compositionFile(context),
@@ -29,4 +20,9 @@ export type { ${Name}ProviderProps } from './${name}-context-provider';
       testFile(context),
     ];
   },
+  // config: {
+  //   'teambit.envs/envs': {
+  //     env: 'teambit.react/react',
+  //   },
+  // }
 };

package/templates/react-env/index.ts

@@ -48,4 +48,10 @@ export const reactEnvTemplate: ComponentTemplate = {
       },
     ];
   },
+  config: {
+    'teambit.envs/env': {},
+    'teambit.envs/envs': {
+      env: 'teambit.envs/env',
+    },
+  },
 };

package/templates/react-hook/files/index-file.ts

@@ -0,0 +1,11 @@
+import { ComponentContext } from '@teambit/generator';
+
+export const indexFile = (context: ComponentContext) => {
+  const { name, namePascalCase: Name } = context;
+
+  return {
+    relativePath: 'index.ts',
+    content: `export { ${Name} } from './${name}';
+`,
+  };
+}

package/templates/react-hook/index.ts

@@ -3,19 +3,18 @@ import { componentFile } from './files/component';
 import { compositionFile } from './files/composition';
 import { docsFile } from './files/docs';
 import { testFile } from './files/test';
+import { indexFile } from './files/index-file';
 
 export const reactHook: ComponentTemplate = {
   name: 'react-hook',
   description: 'a react hook component',
 
   generateFiles: (context: ComponentContext) => {
-    const { name, nameCamelCase: Name } = context;
-    const indexFile = {
-      relativePath: 'index.ts',
-      content: `export { ${Name} } from './${name}';
-`,
-    };
-
-    return [indexFile, componentFile(context), compositionFile(context), docsFile(context), testFile(context)];
+    return [indexFile(context), componentFile(context), compositionFile(context), docsFile(context), testFile(context)];
   },
+  // config: {
+  //   'teambit.envs/envs': {
+  //     env: 'teambit.react/react',
+  //   },
+  // }
 };

package/webpack/webpack.config.base.ts

@@ -297,6 +297,9 @@ export default function (isEnvProduction = false): Configuration {
                   maxSize: imageInlineSizeLimit,
                 },
               },
+              generator: {
+                filename: 'static/images/[hash][ext][query]',
+              },
             },
             {
               // loads svg as both inlineUrl and react component, like:
@@ -319,6 +322,14 @@ export default function (isEnvProduction = false): Configuration {
                 },
               ],
             },
+            {
+              test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
+              type: 'asset',
+              generator: {
+                filename: 'static/fonts/[hash][ext][query]',
+              },
+            },
+
             // "file" loader makes sure those assets get served by WebpackDevServer.
             // When you `import` an asset, you get its (virtual) filename.
             // In production, they would get copied to the `build` folder.
@@ -330,6 +341,9 @@ export default function (isEnvProduction = false): Configuration {
               // Also exclude `html` and `json` extensions so they get processed
               // by webpacks internal loaders.
               exclude: [/\.(js|mjs|cjs|jsx|ts|tsx)$/, /\.html$/, /\.mdx?/, /\.json$/, /\.css$/],
+              generator: {
+                filename: 'static/[hash][ext][query]',
+              },
               type: 'asset',
             },
             // ** STOP ** Are you adding a new loader?