@pagamio/frontend-commons-lib 0.8.305 → 0.8.307
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/lib/auth/components/LoginPage.js +12 -6
- package/lib/styles.css +3 -0
- package/package.json +1 -1
|
@@ -306,21 +306,27 @@ export function PagamioLoginPage({ logo, text = loginPageDefaultText, appLabel,
|
|
|
306
306
|
const passwordTabLabel = phoneOtpConfig?.passwordTabLabel ??
|
|
307
307
|
phonePinConfig?.passwordTabLabel ??
|
|
308
308
|
usernamePinConfig?.passwordTabLabel ??
|
|
309
|
-
'Email
|
|
310
|
-
const phoneTabLabel = phoneOtpConfig?.tabLabel ?? phonePinConfig?.tabLabel ??
|
|
311
|
-
const usernameTabLabel = usernamePinConfig?.tabLabel ?? 'Login Number
|
|
312
|
-
return (_jsx(AuthPageLayout, { appLabel: appLabel, title: text.welcomeTitle, subtitle: text.welcomeSubtitle, errorMessage: activeTab === 'password' ? (error ?? authError?.message) : undefined, logo: logo, className: className, horizontal: false, sideContent: features && features.length > 0 ? _jsx(FeatureCarousel, { features: features }) : undefined, sideContentClass: sideContentClass, footer: footer, children: _jsxs("div", { className: "mt-8", children: [showTabs && (_jsxs("div", { className: "mb-6 flex rounded-lg border border-border
|
|
309
|
+
'Email';
|
|
310
|
+
const phoneTabLabel = phoneOtpConfig?.tabLabel ?? phonePinConfig?.tabLabel ?? 'Phone';
|
|
311
|
+
const usernameTabLabel = usernamePinConfig?.tabLabel ?? 'Login Number';
|
|
312
|
+
return (_jsx(AuthPageLayout, { appLabel: appLabel, title: text.welcomeTitle, subtitle: text.welcomeSubtitle, errorMessage: activeTab === 'password' ? (error ?? authError?.message) : undefined, logo: logo, className: className, horizontal: false, sideContent: features && features.length > 0 ? _jsx(FeatureCarousel, { features: features }) : undefined, sideContentClass: sideContentClass, footer: footer, children: _jsxs("div", { className: "mt-8", children: [showTabs && (_jsxs("div", { className: "mb-6 flex divide-x divide-border overflow-hidden rounded-lg border border-border", role: "tablist", "aria-label": "Login method", children: [_jsx("button", { type: "button", role: "tab", "aria-selected": activeTab === 'password', onClick: () => setActiveTab('password'), className: `flex-1 whitespace-nowrap px-3 py-2.5 text-center text-sm font-medium transition-colors ${activeTab === 'password'
|
|
313
|
+
? 'bg-primary text-primary-foreground'
|
|
314
|
+
: 'bg-background text-foreground/70 hover:bg-muted'}`, children: passwordTabLabel }), showPhoneTab && (_jsx("button", { type: "button", role: "tab", "aria-selected": activeTab === 'phone', onClick: () => {
|
|
313
315
|
setActiveTab('phone');
|
|
314
316
|
setPhoneStep('enterPhone');
|
|
315
317
|
setPhoneOtpValue('');
|
|
316
318
|
setPhonePinValue('');
|
|
317
319
|
setPhoneError(null);
|
|
318
|
-
}, className: `flex-1 py-2 text-sm font-medium transition-colors ${activeTab === 'phone'
|
|
320
|
+
}, className: `flex-1 whitespace-nowrap px-3 py-2.5 text-center text-sm font-medium transition-colors ${activeTab === 'phone'
|
|
321
|
+
? 'bg-primary text-primary-foreground'
|
|
322
|
+
: 'bg-background text-foreground/70 hover:bg-muted'}`, children: phoneTabLabel })), showUsernameTab && (_jsx("button", { type: "button", role: "tab", "aria-selected": activeTab === 'username', onClick: () => {
|
|
319
323
|
setActiveTab('username');
|
|
320
324
|
setUsernameStep('enterLoginNumber');
|
|
321
325
|
setLoginNumberPinValue('');
|
|
322
326
|
setUsernameError(null);
|
|
323
|
-
}, className: `flex-1 py-2 text-sm font-medium transition-colors ${activeTab === 'username'
|
|
327
|
+
}, className: `flex-1 whitespace-nowrap px-3 py-2.5 text-center text-sm font-medium transition-colors ${activeTab === 'username'
|
|
328
|
+
? 'bg-primary text-primary-foreground'
|
|
329
|
+
: 'bg-background text-foreground/70 hover:bg-muted'}`, children: usernameTabLabel }))] })), activeTab === 'password' && (_jsxs(_Fragment, { children: [_jsx(FormEngine, { fields: loginFields, onSubmit: handleSubmit, layout: "vertical", className: "mb-0 px-0", submitButtonClass: "w-full", submitButtonText: isLoading ? text.loadingButtonLabel : text.loginButtonLabel, onCancel: () => { }, showCancelButton: false, showSubmittingText: false, formRef: formRef, initialValues: {
|
|
324
330
|
...(loginFieldType === 'email' ? { email: '' } : { username: '' }),
|
|
325
331
|
password: '',
|
|
326
332
|
rememberMe: false,
|
package/lib/styles.css
CHANGED
|
@@ -1927,6 +1927,9 @@ video {
|
|
|
1927
1927
|
border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
|
|
1928
1928
|
border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
|
|
1929
1929
|
}
|
|
1930
|
+
.divide-border > :not([hidden]) ~ :not([hidden]) {
|
|
1931
|
+
border-color: hsl(var(--border));
|
|
1932
|
+
}
|
|
1930
1933
|
.divide-gray-100 > :not([hidden]) ~ :not([hidden]) {
|
|
1931
1934
|
--tw-divide-opacity: 1;
|
|
1932
1935
|
border-color: rgb(243 244 246 / var(--tw-divide-opacity, 1));
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pagamio/frontend-commons-lib",
|
|
3
3
|
"description": "Pagamio library for Frontend reusable components like the form engine and table container",
|
|
4
|
-
"version": "0.8.
|
|
4
|
+
"version": "0.8.307",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public",
|
|
7
7
|
"provenance": false
|