secullum-react-native-ui 4.3.13 → 4.4.0-beta.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/lib/components/AppShell.d.ts +29 -3
- package/lib/components/AppShell.js +2 -1
- package/lib/components/Button.js +5 -4
- package/lib/components/Card.d.ts +5 -5
- package/lib/components/Card.js +13 -8
- package/lib/components/CheckBox.js +3 -2
- package/lib/components/DatePicker.js +8 -8
- package/lib/components/DatePicker.web.js +7 -6
- package/lib/components/Delay.d.ts +1 -1
- package/lib/components/Delay.js +1 -0
- package/lib/components/Details.js +4 -3
- package/lib/components/DetailsHeader.d.ts +1 -1
- package/lib/components/DetailsHeader.js +8 -7
- package/lib/components/DimensionsMonitor.d.ts +1 -1
- package/lib/components/DimensionsMonitor.js +1 -0
- package/lib/components/DropDown.js +10 -9
- package/lib/components/ErrorMessage.js +2 -1
- package/lib/components/FilePicker.d.ts +1 -0
- package/lib/components/FilePicker.js +7 -6
- package/lib/components/Header.d.ts +2 -2
- package/lib/components/Header.js +14 -11
- package/lib/components/HeaderDesktop.js +11 -8
- package/lib/components/ImageButton.js +2 -1
- package/lib/components/KeyboardAvoidingView.d.ts +1 -1
- package/lib/components/KeyboardAvoidingView.js +7 -4
- package/lib/components/Link.js +2 -1
- package/lib/components/Loading.js +1 -0
- package/lib/components/Menu.d.ts +1 -1
- package/lib/components/Menu.js +5 -4
- package/lib/components/MenuDesktop.js +3 -2
- package/lib/components/MenuMobile.js +4 -3
- package/lib/components/Message.js +10 -9
- package/lib/components/Modal.js +1 -0
- package/lib/components/MultiSelect.d.ts +1 -1
- package/lib/components/MultiSelect.js +10 -9
- package/lib/components/NoRecordMessage.js +3 -2
- package/lib/components/Question.js +10 -9
- package/lib/components/RadioButton.js +2 -1
- package/lib/components/RadioGroup.js +5 -4
- package/lib/components/RangeDatePicker.js +7 -7
- package/lib/components/RangeDatePicker.web.js +7 -6
- package/lib/components/Space.js +2 -1
- package/lib/components/StatusBar.js +3 -2
- package/lib/components/Switch.js +3 -2
- package/lib/components/Table.js +5 -2
- package/lib/components/Table.web.d.ts +1 -1
- package/lib/components/Table.web.js +7 -4
- package/lib/components/Text.d.ts +1 -1
- package/lib/components/Text.js +4 -3
- package/lib/components/TextBox.d.ts +3 -35
- package/lib/components/TextBox.js +6 -5
- package/lib/components/TextBoxMask.js +8 -3
- package/lib/components/TimePicker.js +8 -8
- package/lib/components/TimePicker.web.js +7 -6
- package/lib/index.js +53 -42
- package/lib/modules/browser.js +1 -0
- package/lib/modules/format.js +14 -8
- package/lib/modules/layout.js +3 -1
- package/lib/modules/theme.js +7 -4
- package/lib/modules/validation.js +7 -3
- package/package.json +3 -4
|
@@ -3,7 +3,7 @@ import { HeaderButton } from './Header';
|
|
|
3
3
|
import { GreetingMessage } from './HeaderDesktop';
|
|
4
4
|
import { MenuProperties } from './Menu';
|
|
5
5
|
import { MenuMobile } from './MenuMobile';
|
|
6
|
-
import { StyleProp, TextStyle } from 'react-native';
|
|
6
|
+
import { StyleSheet, StyleProp, TextStyle } from 'react-native';
|
|
7
7
|
export declare type AppShellProperties = MenuProperties & {
|
|
8
8
|
logoHeader: () => React.ReactNode;
|
|
9
9
|
logoMenu: () => React.ReactNode;
|
|
@@ -16,8 +16,34 @@ export declare type AppShellProperties = MenuProperties & {
|
|
|
16
16
|
};
|
|
17
17
|
export declare class AppShell extends React.Component<AppShellProperties> {
|
|
18
18
|
menu: MenuMobile | null;
|
|
19
|
-
getMobileStyles: () => any
|
|
20
|
-
|
|
19
|
+
getMobileStyles: () => StyleSheet.NamedStyles<any> | StyleSheet.NamedStyles<{
|
|
20
|
+
container: {
|
|
21
|
+
flex: number;
|
|
22
|
+
padding: number;
|
|
23
|
+
height: number;
|
|
24
|
+
overflow: "auto";
|
|
25
|
+
};
|
|
26
|
+
logoText: {
|
|
27
|
+
color: string;
|
|
28
|
+
fontFamily: string;
|
|
29
|
+
fontSize: number;
|
|
30
|
+
marginLeft: number;
|
|
31
|
+
display: "flex";
|
|
32
|
+
alignItems: "center";
|
|
33
|
+
};
|
|
34
|
+
}>;
|
|
35
|
+
getDesktopStyles: () => StyleSheet.NamedStyles<any> | StyleSheet.NamedStyles<{
|
|
36
|
+
container: {
|
|
37
|
+
flexDirection: "row";
|
|
38
|
+
flex: number;
|
|
39
|
+
};
|
|
40
|
+
content: {
|
|
41
|
+
flex: number;
|
|
42
|
+
padding: number;
|
|
43
|
+
height: number;
|
|
44
|
+
overflow: "auto";
|
|
45
|
+
};
|
|
46
|
+
}>;
|
|
21
47
|
renderMobile: () => JSX.Element;
|
|
22
48
|
renderDesktop: () => JSX.Element;
|
|
23
49
|
render(): JSX.Element;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.AppShell = void 0;
|
|
3
4
|
const React = require("react");
|
|
4
5
|
const DimensionsMonitor_1 = require("./DimensionsMonitor");
|
|
5
6
|
const Header_1 = require("./Header");
|
|
@@ -13,7 +14,7 @@ class AppShell extends React.Component {
|
|
|
13
14
|
super(...arguments);
|
|
14
15
|
this.menu = null;
|
|
15
16
|
this.getMobileStyles = () => {
|
|
16
|
-
const theme = theme_1.getTheme();
|
|
17
|
+
const theme = (0, theme_1.getTheme)();
|
|
17
18
|
const styles = react_native_1.StyleSheet.create({
|
|
18
19
|
container: {
|
|
19
20
|
flex: 1,
|
package/lib/components/Button.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.Button = void 0;
|
|
3
4
|
const React = require("react");
|
|
4
5
|
const theme_1 = require("../modules/theme");
|
|
5
6
|
const react_native_1 = require("react-native");
|
|
@@ -8,14 +9,14 @@ class Button extends React.Component {
|
|
|
8
9
|
constructor() {
|
|
9
10
|
super(...arguments);
|
|
10
11
|
this.getStyles = () => {
|
|
11
|
-
const theme = theme_1.getTheme();
|
|
12
|
+
const theme = (0, theme_1.getTheme)();
|
|
12
13
|
const styles = react_native_1.StyleSheet.create({
|
|
13
14
|
touchable: {
|
|
14
15
|
backgroundColor: theme.backgroundColor1,
|
|
15
16
|
borderColor: theme.borderColor1,
|
|
16
17
|
borderWidth: 1,
|
|
17
18
|
borderRadius: 3,
|
|
18
|
-
height: layout_1.isTablet() ? 45 : 40,
|
|
19
|
+
height: (0, layout_1.isTablet)() ? 45 : 40,
|
|
19
20
|
alignItems: 'center',
|
|
20
21
|
justifyContent: 'center'
|
|
21
22
|
},
|
|
@@ -25,7 +26,7 @@ class Button extends React.Component {
|
|
|
25
26
|
},
|
|
26
27
|
text: {
|
|
27
28
|
fontFamily: theme.fontFamily1,
|
|
28
|
-
fontSize: layout_1.isTablet() ? 18 : 13,
|
|
29
|
+
fontSize: (0, layout_1.isTablet)() ? 18 : 13,
|
|
29
30
|
paddingHorizontal: 11,
|
|
30
31
|
color: theme.textColor1
|
|
31
32
|
},
|
|
@@ -59,7 +60,7 @@ class Button extends React.Component {
|
|
|
59
60
|
] }, text)));
|
|
60
61
|
}
|
|
61
62
|
}
|
|
63
|
+
exports.Button = Button;
|
|
62
64
|
Button.defaultProps = {
|
|
63
65
|
primary: true
|
|
64
66
|
};
|
|
65
|
-
exports.Button = Button;
|
package/lib/components/Card.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { StyleProp, TextStyle,
|
|
2
|
+
import { StyleProp, TextStyle, ViewProps, ViewStyle } from 'react-native';
|
|
3
3
|
export interface CardHeaderProperties {
|
|
4
4
|
title: string;
|
|
5
5
|
titleStyle?: StyleProp<TextStyle>;
|
|
@@ -31,16 +31,16 @@ export declare class CardHeader extends React.Component<CardHeaderProperties> {
|
|
|
31
31
|
};
|
|
32
32
|
render(): JSX.Element;
|
|
33
33
|
}
|
|
34
|
-
export declare class CardFooter extends React.Component<
|
|
34
|
+
export declare class CardFooter extends React.Component<ViewProps> {
|
|
35
35
|
render(): JSX.Element;
|
|
36
36
|
}
|
|
37
|
-
export declare class CardSection extends React.Component<
|
|
37
|
+
export declare class CardSection extends React.Component<ViewProps> {
|
|
38
38
|
render(): JSX.Element;
|
|
39
39
|
}
|
|
40
|
-
export declare class CardModal extends React.Component<
|
|
40
|
+
export declare class CardModal extends React.Component<ViewProps> {
|
|
41
41
|
render(): JSX.Element;
|
|
42
42
|
}
|
|
43
|
-
export interface CardProperties extends
|
|
43
|
+
export interface CardProperties extends ViewProps {
|
|
44
44
|
children: React.ReactNode;
|
|
45
45
|
style?: StyleProp<ViewStyle>;
|
|
46
46
|
}
|
package/lib/components/Card.js
CHANGED
|
@@ -4,11 +4,14 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
4
4
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5
5
|
t[p] = s[p];
|
|
6
6
|
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
7
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++)
|
|
8
|
-
|
|
7
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
8
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
9
|
+
t[p[i]] = s[p[i]];
|
|
10
|
+
}
|
|
9
11
|
return t;
|
|
10
12
|
};
|
|
11
13
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
14
|
+
exports.Card = exports.CardModal = exports.CardSection = exports.CardFooter = exports.CardHeader = void 0;
|
|
12
15
|
const React = require("react");
|
|
13
16
|
const react_native_elevated_view_1 = require("react-native-elevated-view");
|
|
14
17
|
const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
|
|
@@ -19,7 +22,7 @@ class CardHeader extends React.Component {
|
|
|
19
22
|
constructor() {
|
|
20
23
|
super(...arguments);
|
|
21
24
|
this.getStyles = () => {
|
|
22
|
-
const theme = theme_1.getTheme();
|
|
25
|
+
const theme = (0, theme_1.getTheme)();
|
|
23
26
|
const styles = react_native_1.StyleSheet.create({
|
|
24
27
|
container: {
|
|
25
28
|
padding: 16
|
|
@@ -27,7 +30,7 @@ class CardHeader extends React.Component {
|
|
|
27
30
|
title: {
|
|
28
31
|
color: theme.textColor1,
|
|
29
32
|
fontFamily: theme.fontFamily1,
|
|
30
|
-
fontSize: layout_1.isTablet() ? 22 : 18,
|
|
33
|
+
fontSize: (0, layout_1.isTablet)() ? 22 : 18,
|
|
31
34
|
marginRight: 10
|
|
32
35
|
},
|
|
33
36
|
help: {
|
|
@@ -36,7 +39,7 @@ class CardHeader extends React.Component {
|
|
|
36
39
|
top: 5
|
|
37
40
|
},
|
|
38
41
|
helpIcon: {
|
|
39
|
-
fontSize: layout_1.isTablet() ? 24 : 20,
|
|
42
|
+
fontSize: (0, layout_1.isTablet)() ? 24 : 20,
|
|
40
43
|
color: '#6d819c'
|
|
41
44
|
}
|
|
42
45
|
});
|
|
@@ -78,7 +81,7 @@ class Card extends React.Component {
|
|
|
78
81
|
constructor() {
|
|
79
82
|
super(...arguments);
|
|
80
83
|
this.getStyles = () => {
|
|
81
|
-
const theme = theme_1.getTheme();
|
|
84
|
+
const theme = (0, theme_1.getTheme)();
|
|
82
85
|
const styles = react_native_1.StyleSheet.create({
|
|
83
86
|
container: {
|
|
84
87
|
borderRadius: 3,
|
|
@@ -105,14 +108,16 @@ class Card extends React.Component {
|
|
|
105
108
|
React.createElement(react_native_1.View, { style: styles.cardChild }),
|
|
106
109
|
child));
|
|
107
110
|
});
|
|
108
|
-
return react_native_1.Platform.OS == 'web' ? (React.createElement(react_native_1.View, Object.assign({ style: [styles.container, style] }, otherProps), childrenMapped)) : (React.createElement(react_native_elevated_view_1.default, Object.assign({ elevation: 5,
|
|
111
|
+
return react_native_1.Platform.OS == 'web' ? (React.createElement(react_native_1.View, Object.assign({ style: [styles.container, style] }, otherProps), childrenMapped)) : (React.createElement(react_native_elevated_view_1.default, Object.assign({ elevation: 5,
|
|
112
|
+
// @ts-ignore : The component uses a different version of typing
|
|
113
|
+
style: [styles.container, style] }, otherProps), childrenMapped));
|
|
109
114
|
}
|
|
110
115
|
}
|
|
116
|
+
exports.Card = Card;
|
|
111
117
|
Card.Header = CardHeader;
|
|
112
118
|
Card.Section = CardSection;
|
|
113
119
|
Card.Footer = CardFooter;
|
|
114
120
|
Card.Modal = CardModal;
|
|
115
|
-
exports.Card = Card;
|
|
116
121
|
const cardSectionStyles = react_native_1.StyleSheet.create({
|
|
117
122
|
container: {
|
|
118
123
|
padding: 16
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.CheckBox = void 0;
|
|
3
4
|
const React = require("react");
|
|
4
5
|
const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
|
|
5
6
|
const layout_1 = require("../modules/layout");
|
|
@@ -9,7 +10,7 @@ class CheckBox extends React.Component {
|
|
|
9
10
|
constructor() {
|
|
10
11
|
super(...arguments);
|
|
11
12
|
this.getStyles = () => {
|
|
12
|
-
const theme = theme_1.getTheme();
|
|
13
|
+
const theme = (0, theme_1.getTheme)();
|
|
13
14
|
const { disabled } = this.props;
|
|
14
15
|
return react_native_1.StyleSheet.create({
|
|
15
16
|
container: {
|
|
@@ -26,7 +27,7 @@ class CheckBox extends React.Component {
|
|
|
26
27
|
label: {
|
|
27
28
|
color: disabled ? theme.disabledColor : theme.textColor1,
|
|
28
29
|
fontFamily: theme.fontFamily3,
|
|
29
|
-
fontSize: layout_1.isTablet() ? 15 : 12
|
|
30
|
+
fontSize: (0, layout_1.isTablet)() ? 15 : 12
|
|
30
31
|
}
|
|
31
32
|
});
|
|
32
33
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.DatePicker = void 0;
|
|
3
4
|
const React = require("react");
|
|
4
|
-
const react_native_appearance_1 = require("react-native-appearance");
|
|
5
5
|
const react_native_modal_datetime_picker_1 = require("react-native-modal-datetime-picker");
|
|
6
6
|
const format_1 = require("../modules/format");
|
|
7
7
|
const layout_1 = require("../modules/layout");
|
|
@@ -13,7 +13,7 @@ class DatePicker extends React.Component {
|
|
|
13
13
|
super(...arguments);
|
|
14
14
|
this.state = {
|
|
15
15
|
showModal: false,
|
|
16
|
-
isDarkModeEnabled:
|
|
16
|
+
isDarkModeEnabled: react_native_1.Appearance.getColorScheme() === 'dark'
|
|
17
17
|
};
|
|
18
18
|
this.handlePress = () => {
|
|
19
19
|
this.setState({ showModal: true });
|
|
@@ -34,7 +34,7 @@ class DatePicker extends React.Component {
|
|
|
34
34
|
this.props.onChange(undefined);
|
|
35
35
|
};
|
|
36
36
|
this.getStyles = () => {
|
|
37
|
-
const theme = theme_1.getTheme();
|
|
37
|
+
const theme = (0, theme_1.getTheme)();
|
|
38
38
|
const styles = react_native_1.StyleSheet.create({
|
|
39
39
|
container: {
|
|
40
40
|
paddingLeft: 16,
|
|
@@ -49,7 +49,7 @@ class DatePicker extends React.Component {
|
|
|
49
49
|
label: {
|
|
50
50
|
color: theme.textColor2,
|
|
51
51
|
fontFamily: theme.fontFamily3,
|
|
52
|
-
fontSize: layout_1.isTablet() ? 15 : 12,
|
|
52
|
+
fontSize: (0, layout_1.isTablet)() ? 15 : 12,
|
|
53
53
|
lineHeight: 16
|
|
54
54
|
},
|
|
55
55
|
value: {
|
|
@@ -76,7 +76,7 @@ class DatePicker extends React.Component {
|
|
|
76
76
|
};
|
|
77
77
|
}
|
|
78
78
|
componentDidMount() {
|
|
79
|
-
this.appearanceSubscription =
|
|
79
|
+
this.appearanceSubscription = react_native_1.Appearance.addChangeListener(({ colorScheme }) => {
|
|
80
80
|
this.setState({ isDarkModeEnabled: colorScheme === 'dark' });
|
|
81
81
|
});
|
|
82
82
|
}
|
|
@@ -87,19 +87,19 @@ class DatePicker extends React.Component {
|
|
|
87
87
|
const { label, value, clearable, style, nativeID, disabled } = this.props;
|
|
88
88
|
const { showModal, isDarkModeEnabled } = this.state;
|
|
89
89
|
const styles = this.getStyles();
|
|
90
|
-
const theme = theme_1.getTheme();
|
|
90
|
+
const theme = (0, theme_1.getTheme)();
|
|
91
91
|
return (React.createElement(react_native_1.TouchableWithoutFeedback, { disabled: disabled, onPress: this.handlePress },
|
|
92
92
|
React.createElement(react_native_1.View, { nativeID: nativeID, style: [styles.container, style, disabled ? styles.readonly : null] },
|
|
93
93
|
React.createElement(react_native_1.View, null,
|
|
94
94
|
React.createElement(react_native_1.Text, { style: styles.label }, label),
|
|
95
|
-
React.createElement(react_native_1.Text, { style: styles.value }, value != undefined ? format_1.formatDate(value, 'dddd, DD/MM/YYYY') : '')),
|
|
95
|
+
React.createElement(react_native_1.Text, { style: styles.value }, value != undefined ? (0, format_1.formatDate)(value, 'dddd, DD/MM/YYYY') : '')),
|
|
96
96
|
!disabled && (React.createElement(ImageButton_1.ImageButton, { icon: value && clearable ? 'times' : 'calendar', style: styles.clearIcon, iconColor: value && clearable ? theme.textColor1 : theme.textColor2, onPress: value && clearable ? this.handleClear : this.handlePress, hitBoxSize: 30 })),
|
|
97
97
|
react_native_1.Platform.OS !== 'web' && (React.createElement(react_native_modal_datetime_picker_1.default, { date: value, isVisible: showModal, onConfirm: this.handleConfirm, onCancel: this.handleCancel, isDarkModeEnabled: isDarkModeEnabled,
|
|
98
98
|
//@ts-ignore
|
|
99
99
|
display: react_native_1.Platform.OS == 'ios' ? 'inline' : 'default' })))));
|
|
100
100
|
}
|
|
101
101
|
}
|
|
102
|
+
exports.DatePicker = DatePicker;
|
|
102
103
|
DatePicker.defaultProps = {
|
|
103
104
|
clearable: true
|
|
104
105
|
};
|
|
105
|
-
exports.DatePicker = DatePicker;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.DatePicker = void 0;
|
|
3
4
|
const React = require("react");
|
|
4
5
|
const theme_1 = require("../modules/theme");
|
|
5
6
|
const layout_1 = require("../modules/layout");
|
|
@@ -34,7 +35,7 @@ class DatePicker extends React.Component {
|
|
|
34
35
|
this.setState({ showModal: false });
|
|
35
36
|
};
|
|
36
37
|
this.getStyles = () => {
|
|
37
|
-
const theme = theme_1.getTheme();
|
|
38
|
+
const theme = (0, theme_1.getTheme)();
|
|
38
39
|
const styles = react_native_1.StyleSheet.create({
|
|
39
40
|
container: {
|
|
40
41
|
paddingLeft: 16,
|
|
@@ -53,7 +54,7 @@ class DatePicker extends React.Component {
|
|
|
53
54
|
label: {
|
|
54
55
|
color: theme.textColor2,
|
|
55
56
|
fontFamily: theme.fontFamily3,
|
|
56
|
-
fontSize: layout_1.isTablet() ? 15 : 12,
|
|
57
|
+
fontSize: (0, layout_1.isTablet)() ? 15 : 12,
|
|
57
58
|
lineHeight: 16
|
|
58
59
|
},
|
|
59
60
|
value: {
|
|
@@ -80,12 +81,12 @@ class DatePicker extends React.Component {
|
|
|
80
81
|
render() {
|
|
81
82
|
const { label, value, clearable, style, dateFormat, nativeID } = this.props;
|
|
82
83
|
const styles = this.getStyles();
|
|
83
|
-
const theme = theme_1.getTheme();
|
|
84
|
+
const theme = (0, theme_1.getTheme)();
|
|
84
85
|
return (React.createElement(react_native_1.TouchableWithoutFeedback, { onPress: this.handlePress },
|
|
85
86
|
React.createElement(react_native_1.View, { nativeID: nativeID, style: [styles.container, style] },
|
|
86
87
|
React.createElement(react_native_1.View, { ref: ref => ref && ref.setNativeProps({ id: 'date-picker' }) },
|
|
87
88
|
React.createElement(react_native_1.Text, { style: styles.label }, label),
|
|
88
|
-
React.createElement(react_native_1.Text, { style: styles.value }, value != undefined ? format_1.formatDate(value, dateFormat) : '')),
|
|
89
|
+
React.createElement(react_native_1.Text, { style: styles.value }, value != undefined ? (0, format_1.formatDate)(value, dateFormat) : '')),
|
|
89
90
|
React.createElement(ImageButton_1.ImageButton, { icon: value && clearable ? 'times' : 'calendar', style: styles.clearIcon, iconColor: value && clearable ? theme.textColor1 : theme.textColor2, onPress: value && clearable ? this.handleClear : this.handlePress, hitBoxSize: 30 }),
|
|
90
91
|
React.createElement(Modal_1.Modal, { visible: this.state.showModal, overlayStyle: styles.modalOverlay },
|
|
91
92
|
React.createElement("div", { ref: this.calendarRef, style: {
|
|
@@ -95,11 +96,11 @@ class DatePicker extends React.Component {
|
|
|
95
96
|
marginTop: '-150px',
|
|
96
97
|
fontFamily: theme.fontFamily1
|
|
97
98
|
} },
|
|
98
|
-
React.createElement(react_date_range_1.Calendar, { locale: format_1.getDateFnsLocale(), date: value, onChange: this.handleConfirm }))))));
|
|
99
|
+
React.createElement(react_date_range_1.Calendar, { locale: (0, format_1.getDateFnsLocale)(), date: value, onChange: this.handleConfirm }))))));
|
|
99
100
|
}
|
|
100
101
|
}
|
|
102
|
+
exports.DatePicker = DatePicker;
|
|
101
103
|
DatePicker.defaultProps = {
|
|
102
104
|
clearable: true,
|
|
103
105
|
dateFormat: 'dddd, DD/MM/YYYY'
|
|
104
106
|
};
|
|
105
|
-
exports.DatePicker = DatePicker;
|
package/lib/components/Delay.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.Details = void 0;
|
|
3
4
|
const React = require("react");
|
|
4
5
|
const react_native_1 = require("react-native");
|
|
5
6
|
const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
|
|
@@ -11,11 +12,11 @@ class Details extends React.Component {
|
|
|
11
12
|
constructor() {
|
|
12
13
|
super(...arguments);
|
|
13
14
|
this.getStyles = () => {
|
|
14
|
-
const theme = theme_1.getTheme();
|
|
15
|
+
const theme = (0, theme_1.getTheme)();
|
|
15
16
|
const styles = react_native_1.StyleSheet.create({
|
|
16
17
|
title: {
|
|
17
18
|
fontFamily: theme.fontFamily1,
|
|
18
|
-
fontSize: layout_1.isTablet() ? 22 : 18,
|
|
19
|
+
fontSize: (0, layout_1.isTablet)() ? 22 : 18,
|
|
19
20
|
color: theme.textColor1
|
|
20
21
|
},
|
|
21
22
|
lineSection: {
|
|
@@ -30,7 +31,7 @@ class Details extends React.Component {
|
|
|
30
31
|
},
|
|
31
32
|
lineText: {
|
|
32
33
|
fontFamily: theme.fontFamily2,
|
|
33
|
-
fontSize: layout_1.isTablet() ? 18 : 14,
|
|
34
|
+
fontSize: (0, layout_1.isTablet)() ? 18 : 14,
|
|
34
35
|
color: theme.textColor1,
|
|
35
36
|
minWidth: 40
|
|
36
37
|
},
|
|
@@ -34,6 +34,6 @@ export declare class DetailsHeader extends React.Component<DetailsHeaderProperti
|
|
|
34
34
|
width: number;
|
|
35
35
|
};
|
|
36
36
|
};
|
|
37
|
-
renderButton: (type:
|
|
37
|
+
renderButton: (type: 'left' | 'right', onPress: (() => void) | undefined) => JSX.Element;
|
|
38
38
|
render(): JSX.Element;
|
|
39
39
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.DetailsHeader = void 0;
|
|
3
4
|
const React = require("react");
|
|
4
5
|
const react_native_1 = require("react-native");
|
|
5
6
|
const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
|
|
@@ -10,7 +11,7 @@ class DetailsHeader extends React.Component {
|
|
|
10
11
|
constructor() {
|
|
11
12
|
super(...arguments);
|
|
12
13
|
this.getStyles = () => {
|
|
13
|
-
const theme = theme_1.getTheme();
|
|
14
|
+
const theme = (0, theme_1.getTheme)();
|
|
14
15
|
const styles = react_native_1.StyleSheet.create({
|
|
15
16
|
container: {
|
|
16
17
|
flexDirection: 'row',
|
|
@@ -19,14 +20,14 @@ class DetailsHeader extends React.Component {
|
|
|
19
20
|
},
|
|
20
21
|
text: {
|
|
21
22
|
fontFamily: theme.fontFamily1,
|
|
22
|
-
fontSize: layout_1.isTablet() ? 22 : 18,
|
|
23
|
+
fontSize: (0, layout_1.isTablet)() ? 22 : 18,
|
|
23
24
|
color: theme.textColor1,
|
|
24
25
|
width: '80%',
|
|
25
26
|
textAlign: 'center'
|
|
26
27
|
},
|
|
27
28
|
button: {
|
|
28
|
-
height: layout_1.isTablet() ? 28 : 24,
|
|
29
|
-
width: layout_1.isTablet() ? 28 : 24,
|
|
29
|
+
height: (0, layout_1.isTablet)() ? 28 : 24,
|
|
30
|
+
width: (0, layout_1.isTablet)() ? 28 : 24,
|
|
30
31
|
alignItems: 'center',
|
|
31
32
|
justifyContent: 'center',
|
|
32
33
|
borderColor: theme.borderColor1,
|
|
@@ -34,15 +35,15 @@ class DetailsHeader extends React.Component {
|
|
|
34
35
|
borderRadius: 24
|
|
35
36
|
},
|
|
36
37
|
buttonPlaceholder: {
|
|
37
|
-
height: layout_1.isTablet() ? 28 : 24,
|
|
38
|
-
width: layout_1.isTablet() ? 28 : 24
|
|
38
|
+
height: (0, layout_1.isTablet)() ? 28 : 24,
|
|
39
|
+
width: (0, layout_1.isTablet)() ? 28 : 24
|
|
39
40
|
}
|
|
40
41
|
});
|
|
41
42
|
return styles;
|
|
42
43
|
};
|
|
43
44
|
this.renderButton = (type, onPress) => {
|
|
44
45
|
const styles = this.getStyles();
|
|
45
|
-
const theme = theme_1.getTheme();
|
|
46
|
+
const theme = (0, theme_1.getTheme)();
|
|
46
47
|
if (onPress) {
|
|
47
48
|
return (React.createElement(react_native_1.TouchableOpacity, { style: styles.button, onPress: onPress },
|
|
48
49
|
React.createElement(FontAwesome_1.default, { name: type === 'left' ? 'angle-left' : 'angle-right', color: theme.textColor3, size: 14 })));
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.DropDown = void 0;
|
|
3
4
|
const React = require("react");
|
|
4
5
|
const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
|
|
5
6
|
const Modal_1 = require("./Modal");
|
|
@@ -10,7 +11,7 @@ class DropDownItem extends React.PureComponent {
|
|
|
10
11
|
constructor() {
|
|
11
12
|
super(...arguments);
|
|
12
13
|
this.getStyles = () => {
|
|
13
|
-
const theme = theme_1.getTheme();
|
|
14
|
+
const theme = (0, theme_1.getTheme)();
|
|
14
15
|
const styles = react_native_1.StyleSheet.create({
|
|
15
16
|
modalItem: {
|
|
16
17
|
paddingHorizontal: 16,
|
|
@@ -45,7 +46,7 @@ class DropDownItem extends React.PureComponent {
|
|
|
45
46
|
};
|
|
46
47
|
this.renderOpenDropDownItem = () => {
|
|
47
48
|
const { label, icon, iconComponent, nativeID } = this.props;
|
|
48
|
-
const theme = theme_1.getTheme();
|
|
49
|
+
const theme = (0, theme_1.getTheme)();
|
|
49
50
|
const styles = this.getStyles();
|
|
50
51
|
if (label && icon) {
|
|
51
52
|
return (React.createElement(react_native_1.View, { nativeID: nativeID, style: styles.rowView },
|
|
@@ -73,7 +74,7 @@ class DropDownItem extends React.PureComponent {
|
|
|
73
74
|
}
|
|
74
75
|
render() {
|
|
75
76
|
const { first, last, value, onPress } = this.props;
|
|
76
|
-
const theme = theme_1.getTheme();
|
|
77
|
+
const theme = (0, theme_1.getTheme)();
|
|
77
78
|
return (React.createElement(react_native_1.TouchableHighlight, { onPress: () => onPress(value), underlayColor: theme.backgroundColor2, style: {
|
|
78
79
|
borderTopLeftRadius: first ? 5 : 0,
|
|
79
80
|
borderTopRightRadius: first ? 5 : 0,
|
|
@@ -95,7 +96,7 @@ class DropDown extends React.Component {
|
|
|
95
96
|
};
|
|
96
97
|
this.renderClosedDropDown = (item, inputStyle) => {
|
|
97
98
|
const { iconComponent } = this.props;
|
|
98
|
-
const theme = theme_1.getTheme();
|
|
99
|
+
const theme = (0, theme_1.getTheme)();
|
|
99
100
|
const styles = this.getStyles();
|
|
100
101
|
if (!item) {
|
|
101
102
|
return (React.createElement(React.Fragment, null,
|
|
@@ -130,7 +131,7 @@ class DropDown extends React.Component {
|
|
|
130
131
|
return null;
|
|
131
132
|
};
|
|
132
133
|
this.getStyles = () => {
|
|
133
|
-
const theme = theme_1.getTheme();
|
|
134
|
+
const theme = (0, theme_1.getTheme)();
|
|
134
135
|
const { icon } = this.props;
|
|
135
136
|
const styles = react_native_1.StyleSheet.create({
|
|
136
137
|
container: Object.assign({ paddingHorizontal: 16, paddingVertical: 8, borderWidth: 1, borderColor: theme.borderColor1, borderRadius: 3 }, (icon
|
|
@@ -142,7 +143,7 @@ class DropDown extends React.Component {
|
|
|
142
143
|
label: {
|
|
143
144
|
color: theme.textColor2,
|
|
144
145
|
fontFamily: theme.fontFamily3,
|
|
145
|
-
fontSize: layout_1.isTablet() ? 15 : 12,
|
|
146
|
+
fontSize: (0, layout_1.isTablet)() ? 15 : 12,
|
|
146
147
|
lineHeight: 16
|
|
147
148
|
},
|
|
148
149
|
text: {
|
|
@@ -218,7 +219,7 @@ class DropDown extends React.Component {
|
|
|
218
219
|
},
|
|
219
220
|
iconOnLine: {
|
|
220
221
|
color: theme.textColor2,
|
|
221
|
-
fontSize: layout_1.isTablet() ? 21 : 19,
|
|
222
|
+
fontSize: (0, layout_1.isTablet)() ? 21 : 19,
|
|
222
223
|
marginRight: 10,
|
|
223
224
|
minWidth: 25,
|
|
224
225
|
textAlignVertical: 'center',
|
|
@@ -233,7 +234,7 @@ class DropDown extends React.Component {
|
|
|
233
234
|
const { label, items, value, emptyMessage, style, disabled, labelStyle, inputStyle, iconComponent, nativeID, icon } = this.props;
|
|
234
235
|
const selectedItem = items.find(x => x.value === value);
|
|
235
236
|
const styles = this.getStyles();
|
|
236
|
-
const theme = theme_1.getTheme();
|
|
237
|
+
const theme = (0, theme_1.getTheme)();
|
|
237
238
|
return (React.createElement(react_native_1.TouchableWithoutFeedback, { onPress: () => this.setState({ modalOpen: true }), disabled: disabled },
|
|
238
239
|
React.createElement(react_native_1.View, { nativeID: nativeID, style: [styles.container, style, disabled ? styles.readonly : null] },
|
|
239
240
|
icon ? (React.createElement(FontAwesome_1.default, { name: icon, style: styles.iconOnLine })) : (React.createElement(react_native_1.Text, { style: [styles.label, labelStyle] }, label)),
|
|
@@ -257,7 +258,7 @@ class DropDown extends React.Component {
|
|
|
257
258
|
React.createElement(react_native_1.Text, { style: styles.modalItem }, emptyMessage)))))))));
|
|
258
259
|
}
|
|
259
260
|
}
|
|
261
|
+
exports.DropDown = DropDown;
|
|
260
262
|
DropDown.defaultProps = {
|
|
261
263
|
emptyMessage: 'Não há registros cadastrados'
|
|
262
264
|
};
|
|
263
|
-
exports.DropDown = DropDown;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.ErrorMessage = void 0;
|
|
3
4
|
const React = require("react");
|
|
4
5
|
const react_native_1 = require("react-native");
|
|
5
6
|
const theme_1 = require("../modules/theme");
|
|
@@ -7,7 +8,7 @@ class ErrorMessage extends React.Component {
|
|
|
7
8
|
constructor() {
|
|
8
9
|
super(...arguments);
|
|
9
10
|
this.getStyles = () => {
|
|
10
|
-
const theme = theme_1.getTheme();
|
|
11
|
+
const theme = (0, theme_1.getTheme)();
|
|
11
12
|
const styles = react_native_1.StyleSheet.create({
|
|
12
13
|
errorMessage: {
|
|
13
14
|
fontFamily: theme.fontFamily3,
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.FilePicker = void 0;
|
|
3
4
|
const React = require("react");
|
|
4
5
|
const react_native_1 = require("react-native");
|
|
5
6
|
const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
|
|
@@ -9,7 +10,7 @@ class FilePicker extends React.Component {
|
|
|
9
10
|
constructor() {
|
|
10
11
|
super(...arguments);
|
|
11
12
|
this.getStyles = () => {
|
|
12
|
-
const theme = theme_1.getTheme();
|
|
13
|
+
const theme = (0, theme_1.getTheme)();
|
|
13
14
|
const styles = react_native_1.StyleSheet.create({
|
|
14
15
|
container: {
|
|
15
16
|
borderRadius: 3,
|
|
@@ -20,7 +21,7 @@ class FilePicker extends React.Component {
|
|
|
20
21
|
},
|
|
21
22
|
text: {
|
|
22
23
|
fontFamily: theme.fontFamily1,
|
|
23
|
-
fontSize: layout_1.isTablet() ? 15 : 12,
|
|
24
|
+
fontSize: (0, layout_1.isTablet)() ? 15 : 12,
|
|
24
25
|
color: theme.textColor3,
|
|
25
26
|
width: 200,
|
|
26
27
|
textAlign: 'center'
|
|
@@ -30,15 +31,15 @@ class FilePicker extends React.Component {
|
|
|
30
31
|
};
|
|
31
32
|
}
|
|
32
33
|
render() {
|
|
33
|
-
const { label, onPress, icon } = this.props;
|
|
34
|
-
const theme = theme_1.getTheme();
|
|
34
|
+
const { label, onPress, icon, nativeID } = this.props;
|
|
35
|
+
const theme = (0, theme_1.getTheme)();
|
|
35
36
|
const styles = this.getStyles();
|
|
36
37
|
return (React.createElement(react_native_1.TouchableOpacity, { activeOpacity: 0.5, style: styles.container, onPress: onPress },
|
|
37
38
|
React.createElement(FontAwesome_1.default, { name: icon, color: theme.textColor3, size: 30 }),
|
|
38
|
-
React.createElement(react_native_1.Text, { style: styles.text }, label)));
|
|
39
|
+
React.createElement(react_native_1.Text, { nativeID: nativeID, style: styles.text }, label)));
|
|
39
40
|
}
|
|
40
41
|
}
|
|
42
|
+
exports.FilePicker = FilePicker;
|
|
41
43
|
FilePicker.defaultProps = {
|
|
42
44
|
icon: 'cloud-upload'
|
|
43
45
|
};
|
|
44
|
-
exports.FilePicker = FilePicker;
|
|
@@ -50,7 +50,7 @@ export declare class Header extends React.Component<HeaderProperties> {
|
|
|
50
50
|
fontSize: number;
|
|
51
51
|
};
|
|
52
52
|
};
|
|
53
|
-
renderButton: (button: HeaderButton, type:
|
|
54
|
-
renderButtonInvisible: (type:
|
|
53
|
+
renderButton: (button: HeaderButton, type: 'left' | 'right') => JSX.Element;
|
|
54
|
+
renderButtonInvisible: (type: 'left' | 'right') => JSX.Element;
|
|
55
55
|
render(): JSX.Element;
|
|
56
56
|
}
|