Cleanup worklet registration logic

cpp/RuntimeDecorator.cpp

@@ -8,27 +8,27 @@ namespace livemarkdown {
 
 void injectJSIBindings(jsi::Runtime &rt) {
 
-  rt.global().setProperty(rt, "setMarkdownRuntime", jsi::Function::createFromHostFunction(
+  rt.global().setProperty(rt, "jsi_setMarkdownRuntime", jsi::Function::createFromHostFunction(
       rt,
-      jsi::PropNameID::forAscii(rt, "setMarkdownRuntime"),
+      jsi::PropNameID::forAscii(rt, "jsi_setMarkdownRuntime"),
       1,
       [](jsi::Runtime &rt, const jsi::Value &thisValue, const jsi::Value *args, size_t count) -> jsi::Value {
         setMarkdownRuntime(reanimated::extractWorkletRuntime(rt, args[0]));
         return jsi::Value::undefined();
       }));
 
-  rt.global().setProperty(rt, "registerMarkdownWorklet", jsi::Function::createFromHostFunction(
+  rt.global().setProperty(rt, "jsi_registerMarkdownWorklet", jsi::Function::createFromHostFunction(
       rt,
-      jsi::PropNameID::forAscii(rt, "registerMarkdownWorklet"),
+      jsi::PropNameID::forAscii(rt, "jsi_registerMarkdownWorklet"),
       1,
       [](jsi::Runtime &rt, const jsi::Value &thisValue, const jsi::Value *args, size_t count) -> jsi::Value {
         auto parserId = registerMarkdownWorklet(reanimated::extractShareableOrThrow<ShareableWorklet>(rt, args[0]));
         return jsi::Value(parserId);
       }));
 
-  rt.global().setProperty(rt, "unregisterMarkdownWorklet", jsi::Function::createFromHostFunction(
+  rt.global().setProperty(rt, "jsi_unregisterMarkdownWorklet", jsi::Function::createFromHostFunction(
       rt,
-      jsi::PropNameID::forAscii(rt, "unregisterMarkdownWorklet"),
+      jsi::PropNameID::forAscii(rt, "jsi_unregisterMarkdownWorklet"),
       1,
       [](jsi::Runtime &rt, const jsi::Value &thisValue, const jsi::Value *args, size_t count) -> jsi::Value {
         auto parserId = static_cast<int>(args[0].asNumber());

src/MarkdownTextInput.tsx

@@ -1,31 +1,53 @@
 import {StyleSheet, TextInput, processColor} from 'react-native';
 import React from 'react';
 import type {TextInputProps} from 'react-native';
-import {makeShareableCloneRecursive} from 'react-native-reanimated';
+import {createWorkletRuntime, makeShareableCloneRecursive} from 'react-native-reanimated';
+import type {WorkletRuntime} from 'react-native-reanimated';
 import type {ShareableRef, WorkletFunction} from 'react-native-reanimated/lib/typescript/commonTypes';
 
 import MarkdownTextInputDecoratorViewNativeComponent from './MarkdownTextInputDecoratorViewNativeComponent';
 import NativeLiveMarkdownModule from './NativeLiveMarkdownModule';
 import type * as MarkdownTextInputDecoratorViewNativeComponentTypes from './MarkdownTextInputDecoratorViewNativeComponent';
 import * as StyleUtils from './styleUtils';
 import type * as StyleUtilsTypes from './styleUtils';
-import getMarkdownRuntime from './native/getMarkdownRuntime';
 
 declare global {
   // eslint-disable-next-line no-var
-  var registerMarkdownWorklet: (shareableWorklet: ShareableRef<WorkletFunction<[], void>>) => number;
+  var jsi_setMarkdownRuntime: (runtime: WorkletRuntime) => void;
   // eslint-disable-next-line no-var
-  var unregisterMarkdownWorklet: (parserId: number) => void;
+  var jsi_registerMarkdownWorklet: (shareableWorklet: ShareableRef<WorkletFunction<[string], Range[]>>) => number;
+  // eslint-disable-next-line no-var
+  var jsi_unregisterMarkdownWorklet: (parserId: number) => void;
 }
 
-NativeLiveMarkdownModule?.install();
-
-const markdownRuntime = getMarkdownRuntime();
-// @ts-expect-error TODO
-global.setMarkdownRuntime(markdownRuntime);
+let initialized = false;
+let workletRuntime: WorkletRuntime | undefined;
 
-if (NativeLiveMarkdownModule) {
+function initializeLiveMarkdownIfNeeded() {
+  if (initialized) {
+    return;
+  }
+  if (!NativeLiveMarkdownModule) {
+    throw new Error('[react-native-live-markdown] NativeLiveMarkdownModule is not available');
+  }
   NativeLiveMarkdownModule.install();
+  if (!global.jsi_setMarkdownRuntime) {
+    throw new Error('[react-native-live-markdown] global.jsi_setMarkdownRuntime is not available');
+  }
+  workletRuntime = createWorkletRuntime('LiveMarkdownRuntime');
+  global.jsi_setMarkdownRuntime(workletRuntime);
+  initialized = true;
+}
+
+function registerParser(parser: (input: string) => Range[]): number {
+  initializeLiveMarkdownIfNeeded();
+  const shareableWorklet = makeShareableCloneRecursive(parser) as ShareableRef<WorkletFunction<[string], Range[]>>;
+  const parserId = global.jsi_registerMarkdownWorklet(shareableWorklet);
+  return parserId;
+}
+
+function unregisterParser(parserId: number) {
+  global.jsi_unregisterMarkdownWorklet(parserId);
 }
 
 type PartialMarkdownStyle = StyleUtilsTypes.PartialMarkdownStyle;
@@ -39,7 +61,7 @@ interface Range {
 
 interface MarkdownTextInputProps extends TextInputProps {
   markdownStyle?: PartialMarkdownStyle;
-  parser: (text: string) => Range[];
+  parser: (value: string) => Range[];
 }
 
 function processColorsInMarkdownStyle(input: MarkdownStyle): MarkdownStyle {
@@ -73,19 +95,18 @@ const MarkdownTextInput = React.forwardRef<TextInput, MarkdownTextInputProps>((p
   }
 
   // eslint-disable-next-line no-underscore-dangle
-  const workletHash = (props.parser as unknown as {__workletHash: number}).__workletHash;
+  const workletHash = (props.parser as {__workletHash?: number}).__workletHash;
   if (workletHash === undefined) {
     throw new Error('[react-native-live-markdown] `parser` is not a worklet');
   }
 
   const parserId = React.useMemo(() => {
-    const shareableWorklet = makeShareableCloneRecursive(props.parser) as ShareableRef<WorkletFunction<[], void>>;
-    return global.registerMarkdownWorklet(shareableWorklet);
+    return registerParser(props.parser);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [workletHash]);
 
   React.useEffect(() => {
-    return () => global.unregisterMarkdownWorklet(parserId);
+    return () => unregisterParser(parserId);
   }, [parserId]);
 
   return (