@draftbit/core 50.6.1-9a7627.2 → 50.6.2-bbb0a5.2

package/lib/commonjs/components/Image.js

@@ -1 +1 @@
-import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["source","resizeMode","style"];var _this=this,_jsxFileName="/home/runner/work/react-native-jigsaw/react-native-jigsaw/packages/core/src/components/Image.tsx";import React from"react";import{Image as NativeImage,StyleSheet}from"react-native";import Config from"./Config";import AspectRatio from"./AspectRatio";import{jsx as _jsx}from"react/jsx-runtime";var generateDimensions=function generateDimensions(_ref){var aspectRatio=_ref.aspectRatio,width=_ref.width,height=_ref.height;if(aspectRatio&&!width&&!height){return{aspectRatio:aspectRatio,width:"100%"};}if(aspectRatio&&height){return{aspectRatio:aspectRatio,height:height,width:aspectRatio*height};}if(aspectRatio&&width){return{aspectRatio:aspectRatio,width:width,height:width/aspectRatio};}return{width:width,height:height};};var Image=function Image(_ref2){var source=_ref2.source,_ref2$resizeMode=_ref2.resizeMode,resizeMode=_ref2$resizeMode===void 0?"cover":_ref2$resizeMode,style=_ref2.style,props=_objectWithoutProperties(_ref2,_excluded);var imageSource=source===null||source===undefined?Config.placeholderImageURL:source;var styles=StyleSheet.flatten(style||{});var _generateDimensions=generateDimensions(styles),aspectRatio=_generateDimensions.aspectRatio,width=_generateDimensions.width,height=_generateDimensions.height;if(aspectRatio){return _jsx(AspectRatio,{style:[style,{width:width,height:height,aspectRatio:aspectRatio}],children:_jsx(NativeImage,Object.assign({},props,{source:imageSource,resizeMode:resizeMode,style:[style,{height:"100%",width:"100%"}]}))});}return _jsx(NativeImage,Object.assign({},props,{source:source,resizeMode:resizeMode,style:style}));};export default Image;
+import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["source","resizeMode","style","placeholder","transition","contentFit","contentPosition","cachePolicy","allowDownscaling","recyclingKey"];var _this=this,_jsxFileName="/home/runner/work/react-native-jigsaw/react-native-jigsaw/packages/core/src/components/Image.tsx";import React from"react";import{StyleSheet}from"react-native";import{Image as ExpoImage}from"expo-image";import Config from"./Config";import AspectRatio from"./AspectRatio";import{jsx as _jsx}from"react/jsx-runtime";var generateDimensions=function generateDimensions(_ref){var aspectRatio=_ref.aspectRatio,width=_ref.width,height=_ref.height;if(aspectRatio&&!width&&!height){return{aspectRatio:aspectRatio,width:"100%"};}if(aspectRatio&&height){return{aspectRatio:aspectRatio,height:height,width:aspectRatio*height};}if(aspectRatio&&width){return{aspectRatio:aspectRatio,width:width,height:width/aspectRatio};}return{width:width,height:height};};var resizeModeToContentFit=function resizeModeToContentFit(resizeMode){var mapping={cover:"cover",contain:"contain",stretch:"fill",repeat:"none",center:"scale-down"};return mapping[resizeMode]||"cover";};var Image=function Image(_ref2){var source=_ref2.source,_ref2$resizeMode=_ref2.resizeMode,resizeMode=_ref2$resizeMode===void 0?"cover":_ref2$resizeMode,style=_ref2.style,placeholder=_ref2.placeholder,_ref2$transition=_ref2.transition,transition=_ref2$transition===void 0?300:_ref2$transition,_ref2$contentFit=_ref2.contentFit,contentFit=_ref2$contentFit===void 0?"cover":_ref2$contentFit,_ref2$contentPosition=_ref2.contentPosition,contentPosition=_ref2$contentPosition===void 0?"center":_ref2$contentPosition,_ref2$cachePolicy=_ref2.cachePolicy,cachePolicy=_ref2$cachePolicy===void 0?"memory-disk":_ref2$cachePolicy,_ref2$allowDownscalin=_ref2.allowDownscaling,allowDownscaling=_ref2$allowDownscalin===void 0?true:_ref2$allowDownscalin,recyclingKey=_ref2.recyclingKey,props=_objectWithoutProperties(_ref2,_excluded);var imageSource=source===null||source===undefined?Config.placeholderImageURL:source;var styles=StyleSheet.flatten(style||{});var _generateDimensions=generateDimensions(styles),aspectRatio=_generateDimensions.aspectRatio,width=_generateDimensions.width,height=_generateDimensions.height;var finalContentFit=contentFit||resizeModeToContentFit(resizeMode);if(aspectRatio){return _jsx(AspectRatio,{style:[style,{width:width,height:height,aspectRatio:aspectRatio}],children:_jsx(ExpoImage,Object.assign({},props,{source:imageSource,contentFit:finalContentFit,placeholder:placeholder,transition:transition,contentPosition:contentPosition,cachePolicy:cachePolicy,allowDownscaling:allowDownscaling,recyclingKey:recyclingKey,style:[style,{height:"100%",width:"100%"}]}))});}return _jsx(ExpoImage,Object.assign({},props,{source:source,contentFit:finalContentFit,placeholder:placeholder,transition:transition,contentPosition:contentPosition,cachePolicy:cachePolicy,allowDownscaling:allowDownscaling,recyclingKey:recyclingKey,style:style}));};export default Image;

package/lib/typescript/src/components/Image.d.ts

@@ -1,4 +1,20 @@
 import React from "react";
-import { ImageProps } from "react-native";
-declare const Image: React.FC<ImageProps>;
+import { ImageContentPosition, ImageProps as ExpoImageProps } from "expo-image";
+interface ExtendedImageProps extends ExpoImageProps {
+    placeholder?: {
+        blurhash?: string;
+        thumbhash?: string;
+    };
+    transition?: number | {
+        duration?: number;
+        effect?: "cross-dissolve" | "flip-from-top" | "flip-from-right" | "flip-from-bottom" | "flip-from-left" | "curl-up" | "curl-down";
+        timing?: "ease-in-out" | "ease-in" | "ease-out" | "linear";
+    };
+    contentFit?: "cover" | "contain" | "fill" | "none" | "scale-down";
+    contentPosition?: ImageContentPosition;
+    cachePolicy?: "none" | "disk" | "memory" | "memory-disk";
+    allowDownscaling?: boolean;
+    recyclingKey?: string;
+}
+declare const Image: React.FC<ExtendedImageProps>;
 export default Image;

package/lib/typescript/src/components/Image.js

@@ -1,6 +1,7 @@
 /* README: Internal Image component used for stuff like Card. DO NOT EXPORT! */
 import React from "react";
-import { Image as NativeImage, StyleSheet, } from "react-native";
+import { StyleSheet } from "react-native";
+import { Image as ExpoImage, } from "expo-image";
 import Config from "./Config";
 import AspectRatio from "./AspectRatio";
 const generateDimensions = ({ aspectRatio, width, height, }) => {
@@ -26,15 +27,29 @@ const generateDimensions = ({ aspectRatio, width, height, }) => {
     }
     return { width, height };
 };
-const Image = ({ source, resizeMode = "cover", style, ...props }) => {
+const resizeModeToContentFit = (resizeMode) => {
+    // Convert deprecated resizeMode prop to contentFit prop used in expo-image
+    // Maps RN Image resizeMode values to their equivalent expo-image contentFit values
+    const mapping = {
+        cover: "cover",
+        contain: "contain",
+        stretch: "fill",
+        repeat: "none",
+        center: "scale-down",
+    };
+    return mapping[resizeMode] || "cover";
+};
+const Image = ({ source, resizeMode = "cover", style, placeholder, transition = 300, contentFit = "cover", contentPosition = "center", cachePolicy = "memory-disk", allowDownscaling = true, recyclingKey, ...props }) => {
     let imageSource = source === null || source === undefined
         ? Config.placeholderImageURL
         : source;
     const styles = StyleSheet.flatten(style || {});
     const { aspectRatio, width, height } = generateDimensions(styles);
+    // Use contentFit if provided, otherwise fall back to resizeMode
+    const finalContentFit = contentFit || resizeModeToContentFit(resizeMode);
     if (aspectRatio) {
         return (React.createElement(AspectRatio, { style: [style, { width, height, aspectRatio }] },
-            React.createElement(NativeImage, { ...props, source: imageSource, resizeMode: resizeMode, style: [
+            React.createElement(ExpoImage, { ...props, source: imageSource, contentFit: finalContentFit, placeholder: placeholder, transition: transition, contentPosition: contentPosition, cachePolicy: cachePolicy, allowDownscaling: allowDownscaling, recyclingKey: recyclingKey, style: [
                     style,
                     {
                         height: "100%",
@@ -42,7 +57,7 @@ const Image = ({ source, resizeMode = "cover", style, ...props }) => {
                     },
                 ] })));
     }
-    return (React.createElement(NativeImage, { ...props, source: source, resizeMode: resizeMode, style: style }));
+    return (React.createElement(ExpoImage, { ...props, source: source, contentFit: finalContentFit, placeholder: placeholder, transition: transition, contentPosition: contentPosition, cachePolicy: cachePolicy, allowDownscaling: allowDownscaling, recyclingKey: recyclingKey, style: style }));
 };
 export default Image;
 //# sourceMappingURL=Image.js.map

package/lib/typescript/src/components/Image.js.map

@@ -1 +1 @@
-{"version":3,"file":"Image.js","sourceRoot":"","sources":["../../../../src/components/Image.tsx"],"names":[],"mappings":"AAAA,+EAA+E;AAC/E,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,KAAK,IAAI,WAAW,EAEpB,UAAU,GAGX,MAAM,cAAc,CAAC;AACtB,OAAO,MAAM,MAAM,UAAU,CAAC;AAE9B,OAAO,WAAW,MAAM,eAAe,CAAC;AAQxC,MAAM,kBAAkB,GAAG,CAAC,EAC1B,WAAW,EACX,KAAK,EACL,MAAM,GACS,EAIf,EAAE;IACF,IAAI,WAAW,IAAI,CAAC,KAAK,IAAI,CAAC,MAAM,EAAE;QACpC,OAAO;YACL,WAAW;YACX,KAAK,EAAE,MAAM;SACd,CAAC;KACH;IAED,IAAI,WAAW,IAAI,MAAM,EAAE;QACzB,OAAO;YACL,WAAW;YACX,MAAM;YACN,KAAK,EAAE,WAAW,GAAG,MAAM;SAC5B,CAAC;KACH;IAED,IAAI,WAAW,IAAI,KAAK,EAAE;QACxB,OAAO;YACL,WAAW;YACX,KAAK;YACL,MAAM,EAAE,KAAK,GAAG,WAAW;SAC5B,CAAC;KACH;IAED,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC;AAC3B,CAAC,CAAC;AAEF,MAAM,KAAK,GAAyB,CAAC,EACnC,MAAM,EACN,UAAU,GAAG,OAAO,EACpB,KAAK,EACL,GAAG,KAAK,EACT,EAAE,EAAE;IACH,IAAI,WAAW,GACb,MAAM,KAAK,IAAI,IAAI,MAAM,KAAK,SAAS;QACrC,CAAC,CAAC,MAAM,CAAC,mBAAmB;QAC5B,CAAC,CAAC,MAAM,CAAC;IAEb,MAAM,MAAM,GAAG,UAAU,CAAC,OAAO,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;IAC/C,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,kBAAkB,CACvD,MAAwB,CACzB,CAAC;IAEF,IAAI,WAAW,EAAE;QACf,OAAO,CACL,oBAAC,WAAW,IAAC,KAAK,EAAE,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,CAAC;YACzD,oBAAC,WAAW,OACN,KAAK,EACT,MAAM,EAAE,WAAkC,EAC1C,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE;oBACL,KAAK;oBACL;wBACE,MAAM,EAAE,MAAM;wBACd,KAAK,EAAE,MAAM;qBACd;iBACF,GACD,CACU,CACf,CAAC;KACH;IAED,OAAO,CACL,oBAAC,WAAW,OACN,KAAK,EACT,MAAM,EAAE,MAA6B,EACrC,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,GACZ,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Image.js","sourceRoot":"","sources":["../../../../src/components/Image.tsx"],"names":[],"mappings":"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"}