@hanzogui/react-native-web-lite 2.0.0-rc.41-hanzoai.5

package/src/vendor/react-native/Animated/nodes/AnimatedNode.js

@@ -0,0 +1,190 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ */
+
+'use strict'
+
+import { NativeAnimatedHelper } from '../NativeAnimatedHelper'
+import { invariant } from '@hanzogui/react-native-web-internals'
+
+const NativeAnimatedAPI = NativeAnimatedHelper.API
+
+let _uniqueId = 1
+
+// Note(vjeux): this would be better as an interface but flow doesn't
+// support them yet
+class AnimatedNode {
+  _listeners
+  _platformConfig
+  __nativeAnimatedValueListener
+  __attach() {}
+  __detach() {
+    if (this.__isNative && this.__nativeTag != null) {
+      NativeAnimatedHelper.API.dropAnimatedNode(this.__nativeTag)
+      this.__nativeTag = undefined
+    }
+  }
+  __getValue() {}
+  __getAnimatedValue() {
+    return this.__getValue()
+  }
+  __addChild(child) {}
+  __removeChild(child) {}
+  __getChildren() {
+    return []
+  }
+
+  /* Methods and props used by native Animated impl */
+  __isNative
+  __nativeTag
+  __shouldUpdateListenersForNewNativeTag
+
+  constructor() {
+    this._listeners = {}
+  }
+
+  __makeNative(platformConfig) {
+    if (!this.__isNative) {
+      throw new Error('This node cannot be made a "native" animated node')
+    }
+
+    this._platformConfig = platformConfig
+    if (this.hasListeners()) {
+      this._startListeningToNativeValueUpdates()
+    }
+  }
+
+  /**
+   * Adds an asynchronous listener to the value so you can observe updates from
+   * animations.  This is useful because there is no way to
+   * synchronously read the value because it might be driven natively.
+   *
+   * See https://reactnative.dev/docs/animatedvalue#addlistener
+   */
+  addListener(callback) {
+    const id = String(_uniqueId++)
+    this._listeners[id] = callback
+    if (this.__isNative) {
+      this._startListeningToNativeValueUpdates()
+    }
+    return id
+  }
+
+  /**
+   * Unregister a listener. The `id` param shall match the identifier
+   * previously returned by `addListener()`.
+   *
+   * See https://reactnative.dev/docs/animatedvalue#removelistener
+   */
+  removeListener(id) {
+    delete this._listeners[id]
+    if (this.__isNative && !this.hasListeners()) {
+      this._stopListeningForNativeValueUpdates()
+    }
+  }
+
+  /**
+   * Remove all registered listeners.
+   *
+   * See https://reactnative.dev/docs/animatedvalue#removealllisteners
+   */
+  removeAllListeners() {
+    this._listeners = {}
+    if (this.__isNative) {
+      this._stopListeningForNativeValueUpdates()
+    }
+  }
+
+  hasListeners() {
+    return !!Object.keys(this._listeners).length
+  }
+
+  _startListeningToNativeValueUpdates() {
+    if (
+      this.__nativeAnimatedValueListener &&
+      !this.__shouldUpdateListenersForNewNativeTag
+    ) {
+      return
+    }
+
+    if (this.__shouldUpdateListenersForNewNativeTag) {
+      this.__shouldUpdateListenersForNewNativeTag = false
+      this._stopListeningForNativeValueUpdates()
+    }
+
+    NativeAnimatedAPI.startListeningToAnimatedNodeValue(this.__getNativeTag())
+    this.__nativeAnimatedValueListener =
+      NativeAnimatedHelper.nativeEventEmitter.addListener(
+        'onAnimatedValueUpdate',
+        (data) => {
+          if (data.tag !== this.__getNativeTag()) {
+            return
+          }
+          this.__onAnimatedValueUpdateReceived(data.value)
+        }
+      )
+  }
+
+  __onAnimatedValueUpdateReceived(value) {
+    this.__callListeners(value)
+  }
+
+  __callListeners(value) {
+    for (const key in this._listeners) {
+      this._listeners[key]({ value })
+    }
+  }
+
+  _stopListeningForNativeValueUpdates() {
+    if (!this.__nativeAnimatedValueListener) {
+      return
+    }
+
+    this.__nativeAnimatedValueListener.remove()
+    this.__nativeAnimatedValueListener = null
+    NativeAnimatedAPI.stopListeningToAnimatedNodeValue(this.__getNativeTag())
+  }
+
+  __getNativeTag() {
+    NativeAnimatedHelper.assertNativeAnimatedModule()
+    invariant(
+      this.__isNative,
+      'Attempt to get native tag from node not marked as "native"'
+    )
+
+    const nativeTag = this.__nativeTag ?? NativeAnimatedHelper.generateNewNodeTag()
+
+    if (this.__nativeTag == null) {
+      this.__nativeTag = nativeTag
+      const config = this.__getNativeConfig()
+      if (this._platformConfig) {
+        config.platformConfig = this._platformConfig
+      }
+      NativeAnimatedHelper.API.createAnimatedNode(nativeTag, config)
+      this.__shouldUpdateListenersForNewNativeTag = true
+    }
+
+    return nativeTag
+  }
+  __getNativeConfig() {
+    throw new Error('This JS animated node type cannot be used as native animated node')
+  }
+  toJSON() {
+    return this.__getValue()
+  }
+
+  __getPlatformConfig() {
+    return this._platformConfig
+  }
+  __setPlatformConfig(platformConfig) {
+    this._platformConfig = platformConfig
+  }
+}
+
+export { AnimatedNode }
+export default AnimatedNode

package/src/vendor/react-native/Animated/nodes/AnimatedProps.js

@@ -0,0 +1,160 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @format
+ */
+
+import { AnimatedEvent } from '../AnimatedEvent'
+import { AnimatedNode } from './AnimatedNode'
+import { AnimatedStyle } from './AnimatedStyle'
+import { NativeAnimatedHelper } from '../NativeAnimatedHelper'
+
+import { invariant } from '@hanzogui/react-native-web-internals'
+
+class AnimatedProps extends AnimatedNode {
+  constructor(props, callback) {
+    super()
+    if (props.style) {
+      props = {
+        ...props,
+        style: new AnimatedStyle(props.style),
+      }
+    }
+    this._props = props
+    this._callback = callback
+    this.__attach()
+  }
+
+  __getValue() {
+    const props = {}
+    for (const key in this._props) {
+      const value = this._props[key]
+      if (value instanceof AnimatedNode) {
+        if (!value.__isNative || value instanceof AnimatedStyle) {
+          // We cannot use value of natively driven nodes this way as the value we have access from
+          // JS may not be up to date.
+          props[key] = value.__getValue()
+        }
+      } else if (value instanceof AnimatedEvent) {
+        props[key] = value.__getHandler()
+      } else {
+        props[key] = value
+      }
+    }
+    return props
+  }
+
+  __getAnimatedValue() {
+    const props = {}
+    for (const key in this._props) {
+      const value = this._props[key]
+      if (value instanceof AnimatedNode) {
+        props[key] = value.__getAnimatedValue()
+      }
+    }
+    return props
+  }
+
+  __attach() {
+    for (const key in this._props) {
+      const value = this._props[key]
+      if (value instanceof AnimatedNode) {
+        value.__addChild(this)
+      }
+    }
+  }
+
+  __detach() {
+    if (this.__isNative && this._animatedView) {
+      this.__disconnectAnimatedView()
+    }
+    for (const key in this._props) {
+      const value = this._props[key]
+      if (value instanceof AnimatedNode) {
+        value.__removeChild(this)
+      }
+    }
+    super.__detach()
+  }
+
+  update() {
+    this._callback()
+  }
+
+  __makeNative() {
+    if (!this.__isNative) {
+      this.__isNative = true
+      for (const key in this._props) {
+        const value = this._props[key]
+        if (value instanceof AnimatedNode) {
+          value.__makeNative()
+        }
+      }
+      if (this._animatedView) {
+        this.__connectAnimatedView()
+      }
+    }
+  }
+
+  setNativeView(animatedView) {
+    if (this._animatedView === animatedView) {
+      return
+    }
+    this._animatedView = animatedView
+    if (this.__isNative) {
+      this.__connectAnimatedView()
+    }
+  }
+
+  __connectAnimatedView() {
+    invariant(this.__isNative, 'Expected node to be marked as "native"')
+    const nativeViewTag = this._animatedView
+    invariant(nativeViewTag != null, 'Unable to locate attached view in the native tree')
+    NativeAnimatedHelper.API.connectAnimatedNodeToView(
+      this.__getNativeTag(),
+      nativeViewTag
+    )
+  }
+
+  __disconnectAnimatedView() {
+    invariant(this.__isNative, 'Expected node to be marked as "native"')
+    const nativeViewTag = this._animatedView
+    invariant(nativeViewTag != null, 'Unable to locate attached view in the native tree')
+    NativeAnimatedHelper.API.disconnectAnimatedNodeFromView(
+      this.__getNativeTag(),
+      nativeViewTag
+    )
+  }
+
+  __restoreDefaultValues() {
+    // When using the native driver, view properties need to be restored to
+    // their default values manually since react no longer tracks them. This
+    // is needed to handle cases where a prop driven by native animated is removed
+    // after having been changed natively by an animation.
+    if (this.__isNative) {
+      NativeAnimatedHelper.API.restoreDefaultValues(this.__getNativeTag())
+    }
+  }
+
+  __getNativeConfig() {
+    const propsConfig = {}
+    for (const propKey in this._props) {
+      const value = this._props[propKey]
+      if (value instanceof AnimatedNode) {
+        value.__makeNative()
+        propsConfig[propKey] = value.__getNativeTag()
+      }
+    }
+    return {
+      type: 'props',
+      props: propsConfig,
+    }
+  }
+}
+
+export { AnimatedProps }
+export default AnimatedProps

package/src/vendor/react-native/Animated/nodes/AnimatedStyle.js

@@ -0,0 +1,137 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @format
+ */
+
+import { AnimatedNode } from './AnimatedNode'
+import { AnimatedTransform } from './AnimatedTransform'
+import { AnimatedWithChildren } from './AnimatedWithChildren'
+import { NativeAnimatedHelper } from '../NativeAnimatedHelper'
+
+import { StyleSheet } from '@hanzogui/react-native-web-internals'
+
+const flattenStyle = StyleSheet.flatten
+
+function createAnimatedStyle(inputStyle) {
+  const style = flattenStyle(inputStyle)
+  const animatedStyles = {}
+  for (const key in style) {
+    const value = style[key]
+    if (key === 'transform' && Array.isArray(value)) {
+      animatedStyles[key] = new AnimatedTransform(value)
+    } else if (value instanceof AnimatedNode) {
+      animatedStyles[key] = value
+    } else if (value && !Array.isArray(value) && typeof value === 'object') {
+      animatedStyles[key] = createAnimatedStyle(value)
+    }
+  }
+  return animatedStyles
+}
+
+class AnimatedStyle extends AnimatedWithChildren {
+  _inputStyle
+  _style
+
+  constructor(style) {
+    super()
+    this._inputStyle = style
+    this._style = createAnimatedStyle(style)
+  }
+
+  // Recursively get values for nested styles (like iOS's shadowOffset)
+  _walkStyleAndGetValues(style) {
+    const updatedStyle = {}
+    for (const key in style) {
+      const value = style[key]
+      if (value instanceof AnimatedNode) {
+        if (!value.__isNative) {
+          // We cannot use value of natively driven nodes this way as the value we have access from
+          // JS may not be up to date.
+          updatedStyle[key] = value.__getValue()
+        }
+      } else if (value && !Array.isArray(value) && typeof value === 'object') {
+        // Support animating nested values (for example: shadowOffset.height)
+        updatedStyle[key] = this._walkStyleAndGetValues(value)
+      } else {
+        updatedStyle[key] = value
+      }
+    }
+    return updatedStyle
+  }
+
+  __getValue() {
+    return [this._inputStyle, this._walkStyleAndGetValues(this._style)]
+  }
+
+  // Recursively get animated values for nested styles (like iOS's shadowOffset)
+  _walkStyleAndGetAnimatedValues(style) {
+    const updatedStyle = {}
+    for (const key in style) {
+      const value = style[key]
+      if (value instanceof AnimatedNode) {
+        updatedStyle[key] = value.__getAnimatedValue()
+      } else if (value && !Array.isArray(value) && typeof value === 'object') {
+        // Support animating nested values (for example: shadowOffset.height)
+        updatedStyle[key] = this._walkStyleAndGetAnimatedValues(value)
+      }
+    }
+    return updatedStyle
+  }
+
+  __getAnimatedValue() {
+    return this._walkStyleAndGetAnimatedValues(this._style)
+  }
+
+  __attach() {
+    for (const key in this._style) {
+      const value = this._style[key]
+      if (value instanceof AnimatedNode) {
+        value.__addChild(this)
+      }
+    }
+  }
+
+  __detach() {
+    for (const key in this._style) {
+      const value = this._style[key]
+      if (value instanceof AnimatedNode) {
+        value.__removeChild(this)
+      }
+    }
+    super.__detach()
+  }
+
+  __makeNative() {
+    for (const key in this._style) {
+      const value = this._style[key]
+      if (value instanceof AnimatedNode) {
+        value.__makeNative()
+      }
+    }
+    super.__makeNative()
+  }
+
+  __getNativeConfig() {
+    const styleConfig = {}
+    for (const styleKey in this._style) {
+      if (this._style[styleKey] instanceof AnimatedNode) {
+        const style = this._style[styleKey]
+        style.__makeNative()
+        styleConfig[styleKey] = style.__getNativeTag()
+      }
+    }
+    NativeAnimatedHelper.validateStyles(styleConfig)
+    return {
+      type: 'style',
+      style: styleConfig,
+    }
+  }
+}
+
+export { AnimatedStyle }
+export default AnimatedStyle

package/src/vendor/react-native/Animated/nodes/AnimatedSubtraction.js

@@ -0,0 +1,60 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ */
+
+'use strict'
+
+import { AnimatedInterpolation } from './AnimatedInterpolation'
+import { AnimatedValue } from './AnimatedValue'
+import { AnimatedWithChildren } from './AnimatedWithChildren'
+
+class AnimatedSubtraction extends AnimatedWithChildren {
+  _a
+  _b
+
+  constructor(a, b) {
+    super()
+    this._a = typeof a === 'number' ? new AnimatedValue(a) : a
+    this._b = typeof b === 'number' ? new AnimatedValue(b) : b
+  }
+
+  __makeNative(platformConfig) {
+    this._a.__makeNative(platformConfig)
+    this._b.__makeNative(platformConfig)
+    super.__makeNative(platformConfig)
+  }
+
+  __getValue() {
+    return this._a.__getValue() - this._b.__getValue()
+  }
+
+  interpolate(config) {
+    return new AnimatedInterpolation(this, config)
+  }
+
+  __attach() {
+    this._a.__addChild(this)
+    this._b.__addChild(this)
+  }
+
+  __detach() {
+    this._a.__removeChild(this)
+    this._b.__removeChild(this)
+    super.__detach()
+  }
+
+  __getNativeConfig() {
+    return {
+      type: 'subtraction',
+      input: [this._a.__getNativeTag(), this._b.__getNativeTag()],
+    }
+  }
+}
+
+export { AnimatedSubtraction }
+export default AnimatedSubtraction

package/src/vendor/react-native/Animated/nodes/AnimatedTracking.js

@@ -0,0 +1,90 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @format
+ */
+
+import { AnimatedValue } from './AnimatedValue'
+import { AnimatedNode } from './AnimatedNode'
+import { generateNewAnimationId, shouldUseNativeDriver } from '../NativeAnimatedHelper'
+
+class AnimatedTracking extends AnimatedNode {
+  _value
+  _parent
+  _callback
+  _animationConfig
+  _animationClass
+  _useNativeDriver
+
+  constructor(value, parent, animationClass, animationConfig, callback) {
+    super()
+    this._value = value
+    this._parent = parent
+    this._animationClass = animationClass
+    this._animationConfig = animationConfig
+    this._useNativeDriver = shouldUseNativeDriver(animationConfig)
+    this._callback = callback
+    this.__attach()
+  }
+
+  __makeNative() {
+    this.__isNative = true
+    this._parent.__makeNative()
+    super.__makeNative()
+    this._value.__makeNative()
+  }
+
+  __getValue() {
+    return this._parent.__getValue()
+  }
+
+  __attach() {
+    this._parent.__addChild(this)
+    if (this._useNativeDriver) {
+      // when the tracking starts we need to convert this node to a "native node"
+      // so that the parent node will be made "native" too. This is necessary as
+      // if we don't do this `update` method will get called. At that point it
+      // may be too late as it would mean the JS driver has already started
+      // updating node values
+      this.__makeNative()
+    }
+  }
+
+  __detach() {
+    this._parent.__removeChild(this)
+    super.__detach()
+  }
+
+  update() {
+    this._value.animate(
+      new this._animationClass({
+        ...this._animationConfig,
+        toValue: this._animationConfig.toValue.__getValue(),
+      }),
+      this._callback
+    )
+  }
+
+  __getNativeConfig() {
+    const animation = new this._animationClass({
+      ...this._animationConfig,
+      // remove toValue from the config as it's a ref to Animated.Value
+      toValue: undefined,
+    })
+    const animationConfig = animation.__getNativeAnimationConfig()
+    return {
+      type: 'tracking',
+      animationId: generateNewAnimationId(),
+      animationConfig,
+      toValue: this._parent.__getNativeTag(),
+      value: this._value.__getNativeTag(),
+    }
+  }
+}
+
+export { AnimatedTracking }
+export default AnimatedTracking