@sitecore-jss/sitecore-jss 21.1.1 → 21.2.0-canary.1

package/README.md

@@ -2,9 +2,9 @@
 
 This module is provided as a part of Sitecore JavaScript Rendering SDK. It contains the core JSS APIs (layout service) and utilities.
 
+<!---
+@TODO: Update to version 20.0.0 docs before release
+-->
+[Documentation](https://doc.sitecore.com/xp/en/developers/hd/190/sitecore-headless-development/sitecore-javascript-rendering-sdks--jss-.html)
 
-[Documentation (Experience Platform)](https://doc.sitecore.com/xp/en/developers/hd/210/sitecore-headless-development/sitecore-javascript-rendering-sdks--jss-.html)
-
-[Documentation (XM Cloud)](https://doc.sitecore.com/xmc/en/developers/xm-cloud/sitecore-javascript-rendering-sdks--jss-.html)
-
-[API reference documentation](/ref-docs/sitecore-jss/)
+[API reference documentation](/ref-docs/sitecore-jss/).

package/dist/cjs/feaas/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getFEAASLibraryStylesheetLinks = void 0;
+var themes_1 = require("./themes");
+Object.defineProperty(exports, "getFEAASLibraryStylesheetLinks", { enumerable: true, get: function () { return themes_1.getFEAASLibraryStylesheetLinks; } });

package/dist/cjs/feaas/themes.js

@@ -0,0 +1,64 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getStylesheetUrl = exports.getFEAASLibraryStylesheetLinks = exports.FEAAS_SERVER_URL = void 0;
+const layout_1 = require("../layout");
+/**
+ * Pattern for library ids
+ * @example -library--foo
+ */
+const FEAAS_LIBRARY_ID_REGEX = /-library--([^\s]+)/;
+exports.FEAAS_SERVER_URL = 'https://feaas.blob.core.windows.net';
+/**
+ * Walks through rendering tree and returns list of links of all FEAAS Component Library Stylesheets that are used
+ * @param {LayoutServiceData} layoutData Layout service data
+ * @param {string} [serverUrl] server URL, default is @see {FEAAS_SERVER_URL} url
+ * @returns {HTMLLink[]} library stylesheet links
+ */
+function getFEAASLibraryStylesheetLinks(layoutData, serverUrl) {
+    const ids = new Set();
+    if (!layoutData.sitecore.route)
+        return [];
+    traverseComponent(layoutData.sitecore.route, ids);
+    return [...ids].map((id) => ({ href: exports.getStylesheetUrl(id, serverUrl), rel: 'style' }));
+}
+exports.getFEAASLibraryStylesheetLinks = getFEAASLibraryStylesheetLinks;
+const getStylesheetUrl = (id, serverUrl) => `${serverUrl || exports.FEAAS_SERVER_URL}/styles/${id}/published.css`;
+exports.getStylesheetUrl = getStylesheetUrl;
+/**
+ * Traverse placeholder and components to add library ids
+ * @param {Array<ComponentRendering | HtmlElementRendering>} components
+ * @param {Set<string>} ids library ids
+ */
+const traversePlaceholder = (components, ids) => {
+    components.map((component) => {
+        const rendering = component;
+        return traverseComponent(rendering, 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;
+    let libraryId = undefined;
+    if ('fields' in component && component.fields) {
+        // LibraryID in css class name takes precedence over LibraryId attribute
+        libraryId =
+            ((_a = layout_1.getFieldValue(component.fields, 'CSSStyles', '').match(FEAAS_LIBRARY_ID_REGEX)) === null || _a === void 0 ? void 0 : _a[1]) ||
+                layout_1.getFieldValue(component.fields, 'LibraryId', '') ||
+                undefined;
+        // HTMLRendering its class attribute
+    }
+    else if ('attributes' in component && typeof component.attributes.class === 'string') {
+        libraryId = (_b = component.attributes.class.match(FEAAS_LIBRARY_ID_REGEX)) === null || _b === void 0 ? void 0 : _b[1];
+    }
+    if (libraryId) {
+        ids.add(libraryId);
+    }
+    const placeholders = component.placeholders || {};
+    Object.keys(placeholders).forEach((placeholder) => {
+        traversePlaceholder(placeholders[placeholder], ids);
+    });
+};

package/dist/cjs/models.js

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

package/dist/esm/feaas/index.js

@@ -0,0 +1 @@
+export { getFEAASLibraryStylesheetLinks } from './themes';

package/dist/esm/feaas/themes.js

@@ -0,0 +1,59 @@
+import { getFieldValue, } from '../layout';
+/**
+ * Pattern for library ids
+ * @example -library--foo
+ */
+const FEAAS_LIBRARY_ID_REGEX = /-library--([^\s]+)/;
+export const FEAAS_SERVER_URL = 'https://feaas.blob.core.windows.net';
+/**
+ * Walks through rendering tree and returns list of links of all FEAAS Component Library Stylesheets that are used
+ * @param {LayoutServiceData} layoutData Layout service data
+ * @param {string} [serverUrl] server URL, default is @see {FEAAS_SERVER_URL} url
+ * @returns {HTMLLink[]} library stylesheet links
+ */
+export function getFEAASLibraryStylesheetLinks(layoutData, serverUrl) {
+    const ids = new Set();
+    if (!layoutData.sitecore.route)
+        return [];
+    traverseComponent(layoutData.sitecore.route, ids);
+    return [...ids].map((id) => ({ href: getStylesheetUrl(id, serverUrl), rel: 'style' }));
+}
+export const getStylesheetUrl = (id, serverUrl) => `${serverUrl || FEAAS_SERVER_URL}/styles/${id}/published.css`;
+/**
+ * Traverse placeholder and components to add library ids
+ * @param {Array<ComponentRendering | HtmlElementRendering>} components
+ * @param {Set<string>} ids library ids
+ */
+const traversePlaceholder = (components, ids) => {
+    components.map((component) => {
+        const rendering = component;
+        return traverseComponent(rendering, 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;
+    let libraryId = undefined;
+    if ('fields' in component && component.fields) {
+        // LibraryID in css class name takes precedence over LibraryId attribute
+        libraryId =
+            ((_a = getFieldValue(component.fields, 'CSSStyles', '').match(FEAAS_LIBRARY_ID_REGEX)) === null || _a === void 0 ? void 0 : _a[1]) ||
+                getFieldValue(component.fields, 'LibraryId', '') ||
+                undefined;
+        // HTMLRendering its class attribute
+    }
+    else if ('attributes' in component && typeof component.attributes.class === 'string') {
+        libraryId = (_b = component.attributes.class.match(FEAAS_LIBRARY_ID_REGEX)) === null || _b === void 0 ? void 0 : _b[1];
+    }
+    if (libraryId) {
+        ids.add(libraryId);
+    }
+    const placeholders = component.placeholders || {};
+    Object.keys(placeholders).forEach((placeholder) => {
+        traversePlaceholder(placeholders[placeholder], ids);
+    });
+};

package/dist/esm/models.js

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

package/feaas.d.ts

@@ -0,0 +1 @@
+export * from './types/feaas/index';

package/feaas.js

@@ -0,0 +1 @@
+module.exports = require('./dist/cjs/feaas/index');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sitecore-jss/sitecore-jss",
-  "version": "21.1.1",
+  "version": "21.2.0-canary.1",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "sideEffects": false,
@@ -45,7 +45,7 @@
     "chai-string": "^1.5.0",
     "del-cli": "^5.0.0",
     "eslint": "^7.15.0",
-    "mocha": "^9.1.3",
+    "mocha": "^10.2.0",
     "nock": "^13.0.5",
     "nyc": "^15.1.0",
     "ts-node": "^8.4.1",
@@ -64,7 +64,7 @@
   },
   "description": "",
   "types": "types/index.d.ts",
-  "gitHead": "ae9d7fc994fa11061b5a164ff6a86b3ccf845a4c",
+  "gitHead": "dc42835a8d9241ab050938f45c795a795a1a190a",
   "files": [
     "dist",
     "types",

package/types/feaas/index.d.ts

@@ -0,0 +1 @@
+export { getFEAASLibraryStylesheetLinks } from './themes';

package/types/feaas/themes.d.ts

@@ -0,0 +1,11 @@
+import { LayoutServiceData } from '../layout';
+import { HTMLLink } from '../models';
+export declare const FEAAS_SERVER_URL = "https://feaas.blob.core.windows.net";
+/**
+ * Walks through rendering tree and returns list of links of all FEAAS Component Library Stylesheets that are used
+ * @param {LayoutServiceData} layoutData Layout service data
+ * @param {string} [serverUrl] server URL, default is @see {FEAAS_SERVER_URL} url
+ * @returns {HTMLLink[]} library stylesheet links
+ */
+export declare function getFEAASLibraryStylesheetLinks(layoutData: LayoutServiceData, serverUrl?: string): HTMLLink[];
+export declare const getStylesheetUrl: (id: string, serverUrl?: string | undefined) => string;

package/types/index.d.ts

@@ -5,4 +5,5 @@ export { GraphQLClient, GraphQLRequestClient, GraphQLRequestClientConfig, } from
 export { AxiosDataFetcher, AxiosDataFetcherConfig } from './axios-fetcher';
 export { AxiosResponse } from 'axios';
 export { NativeDataFetcher, NativeDataFetcherConfig } from './native-fetcher';
+export { HTMLLink } from './models';
 export { constants };

package/types/models.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Html <link> tag data model
+ */
+export declare type HTMLLink = {
+    [key: string]: unknown;
+} & Pick<HTMLLinkElement, 'rel' | 'href'>;