@teambit/react 1.0.41 → 1.0.42

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (207) hide show
  1. package/artifacts/env-template/public/{29.aabccd461805a58cd99a.js → 29.ddc7bc194190fac98e8b.js} +18 -18
  2. package/artifacts/env-template/public/{238.64be32cc6d4bc396b35e.js → 293.4bce474b96c9eb955917.js} +4 -4
  3. package/artifacts/env-template/public/assets-manifest.json +12 -12
  4. package/artifacts/env-template/public/{compositions.b6446d022ddef607b2fb.js → compositions.3c3b3230660e1a556e41.js} +1 -1
  5. package/artifacts/env-template/public/compositions.html +1 -1
  6. package/artifacts/env-template/public/{overview.536d77e3d6f68d0ddf21.js → overview.e6a80013a110693d6dac.js} +1 -1
  7. package/artifacts/env-template/public/overview.html +1 -1
  8. package/artifacts/env-template/public/{peers.777d86ba769cf02b788f.js → peers.8430739d7755eb333339.js} +1 -1
  9. package/artifacts/env-template/public/{preview-root.983463c786334e1fbaf1.js → preview-root.3b62d04b3a7f234bd8ca.js} +1 -1
  10. package/dist/apps/web/ssr/ssr-express.js +2 -2
  11. package/dist/apps/web/ssr/ssr-express.js.map +1 -1
  12. package/dist/apps/web/webpack/webpack.app.ssr.config.js +2 -4
  13. package/dist/apps/web/webpack/webpack.app.ssr.config.js.map +1 -1
  14. package/dist/{preview-1698981534427.js → preview-1699364645970.js} +2 -2
  15. package/dist/react.aspect.js +2 -4
  16. package/dist/react.aspect.js.map +1 -1
  17. package/dist/react.env.js +2 -3
  18. package/dist/react.env.js.map +1 -1
  19. package/dist/react.main.runtime.d.ts +5 -2
  20. package/dist/react.main.runtime.js +18 -3
  21. package/dist/react.main.runtime.js.map +1 -1
  22. package/dist/react.preview.runtime.js +3 -4
  23. package/dist/react.preview.runtime.js.map +1 -1
  24. package/dist/react.templates.d.ts +2 -1
  25. package/dist/react.templates.js +21 -36
  26. package/dist/react.templates.js.map +1 -1
  27. package/dist/react.ui.runtime.js +1 -2
  28. package/dist/react.ui.runtime.js.map +1 -1
  29. package/dist/webpack/postcss.config.js +1 -2
  30. package/dist/webpack/postcss.config.js.map +1 -1
  31. package/dist/webpack/webpack.config.base.js +2 -2
  32. package/dist/webpack/webpack.config.base.js.map +1 -1
  33. package/package.json +46 -44
  34. package/dist/templates/react-app/files/app-plugin.d.ts +0 -2
  35. package/dist/templates/react-app/files/app-plugin.js +0 -17
  36. package/dist/templates/react-app/files/app-plugin.js.map +0 -1
  37. package/dist/templates/react-app/files/app-root.d.ts +0 -2
  38. package/dist/templates/react-app/files/app-root.js +0 -24
  39. package/dist/templates/react-app/files/app-root.js.map +0 -1
  40. package/dist/templates/react-app/files/app.d.ts +0 -2
  41. package/dist/templates/react-app/files/app.js +0 -34
  42. package/dist/templates/react-app/files/app.js.map +0 -1
  43. package/dist/templates/react-app/files/compositions.d.ts +0 -2
  44. package/dist/templates/react-app/files/compositions.js +0 -24
  45. package/dist/templates/react-app/files/compositions.js.map +0 -1
  46. package/dist/templates/react-app/files/doc.d.ts +0 -2
  47. package/dist/templates/react-app/files/doc.js +0 -33
  48. package/dist/templates/react-app/files/doc.js.map +0 -1
  49. package/dist/templates/react-app/files/index.d.ts +0 -2
  50. package/dist/templates/react-app/files/index.js +0 -13
  51. package/dist/templates/react-app/files/index.js.map +0 -1
  52. package/dist/templates/react-app/index.d.ts +0 -2
  53. package/dist/templates/react-app/index.js +0 -84
  54. package/dist/templates/react-app/index.js.map +0 -1
  55. package/dist/templates/react-component/files/component.d.ts +0 -5
  56. package/dist/templates/react-component/files/component.js +0 -35
  57. package/dist/templates/react-component/files/component.js.map +0 -1
  58. package/dist/templates/react-component/files/composition.d.ts +0 -5
  59. package/dist/templates/react-component/files/composition.js +0 -27
  60. package/dist/templates/react-component/files/composition.js.map +0 -1
  61. package/dist/templates/react-component/files/docs.d.ts +0 -5
  62. package/dist/templates/react-component/files/docs.js +0 -37
  63. package/dist/templates/react-component/files/docs.js.map +0 -1
  64. package/dist/templates/react-component/files/index-file.d.ts +0 -5
  65. package/dist/templates/react-component/files/index-file.js +0 -21
  66. package/dist/templates/react-component/files/index-file.js.map +0 -1
  67. package/dist/templates/react-component/files/test.d.ts +0 -5
  68. package/dist/templates/react-component/files/test.js +0 -28
  69. package/dist/templates/react-component/files/test.js.map +0 -1
  70. package/dist/templates/react-component/index.d.ts +0 -3
  71. package/dist/templates/react-component/index.js +0 -68
  72. package/dist/templates/react-component/index.js.map +0 -1
  73. package/dist/templates/react-component-js/files/component.d.ts +0 -5
  74. package/dist/templates/react-component-js/files/component.js +0 -28
  75. package/dist/templates/react-component-js/files/component.js.map +0 -1
  76. package/dist/templates/react-component-js/files/composition.d.ts +0 -5
  77. package/dist/templates/react-component-js/files/composition.js +0 -25
  78. package/dist/templates/react-component-js/files/composition.js.map +0 -1
  79. package/dist/templates/react-component-js/files/docs.d.ts +0 -5
  80. package/dist/templates/react-component-js/files/docs.js +0 -41
  81. package/dist/templates/react-component-js/files/docs.js.map +0 -1
  82. package/dist/templates/react-component-js/files/test.d.ts +0 -5
  83. package/dist/templates/react-component-js/files/test.js +0 -30
  84. package/dist/templates/react-component-js/files/test.js.map +0 -1
  85. package/dist/templates/react-component-js/index.d.ts +0 -3
  86. package/dist/templates/react-component-js/index.js +0 -70
  87. package/dist/templates/react-component-js/index.js.map +0 -1
  88. package/dist/templates/react-context/files/composition.d.ts +0 -5
  89. package/dist/templates/react-context/files/composition.js +0 -36
  90. package/dist/templates/react-context/files/composition.js.map +0 -1
  91. package/dist/templates/react-context/files/context-provider.d.ts +0 -5
  92. package/dist/templates/react-context/files/context-provider.js +0 -37
  93. package/dist/templates/react-context/files/context-provider.js.map +0 -1
  94. package/dist/templates/react-context/files/context.d.ts +0 -5
  95. package/dist/templates/react-context/files/context.js +0 -31
  96. package/dist/templates/react-context/files/context.js.map +0 -1
  97. package/dist/templates/react-context/files/docs.d.ts +0 -5
  98. package/dist/templates/react-context/files/docs.js +0 -60
  99. package/dist/templates/react-context/files/docs.js.map +0 -1
  100. package/dist/templates/react-context/files/index-file.d.ts +0 -5
  101. package/dist/templates/react-context/files/index-file.js +0 -23
  102. package/dist/templates/react-context/files/index-file.js.map +0 -1
  103. package/dist/templates/react-context/files/test.d.ts +0 -5
  104. package/dist/templates/react-context/files/test.js +0 -26
  105. package/dist/templates/react-context/files/test.js.map +0 -1
  106. package/dist/templates/react-context/index.d.ts +0 -2
  107. package/dist/templates/react-context/index.js +0 -65
  108. package/dist/templates/react-context/index.js.map +0 -1
  109. package/dist/templates/react-env/files/aspect.d.ts +0 -2
  110. package/dist/templates/react-env/files/aspect.js +0 -19
  111. package/dist/templates/react-env/files/aspect.js.map +0 -1
  112. package/dist/templates/react-env/files/doc.d.ts +0 -2
  113. package/dist/templates/react-env/files/doc.js +0 -186
  114. package/dist/templates/react-env/files/doc.js.map +0 -1
  115. package/dist/templates/react-env/files/index.d.ts +0 -2
  116. package/dist/templates/react-env/files/index.js +0 -19
  117. package/dist/templates/react-env/files/index.js.map +0 -1
  118. package/dist/templates/react-env/files/jest.config.d.ts +0 -1
  119. package/dist/templates/react-env/files/jest.config.js +0 -29
  120. package/dist/templates/react-env/files/jest.config.js.map +0 -1
  121. package/dist/templates/react-env/files/main.runtime.d.ts +0 -2
  122. package/dist/templates/react-env/files/main.runtime.js +0 -103
  123. package/dist/templates/react-env/files/main.runtime.js.map +0 -1
  124. package/dist/templates/react-env/files/preview.runtime.d.ts +0 -2
  125. package/dist/templates/react-env/files/preview.runtime.js +0 -37
  126. package/dist/templates/react-env/files/preview.runtime.js.map +0 -1
  127. package/dist/templates/react-env/files/typescript/styles.d.ts +0 -1
  128. package/dist/templates/react-env/files/typescript/styles.js +0 -15
  129. package/dist/templates/react-env/files/typescript/styles.js.map +0 -1
  130. package/dist/templates/react-env/files/typescript/ts-transformer.d.ts +0 -1
  131. package/dist/templates/react-env/files/typescript/ts-transformer.js +0 -58
  132. package/dist/templates/react-env/files/typescript/ts-transformer.js.map +0 -1
  133. package/dist/templates/react-env/files/typescript/typescript.config.d.ts +0 -1
  134. package/dist/templates/react-env/files/typescript/typescript.config.js +0 -29
  135. package/dist/templates/react-env/files/typescript/typescript.config.js.map +0 -1
  136. package/dist/templates/react-env/files/webpack.config.d.ts +0 -1
  137. package/dist/templates/react-env/files/webpack.config.js +0 -56
  138. package/dist/templates/react-env/files/webpack.config.js.map +0 -1
  139. package/dist/templates/react-env/index.d.ts +0 -2
  140. package/dist/templates/react-env/index.js +0 -124
  141. package/dist/templates/react-env/index.js.map +0 -1
  142. package/dist/templates/react-hook/files/component.d.ts +0 -5
  143. package/dist/templates/react-hook/files/component.js +0 -26
  144. package/dist/templates/react-hook/files/component.js.map +0 -1
  145. package/dist/templates/react-hook/files/composition.d.ts +0 -5
  146. package/dist/templates/react-hook/files/composition.js +0 -32
  147. package/dist/templates/react-hook/files/composition.js.map +0 -1
  148. package/dist/templates/react-hook/files/docs.d.ts +0 -5
  149. package/dist/templates/react-hook/files/docs.js +0 -42
  150. package/dist/templates/react-hook/files/docs.js.map +0 -1
  151. package/dist/templates/react-hook/files/index-file.d.ts +0 -5
  152. package/dist/templates/react-hook/files/index-file.js +0 -20
  153. package/dist/templates/react-hook/files/index-file.js.map +0 -1
  154. package/dist/templates/react-hook/files/index-file.spec.d.ts +0 -1
  155. package/dist/templates/react-hook/files/index-file.spec.js +0 -36
  156. package/dist/templates/react-hook/files/index-file.spec.js.map +0 -1
  157. package/dist/templates/react-hook/files/test.d.ts +0 -5
  158. package/dist/templates/react-hook/files/test.js +0 -29
  159. package/dist/templates/react-hook/files/test.js.map +0 -1
  160. package/dist/templates/react-hook/index.d.ts +0 -2
  161. package/dist/templates/react-hook/index.js +0 -58
  162. package/dist/templates/react-hook/index.js.map +0 -1
  163. package/templates/react-app/files/app-plugin.ts +0 -9
  164. package/templates/react-app/files/app-root.ts +0 -16
  165. package/templates/react-app/files/app.ts +0 -26
  166. package/templates/react-app/files/compositions.ts +0 -16
  167. package/templates/react-app/files/doc.ts +0 -23
  168. package/templates/react-app/files/index.ts +0 -5
  169. package/templates/react-app/index.ts +0 -48
  170. package/templates/react-component/files/component.ts +0 -25
  171. package/templates/react-component/files/composition.ts +0 -18
  172. package/templates/react-component/files/docs.ts +0 -28
  173. package/templates/react-component/files/index-file.ts +0 -12
  174. package/templates/react-component/files/test.ts +0 -19
  175. package/templates/react-component/index.ts +0 -27
  176. package/templates/react-component-js/files/component.ts +0 -18
  177. package/templates/react-component-js/files/composition.ts +0 -16
  178. package/templates/react-component-js/files/docs.ts +0 -32
  179. package/templates/react-component-js/files/test.ts +0 -21
  180. package/templates/react-component-js/index.ts +0 -32
  181. package/templates/react-context/files/composition.ts +0 -27
  182. package/templates/react-context/files/context-provider.ts +0 -27
  183. package/templates/react-context/files/context.ts +0 -21
  184. package/templates/react-context/files/docs.ts +0 -51
  185. package/templates/react-context/files/index-file.ts +0 -14
  186. package/templates/react-context/files/test.ts +0 -18
  187. package/templates/react-context/index.ts +0 -29
  188. package/templates/react-env/files/aspect.ts +0 -10
  189. package/templates/react-env/files/doc.ts +0 -177
  190. package/templates/react-env/files/index.ts +0 -10
  191. package/templates/react-env/files/jest.config.ts +0 -21
  192. package/templates/react-env/files/main.runtime.ts +0 -94
  193. package/templates/react-env/files/preview.runtime.ts +0 -27
  194. package/templates/react-env/files/typescript/styles.ts +0 -7
  195. package/templates/react-env/files/typescript/ts-transformer.ts +0 -50
  196. package/templates/react-env/files/typescript/typescript.config.ts +0 -21
  197. package/templates/react-env/files/webpack.config.ts +0 -48
  198. package/templates/react-env/index.ts +0 -68
  199. package/templates/react-hook/files/component.ts +0 -16
  200. package/templates/react-hook/files/composition.ts +0 -23
  201. package/templates/react-hook/files/docs.ts +0 -33
  202. package/templates/react-hook/files/index-file.spec.ts +0 -24
  203. package/templates/react-hook/files/index-file.ts +0 -11
  204. package/templates/react-hook/files/test.ts +0 -20
  205. package/templates/react-hook/index.ts +0 -21
  206. /package/{compositions-1698981534427.js → compositions-1699364645970.js} +0 -0
  207. /package/{overview-1698981534427.js → overview-1699364645970.js} +0 -0
@@ -1 +0,0 @@
1
- {"version":3,"names":["_component","data","require","_composition","_docs","_test","ownKeys","e","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","obj","key","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","call","TypeError","Number","reactComponentJS","name","description","hidden","generateFiles","context","namePascalCase","Name","indexFile","relativePath","content","componentFile","compositionFile","docsFile","testFile","config","env","exports","deprecatedReactComponentJS"],"sources":["index.ts"],"sourcesContent":["import { ComponentTemplate, ComponentContext } from '@teambit/generator';\nimport { componentFile } from './files/component';\nimport { compositionFile } from './files/composition';\nimport { docsFile } from './files/docs';\nimport { testFile } from './files/test';\n\nexport const reactComponentJS: ComponentTemplate = {\n name: 'react-js',\n description: 'a basic react component in js',\n hidden: true,\n generateFiles: (context: ComponentContext) => {\n const { name, namePascalCase: Name } = context;\n const indexFile = {\n relativePath: 'index.js',\n content: `export { ${Name} } from './${name}';\n`,\n };\n return [indexFile, componentFile(context), compositionFile(context), docsFile(context), testFile(context)];\n },\n config: {\n 'teambit.react/react': {},\n 'teambit.envs/envs': {\n env: 'teambit.react/react',\n },\n },\n};\n\nexport const deprecatedReactComponentJS: ComponentTemplate = {\n ...reactComponentJS,\n name: 'react-component-js',\n hidden: true,\n};\n"],"mappings":"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"}
@@ -1,5 +0,0 @@
1
- import { ComponentContext } from '@teambit/generator';
2
- export declare const compositionFile: (context: ComponentContext) => {
3
- relativePath: string;
4
- content: string;
5
- };
@@ -1,36 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.compositionFile = void 0;
7
- const compositionFile = context => {
8
- const {
9
- name,
10
- namePascalCase: Name
11
- } = context;
12
- return {
13
- relativePath: `${name}-context.composition.tsx`,
14
- content: `import React, { useContext } from 'react';
15
- import { ${Name}Provider } from './${name}-context-provider';
16
- import { ${Name}Context } from './${name}-context';
17
-
18
- export function MockComponent() {
19
- const theme = useContext(${Name}Context);
20
-
21
- return <div style={{ color: theme.color }}>this should be {theme.color}</div>;
22
- }
23
-
24
- export const BasicThemeUsage = () => {
25
- return (
26
- <${Name}Provider color="blue">
27
- <MockComponent />
28
- </${Name}Provider>
29
- );
30
- };
31
- `
32
- };
33
- };
34
- exports.compositionFile = compositionFile;
35
-
36
- //# sourceMappingURL=composition.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["compositionFile","context","name","namePascalCase","Name","relativePath","content","exports"],"sources":["composition.ts"],"sourcesContent":["import { ComponentContext } from '@teambit/generator';\n\nexport const compositionFile = (context: ComponentContext) => {\n const { name, namePascalCase: Name } = context;\n\n return {\n relativePath: `${name}-context.composition.tsx`,\n content: `import React, { useContext } from 'react';\nimport { ${Name}Provider } from './${name}-context-provider';\nimport { ${Name}Context } from './${name}-context';\n\nexport function MockComponent() {\n const theme = useContext(${Name}Context);\n\n return <div style={{ color: theme.color }}>this should be {theme.color}</div>;\n}\n\nexport const BasicThemeUsage = () => {\n return (\n <${Name}Provider color=\"blue\">\n <MockComponent />\n </${Name}Provider>\n );\n};\n`,\n };\n};\n"],"mappings":";;;;;;AAEO,MAAMA,eAAe,GAAIC,OAAyB,IAAK;EAC5D,MAAM;IAAEC,IAAI;IAAEC,cAAc,EAAEC;EAAK,CAAC,GAAGH,OAAO;EAE9C,OAAO;IACLI,YAAY,EAAG,GAAEH,IAAK,0BAAyB;IAC/CI,OAAO,EAAG;AACd,WAAWF,IAAK,sBAAqBF,IAAK;AAC1C,WAAWE,IAAK,qBAAoBF,IAAK;AACzC;AACA;AACA,6BAA6BE,IAAK;AAClC;AACA;AACA;AACA;AACA;AACA;AACA,OAAOA,IAAK;AACZ;AACA,QAAQA,IAAK;AACb;AACA;AACA;EACE,CAAC;AACH,CAAC;AAACG,OAAA,CAAAP,eAAA,GAAAA,eAAA"}
@@ -1,5 +0,0 @@
1
- import { ComponentContext } from '@teambit/generator';
2
- export declare const contextProviderFile: (context: ComponentContext) => {
3
- relativePath: string;
4
- content: string;
5
- };
@@ -1,37 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.contextProviderFile = void 0;
7
- const contextProviderFile = context => {
8
- const {
9
- name,
10
- namePascalCase: Name
11
- } = context;
12
- return {
13
- relativePath: `${name}-context-provider.tsx`,
14
- content: `import React, { ReactNode } from 'react';
15
- import { ${Name}Context } from './${name}-context';
16
-
17
- export type ${Name}ProviderProps = {
18
- /**
19
- * primary color of theme.
20
- */
21
- color?: string,
22
-
23
- /**
24
- * children to be rendered within this theme.
25
- */
26
- children: ReactNode
27
- };
28
-
29
- export function ${Name}Provider({ color, children }: ${Name}ProviderProps) {
30
- return <${Name}Context.Provider value={{ color }}>{children}</${Name}Context.Provider>
31
- }
32
- `
33
- };
34
- };
35
- exports.contextProviderFile = contextProviderFile;
36
-
37
- //# sourceMappingURL=context-provider.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["contextProviderFile","context","name","namePascalCase","Name","relativePath","content","exports"],"sources":["context-provider.ts"],"sourcesContent":["import { ComponentContext } from '@teambit/generator';\n\nexport const contextProviderFile = (context: ComponentContext) => {\n const { name, namePascalCase: Name } = context;\n return {\n relativePath: `${name}-context-provider.tsx`,\n content: `import React, { ReactNode } from 'react';\nimport { ${Name}Context } from './${name}-context';\n\nexport type ${Name}ProviderProps = {\n /**\n * primary color of theme.\n */\n color?: string,\n\n /**\n * children to be rendered within this theme.\n */\n children: ReactNode\n};\n\nexport function ${Name}Provider({ color, children }: ${Name}ProviderProps) {\n return <${Name}Context.Provider value={{ color }}>{children}</${Name}Context.Provider>\n}\n`,\n };\n};\n"],"mappings":";;;;;;AAEO,MAAMA,mBAAmB,GAAIC,OAAyB,IAAK;EAChE,MAAM;IAAEC,IAAI;IAAEC,cAAc,EAAEC;EAAK,CAAC,GAAGH,OAAO;EAC9C,OAAO;IACLI,YAAY,EAAG,GAAEH,IAAK,uBAAsB;IAC5CI,OAAO,EAAG;AACd,WAAWF,IAAK,qBAAoBF,IAAK;AACzC;AACA,cAAcE,IAAK;AACnB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBA,IAAK,iCAAgCA,IAAK;AAC5D,YAAYA,IAAK,kDAAiDA,IAAK;AACvE;AACA;EACE,CAAC;AACH,CAAC;AAACG,OAAA,CAAAP,mBAAA,GAAAA,mBAAA"}
@@ -1,5 +0,0 @@
1
- import { ComponentContext } from '@teambit/generator';
2
- export declare const contextFile: (context: ComponentContext) => {
3
- relativePath: string;
4
- content: string;
5
- };
@@ -1,31 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.contextFile = void 0;
7
- const contextFile = context => {
8
- const {
9
- name,
10
- namePascalCase: Name
11
- } = context;
12
- return {
13
- relativePath: `${name}-context.tsx`,
14
- content: `import { createContext } from 'react';
15
-
16
- export type ${Name}ContextType = {
17
- /**
18
- * primary color of theme.
19
- */
20
- color?: string;
21
- };
22
-
23
- export const ${Name}Context = createContext<${Name}ContextType>({
24
- color: 'aqua'
25
- });
26
- `
27
- };
28
- };
29
- exports.contextFile = contextFile;
30
-
31
- //# sourceMappingURL=context.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["contextFile","context","name","namePascalCase","Name","relativePath","content","exports"],"sources":["context.ts"],"sourcesContent":["import { ComponentContext } from '@teambit/generator';\n\nexport const contextFile = (context: ComponentContext) => {\n const { name, namePascalCase: Name } = context;\n return {\n relativePath: `${name}-context.tsx`,\n content: `import { createContext } from 'react';\n\nexport type ${Name}ContextType = {\n /**\n * primary color of theme.\n */\n color?: string;\n};\n\nexport const ${Name}Context = createContext<${Name}ContextType>({\n color: 'aqua'\n});\n`,\n };\n};\n"],"mappings":";;;;;;AAEO,MAAMA,WAAW,GAAIC,OAAyB,IAAK;EACxD,MAAM;IAAEC,IAAI;IAAEC,cAAc,EAAEC;EAAK,CAAC,GAAGH,OAAO;EAC9C,OAAO;IACLI,YAAY,EAAG,GAAEH,IAAK,cAAa;IACnCI,OAAO,EAAG;AACd;AACA,cAAcF,IAAK;AACnB;AACA;AACA;AACA;AACA;AACA;AACA,eAAeA,IAAK,2BAA0BA,IAAK;AACnD;AACA;AACA;EACE,CAAC;AACH,CAAC;AAACG,OAAA,CAAAP,WAAA,GAAAA,WAAA"}
@@ -1,5 +0,0 @@
1
- import { ComponentContext } from '@teambit/generator';
2
- export declare const docsFile: (context: ComponentContext) => {
3
- relativePath: string;
4
- content: string;
5
- };
@@ -1,60 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.docsFile = void 0;
7
- const docsFile = context => {
8
- const {
9
- name,
10
- namePascalCase: Name
11
- } = context;
12
- return {
13
- relativePath: `${name}-context.docs.mdx`,
14
- content: `---
15
- description: ${Name} context.
16
- labels: ['context']
17
- ---
18
-
19
- import { ${Name}Context } from './${name}-context';
20
- import { ${Name}Provider } from './${name}-context-provider';
21
- import { MockComponent } from './${name}-context.composition';
22
-
23
- ## React Theme Context
24
-
25
- This is a simple [React Context](https://reactjs.org/docs/context.html) shared as a Bit component.
26
- Use this component to apply a theme as a context to set on it's children.
27
-
28
- ### Component usage
29
-
30
- \`\`\`tsx
31
- () => {
32
- import React, { useContext } from 'react';
33
- import { ThemeProvider } from './theme-context-provider';
34
- import { ThemeContext } from './theme-context';
35
-
36
- <${Name}Provider color="blue">
37
- // My lovely children now get a theme!
38
- <MockComponent />
39
- </${Name}Provider>;
40
- \`\`\`
41
-
42
- ### Using props to customize the theme
43
-
44
- Change the color to see the text change:
45
-
46
- \`\`\`tsx live
47
- () => {
48
- return (
49
- <${Name}Provider color="red">
50
- <MockComponent />
51
- </${Name}Provider>
52
- );
53
- };
54
- \`\`\`
55
- `
56
- };
57
- };
58
- exports.docsFile = docsFile;
59
-
60
- //# sourceMappingURL=docs.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["docsFile","context","name","namePascalCase","Name","relativePath","content","exports"],"sources":["docs.ts"],"sourcesContent":["import { ComponentContext } from '@teambit/generator';\n\nexport const docsFile = (context: ComponentContext) => {\n const { name, namePascalCase: Name } = context;\n\n return {\n relativePath: `${name}-context.docs.mdx`,\n content: `---\ndescription: ${Name} context.\nlabels: ['context']\n---\n\nimport { ${Name}Context } from './${name}-context';\nimport { ${Name}Provider } from './${name}-context-provider';\nimport { MockComponent } from './${name}-context.composition';\n\n## React Theme Context\n\nThis is a simple [React Context](https://reactjs.org/docs/context.html) shared as a Bit component.\nUse this component to apply a theme as a context to set on it's children.\n\n### Component usage\n\n\\`\\`\\`tsx\n() => {\nimport React, { useContext } from 'react';\nimport { ThemeProvider } from './theme-context-provider';\nimport { ThemeContext } from './theme-context';\n\n<${Name}Provider color=\"blue\">\n // My lovely children now get a theme!\n <MockComponent />\n</${Name}Provider>;\n\\`\\`\\`\n\n### Using props to customize the theme\n\nChange the color to see the text change:\n\n\\`\\`\\`tsx live\n() => {\n return (\n <${Name}Provider color=\"red\">\n <MockComponent />\n </${Name}Provider>\n );\n};\n\\`\\`\\`\n`,\n };\n};\n"],"mappings":";;;;;;AAEO,MAAMA,QAAQ,GAAIC,OAAyB,IAAK;EACrD,MAAM;IAAEC,IAAI;IAAEC,cAAc,EAAEC;EAAK,CAAC,GAAGH,OAAO;EAE9C,OAAO;IACLI,YAAY,EAAG,GAAEH,IAAK,mBAAkB;IACxCI,OAAO,EAAG;AACd,eAAeF,IAAK;AACpB;AACA;AACA;AACA,WAAWA,IAAK,qBAAoBF,IAAK;AACzC,WAAWE,IAAK,sBAAqBF,IAAK;AAC1C,mCAAmCA,IAAK;AACxC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAAGE,IAAK;AACR;AACA;AACA,IAAIA,IAAK;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAOA,IAAK;AACZ;AACA,QAAQA,IAAK;AACb;AACA;AACA;AACA;EACE,CAAC;AACH,CAAC;AAACG,OAAA,CAAAP,QAAA,GAAAA,QAAA"}
@@ -1,5 +0,0 @@
1
- import { ComponentContext } from '@teambit/generator';
2
- export declare const indexFile: (context: ComponentContext) => {
3
- relativePath: string;
4
- content: string;
5
- };
@@ -1,23 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.indexFile = void 0;
7
- const indexFile = context => {
8
- const {
9
- name,
10
- namePascalCase: Name
11
- } = context;
12
- return {
13
- relativePath: 'index.ts',
14
- content: `export { ${Name}Context } from './${name}-context';
15
- export type { ${Name}ContextType } from './${name}-context';
16
- export { ${Name}Provider } from './${name}-context-provider';
17
- export type { ${Name}ProviderProps } from './${name}-context-provider';
18
- `
19
- };
20
- };
21
- exports.indexFile = indexFile;
22
-
23
- //# sourceMappingURL=index-file.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["indexFile","context","name","namePascalCase","Name","relativePath","content","exports"],"sources":["index-file.ts"],"sourcesContent":["import { ComponentContext } from '@teambit/generator';\n\nexport const indexFile = (context: ComponentContext) => {\n const { name, namePascalCase: Name } = context;\n\n return {\n relativePath: 'index.ts',\n content: `export { ${Name}Context } from './${name}-context';\nexport type { ${Name}ContextType } from './${name}-context';\nexport { ${Name}Provider } from './${name}-context-provider';\nexport type { ${Name}ProviderProps } from './${name}-context-provider';\n`,\n };\n};\n"],"mappings":";;;;;;AAEO,MAAMA,SAAS,GAAIC,OAAyB,IAAK;EACtD,MAAM;IAAEC,IAAI;IAAEC,cAAc,EAAEC;EAAK,CAAC,GAAGH,OAAO;EAE9C,OAAO;IACLI,YAAY,EAAE,UAAU;IACxBC,OAAO,EAAG,YAAWF,IAAK,qBAAoBF,IAAK;AACvD,gBAAgBE,IAAK,yBAAwBF,IAAK;AAClD,WAAWE,IAAK,sBAAqBF,IAAK;AAC1C,gBAAgBE,IAAK,2BAA0BF,IAAK;AACpD;EACE,CAAC;AACH,CAAC;AAACK,OAAA,CAAAP,SAAA,GAAAA,SAAA"}
@@ -1,5 +0,0 @@
1
- import { ComponentContext } from '@teambit/generator';
2
- export declare const testFile: (context: ComponentContext) => {
3
- relativePath: string;
4
- content: string;
5
- };
@@ -1,26 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.testFile = void 0;
7
- const testFile = context => {
8
- const {
9
- name
10
- } = context;
11
- return {
12
- relativePath: `${name}-context.spec.tsx`,
13
- content: `import { BasicThemeUsage } from './${name}-context.composition';
14
- import { render } from '@testing-library/react';
15
-
16
- it('should render the button in the color blue', () => {
17
- const { getByText } = render(<BasicThemeUsage />);
18
- const rendered = getByText('this should be blue');
19
- expect(rendered).toBeTruthy();
20
- });
21
- `
22
- };
23
- };
24
- exports.testFile = testFile;
25
-
26
- //# sourceMappingURL=test.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["testFile","context","name","relativePath","content","exports"],"sources":["test.ts"],"sourcesContent":["import { ComponentContext } from '@teambit/generator';\n\nexport const testFile = (context: ComponentContext) => {\n const { name } = context;\n\n return {\n relativePath: `${name}-context.spec.tsx`,\n content: `import { BasicThemeUsage } from './${name}-context.composition';\nimport { render } from '@testing-library/react';\n\nit('should render the button in the color blue', () => {\n const { getByText } = render(<BasicThemeUsage />);\n const rendered = getByText('this should be blue');\n expect(rendered).toBeTruthy();\n});\n`,\n };\n};\n"],"mappings":";;;;;;AAEO,MAAMA,QAAQ,GAAIC,OAAyB,IAAK;EACrD,MAAM;IAAEC;EAAK,CAAC,GAAGD,OAAO;EAExB,OAAO;IACLE,YAAY,EAAG,GAAED,IAAK,mBAAkB;IACxCE,OAAO,EAAG,sCAAqCF,IAAK;AACxD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACE,CAAC;AACH,CAAC;AAACG,OAAA,CAAAL,QAAA,GAAAA,QAAA"}
@@ -1,2 +0,0 @@
1
- import { ComponentTemplate } from '@teambit/generator';
2
- export declare const reactContext: ComponentTemplate;
@@ -1,65 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.reactContext = void 0;
7
- function _context() {
8
- const data = require("./files/context");
9
- _context = function () {
10
- return data;
11
- };
12
- return data;
13
- }
14
- function _contextProvider() {
15
- const data = require("./files/context-provider");
16
- _contextProvider = function () {
17
- return data;
18
- };
19
- return data;
20
- }
21
- function _composition() {
22
- const data = require("./files/composition");
23
- _composition = function () {
24
- return data;
25
- };
26
- return data;
27
- }
28
- function _docs() {
29
- const data = require("./files/docs");
30
- _docs = function () {
31
- return data;
32
- };
33
- return data;
34
- }
35
- function _test() {
36
- const data = require("./files/test");
37
- _test = function () {
38
- return data;
39
- };
40
- return data;
41
- }
42
- function _indexFile() {
43
- const data = require("./files/index-file");
44
- _indexFile = function () {
45
- return data;
46
- };
47
- return data;
48
- }
49
- const reactContext = {
50
- name: 'react-context',
51
- description: 'a react context component',
52
- hidden: true,
53
- generateFiles: context => {
54
- return [(0, _indexFile().indexFile)(context), (0, _context().contextFile)(context), (0, _contextProvider().contextProviderFile)(context), (0, _composition().compositionFile)(context), (0, _docs().docsFile)(context), (0, _test().testFile)(context)];
55
- },
56
- config: {
57
- 'teambit.react/react': {},
58
- 'teambit.envs/envs': {
59
- env: 'teambit.react/react'
60
- }
61
- }
62
- };
63
- exports.reactContext = reactContext;
64
-
65
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["_context","data","require","_contextProvider","_composition","_docs","_test","_indexFile","reactContext","name","description","hidden","generateFiles","context","indexFile","contextFile","contextProviderFile","compositionFile","docsFile","testFile","config","env","exports"],"sources":["index.ts"],"sourcesContent":["import { ComponentTemplate, ComponentContext } from '@teambit/generator';\nimport { contextFile } from './files/context';\nimport { contextProviderFile } from './files/context-provider';\nimport { compositionFile } from './files/composition';\nimport { docsFile } from './files/docs';\nimport { testFile } from './files/test';\nimport { indexFile } from './files/index-file';\n\nexport const reactContext: ComponentTemplate = {\n name: 'react-context',\n description: 'a react context component',\n hidden: true,\n generateFiles: (context: ComponentContext) => {\n return [\n indexFile(context),\n contextFile(context),\n contextProviderFile(context),\n compositionFile(context),\n docsFile(context),\n testFile(context),\n ];\n },\n config: {\n 'teambit.react/react': {},\n 'teambit.envs/envs': {\n env: 'teambit.react/react',\n },\n },\n};\n"],"mappings":";;;;;;AACA,SAAAA,SAAA;EAAA,MAAAC,IAAA,GAAAC,OAAA;EAAAF,QAAA,YAAAA,CAAA;IAAA,OAAAC,IAAA;EAAA;EAAA,OAAAA,IAAA;AAAA;AACA,SAAAE,iBAAA;EAAA,MAAAF,IAAA,GAAAC,OAAA;EAAAC,gBAAA,YAAAA,CAAA;IAAA,OAAAF,IAAA;EAAA;EAAA,OAAAA,IAAA;AAAA;AACA,SAAAG,aAAA;EAAA,MAAAH,IAAA,GAAAC,OAAA;EAAAE,YAAA,YAAAA,CAAA;IAAA,OAAAH,IAAA;EAAA;EAAA,OAAAA,IAAA;AAAA;AACA,SAAAI,MAAA;EAAA,MAAAJ,IAAA,GAAAC,OAAA;EAAAG,KAAA,YAAAA,CAAA;IAAA,OAAAJ,IAAA;EAAA;EAAA,OAAAA,IAAA;AAAA;AACA,SAAAK,MAAA;EAAA,MAAAL,IAAA,GAAAC,OAAA;EAAAI,KAAA,YAAAA,CAAA;IAAA,OAAAL,IAAA;EAAA;EAAA,OAAAA,IAAA;AAAA;AACA,SAAAM,WAAA;EAAA,MAAAN,IAAA,GAAAC,OAAA;EAAAK,UAAA,YAAAA,CAAA;IAAA,OAAAN,IAAA;EAAA;EAAA,OAAAA,IAAA;AAAA;AAEO,MAAMO,YAA+B,GAAG;EAC7CC,IAAI,EAAE,eAAe;EACrBC,WAAW,EAAE,2BAA2B;EACxCC,MAAM,EAAE,IAAI;EACZC,aAAa,EAAGC,OAAyB,IAAK;IAC5C,OAAO,CACL,IAAAC,sBAAS,EAACD,OAAO,CAAC,EAClB,IAAAE,sBAAW,EAACF,OAAO,CAAC,EACpB,IAAAG,sCAAmB,EAACH,OAAO,CAAC,EAC5B,IAAAI,8BAAe,EAACJ,OAAO,CAAC,EACxB,IAAAK,gBAAQ,EAACL,OAAO,CAAC,EACjB,IAAAM,gBAAQ,EAACN,OAAO,CAAC,CAClB;EACH,CAAC;EACDO,MAAM,EAAE;IACN,qBAAqB,EAAE,CAAC,CAAC;IACzB,mBAAmB,EAAE;MACnBC,GAAG,EAAE;IACP;EACF;AACF,CAAC;AAACC,OAAA,CAAAd,YAAA,GAAAA,YAAA"}
@@ -1,2 +0,0 @@
1
- import { ComponentContext } from '@teambit/generator';
2
- export declare function aspectFile({ namePascalCase: Name, componentId }: ComponentContext): string;
@@ -1,19 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.aspectFile = aspectFile;
7
- function aspectFile({
8
- namePascalCase: Name,
9
- componentId
10
- }) {
11
- return `import { Aspect } from '@teambit/harmony';
12
-
13
- export const ${Name}Aspect = Aspect.create({
14
- id: '${componentId}',
15
- });
16
- `;
17
- }
18
-
19
- //# sourceMappingURL=aspect.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["aspectFile","namePascalCase","Name","componentId"],"sources":["aspect.ts"],"sourcesContent":["import { ComponentContext } from '@teambit/generator';\n\nexport function aspectFile({ namePascalCase: Name, componentId }: ComponentContext) {\n return `import { Aspect } from '@teambit/harmony';\n\nexport const ${Name}Aspect = Aspect.create({\n id: '${componentId}',\n});\n`;\n}\n"],"mappings":";;;;;;AAEO,SAASA,UAAUA,CAAC;EAAEC,cAAc,EAAEC,IAAI;EAAEC;AAA8B,CAAC,EAAE;EAClF,OAAQ;AACV;AACA,eAAeD,IAAK;AACpB,SAASC,WAAY;AACrB;AACA,CAAC;AACD"}
@@ -1,2 +0,0 @@
1
- import { ComponentContext } from '@teambit/generator';
2
- export declare function docFile({ name, componentId }: ComponentContext): string;
@@ -1,186 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.docFile = docFile;
7
- function docFile({
8
- name,
9
- componentId
10
- }) {
11
- return `---
12
- description: 'A standard React component development environment'
13
- labels: ['react', 'typescript', 'env', 'extension']
14
- ---
15
-
16
- ## Overview
17
-
18
- A customized version which extends the default React component development environment created by teambit.
19
-
20
- This environment can be applied to all your components or a set of components via the command \`bit env set <pattern or component_id> ${componentId}\`, or under the variants of your \`workspace.json\` file.
21
- That means they will use your custom environment instead of the default environment. Environment components are just like any other Bit components in that they can be
22
- exported and then shared and used in various projects which makes it easier to create standards when working with many teams.
23
-
24
- ### Usage instructions
25
-
26
- #### Recommended usage:
27
-
28
- Run the command \`bit env set <"pattern" or component_id> ${componentId}\` where the pattern is a glob pattern to select multiple components. This will put the env
29
- config in your component's entry in the \`.bitmap\` file.
30
-
31
- :::Note - this will override any variants policy that tries to set an env for this component in the workspace.jsonc
32
- :::
33
-
34
- #### Alternative Usage
35
- Under the **variant** section of your \`workspace.json\` file choose which components you want to have the custom environment set. You can find the id of the extension in the \`${name}.aspect.ts\` file.
36
-
37
- \`\`\`json
38
- {
39
- "teambit.workspace/variants": {
40
- "{ui/**}, {pages/**}": {
41
- "${componentId}": {}
42
- }
43
- }
44
- }
45
- \`\`\`
46
-
47
- This usage may be deprecated in future in favour of the recommended usage above
48
- ## Runtime Configurations
49
-
50
- Extend the \`main.runtime\` file when you want to add custom configurations at runtime.
51
-
52
- ### Compilation
53
-
54
- By default, Component compilation is done with the TypeScript compiler. Target format is \`ES2015\` which
55
- supports execution from both NodeJS and browser runtimes for server-side rendering. You can modify the \`tsconfig.json\` file to add your own compiler options which will then be merged with the default configs set by teambit.
56
-
57
- Example:
58
-
59
- \`\`\`json
60
- {
61
- "compilerOptions": {
62
- "target": "es2017",
63
- "module": "es2015",
64
- "moduleResolution": "node",
65
- "lib": ["es2017", "dom"],
66
- "experimentalDecorators": true,
67
- "esModuleInterop": true,
68
- "outDir": "dist",
69
- "sourceMap": true,
70
- "emitDecoratorMetadata": true,
71
- "allowJs": true,
72
- "baseUrl": ".",
73
- "jsx": "react"
74
- }
75
- }
76
- \`\`\`
77
-
78
- ### Testing
79
-
80
- Component testing is done through [Jest](https://jestjs.io/) with the default \`teambit.react/react\` environment. You can modify the \`jestconfig.js\` file to add your own configurations which will then be merged with the default configs set by teambit.
81
-
82
- Example:
83
-
84
- To Override the Jest config to ignore transpiling from specific folders add this to the \`jestconfig.js\` file:
85
-
86
- \`\`\`js
87
- const reactJestConfig = require('@teambit/react/jest/jest.config');
88
- module.exports = {
89
- ...reactJestConfig,
90
- transformIgnorePatterns: ['/node_modules/(?!(prop-types|@teambit))']
91
- };
92
- \`\`\`
93
-
94
- ### Webpack
95
-
96
- Bit uses webpack 5 to bundle components. You can modify the \`webpack.config.js\` file to add your own configurations which will then be merged with the default configs set by teambit.
97
-
98
- Example:
99
-
100
- \`\`\`ts
101
- module.exports = {
102
- module: {
103
- // add your custom rules here
104
- rules: []
105
- }
106
- };
107
- \`\`\`
108
-
109
- ### ESLint
110
-
111
- Bit uses ESLint to lint your components. You can add your own rules in the \`${name}.main.runtime\` file.
112
-
113
- Example:
114
-
115
- \`\`\`ts
116
- react.useEslint({
117
- transformers: [
118
- (config) => {
119
- config.setRule('no-console', ['error']);
120
- // add more rules here
121
- return config;
122
- }
123
- ]
124
- }),
125
- \`\`\`
126
-
127
- To use ESLint:
128
-
129
- \`\`\`bash
130
- bit lint
131
- bit lint --fix
132
- \`\`\`
133
-
134
- ### Formatting
135
-
136
- Bit uses Prettier to format your components. You can add your own rules in the \`${name}.main.runtime\` file.
137
-
138
- Example:
139
-
140
- \`\`\`ts
141
- react.usePrettier({
142
- transformers: [
143
- (config) => {
144
- config.setKey('tabWidth', 2);
145
- // add more rules here
146
- return config;
147
- }
148
- ]
149
- }),
150
- \`\`\`
151
-
152
- To use Prettier:
153
-
154
- \`\`\`bash
155
- bit format --check
156
- bit format
157
- \`\`\`
158
-
159
- ### Dependencies
160
-
161
- Override the default dependencies in the \`${name}.main.runtime\` file to include react types of a different version for example.
162
-
163
- \`\`\`ts
164
- react.overrideDependencies({
165
- devDependencies: {
166
- '@types/react': '17.0.3'
167
- }
168
- });
169
- \`\`\`
170
-
171
- ## Preview Configurations
172
-
173
- Extend the \`${name}.preview.runtime\` file when you want to add your own customizations only for previewing in the Bit UI.
174
-
175
- ### Adding a Theme
176
-
177
- A custom theme has been added to the env which wraps all the composition files with the required theme so they can be developed with the correct themeing rather than the browsers default. This is added only in the preview runtime and not in the main runtime meaning it is only applied to compositions and not when consuming components. Adding a theme when consuming should be done at App level as you component may be consumed in various apps and have different themes applied depending on where it is consumed.
178
-
179
- Example:
180
-
181
- \`\`\`ts
182
- react.registerProvider([ThemeCompositions]);
183
- `;
184
- }
185
-
186
- //# sourceMappingURL=doc.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["docFile","name","componentId"],"sources":["doc.ts"],"sourcesContent":["import { ComponentContext } from '@teambit/generator';\n\nexport function docFile({ name, componentId }: ComponentContext) {\n return `---\ndescription: 'A standard React component development environment'\nlabels: ['react', 'typescript', 'env', 'extension']\n---\n\n## Overview\n\nA customized version which extends the default React component development environment created by teambit.\n\nThis environment can be applied to all your components or a set of components via the command \\`bit env set <pattern or component_id> ${componentId}\\`, or under the variants of your \\`workspace.json\\` file.\nThat means they will use your custom environment instead of the default environment. Environment components are just like any other Bit components in that they can be\nexported and then shared and used in various projects which makes it easier to create standards when working with many teams.\n\n### Usage instructions\n\n#### Recommended usage:\n\nRun the command \\`bit env set <\"pattern\" or component_id> ${componentId}\\` where the pattern is a glob pattern to select multiple components. This will put the env\nconfig in your component's entry in the \\`.bitmap\\` file.\n\n:::Note - this will override any variants policy that tries to set an env for this component in the workspace.jsonc\n:::\n\n#### Alternative Usage\nUnder the **variant** section of your \\`workspace.json\\` file choose which components you want to have the custom environment set. You can find the id of the extension in the \\`${name}.aspect.ts\\` file.\n\n\\`\\`\\`json\n{\n \"teambit.workspace/variants\": {\n \"{ui/**}, {pages/**}\": {\n \"${componentId}\": {}\n }\n }\n}\n\\`\\`\\`\n\nThis usage may be deprecated in future in favour of the recommended usage above\n## Runtime Configurations\n\nExtend the \\`main.runtime\\` file when you want to add custom configurations at runtime.\n\n### Compilation\n\nBy default, Component compilation is done with the TypeScript compiler. Target format is \\`ES2015\\` which\nsupports execution from both NodeJS and browser runtimes for server-side rendering. You can modify the \\`tsconfig.json\\` file to add your own compiler options which will then be merged with the default configs set by teambit.\n\nExample:\n\n\\`\\`\\`json\n{\n \"compilerOptions\": {\n \"target\": \"es2017\",\n \"module\": \"es2015\",\n \"moduleResolution\": \"node\",\n \"lib\": [\"es2017\", \"dom\"],\n \"experimentalDecorators\": true,\n \"esModuleInterop\": true,\n \"outDir\": \"dist\",\n \"sourceMap\": true,\n \"emitDecoratorMetadata\": true,\n \"allowJs\": true,\n \"baseUrl\": \".\",\n \"jsx\": \"react\"\n }\n}\n\\`\\`\\`\n\n### Testing\n\nComponent testing is done through [Jest](https://jestjs.io/) with the default \\`teambit.react/react\\` environment. You can modify the \\`jestconfig.js\\` file to add your own configurations which will then be merged with the default configs set by teambit.\n\nExample:\n\nTo Override the Jest config to ignore transpiling from specific folders add this to the \\`jestconfig.js\\` file:\n\n\\`\\`\\`js\nconst reactJestConfig = require('@teambit/react/jest/jest.config');\nmodule.exports = {\n ...reactJestConfig,\n transformIgnorePatterns: ['/node_modules/(?!(prop-types|@teambit))']\n};\n\\`\\`\\`\n\n### Webpack\n\nBit uses webpack 5 to bundle components. You can modify the \\`webpack.config.js\\` file to add your own configurations which will then be merged with the default configs set by teambit.\n\nExample:\n\n\\`\\`\\`ts\nmodule.exports = {\n module: {\n // add your custom rules here\n rules: []\n }\n};\n\\`\\`\\`\n\n### ESLint\n\nBit uses ESLint to lint your components. You can add your own rules in the \\`${name}.main.runtime\\` file.\n\nExample:\n\n\\`\\`\\`ts\nreact.useEslint({\n transformers: [\n (config) => {\n config.setRule('no-console', ['error']);\n // add more rules here\n return config;\n }\n ]\n}),\n\\`\\`\\`\n\nTo use ESLint:\n\n\\`\\`\\`bash\nbit lint\nbit lint --fix\n\\`\\`\\`\n\n### Formatting\n\nBit uses Prettier to format your components. You can add your own rules in the \\`${name}.main.runtime\\` file.\n\nExample:\n\n\\`\\`\\`ts\nreact.usePrettier({\n transformers: [\n (config) => {\n config.setKey('tabWidth', 2);\n // add more rules here\n return config;\n }\n ]\n}),\n\\`\\`\\`\n\nTo use Prettier:\n\n\\`\\`\\`bash\nbit format --check\nbit format\n\\`\\`\\`\n\n### Dependencies\n\nOverride the default dependencies in the \\`${name}.main.runtime\\` file to include react types of a different version for example.\n\n\\`\\`\\`ts\nreact.overrideDependencies({\n devDependencies: {\n '@types/react': '17.0.3'\n }\n});\n\\`\\`\\`\n\n## Preview Configurations\n\nExtend the \\`${name}.preview.runtime\\` file when you want to add your own customizations only for previewing in the Bit UI.\n\n### Adding a Theme\n\nA custom theme has been added to the env which wraps all the composition files with the required theme so they can be developed with the correct themeing rather than the browsers default. This is added only in the preview runtime and not in the main runtime meaning it is only applied to compositions and not when consuming components. Adding a theme when consuming should be done at App level as you component may be consumed in various apps and have different themes applied depending on where it is consumed.\n\nExample:\n\n\\`\\`\\`ts\nreact.registerProvider([ThemeCompositions]);\n`;\n}\n"],"mappings":";;;;;;AAEO,SAASA,OAAOA,CAAC;EAAEC,IAAI;EAAEC;AAA8B,CAAC,EAAE;EAC/D,OAAQ;AACV;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wIAAwIA,WAAY;AACpJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA,4DAA4DA,WAAY;AACxE;AACA;AACA;AACA;AACA;AACA;AACA,mLAAmLD,IAAK;AACxL;AACA;AACA;AACA;AACA;AACA,SAASC,WAAY;AACrB;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;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,+EAA+ED,IAAK;AACpF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mFAAmFA,IAAK;AACxF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,6CAA6CA,IAAK;AAClD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAeA,IAAK;AACpB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACD"}
@@ -1,2 +0,0 @@
1
- import { ComponentContext } from '@teambit/generator';
2
- export declare function indexFile({ namePascalCase: Name, name }: ComponentContext): string;
@@ -1,19 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.indexFile = indexFile;
7
- function indexFile({
8
- namePascalCase: Name,
9
- name
10
- }) {
11
- return `import { ${Name}Aspect } from './${name}.aspect';
12
-
13
- export type { ${Name}Main } from './${name}.main.runtime';
14
- export default ${Name}Aspect;
15
- export { ${Name}Aspect };
16
- `;
17
- }
18
-
19
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["indexFile","namePascalCase","Name","name"],"sources":["index.ts"],"sourcesContent":["import { ComponentContext } from '@teambit/generator';\n\nexport function indexFile({ namePascalCase: Name, name }: ComponentContext) {\n return `import { ${Name}Aspect } from './${name}.aspect';\n\nexport type { ${Name}Main } from './${name}.main.runtime';\nexport default ${Name}Aspect;\nexport { ${Name}Aspect };\n`;\n}\n"],"mappings":";;;;;;AAEO,SAASA,SAASA,CAAC;EAAEC,cAAc,EAAEC,IAAI;EAAEC;AAAuB,CAAC,EAAE;EAC1E,OAAQ,YAAWD,IAAK,oBAAmBC,IAAK;AAClD;AACA,gBAAgBD,IAAK,kBAAiBC,IAAK;AAC3C,iBAAiBD,IAAK;AACtB,WAAWA,IAAK;AAChB,CAAC;AACD"}
@@ -1 +0,0 @@
1
- export declare function jestConfigFile(): string;