secullum-react-native-ui 4.16.2-beta.7 → 4.16.2-beta.8
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 +1 -1
- package/lib/components/AppShell.d.ts +0 -52
- package/lib/components/AppShell.js +0 -82
- package/lib/components/Button.d.ts +0 -49
- package/lib/components/Button.js +0 -70
- package/lib/components/Card.d.ts +0 -66
- package/lib/components/Card.js +0 -131
- package/lib/components/CheckBox.d.ts +0 -36
- package/lib/components/CheckBox.js +0 -50
- package/lib/components/DatePicker.d.ts +0 -67
- package/lib/components/DatePicker.js +0 -106
- package/lib/components/DatePicker.web.d.ts +0 -64
- package/lib/components/DatePicker.web.js +0 -106
- package/lib/components/Delay.d.ts +0 -12
- package/lib/components/Delay.js +0 -22
- package/lib/components/Details.d.ts +0 -67
- package/lib/components/Details.js +0 -96
- package/lib/components/DetailsHeader.d.ts +0 -41
- package/lib/components/DetailsHeader.js +0 -65
- package/lib/components/DimensionsMonitor.d.ts +0 -21
- package/lib/components/DimensionsMonitor.js +0 -37
- package/lib/components/DropDown.d.ts +0 -52
- package/lib/components/DropDown.js +0 -351
- package/lib/components/ErrorMessage.d.ts +0 -16
- package/lib/components/ErrorMessage.js +0 -31
- package/lib/components/FilePicker.d.ts +0 -29
- package/lib/components/FilePicker.js +0 -46
- package/lib/components/Header.d.ts +0 -58
- package/lib/components/Header.js +0 -94
- package/lib/components/HeaderDesktop.d.ts +0 -59
- package/lib/components/HeaderDesktop.js +0 -83
- package/lib/components/ImageButton.d.ts +0 -14
- package/lib/components/ImageButton.js +0 -34
- package/lib/components/KeyboardAvoidingView.d.ts +0 -34
- package/lib/components/KeyboardAvoidingView.js +0 -106
- package/lib/components/Link.d.ts +0 -18
- package/lib/components/Link.js +0 -30
- package/lib/components/Loading.d.ts +0 -13
- package/lib/components/Loading.js +0 -45
- package/lib/components/Menu.d.ts +0 -42
- package/lib/components/Menu.js +0 -114
- package/lib/components/MenuDesktop.d.ts +0 -24
- package/lib/components/MenuDesktop.js +0 -39
- package/lib/components/MenuMobile.d.ts +0 -49
- package/lib/components/MenuMobile.js +0 -94
- package/lib/components/Message.d.ts +0 -37
- package/lib/components/Message.js +0 -52
- package/lib/components/Modal.d.ts +0 -18
- package/lib/components/Modal.js +0 -35
- package/lib/components/MultiSelect.d.ts +0 -51
- package/lib/components/MultiSelect.js +0 -377
- package/lib/components/NoRecordMessage.d.ts +0 -23
- package/lib/components/NoRecordMessage.js +0 -36
- package/lib/components/Question.d.ts +0 -57
- package/lib/components/Question.js +0 -79
- package/lib/components/RadioButton.d.ts +0 -43
- package/lib/components/RadioButton.js +0 -55
- package/lib/components/RadioGroup.d.ts +0 -45
- package/lib/components/RadioGroup.js +0 -71
- package/lib/components/RangeDatePicker.d.ts +0 -57
- package/lib/components/RangeDatePicker.js +0 -127
- package/lib/components/RangeDatePicker.web.d.ts +0 -61
- package/lib/components/RangeDatePicker.web.js +0 -120
- package/lib/components/Space.d.ts +0 -11
- package/lib/components/Space.js +0 -15
- package/lib/components/StatusBar.d.ts +0 -18
- package/lib/components/StatusBar.js +0 -33
- package/lib/components/Switch.d.ts +0 -34
- package/lib/components/Switch.js +0 -50
- package/lib/components/Table.d.ts +0 -30
- package/lib/components/Table.js +0 -79
- package/lib/components/Table.web.d.ts +0 -18
- package/lib/components/Table.web.js +0 -111
- package/lib/components/Text.d.ts +0 -29
- package/lib/components/Text.js +0 -38
- package/lib/components/TextBox.d.ts +0 -84
- package/lib/components/TextBox.js +0 -126
- package/lib/components/TextBoxMask.d.ts +0 -12
- package/lib/components/TextBoxMask.js +0 -34
- package/lib/components/TimePicker.d.ts +0 -63
- package/lib/components/TimePicker.js +0 -112
- package/lib/components/TimePicker.web.d.ts +0 -48
- package/lib/components/TimePicker.web.js +0 -88
- package/lib/index.d.ts +0 -40
- package/lib/index.js +0 -56
- package/lib/modules/browser.d.ts +0 -2
- package/lib/modules/browser.js +0 -51
- package/lib/modules/format.d.ts +0 -6
- package/lib/modules/format.js +0 -127
- package/lib/modules/layout.d.ts +0 -1
- package/lib/modules/layout.js +0 -12
- package/lib/modules/test.d.ts +0 -2
- package/lib/modules/test.js +0 -18
- package/lib/modules/theme.d.ts +0 -41
- package/lib/modules/theme.js +0 -52
- package/lib/modules/validation.d.ts +0 -3
- package/lib/modules/validation.js +0 -16
package/lib/components/Table.js
DELETED
|
@@ -1,79 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Table = void 0;
|
|
4
|
-
const React = require("react");
|
|
5
|
-
const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
|
|
6
|
-
const theme_1 = require("../modules/theme");
|
|
7
|
-
const test_1 = require("../modules/test");
|
|
8
|
-
const react_native_1 = require("react-native");
|
|
9
|
-
const CheckBox_1 = require("./CheckBox");
|
|
10
|
-
class Table extends React.Component {
|
|
11
|
-
constructor() {
|
|
12
|
-
super(...arguments);
|
|
13
|
-
this.renderHeaderColumn = (column) => {
|
|
14
|
-
const { data, onSelectAll } = this.props;
|
|
15
|
-
if (column.type === 'checkbox') {
|
|
16
|
-
return (React.createElement(CheckBox_1.CheckBox, { key: column.key, style: { marginLeft: 8 }, value: data.every(x => x.selected) || false, onChange: value => onSelectAll && onSelectAll(value) }));
|
|
17
|
-
}
|
|
18
|
-
return (React.createElement(react_native_1.Text, { key: column.key, style: [
|
|
19
|
-
styles.cell,
|
|
20
|
-
styles.cellHeader,
|
|
21
|
-
column.style,
|
|
22
|
-
column.headerStyle
|
|
23
|
-
] }, column.title));
|
|
24
|
-
};
|
|
25
|
-
this.renderDataTable = (row, rowIndex) => {
|
|
26
|
-
const { idAttribute, columns, cellStyle, onSelect } = this.props;
|
|
27
|
-
return (React.createElement(react_native_1.View, { key: row[idAttribute].toString(), style: [
|
|
28
|
-
styles.row,
|
|
29
|
-
{
|
|
30
|
-
backgroundColor: rowIndex % 2 === 0
|
|
31
|
-
? theme.backgroundColor2
|
|
32
|
-
: theme.backgroundColor1
|
|
33
|
-
}
|
|
34
|
-
] }, columns.map(column => {
|
|
35
|
-
const style = cellStyle &&
|
|
36
|
-
cellStyle[row[idAttribute].toString()] &&
|
|
37
|
-
cellStyle[row[idAttribute].toString()][column.key];
|
|
38
|
-
return column.type === 'icon' ? (React.createElement(FontAwesome_1.default, { key: column.key, name: row[column.key].toString(),
|
|
39
|
-
// @ts-ignore : The component uses a different version of typing
|
|
40
|
-
style: [styles.cellIcon, style, column.style] })) : column.type === 'checkbox' ? (React.createElement(CheckBox_1.CheckBox, { key: column.key, style: { marginLeft: 8 }, value: row.selected || false, onChange: value => onSelect && onSelect(row[column.key].toString(), value) })) : (React.createElement(react_native_1.Text, { key: column.key, style: [styles.cell, style, column.style] }, row[column.key].toString()));
|
|
41
|
-
})));
|
|
42
|
-
};
|
|
43
|
-
}
|
|
44
|
-
render() {
|
|
45
|
-
const { columns, data, style, nativeID, subHeaderData } = this.props;
|
|
46
|
-
return (React.createElement(react_native_1.ScrollView, { horizontal: true },
|
|
47
|
-
React.createElement(react_native_1.View, { nativeID: nativeID, style: style, testID: (0, test_1.getTestID)(nativeID) },
|
|
48
|
-
React.createElement(react_native_1.View, { style: styles.row }, columns.map(column => this.renderHeaderColumn(column))),
|
|
49
|
-
subHeaderData && (React.createElement(react_native_1.View, { style: styles.row }, subHeaderData.map(column => this.renderHeaderColumn(column)))),
|
|
50
|
-
data.map((row, rowIndex) => this.renderDataTable(row, rowIndex)))));
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
exports.Table = Table;
|
|
54
|
-
const theme = (0, theme_1.getTheme)();
|
|
55
|
-
const styles = react_native_1.StyleSheet.create({
|
|
56
|
-
row: {
|
|
57
|
-
flexDirection: 'row',
|
|
58
|
-
alignItems: 'center',
|
|
59
|
-
paddingVertical: 8,
|
|
60
|
-
minHeight: 45
|
|
61
|
-
},
|
|
62
|
-
cell: {
|
|
63
|
-
fontFamily: theme.fontFamily2,
|
|
64
|
-
fontSize: 14,
|
|
65
|
-
marginLeft: 8,
|
|
66
|
-
lineHeight: 18,
|
|
67
|
-
color: theme.textColor1
|
|
68
|
-
},
|
|
69
|
-
cellHeader: {
|
|
70
|
-
fontFamily: theme.fontFamily1,
|
|
71
|
-
color: theme.textColor1
|
|
72
|
-
},
|
|
73
|
-
cellIcon: {
|
|
74
|
-
fontSize: 24,
|
|
75
|
-
marginLeft: 8,
|
|
76
|
-
textAlign: 'center',
|
|
77
|
-
textAlignVertical: 'center'
|
|
78
|
-
}
|
|
79
|
-
});
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { TableProperties, TableColumn } from './Table';
|
|
3
|
-
interface State {
|
|
4
|
-
leftHeader: number;
|
|
5
|
-
}
|
|
6
|
-
interface Props {
|
|
7
|
-
heightContainer: number;
|
|
8
|
-
}
|
|
9
|
-
export declare class Table extends React.Component<Props & TableProperties, State> {
|
|
10
|
-
state: State;
|
|
11
|
-
static defaultProps: {
|
|
12
|
-
heightContainer: number;
|
|
13
|
-
};
|
|
14
|
-
renderHeaderTable: (headerData: Array<TableColumn>) => JSX.Element;
|
|
15
|
-
renderDataTable: () => JSX.Element;
|
|
16
|
-
render(): JSX.Element;
|
|
17
|
-
}
|
|
18
|
-
export {};
|
|
@@ -1,111 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Table = void 0;
|
|
4
|
-
const React = require("react");
|
|
5
|
-
const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
|
|
6
|
-
const theme_1 = require("../modules/theme");
|
|
7
|
-
const react_native_1 = require("react-native");
|
|
8
|
-
const browser_1 = require("../modules/browser");
|
|
9
|
-
const CheckBox_1 = require("./CheckBox");
|
|
10
|
-
class Table extends React.Component {
|
|
11
|
-
constructor() {
|
|
12
|
-
super(...arguments);
|
|
13
|
-
this.state = {
|
|
14
|
-
leftHeader: 0
|
|
15
|
-
};
|
|
16
|
-
this.renderHeaderTable = (headerData) => {
|
|
17
|
-
const { onSelectAll, data, nativeID } = this.props;
|
|
18
|
-
const { leftHeader } = this.state;
|
|
19
|
-
return (React.createElement("div", { style: {
|
|
20
|
-
overflow: 'hidden',
|
|
21
|
-
position: 'relative',
|
|
22
|
-
height: 45
|
|
23
|
-
} },
|
|
24
|
-
React.createElement("div", { style: {
|
|
25
|
-
flexDirection: 'row',
|
|
26
|
-
alignItems: 'center',
|
|
27
|
-
paddingBottom: 8,
|
|
28
|
-
minHeight: 45,
|
|
29
|
-
position: 'absolute',
|
|
30
|
-
left: leftHeader,
|
|
31
|
-
display: 'flex',
|
|
32
|
-
paddingTop: (0, browser_1.ehIE)() ? 15 : 0
|
|
33
|
-
} }, headerData.map((column, index) => {
|
|
34
|
-
const headerId = nativeID && `${nativeID}-header-${index + 1}`;
|
|
35
|
-
return column.type === 'checkbox' ? (React.createElement(CheckBox_1.CheckBox, { nativeID: headerId, key: column.key, style: { marginLeft: 8 }, value: data.every(x => x.selected) || false, onChange: value => onSelectAll && onSelectAll(value) })) : (React.createElement(react_native_1.Text, { nativeID: headerId, key: column.key, style: [
|
|
36
|
-
styles.cell,
|
|
37
|
-
styles.cellHeader,
|
|
38
|
-
column.style,
|
|
39
|
-
column.headerStyle
|
|
40
|
-
] }, column.title));
|
|
41
|
-
}))));
|
|
42
|
-
};
|
|
43
|
-
this.renderDataTable = () => {
|
|
44
|
-
const { columns, data, idAttribute, cellStyle, heightContainer, subHeaderData, onSelect, nativeID } = this.props;
|
|
45
|
-
const height = subHeaderData ? heightContainer - 45 : heightContainer;
|
|
46
|
-
return (React.createElement("div", { style: {
|
|
47
|
-
height,
|
|
48
|
-
display: 'flex',
|
|
49
|
-
overflowX: 'scroll',
|
|
50
|
-
overflowY: 'scroll'
|
|
51
|
-
}, onScroll: (event) => {
|
|
52
|
-
this.setState({ leftHeader: event ? -event.target.scrollLeft : 0 });
|
|
53
|
-
} },
|
|
54
|
-
React.createElement("div", null,
|
|
55
|
-
React.createElement(react_native_1.FlatList, { data: data, keyExtractor: item => item.id.toString(), renderItem: ({ item, index }) => (React.createElement(react_native_1.View, { key: index, style: [
|
|
56
|
-
styles.row,
|
|
57
|
-
{
|
|
58
|
-
backgroundColor: index % 2 === 0
|
|
59
|
-
? theme.backgroundColor2
|
|
60
|
-
: theme.backgroundColor1
|
|
61
|
-
}
|
|
62
|
-
] }, columns.map((column, columnIndex) => {
|
|
63
|
-
const style = cellStyle &&
|
|
64
|
-
cellStyle[item[idAttribute].toString()] &&
|
|
65
|
-
cellStyle[item[idAttribute].toString()][column.key];
|
|
66
|
-
const cellID = nativeID && `${nativeID}-${index + 1}-${columnIndex + 1}`;
|
|
67
|
-
return column.type === 'icon' ? (React.createElement(FontAwesome_1.default, { nativeID: cellID, key: column.key, name: item[column.key].toString(),
|
|
68
|
-
// @ts-ignore : The component uses a different version of typing
|
|
69
|
-
style: [styles.cellIcon, style, column.style] })) : column.type === 'checkbox' ? (React.createElement(CheckBox_1.CheckBox, { nativeID: cellID, key: column.key, style: { marginLeft: 8 }, value: item.selected || false, onChange: value => onSelect && onSelect(item[column.key].toString(), value) })) : (React.createElement(react_native_1.Text, { nativeID: cellID, key: column.key, style: [styles.cell, style, column.style] }, item[column.key].toString()));
|
|
70
|
-
}))) }))));
|
|
71
|
-
};
|
|
72
|
-
}
|
|
73
|
-
render() {
|
|
74
|
-
const { columns, nativeID, subHeaderData } = this.props;
|
|
75
|
-
return (React.createElement(react_native_1.View, { nativeID: nativeID },
|
|
76
|
-
this.renderHeaderTable(columns),
|
|
77
|
-
subHeaderData && this.renderHeaderTable(subHeaderData),
|
|
78
|
-
this.renderDataTable()));
|
|
79
|
-
}
|
|
80
|
-
}
|
|
81
|
-
exports.Table = Table;
|
|
82
|
-
Table.defaultProps = {
|
|
83
|
-
//Top = 60px, padding = 16px, filters = 143px, padding = 16px, header = 45px, padding = 16
|
|
84
|
-
heightContainer: react_native_1.Dimensions.get('window').height - 296
|
|
85
|
-
};
|
|
86
|
-
const theme = (0, theme_1.getTheme)();
|
|
87
|
-
const styles = react_native_1.StyleSheet.create({
|
|
88
|
-
row: {
|
|
89
|
-
flexDirection: 'row',
|
|
90
|
-
alignItems: 'center',
|
|
91
|
-
paddingVertical: 8,
|
|
92
|
-
minHeight: 45
|
|
93
|
-
},
|
|
94
|
-
cell: {
|
|
95
|
-
fontFamily: theme.fontFamily2,
|
|
96
|
-
fontSize: 14,
|
|
97
|
-
marginLeft: 8,
|
|
98
|
-
lineHeight: 18,
|
|
99
|
-
color: theme.textColor1
|
|
100
|
-
},
|
|
101
|
-
cellHeader: {
|
|
102
|
-
fontFamily: theme.fontFamily1,
|
|
103
|
-
color: theme.textColor1
|
|
104
|
-
},
|
|
105
|
-
cellIcon: {
|
|
106
|
-
fontSize: 24,
|
|
107
|
-
marginLeft: 8,
|
|
108
|
-
textAlign: 'center',
|
|
109
|
-
textAlignVertical: 'center'
|
|
110
|
-
}
|
|
111
|
-
});
|
package/lib/components/Text.d.ts
DELETED
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { StyleProp, TextStyle } from 'react-native';
|
|
3
|
-
export interface TextProperties {
|
|
4
|
-
style?: StyleProp<TextStyle>;
|
|
5
|
-
bold: boolean;
|
|
6
|
-
size: number;
|
|
7
|
-
flex?: number;
|
|
8
|
-
color: string;
|
|
9
|
-
align?: 'auto' | 'left' | 'right' | 'center' | 'justify';
|
|
10
|
-
nativeID?: string;
|
|
11
|
-
children?: React.ReactNode;
|
|
12
|
-
}
|
|
13
|
-
export declare class Text extends React.Component<TextProperties> {
|
|
14
|
-
getStyles: () => {
|
|
15
|
-
text: {
|
|
16
|
-
color: string;
|
|
17
|
-
flex: number | undefined;
|
|
18
|
-
fontSize: number;
|
|
19
|
-
textAlign: "left" | "right" | "auto" | "center" | "justify" | undefined;
|
|
20
|
-
fontFamily: string;
|
|
21
|
-
};
|
|
22
|
-
};
|
|
23
|
-
static defaultProps: {
|
|
24
|
-
bold: boolean;
|
|
25
|
-
size: number;
|
|
26
|
-
color: string;
|
|
27
|
-
};
|
|
28
|
-
render(): JSX.Element;
|
|
29
|
-
}
|
package/lib/components/Text.js
DELETED
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Text = void 0;
|
|
4
|
-
const React = require("react");
|
|
5
|
-
const react_native_1 = require("react-native");
|
|
6
|
-
const theme_1 = require("../modules/theme");
|
|
7
|
-
const test_1 = require("../modules/test");
|
|
8
|
-
const theme = (0, theme_1.getTheme)();
|
|
9
|
-
class Text extends React.Component {
|
|
10
|
-
constructor() {
|
|
11
|
-
super(...arguments);
|
|
12
|
-
this.getStyles = () => {
|
|
13
|
-
const { bold, color, size, flex, align } = this.props;
|
|
14
|
-
const theme = (0, theme_1.getTheme)();
|
|
15
|
-
const styles = react_native_1.StyleSheet.create({
|
|
16
|
-
text: {
|
|
17
|
-
color,
|
|
18
|
-
flex,
|
|
19
|
-
fontSize: size,
|
|
20
|
-
textAlign: align,
|
|
21
|
-
fontFamily: bold ? theme.fontFamily1 : theme.fontFamily2
|
|
22
|
-
}
|
|
23
|
-
});
|
|
24
|
-
return styles;
|
|
25
|
-
};
|
|
26
|
-
}
|
|
27
|
-
render() {
|
|
28
|
-
const { style, children, nativeID } = this.props;
|
|
29
|
-
const textStyle = this.getStyles();
|
|
30
|
-
return (React.createElement(react_native_1.Text, { nativeID: nativeID, testID: (0, test_1.getTestID)(nativeID), style: [textStyle.text, style] }, children));
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
exports.Text = Text;
|
|
34
|
-
Text.defaultProps = {
|
|
35
|
-
bold: false,
|
|
36
|
-
size: 14,
|
|
37
|
-
color: theme.textColor1
|
|
38
|
-
};
|
|
@@ -1,84 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { KeyboardType, StyleProp, TextInput, TextInputKeyPressEventData, TextStyle, ViewStyle, TextInputProps, ReturnKeyTypeOptions } from 'react-native';
|
|
3
|
-
export interface TextBoxInputProps extends TextInputProps {
|
|
4
|
-
ref: (ref: TextInput) => void;
|
|
5
|
-
}
|
|
6
|
-
export interface TextBoxProperties {
|
|
7
|
-
autoFocus?: boolean;
|
|
8
|
-
label?: string;
|
|
9
|
-
icon?: string;
|
|
10
|
-
placeholder?: string;
|
|
11
|
-
value: string;
|
|
12
|
-
onChange?: (value: string) => void;
|
|
13
|
-
onKeyPress?: (nativeEvent: TextInputKeyPressEventData) => void;
|
|
14
|
-
onBlur?: () => void;
|
|
15
|
-
renderInput?: (props: TextBoxInputProps) => JSX.Element;
|
|
16
|
-
onSubmitEditing?: () => void;
|
|
17
|
-
inputRef?: (value: TextInput) => void;
|
|
18
|
-
onPress?: () => void;
|
|
19
|
-
secureTextEntry?: boolean;
|
|
20
|
-
multiline?: boolean;
|
|
21
|
-
keyboardType?: KeyboardType;
|
|
22
|
-
style?: StyleProp<ViewStyle>;
|
|
23
|
-
labelStyle?: StyleProp<TextStyle>;
|
|
24
|
-
inputStyle?: StyleProp<TextStyle>;
|
|
25
|
-
editable?: boolean;
|
|
26
|
-
autoCorrect?: boolean;
|
|
27
|
-
maxLength?: number;
|
|
28
|
-
autoCapitalize?: 'none' | 'sentences' | 'words' | 'characters';
|
|
29
|
-
returnKeyType?: ReturnKeyTypeOptions;
|
|
30
|
-
blurOnSubmit?: boolean;
|
|
31
|
-
nativeID?: string;
|
|
32
|
-
selection?: {
|
|
33
|
-
start: number;
|
|
34
|
-
end?: number;
|
|
35
|
-
};
|
|
36
|
-
}
|
|
37
|
-
export declare class TextBox extends React.Component<TextBoxProperties> {
|
|
38
|
-
input: TextInput | null;
|
|
39
|
-
static defaultProps: {
|
|
40
|
-
editable: boolean;
|
|
41
|
-
autoCorrect: boolean;
|
|
42
|
-
blurOnSubmit: boolean;
|
|
43
|
-
};
|
|
44
|
-
getStyles: () => {
|
|
45
|
-
container: {
|
|
46
|
-
flexDirection?: "row" | undefined;
|
|
47
|
-
paddingHorizontal: number;
|
|
48
|
-
paddingVertical: number;
|
|
49
|
-
borderWidth: number;
|
|
50
|
-
borderColor: string;
|
|
51
|
-
borderRadius: number;
|
|
52
|
-
};
|
|
53
|
-
icon: {
|
|
54
|
-
color: string;
|
|
55
|
-
fontSize: number;
|
|
56
|
-
marginRight: number;
|
|
57
|
-
alignSelf: "center";
|
|
58
|
-
minHeight: number;
|
|
59
|
-
};
|
|
60
|
-
label: {
|
|
61
|
-
color: string;
|
|
62
|
-
fontFamily: string;
|
|
63
|
-
fontSize: number;
|
|
64
|
-
lineHeight: number;
|
|
65
|
-
};
|
|
66
|
-
input: {
|
|
67
|
-
flex?: number | undefined;
|
|
68
|
-
outlineStyle?: string | undefined;
|
|
69
|
-
color: string;
|
|
70
|
-
fontFamily: string;
|
|
71
|
-
fontWeight: "normal";
|
|
72
|
-
fontSize: number;
|
|
73
|
-
minHeight: number;
|
|
74
|
-
padding: number;
|
|
75
|
-
margin: number;
|
|
76
|
-
};
|
|
77
|
-
readonly: {
|
|
78
|
-
backgroundColor: string;
|
|
79
|
-
};
|
|
80
|
-
};
|
|
81
|
-
focus: () => void;
|
|
82
|
-
renderInput: (props: TextInputProps) => JSX.Element;
|
|
83
|
-
render(): JSX.Element;
|
|
84
|
-
}
|
|
@@ -1,126 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
|
-
var t = {};
|
|
4
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5
|
-
t[p] = s[p];
|
|
6
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
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
|
-
}
|
|
11
|
-
return t;
|
|
12
|
-
};
|
|
13
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
14
|
-
exports.TextBox = void 0;
|
|
15
|
-
const React = require("react");
|
|
16
|
-
const theme_1 = require("../modules/theme");
|
|
17
|
-
const layout_1 = require("../modules/layout");
|
|
18
|
-
const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
|
|
19
|
-
const test_1 = require("../modules/test");
|
|
20
|
-
const react_native_1 = require("react-native");
|
|
21
|
-
class TextBox extends React.Component {
|
|
22
|
-
constructor() {
|
|
23
|
-
super(...arguments);
|
|
24
|
-
this.input = null;
|
|
25
|
-
this.getStyles = () => {
|
|
26
|
-
const theme = (0, theme_1.getTheme)();
|
|
27
|
-
const { icon } = this.props;
|
|
28
|
-
const styles = react_native_1.StyleSheet.create({
|
|
29
|
-
container: Object.assign({ paddingHorizontal: 16, paddingVertical: 8, borderWidth: 1, borderColor: theme.borderColor1, borderRadius: 3 }, (icon ? { flexDirection: 'row' } : {})),
|
|
30
|
-
icon: {
|
|
31
|
-
color: theme.textColor2,
|
|
32
|
-
fontSize: (0, layout_1.isTablet)() ? 21 : 19,
|
|
33
|
-
marginRight: 10,
|
|
34
|
-
alignSelf: 'center',
|
|
35
|
-
minHeight: 22
|
|
36
|
-
},
|
|
37
|
-
label: {
|
|
38
|
-
color: theme.textColor2,
|
|
39
|
-
fontFamily: theme.fontFamily3,
|
|
40
|
-
fontSize: (0, layout_1.isTablet)() ? 15 : 12,
|
|
41
|
-
lineHeight: 16
|
|
42
|
-
},
|
|
43
|
-
input: Object.assign(Object.assign({ color: theme.textColor1, fontFamily: this.props.value ? theme.fontFamily1 : theme.fontFamily3, fontWeight: 'normal', fontSize: 16, minHeight: 22, padding: 0, margin: 0 }, (react_native_1.Platform.OS === 'web' ? { outlineStyle: 'none' } : {})), (icon ? { flex: 1 } : {})),
|
|
44
|
-
readonly: {
|
|
45
|
-
backgroundColor: theme.disabledColor
|
|
46
|
-
}
|
|
47
|
-
});
|
|
48
|
-
return styles;
|
|
49
|
-
};
|
|
50
|
-
this.focus = () => {
|
|
51
|
-
if (this.input && this.props.editable) {
|
|
52
|
-
this.input.focus();
|
|
53
|
-
}
|
|
54
|
-
};
|
|
55
|
-
this.renderInput = (props) => {
|
|
56
|
-
const { nativeID } = props, otherProps = __rest(props, ["nativeID"]);
|
|
57
|
-
return (React.createElement(react_native_1.TextInput, Object.assign({ nativeID: nativeID, testID: (0, test_1.getTestID)(nativeID) }, otherProps)));
|
|
58
|
-
};
|
|
59
|
-
}
|
|
60
|
-
render() {
|
|
61
|
-
const { label, style, labelStyle, editable, inputRef, renderInput, icon, onPress } = this.props;
|
|
62
|
-
const styles = this.getStyles();
|
|
63
|
-
const incomingProps = {
|
|
64
|
-
nativeID: this.props.nativeID,
|
|
65
|
-
testID: (0, test_1.getTestID)(this.props.nativeID),
|
|
66
|
-
autoFocus: this.props.autoFocus,
|
|
67
|
-
value: this.props.value,
|
|
68
|
-
onChangeText: this.props.onChange,
|
|
69
|
-
onBlur: this.props.onBlur,
|
|
70
|
-
style: [
|
|
71
|
-
styles.input,
|
|
72
|
-
this.props.inputStyle,
|
|
73
|
-
this.props.editable ? null : styles.readonly
|
|
74
|
-
],
|
|
75
|
-
underlineColorAndroid: 'transparent',
|
|
76
|
-
//@ts-ignore: no Android < 6 essa é a prop que deixa o underline transparente. https://stackoverflow.com/questions/40478246/remove-underline-in-inputtext-in-react-native
|
|
77
|
-
borderWidth: 0,
|
|
78
|
-
placeholder: this.props.placeholder,
|
|
79
|
-
// We set a fixed color for the placeholder to prevent it from being affected by the device's theme.
|
|
80
|
-
// Related issue on GitLab: 12074
|
|
81
|
-
placeholderTextColor: (0, theme_1.getTheme)().textColor3,
|
|
82
|
-
secureTextEntry: this.props.secureTextEntry,
|
|
83
|
-
multiline: this.props.multiline,
|
|
84
|
-
editable: this.props.editable,
|
|
85
|
-
keyboardType: this.props.keyboardType,
|
|
86
|
-
maxLength: this.props.maxLength,
|
|
87
|
-
onSubmitEditing: this.props.onSubmitEditing,
|
|
88
|
-
autoCapitalize: this.props.autoCapitalize,
|
|
89
|
-
autoCorrect: this.props.autoCorrect,
|
|
90
|
-
returnKeyType: react_native_1.Platform.OS === 'ios' &&
|
|
91
|
-
this.props.keyboardType === 'numeric' &&
|
|
92
|
-
this.props.returnKeyType === 'next'
|
|
93
|
-
? 'done'
|
|
94
|
-
: this.props.returnKeyType,
|
|
95
|
-
ref: (input) => {
|
|
96
|
-
this.input = input;
|
|
97
|
-
if (inputRef)
|
|
98
|
-
inputRef(input);
|
|
99
|
-
},
|
|
100
|
-
selection: this.props.selection,
|
|
101
|
-
onKeyPress: (event) => {
|
|
102
|
-
if (!this.props.onKeyPress) {
|
|
103
|
-
return;
|
|
104
|
-
}
|
|
105
|
-
this.props.onKeyPress(react_native_1.Platform.OS === 'web' ? event : event.nativeEvent);
|
|
106
|
-
}
|
|
107
|
-
};
|
|
108
|
-
return (React.createElement(react_native_1.TouchableWithoutFeedback, { accessible: false, onPress: () => (onPress ? onPress() : this.focus()), ref: ref => {
|
|
109
|
-
if (react_native_1.Platform.OS === 'web' && ref != null) {
|
|
110
|
-
// @ts-ignore na web, a ref recebida é o próprio elemento DOM
|
|
111
|
-
ref.tabIndex = -1;
|
|
112
|
-
}
|
|
113
|
-
} },
|
|
114
|
-
React.createElement(react_native_1.View, { style: [styles.container, style, editable ? null : styles.readonly] },
|
|
115
|
-
icon ? (React.createElement(FontAwesome_1.default, { name: icon, style: styles.icon })) : (React.createElement(react_native_1.Text, { style: [styles.label, labelStyle] }, label)),
|
|
116
|
-
renderInput
|
|
117
|
-
? renderInput(incomingProps)
|
|
118
|
-
: this.renderInput(incomingProps))));
|
|
119
|
-
}
|
|
120
|
-
}
|
|
121
|
-
exports.TextBox = TextBox;
|
|
122
|
-
TextBox.defaultProps = {
|
|
123
|
-
editable: true,
|
|
124
|
-
autoCorrect: false,
|
|
125
|
-
blurOnSubmit: true
|
|
126
|
-
};
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { TextBoxProperties } from './TextBox';
|
|
3
|
-
import { TextInputMaskTypeProp, TextInputMaskOptionProp } from 'react-native-masked-text';
|
|
4
|
-
export declare type MaskType = TextInputMaskTypeProp;
|
|
5
|
-
export declare type MaskOptions = TextInputMaskOptionProp;
|
|
6
|
-
export interface TextBoxMaskProperties extends TextBoxProperties {
|
|
7
|
-
type: MaskType;
|
|
8
|
-
options?: MaskOptions;
|
|
9
|
-
}
|
|
10
|
-
export declare class TextBoxMask extends React.Component<TextBoxMaskProperties> {
|
|
11
|
-
render(): JSX.Element;
|
|
12
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
|
-
var t = {};
|
|
4
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5
|
-
t[p] = s[p];
|
|
6
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
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
|
-
}
|
|
11
|
-
return t;
|
|
12
|
-
};
|
|
13
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
14
|
-
exports.TextBoxMask = void 0;
|
|
15
|
-
const React = require("react");
|
|
16
|
-
const TextBox_1 = require("./TextBox");
|
|
17
|
-
const react_native_1 = require("react-native");
|
|
18
|
-
const react_native_masked_text_1 = require("react-native-masked-text");
|
|
19
|
-
class TextBoxMask extends React.Component {
|
|
20
|
-
render() {
|
|
21
|
-
const _a = this.props, { type, options } = _a, textBoxProps = __rest(_a, ["type", "options"]);
|
|
22
|
-
return (React.createElement(TextBox_1.TextBox, Object.assign({}, textBoxProps, { renderInput: props => {
|
|
23
|
-
const { ref } = props, otherProps = __rest(props, ["ref"]);
|
|
24
|
-
return react_native_1.Platform.OS === 'web' ? (
|
|
25
|
-
// @ts-ignore :Waiting for typing https://github.com/benhurott/react-native-masked-text/pull/74
|
|
26
|
-
React.createElement(react_native_masked_text_1.TextInputMask, Object.assign({}, otherProps, { type: type, options: options }))) : (
|
|
27
|
-
// @ts-ignore :Waiting for typing https://github.com/benhurott/react-native-masked-text/pull/74
|
|
28
|
-
React.createElement(react_native_masked_text_1.TextInputMask, Object.assign({}, otherProps, {
|
|
29
|
-
// @ts-ignore : The component uses a different version of typing
|
|
30
|
-
refInput: ref, type: type, options: options })));
|
|
31
|
-
} })));
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
exports.TextBoxMask = TextBoxMask;
|
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { StyleProp, ViewStyle } from 'react-native';
|
|
3
|
-
export interface TimePickerProperties {
|
|
4
|
-
label: string;
|
|
5
|
-
value: string;
|
|
6
|
-
clearable?: boolean;
|
|
7
|
-
disabled?: boolean;
|
|
8
|
-
onChange?: (value: string) => void;
|
|
9
|
-
onCancel?: () => void;
|
|
10
|
-
style?: StyleProp<ViewStyle>;
|
|
11
|
-
nativeID?: string;
|
|
12
|
-
}
|
|
13
|
-
export interface TimePickerState {
|
|
14
|
-
showModal: boolean;
|
|
15
|
-
isDarkModeEnabled: boolean;
|
|
16
|
-
}
|
|
17
|
-
export declare class TimePicker extends React.Component<TimePickerProperties, TimePickerState> {
|
|
18
|
-
static defaultProps: {
|
|
19
|
-
clearable: boolean;
|
|
20
|
-
};
|
|
21
|
-
state: TimePickerState;
|
|
22
|
-
appearanceSubscription: any;
|
|
23
|
-
componentDidMount(): void;
|
|
24
|
-
componentWillUnmount(): void;
|
|
25
|
-
handlePress: () => void;
|
|
26
|
-
handleConfirm: (value: Date) => void;
|
|
27
|
-
handleCancel: () => void;
|
|
28
|
-
handleClear: () => void;
|
|
29
|
-
getStyles: () => {
|
|
30
|
-
container: {
|
|
31
|
-
paddingHorizontal: number;
|
|
32
|
-
paddingVertical: number;
|
|
33
|
-
borderWidth: number;
|
|
34
|
-
borderColor: string;
|
|
35
|
-
borderRadius: number;
|
|
36
|
-
flexDirection: "row";
|
|
37
|
-
alignItems: "center";
|
|
38
|
-
};
|
|
39
|
-
label: {
|
|
40
|
-
color: string;
|
|
41
|
-
fontFamily: string;
|
|
42
|
-
fontSize: number;
|
|
43
|
-
lineHeight: number;
|
|
44
|
-
};
|
|
45
|
-
value: {
|
|
46
|
-
color: string;
|
|
47
|
-
fontFamily: string;
|
|
48
|
-
fontSize: number;
|
|
49
|
-
lineHeight: number;
|
|
50
|
-
minHeight: number;
|
|
51
|
-
};
|
|
52
|
-
readonly: {
|
|
53
|
-
backgroundColor: string;
|
|
54
|
-
};
|
|
55
|
-
clearIcon: {
|
|
56
|
-
borderWidth: number;
|
|
57
|
-
marginLeft: string;
|
|
58
|
-
height: string;
|
|
59
|
-
width: string;
|
|
60
|
-
};
|
|
61
|
-
};
|
|
62
|
-
render(): JSX.Element;
|
|
63
|
-
}
|