react-native-render-html
react-native-render-html copied to clipboard
Cannot customize ol or ul item bullet icons.
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.
.
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 see https://meliorence.github.io/react-native-render-html/api/renderhtmlprops#customliststylespecs
Closing because this is not a bug.