@teambit/react 0.0.551 → 0.0.556

package/dist/mount.d.ts

@@ -1,4 +1,9 @@
 import React from 'react';
 import { RenderingContext } from '@teambit/preview';
 declare const _default: (Composition: React.ComponentType, previewContext: RenderingContext) => void;
+/**
+ * this mounts compositions into the DOM in the component preview.
+ * this function can be overridden through ReactAspect.overrideCompositionsMounter() API
+ * to apply custom logic for component DOM mounting.
+ */
 export default _default;

package/dist/react-app-options.d.ts

@@ -1,12 +1,37 @@
 import { Bundler, DevServer } from '@teambit/bundler';
 import { DeployContext } from '@teambit/application';
 export declare type ReactAppOptions = {
+    /**
+     * name of the application.
+     */
     name: string;
+    /**
+     * path to entry files of the application.
+     */
     entry: string[];
+    /**
+     * use server-side rendering for the app.
+     */
     ssr?: boolean;
+    /**
+     * instance of bundler to use.
+     */
     bundler?: Bundler;
+    /**
+     * instance of dev server to use.
+     */
     devServer?: DevServer;
+    /**
+     * deploy function.
+     */
     deploy?: (context: DeployContext) => Promise<void>;
+    /**
+     * prerender routes of application (will create static file for the route)
+     * e.g ['/plugins', '/learn', '/docs/quick-start]
+     */
     prerenderRoutes?: string[];
+    /**
+     * ranges of ports to use to run the app server.
+     */
     portRange?: number[];
 };

package/dist/react.env.d.ts

@@ -19,38 +19,121 @@ export declare const AspectEnvType = "react";
 declare type GetBuildPipeModifiers = PipeServiceModifiersMap & {
     tsModifier?: PipeServiceModifier;
 };
+/**
+ * a component environment built for [React](https://reactjs.org) .
+ */
 export declare class ReactEnv implements TesterEnv, CompilerEnv, LinterEnv, DevEnv, BuilderEnv, DependenciesEnv, PackageEnv, FormatterEnv {
+    /**
+     * jest extension
+     */
     private jestAspect;
+    /**
+     * typescript extension.
+     */
     private tsAspect;
+    /**
+     * compiler extension.
+     */
     private compiler;
+    /**
+     * webpack extension.
+     */
     private webpack;
+    /**
+     * workspace extension.
+     */
     private workspace;
+    /**
+     * pkg extension.
+     */
     private pkg;
+    /**
+     * tester extension
+     */
     private tester;
     private config;
     private eslint;
     private prettier;
-    constructor(jestAspect: JestMain, tsAspect: TypescriptMain, compiler: CompilerMain, webpack: WebpackMain, workspace: Workspace, pkg: PkgMain, tester: TesterMain, config: ReactMainConfig, eslint: ESLintMain, prettier: PrettierMain);
+    constructor(
+    /**
+     * jest extension
+     */
+    jestAspect: JestMain, 
+    /**
+     * typescript extension.
+     */
+    tsAspect: TypescriptMain, 
+    /**
+     * compiler extension.
+     */
+    compiler: CompilerMain, 
+    /**
+     * webpack extension.
+     */
+    webpack: WebpackMain, 
+    /**
+     * workspace extension.
+     */
+    workspace: Workspace, 
+    /**
+     * pkg extension.
+     */
+    pkg: PkgMain, 
+    /**
+     * tester extension
+     */
+    tester: TesterMain, config: ReactMainConfig, eslint: ESLintMain, prettier: PrettierMain);
     getTsConfig(targetTsConfig?: TsConfigSourceFile): TsConfigSourceFile;
     getBuildTsConfig(targetTsConfig?: TsConfigSourceFile): TsConfigSourceFile;
+    /**
+     * returns a component tester.
+     */
     getTester(jestConfigPath: string, jestModulePath?: string): Tester;
     private getTsCompilerOptions;
     private getTsCompiler;
     getCompiler(transformers?: TsConfigTransformer[], tsModule?: typeof ts): import("@teambit/compiler").Compiler;
+    /**
+     * returns and configures the component linter.
+     */
     getLinter(context: LinterContext, transformers?: EslintConfigTransformer[]): Linter;
+    /**
+     * returns and configures the component formatter.
+     */
     getFormatter(context: FormatterContext, transformers?: PrettierConfigTransformer[]): Formatter;
     private getFileMap;
     private writeFileMap;
+    /**
+     * required for `bit start`
+     */
     getDevEnvId(id?: string): string;
+    /**
+     * get a schema generator instance configured with the correct tsconfig.
+     */
     getSchemaExtractor(tsconfig: TsConfigSourceFile): SchemaExtractor;
+    /**
+     * returns and configures the React component dev server.
+     * required for `bit start`
+     */
     getDevServer(context: DevServerContext, transformers?: WebpackConfigTransformer[]): DevServer;
     getBundler(context: BundlerContext, transformers?: WebpackConfigTransformer[]): Promise<Bundler>;
     private getComponentsModulesDirectories;
     private getEntriesFromWebpackConfig;
+    /**
+     * returns a path to a docs template.
+     */
     getDocsTemplate(): string;
     icon: string;
+    /**
+     * returns a paths to a function which mounts a given component to DOM
+     */
     getMounter(): string;
+    /**
+     * define the package json properties to add to each component.
+     */
     getPackageJsonProps(): import("@teambit/pkg").PackageJsonProps;
+    /**
+     * adds dependencies to all configured components.
+     */
     getDependencies(): {
         dependencies: {
             react: string;
@@ -73,6 +156,9 @@ export declare class ReactEnv implements TesterEnv, CompilerEnv, LinterEnv, DevE
             'react-dom': string;
         };
     };
+    /**
+     * returns the component build pipeline.
+     */
     getBuildPipe(modifiers?: GetBuildPipeModifiers): BuildTask[];
     private getCompilerTask;
     __getDescriptor(): Promise<{

package/dist/react.main.runtime.d.ts

@@ -33,8 +33,19 @@ declare type ReactDeps = [
     GeneratorMain
 ];
 export declare type ReactMainConfig = {
+    /**
+     * configure the react env compiler.
+     * can be configured to either TypeScript ('ts') or Babel ('babel').
+     */
     compiler: 'babel' | 'ts';
+    /**
+     * configure the component tester.
+     * can be either Jest ('jest') or Mocha ('mocha')
+     */
     tester: 'jest' | 'mocha';
+    /**
+     * version of React to configure.
+     */
     reactVersion: string;
 };
 export declare type UseWebpackModifiers = {
@@ -52,31 +63,108 @@ export declare type UsePrettierModifiers = {
     transformers: PrettierConfigTransformer[];
 };
 export declare class ReactMain {
+    /**
+     * an instance of the React env.
+     */
     readonly reactEnv: ReactEnv;
     private envs;
     private application;
     private workspace;
-    constructor(reactEnv: ReactEnv, envs: EnvsMain, application: ApplicationMain, workspace: Workspace);
+    constructor(
+    /**
+     * an instance of the React env.
+     */
+    reactEnv: ReactEnv, envs: EnvsMain, application: ApplicationMain, workspace: Workspace);
     readonly env: ReactEnv;
+    /**
+     * override the env's typescript config for both dev and build time.
+     * Replaces both overrideTsConfig (devConfig) and overrideBuildTsConfig (buildConfig)
+     */
     useTypescript(modifiers?: UseTypescriptModifiers, tsModule?: any): EnvTransformer;
+    /**
+     * @deprecated use useTypescript()
+     * override the TS config of the React environment.
+     * @param tsModule typeof `ts` module instance.
+     */
     overrideTsConfig(tsconfig?: Record<string, any>, compilerOptions?: Partial<TsCompilerOptionsWithoutTsConfig>, tsModule?: any): EnvTransformer;
+    /**
+     * Override the Bit documentation link. See docs: https://bit.dev/docs/docs/doc-templates
+     */
     overrideDocsTemplate(templatePath: string): EnvTransformer;
+    /**
+     * @deprecated use useTypescript()
+     * override the build tsconfig.
+     */
     overrideBuildTsConfig(tsconfig?: Record<string, any>, compilerOptions?: Partial<TsCompilerOptionsWithoutTsConfig>, tsModule?: any): EnvTransformer;
+    /**
+     * register a new React application.
+     */
     registerReactApp(options: ReactAppOptions): this;
+    /**
+     * override the env's dev server and preview webpack configurations.
+     * Replaces both overrideDevServerConfig and overridePreviewConfig
+     */
     useWebpack(modifiers?: UseWebpackModifiers): EnvTransformer;
+    /**
+     * An API to mutate the prettier config
+     * @param modifiers
+     * @returns
+     */
     useEslint(modifiers?: UseEslintModifiers): EnvTransformer;
+    /**
+     * An API to mutate the prettier config
+     * @param modifiers
+     * @returns
+     */
     usePrettier(modifiers?: UsePrettierModifiers): EnvTransformer;
+    /**
+     * @deprecated use useWebpack()
+     * override the dev server webpack config.
+     */
     overrideDevServerConfig(config: Configuration): EnvTransformer;
+    /**
+     * @deprecated use useWebpack()
+     * override the preview webpack config.
+     */
     overridePreviewConfig(config: Configuration): EnvTransformer;
     overrideMounter(mounterPath: string): EnvTransformer;
+    /**
+     * create a new composition of the react environment.
+     */
     compose(transformers: EnvTransformer[], targetEnv?: Environment): Environment;
+    /**
+     * override the jest configuration.
+     * @param jestConfigPath {typeof jest} absolute path to jest.config.json.
+     * @param jestModulePath absolute path to jest
+     */
     overrideJestConfig(jestConfigPath: string, jestModulePath?: string): EnvTransformer;
+    /**
+     * override the build pipeline of the component environment.
+     */
     overrideBuildPipe(tasks: BuildTask[]): EnvTransformer;
+    /**
+     * override the compiler tasks inside the build pipeline of the component environment.
+     */
     overrideCompilerTasks(tasks: BuildTask[]): EnvTransformer;
+    /**
+     * override the dependency configuration of the component environment.
+     */
     overrideDependencies(dependencyPolicy: VariantPolicyConfigObject): EnvTransformer;
+    /**
+     * override the workspace compiler.
+     */
     overrideCompiler(compiler: Compiler): EnvTransformer;
+    /**
+     * TODO: @gilad we need to implement this.
+     */
     overrideEslintConfig(): void;
+    /**
+     * override the package json props of the component environment.
+     */
     overridePackageJsonProps(props: PackageJsonProps): EnvTransformer;
+    /**
+     * returns doc adjusted specifically for react components.
+     */
     getDocs(component: Component): {
         abstract: any;
         filePath: any;

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/react",
-  "version": "0.0.551",
+  "version": "0.0.556",
   "homepage": "https://bit.dev/teambit/react/react",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.react",
     "name": "react",
-    "version": "0.0.551"
+    "version": "0.0.556"
   },
   "dependencies": {
     "react-error-boundary": "^3.0.0",
@@ -79,46 +79,46 @@
     "@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.354",
-    "@teambit/preview": "0.0.551",
-    "@teambit/react.ui.error-fallback": "0.0.83",
-    "@teambit/react.ui.loader-fallback": "0.0.61",
-    "@teambit/compositions.ui.hooks.use-composition": "0.0.136",
+    "@teambit/preview": "0.0.556",
+    "@teambit/react.ui.error-fallback": "0.0.88",
+    "@teambit/react.ui.loader-fallback": "0.0.66",
+    "@teambit/compositions.ui.hooks.use-composition": "0.0.141",
     "@teambit/design.ui.input.option-button": "0.0.26",
     "@teambit/design.ui.tooltip": "0.0.352",
-    "@teambit/application": "0.0.193",
-    "@teambit/bundler": "0.0.551",
-    "@teambit/builder": "0.0.551",
-    "@teambit/isolator": "0.0.551",
-    "@teambit/toolbox.network.get-port": "0.0.86",
-    "@teambit/compiler": "0.0.551",
-    "@teambit/component.modules.component-url": "0.0.93",
-    "@teambit/component": "0.0.551",
-    "@teambit/envs": "0.0.551",
-    "@teambit/eslint": "0.0.551",
-    "@teambit/formatter": "0.0.102",
-    "@teambit/jest": "0.0.551",
-    "@teambit/linter": "0.0.551",
-    "@teambit/pkg": "0.0.551",
-    "@teambit/prettier": "0.0.102",
-    "@teambit/react.babel.bit-react-transformer": "0.0.466",
-    "@teambit/schema": "0.0.551",
-    "@teambit/tester": "0.0.551",
-    "@teambit/typescript": "0.0.551",
-    "@teambit/webpack": "0.0.551",
-    "@teambit/workspace": "0.0.551",
-    "@teambit/cli": "0.0.382",
-    "@teambit/dependency-resolver": "0.0.551",
-    "@teambit/generator": "0.0.551",
-    "@teambit/graphql": "0.0.551",
-    "@teambit/react.ui.highlighter-provider": "0.0.146",
-    "@teambit/compositions": "0.0.551",
-    "@teambit/ui": "0.0.551",
-    "@teambit/react.eslint-config-bit-react": "0.0.459",
-    "@teambit/mdx.modules.mdx-loader": "0.0.460",
-    "@teambit/webpack.modules.generate-style-loaders": "0.0.76",
-    "@teambit/webpack.modules.style-regexps": "0.0.105",
-    "@teambit/component-id": "0.0.372",
-    "@teambit/config": "0.0.393"
+    "@teambit/application": "0.0.198",
+    "@teambit/bundler": "0.0.556",
+    "@teambit/builder": "0.0.556",
+    "@teambit/isolator": "0.0.556",
+    "@teambit/toolbox.network.get-port": "0.0.91",
+    "@teambit/compiler": "0.0.556",
+    "@teambit/component.modules.component-url": "0.0.98",
+    "@teambit/component": "0.0.556",
+    "@teambit/envs": "0.0.556",
+    "@teambit/eslint": "0.0.556",
+    "@teambit/formatter": "0.0.107",
+    "@teambit/jest": "0.0.556",
+    "@teambit/linter": "0.0.556",
+    "@teambit/pkg": "0.0.556",
+    "@teambit/prettier": "0.0.107",
+    "@teambit/react.babel.bit-react-transformer": "0.0.471",
+    "@teambit/schema": "0.0.556",
+    "@teambit/tester": "0.0.556",
+    "@teambit/typescript": "0.0.556",
+    "@teambit/webpack": "0.0.556",
+    "@teambit/workspace": "0.0.556",
+    "@teambit/cli": "0.0.387",
+    "@teambit/dependency-resolver": "0.0.556",
+    "@teambit/generator": "0.0.556",
+    "@teambit/graphql": "0.0.556",
+    "@teambit/react.ui.highlighter-provider": "0.0.151",
+    "@teambit/compositions": "0.0.556",
+    "@teambit/ui": "0.0.556",
+    "@teambit/react.eslint-config-bit-react": "0.0.464",
+    "@teambit/mdx.modules.mdx-loader": "0.0.465",
+    "@teambit/webpack.modules.generate-style-loaders": "0.0.81",
+    "@teambit/webpack.modules.style-regexps": "0.0.110",
+    "@teambit/component-id": "0.0.377",
+    "@teambit/config": "0.0.398"
   },
   "devDependencies": {
     "@types/react": "^17.0.8",
@@ -133,10 +133,10 @@
     "@types/mocha": "5.2.7",
     "@types/testing-library__jest-dom": "5.9.5",
     "@types/jest": "^26.0.0",
-    "@teambit/react.aspect-docs.react": "0.0.101"
+    "@teambit/react.aspect-docs.react": "0.0.106"
   },
   "peerDependencies": {
-    "@teambit/legacy": "1.0.169",
+    "@teambit/legacy": "1.0.173",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },
@@ -198,11 +198,17 @@
         "@types/jest": "^26.0.0"
       },
       "peerDependencies": {
-        "@teambit/legacy": "1.0.169",
+        "@teambit/legacy": "1.0.173",
         "react-dom": "^16.8.0 || ^17.0.0",
         "react": "^16.8.0 || ^17.0.0"
       }
     }
   },
+  "files": [
+    "dist",
+    "!dist/tsconfig.tsbuildinfo",
+    "README.md",
+    "README.mdx"
+  ],
   "private": false
 }

package/compositions-app.tsx

@@ -1,31 +0,0 @@
-import React from 'react';
-import { Composer } from '@teambit/base-ui.utils.composer';
-import { StandaloneNotFoundPage } from '@teambit/design.ui.pages.standalone-not-found-page';
-import { RenderingContext } from '@teambit/preview';
-import { ErrorFallback } from '@teambit/react.ui.error-fallback';
-import { LoaderFallback } from '@teambit/react.ui.loader-fallback';
-import { ErrorBoundary } from 'react-error-boundary';
-import { ReactAspect } from './react.aspect';
-
-// hide scrollbars so they won't be visible in the preview at the component card (and it's ok not to show them in the compositions page)
-const hideScrollbars = 'body::-webkit-scrollbar {display: none;}';
-
-export function CompositionsApp({
-  Composition,
-  previewContext,
-}: {
-  Composition?: React.ComponentType;
-  previewContext: RenderingContext;
-}) {
-  const reactContext = previewContext.get(ReactAspect.id);
-  const providers = reactContext?.providers || [];
-
-  return (
-    <ErrorBoundary FallbackComponent={ErrorFallback} resetKeys={[Composition]}>
-      <Composer components={providers}>
-        <style>{hideScrollbars}</style>
-        <LoaderFallback Target={Composition} DefaultComponent={StandaloneNotFoundPage} />
-      </Composer>
-    </ErrorBoundary>
-  );
-}

package/eslint/eslintrc.js

@@ -1,12 +0,0 @@
-// Using object
-import '@teambit/react.eslint-config-bit-react';
-
-module.exports = {
-  extends: [require.resolve('@teambit/react.eslint-config-bit-react')],
-  parserOptions: {
-    // parser: require.resolve('@typescript-eslint/parser'),
-    // createDefaultProgram: true,
-    // resolve the env tsconfig.
-    project: require.resolve('../typescript/tsconfig.json'),
-  },
-};

package/highlighter-widget.tsx

@@ -1,19 +0,0 @@
-import React from 'react';
-import { OptionButton } from '@teambit/design.ui.input.option-button';
-import { Tooltip } from '@teambit/design.ui.tooltip';
-import { usePreviewQueryParams } from '@teambit/compositions.ui.hooks.use-composition';
-
-const PARAM_NAME = 'highlighter';
-
-export function HighlighterWidget() {
-  const [active, setActive] = usePreviewQueryParams(PARAM_NAME);
-
-  return (
-    <Tooltip content="Component Highlighter (beta)">
-      {/* tooltip requires child with ref */}
-      <span>
-        <OptionButton icon="highlighter-toggle" onClick={() => setActive(!active)} active={active} />
-      </span>
-    </Tooltip>
-  );
-}

package/index.ts

@@ -1,9 +0,0 @@
-export type { ReactMain, UseWebpackModifiers, UseTypescriptModifiers } from './react.main.runtime';
-export type { ReactPreview } from './react.preview.runtime';
-export type { ReactEnv } from './react.env';
-export type { ReactAppOptions } from './react-app-options';
-// Re-export it to indicate for people that extends the react env that we are using it
-// Commented - make errors in safari - SyntaxError: Invalid regular expression: invalid group specifier name
-// export * as styleRegexps from '@teambit/modules.style-regexps';
-
-export { ReactAspect, ReactAspect as default } from './react.aspect';

package/jest/css-transform.js

@@ -1,12 +0,0 @@
-// This is a custom Jest transformer turning style imports into empty objects.
-// http://facebook.github.io/jest/docs/en/webpack.html
-
-module.exports = {
-  process() {
-    return 'module.exports = {};';
-  },
-  getCacheKey() {
-    // The output is always the same.
-    return 'cssTransform';
-  },
-};

package/jest/file-transform.js

@@ -1,38 +0,0 @@
-const path = require('path');
-const camelcase = require('camelcase');
-
-// This is a custom Jest transformer turning file imports into filenames.
-// http://facebook.github.io/jest/docs/en/webpack.html
-
-module.exports = {
-  process(src, filename) {
-    const assetFilename = JSON.stringify(path.basename(filename));
-
-    if (filename.match(/\.svg$/)) {
-      // Based on how SVGR generates a component name:
-      // https://github.com/smooth-code/svgr/blob/01b194cf967347d43d4cbe6b434404731b87cf27/packages/core/src/state.js#L6
-      const pascalCaseFilename = camelcase(path.parse(filename).name, {
-        pascalCase: true,
-      });
-      const componentName = `Svg${pascalCaseFilename}`;
-      return `const React = require('react');
-      module.exports = {
-        __esModule: true,
-        default: ${assetFilename},
-        ReactComponent: React.forwardRef(function ${componentName}(props, ref) {
-          return {
-            $$typeof: Symbol.for('react.element'),
-            type: 'svg',
-            ref: ref,
-            key: null,
-            props: Object.assign({}, props, {
-              children: ${assetFilename}
-            })
-          };
-        }),
-      };`;
-    }
-
-    return `module.exports = ${assetFilename};`;
-  },
-};

package/jest/jest.config.js

@@ -1,30 +0,0 @@
-module.exports = {
-  // "roots": [
-  //   "<rootDir>/src"
-  // ],
-  // "collectCoverageFrom": [
-  //   "src/**/*.{js,jsx,ts,tsx}",
-  //   "!src/**/*.d.ts"
-  // ],
-  setupFiles: [require.resolve('react-app-polyfill/jsdom')],
-  setupFilesAfterEnv: [require.resolve('./setupTests.js')],
-  // "testMatch": [
-  // "<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}",
-  // "<rootDir>/src/**/*.{spec,test}.{js,jsx,ts,tsx}"
-  // ],
-  testEnvironment: require.resolve('jest-environment-jsdom'),
-  transform: {
-    '^.+\\.(js|jsx|ts|tsx)$': require.resolve('./transformer'),
-    '^.+\\.css$': require.resolve('./css-transform.js'),
-    '^(?!.*\\.(js|jsx|ts|tsx|css|json)$)': require.resolve('./file-transform.js'),
-    // '^(?!.*\\.(svg|png|jpg|jpeg|gif|webp|woff|ttf|woff2)$)': require.resolve('./file-transform.js'),
-  },
-  transformIgnorePatterns: ['[/\\\\]node_modules[/\\\\].+\\.(js|jsx|ts|tsx)$', '^.+\\.module\\.(css|sass|scss)$'],
-  modulePaths: [],
-  moduleNameMapper: {
-    '^react-native$': require.resolve('react-native-web'),
-    '^.+\\.module\\.(css|sass|scss)$': require.resolve('identity-obj-proxy'),
-  },
-  moduleFileExtensions: ['web.js', 'js', 'web.ts', 'ts', 'web.tsx', 'tsx', 'json', 'web.jsx', 'jsx', 'node'],
-  // watchPlugins: [require.resolve('jest-watch-typeahead/filename'), require.resolve('jest-watch-typeahead/testname')],
-};

package/jest/setupTests.js

@@ -1,7 +0,0 @@
-// add babel-polyfill.
-// require('babel-polyfill');
-// jest-dom adds custom jest matchers for asserting on DOM nodes.
-// allows you to do things like:
-// expect(element).toHaveTextContent(/react/i)
-// learn more: https://github.com/testing-library/jest-dom
-require('@testing-library/jest-dom/extend-expect');

package/jest/transformer.js

@@ -1,41 +0,0 @@
-/* eslint-disable global-require */
-const { transform } = require('@babel/core');
-
-const presets = [
-  require('@babel/preset-react'),
-  require('@babel/preset-typescript'),
-  require('babel-preset-jest'),
-  [
-    require('@babel/preset-env'),
-    {
-      targets: {
-        node: 12,
-      },
-      useBuiltIns: 'usage',
-      corejs: 3,
-    },
-  ],
-];
-const plugins = [
-  [require('@babel/plugin-transform-modules-commonjs')],
-  [require('babel-plugin-transform-typescript-metadata')],
-  [require('@babel/plugin-proposal-decorators'), { legacy: true }],
-  [require('@babel/plugin-transform-runtime')],
-  [require('@babel/plugin-proposal-object-rest-spread')],
-  [require('@babel/plugin-proposal-class-properties')],
-];
-
-module.exports = {
-  process(src, filename) {
-    const result = transform(src, {
-      sourceMap: 'inline',
-      filename,
-      presets,
-      plugins,
-      babelrc: false,
-      configFile: false,
-    });
-
-    return result ? result.code : src;
-  },
-};

package/mount.tsx

@@ -1,17 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import { RenderingContext } from '@teambit/preview';
-
-import { CompositionsApp } from './compositions-app';
-
-/**
- * this mounts compositions into the DOM in the component preview.
- * this function can be overridden through ReactAspect.overrideCompositionsMounter() API
- * to apply custom logic for component DOM mounting.
- */
-export default (Composition: React.ComponentType, previewContext: RenderingContext) => {
-  ReactDOM.render(
-    <CompositionsApp Composition={Composition} previewContext={previewContext} />,
-    document.getElementById('root')
-  );
-};