@fto-consult/expo-ui 6.55.0 → 6.55.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fto-consult/expo-ui",
-  "version": "6.55.0",
+  "version": "6.55.2",
   "description": "Bibliothèque de composants UI Expo,react-native",
   "main": "main",
   "scripts": {

package/src/components/Datagrid/Footer/Footer.js

@@ -88,8 +88,7 @@ const formatValue = ({value,format,abreviate,aggregatorFunction})=>{
     }
     return abreviate? value.abreviate():value.formatNumber();
 }
-export default function DGGridFooterValue (props){
-    let {label,text,displayLabel,withLabel,abreviate,style,aggregatorFunctions,aggregatorFunction,format,testID,anchorProps} = props;
+export default function DGGridFooterValue ({label,text,displayLabel,isFooterCell,withLabel,abreviate,style,aggregatorFunctions,aggregatorFunction,format,testID,anchorProps,...props}){
     aggregatorFunctions = defaultObj(aggregatorFunctions);
     anchorProps = defaultObj(anchorProps);
     testID = defaultStr(testID,"RN_DatagridFooterComponent");

package/src/components/Datagrid/Table/index.js

@@ -50,7 +50,7 @@ const DatagridFactory = (Factory)=>{
         }
         renderFooterCell(props){
             const {columnField,style} = props;
-            let footersValues = this.getFooterValues();
+            const footersValues = this.getFooterValues();
             const footerFields = this.getFootersFields();
             if(isObj(footerFields[columnField])){
                 return <Footer
@@ -59,7 +59,8 @@ const DatagridFactory = (Factory)=>{
                     displayLabel = {false}
                     style = {[style]}
                     aggregatorFunction = {this.getActiveAggregatorFunction().code}   
-                    aggregatorFunctions = {this.aggregatorFunctions}                               
+                    aggregatorFunctions = {this.aggregatorFunctions}   
+                    isFooterCell
                 />
             }
             return null;

package/src/components/Form/Fields/SelectTableData/Component.js

@@ -223,8 +223,20 @@ const TableDataSelectField = React.forwardRef(({foreignKeyColumn,foreignKeyLabel
                 let itv = p.item[fk];
                 if(typeof render =='function'){
                     itv = render(p);
-                } else if(typeof itv =='string' && itv && DateLib.isIsoDateStr(itv)){
-                    itv = DateLib.format(itv,DateLib.defaultDateFormat);
+                } else {
+                    ///render c'est le type de données
+                    if(isNonNullString(render)){
+                        const t = render?.toLowerCase().trim();
+                        if(["date","datetime"].includes(t)){
+                            itv = DateLib.format(itv,t=='date'?DateLib.defaultDateFormat:DateLib.defaultDateTimeFormat);
+                        } else if(typeof itv =='number'){
+                            itv = t =='money'? itv.formatMoney()  : itv.formatNumber();
+                        }
+                    }  else {
+                        if(typeof itv =='string' && itv && DateLib.isIsoDateStr(itv)){
+                            itv = DateLib.format(itv,DateLib.defaultDateFormat);
+                        }
+                    }
                 }
                 itl+= (itl?" ":"")+ (itv || defaultStr(itv))
             });
@@ -308,7 +320,10 @@ const TableDataSelectField = React.forwardRef(({foreignKeyColumn,foreignKeyLabel
 TableDataSelectField.propTypes = {
     ...Dropdown.propTypes,
     /*** permet de faire le mappage entre les foreignKeyLabel et les type correspondants */
-    foreignKeyLabelRenderers : PropTypes.object,
+    foreignKeyLabelRenderers : PropTypes.objectOf(PropTypes.oneOfType([
+        PropTypes.string, //représente le type de données associée à la colone dont le nom la clé 
+        PropTypes.func, //la fonction utilisée pour le rendu des colonnes de ce type
+    ])),
     prepareFilters : PropTypes.bool,//si les filtres seront customisé
     bindUpsert2RemoveEvents : PropTypes.bool,//si le composant écoutera l'évènement de rafraichissement des données
     onAdd : PropTypes.func, //({})=>, la fonction appelée lorsque l'on clique sur le bouton add

package/src/components/Table/Header/CellWrapper.js

@@ -7,10 +7,10 @@ import Label from "$ecomponents/Label";
 import theme from "$theme";
 
 export default function HeaderCellWrapper({columnField,isFilter,isFooter}){
-    const {render,sortedColumn,filtersValues,...props} = useGetColumnProps({columnField,isFilter,isFooter});
+    const {render,sortedColumn,filtersValues,data,...props} = useGetColumnProps({columnField,isFilter,isFooter});
     const columnDef = props.columnDef;
     const isHeader = !isFilter && !isFooter;
-    const rProps = isHeader ? sortedColumn : undefined;
+    const rProps = isHeader ? sortedColumn : isFooter ? data : undefined;
     const width = props.width;
     const {containerProps} = props;
     return React.useMemo(()=>{

package/src/components/Table/Headers/index.js

@@ -7,15 +7,14 @@ import {classNames} from "$cutils";
 
 const TableHeadersWrapperComponent = React.forwardRef(({className},ref)=>{
     const {testID,tableHeadId} = useTable();
-    const content = React.useMemo(()=><>
-        <Header isHeader={true} testID={testID+"_TableHeader"}/>
-        <Header isFilter={true} testID={testID+"_TableFilters"} style={[styles.header,styles.filters,theme.styles.pt0,theme.styles.pb0,theme.styles.ml0,theme.styles.mr0]}/>
-        <Header isFooter testID={testID+"_TableFooter"}  style={[styles.header,styles.footers,theme.styles.pt0,theme.styles.pb0,theme.styles.ml0,theme.styles.mr0]}/>
-    </>,[])
+    const filters = React.useMemo(()=><Header isFilter={true} testID={testID+"_TableFilters"} style={[styles.header,styles.filters,theme.styles.pt0,theme.styles.pb0,theme.styles.ml0,theme.styles.mr0]}/>,[])
     return <thead ref={ref} id={tableHeadId} className={classNames(className,"virtuoso-list-render-table-thead")}
-            style = {{zIndex:100, position: 'sticky', top: 0 ,width:"100%"}}
-    >
-        {content}    
+            style = {{zIndex:100, position: 'sticky', top: 0 ,width:"100%"}}>
+        <>
+            <Header isHeader={true} testID={testID+"_TableHeader"}/>
+            {filters}   
+            <Header isFooter testID={testID+"_TableFooter"}  style={[styles.header,styles.footers,theme.styles.pt0,theme.styles.pb0,theme.styles.ml0,theme.styles.mr0]}/>
+        </>
     </thead>
 });
 

package/src/components/Table/hooks.js

@@ -45,7 +45,7 @@ export const usePrepareColumns = ({columns,testID,columnsWidths,headerCellContai
 import useTable from "./useTable";
 
 export const useGetColumnProps = ({columnField,isFilter,isFooter})=>{
-  const {renderFilterCell,renderFooterCell,filtersValues,renderHeaderCell,sortedColumn,columns,filterCellContainerProps,footerCellContainerProps,headerCellContainerProps,testID,colsWidths} = useTable();
+  const {renderFilterCell,renderFooterCell,filtersValues,renderHeaderCell,data,sortedColumn,columns,filterCellContainerProps,footerCellContainerProps,headerCellContainerProps,testID,colsWidths} = useTable();
   const columnDef = columns[columnField];
   const props = isFilter ? {
     containerProps : defaultObj(filterCellContainerProps),
@@ -57,6 +57,7 @@ export const useGetColumnProps = ({columnField,isFilter,isFooter})=>{
     containerProps : defaultObj(headerCellContainerProps),
     render : renderHeaderCell
   }
+  props.data = data;
   props.width = colsWidths[columnField];
   props.columnField = columnField;
   props.columnDef = columnDef;