diff --git a/packages/react/src/Accordion/Accordion.tsx b/packages/react/src/Accordion/Accordion.tsx
index 74d9366861..2f65c8ec27 100644
--- a/packages/react/src/Accordion/Accordion.tsx
+++ b/packages/react/src/Accordion/Accordion.tsx
@@ -10,7 +10,6 @@ import {
   ForwardRefExoticComponent,
   HTMLAttributes,
   PropsWithChildren,
-  ReactNode,
   RefAttributes,
   useImperativeHandle,
   useRef,
@@ -20,16 +19,12 @@ import { AccordionSection } from './AccordionSection'
 import useFocusWithArrows from './useFocusWithArrows'
 import { HeadingLevel } from '../Heading/Heading'
 
-export interface AccordionProps extends HTMLAttributes<HTMLDivElement> {
-  children?: ReactNode
+export interface AccordionProps extends PropsWithChildren<HTMLAttributes<HTMLDivElement>> {
   headingLevel: HeadingLevel
   section?: boolean
 }
 
-export interface AccordionComponent
-  extends ForwardRefExoticComponent<
-    PropsWithChildren<HTMLAttributes<HTMLDivElement>> & RefAttributes<HTMLDivElement> & AccordionProps
-  > {
+export interface AccordionComponent extends ForwardRefExoticComponent<AccordionProps & RefAttributes<HTMLDivElement>> {
   Section: typeof AccordionSection
 }
 
diff --git a/packages/react/src/Breadcrumb/Breadcrumb.tsx b/packages/react/src/Breadcrumb/Breadcrumb.tsx
index 07cb4eeac9..4f91b8aedc 100644
--- a/packages/react/src/Breadcrumb/Breadcrumb.tsx
+++ b/packages/react/src/Breadcrumb/Breadcrumb.tsx
@@ -7,20 +7,19 @@ import {
   RefAttributes,
 } from 'react'
 
-interface BreadcrumbComponent
-  extends ForwardRefExoticComponent<PropsWithChildren<HTMLAttributes<HTMLElement>> & RefAttributes<HTMLElement>> {
+type BreadcrumbProps = PropsWithChildren<HTMLAttributes<HTMLElement>>
+
+interface BreadcrumbComponent extends ForwardRefExoticComponent<BreadcrumbProps & RefAttributes<HTMLElement>> {
   Item: typeof BreadcrumbItem
 }
 
-export const Breadcrumb = forwardRef(
-  ({ children, ...restProps }: PropsWithChildren<HTMLAttributes<HTMLElement>>, ref: ForwardedRef<HTMLElement>) => {
-    return (
-      <nav {...restProps} className="amsterdam-breadcrumb" ref={ref}>
-        <ol className="amsterdam-breadcrumb__list">{children}</ol>
-      </nav>
-    )
-  },
-) as BreadcrumbComponent
+export const Breadcrumb = forwardRef(({ children, ...restProps }: BreadcrumbProps, ref: ForwardedRef<HTMLElement>) => {
+  return (
+    <nav {...restProps} className="amsterdam-breadcrumb" ref={ref}>
+      <ol className="amsterdam-breadcrumb__list">{children}</ol>
+    </nav>
+  )
+}) as BreadcrumbComponent
 
 Breadcrumb.displayName = 'Breadcrumb'
 
diff --git a/packages/react/src/Card/Card.tsx b/packages/react/src/Card/Card.tsx
index fd924d12e0..1edfe6e855 100644
--- a/packages/react/src/Card/Card.tsx
+++ b/packages/react/src/Card/Card.tsx
@@ -45,10 +45,7 @@ CardLink.displayName = 'CardLink'
 
 export interface CardProps extends PropsWithChildren<HTMLAttributes<HTMLElement>> {}
 
-export interface CardComponent
-  extends ForwardRefExoticComponent<
-    PropsWithChildren<HTMLAttributes<HTMLElement>> & RefAttributes<HTMLElement> & CardProps
-  > {
+export interface CardComponent extends ForwardRefExoticComponent<CardProps & RefAttributes<HTMLElement>> {
   HeadingGroup: typeof CardHeadingGroup
   Link: typeof CardLink
 }
diff --git a/packages/react/src/Footer/Footer.tsx b/packages/react/src/Footer/Footer.tsx
index 6f02122815..64f2566625 100644
--- a/packages/react/src/Footer/Footer.tsx
+++ b/packages/react/src/Footer/Footer.tsx
@@ -40,17 +40,15 @@ export const FooterBottom = forwardRef(
 
 FooterBottom.displayName = 'FooterBottom'
 
-interface FooterComponent
-  extends ForwardRefExoticComponent<PropsWithChildren<HTMLAttributes<HTMLElement>> & RefAttributes<HTMLElement>> {
+type FooterProps = PropsWithChildren<HTMLAttributes<HTMLElement>>
+
+interface FooterComponent extends ForwardRefExoticComponent<FooterProps & RefAttributes<HTMLElement>> {
   Top: typeof FooterTop
   Bottom: typeof FooterBottom
 }
 
 export const Footer = forwardRef(
-  (
-    { children, className, ...restProps }: PropsWithChildren<HTMLAttributes<HTMLElement>>,
-    ref: ForwardedRef<HTMLElement>,
-  ) => (
+  ({ children, className, ...restProps }: FooterProps, ref: ForwardedRef<HTMLElement>) => (
     <footer {...restProps} ref={ref} className={clsx('amsterdam-footer', className)}>
       {children}
     </footer>