@sitecore-content-sdk/nextjs 0.1.0-beta.34 → 0.1.0-beta.35

package/dist/cjs/client/sitecore-nextjs-client.js

@@ -70,14 +70,14 @@ class SitecoreNextjsClient extends client_1.SitecoreClient {
         });
     }
     /**
-     * Parses components from nextjs component factory and layoutData, executes getServerProps/getStaticProps methods
+     * Parses components from nextjs component map and layoutData, executes getServerProps/getStaticProps methods
      * and returns resulting props from components
      * @param {LayoutServiceData} layoutData layout data to parse compnents from
      * @param {PreviewData} context Nextjs preview data
-     * @param {ModuleFactory} moduleFactory module factory to use for component parsing
+     * @param {ComponentMap<NextjsJssComponent>} components component map to get props for
      * @returns {ComponentPropsCollection} component props
      */
-    getComponentData(layoutData, context, moduleFactory) {
+    getComponentData(layoutData, context, components) {
         return __awaiter(this, void 0, void 0, function* () {
             let componentProps = {};
             if (!layoutData.sitecore.route)
@@ -86,7 +86,7 @@ class SitecoreNextjsClient extends client_1.SitecoreClient {
             componentProps = yield this.componentPropsService.fetchComponentProps({
                 layoutData: layoutData,
                 context,
-                moduleFactory,
+                components,
             });
             const errors = Object.keys(componentProps)
                 .map((id) => {

package/dist/cjs/editing/editing-config-middleware.js

@@ -41,9 +41,7 @@ class EditingConfigMiddleware {
                 // CORS headers are set by enforceCors
                 return res.status(204).send(null);
             }
-            const components = Array.isArray(this.config.components)
-                ? this.config.components
-                : Array.from(this.config.components.keys());
+            const components = Array.from(this.config.components.keys());
             return res.status(200).json({
                 components,
                 packages: this.config.metadata.packages,

package/dist/cjs/index.js

@@ -33,8 +33,8 @@ var __importStar = (this && this.__importStar) || (function () {
     };
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DesignLibrary = exports.File = exports.getDesignLibraryStylesheetLinks = exports.BYOCComponent = exports.fetchFEaaSComponentServerProps = exports.FEaaSComponent = exports.DateField = exports.Text = exports.Image = exports.ComponentBuilder = exports.BYOCWrapper = exports.FEaaSWrapper = exports.NextImage = exports.Placeholder = exports.RichText = exports.Link = exports.useComponentProps = exports.ComponentPropsContext = exports.ComponentPropsReactContext = exports.normalizeSiteRewrite = exports.getSiteRewriteData = exports.getSiteRewrite = exports.GraphQLSiteInfoService = exports.SiteResolver = exports.GraphQLRobotsService = exports.GraphQLErrorPagesService = exports.GraphQLSitemapXmlService = exports.GraphQLSitePathService = exports.ComponentPropsService = exports.CdpHelper = exports.normalizePersonalizedRewrite = exports.getGroomedVariantIds = exports.getPersonalizedRewriteData = exports.getPersonalizedRewrite = exports.personalizeLayout = exports.GraphQLDictionaryService = exports.mediaApi = exports.RestComponentLayoutService = exports.RenderingType = exports.EditMode = exports.getContentStylesheetLink = exports.getFieldValue = exports.getChildPlaceholder = exports.GraphQLLayoutService = exports.LayoutServicePageState = exports.MemoryCacheClient = exports.debug = exports.enableDebug = exports.NativeDataFetcher = exports.constants = void 0;
-exports.Form = exports.EditingScripts = exports.withEmptyFieldEditingComponent = exports.withFieldMetadata = exports.withDatasourceCheck = exports.withPlaceholder = exports.withEditorChromes = exports.useSitecoreContext = exports.withSitecoreContext = exports.SitecoreContextReactContext = exports.SitecoreContext = exports.DefaultEmptyFieldEditingComponentText = exports.DefaultEmptyFieldEditingComponentImage = void 0;
+exports.DefaultEmptyFieldEditingComponentImage = exports.DesignLibrary = exports.File = exports.getDesignLibraryStylesheetLinks = exports.BYOCComponent = exports.fetchFEaaSComponentServerProps = exports.FEaaSComponent = exports.DateField = exports.Text = exports.Image = exports.BYOCWrapper = exports.FEaaSWrapper = exports.NextImage = exports.Placeholder = exports.RichText = exports.Link = exports.useComponentProps = exports.ComponentPropsContext = exports.ComponentPropsReactContext = exports.normalizeSiteRewrite = exports.getSiteRewriteData = exports.getSiteRewrite = exports.GraphQLSiteInfoService = exports.SiteResolver = exports.GraphQLRobotsService = exports.GraphQLErrorPagesService = exports.GraphQLSitemapXmlService = exports.GraphQLSitePathService = exports.ComponentPropsService = exports.CdpHelper = exports.normalizePersonalizedRewrite = exports.getGroomedVariantIds = exports.getPersonalizedRewriteData = exports.getPersonalizedRewrite = exports.personalizeLayout = exports.GraphQLDictionaryService = exports.mediaApi = exports.RestComponentLayoutService = exports.RenderingType = exports.EditMode = exports.getContentStylesheetLink = exports.getFieldValue = exports.getChildPlaceholder = exports.GraphQLLayoutService = exports.LayoutServicePageState = exports.MemoryCacheClient = exports.debug = exports.enableDebug = exports.NativeDataFetcher = exports.constants = void 0;
+exports.Form = exports.EditingScripts = exports.withEmptyFieldEditingComponent = exports.withFieldMetadata = exports.withDatasourceCheck = exports.withPlaceholder = exports.withEditorChromes = exports.useSitecoreContext = exports.withSitecoreContext = exports.SitecoreContextReactContext = exports.SitecoreContext = exports.DefaultEmptyFieldEditingComponentText = void 0;
 var core_1 = require("@sitecore-content-sdk/core");
 Object.defineProperty(exports, "constants", { enumerable: true, get: function () { return core_1.constants; } });
 // generic data access
@@ -92,8 +92,6 @@ const FEaaSWrapper = __importStar(require("./components/FEaaSWrapper"));
 exports.FEaaSWrapper = FEaaSWrapper;
 const BYOCWrapper = __importStar(require("./components/BYOCWrapper"));
 exports.BYOCWrapper = BYOCWrapper;
-var ComponentBuilder_1 = require("./ComponentBuilder");
-Object.defineProperty(exports, "ComponentBuilder", { enumerable: true, get: function () { return ComponentBuilder_1.ComponentBuilder; } });
 var react_1 = require("@sitecore-content-sdk/react");
 Object.defineProperty(exports, "Image", { enumerable: true, get: function () { return react_1.Image; } });
 Object.defineProperty(exports, "Text", { enumerable: true, get: function () { return react_1.Text; } });

package/dist/cjs/services/component-props-service.js

@@ -18,12 +18,9 @@ class ComponentPropsService {
     fetchComponentProps(params) {
         return __awaiter(this, void 0, void 0, function* () {
             var _a, _b;
-            const { layoutData, context, moduleFactory } = params;
+            const { layoutData, context, components } = params;
             if (this.isServerSidePropsContext(context)) {
-                const fetchFunctionFactory = (componentName) => __awaiter(this, void 0, void 0, function* () {
-                    const module = yield moduleFactory(componentName);
-                    return module === null || module === void 0 ? void 0 : module.getServerSideProps;
-                });
+                const fetchFunctionFactory = (componentName) => __awaiter(this, void 0, void 0, function* () { var _a; return (_a = (yield this.getModule(components, componentName))) === null || _a === void 0 ? void 0 : _a.getServerSideProps; });
                 const requests = yield this.collectRequests({
                     placeholders: (_a = layoutData.sitecore.route) === null || _a === void 0 ? void 0 : _a.placeholders,
                     fetchFunctionFactory,
@@ -33,10 +30,7 @@ class ComponentPropsService {
                 return yield this.execRequests(requests);
             }
             else {
-                const fetchFunctionFactory = (componentName) => __awaiter(this, void 0, void 0, function* () {
-                    const module = yield moduleFactory(componentName);
-                    return module === null || module === void 0 ? void 0 : module.getStaticProps;
-                });
+                const fetchFunctionFactory = (componentName) => __awaiter(this, void 0, void 0, function* () { var _a; return (_a = (yield this.getModule(components, componentName))) === null || _a === void 0 ? void 0 : _a.getStaticProps; });
                 const requests = yield this.collectRequests({
                     placeholders: (_b = layoutData.sitecore.route) === null || _b === void 0 ? void 0 : _b.placeholders,
                     fetchFunctionFactory,
@@ -150,5 +144,15 @@ class ComponentPropsService {
     isServerSidePropsContext(context) {
         return context.req !== undefined;
     }
+    getModule(components, componentName) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            const component = components.get(componentName);
+            if (!component)
+                return null;
+            const module = component.dynamicModule ? yield ((_a = component === null || component === void 0 ? void 0 : component.dynamicModule) === null || _a === void 0 ? void 0 : _a.call(component)) : component;
+            return module;
+        });
+    }
 }
 exports.ComponentPropsService = ComponentPropsService;

package/dist/cjs/tools/index.js

@@ -1,18 +1,4 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ModuleType = exports.generatePlugins = exports.getComponentList = exports.generateMetadata = exports.generateSites = void 0;
 var tools_1 = require("@sitecore-content-sdk/core/tools");
@@ -21,4 +7,3 @@ Object.defineProperty(exports, "generateMetadata", { enumerable: true, get: func
 Object.defineProperty(exports, "getComponentList", { enumerable: true, get: function () { return tools_1.getComponentList; } });
 Object.defineProperty(exports, "generatePlugins", { enumerable: true, get: function () { return tools_1.generatePlugins; } });
 Object.defineProperty(exports, "ModuleType", { enumerable: true, get: function () { return tools_1.ModuleType; } });
-__exportStar(require("./templating"), exports);

package/dist/esm/client/sitecore-nextjs-client.js

@@ -67,14 +67,14 @@ export class SitecoreNextjsClient extends SitecoreClient {
         });
     }
     /**
-     * Parses components from nextjs component factory and layoutData, executes getServerProps/getStaticProps methods
+     * Parses components from nextjs component map and layoutData, executes getServerProps/getStaticProps methods
      * and returns resulting props from components
      * @param {LayoutServiceData} layoutData layout data to parse compnents from
      * @param {PreviewData} context Nextjs preview data
-     * @param {ModuleFactory} moduleFactory module factory to use for component parsing
+     * @param {ComponentMap<NextjsJssComponent>} components component map to get props for
      * @returns {ComponentPropsCollection} component props
      */
-    getComponentData(layoutData, context, moduleFactory) {
+    getComponentData(layoutData, context, components) {
         return __awaiter(this, void 0, void 0, function* () {
             let componentProps = {};
             if (!layoutData.sitecore.route)
@@ -83,7 +83,7 @@ export class SitecoreNextjsClient extends SitecoreClient {
             componentProps = yield this.componentPropsService.fetchComponentProps({
                 layoutData: layoutData,
                 context,
-                moduleFactory,
+                components,
             });
             const errors = Object.keys(componentProps)
                 .map((id) => {

package/dist/esm/editing/editing-config-middleware.js

@@ -38,9 +38,7 @@ export class EditingConfigMiddleware {
                 // CORS headers are set by enforceCors
                 return res.status(204).send(null);
             }
-            const components = Array.isArray(this.config.components)
-                ? this.config.components
-                : Array.from(this.config.components.keys());
+            const components = Array.from(this.config.components.keys());
             return res.status(200).json({
                 components,
                 packages: this.config.metadata.packages,

package/dist/esm/index.js

@@ -18,5 +18,4 @@ import * as FEaaSWrapper from './components/FEaaSWrapper';
 import * as BYOCWrapper from './components/BYOCWrapper';
 export { FEaaSWrapper };
 export { BYOCWrapper };
-export { ComponentBuilder } from './ComponentBuilder';
 export { Image, Text, DateField, FEaaSComponent, fetchFEaaSComponentServerProps, BYOCComponent, getDesignLibraryStylesheetLinks, File, DesignLibrary, DefaultEmptyFieldEditingComponentImage, DefaultEmptyFieldEditingComponentText, SitecoreContext, SitecoreContextReactContext, withSitecoreContext, useSitecoreContext, withEditorChromes, withPlaceholder, withDatasourceCheck, withFieldMetadata, withEmptyFieldEditingComponent, EditingScripts, Form, } from '@sitecore-content-sdk/react';

package/dist/esm/services/component-props-service.js

@@ -12,12 +12,9 @@ export class ComponentPropsService {
     fetchComponentProps(params) {
         return __awaiter(this, void 0, void 0, function* () {
             var _a, _b;
-            const { layoutData, context, moduleFactory } = params;
+            const { layoutData, context, components } = params;
             if (this.isServerSidePropsContext(context)) {
-                const fetchFunctionFactory = (componentName) => __awaiter(this, void 0, void 0, function* () {
-                    const module = yield moduleFactory(componentName);
-                    return module === null || module === void 0 ? void 0 : module.getServerSideProps;
-                });
+                const fetchFunctionFactory = (componentName) => __awaiter(this, void 0, void 0, function* () { var _a; return (_a = (yield this.getModule(components, componentName))) === null || _a === void 0 ? void 0 : _a.getServerSideProps; });
                 const requests = yield this.collectRequests({
                     placeholders: (_a = layoutData.sitecore.route) === null || _a === void 0 ? void 0 : _a.placeholders,
                     fetchFunctionFactory,
@@ -27,10 +24,7 @@ export class ComponentPropsService {
                 return yield this.execRequests(requests);
             }
             else {
-                const fetchFunctionFactory = (componentName) => __awaiter(this, void 0, void 0, function* () {
-                    const module = yield moduleFactory(componentName);
-                    return module === null || module === void 0 ? void 0 : module.getStaticProps;
-                });
+                const fetchFunctionFactory = (componentName) => __awaiter(this, void 0, void 0, function* () { var _a; return (_a = (yield this.getModule(components, componentName))) === null || _a === void 0 ? void 0 : _a.getStaticProps; });
                 const requests = yield this.collectRequests({
                     placeholders: (_b = layoutData.sitecore.route) === null || _b === void 0 ? void 0 : _b.placeholders,
                     fetchFunctionFactory,
@@ -144,4 +138,14 @@ export class ComponentPropsService {
     isServerSidePropsContext(context) {
         return context.req !== undefined;
     }
+    getModule(components, componentName) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            const component = components.get(componentName);
+            if (!component)
+                return null;
+            const module = component.dynamicModule ? yield ((_a = component === null || component === void 0 ? void 0 : component.dynamicModule) === null || _a === void 0 ? void 0 : _a.call(component)) : component;
+            return module;
+        });
+    }
 }

package/dist/esm/tools/index.js

@@ -1,2 +1 @@
 export { generateSites, generateMetadata, getComponentList, generatePlugins, ModuleType, } from '@sitecore-content-sdk/core/tools';
-export * from './templating';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sitecore-content-sdk/nextjs",
-  "version": "0.1.0-beta.34",
+  "version": "0.1.0-beta.35",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "sideEffects": false,
@@ -75,8 +75,8 @@
   },
   "dependencies": {
     "@babel/parser": "^7.26.10",
-    "@sitecore-content-sdk/core": "0.1.0-beta.34",
-    "@sitecore-content-sdk/react": "0.1.0-beta.34",
+    "@sitecore-content-sdk/core": "0.1.0-beta.35",
+    "@sitecore-content-sdk/react": "0.1.0-beta.35",
     "@vercel/kv": "^3.0.0",
     "prop-types": "^15.8.1",
     "recast": "^0.23.11",
@@ -85,7 +85,7 @@
   },
   "description": "",
   "types": "types/index.d.ts",
-  "gitHead": "671c575e11cd9e99e816b02b6ebd4620d2476304",
+  "gitHead": "160a0bdb91edbe88e3382e0ee1503203024c09b0",
   "files": [
     "dist",
     "types",

package/types/client/sitecore-nextjs-client.d.ts

@@ -1,10 +1,10 @@
 import { FetchOptions, Page, PageOptions, SitecoreClient, SitecoreClientInit } from '@sitecore-content-sdk/core/client';
-import { ComponentPropsCollection } from '../sharedTypes/component-props';
+import { ComponentPropsCollection, NextjsJssComponent } from '../sharedTypes/component-props';
 import { GetServerSidePropsContext, GetStaticPropsContext, PreviewData } from 'next';
 import { LayoutServiceData } from '@sitecore-content-sdk/core/layout';
 import { ComponentPropsService } from '../services/component-props-service';
-import { ModuleFactory } from '../sharedTypes/module-factory';
 import { SiteInfo } from '../site';
+import { ComponentMap } from '@sitecore-content-sdk/react';
 export type NextjsPage = Page & {
     componentProps?: ComponentPropsCollection;
     notFound?: boolean;
@@ -28,13 +28,13 @@ export declare class SitecoreNextjsClient extends SitecoreClient {
      */
     getPreview(previewData: PreviewData, fetchOptions?: FetchOptions): Promise<NextjsPage | null>;
     /**
-     * Parses components from nextjs component factory and layoutData, executes getServerProps/getStaticProps methods
+     * Parses components from nextjs component map and layoutData, executes getServerProps/getStaticProps methods
      * and returns resulting props from components
      * @param {LayoutServiceData} layoutData layout data to parse compnents from
      * @param {PreviewData} context Nextjs preview data
-     * @param {ModuleFactory} moduleFactory module factory to use for component parsing
+     * @param {ComponentMap<NextjsJssComponent>} components component map to get props for
      * @returns {ComponentPropsCollection} component props
      */
-    getComponentData(layoutData: LayoutServiceData, context: GetServerSidePropsContext | GetStaticPropsContext, moduleFactory: ModuleFactory): Promise<ComponentPropsCollection>;
+    getComponentData(layoutData: LayoutServiceData, context: GetServerSidePropsContext | GetStaticPropsContext, components: ComponentMap<NextjsJssComponent>): Promise<ComponentPropsCollection>;
     protected getComponentPropsService(): ComponentPropsService;
 }

package/types/editing/editing-config-middleware.d.ts

@@ -1,10 +1,12 @@
 import { NextApiRequest, NextApiResponse } from 'next';
 import { Metadata } from '@sitecore-content-sdk/core/editing';
+import { ComponentMap } from '@sitecore-content-sdk/react';
+import { NextjsJssComponent } from '../sharedTypes/component-props';
 export type EditingConfigMiddlewareConfig = {
     /**
      * Components available in the application
      */
-    components: string[] | Map<string, unknown>;
+    components: ComponentMap<NextjsJssComponent>;
     /**
      * Application metadata
      */

package/types/index.d.ts

@@ -5,9 +5,8 @@ export { RestComponentLayoutService } from '@sitecore-content-sdk/core/editing';
 export { mediaApi } from '@sitecore-content-sdk/core/media';
 export { DictionaryPhrases, DictionaryService, GraphQLDictionaryService, GraphQLDictionaryServiceConfig, } from '@sitecore-content-sdk/core/i18n';
 export { personalizeLayout, getPersonalizedRewrite, getPersonalizedRewriteData, getGroomedVariantIds, normalizePersonalizedRewrite, CdpHelper, } from '@sitecore-content-sdk/core/personalize';
-export { ComponentPropsCollection, ComponentPropsError, GetStaticComponentProps, GetServerSideComponentProps, } from './sharedTypes/component-props';
+export { ComponentPropsCollection, ComponentPropsError, GetStaticComponentProps, GetServerSideComponentProps, NextjsJssComponent, } from './sharedTypes/component-props';
 export { SitecorePageProps } from './sharedTypes/sitecore-page-props';
-export { ModuleFactory, Module } from './sharedTypes/module-factory';
 export { ComponentPropsService } from './services/component-props-service';
 export { GraphQLSitePathService, GraphQLSitePathServiceConfig, } from '@sitecore-content-sdk/core/site';
 export { StaticPath } from '@sitecore-content-sdk/core';
@@ -21,5 +20,4 @@ import * as FEaaSWrapper from './components/FEaaSWrapper';
 import * as BYOCWrapper from './components/BYOCWrapper';
 export { FEaaSWrapper };
 export { BYOCWrapper };
-export { ComponentBuilder, ComponentBuilderConfig } from './ComponentBuilder';
-export { ComponentFactory, Image, ImageField, ImageFieldValue, ImageProps, LinkField, LinkFieldValue, Text, TextField, DateField, FEaaSComponent, FEaaSComponentProps, FEaaSComponentParams, fetchFEaaSComponentServerProps, BYOCComponentParams, BYOCComponent, BYOCComponentProps, getDesignLibraryStylesheetLinks, File, FileField, RichTextField, DesignLibrary, DefaultEmptyFieldEditingComponentImage, DefaultEmptyFieldEditingComponentText, PlaceholderComponentProps, SitecoreContext, SitecoreContextState, SitecoreContextValue, SitecoreContextReactContext, withSitecoreContext, useSitecoreContext, withEditorChromes, withPlaceholder, withDatasourceCheck, ImageSizeParameters, WithSitecoreContextOptions, WithSitecoreContextProps, WithSitecoreContextHocProps, withFieldMetadata, withEmptyFieldEditingComponent, EditingScripts, Form, } from '@sitecore-content-sdk/react';
+export { ComponentMap, Image, ImageField, ImageFieldValue, ImageProps, LinkField, LinkFieldValue, Text, TextField, DateField, FEaaSComponent, FEaaSComponentProps, FEaaSComponentParams, fetchFEaaSComponentServerProps, BYOCComponentParams, BYOCComponent, BYOCComponentProps, getDesignLibraryStylesheetLinks, File, FileField, RichTextField, DesignLibrary, DefaultEmptyFieldEditingComponentImage, DefaultEmptyFieldEditingComponentText, PlaceholderComponentProps, SitecoreContext, SitecoreContextState, SitecoreContextValue, SitecoreContextReactContext, withSitecoreContext, useSitecoreContext, withEditorChromes, withPlaceholder, withDatasourceCheck, ImageSizeParameters, WithSitecoreContextOptions, WithSitecoreContextProps, WithSitecoreContextHocProps, withFieldMetadata, withEmptyFieldEditingComponent, EditingScripts, Form, } from '@sitecore-content-sdk/react';

package/types/services/component-props-service.d.ts

@@ -1,11 +1,11 @@
 import { GetServerSidePropsContext, GetStaticPropsContext } from 'next';
 import { LayoutServiceData, ComponentRendering, PlaceholdersData } from '@sitecore-content-sdk/core/layout';
-import { ComponentPropsCollection, ComponentPropsFetchFunction } from '../sharedTypes/component-props';
-import { ModuleFactory } from '../sharedTypes/module-factory';
+import { ComponentPropsCollection, ComponentPropsFetchFunction, NextjsJssComponent } from '../sharedTypes/component-props';
+import { ComponentMap } from '@sitecore-content-sdk/react';
 export type FetchComponentPropsArguments<NextContext> = {
     layoutData: LayoutServiceData;
     context: NextContext;
-    moduleFactory: ModuleFactory;
+    components: ComponentMap<NextjsJssComponent>;
 };
 export type ComponentPropsRequest<NextContext> = {
     fetch: ComponentPropsFetchFunction<NextContext>;
@@ -60,5 +60,6 @@ export declare class ComponentPropsService {
      * @param {GetServerSidePropsContext | GetStaticPropsContext} context
      */
     private isServerSidePropsContext;
+    private getModule;
 }
 export {};

package/types/sharedTypes/component-props.d.ts

@@ -1,5 +1,6 @@
 import { GetServerSidePropsContext, GetStaticPropsContext } from 'next';
 import { ComponentRendering, LayoutServiceData } from '@sitecore-content-sdk/core/layout';
+import { ReactJssComponent } from '@sitecore-content-sdk/react';
 export type ComponentPropsError = {
     error: string;
     componentName: string;
@@ -24,3 +25,20 @@ export type GetServerSideComponentProps = ComponentPropsFetchFunction<GetServerS
  * Shape of getStaticProps function on component level
  */
 export type GetStaticComponentProps = ComponentPropsFetchFunction<GetStaticPropsContext>;
+/**
+ * Represents a nextjs component import
+ */
+export type NextjsJssComponent = ReactJssComponent & {
+    /**
+     * function for component level data fetching in SSR mode
+     */
+    getServerSideProps?: GetServerSideComponentProps;
+    /**
+     * function for component level data fetching in SSG mode
+     */
+    getStaticProps?: GetStaticComponentProps;
+    /**
+     * Optional dynamic import for lazy components - allows component props retrieval
+     */
+    dynamicModule?: () => Promise<ReactJssComponent>;
+};

package/types/tools/index.d.ts

@@ -1,2 +1 @@
 export { generateSites, GenerateSitesConfig, generateMetadata, ComponentFile, PackageDefinition, getComponentList, PluginDefinition, generatePlugins, ModuleType, } from '@sitecore-content-sdk/core/tools';
-export * from './templating';

package/dist/cjs/ComponentBuilder.js

@@ -1,63 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ComponentBuilder = void 0;
-/**
- * Nextjs implementation of component builder class for building components based on the configuration.
- */
-class ComponentBuilder {
-    constructor(config) {
-        this.config = config;
-        /**
-         * SXA uses custom default export name
-         */
-        this.DEFAULT_EXPORT_NAME = 'Default';
-        this.components = new Map([...config.components]);
-    }
-    /**
-     * Creates a new instance of module factory
-     * Module factory provides a module (file) including all exports.
-     * Module can be imported dynamically or statically.
-     * @returns {ModuleFactory} Module factory implementation
-     */
-    getModuleFactory() {
-        return (componentName) => {
-            const component = this.components.get(componentName);
-            if (!component)
-                return null;
-            // check if module should be imported dynamically
-            if (component.module) {
-                return component.module();
-            }
-            return component;
-        };
-    }
-    /**
-     * Creates a new instance of component factory
-     * Component can be imported dynamically or statically.
-     * @param {object} [config] Component factory configuration
-     * @param {boolean} [config.isEditing] Indicates if component factory is used in editing mode
-     * @returns {ComponentFactory} Component factory implementation
-     */
-    getComponentFactory({ isEditing } = {}) {
-        return (componentName, exportName) => {
-            const component = this.components.get(componentName);
-            if (!component)
-                return null;
-            // check if component should be imported dynamically
-            if (component.element) {
-                // Editing mode doesn't work well with dynamic components in nextjs: dynamic components are not displayed without refresh after a rendering is added.
-                // This happens beacuse Sitecore editors simply insert updated HTML generated on server side. This conflicts with nextjs dynamic logic as no HTML gets rendered for dynamic component
-                // So we use require() to obtain dynamic components in editing mode while preserving dynamic logic for non-editing scenarios
-                // As we need to be able to seamlessly work with dynamic components in both editing and normal modes, different componentFactory functions will be passed to app
-                return component.element(isEditing);
-            }
-            if (exportName && exportName !== this.DEFAULT_EXPORT_NAME) {
-                return component[exportName];
-            }
-            return (component.Default ||
-                component.default ||
-                component);
-        };
-    }
-}
-exports.ComponentBuilder = ComponentBuilder;

package/dist/cjs/sharedTypes/module-factory.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/tools/templating/generate-component-builder.js

@@ -1,71 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.generateComponentBuilder = generateComponentBuilder;
-exports.watchComponentBuilder = watchComponentBuilder;
-exports.writeComponentBuilder = writeComponentBuilder;
-const path_1 = __importDefault(require("path"));
-const fs_1 = __importDefault(require("fs"));
-const component_builder_1 = require("./templates/component-builder");
-const tools_1 = require("@sitecore-content-sdk/core/tools");
-const utils_1 = require("./utils");
-// Default destination path for component builder
-const defaultComponentBuilderOutputPath = 'src/temp/componentBuilder.ts';
-const defaultComponentRootPath = 'src/components';
-/**
- * Generate component builder based on provided settings
- * @param {object} [settings] settings for component builder generation
- * @param {string} [settings.componentRootPath] path to components root
- * @param {string} [settings.componentBuilderOutputPath] path to component builder output
- * @param {PackageDefinition[]} [settings.packages] list of packages to include in component builder
- * @param {ComponentFile[]} [settings.components] list of components to include in component builder
- * @param {boolean} [settings.watch] whether to watch for changes to component builder sources
- */
-function generateComponentBuilder({ componentRootPath = defaultComponentRootPath, componentBuilderOutputPath = defaultComponentBuilderOutputPath, packages = [], components = [], watch, } = {}) {
-    if (watch) {
-        watchComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components });
-    }
-    else {
-        writeComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components });
-    }
-}
-/**
- * Watch for changes to component builder sources
- * @param {object} settings settings for component builder generation
- * @param {string} settings.componentRootPath path to components root
- * @param {string} settings.componentBuilderOutputPath path to component builder output
- * @param {PackageDefinition[]} settings.packages list of packages to include in component builder
- * @param {ComponentFile[]} settings.components list of components to include in component builder
- */
-function watchComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, }) {
-    console.log(`Watching for changes to component builder sources in ${componentRootPath}...`);
-    (0, utils_1.watchItems)([componentRootPath], writeComponentBuilder.bind(null, {
-        componentRootPath,
-        componentBuilderOutputPath,
-        packages,
-        components,
-    }));
-}
-/**
- * Write component builder to file
- * @param {object} settings settings for component builder generation
- * @param {string} settings.componentRootPath path to components root
- * @param {string} settings.componentBuilderOutputPath path to component builder output
- * @param {PackageDefinition[]} settings.packages list of packages to include in component builder
- * @param {ComponentFile[]} settings.components list of components to include in component builder
- */
-function writeComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, }) {
-    const items = [
-        ...packages,
-        ...components,
-        ...(0, tools_1.getComponentList)(componentRootPath),
-    ];
-    const componentBuilderPath = path_1.default.resolve(componentBuilderOutputPath);
-    const fileContent = (0, component_builder_1.getComponentBuilderTemplate)(items);
-    console.log(`Writing component builder to ${componentBuilderPath}`);
-    fs_1.default.writeFileSync(componentBuilderPath, fileContent, {
-        encoding: 'utf8',
-    });
-}

package/dist/cjs/tools/templating/index.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getComponentBuilderTemplate = exports.generateComponentBuilder = void 0;
-var generate_component_builder_1 = require("./generate-component-builder");
-Object.defineProperty(exports, "generateComponentBuilder", { enumerable: true, get: function () { return generate_component_builder_1.generateComponentBuilder; } });
-var component_builder_1 = require("./templates/component-builder");
-Object.defineProperty(exports, "getComponentBuilderTemplate", { enumerable: true, get: function () { return component_builder_1.getComponentBuilderTemplate; } });

package/dist/cjs/tools/templating/templates/component-builder.js

@@ -1,59 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getComponentBuilderTemplate = void 0;
-const isLazyLoadingModule = (componentPath) => componentPath.includes('.dynamic');
-const removeDynamicModuleNameEnding = (moduleName) => moduleName.replace(/\.?dynamic$/i, '');
-/**
- * Generate component builder template
- * @param {(PackageDefinition | ComponentFile)[]} components components to include in component builder
- * @returns generated component builder template
- */
-const getComponentBuilderTemplate = (components) => {
-    const componentFiles = components.filter((component) => component.componentName);
-    const packages = components.filter((component) => component.components);
-    const hasLazyModules = componentFiles.find((component) => isLazyLoadingModule(component.path));
-    return `/* eslint-disable */
-// Do not edit this file, it is auto-generated at build time!
-// See scripts/generate-component-builder/index.ts to modify the generation of this file.
-
-${hasLazyModules ? "import dynamic from 'next/dynamic';" : ''}
-import { ComponentBuilder } from '@sitecore-content-sdk/nextjs';
-
-${packages
-        .map((pkg) => {
-        const list = pkg.components.map((c) => c.moduleName).join(', ');
-        return `import { ${list} } from '${pkg.name}';\n`;
-    })
-        .join('')}
-${componentFiles
-        .map((component) => {
-        if (isLazyLoadingModule(component.path)) {
-            const moduleName = removeDynamicModuleNameEnding(component.moduleName);
-            return `const ${moduleName} = {
-  module: () => import('${component.path}'),
-  element: (isEditing?: boolean) => isEditing ? require('${component.path}')?.default : dynamic(${moduleName}.module)
-}`;
-        }
-        return `import * as ${component.moduleName} from '${component.path}';`;
-    })
-        .join('\n')}
-
-export const components = new Map();
-${packages
-        .map((p) => p.components.map((component) => `components.set('${component.componentName}', ${component.moduleName});\n`))
-        .flat()
-        .join('')}
-${componentFiles
-        .map((component) => `components.set('${isLazyLoadingModule(component.path)
-        ? removeDynamicModuleNameEnding(component.componentName)
-        : component.componentName}', ${isLazyLoadingModule(component.path)
-        ? removeDynamicModuleNameEnding(component.moduleName)
-        : component.moduleName});`)
-        .join('\n')}
-
-export const componentBuilder = new ComponentBuilder({ components });
-
-export const moduleFactory = componentBuilder.getModuleFactory();
-`;
-};
-exports.getComponentBuilderTemplate = getComponentBuilderTemplate;

package/dist/esm/ComponentBuilder.js

@@ -1,59 +0,0 @@
-/**
- * Nextjs implementation of component builder class for building components based on the configuration.
- */
-export class ComponentBuilder {
-    constructor(config) {
-        this.config = config;
-        /**
-         * SXA uses custom default export name
-         */
-        this.DEFAULT_EXPORT_NAME = 'Default';
-        this.components = new Map([...config.components]);
-    }
-    /**
-     * Creates a new instance of module factory
-     * Module factory provides a module (file) including all exports.
-     * Module can be imported dynamically or statically.
-     * @returns {ModuleFactory} Module factory implementation
-     */
-    getModuleFactory() {
-        return (componentName) => {
-            const component = this.components.get(componentName);
-            if (!component)
-                return null;
-            // check if module should be imported dynamically
-            if (component.module) {
-                return component.module();
-            }
-            return component;
-        };
-    }
-    /**
-     * Creates a new instance of component factory
-     * Component can be imported dynamically or statically.
-     * @param {object} [config] Component factory configuration
-     * @param {boolean} [config.isEditing] Indicates if component factory is used in editing mode
-     * @returns {ComponentFactory} Component factory implementation
-     */
-    getComponentFactory({ isEditing } = {}) {
-        return (componentName, exportName) => {
-            const component = this.components.get(componentName);
-            if (!component)
-                return null;
-            // check if component should be imported dynamically
-            if (component.element) {
-                // Editing mode doesn't work well with dynamic components in nextjs: dynamic components are not displayed without refresh after a rendering is added.
-                // This happens beacuse Sitecore editors simply insert updated HTML generated on server side. This conflicts with nextjs dynamic logic as no HTML gets rendered for dynamic component
-                // So we use require() to obtain dynamic components in editing mode while preserving dynamic logic for non-editing scenarios
-                // As we need to be able to seamlessly work with dynamic components in both editing and normal modes, different componentFactory functions will be passed to app
-                return component.element(isEditing);
-            }
-            if (exportName && exportName !== this.DEFAULT_EXPORT_NAME) {
-                return component[exportName];
-            }
-            return (component.Default ||
-                component.default ||
-                component);
-        };
-    }
-}

package/dist/esm/sharedTypes/module-factory.js

@@ -1 +0,0 @@
-export {};

package/dist/esm/tools/templating/generate-component-builder.js

@@ -1,63 +0,0 @@
-import path from 'path';
-import fs from 'fs';
-import { getComponentBuilderTemplate } from './templates/component-builder';
-import { getComponentList, } from '@sitecore-content-sdk/core/tools';
-import { watchItems } from './utils';
-// Default destination path for component builder
-const defaultComponentBuilderOutputPath = 'src/temp/componentBuilder.ts';
-const defaultComponentRootPath = 'src/components';
-/**
- * Generate component builder based on provided settings
- * @param {object} [settings] settings for component builder generation
- * @param {string} [settings.componentRootPath] path to components root
- * @param {string} [settings.componentBuilderOutputPath] path to component builder output
- * @param {PackageDefinition[]} [settings.packages] list of packages to include in component builder
- * @param {ComponentFile[]} [settings.components] list of components to include in component builder
- * @param {boolean} [settings.watch] whether to watch for changes to component builder sources
- */
-export function generateComponentBuilder({ componentRootPath = defaultComponentRootPath, componentBuilderOutputPath = defaultComponentBuilderOutputPath, packages = [], components = [], watch, } = {}) {
-    if (watch) {
-        watchComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components });
-    }
-    else {
-        writeComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components });
-    }
-}
-/**
- * Watch for changes to component builder sources
- * @param {object} settings settings for component builder generation
- * @param {string} settings.componentRootPath path to components root
- * @param {string} settings.componentBuilderOutputPath path to component builder output
- * @param {PackageDefinition[]} settings.packages list of packages to include in component builder
- * @param {ComponentFile[]} settings.components list of components to include in component builder
- */
-export function watchComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, }) {
-    console.log(`Watching for changes to component builder sources in ${componentRootPath}...`);
-    watchItems([componentRootPath], writeComponentBuilder.bind(null, {
-        componentRootPath,
-        componentBuilderOutputPath,
-        packages,
-        components,
-    }));
-}
-/**
- * Write component builder to file
- * @param {object} settings settings for component builder generation
- * @param {string} settings.componentRootPath path to components root
- * @param {string} settings.componentBuilderOutputPath path to component builder output
- * @param {PackageDefinition[]} settings.packages list of packages to include in component builder
- * @param {ComponentFile[]} settings.components list of components to include in component builder
- */
-export function writeComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, }) {
-    const items = [
-        ...packages,
-        ...components,
-        ...getComponentList(componentRootPath),
-    ];
-    const componentBuilderPath = path.resolve(componentBuilderOutputPath);
-    const fileContent = getComponentBuilderTemplate(items);
-    console.log(`Writing component builder to ${componentBuilderPath}`);
-    fs.writeFileSync(componentBuilderPath, fileContent, {
-        encoding: 'utf8',
-    });
-}

package/dist/esm/tools/templating/index.js

@@ -1,2 +0,0 @@
-export { generateComponentBuilder } from './generate-component-builder';
-export { getComponentBuilderTemplate } from './templates/component-builder';

package/dist/esm/tools/templating/templates/component-builder.js

@@ -1,55 +0,0 @@
-const isLazyLoadingModule = (componentPath) => componentPath.includes('.dynamic');
-const removeDynamicModuleNameEnding = (moduleName) => moduleName.replace(/\.?dynamic$/i, '');
-/**
- * Generate component builder template
- * @param {(PackageDefinition | ComponentFile)[]} components components to include in component builder
- * @returns generated component builder template
- */
-export const getComponentBuilderTemplate = (components) => {
-    const componentFiles = components.filter((component) => component.componentName);
-    const packages = components.filter((component) => component.components);
-    const hasLazyModules = componentFiles.find((component) => isLazyLoadingModule(component.path));
-    return `/* eslint-disable */
-// Do not edit this file, it is auto-generated at build time!
-// See scripts/generate-component-builder/index.ts to modify the generation of this file.
-
-${hasLazyModules ? "import dynamic from 'next/dynamic';" : ''}
-import { ComponentBuilder } from '@sitecore-content-sdk/nextjs';
-
-${packages
-        .map((pkg) => {
-        const list = pkg.components.map((c) => c.moduleName).join(', ');
-        return `import { ${list} } from '${pkg.name}';\n`;
-    })
-        .join('')}
-${componentFiles
-        .map((component) => {
-        if (isLazyLoadingModule(component.path)) {
-            const moduleName = removeDynamicModuleNameEnding(component.moduleName);
-            return `const ${moduleName} = {
-  module: () => import('${component.path}'),
-  element: (isEditing?: boolean) => isEditing ? require('${component.path}')?.default : dynamic(${moduleName}.module)
-}`;
-        }
-        return `import * as ${component.moduleName} from '${component.path}';`;
-    })
-        .join('\n')}
-
-export const components = new Map();
-${packages
-        .map((p) => p.components.map((component) => `components.set('${component.componentName}', ${component.moduleName});\n`))
-        .flat()
-        .join('')}
-${componentFiles
-        .map((component) => `components.set('${isLazyLoadingModule(component.path)
-        ? removeDynamicModuleNameEnding(component.componentName)
-        : component.componentName}', ${isLazyLoadingModule(component.path)
-        ? removeDynamicModuleNameEnding(component.moduleName)
-        : component.moduleName});`)
-        .join('\n')}
-
-export const componentBuilder = new ComponentBuilder({ components });
-
-export const moduleFactory = componentBuilder.getModuleFactory();
-`;
-};

package/types/ComponentBuilder.d.ts

@@ -1,59 +0,0 @@
-import { ComponentFactory, JssComponentType } from '@sitecore-content-sdk/react';
-import { Module, ModuleFactory } from './sharedTypes/module-factory';
-/**
- * Represents a component that can be imported dynamically
- */
-export type LazyModule = {
-    module: () => Promise<Module>;
-    element: (isEditing?: boolean) => JssComponentType;
-};
-/**
- * Component is a module or a lazy module
- */
-type Component = Module | LazyModule | JssComponentType;
-/**
- * Configuration for ComponentBuilder
- */
-export type ComponentBuilderConfig<Component> = {
-    /**
-     * List of components to be stored
-     */
-    components: Map<string, Component>;
-};
-/**
- * Configuration for ComponentFactory
- */
-type ComponentFactoryConfig = {
-    isEditing?: boolean;
-};
-/**
- * Nextjs implementation of component builder class for building components based on the configuration.
- */
-export declare class ComponentBuilder {
-    protected config: ComponentBuilderConfig<Component>;
-    /**
-     * List of components to be stored
-     */
-    protected components: Map<string, Component>;
-    /**
-     * SXA uses custom default export name
-     */
-    protected DEFAULT_EXPORT_NAME: string;
-    constructor(config: ComponentBuilderConfig<Component>);
-    /**
-     * Creates a new instance of module factory
-     * Module factory provides a module (file) including all exports.
-     * Module can be imported dynamically or statically.
-     * @returns {ModuleFactory} Module factory implementation
-     */
-    getModuleFactory(): ModuleFactory;
-    /**
-     * Creates a new instance of component factory
-     * Component can be imported dynamically or statically.
-     * @param {object} [config] Component factory configuration
-     * @param {boolean} [config.isEditing] Indicates if component factory is used in editing mode
-     * @returns {ComponentFactory} Component factory implementation
-     */
-    getComponentFactory({ isEditing }?: ComponentFactoryConfig): ComponentFactory;
-}
-export {};

package/types/sharedTypes/module-factory.d.ts

@@ -1,32 +0,0 @@
-import { ComponentType } from 'react';
-import { GetServerSideComponentProps, GetStaticComponentProps } from './component-props';
-/**
- * Represents a module (file)
- */
-export type Module = {
-    /**
-     * Default SXA export
-     */
-    Default?: ComponentType;
-    /**
-     * Default Next.js export
-     */
-    default?: ComponentType;
-    /**
-     * function for component level data fetching in SSR mode
-     */
-    getServerSideProps?: GetServerSideComponentProps;
-    /**
-     * function for component level data fetching in SSG mode
-     */
-    getStaticProps?: GetStaticComponentProps;
-} & {
-    /**
-     * Custom exports
-     */
-    [key: string]: ComponentType;
-};
-/**
- * Represents a module factory
- */
-export type ModuleFactory = (componentName: string) => Module | Promise<Module> | null;

package/types/tools/templating/generate-component-builder.d.ts

@@ -1,45 +0,0 @@
-import { ComponentFile, PackageDefinition } from '@sitecore-content-sdk/core/tools';
-/**
- * Generate component builder based on provided settings
- * @param {object} [settings] settings for component builder generation
- * @param {string} [settings.componentRootPath] path to components root
- * @param {string} [settings.componentBuilderOutputPath] path to component builder output
- * @param {PackageDefinition[]} [settings.packages] list of packages to include in component builder
- * @param {ComponentFile[]} [settings.components] list of components to include in component builder
- * @param {boolean} [settings.watch] whether to watch for changes to component builder sources
- */
-export declare function generateComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, watch, }?: {
-    componentRootPath?: string;
-    componentBuilderOutputPath?: string;
-    packages?: PackageDefinition[];
-    components?: ComponentFile[];
-    watch?: boolean;
-}): void;
-/**
- * Watch for changes to component builder sources
- * @param {object} settings settings for component builder generation
- * @param {string} settings.componentRootPath path to components root
- * @param {string} settings.componentBuilderOutputPath path to component builder output
- * @param {PackageDefinition[]} settings.packages list of packages to include in component builder
- * @param {ComponentFile[]} settings.components list of components to include in component builder
- */
-export declare function watchComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, }: {
-    componentRootPath: string;
-    componentBuilderOutputPath: string;
-    packages: PackageDefinition[];
-    components: ComponentFile[];
-}): void;
-/**
- * Write component builder to file
- * @param {object} settings settings for component builder generation
- * @param {string} settings.componentRootPath path to components root
- * @param {string} settings.componentBuilderOutputPath path to component builder output
- * @param {PackageDefinition[]} settings.packages list of packages to include in component builder
- * @param {ComponentFile[]} settings.components list of components to include in component builder
- */
-export declare function writeComponentBuilder({ componentRootPath, componentBuilderOutputPath, packages, components, }: {
-    componentRootPath: string;
-    componentBuilderOutputPath: string;
-    packages: PackageDefinition[];
-    components: ComponentFile[];
-}): void;

package/types/tools/templating/index.d.ts

@@ -1,2 +0,0 @@
-export { generateComponentBuilder } from './generate-component-builder';
-export { getComponentBuilderTemplate } from './templates/component-builder';

package/types/tools/templating/templates/component-builder.d.ts

@@ -1,7 +0,0 @@
-import { ComponentFile, PackageDefinition } from '@sitecore-content-sdk/core/tools';
-/**
- * Generate component builder template
- * @param {(PackageDefinition | ComponentFile)[]} components components to include in component builder
- * @returns generated component builder template
- */
-export declare const getComponentBuilderTemplate: (components: (PackageDefinition | ComponentFile)[]) => string;