@teambit/react 0.0.691 → 0.0.694

package/artifacts/preview/teambit_react_react-preview.js

@@ -1 +1,11 @@
-!function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t():"function"===typeof define&&define.amd?define([],t):"object"===typeof exports?exports["teambit.react/react-preview"]=t():e["teambit.react/react-preview"]=t()}(self,(function(){return(()=>{var e={88244:e=>{e.exports=function(e){return e&&e.__esModule?e:{default:e}}},56155:(e,t,a)=>{"use strict";a.r(t),a.d(t,{default:()=>l});a(63804);var n=a(85057),r=a(58459),d=a(55906),i=["components"];function m(){return m=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},m.apply(this,arguments)}function o(e,t){if(null==e)return{};var a,n,r=function(e,t){if(null==e)return{};var a,n,r={},d=Object.keys(e);for(n=0;n<d.length;n++)a=d[n],t.indexOf(a)>=0||(r[a]=e[a]);return r}(e,t);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(e);for(n=0;n<d.length;n++)a=d[n],t.indexOf(a)>=0||Object.prototype.propertyIsEnumerable.call(e,a)&&(r[a]=e[a])}return r}var p={};function l(e){var t=e.components,a=o(e,i);return(0,n.mdx)("wrapper",m({},p,a,{components:t,mdxType:"MDXLayout"}),(0,n.mdx)(r.MDXScopeProvider,{components:{ReactOverview:d.ZP},mdxType:"MDXScopeProvider"},(0,n.mdx)(d.ZP,{mdxType:"ReactOverview"})))}l.isMDXComponent=!0},55906:(e,t,a)=>{"use strict";Object.defineProperty(t,"ZP",{enumerable:!0,get:function(){return n.default}});var n=r(a(2664));function r(e){return e&&e.__esModule?e:{default:e}}r.__bit_component={id:"teambit.react/content/react-overview@1.95.0",homepage:"https://bit.dev/teambit/react/content/react-overview",exported:!0}},2664:(e,t,a)=>{"use strict";var n={id:"teambit.react/content/react-overview@1.95.0",homepage:"https://bit.dev/teambit/react/content/react-overview",exported:!0};Object.defineProperty(t,"__esModule",{value:!0}),t.default=s;m(a(63804));var r=a(85057),d=a(58459),i=["components"];function m(e){return e&&e.__esModule?e:{default:e}}function o(){return o=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},o.apply(this,arguments)}function p(e,t){if(null==e)return{};var a,n,r=l(e,t);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(e);for(n=0;n<d.length;n++)a=d[n],t.indexOf(a)>=0||Object.prototype.propertyIsEnumerable.call(e,a)&&(r[a]=e[a])}return r}function l(e,t){if(null==e)return{};var a,n,r={},d=Object.keys(e);for(n=0;n<d.length;n++)a=d[n],t.indexOf(a)>=0||(r[a]=e[a]);return r}m.__bit_component=n,o.__bit_component=n,p.__bit_component=n,l.__bit_component=n;var c={};function s(e){var t=e.components,a=p(e,i);return(0,r.mdx)("wrapper",o({},c,a,{components:t,mdxType:"MDXLayout"}),(0,r.mdx)(d.MDXScopeProvider,{components:{},mdxType:"MDXScopeProvider"},(0,r.mdx)("h1",null,"React Overview"),(0,r.mdx)("p",null,"React is teambit's Component Development Environment (Env) for React.\nIt enables you to quickly set up a dev environment that follows best practices for React component development."),(0,r.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,r.mdx)("h2",null,"Using the React env"),(0,r.mdx)("p",null,"To use React Env, apply it on the relevant ",(0,r.mdx)("a",{parentName:"p",href:"/docs/workspace/variants"},"variants")," (component selections) in your ",(0,r.mdx)("a",{parentName:"p",href:"/docs/workspace/workspace-configuration"},"Workspace config"),":"),(0,r.mdx)("pre",null,(0,r.mdx)("code",{parentName:"pre",className:"language-json",metastring:'title="workspace.jsonc"',title:'"workspace.jsonc"'},'{\n  "teambit.workspace/variants": {\n    "{ui/**}": {\n      "teambit.react/react": {}\n    }\n  }\n}\n')),(0,r.mdx)("h2",null,"Creating Components"),(0,r.mdx)("p",null,"React env provides a set of component templates that can be used to speed-up and standardize your component development:"),(0,r.mdx)("p",null,"To list all available templates:"),(0,r.mdx)("pre",null,(0,r.mdx)("code",{parentName:"pre",className:"language-bash"},"bit templates\n")),(0,r.mdx)("ul",null,(0,r.mdx)("li",{parentName:"ul"},(0,r.mdx)("inlineCode",{parentName:"li"},"react")," a basic React UI component."),(0,r.mdx)("li",{parentName:"ul"},(0,r.mdx)("inlineCode",{parentName:"li"},"react-context")," a react context component."),(0,r.mdx)("li",{parentName:"ul"},(0,r.mdx)("inlineCode",{parentName:"li"},"react-hook")," a react hook component."),(0,r.mdx)("li",{parentName:"ul"},(0,r.mdx)("inlineCode",{parentName:"li"},"mdx-component")," an MDX component."),(0,r.mdx)("li",{parentName:"ul"},(0,r.mdx)("inlineCode",{parentName:"li"},"react-component-js")," a basic React component in JS."),(0,r.mdx)("li",{parentName:"ul"},(0,r.mdx)("inlineCode",{parentName:"li"},"react-env")," boilerplate for a customized environment configuration.")),(0,r.mdx)("p",null,"Use any of these templates with the ",(0,r.mdx)("inlineCode",{parentName:"p"},"bit create")," command:"),(0,r.mdx)("pre",null,(0,r.mdx)("code",{parentName:"pre",className:"language-bash"},"bit create react ui/my-welcome\n")),(0,r.mdx)("h2",null,"Development services and configurations"),(0,r.mdx)("p",null,"The table below lists ",(0,r.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,r.mdx)("p",null,"To customize and extend the React env, ",(0,r.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,r.mdx)("table",null,(0,r.mdx)("thead",{parentName:"table"},(0,r.mdx)("tr",{parentName:"thead"},(0,r.mdx)("th",{parentName:"tr",align:null},"Service"),(0,r.mdx)("th",{parentName:"tr",align:null},"Aspect"),(0,r.mdx)("th",{parentName:"tr",align:null},"Default config"),(0,r.mdx)("th",{parentName:"tr",align:null},"Customization"))),(0,r.mdx)("tbody",{parentName:"table"},(0,r.mdx)("tr",{parentName:"tbody"},(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"/docs/dev-services/compiler/compiler-overview"},"Compiler")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/typescript/typescript"},"TypeScript")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/typescript/tsconfig.json"},"tsconfig.json")),(0,r.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,r.mdx)("a",{parentName:"td",href:"/frameworks/react/config-react-tools#typescript"},"TS compilation config")," ",(0,r.mdx)("br",null)," \u2022 ",(0,r.mdx)("a",{parentName:"td",href:"/docs/dev-services/compiler/configure-env-with-compiler"},"Replace compiler"))),(0,r.mdx)("tr",{parentName:"tbody"},(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"/tester/overview"},"Tester")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/defender/jest"},"Jest")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/jest/jest.config.js"},"jest.config.js")),(0,r.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,r.mdx)("a",{parentName:"td",href:"/frameworks/react/config-react-tools#jest"},"Jest config")," ",(0,r.mdx)("br",null)," \u2022 ",(0,r.mdx)("a",{parentName:"td",href:"/dev-services/tester/configure-env-with-tester"},"Replace Tester"))),(0,r.mdx)("tr",{parentName:"tbody"},(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"/linter/overview"},"Linting")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/defender/eslint"},"ESLint")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/eslint/eslintrc.ts"},"eslintrc.ts")),(0,r.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,r.mdx)("a",{parentName:"td",href:"/frameworks/react/config-react-tools#eslint"},"ESLint Config")," ",(0,r.mdx)("br",null)," \u2022 ",(0,r.mdx)("a",{parentName:"td",href:"/dev-services/linter/configure-env-with-linter"},"Replace Linter"))),(0,r.mdx)("tr",{parentName:"tbody"},(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"/formatter/overview"},"Formatter")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/defender/prettier"},"Prettier")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/prettier/prettier.config.js"},"prettier.config.ts")),(0,r.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,r.mdx)("a",{parentName:"td",href:"/frameworks/react/config-react-tools#prettier"},"Prettier config")," ",(0,r.mdx)("br",null)," \u2022 ",(0,r.mdx)("a",{parentName:"td",href:"/dev-services/formatter/configure-env-with-formatter"},"Replace Formatter"))),(0,r.mdx)("tr",{parentName:"tbody"},(0,r.mdx)("td",{parentName:"tr",align:null},"DevServer"),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/webpack/webpack"},"Webpack")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/webpack/webpack.config.preview.dev.ts"},"webpack.config.preview.dev.ts")),(0,r.mdx)("td",{parentName:"tr",align:null},"\u2022 Webpack config (for bundling in the workspace)")),(0,r.mdx)("tr",{parentName:"tbody"},(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"/docs/dev-services/preview/overview"},"Preview")),(0,r.mdx)("td",{parentName:"tr",align:null},"-"),(0,r.mdx)("td",{parentName:"tr",align:null}),(0,r.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,r.mdx)("a",{parentName:"td",href:"/dev-services/preview/register-custom-preview"},"Add preview"))),(0,r.mdx)("tr",{parentName:"tbody"},(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"/docs/packages/packages-overview"},"Package")),(0,r.mdx)("td",{parentName:"tr",align:null},"-"),(0,r.mdx)("td",{parentName:"tr",align:null},"See the ",(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/typescript/typescript/~code/typescript.main.runtime.ts"},"TypeScript Aspect")," config"),(0,r.mdx)("td",{parentName:"tr",align:null},"\u2022 ",(0,r.mdx)("a",{parentName:"td",href:"/packages/managing-package-json#set-configuration-from-an-env"},"Add Env package config")," ",(0,r.mdx)("br",null)," \u2022 TypeScript's package config")),(0,r.mdx)("tr",{parentName:"tbody"},(0,r.mdx)("td",{parentName:"tr",align:null},"Bundler"),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/webpack/webpack"},"Webpack")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/webpack/webpack.config.preview.ts"},"webpack.config.preview.ts")),(0,r.mdx)("td",{parentName:"tr",align:null},"\u2022 Webpack config (for bundling during build)")),(0,r.mdx)("tr",{parentName:"tbody"},(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"/docs/dev-services/docs/docs-overview"},"Documentation")),(0,r.mdx)("td",{parentName:"tr",align:null},"-"),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/docs/index.tsx"},"Docs template")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"/docs/dev-services/docs/docs-templates"},"Replace docs template"))),(0,r.mdx)("tr",{parentName:"tbody"},(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"http://localhost:3000/docs/dev-services/builder/builder-overview"},"Builder")),(0,r.mdx)("td",{parentName:"tr",align:null},"-"),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"http://localhost:3000/docs/dev-services/builder/builder-overview"},"Build pipeline")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"/dev-services/builder/build-pipelines"},"Build pipelines"))),(0,r.mdx)("tr",{parentName:"tbody"},(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"/dependencies/dependencies-overview"},"Dependencies")),(0,r.mdx)("td",{parentName:"tr",align:null},"-"),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/react.env.ts"},"Env-dependencies")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"/dependencies/configuring-dependencies#configuring-dependencies-from-an-env"},"Env dependencies"))),(0,r.mdx)("tr",{parentName:"tbody"},(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"/docs/dev-services/generator/generator-overview"},"Generator")),(0,r.mdx)("td",{parentName:"tr",align:null},"-"),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:"https://bit.dev/teambit/react/react/~code/templates/react-component.ts"},"React templates")),(0,r.mdx)("td",{parentName:"tr",align:null},(0,r.mdx)("a",{parentName:"td",href:""},"Add a component template"))))),(0,r.mdx)("h3",null,"Default React versions"),(0,r.mdx)("p",null,"By default, the React env sets the following dependency versions for components using it:"),(0,r.mdx)("ul",null,(0,r.mdx)("li",{parentName:"ul"},(0,r.mdx)("strong",{parentName:"li"},"react")," (peer dependency): ",(0,r.mdx)("inlineCode",{parentName:"li"},"^16.8.0 || ^17.0.0")),(0,r.mdx)("li",{parentName:"ul"},(0,r.mdx)("strong",{parentName:"li"},"react-dom")," (peer dependency): ",(0,r.mdx)("inlineCode",{parentName:"li"},"^16.8.0 || ^17.0.0")),(0,r.mdx)("li",{parentName:"ul"},(0,r.mdx)("strong",{parentName:"li"},"@types/react"),": ",(0,r.mdx)("inlineCode",{parentName:"li"},"^17.0.8")),(0,r.mdx)("li",{parentName:"ul"},(0,r.mdx)("strong",{parentName:"li"},"@types/react-dom"),": ",(0,r.mdx)("inlineCode",{parentName:"li"},"^17.0.5")))))}s.__bit_component=n,s.isMDXComponent=!0},90955:(e,t,a)=>{"use strict";var n={id:"teambit.react/react@0.0.691",homepage:"https://bit.dev/teambit/react/react",exported:!0},r=a(88244);function d(){const e=r(a(63804));return d=function(){return e},e}Object.defineProperty(t,"__esModule",{value:!0}),t.Logo=void 0,d.__bit_component=n;const i=()=>d().default.createElement("div",{style:{height:"100%",display:"flex",justifyContent:"center"}},d().default.createElement("img",{style:{width:70},src:"https://static.bit.dev/extensions-icons/react.svg"}));i.__bit_component=n,t.Logo=i},85057:e=>{"use strict";e.exports=MdxJsReact},63804:e=>{"use strict";e.exports=React},58459:e=>{"use strict";e.exports=TeambitMdxUiMdxScopeContext}},t={};function a(n){var r=t[n];if(void 0!==r)return r.exports;var d=t[n]={exports:{}};return e[n](d,d.exports,a),d.exports}a.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return a.d(t,{a:t}),t},a.d=(e,t)=>{for(var n in t)a.o(t,n)&&!a.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},a.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),a.r=e=>{"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};return(()=>{"use strict";a.r(n),a.d(n,{compositions:()=>e,overview:()=>t});const e=[a(90955)],t=[a(56155)]})(),n})()}));
+(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},52290:(__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/**}": {
+      "teambit.react/react": {}
+    }
+  }
+}
+`)),(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},19888:(__unused_webpack_module,exports2,__webpack_require__2)=>{"use strict";var __bit_component={id:"teambit.react/react@0.0.694",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__(19888)],overview=[__webpack_require__(52290)]})(),__webpack_exports__})()});

package/dist/apps/web/react.application.js

@@ -41,6 +41,26 @@ function _toolboxNetwork() {
   return data;
 }
 
+function _lodash() {
+  const data = require("lodash");
+
+  _lodash = function () {
+    return data;
+  };
+
+  return data;
+}
+
+function _terserWebpackPlugin() {
+  const data = _interopRequireDefault(require("terser-webpack-plugin"));
+
+  _terserWebpackPlugin = function () {
+    return data;
+  };
+
+  return data;
+}
+
 function _plugins() {
   const data = require("./plugins");
 
@@ -154,11 +174,30 @@ class ReactApp {
     });
 
     const defaultTransformer = configMutator => {
+      var _config$raw$optimizat;
+
       const config = configMutator.addTopLevel('output', {
         path: staticDir,
         publicPath: `/`
       });
       if (this.prerenderRoutes) config.addPlugin((0, _plugins().prerenderSPAPlugin)(this.prerenderRoutes, staticDir));
+
+      if ((_config$raw$optimizat = config.raw.optimization) !== null && _config$raw$optimizat !== void 0 && _config$raw$optimizat.minimizer) {
+        var _config$raw$optimizat2, _config$raw$optimizat3;
+
+        (0, _lodash().remove)((_config$raw$optimizat2 = config.raw.optimization) === null || _config$raw$optimizat2 === void 0 ? void 0 : _config$raw$optimizat2.minimizer, minimizer => {
+          return minimizer.constructor.name === 'TerserPlugin';
+        });
+        (_config$raw$optimizat3 = config.raw.optimization) === null || _config$raw$optimizat3 === void 0 ? void 0 : _config$raw$optimizat3.minimizer.push(new (_terserWebpackPlugin().default)({
+          minify: _terserWebpackPlugin().default.esbuildMinify,
+          // `terserOptions` options will be passed to `esbuild`
+          // Link to options - https://esbuild.github.io/api/#minify
+          terserOptions: {
+            minify: true
+          }
+        }));
+      }
+
       return config;
     };
 

package/dist/apps/web/react.application.js.map

@@ -1 +1 @@
-{"version":3,"sources":["react.application.ts"],"names":["ReactApp","constructor","name","entry","portRange","reactEnv","prerenderRoutes","bundler","devServer","transformers","deploy","favicon","run","context","from","to","port","Port","getPort","listen","devServerContext","getDevServerContext","getDevServer","configMutator","addTopLevel","historyApiFallback","index","disableDotRule","raw","output","publicPath","build","htmlConfig","title","templateContent","minify","Object","assign","html","getBundler","publicDir","getPublicDir","dir","getDefaultBundler","capsule","env","outputPath","path","distDir","getCompiler","entries","map","require","resolve","staticDir","bundlerContext","targets","components","component","rootPath","metaData","initiator","envId","id","defaultTransformer","config","addPlugin","applicationType"],"mappings":"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","sourcesContent":["import { join, basename } from 'path';\nimport { Application, AppContext, AppBuildContext } from '@teambit/application';\nimport { Bundler, DevServer, BundlerContext, DevServerContext, BundlerHtmlConfig } from '@teambit/bundler';\nimport { Port } from '@teambit/toolbox.network.get-port';\nimport { WebpackConfigTransformer } from '@teambit/webpack';\nimport { ReactEnv } from '../../react.env';\nimport { prerenderSPAPlugin } from './plugins';\nimport { ReactAppBuildResult } from './react-build-result';\nimport { html } from '../../webpack';\nimport { ReactDeployContext } from '.';\n\nexport class ReactApp implements Application {\n  constructor(\n    readonly name: string,\n    readonly entry: string[],\n    readonly portRange: number[],\n    private reactEnv: ReactEnv,\n    readonly prerenderRoutes?: string[],\n    readonly bundler?: Bundler,\n    readonly devServer?: DevServer,\n    readonly transformers?: WebpackConfigTransformer[],\n    readonly deploy?: (context: ReactDeployContext) => Promise<void>,\n    readonly favicon?: string\n  ) {}\n  readonly applicationType = 'react-common-js';\n  readonly dir = 'public';\n  async run(context: AppContext): Promise<number> {\n    const [from, to] = this.portRange;\n    const port = await Port.getPort(from, to);\n    if (this.devServer) {\n      await this.devServer.listen(port);\n      return port;\n    }\n    const devServerContext = this.getDevServerContext(context);\n    const devServer = this.reactEnv.getDevServer(devServerContext, [\n      (configMutator) => {\n        configMutator.addTopLevel('devServer', {\n          historyApiFallback: {\n            index: '/index.html',\n            disableDotRule: true,\n          },\n        });\n\n        if (!configMutator.raw.output) configMutator.raw.output = {};\n        configMutator.raw.output.publicPath = '/';\n\n        return configMutator;\n      },\n    ]);\n    await devServer.listen(port);\n    return port;\n  }\n\n  async build(context: AppBuildContext): Promise<ReactAppBuildResult> {\n    const htmlConfig: BundlerHtmlConfig[] = [\n      {\n        title: context.name,\n        templateContent: html(context.name),\n        minify: false,\n        favicon: this.favicon,\n        // filename: ''.html`,\n      },\n    ];\n    Object.assign(context, {\n      html: htmlConfig,\n    });\n    const bundler = await this.getBundler(context);\n    await bundler.run();\n    return { publicDir: `${this.getPublicDir()}/${this.dir}` };\n  }\n\n  private getBundler(context: AppBuildContext) {\n    if (this.bundler) return this.bundler;\n    return this.getDefaultBundler(context);\n  }\n  private async getDefaultBundler(context: AppBuildContext) {\n    const { capsule } = context;\n    const reactEnv: ReactEnv = context.env;\n    const publicDir = this.getPublicDir();\n    const outputPath = join(capsule.path, publicDir);\n    const { distDir } = reactEnv.getCompiler();\n    const entries = this.entry.map((entry) => require.resolve(`${capsule.path}/${distDir}/${basename(entry)}`));\n    const staticDir = join(outputPath, this.dir);\n\n    const bundlerContext: BundlerContext = Object.assign(context, {\n      targets: [\n        {\n          components: [capsule?.component],\n          entries,\n          outputPath,\n        },\n      ],\n      entry: [],\n      rootPath: '/',\n      metaData: {\n        initiator: `building app: ${context.name}`,\n        envId: context.id,\n      },\n    });\n\n    const defaultTransformer: WebpackConfigTransformer = (configMutator) => {\n      const config = configMutator.addTopLevel('output', { path: staticDir, publicPath: `/` });\n      if (this.prerenderRoutes) config.addPlugin(prerenderSPAPlugin(this.prerenderRoutes, staticDir));\n      return config;\n    };\n    const transformers = [defaultTransformer, ...(this.transformers ?? [])];\n    const bundler: Bundler = await reactEnv.getBundler(bundlerContext, transformers);\n    return bundler;\n  }\n\n  private getPublicDir() {\n    return join(this.applicationType, this.name);\n  }\n\n  private getDevServerContext(context: AppContext): DevServerContext {\n    return Object.assign(context, {\n      entry: this.entry,\n      rootPath: '',\n      publicPath: `public/${this.name}`,\n      title: this.name,\n      favicon: this.favicon,\n    });\n  }\n}\n"]}
+{"version":3,"sources":["react.application.ts"],"names":["ReactApp","constructor","name","entry","portRange","reactEnv","prerenderRoutes","bundler","devServer","transformers","deploy","favicon","run","context","from","to","port","Port","getPort","listen","devServerContext","getDevServerContext","getDevServer","configMutator","addTopLevel","historyApiFallback","index","disableDotRule","raw","output","publicPath","build","htmlConfig","title","templateContent","minify","Object","assign","html","getBundler","publicDir","getPublicDir","dir","getDefaultBundler","capsule","env","outputPath","path","distDir","getCompiler","entries","map","require","resolve","staticDir","bundlerContext","targets","components","component","rootPath","metaData","initiator","envId","id","defaultTransformer","config","addPlugin","optimization","minimizer","push","TerserPlugin","esbuildMinify","terserOptions","applicationType"],"mappings":"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","sourcesContent":["import { join, basename } from 'path';\nimport { Application, AppContext, AppBuildContext } from '@teambit/application';\nimport { Bundler, DevServer, BundlerContext, DevServerContext, BundlerHtmlConfig } from '@teambit/bundler';\nimport { Port } from '@teambit/toolbox.network.get-port';\nimport { remove } from 'lodash';\nimport TerserPlugin from 'terser-webpack-plugin';\nimport { WebpackConfigTransformer } from '@teambit/webpack';\nimport { ReactEnv } from '../../react.env';\nimport { prerenderSPAPlugin } from './plugins';\nimport { ReactAppBuildResult } from './react-build-result';\nimport { html } from '../../webpack';\nimport { ReactDeployContext } from '.';\n\nexport class ReactApp implements Application {\n  constructor(\n    readonly name: string,\n    readonly entry: string[],\n    readonly portRange: number[],\n    private reactEnv: ReactEnv,\n    readonly prerenderRoutes?: string[],\n    readonly bundler?: Bundler,\n    readonly devServer?: DevServer,\n    readonly transformers?: WebpackConfigTransformer[],\n    readonly deploy?: (context: ReactDeployContext) => Promise<void>,\n    readonly favicon?: string\n  ) {}\n  readonly applicationType = 'react-common-js';\n  readonly dir = 'public';\n  async run(context: AppContext): Promise<number> {\n    const [from, to] = this.portRange;\n    const port = await Port.getPort(from, to);\n    if (this.devServer) {\n      await this.devServer.listen(port);\n      return port;\n    }\n    const devServerContext = this.getDevServerContext(context);\n    const devServer = this.reactEnv.getDevServer(devServerContext, [\n      (configMutator) => {\n        configMutator.addTopLevel('devServer', {\n          historyApiFallback: {\n            index: '/index.html',\n            disableDotRule: true,\n          },\n        });\n\n        if (!configMutator.raw.output) configMutator.raw.output = {};\n        configMutator.raw.output.publicPath = '/';\n\n        return configMutator;\n      },\n    ]);\n    await devServer.listen(port);\n    return port;\n  }\n\n  async build(context: AppBuildContext): Promise<ReactAppBuildResult> {\n    const htmlConfig: BundlerHtmlConfig[] = [\n      {\n        title: context.name,\n        templateContent: html(context.name),\n        minify: false,\n        favicon: this.favicon,\n        // filename: ''.html`,\n      },\n    ];\n    Object.assign(context, {\n      html: htmlConfig,\n    });\n    const bundler = await this.getBundler(context);\n    await bundler.run();\n    return { publicDir: `${this.getPublicDir()}/${this.dir}` };\n  }\n\n  private getBundler(context: AppBuildContext) {\n    if (this.bundler) return this.bundler;\n    return this.getDefaultBundler(context);\n  }\n  private async getDefaultBundler(context: AppBuildContext) {\n    const { capsule } = context;\n    const reactEnv: ReactEnv = context.env;\n    const publicDir = this.getPublicDir();\n    const outputPath = join(capsule.path, publicDir);\n    const { distDir } = reactEnv.getCompiler();\n    const entries = this.entry.map((entry) => require.resolve(`${capsule.path}/${distDir}/${basename(entry)}`));\n    const staticDir = join(outputPath, this.dir);\n\n    const bundlerContext: BundlerContext = Object.assign(context, {\n      targets: [\n        {\n          components: [capsule?.component],\n          entries,\n          outputPath,\n        },\n      ],\n      entry: [],\n      rootPath: '/',\n      metaData: {\n        initiator: `building app: ${context.name}`,\n        envId: context.id,\n      },\n    });\n\n    const defaultTransformer: WebpackConfigTransformer = (configMutator) => {\n      const config = configMutator.addTopLevel('output', { path: staticDir, publicPath: `/` });\n      if (this.prerenderRoutes) config.addPlugin(prerenderSPAPlugin(this.prerenderRoutes, staticDir));\n      if (config.raw.optimization?.minimizer) {\n        remove(config.raw.optimization?.minimizer, (minimizer) => {\n          return minimizer.constructor.name === 'TerserPlugin';\n        });\n        config.raw.optimization?.minimizer.push(\n          new TerserPlugin({\n            minify: TerserPlugin.esbuildMinify,\n            // `terserOptions` options will be passed to `esbuild`\n            // Link to options - https://esbuild.github.io/api/#minify\n            terserOptions: {\n              minify: true,\n            },\n          })\n        );\n      }\n      return config;\n    };\n    const transformers = [defaultTransformer, ...(this.transformers ?? [])];\n    const bundler: Bundler = await reactEnv.getBundler(bundlerContext, transformers);\n    return bundler;\n  }\n\n  private getPublicDir() {\n    return join(this.applicationType, this.name);\n  }\n\n  private getDevServerContext(context: AppContext): DevServerContext {\n    return Object.assign(context, {\n      entry: this.entry,\n      rootPath: '',\n      publicPath: `public/${this.name}`,\n      title: this.name,\n      favicon: this.favicon,\n    });\n  }\n}\n"]}

package/dist/webpack/webpack.config.base.prod.js

@@ -73,44 +73,59 @@ function _default(externalizePeer, peers, dev) {
   };
   const optimization = dev ? undefined : {
     minimize: true,
-    minimizer: [// This is only used in production mode
-    new (_terserWebpackPlugin().default)({
-      extractComments: false,
+    minimizer: [new (_terserWebpackPlugin().default)({
+      minify: _terserWebpackPlugin().default.esbuildMinify,
+      // `terserOptions` options will be passed to `esbuild`
+      // Link to options - https://esbuild.github.io/api/#minify
+      // Note: the `minify` options is true by default (and override other `minify*` options), so if you want to disable the `minifyIdentifiers` option (or other `minify*` options) please use:
       terserOptions: {
-        parse: {
-          // We want terser to parse ecma 8 code. However, we don't want it
-          // to apply any minification steps that turns valid ecma 5 code
-          // into invalid ecma 5 code. This is why the 'compress' and 'output'
-          // sections only apply transformations that are ecma 5 safe
-          // https://github.com/facebook/create-react-app/pull/4234
-          ecma: 8
-        },
-        compress: {
-          ecma: 5,
-          warnings: false,
-          // Disabled because of an issue with Uglify breaking seemingly valid code:
-          // https://github.com/facebook/create-react-app/issues/2376
-          // Pending further investigation:
-          // https://github.com/mishoo/UglifyJS2/issues/2011
-          comparisons: false,
-          // Disabled because of an issue with Terser breaking valid code:
-          // https://github.com/facebook/create-react-app/issues/5250
-          // Pending further investigation:
-          // https://github.com/terser-js/terser/issues/120
-          inline: 2
-        },
-        mangle: {
-          safari10: true
-        },
-        output: {
-          ecma: 5,
-          comments: false,
-          // Turned on because emoji and regex is not minified properly using default
-          // https://github.com/facebook/create-react-app/issues/2488
-          ascii_only: true
-        }
-      }
-    }), new (_cssMinimizerWebpackPlugin().default)({
+        minify: false,
+        minifyWhitespace: true,
+        // We don't want to minify identifiers to enable easier debugging on remote scopes when there are preview issues
+        minifyIdentifiers: false,
+        // minifyIdentifiers: true,
+        minifySyntax: true
+      } // terserOptions: {},
+
+    }), // This is only used in production mode
+    // new TerserPlugin({
+    //   extractComments: false,
+    //   terserOptions: {
+    //     parse: {
+    //       // We want terser to parse ecma 8 code. However, we don't want it
+    //       // to apply any minification steps that turns valid ecma 5 code
+    //       // into invalid ecma 5 code. This is why the 'compress' and 'output'
+    //       // sections only apply transformations that are ecma 5 safe
+    //       // https://github.com/facebook/create-react-app/pull/4234
+    //       ecma: 8,
+    //     },
+    //     compress: {
+    //       ecma: 5,
+    //       warnings: false,
+    //       // Disabled because of an issue with Uglify breaking seemingly valid code:
+    //       // https://github.com/facebook/create-react-app/issues/2376
+    //       // Pending further investigation:
+    //       // https://github.com/mishoo/UglifyJS2/issues/2011
+    //       comparisons: false,
+    //       // Disabled because of an issue with Terser breaking valid code:
+    //       // https://github.com/facebook/create-react-app/issues/5250
+    //       // Pending further investigation:
+    //       // https://github.com/terser-js/terser/issues/120
+    //       inline: 2,
+    //     },
+    //     mangle: {
+    //       safari10: true,
+    //     },
+    //     output: {
+    //       ecma: 5,
+    //       comments: false,
+    //       // Turned on because emoji and regex is not minified properly using default
+    //       // https://github.com/facebook/create-react-app/issues/2488
+    //       ascii_only: true,
+    //     },
+    //   },
+    // }),
+    new (_cssMinimizerWebpackPlugin().default)({
       minimizerOptions: {
         preset: ['default', {
           minifyFontValues: {

package/dist/webpack/webpack.config.base.prod.js.map

@@ -1 +1 @@
-{"version":3,"sources":["webpack.config.base.prod.ts"],"names":["externalizePeer","peers","dev","externals","undefined","exposedRules","module","rules","optimization","minimize","minimizer","TerserPlugin","extractComments","terserOptions","parse","ecma","compress","warnings","comparisons","inline","mangle","safari10","output","comments","ascii_only","CssMinimizerPlugin","minimizerOptions","preset","minifyFontValues","removeQuotes","plugins","WorkboxWebpackPlugin","GenerateSW","clientsClaim","exclude","navigateFallback","navigateFallbackDenylist","RegExp","filter","Boolean","performance"],"mappings":";;;;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAEA;AACA;AACA;AACe,kBAAUA,eAAV,EAAoCC,KAApC,EAAqDC,GAArD,EAAmF;AAChG,QAAMC,SAAS,GAAGH,eAAe,GAAI,kCAAaC,KAAb,CAAJ,GAAkCG,SAAnE;AACA,QAAMC,YAAY,GAAGL,eAAe,GAAGI,SAAH,GAAe,wCAAgBH,KAAhB,CAAnD;AAEA,QAAMK,MAAM,GAAGN,eAAe,GAC1BI,SAD0B,GAE1B;AACEG,IAAAA,KAAK,EAAEF;AADT,GAFJ;AAMA,QAAMG,YAAY,GAAGN,GAAG,GACpBE,SADoB,GAEpB;AACEK,IAAAA,QAAQ,EAAE,IADZ;AAEEC,IAAAA,SAAS,EAAE,CACT;AACA,SAAIC,8BAAJ,EAAiB;AACfC,MAAAA,eAAe,EAAE,KADF;AAEfC,MAAAA,aAAa,EAAE;AACbC,QAAAA,KAAK,EAAE;AACL;AACA;AACA;AACA;AACA;AACAC,UAAAA,IAAI,EAAE;AAND,SADM;AASbC,QAAAA,QAAQ,EAAE;AACRD,UAAAA,IAAI,EAAE,CADE;AAERE,UAAAA,QAAQ,EAAE,KAFF;AAGR;AACA;AACA;AACA;AACAC,UAAAA,WAAW,EAAE,KAPL;AAQR;AACA;AACA;AACA;AACAC,UAAAA,MAAM,EAAE;AAZA,SATG;AAuBbC,QAAAA,MAAM,EAAE;AACNC,UAAAA,QAAQ,EAAE;AADJ,SAvBK;AA0BbC,QAAAA,MAAM,EAAE;AACNP,UAAAA,IAAI,EAAE,CADA;AAENQ,UAAAA,QAAQ,EAAE,KAFJ;AAGN;AACA;AACAC,UAAAA,UAAU,EAAE;AALN;AA1BK;AAFA,KAAjB,CAFS,EAuCT,KAAIC,oCAAJ,EAAuB;AACrBC,MAAAA,gBAAgB,EAAE;AAChBC,QAAAA,MAAM,EAAE,CACN,SADM,EAEN;AACEC,UAAAA,gBAAgB,EAAE;AAAEC,YAAAA,YAAY,EAAE;AAAhB;AADpB,SAFM;AADQ;AADG,KAAvB,CAvCS,CAFb,CAoDE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAhEF,GAFJ;AAqEA,SAAO;AACLvB,IAAAA,MADK;AAELH,IAAAA,SAFK;AAGLK,IAAAA,YAHK;AAKLsB,IAAAA,OAAO,EAAE,CACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAIC,gCAAqBC,UAAzB,EAAoC;AAClCC,MAAAA,YAAY,EAAE,IADoB;AAElCC,MAAAA,OAAO,EAAE,CAAC,QAAD,EAAW,uBAAX,CAFyB;AAGlC;AACAC,MAAAA,gBAAgB,EAAE,mBAJgB;AAKlCC,MAAAA,wBAAwB,EAAE,CACxB;AACA,UAAIC,MAAJ,CAAW,KAAX,CAFwB,EAGxB;AACA;AACA;AACA;AACA,UAAIA,MAAJ,CAAW,kBAAX,CAPwB;AALQ,KAApC,CAzBO,EAwCPC,MAxCO,CAwCAC,OAxCA,CALJ;AA8CL;AACA;AACAC,IAAAA,WAAW,EAAE;AAhDR,GAAP;AAkDD","sourcesContent":["import WorkboxWebpackPlugin from 'workbox-webpack-plugin';\nimport CssMinimizerPlugin from 'css-minimizer-webpack-plugin';\nimport TerserPlugin from 'terser-webpack-plugin';\nimport { Configuration } from 'webpack';\nimport { getExternals } from './get-externals';\nimport { getExposedRules } from './get-exposed-rules';\n// import { WebpackManifestPlugin } from 'webpack-manifest-plugin';\n\n// This is the production and development configuration.\n// It is focused on developer experience, fast rebuilds, and a minimal bundle.\n// eslint-disable-next-line complexity\nexport default function (externalizePeer: boolean, peers: string[], dev?: boolean): Configuration {\n  const externals = externalizePeer ? (getExternals(peers) as any) : undefined;\n  const exposedRules = externalizePeer ? undefined : getExposedRules(peers);\n\n  const module = externalizePeer\n    ? undefined\n    : {\n        rules: exposedRules,\n      };\n\n  const optimization = dev\n    ? undefined\n    : {\n        minimize: true,\n        minimizer: [\n          // This is only used in production mode\n          new TerserPlugin({\n            extractComments: false,\n            terserOptions: {\n              parse: {\n                // We want terser to parse ecma 8 code. However, we don't want it\n                // to apply any minification steps that turns valid ecma 5 code\n                // into invalid ecma 5 code. This is why the 'compress' and 'output'\n                // sections only apply transformations that are ecma 5 safe\n                // https://github.com/facebook/create-react-app/pull/4234\n                ecma: 8,\n              },\n              compress: {\n                ecma: 5,\n                warnings: false,\n                // Disabled because of an issue with Uglify breaking seemingly valid code:\n                // https://github.com/facebook/create-react-app/issues/2376\n                // Pending further investigation:\n                // https://github.com/mishoo/UglifyJS2/issues/2011\n                comparisons: false,\n                // Disabled because of an issue with Terser breaking valid code:\n                // https://github.com/facebook/create-react-app/issues/5250\n                // Pending further investigation:\n                // https://github.com/terser-js/terser/issues/120\n                inline: 2,\n              },\n              mangle: {\n                safari10: true,\n              },\n              output: {\n                ecma: 5,\n                comments: false,\n                // Turned on because emoji and regex is not minified properly using default\n                // https://github.com/facebook/create-react-app/issues/2488\n                ascii_only: true,\n              },\n            },\n          }),\n          new CssMinimizerPlugin({\n            minimizerOptions: {\n              preset: [\n                'default',\n                {\n                  minifyFontValues: { removeQuotes: false },\n                },\n              ],\n            },\n          }),\n        ],\n        // Automatically split vendor and commons\n        // https://twitter.com/wSokra/status/969633336732905474\n        // https://medium.com/webpack/webpack-4-code-splitting-chunk-graph-and-the-splitchunks-optimization-be739a861366\n        // splitChunks: {\n        // chunks: 'all',\n        // name: false,\n        // },\n        // Keep the runtime chunk separated to enable long term caching\n        // https://twitter.com/wSokra/status/969679223278505985\n        // https://github.com/facebook/create-react-app/issues/5358\n        // runtimeChunk: {\n        // name: (entrypoint) => `runtime-${entrypoint.name}`,\n        // },\n      };\n\n  return {\n    module,\n    externals,\n    optimization,\n\n    plugins: [\n      // Generate an asset manifest file with the following content:\n      // - \"files\" key: Mapping of all asset filenames to their corresponding\n      //   output file so that tools can pick it up without having to parse\n      //   `index.html`\n      //   can be used to reconstruct the HTML if necessary\n      // new WebpackManifestPlugin({\n      //   fileName: 'asset-manifest.json',\n      //   publicPath: 'public',\n      //   generate: (seed, files, entrypoints) => {\n      //     const manifestFiles = files.reduce((manifest, file) => {\n      //       manifest[file.name] = file.path;\n      //       return manifest;\n      //     }, seed);\n      //     const entrypointFiles = entrypoints.main.filter((fileName) => !fileName.endsWith('.map'));\n\n      //     // @ts-ignore - https://github.com/shellscape/webpack-manifest-plugin/issues/276\n      //     return {\n      //       files: manifestFiles,\n      //       entrypoints: entrypointFiles,\n      //     } as Record<string, string>;\n      //   },\n      // }),\n      // Generate a service worker script that will precache, and keep up to date,\n      // the HTML & assets that are part of the webpack build.\n      new WorkboxWebpackPlugin.GenerateSW({\n        clientsClaim: true,\n        exclude: [/\\.map$/, /asset-manifest\\.json$/],\n        // importWorkboxFrom: 'cdn',\n        navigateFallback: 'public/index.html',\n        navigateFallbackDenylist: [\n          // Exclude URLs starting with /_, as they're likely an API call\n          new RegExp('^/_'),\n          // Exclude any URLs whose last part seems to be a file extension\n          // as they're likely a resource and not a SPA route.\n          // URLs containing a \"?\" character won't be blacklisted as they're likely\n          // a route with query params (e.g. auth callbacks).\n          new RegExp('/[^/?]+\\\\.[^/]+$'),\n        ],\n      }),\n    ].filter(Boolean),\n    // Turn off performance processing because we utilize\n    // our own hints via the FileSizeReporter\n    performance: false,\n  };\n}\n"]}
+{"version":3,"sources":["webpack.config.base.prod.ts"],"names":["externalizePeer","peers","dev","externals","undefined","exposedRules","module","rules","optimization","minimize","minimizer","TerserPlugin","minify","esbuildMinify","terserOptions","minifyWhitespace","minifyIdentifiers","minifySyntax","CssMinimizerPlugin","minimizerOptions","preset","minifyFontValues","removeQuotes","plugins","WorkboxWebpackPlugin","GenerateSW","clientsClaim","exclude","navigateFallback","navigateFallbackDenylist","RegExp","filter","Boolean","performance"],"mappings":";;;;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAEA;AACA;AACA;AACe,kBAAUA,eAAV,EAAoCC,KAApC,EAAqDC,GAArD,EAAmF;AAChG,QAAMC,SAAS,GAAGH,eAAe,GAAI,kCAAaC,KAAb,CAAJ,GAAkCG,SAAnE;AACA,QAAMC,YAAY,GAAGL,eAAe,GAAGI,SAAH,GAAe,wCAAgBH,KAAhB,CAAnD;AAEA,QAAMK,MAAM,GAAGN,eAAe,GAC1BI,SAD0B,GAE1B;AACEG,IAAAA,KAAK,EAAEF;AADT,GAFJ;AAMA,QAAMG,YAAY,GAAGN,GAAG,GACpBE,SADoB,GAEpB;AACEK,IAAAA,QAAQ,EAAE,IADZ;AAEEC,IAAAA,SAAS,EAAE,CACT,KAAIC,8BAAJ,EAAiB;AACfC,MAAAA,MAAM,EAAED,+BAAaE,aADN;AAEf;AACA;AACA;AACAC,MAAAA,aAAa,EAAE;AACbF,QAAAA,MAAM,EAAE,KADK;AAEbG,QAAAA,gBAAgB,EAAE,IAFL;AAGb;AACAC,QAAAA,iBAAiB,EAAE,KAJN;AAKb;AACAC,QAAAA,YAAY,EAAE;AAND,OALA,CAaf;;AAbe,KAAjB,CADS,EAiBT;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAIC,oCAAJ,EAAuB;AACrBC,MAAAA,gBAAgB,EAAE;AAChBC,QAAAA,MAAM,EAAE,CACN,SADM,EAEN;AACEC,UAAAA,gBAAgB,EAAE;AAAEC,YAAAA,YAAY,EAAE;AAAhB;AADpB,SAFM;AADQ;AADG,KAAvB,CAvDS,CAFb,CAoEE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAhFF,GAFJ;AAqFA,SAAO;AACLhB,IAAAA,MADK;AAELH,IAAAA,SAFK;AAGLK,IAAAA,YAHK;AAKLe,IAAAA,OAAO,EAAE,CACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAIC,gCAAqBC,UAAzB,EAAoC;AAClCC,MAAAA,YAAY,EAAE,IADoB;AAElCC,MAAAA,OAAO,EAAE,CAAC,QAAD,EAAW,uBAAX,CAFyB;AAGlC;AACAC,MAAAA,gBAAgB,EAAE,mBAJgB;AAKlCC,MAAAA,wBAAwB,EAAE,CACxB;AACA,UAAIC,MAAJ,CAAW,KAAX,CAFwB,EAGxB;AACA;AACA;AACA;AACA,UAAIA,MAAJ,CAAW,kBAAX,CAPwB;AALQ,KAApC,CAzBO,EAwCPC,MAxCO,CAwCAC,OAxCA,CALJ;AA8CL;AACA;AACAC,IAAAA,WAAW,EAAE;AAhDR,GAAP;AAkDD","sourcesContent":["import WorkboxWebpackPlugin from 'workbox-webpack-plugin';\nimport CssMinimizerPlugin from 'css-minimizer-webpack-plugin';\nimport TerserPlugin from 'terser-webpack-plugin';\nimport { Configuration } from 'webpack';\nimport { getExternals } from './get-externals';\nimport { getExposedRules } from './get-exposed-rules';\n// import { WebpackManifestPlugin } from 'webpack-manifest-plugin';\n\n// This is the production and development configuration.\n// It is focused on developer experience, fast rebuilds, and a minimal bundle.\n// eslint-disable-next-line complexity\nexport default function (externalizePeer: boolean, peers: string[], dev?: boolean): Configuration {\n  const externals = externalizePeer ? (getExternals(peers) as any) : undefined;\n  const exposedRules = externalizePeer ? undefined : getExposedRules(peers);\n\n  const module = externalizePeer\n    ? undefined\n    : {\n        rules: exposedRules,\n      };\n\n  const optimization = dev\n    ? undefined\n    : {\n        minimize: true,\n        minimizer: [\n          new TerserPlugin({\n            minify: TerserPlugin.esbuildMinify,\n            // `terserOptions` options will be passed to `esbuild`\n            // Link to options - https://esbuild.github.io/api/#minify\n            // Note: the `minify` options is true by default (and override other `minify*` options), so if you want to disable the `minifyIdentifiers` option (or other `minify*` options) please use:\n            terserOptions: {\n              minify: false,\n              minifyWhitespace: true,\n              // We don't want to minify identifiers to enable easier debugging on remote scopes when there are preview issues\n              minifyIdentifiers: false,\n              // minifyIdentifiers: true,\n              minifySyntax: true,\n            },\n            // terserOptions: {},\n          }),\n\n          // This is only used in production mode\n          // new TerserPlugin({\n          //   extractComments: false,\n          //   terserOptions: {\n          //     parse: {\n          //       // We want terser to parse ecma 8 code. However, we don't want it\n          //       // to apply any minification steps that turns valid ecma 5 code\n          //       // into invalid ecma 5 code. This is why the 'compress' and 'output'\n          //       // sections only apply transformations that are ecma 5 safe\n          //       // https://github.com/facebook/create-react-app/pull/4234\n          //       ecma: 8,\n          //     },\n          //     compress: {\n          //       ecma: 5,\n          //       warnings: false,\n          //       // Disabled because of an issue with Uglify breaking seemingly valid code:\n          //       // https://github.com/facebook/create-react-app/issues/2376\n          //       // Pending further investigation:\n          //       // https://github.com/mishoo/UglifyJS2/issues/2011\n          //       comparisons: false,\n          //       // Disabled because of an issue with Terser breaking valid code:\n          //       // https://github.com/facebook/create-react-app/issues/5250\n          //       // Pending further investigation:\n          //       // https://github.com/terser-js/terser/issues/120\n          //       inline: 2,\n          //     },\n          //     mangle: {\n          //       safari10: true,\n          //     },\n          //     output: {\n          //       ecma: 5,\n          //       comments: false,\n          //       // Turned on because emoji and regex is not minified properly using default\n          //       // https://github.com/facebook/create-react-app/issues/2488\n          //       ascii_only: true,\n          //     },\n          //   },\n          // }),\n          new CssMinimizerPlugin({\n            minimizerOptions: {\n              preset: [\n                'default',\n                {\n                  minifyFontValues: { removeQuotes: false },\n                },\n              ],\n            },\n          }),\n        ],\n        // Automatically split vendor and commons\n        // https://twitter.com/wSokra/status/969633336732905474\n        // https://medium.com/webpack/webpack-4-code-splitting-chunk-graph-and-the-splitchunks-optimization-be739a861366\n        // splitChunks: {\n        // chunks: 'all',\n        // name: false,\n        // },\n        // Keep the runtime chunk separated to enable long term caching\n        // https://twitter.com/wSokra/status/969679223278505985\n        // https://github.com/facebook/create-react-app/issues/5358\n        // runtimeChunk: {\n        // name: (entrypoint) => `runtime-${entrypoint.name}`,\n        // },\n      };\n\n  return {\n    module,\n    externals,\n    optimization,\n\n    plugins: [\n      // Generate an asset manifest file with the following content:\n      // - \"files\" key: Mapping of all asset filenames to their corresponding\n      //   output file so that tools can pick it up without having to parse\n      //   `index.html`\n      //   can be used to reconstruct the HTML if necessary\n      // new WebpackManifestPlugin({\n      //   fileName: 'asset-manifest.json',\n      //   publicPath: 'public',\n      //   generate: (seed, files, entrypoints) => {\n      //     const manifestFiles = files.reduce((manifest, file) => {\n      //       manifest[file.name] = file.path;\n      //       return manifest;\n      //     }, seed);\n      //     const entrypointFiles = entrypoints.main.filter((fileName) => !fileName.endsWith('.map'));\n\n      //     // @ts-ignore - https://github.com/shellscape/webpack-manifest-plugin/issues/276\n      //     return {\n      //       files: manifestFiles,\n      //       entrypoints: entrypointFiles,\n      //     } as Record<string, string>;\n      //   },\n      // }),\n      // Generate a service worker script that will precache, and keep up to date,\n      // the HTML & assets that are part of the webpack build.\n      new WorkboxWebpackPlugin.GenerateSW({\n        clientsClaim: true,\n        exclude: [/\\.map$/, /asset-manifest\\.json$/],\n        // importWorkboxFrom: 'cdn',\n        navigateFallback: 'public/index.html',\n        navigateFallbackDenylist: [\n          // Exclude URLs starting with /_, as they're likely an API call\n          new RegExp('^/_'),\n          // Exclude any URLs whose last part seems to be a file extension\n          // as they're likely a resource and not a SPA route.\n          // URLs containing a \"?\" character won't be blacklisted as they're likely\n          // a route with query params (e.g. auth callbacks).\n          new RegExp('/[^/?]+\\\\.[^/]+$'),\n        ],\n      }),\n    ].filter(Boolean),\n    // Turn off performance processing because we utilize\n    // our own hints via the FileSizeReporter\n    performance: false,\n  };\n}\n"]}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/react",
-  "version": "0.0.691",
+  "version": "0.0.694",
   "homepage": "https://bit.dev/teambit/react/react",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.react",
     "name": "react",
-    "version": "0.0.691"
+    "version": "0.0.694"
   },
   "dependencies": {
     "react-error-boundary": "^3.0.0",
@@ -71,6 +71,7 @@
     "eslint-plugin-react-hooks": "4.2.0",
     "eslint-plugin-import": "2.22.1",
     "eslint-plugin-jest": "24.1.5",
+    "esbuild": "0.14.28",
     "@typescript-eslint/eslint-plugin": "4.30.0",
     "@typescript-eslint/parser": "4.30.0",
     "@svgr/webpack": "5.5.0",
@@ -79,39 +80,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.691",
+    "@teambit/preview": "0.0.694",
     "@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.691",
-    "@teambit/bundler": "0.0.691",
-    "@teambit/compiler": "0.0.691",
+    "@teambit/builder": "0.0.694",
+    "@teambit/bundler": "0.0.694",
+    "@teambit/compiler": "0.0.694",
     "@teambit/component.modules.component-url": "0.0.124",
-    "@teambit/component": "0.0.691",
-    "@teambit/envs": "0.0.691",
-    "@teambit/eslint": "0.0.691",
-    "@teambit/formatter": "0.0.242",
-    "@teambit/jest": "0.0.691",
-    "@teambit/linter": "0.0.691",
-    "@teambit/pkg": "0.0.691",
-    "@teambit/prettier": "0.0.242",
+    "@teambit/component": "0.0.694",
+    "@teambit/envs": "0.0.694",
+    "@teambit/eslint": "0.0.694",
+    "@teambit/formatter": "0.0.245",
+    "@teambit/jest": "0.0.694",
+    "@teambit/linter": "0.0.694",
+    "@teambit/pkg": "0.0.694",
+    "@teambit/prettier": "0.0.245",
     "@teambit/react.ui.highlighter.component-metadata.bit-component-meta": "0.0.21",
-    "@teambit/schema": "0.0.691",
-    "@teambit/tester": "0.0.691",
-    "@teambit/typescript": "0.0.691",
-    "@teambit/webpack": "0.0.691",
-    "@teambit/workspace": "0.0.691",
-    "@teambit/application": "0.0.333",
-    "@teambit/cli": "0.0.463",
-    "@teambit/dependency-resolver": "0.0.691",
-    "@teambit/generator": "0.0.691",
-    "@teambit/graphql": "0.0.691",
-    "@teambit/react.ui.highlighter-provider": "0.0.185",
-    "@teambit/compositions": "0.0.691",
-    "@teambit/ui": "0.0.691",
-    "@teambit/react.eslint-config-bit-react": "0.0.539",
+    "@teambit/schema": "0.0.694",
+    "@teambit/tester": "0.0.694",
+    "@teambit/typescript": "0.0.694",
+    "@teambit/webpack": "0.0.694",
+    "@teambit/workspace": "0.0.694",
+    "@teambit/application": "0.0.336",
+    "@teambit/cli": "0.0.464",
+    "@teambit/dependency-resolver": "0.0.694",
+    "@teambit/generator": "0.0.694",
+    "@teambit/graphql": "0.0.694",
+    "@teambit/react.ui.highlighter-provider": "0.0.186",
+    "@teambit/compositions": "0.0.694",
+    "@teambit/ui": "0.0.694",
+    "@teambit/react.eslint-config-bit-react": "0.0.540",
     "@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 +122,7 @@
     "@teambit/webpack.modules.style-regexps": "0.0.132",
     "@teambit/component-id": "0.0.402",
     "@teambit/toolbox.network.get-port": "0.0.113",
-    "@teambit/config": "0.0.476"
+    "@teambit/config": "0.0.477"
   },
   "devDependencies": {
     "@types/react": "^17.0.8",
@@ -140,7 +141,7 @@
     "@teambit/react.content.react-overview": "1.95.0"
   },
   "peerDependencies": {
-    "@teambit/legacy": "1.0.241",
+    "@teambit/legacy": "1.0.242",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },
@@ -180,6 +181,7 @@
         "eslint-plugin-react-hooks": "4.2.0",
         "eslint-plugin-import": "2.22.1",
         "eslint-plugin-jest": "24.1.5",
+        "esbuild": "0.14.28",
         "@typescript-eslint/eslint-plugin": "4.30.0",
         "@typescript-eslint/parser": "4.30.0",
         "@babel/preset-react": "7.13.13",
@@ -202,7 +204,7 @@
         "@types/jest": "^26.0.0"
       },
       "peerDependencies": {
-        "@teambit/legacy": "1.0.241",
+        "@teambit/legacy": "1.0.242",
         "react-dom": "^16.8.0 || ^17.0.0",
         "react": "^16.8.0 || ^17.0.0"
       }

package/{preview-1648386827284.js → preview-1648659683881.js}

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