ferns-ui 0.6.4 → 0.8.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/dist/Common.d.ts +1 -0
- package/dist/Common.js.map +1 -1
- package/dist/DateTimeActionSheet.d.ts +1 -6
- package/dist/DateTimeActionSheet.js +15 -20
- package/dist/DateTimeActionSheet.js.map +1 -1
- package/dist/Field.js +2 -4
- package/dist/Field.js.map +1 -1
- package/dist/TextField.d.ts +2 -48
- package/dist/TextField.js +180 -180
- package/dist/TextField.js.map +1 -1
- package/package.json +37 -37
- package/src/Common.ts +1 -0
- package/src/DateTimeActionSheet.tsx +36 -42
- package/src/Field.tsx +2 -4
- package/src/TextField.tsx +308 -243
package/dist/Common.d.ts
CHANGED
|
@@ -355,6 +355,7 @@ export interface FieldWithLabelsProps {
|
|
|
355
355
|
children?: React.ReactNode;
|
|
356
356
|
}
|
|
357
357
|
export interface TextFieldProps extends FieldWithLabelsProps {
|
|
358
|
+
innerRef?: any;
|
|
358
359
|
id?: string;
|
|
359
360
|
onChange: OnChangeCallback;
|
|
360
361
|
autoComplete?: "current-password" | "on" | "off" | "username";
|
package/dist/Common.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Common.js","sourceRoot":"","sources":["../src/Common.ts"],"names":[],"mappings":"AAgVA,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,CAAC;AAkBzB,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAe,EAAE,EAAE;IAClD,OAAO;QACL,EAAE,EAAE,CAAC;QACL,EAAE,EAAE,EAAE;QACN,EAAE,EAAE,EAAE;QACN,EAAE,EAAE,EAAE;QACN,EAAE,EAAE,EAAE;KACP,CAAC,IAAI,IAAI,IAAI,CAAC,CAAC;AAClB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAI,GAAG,EAAE,EAAY,EAAE;IACtD,IAAI,QAAkB,CAAC;IACvB,IAAI,IAAI,GAAG,CAAC,EAAE;QACZ,QAAQ,GAAG,IAAI,CAAC;KACjB;SAAM,IAAI,IAAI,GAAG,EAAE,EAAE;QACpB,QAAQ,GAAG,IAAI,CAAC;KACjB;SAAM,IAAI,IAAI,GAAG,EAAE,EAAE;QACpB,QAAQ,GAAG,IAAI,CAAC;KACjB;SAAM,IAAI,IAAI,GAAG,EAAE,EAAE;QACpB,QAAQ,GAAG,IAAI,CAAC;KACjB;SAAM;QACL,QAAQ,GAAG,IAAI,CAAC;KACjB;IACD,OAAO,QAAQ,CAAC;AAClB,CAAC,CAAC;AAEF,MAAM,UAAU,eAAe,CAAC,OAAgE;IAC9F,OAAO,CAAC;QACN,SAAS,EAAE,QAAQ;QACnB,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,QAAQ;QAChB,KAAK,EAAE,KAAK;QACZ,cAAc,EAAE,KAAK;QACrB,OAAO,EAAE,MAAM;QACf,QAAQ,EAAE,MAAM;KACjB,CAAC,OAAO,CAAC,IAAI,MAAM,CAAU,CAAC;AACjC,CAAC;
|
|
1
|
+
{"version":3,"file":"Common.js","sourceRoot":"","sources":["../src/Common.ts"],"names":[],"mappings":"AAgVA,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,CAAC;AAkBzB,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAe,EAAE,EAAE;IAClD,OAAO;QACL,EAAE,EAAE,CAAC;QACL,EAAE,EAAE,EAAE;QACN,EAAE,EAAE,EAAE;QACN,EAAE,EAAE,EAAE;QACN,EAAE,EAAE,EAAE;KACP,CAAC,IAAI,IAAI,IAAI,CAAC,CAAC;AAClB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAI,GAAG,EAAE,EAAY,EAAE;IACtD,IAAI,QAAkB,CAAC;IACvB,IAAI,IAAI,GAAG,CAAC,EAAE;QACZ,QAAQ,GAAG,IAAI,CAAC;KACjB;SAAM,IAAI,IAAI,GAAG,EAAE,EAAE;QACpB,QAAQ,GAAG,IAAI,CAAC;KACjB;SAAM,IAAI,IAAI,GAAG,EAAE,EAAE;QACpB,QAAQ,GAAG,IAAI,CAAC;KACjB;SAAM,IAAI,IAAI,GAAG,EAAE,EAAE;QACpB,QAAQ,GAAG,IAAI,CAAC;KACjB;SAAM;QACL,QAAQ,GAAG,IAAI,CAAC;KACjB;IACD,OAAO,QAAQ,CAAC;AAClB,CAAC,CAAC;AAEF,MAAM,UAAU,eAAe,CAAC,OAAgE;IAC9F,OAAO,CAAC;QACN,SAAS,EAAE,QAAQ;QACnB,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,QAAQ;QAChB,KAAK,EAAE,KAAK;QACZ,cAAc,EAAE,KAAK;QACrB,OAAO,EAAE,MAAM;QACf,QAAQ,EAAE,MAAM;KACjB,CAAC,OAAO,CAAC,IAAI,MAAM,CAAU,CAAC;AACjC,CAAC;AAs4BD,MAAM,UAAU,UAAU,CAAC,OAAqB;IAC9C,OAAO,CACL,OAAO;QACP,OAAO,CAAC,KAAK;QACb,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,CACrF,CAAC;AACJ,CAAC"}
|
|
@@ -6,10 +6,5 @@ interface DateTimeActionSheetProps {
|
|
|
6
6
|
onChange: OnChangeCallback;
|
|
7
7
|
actionSheetRef: React.RefObject<any>;
|
|
8
8
|
}
|
|
9
|
-
|
|
10
|
-
}
|
|
11
|
-
export declare class DateTimeActionSheet extends React.Component<DateTimeActionSheetProps, DateTimeActionSheetState> {
|
|
12
|
-
constructor(props: DateTimeActionSheetProps);
|
|
13
|
-
render(): JSX.Element;
|
|
14
|
-
}
|
|
9
|
+
export declare function DateTimeActionSheet({ actionSheetRef, mode, value, onChange, }: DateTimeActionSheetProps): JSX.Element;
|
|
15
10
|
export {};
|
|
@@ -4,25 +4,20 @@ import React from "react";
|
|
|
4
4
|
import { ActionSheet } from "./ActionSheet";
|
|
5
5
|
import { Box } from "./Box";
|
|
6
6
|
import { Button } from "./Button";
|
|
7
|
-
export
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
return;
|
|
23
|
-
}
|
|
24
|
-
this.props.onChange({ event, value: date.toString() });
|
|
25
|
-
} }))));
|
|
26
|
-
}
|
|
7
|
+
export function DateTimeActionSheet({ actionSheetRef, mode, value, onChange, }) {
|
|
8
|
+
return (React.createElement(ActionSheet, { ref: actionSheetRef, bounceOnOpen: true, gestureEnabled: true },
|
|
9
|
+
React.createElement(Box, { marginBottom: 8, paddingX: 4, width: "100%" },
|
|
10
|
+
React.createElement(Box, { alignItems: "end", display: "flex", width: "100%" },
|
|
11
|
+
React.createElement(Box, { width: "33%" },
|
|
12
|
+
React.createElement(Button, { color: "blue", size: "lg", text: "Save", type: "ghost", onClick: () => {
|
|
13
|
+
var _a;
|
|
14
|
+
(_a = actionSheetRef === null || actionSheetRef === void 0 ? void 0 : actionSheetRef.current) === null || _a === void 0 ? void 0 : _a.setModalVisible(false);
|
|
15
|
+
} }))),
|
|
16
|
+
React.createElement(DateTimePicker, { display: "spinner", is24Hour: true, mode: mode, testID: "dateTimePicker", value: moment(value).toDate(), onChange: (event, date) => {
|
|
17
|
+
if (!date) {
|
|
18
|
+
return;
|
|
19
|
+
}
|
|
20
|
+
onChange({ event, value: date.toString() });
|
|
21
|
+
} }))));
|
|
27
22
|
}
|
|
28
23
|
//# sourceMappingURL=DateTimeActionSheet.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTimeActionSheet.js","sourceRoot":"","sources":["../src/DateTimeActionSheet.tsx"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,wCAAwC,CAAC;AACpE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,MAAM,EAAC,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"DateTimeActionSheet.js","sourceRoot":"","sources":["../src/DateTimeActionSheet.tsx"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,wCAAwC,CAAC;AACpE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,MAAM,EAAC,MAAM,UAAU,CAAC;AAUhC,MAAM,UAAU,mBAAmB,CAAC,EAClC,cAAc,EACd,IAAI,EACJ,KAAK,EACL,QAAQ,GACiB;IACzB,OAAO,CACL,oBAAC,WAAW,IAAC,GAAG,EAAE,cAAc,EAAE,YAAY,QAAC,cAAc;QAC3D,oBAAC,GAAG,IAAC,YAAY,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAC,MAAM;YAC7C,oBAAC,GAAG,IAAC,UAAU,EAAC,KAAK,EAAC,OAAO,EAAC,MAAM,EAAC,KAAK,EAAC,MAAM;gBAC/C,oBAAC,GAAG,IAAC,KAAK,EAAC,KAAK;oBACd,oBAAC,MAAM,IACL,KAAK,EAAC,MAAM,EACZ,IAAI,EAAC,IAAI,EACT,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAG,EAAE;;4BACZ,MAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,OAAO,0CAAE,eAAe,CAAC,KAAK,EAAE;wBAClD,CAAC,GACD,CACE,CACF;YACN,oBAAC,cAAc,IACb,OAAO,EAAC,SAAS,EACjB,QAAQ,QACR,IAAI,EAAE,IAAI,EACV,MAAM,EAAC,gBAAgB,EACvB,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,MAAM,EAAE,EAC7B,QAAQ,EAAE,CAAC,KAAU,EAAE,IAAS,EAAE,EAAE;oBAClC,IAAI,CAAC,IAAI,EAAE;wBACT,OAAO;qBACR;oBACD,QAAQ,CAAC,EAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAC,CAAC,CAAC;gBAC5C,CAAC,GACD,CACE,CACM,CACf,CAAC;AACJ,CAAC"}
|
package/dist/Field.js
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import moment from "moment-timezone";
|
|
2
1
|
import React, { useState } from "react";
|
|
3
2
|
import { Box } from "./Box";
|
|
4
3
|
import { FieldWithLabels } from "./FieldWithLabels";
|
|
@@ -81,10 +80,9 @@ export function Field(props) {
|
|
|
81
80
|
return (React.createElement(Switch, { disabled: props.disabled, id: props.name, name: props.name, switched: Boolean(value), onChange: (result) => handleSwitchChange(result) }));
|
|
82
81
|
}
|
|
83
82
|
else if (props.type === "date") {
|
|
84
|
-
|
|
85
|
-
return (React.createElement(TextField, { disabled: true, id: props.name, placeholder: props.placeholder, type: "text",
|
|
83
|
+
return (React.createElement(TextField, { disabled: true, id: props.name, placeholder: props.placeholder, type: "date",
|
|
86
84
|
// TODO: allow editing with a date picker
|
|
87
|
-
value:
|
|
85
|
+
value: value, onChange: (result) => handleChange(result.value) }));
|
|
88
86
|
}
|
|
89
87
|
else {
|
|
90
88
|
let type = "text";
|
package/dist/Field.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Field.js","sourceRoot":"","sources":["../src/Field.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Field.js","sourceRoot":"","sources":["../src/Field.tsx"],"names":[],"mappings":"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"}
|
package/dist/TextField.d.ts
CHANGED
|
@@ -1,49 +1,3 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { ReactElement } from "react";
|
|
2
2
|
import { TextFieldProps } from "./Common";
|
|
3
|
-
|
|
4
|
-
focused: boolean;
|
|
5
|
-
height: number;
|
|
6
|
-
}
|
|
7
|
-
export declare class TextField extends React.Component<TextFieldProps, TextFieldState> {
|
|
8
|
-
dateActionSheetRef: React.RefObject<any>;
|
|
9
|
-
numberRangeActionSheetRef: React.RefObject<any>;
|
|
10
|
-
decimalRangeActionSheetRef: React.RefObject<any>;
|
|
11
|
-
weightActionSheetRef: React.RefObject<any>;
|
|
12
|
-
constructor(props: TextFieldProps);
|
|
13
|
-
keyboardMap: {
|
|
14
|
-
date: string;
|
|
15
|
-
email: string;
|
|
16
|
-
number: string;
|
|
17
|
-
numberRange: string;
|
|
18
|
-
decimalRange: string;
|
|
19
|
-
decimal: string;
|
|
20
|
-
height: string;
|
|
21
|
-
password: string;
|
|
22
|
-
search: string;
|
|
23
|
-
text: string;
|
|
24
|
-
url: string | undefined;
|
|
25
|
-
username: string;
|
|
26
|
-
};
|
|
27
|
-
textContentMap: {
|
|
28
|
-
date: string;
|
|
29
|
-
email: string;
|
|
30
|
-
number: string;
|
|
31
|
-
decimal: string;
|
|
32
|
-
decimalRange: string;
|
|
33
|
-
height: string;
|
|
34
|
-
password: string;
|
|
35
|
-
search: string;
|
|
36
|
-
text: string;
|
|
37
|
-
url: string | undefined;
|
|
38
|
-
username: string;
|
|
39
|
-
};
|
|
40
|
-
renderIcon(): JSX.Element | null;
|
|
41
|
-
getBorderColor: () => string;
|
|
42
|
-
getHeight: () => number | "100%";
|
|
43
|
-
focus(): void;
|
|
44
|
-
isEditable(): boolean;
|
|
45
|
-
isHandledByModal: () => boolean;
|
|
46
|
-
shouldAutocorrect: () => boolean;
|
|
47
|
-
render(): JSX.Element;
|
|
48
|
-
}
|
|
49
|
-
export {};
|
|
3
|
+
export declare function TextField({ value, height: propsHeight, onChange, paddingX, paddingY, min, max, type, searching, autoComplete, autoFocus, disabled, errorMessage, errorMessageColor, inputRef, multiline, rows, placeholder, grow, label, labelColor, returnKeyType, onBlur, style, onEnter, onSubmitEditing, }: TextFieldProps): ReactElement;
|
package/dist/TextField.js
CHANGED
|
@@ -1,103 +1,81 @@
|
|
|
1
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
-
var t = {};
|
|
3
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
-
t[p] = s[p];
|
|
5
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
-
t[p[i]] = s[p[i]];
|
|
9
|
-
}
|
|
10
|
-
return t;
|
|
11
|
-
};
|
|
12
1
|
import moment from "moment-timezone";
|
|
13
|
-
import React from "react";
|
|
2
|
+
import React, { useState } from "react";
|
|
14
3
|
import { ActivityIndicator, Platform, TextInput, View } from "react-native";
|
|
4
|
+
import { Calendar } from "react-native-calendars";
|
|
15
5
|
import { Box } from "./Box";
|
|
16
6
|
import { DateTimeActionSheet } from "./DateTimeActionSheet";
|
|
17
7
|
import { DecimalRangeActionSheet } from "./DecimalRangeActionSheet";
|
|
8
|
+
import { Heading } from "./Heading";
|
|
18
9
|
import { HeightActionSheet } from "./HeightActionSheet";
|
|
19
10
|
import { Icon } from "./Icon";
|
|
11
|
+
import { IconButton } from "./IconButton";
|
|
20
12
|
import { NumberPickerActionSheet } from "./NumberPickerActionSheet";
|
|
21
13
|
import { Unifier } from "./Unifier";
|
|
22
14
|
import { WithLabel } from "./WithLabel";
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
};
|
|
85
|
-
this.isHandledByModal = () => {
|
|
86
|
-
return (this.props.type === "date" ||
|
|
87
|
-
this.props.type === "numberRange" ||
|
|
88
|
-
this.props.type === "decimalRange" ||
|
|
89
|
-
this.props.type === "height");
|
|
90
|
-
};
|
|
91
|
-
this.shouldAutocorrect = () => {
|
|
92
|
-
return (this.props.type === "text" && (!this.props.autoComplete || this.props.autoComplete === "on"));
|
|
93
|
-
};
|
|
94
|
-
this.state = { focused: false, height: props.height || 40 };
|
|
95
|
-
}
|
|
96
|
-
renderIcon() {
|
|
97
|
-
if (this.props.type !== "search") {
|
|
15
|
+
function CalendarHeader(props) {
|
|
16
|
+
const { addMonth, month } = props;
|
|
17
|
+
const displayDate = moment(month[0]).format("MMM YYYY");
|
|
18
|
+
return (React.createElement(Box, { alignItems: "center", direction: "row", height: 40, justifyContent: "between", width: "100%" },
|
|
19
|
+
React.createElement(IconButton, { accessibilityLabel: "arrow", bgColor: "white", icon: "angle-double-left", iconColor: "blue", size: "md", onClick: () => {
|
|
20
|
+
addMonth(-12);
|
|
21
|
+
} }),
|
|
22
|
+
React.createElement(IconButton, { accessibilityLabel: "arrow", bgColor: "white", icon: "angle-left", iconColor: "blue", size: "md", onClick: () => {
|
|
23
|
+
addMonth(-1);
|
|
24
|
+
} }),
|
|
25
|
+
React.createElement(Heading, { size: "sm" }, displayDate),
|
|
26
|
+
React.createElement(IconButton, { accessibilityLabel: "arrow", bgColor: "white", icon: "angle-right", iconColor: "blue", size: "md", onClick: () => {
|
|
27
|
+
addMonth(1);
|
|
28
|
+
} }),
|
|
29
|
+
React.createElement(IconButton, { accessibilityLabel: "arrow", bgColor: "white", icon: "angle-double-right", iconColor: "blue", size: "md", onClick: () => {
|
|
30
|
+
addMonth(12);
|
|
31
|
+
} })));
|
|
32
|
+
}
|
|
33
|
+
const keyboardMap = {
|
|
34
|
+
date: "default",
|
|
35
|
+
email: "email-address",
|
|
36
|
+
number: "number-pad",
|
|
37
|
+
numberRange: "number-pad",
|
|
38
|
+
decimalRange: "decimal-pad",
|
|
39
|
+
decimal: "decimal-pad",
|
|
40
|
+
height: "default",
|
|
41
|
+
password: "default",
|
|
42
|
+
search: "default",
|
|
43
|
+
text: "default",
|
|
44
|
+
url: Platform.select({
|
|
45
|
+
ios: "url",
|
|
46
|
+
android: "default",
|
|
47
|
+
}),
|
|
48
|
+
username: "default",
|
|
49
|
+
};
|
|
50
|
+
const textContentMap = {
|
|
51
|
+
date: "none",
|
|
52
|
+
email: "emailAddress",
|
|
53
|
+
number: "none",
|
|
54
|
+
decimal: "none",
|
|
55
|
+
decimalRange: "none",
|
|
56
|
+
height: "none",
|
|
57
|
+
password: "password",
|
|
58
|
+
search: "none",
|
|
59
|
+
text: "none",
|
|
60
|
+
url: Platform.select({
|
|
61
|
+
ios: "URL",
|
|
62
|
+
android: "none",
|
|
63
|
+
}),
|
|
64
|
+
username: "username",
|
|
65
|
+
};
|
|
66
|
+
export function TextField({ value, height: propsHeight, onChange, paddingX, paddingY, min, max, type = "text", searching, autoComplete, autoFocus, disabled, errorMessage, errorMessageColor, inputRef, multiline, rows, placeholder, grow, label, labelColor, returnKeyType, onBlur, style, onEnter, onSubmitEditing, }) {
|
|
67
|
+
const dateActionSheetRef = React.createRef();
|
|
68
|
+
const numberRangeActionSheetRef = React.createRef();
|
|
69
|
+
const decimalRangeActionSheetRef = React.createRef();
|
|
70
|
+
const weightActionSheetRef = React.createRef();
|
|
71
|
+
const [focused, setFocused] = useState(false);
|
|
72
|
+
const [height, setHeight] = useState(propsHeight || 40);
|
|
73
|
+
const [showDate, setShowDate] = useState(false);
|
|
74
|
+
const renderIcon = () => {
|
|
75
|
+
if (type !== "search") {
|
|
98
76
|
return null;
|
|
99
77
|
}
|
|
100
|
-
if (
|
|
78
|
+
if (searching === true) {
|
|
101
79
|
return (React.createElement(Box, { marginRight: 4 },
|
|
102
80
|
React.createElement(ActivityIndicator, { color: Unifier.theme.primary, size: "small" })));
|
|
103
81
|
}
|
|
@@ -105,106 +83,128 @@ export class TextField extends React.Component {
|
|
|
105
83
|
return (React.createElement(Box, { marginRight: 2 },
|
|
106
84
|
React.createElement(Icon, { name: "search", prefix: "far", size: "md" })));
|
|
107
85
|
}
|
|
86
|
+
};
|
|
87
|
+
let borderColor;
|
|
88
|
+
if (errorMessage) {
|
|
89
|
+
borderColor = Unifier.theme.red;
|
|
108
90
|
}
|
|
109
|
-
|
|
110
|
-
|
|
91
|
+
else if (focused) {
|
|
92
|
+
borderColor = Unifier.theme.blue;
|
|
111
93
|
}
|
|
112
|
-
|
|
113
|
-
|
|
94
|
+
else {
|
|
95
|
+
borderColor = Unifier.theme.gray;
|
|
114
96
|
}
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
// let textContentType = this.textContentMap[this.props.type || "text"];
|
|
119
|
-
const _a = this.props, { errorMessage } = _a, props = __rest(_a, ["errorMessage"]);
|
|
120
|
-
let value = this.props.value;
|
|
121
|
-
if (this.props.type === "date") {
|
|
122
|
-
value = moment(this.props.value).format("MM/DD/YYYY");
|
|
97
|
+
const getHeight = () => {
|
|
98
|
+
if (grow) {
|
|
99
|
+
return Math.max(40, height);
|
|
123
100
|
}
|
|
124
|
-
else if (
|
|
125
|
-
|
|
101
|
+
else if (multiline) {
|
|
102
|
+
return height || "100%";
|
|
103
|
+
}
|
|
104
|
+
else {
|
|
105
|
+
return 40;
|
|
126
106
|
}
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
107
|
+
};
|
|
108
|
+
const isHandledByModal = type === "date" || type === "numberRange" || type === "decimalRange" || type === "height";
|
|
109
|
+
const isEditable = !disabled && !isHandledByModal;
|
|
110
|
+
const shouldAutocorrect = type === "text" && (!autoComplete || autoComplete === "on");
|
|
111
|
+
const keyboardType = keyboardMap[type];
|
|
112
|
+
const textContentType = textContentMap[type || "text"];
|
|
113
|
+
const withLabelProps = {
|
|
114
|
+
label,
|
|
115
|
+
labelColor,
|
|
116
|
+
};
|
|
117
|
+
if (type === "date") {
|
|
118
|
+
value = moment(value).format("MM/DD/YYYY");
|
|
119
|
+
}
|
|
120
|
+
else if (type === "height") {
|
|
121
|
+
value = `${Math.floor(Number(value) / 12)} ft, ${Number(value) % 12} in`;
|
|
122
|
+
}
|
|
123
|
+
return (React.createElement(React.Fragment, null,
|
|
124
|
+
React.createElement(WithLabel, { label: errorMessage, labelColor: errorMessageColor || "red", labelPlacement: "after", labelSize: "sm" },
|
|
125
|
+
React.createElement(WithLabel, Object.assign({}, withLabelProps),
|
|
126
|
+
React.createElement(View, { style: {
|
|
127
|
+
flexDirection: "row",
|
|
128
|
+
justifyContent: "center",
|
|
129
|
+
alignItems: "center",
|
|
130
|
+
// height: 40,
|
|
131
|
+
// minHeight: getHeight(),
|
|
132
|
+
minHeight: getHeight(),
|
|
133
|
+
width: "100%",
|
|
134
|
+
// Add padding so the border doesn't mess up layouts
|
|
135
|
+
paddingHorizontal: paddingX || focused ? 10 : 14,
|
|
136
|
+
paddingVertical: paddingY || focused ? 0 : 4,
|
|
137
|
+
borderColor,
|
|
138
|
+
borderWidth: focused && !errorMessage ? 5 : 1,
|
|
139
|
+
borderRadius: 16,
|
|
140
|
+
backgroundColor: disabled ? Unifier.theme.gray : Unifier.theme.white,
|
|
141
|
+
overflow: "hidden",
|
|
142
|
+
}, onTouchEnd: () => {
|
|
143
|
+
var _a, _b, _c, _d;
|
|
144
|
+
if (type === "date") {
|
|
145
|
+
(_a = dateActionSheetRef === null || dateActionSheetRef === void 0 ? void 0 : dateActionSheetRef.current) === null || _a === void 0 ? void 0 : _a.setModalVisible(true);
|
|
146
|
+
}
|
|
147
|
+
else if (type === "numberRange") {
|
|
148
|
+
(_b = numberRangeActionSheetRef === null || numberRangeActionSheetRef === void 0 ? void 0 : numberRangeActionSheetRef.current) === null || _b === void 0 ? void 0 : _b.setModalVisible(true);
|
|
149
|
+
}
|
|
150
|
+
else if (type === "decimalRange") {
|
|
151
|
+
(_c = decimalRangeActionSheetRef === null || decimalRangeActionSheetRef === void 0 ? void 0 : decimalRangeActionSheetRef.current) === null || _c === void 0 ? void 0 : _c.setModalVisible(true);
|
|
152
|
+
}
|
|
153
|
+
else if (type === "height") {
|
|
154
|
+
(_d = weightActionSheetRef === null || weightActionSheetRef === void 0 ? void 0 : weightActionSheetRef.current) === null || _d === void 0 ? void 0 : _d.setModalVisible(true);
|
|
155
|
+
}
|
|
156
|
+
} },
|
|
157
|
+
renderIcon(),
|
|
158
|
+
React.createElement(TextInput, { ref: (ref) => {
|
|
159
|
+
if (inputRef) {
|
|
160
|
+
inputRef(ref);
|
|
150
161
|
}
|
|
151
|
-
|
|
152
|
-
|
|
162
|
+
}, autoCapitalize: type === "text" ? "sentences" : "none", autoCorrect: shouldAutocorrect, autoFocus: autoFocus, blurOnSubmit: true, editable: isEditable, keyboardType: keyboardType, multiline: multiline, numberOfLines: rows || 4, placeholder: placeholder, placeholderTextColor: Unifier.theme.gray, returnKeyType: type === "number" || type === "decimal" ? "done" : returnKeyType, secureTextEntry: type === "password", style: Object.assign({ flex: 1, paddingTop: 10, paddingRight: 10, paddingBottom: 10, paddingLeft: 0, height: getHeight(), width: "100%", color: Unifier.theme.darkGray, fontFamily: Unifier.theme.primaryFont,
|
|
163
|
+
// Remove border in web.
|
|
164
|
+
outlineWidth: 0 }, style),
|
|
165
|
+
// For react-native-autofocus
|
|
166
|
+
textContentType: textContentType, underlineColorAndroid: "transparent", value: value, onBlur: () => {
|
|
167
|
+
if (!isHandledByModal) {
|
|
168
|
+
setFocused(false);
|
|
153
169
|
}
|
|
154
|
-
|
|
155
|
-
(
|
|
170
|
+
if (onBlur && value) {
|
|
171
|
+
onBlur({ value });
|
|
156
172
|
}
|
|
157
|
-
|
|
158
|
-
|
|
173
|
+
// if (type === "date") {
|
|
174
|
+
// actionSheetRef?.current?.setModalVisible(false);
|
|
175
|
+
// }
|
|
176
|
+
}, onChangeText: (text) => {
|
|
177
|
+
onChange({ value: text });
|
|
178
|
+
}, onContentSizeChange: (event) => {
|
|
179
|
+
if (!grow) {
|
|
180
|
+
return;
|
|
159
181
|
}
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
return;
|
|
188
|
-
}
|
|
189
|
-
this.setState({ height: event.nativeEvent.contentSize.height });
|
|
190
|
-
}, onFocus: () => {
|
|
191
|
-
if (!this.isHandledByModal()) {
|
|
192
|
-
this.setState({ focused: true });
|
|
193
|
-
}
|
|
194
|
-
}, onSubmitEditing: () => {
|
|
195
|
-
if (this.props.onEnter) {
|
|
196
|
-
this.props.onEnter();
|
|
197
|
-
}
|
|
198
|
-
if (this.props.onSubmitEditing) {
|
|
199
|
-
this.props.onSubmitEditing();
|
|
200
|
-
}
|
|
201
|
-
} })))),
|
|
202
|
-
this.props.type === "date" && (React.createElement(DateTimeActionSheet, { actionSheetRef: this.dateActionSheetRef, mode: "date", value: this.props.value, onChange: (result) => this.props.onChange(result) })),
|
|
203
|
-
this.props.type === "numberRange" && this.props.value && (React.createElement(NumberPickerActionSheet, { actionSheetRef: this.numberRangeActionSheetRef, max: this.props.max || (this.props.min || 0) + 100, min: this.props.min || 0, value: this.props.value, onChange: (result) => this.props.onChange(result) })),
|
|
204
|
-
this.props.type === "decimalRange" && this.props.value && (React.createElement(DecimalRangeActionSheet, { actionSheetRef: this.decimalRangeActionSheetRef, max: this.props.max || (this.props.min || 0) + 100, min: this.props.min || 0, value: this.props.value, onChange: (result) => this.props.onChange(result) })),
|
|
205
|
-
this.props.type === "height" && (React.createElement(HeightActionSheet, { actionSheetRef: this.weightActionSheetRef, value: this.props.value, onChange: (result) => {
|
|
206
|
-
this.props.onChange(result);
|
|
207
|
-
} }))));
|
|
208
|
-
}
|
|
182
|
+
setHeight(event.nativeEvent.contentSize.height);
|
|
183
|
+
}, onFocus: () => {
|
|
184
|
+
if (!isHandledByModal) {
|
|
185
|
+
setFocused(true);
|
|
186
|
+
}
|
|
187
|
+
if (Platform.OS === "web" && type === "date") {
|
|
188
|
+
setShowDate(true);
|
|
189
|
+
}
|
|
190
|
+
}, onSubmitEditing: () => {
|
|
191
|
+
if (onEnter) {
|
|
192
|
+
onEnter();
|
|
193
|
+
}
|
|
194
|
+
if (onSubmitEditing) {
|
|
195
|
+
onSubmitEditing();
|
|
196
|
+
}
|
|
197
|
+
} })))),
|
|
198
|
+
type === "date" && Platform.OS !== "web" && (React.createElement(DateTimeActionSheet, { actionSheetRef: dateActionSheetRef, mode: "date", value: value, onChange: (result) => onChange(result) })),
|
|
199
|
+
type === "date" && Platform.OS === "web" && showDate && (React.createElement(Box, { maxWidth: 300 },
|
|
200
|
+
React.createElement(Calendar, { customHeader: CalendarHeader, initialDate: value, onDayPress: (day) => {
|
|
201
|
+
onChange({ value: day.dateString });
|
|
202
|
+
setShowDate(false);
|
|
203
|
+
} }))),
|
|
204
|
+
type === "numberRange" && value && (React.createElement(NumberPickerActionSheet, { actionSheetRef: numberRangeActionSheetRef, max: max || (min || 0) + 100, min: min || 0, value: value, onChange: (result) => onChange(result) })),
|
|
205
|
+
type === "decimalRange" && value && (React.createElement(DecimalRangeActionSheet, { actionSheetRef: decimalRangeActionSheetRef, max: max || (min || 0) + 100, min: min || 0, value: value, onChange: (result) => onChange(result) })),
|
|
206
|
+
type === "height" && (React.createElement(HeightActionSheet, { actionSheetRef: weightActionSheetRef, value: value, onChange: (result) => {
|
|
207
|
+
onChange(result);
|
|
208
|
+
} }))));
|
|
209
209
|
}
|
|
210
210
|
//# sourceMappingURL=TextField.js.map
|