@depup/react-native-web 0.21.2-depup.0

package/src/index.js

@@ -0,0 +1,70 @@
+// @flow strict
+export { default as unstable_createElement } from './exports/createElement';
+export { default as findNodeHandle } from './exports/findNodeHandle';
+export { default as processColor } from './exports/processColor';
+export { default as render } from './exports/render';
+export { default as unmountComponentAtNode } from './exports/unmountComponentAtNode';
+export { default as NativeModules } from './exports/NativeModules';
+
+// APIs
+export { default as AccessibilityInfo } from './exports/AccessibilityInfo';
+export { default as Alert } from './exports/Alert';
+export { default as Animated } from './exports/Animated';
+export { default as Appearance } from './exports/Appearance';
+export { default as AppRegistry } from './exports/AppRegistry';
+export { default as AppState } from './exports/AppState';
+export { default as BackHandler } from './exports/BackHandler';
+export { default as Clipboard } from './exports/Clipboard';
+export { default as Dimensions } from './exports/Dimensions';
+export { default as Easing } from './exports/Easing';
+export { default as I18nManager } from './exports/I18nManager';
+export { default as Keyboard } from './exports/Keyboard';
+export { default as InteractionManager } from './exports/InteractionManager';
+export { default as LayoutAnimation } from './exports/LayoutAnimation';
+export { default as Linking } from './exports/Linking';
+export { default as NativeEventEmitter } from './exports/NativeEventEmitter';
+export { default as PanResponder } from './exports/PanResponder';
+export { default as PixelRatio } from './exports/PixelRatio';
+export { default as Platform } from './exports/Platform';
+export { default as Share } from './exports/Share';
+export { default as StyleSheet } from './exports/StyleSheet';
+export { default as UIManager } from './exports/UIManager';
+export { default as Vibration } from './exports/Vibration';
+
+// components
+export { default as ActivityIndicator } from './exports/ActivityIndicator';
+export { default as Button } from './exports/Button';
+export { default as CheckBox } from './exports/CheckBox';
+export { default as FlatList } from './exports/FlatList';
+export { default as Image } from './exports/Image';
+export { default as ImageBackground } from './exports/ImageBackground';
+export { default as KeyboardAvoidingView } from './exports/KeyboardAvoidingView';
+export { default as Modal } from './exports/Modal';
+export { default as Picker } from './exports/Picker';
+export { default as Pressable } from './exports/Pressable';
+export { default as ProgressBar } from './exports/ProgressBar';
+export { default as RefreshControl } from './exports/RefreshControl';
+export { default as SafeAreaView } from './exports/SafeAreaView';
+export { default as ScrollView } from './exports/ScrollView';
+export { default as SectionList } from './exports/SectionList';
+export { default as StatusBar } from './exports/StatusBar';
+export { default as Switch } from './exports/Switch';
+export { default as Text } from './exports/Text';
+export { default as TextInput } from './exports/TextInput';
+export { default as Touchable } from './exports/Touchable';
+export { default as TouchableHighlight } from './exports/TouchableHighlight';
+export { default as TouchableNativeFeedback } from './exports/TouchableNativeFeedback';
+export { default as TouchableOpacity } from './exports/TouchableOpacity';
+export { default as TouchableWithoutFeedback } from './exports/TouchableWithoutFeedback';
+export { default as View } from './exports/View';
+export { default as VirtualizedList } from './exports/VirtualizedList';
+export { default as YellowBox } from './exports/YellowBox';
+export { default as LogBox } from './exports/LogBox';
+
+// plugins
+export { default as DeviceEventEmitter } from './exports/DeviceEventEmitter';
+
+// hooks
+export { default as useColorScheme } from './exports/useColorScheme';
+export { default as useLocaleContext } from './exports/useLocaleContext';
+export { default as useWindowDimensions } from './exports/useWindowDimensions';

package/src/modules/AccessibilityUtil/index.js

@@ -0,0 +1,20 @@
+/**
+ * Copyright (c) Nicolas Gallagher.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+import isDisabled from './isDisabled';
+import propsToAccessibilityComponent from './propsToAccessibilityComponent';
+import propsToAriaRole from './propsToAriaRole';
+
+const AccessibilityUtil = {
+  isDisabled,
+  propsToAccessibilityComponent,
+  propsToAriaRole
+};
+
+export default AccessibilityUtil;

package/src/modules/AccessibilityUtil/isDisabled.js

@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) Nicolas Gallagher.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+const isDisabled = (props: Object): boolean =>
+  props.disabled ||
+  (Array.isArray(props.accessibilityStates) &&
+    props.accessibilityStates.indexOf('disabled') > -1);
+
+export default isDisabled;

package/src/modules/AccessibilityUtil/propsToAccessibilityComponent.js

@@ -0,0 +1,58 @@
+/**
+ * Copyright (c) Nicolas Gallagher.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+import propsToAriaRole from './propsToAriaRole';
+
+const roleComponents = {
+  article: 'article',
+  banner: 'header',
+  blockquote: 'blockquote',
+  button: 'button',
+  code: 'code',
+  complementary: 'aside',
+  contentinfo: 'footer',
+  deletion: 'del',
+  emphasis: 'em',
+  figure: 'figure',
+  insertion: 'ins',
+  form: 'form',
+  list: 'ul',
+  listitem: 'li',
+  main: 'main',
+  navigation: 'nav',
+  paragraph: 'p',
+  region: 'section',
+  strong: 'strong'
+};
+
+const emptyObject = {};
+
+const propsToAccessibilityComponent = (
+  props: Object = emptyObject
+): void | string => {
+  const roleProp = props.role || props.accessibilityRole;
+  // special-case for "label" role which doesn't map to an ARIA role
+  if (roleProp === 'label') {
+    return 'label';
+  }
+
+  const role = propsToAriaRole(props);
+  if (role) {
+    if (role === 'heading') {
+      const level = props.accessibilityLevel || props['aria-level'];
+      if (level != null) {
+        return `h${level}`;
+      }
+      return 'h1';
+    }
+    return roleComponents[role];
+  }
+};
+
+export default propsToAccessibilityComponent;

package/src/modules/AccessibilityUtil/propsToAriaRole.js

@@ -0,0 +1,42 @@
+/**
+ * Copyright (c) Nicolas Gallagher.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+const accessibilityRoleToWebRole = {
+  adjustable: 'slider',
+  button: 'button',
+  header: 'heading',
+  image: 'img',
+  imagebutton: null,
+  keyboardkey: null,
+  label: null,
+  link: 'link',
+  none: 'presentation',
+  search: 'search',
+  summary: 'region',
+  text: null
+};
+
+const propsToAriaRole = ({
+  accessibilityRole,
+  role
+}: {
+  accessibilityRole?: string,
+  role?: string
+}): string | void => {
+  const _role = role || accessibilityRole;
+  if (_role) {
+    const inferredRole = accessibilityRoleToWebRole[_role];
+    if (inferredRole !== null) {
+      // ignore roles that don't map to web
+      return inferredRole || _role;
+    }
+  }
+};
+
+export default propsToAriaRole;

package/src/modules/AssetRegistry/index.js

@@ -0,0 +1,32 @@
+/**
+ * Copyright (c) Nicolas Gallagher.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+export type PackagerAsset = {
+  __packager_asset: boolean,
+  fileSystemLocation: string,
+  httpServerLocation: string,
+  width: ?number,
+  height: ?number,
+  scales: Array<number>,
+  hash: string,
+  name: string,
+  type: string
+};
+
+const assets: Array<PackagerAsset> = [];
+
+export function registerAsset(asset: PackagerAsset): number {
+  // `push` returns new array length, so the first asset will
+  // get id 1 (not 0) to make the value truthy
+  return assets.push(asset);
+}
+
+export function getAssetByID(assetId: number): PackagerAsset {
+  return assets[assetId - 1];
+}

package/src/modules/ImageLoader/index.js

@@ -0,0 +1,167 @@
+/**
+ * Copyright (c) Nicolas Gallagher.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+const dataUriPattern = /^data:/;
+
+export class ImageUriCache {
+  static _maximumEntries: number = 256;
+  static _entries = {};
+
+  static has(uri: string): boolean {
+    const entries = ImageUriCache._entries;
+    const isDataUri = dataUriPattern.test(uri);
+    return isDataUri || Boolean(entries[uri]);
+  }
+
+  static add(uri: string) {
+    const entries = ImageUriCache._entries;
+    const lastUsedTimestamp = Date.now();
+    if (entries[uri]) {
+      entries[uri].lastUsedTimestamp = lastUsedTimestamp;
+      entries[uri].refCount += 1;
+    } else {
+      entries[uri] = {
+        lastUsedTimestamp,
+        refCount: 1
+      };
+    }
+  }
+
+  static remove(uri: string) {
+    const entries = ImageUriCache._entries;
+    if (entries[uri]) {
+      entries[uri].refCount -= 1;
+    }
+    // Free up entries when the cache is "full"
+    ImageUriCache._cleanUpIfNeeded();
+  }
+
+  static _cleanUpIfNeeded() {
+    const entries = ImageUriCache._entries;
+    const imageUris = Object.keys(entries);
+
+    if (imageUris.length + 1 > ImageUriCache._maximumEntries) {
+      let leastRecentlyUsedKey;
+      let leastRecentlyUsedEntry;
+
+      imageUris.forEach((uri) => {
+        const entry = entries[uri];
+        if (
+          (!leastRecentlyUsedEntry ||
+            entry.lastUsedTimestamp <
+              leastRecentlyUsedEntry.lastUsedTimestamp) &&
+          entry.refCount === 0
+        ) {
+          leastRecentlyUsedKey = uri;
+          leastRecentlyUsedEntry = entry;
+        }
+      });
+
+      if (leastRecentlyUsedKey) {
+        delete entries[leastRecentlyUsedKey];
+      }
+    }
+  }
+}
+
+let id = 0;
+const requests = {};
+
+const ImageLoader = {
+  abort(requestId: number) {
+    let image = requests[`${requestId}`];
+    if (image) {
+      image.onerror = null;
+      image.onload = null;
+      image = null;
+      delete requests[`${requestId}`];
+    }
+  },
+  getSize(
+    uri: string,
+    success: (width: number, height: number) => void,
+    failure: () => void
+  ) {
+    let complete = false;
+    const interval = setInterval(callback, 16);
+    const requestId = ImageLoader.load(uri, callback, errorCallback);
+
+    function callback() {
+      const image = requests[`${requestId}`];
+      if (image) {
+        const { naturalHeight, naturalWidth } = image;
+        if (naturalHeight && naturalWidth) {
+          success(naturalWidth, naturalHeight);
+          complete = true;
+        }
+      }
+      if (complete) {
+        ImageLoader.abort(requestId);
+        clearInterval(interval);
+      }
+    }
+
+    function errorCallback() {
+      if (typeof failure === 'function') {
+        failure();
+      }
+      ImageLoader.abort(requestId);
+      clearInterval(interval);
+    }
+  },
+  has(uri: string): boolean {
+    return ImageUriCache.has(uri);
+  },
+  load(uri: string, onLoad: Function, onError: Function): number {
+    id += 1;
+    const image = new window.Image();
+    image.onerror = onError;
+    image.onload = (e) => {
+      // avoid blocking the main thread
+      const onDecode = () => onLoad({ nativeEvent: e });
+      if (typeof image.decode === 'function') {
+        // Safari currently throws exceptions when decoding svgs.
+        // We want to catch that error and allow the load handler
+        // to be forwarded to the onLoad handler in this case
+        image.decode().then(onDecode, onDecode);
+      } else {
+        setTimeout(onDecode, 0);
+      }
+    };
+    image.src = uri;
+    requests[`${id}`] = image;
+    return id;
+  },
+  prefetch(uri: string): Promise<void> {
+    return new Promise((resolve, reject) => {
+      ImageLoader.load(
+        uri,
+        () => {
+          // Add the uri to the cache so it can be immediately displayed when used
+          // but also immediately remove it to correctly reflect that it has no active references
+          ImageUriCache.add(uri);
+          ImageUriCache.remove(uri);
+          resolve();
+        },
+        reject
+      );
+    });
+  },
+  queryCache(uris: Array<string>): Promise<{| [uri: string]: 'disk/memory' |}> {
+    const result = {};
+    uris.forEach((u) => {
+      if (ImageUriCache.has(u)) {
+        result[u] = 'disk/memory';
+      }
+    });
+    return Promise.resolve(result);
+  }
+};
+
+export default ImageLoader;

package/src/modules/TextInputState/index.js

@@ -0,0 +1,64 @@
+/**
+ * Copyright (c) Nicolas Gallagher.
+ * 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.
+ *
+ * @flow
+ */
+
+import UIManager from '../../exports/UIManager';
+
+/**
+ * This class is responsible for coordinating the "focused"
+ * state for TextInputs. All calls relating to the keyboard
+ * should be funneled through here
+ */
+const TextInputState = {
+  /**
+   * Internal state
+   */
+  _currentlyFocusedNode: (null: ?Object),
+
+  /**
+   * Returns the ID of the currently focused text field, if one exists
+   * If no text field is focused it returns null
+   */
+  currentlyFocusedField(): ?Object {
+    if (document.activeElement !== this._currentlyFocusedNode) {
+      this._currentlyFocusedNode = null;
+    }
+    return this._currentlyFocusedNode;
+  },
+
+  /**
+   * @param {Object} TextInputID id of the text field to focus
+   * Focuses the specified text field
+   * noop if the text field was already focused
+   */
+  focusTextInput(textFieldNode: ?Object) {
+    if (textFieldNode !== null) {
+      this._currentlyFocusedNode = textFieldNode;
+      if (document.activeElement !== textFieldNode) {
+        UIManager.focus(textFieldNode);
+      }
+    }
+  },
+
+  /**
+   * @param {Object} textFieldNode id of the text field to focus
+   * Unfocuses the specified text field
+   * noop if it wasn't focused
+   */
+  blurTextInput(textFieldNode: ?Object) {
+    if (textFieldNode !== null) {
+      this._currentlyFocusedNode = null;
+      if (document.activeElement === textFieldNode) {
+        UIManager.blur(textFieldNode);
+      }
+    }
+  }
+};
+
+export default TextInputState;

package/src/modules/UnimplementedView/index.js

@@ -0,0 +1,31 @@
+/**
+ * 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.
+ *
+ * @flow
+ */
+import type { Node } from 'React';
+import type { ViewProps } from '../../exports/View/types';
+
+import View from '../../exports/View';
+import React from 'react';
+
+/**
+ * Common implementation for a simple stubbed view.
+ */
+function UnimplementedView({ style, ...props }: ViewProps): Node {
+  return <View {...props} style={[unimplementedViewStyles, style]} />;
+}
+
+const unimplementedViewStyles =
+  process.env.NODE_ENV !== 'production'
+    ? {
+        alignSelf: 'flex-start',
+        borderColor: 'red',
+        borderWidth: 1
+      }
+    : {};
+
+export default UnimplementedView;

package/src/modules/addEventListener/index.js

@@ -0,0 +1,89 @@
+/**
+ * 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.
+ *
+ * @flow
+ */
+
+'use strict';
+import canUseDOM from '../canUseDom';
+
+type Listener = (e: any) => void;
+
+export type EventOptions = {
+  capture?: boolean,
+  passive?: boolean,
+  once?: boolean
+};
+
+const emptyFunction = () => {};
+
+function supportsPassiveEvents(): boolean {
+  let supported = false;
+  // Check if browser supports event with passive listeners
+  // https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Safely_detecting_option_support
+  if (canUseDOM) {
+    try {
+      const options = {};
+      Object.defineProperty(options, 'passive', {
+        get() {
+          supported = true;
+          return false;
+        }
+      });
+      window.addEventListener('test', null, options);
+      window.removeEventListener('test', null, options);
+    } catch (e) {}
+  }
+  return supported;
+}
+
+const canUsePassiveEvents = supportsPassiveEvents();
+
+function getOptions(options: ?EventOptions): EventOptions | boolean {
+  if (options == null) {
+    return false;
+  }
+  return canUsePassiveEvents ? options : Boolean(options.capture);
+}
+
+/**
+ * Shim generic API compatibility with ReactDOM's synthetic events, without needing the
+ * large amount of code ReactDOM uses to do this. Ideally we wouldn't use a synthetic
+ * event wrapper at all.
+ */
+function isPropagationStopped() {
+  return this.cancelBubble;
+}
+function isDefaultPrevented() {
+  return this.defaultPrevented;
+}
+function normalizeEvent(event: any) {
+  event.nativeEvent = event;
+  event.persist = emptyFunction;
+  event.isDefaultPrevented = isDefaultPrevented;
+  event.isPropagationStopped = isPropagationStopped;
+  return event;
+}
+
+/**
+ *
+ */
+export function addEventListener(
+  target: EventTarget,
+  type: any,
+  listener: Listener,
+  options: ?EventOptions
+): () => void {
+  const opts = getOptions(options);
+  const compatListener = (e: any) => listener(normalizeEvent(e));
+  target.addEventListener(type, compatListener, opts);
+
+  return function removeEventListener() {
+    if (target != null) {
+      target.removeEventListener(type, compatListener, opts);
+    }
+  };
+}

package/src/modules/canUseDom/index.js

@@ -0,0 +1,16 @@
+/**
+ * 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.
+ *
+ * @flow strict
+ */
+
+const canUseDOM: boolean = !!(
+  typeof window !== 'undefined' &&
+  window.document &&
+  window.document.createElement
+);
+
+export default canUseDOM;