diff --git a/src/components/svelte-react.ts b/src/components/svelte-react.ts
index 12e25c6ad..84c0b339d 100644
--- a/src/components/svelte-react.ts
+++ b/src/components/svelte-react.ts
@@ -6,7 +6,8 @@ import {
   useCallback,
   type ForwardedRef,
   type PropsWithChildren,
-  useState
+  useState,
+  type DOMAttributes
 } from 'react'
 import type { SvelteComponentTyped } from 'svelte'
 
@@ -43,6 +44,16 @@ export type ReactProps<Props, Events> = Props & {
   [P in IntrinsicProps]?: JSX.IntrinsicElements['div'][P]
 }
 
+type EventPropsNames = keyof DOMAttributes<unknown>
+
+type EventPropsNameMap = {
+  [P in EventPropsNames as Lowercase<P>]: P
+}
+export type EventProps<T> = {
+  [P in keyof T as P extends Lowercase<EventPropsNames>
+    ? EventPropsNameMap[P]
+    : P]: T[P]
+}
 const useEventHandlers = (props: any) => {
   const [el, setEl] = useState<HTMLElement>()
   const lastValue = useRef<{ [key: string]: (...args: any[]) => any }>({})
diff --git a/src/scripts/gen-react-bindings.js b/src/scripts/gen-react-bindings.js
index 7687b192b..4ef1f88a7 100644
--- a/src/scripts/gen-react-bindings.js
+++ b/src/scripts/gen-react-bindings.js
@@ -13,14 +13,14 @@ const getEventsTypeDefinition = (
   componentEventNames,
   svelteFilePath
 ) => `
-export type ${componentName}EventProps = {
+export type ${componentName}EventProps = EventProps<{
 ${componentEventNames
   .map(
     ({ eventName, detailType }) =>
       `  ${eventName}?: (event: ${detailType}) => void`
   )
   .join(';\n')}
-}
+}>
 `
 
 const findEventsTypeDefinition = async (svelteFilePath, componentName) => {
@@ -37,7 +37,7 @@ const findEventsTypeDefinition = async (svelteFilePath, componentName) => {
   const componentEventNames = [
     ...fileContents.toString().matchAll(typeRegex)
   ].map((match) => ({
-    eventName: `on${match[1][0].toUpperCase()}${match[1].substring(1)}`,
+    eventName: `on${match[1]}`,
     detailType: match[2]
   }))
 
@@ -125,7 +125,7 @@ export * from '../web-components/${fileNameWithoutExtension}.js'
 
   const typeDef = `
 import type * as React from 'react'
-import type { ReactProps } from '../src/components/svelte-react'
+import type { ReactProps, EventProps } from '../src/components/svelte-react'
 import type { ${componentName}Events as SvelteEvents, ${componentName}Props as SvelteProps } from '../types/components/${containingFolder}/${fileName}';
 ${eventTypeDefinition && eventTypeDefinition}
 export type ${componentName}Props${funcConstraints} = ${