@sitecore-jss/sitecore-jss-react 22.12.0-canary.3 → 22.12.0-canary.5

package/dist/cjs/components/DesignLibrary.js

@@ -28,7 +28,6 @@ const react_1 = __importStar(require("react"));
 const Placeholder_1 = require("./Placeholder");
 const layout_1 = require("@sitecore-jss/sitecore-jss/layout");
 const editing_1 = require("@sitecore-jss/sitecore-jss/editing");
-9;
 const DesignLibrary = (layoutData) => {
     const { route } = layoutData.sitecore;
     const isDesignLibrary = layoutData.sitecore.context.renderingType === layout_1.RenderingType.Component;

package/dist/cjs/components/ErrorBoundary.js

@@ -53,7 +53,7 @@ class ErrorBoundary extends react_1.default.Component {
             ((_b = this.props.sitecoreContext) === null || _b === void 0 ? void 0 : _b.pageState) === layout_1.LayoutServicePageState.Preview);
     }
     render() {
-        var _a;
+        var _a, _b;
         if (this.state.error) {
             if (this.props.errorComponent) {
                 return react_1.default.createElement(this.props.errorComponent, { error: this.state.error });
@@ -76,7 +76,7 @@ class ErrorBoundary extends react_1.default.Component {
             }
         }
         // do not apply suspense when suspense is disabled or when on already dynamic components
-        if (this.props.disableSuspense || this.props.isDynamic) {
+        if (((_b = this.props.disableSuspense) !== null && _b !== void 0 ? _b : true) || this.props.isDynamic) {
             return this.props.children;
         }
         return (react_1.default.createElement(react_1.Suspense, { fallback: react_1.default.createElement("h4", null, this.props.componentLoadingMessage || this.defaultLoadingMessage) }, this.props.children));

package/dist/cjs/components/PlaceholderCommon.js

@@ -93,7 +93,7 @@ class PlaceholderCommon extends react_1.default.Component {
         const _b = this.props, { name, fields: placeholderFields, params: placeholderParams, missingComponentComponent, hiddenRenderingComponent } = _b, placeholderProps = __rest(_b, ["name", "fields", "params", "missingComponentComponent", "hiddenRenderingComponent"]);
         const transformedComponents = placeholderData
             .map((rendering, index) => {
-            var _a, _b, _c;
+            var _a, _b;
             const key = rendering.uid
                 ? rendering.uid
                 : `component-${index}`;
@@ -150,14 +150,12 @@ class PlaceholderCommon extends react_1.default.Component {
                 const isByocWrapper = componentRendering.componentName === BYOCWrapper_1.BYOC_WRAPPER_RENDERING_NAME;
                 // all dynamic elements will have a separate render prop
                 const isDynamicComponent = !!((_a = component.render) === null || _a === void 0 ? void 0 : _a.preload);
-                const disableSuspense = this.props.disableSuspense ||
-                    ((_b = this.props.sitecoreContext) === null || _b === void 0 ? void 0 : _b.pageState) === layout_1.LayoutServicePageState.Edit;
                 // wrapping with error boundary could cause problems in case where parent component uses withPlaceholder HOC and tries to access its children props
                 // that's why we need to expose element's props here
-                rendered = (react_1.default.createElement(ErrorBoundary_1.default, Object.assign({ key: rendered.type + '-' + index, errorComponent: this.props.errorComponent, componentLoadingMessage: this.props.componentLoadingMessage, type: type, isDynamic: isDynamicComponent || isByocWrapper, disableSuspense: disableSuspense }, rendered.props), rendered));
+                rendered = (react_1.default.createElement(ErrorBoundary_1.default, Object.assign({ key: rendered.type + '-' + index, errorComponent: this.props.errorComponent, componentLoadingMessage: this.props.componentLoadingMessage, type: type, isDynamic: isDynamicComponent || isByocWrapper, disableSuspense: this.props.disableSuspense }, rendered.props), rendered));
             }
             // if editMode is equal to 'metadata' then emit shallow chromes for hydration in Pages
-            if (((_c = this.props.sitecoreContext) === null || _c === void 0 ? void 0 : _c.editMode) === layout_1.EditMode.Metadata) {
+            if (((_b = this.props.sitecoreContext) === null || _b === void 0 ? void 0 : _b.editMode) === layout_1.EditMode.Metadata) {
                 return (react_1.default.createElement(PlaceholderMetadata_1.PlaceholderMetadata, { key: key, rendering: rendering }, rendered));
             }
             return rendered;

package/dist/esm/components/DesignLibrary.js

@@ -2,7 +2,6 @@ import React, { useEffect, useMemo, useState } from 'react';
 import { Placeholder } from './Placeholder';
 import { EDITING_COMPONENT_ID, EDITING_COMPONENT_PLACEHOLDER, RenderingType, } from '@sitecore-jss/sitecore-jss/layout';
 import { DesignLibraryStatus, getDesignLibraryStatusEvent, addComponentUpdateHandler, } from '@sitecore-jss/sitecore-jss/editing';
-9;
 export const DesignLibrary = (layoutData) => {
     const { route } = layoutData.sitecore;
     const isDesignLibrary = layoutData.sitecore.context.renderingType === RenderingType.Component;

package/dist/esm/components/ErrorBoundary.js

@@ -28,7 +28,7 @@ class ErrorBoundary extends React.Component {
             ((_b = this.props.sitecoreContext) === null || _b === void 0 ? void 0 : _b.pageState) === LayoutServicePageState.Preview);
     }
     render() {
-        var _a;
+        var _a, _b;
         if (this.state.error) {
             if (this.props.errorComponent) {
                 return React.createElement(this.props.errorComponent, { error: this.state.error });
@@ -51,7 +51,7 @@ class ErrorBoundary extends React.Component {
             }
         }
         // do not apply suspense when suspense is disabled or when on already dynamic components
-        if (this.props.disableSuspense || this.props.isDynamic) {
+        if (((_b = this.props.disableSuspense) !== null && _b !== void 0 ? _b : true) || this.props.isDynamic) {
             return this.props.children;
         }
         return (React.createElement(Suspense, { fallback: React.createElement("h4", null, this.props.componentLoadingMessage || this.defaultLoadingMessage) }, this.props.children));

package/dist/esm/components/PlaceholderCommon.js

@@ -11,7 +11,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import React from 'react';
 import { MissingComponent } from './MissingComponent';
-import { EditMode, isDynamicPlaceholder, getDynamicPlaceholderPattern, LayoutServicePageState, } from '@sitecore-jss/sitecore-jss/layout';
+import { EditMode, isDynamicPlaceholder, getDynamicPlaceholderPattern, } from '@sitecore-jss/sitecore-jss/layout';
 import { constants } from '@sitecore-jss/sitecore-jss';
 import { convertAttributesToReactProps } from '../utils';
 import { HiddenRendering } from './HiddenRendering';
@@ -87,7 +87,7 @@ export class PlaceholderCommon extends React.Component {
         const _b = this.props, { name, fields: placeholderFields, params: placeholderParams, missingComponentComponent, hiddenRenderingComponent } = _b, placeholderProps = __rest(_b, ["name", "fields", "params", "missingComponentComponent", "hiddenRenderingComponent"]);
         const transformedComponents = placeholderData
             .map((rendering, index) => {
-            var _a, _b, _c;
+            var _a, _b;
             const key = rendering.uid
                 ? rendering.uid
                 : `component-${index}`;
@@ -144,14 +144,12 @@ export class PlaceholderCommon extends React.Component {
                 const isByocWrapper = componentRendering.componentName === BYOC_WRAPPER_RENDERING_NAME;
                 // all dynamic elements will have a separate render prop
                 const isDynamicComponent = !!((_a = component.render) === null || _a === void 0 ? void 0 : _a.preload);
-                const disableSuspense = this.props.disableSuspense ||
-                    ((_b = this.props.sitecoreContext) === null || _b === void 0 ? void 0 : _b.pageState) === LayoutServicePageState.Edit;
                 // wrapping with error boundary could cause problems in case where parent component uses withPlaceholder HOC and tries to access its children props
                 // that's why we need to expose element's props here
-                rendered = (React.createElement(ErrorBoundary, Object.assign({ key: rendered.type + '-' + index, errorComponent: this.props.errorComponent, componentLoadingMessage: this.props.componentLoadingMessage, type: type, isDynamic: isDynamicComponent || isByocWrapper, disableSuspense: disableSuspense }, rendered.props), rendered));
+                rendered = (React.createElement(ErrorBoundary, Object.assign({ key: rendered.type + '-' + index, errorComponent: this.props.errorComponent, componentLoadingMessage: this.props.componentLoadingMessage, type: type, isDynamic: isDynamicComponent || isByocWrapper, disableSuspense: this.props.disableSuspense }, rendered.props), rendered));
             }
             // if editMode is equal to 'metadata' then emit shallow chromes for hydration in Pages
-            if (((_c = this.props.sitecoreContext) === null || _c === void 0 ? void 0 : _c.editMode) === EditMode.Metadata) {
+            if (((_b = this.props.sitecoreContext) === null || _b === void 0 ? void 0 : _b.editMode) === EditMode.Metadata) {
                 return (React.createElement(PlaceholderMetadata, { key: key, rendering: rendering }, rendered));
             }
             return rendered;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sitecore-jss/sitecore-jss-react",
-  "version": "22.12.0-canary.3",
+  "version": "22.12.0-canary.5",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "sideEffects": false,
@@ -61,13 +61,13 @@
     "react-dom": "^19.1.0"
   },
   "dependencies": {
-    "@sitecore-jss/sitecore-jss": "22.12.0-canary.3",
+    "@sitecore-jss/sitecore-jss": "22.12.0-canary.5",
     "fast-deep-equal": "^3.1.3",
     "style-attr": "^1.3.0"
   },
   "description": "",
   "types": "types/index.d.ts",
-  "gitHead": "eaaf31b1bafdc080ab8e542c318e1117a22b9555",
+  "gitHead": "dac73b61fb7c3382c82e03d2e1ca7caedbc09108",
   "files": [
     "dist",
     "types"

package/types/components/PlaceholderCommon.d.ts

@@ -66,8 +66,11 @@ export interface PlaceholderProps {
      */
     componentLoadingMessage?: string;
     /**
-     * If true, disables Suspense for the placeholder.
-     * @default false
+     * @deprecated The `disableSuspense` prop is deprecated and will be removed in version 23.0.0.
+     * The default value is set to `true` to avoid forcing Suspense usage across all components which could negatively impact performance metrics. Suspense can now be enabled explicitly when needed.
+     *
+     * If `false`, enables Suspense in ErrorBoundary for the components rendered by placeholder.
+     * @default true
      */
     disableSuspense?: boolean;
 }