@sitecore-content-sdk/core 1.3.0-canary.9 → 1.4.0-canary.2

package/dist/esm/layout/content-styles.js

@@ -1,63 +1,64 @@
-import { SITECORE_EDGE_URL_DEFAULT } from '../constants';
-import { normalizeUrl } from '../utils/normalize-url';
-/**
- * Regular expression to check if the content styles are used in the field value
- */
-const CLASS_REGEXP = /class=".*(\bck-content\b).*"/g;
-/**
- * Get the content styles link to be loaded from the Sitecore Edge Platform
- * @param {LayoutServiceData} layoutData Layout service data
- * @param {string} sitecoreEdgeContextId Sitecore Edge Context ID
- * @param {string} [sitecoreEdgeUrl] Sitecore Edge Platform URL. Default is https://edge-platform.sitecorecloud.io
- * @returns {HTMLLink | null} content styles link, null if no styles are used in layout
- */
-export const getContentStylesheetLink = (layoutData, sitecoreEdgeContextId, sitecoreEdgeUrl = SITECORE_EDGE_URL_DEFAULT) => {
-    if (!layoutData.sitecore.route)
-        return null;
-    const config = { loadStyles: false };
-    traverseComponent(layoutData.sitecore.route, config);
-    if (!config.loadStyles)
-        return null;
-    return {
-        href: getContentStylesheetUrl(sitecoreEdgeContextId, sitecoreEdgeUrl),
-        rel: 'stylesheet',
-    };
-};
-export const getContentStylesheetUrl = (sitecoreEdgeContextId, sitecoreEdgeUrl = SITECORE_EDGE_URL_DEFAULT) => `${normalizeUrl(sitecoreEdgeUrl)}/v1/files/pages/styles/content-styles.css?sitecoreContextId=${sitecoreEdgeContextId}`;
-export const traversePlaceholder = (components, config) => {
-    if (config.loadStyles)
-        return;
-    components.forEach((component) => {
-        traverseComponent(component, config);
-    });
-};
-export const traverseField = (field, config) => {
-    if (!field || typeof field !== 'object' || config.loadStyles)
-        return;
-    if ('value' in field && typeof field.value === 'string') {
-        config.loadStyles = CLASS_REGEXP.test(field.value);
-    }
-    else if ('fields' in field) {
-        Object.values(field.fields).forEach((field) => {
-            traverseField(field, config);
-        });
-    }
-    else if (Array.isArray(field)) {
-        field.forEach((field) => {
-            traverseField(field, config);
-        });
-    }
-};
-export const traverseComponent = (component, config) => {
-    if (config.loadStyles)
-        return;
-    if ('fields' in component && component.fields) {
-        Object.values(component.fields).forEach((field) => {
-            traverseField(field, config);
-        });
-    }
-    const placeholders = component.placeholders || {};
-    Object.keys(placeholders).forEach((placeholder) => {
-        traversePlaceholder(placeholders[placeholder], config);
-    });
-};
+import { SITECORE_EDGE_URL_DEFAULT } from '../constants';
+import { normalizeUrl } from '../utils/normalize-url';
+/**
+ * Regular expression to check if the content styles are used in the field value
+ */
+const CLASS_REGEXP = /class=".*(\bck-content\b).*"/g;
+/**
+ * Get the content styles link to be loaded from the Sitecore Edge Platform
+ * @param {LayoutServiceData} layoutData Layout service data
+ * @param {string} sitecoreEdgeContextId Sitecore Edge Context ID
+ * @param {string} [sitecoreEdgeUrl] Sitecore Edge Platform URL. Default is https://edge-platform.sitecorecloud.io
+ * @returns {HTMLLink | null} content styles link, null if no styles are used in layout
+ * @public
+ */
+export const getContentStylesheetLink = (layoutData, sitecoreEdgeContextId, sitecoreEdgeUrl = SITECORE_EDGE_URL_DEFAULT) => {
+    if (!layoutData.sitecore.route)
+        return null;
+    const config = { loadStyles: false };
+    traverseComponent(layoutData.sitecore.route, config);
+    if (!config.loadStyles)
+        return null;
+    return {
+        href: getContentStylesheetUrl(sitecoreEdgeContextId, sitecoreEdgeUrl),
+        rel: 'stylesheet',
+    };
+};
+export const getContentStylesheetUrl = (sitecoreEdgeContextId, sitecoreEdgeUrl = SITECORE_EDGE_URL_DEFAULT) => `${normalizeUrl(sitecoreEdgeUrl)}/v1/files/pages/styles/content-styles.css?sitecoreContextId=${sitecoreEdgeContextId}`;
+export const traversePlaceholder = (components, config) => {
+    if (config.loadStyles)
+        return;
+    components.forEach((component) => {
+        traverseComponent(component, config);
+    });
+};
+export const traverseField = (field, config) => {
+    if (!field || typeof field !== 'object' || config.loadStyles)
+        return;
+    if ('value' in field && typeof field.value === 'string') {
+        config.loadStyles = CLASS_REGEXP.test(field.value);
+    }
+    else if ('fields' in field) {
+        Object.values(field.fields).forEach((field) => {
+            traverseField(field, config);
+        });
+    }
+    else if (Array.isArray(field)) {
+        field.forEach((field) => {
+            traverseField(field, config);
+        });
+    }
+};
+export const traverseComponent = (component, config) => {
+    if (config.loadStyles)
+        return;
+    if ('fields' in component && component.fields) {
+        Object.values(component.fields).forEach((field) => {
+            traverseField(field, config);
+        });
+    }
+    const placeholders = component.placeholders || {};
+    Object.keys(placeholders).forEach((placeholder) => {
+        traversePlaceholder(placeholders[placeholder], config);
+    });
+};

package/dist/esm/layout/index.js

@@ -1,6 +1,6 @@
-// layout
-export { LayoutServicePageState, EditMode, RenderingType, EDITING_COMPONENT_PLACEHOLDER, EDITING_COMPONENT_ID, } from './models';
-export { getFieldValue, getChildPlaceholder, isFieldValueEmpty, isDynamicPlaceholder, getDynamicPlaceholderPattern, EMPTY_DATE_FIELD_VALUE, } from './utils';
-export { getContentStylesheetLink } from './content-styles';
-export { LayoutService, GRAPHQL_LAYOUT_QUERY_NAME } from './layout-service';
-export { getDesignLibraryStylesheetLinks } from './themes';
+// layout
+export { LayoutServicePageState, EditMode, RenderingType, EDITING_COMPONENT_PLACEHOLDER, EDITING_COMPONENT_ID, } from './models';
+export { getFieldValue, getChildPlaceholder, isFieldValueEmpty, isDynamicPlaceholder, getDynamicPlaceholderPattern, EMPTY_DATE_FIELD_VALUE, } from './utils';
+export { getContentStylesheetLink } from './content-styles';
+export { LayoutService, GRAPHQL_LAYOUT_QUERY_NAME } from './layout-service';
+export { getDesignLibraryStylesheetLinks } from './themes';

package/dist/esm/layout/layout-service.js

@@ -1,56 +1,61 @@
-import debug from '../debug';
-import { SitecoreServiceBase } from '../sitecore-service-base';
-export const GRAPHQL_LAYOUT_QUERY_NAME = 'ContentSdkLayoutQuery';
-/**
- * Service that fetch layout data using Sitecore's GraphQL API.
- * @augments LayoutServiceBase
- * @mixes GraphQLRequestClient
- */
-export class LayoutService extends SitecoreServiceBase {
-    /**
-     * Fetch layout data using the Sitecore GraphQL endpoint.
-     * @param {LayoutServiceConfig} serviceConfig configuration
-     */
-    constructor(serviceConfig) {
-        super(serviceConfig);
-        this.serviceConfig = serviceConfig;
-    }
-    /**
-     * Fetch layout data for an item.
-     * @param {string} itemPath item path to fetch layout data for.
-     * @param {RouteOptions} [routeOptions] Request options like language and site to retrieve data for
-     * @param {FetchOptions} [fetchOptions] Options to override graphQL client details like retries and fetch implementation
-     * @returns {Promise<LayoutServiceData>} layout service data
-     */
-    async fetchLayoutData(itemPath, routeOptions, fetchOptions) {
-        var _a, _b;
-        const site = routeOptions.site;
-        const query = this.getLayoutQuery(itemPath, site, routeOptions === null || routeOptions === void 0 ? void 0 : routeOptions.locale);
-        debug.layout('fetching layout data for %s %s %s', itemPath, routeOptions === null || routeOptions === void 0 ? void 0 : routeOptions.locale, site);
-        const data = await this.graphQLClient.request(query, {}, fetchOptions);
-        // If `rendered` is empty -> not found
-        return (((_b = (_a = data === null || data === void 0 ? void 0 : data.layout) === null || _a === void 0 ? void 0 : _a.item) === null || _b === void 0 ? void 0 : _b.rendered) || {
-            sitecore: { context: { pageEditing: false, language: routeOptions === null || routeOptions === void 0 ? void 0 : routeOptions.locale }, route: null },
-        });
-    }
-    /**
-     * Returns GraphQL Layout query
-     * @param {string} itemPath page route
-     * @param {string} [site] site name
-     * @param {string} [language] language
-     * @returns {string} GraphQL query
-     */
-    getLayoutQuery(itemPath, site, language) {
-        const languageVariable = language ? `, language:"${language}"` : '';
-        const layoutQuery = this.serviceConfig.formatLayoutQuery
-            ? this.serviceConfig.formatLayoutQuery(site, itemPath, language)
-            : `layout(site:"${site}", routePath:"${itemPath}"${languageVariable})`;
+import debug from '../debug';
+import { SitecoreServiceBase } from '../sitecore-service-base';
+/**
+ * GraphQL layout query name
+ * @internal
+ */
+export const GRAPHQL_LAYOUT_QUERY_NAME = 'ContentSdkLayoutQuery';
+/**
+ * Service that fetch layout data using Sitecore's GraphQL API.
+ * @augments LayoutServiceBase
+ * @mixes GraphQLRequestClient
+ * @public
+ */
+export class LayoutService extends SitecoreServiceBase {
+    /**
+     * Fetch layout data using the Sitecore GraphQL endpoint.
+     * @param {LayoutServiceConfig} serviceConfig configuration
+     */
+    constructor(serviceConfig) {
+        super(serviceConfig);
+        this.serviceConfig = serviceConfig;
+    }
+    /**
+     * Fetch layout data for an item.
+     * @param {string} itemPath item path to fetch layout data for.
+     * @param {RouteOptions} [routeOptions] Request options like language and site to retrieve data for
+     * @param {FetchOptions} [fetchOptions] Options to override graphQL client details like retries and fetch implementation
+     * @returns {Promise<LayoutServiceData>} layout service data
+     */
+    async fetchLayoutData(itemPath, routeOptions, fetchOptions) {
+        var _a, _b;
+        const site = routeOptions.site;
+        const query = this.getLayoutQuery(itemPath, site, routeOptions === null || routeOptions === void 0 ? void 0 : routeOptions.locale);
+        debug.layout('fetching layout data for %s %s %s', itemPath, routeOptions === null || routeOptions === void 0 ? void 0 : routeOptions.locale, site);
+        const data = await this.graphQLClient.request(query, {}, fetchOptions);
+        // If `rendered` is empty -> not found
+        return (((_b = (_a = data === null || data === void 0 ? void 0 : data.layout) === null || _a === void 0 ? void 0 : _a.item) === null || _b === void 0 ? void 0 : _b.rendered) || {
+            sitecore: { context: { pageEditing: false, language: routeOptions === null || routeOptions === void 0 ? void 0 : routeOptions.locale }, route: null },
+        });
+    }
+    /**
+     * Returns GraphQL Layout query
+     * @param {string} itemPath page route
+     * @param {string} [site] site name
+     * @param {string} [language] language
+     * @returns {string} GraphQL query
+     */
+    getLayoutQuery(itemPath, site, language) {
+        const languageVariable = language ? `, language:"${language}"` : '';
+        const layoutQuery = this.serviceConfig.formatLayoutQuery
+            ? this.serviceConfig.formatLayoutQuery(site, itemPath, language)
+            : `layout(site:"${site}", routePath:"${itemPath}"${languageVariable})`;
         return `query ${GRAPHQL_LAYOUT_QUERY_NAME} {
       ${layoutQuery}{
         item {
           rendered
         }
       }
-    }`;
-    }
-}
+    }`;
+    }
+}

package/dist/esm/layout/models.js

@@ -1,31 +1,36 @@
-/**
- * Layout Service page state enum
- */
-export var LayoutServicePageState;
-(function (LayoutServicePageState) {
-    LayoutServicePageState["Preview"] = "preview";
-    LayoutServicePageState["Edit"] = "edit";
-    LayoutServicePageState["Normal"] = "normal";
-})(LayoutServicePageState || (LayoutServicePageState = {}));
-/**
- * Represents the edit mode for rendering content in Sitecore Editors
- */
-export var EditMode;
-(function (EditMode) {
-    EditMode["Metadata"] = "metadata";
-})(EditMode || (EditMode = {}));
-/**
- * Editing rendering type
- */
-export var RenderingType;
-(function (RenderingType) {
-    RenderingType["Component"] = "component";
-})(RenderingType || (RenderingType = {}));
-/**
- * Static placeholder name used for component rendering
- */
-export const EDITING_COMPONENT_PLACEHOLDER = 'editing-componentmode-placeholder';
-/**
- * Id of wrapper for component rendering
- */
-export const EDITING_COMPONENT_ID = 'editing-component';
+/**
+ * Layout Service page state enum
+ * @public
+ */
+export var LayoutServicePageState;
+(function (LayoutServicePageState) {
+    LayoutServicePageState["Preview"] = "preview";
+    LayoutServicePageState["Edit"] = "edit";
+    LayoutServicePageState["Normal"] = "normal";
+})(LayoutServicePageState || (LayoutServicePageState = {}));
+/**
+ * Represents the edit mode for rendering content in Sitecore Editors
+ * @public
+ */
+export var EditMode;
+(function (EditMode) {
+    EditMode["Metadata"] = "metadata";
+})(EditMode || (EditMode = {}));
+/**
+ * Editing rendering type
+ * @public
+ */
+export var RenderingType;
+(function (RenderingType) {
+    RenderingType["Component"] = "component";
+})(RenderingType || (RenderingType = {}));
+/**
+ * Static placeholder name used for component rendering
+ * @internal
+ */
+export const EDITING_COMPONENT_PLACEHOLDER = 'editing-componentmode-placeholder';
+/**
+ * Id of wrapper for component rendering
+ * @internal
+ */
+export const EDITING_COMPONENT_ID = 'editing-component';

package/dist/esm/layout/themes.js

@@ -1,70 +1,71 @@
-import { getFieldValue } from '.';
-import { SITECORE_EDGE_URL_DEFAULT } from '../constants';
-import { normalizeUrl } from '../utils/normalize-url';
-/**
- * Pattern for library ids
- * @example -library--foo
- */
-const STYLES_LIBRARY_ID_REGEX = /-library--([^\s]+)/;
-/**
- * Walks through rendering tree and returns list of links of all FEAAS, BYOC or SXA Design Library Stylesheets that are used
- * @param {LayoutServiceData} layoutData Layout service data
- * @param {string} sitecoreEdgeContextId Sitecore Edge Context ID
- * @param {string} [sitecoreEdgeUrl] Sitecore Edge Platform URL. Default is https://edge-platform.sitecorecloud.io
- * @returns {HTMLLink[]} library stylesheet links
- */
-export function getDesignLibraryStylesheetLinks(layoutData, sitecoreEdgeContextId, sitecoreEdgeUrl = SITECORE_EDGE_URL_DEFAULT) {
-    const ids = new Set();
-    if (!layoutData.sitecore.route)
-        return [];
-    traverseComponent(layoutData.sitecore.route, ids);
-    return [...ids].map((id) => ({
-        href: getStylesheetUrl(id, sitecoreEdgeContextId, sitecoreEdgeUrl),
-        rel: 'stylesheet',
-    }));
-}
-export const getStylesheetUrl = (id, sitecoreEdgeContextId, sitecoreEdgeUrl = SITECORE_EDGE_URL_DEFAULT) => {
-    return `${normalizeUrl(sitecoreEdgeUrl)}/v1/files/components/styles/${id}.css?sitecoreContextId=${sitecoreEdgeContextId}`;
-};
-/**
- * Traverse placeholder and components to add library ids
- * @param {ComponentRendering[]} components
- * @param {Set<string>} ids library ids
- */
-const traversePlaceholder = (components, ids) => {
-    components.map((component) => {
-        return traverseComponent(component, ids);
-    });
-};
-/**
- * Traverse component and children to add library ids
- * @param {RouteData | ComponentRendering | HtmlElementRendering} component component data
- * @param {Set<string>} ids library ids
- */
-const traverseComponent = (component, ids) => {
-    var _a, _b, _c, _d, _e, _f;
-    let libraryId = undefined;
-    if ('params' in component && component.params) {
-        // LibraryID in css class name takes precedence over LibraryId attribute
-        libraryId =
-            ((_b = (_a = component.params.CSSStyles) === null || _a === void 0 ? void 0 : _a.match(STYLES_LIBRARY_ID_REGEX)) === null || _b === void 0 ? void 0 : _b[1]) ||
-                ((_d = (_c = component.params.Styles) === null || _c === void 0 ? void 0 : _c.match(STYLES_LIBRARY_ID_REGEX)) === null || _d === void 0 ? void 0 : _d[1]) ||
-                component.params.LibraryId ||
-                undefined;
-    }
-    // if params are empty we try to fall back to data source
-    if (!libraryId && 'fields' in component && component.fields) {
-        libraryId =
-            ((_e = getFieldValue(component.fields, 'CSSStyles', '').match(STYLES_LIBRARY_ID_REGEX)) === null || _e === void 0 ? void 0 : _e[1]) ||
-                ((_f = getFieldValue(component.fields, 'Styles', '').match(STYLES_LIBRARY_ID_REGEX)) === null || _f === void 0 ? void 0 : _f[1]) ||
-                getFieldValue(component.fields, 'LibraryId', '') ||
-                undefined;
-    }
-    if (libraryId) {
-        ids.add(libraryId);
-    }
-    const placeholders = component.placeholders || {};
-    Object.keys(placeholders).forEach((placeholder) => {
-        traversePlaceholder(placeholders[placeholder], ids);
-    });
-};
+import { getFieldValue } from '.';
+import { SITECORE_EDGE_URL_DEFAULT } from '../constants';
+import { normalizeUrl } from '../utils/normalize-url';
+/**
+ * Pattern for library ids
+ * @example -library--foo
+ */
+const STYLES_LIBRARY_ID_REGEX = /-library--([^\s]+)/;
+/**
+ * Walks through rendering tree and returns list of links of all FEAAS, BYOC or SXA Design Library Stylesheets that are used
+ * @param {LayoutServiceData} layoutData Layout service data
+ * @param {string} sitecoreEdgeContextId Sitecore Edge Context ID
+ * @param {string} [sitecoreEdgeUrl] Sitecore Edge Platform URL. Default is https://edge-platform.sitecorecloud.io
+ * @returns {HTMLLink[]} library stylesheet links
+ * @public
+ */
+export function getDesignLibraryStylesheetLinks(layoutData, sitecoreEdgeContextId, sitecoreEdgeUrl = SITECORE_EDGE_URL_DEFAULT) {
+    const ids = new Set();
+    if (!layoutData.sitecore.route)
+        return [];
+    traverseComponent(layoutData.sitecore.route, ids);
+    return [...ids].map((id) => ({
+        href: getStylesheetUrl(id, sitecoreEdgeContextId, sitecoreEdgeUrl),
+        rel: 'stylesheet',
+    }));
+}
+export const getStylesheetUrl = (id, sitecoreEdgeContextId, sitecoreEdgeUrl = SITECORE_EDGE_URL_DEFAULT) => {
+    return `${normalizeUrl(sitecoreEdgeUrl)}/v1/files/components/styles/${id}.css?sitecoreContextId=${sitecoreEdgeContextId}`;
+};
+/**
+ * Traverse placeholder and components to add library ids
+ * @param {ComponentRendering[]} components
+ * @param {Set<string>} ids library ids
+ */
+const traversePlaceholder = (components, ids) => {
+    components.map((component) => {
+        return traverseComponent(component, ids);
+    });
+};
+/**
+ * Traverse component and children to add library ids
+ * @param {RouteData | ComponentRendering | HtmlElementRendering} component component data
+ * @param {Set<string>} ids library ids
+ */
+const traverseComponent = (component, ids) => {
+    var _a, _b, _c, _d, _e, _f;
+    let libraryId = undefined;
+    if ('params' in component && component.params) {
+        // LibraryID in css class name takes precedence over LibraryId attribute
+        libraryId =
+            ((_b = (_a = component.params.CSSStyles) === null || _a === void 0 ? void 0 : _a.match(STYLES_LIBRARY_ID_REGEX)) === null || _b === void 0 ? void 0 : _b[1]) ||
+                ((_d = (_c = component.params.Styles) === null || _c === void 0 ? void 0 : _c.match(STYLES_LIBRARY_ID_REGEX)) === null || _d === void 0 ? void 0 : _d[1]) ||
+                component.params.LibraryId ||
+                undefined;
+    }
+    // if params are empty we try to fall back to data source
+    if (!libraryId && 'fields' in component && component.fields) {
+        libraryId =
+            ((_e = getFieldValue(component.fields, 'CSSStyles', '').match(STYLES_LIBRARY_ID_REGEX)) === null || _e === void 0 ? void 0 : _e[1]) ||
+                ((_f = getFieldValue(component.fields, 'Styles', '').match(STYLES_LIBRARY_ID_REGEX)) === null || _f === void 0 ? void 0 : _f[1]) ||
+                getFieldValue(component.fields, 'LibraryId', '') ||
+                undefined;
+    }
+    if (libraryId) {
+        ids.add(libraryId);
+    }
+    const placeholders = component.placeholders || {};
+    Object.keys(placeholders).forEach((placeholder) => {
+        traversePlaceholder(placeholders[placeholder], ids);
+    });
+};