@faststore/core 2.2.13 → 2.2.15

package/.turbo/turbo-build.log

@@ -1,7 +1,7 @@
 $ yarn partytown & yarn generate && next build
+$ faststore generate-graphql -c
 $ partytown copylib ./public/~partytown
 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.
@@ -20,12 +20,12 @@ info  - Compiled successfully
 info  - Collecting page data...
 info  - Generating static pages (0/7)
 warn - AlertSectionIcon not found. Add a new component for this section or remove it from the CMS
+warn - AlertSectionIcon not found. Add a new component for this section or remove it from the CMS
 info  - Generating static pages (1/7)
 warn - AlertSectionIcon not found. Add a new component for this section or remove it from the CMS
 warn - AlertSectionIcon not found. Add a new component for this section or remove it from the CMS
 info  - Generating static pages (3/7)
 warn - AlertSectionIcon not found. Add a new component for this section or remove it from the CMS
-warn - AlertSectionIcon not found. Add a new component for this section or remove it from the CMS
 info  - Generating static pages (5/7)
 warn - AlertSectionIcon not found. Add a new component for this section or remove it from the CMS
 warn - AlertSectionIcon not found. Add a new component for this section or remove it from the CMS
@@ -40,20 +40,20 @@ Route (pages)                              Size     First Load JS
 ├ ● /[slug]/p                              10.9 kB         135 kB
 ├   └ css/d7bbfbd552f407e9.css             11.3 kB
 ├ ○ /404                                   1.19 kB         111 kB
-├ ● /500                                   1.2 kB          111 kB
-├ ● /account                               670 B           110 kB
+├ ● /500                                   1.21 kB         111 kB
+├ ● /account                               669 B           111 kB
 ├ λ /api/graphql                           0 B            78.6 kB
 ├ λ /api/health/live                       0 B            78.6 kB
 ├ λ /api/health/ready                      0 B            78.6 kB
 ├ λ /api/preview                           0 B            78.6 kB
-├ ● /checkout                              657 B           110 kB
+├ ● /checkout                              657 B           111 kB
 ├ ● /login                                 1.14 kB         111 kB
-└ ● /s                                     4.58 kB         125 kB
+└ ● /s                                     4.57 kB         125 kB
 + First Load JS shared by all              81.7 kB
   ├ chunks/framework-dfd14d7ce6600b03.js   45.3 kB
   ├ chunks/main-e4e873ee741162eb.js        24.1 kB
   ├ chunks/pages/_app-48d56037a2534a44.js  6.99 kB
-  ├ chunks/webpack-66a77a46f9162613.js     2.25 kB
+  ├ chunks/webpack-bc34484a5f5f8214.js     2.25 kB
   └ css/5d1f64b61ea581f4.css               3.06 kB
 
 λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)

package/.turbo/turbo-test.log

@@ -1,25 +1,25 @@
 $ tsdx test
 ts-jest[versions] (WARN) Version 29.1.0 of jest installed has not been tested with ts-jest. If you're experiencing issues, consider using a supported version (>=25.0.0 <26.0.0). Please do not report issues in ts-jest if you are using unsupported versions.
 ts-jest[versions] (WARN) Version 4.9.4 of typescript installed has not been tested with ts-jest. If you're experiencing issues, consider using a supported version (>=3.4.0 <4.0.0). Please do not report issues in ts-jest if you are using unsupported versions.
-PASS test/server/index.test.ts (9.304s)
+PASS test/server/index.test.ts (6.422s)
   FastStore GraphQL Layer
     @faststore/api
-      ✓ should return a valid GraphQL schema (6ms)
-      ✓ should return a valid GraphQL schema contain all expected types (9ms)
-      ✓ should return a valid GraphQL schema contain all expected queries (9ms)
-      ✓ should return a valid GraphQL schema contain all expected mutations (1ms)
+      ✓ should return a valid GraphQL schema (5ms)
+      ✓ should return a valid GraphQL schema contain all expected types (5ms)
+      ✓ should return a valid GraphQL schema contain all expected queries (2ms)
+      ✓ should return a valid GraphQL schema contain all expected mutations
     VTEX API Extension
-      ✓ getTypeDefsFromFolder function should return an Array (7ms)
+      ✓ getTypeDefsFromFolder function should return an Array (11ms)
     Third Party API Extension
       ✓ getTypeDefsFromFolder function should return an Array (5ms)
     Final Schema after merging
-      ✓ should return a valid merged GraphQL schema (34ms)
+      ✓ should return a valid merged GraphQL schema (26ms)
     Envelop
-      ✓ should exist with its plugins (34ms)
-      ✓ should handle options and execute (463ms)
+      ✓ should exist with its plugins (25ms)
+      ✓ should handle options and execute (324ms)
 
 Test Suites: 1 passed, 1 total
 Tests:       9 passed, 9 total
 Snapshots:   0 total
-Time:        10.117s
+Time:        6.854s
 Ran all test suites.

package/index.ts

@@ -17,3 +17,4 @@ export type {
 export { useProductsQuery } from './src/sdk/product/useProductsQuery'
 
 export * from './src/typings/overrides'
+export { getOverriddenSection } from './src/sdk/overrides/getOverriddenSection'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/core",
-  "version": "2.2.13",
+  "version": "2.2.15",
   "license": "MIT",
   "browserslist": "supports es6-module and not dead",
   "exports": {
@@ -129,5 +129,5 @@
   "msw": {
     "workerDirectory": "public"
   },
-  "gitHead": "e86acedc75c7b8d3a1e5321f8c05b3b9bcf9b450"
+  "gitHead": "39ef3562d3460aa5c3cdc1aaac663829d303a050"
 }

package/src/components/cms/GlobalSections.tsx

@@ -7,7 +7,7 @@ import { PageContentType, getPage } from 'src/server/cms'
 import Toast from 'src/components/common/Toast'
 import RenderSections from './RenderSections'
 
-import Alert from 'src/components/sections/Alert'
+import { OverriddenDefaultAlert as Alert } from 'src/components/sections/Alert/OverriddenDefaultAlert'
 import Footer from 'src/components/sections/Footer'
 import Navbar from 'src/components/sections/Navbar'
 import RegionBar from 'src/components/sections/RegionBar'

package/src/components/common/Alert/Alert.tsx

@@ -7,7 +7,7 @@ import { mark } from 'src/sdk/tests/mark'
 import Section from 'src/components/sections/Section/Section'
 import styles from './section.module.scss'
 
-import { Alert as AlertWrapper } from 'src/components/sections/Alert/Overrides'
+import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
 
 export interface AlertProps extends UIAlertProps {
   /**
@@ -18,11 +18,13 @@ export interface AlertProps extends UIAlertProps {
    */
   content?: ReactNode
 }
+
 function Alert({
   content,
   children,
   ...otherProps
 }: PropsWithChildren<AlertProps>) {
+  const { Alert: AlertWrapper } = useOverrideComponents<'Alert'>()
   const [displayAlert, setDisplayAlert] = useState(true)
 
   const onAlertClose = useCallback(

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

@@ -1,10 +1,7 @@
 import { ReactNode } from 'react'
 
 import CommonAlert from 'src/components/common/Alert'
-import {
-  Alert as AlertWrapper,
-  Icon,
-} from 'src/components/sections/Alert/Overrides'
+import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
 
 export interface AlertProps {
   icon: string
@@ -18,26 +15,20 @@ export interface AlertProps {
 }
 
 // TODO: Change actionPath and actionLabel with Link
-function Alert({
-  icon = Icon.props.name,
-  content,
-  link: {
-    text = AlertWrapper.props.link?.children,
-    to = AlertWrapper.props.link?.href,
-  },
-  dismissible = AlertWrapper.props.dismissible,
-}: AlertProps) {
+function Alert({ icon, content, link: { text, to }, dismissible }: AlertProps) {
+  const { Alert: AlertWrapper, Icon } = useOverrideComponents<'Alert'>()
+
   return (
     <CommonAlert
-      icon={<Icon.Component {...Icon.props} name={icon} />}
+      icon={<Icon.Component {...Icon.props} name={icon ?? Icon.props.name} />}
       {...AlertWrapper.props}
       link={{
         ...(AlertWrapper.props.link ?? {}),
-        children: text,
-        href: to,
+        children: text ?? AlertWrapper.props.link?.children,
+        href: to ?? AlertWrapper.props.link?.href,
         target: AlertWrapper.props.link?.target ?? '_self',
       }}
-      dismissible={dismissible}
+      dismissible={dismissible ?? AlertWrapper.props.dismissible}
     >
       {content}
     </CommonAlert>

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

@@ -0,0 +1,6 @@
+import { Alert as UIAlert, Icon as UIIcon } from '@faststore/ui'
+
+export const AlertDefaultComponents = {
+  Alert: UIAlert,
+  Icon: UIIcon,
+} as const

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

@@ -0,0 +1,12 @@
+import { override } from 'src/customizations/src/components/overrides/Alert'
+import { getOverriddenSection } from 'src/sdk/overrides/getOverriddenSection'
+import type { SectionOverrideDefinition } 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'>
+)

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

@@ -3,16 +3,16 @@ import {
   BannerTextContent as UIBannerTextContent,
 } from '@faststore/ui'
 
-import { getSectionOverrides } from 'src/utils/overrides'
+import { getSectionOverrides } from 'src/sdk/overrides/overrides'
 import { override } from 'src/customizations/src/components/overrides/BannerText'
-import type { BannerTextOverrideDefinition } from 'src/typings/overrides'
+import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
 
 const { BannerText, BannerTextContent } = getSectionOverrides(
   {
     BannerText: UIBannerText,
     BannerTextContent: UIBannerTextContent,
   },
-  override as BannerTextOverrideDefinition
+  override as SectionOverrideDefinition<'BannerText'>
 )
 
 export { BannerText, BannerTextContent }

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

@@ -1,15 +1,15 @@
 import { Breadcrumb as UIBreadcrumb, Icon as UIIcon } from '@faststore/ui'
 
-import { getSectionOverrides } from 'src/utils/overrides'
+import { getSectionOverrides } from 'src/sdk/overrides/overrides'
 import { override } from 'src/customizations/src/components/overrides/Breadcrumb'
-import type { BreadcrumbOverrideDefinition } from 'src/typings/overrides'
+import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
 
 const { Breadcrumb, Icon } = getSectionOverrides(
   {
     Breadcrumb: UIBreadcrumb,
     Icon: UIIcon,
   },
-  override as BreadcrumbOverrideDefinition
+  override as SectionOverrideDefinition<'Breadcrumb'>
 )
 
 export { Breadcrumb, Icon }

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

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

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

@@ -4,9 +4,9 @@ import {
   HeroHeader as UIHeroHeader,
 } from '@faststore/ui'
 
-import { getSectionOverrides } from 'src/utils/overrides'
+import { getSectionOverrides } from 'src/sdk/overrides/overrides'
 import { override } from 'src/customizations/src/components/overrides/Hero'
-import type { HeroOverrideDefinition } from 'src/typings/overrides'
+import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
 
 const { Hero, HeroImage, HeroHeader } = getSectionOverrides(
   {
@@ -14,7 +14,7 @@ const { Hero, HeroImage, HeroHeader } = getSectionOverrides(
     HeroImage: UIHeroImage,
     HeroHeader: UIHeroHeader,
   },
-  override as HeroOverrideDefinition
+  override as SectionOverrideDefinition<'Hero'>
 )
 
 export { Hero, HeroImage, HeroHeader }

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

@@ -12,9 +12,9 @@ import {
   IconButton as UIIconButton,
 } from '@faststore/ui'
 
-import { getSectionOverrides } from 'src/utils/overrides'
+import { getSectionOverrides } from 'src/sdk/overrides/overrides'
 import { override } from 'src/customizations/src/components/overrides/Navbar'
-import type { NavbarOverrideDefinition } from 'src/typings/overrides'
+import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
 
 const {
   Navbar,
@@ -42,7 +42,7 @@ const {
     NavbarButtons: UINavbarButtons,
     IconButton: UIIconButton,
   },
-  override as NavbarOverrideDefinition
+  override as SectionOverrideDefinition<'Navbar'>
 )
 
 export {

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

@@ -5,9 +5,9 @@ import {
 } from '@faststore/ui'
 import { NewsletterAddendum } from 'src/components/ui/Newsletter/NewsletterAddendum'
 
-import { getSectionOverrides } from 'src/utils/overrides'
+import { getSectionOverrides } from 'src/sdk/overrides/overrides'
 import { override } from 'src/customizations/src/components/overrides/Newsletter'
-import type { NewsletterOverrideDefinition } from 'src/typings/overrides'
+import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
 
 const {
   ToastIconSuccess,
@@ -27,7 +27,7 @@ const {
     Button: UIButton,
     __experimentalNewsletterAddendum: NewsletterAddendum,
   },
-  override as NewsletterOverrideDefinition
+  override as SectionOverrideDefinition<'Newsletter'>
 )
 
 export {

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

@@ -16,9 +16,9 @@ import LocalShippingSimulation from 'src/components/ui/ShippingSimulation/Shippi
 import { Image } from 'src/components/ui/Image'
 import LocalNotAvailableButton from 'src/components/product/NotAvailableButton'
 
-import { getSectionOverrides } from 'src/utils/overrides'
+import { getSectionOverrides } from 'src/sdk/overrides/overrides'
 import { override } from 'src/customizations/src/components/overrides/ProductDetails'
-import type { ProductDetailsOverrideDefinition } from 'src/typings/overrides'
+import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
 
 const {
   ProductTitle,
@@ -52,7 +52,7 @@ const {
     __experimentalShippingSimulation: LocalShippingSimulation,
     __experimentalNotAvailableButton: LocalNotAvailableButton,
   },
-  override as ProductDetailsOverrideDefinition
+  override as SectionOverrideDefinition<'ProductDetails'>
 )
 
 export {

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

@@ -13,9 +13,9 @@ const FilterSlider = lazy(
   () => import('src/components/search/Filter/FilterSlider')
 )
 
-import { getSectionOverrides } from 'src/utils/overrides'
+import { getSectionOverrides } from 'src/sdk/overrides/overrides'
 import { override } from 'src/customizations/src/components/overrides/ProductGallery'
-import type { ProductGalleryOverrideDefinition } from 'src/typings/overrides'
+import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
 
 const {
   MobileFilterButton,
@@ -43,7 +43,7 @@ const {
     __experimentalFilterSlider: FilterSlider,
     __experimentalProductCard: ProductCard,
   },
-  override as ProductGalleryOverrideDefinition
+  override as SectionOverrideDefinition<'ProductGallery'>
 )
 
 export {

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

@@ -3,9 +3,9 @@ import { ProductShelf as UIProductShelf } from '@faststore/ui'
 import ProductCard from 'src/components/product/ProductCard'
 import Carousel from 'src/components/ui/Carousel'
 
-import { getSectionOverrides } from 'src/utils/overrides'
+import { getSectionOverrides } from 'src/sdk/overrides/overrides'
 import { override } from 'src/customizations/src/components/overrides/ProductShelf'
-import type { ProductShelfOverrideDefinition } from 'src/typings/overrides'
+import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
 
 const { ProductShelf, __experimentalCarousel, __experimentalProductCard } =
   getSectionOverrides(
@@ -14,7 +14,7 @@ const { ProductShelf, __experimentalCarousel, __experimentalProductCard } =
       __experimentalCarousel: Carousel,
       __experimentalProductCard: ProductCard,
     },
-    override as ProductShelfOverrideDefinition
+    override as SectionOverrideDefinition<'ProductShelf'>
   )
 
 export { ProductShelf, __experimentalCarousel, __experimentalProductCard }

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

@@ -1,8 +1,8 @@
 import { RegionBar as UIRegionBar, Icon as UIIcon } from '@faststore/ui'
 
-import { getSectionOverrides } from 'src/utils/overrides'
+import { getSectionOverrides } from 'src/sdk/overrides/overrides'
 import { override } from 'src/customizations/src/components/overrides/RegionBar'
-import type { RegionBarOverrideDefinition } from 'src/typings/overrides'
+import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
 
 const { RegionBar, LocationIcon, ButtonIcon } = getSectionOverrides(
   {
@@ -10,7 +10,7 @@ const { RegionBar, LocationIcon, ButtonIcon } = getSectionOverrides(
     LocationIcon: UIIcon,
     ButtonIcon: UIIcon,
   },
-  override as RegionBarOverrideDefinition
+  override as SectionOverrideDefinition<'RegionBar'>
 )
 
 export { RegionBar, LocationIcon, ButtonIcon }

package/src/components/sections/Section/Section.tsx

@@ -1,6 +1,8 @@
 import { forwardRef } from 'react'
 import type { DetailedHTMLProps, HTMLAttributes } from 'react'
 
+import { useOverrideClassName } from 'src/sdk/overrides/OverrideContext'
+
 type BaseProps = DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>
 
 type SectionProps = BaseProps & {
@@ -11,10 +13,15 @@ const Section = forwardRef<HTMLDivElement, SectionProps>(function Section(
   { as, className = '', ...otherProps },
   ref
 ) {
+  const overrideClassName = useOverrideClassName() ?? ''
   const Component = as ?? 'section'
 
   return (
-    <Component ref={ref} className={`section ${className}`} {...otherProps} />
+    <Component
+      ref={ref}
+      className={`section ${className} ${overrideClassName}`.trim()}
+      {...otherProps}
+    />
   )
 })
 

package/src/pages/s.tsx

@@ -94,7 +94,7 @@ function Page({ page: searchContentType, globalSections }: Props) {
           }}
         />
 
-        <UISROnly as="h1" text={title} />
+        <UISROnly text={title} />
 
         {/*
           WARNING: Do not import or render components from any

package/src/sdk/overrides/OverrideContext.tsx

@@ -0,0 +1,27 @@
+import { createContext, useContext } from 'react'
+
+import type { OverriddenComponents } from '../../typings/overridesDefinition'
+import type { SectionsOverrides } from '../../typings/overrides'
+
+type OverrideContextType<
+  SectionName extends keyof SectionsOverrides = keyof SectionsOverrides
+> = {
+  className?: string
+  components: OverriddenComponents<SectionName>
+}
+
+const OverrideContext = createContext<OverrideContextType>(null)
+
+export const OverrideProvider = OverrideContext.Provider
+
+export const useOverrideContext = <
+  SectionName extends keyof SectionsOverrides = keyof SectionsOverrides
+>() => useContext(OverrideContext) as OverrideContextType<SectionName>
+
+export const useOverrideComponents = <
+  SectionName extends keyof SectionsOverrides = keyof SectionsOverrides
+>() =>
+  useContext(OverrideContext)
+    .components as OverrideContextType<SectionName>['components']
+
+export const useOverrideClassName = () => useContext(OverrideContext)?.className

package/src/sdk/overrides/getOverriddenSection.tsx

@@ -0,0 +1,70 @@
+import type { ComponentProps, ComponentType } from 'react'
+
+import { OverrideProvider } from './OverrideContext'
+import { DefaultComponents, Sections } from './sections'
+import { getSectionOverrides } from './overrides'
+import type {
+  DefaultSectionComponentsDefinitions,
+  OverriddenComponents,
+  SectionOverrideDefinition,
+} from '../../typings/overridesDefinition'
+import type { SupportedSectionsOverridesV2 } from '../../typings/overrides'
+
+/**
+ * This function adds OverrideContext to the tree. It is essential for the compatible sections
+ * to consume the components it provides.
+ */
+function createOverriddenSection<
+  SectionName extends keyof SupportedSectionsOverridesV2
+>({
+  Section,
+  sectionOverrides,
+  className,
+}: {
+  /** This type wizardry is here because the props won't behave correctly if done directly: (typeof Sections)[SectionName] */
+  Section: ComponentType<ComponentProps<(typeof Sections)[SectionName]>>
+  sectionOverrides: OverriddenComponents<SectionName>
+  className?: string
+}) {
+  const overrideContextValue = { className, components: sectionOverrides }
+
+  return function OverriddenSection(
+    props: React.ComponentProps<typeof Section>
+  ) {
+    return (
+      <OverrideProvider value={overrideContextValue}>
+        <Section {...props} />
+      </OverrideProvider>
+    )
+  }
+}
+
+/**
+ * Accepts override options and returns a React component for the overridden section.
+ * The overridden section is based on the options specified in the override definition.
+ *
+ * @param override An object containing override options.
+ * @returns The overridden section of choice
+ * @see https://www.faststore.dev/docs/building-sections/overriding-components-and-props
+ */
+export function getOverriddenSection<
+  SectionName extends keyof SupportedSectionsOverridesV2
+>(override: SectionOverrideDefinition<SectionName>) {
+  const defaultComponents = DefaultComponents[
+    override.section
+  ] as DefaultSectionComponentsDefinitions<SectionName>
+
+  if (!defaultComponents) {
+    throw new Error(
+      `Section ${override.section} does not exist. Please provide a valid section name to override.`
+    )
+  }
+
+  const sectionOverrides = getSectionOverrides(defaultComponents, override)
+
+  return createOverriddenSection({
+    Section: Sections[override.section],
+    sectionOverrides: sectionOverrides,
+    className: override.className,
+  })
+}

package/src/{utils → sdk/overrides}/overrides.ts

@@ -1,20 +1,19 @@
 import type {
   DefaultSectionComponentsDefinitions,
   ComponentOverrideDefinition,
-  Merge,
-} from 'src/typings/overrideDefinitionUtils'
-
-import type { SectionOverride } from 'src/typings/overrides'
-
-export type GetSectionOverridesReturn<SO extends SectionOverride> = {
-  [Key in keyof SO['components']]: Merge<SO['components'][Key]>
-}
-
-export function getSectionOverrides<SO extends SectionOverride>(
-  defaultComponents: DefaultSectionComponentsDefinitions<SO>,
-  override: SO
-): GetSectionOverridesReturn<SO> {
-  const overriddenComponents = {} as GetSectionOverridesReturn<SO>
+  SectionOverrideDefinition,
+  OverriddenComponents,
+} from '../../typings/overridesDefinition'
+
+import type { SectionsOverrides } from '../../typings/overrides'
+
+export function getSectionOverrides<
+  SectionName extends keyof SectionsOverrides
+>(
+  defaultComponents: DefaultSectionComponentsDefinitions<SectionName>,
+  override: SectionOverrideDefinition<SectionName>
+): OverriddenComponents<SectionName> {
+  const overriddenComponents = {} as OverriddenComponents<SectionName>
 
   Object.entries(defaultComponents).forEach(([key, value]) => {
     const componentOverride:

package/src/sdk/overrides/sections.tsx

@@ -0,0 +1,18 @@
+import Alert from '../../components/sections/Alert'
+
+import type { DefaultSectionComponentsDefinitions } from '../../typings/overridesDefinition'
+import type { SectionsOverrides } from '../../typings/overrides'
+import { AlertDefaultComponents } from '../../components/sections/Alert/DefaultComponents'
+
+export const Sections = {
+  Alert,
+}
+
+export const DefaultComponents: Partial<
+  Record<
+    keyof SectionsOverrides,
+    DefaultSectionComponentsDefinitions<keyof SectionsOverrides>
+  >
+> = {
+  Alert: AlertDefaultComponents,
+}