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

Cannot customize ol or ul item bullet icons.

Open ashwanihundwani1986 opened this issue 1 year ago • 1 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

I want to have a customized bullet point. For example an image like arrow or checkmark for ul or ol list items. So I want to replace the circles with something like arrows. Also, is there a way add bottom spacing padding for each list item.

It was possible upto version V5 as in renderers call back we used to get the React DOM. But in V6 we do not have access to React DOM due to rendering engine change.

Simulator Screen Shot - iPhone 13 - 2022-07-14 at 00 26 45 .

React Native Information

System:
    OS: macOS 12.2.1
    CPU: (8) arm64 Apple M1
    Memory: 122.81 MB / 8.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.15.0 - /usr/local/bin/node
    Yarn: 1.22.18 - /usr/local/bin/yarn
    npm: 8.5.5 - /usr/local/bin/npm
    Watchman: Not Found
  Managers:
    CocoaPods: 1.11.3 - /opt/homebrew/bin/pod
  SDKs:
    iOS SDK:
      Platforms: DriverKit 21.4, iOS 15.4, macOS 12.3, tvOS 15.4, watchOS 8.5
    Android SDK: Not Found
  IDEs:
    Android Studio: 2021.2 AI-212.5712.43.2112.8512546
    Xcode: 13.3.1/13E500a - /usr/bin/xcodebuild
  Languages:
    Java: 11.0.15 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 17.0.2 => 17.0.2 
    react-native: 0.68.2 => 0.68.2 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

RNRH Version

V6

Tested Platforms

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

Reproduction Platforms

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

Minimal, Reproducible Example

ul: (rendererProps: CustomRendererProps<TNode>) => { return <BulletComponent node={rendererProps.tnode} />; }, ol: (rendererProps: CustomRendererProps<TNode>) => { return <BulletComponent node={rendererProps.tnode} />; },

How to get React DOM from CustomRendererProps

Additional Notes

No response

ashwanihundwani1986 avatar Jul 13 '22 19:07 ashwanihundwani1986

@ashwanihundwani1986 see https://meliorence.github.io/react-native-render-html/api/renderhtmlprops#customliststylespecs

jsamr avatar Jul 14 '22 20:07 jsamr

Closing because this is not a bug.

jsamr avatar Nov 22 '22 11:11 jsamr