Skip to content

Commit ed22f5e

Browse files
mzaienmzaien
committed
chore: update deps and lint code
1 parent ce2783d commit ed22f5e

File tree

6 files changed

+2566
-2242
lines changed

6 files changed

+2566
-2242
lines changed

‎bun.lockb‎

87.1 KB
Binary file not shown.

‎package.json‎

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -56,8 +56,7 @@
5656
"@react-native-community/eslint-config": "^3.0.2",
5757
"@release-it/conventional-changelog": "^5.0.0",
5858
"@types/jest": "^28.1.2",
59-
"@types/react": "~17.0.21",
60-
"@types/react-native": "0.70.0",
59+
"@types/react": "~19.1.12",
6160
"commitlint": "^17.0.2",
6261
"del-cli": "^5.0.0",
6362
"eslint": "^8.4.1",
@@ -71,16 +70,13 @@
7170
"jest": "^28.1.1",
7271
"pod-install": "^0.1.0",
7372
"prettier": "^2.0.5",
74-
"react": "18.2.0",
75-
"react-native": "0.72.3",
76-
"react-native-builder-bob": "^0.20.0",
73+
"react": "19.1.1",
74+
"react-native": "0.81.1",
75+
"react-native-builder-bob": "^0.40.13",
7776
"release-it": "^15.0.0",
7877
"typescript": "^5.0.2",
7978
"react-native-svg": ">=13.4.0"
8079
},
81-
"resolutions": {
82-
"@types/react": "17.0.21"
83-
},
8480
"peerDependencies": {
8581
"react": ">=16.8.0",
8682
"react-native": ">=0.70.0",
@@ -161,5 +157,6 @@
161157
}
162158
]
163159
]
164-
}
160+
},
161+
"packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
165162
}

‎src/PinCodeKey.tsx‎

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -28,14 +28,14 @@ function PinCodeKey({
2828
bioMetricIconWidth,
2929
disable = false,
3030
animated = false,
31-
animationProps
31+
animationProps,
3232
}: {
3333
item: string | number;
3434
onKeyPress: (value: any) => void;
3535
textStyle: TextStyle;
3636
onBioAuthPress?: () => void;
37-
backspaceIcon?: JSX.Element;
38-
bioMetricAuthIcon?: JSX.Element;
37+
backspaceIcon?: React.ReactElement;
38+
bioMetricAuthIcon?: React.ReactElement;
3939
backspaceIconFillColor: ColorValue;
4040
backspaceIconStrokeColor: ColorValue;
4141
bioMetricFillColor: ColorValue;
@@ -44,21 +44,24 @@ function PinCodeKey({
4444
bioMetricIconHeight: NumberProp;
4545
bioMetricIconWidth: NumberProp;
4646
disable?: boolean;
47-
animated?: boolean;
48-
animationProps?: {
49-
activeColor?: string;
50-
activeTextScale?: number;
51-
pressInDuration?: number
52-
pressOutDuration?: number
53-
}
47+
animated?: boolean;
48+
animationProps?: {
49+
activeColor?: string;
50+
activeTextScale?: number;
51+
pressInDuration?: number;
52+
pressOutDuration?: number;
53+
};
5454
}) {
5555
// animations
5656
const AnimatedPressable = Animated.createAnimatedComponent(Pressable);
5757
const anim = React.useRef(new Animated.Value(0)).current;
5858

5959
const bgColor = anim.interpolate({
6060
inputRange: [0, 1],
61-
outputRange: ['transparent', animationProps?.activeColor ?? 'rgba(255, 255, 255, 0.24)'],
61+
outputRange: [
62+
'transparent',
63+
animationProps?.activeColor ?? 'rgba(255, 255, 255, 0.24)',
64+
],
6265
});
6366
const textScale = anim.interpolate({
6467
inputRange: [0, 1],

‎src/PinCodeRow.tsx‎

Lines changed: 21 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,27 @@
1-
import type { PropsWithChildren } from "react";
2-
import React from "react";
3-
import { type StyleProp, View, type ViewStyle } from "react-native";
1+
import type { PropsWithChildren } from 'react';
2+
import React from 'react';
3+
import { type StyleProp, View, type ViewStyle } from 'react-native';
44

55
function PinCodeRow({
6-
rowReverse = false,
7-
children,
8-
style,
6+
rowReverse = false,
7+
children,
8+
style,
99
}: PropsWithChildren<{ rowReverse: boolean; style?: StyleProp<ViewStyle> }>) {
10-
return (
11-
<View
12-
style={[
13-
{
14-
flexDirection: rowReverse ? "row-reverse" : "row",
15-
width: "100%",
16-
minHeight: "11%",
17-
paddingHorizontal: 2,
18-
},
19-
style,
20-
]}
21-
>
22-
{children}
23-
</View>
24-
);
10+
return (
11+
<View
12+
style={[
13+
{
14+
flexDirection: rowReverse ? 'row-reverse' : 'row',
15+
width: '100%',
16+
minHeight: '11%',
17+
paddingHorizontal: 2,
18+
},
19+
style,
20+
]}
21+
>
22+
{children}
23+
</View>
24+
);
2525
}
2626

2727
export default PinCodeRow;

‎src/keypad.tsx‎

Lines changed: 83 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -1,93 +1,92 @@
1-
import React, { type ComponentProps } from "react";
2-
import type { ColorValue, StyleProp, TextStyle, ViewStyle } from "react-native";
3-
import type { NumberProp } from "react-native-svg";
4-
import PinCodeKey from "./PinCodeKey";
5-
import PinCodeRow from "./PinCodeRow";
1+
import React, { type ComponentProps, useId } from 'react';
2+
import type { ColorValue, StyleProp, TextStyle, ViewStyle } from 'react-native';
3+
import type { NumberProp } from 'react-native-svg';
4+
import PinCodeKey from './PinCodeKey';
5+
import PinCodeRow from './PinCodeRow';
66

77
export const Keypad = ({
8-
onKeyPress,
9-
textStyle = {},
10-
backspaceIcon,
11-
bioMetricAuthIcon,
12-
rowReverse = false,
13-
backspaceIconFillColor = "#000000",
14-
backspaceIconStrokeColor = "#FFFFFF",
15-
bioMetricFillColor = "#000000",
16-
backspaceIconHeight = 24,
17-
backspaceIconWidth = 33,
18-
bioMetricIconHeight = 28,
19-
bioMetricIconWidth = 28,
20-
onBioAuthPress,
21-
disable = false,
22-
animated = false,
23-
rowStyle,
8+
onKeyPress,
9+
textStyle = {},
10+
backspaceIcon,
11+
bioMetricAuthIcon,
12+
rowReverse = false,
13+
backspaceIconFillColor = '#000000',
14+
backspaceIconStrokeColor = '#FFFFFF',
15+
bioMetricFillColor = '#000000',
16+
backspaceIconHeight = 24,
17+
backspaceIconWidth = 33,
18+
bioMetricIconHeight = 28,
19+
bioMetricIconWidth = 28,
20+
onBioAuthPress,
21+
disable = false,
22+
animated = false,
23+
rowStyle,
2424
animationProps,
2525
}: {
26-
onKeyPress: (value: any) => void;
27-
textStyle?: TextStyle;
28-
rowReverse?: boolean;
29-
backspaceIcon?: JSX.Element;
30-
bioMetricAuthIcon?: JSX.Element;
31-
backspaceIconFillColor?: ColorValue;
32-
backspaceIconStrokeColor?: ColorValue;
33-
bioMetricFillColor?: ColorValue;
34-
backspaceIconHeight?: NumberProp;
35-
backspaceIconWidth?: NumberProp;
36-
bioMetricIconHeight?: NumberProp;
37-
bioMetricIconWidth?: NumberProp;
38-
onBioAuthPress?: () => void;
39-
disable?: boolean;
40-
animated?: boolean;
41-
rowStyle?: StyleProp<ViewStyle>;
42-
animationProps?: ComponentProps<typeof PinCodeKey>["animationProps"];
26+
onKeyPress: (value: any) => void;
27+
textStyle?: TextStyle;
28+
rowReverse?: boolean;
29+
backspaceIcon?: React.ReactElement;
30+
bioMetricAuthIcon?: React.ReactElement;
31+
backspaceIconFillColor?: ColorValue;
32+
backspaceIconStrokeColor?: ColorValue;
33+
bioMetricFillColor?: ColorValue;
34+
backspaceIconHeight?: NumberProp;
35+
backspaceIconWidth?: NumberProp;
36+
bioMetricIconHeight?: NumberProp;
37+
bioMetricIconWidth?: NumberProp;
38+
onBioAuthPress?: () => void;
39+
disable?: boolean;
40+
animated?: boolean;
41+
rowStyle?: StyleProp<ViewStyle>;
42+
animationProps?: ComponentProps<typeof PinCodeKey>['animationProps'];
4343
}) => {
44-
// ---------------------------------------------------
45-
// @ Defaults
46-
// ---------------------------------------------------
47-
const keys = [
48-
[1, 2, 3],
49-
[4, 5, 6],
50-
[7, 8, 9],
51-
["auth", 0, "delete"],
52-
];
53-
54-
// ---------------------------------------------------
55-
// @ Main View
56-
// ---------------------------------------------------
57-
return (
58-
<>
59-
{keys.map((list: any, index: number) => (
60-
// eslint-disable-next-line react/no-array-index-key
61-
<PinCodeRow
62-
rowReverse={rowReverse}
63-
key={`${index}-keypad-row`}
64-
style={rowStyle}
65-
>
66-
{list.map((item: string | number) => (
67-
<PinCodeKey
68-
key={`${item}-keypad-key`}
69-
item={item}
70-
textStyle={textStyle}
71-
backspaceIconFillColor={backspaceIconFillColor}
72-
backspaceIconStrokeColor={backspaceIconStrokeColor}
73-
bioMetricFillColor={bioMetricFillColor}
74-
backspaceIconHeight={backspaceIconHeight}
75-
backspaceIconWidth={backspaceIconWidth}
76-
bioMetricIconHeight={bioMetricIconHeight}
77-
bioMetricIconWidth={bioMetricIconWidth}
78-
backspaceIcon={backspaceIcon}
79-
bioMetricAuthIcon={bioMetricAuthIcon}
80-
onKeyPress={onKeyPress}
81-
onBioAuthPress={onBioAuthPress}
82-
disable={disable}
83-
animated={animated}
44+
// ---------------------------------------------------
45+
// @ Defaults
46+
// ---------------------------------------------------
47+
const keys = [
48+
[1, 2, 3],
49+
[4, 5, 6],
50+
[7, 8, 9],
51+
['auth', 0, 'delete'],
52+
];
53+
const id = useId();
54+
// ---------------------------------------------------
55+
// @ Main View
56+
// ---------------------------------------------------
57+
return (
58+
<>
59+
{keys.map((list: any) => (
60+
<PinCodeRow
61+
rowReverse={rowReverse}
62+
key={`${id}-keypad-row`}
63+
style={rowStyle}
64+
>
65+
{list.map((item: string | number) => (
66+
<PinCodeKey
67+
key={`${item}-keypad-key`}
68+
item={item}
69+
textStyle={textStyle}
70+
backspaceIconFillColor={backspaceIconFillColor}
71+
backspaceIconStrokeColor={backspaceIconStrokeColor}
72+
bioMetricFillColor={bioMetricFillColor}
73+
backspaceIconHeight={backspaceIconHeight}
74+
backspaceIconWidth={backspaceIconWidth}
75+
bioMetricIconHeight={bioMetricIconHeight}
76+
bioMetricIconWidth={bioMetricIconWidth}
77+
backspaceIcon={backspaceIcon}
78+
bioMetricAuthIcon={bioMetricAuthIcon}
79+
onKeyPress={onKeyPress}
80+
onBioAuthPress={onBioAuthPress}
81+
disable={disable}
82+
animated={animated}
8483
animationProps={animationProps}
85-
/>
86-
))}
87-
</PinCodeRow>
88-
))}
89-
</>
90-
);
84+
/>
85+
))}
86+
</PinCodeRow>
87+
))}
88+
</>
89+
);
9190
};
9291

9392
export default Keypad;

0 commit comments

Comments
 (0)