@shopify/react-native-skia 1.4.1 → 1.5.0

package/src/views/SkiaBaseWebView.tsx

@@ -1,14 +1,12 @@
 /* global HTMLCanvasElement */
 import React from "react";
-import type { PointerEvent } from "react";
 import type { LayoutChangeEvent } from "react-native";
 
 import type { SkRect, SkCanvas } from "../skia/types";
 import { JsiSkSurface } from "../skia/web/JsiSkSurface";
 import { Platform } from "../Platform";
 
-import type { DrawMode, SkiaBaseViewProps, TouchInfo } from "./types";
-import { TouchType } from "./types";
+import type { DrawMode, SkiaBaseViewProps } from "./types";
 
 const pd = Platform.PixelRatio;
 
@@ -22,7 +20,6 @@ export abstract class SkiaBaseWebView<
 
   private _surface: JsiSkSurface | null = null;
   private _unsubscriptions: Array<() => void> = [];
-  private _touches: Array<TouchInfo> = [];
   private _canvas: SkCanvas | null = null;
   private _canvasRef = React.createRef<HTMLCanvasElement>();
   private _mode: DrawMode;
@@ -95,7 +92,7 @@ export abstract class SkiaBaseWebView<
    */
   public makeImageSnapshot(rect?: SkRect) {
     this._canvas!.clear(CanvasKit.TRANSPARENT);
-    this.renderInCanvas(this._canvas!, []);
+    this.renderInCanvas(this._canvas!);
     this._surface?.ref.flush();
     return this._surface?.makeImageSnapshot(rect);
   }
@@ -103,10 +100,7 @@ export abstract class SkiaBaseWebView<
   /**
    * Override to render
    */
-  protected abstract renderInCanvas(
-    canvas: SkCanvas,
-    touches: TouchInfo[]
-  ): void;
+  protected abstract renderInCanvas(canvas: SkCanvas): void;
 
   /**
    * Sends a redraw request to the native SkiaView.
@@ -115,13 +109,11 @@ export abstract class SkiaBaseWebView<
     if (this._mode === "continuous" || this._redrawRequests > 0) {
       this._redrawRequests = 0;
       if (this._canvas) {
-        const touches = [...this._touches];
-        this._touches = [];
         const canvas = this._canvas!;
         canvas.clear(Float32Array.of(0, 0, 0, 0));
         canvas.save();
         canvas.scale(pd, pd);
-        this.renderInCanvas(canvas, touches);
+        this.renderInCanvas(canvas);
         canvas.restore();
         this._surface?.ref.flush();
       }
@@ -147,42 +139,13 @@ export abstract class SkiaBaseWebView<
     this.tick();
   }
 
-  private handleTouchEvent(evt: PointerEvent, touchType: TouchType) {
-    this._touches.push({
-      id: evt.pointerId,
-      x: evt.clientX - evt.currentTarget.getClientRects()[0].left,
-      y: evt.clientY - evt.currentTarget.getClientRects()[0].top,
-      force: evt.pressure,
-      type: touchType,
-      timestamp: Date.now(),
-    });
-    this.redraw();
-  }
-
-  createTouchHandler(touchType: TouchType) {
-    return (evt: PointerEvent) => this.handleTouchEvent(evt, touchType);
-  }
-
-  private onStart = this.createTouchHandler(TouchType.Start);
-  private onActive = this.createTouchHandler(TouchType.Active);
-  private onCancel = this.createTouchHandler(TouchType.Cancelled);
-  private onEnd = this.createTouchHandler(TouchType.End);
   private onLayout = this.onLayoutEvent.bind(this);
 
   render() {
     const { mode, debug = false, ...viewProps } = this.props;
     return (
       <Platform.View {...viewProps} onLayout={this.onLayout}>
-        <canvas
-          ref={this._canvasRef}
-          style={{ display: "flex", flex: 1 }}
-          onPointerDown={this.onStart}
-          onPointerMove={this.onActive}
-          onPointerUp={this.onEnd}
-          onPointerCancel={this.onCancel}
-          onPointerLeave={this.onEnd}
-          onPointerOut={this.onEnd}
-        />
+        <canvas ref={this._canvasRef} style={{ display: "flex", flex: 1 }} />
       </Platform.View>
     );
   }

package/src/views/SkiaDomView.tsx

@@ -19,19 +19,11 @@ export class SkiaDomView extends React.Component<SkiaDomViewProps> {
   constructor(props: SkiaDomViewProps) {
     super(props);
     this._nativeId = SkiaViewNativeId.current++;
-    const { root, onTouch, onSize } = props;
+    const { root, onSize } = props;
     if (root) {
       assertSkiaViewApi();
       SkiaViewApi.setJsiProperty(this._nativeId, "root", root);
     }
-    if (onTouch) {
-      assertSkiaViewApi();
-      console.warn(
-        `The onTouch property is deprecated and will be removed in the next Skia release.
-See: https://shopify.github.io/react-native-skia/docs/animations/gestures`
-      );
-      SkiaViewApi.setJsiProperty(this._nativeId, "onTouch", onTouch);
-    }
     if (onSize) {
       assertSkiaViewApi();
       SkiaViewApi.setJsiProperty(this._nativeId, "onSize", onSize);
@@ -45,15 +37,11 @@ See: https://shopify.github.io/react-native-skia/docs/animations/gestures`
   }
 
   componentDidUpdate(prevProps: SkiaDomViewProps) {
-    const { root, onTouch, onSize } = this.props;
+    const { root, onSize } = this.props;
     if (root !== prevProps.root) {
       assertSkiaViewApi();
       SkiaViewApi.setJsiProperty(this._nativeId, "root", root);
     }
-    if (onTouch !== prevProps.onTouch) {
-      assertSkiaViewApi();
-      SkiaViewApi.setJsiProperty(this._nativeId, "onTouch", onTouch);
-    }
     if (onSize !== prevProps.onSize) {
       assertSkiaViewApi();
       SkiaViewApi.setJsiProperty(this._nativeId, "onSize", onSize);

package/src/views/SkiaDomView.web.tsx

@@ -3,21 +3,14 @@ import type { SkCanvas } from "../skia/types";
 import { JsiDrawingContext } from "../dom/types/DrawingContext";
 
 import { SkiaBaseWebView } from "./SkiaBaseWebView";
-import type { SkiaDomViewProps, TouchInfo } from "./types";
+import type { SkiaDomViewProps } from "./types";
 
 export class SkiaDomView extends SkiaBaseWebView<SkiaDomViewProps> {
   constructor(props: SkiaDomViewProps) {
     super(props);
   }
 
-  protected renderInCanvas(canvas: SkCanvas, touches: TouchInfo[]): void {
-    if (this.props.onTouch) {
-      console.warn(
-        `The onTouch property is deprecated and will be removed in the next Skia release.
-See: https://shopify.github.io/react-native-skia/docs/animations/gestures`
-      );
-      this.props.onTouch([touches]);
-    }
+  protected renderInCanvas(canvas: SkCanvas): void {
     if (this.props.onSize) {
       const { width, height } = this.getSize();
       this.props.onSize.value = { width, height };

package/src/views/SkiaJSDomView.tsx

@@ -22,19 +22,11 @@ export class SkiaJSDomView extends React.Component<
   constructor(props: SkiaDomViewProps & { Skia: Skia }) {
     super(props);
     this._nativeId = SkiaViewNativeId.current++;
-    const { root, onTouch, onSize } = props;
+    const { root, onSize } = props;
     if (root) {
       assertSkiaViewApi();
       SkiaViewApi.setJsiProperty(this._nativeId, "root", root);
     }
-    if (onTouch) {
-      assertSkiaViewApi();
-      console.warn(
-        `The onTouch property is deprecated and will be removed in the next Skia release.
-See: https://shopify.github.io/react-native-skia/docs/animations/gestures`
-      );
-      SkiaViewApi.setJsiProperty(this._nativeId, "onTouch", onTouch);
-    }
     if (onSize) {
       assertSkiaViewApi();
       SkiaViewApi.setJsiProperty(this._nativeId, "onSize", onSize);
@@ -48,15 +40,11 @@ See: https://shopify.github.io/react-native-skia/docs/animations/gestures`
   }
 
   componentDidUpdate(prevProps: SkiaDomViewProps & { Skia: Skia }) {
-    const { root, onTouch, onSize } = this.props;
+    const { root, onSize } = this.props;
     if (root !== prevProps.root && root !== undefined) {
       assertSkiaViewApi();
       this.draw();
     }
-    if (onTouch !== prevProps.onTouch) {
-      assertSkiaViewApi();
-      SkiaViewApi.setJsiProperty(this._nativeId, "onTouch", onTouch);
-    }
     if (onSize !== prevProps.onSize) {
       assertSkiaViewApi();
       SkiaViewApi.setJsiProperty(this._nativeId, "onSize", onSize);

package/src/views/index.ts

@@ -1,4 +1,3 @@
 export * from "./SkiaPictureView";
 export * from "./SkiaDomView";
 export * from "./types";
-export * from "./useTouchHandler";

package/src/views/types.ts

@@ -11,43 +11,12 @@ export type NativeSkiaViewProps = ViewProps & {
   debug?: boolean;
 };
 
-export enum TouchType {
-  Start,
-  Active,
-  End,
-  Cancelled,
-}
-
-export interface TouchInfo {
-  x: number;
-  y: number;
-  force: number;
-  type: TouchType;
-  id: number;
-  timestamp: number;
-}
-
 export interface DrawingInfo {
   width: number;
   height: number;
   timestamp: number;
-  touches: Array<Array<TouchInfo>>;
 }
 
-export type ExtendedTouchInfo = TouchInfo & {
-  // points per second
-  velocityX: number;
-  velocityY: number;
-};
-
-export type TouchHandlers = {
-  onStart?: (touchInfo: TouchInfo) => void;
-  onActive?: (touchInfo: ExtendedTouchInfo) => void;
-  onEnd?: (touchInfo: ExtendedTouchInfo) => void;
-};
-
-export type TouchHandler = (touchInfo: Array<Array<TouchInfo>>) => void;
-
 export interface ISkiaViewApi {
   setJsiProperty: <T>(nativeId: number, name: string, value: T) => void;
   requestRedraw: (nativeId: number) => void;
@@ -82,5 +51,4 @@ export interface SkiaPictureViewProps extends SkiaBaseViewProps {
 
 export interface SkiaDomViewProps extends SkiaBaseViewProps {
   root?: RenderNode<GroupProps>;
-  onTouch?: TouchHandler;
 }

package/cpp/rnskia/RNSkInfoParameter.h

@@ -1,92 +0,0 @@
-#pragma once
-
-#include <chrono>
-#include <memory>
-#include <mutex>
-#include <utility>
-#include <vector>
-
-#include <jsi/jsi.h>
-
-#include "JsiHostObject.h"
-#include "RNSkView.h"
-
-namespace RNSkia {
-
-namespace jsi = facebook::jsi;
-
-class RNSkInfoObject : public RNJsi::JsiHostObject {
-public:
-  JSI_PROPERTY_GET(width) { return _width; }
-  JSI_PROPERTY_GET(height) { return _height; }
-  JSI_PROPERTY_GET(timestamp) { return _timestamp; }
-
-  JSI_PROPERTY_GET(touches) {
-    auto ops = jsi::Array(runtime, _touchesCache.size());
-    for (size_t i = 0; i < _touchesCache.size(); i++) {
-      auto cur = _touchesCache.at(i);
-      auto touches = jsi::Array(runtime, cur.size());
-      for (size_t n = 0; n < cur.size(); n++) {
-        auto touchObj = jsi::Object(runtime);
-        auto t = cur.at(n);
-        touchObj.setProperty(runtime, "x", t.x);
-        touchObj.setProperty(runtime, "y", t.y);
-        touchObj.setProperty(runtime, "force", t.force);
-        touchObj.setProperty(runtime, "type", static_cast<double>(t.type));
-        touchObj.setProperty(runtime, "timestamp",
-                             static_cast<double>(t.timestamp / 1000.0));
-        touchObj.setProperty(runtime, "id", static_cast<double>(t.id));
-        touches.setValueAtIndex(runtime, n, touchObj);
-      }
-      ops.setValueAtIndex(runtime, i, touches);
-    }
-    return ops;
-  }
-
-  JSI_EXPORT_PROPERTY_GETTERS(JSI_EXPORT_PROP_GET(RNSkInfoObject, width),
-                              JSI_EXPORT_PROP_GET(RNSkInfoObject, height),
-                              JSI_EXPORT_PROP_GET(RNSkInfoObject, timestamp),
-                              JSI_EXPORT_PROP_GET(RNSkInfoObject, touches))
-
-  void beginDrawOperation(int width, int height, double timestamp) {
-    _width = width;
-    _height = height;
-    _timestamp = timestamp;
-
-    // Copy touches so that we can continue to add/receive touch points while
-    // in the drawing callback.
-    std::lock_guard<std::mutex> lock(_mutex);
-    _touchesCache.clear();
-    _touchesCache.reserve(_currentTouches.size());
-    for (size_t i = 0; i < _currentTouches.size(); ++i) {
-      _touchesCache.push_back(_currentTouches.at(i));
-    }
-    _currentTouches.clear();
-  }
-
-  void endDrawOperation() { _touchesCache.clear(); }
-
-  void updateTouches(std::vector<RNSkTouchInfo> &touches) {
-    std::lock_guard<std::mutex> lock(_mutex);
-    // Add timestamp
-    auto ms = std::chrono::duration_cast<std::chrono::milliseconds>(
-                  std::chrono::system_clock::now().time_since_epoch())
-                  .count();
-
-    for (size_t i = 0; i < touches.size(); i++) {
-      touches.at(i).timestamp = ms;
-    }
-    _currentTouches.push_back(std::move(touches));
-  }
-
-  RNSkInfoObject() : JsiHostObject() {}
-
-private:
-  int _width;
-  int _height;
-  double _timestamp;
-  std::vector<std::vector<RNSkTouchInfo>> _currentTouches;
-  std::vector<std::vector<RNSkTouchInfo>> _touchesCache;
-  std::mutex _mutex;
-};
-} // namespace RNSkia

package/cpp/skia/include/gpu/GrBackendSemaphore.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2017 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/GrBackendSemaphore.h"

package/cpp/skia/include/gpu/GrBackendSurface.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2017 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/GrBackendSurface.h"

package/cpp/skia/include/gpu/GrContextOptions.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2015 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/GrContextOptions.h"

package/cpp/skia/include/gpu/GrContextThreadSafeProxy.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2019 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/GrContextThreadSafeProxy.h"

package/cpp/skia/include/gpu/GrDirectContext.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2020 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/GrDirectContext.h"

package/cpp/skia/include/gpu/GrDriverBugWorkarounds.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2018 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/GrDriverBugWorkarounds.h"

package/cpp/skia/include/gpu/GrDriverBugWorkaroundsAutogen.h

@@ -1,6 +0,0 @@
-// Copyright 2018 The Chromium Authors. All rights reserved.
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/GrDriverBugWorkaroundsAutogen.h"

package/cpp/skia/include/gpu/GrRecordingContext.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2019 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/GrRecordingContext.h"

package/cpp/skia/include/gpu/GrTypes.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2010 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/GrTypes.h"

package/cpp/skia/include/gpu/GrYUVABackendTextures.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2020 Google LLC
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/GrYUVABackendTextures.h"

package/cpp/skia/include/gpu/d3d/GrD3DBackendContext.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2020 Google LLC
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/d3d/GrD3DBackendContext.h"

package/cpp/skia/include/gpu/d3d/GrD3DTypes.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2020 Google LLC
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/d3d/GrD3DTypes.h"

package/cpp/skia/include/gpu/gl/GrGLAssembleHelpers.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2019 Google LLC
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/gl/GrGLAssembleHelpers.h"

package/cpp/skia/include/gpu/gl/GrGLAssembleInterface.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2014 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/gl/GrGLAssembleInterface.h"

package/cpp/skia/include/gpu/gl/GrGLConfig.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2011 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/gl/GrGLConfig.h"

package/cpp/skia/include/gpu/gl/GrGLExtensions.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2013 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/gl/GrGLExtensions.h"

package/cpp/skia/include/gpu/gl/GrGLFunctions.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2012 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/gl/GrGLFunctions.h"

package/cpp/skia/include/gpu/gl/GrGLInterface.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2011 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/gl/GrGLInterface.h"

package/cpp/skia/include/gpu/gl/GrGLTypes.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2015 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/gl/GrGLTypes.h"

package/cpp/skia/include/gpu/mock/GrMockTypes.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2017 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/mock/GrMockTypes.h"

package/cpp/skia/include/gpu/vk/GrVkTypes.h

@@ -1,8 +0,0 @@
-/*
- * Copyright 2016 Google Inc.
- *
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-// TODO(kjlubick, egdaniel) Delete this after migrating clients.
-#include "include/gpu/ganesh/vk/GrVkTypes.h"

package/lib/commonjs/renderer/__tests__/TouchHandler.spec.d.ts

@@ -1 +0,0 @@
-export {};

package/lib/commonjs/views/useTouchHandler.d.ts

@@ -1,22 +0,0 @@
-import type { DependencyList } from "react";
-import type { TouchHandlers, TouchHandler } from "./types";
-/**
- * Provides a callback for handling touch events in the Skia View.
- * This touch handler only handles single touches.
- * @param handlers Callbacks for the different touch states
- * @param deps optional Dependency array to update the handlers
- * @returns A function that can be used from within the onDraw callback to
- * update and handle touch events. Call it with the touches property from
- * the info object.
- */
-export declare const useTouchHandler: (handlers: TouchHandlers, deps?: DependencyList) => TouchHandler;
-/**
- * Provides a callback for handling touch events in the Skia View.
- * This touch handler handles multiple touches.
- * @param handlers Callbacks for the different touch states
- * @param deps optional Dependency array to update the handlers
- * @returns A function that can be used from within the onDraw callback to
- * update and handle touch events. Call it with the touches property from
- * the info object.
- */
-export declare const useMultiTouchHandler: (handlers: TouchHandlers, deps?: DependencyList) => TouchHandler;