valtech-components 2.0.590 → 2.0.591
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/esm2022/lib/components/organisms/rotating-text/rotating-text.component.mjs +180 -0
- package/esm2022/lib/components/organisms/rotating-text/types.mjs +2 -0
- package/esm2022/lib/services/auth/auth.service.mjs +4 -4
- package/esm2022/lib/services/auth/index.mjs +1 -3
- package/esm2022/lib/services/auth/types.mjs +1 -1
- package/esm2022/public-api.mjs +3 -1
- package/fesm2022/valtech-components.mjs +180 -219
- package/fesm2022/valtech-components.mjs.map +1 -1
- package/lib/components/atoms/rights-footer/rights-footer.component.d.ts +1 -1
- package/lib/components/atoms/text/text.component.d.ts +1 -1
- package/lib/components/organisms/article/article.component.d.ts +4 -4
- package/lib/components/organisms/rotating-text/rotating-text.component.d.ts +47 -0
- package/lib/components/organisms/rotating-text/types.d.ts +28 -0
- package/lib/components/organisms/toolbar/toolbar.component.d.ts +1 -1
- package/lib/services/auth/auth.service.d.ts +3 -3
- package/lib/services/auth/index.d.ts +0 -1
- package/lib/services/auth/types.d.ts +0 -52
- package/package.json +1 -7
- package/public-api.d.ts +2 -0
- package/esm2022/lib/services/auth/google-auth.service.mjs +0 -221
- package/lib/services/auth/google-auth.service.d.ts +0 -102
|
@@ -40,7 +40,6 @@ import { provideMessaging, getMessaging, Messaging, getToken, deleteToken, onMes
|
|
|
40
40
|
import * as i1$7 from '@angular/fire/storage';
|
|
41
41
|
import { provideStorage, getStorage, connectStorageEmulator, ref, uploadBytesResumable, getDownloadURL, getMetadata, deleteObject, listAll } from '@angular/fire/storage';
|
|
42
42
|
import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
|
|
43
|
-
import { GoogleAuth } from '@codetrix-studio/capacitor-google-auth';
|
|
44
43
|
import 'prismjs/components/prism-scss';
|
|
45
44
|
import 'prismjs/components/prism-json';
|
|
46
45
|
|
|
@@ -28639,15 +28638,15 @@ class AuthService {
|
|
|
28639
28638
|
}));
|
|
28640
28639
|
}
|
|
28641
28640
|
/**
|
|
28642
|
-
* Maneja autenticación exitosa desde fuentes externas (OAuth,
|
|
28641
|
+
* Maneja autenticación exitosa desde fuentes externas (OAuth, etc).
|
|
28643
28642
|
* Guarda tokens, actualiza estado, inicia Firebase si corresponde.
|
|
28644
28643
|
*
|
|
28645
28644
|
* @param authResult - Resultado de autenticación con tokens
|
|
28646
28645
|
*
|
|
28647
28646
|
* @example
|
|
28648
28647
|
* ```typescript
|
|
28649
|
-
* // Desde
|
|
28650
|
-
*
|
|
28648
|
+
* // Desde un flujo OAuth externo
|
|
28649
|
+
* externalOAuth.signIn().subscribe({
|
|
28651
28650
|
* next: (result) => {
|
|
28652
28651
|
* this.authService.setExternalAuth(result);
|
|
28653
28652
|
* }
|
|
@@ -30094,220 +30093,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
30094
30093
|
`, styles: [".oauth-callback{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.oauth-callback__spinner{width:40px;height:40px;border:3px solid #f3f3f3;border-top:3px solid #3498db;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.oauth-callback__text{color:#666;font-size:14px}\n"] }]
|
|
30095
30094
|
}] });
|
|
30096
30095
|
|
|
30097
|
-
/**
|
|
30098
|
-
* Servicio de autenticación con Google usando SDK nativo.
|
|
30099
|
-
*
|
|
30100
|
-
* Este servicio utiliza `@codetrix-studio/capacitor-google-auth` que funciona
|
|
30101
|
-
* tanto en web como en aplicaciones Capacitor (iOS/Android).
|
|
30102
|
-
*
|
|
30103
|
-
* Para web, utiliza el popup nativo de Google Sign-In.
|
|
30104
|
-
* Para mobile, utiliza el SDK nativo de Google.
|
|
30105
|
-
*
|
|
30106
|
-
* @example
|
|
30107
|
-
* ```typescript
|
|
30108
|
-
* // En main.ts o app.config.ts
|
|
30109
|
-
* import { provideGoogleAuth } from 'valtech-components';
|
|
30110
|
-
*
|
|
30111
|
-
* export const appConfig: ApplicationConfig = {
|
|
30112
|
-
* providers: [
|
|
30113
|
-
* provideGoogleAuth({
|
|
30114
|
-
* clientId: 'your-google-client-id.apps.googleusercontent.com'
|
|
30115
|
-
* })
|
|
30116
|
-
* ]
|
|
30117
|
-
* };
|
|
30118
|
-
*
|
|
30119
|
-
* // En el componente
|
|
30120
|
-
* import { GoogleAuthService, AuthService } from 'valtech-components';
|
|
30121
|
-
*
|
|
30122
|
-
* @Component({...})
|
|
30123
|
-
* export class LoginComponent {
|
|
30124
|
-
* private googleAuth = inject(GoogleAuthService);
|
|
30125
|
-
* private auth = inject(AuthService);
|
|
30126
|
-
*
|
|
30127
|
-
* async signInWithGoogle() {
|
|
30128
|
-
* this.googleAuth.signIn().subscribe({
|
|
30129
|
-
* next: (result) => {
|
|
30130
|
-
* // Tokens recibidos del backend
|
|
30131
|
-
* this.auth.handleOAuthSuccess(result);
|
|
30132
|
-
* this.router.navigate(['/']);
|
|
30133
|
-
* },
|
|
30134
|
-
* error: (error) => {
|
|
30135
|
-
* console.error('Google sign-in failed:', error);
|
|
30136
|
-
* }
|
|
30137
|
-
* });
|
|
30138
|
-
* }
|
|
30139
|
-
* }
|
|
30140
|
-
* ```
|
|
30141
|
-
*/
|
|
30142
|
-
class GoogleAuthService {
|
|
30143
|
-
constructor(config, http) {
|
|
30144
|
-
this.config = config;
|
|
30145
|
-
this.http = http;
|
|
30146
|
-
this.initialized = signal(false);
|
|
30147
|
-
this.googleConfig = null;
|
|
30148
|
-
/** Indica si el servicio está inicializado */
|
|
30149
|
-
this.isInitialized = computed(() => this.initialized());
|
|
30150
|
-
}
|
|
30151
|
-
/**
|
|
30152
|
-
* Inicializa el SDK de Google Sign-In.
|
|
30153
|
-
* Debe llamarse una vez, idealmente en APP_INITIALIZER.
|
|
30154
|
-
*
|
|
30155
|
-
* @param googleConfig - Configuración de Google Auth
|
|
30156
|
-
*/
|
|
30157
|
-
async initialize(googleConfig) {
|
|
30158
|
-
if (this.initialized()) {
|
|
30159
|
-
console.log('[GoogleAuth] Already initialized');
|
|
30160
|
-
return;
|
|
30161
|
-
}
|
|
30162
|
-
this.googleConfig = googleConfig;
|
|
30163
|
-
try {
|
|
30164
|
-
await GoogleAuth.initialize({
|
|
30165
|
-
clientId: googleConfig.clientId,
|
|
30166
|
-
scopes: googleConfig.scopes || ['email', 'profile'],
|
|
30167
|
-
grantOfflineAccess: true,
|
|
30168
|
-
});
|
|
30169
|
-
this.initialized.set(true);
|
|
30170
|
-
console.log('[GoogleAuth] Initialized successfully');
|
|
30171
|
-
}
|
|
30172
|
-
catch (error) {
|
|
30173
|
-
console.error('[GoogleAuth] Initialization failed:', error);
|
|
30174
|
-
throw error;
|
|
30175
|
-
}
|
|
30176
|
-
}
|
|
30177
|
-
/**
|
|
30178
|
-
* Inicia el flujo de Google Sign-In y obtiene tokens del backend.
|
|
30179
|
-
*
|
|
30180
|
-
* El flujo es:
|
|
30181
|
-
* 1. Abre popup/SDK nativo de Google
|
|
30182
|
-
* 2. Usuario autoriza
|
|
30183
|
-
* 3. Obtiene ID token de Google
|
|
30184
|
-
* 4. Envía ID token al backend para verificación
|
|
30185
|
-
* 5. Backend verifica con Google y retorna nuestros JWT tokens
|
|
30186
|
-
*
|
|
30187
|
-
* @returns Observable con la respuesta del backend (tokens)
|
|
30188
|
-
*/
|
|
30189
|
-
signIn() {
|
|
30190
|
-
if (!this.initialized()) {
|
|
30191
|
-
return throwError(() => ({
|
|
30192
|
-
code: 'NOT_INITIALIZED',
|
|
30193
|
-
message: 'GoogleAuthService no está inicializado. Llama a initialize() primero.',
|
|
30194
|
-
}));
|
|
30195
|
-
}
|
|
30196
|
-
return from(this.performGoogleSignIn()).pipe(tap(googleUser => {
|
|
30197
|
-
console.log('[GoogleAuth] Google sign-in successful:', {
|
|
30198
|
-
email: googleUser.email,
|
|
30199
|
-
hasIdToken: !!googleUser.idToken,
|
|
30200
|
-
idTokenLength: googleUser.idToken?.length || 0,
|
|
30201
|
-
});
|
|
30202
|
-
}), switchMap(googleUser => this.verifyWithBackend(googleUser)), catchError(error => {
|
|
30203
|
-
console.error('[GoogleAuth] Sign-in error:', error);
|
|
30204
|
-
// Handle Google SDK specific errors
|
|
30205
|
-
if (error?.message?.includes('popup_closed') || error?.code === 'popup_closed_by_user') {
|
|
30206
|
-
return throwError(() => ({
|
|
30207
|
-
code: 'POPUP_CLOSED',
|
|
30208
|
-
message: 'Se cerró la ventana de autenticación de Google',
|
|
30209
|
-
}));
|
|
30210
|
-
}
|
|
30211
|
-
if (error?.message?.includes('access_denied') || error?.code === 'access_denied') {
|
|
30212
|
-
return throwError(() => ({
|
|
30213
|
-
code: 'ACCESS_DENIED',
|
|
30214
|
-
message: 'El usuario denegó el acceso a Google',
|
|
30215
|
-
}));
|
|
30216
|
-
}
|
|
30217
|
-
// Backend errors pass through
|
|
30218
|
-
if (error.code && error.message) {
|
|
30219
|
-
return throwError(() => error);
|
|
30220
|
-
}
|
|
30221
|
-
return throwError(() => ({
|
|
30222
|
-
code: 'GOOGLE_AUTH_ERROR',
|
|
30223
|
-
message: error?.message || 'Error al iniciar sesión con Google',
|
|
30224
|
-
}));
|
|
30225
|
-
}));
|
|
30226
|
-
}
|
|
30227
|
-
/**
|
|
30228
|
-
* Cierra la sesión de Google.
|
|
30229
|
-
* Nota: Esto solo cierra la sesión del SDK de Google,
|
|
30230
|
-
* NO cierra la sesión del backend. Usa AuthService.logout() para eso.
|
|
30231
|
-
*/
|
|
30232
|
-
async signOut() {
|
|
30233
|
-
try {
|
|
30234
|
-
await GoogleAuth.signOut();
|
|
30235
|
-
console.log('[GoogleAuth] Signed out from Google');
|
|
30236
|
-
}
|
|
30237
|
-
catch (error) {
|
|
30238
|
-
console.warn('[GoogleAuth] Sign out error:', error);
|
|
30239
|
-
}
|
|
30240
|
-
}
|
|
30241
|
-
/**
|
|
30242
|
-
* Obtiene el token de autenticación refrescado (si existe sesión).
|
|
30243
|
-
* Nota: GoogleAuth.refresh() solo retorna tokens, no info del usuario.
|
|
30244
|
-
*/
|
|
30245
|
-
async refreshToken() {
|
|
30246
|
-
try {
|
|
30247
|
-
const auth = await GoogleAuth.refresh();
|
|
30248
|
-
if (auth?.idToken) {
|
|
30249
|
-
return {
|
|
30250
|
-
idToken: auth.idToken,
|
|
30251
|
-
accessToken: auth.accessToken,
|
|
30252
|
-
};
|
|
30253
|
-
}
|
|
30254
|
-
return null;
|
|
30255
|
-
}
|
|
30256
|
-
catch {
|
|
30257
|
-
return null;
|
|
30258
|
-
}
|
|
30259
|
-
}
|
|
30260
|
-
/**
|
|
30261
|
-
* Realiza el sign-in con Google usando el SDK nativo.
|
|
30262
|
-
*/
|
|
30263
|
-
async performGoogleSignIn() {
|
|
30264
|
-
const user = await GoogleAuth.signIn();
|
|
30265
|
-
if (!user?.authentication?.idToken) {
|
|
30266
|
-
throw new Error('No se obtuvo ID token de Google');
|
|
30267
|
-
}
|
|
30268
|
-
return {
|
|
30269
|
-
id: user.id || '',
|
|
30270
|
-
email: user.email || '',
|
|
30271
|
-
name: user.name || '',
|
|
30272
|
-
imageUrl: user.imageUrl,
|
|
30273
|
-
idToken: user.authentication.idToken,
|
|
30274
|
-
accessToken: user.authentication.accessToken,
|
|
30275
|
-
};
|
|
30276
|
-
}
|
|
30277
|
-
/**
|
|
30278
|
-
* Verifica el ID token de Google con nuestro backend.
|
|
30279
|
-
*/
|
|
30280
|
-
verifyWithBackend(googleUser) {
|
|
30281
|
-
const request = {
|
|
30282
|
-
idToken: googleUser.idToken,
|
|
30283
|
-
};
|
|
30284
|
-
const url = `${this.config.apiUrl}/v2/auth/oauth/google/verify`;
|
|
30285
|
-
return this.http.post(url, request).pipe(tap(response => {
|
|
30286
|
-
console.log('[GoogleAuth] Backend verification successful:', {
|
|
30287
|
-
hasAccessToken: !!response.accessToken,
|
|
30288
|
-
hasFirebaseToken: !!response.firebaseToken,
|
|
30289
|
-
isNewUser: response.isNewUser,
|
|
30290
|
-
});
|
|
30291
|
-
}), catchError(error => {
|
|
30292
|
-
console.error('[GoogleAuth] Backend verification failed:', error);
|
|
30293
|
-
const authError = {
|
|
30294
|
-
code: error.error?.code || 'VERIFICATION_ERROR',
|
|
30295
|
-
message: error.error?.message || 'Error al verificar credenciales de Google',
|
|
30296
|
-
};
|
|
30297
|
-
return throwError(() => authError);
|
|
30298
|
-
}));
|
|
30299
|
-
}
|
|
30300
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GoogleAuthService, deps: [{ token: VALTECH_AUTH_CONFIG }, { token: i1$8.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
30301
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GoogleAuthService, providedIn: 'root' }); }
|
|
30302
|
-
}
|
|
30303
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GoogleAuthService, decorators: [{
|
|
30304
|
-
type: Injectable,
|
|
30305
|
-
args: [{ providedIn: 'root' }]
|
|
30306
|
-
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
30307
|
-
type: Inject,
|
|
30308
|
-
args: [VALTECH_AUTH_CONFIG]
|
|
30309
|
-
}] }, { type: i1$8.HttpClient }] });
|
|
30310
|
-
|
|
30311
30096
|
/**
|
|
30312
30097
|
* Valtech Auth Service
|
|
30313
30098
|
*
|
|
@@ -31162,6 +30947,182 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
31162
30947
|
type: Output
|
|
31163
30948
|
}] } });
|
|
31164
30949
|
|
|
30950
|
+
/**
|
|
30951
|
+
* val-rotating-text
|
|
30952
|
+
*
|
|
30953
|
+
* A component that rotates through an array of text messages with smooth animations.
|
|
30954
|
+
* Features entrance/exit animations with fade, blur, and scale effects.
|
|
30955
|
+
*
|
|
30956
|
+
* @example
|
|
30957
|
+
* <val-rotating-text
|
|
30958
|
+
* [props]="{
|
|
30959
|
+
* messages: [
|
|
30960
|
+
* { aboveTitle: 'Welcome', title: 'Hello World' },
|
|
30961
|
+
* { aboveTitle: 'Tip:', title: 'Stay curious' }
|
|
30962
|
+
* ],
|
|
30963
|
+
* interval: 4000,
|
|
30964
|
+
* showDots: true
|
|
30965
|
+
* }"
|
|
30966
|
+
* ></val-rotating-text>
|
|
30967
|
+
*
|
|
30968
|
+
* @input props - Configuration for the rotating text component
|
|
30969
|
+
*/
|
|
30970
|
+
class RotatingTextComponent {
|
|
30971
|
+
constructor() {
|
|
30972
|
+
this.intervalId = null;
|
|
30973
|
+
/**
|
|
30974
|
+
* Component configuration.
|
|
30975
|
+
*/
|
|
30976
|
+
this.props = {
|
|
30977
|
+
messages: [],
|
|
30978
|
+
interval: 4000,
|
|
30979
|
+
showDots: true,
|
|
30980
|
+
aboveTitleColor: 'medium',
|
|
30981
|
+
titleColor: 'dark',
|
|
30982
|
+
};
|
|
30983
|
+
// Animation state
|
|
30984
|
+
this.currentIndex = signal(0);
|
|
30985
|
+
this.isEntering = signal(true);
|
|
30986
|
+
this.isExiting = signal(false);
|
|
30987
|
+
// Current message computed from index
|
|
30988
|
+
this.currentMessage = computed(() => this.props.messages[this.currentIndex()]);
|
|
30989
|
+
}
|
|
30990
|
+
// Color values
|
|
30991
|
+
get aboveTitleColorValue() {
|
|
30992
|
+
const color = this.props.aboveTitleColor || 'medium';
|
|
30993
|
+
return color.startsWith('--') || color.startsWith('#') || color.startsWith('rgb')
|
|
30994
|
+
? color
|
|
30995
|
+
: `var(--ion-color-${color})`;
|
|
30996
|
+
}
|
|
30997
|
+
get titleColorValue() {
|
|
30998
|
+
const color = this.props.titleColor || 'dark';
|
|
30999
|
+
return color.startsWith('--') || color.startsWith('#') || color.startsWith('rgb')
|
|
31000
|
+
? color
|
|
31001
|
+
: `var(--ion-color-${color})`;
|
|
31002
|
+
}
|
|
31003
|
+
ngOnInit() {
|
|
31004
|
+
if (this.props.messages.length > 1) {
|
|
31005
|
+
this.startRotation();
|
|
31006
|
+
}
|
|
31007
|
+
}
|
|
31008
|
+
ngOnDestroy() {
|
|
31009
|
+
this.stopRotation();
|
|
31010
|
+
}
|
|
31011
|
+
startRotation() {
|
|
31012
|
+
const interval = this.props.interval ?? 4000;
|
|
31013
|
+
this.intervalId = setInterval(() => {
|
|
31014
|
+
this.rotateToNext();
|
|
31015
|
+
}, interval);
|
|
31016
|
+
}
|
|
31017
|
+
stopRotation() {
|
|
31018
|
+
if (this.intervalId) {
|
|
31019
|
+
clearInterval(this.intervalId);
|
|
31020
|
+
this.intervalId = null;
|
|
31021
|
+
}
|
|
31022
|
+
}
|
|
31023
|
+
rotateToNext() {
|
|
31024
|
+
// Start exit animation
|
|
31025
|
+
this.isEntering.set(false);
|
|
31026
|
+
this.isExiting.set(true);
|
|
31027
|
+
// After exit animation, change text and start enter animation
|
|
31028
|
+
setTimeout(() => {
|
|
31029
|
+
this.currentIndex.update((i) => (i + 1) % this.props.messages.length);
|
|
31030
|
+
this.isExiting.set(false);
|
|
31031
|
+
this.isEntering.set(true);
|
|
31032
|
+
}, 400); // Match exit animation duration
|
|
31033
|
+
}
|
|
31034
|
+
/**
|
|
31035
|
+
* Navigate to a specific message by index.
|
|
31036
|
+
*/
|
|
31037
|
+
goToMessage(index) {
|
|
31038
|
+
if (index === this.currentIndex())
|
|
31039
|
+
return;
|
|
31040
|
+
this.stopRotation();
|
|
31041
|
+
this.isEntering.set(false);
|
|
31042
|
+
this.isExiting.set(true);
|
|
31043
|
+
setTimeout(() => {
|
|
31044
|
+
this.currentIndex.set(index);
|
|
31045
|
+
this.isExiting.set(false);
|
|
31046
|
+
this.isEntering.set(true);
|
|
31047
|
+
if (this.props.messages.length > 1) {
|
|
31048
|
+
this.startRotation();
|
|
31049
|
+
}
|
|
31050
|
+
}, 400);
|
|
31051
|
+
}
|
|
31052
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RotatingTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
31053
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: RotatingTextComponent, isStandalone: true, selector: "val-rotating-text", inputs: { props: "props" }, ngImport: i0, template: `
|
|
31054
|
+
<div
|
|
31055
|
+
class="rotating-banner"
|
|
31056
|
+
[ngStyle]="{ background: props.backgroundColor || 'transparent' }"
|
|
31057
|
+
>
|
|
31058
|
+
<div
|
|
31059
|
+
class="rotating-text"
|
|
31060
|
+
[class.text-enter]="isEntering()"
|
|
31061
|
+
[class.text-exit]="isExiting()"
|
|
31062
|
+
>
|
|
31063
|
+
<div
|
|
31064
|
+
class="above-title"
|
|
31065
|
+
[ngStyle]="{ color: aboveTitleColorValue }"
|
|
31066
|
+
>
|
|
31067
|
+
{{ currentMessage()?.aboveTitle }}
|
|
31068
|
+
</div>
|
|
31069
|
+
<div
|
|
31070
|
+
class="title"
|
|
31071
|
+
[ngStyle]="{ color: titleColorValue }"
|
|
31072
|
+
>
|
|
31073
|
+
{{ currentMessage()?.title }}
|
|
31074
|
+
</div>
|
|
31075
|
+
</div>
|
|
31076
|
+
<div class="progress-dots" *ngIf="props.showDots !== false">
|
|
31077
|
+
<div
|
|
31078
|
+
*ngFor="let message of props.messages; let i = index"
|
|
31079
|
+
class="progress-dot"
|
|
31080
|
+
[class.active]="i === currentIndex()"
|
|
31081
|
+
(click)="goToMessage(i)"
|
|
31082
|
+
></div>
|
|
31083
|
+
</div>
|
|
31084
|
+
</div>
|
|
31085
|
+
`, isInline: true, styles: [".rotating-banner{text-align:center;padding:2rem 1rem;min-height:120px;display:flex;flex-direction:column;justify-content:center;align-items:center}.rotating-text{position:relative;overflow:hidden}.rotating-text .above-title{font-size:1.125rem;margin-bottom:.75rem;font-family:monospace}.rotating-text .title{font-size:2rem;font-weight:900}.text-enter{animation:textEnter .6s ease-out forwards}.text-exit{animation:textExit .4s ease-in forwards}@keyframes textEnter{0%{opacity:0;transform:translateY(20px) scale(.95);filter:blur(4px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}@keyframes textExit{0%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}to{opacity:0;transform:translateY(-20px) scale(.95);filter:blur(4px)}}.progress-dots{display:flex;gap:8px;margin-top:1.5rem}.progress-dot{width:8px;height:8px;border-radius:50%;background:var(--ion-color-medium-tint);transition:all .3s ease;cursor:pointer}.progress-dot.active{background:var(--ion-color-dark);transform:scale(1.3)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
|
31086
|
+
}
|
|
31087
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RotatingTextComponent, decorators: [{
|
|
31088
|
+
type: Component,
|
|
31089
|
+
args: [{ selector: 'val-rotating-text', standalone: true, imports: [CommonModule], template: `
|
|
31090
|
+
<div
|
|
31091
|
+
class="rotating-banner"
|
|
31092
|
+
[ngStyle]="{ background: props.backgroundColor || 'transparent' }"
|
|
31093
|
+
>
|
|
31094
|
+
<div
|
|
31095
|
+
class="rotating-text"
|
|
31096
|
+
[class.text-enter]="isEntering()"
|
|
31097
|
+
[class.text-exit]="isExiting()"
|
|
31098
|
+
>
|
|
31099
|
+
<div
|
|
31100
|
+
class="above-title"
|
|
31101
|
+
[ngStyle]="{ color: aboveTitleColorValue }"
|
|
31102
|
+
>
|
|
31103
|
+
{{ currentMessage()?.aboveTitle }}
|
|
31104
|
+
</div>
|
|
31105
|
+
<div
|
|
31106
|
+
class="title"
|
|
31107
|
+
[ngStyle]="{ color: titleColorValue }"
|
|
31108
|
+
>
|
|
31109
|
+
{{ currentMessage()?.title }}
|
|
31110
|
+
</div>
|
|
31111
|
+
</div>
|
|
31112
|
+
<div class="progress-dots" *ngIf="props.showDots !== false">
|
|
31113
|
+
<div
|
|
31114
|
+
*ngFor="let message of props.messages; let i = index"
|
|
31115
|
+
class="progress-dot"
|
|
31116
|
+
[class.active]="i === currentIndex()"
|
|
31117
|
+
(click)="goToMessage(i)"
|
|
31118
|
+
></div>
|
|
31119
|
+
</div>
|
|
31120
|
+
</div>
|
|
31121
|
+
`, styles: [".rotating-banner{text-align:center;padding:2rem 1rem;min-height:120px;display:flex;flex-direction:column;justify-content:center;align-items:center}.rotating-text{position:relative;overflow:hidden}.rotating-text .above-title{font-size:1.125rem;margin-bottom:.75rem;font-family:monospace}.rotating-text .title{font-size:2rem;font-weight:900}.text-enter{animation:textEnter .6s ease-out forwards}.text-exit{animation:textExit .4s ease-in forwards}@keyframes textEnter{0%{opacity:0;transform:translateY(20px) scale(.95);filter:blur(4px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}@keyframes textExit{0%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}to{opacity:0;transform:translateY(-20px) scale(.95);filter:blur(4px)}}.progress-dots{display:flex;gap:8px;margin-top:1.5rem}.progress-dot{width:8px;height:8px;border-radius:50%;background:var(--ion-color-medium-tint);transition:all .3s ease;cursor:pointer}.progress-dot.active{background:var(--ion-color-dark);transform:scale(1.3)}\n"] }]
|
|
31122
|
+
}], propDecorators: { props: [{
|
|
31123
|
+
type: Input
|
|
31124
|
+
}] } });
|
|
31125
|
+
|
|
31165
31126
|
class LayoutComponent {
|
|
31166
31127
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
31167
31128
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: LayoutComponent, isStandalone: true, selector: "val-layout", ngImport: i0, template: `
|
|
@@ -36558,5 +36519,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
36558
36519
|
* Generated bundle index. Do not edit.
|
|
36559
36520
|
*/
|
|
36560
36521
|
|
|
36561
|
-
export { AD_SIZE_MAP, API_TABLE_COLUMN_LABELS, ARTICLE_SPACING, AccordionComponent, ActionHeaderComponent, ActionType, AdSlotComponent, AdsLoaderService, AdsService, AlertBoxComponent, AnalyticsErrorHandler, AnalyticsRouterTracker, AnalyticsService, ArticleBuilder, ArticleComponent, AuthService, AuthStateService, AuthStorageService, AuthSyncService, AvatarComponent, BannerComponent, BaseDefault, BoxComponent, BreadcrumbComponent, ButtonComponent, ButtonGroupComponent, COMMON_COUNTRY_CODES, COMMON_CURRENCIES, CURRENCY_INFO, CardComponent, CardSection, CardType, CardsCarouselComponent, CheckInputComponent, ChipGroupComponent, ClearDefault, ClearDefaultBlock, ClearDefaultFull, ClearDefaultRound, ClearDefaultRoundBlock, ClearDefaultRoundFull, CodeDisplayComponent, CommandDisplayComponent, CommentComponent, CommentInputComponent, CommentSectionComponent, CompanyFooterComponent, ComponentStates, ConfirmationDialogService, ContentLoaderComponent, CountdownComponent, CurrencyInputComponent, DEFAULT_ADS_CONFIG, DEFAULT_AUTH_CONFIG, DEFAULT_CANCEL_BUTTON, DEFAULT_CONFIRM_BUTTON, DEFAULT_COUNTDOWN_LABELS, DEFAULT_COUNTDOWN_LABELS_EN, DEFAULT_EMPTY_STATE, DEFAULT_INFINITE_LIST_METADATA, DEFAULT_LEGEND_LABELS, DEFAULT_MODAL_CANCEL_BUTTON, DEFAULT_MODAL_CONFIRM_BUTTON, DEFAULT_PAGE_SIZE_OPTIONS, DEFAULT_PAYMENT_STATUS_COLORS, DEFAULT_PAYMENT_STATUS_LABELS, DEFAULT_PLATFORMS, DEFAULT_REFRESHER_METADATA, DEFAULT_SKELETON_CONFIG, DEFAULT_STATUS_COLORS, DEFAULT_STATUS_LABELS, DEFAULT_WINNER_LABELS, DataTableComponent, DateInputComponent, DateRangeInputComponent, DetailSkeletonComponent, DeviceService, DisplayComponent, DividerComponent, DocsApiTableComponent, DocsBreadcrumbComponent, DocsCalloutComponent, DocsCodeExampleComponent, DocsLayoutComponent, DocsNavLinksComponent, DocsNavigationService, DocsSearchComponent, DocsSidebarComponent, DocsTocComponent, DownloadService, EmailInputComponent, ExpandableTextComponent, FabComponent, FileInputComponent, FirebaseService, FirestoreCollectionFactory, FirestoreService, FooterComponent, FooterLinksComponent, FormComponent, FormFooterComponent, FormSkeletonComponent, FunHeaderComponent, GlowCardComponent,
|
|
36522
|
+
export { AD_SIZE_MAP, API_TABLE_COLUMN_LABELS, ARTICLE_SPACING, AccordionComponent, ActionHeaderComponent, ActionType, AdSlotComponent, AdsLoaderService, AdsService, AlertBoxComponent, AnalyticsErrorHandler, AnalyticsRouterTracker, AnalyticsService, ArticleBuilder, ArticleComponent, AuthService, AuthStateService, AuthStorageService, AuthSyncService, AvatarComponent, BannerComponent, BaseDefault, BoxComponent, BreadcrumbComponent, ButtonComponent, ButtonGroupComponent, COMMON_COUNTRY_CODES, COMMON_CURRENCIES, CURRENCY_INFO, CardComponent, CardSection, CardType, CardsCarouselComponent, CheckInputComponent, ChipGroupComponent, ClearDefault, ClearDefaultBlock, ClearDefaultFull, ClearDefaultRound, ClearDefaultRoundBlock, ClearDefaultRoundFull, CodeDisplayComponent, CommandDisplayComponent, CommentComponent, CommentInputComponent, CommentSectionComponent, CompanyFooterComponent, ComponentStates, ConfirmationDialogService, ContentLoaderComponent, CountdownComponent, CurrencyInputComponent, DEFAULT_ADS_CONFIG, DEFAULT_AUTH_CONFIG, DEFAULT_CANCEL_BUTTON, DEFAULT_CONFIRM_BUTTON, DEFAULT_COUNTDOWN_LABELS, DEFAULT_COUNTDOWN_LABELS_EN, DEFAULT_EMPTY_STATE, DEFAULT_INFINITE_LIST_METADATA, DEFAULT_LEGEND_LABELS, DEFAULT_MODAL_CANCEL_BUTTON, DEFAULT_MODAL_CONFIRM_BUTTON, DEFAULT_PAGE_SIZE_OPTIONS, DEFAULT_PAYMENT_STATUS_COLORS, DEFAULT_PAYMENT_STATUS_LABELS, DEFAULT_PLATFORMS, DEFAULT_REFRESHER_METADATA, DEFAULT_SKELETON_CONFIG, DEFAULT_STATUS_COLORS, DEFAULT_STATUS_LABELS, DEFAULT_WINNER_LABELS, DataTableComponent, DateInputComponent, DateRangeInputComponent, DetailSkeletonComponent, DeviceService, DisplayComponent, DividerComponent, DocsApiTableComponent, DocsBreadcrumbComponent, DocsCalloutComponent, DocsCodeExampleComponent, DocsLayoutComponent, DocsNavLinksComponent, DocsNavigationService, DocsSearchComponent, DocsSidebarComponent, DocsTocComponent, DownloadService, EmailInputComponent, ExpandableTextComponent, FabComponent, FileInputComponent, FirebaseService, FirestoreCollectionFactory, FirestoreService, FooterComponent, FooterLinksComponent, FormComponent, FormFooterComponent, FormSkeletonComponent, FunHeaderComponent, GlowCardComponent, GridSkeletonComponent, HeaderComponent, HintComponent, HorizontalScrollComponent, HourInputComponent, HrefComponent, I18nService, INITIAL_AUTH_STATE, INITIAL_MFA_STATE, Icon, IconComponent, IconService, ImageComponent, InAppBrowserService, InfiniteListComponent, InfoComponent, InputI18nHelper, InputType, ItemListComponent, LANG_STORAGE_KEY$1 as LANG_STORAGE_KEY, LOGIN_DEFAULTS, LanguageSelectorComponent, LayeredCardComponent, LayoutComponent, LinkComponent, LinkProcessorService, LinksAccordionComponent, LinksCakeComponent, ListSkeletonComponent, LoadingDirective, LocalStorageService, LocaleService, LoginComponent, MODAL_SIZES, MOTION, MenuComponent, MessagingService, ModalService, MultiSelectSearchComponent, NavigationService, NoContentComponent, NotesBoxComponent, NotificationsService, NumberFromToComponent, NumberInputComponent, NumberStepperComponent, OAuthCallbackComponent, OAuthService, OutlineDefault, OutlineDefaultBlock, OutlineDefaultFull, OutlineDefaultRound, OutlineDefaultRoundBlock, OutlineDefaultRoundFull, PLATFORM_CONFIGS, PageContentComponent, PageTemplateComponent, PageWrapperComponent, PaginationComponent, PaginationService, ParticipantCardComponent, PasswordInputComponent, PhoneInputComponent, PillComponent, PinInputComponent, PlainCodeBoxComponent, PopoverSelectorComponent, PresetService, PriceTagComponent, PrimarySolidBlockButton, PrimarySolidBlockHrefButton, PrimarySolidBlockIconButton, PrimarySolidBlockIconHrefButton, PrimarySolidDefaultRoundButton, PrimarySolidDefaultRoundHrefButton, PrimarySolidDefaultRoundIconButton, PrimarySolidDefaultRoundIconHrefButton, PrimarySolidFullButton, PrimarySolidFullHrefButton, PrimarySolidFullIconButton, PrimarySolidFullIconHrefButton, PrimarySolidLargeRoundButton, PrimarySolidLargeRoundHrefButton, PrimarySolidLargeRoundIconButton, PrimarySolidLargeRoundIconHrefButton, PrimarySolidSmallRoundButton, PrimarySolidSmallRoundHrefButton, PrimarySolidSmallRoundIconButton, PrimarySolidSmallRoundIconHrefButton, ProcessLinksPipe, ProfileSkeletonComponent, ProgressBarComponent, ProgressRingComponent, ProgressStatusComponent, PrompterComponent, QR_PRESETS, QrCodeComponent, QrGeneratorService, QueryBuilder, QuoteBoxComponent, RadioInputComponent, RaffleStatusCardComponent, RangeInputComponent, RatingComponent, RecapCardComponent, RefresherComponent, RightsFooterComponent, RotatingTextComponent, SKELETON_PRESETS, SearchSelectorComponent, SearchbarComponent, SecondarySolidBlockButton, SecondarySolidBlockHrefButton, SecondarySolidBlockIconButton, SecondarySolidBlockIconHrefButton, SecondarySolidDefaultRoundButton, SecondarySolidDefaultRoundHrefButton, SecondarySolidDefaultRoundIconButton, SecondarySolidDefaultRoundIconHrefButton, SecondarySolidFullButton, SecondarySolidFullHrefButton, SecondarySolidFullIconButton, SecondarySolidFullIconHrefButton, SecondarySolidLargeRoundButton, SecondarySolidLargeRoundHrefButton, SecondarySolidLargeRoundIconButton, SecondarySolidLargeRoundIconHrefButton, SecondarySolidSmallRoundButton, SecondarySolidSmallRoundHrefButton, SecondarySolidSmallRoundIconButton, SecondarySolidSmallRoundIconHrefButton, SegmentControlComponent, SelectSearchComponent, SessionService, ShareButtonsComponent, SimpleComponent, SkeletonComponent, SkeletonService, SolidBlockButton, SolidDefault, SolidDefaultBlock, SolidDefaultButton, SolidDefaultFull, SolidDefaultRound, SolidDefaultRoundBlock, SolidDefaultRoundButton, SolidDefaultRoundFull, SolidFullButton, SolidLargeButton, SolidLargeRoundButton, SolidSmallButton, SolidSmallRoundButton, StatsCardComponent, StepperComponent, StorageService, SwipeCarouselComponent, TabbedContentComponent, TableSkeletonComponent, TabsComponent, TestimonialCardComponent, TestimonialCarouselComponent, TextComponent, TextInputComponent, TextareaInputComponent, ThemeOption, ThemeService, TicketGridComponent, TimelineComponent, TitleBlockComponent, TitleComponent, ToastService, ToggleInputComponent, TokenService, ToolbarActionType, ToolbarComponent, TranslatePipe, TypedCollection, VALTECH_ADS_CONFIG, VALTECH_AUTH_CONFIG, VALTECH_DEFAULT_CONTENT, VALTECH_FIREBASE_CONFIG, WinnerDisplayComponent, WizardComponent, WizardFooterComponent, applyDefaultValueToControl, authGuard, authInterceptor, buildPath, collections, createFirebaseConfig, createGlowCardProps, createInitialPaginationState, createNumberFromToField, createTitleProps, extractPathParams, getCollectionPath, getDocumentId, goToTop, guestGuard, hasEmulators, isAtEnd, isCollectionPath, isDocumentPath, isEmulatorMode, isValidPath, joinPath, maxLength, permissionGuard, permissionGuardFromRoute, provideValtechAds, provideValtechAuth, provideValtechAuthInterceptor, provideValtechFirebase, provideValtechI18n, provideValtechPresets, provideValtechSkeleton, query, replaceSpecialChars, resolveColor, resolveInputDefaultValue, roleGuard, storagePaths, superAdminGuard };
|
|
36562
36523
|
//# sourceMappingURL=valtech-components.mjs.map
|