refactor: update TypeScript definitions for custom JSX elements and clean up global declarations in emoji picker (#26985)

web/app/components/base/emoji-picker/Inner.tsx

@@ -14,16 +14,6 @@ import Divider from '@/app/components/base/divider'
 import { searchEmoji } from '@/utils/emoji'
 import cn from '@/utils/classnames'
 
-declare global {
-  // eslint-disable-next-line ts/no-namespace
-  namespace JSX {
-    // eslint-disable-next-line ts/consistent-type-definitions
-    interface IntrinsicElements {
-      'em-emoji': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>
-    }
-  }
-}
-
 init({ data })
 
 const backgroundColors = [

web/global.d.ts

@@ -1,3 +1,6 @@
+import './types/i18n'
+import './types/jsx'
+
 declare module 'lamejs';
 declare module 'lamejs/src/js/MPEGMode';
 declare module 'lamejs/src/js/Lame';
@@ -9,4 +12,4 @@ declare module '*.mdx' {
   export default MDXComponent
 }
 
-import './types/i18n'
+export {}

web/types/jsx.d.ts

@@ -0,0 +1,13 @@
+// TypeScript type definitions for custom JSX elements
+// Custom JSX elements for emoji-mart web components
+
+import 'react'
+
+declare module 'react' {
+  namespace JSX {
+    // eslint-disable-next-line ts/consistent-type-definitions
+    interface IntrinsicElements {
+      'em-emoji': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>
+    }
+  }
+}