@faststore/core 2.2.69 → 2.2.71

package/.turbo/turbo-build.log

@@ -1,7 +1,7 @@
 $ yarn partytown & yarn generate && next build
 $ partytown copylib ./public/~partytown
-$ faststore generate-graphql -c
 Partytown lib copied to: /home/runner/work/faststore/faststore/packages/core/public/~partytown
+$ faststore generate-graphql -c
 success - GraphQL schema, types, and optimizations successfully generated 🎉
 warn  - You have enabled experimental feature (scrollRestoration) in next.config.js.
 warn  - Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use at your own risk.
@@ -38,28 +38,28 @@ info  - Generating static pages (7/7)
 info  - Finalizing page optimization...
 
 Route (pages)                              Size     First Load JS
-┌ ● /                                      2.37 kB         142 kB
-├   └ css/ecdecb8d639a8311.css             5.48 kB
-├   /_app                                  0 B            83.7 kB
-├ ● /[...slug]                             4.44 kB         144 kB
-├   └ css/0c844be3b8585e70.css             5.9 kB
-├ ● /[slug]/p                              1.74 kB         141 kB
-├   └ css/a6bcc59f42b42f36.css             2.39 kB
-├ ○ /404                                   1.03 kB         140 kB
-├ ● /500                                   1.05 kB         140 kB
-├ ● /account                               676 B           140 kB
-├ λ /api/graphql                           0 B            83.7 kB
-├ λ /api/health/live                       0 B            83.7 kB
-├ λ /api/health/ready                      0 B            83.7 kB
-├ λ /api/preview                           0 B            83.7 kB
-├ ● /checkout                              661 B           140 kB
-├ ● /login                                 983 B           140 kB
-└ ● /s                                     2.36 kB         142 kB
+┌ ● /                                      3.38 kB         129 kB
+├   └ css/7e897ebb936fac09.css             6.55 kB
+├   /_app                                  0 B            83.8 kB
+├ ● /[...slug]                             4.49 kB         141 kB
+├   └ css/510895065f32ed2f.css             7 kB
+├ ● /[slug]/p                              10.9 kB         136 kB
+├   └ css/def381bf7c69fa2e.css             11.3 kB
+├ ○ /404                                   1.19 kB         112 kB
+├ ● /500                                   1.21 kB         112 kB
+├ ● /account                               675 B           111 kB
+├ λ /api/graphql                           0 B            83.8 kB
+├ λ /api/health/live                       0 B            83.8 kB
+├ λ /api/health/ready                      0 B            83.8 kB
+├ λ /api/preview                           0 B            83.8 kB
+├ ● /checkout                              660 B           111 kB
+├ ● /login                                 1.14 kB         112 kB
+└ ● /s                                     4.63 kB         126 kB
 + First Load JS shared by all              86.8 kB
   ├ chunks/framework-dfd14d7ce6600b03.js   45.3 kB
   ├ chunks/main-e4e873ee741162eb.js        24.2 kB
   ├ chunks/pages/_app-30b9666307e4b3b1.js  12.1 kB
-  ├ chunks/webpack-3beeb2f9a51fccf6.js     2.22 kB
+  ├ chunks/webpack-54ce04ec11860b0b.js     2.25 kB
   └ css/5d1f64b61ea581f4.css               3.05 kB
 
 λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)

package/.turbo/turbo-test.log

@@ -1,23 +1,23 @@
 $ jest
-PASS test/server/index.test.ts (20.791 s)
+PASS test/server/index.test.ts (22.442 s)
   FastStore GraphQL Layer
     @faststore/api
-      ✓ should return a valid GraphQL schema (11 ms)
+      ✓ should return a valid GraphQL schema (12 ms)
       ✓ should return a valid GraphQL schema contain all expected types (9 ms)
-      ✓ should return a valid GraphQL schema contain all expected queries (1 ms)
-      ✓ should return a valid GraphQL schema contain all expected mutations (1 ms)
+      ✓ should return a valid GraphQL schema contain all expected queries (2 ms)
+      ✓ should return a valid GraphQL schema contain all expected mutations
     VTEX API Extension
-      ✓ getTypeDefsFromFolder function should return an Array (9 ms)
+      ✓ getTypeDefsFromFolder function should return an Array (30 ms)
     Third Party API Extension
-      ✓ getTypeDefsFromFolder function should return an Array (8 ms)
+      ✓ getTypeDefsFromFolder function should return an Array (9 ms)
     Final Schema after merging
-      ✓ should return a valid merged GraphQL schema (46 ms)
+      ✓ should return a valid merged GraphQL schema (42 ms)
     Envelop
-      ✓ should exist with its plugins (112 ms)
-      ✓ should handle options and execute (254 ms)
+      ✓ should exist with its plugins (43 ms)
+      ✓ should handle options and execute (567 ms)
 
 Test Suites: 1 passed, 1 total
 Tests:       9 passed, 9 total
 Snapshots:   0 total
-Time:        20.881 s
+Time:        22.575 s
 Ran all test suites.

package/index.ts

@@ -18,3 +18,16 @@ export { useProductsQuery } from './src/sdk/product/useProductsQuery'
 
 export * from './src/typings/overrides'
 export { getOverriddenSection } from './src/sdk/overrides/getOverriddenSection'
+
+// Overridable Sections
+export { default as AlertSection } from './src/components/sections/Alert'
+export { default as BannerTextSection } from './src/components/sections/BannerText'
+export { default as BreadcrumbSection } from './src/components/sections/Breadcrumb'
+export { default as CrossSellingShelfSection } from './src/components/sections/CrossSellingShelf'
+export { default as HeroSection } from './src/components/sections/Hero'
+export { default as NavbarSection } from './src/components/sections/Navbar'
+export { default as NewsletterSection } from './src/components/sections/Newsletter'
+export { default as ProductDetailsSection } from './src/components/sections/ProductDetails'
+export { default as ProductGallerySection } from './src/components/sections/ProductGallery'
+export { default as ProductShelfSection } from './src/components/sections/ProductShelf'
+export { default as RegionBarSection } from './src/components/sections/RegionBar'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/core",
-  "version": "2.2.69",
+  "version": "2.2.71",
   "license": "MIT",
   "repository": "vtex/faststore",
   "browserslist": "supports es6-module and not dead",
@@ -123,5 +123,5 @@
     "node": "18.19.0",
     "yarn": "1.19.1"
   },
-  "gitHead": "e02c08e29d5a183ddc461a6da61ac4b9243c098a"
+  "gitHead": "8f5eb691823d713771a804589591b66b6effae55"
 }

package/src/components/cms/GlobalSections.tsx

@@ -8,9 +8,9 @@ import Toast from 'src/components/common/Toast'
 import RenderSections from './RenderSections'
 
 import { OverriddenDefaultAlert as Alert } from 'src/components/sections/Alert/OverriddenDefaultAlert'
+import { OverriddenDefaultNavbar as Navbar } from 'src/components/sections/Navbar/OverriddenDefaultNavbar'
 import { OverriddenDefaultRegionBar as RegionBar } from 'src/components/sections/RegionBar/OverriddenDefaultRegionBar'
 import Footer from 'src/components/sections/Footer'
-import Navbar from 'src/components/sections/Navbar'
 
 const RegionModal = lazy(() => import('src/components/region/RegionModal'))
 const CartSidebar = lazy(() => import('src/components/cart/CartSidebar'))

package/src/components/navigation/Navbar/Navbar.tsx

@@ -12,17 +12,10 @@ import CartToggle from 'src/components/cart/CartToggle'
 import Logo from 'src/components/ui/Logo'
 import Link from 'src/components/ui/Link'
 import { ButtonSignIn } from 'src/components/ui/Button'
+import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
 
 import type { NavbarProps as SectionNavbarProps } from '../../sections/Navbar'
 
-import {
-  Navbar as NavbarWrapper,
-  NavbarHeader,
-  NavbarRow,
-  NavbarButtons,
-  IconButton,
-} from 'src/components/sections/Navbar/Overrides'
-
 export interface NavbarProps {
   /**
    * Logo props.
@@ -75,9 +68,16 @@ function Navbar({
   home: { label: homeLabel },
   signIn: { button: signInButton },
   menu: {
-    icon: { icon: menuIcon, alt: menuIconAlt = IconButton.props['aria-label'] },
+    icon: { icon: menuIcon, alt: menuIconAlt },
   },
 }: NavbarProps) {
+  const {
+    Navbar: NavbarWrapper,
+    NavbarHeader,
+    NavbarRow,
+    NavbarButtons,
+    IconButton,
+  } = useOverrideComponents<'Navbar'>()
   const scrollDirection = useScrollDirection()
   const { openNavbar, navbar: displayNavbar } = useUI()
   const searchMobileRef = useRef<SearchInputRef>(null)
@@ -107,7 +107,7 @@ function Navbar({
                 onClick={openNavbar}
                 icon={<UIIcon name={menuIcon} width={32} height={32} />}
                 {...IconButton.props}
-                aria-label={menuIconAlt}
+                aria-label={menuIconAlt ?? IconButton.props['aria-label']}
               />
               <Link
                 data-fs-navbar-logo

package/src/components/navigation/NavbarLinks/NavbarLinks.tsx

@@ -8,11 +8,7 @@ import RegionButton from 'src/components/region/RegionButton'
 import type { NavbarProps } from 'src/components/navigation/Navbar'
 
 import { mark } from 'src/sdk/tests/mark'
-
-import {
-  NavbarLinks as NavbarLinksWrapper,
-  NavbarLinksList,
-} from 'src/components/sections/Navbar/Overrides'
+import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
 
 interface NavbarLinksProps extends UINavbarLinksProps {
   links: NavbarProps['links']
@@ -29,6 +25,8 @@ function NavbarLinks({
   region: { icon: regionIcon, label: regionLabel, shouldDisplayRegion },
   ...otherProps
 }: NavbarLinksProps) {
+  const { NavbarLinks: NavbarLinksWrapper, NavbarLinksList } =
+    useOverrideComponents<'Navbar'>()
   return (
     <NavbarLinksWrapper.Component {...otherProps} {...NavbarLinksWrapper.props}>
       <div data-fs-navbar-links-wrapper data-fs-content="navbar">

package/src/components/navigation/NavbarSlider/NavbarSlider.tsx

@@ -10,13 +10,7 @@ import { mark } from 'src/sdk/tests/mark'
 import type { NavbarProps } from '../Navbar'
 
 import styles from './section.module.scss'
-
-import {
-  NavbarSlider as NavbarSliderWrapper,
-  NavbarSliderHeader,
-  NavbarSliderContent,
-  NavbarSliderFooter,
-} from 'src/components/sections/Navbar/Overrides'
+import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
 
 interface NavbarSliderProps {
   logo: NavbarProps['logo']
@@ -33,6 +27,13 @@ function NavbarSlider({
   home: { label: homeLabel },
   signIn: { button: signInButton },
 }: NavbarSliderProps) {
+  const {
+    NavbarSlider: NavbarSliderWrapper,
+    NavbarSliderHeader,
+    NavbarSliderContent,
+    NavbarSliderFooter,
+  } = useOverrideComponents<'Navbar'>()
+
   const { closeNavbar } = useUI()
   const { fade, fadeOut } = useFadeEffect()
 

package/src/components/sections/Alert/Alert.tsx

@@ -2,8 +2,10 @@ import type { ReactNode } from 'react'
 
 import CommonAlert, {
   type AlertProps as CommonAlertProps,
-} from 'src/components/common/Alert'
-import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
+} from '../../../components/common/Alert'
+import { useOverrideComponents } from '../../../sdk/overrides/OverrideContext'
+import { AlertDefaultComponents } from './DefaultComponents'
+import { getOverridableSection } from '../../../sdk/overrides/getOverriddenSection'
 
 export interface AlertProps extends Omit<CommonAlertProps, 'link' | 'icon'> {
   icon: string
@@ -35,4 +37,10 @@ function Alert({ icon, content, link: { text, to }, dismissible }: AlertProps) {
   )
 }
 
-export default Alert
+const OverridableAlert = getOverridableSection<typeof Alert>(
+  'Alert',
+  Alert,
+  AlertDefaultComponents
+)
+
+export default OverridableAlert

package/src/components/sections/Alert/OverriddenDefaultAlert.ts

@@ -1,12 +1,15 @@
 import { override } from 'src/customizations/src/components/overrides/Alert'
 import { getOverriddenSection } from 'src/sdk/overrides/getOverriddenSection'
-import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
+import Alert from '.'
+
+import type { SectionOverrideDefinitionV1 } from 'src/typings/overridesDefinition'
 
 /**
  * This component exists to support overrides 1.0
  *
  * This allows users to override the default Alert section present in the Headless CMS
  */
-export const OverriddenDefaultAlert = getOverriddenSection(
-  override as SectionOverrideDefinition<'Alert'>
-)
+export const OverriddenDefaultAlert = getOverriddenSection({
+  ...(override as SectionOverrideDefinitionV1<'Alert'>),
+  Section: Alert,
+})

package/src/components/sections/BannerText/BannerText.tsx

@@ -3,10 +3,12 @@ import {
   BannerTextContentProps as UIBannerTextContentProps,
 } from '@faststore/ui'
 
-import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
+import { useOverrideComponents } from '../../../sdk/overrides/OverrideContext'
 import Section from '../Section'
 
 import styles from './section.module.scss'
+import { BannerTextDefaultComponents } from './DefaultComponents'
+import { getOverridableSection } from '../../../sdk/overrides/getOverriddenSection'
 
 export interface BannerTextProps {
   title: UIBannerTextContentProps['title']
@@ -55,4 +57,10 @@ function BannerText({
   )
 }
 
-export default BannerText
+const OverridableBannerText = getOverridableSection<typeof BannerText>(
+  'BannerText',
+  BannerText,
+  BannerTextDefaultComponents
+)
+
+export default OverridableBannerText

package/src/components/sections/BannerText/OverriddenDefaultBannerText.ts

@@ -1,12 +1,15 @@
 import { override } from 'src/customizations/src/components/overrides/BannerText'
 import { getOverriddenSection } from 'src/sdk/overrides/getOverriddenSection'
-import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
+import BannerText from '.'
+
+import type { SectionOverrideDefinitionV1 } from 'src/typings/overridesDefinition'
 
 /**
  * This component exists to support overrides 1.0
  *
  * This allows users to override the default BannerText section present in the Headless CMS
  */
-export const OverriddenDefaultBannerText = getOverriddenSection(
-  override as SectionOverrideDefinition<'BannerText'>
-)
+export const OverriddenDefaultBannerText = getOverriddenSection({
+  ...(override as SectionOverrideDefinitionV1<'BannerText'>),
+  Section: BannerText,
+})

package/src/components/sections/Breadcrumb/Breadcrumb.tsx

@@ -9,8 +9,10 @@ import {
   isPDP,
   isPLP,
   usePage,
-} from 'src/sdk/overrides/PageProvider'
-import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
+} from '../../../sdk/overrides/PageProvider'
+import { useOverrideComponents } from '../../../sdk/overrides/OverrideContext'
+import { BreadcrumbDefaultComponents } from './DefaultComponents'
+import { getOverridableSection } from '../../../sdk/overrides/getOverriddenSection'
 
 interface BreadcrumbSectionProps {
   icon: string
@@ -39,4 +41,8 @@ function BreadcrumbSection({ ...otherProps }: BreadcrumbSectionProps) {
   )
 }
 
-export default memo(BreadcrumbSection)
+const OverridableBreadcrumbSection = getOverridableSection<
+  typeof BreadcrumbSection
+>('Breadcrumb', BreadcrumbSection, BreadcrumbDefaultComponents)
+
+export default memo(OverridableBreadcrumbSection)

package/src/components/sections/Breadcrumb/OverriddenDefaultBreadcrumb.ts

@@ -1,12 +1,15 @@
 import { override } from 'src/customizations/src/components/overrides/Breadcrumb'
 import { getOverriddenSection } from 'src/sdk/overrides/getOverriddenSection'
-import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
+import Breadcrumb from '.'
+
+import type { SectionOverrideDefinitionV1 } from 'src/typings/overridesDefinition'
 
 /**
  * This component exists to support overrides 1.0
  *
  * This allows users to override the default Breadcrumb section present in the Headless CMS
  */
-export const OverriddenDefaultBreadcrumb = getOverriddenSection(
-  override as SectionOverrideDefinition<'Breadcrumb'>
-)
+export const OverriddenDefaultBreadcrumb = getOverriddenSection({
+  ...(override as SectionOverrideDefinitionV1<'Breadcrumb'>),
+  Section: Breadcrumb,
+})

package/src/components/sections/CrossSellingShelf/CrossSellingShelf.tsx

@@ -1,10 +1,12 @@
 import { useMemo } from 'react'
 
-import UIProductShelf from 'src/components/ui/ProductShelf'
+import UIProductShelf from '../../../components/ui/ProductShelf'
 import { useInView } from 'react-intersection-observer'
 import { usePDP } from 'src/sdk/overrides/PageProvider'
 import styles from '../ProductShelf/section.module.scss'
 import Section from '../Section'
+import { CrossSellingShelfDefaultComponents } from './DefaultComponents'
+import { getOverridableSection } from '../../../sdk/overrides/getOverriddenSection'
 
 interface Props {
   numberOfItems: number
@@ -43,4 +45,8 @@ const CrossSellingShelf = ({
   )
 }
 
-export default CrossSellingShelf
+const OverridableCrossSellingShelf = getOverridableSection<
+  typeof CrossSellingShelf
+>('CrossSellingShelf', CrossSellingShelf, CrossSellingShelfDefaultComponents)
+
+export default OverridableCrossSellingShelf

package/src/components/sections/CrossSellingShelf/OverriddenDefaultCrossSellingShelf.ts

@@ -1,5 +1,6 @@
 import { getOverriddenSection } from 'src/sdk/overrides/getOverriddenSection'
+import CrossSellingShelf from '.'
 
 export const OverriddenDefaultCrossSellingShelf = getOverriddenSection({
-  section: 'CrossSellingShelf',
+  Section: CrossSellingShelf,
 })

package/src/components/sections/EmptyState/Overrides.tsx

@@ -2,13 +2,13 @@ import { EmptyState as UIEmptyState } from '@faststore/ui'
 
 import { getSectionOverrides } from 'src/sdk/overrides/overrides'
 import { override } from 'src/customizations/src/components/overrides/EmptyState'
-import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
+import type { SectionOverrideDefinitionV1 } from 'src/typings/overridesDefinition'
 
 const { EmptyState } = getSectionOverrides(
   {
     EmptyState: UIEmptyState,
   },
-  override as SectionOverrideDefinition<'EmptyState'>
+  override as SectionOverrideDefinitionV1<'EmptyState'>
 )
 
 export { EmptyState }

package/src/components/sections/Hero/Hero.tsx

@@ -3,13 +3,15 @@ import {
   HeroHeaderProps as UIHeroHeaderProps,
 } from '@faststore/ui'
 import { ReactNode } from 'react'
-import { Image } from 'src/components/ui/Image'
+import { Image } from '../../../components/ui/Image'
 
-import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
+import { useOverrideComponents } from '../../../sdk/overrides/OverrideContext'
 
 import Section from '../Section'
 
 import styles from './section.module.scss'
+import { HeroDefaultComponents } from './DefaultComponents'
+import { getOverridableSection } from '../../../sdk/overrides/getOverriddenSection'
 
 export type HeroProps = {
   title: UIHeroHeaderProps['title']
@@ -74,4 +76,10 @@ const Hero = ({
   )
 }
 
-export default Hero
+const OverridableHero = getOverridableSection<typeof Hero>(
+  'Hero',
+  Hero,
+  HeroDefaultComponents
+)
+
+export default OverridableHero

package/src/components/sections/Hero/OverriddenDefaultHero.ts

@@ -1,12 +1,15 @@
 import { override } from 'src/customizations/src/components/overrides/Hero'
 import { getOverriddenSection } from 'src/sdk/overrides/getOverriddenSection'
-import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
+import Hero from '.'
+
+import type { SectionOverrideDefinitionV1 } from 'src/typings/overridesDefinition'
 
 /**
  * This component exists to support overrides 1.0
  *
  * This allows users to override the default Hero section present in the Headless CMS
  */
-export const OverriddenDefaultHero = getOverriddenSection(
-  override as SectionOverrideDefinition<'Hero'>
-)
+export const OverriddenDefaultHero = getOverriddenSection({
+  ...(override as SectionOverrideDefinitionV1<'Hero'>),
+  Section: Hero,
+})

package/src/components/sections/Navbar/DefaultComponents.ts

@@ -0,0 +1,27 @@
+import {
+  Navbar as UINavbar,
+  NavbarLinks as UINavbarLinks,
+  NavbarLinksList as UINavbarLinksList,
+  NavbarSlider as UINavbarSlider,
+  NavbarSliderHeader as UINavbarSliderHeader,
+  NavbarSliderContent as UINavbarSliderContent,
+  NavbarSliderFooter as UINavbarSliderFooter,
+  NavbarHeader as UINavbarHeader,
+  NavbarRow as UINavbarRow,
+  NavbarButtons as UINavbarButtons,
+  IconButton as UIIconButton,
+} from '@faststore/ui'
+
+export const NavbarDefaultComponents = {
+  Navbar: UINavbar,
+  NavbarLinks: UINavbarLinks,
+  NavbarLinksList: UINavbarLinksList,
+  NavbarSlider: UINavbarSlider,
+  NavbarSliderHeader: UINavbarSliderHeader,
+  NavbarSliderContent: UINavbarSliderContent,
+  NavbarSliderFooter: UINavbarSliderFooter,
+  NavbarHeader: UINavbarHeader,
+  NavbarRow: UINavbarRow,
+  NavbarButtons: UINavbarButtons,
+  IconButton: UIIconButton,
+} as const

package/src/components/sections/Navbar/Navbar.tsx

@@ -1,8 +1,10 @@
+import { getOverridableSection } from '../../../sdk/overrides/getOverriddenSection'
 import Section from '../Section'
 
 import styles from './section.module.scss'
 
-import Navbar from 'src/components/navigation/Navbar'
+import Navbar from '../../../components/navigation/Navbar'
+import { NavbarDefaultComponents } from './DefaultComponents'
 
 type PageLinks = {
   url: string
@@ -91,4 +93,10 @@ function NavbarSection({
   )
 }
 
-export default NavbarSection
+const OverridableNavbar = getOverridableSection<typeof NavbarSection>(
+  'Navbar',
+  NavbarSection,
+  NavbarDefaultComponents
+)
+
+export default OverridableNavbar

package/src/components/sections/Navbar/OverriddenDefaultNavbar.ts

@@ -0,0 +1,14 @@
+import { override } from 'src/customizations/src/components/overrides/Navbar'
+import { getOverriddenSection } from 'src/sdk/overrides/getOverriddenSection'
+import type { SectionOverrideDefinitionV1 } from 'src/typings/overridesDefinition'
+import Navbar from './Navbar'
+
+/**
+ * This component exists to support overrides 1.0
+ *
+ * This allows users to override the default Navbar section present in the Headless CMS
+ */
+export const OverriddenDefaultNavbar = getOverriddenSection({
+  ...(override as SectionOverrideDefinitionV1<'Navbar'>),
+  Section: Navbar,
+})

package/src/components/sections/Newsletter/Newsletter.tsx

@@ -4,10 +4,12 @@ import {
   NewsletterHeaderProps as UINewsletterHeaderProps,
 } from '@faststore/ui'
 
-import UINewsletter from 'src/components/ui/Newsletter'
+import UINewsletter from '../../ui/Newsletter'
 
 import Section from '../Section'
 import styles from './section.module.scss'
+import { getOverridableSection } from '../../../sdk/overrides/getOverriddenSection'
+import { NewsletterDefaultComponents } from './DefaultComponents'
 
 type SubscribeMessage = {
   icon: string
@@ -111,4 +113,10 @@ function Newsletter({
   )
 }
 
-export default Newsletter
+const OverridableNewsletter = getOverridableSection<typeof Newsletter>(
+  'Newsletter',
+  Newsletter,
+  NewsletterDefaultComponents
+)
+
+export default OverridableNewsletter

package/src/components/sections/Newsletter/OverriddenDefaultNewsletter.ts

@@ -1,12 +1,14 @@
 import { override } from 'src/customizations/src/components/overrides/Newsletter'
 import { getOverriddenSection } from 'src/sdk/overrides/getOverriddenSection'
-import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
+import type { SectionOverrideDefinitionV1 } from 'src/typings/overridesDefinition'
+import Newsletter from './Newsletter'
 
 /**
  * This component exists to support overrides 1.0
  *
  * This allows users to override the default Newsletter section present in the Headless CMS
  */
-export const OverriddenDefaultNewsletter = getOverriddenSection(
-  override as SectionOverrideDefinition<'Newsletter'>
-)
+export const OverriddenDefaultNewsletter = getOverriddenSection({
+  ...(override as SectionOverrideDefinitionV1<'Newsletter'>),
+  Section: Newsletter,
+})

package/src/components/sections/ProductDetails/OverriddenDefaultProductDetails.ts

@@ -1,12 +1,15 @@
 import { override } from 'src/customizations/src/components/overrides/ProductDetails'
 import { getOverriddenSection } from 'src/sdk/overrides/getOverriddenSection'
-import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
+import ProductDetails from './ProductDetails'
+
+import type { SectionOverrideDefinitionV1 } from 'src/typings/overridesDefinition'
 
 /**
  * This component exists to support overrides 1.0
  *
  * This allows users to override the default ProductDetails section present in the Headless CMS
  */
-export const OverriddenDefaultProductDetails = getOverriddenSection(
-  override as SectionOverrideDefinition<'ProductDetails'>
-)
+export const OverriddenDefaultProductDetails = getOverriddenSection({
+  ...(override as SectionOverrideDefinitionV1<'ProductDetails'>),
+  Section: ProductDetails,
+})