@knapsack/renderer-react 4.69.8--canary.4745.5e5e0e5.0 → 4.69.8--canary.4746.02d415c.0
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/demo-wrapper.d.mts +1 -0
- package/dist/demo-wrapper.d.ts +1 -0
- package/dist/error-catcher.js.map +1 -1
- package/dist/error-catcher.mjs.map +1 -1
- package/dist/index.d.mts +18 -25
- package/dist/index.d.ts +18 -25
- package/dist/index.js +49 -43
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +57 -50
- package/dist/index.mjs.map +1 -1
- package/package.json +13 -13
package/dist/index.mjs
CHANGED
@@ -16,21 +16,23 @@ var __dirname = /* @__PURE__ */ getDirname();
|
|
16
16
|
|
17
17
|
// src/renderer-react.ts
|
18
18
|
import sleep from "sleep-promise";
|
19
|
-
import {
|
19
|
+
import { RendererWebpackBase } from "@knapsack/renderer-webpack-base";
|
20
20
|
import { pascalCase, isFirstLetterCapital } from "@knapsack/utils";
|
21
|
-
import { knapsackEvents, log as log2
|
21
|
+
import { knapsackEvents, log as log2 } from "@knapsack/app";
|
22
|
+
import {
|
23
|
+
babelCodeForBrowser,
|
24
|
+
createSlotOptionsHtmlTags
|
25
|
+
} from "@knapsack/app/renderers";
|
22
26
|
import {
|
23
|
-
isSlottedText,
|
24
|
-
isSlottedTemplateReference,
|
25
|
-
isSlottedTemplateDemo,
|
26
27
|
rendererIds
|
27
28
|
} from "@knapsack/types";
|
28
29
|
import {
|
29
|
-
exists,
|
30
|
+
exists as fileExists,
|
30
31
|
findUpPkgJson,
|
31
32
|
getJsExportNames as getJsExportNames2,
|
32
33
|
readFile as readFile2,
|
33
|
-
formatCode as formatCode2
|
34
|
+
formatCode as formatCode2,
|
35
|
+
resolvePath as resolvePath2
|
34
36
|
} from "@knapsack/file-utils";
|
35
37
|
import { join, relative, parse } from "path";
|
36
38
|
|
@@ -724,8 +726,7 @@ var createReactPattern = createCreator({
|
|
724
726
|
// src/renderer-react.ts
|
725
727
|
var { pkg } = findUpPkgJson(__dirname);
|
726
728
|
log2.setupUpdateNotifier({ ...pkg, name: pkg.name, version: pkg.version });
|
727
|
-
var
|
728
|
-
var KnapsackReactRenderer = class _KnapsackReactRenderer extends KnapsackRendererWebpackBase {
|
729
|
+
var KnapsackReactRenderer = class _KnapsackReactRenderer extends RendererWebpackBase {
|
729
730
|
static {
|
730
731
|
__name(this, "KnapsackReactRenderer");
|
731
732
|
}
|
@@ -734,7 +735,6 @@ var KnapsackReactRenderer = class _KnapsackReactRenderer extends KnapsackRendere
|
|
734
735
|
*/
|
735
736
|
assets;
|
736
737
|
babelConfig;
|
737
|
-
creators;
|
738
738
|
demoWrapperPath;
|
739
739
|
disableReactStrictMode;
|
740
740
|
constructor({
|
@@ -755,15 +755,15 @@ var KnapsackReactRenderer = class _KnapsackReactRenderer extends KnapsackRendere
|
|
755
755
|
this.disableReactStrictMode = disableReactStrictMode;
|
756
756
|
this.creators = [createReactPattern];
|
757
757
|
}
|
758
|
-
async
|
758
|
+
init = /* @__PURE__ */ __name(async (opt) => {
|
759
759
|
await super.init(opt);
|
760
760
|
this.assets = await copyReactAssets(this.outputDir, this.publicPath);
|
761
|
-
if (!await
|
761
|
+
if (!await fileExists(this.demoWrapperPath)) {
|
762
762
|
throw new Error(
|
763
763
|
`Could not find demo wrapper at: "${this.demoWrapperPath}"`
|
764
764
|
);
|
765
765
|
}
|
766
|
-
}
|
766
|
+
}, "init");
|
767
767
|
getMeta = /* @__PURE__ */ __name(() => ({
|
768
768
|
id: this.id,
|
769
769
|
title: "React",
|
@@ -793,18 +793,16 @@ var KnapsackReactRenderer = class _KnapsackReactRenderer extends KnapsackRendere
|
|
793
793
|
}
|
794
794
|
}
|
795
795
|
}), "getMeta");
|
796
|
-
changeCase(str)
|
797
|
-
|
798
|
-
}
|
799
|
-
createWebpackConfig() {
|
796
|
+
changeCase = /* @__PURE__ */ __name((str) => pascalCase(str), "changeCase");
|
797
|
+
createWebpackConfig = /* @__PURE__ */ __name(() => {
|
800
798
|
const config = super.createWebpackConfig();
|
801
799
|
config.externals = {
|
802
800
|
react: "React",
|
803
801
|
"react-dom": "ReactDOM"
|
804
802
|
};
|
805
803
|
return config;
|
806
|
-
}
|
807
|
-
getJsImports() {
|
804
|
+
}, "createWebpackConfig");
|
805
|
+
getJsImports = /* @__PURE__ */ __name(() => {
|
808
806
|
const imports = super.getJsImports();
|
809
807
|
imports.push(
|
810
808
|
{
|
@@ -825,7 +823,7 @@ var KnapsackReactRenderer = class _KnapsackReactRenderer extends KnapsackRendere
|
|
825
823
|
}
|
826
824
|
);
|
827
825
|
return imports;
|
828
|
-
}
|
826
|
+
}, "getJsImports");
|
829
827
|
async prepClientRenderResults({
|
830
828
|
usage,
|
831
829
|
demoApp,
|
@@ -950,7 +948,7 @@ ${renderReact.name}({
|
|
950
948
|
let codeHadError = false;
|
951
949
|
let errorHtmlMsg = "";
|
952
950
|
try {
|
953
|
-
code = await
|
951
|
+
code = await babelCodeForBrowser({
|
954
952
|
code
|
955
953
|
});
|
956
954
|
} catch (e) {
|
@@ -1002,18 +1000,24 @@ ${errorHtmlMsg}
|
|
1002
1000
|
templateLanguage: this.language
|
1003
1001
|
};
|
1004
1002
|
}
|
1005
|
-
async
|
1006
|
-
if (
|
1003
|
+
render = /* @__PURE__ */ __name(async (opt) => {
|
1004
|
+
if (opt.demo?.type === "template") {
|
1007
1005
|
const waits = [5, 10, 20, 50, 100, 1e3, 1e3];
|
1008
1006
|
let templateDemoPath;
|
1009
1007
|
let attempt = 0;
|
1010
1008
|
while (true) {
|
1011
1009
|
try {
|
1012
|
-
|
1013
|
-
|
1014
|
-
|
1015
|
-
|
1010
|
+
const { absolutePath, exists } = await resolvePath2({
|
1011
|
+
path: opt.demo.templateInfo.path,
|
1012
|
+
pkgPathAliases: this.pkgPathAliases,
|
1013
|
+
resolveFromDir: this.dataDir
|
1016
1014
|
});
|
1015
|
+
if (!exists) {
|
1016
|
+
throw new Error(
|
1017
|
+
`Template demo file does not exist: ${absolutePath}`
|
1018
|
+
);
|
1019
|
+
}
|
1020
|
+
templateDemoPath = absolutePath;
|
1017
1021
|
break;
|
1018
1022
|
} catch (e) {
|
1019
1023
|
const waitTime = waits[attempt];
|
@@ -1039,7 +1043,7 @@ ${errorHtmlMsg}
|
|
1039
1043
|
});
|
1040
1044
|
return results;
|
1041
1045
|
}
|
1042
|
-
if (
|
1046
|
+
if (opt.demo?.type === "data") {
|
1043
1047
|
const { usage, imports } = await this.getUsageAndImports(opt);
|
1044
1048
|
const { code: importCode } = this.createJsImportCodeBlock({
|
1045
1049
|
imports
|
@@ -1060,10 +1064,14 @@ ${errorHtmlMsg}
|
|
1060
1064
|
renderOptions: opt
|
1061
1065
|
});
|
1062
1066
|
}
|
1063
|
-
}
|
1064
|
-
async
|
1065
|
-
|
1066
|
-
|
1067
|
+
}, "render");
|
1068
|
+
getUsageAndImports = /* @__PURE__ */ __name(async ({
|
1069
|
+
pattern,
|
1070
|
+
template,
|
1071
|
+
patternManifest,
|
1072
|
+
demo
|
1073
|
+
}) => {
|
1074
|
+
if (demo?.type && demo.type === "data") {
|
1067
1075
|
const {
|
1068
1076
|
data: { props, slots, slotsOptionsComputed }
|
1069
1077
|
} = demo;
|
@@ -1087,16 +1095,16 @@ ${errorHtmlMsg}
|
|
1087
1095
|
const slotItems = slots[slotName];
|
1088
1096
|
const slotItemsUsages = await Promise.all(
|
1089
1097
|
slotItems.filter((slotItem) => {
|
1090
|
-
if (
|
1098
|
+
if (slotItem.type !== "text") {
|
1091
1099
|
if (!slotItem.patternId) return false;
|
1092
1100
|
if (!slotItem.templateId) return false;
|
1093
|
-
if (
|
1101
|
+
if (slotItem.type === "template-demo" && !slotItem.demoId) {
|
1094
1102
|
return false;
|
1095
1103
|
}
|
1096
1104
|
}
|
1097
1105
|
return true;
|
1098
1106
|
}).map(async (slotItem) => {
|
1099
|
-
if (
|
1107
|
+
if (slotItem.type === "text") {
|
1100
1108
|
if (slotItems.length === 1 && slotName !== "children") {
|
1101
1109
|
return `\`${slotItem.text}\``;
|
1102
1110
|
}
|
@@ -1108,7 +1116,7 @@ ${errorHtmlMsg}
|
|
1108
1116
|
const slotTemplate = slotPattern.templates.find(
|
1109
1117
|
(t) => t.id === slotItem.templateId
|
1110
1118
|
);
|
1111
|
-
if (
|
1119
|
+
if (slotItem.type === "template-reference") {
|
1112
1120
|
const { usage: usage2, imports } = await this.getUsageAndImports({
|
1113
1121
|
pattern: slotPattern,
|
1114
1122
|
template: slotTemplate,
|
@@ -1117,7 +1125,7 @@ ${errorHtmlMsg}
|
|
1117
1125
|
importInfos.push(...imports);
|
1118
1126
|
return usage2;
|
1119
1127
|
}
|
1120
|
-
if (
|
1128
|
+
if (slotItem.type === "template-demo") {
|
1121
1129
|
const { usage: usage2, imports } = await this.getUsageAndImports({
|
1122
1130
|
pattern: slotPattern,
|
1123
1131
|
template: slotTemplate,
|
@@ -1188,7 +1196,7 @@ ${errorHtmlMsg}
|
|
1188
1196
|
imports: importInfos
|
1189
1197
|
};
|
1190
1198
|
}
|
1191
|
-
if (demo?.type &&
|
1199
|
+
if (demo?.type && demo.type === "template") {
|
1192
1200
|
const importInfo = this.getJsImport({
|
1193
1201
|
patternId: pattern.id,
|
1194
1202
|
templateId: template.id,
|
@@ -1232,11 +1240,7 @@ ${errorHtmlMsg}
|
|
1232
1240
|
demo
|
1233
1241
|
)}`
|
1234
1242
|
);
|
1235
|
-
}
|
1236
|
-
async getUsage(opt) {
|
1237
|
-
const { usage } = await this.getUsageAndImports(opt);
|
1238
|
-
return usage;
|
1239
|
-
}
|
1243
|
+
}, "getUsageAndImports");
|
1240
1244
|
inferSpec = /* @__PURE__ */ __name(async ({
|
1241
1245
|
template,
|
1242
1246
|
templatePath
|
@@ -1255,12 +1259,12 @@ ${errorHtmlMsg}
|
|
1255
1259
|
}
|
1256
1260
|
return spec;
|
1257
1261
|
}, "inferSpec");
|
1258
|
-
async
|
1259
|
-
|
1262
|
+
watch = /* @__PURE__ */ __name(async (opt) => {
|
1263
|
+
super.watch(opt);
|
1260
1264
|
knapsackEvents.onPatternTemplateChanged(() => {
|
1261
1265
|
clearInferSpecCache();
|
1262
1266
|
});
|
1263
|
-
}
|
1267
|
+
}, "watch");
|
1264
1268
|
getTemplateMeta = /* @__PURE__ */ __name(async ({
|
1265
1269
|
pattern,
|
1266
1270
|
template
|
@@ -1303,7 +1307,10 @@ ${errorHtmlMsg}
|
|
1303
1307
|
}
|
1304
1308
|
return files;
|
1305
1309
|
}, "getTemplateMeta");
|
1306
|
-
alterTemplateMetaFiles = /* @__PURE__ */ __name(async ({
|
1310
|
+
alterTemplateMetaFiles = /* @__PURE__ */ __name(async ({
|
1311
|
+
files,
|
1312
|
+
metaDir
|
1313
|
+
}) => {
|
1307
1314
|
const imports = [];
|
1308
1315
|
const ext = ".spec.d.ts";
|
1309
1316
|
files.forEach((file) => {
|
@@ -1330,9 +1337,9 @@ ${errorHtmlMsg}
|
|
1330
1337
|
}
|
1331
1338
|
];
|
1332
1339
|
}, "alterTemplateMetaFiles");
|
1333
|
-
async
|
1340
|
+
getTemplateSuggestions = /* @__PURE__ */ __name(async ({
|
1334
1341
|
newPath
|
1335
|
-
}) {
|
1342
|
+
}) => {
|
1336
1343
|
const { data: dataDir } = this.patterns.userConfig;
|
1337
1344
|
const { allTemplateDemos, allTemplates } = this.getMyTemplates();
|
1338
1345
|
const usedSuggestions = [
|
@@ -1383,7 +1390,7 @@ ${errorHtmlMsg}
|
|
1383
1390
|
return {
|
1384
1391
|
suggestions
|
1385
1392
|
};
|
1386
|
-
}
|
1393
|
+
}, "getTemplateSuggestions");
|
1387
1394
|
};
|
1388
1395
|
export {
|
1389
1396
|
KnapsackReactRenderer
|