Skip to content

Commit 94953b5

Browse files
author
ignaciosantise
committed
chore: changed accent color + ui improvements
1 parent aaf06cd commit 94953b5

File tree

15 files changed

+105
-71
lines changed

15 files changed

+105
-71
lines changed

‎packages/scaffold/src/modal/w3m-button/index.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@ export function W3mButton({
3737
size={size}
3838
label={label}
3939
loadingLabel={loadingLabel}
40+
disabled={disabled}
4041
testID="button-connect"
4142
/>
4243
);

‎packages/scaffold/src/modal/w3m-connect-button/index.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ export interface W3mConnectButtonProps {
77
loadingLabel: string;
88
size?: ConnectButtonProps['size'];
99
style?: ConnectButtonProps['style'];
10+
disabled?: ConnectButtonProps['disabled'];
1011
testID?: string;
1112
}
1213

@@ -15,6 +16,7 @@ export function W3mConnectButton({
1516
loadingLabel,
1617
size = 'md',
1718
style,
19+
disabled,
1820
testID
1921
}: W3mConnectButtonProps) {
2022
const { open, loading } = useSnapshot(ModalController.state);
@@ -26,6 +28,7 @@ export function W3mConnectButton({
2628
loading={loading || open}
2729
style={style}
2830
testID={testID}
31+
disabled={disabled}
2932
>
3033
{loading || open ? loadingLabel : label}
3134
</ConnectButton>

‎packages/scaffold/src/views/w3m-connect-view/components/connect-email-input.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,9 +21,11 @@ export function ConnectEmailInput({ isEmailEnabled, showSeparator, loading }: Pr
2121
const { connectors } = useSnapshot(ConnectorController.state);
2222
const [inputLoading, setInputLoading] = useState(false);
2323
const [error, setError] = useState('');
24+
const [isValidEmail, setIsValidEmail] = useState(false);
2425
const emailProvider = connectors.find(c => c.type === 'EMAIL')?.provider as W3mFrameProvider;
2526

26-
const onChangeText = () => {
27+
const onChangeText = (value: string) => {
28+
setIsValidEmail(CoreHelperUtil.isValidEmail(value));
2729
setError('');
2830
};
2931

@@ -68,6 +70,7 @@ export function ConnectEmailInput({ isEmailEnabled, showSeparator, loading }: Pr
6870
loading={inputLoading || loading}
6971
errorMessage={error}
7072
onChangeText={onChangeText}
73+
submitEnabled={isValidEmail}
7174
/>
7275
</FlexView>
7376
{showSeparator && <Separator text="or" style={styles.emailSeparator} />}

‎packages/scaffold/src/views/w3m-update-email-wallet-view/index.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ export function UpdateEmailWalletView() {
3434
};
3535

3636
const onEmailSubmit = async (value: string) => {
37-
if (!emailConnector || !isValidNewEmail) return;
37+
if (!emailConnector) return;
3838

3939
const provider = emailConnector.provider as W3mFrameProvider;
4040
setLoading(true);
@@ -79,17 +79,17 @@ export function UpdateEmailWalletView() {
7979
margin={['0', 'xs', '0', 'xs']}
8080
>
8181
<Button onPress={RouterController.goBack} variant="shade" style={styles.cancelButton}>
82-
<Text variant="paragraph-600">Cancel</Text>
82+
<Text variant="paragraph-600" color="inverse-100">
83+
Cancel
84+
</Text>
8385
</Button>
8486
<Button
8587
onPress={() => onEmailSubmit(email)}
8688
variant="fill"
8789
style={styles.saveButton}
8890
disabled={loading || !isValidNewEmail}
8991
>
90-
<Text color="inverse-100" variant="paragraph-600">
91-
Save
92-
</Text>
92+
Save
9393
</Button>
9494
</FlexView>
9595
</FlexView>

‎packages/scaffold/src/views/w3m-what-is-a-wallet-view/index.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -56,8 +56,8 @@ export function WhatIsAWalletView() {
5656
>
5757
Get a wallet
5858
</Button>
59-
<Link size="sm" iconLeft="helpCircle" onPress={undefined} style={styles.helpButton}>
60-
What is an email wallet
59+
<Link size="sm" iconLeft="helpCircle" onPress={() => undefined}>
60+
What is an email wallet?
6161
</Link>
6262
</FlexView>
6363
</ScrollView>

‎packages/ui/src/components/wui-card/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export function Card({ children, style }: CardProps) {
1818
enabled={Platform.OS === 'ios'}
1919
style={[
2020
styles.container,
21-
{ backgroundColor: Theme['bg-125'], borderColor: Theme['gray-glass-005'] },
21+
{ backgroundColor: Theme['bg-100'], borderColor: Theme['gray-glass-005'] },
2222
style
2323
]}
2424
>

‎packages/ui/src/components/wui-loading-spinner/index.tsx

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,7 @@ const AnimatedSvg = Animated.createAnimatedComponent(Svg);
1010

1111
export interface LoadingSpinnerProps {
1212
size?: Exclude<SizeType, 'xs' | 'xxs'>;
13-
color?: Exclude<
14-
ColorType,
15-
'fg-100' | 'error-100' | 'fg-300' | 'inverse-000' | 'inverse-100' | 'success-100'
16-
>;
13+
color?: Exclude<ColorType, 'fg-100' | 'error-100' | 'fg-300' | 'success-100'>;
1714
style?: StyleProp<ViewStyle>;
1815
}
1916

‎packages/ui/src/composites/wui-button/styles.ts

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,8 @@ export const getThemedButtonStyle = (
1414

1515
if (disabled) {
1616
return {
17-
backgroundColor: variant === 'fill' ? theme['gray-glass-020'] : theme['gray-glass-010'],
18-
borderColor: theme['gray-glass-005']
17+
backgroundColor: variant === 'fill' ? theme['gray-glass-002'] : theme['gray-glass-010'],
18+
borderColor: theme['gray-glass-002']
1919
};
2020
}
2121

@@ -38,7 +38,9 @@ export const getThemedTextStyle = (
3838
disabled?: boolean
3939
): StyleProp<any> => {
4040
if (disabled) {
41-
return variant === 'fill' ? { color: theme['fg-300'] } : { color: theme['gray-glass-020'] };
41+
return variant === 'fill'
42+
? { color: theme['gray-glass-020'] }
43+
: { color: theme['gray-glass-020'] };
4244
}
4345

4446
return variant === 'fill'

‎packages/ui/src/composites/wui-connect-button/index.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ export type ConnectButtonProps = NativeProps & {
2020
children: React.ReactNode;
2121
style?: StyleProp<ViewStyle>;
2222
loading?: boolean;
23+
disabled?: boolean;
2324
};
2425

2526
export function ConnectButton({
@@ -28,6 +29,7 @@ export function ConnectButton({
2829
onPress,
2930
style,
3031
loading,
32+
disabled,
3133
...rest
3234
}: ConnectButtonProps) {
3335
const Theme = useTheme();
@@ -66,12 +68,12 @@ export function ConnectButton({
6668
const loadingTemplate = () => {
6769
if (!loading) return null;
6870

69-
return <LoadingSpinner size={size} style={styles.loader} />;
71+
return <LoadingSpinner size={size} style={styles.loader} color="inverse-100" />;
7072
};
7173

7274
return (
7375
<AnimatedPressable
74-
disabled={loading}
76+
disabled={loading || disabled}
7577
style={[styles.button, styles[`${size}Button`], { backgroundColor, borderColor }, style]}
7678
onPressIn={onPressIn}
7779
onPressOut={onPressOut}

‎packages/ui/src/composites/wui-connect-button/styles.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,15 +13,15 @@ export const getThemedButtonStyle = (
1313

1414
if (loading) {
1515
return {
16-
backgroundColor: theme['gray-glass-015'],
17-
borderColor: theme['gray-glass-005']
16+
...buttonBaseStyle,
17+
backgroundColor: theme['accent-080']
1818
};
1919
}
2020

2121
if (pressed) {
2222
return {
2323
...buttonBaseStyle,
24-
backgroundColor: theme['accent-020']
24+
backgroundColor: theme['accent-080']
2525
};
2626
}
2727

@@ -36,7 +36,7 @@ export const getThemedTextStyle = (
3636
loading?: boolean
3737
): StyleProp<any> => {
3838
if (loading) {
39-
return { color: theme['accent-100'] };
39+
return { color: theme['inverse-100'] };
4040
}
4141

4242
return { color: theme['inverse-100'] };

0 commit comments

Comments
 (0)