@shopify/react-native-skia 0.1.151 → 0.1.152

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (89) hide show
  1. package/android/CMakeLists.txt +4 -5
  2. package/android/cpp/jni/JniLoad.cpp +7 -5
  3. package/android/cpp/jni/JniSkiaManager.cpp +2 -15
  4. package/android/cpp/jni/include/JniSkiaBaseView.h +68 -0
  5. package/android/cpp/jni/include/JniSkiaDrawView.h +64 -47
  6. package/android/cpp/jni/include/JniSkiaManager.h +8 -10
  7. package/android/cpp/jni/include/JniSkiaPictureView.h +96 -0
  8. package/android/cpp/rnskia-android/{RNSkPlatformContextImpl.h → RNSkAndroidPlatformContext.h} +4 -4
  9. package/android/cpp/rnskia-android/RNSkAndroidView.h +100 -0
  10. package/android/cpp/rnskia-android/RNSkOpenGLCanvasProvider.cpp +91 -0
  11. package/android/cpp/rnskia-android/RNSkOpenGLCanvasProvider.h +39 -0
  12. package/android/cpp/rnskia-android/SkiaOpenGLRenderer.cpp +15 -6
  13. package/android/cpp/rnskia-android/SkiaOpenGLRenderer.h +5 -4
  14. package/android/src/main/java/com/shopify/reactnative/skia/PlatformContext.java +5 -11
  15. package/android/src/main/java/com/shopify/reactnative/skia/RNSkiaPackage.java +1 -2
  16. package/android/src/main/java/com/shopify/reactnative/skia/SkiaBaseView.java +143 -0
  17. package/android/src/main/java/com/shopify/reactnative/skia/SkiaDrawView.java +17 -145
  18. package/android/src/main/java/com/shopify/reactnative/skia/{RNSkiaViewManager.java → SkiaDrawViewManager.java} +4 -15
  19. package/android/src/main/java/com/shopify/reactnative/skia/SkiaManager.java +1 -10
  20. package/android/src/main/java/com/shopify/reactnative/skia/SkiaPictureView.java +45 -0
  21. package/android/src/main/java/com/shopify/reactnative/skia/SkiaPictureViewManager.java +64 -0
  22. package/cpp/jsi/JsiValueWrapper.h +11 -0
  23. package/cpp/rnskia/RNSkInfoParameter.h +4 -14
  24. package/cpp/rnskia/RNSkJsView.cpp +211 -0
  25. package/cpp/rnskia/RNSkJsView.h +115 -0
  26. package/cpp/rnskia/RNSkJsiViewApi.h +6 -6
  27. package/cpp/rnskia/RNSkManager.cpp +7 -7
  28. package/cpp/rnskia/RNSkManager.h +7 -7
  29. package/cpp/rnskia/RNSkPictureView.h +124 -0
  30. package/cpp/rnskia/RNSkView.h +287 -0
  31. package/ios/RNSkia-iOS/RNSkMetalCanvasProvider.h +38 -0
  32. package/ios/RNSkia-iOS/{RNSkDrawViewImpl.mm → RNSkMetalCanvasProvider.mm} +40 -23
  33. package/ios/RNSkia-iOS/{PlatformContext.h → RNSkiOSPlatformContext.h} +4 -4
  34. package/ios/RNSkia-iOS/{PlatformContext.mm → RNSkiOSPlatformContext.mm} +5 -5
  35. package/ios/RNSkia-iOS/RNSkiOSView.h +34 -0
  36. package/ios/RNSkia-iOS/SkiaDrawViewManager.mm +19 -11
  37. package/ios/RNSkia-iOS/SkiaManager.mm +3 -3
  38. package/ios/RNSkia-iOS/SkiaPictureViewManager.h +8 -0
  39. package/ios/RNSkia-iOS/SkiaPictureViewManager.mm +51 -0
  40. package/ios/RNSkia-iOS/SkiaUIView.h +26 -0
  41. package/ios/RNSkia-iOS/{SkiaDrawView.mm → SkiaUIView.mm} +29 -23
  42. package/lib/commonjs/views/SkiaBaseWebView.js +213 -0
  43. package/lib/commonjs/views/SkiaBaseWebView.js.map +1 -0
  44. package/lib/commonjs/views/SkiaPictureView.js +112 -0
  45. package/lib/commonjs/views/SkiaPictureView.js.map +1 -0
  46. package/lib/commonjs/views/SkiaPictureView.web.js +31 -0
  47. package/lib/commonjs/views/SkiaPictureView.web.js.map +1 -0
  48. package/lib/commonjs/views/SkiaView.js +1 -1
  49. package/lib/commonjs/views/SkiaView.js.map +1 -1
  50. package/lib/commonjs/views/SkiaView.web.js +14 -201
  51. package/lib/commonjs/views/SkiaView.web.js.map +1 -1
  52. package/lib/commonjs/views/index.js +13 -0
  53. package/lib/commonjs/views/index.js.map +1 -1
  54. package/lib/commonjs/views/types.js.map +1 -1
  55. package/lib/module/views/SkiaBaseWebView.js +198 -0
  56. package/lib/module/views/SkiaBaseWebView.js.map +1 -0
  57. package/lib/module/views/SkiaPictureView.js +94 -0
  58. package/lib/module/views/SkiaPictureView.js.map +1 -0
  59. package/lib/module/views/SkiaPictureView.web.js +19 -0
  60. package/lib/module/views/SkiaPictureView.web.js.map +1 -0
  61. package/lib/module/views/SkiaView.js +1 -1
  62. package/lib/module/views/SkiaView.js.map +1 -1
  63. package/lib/module/views/SkiaView.web.js +15 -199
  64. package/lib/module/views/SkiaView.web.js.map +1 -1
  65. package/lib/module/views/index.js +1 -0
  66. package/lib/module/views/index.js.map +1 -1
  67. package/lib/module/views/types.js.map +1 -1
  68. package/lib/typescript/src/views/SkiaBaseWebView.d.ts +58 -0
  69. package/lib/typescript/src/views/SkiaPictureView.d.ts +27 -0
  70. package/lib/typescript/src/views/SkiaPictureView.web.d.ts +7 -0
  71. package/lib/typescript/src/views/SkiaView.d.ts +4 -4
  72. package/lib/typescript/src/views/SkiaView.web.d.ts +6 -53
  73. package/lib/typescript/src/views/index.d.ts +1 -0
  74. package/lib/typescript/src/views/types.d.ts +7 -2
  75. package/package.json +1 -1
  76. package/src/views/SkiaBaseWebView.tsx +177 -0
  77. package/src/views/SkiaPictureView.tsx +93 -0
  78. package/src/views/SkiaPictureView.web.tsx +23 -0
  79. package/src/views/SkiaView.tsx +6 -7
  80. package/src/views/SkiaView.web.tsx +18 -167
  81. package/src/views/index.ts +1 -0
  82. package/src/views/types.ts +9 -2
  83. package/android/cpp/jni/JniSkiaDrawView.cpp +0 -113
  84. package/android/cpp/rnskia-android/RNSkDrawViewImpl.cpp +0 -73
  85. package/android/cpp/rnskia-android/RNSkDrawViewImpl.h +0 -48
  86. package/cpp/rnskia/RNSkDrawView.cpp +0 -315
  87. package/cpp/rnskia/RNSkDrawView.h +0 -226
  88. package/ios/RNSkia-iOS/RNSkDrawViewImpl.h +0 -52
  89. package/ios/RNSkia-iOS/SkiaDrawView.h +0 -23
@@ -0,0 +1,26 @@
1
+ #pragma once
2
+
3
+ #import <memory>
4
+ #import <string>
5
+
6
+ #import <CoreFoundation/CoreFoundation.h>
7
+ #import <UIKit/UIKit.h>
8
+
9
+ #import <RNSkiOSView.h>
10
+ #import <RNSkManager.h>
11
+
12
+ class RNSkiOSJsView;
13
+
14
+ @interface SkiaUIView : UIView
15
+
16
+ - (instancetype)initWithManager: (RNSkia::RNSkManager*)manager
17
+ factory: (std::function<std::shared_ptr<RNSkBaseiOSView>(
18
+ std::shared_ptr<RNSkia::RNSkPlatformContext>)>)factory;
19
+
20
+ - (std::shared_ptr<RNSkBaseiOSView>) impl;
21
+
22
+ - (void) setDrawingMode:(std::string) mode;
23
+ - (void) setDebugMode:(bool) debugMode;
24
+ - (void) setNativeId:(size_t) nativeId;
25
+
26
+ @end
@@ -1,24 +1,26 @@
1
1
  #import <React/RCTBridge.h>
2
2
 
3
- #import <SkiaDrawView.h>
3
+ #import <SkiaUIView.h>
4
4
 
5
5
  #include <utility>
6
6
  #include <vector>
7
7
 
8
- #import <RNSkDrawViewImpl.h>
9
8
  #import <RNSkManager.h>
10
9
 
11
- @implementation SkiaDrawView {
12
- std::shared_ptr<RNSkDrawViewImpl> _impl;
10
+ @implementation SkiaUIView {
11
+ std::shared_ptr<RNSkBaseiOSView> _impl;
13
12
  RNSkia::RNSkManager* _manager;
14
13
  RNSkia::RNSkDrawingMode _drawingMode;
14
+ std::function<std::shared_ptr<RNSkBaseiOSView>(std::shared_ptr<RNSkia::RNSkPlatformContext>)> _factory;
15
15
  bool _debugMode;
16
16
  size_t _nativeId;
17
17
  }
18
18
 
19
19
  #pragma mark Initialization and destruction
20
20
 
21
- - (instancetype) initWithManager: (RNSkia::RNSkManager*)manager;
21
+ - (instancetype) initWithManager: (RNSkia::RNSkManager*)manager
22
+ factory: (std::function<std::shared_ptr<RNSkBaseiOSView>(
23
+ std::shared_ptr<RNSkia::RNSkPlatformContext>)>)factory
22
24
  {
23
25
  self = [super init];
24
26
  if (self) {
@@ -26,6 +28,7 @@
26
28
  _nativeId = 0;
27
29
  _debugMode = false;
28
30
  _drawingMode = RNSkia::RNSkDrawingMode::Default;
31
+ _factory = factory;
29
32
 
30
33
  // Listen to notifications about module invalidation
31
34
  [[NSNotificationCenter defaultCenter] addObserver:self
@@ -50,7 +53,7 @@
50
53
  [_impl->getLayer() removeFromSuperlayer];
51
54
 
52
55
  if(_nativeId != 0 && _manager != nullptr) {
53
- _manager->setSkiaDrawView(_nativeId, nullptr);
56
+ _manager->setSkiaView(_nativeId, nullptr);
54
57
  }
55
58
 
56
59
  _impl = nullptr;
@@ -58,20 +61,23 @@
58
61
  } else {
59
62
  // Create implementation view when the parent view is set
60
63
  if(_impl == nullptr && _manager != nullptr) {
61
- _impl = std::make_shared<RNSkDrawViewImpl>(_manager->getPlatformContext());
64
+ _impl = _factory(_manager->getPlatformContext());
65
+ if(_impl == nullptr) {
66
+ throw std::runtime_error("Expected Skia view implementation, got nullptr.");
67
+ }
62
68
  [self.layer addSublayer: _impl->getLayer()];
63
69
  if(_nativeId != 0) {
64
- _manager->setSkiaDrawView(_nativeId, _impl);
70
+ _manager->setSkiaView(_nativeId, _impl->getDrawView());
65
71
  }
66
- _impl->setDrawingMode(_drawingMode);
67
- _impl->setShowDebugOverlays(_debugMode);
72
+ _impl->getDrawView()->setDrawingMode(_drawingMode);
73
+ _impl->getDrawView()->setShowDebugOverlays(_debugMode);
68
74
  }
69
75
  }
70
76
  }
71
77
 
72
78
  - (void) dealloc {
73
79
  if(_manager != nullptr && _nativeId != 0) {
74
- _manager->unregisterSkiaDrawView(_nativeId);
80
+ _manager->unregisterSkiaView(_nativeId);
75
81
  }
76
82
 
77
83
  [[NSNotificationCenter defaultCenter] removeObserver:self name:RCTBridgeWillInvalidateModulesNotification object:nil];
@@ -94,14 +100,14 @@
94
100
  _drawingMode = mode.compare("continuous") == 0 ? RNSkia::RNSkDrawingMode::Continuous : RNSkia::RNSkDrawingMode::Default;
95
101
 
96
102
  if(_impl != nullptr) {
97
- _impl->setDrawingMode(_drawingMode);
103
+ _impl->getDrawView()->setDrawingMode(_drawingMode);
98
104
  }
99
105
  }
100
106
 
101
107
  -(void) setDebugMode:(bool) debugMode {
102
108
  _debugMode = debugMode;
103
109
  if(_impl != nullptr) {
104
- _impl->setShowDebugOverlays(debugMode);
110
+ _impl->getDrawView()->setShowDebugOverlays(debugMode);
105
111
  }
106
112
  }
107
113
 
@@ -109,13 +115,13 @@
109
115
  _nativeId = nativeId;
110
116
 
111
117
  if(_impl != nullptr) {
112
- _manager->registerSkiaDrawView(nativeId, _impl);
118
+ _manager->registerSkiaView(nativeId, _impl->getDrawView());
113
119
  }
114
120
  }
115
121
 
116
122
  #pragma mark External API
117
123
 
118
- - (std::shared_ptr<RNSkDrawViewImpl>) impl {
124
+ - (std::shared_ptr<RNSkBaseiOSView>) impl {
119
125
  return _impl;
120
126
  }
121
127
 
@@ -135,10 +141,10 @@
135
141
 
136
142
  - (void) handleTouches:(NSSet<UITouch*>*) touches withEvent:(UIEvent*) event {
137
143
  if (event.type == UIEventTypeTouches) {
138
- std::vector<RNSkia::RNSkTouchPoint> nextTouches;
144
+ std::vector<RNSkia::RNSkTouchInfo> nextTouches;
139
145
  for (UITouch *touch in touches) {
140
146
  auto position = [touch preciseLocationInView:self];
141
- RNSkia::RNSkTouchPoint nextTouch;
147
+ RNSkia::RNSkTouchInfo nextTouch;
142
148
  nextTouch.x = position.x;
143
149
  nextTouch.y = position.y;
144
150
  nextTouch.force = [touch force];
@@ -146,26 +152,26 @@
146
152
  auto phase = [touch phase];
147
153
  switch(phase) {
148
154
  case UITouchPhaseBegan:
149
- nextTouch.type = RNSkia::RNSkTouchType::Start;
155
+ nextTouch.type = RNSkia::RNSkTouchInfo::TouchType::Start;
150
156
  break;
151
157
  case UITouchPhaseMoved:
152
- nextTouch.type = RNSkia::RNSkTouchType::Active;
158
+ nextTouch.type = RNSkia::RNSkTouchInfo::TouchType::Active;
153
159
  break;
154
160
  case UITouchPhaseEnded:
155
- nextTouch.type = RNSkia::RNSkTouchType::End;
161
+ nextTouch.type = RNSkia::RNSkTouchInfo::TouchType::End;
156
162
  break;
157
163
  case UITouchPhaseCancelled:
158
- nextTouch.type = RNSkia::RNSkTouchType::Cancelled;
164
+ nextTouch.type = RNSkia::RNSkTouchInfo::TouchType::Cancelled;
159
165
  break;
160
166
  default:
161
- nextTouch.type = RNSkia::RNSkTouchType::Active;
167
+ nextTouch.type = RNSkia::RNSkTouchInfo::TouchType::Active;
162
168
  break;
163
169
  }
164
170
 
165
171
  nextTouches.push_back(nextTouch);
166
172
  }
167
173
  if(_impl != nullptr) {
168
- _impl->updateTouchState(std::move(nextTouches));
174
+ _impl->getDrawView()->updateTouchState(nextTouches);
169
175
  }
170
176
  }
171
177
  }
@@ -0,0 +1,213 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.SkiaBaseWebView = void 0;
7
+
8
+ var _react = _interopRequireDefault(require("react"));
9
+
10
+ var _reactNative = require("react-native");
11
+
12
+ var _JsiSkSurface = require("../skia/web/JsiSkSurface");
13
+
14
+ var _types = require("./types");
15
+
16
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
+
18
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
19
+
20
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
21
+
22
+ const pd = _reactNative.PixelRatio.get();
23
+
24
+ class SkiaBaseWebView extends _react.default.Component {
25
+ constructor(props) {
26
+ super(props);
27
+
28
+ _defineProperty(this, "_surface", null);
29
+
30
+ _defineProperty(this, "_unsubscriptions", []);
31
+
32
+ _defineProperty(this, "_touches", []);
33
+
34
+ _defineProperty(this, "_canvas", null);
35
+
36
+ _defineProperty(this, "_canvasRef", /*#__PURE__*/_react.default.createRef());
37
+
38
+ _defineProperty(this, "_mode", void 0);
39
+
40
+ _defineProperty(this, "_redrawRequests", 0);
41
+
42
+ _defineProperty(this, "requestId", 0);
43
+
44
+ _defineProperty(this, "width", 0);
45
+
46
+ _defineProperty(this, "height", 0);
47
+
48
+ this._mode = props.mode ?? "default";
49
+ }
50
+
51
+ unsubscribeAll() {
52
+ this._unsubscriptions.forEach(u => u());
53
+
54
+ this._unsubscriptions = [];
55
+ }
56
+
57
+ onLayout(evt) {
58
+ const {
59
+ CanvasKit
60
+ } = global;
61
+ const {
62
+ width,
63
+ height
64
+ } = evt.nativeEvent.layout;
65
+ this.width = width;
66
+ this.height = height; // Reset canvas / surface on layout change
67
+
68
+ if (this._canvasRef.current) {
69
+ const canvas = this._canvasRef.current;
70
+ canvas.width = canvas.clientWidth * pd;
71
+ canvas.height = canvas.clientHeight * pd;
72
+ const surface = CanvasKit.MakeWebGLCanvasSurface(this._canvasRef.current);
73
+
74
+ if (!surface) {
75
+ throw new Error("Could not create surface");
76
+ }
77
+
78
+ this._surface = new _JsiSkSurface.JsiSkSurface(CanvasKit, surface);
79
+ this._canvas = this._surface.getCanvas();
80
+ this.redraw();
81
+ }
82
+ }
83
+
84
+ componentDidMount() {
85
+ // Start render loop
86
+ this.tick();
87
+ }
88
+
89
+ componentDidUpdate() {
90
+ this.redraw();
91
+ }
92
+
93
+ componentWillUnmount() {
94
+ this.unsubscribeAll();
95
+ cancelAnimationFrame(this.requestId);
96
+ }
97
+ /**
98
+ * Creates a snapshot from the canvas in the surface
99
+ * @param rect Rect to use as bounds. Optional.
100
+ * @returns An Image object.
101
+ */
102
+
103
+
104
+ makeImageSnapshot(rect) {
105
+ var _this$_surface;
106
+
107
+ return (_this$_surface = this._surface) === null || _this$_surface === void 0 ? void 0 : _this$_surface.makeImageSnapshot(rect);
108
+ }
109
+ /**
110
+ * Override to render
111
+ */
112
+
113
+
114
+ /**
115
+ * Sends a redraw request to the native SkiaView.
116
+ */
117
+ tick() {
118
+ if (this._mode === "continuous" || this._redrawRequests > 0) {
119
+ this._redrawRequests = 0;
120
+
121
+ if (this._canvas) {
122
+ var _this$_surface2;
123
+
124
+ const touches = [...this._touches];
125
+ this._touches = [];
126
+ this.renderInCanvas(this._canvas, touches);
127
+ (_this$_surface2 = this._surface) === null || _this$_surface2 === void 0 ? void 0 : _this$_surface2.ref.flush();
128
+ }
129
+ }
130
+
131
+ this.requestId = requestAnimationFrame(this.tick.bind(this));
132
+ }
133
+
134
+ redraw() {
135
+ this._redrawRequests++;
136
+ }
137
+ /**
138
+ * Updates the drawing mode for the skia view. This is the same
139
+ * as declaratively setting the mode property on the SkiaView.
140
+ * There are two drawing modes, "continuous" and "default",
141
+ * where the continuous mode will continuously redraw the view and
142
+ * the default mode will only redraw when any of the regular react
143
+ * properties are changed like size and margins.
144
+ * @param mode Drawing mode to use.
145
+ */
146
+
147
+
148
+ setDrawMode(mode) {
149
+ this._mode = mode;
150
+ this.tick();
151
+ }
152
+ /**
153
+ * Registers one or move values as a dependant value of the Skia View. The view will
154
+ * The view will redraw itself when any of the values change.
155
+ * @param values Values to register
156
+ */
157
+
158
+
159
+ registerValues(_values) {
160
+ // Unsubscribe from dependency values
161
+ this.unsubscribeAll(); // Register redraw dependencies on values
162
+
163
+ _values.forEach(v => {
164
+ this._unsubscriptions.push(v.addListener(() => {
165
+ this.redraw();
166
+ }));
167
+ });
168
+ }
169
+
170
+ handleTouchEvent(evt, touchType) {
171
+ this._touches.push({
172
+ id: evt.pointerId,
173
+ x: evt.clientX - evt.currentTarget.getClientRects()[0].left,
174
+ y: evt.clientY - evt.currentTarget.getClientRects()[0].top,
175
+ force: evt.pressure,
176
+ type: touchType,
177
+ timestamp: Date.now()
178
+ });
179
+
180
+ this.redraw();
181
+ }
182
+
183
+ createTouchHandler(touchType) {
184
+ return evt => this.handleTouchEvent(evt, touchType);
185
+ }
186
+
187
+ render() {
188
+ const {
189
+ mode,
190
+ debug = false,
191
+ ...viewProps
192
+ } = this.props;
193
+ return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({}, viewProps, {
194
+ onLayout: this.onLayout.bind(this)
195
+ }), /*#__PURE__*/_react.default.createElement("canvas", {
196
+ ref: this._canvasRef,
197
+ style: {
198
+ display: "flex",
199
+ flex: 1
200
+ },
201
+ onPointerDown: this.createTouchHandler(_types.TouchType.Start),
202
+ onPointerMove: this.createTouchHandler(_types.TouchType.Active),
203
+ onPointerUp: this.createTouchHandler(_types.TouchType.End),
204
+ onPointerCancel: this.createTouchHandler(_types.TouchType.Cancelled),
205
+ onPointerLeave: this.createTouchHandler(_types.TouchType.End),
206
+ onPointerOut: this.createTouchHandler(_types.TouchType.End)
207
+ }));
208
+ }
209
+
210
+ }
211
+
212
+ exports.SkiaBaseWebView = SkiaBaseWebView;
213
+ //# sourceMappingURL=SkiaBaseWebView.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["pd","PixelRatio","get","SkiaBaseWebView","React","Component","constructor","props","createRef","_mode","mode","unsubscribeAll","_unsubscriptions","forEach","u","onLayout","evt","CanvasKit","global","width","height","nativeEvent","layout","_canvasRef","current","canvas","clientWidth","clientHeight","surface","MakeWebGLCanvasSurface","Error","_surface","JsiSkSurface","_canvas","getCanvas","redraw","componentDidMount","tick","componentDidUpdate","componentWillUnmount","cancelAnimationFrame","requestId","makeImageSnapshot","rect","_redrawRequests","touches","_touches","renderInCanvas","ref","flush","requestAnimationFrame","bind","setDrawMode","registerValues","_values","v","push","addListener","handleTouchEvent","touchType","id","pointerId","x","clientX","currentTarget","getClientRects","left","y","clientY","top","force","pressure","type","timestamp","Date","now","createTouchHandler","render","debug","viewProps","display","flex","TouchType","Start","Active","End","Cancelled"],"sources":["SkiaBaseWebView.tsx"],"sourcesContent":["/* global HTMLCanvasElement */\nimport React from \"react\";\nimport type { PointerEvent } from \"react\";\nimport type { LayoutChangeEvent } from \"react-native\";\nimport { PixelRatio, View } from \"react-native\";\n\nimport type { SkRect, SkCanvas } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\nimport { JsiSkSurface } from \"../skia/web/JsiSkSurface\";\n\nimport type { DrawMode, SkiaBaseViewProps, TouchInfo } from \"./types\";\nimport { TouchType } from \"./types\";\n\nconst pd = PixelRatio.get();\n\nexport abstract class SkiaBaseWebView<\n TProps extends SkiaBaseViewProps\n> extends React.Component<TProps> {\n constructor(props: TProps) {\n super(props);\n this._mode = props.mode ?? \"default\";\n }\n\n private _surface: JsiSkSurface | null = null;\n private _unsubscriptions: Array<() => void> = [];\n private _touches: Array<TouchInfo> = [];\n private _canvas: SkCanvas | null = null;\n private _canvasRef = React.createRef<HTMLCanvasElement>();\n private _mode: DrawMode;\n private _redrawRequests = 0;\n private requestId = 0;\n\n protected width = 0;\n protected height = 0;\n\n private unsubscribeAll() {\n this._unsubscriptions.forEach((u) => u());\n this._unsubscriptions = [];\n }\n\n private onLayout(evt: LayoutChangeEvent) {\n const { CanvasKit } = global;\n const { width, height } = evt.nativeEvent.layout;\n this.width = width;\n this.height = height;\n // Reset canvas / surface on layout change\n if (this._canvasRef.current) {\n const canvas = this._canvasRef.current;\n canvas.width = canvas.clientWidth * pd;\n canvas.height = canvas.clientHeight * pd;\n const surface = CanvasKit.MakeWebGLCanvasSurface(this._canvasRef.current);\n if (!surface) {\n throw new Error(\"Could not create surface\");\n }\n this._surface = new JsiSkSurface(CanvasKit, surface);\n this._canvas = this._surface.getCanvas();\n this.redraw();\n }\n }\n\n componentDidMount() {\n // Start render loop\n this.tick();\n }\n\n componentDidUpdate() {\n this.redraw();\n }\n\n componentWillUnmount() {\n this.unsubscribeAll();\n cancelAnimationFrame(this.requestId);\n }\n\n /**\n * Creates a snapshot from the canvas in the surface\n * @param rect Rect to use as bounds. Optional.\n * @returns An Image object.\n */\n public makeImageSnapshot(rect?: SkRect) {\n return this._surface?.makeImageSnapshot(rect);\n }\n\n /**\n * Override to render\n */\n protected abstract renderInCanvas(\n canvas: SkCanvas,\n touches: TouchInfo[]\n ): void;\n\n /**\n * Sends a redraw request to the native SkiaView.\n */\n private tick() {\n if (this._mode === \"continuous\" || this._redrawRequests > 0) {\n this._redrawRequests = 0;\n if (this._canvas) {\n const touches = [...this._touches];\n this._touches = [];\n this.renderInCanvas(this._canvas!, touches);\n this._surface?.ref.flush();\n }\n }\n this.requestId = requestAnimationFrame(this.tick.bind(this));\n }\n\n public redraw() {\n this._redrawRequests++;\n }\n\n /**\n * Updates the drawing mode for the skia view. This is the same\n * as declaratively setting the mode property on the SkiaView.\n * There are two drawing modes, \"continuous\" and \"default\",\n * where the continuous mode will continuously redraw the view and\n * the default mode will only redraw when any of the regular react\n * properties are changed like size and margins.\n * @param mode Drawing mode to use.\n */\n public setDrawMode(mode: DrawMode) {\n this._mode = mode;\n this.tick();\n }\n\n /**\n * Registers one or move values as a dependant value of the Skia View. The view will\n * The view will redraw itself when any of the values change.\n * @param values Values to register\n */\n public registerValues(_values: SkiaValue<unknown>[]) {\n // Unsubscribe from dependency values\n this.unsubscribeAll();\n // Register redraw dependencies on values\n _values.forEach((v) => {\n this._unsubscriptions.push(\n v.addListener(() => {\n this.redraw();\n })\n );\n });\n }\n\n private handleTouchEvent(evt: PointerEvent, touchType: TouchType) {\n this._touches.push({\n id: evt.pointerId,\n x: evt.clientX - evt.currentTarget.getClientRects()[0].left,\n y: evt.clientY - evt.currentTarget.getClientRects()[0].top,\n force: evt.pressure,\n type: touchType,\n timestamp: Date.now(),\n });\n this.redraw();\n }\n\n createTouchHandler(touchType: TouchType) {\n return (evt: PointerEvent) => this.handleTouchEvent(evt, touchType);\n }\n\n render() {\n const { mode, debug = false, ...viewProps } = this.props;\n return (\n <View {...viewProps} onLayout={this.onLayout.bind(this)}>\n <canvas\n ref={this._canvasRef}\n style={{ display: \"flex\", flex: 1 }}\n onPointerDown={this.createTouchHandler(TouchType.Start)}\n onPointerMove={this.createTouchHandler(TouchType.Active)}\n onPointerUp={this.createTouchHandler(TouchType.End)}\n onPointerCancel={this.createTouchHandler(TouchType.Cancelled)}\n onPointerLeave={this.createTouchHandler(TouchType.End)}\n onPointerOut={this.createTouchHandler(TouchType.End)}\n />\n </View>\n );\n }\n}\n"],"mappings":"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"}
@@ -0,0 +1,112 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.SkiaPictureView = void 0;
7
+
8
+ var _react = _interopRequireDefault(require("react"));
9
+
10
+ var _reactNative = require("react-native");
11
+
12
+ var _api = require("./api");
13
+
14
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
+
16
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
17
+
18
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
19
+
20
+ let SkiaViewNativeId = 1000;
21
+ const NativeSkiaPictureView = (0, _reactNative.requireNativeComponent)("SkiaPictureView");
22
+
23
+ class SkiaPictureView extends _react.default.Component {
24
+ constructor(props) {
25
+ super(props);
26
+
27
+ _defineProperty(this, "_nativeId", void 0);
28
+
29
+ this._nativeId = SkiaViewNativeId++;
30
+ const {
31
+ picture
32
+ } = props;
33
+
34
+ if (picture) {
35
+ assertSkiaViewApi();
36
+
37
+ _api.SkiaViewApi.setJsiProperty(this._nativeId, "picture", picture);
38
+ }
39
+ }
40
+
41
+ get nativeId() {
42
+ return this._nativeId;
43
+ }
44
+
45
+ componentDidUpdate(prevProps) {
46
+ const {
47
+ picture
48
+ } = this.props;
49
+
50
+ if (picture !== prevProps.picture) {
51
+ assertSkiaViewApi();
52
+
53
+ _api.SkiaViewApi.setJsiProperty(this._nativeId, "picture", picture);
54
+ }
55
+ }
56
+ /**
57
+ * Creates a snapshot from the canvas in the surface
58
+ * @param rect Rect to use as bounds. Optional.
59
+ * @returns An Image object.
60
+ */
61
+
62
+
63
+ makeImageSnapshot(rect) {
64
+ assertSkiaViewApi();
65
+ return _api.SkiaViewApi.makeImageSnapshot(this._nativeId, rect);
66
+ }
67
+ /**
68
+ * Sends a redraw request to the native SkiaView.
69
+ */
70
+
71
+
72
+ redraw() {
73
+ assertSkiaViewApi();
74
+
75
+ _api.SkiaViewApi.requestRedraw(this._nativeId);
76
+ }
77
+ /**
78
+ * Registers one or move values as a dependant value of the Skia View. The view will
79
+ * The view will redraw itself when any of the values change.
80
+ * @param values Values to register
81
+ */
82
+
83
+
84
+ registerValues(values) {
85
+ assertSkiaViewApi();
86
+ return _api.SkiaViewApi.registerValuesInView(this._nativeId, values);
87
+ }
88
+
89
+ render() {
90
+ const {
91
+ mode,
92
+ debug = false,
93
+ ...viewProps
94
+ } = this.props;
95
+ return /*#__PURE__*/_react.default.createElement(NativeSkiaPictureView, _extends({
96
+ collapsable: false,
97
+ nativeID: `${this._nativeId}`,
98
+ mode: mode,
99
+ debug: debug
100
+ }, viewProps));
101
+ }
102
+
103
+ }
104
+
105
+ exports.SkiaPictureView = SkiaPictureView;
106
+
107
+ const assertSkiaViewApi = () => {
108
+ if (_api.SkiaViewApi === null || _api.SkiaViewApi.setJsiProperty === null || _api.SkiaViewApi.callJsiMethod === null || _api.SkiaViewApi.registerValuesInView === null || _api.SkiaViewApi.requestRedraw === null || _api.SkiaViewApi.makeImageSnapshot === null) {
109
+ throw Error("Skia View Api was not found.");
110
+ }
111
+ };
112
+ //# sourceMappingURL=SkiaPictureView.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["SkiaViewNativeId","NativeSkiaPictureView","requireNativeComponent","SkiaPictureView","React","Component","constructor","props","_nativeId","picture","assertSkiaViewApi","SkiaViewApi","setJsiProperty","nativeId","componentDidUpdate","prevProps","makeImageSnapshot","rect","redraw","requestRedraw","registerValues","values","registerValuesInView","render","mode","debug","viewProps","callJsiMethod","Error"],"sources":["SkiaPictureView.tsx"],"sourcesContent":["import React from \"react\";\nimport { requireNativeComponent } from \"react-native\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\n\nimport { SkiaViewApi } from \"./api\";\nimport type { NativeSkiaViewProps, SkiaPictureViewProps } from \"./types\";\n\nlet SkiaViewNativeId = 1000;\n\nconst NativeSkiaPictureView =\n requireNativeComponent<NativeSkiaViewProps>(\"SkiaPictureView\");\n\nexport class SkiaPictureView extends React.Component<SkiaPictureViewProps> {\n constructor(props: SkiaPictureViewProps) {\n super(props);\n this._nativeId = SkiaViewNativeId++;\n const { picture } = props;\n if (picture) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"picture\", picture);\n }\n }\n\n private _nativeId: number;\n\n public get nativeId() {\n return this._nativeId;\n }\n\n componentDidUpdate(prevProps: SkiaPictureViewProps) {\n const { picture } = this.props;\n if (picture !== prevProps.picture) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"picture\", picture);\n }\n }\n\n /**\n * Creates a snapshot from the canvas in the surface\n * @param rect Rect to use as bounds. Optional.\n * @returns An Image object.\n */\n public makeImageSnapshot(rect?: SkRect) {\n assertSkiaViewApi();\n return SkiaViewApi.makeImageSnapshot(this._nativeId, rect);\n }\n\n /**\n * Sends a redraw request to the native SkiaView.\n */\n public redraw() {\n assertSkiaViewApi();\n SkiaViewApi.requestRedraw(this._nativeId);\n }\n\n /**\n * Registers one or move values as a dependant value of the Skia View. The view will\n * The view will redraw itself when any of the values change.\n * @param values Values to register\n */\n public registerValues(values: SkiaValue<unknown>[]): () => void {\n assertSkiaViewApi();\n return SkiaViewApi.registerValuesInView(this._nativeId, values);\n }\n\n render() {\n const { mode, debug = false, ...viewProps } = this.props;\n return (\n <NativeSkiaPictureView\n collapsable={false}\n nativeID={`${this._nativeId}`}\n mode={mode}\n debug={debug}\n {...viewProps}\n />\n );\n }\n}\n\nconst assertSkiaViewApi = () => {\n if (\n SkiaViewApi === null ||\n SkiaViewApi.setJsiProperty === null ||\n SkiaViewApi.callJsiMethod === null ||\n SkiaViewApi.registerValuesInView === null ||\n SkiaViewApi.requestRedraw === null ||\n SkiaViewApi.makeImageSnapshot === null\n ) {\n throw Error(\"Skia View Api was not found.\");\n }\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAKA;;;;;;;;AAGA,IAAIA,gBAAgB,GAAG,IAAvB;AAEA,MAAMC,qBAAqB,GACzB,IAAAC,mCAAA,EAA4C,iBAA5C,CADF;;AAGO,MAAMC,eAAN,SAA8BC,cAAA,CAAMC,SAApC,CAAoE;EACzEC,WAAW,CAACC,KAAD,EAA8B;IACvC,MAAMA,KAAN;;IADuC;;IAEvC,KAAKC,SAAL,GAAiBR,gBAAgB,EAAjC;IACA,MAAM;MAAES;IAAF,IAAcF,KAApB;;IACA,IAAIE,OAAJ,EAAa;MACXC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,SAA3C,EAAsDC,OAAtD;IACD;EACF;;EAIkB,IAARI,QAAQ,GAAG;IACpB,OAAO,KAAKL,SAAZ;EACD;;EAEDM,kBAAkB,CAACC,SAAD,EAAkC;IAClD,MAAM;MAAEN;IAAF,IAAc,KAAKF,KAAzB;;IACA,IAAIE,OAAO,KAAKM,SAAS,CAACN,OAA1B,EAAmC;MACjCC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,SAA3C,EAAsDC,OAAtD;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSO,iBAAiB,CAACC,IAAD,EAAgB;IACtCP,iBAAiB;IACjB,OAAOC,gBAAA,CAAYK,iBAAZ,CAA8B,KAAKR,SAAnC,EAA8CS,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdR,iBAAiB;;IACjBC,gBAAA,CAAYQ,aAAZ,CAA0B,KAAKX,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSY,cAAc,CAACC,MAAD,EAA2C;IAC9DX,iBAAiB;IACjB,OAAOC,gBAAA,CAAYW,oBAAZ,CAAiC,KAAKd,SAAtC,EAAiDa,MAAjD,CAAP;EACD;;EAEDE,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuB,GAAGC;IAA1B,IAAwC,KAAKnB,KAAnD;IACA,oBACE,6BAAC,qBAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEgB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAhEwE;;;;AAmE3E,MAAMhB,iBAAiB,GAAG,MAAM;EAC9B,IACEC,gBAAA,KAAgB,IAAhB,IACAA,gBAAA,CAAYC,cAAZ,KAA+B,IAD/B,IAEAD,gBAAA,CAAYgB,aAAZ,KAA8B,IAF9B,IAGAhB,gBAAA,CAAYW,oBAAZ,KAAqC,IAHrC,IAIAX,gBAAA,CAAYQ,aAAZ,KAA8B,IAJ9B,IAKAR,gBAAA,CAAYK,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMY,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}
@@ -0,0 +1,31 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.SkiaPictureView = void 0;
7
+
8
+ var _reactNative = require("react-native");
9
+
10
+ var _SkiaBaseWebView = require("./SkiaBaseWebView");
11
+
12
+ const pd = _reactNative.PixelRatio.get();
13
+
14
+ class SkiaPictureView extends _SkiaBaseWebView.SkiaBaseWebView {
15
+ constructor(props) {
16
+ super(props);
17
+ }
18
+
19
+ renderInCanvas(canvas) {
20
+ if (this.props.picture) {
21
+ canvas.save();
22
+ canvas.scale(pd, pd);
23
+ canvas.drawPicture(this.props.picture);
24
+ canvas.restore();
25
+ }
26
+ }
27
+
28
+ }
29
+
30
+ exports.SkiaPictureView = SkiaPictureView;
31
+ //# sourceMappingURL=SkiaPictureView.web.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["pd","PixelRatio","get","SkiaPictureView","SkiaBaseWebView","constructor","props","renderInCanvas","canvas","picture","save","scale","drawPicture","restore"],"sources":["SkiaPictureView.web.tsx"],"sourcesContent":["import { PixelRatio } from \"react-native\";\n\nimport type { SkCanvas } from \"../skia/types\";\n\nimport type { SkiaPictureViewProps } from \"./types\";\nimport { SkiaBaseWebView } from \"./SkiaBaseWebView\";\n\nconst pd = PixelRatio.get();\n\nexport class SkiaPictureView extends SkiaBaseWebView<SkiaPictureViewProps> {\n constructor(props: SkiaPictureViewProps) {\n super(props);\n }\n\n protected renderInCanvas(canvas: SkCanvas): void {\n if (this.props.picture) {\n canvas.save();\n canvas.scale(pd, pd);\n canvas.drawPicture(this.props.picture);\n canvas.restore();\n }\n }\n}\n"],"mappings":";;;;;;;AAAA;;AAKA;;AAEA,MAAMA,EAAE,GAAGC,uBAAA,CAAWC,GAAX,EAAX;;AAEO,MAAMC,eAAN,SAA8BC,gCAA9B,CAAoE;EACzEC,WAAW,CAACC,KAAD,EAA8B;IACvC,MAAMA,KAAN;EACD;;EAESC,cAAc,CAACC,MAAD,EAAyB;IAC/C,IAAI,KAAKF,KAAL,CAAWG,OAAf,EAAwB;MACtBD,MAAM,CAACE,IAAP;MACAF,MAAM,CAACG,KAAP,CAAaX,EAAb,EAAiBA,EAAjB;MACAQ,MAAM,CAACI,WAAP,CAAmB,KAAKN,KAAL,CAAWG,OAA9B;MACAD,MAAM,CAACK,OAAP;IACD;EACF;;AAZwE"}
@@ -18,7 +18,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
18
18
  function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
19
19
 
20
20
  let SkiaViewNativeId = 1000;
21
- const NativeSkiaView = (0, _reactNative.requireNativeComponent)("ReactNativeSkiaView");
21
+ const NativeSkiaView = (0, _reactNative.requireNativeComponent)("SkiaDrawView");
22
22
 
23
23
  class SkiaView extends _react.default.Component {
24
24
  constructor(props) {
@@ -1 +1 @@
1
- {"version":3,"names":["SkiaViewNativeId","NativeSkiaView","requireNativeComponent","SkiaView","React","Component","constructor","props","_nativeId","onDraw","assertSkiaViewApi","SkiaViewApi","setJsiProperty","nativeId","componentDidUpdate","prevProps","makeImageSnapshot","rect","redraw","requestRedraw","registerValues","values","registerValuesInView","render","mode","debug","viewProps","callJsiMethod","Error"],"sources":["SkiaView.tsx"],"sourcesContent":["import React from \"react\";\nimport { requireNativeComponent } from \"react-native\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\n\nimport { SkiaViewApi } from \"./api\";\nimport type { NativeSkiaViewProps, SkiaViewProps } from \"./types\";\n\nlet SkiaViewNativeId = 1000;\n\nconst NativeSkiaView = requireNativeComponent<NativeSkiaViewProps>(\n \"ReactNativeSkiaView\"\n);\n\nexport class SkiaView extends React.Component<SkiaViewProps> {\n constructor(props: SkiaViewProps) {\n super(props);\n this._nativeId = SkiaViewNativeId++;\n const { onDraw } = props;\n if (onDraw) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"drawCallback\", onDraw);\n }\n }\n\n private _nativeId: number;\n\n public get nativeId() {\n return this._nativeId;\n }\n\n componentDidUpdate(prevProps: SkiaViewProps) {\n const { onDraw } = this.props;\n if (onDraw !== prevProps.onDraw) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"drawCallback\", onDraw);\n }\n }\n\n /**\n * Creates a snapshot from the canvas in the surface\n * @param rect Rect to use as bounds. Optional.\n * @returns An Image object.\n */\n public makeImageSnapshot(rect?: SkRect) {\n assertSkiaViewApi();\n return SkiaViewApi.makeImageSnapshot(this._nativeId, rect);\n }\n\n /**\n * Sends a redraw request to the native SkiaView.\n */\n public redraw() {\n assertSkiaViewApi();\n SkiaViewApi.requestRedraw(this._nativeId);\n }\n\n /**\n * Registers one or move values as a dependant value of the Skia View. The view will\n * The view will redraw itself when any of the values change.\n * @param values Values to register\n */\n public registerValues(values: SkiaValue<unknown>[]): () => void {\n assertSkiaViewApi();\n return SkiaViewApi.registerValuesInView(this._nativeId, values);\n }\n\n render() {\n const { mode, debug = false, ...viewProps } = this.props;\n return (\n <NativeSkiaView\n collapsable={false}\n nativeID={`${this._nativeId}`}\n mode={mode}\n debug={debug}\n {...viewProps}\n />\n );\n }\n}\n\nconst assertSkiaViewApi = () => {\n if (\n SkiaViewApi === null ||\n SkiaViewApi.setJsiProperty === null ||\n SkiaViewApi.callJsiMethod === null ||\n SkiaViewApi.registerValuesInView === null ||\n SkiaViewApi.requestRedraw === null ||\n SkiaViewApi.makeImageSnapshot === null\n ) {\n throw Error(\"Skia View Api was not found.\");\n }\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAKA;;;;;;;;AAGA,IAAIA,gBAAgB,GAAG,IAAvB;AAEA,MAAMC,cAAc,GAAG,IAAAC,mCAAA,EACrB,qBADqB,CAAvB;;AAIO,MAAMC,QAAN,SAAuBC,cAAA,CAAMC,SAA7B,CAAsD;EAC3DC,WAAW,CAACC,KAAD,EAAuB;IAChC,MAAMA,KAAN;;IADgC;;IAEhC,KAAKC,SAAL,GAAiBR,gBAAgB,EAAjC;IACA,MAAM;MAAES;IAAF,IAAaF,KAAnB;;IACA,IAAIE,MAAJ,EAAY;MACVC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;EACF;;EAIkB,IAARI,QAAQ,GAAG;IACpB,OAAO,KAAKL,SAAZ;EACD;;EAEDM,kBAAkB,CAACC,SAAD,EAA2B;IAC3C,MAAM;MAAEN;IAAF,IAAa,KAAKF,KAAxB;;IACA,IAAIE,MAAM,KAAKM,SAAS,CAACN,MAAzB,EAAiC;MAC/BC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSO,iBAAiB,CAACC,IAAD,EAAgB;IACtCP,iBAAiB;IACjB,OAAOC,gBAAA,CAAYK,iBAAZ,CAA8B,KAAKR,SAAnC,EAA8CS,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdR,iBAAiB;;IACjBC,gBAAA,CAAYQ,aAAZ,CAA0B,KAAKX,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSY,cAAc,CAACC,MAAD,EAA2C;IAC9DX,iBAAiB;IACjB,OAAOC,gBAAA,CAAYW,oBAAZ,CAAiC,KAAKd,SAAtC,EAAiDa,MAAjD,CAAP;EACD;;EAEDE,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuB,GAAGC;IAA1B,IAAwC,KAAKnB,KAAnD;IACA,oBACE,6BAAC,cAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEgB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAhE0D;;;;AAmE7D,MAAMhB,iBAAiB,GAAG,MAAM;EAC9B,IACEC,gBAAA,KAAgB,IAAhB,IACAA,gBAAA,CAAYC,cAAZ,KAA+B,IAD/B,IAEAD,gBAAA,CAAYgB,aAAZ,KAA8B,IAF9B,IAGAhB,gBAAA,CAAYW,oBAAZ,KAAqC,IAHrC,IAIAX,gBAAA,CAAYQ,aAAZ,KAA8B,IAJ9B,IAKAR,gBAAA,CAAYK,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMY,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}
1
+ {"version":3,"names":["SkiaViewNativeId","NativeSkiaView","requireNativeComponent","SkiaView","React","Component","constructor","props","_nativeId","onDraw","assertSkiaViewApi","SkiaViewApi","setJsiProperty","nativeId","componentDidUpdate","prevProps","makeImageSnapshot","rect","redraw","requestRedraw","registerValues","values","registerValuesInView","render","mode","debug","viewProps","callJsiMethod","Error"],"sources":["SkiaView.tsx"],"sourcesContent":["import React from \"react\";\nimport { requireNativeComponent } from \"react-native\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\n\nimport { SkiaViewApi } from \"./api\";\nimport type { NativeSkiaViewProps, SkiaDrawViewProps } from \"./types\";\n\nlet SkiaViewNativeId = 1000;\n\nconst NativeSkiaView =\n requireNativeComponent<NativeSkiaViewProps>(\"SkiaDrawView\");\n\nexport class SkiaView extends React.Component<SkiaDrawViewProps> {\n constructor(props: SkiaDrawViewProps) {\n super(props);\n this._nativeId = SkiaViewNativeId++;\n const { onDraw } = props;\n if (onDraw) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"drawCallback\", onDraw);\n }\n }\n\n private _nativeId: number;\n\n public get nativeId() {\n return this._nativeId;\n }\n\n componentDidUpdate(prevProps: SkiaDrawViewProps) {\n const { onDraw } = this.props;\n if (onDraw !== prevProps.onDraw) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"drawCallback\", onDraw);\n }\n }\n\n /**\n * Creates a snapshot from the canvas in the surface\n * @param rect Rect to use as bounds. Optional.\n * @returns An Image object.\n */\n public makeImageSnapshot(rect?: SkRect) {\n assertSkiaViewApi();\n return SkiaViewApi.makeImageSnapshot(this._nativeId, rect);\n }\n\n /**\n * Sends a redraw request to the native SkiaView.\n */\n public redraw() {\n assertSkiaViewApi();\n SkiaViewApi.requestRedraw(this._nativeId);\n }\n\n /**\n * Registers one or move values as a dependant value of the Skia View. The view will\n * The view will redraw itself when any of the values change.\n * @param values Values to register\n */\n public registerValues(values: SkiaValue<unknown>[]): () => void {\n assertSkiaViewApi();\n return SkiaViewApi.registerValuesInView(this._nativeId, values);\n }\n\n render() {\n const { mode, debug = false, ...viewProps } = this.props;\n return (\n <NativeSkiaView\n collapsable={false}\n nativeID={`${this._nativeId}`}\n mode={mode}\n debug={debug}\n {...viewProps}\n />\n );\n }\n}\n\nconst assertSkiaViewApi = () => {\n if (\n SkiaViewApi === null ||\n SkiaViewApi.setJsiProperty === null ||\n SkiaViewApi.callJsiMethod === null ||\n SkiaViewApi.registerValuesInView === null ||\n SkiaViewApi.requestRedraw === null ||\n SkiaViewApi.makeImageSnapshot === null\n ) {\n throw Error(\"Skia View Api was not found.\");\n }\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAKA;;;;;;;;AAGA,IAAIA,gBAAgB,GAAG,IAAvB;AAEA,MAAMC,cAAc,GAClB,IAAAC,mCAAA,EAA4C,cAA5C,CADF;;AAGO,MAAMC,QAAN,SAAuBC,cAAA,CAAMC,SAA7B,CAA0D;EAC/DC,WAAW,CAACC,KAAD,EAA2B;IACpC,MAAMA,KAAN;;IADoC;;IAEpC,KAAKC,SAAL,GAAiBR,gBAAgB,EAAjC;IACA,MAAM;MAAES;IAAF,IAAaF,KAAnB;;IACA,IAAIE,MAAJ,EAAY;MACVC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;EACF;;EAIkB,IAARI,QAAQ,GAAG;IACpB,OAAO,KAAKL,SAAZ;EACD;;EAEDM,kBAAkB,CAACC,SAAD,EAA+B;IAC/C,MAAM;MAAEN;IAAF,IAAa,KAAKF,KAAxB;;IACA,IAAIE,MAAM,KAAKM,SAAS,CAACN,MAAzB,EAAiC;MAC/BC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSO,iBAAiB,CAACC,IAAD,EAAgB;IACtCP,iBAAiB;IACjB,OAAOC,gBAAA,CAAYK,iBAAZ,CAA8B,KAAKR,SAAnC,EAA8CS,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdR,iBAAiB;;IACjBC,gBAAA,CAAYQ,aAAZ,CAA0B,KAAKX,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSY,cAAc,CAACC,MAAD,EAA2C;IAC9DX,iBAAiB;IACjB,OAAOC,gBAAA,CAAYW,oBAAZ,CAAiC,KAAKd,SAAtC,EAAiDa,MAAjD,CAAP;EACD;;EAEDE,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuB,GAAGC;IAA1B,IAAwC,KAAKnB,KAAnD;IACA,oBACE,6BAAC,cAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEgB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAhE8D;;;;AAmEjE,MAAMhB,iBAAiB,GAAG,MAAM;EAC9B,IACEC,gBAAA,KAAgB,IAAhB,IACAA,gBAAA,CAAYC,cAAZ,KAA+B,IAD/B,IAEAD,gBAAA,CAAYgB,aAAZ,KAA8B,IAF9B,IAGAhB,gBAAA,CAAYW,oBAAZ,KAAqC,IAHrC,IAIAX,gBAAA,CAAYQ,aAAZ,KAA8B,IAJ9B,IAKAR,gBAAA,CAAYK,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMY,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}