@shopify/react-native-skia 0.1.188 → 0.1.190
Sign up to get free protection for your applications and to get access to all the features.
- 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":"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"}
|
@@ -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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"}
|