react-native-skia-gesture 0.1.172 → 0.2.0

package/lib/commonjs/canvas/canvas.js

@@ -10,7 +10,7 @@ var _context = require("./context");
 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); }
 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; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-const Canvas = _ref => {
+const Canvas = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     children,
     onTouch,
@@ -65,7 +65,9 @@ const Canvas = _ref => {
       touchableRefs.current = {};
     };
   }, [touchableRefs]);
-  return /*#__PURE__*/_react.default.createElement(_reactNativeSkia.Canvas, _extends({}, props, {
+  return /*#__PURE__*/_react.default.createElement(_reactNativeSkia.Canvas, _extends({
+    ref: ref
+  }, props, {
     onTouch: touchInfo => {
       touchHandler(touchInfo);
       return onTouch === null || onTouch === void 0 ? void 0 : onTouch(touchInfo);
@@ -73,6 +75,6 @@ const Canvas = _ref => {
   }), /*#__PURE__*/_react.default.createElement(_context.TouchHandlerContext.Provider, {
     value: touchableRefs
   }, children));
-};
+});
 exports.Canvas = Canvas;
 //# sourceMappingURL=canvas.js.map

package/lib/commonjs/canvas/canvas.js.map

@@ -1 +1 @@
-{"version":3,"names":["Canvas","children","onTouch","props","touchableRefs","useValue","activeKey","touchHandler","useMultiTouchHandler","onStart","event","keys","Object","current","i","length","key","touchableItem","isPointInPath","push","id","onActive","activatedKey","find","includes","toString","indexedKey","split","onEnd","filter","useEffect","touchInfo"],"sourceRoot":"../../src","sources":["canvas.tsx"],"mappings":"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"}
+{"version":3,"names":["Canvas","React","forwardRef","ref","children","onTouch","props","touchableRefs","useValue","activeKey","touchHandler","useMultiTouchHandler","onStart","event","keys","Object","current","i","length","key","touchableItem","isPointInPath","push","id","onActive","activatedKey","find","includes","toString","indexedKey","split","onEnd","filter","useEffect","touchInfo"],"sourceRoot":"../../src","sources":["canvas.tsx"],"mappings":"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"}

package/lib/module/canvas/canvas.js

@@ -2,7 +2,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 import { Canvas as SkiaCanvas, useMultiTouchHandler, useValue } from '@shopify/react-native-skia';
 import React, { useEffect } from 'react';
 import { TouchHandlerContext } from './context';
-const Canvas = _ref => {
+const Canvas = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
     children,
     onTouch,
@@ -57,7 +57,9 @@ const Canvas = _ref => {
       touchableRefs.current = {};
     };
   }, [touchableRefs]);
-  return /*#__PURE__*/React.createElement(SkiaCanvas, _extends({}, props, {
+  return /*#__PURE__*/React.createElement(SkiaCanvas, _extends({
+    ref: ref
+  }, props, {
     onTouch: touchInfo => {
       touchHandler(touchInfo);
       return onTouch === null || onTouch === void 0 ? void 0 : onTouch(touchInfo);
@@ -65,6 +67,6 @@ const Canvas = _ref => {
   }), /*#__PURE__*/React.createElement(TouchHandlerContext.Provider, {
     value: touchableRefs
   }, children));
-};
+});
 export { Canvas };
 //# sourceMappingURL=canvas.js.map

package/lib/module/canvas/canvas.js.map

@@ -1 +1 @@
-{"version":3,"names":["Canvas","SkiaCanvas","useMultiTouchHandler","useValue","React","useEffect","TouchHandlerContext","children","onTouch","props","touchableRefs","activeKey","touchHandler","onStart","event","keys","Object","current","i","length","key","touchableItem","isPointInPath","push","id","onActive","activatedKey","find","includes","toString","indexedKey","split","onEnd","filter","touchInfo"],"sourceRoot":"../../src","sources":["canvas.tsx"],"mappings":"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"}
+{"version":3,"names":["Canvas","SkiaCanvas","useMultiTouchHandler","useValue","React","useEffect","TouchHandlerContext","forwardRef","ref","children","onTouch","props","touchableRefs","activeKey","touchHandler","onStart","event","keys","Object","current","i","length","key","touchableItem","isPointInPath","push","id","onActive","activatedKey","find","includes","toString","indexedKey","split","onEnd","filter","touchInfo"],"sourceRoot":"../../src","sources":["canvas.tsx"],"mappings":"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"}

package/lib/typescript/canvas/canvas.d.ts

@@ -1,5 +1,5 @@
-import { type CanvasProps } from '@shopify/react-native-skia';
+import { type CanvasProps, SkiaDomView } from '@shopify/react-native-skia';
 import React from 'react';
-declare const Canvas: React.FC<CanvasProps>;
+declare const Canvas: React.ForwardRefExoticComponent<Pick<CanvasProps, "children" | "onTouch" | "mode" | "debug" | "onSize" | "hitSlop" | "onLayout" | "pointerEvents" | "removeClippedSubviews" | "style" | "testID" | "nativeID" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "focusable" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerUp" | "onPointerUpCapture" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors"> & React.RefAttributes<SkiaDomView>>;
 export { Canvas };
 //# sourceMappingURL=canvas.d.ts.map

package/lib/typescript/canvas/canvas.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"canvas.d.ts","sourceRoot":"","sources":["../../../src/canvas/canvas.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,WAAW,EAGjB,MAAM,4BAA4B,CAAC;AACpC,OAAO,KAAoB,MAAM,OAAO,CAAC;AAMzC,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAyEjC,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}
+{"version":3,"file":"canvas.d.ts","sourceRoot":"","sources":["../../../src/canvas/canvas.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,WAAW,EAGhB,WAAW,EACZ,MAAM,4BAA4B,CAAC;AACpC,OAAO,KAAoB,MAAM,OAAO,CAAC;AAMzC,QAAA,MAAM,MAAM,2kDA4EX,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-skia-gesture",
-  "version": "0.1.172",
+  "version": "0.2.0",
   "description": "A detection system for React Native Skia components",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",

package/src/canvas/canvas.tsx

@@ -3,6 +3,7 @@ import {
   type CanvasProps,
   useMultiTouchHandler,
   useValue,
+  SkiaDomView,
 } from '@shopify/react-native-skia';
 import React, { useEffect } from 'react';
 import {
@@ -10,79 +11,82 @@ import {
   type TouchableHandlerContextType,
 } from './context';
 
-const Canvas: React.FC<CanvasProps> = ({ children, onTouch, ...props }) => {
-  const touchableRefs = useValue<TouchableHandlerContextType['current']>({});
+const Canvas = React.forwardRef<SkiaDomView, CanvasProps>(
+  ({ children, onTouch, ...props }, ref) => {
+    const touchableRefs = useValue<TouchableHandlerContextType['current']>({});
 
-  const activeKey = useValue<string[]>([]);
+    const activeKey = useValue<string[]>([]);
 
-  const touchHandler = useMultiTouchHandler(
-    {
-      onStart: (event) => {
-        const keys = Object.keys(touchableRefs.current);
-        for (let i = 0; i < keys.length; i++) {
-          const key = keys[i] as string;
-          const touchableItem = touchableRefs.current[key];
-          if (touchableItem?.isPointInPath(event)) {
-            activeKey.current.push(`${key}__${event.id}`);
-            touchableItem.onStart?.(event);
+    const touchHandler = useMultiTouchHandler(
+      {
+        onStart: (event) => {
+          const keys = Object.keys(touchableRefs.current);
+          for (let i = 0; i < keys.length; i++) {
+            const key = keys[i] as string;
+            const touchableItem = touchableRefs.current[key];
+            if (touchableItem?.isPointInPath(event)) {
+              activeKey.current.push(`${key}__${event.id}`);
+              touchableItem.onStart?.(event);
+              return;
+            }
+          }
+        },
+        onActive: (event) => {
+          const activatedKey = activeKey.current.find((key) =>
+            key.includes(event.id.toString())
+          );
+          if (!activatedKey) {
             return;
           }
-        }
-      },
-      onActive: (event) => {
-        const activatedKey = activeKey.current.find((key) =>
-          key.includes(event.id.toString())
-        );
-        if (!activatedKey) {
-          return;
-        }
-        const indexedKey = activatedKey.split('__')?.[0];
-        if (!indexedKey) {
-          return;
-        }
-        const touchableItem = touchableRefs.current[indexedKey];
-        return touchableItem?.onActive?.(event);
-      },
-      onEnd: (event) => {
-        const activatedKey = activeKey.current.find((key) =>
-          key.includes(event.id.toString())
-        );
-        if (!activatedKey) {
-          return;
-        }
-        const indexedKey = activatedKey.split('__')?.[0];
-        if (!indexedKey) {
-          return;
-        }
-        const touchableItem = touchableRefs.current[indexedKey];
-        activeKey.current = activeKey.current.filter(
-          (key) => !key.includes(event.id.toString())
-        );
-        return touchableItem?.onEnd?.(event);
+          const indexedKey = activatedKey.split('__')?.[0];
+          if (!indexedKey) {
+            return;
+          }
+          const touchableItem = touchableRefs.current[indexedKey];
+          return touchableItem?.onActive?.(event);
+        },
+        onEnd: (event) => {
+          const activatedKey = activeKey.current.find((key) =>
+            key.includes(event.id.toString())
+          );
+          if (!activatedKey) {
+            return;
+          }
+          const indexedKey = activatedKey.split('__')?.[0];
+          if (!indexedKey) {
+            return;
+          }
+          const touchableItem = touchableRefs.current[indexedKey];
+          activeKey.current = activeKey.current.filter(
+            (key) => !key.includes(event.id.toString())
+          );
+          return touchableItem?.onEnd?.(event);
+        },
       },
-    },
-    [touchableRefs, activeKey]
-  );
+      [touchableRefs, activeKey]
+    );
 
-  useEffect(() => {
-    return () => {
-      touchableRefs.current = {};
-    };
-  }, [touchableRefs]);
+    useEffect(() => {
+      return () => {
+        touchableRefs.current = {};
+      };
+    }, [touchableRefs]);
 
-  return (
-    <SkiaCanvas
-      {...props}
-      onTouch={(touchInfo) => {
-        touchHandler(touchInfo);
-        return onTouch?.(touchInfo);
-      }}
-    >
-      <TouchHandlerContext.Provider value={touchableRefs}>
-        {children}
-      </TouchHandlerContext.Provider>
-    </SkiaCanvas>
-  );
-};
+    return (
+      <SkiaCanvas
+        ref={ref as React.RefObject<SkiaDomView> & React.Ref<SkiaDomView>}
+        {...props}
+        onTouch={(touchInfo) => {
+          touchHandler(touchInfo);
+          return onTouch?.(touchInfo);
+        }}
+      >
+        <TouchHandlerContext.Provider value={touchableRefs}>
+          {children}
+        </TouchHandlerContext.Provider>
+      </SkiaCanvas>
+    );
+  }
+);
 
 export { Canvas };