feat: define marker attributes

Author: msand

android/src/main/java/com/horcrux/svg/RenderableViewManager.java

@@ -1030,6 +1030,21 @@ public void setMask(VirtualView node, String mask) {
         node.setMask(mask);
     }
 
+    @ReactProp(name = "markerStart")
+    public void setMarkerStart(VirtualView node, String markerStart) {
+        node.setMarkerStart(markerStart);
+    }
+
+    @ReactProp(name = "markerMid")
+    public void setMarkerMid(VirtualView node, String markerMid) {
+        node.setMarkerMid(markerMid);
+    }
+
+    @ReactProp(name = "markerEnd")
+    public void setMarkerEnd(VirtualView node, String markerEnd) {
+        node.setMarkerEnd(markerEnd);
+    }
+
     @ReactProp(name = "clipPath")
     public void setClipPath(VirtualView node, String clipPath) {
         node.setClipPath(clipPath);

android/src/main/java/com/horcrux/svg/VirtualView.java

@@ -65,6 +65,9 @@ abstract public class VirtualView extends ReactViewGroup {
     int mClipRule;
     private @Nullable String mClipPath;
     @Nullable String mMask;
+    @Nullable String mMarkerStart;
+    @Nullable String mMarkerMid;
+    @Nullable String mMarkerEnd;
 
     private static final int CLIP_RULE_EVENODD = 0;
     static final int CLIP_RULE_NONZERO = 1;
@@ -241,6 +244,24 @@ public void setMask(String mask) {
         invalidate();
     }
 
+    @ReactProp(name = "markerStart")
+    public void setMarkerStart(String markerStart) {
+        mMarkerStart = markerStart;
+        invalidate();
+    }
+
+    @ReactProp(name = "markerMid")
+    public void setMarkerMid(String markerMid) {
+        mMarkerMid = markerMid;
+        invalidate();
+    }
+
+    @ReactProp(name = "markerEnd")
+    public void setMarkerEnd(String markerEnd) {
+        mMarkerEnd = markerEnd;
+        invalidate();
+    }
+
     @ReactProp(name = "clipPath")
     public void setClipPath(String clipPath) {
         mCachedClipPath = null;

ios/RNSVGNode.h

@@ -31,6 +31,9 @@ extern CGFloat const RNSVG_DEFAULT_FONT_SIZE;
 @property (nonatomic, assign) RNSVGCGFCRule clipRule;
 @property (nonatomic, strong) NSString *clipPath;
 @property (nonatomic, strong) NSString *mask;
+@property (nonatomic, strong) NSString *markerStart;
+@property (nonatomic, strong) NSString *markerMid;
+@property (nonatomic, strong) NSString *markerEnd;
 @property (nonatomic, assign) BOOL responsible;
 @property (nonatomic, assign) CGAffineTransform matrix;
 @property (nonatomic, assign) CGAffineTransform transforms;

ios/RNSVGNode.m

@@ -254,6 +254,33 @@ - (void)setMask:(NSString *)mask
     [self invalidate];
 }
 
+- (void)setMarkerStart:(NSString *)markerStart
+{
+    if ([_markerStart isEqualToString:markerStart]) {
+        return;
+    }
+    _markerStart = markerStart;
+    [self invalidate];
+}
+
+- (void)setMarkerMid:(NSString *)markerMid
+{
+    if ([_markerMid isEqualToString:markerMid]) {
+        return;
+    }
+    _markerMid = markerMid;
+    [self invalidate];
+}
+
+- (void)setMarkerEnd:(NSString *)markerEnd
+{
+    if ([_markerEnd isEqualToString:markerEnd]) {
+        return;
+    }
+    _markerEnd = markerEnd;
+    [self invalidate];
+}
+
 - (void)beginTransparencyLayer:(CGContextRef)context
 {
     if (_transparent) {

ios/ViewManagers/RNSVGNodeManager.m

@@ -163,6 +163,9 @@ - (UIView *)view
     [view invalidate];
 }
 RCT_EXPORT_VIEW_PROPERTY(mask, NSString)
+RCT_EXPORT_VIEW_PROPERTY(markerStart, NSString)
+RCT_EXPORT_VIEW_PROPERTY(markerMid, NSString)
+RCT_EXPORT_VIEW_PROPERTY(markerEnd, NSString)
 RCT_EXPORT_VIEW_PROPERTY(clipPath, NSString)
 RCT_EXPORT_VIEW_PROPERTY(clipRule, RNSVGCGFCRule)
 RCT_EXPORT_VIEW_PROPERTY(responsible, BOOL)

src/lib/extract/extractProps.ts

@@ -27,6 +27,10 @@ export default function extractProps(
   props: {
     id?: string;
     mask?: string;
+    marker?: string;
+    markerStart?: string;
+    markerMid?: string;
+    markerEnd?: string;
     clipPath?: string;
     opacity?: NumberProp;
     onLayout?: () => void;
@@ -38,7 +42,18 @@ export default function extractProps(
     ClipProps,
   ref: Object,
 ) {
-  const { opacity, onLayout, id, clipPath, mask, transform } = props;
+  const {
+    opacity,
+    onLayout,
+    id,
+    clipPath,
+    mask,
+    marker,
+    markerStart = marker,
+    markerMid = marker,
+    markerEnd = marker,
+    transform,
+  } = props;
   const styleProperties: string[] = [];
   const transformProps = props2transform(props);
   const matrix = transformToMatrix(transformProps, transform);
@@ -50,8 +65,14 @@ export default function extractProps(
     propList: string[];
     onLayout?: () => void;
     ref?: (instance: Component | null) => void;
+    markerStart?: string;
+    markerMid?: string;
+    markerEnd?: string;
   } = {
     matrix,
+    markerStart,
+    markerMid,
+    markerEnd,
     onLayout,
     ...transformProps,
     propList: styleProperties,