Skip to content

Commit 1f97096

Browse files
riyanshu-patroriyanshu-patro
committed
chore(ui-kit): update core sdk to v2.0.8
1 parent 74e7337 commit 1f97096

File tree

6 files changed

+102
-95
lines changed

6 files changed

+102
-95
lines changed

‎packages/ui-kit/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
"dependencies": {
2020
"@coral-xyz/anchor": "^0.31.1",
2121
"@metamask/sdk": "^0.32.0",
22-
"@pushchain/core": "2.0.7",
22+
"@pushchain/core": "2.0.8",
2323
"@solana/web3.js": "^1.98.2",
2424
"@walletconnect/ethereum-provider": "^2.21.5",
2525
"buffer": "^6.0.3",

‎packages/ui-kit/src/lib/components/LoginModal/index.tsx‎

Lines changed: 62 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -103,11 +103,11 @@ const LoginModal: FC<LoginModalProps> = ({
103103
)}
104104
{isWalletVisible ? (
105105
<FrameContainer
106-
iswalletminimised={isWalletMinimised}
107-
universalaccount={universalAccount}
108-
accountmenuvariant={modal?.connectedLayout}
109-
modaldefaults={modal}
110-
style={{ top, left }}
106+
$isWalletMinimised={isWalletMinimised}
107+
$universalAccount={universalAccount}
108+
$accountMenuVariant={modal?.connectedLayout}
109+
$modalDefaults={modal}
110+
$style={{ top, left }}
111111
>
112112
{isIframeLoading && (
113113
<FrameLoadingContainer>
@@ -132,10 +132,10 @@ const LoginModal: FC<LoginModalProps> = ({
132132
)}
133133

134134
<FrameSubContainer
135-
iswalletminimised={isWalletMinimised}
136-
isiframeloading={isIframeLoading}
135+
$isWalletMinimised={isWalletMinimised}
136+
$isIframeLoading={isIframeLoading}
137137
>
138-
{/* <AccountContainer universalaccount={universalaccount}>
138+
{/* <AccountContainer $universalAccount={universalaccount}>
139139
{universalAccount ? (
140140
<DashButtonContainer onClick={() => setMinimiseWallet(true)}>
141141
<CrossIcon
@@ -163,7 +163,7 @@ const LoginModal: FC<LoginModalProps> = ({
163163
{modal?.appPreview &&
164164
modalAppData &&
165165
modal?.loginLayout === PushUI.CONSTANTS.LOGIN.LAYOUT.SPLIT && (
166-
<AppPreviewContainer universalaccount={universalAccount}>
166+
<AppPreviewContainer $universalAccount={universalAccount}>
167167
<AppContainer>
168168
{modalAppData?.logoURL && (
169169
<ImageContainer>
@@ -175,10 +175,10 @@ const LoginModal: FC<LoginModalProps> = ({
175175
)}
176176

177177
<TextContainer
178-
thememode={
178+
$themeMode={
179179
themeMode ? themeMode : PushUI.CONSTANTS.THEME.DARK
180180
}
181-
textcolor={
181+
$textColor={
182182
themeMode === PushUI.CONSTANTS.THEME.LIGHT
183183
? '#F5F6F8'
184184
: '#17181b'
@@ -238,64 +238,64 @@ const BlurBackground = styled.div`
238238
`;
239239

240240
const FrameContainer = styled.div<{
241-
universalaccount: UniversalAccount | null;
242-
iswalletminimised: boolean;
243-
accountmenuvariant: ModalProps['connectedLayout'];
244-
modaldefaults?: ModalProps;
245-
style?: Record<'top' | 'left', number>;
241+
$universalAccount: UniversalAccount | null;
242+
$isWalletMinimised: boolean;
243+
$accountMenuVariant: ModalProps['connectedLayout'];
244+
$modalDefaults?: ModalProps;
245+
$style?: Record<'top' | 'left', number>;
246246
}>`
247247
position: fixed;
248-
top: ${({ style }) => `${style?.top}px`};
249-
left: ${({ style }) => `${style?.left}px`};
248+
top: ${({ $style }) => `${$style?.top}px`};
249+
left: ${({ $style }) => `${$style?.left}px`};
250250
display: flex;
251251
flex-direction: column;
252-
background-image: url(${({ modaldefaults }) => modaldefaults?.bgImage});
252+
background-image: url(${({ $modalDefaults }) => $modalDefaults?.bgImage});
253253
background-size: cover;
254-
background-color: ${({universalaccount, accountmenuvariant}) =>
255-
universalaccount && accountmenuvariant === PushUI.CONSTANTS.CONNECTED.LAYOUT.HOVER ?
254+
background-color: ${({$universalAccount, $accountMenuVariant}) =>
255+
$universalAccount && $accountMenuVariant === PushUI.CONSTANTS.CONNECTED.LAYOUT.HOVER ?
256256
'transparent' :
257257
'var(--pw-int-bg-primary-color)'
258258
};
259-
border-radius: ${({ universalaccount }) =>
260-
universalaccount ? '10px' : 'unset'};
259+
border-radius: ${({ $universalAccount }) =>
260+
$universalAccount ? '10px' : 'unset'};
261261
z-index: 999;
262262
263-
width: ${({ universalaccount, iswalletminimised, accountmenuvariant }) =>
264-
iswalletminimised
263+
width: ${({ $universalAccount, $isWalletMinimised, $accountMenuVariant }) =>
264+
$isWalletMinimised
265265
? '0px'
266-
: universalaccount
267-
? accountmenuvariant === PushUI.CONSTANTS.CONNECTED.LAYOUT.FULL
266+
: $universalAccount
267+
? $accountMenuVariant === PushUI.CONSTANTS.CONNECTED.LAYOUT.FULL
268268
? '100%'
269269
: '450px'
270270
: '100vw'};
271-
height: ${({ universalaccount, iswalletminimised, accountmenuvariant }) =>
272-
iswalletminimised
271+
height: ${({ $universalAccount, $isWalletMinimised, $accountMenuVariant }) =>
272+
$isWalletMinimised
273273
? '0px'
274-
: universalaccount
275-
? accountmenuvariant === PushUI.CONSTANTS.CONNECTED.LAYOUT.FULL
274+
: $universalAccount
275+
? $accountMenuVariant === PushUI.CONSTANTS.CONNECTED.LAYOUT.FULL
276276
? '100vw'
277277
: '675px'
278278
: '100vh'};
279-
right: ${({ universalaccount, accountmenuvariant }) =>
280-
universalaccount
281-
? accountmenuvariant === PushUI.CONSTANTS.CONNECTED.LAYOUT.FULL
279+
right: ${({ $universalAccount, $accountMenuVariant }) =>
280+
$universalAccount
281+
? $accountMenuVariant === PushUI.CONSTANTS.CONNECTED.LAYOUT.FULL
282282
? '0'
283283
: '10px'
284284
: '0'};
285-
top: ${({ universalaccount, accountmenuvariant }) =>
286-
universalaccount
287-
? accountmenuvariant === PushUI.CONSTANTS.CONNECTED.LAYOUT.FULL
285+
top: ${({ $universalAccount, $accountMenuVariant }) =>
286+
$universalAccount
287+
? $accountMenuVariant === PushUI.CONSTANTS.CONNECTED.LAYOUT.FULL
288288
? '0'
289289
: '70px'
290290
: '0'};
291291
292292
@media (max-width: 425px) {
293-
width: ${({ universalaccount, iswalletminimised }) =>
294-
iswalletminimised ? '0px' : universalaccount ? '100%' : '100%'};
295-
right: ${({ universalaccount }) => (universalaccount ? '2%' : '0')};
296-
top: ${({ universalaccount, accountmenuvariant }) =>
297-
universalaccount
298-
? accountmenuvariant === PushUI.CONSTANTS.CONNECTED.LAYOUT.FULL
293+
width: ${({ $universalAccount, $isWalletMinimised }) =>
294+
$isWalletMinimised ? '0px' : $universalAccount ? '100%' : '100%'};
295+
right: ${({ $universalAccount }) => ($universalAccount ? '2%' : '0')};
296+
top: ${({ $universalAccount, $accountMenuVariant }) =>
297+
$universalAccount
298+
? $accountMenuVariant === PushUI.CONSTANTS.CONNECTED.LAYOUT.FULL
299299
? '0'
300300
: '8%'
301301
: '0'};
@@ -341,18 +341,18 @@ const FrameLoadingContainer = styled.div`
341341
`;
342342

343343
const FrameSubContainer = styled.div<{
344-
iswalletminimised: boolean;
345-
isiframeloading: boolean;
344+
$isWalletMinimised: boolean;
345+
$isIframeLoading: boolean;
346346
}>`
347-
display: ${({ iswalletminimised, isiframeloading }) =>
348-
iswalletminimised || isiframeloading ? 'none' : 'flex'};
347+
display: ${({ $isWalletMinimised, $isIframeLoading }) =>
348+
$isWalletMinimised || $isIframeLoading ? 'none' : 'flex'};
349349
width: 100%;
350350
height: 100%;
351351
flex-direction: column;
352352
`;
353353

354354
const AccountContainer = styled.div<{
355-
universalaccount: UniversalAccount | null;
355+
$universalAccount: UniversalAccount | null;
356356
}>`
357357
width: 100%;
358358
display: flex;
@@ -362,10 +362,10 @@ const AccountContainer = styled.div<{
362362
right: 8px;
363363
justify-content: flex-end;
364364
// padding: var(--spacing-xxs) var(--spacing-xxs);
365-
border-top-right-radius: ${({ universalaccount }) =>
366-
universalaccount ? '10px' : '0px'};
367-
border-top-left-radius: ${({ universalaccount }) =>
368-
universalaccount ? '10px' : '0px'};
365+
border-top-right-radius: ${({ $universalAccount }) =>
366+
$universalAccount ? '10px' : '0px'};
367+
border-top-left-radius: ${({ $universalAccount }) =>
368+
$universalAccount ? '10px' : '0px'};
369369
background-color: transparent;
370370
`;
371371

@@ -374,9 +374,9 @@ const SplitContainer = styled.div`
374374
`;
375375

376376
const AppPreviewContainer = styled.div<{
377-
universalaccount: UniversalAccount | null;
377+
$universalAccount: UniversalAccount | null;
378378
}>`
379-
display: ${({ universalaccount }) => (universalaccount ? 'none' : 'flex')};
379+
display: ${({ $universalAccount }) => ($universalAccount ? 'none' : 'flex')};
380380
align-items: center;
381381
justify-content: center;
382382
flex: 1;
@@ -415,10 +415,10 @@ const Image = styled.img`
415415
border: 1px solid var(--stroke-secondary, #313338);
416416
`;
417417
const TextContainer = styled.div<{
418-
thememode:
418+
$themeMode:
419419
| typeof PushUI.CONSTANTS.THEME.LIGHT
420420
| typeof PushUI.CONSTANTS.THEME.DARK;
421-
textcolor: string;
421+
$textColor: string;
422422
}>`
423423
font-family: var(--pw-int-font-family);
424424
src: url('./assets/fonts/FKGroteskNeue-Regular.woff2') format('woff2'),
@@ -427,13 +427,13 @@ const TextContainer = styled.div<{
427427
font-size: 16px;
428428
font-weight: 400;
429429
line-height: 22px;
430-
color: ${({ thememode, textcolor }) =>
431-
thememode === PushUI.CONSTANTS.THEME.LIGHT
432-
? textcolor
433-
? textcolor
430+
color: ${({ $themeMode, $textColor }) =>
431+
$themeMode === PushUI.CONSTANTS.THEME.LIGHT
432+
? $textColor
433+
? $textColor
434434
: '#17181b'
435-
: textcolor
436-
? textcolor
435+
: $textColor
436+
? $textColor
437437
: '#F5F6F8'};
438438
`;
439439

‎packages/ui-kit/src/lib/components/PushUniversalAccountButton/ConnectWalletButton.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -36,9 +36,9 @@ const ConnectWalletButton: FC<ConnectPushWalletButtonProps> = ({
3636

3737
return (
3838
<Button
39-
bgcolor="var(--pwauth-btn-connect-bg-color)"
40-
textcolor="var(--pwauth-btn-connect-text-color)"
41-
borderradius="var(--pwauth-btn-connect-border-radius)"
39+
bgColor="var(--pwauth-btn-connect-bg-color)"
40+
textColor="var(--pwauth-btn-connect-text-color)"
41+
borderRadius="var(--pwauth-btn-connect-border-radius)"
4242
onClick={handleConnectWalletButton}
4343
disabled={isConnectButtonDisbaled || isLoading}
4444
>

‎packages/ui-kit/src/lib/components/PushUniversalAccountButton/TogglePushWalletButton.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -37,9 +37,9 @@ const TogglePushWalletButton: React.FC<TogglePushWalletButtonProps> = ({
3737
<>
3838
<Button
3939
onClick={() => setMinimiseWallet(!isWalletMinimised)}
40-
bgcolor="var(--pwauth-btn-connected-bg-color)"
41-
textcolor="var(--pwauth-btn-connected-text-color)"
42-
borderradius="var(--pwauth-btn-connect-border-radius)"
40+
bgColor="var(--pwauth-btn-connected-bg-color)"
41+
textColor="var(--pwauth-btn-connected-text-color)"
42+
borderRadius="var(--pwauth-btn-connect-border-radius)"
4343
gap='8px'
4444
padding='12px'
4545
ref={toggleButtonRef}

‎packages/ui-kit/src/lib/components/common/Button.tsx‎

Lines changed: 28 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -10,26 +10,33 @@ export type ButtonProps = {
1010
/* Child react nodes rendered by Box */
1111
children?: ReactNode;
1212
/* Background color of the button */
13-
bgcolor?: React.CSSProperties['backgroundColor'];
13+
bgColor?: React.CSSProperties['backgroundColor'];
1414
/* Text color of the button */
15-
textcolor?: React.CSSProperties['color'];
15+
textColor?: React.CSSProperties['color'];
1616
/* Border Radius of the button */
17-
borderradius?: React.CSSProperties['borderRadius'];
17+
borderRadius?: React.CSSProperties['borderRadius'];
1818
/* Spacing between the elements of the button */
1919
gap?: React.CSSProperties['gap'];
2020
padding?: React.CSSProperties['padding'];
2121
/* Sets button as disabled */
2222
disabled?: boolean;
2323
} & TransformedHTMLAttributes<HTMLButtonElement>;
2424

25-
const StyledButton = styled.button<ButtonProps>`
25+
const StyledButton = styled.button<{
26+
$bgColor?: ButtonProps['bgColor'];
27+
$textColor?: ButtonProps['textColor'];
28+
$borderRadius?: ButtonProps['borderRadius'];
29+
$gap?: ButtonProps['gap'];
30+
$padding?: ButtonProps['padding'];
31+
$disabled?: ButtonProps['disabled'];
32+
}>`
2633
/* Common Button CSS */
2734
2835
align-items: center;
29-
cursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};
30-
background: ${(props) => (props.bgcolor ? props.bgcolor : '#d548ec')};
31-
color: ${(props) =>
32-
props.textcolor ? props.textcolor : 'rgba(255, 255, 255, 1)'};
36+
cursor: ${({ $disabled }) => ($disabled ? 'not-allowed' : 'pointer')};
37+
background: ${({ $bgColor }) => ($bgColor ? $bgColor : '#d548ec')};
38+
color: ${({ $textColor }) =>
39+
$textColor ? $textColor : 'rgba(255, 255, 255, 1)'};
3340
display: flex;
3441
font-family: var(--pw-int-font-family);
3542
justify-content: center;
@@ -39,31 +46,31 @@ const StyledButton = styled.button<ButtonProps>`
3946
font-style: normal;
4047
font-weight: 500;
4148
line-height: 16px;
42-
padding: ${(props) =>
43-
props.padding ? props.padding : '16px 24px'};
49+
padding: ${({ $padding }) =>
50+
$padding ? $padding : '16px 24px'};
4451
min-width: 100px;
4552
width: inherit;
4653
height: 48px;
47-
gap: ${(props) =>
48-
props.gap ? props.gap : '4px'};
54+
gap: ${({ $gap }) =>
55+
$gap ? $gap : '4px'};
4956
border: none;
50-
border-radius: ${(props) =>
51-
props.borderradius ? props.borderradius : '12px'};
57+
border-radius: ${({ $borderRadius }) =>
58+
$borderRadius ? $borderRadius : '12px'};
5259
white-space: nowrap;
5360
`;
5461

5562
const Button = forwardRef<HTMLButtonElement, ButtonProps>(
56-
({ disabled, bgcolor, textcolor, borderradius, gap, padding, children, ...props }, ref) => (
63+
({ disabled, bgColor, textColor, borderRadius, gap, padding, children, ...props }, ref) => (
5764
<StyledButton
5865
{...(disabled ? { 'aria-disabled': true } : {})}
59-
disabled={disabled}
6066
role="button"
6167
ref={ref}
62-
bgcolor={bgcolor}
63-
textcolor={textcolor}
64-
borderradius={borderradius}
65-
gap={gap}
66-
padding={padding}
68+
$bgColor={bgColor}
69+
$textColor={textColor}
70+
$borderRadius={borderRadius}
71+
$gap={gap}
72+
$padding={padding}
73+
$disabled={disabled}
6774
{...props}
6875
>
6976
{children}

‎packages/ui-kit/yarn.lock‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -783,9 +783,9 @@ __metadata:
783783
languageName: node
784784
linkType: hard
785785

786-
"@pushchain/core@npm:2.0.7":
787-
version: 2.0.7
788-
resolution: "@pushchain/core@npm:2.0.7"
786+
"@pushchain/core@npm:2.0.8":
787+
version: 2.0.8
788+
resolution: "@pushchain/core@npm:2.0.8"
789789
dependencies:
790790
"@bufbuild/protobuf": "npm:^2.0.0"
791791
"@coral-xyz/anchor": "npm:^0.31.0"
@@ -802,7 +802,7 @@ __metadata:
802802
tslib: "npm:^2.3.0"
803803
tweetnacl: "npm:^1.0.3"
804804
viem: "npm:2.27.2"
805-
checksum: 10/7de81e5372864304de154e64a2d81736cd4f18f4676dcc9b470e4867daf89250efd5cd69a55707951f6d3e6429e453177103cc4144d37b642c0f32cfb07b1759
805+
checksum: 10/766ca3786aaea3693f2ce2df8e184fdaeda765202fedbbdd69b82abdf51e40ebc43e78ad030872304aff65d16e13d52fc19ffca92cdcd937074ca1ed40640b70
806806
languageName: node
807807
linkType: hard
808808

@@ -812,7 +812,7 @@ __metadata:
812812
dependencies:
813813
"@coral-xyz/anchor": "npm:^0.31.1"
814814
"@metamask/sdk": "npm:^0.32.0"
815-
"@pushchain/core": "npm:2.0.7"
815+
"@pushchain/core": "npm:2.0.8"
816816
"@solana/web3.js": "npm:^1.98.2"
817817
"@types/react": "npm:^18.3.13"
818818
"@types/react-is": "npm:^19"

0 commit comments

Comments
 (0)