@os-design-mobile/image-upload 1.0.110 → 1.0.112

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqD,MAAM,OAAO,CAAC;AAE1E,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAGhF,OAAO,EAGL,KAAK,KAAK,EAEV,KAAK,aAAa,EAClB,KAAK,mBAAmB,EACzB,MAAM,2BAA2B,CAAC;AAQnC,OAAsB,EAAE,KAAK,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE9E,MAAM,WAAW,gBAAiB,SAAQ,eAAe;IACvD;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,IAAI,CACxB,mBAAmB,EACnB,UAAU,GAAG,WAAW,GAAG,SAAS,CACrC,CAAC;IACF;;;OAGG;IACH,aAAa,CAAC,EAAE,IAAI,CAClB,aAAa,EACb,UAAU,GAAG,WAAW,GAAG,SAAS,GAAG,cAAc,GAAG,YAAY,CACrE,CAAC;IACF;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IACrB;;;OAGG;IACH,YAAY,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IAC5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,KAAK,IAAI,CAAC;CAC1C;AAgFD;;GAEG;AACH,QAAA,MAAM,WAAW,wKA4IhB,CAAC;AAIF,eAAe,WAAW,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqD,MAAM,OAAO,CAAC;AAE1E,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAGhF,OAAO,EAGL,KAAK,KAAK,EAEV,KAAK,aAAa,EAClB,KAAK,mBAAmB,EACzB,MAAM,2BAA2B,CAAC;AAOnC,OAAsB,EAAE,KAAK,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE9E,MAAM,WAAW,gBAAiB,SAAQ,eAAe;IACvD;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,IAAI,CACxB,mBAAmB,EACnB,UAAU,GAAG,WAAW,GAAG,SAAS,CACrC,CAAC;IACF;;;OAGG;IACH,aAAa,CAAC,EAAE,IAAI,CAClB,aAAa,EACb,UAAU,GAAG,WAAW,GAAG,SAAS,GAAG,cAAc,GAAG,YAAY,CACrE,CAAC;IACF;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IACrB;;;OAGG;IACH,YAAY,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IAC5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,KAAK,IAAI,CAAC;CAC1C;AAgFD;;GAEG;AACH,QAAA,MAAM,WAAW,wKA0IhB,CAAC;AAIF,eAAe,WAAW,CAAC"}
package/dist/index.js CHANGED
@@ -1,2 +1,2 @@
1
- var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _asyncToGenerator2=_interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _reactNativeGestureHandler=require("react-native-gesture-handler");var _actionMenu=_interopRequireWildcard(require("@os-design-mobile/action-menu"));var _icons=require("@os-design-mobile/icons");var _reactNativeImagePicker=require("react-native-image-picker");var _text=_interopRequireDefault(require("@os-design-mobile/text"));var _image=_interopRequireDefault(require("@os-design-mobile/image"));var _useForwardedState3=_interopRequireDefault(require("@os-design/use-forwarded-state"));var _native=_interopRequireDefault(require("@emotion/native"));var _omitEmotionProps=_interopRequireDefault(require("@os-design/omit-emotion-props"));var _theming=require("@os-design-mobile/theming");var _button=_interopRequireDefault(require("@os-design-mobile/button"));var _defaultLocale=_interopRequireDefault(require("./utils/defaultLocale"));var _jsxRuntime=require("react/jsx-runtime");var _excluded=["url","locale","imageLibraryOptions","cameraOptions","value","defaultValue","onChange","onPress"];function _getRequireWildcardCache(e){if("function"!=typeof WeakMap)return null;var r=new WeakMap(),t=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(e){return e?t:r;})(e);}function _interopRequireWildcard(e,r){if(!r&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=_getRequireWildcardCache(r);if(t&&t.has(e))return t.get(e);var n={__proto__:null},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var u in e)if("default"!==u&&{}.hasOwnProperty.call(e,u)){var i=a?Object.getOwnPropertyDescriptor(e,u):null;i&&(i.get||i.set)?Object.defineProperty(n,u,i):n[u]=e[u];}return n.default=e,t&&t.set(e,n),n;}var overlayHasImageStyles=function overlayHasImageStyles(p){return p.hasImage?{backgroundColor:(0,_theming.clr)([0,0,0,p.theme.imageUploadOverlayOpacity]),borderRadius:p.theme.borderRadius*p.theme.fontSize}:{};};var Overlay=(0,_native.default)(_reactNative.View,(0,_omitEmotionProps.default)('hasImage'))(function(p){return Object.assign({position:'absolute',top:0,right:0,bottom:0,left:0,justifyContent:'center',alignItems:'center',padding:p.theme.imageUploadOverlayPadding*p.theme.fontSize},overlayHasImageStyles(p));});var StyledRectButton=(0,_native.default)(_reactNativeGestureHandler.RectButton)(function(p){return{width:'100%',maxWidth:p.theme.imageUploadMaxWidth*p.theme.fontSize,minHeight:p.theme.imageUploadMinHeight*p.theme.fontSize,borderRadius:p.theme.borderRadius*p.theme.fontSize};});var notHasImageStyles=function notHasImageStyles(p){return!p.hasImage?{backgroundColor:(0,_theming.clr)(p.theme.imageUploadNoImageColorBg),borderWidth:2,borderColor:(0,_theming.clr)(p.theme.imageUploadNoImageColorBorder),borderStyle:'dashed'}:{};};var Container=(0,_native.default)(_reactNative.View,(0,_omitEmotionProps.default)('hasImage'))(function(p){return Object.assign({minHeight:p.theme.imageUploadMinHeight*p.theme.fontSize,borderRadius:p.theme.borderRadius*p.theme.fontSize},notHasImageStyles(p));});var Content=_native.default.View({flex:1,justifyContent:'center',alignItems:'center'});var Title=(0,_native.default)(_text.default)(function(p){return{marginTop:0.5*p.theme.fontSize,textAlign:'center'};});var StyledImage=(0,_native.default)(_image.default)({resizeMode:'cover',aspectRatio:1});var DeleteButtonContainer=_native.default.View(function(p){return{position:'absolute',top:0.5*p.theme.fontSize,right:0.5*p.theme.fontSize};});var ImageUpload=(0,_react.forwardRef)(function(_ref,ref){var url=_ref.url,_ref$locale=_ref.locale,locale=_ref$locale===void 0?_defaultLocale.default:_ref$locale,_ref$imageLibraryOpti=_ref.imageLibraryOptions,imageLibraryOptions=_ref$imageLibraryOpti===void 0?{}:_ref$imageLibraryOpti,_ref$cameraOptions=_ref.cameraOptions,cameraOptions=_ref$cameraOptions===void 0?{}:_ref$cameraOptions,value=_ref.value,defaultValue=_ref.defaultValue,onChange=_ref.onChange,_ref$onPress=_ref.onPress,_onPress=_ref$onPress===void 0?function(){}:_ref$onPress,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var _useForwardedState=(0,_useForwardedState3.default)({value:value,defaultValue:defaultValue,onChange:onChange}),_useForwardedState2=(0,_slicedToArray2.default)(_useForwardedState,2),forwardedValue=_useForwardedState2[0],setForwardedValue=_useForwardedState2[1];var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),modalVisible=_useState2[0],setModalVisible=_useState2[1];var _useTheme=(0,_theming.useTheme)(),theme=_useTheme.theme;var chooseFromPhotoLibraryHandler=(0,_react.useCallback)((0,_asyncToGenerator2.default)(function*(){try{var _yield$Promise=yield new Promise(function(resolve){(0,_reactNativeImagePicker.launchImageLibrary)(Object.assign({mediaType:'photo'},imageLibraryOptions),resolve);}),assets=_yield$Promise.assets;setModalVisible(false);if(assets)setForwardedValue(assets[0]);}catch(_unused){}}),[imageLibraryOptions,setForwardedValue]);var takePhotoHandler=(0,_react.useCallback)((0,_asyncToGenerator2.default)(function*(){try{var _yield$Promise2=yield new Promise(function(resolve){(0,_reactNativeImagePicker.launchCamera)(Object.assign({mediaType:'photo'},cameraOptions),resolve);}),assets=_yield$Promise2.assets;setModalVisible(false);if(assets)setForwardedValue(assets[0]);}catch(_unused2){}}),[cameraOptions,setForwardedValue]);var source=(0,_react.useMemo)(function(){if(forwardedValue===null)return null;if(forwardedValue)return forwardedValue.uri;if(url)return url;return null;},[forwardedValue,url]);var hasImage=(0,_react.useMemo)(function(){return!!source;},[source]);return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_theming.ThemeOverrider,{overrides:hasImage?{colorText:[0,0,100]}:{},children:(0,_jsxRuntime.jsx)(StyledRectButton,Object.assign({onPress:function onPress(e){setModalVisible(true);_onPress(e);},underlayColor:hasImage?(0,_theming.clr)([0,0,100]):(0,_theming.clr)(theme.imageUploadNoImageBgHighlight),activeOpacity:hasImage?0.8:1},rest,{ref:ref,children:(0,_jsxRuntime.jsxs)(Container,{hasImage:hasImage,accessible:true,accessibilityRole:"imagebutton",children:[source&&(0,_jsxRuntime.jsx)(StyledImage,{source:{uri:source}}),(0,_jsxRuntime.jsxs)(Overlay,{hasImage:hasImage,children:[(0,_jsxRuntime.jsxs)(Content,{children:[(0,_jsxRuntime.jsx)(_theming.ThemeOverrider,{overrides:function overrides(t){return{fontSize:2.5*t.fontSize};},children:(0,_jsxRuntime.jsx)(_icons.Picture,{})}),(0,_jsxRuntime.jsx)(Title,{children:locale==null?void 0:locale.title})]}),hasImage&&(0,_jsxRuntime.jsx)(_theming.ThemeOverrider,{overrides:{buttonGhostColorText:[0,0,100],buttonGhostColorBgHighlight:[0,0,100,0.1]},children:(0,_jsxRuntime.jsx)(DeleteButtonContainer,{children:(0,_jsxRuntime.jsx)(_button.default,{type:"ghost",onPress:function onPress(){return setForwardedValue(null);},children:(0,_jsxRuntime.jsx)(_icons.Delete,{})})})})]})]})}))}),(0,_jsxRuntime.jsxs)(_actionMenu.default,{visible:modalVisible,onClose:function onClose(){return setModalVisible(false);},children:[(0,_jsxRuntime.jsx)(_actionMenu.MenuItem,{left:(0,_jsxRuntime.jsx)(_icons.Picture,{}),onPress:chooseFromPhotoLibraryHandler,children:locale==null?void 0:locale.chooseFromLibrary}),(0,_jsxRuntime.jsx)(_actionMenu.MenuItem,{left:(0,_jsxRuntime.jsx)(_icons.Camera,{}),onPress:takePhotoHandler,children:locale==null?void 0:locale.takePhoto})]})]});});ImageUpload.displayName='ImageUpload';var _default=exports.default=ImageUpload;
1
+ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _asyncToGenerator2=_interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _reactNativeGestureHandler=require("react-native-gesture-handler");var _actionMenu=_interopRequireWildcard(require("@os-design-mobile/action-menu"));var _icons=require("@os-design-mobile/icons");var _reactNativeImagePicker=require("react-native-image-picker");var _text=_interopRequireDefault(require("@os-design-mobile/text"));var _image=_interopRequireDefault(require("@os-design-mobile/image"));var _native=_interopRequireDefault(require("@emotion/native"));var _omitEmotionProps=_interopRequireDefault(require("@os-design/omit-emotion-props"));var _theming=require("@os-design-mobile/theming");var _button=_interopRequireDefault(require("@os-design-mobile/button"));var _defaultLocale=_interopRequireDefault(require("./utils/defaultLocale"));var _jsxRuntime=require("react/jsx-runtime");var _excluded=["url","locale","imageLibraryOptions","cameraOptions","value","defaultValue","onChange","onPress"];function _getRequireWildcardCache(e){if("function"!=typeof WeakMap)return null;var r=new WeakMap(),t=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(e){return e?t:r;})(e);}function _interopRequireWildcard(e,r){if(!r&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=_getRequireWildcardCache(r);if(t&&t.has(e))return t.get(e);var n={__proto__:null},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var u in e)if("default"!==u&&{}.hasOwnProperty.call(e,u)){var i=a?Object.getOwnPropertyDescriptor(e,u):null;i&&(i.get||i.set)?Object.defineProperty(n,u,i):n[u]=e[u];}return n.default=e,t&&t.set(e,n),n;}var overlayHasImageStyles=function overlayHasImageStyles(p){return p.hasImage?{backgroundColor:(0,_theming.clr)([0,0,0,p.theme.imageUploadOverlayOpacity]),borderRadius:p.theme.borderRadius*p.theme.fontSize}:{};};var Overlay=(0,_native.default)(_reactNative.View,(0,_omitEmotionProps.default)('hasImage'))(function(p){return Object.assign({position:'absolute',top:0,right:0,bottom:0,left:0,justifyContent:'center',alignItems:'center',padding:p.theme.imageUploadOverlayPadding*p.theme.fontSize},overlayHasImageStyles(p));});var StyledRectButton=(0,_native.default)(_reactNativeGestureHandler.RectButton)(function(p){return{width:'100%',maxWidth:p.theme.imageUploadMaxWidth*p.theme.fontSize,minHeight:p.theme.imageUploadMinHeight*p.theme.fontSize,borderRadius:p.theme.borderRadius*p.theme.fontSize};});var notHasImageStyles=function notHasImageStyles(p){return!p.hasImage?{backgroundColor:(0,_theming.clr)(p.theme.imageUploadNoImageColorBg),borderWidth:2,borderColor:(0,_theming.clr)(p.theme.imageUploadNoImageColorBorder),borderStyle:'dashed'}:{};};var Container=(0,_native.default)(_reactNative.View,(0,_omitEmotionProps.default)('hasImage'))(function(p){return Object.assign({minHeight:p.theme.imageUploadMinHeight*p.theme.fontSize,borderRadius:p.theme.borderRadius*p.theme.fontSize},notHasImageStyles(p));});var Content=_native.default.View({flex:1,justifyContent:'center',alignItems:'center'});var Title=(0,_native.default)(_text.default)(function(p){return{marginTop:0.5*p.theme.fontSize,textAlign:'center'};});var StyledImage=(0,_native.default)(_image.default)({resizeMode:'cover',aspectRatio:1});var DeleteButtonContainer=_native.default.View(function(p){return{position:'absolute',top:0.5*p.theme.fontSize,right:0.5*p.theme.fontSize};});var ImageUpload=(0,_react.forwardRef)(function(_ref,ref){var url=_ref.url,_ref$locale=_ref.locale,locale=_ref$locale===void 0?_defaultLocale.default:_ref$locale,_ref$imageLibraryOpti=_ref.imageLibraryOptions,imageLibraryOptions=_ref$imageLibraryOpti===void 0?{}:_ref$imageLibraryOpti,_ref$cameraOptions=_ref.cameraOptions,cameraOptions=_ref$cameraOptions===void 0?{}:_ref$cameraOptions,value=_ref.value,defaultValue=_ref.defaultValue,_ref$onChange=_ref.onChange,onChange=_ref$onChange===void 0?function(){}:_ref$onChange,_ref$onPress=_ref.onPress,_onPress=_ref$onPress===void 0?function(){}:_ref$onPress,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),modalVisible=_useState2[0],setModalVisible=_useState2[1];var _useTheme=(0,_theming.useTheme)(),theme=_useTheme.theme;var chooseFromPhotoLibraryHandler=(0,_react.useCallback)((0,_asyncToGenerator2.default)(function*(){try{var _yield$Promise=yield new Promise(function(resolve){(0,_reactNativeImagePicker.launchImageLibrary)(Object.assign({mediaType:'photo'},imageLibraryOptions),resolve);}),assets=_yield$Promise.assets;setModalVisible(false);if(assets)onChange(assets[0]);}catch(_unused){}}),[imageLibraryOptions,onChange]);var takePhotoHandler=(0,_react.useCallback)((0,_asyncToGenerator2.default)(function*(){try{var _yield$Promise2=yield new Promise(function(resolve){(0,_reactNativeImagePicker.launchCamera)(Object.assign({mediaType:'photo'},cameraOptions),resolve);}),assets=_yield$Promise2.assets;setModalVisible(false);if(assets)onChange(assets[0]);}catch(_unused2){}}),[cameraOptions,onChange]);var source=(0,_react.useMemo)(function(){if(value===null)return null;if(value)return value.uri;if(url)return url;return null;},[value,url]);var hasImage=(0,_react.useMemo)(function(){return!!source;},[source]);return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_theming.ThemeOverrider,{overrides:hasImage?{colorText:[0,0,100]}:{},children:(0,_jsxRuntime.jsx)(StyledRectButton,Object.assign({onPress:function onPress(e){setModalVisible(true);_onPress(e);},underlayColor:hasImage?(0,_theming.clr)([0,0,100]):(0,_theming.clr)(theme.imageUploadNoImageBgHighlight),activeOpacity:hasImage?0.8:1},rest,{ref:ref,children:(0,_jsxRuntime.jsxs)(Container,{hasImage:hasImage,accessible:true,accessibilityRole:"imagebutton",children:[source&&(0,_jsxRuntime.jsx)(StyledImage,{source:{uri:source}}),(0,_jsxRuntime.jsxs)(Overlay,{hasImage:hasImage,children:[(0,_jsxRuntime.jsxs)(Content,{children:[(0,_jsxRuntime.jsx)(_theming.ThemeOverrider,{overrides:function overrides(t){return{fontSize:2.5*t.fontSize};},children:(0,_jsxRuntime.jsx)(_icons.Picture,{})}),(0,_jsxRuntime.jsx)(Title,{children:locale==null?void 0:locale.title})]}),hasImage&&(0,_jsxRuntime.jsx)(_theming.ThemeOverrider,{overrides:{buttonGhostColorText:[0,0,100],buttonGhostColorBgHighlight:[0,0,100,0.1]},children:(0,_jsxRuntime.jsx)(DeleteButtonContainer,{children:(0,_jsxRuntime.jsx)(_button.default,{type:"ghost",onPress:function onPress(){return onChange(null);},children:(0,_jsxRuntime.jsx)(_icons.Delete,{})})})})]})]})}))}),(0,_jsxRuntime.jsxs)(_actionMenu.default,{visible:modalVisible,onClose:function onClose(){return setModalVisible(false);},children:[(0,_jsxRuntime.jsx)(_actionMenu.MenuItem,{left:(0,_jsxRuntime.jsx)(_icons.Picture,{}),onPress:chooseFromPhotoLibraryHandler,children:locale==null?void 0:locale.chooseFromLibrary}),(0,_jsxRuntime.jsx)(_actionMenu.MenuItem,{left:(0,_jsxRuntime.jsx)(_icons.Camera,{}),onPress:takePhotoHandler,children:locale==null?void 0:locale.takePhoto})]})]});});ImageUpload.displayName='ImageUpload';var _default=exports.default=ImageUpload;
2
2
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeGestureHandler","_actionMenu","_icons","_reactNativeImagePicker","_text","_interopRequireDefault","_image","_useForwardedState3","_native","_omitEmotionProps","_theming","_button","_defaultLocale","_jsxRuntime","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","overlayHasImageStyles","p","hasImage","backgroundColor","clr","theme","imageUploadOverlayOpacity","borderRadius","fontSize","Overlay","styled","View","omitEmotionProps","assign","position","top","right","bottom","left","justifyContent","alignItems","padding","imageUploadOverlayPadding","StyledRectButton","RectButton","width","maxWidth","imageUploadMaxWidth","minHeight","imageUploadMinHeight","notHasImageStyles","imageUploadNoImageColorBg","borderWidth","borderColor","imageUploadNoImageColorBorder","borderStyle","Container","Content","flex","Title","Text","marginTop","textAlign","StyledImage","Image","resizeMode","aspectRatio","DeleteButtonContainer","ImageUpload","forwardRef","_ref","ref","url","_ref$locale","locale","defaultLocale","_ref$imageLibraryOpti","imageLibraryOptions","_ref$cameraOptions","cameraOptions","value","defaultValue","onChange","_ref$onPress","onPress","rest","_objectWithoutProperties2","_useForwardedState","useForwardedState","_useForwardedState2","_slicedToArray2","forwardedValue","setForwardedValue","_useState","useState","_useState2","modalVisible","setModalVisible","_useTheme","useTheme","chooseFromPhotoLibraryHandler","useCallback","_asyncToGenerator2","_yield$Promise","Promise","resolve","launchImageLibrary","mediaType","assets","_unused","takePhotoHandler","_yield$Promise2","launchCamera","_unused2","source","useMemo","uri","jsxs","Fragment","children","jsx","ThemeOverrider","overrides","colorText","underlayColor","imageUploadNoImageBgHighlight","activeOpacity","accessible","accessibilityRole","Picture","title","buttonGhostColorText","buttonGhostColorBgHighlight","type","Delete","visible","onClose","MenuItem","chooseFromLibrary","Camera","takePhoto","displayName","_default","exports"],"sources":["../src/index.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo, useState } from 'react';\nimport { View, type ViewProps } from 'react-native';\nimport { RectButton, type RectButtonProps } from 'react-native-gesture-handler';\nimport ActionMenu, { MenuItem } from '@os-design-mobile/action-menu';\nimport { Picture, Camera, Delete } from '@os-design-mobile/icons';\nimport {\n launchImageLibrary,\n launchCamera,\n type Asset,\n type ImagePickerResponse,\n type CameraOptions,\n type ImageLibraryOptions,\n} from 'react-native-image-picker';\nimport Text from '@os-design-mobile/text';\nimport Image from '@os-design-mobile/image';\nimport useForwardedState from '@os-design/use-forwarded-state';\nimport styled from '@emotion/native';\nimport omitEmotionProps from '@os-design/omit-emotion-props';\nimport { clr, ThemeOverrider, useTheme } from '@os-design-mobile/theming';\nimport Button from '@os-design-mobile/button';\nimport defaultLocale, { type ImageUploadLocale } from './utils/defaultLocale';\n\nexport interface ImageUploadProps extends RectButtonProps {\n /**\n * The url of the image.\n * @default undefined\n */\n url?: string;\n /**\n * The locale of the component.\n * @default undefined\n */\n locale?: ImageUploadLocale;\n /**\n * The image library options.\n * @default undefined\n */\n imageLibraryOptions?: Pick<\n ImageLibraryOptions,\n 'maxWidth' | 'maxHeight' | 'quality'\n >;\n /**\n * The camera options.\n * @default undefined\n */\n cameraOptions?: Pick<\n CameraOptions,\n 'maxWidth' | 'maxHeight' | 'quality' | 'saveToPhotos' | 'cameraType'\n >;\n /**\n * The selected local file, or null if the image is marked as deleted.\n * @default undefined\n */\n value?: Asset | null;\n /**\n * The default value.\n * @default undefined\n */\n defaultValue?: Asset | null;\n /**\n * The change event handler.\n * @default undefined\n */\n onChange?: (value: Asset | null) => void;\n}\n\nconst overlayHasImageStyles = (p) =>\n p.hasImage\n ? {\n backgroundColor: clr([0, 0, 0, p.theme.imageUploadOverlayOpacity]),\n borderRadius: p.theme.borderRadius * p.theme.fontSize,\n }\n : {};\n\ninterface OverlayProps {\n hasImage: boolean;\n}\nconst Overlay = styled(\n View,\n omitEmotionProps('hasImage')\n)<OverlayProps>((p) => ({\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n justifyContent: 'center',\n alignItems: 'center',\n padding: p.theme.imageUploadOverlayPadding * p.theme.fontSize,\n ...overlayHasImageStyles(p),\n}));\n\nconst StyledRectButton = styled(RectButton)((p) => ({\n width: '100%',\n maxWidth: p.theme.imageUploadMaxWidth * p.theme.fontSize,\n minHeight: p.theme.imageUploadMinHeight * p.theme.fontSize,\n borderRadius: p.theme.borderRadius * p.theme.fontSize,\n}));\n\nconst notHasImageStyles = (p): Partial<ViewProps> =>\n !p.hasImage\n ? ({\n backgroundColor: clr(p.theme.imageUploadNoImageColorBg),\n borderWidth: 2,\n borderColor: clr(p.theme.imageUploadNoImageColorBorder),\n borderStyle: 'dashed',\n } as Partial<ViewProps>)\n : {};\n\ninterface ContainerProps {\n hasImage: boolean;\n}\n\nconst Container = styled(\n View,\n omitEmotionProps('hasImage')\n)<ContainerProps>((p) => ({\n minHeight: p.theme.imageUploadMinHeight * p.theme.fontSize,\n borderRadius: p.theme.borderRadius * p.theme.fontSize,\n ...notHasImageStyles(p),\n}));\n\nconst Content = styled.View({\n flex: 1,\n justifyContent: 'center',\n alignItems: 'center',\n});\n\nconst Title = styled(Text)((p) => ({\n marginTop: 0.5 * p.theme.fontSize,\n textAlign: 'center',\n}));\n\nconst StyledImage = styled(Image)({\n resizeMode: 'cover',\n aspectRatio: 1,\n});\n\nconst DeleteButtonContainer = styled.View((p) => ({\n position: 'absolute',\n top: 0.5 * p.theme.fontSize,\n right: 0.5 * p.theme.fontSize,\n}));\n\n/**\n * The component to upload an image.\n */\nconst ImageUpload = forwardRef<typeof RectButton, ImageUploadProps>(\n (\n {\n url,\n locale = defaultLocale,\n imageLibraryOptions = {},\n cameraOptions = {},\n value,\n defaultValue,\n onChange,\n onPress = () => {},\n ...rest\n },\n ref\n ) => {\n const [forwardedValue, setForwardedValue] = useForwardedState({\n value,\n defaultValue,\n onChange,\n });\n\n const [modalVisible, setModalVisible] = useState(false);\n const { theme } = useTheme();\n\n const chooseFromPhotoLibraryHandler = useCallback(async () => {\n try {\n const { assets } = await new Promise<ImagePickerResponse>((resolve) => {\n launchImageLibrary(\n {\n mediaType: 'photo',\n ...imageLibraryOptions,\n },\n resolve\n );\n });\n setModalVisible(false);\n if (assets) setForwardedValue(assets[0]);\n } catch {} // eslint-disable-line no-empty\n }, [imageLibraryOptions, setForwardedValue]);\n\n const takePhotoHandler = useCallback(async () => {\n try {\n const { assets } = await new Promise<ImagePickerResponse>((resolve) => {\n launchCamera(\n {\n mediaType: 'photo',\n ...cameraOptions,\n },\n resolve\n );\n });\n setModalVisible(false);\n if (assets) setForwardedValue(assets[0]);\n } catch {} // eslint-disable-line no-empty\n }, [cameraOptions, setForwardedValue]);\n\n const source = useMemo(() => {\n if (forwardedValue === null) return null;\n if (forwardedValue) return forwardedValue.uri; // If the user select an image\n if (url) return url; // If the image already exists\n return null;\n }, [forwardedValue, url]);\n\n const hasImage = useMemo(() => !!source, [source]);\n\n return (\n <>\n <ThemeOverrider overrides={hasImage ? { colorText: [0, 0, 100] } : {}}>\n <StyledRectButton\n onPress={(e) => {\n setModalVisible(true);\n onPress(e);\n }}\n underlayColor={\n hasImage\n ? clr([0, 0, 100])\n : clr(theme.imageUploadNoImageBgHighlight)\n }\n // rippleColor={\n // hasImage\n // ? clr([0, 0, 100])\n // : clr(theme.imageUploadNoImageBgRipple)\n // }\n activeOpacity={hasImage ? 0.8 : 1}\n {...rest}\n ref={ref}\n >\n <Container\n hasImage={hasImage}\n accessible\n accessibilityRole='imagebutton'\n >\n {source && <StyledImage source={{ uri: source }} />}\n\n <Overlay hasImage={hasImage}>\n <Content>\n <ThemeOverrider\n overrides={(t) => ({ fontSize: 2.5 * t.fontSize })}\n >\n <Picture />\n </ThemeOverrider>\n <Title>{locale?.title}</Title>\n </Content>\n\n {hasImage && (\n <ThemeOverrider\n overrides={{\n buttonGhostColorText: [0, 0, 100],\n buttonGhostColorBgHighlight: [0, 0, 100, 0.1],\n }}\n >\n <DeleteButtonContainer>\n <Button\n type='ghost'\n onPress={() => setForwardedValue(null)}\n >\n <Delete />\n </Button>\n </DeleteButtonContainer>\n </ThemeOverrider>\n )}\n </Overlay>\n </Container>\n </StyledRectButton>\n </ThemeOverrider>\n\n <ActionMenu\n visible={modalVisible}\n onClose={() => setModalVisible(false)}\n >\n <MenuItem left={<Picture />} onPress={chooseFromPhotoLibraryHandler}>\n {locale?.chooseFromLibrary}\n </MenuItem>\n <MenuItem left={<Camera />} onPress={takePhotoHandler}>\n {locale?.takePhoto}\n </MenuItem>\n </ActionMenu>\n </>\n );\n }\n);\n\nImageUpload.displayName = 'ImageUpload';\n\nexport default ImageUpload;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeGestureHandler","_actionMenu","_icons","_reactNativeImagePicker","_text","_interopRequireDefault","_image","_native","_omitEmotionProps","_theming","_button","_defaultLocale","_jsxRuntime","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","overlayHasImageStyles","p","hasImage","backgroundColor","clr","theme","imageUploadOverlayOpacity","borderRadius","fontSize","Overlay","styled","View","omitEmotionProps","assign","position","top","right","bottom","left","justifyContent","alignItems","padding","imageUploadOverlayPadding","StyledRectButton","RectButton","width","maxWidth","imageUploadMaxWidth","minHeight","imageUploadMinHeight","notHasImageStyles","imageUploadNoImageColorBg","borderWidth","borderColor","imageUploadNoImageColorBorder","borderStyle","Container","Content","flex","Title","Text","marginTop","textAlign","StyledImage","Image","resizeMode","aspectRatio","DeleteButtonContainer","ImageUpload","forwardRef","_ref","ref","url","_ref$locale","locale","defaultLocale","_ref$imageLibraryOpti","imageLibraryOptions","_ref$cameraOptions","cameraOptions","value","defaultValue","_ref$onChange","onChange","_ref$onPress","onPress","rest","_objectWithoutProperties2","_useState","useState","_useState2","_slicedToArray2","modalVisible","setModalVisible","_useTheme","useTheme","chooseFromPhotoLibraryHandler","useCallback","_asyncToGenerator2","_yield$Promise","Promise","resolve","launchImageLibrary","mediaType","assets","_unused","takePhotoHandler","_yield$Promise2","launchCamera","_unused2","source","useMemo","uri","jsxs","Fragment","children","jsx","ThemeOverrider","overrides","colorText","underlayColor","imageUploadNoImageBgHighlight","activeOpacity","accessible","accessibilityRole","Picture","title","buttonGhostColorText","buttonGhostColorBgHighlight","type","Delete","visible","onClose","MenuItem","chooseFromLibrary","Camera","takePhoto","displayName","_default","exports"],"sources":["../src/index.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo, useState } from 'react';\nimport { View, type ViewProps } from 'react-native';\nimport { RectButton, type RectButtonProps } from 'react-native-gesture-handler';\nimport ActionMenu, { MenuItem } from '@os-design-mobile/action-menu';\nimport { Picture, Camera, Delete } from '@os-design-mobile/icons';\nimport {\n launchImageLibrary,\n launchCamera,\n type Asset,\n type ImagePickerResponse,\n type CameraOptions,\n type ImageLibraryOptions,\n} from 'react-native-image-picker';\nimport Text from '@os-design-mobile/text';\nimport Image from '@os-design-mobile/image';\nimport styled from '@emotion/native';\nimport omitEmotionProps from '@os-design/omit-emotion-props';\nimport { clr, ThemeOverrider, useTheme } from '@os-design-mobile/theming';\nimport Button from '@os-design-mobile/button';\nimport defaultLocale, { type ImageUploadLocale } from './utils/defaultLocale';\n\nexport interface ImageUploadProps extends RectButtonProps {\n /**\n * The url of the image.\n * @default undefined\n */\n url?: string;\n /**\n * The locale of the component.\n * @default undefined\n */\n locale?: ImageUploadLocale;\n /**\n * The image library options.\n * @default undefined\n */\n imageLibraryOptions?: Pick<\n ImageLibraryOptions,\n 'maxWidth' | 'maxHeight' | 'quality'\n >;\n /**\n * The camera options.\n * @default undefined\n */\n cameraOptions?: Pick<\n CameraOptions,\n 'maxWidth' | 'maxHeight' | 'quality' | 'saveToPhotos' | 'cameraType'\n >;\n /**\n * The selected local file, or null if the image is marked as deleted.\n * @default undefined\n */\n value?: Asset | null;\n /**\n * The default value.\n * @default undefined\n */\n defaultValue?: Asset | null;\n /**\n * The change event handler.\n * @default undefined\n */\n onChange?: (value: Asset | null) => void;\n}\n\nconst overlayHasImageStyles = (p) =>\n p.hasImage\n ? {\n backgroundColor: clr([0, 0, 0, p.theme.imageUploadOverlayOpacity]),\n borderRadius: p.theme.borderRadius * p.theme.fontSize,\n }\n : {};\n\ninterface OverlayProps {\n hasImage: boolean;\n}\nconst Overlay = styled(\n View,\n omitEmotionProps('hasImage')\n)<OverlayProps>((p) => ({\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n justifyContent: 'center',\n alignItems: 'center',\n padding: p.theme.imageUploadOverlayPadding * p.theme.fontSize,\n ...overlayHasImageStyles(p),\n}));\n\nconst StyledRectButton = styled(RectButton)((p) => ({\n width: '100%',\n maxWidth: p.theme.imageUploadMaxWidth * p.theme.fontSize,\n minHeight: p.theme.imageUploadMinHeight * p.theme.fontSize,\n borderRadius: p.theme.borderRadius * p.theme.fontSize,\n}));\n\nconst notHasImageStyles = (p): Partial<ViewProps> =>\n !p.hasImage\n ? ({\n backgroundColor: clr(p.theme.imageUploadNoImageColorBg),\n borderWidth: 2,\n borderColor: clr(p.theme.imageUploadNoImageColorBorder),\n borderStyle: 'dashed',\n } as Partial<ViewProps>)\n : {};\n\ninterface ContainerProps {\n hasImage: boolean;\n}\n\nconst Container = styled(\n View,\n omitEmotionProps('hasImage')\n)<ContainerProps>((p) => ({\n minHeight: p.theme.imageUploadMinHeight * p.theme.fontSize,\n borderRadius: p.theme.borderRadius * p.theme.fontSize,\n ...notHasImageStyles(p),\n}));\n\nconst Content = styled.View({\n flex: 1,\n justifyContent: 'center',\n alignItems: 'center',\n});\n\nconst Title = styled(Text)((p) => ({\n marginTop: 0.5 * p.theme.fontSize,\n textAlign: 'center',\n}));\n\nconst StyledImage = styled(Image)({\n resizeMode: 'cover',\n aspectRatio: 1,\n});\n\nconst DeleteButtonContainer = styled.View((p) => ({\n position: 'absolute',\n top: 0.5 * p.theme.fontSize,\n right: 0.5 * p.theme.fontSize,\n}));\n\n/**\n * The component to upload an image.\n */\nconst ImageUpload = forwardRef<typeof RectButton, ImageUploadProps>(\n (\n {\n url,\n locale = defaultLocale,\n imageLibraryOptions = {},\n cameraOptions = {},\n value,\n defaultValue,\n onChange = () => {},\n onPress = () => {},\n ...rest\n },\n ref\n ) => {\n // Do not use useForwardedState here!\n // Edge case:\n // 1. Component has a photo: url is specified, value is undefined (inner value is used).\n // 2. The user deletes the photo: url is specified, value is null (inner value is null)\n // 3. The user chooses another photo: url is specified, value is a file (inner value is not used).\n // 4. The user is uploaded the photo: url is changed, value is undefined (inner value is used, but it's null).\n\n const [modalVisible, setModalVisible] = useState(false);\n const { theme } = useTheme();\n\n const chooseFromPhotoLibraryHandler = useCallback(async () => {\n try {\n const { assets } = await new Promise<ImagePickerResponse>((resolve) => {\n launchImageLibrary(\n {\n mediaType: 'photo',\n ...imageLibraryOptions,\n },\n resolve\n );\n });\n setModalVisible(false);\n if (assets) onChange(assets[0]);\n } catch {} // eslint-disable-line no-empty\n }, [imageLibraryOptions, onChange]);\n\n const takePhotoHandler = useCallback(async () => {\n try {\n const { assets } = await new Promise<ImagePickerResponse>((resolve) => {\n launchCamera(\n {\n mediaType: 'photo',\n ...cameraOptions,\n },\n resolve\n );\n });\n setModalVisible(false);\n if (assets) onChange(assets[0]);\n } catch {} // eslint-disable-line no-empty\n }, [cameraOptions, onChange]);\n\n const source = useMemo(() => {\n if (value === null) return null;\n if (value) return value.uri; // If the user select an image\n if (url) return url; // If the image already exists\n return null;\n }, [value, url]);\n\n const hasImage = useMemo(() => !!source, [source]);\n\n return (\n <>\n <ThemeOverrider overrides={hasImage ? { colorText: [0, 0, 100] } : {}}>\n <StyledRectButton\n onPress={(e) => {\n setModalVisible(true);\n onPress(e);\n }}\n underlayColor={\n hasImage\n ? clr([0, 0, 100])\n : clr(theme.imageUploadNoImageBgHighlight)\n }\n // rippleColor={\n // hasImage\n // ? clr([0, 0, 100])\n // : clr(theme.imageUploadNoImageBgRipple)\n // }\n activeOpacity={hasImage ? 0.8 : 1}\n {...rest}\n ref={ref}\n >\n <Container\n hasImage={hasImage}\n accessible\n accessibilityRole='imagebutton'\n >\n {source && <StyledImage source={{ uri: source }} />}\n\n <Overlay hasImage={hasImage}>\n <Content>\n <ThemeOverrider\n overrides={(t) => ({ fontSize: 2.5 * t.fontSize })}\n >\n <Picture />\n </ThemeOverrider>\n <Title>{locale?.title}</Title>\n </Content>\n\n {hasImage && (\n <ThemeOverrider\n overrides={{\n buttonGhostColorText: [0, 0, 100],\n buttonGhostColorBgHighlight: [0, 0, 100, 0.1],\n }}\n >\n <DeleteButtonContainer>\n <Button type='ghost' onPress={() => onChange(null)}>\n <Delete />\n </Button>\n </DeleteButtonContainer>\n </ThemeOverrider>\n )}\n </Overlay>\n </Container>\n </StyledRectButton>\n </ThemeOverrider>\n\n <ActionMenu\n visible={modalVisible}\n onClose={() => setModalVisible(false)}\n >\n <MenuItem left={<Picture />} onPress={chooseFromPhotoLibraryHandler}>\n {locale?.chooseFromLibrary}\n </MenuItem>\n <MenuItem left={<Camera />} onPress={takePhotoHandler}>\n {locale?.takePhoto}\n </MenuItem>\n </ActionMenu>\n </>\n );\n }\n);\n\nImageUpload.displayName = 'ImageUpload';\n\nexport default ImageUpload;\n"],"mappings":"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","ignoreList":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@os-design-mobile/image-upload",
3
- "version": "1.0.110",
3
+ "version": "1.0.112",
4
4
  "license": "UNLICENSED",
5
5
  "repository": "git@gitlab.com:os-team/libs/os-design-mobile.git",
6
6
  "main": "./dist/index.js",
@@ -28,14 +28,13 @@
28
28
  "access": "public"
29
29
  },
30
30
  "dependencies": {
31
- "@os-design-mobile/action-menu": "^1.0.109",
32
- "@os-design-mobile/button": "^1.0.80",
33
- "@os-design-mobile/icons": "^1.0.75",
34
- "@os-design-mobile/image": "^1.0.61",
35
- "@os-design-mobile/text": "^1.0.73",
36
- "@os-design-mobile/theming": "^1.0.55",
37
- "@os-design/omit-emotion-props": "^1.0.28",
38
- "@os-design/use-forwarded-state": "^1.0.30"
31
+ "@os-design-mobile/action-menu": "^1.0.110",
32
+ "@os-design-mobile/button": "^1.0.81",
33
+ "@os-design-mobile/icons": "^1.0.76",
34
+ "@os-design-mobile/image": "^1.0.62",
35
+ "@os-design-mobile/text": "^1.0.74",
36
+ "@os-design-mobile/theming": "^1.0.56",
37
+ "@os-design/omit-emotion-props": "^1.0.28"
39
38
  },
40
39
  "peerDependencies": {
41
40
  "@emotion/native": ">=11",
@@ -48,5 +47,5 @@
48
47
  "react-native-safe-area-context": ">=3",
49
48
  "react-native-svg": ">=12"
50
49
  },
51
- "gitHead": "6e527e4adb1b68d4fea82903e62fbbe3177e8149"
50
+ "gitHead": "5c0241bb90077e0d1f175fcc33747bbbe2d86a40"
52
51
  }
package/src/index.tsx CHANGED
@@ -13,7 +13,6 @@ import {
13
13
  } from 'react-native-image-picker';
14
14
  import Text from '@os-design-mobile/text';
15
15
  import Image from '@os-design-mobile/image';
16
- import useForwardedState from '@os-design/use-forwarded-state';
17
16
  import styled from '@emotion/native';
18
17
  import omitEmotionProps from '@os-design/omit-emotion-props';
19
18
  import { clr, ThemeOverrider, useTheme } from '@os-design-mobile/theming';
@@ -154,17 +153,18 @@ const ImageUpload = forwardRef<typeof RectButton, ImageUploadProps>(
154
153
  cameraOptions = {},
155
154
  value,
156
155
  defaultValue,
157
- onChange,
156
+ onChange = () => {},
158
157
  onPress = () => {},
159
158
  ...rest
160
159
  },
161
160
  ref
162
161
  ) => {
163
- const [forwardedValue, setForwardedValue] = useForwardedState({
164
- value,
165
- defaultValue,
166
- onChange,
167
- });
162
+ // Do not use useForwardedState here!
163
+ // Edge case:
164
+ // 1. Component has a photo: url is specified, value is undefined (inner value is used).
165
+ // 2. The user deletes the photo: url is specified, value is null (inner value is null)
166
+ // 3. The user chooses another photo: url is specified, value is a file (inner value is not used).
167
+ // 4. The user is uploaded the photo: url is changed, value is undefined (inner value is used, but it's null).
168
168
 
169
169
  const [modalVisible, setModalVisible] = useState(false);
170
170
  const { theme } = useTheme();
@@ -181,9 +181,9 @@ const ImageUpload = forwardRef<typeof RectButton, ImageUploadProps>(
181
181
  );
182
182
  });
183
183
  setModalVisible(false);
184
- if (assets) setForwardedValue(assets[0]);
184
+ if (assets) onChange(assets[0]);
185
185
  } catch {} // eslint-disable-line no-empty
186
- }, [imageLibraryOptions, setForwardedValue]);
186
+ }, [imageLibraryOptions, onChange]);
187
187
 
188
188
  const takePhotoHandler = useCallback(async () => {
189
189
  try {
@@ -197,16 +197,16 @@ const ImageUpload = forwardRef<typeof RectButton, ImageUploadProps>(
197
197
  );
198
198
  });
199
199
  setModalVisible(false);
200
- if (assets) setForwardedValue(assets[0]);
200
+ if (assets) onChange(assets[0]);
201
201
  } catch {} // eslint-disable-line no-empty
202
- }, [cameraOptions, setForwardedValue]);
202
+ }, [cameraOptions, onChange]);
203
203
 
204
204
  const source = useMemo(() => {
205
- if (forwardedValue === null) return null;
206
- if (forwardedValue) return forwardedValue.uri; // If the user select an image
205
+ if (value === null) return null;
206
+ if (value) return value.uri; // If the user select an image
207
207
  if (url) return url; // If the image already exists
208
208
  return null;
209
- }, [forwardedValue, url]);
209
+ }, [value, url]);
210
210
 
211
211
  const hasImage = useMemo(() => !!source, [source]);
212
212
 
@@ -257,10 +257,7 @@ const ImageUpload = forwardRef<typeof RectButton, ImageUploadProps>(
257
257
  }}
258
258
  >
259
259
  <DeleteButtonContainer>
260
- <Button
261
- type='ghost'
262
- onPress={() => setForwardedValue(null)}
263
- >
260
+ <Button type='ghost' onPress={() => onChange(null)}>
264
261
  <Delete />
265
262
  </Button>
266
263
  </DeleteButtonContainer>