@fto-consult/expo-ui 5.11.18 → 5.11.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fto-consult/expo-ui",
-  "version": "5.11.18",
+  "version": "5.11.20",
   "description": "Bibliothèque de composants UI Expo,react-native",
   "main": "index.js",
   "scripts": {
@@ -61,7 +61,7 @@
     "@emotion/native": "^11.11.0",
     "@expo/html-elements": "^0.2.0",
     "@expo/vector-icons": "^13.0.0",
-    "@fto-consult/common": "^3.18.28",
+    "@fto-consult/common": "^3.18.30",
     "@gorhom/portal": "^1.0.14",
     "@pchmn/expo-material3-theme": "^1.0.1",
     "@react-native-async-storage/async-storage": "^1.17.11",

package/src/App.js

@@ -18,11 +18,10 @@ import { timeout as SWR_REFRESH_TIMEOUT} from '$ecomponents/Datagrid/SWRDatagrid
 import { Dimensions,Keyboard } from 'react-native';
 import {isTouchDevice} from "$platform";
 import * as Utils from "$cutils";
-import {extendObj} from "$utils";
-import {fontConfig} from "$theme/fonts";
 import {MD3LightTheme,MD3DarkTheme} from "react-native-paper";
 import { useMaterial3Theme } from '@pchmn/expo-material3-theme';
 import { useColorScheme } from 'react-native';
+import {colorsAlias,Colors} from "$theme";
 
 import { configureFonts} from 'react-native-paper';
 Object.map(Utils,(v,i)=>{
@@ -30,10 +29,11 @@ Object.map(Utils,(v,i)=>{
      window[i] = v;
   }
 });
+const themeAttributes = ["primary","secondary","background",""]
 export default function getIndex({onMount,onUnmount,swrConfig,onRender,...rest}){
   const {extendAppTheme} = appConfig;
   const { theme : pTheme } = useMaterial3Theme();
-  const colorScheme = useColorScheme();
+  //const colorScheme = useColorScheme();
   appConfig.extendAppTheme = (theme)=>{
       if(!isObj(theme)) return;
       const newTheme = theme.dark || theme.isDark ? { ...MD3DarkTheme, colors: pTheme.dark } : { ...MD3LightTheme, colors: pTheme.light };
@@ -43,6 +43,16 @@ export default function getIndex({onMount,onUnmount,swrConfig,onRender,...rest})
         }
       }
       if(isObj(theme.colors)){
+        colorsAlias.map((color)=>{
+          color = color.trim();
+          const cUpper = color.ucFirst();
+          //math theme colors to material desgin V3
+          const textA = `${color}Text`,onColor=`on${cUpper}`//,containerA = `${color}Container`,onColorContainer=`on${cUpper}Container`;
+          const c = Colors.isValid(theme.colors[onColor])? theme.colors[onColor] : (theme.colors[textA]) || undefined;
+          if(c){
+            theme.colors[onColor] = c;
+          }
+        });
         for(let i in newTheme.colors){
           if(!(i in theme.colors)){
             theme.colors[i] = newTheme.colors[i];

package/src/screens/Auth/PermLine.js

@@ -7,6 +7,7 @@ import {hasResource} from "./utils";
 import { StyleSheet } from "react-native";
 import View from "$ecomponents/View";
 import {Cell} from "$ecomponents/Grid";
+import theme from "$theme";
 
 const PermLine = ({text,cellProps,isUserMasterAdmin,withGrid,defaultActions,resource,perms:cPerms,disabled,allPerms,table,index,onChange,keyname,actions,testID,...rest})=>{
     const [state,setState] = React.useState({
@@ -134,7 +135,7 @@ const PermLine = ({text,cellProps,isUserMasterAdmin,withGrid,defaultActions,reso
             pContent.push(<PermText labelStyle ={hasS? styles.permChildren : undefined} isUserMasterAdmin={isUserMasterAdmin}  key={j} table={table} onToggle={onToggleSingle} tooltip={defaultStr(p.tooltip,p.title,p.desc)} text = {p.text} checked ={checked} actions={perm.actions} resource={i} action ={j}/>)
         });
         if(pContent.length){
-            content.push(<View key={i} testID={testID+"_Content_"+i}>
+            content.push(<View key={i} style={{backgroundColor:theme.colors.surface}} testID={testID+"_Content_"+i}>
                 {hasS ? <Label testID={testID+'_Label'}>{pText}</Label> : null}
                 {pContent}
             </View>)