@fto-consult/expo-ui 2.44.0 → 2.45.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fto-consult/expo-ui",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.45.0",
|
|
4
4
|
"description": "Bibliothèque de composants UI Expo,react-native",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"@emotion/native": "^11.10.0",
|
|
62
62
|
"@expo/html-elements": "^0.2.0",
|
|
63
63
|
"@expo/vector-icons": "^13.0.0",
|
|
64
|
-
"@fto-consult/common": "^2.
|
|
64
|
+
"@fto-consult/common": "^2.6.0",
|
|
65
65
|
"@gorhom/portal": "^1.0.14",
|
|
66
66
|
"@react-native-async-storage/async-storage": "~1.17.3",
|
|
67
67
|
"@react-native-community/datetimepicker": "6.5.2",
|
|
@@ -344,7 +344,12 @@ export default class DropdownAlert extends Component {
|
|
|
344
344
|
return this.queue.size;
|
|
345
345
|
};
|
|
346
346
|
_processQueue = () => {
|
|
347
|
-
|
|
347
|
+
let data = this.queue.firstItem;
|
|
348
|
+
console.log("will open ",data,this.alertData);
|
|
349
|
+
if(data && React.areEquals(data,this.alertData)){
|
|
350
|
+
this.queue.dequeue();
|
|
351
|
+
this._processQueue();
|
|
352
|
+
}
|
|
348
353
|
if (data) {
|
|
349
354
|
this.open(data);
|
|
350
355
|
}
|
|
@@ -352,7 +357,7 @@ export default class DropdownAlert extends Component {
|
|
|
352
357
|
open = (data = {}) => {
|
|
353
358
|
this.alertData = data;
|
|
354
359
|
const position = data.top || this.isKeyboardOpen() ? "top" : data.position;
|
|
355
|
-
this.setState({isOpen: true,
|
|
360
|
+
this.setState({isOpen: true,position},()=>{
|
|
356
361
|
this.animate(1, 450, () => {
|
|
357
362
|
if (data.interval > 0) {
|
|
358
363
|
this.closeAutomatic(data.interval);
|
|
@@ -35,19 +35,24 @@ const DrawerNavigationViewComponent = React.forwardRef((props,ref)=>{
|
|
|
35
35
|
style = {flattenStyle([{margin:0,marginHorizontal:0},toggleIconProps.style])}
|
|
36
36
|
onPress = {(e)=>{
|
|
37
37
|
///si le drawer n'est pas visible alors on le rend visible
|
|
38
|
-
if(
|
|
39
|
-
|
|
38
|
+
if(typeof context.toggle === 'function'){
|
|
39
|
+
if(!isPermanent || !drawerRef.current.isOpen()){
|
|
40
|
+
return context.toggle();
|
|
41
|
+
}
|
|
40
42
|
}
|
|
41
|
-
|
|
42
|
-
if(
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
43
|
+
|
|
44
|
+
if(typeof context.toggleMinimized ==='function'){
|
|
45
|
+
/*** si le drawer est minimisé */
|
|
46
|
+
if(isMinimized){
|
|
47
|
+
context.toggleMinimized(false);//on passe au mode non minimisé
|
|
48
|
+
} else if(minimizable !== false) {
|
|
49
|
+
return context.toggleMinimized(!isMinimized,{permanent:true});
|
|
50
|
+
}
|
|
46
51
|
}
|
|
47
52
|
}}
|
|
48
53
|
onLongPress = {(e)=>{
|
|
49
54
|
React.stopEventPropagation(e);
|
|
50
|
-
if(isMinimized || !canBeMinimizedOrPermanent()){
|
|
55
|
+
if(isMinimized || (!canBeMinimizedOrPermanent() && !isPermanent)){
|
|
51
56
|
///le long press n'a pas d'effet sur le drawer quand il est minimié
|
|
52
57
|
return;
|
|
53
58
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {StyleSheet,
|
|
1
|
+
import {StyleSheet,Dimensions} from 'react-native';
|
|
2
2
|
import DrawerLayout from './DrawerLayout';
|
|
3
3
|
import {isIos} from "$cplatform";
|
|
4
4
|
import React from "$react";
|
|
@@ -6,14 +6,12 @@ import PropTypes from "prop-types";
|
|
|
6
6
|
import {defaultObj,isObj,isNonNullString} from "$utils";
|
|
7
7
|
import theme,{Colors,flattenStyle} from "$theme";
|
|
8
8
|
import DrawerItems from './DrawerItems';
|
|
9
|
-
import {isDesktopMedia} from "$cplatform/dimensions";
|
|
10
|
-
import {isMobileNative} from "$cplatform";
|
|
9
|
+
import {isDesktopMedia,getCurrentMedia} from "$cplatform/dimensions";
|
|
11
10
|
import {open,close} from "$epreloader";
|
|
12
11
|
import {DRAWER_POSITIONS,DRAWER_TYPES,MINIMIZED_WIDTH,getDrawerWidth,MINIMIZED_ICON_SIZE,ICON_SIZE} from './utils';
|
|
13
12
|
import Icon,{MENU_ICON} from "$ecomponents/Icon";
|
|
14
13
|
import apiSession from "./session";
|
|
15
14
|
import View from "$ecomponents/View";
|
|
16
|
-
import Dimensions from "$cdimensions";
|
|
17
15
|
import {closeDrawer} from './DrawerItems/utils';
|
|
18
16
|
import {DrawerContext} from "./Provider";
|
|
19
17
|
import NavigationView from "./NavigationView";
|
|
@@ -36,9 +34,9 @@ const DrawerComponent = React.forwardRef((props,ref)=>{
|
|
|
36
34
|
onDrawerOpen,onDrawerClose,onDrawerToggle,header,headerProps,toggleIconProps,
|
|
37
35
|
permanentToggleIcon,minimizedToggleIcon,temporaryToggleIcon,withMinimizedIcon,
|
|
38
36
|
isItemActive,onPageResize,navigationViewRef,
|
|
39
|
-
children,
|
|
37
|
+
children,
|
|
38
|
+
drawerType} = props;
|
|
40
39
|
sessionName = defaultStr(sessionName);
|
|
41
|
-
useWindowDimensions();
|
|
42
40
|
const sessionRef = React.useRef({});
|
|
43
41
|
const session = React.useMemo(()=>{
|
|
44
42
|
if(sessionName){
|
|
@@ -4,7 +4,6 @@ import PropTypes from "prop-types";
|
|
|
4
4
|
import View from "$ecomponents/View";
|
|
5
5
|
import theme from "$theme";
|
|
6
6
|
import {defaultStr,defaultObj} from "$utils";
|
|
7
|
-
import stableHash from "stable-hash";
|
|
8
7
|
import APP from "$capp/instance";
|
|
9
8
|
const ScrollViewComponent = React.forwardRef(({virtualized,contentProps,containerProps,mediaQueryUpdateNativeProps,testID:customTestID,children:cChildren,screenIndent:sIndent,...rest},ref) => {
|
|
10
9
|
const isKeyboardOpenRef = React.useRef(false);
|
|
@@ -12,11 +11,7 @@ const ScrollViewComponent = React.forwardRef(({virtualized,contentProps,containe
|
|
|
12
11
|
containerProps = defaultObj(containerProps)
|
|
13
12
|
const [layout,setLayout] = React.useState(Dimensions.get("window"));
|
|
14
13
|
const {height} = layout;
|
|
15
|
-
const
|
|
16
|
-
const hash = stableHash(cChildren);
|
|
17
|
-
React.useEffect(()=>{
|
|
18
|
-
setChildren(children);
|
|
19
|
-
},[hash]);
|
|
14
|
+
const children = React.useStableMemo(()=>cChildren,[cChildren]);
|
|
20
15
|
React.useEffect(()=>{
|
|
21
16
|
const onKeyboardToggle = ({visible})=>{
|
|
22
17
|
isKeyboardOpenRef.current = visible;
|
|
@@ -5,13 +5,13 @@ import {
|
|
|
5
5
|
StyleSheet,
|
|
6
6
|
Platform,
|
|
7
7
|
} from 'react-native';
|
|
8
|
-
import ScrollView from "$ecomponents/ScrollView";
|
|
9
8
|
import PropTypes from "prop-types";
|
|
10
9
|
import theme,{StylePropTypes,Colors} from "$theme";
|
|
11
10
|
import {isMobileNative,isMobileBrowser} from "$cplatform"
|
|
12
11
|
import {defaultStr} from "$utils";
|
|
13
12
|
import {Elevations} from "$ecomponents/Surface";
|
|
14
|
-
|
|
13
|
+
import stableHash from "stable-hash";
|
|
14
|
+
import ScrollView from '$ecomponents/ScrollView';
|
|
15
15
|
const showScrollBarIndicator = !isMobileBrowser() && !isMobileNative();
|
|
16
16
|
|
|
17
17
|
import TabItem from "./TabItem";
|
|
@@ -96,6 +96,33 @@ const TabItemsComponent = ({
|
|
|
96
96
|
indicatorStyle.left = getLeftPosition();
|
|
97
97
|
testID = defaultStr(testID,"RNE_TabComponent");
|
|
98
98
|
scrollViewProps = defaultObj(scrollViewProps)
|
|
99
|
+
const childrenContent = React.useMemo(()=>{
|
|
100
|
+
return React.Children.map(children, (child, index) => {
|
|
101
|
+
const active = index === activeIndex?true : false;
|
|
102
|
+
return React.cloneElement(
|
|
103
|
+
child,
|
|
104
|
+
{
|
|
105
|
+
onPress: () => {
|
|
106
|
+
onChange(index);
|
|
107
|
+
},
|
|
108
|
+
onLayout: (event) => {
|
|
109
|
+
const { width } = event.nativeEvent.layout;
|
|
110
|
+
const previousItemPosition =
|
|
111
|
+
tabItemsPosition.current[index - 1]?.position || 0;
|
|
112
|
+
|
|
113
|
+
tabItemsPosition.current[index] = {
|
|
114
|
+
position: previousItemPosition + width,
|
|
115
|
+
width,
|
|
116
|
+
};
|
|
117
|
+
},
|
|
118
|
+
activeIndex,
|
|
119
|
+
index,
|
|
120
|
+
active,
|
|
121
|
+
testID : testID+'_Children_'+index
|
|
122
|
+
}
|
|
123
|
+
);
|
|
124
|
+
})
|
|
125
|
+
},[stableHash({children,activeIndex})])
|
|
99
126
|
return (<View
|
|
100
127
|
{...rest}
|
|
101
128
|
testID = {testID}
|
|
@@ -119,32 +146,9 @@ const TabItemsComponent = ({
|
|
|
119
146
|
ref={scrollViewRef}
|
|
120
147
|
testID={testID+"_ScrollView"}
|
|
121
148
|
onScroll={onScrollHandler}
|
|
149
|
+
disableIndicator
|
|
122
150
|
>
|
|
123
|
-
{
|
|
124
|
-
const active = index === activeIndex?true : false;
|
|
125
|
-
return React.cloneElement(
|
|
126
|
-
child,
|
|
127
|
-
{
|
|
128
|
-
onPress: () => {
|
|
129
|
-
onChange(index);
|
|
130
|
-
},
|
|
131
|
-
onLayout: (event) => {
|
|
132
|
-
const { width } = event.nativeEvent.layout;
|
|
133
|
-
const previousItemPosition =
|
|
134
|
-
tabItemsPosition.current[index - 1]?.position || 0;
|
|
135
|
-
|
|
136
|
-
tabItemsPosition.current[index] = {
|
|
137
|
-
position: previousItemPosition + width,
|
|
138
|
-
width,
|
|
139
|
-
};
|
|
140
|
-
},
|
|
141
|
-
activeIndex,
|
|
142
|
-
index,
|
|
143
|
-
active,
|
|
144
|
-
testID : testID+'_Children_'+index
|
|
145
|
-
}
|
|
146
|
-
);
|
|
147
|
-
})}
|
|
151
|
+
{childrenContent}
|
|
148
152
|
{!disableIndicator && (
|
|
149
153
|
<Animated.View
|
|
150
154
|
{...indicatorProps}
|