@shopify/react-native-skia 0.1.190 → 0.1.192

package/cpp/api/JsiSkRuntimeEffect.h

@@ -32,12 +32,6 @@ struct RuntimeEffectUniform {
 class JsiSkRuntimeEffect
     : public JsiSkWrappingSkPtrHostObject<SkRuntimeEffect> {
 public:
-  static sk_sp<SkRuntimeEffect> fromValue(jsi::Runtime &runtime,
-                                          const jsi::Value &obj) {
-    const auto &object = obj.asObject(runtime);
-    return object.asHostObject<JsiSkRuntimeEffect>(runtime)->getObject();
-  }
-
   JSI_HOST_FUNCTION(makeShader) {
     auto uniforms = castUniforms(runtime, arguments[0]);
 
@@ -121,6 +115,8 @@ public:
     return jsi::String::createFromAscii(runtime, getObject()->source());
   }
 
+  EXPORT_JSI_API_TYPENAME(JsiSkRuntimeEffect, "RuntimeEffect")
+
   JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(JsiSkRuntimeEffect, makeShader),
                        JSI_EXPORT_FUNC(JsiSkRuntimeEffect,
                                        makeShaderWithChildren),
@@ -129,7 +125,8 @@ public:
                                        getUniformFloatCount),
                        JSI_EXPORT_FUNC(JsiSkRuntimeEffect, getUniformName),
                        JSI_EXPORT_FUNC(JsiSkRuntimeEffect, getUniform),
-                       JSI_EXPORT_FUNC(JsiSkRuntimeEffect, source))
+                       JSI_EXPORT_FUNC(JsiSkRuntimeEffect, source),
+                       JSI_EXPORT_FUNC(JsiSkRuntimeEffect, dispose))
 
   JsiSkRuntimeEffect(std::shared_ptr<RNSkPlatformContext> context,
                      sk_sp<SkRuntimeEffect> rt)

package/cpp/api/JsiSkRuntimeShaderBuilder.h

@@ -47,16 +47,8 @@ public:
     return jsi::Value::undefined();
   }
 
-  JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(JsiSkRuntimeShaderBuilder, setUniform))
-
-  /**
-    Returns the underlying object from a host object of this type
-   */
-  static std::shared_ptr<SkRuntimeShaderBuilder>
-  fromValue(jsi::Runtime &runtime, const jsi::Value &obj) {
-    const auto &object = obj.asObject(runtime);
-    return object.asHostObject<JsiSkRuntimeShaderBuilder>(runtime)->getObject();
-  }
+  JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(JsiSkRuntimeShaderBuilder, setUniform),
+                       JSI_EXPORT_FUNC(JsiSkRuntimeShaderBuilder, dispose))
 
   /**
     Returns the jsi object from a host object of this type

package/cpp/api/JsiSkSVG.h

@@ -24,9 +24,7 @@ public:
       : JsiSkWrappingSkPtrHostObject<SkSVGDOM>(std::move(context),
                                                std::move(svgdom)) {}
 
-  JSI_PROPERTY_GET(__typename__) {
-    return jsi::String::createFromUtf8(runtime, "SVG");
-  }
+  EXPORT_JSI_API_TYPENAME(JsiSkSVG, "SVG")
 
   JSI_HOST_FUNCTION(width) {
     return static_cast<double>(getObject()->containerSize().width());
@@ -36,13 +34,6 @@ public:
     return static_cast<double>(getObject()->containerSize().height());
   }
 
-  JSI_EXPORT_PROPERTY_GETTERS(JSI_EXPORT_PROP_GET(JsiSkSVG, __typename__))
-
-  JSI_HOST_FUNCTION(dispose) {
-    setObject(nullptr);
-    return jsi::Value::undefined();
-  }
-
   JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(JsiSkSVG, width),
                        JSI_EXPORT_FUNC(JsiSkSVG, height),
                        JSI_EXPORT_FUNC(JsiSkSVG, dispose))

package/cpp/api/JsiSkShader.h

@@ -26,21 +26,7 @@ public:
       : JsiSkWrappingSkPtrHostObject<SkShader>(std::move(context),
                                                std::move(shader)) {}
 
-  // TODO: declare in JsiSkWrappingSkPtrHostObject via extra template parameter?
-  JSI_PROPERTY_GET(__typename__) {
-    return jsi::String::createFromUtf8(runtime, "Shader");
-  }
-
-  JSI_EXPORT_PROPERTY_GETTERS(JSI_EXPORT_PROP_GET(JsiSkShader, __typename__))
-
-  /**
-    Returns the underlying object from a host object of this type
-   */
-  static sk_sp<SkShader> fromValue(jsi::Runtime &runtime,
-                                   const jsi::Value &obj) {
-    return obj.asObject(runtime)
-        .asHostObject<JsiSkShader>(runtime)
-        ->getObject();
-  }
+  EXPORT_JSI_API_TYPENAME(JsiSkShader, "Shader")
+  JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(JsiSkShader, dispose))
 };
 } // namespace RNSkia

package/cpp/api/JsiSkSurface.h

@@ -29,10 +29,7 @@ public:
       : JsiSkWrappingSkPtrHostObject<SkSurface>(std::move(context),
                                                 std::move(surface)) {}
 
-  // TODO: declare in JsiSkWrappingSkPtrHostObject via extra template parameter?
-  JSI_PROPERTY_GET(__typename__) {
-    return jsi::String::createFromUtf8(runtime, "Surface");
-  }
+  EXPORT_JSI_API_TYPENAME(JsiSkSurface, "Surface")
 
   JSI_HOST_FUNCTION(getCanvas) {
     return jsi::Object::createFromHostObject(
@@ -58,20 +55,10 @@ public:
         runtime, std::make_shared<JsiSkImage>(getContext(), std::move(image)));
   }
 
-  JSI_EXPORT_PROPERTY_GETTERS(JSI_EXPORT_PROP_GET(JsiSkSurface, __typename__))
   JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(JsiSkSurface, getCanvas),
                        JSI_EXPORT_FUNC(JsiSkSurface, makeImageSnapshot),
-                       JSI_EXPORT_FUNC(JsiSkSurface, flush))
-
-  /**
-    Returns the underlying object from a host object of this type
-   */
-  static sk_sp<SkSurface> fromValue(jsi::Runtime &runtime,
-                                    const jsi::Value &obj) {
-    return obj.asObject(runtime)
-        .asHostObject<JsiSkSurface>(runtime)
-        ->getObject();
-  }
+                       JSI_EXPORT_FUNC(JsiSkSurface, flush),
+                       JSI_EXPORT_FUNC(JsiSkSurface, dispose))
 };
 
 } // namespace RNSkia

package/cpp/api/JsiSkTextBlob.h

@@ -25,23 +25,7 @@ public:
       : JsiSkWrappingSkPtrHostObject<SkTextBlob>(std::move(context),
                                                  std::move(shader)) {}
 
-  // TODO: declare in JsiSkWrappingSkPtrHostObject via extra template parameter?
-
-  JSI_PROPERTY_GET(__typename__) {
-    return jsi::String::createFromUtf8(runtime, "TextBlob");
-  }
-
-  JSI_EXPORT_PROPERTY_GETTERS(JSI_EXPORT_PROP_GET(JsiSkTextBlob,
-                                                  __typename__), )
-
-  /**
-  Returns the underlying object from a host object of this type
- */
-  static sk_sp<SkTextBlob> fromValue(jsi::Runtime &runtime,
-                                     const jsi::Value &obj) {
-    return obj.asObject(runtime)
-        .asHostObject<JsiSkTextBlob>(runtime)
-        ->getObject();
-  }
+  EXPORT_JSI_API_TYPENAME(JsiSkTextBlob, "TextBlob")
+  JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(JsiSkTextBlob, dispose))
 };
 } // namespace RNSkia

package/cpp/api/JsiSkTypeface.h

@@ -22,34 +22,13 @@ namespace jsi = facebook::jsi;
 
 class JsiSkTypeface : public JsiSkWrappingSkPtrHostObject<SkTypeface> {
 public:
-  // TODO: declare in JsiSkWrappingSkPtrHostObject via extra template parameter?
-  JSI_PROPERTY_GET(__typename__) {
-    return jsi::String::createFromUtf8(runtime, "Typeface");
-  }
-
-  JSI_EXPORT_PROPERTY_GETTERS(JSI_EXPORT_PROP_GET(JsiSkTypeface, __typename__))
-
-  JSI_HOST_FUNCTION(dispose) {
-    setObject(nullptr);
-    return jsi::Value::undefined();
-  }
-
+  EXPORT_JSI_API_TYPENAME(JsiSkTypeface, "Typeface")
   JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(JsiSkTypeface, dispose))
 
   JsiSkTypeface(std::shared_ptr<RNSkPlatformContext> context,
                 sk_sp<SkTypeface> typeface)
       : JsiSkWrappingSkPtrHostObject(std::move(context), std::move(typeface)) {}
 
-  /**
-    Returns the underlying object from a host object of this type
-   */
-  static sk_sp<SkTypeface> fromValue(jsi::Runtime &runtime,
-                                     const jsi::Value &obj) {
-    return obj.asObject(runtime)
-        .asHostObject<JsiSkTypeface>(runtime)
-        ->getObject();
-  }
-
   /**
    Returns the jsi object from a host object of this type
   */

package/cpp/api/JsiSkVertices.h

@@ -25,12 +25,7 @@ public:
       : JsiSkWrappingSkPtrHostObject<SkVertices>(std::move(context),
                                                  std::move(vertices)) {}
 
-  // TODO: declare in JsiSkWrappingSkPtrHostObject via extra template parameter?
-  JSI_PROPERTY_GET(__typename__) {
-    return jsi::String::createFromUtf8(runtime, "Vertices");
-  }
-
-  JSI_EXPORT_PROPERTY_GETTERS(JSI_EXPORT_PROP_GET(JsiSkVertices, __typename__))
+  EXPORT_JSI_API_TYPENAME(JsiSkVertices, "Vertices")
 
   JSI_HOST_FUNCTION(bounds) {
     const auto &result = getObject()->bounds();
@@ -43,17 +38,8 @@ public:
   }
 
   JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(JsiSkVertices, bounds),
-                       JSI_EXPORT_FUNC(JsiSkVertices, uniqueID), )
-
-  /**
-    Returns the underlying object from a host object of this type
-   */
-  static sk_sp<SkVertices> fromValue(jsi::Runtime &runtime,
-                                     const jsi::Value &obj) {
-    return obj.asObject(runtime)
-        .asHostObject<JsiSkVertices>(runtime)
-        ->getObject();
-  }
+                       JSI_EXPORT_FUNC(JsiSkVertices, uniqueID),
+                       JSI_EXPORT_FUNC(JsiSkVertices, dispose))
 
   /**
    * Creates the function for construction a new instance of the SkVertices

package/cpp/rnskia/dom/nodes/JsiImageSvgNode.h

@@ -19,10 +19,23 @@ protected:
     auto svgDom = _svgDomProp->getDerivedValue();
     if (svgDom != nullptr) {
       auto rect = _rectProp->getDerivedValue();
-
+      auto x = _xProp->isSet() ? _xProp->value().getAsNumber() : -1;
+      auto y = _yProp->isSet() ? _yProp->value().getAsNumber() : -1;
+      auto width = _widthProp->isSet() ? _widthProp->value().getAsNumber() : -1;
+      auto height =
+          _widthProp->isSet() ? _heightProp->value().getAsNumber() : -1;
       context->getCanvas()->save();
-      context->getCanvas()->translate(rect->x(), rect->y());
-      svgDom->setContainerSize(SkSize::Make(rect->width(), rect->height()));
+      if (rect != nullptr) {
+        context->getCanvas()->translate(rect->x(), rect->y());
+        svgDom->setContainerSize(SkSize::Make(rect->width(), rect->height()));
+      } else {
+        if (x != -1 && y != -1) {
+          context->getCanvas()->translate(x, y);
+        }
+        if (width != -1 && height != -1) {
+          svgDom->setContainerSize(SkSize::Make(width, height));
+        }
+      }
       svgDom->render(context->getCanvas());
       context->getCanvas()->restore();
     }
@@ -32,11 +45,19 @@ protected:
     JsiDomDrawingNode::defineProperties(container);
     _svgDomProp = container->defineProperty<SvgProp>("svg");
     _rectProp = container->defineProperty<RectProps>("rect");
+    _xProp = container->defineProperty<NodeProp>("x");
+    _yProp = container->defineProperty<NodeProp>("y");
+    _widthProp = container->defineProperty<NodeProp>("width");
+    _heightProp = container->defineProperty<NodeProp>("height");
   }
 
 private:
   SvgProp *_svgDomProp;
   RectProps *_rectProp;
+  NodeProp *_xProp;
+  NodeProp *_yProp;
+  NodeProp *_widthProp;
+  NodeProp *_heightProp;
 };
 
 } // namespace RNSkia

package/cpp/rnskia/dom/nodes/JsiPathNode.h

@@ -3,6 +3,7 @@
 #include "JsiDomDrawingNode.h"
 #include "PathProp.h"
 
+#include <algorithm>
 #include <memory>
 #include <string>
 
@@ -27,12 +28,14 @@ public:
 protected:
   void draw(DrawingContext *context) override {
     if (getPropsContainer()->isChanged()) {
+      auto start = saturate(
+          _startProp->isSet() ? _startProp->value().getAsNumber() : 0.0);
+      auto end =
+          saturate(_endProp->isSet() ? _endProp->value().getAsNumber() : 1.0);
       // Can we use the path directly, or do we need to copy to
       // mutate / modify the path?
-      auto hasStartOffset =
-          _startProp->isSet() && _startProp->value().getAsNumber() != 0.0;
-      auto hasEndOffset =
-          _endProp->isSet() && _endProp->value().getAsNumber() != 1.0;
+      auto hasStartOffset = start != 0.0;
+      auto hasEndOffset = end != 1.0;
       auto hasFillStyle = _fillTypeProp->isSet();
       auto hasStrokeOptions =
           _strokeOptsProp->isSet() &&
@@ -44,9 +47,6 @@ protected:
       if (willMutatePath) {
         // We'll trim the path
         SkPath filteredPath(*_pathProp->getDerivedValue());
-        auto start =
-            _startProp->isSet() ? _startProp->value().getAsNumber() : 0.0;
-        auto end = _endProp->isSet() ? _endProp->value().getAsNumber() : 1.0;
         auto pe =
             SkTrimPathEffect::Make(start, end, SkTrimPathEffect::Mode::kNormal);
 
@@ -55,16 +55,14 @@ protected:
           if (!pe->filterPath(&filteredPath, filteredPath, &rec, nullptr)) {
             throw std::runtime_error(
                 "Failed trimming path with parameters start: " +
-                std::to_string(_startProp->value().getAsNumber()) +
-                ", end: " + std::to_string(_endProp->value().getAsNumber()));
+                std::to_string(start) + ", end: " + std::to_string(end));
           }
           filteredPath.swap(filteredPath);
           _path = std::make_shared<const SkPath>(filteredPath);
         } else if (hasStartOffset || hasEndOffset) {
           throw std::runtime_error(
               "Failed trimming path with parameters start: " +
-              std::to_string(_startProp->value().getAsNumber()) +
-              ", end: " + std::to_string(_endProp->value().getAsNumber()));
+              std::to_string(start) + ", end: " + std::to_string(end));
         } else {
           _path = std::make_shared<const SkPath>(filteredPath);
         }
@@ -144,6 +142,8 @@ protected:
   }
 
 private:
+  float saturate(float x) { return std::max(0.0f, std::min(1.0f, x)); }
+
   SkPathFillType getFillTypeFromStringValue(const std::string &value) {
     if (value == "winding") {
       return SkPathFillType::kWinding;

package/cpp/rnskia/values/RNSkReadonlyValue.h

@@ -72,13 +72,13 @@ public:
         });
   }
 
-  JSI_HOST_FUNCTION(__invalidate) {
+  JSI_HOST_FUNCTION(dispose) {
     invalidate();
     return jsi::Value::undefined();
   }
 
   JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(RNSkReadonlyValue, addListener),
-                       JSI_EXPORT_FUNC(RNSkReadonlyValue, __invalidate))
+                       JSI_EXPORT_FUNC(RNSkReadonlyValue, dispose))
 
   /**
    * Adds a callback that will be called whenever the value changes

package/cpp/rnskia/values/RNSkValue.h

@@ -70,7 +70,7 @@ public:
                               JSI_EXPORT_PROP_GET(RNSkValue, animation))
 
   JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(RNSkValue, addListener),
-                       JSI_EXPORT_FUNC(RNSkReadonlyValue, __invalidate))
+                       JSI_EXPORT_FUNC(RNSkReadonlyValue, dispose))
 
 private:
   void subscribe(std::shared_ptr<RNSkAnimation> animation) {

package/lib/commonjs/Platform/Platform.web.js

@@ -121,7 +121,7 @@ const View = _ref => {
   const cssStyles = (0, _react.useMemo)(() => {
     return { ...style,
       display: "flex",
-      flexDirection: style.flexDirection || "column",
+      flexDirection: style.flexDirection || "inherit",
       flexWrap: style.flexWrap || "nowrap",
       justifyContent: style.justifyContent || "flex-start",
       alignItems: style.alignItems || "stretch",

package/lib/commonjs/Platform/Platform.web.js.map

@@ -1 +1 @@
-{"version":3,"names":["DOM_LAYOUT_HANDLER_NAME","resizeObserver","getObserver","window","ResizeObserver","entries","forEach","entry","node","target","left","top","width","height","contentRect","onLayout","setTimeout","timeStamp","Date","now","nativeEvent","layout","x","y","currentTarget","bubbles","cancelable","defaultPrevented","eventPhase","isDefaultPrevented","Error","isPropagationStopped","persist","preventDefault","stopPropagation","isTrusted","type","useElementLayout","ref","observer","useLayoutEffect","current","observe","unobserve","View","children","style","rawStyle","useMemo","useRef","cssStyles","display","flexDirection","flexWrap","justifyContent","alignItems","alignContent","Platform","OS","PixelRatio","devicePixelRatio","requireNativeComponent","resolveAsset","source","isRNModule","default","findNodeHandle","NativeModules"],"sources":["Platform.web.tsx"],"sourcesContent":["import type { RefObject, CSSProperties } from \"react\";\nimport React, { useLayoutEffect, useMemo, useRef } from \"react\";\nimport type { LayoutChangeEvent, ViewComponent, ViewProps } from \"react-native\";\n\nimport type { DataModule } from \"../skia/types\";\nimport { isRNModule } from \"../skia/types\";\n\nimport type { IPlatform } from \"./IPlatform\";\n\n// eslint-disable-next-line max-len\n// https://github.com/necolas/react-native-web/blob/master/packages/react-native-web/src/modules/useElementLayout/index.js\nconst DOM_LAYOUT_HANDLER_NAME = \"__reactLayoutHandler\";\ntype OnLayout = ((event: LayoutChangeEvent) => void) | undefined;\ntype Div = HTMLDivElement & {\n  __reactLayoutHandler: OnLayout;\n};\n\nlet resizeObserver: ResizeObserver | null = null;\n\nconst getObserver = () => {\n  if (resizeObserver == null) {\n    resizeObserver = new window.ResizeObserver(function (entries) {\n      entries.forEach((entry) => {\n        const node = entry.target as Div;\n        const { left, top, width, height } = entry.contentRect;\n        const onLayout = node[DOM_LAYOUT_HANDLER_NAME];\n        if (typeof onLayout === \"function\") {\n          // setTimeout 0 is taken from react-native-web (UIManager)\n          setTimeout(\n            () =>\n              onLayout({\n                timeStamp: Date.now(),\n                nativeEvent: { layout: { x: left, y: top, width, height } },\n                currentTarget: 0,\n                target: 0,\n                bubbles: false,\n                cancelable: false,\n                defaultPrevented: false,\n                eventPhase: 0,\n                isDefaultPrevented() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                isPropagationStopped() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                persist() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                preventDefault() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                stopPropagation() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                isTrusted: true,\n                type: \"\",\n              }),\n            0\n          );\n        }\n      });\n    });\n  }\n  return resizeObserver;\n};\n\nconst useElementLayout = (ref: RefObject<Div>, onLayout: OnLayout) => {\n  const observer = getObserver();\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (node !== null) {\n      node[DOM_LAYOUT_HANDLER_NAME] = onLayout;\n    }\n  }, [ref, onLayout]);\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (node != null && observer != null) {\n      if (typeof node[DOM_LAYOUT_HANDLER_NAME] === \"function\") {\n        observer.observe(node);\n      } else {\n        observer.unobserve(node);\n      }\n    }\n    return () => {\n      if (node != null && observer != null) {\n        observer.unobserve(node);\n      }\n    };\n  }, [observer, ref]);\n};\n\nconst View = (({ children, onLayout, style: rawStyle }: ViewProps) => {\n  const style = useMemo(() => (rawStyle ?? {}) as CSSProperties, [rawStyle]);\n  const ref = useRef<Div>(null);\n  useElementLayout(ref, onLayout);\n  const cssStyles = useMemo(() => {\n    return {\n      ...style,\n      display: \"flex\",\n      flexDirection: style.flexDirection || \"column\",\n      flexWrap: style.flexWrap || \"nowrap\",\n      justifyContent: style.justifyContent || \"flex-start\",\n      alignItems: style.alignItems || \"stretch\",\n      alignContent: style.alignContent || \"stretch\",\n    };\n  }, [style]);\n\n  return (\n    <div ref={ref} style={cssStyles}>\n      {children}\n    </div>\n  );\n}) as unknown as typeof ViewComponent;\n\nexport const Platform: IPlatform = {\n  OS: \"web\",\n  PixelRatio: window.devicePixelRatio,\n  requireNativeComponent: () => {\n    throw new Error(\"requireNativeComponent is not supported on the web\");\n  },\n  resolveAsset: (source: DataModule) => {\n    if (isRNModule(source)) {\n      throw new Error(\n        \"Image source is a number - this is not supported on the web\"\n      );\n    }\n    return source.default;\n  },\n  findNodeHandle: () => {\n    throw new Error(\"findNodeHandle is not supported on the web\");\n  },\n  NativeModules: {},\n  View,\n};\n"],"mappings":"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"}
+{"version":3,"names":["DOM_LAYOUT_HANDLER_NAME","resizeObserver","getObserver","window","ResizeObserver","entries","forEach","entry","node","target","left","top","width","height","contentRect","onLayout","setTimeout","timeStamp","Date","now","nativeEvent","layout","x","y","currentTarget","bubbles","cancelable","defaultPrevented","eventPhase","isDefaultPrevented","Error","isPropagationStopped","persist","preventDefault","stopPropagation","isTrusted","type","useElementLayout","ref","observer","useLayoutEffect","current","observe","unobserve","View","children","style","rawStyle","useMemo","useRef","cssStyles","display","flexDirection","flexWrap","justifyContent","alignItems","alignContent","Platform","OS","PixelRatio","devicePixelRatio","requireNativeComponent","resolveAsset","source","isRNModule","default","findNodeHandle","NativeModules"],"sources":["Platform.web.tsx"],"sourcesContent":["import type { RefObject, CSSProperties } from \"react\";\nimport React, { useLayoutEffect, useMemo, useRef } from \"react\";\nimport type { LayoutChangeEvent, ViewComponent, ViewProps } from \"react-native\";\n\nimport type { DataModule } from \"../skia/types\";\nimport { isRNModule } from \"../skia/types\";\n\nimport type { IPlatform } from \"./IPlatform\";\n\n// eslint-disable-next-line max-len\n// https://github.com/necolas/react-native-web/blob/master/packages/react-native-web/src/modules/useElementLayout/index.js\nconst DOM_LAYOUT_HANDLER_NAME = \"__reactLayoutHandler\";\ntype OnLayout = ((event: LayoutChangeEvent) => void) | undefined;\ntype Div = HTMLDivElement & {\n  __reactLayoutHandler: OnLayout;\n};\n\nlet resizeObserver: ResizeObserver | null = null;\n\nconst getObserver = () => {\n  if (resizeObserver == null) {\n    resizeObserver = new window.ResizeObserver(function (entries) {\n      entries.forEach((entry) => {\n        const node = entry.target as Div;\n        const { left, top, width, height } = entry.contentRect;\n        const onLayout = node[DOM_LAYOUT_HANDLER_NAME];\n        if (typeof onLayout === \"function\") {\n          // setTimeout 0 is taken from react-native-web (UIManager)\n          setTimeout(\n            () =>\n              onLayout({\n                timeStamp: Date.now(),\n                nativeEvent: { layout: { x: left, y: top, width, height } },\n                currentTarget: 0,\n                target: 0,\n                bubbles: false,\n                cancelable: false,\n                defaultPrevented: false,\n                eventPhase: 0,\n                isDefaultPrevented() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                isPropagationStopped() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                persist() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                preventDefault() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                stopPropagation() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                isTrusted: true,\n                type: \"\",\n              }),\n            0\n          );\n        }\n      });\n    });\n  }\n  return resizeObserver;\n};\n\nconst useElementLayout = (ref: RefObject<Div>, onLayout: OnLayout) => {\n  const observer = getObserver();\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (node !== null) {\n      node[DOM_LAYOUT_HANDLER_NAME] = onLayout;\n    }\n  }, [ref, onLayout]);\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (node != null && observer != null) {\n      if (typeof node[DOM_LAYOUT_HANDLER_NAME] === \"function\") {\n        observer.observe(node);\n      } else {\n        observer.unobserve(node);\n      }\n    }\n    return () => {\n      if (node != null && observer != null) {\n        observer.unobserve(node);\n      }\n    };\n  }, [observer, ref]);\n};\n\nconst View = (({ children, onLayout, style: rawStyle }: ViewProps) => {\n  const style = useMemo(() => (rawStyle ?? {}) as CSSProperties, [rawStyle]);\n  const ref = useRef<Div>(null);\n  useElementLayout(ref, onLayout);\n  const cssStyles = useMemo(() => {\n    return {\n      ...style,\n      display: \"flex\",\n      flexDirection: style.flexDirection || \"inherit\",\n      flexWrap: style.flexWrap || \"nowrap\",\n      justifyContent: style.justifyContent || \"flex-start\",\n      alignItems: style.alignItems || \"stretch\",\n      alignContent: style.alignContent || \"stretch\",\n    };\n  }, [style]);\n\n  return (\n    <div ref={ref} style={cssStyles}>\n      {children}\n    </div>\n  );\n}) as unknown as typeof ViewComponent;\n\nexport const Platform: IPlatform = {\n  OS: \"web\",\n  PixelRatio: window.devicePixelRatio,\n  requireNativeComponent: () => {\n    throw new Error(\"requireNativeComponent is not supported on the web\");\n  },\n  resolveAsset: (source: DataModule) => {\n    if (isRNModule(source)) {\n      throw new Error(\n        \"Image source is a number - this is not supported on the web\"\n      );\n    }\n    return source.default;\n  },\n  findNodeHandle: () => {\n    throw new Error(\"findNodeHandle is not supported on the web\");\n  },\n  NativeModules: {},\n  View,\n};\n"],"mappings":"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"}

package/lib/commonjs/dom/nodes/drawings/ImageSVG.d.ts

@@ -1,8 +1,13 @@
 import type { DrawingContext, ImageSVGProps } from "../../types";
 import { JsiDrawingNode } from "../DrawingNode";
 import type { NodeContext } from "../Node";
-export declare class ImageSVGNode extends JsiDrawingNode<ImageSVGProps, null> {
+export declare class ImageSVGNode extends JsiDrawingNode<ImageSVGProps, Pick<ImageSVGProps, "x" | "y" | "width" | "height">> {
     constructor(ctx: NodeContext, props: ImageSVGProps);
-    deriveProps(): null;
+    deriveProps(): import("../../..").SkRect | {
+        x: number | undefined;
+        y: number | undefined;
+        width: number | undefined;
+        height: number | undefined;
+    };
     draw({ canvas }: DrawingContext): void;
 }

package/lib/commonjs/dom/nodes/drawings/ImageSVG.js

@@ -7,8 +7,6 @@ exports.ImageSVGNode = void 0;
 
 var _types = require("../../types");
 
-var _datatypes = require("../datatypes");
-
 var _DrawingNode = require("../DrawingNode");
 
 class ImageSVGNode extends _DrawingNode.JsiDrawingNode {
@@ -17,7 +15,22 @@ class ImageSVGNode extends _DrawingNode.JsiDrawingNode {
   }
 
   deriveProps() {
-    return null;
+    if (this.props.rect) {
+      return this.props.rect;
+    }
+
+    const {
+      x,
+      y,
+      width,
+      height
+    } = this.props;
+    return {
+      x,
+      y,
+      width,
+      height
+    };
   }
 
   draw(_ref) {
@@ -28,8 +41,8 @@ class ImageSVGNode extends _DrawingNode.JsiDrawingNode {
       svg
     } = this.props;
 
-    if (!svg) {
-      return;
+    if (!this.derived) {
+      throw new Error("ImageSVGNode: derived props unresolved");
     }
 
     const {
@@ -37,9 +50,18 @@ class ImageSVGNode extends _DrawingNode.JsiDrawingNode {
       y,
       width,
       height
-    } = (0, _datatypes.processRect)(this.Skia, this.props);
+    } = this.derived;
+
+    if (svg === null) {
+      return;
+    }
+
     canvas.save();
-    canvas.translate(x, y);
+
+    if (x && y) {
+      canvas.translate(x, y);
+    }
+
     canvas.drawSvg(svg, width, height);
     canvas.restore();
   }

package/lib/commonjs/dom/nodes/drawings/ImageSVG.js.map

@@ -1 +1 @@
-{"version":3,"names":["ImageSVGNode","JsiDrawingNode","constructor","ctx","props","NodeType","ImageSVG","deriveProps","draw","canvas","svg","x","y","width","height","processRect","Skia","save","translate","drawSvg","restore"],"sources":["ImageSVG.ts"],"sourcesContent":["import type { DrawingContext, ImageSVGProps } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { processRect } from \"../datatypes\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class ImageSVGNode extends JsiDrawingNode<ImageSVGProps, null> {\n  constructor(ctx: NodeContext, props: ImageSVGProps) {\n    super(ctx, NodeType.ImageSVG, props);\n  }\n\n  deriveProps() {\n    return null;\n  }\n\n  draw({ canvas }: DrawingContext) {\n    const { svg } = this.props;\n    if (!svg) {\n      return;\n    }\n    const { x, y, width, height } = processRect(this.Skia, this.props);\n    canvas.save();\n    canvas.translate(x, y);\n    canvas.drawSvg(svg, width, height);\n    canvas.restore();\n  }\n}\n"],"mappings":";;;;;;;AACA;;AACA;;AACA;;AAGO,MAAMA,YAAN,SAA2BC,2BAA3B,CAA+D;EACpEC,WAAW,CAACC,GAAD,EAAmBC,KAAnB,EAAyC;IAClD,MAAMD,GAAN,EAAWE,eAAA,CAASC,QAApB,EAA8BF,KAA9B;EACD;;EAEDG,WAAW,GAAG;IACZ,OAAO,IAAP;EACD;;EAEDC,IAAI,OAA6B;IAAA,IAA5B;MAAEC;IAAF,CAA4B;IAC/B,MAAM;MAAEC;IAAF,IAAU,KAAKN,KAArB;;IACA,IAAI,CAACM,GAAL,EAAU;MACR;IACD;;IACD,MAAM;MAAEC,CAAF;MAAKC,CAAL;MAAQC,KAAR;MAAeC;IAAf,IAA0B,IAAAC,sBAAA,EAAY,KAAKC,IAAjB,EAAuB,KAAKZ,KAA5B,CAAhC;IACAK,MAAM,CAACQ,IAAP;IACAR,MAAM,CAACS,SAAP,CAAiBP,CAAjB,EAAoBC,CAApB;IACAH,MAAM,CAACU,OAAP,CAAeT,GAAf,EAAoBG,KAApB,EAA2BC,MAA3B;IACAL,MAAM,CAACW,OAAP;EACD;;AAnBmE"}
+{"version":3,"names":["ImageSVGNode","JsiDrawingNode","constructor","ctx","props","NodeType","ImageSVG","deriveProps","rect","x","y","width","height","draw","canvas","svg","derived","Error","save","translate","drawSvg","restore"],"sources":["ImageSVG.ts"],"sourcesContent":["import type { DrawingContext, ImageSVGProps } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class ImageSVGNode extends JsiDrawingNode<\n  ImageSVGProps,\n  Pick<ImageSVGProps, \"x\" | \"y\" | \"width\" | \"height\">\n> {\n  constructor(ctx: NodeContext, props: ImageSVGProps) {\n    super(ctx, NodeType.ImageSVG, props);\n  }\n\n  deriveProps() {\n    if (this.props.rect) {\n      return this.props.rect;\n    }\n    const { x, y, width, height } = this.props;\n    return { x, y, width, height };\n  }\n\n  draw({ canvas }: DrawingContext) {\n    const { svg } = this.props;\n    if (!this.derived) {\n      throw new Error(\"ImageSVGNode: derived props unresolved\");\n    }\n    const { x, y, width, height } = this.derived;\n    if (svg === null) {\n      return;\n    }\n    canvas.save();\n    if (x && y) {\n      canvas.translate(x, y);\n    }\n    canvas.drawSvg(svg, width, height);\n    canvas.restore();\n  }\n}\n"],"mappings":";;;;;;;AACA;;AACA;;AAGO,MAAMA,YAAN,SAA2BC,2BAA3B,CAGL;EACAC,WAAW,CAACC,GAAD,EAAmBC,KAAnB,EAAyC;IAClD,MAAMD,GAAN,EAAWE,eAAA,CAASC,QAApB,EAA8BF,KAA9B;EACD;;EAEDG,WAAW,GAAG;IACZ,IAAI,KAAKH,KAAL,CAAWI,IAAf,EAAqB;MACnB,OAAO,KAAKJ,KAAL,CAAWI,IAAlB;IACD;;IACD,MAAM;MAAEC,CAAF;MAAKC,CAAL;MAAQC,KAAR;MAAeC;IAAf,IAA0B,KAAKR,KAArC;IACA,OAAO;MAAEK,CAAF;MAAKC,CAAL;MAAQC,KAAR;MAAeC;IAAf,CAAP;EACD;;EAEDC,IAAI,OAA6B;IAAA,IAA5B;MAAEC;IAAF,CAA4B;IAC/B,MAAM;MAAEC;IAAF,IAAU,KAAKX,KAArB;;IACA,IAAI,CAAC,KAAKY,OAAV,EAAmB;MACjB,MAAM,IAAIC,KAAJ,CAAU,wCAAV,CAAN;IACD;;IACD,MAAM;MAAER,CAAF;MAAKC,CAAL;MAAQC,KAAR;MAAeC;IAAf,IAA0B,KAAKI,OAArC;;IACA,IAAID,GAAG,KAAK,IAAZ,EAAkB;MAChB;IACD;;IACDD,MAAM,CAACI,IAAP;;IACA,IAAIT,CAAC,IAAIC,CAAT,EAAY;MACVI,MAAM,CAACK,SAAP,CAAiBV,CAAjB,EAAoBC,CAApB;IACD;;IACDI,MAAM,CAACM,OAAP,CAAeL,GAAf,EAAoBJ,KAApB,EAA2BC,MAA3B;IACAE,MAAM,CAACO,OAAP;EACD;;AA5BD"}

package/lib/commonjs/dom/nodes/drawings/PathNode.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.PathNode = void 0;
 
+var _math = require("../../../renderer/processors/math");
+
 var _types = require("../../../skia/types");
 
 var _types2 = require("../../types");
@@ -20,12 +22,14 @@ class PathNode extends _DrawingNode.JsiDrawingNode {
 
   deriveProps() {
     const {
-      start,
-      end,
+      start: trimStart,
+      end: trimEnd,
       fillType,
       stroke,
       ...pathProps
     } = this.props;
+    const start = (0, _math.saturate)(trimStart);
+    const end = (0, _math.saturate)(trimEnd);
     const hasStartOffset = start !== 0;
     const hasEndOffset = end !== 1;
     const hasStrokeOptions = stroke !== undefined;

package/lib/commonjs/dom/nodes/drawings/PathNode.js.map

@@ -1 +1 @@
-{"version":3,"names":["PathNode","JsiDrawingNode","constructor","ctx","props","NodeType","Path","deriveProps","start","end","fillType","stroke","pathProps","hasStartOffset","hasEndOffset","hasStrokeOptions","undefined","hasFillType","willMutatePath","pristinePath","processPath","Skia","path","copy","setFillType","FillType","enumKey","trim","draw","canvas","paint","derived","Error","drawPath"],"sources":["PathNode.ts"],"sourcesContent":["import { FillType } from \"../../../skia/types\";\nimport type { SkPath } from \"../../../skia/types\";\nimport type { DrawingContext, PathProps } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { enumKey, processPath } from \"../datatypes\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class PathNode extends JsiDrawingNode<PathProps, SkPath> {\n  constructor(ctx: NodeContext, props: PathProps) {\n    super(ctx, NodeType.Path, props);\n  }\n\n  protected deriveProps() {\n    const { start, end, fillType, stroke, ...pathProps } = this.props;\n    const hasStartOffset = start !== 0;\n    const hasEndOffset = end !== 1;\n    const hasStrokeOptions = stroke !== undefined;\n    const hasFillType = !!fillType;\n    const willMutatePath =\n      hasStartOffset || hasEndOffset || hasStrokeOptions || hasFillType;\n    const pristinePath = processPath(this.Skia, pathProps.path);\n    const path = willMutatePath ? pristinePath.copy() : pristinePath;\n    if (hasFillType) {\n      path.setFillType(FillType[enumKey(fillType)]);\n    }\n    if (hasStrokeOptions) {\n      path.stroke(stroke);\n    }\n    if (hasStartOffset || hasEndOffset) {\n      path.trim(start, end, false);\n    }\n    return path;\n  }\n\n  draw({ canvas, paint }: DrawingContext) {\n    if (!this.derived) {\n      throw new Error(\"Path not initialized\");\n    }\n    canvas.drawPath(this.derived, paint);\n  }\n}\n"],"mappings":";;;;;;;AAAA;;AAGA;;AACA;;AACA;;AAGO,MAAMA,QAAN,SAAuBC,2BAAvB,CAAyD;EAC9DC,WAAW,CAACC,GAAD,EAAmBC,KAAnB,EAAqC;IAC9C,MAAMD,GAAN,EAAWE,gBAAA,CAASC,IAApB,EAA0BF,KAA1B;EACD;;EAESG,WAAW,GAAG;IACtB,MAAM;MAAEC,KAAF;MAASC,GAAT;MAAcC,QAAd;MAAwBC,MAAxB;MAAgC,GAAGC;IAAnC,IAAiD,KAAKR,KAA5D;IACA,MAAMS,cAAc,GAAGL,KAAK,KAAK,CAAjC;IACA,MAAMM,YAAY,GAAGL,GAAG,KAAK,CAA7B;IACA,MAAMM,gBAAgB,GAAGJ,MAAM,KAAKK,SAApC;IACA,MAAMC,WAAW,GAAG,CAAC,CAACP,QAAtB;IACA,MAAMQ,cAAc,GAClBL,cAAc,IAAIC,YAAlB,IAAkCC,gBAAlC,IAAsDE,WADxD;IAEA,MAAME,YAAY,GAAG,IAAAC,sBAAA,EAAY,KAAKC,IAAjB,EAAuBT,SAAS,CAACU,IAAjC,CAArB;IACA,MAAMA,IAAI,GAAGJ,cAAc,GAAGC,YAAY,CAACI,IAAb,EAAH,GAAyBJ,YAApD;;IACA,IAAIF,WAAJ,EAAiB;MACfK,IAAI,CAACE,WAAL,CAAiBC,eAAA,CAAS,IAAAC,kBAAA,EAAQhB,QAAR,CAAT,CAAjB;IACD;;IACD,IAAIK,gBAAJ,EAAsB;MACpBO,IAAI,CAACX,MAAL,CAAYA,MAAZ;IACD;;IACD,IAAIE,cAAc,IAAIC,YAAtB,EAAoC;MAClCQ,IAAI,CAACK,IAAL,CAAUnB,KAAV,EAAiBC,GAAjB,EAAsB,KAAtB;IACD;;IACD,OAAOa,IAAP;EACD;;EAEDM,IAAI,OAAoC;IAAA,IAAnC;MAAEC,MAAF;MAAUC;IAAV,CAAmC;;IACtC,IAAI,CAAC,KAAKC,OAAV,EAAmB;MACjB,MAAM,IAAIC,KAAJ,CAAU,sBAAV,CAAN;IACD;;IACDH,MAAM,CAACI,QAAP,CAAgB,KAAKF,OAArB,EAA8BD,KAA9B;EACD;;AAhC6D"}
+{"version":3,"names":["PathNode","JsiDrawingNode","constructor","ctx","props","NodeType","Path","deriveProps","start","trimStart","end","trimEnd","fillType","stroke","pathProps","saturate","hasStartOffset","hasEndOffset","hasStrokeOptions","undefined","hasFillType","willMutatePath","pristinePath","processPath","Skia","path","copy","setFillType","FillType","enumKey","trim","draw","canvas","paint","derived","Error","drawPath"],"sources":["PathNode.ts"],"sourcesContent":["import { saturate } from \"../../../renderer/processors/math\";\nimport { FillType } from \"../../../skia/types\";\nimport type { SkPath } from \"../../../skia/types\";\nimport type { DrawingContext, PathProps } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { enumKey, processPath } from \"../datatypes\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class PathNode extends JsiDrawingNode<PathProps, SkPath> {\n  constructor(ctx: NodeContext, props: PathProps) {\n    super(ctx, NodeType.Path, props);\n  }\n\n  protected deriveProps() {\n    const {\n      start: trimStart,\n      end: trimEnd,\n      fillType,\n      stroke,\n      ...pathProps\n    } = this.props;\n    const start = saturate(trimStart);\n    const end = saturate(trimEnd);\n    const hasStartOffset = start !== 0;\n    const hasEndOffset = end !== 1;\n    const hasStrokeOptions = stroke !== undefined;\n    const hasFillType = !!fillType;\n    const willMutatePath =\n      hasStartOffset || hasEndOffset || hasStrokeOptions || hasFillType;\n    const pristinePath = processPath(this.Skia, pathProps.path);\n    const path = willMutatePath ? pristinePath.copy() : pristinePath;\n    if (hasFillType) {\n      path.setFillType(FillType[enumKey(fillType)]);\n    }\n    if (hasStrokeOptions) {\n      path.stroke(stroke);\n    }\n    if (hasStartOffset || hasEndOffset) {\n      path.trim(start, end, false);\n    }\n    return path;\n  }\n\n  draw({ canvas, paint }: DrawingContext) {\n    if (!this.derived) {\n      throw new Error(\"Path not initialized\");\n    }\n    canvas.drawPath(this.derived, paint);\n  }\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAGA;;AACA;;AACA;;AAGO,MAAMA,QAAN,SAAuBC,2BAAvB,CAAyD;EAC9DC,WAAW,CAACC,GAAD,EAAmBC,KAAnB,EAAqC;IAC9C,MAAMD,GAAN,EAAWE,gBAAA,CAASC,IAApB,EAA0BF,KAA1B;EACD;;EAESG,WAAW,GAAG;IACtB,MAAM;MACJC,KAAK,EAAEC,SADH;MAEJC,GAAG,EAAEC,OAFD;MAGJC,QAHI;MAIJC,MAJI;MAKJ,GAAGC;IALC,IAMF,KAAKV,KANT;IAOA,MAAMI,KAAK,GAAG,IAAAO,cAAA,EAASN,SAAT,CAAd;IACA,MAAMC,GAAG,GAAG,IAAAK,cAAA,EAASJ,OAAT,CAAZ;IACA,MAAMK,cAAc,GAAGR,KAAK,KAAK,CAAjC;IACA,MAAMS,YAAY,GAAGP,GAAG,KAAK,CAA7B;IACA,MAAMQ,gBAAgB,GAAGL,MAAM,KAAKM,SAApC;IACA,MAAMC,WAAW,GAAG,CAAC,CAACR,QAAtB;IACA,MAAMS,cAAc,GAClBL,cAAc,IAAIC,YAAlB,IAAkCC,gBAAlC,IAAsDE,WADxD;IAEA,MAAME,YAAY,GAAG,IAAAC,sBAAA,EAAY,KAAKC,IAAjB,EAAuBV,SAAS,CAACW,IAAjC,CAArB;IACA,MAAMA,IAAI,GAAGJ,cAAc,GAAGC,YAAY,CAACI,IAAb,EAAH,GAAyBJ,YAApD;;IACA,IAAIF,WAAJ,EAAiB;MACfK,IAAI,CAACE,WAAL,CAAiBC,eAAA,CAAS,IAAAC,kBAAA,EAAQjB,QAAR,CAAT,CAAjB;IACD;;IACD,IAAIM,gBAAJ,EAAsB;MACpBO,IAAI,CAACZ,MAAL,CAAYA,MAAZ;IACD;;IACD,IAAIG,cAAc,IAAIC,YAAtB,EAAoC;MAClCQ,IAAI,CAACK,IAAL,CAAUtB,KAAV,EAAiBE,GAAjB,EAAsB,KAAtB;IACD;;IACD,OAAOe,IAAP;EACD;;EAEDM,IAAI,OAAoC;IAAA,IAAnC;MAAEC,MAAF;MAAUC;IAAV,CAAmC;;IACtC,IAAI,CAAC,KAAKC,OAAV,EAAmB;MACjB,MAAM,IAAIC,KAAJ,CAAU,sBAAV,CAAN;IACD;;IACDH,MAAM,CAACI,QAAP,CAAgB,KAAKF,OAArB,EAA8BD,KAA9B;EACD;;AAxC6D"}

package/lib/commonjs/dom/types/Drawings.d.ts

@@ -50,9 +50,14 @@ export interface VerticesProps extends DrawingNodeProps {
     blendMode?: SkEnum<typeof BlendMode>;
     indices?: number[];
 }
-export declare type ImageSVGProps = RectDef & {
+export interface ImageSVGProps extends DrawingNodeProps {
     svg: SkSVG | null;
-} & DrawingNodeProps;
+    x?: number;
+    y?: number;
+    width?: number;
+    height?: number;
+    rect?: SkRect;
+}
 export interface PictureProps extends DrawingNodeProps {
     picture: SkPicture;
 }

package/lib/commonjs/dom/types/Drawings.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["Drawings.ts"],"sourcesContent":["import type {\n  FillType,\n  SkImage,\n  StrokeOpts,\n  Vector,\n  Color,\n  SkPoint,\n  BlendMode,\n  PointMode,\n  VertexMode,\n  SkFont,\n  SkRRect,\n  SkTextBlob,\n  SkPicture,\n  SkSVG,\n  SkPaint,\n  SkRect,\n} from \"../../skia/types\";\n\nimport type {\n  CircleDef,\n  Fit,\n  GroupProps,\n  PathDef,\n  RectDef,\n  RRectDef,\n  SkEnum,\n} from \"./Common\";\nimport type { DrawingContext } from \"./DrawingContext\";\n\nexport interface DrawingNodeProps extends GroupProps {\n  paint?: SkPaint;\n}\n\nexport type ImageProps = DrawingNodeProps &\n  RectDef & {\n    fit?: Fit;\n    image: SkImage | null;\n  };\n\nexport type CircleProps = CircleDef & DrawingNodeProps;\n\nexport interface PathProps extends DrawingNodeProps {\n  path: PathDef;\n  start: number;\n  end: number;\n  stroke?: StrokeOpts;\n  fillType?: SkEnum<typeof FillType>;\n}\n\nexport interface CustomDrawingNodeProps extends DrawingNodeProps {\n  drawing: (ctx: DrawingContext) => void;\n}\n\nexport interface LineProps extends DrawingNodeProps {\n  p1: Vector;\n  p2: Vector;\n}\n\nexport type OvalProps = RectDef & DrawingNodeProps;\n\nexport type RectProps = RectDef & DrawingNodeProps;\n\nexport type RoundedRectProps = RRectDef & DrawingNodeProps;\n\nexport interface CubicBezierHandle {\n  pos: Vector;\n  c1: Vector;\n  c2: Vector;\n}\n\nexport interface PatchProps extends DrawingNodeProps {\n  colors?: Color[];\n  patch: [\n    CubicBezierHandle,\n    CubicBezierHandle,\n    CubicBezierHandle,\n    CubicBezierHandle\n  ];\n  texture?: readonly [SkPoint, SkPoint, SkPoint, SkPoint];\n  blendMode?: SkEnum<typeof BlendMode>;\n}\n\nexport interface VerticesProps extends DrawingNodeProps {\n  colors?: string[];\n  vertices: SkPoint[];\n  textures?: SkPoint[];\n  mode: SkEnum<typeof VertexMode>;\n  blendMode?: SkEnum<typeof BlendMode>;\n  indices?: number[];\n}\n\nexport type ImageSVGProps = RectDef & {\n  svg: SkSVG | null;\n} & DrawingNodeProps;\n\nexport interface PictureProps extends DrawingNodeProps {\n  picture: SkPicture;\n}\n\nexport interface PointsProps extends DrawingNodeProps {\n  points: SkPoint[];\n  mode: SkEnum<typeof PointMode>;\n}\n\nexport interface DiffRectProps extends DrawingNodeProps {\n  inner: SkRRect;\n  outer: SkRRect;\n}\n\nexport interface TextProps extends DrawingNodeProps {\n  font: SkFont | null;\n  text: string;\n  x: number;\n  y: number;\n}\n\nexport interface TextPathProps extends DrawingNodeProps {\n  font: SkFont | null;\n  text: string;\n  path: PathDef;\n  initialOffset: number;\n}\n\nexport interface TextBlobProps extends DrawingNodeProps {\n  blob: SkTextBlob;\n  x: number;\n  y: number;\n}\n\nexport interface Glyph {\n  id: number;\n  pos: SkPoint;\n}\n\nexport interface GlyphsProps extends DrawingNodeProps {\n  font: SkFont | null;\n  x: number;\n  y: number;\n  glyphs: Glyph[];\n}\n\nexport interface BoxProps extends DrawingNodeProps {\n  box: SkRRect | SkRect;\n}\n\nexport interface BoxShadowProps {\n  dx?: number;\n  dy?: number;\n  spread?: number;\n  blur: number;\n  color?: Color;\n  inner?: boolean;\n}\n"],"mappings":""}
+{"version":3,"names":[],"sources":["Drawings.ts"],"sourcesContent":["import type {\n  FillType,\n  SkImage,\n  StrokeOpts,\n  Vector,\n  Color,\n  SkPoint,\n  BlendMode,\n  PointMode,\n  VertexMode,\n  SkFont,\n  SkRRect,\n  SkTextBlob,\n  SkPicture,\n  SkSVG,\n  SkPaint,\n  SkRect,\n} from \"../../skia/types\";\n\nimport type {\n  CircleDef,\n  Fit,\n  GroupProps,\n  PathDef,\n  RectDef,\n  RRectDef,\n  SkEnum,\n} from \"./Common\";\nimport type { DrawingContext } from \"./DrawingContext\";\n\nexport interface DrawingNodeProps extends GroupProps {\n  paint?: SkPaint;\n}\n\nexport type ImageProps = DrawingNodeProps &\n  RectDef & {\n    fit?: Fit;\n    image: SkImage | null;\n  };\n\nexport type CircleProps = CircleDef & DrawingNodeProps;\n\nexport interface PathProps extends DrawingNodeProps {\n  path: PathDef;\n  start: number;\n  end: number;\n  stroke?: StrokeOpts;\n  fillType?: SkEnum<typeof FillType>;\n}\n\nexport interface CustomDrawingNodeProps extends DrawingNodeProps {\n  drawing: (ctx: DrawingContext) => void;\n}\n\nexport interface LineProps extends DrawingNodeProps {\n  p1: Vector;\n  p2: Vector;\n}\n\nexport type OvalProps = RectDef & DrawingNodeProps;\n\nexport type RectProps = RectDef & DrawingNodeProps;\n\nexport type RoundedRectProps = RRectDef & DrawingNodeProps;\n\nexport interface CubicBezierHandle {\n  pos: Vector;\n  c1: Vector;\n  c2: Vector;\n}\n\nexport interface PatchProps extends DrawingNodeProps {\n  colors?: Color[];\n  patch: [\n    CubicBezierHandle,\n    CubicBezierHandle,\n    CubicBezierHandle,\n    CubicBezierHandle\n  ];\n  texture?: readonly [SkPoint, SkPoint, SkPoint, SkPoint];\n  blendMode?: SkEnum<typeof BlendMode>;\n}\n\nexport interface VerticesProps extends DrawingNodeProps {\n  colors?: string[];\n  vertices: SkPoint[];\n  textures?: SkPoint[];\n  mode: SkEnum<typeof VertexMode>;\n  blendMode?: SkEnum<typeof BlendMode>;\n  indices?: number[];\n}\n\nexport interface ImageSVGProps extends DrawingNodeProps {\n  svg: SkSVG | null;\n  x?: number;\n  y?: number;\n  width?: number;\n  height?: number;\n  rect?: SkRect;\n}\n\nexport interface PictureProps extends DrawingNodeProps {\n  picture: SkPicture;\n}\n\nexport interface PointsProps extends DrawingNodeProps {\n  points: SkPoint[];\n  mode: SkEnum<typeof PointMode>;\n}\n\nexport interface DiffRectProps extends DrawingNodeProps {\n  inner: SkRRect;\n  outer: SkRRect;\n}\n\nexport interface TextProps extends DrawingNodeProps {\n  font: SkFont | null;\n  text: string;\n  x: number;\n  y: number;\n}\n\nexport interface TextPathProps extends DrawingNodeProps {\n  font: SkFont | null;\n  text: string;\n  path: PathDef;\n  initialOffset: number;\n}\n\nexport interface TextBlobProps extends DrawingNodeProps {\n  blob: SkTextBlob;\n  x: number;\n  y: number;\n}\n\nexport interface Glyph {\n  id: number;\n  pos: SkPoint;\n}\n\nexport interface GlyphsProps extends DrawingNodeProps {\n  font: SkFont | null;\n  x: number;\n  y: number;\n  glyphs: Glyph[];\n}\n\nexport interface BoxProps extends DrawingNodeProps {\n  box: SkRRect | SkRect;\n}\n\nexport interface BoxShadowProps {\n  dx?: number;\n  dy?: number;\n  spread?: number;\n  blur: number;\n  color?: Color;\n  inner?: boolean;\n}\n"],"mappings":""}