@fto-consult/expo-ui 7.14.0 → 7.15.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fto-consult/expo-ui",
-  "version": "7.14.0",
+  "version": "7.15.1",
   "description": "Bibliothèque de composants UI Expo,react-native",
   "scripts": {
     "clear-npx-cache": "npx clear-npx-cache",
@@ -71,7 +71,7 @@
     "@expo/html-elements": "^0.5.1",
     "@expo/vector-icons": "^13.0.0",
     "@faker-js/faker": "^8.0.2",
-    "@fto-consult/common": "^4.0.4",
+    "@fto-consult/common": "^4.0.5",
     "@fto-consult/electron-gen": "^2.2.0",
     "@pchmn/expo-material3-theme": "^1.3.1",
     "@react-native-async-storage/async-storage": "1.18.2",

package/src/components/Chart/index.js

@@ -63,6 +63,7 @@ ChartComponent.propTypes = {
       type: PropTypes.string,
     }),
     xaxis : PropTypes.object,
+    yaxis : PropTypes.object,
     series: PropTypes.array.isRequired,
   }).isRequired,
   ///lorsque le chart est rendu en environnement native, les props du webView

package/src/components/Datagrid/Common/Common.js

@@ -2209,10 +2209,10 @@ export default class CommonDatagridComponent extends AppComponent {
         }
    }
    getDefaultChartHeight(){
-        return defaultNumber(this.props.chartProps?.height,this.props.chartConfig?.height,this.isDashboard()?90:350);
+        return defaultNumber(this.props.chartProps?.height,this.props.chartConfig?.height,this.isDashboard()?100:350);
    }
    getDefaultChartWidth(){
-        return defaultNumber(this.props.chartProps?.width);
+        return defaultNumber(this.props.chartProps?.width,this.props.chartConfig?.width);
    }
    /*** permet de formatter les valeurs de la courbe en fonction du type passé en paramètre */
    chartValueFormattter(value,columnType){
@@ -2326,6 +2326,10 @@ export default class CommonDatagridComponent extends AppComponent {
         const mappedColumns = {};
         const abreviateValues = defaultVal(config.abreviateValues,true) || this.state.abreviateValues;
         const dataLabelFormatter = typeof chartProps.dataLabels?.formatter =="function"? chartProps.dataLabels.formatter : undefined;
+        let chartWidth = defaultNumber(config.width) || this.getDefaultChartWidth() || undefined;
+        if(chartWidth ===0){
+            chartWidth = undefined;
+        }
         const chartOptions = {
             ...chartProps,
             dataLabels : extendObj(true,{enabled:false},chartProps.dataLabels,{
@@ -2363,14 +2367,14 @@ export default class CommonDatagridComponent extends AppComponent {
                 chartProps.chart,
                 {
                     height : defaultNumber(config.height,this.getDefaultChartHeight()),
-                    width : defaultNumber(config.width) || this.getDefaultChartWidth() || undefined,
+                    width : chartWidth,
                     type : chartType.type
                 },
             )
         }
-        const labelColor = theme.Colors.isValid(config.labelColor)? config.labelColor : theme.colors.text; 
+        const labelColor = theme.Colors.isValid(config.labelColor)? config.labelColor : theme.setAlphaColor(theme.colors.text); 
         if(!isDonut){
-            chartOptions.xaxis = extendObj(true,{},{type: 'category'},chartProps.xaxis,{xaxis});
+            chartOptions.xaxis = extendObj(true,{},{type: 'category'},chartProps.xaxis,xaxis);
             const xLabels = chartOptions.xaxis.labels = defaultObj(chartOptions.xaxis.labels);
             xLabels.style = defaultObj(xLabels.style)
             xLabels.style.colors = (Array.isArray(xLabels.style.colors) && xLabels.style.colors.length || theme.Colors.isValid(xLabels.style.colors)) ? xLabels.style.colors : labelColor;
@@ -2380,6 +2384,7 @@ export default class CommonDatagridComponent extends AppComponent {
         }
         chartOptions.yaxis = extendObj(true,{},{type: 'category'},defaultObj(chartProps.yaxis));
         const yLabels = chartOptions.yaxis.labels = defaultObj(chartOptions.yaxis.labels);
+        yLabels.align = "right";
         yLabels.style = defaultObj(yLabels.style)
         yLabels.style.colors = (Array.isArray(yLabels.style.colors) && yLabels.style.colors.length || theme.Colors.isValid(yLabels.style.colors)) ? yLabels.style.colors : labelColor;
         const yLabelsSerieName = series?.length == 1 && series[0] && series[0].name ? series[0].name : undefined;
@@ -2406,24 +2411,29 @@ export default class CommonDatagridComponent extends AppComponent {
         if(!chartType.isDonut){
             delete chartOptions.labels;
         }
-        if(this.isDashboard() && typeof chartOptions.chart.sparkline !=='boolean'){
-            chartOptions.chart.sparkline = true;
-        }
-        if(chartOptions.chart.sparkline){
-            chartOptions.chart.sparkline = {enabled: true}
-        } else delete chartOptions.chart.sparkline;
-        //const spackLine = chartOptions.chart.sparkline;
-        chartOptions.xaxis = defaultObj(chartOptions.xaxis);
-        chartOptions.xaxis.labels = defaultObj(chartOptions.xaxis.labels);
-        chartOptions.xaxis.labels.show  = ("showXaxis" in config) ? !!config.showXaxis : !this.isDashboard();
+        const sparkline = !!(typeof config.sparkline !==undefined ? (isObj(config.sparkline)? config.sparkline.enabled : config.sparkline) : (isObj(chartOptions.chart.sparkline)? chartOptions.chart.sparkline.enabled:chartOptions.chart.sparkline));
+        chartOptions.chart.sparkline = {enabled: sparkline}
         
+        chartOptions.xaxis = defaultObj(chartOptions.xaxis,config.xaxis);
+        chartOptions.xaxis.labels = defaultObj(chartOptions.xaxis.labels);
+        const xLabels = chartOptions.xaxis.labels;
+        const showXaxis = sparkline ? false : ("showXaxis" in config) ? !!config.showXaxis : !this.isDashboard();
+        xLabels.show  = showXaxis;
+        chartOptions.xaxis.show = sparkline ? false :  "show" in chartOptions.xaxis ? !! chartOptions.xaxis.show : showXaxis;
+        xLabels.style = Object.assign({},xLabels.style);
+        xLabels.style.colors = (Array.isArray(xLabels.style.colors) && xLabels.style.colors.length || theme.Colors.isValid(xLabels.style.colors)) ? xLabels.style.colors : labelColor;
         
         chartOptions.yaxis.labels = defaultObj(chartOptions.yaxis.labels);
-        chartOptions.yaxis.labels.show = ("showYaxis" in config) ? !!config.showYaxis : !this.isDashboard();
+        const showYaxis = sparkline ? false : ("showYaxis" in config) ? !!config.showYaxis : !this.isDashboard();
+        chartOptions.yaxis.show = sparkline ? false : "show" in chartOptions.yaxis ? !! chartOptions.yaxis.show : showYaxis;
+        chartOptions.yaxis.labels.show = showYaxis;
+        chartOptions.yaxis.show = "show" in chartOptions.yaxis ? !!chartOptions.yaxis : showYaxis;
         
         chartOptions.legend = defaultObj(chartOptions.legend);
         chartOptions.legend.show = ("showLegend" in config) ? !!config.showLegend : !this.isDashboard();
-
+        chartOptions.legend.labels = Object.assign({},chartOptions.legend.labels);
+        const legendLabels = chartOptions.legend.labels;
+        chartOptions.legend.labels.colors = (Array.isArray(legendLabels.colors) && legendLabels.colors.length || theme.Colors.isValid(legendLabels.colors)) ? legendLabels.colors : labelColor;
         if("dataLabels" in config){
             chartOptions.dataLabels.enabled = !!config.dataLabels;
         }

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

@@ -97,6 +97,7 @@ export default class DatagridDashboard extends TableData {
         rest = defaultObj(rest);
         const pointerEvents = this.getPointerEvents();
         const maxHeight = 300;
+        const chartData = this.renderChart();
         return <View {...rest} testID={testID} style={[styles.container,{maxHeight},rest.style]} pointerEvents={pointerEvents}>
             {this.renderTitle()}
             {showPagination ? <View style={[styles.paginationContainer]}>
@@ -110,7 +111,7 @@ export default class DatagridDashboard extends TableData {
             </View> : null}
             {<View testID={testID+"_ChartContainer"} {...chartContainerProps} style={[theme.styles.w100,styles.chartContainer,chartContainerProps.style]}>
                 {this.renderProgressBar()}
-                {this.renderChart()}
+                {chartData}
             </View>}
         </View>
     }
@@ -138,6 +139,7 @@ const styles = StyleSheet.create({
     },
     container : {
         width : '100%',
+        paddingBottom : 10,
         //flex:1,
     },
     chartContainer : {

package/src/screens/Help/openLibraries.js

@@ -1,7 +1,7 @@
 module.exports = {
 	"@fto-consult/expo-ui": {
 		"name": "@fto-consult/expo-ui",
-		"version": "7.13.7",
+		"version": "7.15.0",
 		"repository": {
 			"type": "git",
 			"url": "git+https://github.com/borispipo/expo-ui.git"
@@ -49,7 +49,7 @@ module.exports = {
 		"license": "MIT"
 	},
 	"@fto-consult/common": {
-		"version": "4.0.4",
+		"version": "4.0.5",
 		"url": "https://github.com/borispipo/common#readme",
 		"license": "ISC"
 	},