diff --git a/package.json b/package.json
index 97b020db..93b5919d 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "webdevhome.github.io-vite",
-  "version": "2.0.11",
+  "version": "2.0.11.1",
   "scripts": {
     "dev": "vite",
     "build": "tsc && vite build",
diff --git a/src/components/App/AppContent.tsx b/src/components/App/AppContent.tsx
index f75c2f35..c4b981c2 100644
--- a/src/components/App/AppContent.tsx
+++ b/src/components/App/AppContent.tsx
@@ -1,7 +1,7 @@
 import classNames from 'classnames'
-import { FC } from 'react'
+import { FC, PropsWithChildren } from 'react'
 
-export const AppContent: FC = ({ children }) => {
+export const AppContent: FC<PropsWithChildren> = ({ children }) => {
   return (
     <div
       className={classNames(
diff --git a/src/components/Footer/AppFooter.tsx b/src/components/Footer/AppFooter.tsx
index 7a79d000..4cbe502e 100644
--- a/src/components/Footer/AppFooter.tsx
+++ b/src/components/Footer/AppFooter.tsx
@@ -1,7 +1,7 @@
-import { FC } from 'react'
+import { FC, PropsWithChildren } from 'react'
 import classNames from 'classnames'
 
-export const AppFooter: FC = ({ children }) => {
+export const AppFooter: FC<PropsWithChildren> = ({ children }) => {
   return (
     <div
       className={classNames(
diff --git a/src/components/Footer/FooterGroupLink.tsx b/src/components/Footer/FooterGroupLink.tsx
index aeb43f5d..4eff4527 100644
--- a/src/components/Footer/FooterGroupLink.tsx
+++ b/src/components/Footer/FooterGroupLink.tsx
@@ -1,11 +1,14 @@
 import classNames from 'classnames'
-import { FC } from 'react'
+import { FC, PropsWithChildren } from 'react'
 
 interface Props {
   href: string
 }
 
-export const FooterGroupLink: FC<Props> = ({ href, children }) => {
+export const FooterGroupLink: FC<PropsWithChildren<Props>> = ({
+  href,
+  children,
+}) => {
   return (
     <a
       className={classNames(
@@ -15,7 +18,7 @@ export const FooterGroupLink: FC<Props> = ({ href, children }) => {
         'hover:text-brand-600 hover:dark:text-brand-50',
         'hover:bg-gray-300 dark:hover:bg-gray-500',
         'rounded',
-        'focus:outline outline-1 outline-gray-500 dark:outline-gray-300'
+        'focus:outline outline-1 outline-gray-500 dark:outline-gray-300',
       )}
       href={href}
     >
diff --git a/src/components/Footer/FooterGroupText.tsx b/src/components/Footer/FooterGroupText.tsx
index caa7fb31..06050f57 100644
--- a/src/components/Footer/FooterGroupText.tsx
+++ b/src/components/Footer/FooterGroupText.tsx
@@ -1,11 +1,14 @@
 import classNames from 'classnames'
-import { FC } from 'react'
+import { FC, PropsWithChildren } from 'react'
 
 interface Props {
   className?: string
 }
 
-export const FooterGroupText: FC<Props> = ({ className = '', children }) => {
+export const FooterGroupText: FC<PropsWithChildren<Props>> = ({
+  className = '',
+  children,
+}) => {
   return (
     <div className={classNames('px-2 py-2 sm:mx-1', 'text-sm', className)}>
       {children}
diff --git a/src/components/Links/LinkAction.tsx b/src/components/Links/LinkAction.tsx
index 8ef8506c..035acf6d 100644
--- a/src/components/Links/LinkAction.tsx
+++ b/src/components/Links/LinkAction.tsx
@@ -1,5 +1,5 @@
 import classNames from 'classnames'
-import { FC, MouseEvent } from 'react'
+import { FC, MouseEvent, PropsWithChildren } from 'react'
 
 interface Props {
   className?: string
@@ -7,7 +7,7 @@ interface Props {
   onClick?: (event: MouseEvent<HTMLDivElement>) => void
 }
 
-export const LinkAction: FC<Props> = ({
+export const LinkAction: FC<PropsWithChildren<Props>> = ({
   children,
   className,
   hasHover = false,
diff --git a/src/components/Links/LinkGroupButton.tsx b/src/components/Links/LinkGroupButton.tsx
index 9210ed5a..6c4d72f2 100644
--- a/src/components/Links/LinkGroupButton.tsx
+++ b/src/components/Links/LinkGroupButton.tsx
@@ -1,11 +1,14 @@
 import classNames from 'classnames'
-import { FC } from 'react'
+import { FC, PropsWithChildren } from 'react'
 
 interface Props {
   onClick?: () => void
 }
 
-export const LinkGroupButton: FC<Props> = ({ children, onClick }) => {
+export const LinkGroupButton: FC<PropsWithChildren<Props>> = ({
+  children,
+  onClick,
+}) => {
   return (
     <button
       className={classNames(
diff --git a/src/components/Search/SearchHint.tsx b/src/components/Search/SearchHint.tsx
index 46ff6f31..8a3d66ea 100644
--- a/src/components/Search/SearchHint.tsx
+++ b/src/components/Search/SearchHint.tsx
@@ -1,11 +1,14 @@
-import { FC, Fragment } from 'react'
+import { FC, Fragment, PropsWithChildren } from 'react'
 import { Kbd } from '../basics/Kbd'
 
 interface Props {
   inputs?: string[]
 }
 
-export const SearchHint: FC<Props> = ({ children, inputs }) => {
+export const SearchHint: FC<PropsWithChildren<Props>> = ({
+  children,
+  inputs,
+}) => {
   return (
     <div className="mt-4">
       {inputs !== undefined && inputs.length > 0 ? (
diff --git a/src/components/Search/SearchHints.tsx b/src/components/Search/SearchHints.tsx
index cc62b464..34e60420 100644
--- a/src/components/Search/SearchHints.tsx
+++ b/src/components/Search/SearchHints.tsx
@@ -1,5 +1,5 @@
-import { FC } from 'react'
+import { FC, PropsWithChildren } from 'react'
 
-export const SearchHints: FC = ({ children }) => {
+export const SearchHints: FC<PropsWithChildren> = ({ children }) => {
   return <div className="mx-8 text-lg">{children}</div>
 }
diff --git a/src/components/basics/Kbd.tsx b/src/components/basics/Kbd.tsx
index b9433bd4..86853dc8 100644
--- a/src/components/basics/Kbd.tsx
+++ b/src/components/basics/Kbd.tsx
@@ -1,7 +1,7 @@
 import classNames from 'classnames'
-import { FC } from 'react'
+import { FC, PropsWithChildren } from 'react'
 
-export const Kbd: FC = ({ children }) => {
+export const Kbd: FC<PropsWithChildren> = ({ children }) => {
   return (
     <kbd
       className={classNames(
diff --git a/src/index.tsx b/src/index.tsx
index cf483f12..639ed917 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,6 +1,4 @@
 import { StrictMode } from 'react'
-// @ts-expect-error wait for React 18 types to be fixed
-// https://github.com/DefinitelyTyped/DefinitelyTyped/pull/56210/files#r846261799
 import { createRoot } from 'react-dom/client'
 import { Provider } from 'react-redux'
 import { WebdevHome } from './components/App/App'