react-native-render-html icon indicating copy to clipboard operation
react-native-render-html copied to clipboard

defaultTextProps style overwrites renderers

Open VNDRN opened this issue 2 years ago • 2 comments

Decision Table

  • [X] My issue does not look like “The HTML attribute 'xxx' is ignored” (unless we claim support for it)
  • [X] My issue does not look like “The HTML element <yyy> is not rendered”

Good Faith Declaration

  • [X] I have read the HELP document here: https://git.io/JBi6R
  • [X] I have read the CONTRIBUTING document here: https://git.io/JJ0Pg
  • [X] I have confirmed that this bug has not been reported yet

Description

defaultTextProps overwrites customrenderers style. The provided snack is a minimal reproduction. I believe it should be the other way around (as defaultTextProps should be default & overwritable?)

My main issue is: I should be able to add custom fontFamilies to em and strong tags, if they are nested like this:

strongFont italicFont strongItalicFont

this is possible with customrenderers, but I can't provide a default style/font for eg: p tags... I tried to set defaultStyles with tagStyles, but those also overwrite the customrenderers (and it's not possible to see if the tag is nested)

Any solution to this problem or help is much appreciated?

React Native Information

confer snack

RNRH Version

6.3.4

Tested Platforms

  • [X] Android
  • [X] iOS
  • [X] Web
  • [ ] MacOS
  • [ ] Windows

Reproduction Platforms

  • [X] Android
  • [X] iOS
  • [ ] Web
  • [ ] MacOS
  • [ ] Windows

Minimal, Reproducible Example

https://snack.expo.dev/@upgradeestate/rnrhtml-template

const Demo = ()=>{
  const demoRenderer = useMemo(
    () => ({
      strong: ({ TDefaultRenderer, ...props }) => (
        <TDefaultRenderer {...props} style={{ color: 'red' }} />
      ),
    }),
    [],
  );

  return (
    <RenderHTML
      systemFonts={systemFonts}
      renderers={demoRenderer}
      defaultTextProps={{ style: { color: 'blue' } }}
      source={{ html: `<strong>this should be red</strong>` }}
    />
  );
}

Additional Notes

If this is incorrectly formatted or my question was answered somewhere else, please let me know!

VNDRN avatar Nov 27 '23 12:11 VNDRN

@VNDRN same issue with selectable: false/false

RuslanAktaev avatar Jan 08 '24 05:01 RuslanAktaev