react-native-markdown-package
react-native-markdown-package copied to clipboard
SVG rendering support
Hey there! I'm using this package for a small project and I realized you render images with the react-native Image component which does not support SVG files. I made some small changes to support SVG uri's with react-native-svg
. I tried opening a PR but couldn't. Is this something you would like to add to the package? I would need write permissions then.
Let me know what you think! Here's the proposed diff.
diff --git a/rules.js b/rules.js
index 789b67f..faa5ba2 100644
--- a/rules.js
+++ b/rules.js
@@ -1,5 +1,5 @@
import React from 'react';
-
+import { SvgUri } from 'react-native-svg';
import {
Image,
Text,
@@ -141,12 +141,20 @@ module.exports = function (styles, opts = {}) {
react: function (node, output, {...state}) {
var imageParam = opts.imageParam ? opts.imageParam : '';
var target = node.target + imageParam;
- var image = React.createElement(Image, {
- key: state.key,
- // resizeMode: 'contain',
- source: {uri: target},
- style: styles.image,
- });
+ var image
+ if (target.match(/.*\.svg(\?.*)?$/)) {
+ image = React.createElement(SvgUri, {
+ key: state.key,
+ uri: target,
+ style: styles.image,
+ });
+ } else{
+ image = React.createElement(Image, {
+ key: state.key,
+ source: {uri: target},
+ style: styles.image,
+ });
+ }
if (enableLightBox) {
return React.createElement(Lightbox, {
activeProps: styles.imageBox,
The only remaining thing other than this would be adding the dependency to the package.json and the lock file.