@shopify/react-native-skia 1.9.1 → 1.10.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (126) hide show
  1. package/lib/commonjs/dom/nodes/datatypes/Gradient.d.ts +1 -0
  2. package/lib/commonjs/dom/nodes/datatypes/Gradient.js +14 -2
  3. package/lib/commonjs/dom/nodes/datatypes/Gradient.js.map +1 -1
  4. package/lib/commonjs/index.d.ts +1 -1
  5. package/lib/commonjs/index.js +8 -8
  6. package/lib/commonjs/index.js.map +1 -1
  7. package/lib/commonjs/renderer/Canvas.d.ts +9 -10
  8. package/lib/commonjs/renderer/Canvas.js +67 -59
  9. package/lib/commonjs/renderer/Canvas.js.map +1 -1
  10. package/lib/commonjs/renderer/CanvasOld.d.ts +11 -0
  11. package/lib/commonjs/renderer/CanvasOld.js +96 -0
  12. package/lib/commonjs/renderer/CanvasOld.js.map +1 -0
  13. package/lib/commonjs/sksg/Container.js +11 -6
  14. package/lib/commonjs/sksg/Container.js.map +1 -1
  15. package/lib/commonjs/sksg/HostConfig2.d.ts +19 -0
  16. package/lib/commonjs/sksg/HostConfig2.js +159 -0
  17. package/lib/commonjs/sksg/HostConfig2.js.map +1 -0
  18. package/lib/commonjs/sksg/Recorder/Core.js +1 -0
  19. package/lib/commonjs/sksg/Recorder/Core.js.map +1 -1
  20. package/lib/commonjs/sksg/Recorder/Player.js +2 -2
  21. package/lib/commonjs/sksg/Recorder/Player.js.map +1 -1
  22. package/lib/commonjs/sksg/Recorder/Recorder.js +0 -1
  23. package/lib/commonjs/sksg/Recorder/Recorder.js.map +1 -1
  24. package/lib/commonjs/sksg/Recorder/commands/Box.js +1 -1
  25. package/lib/commonjs/sksg/Recorder/commands/Box.js.map +1 -1
  26. package/lib/commonjs/sksg/Recorder/commands/ColorFilters.js +1 -1
  27. package/lib/commonjs/sksg/Recorder/commands/ColorFilters.js.map +1 -1
  28. package/lib/commonjs/sksg/Recorder/commands/Drawing.js +4 -4
  29. package/lib/commonjs/sksg/Recorder/commands/Drawing.js.map +1 -1
  30. package/lib/commonjs/sksg/Recorder/commands/ImageFilters.js +1 -1
  31. package/lib/commonjs/sksg/Recorder/commands/ImageFilters.js.map +1 -1
  32. package/lib/commonjs/sksg/Recorder/commands/Paint.d.ts +0 -1
  33. package/lib/commonjs/sksg/Recorder/commands/Paint.js +2 -14
  34. package/lib/commonjs/sksg/Recorder/commands/Paint.js.map +1 -1
  35. package/lib/commonjs/sksg/Recorder/commands/Shaders.js +1 -1
  36. package/lib/commonjs/sksg/Recorder/commands/Shaders.js.map +1 -1
  37. package/lib/module/dom/nodes/datatypes/Gradient.d.ts +1 -0
  38. package/lib/module/dom/nodes/datatypes/Gradient.js +12 -1
  39. package/lib/module/dom/nodes/datatypes/Gradient.js.map +1 -1
  40. package/lib/module/index.d.ts +1 -1
  41. package/lib/module/index.js +1 -1
  42. package/lib/module/index.js.map +1 -1
  43. package/lib/module/renderer/Canvas.d.ts +9 -10
  44. package/lib/module/renderer/Canvas.js +65 -55
  45. package/lib/module/renderer/Canvas.js.map +1 -1
  46. package/lib/module/renderer/CanvasOld.d.ts +11 -0
  47. package/lib/module/renderer/CanvasOld.js +87 -0
  48. package/lib/module/renderer/CanvasOld.js.map +1 -0
  49. package/lib/module/sksg/Container.js +11 -6
  50. package/lib/module/sksg/Container.js.map +1 -1
  51. package/lib/module/sksg/HostConfig2.d.ts +19 -0
  52. package/lib/module/sksg/HostConfig2.js +152 -0
  53. package/lib/module/sksg/HostConfig2.js.map +1 -0
  54. package/lib/module/sksg/Recorder/Core.js +1 -0
  55. package/lib/module/sksg/Recorder/Core.js.map +1 -1
  56. package/lib/module/sksg/Recorder/Player.js +2 -2
  57. package/lib/module/sksg/Recorder/Player.js.map +1 -1
  58. package/lib/module/sksg/Recorder/Recorder.js +0 -1
  59. package/lib/module/sksg/Recorder/Recorder.js.map +1 -1
  60. package/lib/module/sksg/Recorder/commands/Box.js +2 -2
  61. package/lib/module/sksg/Recorder/commands/Box.js.map +1 -1
  62. package/lib/module/sksg/Recorder/commands/ColorFilters.js +2 -2
  63. package/lib/module/sksg/Recorder/commands/ColorFilters.js.map +1 -1
  64. package/lib/module/sksg/Recorder/commands/Drawing.js +5 -5
  65. package/lib/module/sksg/Recorder/commands/Drawing.js.map +1 -1
  66. package/lib/module/sksg/Recorder/commands/ImageFilters.js +2 -2
  67. package/lib/module/sksg/Recorder/commands/ImageFilters.js.map +1 -1
  68. package/lib/module/sksg/Recorder/commands/Paint.d.ts +0 -1
  69. package/lib/module/sksg/Recorder/commands/Paint.js +1 -12
  70. package/lib/module/sksg/Recorder/commands/Paint.js.map +1 -1
  71. package/lib/module/sksg/Recorder/commands/Shaders.js +2 -2
  72. package/lib/module/sksg/Recorder/commands/Shaders.js.map +1 -1
  73. package/lib/typescript/lib/commonjs/dom/nodes/datatypes/Gradient.d.ts +1 -0
  74. package/lib/typescript/lib/commonjs/renderer/Canvas.d.ts +2 -2
  75. package/lib/typescript/lib/commonjs/renderer/CanvasOld.d.ts +3 -0
  76. package/lib/typescript/lib/commonjs/sksg/HostConfig2.d.ts +44 -0
  77. package/lib/typescript/lib/commonjs/sksg/Recorder/commands/Paint.d.ts +0 -1
  78. package/lib/typescript/lib/module/dom/nodes/datatypes/Gradient.d.ts +1 -0
  79. package/lib/typescript/lib/module/index.d.ts +1 -1
  80. package/lib/typescript/lib/module/mock/index.d.ts +1 -0
  81. package/lib/typescript/lib/module/renderer/Canvas.d.ts +1 -3
  82. package/lib/typescript/lib/module/renderer/CanvasOld.d.ts +3 -0
  83. package/lib/typescript/lib/module/sksg/HostConfig2.d.ts +43 -0
  84. package/lib/typescript/lib/module/sksg/Recorder/commands/Paint.d.ts +0 -1
  85. package/lib/typescript/src/dom/nodes/datatypes/Gradient.d.ts +1 -0
  86. package/lib/typescript/src/index.d.ts +1 -1
  87. package/lib/typescript/src/renderer/Canvas.d.ts +9 -10
  88. package/lib/typescript/src/renderer/CanvasOld.d.ts +11 -0
  89. package/lib/typescript/src/sksg/HostConfig2.d.ts +19 -0
  90. package/lib/typescript/src/sksg/Recorder/commands/Paint.d.ts +0 -1
  91. package/package.json +1 -1
  92. package/src/dom/nodes/datatypes/Gradient.ts +17 -1
  93. package/src/index.ts +1 -1
  94. package/src/renderer/Canvas.tsx +80 -78
  95. package/src/renderer/CanvasOld.tsx +126 -0
  96. package/src/sksg/Container.ts +6 -2
  97. package/src/sksg/HostConfig2.ts +247 -0
  98. package/src/sksg/Recorder/Core.ts +1 -0
  99. package/src/sksg/Recorder/Player.ts +2 -2
  100. package/src/sksg/Recorder/Recorder.ts +0 -1
  101. package/src/sksg/Recorder/commands/Box.ts +2 -2
  102. package/src/sksg/Recorder/commands/ColorFilters.ts +2 -2
  103. package/src/sksg/Recorder/commands/Drawing.ts +5 -4
  104. package/src/sksg/Recorder/commands/ImageFilters.ts +2 -2
  105. package/src/sksg/Recorder/commands/Paint.ts +1 -17
  106. package/src/sksg/Recorder/commands/Shaders.ts +2 -1
  107. package/lib/commonjs/renderer/Canvas2.d.ts +0 -10
  108. package/lib/commonjs/renderer/Canvas2.js +0 -104
  109. package/lib/commonjs/renderer/Canvas2.js.map +0 -1
  110. package/lib/commonjs/renderer/Canvas2.web.d.ts +0 -3
  111. package/lib/commonjs/renderer/Canvas2.web.js +0 -9
  112. package/lib/commonjs/renderer/Canvas2.web.js.map +0 -1
  113. package/lib/module/renderer/Canvas2.d.ts +0 -10
  114. package/lib/module/renderer/Canvas2.js +0 -97
  115. package/lib/module/renderer/Canvas2.js.map +0 -1
  116. package/lib/module/renderer/Canvas2.web.d.ts +0 -3
  117. package/lib/module/renderer/Canvas2.web.js +0 -3
  118. package/lib/module/renderer/Canvas2.web.js.map +0 -1
  119. package/lib/typescript/lib/commonjs/renderer/Canvas2.d.ts +0 -3
  120. package/lib/typescript/lib/commonjs/renderer/Canvas2.web.d.ts +0 -2
  121. package/lib/typescript/lib/module/renderer/Canvas2.d.ts +0 -1
  122. package/lib/typescript/lib/module/renderer/Canvas2.web.d.ts +0 -1
  123. package/lib/typescript/src/renderer/Canvas2.d.ts +0 -10
  124. package/lib/typescript/src/renderer/Canvas2.web.d.ts +0 -3
  125. package/src/renderer/Canvas2.tsx +0 -128
  126. package/src/renderer/Canvas2.web.tsx +0 -6
@@ -1 +0,0 @@
1
- {"version":3,"names":["_react","require","_SkiaViewNativeId","_SkiaPictureViewNativeComponent","_interopRequireDefault","_Reconciler","_skia","e","__esModule","default","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","NativeSkiaPictureView","SkiaPictureViewNativeComponent","useOnSizeEvent","resultValue","onLayout","useCallback","event","width","height","nativeEvent","layout","value","Canvas2","exports","forwardRef","mode","debug","opaque","children","onSize","_onLayout","viewProps","ref","rafId","useRef","nativeId","useMemo","SkiaViewNativeId","current","root","SkiaSGRoot","Skia","useEffect","render","unmount","requestRedraw","requestAnimationFrame","cancelAnimationFrame","useImperativeHandle","makeImageSnapshot","rect","SkiaViewApi","makeImageSnapshotAsync","redraw","getNativeId","React","createElement","collapsable","nativeID"],"sources":["Canvas2.tsx"],"sourcesContent":["import {\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n} from \"react\";\nimport type { LayoutChangeEvent, ViewProps } from \"react-native\";\nimport type { SharedValue } from \"react-native-reanimated\";\n\nimport { SkiaViewNativeId } from \"../views/SkiaViewNativeId\";\nimport SkiaPictureViewNativeComponent from \"../specs/SkiaPictureViewNativeComponent\";\nimport type { SkRect, SkSize } from \"../skia/types\";\nimport { SkiaSGRoot } from \"../sksg/Reconciler\";\nimport { Skia } from \"../skia\";\nimport type { SkiaBaseViewProps } from \"../views\";\n\nconst NativeSkiaPictureView = SkiaPictureViewNativeComponent;\n\n// TODO: no need to go through the JS thread for this\nconst useOnSizeEvent = (\n resultValue: SkiaBaseViewProps[\"onSize\"],\n onLayout?: (event: LayoutChangeEvent) => void\n) => {\n return useCallback(\n (event: LayoutChangeEvent) => {\n if (onLayout) {\n onLayout(event);\n }\n const { width, height } = event.nativeEvent.layout;\n\n if (resultValue) {\n resultValue.value = { width, height };\n }\n },\n [onLayout, resultValue]\n );\n};\n\nexport interface Canvas2Props extends ViewProps {\n debug?: boolean;\n opaque?: boolean;\n onSize?: SharedValue<SkSize>;\n mode?: \"continuous\" | \"default\";\n}\n\nexport const Canvas2 = forwardRef(\n (\n {\n mode,\n debug,\n opaque,\n children,\n onSize,\n onLayout: _onLayout,\n ...viewProps\n }: Canvas2Props,\n ref\n ) => {\n const rafId = useRef<number | null>(null);\n const onLayout = useOnSizeEvent(onSize, _onLayout);\n // Native ID\n const nativeId = useMemo(() => {\n return SkiaViewNativeId.current++;\n }, []);\n\n // Root\n const root = useMemo(() => new SkiaSGRoot(Skia, nativeId), [nativeId]);\n\n // Render effects\n useEffect(() => {\n root.render(children);\n }, [children, root]);\n\n useEffect(() => {\n return () => {\n root.unmount();\n };\n }, [root]);\n\n const requestRedraw = useCallback(() => {\n rafId.current = requestAnimationFrame(() => {\n root.render(children);\n if (mode === \"continuous\") {\n requestRedraw();\n }\n });\n }, [children, mode, root]);\n\n useEffect(() => {\n if (mode === \"continuous\") {\n requestRedraw();\n }\n return () => {\n if (rafId.current !== null) {\n cancelAnimationFrame(rafId.current);\n }\n };\n }, [mode, requestRedraw]);\n\n // Component methods\n useImperativeHandle(ref, () => ({\n makeImageSnapshot: (rect?: SkRect) => {\n return SkiaViewApi.makeImageSnapshot(nativeId, rect);\n },\n makeImageSnapshotAsync: (rect?: SkRect) => {\n return SkiaViewApi.makeImageSnapshotAsync(nativeId, rect);\n },\n redraw: () => {\n SkiaViewApi.requestRedraw(nativeId);\n },\n getNativeId: () => {\n return nativeId;\n },\n }));\n return (\n <NativeSkiaPictureView\n collapsable={false}\n nativeID={`${nativeId}`}\n debug={debug}\n opaque={opaque}\n onLayout={onLayout}\n {...viewProps}\n />\n );\n }\n);\n"],"mappings":"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","ignoreList":[]}
@@ -1,3 +0,0 @@
1
- import type { CanvasProps } from "./Canvas";
2
- export type Canvas2Props = CanvasProps;
3
- export declare const Canvas2: import("react").FunctionComponent<CanvasProps & import("react").RefAttributes<import("..").SkiaDomView>>;
@@ -1,9 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.Canvas2 = void 0;
7
- var _Canvas = require("./Canvas");
8
- const Canvas2 = exports.Canvas2 = _Canvas.Canvas;
9
- //# sourceMappingURL=Canvas2.web.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["_Canvas","require","Canvas2","exports","Canvas"],"sources":["Canvas2.web.tsx"],"sourcesContent":["import type { CanvasProps } from \"./Canvas\";\nimport { Canvas } from \"./Canvas\";\n\nexport type Canvas2Props = CanvasProps;\n\nexport const Canvas2 = Canvas;\n"],"mappings":";;;;;;AACA,IAAAA,OAAA,GAAAC,OAAA;AAIO,MAAMC,OAAO,GAAAC,OAAA,CAAAD,OAAA,GAAGE,cAAM","ignoreList":[]}
@@ -1,10 +0,0 @@
1
- import type { ViewProps } from "react-native";
2
- import type { SharedValue } from "react-native-reanimated";
3
- import type { SkSize } from "../skia/types";
4
- export interface Canvas2Props extends ViewProps {
5
- debug?: boolean;
6
- opaque?: boolean;
7
- onSize?: SharedValue<SkSize>;
8
- mode?: "continuous" | "default";
9
- }
10
- export declare const Canvas2: import("react").ForwardRefExoticComponent<Canvas2Props & import("react").RefAttributes<unknown>>;
@@ -1,97 +0,0 @@
1
- function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
2
- import { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef } from "react";
3
- import { SkiaViewNativeId } from "../views/SkiaViewNativeId";
4
- import SkiaPictureViewNativeComponent from "../specs/SkiaPictureViewNativeComponent";
5
- import { SkiaSGRoot } from "../sksg/Reconciler";
6
- import { Skia } from "../skia";
7
- const NativeSkiaPictureView = SkiaPictureViewNativeComponent;
8
-
9
- // TODO: no need to go through the JS thread for this
10
- const useOnSizeEvent = (resultValue, onLayout) => {
11
- return useCallback(event => {
12
- if (onLayout) {
13
- onLayout(event);
14
- }
15
- const {
16
- width,
17
- height
18
- } = event.nativeEvent.layout;
19
- if (resultValue) {
20
- resultValue.value = {
21
- width,
22
- height
23
- };
24
- }
25
- }, [onLayout, resultValue]);
26
- };
27
- export const Canvas2 = /*#__PURE__*/forwardRef(({
28
- mode,
29
- debug,
30
- opaque,
31
- children,
32
- onSize,
33
- onLayout: _onLayout,
34
- ...viewProps
35
- }, ref) => {
36
- const rafId = useRef(null);
37
- const onLayout = useOnSizeEvent(onSize, _onLayout);
38
- // Native ID
39
- const nativeId = useMemo(() => {
40
- return SkiaViewNativeId.current++;
41
- }, []);
42
-
43
- // Root
44
- const root = useMemo(() => new SkiaSGRoot(Skia, nativeId), [nativeId]);
45
-
46
- // Render effects
47
- useEffect(() => {
48
- root.render(children);
49
- }, [children, root]);
50
- useEffect(() => {
51
- return () => {
52
- root.unmount();
53
- };
54
- }, [root]);
55
- const requestRedraw = useCallback(() => {
56
- rafId.current = requestAnimationFrame(() => {
57
- root.render(children);
58
- if (mode === "continuous") {
59
- requestRedraw();
60
- }
61
- });
62
- }, [children, mode, root]);
63
- useEffect(() => {
64
- if (mode === "continuous") {
65
- requestRedraw();
66
- }
67
- return () => {
68
- if (rafId.current !== null) {
69
- cancelAnimationFrame(rafId.current);
70
- }
71
- };
72
- }, [mode, requestRedraw]);
73
-
74
- // Component methods
75
- useImperativeHandle(ref, () => ({
76
- makeImageSnapshot: rect => {
77
- return SkiaViewApi.makeImageSnapshot(nativeId, rect);
78
- },
79
- makeImageSnapshotAsync: rect => {
80
- return SkiaViewApi.makeImageSnapshotAsync(nativeId, rect);
81
- },
82
- redraw: () => {
83
- SkiaViewApi.requestRedraw(nativeId);
84
- },
85
- getNativeId: () => {
86
- return nativeId;
87
- }
88
- }));
89
- return /*#__PURE__*/React.createElement(NativeSkiaPictureView, _extends({
90
- collapsable: false,
91
- nativeID: `${nativeId}`,
92
- debug: debug,
93
- opaque: opaque,
94
- onLayout: onLayout
95
- }, viewProps));
96
- });
97
- //# sourceMappingURL=Canvas2.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["forwardRef","useCallback","useEffect","useImperativeHandle","useMemo","useRef","SkiaViewNativeId","SkiaPictureViewNativeComponent","SkiaSGRoot","Skia","NativeSkiaPictureView","useOnSizeEvent","resultValue","onLayout","event","width","height","nativeEvent","layout","value","Canvas2","mode","debug","opaque","children","onSize","_onLayout","viewProps","ref","rafId","nativeId","current","root","render","unmount","requestRedraw","requestAnimationFrame","cancelAnimationFrame","makeImageSnapshot","rect","SkiaViewApi","makeImageSnapshotAsync","redraw","getNativeId","React","createElement","_extends","collapsable","nativeID"],"sources":["Canvas2.tsx"],"sourcesContent":["import {\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n} from \"react\";\nimport type { LayoutChangeEvent, ViewProps } from \"react-native\";\nimport type { SharedValue } from \"react-native-reanimated\";\n\nimport { SkiaViewNativeId } from \"../views/SkiaViewNativeId\";\nimport SkiaPictureViewNativeComponent from \"../specs/SkiaPictureViewNativeComponent\";\nimport type { SkRect, SkSize } from \"../skia/types\";\nimport { SkiaSGRoot } from \"../sksg/Reconciler\";\nimport { Skia } from \"../skia\";\nimport type { SkiaBaseViewProps } from \"../views\";\n\nconst NativeSkiaPictureView = SkiaPictureViewNativeComponent;\n\n// TODO: no need to go through the JS thread for this\nconst useOnSizeEvent = (\n resultValue: SkiaBaseViewProps[\"onSize\"],\n onLayout?: (event: LayoutChangeEvent) => void\n) => {\n return useCallback(\n (event: LayoutChangeEvent) => {\n if (onLayout) {\n onLayout(event);\n }\n const { width, height } = event.nativeEvent.layout;\n\n if (resultValue) {\n resultValue.value = { width, height };\n }\n },\n [onLayout, resultValue]\n );\n};\n\nexport interface Canvas2Props extends ViewProps {\n debug?: boolean;\n opaque?: boolean;\n onSize?: SharedValue<SkSize>;\n mode?: \"continuous\" | \"default\";\n}\n\nexport const Canvas2 = forwardRef(\n (\n {\n mode,\n debug,\n opaque,\n children,\n onSize,\n onLayout: _onLayout,\n ...viewProps\n }: Canvas2Props,\n ref\n ) => {\n const rafId = useRef<number | null>(null);\n const onLayout = useOnSizeEvent(onSize, _onLayout);\n // Native ID\n const nativeId = useMemo(() => {\n return SkiaViewNativeId.current++;\n }, []);\n\n // Root\n const root = useMemo(() => new SkiaSGRoot(Skia, nativeId), [nativeId]);\n\n // Render effects\n useEffect(() => {\n root.render(children);\n }, [children, root]);\n\n useEffect(() => {\n return () => {\n root.unmount();\n };\n }, [root]);\n\n const requestRedraw = useCallback(() => {\n rafId.current = requestAnimationFrame(() => {\n root.render(children);\n if (mode === \"continuous\") {\n requestRedraw();\n }\n });\n }, [children, mode, root]);\n\n useEffect(() => {\n if (mode === \"continuous\") {\n requestRedraw();\n }\n return () => {\n if (rafId.current !== null) {\n cancelAnimationFrame(rafId.current);\n }\n };\n }, [mode, requestRedraw]);\n\n // Component methods\n useImperativeHandle(ref, () => ({\n makeImageSnapshot: (rect?: SkRect) => {\n return SkiaViewApi.makeImageSnapshot(nativeId, rect);\n },\n makeImageSnapshotAsync: (rect?: SkRect) => {\n return SkiaViewApi.makeImageSnapshotAsync(nativeId, rect);\n },\n redraw: () => {\n SkiaViewApi.requestRedraw(nativeId);\n },\n getNativeId: () => {\n return nativeId;\n },\n }));\n return (\n <NativeSkiaPictureView\n collapsable={false}\n nativeID={`${nativeId}`}\n debug={debug}\n opaque={opaque}\n onLayout={onLayout}\n {...viewProps}\n />\n );\n }\n);\n"],"mappings":"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","ignoreList":[]}
@@ -1,3 +0,0 @@
1
- import type { CanvasProps } from "./Canvas";
2
- export type Canvas2Props = CanvasProps;
3
- export declare const Canvas2: import("react").FunctionComponent<CanvasProps & import("react").RefAttributes<import("..").SkiaDomView>>;
@@ -1,3 +0,0 @@
1
- import { Canvas } from "./Canvas";
2
- export const Canvas2 = Canvas;
3
- //# sourceMappingURL=Canvas2.web.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["Canvas","Canvas2"],"sources":["Canvas2.web.tsx"],"sourcesContent":["import type { CanvasProps } from \"./Canvas\";\nimport { Canvas } from \"./Canvas\";\n\nexport type Canvas2Props = CanvasProps;\n\nexport const Canvas2 = Canvas;\n"],"mappings":"AACA,SAASA,MAAM,QAAQ,UAAU;AAIjC,OAAO,MAAMC,OAAO,GAAGD,MAAM","ignoreList":[]}
@@ -1,3 +0,0 @@
1
- export const __esModule: boolean;
2
- export const Canvas2: _react.ForwardRefExoticComponent<_react.RefAttributes<any>>;
3
- import _react = require("react");
@@ -1,2 +0,0 @@
1
- export const __esModule: boolean;
2
- export { Canvas as Canvas2 };
@@ -1 +0,0 @@
1
- export const Canvas2: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
@@ -1 +0,0 @@
1
- export const Canvas2: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;
@@ -1,10 +0,0 @@
1
- import type { ViewProps } from "react-native";
2
- import type { SharedValue } from "react-native-reanimated";
3
- import type { SkSize } from "../skia/types";
4
- export interface Canvas2Props extends ViewProps {
5
- debug?: boolean;
6
- opaque?: boolean;
7
- onSize?: SharedValue<SkSize>;
8
- mode?: "continuous" | "default";
9
- }
10
- export declare const Canvas2: import("react").ForwardRefExoticComponent<Canvas2Props & import("react").RefAttributes<unknown>>;
@@ -1,3 +0,0 @@
1
- import type { CanvasProps } from "./Canvas";
2
- export type Canvas2Props = CanvasProps;
3
- export declare const Canvas2: import("react").FunctionComponent<CanvasProps & import("react").RefAttributes<import("..").SkiaDomView>>;
@@ -1,128 +0,0 @@
1
- import {
2
- forwardRef,
3
- useCallback,
4
- useEffect,
5
- useImperativeHandle,
6
- useMemo,
7
- useRef,
8
- } from "react";
9
- import type { LayoutChangeEvent, ViewProps } from "react-native";
10
- import type { SharedValue } from "react-native-reanimated";
11
-
12
- import { SkiaViewNativeId } from "../views/SkiaViewNativeId";
13
- import SkiaPictureViewNativeComponent from "../specs/SkiaPictureViewNativeComponent";
14
- import type { SkRect, SkSize } from "../skia/types";
15
- import { SkiaSGRoot } from "../sksg/Reconciler";
16
- import { Skia } from "../skia";
17
- import type { SkiaBaseViewProps } from "../views";
18
-
19
- const NativeSkiaPictureView = SkiaPictureViewNativeComponent;
20
-
21
- // TODO: no need to go through the JS thread for this
22
- const useOnSizeEvent = (
23
- resultValue: SkiaBaseViewProps["onSize"],
24
- onLayout?: (event: LayoutChangeEvent) => void
25
- ) => {
26
- return useCallback(
27
- (event: LayoutChangeEvent) => {
28
- if (onLayout) {
29
- onLayout(event);
30
- }
31
- const { width, height } = event.nativeEvent.layout;
32
-
33
- if (resultValue) {
34
- resultValue.value = { width, height };
35
- }
36
- },
37
- [onLayout, resultValue]
38
- );
39
- };
40
-
41
- export interface Canvas2Props extends ViewProps {
42
- debug?: boolean;
43
- opaque?: boolean;
44
- onSize?: SharedValue<SkSize>;
45
- mode?: "continuous" | "default";
46
- }
47
-
48
- export const Canvas2 = forwardRef(
49
- (
50
- {
51
- mode,
52
- debug,
53
- opaque,
54
- children,
55
- onSize,
56
- onLayout: _onLayout,
57
- ...viewProps
58
- }: Canvas2Props,
59
- ref
60
- ) => {
61
- const rafId = useRef<number | null>(null);
62
- const onLayout = useOnSizeEvent(onSize, _onLayout);
63
- // Native ID
64
- const nativeId = useMemo(() => {
65
- return SkiaViewNativeId.current++;
66
- }, []);
67
-
68
- // Root
69
- const root = useMemo(() => new SkiaSGRoot(Skia, nativeId), [nativeId]);
70
-
71
- // Render effects
72
- useEffect(() => {
73
- root.render(children);
74
- }, [children, root]);
75
-
76
- useEffect(() => {
77
- return () => {
78
- root.unmount();
79
- };
80
- }, [root]);
81
-
82
- const requestRedraw = useCallback(() => {
83
- rafId.current = requestAnimationFrame(() => {
84
- root.render(children);
85
- if (mode === "continuous") {
86
- requestRedraw();
87
- }
88
- });
89
- }, [children, mode, root]);
90
-
91
- useEffect(() => {
92
- if (mode === "continuous") {
93
- requestRedraw();
94
- }
95
- return () => {
96
- if (rafId.current !== null) {
97
- cancelAnimationFrame(rafId.current);
98
- }
99
- };
100
- }, [mode, requestRedraw]);
101
-
102
- // Component methods
103
- useImperativeHandle(ref, () => ({
104
- makeImageSnapshot: (rect?: SkRect) => {
105
- return SkiaViewApi.makeImageSnapshot(nativeId, rect);
106
- },
107
- makeImageSnapshotAsync: (rect?: SkRect) => {
108
- return SkiaViewApi.makeImageSnapshotAsync(nativeId, rect);
109
- },
110
- redraw: () => {
111
- SkiaViewApi.requestRedraw(nativeId);
112
- },
113
- getNativeId: () => {
114
- return nativeId;
115
- },
116
- }));
117
- return (
118
- <NativeSkiaPictureView
119
- collapsable={false}
120
- nativeID={`${nativeId}`}
121
- debug={debug}
122
- opaque={opaque}
123
- onLayout={onLayout}
124
- {...viewProps}
125
- />
126
- );
127
- }
128
- );
@@ -1,6 +0,0 @@
1
- import type { CanvasProps } from "./Canvas";
2
- import { Canvas } from "./Canvas";
3
-
4
- export type Canvas2Props = CanvasProps;
5
-
6
- export const Canvas2 = Canvas;