@shopify/react-native-skia 0.1.188 → 0.1.190
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.
- package/cpp/api/JsiSkMatrix.h +6 -6
- package/ios/RNSkia-iOS/ViewScreenshotService.mm +13 -1
- package/jestSetup.js +17 -3
- package/lib/commonjs/Platform/IPlatform.d.ts +12 -0
- package/lib/commonjs/Platform/IPlatform.js +6 -0
- package/lib/commonjs/Platform/IPlatform.js.map +1 -0
- package/lib/commonjs/Platform/Platform.d.ts +2 -0
- package/lib/commonjs/Platform/Platform.js +24 -0
- package/lib/commonjs/Platform/Platform.js.map +1 -0
- package/lib/commonjs/Platform/Platform.web.d.ts +2 -0
- package/lib/commonjs/Platform/Platform.web.js +157 -0
- package/lib/commonjs/Platform/Platform.web.js.map +1 -0
- package/lib/commonjs/Platform/index.d.ts +1 -0
- package/lib/commonjs/Platform/index.js +19 -0
- package/lib/commonjs/Platform/index.js.map +1 -0
- package/lib/commonjs/skia/NativeSetup.js +3 -3
- package/lib/commonjs/skia/NativeSetup.js.map +1 -1
- package/lib/commonjs/skia/core/Data.js +2 -8
- package/lib/commonjs/skia/core/Data.js.map +1 -1
- package/lib/commonjs/skia/core/Image.js +3 -3
- package/lib/commonjs/skia/core/Image.js.map +1 -1
- package/lib/commonjs/skia/types/Matrix.d.ts +6 -6
- package/lib/commonjs/skia/types/Matrix.js.map +1 -1
- package/lib/commonjs/skia/web/JsiSkMatrix.d.ts +6 -6
- package/lib/commonjs/skia/web/JsiSkMatrix.js +6 -0
- package/lib/commonjs/skia/web/JsiSkMatrix.js.map +1 -1
- package/lib/commonjs/views/SkiaBaseWebView.d.ts +6 -1
- package/lib/commonjs/views/SkiaBaseWebView.js +32 -25
- package/lib/commonjs/views/SkiaBaseWebView.js.map +1 -1
- package/lib/commonjs/views/SkiaDomView.js +2 -2
- package/lib/commonjs/views/SkiaDomView.js.map +1 -1
- package/lib/commonjs/views/SkiaPictureView.js +2 -2
- package/lib/commonjs/views/SkiaPictureView.js.map +1 -1
- package/lib/commonjs/views/SkiaView.js +3 -2
- package/lib/commonjs/views/SkiaView.js.map +1 -1
- package/lib/commonjs/views/useTouchHandler.js +3 -3
- package/lib/commonjs/views/useTouchHandler.js.map +1 -1
- package/lib/commonjs/web/WithSkiaWeb.js +2 -2
- package/lib/commonjs/web/WithSkiaWeb.js.map +1 -1
- package/lib/module/Platform/IPlatform.d.ts +12 -0
- package/lib/module/Platform/IPlatform.js +2 -0
- package/lib/module/Platform/IPlatform.js.map +1 -0
- package/lib/module/Platform/Platform.d.ts +2 -0
- package/lib/module/Platform/Platform.js +14 -0
- package/lib/module/Platform/Platform.js.map +1 -0
- package/lib/module/Platform/Platform.web.d.ts +2 -0
- package/lib/module/Platform/Platform.web.js +143 -0
- package/lib/module/Platform/Platform.web.js.map +1 -0
- package/lib/module/Platform/index.d.ts +1 -0
- package/lib/module/Platform/index.js +2 -0
- package/lib/module/Platform/index.js.map +1 -0
- package/lib/module/skia/NativeSetup.js +2 -2
- package/lib/module/skia/NativeSetup.js.map +1 -1
- package/lib/module/skia/core/Data.js +2 -7
- package/lib/module/skia/core/Data.js.map +1 -1
- package/lib/module/skia/core/Image.js +2 -2
- package/lib/module/skia/core/Image.js.map +1 -1
- package/lib/module/skia/types/Matrix.d.ts +6 -6
- package/lib/module/skia/types/Matrix.js.map +1 -1
- package/lib/module/skia/web/JsiSkMatrix.d.ts +6 -6
- package/lib/module/skia/web/JsiSkMatrix.js +6 -0
- package/lib/module/skia/web/JsiSkMatrix.js.map +1 -1
- package/lib/module/views/SkiaBaseWebView.d.ts +6 -1
- package/lib/module/views/SkiaBaseWebView.js +31 -24
- package/lib/module/views/SkiaBaseWebView.js.map +1 -1
- package/lib/module/views/SkiaDomView.js +2 -2
- package/lib/module/views/SkiaDomView.js.map +1 -1
- package/lib/module/views/SkiaPictureView.js +2 -2
- package/lib/module/views/SkiaPictureView.js.map +1 -1
- package/lib/module/views/SkiaView.js +2 -2
- package/lib/module/views/SkiaView.js.map +1 -1
- package/lib/module/views/useTouchHandler.js +3 -3
- package/lib/module/views/useTouchHandler.js.map +1 -1
- package/lib/module/web/WithSkiaWeb.js +1 -1
- package/lib/module/web/WithSkiaWeb.js.map +1 -1
- package/lib/typescript/src/Platform/IPlatform.d.ts +12 -0
- package/lib/typescript/src/Platform/Platform.d.ts +2 -0
- package/lib/typescript/src/Platform/Platform.web.d.ts +2 -0
- package/lib/typescript/src/Platform/index.d.ts +1 -0
- package/lib/typescript/src/skia/types/Matrix.d.ts +6 -6
- package/lib/typescript/src/skia/web/JsiSkMatrix.d.ts +6 -6
- package/lib/typescript/src/views/SkiaBaseWebView.d.ts +6 -1
- package/package.json +9 -9
- package/src/Platform/IPlatform.ts +20 -0
- package/src/Platform/Platform.ts +28 -0
- package/src/Platform/Platform.web.tsx +136 -0
- package/src/Platform/index.ts +1 -0
- package/src/skia/NativeSetup.ts +2 -2
- package/src/skia/core/Data.ts +4 -15
- package/src/skia/core/Image.ts +2 -3
- package/src/skia/types/Matrix.ts +6 -6
- package/src/skia/web/JsiSkMatrix.ts +6 -0
- package/src/views/SkiaBaseWebView.tsx +24 -19
- package/src/views/SkiaDomView.tsx +2 -2
- package/src/views/SkiaPictureView.tsx +2 -2
- package/src/views/SkiaView.tsx +2 -2
- package/src/views/useTouchHandler.ts +3 -3
- package/src/web/WithSkiaWeb.tsx +2 -1
|
@@ -7,10 +7,10 @@ exports.SkiaBaseWebView = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
|
-
var _reactNative = require("react-native");
|
|
11
|
-
|
|
12
10
|
var _JsiSkSurface = require("../skia/web/JsiSkSurface");
|
|
13
11
|
|
|
12
|
+
var _Platform = require("../Platform");
|
|
13
|
+
|
|
14
14
|
var _types = require("./types");
|
|
15
15
|
|
|
16
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -19,7 +19,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
|
|
|
19
19
|
|
|
20
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
21
|
|
|
22
|
-
const pd =
|
|
22
|
+
const pd = _Platform.Platform.PixelRatio;
|
|
23
23
|
|
|
24
24
|
class SkiaBaseWebView extends _react.default.Component {
|
|
25
25
|
constructor(props) {
|
|
@@ -45,6 +45,16 @@ class SkiaBaseWebView extends _react.default.Component {
|
|
|
45
45
|
|
|
46
46
|
_defineProperty(this, "height", 0);
|
|
47
47
|
|
|
48
|
+
_defineProperty(this, "onStart", this.createTouchHandler(_types.TouchType.Start));
|
|
49
|
+
|
|
50
|
+
_defineProperty(this, "onActive", this.createTouchHandler(_types.TouchType.Active));
|
|
51
|
+
|
|
52
|
+
_defineProperty(this, "onCancel", this.createTouchHandler(_types.TouchType.Cancelled));
|
|
53
|
+
|
|
54
|
+
_defineProperty(this, "onEnd", this.createTouchHandler(_types.TouchType.End));
|
|
55
|
+
|
|
56
|
+
_defineProperty(this, "onLayout", this.onLayoutEvent.bind(this));
|
|
57
|
+
|
|
48
58
|
this._mode = props.mode ?? "default";
|
|
49
59
|
}
|
|
50
60
|
|
|
@@ -54,22 +64,19 @@ class SkiaBaseWebView extends _react.default.Component {
|
|
|
54
64
|
this._unsubscriptions = [];
|
|
55
65
|
}
|
|
56
66
|
|
|
57
|
-
|
|
67
|
+
onLayoutEvent(evt) {
|
|
58
68
|
const {
|
|
59
69
|
CanvasKit
|
|
60
|
-
} = global;
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
const
|
|
70
|
-
canvas.width = width * pd;
|
|
71
|
-
canvas.height = height * pd;
|
|
72
|
-
const surface = CanvasKit.MakeWebGLCanvasSurface(this._canvasRef.current);
|
|
70
|
+
} = global; // Reset canvas / surface on layout change
|
|
71
|
+
|
|
72
|
+
const canvas = this._canvasRef.current;
|
|
73
|
+
|
|
74
|
+
if (canvas) {
|
|
75
|
+
this.width = canvas.clientWidth;
|
|
76
|
+
this.height = canvas.clientHeight;
|
|
77
|
+
canvas.width = this.width * pd;
|
|
78
|
+
canvas.height = this.height * pd;
|
|
79
|
+
const surface = CanvasKit.MakeWebGLCanvasSurface(canvas);
|
|
73
80
|
|
|
74
81
|
if (!surface) {
|
|
75
82
|
throw new Error("Could not create surface");
|
|
@@ -215,20 +222,20 @@ class SkiaBaseWebView extends _react.default.Component {
|
|
|
215
222
|
debug = false,
|
|
216
223
|
...viewProps
|
|
217
224
|
} = this.props;
|
|
218
|
-
return /*#__PURE__*/_react.default.createElement(
|
|
219
|
-
onLayout: this.onLayout
|
|
225
|
+
return /*#__PURE__*/_react.default.createElement(_Platform.Platform.View, _extends({}, viewProps, {
|
|
226
|
+
onLayout: this.onLayout
|
|
220
227
|
}), /*#__PURE__*/_react.default.createElement("canvas", {
|
|
221
228
|
ref: this._canvasRef,
|
|
222
229
|
style: {
|
|
223
230
|
display: "flex",
|
|
224
231
|
flex: 1
|
|
225
232
|
},
|
|
226
|
-
onPointerDown: this.
|
|
227
|
-
onPointerMove: this.
|
|
228
|
-
onPointerUp: this.
|
|
229
|
-
onPointerCancel: this.
|
|
230
|
-
onPointerLeave: this.
|
|
231
|
-
onPointerOut: this.
|
|
233
|
+
onPointerDown: this.onStart,
|
|
234
|
+
onPointerMove: this.onActive,
|
|
235
|
+
onPointerUp: this.onEnd,
|
|
236
|
+
onPointerCancel: this.onCancel,
|
|
237
|
+
onPointerLeave: this.onEnd,
|
|
238
|
+
onPointerOut: this.onEnd
|
|
232
239
|
}));
|
|
233
240
|
}
|
|
234
241
|
|
|
@@ -1 +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","surface","MakeWebGLCanvasSurface","Error","_surface","JsiSkSurface","_canvas","getCanvas","redraw","getSize","componentDidMount","tick","componentDidUpdate","componentWillUnmount","cancelAnimationFrame","requestId","getContext","getExtension","loseContext","makeImageSnapshot","rect","clear","TRANSPARENT","renderInCanvas","ref","flush","_redrawRequests","touches","_touches","Float32Array","of","save","scale","restore","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 = width * pd;\n canvas.height = height * 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 // Call onLayout callback if it exists\n if (this.props.onLayout) {\n this.props.onLayout(evt);\n }\n }\n\n protected getSize() {\n return { width: this.width, height: this.height };\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 // https://developer.mozilla.org/en-US/docs/Web/API/WEBGL_lose_context\n this._canvasRef.current\n ?.getContext(\"webgl2\")\n ?.getExtension(\"WEBGL_lose_context\")\n ?.loseContext();\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 this._canvas!.clear(CanvasKit.TRANSPARENT);\n this.renderInCanvas(this._canvas!, []);\n this._surface?.ref.flush();\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 const canvas = this._canvas!;\n canvas.clear(Float32Array.of(0, 0, 0, 0));\n canvas.save();\n canvas.scale(pd, pd);\n this.renderInCanvas(canvas, touches);\n canvas.restore();\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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"}
|
|
1
|
+
{"version":3,"names":["pd","Platform","PixelRatio","SkiaBaseWebView","React","Component","constructor","props","createRef","createTouchHandler","TouchType","Start","Active","Cancelled","End","onLayoutEvent","bind","_mode","mode","unsubscribeAll","_unsubscriptions","forEach","u","evt","CanvasKit","global","canvas","_canvasRef","current","width","clientWidth","height","clientHeight","surface","MakeWebGLCanvasSurface","Error","_surface","JsiSkSurface","_canvas","getCanvas","redraw","onLayout","getSize","componentDidMount","tick","componentDidUpdate","componentWillUnmount","cancelAnimationFrame","requestId","getContext","getExtension","loseContext","makeImageSnapshot","rect","clear","TRANSPARENT","renderInCanvas","ref","flush","_redrawRequests","touches","_touches","Float32Array","of","save","scale","restore","requestAnimationFrame","setDrawMode","registerValues","_values","v","push","addListener","handleTouchEvent","touchType","id","pointerId","x","clientX","currentTarget","getClientRects","left","y","clientY","top","force","pressure","type","timestamp","Date","now","render","debug","viewProps","display","flex","onStart","onActive","onEnd","onCancel"],"sources":["SkiaBaseWebView.tsx"],"sourcesContent":["/* global HTMLCanvasElement */\nimport React from \"react\";\nimport type { PointerEvent } from \"react\";\nimport type { LayoutChangeEvent } from \"react-native\";\n\nimport type { SkRect, SkCanvas } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\nimport { JsiSkSurface } from \"../skia/web/JsiSkSurface\";\nimport { Platform } from \"../Platform\";\n\nimport type { DrawMode, SkiaBaseViewProps, TouchInfo } from \"./types\";\nimport { TouchType } from \"./types\";\n\nconst pd = Platform.PixelRatio;\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 onLayoutEvent(evt: LayoutChangeEvent) {\n const { CanvasKit } = global;\n // Reset canvas / surface on layout change\n const canvas = this._canvasRef.current;\n if (canvas) {\n this.width = canvas.clientWidth;\n this.height = canvas.clientHeight;\n canvas.width = this.width * pd;\n canvas.height = this.height * pd;\n const surface = CanvasKit.MakeWebGLCanvasSurface(canvas);\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 // Call onLayout callback if it exists\n if (this.props.onLayout) {\n this.props.onLayout(evt);\n }\n }\n\n protected getSize() {\n return { width: this.width, height: this.height };\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 // https://developer.mozilla.org/en-US/docs/Web/API/WEBGL_lose_context\n this._canvasRef.current\n ?.getContext(\"webgl2\")\n ?.getExtension(\"WEBGL_lose_context\")\n ?.loseContext();\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 this._canvas!.clear(CanvasKit.TRANSPARENT);\n this.renderInCanvas(this._canvas!, []);\n this._surface?.ref.flush();\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 const canvas = this._canvas!;\n canvas.clear(Float32Array.of(0, 0, 0, 0));\n canvas.save();\n canvas.scale(pd, pd);\n this.renderInCanvas(canvas, touches);\n canvas.restore();\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 private onStart = this.createTouchHandler(TouchType.Start);\n private onActive = this.createTouchHandler(TouchType.Active);\n private onCancel = this.createTouchHandler(TouchType.Cancelled);\n private onEnd = this.createTouchHandler(TouchType.End);\n private onLayout = this.onLayoutEvent.bind(this);\n\n render() {\n const { mode, debug = false, ...viewProps } = this.props;\n return (\n <Platform.View {...viewProps} onLayout={this.onLayout}>\n <canvas\n ref={this._canvasRef}\n style={{ display: \"flex\", flex: 1 }}\n onPointerDown={this.onStart}\n onPointerMove={this.onActive}\n onPointerUp={this.onEnd}\n onPointerCancel={this.onCancel}\n onPointerLeave={this.onEnd}\n onPointerOut={this.onEnd}\n />\n </Platform.View>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -7,7 +7,7 @@ exports.SkiaDomView = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _Platform = require("../Platform");
|
|
11
11
|
|
|
12
12
|
var _api = require("./api");
|
|
13
13
|
|
|
@@ -19,7 +19,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
|
|
|
19
19
|
|
|
20
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
21
|
|
|
22
|
-
const NativeSkiaDomView =
|
|
22
|
+
const NativeSkiaDomView = _Platform.Platform.OS !== "web" ? _Platform.Platform.requireNativeComponent("SkiaDomView") : // eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
23
23
|
null;
|
|
24
24
|
|
|
25
25
|
class SkiaDomView extends _react.default.Component {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["NativeSkiaDomView","Platform","OS","requireNativeComponent","SkiaDomView","React","Component","constructor","props","_nativeId","SkiaViewNativeId","current","root","onTouch","onSize","assertSkiaViewApi","SkiaViewApi","setJsiProperty","nativeId","componentDidUpdate","prevProps","makeImageSnapshot","rect","redraw","requestRedraw","registerValues","values","registerValuesInView","componentWillUnmount","render","mode","debug","viewProps","callJsiMethod","Error"],"sources":["SkiaDomView.tsx"],"sourcesContent":["import React from \"react\";\nimport {
|
|
1
|
+
{"version":3,"names":["NativeSkiaDomView","Platform","OS","requireNativeComponent","SkiaDomView","React","Component","constructor","props","_nativeId","SkiaViewNativeId","current","root","onTouch","onSize","assertSkiaViewApi","SkiaViewApi","setJsiProperty","nativeId","componentDidUpdate","prevProps","makeImageSnapshot","rect","redraw","requestRedraw","registerValues","values","registerValuesInView","componentWillUnmount","render","mode","debug","viewProps","callJsiMethod","Error"],"sources":["SkiaDomView.tsx"],"sourcesContent":["import React from \"react\";\nimport type { HostComponent } from \"react-native\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\nimport { Platform } from \"../Platform\";\n\nimport { SkiaViewApi } from \"./api\";\nimport { SkiaViewNativeId } from \"./SkiaView\";\nimport type { NativeSkiaViewProps, SkiaDomViewProps } from \"./types\";\n\nconst NativeSkiaDomView: HostComponent<SkiaDomViewProps> =\n Platform.OS !== \"web\"\n ? Platform.requireNativeComponent<NativeSkiaViewProps>(\"SkiaDomView\")\n : // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (null as any);\n\nexport class SkiaDomView extends React.Component<SkiaDomViewProps> {\n constructor(props: SkiaDomViewProps) {\n super(props);\n this._nativeId = SkiaViewNativeId.current++;\n const { root, onTouch, onSize } = props;\n if (root) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"root\", root);\n }\n if (onTouch) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"onTouch\", onTouch);\n }\n if (onSize) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n }\n }\n\n private _nativeId: number;\n\n public get nativeId() {\n return this._nativeId;\n }\n\n componentDidUpdate(prevProps: SkiaDomViewProps) {\n const { root, onTouch, onSize } = this.props;\n if (root !== prevProps.root) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"root\", root);\n }\n if (onTouch !== prevProps.onTouch) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"onTouch\", onTouch);\n }\n if (onSize !== prevProps.onSize) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\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 /**\n * Clear up the dom node when unmounting to release resources.\n */\n componentWillUnmount(): void {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"root\", null);\n }\n\n render() {\n const { mode, debug = false, ...viewProps } = this.props;\n return (\n <NativeSkiaDomView\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;;AAKA;;AAEA;;AACA;;;;;;;;AAGA,MAAMA,iBAAkD,GACtDC,kBAAA,CAASC,EAAT,KAAgB,KAAhB,GACID,kBAAA,CAASE,sBAAT,CAAqD,aAArD,CADJ,GAEI;AACC,IAJP;;AAMO,MAAMC,WAAN,SAA0BC,cAAA,CAAMC,SAAhC,CAA4D;EACjEC,WAAW,CAACC,KAAD,EAA0B;IACnC,MAAMA,KAAN;;IADmC;;IAEnC,KAAKC,SAAL,GAAiBC,0BAAA,CAAiBC,OAAjB,EAAjB;IACA,MAAM;MAAEC,IAAF;MAAQC,OAAR;MAAiBC;IAAjB,IAA4BN,KAAlC;;IACA,IAAII,IAAJ,EAAU;MACRG,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,MAA3C,EAAmDG,IAAnD;IACD;;IACD,IAAIC,OAAJ,EAAa;MACXE,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,SAA3C,EAAsDI,OAAtD;IACD;;IACD,IAAIC,MAAJ,EAAY;MACVC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,QAA3C,EAAqDK,MAArD;IACD;EACF;;EAIkB,IAARI,QAAQ,GAAG;IACpB,OAAO,KAAKT,SAAZ;EACD;;EAEDU,kBAAkB,CAACC,SAAD,EAA8B;IAC9C,MAAM;MAAER,IAAF;MAAQC,OAAR;MAAiBC;IAAjB,IAA4B,KAAKN,KAAvC;;IACA,IAAII,IAAI,KAAKQ,SAAS,CAACR,IAAvB,EAA6B;MAC3BG,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,MAA3C,EAAmDG,IAAnD;IACD;;IACD,IAAIC,OAAO,KAAKO,SAAS,CAACP,OAA1B,EAAmC;MACjCE,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,SAA3C,EAAsDI,OAAtD;IACD;;IACD,IAAIC,MAAM,KAAKM,SAAS,CAACN,MAAzB,EAAiC;MAC/BC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,QAA3C,EAAqDK,MAArD;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSO,iBAAiB,CAACC,IAAD,EAAgB;IACtCP,iBAAiB;IACjB,OAAOC,gBAAA,CAAYK,iBAAZ,CAA8B,KAAKZ,SAAnC,EAA8Ca,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdR,iBAAiB;;IACjBC,gBAAA,CAAYQ,aAAZ,CAA0B,KAAKf,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSgB,cAAc,CAACC,MAAD,EAA2C;IAC9DX,iBAAiB;IACjB,OAAOC,gBAAA,CAAYW,oBAAZ,CAAiC,KAAKlB,SAAtC,EAAiDiB,MAAjD,CAAP;EACD;EAED;AACF;AACA;;;EACEE,oBAAoB,GAAS;IAC3Bb,iBAAiB;;IACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,MAA3C,EAAmD,IAAnD;EACD;;EAEDoB,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuB,GAAGC;IAA1B,IAAwC,KAAKxB,KAAnD;IACA,oBACE,6BAAC,iBAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEqB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAxFgE;;;;AA2FnE,MAAMjB,iBAAiB,GAAG,MAAM;EAC9B,IACEC,gBAAA,KAAgB,IAAhB,IACAA,gBAAA,CAAYC,cAAZ,KAA+B,IAD/B,IAEAD,gBAAA,CAAYiB,aAAZ,KAA8B,IAF9B,IAGAjB,gBAAA,CAAYW,oBAAZ,KAAqC,IAHrC,IAIAX,gBAAA,CAAYQ,aAAZ,KAA8B,IAJ9B,IAKAR,gBAAA,CAAYK,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMa,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}
|
|
@@ -7,7 +7,7 @@ exports.SkiaPictureView = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _Platform = require("../Platform");
|
|
11
11
|
|
|
12
12
|
var _api = require("./api");
|
|
13
13
|
|
|
@@ -19,7 +19,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
|
|
|
19
19
|
|
|
20
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
21
|
|
|
22
|
-
const NativeSkiaPictureView =
|
|
22
|
+
const NativeSkiaPictureView = _Platform.Platform.requireNativeComponent("SkiaPictureView");
|
|
23
23
|
|
|
24
24
|
class SkiaPictureView extends _react.default.Component {
|
|
25
25
|
constructor(props) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["NativeSkiaPictureView","requireNativeComponent","SkiaPictureView","React","Component","constructor","props","_nativeId","SkiaViewNativeId","current","picture","onSize","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 {
|
|
1
|
+
{"version":3,"names":["NativeSkiaPictureView","Platform","requireNativeComponent","SkiaPictureView","React","Component","constructor","props","_nativeId","SkiaViewNativeId","current","picture","onSize","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\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\nimport { Platform } from \"../Platform\";\n\nimport { SkiaViewApi } from \"./api\";\nimport { SkiaViewNativeId } from \"./SkiaView\";\nimport type { NativeSkiaViewProps, SkiaPictureViewProps } from \"./types\";\n\nconst NativeSkiaPictureView =\n Platform.requireNativeComponent<NativeSkiaViewProps>(\"SkiaPictureView\");\n\nexport class SkiaPictureView extends React.Component<SkiaPictureViewProps> {\n constructor(props: SkiaPictureViewProps) {\n super(props);\n this._nativeId = SkiaViewNativeId.current++;\n const { picture, onSize } = props;\n if (picture) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"picture\", picture);\n }\n if (onSize) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\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, onSize } = this.props;\n if (picture !== prevProps.picture) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"picture\", picture);\n }\n if (onSize !== prevProps.onSize) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\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;;AAIA;;AAEA;;AACA;;;;;;;;AAGA,MAAMA,qBAAqB,GACzBC,kBAAA,CAASC,sBAAT,CAAqD,iBAArD,CADF;;AAGO,MAAMC,eAAN,SAA8BC,cAAA,CAAMC,SAApC,CAAoE;EACzEC,WAAW,CAACC,KAAD,EAA8B;IACvC,MAAMA,KAAN;;IADuC;;IAEvC,KAAKC,SAAL,GAAiBC,0BAAA,CAAiBC,OAAjB,EAAjB;IACA,MAAM;MAAEC,OAAF;MAAWC;IAAX,IAAsBL,KAA5B;;IACA,IAAII,OAAJ,EAAa;MACXE,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKP,SAAhC,EAA2C,SAA3C,EAAsDG,OAAtD;IACD;;IACD,IAAIC,MAAJ,EAAY;MACVC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKP,SAAhC,EAA2C,QAA3C,EAAqDI,MAArD;IACD;EACF;;EAIkB,IAARI,QAAQ,GAAG;IACpB,OAAO,KAAKR,SAAZ;EACD;;EAEDS,kBAAkB,CAACC,SAAD,EAAkC;IAClD,MAAM;MAAEP,OAAF;MAAWC;IAAX,IAAsB,KAAKL,KAAjC;;IACA,IAAII,OAAO,KAAKO,SAAS,CAACP,OAA1B,EAAmC;MACjCE,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKP,SAAhC,EAA2C,SAA3C,EAAsDG,OAAtD;IACD;;IACD,IAAIC,MAAM,KAAKM,SAAS,CAACN,MAAzB,EAAiC;MAC/BC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKP,SAAhC,EAA2C,QAA3C,EAAqDI,MAArD;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSO,iBAAiB,CAACC,IAAD,EAAgB;IACtCP,iBAAiB;IACjB,OAAOC,gBAAA,CAAYK,iBAAZ,CAA8B,KAAKX,SAAnC,EAA8CY,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdR,iBAAiB;;IACjBC,gBAAA,CAAYQ,aAAZ,CAA0B,KAAKd,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSe,cAAc,CAACC,MAAD,EAA2C;IAC9DX,iBAAiB;IACjB,OAAOC,gBAAA,CAAYW,oBAAZ,CAAiC,KAAKjB,SAAtC,EAAiDgB,MAAjD,CAAP;EACD;;EAEDE,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuB,GAAGC;IAA1B,IAAwC,KAAKtB,KAAnD;IACA,oBACE,6BAAC,qBAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEmB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAxEwE;;;;AA2E3E,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"}
|
|
@@ -7,7 +7,7 @@ exports.SkiaViewNativeId = exports.SkiaView = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _Platform = require("../Platform");
|
|
11
11
|
|
|
12
12
|
var _api = require("./api");
|
|
13
13
|
|
|
@@ -21,7 +21,8 @@ const SkiaViewNativeId = {
|
|
|
21
21
|
current: 1000
|
|
22
22
|
};
|
|
23
23
|
exports.SkiaViewNativeId = SkiaViewNativeId;
|
|
24
|
-
|
|
24
|
+
|
|
25
|
+
const NativeSkiaView = _Platform.Platform.requireNativeComponent("SkiaDrawView");
|
|
25
26
|
|
|
26
27
|
class SkiaView extends _react.default.Component {
|
|
27
28
|
constructor(props) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["SkiaViewNativeId","current","NativeSkiaView","requireNativeComponent","SkiaView","React","Component","constructor","props","_nativeId","onDraw","onSize","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 {
|
|
1
|
+
{"version":3,"names":["SkiaViewNativeId","current","NativeSkiaView","Platform","requireNativeComponent","SkiaView","React","Component","constructor","props","_nativeId","onDraw","onSize","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\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\nimport { Platform } from \"../Platform\";\n\nimport { SkiaViewApi } from \"./api\";\nimport type { NativeSkiaViewProps, SkiaDrawViewProps } from \"./types\";\n\nexport const SkiaViewNativeId = { current: 1000 };\n\nconst NativeSkiaView =\n Platform.requireNativeComponent<NativeSkiaViewProps>(\"SkiaDrawView\");\n\nexport class SkiaView extends React.Component<SkiaDrawViewProps> {\n constructor(props: SkiaDrawViewProps) {\n super(props);\n this._nativeId = SkiaViewNativeId.current++;\n const { onDraw, onSize } = props;\n if (onDraw) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"drawCallback\", onDraw);\n }\n if (onSize) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\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, onSize } = this.props;\n if (onDraw !== prevProps.onDraw) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"drawCallback\", onDraw);\n }\n if (onSize !== prevProps.onSize) {\n assertSkiaViewApi();\n SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\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, onSize, ...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;;AAIA;;AAEA;;;;;;;;AAGO,MAAMA,gBAAgB,GAAG;EAAEC,OAAO,EAAE;AAAX,CAAzB;;;AAEP,MAAMC,cAAc,GAClBC,kBAAA,CAASC,sBAAT,CAAqD,cAArD,CADF;;AAGO,MAAMC,QAAN,SAAuBC,cAAA,CAAMC,SAA7B,CAA0D;EAC/DC,WAAW,CAACC,KAAD,EAA2B;IACpC,MAAMA,KAAN;;IADoC;;IAEpC,KAAKC,SAAL,GAAiBV,gBAAgB,CAACC,OAAjB,EAAjB;IACA,MAAM;MAAEU,MAAF;MAAUC;IAAV,IAAqBH,KAA3B;;IACA,IAAIE,MAAJ,EAAY;MACVE,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;;IACD,IAAIC,MAAJ,EAAY;MACVC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,QAA3C,EAAqDE,MAArD;IACD;EACF;;EAIkB,IAARI,QAAQ,GAAG;IACpB,OAAO,KAAKN,SAAZ;EACD;;EAEDO,kBAAkB,CAACC,SAAD,EAA+B;IAC/C,MAAM;MAAEP,MAAF;MAAUC;IAAV,IAAqB,KAAKH,KAAhC;;IACA,IAAIE,MAAM,KAAKO,SAAS,CAACP,MAAzB,EAAiC;MAC/BE,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;;IACD,IAAIC,MAAM,KAAKM,SAAS,CAACN,MAAzB,EAAiC;MAC/BC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,QAA3C,EAAqDE,MAArD;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSO,iBAAiB,CAACC,IAAD,EAAgB;IACtCP,iBAAiB;IACjB,OAAOC,gBAAA,CAAYK,iBAAZ,CAA8B,KAAKT,SAAnC,EAA8CU,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdR,iBAAiB;;IACjBC,gBAAA,CAAYQ,aAAZ,CAA0B,KAAKZ,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSa,cAAc,CAACC,MAAD,EAA2C;IAC9DX,iBAAiB;IACjB,OAAOC,gBAAA,CAAYW,oBAAZ,CAAiC,KAAKf,SAAtC,EAAiDc,MAAjD,CAAP;EACD;;EAEDE,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuBhB,MAAvB;MAA+B,GAAGiB;IAAlC,IAAgD,KAAKpB,KAA3D;IACA,oBACE,6BAAC,cAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEiB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAxE8D;;;;AA2EjE,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"}
|
|
@@ -7,7 +7,7 @@ exports.useTouchHandler = exports.useMultiTouchHandler = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _react = require("react");
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _Platform = require("../Platform");
|
|
11
11
|
|
|
12
12
|
var _types = require("./types");
|
|
13
13
|
|
|
@@ -36,8 +36,8 @@ const useInternalTouchHandler = function (handlers) {
|
|
|
36
36
|
|
|
37
37
|
if (touch.type !== _types.TouchType.Start && touch.type !== _types.TouchType.End && touch.type !== _types.TouchType.Cancelled && timeDiffseconds > 0) {
|
|
38
38
|
prevVelocityRef.current[touch.id] = {
|
|
39
|
-
x: distX / timeDiffseconds /
|
|
40
|
-
y: distY / timeDiffseconds /
|
|
39
|
+
x: distX / timeDiffseconds / _Platform.Platform.PixelRatio,
|
|
40
|
+
y: distY / timeDiffseconds / _Platform.Platform.PixelRatio
|
|
41
41
|
};
|
|
42
42
|
}
|
|
43
43
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useInternalTouchHandler","handlers","deps","multiTouch","prevTouchInfoRef","useRef","prevVelocityRef","useCallback","history","forEach","touches","i","length","touch","prevTouch","current","id","timeDiffseconds","timestamp","distX","x","distY","y","type","TouchType","Start","End","Cancelled","
|
|
1
|
+
{"version":3,"names":["useInternalTouchHandler","handlers","deps","multiTouch","prevTouchInfoRef","useRef","prevVelocityRef","useCallback","history","forEach","touches","i","length","touch","prevTouch","current","id","timeDiffseconds","timestamp","distX","x","distY","y","type","TouchType","Start","End","Cancelled","Platform","PixelRatio","extendedTouchInfo","velocityX","velocityY","onStart","Active","onActive","onEnd","useTouchHandler","useMultiTouchHandler"],"sources":["useTouchHandler.ts"],"sourcesContent":["import type { DependencyList } from \"react\";\nimport { useCallback, useRef } from \"react\";\n\nimport type { Vector } from \"../skia/types\";\nimport { Platform } from \"../Platform\";\n\nimport type {\n ExtendedTouchInfo,\n TouchHandlers,\n TouchHandler,\n TouchInfo,\n} from \"./types\";\nimport { TouchType } from \"./types\";\n\nconst useInternalTouchHandler = (\n handlers: TouchHandlers,\n deps: DependencyList = [],\n multiTouch = false\n): TouchHandler => {\n const prevTouchInfoRef = useRef<{ [key: number]: TouchInfo | undefined }>({});\n const prevVelocityRef = useRef<{ [key: number]: Vector | undefined }>({});\n\n return useCallback((history: Array<Array<TouchInfo>>) => {\n // Process all items in the current touch history\n history.forEach((touches) => {\n // Enumerate touches\n for (let i = 0; i < touches.length; i++) {\n if (!multiTouch && i > 0) {\n break;\n }\n\n const touch = touches[i];\n const prevTouch = prevTouchInfoRef.current[touch.id];\n // Calculate the velocity from the previous touch.\n const timeDiffseconds =\n touch.timestamp -\n (prevTouchInfoRef.current[touch.id]?.timestamp ?? touch.timestamp);\n\n const distX = touch.x - (prevTouch?.x ?? touch.x);\n const distY = touch.y - (prevTouch?.y ?? touch.y);\n\n if (\n touch.type !== TouchType.Start &&\n touch.type !== TouchType.End &&\n touch.type !== TouchType.Cancelled &&\n timeDiffseconds > 0\n ) {\n prevVelocityRef.current[touch.id] = {\n x: distX / timeDiffseconds / Platform.PixelRatio,\n y: distY / timeDiffseconds / Platform.PixelRatio,\n };\n }\n\n const extendedTouchInfo: ExtendedTouchInfo = {\n ...touch,\n velocityX: prevVelocityRef.current[touch.id]?.x ?? 0,\n velocityY: prevVelocityRef.current[touch.id]?.y ?? 0,\n };\n\n // Save previous touch\n prevTouchInfoRef.current[touch.id] = touch;\n\n if (touch.type === TouchType.Start) {\n delete prevVelocityRef.current[touch.id];\n handlers.onStart && handlers.onStart(touch);\n } else if (touch.type === TouchType.Active) {\n handlers.onActive && handlers.onActive(extendedTouchInfo);\n } else {\n handlers.onEnd && handlers.onEnd(extendedTouchInfo);\n }\n }\n });\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, deps);\n};\n\n/**\n * Provides a callback for handling touch events in the Skia View.\n * This touch handler only handles single touches.\n * @param handlers Callbacks for the different touch states\n * @param deps optional Dependency array to update the handlers\n * @returns A function that can be used from within the onDraw callback to\n * update and handle touch events. Call it with the touches property from\n * the info object.\n */\nexport const useTouchHandler = (\n handlers: TouchHandlers,\n deps: DependencyList = []\n): TouchHandler => {\n return useInternalTouchHandler(handlers, deps, false);\n};\n\n/**\n * Provides a callback for handling touch events in the Skia View.\n * This touch handler handles multiple touches.\n * @param handlers Callbacks for the different touch states\n * @param deps optional Dependency array to update the handlers\n * @returns A function that can be used from within the onDraw callback to\n * update and handle touch events. Call it with the touches property from\n * the info object.\n */\nexport const useMultiTouchHandler = (\n handlers: TouchHandlers,\n deps: DependencyList = []\n): TouchHandler => {\n return useInternalTouchHandler(handlers, deps, true);\n};\n"],"mappings":"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"}
|
|
@@ -7,7 +7,7 @@ exports.WithSkiaWeb = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _Platform = require("../Platform");
|
|
11
11
|
|
|
12
12
|
var _LoadSkiaWeb = require("./LoadSkiaWeb");
|
|
13
13
|
|
|
@@ -24,7 +24,7 @@ const WithSkiaWeb = _ref => {
|
|
|
24
24
|
const Inner = (0, _react.useMemo)( // TODO: investigate
|
|
25
25
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
26
26
|
() => /*#__PURE__*/(0, _react.lazy)(async () => {
|
|
27
|
-
if (
|
|
27
|
+
if (_Platform.Platform.OS === "web") {
|
|
28
28
|
await (0, _LoadSkiaWeb.LoadSkiaWeb)(opts);
|
|
29
29
|
} else {
|
|
30
30
|
console.warn("<WithSkiaWeb /> is only necessary on web. Consider not using on native.");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["WithSkiaWeb","getComponent","fallback","opts","Inner","useMemo","lazy","Platform","OS","LoadSkiaWeb","console","warn"],"sources":["WithSkiaWeb.tsx"],"sourcesContent":["import type { ComponentProps, ComponentType } from \"react\";\nimport React, { useMemo, lazy, Suspense } from \"react\";\nimport { Platform } from \"
|
|
1
|
+
{"version":3,"names":["WithSkiaWeb","getComponent","fallback","opts","Inner","useMemo","lazy","Platform","OS","LoadSkiaWeb","console","warn"],"sources":["WithSkiaWeb.tsx"],"sourcesContent":["import type { ComponentProps, ComponentType } from \"react\";\nimport React, { useMemo, lazy, Suspense } from \"react\";\n\nimport { Platform } from \"../Platform\";\n\nimport { LoadSkiaWeb } from \"./LoadSkiaWeb\";\n\ninterface WithSkiaProps {\n fallback?: ComponentProps<typeof Suspense>[\"fallback\"];\n getComponent: () => Promise<{ default: ComponentType }>;\n opts?: Parameters<typeof LoadSkiaWeb>[0];\n}\n\nexport const WithSkiaWeb = ({\n getComponent,\n fallback,\n opts,\n}: WithSkiaProps) => {\n const Inner = useMemo(\n // TODO: investigate\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (): any =>\n lazy(async () => {\n if (Platform.OS === \"web\") {\n await LoadSkiaWeb(opts);\n } else {\n console.warn(\n \"<WithSkiaWeb /> is only necessary on web. Consider not using on native.\"\n );\n }\n return getComponent();\n }),\n [getComponent, opts]\n );\n return (\n <Suspense fallback={fallback ?? null}>\n <Inner />\n </Suspense>\n );\n};\n"],"mappings":";;;;;;;AACA;;AAEA;;AAEA;;;;;;AAQO,MAAMA,WAAW,GAAG,QAIN;EAAA,IAJO;IAC1BC,YAD0B;IAE1BC,QAF0B;IAG1BC;EAH0B,CAIP;EACnB,MAAMC,KAAK,GAAG,IAAAC,cAAA,GACZ;EACA;EACA,mBACE,IAAAC,WAAA,EAAK,YAAY;IACf,IAAIC,kBAAA,CAASC,EAAT,KAAgB,KAApB,EAA2B;MACzB,MAAM,IAAAC,wBAAA,EAAYN,IAAZ,CAAN;IACD,CAFD,MAEO;MACLO,OAAO,CAACC,IAAR,CACE,yEADF;IAGD;;IACD,OAAOV,YAAY,EAAnB;EACD,CATD,CAJU,EAcZ,CAACA,YAAD,EAAeE,IAAf,CAdY,CAAd;EAgBA,oBACE,6BAAC,eAAD;IAAU,QAAQ,EAAED,QAAQ,IAAI;EAAhC,gBACE,6BAAC,KAAD,OADF,CADF;AAKD,CA1BM"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { HostComponent, NodeHandle, ViewComponent } from "react-native";
|
|
3
|
+
import type { DataModule } from "../skia/types";
|
|
4
|
+
export interface IPlatform {
|
|
5
|
+
OS: string;
|
|
6
|
+
requireNativeComponent: <T>(viewName: string) => HostComponent<T>;
|
|
7
|
+
PixelRatio: number;
|
|
8
|
+
NativeModules: Record<string, any>;
|
|
9
|
+
findNodeHandle: (componentOrHandle: null | number | React.Component<any, any> | React.ComponentClass<any>) => null | NodeHandle;
|
|
10
|
+
resolveAsset: (source: DataModule) => string;
|
|
11
|
+
View: typeof ViewComponent;
|
|
12
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sources":["IPlatform.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type { HostComponent, NodeHandle, ViewComponent } from \"react-native\";\n\nimport type { DataModule } from \"../skia/types\";\n\nexport interface IPlatform {\n OS: string;\n requireNativeComponent: <T>(viewName: string) => HostComponent<T>;\n PixelRatio: number;\n NativeModules: Record<string, any>;\n findNodeHandle: (\n componentOrHandle:\n | null\n | number\n | React.Component<any, any>\n | React.ComponentClass<any>\n ) => null | NodeHandle;\n resolveAsset: (source: DataModule) => string;\n View: typeof ViewComponent;\n}\n"],"mappings":""}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { Image, PixelRatio, requireNativeComponent, Platform as RNPlatform, findNodeHandle, NativeModules, View } from "react-native";
|
|
2
|
+
import { isRNModule } from "../skia/types";
|
|
3
|
+
export const Platform = {
|
|
4
|
+
OS: RNPlatform.OS,
|
|
5
|
+
PixelRatio: PixelRatio.get(),
|
|
6
|
+
requireNativeComponent,
|
|
7
|
+
resolveAsset: source => {
|
|
8
|
+
return isRNModule(source) ? Image.resolveAssetSource(source).uri : source.default;
|
|
9
|
+
},
|
|
10
|
+
findNodeHandle,
|
|
11
|
+
NativeModules,
|
|
12
|
+
View
|
|
13
|
+
};
|
|
14
|
+
//# sourceMappingURL=Platform.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Image","PixelRatio","requireNativeComponent","Platform","RNPlatform","findNodeHandle","NativeModules","View","isRNModule","OS","get","resolveAsset","source","resolveAssetSource","uri","default"],"sources":["Platform.ts"],"sourcesContent":["import {\n Image,\n PixelRatio,\n requireNativeComponent,\n Platform as RNPlatform,\n findNodeHandle,\n NativeModules,\n View,\n} from \"react-native\";\n\nimport type { DataModule } from \"../skia/types\";\nimport { isRNModule } from \"../skia/types\";\n\nimport type { IPlatform } from \"./IPlatform\";\n\nexport const Platform: IPlatform = {\n OS: RNPlatform.OS,\n PixelRatio: PixelRatio.get(),\n requireNativeComponent,\n resolveAsset: (source: DataModule) => {\n return isRNModule(source)\n ? Image.resolveAssetSource(source).uri\n : source.default;\n },\n findNodeHandle,\n NativeModules,\n View,\n};\n"],"mappings":"AAAA,SACEA,KADF,EAEEC,UAFF,EAGEC,sBAHF,EAIEC,QAAQ,IAAIC,UAJd,EAKEC,cALF,EAMEC,aANF,EAOEC,IAPF,QAQO,cARP;AAWA,SAASC,UAAT,QAA2B,eAA3B;AAIA,OAAO,MAAML,QAAmB,GAAG;EACjCM,EAAE,EAAEL,UAAU,CAACK,EADkB;EAEjCR,UAAU,EAAEA,UAAU,CAACS,GAAX,EAFqB;EAGjCR,sBAHiC;EAIjCS,YAAY,EAAGC,MAAD,IAAwB;IACpC,OAAOJ,UAAU,CAACI,MAAD,CAAV,GACHZ,KAAK,CAACa,kBAAN,CAAyBD,MAAzB,EAAiCE,GAD9B,GAEHF,MAAM,CAACG,OAFX;EAGD,CARgC;EASjCV,cATiC;EAUjCC,aAViC;EAWjCC;AAXiC,CAA5B"}
|
|
@@ -0,0 +1,143 @@
|
|
|
1
|
+
import React, { useLayoutEffect, useMemo, useRef } from "react";
|
|
2
|
+
import { isRNModule } from "../skia/types";
|
|
3
|
+
// eslint-disable-next-line max-len
|
|
4
|
+
// https://github.com/necolas/react-native-web/blob/master/packages/react-native-web/src/modules/useElementLayout/index.js
|
|
5
|
+
const DOM_LAYOUT_HANDLER_NAME = "__reactLayoutHandler";
|
|
6
|
+
let resizeObserver = null;
|
|
7
|
+
|
|
8
|
+
const getObserver = () => {
|
|
9
|
+
if (resizeObserver == null) {
|
|
10
|
+
resizeObserver = new window.ResizeObserver(function (entries) {
|
|
11
|
+
entries.forEach(entry => {
|
|
12
|
+
const node = entry.target;
|
|
13
|
+
const {
|
|
14
|
+
left,
|
|
15
|
+
top,
|
|
16
|
+
width,
|
|
17
|
+
height
|
|
18
|
+
} = entry.contentRect;
|
|
19
|
+
const onLayout = node[DOM_LAYOUT_HANDLER_NAME];
|
|
20
|
+
|
|
21
|
+
if (typeof onLayout === "function") {
|
|
22
|
+
// setTimeout 0 is taken from react-native-web (UIManager)
|
|
23
|
+
setTimeout(() => onLayout({
|
|
24
|
+
timeStamp: Date.now(),
|
|
25
|
+
nativeEvent: {
|
|
26
|
+
layout: {
|
|
27
|
+
x: left,
|
|
28
|
+
y: top,
|
|
29
|
+
width,
|
|
30
|
+
height
|
|
31
|
+
}
|
|
32
|
+
},
|
|
33
|
+
currentTarget: 0,
|
|
34
|
+
target: 0,
|
|
35
|
+
bubbles: false,
|
|
36
|
+
cancelable: false,
|
|
37
|
+
defaultPrevented: false,
|
|
38
|
+
eventPhase: 0,
|
|
39
|
+
|
|
40
|
+
isDefaultPrevented() {
|
|
41
|
+
throw new Error("Method not supported on web.");
|
|
42
|
+
},
|
|
43
|
+
|
|
44
|
+
isPropagationStopped() {
|
|
45
|
+
throw new Error("Method not supported on web.");
|
|
46
|
+
},
|
|
47
|
+
|
|
48
|
+
persist() {
|
|
49
|
+
throw new Error("Method not supported on web.");
|
|
50
|
+
},
|
|
51
|
+
|
|
52
|
+
preventDefault() {
|
|
53
|
+
throw new Error("Method not supported on web.");
|
|
54
|
+
},
|
|
55
|
+
|
|
56
|
+
stopPropagation() {
|
|
57
|
+
throw new Error("Method not supported on web.");
|
|
58
|
+
},
|
|
59
|
+
|
|
60
|
+
isTrusted: true,
|
|
61
|
+
type: ""
|
|
62
|
+
}), 0);
|
|
63
|
+
}
|
|
64
|
+
});
|
|
65
|
+
});
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
return resizeObserver;
|
|
69
|
+
};
|
|
70
|
+
|
|
71
|
+
const useElementLayout = (ref, onLayout) => {
|
|
72
|
+
const observer = getObserver();
|
|
73
|
+
useLayoutEffect(() => {
|
|
74
|
+
const node = ref.current;
|
|
75
|
+
|
|
76
|
+
if (node !== null) {
|
|
77
|
+
node[DOM_LAYOUT_HANDLER_NAME] = onLayout;
|
|
78
|
+
}
|
|
79
|
+
}, [ref, onLayout]);
|
|
80
|
+
useLayoutEffect(() => {
|
|
81
|
+
const node = ref.current;
|
|
82
|
+
|
|
83
|
+
if (node != null && observer != null) {
|
|
84
|
+
if (typeof node[DOM_LAYOUT_HANDLER_NAME] === "function") {
|
|
85
|
+
observer.observe(node);
|
|
86
|
+
} else {
|
|
87
|
+
observer.unobserve(node);
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
return () => {
|
|
92
|
+
if (node != null && observer != null) {
|
|
93
|
+
observer.unobserve(node);
|
|
94
|
+
}
|
|
95
|
+
};
|
|
96
|
+
}, [observer, ref]);
|
|
97
|
+
};
|
|
98
|
+
|
|
99
|
+
const View = _ref => {
|
|
100
|
+
let {
|
|
101
|
+
children,
|
|
102
|
+
onLayout,
|
|
103
|
+
style: rawStyle
|
|
104
|
+
} = _ref;
|
|
105
|
+
const style = useMemo(() => rawStyle !== null && rawStyle !== void 0 ? rawStyle : {}, [rawStyle]);
|
|
106
|
+
const ref = useRef(null);
|
|
107
|
+
useElementLayout(ref, onLayout);
|
|
108
|
+
const cssStyles = useMemo(() => {
|
|
109
|
+
return { ...style,
|
|
110
|
+
display: "flex",
|
|
111
|
+
flexDirection: style.flexDirection || "column",
|
|
112
|
+
flexWrap: style.flexWrap || "nowrap",
|
|
113
|
+
justifyContent: style.justifyContent || "flex-start",
|
|
114
|
+
alignItems: style.alignItems || "stretch",
|
|
115
|
+
alignContent: style.alignContent || "stretch"
|
|
116
|
+
};
|
|
117
|
+
}, [style]);
|
|
118
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
119
|
+
ref: ref,
|
|
120
|
+
style: cssStyles
|
|
121
|
+
}, children);
|
|
122
|
+
};
|
|
123
|
+
|
|
124
|
+
export const Platform = {
|
|
125
|
+
OS: "web",
|
|
126
|
+
PixelRatio: window.devicePixelRatio,
|
|
127
|
+
requireNativeComponent: () => {
|
|
128
|
+
throw new Error("requireNativeComponent is not supported on the web");
|
|
129
|
+
},
|
|
130
|
+
resolveAsset: source => {
|
|
131
|
+
if (isRNModule(source)) {
|
|
132
|
+
throw new Error("Image source is a number - this is not supported on the web");
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
return source.default;
|
|
136
|
+
},
|
|
137
|
+
findNodeHandle: () => {
|
|
138
|
+
throw new Error("findNodeHandle is not supported on the web");
|
|
139
|
+
},
|
|
140
|
+
NativeModules: {},
|
|
141
|
+
View
|
|
142
|
+
};
|
|
143
|
+
//# sourceMappingURL=Platform.web.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","useLayoutEffect","useMemo","useRef","isRNModule","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","current","observe","unobserve","View","children","style","rawStyle","cssStyles","display","flexDirection","flexWrap","justifyContent","alignItems","alignContent","Platform","OS","PixelRatio","devicePixelRatio","requireNativeComponent","resolveAsset","source","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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"}
|