@zohodesk/react-cli 1.1.19-exp.15 → 1.1.19-exp.16

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.
package/docs/ReactLive.md CHANGED
@@ -11,4 +11,8 @@
11
11
 
12
12
  # v1.1.2 update:
13
13
 
14
- * ReactLiveConverter filepath changed to 'reactLiveConverter.js' in docLoader file
14
+ * ReactLiveConverter filepath changed to 'reactLiveConverter.js' in docLoader file
15
+
16
+ # v1.1.20 update:
17
+
18
+ * enhancedReactLiveConverter.js added and imported in docLoader file
@@ -6,7 +6,7 @@ var _getOptions = _interopRequireDefault(require("../utils/getOptions.js"));
6
6
 
7
7
  var _path = _interopRequireDefault(require("path"));
8
8
 
9
- var _reactLiveConvertor = require("./reactLiveConvertor");
9
+ var _enhancedReactLiveConverter = require("./enhancedReactLiveConverter.js");
10
10
 
11
11
  var _markdownLoader = require("./markdownLoader.js");
12
12
 
@@ -27,7 +27,7 @@ module.exports = function (source) {
27
27
  const src = _fs.default.readFileSync(originalFilePath).toString();
28
28
 
29
29
  options.docs.enableMDParser && (source = (0, _markdownLoader.markdownParser)(source));
30
- options.docs.enableReactLive && (source = (0, _reactLiveConvertor.reactLiveConvertor)(source, originalFilePath)); //to Enable the ReactLive Converter
30
+ options.docs.enableReactLive && (source = (0, _enhancedReactLiveConverter.enhancedReactLiveConverter)(source, originalFilePath)); //to Enable the ReactLive Converter
31
31
 
32
32
  return `${source};${name}.source=${JSON.stringify(src)};${name}.filePath=${JSON.stringify(filePath)}`;
33
33
  };
@@ -0,0 +1,151 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.enhancedReactLiveConverter = enhancedReactLiveConverter;
7
+
8
+ const parser = require('@babel/parser');
9
+
10
+ const traverse = require('@babel/traverse').default;
11
+
12
+ const t = require("@babel/types");
13
+
14
+ const path = require('path');
15
+
16
+ function getFilename(originalFilePath) {
17
+ const [fileName] = path.basename(originalFilePath).split('.');
18
+ return fileName;
19
+ }
20
+
21
+ function convertKeyToValue(object = {}) {
22
+ let keys = Object.keys(object);
23
+ let values = Object.values(object);
24
+ return keys.reduce((value, item, i) => {
25
+ if (item.includes(',')) {
26
+ item = item.replace(/{|}/g, "");
27
+ item = '{ ' + item + ' }';
28
+ }
29
+
30
+ value = value + "'" + values[i] + "'" + ": " + item + ",";
31
+ return value;
32
+ }, '');
33
+ }
34
+
35
+ function mergeDuplicateValues(obj) {
36
+ let mergedObj = {};
37
+
38
+ for (let key in obj) {
39
+ if (obj.hasOwnProperty(key)) {
40
+ let value = obj[key];
41
+ let existingKey = Object.keys(mergedObj).find(k => mergedObj[k] === value);
42
+
43
+ if (existingKey) {
44
+ mergedObj[existingKey + ' , ' + key] = value;
45
+ delete mergedObj[existingKey];
46
+ } else {
47
+ mergedObj[key] = value;
48
+ }
49
+ }
50
+ }
51
+
52
+ return mergedObj;
53
+ }
54
+
55
+ function enhancedReactLiveConverter(source, originalFilePath) {
56
+ const fileName = getFilename(originalFilePath);
57
+
58
+ if (!source) {
59
+ return '';
60
+ }
61
+
62
+ let docCode = '';
63
+ const fileContent = source.replace(/[\s\r\n]*$/, '');
64
+ const ast = parser.parse(fileContent, {
65
+ sourceType: 'module',
66
+ plugins: ['jsx', 'classProperties']
67
+ });
68
+
69
+ function createImportStatements(input) {
70
+ let output = '';
71
+
72
+ for (const key in input) {
73
+ if (input.hasOwnProperty(key) && key !== 'React') {
74
+ output += `import ${key} from '${input[key]}';\n`;
75
+ }
76
+ }
77
+
78
+ return output;
79
+ }
80
+
81
+ const importBlock = {};
82
+ const printableCode = {};
83
+ let remainingBlock = ''; // Traverse the AST and find the import and export blocks
84
+
85
+ let remainingCode = ast.program.body.filter(node => node.type !== 'ImportDeclaration').filter(node => node.type !== 'ExpressionStatement').map(node => fileContent.substring(node.start, node.end)).join('').trim();
86
+ traverse(ast, {
87
+ ImportDeclaration(path) {
88
+ path.node.specifiers.map(specifier => {
89
+ if (t.isImportSpecifier(specifier)) {
90
+ importBlock[`{ ${specifier.local.name} }`] = path.node.source.value;
91
+ printableCode[`{ ${specifier.local.name} }`] = path.node.source.value;
92
+ return `{'${specifier.imported.name}': ${specifier.local.name}}`;
93
+ } else if (t.isImportDefaultSpecifier(specifier)) {
94
+ importBlock[`${specifier.local.name}`] = `${path.node.source.value}`;
95
+ printableCode[`${specifier.local.name}`] = `${path.node.source.value} `;
96
+ return specifier.local.name;
97
+ }
98
+ }).join(", ");
99
+ },
100
+
101
+ ExpressionStatement(path) {
102
+ const expression = path.get('expression');
103
+ const expressionLeft = expression.get('left');
104
+
105
+ if (path.isExpressionStatement() && expression.isAssignmentExpression() && expressionLeft.isMemberExpression()) {
106
+ const docCheck = expressionLeft.toString();
107
+
108
+ if (docCheck === `${fileName}.docs`) {
109
+ docCode = expression.toString();
110
+ } else if (docCheck.includes(fileName)) {
111
+ const startIndex = path.node.start;
112
+ const endIndex = path.node.end;
113
+ remainingBlock += fileContent.slice(startIndex, endIndex);
114
+ }
115
+ }
116
+ }
117
+
118
+ });
119
+ remainingCode = remainingCode.replace(/__DOCS__/, true);
120
+ remainingCode = remainingCode.replace(/`/g, '\\`').replace(/\$\{/g, '$\\{');
121
+ remainingBlock = remainingBlock.replace(/`/g, '\\`').replace(/\$\{/g, '$\\{');
122
+ const addBractick = `\`
123
+ ${createImportStatements(printableCode)}
124
+ ${remainingCode}
125
+
126
+ ${remainingBlock}\`
127
+ `;
128
+ const template = `
129
+
130
+ ${createImportStatements(importBlock)}
131
+
132
+ import { LiveProviderv3, LiveEditorv3, LiveErrorv3, LivePreviewv3, Wrapper, EditorWrapper , ErrorWrapper, PreviewWrapper } from '@zohodesk-private/react-live/es/index'
133
+
134
+ export default class ${fileName} extends React.Component{
135
+ render(){
136
+ return(
137
+ <LiveProviderv3 needToolBox scope={{import: {${convertKeyToValue(mergeDuplicateValues(printableCode))}}}} code={${addBractick}}>
138
+ <Wrapper>
139
+ <EditorWrapper><LiveEditorv3 /></EditorWrapper>
140
+ <PreviewWrapper><LivePreviewv3 /></PreviewWrapper>
141
+ <LiveErrorv3 needStyle />
142
+ </Wrapper>
143
+ </LiveProviderv3>
144
+ )
145
+ }
146
+ }
147
+
148
+ ${docCode}
149
+ `;
150
+ return template;
151
+ }
@@ -237,7 +237,7 @@ const getProdPlugins = (options, publicPath = '') => {
237
237
  if (bundleAnalyze) {
238
238
  pluginsArr.push(new _webpackBundleAnalyzer.BundleAnalyzerPlugin({
239
239
  analyzerMode: 'static',
240
- generateStatsFile: !enableStats,
240
+ generateStatsFile: false,
241
241
  openAnalyzer: false,
242
242
  statsOptions: enableStats ? null : {
243
243
  source: false,
@@ -228,10 +228,7 @@ class I18nDownlodLogic {
228
228
  if(dataSrc === srcPath || dataSrc === fullsrcPath){ return resolve();}
229
229
  }
230
230
  var scriptTag = document.createElement("script");
231
- scriptTag.onload = () => {
232
- resolve();
233
- scriptTag.onerror = scriptTag.onload = null;
234
- };
231
+ scriptTag.onload = resolve;
235
232
  scriptTag.onerror = function(event) {
236
233
  var request = event && event.target && event.target.src || fullsrcPath;
237
234
  var err = new Error("Loading I18N chunk " + chunkId + " failed.\\n(" + request + ")");
@@ -240,7 +237,6 @@ class I18nDownlodLogic {
240
237
  delete installedI18nChunks[chunkId];
241
238
  scriptTag.parentNode.removeChild(scriptTag);
242
239
  reject(err);
243
- scriptTag.onerror = scriptTag.onload = null;
244
240
  };
245
241
  ${mainTemplate.requireFn}.nc && scriptTag.setAttribute("nonce", ${mainTemplate.requireFn}.nc);
246
242
  scriptTag.src = fullsrcPath;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zohodesk/react-cli",
3
- "version": "1.1.19-exp.15",
3
+ "version": "1.1.19-exp.16",
4
4
  "description": "A CLI tool for build modern web application and libraries",
5
5
  "scripts": {
6
6
  "init": "node ./lib/utils/init.js",