feat: add types to web implementation, extract common types

apps/example-web/src/App.tsx

@@ -5,7 +5,7 @@ function App() {
   return (
     <div className="container">
       <div>Text input</div>
-      <EnrichedTextInput />
+      <EnrichedTextInput placeholder="Type something..." />
     </div>
   );
 }

apps/example/src/App.tsx

@@ -318,18 +318,18 @@ export default function App() {
             cursorColor="dodgerblue"
             autoCapitalize="sentences"
             linkRegex={LINK_REGEX}
-            onChangeText={(e) => handleChangeText(e.nativeEvent)}
-            onChangeHtml={(e) => handleChangeHtml(e.nativeEvent)}
-            onChangeState={(e) => handleChangeState(e.nativeEvent)}
+            onChangeText={handleChangeText}
+            onChangeHtml={handleChangeHtml}
+            onChangeState={handleChangeState}
             onLinkDetected={handleLinkDetected}
             onMentionDetected={console.log}
             onStartMention={handleStartMention}
             onChangeMention={handleChangeMention}
             onEndMention={handleEndMention}
             onFocus={handleFocusEvent}
             onBlur={handleBlurEvent}
-            onChangeSelection={(e) => handleSelectionChangeEvent(e.nativeEvent)}
-            onKeyPress={(e) => handleKeyPress(e.nativeEvent)}
+            onChangeSelection={handleSelectionChangeEvent}
+            onKeyPress={handleKeyPress}
             androidExperimentalSynchronousEvents={
               ANDROID_EXPERIMENTAL_SYNCHRONOUS_EVENTS
             }

src/common/defaultProps.ts

@@ -0,0 +1,8 @@
+export const ENRICHED_TEXT_INPUT_DEFAULTS = {
+  editable: true,
+  mentionIndicators: ['@'],
+  autoCapitalize: 'sentences' as const,
+  htmlStyle: {},
+  androidExperimentalSynchronousEvents: false,
+  scrollEnabled: true,
+};

src/common/types.ts

@@ -0,0 +1,67 @@
+// Re-export event types from the NativeComponent spec file (source of truth for Codegen)
+export type {
+  OnChangeTextEvent,
+  OnChangeHtmlEvent,
+  OnChangeStateEvent,
+  OnChangeStateDeprecatedEvent,
+  OnKeyPressEvent,
+} from '../spec/EnrichedTextInputNativeComponent';
+
+export interface OnMentionDetected {
+  text: string;
+  indicator: string;
+  attributes: Record<string, string>;
+}
+
+export interface OnLinkDetected {
+  text: string;
+  url: string;
+  start: number;
+  end: number;
+}
+
+export interface OnChangeSelectionEvent {
+  start: number;
+  end: number;
+  text: string;
+}
+
+export interface OnChangeMentionEvent {
+  indicator: string;
+  text: string;
+}
+
+export interface EnrichedTextInputInstanceBase {
+  // General commands
+  focus: () => void;
+  blur: () => void;
+  setValue: (value: string) => void;
+  setSelection: (start: number, end: number) => void;
+  getHTML: () => Promise<string>;
+
+  // Text formatting commands
+  toggleBold: () => void;
+  toggleItalic: () => void;
+  toggleUnderline: () => void;
+  toggleStrikeThrough: () => void;
+  toggleInlineCode: () => void;
+  toggleH1: () => void;
+  toggleH2: () => void;
+  toggleH3: () => void;
+  toggleH4: () => void;
+  toggleH5: () => void;
+  toggleH6: () => void;
+  toggleCodeBlock: () => void;
+  toggleBlockQuote: () => void;
+  toggleOrderedList: () => void;
+  toggleUnorderedList: () => void;
+  toggleCheckboxList: (checked: boolean) => void;
+  setLink: (start: number, end: number, text: string, url: string) => void;
+  setImage: (src: string, width: number, height: number) => void;
+  startMention: (indicator: string) => void;
+  setMention: (
+    indicator: string,
+    text: string,
+    attributes?: Record<string, string>
+  ) => void;
+}

src/index.native.tsx

@@ -2,11 +2,12 @@ export * from './native/EnrichedTextInput';
 export type {
   OnChangeTextEvent,
   OnChangeHtmlEvent,
+  OnChangeMentionEvent,
+  OnChangeSelectionEvent,
   OnChangeStateEvent,
   OnChangeStateDeprecatedEvent,
+  OnKeyPressEvent,
   OnLinkDetected,
   OnMentionDetected,
-  OnChangeSelectionEvent,
-  OnKeyPressEvent,
-} from './spec/EnrichedTextInputNativeComponent';
-export type { HtmlStyle, MentionStyleProperties } from './types';
+} from './common/types';
+export type { HtmlStyle, MentionStyleProperties } from './native/types';

src/index.tsx

@@ -1 +1,12 @@
 export * from './web/EnrichedTextInput';
+export type {
+  OnChangeTextEvent,
+  OnChangeHtmlEvent,
+  OnChangeMentionEvent,
+  OnChangeSelectionEvent,
+  OnChangeStateEvent,
+  OnChangeStateDeprecatedEvent,
+  OnKeyPressEvent,
+  OnLinkDetected,
+  OnMentionDetected,
+} from './common/types';