Sitecore · sc-esariupendri · Jan 20, 2026 · Jan 22, 2026 · Jan 22, 2026 · Jan 21, 2026
diff --git a/examples/kit-nextjs-article-starter/.gitignore b/examples/kit-nextjs-article-starter/.gitignore
@@ -32,3 +32,4 @@
 !.sitecore/component-map.ts
 !.sitecore/component-map.client.ts
 !.sitecore/import-map.ts
+.jest-cache
diff --git a/examples/kit-nextjs-article-starter/.prettierrc b/examples/kit-nextjs-article-starter/.prettierrc
@@ -0,0 +1,8 @@
+{
+    "endOfLine": "auto",
+    "semi": true,
+    "singleQuote": true,
+    "tabWidth": 2,
+    "trailingComma": "es5",
+    "printWidth": 100
+}
diff --git a/examples/kit-nextjs-article-starter/src/Layout.tsx b/examples/kit-nextjs-article-starter/src/Layout.tsx
@@ -55,21 +55,16 @@ const Layout = ({ page }: LayoutProps): JSX.Element => {
   const classNamesMain = `${mainClassPageEditing} ${body.variable} ${heading.variable} main-layout`;
 
   const metaTitle =
-    fields?.metadataTitle?.value?.toString() ||
-    fields?.pageTitle?.value?.toString() ||
-    'Page';
+    fields?.metadataTitle?.value?.toString() || fields?.pageTitle?.value?.toString() || 'Page';
   const metaDescription =
-    fields?.metadataDescription?.value?.toString() ||
-    fields?.pageSummary?.value?.toString() ||
-    '';
+    fields?.metadataDescription?.value?.toString() || fields?.pageSummary?.value?.toString() || '';
   const metaKeywords = fields?.metadataKeywords?.value?.toString() || '';
   const ogTitle =
     fields?.ogTitle?.value?.toString() ||
     fields?.metadataTitle?.value?.toString() ||
     fields?.pageTitle?.value?.toString() ||
     'Page';
-  const ogImage =
-    fields?.ogImage?.value?.src || fields?.thumbnailImage?.value?.src;
+  const ogImage = fields?.ogImage?.value?.src || fields?.thumbnailImage?.value?.src;
   const ogDescription =
     fields?.ogDescription?.value?.toString() ||
     fields?.metadataDescription?.value?.toString() ||
@@ -82,15 +77,11 @@ const Layout = ({ page }: LayoutProps): JSX.Element => {
       <Head>
         <link rel="preconnect" href="https://edge-platform.sitecorecloud.io" />
         <title>{metaTitle}</title>
-        {metaDescription && (
-          <meta name="description" content={metaDescription} />
-        )}
+        {metaDescription && <meta name="description" content={metaDescription} />}
         {metaKeywords && <meta name="keywords" content={metaKeywords} />}
         <link rel="icon" href="/favicon.ico" />
         {ogTitle && <meta property="og:title" content={ogTitle} />}
-        {ogDescription && (
-          <meta property="og:description " content={ogDescription} />
-        )}
+        {ogDescription && <meta property="og:description " content={ogDescription} />}
         {ogImage && <meta property="og:image " content={ogImage} />}
       </Head>
       <Providers page={page}>
@@ -102,9 +93,7 @@ const Layout = ({ page }: LayoutProps): JSX.Element => {
                 page={page}
                 rendering={route}
                 componentMap={componentMap}
-                loadServerImportMap={() =>
-                  import('.sitecore/import-map.server')
-                }
+                loadServerImportMap={() => import('.sitecore/import-map.server')}
               />
             )
           ) : (

diff --git a/examples/kit-nextjs-article-starter/src/app/[site]/[locale]/[[...path]]/not-found.tsx b/examples/kit-nextjs-article-starter/src/app/[site]/[locale]/[[...path]]/not-found.tsx
@@ -8,7 +8,6 @@ import Layout from 'src/Layout';
 import Providers from 'src/Providers';
 import { NextIntlClientProvider } from 'next-intl';
 
-
 export default async function NotFound() {
   const headersList = await headers();
   const { site, locale } = parseRewriteHeader(headersList);

diff --git a/examples/kit-nextjs-article-starter/src/app/[site]/[locale]/[[...path]]/page.tsx b/examples/kit-nextjs-article-starter/src/app/[site]/[locale]/[[...path]]/page.tsx
@@ -48,11 +48,7 @@ export default async function Page({ params, searchParams }: PageProps) {
   }
 
   // Fetch the component data from Sitecore (Likely will be deprecated)
-  const componentProps = await client.getComponentData(
-    page.layout,
-    {},
-    components,
-  );
+  const componentProps = await client.getComponentData(page.layout, {}, components);
 
   return (
     <NextIntlClientProvider>
@@ -75,10 +71,7 @@ export const generateStaticParams = async () => {
           .filter((site: SiteInfo) => site.name === defaultSite)
           .map((site: SiteInfo) => site.name)
       : sites.map((site: SiteInfo) => site.name);
-    return await client.getAppRouterStaticParams(
-      allowedSites,
-      routing.locales.slice(),
-    );
+    return await client.getAppRouterStaticParams(allowedSites, routing.locales.slice());
   }
   return [];
 };
@@ -95,31 +88,20 @@ export const generateMetadata = async ({ params }: PageProps) => {
   // The same call as for rendering the page. Should be cached by default react behavior
   const page = await client.getPage(path ?? [], { site, locale });
   return {
-    title:
-      (
-        page?.layout.sitecore.route?.fields as RouteFields
-      )?.Title?.value?.toString() || 'Page',
+    title: (page?.layout.sitecore.route?.fields as RouteFields)?.Title?.value?.toString() || 'Page',
     description:
-      (
-        page?.layout.sitecore.route?.fields as RouteFields
-      )?.ogDescription?.value?.toString() ||
+      (page?.layout.sitecore.route?.fields as RouteFields)?.ogDescription?.value?.toString() ||
       'Sitecore Next.js App Router Example',
     openGraph: {
       title:
-        (
-          page?.layout.sitecore.route?.fields as RouteFields
-        )?.ogTitle?.value?.toString() || 'Page',
+        (page?.layout.sitecore.route?.fields as RouteFields)?.ogTitle?.value?.toString() || 'Page',
       description:
-        (
-          page?.layout.sitecore.route?.fields as RouteFields
-        )?.ogDescription?.value?.toString() ||
+        (page?.layout.sitecore.route?.fields as RouteFields)?.ogDescription?.value?.toString() ||
         'Sitecore Next.js App Router Example',
       url: url,
       images:
-        (page?.layout.sitecore.route?.fields as RouteFields)?.ogImage?.value
-          ?.src ||
-        (page?.layout.sitecore.route?.fields as RouteFields)?.thumbnailImage
-          ?.value?.src,
+        (page?.layout.sitecore.route?.fields as RouteFields)?.ogImage?.value?.src ||
+        (page?.layout.sitecore.route?.fields as RouteFields)?.thumbnailImage?.value?.src,
     },
   };
 };
diff --git a/examples/kit-nextjs-article-starter/src/app/layout.tsx b/examples/kit-nextjs-article-starter/src/app/layout.tsx
@@ -1,10 +1,6 @@
 import './globals.css';
 
-export default function RootLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
+export default function RootLayout({ children }: { children: React.ReactNode }) {
   return (
     <html lang="en" suppressHydrationWarning>
       <body>{children}</body>

diff --git a/examples/kit-nextjs-article-starter/src/assets/styles/column-splitter.css b/examples/kit-nextjs-article-starter/src/assets/styles/column-splitter.css
@@ -5,4 +5,3 @@
     @apply px-[5px];
   }
 }
-
diff --git a/examples/kit-nextjs-article-starter/src/assets/styles/tailwind-bootstrap-grid.css b/examples/kit-nextjs-article-starter/src/assets/styles/tailwind-bootstrap-grid.css
@@ -367,4 +367,3 @@
 .offset-xxl-11 {
   @apply 2xl:offset-11;
 }
-
diff --git a/examples/kit-nextjs-article-starter/src/components/article-header/ArticleHeader.tsx b/examples/kit-nextjs-article-starter/src/components/article-header/ArticleHeader.tsx
@@ -5,14 +5,7 @@ import { useState, useEffect, useRef } from 'react';
 import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
 import { Facebook, Linkedin, Twitter, Link, Check, Mail } from 'lucide-react';
 import { cn } from '@/lib/utils';
-import {
-  Field,
-  Item,
-  ImageField,
-  LinkField,
-  Text,
-  DateField,
-} from '@sitecore-content-sdk/nextjs';
+import { Field, Item, ImageField, LinkField, Text, DateField } from '@sitecore-content-sdk/nextjs';
 import { ComponentProps } from '@/lib/component-props';
 
 import { NoDataFallback } from '@/utils/NoDataFallback';

diff --git a/examples/kit-nextjs-article-starter/src/components/article-listing/ArticleListing.tsx b/examples/kit-nextjs-article-starter/src/components/article-listing/ArticleListing.tsx
@@ -2,13 +2,7 @@
 
 import React from 'react';
 import Image from 'next/image';
-import {
-  Link,
-  Text,
-  Field,
-  ImageField,
-  LinkField,
-} from '@sitecore-content-sdk/nextjs';
+import { Link, Text, Field, ImageField, LinkField } from '@sitecore-content-sdk/nextjs';
 import { cn } from '@/lib/utils';
 import { EditableButton as Button } from '@/components/button-component/ButtonComponent';
 import { ComponentProps } from '@/lib/component-props';
@@ -144,12 +138,7 @@ export const Default: React.FC<ArticleListingProps> = ({
               <div key={index} className="@md:mb-0 group/article mb-6">
                 {isPageEditing ? (
                   <div className="rounded-default @md:mb-0 relative mb-4 aspect-[3/2] w-full overflow-hidden">
-                    <Image
-                      src={article.image}
-                      alt={article.title}
-                      fill
-                      className="object-cover"
-                    />
+                    <Image src={article.image} alt={article.title} fill className="object-cover" />
                   </div>
                 ) : (
                   <div

diff --git a/examples/kit-nextjs-article-starter/src/components/card/Card.dev.tsx b/examples/kit-nextjs-article-starter/src/components/card/Card.dev.tsx
@@ -1,11 +1,4 @@
-import {
-  RichText,
-  Text,
-  Field,
-  ImageField,
-  LinkField,
-  Link,
-} from '@sitecore-content-sdk/nextjs';
+import { RichText, Text, Field, ImageField, LinkField, Link } from '@sitecore-content-sdk/nextjs';
 import { Card, CardFooter, CardHeader, CardTitle } from '@/components/ui/card';
 import { Button } from '@/components/ui/button';
 import { Default as Icon } from '@/components/icon/Icon';
@@ -30,15 +23,11 @@ type CardProps = {
  * @returns
  */
 export const Default: React.FC<CardProps> = (props) => {
-  const { image, heading, description, link, className, icon, editable } =
-    props;
+  const { image, heading, description, link, className, icon, editable } = props;
 
   return (
     <Card className={cn('flex flex-col overflow-hidden', className)}>
-      <ImageWrapper
-        image={image}
-        className="aspect-video w-full object-cover"
-      />
+      <ImageWrapper image={image} className="aspect-video w-full object-cover" />
       <CardHeader>
         <CardTitle>
           <Text field={heading} />
@@ -51,8 +40,7 @@ export const Default: React.FC<CardProps> = (props) => {
             <Link editable={editable} field={link}>
               {editable && (
                 <>
-                  {link?.value?.text}{' '}
-                  <Icon iconName={icon ? icon : IconName.INTERNAL} />
+                  {link?.value?.text} <Icon iconName={icon ? icon : IconName.INTERNAL} />
                 </>
               )}
             </Link>

diff --git a/...-nextjs-article-starter/src/components/container/container-25252525/Container25252525.tsx b/...-nextjs-article-starter/src/components/container/container-25252525/Container25252525.tsx
@@ -22,22 +22,10 @@ export const Default: React.FC<Container25252525Props> = (props) => {
 
   const isPageEditing = page.mode.isEditing;
 
-  const col1Placeholder = getContainerPlaceholderProps(
-    'container-25-one',
-    props.params,
-  );
-  const col2Placeholder = getContainerPlaceholderProps(
-    'container-25-two',
-    props.params,
-  );
-  const col3Placeholder = getContainerPlaceholderProps(
-    'container-25-three',
-    props.params,
-  );
-  const col4Placeholder = getContainerPlaceholderProps(
-    'container-25-four',
-    props.params,
-  );
+  const col1Placeholder = getContainerPlaceholderProps('container-25-one', props.params);
+  const col2Placeholder = getContainerPlaceholderProps('container-25-two', props.params);
+  const col3Placeholder = getContainerPlaceholderProps('container-25-three', props.params);
+  const col4Placeholder = getContainerPlaceholderProps('container-25-four', props.params);
 
   const isEmptyPlaceholder =
     isContainerPlaceholderEmpty(rendering, col1Placeholder, col1) &&
@@ -49,8 +37,7 @@ export const Default: React.FC<Container25252525Props> = (props) => {
     return null;
   }
 
-  const excludeTopMargin =
-    props?.params?.excludeTopMargin === '1' ? true : false;
+  const excludeTopMargin = props?.params?.excludeTopMargin === '1' ? true : false;
 
   return (
     <section

diff --git a/.../kit-nextjs-article-starter/src/components/container/container-303030/Container303030.tsx b/.../kit-nextjs-article-starter/src/components/container/container-303030/Container303030.tsx
@@ -26,18 +26,9 @@ export const Default: React.FC<Container303030Props> = (props) => {
 
   const isPageEditing = page.mode.isEditing;
 
-  const leftPlaceholder = getContainerPlaceholderProps(
-    'container-thirty-left',
-    props.params,
-  );
-  const centerPlaceholder = getContainerPlaceholderProps(
-    'container-thirty-center',
-    props.params,
-  );
-  const rightPlaceholder = getContainerPlaceholderProps(
-    'container-thirty-right',
-    props.params,
-  );
+  const leftPlaceholder = getContainerPlaceholderProps('container-thirty-left', props.params);
+  const centerPlaceholder = getContainerPlaceholderProps('container-thirty-center', props.params);
+  const rightPlaceholder = getContainerPlaceholderProps('container-thirty-right', props.params);
 
   const isEmptyPlaceholder =
     isContainerPlaceholderEmpty(rendering, leftPlaceholder, left) &&
@@ -48,8 +39,7 @@ export const Default: React.FC<Container303030Props> = (props) => {
     return null;
   }
 
-  const excludeTopMargin =
-    props?.params?.excludeTopMargin === '1' ? true : false;
+  const excludeTopMargin = props?.params?.excludeTopMargin === '1' ? true : false;
 
   return (
     <section

diff --git a/...ples/kit-nextjs-article-starter/src/components/container/container-3070/Container3070.tsx b/...ples/kit-nextjs-article-starter/src/components/container/container-3070/Container3070.tsx
@@ -24,14 +24,8 @@ export const Default: React.FC<Container3070Props> = (props) => {
 
   const isPageEditing = page.mode.isEditing;
 
-  const leftPlaceholders = getContainerPlaceholderProps(
-    'container-thirty-left',
-    props.params,
-  );
-  const rightPlaceholders = getContainerPlaceholderProps(
-    'container-seventy-right',
-    props.params,
-  );
+  const leftPlaceholders = getContainerPlaceholderProps('container-thirty-left', props.params);
+  const rightPlaceholders = getContainerPlaceholderProps('container-seventy-right', props.params);
 
   const isEmptyPlaceholder =
     isContainerPlaceholderEmpty(rendering, leftPlaceholders, left) &&
@@ -41,8 +35,7 @@ export const Default: React.FC<Container3070Props> = (props) => {
     return null;
   }
 
-  const excludeTopMargin =
-    props?.params?.excludeTopMargin === '1' ? true : false;
+  const excludeTopMargin = props?.params?.excludeTopMargin === '1' ? true : false;
 
   return (
     <section

diff --git a/...ples/kit-nextjs-article-starter/src/components/container/container-4060/Container4060.tsx b/...ples/kit-nextjs-article-starter/src/components/container/container-4060/Container4060.tsx
@@ -25,14 +25,8 @@ export const Default: React.FC<Container4060Props> = (props) => {
 
   const isPageEditing = page.mode.isEditing;
 
-  const leftPlaceholders = getContainerPlaceholderProps(
-    'container-forty-left',
-    props.params,
-  );
-  const rightPlaceholders = getContainerPlaceholderProps(
-    'container-sixty-right',
-    props.params,
-  );
+  const leftPlaceholders = getContainerPlaceholderProps('container-forty-left', props.params);
+  const rightPlaceholders = getContainerPlaceholderProps('container-sixty-right', props.params);
 
   const isEmptyPlaceholder =
     isContainerPlaceholderEmpty(rendering, leftPlaceholders, left) &&
@@ -42,8 +36,7 @@ export const Default: React.FC<Container4060Props> = (props) => {
     return null;
   }
 
-  const excludeTopMargin =
-    props?.params?.excludeTopMargin === '1' ? true : false;
+  const excludeTopMargin = props?.params?.excludeTopMargin === '1' ? true : false;
 
   return (
     <section

diff --git a/...ples/kit-nextjs-article-starter/src/components/container/container-5050/Container5050.tsx b/...ples/kit-nextjs-article-starter/src/components/container/container-5050/Container5050.tsx
@@ -47,12 +47,20 @@ export const Default: React.FC<Container5050Props> = (props) => {
     >
       <Flex wrap="nowrap">
         <FlexItem as="div" basis="1/2">
-          <AppPlaceholder name={leftPlaceholders.dynamicKey} rendering={rendering} page={page}
-            componentMap={componentMap}/>
+          <AppPlaceholder
+            name={leftPlaceholders.dynamicKey}
+            rendering={rendering}
+            page={page}
+            componentMap={componentMap}
+          />
         </FlexItem>
         <FlexItem as="div" basis="1/2">
-          <AppPlaceholder name={rightPlaceholders.dynamicKey} rendering={rendering} page={page}
-            componentMap={componentMap}/>
+          <AppPlaceholder
+            name={rightPlaceholders.dynamicKey}
+            rendering={rendering}
+            page={page}
+            componentMap={componentMap}
+          />
         </FlexItem>
       </Flex>
     </section>
Original file line number	Diff line number	Diff line change
Expand Up		@@ -367,4 +367,3 @@
		.offset-xxl-11 {
		@apply 2xl:offset-11;
		}