@sitecore-content-sdk/react 0.1.0-beta.35 → 0.1.0-beta.36

package/dist/cjs/components/EditingScripts.js

@@ -8,17 +8,30 @@ const react_1 = __importDefault(require("react"));
 const layout_1 = require("@sitecore-content-sdk/core/layout");
 const withSitecoreContext_1 = require("../enhancers/withSitecoreContext");
 const editing_1 = require("@sitecore-content-sdk/core/editing");
+const editing_2 = require("@sitecore-content-sdk/core/editing");
 /**
- * Renders client scripts and data for editing/preview mode in Pages.
+ * Renders client scripts and data for editing/preview mode for Pages.
+ * Renders script required for the Design Library (when RenderingType is `component`).
+ * @param {EditingScriptsProps} props - The props for the EditingScripts component.
+ * @param {string} props.sitecoreEdgeUrl - Sitecore Edge Platform URL.
+ * @returns A JSX element containing the editing scripts or an empty fragment if not in editing/preview mode.
  */
-const EditingScripts = () => {
-    const { sitecoreContext: { pageState, clientData, clientScripts }, } = (0, withSitecoreContext_1.useSitecoreContext)();
-    // Don't render anything if not in editing/preview mode
-    if (pageState === layout_1.LayoutServicePageState.Normal ||
-        pageState === layout_1.LayoutServicePageState.Preview ||
-        !pageState) {
+const EditingScripts = (props) => {
+    const { sitecoreContext: { pageState, clientData, clientScripts, renderingType }, } = (0, withSitecoreContext_1.useSitecoreContext)();
+    // Don't render anything if not in editing/preview mode and rendering type is not component
+    if (renderingType !== layout_1.RenderingType.Component &&
+        (pageState === layout_1.LayoutServicePageState.Normal ||
+            pageState === layout_1.LayoutServicePageState.Preview ||
+            !pageState)) {
         return react_1.default.createElement(react_1.default.Fragment, null);
     }
+    // In case of RenderingType.Component - render only the script for Design Libnrary
+    if (renderingType === layout_1.RenderingType.Component) {
+        // Add cache buster to the script URL
+        const scriptUrl = `${(0, editing_2.getDesignLibraryScriptLink)(props.sitecoreEdgeUrl)}?cb=${Date.now()}`;
+        return (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement("script", { src: scriptUrl, suppressHydrationWarning: true })));
+    }
     const jssClientData = Object.assign(Object.assign({}, clientData), (0, editing_1.getJssPagesClientData)());
     return (react_1.default.createElement(react_1.default.Fragment, null, clientScripts === null || clientScripts === void 0 ? void 0 :
         clientScripts.map((src, index) => (react_1.default.createElement("script", { src: src, key: index }))),

package/dist/esm/components/EditingScripts.js

@@ -1,18 +1,31 @@
 import React from 'react';
-import { LayoutServicePageState } from '@sitecore-content-sdk/core/layout';
+import { LayoutServicePageState, RenderingType } from '@sitecore-content-sdk/core/layout';
 import { useSitecoreContext } from '../enhancers/withSitecoreContext';
 import { getJssPagesClientData } from '@sitecore-content-sdk/core/editing';
+import { getDesignLibraryScriptLink } from '@sitecore-content-sdk/core/editing';
 /**
- * Renders client scripts and data for editing/preview mode in Pages.
+ * Renders client scripts and data for editing/preview mode for Pages.
+ * Renders script required for the Design Library (when RenderingType is `component`).
+ * @param {EditingScriptsProps} props - The props for the EditingScripts component.
+ * @param {string} props.sitecoreEdgeUrl - Sitecore Edge Platform URL.
+ * @returns A JSX element containing the editing scripts or an empty fragment if not in editing/preview mode.
  */
-export const EditingScripts = () => {
-    const { sitecoreContext: { pageState, clientData, clientScripts }, } = useSitecoreContext();
-    // Don't render anything if not in editing/preview mode
-    if (pageState === LayoutServicePageState.Normal ||
-        pageState === LayoutServicePageState.Preview ||
-        !pageState) {
+export const EditingScripts = (props) => {
+    const { sitecoreContext: { pageState, clientData, clientScripts, renderingType }, } = useSitecoreContext();
+    // Don't render anything if not in editing/preview mode and rendering type is not component
+    if (renderingType !== RenderingType.Component &&
+        (pageState === LayoutServicePageState.Normal ||
+            pageState === LayoutServicePageState.Preview ||
+            !pageState)) {
         return React.createElement(React.Fragment, null);
     }
+    // In case of RenderingType.Component - render only the script for Design Libnrary
+    if (renderingType === RenderingType.Component) {
+        // Add cache buster to the script URL
+        const scriptUrl = `${getDesignLibraryScriptLink(props.sitecoreEdgeUrl)}?cb=${Date.now()}`;
+        return (React.createElement(React.Fragment, null,
+            React.createElement("script", { src: scriptUrl, suppressHydrationWarning: true })));
+    }
     const jssClientData = Object.assign(Object.assign({}, clientData), getJssPagesClientData());
     return (React.createElement(React.Fragment, null, clientScripts === null || clientScripts === void 0 ? void 0 :
         clientScripts.map((src, index) => (React.createElement("script", { src: src, key: index }))),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sitecore-content-sdk/react",
-  "version": "0.1.0-beta.35",
+  "version": "0.1.0-beta.36",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "sideEffects": false,
@@ -67,13 +67,13 @@
     "react-dom": "^18.2.0"
   },
   "dependencies": {
-    "@sitecore-content-sdk/core": "0.1.0-beta.35",
+    "@sitecore-content-sdk/core": "0.1.0-beta.36",
     "fast-deep-equal": "^3.1.3",
     "prop-types": "^15.8.1"
   },
   "description": "",
   "types": "types/index.d.ts",
-  "gitHead": "160a0bdb91edbe88e3382e0ee1503203024c09b0",
+  "gitHead": "1a28b6590a0f8ef4d9e897f057f47abb01976998",
   "files": [
     "dist",
     "types"

package/types/components/EditingScripts.d.ts

@@ -1,4 +1,17 @@
 /**
- * Renders client scripts and data for editing/preview mode in Pages.
+ * Props for the EditingScripts component.
  */
-export declare const EditingScripts: () => JSX.Element;
+export type EditingScriptsProps = {
+    /**
+     * Sitecore Edge Platform URL.
+     */
+    sitecoreEdgeUrl?: string;
+};
+/**
+ * Renders client scripts and data for editing/preview mode for Pages.
+ * Renders script required for the Design Library (when RenderingType is `component`).
+ * @param {EditingScriptsProps} props - The props for the EditingScripts component.
+ * @param {string} props.sitecoreEdgeUrl - Sitecore Edge Platform URL.
+ * @returns A JSX element containing the editing scripts or an empty fragment if not in editing/preview mode.
+ */
+export declare const EditingScripts: (props: EditingScriptsProps) => JSX.Element;