@shopify/react-native-skia 0.1.134 → 0.1.138
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/README.md +4 -47
- package/android/build.gradle +1 -2
- package/cpp/api/JsiSkFont.h +25 -1
- package/cpp/api/JsiSkMatrix.h +12 -0
- package/cpp/api/JsiSkTypeface.h +1 -29
- package/jestSetup.js +5 -0
- package/lib/commonjs/animation/functions/interpolate.js +3 -2
- package/lib/commonjs/animation/functions/interpolate.js.map +1 -1
- package/lib/commonjs/animation/functions/interpolateColors.js +2 -2
- package/lib/commonjs/animation/functions/interpolateColors.js.map +1 -1
- package/lib/commonjs/animation/functions/interpolatePaths.js +45 -11
- package/lib/commonjs/animation/functions/interpolatePaths.js.map +1 -1
- package/lib/commonjs/mock/index.js +121 -177
- package/lib/commonjs/mock/index.js.map +1 -1
- package/lib/commonjs/renderer/components/Group.js +1 -1
- package/lib/commonjs/renderer/components/Group.js.map +1 -1
- package/lib/commonjs/renderer/processors/Transform.js +8 -15
- package/lib/commonjs/renderer/processors/Transform.js.map +1 -1
- package/lib/commonjs/skia/core/Data.js +7 -4
- package/lib/commonjs/skia/core/Data.js.map +1 -1
- package/lib/commonjs/skia/types/Font/Font.js.map +1 -1
- package/lib/commonjs/skia/types/Matrix.js +18 -3
- package/lib/commonjs/skia/types/Matrix.js.map +1 -1
- package/lib/commonjs/skia/web/JsiSkFont.js +6 -0
- package/lib/commonjs/skia/web/JsiSkFont.js.map +1 -1
- package/lib/commonjs/skia/web/JsiSkMatrix.js +4 -0
- package/lib/commonjs/skia/web/JsiSkMatrix.js.map +1 -1
- package/lib/commonjs/values/api.js +1 -7
- package/lib/commonjs/values/api.js.map +1 -1
- package/lib/commonjs/values/hooks/useComputedValue.js +2 -2
- package/lib/commonjs/values/hooks/useComputedValue.js.map +1 -1
- package/lib/commonjs/views/SkiaView.web.js +27 -37
- package/lib/commonjs/views/SkiaView.web.js.map +1 -1
- package/lib/commonjs/web/LoadSkiaWeb.js +29 -0
- package/lib/commonjs/web/LoadSkiaWeb.js.map +1 -0
- package/lib/commonjs/web/WithSkiaWeb.js +39 -0
- package/lib/commonjs/web/WithSkiaWeb.js.map +1 -0
- package/lib/commonjs/web/index.js +22 -12
- package/lib/commonjs/web/index.js.map +1 -1
- package/lib/module/animation/functions/interpolate.js +2 -2
- package/lib/module/animation/functions/interpolate.js.map +1 -1
- package/lib/module/animation/functions/interpolateColors.js +1 -1
- package/lib/module/animation/functions/interpolateColors.js.map +1 -1
- package/lib/module/animation/functions/interpolatePaths.js +44 -11
- package/lib/module/animation/functions/interpolatePaths.js.map +1 -1
- package/lib/module/mock/index.js +103 -147
- package/lib/module/mock/index.js.map +1 -1
- package/lib/module/renderer/components/Group.js +1 -1
- package/lib/module/renderer/components/Group.js.map +1 -1
- package/lib/module/renderer/processors/Transform.js +8 -15
- package/lib/module/renderer/processors/Transform.js.map +1 -1
- package/lib/module/skia/core/Data.js +7 -4
- package/lib/module/skia/core/Data.js.map +1 -1
- package/lib/module/skia/types/Font/Font.js.map +1 -1
- package/lib/module/skia/types/Matrix.js +12 -2
- package/lib/module/skia/types/Matrix.js.map +1 -1
- package/lib/module/skia/web/JsiSkFont.js +6 -0
- package/lib/module/skia/web/JsiSkFont.js.map +1 -1
- package/lib/module/skia/web/JsiSkMatrix.js +4 -0
- package/lib/module/skia/web/JsiSkMatrix.js.map +1 -1
- package/lib/module/values/api.js +0 -4
- package/lib/module/values/api.js.map +1 -1
- package/lib/module/values/hooks/useComputedValue.js +1 -1
- package/lib/module/values/hooks/useComputedValue.js.map +1 -1
- package/lib/module/views/SkiaView.web.js +27 -37
- package/lib/module/views/SkiaView.web.js.map +1 -1
- package/lib/module/web/LoadSkiaWeb.js +16 -0
- package/lib/module/web/LoadSkiaWeb.js.map +1 -0
- package/lib/module/web/WithSkiaWeb.js +23 -0
- package/lib/module/web/WithSkiaWeb.js.map +1 -0
- package/lib/module/web/index.js +2 -9
- package/lib/module/web/index.js.map +1 -1
- package/lib/typescript/jestSetup.d.ts +1 -0
- package/lib/typescript/src/animation/functions/interpolate.d.ts +6 -0
- package/lib/typescript/src/animation/functions/interpolatePaths.d.ts +3 -1
- package/lib/typescript/src/mock/index.d.ts +11 -42
- package/lib/typescript/src/renderer/Canvas.d.ts +1 -1
- package/lib/typescript/src/renderer/processors/Transform.d.ts +2 -2
- package/lib/typescript/src/skia/types/Font/Font.d.ts +6 -0
- package/lib/typescript/src/skia/types/Matrix.d.ts +6 -2
- package/lib/typescript/src/skia/types/Typeface/Typeface.d.ts +1 -4
- package/lib/typescript/src/skia/web/JsiSkFont.d.ts +1 -0
- package/lib/typescript/src/skia/web/JsiSkMatrix.d.ts +1 -0
- package/lib/typescript/src/values/api.d.ts +0 -1
- package/lib/typescript/src/views/SkiaView.web.d.ts +4 -6
- package/lib/typescript/src/web/LoadSkiaWeb.d.ts +6 -0
- package/lib/typescript/src/web/WithSkiaWeb.d.ts +12 -0
- package/lib/typescript/src/web/index.d.ts +2 -5
- package/package.json +7 -3
- package/scripts/setup-canvaskit.js +74 -0
- package/src/animation/functions/interpolate.ts +4 -2
- package/src/animation/functions/interpolateColors.ts +1 -1
- package/src/animation/functions/interpolatePaths.ts +59 -10
- package/src/mock/index.ts +103 -149
- package/src/renderer/components/Group.tsx +1 -1
- package/src/renderer/processors/Transform.ts +7 -10
- package/src/skia/core/Data.ts +7 -8
- package/src/skia/types/Font/Font.ts +7 -0
- package/src/skia/types/Matrix.ts +19 -3
- package/src/skia/types/Typeface/Typeface.ts +1 -4
- package/src/skia/web/JsiSkFont.ts +6 -0
- package/src/skia/web/JsiSkMatrix.ts +4 -0
- package/src/values/api.ts +0 -2
- package/src/values/hooks/useComputedValue.ts +1 -1
- package/src/views/SkiaView.web.tsx +36 -43
- package/src/web/LoadSkiaWeb.tsx +24 -0
- package/src/web/WithSkiaWeb.tsx +37 -0
- package/src/web/index.ts +2 -15
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.processTransform = exports.MatrixIndex = void 0;
|
|
6
|
+
exports.toDegrees = exports.processTransform = exports.isMatrix = exports.MatrixIndex = void 0;
|
|
7
7
|
let MatrixIndex;
|
|
8
8
|
exports.MatrixIndex = MatrixIndex;
|
|
9
9
|
|
|
@@ -16,9 +16,13 @@ exports.MatrixIndex = MatrixIndex;
|
|
|
16
16
|
MatrixIndex[MatrixIndex["TransY"] = 5] = "TransY";
|
|
17
17
|
MatrixIndex[MatrixIndex["Persp0"] = 6] = "Persp0";
|
|
18
18
|
MatrixIndex[MatrixIndex["Persp1"] = 7] = "Persp1";
|
|
19
|
-
MatrixIndex[MatrixIndex["
|
|
19
|
+
MatrixIndex[MatrixIndex["Persp2"] = 8] = "Persp2";
|
|
20
20
|
})(MatrixIndex || (exports.MatrixIndex = MatrixIndex = {}));
|
|
21
21
|
|
|
22
|
+
const isMatrix = obj => obj !== null && obj.__typename__ === "Matrix";
|
|
23
|
+
|
|
24
|
+
exports.isMatrix = isMatrix;
|
|
25
|
+
|
|
22
26
|
const processTransform = (m, transforms) => {
|
|
23
27
|
for (const transform of transforms) {
|
|
24
28
|
const key = Object.keys(transform)[0];
|
|
@@ -60,7 +64,12 @@ const processTransform = (m, transforms) => {
|
|
|
60
64
|
}
|
|
61
65
|
|
|
62
66
|
if (key === "rotate" || key === "rotateZ") {
|
|
63
|
-
m
|
|
67
|
+
if (isMatrix(m)) {
|
|
68
|
+
m.rotate(value);
|
|
69
|
+
} else {
|
|
70
|
+
m.rotate(toDegrees(value), 0, 0);
|
|
71
|
+
}
|
|
72
|
+
|
|
64
73
|
continue;
|
|
65
74
|
}
|
|
66
75
|
|
|
@@ -75,4 +84,10 @@ exports.processTransform = processTransform;
|
|
|
75
84
|
const exhaustiveCheck = a => {
|
|
76
85
|
throw new Error(`Unknown transformation: ${a}`);
|
|
77
86
|
};
|
|
87
|
+
|
|
88
|
+
const toDegrees = rad => {
|
|
89
|
+
return rad * 180 / Math.PI;
|
|
90
|
+
};
|
|
91
|
+
|
|
92
|
+
exports.toDegrees = toDegrees;
|
|
78
93
|
//# sourceMappingURL=Matrix.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Matrix.ts"],"names":["MatrixIndex","processTransform","m","transforms","transform","key","Object","keys","value","translate","scale","skew","rotate","exhaustiveCheck","a","Error"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"sources":["Matrix.ts"],"names":["MatrixIndex","isMatrix","obj","__typename__","processTransform","m","transforms","transform","key","Object","keys","value","translate","scale","skew","rotate","toDegrees","exhaustiveCheck","a","Error","rad","Math","PI"],"mappings":";;;;;;IAEYA,W;;;WAAAA,W;AAAAA,EAAAA,W,CAAAA,W;AAAAA,EAAAA,W,CAAAA,W;AAAAA,EAAAA,W,CAAAA,W;AAAAA,EAAAA,W,CAAAA,W;AAAAA,EAAAA,W,CAAAA,W;AAAAA,EAAAA,W,CAAAA,W;AAAAA,EAAAA,W,CAAAA,W;AAAAA,EAAAA,W,CAAAA,W;AAAAA,EAAAA,W,CAAAA,W;GAAAA,W,2BAAAA,W;;AAYL,MAAMC,QAAQ,GAAIC,GAAD,IACtBA,GAAG,KAAK,IAAR,IAAiBA,GAAD,CAA+BC,YAA/B,KAAgD,QAD3D;;;;AA0CA,MAAMC,gBAAgB,GAAG,CAC9BC,CAD8B,EAE9BC,UAF8B,KAG3B;AACH,OAAK,MAAMC,SAAX,IAAwBD,UAAxB,EAAoC;AAClC,UAAME,GAAG,GAAGC,MAAM,CAACC,IAAP,CAAYH,SAAZ,EAAuB,CAAvB,CAAZ;AACA,UAAMI,KAAK,GAAIJ,SAAD,CAAiDC,GAAjD,CAAd;;AACA,QAAIA,GAAG,KAAK,YAAZ,EAA0B;AACxBH,MAAAA,CAAC,CAACO,SAAF,CAAYD,KAAZ,EAAmB,CAAnB;AACA;AACD;;AACD,QAAIH,GAAG,KAAK,YAAZ,EAA0B;AACxBH,MAAAA,CAAC,CAACO,SAAF,CAAY,CAAZ,EAAeD,KAAf;AACA;AACD;;AACD,QAAIH,GAAG,KAAK,OAAZ,EAAqB;AACnBH,MAAAA,CAAC,CAACQ,KAAF,CAAQF,KAAR,EAAeA,KAAf;AACA;AACD;;AACD,QAAIH,GAAG,KAAK,QAAZ,EAAsB;AACpBH,MAAAA,CAAC,CAACQ,KAAF,CAAQF,KAAR,EAAe,CAAf;AACA;AACD;;AACD,QAAIH,GAAG,KAAK,QAAZ,EAAsB;AACpBH,MAAAA,CAAC,CAACQ,KAAF,CAAQ,CAAR,EAAWF,KAAX;AACA;AACD;;AACD,QAAIH,GAAG,KAAK,OAAZ,EAAqB;AACnBH,MAAAA,CAAC,CAACS,IAAF,CAAOH,KAAP,EAAc,CAAd;AACA;AACD;;AACD,QAAIH,GAAG,KAAK,OAAZ,EAAqB;AACnBH,MAAAA,CAAC,CAACS,IAAF,CAAO,CAAP,EAAUH,KAAV;AACA;AACD;;AACD,QAAIH,GAAG,KAAK,QAAR,IAAoBA,GAAG,KAAK,SAAhC,EAA2C;AACzC,UAAIP,QAAQ,CAACI,CAAD,CAAZ,EAAiB;AACfA,QAAAA,CAAC,CAACU,MAAF,CAASJ,KAAT;AACD,OAFD,MAEO;AACLN,QAAAA,CAAC,CAACU,MAAF,CAASC,SAAS,CAACL,KAAD,CAAlB,EAA2B,CAA3B,EAA8B,CAA9B;AACD;;AACD;AACD;;AACDM,IAAAA,eAAe,CAACT,GAAD,CAAf;AACD;;AACD,SAAOH,CAAP;AACD,CA9CM;;;;AAgDP,MAAMY,eAAe,GAAIC,CAAD,IAAqB;AAC3C,QAAM,IAAIC,KAAJ,CAAW,2BAA0BD,CAAE,EAAvC,CAAN;AACD,CAFD;;AAIO,MAAMF,SAAS,GAAII,GAAD,IAAiB;AACxC,SAAQA,GAAG,GAAG,GAAP,GAAcC,IAAI,CAACC,EAA1B;AACD,CAFM","sourcesContent":["import type { SkJSIInstance } from \"./JsiInstance\";\nimport type { SkCanvas } from \"./Canvas\";\nexport enum MatrixIndex {\n ScaleX = 0,\n SkewX = 1,\n TransX = 2,\n SkewY = 3,\n ScaleY = 4,\n TransY = 5,\n Persp0 = 6,\n Persp1 = 7,\n Persp2 = 8,\n}\n\nexport const isMatrix = (obj: unknown): obj is SkMatrix =>\n obj !== null && (obj as SkJSIInstance<string>).__typename__ === \"Matrix\";\n\nexport interface SkMatrix extends SkJSIInstance<\"Matrix\"> {\n concat: (matrix: SkMatrix) => void;\n translate: (x: number, y: number) => void;\n scale: (x: number, y?: number) => void;\n skew: (x: number, y: number) => void;\n rotate: (theta: number) => void;\n identity: () => void;\n}\n\ntype Transform2dName =\n | \"translateX\"\n | \"translateY\"\n | \"scale\"\n | \"skewX\"\n | \"skewY\"\n | \"scaleX\"\n | \"scaleY\"\n | \"rotateZ\"\n | \"rotate\";\n\ntype Transformations = {\n readonly [Name in Transform2dName]: number;\n};\n\nexport type Transforms2d = readonly (\n | Pick<Transformations, \"translateX\">\n | Pick<Transformations, \"translateY\">\n | Pick<Transformations, \"scale\">\n | Pick<Transformations, \"scaleX\">\n | Pick<Transformations, \"scaleY\">\n | Pick<Transformations, \"skewX\">\n | Pick<Transformations, \"skewY\">\n | Pick<Transformations, \"rotate\">\n)[];\n\nexport interface TransformProp {\n transform?: Transforms2d;\n}\n\nexport const processTransform = <T extends SkMatrix | SkCanvas>(\n m: T,\n transforms: Transforms2d\n) => {\n for (const transform of transforms) {\n const key = Object.keys(transform)[0] as Transform2dName;\n const value = (transform as Pick<Transformations, typeof key>)[key];\n if (key === \"translateX\") {\n m.translate(value, 0);\n continue;\n }\n if (key === \"translateY\") {\n m.translate(0, value);\n continue;\n }\n if (key === \"scale\") {\n m.scale(value, value);\n continue;\n }\n if (key === \"scaleX\") {\n m.scale(value, 1);\n continue;\n }\n if (key === \"scaleY\") {\n m.scale(1, value);\n continue;\n }\n if (key === \"skewX\") {\n m.skew(value, 0);\n continue;\n }\n if (key === \"skewY\") {\n m.skew(0, value);\n continue;\n }\n if (key === \"rotate\" || key === \"rotateZ\") {\n if (isMatrix(m)) {\n m.rotate(value);\n } else {\n m.rotate(toDegrees(value), 0, 0);\n }\n continue;\n }\n exhaustiveCheck(key);\n }\n return m;\n};\n\nconst exhaustiveCheck = (a: never): never => {\n throw new Error(`Unknown transformation: ${a}`);\n};\n\nexport const toDegrees = (rad: number) => {\n return (rad * 180) / Math.PI;\n};\n"]}
|
|
@@ -22,6 +22,12 @@ Clients should use "Font.getGlyphWidths" instead (the latter does no shaping)`);
|
|
|
22
22
|
return new _JsiSkRect.JsiSkRect(this.CanvasKit, this.CanvasKit.XYWHRect(0, 0, 0, 0));
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
+
getTextWidth(text, paint) {
|
|
26
|
+
const ids = this.getGlyphIDs(text);
|
|
27
|
+
const widths = this.getGlyphWidths(ids, paint);
|
|
28
|
+
return widths.reduce((a, b) => a + b, 0);
|
|
29
|
+
}
|
|
30
|
+
|
|
25
31
|
getMetrics() {
|
|
26
32
|
const result = this.ref.getMetrics();
|
|
27
33
|
return {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["JsiSkFont.ts"],"names":["JsiSkFont","HostObject","constructor","CanvasKit","ref","measureText","_text","_paint","console","warn","JsiSkRect","XYWHRect","getMetrics","result","ascent","descent","leading","bounds","undefined","
|
|
1
|
+
{"version":3,"sources":["JsiSkFont.ts"],"names":["JsiSkFont","HostObject","constructor","CanvasKit","ref","measureText","_text","_paint","console","warn","JsiSkRect","XYWHRect","getTextWidth","text","paint","ids","getGlyphIDs","widths","getGlyphWidths","reduce","a","b","getMetrics","result","ascent","descent","leading","bounds","undefined","str","numCodePoints","glyphs","getGlyphIntercepts","positions","top","bottom","map","p","getScaleX","getSize","getSkewX","isEmbolden","getTypeface","tf","JsiSkTypeface","setEdging","edging","setEmbeddedBitmaps","embeddedBitmaps","setHinting","hinting","setLinearMetrics","linearMetrics","setScaleX","sx","setSize","points","setSkewX","setEmbolden","embolden","setSubpixel","subpixel","setTypeface","face"],"mappings":"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","sourcesContent":["import type { CanvasKit, Font } from \"canvaskit-wasm\";\n\nimport type {\n FontEdging,\n FontHinting,\n SkFont,\n SkPaint,\n SkPoint,\n SkRect,\n SkTypeface,\n} from \"../types\";\n\nimport { HostObject, toValue, ckEnum } from \"./Host\";\nimport { JsiSkRect } from \"./JsiSkRect\";\nimport { JsiSkTypeface } from \"./JsiSkTypeface\";\n\nexport class JsiSkFont extends HostObject<Font, \"Font\"> implements SkFont {\n constructor(CanvasKit: CanvasKit, ref: Font) {\n super(CanvasKit, ref, \"Font\");\n }\n\n measureText(_text: string, _paint?: SkPaint): SkRect {\n console.warn(\n `measureText() is deprecated an returns an empty rectangle on React Native Web.\nClients should use \"Font.getGlyphWidths\" instead (the latter does no shaping)`\n );\n return new JsiSkRect(this.CanvasKit, this.CanvasKit.XYWHRect(0, 0, 0, 0));\n }\n\n getTextWidth(text: string, paint?: SkPaint | undefined) {\n const ids = this.getGlyphIDs(text);\n const widths = this.getGlyphWidths(ids, paint);\n return widths.reduce((a, b) => a + b, 0);\n }\n\n getMetrics() {\n const result = this.ref.getMetrics();\n return {\n ascent: result.ascent,\n descent: result.descent,\n leading: result.leading,\n bounds: result.bounds\n ? new JsiSkRect(this.CanvasKit, result.bounds)\n : undefined,\n };\n }\n\n getGlyphIDs(str: string, numCodePoints?: number) {\n // TODO: Fix return value in the C++ implementation\n return [...this.ref.getGlyphIDs(str, numCodePoints)];\n }\n\n // TODO: Fix return value in the C++ implementation, it return float32\n getGlyphWidths(glyphs: number[], paint?: SkPaint | null) {\n return [...this.ref.getGlyphWidths(glyphs, paint ? toValue(paint) : null)];\n }\n\n getGlyphIntercepts(\n glyphs: number[],\n positions: SkPoint[],\n top: number,\n bottom: number\n ) {\n return [\n ...this.ref.getGlyphIntercepts(\n glyphs,\n positions.map((p) => toValue(p)),\n top,\n bottom\n ),\n ];\n }\n\n getScaleX() {\n return this.ref.getScaleX();\n }\n\n getSize() {\n return this.ref.getSize();\n }\n\n getSkewX() {\n return this.ref.getSkewX();\n }\n\n isEmbolden() {\n return this.ref.isEmbolden();\n }\n\n getTypeface() {\n const tf = this.ref.getTypeface();\n return tf ? new JsiSkTypeface(this.CanvasKit, tf) : null;\n }\n\n setEdging(edging: FontEdging) {\n this.ref.setEdging(ckEnum(edging));\n }\n\n setEmbeddedBitmaps(embeddedBitmaps: boolean) {\n this.ref.setEmbeddedBitmaps(embeddedBitmaps);\n }\n\n setHinting(hinting: FontHinting) {\n this.ref.setHinting(ckEnum(hinting));\n }\n\n setLinearMetrics(linearMetrics: boolean) {\n this.ref.setLinearMetrics(linearMetrics);\n }\n\n setScaleX(sx: number) {\n this.ref.setScaleX(sx);\n }\n\n setSize(points: number) {\n this.ref.setSize(points);\n }\n\n setSkewX(sx: number) {\n this.ref.setSkewX(sx);\n }\n\n setEmbolden(embolden: boolean) {\n this.ref.setEmbolden(embolden);\n }\n\n setSubpixel(subpixel: boolean) {\n this.ref.setSubpixel(subpixel);\n }\n\n setTypeface(face: SkTypeface | null) {\n this.ref.setTypeface(face ? toValue(face) : null);\n }\n}\n"]}
|
|
@@ -32,6 +32,10 @@ class JsiSkMatrix extends _Host.HostObject {
|
|
|
32
32
|
this.concat(new JsiSkMatrix(this.CanvasKit, Float32Array.of(...this.CanvasKit.Matrix.rotated(value))));
|
|
33
33
|
}
|
|
34
34
|
|
|
35
|
+
identity() {
|
|
36
|
+
this.ref.set(this.CanvasKit.Matrix.identity());
|
|
37
|
+
}
|
|
38
|
+
|
|
35
39
|
}
|
|
36
40
|
|
|
37
41
|
exports.JsiSkMatrix = JsiSkMatrix;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["JsiSkMatrix.ts"],"names":["JsiSkMatrix","HostObject","constructor","CanvasKit","ref","concat","matrix","set","Matrix","multiply","translate","x","y","Float32Array","of","translated","scale","scaled","skew","skewed","rotate","value","rotated"],"mappings":";;;;;;;AAIA;;AAEO,MAAMA,WAAN,SACGC,gBADH,CAGP;AACEC,EAAAA,WAAW,CAACC,SAAD,EAAuBC,GAAvB,EAAuC;AAChD,UAAMD,SAAN,EAAiBC,GAAjB,EAAsB,QAAtB;AACD;;AAEDC,EAAAA,MAAM,CAACC,MAAD,EAAmB;AACvB,SAAKF,GAAL,CAASG,GAAT,CAAa,KAAKJ,SAAL,CAAeK,MAAf,CAAsBC,QAAtB,CAA+B,KAAKL,GAApC,EAAyC,mBAAQE,MAAR,CAAzC,CAAb;AACD;;AAEDI,EAAAA,SAAS,CAACC,CAAD,EAAYC,CAAZ,EAAuB;AAC9B,SAAKP,MAAL,CACE,IAAIL,WAAJ,CACE,KAAKG,SADP,EAEEU,YAAY,CAACC,EAAb,CAAgB,GAAG,KAAKX,SAAL,CAAeK,MAAf,CAAsBO,UAAtB,CAAiCJ,CAAjC,EAAoCC,CAApC,CAAnB,CAFF,CADF;AAMD;;AAEDI,EAAAA,KAAK,CAACL,CAAD,EAAYC,CAAZ,EAAwB;AAC3B,SAAKP,MAAL,CACE,IAAIL,WAAJ,CACE,KAAKG,SADP,EAEEU,YAAY,CAACC,EAAb,CAAgB,GAAG,KAAKX,SAAL,CAAeK,MAAf,CAAsBS,MAAtB,CAA6BN,CAA7B,EAAgCC,CAAhC,aAAgCA,CAAhC,cAAgCA,CAAhC,GAAqCD,CAArC,CAAnB,CAFF,CADF;AAMD;;AAEDO,EAAAA,IAAI,CAACP,CAAD,EAAYC,CAAZ,EAAuB;AACzB,SAAKP,MAAL,CACE,IAAIL,WAAJ,CACE,KAAKG,SADP,EAEEU,YAAY,CAACC,EAAb,CAAgB,GAAG,KAAKX,SAAL,CAAeK,MAAf,CAAsBW,MAAtB,CAA6BR,CAA7B,EAAgCC,CAAhC,CAAnB,CAFF,CADF;AAMD;;AAEDQ,EAAAA,MAAM,CAACC,KAAD,EAAgB;AACpB,SAAKhB,MAAL,CACE,IAAIL,WAAJ,CACE,KAAKG,SADP,EAEEU,YAAY,CAACC,EAAb,CAAgB,GAAG,KAAKX,SAAL,CAAeK,MAAf,CAAsBc,OAAtB,CAA8BD,KAA9B,CAAnB,CAFF,CADF;AAMD;;
|
|
1
|
+
{"version":3,"sources":["JsiSkMatrix.ts"],"names":["JsiSkMatrix","HostObject","constructor","CanvasKit","ref","concat","matrix","set","Matrix","multiply","translate","x","y","Float32Array","of","translated","scale","scaled","skew","skewed","rotate","value","rotated","identity"],"mappings":";;;;;;;AAIA;;AAEO,MAAMA,WAAN,SACGC,gBADH,CAGP;AACEC,EAAAA,WAAW,CAACC,SAAD,EAAuBC,GAAvB,EAAuC;AAChD,UAAMD,SAAN,EAAiBC,GAAjB,EAAsB,QAAtB;AACD;;AAEDC,EAAAA,MAAM,CAACC,MAAD,EAAmB;AACvB,SAAKF,GAAL,CAASG,GAAT,CAAa,KAAKJ,SAAL,CAAeK,MAAf,CAAsBC,QAAtB,CAA+B,KAAKL,GAApC,EAAyC,mBAAQE,MAAR,CAAzC,CAAb;AACD;;AAEDI,EAAAA,SAAS,CAACC,CAAD,EAAYC,CAAZ,EAAuB;AAC9B,SAAKP,MAAL,CACE,IAAIL,WAAJ,CACE,KAAKG,SADP,EAEEU,YAAY,CAACC,EAAb,CAAgB,GAAG,KAAKX,SAAL,CAAeK,MAAf,CAAsBO,UAAtB,CAAiCJ,CAAjC,EAAoCC,CAApC,CAAnB,CAFF,CADF;AAMD;;AAEDI,EAAAA,KAAK,CAACL,CAAD,EAAYC,CAAZ,EAAwB;AAC3B,SAAKP,MAAL,CACE,IAAIL,WAAJ,CACE,KAAKG,SADP,EAEEU,YAAY,CAACC,EAAb,CAAgB,GAAG,KAAKX,SAAL,CAAeK,MAAf,CAAsBS,MAAtB,CAA6BN,CAA7B,EAAgCC,CAAhC,aAAgCA,CAAhC,cAAgCA,CAAhC,GAAqCD,CAArC,CAAnB,CAFF,CADF;AAMD;;AAEDO,EAAAA,IAAI,CAACP,CAAD,EAAYC,CAAZ,EAAuB;AACzB,SAAKP,MAAL,CACE,IAAIL,WAAJ,CACE,KAAKG,SADP,EAEEU,YAAY,CAACC,EAAb,CAAgB,GAAG,KAAKX,SAAL,CAAeK,MAAf,CAAsBW,MAAtB,CAA6BR,CAA7B,EAAgCC,CAAhC,CAAnB,CAFF,CADF;AAMD;;AAEDQ,EAAAA,MAAM,CAACC,KAAD,EAAgB;AACpB,SAAKhB,MAAL,CACE,IAAIL,WAAJ,CACE,KAAKG,SADP,EAEEU,YAAY,CAACC,EAAb,CAAgB,GAAG,KAAKX,SAAL,CAAeK,MAAf,CAAsBc,OAAtB,CAA8BD,KAA9B,CAAnB,CAFF,CADF;AAMD;;AAEDE,EAAAA,QAAQ,GAAG;AACT,SAAKnB,GAAL,CAASG,GAAT,CAAa,KAAKJ,SAAL,CAAeK,MAAf,CAAsBe,QAAtB,EAAb;AACD;;AA/CH","sourcesContent":["import type { CanvasKit, Matrix3x3 } from \"canvaskit-wasm\";\n\nimport type { SkMatrix } from \"../types\";\n\nimport { HostObject, toValue } from \"./Host\";\n\nexport class JsiSkMatrix\n extends HostObject<Matrix3x3, \"Matrix\">\n implements SkMatrix\n{\n constructor(CanvasKit: CanvasKit, ref: Matrix3x3) {\n super(CanvasKit, ref, \"Matrix\");\n }\n\n concat(matrix: SkMatrix) {\n this.ref.set(this.CanvasKit.Matrix.multiply(this.ref, toValue(matrix)));\n }\n\n translate(x: number, y: number) {\n this.concat(\n new JsiSkMatrix(\n this.CanvasKit,\n Float32Array.of(...this.CanvasKit.Matrix.translated(x, y))\n )\n );\n }\n\n scale(x: number, y?: number) {\n this.concat(\n new JsiSkMatrix(\n this.CanvasKit,\n Float32Array.of(...this.CanvasKit.Matrix.scaled(x, y ?? x))\n )\n );\n }\n\n skew(x: number, y: number) {\n this.concat(\n new JsiSkMatrix(\n this.CanvasKit,\n Float32Array.of(...this.CanvasKit.Matrix.skewed(x, y))\n )\n );\n }\n\n rotate(value: number) {\n this.concat(\n new JsiSkMatrix(\n this.CanvasKit,\n Float32Array.of(...this.CanvasKit.Matrix.rotated(value))\n )\n );\n }\n\n identity() {\n this.ref.set(this.CanvasKit.Matrix.identity());\n }\n}\n"]}
|
|
@@ -3,16 +3,10 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.ValueApi = void 0;
|
|
7
7
|
const {
|
|
8
8
|
SkiaValueApi
|
|
9
9
|
} = global;
|
|
10
10
|
const ValueApi = SkiaValueApi;
|
|
11
11
|
exports.ValueApi = ValueApi;
|
|
12
|
-
const {
|
|
13
|
-
createValue,
|
|
14
|
-
createComputedValue
|
|
15
|
-
} = ValueApi;
|
|
16
|
-
exports.createComputedValue = createComputedValue;
|
|
17
|
-
exports.createValue = createValue;
|
|
18
12
|
//# sourceMappingURL=api.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["api.ts"],"names":["SkiaValueApi","global","ValueApi"
|
|
1
|
+
{"version":3,"sources":["api.ts"],"names":["SkiaValueApi","global","ValueApi"],"mappings":";;;;;;AAMA,MAAM;AAAEA,EAAAA;AAAF,IAAmBC,MAAzB;AACO,MAAMC,QAAQ,GAAGF,YAAjB","sourcesContent":["import type { ISkiaValueApi } from \"./types\";\n\ndeclare global {\n var SkiaValueApi: ISkiaValueApi;\n}\n\nconst { SkiaValueApi } = global;\nexport const ValueApi = SkiaValueApi;\n"]}
|
|
@@ -9,7 +9,7 @@ var _react = require("react");
|
|
|
9
9
|
|
|
10
10
|
var _api = require("../api");
|
|
11
11
|
|
|
12
|
-
var
|
|
12
|
+
var _Animations = require("../../renderer/processors/Animations");
|
|
13
13
|
|
|
14
14
|
/**
|
|
15
15
|
* Creates a new computed value - a value that will calculate its value depending
|
|
@@ -18,7 +18,7 @@ var _processors = require("../../renderer/processors");
|
|
|
18
18
|
* @param values Dependant values
|
|
19
19
|
* @returns A readonly value
|
|
20
20
|
*/
|
|
21
|
-
const useComputedValue = (cb, values) => (0, _react.useMemo)(() => _api.ValueApi.createComputedValue(cb, values.filter(
|
|
21
|
+
const useComputedValue = (cb, values) => (0, _react.useMemo)(() => _api.ValueApi.createComputedValue(cb, values.filter(_Animations.isValue)), // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
22
22
|
values);
|
|
23
23
|
|
|
24
24
|
exports.useComputedValue = useComputedValue;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useComputedValue.ts"],"names":["useComputedValue","cb","values","ValueApi","createComputedValue","filter","isValue","useDerivedValue","console","warn"],"mappings":";;;;;;;AAAA;;AAEA;;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMA,gBAAgB,GAAG,CAAIC,EAAJ,EAAiBC,MAAjB,KAC9B,oBACE,MAAMC,cAASC,mBAAT,CAAgCH,EAAhC,EAAoCC,MAAM,CAACG,MAAP,CAAcC,mBAAd,CAApC,CADR,EAEE;AACAJ,MAHF,CADK;;;;AAOA,MAAMK,eAAe,GAAG,CAAIN,EAAJ,EAAiBC,MAAjB,KAAuC;AACpEM,EAAAA,OAAO,CAACC,IAAR,CAAa,8DAAb;AACA,SAAOT,gBAAgB,CAACC,EAAD,EAAKC,MAAL,CAAvB;AACD,CAHM","sourcesContent":["import { useMemo } from \"react\";\n\nimport { ValueApi } from \"../api\";\nimport { isValue } from \"../../renderer/processors\";\n\n/**\n * Creates a new computed value - a value that will calculate its value depending\n * on other values.\n * @param cb Callback to calculate new value\n * @param values Dependant values\n * @returns A readonly value\n */\nexport const useComputedValue = <R>(cb: () => R, values: unknown[]) =>\n useMemo(\n () => ValueApi.createComputedValue<R>(cb, values.filter(isValue)),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n values\n );\n\nexport const useDerivedValue = <R>(cb: () => R, values: unknown[]) => {\n console.warn(\"useDerivedValue is deprecated. Use useComputedValue instead.\");\n return useComputedValue(cb, values);\n};\n"]}
|
|
1
|
+
{"version":3,"sources":["useComputedValue.ts"],"names":["useComputedValue","cb","values","ValueApi","createComputedValue","filter","isValue","useDerivedValue","console","warn"],"mappings":";;;;;;;AAAA;;AAEA;;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMA,gBAAgB,GAAG,CAAIC,EAAJ,EAAiBC,MAAjB,KAC9B,oBACE,MAAMC,cAASC,mBAAT,CAAgCH,EAAhC,EAAoCC,MAAM,CAACG,MAAP,CAAcC,mBAAd,CAApC,CADR,EAEE;AACAJ,MAHF,CADK;;;;AAOA,MAAMK,eAAe,GAAG,CAAIN,EAAJ,EAAiBC,MAAjB,KAAuC;AACpEM,EAAAA,OAAO,CAACC,IAAR,CAAa,8DAAb;AACA,SAAOT,gBAAgB,CAACC,EAAD,EAAKC,MAAL,CAAvB;AACD,CAHM","sourcesContent":["import { useMemo } from \"react\";\n\nimport { ValueApi } from \"../api\";\nimport { isValue } from \"../../renderer/processors/Animations\";\n\n/**\n * Creates a new computed value - a value that will calculate its value depending\n * on other values.\n * @param cb Callback to calculate new value\n * @param values Dependant values\n * @returns A readonly value\n */\nexport const useComputedValue = <R>(cb: () => R, values: unknown[]) =>\n useMemo(\n () => ValueApi.createComputedValue<R>(cb, values.filter(isValue)),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n values\n );\n\nexport const useDerivedValue = <R>(cb: () => R, values: unknown[]) => {\n console.warn(\"useDerivedValue is deprecated. Use useComputedValue instead.\");\n return useComputedValue(cb, values);\n};\n"]}
|
|
@@ -58,23 +58,23 @@ class SkiaView extends _react.default.Component {
|
|
|
58
58
|
this.setState({
|
|
59
59
|
width: evt.nativeEvent.layout.width,
|
|
60
60
|
height: evt.nativeEvent.layout.height
|
|
61
|
-
})
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
61
|
+
}, () => {
|
|
62
|
+
// Reset canvas / surface on layout change
|
|
63
|
+
if (this._canvasRef.current) {
|
|
64
|
+
// Create surface
|
|
65
|
+
this._surface = new _JsiSkSurface.JsiSkSurface(global.CanvasKit, global.CanvasKit.MakeWebGLCanvasSurface(this._canvasRef.current)); // Get canvas and repaint
|
|
66
|
+
|
|
67
|
+
if (this._surface) {
|
|
68
|
+
this._canvas = this._surface.getCanvas();
|
|
69
|
+
this.redraw();
|
|
70
|
+
}
|
|
71
71
|
}
|
|
72
|
-
}
|
|
72
|
+
});
|
|
73
73
|
}
|
|
74
74
|
|
|
75
75
|
componentDidMount() {
|
|
76
76
|
// Start render loop
|
|
77
|
-
this.
|
|
77
|
+
this.tick();
|
|
78
78
|
}
|
|
79
79
|
|
|
80
80
|
componentWillUnmount() {
|
|
@@ -100,7 +100,7 @@ class SkiaView extends _react.default.Component {
|
|
|
100
100
|
*/
|
|
101
101
|
|
|
102
102
|
|
|
103
|
-
|
|
103
|
+
tick() {
|
|
104
104
|
if (this._mode === "continuous" || this._redrawRequests > 0) {
|
|
105
105
|
this._redrawRequests = 0;
|
|
106
106
|
|
|
@@ -113,7 +113,7 @@ class SkiaView extends _react.default.Component {
|
|
|
113
113
|
height: this.state.height,
|
|
114
114
|
width: this.state.width,
|
|
115
115
|
timestamp: Date.now(),
|
|
116
|
-
touches: [
|
|
116
|
+
touches: touches.map(t => [t])
|
|
117
117
|
};
|
|
118
118
|
this.props.onDraw && this.props.onDraw(this._canvas, info);
|
|
119
119
|
(_this$_surface2 = this._surface) === null || _this$_surface2 === void 0 ? void 0 : _this$_surface2.ref.flush();
|
|
@@ -122,11 +122,11 @@ class SkiaView extends _react.default.Component {
|
|
|
122
122
|
|
|
123
123
|
|
|
124
124
|
if (!this._unmounted) {
|
|
125
|
-
requestAnimationFrame(this.
|
|
125
|
+
requestAnimationFrame(this.tick.bind(this));
|
|
126
126
|
}
|
|
127
127
|
}
|
|
128
128
|
|
|
129
|
-
|
|
129
|
+
redraw() {
|
|
130
130
|
this._redrawRequests++;
|
|
131
131
|
}
|
|
132
132
|
/**
|
|
@@ -142,7 +142,7 @@ class SkiaView extends _react.default.Component {
|
|
|
142
142
|
|
|
143
143
|
setDrawMode(mode) {
|
|
144
144
|
this._mode = mode;
|
|
145
|
-
this.
|
|
145
|
+
this.tick();
|
|
146
146
|
}
|
|
147
147
|
/**
|
|
148
148
|
* Registers one or move values as a dependant value of the Skia View. The view will
|
|
@@ -157,7 +157,7 @@ class SkiaView extends _react.default.Component {
|
|
|
157
157
|
|
|
158
158
|
_values.forEach(v => {
|
|
159
159
|
this._unsubscriptions.push(v.addListener(() => {
|
|
160
|
-
this.
|
|
160
|
+
this.redraw();
|
|
161
161
|
}));
|
|
162
162
|
});
|
|
163
163
|
}
|
|
@@ -172,23 +172,11 @@ class SkiaView extends _react.default.Component {
|
|
|
172
172
|
timestamp: Date.now()
|
|
173
173
|
});
|
|
174
174
|
|
|
175
|
-
this.
|
|
176
|
-
}
|
|
177
|
-
|
|
178
|
-
handleTouchStart(evt) {
|
|
179
|
-
this.handleTouchEvent(evt, _types.TouchType.Start);
|
|
180
|
-
}
|
|
181
|
-
|
|
182
|
-
handleTouchMove(evt) {
|
|
183
|
-
this.handleTouchEvent(evt, _types.TouchType.Active);
|
|
184
|
-
}
|
|
185
|
-
|
|
186
|
-
handleTouchEnd(evt) {
|
|
187
|
-
this.handleTouchEvent(evt, _types.TouchType.Cancelled);
|
|
175
|
+
this.redraw();
|
|
188
176
|
}
|
|
189
177
|
|
|
190
|
-
|
|
191
|
-
this.handleTouchEvent(evt,
|
|
178
|
+
createTouchHandler(touchType) {
|
|
179
|
+
return evt => this.handleTouchEvent(evt, touchType);
|
|
192
180
|
}
|
|
193
181
|
|
|
194
182
|
render() {
|
|
@@ -203,10 +191,12 @@ class SkiaView extends _react.default.Component {
|
|
|
203
191
|
ref: this._canvasRef,
|
|
204
192
|
width: this.state.width,
|
|
205
193
|
height: this.state.height,
|
|
206
|
-
onPointerDown: this.
|
|
207
|
-
onPointerMove: this.
|
|
208
|
-
onPointerUp: this.
|
|
209
|
-
onPointerCancel: this.
|
|
194
|
+
onPointerDown: this.createTouchHandler(_types.TouchType.Start),
|
|
195
|
+
onPointerMove: this.createTouchHandler(_types.TouchType.Active),
|
|
196
|
+
onPointerUp: this.createTouchHandler(_types.TouchType.End),
|
|
197
|
+
onPointerCancel: this.createTouchHandler(_types.TouchType.Cancelled),
|
|
198
|
+
onPointerLeave: this.createTouchHandler(_types.TouchType.End),
|
|
199
|
+
onPointerOut: this.createTouchHandler(_types.TouchType.End)
|
|
210
200
|
}));
|
|
211
201
|
}
|
|
212
202
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["SkiaView.web.tsx"],"names":["SkiaView","React","Component","constructor","props","createRef","state","width","height","_mode","mode","unsubscribeAll","_unsubscriptions","forEach","u","onLayout","evt","setState","nativeEvent","layout","_canvasRef","current","_surface","JsiSkSurface","global","CanvasKit","MakeCanvasSurface","_canvas","getCanvas","requestRedraw","redraw","componentDidMount","componentWillUnmount","_unmounted","makeImageSnapshot","rect","_redrawRequests","onDraw","touches","_touches","info","timestamp","Date","now","ref","flush","requestAnimationFrame","bind","setDrawMode","registerValues","_values","v","push","addListener","handleTouchEvent","touchType","id","pointerId","x","clientX","currentTarget","getClientRects","left","y","clientY","top","force","pressure","type","handleTouchStart","TouchType","Start","handleTouchMove","Active","handleTouchEnd","Cancelled","handleTouchCancel","End","render","debug","viewProps"],"mappings":"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","sourcesContent":["/* global HTMLCanvasElement */\nimport React from \"react\";\nimport type { PointerEvent } from \"react\";\nimport type { LayoutChangeEvent } from \"react-native\";\nimport { 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 { DrawingInfo, DrawMode, SkiaViewProps, TouchInfo } from \"./types\";\nimport { TouchType } from \"./types\";\n\nexport class SkiaView extends React.Component<\n SkiaViewProps,\n { width: number; height: number }\n> {\n constructor(props: SkiaViewProps) {\n super(props);\n this.state = { width: -1, height: -1 };\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.RefObject<HTMLCanvasElement> = React.createRef();\n private _mode: DrawMode;\n private _redrawRequests = 0;\n private _unmounted = false;\n\n private unsubscribeAll() {\n this._unsubscriptions.forEach((u) => u());\n this._unsubscriptions = [];\n }\n\n private onLayout(evt: LayoutChangeEvent) {\n this.setState({\n width: evt.nativeEvent.layout.width,\n height: evt.nativeEvent.layout.height,\n });\n // Reset canvas / surface on layout change\n if (this._canvasRef.current) {\n // Create surface\n this._surface = new JsiSkSurface(\n global.CanvasKit,\n global.CanvasKit.MakeCanvasSurface(this._canvasRef.current)!\n );\n // Get canvas and repaint\n if (this._surface) {\n this._canvas = this._surface.getCanvas();\n this.requestRedraw();\n this.redraw();\n }\n }\n }\n\n componentDidMount() {\n // Start render loop\n this.redraw();\n }\n\n componentWillUnmount() {\n this.unsubscribeAll();\n this._surface = null;\n this._canvas = null;\n this._unmounted = true;\n }\n\n /**\n * Creates a snapshot from the canvas in the surface\n * @param rect Rect to use as bounds. Optional.\n * @returns An Image object.\n */\n public makeImageSnapshot(rect?: SkRect) {\n return this._surface?.makeImageSnapshot(rect);\n }\n\n /**\n * Sends a redraw request to the native SkiaView.\n */\n private redraw() {\n if (this._mode === \"continuous\" || this._redrawRequests > 0) {\n this._redrawRequests = 0;\n if (\n this._canvas &&\n this.props.onDraw &&\n this.state.height !== -1 &&\n this.state.width !== -1\n ) {\n const touches = [...this._touches];\n this._touches = [];\n const info: DrawingInfo = {\n height: this.state.height,\n width: this.state.width,\n timestamp: Date.now(),\n touches: [touches],\n };\n this.props.onDraw && this.props.onDraw(this._canvas!, info);\n this._surface?.ref.flush();\n }\n }\n // Always request a new redraw as long as we're not unmounted\n if (!this._unmounted) {\n requestAnimationFrame(this.redraw.bind(this));\n }\n }\n\n public requestRedraw() {\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.redraw();\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.requestRedraw();\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.requestRedraw();\n }\n\n handleTouchStart(evt: PointerEvent) {\n this.handleTouchEvent(evt, TouchType.Start);\n }\n\n handleTouchMove(evt: PointerEvent) {\n this.handleTouchEvent(evt, TouchType.Active);\n }\n\n handleTouchEnd(evt: PointerEvent) {\n this.handleTouchEvent(evt, TouchType.Cancelled);\n }\n\n handleTouchCancel(evt: PointerEvent) {\n this.handleTouchEvent(evt, TouchType.End);\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 width={this.state.width}\n height={this.state.height}\n onPointerDown={this.handleTouchStart.bind(this)}\n onPointerMove={this.handleTouchMove.bind(this)}\n onPointerUp={this.handleTouchEnd.bind(this)}\n onPointerCancel={this.handleTouchCancel.bind(this)}\n />\n </View>\n );\n }\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["SkiaView.web.tsx"],"names":["SkiaView","React","Component","constructor","props","createRef","state","width","height","_mode","mode","unsubscribeAll","_unsubscriptions","forEach","u","onLayout","evt","setState","nativeEvent","layout","_canvasRef","current","_surface","JsiSkSurface","global","CanvasKit","MakeWebGLCanvasSurface","_canvas","getCanvas","redraw","componentDidMount","tick","componentWillUnmount","_unmounted","makeImageSnapshot","rect","_redrawRequests","onDraw","touches","_touches","info","timestamp","Date","now","map","t","ref","flush","requestAnimationFrame","bind","setDrawMode","registerValues","_values","v","push","addListener","handleTouchEvent","touchType","id","pointerId","x","clientX","currentTarget","getClientRects","left","y","clientY","top","force","pressure","type","createTouchHandler","render","debug","viewProps","TouchType","Start","Active","End","Cancelled"],"mappings":"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","sourcesContent":["/* global HTMLCanvasElement */\nimport React from \"react\";\nimport type { PointerEvent } from \"react\";\nimport type { LayoutChangeEvent } from \"react-native\";\nimport { 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 { DrawingInfo, DrawMode, SkiaViewProps, TouchInfo } from \"./types\";\nimport { TouchType } from \"./types\";\n\nexport class SkiaView extends React.Component<\n SkiaViewProps,\n { width: number; height: number }\n> {\n constructor(props: SkiaViewProps) {\n super(props);\n this.state = { width: -1, height: -1 };\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.RefObject<HTMLCanvasElement> = React.createRef();\n private _mode: DrawMode;\n private _redrawRequests = 0;\n private _unmounted = false;\n\n private unsubscribeAll() {\n this._unsubscriptions.forEach((u) => u());\n this._unsubscriptions = [];\n }\n\n private onLayout(evt: LayoutChangeEvent) {\n this.setState(\n {\n width: evt.nativeEvent.layout.width,\n height: evt.nativeEvent.layout.height,\n },\n () => {\n // Reset canvas / surface on layout change\n if (this._canvasRef.current) {\n // Create surface\n this._surface = new JsiSkSurface(\n global.CanvasKit,\n global.CanvasKit.MakeWebGLCanvasSurface(this._canvasRef.current)!\n );\n // Get canvas and repaint\n if (this._surface) {\n this._canvas = this._surface.getCanvas();\n this.redraw();\n }\n }\n }\n );\n }\n\n componentDidMount() {\n // Start render loop\n this.tick();\n }\n\n componentWillUnmount() {\n this.unsubscribeAll();\n this._surface = null;\n this._canvas = null;\n this._unmounted = true;\n }\n\n /**\n * Creates a snapshot from the canvas in the surface\n * @param rect Rect to use as bounds. Optional.\n * @returns An Image object.\n */\n public makeImageSnapshot(rect?: SkRect) {\n return this._surface?.makeImageSnapshot(rect);\n }\n\n /**\n * 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 (\n this._canvas &&\n this.props.onDraw &&\n this.state.height !== -1 &&\n this.state.width !== -1\n ) {\n const touches = [...this._touches];\n this._touches = [];\n const info: DrawingInfo = {\n height: this.state.height,\n width: this.state.width,\n timestamp: Date.now(),\n touches: touches.map((t) => [t]),\n };\n this.props.onDraw && this.props.onDraw(this._canvas!, info);\n this._surface?.ref.flush();\n }\n }\n // Always request a new redraw as long as we're not unmounted\n if (!this._unmounted) {\n requestAnimationFrame(this.tick.bind(this));\n }\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 width={this.state.width}\n height={this.state.height}\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"]}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.LoadSkiaWeb = exports.LoadSkia = void 0;
|
|
7
|
+
|
|
8
|
+
var _canvaskit = _interopRequireDefault(require("canvaskit-wasm/bin/full/canvaskit"));
|
|
9
|
+
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
+
|
|
12
|
+
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
13
|
+
// @ts-expect-error
|
|
14
|
+
const LoadSkiaWeb = async opts => {
|
|
15
|
+
if (global.CanvasKit !== undefined) {
|
|
16
|
+
return;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
const CanvasKit = await (0, _canvaskit.default)(opts); // The CanvasKit API is stored on the global object and used
|
|
20
|
+
// to create the JsiSKApi in the Skia.web.ts file.
|
|
21
|
+
|
|
22
|
+
global.CanvasKit = CanvasKit;
|
|
23
|
+
}; // We keep this function for backward compatibility
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
exports.LoadSkiaWeb = LoadSkiaWeb;
|
|
27
|
+
const LoadSkia = LoadSkiaWeb;
|
|
28
|
+
exports.LoadSkia = LoadSkia;
|
|
29
|
+
//# sourceMappingURL=LoadSkiaWeb.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["LoadSkiaWeb.tsx"],"names":["LoadSkiaWeb","opts","global","CanvasKit","undefined","LoadSkia"],"mappings":";;;;;;;AAEA;;;;AAFA;AACA;AAWO,MAAMA,WAAW,GAAG,MAAOC,IAAP,IAAuC;AAChE,MAAIC,MAAM,CAACC,SAAP,KAAqBC,SAAzB,EAAoC;AAClC;AACD;;AACD,QAAMD,SAAS,GAAG,MAAM,wBAAcF,IAAd,CAAxB,CAJgE,CAKhE;AACA;;AACAC,EAAAA,MAAM,CAACC,SAAP,GAAmBA,SAAnB;AACD,CARM,C,CAUP;;;;AACO,MAAME,QAAQ,GAAGL,WAAjB","sourcesContent":["// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-expect-error\nimport CanvasKitInit from \"canvaskit-wasm/bin/full/canvaskit\";\nimport type {\n CanvasKit as CanvasKitType,\n CanvasKitInitOptions,\n} from \"canvaskit-wasm\";\n\ndeclare global {\n var CanvasKit: CanvasKitType;\n}\n\nexport const LoadSkiaWeb = async (opts?: CanvasKitInitOptions) => {\n if (global.CanvasKit !== undefined) {\n return;\n }\n const CanvasKit = await CanvasKitInit(opts);\n // The CanvasKit API is stored on the global object and used\n // to create the JsiSKApi in the Skia.web.ts file.\n global.CanvasKit = CanvasKit;\n};\n\n// We keep this function for backward compatibility\nexport const LoadSkia = LoadSkiaWeb;\n"]}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.WithSkiaWeb = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
+
|
|
10
|
+
var _reactNative = require("react-native");
|
|
11
|
+
|
|
12
|
+
var _LoadSkiaWeb = require("./LoadSkiaWeb");
|
|
13
|
+
|
|
14
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
15
|
+
|
|
16
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
17
|
+
|
|
18
|
+
const WithSkiaWeb = _ref => {
|
|
19
|
+
let {
|
|
20
|
+
getComponent,
|
|
21
|
+
fallback,
|
|
22
|
+
opts
|
|
23
|
+
} = _ref;
|
|
24
|
+
const Inner = (0, _react.useMemo)(() => /*#__PURE__*/(0, _react.lazy)(async () => {
|
|
25
|
+
if (_reactNative.Platform.OS === "web") {
|
|
26
|
+
await (0, _LoadSkiaWeb.LoadSkiaWeb)(opts);
|
|
27
|
+
} else {
|
|
28
|
+
console.warn("<WithSkiaWeb /> is only necessary on web. Consider not using on native.");
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
return getComponent();
|
|
32
|
+
}), [getComponent, opts]);
|
|
33
|
+
return /*#__PURE__*/_react.default.createElement(_react.Suspense, {
|
|
34
|
+
fallback: fallback !== null && fallback !== void 0 ? fallback : null
|
|
35
|
+
}, /*#__PURE__*/_react.default.createElement(Inner, null));
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
exports.WithSkiaWeb = WithSkiaWeb;
|
|
39
|
+
//# sourceMappingURL=WithSkiaWeb.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["WithSkiaWeb.tsx"],"names":["WithSkiaWeb","getComponent","fallback","opts","Inner","Platform","OS","console","warn"],"mappings":";;;;;;;AACA;;AACA;;AAEA;;;;;;AAQO,MAAMA,WAAW,GAAG,QAIN;AAAA,MAJO;AAC1BC,IAAAA,YAD0B;AAE1BC,IAAAA,QAF0B;AAG1BC,IAAAA;AAH0B,GAIP;AACnB,QAAMC,KAAK,GAAG,oBACZ,mBACE,iBAAK,YAAY;AACf,QAAIC,sBAASC,EAAT,KAAgB,KAApB,EAA2B;AACzB,YAAM,8BAAYH,IAAZ,CAAN;AACD,KAFD,MAEO;AACLI,MAAAA,OAAO,CAACC,IAAR,CACE,yEADF;AAGD;;AACD,WAAOP,YAAY,EAAnB;AACD,GATD,CAFU,EAYZ,CAACA,YAAD,EAAeE,IAAf,CAZY,CAAd;AAcA,sBACE,6BAAC,eAAD;AAAU,IAAA,QAAQ,EAAED,QAAF,aAAEA,QAAF,cAAEA,QAAF,GAAc;AAAhC,kBACE,6BAAC,KAAD,OADF,CADF;AAKD,CAxBM","sourcesContent":["import type { ComponentProps, ComponentType } from \"react\";\nimport React, { useMemo, lazy, Suspense } from \"react\";\nimport { Platform } from \"react-native\";\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 () =>\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"]}
|
|
@@ -3,20 +3,30 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.LoadSkia = void 0;
|
|
7
6
|
|
|
8
|
-
var
|
|
7
|
+
var _LoadSkiaWeb = require("./LoadSkiaWeb");
|
|
9
8
|
|
|
10
|
-
function
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
9
|
+
Object.keys(_LoadSkiaWeb).forEach(function (key) {
|
|
10
|
+
if (key === "default" || key === "__esModule") return;
|
|
11
|
+
if (key in exports && exports[key] === _LoadSkiaWeb[key]) return;
|
|
12
|
+
Object.defineProperty(exports, key, {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () {
|
|
15
|
+
return _LoadSkiaWeb[key];
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
});
|
|
17
19
|
|
|
18
|
-
|
|
19
|
-
};
|
|
20
|
+
var _WithSkiaWeb = require("./WithSkiaWeb");
|
|
20
21
|
|
|
21
|
-
|
|
22
|
+
Object.keys(_WithSkiaWeb).forEach(function (key) {
|
|
23
|
+
if (key === "default" || key === "__esModule") return;
|
|
24
|
+
if (key in exports && exports[key] === _WithSkiaWeb[key]) return;
|
|
25
|
+
Object.defineProperty(exports, key, {
|
|
26
|
+
enumerable: true,
|
|
27
|
+
get: function () {
|
|
28
|
+
return _WithSkiaWeb[key];
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
});
|
|
22
32
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.ts"],"names":[
|
|
1
|
+
{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from \"./LoadSkiaWeb\";\nexport * from \"./WithSkiaWeb\";\n"]}
|
|
@@ -31,7 +31,7 @@ function isExtrapolate(value) {
|
|
|
31
31
|
// if type is correct, converts it to ExtrapolationConfig
|
|
32
32
|
|
|
33
33
|
|
|
34
|
-
function
|
|
34
|
+
export function validateInterpolationOptions(type) {
|
|
35
35
|
// initialize extrapolationConfig with default extrapolation
|
|
36
36
|
const extrapolationConfig = {
|
|
37
37
|
extrapolateLeft: Extrapolate.EXTEND,
|
|
@@ -97,7 +97,7 @@ export function interpolate(x, input, output, type) {
|
|
|
97
97
|
throw Error("Interpolation input and output should contain at least two values.");
|
|
98
98
|
}
|
|
99
99
|
|
|
100
|
-
const extrapolationConfig =
|
|
100
|
+
const extrapolationConfig = validateInterpolationOptions(type);
|
|
101
101
|
const {
|
|
102
102
|
length
|
|
103
103
|
} = input;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["interpolate.ts"],"names":["Extrapolate","getVal","type","coef","val","leftEdgeOutput","rightEdgeOutput","x","IDENTITY","CLAMP","EXTEND","isExtrapolate","value","
|
|
1
|
+
{"version":3,"sources":["interpolate.ts"],"names":["Extrapolate","getVal","type","coef","val","leftEdgeOutput","rightEdgeOutput","x","IDENTITY","CLAMP","EXTEND","isExtrapolate","value","validateInterpolationOptions","extrapolationConfig","extrapolateLeft","extrapolateRight","Error","Object","assign","internalInterpolate","narrowedInput","leftEdgeInput","rightEdgeInput","progress","interpolate","input","output","length","i"],"mappings":"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","sourcesContent":["/* eslint-disable max-len */\nexport enum Extrapolate {\n IDENTITY = \"identity\",\n CLAMP = \"clamp\",\n EXTEND = \"extend\",\n}\n\ninterface InterpolationNarrowedInput {\n leftEdgeInput: number;\n rightEdgeInput: number;\n leftEdgeOutput: number;\n rightEdgeOutput: number;\n}\n\nexport interface ExtrapolationConfig {\n extrapolateLeft?: Extrapolate | string;\n extrapolateRight?: Extrapolate | string;\n}\n\ninterface RequiredExtrapolationConfig {\n extrapolateLeft: Extrapolate;\n extrapolateRight: Extrapolate;\n}\n\nexport type ExtrapolationType =\n | ExtrapolationConfig\n | Extrapolate\n | string\n | undefined;\n\nfunction getVal(\n type: Extrapolate,\n coef: number,\n val: number,\n leftEdgeOutput: number,\n rightEdgeOutput: number,\n x: number\n): number {\n switch (type) {\n case Extrapolate.IDENTITY:\n return x;\n case Extrapolate.CLAMP:\n if (coef * val < coef * leftEdgeOutput) {\n return leftEdgeOutput;\n }\n return rightEdgeOutput;\n case Extrapolate.EXTEND:\n default:\n return val;\n }\n}\n\nfunction isExtrapolate(value: string): value is Extrapolate {\n return (\n value === Extrapolate.EXTEND ||\n value === Extrapolate.CLAMP ||\n value === Extrapolate.IDENTITY\n );\n}\n\n// validates extrapolations type\n// if type is correct, converts it to ExtrapolationConfig\nexport function validateInterpolationOptions(\n type: ExtrapolationType\n): RequiredExtrapolationConfig {\n // initialize extrapolationConfig with default extrapolation\n const extrapolationConfig: RequiredExtrapolationConfig = {\n extrapolateLeft: Extrapolate.EXTEND,\n extrapolateRight: Extrapolate.EXTEND,\n };\n\n if (!type) {\n return extrapolationConfig;\n }\n\n if (typeof type === \"string\") {\n if (!isExtrapolate(type)) {\n throw new Error(\n `No supported value for \"interpolate\" \\nSupported values: [\"extend\", \"clamp\", \"identity\", Extrapolatation.CLAMP, Extrapolatation.EXTEND, Extrapolatation.IDENTITY]\\n Valid example:\n interpolate(value, [inputRange], [outputRange], \"clamp\")`\n );\n }\n extrapolationConfig.extrapolateLeft = type;\n extrapolationConfig.extrapolateRight = type;\n return extrapolationConfig;\n }\n\n // otherwise type is extrapolation config object\n if (\n (type.extrapolateLeft && !isExtrapolate(type.extrapolateLeft)) ||\n (type.extrapolateRight && !isExtrapolate(type.extrapolateRight))\n ) {\n throw new Error(\n `No supported value for \"interpolate\" \\nSupported values: [\"extend\", \"clamp\", \"identity\", Extrapolatation.CLAMP, Extrapolatation.EXTEND, Extrapolatation.IDENTITY]\\n Valid example:\n interpolate(value, [inputRange], [outputRange], {\n extrapolateLeft: Extrapolation.CLAMP,\n extrapolateRight: Extrapolation.IDENTITY\n }})`\n );\n }\n\n Object.assign(extrapolationConfig, type);\n return extrapolationConfig;\n}\n\nfunction internalInterpolate(\n x: number,\n narrowedInput: InterpolationNarrowedInput,\n extrapolationConfig: RequiredExtrapolationConfig\n) {\n const { leftEdgeInput, rightEdgeInput, leftEdgeOutput, rightEdgeOutput } =\n narrowedInput;\n if (rightEdgeInput - leftEdgeInput === 0) {\n return leftEdgeOutput;\n }\n const progress = (x - leftEdgeInput) / (rightEdgeInput - leftEdgeInput);\n const val = leftEdgeOutput + progress * (rightEdgeOutput - leftEdgeOutput);\n const coef = rightEdgeOutput >= leftEdgeOutput ? 1 : -1;\n\n if (coef * val < coef * leftEdgeOutput) {\n return getVal(\n extrapolationConfig.extrapolateLeft,\n coef,\n val,\n leftEdgeOutput,\n rightEdgeOutput,\n x\n );\n } else if (coef * val > coef * rightEdgeOutput) {\n return getVal(\n extrapolationConfig.extrapolateRight,\n coef,\n val,\n leftEdgeOutput,\n rightEdgeOutput,\n x\n );\n }\n\n return val;\n}\n\n// e.g. function interpolate(x, input, output, type = Extrapolatation.CLAMP)\nexport function interpolate(\n x: number,\n input: readonly number[],\n output: readonly number[],\n type?: ExtrapolationType\n): number {\n if (input.length < 2 || output.length < 2) {\n throw Error(\n \"Interpolation input and output should contain at least two values.\"\n );\n }\n\n const extrapolationConfig = validateInterpolationOptions(type);\n const { length } = input;\n const narrowedInput: InterpolationNarrowedInput = {\n leftEdgeInput: input[0],\n rightEdgeInput: input[1],\n leftEdgeOutput: output[0],\n rightEdgeOutput: output[1],\n };\n if (length > 2) {\n if (x > input[length - 1]) {\n narrowedInput.leftEdgeInput = input[length - 2];\n narrowedInput.rightEdgeInput = input[length - 1];\n narrowedInput.leftEdgeOutput = output[length - 2];\n narrowedInput.rightEdgeOutput = output[length - 1];\n } else {\n for (let i = 1; i < length; ++i) {\n if (x <= input[i]) {\n narrowedInput.leftEdgeInput = input[i - 1];\n narrowedInput.rightEdgeInput = input[i];\n narrowedInput.leftEdgeOutput = output[i - 1];\n narrowedInput.rightEdgeOutput = output[i];\n break;\n }\n }\n }\n }\n\n return internalInterpolate(x, narrowedInput, extrapolationConfig);\n}\n"]}
|