diff --git a/src/elements/G.tsx b/src/elements/G.tsx
index 602cde257..c8e19236e 100644
--- a/src/elements/G.tsx
+++ b/src/elements/G.tsx
@@ -1,5 +1,6 @@
import type { ReactNode } from 'react';
import * as React from 'react';
+import { Children } from 'react';
import extractProps, { propsAndStyles } from '../lib/extract/extractProps';
import { extractFont } from '../lib/extract/extractText';
import extractTransform from '../lib/extract/extractTransform';
@@ -41,11 +42,18 @@ export default class G
extends Shape {
if (hasProps(font)) {
extractedProps.font = font;
}
+
+ const childArray = props.children
+ ? Children.map(props.children, (child) =>
+ React.cloneElement(child, { ...extractedProps })
+ )
+ : [];
+
return (
this.refMethod(ref as (G & NativeMethods) | null)}
{...extractedProps}>
- {props.children}
+ {childArray}
);
}
diff --git a/src/lib/extract/extractBrush.ts b/src/lib/extract/extractBrush.ts
index a3b062815..a63649dbe 100644
--- a/src/lib/extract/extractBrush.ts
+++ b/src/lib/extract/extractBrush.ts
@@ -8,7 +8,25 @@ const currentColorBrush = { type: 2 };
const contextFillBrush = { type: 3 };
const contextStrokeBrush = { type: 4 };
+function isBrush(color: any): boolean {
+ const isObject = !!color && typeof color === 'object';
+ const hasType = () => 'type' in color && typeof color.type === 'number';
+ const hasBrushRef = () => 'brushRef' in color && typeof color.brushRef === 'string';
+ const hasPayload = () => 'payload' in color && typeof color.payload === 'number';
+
+ return (
+ isObject &&
+ hasType() &&
+ (hasBrushRef() || hasPayload())
+ );
+}
+
export default function extractBrush(color: ColorValue) {
+ if (isBrush(color)) {
+ // If the color comes from the AST it's already a brush
+ return color;
+ }
+
if (color === 'none') {
return null;
}
diff --git a/src/lib/extract/extractFill.ts b/src/lib/extract/extractFill.ts
index bdc00addd..731b8449c 100644
--- a/src/lib/extract/extractFill.ts
+++ b/src/lib/extract/extractFill.ts
@@ -21,6 +21,7 @@ export default function extractFill(
o.fill =
!fill && typeof fill !== 'number' ? defaultFill : extractBrush(fill);
} else {
+ inherited.push('fill');
// we want the default value of fill to be black to match the spec
o.fill = defaultFill;
}