22.3.0 / 22.3.1

22.3.0 / 22.3.1

🐛 Bug Fixes

• [templates/angular-xmcloud] Navigation component link forces full page reload (#1958)
• [sitecore-jss-nextjs] Link component prefetches files (#1956)
• [templates/nextjs] [templates/react] [templates/angular] [templates/vue] Fixed an issue when environment variable is undefined (not present in .env), that produced an "undefined" value in generated config file (#1875)
• [templates/nextjs] Fix embedded personalization not rendering correctly after navigation through router links. (#1911)
• [template/angular] Prevent client-side dictionary API call when SSR data is available (#1930) (#1932)
• [sitecore-jss-angular] Fix default empty field components to not render the unwanted wrapping tags (#1937) (#1940)
• [sitecore-jss-angular] Fix image field style property not rendered properly (#1944)
• [sitecore-jss-angular] Fix nested dynamic placeholders not being displayed in Pages (#1947)
• [sitecore-jss-dev-tools] getMetadata() now uses npm query command to get the list and exact versions of packages. this solution works for monorepo setups (#1949)
• [templates/nextjs-sxa] Fix an alignment issue where components using both me-auto and ms-md-auto classes resulted in inconsistent alignment of elements. (#1946) (#1950) (#1955)
• [sitecore-jss-proxy] [sitecore-jss-nextjs] Fix for getCSPHeader so that it returns proper value for the CSP header when JSS_ALLOWED_ORIGINS lists multiple origins delimited with comma. (#1972)
• [sitecore-jss-proxy] Support Editing Host protection by handling OPTIONS preflight requests (#1976)
• [templates/nextjs] Disable x-powered-by header

🎉 New Features & Improvements

• [Beta] Angular support for XM Cloud with SPA Proxy:
  • [create-sitecore-jss] Introduced "node-xmcloud-proxy" addon (#1863)
  • [create-sitecore-jss] [template/angular] [template/angular-sxp] [template/angular-xmcloud] Introduced "angular-sxp", "angular-xmcloud" addons (#1838)(#1845)(#1858)(#1865):
    • The Angular app should now be initialized by providing both templates (or using CLI prompts):
      • SXP-based: 'angular,angular-sxp'
      • XMCloud-based: 'angular,angular-xmcloud'
    • Rework Angular initializer to support XMCloud and SXP journeys;
    • Add SXA styles to xmcloud addon
  • [create-sitecore-jss] [template/angular] [template/angular-xmcloud] [template/node-xmcloud-proxy] Edge Proxy / Context Id support (#1875)(#1885)
  • [create-sitecore-jss] Rework Angular initializer to support XMCloud and SXP journeys (#1845)(#1858)(#1868)(#1881)(#1882)(#1931)
    • [create-sitecore-jss] Allow node-xmcloud-proxy app to be installed alongside Angular SPA application
    • proxyAppDestination arg can be passed into create-sitecore-jss command to define path for proxy to be installed in
  • [templates/angular] [templates/angular-xmcloud] [template/node-xmcloud-proxy] [sitecore-jss-proxy] Introduced /api/editing/config endpoint (#1903)
  • [templates/angular] [templates/angular-xmcloud] [template/node-xmcloud-proxy] [sitecore-jss-proxy] Introduced /api/editing/render endpoint (#1908)
  • [templates/angular-xmcloud] [template/node-xmcloud-proxy] Personalization support (#1964#1971#1973)
  • [create-sitecore-jss] [sitecore-jss-angular] [template/angular-xmcloud] Angular SXA components
    • Angular placeholder now supports SXA components (#1870)
    • Component styles (#1917)
    • Title component (#1904)
    • Richtext component (#1864)
    • Container component (#1872)
    • Angular SXA layout (#1873)(#1880)(#1890)(#1906)
    • RowSplitter component(#1901)
    • LinkList component(#1898)
    • ColumnSplitter (#1889)
    • PartialDesignDynamicPlaceholder component (#1902)
    • Promo component (#1897)
    • PageContent component (#1905)
    • Navigation component (#1894)
  • [sitecore-jss-angular] Placeholder component will now render metadata code blocks when in Metadata Edit mode (#1918)
  • [sitecore-jss] [sitecore-jss-angular] Default Placeholder Content for empty fields in editMode metadata - in edit mode metadata in Pages, angular package field directives will render default or custom placeholder content if the provided field is empty; (#1916)
    • custom placeholder content can be provided to field directives by passing the corresponding input:
    • scDateEmptyFieldEditingTemplate for scDate
    • scGenericLinkEmptyFieldEditingTemplate for scGenericLink
    • scImageEmptyFieldEditingTemplate for scImage
    • scLinkEmptyFieldEditingTemplate for scLink
    • scRichTextEmptyFieldEditingTemplate for scRichText
    • scRouterLinkEmptyFieldEditingTemplate for scRouterLink
    • scTextEmptyFieldEditingTemplate for scText
  • [sitecore-jss-angular] [templates/angular-xmcloud] Render clientScripts / clientData. The new sc-editing-scripts component is exposed from sitecore-jss-angular package and required to be rendered on the page to enable Metadata Edit mode. (#1924)(#1948)
  • [sitecore-jss-angular] [templates/angular-xmcloud] XM Cloud Forms support (#1951):
    • New "Form" component is introduced in the sitecore-jss-angular package.
    • The Form component is declared in the Angular sample app.
    • Introduced plugins technique for component factory generation.
  • [template/node-xmcloud-proxy] [sitecore-jss-proxy] Introduced /api/healthz endpoint (#1928)
  • [sitecore-jss] [sitecore-jss-angular] Render field metdata chromes in editMode metadata - in edit mode metadata in Pages, angular package field directives will render wrapping code elements with field metadata required for editing; (#1926)
  • [angular-xmcloud] [sitecore-jss-angular] Analytics and CloudSDK integration
    • [angular-xmcloud] Add CloudSDK initialization on client side (#1952)(#1957)(#1961)
    • [angular-xmcloud] [sitecore-jss-angular] Add CDP Page View component to Angular XM Cloud add-on (#1957)
  • [templates/angular] Update dependencies and proxy build path value to be unix style path to support xmcloud deployment and monorepo starter kit in xmcloud foundation head (#1977)
  • [templates/angular] [templates/angular-sxp] [templates/angular-xmcloud] Updates for Angular XMC sample to work well with local containers and spa-starters monorepo in xmcloud-foundation (#1983)
  • [sitecore-jss-angular] [templates/angular] Integrate CloudSDK events firing (#1984)(#1990)
• [sitecore-jss] GenericFieldValue model is updated to accept Date type (#1916)
• [templates/vue] [sitecore-jss-vue] Vue version has been updated to 3.5 (#1995(#1970))

🛠 Breaking Change

• [sitecore-jss] Set FETCH_WITH.REST to 'REST' instead of 'Rest' (#1927):
  • The FETCH_WITH.REST constant has been updated to 'REST' instead of 'Rest' t...

22.2.1

22.2.1

🐛 Bug Fixes

• [sitecore-jss-react] [templates/nextjs-xmcloud] [BYOC] Form's submission is failing (#1966):

  • Updated @sitecore-feaas/clientside to v0.5.19.
  • Updated @sitecore/components to v2.0.1.
  • Passed rendering data to FEAAS.ExternalComponent.

  Make sure to update the relevant dependencies to be able to use the latest fixes.

• [sitecore-jss-react] [templates/nextjs-xmcloud] Updated @sitecore-cloudsdk to v0.4.1 (#1966)

22.2.0

22.2.0

🛠 Breaking Change

• [templates/nextjs-xmcloud] CloudSDK dependencies have been updated to 0.4.0 (#1933)
• [templates/nextjs-xmcloud] @sitecore/components dependency has been updated to 2.0.0 (#1933)
• [templates/nextjs-xmcloud] lib/context import has been removed. Values from temp/config can be used instead. (#1933)
• [sitecore-jss-nextjs] Context import and @sitecore-jss/sitecore-jss-nextjs/context submodule have been removed. (#1933)
• [sitecore-jss-nextjs] update personalize-middleware for CloudSDK 0.4.0 - pass enablePersonalizeCookie to CloudSDK.addPersonalize() function (#1963)

22.1.4

22.1.4

🐛 Bug Fixes

• [sitecore-jss-nextjs] [sitecore-jss] Resolved an issue with Netlify where URL query parameters were being sorted, causing redirect failures. Added a method to generate all possible permutations of query parameters, ensuring proper matching with URL patterns regardless of their order. (#1935)
• [sitecore-jss-nextjs] Fixed an issue with language-based redirects, ensuring users are correctly redirected to the appropriate language-specific pages rather than defaulting to the primary language. (#1938)

🎉 New Features & Improvements

• [sitecore-jss-nextjs] Expose MiddlewareBase class and MiddlewareBaseConfig type (#1941)
• [react] [nextjs] [angular] [vue] CacheClient, CacheOptions, MemoryCacheClient classes can now be imported into the app through corresponding a framework package (#1954)

21.8.0

21.8.0

🛠 Breaking Changes

[sitecore-jss-angular] [sitecore-jss-schematics] [templates/angular] Upgrade Angular to v17 (#1939)

• Updated Angular and core dependencies to ~17.3.11
• Updated Typescript to ~5.2.2
• Updated import statements from zone.js/dist/zone-node to zone.js

22.1.3

22.1.3

🐛 Bug Fixes

• [sitecore-jss-nextjs] Addressed an issue where the x-middleware-rewrite header caused redirects to fail during execution on Netlify. (#1915)
• [sitecore-jss-nextjs] Fixed incorrect behavior of redirects on Netlify service. This fix does not resolve issues related to multilingual redirects. (#1919)

22.1.2

22.1.2

🐛 Bug Fixes

• [sitecore-jss-nextjs] [templates/nextjs] Update nextjs to 14.2.7 (#1911)
  • Make sure to update your app to use the latest Next.js version 14.2.7. It will fix the case when Embedded Personalization / A/B Testing is not executed after navigating through the router links
• [sitecore-jss] Fix isEditorActive returning false in XMCloud Pages (#1912)
• [templates/nextjs] [XM Cloud] FEAAS / BYOC Components are not visible on the page with running A/B test (#1914)
  • Make sure to update the PagePropsFactory plugins order, these plugins should be executed after the page-props-factory\plugins\personalize.ts plugin to ensure that personalized layout data is used:
    • page-props-factory/plugins/component-themes.ts
    • page-props-factory/plugins/component-props.ts
• [sitecore-jss-nextjs] Resolved an issue with redirects that was caused by the x-middleware-next header in Next.js. This header prevented the flow from being interrupted properly, resulting in redirects not functioning correctly in certain cases. (#1899)

22.1.1

22.1.1

🎉 New Features & Improvements

• [XM Cloud] [Metadata Mode] [Next.js] API was changed, next.js preview data provides a new parameter layoutKind therefore, please make the necessary updates in the app in plugins/preview-mode.ts as shown in the following PR to experience a smooth upgrade.
• [sitecore-jss] [sitecore-jss-nextjs] Pass sc_layoutKind to GraphQLEditingService request header to support shared/final editing layouts (#1907)
• [sitecore-jss] GraphQLRequestClient's request method now supports dynamic headers based on specific request (#1907)

  client.request(query, variables, { headers })

22.1.0

22.1.0

🐛 Bug Fixes

• [templates/nextjs] [templates/react] [templates/vue] [templates/angular] Changed formatting in temp/config to prevent parse issues in Unix systems (#1787)(#1791)
• [sitecore-jss] GraphQLRequestClientFactory type is updated and config parameter is now optional. Since it should match GraphQLRequestClient.createClientFactory method return type (#1806)
• [templates/nextjs-sxa] The banner variant of image component is fixed with supporting metadata mode. (#1826)
• [sitecore-jss] [sitecore-jss-react] DateField empty value is not treated as empty (#1836)
• [templates/nextjs-sxa] Fix styles of title component in metadata mode. (#1839)
• [templates/nextjs-sxa] Fix missing value of field property in Title component. (#1842)
• [templates/nextjs-sxa] The background image in the Container component was being generated from the image ID instead of the mediaUrl parameter. This fix changes that behavior. (#1879)
• [templates/nextjs-sxa] The caption of image component has been fixed. (#1874)
• [sitecore-jss-nextjs] A bug has been fixed in the redirect middleware that occurred when a user clicked on a link rendered by the Link component from the Next.js library(next/link). (#1876) (#1891) (#1893)(#1895)
• [sitecore-jss-nextjs] Disable nextjs image optimization in edit and preview modes. This prevents rendering issues in XM Cloud Pages Edit and Preview.

🎉 New Features & Improvements

• [sitecore-jss-react] Introduce ErrorBoundary component. All rendered components are wrapped with it and it will catch client or server side errors from any of its children, display appropriate message and prevent the rest of the application from failing. It accepts and can display custom error component and loading message if it is passed as a prop to parent Placeholder. (#1786)(#1790)(#1793)(#1794)(#1799)(#1807)(#1829)
• [sitecore-jss-nextjs] Enforce CORS policy that matches Sitecore Pages domains for editing middleware API endpoints (#1798#1801)
• [sitecore-jss] GraphQLRequestClient now can accept custom 'headers' in the constructor or via createClientFactory (#1806)
• [templates/nextjs] Removed cors header for API endpoints from lib/next-config/plugins/cors-header plugin since cors is handled by API handlers / middlewares (#1806)
• [sitecore-jss-nextjs] Updates to Next.js editing integration to further support secure hosting scenarios (on XM Cloud & Vercel) (#1832)
• [templates/nextjs-xmcloud] [sitecore-jss] JSS is now ready to support A/B testing and component-level personalization. This feature will be enabled in Pages after the current release. (#1844)(#1847)(#1848)
• [sitecore-jss] [nextjs-xmcloud] DictionaryService can now use a site GraphQL query instead of search one to improve performance. This is currently only available for XMCloud deployments and is enabled with nextjs-xmcloud add-on by default (#1804)(#1846)(commit)(commit)(commit)(commit)
• [templates/nextjs-sxa] SXA components now use the NextImage component instead of the Image component from JSS lib for image optimization (#1843)(#1850)(#1860)
• [sitecore-jss-react] [sitecore-jss-nextjs] [sitecore-jss-angular] [sitecore-jss-vue] The default Hidden Rendering component now contains the text 'The component is hidden' (#1857)

🛠 Breaking Change

• Editing Integration Support: (#1776)(#1792)(#1773)(#1797)(#1800)(#1803)(#1806)(#1809)(#1814)(#1816)(#1819)(#1828)(#1835)(#1849)(#1831)(#1853)(#1854)(#1857)(#1862)(#1883)
  • [sitecore-jss-react] Introduces PlaceholderMetadata component which supports the hydration of chromes on Pages by rendering the components and placeholders with required metadata.
  • [sitecore-jss] Chromes are hydrated based on the basis of new editMode property derived from LayoutData, which is defined as an enum consisting of metadata and chromes.
  • ComponentConsumerProps is removed. You might need to reuse WithSitecoreContextProps type.
  • [sitecore-jss-react] [sitecore-jss-nextjs] Introduce FieldMetadata component and functionality to render it when metadata field property is provided in the field's layout data. In such case the field component is wrapped with metadata markup to enable chromes hydration when editing in pages. Ability to render metadata has been added to the field rendering components for react and nextjs.
  • [sitecore-jss-react] Introduced EditingScripts component to render clientScripts / clientData in editing.
  • [sitecore-jss-nextjs] [template/nextjs-xmlcoud] Add editMode to /editing/config endpoint response with configurable integration option.
  • [sitecore-jss-nextjs] Integrated a new Metadata Edit Mode in /api/editing/render endpoint.
    • Exported new EditingMetadataPreviewData type and isEditingMetadataPreviewData guard function.
  • [sitecore-jss] Introduced GraphQLEditingService class to fetch editing data in Metadata Edit Mode.
  • [templates/nextjs-xmcloud] Introduced /lib/graphql-editing-service to fetch editing data in Metadata Edit Mode.
  • [templates/nextjs-xmcloud] Added a new page-props-factory/plugins/preview-mode plugin to handle both Chromes and Metadata Edit Mode.
  • [sitecore-jss] layout-personalizer will mark components hidden by personalization by setting 'Hidden Rendering' component name in Metadata edit mode
• [sitecore-jss] Introduced /editing submodule that contains all editing related functionality. Editing utils are now available in /editing submodule. Editing utils exported from /utils marked as deprecated. (#1806)
• [sitecore-jss-nextjs] EditingRenderMiddleware resolvePageUrl function now accepts an object (args: { serverUrl?: string; itemPath: string }) => string instead of multiple parameters (serverUrl: string, itemPath: string) => string. serverUrl is now optional and omitted when Metadata Edit Mode is used.
• [templates/nextjs] [sitecore-jss-nextjs] [sitecore-jss] Remove Partial rendering implementation as it will not be used by Pages in its current implementation - includes removing of EditingComponentPlaceholder component, few constants associated with it and RenderingType enum (#1821)
• [sitecore-jss-angular] [sitecore-jss-schematics] [templates/angular] Upgrade Angular to v17 (#1837) (#1841)
  • Updated Angular and core dependencies to ~17.3.11
  • Updated Typescript to ~5.2.2
  • Updated import statements from zone.js/dist/zone-node to zone.js
• [sitecore-jss/personalize] [sitecore-jss-nextjs] CdpHelper.getPersonalizedRewrite signature changed to accept variantIds: string[] as second parameter. CdpHelper.getContentId was renamed to CdpHelper.getPageFriendlyId. (#1848)

🧹 Chores

• Update node/types to version 20 in all packages and samples (#1810)
• Github - Teams integration (#1823)
• [nextjs] Add sharp dependenc...

20.4.0

20.4.0

🛠 Breaking Changes

• [sitecore-jss-nextjs] [nextjs] Update nextjs to version 13 (#1830)
• [sitecore-jss-react] [sitecore-jss-forms-react] [react] Update react to version 18 (#1830)
• [sitecore-jss-nextjs] [nextjs] [sitecore-jss-react] [sitecore-jss-forms] [react] Update typescript to version 4.9 (#1830)