@hero-design/rn 8.2.1 → 8.2.3
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/.turbo/turbo-build.log +9 -9
- package/es/index.js +165 -52
- package/lib/index.js +163 -50
- package/package.json +5 -5
- package/src/components/BottomSheet/BottomSheetContext.ts +11 -0
- package/src/components/BottomSheet/ScrollView.tsx +57 -0
- package/src/components/BottomSheet/__tests__/__snapshots__/index.spec.tsx.snap +9 -24
- package/src/components/BottomSheet/__tests__/index.spec.tsx +17 -0
- package/src/components/BottomSheet/index.tsx +21 -8
- package/src/components/Box/StyledBox.tsx +8 -6
- package/src/components/Card/StyledCard.tsx +1 -1
- package/src/components/Card/__tests__/__snapshots__/index.spec.tsx.snap +74 -0
- package/src/components/Card/__tests__/index.spec.tsx +2 -0
- package/src/components/Card/index.tsx +1 -1
- package/src/components/DatePicker/__tests__/__snapshots__/DatePickerIOS.spec.tsx.snap +0 -24
- package/src/components/Icon/index.tsx +28 -2
- package/src/components/Select/MultiSelect/__tests__/__snapshots__/index.spec.tsx.snap +0 -72
- package/src/components/Select/SingleSelect/__tests__/__snapshots__/index.spec.tsx.snap +0 -36
- package/src/components/TextInput/__tests__/__snapshots__/index.spec.tsx.snap +160 -0
- package/src/components/TextInput/__tests__/index.spec.tsx +50 -3
- package/src/components/TextInput/index.tsx +65 -30
- package/src/components/TimePicker/__tests__/__snapshots__/TimePickerIOS.spec.tsx.snap +0 -24
- package/src/components/Toolbar/ToolbarGroup.tsx +20 -14
- package/src/components/Toolbar/ToolbarItem.tsx +9 -1
- package/src/components/Toolbar/__tests__/__snapshots__/ToolbarGroup.spec.tsx.snap +12 -0
- package/src/components/Toolbar/__tests__/__snapshots__/ToolbarItem.spec.tsx.snap +6 -0
- package/src/types.ts +4 -1
- package/src/utils/__tests__/helpers.spec.ts +22 -4
- package/src/utils/helpers.ts +10 -9
- package/types/components/BottomNavigation/StyledBottomNavigation.d.ts +1 -1
- package/types/components/BottomSheet/BottomSheetContext.d.ts +5 -0
- package/types/components/BottomSheet/ScrollView.d.ts +3 -0
- package/types/components/BottomSheet/index.d.ts +5 -3
- package/types/components/Box/StyledBox.d.ts +2 -2
- package/types/components/Button/StyledButton.d.ts +1 -1
- package/types/components/Button/UtilityButton/StyledUtilityButton.d.ts +1 -1
- package/types/components/Card/StyledCard.d.ts +1 -1
- package/types/components/Card/index.d.ts +1 -1
- package/types/components/Checkbox/StyledCheckbox.d.ts +1 -1
- package/types/components/ContentNavigator/StyledContentNavigator.d.ts +1 -1
- package/types/components/FAB/ActionGroup/StyledActionItem.d.ts +1 -1
- package/types/components/Icon/index.d.ts +3 -3
- package/types/components/TextInput/StyledTextInput.d.ts +7 -7
- package/types/components/TextInput/index.d.ts +25 -3
- package/types/components/Toolbar/ToolbarItem.d.ts +6 -1
- package/types/types.d.ts +3 -2
- package/types/utils/helpers.d.ts +2 -2
|
@@ -2,10 +2,19 @@ import { omit, pick } from '../helpers';
|
|
|
2
2
|
|
|
3
3
|
describe('pick', () => {
|
|
4
4
|
it('works', () => {
|
|
5
|
-
const keys = ['a', 'b', 'f'];
|
|
6
5
|
const props = { a: 1, b: true, c: 'outline', d: null, f: 'whatever' };
|
|
7
6
|
|
|
8
|
-
expect(pick(
|
|
7
|
+
expect(pick(['a', 'b', 'f'], props)).toEqual({
|
|
8
|
+
a: 1,
|
|
9
|
+
b: true,
|
|
10
|
+
f: 'whatever',
|
|
11
|
+
});
|
|
12
|
+
});
|
|
13
|
+
|
|
14
|
+
it('work with any', () => {
|
|
15
|
+
const props: any = { a: 1, b: true, c: 'outline', d: null, f: 'whatever' };
|
|
16
|
+
|
|
17
|
+
expect(pick(['a', 'b', 'f'], props)).toEqual({
|
|
9
18
|
a: 1,
|
|
10
19
|
b: true,
|
|
11
20
|
f: 'whatever',
|
|
@@ -15,10 +24,19 @@ describe('pick', () => {
|
|
|
15
24
|
|
|
16
25
|
describe('omit', () => {
|
|
17
26
|
it('works', () => {
|
|
18
|
-
const keys = ['a', 'b'];
|
|
19
27
|
const props = { a: 1, b: true, c: 'outline', d: null, f: 'whatever' };
|
|
20
28
|
|
|
21
|
-
expect(omit(
|
|
29
|
+
expect(omit(['a', 'b'], props)).toEqual({
|
|
30
|
+
c: 'outline',
|
|
31
|
+
d: null,
|
|
32
|
+
f: 'whatever',
|
|
33
|
+
});
|
|
34
|
+
});
|
|
35
|
+
|
|
36
|
+
it('work with any', () => {
|
|
37
|
+
const props: any = { a: 1, b: true, c: 'outline', d: null, f: 'whatever' };
|
|
38
|
+
|
|
39
|
+
expect(omit(['a', 'b'], props)).toEqual({
|
|
22
40
|
c: 'outline',
|
|
23
41
|
d: null,
|
|
24
42
|
f: 'whatever',
|
package/src/utils/helpers.ts
CHANGED
|
@@ -3,23 +3,24 @@ import { Platform } from 'react-native';
|
|
|
3
3
|
export const isIOS = Platform.OS === 'ios';
|
|
4
4
|
export const isAndroid = Platform.OS === 'android';
|
|
5
5
|
|
|
6
|
-
export
|
|
7
|
-
keys
|
|
8
|
-
.filter((key) => key in
|
|
9
|
-
.reduce(
|
|
6
|
+
export function pick<O, T extends keyof O>(keys: T[], obj: O): Pick<O, T> {
|
|
7
|
+
return keys
|
|
8
|
+
.filter((key) => key in obj)
|
|
9
|
+
.reduce<Partial<O>>(
|
|
10
10
|
(result, cur) => ({
|
|
11
11
|
...result,
|
|
12
|
-
[cur]:
|
|
12
|
+
[cur]: obj[cur],
|
|
13
13
|
}),
|
|
14
14
|
{}
|
|
15
|
-
)
|
|
15
|
+
) as Pick<O, T>;
|
|
16
|
+
}
|
|
16
17
|
|
|
17
|
-
export
|
|
18
|
-
const result =
|
|
18
|
+
export function omit<O, T extends keyof O>(keys: T[], obj: O): Omit<O, T> {
|
|
19
|
+
const result = obj;
|
|
19
20
|
|
|
20
21
|
keys.forEach((key) => {
|
|
21
22
|
delete result[key];
|
|
22
23
|
});
|
|
23
24
|
|
|
24
25
|
return result;
|
|
25
|
-
}
|
|
26
|
+
}
|
|
@@ -44,7 +44,7 @@ declare const BottomBarItem: import("@emotion/native").StyledComponent<import("r
|
|
|
44
44
|
}, {}, {
|
|
45
45
|
ref?: import("react").Ref<View> | undefined;
|
|
46
46
|
}>;
|
|
47
|
-
declare const StyledBottomBarText: import("@emotion/native").StyledComponent<import("
|
|
47
|
+
declare const StyledBottomBarText: import("@emotion/native").StyledComponent<import("../..").TextProps & {
|
|
48
48
|
theme?: import("@emotion/react").Theme | undefined;
|
|
49
49
|
as?: import("react").ElementType<any> | undefined;
|
|
50
50
|
}, {}, {}>;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { KeyboardAvoidingViewProps } from 'react-native';
|
|
2
1
|
import type { ReactElement, ReactNode } from 'react';
|
|
3
2
|
import type { StyleProp, ViewStyle } from 'react-native';
|
|
3
|
+
import { KeyboardAvoidingViewProps } from 'react-native';
|
|
4
4
|
interface BottomSheetProps {
|
|
5
5
|
/**
|
|
6
6
|
* Bottom sheet open state.
|
|
@@ -60,5 +60,7 @@ interface BottomSheetProps {
|
|
|
60
60
|
* */
|
|
61
61
|
keyboardAvoidingViewProps?: KeyboardAvoidingViewProps;
|
|
62
62
|
}
|
|
63
|
-
declare const
|
|
64
|
-
|
|
63
|
+
declare const _default: (({ open, header, footer, children, onAnimationEnd, onOpen, onRequestClose, onDismiss, showCloseButton, hasBackdrop, showDivider, style, testID, keyboardAvoidingViewProps, }: BottomSheetProps) => JSX.Element) & {
|
|
64
|
+
ScrollView: ({ scrollEventThrottle, ...props }: import("react-native").ScrollViewProps) => JSX.Element;
|
|
65
|
+
};
|
|
66
|
+
export default _default;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Theme } from '@emotion/react';
|
|
2
2
|
import { View } from 'react-native';
|
|
3
|
-
import { StyleProps } from './types';
|
|
3
|
+
import { FlexStyleProps, StyleProps } from './types';
|
|
4
4
|
export declare const getThemeValue: (theme: Theme, key: keyof StyleProps, props: StyleProps) => {
|
|
5
5
|
[x: string]: string;
|
|
6
6
|
} | {
|
|
@@ -9,7 +9,7 @@ export declare const getThemeValue: (theme: Theme, key: keyof StyleProps, props:
|
|
|
9
9
|
declare const StyledBox: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
|
|
10
10
|
theme?: Theme | undefined;
|
|
11
11
|
as?: import("react").ElementType<any> | undefined;
|
|
12
|
-
} & StyleProps, {}, {
|
|
12
|
+
} & StyleProps & FlexStyleProps, {}, {
|
|
13
13
|
ref?: import("react").Ref<View> | undefined;
|
|
14
14
|
}>;
|
|
15
15
|
export { StyledBox };
|
|
@@ -11,7 +11,7 @@ declare const StyledButtonContainer: import("@emotion/native").StyledComponent<i
|
|
|
11
11
|
}, {}, {
|
|
12
12
|
ref?: import("react").Ref<TouchableOpacity> | undefined;
|
|
13
13
|
}>;
|
|
14
|
-
declare const StyledButtonText: import("@emotion/native").StyledComponent<import("
|
|
14
|
+
declare const StyledButtonText: import("@emotion/native").StyledComponent<import("../..").TextProps & {
|
|
15
15
|
theme?: Theme | undefined;
|
|
16
16
|
as?: import("react").ElementType<any> | undefined;
|
|
17
17
|
} & {
|
|
@@ -11,7 +11,7 @@ export declare const IconWrapper: import("@emotion/native").StyledComponent<impo
|
|
|
11
11
|
}, {}, {
|
|
12
12
|
ref?: import("react").Ref<View> | undefined;
|
|
13
13
|
}>;
|
|
14
|
-
export declare const ButtonText: import("@emotion/native").StyledComponent<import("
|
|
14
|
+
export declare const ButtonText: import("@emotion/native").StyledComponent<import("../../..").TextProps & {
|
|
15
15
|
theme?: import("@emotion/react").Theme | undefined;
|
|
16
16
|
as?: import("react").ElementType<any> | undefined;
|
|
17
17
|
}, {}, {}>;
|
|
@@ -3,7 +3,7 @@ declare const StyledCard: import("@emotion/native").StyledComponent<import("reac
|
|
|
3
3
|
theme?: import("@emotion/react").Theme | undefined;
|
|
4
4
|
as?: import("react").ElementType<any> | undefined;
|
|
5
5
|
} & {
|
|
6
|
-
themeIntent?: "primary" | "success" | "warning" | undefined;
|
|
6
|
+
themeIntent?: "primary" | "success" | "warning" | "danger" | "archived" | undefined;
|
|
7
7
|
}, {}, {
|
|
8
8
|
ref?: import("react").Ref<View> | undefined;
|
|
9
9
|
}>;
|
|
@@ -8,7 +8,7 @@ export declare const StyledWrapper: import("@emotion/native").StyledComponent<im
|
|
|
8
8
|
}, {}, {
|
|
9
9
|
ref?: import("react").Ref<TouchableOpacity> | undefined;
|
|
10
10
|
}>;
|
|
11
|
-
export declare const StyledDescription: import("@emotion/native").StyledComponent<import("
|
|
11
|
+
export declare const StyledDescription: import("@emotion/native").StyledComponent<import("../..").TextProps & {
|
|
12
12
|
theme?: import("@emotion/react").Theme | undefined;
|
|
13
13
|
as?: import("react").ElementType<any> | undefined;
|
|
14
14
|
}, {}, {}>;
|
|
@@ -5,7 +5,7 @@ declare const Wrapper: import("@emotion/native").StyledComponent<import("react-n
|
|
|
5
5
|
}, {}, {
|
|
6
6
|
ref?: import("react").Ref<View> | undefined;
|
|
7
7
|
}>;
|
|
8
|
-
declare const Value: import("@emotion/native").StyledComponent<import("
|
|
8
|
+
declare const Value: import("@emotion/native").StyledComponent<import("../..").TextProps & {
|
|
9
9
|
theme?: import("@emotion/react").Theme | undefined;
|
|
10
10
|
as?: import("react").ElementType<any> | undefined;
|
|
11
11
|
}, {}, {}>;
|
|
@@ -7,7 +7,7 @@ declare const StyledActionItem: import("@emotion/native").StyledComponent<Toucha
|
|
|
7
7
|
}, {}, {
|
|
8
8
|
ref?: import("react").Ref<TouchableOpacity> | undefined;
|
|
9
9
|
}>;
|
|
10
|
-
declare const StyledActionItemText: import("@emotion/native").StyledComponent<import("
|
|
10
|
+
declare const StyledActionItemText: import("@emotion/native").StyledComponent<import("../../..").TextProps & {
|
|
11
11
|
theme?: import("@emotion/react").Theme | undefined;
|
|
12
12
|
as?: import("react").ElementType<any> | undefined;
|
|
13
13
|
} & TouchableOpacityProps, {}, {}>;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import type { StyleProp, TextStyle } from 'react-native';
|
|
1
|
+
import type { AccessibilityProps, StyleProp, TextStyle } from 'react-native';
|
|
2
2
|
import IconList from './IconList';
|
|
3
3
|
export declare type IconName = typeof IconList[number];
|
|
4
|
-
export interface IconProps {
|
|
4
|
+
export interface IconProps extends AccessibilityProps {
|
|
5
5
|
/**
|
|
6
6
|
* Name of the Icon.
|
|
7
7
|
*/
|
|
@@ -28,7 +28,7 @@ export interface IconProps {
|
|
|
28
28
|
testID?: string;
|
|
29
29
|
}
|
|
30
30
|
declare const Icon: {
|
|
31
|
-
({ icon, style, size, intent, testID, spin, }: IconProps): JSX.Element;
|
|
31
|
+
({ icon, style, size, intent, testID, spin, accessibilityLabel, accessibilityHint, accessibilityRole, accessibilityState, accessibilityValue, accessibilityLiveRegion, accessibilityElementsHidden, accessible, accessibilityIgnoresInvertColors, accessibilityViewIsModal, accessibilityActions, }: IconProps): JSX.Element;
|
|
32
32
|
List: readonly ["activate", "add-emoji", "add-person", "adjustment", "alignment", "antenna", "archive", "assignment-warning", "bank", "bell", "billing", "bookmark", "box-check", "box", "buildings", "cake", "calendar-clock", "calendar", "candy-box-menu", "caret-down-small", "caret-down", "caret-left-small", "caret-left", "caret-right-small", "caret-right", "caret-up-small", "caret-up", "check-radio", "circle-add", "circle-cancel", "circle-check", "circle-down", "circle-info", "circle-left", "circle-ok", "circle-pencil", "circle-question", "circle-remove", "circle-right", "circle-up", "circle-warning", "clock-3", "clock", "cloud-download", "cloud-upload", "cog", "coin", "contacts", "credit-card", "diamond", "direction-arrows", "directory", "document", "dollar-coin-shine", "double-buildings", "edit-template", "envelope", "expense", "eye-circle", "eye-invisible", "eye", "face-meh", "face-sad", "face-smiley", "feed", "feedbacks", "file-certified", "file-clone", "file-copy", "file-csv", "file-dispose", "file-doc", "file-excel", "file-export", "file-lock", "file-pdf", "file-powerpoint", "file-search", "file-secured", "file-sheets", "file-slide", "file-verified", "file-word", "file", "filter", "folder-user", "folder", "format-bold", "format-heading1", "format-heading2", "format-italic", "format-list-bulleted", "format-list-numbered", "format-underlined", "funnel-filter", "global-dollar", "globe", "graduation-cap", "graph", "happy-sun", "health-bag", "heart", "home", "image", "import", "incident-siren", "instapay", "list", "loading-2", "loading", "location", "lock", "looks-one", "looks-two", "media-content", "menu", "moneybag", "moon", "multiple-stars", "multiple-users", "node", "open-folder", "paperclip", "payment-summary", "pencil", "phone", "piggy-bank", "plane", "play-circle", "print", "raising-hands", "reply-arrow", "reply", "reschedule", "rostering", "save", "schedule-send", "schedule", "search-person", "send", "speaker-active", "speaker", "star-award", "star-badge", "star-medal", "star", "steps-circle", "stopwatch", "suitcase", "survey", "swag", "switch", "tag", "target", "teams", "timesheet", "touch-id", "trash-bin", "unlock", "user", "video-1", "video-2", "wallet", "warning", "activate-outlined", "add-credit-card-outlined", "add-person-outlined", "add-section-outlined", "add-time-outlined", "add", "adjustment-outlined", "alignment-2-outlined", "alignment-outlined", "all-caps", "arrow-down", "arrow-downwards", "arrow-left", "arrow-leftwards", "arrow-right", "arrow-rightwards", "arrow-up", "arrow-upwards", "at-sign", "bell-active-outlined", "bell-outlined", "bell-slash-outlined", "billing-outlined", "body-outlined", "bold", "bookmark-added-outlined", "bookmark-outlined", "box-check-outlined", "box-outlined", "bullet-points", "cake-outlined", "calendar-dates-outlined", "calendar-star-outlined", "camera-outlined", "cancel", "chat-bubble-outlined", "chat-unread-outlined", "checkmark", "circle-add-outlined", "circle-cancel-outlined", "circle-down-outlined", "circle-info-outlined", "circle-left-outlined", "circle-ok-outlined", "circle-question-outlined", "circle-remove-outlined", "circle-right-outlined", "circle-up-outlined", "circle-warning-outlined", "clock-2-outlined", "clock-outlined", "cog-outlined", "coin-outlined", "comment-outlined", "contacts-outlined", "credit-card-outlined", "cup-outlined", "direction-arrows-outlined", "directory-outlined", "document-outlined", "dollar-card-outlined", "dollar-coin-shine-outlined", "dollar-sign", "double-buildings-outlined", "double-left-arrows", "double-right-arrows", "download-outlined", "edit-template-outlined", "email-outlined", "enter-arrow", "envelope-outlined", "expense-outlined", "explore-outlined", "external-link", "eye-invisible-outlined", "eye-outlined", "face-id", "face-meh-outlined", "face-open-smiley-outlined", "face-sad-outlined", "face-smiley-outlined", "feed-outlined", "file-certified-outlined", "file-clone-outlined", "file-copy-outlined", "file-dispose-outlined", "file-dollar-outlined", "file-download-outlined", "file-export-outlined", "file-lock-outlined", "file-outlined", "file-search-outlined", "file-secured-outlined", "file-verified-outlined", "filter-outlined", "folder-outlined", "folder-user-outlined", "funnel-filter-outline", "graph-outlined", "hand-holding-user-outlined", "happy-sun-outlined", "health-bag-outlined", "heart-outlined", "home-active-outlined", "home-outlined", "id-card-outlined", "image-outlined", "import-outlined", "instapay-outlined", "italic", "link-1", "link-2", "list-outlined", "live-help-outlined", "location-outlined", "lock-outlined", "locked-file-outlined", "log-out", "media-content-outlined", "menu-close", "menu-expand", "menu-fold-outlined", "menu-unfold-outlined", "moneybag-outlined", "moon-outlined", "more-horizontal", "more-vertical", "multiple-folders-outlined", "multiple-users-outlined", "near-me-outlined", "node-outlined", "number-points", "number", "payment-summary-outlined", "payslip-outlined", "pencil-outlined", "percentage", "phone-outlined", "piggy-bank-outlined", "plane-outlined", "play-circle-outlined", "print-outlined", "qr-code-outlined", "qualification-outlined", "re-assign", "redeem", "refresh", "remove", "reply-outlined", "restart", "return-arrow", "rostering-outlined", "save-outlined", "schedule-outlined", "search-outlined", "search-secured-outlined", "send-outlined", "share-1", "share-2", "share-outlined", "single-down-arrow", "single-left-arrow", "single-right-arrow", "single-up-arrow", "speaker-active-outlined", "speaker-outlined", "star-outlined", "stopwatch-outlined", "strikethrough", "suitcase-clock-outlined", "suitcase-outlined", "survey-outlined", "switch-outlined", "sync", "target-outlined", "timesheet-outlined", "today-outlined", "transfer", "trash-bin-outlined", "umbrela-outlined", "unavailable", "underline", "unlock-outlined", "upload-outlined", "user-circle-outlined", "user-gear-outlined", "user-outlined", "user-rectangle-outlined", "video-1-outlined", "video-2-outlined", "wallet-outlined"];
|
|
33
33
|
};
|
|
34
34
|
export default Icon;
|
|
@@ -12,13 +12,13 @@ declare const StyledLabelContainer: import("@emotion/native").StyledComponent<im
|
|
|
12
12
|
}, {}, {
|
|
13
13
|
ref?: import("react").Ref<View> | undefined;
|
|
14
14
|
}>;
|
|
15
|
-
declare const StyledLabel: import("@emotion/native").StyledComponent<import("
|
|
15
|
+
declare const StyledLabel: import("@emotion/native").StyledComponent<import("../..").TextProps & {
|
|
16
16
|
theme?: import("@emotion/react").Theme | undefined;
|
|
17
17
|
as?: import("react").ElementType<any> | undefined;
|
|
18
18
|
} & {
|
|
19
19
|
themeVariant: Variant;
|
|
20
20
|
}, {}, {}>;
|
|
21
|
-
declare const StyledAsteriskLabel: import("@emotion/native").StyledComponent<import("
|
|
21
|
+
declare const StyledAsteriskLabel: import("@emotion/native").StyledComponent<import("../..").TextProps & {
|
|
22
22
|
theme?: import("@emotion/react").Theme | undefined;
|
|
23
23
|
as?: import("react").ElementType<any> | undefined;
|
|
24
24
|
} & {
|
|
@@ -30,13 +30,13 @@ declare const StyledLabelContainerInsideTextInput: import("@emotion/native").Sty
|
|
|
30
30
|
}, {}, {
|
|
31
31
|
ref?: import("react").Ref<View> | undefined;
|
|
32
32
|
}>;
|
|
33
|
-
declare const StyledLabelInsideTextInput: import("@emotion/native").StyledComponent<import("
|
|
33
|
+
declare const StyledLabelInsideTextInput: import("@emotion/native").StyledComponent<import("../..").TextProps & {
|
|
34
34
|
theme?: import("@emotion/react").Theme | undefined;
|
|
35
35
|
as?: import("react").ElementType<any> | undefined;
|
|
36
36
|
} & {
|
|
37
37
|
themeVariant: Variant;
|
|
38
38
|
}, {}, {}>;
|
|
39
|
-
declare const StyledAsteriskLabelInsideTextInput: import("@emotion/native").StyledComponent<import("
|
|
39
|
+
declare const StyledAsteriskLabelInsideTextInput: import("@emotion/native").StyledComponent<import("../..").TextProps & {
|
|
40
40
|
theme?: import("@emotion/react").Theme | undefined;
|
|
41
41
|
as?: import("react").ElementType<any> | undefined;
|
|
42
42
|
} & {
|
|
@@ -48,17 +48,17 @@ declare const StyledErrorContainer: import("@emotion/native").StyledComponent<im
|
|
|
48
48
|
}, {}, {
|
|
49
49
|
ref?: import("react").Ref<View> | undefined;
|
|
50
50
|
}>;
|
|
51
|
-
declare const StyledError: import("@emotion/native").StyledComponent<import("
|
|
51
|
+
declare const StyledError: import("@emotion/native").StyledComponent<import("../..").TextProps & {
|
|
52
52
|
theme?: import("@emotion/react").Theme | undefined;
|
|
53
53
|
as?: import("react").ElementType<any> | undefined;
|
|
54
54
|
}, {}, {}>;
|
|
55
|
-
declare const StyledMaxLengthMessage: import("@emotion/native").StyledComponent<import("
|
|
55
|
+
declare const StyledMaxLengthMessage: import("@emotion/native").StyledComponent<import("../..").TextProps & {
|
|
56
56
|
theme?: import("@emotion/react").Theme | undefined;
|
|
57
57
|
as?: import("react").ElementType<any> | undefined;
|
|
58
58
|
} & {
|
|
59
59
|
themeVariant: Variant;
|
|
60
60
|
}, {}, {}>;
|
|
61
|
-
declare const StyledHelperText: import("@emotion/native").StyledComponent<import("
|
|
61
|
+
declare const StyledHelperText: import("@emotion/native").StyledComponent<import("../..").TextProps & {
|
|
62
62
|
theme?: import("@emotion/react").Theme | undefined;
|
|
63
63
|
as?: import("react").ElementType<any> | undefined;
|
|
64
64
|
}, {}, {}>;
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { TextInput as RNTextInput } from 'react-native';
|
|
2
3
|
import type { TextInputProps as NativeTextInputProps, StyleProp, ViewStyle, TextStyle } from 'react-native';
|
|
3
4
|
import type { Variant } from './StyledTextInput';
|
|
4
5
|
import type { IconName } from '../Icon';
|
|
6
|
+
export declare type TextInputHandles = Pick<RNTextInput, 'focus' | 'clear' | 'blur' | 'isFocused' | 'setNativeProps'>;
|
|
5
7
|
export interface TextInputProps extends NativeTextInputProps {
|
|
6
8
|
/**
|
|
7
9
|
* Field label.
|
|
@@ -37,7 +39,7 @@ export interface TextInputProps extends NativeTextInputProps {
|
|
|
37
39
|
error?: string;
|
|
38
40
|
/**
|
|
39
41
|
* Whether the input is required, if true, an asterisk will be appended to the label.
|
|
40
|
-
|
|
42
|
+
*/
|
|
41
43
|
required?: boolean;
|
|
42
44
|
/**
|
|
43
45
|
* Placeholder text to display.
|
|
@@ -47,11 +49,31 @@ export interface TextInputProps extends NativeTextInputProps {
|
|
|
47
49
|
* Whether the input is editable.
|
|
48
50
|
* */
|
|
49
51
|
editable?: boolean;
|
|
52
|
+
/**
|
|
53
|
+
* Whether the input is disabled.
|
|
54
|
+
*/
|
|
50
55
|
disabled?: boolean;
|
|
56
|
+
/**
|
|
57
|
+
* Whether the input is loading.
|
|
58
|
+
*/
|
|
51
59
|
loading?: boolean;
|
|
60
|
+
/**
|
|
61
|
+
* The max length of the input.
|
|
62
|
+
* If the max length is set, the input will display the current length and the max length.
|
|
63
|
+
* */
|
|
52
64
|
maxLength?: number;
|
|
65
|
+
/**
|
|
66
|
+
* The helper text to display.
|
|
67
|
+
*/
|
|
53
68
|
helpText?: string;
|
|
69
|
+
/**
|
|
70
|
+
* Customise input value renderer
|
|
71
|
+
*/
|
|
54
72
|
renderInputValue?: (inputProps: NativeTextInputProps) => React.ReactNode;
|
|
73
|
+
/**
|
|
74
|
+
* Component ref.
|
|
75
|
+
*/
|
|
76
|
+
ref?: React.Ref<TextInputHandles>;
|
|
55
77
|
}
|
|
56
78
|
export declare const getVariant: ({ disabled, error, editable, loading, isEmptyValue, }: {
|
|
57
79
|
disabled?: boolean | undefined;
|
|
@@ -61,5 +83,5 @@ export declare const getVariant: ({ disabled, error, editable, loading, isEmptyV
|
|
|
61
83
|
isFocused?: boolean | undefined;
|
|
62
84
|
isEmptyValue?: boolean | undefined;
|
|
63
85
|
}) => Variant;
|
|
64
|
-
declare const
|
|
65
|
-
export default
|
|
86
|
+
declare const _default: React.ForwardRefExoticComponent<Pick<TextInputProps, "children" | "label" | "style" | "hitSlop" | "onLayout" | "pointerEvents" | "removeClippedSubviews" | "testID" | "nativeID" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "focusable" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "disabled" | "value" | "onBlur" | "onFocus" | "onPressIn" | "onPressOut" | "allowFontScaling" | "numberOfLines" | "maxFontSizeMultiplier" | "selectionColor" | "textBreakStrategy" | "loading" | "textAlign" | "error" | "textAlignVertical" | "onContentSizeChange" | "onScroll" | "scrollEnabled" | "onChange" | "autoCapitalize" | "autoCorrect" | "autoFocus" | "blurOnSubmit" | "caretHidden" | "contextMenuHidden" | "defaultValue" | "editable" | "keyboardType" | "maxLength" | "multiline" | "onChangeText" | "onEndEditing" | "onSelectionChange" | "onSubmitEditing" | "onTextInput" | "onKeyPress" | "placeholder" | "placeholderTextColor" | "returnKeyType" | "secureTextEntry" | "selectTextOnFocus" | "selection" | "inputAccessoryViewID" | "clearButtonMode" | "clearTextOnFocus" | "dataDetectorTypes" | "enablesReturnKeyAutomatically" | "keyboardAppearance" | "passwordRules" | "rejectResponderTermination" | "selectionState" | "spellCheck" | "textContentType" | "autoComplete" | "importantForAutofill" | "disableFullscreenUI" | "inlineImageLeft" | "inlineImagePadding" | "returnKeyLabel" | "underlineColorAndroid" | "showSoftInputOnFocus" | "prefix" | "suffix" | "textStyle" | "accessibilityLabelledBy" | "required" | "helpText" | "renderInputValue"> & React.RefAttributes<TextInputHandles>>;
|
|
87
|
+
export default _default;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { StyleProp, ViewStyle } from 'react-native';
|
|
1
2
|
import type { IconName } from '../Icon';
|
|
2
3
|
export interface ToolbarItemProps {
|
|
3
4
|
/**
|
|
@@ -20,6 +21,10 @@ export interface ToolbarItemProps {
|
|
|
20
21
|
* Whether the toolbar item is disabled.
|
|
21
22
|
*/
|
|
22
23
|
disabled?: boolean;
|
|
24
|
+
/**
|
|
25
|
+
* Addtitional style.
|
|
26
|
+
*/
|
|
27
|
+
style?: StyleProp<ViewStyle>;
|
|
23
28
|
}
|
|
24
|
-
declare const ToolbarItem: ({ icon, label, onPress, intent, disabled, }: ToolbarItemProps) => JSX.Element;
|
|
29
|
+
declare const ToolbarItem: ({ icon, label, onPress, intent, disabled, style, }: ToolbarItemProps) => JSX.Element;
|
|
25
30
|
export default ToolbarItem;
|
package/types/types.d.ts
CHANGED
|
@@ -2,9 +2,10 @@ import type { BottomNavigationTabType } from './components/BottomNavigation';
|
|
|
2
2
|
import type { IconName } from './components/Icon';
|
|
3
3
|
import type { SingleSelectProps, MultiSelectProps } from './components/Select';
|
|
4
4
|
import type { TabType } from './components/Tabs';
|
|
5
|
-
import type { TextInputProps } from './components/TextInput';
|
|
5
|
+
import type { TextInputProps, TextInputHandles } from './components/TextInput';
|
|
6
6
|
import type { RichTextEditorRef, RichTextEditorProps } from './components/RichTextEditor';
|
|
7
7
|
import type { Theme } from './theme';
|
|
8
8
|
import type { ListRenderOptionInfo, SectionListRenderOptionInfo } from './components/Select/types';
|
|
9
9
|
import { SwipeableProps } from './components/Swipeable';
|
|
10
|
-
|
|
10
|
+
import { TextProps } from './components/Typography/Text';
|
|
11
|
+
export type { BottomNavigationTabType, IconName, SingleSelectProps, MultiSelectProps, ListRenderOptionInfo, SectionListRenderOptionInfo, SwipeableProps, RichTextEditorProps, RichTextEditorRef, TabType, TextInputProps, TextProps, TextInputHandles, Theme, };
|
package/types/utils/helpers.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export declare const isIOS: boolean;
|
|
2
2
|
export declare const isAndroid: boolean;
|
|
3
|
-
export declare
|
|
4
|
-
export declare
|
|
3
|
+
export declare function pick<O, T extends keyof O>(keys: T[], obj: O): Pick<O, T>;
|
|
4
|
+
export declare function omit<O, T extends keyof O>(keys: T[], obj: O): Omit<O, T>;
|