ferns-ui 0.22.5 → 0.23.1
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/Button.d.ts +2 -1
- package/dist/Button.js +2 -2
- package/dist/Button.js.map +1 -1
- package/dist/Common.d.ts +1 -14
- package/dist/Common.js.map +1 -1
- package/dist/FernsProvider.d.ts +4 -0
- package/dist/FernsProvider.js +9 -0
- package/dist/FernsProvider.js.map +1 -0
- package/dist/IconButton.d.ts +21 -3
- package/dist/IconButton.js +44 -31
- package/dist/IconButton.js.map +1 -1
- package/dist/InfoTooltipButton.d.ts +8 -0
- package/dist/InfoTooltipButton.js +6 -0
- package/dist/InfoTooltipButton.js.map +1 -0
- package/dist/PickerSelect.d.ts +28 -93
- package/dist/PickerSelect.js +104 -241
- package/dist/PickerSelect.js.map +1 -1
- package/dist/SelectList.js +27 -5
- package/dist/SelectList.js.map +1 -1
- package/dist/TapToEdit.js +17 -0
- package/dist/TapToEdit.js.map +1 -1
- package/dist/Toast.d.ts +10 -0
- package/dist/Toast.js +40 -0
- package/dist/Toast.js.map +1 -0
- package/dist/Tooltip.d.ts +9 -0
- package/dist/Tooltip.js +170 -0
- package/dist/Tooltip.js.map +1 -0
- package/dist/index.d.ts +4 -0
- package/dist/index.js +4 -0
- package/dist/index.js.map +1 -1
- package/package.json +3 -1
- package/src/Button.tsx +3 -1
- package/src/Common.ts +2 -15
- package/src/FernsProvider.tsx +21 -0
- package/src/IconButton.tsx +131 -79
- package/src/InfoTooltipButton.tsx +23 -0
- package/src/PickerSelect.tsx +187 -320
- package/src/SelectList.tsx +26 -4
- package/src/TapToEdit.tsx +21 -0
- package/src/Toast.tsx +87 -0
- package/src/Tooltip.tsx +259 -0
- package/src/index.tsx +4 -0
- package/README.md +0 -22
package/dist/Button.d.ts
CHANGED
|
@@ -16,5 +16,6 @@ export interface ButtonProps {
|
|
|
16
16
|
withConfirmation?: boolean;
|
|
17
17
|
confirmationText?: string;
|
|
18
18
|
confirmationHeading?: string;
|
|
19
|
+
shape?: "rounded" | "pill";
|
|
19
20
|
}
|
|
20
|
-
export declare function Button({ disabled, type, loading: propsLoading, children, text, inline, icon, iconPrefix, size, onClick, color, withConfirmation, confirmationText, confirmationHeading, }: ButtonProps): JSX.Element;
|
|
21
|
+
export declare function Button({ disabled, type, loading: propsLoading, children, text, inline, icon, iconPrefix, size, onClick, color, withConfirmation, confirmationText, confirmationHeading, shape, }: ButtonProps): JSX.Element;
|
package/dist/Button.js
CHANGED
|
@@ -25,7 +25,7 @@ const HEIGHTS = {
|
|
|
25
25
|
md: 40,
|
|
26
26
|
lg: 48,
|
|
27
27
|
};
|
|
28
|
-
export function Button({ disabled, type, loading: propsLoading, children, text, inline, icon, iconPrefix, size, onClick, color = "lightGray", withConfirmation = false, confirmationText = "Are you sure you want to continue?", confirmationHeading = "Confirm", }) {
|
|
28
|
+
export function Button({ disabled, type, loading: propsLoading, children, text, inline, icon, iconPrefix, size, onClick, color = "lightGray", withConfirmation = false, confirmationText = "Are you sure you want to continue?", confirmationHeading = "Confirm", shape = "rounded", }) {
|
|
29
29
|
const [loading, setLoading] = useState(propsLoading);
|
|
30
30
|
const [showConfirmation, setShowConfirmation] = useState(false);
|
|
31
31
|
const getBackgroundColor = (backgroundColor) => {
|
|
@@ -77,7 +77,7 @@ export function Button({ disabled, type, loading: propsLoading, children, text,
|
|
|
77
77
|
// flexGrow: inline ? 0 : 1,
|
|
78
78
|
alignItems: "center",
|
|
79
79
|
justifyContent: "center",
|
|
80
|
-
borderRadius: 5,
|
|
80
|
+
borderRadius: shape === "pill" ? 999 : 5,
|
|
81
81
|
borderColor: getBorderColor(color),
|
|
82
82
|
borderWidth: type === "outline" ? 2 : 0,
|
|
83
83
|
opacity: disabled ? 0.4 : 1,
|
package/dist/Button.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,iBAAiB,CAAC;AACvC,OAAO,KAAK,EAAE,EAAC,QAAQ,EAAC,MAAM,OAAO,CAAC;AACtC,OAAO,EAAC,iBAAiB,EAAE,gBAAgB,EAAC,MAAM,cAAc,CAAC;AAEjE,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,IAAI,EAAC,MAAM,QAAQ,CAAC;AAC5B,OAAO,EAAC,KAAK,EAAC,MAAM,SAAS,CAAC;AAC9B,OAAO,EAAC,IAAI,EAAC,MAAM,QAAQ,CAAC;AAC5B,OAAO,EAAC,OAAO,EAAC,MAAM,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":"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"}
|
package/dist/Common.d.ts
CHANGED
|
@@ -322,23 +322,10 @@ export interface IconProps {
|
|
|
322
322
|
iconStyle?: any;
|
|
323
323
|
containerStyle?: any;
|
|
324
324
|
}
|
|
325
|
-
export interface IconButtonProps {
|
|
326
|
-
prefix?: IconPrefix;
|
|
327
|
-
icon: IconName;
|
|
328
|
-
accessibilityLabel: string;
|
|
329
|
-
iconColor: "darkGray" | ButtonColor | ThemeColor | Color;
|
|
330
|
-
onClick: () => void;
|
|
331
|
-
size?: IconSize;
|
|
332
|
-
bgColor?: "transparent" | "transparentDarkGray" | "gray" | "lightGray" | "white";
|
|
333
|
-
disabled?: boolean;
|
|
334
|
-
selected?: boolean;
|
|
335
|
-
withConfirmation?: boolean;
|
|
336
|
-
confirmationText?: string;
|
|
337
|
-
confirmationHeading?: string;
|
|
338
|
-
}
|
|
339
325
|
export interface NavigatorProps {
|
|
340
326
|
config?: any;
|
|
341
327
|
}
|
|
328
|
+
export declare type TooltipDirection = "top" | "bottom" | "left" | "right";
|
|
342
329
|
export interface PillProps {
|
|
343
330
|
text: string;
|
|
344
331
|
color: AllColors;
|
package/dist/Common.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Common.js","sourceRoot":"","sources":["../src/Common.ts"],"names":[],"mappings":"AAorDA,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,CAAC;AAmBzB,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":"AAorDA,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,CAAC;AAmBzB,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;AA24BD,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"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Host } from "react-native-portalize";
|
|
3
|
+
import { ToastProvider } from "react-native-toast-notifications";
|
|
4
|
+
import { Toast } from "./Toast";
|
|
5
|
+
export function FernsProvider({ children }) {
|
|
6
|
+
return (React.createElement(ToastProvider, { animationDuration: 250, animationType: "slide-in", duration: 50000, offset: 50, placement: "bottom", renderToast: (toastOptions) => React.createElement(Toast, Object.assign({}, toastOptions)), swipeEnabled: true },
|
|
7
|
+
React.createElement(Host, null, children)));
|
|
8
|
+
}
|
|
9
|
+
//# sourceMappingURL=FernsProvider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FernsProvider.js","sourceRoot":"","sources":["../src/FernsProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,IAAI,EAAC,MAAM,wBAAwB,CAAC;AAC5C,OAAO,EAAC,aAAa,EAAC,MAAM,kCAAkC,CAAC;AAE/D,OAAO,EAAC,KAAK,EAAC,MAAM,SAAS,CAAC;AAE9B,MAAM,UAAU,aAAa,CAAC,EAAC,QAAQ,EAA8B;IACnE,OAAO,CACL,oBAAC,aAAa,IACZ,iBAAiB,EAAE,GAAG,EACtB,aAAa,EAAC,UAAU,EACxB,QAAQ,EAAE,KAAK,EACf,MAAM,EAAE,EAAE,EACV,SAAS,EAAC,QAAQ,EAClB,WAAW,EAAE,CAAC,YAAY,EAAE,EAAE,CAAC,oBAAC,KAAK,oBAAM,YAAoB,EAAI,EACnE,YAAY;QAEZ,oBAAC,IAAI,QAAE,QAAQ,CAAQ,CACT,CACjB,CAAC;AACJ,CAAC"}
|
package/dist/IconButton.d.ts
CHANGED
|
@@ -1,3 +1,21 @@
|
|
|
1
|
-
|
|
2
|
-
import {
|
|
3
|
-
export
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { ButtonColor, Color, IconName, IconPrefix, IconSize, ThemeColor, TooltipDirection } from "./Common";
|
|
3
|
+
export interface IconButtonProps {
|
|
4
|
+
prefix?: IconPrefix;
|
|
5
|
+
icon: IconName;
|
|
6
|
+
accessibilityLabel: string;
|
|
7
|
+
iconColor: "darkGray" | ButtonColor | ThemeColor | Color;
|
|
8
|
+
onClick: () => void;
|
|
9
|
+
size?: IconSize;
|
|
10
|
+
bgColor?: "transparent" | "transparentDarkGray" | "gray" | "lightGray" | "white";
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
selected?: boolean;
|
|
13
|
+
withConfirmation?: boolean;
|
|
14
|
+
confirmationText?: string;
|
|
15
|
+
confirmationHeading?: string;
|
|
16
|
+
tooltip?: {
|
|
17
|
+
text: string;
|
|
18
|
+
idealDirection?: TooltipDirection;
|
|
19
|
+
};
|
|
20
|
+
}
|
|
21
|
+
export declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<unknown>>;
|
package/dist/IconButton.js
CHANGED
|
@@ -1,11 +1,13 @@
|
|
|
1
|
-
import React, { useState } from "react";
|
|
2
|
-
import { TouchableOpacity } from "react-native";
|
|
3
|
-
import { iconSizeToNumber } from "./Common";
|
|
1
|
+
import React, { forwardRef, useState } from "react";
|
|
2
|
+
import { Platform, TouchableOpacity, View } from "react-native";
|
|
3
|
+
import { iconSizeToNumber, } from "./Common";
|
|
4
4
|
import { Icon } from "./Icon";
|
|
5
5
|
import { Modal } from "./Modal";
|
|
6
6
|
import { Text } from "./Text";
|
|
7
|
+
import { Tooltip } from "./Tooltip";
|
|
7
8
|
import { Unifier } from "./Unifier";
|
|
8
|
-
|
|
9
|
+
// eslint-disable-next-line react/display-name
|
|
10
|
+
export const IconButton = forwardRef(({ prefix, icon, iconColor, onClick, size, bgColor = "transparent", withConfirmation = false, confirmationText = "Are you sure you want to continue?", confirmationHeading = "Confirm", tooltip, }, ref) => {
|
|
9
11
|
const [showConfirmation, setShowConfirmation] = useState(false);
|
|
10
12
|
let opacity = 1;
|
|
11
13
|
let color;
|
|
@@ -14,7 +16,7 @@ export function IconButton({ prefix, icon, iconColor, onClick, size, bgColor = "
|
|
|
14
16
|
color = Unifier.theme.darkGray;
|
|
15
17
|
}
|
|
16
18
|
else if (bgColor === "transparent" || !bgColor) {
|
|
17
|
-
opacity =
|
|
19
|
+
opacity = 1.0;
|
|
18
20
|
color = Unifier.theme.white;
|
|
19
21
|
}
|
|
20
22
|
else {
|
|
@@ -29,30 +31,41 @@ export function IconButton({ prefix, icon, iconColor, onClick, size, bgColor = "
|
|
|
29
31
|
} },
|
|
30
32
|
React.createElement(Text, null, confirmationText)));
|
|
31
33
|
};
|
|
32
|
-
|
|
33
|
-
React.createElement(
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
onClick
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
34
|
+
function renderIconButton() {
|
|
35
|
+
return (React.createElement(View, null,
|
|
36
|
+
React.createElement(TouchableOpacity, { ref: ref, hitSlop: { top: 10, left: 10, bottom: 10, right: 10 }, style: {
|
|
37
|
+
opacity,
|
|
38
|
+
backgroundColor: color,
|
|
39
|
+
borderRadius: 100,
|
|
40
|
+
// paddingBottom: iconSizeToNumber(size) / 4,
|
|
41
|
+
// paddingTop: iconSizeToNumber(size) / 4,
|
|
42
|
+
// paddingLeft: iconSizeToNumber(size) / 2,
|
|
43
|
+
// paddingRight: iconSizeToNumber(size) / 2,
|
|
44
|
+
width: iconSizeToNumber(size) * 2.5,
|
|
45
|
+
height: iconSizeToNumber(size) * 2.5,
|
|
46
|
+
display: "flex",
|
|
47
|
+
justifyContent: "center",
|
|
48
|
+
alignItems: "center",
|
|
49
|
+
}, onPress: () => {
|
|
50
|
+
Unifier.utils.haptic();
|
|
51
|
+
if (withConfirmation && !showConfirmation) {
|
|
52
|
+
setShowConfirmation(true);
|
|
53
|
+
}
|
|
54
|
+
else if (onClick) {
|
|
55
|
+
onClick();
|
|
56
|
+
}
|
|
57
|
+
} },
|
|
58
|
+
React.createElement(Icon, { color: iconColor, name: icon, prefix: prefix || "fas", size: size })),
|
|
59
|
+
Boolean(withConfirmation) && renderConfirmation()));
|
|
60
|
+
}
|
|
61
|
+
// Only add for web. This doesn't make much sense for mobile, since the action would be performed for the button
|
|
62
|
+
// as well as the tooltip appearing.
|
|
63
|
+
// TODO: Add tooltip info button next to the icon button on mobile.
|
|
64
|
+
if (tooltip && Platform.OS === "web") {
|
|
65
|
+
return (React.createElement(Tooltip, { idealDirection: tooltip.idealDirection, text: tooltip.text }, renderIconButton()));
|
|
66
|
+
}
|
|
67
|
+
else {
|
|
68
|
+
return renderIconButton();
|
|
69
|
+
}
|
|
70
|
+
});
|
|
58
71
|
//# sourceMappingURL=IconButton.js.map
|
package/dist/IconButton.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../src/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,QAAQ,EAAC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../src/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,UAAU,EAAE,QAAQ,EAAC,MAAM,OAAO,CAAC;AAClD,OAAO,EAAC,QAAQ,EAAE,gBAAgB,EAAE,IAAI,EAAC,MAAM,cAAc,CAAC;AAE9D,OAAO,EAML,gBAAgB,GAGjB,MAAM,UAAU,CAAC;AAClB,OAAO,EAAC,IAAI,EAAC,MAAM,QAAQ,CAAC;AAC5B,OAAO,EAAC,KAAK,EAAC,MAAM,SAAS,CAAC;AAC9B,OAAO,EAAC,IAAI,EAAC,MAAM,QAAQ,CAAC;AAC5B,OAAO,EAAC,OAAO,EAAC,MAAM,WAAW,CAAC;AAClC,OAAO,EAAC,OAAO,EAAC,MAAM,WAAW,CAAC;AAqBlC,8CAA8C;AAC9C,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAClC,CACE,EACE,MAAM,EACN,IAAI,EACJ,SAAS,EACT,OAAO,EACP,IAAI,EACJ,OAAO,GAAG,aAAa,EACvB,gBAAgB,GAAG,KAAK,EACxB,gBAAgB,GAAG,oCAAoC,EACvD,mBAAmB,GAAG,SAAS,EAC/B,OAAO,GACS,EAClB,GAAG,EACH,EAAE;IACF,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEhE,IAAI,OAAO,GAAG,CAAC,CAAC;IAChB,IAAI,KAAa,CAAC;IAClB,IAAI,OAAO,KAAK,qBAAqB,EAAE;QACrC,OAAO,GAAG,GAAG,CAAC;QACd,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC;KAChC;SAAM,IAAI,OAAO,KAAK,aAAa,IAAI,CAAC,OAAO,EAAE;QAChD,OAAO,GAAG,GAAG,CAAC;QACd,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC;KAC7B;SAAM;QACL,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;KAChC;IAED,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC9B,OAAO,CACL,oBAAC,KAAK,IACJ,OAAO,EAAE,mBAAmB,EAC5B,oBAAoB,EAAE,GAAG,EAAE;gBACzB,OAAO,EAAE,CAAC;gBACV,mBAAmB,CAAC,KAAK,CAAC,CAAC;YAC7B,CAAC,EACD,iBAAiB,EAAC,SAAS,EAC3B,sBAAsB,EAAE,GAAS,EAAE,CAAC,mBAAmB,CAAC,KAAK,CAAC,EAC9D,mBAAmB,EAAC,QAAQ,EAC5B,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,gBAAgB,EACzB,SAAS,EAAE,GAAS,EAAE;gBACpB,mBAAmB,CAAC,KAAK,CAAC,CAAC;YAC7B,CAAC;YAED,oBAAC,IAAI,QAAE,gBAAgB,CAAQ,CACzB,CACT,CAAC;IACJ,CAAC,CAAC;IAEF,SAAS,gBAAgB;QACvB,OAAO,CACL,oBAAC,IAAI;YACH,oBAAC,gBAAgB,IACf,GAAG,EAAE,GAAU,EACf,OAAO,EAAE,EAAC,GAAG,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAC,EACnD,KAAK,EAAE;oBACL,OAAO;oBACP,eAAe,EAAE,KAAK;oBACtB,YAAY,EAAE,GAAG;oBACjB,6CAA6C;oBAC7C,0CAA0C;oBAC1C,2CAA2C;oBAC3C,4CAA4C;oBAC5C,KAAK,EAAE,gBAAgB,CAAC,IAAI,CAAC,GAAG,GAAG;oBACnC,MAAM,EAAE,gBAAgB,CAAC,IAAI,CAAC,GAAG,GAAG;oBACpC,OAAO,EAAE,MAAM;oBACf,cAAc,EAAE,QAAQ;oBACxB,UAAU,EAAE,QAAQ;iBACrB,EACD,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC;oBACvB,IAAI,gBAAgB,IAAI,CAAC,gBAAgB,EAAE;wBACzC,mBAAmB,CAAC,IAAI,CAAC,CAAC;qBAC3B;yBAAM,IAAI,OAAO,EAAE;wBAClB,OAAO,EAAE,CAAC;qBACX;gBACH,CAAC;gBAED,oBAAC,IAAI,IAAC,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,IAAI,KAAK,EAAE,IAAI,EAAE,IAAI,GAAI,CAC1D;YAClB,OAAO,CAAC,gBAAgB,CAAC,IAAI,kBAAkB,EAAE,CAC7C,CACR,CAAC;IACJ,CAAC;IAED,gHAAgH;IAChH,oCAAoC;IACpC,mEAAmE;IACnE,IAAI,OAAO,IAAI,QAAQ,CAAC,EAAE,KAAK,KAAK,EAAE;QACpC,OAAO,CACL,oBAAC,OAAO,IAAC,cAAc,EAAE,OAAO,CAAC,cAAc,EAAE,IAAI,EAAE,OAAO,CAAC,IAAI,IAChE,gBAAgB,EAAE,CACX,CACX,CAAC;KACH;SAAM;QACL,OAAO,gBAAgB,EAAE,CAAC;KAC3B;AACH,CAAC,CACF,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { IconButton } from "./IconButton";
|
|
3
|
+
export function InfoTooltipButton({ text, size }) {
|
|
4
|
+
return (React.createElement(IconButton, { accessibilityLabel: "info", bgColor: "transparent", icon: "exclamation", iconColor: "blue", size: size, tooltip: { text }, onClick: () => { } }));
|
|
5
|
+
}
|
|
6
|
+
//# sourceMappingURL=InfoTooltipButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InfoTooltipButton.js","sourceRoot":"","sources":["../src/InfoTooltipButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAC,UAAU,EAAC,MAAM,cAAc,CAAC;AAOxC,MAAM,UAAU,iBAAiB,CAAC,EAAC,IAAI,EAAE,IAAI,EAAyB;IACpE,OAAO,CACL,oBAAC,UAAU,IACT,kBAAkB,EAAC,MAAM,EACzB,OAAO,EAAC,aAAa,EACrB,IAAI,EAAC,aAAa,EAClB,SAAS,EAAC,MAAM,EAChB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,EAAC,IAAI,EAAC,EACf,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC,GACjB,CACH,CAAC;AACJ,CAAC"}
|
package/dist/PickerSelect.d.ts
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
declare const defaultStyles: {
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const defaultStyles: {
|
|
4
3
|
viewContainer: {
|
|
5
4
|
alignSelf: "stretch";
|
|
6
5
|
};
|
|
@@ -81,94 +80,30 @@ declare const defaultStyles: {
|
|
|
81
80
|
opacity: number;
|
|
82
81
|
};
|
|
83
82
|
};
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
doneText: PropTypes.Requireable<string>;
|
|
109
|
-
onDonePress: PropTypes.Requireable<(...args: any[]) => any>;
|
|
110
|
-
onUpArrow: PropTypes.Requireable<(...args: any[]) => any>;
|
|
111
|
-
onDownArrow: PropTypes.Requireable<(...args: any[]) => any>;
|
|
112
|
-
onClose: PropTypes.Requireable<(...args: any[]) => any>;
|
|
113
|
-
modalProps: PropTypes.Requireable<PropTypes.InferProps<{}>>;
|
|
114
|
-
textInputProps: PropTypes.Requireable<PropTypes.InferProps<{}>>;
|
|
115
|
-
pickerProps: PropTypes.Requireable<PropTypes.InferProps<{}>>;
|
|
116
|
-
touchableDoneProps: PropTypes.Requireable<PropTypes.InferProps<{}>>;
|
|
117
|
-
touchableWrapperProps: PropTypes.Requireable<PropTypes.InferProps<{}>>;
|
|
118
|
-
Icon: PropTypes.Requireable<(...args: any[]) => any>;
|
|
119
|
-
InputAccessoryView: PropTypes.Requireable<(...args: any[]) => any>;
|
|
120
|
-
};
|
|
121
|
-
static defaultProps: {
|
|
122
|
-
value: undefined;
|
|
123
|
-
placeholder: {
|
|
124
|
-
label: string;
|
|
125
|
-
value: null;
|
|
126
|
-
color: string;
|
|
127
|
-
};
|
|
128
|
-
disabled: boolean;
|
|
129
|
-
itemKey: null;
|
|
130
|
-
style: {};
|
|
131
|
-
children: null;
|
|
132
|
-
useNativeAndroidPickerStyle: boolean;
|
|
133
|
-
fixAndroidTouchableBug: boolean;
|
|
134
|
-
doneText: string;
|
|
135
|
-
onDonePress: null;
|
|
136
|
-
onUpArrow: null;
|
|
137
|
-
onDownArrow: null;
|
|
138
|
-
onOpen: null;
|
|
139
|
-
onClose: null;
|
|
140
|
-
modalProps: {};
|
|
141
|
-
textInputProps: {};
|
|
142
|
-
pickerProps: {};
|
|
143
|
-
touchableDoneProps: {};
|
|
144
|
-
touchableWrapperProps: {};
|
|
145
|
-
Icon: null;
|
|
146
|
-
InputAccessoryView: null;
|
|
147
|
-
};
|
|
148
|
-
inputRef: any;
|
|
149
|
-
static handlePlaceholder({ placeholder }: any): any[];
|
|
150
|
-
static getSelectedItem({ items, key, value }: any): {
|
|
151
|
-
selectedItem: any;
|
|
152
|
-
idx: any;
|
|
153
|
-
};
|
|
154
|
-
constructor(props: any);
|
|
155
|
-
componentDidUpdate(prevProps: Readonly<any>, prevState: Readonly<any>): void;
|
|
156
|
-
onUpArrow(): void;
|
|
157
|
-
onDownArrow(): void;
|
|
158
|
-
onValueChange(value: any, index: any): void;
|
|
159
|
-
onOrientationChange({ nativeEvent }: any): void;
|
|
160
|
-
setInputRef(ref: any): void;
|
|
161
|
-
getPlaceholderStyle(): any;
|
|
162
|
-
triggerOpenCloseCallbacks(): void;
|
|
163
|
-
togglePicker(animate?: boolean, postToggleCallback?: any): void;
|
|
164
|
-
renderPickerItems(): any;
|
|
165
|
-
renderInputAccessoryView(): JSX.Element;
|
|
166
|
-
renderIcon(): JSX.Element | null;
|
|
167
|
-
renderTextInputOrChildren(): JSX.Element;
|
|
168
|
-
renderIOS(): JSX.Element;
|
|
169
|
-
renderAndroidHeadless(): JSX.Element;
|
|
170
|
-
renderAndroidNativePickerStyle(): JSX.Element;
|
|
171
|
-
renderWeb(): JSX.Element;
|
|
172
|
-
render(): JSX.Element;
|
|
83
|
+
interface RNPickerSelectProps {
|
|
84
|
+
onValueChange: (value: any, index: any) => void;
|
|
85
|
+
items: any[];
|
|
86
|
+
value?: any;
|
|
87
|
+
placeholder?: any;
|
|
88
|
+
disabled?: boolean;
|
|
89
|
+
itemKey?: string | number;
|
|
90
|
+
style?: any;
|
|
91
|
+
children?: any;
|
|
92
|
+
onOpen?: () => void;
|
|
93
|
+
useNativeAndroidPickerStyle?: boolean;
|
|
94
|
+
fixAndroidTouchableBug?: boolean;
|
|
95
|
+
doneText?: string;
|
|
96
|
+
onDonePress?: () => void;
|
|
97
|
+
onUpArrow?: () => void;
|
|
98
|
+
onDownArrow?: () => void;
|
|
99
|
+
onClose?: () => void;
|
|
100
|
+
modalProps?: any;
|
|
101
|
+
textInputProps?: any;
|
|
102
|
+
pickerProps?: any;
|
|
103
|
+
touchableDoneProps?: any;
|
|
104
|
+
touchableWrapperProps?: any;
|
|
105
|
+
Icon?: any;
|
|
106
|
+
InputAccessoryView?: any;
|
|
173
107
|
}
|
|
174
|
-
export {
|
|
108
|
+
export declare function RNPickerSelect({ onValueChange, value, items, placeholder, disabled, itemKey, style, children, useNativeAndroidPickerStyle, fixAndroidTouchableBug, doneText, onDonePress, onUpArrow, onDownArrow, onOpen, onClose, modalProps, textInputProps, pickerProps, touchableDoneProps, touchableWrapperProps, Icon, InputAccessoryView, }: RNPickerSelectProps): JSX.Element;
|
|
109
|
+
export {};
|