@sitecore-content-sdk/nextjs 0.1.0-beta.16 → 0.1.0-beta.17
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/component-props-loader.d.ts +1 -0
- package/component-props-loader.js +3 -0
- package/dist/cjs/tools/component-props.loader.js +101 -0
- package/dist/cjs/tools/index.js +19 -1
- package/dist/cjs/tools/templating/generate-component-builder.js +71 -0
- package/dist/cjs/tools/templating/index.js +7 -0
- package/dist/cjs/tools/templating/templates/component-builder.js +59 -0
- package/dist/cjs/tools/templating/utils.js +18 -0
- package/dist/esm/tools/component-props.loader.js +65 -0
- package/dist/esm/tools/index.js +2 -1
- package/dist/esm/tools/templating/generate-component-builder.js +63 -0
- package/dist/esm/tools/templating/index.js +2 -0
- package/dist/esm/tools/templating/templates/component-builder.js +55 -0
- package/dist/esm/tools/templating/utils.js +12 -0
- package/package.json +6 -5
- package/types/editing/editing-config-middleware.d.ts +1 -1
- package/types/tools/component-props.loader.d.ts +7 -0
- package/types/tools/index.d.ts +2 -1
- package/types/tools/templating/generate-component-builder.d.ts +45 -0
- package/types/tools/templating/index.d.ts +2 -0
- package/types/tools/templating/templates/component-builder.d.ts +7 -0
- package/types/tools/templating/utils.d.ts +6 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './types/tools/component-props.loader';
|
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || (function () {
|
|
19
|
+
var ownKeys = function(o) {
|
|
20
|
+
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
21
|
+
var ar = [];
|
|
22
|
+
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
23
|
+
return ar;
|
|
24
|
+
};
|
|
25
|
+
return ownKeys(o);
|
|
26
|
+
};
|
|
27
|
+
return function (mod) {
|
|
28
|
+
if (mod && mod.__esModule) return mod;
|
|
29
|
+
var result = {};
|
|
30
|
+
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
31
|
+
__setModuleDefault(result, mod);
|
|
32
|
+
return result;
|
|
33
|
+
};
|
|
34
|
+
})();
|
|
35
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
|
+
exports.default = componentPropsLoader;
|
|
37
|
+
const recast = __importStar(require("recast"));
|
|
38
|
+
/**
|
|
39
|
+
* Webpack loader to strip functions from the source code
|
|
40
|
+
* Strips the `getServerSideProps` and `getStaticProps` functions from the source code
|
|
41
|
+
* @param {string} source file source code
|
|
42
|
+
* @returns {string} output file source code with stripped functions
|
|
43
|
+
*/
|
|
44
|
+
function componentPropsLoader(source) {
|
|
45
|
+
// Parse the source code into an AST (Abstract Syntax Tree)
|
|
46
|
+
const ast = recast.parse(source, {
|
|
47
|
+
parser: require('recast/parsers/babel-ts'),
|
|
48
|
+
});
|
|
49
|
+
// List of functions to strip from the AST
|
|
50
|
+
const functionsToStrip = ['getServerSideProps', 'getStaticProps'];
|
|
51
|
+
// Remove the function from the list of functions to strip
|
|
52
|
+
const updateList = (functionName) => {
|
|
53
|
+
// Remove the function from the list of functions to strip
|
|
54
|
+
functionsToStrip.splice(functionsToStrip.indexOf(functionName), 1);
|
|
55
|
+
};
|
|
56
|
+
// Traverse the AST and strip the functions
|
|
57
|
+
recast.visit(ast, {
|
|
58
|
+
// Visit the named export function expression
|
|
59
|
+
visitExportNamedDeclaration: function (path) {
|
|
60
|
+
var _a, _b;
|
|
61
|
+
// Get the variable declaration from the AST
|
|
62
|
+
(_b = (_a = path.node.declaration) === null || _a === void 0 ? void 0 : _a.declarations) === null || _b === void 0 ? void 0 : _b.forEach((declaration) => {
|
|
63
|
+
// Check if the function is in the list of functions to strip
|
|
64
|
+
if ('id' in declaration &&
|
|
65
|
+
'name' in declaration.id &&
|
|
66
|
+
typeof declaration.id.name === 'string' &&
|
|
67
|
+
functionsToStrip.includes(declaration.id.name)) {
|
|
68
|
+
updateList(declaration.id.name);
|
|
69
|
+
// Strip the function from the AST
|
|
70
|
+
path.prune();
|
|
71
|
+
}
|
|
72
|
+
});
|
|
73
|
+
if (functionsToStrip.length === 0) {
|
|
74
|
+
// We have pruned all the functions we need to, so we can stop traversing the AST
|
|
75
|
+
return false;
|
|
76
|
+
}
|
|
77
|
+
// Continue traversing the AST
|
|
78
|
+
this.traverse(path);
|
|
79
|
+
},
|
|
80
|
+
// Visit the named export function declaration
|
|
81
|
+
visitFunctionDeclaration: function (path) {
|
|
82
|
+
// Check if the function is in the list of functions to strip
|
|
83
|
+
if (path.node.id &&
|
|
84
|
+
'name' in path.node.id &&
|
|
85
|
+
typeof path.node.id.name === 'string' &&
|
|
86
|
+
functionsToStrip.includes(path.node.id.name)) {
|
|
87
|
+
updateList(path.node.id.name);
|
|
88
|
+
// Strip the function from the AST
|
|
89
|
+
path.prune();
|
|
90
|
+
}
|
|
91
|
+
if (functionsToStrip.length === 0) {
|
|
92
|
+
// We have pruned all the functions we need to, so we can stop traversing the AST
|
|
93
|
+
return false;
|
|
94
|
+
}
|
|
95
|
+
// Continue traversing the AST
|
|
96
|
+
this.traverse(path);
|
|
97
|
+
},
|
|
98
|
+
});
|
|
99
|
+
// Generate the output code
|
|
100
|
+
return recast.print(ast).code;
|
|
101
|
+
}
|
package/dist/cjs/tools/index.js
CHANGED
|
@@ -1,6 +1,24 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
+
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
+
};
|
|
2
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.generateMetadata = exports.generateSites = void 0;
|
|
17
|
+
exports.ModuleType = exports.generatePlugins = exports.getComponentList = exports.generateMetadata = exports.generateSites = void 0;
|
|
4
18
|
var tools_1 = require("@sitecore-content-sdk/core/tools");
|
|
5
19
|
Object.defineProperty(exports, "generateSites", { enumerable: true, get: function () { return tools_1.generateSites; } });
|
|
6
20
|
Object.defineProperty(exports, "generateMetadata", { enumerable: true, get: function () { return tools_1.generateMetadata; } });
|
|
21
|
+
Object.defineProperty(exports, "getComponentList", { enumerable: true, get: function () { return tools_1.getComponentList; } });
|
|
22
|
+
Object.defineProperty(exports, "generatePlugins", { enumerable: true, get: function () { return tools_1.generatePlugins; } });
|
|
23
|
+
Object.defineProperty(exports, "ModuleType", { enumerable: true, get: function () { return tools_1.ModuleType; } });
|
|
24
|
+
__exportStar(require("./templating"), exports);
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.generateComponentBuilder = generateComponentBuilder;
|
|
7
|
+
exports.watchComponentBuilder = watchComponentBuilder;
|
|
8
|
+
exports.writeComponentBuilder = writeComponentBuilder;
|
|
9
|
+
const path_1 = __importDefault(require("path"));
|
|
10
|
+
const fs_1 = __importDefault(require("fs"));
|
|
11
|
+
const component_builder_1 = require("./templates/component-builder");
|
|
12
|
+
const tools_1 = require("@sitecore-content-sdk/core/tools");
|
|
13
|
+
const utils_1 = require("./utils");
|
|
14
|
+
// Default destination path for component builder
|
|
15
|
+
const defaultComponentBuilderOutputPath = 'src/temp/componentBuilder.ts';
|
|
16
|
+
const defaultComponentRootPath = 'src/components';
|
|
17
|
+
/**
|
|
18
|
+
* Generate component builder based on provided settings
|
|
19
|
+
* @param {object} [settings] settings for component builder generation
|
|
20
|
+
* @param {string} [settings.componentRootPath] path to components root
|
|
21
|
+
* @param {string} [settings.componentBuilderOutputPath] path to component builder output
|
|
22
|
+
* @param {PackageDefinition[]} [settings.packages] list of packages to include in component builder
|
|
23
|
+
* @param {ComponentFile[]} [settings.components] list of components to include in component builder
|
|
24
|
+
* @param {boolean} [settings.watch] whether to watch for changes to component builder sources
|
|
25
|
+
*/
|
|
26
|
+
function generateComponentBuilder({ componentRootPath = defaultComponentRootPath, componentBuilderOutputPath = defaultComponentBuilderOutputPath, packages = [], components = [], watch, } = {}) {
|
|
27
|
+
if (watch) {
|
|
28
|
+
watchComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components });
|
|
29
|
+
}
|
|
30
|
+
else {
|
|
31
|
+
writeComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components });
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
/**
|
|
35
|
+
* Watch for changes to component builder sources
|
|
36
|
+
* @param {object} settings settings for component builder generation
|
|
37
|
+
* @param {string} settings.componentRootPath path to components root
|
|
38
|
+
* @param {string} settings.componentBuilderOutputPath path to component builder output
|
|
39
|
+
* @param {PackageDefinition[]} settings.packages list of packages to include in component builder
|
|
40
|
+
* @param {ComponentFile[]} settings.components list of components to include in component builder
|
|
41
|
+
*/
|
|
42
|
+
function watchComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, }) {
|
|
43
|
+
console.log(`Watching for changes to component builder sources in ${componentRootPath}...`);
|
|
44
|
+
(0, utils_1.watchItems)([componentRootPath], writeComponentBuilder.bind(null, {
|
|
45
|
+
componentRootPath,
|
|
46
|
+
componentBuilderOutputPath,
|
|
47
|
+
packages,
|
|
48
|
+
components,
|
|
49
|
+
}));
|
|
50
|
+
}
|
|
51
|
+
/**
|
|
52
|
+
* Write component builder to file
|
|
53
|
+
* @param {object} settings settings for component builder generation
|
|
54
|
+
* @param {string} settings.componentRootPath path to components root
|
|
55
|
+
* @param {string} settings.componentBuilderOutputPath path to component builder output
|
|
56
|
+
* @param {PackageDefinition[]} settings.packages list of packages to include in component builder
|
|
57
|
+
* @param {ComponentFile[]} settings.components list of components to include in component builder
|
|
58
|
+
*/
|
|
59
|
+
function writeComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, }) {
|
|
60
|
+
const items = [
|
|
61
|
+
...packages,
|
|
62
|
+
...components,
|
|
63
|
+
...(0, tools_1.getComponentList)(componentRootPath),
|
|
64
|
+
];
|
|
65
|
+
const componentBuilderPath = path_1.default.resolve(componentBuilderOutputPath);
|
|
66
|
+
const fileContent = (0, component_builder_1.getComponentBuilderTemplate)(items);
|
|
67
|
+
console.log(`Writing component builder to ${componentBuilderPath}`);
|
|
68
|
+
fs_1.default.writeFileSync(componentBuilderPath, fileContent, {
|
|
69
|
+
encoding: 'utf8',
|
|
70
|
+
});
|
|
71
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.getComponentBuilderTemplate = exports.generateComponentBuilder = void 0;
|
|
4
|
+
var generate_component_builder_1 = require("./generate-component-builder");
|
|
5
|
+
Object.defineProperty(exports, "generateComponentBuilder", { enumerable: true, get: function () { return generate_component_builder_1.generateComponentBuilder; } });
|
|
6
|
+
var component_builder_1 = require("./templates/component-builder");
|
|
7
|
+
Object.defineProperty(exports, "getComponentBuilderTemplate", { enumerable: true, get: function () { return component_builder_1.getComponentBuilderTemplate; } });
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.getComponentBuilderTemplate = void 0;
|
|
4
|
+
const isLazyLoadingModule = (componentPath) => componentPath.includes('.dynamic');
|
|
5
|
+
const removeDynamicModuleNameEnding = (moduleName) => moduleName.replace(/\.?dynamic$/i, '');
|
|
6
|
+
/**
|
|
7
|
+
* Generate component builder template
|
|
8
|
+
* @param {(PackageDefinition | ComponentFile)[]} components components to include in component builder
|
|
9
|
+
* @returns generated component builder template
|
|
10
|
+
*/
|
|
11
|
+
const getComponentBuilderTemplate = (components) => {
|
|
12
|
+
const componentFiles = components.filter((component) => component.componentName);
|
|
13
|
+
const packages = components.filter((component) => component.components);
|
|
14
|
+
const hasLazyModules = componentFiles.find((component) => isLazyLoadingModule(component.path));
|
|
15
|
+
return `/* eslint-disable */
|
|
16
|
+
// Do not edit this file, it is auto-generated at build time!
|
|
17
|
+
// See scripts/generate-component-builder/index.ts to modify the generation of this file.
|
|
18
|
+
|
|
19
|
+
${hasLazyModules ? "import dynamic from 'next/dynamic';" : ''}
|
|
20
|
+
import { ComponentBuilder } from '@sitecore-content-sdk/nextjs';
|
|
21
|
+
|
|
22
|
+
${packages
|
|
23
|
+
.map((pkg) => {
|
|
24
|
+
const list = pkg.components.map((c) => c.moduleName).join(', ');
|
|
25
|
+
return `import { ${list} } from '${pkg.name}';\n`;
|
|
26
|
+
})
|
|
27
|
+
.join('')}
|
|
28
|
+
${componentFiles
|
|
29
|
+
.map((component) => {
|
|
30
|
+
if (isLazyLoadingModule(component.path)) {
|
|
31
|
+
const moduleName = removeDynamicModuleNameEnding(component.moduleName);
|
|
32
|
+
return `const ${moduleName} = {
|
|
33
|
+
module: () => import('${component.path}'),
|
|
34
|
+
element: (isEditing?: boolean) => isEditing ? require('${component.path}')?.default : dynamic(${moduleName}.module)
|
|
35
|
+
}`;
|
|
36
|
+
}
|
|
37
|
+
return `import * as ${component.moduleName} from '${component.path}';`;
|
|
38
|
+
})
|
|
39
|
+
.join('\n')}
|
|
40
|
+
|
|
41
|
+
export const components = new Map();
|
|
42
|
+
${packages
|
|
43
|
+
.map((p) => p.components.map((component) => `components.set('${component.componentName}', ${component.moduleName});\n`))
|
|
44
|
+
.flat()
|
|
45
|
+
.join('')}
|
|
46
|
+
${componentFiles
|
|
47
|
+
.map((component) => `components.set('${isLazyLoadingModule(component.path)
|
|
48
|
+
? removeDynamicModuleNameEnding(component.componentName)
|
|
49
|
+
: component.componentName}', ${isLazyLoadingModule(component.path)
|
|
50
|
+
? removeDynamicModuleNameEnding(component.moduleName)
|
|
51
|
+
: component.moduleName});`)
|
|
52
|
+
.join('\n')}
|
|
53
|
+
|
|
54
|
+
export const componentBuilder = new ComponentBuilder({ components });
|
|
55
|
+
|
|
56
|
+
export const moduleFactory = componentBuilder.getModuleFactory();
|
|
57
|
+
`;
|
|
58
|
+
};
|
|
59
|
+
exports.getComponentBuilderTemplate = getComponentBuilderTemplate;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.watchItems = watchItems;
|
|
7
|
+
const chokidar_1 = __importDefault(require("chokidar"));
|
|
8
|
+
/**
|
|
9
|
+
* Run watch mode, watching on @var paths
|
|
10
|
+
* @param {string[]} paths paths to watch by chokidar
|
|
11
|
+
* @param {Function<void>} cb callback to run on file change
|
|
12
|
+
*/
|
|
13
|
+
function watchItems(paths, cb) {
|
|
14
|
+
chokidar_1.default
|
|
15
|
+
.watch(paths, { ignoreInitial: true, awaitWriteFinish: true })
|
|
16
|
+
.on('add', cb)
|
|
17
|
+
.on('unlink', cb);
|
|
18
|
+
}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import * as recast from 'recast';
|
|
2
|
+
/**
|
|
3
|
+
* Webpack loader to strip functions from the source code
|
|
4
|
+
* Strips the `getServerSideProps` and `getStaticProps` functions from the source code
|
|
5
|
+
* @param {string} source file source code
|
|
6
|
+
* @returns {string} output file source code with stripped functions
|
|
7
|
+
*/
|
|
8
|
+
export default function componentPropsLoader(source) {
|
|
9
|
+
// Parse the source code into an AST (Abstract Syntax Tree)
|
|
10
|
+
const ast = recast.parse(source, {
|
|
11
|
+
parser: require('recast/parsers/babel-ts'),
|
|
12
|
+
});
|
|
13
|
+
// List of functions to strip from the AST
|
|
14
|
+
const functionsToStrip = ['getServerSideProps', 'getStaticProps'];
|
|
15
|
+
// Remove the function from the list of functions to strip
|
|
16
|
+
const updateList = (functionName) => {
|
|
17
|
+
// Remove the function from the list of functions to strip
|
|
18
|
+
functionsToStrip.splice(functionsToStrip.indexOf(functionName), 1);
|
|
19
|
+
};
|
|
20
|
+
// Traverse the AST and strip the functions
|
|
21
|
+
recast.visit(ast, {
|
|
22
|
+
// Visit the named export function expression
|
|
23
|
+
visitExportNamedDeclaration: function (path) {
|
|
24
|
+
var _a, _b;
|
|
25
|
+
// Get the variable declaration from the AST
|
|
26
|
+
(_b = (_a = path.node.declaration) === null || _a === void 0 ? void 0 : _a.declarations) === null || _b === void 0 ? void 0 : _b.forEach((declaration) => {
|
|
27
|
+
// Check if the function is in the list of functions to strip
|
|
28
|
+
if ('id' in declaration &&
|
|
29
|
+
'name' in declaration.id &&
|
|
30
|
+
typeof declaration.id.name === 'string' &&
|
|
31
|
+
functionsToStrip.includes(declaration.id.name)) {
|
|
32
|
+
updateList(declaration.id.name);
|
|
33
|
+
// Strip the function from the AST
|
|
34
|
+
path.prune();
|
|
35
|
+
}
|
|
36
|
+
});
|
|
37
|
+
if (functionsToStrip.length === 0) {
|
|
38
|
+
// We have pruned all the functions we need to, so we can stop traversing the AST
|
|
39
|
+
return false;
|
|
40
|
+
}
|
|
41
|
+
// Continue traversing the AST
|
|
42
|
+
this.traverse(path);
|
|
43
|
+
},
|
|
44
|
+
// Visit the named export function declaration
|
|
45
|
+
visitFunctionDeclaration: function (path) {
|
|
46
|
+
// Check if the function is in the list of functions to strip
|
|
47
|
+
if (path.node.id &&
|
|
48
|
+
'name' in path.node.id &&
|
|
49
|
+
typeof path.node.id.name === 'string' &&
|
|
50
|
+
functionsToStrip.includes(path.node.id.name)) {
|
|
51
|
+
updateList(path.node.id.name);
|
|
52
|
+
// Strip the function from the AST
|
|
53
|
+
path.prune();
|
|
54
|
+
}
|
|
55
|
+
if (functionsToStrip.length === 0) {
|
|
56
|
+
// We have pruned all the functions we need to, so we can stop traversing the AST
|
|
57
|
+
return false;
|
|
58
|
+
}
|
|
59
|
+
// Continue traversing the AST
|
|
60
|
+
this.traverse(path);
|
|
61
|
+
},
|
|
62
|
+
});
|
|
63
|
+
// Generate the output code
|
|
64
|
+
return recast.print(ast).code;
|
|
65
|
+
}
|
package/dist/esm/tools/index.js
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
export { generateSites, generateMetadata, } from '@sitecore-content-sdk/core/tools';
|
|
1
|
+
export { generateSites, generateMetadata, getComponentList, generatePlugins, ModuleType, } from '@sitecore-content-sdk/core/tools';
|
|
2
|
+
export * from './templating';
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import path from 'path';
|
|
2
|
+
import fs from 'fs';
|
|
3
|
+
import { getComponentBuilderTemplate } from './templates/component-builder';
|
|
4
|
+
import { getComponentList, } from '@sitecore-content-sdk/core/tools';
|
|
5
|
+
import { watchItems } from './utils';
|
|
6
|
+
// Default destination path for component builder
|
|
7
|
+
const defaultComponentBuilderOutputPath = 'src/temp/componentBuilder.ts';
|
|
8
|
+
const defaultComponentRootPath = 'src/components';
|
|
9
|
+
/**
|
|
10
|
+
* Generate component builder based on provided settings
|
|
11
|
+
* @param {object} [settings] settings for component builder generation
|
|
12
|
+
* @param {string} [settings.componentRootPath] path to components root
|
|
13
|
+
* @param {string} [settings.componentBuilderOutputPath] path to component builder output
|
|
14
|
+
* @param {PackageDefinition[]} [settings.packages] list of packages to include in component builder
|
|
15
|
+
* @param {ComponentFile[]} [settings.components] list of components to include in component builder
|
|
16
|
+
* @param {boolean} [settings.watch] whether to watch for changes to component builder sources
|
|
17
|
+
*/
|
|
18
|
+
export function generateComponentBuilder({ componentRootPath = defaultComponentRootPath, componentBuilderOutputPath = defaultComponentBuilderOutputPath, packages = [], components = [], watch, } = {}) {
|
|
19
|
+
if (watch) {
|
|
20
|
+
watchComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components });
|
|
21
|
+
}
|
|
22
|
+
else {
|
|
23
|
+
writeComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components });
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* Watch for changes to component builder sources
|
|
28
|
+
* @param {object} settings settings for component builder generation
|
|
29
|
+
* @param {string} settings.componentRootPath path to components root
|
|
30
|
+
* @param {string} settings.componentBuilderOutputPath path to component builder output
|
|
31
|
+
* @param {PackageDefinition[]} settings.packages list of packages to include in component builder
|
|
32
|
+
* @param {ComponentFile[]} settings.components list of components to include in component builder
|
|
33
|
+
*/
|
|
34
|
+
export function watchComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, }) {
|
|
35
|
+
console.log(`Watching for changes to component builder sources in ${componentRootPath}...`);
|
|
36
|
+
watchItems([componentRootPath], writeComponentBuilder.bind(null, {
|
|
37
|
+
componentRootPath,
|
|
38
|
+
componentBuilderOutputPath,
|
|
39
|
+
packages,
|
|
40
|
+
components,
|
|
41
|
+
}));
|
|
42
|
+
}
|
|
43
|
+
/**
|
|
44
|
+
* Write component builder to file
|
|
45
|
+
* @param {object} settings settings for component builder generation
|
|
46
|
+
* @param {string} settings.componentRootPath path to components root
|
|
47
|
+
* @param {string} settings.componentBuilderOutputPath path to component builder output
|
|
48
|
+
* @param {PackageDefinition[]} settings.packages list of packages to include in component builder
|
|
49
|
+
* @param {ComponentFile[]} settings.components list of components to include in component builder
|
|
50
|
+
*/
|
|
51
|
+
export function writeComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, }) {
|
|
52
|
+
const items = [
|
|
53
|
+
...packages,
|
|
54
|
+
...components,
|
|
55
|
+
...getComponentList(componentRootPath),
|
|
56
|
+
];
|
|
57
|
+
const componentBuilderPath = path.resolve(componentBuilderOutputPath);
|
|
58
|
+
const fileContent = getComponentBuilderTemplate(items);
|
|
59
|
+
console.log(`Writing component builder to ${componentBuilderPath}`);
|
|
60
|
+
fs.writeFileSync(componentBuilderPath, fileContent, {
|
|
61
|
+
encoding: 'utf8',
|
|
62
|
+
});
|
|
63
|
+
}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
const isLazyLoadingModule = (componentPath) => componentPath.includes('.dynamic');
|
|
2
|
+
const removeDynamicModuleNameEnding = (moduleName) => moduleName.replace(/\.?dynamic$/i, '');
|
|
3
|
+
/**
|
|
4
|
+
* Generate component builder template
|
|
5
|
+
* @param {(PackageDefinition | ComponentFile)[]} components components to include in component builder
|
|
6
|
+
* @returns generated component builder template
|
|
7
|
+
*/
|
|
8
|
+
export const getComponentBuilderTemplate = (components) => {
|
|
9
|
+
const componentFiles = components.filter((component) => component.componentName);
|
|
10
|
+
const packages = components.filter((component) => component.components);
|
|
11
|
+
const hasLazyModules = componentFiles.find((component) => isLazyLoadingModule(component.path));
|
|
12
|
+
return `/* eslint-disable */
|
|
13
|
+
// Do not edit this file, it is auto-generated at build time!
|
|
14
|
+
// See scripts/generate-component-builder/index.ts to modify the generation of this file.
|
|
15
|
+
|
|
16
|
+
${hasLazyModules ? "import dynamic from 'next/dynamic';" : ''}
|
|
17
|
+
import { ComponentBuilder } from '@sitecore-content-sdk/nextjs';
|
|
18
|
+
|
|
19
|
+
${packages
|
|
20
|
+
.map((pkg) => {
|
|
21
|
+
const list = pkg.components.map((c) => c.moduleName).join(', ');
|
|
22
|
+
return `import { ${list} } from '${pkg.name}';\n`;
|
|
23
|
+
})
|
|
24
|
+
.join('')}
|
|
25
|
+
${componentFiles
|
|
26
|
+
.map((component) => {
|
|
27
|
+
if (isLazyLoadingModule(component.path)) {
|
|
28
|
+
const moduleName = removeDynamicModuleNameEnding(component.moduleName);
|
|
29
|
+
return `const ${moduleName} = {
|
|
30
|
+
module: () => import('${component.path}'),
|
|
31
|
+
element: (isEditing?: boolean) => isEditing ? require('${component.path}')?.default : dynamic(${moduleName}.module)
|
|
32
|
+
}`;
|
|
33
|
+
}
|
|
34
|
+
return `import * as ${component.moduleName} from '${component.path}';`;
|
|
35
|
+
})
|
|
36
|
+
.join('\n')}
|
|
37
|
+
|
|
38
|
+
export const components = new Map();
|
|
39
|
+
${packages
|
|
40
|
+
.map((p) => p.components.map((component) => `components.set('${component.componentName}', ${component.moduleName});\n`))
|
|
41
|
+
.flat()
|
|
42
|
+
.join('')}
|
|
43
|
+
${componentFiles
|
|
44
|
+
.map((component) => `components.set('${isLazyLoadingModule(component.path)
|
|
45
|
+
? removeDynamicModuleNameEnding(component.componentName)
|
|
46
|
+
: component.componentName}', ${isLazyLoadingModule(component.path)
|
|
47
|
+
? removeDynamicModuleNameEnding(component.moduleName)
|
|
48
|
+
: component.moduleName});`)
|
|
49
|
+
.join('\n')}
|
|
50
|
+
|
|
51
|
+
export const componentBuilder = new ComponentBuilder({ components });
|
|
52
|
+
|
|
53
|
+
export const moduleFactory = componentBuilder.getModuleFactory();
|
|
54
|
+
`;
|
|
55
|
+
};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import chokidar from 'chokidar';
|
|
2
|
+
/**
|
|
3
|
+
* Run watch mode, watching on @var paths
|
|
4
|
+
* @param {string[]} paths paths to watch by chokidar
|
|
5
|
+
* @param {Function<void>} cb callback to run on file change
|
|
6
|
+
*/
|
|
7
|
+
export function watchItems(paths, cb) {
|
|
8
|
+
chokidar
|
|
9
|
+
.watch(paths, { ignoreInitial: true, awaitWriteFinish: true })
|
|
10
|
+
.on('add', cb)
|
|
11
|
+
.on('unlink', cb);
|
|
12
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sitecore-content-sdk/nextjs",
|
|
3
|
-
"version": "0.1.0-beta.
|
|
3
|
+
"version": "0.1.0-beta.17",
|
|
4
4
|
"main": "dist/cjs/index.js",
|
|
5
5
|
"module": "dist/esm/index.js",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -57,6 +57,7 @@
|
|
|
57
57
|
"next": "^14.2.18",
|
|
58
58
|
"nock": "14.0.0-beta.7",
|
|
59
59
|
"nyc": "^17.1.0",
|
|
60
|
+
"proxyquire": "^2.1.3",
|
|
60
61
|
"react": "^18.2.0",
|
|
61
62
|
"react-dom": "^18.2.0",
|
|
62
63
|
"sinon": "^19.0.2",
|
|
@@ -72,17 +73,17 @@
|
|
|
72
73
|
"react-dom": "^18.2.0"
|
|
73
74
|
},
|
|
74
75
|
"dependencies": {
|
|
75
|
-
"@sitecore-content-sdk/core": "0.1.0-beta.
|
|
76
|
-
"@sitecore-content-sdk/
|
|
77
|
-
"@sitecore-content-sdk/react": "0.1.0-beta.16",
|
|
76
|
+
"@sitecore-content-sdk/core": "0.1.0-beta.17",
|
|
77
|
+
"@sitecore-content-sdk/react": "0.1.0-beta.17",
|
|
78
78
|
"@vercel/kv": "^3.0.0",
|
|
79
79
|
"prop-types": "^15.8.1",
|
|
80
|
+
"recast": "^0.23.11",
|
|
80
81
|
"regex-parser": "^2.3.0",
|
|
81
82
|
"sync-disk-cache": "^2.1.0"
|
|
82
83
|
},
|
|
83
84
|
"description": "",
|
|
84
85
|
"types": "types/index.d.ts",
|
|
85
|
-
"gitHead": "
|
|
86
|
+
"gitHead": "9a7a8fea513ada0ae441941bcf05a1a86d4f7d99",
|
|
86
87
|
"files": [
|
|
87
88
|
"dist",
|
|
88
89
|
"types",
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { NextApiRequest, NextApiResponse } from 'next';
|
|
2
|
-
import { Metadata } from '@sitecore-content-sdk/
|
|
2
|
+
import { Metadata } from '@sitecore-content-sdk/core/editing';
|
|
3
3
|
export type EditingConfigMiddlewareConfig = {
|
|
4
4
|
/**
|
|
5
5
|
* Components available in the application
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Webpack loader to strip functions from the source code
|
|
3
|
+
* Strips the `getServerSideProps` and `getStaticProps` functions from the source code
|
|
4
|
+
* @param {string} source file source code
|
|
5
|
+
* @returns {string} output file source code with stripped functions
|
|
6
|
+
*/
|
|
7
|
+
export default function componentPropsLoader(source: string): string;
|
package/types/tools/index.d.ts
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
export { generateSites, GenerateSitesConfig, generateMetadata, } from '@sitecore-content-sdk/core/tools';
|
|
1
|
+
export { generateSites, GenerateSitesConfig, generateMetadata, ComponentFile, PackageDefinition, getComponentList, PluginDefinition, generatePlugins, ModuleType, } from '@sitecore-content-sdk/core/tools';
|
|
2
|
+
export * from './templating';
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { ComponentFile, PackageDefinition } from '@sitecore-content-sdk/core/tools';
|
|
2
|
+
/**
|
|
3
|
+
* Generate component builder based on provided settings
|
|
4
|
+
* @param {object} [settings] settings for component builder generation
|
|
5
|
+
* @param {string} [settings.componentRootPath] path to components root
|
|
6
|
+
* @param {string} [settings.componentBuilderOutputPath] path to component builder output
|
|
7
|
+
* @param {PackageDefinition[]} [settings.packages] list of packages to include in component builder
|
|
8
|
+
* @param {ComponentFile[]} [settings.components] list of components to include in component builder
|
|
9
|
+
* @param {boolean} [settings.watch] whether to watch for changes to component builder sources
|
|
10
|
+
*/
|
|
11
|
+
export declare function generateComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, watch, }?: {
|
|
12
|
+
componentRootPath?: string;
|
|
13
|
+
componentBuilderOutputPath?: string;
|
|
14
|
+
packages?: PackageDefinition[];
|
|
15
|
+
components?: ComponentFile[];
|
|
16
|
+
watch?: boolean;
|
|
17
|
+
}): void;
|
|
18
|
+
/**
|
|
19
|
+
* Watch for changes to component builder sources
|
|
20
|
+
* @param {object} settings settings for component builder generation
|
|
21
|
+
* @param {string} settings.componentRootPath path to components root
|
|
22
|
+
* @param {string} settings.componentBuilderOutputPath path to component builder output
|
|
23
|
+
* @param {PackageDefinition[]} settings.packages list of packages to include in component builder
|
|
24
|
+
* @param {ComponentFile[]} settings.components list of components to include in component builder
|
|
25
|
+
*/
|
|
26
|
+
export declare function watchComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, }: {
|
|
27
|
+
componentRootPath: string;
|
|
28
|
+
componentBuilderOutputPath: string;
|
|
29
|
+
packages: PackageDefinition[];
|
|
30
|
+
components: ComponentFile[];
|
|
31
|
+
}): void;
|
|
32
|
+
/**
|
|
33
|
+
* Write component builder to file
|
|
34
|
+
* @param {object} settings settings for component builder generation
|
|
35
|
+
* @param {string} settings.componentRootPath path to components root
|
|
36
|
+
* @param {string} settings.componentBuilderOutputPath path to component builder output
|
|
37
|
+
* @param {PackageDefinition[]} settings.packages list of packages to include in component builder
|
|
38
|
+
* @param {ComponentFile[]} settings.components list of components to include in component builder
|
|
39
|
+
*/
|
|
40
|
+
export declare function writeComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, }: {
|
|
41
|
+
componentRootPath: string;
|
|
42
|
+
componentBuilderOutputPath: string;
|
|
43
|
+
packages: PackageDefinition[];
|
|
44
|
+
components: ComponentFile[];
|
|
45
|
+
}): void;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { ComponentFile, PackageDefinition } from '@sitecore-content-sdk/core/tools';
|
|
2
|
+
/**
|
|
3
|
+
* Generate component builder template
|
|
4
|
+
* @param {(PackageDefinition | ComponentFile)[]} components components to include in component builder
|
|
5
|
+
* @returns generated component builder template
|
|
6
|
+
*/
|
|
7
|
+
export declare const getComponentBuilderTemplate: (components: (PackageDefinition | ComponentFile)[]) => string;
|