@office-iss/react-native-win32 0.79.0-preview.2 → 0.80.0-preview.1

package/Libraries/Animated/nodes/AnimatedProps.js

@@ -22,9 +22,15 @@ import invariant from 'invariant';
 
 export type AnimatedPropsAllowlist = $ReadOnly<{
   style?: ?AnimatedStyleAllowlist,
-  [string]: true,
+  [key: string]: true | AnimatedStyleAllowlist,
 }>;
 
+type TargetView = {
+  +instance: TargetViewInstance,
+  connectedViewTag: ?number,
+};
+type TargetViewInstance = React.ElementRef<React.ElementType>;
+
 function createAnimatedProps(
   inputProps: {[string]: mixed},
   allowlist: ?AnimatedPropsAllowlist,
@@ -75,11 +81,11 @@ function createAnimatedProps(
 }
 
 export default class AnimatedProps extends AnimatedNode {
-  #animatedView: any = null;
   #callback: () => void;
   #nodeKeys: $ReadOnlyArray<string>;
   #nodes: $ReadOnlyArray<AnimatedNode>;
   #props: {[string]: mixed};
+  #target: ?TargetView = null;
 
   constructor(
     inputProps: {[string]: mixed},
@@ -140,6 +146,22 @@ export default class AnimatedProps extends AnimatedNode {
     return props;
   }
 
+  __getNativeAnimatedEventTuples(): $ReadOnlyArray<[string, AnimatedEvent]> {
+    const tuples = [];
+
+    const keys = Object.keys(this.#props);
+    for (let ii = 0, length = keys.length; ii < length; ii++) {
+      const key = keys[ii];
+      const value = this.#props[key];
+
+      if (value instanceof AnimatedEvent && value.__isNative) {
+        tuples.push([key, value]);
+      }
+    }
+
+    return tuples;
+  }
+
   __getAnimatedValue(): Object {
     const props: {[string]: mixed} = {};
 
@@ -164,10 +186,10 @@ export default class AnimatedProps extends AnimatedNode {
   }
 
   __detach(): void {
-    if (this.__isNative && this.#animatedView) {
-      this.__disconnectAnimatedView();
+    if (this.__isNative && this.#target != null) {
+      this.#disconnectAnimatedView(this.#target);
     }
-    this.#animatedView = null;
+    this.#target = null;
 
     const nodes = this.#nodes;
     for (let ii = 0, length = nodes.length; ii < length; ii++) {
@@ -193,56 +215,54 @@ export default class AnimatedProps extends AnimatedNode {
       this.__isNative = true;
 
       // Since this does not call the super.__makeNative, we need to store the
-      // supplied platformConfig here, before calling __connectAnimatedView
+      // supplied platformConfig here, before calling #connectAnimatedView
       // where it will be needed to traverse the graph of attached values.
       super.__setPlatformConfig(platformConfig);
 
-      if (this.#animatedView) {
-        this.__connectAnimatedView();
+      if (this.#target != null) {
+        this.#connectAnimatedView(this.#target);
       }
     }
   }
 
-  setNativeView(animatedView: any): void {
-    if (this.#animatedView === animatedView) {
+  setNativeView(instance: TargetViewInstance): void {
+    if (this.#target?.instance === instance) {
       return;
     }
-    this.#animatedView = animatedView;
+    this.#target = {instance, connectedViewTag: null};
     if (this.__isNative) {
-      this.__connectAnimatedView();
+      this.#connectAnimatedView(this.#target);
     }
   }
 
-  __connectAnimatedView(): void {
+  #connectAnimatedView(target: TargetView): void {
     invariant(this.__isNative, 'Expected node to be marked as "native"');
-    let nativeViewTag: ?number = findNodeHandle(this.#animatedView);
-    if (nativeViewTag == null) {
+    let viewTag: ?number = findNodeHandle(target.instance);
+    if (viewTag == null) {
       if (process.env.NODE_ENV === 'test') {
-        nativeViewTag = -1;
+        viewTag = -1;
       } else {
         throw new Error('Unable to locate attached view in the native tree');
       }
     }
     NativeAnimatedHelper.API.connectAnimatedNodeToView(
       this.__getNativeTag(),
-      nativeViewTag,
+      viewTag,
     );
+    target.connectedViewTag = viewTag;
   }
 
-  __disconnectAnimatedView(): void {
+  #disconnectAnimatedView(target: TargetView): void {
     invariant(this.__isNative, 'Expected node to be marked as "native"');
-    let nativeViewTag: ?number = findNodeHandle(this.#animatedView);
-    if (nativeViewTag == null) {
-      if (process.env.NODE_ENV === 'test') {
-        nativeViewTag = -1;
-      } else {
-        throw new Error('Unable to locate attached view in the native tree');
-      }
+    const viewTag = target.connectedViewTag;
+    if (viewTag == null) {
+      return;
     }
     NativeAnimatedHelper.API.disconnectAnimatedNodeFromView(
       this.__getNativeTag(),
-      nativeViewTag,
+      viewTag,
     );
+    target.connectedViewTag = null;
   }
 
   __restoreDefaultValues(): void {

package/Libraries/Animated/nodes/AnimatedValue.js

@@ -10,7 +10,8 @@
 
 import type {EventSubscription} from '../../vendor/emitter/EventEmitter';
 import type {PlatformConfig} from '../AnimatedPlatformConfig';
-import type Animation, {EndCallback} from '../animations/Animation';
+import type Animation from '../animations/Animation';
+import type {EndCallback} from '../animations/Animation';
 import type {InterpolationConfigType} from './AnimatedInterpolation';
 import type AnimatedNode from './AnimatedNode';
 import type {AnimatedNodeConfig} from './AnimatedNode';
@@ -51,7 +52,6 @@ const NativeAnimatedAPI = NativeAnimatedHelper.API;
  * transform which can receive values from multiple parents.
  */
 export function flushValue(rootNode: AnimatedNode): void {
-  // eslint-disable-next-line func-call-spacing
   const leaves = new Set<{update: () => void, ...}>();
   function findAnimatedStyles(node: AnimatedNode) {
     // $FlowFixMe[prop-missing]
@@ -85,8 +85,8 @@ function _executeAsAnimatedBatch(id: string, operation: () => void) {
  * See https://reactnative.dev/docs/animatedvalue
  */
 export default class AnimatedValue extends AnimatedWithChildren {
-  #listenerCount: number = 0;
-  #updateSubscription: ?EventSubscription = null;
+  #listenerCount: number;
+  #updateSubscription: ?EventSubscription;
 
   _value: number;
   _startingValue: number;
@@ -99,6 +99,10 @@ export default class AnimatedValue extends AnimatedWithChildren {
     if (typeof value !== 'number') {
       throw new Error('AnimatedValue: Attempting to set value to undefined');
     }
+
+    this.#listenerCount = 0;
+    this.#updateSubscription = null;
+
     this._startingValue = this._value = value;
     this._offset = 0;
     this._animation = null;
@@ -164,7 +168,7 @@ export default class AnimatedValue extends AnimatedWithChildren {
         'onAnimatedValueUpdate',
         data => {
           if (data.tag === nativeTag) {
-            this.__onAnimatedValueUpdateReceived(data.value);
+            this.__onAnimatedValueUpdateReceived(data.value, data.offset);
           }
         },
       );
@@ -242,7 +246,9 @@ export default class AnimatedValue extends AnimatedWithChildren {
     this._offset += this._value;
     this._value = 0;
     if (this.__isNative) {
-      NativeAnimatedAPI.extractAnimatedNodeOffset(this.__getNativeTag());
+      _executeAsAnimatedBatch(this.__getNativeTag().toString(), () =>
+        NativeAnimatedAPI.extractAnimatedNodeOffset(this.__getNativeTag()),
+      );
     }
   }
 
@@ -282,8 +288,11 @@ export default class AnimatedValue extends AnimatedWithChildren {
     }
   }
 
-  __onAnimatedValueUpdateReceived(value: number): void {
+  __onAnimatedValueUpdateReceived(value: number, offset?: number): void {
     this._updateValue(value, false /*flush*/);
+    if (offset != null) {
+      this._offset = offset;
+    }
   }
 
   /**

package/Libraries/Animated/nodes/AnimatedValueXY.js

@@ -214,7 +214,9 @@ export default class AnimatedValueXY extends AnimatedWithChildren {
    *
    * See https://reactnative.dev/docs/animatedvaluexy#gettranslatetransform
    */
-  getTranslateTransform(): Array<{[key: string]: AnimatedValue, ...}> {
+  getTranslateTransform(): Array<
+    {translateX: AnimatedValue} | {translateY: AnimatedValue},
+  > {
     return [{translateX: this.x}, {translateY: this.y}];
   }
 

package/Libraries/AppState/AppState.js

@@ -22,7 +22,12 @@ import NativeAppState from './NativeAppState';
  *   - @platform android - on another Activity (even if it was launched by your app)
  * @platform ios - inactive - This is a state that occurs when transitioning between foreground & background, and during periods of inactivity such as entering the multitasking view, opening the Notification Center or in the event of an incoming call.
  */
-export type AppStateStatus = 'inactive' | 'background' | 'active';
+export type AppStateStatus =
+  | 'inactive'
+  | 'background'
+  | 'active'
+  | 'extension'
+  | 'unknown';
 
 /**
  * change - This even is received when the app state has changed.
@@ -107,7 +112,7 @@ class AppStateImpl {
    */
   addEventListener<K: AppStateEvent>(
     type: K,
-    handler: (...$ElementType<AppStateEventDefinitions, K>) => void,
+    handler: (...AppStateEventDefinitions[K]) => void,
   ): EventSubscription {
     const emitter = this._emitter;
     if (emitter == null) {

package/Libraries/BatchedBridge/MessageQueue.js

@@ -35,7 +35,7 @@ const PARAMS = 2;
 const MIN_TIME_BETWEEN_FLUSHES_MS = 5;
 
 // eslint-disable-next-line no-bitwise
-const TRACE_TAG_REACT_APPS = 1 << 17;
+const TRACE_TAG_REACT = 1 << 13;
 
 const DEBUG_INFO_LIMIT = 32;
 
@@ -228,7 +228,7 @@ class MessageQueue {
     if (__DEV__) {
       global.nativeTraceBeginAsyncFlow &&
         global.nativeTraceBeginAsyncFlow(
-          TRACE_TAG_REACT_APPS,
+          TRACE_TAG_REACT,
           'native',
           this._callID,
         );

package/Libraries/BatchedBridge/NativeModules.js

@@ -65,6 +65,7 @@ function genModule(
       module[methodName] = genMethod(moduleID, methodID, methodType);
     });
 
+  // $FlowFixMe[unsafe-object-assign]
   Object.assign(module, constants);
 
   if (module.getConstants == null) {
@@ -173,6 +174,7 @@ function updateErrorWithErrorData(
   /* $FlowFixMe[class-object-subtyping] added when improving typing for this
    * parameters */
   // $FlowFixMe[incompatible-return]
+  // $FlowFixMe[unsafe-object-assign]
   return Object.assign(error, errorData || {});
 }
 

package/Libraries/Blob/BlobManager.js

@@ -110,6 +110,7 @@ class BlobManager {
   static createFromOptions(options: BlobData): Blob {
     BlobRegistry.register(options.blobId);
     // $FlowFixMe[prop-missing]
+    // $FlowFixMe[unsafe-object-assign]
     return Object.assign(Object.create(Blob.prototype), {
       data:
         // Reuse the collector instance when creating from an existing blob.

package/Libraries/Blob/FileReader.js

@@ -8,13 +8,224 @@
  * @format
  */
 
-import typeof FileReader from './FileReader_old';
+import type {EventCallback} from '../../src/private/webapis/dom/events/EventTarget';
+import type Blob from './Blob';
 
-// Use a global instead of a flag from ReactNativeFeatureFlags because this will
-// be read before apps have a chance to set overrides.
-const useBuiltInEventTarget = global.RN$useBuiltInEventTarget?.();
+import Event from '../../src/private/webapis/dom/events/Event';
+import {
+  getEventHandlerAttribute,
+  setEventHandlerAttribute,
+} from '../../src/private/webapis/dom/events/EventHandlerAttributes';
+import EventTarget from '../../src/private/webapis/dom/events/EventTarget';
+import NativeFileReaderModule from './NativeFileReaderModule';
+import {toByteArray} from 'base64-js';
 
-export default (useBuiltInEventTarget
-  ? // $FlowExpectedError[incompatible-cast]
-    require('./FileReader_new').default
-  : require('./FileReader_old').default) as FileReader;
+type ReadyState =
+  | 0 // EMPTY
+  | 1 // LOADING
+  | 2; // DONE
+
+type ReaderResult = string | ArrayBuffer;
+
+const EMPTY = 0;
+const LOADING = 1;
+const DONE = 2;
+
+class FileReader extends EventTarget {
+  static EMPTY: number = EMPTY;
+  static LOADING: number = LOADING;
+  static DONE: number = DONE;
+
+  EMPTY: number = EMPTY;
+  LOADING: number = LOADING;
+  DONE: number = DONE;
+
+  _readyState: ReadyState;
+  _error: ?Error;
+  _result: ?ReaderResult;
+  _aborted: boolean = false;
+
+  constructor() {
+    super();
+    this._reset();
+  }
+
+  _reset(): void {
+    this._readyState = EMPTY;
+    this._error = null;
+    this._result = null;
+  }
+
+  _setReadyState(newState: ReadyState) {
+    this._readyState = newState;
+    this.dispatchEvent(new Event('readystatechange'));
+    if (newState === DONE) {
+      if (this._aborted) {
+        this.dispatchEvent(new Event('abort'));
+      } else if (this._error) {
+        this.dispatchEvent(new Event('error'));
+      } else {
+        this.dispatchEvent(new Event('load'));
+      }
+      this.dispatchEvent(new Event('loadend'));
+    }
+  }
+
+  readAsArrayBuffer(blob: ?Blob): void {
+    this._aborted = false;
+
+    if (blob == null) {
+      throw new TypeError(
+        "Failed to execute 'readAsArrayBuffer' on 'FileReader': parameter 1 is not of type 'Blob'",
+      );
+    }
+
+    NativeFileReaderModule.readAsDataURL(blob.data).then(
+      (text: string) => {
+        if (this._aborted) {
+          return;
+        }
+
+        const base64 = text.split(',')[1];
+        const typedArray = toByteArray(base64);
+
+        this._result = typedArray.buffer;
+        this._setReadyState(DONE);
+      },
+      error => {
+        if (this._aborted) {
+          return;
+        }
+        this._error = error;
+        this._setReadyState(DONE);
+      },
+    );
+  }
+
+  readAsDataURL(blob: ?Blob): void {
+    this._aborted = false;
+
+    if (blob == null) {
+      throw new TypeError(
+        "Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'",
+      );
+    }
+
+    NativeFileReaderModule.readAsDataURL(blob.data).then(
+      (text: string) => {
+        if (this._aborted) {
+          return;
+        }
+        this._result = text;
+        this._setReadyState(DONE);
+      },
+      error => {
+        if (this._aborted) {
+          return;
+        }
+        this._error = error;
+        this._setReadyState(DONE);
+      },
+    );
+  }
+
+  readAsText(blob: ?Blob, encoding: string = 'UTF-8'): void {
+    this._aborted = false;
+
+    if (blob == null) {
+      throw new TypeError(
+        "Failed to execute 'readAsText' on 'FileReader': parameter 1 is not of type 'Blob'",
+      );
+    }
+
+    NativeFileReaderModule.readAsText(blob.data, encoding).then(
+      (text: string) => {
+        if (this._aborted) {
+          return;
+        }
+        this._result = text;
+        this._setReadyState(DONE);
+      },
+      error => {
+        if (this._aborted) {
+          return;
+        }
+        this._error = error;
+        this._setReadyState(DONE);
+      },
+    );
+  }
+
+  abort() {
+    this._aborted = true;
+    // only call onreadystatechange if there is something to abort, as per spec
+    if (this._readyState !== EMPTY && this._readyState !== DONE) {
+      this._reset();
+      this._setReadyState(DONE);
+    }
+    // Reset again after, in case modified in handler
+    this._reset();
+  }
+
+  get readyState(): ReadyState {
+    return this._readyState;
+  }
+
+  get error(): ?Error {
+    return this._error;
+  }
+
+  get result(): ?ReaderResult {
+    return this._result;
+  }
+
+  get onabort(): EventCallback | null {
+    return getEventHandlerAttribute(this, 'abort');
+  }
+
+  set onabort(listener: ?EventCallback) {
+    setEventHandlerAttribute(this, 'abort', listener);
+  }
+
+  get onerror(): EventCallback | null {
+    return getEventHandlerAttribute(this, 'error');
+  }
+
+  set onerror(listener: ?EventCallback) {
+    setEventHandlerAttribute(this, 'error', listener);
+  }
+
+  get onload(): EventCallback | null {
+    return getEventHandlerAttribute(this, 'load');
+  }
+
+  set onload(listener: ?EventCallback) {
+    setEventHandlerAttribute(this, 'load', listener);
+  }
+
+  get onloadstart(): EventCallback | null {
+    return getEventHandlerAttribute(this, 'loadstart');
+  }
+
+  set onloadstart(listener: ?EventCallback) {
+    setEventHandlerAttribute(this, 'loadstart', listener);
+  }
+
+  get onloadend(): EventCallback | null {
+    return getEventHandlerAttribute(this, 'loadend');
+  }
+
+  set onloadend(listener: ?EventCallback) {
+    setEventHandlerAttribute(this, 'loadend', listener);
+  }
+
+  get onprogress(): EventCallback | null {
+    return getEventHandlerAttribute(this, 'progress');
+  }
+
+  set onprogress(listener: ?EventCallback) {
+    setEventHandlerAttribute(this, 'progress', listener);
+  }
+}
+
+export default FileReader;

package/Libraries/Blob/URL.js

@@ -81,7 +81,19 @@ export class URL {
     let baseUrl = null;
     if (!base || validateBaseUrl(url)) {
       this._url = url;
-      if (!this._url.endsWith('/')) {
+      if (this._url.includes('#')) {
+        const split = this._url.split('#');
+        const beforeHash = split[0];
+        const website = beforeHash.split('://')[1];
+        if (!website.includes('/')) {
+          this._url = split.join('/#');
+        }
+      }
+
+      if (
+        !this._url.endsWith('/') &&
+        !(this._url.includes('?') || this._url.includes('#'))
+      ) {
         this._url += '/';
       }
     } else {
@@ -107,15 +119,21 @@ export class URL {
   }
 
   get hash(): string {
-    throw new Error('URL.hash is not implemented');
+    const hashMatch = this._url.match(/#([^/]*)/);
+    return hashMatch ? `#${hashMatch[1]}` : '';
   }
 
   get host(): string {
-    throw new Error('URL.host is not implemented');
+    const hostMatch = this._url.match(/^https?:\/\/(?:[^@]+@)?([^:/?#]+)/);
+    const portMatch = this._url.match(/:(\d+)(?=[/?#]|$)/);
+    return hostMatch
+      ? hostMatch[1] + (portMatch ? `:${portMatch[1]}` : '')
+      : '';
   }
 
   get hostname(): string {
-    throw new Error('URL.hostname is not implemented');
+    const hostnameMatch = this._url.match(/^https?:\/\/(?:[^@]+@)?([^:/?#]+)/);
+    return hostnameMatch ? hostnameMatch[1] : '';
   }
 
   get href(): string {
@@ -123,32 +141,38 @@ export class URL {
   }
 
   get origin(): string {
-    throw new Error('URL.origin is not implemented');
+    const matches = this._url.match(/^(https?:\/\/[^/]+)/);
+    return matches ? matches[1] : '';
   }
 
   get password(): string {
-    throw new Error('URL.password is not implemented');
+    const passwordMatch = this._url.match(/https?:\/\/.*:(.*)@/);
+    return passwordMatch ? passwordMatch[1] : '';
   }
 
   get pathname(): string {
-    throw new Error('URL.pathname not implemented');
+    const pathMatch = this._url.match(/https?:\/\/[^/]+(\/[^?#]*)?/);
+    return pathMatch ? pathMatch[1] || '/' : '/';
   }
 
   get port(): string {
-    throw new Error('URL.port is not implemented');
+    const portMatch = this._url.match(/:(\d+)(?=[/?#]|$)/);
+    return portMatch ? portMatch[1] : '';
   }
 
   get protocol(): string {
-    throw new Error('URL.protocol is not implemented');
+    const protocolMatch = this._url.match(/^([a-zA-Z][a-zA-Z\d+\-.]*):/);
+    return protocolMatch ? protocolMatch[1] + ':' : '';
   }
 
   get search(): string {
-    throw new Error('URL.search is not implemented');
+    const searchMatch = this._url.match(/\?([^#]*)/);
+    return searchMatch ? `?${searchMatch[1]}` : '';
   }
 
   get searchParams(): URLSearchParams {
     if (this._searchParamsInstance == null) {
-      this._searchParamsInstance = new URLSearchParams();
+      this._searchParamsInstance = new URLSearchParams(this.search);
     }
     return this._searchParamsInstance;
   }
@@ -168,6 +192,7 @@ export class URL {
   }
 
   get username(): string {
-    throw new Error('URL.username is not implemented');
+    const usernameMatch = this._url.match(/^https?:\/\/([^:@]+)(?::[^@]*)?@/);
+    return usernameMatch ? usernameMatch[1] : '';
   }
 }