Problema

Estoy usando react-native-render-html para renderizar algo de html en React Native . El problema es que este html contiene algunos marcadores de posición como {{{placeholder:items:0}}} que deben reemplazarse con un React Element .

Código

Estoy usando la función onText actualmente como se describe en este ejemplo :

 function onText(text) {
 const toReplace = text.data.match(gemstoneRegex);

 if (toReplace?.length) {
 let [placeholder] = toReplace;
 placeholder = placeholder.replace(/\{/g, "");
 placeholder = placeholder.replace(/\}/g, "");

 const [name, position] = placeholder.split(":items:");

 text.data =
 (
 <Gemstone
 stones={[gemstones[name]?.de[position]]}
 displayTitle={gemstones[name]?.de[0]?.displaytitle || name}
 fieldName={name}
 />
 ) || `${name} couldn't be replaced!`;
 }
 }

Esto funcionaría bien para una cadena de texto simple, pero desafortunadamente no para un elemento React . ¿Hay alguna forma de hacer esto? La función onElement parece tener métodos de utilidad para agregar y eliminar elementos. ¿Es eso también posible para los nodejs de texto?