@react-native-oh-tpl/react-native-gesture-handler 2.12.1-0.0.1

package/lib/commonjs/components/touchables/GenericTouchable.js

@@ -0,0 +1,289 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.TOUCHABLE_STATE = void 0;
+
+var React = _interopRequireWildcard(require("react"));
+
+var _reactNative = require("react-native");
+
+var _State = require("../../State");
+
+var _GestureButtons = require("../GestureButtons");
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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 || 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); }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+/**
+ * Each touchable is a states' machine which preforms transitions.
+ * On very beginning (and on the very end or recognition) touchable is
+ * UNDETERMINED. Then it moves to BEGAN. If touchable recognizes that finger
+ * travel outside it transits to special MOVED_OUTSIDE state. Gesture recognition
+ * finishes in UNDETERMINED state.
+ */
+const TOUCHABLE_STATE = {
+  UNDETERMINED: 0,
+  BEGAN: 1,
+  MOVED_OUTSIDE: 2
+};
+exports.TOUCHABLE_STATE = TOUCHABLE_STATE;
+
+/**
+ * GenericTouchable is not intented to be used as it is.
+ * Should be treated as a source for the rest of touchables
+ */
+class GenericTouchable extends React.Component {
+  constructor(...args) {
+    super(...args);
+
+    _defineProperty(this, "pressInTimeout", void 0);
+
+    _defineProperty(this, "pressOutTimeout", void 0);
+
+    _defineProperty(this, "longPressTimeout", void 0);
+
+    _defineProperty(this, "longPressDetected", false);
+
+    _defineProperty(this, "pointerInside", true);
+
+    _defineProperty(this, "STATE", TOUCHABLE_STATE.UNDETERMINED);
+
+    _defineProperty(this, "onGestureEvent", ({
+      nativeEvent: {
+        pointerInside
+      }
+    }) => {
+      if (this.pointerInside !== pointerInside) {
+        if (pointerInside) {
+          this.onMoveIn();
+        } else {
+          this.onMoveOut();
+        }
+      }
+
+      this.pointerInside = pointerInside;
+    });
+
+    _defineProperty(this, "onHandlerStateChange", ({
+      nativeEvent
+    }) => {
+      const {
+        state
+      } = nativeEvent;
+
+      if (state === _State.State.CANCELLED || state === _State.State.FAILED) {
+        // Need to handle case with external cancellation (e.g. by ScrollView)
+        this.moveToState(TOUCHABLE_STATE.UNDETERMINED);
+      } else if ( // This platform check is an implication of slightly different behavior of handlers on different platform.
+      // And Android "Active" state is achieving on first move of a finger, not on press in.
+      // On iOS event on "Began" is not delivered.
+      state === (_reactNative.Platform.OS !== 'android' ? _State.State.ACTIVE : _State.State.BEGAN) && this.STATE === TOUCHABLE_STATE.UNDETERMINED) {
+        // Moving inside requires
+        this.handlePressIn();
+      } else if (state === _State.State.END) {
+        const shouldCallOnPress = !this.longPressDetected && this.STATE !== TOUCHABLE_STATE.MOVED_OUTSIDE && this.pressOutTimeout === null;
+        this.handleGoToUndetermined();
+
+        if (shouldCallOnPress) {
+          var _this$props$onPress, _this$props;
+
+          // Calls only inside component whether no long press was called previously
+          (_this$props$onPress = (_this$props = this.props).onPress) === null || _this$props$onPress === void 0 ? void 0 : _this$props$onPress.call(_this$props);
+        }
+      }
+    });
+
+    _defineProperty(this, "onLongPressDetected", () => {
+      var _this$props$onLongPre, _this$props2;
+
+      this.longPressDetected = true; // checked for in the caller of `onLongPressDetected`, but better to check twice
+
+      (_this$props$onLongPre = (_this$props2 = this.props).onLongPress) === null || _this$props$onLongPre === void 0 ? void 0 : _this$props$onLongPre.call(_this$props2);
+    });
+  }
+
+  // handlePressIn in called on first touch on traveling inside component.
+  // Handles state transition with delay.
+  handlePressIn() {
+    if (this.props.delayPressIn) {
+      this.pressInTimeout = setTimeout(() => {
+        this.moveToState(TOUCHABLE_STATE.BEGAN);
+        this.pressInTimeout = null;
+      }, this.props.delayPressIn);
+    } else {
+      this.moveToState(TOUCHABLE_STATE.BEGAN);
+    }
+
+    if (this.props.onLongPress) {
+      const time = (this.props.delayPressIn || 0) + (this.props.delayLongPress || 0);
+      this.longPressTimeout = setTimeout(this.onLongPressDetected, time);
+    }
+  } // handleMoveOutside in called on traveling outside component.
+  // Handles state transition with delay.
+
+
+  handleMoveOutside() {
+    if (this.props.delayPressOut) {
+      this.pressOutTimeout = this.pressOutTimeout || setTimeout(() => {
+        this.moveToState(TOUCHABLE_STATE.MOVED_OUTSIDE);
+        this.pressOutTimeout = null;
+      }, this.props.delayPressOut);
+    } else {
+      this.moveToState(TOUCHABLE_STATE.MOVED_OUTSIDE);
+    }
+  } // handleGoToUndetermined transits to UNDETERMINED state with proper delay
+
+
+  handleGoToUndetermined() {
+    clearTimeout(this.pressOutTimeout); // TODO: maybe it can be undefined
+
+    if (this.props.delayPressOut) {
+      this.pressOutTimeout = setTimeout(() => {
+        if (this.STATE === TOUCHABLE_STATE.UNDETERMINED) {
+          this.moveToState(TOUCHABLE_STATE.BEGAN);
+        }
+
+        this.moveToState(TOUCHABLE_STATE.UNDETERMINED);
+        this.pressOutTimeout = null;
+      }, this.props.delayPressOut);
+    } else {
+      if (this.STATE === TOUCHABLE_STATE.UNDETERMINED) {
+        this.moveToState(TOUCHABLE_STATE.BEGAN);
+      }
+
+      this.moveToState(TOUCHABLE_STATE.UNDETERMINED);
+    }
+  }
+
+  componentDidMount() {
+    this.reset();
+  } // reset timeout to prevent memory leaks.
+
+
+  reset() {
+    this.longPressDetected = false;
+    this.pointerInside = true;
+    clearTimeout(this.pressInTimeout);
+    clearTimeout(this.pressOutTimeout);
+    clearTimeout(this.longPressTimeout);
+    this.pressOutTimeout = null;
+    this.longPressTimeout = null;
+    this.pressInTimeout = null;
+  } // All states' transitions are defined here.
+
+
+  moveToState(newState) {
+    var _this$props$onStateCh, _this$props6;
+
+    if (newState === this.STATE) {
+      // Ignore dummy transitions
+      return;
+    }
+
+    if (newState === TOUCHABLE_STATE.BEGAN) {
+      var _this$props$onPressIn, _this$props3;
+
+      // First touch and moving inside
+      (_this$props$onPressIn = (_this$props3 = this.props).onPressIn) === null || _this$props$onPressIn === void 0 ? void 0 : _this$props$onPressIn.call(_this$props3);
+    } else if (newState === TOUCHABLE_STATE.MOVED_OUTSIDE) {
+      var _this$props$onPressOu, _this$props4;
+
+      // Moving outside
+      (_this$props$onPressOu = (_this$props4 = this.props).onPressOut) === null || _this$props$onPressOu === void 0 ? void 0 : _this$props$onPressOu.call(_this$props4);
+    } else if (newState === TOUCHABLE_STATE.UNDETERMINED) {
+      // Need to reset each time on transition to UNDETERMINED
+      this.reset();
+
+      if (this.STATE === TOUCHABLE_STATE.BEGAN) {
+        var _this$props$onPressOu2, _this$props5;
+
+        // ... and if it happens inside button.
+        (_this$props$onPressOu2 = (_this$props5 = this.props).onPressOut) === null || _this$props$onPressOu2 === void 0 ? void 0 : _this$props$onPressOu2.call(_this$props5);
+      }
+    } // Finally call lister (used by subclasses)
+
+
+    (_this$props$onStateCh = (_this$props6 = this.props).onStateChange) === null || _this$props$onStateCh === void 0 ? void 0 : _this$props$onStateCh.call(_this$props6, this.STATE, newState); // ... and make transition.
+
+    this.STATE = newState;
+  }
+
+  componentWillUnmount() {
+    // to prevent memory leaks
+    this.reset();
+  }
+
+  onMoveIn() {
+    if (this.STATE === TOUCHABLE_STATE.MOVED_OUTSIDE) {
+      // This call is not throttled with delays (like in RN's implementation).
+      this.moveToState(TOUCHABLE_STATE.BEGAN);
+    }
+  }
+
+  onMoveOut() {
+    // long press should no longer be detected
+    clearTimeout(this.longPressTimeout);
+    this.longPressTimeout = null;
+
+    if (this.STATE === TOUCHABLE_STATE.BEGAN) {
+      this.handleMoveOutside();
+    }
+  }
+
+  render() {
+    var _ref, _this$props$touchSoun;
+
+    const hitSlop = (_ref = typeof this.props.hitSlop === 'number' ? {
+      top: this.props.hitSlop,
+      left: this.props.hitSlop,
+      bottom: this.props.hitSlop,
+      right: this.props.hitSlop
+    } : this.props.hitSlop) !== null && _ref !== void 0 ? _ref : undefined;
+    const coreProps = {
+      accessible: this.props.accessible !== false,
+      accessibilityLabel: this.props.accessibilityLabel,
+      accessibilityHint: this.props.accessibilityHint,
+      accessibilityRole: this.props.accessibilityRole,
+      // TODO: check if changed to no 's' correctly, also removed 2 props that are no longer available: `accessibilityComponentType` and `accessibilityTraits`,
+      // would be good to check if it is ok for sure, see: https://github.com/facebook/react-native/issues/24016
+      accessibilityState: this.props.accessibilityState,
+      accessibilityActions: this.props.accessibilityActions,
+      onAccessibilityAction: this.props.onAccessibilityAction,
+      nativeID: this.props.nativeID,
+      onLayout: this.props.onLayout
+    };
+    return /*#__PURE__*/React.createElement(_GestureButtons.BaseButton, _extends({
+      style: this.props.containerStyle,
+      onHandlerStateChange: // TODO: not sure if it can be undefined instead of null
+      this.props.disabled ? undefined : this.onHandlerStateChange,
+      onGestureEvent: this.onGestureEvent,
+      hitSlop: hitSlop,
+      shouldActivateOnStart: this.props.shouldActivateOnStart,
+      disallowInterruption: this.props.disallowInterruption,
+      testID: this.props.testID,
+      touchSoundDisabled: (_this$props$touchSoun = this.props.touchSoundDisabled) !== null && _this$props$touchSoun !== void 0 ? _this$props$touchSoun : false,
+      enabled: !this.props.disabled
+    }, this.props.extraButtonProps), /*#__PURE__*/React.createElement(_reactNative.Animated.View, _extends({}, coreProps, {
+      style: this.props.style
+    }), this.props.children));
+  }
+
+}
+
+exports.default = GenericTouchable;
+
+_defineProperty(GenericTouchable, "defaultProps", {
+  delayLongPress: 600,
+  extraButtonProps: {
+    rippleColor: 'transparent',
+    exclusive: true
+  }
+});
+//# sourceMappingURL=GenericTouchable.js.map

package/lib/commonjs/components/touchables/GenericTouchable.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["GenericTouchable.tsx"],"names":["TOUCHABLE_STATE","UNDETERMINED","BEGAN","MOVED_OUTSIDE","GenericTouchable","Component","nativeEvent","pointerInside","onMoveIn","onMoveOut","state","State","CANCELLED","FAILED","moveToState","Platform","OS","ACTIVE","STATE","handlePressIn","END","shouldCallOnPress","longPressDetected","pressOutTimeout","handleGoToUndetermined","props","onPress","onLongPress","delayPressIn","pressInTimeout","setTimeout","time","delayLongPress","longPressTimeout","onLongPressDetected","handleMoveOutside","delayPressOut","clearTimeout","componentDidMount","reset","newState","onPressIn","onPressOut","onStateChange","componentWillUnmount","render","hitSlop","top","left","bottom","right","undefined","coreProps","accessible","accessibilityLabel","accessibilityHint","accessibilityRole","accessibilityState","accessibilityActions","onAccessibilityAction","nativeID","onLayout","containerStyle","disabled","onHandlerStateChange","onGestureEvent","shouldActivateOnStart","disallowInterruption","testID","touchSoundDisabled","extraButtonProps","style","children","rippleColor","exclusive"],"mappings":"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","sourcesContent":["import * as React from 'react';\r\nimport { Component } from 'react';\r\nimport {\r\n  Animated,\r\n  Platform,\r\n  StyleProp,\r\n  ViewStyle,\r\n  TouchableWithoutFeedbackProps,\r\n  Insets,\r\n} from 'react-native';\r\n\r\nimport { State } from '../../State';\r\nimport { BaseButton } from '../GestureButtons';\r\n\r\nimport {\r\n  GestureEvent,\r\n  HandlerStateChangeEvent,\r\n} from '../../handlers/gestureHandlerCommon';\r\nimport { NativeViewGestureHandlerPayload } from '../../handlers/NativeViewGestureHandler';\r\nimport { TouchableNativeFeedbackExtraProps } from './TouchableNativeFeedback.android';\r\n\r\n/**\r\n * Each touchable is a states' machine which preforms transitions.\r\n * On very beginning (and on the very end or recognition) touchable is\r\n * UNDETERMINED. Then it moves to BEGAN. If touchable recognizes that finger\r\n * travel outside it transits to special MOVED_OUTSIDE state. Gesture recognition\r\n * finishes in UNDETERMINED state.\r\n */\r\nexport const TOUCHABLE_STATE = {\r\n  UNDETERMINED: 0,\r\n  BEGAN: 1,\r\n  MOVED_OUTSIDE: 2,\r\n} as const;\r\n\r\ntype TouchableState = typeof TOUCHABLE_STATE[keyof typeof TOUCHABLE_STATE];\r\n\r\nexport interface GenericTouchableProps\r\n  extends Omit<TouchableWithoutFeedbackProps, 'hitSlop'> {\r\n  // Decided to drop not used fields from RN's implementation.\r\n  // e.g. onBlur and onFocus as well as deprecated props. - TODO: this comment may be unuseful in this moment\r\n\r\n  // TODO: in RN these events get native event parameter, which prolly could be used in our implementation too\r\n  onPress?: () => void;\r\n  onPressIn?: () => void;\r\n  onPressOut?: () => void;\r\n  onLongPress?: () => void;\r\n\r\n  nativeID?: string;\r\n  shouldActivateOnStart?: boolean;\r\n  disallowInterruption?: boolean;\r\n\r\n  containerStyle?: StyleProp<ViewStyle>;\r\n  hitSlop?: Insets | number;\r\n}\r\n\r\ninterface InternalProps {\r\n  extraButtonProps: TouchableNativeFeedbackExtraProps;\r\n  onStateChange?: (oldState: TouchableState, newState: TouchableState) => void;\r\n}\r\n\r\n// TODO: maybe can be better\r\n// TODO: all clearTimeout have ! added, maybe they shouldn't ?\r\ntype Timeout = ReturnType<typeof setTimeout> | null | undefined;\r\n\r\n/**\r\n * GenericTouchable is not intented to be used as it is.\r\n * Should be treated as a source for the rest of touchables\r\n */\r\n\r\nexport default class GenericTouchable extends Component<\r\n  GenericTouchableProps & InternalProps\r\n> {\r\n  static defaultProps = {\r\n    delayLongPress: 600,\r\n    extraButtonProps: {\r\n      rippleColor: 'transparent',\r\n      exclusive: true,\r\n    },\r\n  };\r\n\r\n  // timeout handlers\r\n  pressInTimeout: Timeout;\r\n  pressOutTimeout: Timeout;\r\n  longPressTimeout: Timeout;\r\n\r\n  // This flag is required since recognition of longPress implies not-invoking onPress\r\n  longPressDetected = false;\r\n\r\n  pointerInside = true;\r\n\r\n  // State of touchable\r\n  STATE: TouchableState = TOUCHABLE_STATE.UNDETERMINED;\r\n\r\n  // handlePressIn in called on first touch on traveling inside component.\r\n  // Handles state transition with delay.\r\n  handlePressIn() {\r\n    if (this.props.delayPressIn) {\r\n      this.pressInTimeout = setTimeout(() => {\r\n        this.moveToState(TOUCHABLE_STATE.BEGAN);\r\n        this.pressInTimeout = null;\r\n      }, this.props.delayPressIn);\r\n    } else {\r\n      this.moveToState(TOUCHABLE_STATE.BEGAN);\r\n    }\r\n    if (this.props.onLongPress) {\r\n      const time =\r\n        (this.props.delayPressIn || 0) + (this.props.delayLongPress || 0);\r\n      this.longPressTimeout = setTimeout(this.onLongPressDetected, time);\r\n    }\r\n  }\r\n  // handleMoveOutside in called on traveling outside component.\r\n  // Handles state transition with delay.\r\n  handleMoveOutside() {\r\n    if (this.props.delayPressOut) {\r\n      this.pressOutTimeout =\r\n        this.pressOutTimeout ||\r\n        setTimeout(() => {\r\n          this.moveToState(TOUCHABLE_STATE.MOVED_OUTSIDE);\r\n          this.pressOutTimeout = null;\r\n        }, this.props.delayPressOut);\r\n    } else {\r\n      this.moveToState(TOUCHABLE_STATE.MOVED_OUTSIDE);\r\n    }\r\n  }\r\n\r\n  // handleGoToUndetermined transits to UNDETERMINED state with proper delay\r\n  handleGoToUndetermined() {\r\n    clearTimeout(this.pressOutTimeout!); // TODO: maybe it can be undefined\r\n    if (this.props.delayPressOut) {\r\n      this.pressOutTimeout = setTimeout(() => {\r\n        if (this.STATE === TOUCHABLE_STATE.UNDETERMINED) {\r\n          this.moveToState(TOUCHABLE_STATE.BEGAN);\r\n        }\r\n        this.moveToState(TOUCHABLE_STATE.UNDETERMINED);\r\n        this.pressOutTimeout = null;\r\n      }, this.props.delayPressOut);\r\n    } else {\r\n      if (this.STATE === TOUCHABLE_STATE.UNDETERMINED) {\r\n        this.moveToState(TOUCHABLE_STATE.BEGAN);\r\n      }\r\n      this.moveToState(TOUCHABLE_STATE.UNDETERMINED);\r\n    }\r\n  }\r\n\r\n  componentDidMount() {\r\n    this.reset();\r\n  }\r\n  // reset timeout to prevent memory leaks.\r\n  reset() {\r\n    this.longPressDetected = false;\r\n    this.pointerInside = true;\r\n    clearTimeout(this.pressInTimeout!);\r\n    clearTimeout(this.pressOutTimeout!);\r\n    clearTimeout(this.longPressTimeout!);\r\n    this.pressOutTimeout = null;\r\n    this.longPressTimeout = null;\r\n    this.pressInTimeout = null;\r\n  }\r\n\r\n  // All states' transitions are defined here.\r\n  moveToState(newState: TouchableState) {\r\n    if (newState === this.STATE) {\r\n      // Ignore dummy transitions\r\n      return;\r\n    }\r\n    if (newState === TOUCHABLE_STATE.BEGAN) {\r\n      // First touch and moving inside\r\n      this.props.onPressIn?.();\r\n    } else if (newState === TOUCHABLE_STATE.MOVED_OUTSIDE) {\r\n      // Moving outside\r\n      this.props.onPressOut?.();\r\n    } else if (newState === TOUCHABLE_STATE.UNDETERMINED) {\r\n      // Need to reset each time on transition to UNDETERMINED\r\n      this.reset();\r\n      if (this.STATE === TOUCHABLE_STATE.BEGAN) {\r\n        // ... and if it happens inside button.\r\n        this.props.onPressOut?.();\r\n      }\r\n    }\r\n    // Finally call lister (used by subclasses)\r\n    this.props.onStateChange?.(this.STATE, newState);\r\n    // ... and make transition.\r\n    this.STATE = newState;\r\n  }\r\n\r\n  onGestureEvent = ({\r\n    nativeEvent: { pointerInside },\r\n  }: GestureEvent<NativeViewGestureHandlerPayload>) => {\r\n    if (this.pointerInside !== pointerInside) {\r\n      if (pointerInside) {\r\n        this.onMoveIn();\r\n      } else {\r\n        this.onMoveOut();\r\n      }\r\n    }\r\n    this.pointerInside = pointerInside;\r\n  };\r\n\r\n  onHandlerStateChange = ({\r\n    nativeEvent,\r\n  }: HandlerStateChangeEvent<NativeViewGestureHandlerPayload>) => {\r\n    const { state } = nativeEvent;\r\n    if (state === State.CANCELLED || state === State.FAILED) {\r\n      // Need to handle case with external cancellation (e.g. by ScrollView)\r\n      this.moveToState(TOUCHABLE_STATE.UNDETERMINED);\r\n    } else if (\r\n      // This platform check is an implication of slightly different behavior of handlers on different platform.\r\n      // And Android \"Active\" state is achieving on first move of a finger, not on press in.\r\n      // On iOS event on \"Began\" is not delivered.\r\n      state === (Platform.OS !== 'android' ? State.ACTIVE : State.BEGAN) &&\r\n      this.STATE === TOUCHABLE_STATE.UNDETERMINED\r\n    ) {\r\n      // Moving inside requires\r\n      this.handlePressIn();\r\n    } else if (state === State.END) {\r\n      const shouldCallOnPress =\r\n        !this.longPressDetected &&\r\n        this.STATE !== TOUCHABLE_STATE.MOVED_OUTSIDE &&\r\n        this.pressOutTimeout === null;\r\n      this.handleGoToUndetermined();\r\n      if (shouldCallOnPress) {\r\n        // Calls only inside component whether no long press was called previously\r\n        this.props.onPress?.();\r\n      }\r\n    }\r\n  };\r\n\r\n  onLongPressDetected = () => {\r\n    this.longPressDetected = true;\r\n    // checked for in the caller of `onLongPressDetected`, but better to check twice\r\n    this.props.onLongPress?.();\r\n  };\r\n\r\n  componentWillUnmount() {\r\n    // to prevent memory leaks\r\n    this.reset();\r\n  }\r\n\r\n  onMoveIn() {\r\n    if (this.STATE === TOUCHABLE_STATE.MOVED_OUTSIDE) {\r\n      // This call is not throttled with delays (like in RN's implementation).\r\n      this.moveToState(TOUCHABLE_STATE.BEGAN);\r\n    }\r\n  }\r\n\r\n  onMoveOut() {\r\n    // long press should no longer be detected\r\n    clearTimeout(this.longPressTimeout!);\r\n    this.longPressTimeout = null;\r\n    if (this.STATE === TOUCHABLE_STATE.BEGAN) {\r\n      this.handleMoveOutside();\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const hitSlop =\r\n      (typeof this.props.hitSlop === 'number'\r\n        ? {\r\n            top: this.props.hitSlop,\r\n            left: this.props.hitSlop,\r\n            bottom: this.props.hitSlop,\r\n            right: this.props.hitSlop,\r\n          }\r\n        : this.props.hitSlop) ?? undefined;\r\n\r\n    const coreProps = {\r\n      accessible: this.props.accessible !== false,\r\n      accessibilityLabel: this.props.accessibilityLabel,\r\n      accessibilityHint: this.props.accessibilityHint,\r\n      accessibilityRole: this.props.accessibilityRole,\r\n      // TODO: check if changed to no 's' correctly, also removed 2 props that are no longer available: `accessibilityComponentType` and `accessibilityTraits`,\r\n      // would be good to check if it is ok for sure, see: https://github.com/facebook/react-native/issues/24016\r\n      accessibilityState: this.props.accessibilityState,\r\n      accessibilityActions: this.props.accessibilityActions,\r\n      onAccessibilityAction: this.props.onAccessibilityAction,\r\n      nativeID: this.props.nativeID,\r\n      onLayout: this.props.onLayout,\r\n    };\r\n\r\n    return (\r\n      <BaseButton\r\n        style={this.props.containerStyle}\r\n        onHandlerStateChange={\r\n          // TODO: not sure if it can be undefined instead of null\r\n          this.props.disabled ? undefined : this.onHandlerStateChange\r\n        }\r\n        onGestureEvent={this.onGestureEvent}\r\n        hitSlop={hitSlop}\r\n        shouldActivateOnStart={this.props.shouldActivateOnStart}\r\n        disallowInterruption={this.props.disallowInterruption}\r\n        testID={this.props.testID}\r\n        touchSoundDisabled={this.props.touchSoundDisabled ?? false}\r\n        enabled={!this.props.disabled}\r\n        {...this.props.extraButtonProps}>\r\n        <Animated.View {...coreProps} style={this.props.style}>\r\n          {this.props.children}\r\n        </Animated.View>\r\n      </BaseButton>\r\n    );\r\n  }\r\n}\r\n"]}

package/lib/commonjs/components/touchables/TouchableHighlight.js

@@ -0,0 +1,109 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var React = _interopRequireWildcard(require("react"));
+
+var _GenericTouchable = _interopRequireWildcard(require("./GenericTouchable"));
+
+var _reactNative = require("react-native");
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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 || 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); }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+/**
+ * TouchableHighlight follows RN's implementation
+ */
+class TouchableHighlight extends React.Component {
+  constructor(props) {
+    super(props);
+
+    _defineProperty(this, "showUnderlay", () => {
+      var _this$props$onShowUnd, _this$props;
+
+      if (!this.hasPressHandler()) {
+        return;
+      }
+
+      this.setState({
+        extraChildStyle: {
+          opacity: this.props.activeOpacity
+        },
+        extraUnderlayStyle: {
+          backgroundColor: this.props.underlayColor
+        }
+      });
+      (_this$props$onShowUnd = (_this$props = this.props).onShowUnderlay) === null || _this$props$onShowUnd === void 0 ? void 0 : _this$props$onShowUnd.call(_this$props);
+    });
+
+    _defineProperty(this, "hasPressHandler", () => this.props.onPress || this.props.onPressIn || this.props.onPressOut || this.props.onLongPress);
+
+    _defineProperty(this, "hideUnderlay", () => {
+      var _this$props$onHideUnd, _this$props2;
+
+      this.setState({
+        extraChildStyle: null,
+        extraUnderlayStyle: null
+      });
+      (_this$props$onHideUnd = (_this$props2 = this.props).onHideUnderlay) === null || _this$props$onHideUnd === void 0 ? void 0 : _this$props$onHideUnd.call(_this$props2);
+    });
+
+    _defineProperty(this, "onStateChange", (_from, to) => {
+      if (to === _GenericTouchable.TOUCHABLE_STATE.BEGAN) {
+        this.showUnderlay();
+      } else if (to === _GenericTouchable.TOUCHABLE_STATE.UNDETERMINED || to === _GenericTouchable.TOUCHABLE_STATE.MOVED_OUTSIDE) {
+        this.hideUnderlay();
+      }
+    });
+
+    this.state = {
+      extraChildStyle: null,
+      extraUnderlayStyle: null
+    };
+  } // Copied from RN
+
+
+  renderChildren() {
+    if (!this.props.children) {
+      return /*#__PURE__*/React.createElement(_reactNative.View, null);
+    }
+
+    const child = React.Children.only(this.props.children); // TODO: not sure if OK but fixes error
+
+    return /*#__PURE__*/React.cloneElement(child, {
+      style: _reactNative.StyleSheet.compose(child.props.style, this.state.extraChildStyle)
+    });
+  }
+
+  render() {
+    const {
+      style = {},
+      ...rest
+    } = this.props;
+    const {
+      extraUnderlayStyle
+    } = this.state;
+    return /*#__PURE__*/React.createElement(_GenericTouchable.default, _extends({}, rest, {
+      style: [style, extraUnderlayStyle],
+      onStateChange: this.onStateChange
+    }), this.renderChildren());
+  }
+
+}
+
+exports.default = TouchableHighlight;
+
+_defineProperty(TouchableHighlight, "defaultProps", { ..._GenericTouchable.default.defaultProps,
+  activeOpacity: 0.85,
+  delayPressOut: 100,
+  underlayColor: 'black'
+});
+//# sourceMappingURL=TouchableHighlight.js.map

package/lib/commonjs/components/touchables/TouchableHighlight.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["TouchableHighlight.tsx"],"names":["TouchableHighlight","Component","constructor","props","hasPressHandler","setState","extraChildStyle","opacity","activeOpacity","extraUnderlayStyle","backgroundColor","underlayColor","onShowUnderlay","onPress","onPressIn","onPressOut","onLongPress","onHideUnderlay","_from","to","TOUCHABLE_STATE","BEGAN","showUnderlay","UNDETERMINED","MOVED_OUTSIDE","hideUnderlay","state","renderChildren","children","child","React","Children","only","cloneElement","style","StyleSheet","compose","render","rest","onStateChange","GenericTouchable","defaultProps","delayPressOut"],"mappings":";;;;;;;AAAA;;AAEA;;AAIA;;;;;;;;;;AAoBA;AACA;AACA;AACe,MAAMA,kBAAN,SAAiCC,eAAjC,CAGb;AAQAC,EAAAA,WAAW,CAACC,KAAD,EAAiC;AAC1C,UAAMA,KAAN;;AAD0C,0CAS7B,MAAM;AAAA;;AACnB,UAAI,CAAC,KAAKC,eAAL,EAAL,EAA6B;AAC3B;AACD;;AACD,WAAKC,QAAL,CAAc;AACZC,QAAAA,eAAe,EAAE;AACfC,UAAAA,OAAO,EAAE,KAAKJ,KAAL,CAAWK;AADL,SADL;AAIZC,QAAAA,kBAAkB,EAAE;AAClBC,UAAAA,eAAe,EAAE,KAAKP,KAAL,CAAWQ;AADV;AAJR,OAAd;AAQA,mDAAKR,KAAL,EAAWS,cAAX;AACD,KAtB2C;;AAAA,6CAwB1B,MAChB,KAAKT,KAAL,CAAWU,OAAX,IACA,KAAKV,KAAL,CAAWW,SADX,IAEA,KAAKX,KAAL,CAAWY,UAFX,IAGA,KAAKZ,KAAL,CAAWa,WA5B+B;;AAAA,0CA8B7B,MAAM;AAAA;;AACnB,WAAKX,QAAL,CAAc;AACZC,QAAAA,eAAe,EAAE,IADL;AAEZG,QAAAA,kBAAkB,EAAE;AAFR,OAAd;AAIA,oDAAKN,KAAL,EAAWc,cAAX;AACD,KApC2C;;AAAA,2CAmD5B,CAACC,KAAD,EAAgBC,EAAhB,KAA+B;AAC7C,UAAIA,EAAE,KAAKC,kCAAgBC,KAA3B,EAAkC;AAChC,aAAKC,YAAL;AACD,OAFD,MAEO,IACLH,EAAE,KAAKC,kCAAgBG,YAAvB,IACAJ,EAAE,KAAKC,kCAAgBI,aAFlB,EAGL;AACA,aAAKC,YAAL;AACD;AACF,KA5D2C;;AAE1C,SAAKC,KAAL,GAAa;AACXpB,MAAAA,eAAe,EAAE,IADN;AAEXG,MAAAA,kBAAkB,EAAE;AAFT,KAAb;AAID,GAdD,CAgBA;;;AA8BAkB,EAAAA,cAAc,GAAG;AACf,QAAI,CAAC,KAAKxB,KAAL,CAAWyB,QAAhB,EAA0B;AACxB,0BAAO,oBAAC,iBAAD,OAAP;AACD;;AAED,UAAMC,KAAK,GAAGC,KAAK,CAACC,QAAN,CAAeC,IAAf,CACZ,KAAK7B,KAAL,CAAWyB,QADC,CAAd,CALe,CAOqB;;AACpC,wBAAOE,KAAK,CAACG,YAAN,CAAmBJ,KAAnB,EAA0B;AAC/BK,MAAAA,KAAK,EAAEC,wBAAWC,OAAX,CAAmBP,KAAK,CAAC1B,KAAN,CAAY+B,KAA/B,EAAsC,KAAKR,KAAL,CAAWpB,eAAjD;AADwB,KAA1B,CAAP;AAGD;;AAaD+B,EAAAA,MAAM,GAAG;AACP,UAAM;AAAEH,MAAAA,KAAK,GAAG,EAAV;AAAc,SAAGI;AAAjB,QAA0B,KAAKnC,KAArC;AACA,UAAM;AAAEM,MAAAA;AAAF,QAAyB,KAAKiB,KAApC;AACA,wBACE,oBAAC,yBAAD,eACMY,IADN;AAEE,MAAA,KAAK,EAAE,CAACJ,KAAD,EAAQzB,kBAAR,CAFT;AAGE,MAAA,aAAa,EAAE,KAAK8B;AAHtB,QAIG,KAAKZ,cAAL,EAJH,CADF;AAQD;;AAjFD;;;;gBAHmB3B,kB,kBAIG,EACpB,GAAGwC,0BAAiBC,YADA;AAEpBjC,EAAAA,aAAa,EAAE,IAFK;AAGpBkC,EAAAA,aAAa,EAAE,GAHK;AAIpB/B,EAAAA,aAAa,EAAE;AAJK,C","sourcesContent":["import * as React from 'react';\r\nimport { Component } from 'react';\r\nimport GenericTouchable, {\r\n  GenericTouchableProps,\r\n  TOUCHABLE_STATE,\r\n} from './GenericTouchable';\r\nimport {\r\n  StyleSheet,\r\n  View,\r\n  TouchableHighlightProps as RNTouchableHighlightProps,\r\n  ColorValue,\r\n  ViewProps,\r\n} from 'react-native';\r\n\r\ninterface State {\r\n  extraChildStyle: null | {\r\n    opacity?: number;\r\n  };\r\n  extraUnderlayStyle: null | {\r\n    backgroundColor?: ColorValue;\r\n  };\r\n}\r\n\r\nexport type TouchableHighlightProps = RNTouchableHighlightProps &\r\n  GenericTouchableProps;\r\n\r\n/**\r\n * TouchableHighlight follows RN's implementation\r\n */\r\nexport default class TouchableHighlight extends Component<\r\n  TouchableHighlightProps,\r\n  State\r\n> {\r\n  static defaultProps = {\r\n    ...GenericTouchable.defaultProps,\r\n    activeOpacity: 0.85,\r\n    delayPressOut: 100,\r\n    underlayColor: 'black',\r\n  };\r\n\r\n  constructor(props: TouchableHighlightProps) {\r\n    super(props);\r\n    this.state = {\r\n      extraChildStyle: null,\r\n      extraUnderlayStyle: null,\r\n    };\r\n  }\r\n\r\n  // Copied from RN\r\n  showUnderlay = () => {\r\n    if (!this.hasPressHandler()) {\r\n      return;\r\n    }\r\n    this.setState({\r\n      extraChildStyle: {\r\n        opacity: this.props.activeOpacity,\r\n      },\r\n      extraUnderlayStyle: {\r\n        backgroundColor: this.props.underlayColor,\r\n      },\r\n    });\r\n    this.props.onShowUnderlay?.();\r\n  };\r\n\r\n  hasPressHandler = () =>\r\n    this.props.onPress ||\r\n    this.props.onPressIn ||\r\n    this.props.onPressOut ||\r\n    this.props.onLongPress;\r\n\r\n  hideUnderlay = () => {\r\n    this.setState({\r\n      extraChildStyle: null,\r\n      extraUnderlayStyle: null,\r\n    });\r\n    this.props.onHideUnderlay?.();\r\n  };\r\n\r\n  renderChildren() {\r\n    if (!this.props.children) {\r\n      return <View />;\r\n    }\r\n\r\n    const child = React.Children.only(\r\n      this.props.children\r\n    ) as React.ReactElement<ViewProps>; // TODO: not sure if OK but fixes error\r\n    return React.cloneElement(child, {\r\n      style: StyleSheet.compose(child.props.style, this.state.extraChildStyle),\r\n    });\r\n  }\r\n\r\n  onStateChange = (_from: number, to: number) => {\r\n    if (to === TOUCHABLE_STATE.BEGAN) {\r\n      this.showUnderlay();\r\n    } else if (\r\n      to === TOUCHABLE_STATE.UNDETERMINED ||\r\n      to === TOUCHABLE_STATE.MOVED_OUTSIDE\r\n    ) {\r\n      this.hideUnderlay();\r\n    }\r\n  };\r\n\r\n  render() {\r\n    const { style = {}, ...rest } = this.props;\r\n    const { extraUnderlayStyle } = this.state;\r\n    return (\r\n      <GenericTouchable\r\n        {...rest}\r\n        style={[style, extraUnderlayStyle]}\r\n        onStateChange={this.onStateChange}>\r\n        {this.renderChildren()}\r\n      </GenericTouchable>\r\n    );\r\n  }\r\n}\r\n"]}

package/lib/commonjs/components/touchables/TouchableNativeFeedback.android.js

@@ -0,0 +1,100 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _reactNative = require("react-native");
+
+var React = _interopRequireWildcard(require("react"));
+
+var _GenericTouchable = _interopRequireDefault(require("./GenericTouchable"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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 || 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); }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+/**
+ * TouchableNativeFeedback behaves slightly different than RN's TouchableNativeFeedback.
+ * There's small difference with handling long press ripple since RN's implementation calls
+ * ripple animation via bridge. This solution leaves all animations' handling for native components so
+ * it follows native behaviours.
+ */
+class TouchableNativeFeedback extends React.Component {
+  // could be taken as RNTouchableNativeFeedback.SelectableBackground etc. but the API may change
+  getExtraButtonProps() {
+    const extraProps = {};
+    const {
+      background
+    } = this.props;
+
+    if (background) {
+      // I changed type values to match those used in RN
+      // TODO(TS): check if it works the same as previous implementation - looks like it works the same as RN component, so it should be ok
+      if (background.type === 'RippleAndroid') {
+        extraProps['borderless'] = background.borderless;
+        extraProps['rippleColor'] = background.color;
+      } else if (background.type === 'ThemeAttrAndroid') {
+        extraProps['borderless'] = background.attribute === 'selectableItemBackgroundBorderless';
+      } // I moved it from above since it should be available in all options
+
+
+      extraProps['rippleRadius'] = background.rippleRadius;
+    }
+
+    extraProps['foreground'] = this.props.useForeground;
+    return extraProps;
+  }
+
+  render() {
+    const {
+      style = {},
+      ...rest
+    } = this.props;
+    return /*#__PURE__*/React.createElement(_GenericTouchable.default, _extends({}, rest, {
+      style: style,
+      extraButtonProps: this.getExtraButtonProps()
+    }));
+  }
+
+}
+
+exports.default = TouchableNativeFeedback;
+
+_defineProperty(TouchableNativeFeedback, "defaultProps", { ..._GenericTouchable.default.defaultProps,
+  useForeground: true,
+  extraButtonProps: {
+    // Disable hiding ripple on Android
+    rippleColor: null
+  }
+});
+
+_defineProperty(TouchableNativeFeedback, "SelectableBackground", rippleRadius => ({
+  type: 'ThemeAttrAndroid',
+  // I added `attribute` prop to clone the implementation of RN and be able to use only 2 types
+  attribute: 'selectableItemBackground',
+  rippleRadius
+}));
+
+_defineProperty(TouchableNativeFeedback, "SelectableBackgroundBorderless", rippleRadius => ({
+  type: 'ThemeAttrAndroid',
+  attribute: 'selectableItemBackgroundBorderless',
+  rippleRadius
+}));
+
+_defineProperty(TouchableNativeFeedback, "Ripple", (color, borderless, rippleRadius) => ({
+  type: 'RippleAndroid',
+  color,
+  borderless,
+  rippleRadius
+}));
+
+_defineProperty(TouchableNativeFeedback, "canUseNativeForeground", () => _reactNative.Platform.OS === 'android' && _reactNative.Platform.Version >= 23);
+//# sourceMappingURL=TouchableNativeFeedback.android.js.map

package/lib/commonjs/components/touchables/TouchableNativeFeedback.android.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["TouchableNativeFeedback.android.tsx"],"names":["TouchableNativeFeedback","Component","getExtraButtonProps","extraProps","background","props","type","borderless","color","attribute","rippleRadius","useForeground","render","style","rest","GenericTouchable","defaultProps","extraButtonProps","rippleColor","Platform","OS","Version"],"mappings":";;;;;;;AAAA;;AAKA;;AAEA;;;;;;;;;;;;AAYA;AACA;AACA;AACA;AACA;AACA;AACe,MAAMA,uBAAN,SAAsCC,eAAtC,CAA8E;AAU3F;AA0BAC,EAAAA,mBAAmB,GAAG;AACpB,UAAMC,UAA6C,GAAG,EAAtD;AACA,UAAM;AAAEC,MAAAA;AAAF,QAAiB,KAAKC,KAA5B;;AACA,QAAID,UAAJ,EAAgB;AACd;AACA;AACA,UAAIA,UAAU,CAACE,IAAX,KAAoB,eAAxB,EAAyC;AACvCH,QAAAA,UAAU,CAAC,YAAD,CAAV,GAA2BC,UAAU,CAACG,UAAtC;AACAJ,QAAAA,UAAU,CAAC,aAAD,CAAV,GAA4BC,UAAU,CAACI,KAAvC;AACD,OAHD,MAGO,IAAIJ,UAAU,CAACE,IAAX,KAAoB,kBAAxB,EAA4C;AACjDH,QAAAA,UAAU,CAAC,YAAD,CAAV,GACEC,UAAU,CAACK,SAAX,KAAyB,oCAD3B;AAED,OATa,CAUd;;;AACAN,MAAAA,UAAU,CAAC,cAAD,CAAV,GAA6BC,UAAU,CAACM,YAAxC;AACD;;AACDP,IAAAA,UAAU,CAAC,YAAD,CAAV,GAA2B,KAAKE,KAAL,CAAWM,aAAtC;AACA,WAAOR,UAAP;AACD;;AACDS,EAAAA,MAAM,GAAG;AACP,UAAM;AAAEC,MAAAA,KAAK,GAAG,EAAV;AAAc,SAAGC;AAAjB,QAA0B,KAAKT,KAArC;AACA,wBACE,oBAAC,yBAAD,eACMS,IADN;AAEE,MAAA,KAAK,EAAED,KAFT;AAGE,MAAA,gBAAgB,EAAE,KAAKX,mBAAL;AAHpB,OADF;AAOD;;AAhE0F;;;;gBAAxEF,uB,kBACG,EACpB,GAAGe,0BAAiBC,YADA;AAEpBL,EAAAA,aAAa,EAAE,IAFK;AAGpBM,EAAAA,gBAAgB,EAAE;AAChB;AACAC,IAAAA,WAAW,EAAE;AAFG;AAHE,C;;gBADHlB,uB,0BAWYU,YAAD,KAA4B;AACxDJ,EAAAA,IAAI,EAAE,kBADkD;AAExD;AACAG,EAAAA,SAAS,EAAE,0BAH6C;AAIxDC,EAAAA;AAJwD,CAA5B,C;;gBAXXV,uB,oCAiBsBU,YAAD,KAA4B;AAClEJ,EAAAA,IAAI,EAAE,kBAD4D;AAElEG,EAAAA,SAAS,EAAE,oCAFuD;AAGlEC,EAAAA;AAHkE,CAA5B,C;;gBAjBrBV,uB,YAsBH,CACdQ,KADc,EAEdD,UAFc,EAGdG,YAHc,MAIV;AACJJ,EAAAA,IAAI,EAAE,eADF;AAEJE,EAAAA,KAFI;AAGJD,EAAAA,UAHI;AAIJG,EAAAA;AAJI,CAJU,C;;gBAtBGV,uB,4BAiCa,MAC9BmB,sBAASC,EAAT,KAAgB,SAAhB,IAA6BD,sBAASE,OAAT,IAAoB,E","sourcesContent":["import {\r\n  Platform,\r\n  TouchableNativeFeedbackProps as RNTouchableNativeFeedbackProps,\r\n  ColorValue,\r\n} from 'react-native';\r\nimport * as React from 'react';\r\nimport { Component } from 'react';\r\nimport GenericTouchable, { GenericTouchableProps } from './GenericTouchable';\r\n\r\nexport type TouchableNativeFeedbackExtraProps = {\r\n  borderless?: boolean;\r\n  rippleColor?: number | null;\r\n  rippleRadius?: number | null;\r\n  foreground?: boolean;\r\n};\r\n\r\nexport type TouchableNativeFeedbackProps = RNTouchableNativeFeedbackProps &\r\n  GenericTouchableProps;\r\n\r\n/**\r\n * TouchableNativeFeedback behaves slightly different than RN's TouchableNativeFeedback.\r\n * There's small difference with handling long press ripple since RN's implementation calls\r\n * ripple animation via bridge. This solution leaves all animations' handling for native components so\r\n * it follows native behaviours.\r\n */\r\nexport default class TouchableNativeFeedback extends Component<TouchableNativeFeedbackProps> {\r\n  static defaultProps = {\r\n    ...GenericTouchable.defaultProps,\r\n    useForeground: true,\r\n    extraButtonProps: {\r\n      // Disable hiding ripple on Android\r\n      rippleColor: null,\r\n    },\r\n  };\r\n\r\n  // could be taken as RNTouchableNativeFeedback.SelectableBackground etc. but the API may change\r\n  static SelectableBackground = (rippleRadius?: number) => ({\r\n    type: 'ThemeAttrAndroid',\r\n    // I added `attribute` prop to clone the implementation of RN and be able to use only 2 types\r\n    attribute: 'selectableItemBackground',\r\n    rippleRadius,\r\n  });\r\n  static SelectableBackgroundBorderless = (rippleRadius?: number) => ({\r\n    type: 'ThemeAttrAndroid',\r\n    attribute: 'selectableItemBackgroundBorderless',\r\n    rippleRadius,\r\n  });\r\n  static Ripple = (\r\n    color: ColorValue,\r\n    borderless: boolean,\r\n    rippleRadius?: number\r\n  ) => ({\r\n    type: 'RippleAndroid',\r\n    color,\r\n    borderless,\r\n    rippleRadius,\r\n  });\r\n\r\n  static canUseNativeForeground = () =>\r\n    Platform.OS === 'android' && Platform.Version >= 23;\r\n\r\n  getExtraButtonProps() {\r\n    const extraProps: TouchableNativeFeedbackExtraProps = {};\r\n    const { background } = this.props;\r\n    if (background) {\r\n      // I changed type values to match those used in RN\r\n      // TODO(TS): check if it works the same as previous implementation - looks like it works the same as RN component, so it should be ok\r\n      if (background.type === 'RippleAndroid') {\r\n        extraProps['borderless'] = background.borderless;\r\n        extraProps['rippleColor'] = background.color;\r\n      } else if (background.type === 'ThemeAttrAndroid') {\r\n        extraProps['borderless'] =\r\n          background.attribute === 'selectableItemBackgroundBorderless';\r\n      }\r\n      // I moved it from above since it should be available in all options\r\n      extraProps['rippleRadius'] = background.rippleRadius;\r\n    }\r\n    extraProps['foreground'] = this.props.useForeground;\r\n    return extraProps;\r\n  }\r\n  render() {\r\n    const { style = {}, ...rest } = this.props;\r\n    return (\r\n      <GenericTouchable\r\n        {...rest}\r\n        style={style}\r\n        extraButtonProps={this.getExtraButtonProps()}\r\n      />\r\n    );\r\n  }\r\n}\r\n"]}

package/lib/commonjs/components/touchables/TouchableNativeFeedback.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _reactNative = require("react-native");
+
+var _default = _reactNative.TouchableNativeFeedback;
+exports.default = _default;
+//# sourceMappingURL=TouchableNativeFeedback.js.map

package/lib/commonjs/components/touchables/TouchableNativeFeedback.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["TouchableNativeFeedback.tsx"],"names":["TouchableNativeFeedback"],"mappings":";;;;;;;AAAA;;eAEeA,oC","sourcesContent":["import { TouchableNativeFeedback } from 'react-native';\r\n\r\nexport default TouchableNativeFeedback;\r\n"]}

package/lib/commonjs/components/touchables/TouchableOpacity.js

@@ -0,0 +1,77 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _reactNative = require("react-native");
+
+var _GenericTouchable = _interopRequireWildcard(require("./GenericTouchable"));
+
+var React = _interopRequireWildcard(require("react"));
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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 || 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); }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+/**
+ * TouchableOpacity bases on timing animation which has been used in RN's core
+ */
+class TouchableOpacity extends React.Component {
+  constructor(...args) {
+    super(...args);
+
+    _defineProperty(this, "getChildStyleOpacityWithDefault", () => {
+      const childStyle = _reactNative.StyleSheet.flatten(this.props.style) || {};
+      return childStyle.opacity == null ? 1 : childStyle.opacity.valueOf();
+    });
+
+    _defineProperty(this, "opacity", new _reactNative.Animated.Value(this.getChildStyleOpacityWithDefault()));
+
+    _defineProperty(this, "setOpacityTo", (value, duration) => {
+      var _this$props$useNative;
+
+      _reactNative.Animated.timing(this.opacity, {
+        toValue: value,
+        duration: duration,
+        easing: _reactNative.Easing.inOut(_reactNative.Easing.quad),
+        useNativeDriver: (_this$props$useNative = this.props.useNativeAnimations) !== null && _this$props$useNative !== void 0 ? _this$props$useNative : true
+      }).start();
+    });
+
+    _defineProperty(this, "onStateChange", (_from, to) => {
+      if (to === _GenericTouchable.TOUCHABLE_STATE.BEGAN) {
+        this.setOpacityTo(this.props.activeOpacity, 0);
+      } else if (to === _GenericTouchable.TOUCHABLE_STATE.UNDETERMINED || to === _GenericTouchable.TOUCHABLE_STATE.MOVED_OUTSIDE) {
+        this.setOpacityTo(this.getChildStyleOpacityWithDefault(), 150);
+      }
+    });
+  }
+
+  render() {
+    const {
+      style = {},
+      ...rest
+    } = this.props;
+    return /*#__PURE__*/React.createElement(_GenericTouchable.default, _extends({}, rest, {
+      style: [style, {
+        opacity: this.opacity // TODO: fix this
+
+      }],
+      onStateChange: this.onStateChange
+    }), this.props.children ? this.props.children : /*#__PURE__*/React.createElement(_reactNative.View, null));
+  }
+
+}
+
+exports.default = TouchableOpacity;
+
+_defineProperty(TouchableOpacity, "defaultProps", { ..._GenericTouchable.default.defaultProps,
+  activeOpacity: 0.2
+});
+//# sourceMappingURL=TouchableOpacity.js.map