@wavemaker/app-rn-runtime 11.15.5-1.256 → 11.15.5-rc.259

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wavemaker/app-rn-runtime",
-  "version": "11.15.5-1.256",
+  "version": "11.15.5-rc.259",
   "description": "''",
   "main": "index",
   "module": "index",
@@ -59,7 +59,7 @@
     "@react-navigation/drawer": "7.5.8",
     "@react-navigation/native": "7.1.18",
     "@react-navigation/stack": "7.4.8",
-    "@wavemaker/variables": "11.15.5-1.256",
+    "@wavemaker/variables": "11.15.5-rc.259",
     "axios": "1.8.3",
     "color": "4.2.3",
     "colorjs.io": "^0.5.2",

package/runtime/navigator/drawer.navigator.js

@@ -23,6 +23,7 @@ class AppDrawerNavigator extends React.Component {
           drawerType: this.props.type,
           headerShown: false,
           overlayColor: ThemeVariables.INSTANCE.leftPanelOverlayColor,
+          swipeEnabled: !this.props.hide,
           gestureHandlerProps: {
             enabled: !this.props.hide
           },

package/runtime/navigator/drawer.navigator.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","createDrawerNavigator","getDrawerStatusFromState","ThemeVariables","Drawer","AppDrawerNavigator","Component","constructor","props","render","createElement","Navigator","initialRouteName","drawerContent","content","screenOptions","navigation","widthStyle","drawerWidth","getState","width","maxWidth","drawerType","type","headerShown","overlayColor","INSTANCE","leftPanelOverlayColor","gestureHandlerProps","enabled","hide","drawerStyle","backgroundColor","pageContentBgColor","Screen","name","_props","rootComponent"],"sources":["drawer.navigator.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { createDrawerNavigator, getDrawerStatusFromState } from '@react-navigation/drawer';\nimport ThemeVariables from '@wavemaker/app-rn-runtime/styles/theme.variables';\nconst Drawer = createDrawerNavigator();\n\ninterface AppDrawerNavigatorProps {\n  content: (props: any) => ReactNode;\n  hide: boolean,\n  drawerWidth: any;\n  type: any;\n  rootComponent: React.ReactNode;\n}\n\nclass AppDrawerNavigator extends React.Component<AppDrawerNavigatorProps, any, any> {\n\n  constructor(props: AppDrawerNavigatorProps) {\n    super(props);\n  }\n\n  render(){\n    return (<Drawer.Navigator\n      initialRouteName=\"pages\"\n      drawerContent={this.props.content}\n      // useLegacyImplementation={false}\n      screenOptions={({navigation})=> {\n        const widthStyle = (this.props.drawerWidth && getDrawerStatusFromState(navigation.getState()) === 'open' ? {width: this.props.drawerWidth, maxWidth: null} : {})\n        return {\n          drawerType: this.props.type,\n          headerShown: false,\n          overlayColor: ThemeVariables.INSTANCE.leftPanelOverlayColor,\n          gestureHandlerProps: { enabled: !this.props.hide },\n          drawerStyle: { backgroundColor:  ThemeVariables.INSTANCE.pageContentBgColor, ...widthStyle}}\n      }}>\n      <Drawer.Screen name=\"pages\">\n        {(_props) => this.props.rootComponent}\n      </Drawer.Screen>\n    </Drawer.Navigator>);\n  }\n}\n\nexport default AppDrawerNavigator;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAqB,OAAO;AACxC,SAASC,qBAAqB,EAAEC,wBAAwB,QAAQ,0BAA0B;AAC1F,OAAOC,cAAc,MAAM,kDAAkD;AAC7E,MAAMC,MAAM,GAAGH,qBAAqB,CAAC,CAAC;AAUtC,MAAMI,kBAAkB,SAASL,KAAK,CAACM,SAAS,CAAoC;EAElFC,WAAWA,CAACC,KAA8B,EAAE;IAC1C,KAAK,CAACA,KAAK,CAAC;EACd;EAEAC,MAAMA,CAAA,EAAE;IACN,oBAAQT,KAAA,CAAAU,aAAA,CAACN,MAAM,CAACO,SAAS;MACvBC,gBAAgB,EAAC,OAAO;MACxBC,aAAa,EAAE,IAAI,CAACL,KAAK,CAACM;MAC1B;MAAA;MACAC,aAAa,EAAEA,CAAC;QAACC;MAAU,CAAC,KAAI;QAC9B,MAAMC,UAAU,GAAI,IAAI,CAACT,KAAK,CAACU,WAAW,IAAIhB,wBAAwB,CAACc,UAAU,CAACG,QAAQ,CAAC,CAAC,CAAC,KAAK,MAAM,GAAG;UAACC,KAAK,EAAE,IAAI,CAACZ,KAAK,CAACU,WAAW;UAAEG,QAAQ,EAAE;QAAI,CAAC,GAAG,CAAC,CAAE;QAChK,OAAO;UACLC,UAAU,EAAE,IAAI,CAACd,KAAK,CAACe,IAAI;UAC3BC,WAAW,EAAE,KAAK;UAClBC,YAAY,EAAEtB,cAAc,CAACuB,QAAQ,CAACC,qBAAqB;UAC3DC,mBAAmB,EAAE;YAAEC,OAAO,EAAE,CAAC,IAAI,CAACrB,KAAK,CAACsB;UAAK,CAAC;UAClDC,WAAW,EAAE;YAAEC,eAAe,EAAG7B,cAAc,CAACuB,QAAQ,CAACO,kBAAkB;YAAE,GAAGhB;UAAU;QAAC,CAAC;MAChG;IAAE,gBACFjB,KAAA,CAAAU,aAAA,CAACN,MAAM,CAAC8B,MAAM;MAACC,IAAI,EAAC;IAAO,GACvBC,MAAM,IAAK,IAAI,CAAC5B,KAAK,CAAC6B,aACX,CACC,CAAC;EACrB;AACF;AAEA,eAAehC,kBAAkB","ignoreList":[]}
+{"version":3,"names":["React","createDrawerNavigator","getDrawerStatusFromState","ThemeVariables","Drawer","AppDrawerNavigator","Component","constructor","props","render","createElement","Navigator","initialRouteName","drawerContent","content","screenOptions","navigation","widthStyle","drawerWidth","getState","width","maxWidth","drawerType","type","headerShown","overlayColor","INSTANCE","leftPanelOverlayColor","swipeEnabled","hide","gestureHandlerProps","enabled","drawerStyle","backgroundColor","pageContentBgColor","Screen","name","_props","rootComponent"],"sources":["drawer.navigator.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { createDrawerNavigator, getDrawerStatusFromState } from '@react-navigation/drawer';\nimport ThemeVariables from '@wavemaker/app-rn-runtime/styles/theme.variables';\nconst Drawer = createDrawerNavigator();\n\ninterface AppDrawerNavigatorProps {\n  content: (props: any) => ReactNode;\n  hide: boolean,\n  drawerWidth: any;\n  type: any;\n  rootComponent: React.ReactNode;\n}\n\nclass AppDrawerNavigator extends React.Component<AppDrawerNavigatorProps, any, any> {\n\n  constructor(props: AppDrawerNavigatorProps) {\n    super(props);\n  }\n\n  render(){\n    return (<Drawer.Navigator\n      initialRouteName=\"pages\"\n      drawerContent={this.props.content}\n      // useLegacyImplementation={false}\n      screenOptions={({navigation})=> {\n        const widthStyle = (this.props.drawerWidth && getDrawerStatusFromState(navigation.getState()) === 'open' ? {width: this.props.drawerWidth, maxWidth: null} : {})\n        return {\n          drawerType: this.props.type,\n          headerShown: false,\n          overlayColor: ThemeVariables.INSTANCE.leftPanelOverlayColor,\n          swipeEnabled: !this.props.hide,\n          gestureHandlerProps: { enabled: !this.props.hide },\n          drawerStyle: { backgroundColor:  ThemeVariables.INSTANCE.pageContentBgColor, ...widthStyle}}\n      }}>\n      <Drawer.Screen name=\"pages\">\n        {(_props) => this.props.rootComponent}\n      </Drawer.Screen>\n    </Drawer.Navigator>);\n  }\n}\n\nexport default AppDrawerNavigator;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAqB,OAAO;AACxC,SAASC,qBAAqB,EAAEC,wBAAwB,QAAQ,0BAA0B;AAC1F,OAAOC,cAAc,MAAM,kDAAkD;AAC7E,MAAMC,MAAM,GAAGH,qBAAqB,CAAC,CAAC;AAUtC,MAAMI,kBAAkB,SAASL,KAAK,CAACM,SAAS,CAAoC;EAElFC,WAAWA,CAACC,KAA8B,EAAE;IAC1C,KAAK,CAACA,KAAK,CAAC;EACd;EAEAC,MAAMA,CAAA,EAAE;IACN,oBAAQT,KAAA,CAAAU,aAAA,CAACN,MAAM,CAACO,SAAS;MACvBC,gBAAgB,EAAC,OAAO;MACxBC,aAAa,EAAE,IAAI,CAACL,KAAK,CAACM;MAC1B;MAAA;MACAC,aAAa,EAAEA,CAAC;QAACC;MAAU,CAAC,KAAI;QAC9B,MAAMC,UAAU,GAAI,IAAI,CAACT,KAAK,CAACU,WAAW,IAAIhB,wBAAwB,CAACc,UAAU,CAACG,QAAQ,CAAC,CAAC,CAAC,KAAK,MAAM,GAAG;UAACC,KAAK,EAAE,IAAI,CAACZ,KAAK,CAACU,WAAW;UAAEG,QAAQ,EAAE;QAAI,CAAC,GAAG,CAAC,CAAE;QAChK,OAAO;UACLC,UAAU,EAAE,IAAI,CAACd,KAAK,CAACe,IAAI;UAC3BC,WAAW,EAAE,KAAK;UAClBC,YAAY,EAAEtB,cAAc,CAACuB,QAAQ,CAACC,qBAAqB;UAC3DC,YAAY,EAAE,CAAC,IAAI,CAACpB,KAAK,CAACqB,IAAI;UAC9BC,mBAAmB,EAAE;YAAEC,OAAO,EAAE,CAAC,IAAI,CAACvB,KAAK,CAACqB;UAAK,CAAC;UAClDG,WAAW,EAAE;YAAEC,eAAe,EAAG9B,cAAc,CAACuB,QAAQ,CAACQ,kBAAkB;YAAE,GAAGjB;UAAU;QAAC,CAAC;MAChG;IAAE,gBACFjB,KAAA,CAAAU,aAAA,CAACN,MAAM,CAAC+B,MAAM;MAACC,IAAI,EAAC;IAAO,GACvBC,MAAM,IAAK,IAAI,CAAC7B,KAAK,CAAC8B,aACX,CACC,CAAC;EACrB;AACF;AAEA,eAAejC,kBAAkB","ignoreList":[]}

package/runtime/navigator/stack.navigator.js

@@ -2,7 +2,7 @@ function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import React from 'react';
-import { View } from 'react-native';
+import { Platform, View } from 'react-native';
 import { createStackNavigator } from '@react-navigation/stack';
 import ThemeVariables from '@wavemaker/app-rn-runtime/styles/theme.variables';
 import ErrorBoundary from '@wavemaker/app-rn-runtime/core/error-boundary.component';
@@ -57,7 +57,19 @@ const getPageId = (pageName, pageParams) => {
 const AppStackNavigator = props => {
   const appConfig = injector.get('APP_CONFIG');
   const disablePageAnimation = (appConfig === null || appConfig === void 0 ? void 0 : appConfig.disableNavigationAnimation) || false;
+  /*
+  Setting detachInactiveScreens={false} for Android.
+  With Fabric + React Navigation, navigating to an existing stack screen
+  can cause a view reattachment conflict, throwing errors like:
+  - removeViewAt tried to remove a React View that was actually reused.
+  - addViewAt: cannot insert view [1944] into parent [666]: View already has a parent: [-1]
+   This breaks the touch responder system (scroll works but touch events stop).
+  refer : https://github.com/facebook/react-native/blob/7f1a1e6c93ec1acd34b5756656210ccea97fb4a6/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/fabric/mounting/SurfaceMountingManager.kt#L363
+  Until fixed in future React Native versions, disabling screen detaching is the workaround.
+  */
+  const detachInactiveScreens = Platform.OS === 'android' && (appConfig === null || appConfig === void 0 ? void 0 : appConfig.detachInactiveScreens) === false ? false : true;
   return /*#__PURE__*/React.createElement(Stack.Navigator, {
+    detachInactiveScreens: detachInactiveScreens,
     initialRouteName: props.landingPage
   }, props.pages.map(p => {
     pages[p.name] = p;

package/runtime/navigator/stack.navigator.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","View","createStackNavigator","ThemeVariables","ErrorBoundary","injector","Stack","pages","Screen","Component","constructor","props","_defineProperty","state","renew","page","createPage","navigation","cleanUp","push","addListener","setState","createElement","route","name","component","destroyMe","setTimeout","componentWillUnmount","forEach","fn","render","getPageId","pageName","pageParams","pageParamsStr","Object","keys","sort","map","k","join","AppStackNavigator","appConfig","get","disablePageAnimation","disableNavigationAnimation","Navigator","initialRouteName","landingPage","p","key","getId","params","options","animation","headerShown","cardStyle","backgroundColor","INSTANCE","pageContentBgColor"],"sources":["stack.navigator.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { createStackNavigator } from '@react-navigation/stack';\nimport ThemeVariables from '@wavemaker/app-rn-runtime/styles/theme.variables';\nimport ErrorBoundary from '@wavemaker/app-rn-runtime/core/error-boundary.component';\nimport AppConfig from '@wavemaker/app-rn-runtime/core/AppConfig';\nimport injector from '@wavemaker/app-rn-runtime/core/injector';\n\nconst Stack = createStackNavigator();\n\ninterface AppStackNavigatorProps {\n  pages: any[];\n  landingPage: string; \n}\n\nconst pages = {} as any;\n\nclass Screen extends React.Component {\n\n  private cleanUp = [] as Function[];\n\n  constructor(props: any) {\n    super(props);\n    this.state = {\n      renew: false,\n      page: this.createPage()\n    };\n    const navigation = (this.props as any).navigation as any;\n    this.cleanUp.push(navigation.addListener('focus', () => {\n      const state = (this.state as any);\n      if (state.renew) {\n        state.page = this.createPage();\n        this.setState(() => ({\n          renew: false,\n          page: state.page\n        }));\n      }\n    }));\n  }\n\n  private createPage() {\n    const props = this.props as any;\n    return (\n      <ErrorBoundary>\n        {React.createElement(pages[props.route.name].component, {...props, destroyMe: () => {\n          setTimeout(() => {\n            this.setState(() => ({renew: true, page: null}));\n          }, 100);\n        }})}\n      </ErrorBoundary>\n    );\n  }\n\n  componentWillUnmount() {\n    this.cleanUp.forEach(fn => fn && fn());\n  }\n\n  render() {\n    return (this.state as any).page || (<View/>);\n  }\n}\n\nconst getPageId = (pageName: string, pageParams: any) => {\n  const pageParamsStr = pageParams ? Object.keys(pageParams)\n    .sort()\n    .map((k: string) => `${k}=${pageParams[k]}`)\n    .join('&') : '';\n  return `${pageName}?${pageParamsStr}`;\n}\n\nconst AppStackNavigator = (props: AppStackNavigatorProps) => {\n  const appConfig = injector.get<AppConfig>('APP_CONFIG');\n  const disablePageAnimation = appConfig?.disableNavigationAnimation || false\n  return (<Stack.Navigator initialRouteName={props.landingPage}>\n    {props.pages.map(p => {\n      pages[p.name] = p;\n      return (\n        <Stack.Screen key={p.name}\n          \n          name={p.name}\n          component={Screen}\n          getId={({params}) => getPageId(p.name, params)}\n          options={{\n             ...(disablePageAnimation && { animation: 'none' }),\n            headerShown: false,\n            cardStyle: {\n              backgroundColor: ThemeVariables.INSTANCE.pageContentBgColor\n            }\n          }}\n        />);\n      })}\n  </Stack.Navigator>);\n};\n\nexport default AppStackNavigator;"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","Platform","View","createStackNavigator","ThemeVariables","ErrorBoundary","injector","Stack","pages","Screen","Component","constructor","props","_defineProperty","state","renew","page","createPage","navigation","cleanUp","push","addListener","setState","createElement","route","name","component","destroyMe","setTimeout","componentWillUnmount","forEach","fn","render","getPageId","pageName","pageParams","pageParamsStr","Object","keys","sort","map","k","join","AppStackNavigator","appConfig","get","disablePageAnimation","disableNavigationAnimation","detachInactiveScreens","OS","Navigator","initialRouteName","landingPage","p","key","getId","params","options","animation","headerShown","cardStyle","backgroundColor","INSTANCE","pageContentBgColor"],"sources":["stack.navigator.tsx"],"sourcesContent":["import React from 'react';\nimport { Platform, View } from 'react-native';\nimport { createStackNavigator } from '@react-navigation/stack';\nimport ThemeVariables from '@wavemaker/app-rn-runtime/styles/theme.variables';\nimport ErrorBoundary from '@wavemaker/app-rn-runtime/core/error-boundary.component';\nimport AppConfig from '@wavemaker/app-rn-runtime/core/AppConfig';\nimport injector from '@wavemaker/app-rn-runtime/core/injector';\n\n\nconst Stack = createStackNavigator();\n\ninterface AppStackNavigatorProps {\n  pages: any[];\n  landingPage: string; \n}\n\nconst pages = {} as any;\n\nclass Screen extends React.Component {\n\n  private cleanUp = [] as Function[];\n\n  constructor(props: any) {\n    super(props);\n    this.state = {\n      renew: false,\n      page: this.createPage()\n    };\n    const navigation = (this.props as any).navigation as any;\n    this.cleanUp.push(navigation.addListener('focus', () => {\n      const state = (this.state as any);\n      if (state.renew) {\n        state.page = this.createPage();\n        this.setState(() => ({\n          renew: false,\n          page: state.page\n        }));\n      }\n    }));\n  }\n\n  private createPage() {\n    const props = this.props as any;\n    return (\n      <ErrorBoundary>\n        {React.createElement(pages[props.route.name].component, {...props, destroyMe: () => {\n          setTimeout(() => {\n            this.setState(() => ({renew: true, page: null}));\n          }, 100);\n        }})}\n      </ErrorBoundary>\n    );\n  }\n\n  componentWillUnmount() {\n    this.cleanUp.forEach(fn => fn && fn());\n  }\n\n  render() {\n    return (this.state as any).page || (<View/>);\n  }\n}\n\nconst getPageId = (pageName: string, pageParams: any) => {\n  const pageParamsStr = pageParams ? Object.keys(pageParams)\n    .sort()\n    .map((k: string) => `${k}=${pageParams[k]}`)\n    .join('&') : '';\n  return `${pageName}?${pageParamsStr}`;\n}\n\nconst AppStackNavigator = (props: AppStackNavigatorProps) => {\n  const appConfig = injector.get<AppConfig>('APP_CONFIG');\n  const disablePageAnimation = appConfig?.disableNavigationAnimation || false\n  /*\n  Setting detachInactiveScreens={false} for Android.\n  With Fabric + React Navigation, navigating to an existing stack screen\n  can cause a view reattachment conflict, throwing errors like:\n  - removeViewAt tried to remove a React View that was actually reused.\n  - addViewAt: cannot insert view [1944] into parent [666]: View already has a parent: [-1]\n\n  This breaks the touch responder system (scroll works but touch events stop).\n  refer : https://github.com/facebook/react-native/blob/7f1a1e6c93ec1acd34b5756656210ccea97fb4a6/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/fabric/mounting/SurfaceMountingManager.kt#L363\n  Until fixed in future React Native versions, disabling screen detaching is the workaround.\n  */\n  const detachInactiveScreens = Platform.OS === 'android' && appConfig?.detachInactiveScreens === false ? false : true;\n\n  return (<Stack.Navigator detachInactiveScreens={detachInactiveScreens} initialRouteName={props.landingPage}>\n    {props.pages.map(p => {\n      pages[p.name] = p;\n      return (\n        <Stack.Screen key={p.name}\n          \n          name={p.name}\n          component={Screen}\n          getId={({params}) => getPageId(p.name, params)}\n          options={{\n             ...(disablePageAnimation && { animation: 'none' }),\n            headerShown: false,\n            cardStyle: {\n              backgroundColor: ThemeVariables.INSTANCE.pageContentBgColor\n            }\n          }}\n        />);\n      })}\n  </Stack.Navigator>);\n};\n\nexport default AppStackNavigator;"],"mappings":"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","ignoreList":[]}

package/runtime/services/device/scan-service.js

@@ -56,33 +56,7 @@ const styles = StyleSheet.create({
     backgroundColor: opacity
   }
 });
-const BarCodeType = [{
-  0: 'aztec'
-}, {
-  1: 'ean13'
-}, {
-  2: 'ean8'
-}, {
-  3: 'qr'
-}, {
-  4: 'pdf417'
-}, {
-  5: 'upc_e'
-}, {
-  6: 'datamatrix'
-}, {
-  7: 'code39'
-}, {
-  8: 'code93'
-}, {
-  9: 'itf14'
-}, {
-  10: 'codabar'
-}, {
-  11: 'code128'
-}, {
-  12: 'upc_a'
-}];
+const BARCODE_TYPES = ['aztec', 'ean13', 'ean8', 'qr', 'pdf417', 'upc_e', 'datamatrix', 'code39', 'code93', 'itf14', 'codabar', 'code128', 'upc_a'];
 export class ScanService {
   constructor(displayManager) {
     this.displayManager = displayManager;
@@ -105,14 +79,19 @@ export class ScanService {
     const format = (params === null || params === void 0 ? void 0 : params.barcodeFormat) || 'ALL';
     const barcodeFormat = Platform.OS === 'ios' ? undefined : barcodeFormatOptions[format];
     const CameraView = params === null || params === void 0 || (_params$scanPluginSer = params.scanPluginService) === null || _params$scanPluginSer === void 0 ? void 0 : _params$scanPluginSer.CameraView;
+    /**
+     * 'ALL' means any barcode in WaveMaker; the camera SDK does not accept the string 'ALL' as a barcode type.
+     * Omit scanner settings so the SDK scans every supported format.
+     */
+    const scannerBarcodeSettings = barcodeFormat && barcodeFormat !== 'ALL' ? {
+      barcodeTypes: [barcodeFormat]
+    } : undefined;
     return new Promise((resolve, reject) => {
       var _params$permissionSer;
       (params === null || params === void 0 || (_params$permissionSer = params.permissionService) === null || _params$permissionSer === void 0 ? void 0 : _params$permissionSer.requestPermissions) && params.permissionService.requestPermissions('camera').then(() => {
         const destroy = this.displayManager.show({
           content: /*#__PURE__*/React.createElement(CameraView, {
-            barcodeScannerSettings: barcodeFormat ? {
-              barcodeTypes: [BarCodeType[barcodeFormat]]
-            } : undefined,
+            barcodeScannerSettings: scannerBarcodeSettings,
             onBarcodeScanned: result => {
               destroy.call(this.displayManager);
               resolve(result);
@@ -144,11 +123,10 @@ export class ScanService {
         });
       }, reject);
     }).then(response => {
-      let format;
+      let format = '';
       if (response.type) {
-        const values = Object.values(BarCodeType);
-        const index = values.indexOf(response.type);
-        format = index > -1 ? Object.keys(BarCodeType)[index] : '';
+        const index = BARCODE_TYPES.indexOf(response.type);
+        format = index > -1 ? String(index) : '';
       }
       return Promise.resolve({
         text: response.data,

package/runtime/services/device/scan-service.js.map

@@ -1 +1 @@
-{"version":3,"names":["Ionicons","Platform","StyleSheet","TouchableOpacity","View","React","appDisplayManagerService","barcodeFormatOptions","opacity","styles","create","container","flex","flexDirection","closeWrapper","justifyContent","alignItems","paddingBottom","topWrapper","backgroundColor","centerWrapper","leftWrapper","focused","rightWrapper","bottomWrapper","BarCodeType","ScanService","constructor","displayManager","getTestProps","suffix","id","OS","accessibilityLabel","testID","accessible","scanBarcode","params","_params$scanPluginSer","format","barcodeFormat","undefined","CameraView","scanPluginService","Promise","resolve","reject","_params$permissionSer","permissionService","requestPermissions","then","destroy","show","content","createElement","barcodeScannerSettings","barcodeTypes","onBarcodeScanned","result","call","style","absoluteFillObject","_extends","onPress","name","size","color","response","type","values","Object","index","indexOf","keys","text","data","cancelled","scanService"],"sources":["scan-service.tsx"],"sourcesContent":["import { Ionicons } from '@expo/vector-icons';\nimport { Platform, StyleSheet, TouchableOpacity, View } from 'react-native';\nimport React from 'react';\nimport { ScanInput, ScanOutput } from '@wavemaker/app-rn-runtime/variables/device/scan/scan.operation';\nimport { DisplayManager } from '@wavemaker/app-rn-runtime/core/display.manager';\nimport appDisplayManagerService from '@wavemaker/app-rn-runtime/runtime/services/app-display-manager.service';\n\ninterface objectMap {\n  [key: string]: string\n}\n\nconst barcodeFormatOptions: objectMap = {\n  'ALL': 'ALL',\n  'CODABAR': 'codabar',\n  'CODE_39': 'code39',\n  'CODE_93': 'code93',\n  'CODE_128': 'code128',\n  'DATA_MATRIX': 'datamatrix',\n  'EAN_8': 'ean8',\n  'EAN_13': 'ean13',\n  'ITF': 'itf14',\n  'PDF_417': 'pdf417',\n  'QR_CODE': 'qr',\n  'RSS14': 'rss14',\n  'RSS_EXPANDED': 'rssexpanded',\n  'UPC_E': 'upc_e',\n  'UPC_A': 'upc_a'\n};\nconst opacity = 'rgba(0, 0, 0, 0.6)';\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n    flexDirection: 'column'\n  },\n  closeWrapper: {\n    flex: 1,\n    justifyContent: 'flex-end',\n    alignItems: 'center',\n    paddingBottom: 32\n  },\n  topWrapper: {\n    flex: 2,\n    backgroundColor: opacity\n  },\n  centerWrapper: {\n    flex: 2,\n    flexDirection: 'row'\n  },\n  leftWrapper: {\n    flex: 2,\n    backgroundColor: opacity\n  },\n  focused: {\n    flex: 10\n  },\n  rightWrapper: {\n    flex: 2,\n    backgroundColor: opacity\n  },\n  bottomWrapper: {\n    flex: 2,\n    backgroundColor: opacity\n  },\n});\n\nconst BarCodeType: any = [\n  { 0: 'aztec' },\n  { 1: 'ean13' },\n  { 2: 'ean8' },\n  { 3: 'qr' },\n  { 4: 'pdf417' },\n  { 5: 'upc_e' },\n  { 6: 'datamatrix' },\n  { 7: 'code39' },\n  { 8: 'code93' },\n  { 9: 'itf14' },\n  { 10: 'codabar' },\n  { 11: 'code128' },\n  { 12: 'upc_a' }\n];\n\n\nexport class ScanService {\n\n  constructor(private displayManager: DisplayManager) {}\n\n  getTestProps(suffix: string) {\n    const id = \"scan\" + (suffix ? '_' + suffix  : '');\n    if (Platform.OS === 'android' || Platform.OS === 'web') {\n      return {\n          accessibilityLabel: id,\n          testID: id\n      };\n    }\n    return {\n        accessible: false,\n        testID: id\n    };\n  }\n\n  public scanBarcode(params: ScanInput): Promise<ScanOutput> {\n    const format = params?.barcodeFormat || 'ALL';\n    const barcodeFormat: string | undefined = Platform.OS === 'ios' ? undefined : barcodeFormatOptions[format];\n    const CameraView = params?.scanPluginService?.CameraView;\n    return new Promise((resolve, reject) => {\n      params?.permissionService?.requestPermissions && params.permissionService.requestPermissions('camera').then(() => {\n        const destroy = this.displayManager.show({\n          content: (<CameraView\n            barcodeScannerSettings={barcodeFormat ? {\n              barcodeTypes: [BarCodeType[barcodeFormat]],\n            }: undefined}\n            onBarcodeScanned={(result: any) => {\n              destroy.call(this.displayManager);\n              resolve(result);\n            }}\n            style={StyleSheet.absoluteFillObject}\n          >\n            <View style={styles.topWrapper}>\n            </View>\n            <View style={styles.centerWrapper}>\n              <View style={styles.leftWrapper}/>\n              <View style={styles.focused}/>\n              <View style={styles.rightWrapper}/>\n            </View>\n            <View style={styles.bottomWrapper}>\n              \n              <View style={styles.closeWrapper}>\n                  <TouchableOpacity\n                      {... this.getTestProps('close_button')}\n                      onPress={() => {\n                        destroy.call(this.displayManager);\n                      }}>\n                      <Ionicons name='close-circle' size={48} color='white' />\n                  </TouchableOpacity>\n              </View>\n            </View>\n          </CameraView>)\n        });\n      }, reject)\n    }).then((response: any) => {\n      let format;\n      if (response.type) {\n        const values = Object.values(BarCodeType);\n        const index = values.indexOf(response.type);\n        format = index > -1 ? Object.keys(BarCodeType)[index] : '';\n      }\n      return Promise.resolve({\n        text: response.data,\n        format : format || response.type,\n        cancelled : false\n      });\n    });\n  }\n}\nconst scanService = new ScanService(appDisplayManagerService);\nexport default scanService;"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["Ionicons","Platform","StyleSheet","TouchableOpacity","View","React","appDisplayManagerService","barcodeFormatOptions","opacity","styles","create","container","flex","flexDirection","closeWrapper","justifyContent","alignItems","paddingBottom","topWrapper","backgroundColor","centerWrapper","leftWrapper","focused","rightWrapper","bottomWrapper","BARCODE_TYPES","ScanService","constructor","displayManager","getTestProps","suffix","id","OS","accessibilityLabel","testID","accessible","scanBarcode","params","_params$scanPluginSer","format","barcodeFormat","undefined","CameraView","scanPluginService","scannerBarcodeSettings","barcodeTypes","Promise","resolve","reject","_params$permissionSer","permissionService","requestPermissions","then","destroy","show","content","createElement","barcodeScannerSettings","onBarcodeScanned","result","call","style","absoluteFillObject","_extends","onPress","name","size","color","response","type","index","indexOf","String","text","data","cancelled","scanService"],"sources":["scan-service.tsx"],"sourcesContent":["import { Ionicons } from '@expo/vector-icons';\nimport { Platform, StyleSheet, TouchableOpacity, View } from 'react-native';\nimport React from 'react';\nimport { ScanInput, ScanOutput } from '@wavemaker/app-rn-runtime/variables/device/scan/scan.operation';\nimport { DisplayManager } from '@wavemaker/app-rn-runtime/core/display.manager';\nimport appDisplayManagerService from '@wavemaker/app-rn-runtime/runtime/services/app-display-manager.service';\n\ninterface objectMap {\n  [key: string]: string\n}\n\nconst barcodeFormatOptions: objectMap = {\n  'ALL': 'ALL',\n  'CODABAR': 'codabar',\n  'CODE_39': 'code39',\n  'CODE_93': 'code93',\n  'CODE_128': 'code128',\n  'DATA_MATRIX': 'datamatrix',\n  'EAN_8': 'ean8',\n  'EAN_13': 'ean13',\n  'ITF': 'itf14',\n  'PDF_417': 'pdf417',\n  'QR_CODE': 'qr',\n  'RSS14': 'rss14',\n  'RSS_EXPANDED': 'rssexpanded',\n  'UPC_E': 'upc_e',\n  'UPC_A': 'upc_a'\n};\nconst opacity = 'rgba(0, 0, 0, 0.6)';\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n    flexDirection: 'column'\n  },\n  closeWrapper: {\n    flex: 1,\n    justifyContent: 'flex-end',\n    alignItems: 'center',\n    paddingBottom: 32\n  },\n  topWrapper: {\n    flex: 2,\n    backgroundColor: opacity\n  },\n  centerWrapper: {\n    flex: 2,\n    flexDirection: 'row'\n  },\n  leftWrapper: {\n    flex: 2,\n    backgroundColor: opacity\n  },\n  focused: {\n    flex: 10\n  },\n  rightWrapper: {\n    flex: 2,\n    backgroundColor: opacity\n  },\n  bottomWrapper: {\n    flex: 2,\n    backgroundColor: opacity\n  },\n});\n\nconst BARCODE_TYPES = [\n  'aztec',\n  'ean13',\n  'ean8',\n  'qr',\n  'pdf417',\n  'upc_e',\n  'datamatrix',\n  'code39',\n  'code93',\n  'itf14',\n  'codabar',\n  'code128',\n  'upc_a',\n] as const;\n\n\nexport class ScanService {\n\n  constructor(private displayManager: DisplayManager) {}\n\n  getTestProps(suffix: string) {\n    const id = \"scan\" + (suffix ? '_' + suffix  : '');\n    if (Platform.OS === 'android' || Platform.OS === 'web') {\n      return {\n          accessibilityLabel: id,\n          testID: id\n      };\n    }\n    return {\n        accessible: false,\n        testID: id\n    };\n  }\n\n  public scanBarcode(params: ScanInput): Promise<ScanOutput> {\n    const format = params?.barcodeFormat || 'ALL';\n    const barcodeFormat: string | undefined = Platform.OS === 'ios' ? undefined : barcodeFormatOptions[format];\n    const CameraView = params?.scanPluginService?.CameraView;\n    /**\n     * 'ALL' means any barcode in WaveMaker; the camera SDK does not accept the string 'ALL' as a barcode type.\n     * Omit scanner settings so the SDK scans every supported format.\n     */\n    const scannerBarcodeSettings =\n      barcodeFormat && barcodeFormat !== 'ALL'\n        ? { barcodeTypes: [barcodeFormat] as string[] }\n        : undefined;\n    return new Promise((resolve, reject) => {\n      params?.permissionService?.requestPermissions && params.permissionService.requestPermissions('camera').then(() => {\n        const destroy = this.displayManager.show({\n          content: (<CameraView\n            barcodeScannerSettings={scannerBarcodeSettings}\n            onBarcodeScanned={(result: any) => {\n              destroy.call(this.displayManager);\n              resolve(result);\n            }}\n            style={StyleSheet.absoluteFillObject}\n          >\n            <View style={styles.topWrapper}>\n            </View>\n            <View style={styles.centerWrapper}>\n              <View style={styles.leftWrapper}/>\n              <View style={styles.focused}/>\n              <View style={styles.rightWrapper}/>\n            </View>\n            <View style={styles.bottomWrapper}>\n              \n              <View style={styles.closeWrapper}>\n                  <TouchableOpacity\n                      {... this.getTestProps('close_button')}\n                      onPress={() => {\n                        destroy.call(this.displayManager);\n                      }}>\n                      <Ionicons name='close-circle' size={48} color='white' />\n                  </TouchableOpacity>\n              </View>\n            </View>\n          </CameraView>)\n        });\n      }, reject)\n    }).then((response: any) => {\n      let format = '';\n      if (response.type) {\n        const index = BARCODE_TYPES.indexOf(response.type as (typeof BARCODE_TYPES)[number]);\n        format = index > -1 ? String(index) : '';\n      }\n      return Promise.resolve({\n        text: response.data,\n        format : format || response.type,\n        cancelled : false\n      });\n    });\n  }\n}\nconst scanService = new ScanService(appDisplayManagerService);\nexport default scanService;"],"mappings":"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","ignoreList":[]}

package/styles/theme.js

@@ -268,8 +268,25 @@ export class Theme {
         style['opacity'] = percentage / 100;
       }
     }
+    const isViewportUnit = value => value.endsWith('vw') || value.endsWith('vh');
+    const convertViewportUnitToPx = value => {
+      if (value.endsWith('vw')) {
+        const screenWidth = Dimensions.get('window').width;
+        const stylePropertyValue = value.replace('vw', '');
+        return Number(stylePropertyValue) / 100 * screenWidth;
+      }
+      if (value.endsWith('vh')) {
+        const screenHeight = Dimensions.get('window').height;
+        const stylePropertyValue = value.replace('vh', '');
+        return Number(stylePropertyValue) / 100 * screenHeight;
+      }
+      return value;
+    };
     const processStyleValue = value => {
       if (typeof value === 'string') {
+        if (isViewportUnit(value)) {
+          return convertViewportUnitToPx(value);
+        }
         const num = parseFloat(value);
         return isNaN(num) ? value : num;
       }
@@ -456,17 +473,10 @@ export class Theme {
     if (!isNil(style['color']) && style['color'] === 'transparent') {
       style['color'] = 'rgba(255, 255, 255, 0)';
     }
-    let screenWidth = Dimensions.get('window').width;
-    let screenHeight = Dimensions.get('window').height;
     Object.keys(style).forEach((k, i) => {
-      let stylePropertyValue = style[k];
-      if (typeof stylePropertyValue === 'string' && stylePropertyValue.endsWith('vw')) {
-        stylePropertyValue = stylePropertyValue.replace('vw', '');
-        style[k] = Number(stylePropertyValue) / 100 * screenWidth;
-      }
-      if (typeof stylePropertyValue === 'string' && stylePropertyValue.endsWith('vh')) {
-        stylePropertyValue = stylePropertyValue.replace('vh', '');
-        style[k] = Number(stylePropertyValue) / 100 * screenHeight;
+      const stylePropertyValue = style[k];
+      if (typeof stylePropertyValue === 'string' && isViewportUnit(stylePropertyValue)) {
+        style[k] = convertViewportUnitToPx(stylePropertyValue);
       }
     });
     return style;