@teambit/react 0.0.734 → 0.0.737

package/artifacts/preview/teambit_react_react-preview.js

@@ -1,4 +1,4 @@
-(function(root,factory){typeof exports=="object"&&typeof module=="object"?module.exports=factory():typeof define=="function"&&define.amd?define([],factory):typeof exports=="object"?exports["teambit.react/react-preview"]=factory():root["teambit.react/react-preview"]=factory()})(self,function(){return(()=>{var __webpack_modules__={88244:module2=>{function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}module2.exports=_interopRequireDefault},82422:(__unused_webpack_module,__webpack_exports__2,__webpack_require__2)=>{"use strict";__webpack_require__2.r(__webpack_exports__2),__webpack_require__2.d(__webpack_exports__2,{default:()=>MDXContent});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__2(63804),react__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__2.n(react__WEBPACK_IMPORTED_MODULE_0__),_mdx_js_react__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__2(85057),_mdx_js_react__WEBPACK_IMPORTED_MODULE_1___default=__webpack_require__2.n(_mdx_js_react__WEBPACK_IMPORTED_MODULE_1__),_teambit_mdx_ui_mdx_scope_context__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__2(58459),_teambit_mdx_ui_mdx_scope_context__WEBPACK_IMPORTED_MODULE_2___default=__webpack_require__2.n(_teambit_mdx_ui_mdx_scope_context__WEBPACK_IMPORTED_MODULE_2__),_teambit_react_content_react_overview__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__2(55906),_excluded=["components"];function _extends(){return _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_extends.apply(this,arguments)}function _objectWithoutProperties(source,excluded){if(source==null)return{};var target=_objectWithoutPropertiesLoose(source,excluded),key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++)key=sourceSymbolKeys[i],!(excluded.indexOf(key)>=0)&&(!Object.prototype.propertyIsEnumerable.call(source,key)||(target[key]=source[key]))}return target}function _objectWithoutPropertiesLoose(source,excluded){if(source==null)return{};var target={},sourceKeys=Object.keys(source),key,i;for(i=0;i<sourceKeys.length;i++)key=sourceKeys[i],!(excluded.indexOf(key)>=0)&&(target[key]=source[key]);return target}var layoutProps={},MDXLayout="wrapper";function MDXContent(_ref){var components=_ref.components,props=_objectWithoutProperties(_ref,_excluded);return(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_1__.mdx)(MDXLayout,_extends({},layoutProps,props,{components,mdxType:"MDXLayout"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_1__.mdx)(_teambit_mdx_ui_mdx_scope_context__WEBPACK_IMPORTED_MODULE_2__.MDXScopeProvider,{components:{ReactOverview:_teambit_react_content_react_overview__WEBPACK_IMPORTED_MODULE_3__.ZP},mdxType:"MDXScopeProvider"},(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_1__.mdx)(_teambit_react_content_react_overview__WEBPACK_IMPORTED_MODULE_3__.ZP,{mdxType:"ReactOverview"})))}MDXContent.isMDXComponent=!0},55906:(__unused_webpack_module,exports2,__webpack_require__2)=>{"use strict";var __webpack_unused_export__,__bit_component={id:"teambit.react/content/react-overview@1.95.0",homepage:"https://bit.dev/teambit/react/content/react-overview",exported:!0};__webpack_unused_export__={value:!0},__webpack_unused_export__={enumerable:!0,get:function(){return _reactOverview.default}},Object.defineProperty(exports2,"ZP",{enumerable:!0,get:function(){return _reactOverview.default}});var _reactOverview=_interopRequireDefault(__webpack_require__2(2664));function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}_interopRequireDefault.__bit_component=__bit_component},2664:(__unused_webpack_module,exports2,__webpack_require__2)=>{"use strict";var __bit_component={id:"teambit.react/content/react-overview@1.95.0",homepage:"https://bit.dev/teambit/react/content/react-overview",exported:!0};Object.defineProperty(exports2,"__esModule",{value:!0}),exports2.default=MDXContent;var _react=_interopRequireDefault(__webpack_require__2(63804)),_react2=__webpack_require__2(85057),_mdxUi=__webpack_require__2(58459),_excluded=["components"];function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}_interopRequireDefault.__bit_component=__bit_component;function _extends(){return _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_extends.apply(this,arguments)}_extends.__bit_component=__bit_component;function _objectWithoutProperties(source,excluded){if(source==null)return{};var target=_objectWithoutPropertiesLoose(source,excluded),key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++)key=sourceSymbolKeys[i],!(excluded.indexOf(key)>=0)&&(!Object.prototype.propertyIsEnumerable.call(source,key)||(target[key]=source[key]))}return target}_objectWithoutProperties.__bit_component=__bit_component;function _objectWithoutPropertiesLoose(source,excluded){if(source==null)return{};var target={},sourceKeys=Object.keys(source),key,i;for(i=0;i<sourceKeys.length;i++)key=sourceKeys[i],!(excluded.indexOf(key)>=0)&&(target[key]=source[key]);return target}_objectWithoutPropertiesLoose.__bit_component=__bit_component;var layoutProps={},MDXLayout="wrapper";function MDXContent(_ref){var components=_ref.components,props=_objectWithoutProperties(_ref,_excluded);return(0,_react2.mdx)(MDXLayout,_extends({},layoutProps,props,{components,mdxType:"MDXLayout"}),(0,_react2.mdx)(_mdxUi.MDXScopeProvider,{components:{},mdxType:"MDXScopeProvider"},(0,_react2.mdx)("h1",null,"React Overview"),(0,_react2.mdx)("p",null,`React is teambit's Component Development Environment (Env) for React.
+(function(root,factory){typeof exports=="object"&&typeof module=="object"?module.exports=factory():typeof define=="function"&&define.amd?define([],factory):typeof exports=="object"?exports["teambit.react/react-preview"]=factory():root["teambit.react/react-preview"]=factory()})(self,function(){return(()=>{var __webpack_modules__={88244:module2=>{function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}module2.exports=_interopRequireDefault},76658:(__unused_webpack_module,__webpack_exports__2,__webpack_require__2)=>{"use strict";__webpack_require__2.r(__webpack_exports__2),__webpack_require__2.d(__webpack_exports__2,{default:()=>MDXContent});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__2(63804),react__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__2.n(react__WEBPACK_IMPORTED_MODULE_0__),_mdx_js_react__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__2(85057),_mdx_js_react__WEBPACK_IMPORTED_MODULE_1___default=__webpack_require__2.n(_mdx_js_react__WEBPACK_IMPORTED_MODULE_1__),_teambit_mdx_ui_mdx_scope_context__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__2(58459),_teambit_mdx_ui_mdx_scope_context__WEBPACK_IMPORTED_MODULE_2___default=__webpack_require__2.n(_teambit_mdx_ui_mdx_scope_context__WEBPACK_IMPORTED_MODULE_2__),_teambit_react_content_react_overview__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__2(55906),_excluded=["components"];function _extends(){return _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_extends.apply(this,arguments)}function _objectWithoutProperties(source,excluded){if(source==null)return{};var target=_objectWithoutPropertiesLoose(source,excluded),key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++)key=sourceSymbolKeys[i],!(excluded.indexOf(key)>=0)&&(!Object.prototype.propertyIsEnumerable.call(source,key)||(target[key]=source[key]))}return target}function _objectWithoutPropertiesLoose(source,excluded){if(source==null)return{};var target={},sourceKeys=Object.keys(source),key,i;for(i=0;i<sourceKeys.length;i++)key=sourceKeys[i],!(excluded.indexOf(key)>=0)&&(target[key]=source[key]);return target}var layoutProps={},MDXLayout="wrapper";function MDXContent(_ref){var components=_ref.components,props=_objectWithoutProperties(_ref,_excluded);return(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_1__.mdx)(MDXLayout,_extends({},layoutProps,props,{components,mdxType:"MDXLayout"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_1__.mdx)(_teambit_mdx_ui_mdx_scope_context__WEBPACK_IMPORTED_MODULE_2__.MDXScopeProvider,{components:{ReactOverview:_teambit_react_content_react_overview__WEBPACK_IMPORTED_MODULE_3__.ZP},mdxType:"MDXScopeProvider"},(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_1__.mdx)(_teambit_react_content_react_overview__WEBPACK_IMPORTED_MODULE_3__.ZP,{mdxType:"ReactOverview"})))}MDXContent.isMDXComponent=!0},55906:(__unused_webpack_module,exports2,__webpack_require__2)=>{"use strict";var __webpack_unused_export__,__bit_component={id:"teambit.react/content/react-overview@1.95.0",homepage:"https://bit.dev/teambit/react/content/react-overview",exported:!0};__webpack_unused_export__={value:!0},__webpack_unused_export__={enumerable:!0,get:function(){return _reactOverview.default}},Object.defineProperty(exports2,"ZP",{enumerable:!0,get:function(){return _reactOverview.default}});var _reactOverview=_interopRequireDefault(__webpack_require__2(2664));function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}_interopRequireDefault.__bit_component=__bit_component},2664:(__unused_webpack_module,exports2,__webpack_require__2)=>{"use strict";var __bit_component={id:"teambit.react/content/react-overview@1.95.0",homepage:"https://bit.dev/teambit/react/content/react-overview",exported:!0};Object.defineProperty(exports2,"__esModule",{value:!0}),exports2.default=MDXContent;var _react=_interopRequireDefault(__webpack_require__2(63804)),_react2=__webpack_require__2(85057),_mdxUi=__webpack_require__2(58459),_excluded=["components"];function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}_interopRequireDefault.__bit_component=__bit_component;function _extends(){return _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_extends.apply(this,arguments)}_extends.__bit_component=__bit_component;function _objectWithoutProperties(source,excluded){if(source==null)return{};var target=_objectWithoutPropertiesLoose(source,excluded),key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++)key=sourceSymbolKeys[i],!(excluded.indexOf(key)>=0)&&(!Object.prototype.propertyIsEnumerable.call(source,key)||(target[key]=source[key]))}return target}_objectWithoutProperties.__bit_component=__bit_component;function _objectWithoutPropertiesLoose(source,excluded){if(source==null)return{};var target={},sourceKeys=Object.keys(source),key,i;for(i=0;i<sourceKeys.length;i++)key=sourceKeys[i],!(excluded.indexOf(key)>=0)&&(target[key]=source[key]);return target}_objectWithoutPropertiesLoose.__bit_component=__bit_component;var layoutProps={},MDXLayout="wrapper";function MDXContent(_ref){var components=_ref.components,props=_objectWithoutProperties(_ref,_excluded);return(0,_react2.mdx)(MDXLayout,_extends({},layoutProps,props,{components,mdxType:"MDXLayout"}),(0,_react2.mdx)(_mdxUi.MDXScopeProvider,{components:{},mdxType:"MDXScopeProvider"},(0,_react2.mdx)("h1",null,"React Overview"),(0,_react2.mdx)("p",null,`React is teambit's Component Development Environment (Env) for React.
 It enables you to quickly set up a dev environment that follows best practices for React component development.`),(0,_react2.mdx)("p",null,"React can also be used as a good starting point for your own customized Env as it provides a comprehensive API that makes it easy to extend."),(0,_react2.mdx)("h2",null,"Using the React env"),(0,_react2.mdx)("p",null,"To use React Env, apply it on the relevant ",(0,_react2.mdx)("a",{parentName:"p",href:"/docs/workspace/variants"},"variants")," (component selections) in your ",(0,_react2.mdx)("a",{parentName:"p",href:"/docs/workspace/workspace-configuration"},"Workspace config"),":"),(0,_react2.mdx)("pre",null,(0,_react2.mdx)("code",{parentName:"pre",className:"language-json",metastring:'title="workspace.jsonc"',title:'"workspace.jsonc"'},`{
   "teambit.workspace/variants": {
     "{ui/**}": {
@@ -8,4 +8,4 @@ It enables you to quickly set up a dev environment that follows best practices f
 }
 `)),(0,_react2.mdx)("h2",null,"Creating Components"),(0,_react2.mdx)("p",null,"React env provides a set of component templates that can be used to speed-up and standardize your component development:"),(0,_react2.mdx)("p",null,"To list all available templates:"),(0,_react2.mdx)("pre",null,(0,_react2.mdx)("code",{parentName:"pre",className:"language-bash"},`bit templates
 `)),(0,_react2.mdx)("ul",null,(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("inlineCode",{parentName:"li"},"react")," a basic React UI component."),(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("inlineCode",{parentName:"li"},"react-context")," a react context component."),(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("inlineCode",{parentName:"li"},"react-hook")," a react hook component."),(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("inlineCode",{parentName:"li"},"mdx-component")," an MDX component."),(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("inlineCode",{parentName:"li"},"react-component-js")," a basic React component in JS."),(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("inlineCode",{parentName:"li"},"react-env")," boilerplate for a customized environment configuration.")),(0,_react2.mdx)("p",null,"Use any of these templates with the ",(0,_react2.mdx)("inlineCode",{parentName:"p"},"bit create")," command:"),(0,_react2.mdx)("pre",null,(0,_react2.mdx)("code",{parentName:"pre",className:"language-bash"},`bit create react ui/my-welcome
-`)),(0,_react2.mdx)("h2",null,"Development services and configurations"),(0,_react2.mdx)("p",null,"The table below lists ",(0,_react2.mdx)("a",{parentName:"p",href:"/dev-services/dev-services-overview"},"dev services")," that are provided by the React env. Each service handles a specific component development operation. Each is implemented by the React env, using a specific set of configurations."),(0,_react2.mdx)("p",null,"To customize and extend the React env, ",(0,_react2.mdx)("a",{parentName:"p",href:"/envs/pre-configured-envs/react/extending-react#using-your-own-react-env-extension"},"create you own React env extension"),". You can replace the Aspects used by the env, or override their configurations (use the links provided in the 'customization' column)."),(0,_react2.mdx)("table",null,(0,_react2.mdx)("thead",{parentName:"table"},(0,_react2.mdx)("tr",{parentName:"thead"},(0,_react2.mdx)("th",{parentName:"tr",align:null},"Service"),(0,_react2.mdx)("th",{parentName:"tr",align:null},"Aspect"),(0,_react2.mdx)("th",{parentName:"tr",align:null},"Default config"),(0,_react2.mdx)("th",{parentName:"tr",align:null},"Customization"))),(0,_react2.mdx)("tbody",{parentName:"table"},(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/docs/dev-services/compiler/compiler-overview"},"Compiler")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/typescript/typescript"},"TypeScript")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/typescript/tsconfig.json"},"tsconfig.json")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/frameworks/react/config-react-tools#typescript"},"TS compilation config")," ",(0,_react2.mdx)("br",null)," \u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/docs/dev-services/compiler/configure-env-with-compiler"},"Replace compiler"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/tester/overview"},"Tester")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/defender/jest"},"Jest")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/jest/jest.config.js"},"jest.config.js")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/frameworks/react/config-react-tools#jest"},"Jest config")," ",(0,_react2.mdx)("br",null)," \u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/dev-services/tester/configure-env-with-tester"},"Replace Tester"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/linter/overview"},"Linting")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/defender/eslint"},"ESLint")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/eslint/eslintrc.ts"},"eslintrc.ts")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/frameworks/react/config-react-tools#eslint"},"ESLint Config")," ",(0,_react2.mdx)("br",null)," \u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/dev-services/linter/configure-env-with-linter"},"Replace Linter"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/formatter/overview"},"Formatter")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/defender/prettier"},"Prettier")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/prettier/prettier.config.js"},"prettier.config.ts")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/frameworks/react/config-react-tools#prettier"},"Prettier config")," ",(0,_react2.mdx)("br",null)," \u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/dev-services/formatter/configure-env-with-formatter"},"Replace Formatter"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},"DevServer"),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/webpack/webpack"},"Webpack")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/webpack/webpack.config.preview.dev.ts"},"webpack.config.preview.dev.ts")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 Webpack config (for bundling in the workspace)")),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/docs/dev-services/preview/overview"},"Preview")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"-"),(0,_react2.mdx)("td",{parentName:"tr",align:null}),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/dev-services/preview/register-custom-preview"},"Add preview"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/docs/packages/packages-overview"},"Package")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"-"),(0,_react2.mdx)("td",{parentName:"tr",align:null},"See the ",(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/typescript/typescript/~code/typescript.main.runtime.ts"},"TypeScript Aspect")," config"),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/packages/managing-package-json#set-configuration-from-an-env"},"Add Env package config")," ",(0,_react2.mdx)("br",null)," \u2022 TypeScript's package config")),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},"Bundler"),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/webpack/webpack"},"Webpack")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/webpack/webpack.config.preview.ts"},"webpack.config.preview.ts")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 Webpack config (for bundling during build)")),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/docs/dev-services/docs/docs-overview"},"Documentation")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"-"),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/docs/index.tsx"},"Docs template")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/docs/dev-services/docs/docs-templates"},"Replace docs template"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"http://localhost:3000/docs/dev-services/builder/builder-overview"},"Builder")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"-"),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"http://localhost:3000/docs/dev-services/builder/builder-overview"},"Build pipeline")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/dev-services/builder/build-pipelines"},"Build pipelines"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/dependencies/dependencies-overview"},"Dependencies")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"-"),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/react.env.ts"},"Env-dependencies")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/dependencies/configuring-dependencies#configuring-dependencies-from-an-env"},"Env dependencies"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/docs/dev-services/generator/generator-overview"},"Generator")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"-"),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/templates/react-component.ts"},"React templates")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:""},"Add a component template"))))),(0,_react2.mdx)("h3",null,"Default React versions"),(0,_react2.mdx)("p",null,"By default, the React env sets the following dependency versions for components using it:"),(0,_react2.mdx)("ul",null,(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("strong",{parentName:"li"},"react")," (peer dependency): ",(0,_react2.mdx)("inlineCode",{parentName:"li"},"^16.8.0 || ^17.0.0")),(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("strong",{parentName:"li"},"react-dom")," (peer dependency): ",(0,_react2.mdx)("inlineCode",{parentName:"li"},"^16.8.0 || ^17.0.0")),(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("strong",{parentName:"li"},"@types/react"),": ",(0,_react2.mdx)("inlineCode",{parentName:"li"},"^17.0.8")),(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("strong",{parentName:"li"},"@types/react-dom"),": ",(0,_react2.mdx)("inlineCode",{parentName:"li"},"^17.0.5")))))}MDXContent.__bit_component=__bit_component,MDXContent.isMDXComponent=!0},35144:(__unused_webpack_module,exports2,__webpack_require__2)=>{"use strict";var __bit_component={id:"teambit.react/react@0.0.734",homepage:"https://bit.dev/teambit/react/react",exported:!0},_interopRequireDefault=__webpack_require__2(88244);Object.defineProperty(exports2,"__esModule",{value:!0}),exports2.Logo=void 0;function _react(){const data=_interopRequireDefault(__webpack_require__2(63804));return _react=function(){return data},data}_react.__bit_component=__bit_component;const Logo=()=>_react().default.createElement("div",{style:{height:"100%",display:"flex",justifyContent:"center"}},_react().default.createElement("img",{style:{width:70},src:"https://static.bit.dev/extensions-icons/react.svg"}));Logo.__bit_component=__bit_component,exports2.Logo=Logo},85057:module2=>{"use strict";module2.exports=MdxJsReact},63804:module2=>{"use strict";module2.exports=React},58459:module2=>{"use strict";module2.exports=TeambitMdxUiMdxScopeContext}},__webpack_module_cache__={};function __webpack_require__(moduleId){var cachedModule=__webpack_module_cache__[moduleId];if(cachedModule!==void 0)return cachedModule.exports;var module2=__webpack_module_cache__[moduleId]={exports:{}};return __webpack_modules__[moduleId](module2,module2.exports,__webpack_require__),module2.exports}__webpack_require__.n=module2=>{var getter=module2&&module2.__esModule?()=>module2.default:()=>module2;return __webpack_require__.d(getter,{a:getter}),getter},__webpack_require__.d=(exports2,definition)=>{for(var key in definition)__webpack_require__.o(definition,key)&&!__webpack_require__.o(exports2,key)&&Object.defineProperty(exports2,key,{enumerable:!0,get:definition[key]})},__webpack_require__.o=(obj,prop)=>Object.prototype.hasOwnProperty.call(obj,prop),__webpack_require__.r=exports2=>{typeof Symbol<"u"&&Symbol.toStringTag&&Object.defineProperty(exports2,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(exports2,"__esModule",{value:!0})};var __webpack_exports__={};return(()=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{compositions:()=>compositions,overview:()=>overview});const compositions=[__webpack_require__(35144)],overview=[__webpack_require__(82422)]})(),__webpack_exports__})()});
+`)),(0,_react2.mdx)("h2",null,"Development services and configurations"),(0,_react2.mdx)("p",null,"The table below lists ",(0,_react2.mdx)("a",{parentName:"p",href:"/dev-services/dev-services-overview"},"dev services")," that are provided by the React env. Each service handles a specific component development operation. Each is implemented by the React env, using a specific set of configurations."),(0,_react2.mdx)("p",null,"To customize and extend the React env, ",(0,_react2.mdx)("a",{parentName:"p",href:"/envs/pre-configured-envs/react/extending-react#using-your-own-react-env-extension"},"create you own React env extension"),". You can replace the Aspects used by the env, or override their configurations (use the links provided in the 'customization' column)."),(0,_react2.mdx)("table",null,(0,_react2.mdx)("thead",{parentName:"table"},(0,_react2.mdx)("tr",{parentName:"thead"},(0,_react2.mdx)("th",{parentName:"tr",align:null},"Service"),(0,_react2.mdx)("th",{parentName:"tr",align:null},"Aspect"),(0,_react2.mdx)("th",{parentName:"tr",align:null},"Default config"),(0,_react2.mdx)("th",{parentName:"tr",align:null},"Customization"))),(0,_react2.mdx)("tbody",{parentName:"table"},(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/docs/dev-services/compiler/compiler-overview"},"Compiler")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/typescript/typescript"},"TypeScript")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/typescript/tsconfig.json"},"tsconfig.json")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/frameworks/react/config-react-tools#typescript"},"TS compilation config")," ",(0,_react2.mdx)("br",null)," \u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/docs/dev-services/compiler/configure-env-with-compiler"},"Replace compiler"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/tester/overview"},"Tester")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/defender/jest"},"Jest")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/jest/jest.config.js"},"jest.config.js")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/frameworks/react/config-react-tools#jest"},"Jest config")," ",(0,_react2.mdx)("br",null)," \u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/dev-services/tester/configure-env-with-tester"},"Replace Tester"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/linter/overview"},"Linting")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/defender/eslint"},"ESLint")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/eslint/eslintrc.ts"},"eslintrc.ts")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/frameworks/react/config-react-tools#eslint"},"ESLint Config")," ",(0,_react2.mdx)("br",null)," \u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/dev-services/linter/configure-env-with-linter"},"Replace Linter"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/formatter/overview"},"Formatter")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/defender/prettier"},"Prettier")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/prettier/prettier.config.js"},"prettier.config.ts")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/frameworks/react/config-react-tools#prettier"},"Prettier config")," ",(0,_react2.mdx)("br",null)," \u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/dev-services/formatter/configure-env-with-formatter"},"Replace Formatter"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},"DevServer"),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/webpack/webpack"},"Webpack")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/webpack/webpack.config.preview.dev.ts"},"webpack.config.preview.dev.ts")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 Webpack config (for bundling in the workspace)")),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/docs/dev-services/preview/overview"},"Preview")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"-"),(0,_react2.mdx)("td",{parentName:"tr",align:null}),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/dev-services/preview/register-custom-preview"},"Add preview"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/docs/packages/packages-overview"},"Package")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"-"),(0,_react2.mdx)("td",{parentName:"tr",align:null},"See the ",(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/typescript/typescript/~code/typescript.main.runtime.ts"},"TypeScript Aspect")," config"),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,_react2.mdx)("a",{parentName:"td",href:"/packages/managing-package-json#set-configuration-from-an-env"},"Add Env package config")," ",(0,_react2.mdx)("br",null)," \u2022 TypeScript's package config")),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},"Bundler"),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/webpack/webpack"},"Webpack")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/webpack/webpack.config.preview.ts"},"webpack.config.preview.ts")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"\u2022 Webpack config (for bundling during build)")),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/docs/dev-services/docs/docs-overview"},"Documentation")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"-"),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/docs/index.tsx"},"Docs template")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/docs/dev-services/docs/docs-templates"},"Replace docs template"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"http://localhost:3000/docs/dev-services/builder/builder-overview"},"Builder")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"-"),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"http://localhost:3000/docs/dev-services/builder/builder-overview"},"Build pipeline")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/dev-services/builder/build-pipelines"},"Build pipelines"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/dependencies/dependencies-overview"},"Dependencies")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"-"),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/react.env.ts"},"Env-dependencies")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/dependencies/configuring-dependencies#configuring-dependencies-from-an-env"},"Env dependencies"))),(0,_react2.mdx)("tr",{parentName:"tbody"},(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"/docs/dev-services/generator/generator-overview"},"Generator")),(0,_react2.mdx)("td",{parentName:"tr",align:null},"-"),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/templates/react-component.ts"},"React templates")),(0,_react2.mdx)("td",{parentName:"tr",align:null},(0,_react2.mdx)("a",{parentName:"td",href:""},"Add a component template"))))),(0,_react2.mdx)("h3",null,"Default React versions"),(0,_react2.mdx)("p",null,"By default, the React env sets the following dependency versions for components using it:"),(0,_react2.mdx)("ul",null,(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("strong",{parentName:"li"},"react")," (peer dependency): ",(0,_react2.mdx)("inlineCode",{parentName:"li"},"^16.8.0 || ^17.0.0")),(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("strong",{parentName:"li"},"react-dom")," (peer dependency): ",(0,_react2.mdx)("inlineCode",{parentName:"li"},"^16.8.0 || ^17.0.0")),(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("strong",{parentName:"li"},"@types/react"),": ",(0,_react2.mdx)("inlineCode",{parentName:"li"},"^17.0.8")),(0,_react2.mdx)("li",{parentName:"ul"},(0,_react2.mdx)("strong",{parentName:"li"},"@types/react-dom"),": ",(0,_react2.mdx)("inlineCode",{parentName:"li"},"^17.0.5")))))}MDXContent.__bit_component=__bit_component,MDXContent.isMDXComponent=!0},63399:(__unused_webpack_module,exports2,__webpack_require__2)=>{"use strict";var __bit_component={id:"teambit.react/react@0.0.737",homepage:"https://bit.dev/teambit/react/react",exported:!0},_interopRequireDefault=__webpack_require__2(88244);Object.defineProperty(exports2,"__esModule",{value:!0}),exports2.Logo=void 0;function _react(){const data=_interopRequireDefault(__webpack_require__2(63804));return _react=function(){return data},data}_react.__bit_component=__bit_component;const Logo=()=>_react().default.createElement("div",{style:{height:"100%",display:"flex",justifyContent:"center"}},_react().default.createElement("img",{style:{width:70},src:"https://static.bit.dev/extensions-icons/react.svg"}));Logo.__bit_component=__bit_component,exports2.Logo=Logo},85057:module2=>{"use strict";module2.exports=MdxJsReact},63804:module2=>{"use strict";module2.exports=React},58459:module2=>{"use strict";module2.exports=TeambitMdxUiMdxScopeContext}},__webpack_module_cache__={};function __webpack_require__(moduleId){var cachedModule=__webpack_module_cache__[moduleId];if(cachedModule!==void 0)return cachedModule.exports;var module2=__webpack_module_cache__[moduleId]={exports:{}};return __webpack_modules__[moduleId](module2,module2.exports,__webpack_require__),module2.exports}__webpack_require__.n=module2=>{var getter=module2&&module2.__esModule?()=>module2.default:()=>module2;return __webpack_require__.d(getter,{a:getter}),getter},__webpack_require__.d=(exports2,definition)=>{for(var key in definition)__webpack_require__.o(definition,key)&&!__webpack_require__.o(exports2,key)&&Object.defineProperty(exports2,key,{enumerable:!0,get:definition[key]})},__webpack_require__.o=(obj,prop)=>Object.prototype.hasOwnProperty.call(obj,prop),__webpack_require__.r=exports2=>{typeof Symbol<"u"&&Symbol.toStringTag&&Object.defineProperty(exports2,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(exports2,"__esModule",{value:!0})};var __webpack_exports__={};return(()=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{compositions:()=>compositions,overview:()=>overview});const compositions=[__webpack_require__(63399)],overview=[__webpack_require__(76658)]})(),__webpack_exports__})()});

package/dist/typescript/tsconfig.build.json

@@ -11,6 +11,7 @@
     "declaration": true,
     "sourceMap": true,
     "skipLibCheck": true,
+    "experimentalDecorators": true,
     "outDir": "dist",
     "moduleResolution": "node",
     "esModuleInterop": true,

package/dist/webpack/transformers.js

@@ -29,6 +29,8 @@ function _resolvePeer() {
 function generateAddAliasesFromPeersTransformer(peers, logger) {
   return (config, context) => {
     const peerAliases = peers.reduce((acc, peerName) => {
+      var _context$target;
+
       // gets the correct module folder of the package.
       // this allows us to resolve internal files, for example:
       // node_modules/react-dom/test-utils
@@ -37,7 +39,7 @@ function generateAddAliasesFromPeersTransformer(peers, logger) {
       // for example, if we used "react-dom": require.resolve("react-dom"),
       // it would try to resolve "react-dom/test-utils" as:
       // node_modules/react-dom/index.js/test-utils
-      acc[peerName] = (0, _resolvePeer().resolvePeerToDirOrFile)(peerName, logger, context.target.hostRootDir);
+      acc[peerName] = (0, _resolvePeer().resolvePeerToDirOrFile)(peerName, logger, (_context$target = context.target) === null || _context$target === void 0 ? void 0 : _context$target.hostRootDir);
       return acc;
     }, {});
     config.addAliases(peerAliases);
@@ -53,7 +55,9 @@ function generateAddAliasesFromPeersTransformer(peers, logger) {
 
 function generateExposePeersTransformer(peers, logger) {
   return (config, context) => {
-    const exposedRules = (0, _getExposedRules().getExposedRules)(peers, logger, context.target.hostRootDir);
+    var _context$target2;
+
+    const exposedRules = (0, _getExposedRules().getExposedRules)(peers, logger, (_context$target2 = context.target) === null || _context$target2 === void 0 ? void 0 : _context$target2.hostRootDir);
     config.addModuleRules(exposedRules);
     return config;
   };

package/dist/webpack/transformers.js.map

@@ -1 +1 @@
-{"version":3,"sources":["transformers.ts"],"names":["generateAddAliasesFromPeersTransformer","peers","logger","config","context","peerAliases","reduce","acc","peerName","target","hostRootDir","addAliases","generateExposePeersTransformer","exposedRules","addModuleRules"],"mappings":";;;;;;;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEO,SAASA,sCAAT,CAAgDC,KAAhD,EAAiEC,MAAjE,EAAiF;AACtF,SAAO,CAACC,MAAD,EAA+BC,OAA/B,KAAgG;AACrG,UAAMC,WAAW,GAAGJ,KAAK,CAACK,MAAN,CAAa,CAACC,GAAD,EAAMC,QAAN,KAAmB;AAClD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACAD,MAAAA,GAAG,CAACC,QAAD,CAAH,GAAgB,2CAAuBA,QAAvB,EAAiCN,MAAjC,EAAyCE,OAAO,CAACK,MAAR,CAAeC,WAAxD,CAAhB;AACA,aAAOH,GAAP;AACD,KAXmB,EAWjB,EAXiB,CAApB;AAYAJ,IAAAA,MAAM,CAACQ,UAAP,CAAkBN,WAAlB;AACA,WAAOF,MAAP;AACD,GAfD;AAgBD;AAED;AACA;AACA;AACA;AACA;;;AACO,SAASS,8BAAT,CAAwCX,KAAxC,EAAyDC,MAAzD,EAAyE;AAC9E,SAAO,CAACC,MAAD,EAA+BC,OAA/B,KAAgG;AACrG,UAAMS,YAAY,GAAG,wCAAgBZ,KAAhB,EAAuBC,MAAvB,EAA+BE,OAAO,CAACK,MAAR,CAAeC,WAA9C,CAArB;AACAP,IAAAA,MAAM,CAACW,cAAP,CAAsBD,YAAtB;AACA,WAAOV,MAAP;AACD,GAJD;AAKD","sourcesContent":["import { WebpackConfigTransformContext } from '@teambit/webpack';\nimport { WebpackConfigMutator } from '@teambit/webpack.modules.config-mutator';\nimport { Logger } from '@teambit/logger';\nimport { getExposedRules } from './get-exposed-rules';\nimport { resolvePeerToDirOrFile } from './resolve-peer';\n\nexport function generateAddAliasesFromPeersTransformer(peers: string[], logger: Logger) {\n  return (config: WebpackConfigMutator, context: WebpackConfigTransformContext): WebpackConfigMutator => {\n    const peerAliases = peers.reduce((acc, peerName) => {\n      // gets the correct module folder of the package.\n      // this allows us to resolve internal files, for example:\n      // node_modules/react-dom/test-utils\n      //\n      // we can't use require.resolve() because it resolves to a specific file.\n      // for example, if we used \"react-dom\": require.resolve(\"react-dom\"),\n      // it would try to resolve \"react-dom/test-utils\" as:\n      // node_modules/react-dom/index.js/test-utils\n      acc[peerName] = resolvePeerToDirOrFile(peerName, logger, context.target.hostRootDir);\n      return acc;\n    }, {});\n    config.addAliases(peerAliases);\n    return config;\n  };\n}\n\n/**\n * Generate a transformer that expose all the peers as global via the expose loader\n * @param peers\n * @returns\n */\nexport function generateExposePeersTransformer(peers: string[], logger: Logger) {\n  return (config: WebpackConfigMutator, context: WebpackConfigTransformContext): WebpackConfigMutator => {\n    const exposedRules = getExposedRules(peers, logger, context.target.hostRootDir);\n    config.addModuleRules(exposedRules);\n    return config;\n  };\n}\n"]}
+{"version":3,"sources":["transformers.ts"],"names":["generateAddAliasesFromPeersTransformer","peers","logger","config","context","peerAliases","reduce","acc","peerName","target","hostRootDir","addAliases","generateExposePeersTransformer","exposedRules","addModuleRules"],"mappings":";;;;;;;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEO,SAASA,sCAAT,CAAgDC,KAAhD,EAAiEC,MAAjE,EAAiF;AACtF,SAAO,CAACC,MAAD,EAA+BC,OAA/B,KAAgG;AACrG,UAAMC,WAAW,GAAGJ,KAAK,CAACK,MAAN,CAAa,CAACC,GAAD,EAAMC,QAAN,KAAmB;AAAA;;AAClD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACAD,MAAAA,GAAG,CAACC,QAAD,CAAH,GAAgB,2CAAuBA,QAAvB,EAAiCN,MAAjC,qBAAyCE,OAAO,CAACK,MAAjD,oDAAyC,gBAAgBC,WAAzD,CAAhB;AACA,aAAOH,GAAP;AACD,KAXmB,EAWjB,EAXiB,CAApB;AAYAJ,IAAAA,MAAM,CAACQ,UAAP,CAAkBN,WAAlB;AACA,WAAOF,MAAP;AACD,GAfD;AAgBD;AAED;AACA;AACA;AACA;AACA;;;AACO,SAASS,8BAAT,CAAwCX,KAAxC,EAAyDC,MAAzD,EAAyE;AAC9E,SAAO,CAACC,MAAD,EAA+BC,OAA/B,KAAgG;AAAA;;AACrG,UAAMS,YAAY,GAAG,wCAAgBZ,KAAhB,EAAuBC,MAAvB,sBAA+BE,OAAO,CAACK,MAAvC,qDAA+B,iBAAgBC,WAA/C,CAArB;AACAP,IAAAA,MAAM,CAACW,cAAP,CAAsBD,YAAtB;AACA,WAAOV,MAAP;AACD,GAJD;AAKD","sourcesContent":["import { WebpackConfigTransformContext } from '@teambit/webpack';\nimport { WebpackConfigMutator } from '@teambit/webpack.modules.config-mutator';\nimport { Logger } from '@teambit/logger';\nimport { getExposedRules } from './get-exposed-rules';\nimport { resolvePeerToDirOrFile } from './resolve-peer';\n\nexport function generateAddAliasesFromPeersTransformer(peers: string[], logger: Logger) {\n  return (config: WebpackConfigMutator, context: WebpackConfigTransformContext): WebpackConfigMutator => {\n    const peerAliases = peers.reduce((acc, peerName) => {\n      // gets the correct module folder of the package.\n      // this allows us to resolve internal files, for example:\n      // node_modules/react-dom/test-utils\n      //\n      // we can't use require.resolve() because it resolves to a specific file.\n      // for example, if we used \"react-dom\": require.resolve(\"react-dom\"),\n      // it would try to resolve \"react-dom/test-utils\" as:\n      // node_modules/react-dom/index.js/test-utils\n      acc[peerName] = resolvePeerToDirOrFile(peerName, logger, context.target?.hostRootDir);\n      return acc;\n    }, {});\n    config.addAliases(peerAliases);\n    return config;\n  };\n}\n\n/**\n * Generate a transformer that expose all the peers as global via the expose loader\n * @param peers\n * @returns\n */\nexport function generateExposePeersTransformer(peers: string[], logger: Logger) {\n  return (config: WebpackConfigMutator, context: WebpackConfigTransformContext): WebpackConfigMutator => {\n    const exposedRules = getExposedRules(peers, logger, context.target?.hostRootDir);\n    config.addModuleRules(exposedRules);\n    return config;\n  };\n}\n"]}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/react",
-  "version": "0.0.734",
+  "version": "0.0.737",
   "homepage": "https://bit.dev/teambit/react/react",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.react",
     "name": "react",
-    "version": "0.0.734"
+    "version": "0.0.737"
   },
   "dependencies": {
     "react-error-boundary": "^3.0.0",
@@ -84,39 +84,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.356",
-    "@teambit/preview": "0.0.734",
+    "@teambit/preview": "0.0.737",
     "@teambit/react.ui.error-fallback": "0.0.111",
     "@teambit/react.ui.loader-fallback": "0.0.89",
     "@teambit/compositions.ui.hooks.use-composition": "0.0.163",
     "@teambit/design.ui.tooltip": "0.0.352",
-    "@teambit/builder": "0.0.734",
-    "@teambit/bundler": "0.0.734",
-    "@teambit/compiler": "0.0.734",
+    "@teambit/builder": "0.0.737",
+    "@teambit/bundler": "0.0.737",
+    "@teambit/compiler": "0.0.737",
     "@teambit/component.modules.component-url": "0.0.124",
-    "@teambit/component": "0.0.734",
-    "@teambit/envs": "0.0.734",
-    "@teambit/eslint": "0.0.734",
-    "@teambit/formatter": "0.0.285",
-    "@teambit/jest": "0.0.734",
-    "@teambit/linter": "0.0.734",
-    "@teambit/logger": "0.0.582",
-    "@teambit/pkg": "0.0.734",
-    "@teambit/prettier": "0.0.285",
+    "@teambit/component": "0.0.737",
+    "@teambit/envs": "0.0.737",
+    "@teambit/eslint": "0.0.737",
+    "@teambit/formatter": "0.0.288",
+    "@teambit/jest": "0.0.737",
+    "@teambit/linter": "0.0.737",
+    "@teambit/logger": "0.0.583",
+    "@teambit/pkg": "0.0.737",
+    "@teambit/prettier": "0.0.288",
     "@teambit/react.ui.highlighter.component-metadata.bit-component-meta": "0.0.21",
-    "@teambit/schema": "0.0.734",
-    "@teambit/tester": "0.0.734",
-    "@teambit/typescript": "0.0.734",
-    "@teambit/webpack": "0.0.734",
-    "@teambit/workspace": "0.0.734",
-    "@teambit/application": "0.0.376",
-    "@teambit/cli": "0.0.490",
-    "@teambit/dependency-resolver": "0.0.734",
-    "@teambit/generator": "0.0.734",
-    "@teambit/graphql": "0.0.734",
+    "@teambit/schema": "0.0.737",
+    "@teambit/tester": "0.0.737",
+    "@teambit/typescript": "0.0.737",
+    "@teambit/webpack": "0.0.737",
+    "@teambit/workspace": "0.0.737",
+    "@teambit/application": "0.0.379",
+    "@teambit/cli": "0.0.491",
+    "@teambit/dependency-resolver": "0.0.737",
+    "@teambit/generator": "0.0.737",
+    "@teambit/graphql": "0.0.737",
     "@teambit/react.ui.highlighter-provider": "0.0.189",
-    "@teambit/compositions": "0.0.734",
-    "@teambit/ui": "0.0.734",
-    "@teambit/react.eslint-config-bit-react": "0.0.564",
+    "@teambit/compositions": "0.0.737",
+    "@teambit/ui": "0.0.737",
+    "@teambit/react.eslint-config-bit-react": "0.0.565",
     "@teambit/webpack.modules.generate-expose-loaders": "0.0.3",
     "@teambit/webpack.modules.generate-externals": "0.0.3",
     "@teambit/webpack.modules.config-mutator": "0.0.138",
@@ -127,7 +127,7 @@
     "@teambit/component-id": "0.0.402",
     "@teambit/toolbox.network.get-port": "0.0.113",
     "@teambit/react.modules.prerenderer-puppeteer": "0.0.2",
-    "@teambit/config": "0.0.503"
+    "@teambit/config": "0.0.504"
   },
   "devDependencies": {
     "@types/react": "^17.0.8",
@@ -147,7 +147,7 @@
     "@teambit/react.content.react-overview": "1.95.0"
   },
   "peerDependencies": {
-    "@teambit/legacy": "1.0.270",
+    "@teambit/legacy": "1.0.271",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },
@@ -211,7 +211,7 @@
         "@types/jest": "^26.0.0"
       },
       "peerDependencies": {
-        "@teambit/legacy": "1.0.270",
+        "@teambit/legacy": "1.0.271",
         "react-dom": "^16.8.0 || ^17.0.0",
         "react": "^16.8.0 || ^17.0.0"
       }

package/{preview-1652785756723.js → preview-1652930732694.js}

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

package/tsconfig.json

@@ -15,13 +15,13 @@
     "declaration": true,
     "sourceMap": true,
     "skipLibCheck": true,
+    "experimentalDecorators": true,
     "outDir": "dist",
     "moduleResolution": "node",
     "esModuleInterop": true,
     "rootDir": ".",
     "resolveJsonModule": true,
     "emitDeclarationOnly": true,
-    "experimentalDecorators": true,
     "emitDecoratorMetadata": true,
     "allowSyntheticDefaultImports": true,
     "strictPropertyInitialization": false,

package/typescript/tsconfig.build.json

@@ -11,6 +11,7 @@
     "declaration": true,
     "sourceMap": true,
     "skipLibCheck": true,
+    "experimentalDecorators": true,
     "outDir": "dist",
     "moduleResolution": "node",
     "esModuleInterop": true,

package/webpack/transformers.ts

@@ -15,7 +15,7 @@ export function generateAddAliasesFromPeersTransformer(peers: string[], logger:
       // for example, if we used "react-dom": require.resolve("react-dom"),
       // it would try to resolve "react-dom/test-utils" as:
       // node_modules/react-dom/index.js/test-utils
-      acc[peerName] = resolvePeerToDirOrFile(peerName, logger, context.target.hostRootDir);
+      acc[peerName] = resolvePeerToDirOrFile(peerName, logger, context.target?.hostRootDir);
       return acc;
     }, {});
     config.addAliases(peerAliases);
@@ -30,7 +30,7 @@ export function generateAddAliasesFromPeersTransformer(peers: string[], logger:
  */
 export function generateExposePeersTransformer(peers: string[], logger: Logger) {
   return (config: WebpackConfigMutator, context: WebpackConfigTransformContext): WebpackConfigMutator => {
-    const exposedRules = getExposedRules(peers, logger, context.target.hostRootDir);
+    const exposedRules = getExposedRules(peers, logger, context.target?.hostRootDir);
     config.addModuleRules(exposedRules);
     return config;
   };