@applicaster/zapp-react-native-ui-components 16.0.0-rc.23 → 16.0.0-rc.25

package/Components/Screen/index.tsx

@@ -18,10 +18,13 @@ import {
   useScreenData,
 } from "@applicaster/zapp-react-native-utils/reactHooks";
 import { getNavigationPluginModule } from "@applicaster/zapp-react-native-app/App/Layout/layoutHelpers";
+import {
+  isValidColor,
+  isTransparentColor,
+} from "@applicaster/zapp-react-native-utils/colorUtils";
 
 import { RouteManager } from "../RouteManager";
 import { useScreenConfiguration } from "../River/useScreenConfiguration";
-import { isValidColor } from "./utils";
 import { useWaitForValidOrientation } from "./hooks";
 
 const screenStyles = {
@@ -82,11 +85,10 @@ export function Screen(_props: Props) {
   const style = React.useMemo(
     () => ({
       ...screenStyles,
-      // FIXME: add logic to use backgroundColor if it valid_color and non-transparent, otherwise use theme.app_background_color.
-      // Current implementation treats "red" color as invalid color.
-      backgroundColor: isValidColor(backgroundColor)
-        ? backgroundColor
-        : theme.app_background_color,
+      backgroundColor:
+        isValidColor(backgroundColor) && !isTransparentColor(backgroundColor)
+          ? backgroundColor
+          : theme.app_background_color,
     }),
     [theme.app_background_color, backgroundColor]
   );

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-ui-components",
-  "version": "16.0.0-rc.23",
+  "version": "16.0.0-rc.25",
   "description": "Applicaster Zapp React Native ui components for the Quick Brick App",
   "main": "index.js",
   "types": "index.d.ts",
@@ -28,10 +28,10 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "16.0.0-rc.23",
-    "@applicaster/zapp-react-native-bridge": "16.0.0-rc.23",
-    "@applicaster/zapp-react-native-redux": "16.0.0-rc.23",
-    "@applicaster/zapp-react-native-utils": "16.0.0-rc.23",
+    "@applicaster/applicaster-types": "16.0.0-rc.25",
+    "@applicaster/zapp-react-native-bridge": "16.0.0-rc.25",
+    "@applicaster/zapp-react-native-redux": "16.0.0-rc.25",
+    "@applicaster/zapp-react-native-utils": "16.0.0-rc.25",
     "fast-json-stable-stringify": "^2.1.0",
     "promise": "^8.3.0",
     "url": "^0.11.0",

package/Components/Screen/utils.ts

@@ -1,16 +0,0 @@
-import { map, split, replace, compose, trim } from "ramda";
-
-function colorIsNotTransparent(color) {
-  const layers = compose(
-    map(trim),
-    split(","),
-    replace(")", ""),
-    replace("rgba(", "")
-  )(color);
-
-  return Number(layers?.[3]) > 0;
-}
-
-export function isValidColor(string) {
-  return string && string !== "transparent" && colorIsNotTransparent(string);
-}