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

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) Nicolas Gallagher.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,31 @@
+# react-native-web-lite
+
+A tree-shakeable fork of react-native-web that replaces the style engine with simple inline styles.
+
+## What is this?
+
+This package keeps **all** the API surfaces of react-native-web, but makes them fully tree-shakeable by replacing the style engine with a simple inline style system.
+
+This is ideal if you're using an alternative style engine (like Hanzogui, StyleX, etc.) and just want react-native API compatibility for non-style concerns.
+
+## Trade-offs
+
+Because the style engine is replaced with inline styles, **descendant-based styles are not supported**. This means things like `pointerEvents="box-none"` won't work as expected since they rely on react-native-web's CSS-based styling system.
+
+If you need full react-native-web style support, use react-native-web directly.
+
+## Features
+
+- Full ESModule support
+- Vite compatibility
+- `sideEffects: false` + full tree shaking support
+- TypeScript (converted from Flow)
+
+## Setup
+
+`@hanzogui/next-plugin` and `@hanzogui/vite-plugin` have an option `useReactNativeWebLite` to help automatically set this up.
+
+With webpack, alias the following:
+
+- `react-native-web$` => `react-native-web-lite`
+- `react-native-svg` => `@hanzogui/react-native-svg`

package/dist/cjs/AccessibilityInfo/index.cjs

@@ -0,0 +1,109 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var AccessibilityInfo_exports = {};
+__export(AccessibilityInfo_exports, {
+  AccessibilityInfo: () => AccessibilityInfo
+});
+module.exports = __toCommonJS(AccessibilityInfo_exports);
+var import_react_native_web_internals = require("@hanzogui/react-native-web-internals");
+function isScreenReaderEnabled() {
+  return new Promise((resolve, reject) => {
+    resolve(true);
+  });
+}
+const prefersReducedMotionMedia = import_react_native_web_internals.canUseDOM && typeof window.matchMedia === "function" ? window.matchMedia("(prefers-reduced-motion: reduce)") : null;
+function isReduceMotionEnabled() {
+  return new Promise((resolve, reject) => {
+    resolve(prefersReducedMotionMedia ? prefersReducedMotionMedia.matches : true);
+  });
+}
+function addChangeListener(fn) {
+  if (prefersReducedMotionMedia != null) {
+    prefersReducedMotionMedia.addEventListener != null ? prefersReducedMotionMedia.addEventListener("change", fn) : prefersReducedMotionMedia.addListener(fn);
+  }
+}
+function removeChangeListener(fn) {
+  if (prefersReducedMotionMedia != null) {
+    prefersReducedMotionMedia.removeEventListener != null ? prefersReducedMotionMedia.removeEventListener("change", fn) : prefersReducedMotionMedia.removeListener(fn);
+  }
+}
+const handlers = {};
+const AccessibilityInfo = {
+  /**
+   * Query whether a screen reader is currently enabled.
+   *
+   * Returns a promise which resolves to a boolean.
+   * The result is `true` when a screen reader is enabled and `false` otherwise.
+   */
+  isScreenReaderEnabled,
+  /**
+   * Query whether the user prefers reduced motion.
+   *
+   * Returns a promise which resolves to a boolean.
+   * The result is `true` when a screen reader is enabled and `false` otherwise.
+   */
+  isReduceMotionEnabled,
+  /**
+   * Deprecated
+   */
+  fetch: isScreenReaderEnabled,
+  /**
+   * Add an event handler. Supported events: reduceMotionChanged
+   */
+  addEventListener: function (eventName, handler) {
+    if (eventName === "reduceMotionChanged") {
+      if (!prefersReducedMotionMedia) {
+        return;
+      }
+      const listener = event => {
+        handler(event.matches);
+      };
+      addChangeListener(listener);
+      handlers[handler] = listener;
+    }
+    return {
+      remove: () => AccessibilityInfo.removeEventListener(eventName, handler)
+    };
+  },
+  /**
+   * Set accessibility focus to a react component.
+   */
+  setAccessibilityFocus: function (reactTag) {},
+  /**
+   * Post a string to be announced by the screen reader.
+   */
+  announceForAccessibility: function (announcement) {},
+  /**
+   * Remove an event handler.
+   */
+  removeEventListener: function (eventName, handler) {
+    if (eventName === "reduceMotionChanged") {
+      const listener = handlers[handler];
+      if (!listener || !prefersReducedMotionMedia) {
+        return;
+      }
+      removeChangeListener(listener);
+    }
+    return;
+  }
+};

package/dist/cjs/ActivityIndicator/__tests__/index-test.cjs

@@ -0,0 +1,209 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+// If the importer is in node compatibility mode or this is not an ESM
+// file that has been converted to a CommonJS file using a Babel-
+// compatible transform (i.e. "__esModule" has not been set), then set
+// "default" to the CommonJS "module.exports" for node compatibility.
+isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+  value: mod,
+  enumerable: true
+}) : target, mod));
+var import_react = require("@testing-library/react");
+var import_dom_event_testing_library = require("dom-event-testing-library");
+var import_react2 = __toESM(require("react"), 1);
+var import_test_utils = require("react-dom/test-utils");
+var import__ = __toESM(require("../index.cjs"), 1);
+var import_jsx_runtime = require("react/jsx-runtime");
+describe("components/ActivityIndicator", () => {
+  describe('prop "accessibilityLabel"', () => {
+    test("value is set", () => {
+      const {
+        container
+      } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        accessibilityLabel: "accessibility label"
+      }));
+      expect(container.firstChild).toMatchSnapshot();
+    });
+  });
+  describe('prop "accessibilityLiveRegion"', () => {
+    test("value is set", () => {
+      const {
+        container
+      } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        accessibilityLiveRegion: "polite"
+      }));
+      expect(container.firstChild).toMatchSnapshot();
+    });
+  });
+  describe('prop "animating"', () => {
+    test('is "true"', () => {
+      const {
+        container
+      } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        animating: true
+      }));
+      expect(container.firstChild).toMatchSnapshot();
+    });
+    test('is "false"', () => {
+      const {
+        container
+      } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        animating: false
+      }));
+      expect(container.firstChild).toMatchSnapshot();
+    });
+  });
+  test('prop "color"', () => {
+    const {
+      container
+    } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+      color: "red"
+    }));
+    const svg = container.firstChild.querySelector("svg");
+    expect(svg).toMatchSnapshot();
+  });
+  describe('prop "dataSet"', () => {
+    test("value is set", () => {
+      const {
+        container
+      } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        dataSet: {
+          one: "one",
+          two: "two"
+        }
+      }));
+      expect(container.firstChild).toMatchSnapshot();
+    });
+  });
+  describe('prop "hidesWhenStopped"', () => {
+    test('is "true"', () => {
+      const {
+        container
+      } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        animating: false,
+        hidesWhenStopped: true
+      }));
+      expect(container.firstChild).toMatchSnapshot();
+    });
+    test('is "false"', () => {
+      const {
+        container
+      } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        animating: false,
+        hidesWhenStopped: false
+      }));
+      expect(container.firstChild).toMatchSnapshot();
+    });
+  });
+  describe('prop "nativeID"', () => {
+    test("value is set", () => {
+      const {
+        container
+      } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        nativeID: "123"
+      }));
+      expect(container.firstChild).toMatchSnapshot();
+    });
+  });
+  describe('prop "onBlur"', () => {
+    test("is called", () => {
+      const onBlur = jest.fn();
+      const ref = import_react2.default.createRef();
+      (0, import_test_utils.act)(() => {
+        (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+          onBlur,
+          ref
+        }));
+      });
+      const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current);
+      const body = (0, import_dom_event_testing_library.createEventTarget)(document.body);
+      (0, import_test_utils.act)(() => {
+        target.focus();
+        body.focus({
+          relatedTarget: target.node
+        });
+      });
+      expect(onBlur).toBeCalled();
+    });
+  });
+  describe('prop "onFocus"', () => {
+    test("is called", () => {
+      const onFocus = jest.fn();
+      const ref = import_react2.default.createRef();
+      (0, import_test_utils.act)(() => {
+        (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+          onFocus,
+          ref
+        }));
+      });
+      const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current);
+      (0, import_test_utils.act)(() => {
+        target.focus();
+      });
+      expect(onFocus).toBeCalled();
+    });
+  });
+  describe('prop "ref"', () => {
+    test("value is set", () => {
+      const ref = jest.fn();
+      (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        ref
+      }));
+      expect(ref).toBeCalled();
+    });
+  });
+  describe('prop "size"', () => {
+    test('is "large"', () => {
+      const {
+        container
+      } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        size: "large"
+      }));
+      expect(container.firstChild).toMatchSnapshot();
+    });
+    test("is a number", () => {
+      const {
+        container
+      } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        size: 30
+      }));
+      expect(container.firstChild).toMatchSnapshot();
+    });
+  });
+  describe('prop "style"', () => {
+    test("value is set", () => {
+      const {
+        container
+      } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        style: {
+          borderWidth: 5
+        }
+      }));
+      expect(container.firstChild).toMatchSnapshot();
+    });
+  });
+  describe('prop "testID"', () => {
+    test("value is set", () => {
+      const {
+        container
+      } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        testID: "123"
+      }));
+      expect(container.firstChild).toMatchSnapshot();
+    });
+  });
+});

package/dist/cjs/ActivityIndicator/index.cjs

@@ -0,0 +1,130 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+// If the importer is in node compatibility mode or this is not an ESM
+// file that has been converted to a CommonJS file using a Babel-
+// compatible transform (i.e. "__esModule" has not been set), then set
+// "default" to the CommonJS "module.exports" for node compatibility.
+isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+  value: mod,
+  enumerable: true
+}) : target, mod));
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var ActivityIndicator_exports = {};
+__export(ActivityIndicator_exports, {
+  ActivityIndicator: () => ActivityIndicator,
+  default: () => ActivityIndicator_default
+});
+module.exports = __toCommonJS(ActivityIndicator_exports);
+var React = __toESM(require("react"), 1);
+var import_react_native_web_internals = require("@hanzogui/react-native-web-internals");
+var import_View = require("../View/index.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+const createSvgCircle = style => /* @__PURE__ */(0, import_jsx_runtime.jsx)("circle", {
+  cx: "16",
+  cy: "16",
+  fill: "none",
+  r: "14",
+  strokeWidth: "4",
+  style
+});
+const ActivityIndicator = React.forwardRef((props, forwardedRef) => {
+  const {
+    animating = true,
+    color = "#1976D2",
+    hidesWhenStopped = true,
+    size = "small",
+    style,
+    ...other
+  } = props;
+  const svg = /* @__PURE__ */(0, import_jsx_runtime.jsxs)("svg", {
+    height: "100%",
+    viewBox: "0 0 32 32",
+    width: "100%",
+    children: [createSvgCircle({
+      stroke: color,
+      opacity: 0.2
+    }), createSvgCircle({
+      stroke: color,
+      strokeDasharray: 80,
+      strokeDashoffset: 60
+    })]
+  });
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_View.View, {
+    ...other,
+    accessibilityRole: "progressbar",
+    accessibilityValueMax: 1,
+    accessibilityValueMin: 0,
+    ref: forwardedRef,
+    style: [styles.container, style],
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_View.View, {
+      children: svg,
+      style: [typeof size === "number" ? {
+        height: size,
+        width: size
+      } : indicatorSizes[size], styles.animation, !animating && styles.animationPause, !animating && hidesWhenStopped && styles.hidesWhenStopped]
+    })
+  });
+});
+ActivityIndicator.displayName = "ActivityIndicator";
+const styles = import_react_native_web_internals.StyleSheet.create({
+  container: {
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  hidesWhenStopped: {
+    visibility: "hidden"
+  },
+  animation: {
+    animationDuration: "0.75s",
+    animationKeyframes: [{
+      "0%": {
+        transform: [{
+          rotate: "0deg"
+        }]
+      },
+      "100%": {
+        transform: [{
+          rotate: "360deg"
+        }]
+      }
+    }],
+    animationTimingFunction: "linear",
+    animationIterationCount: "infinite"
+  },
+  animationPause: {
+    animationPlayState: "paused"
+  }
+});
+const indicatorSizes = import_react_native_web_internals.StyleSheet.create({
+  small: {
+    width: 20,
+    height: 20
+  },
+  large: {
+    width: 36,
+    height: 36
+  }
+});
+var ActivityIndicator_default = ActivityIndicator;

package/dist/cjs/Alert/index.cjs

@@ -0,0 +1,30 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var Alert_exports = {};
+__export(Alert_exports, {
+  Alert: () => Alert
+});
+module.exports = __toCommonJS(Alert_exports);
+class Alert {
+  static alert() {}
+}

package/dist/cjs/AppRegistry/AppContainer.cjs

@@ -0,0 +1,75 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+// If the importer is in node compatibility mode or this is not an ESM
+// file that has been converted to a CommonJS file using a Babel-
+// compatible transform (i.e. "__esModule" has not been set), then set
+// "default" to the CommonJS "module.exports" for node compatibility.
+isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+  value: mod,
+  enumerable: true
+}) : target, mod));
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var AppContainer_exports = {};
+__export(AppContainer_exports, {
+  AppContainer: () => AppContainer,
+  RootTagContext: () => RootTagContext
+});
+module.exports = __toCommonJS(AppContainer_exports);
+var React = __toESM(require("react"), 1);
+var import_react_native_web_internals = require("@hanzogui/react-native-web-internals");
+var import_View = require("../View/index.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+const RootTagContext = React.createContext(null);
+const AppContainer = React.forwardRef((props, forwardedRef) => {
+  const {
+    children,
+    WrapperComponent
+  } = props;
+  let innerView = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_View.View, {
+    pointerEvents: "box-none",
+    style: styles.appContainer,
+    children
+  }, 1);
+  if (WrapperComponent) {
+    innerView = /* @__PURE__ */(0, import_jsx_runtime.jsx)(WrapperComponent, {
+      children: innerView
+    });
+  }
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(RootTagContext.Provider, {
+    value: props.rootTag,
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_View.View, {
+      pointerEvents: "box-none",
+      ref: forwardedRef,
+      style: styles.appContainer,
+      children: innerView
+    })
+  });
+});
+AppContainer.displayName = "AppContainer";
+const styles = import_react_native_web_internals.StyleSheet.create({
+  appContainer: {
+    flex: 1
+  }
+});