@tamagui/react-native-web-lite 1.114.3 → 1.115.0

package/dist/cjs/DeviceInfo/{index.js → index.cjs}

@@ -2,34 +2,49 @@ var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
+var __getProtoOf = Object.getPrototypeOf,
+  __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: !0 });
-}, __copyProps = (to, from, except, desc) => {
-  if (from && typeof from == "object" || typeof from == "function")
-    for (let key of __getOwnPropNames(from))
-      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  return to;
-};
+    for (var name in all) __defProp(target, name, {
+      get: all[name],
+      enumerable: !0
+    });
+  },
+  __copyProps = (to, from, except, desc) => {
+    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__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: !0 }) : target,
-  mod
-)), __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+    value: mod,
+    enumerable: !0
+  }) : target, mod)),
+  __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+    value: !0
+  }), mod);
 var DeviceInfo_exports = {};
 __export(DeviceInfo_exports, {
   default: () => DeviceInfo_default
 });
 module.exports = __toCommonJS(DeviceInfo_exports);
-var import_react_native_web_internals = require("@tamagui/react-native-web-internals"), import_Dimensions = __toESM(require("../Dimensions/index"));
+var import_react_native_web_internals = require("@tamagui/react-native-web-internals"),
+  import_Dimensions = __toESM(require("../Dimensions/index.cjs"));
 const DeviceInfo = {
   Dimensions: {
     get windowPhysicalPixels() {
-      const { width, height, fontScale, scale } = import_Dimensions.default.get("window");
+      const {
+        width,
+        height,
+        fontScale,
+        scale
+      } = import_Dimensions.default.get("window");
       return {
         width: width * scale,
         height: height * scale,
@@ -38,7 +53,12 @@ const DeviceInfo = {
       };
     },
     get screenPhysicalPixels() {
-      const { width, height, fontScale, scale } = import_Dimensions.default.get("screen");
+      const {
+        width,
+        height,
+        fontScale,
+        scale
+      } = import_Dimensions.default.get("screen");
       return {
         width: width * scale,
         height: height * scale,
@@ -48,8 +68,7 @@ const DeviceInfo = {
     }
   },
   get locale() {
-    if (import_react_native_web_internals.canUseDOM)
-      return navigator.languages ? navigator.languages[0] : navigator.language;
+    if (import_react_native_web_internals.canUseDOM) return navigator.languages ? navigator.languages[0] : navigator.language;
   },
   get totalMemory() {
     return import_react_native_web_internals.canUseDOM ? navigator.deviceMemory : void 0;
@@ -58,5 +77,4 @@ const DeviceInfo = {
     return import_react_native_web_internals.canUseDOM ? navigator.userAgent : "";
   }
 };
-var DeviceInfo_default = DeviceInfo;
-//# sourceMappingURL=index.js.map
+var DeviceInfo_default = DeviceInfo;

package/dist/cjs/Dimensions/__tests__/{index-test.js → index-test.cjs}

@@ -2,22 +2,25 @@ var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
+var __getProtoOf = Object.getPrototypeOf,
+  __hasOwnProp = Object.prototype.hasOwnProperty;
 var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from == "object" || typeof from == "function")
-    for (let key of __getOwnPropNames(from))
-      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__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: !0 }) : target,
-  mod
-));
-var import__ = __toESM(require(".."));
+// 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: !0
+}) : target, mod));
+var import__ = __toESM(require("../index.cjs"));
 describe("apis/Dimensions/index.js", () => {
   test("get", () => {
     expect(import__.default.get("screen")).toMatchInlineSnapshot(`
@@ -38,7 +41,8 @@ describe("apis/Dimensions/index.js", () => {
   }), test("set", () => {
     expect(() => import__.default.set({})).toThrow();
   }), test("addEventListener", () => {
-    const handler = jest.fn(), subscription = import__.default.addEventListener("change", handler);
+    const handler = jest.fn(),
+      subscription = import__.default.addEventListener("change", handler);
     import__.default._update(), expect(handler).toHaveBeenCalledTimes(1), expect(handler).toHaveBeenLastCalledWith({
       window: import__.default.get("window"),
       screen: import__.default.get("screen")
@@ -47,5 +51,4 @@ describe("apis/Dimensions/index.js", () => {
     const handler = jest.fn();
     import__.default.removeEventListener("change", handler), import__.default._update(), expect(handler).toHaveBeenCalledTimes(0);
   });
-});
-//# sourceMappingURL=index-test.js.map
+});

package/dist/cjs/Dimensions/{index.js → index.cjs}

@@ -3,15 +3,21 @@ 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: !0 });
-}, __copyProps = (to, from, except, desc) => {
-  if (from && typeof from == "object" || typeof from == "function")
-    for (let key of __getOwnPropNames(from))
-      !__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: !0 }), mod);
+    for (var name in all) __defProp(target, name, {
+      get: all[name],
+      enumerable: !0
+    });
+  },
+  __copyProps = (to, from, except, desc) => {
+    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__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: !0
+}), mod);
 var Dimensions_exports = {};
 __export(Dimensions_exports, {
   default: () => Dimensions
@@ -19,24 +25,25 @@ __export(Dimensions_exports, {
 module.exports = __toCommonJS(Dimensions_exports);
 var import_react_native_web_internals = require("@tamagui/react-native-web-internals");
 const dimensions = {
-  window: {
-    fontScale: 1,
-    height: 0,
-    scale: 1,
-    width: 0
+    window: {
+      fontScale: 1,
+      height: 0,
+      scale: 1,
+      width: 0
+    },
+    screen: {
+      fontScale: 1,
+      height: 0,
+      scale: 1,
+      width: 0
+    }
   },
-  screen: {
-    fontScale: 1,
-    height: 0,
-    scale: 1,
-    width: 0
-  }
-}, listeners = {};
+  listeners = {};
 let shouldInit = import_react_native_web_internals.canUseDOM;
 function update() {
-  if (!import_react_native_web_internals.canUseDOM)
-    return;
-  const win = window, docEl = win.document.documentElement;
+  if (!import_react_native_web_internals.canUseDOM) return;
+  const win = window,
+    docEl = win.document.documentElement;
   dimensions.window = {
     fontScale: 1,
     height: docEl.clientHeight,
@@ -50,7 +57,7 @@ function update() {
   };
 }
 function handleResize() {
-  update(), Array.isArray(listeners.change) && listeners.change.forEach((handler) => handler(dimensions));
+  update(), Array.isArray(listeners.change) && listeners.change.forEach(handler => handler(dimensions));
 }
 class Dimensions {
   static get(dimension) {
@@ -67,8 +74,7 @@ class Dimensions {
     };
   }
   static removeEventListener(type, handler) {
-    Array.isArray(listeners[type]) && (listeners[type] = listeners[type].filter((_handler) => _handler !== handler));
+    Array.isArray(listeners[type]) && (listeners[type] = listeners[type].filter(_handler => _handler !== handler));
   }
 }
-import_react_native_web_internals.canUseDOM && window.addEventListener("resize", handleResize, !1);
-//# sourceMappingURL=index.js.map
+import_react_native_web_internals.canUseDOM && window.addEventListener("resize", handleResize, !1);

package/dist/cjs/I18nManager/index.cjs

@@ -0,0 +1,35 @@
+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: !0
+    });
+  },
+  __copyProps = (to, from, except, desc) => {
+    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__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: !0
+}), mod);
+var I18nManager_exports = {};
+__export(I18nManager_exports, {
+  default: () => I18nManager_default
+});
+module.exports = __toCommonJS(I18nManager_exports);
+const I18nManager = {
+  allowRTL() {},
+  forceRTL() {},
+  getConstants() {
+    return {
+      isRTL: !1
+    };
+  }
+};
+var I18nManager_default = I18nManager;

package/dist/cjs/Image/index.cjs

@@ -0,0 +1,292 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf,
+  __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+    for (var name in all) __defProp(target, name, {
+      get: all[name],
+      enumerable: !0
+    });
+  },
+  __copyProps = (to, from, except, desc) => {
+    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__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: !0
+  }) : target, mod)),
+  __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+    value: !0
+  }), mod);
+var Image_exports = {};
+__export(Image_exports, {
+  default: () => Image_default
+});
+module.exports = __toCommonJS(Image_exports);
+var React = __toESM(require("react")),
+  import_react_native_web_internals = require("@tamagui/react-native-web-internals"),
+  import_react_native_web_internals2 = require("@tamagui/react-native-web-internals"),
+  import_createElement = __toESM(require("../createElement/index.cjs")),
+  import_PixelRatio = __toESM(require("../PixelRatio/index.cjs")),
+  import_View = __toESM(require("../View/index.cjs")),
+  import_jsx_runtime = require("react/jsx-runtime");
+const ERRORED = "ERRORED",
+  LOADED = "LOADED",
+  LOADING = "LOADING",
+  IDLE = "IDLE";
+let _filterId = 0;
+const svgDataUriPattern = /^(data:image\/svg\+xml;utf8,)(.*)/;
+function createTintColorSVG(tintColor, id) {
+  return tintColor && id != null ? /* @__PURE__ */(0, import_jsx_runtime.jsx)("svg", {
+    style: {
+      position: "absolute",
+      height: 0,
+      visibility: "hidden",
+      width: 0
+    },
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("defs", {
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)("filter", {
+        id: `tint-${id}`,
+        suppressHydrationWarning: !0,
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)("feFlood", {
+          floodColor: `${tintColor}`
+        }, tintColor), /* @__PURE__ */(0, import_jsx_runtime.jsx)("feComposite", {
+          in2: "SourceAlpha",
+          operator: "atop"
+        })]
+      })
+    })
+  }) : null;
+}
+function getFlatStyle(style, blurRadius, filterId) {
+  const flatStyle = import_react_native_web_internals.StyleSheet.flatten(style),
+    {
+      filter,
+      resizeMode,
+      shadowOffset,
+      tintColor
+    } = flatStyle,
+    filters = [];
+  let _filter = null;
+  if (filter && filters.push(filter), blurRadius && filters.push(`blur(${blurRadius}px)`), shadowOffset) {
+    const shadowString = (0, import_react_native_web_internals.createBoxShadowValue)(flatStyle);
+    shadowString && filters.push(`drop-shadow(${shadowString})`);
+  }
+  return tintColor && filterId != null && filters.push(`url(#tint-${filterId})`), filters.length > 0 && (_filter = filters.join(" ")), delete flatStyle.blurRadius, delete flatStyle.shadowColor, delete flatStyle.shadowOpacity, delete flatStyle.shadowOffset, delete flatStyle.shadowRadius, delete flatStyle.tintColor, delete flatStyle.overlayColor, delete flatStyle.resizeMode, [flatStyle, resizeMode, _filter, tintColor];
+}
+function resolveAssetDimensions(source) {
+  if (typeof source == "number") {
+    const {
+      height,
+      width
+    } = (0, import_react_native_web_internals2.getAssetByID)(source);
+    return {
+      height,
+      width
+    };
+  } else if (source != null && !Array.isArray(source) && typeof source == "object") {
+    const {
+      height,
+      width
+    } = source;
+    return {
+      height,
+      width
+    };
+  }
+}
+function resolveAssetUri(source) {
+  let uri = null;
+  if (typeof source == "number") {
+    const asset = (0, import_react_native_web_internals2.getAssetByID)(source);
+    let scale = asset.scales[0];
+    if (asset.scales.length > 1) {
+      const preferredScale = import_PixelRatio.default.get();
+      scale = asset.scales.reduce((prev, curr) => Math.abs(curr - preferredScale) < Math.abs(prev - preferredScale) ? curr : prev);
+    }
+    const scaleSuffix = scale !== 1 ? `@${scale}x` : "";
+    uri = asset ? `${asset.httpServerLocation}/${asset.name}${scaleSuffix}.${asset.type}` : "";
+  } else typeof source == "string" ? uri = source : source && typeof source.uri == "string" && (uri = source.uri);
+  if (uri) {
+    const match = uri.match(svgDataUriPattern);
+    if (match) {
+      const [, prefix, svg] = match,
+        encodedSvg = encodeURIComponent(svg);
+      return `${prefix}${encodedSvg}`;
+    }
+  }
+  return uri;
+}
+const Image = React.forwardRef((props, ref) => {
+  const {
+    accessibilityLabel,
+    blurRadius,
+    defaultSource,
+    draggable,
+    onError,
+    onLayout,
+    onLoad,
+    onLoadEnd,
+    onLoadStart,
+    pointerEvents,
+    source,
+    style,
+    ...rest
+  } = props;
+  if (process.env.NODE_ENV !== "production" && props.children) throw new Error("The <Image> component cannot contain children. If you want to render content on top of the image, consider using the <ImageBackground> component or absolute positioning.");
+  const [state, updateState] = React.useState(() => {
+      const uri2 = resolveAssetUri(source);
+      return uri2 != null && import_react_native_web_internals2.ImageLoader.has(uri2) ? LOADED : IDLE;
+    }),
+    [layout, updateLayout] = React.useState({}),
+    hasTextAncestor = React.useContext(import_react_native_web_internals.TextAncestorContext),
+    hiddenImageRef = React.useRef(null),
+    filterRef = React.useRef(_filterId++),
+    requestRef = React.useRef(null),
+    shouldDisplaySource = state === LOADED || state === LOADING && defaultSource == null,
+    [flatStyle, _resizeMode, filter, tintColor] = getFlatStyle({}, blurRadius, filterRef.current),
+    resizeMode = props.resizeMode || _resizeMode || "cover",
+    selectedSource = shouldDisplaySource ? source : defaultSource,
+    displayImageUri = resolveAssetUri(selectedSource),
+    imageSizeStyle = resolveAssetDimensions(selectedSource),
+    backgroundImage = displayImageUri ? `url("${displayImageUri}")` : null,
+    backgroundSize = getBackgroundSize(),
+    hiddenImage = displayImageUri ? (0, import_createElement.default)("img", {
+      alt: accessibilityLabel || "",
+      style: styles.accessibilityImage$raw,
+      draggable: draggable || !1,
+      ref: hiddenImageRef,
+      src: displayImageUri
+    }) : null;
+  function getBackgroundSize() {
+    if (hiddenImageRef.current != null && (resizeMode === "center" || resizeMode === "repeat")) {
+      const {
+          naturalHeight,
+          naturalWidth
+        } = hiddenImageRef.current,
+        {
+          height,
+          width
+        } = layout;
+      if (naturalHeight && naturalWidth && height && width) {
+        const scaleFactor = Math.min(1, width / naturalWidth, height / naturalHeight),
+          x = Math.ceil(scaleFactor * naturalWidth),
+          y = Math.ceil(scaleFactor * naturalHeight);
+        return `${x}px ${y}px`;
+      }
+    }
+  }
+  function handleLayout(e) {
+    if (resizeMode === "center" || resizeMode === "repeat" || onLayout) {
+      const {
+        layout: layout2
+      } = e.nativeEvent;
+      onLayout && onLayout(e), updateLayout(layout2);
+    }
+  }
+  const uri = resolveAssetUri(source);
+  return React.useEffect(() => {
+    abortPendingRequest(), uri != null && (updateState(LOADING), onLoadStart && onLoadStart(), requestRef.current = import_react_native_web_internals2.ImageLoader.load(uri, function (e) {
+      updateState(LOADED), onLoad && onLoad(e), onLoadEnd && onLoadEnd();
+    }, function () {
+      updateState(ERRORED), onError && onError({
+        nativeEvent: {
+          error: `Failed to load resource ${uri} (404)`
+        }
+      }), onLoadEnd && onLoadEnd();
+    }));
+    function abortPendingRequest() {
+      requestRef.current != null && (import_react_native_web_internals2.ImageLoader.abort(requestRef.current), requestRef.current = null);
+    }
+    return abortPendingRequest;
+  }, [uri, requestRef, updateState, onError, onLoad, onLoadEnd, onLoadStart]), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_View.default, {
+    ...rest,
+    accessibilityLabel,
+    onLayout: handleLayout,
+    pointerEvents,
+    ref,
+    style: [style, styles.root, hasTextAncestor && styles.inline, imageSizeStyle, flatStyle],
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_View.default, {
+      style: [...[].concat(styles.image), resizeModeStyles[resizeMode], {
+        backgroundImage,
+        filter
+      }, backgroundSize != null && {
+        backgroundSize
+      }],
+      suppressHydrationWarning: !0
+    }), hiddenImage, createTintColorSVG(tintColor, filterRef.current)]
+  });
+});
+Image.displayName = "Image";
+const ImageWithStatics = Image;
+ImageWithStatics.getSize = function (uri, success, failure) {
+  import_react_native_web_internals2.ImageLoader.getSize(uri, success, failure);
+};
+ImageWithStatics.prefetch = function (uri) {
+  return import_react_native_web_internals2.ImageLoader.prefetch(uri);
+};
+ImageWithStatics.queryCache = function (uris) {
+  return import_react_native_web_internals2.ImageLoader.queryCache(uris);
+};
+const styles = import_react_native_web_internals.StyleSheet.create({
+    root: {
+      flexBasis: "auto",
+      overflow: "hidden",
+      zIndex: 0
+    },
+    inline: {
+      display: "inline-flex"
+    },
+    image: {
+      ...import_react_native_web_internals.StyleSheet.absoluteFillObject,
+      backgroundColor: "transparent",
+      backgroundPosition: "center",
+      backgroundRepeat: "no-repeat",
+      backgroundSize: "cover",
+      height: "100%",
+      width: "100%",
+      zIndex: -1
+    },
+    accessibilityImage$raw: {
+      ...import_react_native_web_internals.StyleSheet.absoluteFillObject,
+      height: "100%",
+      opacity: 0,
+      width: "100%",
+      zIndex: -1
+    }
+  }),
+  resizeModeStyles = import_react_native_web_internals.StyleSheet.create({
+    center: {
+      backgroundSize: "auto"
+    },
+    contain: {
+      backgroundSize: "contain"
+    },
+    cover: {
+      backgroundSize: "cover"
+    },
+    none: {
+      backgroundPosition: "0",
+      backgroundSize: "auto"
+    },
+    repeat: {
+      backgroundPosition: "0",
+      backgroundRepeat: "repeat",
+      backgroundSize: "auto"
+    },
+    stretch: {
+      backgroundSize: "100% 100%"
+    }
+  });
+var Image_default = ImageWithStatics;

package/dist/cjs/Image/types.cjs

@@ -0,0 +1,16 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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)) !__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: !0
+}), mod);
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);

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

@@ -0,0 +1,68 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf,
+  __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__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: !0
+}) : target, mod));
+var import_react = require("@testing-library/react"),
+  import_Text = __toESM(require("../../Text/index.cjs")),
+  import__ = __toESM(require("../index.cjs")),
+  import_jsx_runtime = require("react/jsx-runtime");
+function findImage(container) {
+  return container.firstChild.firstChild;
+}
+describe("components/ImageBackground", () => {
+  describe('prop "children"', () => {
+    test("render child content", () => {
+      const {
+        getByText
+      } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Text.default, {
+          children: "Hello World!"
+        })
+      }));
+      expect(getByText("Hello World!")).toBeDefined();
+    });
+  }), describe('prop "imageStyle"', () => {
+    test("sets the style of the underlying Image", () => {
+      const imageStyle = {
+          width: 40,
+          height: 60
+        },
+        {
+          container
+        } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+          imageStyle
+        }));
+      expect(findImage(container).getAttribute("style").includes("width: 40px; height: 60px;")).toBe(!0);
+    });
+  }), describe('prop "style"', () => {
+    test("sets the style of the container View", () => {
+      const style = {
+          margin: 40
+        },
+        {
+          container
+        } = (0, import_react.render)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import__.default, {
+          style
+        }));
+      expect(container.firstChild.getAttribute("style")).toEqual("margin: 40px 40px 40px 40px;");
+    });
+  });
+});